/* Red Tip Automation v3. Flat poster colour: loud red, electric yellow, black, white. No gradients. */
:root{
  --red:#ff2d2d; --red-dk:#d41a1a; --yellow:#ffe600; --yellow-dk:#e6cf00;
  --black:#0a0a0a; --black-2:#1b1b1b; --black-3:#2a2a2a;
  --white:#ffffff; --paper:#f4f4f4; --paper-2:#e7e7e7; --green:#22c55e;
  --ink:#0a0a0a; --soft:#4a4a4a;
  --font:"Epilogue",system-ui,-apple-system,"Segoe UI",sans-serif;
  --step-small:clamp(0.875rem,0.85rem + 0.1vw,0.9375rem);
  --step-body:clamp(1.0625rem,1rem + 0.25vw,1.1875rem);
  --step-lead:clamp(1.25rem,1.1rem + 0.6vw,1.5rem);
  --step-mid:clamp(2rem,1.2rem + 2.6vw,3.5rem);
  --step-head:clamp(2.5rem,1.2rem + 5vw,5.5rem);
  --m:28px; --r:18px; --bw:3px;
  --hard:8px 8px 0 var(--black);
  --ease:cubic-bezier(.22,1,.36,1); --bounce:cubic-bezier(.34,1.36,.64,1);
  --header-ink:#ffffff; --tip:#ffe600;
}
@media (max-width:760px){:root{--m:16px;--r:16px;--hard:6px 6px 0 var(--black)}}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px;overflow-x:clip}
body{background:var(--black);color:var(--ink);font-family:var(--font);font-size:var(--step-body);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px;box-shadow:0 0 0 6px var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
::selection{background:var(--yellow);color:var(--black)}
.skip{position:absolute;left:var(--m);top:-100px;background:var(--yellow);color:var(--black);padding:12px 16px;z-index:60;font-weight:700}
.skip:focus{top:12px}
h1,h2,h3,.h-stair,.dw-word,.out-num,.price,.foot-mail,.mark,.counts b{font-weight:900;letter-spacing:-0.04em;line-height:.9}
.h-big{font-size:var(--step-head)}
.h-mid{font-size:var(--step-mid)}
.lead{font-size:var(--step-lead);line-height:1.35}

/* wordmark: the red tip is the brand device */
.mark{position:relative;display:inline-block;line-height:.78;white-space:nowrap;color:currentColor}
.mark::after{content:attr(data-text);position:absolute;inset:0;color:var(--tip,var(--red));clip-path:inset(0 0 72% 0);transition:color .3s ease}

/* buttons: chunky slab, hard shadow, presses down */
.btn{position:relative;display:inline-flex;align-items:center;gap:12px;min-height:56px;padding:0 26px;border:var(--bw) solid var(--black);border-radius:14px;background:var(--yellow);color:var(--black);font:800 var(--step-body)/1 var(--font);text-decoration:none;cursor:pointer;box-shadow:6px 6px 0 var(--black);transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .2s ease} /* taste-skill-ignore: hard offset shadow, client brief */
.btn::after{content:"";width:12px;height:12px;border-radius:3px;background:var(--red);border:2px solid var(--black);transition:transform .3s var(--bounce)}
.btn:hover,.btn:focus-visible{transform:translate(-3px,-3px);box-shadow:9px 9px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.btn:hover::after{transform:rotate(45deg) scale(1.25)}
.btn:active{transform:translate(4px,4px);box-shadow:2px 2px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.btn-sm{white-space:nowrap;min-height:46px;padding:0 18px;font-size:var(--step-small);box-shadow:4px 4px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.btn-big{min-height:66px;padding:0 32px;font-size:var(--step-lead)}

/* header: fixed, takes the ink of the chapter beneath (colour by chapter) */
.top{position:fixed;inset:0 0 auto 0;z-index:40;display:flex;align-items:center;gap:28px;padding:14px var(--m);color:var(--header-ink);background:var(--header-bg,transparent);transition:color .3s ease,background-color .3s ease,transform .35s var(--ease)}
.top.hide{transform:translateY(-120%)}
.logo{display:flex;align-items:flex-end;gap:8px;text-decoration:none}
.logo .mark{font-size:30px}
.logo-sub{font-size:var(--step-small);font-weight:700;line-height:1}
.top nav{display:flex;gap:26px;margin-left:auto;font-size:var(--step-small);font-weight:700}
.top nav a{text-decoration:none;position:relative;padding:8px 0}
.top nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:4px;background:var(--tip);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
.top nav a:hover::after,.top nav a:focus-visible::after{transform:scaleX(1)}

/* HERO: solid red poster */
.hero{position:relative;min-height:100svh;background:var(--red);color:var(--white);overflow:hidden;isolation:isolate;padding:120px var(--m) 64px;display:flex;flex-direction:column;justify-content:flex-end}
.shapes{position:absolute;inset:0;z-index:-1;pointer-events:none}
.shapes i{position:absolute;display:block;will-change:transform}
.sh-sun{width:44vw;height:44vw;max-width:740px;max-height:740px;right:-12vw;top:16vh;border-radius:50%;background:var(--yellow)}
.sh-band{left:-5vw;right:-5vw;bottom:-6vh;height:14vh;background:var(--black);transform:rotate(-3deg)}
.sh-sq{width:120px;height:120px;left:46vw;top:16vh;background:var(--white);border-radius:22px;transform:rotate(14deg)}
.hero-in{position:relative;z-index:2;max-width:1500px}
.hero-h{font-size:clamp(2.4rem,7.1vw,8rem);line-height:.88;letter-spacing:-0.05em}
.hero-h span{display:block}
.l1{color:var(--white)}
.l2{color:var(--black)}
.hero-low{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;margin-top:36px;align-items:end}
.hero-sub{grid-column:1/6;font-size:var(--step-lead);line-height:1.35;font-weight:700}
.hero-cta{grid-column:1/8;display:flex;flex-wrap:wrap;align-items:center;gap:20px 28px;margin-top:28px}
.link-arrow{font-weight:800;text-decoration:none;border-bottom:4px solid var(--black);padding-bottom:4px;transition:color .2s ease,border-color .2s ease}
.link-arrow:hover{color:var(--yellow);border-color:var(--yellow)}

/* sticker */
.sticker{position:absolute;z-index:4;width:168px;height:168px;padding:18px;border-radius:50%;background:var(--yellow);color:var(--black);border:var(--bw) solid var(--black);box-shadow:6px 6px 0 var(--black);display:grid;place-items:center;text-align:center;font-weight:900;line-height:.95;letter-spacing:-0.03em;font-size:22px;transform:rotate(-12deg);transition:transform .5s var(--bounce);cursor:default} /* taste-skill-ignore: hard offset shadow, client brief */
.sticker:hover{transform:rotate(8deg) scale(1.08)}
.sticker small{display:block;font-size:13px;letter-spacing:0;font-weight:700;margin-top:4px}
.hero .sticker{right:calc(6vw + min(320px,22vw) + 10px);bottom:14vh}

/* phone mockup */
.phone-wrap{position:absolute;right:6vw;bottom:-30px;width:min(320px,22vw);z-index:3;perspective:1100px}
.phone{position:relative;aspect-ratio:9/18.5;border-radius:44px;background:var(--black);padding:11px;border:var(--bw) solid var(--black);box-shadow:14px 14px 0 var(--black);transform:rotate(6deg);transform-style:preserve-3d;transition:transform .6s var(--ease)} /* taste-skill-ignore: hard offset shadow, client brief */
.ph-notch{position:absolute;top:17px;left:50%;width:84px;height:22px;margin-left:-42px;border-radius:20px;background:#000;z-index:2}
.ph-head{display:flex;align-items:center;gap:10px;padding:46px 14px 12px;color:#fff;font-size:14px;line-height:1.2;background:var(--black-2);border-radius:34px 34px 0 0}
.ph-head small{display:block;color:#bdbdbd;font-size:13px}
.ph-av{width:34px;height:34px;border-radius:50%;background:var(--red);display:grid;place-items:center;font-weight:900}
.ph-feed{height:calc(100% - 92px);background:var(--paper);border-radius:0 0 34px 34px;padding:14px 12px;display:flex;flex-direction:column;gap:8px;overflow:hidden;justify-content:flex-end}
.m{max-width:86%;font-size:13.5px;line-height:1.35;padding:9px 12px;border-radius:16px;border:2px solid var(--black)}
.m.sys{align-self:center;background:var(--black);color:var(--yellow);font-weight:800;border-radius:999px;font-size:13px}
.m.out{align-self:flex-end;background:var(--red);color:var(--black);font-weight:600;border-bottom-right-radius:4px}
.m.in{align-self:flex-start;background:#fff;color:var(--black);border-bottom-left-radius:4px}
.m.booked{align-self:stretch;max-width:none;background:var(--yellow);color:var(--black);display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;padding:12px 14px;box-shadow:4px 4px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.m.booked b{font-size:16px;font-weight:900}
.m.booked span:last-child{grid-column:2;font-size:13px;font-weight:600}
.bk-dot{grid-row:span 2;width:16px;height:16px;border-radius:50%;background:var(--red);border:2px solid var(--black)}
.m.typing{display:none}
.confetti{position:absolute;left:-60%;top:-30%;width:220%;height:160%;pointer-events:none}

/* ticker: thick yellow band */
.ticker{background:var(--yellow);color:var(--black);overflow:hidden;padding:18px 0;position:relative;z-index:4;border-block:var(--bw) solid var(--black)}
.tk-track{display:flex;width:max-content}
.tk-track p{display:flex;align-items:center;gap:28px;padding-right:28px;font-weight:900;font-size:var(--step-mid);letter-spacing:-0.03em;white-space:nowrap}
.tk-track i{width:18px;height:18px;background:var(--red);border:2px solid var(--black);transform:rotate(45deg);display:inline-block}

/* DUEL */
.duel{background:var(--black);color:#fff;padding:140px var(--m) 0;height:min(100svh,960px);min-height:720px;overflow:hidden;display:flex;flex-direction:column}
.duel-top{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:start}
.duel-top h2{grid-column:1/6}
.duel-top p{grid-column:7/12;font-size:var(--step-lead);line-height:1.4;color:#e2e2e2}
.duel-words{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:10vh;flex:1}
.dw-cap{display:inline-block;font-size:var(--step-small);font-weight:800;margin-bottom:14px;padding:6px 12px;border-radius:8px;background:var(--black-3);color:#fff}
.dw:last-child .dw-cap{background:var(--yellow);color:var(--black)}
.dw-word{font-size:clamp(5rem,15vw,15rem);line-height:.82}
.dw-word.dim{color:#7a7a7a}
.dw-word.hot{color:var(--red)}

/* MATH */
.math{background:var(--yellow);color:var(--black);padding:150px var(--m);display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:center}
.math-say{display:contents}
.math-say h2{grid-column:1/-1;margin-bottom:56px}
.math-say .lead{grid-column:1/6;align-self:start;max-width:30ch;font-weight:600}
.app{grid-column:7/13;background:var(--black);color:#fff;border-radius:24px;border:var(--bw) solid var(--black);box-shadow:14px 14px 0 var(--red);overflow:hidden;transform:rotate(-1.2deg)} /* taste-skill-ignore: hard offset shadow, client brief */
.app-bar{display:flex;align-items:center;gap:8px;padding:14px 20px;background:var(--black-2);font-size:var(--step-small)}
.app-bar span{width:12px;height:12px;border-radius:50%;background:var(--red)}
.app-bar span:nth-child(2){background:var(--yellow)}
.app-bar span:nth-child(3){background:var(--green)}
.app-bar b{margin-left:10px;font-weight:700;color:#cfcfcf}
.app-body{padding:28px;display:grid;gap:22px}
.sl{display:grid;grid-template-columns:1fr auto;gap:4px 16px;align-items:baseline}
.sl label{font-weight:700}
.sl output{font-weight:900;font-size:var(--step-lead);color:var(--yellow);font-variant-numeric:tabular-nums}
.sl input{grid-column:1/-1}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:44px;background:transparent;cursor:pointer}
input[type=range]::-webkit-slider-runnable-track{height:12px;border-radius:12px;background:var(--black-3)}
input[type=range]::-moz-range-track{height:12px;border-radius:12px;background:var(--black-3)}
input[type=range]::-moz-range-progress{height:12px;border-radius:12px;background:var(--red)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:32px;height:32px;margin-top:-10px;border-radius:10px;background:var(--yellow);border:var(--bw) solid var(--black);box-shadow:3px 3px 0 var(--red);transition:transform .2s var(--bounce)} /* taste-skill-ignore: hard offset shadow, client brief */
input[type=range]:active::-webkit-slider-thumb{transform:scale(1.2) rotate(12deg)}
input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:8px;background:var(--yellow);border:var(--bw) solid var(--black)}
.app-out{color:var(--black);background:var(--red);border-radius:16px;padding:24px;border:var(--bw) solid var(--black);box-shadow:6px 6px 0 var(--yellow)} /* taste-skill-ignore: hard offset shadow, client brief */
.out-num{font-size:var(--step-head);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.out-num span{font-variant-numeric:tabular-nums;display:inline-block}
.out-num span.bump{animation:bump .35s var(--bounce)}
.out-num small{font-size:var(--step-lead);letter-spacing:0;font-weight:800}
.out-say{margin-top:10px;font-weight:600}
.out-say b{font-weight:900}
.tb{display:grid;gap:10px}
.tb label{font-weight:700}
.tb input,.cp-fields input,.cp-fields select{font:inherit;font-size:var(--step-body);min-height:54px;width:100%;padding:12px 16px;border-radius:12px;border:var(--bw) solid var(--black);background:#fff;color:var(--black)}
.tb input:focus{outline:none;box-shadow:4px 4px 0 var(--yellow)} /* taste-skill-ignore: hard offset shadow, client brief */
/* booking form sits on red: a black ring passes 3:1 where the yellow shadow did not */
.cp-fields input:focus,.cp-fields select:focus,.cp-fields input:focus-visible,.cp-fields select:focus-visible{outline:3px solid var(--black);outline-offset:3px;box-shadow:none}
.tb-bubble{background:var(--red);color:var(--black);font-weight:600;padding:12px 16px;border-radius:16px 16px 4px 16px;border:2px solid #fff;justify-self:end;max-width:40ch}
.tb-note{font-size:var(--step-small);color:#cfcfcf;justify-self:end}

/* SERVICES mosaic of colour-blocked tiles */
.services{background:var(--white);padding:150px var(--m) 140px}
.mosaic{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(96px,auto);gap:16px}
.tile{border-radius:var(--r);padding:28px;position:relative;overflow:hidden;border:var(--bw) solid var(--black);box-shadow:var(--hard);transition:transform .25s var(--ease),box-shadow .25s var(--ease)} /* taste-skill-ignore: hard offset shadow, client brief */
.tile h3{font-size:clamp(1.6rem,1rem + 1.5vw,2.4rem);line-height:.98;margin-bottom:14px}
.tile p{max-width:52ch}
.tile:not(.t-head):hover{transform:translate(-4px,-4px);box-shadow:12px 12px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.t-head{grid-column:1/-1;grid-row:span 2;padding:8px 0 24px;border:0;box-shadow:none;display:flex;align-items:flex-end;justify-content:space-between;gap:24px 48px;flex-wrap:wrap} /* taste-skill-ignore: hard offset shadow, client brief */
.t-head p{font-size:var(--step-lead);line-height:1.35;max-width:44ch;font-weight:500}
.t-desk{grid-column:1/7;grid-row:span 6;background:var(--black);color:#fff}
.t-lead{grid-column:7/13;grid-row:span 6;background:var(--paper)}
.t-rev{grid-column:1/6;grid-row:span 4;background:var(--yellow)}
.t-vis{grid-column:6/13;grid-row:span 4;background:var(--red);color:var(--black)}
.t-content{grid-column:1/8;grid-row:span 4;background:var(--black);color:#fff}
.t-office{grid-column:8/13;grid-row:span 4;background:var(--yellow)}
.t-store{grid-column:1/6;grid-row:span 3;background:var(--red);color:var(--black)}
.t-train{grid-column:6/13;grid-row:span 3;background:var(--paper)}
.tile-sub{margin-top:12px;font-size:var(--step-small);line-height:1.5}
.t-desk .tile-sub{color:#cfcfcf}
.tile p b{font-weight:800}
.agency{margin-top:56px;display:inline-block;font-size:var(--step-lead);font-weight:700;max-width:52ch;background:var(--black);color:#fff;padding:18px 22px;border-radius:14px;transform:rotate(-1deg)}

/* tile UIs */
.ui-stars{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:20px}
.stars{display:flex;gap:4px}
.stars i{width:28px;height:28px;background:var(--black);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);transition:background .25s ease,transform .35s var(--bounce)}
.stars i.on{background:var(--red);transform:scale(1.18)}
.chip{display:inline-flex;align-items:center;gap:10px;background:var(--black);color:#fff;border-radius:12px;padding:6px 6px 6px 14px;font-size:var(--step-small);font-weight:700}
.chip b{background:var(--red);color:var(--black);border-radius:8px;padding:6px 12px;transition:transform .3s var(--bounce)}
.chip b.on{transform:scale(1.12)}
.ui-steps{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.ui-steps span,.flow span{font-size:var(--step-small);font-weight:800;padding:8px 14px;border-radius:10px;border:2px solid var(--black);background:#fff;color:var(--black);transition:background .25s ease,color .25s ease,transform .35s var(--bounce),box-shadow .25s ease} /* taste-skill-ignore: hard offset shadow, client brief */
.ui-steps span.on{background:var(--yellow);transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.cal{margin-top:24px;background:var(--black-2);border-radius:14px;padding:16px;border:2px solid #333}
.cal-head{display:flex;justify-content:space-between;gap:12px;font-size:var(--step-small);margin-bottom:12px;color:#cfcfcf}
.cal-head b{color:#fff}
.cal-head em{font-style:normal;font-weight:900;color:var(--yellow);display:inline-block}
.cal-grid{display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:auto repeat(4,46px);gap:6px}
.cal-grid .d{font-size:13px;font-weight:800;color:#bdbdbd;text-align:center;padding-bottom:4px}
.cal-grid .col{grid-row:2/6;background:var(--black-3);border-radius:10px}
.job{grid-column:var(--c);grid-row:var(--r);font-size:12.5px;font-weight:800;line-height:1.15;padding:6px 8px;border-radius:9px;border:2px solid var(--black);display:flex;align-items:center;z-index:1}
.j1{background:var(--red);color:var(--black)}
.j2{background:var(--yellow);color:var(--black)}
.j3{background:#fff;color:var(--black)}
.dash{margin-top:24px;background:var(--white);border-radius:14px;padding:10px;display:grid;gap:6px;border:2px solid var(--black)}
.dash-row{display:grid;grid-template-columns:1.1fr 1fr 1.4fr;gap:10px;align-items:center;background:var(--paper);border-radius:9px;padding:10px 12px;font-size:var(--step-small);font-weight:600}
.dash-row.hd{background:transparent;font-weight:800;color:var(--soft);padding-block:4px}
.st{justify-self:start;font-weight:800;border-radius:8px;padding:4px 10px;font-size:13px;border:2px solid var(--black)}
.st.ok{background:var(--green);color:var(--black)}
.st.bk{background:var(--yellow);color:var(--black)}
.st.fu{background:var(--red);color:var(--black)}
.feed{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px;align-items:center}
.feed .vid{background:var(--yellow);color:var(--black);font-weight:900;padding:14px 16px;border-radius:12px;border:2px solid var(--black)}
.post{display:grid;background:#fff;color:var(--black);font-weight:800;font-size:var(--step-small);padding:8px 12px;border-radius:10px;border:2px solid var(--black)}
.post small{font-weight:600;color:var(--soft);font-size:13px}
.flow{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.flow span.on{background:var(--red);color:var(--black);transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.flow span.done{background:var(--black);color:var(--yellow)}

/* PACKAGES: plans that step up */
.packages{background:var(--black);color:#fff;padding:150px var(--m)}
.steps{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;align-items:end}
.pk-say{grid-column:1/-1;align-self:start;margin-bottom:24px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px 48px}
.pk-say p{margin-top:0;font-size:var(--step-lead);line-height:1.35;color:#e2e2e2;max-width:30ch}
.plan{border-radius:var(--r);padding:28px 28px 0;display:flex;flex-direction:column;overflow:hidden;border:var(--bw) solid var(--black);box-shadow:8px 8px 0 #fff;transition:transform .25s var(--ease),box-shadow .25s var(--ease)} /* taste-skill-ignore: hard offset shadow, client brief */
.plan:hover{transform:translate(-4px,-4px);box-shadow:12px 12px 0 #fff} /* taste-skill-ignore: hard offset shadow, client brief */
.plan h3{font-size:clamp(1.6rem,1rem + 1.5vw,2.4rem);margin-bottom:16px}
.price{font-size:var(--step-mid);line-height:1.05;margin-bottom:20px;font-variant-numeric:tabular-nums}
.price small{font-size:var(--step-body);letter-spacing:0;font-weight:700}
.plan ul{list-style:none;display:grid;gap:8px;margin-bottom:28px}
.plan li{padding-left:24px;position:relative;font-weight:500}
.plan li::before{content:"";position:absolute;left:0;top:.4em;width:11px;height:11px;border-radius:3px;background:currentColor;transform:rotate(45deg)}
.plan-go{margin:auto -28px 0;padding:20px 28px;font-weight:900;text-decoration:none;display:flex;justify-content:space-between;align-items:center;border-top:var(--bw) solid var(--black);transition:padding .25s var(--ease),background .2s ease}
.plan-go::after{content:"";width:12px;height:12px;border-right:4px solid currentColor;border-top:4px solid currentColor;transform:rotate(45deg)}
.plan-go:hover{padding-left:40px}
.p1{grid-column:1/5;min-height:470px;background:var(--red);color:var(--black)}
.p1 .plan-go{background:var(--red-dk)}
.p2{grid-column:5/9;min-height:560px;background:var(--yellow);color:var(--black);position:relative}
.p6{grid-column:9/13;min-height:650px;background:#fff;color:var(--black)}
.p6 .plan-go{background:var(--paper-2)}
.tag{align-self:flex-start;background:var(--black);color:var(--yellow);font-weight:900;font-size:var(--step-small);padding:6px 12px;border-radius:999px;margin-bottom:14px;transform:rotate(-3deg)}
.p2 .plan-go{background:var(--yellow-dk)}
.more{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.more .plan{min-height:280px}
.more .plan p:not(.price){margin-bottom:24px}
.more .price{font-size:var(--step-lead)}
.p3{background:#fff;color:var(--black)}
.p3 .plan-go{background:var(--paper-2)}
.p4{background:var(--red);color:var(--black)}
.p4 .plan-go{background:var(--red-dk)}
.p5{background:var(--yellow);color:var(--black)}
.p5 .plan-go{background:var(--yellow-dk)}
.pilot{margin-top:56px;font-size:var(--step-lead);line-height:1.4;max-width:56ch;background:var(--red);color:var(--black);padding:22px 26px;border-radius:14px;border:var(--bw) solid #fff;transform:rotate(-1deg);display:inline-block}
.pilot b{font-weight:900}

/* PROOF: card on a red ground */
.proof{background:var(--red);padding:150px var(--m) 0;height:min(100svh,900px);min-height:760px;overflow:hidden;position:relative;isolation:isolate}
.card{width:min(1040px,100%);margin:0 auto;background:#fff;color:var(--black);border-radius:26px;padding:56px;transform:rotate(-1.5deg);min-height:120%;border:var(--bw) solid var(--black);box-shadow:16px 16px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.card h2{font-size:var(--step-mid);text-align:center}
.counts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:48px 0}
.counts p{display:grid;gap:10px;text-align:center;align-content:start}
.counts b{font-size:var(--step-head);letter-spacing:-0.05em;color:var(--red)}
.counts p:nth-child(even) b{color:var(--black)}
.counts span{font-weight:700;font-size:var(--step-small);max-width:18ch;justify-self:center}
.names{text-align:center;font-size:var(--step-lead);line-height:1.7;font-weight:700}
.card-note{text-align:center;margin-top:20px;color:var(--soft)}

/* HOW: lines that step across */
.how{background:var(--black);color:#fff;padding:160px var(--m)}
.stair{display:grid;grid-template-columns:repeat(12,1fr);row-gap:64px}
.st1{grid-column:1/-1}.st2{grid-column:3/-1}.st3{grid-column:5/-1}
.h-stair{font-size:var(--step-head);line-height:1}
.st1 .h-stair{color:#fff}.st2 .h-stair{color:var(--red)}.st3 .h-stair{color:var(--yellow)}
.stair p:not(.h-stair){margin-top:14px;max-width:38ch;color:#d6d6d6;font-size:var(--step-lead);line-height:1.4}

/* FAQ */
.faq{background:#fff;color:var(--black);padding:150px var(--m);display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:start}
.faq-h{grid-column:1/5;position:sticky;top:110px;font-size:var(--step-mid)}
.qs{grid-column:5/13;display:grid;gap:12px}
.qs details{background:var(--paper);border-radius:var(--r);border:var(--bw) solid var(--black);transition:background .2s ease,transform .2s var(--ease),box-shadow .2s var(--ease)} /* taste-skill-ignore: hard offset shadow, client brief */
.qs details:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.qs details[open]{background:var(--yellow);box-shadow:6px 6px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.qs summary{list-style:none;cursor:pointer;min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 24px;font-size:var(--step-lead);font-weight:700;line-height:1.25}
.qs summary::-webkit-details-marker{display:none}
.qs summary i{flex:none;position:relative;width:22px;height:22px}
.qs summary i::before,.qs summary i::after{content:"";position:absolute;left:0;top:9px;width:22px;height:4px;border-radius:2px;background:var(--red);transition:transform .3s var(--ease)}
.qs summary i::after{transform:rotate(90deg)}
.qs details[open] summary i::after{transform:rotate(0)}
.qs details[open] summary i::before{background:var(--black)}
.ans p{padding:0 24px 24px;max-width:56ch}

/* BOOK: the coupon */
.book{background:var(--black);padding:140px var(--m)}
.coupon{max-width:1240px;margin:0 auto;background:var(--red);color:var(--black);border-radius:26px;display:grid;grid-template-columns:42% 58%;position:relative;box-shadow:14px 14px 0 var(--yellow)} /* taste-skill-ignore: hard offset shadow, client brief */
.coupon::before,.coupon::after{content:"";position:absolute;left:42%;width:60px;height:60px;margin-left:-30px;border-radius:50%;background:var(--black)}
.coupon::before{top:-30px}.coupon::after{bottom:-30px}
.cp-say{padding:56px 48px;display:flex;flex-direction:column;justify-content:space-between;gap:32px;border-right:6px dotted var(--black)}
.cp-say h2{font-size:var(--step-mid)}
.cp-say p{font-size:var(--step-lead);line-height:1.35;font-weight:600}
.cp-fields{padding:48px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.f{display:grid;gap:6px;align-content:start}
.f-wide{grid-column:1/-1}
.f-check{display:flex;gap:12px;align-items:flex-start}
.f-check input{flex:none;width:24px;height:24px;margin:2px 0 0;accent-color:var(--black);cursor:pointer}
.f-check label{font-weight:700;line-height:1.4;cursor:pointer}
.f label{font-weight:800;font-size:var(--step-small)}
.cp-fields select{appearance:none;-webkit-appearance:none;cursor:pointer}
/* error state on red: black shadow (5.34:1) and a yellow fill instead of a yellow edge (about 2.9:1) */
.cp-fields [aria-invalid=true]{border-color:var(--black);background:#fff6a8;box-shadow:6px 6px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.err{justify-self:start;color:var(--black);background:var(--yellow);border-radius:6px;padding:2px 8px;font-weight:800;font-size:var(--step-small)}
.err:empty{display:none}
.btn-send{width:100%;justify-content:center;min-height:62px;background:var(--black);color:#fff;font-size:var(--step-lead);box-shadow:6px 6px 0 var(--yellow)} /* taste-skill-ignore: hard offset shadow, client brief */
.btn-send:hover,.btn-send:focus-visible{box-shadow:9px 9px 0 var(--yellow)} /* taste-skill-ignore: hard offset shadow, client brief */
.btn-send:active{box-shadow:2px 2px 0 var(--yellow)} /* taste-skill-ignore: hard offset shadow, client brief */
.status{margin-top:14px;font-weight:800}
.shake{animation:shake .4s var(--ease)}

/* FOOTER */
.foot{background:var(--yellow);color:var(--black);min-height:92svh;padding:40px var(--m) 32px;display:flex;flex-direction:column;--tip:var(--red);border-top:var(--bw) solid var(--black)}
.foot-row{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;font-size:var(--step-small);font-weight:700}
.foot-row p:first-child{grid-column:1/3}
.foot-row p:first-child .mark{font-size:24px;margin-right:6px}
.foot-row p:nth-child(2){grid-column:3/8;max-width:44ch}
.to-top{grid-column:11/13;justify-self:end;font-weight:800}
.foot-contact{margin-top:auto;display:flex;flex-wrap:wrap;align-items:flex-end;gap:20px 48px}
.foot-mail{font-size:clamp(2.4rem,7.1vw,8rem);line-height:.9;text-decoration:none;display:inline-block;transition:color .2s ease}
.foot-mail:hover,.foot-phone:hover{color:var(--red)}
.foot-phone{font-weight:900;letter-spacing:-0.04em;line-height:.9;font-size:var(--step-mid);text-decoration:none;white-space:nowrap;font-variant-numeric:tabular-nums;border-bottom:6px solid var(--red);padding-bottom:4px;transition:color .2s ease}
.foot-meta{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:40px;font-size:var(--step-small);font-weight:700}
.foot-meta a{text-underline-offset:3px}

/* consent line under the booking form */
.consent{margin-top:16px;font-size:var(--step-small);font-weight:600;line-height:1.45;max-width:62ch}
.consent a{font-weight:800;text-decoration-thickness:2px;text-underline-offset:3px}

/* DOC PAGES: terms, privacy, SMS terms, FAQ, accessibility. Flat colour, readable column. */
.doc-hero{background:var(--black);color:#fff;padding:150px var(--m) 72px}
.doc-hero h1{font-size:var(--step-head);max-width:14ch}
.doc-hero .lead{margin-top:24px;max-width:46ch;color:#e2e2e2;font-weight:600}
.doc-meta{display:inline-block;margin-top:28px;font-size:var(--step-small);font-weight:800;background:var(--yellow);color:var(--black);padding:6px 12px;border-radius:8px;border:2px solid var(--black)}
.doc{background:#fff;color:var(--black);padding:72px var(--m) 120px;border-top:var(--bw) solid var(--black)}
.doc-in{max-width:72ch;margin:0 auto}
.toc{background:var(--yellow);border:var(--bw) solid var(--black);border-radius:var(--r);box-shadow:var(--hard);padding:24px 28px;margin-bottom:56px} /* taste-skill-ignore: hard offset shadow, client brief */
.toc h2{font-size:var(--step-lead);letter-spacing:-0.02em;line-height:1.1;margin-bottom:12px}
.toc ol{padding-left:1.5em;columns:2;column-gap:36px;font-weight:700;font-size:var(--step-small)}
.toc li{break-inside:avoid;padding:4px 0}
.toc a{text-decoration-thickness:2px;text-underline-offset:3px}
.toc a:hover{color:var(--red-dk)}
.prose{overflow-wrap:anywhere}
.prose h2{font-size:clamp(1.6rem,1.2rem + 1.4vw,2.4rem);line-height:1.05;letter-spacing:-0.03em;margin-top:56px;padding-top:22px;border-top:var(--bw) solid var(--black)}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:var(--step-lead);line-height:1.15;letter-spacing:-0.02em;margin-top:28px}
.prose p,.prose ul,.prose ol{margin-top:14px}
.prose ul,.prose ol{padding-left:1.3em}
.prose li{margin-top:6px}
.prose li::marker{color:var(--red-dk);font-weight:900}
.prose a{font-weight:700;text-decoration-color:var(--red);text-decoration-thickness:3px;text-underline-offset:3px}
.prose a:hover{color:var(--red-dk)}
.prose strong{font-weight:800}
.callout{background:var(--paper);border:var(--bw) solid var(--black);border-radius:14px;padding:18px 20px;margin-top:20px;font-weight:600;box-shadow:6px 6px 0 var(--red)} /* taste-skill-ignore: hard offset shadow, client brief */
.callout p:first-child{margin-top:0}
.doc-cta{margin-top:64px;background:var(--red);color:var(--black);border:var(--bw) solid var(--black);border-radius:var(--r);padding:28px;box-shadow:var(--hard)} /* taste-skill-ignore: hard offset shadow, client brief */
.doc-cta h2{font-size:var(--step-mid);margin:0;padding:0;border:0}
.doc-cta p{margin-top:12px;font-weight:600;max-width:46ch}
.doc-cta .btn{margin-top:22px}

/* FAQ page: groups of questions */
.faq-doc{background:#fff;color:var(--black);padding:72px var(--m) 120px;border-top:var(--bw) solid var(--black)}
.faq-doc .toc{max-width:72ch}
.faq-group{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:start;padding-top:56px;margin-top:56px;border-top:var(--bw) solid var(--black)}
.faq-group:first-of-type{margin-top:0}
.faq-group h2{grid-column:1/5;position:sticky;top:110px;font-size:var(--step-mid);line-height:1}
.faq-group .qs{grid-column:5/13}
.ans p+p{margin-top:-8px}
.ans a{font-weight:800;text-decoration-color:var(--red);text-decoration-thickness:3px;text-underline-offset:3px}
.faq-doc .doc-cta{max-width:72ch}

/* DEMO LINE: pick a business, see it answer */
.demo{background:#fff;color:var(--black);padding:150px var(--m);display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:center}
.demo-say{grid-column:1/7}
.demo-say .lead{margin-top:28px;max-width:34ch;font-weight:600}
.demo-num{display:inline-block;margin-top:36px;font-weight:900;letter-spacing:-0.04em;line-height:.9;font-size:clamp(2.6rem,1.4rem + 4vw,5.5rem);text-decoration:none;font-variant-numeric:tabular-nums;border-bottom:8px solid var(--red);padding-bottom:6px;transition:color .2s ease}
.demo-num:hover{color:var(--red)}
.demo-note{margin-top:16px;font-weight:700;color:var(--soft)}
.call{grid-column:7/13;background:var(--black);color:#fff;border-radius:24px;border:var(--bw) solid var(--black);box-shadow:14px 14px 0 var(--red);padding:22px;transform:rotate(1.2deg)} /* taste-skill-ignore: hard offset shadow, client brief */
.call-pick{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.pk{font:800 var(--step-small)/1 var(--font);min-height:46px;padding:0 16px;border-radius:12px;border:var(--bw) solid #fff;background:transparent;color:#fff;cursor:pointer;transition:transform .2s var(--bounce),background .2s ease,color .2s ease}
.pk:hover{transform:translate(-2px,-2px)}
.pk.on{background:var(--yellow);color:var(--black);border-color:var(--yellow)}
.pk.lang{margin-left:auto;border-style:dashed}
.pk.lang.on{background:var(--red);border-color:var(--red);border-style:solid;color:var(--black)}
.call-screen{background:var(--black-2);border-radius:16px;padding:18px;display:grid;gap:10px;min-height:340px;align-content:start}
.call-bar{display:flex;align-items:center;gap:10px;font-size:var(--step-small);padding-bottom:10px;border-bottom:2px solid var(--black-3)}
.call-bar em{margin-left:auto;font-style:normal;font-weight:800;color:var(--yellow);font-variant-numeric:tabular-nums}
.rec{width:12px;height:12px;border-radius:50%;background:var(--green);flex:none}
.say{max-width:88%;padding:11px 14px;border-radius:16px;border:2px solid var(--black);font-size:15px;line-height:1.4}
.say.ai{background:var(--red);color:var(--black);font-weight:600;border-bottom-left-radius:4px}
.say.you{justify-self:end;background:#fff;color:var(--black);border-bottom-right-radius:4px}
.call-tag{justify-self:start;display:inline-flex;gap:10px;align-items:center;background:var(--yellow);color:var(--black);font-size:var(--step-small);font-weight:700;padding:8px 12px;border-radius:10px;border:2px solid var(--black)}
.call-tag b{font-weight:900}

/* AI answer box in the visibility tile */
.ask{margin-top:20px;display:grid;gap:10px}
.ask-q{justify-self:end;background:var(--black);color:#fff;padding:10px 14px;border-radius:14px 14px 4px 14px;font-weight:700;font-size:var(--step-small)}
.ask-a{background:#fff;color:var(--black);padding:12px 14px;border-radius:14px 14px 14px 4px;border:2px solid var(--black);font-size:var(--step-small);font-weight:600;max-width:46ch;min-height:4.6em}
.ask-a mark{background:var(--yellow);color:var(--black);padding:0 4px;border-radius:4px;font-weight:900}

/* add-ons */
.addons{margin-top:48px;display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:start}
.addons h3{grid-column:1/4;font-size:var(--step-mid)}
.addons ul{grid-column:4/13;list-style:none;display:flex;flex-wrap:wrap;gap:10px}
.addons li{font-weight:800;font-size:var(--step-small);padding:10px 14px;border-radius:10px;border:2px solid #fff;transition:background .2s ease,color .2s ease,transform .25s var(--bounce)}
.addons li:hover{background:var(--yellow);color:var(--black);border-color:var(--yellow);transform:rotate(-2deg)}

/* PROMISES: what we put in writing */
.promise{background:var(--yellow);color:var(--black);padding:150px var(--m);border-block:var(--bw) solid var(--black)}
.pr-say{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px 48px;margin-bottom:56px}
.pr-say .lead{max-width:36ch;font-weight:600}
.pr-list{list-style:none;counter-reset:pr;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pr-list li{counter-increment:pr;position:relative;background:#fff;border:var(--bw) solid var(--black);border-radius:var(--r);padding:26px 26px 26px 96px;box-shadow:var(--hard);transition:transform .25s var(--ease),box-shadow .25s var(--ease)} /* taste-skill-ignore: hard offset shadow, client brief */
.pr-list li:hover{transform:translate(-4px,-4px);box-shadow:12px 12px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
.pr-list li::before{content:counter(pr);position:absolute;left:24px;top:20px;font-weight:900;font-size:3.4rem;line-height:.9;letter-spacing:-0.05em;color:var(--red)}
.pr-list li:nth-child(even)::before{color:var(--black)}
.pr-list b{display:block;font-weight:900;font-size:var(--step-lead);letter-spacing:-0.02em;margin-bottom:6px}

@media (prefers-reduced-motion:no-preference){
  .say,.call-tag{transition:opacity .35s ease,transform .45s var(--bounce)}
  .js .say.hide,.js .call-tag.hide{opacity:0;transform:translateY(10px) scale(.96)}
  .rec{animation:ping-g 1.4s ease-out infinite}
}
@keyframes ping-g{0%{box-shadow:0 0 0 0 var(--green)}100%{box-shadow:0 0 0 10px rgba(34,197,94,0)}} /* taste-skill-ignore: hard offset shadow, client brief */

/* motion (no scroll-faded content: everything is readable without script) */
@media (prefers-reduced-motion:no-preference){
  .js .m.hide{opacity:0;transform:translateY(14px) scale(.94)}
  .m{transition:opacity .4s var(--ease),transform .45s var(--bounce)}
  .js .m.typing.show{display:flex;gap:4px;align-self:flex-start;background:#fff;padding:12px 14px}
  .m.typing i{width:7px;height:7px;border-radius:50%;background:var(--black);animation:dot 1s infinite}
  .m.typing i:nth-child(2){animation-delay:.15s}.m.typing i:nth-child(3){animation-delay:.3s}
  .booked.pop{animation:popin .55s var(--bounce)}
  .booked.pop .bk-dot{animation:ping 1.2s ease-out infinite}
  .js .job.hide,.js .dash-row.hide,.js .post.hide{opacity:0;transform:translateY(-14px) rotate(-4deg) scale(.85)}
  .job,.dash-row,.post{transition:opacity .35s ease,transform .5s var(--bounce)}
  .tk-track{animation:tick 36s linear infinite}
  .sticker{animation:stickin .6s var(--bounce) .9s backwards}
  .ticker:hover .tk-track{animation-play-state:paused}
}
@keyframes dot{0%,100%{transform:translateY(0);opacity:.4}50%{transform:translateY(-4px);opacity:1}}
@keyframes ping{0%{box-shadow:0 0 0 0 var(--red)}100%{box-shadow:0 0 0 12px rgba(255,45,45,0)}} /* taste-skill-ignore: hard offset shadow, client brief */
@keyframes popin{0%{transform:scale(.7) rotate(-4deg)}100%{transform:scale(1) rotate(0)}}
@keyframes bump{0%{transform:scale(1)}50%{transform:scale(1.08) rotate(-2deg)}100%{transform:scale(1)}}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-6px)}80%{transform:translateX(6px)}}
@keyframes tick{to{transform:translateX(-50%)}}
@keyframes stickin{from{opacity:0;transform:scale(1.6) rotate(-30deg)}to{opacity:1;transform:rotate(-12deg)}}

/* tablet */
@media (max-width:1100px){
  .top nav{display:none}
  .top .btn-sm{margin-left:auto}
  .hero{display:block;min-height:auto;padding-bottom:0}
  .phone-wrap{position:relative;right:auto;bottom:auto;width:300px;margin:48px 6vw -70px auto}
  .hero .sticker{display:none}
  .shapes .sh-sq{display:none}
  .hero-sub{grid-column:1/8}
  .math{grid-template-columns:1fr;row-gap:56px}
  .math-say .lead,.app{grid-column:1/-1}
  .math-say h2{margin-bottom:24px}
  .app{max-width:680px}
  .t-head{grid-column:1/-1;grid-row:auto}
  .t-rev,.t-vis,.t-store,.t-train,.t-desk,.t-lead,.t-content,.t-office{grid-column:1/-1;grid-row:auto}
  .pk-say{grid-column:1/-1;margin-bottom:32px}
  .p1{grid-column:1/7}.p2{grid-column:7/13}.p6{grid-column:1/-1;min-height:0}
  .demo{grid-template-columns:1fr;row-gap:48px}
  .demo-say,.call{grid-column:1/-1}
  .pr-list{grid-template-columns:1fr}
  .addons h3,.addons ul{grid-column:1/-1}
  .addons ul{margin-top:20px}
  .faq-h{grid-column:1/-1;position:static;margin-bottom:40px}
  .faq-group h2{grid-column:1/-1;position:static;margin-bottom:28px}
  .faq-group .qs{grid-column:1/-1}
  .qs{grid-column:1/-1}
  .coupon{grid-template-columns:1fr}
  .coupon::before,.coupon::after{display:none}
  .cp-say{border-right:0;border-bottom:6px dotted var(--black)}
}

/* phone */
@media (max-width:760px){
  .top{padding:12px var(--m);gap:12px}
  .logo .mark{font-size:26px}
  .hero{padding:96px var(--m) 0;display:block;min-height:auto}
  .sh-sun{width:120vw;height:120vw;right:-50vw;top:auto;bottom:-10vw;max-width:none;max-height:none}
  .shapes .sh-sq{display:none}
  .shapes .sh-band{display:none}
  .hero-h{font-size:9.1vw}
  .hero-low{display:block;margin-top:24px}
  .hero-cta{margin-top:24px}
  .hero-cta .btn{width:100%;justify-content:center}
  .phone-wrap{position:relative;right:auto;bottom:auto;width:78%;margin:56px auto -70px}
  .duel{padding-top:96px;height:auto;min-height:0;padding-bottom:0}
  .duel-top{display:block}
  .duel-top p{margin-top:20px}
  .duel-words{grid-template-columns:1fr;gap:16px;margin-top:48px}
  .dw{height:36svh;overflow:hidden}
  .dw-word{font-size:21vw}
  .math,.services,.packages,.faq,.book{padding-top:96px;padding-bottom:96px}
  .app{transform:none;box-shadow:8px 8px 0 var(--red)} /* taste-skill-ignore: hard offset shadow, client brief */
  .app-body{padding:20px}
  .mosaic{grid-template-columns:1fr;gap:16px}
  .t-head,.t-desk,.t-lead,.t-content,.t-office,.t-rev,.t-store,.t-vis,.t-train{grid-column:1/-1}
  .tile{padding:22px}
  .cal-grid{grid-template-rows:auto repeat(4,40px)}
  .job{font-size:10.5px;padding:3px 4px;overflow:hidden}
  .dash-row{grid-template-columns:1fr 1.3fr;font-size:13px}
  .dash-row span:nth-child(2){display:none}
  .steps{grid-template-columns:1fr}
  .pk-say,.p1,.p2,.p6{grid-column:1/-1;min-height:0}
  .demo,.promise{padding-top:96px;padding-bottom:96px}
  .demo-num{font-size:11vw}
  .call{transform:none;box-shadow:8px 8px 0 var(--red);padding:16px} /* taste-skill-ignore: hard offset shadow, client brief */
  .pk.lang{margin-left:0}
  .pr-list li{padding:22px 20px 22px 70px}
  .pr-list li::before{left:18px;top:20px;font-size:2.4rem}
  .more{grid-template-columns:1fr}
  .more .plan{min-height:0}
  .plan{box-shadow:6px 6px 0 #fff} /* taste-skill-ignore: hard offset shadow, client brief */
  .proof{padding-top:96px;height:auto;min-height:0;padding-bottom:0}
  .card{padding:32px 22px 48px;transform:rotate(-1deg);min-height:0;margin-bottom:-24px;box-shadow:8px 8px 0 var(--black)} /* taste-skill-ignore: hard offset shadow, client brief */
  .counts{grid-template-columns:1fr 1fr;gap:24px 12px;margin:32px 0}
  .how{padding:110px var(--m)}
  .stair{row-gap:44px}
  .st1,.st2,.st3{grid-column:1/-1}
  .st2{padding-left:6vw}.st3{padding-left:12vw}
  .h-stair{font-size:9.4vw}
  .qs summary{min-height:64px;padding:14px 18px}
  .ans p{padding:0 18px 20px}
  .book{padding-left:12px;padding-right:12px}
  .coupon{box-shadow:8px 8px 0 var(--yellow)} /* taste-skill-ignore: hard offset shadow, client brief */
  .cp-say{padding:32px 24px}
  .cp-fields{padding:28px 20px;grid-template-columns:1fr}
  .foot{min-height:80svh}
  .foot-row{display:flex;flex-direction:column;gap:12px}
  .to-top{align-self:flex-start}
  .foot-contact{margin-top:80px;flex-direction:column;align-items:flex-start;gap:20px}
  .foot-mail{font-size:7.6vw}
  .foot-phone{font-size:9vw}
  .doc-hero{padding:110px var(--m) 56px}
  .doc,.faq-doc{padding:48px var(--m) 96px}
  .toc{padding:20px 20px;margin-bottom:44px}
  .toc ol{columns:1}
  .prose h2{margin-top:44px}
  .doc-cta{padding:22px}
  .doc-cta .btn{width:100%;justify-content:center}
  .foot-meta{flex-direction:column;gap:8px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .btn,.tile,.plan,.qs details,.sticker,.phone{transition:none}
  .btn:hover,.tile:hover,.plan:hover,.sticker:hover,.qs details:hover{transform:none}
}
