/* The Bridge · site styles v2
   Concept: riso registration. Two inks printed slightly off; headings and buttons carry a second-ink offset
   that snaps closer when they enter the screen or get pressed. The bridge shows up as arcs that draw on scroll.
   Layout: one 1240px column, full-bleed bands, asymmetric print-style grids.
   Brand A (Signal Orange, light) and B (Ultraviolet, dark) are token sets; each is a deliberate single look. */

:root,
:root[data-brand="a"] {
  --paper: #E9E7E2;
  --paper-2: #DEDBD3;
  --sheet: #F3F2EE;
  --ink: #15171C;
  --ink-soft: #4E535D;
  --rule: #C3BFB5;
  --spot: #FF5B22;
  --spot-text: #D2400F;
  --on-spot: #15171C;
  --plate: #15171C;
  --reg: #FF5B22;
  --reg-alt: #15171C;
  --night: #15171C;
  --night-2: #1E2127;
  --night-ink: #ECEAE5;
  --night-soft: #A7ACB5;
  --night-rule: #353943;
  --night-reg: #FF5B22;
  --bubble-out: #FF5B22;
  --bubble-out-ink: #15171C;
  --bubble-in: #FFFFFF;
  --ok: #1E7A4C;
  --warn: #9A5B00;
  --hot: #C2311F;
  --night-hot: #FF8A6E;
  color-scheme: light;

  --f-display: "Darker Grotesque", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --f-body: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  --f-mono: "Martian Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --wrap: 1240px;
  --r: 6px;
  --ease: cubic-bezier(.2, .8, .2, 1);
  --spring: cubic-bezier(.34, 1.56, .64, 1);
}

:root[data-brand="b"] {
  --paper: #110D22;
  --paper-2: #17122E;
  --sheet: #1D1739;
  --ink: #FFF6EC;
  --ink-soft: #C2BAD6;
  --rule: #352C5C;
  --spot: #FF7A5C;
  --spot-text: #FF8E73;
  --on-spot: #110D22;
  --plate: #7357FF;
  --reg: #7357FF;
  --reg-alt: #FF7A5C;
  --night: #0A0716;
  --night-2: #161029;
  --night-ink: #FFF6EC;
  --night-soft: #B9B0D1;
  --night-rule: #2E2552;
  --night-reg: #7357FF;
  --bubble-out: #6447F0;
  --bubble-out-ink: #FFF6EC;
  --bubble-in: #2A2248;
  --ok: #6FD3A0;
  --warn: #F5C46B;
  --hot: #FF8F7A;
  --night-hot: #FF8F7A;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; interpolate-size: allow-keywords; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--f-body);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  transition: background-color .4s var(--ease), color .4s var(--ease);
}
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 70; background: var(--paper); }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
p, h1, h2, h3, ul, ol, figure, blockquote, fieldset { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button, input { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--spot); outline-offset: 3px; }
::selection { background: var(--spot); color: var(--on-spot); }

.wrap {
  width: 100%;
  max-width: calc(var(--wrap) + 64px);
  margin-inline: auto;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
}
@media (min-width: 760px) { .wrap { padding-left: max(32px, env(safe-area-inset-left, 0px)); padding-right: max(32px, env(safe-area-inset-right, 0px)); } }
.stack { display: flex; flex-direction: column; gap: 24px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -80px; background: var(--spot); color: var(--on-spot); padding: 10px 14px; z-index: 100; font-weight: 700; }
.skip:focus { top: calc(12px + env(safe-area-inset-top, 0px)); }

/* ---------- Type ---------- */
.mega, .big, .mid, .small-h, .wordmark, .how__n, .calc__num, .kitprice__n, .foot__mark {
  font-family: var(--f-display);
  font-weight: 900;
  letter-spacing: -0.01em;
}
.mega { font-size: clamp(3.6rem, 1.6rem + 8.4vw, 8.6rem); line-height: .8; display: flex; flex-direction: column; gap: .06em; }
.mega__line { display: block; overflow: hidden; padding: .04em .12em .1em 0; margin-bottom: -.06em; }
.mega__in { display: inline-block; }
.big { font-size: clamp(2.6rem, 1.5rem + 4.4vw, 5.2rem); line-height: .86; max-width: 15ch; text-wrap: balance; }
.mid { font-size: clamp(1.9rem, 1.4rem + 1.8vw, 2.7rem); line-height: .92; text-wrap: balance; }
.small-h { font-size: 1.75rem; line-height: .95; font-weight: 800; }
.lead { font-size: clamp(1.08rem, 1rem + .4vw, 1.3rem); line-height: 1.5; color: var(--ink-soft); max-width: 50ch; }
.body { color: var(--ink-soft); max-width: 56ch; }
.kicker { font-family: var(--f-mono); font-size: .7rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); }
.mono { font-family: var(--f-mono); font-size: .8em; font-variant-numeric: tabular-nums; }
.fine { font-size: .84rem; color: var(--ink-soft); }

/* Registration: the second ink sits off and snaps in */
.reg { --rx: .045em; --ry: .035em; text-shadow: var(--rx) var(--ry) 0 var(--reg); transition: text-shadow .9s var(--ease); }
.reg--alt { color: var(--spot-text); text-shadow: var(--rx) var(--ry) 0 var(--reg-alt); }
.js .reg[data-reveal]:not(.is-in) { --rx: .16em; --ry: .12em; }

/* ---------- Buttons and links ---------- */
.btn {
  --off: 5px;
  position: relative;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 54px; padding: 14px 26px;
  background: var(--spot); color: var(--on-spot);
  font-family: var(--f-body); font-weight: 800; font-size: 1.02rem; letter-spacing: -.005em;
  text-decoration: none; border: 2px solid var(--plate); border-radius: var(--r); cursor: pointer;
  box-shadow: var(--off) var(--off) 0 var(--plate);
  transition: transform .18s var(--ease), box-shadow .18s var(--ease);
  align-self: flex-start;
}
.btn:hover { transform: translate(-2px, -2px); box-shadow: calc(var(--off) + 2px) calc(var(--off) + 2px) 0 var(--plate); }
.btn:active { transform: translate(var(--off), var(--off)); box-shadow: 0 0 0 var(--plate); transition-duration: .06s; }
.btn--sm { --off: 3px; min-height: 40px; padding: 8px 14px; font-size: .9rem; }
.btn--block { width: 100%; align-self: stretch; }
.link-arrow { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 2px no-repeat; transition: background-size .35s var(--ease); padding-bottom: 3px; }
.link-arrow:hover { background-size: 100% 2px; }
.link-arrow__a { display: inline-block; transition: transform .35s var(--spring); }
.link-arrow:hover .link-arrow__a { transform: translateX(6px); }

