/* ==========================================================================
   Bestie Squad, site v2 (Oct 2026 redesign preview)
   Brand tokens carried over from tokens.css (quiz-matched): cream ground,
   soft-black ink, smiley yellow, coral, violet, checker device.
   Added: blush / lilac / butter grounds, an italic serif accent (Fraunces)
   for warmth, polaroid photo treatments, and light scroll motion.
   Self-contained: pages on v2 do not load tokens.css or site.css.
   ========================================================================== */
:root{
  --bg:#FFFEF8; --surface:#FFFFFF; --ink:#0A0A0A; --ink-2:#2B2B2B; --mute:#555350;
  --hairline:#E8E2D2;
  --yellow:#FBB615; --yellow-2:#F4A800; --butter:#FFF4D1;
  --coral:#FF6663; --blush:#FCE4E4; --blush-2:#F8D3D6;
  --violet:#9B62CB; --lilac:#EEE2F3;
  --display:"Archivo Black",system-ui,sans-serif;
  --body:"Plus Jakarta Sans",system-ui,sans-serif;
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --fs-hero:clamp(2.6rem,1.6rem + 4.6vw,5.4rem);
  --fs-h1:clamp(2.3rem,1.6rem + 3.2vw,4.2rem);
  --fs-h2:clamp(1.9rem,1.4rem + 2.2vw,3.3rem);
  --fs-h3:clamp(1.2rem,1.05rem + .6vw,1.55rem);
  --fs-lede:clamp(1.08rem,1rem + .45vw,1.35rem);
  --gutter:clamp(1.25rem,4vw,3rem);
  --wide:1200px; --narrow:760px;
  --sec:clamp(4rem,3rem + 5vw,7.5rem);
  --r:18px; --r-sm:12px; --pill:999px;
  --shadow-soft:0 18px 40px -18px rgba(60,30,20,.28),0 2px 6px rgba(60,30,20,.06);
  --shadow-hard:3px 3px 0 var(--ink);
}
*,*::before,*::after{box-sizing:border-box}
html{color-scheme:light;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:clamp(1rem,.96rem + .2vw,1.1rem);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3{margin:0 0 .45em;text-wrap:balance}
h1,h2,.display{font-family:var(--display);text-transform:uppercase;letter-spacing:-.015em;line-height:.98}
h1{font-size:var(--fs-h1)}
h2{font-size:var(--fs-h2);line-height:1.02}
h3{font-family:var(--body);font-weight:800;font-size:var(--fs-h3);line-height:1.2;letter-spacing:-.01em}
/* The warm accent: an italic serif word inside an uppercase display line. */
.script{font-family:var(--serif);font-style:italic;font-weight:500;text-transform:none;letter-spacing:-.01em;font-size:1.08em;line-height:.9}
.hl{background:linear-gradient(transparent 62%,var(--yellow) 62%,var(--yellow) 92%,transparent 92%);padding-inline:.08em}
.lede{font-size:var(--fs-lede);line-height:1.5;color:var(--ink-2);max-width:56ch}
.mute{color:var(--mute)}
.small{font-size:.9rem}
.center{text-align:center}.center .lede{margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--yellow);padding:10px 16px;border-radius:var(--pill);border:2px solid var(--ink);font-weight:800}
.skip:focus{left:12px}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}

.wrap{max-width:var(--wide);margin-inline:auto;padding-inline:var(--gutter)}
.wrap--narrow{max-width:var(--narrow)}
.sec{padding-block:var(--sec);position:relative}
.sec--tight{padding-block:calc(var(--sec)*.6)}
.g-blush{background:var(--blush)}.g-lilac{background:var(--lilac)}.g-butter{background:var(--butter)}.g-white{background:var(--surface)}
.g-ink{background:var(--ink);color:var(--bg)}
.g-ink .lede,.g-ink .mute{color:#D9D5CB}
.g-ink a:not(.btn){color:var(--bg)}

/* Eyebrow */
.eyebrow{display:inline-flex;align-items:center;gap:.5em;font-weight:800;font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;margin:0 0 1.1rem}
.eyebrow::before{content:"★";color:var(--coral);font-size:.95em;letter-spacing:0}
.eyebrow--pill{background:var(--yellow);padding:.45em 1em;border-radius:var(--pill);border:1.5px solid var(--ink)}
.eyebrow--pill::before{color:var(--ink)}
.g-ink .eyebrow::before{color:var(--yellow)}

/* Checker: the brand's ownable device. Thinner than v1 so it frames rather than shouts. */
.checker{height:18px;background-color:var(--bg);background-image:linear-gradient(45deg,var(--ink) 25%,transparent 25%,transparent 75%,var(--ink) 75%),linear-gradient(45deg,var(--ink) 25%,transparent 25%,transparent 75%,var(--ink) 75%);background-size:18px 18px;background-position:0 0,9px 9px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--display);font-size:.9rem;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;text-align:center;line-height:1.2;padding:17px 30px;min-height:52px;border-radius:var(--pill);border:2px solid var(--ink);background:var(--yellow);color:var(--ink);box-shadow:var(--shadow-hard);cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease}
.btn:hover{background:var(--yellow-2);transform:translate(-1px,-2px);box-shadow:5px 5px 0 var(--ink)}
.btn:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ink)}
.btn--ghost{background:var(--surface)}.btn--ghost:hover{background:var(--butter)}
.btn--lg{font-size:1rem;padding:20px 36px;min-height:60px}
.btn--sm{font-size:.78rem;padding:12px 18px;min-height:44px}
.g-ink .btn{box-shadow:3px 3px 0 var(--yellow-2)}
.g-ink .btn--ghost{background:transparent;color:var(--bg);border-color:var(--bg);box-shadow:none}
.btn-row{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center;margin-top:1.75rem}
.center .btn-row{justify-content:center}
.text-link{font-weight:800;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:var(--coral);min-height:44px;display:inline-flex;align-items:center}
.text-link:hover{text-decoration-color:var(--ink)}
.trust{display:flex;flex-wrap:wrap;gap:.4rem .9rem;margin-top:1.1rem;font-size:.88rem;font-weight:600;color:var(--ink-2);list-style:none;padding:0}
.trust li{display:inline-flex;align-items:center;gap:.4em}
.trust li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--coral)}
.g-ink .trust{color:#E9E5DA}

/* Header */
.site-head{position:sticky;top:0;z-index:50;background:rgba(255,254,248,.88);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid transparent;transition:border-color .2s}
.site-head.is-scrolled{border-bottom-color:var(--hairline)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:72px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);min-height:44px}
.brand__mark{width:34px;height:34px;flex-shrink:0}
.brand__word{font-family:var(--display);font-size:.98rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.nav__links{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0}
.nav__links a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:var(--pill);text-decoration:none;font-weight:700;font-size:.95rem}
.nav__links a:hover,.nav__links a[aria-current=page]{background:var(--blush)}
.nav__cta{display:flex;align-items:center;gap:8px}
.nav .btn{padding:12px 20px;min-height:46px;font-size:.8rem}
.menu{position:relative;display:none}
.menu summary{list-style:none;cursor:pointer;width:46px;height:46px;border-radius:50%;border:2px solid var(--ink);display:grid;place-items:center;background:var(--surface)}
.menu summary::-webkit-details-marker{display:none}
.menu summary span,.menu summary span::before,.menu summary span::after{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px;position:relative;content:""}
.menu summary span::before{position:absolute;top:-6px}.menu summary span::after{position:absolute;top:6px}
.menu__panel{position:absolute;right:0;top:56px;background:var(--surface);border:2px solid var(--ink);border-radius:var(--r);box-shadow:var(--shadow-hard);padding:10px;min-width:220px;display:grid}
.menu__panel a{padding:12px 14px;border-radius:10px;text-decoration:none;font-weight:700}
.menu__panel a:hover{background:var(--blush)}
@media (max-width:860px){.nav__links{display:none}.menu{display:block}}
@media (max-width:420px){.brand__word{font-size:.82rem}.nav .btn{padding:11px 14px;font-size:.72rem}.brand__mark{width:30px;height:30px}}

