/* ==========================================================================
   symfoniq · intresseanmälan (utkast 5 okt)
   Tokens copied verbatim from brand book v4.1 (10_WORK/gauntloop-2026-10-05/system/tokens.css).
   Only the seven type sizes, only token colours, only the cut corner. No radius, no shadow.
   ========================================================================== */

@font-face{font-family:"Chakra Petch";src:url("../assets/fonts/chakra-petch-bold.woff") format("woff");font-weight:700;font-display:block}
@font-face{font-family:"Inter";src:url("../assets/fonts/inter-regular.woff") format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url("../assets/fonts/inter-medium.woff") format("woff");font-weight:500;font-display:swap}
@font-face{font-family:"Inter";src:url("../assets/fonts/inter-semibold.woff") format("woff");font-weight:600;font-display:swap}

:root{
  --ink:#0A0A0A; --paper:#FFFFFF; --korall:#FF595A; --dimma:#F9E2E6; --grey:#5C5C5C;
  --hair:#0A0A0A1F; --hair-ink:#FFFFFF33; --paper-dim:#FFFFFF99;
  --f-display:"Chakra Petch","Arial Narrow",Arial,sans-serif;
  --f-body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --t-mega:clamp(64px,13.9vw,200px); --t-d1:clamp(52px,8.33vw,120px); --t-d2:clamp(36px,5vw,72px);
  --t-d3:clamp(24px,2.78vw,40px); --t-bl:clamp(17px,1.39vw,20px); --t-b:16px; --t-l:12px;
  --m:clamp(16px,4.4vw,64px); --g:20px; --sec:clamp(64px,8.9vw,128px); --blk:clamp(32px,4.4vw,64px);
  --s1:8px; --s2:12px; --s3:20px; --s4:40px;
  --cut:24px; --cut-s:10px;
  --e-out:cubic-bezier(.16,1,.3,1); --d-fast:.2s;
  /* 1 px cut-corner ring (from brand book tokens.css) */
  --ring:polygon(evenodd,var(--cut-s) 0,100% 0,100% calc(100% - var(--cut-s)),calc(100% - var(--cut-s)) 100%,0 100%,0 var(--cut-s),var(--cut-s) 0,
    calc(var(--cut-s) + .41px) 1px,1px calc(var(--cut-s) + .41px),1px calc(100% - 1px),calc(100% - var(--cut-s) - .41px) calc(100% - 1px),
    calc(100% - 1px) calc(100% - var(--cut-s) - .41px),calc(100% - 1px) 1px,calc(var(--cut-s) + .41px) 1px);
  --bar-h:72px;
  /* left edge of column 3 */
  --inset:calc(var(--m) + (100vw - 2 * var(--m) - 11 * var(--g)) / 6 + 2 * var(--g));
}
@media (max-width:1023px){:root{--inset:var(--m)}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--bar-h)}
body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--t-b)/1.55 var(--f-body);overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure{margin:0}
.nw{white-space:nowrap}
.ai{text-transform:none}
.hero__h,.h2,.faq summary,.foot__line,.jobcard__h,.diff__h,.beta__h{text-wrap:balance}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:var(--m);top:-60px;z-index:50;background:var(--ink);color:var(--paper);padding:var(--s2) var(--s3);font-weight:600;text-decoration:none}
.skip:focus{top:var(--s2)}
:focus-visible{outline:2px solid var(--korall);outline-offset:3px}
[data-tone="korall"] :focus-visible,[data-tone="falt"] :focus-visible{outline-color:var(--ink)}

/* cut corner */
.cut,.tag,.btn{--c:var(--cut)}
.cut{clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c))}

/* type roles */
.label{font:600 var(--t-l)/1.3 var(--f-body);text-transform:uppercase;letter-spacing:.08em}
.h2{font:700 var(--t-d2)/.98 var(--f-display);letter-spacing:-.02em;text-transform:lowercase;max-width:16ch}
.intro{font-size:var(--t-bl);line-height:1.45;max-width:62ch;margin-top:var(--s3)}
.note{color:var(--grey);margin-top:var(--s3);max-width:62ch}


/* ------------------------------------------------------------------ demo banner (config.mode = "demo") */
.demo{position:relative;z-index:30;display:flex;gap:var(--s2);align-items:baseline;padding:10px var(--m);background:var(--ink);color:var(--paper);font-size:var(--t-l);line-height:1.4}
.demo[hidden]{display:none}
.demo__sq{flex:none;display:inline-block;width:8px;height:8px;background:var(--korall)}
.ph{background:var(--dimma);color:var(--ink);padding:0 .25em;text-decoration:none}
[data-tone="falt"] .ph{background:var(--paper)}
.noscript{padding:var(--s3) var(--m);background:var(--ink);color:var(--paper)}

/* ------------------------------------------------------------------ bar */
.bar{position:sticky;top:0;z-index:20;height:var(--bar-h);display:flex;align-items:center;justify-content:space-between;padding:0 var(--m);margin-bottom:calc(-1 * var(--bar-h));background:transparent}
.bar[data-on="light"]{background:var(--paper);box-shadow:inset 0 -1px 0 var(--hair)}
.bar[data-on="korall"]{background:var(--korall)}
.bar[data-on="dark"]{background:var(--ink)}
.bar[data-on="dark"] .bar__logo img{filter:invert(1)}
.bar__logo img{width:124px;height:auto}
.tag{--c:var(--cut-s);display:inline-flex;align-items:center;height:44px;padding:0 var(--s3);font:700 var(--t-b)/1 var(--f-display);text-transform:lowercase;text-decoration:none;color:var(--ink);background:transparent;
  position:relative;clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c));transition:background-color var(--d-fast),color var(--d-fast)}