/* ---------- Progress + header ---------- */
.progress { position: fixed; left: 0; right: 0; top: env(safe-area-inset-top, 0px); height: 3px; z-index: 80; pointer-events: none; }
.progress span { display: block; height: 100%; background: var(--spot); transform-origin: 0 50%; transform: scaleX(0); }
.top {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 60;
  background: var(--paper); border-bottom: 1px solid var(--rule);
  transition: transform .35s var(--ease), background-color .4s var(--ease);
}
.top.is-hidden { transform: translateY(-100%); }
.top__in { display: flex; align-items: center; gap: 22px; min-height: 64px; }
.wordmark { font-size: 1.9rem; line-height: 1; text-decoration: none; margin-right: auto; text-shadow: .05em .04em 0 var(--reg); }
.nav { display: none; gap: 26px; font-weight: 600; font-size: .95rem; }
.nav a { text-decoration: none; color: var(--ink-soft); background: linear-gradient(var(--spot), var(--spot)) 0 100% / 0 2px no-repeat; padding-bottom: 2px; transition: background-size .3s var(--ease), color .2s; }
.nav a:hover { color: var(--ink); background-size: 100% 2px; }
@media (min-width: 1020px) { .nav { display: flex; } }
.top__actions { display: flex; align-items: center; gap: 10px; }
.lang { display: flex; border: 1.5px solid var(--ink); border-radius: var(--r); overflow: hidden; }
.lang button { border: 0; background: none; cursor: pointer; font-family: var(--f-mono); font-size: .7rem; font-weight: 600; min-width: 40px; min-height: 36px; color: var(--ink); transition: background-color .2s, color .2s; }
.lang button[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
@media (max-width: 400px) { .top .btn--sm { padding: 8px 10px; font-size: .84rem; } .wordmark { font-size: 1.6rem; } }

/* ---------- Hero ---------- */
.hero { padding-top: clamp(32px, 6vw, 84px); overflow: hidden; }
.hero__grid { display: grid; gap: 44px; align-items: start; }
.hero__copy { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.hero__ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 26px; }
.proof { font-family: var(--f-mono); font-size: .72rem; color: var(--ink-soft); letter-spacing: .02em; }
.hero__phone { position: relative; z-index: 2; display: flex; justify-content: center; }
@media (min-width: 980px) {
  .hero__grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 48px; }
  .hero__phone { margin-bottom: -260px; justify-content: flex-end; }
}
@media (max-width: 979px) { .hero__phone { margin-bottom: -70px; } }