/* ---------- Hero stage: real photo cutout over soft, layered, moving ground ---------- */
.hero{padding-block:clamp(2rem,1rem + 4vw,4.5rem) clamp(3rem,2rem + 4vw,6rem);position:relative;overflow:hidden}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,4vw,4rem);align-items:center}
.hero h1{font-size:var(--fs-hero);margin-bottom:.35em}
.hero .lede{max-width:44ch}
@media (max-width:860px){.hero__grid{grid-template-columns:1fr}.hero__visual{order:-1}}
.stage{position:relative;aspect-ratio:4/5;width:100%;max-width:540px;margin-inline:auto;isolation:isolate}
.stage__layer{position:absolute;pointer-events:none;will-change:transform;transform:translate3d(0,var(--py,0px),0) rotate(var(--rot,0deg))}
.stage__blob{border-radius:50%;filter:blur(2px)}
.stage__blob--a{width:78%;aspect-ratio:1;left:11%;top:10%;background:radial-gradient(circle at 35% 35%,#FFE3E6 0,var(--blush-2) 55%,rgba(248,211,214,0) 72%)}
.stage__blob--b{width:46%;aspect-ratio:1;right:-4%;top:-2%;background:radial-gradient(circle,var(--lilac) 0,rgba(238,226,243,0) 70%)}
.stage__blob--c{width:40%;aspect-ratio:1;left:-6%;bottom:6%;background:radial-gradient(circle,#FFEBB0 0,rgba(255,235,176,0) 70%)}
.stage__ring{width:30%;aspect-ratio:1;right:4%;top:12%;border-radius:50%;border:2px dashed rgba(10,10,10,.35)}
.stage__star{width:9%;color:var(--yellow)}
.stage__star svg{width:100%;height:auto;display:block}
.stage__star--1{left:8%;top:20%}.stage__star--2{right:8%;top:52%;width:6%;color:var(--coral)}.stage__star--3{left:14%;bottom:20%;width:5%;color:var(--violet)}
.stage__checker{left:6%;bottom:4%;width:34%;height:16px;border-radius:4px;background-image:linear-gradient(45deg,var(--ink) 25%,transparent 25%,transparent 75%,var(--ink) 75%),linear-gradient(45deg,var(--ink) 25%,transparent 25%,transparent 75%,var(--ink) 75%);background-size:16px 16px;background-position:0 0,8px 8px;opacity:.9}
.stage__person{position:absolute;inset:auto 0 0 0;margin:0 auto;z-index:2;will-change:transform;transform:translate3d(0,var(--py,0px),0)}
.stage__person img{width:100%;height:auto;filter:drop-shadow(0 24px 28px rgba(60,30,20,.18))}
/* Full-body cutout (smiley tee): shown whole, never cropped. */
.stage--full .stage__person{width:66%;bottom:0}
/* Seated bomber cutout: sits on the arch's base like a ledge. */
.stage--seated .stage--seated .stage__person{width:80%;left:10%;right:auto;bottom:0}
.stage__pol{z-index:3;width:30%}
.stage__pol--1{right:-2%;bottom:16%}
.stage__pol--2{left:-3%;top:8%;width:26%}
@media (max-width:860px){.stage{max-width:420px}}
@media (max-width:480px){.stage{max-width:340px}.stage__pol{width:32%}}

/* ---------- Photos ---------- */
.pol{margin:0;background:#fff;padding:8px 8px 28px;border-radius:6px;box-shadow:var(--shadow-soft);transform:rotate(var(--rot,0deg))}
.pol img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:3px;background:var(--blush)}
.pol--sq img{aspect-ratio:1}
.pol--tall img{aspect-ratio:3/4}
.tape{position:relative}
.tape::before{content:"";position:absolute;top:-12px;left:50%;width:84px;height:24px;transform:translateX(-50%) rotate(-3deg);background:rgba(251,182,21,.55);border-radius:2px;z-index:2}
.tape--pink::before{background:rgba(255,102,99,.38)}
.tape--lilac::before{background:rgba(155,98,203,.35)}

/* Scroll-drifting photo strip */
.strip{overflow:hidden;padding-block:clamp(2.5rem,5vw,4rem)}
.strip__track{display:flex;gap:clamp(12px,2vw,22px);width:max-content;will-change:transform;transform:translate3d(var(--px,0px),0,0)}
.strip__item{flex:0 0 auto;width:clamp(170px,19vw,260px);margin:0}
.strip__item img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--r);box-shadow:var(--shadow-soft)}
.strip__item:nth-child(odd){transform:translateY(18px)}
.strip__item:nth-child(3n){transform:translateY(-10px) rotate(-1.5deg)}

/* Scattered polaroid collage */
.collage{position:relative;min-height:clamp(560px,52vw,720px)}
.collage .pol{position:absolute;width:40%}
.collage .pol:nth-child(1){left:0;top:3%;--rot:-5deg}
.collage .pol:nth-child(2){left:31%;top:0;--rot:3deg;z-index:2}
.collage .pol:nth-child(3){right:-2%;top:7%;--rot:-2deg;width:36%}
.collage .pol:nth-child(4){left:6%;top:49%;--rot:4deg;z-index:3}
.collage .pol:nth-child(5){right:4%;top:47%;--rot:-4deg;z-index:3}
@media (max-width:760px){
  .collage{min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:18px 14px}
  .collage .pol,.collage .pol:nth-child(n){position:relative;inset:auto;width:auto}
  .collage .pol:nth-child(5),.collage .pol:nth-child(3):last-child{grid-column:1/-1;width:62%;margin-inline:auto}
}

/* Mosaic grid */
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(120px,14vw,190px);gap:clamp(10px,1.4vw,16px)}
.mosaic figure{margin:0;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-soft);background:var(--blush)}
.mosaic img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.mosaic figure:hover img{transform:scale(1.04)}
.mosaic .m-tall{grid-row:span 2}.mosaic .m-wide{grid-column:span 2}.mosaic .m-big{grid-column:span 2;grid-row:span 2}
@media (max-width:760px){.mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:150px}.mosaic .m-big{grid-column:span 2}}

