/* Ringwild scroll site (site_scroll2). Colours come from the owner's logo: cream paper, forest green, wood gold.
   60 / 30 / 10: paper = backgrounds, green = text and dark bands, gold = ONLY things to click.
   One signature effect (the scroll film). Everything below it is still. */
@font-face{font-family:"Newsreader";src:url(../fonts/newsreader-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Public Sans";src:url(../fonts/publicsans-wght.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{
 --paper:#FBF4E9;--paper-2:#F3E9D6;--card:#FFFDF8;--line:#DDD1BA;
 --green:#213B28;--ink:#16291C;--ink-2:#1D3324;--text:#24312A;--muted:#55625A;
 --gold:#E2A72E;--gold-hi:#F0BB4A;--gold-ink:#16291C;--link:#7A5510;
 --on-dark:#FBF4E9;--on-dark-2:#D5DDD2;--line-d:rgba(251,244,233,.2);
 --display:"Newsreader",Georgia,"Times New Roman",serif;--body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
 --wrap:72rem;--gut:clamp(1rem,4vw,2.5rem);
 --s-1:.25rem;--s-2:.5rem;--s-3:.75rem;--s-4:1rem;--s-5:1.5rem;--s-6:2rem;--s-7:3rem;--s-8:4.5rem;--s-9:6.5rem;
 --t-xs:.8125rem;--t-sm:.9375rem;--t-md:1.0625rem;--t-lg:1.25rem;
 --hdr:5.25rem;--r:.625rem;--ease:cubic-bezier(.2,.7,.2,1);
 /* depth: the ONLY z-index values on the site (LAYERS_PLAN.md). back = film/photos, scrim = fades, mid = words, edge = the one thing
    that hangs into the next section, front = the section's one action, label = honesty labels, header, overlay */
 --z-back:0;--z-scrim:1;--z-mid:2;--z-edge:3;--z-front:4;--z-label:5;--z-header:10;--z-overlay:20;
 --lift:3px 3px 0 var(--ink);--lift-lg:8px 8px 0 var(--ink)   /* the one shadow style: only on a section's front action or its edge element */
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hdr-h,var(--hdr)) + 1rem)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--paper);color:var(--text);font:400 var(--t-md)/1.6 var(--body)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,p,ul,ol,dl,dd,figure,table{margin:0}
ul,ol{padding:0;list-style:none}
h1,h2,h3{font-family:var(--display);font-weight:500;color:var(--green);line-height:1.08;letter-spacing:-.01em;text-wrap:balance}
h2{font-size:clamp(2rem,4.2vw,3.25rem)}
h3{font-size:clamp(1.25rem,2vw,1.5rem);line-height:1.2}
p{text-wrap:pretty}
a{color:var(--link);text-underline-offset:.18em}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:4px}
.wrap{width:min(100% - 2 * var(--gut),var(--wrap));margin-inline:auto}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:var(--gut);top:-4rem;z-index:var(--z-overlay);background:var(--ink);color:var(--on-dark);padding:var(--s-3) var(--s-4);border-radius:var(--r)}
.skip:focus{top:var(--s-3)}
.dag{color:var(--muted);font-size:.8em;margin-inline-start:.15em}
.on-dark .dag{color:var(--on-dark-2)}
.lede{font-size:var(--t-lg);line-height:1.5;color:var(--muted);max-width:40ch}

/* buttons: the ONLY gold on the page */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);min-height:3rem;padding:.7rem 1.25rem;border-radius:var(--r);font:650 var(--t-md)/1.1 var(--body);text-decoration:none;cursor:pointer;border:2px solid var(--ink);background:var(--gold);color:var(--gold-ink);transition:transform .15s var(--ease),box-shadow .15s var(--ease),background-color .15s}
.btn:hover{background:var(--gold-hi)}
.btn.lift{position:relative;z-index:var(--z-front);box-shadow:var(--lift)}
.btn.lift:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.btn.lift:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.btn svg{width:1.1rem;height:1.1rem;flex:none}
.btn.alt{background:transparent;color:var(--green)}
.btn.alt:hover{background:rgba(33,59,40,.07)}
.on-dark .btn{border-color:var(--gold)}
.on-dark .btn.lift{box-shadow:3px 3px 0 rgba(0,0,0,.55)}
.on-dark .btn.alt{color:var(--on-dark);border-color:rgba(251,244,233,.6)}
.on-dark .btn.alt:hover{background:rgba(251,244,233,.1)}
.btns{display:flex;flex-wrap:wrap;gap:var(--s-3)}