/* Load sequence */
@keyframes lineUp { from { transform: translateY(105%); } to { transform: none; } }
@keyframes rise { from { transform: translateY(28px) rotate(2deg); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes fadeUp { from { transform: translateY(14px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes settle { from { transform: scale(1.08); } to { transform: scale(1); } }
.js .mega__in { animation: lineUp .9s var(--ease) both; }
.js .mega__line:nth-child(2) .mega__in { animation-delay: .12s; }
.js .hero .kicker, .js .hero .lead, .js .hero__ctas, .js .proof { animation: fadeUp .7s var(--ease) both; }
.js .hero .lead { animation-delay: .25s; }
.js .hero__ctas { animation-delay: .35s; }
.js .proof { animation-delay: .45s; }
.js .phone { animation: rise 1s var(--ease) .3s both; }

/* Phone */
.phone {
  width: 100%; max-width: 384px;
  background: var(--sheet);
  border: 2px solid var(--ink);
  border-radius: 30px;
  padding: 18px 16px 16px;
  box-shadow: 10px 10px 0 var(--reg);
}
.phone__bar { display: flex; align-items: center; gap: 12px; padding: 2px 6px 12px; border-bottom: 1px solid var(--rule); }
.phone__avatar { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: var(--paper); font-family: var(--f-mono); font-weight: 600; font-size: .66rem; flex: none; }
.phone__who { min-width: 0; }
.phone__name { font-weight: 800; font-size: .98rem; }
.phone__via { font-size: .74rem; color: var(--ink-soft); }
.channel { font-weight: 700; color: var(--spot-text); display: inline-block; }
.channel.swap { animation: chSwap .5s var(--spring); }
@keyframes chSwap { 0% { transform: translateY(-8px); opacity: 0; } 100% { transform: none; opacity: 1; } }
.phone__time { text-align: center; font-family: var(--f-mono); font-size: .62rem; color: var(--ink-soft); margin: 12px 0 10px; }
.chat { display: flex; flex-direction: column; gap: 8px; min-height: 352px; }
.msg {
  max-width: 82%; padding: 9px 13px; border-radius: 16px; font-size: .9rem; line-height: 1.38;
  transform-origin: bottom right;
}
.msg--in { align-self: flex-start; background: var(--bubble-in); color: var(--ink); border: 1.5px solid var(--rule); border-bottom-left-radius: 4px; transform-origin: bottom left; }
.msg--out { align-self: flex-end; background: var(--bubble-out); color: var(--bubble-out-ink); border-bottom-right-radius: 4px; font-weight: 500; }
.msg.is-pending { visibility: hidden; }
.msg.pop { animation: pop .45s var(--spring); }
@keyframes pop { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
.msg.typing { color: transparent; position: relative; width: 64px; height: 36px; overflow: hidden; }
.msg.typing::after { content: ""; position: absolute; left: 50%; top: 50%; width: 6px; height: 6px; margin: -3px 0 0 -15px; border-radius: 50%; background: var(--bubble-out-ink); box-shadow: 12px 0 0 var(--bubble-out-ink), 24px 0 0 var(--bubble-out-ink); animation: dots 1s infinite; }
@keyframes dots { 50% { opacity: .3; } }
.msg--done.pop::before { content: "✓ "; font-weight: 800; }
.chat--story { min-height: 0; }
.phone__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 14px; padding: 0 4px; }
.phone__stat { display: flex; align-items: baseline; gap: 8px; font-size: .76rem; color: var(--ink-soft); }
.timer { font-family: var(--f-mono); font-weight: 600; font-size: .9rem; color: var(--ok); font-variant-numeric: tabular-nums; }
.replay { border: 1.5px solid var(--ink); background: none; border-radius: var(--r); padding: 6px 10px; font-size: .74rem; font-weight: 700; cursor: pointer; min-height: 34px; transition: transform .15s var(--ease), background-color .2s; }
.replay:hover { background: var(--ink); color: var(--paper); }
.replay:active { transform: scale(.95); }
.replay span[aria-hidden] { display: inline-block; transition: transform .5s var(--ease); }
.replay:hover span[aria-hidden] { transform: rotate(-180deg); }

/* Vista */
.vista { position: relative; margin-top: 36px; overflow: hidden; border-top: 2px solid var(--ink); }
.vista img { width: 100%; height: clamp(300px, 46vw, 640px); object-fit: cover; object-position: 50% 62%; will-change: transform; }
.js .vista img { animation: settle 1.8s var(--ease) both; }
@media (max-width: 979px) { .vista img { height: auto; aspect-ratio: 3 / 2; } }

/* Ticker */
.ticker { background: var(--night); color: var(--night-ink); border-block: 2px solid var(--ink); overflow: hidden; }
.ticker__track { display: flex; width: max-content; animation: tick 28s linear infinite; }
.ticker:hover .ticker__track { animation-play-state: paused; }
@keyframes tick { to { transform: translateX(-50%); } }
.ticker__list { display: flex; flex: none; }
.ticker__list li { font-family: var(--f-display); font-weight: 800; font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.4rem); line-height: 1; padding: 16px 0; white-space: nowrap; display: flex; align-items: center; }
.ticker__list li::after { content: ""; width: 34px; height: 17px; margin: 0 26px; border: 3px solid var(--night-reg); border-bottom: 0; border-radius: 34px 34px 0 0; }

/* ---------- Sections ---------- */
.sec { padding-block: clamp(72px, 10vw, 140px); position: relative; overflow-x: clip; }
.sec--alt { background: var(--paper-2); }
.sec--dark { background: var(--night); color: var(--night-ink); --reg: var(--night-reg); }
.sec--dark .kicker, .sec--dark .fine { color: var(--night-soft); }
.lead--dark { color: var(--night-soft); }
.sec--dark .btn { --plate: var(--night-ink); border-color: var(--night-ink); }

/* Scroll reveal: content is visible without JS; with JS it waits off-screen only below the fold */
.js [data-reveal]:not(.is-in):not([data-reveal="stamp"]) { opacity: 0; transform: translateY(26px); }
[data-reveal] { transition: opacity .8s var(--ease), transform .8s var(--ease), text-shadow .9s var(--ease); }
.features [data-reveal]:nth-child(2), .how__steps [data-reveal]:nth-child(2), .crew [data-reveal]:nth-child(2), .timeline [data-reveal]:nth-child(2) { transition-delay: .12s; }
.features [data-reveal]:nth-child(3), .how__steps [data-reveal]:nth-child(3), .crew [data-reveal]:nth-child(3), .timeline [data-reveal]:nth-child(3) { transition-delay: .24s; }
.crew [data-reveal]:nth-child(4) { transition-delay: .36s; }

/* Story */
.story { border: 2px solid var(--night-rule); border-radius: var(--r); padding: clamp(20px, 3.4vw, 40px); display: flex; flex-direction: column; gap: 28px; margin-top: 16px; }
.story__head { display: flex; flex-direction: column; gap: 12px; max-width: 64ch; color: var(--night-soft); }
.story__head .mid { color: var(--night-ink); }
.story__split { display: grid; gap: 28px; }
@media (min-width: 880px) { .story__split { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; } .story__side + .story__side { border-left: 2px dashed var(--night-rule); padding-left: 32px; } .story__side:first-child { padding-right: 32px; } }
.story__side { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.story__label { font-family: var(--f-mono); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; color: var(--night-soft); }
.timeline { display: flex; flex-direction: column; gap: 14px; }
.timeline li { display: flex; flex-direction: column; gap: 2px; padding-left: 18px; border-left: 3px solid var(--night-rule); }
.timeline .mono { color: var(--night-soft); }
.stamp {
  align-self: flex-start; font-family: var(--f-display); font-weight: 900; font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.4rem); line-height: 1;
  color: var(--night-hot); border: 3px solid var(--night-hot); padding: 8px 14px 10px; transform: rotate(-3deg);
}
.js .stamp[data-reveal]:not(.is-in) { opacity: 0; transform: rotate(-12deg) scale(1.6); }
.stamp.is-in { animation: stamp .5s var(--spring) both; }
@keyframes stamp { 0% { opacity: 0; transform: rotate(-12deg) scale(1.6); } 70% { opacity: 1; } 100% { opacity: 1; transform: rotate(-3deg) scale(1); } }
.story__side--good .msg--in { background: var(--night-2); color: var(--night-ink); border-color: var(--night-rule); }
.alert { font-family: var(--f-mono); font-size: .72rem; line-height: 1.6; border-left: 3px solid var(--night-reg); padding: 6px 0 6px 12px; color: var(--night-ink); }
.features { display: grid; gap: 28px; margin-top: 18px; }
@media (min-width: 880px) { .features { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; } }
.features li { display: flex; flex-direction: column; gap: 10px; color: var(--night-soft); border-top: 2px solid var(--night-ink); padding-top: 18px; }
.features .small-h { color: var(--night-ink); }

/* Calculator */
.calc { display: grid; gap: 40px; align-items: center; }
@media (min-width: 940px) { .calc { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; } }
.calc__copy { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.calc__form { display: flex; flex-direction: column; gap: 22px; background: var(--sheet); border: 2px solid var(--ink); border-radius: var(--r); padding: clamp(20px, 3vw, 32px); box-shadow: 10px 10px 0 var(--reg); }
.slider { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; align-items: baseline; }
.slider label { font-weight: 600; font-size: .94rem; }
.slider output { font-family: var(--f-mono); font-weight: 600; font-size: .95rem; font-variant-numeric: tabular-nums; }
.slider input { grid-column: 1 / -1; width: 100%; appearance: none; -webkit-appearance: none; height: 28px; background: transparent; cursor: pointer; margin: 0; }
.slider input::-webkit-slider-runnable-track { height: 6px; border-radius: 3px; background: linear-gradient(to right, var(--spot) var(--p, 30%), var(--rule) var(--p, 30%)); }
.slider input::-moz-range-track { height: 6px; border-radius: 3px; background: var(--rule); }
.slider input::-moz-range-progress { height: 6px; border-radius: 3px; background: var(--spot); }
.slider input::-webkit-slider-thumb { -webkit-appearance: none; width: 26px; height: 26px; margin-top: -10px; border-radius: 50%; background: var(--sheet); border: 3px solid var(--ink); box-shadow: 3px 3px 0 var(--reg); transition: transform .2s var(--spring); }
.slider input::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: var(--sheet); border: 3px solid var(--ink); }
.slider input:active::-webkit-slider-thumb { transform: scale(1.18); }
.calc__out { border-top: 2px solid var(--ink); padding-top: 18px; display: flex; flex-direction: column; gap: 6px; }
.calc__label { font-family: var(--f-mono); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); }
.calc__num { font-size: clamp(3.8rem, 2.6rem + 4vw, 6rem); line-height: .8; color: var(--spot-text); font-variant-numeric: tabular-nums; --reg: var(--plate); }
.calc__num.bump { animation: bump .35s var(--spring); }
@keyframes bump { 40% { transform: scale(1.04); } }

/* How it works */
.how { position: relative; margin-top: 10px; }
.how__arcs { display: none; }
@media (min-width: 880px) { .how__arcs { display: block; width: 100%; height: 90px; margin-bottom: -20px; overflow: visible; } }
.arc { fill: none; stroke: var(--reg); stroke-width: 4; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.js .arc { stroke-dashoffset: var(--draw, 1); }
.how__steps { display: grid; gap: 28px; }
@media (min-width: 880px) { .how__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; } }
.how__steps li { display: flex; flex-direction: column; gap: 10px; color: var(--ink-soft); }
.how__steps .small-h { color: var(--ink); }
.how__n { font-size: 5rem; line-height: .75; color: var(--spot-text); text-shadow: .05em .04em 0 var(--plate); }

/* Services */
.feature { display: grid; gap: 28px; border: 2px solid var(--ink); border-radius: var(--r); padding: clamp(22px, 3.4vw, 40px); background: var(--sheet); box-shadow: 10px 10px 0 var(--reg); margin-top: 8px; }
@media (min-width: 940px) { .feature { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 48px; } }
.feature__copy { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.feature__copy > p:not(.kicker):not(.note-line) { color: var(--ink-soft); font-size: 1.06rem; }
.note-line { font-family: var(--f-mono); font-size: .74rem; font-weight: 600; color: var(--spot-text); }
.feature__adds { display: flex; flex-direction: column; }
.feature__adds li, .list li { display: flex; flex-direction: column; gap: 4px; padding-block: 16px; border-top: 1px solid var(--rule); position: relative; }
.feature__adds li:first-child { border-top: 2px solid var(--ink); }
.t { font-weight: 800; display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; }
.d { color: var(--ink-soft); font-size: .95rem; }
.price { font-family: var(--f-mono); font-size: .72rem; font-weight: 600; color: var(--spot-text); }
.feature__adds li::before, .list li::before { content: ""; position: absolute; left: 0; top: -1px; height: 2px; width: 0; background: var(--spot); transition: width .5s var(--ease); }
.feature__adds li:hover::before, .list li:hover::before { width: 100%; }
.cols { display: grid; gap: 36px; margin-top: 16px; }
@media (min-width: 880px) { .cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; } }
.col { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.list { margin-top: 6px; }

/* Industries */
.tabs { position: relative; display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; border-bottom: 2px solid var(--ink); margin-top: 6px; }
.tabs::-webkit-scrollbar { display: none; }
.tabs button { flex: none; border: 0; background: none; padding: 12px 16px 14px; min-height: 48px; font-weight: 700; font-size: 1rem; cursor: pointer; color: var(--ink-soft); transition: color .2s; }
.tabs button[aria-selected="true"] { color: var(--ink); }
.tabs__bar { position: absolute; left: 0; bottom: -2px; height: 5px; width: 0; background: var(--spot); transition: transform .45s var(--spring), width .45s var(--spring); }
.panel { display: grid; gap: 24px; align-items: center; margin-top: 8px; }
.panel[hidden] { display: none; }
@media (min-width: 900px) { .panel { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 56px; } }
.panel__text { font-family: var(--f-display); font-weight: 800; font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem); line-height: 1.02; max-width: 22ch; min-width: 0; }
.panel.is-entering .panel__text { animation: fadeUp .5s var(--ease) both; }
.panel.is-entering .rows li { animation: fadeUp .45s var(--ease) both; }
.panel.is-entering .rows li:nth-child(2) { animation-delay: .08s; }
.panel.is-entering .rows li:nth-child(3) { animation-delay: .16s; }
.screen { background: var(--sheet); border: 2px solid var(--ink); border-radius: var(--r); padding: 18px 20px; min-width: 0; box-shadow: 10px 10px 0 var(--reg); }
.screen__h { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-weight: 800; padding-bottom: 12px; border-bottom: 2px solid var(--ink); }
.screen__tag { font-family: var(--f-mono); font-size: .6rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); }
.rows li { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto; gap: 10px; align-items: center; padding-block: 13px; border-bottom: 1px solid var(--rule); font-size: .92rem; }
.rows li:last-child { border-bottom: 0; }
.rows .mono { color: var(--ink-soft); }
@media (max-width: 540px) { .rows li { grid-template-columns: minmax(0, 1fr) auto; } .rows .mono { grid-column: 1; grid-row: 2; } }
.st { display: inline-flex; align-items: center; gap: 7px; font-size: .78rem; font-weight: 700; white-space: nowrap; color: var(--ok); }
.st::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: currentColor; }
.st--warn { color: var(--warn); }
.st--hot { color: var(--hot); }
.st--hot::before { animation: pulse 1.6s infinite; }
@keyframes pulse { 50% { box-shadow: 0 0 0 6px transparent; transform: scale(1.35); } }

/* Founders */
.founders__in { display: grid; gap: 40px; align-items: center; }
@media (min-width: 940px) { .founders__in { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 64px; } }
.seats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; max-width: 460px; }
.seats li { position: relative; aspect-ratio: 1; display: grid; place-items: center; cursor: default; }
.seats svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.seats circle { fill: none; stroke: var(--spot); stroke-width: 6; stroke-dasharray: 280; stroke-dashoffset: 0; transition: stroke-dashoffset 1s var(--ease), fill .3s; transform: rotate(-90deg); transform-origin: 50% 50%; }
.js .seats:not(.is-in) circle { stroke-dashoffset: 280; }
.seats li:nth-child(2) circle { transition-delay: .1s; } .seats li:nth-child(3) circle { transition-delay: .2s; } .seats li:nth-child(4) circle { transition-delay: .3s; } .seats li:nth-child(5) circle { transition-delay: .4s; }
.seats span { position: relative; font-family: var(--f-display); font-weight: 900; font-size: clamp(1.4rem, 1rem + 1.4vw, 2.2rem); line-height: 1; transition: transform .35s var(--spring), color .2s; }
.seats li:hover circle { fill: var(--spot); }
.seats li:hover span { transform: scale(1.15) rotate(-6deg); color: var(--on-spot); }