/* Split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.split--60{grid-template-columns:1.2fr .8fr}
.split--40{grid-template-columns:.85fr 1.15fr}
.split__media{width:100%;max-width:520px;margin-inline:auto}
.split__media--sm{max-width:420px}
@media (max-width:860px){.split,.split--60,.split--40{grid-template-columns:1fr}.split__media{max-width:480px}}

/* Cards */
.card{background:var(--surface);border:1.5px solid var(--hairline);border-radius:var(--r);padding:clamp(1.25rem,2.5vw,1.9rem)}
.card--ink{border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px)}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,2vw,24px)}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.8vw,20px)}
@media (max-width:900px){.grid-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.grid-3,.grid-2{grid-template-columns:1fr}}
.feature{position:relative;padding-top:2.2rem}
.feature__icon{position:absolute;top:-22px;left:1.5rem;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--ink);font-size:1.2rem;font-weight:800}
.i-yellow{background:var(--yellow)}.i-coral{background:var(--coral)}.i-violet{background:var(--violet);color:#fff}.i-blush{background:var(--blush)}
.feature h3{margin-bottom:.35em}.feature p{margin:0;color:var(--mute)}

/* Section head */
.head{max-width:760px;margin-bottom:clamp(2rem,4vw,3.25rem)}
.head.center{margin-inline:auto}
.head h2{margin-bottom:.3em}

/* Quotes */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px)}
@media (max-width:860px){.quotes{grid-template-columns:1fr}}
.tq{margin:0;display:flex;flex-direction:column;gap:1rem;background:var(--surface);border-radius:var(--r);padding:clamp(1.4rem,2.5vw,2rem);border:1.5px solid var(--hairline);position:relative}
.tq::before{content:"\201C";font-family:var(--serif);font-size:4.5rem;line-height:.6;color:var(--coral);height:.45em}
.tq blockquote{margin:0;font-size:1.04rem;line-height:1.55;font-weight:600;flex:1}
.tq figcaption{display:flex;align-items:center;gap:12px;font-weight:800;font-size:.92rem}
.tq cite{font-style:normal}
.tq__avatar{width:50px;height:50px;border-radius:50%;overflow:hidden;border:2px solid var(--ink);flex-shrink:0;background:var(--butter)}
.tq__avatar img{width:100%;height:100%;object-fit:cover;object-position:center 20%}

/* Steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:clamp(14px,2vw,24px);counter-reset:s}
.steps li{counter-increment:s;background:var(--surface);border:1.5px solid var(--hairline);border-radius:var(--r);padding:1.6rem 1.5rem 1.5rem;position:relative}
.steps li::before{content:counter(s);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--yellow);border:2px solid var(--ink);font-family:var(--display);margin-bottom:1rem}
.steps li:nth-child(2)::before{background:var(--blush-2)}.steps li:nth-child(3)::before{background:var(--lilac)}.steps li:nth-child(4)::before{background:#fff}
.steps h3{margin-bottom:.3em}.steps p{margin:0;color:var(--mute)}
@media (max-width:860px){.steps{grid-template-columns:1fr}}

/* Pricing */
.prices{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2.5vw,28px);max-width:860px;margin-inline:auto}
@media (max-width:700px){.prices{grid-template-columns:1fr}}
.price{background:var(--surface);border:2px solid var(--ink);border-radius:24px;padding:2rem 1.75rem;text-align:center;display:flex;flex-direction:column;align-items:center;position:relative}
.price--best{box-shadow:7px 7px 0 var(--yellow);background:linear-gradient(180deg,#fff 0,var(--butter) 100%)}
.price__tag{font-weight:800;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;background:var(--blush);border:1.5px solid var(--ink);border-radius:var(--pill);padding:.4em 1em}
.price--best .price__tag{background:var(--yellow)}
.price__amt{font-family:var(--display);font-size:clamp(3rem,2.4rem + 2.5vw,4.4rem);line-height:1;margin:1.1rem 0 .2rem}
.price__per{color:var(--mute);margin:0 0 1.4rem;max-width:30ch;flex:1}
.price .btn{width:100%}
.note{max-width:860px;margin:clamp(1.5rem,3vw,2.25rem) auto 0;background:var(--surface);border:1.5px solid var(--hairline);border-radius:var(--r);padding:1.4rem 1.6rem;display:flex;gap:1rem;align-items:flex-start}
.note__icon{font-size:1.4rem;line-height:1}
.note p:last-child{margin:0}

/* Checklist */
.checks{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;gap:.9rem}
.checks li{display:flex;gap:.8rem;align-items:flex-start}
.checks li::before{content:"✓";flex-shrink:0;width:28px;height:28px;border-radius:50%;background:var(--yellow);border:2px solid var(--ink);display:grid;place-items:center;font-weight:800;font-size:.8rem;margin-top:2px}

/* FAQ */
.faq{max-width:820px;margin-inline:auto;display:grid;gap:12px}
.faq details{background:var(--surface);border:1.5px solid var(--hairline);border-radius:var(--r-sm);padding:0 1.4rem}
.faq details[open]{border-color:var(--ink)}
.faq summary{cursor:pointer;list-style:none;font-weight:800;font-size:1.05rem;padding:1.15rem 0;display:flex;justify-content:space-between;gap:1rem;align-items:center;min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--display);font-size:1.3rem;width:34px;height:34px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;background:var(--blush);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg);background:var(--yellow)}
.faq details p{margin:0 0 1.2rem;color:var(--ink-2)}

/* Press / as seen on */
.press{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,5vw,4rem);align-items:center}
@media (max-width:760px){.press{grid-template-columns:1fr}.press .pol{max-width:320px;margin-inline:auto}}

/* Letter */
.letter{font-size:1.08rem}
.letter p{max-width:62ch}
.signoff{font-family:var(--serif);font-style:italic;font-size:1.6rem;margin-top:1.5rem}
.letter .dropcap::first-letter{font-family:var(--serif);font-style:italic;font-size:3.4em;float:left;line-height:.8;padding:.08em .1em 0 0;color:var(--coral)}

