:root{
  --ink:#1C1814; --slate:#5C564E; --mute:#877F74; --line:#E8E2DA;
  --orange:#E8501A; --orange-deep:#C23E0E; --orange-soft:#FFF1E8; --orange-line:#F6CDB6;
  --cream:#FBF6F0; --cream-deep:#F5EBDF;
  --dark:#191512; --paper:#FFFFFF; --green:#1E8A5A;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
html body{font-family:'Inter',system-ui,sans-serif;color:var(--ink);background:var(--paper);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
body h1,body h2,body h3,body h4,body .display{font-family:'Bricolage Grotesque',sans-serif;line-height:1.12;letter-spacing:-0.015em}
.wrap{max-width:1150px;margin:0 auto;padding:0 24px}
section{padding:96px 0}
.sec-cream{background:var(--cream)}
.accent{color:var(--orange)}
a{color:inherit}

/* ---- section header: eyebrow, h2, one lede line. Nothing else. ---- */
.eyebrow{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--line);border-radius:999px;padding:6px 14px;font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--orange-deep);background:var(--paper)}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange)}
.h2{font-size:clamp(29px,3.7vw,42px);font-weight:800;margin:18px 0 0}
.lede{font-size:clamp(16.5px,1.75vw,19px);line-height:1.68;font-weight:400;color:var(--slate);max-width:62ch;margin-top:13px}
.lede strong{color:var(--ink);font-weight:600}
.sec-head{margin-bottom:44px;padding-bottom:26px;border-bottom:1.5px solid var(--line)}

/* ---- buttons ---- */
.btn{display:inline-block;font-weight:700;font-size:15.5px;border-radius:12px;padding:15px 28px;text-decoration:none;transition:transform .15s ease, box-shadow .15s ease;border:none;cursor:pointer;font-family:'Inter',sans-serif}
.btn:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.btn-primary{background:var(--orange);color:#fff;box-shadow:0 6px 18px rgba(232,80,26,.28)}
.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost{border:1.5px solid var(--ink);color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:#fff}

/* ---- callout strip ---- */
.callout{background:var(--orange-soft);border:1.5px solid var(--orange-line);border-radius:14px;padding:17px 21px;font-size:14.6px;color:var(--ink);line-height:1.72;margin:18px 0}
.callout b{font-weight:700}
.callout.plain{background:var(--cream);border-color:var(--cream-deep)}
.sec-cream .callout.plain{background:var(--paper);border-color:var(--line)}

/* ============================================================
   HERO. Entity constellation, pure CSS, diagonal lower edge.
   ============================================================ */
.hero{position:relative;padding:96px 0 80px;background:linear-gradient(180deg,var(--cream) 0%,#fff 100%);overflow:hidden}
/* No hero dot texture. The AI SEO page has one, but none of the other
   service pages do, so it is deliberately absent here. The rule below
   is not redundant: it hard-cancels the pseudo element so that a cached
   copy of the old stylesheet, or a future paste of the AI SEO hero
   block, cannot bring the dots back. Do not re-add. */
.hero::before,.hero::after{content:none!important;background-image:none!important}
.hero-grid{position:relative;display:grid;grid-template-columns:1.02fr .98fr;gap:48px;align-items:center}
.hero h1{font-size:clamp(37px,4.8vw,56px);font-weight:800;margin:22px 0 18px;color:var(--ink)}
.hero .kicker{color:var(--slate);font-size:17.5px;max-width:58ch;margin-bottom:26px;line-height:1.72}
.kicker mark{background:linear-gradient(180deg,transparent 58%,#FFDCC9 58%);color:var(--ink);font-weight:600;padding:0 2px}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:24px}
.hero-ctas .btn{padding:14px 24px;font-size:15px;white-space:nowrap}
.hero-terms{display:flex;flex-wrap:wrap;gap:8px}
.hero-terms span{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--cream-deep);background:rgba(255,255,255,.82);border-radius:999px;padding:6px 13px;font-size:12.6px;font-weight:600;color:var(--ink)}
.hero-terms span::before{content:"\2713";color:var(--orange);font-weight:800;font-size:10px}

/* -- the question pill above the constellation -- */
.stage{position:relative}
.ask{display:flex;align-items:center;gap:10px;width:fit-content;max-width:100%;margin:0 auto 14px;background:var(--paper);border:1.5px solid var(--line);border-radius:999px;padding:10px 18px;box-shadow:0 10px 26px rgba(28,24,20,.07)}
.ask .dot{width:8px;height:8px;border-radius:50%;background:var(--orange);flex-shrink:0;animation:pulse 2.6s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.68)}}
.qrot{position:relative;height:19px;width:270px;overflow:hidden}
.qrot span{position:absolute;inset:0;font-size:13.2px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;animation:qcycle 13.5s linear infinite}
.qrot span:nth-child(2){animation-delay:4.5s}
.qrot span:nth-child(3){animation-delay:9s}
@keyframes qcycle{0%{opacity:0;transform:translateY(9px)}4%{opacity:1;transform:translateY(0)}30%{opacity:1;transform:translateY(0)}34%{opacity:0;transform:translateY(-9px)}100%{opacity:0;transform:translateY(-9px)}}

/* -- constellation -- */
.orbit{position:relative;width:100%;max-width:440px;margin:0 auto;aspect-ratio:1/1}
.orbit .glow{position:absolute;inset:6%;border-radius:50%;background:radial-gradient(circle,rgba(232,80,26,.14) 0%,rgba(232,80,26,0) 66%)}
.ring{position:absolute;border-radius:50%;pointer-events:none}
.ring.r1{inset:0;border:1.5px dashed var(--cream-deep);animation:spin 68s linear infinite}
.ring.r2{inset:15%;border:1.5px solid var(--line)}
.ring.r3{inset:29%;border:1.5px dashed var(--orange-line);opacity:.7;animation:spin 44s linear infinite reverse}
@keyframes spin{to{transform:rotate(360deg)}}

.spoke{position:absolute;left:50%;top:50%;height:1.5px;width:39%;transform-origin:0 50%;background:var(--cream-deep);animation:spokeLite 12s linear infinite}
.spoke.s1{transform:rotate(-90deg)}
.spoke.s2{transform:rotate(-30deg);animation-delay:2s}
.spoke.s3{transform:rotate(30deg);animation-delay:4s}
.spoke.s4{transform:rotate(90deg);animation-delay:6s}
.spoke.s5{transform:rotate(150deg);animation-delay:8s}
.spoke.s6{transform:rotate(210deg);animation-delay:10s}
@keyframes spokeLite{0%,10%,100%{background:var(--cream-deep)}3%{background:var(--orange)}6%{background:var(--orange-line)}}

.core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:39%;aspect-ratio:1/1;border-radius:50%;background:var(--paper);border:1.5px solid var(--line);box-shadow:0 18px 44px rgba(28,24,20,.13);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;z-index:4}
.core i{font-style:normal;font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);display:block}
.core b{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(15px,2.1vw,19px);font-weight:800;letter-spacing:-.02em;line-height:1.15;margin:5px 0 6px;color:var(--ink)}
.core u{text-decoration:none;display:inline-flex;align-items:center;gap:5px;font-size:9px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--orange-deep);background:var(--orange-soft);border:1px solid var(--orange-line);border-radius:999px;padding:3px 9px}
.core u::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--orange);animation:pulse 2.2s ease-in-out infinite}
.halo{position:absolute;left:50%;top:50%;width:39%;aspect-ratio:1/1;border-radius:50%;border:1.5px solid var(--orange);transform:translate(-50%,-50%);opacity:0;animation:halo 4.4s ease-out infinite;z-index:3}
.halo.h2x{animation-delay:2.2s}
@keyframes halo{0%{opacity:.5;transform:translate(-50%,-50%) scale(1)}70%{opacity:0;transform:translate(-50%,-50%) scale(1.75)}100%{opacity:0}}