/* Team */
.team { display: grid; gap: 28px; margin-top: 8px; }
@media (min-width: 980px) { .team { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 48px; align-items: start; } }
.lead-person { display: flex; gap: 22px; align-items: flex-start; border-top: 2px solid var(--ink); padding-top: 22px; }
.lead-person__txt { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.lead-person__txt > p:last-child { color: var(--ink-soft); }
.avatar { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: var(--paper); font-family: var(--f-mono); font-weight: 600; font-size: .72rem; flex: none; box-shadow: 4px 4px 0 var(--reg); transition: transform .4s var(--spring), box-shadow .4s var(--ease); }
.avatar--lg { width: 96px; height: 96px; font-size: 1rem; background: var(--spot); color: var(--on-spot); box-shadow: 6px 6px 0 var(--plate); }
li:hover > .avatar, .lead-person:hover .avatar { transform: rotate(-8deg) scale(1.06); box-shadow: 0 0 0 var(--reg); }
.role { font-family: var(--f-mono); font-size: .7rem; color: var(--spot-text); font-weight: 600; }
.crew { display: grid; }
@media (min-width: 620px) { .crew { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; } }
.crew li { display: flex; gap: 14px; align-items: flex-start; padding-block: 18px; border-top: 1px solid var(--rule); min-width: 0; }
.crew li > div:last-child { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.crew__n { font-weight: 800; }
.crew li a, .crew__x { font-size: .86rem; color: var(--ink-soft); }

/* Shop teaser + tap demo */
.shopteaser { display: grid; gap: 40px; align-items: center; }
@media (min-width: 900px) { .shopteaser { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; } }
.kitprice { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.kitprice__n { font-size: clamp(4.4rem, 3rem + 4vw, 6.6rem); line-height: .8; }
.kitprice__alt { font-family: var(--f-mono); font-size: .76rem; color: var(--ink-soft); }
.tapdemo { position: relative; height: 340px; max-width: 460px; width: 100%; justify-self: center; }
.tapdemo__stand { position: absolute; left: 6%; bottom: 0; width: 46%; height: 78%; background: var(--sheet); border: 2px solid var(--ink); border-radius: 10px 10px 4px 4px; box-shadow: 8px 8px 0 var(--reg); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; }
.tapdemo__logo { font-family: var(--f-display); font-weight: 900; font-size: 1.7rem; line-height: 1; text-shadow: .05em .04em 0 var(--reg); }
.tapdemo__hint { font-family: var(--f-mono); font-size: .6rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); }
.tapdemo__phone { position: absolute; right: 10%; top: 6%; width: 38%; aspect-ratio: 9 / 17; background: var(--ink); border-radius: 22px; padding: 8px; transform: rotate(14deg); transform-origin: 50% 100%; }
.tapdemo__screen { width: 100%; height: 100%; border-radius: 15px; background: var(--sheet); display: grid; place-items: center; }
.stars { display: flex; gap: 3px; }
.stars i { width: 16px; height: 16px; background: var(--rule); clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%); }
.ripple { position: absolute; left: 29%; top: 40%; width: 60px; height: 60px; margin: -30px; border-radius: 50%; border: 3px solid var(--spot); opacity: 0; pointer-events: none; }
.tapdemo.is-in .tapdemo__phone { animation: tap 3.6s var(--ease) infinite; }
.tapdemo.is-in .ripple { animation: ripple 3.6s var(--ease) infinite; }
.tapdemo.is-in .ripple--2 { animation-delay: .18s; }
.tapdemo.is-in .stars i { animation: star 3.6s var(--ease) infinite; }
.tapdemo.is-in .stars i:nth-child(2) { animation-delay: .1s; } .tapdemo.is-in .stars i:nth-child(3) { animation-delay: .2s; } .tapdemo.is-in .stars i:nth-child(4) { animation-delay: .3s; } .tapdemo.is-in .stars i:nth-child(5) { animation-delay: .4s; }
@keyframes tap { 0%, 12% { transform: rotate(14deg) translate(0, 0); } 32%, 46% { transform: rotate(-4deg) translate(-58%, 18%); } 66%, 100% { transform: rotate(14deg) translate(0, 0); } }
@keyframes ripple { 0%, 34% { opacity: 0; transform: scale(.4); } 38% { opacity: 1; } 60%, 100% { opacity: 0; transform: scale(2.6); } }
@keyframes star { 0%, 48% { background: var(--rule); transform: scale(1); } 54% { transform: scale(1.4); } 58%, 92% { background: var(--spot); transform: scale(1); } 100% { background: var(--rule); } }

/* FAQ */
.faq { display: grid; gap: 28px; }
@media (min-width: 900px) { .faq { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 64px; align-items: start; } }
.faq__list details { border-top: 2px solid var(--ink); }
.faq__list details:last-child { border-bottom: 2px solid var(--ink); }
.faq__list summary { cursor: pointer; list-style: none; padding: 20px 52px 20px 0; font-weight: 800; font-size: 1.08rem; position: relative; transition: color .2s; }
.faq__list summary:hover { color: var(--spot-text); }
.faq__list summary::-webkit-details-marker { display: none; }
.faq__list summary::after { content: "+"; position: absolute; right: 6px; top: 50%; width: 34px; height: 34px; margin-top: -17px; display: grid; place-items: center; font-family: var(--f-mono); font-size: 1.1rem; border: 2px solid var(--ink); border-radius: 50%; transition: transform .4s var(--spring), background-color .2s, color .2s; }
.faq__list details[open] summary::after { transform: rotate(135deg); background: var(--spot); color: var(--on-spot); border-color: var(--spot); }
.faq__list details::details-content { block-size: 0; overflow: hidden; transition: block-size .45s var(--ease), content-visibility .45s allow-discrete; }
.faq__list details[open]::details-content { block-size: auto; }
.faq__a p { color: var(--ink-soft); padding-bottom: 20px; max-width: 60ch; }

/* Book */
.book { padding-top: clamp(110px, 13vw, 180px); }
.bridge-line { position: absolute; left: 0; top: 0; width: 100%; height: clamp(60px, 9vw, 140px); overflow: visible; }
.arc--big { stroke-width: 5; }
.book__grid { display: grid; gap: 40px; }
@media (min-width: 980px) { .book__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 72px; align-items: start; } }
.book__copy { display: flex; flex-direction: column; gap: 26px; min-width: 0; }
.quote { border-left: 4px solid var(--night-reg); padding-left: 20px; color: var(--night-soft); display: flex; flex-direction: column; gap: 12px; font-size: 1.08rem; }
.quote footer { font-family: var(--f-mono); font-size: .7rem; color: var(--night-ink); }
.contact { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; color: var(--night-soft); }
.contact .mono { color: var(--night-ink); user-select: all; }
.copy { border: 1.5px solid var(--night-ink); background: none; color: var(--night-ink); border-radius: var(--r); padding: 6px 12px; font-size: .74rem; font-weight: 700; cursor: pointer; min-height: 34px; transition: background-color .2s, color .2s; }
.copy:hover { background: var(--night-ink); color: var(--night); }
.form { background: var(--night-2); border: 2px solid var(--night-ink); border-radius: var(--r); padding: clamp(20px, 3vw, 32px); display: flex; flex-direction: column; gap: 18px; box-shadow: 10px 10px 0 var(--night-reg); }
.needs { border: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.needs legend { font-weight: 700; font-size: .95rem; padding: 0; margin-bottom: 12px; }
.opt { font-family: var(--f-mono); font-size: .62rem; color: var(--night-soft); font-weight: 500; margin-left: 6px; }
.needs__opts { display: flex; flex-wrap: wrap; gap: 8px; }
.need { position: relative; cursor: pointer; }
.need input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.need span { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 14px; border: 1.5px solid var(--night-rule); border-radius: var(--r); font-size: .86rem; font-weight: 600; transition: background-color .2s, color .2s, border-color .2s, transform .3s var(--spring); }
.need:hover span { border-color: var(--night-ink); }
.need input:checked + span { background: var(--spot); color: var(--on-spot); border-color: var(--spot); transform: rotate(-2deg); }
.need input:focus-visible + span { outline: 3px solid var(--spot); outline-offset: 2px; }
.field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.field label { font-size: .88rem; font-weight: 600; }
.field input { min-height: 50px; width: 100%; padding: 12px 14px; border-radius: var(--r); border: 1.5px solid var(--night-rule); background: var(--night); color: var(--night-ink); font-family: var(--f-body); font-size: 1rem; transition: border-color .2s, box-shadow .2s; }
.field input:focus { outline: none; border-color: var(--spot); box-shadow: 4px 4px 0 var(--spot); }
.field input[aria-invalid="true"] { border-color: var(--night-hot); }
.field-row { display: grid; gap: 18px; }
@media (min-width: 560px) { .field-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.err { color: var(--night-hot); font-size: .82rem; font-weight: 600; }
.consent { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; align-items: start; font-size: .78rem; line-height: 1.5; color: var(--night-soft); }
.consent input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--spot); }
.consent a { color: var(--night-ink); font-weight: 700; }
.form__status { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; align-items: center; border: 2px solid var(--spot); border-radius: var(--r); padding: 12px 14px; font-size: .92rem; }
.form__status svg { width: 40px; height: 40px; }
.check { fill: none; stroke: var(--spot); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 40; stroke-dashoffset: 40; animation: draw .6s var(--ease) .1s forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
.shake { animation: shake .4s var(--ease); }
@keyframes shake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }

/* Footer */
.foot { background: var(--night); color: var(--night-ink); overflow: hidden; padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
.foot__in { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 18px; padding-block: 34px 10px; border-top: 1px solid var(--night-rule); }
.foot .fine { color: var(--night-soft); }
.foot__nav { display: flex; flex-wrap: wrap; gap: 10px 26px; align-items: center; font-size: .92rem; }
.foot__nav a { text-decoration: none; }
.foot__nav a:hover { text-decoration: underline; }
.foot__nav .mono { color: var(--night-soft); user-select: all; }
.foot__mark { font-size: clamp(5rem, 1rem + 19vw, 19rem); line-height: .78; white-space: nowrap; text-align: center; color: var(--night-ink); --reg: var(--night-reg); margin-top: 18px; will-change: transform; }

/* Mobile dock */
.dock {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 55;
  padding: 10px max(16px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
  background: var(--paper); border-top: 2px solid var(--ink);
  transform: translateY(110%); transition: transform .4s var(--ease);
}
.dock.is-on { transform: none; }
@media (min-width: 980px) { .dock { display: none; } }

/* WhatsApp + review switcher */
.wa { position: fixed; right: calc(16px + env(safe-area-inset-right, 0px)); bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 50; background: #1F8F55; color: #FFFFFF; font-weight: 700; padding: 12px 18px; border-radius: var(--r); text-decoration: none; border: 2px solid #15171C; box-shadow: 4px 4px 0 #15171C; }
.review { position: fixed; left: calc(12px + env(safe-area-inset-left, 0px)); bottom: calc(86px + env(safe-area-inset-bottom, 0px)); z-index: 58; display: flex; align-items: center; gap: 2px; padding: 3px; border-radius: var(--r); background: var(--ink); color: var(--paper); border: 2px solid var(--ink); }
.review__k { font-family: var(--f-mono); font-size: .58rem; letter-spacing: .08em; text-transform: uppercase; padding: 0 6px; opacity: .8; }
.review button { border: 0; background: none; color: inherit; border-radius: 4px; padding: 4px 10px; min-height: 30px; font-size: .8rem; font-weight: 800; cursor: pointer; }
.review button[aria-pressed="true"] { background: var(--spot); color: var(--on-spot); }

@media (min-width: 980px) { .review { bottom: calc(16px + env(safe-area-inset-bottom, 0px)); } }

/* Legal + shop pages */
.page { padding-block: clamp(48px, 7vw, 96px); }
.page .wrap { display: flex; flex-direction: column; gap: 22px; }
.page--narrow .wrap { max-width: calc(780px + 64px); }
.placeholder { border: 2px dashed var(--rule); border-radius: var(--r); padding: 18px; color: var(--ink-soft); }
.table-wrap { overflow-x: auto; min-width: 0; }
.catalog { width: 100%; border-collapse: collapse; font-size: .96rem; }
.catalog th { text-align: left; font-family: var(--f-mono); font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); font-weight: 500; padding: 0 12px 12px 0; border-bottom: 2px solid var(--ink); }
.catalog td { padding: 15px 12px 15px 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
.catalog tr { transition: background-color .2s; }
.catalog tbody tr:hover { background: var(--paper-2); }
.catalog td:first-child { font-weight: 800; }
.catalog td:nth-child(2) { color: var(--ink-soft); }
.catalog .num { text-align: right; font-family: var(--f-mono); font-size: .84rem; font-variant-numeric: tabular-nums; white-space: nowrap; padding-right: 0; }
.shopgrid { display: grid; gap: 36px; margin-top: 8px; }
@media (min-width: 960px) { .shopgrid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 56px; align-items: start; } }
.kit { background: var(--sheet); border: 2px solid var(--ink); border-radius: var(--r); padding: 26px; display: flex; flex-direction: column; gap: 14px; box-shadow: 10px 10px 0 var(--reg); }
.kit > p { color: var(--ink-soft); }
.kit__booster { border-top: 2px solid var(--ink); padding-top: 16px; display: flex; flex-direction: column; gap: 6px; }

/* ---------- v2.1: illustration series inside the v2 look ---------- */
.ill { position: relative; overflow: hidden; border: 2px solid var(--ink); border-radius: var(--r); background: var(--paper-2); aspect-ratio: var(--ar, 3 / 2); box-shadow: 10px 10px 0 var(--reg); }
.sec--dark .ill { border-color: var(--night-ink); background: var(--night-2); box-shadow: 10px 10px 0 var(--night-reg); }
.sec--alt .ill { background: var(--paper); }
.ill img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); transition: transform 1.6s var(--ease); }
.ill.is-in img { transform: scale(1); }
.js .ill[data-reveal="ill"]:not(.is-in) { opacity: 1; transform: none; clip-path: inset(0 100% 0 0); }
.js .ill[data-reveal="ill"] { transition: clip-path 1.1s var(--ease), box-shadow .9s var(--ease); }
.js .ill[data-reveal="ill"].is-in { clip-path: inset(-20px -20px -20px -20px); }
.ill.is-missing img { opacity: 0; }
.ill.is-missing::after { content: "Illustration · " attr(data-label); position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--f-mono); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-soft); background: repeating-linear-gradient(135deg, transparent 0 14px, var(--rule) 14px 15px); }
.sec--dark .ill.is-missing::after { color: var(--night-soft); background: repeating-linear-gradient(135deg, transparent 0 14px, var(--night-rule) 14px 15px); }
.ill--wide { width: 100%; }
.ill--square { max-width: 420px; width: 100%; }
.ill--tall { max-width: 440px; width: 100%; justify-self: center; }