.tag::after{content:"";position:absolute;inset:0;background:currentColor;clip-path:var(--ring);pointer-events:none}
.tag:hover,.tag:focus-visible{background:var(--korall);color:var(--ink)}
.bar[data-on="dark"] .tag{color:var(--paper)}
.bar[data-on="dark"] .tag:hover{color:var(--ink)}
.bar[data-on="korall"] .tag:hover{background:var(--ink);color:var(--paper)}

/* ------------------------------------------------------------------ buttons */
.btn{--c:var(--cut-s);position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:var(--s1);min-height:52px;padding:var(--s2) var(--s3);font:600 var(--t-b)/1.3 var(--f-body);color:var(--btn-fg);text-decoration:none;border:0;cursor:pointer;background:none;white-space:nowrap;transition:color var(--d-fast)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--btn-bg);transition:background-color var(--d-fast);
  clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c))}
.btn--ink{--btn-bg:var(--ink);--btn-fg:var(--paper)}
.btn--ink:hover{--btn-fg:var(--korall)}
.btn--korall{--btn-bg:var(--korall);--btn-fg:var(--ink)}
.btn--korall:hover{--btn-bg:var(--ink);--btn-fg:var(--paper)}
.btn[disabled]{cursor:progress;--btn-fg:var(--paper-dim)}
.link{font:inherit;color:inherit;background:none;border:0;padding:0;min-height:44px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;transition:color var(--d-fast)}
.link:hover{color:var(--korall)}

/* ------------------------------------------------------------------ pixel field surface */
[data-tone="falt"]{position:relative;isolation:isolate;background:#F89ABA}
canvas.field{position:absolute;inset:0;width:100%;height:100%;z-index:-1;display:block}

/* ------------------------------------------------------------------ hero */
.hero{min-height:min(calc(100svh - 36px),940px);display:grid;grid-template-columns:repeat(12,1fr);column-gap:var(--g);padding:calc(var(--bar-h) + var(--s4)) var(--m) 0;overflow:hidden}
.hero__text{grid-column:1 / span 7;align-self:center;padding-bottom:var(--blk)}
.soon{display:inline-flex;align-items:center;gap:var(--s1);margin-bottom:var(--s3);padding:10px 14px;background:var(--ink);color:var(--paper);font:600 var(--t-l)/1.3 var(--f-body);text-transform:uppercase;letter-spacing:.08em;
  clip-path:polygon(var(--cut-s) 0,100% 0,100% calc(100% - var(--cut-s)),calc(100% - var(--cut-s)) 100%,0 100%,0 var(--cut-s))}
.soon__sq{flex:none;width:8px;height:8px;background:var(--korall)}
.hero__h{font:700 var(--t-d1)/.92 var(--f-display);letter-spacing:-.02em;text-transform:lowercase;max-width:12ch}
.hero__lead{margin-top:var(--s3);font:400 var(--t-bl)/1.45 var(--f-body);max-width:48ch}
/* the colleague stands on the field, cropped at the knees like a poster */
.hero__person{position:absolute;top:calc(var(--bar-h) + var(--s2));bottom:0;right:calc(var(--m) + 10vw);margin:0;pointer-events:none}
.hero__img{height:100%;overflow:hidden;display:flex;justify-content:center}
.hero__img img{height:135%;width:auto;max-width:none;object-fit:contain;object-position:top;will-change:transform}
/* what the colleague is given: chips around the person, popping in one by one */
.crew{list-style:none;margin:0;padding:0;position:absolute;inset:0}
.crew__chip{--c:var(--cut-s);position:absolute;top:var(--y);width:max-content;max-width:210px;padding:10px 14px 10px 30px;background:var(--paper);color:var(--ink);font-size:var(--t-l);line-height:1.35;
  clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c))}