.node{position:absolute;transform:translate(-50%,-50%);z-index:5;display:inline-flex;align-items:center;gap:6px;background:var(--paper);border:1.5px solid var(--line);border-radius:999px;padding:7px 13px;font-size:11.6px;font-weight:700;color:var(--slate);white-space:nowrap;box-shadow:0 6px 16px rgba(28,24,20,.07);animation:nodeLite 12s linear infinite}
.node::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--line);flex-shrink:0}
.node.n1{left:50%;top:2%}
.node.n2{left:91%;top:26%}
.node.n3{left:91%;top:74%}
.node.n4{left:50%;top:98%}
.node.n5{left:9%;top:74%}
.node.n6{left:9%;top:26%}
.node.n2{animation-delay:2s}
.node.n3{animation-delay:4s}
.node.n4{animation-delay:6s}
.node.n5{animation-delay:8s}
.node.n6{animation-delay:10s}
@keyframes nodeLite{
  0%,14%,100%{border-color:var(--line);color:var(--slate);background:var(--paper);box-shadow:0 6px 16px rgba(28,24,20,.07)}
  4%,10%{border-color:var(--orange);color:var(--orange-deep);background:#FFF9F6;box-shadow:0 10px 26px rgba(232,80,26,.2)}
}
.node.n1::before,.node.n2::before,.node.n3::before,.node.n4::before,.node.n5::before,.node.n6::before{animation:dotLite 12s linear infinite;animation-delay:inherit}
@keyframes dotLite{0%,14%,100%{background:var(--line)}4%,10%{background:var(--orange)}}

/* ============ JUMP NAV ============ */
.jump{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.94);backdrop-filter:blur(9px);border-bottom:1.5px solid var(--line)}
.jump-in{display:flex;align-items:center;gap:4px;overflow-x:auto;scrollbar-width:none}
.jump-in::-webkit-scrollbar{display:none}
.jump a{flex-shrink:0;padding:15px 14px;font-size:13px;font-weight:600;color:var(--slate);text-decoration:none;border-bottom:2.5px solid transparent;white-space:nowrap;transition:color .18s,border-color .18s}
.jump a:hover{color:var(--ink);border-bottom-color:var(--orange)}
.jump .j-cta{margin-left:auto;background:var(--orange);color:#fff;border-radius:9px;padding:9px 16px;font-size:13px;font-weight:700;border-bottom:none}
.jump .j-cta:hover{border-bottom-color:transparent;color:#fff}

/* ============ 02. DEFINITIONS ============ */
.def-hero{background:var(--paper);border:1.5px solid var(--line);border-left:5px solid var(--orange);border-radius:0 18px 18px 0;padding:28px 32px;margin-bottom:38px}
.def-hero .big{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(19px,2.2vw,24px);font-weight:700;line-height:1.42;letter-spacing:-.015em;max-width:44ch}
.def-hero .sm{margin-top:14px;font-size:15px;color:var(--slate);max-width:70ch;line-height:1.78}
.terms{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.term{position:relative;background:var(--paper);border:1.5px solid var(--line);border-radius:16px;padding:24px 20px 20px;transition:border-color .2s,transform .2s,box-shadow .2s}
.term:hover{border-color:var(--orange);transform:translateY(-4px);box-shadow:0 16px 34px rgba(232,80,26,.1)}
.term .abbr{display:inline-block;font-family:'Bricolage Grotesque',sans-serif;font-size:27px;font-weight:800;color:var(--orange-deep);letter-spacing:-.02em;line-height:1}
.term h3{font-size:13.6px;font-weight:700;margin:9px 0 10px;line-height:1.35}
.term p{font-size:13.2px;color:var(--slate);line-height:1.66}
.term .where{display:block;margin-top:13px;font-size:11.4px;font-weight:700;color:var(--ink);border-top:1.5px solid var(--line);padding-top:10px}
.term .where span{color:var(--mute);font-weight:500;display:block;margin-top:2px}

/* ============ 03. SURFACES ============ */
/* -- dark flow band: one foundation serving the surfaces -- */
.flow{position:relative;background:var(--dark);border-radius:22px;padding:40px 42px;overflow:hidden;margin-bottom:12px}
.flow::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#241E19 1.3px,transparent 1.3px);background-size:24px 24px}
.flow-in{position:relative;display:grid;grid-template-columns:minmax(240px,1fr) 116px minmax(300px,1.25fr);align-items:center}
.flow-lab{display:block;font-size:10.5px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:#877F74;margin-bottom:14px}
.build{list-style:none;background:rgba(255,255,255,.045);border:1.5px solid #332B24;border-radius:16px;padding:4px 20px}
.build li{position:relative;padding:13px 0 13px 24px;font-size:14.5px;color:#fff;font-weight:600;border-bottom:1.5px solid #2B241E;line-height:1.5}
.build li:last-child{border-bottom:none}
.build li::before{content:"";position:absolute;left:0;top:20px;width:7px;height:7px;border-radius:50%;background:var(--orange)}
.fan{position:relative;height:200px}
.fan span{position:absolute;left:0;top:50%;width:100%;height:1.5px;transform-origin:0 50%;background:linear-gradient(90deg,var(--orange) 0%,#463A31 100%)}
.fan span:nth-child(1){transform:rotate(-33deg)}
.fan span:nth-child(2){transform:rotate(-23deg)}
.fan span:nth-child(3){transform:rotate(-13.5deg)}
.fan span:nth-child(4){transform:rotate(-4.5deg)}
.fan span:nth-child(5){transform:rotate(4.5deg)}
.fan span:nth-child(6){transform:rotate(13.5deg)}
.fan span:nth-child(7){transform:rotate(23deg)}
.fan span:nth-child(8){transform:rotate(33deg)}
.chips8{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.chips8 span{border:1.5px solid #332B24;background:rgba(255,255,255,.045);border-radius:11px;padding:12px 14px;font-size:13.2px;font-weight:600;color:#E8E2DA;text-align:center;transition:border-color .18s,color .18s}
.chips8 span:hover{border-color:var(--orange);color:#fff}

/* -- three large editorial rows, no boxes. The numeral tracks scroll
      position: active is orange, the rest stay legible warm grey. -- */
.rows{margin-bottom:6px}
.row{position:relative;display:grid;grid-template-columns:104px 1fr;gap:0 30px;padding:36px 0;border-bottom:1.5px solid var(--line);align-items:start}
.row:last-child{border-bottom:none}
.row::before{content:"";position:absolute;left:-24px;top:38px;width:4px;height:0;border-radius:3px;background:var(--orange);transition:height .35s ease}
.row .num{font-family:'Bricolage Grotesque',sans-serif;font-size:66px;font-weight:800;line-height:.82;color:#C9BCAC;letter-spacing:-.045em;transition:color .3s ease}
.row:first-child .num{color:var(--orange)}
.rows-js .row:first-child .num{color:#C9BCAC}
.rows-js .row.active .num{color:var(--orange)}
.rows-js .row.active::before{height:54px}
.row h3{font-size:clamp(21px,2.5vw,28px);font-weight:800;margin-bottom:13px;max-width:22ch}
.row p{font-size:16px;color:var(--slate);line-height:1.82;max-width:74ch}
.row p+p{margin-top:13px}
.row p strong{color:var(--ink);font-weight:600}

/* -- surface reference list, full width rows -- */
.slist-lab{display:block;font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin:34px 0 4px}
.slist{border-top:1.5px solid var(--line)}
.srow{position:relative;display:grid;grid-template-columns:210px 1fr;gap:4px 32px;padding:22px 0 22px 20px;border-bottom:1.5px solid var(--line);align-items:baseline;transition:background .18s}
.srow::before{content:"";position:absolute;left:0;top:22px;bottom:22px;width:3px;border-radius:3px;background:var(--line);transition:background .18s}
.srow:hover::before{background:var(--orange)}
.srow h3{font-size:17.5px;margin-bottom:4px}
.srow .kind{display:block;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-deep)}
.srow p{font-size:14.8px;color:var(--slate);line-height:1.76;max-width:78ch}
.surf-cta{margin-top:34px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;background:var(--paper);border:1.5px solid var(--line);border-radius:16px;padding:22px 26px}
.surf-cta p{font-size:15px;color:var(--slate);flex:1;min-width:250px;line-height:1.7}
.surf-cta p strong{color:var(--ink)}

/* ============ 04. SPLIT ============ */
.split3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sp{position:relative;background:var(--paper);border:1.5px solid var(--line);border-radius:18px;padding:28px 24px 26px;overflow:hidden}
.sp .gn{position:absolute;right:16px;top:6px;font-family:'Bricolage Grotesque',sans-serif;font-size:70px;font-weight:800;color:var(--cream);line-height:1;pointer-events:none}
.sp .n{position:relative;font-family:'Bricolage Grotesque',sans-serif;font-size:11.5px;font-weight:800;color:var(--orange-deep);letter-spacing:.13em;text-transform:uppercase;display:block;margin-bottom:11px}
.sp h3{position:relative;font-size:20px;margin-bottom:12px}
.sp p{position:relative;font-size:14.2px;color:var(--slate);line-height:1.76}
.sp p+p{margin-top:11px}
.sp.keep{background:var(--ink);border-color:var(--ink)}
.sp.keep .gn{color:#241E19}
.sp.keep .n{color:#7DD3A8}
.sp.keep h3{color:#fff}
.sp.keep p{color:#C9C2B8}
.sp.keep a{color:#F1A07E;font-weight:700;text-decoration:none}
.sp.keep a:hover{text-decoration:underline}

/* ============ 05. INCLUDED ============ */
.inc{display:flex;flex-direction:column;gap:11px}
details.acc{border:1.5px solid var(--line);border-radius:16px;overflow:hidden;background:var(--paper)}
details.acc[open]{border-color:var(--orange);box-shadow:0 16px 38px rgba(232,80,26,.1)}
.acc-sum{list-style:none;cursor:pointer;display:flex;align-items:center;gap:18px;padding:20px 24px;background:var(--cream);transition:background .2s}
.acc-sum::-webkit-details-marker{display:none}
.acc-sum:hover{background:var(--cream-deep)}
.acc-sum:focus-visible{outline:3px solid var(--orange);outline-offset:-3px}
.acc-no{flex-shrink:0;width:44px;height:44px;border-radius:13px;background:var(--paper);border:1.5px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:15px;color:var(--orange-deep)}
details[open] .acc-no{background:var(--orange);border-color:var(--orange);color:#fff}
.acc-t{flex:1;min-width:0}
.acc-t b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-size:18px;font-weight:800;letter-spacing:-.015em;line-height:1.28}
.acc-t em{display:block;font-style:normal;font-size:13px;color:var(--slate);margin-top:4px}
.acc-mark{flex-shrink:0;width:26px;height:26px;border-radius:50%;border:2px solid var(--orange);position:relative}
.acc-mark::before,.acc-mark::after{content:"";position:absolute;background:var(--orange);transition:transform .3s}
.acc-mark::before{left:6px;right:6px;top:11px;height:2px}
.acc-mark::after{top:6px;bottom:6px;left:11px;width:2px}
details[open] .acc-mark::after{transform:rotate(90deg)}
.acc-body{padding:26px;border-top:1.5px solid var(--line)}
.acc-lead{font-family:'Bricolage Grotesque',sans-serif;font-size:18.5px;font-weight:700;line-height:1.46;letter-spacing:-.012em;max-width:46ch;margin-bottom:20px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px 34px}
.two p{font-size:14.2px;color:var(--slate);line-height:1.78}
.two p strong{color:var(--ink)}
.deliv{margin-top:20px;background:var(--cream);border:1.5px solid var(--cream-deep);border-radius:14px;padding:18px 20px}
.deliv em{display:block;font-style:normal;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-deep);margin-bottom:11px}
.deliv ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:5px 26px}
.deliv li{position:relative;padding:3px 0 3px 19px;font-size:13.2px;color:var(--ink);line-height:1.58}
.deliv li::before{content:"";position:absolute;left:0;top:12px;width:6px;height:6px;border-radius:50%;background:var(--orange)}

/* ============ QUOTE BAND ============ */
.quote-band{position:relative;background:var(--dark);color:#fff;padding:84px 0;text-align:center;overflow:hidden}
.quote-band::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#241E19 1.3px,transparent 1.3px);background-size:24px 24px;opacity:.9}
.quote-band>.wrap{position:relative}
.quote-band .qm{font-family:'Bricolage Grotesque',sans-serif;font-size:60px;font-weight:800;color:var(--orange);line-height:.55;display:block;margin-bottom:16px}
.quote-band h2{font-size:clamp(28px,3.8vw,42px);font-weight:800;max-width:19ch;margin:0 auto 16px;color:#fff}
.quote-band p{color:#C9C2B8;max-width:54ch;margin:0 auto 28px;font-size:16px;line-height:1.75}
.quote-band p strong{color:#fff}

/* ============ 06. PROCESS TIMELINE ============ */
.tl{position:relative;padding-left:46px}
.tl::before{content:"";position:absolute;left:14.5px;top:10px;bottom:10px;width:2px;background:var(--line)}
.tl-js .tl-i{opacity:.5;transition:opacity .35s}
.tl-js .tl-i.active{opacity:1}
.tl-i{position:relative;padding-bottom:34px}
.tl-i:last-child{padding-bottom:0}
.tl-i::before{content:"";position:absolute;left:-39px;top:7px;width:12px;height:12px;border-radius:50%;background:var(--cream);border:2.5px solid var(--line);transition:border-color .3s,box-shadow .3s}
.tl-js .tl-i.active::before{border-color:var(--orange);box-shadow:0 0 0 5px rgba(232,80,26,.15)}
.tl-i .when{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-deep);background:var(--orange-soft);border:1px solid var(--orange-line);border-radius:999px;padding:3px 11px;margin-bottom:10px}
.tl-i h3{font-size:21px;margin-bottom:9px}
.tl-i p{font-size:14.4px;color:var(--slate);line-height:1.78;max-width:66ch}
.tl-i .lands{margin-top:12px;font-size:13.6px;color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-left:3px solid var(--orange);border-radius:0 10px 10px 0;padding:11px 15px;max-width:66ch}
.tl-i .lands b{font-weight:700}

/* ============ 07. FIT ============ */
.fit{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
.fitc{background:var(--paper);border:1.5px solid var(--line);border-radius:18px;padding:28px 24px;display:flex;flex-direction:column}
.fitc.mid{border:2px solid var(--orange);box-shadow:0 20px 48px rgba(232,80,26,.14);position:relative}
.fitc.mid .flag{position:absolute;top:-12px;left:24px;background:var(--orange);color:#fff;font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;padding:4px 12px;border-radius:999px}
.fitc h3{font-size:19.5px;margin-bottom:7px}
.fitc .who{font-size:12.6px;color:var(--orange-deep);font-weight:700;margin-bottom:15px;display:block;line-height:1.5}
.fitc>p{font-size:13.8px;color:var(--slate);line-height:1.72;margin-bottom:17px}
.fitc ul{list-style:none;margin-bottom:18px}
.fitc li{position:relative;padding:7px 0 7px 25px;font-size:13.2px;color:var(--ink);line-height:1.6;border-bottom:1px solid var(--line)}
.fitc li:last-child{border-bottom:none}
.fitc li::before{content:"\2713";position:absolute;left:0;top:7px;color:var(--green);font-weight:800;font-size:12px}
.fitc li.no{color:var(--mute)}
.fitc li.no::before{content:"+";color:var(--mute);font-weight:800;font-size:14px;top:6px}
.fitc .foot{margin-top:auto;font-size:12.8px;color:var(--slate);border-top:1.5px solid var(--line);padding-top:15px;line-height:1.68}
.fitc .foot b{color:var(--ink)}

/* ============ 08. WHITE LABEL ============ */
.wl{position:relative;background:var(--dark);color:#fff;border-radius:22px;padding:40px;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;overflow:hidden}
.wl::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#241E19 1.3px,transparent 1.3px);background-size:24px 24px}
.wl>*{position:relative}
.wl .eyebrow{background:transparent;border-color:#3A332C;color:#F1A07E}
.wl h2{font-size:clamp(24px,3vw,32px);font-weight:800;margin:16px 0 14px;color:#fff}
.wl p{font-size:15px;color:#C9C2B8;line-height:1.78;max-width:52ch}
.wl p+p{margin-top:11px}
.wl .btn-ghost{border-color:#5A5049;color:#fff}
.wl .btn-ghost:hover{background:#fff;color:var(--ink)}
.wl-list{list-style:none;background:rgba(255,255,255,.04);border:1.5px solid #332B24;border-radius:16px;padding:8px 20px}
.wl-list li{position:relative;padding:12px 0 12px 27px;font-size:14px;color:#E8E2DA;border-bottom:1.5px solid #2B241E;line-height:1.6}
.wl-list li:last-child{border-bottom:none}
.wl-list li::before{content:"\2713";position:absolute;left:0;top:12px;color:var(--orange);font-weight:800;font-size:12px}

/* ============ 09. FIT CHECK ============ */
.forgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.forc{border:1.5px solid var(--line);border-radius:18px;padding:28px 26px;background:var(--paper)}
.forc h3{font-size:19px;margin-bottom:16px;display:flex;align-items:center;gap:10px}
.forc h3::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--green)}
.forc.later h3::before{background:var(--mute)}
.forc ul{list-style:none}
.forc li{position:relative;padding:11px 0 11px 21px;font-size:14px;color:var(--slate);line-height:1.72;border-bottom:1px solid var(--line)}
.forc li:last-child{border-bottom:none;padding-bottom:0}
.forc li strong{color:var(--ink);font-weight:600;display:block;margin-bottom:2px}
.forc li::before{content:"";position:absolute;left:0;top:19px;width:6px;height:6px;border-radius:50%;background:var(--line)}
.forc.now li::before{background:var(--orange)}

/* ============ FAQ ============ */
.qgroup{margin-bottom:26px}
.qgroup>h3{font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--mute);margin-bottom:12px;padding-bottom:9px;border-bottom:1.5px solid var(--line);font-family:'Inter',sans-serif}
.qflow{display:flex;flex-direction:column;gap:9px}
.qitem{background:var(--paper);border:1.5px solid var(--line);border-radius:14px;padding:17px 21px;transition:border-color .3s,box-shadow .3s,opacity .3s}
.qitem-head{display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer}
.qitem-head h3{font-size:15.6px;font-weight:700;margin:0;color:var(--ink);line-height:1.4}
.qitem-mark{flex-shrink:0;width:22px;height:22px;border-radius:50%;border:2px solid var(--line);position:relative;transition:border-color .3s,background .3s}
.qitem-mark::before,.qitem-mark::after{content:"";position:absolute;background:var(--slate);transition:background .3s,transform .3s}
.qitem-mark::before{left:5px;right:5px;top:9px;height:2px}
.qitem-mark::after{top:5px;bottom:5px;left:9px;width:2px}
.qitem-body{max-height:1000px;overflow:hidden;transition:max-height .45s cubic-bezier(.4,0,.2,1),opacity .35s}
.qitem-body p{color:var(--slate);font-size:14.4px;margin:14px 0 0;line-height:1.8;max-width:82ch}
.qitem-body p strong{color:var(--ink)}
.qitem-body p a{color:var(--orange-deep);font-weight:700;text-decoration:none}
.qitem-body p a:hover{text-decoration:underline}
.qflow-js .qitem{opacity:.72}
.qflow-js .qitem .qitem-body{max-height:0;opacity:0}
.qflow-js .qitem.active{opacity:1;border-color:var(--orange);box-shadow:0 14px 32px rgba(232,80,26,.1)}
.qflow-js .qitem.active .qitem-mark{border-color:var(--orange);background:var(--orange)}
.qflow-js .qitem.active .qitem-mark::before,.qflow-js .qitem.active .qitem-mark::after{background:#fff}
.qflow-js .qitem.active .qitem-mark::after{transform:rotate(90deg)}
.qflow-js .qitem.active .qitem-body{max-height:1000px;opacity:1}

/* ============ CONTACT ============ */
.cta-band{position:relative;background:var(--dark);color:#fff;padding:96px 0;overflow:hidden}
.cta-band::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#241E19 1.3px,transparent 1.3px);background-size:24px 24px}
.cta-grid{position:relative;display:grid;grid-template-columns:.95fr 1.05fr;gap:52px;align-items:center}
.cta-band .eyebrow{background:transparent;border-color:#3A332C;color:#F1A07E}
.cta-band h2{font-size:clamp(29px,3.9vw,44px);margin:18px 0 14px;font-weight:800;color:#fff}
.cta-band h2 .accent{color:var(--orange)}
.cta-band .cta-sub{color:#C9C2B8;max-width:54ch;margin-bottom:24px;font-size:16px;line-height:1.75}
.cta-band .cta-sub strong{color:#fff}
.cta-list{list-style:none;margin-bottom:22px}
.cta-list li{position:relative;padding:8px 0 8px 30px;font-size:15px;color:#E8E2DA;line-height:1.65}
.cta-list li::before{content:"\2713";position:absolute;left:0;top:9px;width:20px;height:20px;border-radius:6px;background:rgba(232,80,26,.18);border:1.5px solid var(--orange);color:#F1A07E;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}
.cta-micro{font-size:13px;color:#9A9288;margin-top:18px;line-height:1.7}
.form-card{background:var(--paper);border-radius:20px;padding:32px;color:var(--ink);box-shadow:0 24px 60px rgba(0,0,0,.32)}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.f-field label{display:block;font-size:12.5px;font-weight:700;margin-bottom:6px;color:var(--ink)}
.f-field input,.f-field select,.f-field textarea{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:12px 14px;font-family:'Inter';font-size:14px;background:var(--cream);color:var(--ink)}
.f-field textarea{min-height:84px;resize:vertical}
.f-help{font-size:11.5px;color:var(--mute);margin-top:5px;line-height:1.55}
.form-card .btn{width:100%;text-align:center;margin-top:6px}
.form-note{text-align:center;font-size:12px;color:var(--mute);margin-top:12px;line-height:1.6}

/* footer */
footer{background:#120E0B;color:#9A9288;padding:34px 0;font-size:13px}
.foot-base{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.foot-base a{color:#C9C2B8;text-decoration:none}
.foot-base a:hover{color:#fff}
.foot-brand{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:#fff;font-size:15px}
.foot-brand i{font-style:normal;color:var(--orange)}

/* ============ RESPONSIVE ============ */
@media(max-width:1080px){
  .terms{grid-template-columns:1fr 1fr}
  .flow{padding:32px 26px}
  .flow-in{grid-template-columns:1fr;gap:22px}
  .fan{height:64px;transform:rotate(90deg);margin:0 auto;width:64px}
  .fit{grid-template-columns:1fr}
  .fitc.mid{order:-1}
  .wl{grid-template-columns:1fr;gap:28px}
}
@media(max-width:880px){
  .hero-grid,.cta-grid{grid-template-columns:1fr}
  .stage{margin-top:26px}
  .orbit{max-width:360px}
  .node{font-size:10.6px;padding:6px 11px}
  .row{grid-template-columns:1fr;gap:10px;padding:28px 0}
  .row .num{font-size:46px}
  .srow{grid-template-columns:1fr;gap:6px;padding:20px 0 20px 18px}
  .split3{grid-template-columns:1fr}
  .forgrid{grid-template-columns:1fr}
  .deliv ul,.two{grid-template-columns:1fr}
  section{padding:66px 0}
  .hero{padding:64px 0 56px}
}
@media(max-width:640px){
  .f-row{grid-template-columns:1fr}
  .terms{grid-template-columns:1fr}
  .chips8{grid-template-columns:1fr}
  .acc-sum{gap:13px;padding:17px 17px}
  .acc-body{padding:22px 18px}
  .acc-lead{font-size:17px}
  .def-hero{padding:22px 20px}
  .orbit{max-width:300px}
  .node{font-size:9.6px;padding:5px 9px}
  .qrot{width:210px}
  .tl{padding-left:34px}
  .tl-i::before{left:-27px}
  .tl::before{left:8.5px}
}
@media(prefers-reduced-motion:reduce){
  .ring,.spoke,.node,.halo,.core u::before,.ask .dot,.qrot span{animation:none!important}
  .qrot span{opacity:0}
  .qrot span:first-child{opacity:1}
}

/* ============================================================
   WHITE LABEL PAGE ADDITIONS
   Everything above this line is the shared V2A service-page
   stylesheet, unchanged. Components below are new, built from the
   same vocabulary: 1.5px borders, 16 to 22px radii, pill chips,
   ghost numerals, dark dot-textured panels.
   ============================================================ */

mark.hl{background:linear-gradient(180deg,transparent 58%,#FFDCC9 58%);color:var(--ink);font-weight:600;padding:0 2px}

/* ---- STATS BAND ----
   House post-hero strip, CSS copied verbatim from the SEO audit,
   local SEO and link building pages so it renders identically.
   Four stats in the five-column grid, same as the link building
   page: the empty fifth column is the established pattern. Every
   figure is an operational commitment, never a results claim. */
.stats-band{background:var(--dark)}
.stats-grid{display:grid;grid-template-columns:repeat(5,1fr)}
.stat{padding:30px 24px;color:#fff}
.stat:nth-child(even){background:var(--orange)}
.stat .st-num{font-family:'Bricolage Grotesque',sans-serif;font-size:27px;font-weight:800;line-height:1.05}
.stat .st-label{font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;margin-top:8px}
.stat .st-sub{font-size:12.5px;margin-top:5px;color:rgba(255,255,255,.78)}
.stat:nth-child(even) .st-sub{color:rgba(255,255,255,.9)}

/* ---- HERO VISUAL: THE PARTNER PASS ----
   White label as an access pass the agency issues to us. Their brand
   in the header, "SEO Department" as the holder, and three permission
   lines where the only denial is contact with their client. Two ghost
   cards behind give depth. Hierarchy is deliberate so the card does
   not fragment into small parts. Not a report mockup, no floating
   labels, chips light in sequence only. */
.pass-stack{position:relative;width:100%;max-width:404px;margin:0 auto;padding-top:18px}
.pass-back{position:absolute;left:16px;right:16px;top:0;height:64px;border-radius:22px 22px 10px 10px;background:var(--paper);border:1.5px solid var(--line);opacity:.92}
.pass-back.b2{left:32px;right:32px;top:-10px;opacity:.6}
.pass{position:relative;background:var(--paper);border:1.5px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 32px 70px rgba(28,24,20,.16),0 3px 10px rgba(28,24,20,.05)}
.pass-hd{position:relative;background:linear-gradient(140deg,var(--orange) 0%,var(--orange-deep) 100%);padding:22px 22px 16px;display:flex;align-items:center;gap:11px}
.pass-slot{position:absolute;left:50%;top:9px;transform:translateX(-50%);width:56px;height:6px;border-radius:99px;background:rgba(255,255,255,.34);box-shadow:inset 0 1px 2px rgba(0,0,0,.22)}
.pass-hd .pmark{position:relative;flex-shrink:0;width:32px;height:32px;border-radius:10px;background:rgba(255,255,255,.2);border:1.5px solid rgba(255,255,255,.5)}
.pass-hd .pmark::after{content:"";position:absolute;inset:8px;border-radius:4px;border:2.5px solid rgba(255,255,255,.95)}
.pass-hd b{font-family:'Bricolage Grotesque',sans-serif;font-size:16px;font-weight:800;letter-spacing:-.015em;color:#fff;line-height:1.1}
.pass-kind{margin-left:auto;font-size:8.8px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:4px 9px;white-space:nowrap}
.pass-body{padding:24px 22px 4px}
.pass-role{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(26px,3.5vw,34px);font-weight:800;letter-spacing:-.032em;line-height:1;color:var(--ink);margin:0}
.pass-sub{font-size:12.6px;color:var(--slate);margin:9px 0 0;line-height:1.5}
.pass-chips{display:flex;flex-wrap:wrap;gap:6px;margin:17px 0 4px}
.pass-chips span{display:inline-block;border:1.5px solid var(--line);background:var(--cream);border-radius:999px;padding:5px 11px;font-size:11.2px;font-weight:700;color:var(--slate);animation:chipLite 11s linear infinite}
.pass-chips span:nth-child(2){animation-delay:2.2s}
.pass-chips span:nth-child(3){animation-delay:4.4s}
.pass-chips span:nth-child(4){animation-delay:6.6s}
.pass-chips span:nth-child(5){animation-delay:8.8s}
@keyframes chipLite{0%,17%,100%{border-color:var(--line);background:var(--cream);color:var(--slate);box-shadow:none}4%,13%{border-color:var(--orange);background:var(--paper);color:var(--ink);box-shadow:0 8px 18px rgba(232,80,26,.16)}}
.perms{list-style:none;margin-top:17px}
.perms li{display:flex;align-items:flex-start;gap:10px;padding:11px 0;border-top:1.5px solid var(--line);font-size:12.8px;color:var(--slate);line-height:1.5}
.perms li i{flex-shrink:0;width:18px;height:18px;border-radius:6px;background:rgba(30,138,90,.1);border:1px solid rgba(30,138,90,.35);color:var(--green);font-style:normal;font-size:9.5px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-top:1px}
.perms li.no{color:var(--ink);font-weight:700}
.perms li.no i{background:var(--orange-soft);border-color:var(--orange);color:var(--orange-deep);font-size:12px}
.pass-ft{display:flex;align-items:center;gap:14px;margin-top:4px;padding:14px 22px;background:var(--cream);border-top:1.5px solid var(--line)}
.barcode{flex:1;height:26px;border-radius:2px;opacity:.8;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 5px,var(--ink) 5px 6px,transparent 6px 10px,var(--ink) 10px 13px,transparent 13px 15px,var(--ink) 15px 16px,transparent 16px 21px)}
.pass-ft em{font-style:normal;font-size:8.8px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--mute);white-space:nowrap}
.credit-foot{text-align:center;font-size:12.8px;color:var(--slate);margin-top:20px;line-height:1.6}
.credit-foot b{color:var(--ink)}

/* ---- 01. FAILURE PATTERNS: two-up, larger type, numeral lights with the card ---- */
.fails{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.failc{position:relative;background:var(--paper);border:1.5px solid var(--line);border-radius:18px;padding:30px 28px 28px;overflow:hidden;transition:border-color .2s,transform .2s,box-shadow .2s}
.failc:hover{border-color:var(--orange);transform:translateY(-4px);box-shadow:0 18px 38px rgba(232,80,26,.1)}
.failc .gn{position:absolute;right:18px;top:2px;font-family:'Bricolage Grotesque',sans-serif;font-size:76px;font-weight:800;color:var(--cream);line-height:1;pointer-events:none;transition:color .22s ease}
.sec-cream .failc .gn{color:var(--cream-deep)}
.failc:hover .gn,.sec-cream .failc:hover .gn{color:var(--orange-line)}
.failc h3{position:relative;font-size:21px;font-weight:800;margin-bottom:12px}
.failc p{position:relative;font-size:15.4px;color:var(--slate);line-height:1.76;max-width:44ch}

/* ---- 03. coverage footer: two separate points ---- */
.surf-cta .pts{flex:1;min-width:260px;display:flex;flex-direction:column;gap:11px}
.surf-cta .pts p{flex:none;min-width:0}

/* ---- 04. SCOPE BUILDER ---- */
.builder{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;align-items:start}
.bsteps{display:flex;flex-direction:column;gap:14px}
.bstep{background:var(--paper);border:1.5px solid var(--line);border-radius:16px;padding:20px 22px}
.bstep-h{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.bstep-n{flex-shrink:0;width:32px;height:32px;border-radius:10px;background:var(--cream);border:1.5px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:13px;color:var(--orange-deep)}
.bstep-h b{font-family:'Bricolage Grotesque',sans-serif;font-size:16.5px;font-weight:800;letter-spacing:-.015em;line-height:1.3}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt{position:relative}
.opt input{position:absolute;opacity:0;width:1px;height:1px}
.opt span{display:inline-block;border:1.5px solid var(--line);background:var(--cream);border-radius:999px;padding:9px 15px;font-size:13px;font-weight:600;color:var(--slate);cursor:pointer;transition:all .18s;user-select:none}
.opt span:hover{border-color:var(--orange-line);color:var(--ink)}
.opt input:checked+span{background:var(--orange);border-color:var(--orange);color:#fff;box-shadow:0 8px 20px rgba(232,80,26,.24)}
.opt input:focus-visible+span{outline:3px solid var(--orange);outline-offset:3px}
.opt small{display:block;font-size:11px;font-weight:500;opacity:.82;margin-top:1px}
.bsum{position:sticky;top:74px;background:var(--dark);color:#fff;border-radius:18px;padding:26px 24px;overflow:hidden}
.bsum::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#241E19 1.3px,transparent 1.3px);background-size:24px 24px}
.bsum>*{position:relative}
.bsum-lab{display:block;font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:#877F74;margin-bottom:14px}
.bsum ul{list-style:none;margin-bottom:20px}
.bsum li{padding:10px 0;border-bottom:1.5px solid #2B241E;font-size:13.4px;line-height:1.5}
.bsum li:last-child{border-bottom:none}
.bsum li i{display:block;font-style:normal;font-size:9.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#877F74;margin-bottom:3px}
.bsum li b{font-weight:700;color:#fff}
.bsum .f-field{margin-bottom:12px}
.bsum .f-field label{display:block;font-size:11.5px;font-weight:700;color:#C9C2B8;margin-bottom:6px;letter-spacing:.01em}
.bsum .f-field input{width:100%;border:1.5px solid #3A332C;border-radius:10px;padding:11px 13px;font-family:'Inter';font-size:13.5px;background:rgba(255,255,255,.05);color:#fff}
.bsum .f-field input::placeholder{color:#7C746A}
.bsum .f-field input:focus{outline:2px solid var(--orange);outline-offset:1px;background:rgba(255,255,255,.09)}
.bsum .btn{width:100%;text-align:center;margin-top:4px}
.bsum-note{font-size:11.4px;color:#9A9288;margin-top:12px;line-height:1.6;text-align:center}

/* ---- 05. confidentiality button, orange by default, white on hover ---- */
.wl .btn-ghost{border-color:var(--orange);color:#FF8A5C}
.wl .btn-ghost:hover{background:#fff;border-color:#fff;color:var(--ink)}

/* ---- 06. COMPARISON ---- */
.cmp-wrap{border:1.5px solid var(--line);border-radius:18px;overflow:hidden;background:var(--paper);box-shadow:0 18px 44px rgba(28,24,20,.06)}
.cmp-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.cmp{display:table;width:100%;border-collapse:collapse;min-width:790px;table-layout:fixed}
table.cmp th,table.cmp td{text-align:left;vertical-align:top;padding:19px 22px;border-bottom:1.5px solid var(--line)}
table.cmp thead th{background:var(--dark);font-family:'Bricolage Grotesque',sans-serif;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#9A9288;border-bottom:none;padding-top:16px;padding-bottom:16px}
table.cmp thead th:nth-child(1){width:25%}
table.cmp thead th:nth-child(2){width:33%}
table.cmp thead th.hi{width:42%;color:#fff;position:relative}
table.cmp thead th.hi::after{content:"";position:absolute;left:22px;right:22px;bottom:9px;height:2.5px;background:var(--orange);border-radius:2px}
table.cmp tbody tr{transition:background .18s}
table.cmp tbody tr:hover{background:var(--cream)}
table.cmp tbody th{width:25%;background:var(--cream)}
table.cmp tbody th .mn{display:flex;align-items:center;gap:10px;font-family:'Bricolage Grotesque',sans-serif;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--orange-deep);margin-bottom:8px}
table.cmp tbody th .mn::before{content:"";width:22px;height:2px;background:var(--orange-line);border-radius:2px}
table.cmp tbody th em{font-style:normal;font-family:'Bricolage Grotesque',sans-serif;font-size:15.5px;font-weight:800;letter-spacing:-.015em;color:var(--ink);line-height:1.34;display:block}
table.cmp td.them{width:33%;font-size:13.8px;color:var(--mute);line-height:1.74}
table.cmp td.us{width:42%;font-size:14px;color:var(--ink);line-height:1.74;background:var(--orange-soft);position:relative;padding-left:46px}
table.cmp td.us::before{content:"\2713";position:absolute;left:22px;top:20px;width:17px;height:17px;border-radius:5px;background:var(--orange);color:#fff;font-size:9.5px;font-weight:800;display:flex;align-items:center;justify-content:center}
table.cmp tbody tr:last-child th,table.cmp tbody tr:last-child td{border-bottom:none}

/* ---- 06b. IN-HOUSE LEDGER ---- */
.ledger{position:relative;background:var(--dark);color:#fff;border-radius:22px;padding:38px 40px;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;overflow:hidden;margin-top:26px}
.ledger::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#241E19 1.3px,transparent 1.3px);background-size:24px 24px}
.ledger>*{position:relative}
.ledger .eyebrow{background:transparent;border-color:#3A332C;color:#F1A07E}
.ledger h3{font-size:clamp(21px,2.6vw,27px);font-weight:800;margin:16px 0 12px;color:#fff}
.ledger>div>p{font-size:14.6px;color:#C9C2B8;line-height:1.78;max-width:46ch}
.hires{list-style:none;background:rgba(255,255,255,.04);border:1.5px solid #332B24;border-radius:16px;padding:6px 20px}
.hires li{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1.5px solid #2B241E;font-size:14px;color:#E8E2DA;line-height:1.5}
.hires li:last-child{border-bottom:none}
.hires li b{flex-shrink:0;font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#F1A07E;background:rgba(232,80,26,.14);border:1px solid #5A3427;border-radius:999px;padding:4px 10px}
.hires li.tot{padding-top:15px;margin-top:2px;border-top:1.5px solid #3A332C;border-bottom:none;font-weight:700;color:#fff}
.hires li.tot b{background:var(--orange);border-color:var(--orange);color:#fff}
.ledger-note{margin-top:16px;font-size:12.4px;color:#9A9288;line-height:1.7}
.ledger-note cite{font-style:normal;color:#7C746A}

/* ---- 07. CLOSING STATEMENT ----
   Light card with an orange top rule. The earlier solid orange panel
   was hard to read and crowded the right-hand card, so the arrow now
   sits in its own gapped column. */
.shift{position:relative;background:var(--paper);border:1.5px solid var(--line);border-radius:20px;padding:34px 36px;display:grid;grid-template-columns:.92fr 1.08fr;gap:36px;align-items:center;margin-top:30px;box-shadow:0 18px 44px rgba(28,24,20,.06);overflow:hidden}
.shift::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--orange)}
.shift-k{display:block;font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--orange-deep);margin-bottom:13px}
.shift-say p{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(20px,2.5vw,27px);font-weight:800;letter-spacing:-.022em;line-height:1.26;color:var(--ink);max-width:19ch;margin:0}
.shift-note{display:block;margin-top:14px;font-size:13px;color:var(--slate);line-height:1.6}
.shift-cols{display:grid;grid-template-columns:1fr 46px 1fr;align-items:stretch;gap:0}
.shift-col{background:var(--cream);border:1.5px solid var(--line);border-radius:15px;padding:19px 19px 18px}
.shift-col.now{background:var(--orange-soft);border-color:var(--orange)}
.shift-t{display:block;font-size:9.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-bottom:9px}
.shift-col.now .shift-t{color:var(--orange-deep)}
.shift-col b{display:block;font-family:'Bricolage Grotesque',sans-serif;font-size:19px;font-weight:800;letter-spacing:-.02em;color:var(--mute);margin-bottom:9px}
.shift-col.now b{color:var(--orange-deep)}
.shift-col em{font-style:normal;font-size:12.6px;line-height:1.66;color:var(--slate);display:block}
.shift-arrow{display:flex;align-items:center;justify-content:center}
.shift-arrow i{display:block;width:10px;height:10px;border-top:2.5px solid var(--orange);border-right:2.5px solid var(--orange);rotate:45deg}

/* ---- srow link ---- */
.srow .go{display:inline-flex;align-items:center;gap:6px;margin-top:9px;font-size:12.6px;font-weight:800;color:var(--orange-deep);text-decoration:none;letter-spacing:.01em}
.srow .go:hover{text-decoration:underline}

@media(max-width:1200px){.stats-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:1080px){.builder{grid-template-columns:1fr}.bsum{position:static}.ledger,.shift{grid-template-columns:1fr;gap:26px;padding:30px 26px}}
@media(max-width:900px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:880px){.fails{grid-template-columns:1fr}.pass-stack{max-width:380px}}
@media(max-width:640px){.pass-body{padding:20px 18px 4px}.pass-hd,.pass-ft{padding-left:18px;padding-right:18px}.failc{padding:26px 22px}.failc .gn{font-size:60px}.shift{padding:28px 22px}.shift-cols{grid-template-columns:1fr;gap:14px}.shift-arrow{height:22px}.shift-arrow i{rotate:135deg}}
/* The band holds a 2 by 2 grid on mobile and never collapses to a
   single column. Same as the link building page. Padding eases in on
   the narrowest screens so the cells stay square-ish rather than tall. */
@media(max-width:520px){.stat{padding:24px 18px}.stat .st-num{font-size:25px}.stat .st-label{font-size:11px;letter-spacing:.08em}.stat .st-sub{font-size:12px}}

/* ---- MOBILE: NO SIDEWAYS SCROLL, NAV STILL PINNED ----
   Three things are handled here. None of them touch the copy or the
   desktop layout.

   1. The jump nav stays sticky, exactly as it is on desktop. It wraps
      instead of scrolling sideways, so every link is reachable, and
      everything is shrunk (11.6px, tight padding, compact CTA pushed
      right by margin-left:auto) to hold it to three short rows rather
      than four tall ones. Do not set position:static here: an earlier
      pass did, and the bar then scrolled away with the page.

   2. The comparison table unstacks into cards. It carries prose, not
      tick marks, so the feature-matrix tab pattern used on the audit
      page does not suit it: tabs would hide half of every answer. The
      moment becomes the card header, the two columns sit underneath,
      and their headings are restored as labels through ::before.

      SPECIFICITY WARNING. The desktop column widths are declared as
      "table.cmp tbody th" (0,1,3) and "table.cmp td.them" (0,2,2). A
      mobile override written as "table.cmp th,table.cmp td" is only
      (0,1,2) and silently loses, which is what squeezed the header
      cell into a 25% column and wrapped it one word per line. Every
      rule below is therefore scoped through tbody so it matches or
      beats the base rule. Keep it that way.

   3. Nothing else on the page may introduce a fixed min-width. If a
      wide table or grid is added later, give it a stacking rule at
      this breakpoint rather than an overflow-x container.        ---- */
@media(max-width:880px){
  .jump{position:sticky;top:0}
  .jump-in{flex-wrap:wrap;justify-content:center;overflow-x:visible;gap:0 4px;padding:8px 0 10px}
  .jump a{padding:8px 10px;font-size:12.4px;border-bottom-width:2px}
  .jump .j-cta{flex:0 0 100%;margin:6px 0 0;padding:12px 16px;font-size:13px;border-radius:9px;text-align:center}

  .cmp-scroll{overflow-x:visible;-webkit-overflow-scrolling:auto}
  table.cmp{min-width:0;display:block}
  table.cmp thead{display:none}
  table.cmp tbody{display:block}
  table.cmp tbody tr{display:block;border-bottom:1.5px solid var(--line)}
  table.cmp tbody tr:last-child{border-bottom:none}
  table.cmp tbody tr:hover{background:none}

  table.cmp tbody th,table.cmp tbody td{
    display:block;width:auto;max-width:none;padding:18px 20px;border-bottom:none
  }
  table.cmp tbody th{background:var(--cream)}
  table.cmp tbody th .mn{margin-bottom:6px}
  table.cmp tbody th em{font-size:17px;line-height:1.3}
  table.cmp tbody td.them,table.cmp tbody td.us{width:auto;font-size:14.2px;padding-left:20px}

  table.cmp tbody td.them::before,table.cmp tbody td.us::before{
    display:block;position:static;width:auto;height:auto;margin:0 0 9px;
    font-family:'Bricolage Grotesque',sans-serif;font-size:10px;font-weight:800;
    letter-spacing:.09em;text-transform:uppercase;line-height:1.4;
    background:none;border-radius:0
  }
  table.cmp tbody td.them::before{content:"Freelancers and typical white label SEO agencies";color:var(--mute)}
  table.cmp tbody td.us::before{content:"Visual2Action";color:var(--orange-deep)}
}
@media(prefers-reduced-motion:reduce){.pass-chips span{animation:none!important}}