/* header: always cream, because the logo is drawn for cream */
.top{position:sticky;top:0;z-index:var(--z-header);background:var(--paper);border-block-end:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:var(--s-5);min-height:var(--hdr)}
.brand{display:block;flex:none;margin-inline-end:auto}
.brand img{height:4.25rem;width:auto}
.nav{display:flex;gap:var(--s-5)}
.nav a{color:var(--green);text-decoration:none;font-weight:600;font-size:var(--t-sm);padding:var(--s-2) 0}
.nav a:hover{text-decoration:underline}
.top .btn{min-height:2.75rem;padding:.55rem 1rem;font-size:var(--t-sm)}
@media (max-width:63.99rem){.nav{display:none}}
@media (max-width:30rem){:root{--hdr:4.25rem}.brand img{height:3.25rem}.top .btn .num{display:none}}
@media (min-width:30.01rem){.top .btn .word{display:none}}

/* ---------- the film journey: STILL mode is the default (no JS, reduced motion, data saver, film turned off) ---------- */
.film{position:relative;background:var(--ink);color:var(--on-dark)}
.film h1,.film h2{color:#fff}
.film h1{font-size:clamp(2.5rem,5.4vw,4.5rem);line-height:1.02;max-width:13ch}
.film h2{font-size:clamp(2.1rem,4.4vw,3.6rem);max-width:15ch}
.film .lede{color:var(--on-dark-2)}
.eyebrow{font:650 var(--t-xs)/1.2 var(--body);letter-spacing:.09em;text-transform:uppercase;color:var(--on-dark-2)}
.f-txt{display:grid;gap:var(--s-4);justify-items:start;max-width:34rem}
.f-list{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-4);font:500 clamp(1.6rem,3vw,2.5rem)/1.15 var(--display);color:#fff;max-width:30rem}
.f-num{font:500 clamp(2.1rem,4.2vw,3.4rem)/1 var(--display);color:#fff;text-decoration-color:var(--gold);text-decoration-thickness:3px;text-underline-offset:.2em;font-variant-numeric:lining-nums}
.receipt{font-size:var(--t-sm);color:var(--on-dark-2)}
.receipt a{color:#fff}
.f-cue{display:none;align-items:center;gap:var(--s-2);font-size:var(--t-sm);color:var(--on-dark-2)}
.f-cue svg{width:1rem;height:1rem}
.f-stage .f-canvasbox,.f-scrim,.f-progress{display:none}
.f-ch{position:relative;isolation:isolate;display:grid;align-items:end;min-height:min(80svh,46rem);padding:var(--s-9) var(--gut) var(--s-8)}
.f-ch + .f-ch{border-block-start:1px solid var(--line-d)}
.f-still{position:absolute;inset:0;z-index:calc(var(--z-back) - 2)}
.f-still img{width:100%;height:100%;object-fit:cover;object-position:80% 50%}
.f-ch::before{content:"";position:absolute;inset:0;z-index:calc(var(--z-back) - 1);background:linear-gradient(90deg,rgba(13,25,17,.92) 0,rgba(13,25,17,.72) 34%,rgba(13,25,17,.1) 66%),linear-gradient(0deg,rgba(13,25,17,.6),rgba(13,25,17,0) 40%)}
.f-ch .f-txt{width:min(100%,var(--wrap));margin-inline:auto;max-width:none}
.f-ch .f-txt>*{max-width:34rem}
.f-foot{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-5);align-items:center;justify-content:space-between;padding:var(--s-4) var(--gut) var(--s-7);max-width:calc(var(--wrap) + 2 * var(--gut));margin-inline:auto}
.f-tag{font-size:var(--t-xs);color:var(--on-dark-2)}
.f-toggle{min-height:2.75rem;padding-inline:var(--s-4);border-radius:99px;border:1px solid rgba(251,244,233,.4);background:rgba(13,25,17,.6);color:var(--on-dark);font:600 var(--t-sm)/1 var(--body);cursor:pointer}
.f-toggle:hover{background:rgba(251,244,233,.14)}
html.no-js .f-toggle{display:none}
@media (max-width:63.99rem){
 .f-ch{min-height:0;padding:0 0 var(--s-7);align-items:start}
 .f-still{position:relative;inset:auto;display:block;aspect-ratio:5/4;max-height:56svh;width:100%;overflow:hidden}
 .f-ch::before{inset:auto 0 0 0;height:100%;background:linear-gradient(180deg,rgba(22,41,28,0) 0,rgba(22,41,28,0) 40%,var(--ink) 64%)}
 .f-ch .f-txt{padding-inline:var(--gut);margin-block-start:calc(-1 * var(--s-6));position:relative}
}
/* ---------- LIVE mode: one pinned stage, the film plays with the scroll ---------- */
html.film-live .film{height:460svh}
html.film-live .f-stage{position:sticky;top:var(--hdr-h,var(--hdr));height:calc(100svh - var(--hdr-h,var(--hdr)));overflow:hidden;background:var(--ink)}
html.film-live .f-canvasbox{display:block;position:absolute;inset:0;overflow:hidden;z-index:var(--z-back)}
html.film-live .f-poster,html.film-live .f-canvas{position:absolute;inset:0;width:100%;height:100%}
html.film-live .f-poster{object-fit:cover;object-position:80% 50%}
html.film-live .f-canvas{opacity:0}
html.film-live .film-ready .f-canvas{opacity:1}
html.film-live .f-scrim{display:block;position:absolute;inset:0;z-index:var(--z-scrim);pointer-events:none}
html.film-live .f-scrim::before,html.film-live .f-scrim::after{content:"";position:absolute;inset:0;transition:opacity .5s linear}
html.film-live .f-scrim::before{background:linear-gradient(90deg,rgba(13,25,17,.88) 0,rgba(13,25,17,.7) 26%,rgba(13,25,17,.2) 44%,rgba(13,25,17,0) 54%)}
html.film-live .f-scrim::after{opacity:0;background:radial-gradient(120% 90% at 0% 100%,rgba(13,25,17,.92) 0,rgba(13,25,17,.72) 34%,rgba(13,25,17,0) 62%)}
html.film-live .film.is-low .f-scrim::before{opacity:.25}
html.film-live .film.is-low .f-scrim::after{opacity:1}
html.film-live .f-still{display:none}
html.film-live .f-copy{position:absolute;inset:0;z-index:var(--z-mid);display:grid;align-items:center;max-width:calc(var(--wrap) + 2 * var(--gut));margin-inline:auto;padding:var(--s-7) var(--gut) var(--s-8)}
html.film-live .f-ch{grid-area:1/1;min-height:0;padding:0;border:0;display:block;opacity:0;pointer-events:none;transform:translateY(.6rem);transition:opacity .3s var(--ease),transform .4s var(--ease)}
html.film-live .f-ch::before{content:none}
html.film-live .f-ch.on{opacity:1;pointer-events:auto;transform:none;transition:opacity .35s var(--ease) .12s,transform .45s var(--ease) .12s}
html.film-live .f-ch .f-txt{margin:0;width:auto;max-width:34rem}
html.film-live [data-at]{opacity:0;transform:translateY(.35em);transition:opacity .3s var(--ease),transform .35s var(--ease)}
html.film-live [data-at].lit{opacity:1;transform:none}
html.film-live .f-ch.low{align-self:end;padding-block-end:var(--s-6)}
html.film-live .f-ch.hi{align-self:start;padding-block-start:clamp(1rem,5svh,3.5rem)}   /* later chapters sit low-left on the dark ledge, never on a lit window */
html.film-live .f-ch .f-txt>*{text-shadow:0 1px 16px rgba(13,25,17,.8)}
html.film-live .f-ch .btn{text-shadow:none}
html.film-live .f-cue{display:inline-flex}
html.film-live .f-foot{position:absolute;z-index:var(--z-label);left:0;right:0;bottom:0;padding:var(--s-4) var(--gut);max-width:none;justify-content:flex-end;pointer-events:none}
html.film-live .f-foot>*{pointer-events:auto}
html.film-live .f-tag{background:rgba(13,25,17,.62);padding:var(--s-2) var(--s-3);border-radius:99px}
html.film-live .f-progress{display:block;position:absolute;z-index:var(--z-label);left:0;right:0;bottom:0;height:3px;background:rgba(251,244,233,.14)}
html.film-live .f-progress i{display:block;height:100%;background:var(--on-dark);transform-origin:0 50%;transform:scaleX(var(--p,0))}
@media (max-width:63.99rem){   /* film on top, words under it, centred in the space that is left: no empty band */
 html.film-live .f-stage{display:flex;flex-direction:column}
 html.film-live .f-canvasbox{position:relative;inset:auto;flex:none;height:min(86vw,50svh)}
 html.film-live .f-scrim{inset:0 0 auto 0;height:min(86vw,50svh)}
 html.film-live .f-scrim::before{opacity:1!important;background:linear-gradient(180deg,rgba(22,41,28,0) 88%,var(--ink) 100%)}
 html.film-live .f-scrim::after{content:none}
 html.film-live .f-ch.low{align-self:center;padding-block-end:0}
 html.film-live .f-copy{position:relative;inset:auto;flex:1;align-items:center;padding:var(--s-3) var(--gut) var(--s-5)}
 html.film-live .f-ch .f-txt{gap:var(--s-3)}
 html.film-live .f-ch .f-txt>*{text-shadow:none}
 html.film-live .film .lede{font-size:var(--t-md)}
 html.film-live .film h1{font-size:clamp(2rem,9.4vw,3rem)}
 html.film-live .film h2{font-size:clamp(1.9rem,8.6vw,2.6rem)}
 html.film-live .f-foot{bottom:auto;top:var(--s-2);padding:0 var(--s-3);justify-content:flex-end;gap:var(--s-2)}
 html.film-live .f-tag{font-size:.75rem;padding:var(--s-1) var(--s-3)}
 html.film-live .f-toggle{min-height:2.5rem;font-size:var(--t-xs);padding-inline:var(--s-3)}
 html.film-live .f-cue{display:none}
}
@media (max-width:63.99rem) and (max-height:44rem){
 html.film-live .f-canvasbox,html.film-live .f-scrim{height:36svh}
 html.film-live .film h1{font-size:clamp(1.8rem,8.2vw,2.3rem)}
 html.film-live .film .lede{font-size:var(--t-sm);line-height:1.45}
 html.film-live .film .eyebrow{display:none}
 html.film-live .film .btn{min-height:2.75rem;padding:.5rem .9rem;font-size:var(--t-sm)}
}
@media (prefers-reduced-motion:reduce){html.film-live .f-ch{transition:none}}

/* ---------- sections below the film: calm, no motion ---------- */
.sec{padding-block:var(--s-9)}
.sec-head{display:grid;gap:var(--s-4);max-width:44rem;margin-block-end:var(--s-7)}
/* 2: what you get. split, and the screenshot card hangs into the next band */
.get{position:relative}
.get .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:var(--s-8);align-items:start}
.get-list{display:grid;gap:var(--s-3);margin-block:var(--s-5) var(--s-6)}
.get-list li{display:grid;grid-template-columns:1.5rem 1fr;gap:var(--s-3);align-items:start}
.get-list svg{width:1.25rem;height:1.25rem;margin-block-start:.2rem;color:var(--green)}
.shot{position:relative;z-index:var(--z-edge);margin-block-start:calc(-1 * (var(--s-9) + 6rem));background:var(--card);border:2px solid var(--ink);border-radius:var(--r);box-shadow:var(--lift-lg);overflow:hidden}
.shot-bar{display:flex;align-items:center;gap:.4rem;padding:.55rem .8rem;border-block-end:2px solid var(--ink);background:var(--paper-2)}
.shot-bar i{width:.6rem;height:.6rem;border-radius:50%;border:1.5px solid var(--ink)}
.shot-bar span{margin-inline-start:auto;font:650 var(--t-xs)/1 var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--green)}
.shot img{width:100%}
.shot figcaption{padding:.6rem .8rem;font-size:var(--t-xs);color:var(--muted);border-block-start:1px solid var(--line)}
/* 3: proof. dark band, one big figure and two smaller, each with its receipt */
.proof{background:var(--ink);color:var(--on-dark);padding-block:var(--s-9)}
.proof h2{color:#fff}
.proof .lede{color:var(--on-dark-2)}
.figs{display:grid;grid-template-columns:1.25fr 1fr;gap:var(--s-7) var(--s-8);align-items:end;margin-block-end:var(--s-7)}
.fig b{display:block;font:500 clamp(3.4rem,9vw,7rem)/.95 var(--display);color:#fff;font-variant-numeric:lining-nums}
.fig b small{font-size:.36em;color:var(--on-dark-2);font-family:var(--body);font-weight:500;letter-spacing:0}
.fig p{margin-block-start:var(--s-3);color:var(--on-dark-2);max-width:26ch}
.figs-side{display:grid;gap:var(--s-6)}
.figs-side .fig b{font-size:clamp(2.2rem,4.6vw,3.4rem)}
.method{border-block:1px solid var(--line-d)}
.method summary{cursor:pointer;padding:var(--s-4) 0;font-weight:650;color:#fff;list-style:none;display:flex;justify-content:space-between;gap:var(--s-4)}
.method summary::-webkit-details-marker{display:none}
.method summary::after{content:"+";font:400 1.5rem/1 var(--body)}
.method[open] summary::after{content:"\2212"}
.method p{padding-block-end:var(--s-5);color:var(--on-dark-2);max-width:70ch}
/* 4: work. bento */
.bento{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--s-5)}
.tile{grid-column:span 2;display:grid;gap:var(--s-2);align-content:start}
.tile.big{grid-column:span 4;grid-row:span 2}
.tile.wide{grid-column:span 3}
.tile a.im{position:relative;display:block;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--card)}
.tile.wide a.im img{width:100%}   /* whole picture, never a crop that cuts a headline line */
.tile .chip{position:absolute;z-index:var(--z-label);left:var(--s-3);bottom:var(--s-3);background:var(--ink);color:var(--on-dark);font:650 .75rem/1 var(--body);letter-spacing:.06em;text-transform:uppercase;padding:.4rem .6rem;border-radius:99px}
.tile .ind{font:650 var(--t-xs)/1.2 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-block-start:var(--s-2)}
.tile h3 a{color:var(--green);text-decoration:none}
.tile h3 a:hover{text-decoration:underline}
.tile p{color:var(--muted);font-size:var(--t-sm)}
/* 5: how. numbered steps on one line */
.how{background:var(--paper-2)}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-6);counter-reset:s;position:relative}
.steps::before{content:"";position:absolute;left:1.5rem;right:1.5rem;top:1.5rem;border-block-start:2px dashed var(--green);opacity:.45}
.steps li{position:relative;display:grid;gap:var(--s-2);align-content:start}
.steps li::before{counter-increment:s;content:counter(s);display:grid;place-items:center;width:3rem;height:3rem;border-radius:50%;background:var(--paper-2);border:2px solid var(--green);font:500 1.4rem/1 var(--display);color:var(--green);margin-block-end:var(--s-3)}
.steps .when{font:650 var(--t-xs)/1.2 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.steps p{color:var(--muted);font-size:var(--t-sm)}
/* 6: prices. a table */
.ptable{width:100%;border-collapse:collapse;font-size:var(--t-md)}
.ptable caption{text-align:start;color:var(--muted);font-size:var(--t-sm);padding-block-end:var(--s-4)}
.ptable th,.ptable td{text-align:start;vertical-align:top;padding:var(--s-5) var(--s-4) var(--s-5) 0;border-block-start:1px solid var(--line)}
.ptable tr:last-child th,.ptable tr:last-child td{border-block-end:1px solid var(--line)}
.ptable th{font:500 clamp(1.2rem,2vw,1.5rem)/1.2 var(--display);color:var(--green);width:30%}
.ptable td.amt{white-space:nowrap;font:500 clamp(1.4rem,2.4vw,1.9rem)/1.1 var(--display);color:var(--green);width:22%;font-variant-numeric:lining-nums}
.ptable td.amt small{display:block;font:400 var(--t-xs)/1.4 var(--body);color:var(--muted)}
.ptable td.what{color:var(--muted);font-size:var(--t-sm)}
.pnote{margin-block-start:var(--s-5);color:var(--muted);font-size:var(--t-sm);max-width:70ch}
/* 7: questions. native accordion */
.qa{max-width:52rem}
.qa details{border-block-start:1px solid var(--line)}
.qa details:last-child{border-block-end:1px solid var(--line)}
.qa summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:var(--s-4);padding:var(--s-5) 0;font:500 clamp(1.2rem,2vw,1.45rem)/1.25 var(--display);color:var(--green)}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";font:400 1.5rem/1 var(--body);color:var(--muted)}
.qa details[open] summary::after{content:"\2212"}
.qa p{padding-block-end:var(--s-5);color:var(--muted);max-width:60ch}
/* 8: contact. full-width band */
.check{position:relative;isolation:isolate;background:var(--ink);color:var(--on-dark)}
.check-bg{position:absolute;inset:0;z-index:calc(var(--z-back) - 1);overflow:hidden}
.check-bg img{width:100%;height:100%;object-fit:cover;object-position:60% 40%;opacity:.3}
.check-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--ink) 0,rgba(22,41,28,.86) 45%,rgba(22,41,28,.6) 100%)}
.check h2{color:#fff}
.check .lede{color:var(--on-dark-2)}
.check .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-8);align-items:start}
.check .tel{display:inline-block;margin-block-start:var(--s-5);font:500 clamp(2rem,4vw,3rem)/1 var(--display);color:#fff;text-decoration-color:var(--gold);text-decoration-thickness:3px;text-underline-offset:.2em}
.form{position:relative;z-index:var(--z-edge);display:grid;gap:var(--s-4);background:var(--paper);color:var(--text);border:2px solid var(--ink);border-radius:var(--r);padding:var(--s-6);margin-block-start:calc(-1 * (var(--s-9) + 2.5rem))}   /* the form card rises 40px above the band's top edge */
.form .preview{font-size:var(--t-sm);background:var(--paper-2);border:1px dashed var(--green);border-radius:var(--r);padding:var(--s-3) var(--s-4);color:var(--green)}
.form fieldset{border:0;padding:0;margin:0;display:grid;gap:var(--s-2)}
.form legend,.form label{font-weight:650;color:var(--green)}
.form fieldset label{font-weight:400;color:var(--text);display:flex;gap:var(--s-2);align-items:center;min-height:2.5rem}
.form .field{display:grid;gap:var(--s-1)}
.form .hint,.form .req{font-size:var(--t-sm);color:var(--muted);font-weight:400}
.form input:not([type=radio]){font:inherit;min-height:3rem;padding:.6rem .8rem;border:1.5px solid var(--green);border-radius:var(--r);background:var(--card);color:var(--text);width:100%}
.form input[type=radio]{width:1.15rem;height:1.15rem;accent-color:var(--green)}
.form .err{color:#8A1C1C;font-size:var(--t-sm);font-weight:600}
.form .hp{position:absolute;left:-9999px}
.form .fine{font-size:var(--t-sm);color:var(--muted)}
.form .sent{font-weight:650;color:var(--green)}
/* footer */
.foot{background:var(--paper);border-block-start:1px solid var(--line);padding-block:var(--s-8) var(--s-7);font-size:var(--t-sm);color:var(--muted)}
.foot .wrap{display:grid;grid-template-columns:auto 1fr;gap:var(--s-7) var(--s-8);align-items:start}
.foot img{height:6rem;width:auto}
.foot-links{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);margin-block-end:var(--s-4)}
.foot-links a{color:var(--green);font-weight:600}
.foot small{display:block;font-size:var(--t-xs);line-height:1.6;max-width:80ch}
.foot small + small{margin-block-start:var(--s-3)}

@media (max-width:63.99rem){
 .sec{padding-block:var(--s-8)}
 .get .wrap,.check .wrap{grid-template-columns:1fr;gap:var(--s-6)}
 .form{margin-block-start:0}
 .shot{margin-block-start:0;box-shadow:5px 5px 0 var(--ink)}
 html.film-live .f-ch.hi{align-self:center;padding-block-start:0}
 .figs{grid-template-columns:1fr;gap:var(--s-6)}
 .bento{grid-template-columns:repeat(2,minmax(0,1fr))}
 .tile,.tile.big,.tile.wide{grid-column:span 1;grid-row:auto}
 .tile.big{grid-column:span 2}
 .steps{grid-template-columns:1fr;gap:var(--s-5)}
 .steps::before{left:1.5rem;right:auto;top:1.5rem;bottom:1.5rem;border-block-start:0;border-inline-start:2px dashed var(--green)}
 .steps li{grid-template-columns:3rem 1fr;column-gap:var(--s-4)}
 .steps li::before{grid-row:1 / span 3;margin:0}
 .steps li>*{grid-column:2}
 .foot .wrap{grid-template-columns:1fr}
}
@media (max-width:40rem){
 .bento{grid-template-columns:1fr}.tile.big,.tile.wide{grid-column:span 1}
 .ptable,.ptable tbody,.ptable tr,.ptable th,.ptable td{display:block;width:auto}
 .ptable tr{border-block-start:1px solid var(--line);padding-block:var(--s-4)}
 .ptable th,.ptable td{border:0!important;padding:var(--s-1) 0}
 .form{padding:var(--s-5)}
}

/* ---------- inner pages (the pages for Google): the same system, no film. Classes only; no new tokens. ---------- */
.crumb{display:flex;flex-wrap:wrap;gap:var(--s-2);font-size:var(--t-sm);color:var(--muted);margin-block-end:var(--s-5)}
.crumb a{color:var(--muted)}
.crumb li + li::before{content:"/";margin-inline-end:var(--s-2)}
.pg-head{padding-block:var(--s-8) var(--s-9)}
.pg-head .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:var(--s-8);align-items:center}
.pg-head h1{font-size:clamp(2.75rem,6.4vw,5rem)}
.pg-head .lede{margin-block:var(--s-5) var(--s-6);max-width:34ch}
.pg-head .shot{margin-block-start:0}
.pg-head.solo .wrap{grid-template-columns:1fr}
.pg-head.solo .lede{max-width:46ch}
.designs{display:grid;gap:var(--s-8)}
.dz{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:var(--s-7);align-items:center}
.dz:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)}
.dz:nth-child(even) .im{order:2}
.dz .im{display:block;border:2px solid var(--ink);border-radius:var(--r);overflow:hidden;background:var(--card)}
.dz .im img{width:100%}
.dz .ind{font:650 var(--t-xs)/1.2 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-block-end:var(--s-2)}
.dz h2{font-size:clamp(1.7rem,3vw,2.4rem);margin-block-end:var(--s-4)}
.dz div p{color:var(--muted);max-width:48ch}
.dz .dz-link{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);align-items:baseline;margin-block-start:var(--s-5)}
.dz .dz-link a{font-weight:650}
.dz .dz-link span{font-size:var(--t-sm)}
.nb{white-space:nowrap}
.kicker{font:650 var(--t-sm)/1.2 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--green)}
.points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-7) var(--s-7)}
.point{display:grid;gap:var(--s-3);align-content:start;border-block-start:2px solid var(--green);padding-block-start:var(--s-5)}
.point h2{font-size:clamp(1.45rem,2.3vw,1.85rem);line-height:1.15}
.point p{color:var(--muted)}
.points.four{grid-template-columns:repeat(2,minmax(0,1fr))}
.report .shot-bar span{margin-inline-start:auto}
.rep{display:grid;margin:0}
.rep div{display:grid;gap:var(--s-1);padding:var(--s-4) var(--s-5);border-block-start:1px solid var(--line)}
.rep div:first-child{border-block-start:0}
.rep dt{font:500 clamp(1.25rem,2vw,1.5rem)/1.2 var(--display);color:var(--green)}
.rep dd{margin:0;color:var(--muted)}
.band{background:var(--ink);color:var(--on-dark)}
.band h2{color:#fff}
.band .lede{color:var(--on-dark-2)}
.nots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-6) var(--s-8)}
.nots li{border-block-start:1px solid var(--line-d);padding-block-start:var(--s-4);color:var(--on-dark-2);max-width:44ch}
.nots b{display:block;margin-block-end:var(--s-2);font:500 clamp(1.25rem,2vw,1.5rem)/1.2 var(--display);color:#fff}
.suits{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:var(--s-8);align-items:start}
.suits .lede{max-width:44ch;color:var(--text)}
.more{margin-block:var(--s-4) var(--s-5);color:var(--muted);max-width:58ch}
.steps.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.tl{display:grid;counter-reset:t}
.tl li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:var(--s-5) var(--s-8);align-items:start;padding-block:var(--s-6);border-block-start:2px solid var(--green)}
.tl li:last-child{border-block-end:2px solid var(--green)}
.tl .when{font:500 clamp(2rem,4.6vw,3.5rem)/1 var(--display);color:var(--green);font-variant-numeric:lining-nums}
.tl h2{font-size:clamp(1.5rem,2.6vw,2.1rem);margin-block-end:var(--s-3)}
.tl div p{color:var(--muted);max-width:56ch}
.point h3{font-size:clamp(1.3rem,2.1vw,1.6rem)}
.bars{inline-size:100%;max-inline-size:56rem;border-collapse:collapse}
.bars caption{caption-side:bottom;text-align:start;color:var(--muted);font-size:var(--t-sm);padding-block-start:var(--s-4)}
.bars thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.bars th,.bars td{padding:var(--s-3) 0;border-block-start:1px solid var(--line);vertical-align:middle}
.bars tr:last-child th,.bars tr:last-child td{border-block-end:1px solid var(--line)}
.bars th{inline-size:13rem;text-align:start;font-weight:400;color:var(--text)}
.bars td.bar{padding-inline:var(--s-4)}
.bars td.bar i{display:block;block-size:1rem;min-inline-size:4px;background:var(--green);border-radius:0 4px 4px 0}
.bars tr.met td.bar i{background:transparent;border:2px solid var(--green);border-inline-start:0}
.bars td.n{inline-size:3.5rem;text-align:end;font:500 1.35rem/1 var(--display);color:var(--green);font-variant-numeric:lining-nums tabular-nums}
.pg-head .form{margin-block-start:0;box-shadow:8px 8px 0 var(--ink)}
.pg-head .lede .tel-in{color:var(--green);font-weight:650;white-space:nowrap}
.steps h3{font-size:clamp(1.3rem,2.1vw,1.6rem)}
.pcard{background:var(--card);border:2px solid var(--ink);border-radius:var(--r);box-shadow:8px 8px 0 var(--ink);padding:var(--s-7) var(--s-6);display:grid;gap:var(--s-2);justify-items:start}
.pcard .pk{font:650 var(--t-xs)/1.2 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pcard .amt{font:500 clamp(4rem,10vw,7rem)/1 var(--display);color:var(--green);font-variant-numeric:lining-nums}
.pcard .pl{font-size:var(--t-lg);color:var(--text)}
.pcard .pl.after{color:var(--muted)}
.src{margin-block-start:var(--s-6);font-size:var(--t-sm);color:var(--on-dark-2)}
.src a{color:var(--on-dark);text-decoration-color:var(--gold)}
.dz .more{margin-block-start:var(--s-2)}
.ghd{padding-block-end:var(--s-6)}.ghd .lede{max-width:52ch}.gmeta{font-size:var(--t-sm);color:var(--muted)}
.guide{padding-block-start:0}.gbody{max-width:46rem;display:grid;gap:var(--s-4)}
.gbody p{font-size:var(--t-md);line-height:1.65;color:var(--text)}
.gbody h2{font-size:clamp(1.6rem,2.8vw,2.1rem);margin-block-start:var(--s-6)}
.gbody a{color:var(--green);text-decoration-color:var(--gold);text-decoration-thickness:2px;text-underline-offset:.15em}
.gchk{inline-size:100%;border-collapse:collapse}.gchk th,.gchk td{text-align:start;vertical-align:top;padding:var(--s-3) var(--s-4) var(--s-3) 0;border-block-start:1px solid var(--line)}
.gchk thead th{font:650 var(--t-xs)/1.2 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border-block-start:0}
.gchk tbody th{font-weight:650;color:var(--green);inline-size:40%}.gchk tbody tr:last-child th,.gchk tbody tr:last-child td{border-block-end:1px solid var(--line)}
.gnum td{font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}.gnum tbody th{inline-size:auto}
@media (max-width:40rem){.gnum thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.gnum thead tr{display:block}.gnum thead th{display:block;max-inline-size:1px;overflow:hidden;padding:0;white-space:nowrap}.gnum,.gnum tbody,.gnum tr,.gnum tbody th,.gnum td{display:block;inline-size:auto}.gnum tr{border-block-start:1px solid var(--line);padding-block:var(--s-3)}.gnum tbody tr:last-child{border-block-end:1px solid var(--line)}.gnum tbody th,.gnum td{border:0!important;padding:.1rem 0;white-space:normal}.gnum td::before{content:attr(data-label) ": ";color:var(--muted)}}
.srcs{list-style:decimal;padding-inline-start:1.25rem;display:grid;gap:var(--s-2);font-size:var(--t-sm);color:var(--muted)}.gbody .srch{font-size:1.3rem}
.fixrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:var(--s-8);align-items:center}
.fixrow .shot{margin-block-start:0}
.fixrow h2{margin-block-end:var(--s-4)}
.bars td.n{padding-block-start:calc(var(--s-3) + 3px)}
.priceline{display:grid;gap:var(--s-3)}
.priceline .amt{font:500 clamp(3rem,8vw,5.5rem)/1 var(--display);color:var(--green);font-variant-numeric:lining-nums}
.priceline .amt span{font:400 var(--t-lg)/1.4 var(--body);color:var(--muted)}
.qa-h{font-size:clamp(1.6rem,3vw,2.25rem);margin-block-end:var(--s-5)}
.check.solo .wrap{grid-template-columns:minmax(0,1fr) auto;align-items:center}
.check.solo .tel{margin-block:0 var(--s-5)}
.solo-act{display:grid;justify-items:start}
@media (max-width:63.99rem){
 .pg-head{padding-block:var(--s-6) var(--s-8)}
 .pg-head .wrap,.suits,.check.solo .wrap{grid-template-columns:1fr;gap:var(--s-6)}
 .points{grid-template-columns:repeat(2,minmax(0,1fr))}
 .steps.three{grid-template-columns:1fr}
 .tl li{grid-template-columns:1fr;gap:var(--s-3);padding-block:var(--s-5)}
 .fixrow{grid-template-columns:1fr;gap:var(--s-6)}
 .proof .figs{margin-block-end:0}
 .bars th{inline-size:9.5rem}
 .dz,.dz:nth-child(even){grid-template-columns:1fr;gap:var(--s-5)}
 .dz:nth-child(even) .im{order:0}
}
@media (max-width:40rem){
 .points,.points.four,.nots{grid-template-columns:1fr}
}
.form input:not([type=radio]):not([type=checkbox]),.form textarea{font:inherit;min-height:3rem;padding:.6rem .8rem;border:1.5px solid var(--green);border-radius:var(--r);background:var(--card);color:var(--text);width:100%}
.form textarea{min-height:5.5rem;resize:vertical}
.form input[type=checkbox]{width:1.15rem;height:1.15rem;min-height:0;padding:0;accent-color:var(--green);flex:none}
.form label.tick{font-weight:400;color:var(--text);display:flex;gap:var(--s-2);align-items:center;min-height:2.75rem}
/* related pages: a short list of links before the call band on every inner page */
.rel{padding-block:var(--s-8)}
.rel h2{font-size:var(--t-sm);font-family:var(--sans,inherit);font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-block-end:var(--s-4)}
.rel-list{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-6)}
.rel-list a{display:inline-block;padding-block:.35rem}