.crew__chip::before{content:"";position:absolute;left:12px;top:15px;width:8px;height:8px;background:var(--korall)}
.crew__chip strong{display:block;font:700 13px/1.25 var(--f-body)}
.crew__chip span{display:block;margin-top:2px;color:var(--grey)}
.crew{--ov:90px}
.crew__chip[data-side="l"]{right:calc(100% - var(--ov))}
.crew__chip[data-side="r"]{left:calc(100% - var(--ov))}
.js .crew__chip{opacity:0;transform:translateY(10px) scale(.96);animation:chip-in .5s var(--e-out) forwards;animation-delay:calc(.5s + var(--i) * .12s)}
@keyframes chip-in{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.js .crew__chip{opacity:1;transform:none;animation:none}}
@media (max-width:1439px){.hero__person{right:calc(var(--m) + 6vw)}.crew__chip span{display:none}.crew__chip{max-width:170px}}
/* 1024–1199 (e.g. a laptop with larger text): keep the person beside the form, a little tighter */
@media (max-width:1199px){.hero__text{grid-column:1 / span 7}.hero__person{right:calc(var(--m) + 4vw)}.hero__img img{height:115%}.crew{--ov:96px}.crew__chip{max-width:140px;padding:8px 10px 8px 24px}.crew__chip::before{left:9px;top:13px;width:7px;height:7px}.crew__chip strong{font-size:12px}}
/* short laptop screens: smaller headline so the signup card starts higher */
@media (min-width:1024px) and (max-height:820px){.hero{padding-top:calc(var(--bar-h) + var(--s3))}.hero__h{font-size:clamp(48px,6vw,84px)}.soon{margin-bottom:var(--s2)}.hero__lead{margin-top:var(--s2)}.hero__text .signup{margin-top:var(--s3)}}
@media (max-width:1023px){
  .hero{display:block;min-height:0;padding-top:calc(var(--bar-h) + var(--s3))}
  .crew__chip span{display:none}
  .hero__text{padding-bottom:var(--s4)}
  .hero__person{position:relative;top:auto;right:auto}
  .hero__img{height:260px}
  .hero__img img{height:150%}
  .crew{position:relative;inset:auto;display:flex;flex-wrap:wrap;justify-content:center;gap:6px;padding:var(--s2) 0 var(--s3)}
  .crew__chip{position:relative;top:auto;left:auto!important;right:auto!important;max-width:none;padding:8px 10px 8px 24px}
  .crew__chip::before{left:9px;top:13px;width:7px;height:7px}
  .crew__chip strong{font-size:12px}
}
@media (max-width:767px){
  .soon{margin-bottom:var(--s2);padding:8px 12px}
  .hero__lead{margin-top:var(--s2);font-size:16px;line-height:1.45}
}

/* ------------------------------------------------------------------ signup (hero + footer) */
.signup{margin-top:var(--s4);max-width:560px}
.signup__kicker{font:600 var(--t-l)/1.3 var(--f-body);text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--s1)}
.signup__lead{max-width:52ch;font-weight:500}
.signup__label{display:block;margin-top:var(--s2);font-weight:600}
.signup__row{display:flex;gap:var(--s1);margin-top:var(--s1)}
.signup__input{flex:1;min-width:0;min-height:52px!important}
.signup__btn{flex:none}
.signup__msg{margin-top:var(--s1);font-weight:600;min-height:0}
.signup__msg:empty{display:none}
.signup__msg.is-error{display:flex;gap:var(--s1);align-items:baseline}
.signup__msg.is-error::before{content:"";flex:none;width:8px;height:8px;background:var(--ink);transform:translateY(-1px)}
.signup__micro{margin-top:var(--s1);font-size:var(--t-l);line-height:1.4}
.signup__micro a{font-weight:600}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.signup-done{--c:var(--cut);margin-top:var(--s4);max-width:560px;padding:var(--s3);background:var(--paper);color:var(--ink);
  clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c))}
.signup-done[hidden]{display:none}
.signup-done:focus{outline:none}
.signup-done__h{font:700 var(--t-d3)/1.1 var(--f-display);letter-spacing:-.02em}
.signup-done__p{margin-top:var(--s1);max-width:52ch}
.signup-done .btn{margin-top:var(--s3)}
.signup-done__opt{margin-top:var(--s1);font-size:var(--t-l);color:var(--grey)}
@media (max-width:767px){
  .signup{margin-top:var(--s3)}
  .signup__lead{font-size:var(--t-b)}
  .signup__btn{padding:var(--s2) 14px}
}

/* ------------------------------------------------------------------ sections */
.sec{padding:var(--sec) 0}
.wrap{padding:0 var(--m) 0 var(--inset)}
.flood[data-tone="korall"]{background:var(--korall);color:var(--ink)}
.flood[data-tone="dark"]{background:var(--ink);color:var(--paper)}
.flood[data-tone="dark"] .intro{color:var(--paper)}
[data-tone="korall"] .note{color:var(--ink)}
.qual[hidden]{display:none}

/* B · ping-pong before/after */
.pp{display:grid;grid-template-columns:1fr 1fr;gap:var(--g);margin-top:var(--blk)}
.pp__panel{--c:var(--cut);margin:0;background:var(--paper);color:var(--ink);padding:var(--s3);display:flex;flex-direction:column}
.pp__panel .label{color:var(--grey)}
.pp__h{margin-top:var(--s1);font:700 var(--t-d3)/1.1 var(--f-display);letter-spacing:-.02em;text-transform:lowercase}
.pp__panel figcaption p:last-child{margin-top:var(--s1);color:var(--grey);max-width:44ch}
.pp__stage{margin-top:var(--s3);aspect-ratio:460/380;width:100%}
.pp__stage svg{display:block;width:100%;height:100%;overflow:visible}
.pp__count{margin-top:var(--s2);padding-top:var(--s2);border-top:1px solid var(--hair);font-weight:600}
.pp__count b{display:inline-block;min-width:1ch;color:var(--korall);font:700 var(--t-d3)/1 var(--f-display);vertical-align:-2px}
.pp .n rect,.pp .n path{transition:fill .25s,stroke .25s}
.pp .n.hit path{fill:var(--korall)}
.pp .n.hit:not(.centre):not(.human) path{fill:var(--dimma)}   /* steps flash pale so the coral ball stays visible on them */
.pp .n.hit text{fill:var(--ink)}
.statement.statement--ink{color:var(--ink)}
.pp .ai-badge{opacity:0;transition:opacity .2s}
.pp .ai-badge.used{opacity:.9}
.pp .ai-badge.work{opacity:1;animation:ai-work .65s steps(3,end) infinite}
@keyframes ai-work{0%{opacity:1}33%{opacity:.35}66%{opacity:1}}
@media (max-width:1023px){.pp{grid-template-columns:1fr}}