/* Hero: illustration visible above the fold, phone on top of it */
.hero__grid { align-items: center; padding-bottom: clamp(48px, 7vw, 96px); }
.hero__art { position: relative; min-width: 0; }
.ill--hero { aspect-ratio: 4 / 3.4; box-shadow: 10px 10px 0 var(--reg); }
.ill--hero img { object-position: 58% 72%; transform: none; }
.js .ill--hero img { animation: settle 1.8s var(--ease) both; }
.hero__art .hero__phone { margin: -48px 0 0; padding-inline: 18px; }
@media (max-width: 979px) { .ill--hero { aspect-ratio: 4 / 3; } .ill--hero img { object-position: 60% 80%; } }
@media (min-width: 980px) {
  .hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 80px; }
  .hero .lead { max-width: 40ch; }
  .ill--hero { aspect-ratio: 4 / 4.6; }
  .hero__art .hero__phone { position: absolute; left: -40px; bottom: -40px; margin: 0; padding: 0; width: 330px; }
  .hero__art .phone { max-width: 330px; }
  .mega { font-size: clamp(3.6rem, 1rem + 6vw, 7rem); }
}

/* Story with illustration */
.story__top { display: grid; gap: 24px; align-items: center; }
@media (min-width: 880px) { .story__top { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 44px; } }