/* ---- motion layer (owner, 2026-11-14: "is all the text supposed to sit still?"). js/motion.js adds html.mo and marks the blocks it will bring in.
   Without that script, or with "reduce motion" on, none of the hiding rules apply and the page is complete as it stands. Opacity and transform only. ---- */
html.mo .rv{opacity:0;transform:translateY(1.1rem)}
html.mo .rv.in{opacity:1;transform:none;transition:opacity .6s var(--ease) var(--d,0ms),transform .7s var(--ease) var(--d,0ms)}
.cnt{display:inline-block;white-space:nowrap;font-variant-numeric:lining-nums tabular-nums}
html.mo .steps.ln::before{clip-path:inset(0 100% 0 0);transition:clip-path 1.2s var(--ease) .2s}
html.mo .steps.ln.ln-in::before{clip-path:inset(0)}
@keyframes rw-buzz{0%,100%{transform:none}12%{transform:translateX(-2px) rotate(-1.2deg)}26%{transform:translateX(2px) rotate(1.2deg)}40%{transform:translateX(-2px) rotate(-1deg)}54%{transform:translateX(2px) rotate(.8deg)}68%{transform:translateX(-1px) rotate(-.4deg)}82%{transform:translateX(1px)}}
@media (prefers-reduced-motion:no-preference){
 .tel.buzz{animation:rw-buzz .75s ease-in-out 1}
 .tile a.im img,.dz .im img{transition:transform .6s var(--ease)}
 .btn:not(.lift):active{transform:translateY(1px)}
}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
 .tile a.im:hover img,.dz .im:hover img{transform:scale(1.025)}
 .rel-list a{transition:transform .2s var(--ease)}
 .rel-list a:hover{transform:translateX(3px)}
}
@media (max-width:47.99rem){html.mo .steps.ln::before{clip-path:inset(0 0 100% 0)}}
@media print{html.mo .rv{opacity:1;transform:none}html.mo .steps.ln::before{clip-path:none}}