/* Connection type cards */
.types{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,18px)}
@media (max-width:900px){.types{grid-template-columns:repeat(2,1fr)}}
.type{display:flex;flex-direction:column;gap:.35rem;text-decoration:none;color:var(--ink);border:2px solid var(--ink);border-radius:var(--r);padding:1.3rem;background:var(--surface);transition:transform .15s,box-shadow .15s}
.type:hover{transform:translate(-2px,-3px);box-shadow:5px 5px 0 var(--ink)}
.type svg{width:44px;height:44px;margin-bottom:.4rem}
.type__name{font-family:var(--display);font-size:1.35rem;text-transform:uppercase}
.type__body{font-size:.95rem;color:var(--mute)}
.type--spark{background:var(--butter)}.type--beam{background:#FFF8E9}.type--glow{background:var(--lilac)}.type--flame{background:var(--blush)}

/* Big CTA panel */
.cta-panel{position:relative;overflow:hidden;border-radius:clamp(20px,3vw,36px);padding:clamp(2.5rem,6vw,5rem) clamp(1.5rem,5vw,4rem);background:var(--ink);color:var(--bg)}
.cta-panel h2{font-size:clamp(2rem,1.4rem + 3vw,3.8rem)}
.cta-panel .lede{color:#E2DED3}
.cta-panel__pics{position:absolute;inset:0;pointer-events:none}
.cta-panel__pics .pol{position:absolute;width:clamp(110px,13vw,170px);opacity:.95}
.cta-panel__inner{position:relative;z-index:2;max-width:640px;margin-inline:auto;text-align:center}
.cta-panel__inner .btn-row{justify-content:center}
@media (max-width:900px){.cta-panel__pics{display:none}}

/* Signup (Kit) */

/* Footer */
.site-foot{background:var(--ink);color:#E9E5DA;padding-block:clamp(3rem,6vw,4.5rem) 2rem}
.site-foot a{color:#FFFEF8;text-decoration:none}
.site-foot a:hover{text-decoration:underline}
.foot__cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:2rem}
@media (max-width:860px){.foot__cols{grid-template-columns:1fr 1fr}.foot__brand{grid-column:1/-1}}
.foot__title{font-weight:800;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--yellow);margin-bottom:.9rem}
.foot__cols ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.foot__cols li a{display:inline-flex;min-height:36px;align-items:center}
.site-foot .brand{color:var(--bg)}
.foot__blurb{max-width:34ch;margin-top:1rem;color:#CFCAC0}
.foot__fine{border-top:1px solid #333;margin-top:2.5rem;padding-top:1.5rem;font-size:.85rem;color:#B9B4AA;display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;justify-content:space-between}

/* Mobile sticky apply bar */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:45;padding:12px var(--gutter) calc(12px + env(safe-area-inset-bottom,0px));background:rgba(255,254,248,.96);border-top:1px solid var(--hairline);box-shadow:0 -10px 30px -12px rgba(0,0,0,.18);transform:translateY(110%);transition:transform .25s ease;display:none}
.sticky-cta .btn{width:100%;box-shadow:none}
@media (max-width:760px){.sticky-cta{display:block}.sticky-cta.is-visible{transform:none}}

/* Deals (ported from site.css, restyled) */
.deal-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:780px){.deal-nav{grid-template-columns:1fr}}
.deal-nav__card{background:var(--surface);border:1.5px solid var(--hairline);border-radius:var(--r);padding:1.4rem;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:.5rem;transition:border-color .15s,transform .15s}
.deal-nav__card:hover{border-color:var(--ink);transform:translateY(-2px)}
.deal-nav__icon{width:40px;height:40px}
.deal-nav__name{font-family:var(--display);font-size:1.15rem;text-transform:uppercase}
.deal-nav__blurb{font-size:.92rem;color:var(--mute);margin:0;flex:1}
.deal-nav__go{font-weight:800;font-size:.85rem}
.deal-group{margin-top:clamp(3rem,6vw,4.5rem);scroll-margin-top:90px}
.deal-group__head{border-bottom:2px solid var(--ink);padding-bottom:.6rem;margin-bottom:.6rem}
.deal-group__head h2{margin:0;font-size:clamp(1.6rem,1.2rem + 1.6vw,2.4rem)}
.deal-group__intro{color:var(--mute);margin:0 0 .5rem;max-width:60ch}
.deal-row{display:grid;grid-template-columns:56px 1fr 230px;gap:1.5rem;align-items:start;padding-block:1.9rem;border-bottom:1px solid var(--hairline)}
@media (max-width:720px){.deal-row{grid-template-columns:44px 1fr}.deal-row__action{grid-column:2}}
.deal-row__icon{width:100%;height:auto;aspect-ratio:1;padding:8px;border-radius:50%;background:var(--blush)}
.deal-row__name{font-family:var(--display);font-size:var(--fs-h3);text-transform:uppercase;margin:0}
.deal-row__tag{font-weight:800;margin:4px 0 .6rem}
.deal-row__body{color:var(--mute);margin:0;max-width:58ch}
.deal-row__action{display:flex;flex-direction:column;gap:8px;align-items:stretch}
.deal-row__action .btn{box-shadow:none}
.code-chip{display:flex;align-items:center;gap:.6rem;justify-content:space-between;background:var(--yellow);border:2px solid var(--ink);border-radius:var(--pill);padding:5px 5px 5px 16px}
.code-chip__code{font-family:var(--display);font-size:.85rem;letter-spacing:.03em}
.code-chip__copy{display:none}
.js .code-chip__copy{display:inline-flex;align-items:center;justify-content:center;font-family:var(--body);font-weight:800;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;background:var(--bg);color:var(--ink);border:1.5px solid var(--ink);border-radius:var(--pill);padding:6px 12px;min-height:36px;cursor:pointer}
.deal-row__nocode,.deal-row__hint{font-size:.8rem;color:var(--mute);margin:0;line-height:1.4}
.deal-row__hint{text-align:center}
.disclosure{font-style:italic;font-size:.92rem;color:var(--mute);max-width:68ch}
.g-ink .disclosure,.site-foot .disclosure{color:#B9B4AA}

/* Roadmap article */
.toc{background:var(--surface);border:1.5px solid var(--hairline);border-radius:var(--r);padding:1.4rem 1.6rem}
.toc ol{margin:0;padding-left:1.2rem;display:grid;gap:.3rem}
.toc a{font-weight:700;text-decoration:none;min-height:36px;display:inline-flex;align-items:center}
.toc a:hover{text-decoration:underline}
.stage-block{display:grid;grid-template-columns:80px 1fr;gap:1.5rem;padding-block:clamp(2rem,4vw,3rem);border-top:1px solid var(--hairline);scroll-margin-top:90px}
.stage-block__num{font-family:var(--display);font-size:3.4rem;line-height:1;color:var(--coral);-webkit-text-stroke:2px var(--ink)}
@media (max-width:640px){.stage-block{grid-template-columns:1fr;gap:.5rem}.stage-block__num{font-size:2.6rem}}
.pull{font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,1.2rem + 1.4vw,2.3rem);line-height:1.25;max-width:24ch;margin:0}

/* Scroll reveal (only when JS + motion allowed) */
.motion [data-reveal]{opacity:0;transform:translate3d(0,26px,0);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.motion [data-reveal].is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .stage__layer,.stage__person,.strip__track,[data-speed]{transform:none!important}
}
@media print{.site-head,.sticky-cta,.checker{display:none}}
/* Mobile hardening */
html,body{overflow-x:clip}
main{overflow-x:clip}
.btn{max-width:100%}
@media (max-width:480px){.btn-row .btn{width:100%}.btn-row{gap:12px}.btn-row .text-link{margin-inline:auto}}
/* Three-photo collage (roadmap / join heroes) */
.collage--3 .pol:nth-child(1){left:0;top:6%;width:48%;--rot:-5deg}
.collage--3 .pol:nth-child(2){right:0;left:auto;top:0;width:46%;--rot:4deg}
.collage--3 .pol:nth-child(3){left:24%;right:auto;top:44%;width:48%;--rot:-2deg;z-index:3}
@media (max-width:760px){.collage--3 .pol:nth-child(3){grid-column:1/-1;width:62%;margin-inline:auto}}
/* Mobile hero tuning: keep Dani first, but get the headline and CTA close to the fold. */
.nav .btn{white-space:nowrap}
@media (max-width:860px){
  .hero{padding-top:.75rem}
  .hero__grid{gap:1.25rem}
  .stage{max-width:300px}
  .hero .eyebrow--pill{font-size:.66rem;letter-spacing:.12em}
}
@media (max-width:480px){
  .stage{max-width:258px}
  .hero h1{font-size:clamp(2.2rem,9.5vw,2.7rem)}
  .hero .lede{font-size:1.02rem}
  .hero .lede--more{display:none}
  .nav{min-height:64px}
}
@media (max-width:420px){
  .brand__word{font-size:.74rem;letter-spacing:.04em}
  .brand{gap:7px}
  .nav .btn{padding:10px 12px;font-size:.68rem;min-height:44px;box-shadow:2px 2px 0 var(--ink)}
  .nav__cta{gap:6px}
  .menu summary{width:44px;height:44px}
}
/* Photo-collage stage (/apply, /about heroes): same layered ground, polaroids instead of a cutout. */
.stage--collage .stage--collage .stage__pol{position:absolute}
.stage--collage .sc-1{left:16%;top:15%;width:62%;z-index:2}
.stage--collage .sc-2{left:-3%;top:3%;width:38%;z-index:1}
.stage--collage .sc-3{right:-3%;top:42%;width:40%;z-index:3}
.stage--collage .sc-4{left:0;bottom:3%;width:38%;z-index:3}
.stage--collage .sc-1 .pol{padding:10px 10px 36px}
/* Homepage hero: give the seated bomber cutout a bit more room than inner pages. */
.stage--home{max-width:min(520px,calc((100vh - 250px)*.8))}
@media (max-width:860px){.stage--home{max-width:300px}}
@media (max-width:480px){.stage--home{max-width:250px}}

/* Featured member testimonials (real quotes, verbatim). The highlight line is
   an exact excerpt of the member's own words, repeated large for scanning;
   it is aria-hidden so screen readers hear the quote once. */
.fts{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.5vw,32px)}
.fts--one{grid-template-columns:1fr;max-width:980px;margin-inline:auto}
@media (max-width:900px){.fts{grid-template-columns:1fr}}
.ft{margin:0;background:var(--surface);border:2px solid var(--ink);border-radius:26px;padding:clamp(1.5rem,3vw,2.4rem);box-shadow:7px 7px 0 var(--yellow);display:flex;flex-direction:column;gap:1.1rem;position:relative}
.ft:nth-child(2){box-shadow:7px 7px 0 var(--coral)}
.ft__top{display:flex;align-items:center;gap:1.1rem}
.ft__photo{flex-shrink:0;width:clamp(84px,9vw,112px);aspect-ratio:1;border-radius:50%;overflow:hidden;border:3px solid var(--ink);background:var(--blush);box-shadow:0 0 0 6px var(--blush)}
.ft:nth-child(2) .ft__photo{box-shadow:0 0 0 6px var(--butter)}
.ft__photo img{width:100%;height:100%;object-fit:cover}
.ft__hl{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.45rem,1.1rem + 1.3vw,2.1rem);line-height:1.2;margin:0;letter-spacing:-.01em}
.ft blockquote{margin:0;font-size:1.02rem;line-height:1.65;color:var(--ink-2)}
.ft blockquote p{margin:0}
.ft figcaption{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-top:auto;padding-top:.9rem;border-top:1px dashed var(--hairline)}
.ft cite{font-style:normal;font-weight:800;font-size:1.02rem}
.ft__tag{font-size:.74rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;background:var(--blush);border-radius:999px;padding:.3em .8em}
.fts--one .ft{display:grid;grid-template-columns:auto 1fr;column-gap:2rem;align-items:start}
.fts--one .ft__photo{width:clamp(110px,14vw,170px);grid-row:span 3}
.fts--one .ft > *{grid-column:2}
.fts--one .ft .ft__photo{grid-column:1}
@media (max-width:640px){.fts--one .ft{display:flex}}
/* Short pull-quote (application page) */
.mini-q{display:flex;gap:.9rem;align-items:center;margin:1.25rem 0 0;background:#fff;border:1.5px solid var(--ink);border-radius:18px;padding:.9rem 1.1rem;box-shadow:4px 4px 0 var(--yellow)}
.mini-q img{width:58px;height:58px;border-radius:50%;object-fit:cover;border:2px solid var(--ink);flex-shrink:0}
.mini-q blockquote{margin:0;font-family:var(--serif);font-style:italic;font-size:1.15rem;line-height:1.3}
.mini-q figcaption{font-weight:800;font-size:.85rem;margin-top:.25rem}

/* v2b: arch removed. Dani's cutout now sits on a soft blush/lilac glow with a
   grounded contact shadow, and her bottom edge melts out instead of a hard cut. */
.stage__glow{left:6%;right:6%;bottom:-2%;height:62%;border-radius:50% 50% 46% 46%;background:radial-gradient(ellipse at 50% 70%,rgba(248,211,214,.95) 0,rgba(248,211,214,.6) 38%,rgba(238,226,243,.45) 58%,rgba(238,226,243,0) 74%);filter:blur(6px)}
.stage__ground{position:absolute;left:14%;right:10%;bottom:-3%;height:10%;z-index:1;border-radius:50%;background:radial-gradient(closest-side,rgba(70,35,25,.26),rgba(70,35,25,.1) 55%,rgba(70,35,25,0));pointer-events:none}
/* bottom/side melt is baked into dani-bomber-cutout-soft*.webp (alpha), so no CSS mask needed */
.stage--seated .stage__checker{left:2%;bottom:14%;width:26%;transform:rotate(-6deg) translate3d(0,var(--py,0px),0)}
/* Merged apply/application: land the #apply jump below the sticky header. */
#apply{scroll-margin-top:72px}

/* v2c: full nav. Desktop: 4 links + "More" (Links, quiz). Under 1060px: hamburger with every page. */
.nav__links li{position:relative}
.more summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:var(--pill);font-weight:700;font-size:.95rem}
.more summary::-webkit-details-marker{display:none}
.more summary:hover,.more[open] summary{background:var(--blush)}
.more summary:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.more__chev{font-size:.75em;transition:transform .2s}
.more[open] .more__chev{transform:rotate(180deg)}
.more__panel{position:absolute;right:0;top:52px;z-index:60;min-width:200px;display:grid;background:var(--surface);border:2px solid var(--ink);border-radius:var(--r);box-shadow:var(--shadow-hard);padding:8px}
.more__panel a{display:flex;min-height:44px;align-items:center;padding:0 14px;border-radius:10px;text-decoration:none;font-weight:700}
.more__panel a:hover,.more__panel a[aria-current=page]{background:var(--blush)}
.menu__panel{gap:2px;min-width:240px;max-height:calc(100vh - 90px);overflow:auto;z-index:60}
.menu__panel a[aria-current=page]{background:var(--blush)}
.menu__panel .menu__apply{margin-top:8px;justify-content:center;color:var(--ink)}
@media (max-width:1060px){.nav__links{display:none}.menu{display:block}}
.events-cta{display:grid;grid-template-columns:1fr auto;gap:clamp(1.25rem,3vw,2.5rem);align-items:center;text-align:left}
.events-cta h3{font-size:clamp(1.5rem,1.2rem + 1.2vw,2.1rem);margin:.3rem 0 .6rem}
@media (max-width:760px){.events-cta{grid-template-columns:1fr;text-align:center}.events-cta p{margin-inline:auto!important}.events-cta .btn{width:100%}}