/* How */
.how { display: flex; flex-direction: column; gap: 44px; }

/* Industries: vignette per tab */
.vignette { aspect-ratio: 1; border: 2px solid var(--ink); border-radius: var(--r); background-color: var(--paper); background-size: 205% 205%; background-position: var(--pos); max-width: 460px; width: 100%; box-shadow: 10px 10px 0 var(--reg); }
:root[data-brand="a"] .vignette, :root:not([data-brand]) .vignette { background-image: url("assets/ill/industries-a.jpg"); }
:root[data-brand="b"] .vignette { background-image: url("assets/ill/industries-b.jpg"); }
.panel__body { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.panel.is-entering .vignette { animation: fadeUp .5s var(--ease) both; }
@media (min-width: 900px) { .panel { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); } }

/* Founders */
@media (min-width: 940px) { .founders__in { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); } }
.founders .seats { max-width: 320px; margin-block: 4px 8px; }

/* Scroll split cards: the three steps start stacked and deal out as you scroll */
.split li { background: var(--sheet); border: 2px solid var(--ink); border-radius: var(--r); padding: 22px; box-shadow: 8px 8px 0 var(--reg); }
@media (min-width: 880px) {
  .split { --split: 1; }
  .js .split li { transition: none; will-change: transform; }
  .js .split li:nth-child(1) { transform: translateX(calc((1 - var(--split)) * 104%)) rotate(calc((1 - var(--split)) * -7deg)); z-index: 1; }
  .js .split li:nth-child(2) { transform: translateY(calc((1 - var(--split)) * -14px)) rotate(calc((1 - var(--split)) * 2deg)); z-index: 3; }
  .js .split li:nth-child(3) { transform: translateX(calc((1 - var(--split)) * -104%)) rotate(calc((1 - var(--split)) * 7deg)); z-index: 2; }
  .js .split li[data-reveal]:not(.is-in) { opacity: 1; }
}