/* C · differences on ink */
.diffs{list-style:none;padding:0;margin-top:var(--blk);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--g)}
.diff{border-top:1px solid var(--hair-ink);padding-top:var(--s3)}
.diff__n{display:block;font:600 var(--t-l)/1.3 var(--f-body);letter-spacing:.08em;color:var(--korall)}
.diff__h{margin:var(--s2) 0;font:700 var(--t-d3)/1.1 var(--f-display);letter-spacing:-.02em;text-transform:lowercase}
.diff p{max-width:36ch;color:var(--paper)}
.stays{margin-top:var(--blk)}
.stays__list{margin-top:var(--s1);font:700 var(--t-d3)/1.1 var(--f-display);letter-spacing:-.02em;text-transform:lowercase}
.statement{margin-top:var(--blk);font:700 var(--t-d2)/.98 var(--f-display);letter-spacing:-.02em;text-transform:lowercase;max-width:18ch;color:var(--korall)}
@media (max-width:767px){.diffs{grid-template-columns:1fr;gap:var(--s4)}}

/* D · early access */
/* alt B: the signup as a card with perks, repeated CTA rows, the team */
.signup--card{--c:var(--cut);background:var(--paper);color:var(--ink);padding:var(--s3) var(--s3) var(--s3);max-width:580px}
.perks{list-style:none;padding:0;margin-top:var(--s2)}
.perks li{display:flex;gap:var(--s2);margin-top:6px;font-size:var(--t-b);line-height:1.45}
.perks li::before{content:"";flex:none;width:8px;height:8px;background:var(--korall);margin-top:.5em}
.cta-row{margin-top:var(--blk)}
.team .section-kicker{color:#bdbdbd}
.team .h2{max-width:22ch}
.team__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s4);margin-top:var(--blk);align-items:start}
.team__photo{margin:0}
.team__photo img{display:block;width:100%;height:auto}
.team__text p{font-size:var(--t-bl);line-height:1.5;color:#d6d6d6;margin-top:var(--s3);max-width:44ch}
.team__text p:first-child{margin-top:0}
.team__lead{color:var(--paper)!important;font-weight:600}
.team__relations{border-top:1px solid #686868;padding-top:var(--s3);color:var(--paper)!important;font-weight:600}
.team .btn{--btn-bg:var(--korall);--btn-fg:var(--ink)}
@media (max-width:1023px){.team__grid{grid-template-columns:1fr}}
@media (max-width:767px){.signup--card{padding:var(--s2)}}
.early{display:grid;grid-template-columns:1fr 1fr;gap:var(--g);margin-top:var(--blk);align-items:start}
.beta{--c:var(--cut);padding:var(--s4);background:var(--korall);color:var(--ink)}
.beta__h{margin-top:var(--s2);font:700 var(--t-d3)/1.1 var(--f-display);letter-spacing:-.02em;text-transform:lowercase}
.beta p + p:not(.beta__h){margin-top:var(--s2);max-width:62ch}
.next-steps{border-top:1px solid var(--ink);padding-top:var(--s3)}
.steps-list{margin-top:var(--s2);padding-left:1.4em;font-size:var(--t-bl);line-height:1.45}
.steps-list li{padding:var(--s1) 0}
.steps-list li::marker{font-weight:600;color:var(--korall)}
@media (max-width:1023px){.early{grid-template-columns:1fr}}
@media (max-width:767px){.beta{padding:var(--s3)}}

/* F · price + FAQ */
.pricebox{margin-top:var(--blk);max-width:880px;border-top:1px solid var(--ink);padding-top:var(--s3)}
.pricebox__n{font:700 var(--t-d2)/.98 var(--f-display);letter-spacing:-.02em}
.pricebox__u{margin-top:var(--s1);font-weight:600}
.pricebox__list{list-style:none;padding:0;margin-top:var(--s3)}
.pricebox__list li{padding:var(--s1) 0;border-bottom:1px solid var(--hair);font-size:var(--t-bl)}
.faq__h{margin-top:var(--sec);font:700 var(--t-d2)/.98 var(--f-display);letter-spacing:-.02em;text-transform:lowercase}
.faq{margin-top:var(--s4);border-top:1px solid var(--ink);max-width:880px}
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:var(--s3);padding:var(--s3) 0;font:700 var(--t-d3)/1.1 var(--f-display);letter-spacing:-.02em;text-transform:lowercase;transition:color var(--d-fast)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font-family:var(--f-body);font-weight:400}
.faq details[open] summary::after{content:"–"}
.faq summary:hover{color:var(--korall)}
.faq details p{font-size:var(--t-bl);line-height:1.45;max-width:62ch;padding-bottom:var(--s3)}

/* ------------------------------------------------------------------ footer: final CTA + privacy */
.foot{color:var(--ink);overflow:hidden}
.foot__in{padding:var(--sec) var(--m) var(--s3)}
.foot__line{font:700 var(--t-d1)/.92 var(--f-display);letter-spacing:-.02em;text-transform:lowercase}
.privacy{margin-top:var(--sec);max-width:72ch;font-size:var(--t-b);line-height:1.55}
.privacy{border-top:1px solid var(--ink)}
.privacy__sum{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:var(--s1) var(--s3);align-items:baseline;padding:var(--s3) 0}
.privacy__sum::-webkit-details-marker{display:none}
.privacy__sum::after{content:"+";grid-column:2;grid-row:1;font:400 var(--t-d3)/1 var(--f-body)}
.privacy[open] .privacy__sum::after{content:"\2013"}
.privacy__h{font:700 var(--t-d3)/1.1 var(--f-display);letter-spacing:-.02em;text-transform:lowercase}
.privacy__lead{grid-column:1;font-size:var(--t-b);line-height:1.5}
.privacy__sum:hover .privacy__h{color:var(--korall)}
.privacy__sum:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.privacy__body{padding-bottom:var(--s3)}
.privacy__body p + p{margin-top:var(--s1)}
.foot__meta{margin-top:var(--s3);font-size:var(--t-l);line-height:1.3}
.foot__meta a{display:inline-block;padding:8px 0}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Launch additions: brand book v4.1, product layouts, hairlines and pixel status. */
.section-kicker{margin-bottom:var(--s3);color:var(--grey)}
.hero__watch{display:inline-flex;align-items:center;gap:var(--s2);min-height:44px;margin-top:var(--s2);font-weight:600;text-underline-offset:4px}
.hero__watch span,.rolecard__link span[aria-hidden]{transition:transform .2s var(--e-out)}
.hero__watch:hover span,.rolecard__link:hover span{transform:translate(4px,-4px)}
.hero__beta{font-size:var(--t-l);line-height:1.5;max-width:56ch;margin-top:var(--s1)}
.hero__beta a{font-weight:600;text-underline-offset:3px}
.rolecards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);margin-top:var(--blk)}
.rolecard{border-top:2px solid var(--ink);padding-top:var(--s3);display:flex;flex-direction:column;min-width:0}
.rolecard__number{font:700 var(--t-d3)/1 var(--f-display);display:flex;align-items:center;gap:var(--s2)}
.rolecard__number span{font:600 var(--t-l)/1.3 var(--f-body);text-transform:uppercase;letter-spacing:.08em;color:var(--grey)}
.rolecard__h{font:700 var(--t-d3)/1.05 var(--f-display);letter-spacing:-.02em;text-wrap:balance;margin-top:var(--s4)}
.rolecard__claim{font-weight:600;font-size:var(--t-bl);line-height:1.4;margin-top:var(--s3)}
.rolecard ul{padding:0;list-style:none;margin-top:var(--s3);margin-bottom:var(--s4)}
.rolecard li{display:flex;gap:var(--s2);margin-top:var(--s1)}
.rolecard li::before{content:'';width:6px;height:6px;flex:none;background:var(--ink);margin-top:.65em}
.rolecard__link{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);margin-top:auto;min-height:48px;border-top:1px solid var(--hair);text-decoration:none;font-weight:600}
.rolecard__link:hover{text-decoration:underline;text-underline-offset:4px}
.workday{border-top:1px solid var(--hair)}
.workday .h2{max-width:20ch}
.workday__more{margin-top:var(--s4);display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap}
.workday__tabs{display:flex;gap:var(--s1)}
.workday__tab{font:600 var(--t-b)/1.3 var(--f-body);min-height:48px;padding:var(--s2) var(--s3);border:1px solid var(--ink);background:var(--paper);color:var(--ink);cursor:pointer}
.workday__tab[aria-selected="true"]{background:var(--ink);color:var(--paper)}
.workday__tab:hover:not([aria-selected="true"]){text-decoration:underline;text-underline-offset:4px}
.workday__panel{margin-top:var(--blk);display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:var(--s4);align-items:start;scroll-margin-top:calc(var(--bar-h) + var(--s3))}
.workday__panel[hidden],.workday [hidden]{display:none}
.workday__flow{padding-top:var(--s3)}
.workday__h{font:700 var(--t-d3)/1.05 var(--f-display);letter-spacing:-.02em;margin-top:var(--s3);text-wrap:balance}
.workday__intro{margin-top:var(--s3);max-width:38ch}
.workday__steps{list-style:none;margin-top:var(--s4);padding:0}
.workday__steps li{display:flex;gap:var(--s3);align-items:baseline;border-top:1px solid var(--hair);padding:var(--s3) 0;color:var(--grey)}
.workday__stepnum{font:600 var(--t-l)/1.3 var(--f-body);flex:none}
.workday__steps .is-current{color:var(--ink);font-weight:600;border-top:2px solid var(--korall)}
.workday__steps .is-done{color:var(--ink)}
.workday__desk{border:1px solid var(--ink);min-width:0;background:var(--paper)}
.workday__deskbar{background:var(--ink);color:var(--paper);display:flex;flex-wrap:wrap;gap:var(--s2);justify-content:space-between;align-items:center;padding:var(--s3);font-size:var(--t-l)}
.workday__deskbar>span:first-child{text-transform:uppercase;font-weight:600;letter-spacing:.08em}
.workday__status{display:flex;align-items:center;gap:var(--s1)}
.workday__status::before{content:'';width:8px;height:8px;background:var(--korall);flex:none}
.is-approved .workday__status::before{background:var(--paper)}
.workday__message{padding:var(--s4)}
.workday__sender{display:flex;gap:var(--s2);align-items:center;margin-bottom:var(--s3)}
.workday__avatar{width:40px;height:40px;flex:none}
.workday__sender strong,.workday__sender div>span{display:block}
.workday__sender div>span{color:var(--grey);font-size:var(--t-l);margin-top:2px}
.workday__message>p{font-size:var(--t-bl);line-height:1.5}
.workday__document{margin-top:var(--s3);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.workday__document summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);cursor:pointer;list-style:none;min-height:48px;font-weight:600}
.workday__document summary::-webkit-details-marker{display:none}
.workday__document[open] summary span{transform:rotate(45deg)}
.workday__paper{padding:var(--s3) 0}
.workday__paper h4{font:700 var(--t-d3)/1.15 var(--f-display);margin:var(--s2) 0 var(--s3)}
.workday__paper dl{margin:0}
.workday__paper dl>div{margin-top:var(--s2);padding-top:var(--s2);border-top:1px solid var(--hair)}
.workday__paper dt{font-weight:600}
.workday__paper dd{margin:4px 0 0;color:var(--grey)}
.workday__decision,.workday__result{border-top:1px solid var(--ink);padding:var(--s3) var(--s4)}
.workday__decision>p:first-child{font-weight:600}
.workday__decision .btn{margin-top:var(--s2);--btn-bg:var(--korall);--btn-fg:var(--ink);white-space:normal}
.workday__decision .btn:hover{--btn-bg:var(--ink);--btn-fg:var(--paper)}
.workday__safe{font-size:var(--t-l);color:var(--grey);margin-top:var(--s1)}
.workday__result>p:nth-child(2){font-size:var(--t-bl);margin-top:var(--s2)}
.workday__result .link{margin-top:var(--s3)}
.workday__end{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);margin-top:var(--s4)}
.workday__end .note{margin:0;max-width:50ch}
.workday__end .btn{flex:none;--btn-bg:var(--korall);--btn-fg:var(--ink)}
.early .pricebox{margin-top:0;min-width:0}
.early .pricebox__n{font-size:var(--t-d3)}
.offer-next{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s4);margin-top:var(--blk)}
.offer-next .next-steps{flex:1}
.offer-next .btn{flex:none;--btn-bg:var(--korall);--btn-fg:var(--ink)}
.faq-section{border-top:1px solid var(--hair)}
@media (min-width:1200px){.hero__text{position:relative;z-index:1;grid-column:1 / span 6}.hero__h{font-size:clamp(72px,6.5vw,104px)}}
@media (max-width:1023px){.rolecards{gap:var(--s3)}.workday__panel{grid-template-columns:1fr}.workday__intro{max-width:60ch}.workday__steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s3);margin-top:var(--s3)}.workday__steps li{display:block}.workday__stepnum{display:block;margin-bottom:var(--s1)}}
@media (max-width:767px){
  .hero__h{font-size:clamp(44px,11.5vw,64px)}
  .hero__text{padding-bottom:var(--s3)}
  .hero__lead{max-width:40ch}
  .hero__beta{max-width:44ch}
  .rolecards{grid-template-columns:1fr;gap:var(--s4)}
  .rolecard__h{margin-top:var(--s3)}
  .rolecard ul{margin-bottom:var(--s3)}
  .workday__tabs{gap:0;border:1px solid var(--ink);flex:1 1 100%}
  .workday__tab{flex:1;min-width:0;border:0;padding:var(--s2) 6px;font-size:var(--t-l);overflow-wrap:anywhere}
  .workday__tab + .workday__tab{border-left:1px solid var(--ink)}
  .workday__steps{grid-template-columns:1fr 1fr;gap:0 var(--s3)}
  .workday__message{padding:var(--s3)}
  .workday__decision,.workday__result{padding:var(--s3)}
  .workday__end,.offer-next{align-items:flex-start;flex-direction:column;gap:var(--s3)}
  .offer-next .next-steps{width:100%}
}
@media (max-width:359px){.signup__row{flex-direction:column}.signup__btn{align-self:flex-start}}
@media (prefers-reduced-motion:reduce){.hero__watch span,.rolecard__link span[aria-hidden]{transition:none}}
html:not(.js) .workday__more,html:not(.js) .workday__decision{display:none}
html:not(.js) .workday__panel + .workday__panel{margin-top:var(--blk)}
@media (max-width:359px){.workday__tab{font-size:11px;padding-inline:4px;overflow-wrap:normal}}