/* v2c: Inside the Squad device frames (apply page). Real screenshots replace .shot-ph. */
.devices{position:relative;aspect-ratio:16/8.2;margin:clamp(2rem,4vw,3rem) auto 0;max-width:1100px}
.dev{position:absolute;margin:0}
.dev__screen{position:relative;overflow:hidden;background:#fff}
.dev__screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.dev--laptop{left:0;top:3%;width:60%;z-index:1}
.dev__lid{background:var(--ink);border-radius:16px 16px 6px 6px;padding:12px 12px 14px;box-shadow:0 30px 50px -20px rgba(60,30,20,.35)}
.dev--laptop .dev__screen{aspect-ratio:16/10;border-radius:4px}
.dev__base{height:14px;margin:0 -5%;background:linear-gradient(#2a2a2a,#0a0a0a);border-radius:0 0 14px 14px;position:relative}
.dev__base::after{content:"";position:absolute;left:42%;right:42%;top:0;height:5px;background:#3a3a3a;border-radius:0 0 6px 6px}
.dev--browser{right:0;top:0;width:39%;background:#fff;border:2px solid var(--ink);border-radius:14px;overflow:hidden;box-shadow:6px 6px 0 var(--yellow);z-index:1}
.dev__bar{display:flex;gap:6px;align-items:center;height:28px;padding:0 12px;background:var(--bg);border-bottom:1.5px solid var(--hairline)}
.dev__bar i{width:9px;height:9px;border-radius:50%;background:#e7dfd1}
.dev__bar i:first-child{background:var(--coral)}.dev__bar i:nth-child(2){background:var(--yellow)}.dev__bar i:nth-child(3){background:var(--lilac-2,#cdb8dd)}
.dev--browser .dev__screen{aspect-ratio:16/10}
.dev--phone{width:17%;background:var(--ink);border-radius:30px;padding:8px;box-shadow:0 26px 40px -18px rgba(60,30,20,.4);z-index:2}
.dev--phone .dev__screen{aspect-ratio:9/19.5;border-radius:23px}
.dev--phone::before{content:"";position:absolute;top:13px;left:50%;width:30%;height:12px;margin-left:-15%;border-radius:999px;background:var(--ink);z-index:3}
.dev--2{left:55%;bottom:0}
.dev--3{right:3%;bottom:5%;transform:rotate(3deg)}
.dev--2{transform:rotate(-3deg)}
/* Clearly-temporary placeholder */
.shot-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:12px;
  background:radial-gradient(circle at 30% 25%,#fff 0,rgba(255,255,255,0) 55%),linear-gradient(160deg,var(--blush) 0,var(--blush-2) 55%,var(--lilac) 100%)}
.shot-ph::after{content:"";position:absolute;inset:10px;border:1.5px dashed rgba(10,10,10,.28);border-radius:10px;pointer-events:none}
.dev--phone .shot-ph::after{border-radius:16px}
.shot-ph__icon{width:34px;color:var(--yellow)}
.shot-ph__icon svg{width:100%;height:auto;display:block}
.shot-ph__t{font-family:var(--display);text-transform:uppercase;font-size:clamp(.72rem,.6rem + .4vw,.95rem);letter-spacing:.04em;line-height:1.15}
.shot-ph__f{font:600 .68rem/1.2 ui-monospace,Menlo,monospace;color:var(--mute);word-break:break-all}
.inside-facts{list-style:none;padding:0;margin:clamp(2rem,4vw,3rem) 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.inside-facts li{background:#fff;border:1.5px solid var(--ink);border-radius:var(--r);padding:1rem 1.1rem;box-shadow:4px 4px 0 var(--ink)}
.inside-facts b{display:block;font-family:var(--display);text-transform:uppercase;font-size:1rem;line-height:1.15;margin-bottom:.35rem}
.inside-facts span{display:block;font-size:.93rem;color:var(--ink-2);line-height:1.45}
.week{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center;margin-top:clamp(2.5rem,5vw,4rem);background:var(--surface);border:1.5px solid var(--hairline);border-radius:24px;padding:clamp(1.25rem,3vw,2.5rem)}
.week h3{font-size:clamp(1.5rem,1.2rem + 1.1vw,2.1rem);margin:.3rem 0 1rem}
.week__steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:10px;counter-reset:wk}
.week__steps li{counter-increment:wk;background:var(--bg);border:1.5px solid var(--hairline);border-radius:14px;padding:.85rem 1rem}
.week__steps li::before{content:counter(wk);display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--yellow);border:2px solid var(--ink);font-family:var(--display);font-size:.8rem;margin-bottom:.45rem}
.week__steps li:nth-child(2)::before{background:var(--blush-2)}.week__steps li:nth-child(3)::before{background:var(--lilac)}.week__steps li:nth-child(4)::before{background:#fff}
.week__steps b{display:block;font-weight:800;line-height:1.3}
.week__steps span{display:block;font-size:.9rem;color:var(--mute);line-height:1.45}
.week__pics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.week__pics .pol:nth-child(2){margin-top:28px}
@media (max-width:980px){.inside-facts{grid-template-columns:repeat(2,1fr)}.week{grid-template-columns:1fr}}
@media (max-width:760px){
  .devices{aspect-ratio:auto;display:grid;grid-template-columns:1fr 1fr;gap:16px 14px}
  .dev,.dev--2,.dev--3{position:relative;inset:auto;width:auto;transform:none}
  .dev--laptop{grid-column:1/-1}
  .dev--browser{display:none}
  .dev--phone{max-width:170px;justify-self:center;width:100%}
  .inside-facts{grid-template-columns:1fr}
  .week__steps{grid-template-columns:1fr}
}
.dev--browser .shot-ph{justify-content:flex-start;padding-top:9%;align-items:flex-start;padding-left:9%}
.dev--phone .shot-ph__f{font-size:.56rem}.dev--phone .shot-ph__t{font-size:.7rem}
.more summary[aria-current=page]{background:var(--blush)}

/* v2c: /collaborate */
.collab__kicker{font-family:var(--display);text-transform:uppercase;font-size:clamp(1.15rem,1rem + .8vw,1.6rem);line-height:1.15;margin:.2rem 0 .8rem}
.stats{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.stats li{background:#fff;border:1.5px solid var(--ink);border-radius:var(--r);padding:1.1rem 1rem;box-shadow:4px 4px 0 var(--yellow);text-align:center;display:flex;flex-direction:column;gap:.3rem}
.stats li:nth-child(even){box-shadow:4px 4px 0 var(--blush-2)}
.stats b{font-family:var(--display);font-size:clamp(1.5rem,1.1rem + 1.2vw,2.2rem);line-height:1}
.stats span{font-weight:700;font-size:.88rem;line-height:1.3}
.stats small{font-size:.78rem;color:var(--mute)}
.how{list-style:none;padding:0;margin:clamp(2.5rem,5vw,3.5rem) 0 0;display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.how li{background:var(--surface);border:1.5px solid var(--hairline);border-radius:var(--r);padding:1rem}
.how__i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--blush);border:2px solid var(--ink);font-size:.95rem;margin-bottom:.6rem}
.how b{display:block;font-weight:800;line-height:1.25}
.how span:not(.how__i){display:block;font-size:.9rem;color:var(--mute);line-height:1.45;margin-top:.2rem}
.ways{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.5vw,28px);margin-top:clamp(2rem,4vw,3rem)}
.way{background:#fff;border:2px solid var(--ink);border-radius:24px;padding:clamp(1.1rem,2.5vw,1.75rem);box-shadow:6px 6px 0 var(--yellow)}
.way--comm{box-shadow:6px 6px 0 var(--coral)}
.way__head{display:flex;gap:14px;align-items:flex-start;padding-bottom:1rem;border-bottom:1.5px dashed var(--hairline);margin-bottom:1rem}
.way__head .feature__icon{flex-shrink:0}
.way__head h3{margin:.1rem 0 .35rem;font-size:clamp(1.35rem,1.1rem + .8vw,1.8rem)}
.way__head p:not(.eyebrow){margin:0;color:var(--ink-2);font-size:.96rem}
.pks{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pk{background:var(--bg);border:1.5px solid var(--hairline);border-radius:16px;padding:.95rem 1rem}
.pk__top{display:flex;flex-direction:column;gap:.6rem;margin-bottom:.8rem;padding-bottom:.75rem;border-bottom:1px dashed var(--hairline)}
.pk h4{margin:0;font-size:1rem;font-weight:800;line-height:1.25;min-height:2.5em}
.pk__price{margin:0;font-family:var(--display);font-size:1.6rem;line-height:1.1;font-variant-numeric:lining-nums tabular-nums;letter-spacing:.01em}
.pk__price small{display:block;font-family:var(--body);font-weight:700;font-size:.68rem;line-height:1.2;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-bottom:.35rem}
.pk ul{margin:0;padding-left:1.1rem;font-size:.9rem;line-height:1.5;color:var(--ink-2)}
.pk ul li::marker{color:var(--coral)}
.custom{display:flex;gap:1.5rem;align-items:center;justify-content:space-between;margin-top:clamp(16px,2.5vw,28px);background:var(--blush);border:2px solid var(--ink);border-radius:20px;padding:clamp(1.1rem,2.5vw,1.6rem) clamp(1.2rem,3vw,2rem)}
.custom h3{margin:0 0 .3rem}.custom p{margin:0;max-width:62ch}
.rhythm__h{font-size:clamp(1.6rem,1.2rem + 1.4vw,2.4rem)}
.chips{list-style:none;padding:0;margin:1.25rem 0 0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.chips li{padding:.65rem 1.2rem;border:1.5px solid var(--ink);border-radius:999px;background:#fff;font-weight:800;font-size:.95rem}
.chips li:nth-child(1){background:var(--butter)}.chips li:nth-child(2){background:var(--blush)}.chips li:nth-child(3){background:var(--lilac)}
/* Logo wall (Collaborate): one-colour ink logos in fixed-height tiles; --w is each logo's optically balanced width */
.logos{--cols:5;--gap:12px;--tile:104px;--ls:1;list-style:none;padding:0;margin:clamp(1.75rem,3.5vw,2.5rem) auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--gap);max-width:1040px}
.logos li{flex:0 0 calc((100% - (var(--cols) - 1)*var(--gap))/var(--cols));min-width:0;height:var(--tile);display:flex;align-items:center;justify-content:center;padding:0 14px;border:1.5px solid var(--hairline);border-radius:14px;background:var(--bg);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.logos li:hover{transform:translateY(-2px);border-color:var(--ink);box-shadow:3px 3px 0 var(--ink)}
.logos img{display:block;width:calc(var(--w)*var(--ls));max-width:100%;height:auto;opacity:.9}
.logos li:hover img{opacity:1}
.logos__txt{font-family:var(--display);text-transform:uppercase;font-size:.9rem;letter-spacing:.03em;color:var(--ink-2);text-align:center}
.logos--press{--cols:3;--tile:92px;justify-content:flex-start;margin:1.25rem 0 0;max-width:560px}
.logos--press li{background:#fff;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}
.logos--press li:hover{transform:translateY(-2px);box-shadow:5px 5px 0 var(--ink)}
@media (max-width:1000px){.logos{--cols:4}}
@media (max-width:760px){.logos{--cols:3;--gap:8px;--tile:78px;--ls:.66}.logos li{padding:0 8px;border-radius:12px}.logos--press{--tile:76px;--ls:.8;justify-content:center;margin-inline:auto}}
@media (prefers-reduced-motion:reduce){.logos li,.logos li:hover{transition:none;transform:none}}
.contact{list-style:none;padding:0;margin:1.25rem 0 0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px}
.contact a{color:#fff;font-weight:700;text-underline-offset:3px;text-decoration-color:var(--yellow);min-height:44px;display:inline-flex;align-items:center}
@media (max-width:1100px){.stats{grid-template-columns:repeat(3,1fr)}.how{grid-template-columns:repeat(3,1fr)}}
@media (max-width:980px){.ways{grid-template-columns:1fr}}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,1fr)}.how{grid-template-columns:1fr 1fr}.pks{grid-template-columns:1fr}.custom{flex-direction:column;align-items:stretch;text-align:center}.seen{text-align:center}}
.way__i{flex-shrink:0;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:2px solid var(--ink);font-size:1.1rem;background:var(--butter)}
.way__i--i-coral{background:var(--blush-2)}

/* v2d: compact testimonial cards (Becca, Paige, Clerissa) */
.ftcs{display:grid;gap:clamp(16px,2vw,24px);margin-top:clamp(20px,3vw,32px)}
.ftcs--3{grid-template-columns:repeat(3,1fr)}
.ftcs--2{grid-template-columns:repeat(2,1fr);max-width:980px;margin-inline:auto}
@media (max-width:980px){.ftcs--3{grid-template-columns:1fr 1fr}}
@media (max-width:700px){.ftcs--3,.ftcs--2{grid-template-columns:1fr}}
.ftc{margin:0;background:var(--surface);border:2px solid var(--ink);border-radius:22px;padding:clamp(1.2rem,2.4vw,1.6rem);box-shadow:5px 5px 0 var(--lilac);display:flex;flex-direction:column;gap:.8rem}
.ftc:nth-child(2){box-shadow:5px 5px 0 var(--blush-2)}.ftc:nth-child(3){box-shadow:5px 5px 0 var(--yellow)}
.ftc__top{display:flex;align-items:center;gap:.9rem}
.ftc__photo{width:66px;box-shadow:0 0 0 5px var(--lilac)}
.ftc:nth-child(2) .ftc__photo{box-shadow:0 0 0 5px var(--blush)}.ftc:nth-child(3) .ftc__photo{box-shadow:0 0 0 5px var(--butter)}
.ftc figcaption{display:flex;flex-direction:column;align-items:flex-start;gap:.3rem}
.ftc cite{font-style:normal;font-weight:800;font-size:1rem}
.ftc__hl{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.2rem,1rem + .7vw,1.5rem);line-height:1.22;margin:.2rem 0 0;letter-spacing:-.01em}
.ftc blockquote{margin:0;font-size:.97rem;line-height:1.6;color:var(--ink-2)}
.ftc blockquote p,.ftc__full p{margin:0 0 .6em}
.ftc__more{margin-top:auto;border-top:1px dashed var(--hairline);padding-top:.7rem}
.ftc__more summary{cursor:pointer;font-weight:800;font-size:.9rem;min-height:44px;display:flex;align-items:center;list-style:none;text-decoration:underline;text-decoration-color:var(--coral);text-underline-offset:3px}
.ftc__more summary::-webkit-details-marker{display:none}
.ftc__more summary::after{content:" +";margin-left:.25em}
.ftc__more[open] summary::after{content:" −"}
.ftc__full{font-size:.95rem;line-height:1.6;color:var(--ink-2);padding-top:.3rem}
.mini-q--pink{box-shadow:4px 4px 0 var(--coral);margin-top:12px}
.mini-q--pink blockquote{font-size:1.02rem}
.what-split{align-items:center}.what-split .head{margin-bottom:0}

/* v2d: /collaborate outcomes + Work with Dani cards */
.collab__outcomes{font-weight:700;margin:.2rem 0 0;padding:.7rem 1rem;background:#fff;border:1.5px solid var(--ink);border-radius:14px;display:inline-block;max-width:52ch}
.outs{list-style:none;padding:0;margin:clamp(1.8rem,3.5vw,2.6rem) 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.outs li{background:#fff;border:1.5px solid var(--ink);border-radius:var(--r);padding:1.1rem 1.2rem;box-shadow:4px 4px 0 var(--blush-2)}
.outs li:nth-child(3n+2){box-shadow:4px 4px 0 var(--yellow)}.outs li:nth-child(3n){box-shadow:4px 4px 0 var(--lilac)}
.outs b{display:block;font-family:var(--display);text-transform:uppercase;font-size:1rem;line-height:1.15;margin-bottom:.4rem}
.outs span{display:block;font-size:.95rem;color:var(--ink-2);line-height:1.5}
.works{list-style:none;padding:0;margin:clamp(1.8rem,3.5vw,2.6rem) 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,22px)}
.wk{display:grid;grid-template-columns:42% 1fr;align-items:stretch;height:100%;text-decoration:none;color:var(--ink);background:#fff;border:2px solid var(--ink);border-radius:20px;overflow:hidden;box-shadow:5px 5px 0 var(--ink);transition:transform .2s,box-shadow .2s}
.wk:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}
.wk:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
.wk__media{position:relative;aspect-ratio:9/14;background:var(--blush);overflow:hidden;border-right:2px solid var(--ink)}
.wk__media img{width:100%;height:100%;object-fit:cover}
.wk__media--brand{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;padding:1rem;text-align:center;background:linear-gradient(160deg,var(--blush) 0,var(--blush-2) 55%,var(--lilac) 100%)}
.wk__mark{width:30px;color:var(--yellow)}.wk__mark svg{width:100%;height:auto;display:block}
.wk__bname{font-family:var(--display);text-transform:uppercase;font-size:.95rem;line-height:1.1}
.wk__body{display:flex;flex-direction:column;justify-content:center;gap:.4rem;padding:1rem 1.1rem}
.wk__cat{align-self:flex-start;font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;background:var(--butter);border:1.5px solid var(--ink);border-radius:999px;padding:.25em .75em}
.wk__name{font-weight:800;font-size:1.08rem;line-height:1.25}
.wk__go{font-weight:700;font-size:.9rem;text-decoration:underline;text-decoration-color:var(--coral);text-underline-offset:3px;margin-top:.2rem}
@media (max-width:1100px){.works{grid-template-columns:repeat(2,1fr)}.outs{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.works{grid-template-columns:1fr}.outs{grid-template-columns:1fr}.wk{grid-template-columns:38% 1fr}}

/* v2f: real Circle screenshots in the Inside the Squad frames */
.dev--real .dev__screen img{object-fit:cover;object-position:top center;height:auto}
.dev--phone.dev--real .dev__screen{background:#f4f4f4}
.dev--phone.dev--real::before{display:none}
.dev--browser.dev--real .dev__screen{aspect-ratio:16/10}
.more-inside{margin-top:clamp(2rem,4vw,3rem);text-align:center}
.phone-strip{list-style:none;margin:.9rem 0 0;padding:4px 4px 18px;display:flex;justify-content:center;gap:clamp(14px,2.5vw,28px)}
.phone-strip li{flex:0 0 clamp(150px,17vw,210px)}
.phone-strip .dev--mini{position:relative;width:100%;border-radius:26px;padding:7px}
.phone-strip .dev--mini .dev__screen{border-radius:20px}
.phone-strip li:nth-child(1) .dev--mini{transform:rotate(-2deg)}.phone-strip li:nth-child(3) .dev--mini{transform:rotate(2deg)}
@media (max-width:760px){
  .phone-strip{justify-content:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;margin-inline:calc(var(--gutter,20px)*-1);padding-inline:var(--gutter,20px)}
  .phone-strip li{flex:0 0 58vw;scroll-snap-align:center}
  .phone-strip .dev--mini{transform:none!important}
}

@media (max-width:520px){.pk h4{min-height:0}}
/* Collaborate "Why" photos: once the split stacks (<=860px) the absolute collage would spill onto the channel cards,
   so the three polaroids drop into normal flow as a tidy row (tablet) or 2 + 1 stack (phone). Desktop is unchanged. */
@media (max-width:860px){
  .collage--flow{min-height:0!important;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:start;margin-top:.5rem}
  .collage--flow .pol:nth-child(n){position:relative;inset:auto;width:auto;z-index:auto;margin:0}
}
@media (max-width:760px){
  .collage--flow{grid-template-columns:1fr 1fr;gap:18px 14px}
  .collage--flow .pol:nth-child(3){grid-column:1/-1;width:62%;margin-inline:auto}
}
/* Roadmap hero photos: same in-flow treatment, but they stay one row of three on phones so the headline isn't pushed far down. */
@media (max-width:760px){
  .collage--flow.collage--row{grid-template-columns:repeat(3,1fr);gap:10px}
  .collage--flow.collage--row .pol:nth-child(3){grid-column:auto;width:auto;margin-inline:0}
  .collage--row .pol{padding:5px 5px 16px}
}