/* Industries: polaroid stack + tabs */
.ind { display: grid; gap: 36px; align-items: center; margin-top: 6px; }
@media (min-width: 940px) { .ind { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 64px; } }
.ind__stack { min-width: 0; padding-top: 28px; }
@media (max-width: 939px) { .polaroids { width: min(82%, 320px); } }
.ind__main { min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.ind .panel { grid-template-columns: 1fr; }
.polaroids { position: relative; width: min(100%, 380px); aspect-ratio: 1 / 1.12; justify-self: center; margin: 0 auto 36px; }
.polaroid { --d: 0; position: absolute; inset: 0; background: #FBFAF6; border: 2px solid var(--ink); border-radius: 4px; padding: 12px 12px 0; display: flex; flex-direction: column; cursor: pointer;
  transform: translate(calc(var(--d) * 12px), calc(var(--d) * 8px)) rotate(calc(var(--d) * 3.5deg - 3deg));
  z-index: calc(10 - var(--d)); box-shadow: 6px 6px 0 var(--reg);
  transition: transform .6s var(--spring), box-shadow .3s; }
.polaroids:hover .polaroid:not(.is-front) { transform: translate(calc(var(--d) * 20px), calc(var(--d) * 12px)) rotate(calc(var(--d) * 5deg - 3deg)); }
.polaroids { cursor: pointer; }
.polaroid.is-leaving { animation: deal .5s var(--ease); }
@keyframes deal { 0% { transform: rotate(-3deg); } 45% { transform: translate(-60%, -8%) rotate(-16deg); } 100% { transform: translate(calc(var(--d) * 12px), calc(var(--d) * 8px)) rotate(calc(var(--d) * 3.5deg - 3deg)); } }
.polaroids__hint { font-family: var(--f-mono); font-size: .66rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-soft); text-align: center; margin-top: -4px; }
.polaroid.is-front { box-shadow: 10px 10px 0 var(--reg); }
.polaroid.is-front.flip { animation: toFront .55s var(--spring); }
.polaroid__pic { flex: 1; border: 1.5px solid var(--ink); background-color: var(--paper-2); background-size: 205% 205%; background-position: var(--pos); }
:root[data-brand="a"] .polaroid__pic, :root:not([data-brand]) .polaroid__pic { background-image: url("assets/ill/industries-a.jpg"); }
:root[data-brand="b"] .polaroid__pic { background-image: url("assets/ill/industries-b.jpg"); }
.polaroid__cap { font-family: var(--f-display); font-weight: 800; font-size: 1.5rem; line-height: 1; color: #15171C; padding: 14px 4px 16px; }

/* Status button */
.sbtn { display: grid; place-items: center; }
.sbtn__label { grid-area: 1 / 1; display: inline-flex; align-items: center; gap: 10px; transition: transform .35s var(--spring), opacity .2s; }
.sbtn__label:not(.sbtn__label--idle) { opacity: 0; transform: translateY(14px); }
.sbtn[data-state="busy"] .sbtn__label--idle, .sbtn[data-state="done"] .sbtn__label--idle, .sbtn[data-state="error"] .sbtn__label--idle { opacity: 0; transform: translateY(-14px); }
.sbtn[data-state="busy"] .sbtn__label--busy, .sbtn[data-state="done"] .sbtn__label--done, .sbtn[data-state="error"] .sbtn__label--err { opacity: 1; transform: none; }
.sbtn[data-state="busy"] { cursor: progress; transform: translate(var(--off), var(--off)); box-shadow: 0 0 0 var(--plate); }
.sbtn[data-state="done"] { background: var(--ok); color: #fff; }
.sbtn__spin { width: 16px; height: 16px; border-radius: 50%; border: 2.5px solid currentColor; border-right-color: transparent; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.sbtn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 24; stroke-dashoffset: 24; }
.sbtn[data-state="done"] svg { animation: draw .45s var(--ease) .1s forwards; }

/* Launch: industries without the photo stack */
.ind--solo { grid-template-columns: minmax(0, 1fr) !important; }
@media (min-width: 900px) { .ind--solo .panel__body { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 56px; align-items: center; } }

/* Legal pages */
.legal { gap: 14px !important; }
.legal h1 { margin-top: 10px; }
.legal__meta { font-family: var(--f-mono); font-size: .74rem; color: var(--ink-soft); margin-bottom: 8px; }
.legal h2 { font-family: var(--f-body); font-size: 1.2rem; font-weight: 800; margin-top: 18px; }
.legal p, .legal li { color: var(--ink-soft); max-width: 68ch; }
.legal ul { list-style: disc; padding-left: 22px; display: flex; flex-direction: column; gap: 8px; }
.legal a { color: var(--ink); }

/* GoHighLevel form embeds (EN and ES, one shown per language) */
.form--ghl { padding: 0; overflow: hidden; background: #FFFFFF; }
.form--ghl iframe { display: block; width: 100%; min-height: 760px; border: 0; background: #FFFFFF; }
.form--ghl iframe[hidden] { display: none; }

/* Launch footer */
.foot__grid { display: grid; gap: 28px; padding-block: 44px 12px; border-top: 1px solid var(--night-rule); }
@media (min-width: 760px) { .foot__grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); } }
.foot__col { display: flex; flex-direction: column; gap: 8px; min-width: 0; font-size: .95rem; }
.foot__col h2 { font-family: var(--f-mono); font-size: .66rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--night-soft); margin: 0 0 4px; }
.foot__col a { text-decoration: none; }
.foot__col a:hover { text-decoration: underline; }
.foot__biz { font-weight: 800; }
.foot__tag { color: var(--night-soft); max-width: 34ch; }
.foot__social { margin-top: 6px; color: var(--night-soft); }

/* Reduced motion: everything visible and still */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .js [data-reveal]:not(.is-in):not([data-reveal="stamp"]), .js .stamp[data-reveal]:not(.is-in) { opacity: 1; transform: none; }
  .js .stamp[data-reveal] { transform: rotate(-3deg); }
  .js .reg[data-reveal]:not(.is-in) { --rx: .045em; --ry: .035em; }
  .js .arc { stroke-dashoffset: 0; }
  .js .ill[data-reveal="ill"] { clip-path: none; }
  .js .split li { transform: none !important; }
  .ill img { transform: none; }
  .js .seats:not(.is-in) circle { stroke-dashoffset: 0; }
  .ticker__track { animation: none; width: auto; }
  .ticker__list:last-child { display: none; }
  .ticker__list { flex-wrap: wrap; padding-inline: 16px; }
}