/* Responsibility as one connected system, not three text cards. */
.partnership__kicker{color:var(--paper);margin-bottom:var(--s3)}
.partnership .h2{max-width:24ch}
.partnership .h2>span{color:var(--korall)}
.partnership__intro{font-size:var(--t-bl);line-height:1.5;margin-top:var(--s3);max-width:48ch}
.partnership__block{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:var(--blk);border:1px solid #686868}
.partnership__col{padding:var(--s4) var(--s3);min-width:0}
.partnership__col + .partnership__col{border-left:1px solid #686868}
.partnership__col .label{color:#bdbdbd}
.partnership__col h3{font:700 clamp(22px,2vw,28px)/1.1 var(--f-display);letter-spacing:-.02em;margin-top:var(--s2)}
.partnership__col>p:last-child{font-size:var(--t-b);line-height:1.5;color:#bdbdbd;margin-top:var(--s2);max-width:42ch}
.partnership__relations{grid-column:1/-1;background:var(--korall);color:var(--ink);padding:var(--s3);font:600 var(--t-b)/1.4 var(--f-body)}
/* who it fits: three numbered cards */
.fitcards{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);margin-top:var(--blk)}
.fitcard{border-top:2px solid var(--ink);padding-top:var(--s3);min-width:0}
.fitcard__n{display:flex;align-items:center;gap:var(--s2);font:700 var(--t-d3)/1 var(--f-display)}
.fitcard__n::after{content:"";width:8px;height:8px;background:var(--korall)}
.fitcard p{margin-top:var(--s3);font-size:var(--t-bl);line-height:1.45;max-width:36ch}
/* hero icons from the brand book: coral plate, white glyph. One thing moves at a time, a whole module, hard stop. */
.hi{display:block;width:96px;height:96px;margin-bottom:var(--s3)}
.hi__p{fill:var(--korall)}
.hi__w{fill:var(--paper)}
.hi__px,.hi__ln{transform-box:fill-box}
.js .fitcards:not(.is-live) .hi{opacity:0}
.fitcards.is-live .hi{animation:hi-in .8s steps(4,end) calc(var(--k) * .15s) both}
/* one shared 4.2 s cycle: the AI pixel moves, then the document lines are written, then the calendar day steps */
.fitcards.is-live .hi--ai .hi__px{animation:hi-ai 4.2s steps(1,end) 1s infinite}
.fitcards.is-live .hi--doc .hi__ln{transform-origin:left center;animation:hi-ln 4.2s steps(1,end) calc(1s + var(--n) * .15s) infinite}
.fitcards.is-live .hi--cal .hi__px{animation:hi-cal 4.2s steps(1,end) 1s infinite}
@keyframes hi-in{from{opacity:0}to{opacity:1}}
@keyframes hi-ai{0%,4%{transform:none}5%,24%{transform:translateX(-12px)}25%,100%{transform:none}}
@keyframes hi-ln{0%,37%{transform:none}38%,47%{transform:scaleX(0)}48%,100%{transform:none}}
@keyframes hi-cal{0%,67%{transform:none}68%,87%{transform:translateX(18px)}88%,100%{transform:none}}
@media (prefers-reduced-motion:reduce){.fitcards .hi,.fitcards .hi *{animation:none!important;opacity:1!important}}
@media (max-width:767px){.hi{width:72px;height:72px;margin-bottom:var(--s2)}}
@media (max-width:1023px){.fitcards{gap:var(--s3)}}
@media (max-width:767px){.fitcards{grid-template-columns:1fr}.fitcard p{margin-top:var(--s2)}.partnership__block{grid-template-columns:1fr}.partnership__col + .partnership__col{border-left:0;border-top:1px solid #686868}.partnership__col{padding:var(--s3)}}
@media (max-width:1023px){.partnership__map{grid-template-columns:minmax(0,1fr) 88px minmax(210px,.5fr)}.partnership__work{padding:var(--s3) var(--s2)}.partnership__flow{gap:var(--s2)}.partnership__flow li:not(:last-child)::after{right:-8px;font-size:20px}.partnership__foundation{align-items:flex-start;flex-direction:column;gap:var(--s3)}}
@media (max-width:767px){
 .partnership .h2{font-size:clamp(36px,7vw,52px)}
 .partnership__map{grid-template-columns:1fr}
 .partnership__assignment{font-size:10px;letter-spacing:.04em}
 .partnership__work{padding:var(--s3)}
 .partnership__flow{margin-top:var(--s4);grid-template-columns:1fr;gap:0}
 .partnership__flow li{display:grid;grid-template-columns:48px 1fr;gap:0 var(--s3);padding:var(--s3) 0;border-top:1px solid #686868}
 .partnership__flow li:last-child{padding-bottom:0}
 .partnership__flow svg{grid-row:1/3;width:48px;height:48px;margin:0}
 .partnership__flow h3{font-size:24px}
 .partnership__flow p{max-width:30ch;margin-top:8px}
 .partnership__flow li:not(:last-child)::after{display:none}
 .partnership__handoff{height:72px;display:flex;align-items:center;justify-content:center;gap:var(--s2)}
 .partnership__handoff svg{width:64px;height:40px;transform:rotate(90deg);margin:0}
 .partnership__human{display:grid;grid-template-columns:64px 1fr;gap:var(--s3);padding:var(--s3)}
 .partnership__human>.label{grid-column:1/-1}
 .partnership__decision{margin:0}
 .partnership__human h3{font-size:32px;align-self:center}
 .partnership__human>p{grid-column:1/-1;margin:0}
 .partnership__foundation{border-top:0}
 .partnership__foundation ul{grid-template-columns:1fr 1fr;width:100%;gap:var(--s2)}
}

/* Original 24 x 24 icons from the live brand book; keep its 3-unit stroke. */
.partnership svg.icon{stroke:currentColor;stroke-width:3;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:2;flex:none}
.partnership__flow li:not(:last-child)::after{display:none}
.partnership__flow svg.partnership__step-arrow{position:absolute;width:24px;height:24px;top:20px;right:-20px;color:var(--korall);margin:0}
.partnership__arrows{display:flex;flex-direction:column;align-items:center;margin-top:8px}
.partnership__arrows svg.icon{width:40px;height:32px;margin:0}
.partnership__arrows svg:last-child{transform:rotate(180deg)}
.partnership__training{grid-column:1/-1;border:1px solid #686868;border-top:0;display:flex;gap:var(--s3);padding:var(--s3);align-items:flex-start}
.partnership__training>svg{width:40px;height:40px;color:var(--korall)}
.partnership__training .label{color:#bdbdbd}
.partnership__examples{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);font-size:var(--t-bl);line-height:1.5;margin-top:var(--s2)}
.partnership__foundation{align-items:flex-start;flex-direction:column;gap:var(--s3)}
.partnership__improvement{display:flex;gap:var(--s3);align-items:flex-start}
.partnership__improvement>svg{width:40px;height:40px;color:var(--korall)}
.partnership__improvement p{font-size:var(--t-b);line-height:1.5;color:#bdbdbd;max-width:64ch;margin-top:var(--s2)}
.partnership__foundation ul{padding-left:64px}
@media(max-width:1023px){.partnership__flow svg.partnership__step-arrow{right:-12px;width:20px}.partnership__owner{align-items:flex-start;flex-direction:column}}
@media(max-width:767px){
 .partnership__flow svg.partnership__step-arrow{display:none}
 .partnership__arrows{transform:rotate(90deg);margin:0}
 .partnership__handoff .partnership__arrows svg.icon{transform:none;width:32px;height:24px}
 .partnership__handoff .partnership__arrows svg:last-child{transform:rotate(180deg)}
 .partnership__training,.partnership__improvement{gap:var(--s2)}
 .partnership__training>svg,.partnership__improvement>svg{width:32px;height:32px}
 .partnership__examples{display:block;font-size:17px}
 .partnership__examples span{display:block;margin-top:var(--s2)}
 .partnership__foundation ul{padding-left:0}
}

.confirm-page{background:var(--dimma);min-height:100vh}
.confirm{--c:var(--cut);max-width:560px;margin:clamp(32px,10vh,120px) auto;padding:var(--s4) clamp(20px,5vw,48px);background:var(--paper);clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c))}
.confirm__h{margin-top:var(--s4);font:700 clamp(30px,4vw,48px)/1.05 var(--f-display);letter-spacing:-.02em;text-transform:lowercase}
.confirm__p{margin:var(--s3) 0;font-size:var(--t-bl);line-height:1.45;max-width:46ch}
@media (max-width:599px){.confirm{margin:0;min-height:100vh;clip-path:none}}

/* early-bird signup at the end: centred, one joined field + button, a faint grid behind (after the Waitly reference) */
.join{position:relative;isolation:isolate;overflow:hidden;text-align:center;
  background:radial-gradient(ellipse 60% 55% at 50% 45%,var(--paper) 30%,rgba(255,255,255,0) 100%),
    linear-gradient(to right,rgba(10,10,10,.06) 1px,transparent 1px) 0 0/40px 40px,
    linear-gradient(to bottom,rgba(10,10,10,.06) 1px,transparent 1px) 0 0/40px 40px,var(--dimma)}
.join__in{display:flex;flex-direction:column;align-items:center;padding:0 var(--m)}
.join__kicker{display:inline-flex;align-items:center;gap:var(--s1);color:var(--ink)}
.join__h{margin-top:var(--s3);max-width:16ch}
.join__form{margin-top:var(--s3);max-width:720px;width:100%}
.join__lead{font-size:var(--t-bl);font-weight:400;line-height:1.5;color:var(--grey);max-width:52ch;margin:0 auto}
/* the joined bar: an ink frame drawn as a background, so the cut corners keep their border */
.join__row{--c:var(--cut-s);margin-top:var(--s4);gap:0;padding:1px;background:var(--ink);
  clip-path:polygon(var(--c) 0,100% 0,100% calc(100% - var(--c)),calc(100% - var(--c)) 100%,0 100%,0 var(--c))}
.join__input{border:0!important;background:var(--paper);padding-left:var(--s3);min-height:60px!important;
  clip-path:polygon(calc(var(--c) - 1px) 0,100% 0,100% 100%,0 100%,0 calc(var(--c) - 1px))}
.join__input:focus-visible{outline:2px solid var(--korall);outline-offset:-3px}
.join__btn{--c:0px;border-radius:0}
.join .signup__msg{text-align:left}
.join__perks{list-style:none;padding:0;margin-top:var(--s3);display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s1) var(--s4);font-size:var(--t-b)}
.join__perks li{display:flex;align-items:flex-start;gap:var(--s1);text-align:left}
.join__perks li::before{content:"";width:8px;height:8px;background:var(--korall);flex:none;margin-top:.5em}
.join__micro{margin:var(--s3) auto 0;max-width:60ch;color:var(--grey)}
.join__done{margin-left:auto;margin-right:auto;text-align:left}
@media (max-width:599px){.join__row{flex-direction:column;gap:1px}.join__input{clip-path:polygon(calc(var(--c) - 1px) 0,100% 0,100% 100%,0 100%,0 calc(var(--c) - 1px))}.join__btn{justify-content:center;min-height:56px}.join__perks{display:grid;justify-content:center;gap:var(--s1)}}