

*,*::before,*::after { box-sizing: border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; background:var(--ink); overflow-x:clip; }

body {
  margin:0;
  font-family:var(--font-core);
  font-size:var(--fs-body);
  line-height:var(--lh-body);
  color:var(--white);
  background:var(--ink);
  -webkit-font-smoothing:antialiased;
  
  overflow-x:clip;
}

body::before {
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:var(--void-tooth); background-size:180px 180px; opacity:.05;
}
body > * { position:relative; z-index:1; }

img,svg,video { display:block; max-width:100%; }
button,input,select,textarea { font:inherit; color:inherit; }
:focus-visible { outline:none; box-shadow:var(--focus-ring); outline-offset:var(--focus-offset); border-radius:var(--r-1); }





.stack { display:flex; flex-direction:column; gap:0; padding:0; }

.stack > .vp:first-child > .slab,
.stack > .slab:first-child { padding-top:var(--chrome-h); }

.slab {
  --slab-bg: var(--white);
  --slab-fg: var(--ink);
  position:relative;
  margin-inline:0;
  background:var(--slab-bg);
  color:var(--slab-fg);
  border-radius:0;
  overflow:hidden;
  isolation:isolate;
}
.slab__in {
  position:relative; z-index:2;
  max-width:var(--container);
  margin-inline:auto;
  padding:var(--slab-pad-y) var(--slab-pad-x);
}
.slab__in--flush { padding-inline:0; }
.slab--tight .slab__in { padding-block:clamp(32px,4vw,64px); }
.slab--flush .slab__in { padding:0; max-width:none; }

.s-white  { --slab-bg:var(--white);    --slab-fg:var(--ink); }
.s-sunken { --slab-bg:var(--ink-050);  --slab-fg:var(--ink); }
.s-cyan   { --slab-bg:var(--cyan);     --slab-fg:var(--ink); }
.s-pink   { --slab-bg:var(--pink);     --slab-fg:var(--white); }
.s-void   { --slab-bg:transparent;     --slab-fg:var(--white); }
.s-void   { border-radius:0; }

.slab p { color:color-mix(in srgb, currentColor 72%, transparent); max-width:var(--measure); }


.slab a:not(.btn):not(.card):not(.spray-cta) { color:inherit; }



.foam { display:none; }



h1,h2,h3,.display-hero,.display-l,.display-m {
  font-family:var(--font-display); font-weight:400;
  line-height:var(--lh-display); letter-spacing:-.01em;
  text-transform:uppercase; margin:0;
}
.display-hero { font-size:var(--fs-hero); }
.display-l { font-size:var(--fs-display-l); }
.display-m { font-size:var(--fs-display-m); }
h2 { font-size:var(--fs-h2); }
h3 { font-size:var(--fs-h3); }

h4,h5,h6 { line-height:var(--lh-heading); }
h4 { font-size:var(--fs-h4); }



.eyebrow {
  font-family:var(--font-core); font-size:var(--fs-eyebrow); font-weight:700;
  letter-spacing:var(--track-eyebrow); text-transform:uppercase;
  margin:0 0 var(--s-4); display:flex; align-items:center; gap:10px;
  color:var(--cyan);
}
.eyebrow::before { content:""; width:22px; height:2px; background:currentColor; flex:none; }
.eyebrow--pink{color:var(--pink)} .eyebrow--ink{color:var(--ink)} .eyebrow--white{color:var(--white)}

.lede { font-size:clamp(1.0625rem,1rem+.45vw,1.3125rem); line-height:1.5; max-width:var(--measure); margin:var(--s-5) 0 0; }
.tight { max-width:44ch; }
.hl-cyan{color:var(--cyan)} .hl-pink{color:var(--pink)}
.ast{font-size:.45em; vertical-align:super}

.head { margin-bottom:var(--s-8); }
.head p { margin-top:var(--s-4); }
.head--center { text-align:center; }
.head--center .eyebrow { justify-content:center; }
.head--center .eyebrow::after { content:""; width:22px; height:2px; background:currentColor; flex:none; }
.head--center .lede { margin-inline:auto; }


.ghost {
  position:absolute; z-index:1; pointer-events:none; user-select:none;
  font-family:var(--font-display); font-size:var(--fs-ghost); line-height:.75;
  color:rgba(0,0,0,.045); letter-spacing:-.04em;
}
.s-pink .ghost, .s-void .ghost, .s-cyan .ghost { color:rgba(255,255,255,.12); }
.s-cyan .ghost { color:rgba(0,0,0,.07); }





.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s-2);
  padding:16px var(--s-6); border-radius:var(--r-pill); border:0;
  font-family:var(--font-core);
  font-weight:700; font-size:var(--fs-small); letter-spacing:.03em; text-transform:uppercase;
  text-decoration:none; cursor:pointer; white-space:nowrap;
  transform:none;
  transition:transform var(--t-move) var(--ease), box-shadow var(--t-move) var(--ease);
}
.btn:hover, .btn:focus-visible { transform:translate(-2px,-2px); box-shadow:var(--cta-shadow); }
.btn:active { transform:translate(1px,1px); box-shadow:var(--cta-shadow-press); }
.btn--pink { background:var(--pink); color:var(--white); }
.btn--cyan { background:var(--cyan); color:var(--ink); }
.btn--ink { background:var(--ink); color:var(--white); }
.btn--white { background:var(--white); color:var(--ink); }

.btn--outline { background:transparent; color:currentColor; box-shadow:inset 0 0 0 var(--keyline) currentColor; }
.btn--outline:hover, .btn--outline:focus-visible { box-shadow:inset 0 0 0 var(--keyline) currentColor, var(--cta-shadow); }
.btn--outline:active { box-shadow:inset 0 0 0 var(--keyline) currentColor, var(--cta-shadow-press); }

.s-void, .s-pink, .footer, .calc__out {
  --cta-shadow: 7px 7px 0 var(--cyan);
  --cta-shadow-press: 2px 2px 0 var(--cyan);
}
.btn--lg { padding:20px var(--s-7); font-size:1rem; }
.btn--block { width:100%; }
.btn-row { display:flex; flex-wrap:wrap; gap:var(--s-3); margin-top:var(--s-7); }

.badge {
  display:inline-flex; align-items:center; gap:8px; padding:8px 16px; border-radius:var(--r-pill);
  font-size:var(--fs-eyebrow); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase;
  background:var(--ink); color:var(--white);
}
.badge--cyan{background:var(--cyan);color:var(--ink)}
.badge--pink{background:var(--pink);color:var(--white)}
.badge--white{background:var(--white);color:var(--ink)}



.utility {
  background:var(--cyan); color:var(--ink); height:var(--utility-h);
  display:flex; align-items:center; justify-content:center; text-align:center;
  font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; padding-inline:var(--gutter);
  overflow:hidden; transition:height .4s var(--ease), opacity .3s var(--ease);
}
.utility a { color:var(--ink); text-decoration:none; border-bottom:1px solid rgba(0,0,0,.4); }


.topnav { position:fixed; inset:0 0 auto 0; z-index:60; pointer-events:none; }
.topnav__bar {
  pointer-events:auto;
  background:var(--cyan); color:var(--ink); height:var(--utility-h);
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  padding-inline:var(--gutter); overflow:hidden;
  transition:height .4s var(--ease), opacity .3s var(--ease);
}
.topnav__bar a { color:inherit; text-decoration:none; border-bottom:1px solid rgba(0,0,0,.4); }

.topnav__pill {
  pointer-events:auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:clamp(16px,2.4vw,40px);
  height:var(--header-h);
  
  width:100%; max-width:none;
  padding-inline:max(var(--slab-pad-x), calc((100% - var(--container)) / 2 + var(--slab-pad-x)));
  background:transparent; color:var(--ink);
  transition:height .45s var(--ease), background-color .3s var(--ease);
}
.topnav__links { display:flex; align-items:center; gap:clamp(16px,2.2vw,34px); min-width:0; margin-right:auto; }
.topnav__logo { display:block; text-decoration:none; }
.topnav__actions { display:flex; align-items:center; gap:clamp(12px,1.5vw,22px); }
.topnav__link {
  color:inherit; text-decoration:none; font-size:var(--fs-small); font-weight:600;
  position:relative; padding-block:6px; white-space:nowrap;
  transition:color var(--t-colour) var(--ease);
}
.topnav__link::before {
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px; border-radius:2px;
  background:var(--pink); transform:scaleX(0); transform-origin:left;
  transition:transform var(--t-max) var(--ease);
}
.topnav__link:hover::before, .topnav__link[aria-current="page"]::before { transform:scaleX(1); }
.topnav__link:hover { color:var(--pink); }
.burger span { background:currentColor; }


.header__phone {
  color:var(--ink); background:var(--cyan); text-decoration:none;
  font-weight:700; font-size:var(--fs-small); white-space:nowrap;
  padding:10px 18px; border-radius:var(--r-pill);
  animation:phonepulse 2.4s ease-out infinite;
}
.header__phone:hover { background:var(--cyan-press); color:var(--ink); }
@keyframes phonepulse {
  0% { box-shadow:0 0 0 0 rgba(5,168,236,.55); }
  70%,100% { box-shadow:0 0 0 12px rgba(5,168,236,0); }
}


.phone-ring { display:inline-flex; flex-direction:column; align-items:center; gap:4px; text-decoration:none; color:inherit; }
.phone-ring svg { width:clamp(112px,11vw,148px); height:auto; overflow:visible; }
.phone-ring__spin { transform-origin:60px 60px; animation:ringspin 16s linear infinite; }
.phone-ring:hover .phone-ring__spin { animation-duration:6s; }
.phone-ring text { font-family:var(--font-core); font-size:11.5px; font-weight:700; letter-spacing:.14em; fill:var(--pink); }
.phone-ring__num { font-family:var(--font-display); font-size:1.375rem; letter-spacing:.02em; text-decoration:none; }
@keyframes ringspin { to { transform:rotate(360deg); } }


.topnav .logo-chip {
  background:none; box-shadow:none; border-radius:0; padding:0;
  width:auto; height:86px; transform:none;
  transition:height .45s var(--ease), transform var(--t-move) var(--ease);
}
.topnav .logo-chip img { height:100%; width:auto; }
.topnav .topnav__logo:hover .logo-chip { transform:rotate(-2deg); }


.topnav.is-scrolled .topnav__bar { height:0; opacity:0; }
.topnav.is-scrolled .topnav__pill {
  height:62px;
  background:var(--white); color:var(--ink);
  border-radius:0; box-shadow:none;
  border-bottom:1px solid rgba(0,0,0,.08);
}
.topnav.is-scrolled .logo-chip { height:50px; }

@media (max-width:1079px){
  .topnav__links { display:none; }
  .topnav__actions .topnav__link { display:none; }
  .topnav__pill { justify-content:space-between; }
  .topnav .burger { display:flex; }
}
@media (max-width:767px){
  .topnav__bar .u-long { display:none; }
  .topnav__actions > .btn { display:none; }
}

.burger { display:none; width:44px; height:44px; background:transparent; border:0; cursor:pointer; flex-direction:column; justify-content:center; align-items:center; gap:5px; }
.burger span { width:22px; height:2px; background:var(--white); transition:transform var(--t-move) var(--ease), opacity var(--t-colour) var(--ease); }
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.mobile-nav { position:fixed; inset:var(--chrome-h) 0 0 0; background:var(--ink); z-index:55; padding:var(--s-7) var(--gutter); display:none; flex-direction:column; gap:var(--s-2); overflow-y:auto; }
.mobile-nav.is-open { display:flex; }
.mobile-nav a { color:var(--white); text-decoration:none; font-family:var(--font-display); font-size:2.25rem; text-transform:uppercase; padding-block:var(--s-3); border-bottom:1px solid var(--void-line); }
.mobile-nav .btn { margin-top:var(--s-5); }
@media (max-width:1079px){ .nav,.header__phone{display:none} .burger{display:flex} }



.hero { position:relative; }
.hero__grid { display:grid; grid-template-columns:1.06fr .94fr; gap:var(--s-7); align-items:center; }
.hero h1 { margin-top:var(--s-5); }
.hero__lede { max-width:40ch; }
.hero__art { position:relative; justify-self:end; width:100%; }
.hero__foamie { width:100%; will-change:transform; }
@media (max-width:1023px){
  .hero__grid { grid-template-columns:1fr; }
  .hero__art { max-width:440px; justify-self:center; }
}

.trust {
  display:flex; flex-wrap:wrap; gap:var(--s-3) var(--s-6); list-style:none; padding:var(--s-5) 0 0; margin:var(--s-6) 0 0;
  border-top:1px solid color-mix(in srgb, currentColor 16%, transparent);
  font-size:var(--fs-micro); font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:color-mix(in srgb, currentColor 62%, transparent);
}
.trust li { display:flex; align-items:center; gap:8px; }
.trust li::before { content:""; width:6px; height:6px; background:var(--pink); border-radius:50%; flex:none; }



.scrub { position:relative; aspect-ratio:800/520; border-radius:var(--r-3); overflow:hidden; background:var(--ink); touch-action:pan-y; user-select:none; cursor:ew-resize; }
.scrub__layer svg { width:100%; height:100%; }
.scrub svg { display:block; width:100%; height:auto; }
.scrub__layer { position:absolute; inset:0; }
.scrub__layer--after { clip-path:inset(0 0 0 var(--pos,50%)); }
.scrub__bar { position:absolute; top:0; bottom:0; left:var(--pos,50%); width:3px; background:var(--white); z-index:8; pointer-events:none; }
.scrub__knob {
  position:absolute; top:50%; left:var(--pos,50%); transform:translate(-50%,-50%); z-index:6;
  width:56px; height:56px; border-radius:50%; background:var(--white); color:var(--ink); z-index:9;
  display:grid; place-items:center; font-size:14px; font-weight:900; letter-spacing:.06em;
  box-shadow:0 0 0 4px rgba(0,0,0,.25); pointer-events:none;
}
.scrub__tag {
  position:absolute; top:16px; z-index:6; padding:7px 14px; border-radius:var(--r-pill);
  font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase;
}
.scrub__tag--before { left:16px; background:var(--pink); color:var(--white); }
.scrub__tag--after  { right:16px; background:var(--cyan); color:var(--ink); }



.calc { display:grid; grid-template-columns:1fr 1fr; gap:var(--s-8); align-items:center; }
@media (max-width:899px){ .calc{grid-template-columns:1fr; gap:var(--s-7)} }
.calc__controls { display:flex; flex-direction:column; gap:var(--s-6); }
.slider label { display:flex; justify-content:space-between; align-items:baseline; font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase; margin-bottom:var(--s-3); }
.slider output { font-family:var(--font-display); font-size:1.5rem; letter-spacing:0; }
input[type=range] { -webkit-appearance:none; appearance:none; width:100%; height:4px; background:rgba(0,0,0,.18); border-radius:2px; outline:none; }
.s-pink input[type=range], .s-void input[type=range] { background:rgba(255,255,255,.24); }
input[type=range]::-webkit-slider-thumb { -webkit-appearance:none; width:26px; height:26px; border-radius:50%; background:var(--ink); cursor:grab; border:3px solid var(--white); }
input[type=range]::-moz-range-thumb { width:26px; height:26px; border-radius:50%; background:var(--ink); cursor:grab; border:3px solid var(--white); }
.calc__out { text-align:center; padding:var(--s-7) var(--s-5); border-radius:var(--r-3); background:var(--ink); color:var(--white); }
.calc__money { font-family:var(--font-display); font-size:var(--fs-stat); line-height:.9; color:var(--cyan); display:block; font-variant-numeric:tabular-nums; }
.calc__sub { font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase; color:var(--on-void); margin-top:var(--s-3); }


.era { border:0; padding:0; margin:0; min-width:0; }
.era__legend { display:flex; justify-content:space-between; align-items:baseline; gap:var(--s-4); width:100%; padding:0; margin-bottom:var(--s-3); font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase; }
.era__opts { display:flex; gap:6px; flex-wrap:wrap; }
.era__opt { position:relative; flex:1; }
.era__opt input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.era__pill {
  display:flex; align-items:center; justify-content:center; gap:6px; padding:6px 11px 6px 9px; white-space:nowrap;
  border:2px solid rgba(0,0,0,.3); border-radius:var(--r-pill);
  font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase;
  cursor:pointer; user-select:none;
  transition:background var(--t-colour) var(--ease), color var(--t-colour) var(--ease),
             border-color var(--t-colour) var(--ease), transform var(--t-move) var(--ease),
             box-shadow var(--t-move) var(--ease);
}
.era__pill svg { width:20px; height:22px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.era__leak { opacity:.9; }
.era__opt:hover .era__pill { border-color:var(--ink); transform:translateY(-2px); }
.era__opt input:checked + .era__pill {
  background:var(--ink); border-color:var(--ink); color:var(--white);
  transform:translateY(-2px); box-shadow:4px 4px 0 rgba(0,0,0,.28);
}
.era__opt input:checked + .era__pill .era__leak { stroke:var(--cyan); animation:era-leak 1.1s var(--ease) infinite alternate; }
.era__opt input:focus-visible + .era__pill { outline:3px solid var(--ink); outline-offset:2px; }
@keyframes era-leak { from { transform:translateY(0); opacity:.55; } to { transform:translateY(-1.6px); opacity:1; } }


.calc__out { position:relative; }
@media (min-width:1024px) and (min-height:620px) {
  .calc__out {
    transform:rotate(-1.2deg); transform-origin:50% -120px;
    
    translate:0 var(--drop, 0px); scale:var(--grow, 1); will-change:translate, scale;
    
    transition:translate 180ms linear, scale 180ms linear;
  }
  .calc__out.is-hung { animation:calc-sway 5s ease-in-out infinite alternate; }
  .calc__out::before { 
    content:""; position:absolute; bottom:100%; left:50%; margin-left:-1.5px;
    width:3px; height:100vh;
    background:repeating-linear-gradient(180deg, var(--ink) 0 7px, rgba(0,0,0,.5) 7px 14px);
  }
  .calc__out::after { 
    content:""; position:absolute; top:-9px; left:50%; margin-left:-9px;
    width:18px; height:18px; border-radius:50%;
    background:var(--ink-050); border:4px solid var(--ink);
  }
}

@keyframes calc-sway {
  from { transform:rotate(-1.2deg); }
  to   { transform:rotate(2.2deg); }
}
.calc__label {
  display:inline-block; background:var(--white); color:var(--ink);
  padding:7px 16px; border-radius:var(--r-pill);
  font-size:var(--fs-micro); font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  margin:0 0 var(--s-4);
}
.calc__out .calc__label { color:var(--ink); }

.calc__out .btn { --cta-shadow:7px 7px 0 var(--white); --cta-shadow-press:2px 2px 0 var(--white); }
.calc__per {
  display:block; margin-top:var(--s-2);
  font-size:0.75rem; letter-spacing:.04em; line-height:1.4;
  color:rgba(255,255,255,.62);
}
.calc__out .calc__sub {
  border-top:1px dashed rgba(255,255,255,.28); padding-top:var(--s-4); margin-top:var(--s-4);
  display:flex; justify-content:center; align-items:baseline;
  font-size:0.6875rem; letter-spacing:.14em; line-height:1.5;
  color:var(--pink); font-weight:700;
}
.calc__out .calc__sub b { font-weight:700; color:var(--white); margin-left:.35em; font-variant-numeric:tabular-nums; }
.calc__sep { width:4px; height:4px; border-radius:50%; background:var(--pink); margin:0 10px; align-self:center; flex:none; }
.calc__fine {
  margin:14px auto 0; max-width:36ch;
  font-size:0.6875rem; line-height:1.55; letter-spacing:.015em;
  color:rgba(255,255,255,.48);
}




.chip-figure {
  --chip: var(--cyan);
  background:var(--chip); border-radius:var(--r-slab); padding:var(--s-5);
  box-shadow:var(--offset-chip) var(--offset-chip) 0 var(--ink);
  transform:rotate(-2.5deg);
  transition:transform var(--t-move) var(--ease), box-shadow var(--t-move) var(--ease);
}
.chip-figure--pink{--chip:var(--pink)} .chip-figure--white{--chip:var(--white)}
.chip-figure--r{transform:rotate(2.5deg)}
.chip-figure:hover { transform:rotate(0deg) translateY(-4px); box-shadow:12px 12px 0 var(--ink); }
.chip-figure img { width:100%; }
.s-void .chip-figure { box-shadow:var(--offset-chip) var(--offset-chip) 0 var(--white); }
.s-void .chip-figure:hover { box-shadow:12px 12px 0 var(--white); }

.sticker-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:var(--s-6); }
.sticker { text-align:center; }
.sticker h3 { font-family:var(--font-core); font-weight:700; font-size:var(--fs-h4); text-transform:none; letter-spacing:0; margin:var(--s-5) 0 4px; }
.sticker p { font-size:var(--fs-small); margin:0 auto; max-width:24ch; }



.wall { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:0; }
.wallcard { position:relative; padding:var(--s-7) var(--s-6); border-top:2px solid; border-color:color-mix(in srgb, currentColor 18%, transparent); overflow:hidden; transition:background-color var(--t-colour) var(--ease); }
.wallcard:hover { background:color-mix(in srgb, currentColor 6%, transparent); }
.wallcard__n { font-family:var(--font-display); font-size:clamp(3.5rem,6vw,5.5rem); line-height:.8; color:var(--cyan); display:block; }
.s-cyan .wallcard__n { color:var(--ink); }
.wallcard h3 { font-family:var(--font-core); font-weight:700; font-size:var(--fs-h4); text-transform:none; letter-spacing:0; margin:var(--s-5) 0 var(--s-2); }
.wallcard p { font-size:var(--fs-small); margin:0; }



.data { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:var(--s-7) var(--s-6); }
.datum__v { font-family:var(--font-display); font-size:var(--fs-stat); line-height:.85; display:block; font-variant-numeric:tabular-nums; }
.datum h3 { font-family:var(--font-core); font-weight:700; font-size:var(--fs-h4); text-transform:none; letter-spacing:0; margin:var(--s-4) 0 var(--s-2); }
.datum p { font-size:var(--fs-small); margin:0; max-width:24ch; }



.promise { display:grid; grid-template-columns:repeat(auto-fit,minmax(185px,1fr)); gap:var(--s-6) var(--s-5); }
.promise__i { border-left:var(--rule-heavy) solid var(--pink); padding-left:var(--s-5); }
.s-pink .promise__i { border-color:var(--white); }
.promise__i h3 { font-family:var(--font-core); font-weight:700; font-size:var(--fs-h4); text-transform:none; letter-spacing:0; margin:0 0 var(--s-2); }
.promise__i p { font-size:var(--fs-small); margin:0; }
.promise--duo { grid-template-columns:repeat(2,1fr); }
@media (max-width:599px){ .promise--duo{grid-template-columns:1fr} }



.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:var(--s-5); }
.card {
  display:flex; flex-direction:column; background:var(--white); color:var(--ink);
  border-radius:var(--r-3); overflow:hidden; text-decoration:none;
  box-shadow:var(--shadow-card);
  transition:transform var(--t-move) var(--ease), box-shadow var(--t-move) var(--ease);
}
.s-white .card, .s-sunken .card { box-shadow:0 0 0 1px var(--ink-100); }
.card:hover, .card:focus-visible { transform:translate(-4px,-4px); box-shadow:0 0 0 1px var(--ink), var(--offset-chip) var(--offset-chip) 0 var(--ink); }
.card:focus-visible { box-shadow:var(--focus-ring), var(--offset-chip) var(--offset-chip) 0 var(--ink); }
.card:active { transform:translate(-1px,-1px); box-shadow:0 0 0 1px var(--ink), 3px 3px 0 var(--ink); }
.s-void .card:hover, .s-pink .card:hover { box-shadow:0 0 0 1px var(--cyan), var(--offset-chip) var(--offset-chip) 0 var(--cyan); }
.card:hover .card__go, .card:focus-visible .card__go { background:var(--ink); color:var(--white); }
.card:hover .card__go span, .card:focus-visible .card__go span { transform:translateX(4px); }
.card__media { aspect-ratio:4/3; background:var(--ink-050); overflow:hidden; position:relative; border-bottom:var(--keyline) solid var(--ink); }
.card__media img { width:100%; height:100%; object-fit:cover; transition:transform var(--t-max) var(--ease-out); }
.card:hover .card__media img, .card:focus-visible .card__media img { transform:scale(1.05); }
.card__body { padding:var(--s-5); display:flex; flex-direction:column; gap:var(--s-2); flex:1; }
.card h3 { font-family:var(--font-core); font-weight:700; font-size:var(--fs-h4); text-transform:none; letter-spacing:0; }
.card p { font-size:var(--fs-small); margin:0; flex:1; color:var(--ink-600); }
.card__go {
  align-self:flex-start; display:inline-flex; align-items:center; gap:10px;
  margin-top:var(--s-3); padding:10px 18px; border-radius:var(--r-pill);
  box-shadow:inset 0 0 0 var(--keyline) var(--ink);
  font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase;
  transition:background var(--t-colour) var(--ease), color var(--t-colour) var(--ease);
}
.card__go span { transition:transform var(--t-move) var(--ease); }



.marquee { overflow:hidden; padding-block:clamp(18px,1.7vw,26px); background:var(--ink); color:var(--white); }
.marquee--cyan { background:var(--cyan); color:var(--ink); }
.marquee__track { display:flex; width:max-content; animation:marquee var(--marquee-loop) linear infinite; }
.marquee__g { display:flex; align-items:center; gap:var(--s-6); padding-right:var(--s-6); font-family:var(--font-display); font-size:clamp(1.125rem, 0.8rem + 1vw, 1.75rem); line-height:1.1; letter-spacing:.01em; text-transform:uppercase; white-space:nowrap; }
.marquee__g span::after { content:"•"; color:var(--cyan); margin-left:var(--s-6); }
.marquee--cyan .marquee__g span::after { color:var(--white); }
@keyframes marquee { to { transform:translateX(-50%); } }



.swipe {
  display:grid; grid-auto-flow:column; grid-auto-columns:clamp(264px,27vw,344px); gap:var(--s-5);
  overflow-x:auto; scroll-snap-type:x mandatory;
  
  padding:10px var(--slab-pad-x) var(--s-5) 10px;
  margin:-10px calc(var(--slab-pad-x) * -1) 0 -10px;
  scroll-padding-left:10px;
  scrollbar-width:none;
}
.swipe::-webkit-scrollbar{display:none}
.swipe > * { scroll-snap-align:start; }
.rail { height:var(--rule-heavy); background:color-mix(in srgb, currentColor 14%, transparent); position:relative; margin-top:var(--s-4); }
.rail__bar { position:absolute; inset-block:0; left:0; background:var(--pink); transition:width var(--t-move) var(--ease), transform var(--t-move) var(--ease); }
.hint { display:flex; justify-content:space-between; align-items:baseline; gap:var(--s-4); font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase; margin-top:var(--s-3); opacity:.62; }
.s-cyan .card { box-shadow:none; }
.s-cyan .card:hover { box-shadow:0 0 0 1px var(--ink), var(--offset-chip) var(--offset-chip) 0 var(--ink); }




.swipe-nav { display:flex; justify-content:center; gap:var(--s-4); margin-top:var(--s-4); }
.swipe-nav__b {
  width:56px; height:56px; border-radius:50%; border:0; padding:0; cursor:pointer;
  background:var(--white); color:var(--ink);
  box-shadow:inset 0 0 0 var(--keyline) var(--ink), 4px 4px 0 var(--ink);
  font-size:22px; font-weight:700; line-height:1; display:grid; place-items:center;
  transition:transform var(--t-move) var(--ease), box-shadow var(--t-move) var(--ease), opacity var(--t-colour) var(--ease);
}
.swipe-nav__b--prev { transform:rotate(-8deg); }
.swipe-nav__b--next { transform:rotate(8deg); }
.swipe-nav__b:hover { transform:rotate(0deg) translate(-2px,-2px); box-shadow:inset 0 0 0 var(--keyline) var(--ink), 7px 7px 0 var(--ink); }
.swipe-nav__b:active { transform:rotate(0deg) translate(1px,1px); box-shadow:inset 0 0 0 var(--keyline) var(--ink), 2px 2px 0 var(--ink); }
.swipe-nav__b.is-off { opacity:.35; pointer-events:none; }



.acc { border-top:1px solid color-mix(in srgb, currentColor 16%, transparent); }
.acc__i { border-bottom:1px solid color-mix(in srgb, currentColor 16%, transparent); }
.acc__b { width:100%; background:none; border:0; text-align:left; padding:var(--s-5) 0; display:flex; justify-content:space-between; align-items:center; gap:var(--s-5); cursor:pointer; font-size:var(--fs-h4); font-weight:700; color:inherit; transition:color var(--t-colour) var(--ease); }
.acc__b:hover { color:var(--pink); }
.s-pink .acc__b:hover { color:var(--ink); }
.acc__s { flex:none; width:22px; height:22px; position:relative; transition:transform var(--t-move) var(--ease); }
.acc__s::before,.acc__s::after { content:""; position:absolute; background:currentColor; border-radius:1px; }
.acc__s::before { inset:10px 0; height:2px; }
.acc__s::after { inset:0 10px; width:2px; }
.acc__b[aria-expanded="true"] .acc__s { transform:rotate(45deg); }
.acc__p { display:grid; grid-template-rows:0fr; transition:grid-template-rows var(--t-max) var(--ease); }
.acc__p[data-open="true"] { grid-template-rows:1fr; }
.acc__p > div { overflow:hidden; }
.acc__p p { margin:0 0 var(--s-5); }


.s-cyan .acc { border-top-color:rgba(0,0,0,.26); }
.s-cyan .acc__i { border-bottom-color:rgba(0,0,0,.26); }
.s-cyan .acc__b:hover { color:var(--white); }
.s-cyan .acc__p p { color:rgba(0,0,0,.74); }
.s-cyan .acc__p strong { color:var(--ink); }

.faq-link { font-weight:700; color:var(--white); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:2px; }
.faq-link:hover { color:var(--ink); }

.faq-slab .lede { color:rgba(0,0,0,.74); }
.faq-slab .faq-foamie { filter:drop-shadow(0 12px 28px rgba(0,0,0,.18)); }
.faq-slab .slab__in { padding-block:var(--slab-pad-y); }

.faq-slab { --cta-shadow:7px 7px 0 var(--pink); --cta-shadow-press:2px 2px 0 var(--pink); }


.faq-slab { overflow:clip; }
@media (min-width:900px){
  .faq-aside {
    position:sticky;
    top:calc(var(--chrome-h) + var(--s-5));
    align-self:start;
  }
  
  .faq-slab .acc { --acc-pad:clamp(22px,2.5vw,32px); }
  .faq-slab .acc__b { padding-block:var(--acc-pad); }
  
  .faq-slab .acc { margin-top:calc(var(--acc-pad) * -1); }
}



.mscroll { overflow-x:auto; margin-inline:calc(var(--slab-pad-x) * -1); padding-inline:var(--slab-pad-x); }
.matrix { border-collapse:collapse; width:100%; min-width:800px; font-size:var(--fs-small); }
.matrix th,.matrix td { text-align:left; padding:var(--s-4); border-bottom:1px solid color-mix(in srgb, currentColor 14%, transparent); vertical-align:top; }
.matrix thead th { font-family:var(--font-display); font-size:1.25rem; text-transform:uppercase; border-bottom:3px solid currentColor; }
.matrix tbody th { font-weight:700; font-size:var(--fs-micro); letter-spacing:var(--track-eyebrow); text-transform:uppercase; width:150px; opacity:.6; }
.matrix .win { color:var(--pink); font-weight:700; }
.matrix .go { color:var(--pink); font-weight:700; text-decoration:none; }
.matrix .go:hover { text-decoration:underline; }



.field { display:flex; flex-direction:column; gap:6px; }
.field label { font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase; opacity:.66; }
.field input,.field select,.field textarea {
  width:100%; padding:15px var(--s-4); border:var(--keyline) solid var(--ink-100);
  border-radius:var(--r-2); background:var(--white); color:var(--ink);
  transition:border-color var(--t-colour) var(--ease);
}
.field input:hover,.field select:hover { border-color:var(--ink-400); }
.field input:focus,.field select:focus,.field textarea:focus { outline:none; border-color:var(--ink); box-shadow:var(--focus-ring); outline-offset:var(--focus-offset); }
.field select { appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%); background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%; background-size:6px 6px; background-repeat:no-repeat; }

.form-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--s-4); }
.form-grid > .field { min-width:0; }
.form-grid .span-2 { grid-column:1/-1; }
@media (max-width:599px){ .form-grid{grid-template-columns:1fr} }
.consent { display:flex; gap:10px; align-items:flex-start; font-size:12px; line-height:1.45; opacity:.75; }
.consent input { width:18px; height:18px; margin:2px 0 0; accent-color:var(--cyan); flex:none; }
.panel { background:var(--white); color:var(--ink); border-radius:var(--r-3); padding:clamp(24px,3vw,40px); box-shadow:var(--offset-chip) var(--offset-chip) 0 var(--cyan); }
.panel--pink { box-shadow:var(--offset-chip) var(--offset-chip) 0 var(--pink); }
.panel p { color:var(--ink-600); }
.form-note { font-size:12px; text-align:center; margin:var(--s-3) 0 0; opacity:.7; }

.chips { display:flex; flex-wrap:wrap; gap:var(--s-2); }
.chip { position:relative; }
.chip input { position:absolute; opacity:0; inset:0; cursor:pointer; }
.chip span { display:block; padding:10px var(--s-4); border-radius:var(--r-pill); box-shadow:inset 0 0 0 var(--keyline) var(--ink-100); font-size:var(--fs-small); font-weight:600; cursor:pointer; transition:background-color var(--t-colour) var(--ease), box-shadow var(--t-colour) var(--ease), color var(--t-colour) var(--ease); }
.chip input:hover + span { box-shadow:inset 0 0 0 var(--keyline) var(--ink); }
.chip input:checked + span { background:var(--ink); color:var(--white); box-shadow:inset 0 0 0 var(--keyline) var(--ink); }
.chip input:focus-visible + span { box-shadow:var(--focus-ring); }



.split { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:var(--s-8); align-items:center; }
.split--start { align-items:start; }
.split--wide { grid-template-columns:1.12fr .88fr; }
@media (max-width:899px){ .split--wide{grid-template-columns:1fr} }


.shot { position:relative; border-radius:var(--r-3); overflow:hidden; background:var(--ink-050); }
.shot img { width:100%; height:auto; display:block; }
.shot--fill { height:100%; }
.shot--fill img { height:100%; object-fit:cover; }
.band { position:relative; overflow:hidden; }
.band img { width:100%; height:clamp(280px,42vw,560px); object-fit:cover; }
.band__over { position:absolute; inset:auto 0 0 0; padding:var(--s-8) var(--slab-pad-x) var(--s-7); background:linear-gradient(to top, rgba(0,0,0,.86), rgba(0,0,0,0)); color:var(--white); }
.band__over .in { max-width:var(--container); margin-inline:auto; }



.ph {
  border:2px dashed var(--cyan); border-radius:var(--r-3); background:rgba(5,168,236,.07);
  display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center;
  gap:8px; padding:var(--s-6); min-height:190px; color:var(--cyan);
}
.ph__l { font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase; }
.ph__b { font-size:12px; max-width:34ch; line-height:1.45; color:color-mix(in srgb, currentColor 62%, transparent); }
.s-void .ph__b, .s-pink .ph__b { color:var(--on-void); }
.ph--4x3{aspect-ratio:4/3} .ph--16x9{aspect-ratio:16/9} .ph--1x1{aspect-ratio:1/1} .ph--3x4{aspect-ratio:3/4}




.sticky-cta {
  position:fixed; right:var(--s-5); bottom:var(--s-5); z-index:45;
  display:flex; flex-direction:column; align-items:flex-end;
  background:none; border:0; padding:0; cursor:pointer;
  opacity:0; transform:translateY(14px); pointer-events:none;
  transition:opacity var(--t-move) var(--ease), transform var(--t-move) var(--ease);
}
.sticky-cta.is-shown { opacity:1; transform:none; pointer-events:auto; }


.sticky-cta__say {
  position:absolute; right:0; bottom:calc(100% - 16px);
  width:clamp(228px,22vw,292px);
  opacity:0; transform:translateY(12px) scale(.94);
  transform-origin:bottom right; pointer-events:none;
  transition:opacity .26s var(--ease), transform .32s var(--ease-out);
}
.sticky-cta:hover .sticky-cta__say,
.sticky-cta:focus-visible .sticky-cta__say {
  opacity:1; transform:none;
  animation:ctabob 3.2s var(--ease) .32s infinite;
}

.sticky-cta.is-shown .sticky-cta__say,
.sticky-cta:hover .sticky-cta__say { pointer-events:auto; }


@media (hover:none) {
  .sticky-cta__say { opacity:1; transform:none; animation:none; }
}
.sticky-cta__cloudsvg { display:block; width:100%; height:auto; overflow:visible; }
.cloud-rim  { fill:var(--ink); stroke:var(--ink); stroke-width:7; stroke-linejoin:round; }
.cloud-fill { fill:var(--white); }
.sticky-cta__cloudtext {
  position:absolute; left:0; right:0; top:4%; height:72%;
  display:grid; place-content:center; text-align:center;
  padding-inline:12%;
  color:var(--ink); font-size:clamp(.8125rem,1vw,1rem); font-weight:700;
  line-height:1.2; letter-spacing:.03em; text-transform:uppercase;
}

.sticky-cta__cloudtext > span { display:block; white-space:nowrap; }
.sticky-cta__cloudtext b { color:var(--pink); }

.sticky-cta__mascot {
  width:clamp(84px,8vw,116px); height:auto; display:block;
  filter:drop-shadow(0 10px 16px rgba(0,0,0,.4));
  transform-origin:bottom center;
  transition:transform var(--t-max) var(--ease-out);
}
.sticky-cta:hover .sticky-cta__mascot { transform:translateY(-9px) rotate(-5deg); }
.sticky-cta:focus-visible .sticky-cta__cloudsvg { outline:3px solid var(--cyan); outline-offset:2px; border-radius:20px; }

@keyframes ctabob { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }

.sticky-cta__mascot {
  width:clamp(84px,8vw,116px); height:auto; display:block;
  filter:drop-shadow(0 10px 16px rgba(0,0,0,.4));
  transform-origin:bottom center;
  transition:transform var(--t-max) var(--ease-out);
}
.drawer-scrim { position:fixed; inset:0; background:rgba(0,0,0,.62); opacity:0; pointer-events:none; z-index:70; transition:opacity var(--t-move) var(--ease); }
.drawer-scrim.is-open { opacity:1; pointer-events:auto; }
.drawer { position:fixed; top:0; right:0; bottom:0; width:min(460px,100%); background:var(--white); color:var(--ink); z-index:75; transform:translateX(100%); transition:transform var(--t-max) var(--ease); overflow-y:auto; padding:var(--s-7) var(--s-6) var(--s-8); }
.drawer.is-open { transform:none; }
.drawer p { color:var(--ink-600); }
.drawer__x { position:absolute; top:var(--s-4); right:var(--s-4); width:40px; height:40px; border-radius:50%; border:0; background:var(--ink-050); cursor:pointer; font-size:20px; line-height:1; transition:background-color var(--t-colour) var(--ease); }
.drawer__x:hover { background:var(--ink-100); }
@media (max-width:767px){
  .sticky-cta { right:12px; bottom:12px; }
  .sticky-cta__mascot { width:74px; }
  .sticky-cta__say { width:190px; }
  .sticky-cta__cloudtext { font-size:12px; }
  .drawer { width:100%; }
}



.footer {
  position:relative;
  padding:clamp(48px,5vw,72px) 0 var(--s-5);
  isolation:isolate;
}


.footer::after {
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(110% 74% at 6% 0%, rgba(5,168,236,.13), transparent 60%);
}
.footer .in {
  position:relative; z-index:1;
  max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter);
}

.footer .in::after {
  content:"iFOAM"; position:absolute; right:-.02em; bottom:0; z-index:-1;
  font-family:var(--font-display); font-size:clamp(4rem,10vw,9.5rem); line-height:.72;
  letter-spacing:-.012em; color:rgba(255,255,255,.026);
  pointer-events:none; user-select:none; -webkit-user-select:none;
}

.footer__grid { display:grid; grid-template-columns:1.35fr 1fr 1fr 1fr; gap:var(--s-6) var(--s-6); align-items:start; }


.footer .logo-chip--flat { transition:transform var(--t-move) var(--ease-out); }
.footer .logo:hover .logo-chip--flat { transform:translateY(-3px) rotate(-1.5deg); }
.footer__grid > div:first-child > p:first-of-type {
  font-size:var(--fs-body) !important; line-height:1.5;
  color:rgba(255,255,255,.82); max-width:30ch !important;
}

.footer__grid > div:first-child > p:last-of-type {
  display:inline-block; margin-top:var(--s-4) !important;
  padding:14px 20px 16px; border-radius:var(--r-3);
  border:2px solid var(--void-line); background:rgba(255,255,255,.035);
  line-height:1.5; color:var(--on-void);
  transition:border-color var(--t-move) var(--ease), background-color var(--t-move) var(--ease), transform var(--t-move) var(--ease-out);
}
.footer__grid > div:first-child > p:last-of-type:hover {
  border-color:var(--cyan); background:rgba(5,168,236,.08); transform:translateY(-2px);
}
.footer a[href^="tel:"] {
  font-family:var(--font-display); font-size:1.5rem; letter-spacing:.01em;
  display:inline-block; margin-top:8px;
  transition:color var(--t-colour) var(--ease);
}
.footer a[href^="tel:"]:hover { color:var(--white) !important; }


.footer .footer__k {
  position:relative; font-size:var(--fs-micro); font-weight:800; line-height:var(--lh-heading);
  letter-spacing:var(--track-eyebrow); text-transform:uppercase; color:var(--cyan);
  margin:0 0 var(--s-5); padding-bottom:12px;
}
.footer .footer__k::after {
  content:""; position:absolute; left:0; bottom:0; width:26px; height:2px; background:var(--pink);
}
.footer ul { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px; }
.footer a { color:var(--on-void); text-decoration:none; font-size:var(--fs-small); transition:color var(--t-colour) var(--ease); }
.footer li a {
  position:relative; display:inline-block;
  transition:color var(--t-colour) var(--ease), transform var(--t-move) var(--ease-out);
}
.footer li a::before {
  content:""; position:absolute; left:-14px; top:50%; width:6px; height:6px; margin-top:-3px;
  border-radius:50%; background:var(--pink); opacity:0; transform:scale(.3);
  transition:opacity var(--t-move) var(--ease), transform var(--t-move) var(--ease-out);
}
.footer li a:hover { color:var(--white); transform:translateX(13px); }
.footer li a:hover::before { opacity:1; transform:none; }
.footer p { color:var(--on-void); }


.footer__meta {
  margin-top:var(--s-6); padding-top:var(--s-5);
  border-top:1px solid var(--void-line);
  display:flex; flex-wrap:wrap; gap:var(--s-3) var(--s-5); justify-content:space-between;
  font-size:12px; letter-spacing:.01em; color:var(--on-void-dim);
}
.footer__legal {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 14px; border-radius:var(--r-pill);
  border:1px solid var(--void-line); background:rgba(255,255,255,.03);
}
.footer__legal a { font-size:12px; color:var(--on-void-dim); }
.footer__legal a:hover { color:var(--cyan); }
.footnote { font-size:11px; line-height:1.55; color:var(--on-void-dim); margin-top:var(--s-4); max-width:none; }

@media (prefers-reduced-motion: reduce) {
  .footer li a, .footer li a::before, .footer .logo-chip--flat,
  .footer__grid > div:first-child > p:last-of-type { transition:none !important; transform:none !important; }
}
@media (max-width:899px){
  .footer__grid{ grid-template-columns:1fr 1fr; }
  .footer .in::after { font-size:clamp(3.5rem,16vw,7rem); }
}
@media (max-width:519px){
  .footer__grid{ grid-template-columns:1fr; }
  .footer__meta { justify-content:flex-start; }
}



[data-reveal]:not(.foam) { opacity:0; transform:translateY(18px); }
[data-reveal]:not(.foam).is-in { opacity:1; transform:none; transition:opacity var(--t-slab) var(--ease-out), transform var(--t-slab) var(--ease-out); }

@media (max-width:767px){
  .utility .u-long { display:none; }
  .header__cta > .btn { display:none; }
  .header__phone { display:inline; }
  .btn-row { flex-direction:column; align-items:stretch; }
  .btn-row .btn { width:100%; }
  body { padding-bottom:74px; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  [data-reveal] { opacity:1 !important; transform:none !important; }
  html { scroll-behavior:auto; }
}


.calc__out p, .calc__out .eyebrow { color:var(--white); }
.calc__out .calc__sub { color:rgba(255,255,255,.55); }
.calc__out .calc__fine { color:rgba(255,255,255,.48); }

.ghost { opacity:.9; }
.s-pink .ghost { color:rgba(255,255,255,.10); }


.hero__art { display:flex; justify-content:flex-end; align-items:flex-end; }
.hero__foamie { width:auto; max-width:100%; max-height:min(72vh,700px); margin-left:auto; }
.hero .slab__in { padding-block:clamp(36px,4vw,64px) 0; }
@media (max-width:1023px){ .hero__art{justify-content:center} .hero__foamie{max-height:52vh} }



.stepbar { display:flex; flex-wrap:wrap; gap:var(--s-3); align-items:center; margin-bottom:var(--s-7); }
.stepbar__i { display:inline-flex; align-items:center; padding:9px 18px; border-radius:var(--r-pill); font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase; background:color-mix(in srgb, currentColor 8%, transparent); opacity:.5; transition:background-color var(--t-colour) var(--ease), opacity var(--t-colour) var(--ease), color var(--t-colour) var(--ease); }
.stepbar__i[data-state="current"] { background:var(--cyan); color:var(--ink); opacity:1; }
.stepbar__i[data-state="done"] { background:var(--ink); color:var(--white); opacity:1; }
.stepbar__sep { opacity:.35; }
.wstep[hidden] { display:none; }
.optgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:var(--s-4); }
.opt { position:relative; }
.opt input { position:absolute; opacity:0; inset:0; cursor:pointer; }
.opt > span { display:block; height:100%; cursor:pointer; background:var(--white); color:var(--ink); border-radius:var(--r-3); padding:var(--s-5); box-shadow:inset 0 0 0 var(--keyline) var(--ink-100); transition:box-shadow var(--t-colour) var(--ease), transform var(--t-move) var(--ease); }
.opt > span b { display:block; font-size:var(--fs-h4); margin-bottom:6px; }
.opt > span em { font-style:normal; font-size:var(--fs-small); color:var(--ink-600); }
.opt input:hover + span { box-shadow:inset 0 0 0 var(--keyline) var(--ink); }
.opt input:checked + span { box-shadow:inset 0 0 0 3px var(--cyan); transform:translateY(-3px); }

.checker { display:flex; gap:var(--s-3); flex-wrap:wrap; align-items:flex-end; }
.checker .field { flex:1 1 260px; }
.checker__out { margin-top:var(--s-4); font-weight:700; }
.checker__out[data-state="yes"] { color:var(--cyan); }
.checker__out[data-state="no"] { color:var(--pink); }


.slab--flush.band .ph { min-height:clamp(240px,32vw,440px); border-radius:var(--r-slab); }




.header { overflow:visible; }
.logo-chip {
  display:block; width:clamp(60px,7vw,92px); aspect-ratio:1/1;
  background:var(--white); border-radius:14px; padding:7px;
  box-shadow:0 0 0 2px var(--ink), 6px 6px 0 var(--cyan);
  transform:translateY(clamp(12px,2vw,28px));
  transition:transform var(--t-move) var(--ease);
}
.logo:hover .logo-chip { transform:translateY(clamp(12px,2vw,28px)) rotate(-2deg); }
.logo-chip--flat { transform:none; box-shadow:0 0 0 2px var(--ink); }
.logo:hover .logo-chip--flat { transform:rotate(-2deg); }


.housenav { width:100%; height:auto; }
.housenav .hn-zone { fill:var(--cyan); opacity:0; transition:opacity var(--t-colour) var(--ease); }
.housenav .hn-zone.active { opacity:.85; }
.housenav .hn-dot { cursor:pointer; }
.housenav .hn-dot circle { fill:var(--pink); stroke:var(--white); stroke-width:3; transition:r var(--t-move) var(--ease); }
.housenav .hn-dot.active circle, .housenav .hn-dot:hover circle { fill:var(--cyan); }
.housenav .hn-dot text { fill:var(--white); font-family:var(--font-display); font-size:17px; letter-spacing:.02em; }
.hn-legend { display:flex; flex-wrap:wrap; gap:var(--s-2) var(--s-5); margin-top:var(--s-5); padding:0; list-style:none; }
.hn-legend a {
  display:inline-flex; align-items:baseline; gap:8px; text-decoration:none; color:inherit;
  font-size:var(--fs-small); font-weight:600; padding:8px 0;
  border-bottom:2px solid transparent; transition:border-color var(--t-colour) var(--ease), color var(--t-colour) var(--ease);
}
.hn-legend a b { font-family:var(--font-display); font-weight:400; color:var(--pink); }
.hn-legend a:hover, .hn-legend a.active { border-color:var(--cyan); }


.swipe--stickers { grid-auto-columns:clamp(220px,24vw,280px); }
.swipe--stickers .sticker { text-align:left; }


.anatomy { position:relative; max-width:520px; margin-inline:auto; }
.anatomy img { width:100%; }


.panel .housenav { display:block; margin:-6px; width:calc(100% + 12px); }




.offset-cyan, .ex-cyan { color:var(--cyan); }
.offset-pink, .ex-pink { color:var(--pink); }
.offset-ink,  .ex-ink  { color:var(--ink); }
.s-void .offset-ink, .s-pink .offset-ink { color:var(--white); }


.t-outline, .t-outline-cyan { color:var(--cyan); -webkit-text-stroke:0; }
.t-outline-pink { color:var(--pink); -webkit-text-stroke:0; }
.t-outline-white { color:var(--white); -webkit-text-stroke:0; }

.display-hero,.display-l,.display-m {
  text-shadow:var(--offset-type) var(--offset-type) 0 var(--type-shadow, transparent);
}

.display-hero span,.display-l span,.display-m span { color:inherit !important; -webkit-text-stroke:0 !important; }
.s-white, .s-sunken { --type-shadow:var(--cyan); }
.s-pink  { --type-shadow:var(--ink); }
.s-cyan  { --type-shadow:var(--ink); }

.s-cyan .display-hero, .s-cyan .display-l, .s-cyan .display-m { color:var(--white); }

.s-cyan .panel, .s-cyan .card { --type-shadow:var(--white); }
.s-cyan .panel .display-hero, .s-cyan .panel .display-l, .s-cyan .panel .display-m,
.s-cyan .card .display-hero,  .s-cyan .card .display-l,  .s-cyan .card .display-m { color:var(--ink); }
.s-void  { --type-shadow:var(--pink); }
.band__over { --type-shadow:var(--pink); }
.band__over .display-m { text-shadow:var(--offset-type) var(--offset-type) 0 var(--type-shadow); }
@media (max-width:833px){
  :root { --offset-type:3px; }
}


.header--split .header__in { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; }
.nav--l { justify-self:start; }
.header--split .header__cta { justify-self:end; }
.header--split .header__cta .nav-inline { color:var(--white); text-decoration:none; font-size:var(--fs-small); font-weight:600; margin-right:var(--s-3); }
.header--split .header__cta .nav-inline:hover { color:var(--cyan); }
.logo--center { justify-self:center; }


.navdrop { position:relative; }
.navdrop__trigger::after {
  content:""; display:inline-block; margin-left:7px; vertical-align:middle;
  border:5px solid transparent; border-top:6px solid currentColor; border-bottom:0;
  opacity:.75; transition:transform var(--t-colour) var(--ease);
}
.navdrop:hover .navdrop__trigger::after { transform:rotate(180deg); }
.navdrop__panel::before { content:""; position:absolute; left:0; right:0; top:-20px; height:20px; }
.navdrop__panel {
  position:absolute; top:calc(100% + 18px); left:-16px; z-index:80;
  width:min(560px, 82vw);
  background:var(--white); color:var(--ink); border-radius:var(--r-3);
  box-shadow:var(--offset-chip) var(--offset-chip) 0 var(--cyan);
  padding:var(--s-5);
  display:grid; grid-template-columns:1fr 1fr; gap:var(--s-2) var(--s-5);
  opacity:0; transform:translateY(8px); pointer-events:none;
  transition:opacity var(--t-colour) var(--ease), transform var(--t-move) var(--ease);
}
.navdrop:hover .navdrop__panel, .navdrop:focus-within .navdrop__panel { opacity:1; transform:none; pointer-events:auto; }
.navdrop__panel a { display:block; text-decoration:none; color:var(--ink); padding:10px 12px; border-radius:var(--r-2); transition:background-color var(--t-colour) var(--ease); }
.navdrop__panel a:hover { background:var(--ink-050); }
.navdrop__panel b { display:block; font-size:var(--fs-small); font-weight:700; }
.navdrop__panel em { font-style:normal; font-size:12px; color:var(--ink-600); }
.navdrop__panel .navdrop__all { grid-column:1/-1; text-align:center; font-weight:700; color:var(--pink); border-top:var(--hairline); margin-top:var(--s-2); padding-top:var(--s-3); border-radius:0; }
.navdrop__panel .navdrop__all:hover { background:none; text-decoration:underline; }



.hero-shot { position:relative; overflow:hidden; aspect-ratio:1672/941; }
.hero-shot img { width:100%; height:100%; object-fit:cover; }


.scrollx { position:relative; }
.scrollx__stage {
  --p:0; --s:1; --ty:0px;
  --scale:calc(1 + (var(--s) - 1) * min(var(--p) / .82, 1));
  position:relative; z-index:5;
  border-radius:0; overflow:hidden;
  transform-origin:center center;
  will-change:transform;
}
.scrollx__stage.is-ready {
  border-radius:0;
  transform:translateY(calc(var(--ty) * var(--p))) scale(var(--scale));
}

.scrollx__stage.is-ready .spray-hint,
.scrollx__stage.is-ready .spray-cta,
.scrollx__stage.is-ready .spray-reset { scale:calc(1 / var(--scale)); }


.hero { overflow:visible; }


[data-spray] {
  touch-action:pan-y; user-select:none;
  cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='36' height='36'><circle cx='18' cy='18' r='6' fill='none' stroke='%23e9107d' stroke-width='3'/><path d='M18 2v8M18 26v8M2 18h8M26 18h8' stroke='%23e9107d' stroke-width='3' stroke-linecap='round'/></svg>") 18 18, crosshair;
}
[data-spray] img { pointer-events:none; -webkit-user-drag:none; }
.spray-canvas { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:3; }

.spray-foot {
  position:absolute; left:0; right:0; bottom:15%; z-index:4;
  display:flex; justify-content:center; pointer-events:none;
}
.spray-hint {
  position:static; pointer-events:none;
  font-size:var(--fs-small); font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  background:var(--pink); color:var(--white); padding:14px 24px; border-radius:var(--r-pill);
  animation:hintbob 2.2s var(--ease) infinite, hintring 2.2s var(--ease) infinite;
  white-space:nowrap;
}
@keyframes hintbob { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
@keyframes hintring {
  0% { box-shadow:0 0 0 0 rgba(233,16,125,.55); }
  70%,100% { box-shadow:0 0 0 18px rgba(233,16,125,0); }
}
.spray-reset {
  position:absolute; top:14px; right:14px; z-index:4; border:0; cursor:pointer;
  font:inherit; font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase;
  background:rgba(0,0,0,.72); color:var(--white); padding:10px 15px; border-radius:var(--r-pill);
  transition:background-color var(--t-colour) var(--ease);
}
.spray-reset:hover { background:var(--ink); }

.spray-cta {
  position:static; pointer-events:auto; z-index:5;
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s-2);
  background:var(--pink); color:var(--white); text-decoration:none;
  font-family:var(--font-core); font-weight:700; font-size:1rem;
  letter-spacing:.03em; text-transform:uppercase;
  padding:20px var(--s-7); border-radius:var(--r-pill); white-space:nowrap;
  animation:ctapop .5s var(--ease-out);
  transition:transform var(--t-move) var(--ease), box-shadow var(--t-move) var(--ease);
}
.spray-cta:hover, .spray-cta:focus-visible { transform:translateY(-2px); box-shadow:var(--cta-shadow); }
.spray-cta:active { transform:translateY(1px); box-shadow:var(--cta-shadow-press); }
@keyframes ctapop {
  from { transform:translateY(26px) scale(.8); opacity:0; }
  to   { transform:none; opacity:1; }
}
.spray-hint[hidden], .spray-reset[hidden], .spray-cta[hidden] { display:none; }


.scene { position:relative; flex:1; min-height:300px; border-radius:var(--r-3); overflow:visible; }
.scene__stage { position:absolute; inset:0; border-radius:var(--r-3); overflow:hidden; }
.scene__stage .scrub { position:absolute; inset:0; aspect-ratio:auto; border-radius:0; }
.scene__foamie {
  position:absolute; right:clamp(4px,1.4vw,20px); bottom:0; z-index:7;
  height:105%; width:auto; max-width:none; pointer-events:none;
}
.hero-top { display:grid; grid-template-columns:1fr auto; gap:var(--s-6); align-items:end; margin-bottom:var(--s-6); }
.hero-top__aside { display:flex; flex-direction:column; align-items:flex-end; gap:var(--s-4); text-align:right; }
.kicker { font-size:var(--fs-eyebrow); font-weight:900; letter-spacing:var(--track-eyebrow); text-transform:uppercase; }
.hero-trust { display:flex; flex-wrap:wrap; gap:var(--s-2) var(--s-5); list-style:none; padding:0; margin:var(--s-4) 0 0; font-size:var(--fs-micro); font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-600); }
.hero-trust li { display:flex; align-items:center; gap:7px; }
.hero-trust li::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--pink); }
@media (max-width:1023px){
  .hero-top { grid-template-columns:1fr; align-items:start; }
  .hero-top__aside { align-items:flex-start; text-align:left; }
  .scene { min-height:380px; }
  .scene__foamie { height:88%; }
}


@media (min-width:1180px) and (min-height:620px) and (pointer:fine) {
  
  html:has(.deck) { scroll-snap-type:none; scroll-padding-top:var(--chrome-h); }
  .deck { gap:0; padding-bottom:0; }
  .deck .vp { padding-top:0; }
  .deck .vp:last-of-type { padding-bottom:0; }
  
  .deck .vp {
    height:100svh;
    display:flex; flex-direction:column; overflow:hidden;
  }
  .deck .vp > .slab { flex:1; min-height:0; display:flex; }
  .deck .vp > .slab > .slab__in { margin-block:auto; width:100%; padding-block:clamp(20px,3.4vh,44px); }
  
  .deck .hero .slab__in { display:flex; flex-direction:column; height:auto; margin-block:0; }
  
  .deck .vp > .slab.hero > .slab__in { padding-bottom:0; }
  .deck .hero .hero-top { flex:none; }
  .deck .hero .scene { flex:1; min-height:0; }
  .deck .scrollx { height:150vh; }
  .deck .scrollx__stage { position:sticky; top:calc(var(--chrome-h) + 14px); }
  
  
  .deck .vp--first { height:auto; min-height:100svh; overflow:visible; }
  .deck .hero .display-l { font-size:clamp(2.5rem,8.4vh,5.5rem); }
  .deck .vp > .foam, .deck .vp > .marquee, .deck .vp > .hearth { flex:none; }
  .deck .vp .head { margin-bottom:clamp(18px,3.2vh,40px); }
  .deck .vp .lede { margin-top:clamp(10px,1.6vh,20px); }
  .deck .vp .btn-row { margin-top:clamp(16px,2.6vh,36px); }
  .deck .vp .wallcard { padding-block:clamp(14px,2.6vh,32px); }
  .deck .vp .datum__v { font-size:clamp(3rem,8.6vh,6rem); }
  .deck .vp .chip-figure { max-width:none; justify-self:end; }
  .deck .vp .chip-figure img { max-height:48vh; width:auto; margin-inline:auto; }
  .deck .vp .panel { max-height:calc(100svh - var(--chrome-h) - 40px); overflow:auto; }
  .deck .vp .band, .deck .vp .band img { height:100%; }
  
  .deck .vp--tall { height:auto; min-height:0; overflow:visible; display:block; }
  .deck .vp--tall > .slab { display:block; }
  .deck .vp--tall > .slab > .slab__in { margin-block:0; padding-block:var(--slab-pad-y); }
}




.hero-lede { max-width:46ch; margin-top:var(--s-4); }
.hero-lede b { color:var(--ink); }


.creds { list-style:none; padding:0; margin:var(--s-5) 0 0; display:flex; flex-wrap:wrap; gap:12px 11px; max-width:620px; }

.creds li {
  display:flex; align-items:center; gap:9px; max-width:34ch;
  padding:8px 17px 8px 8px; border-radius:var(--r-pill);
  background:var(--white); color:var(--ink);
  font-size:var(--fs-small); font-weight:700; line-height:1.15;
  box-shadow:inset 0 0 0 2px var(--ink), 4px 4px 0 var(--cyan);
}
.creds__ic {
  width:30px; height:30px; flex:none; border-radius:50%;
  background:var(--pink); display:grid; place-items:center;
}
.creds__ic svg {
  width:17px; height:17px; fill:none;
  stroke:var(--white); stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;
}


.blob {
  position:absolute; z-index:1; pointer-events:none; user-select:none;
  width:auto; max-width:none;
  
  aspect-ratio:809 / 1942;
  transform:scaleX(var(--blob-flip,1));
  opacity:var(--blob-a,1);
}

.blob--r { --blob-flip:-1; }

.s-white .blob, .s-sunken .blob { filter:drop-shadow(0 8px 20px rgba(0,0,0,.12)); }
.s-grey .blob { filter:drop-shadow(0 8px 18px rgba(0,0,0,.09)); }

@media (max-width:899px) { .blob { display:none; } }


@media (min-width:1024px){
  .wall--flow .wallcard { padding-right:var(--s-7); }
  .wall--flow .wallcard:not(:last-child)::after {
    content:"→"; position:absolute; top:var(--s-7); right:10px;
    font-family:var(--font-display); font-size:1.75rem; line-height:.8; color:var(--pink);
  }
}


.faq-foamie { width:min(420px,100%); height:auto; margin-top:var(--s-6); }
@media (min-width:1180px) and (min-height:620px) and (pointer:fine){ .deck .faq-foamie { max-height:32vh; width:auto; } .deck .vp--tall .faq-foamie { max-height:none; width:min(400px,100%); } }




.scene__foamie { height:116%; right:-1%; bottom:-3%; }
@media (max-width:1023px){ .scene__foamie { height:78%; right:-4%; } }


.close-figure { justify-self:end; width:min(620px,100%); }
.close-figure img { width:100%; height:auto; }
@media (max-width:899px){ .close-figure { justify-self:center; max-width:440px; } }


.anatomy--stage { max-width:560px; background:var(--ink); border-radius:var(--r-slab); padding:var(--s-5); box-shadow:var(--offset-chip) var(--offset-chip) 0 var(--ink); }



.tindex__head {
  display:grid; grid-template-columns:1fr auto; gap:var(--s-5) var(--s-7);
  align-items:end; margin-bottom:clamp(26px,3.6vh,52px);
}

.tindex__body {
  display:grid; grid-template-columns:minmax(248px,.82fr) minmax(0,2.05fr);
  gap:clamp(28px,4.5vw,72px); align-items:start;
}


.tindex__seal {
  position:relative; justify-self:end; align-self:end;
  width:clamp(122px,12.5vw,166px); aspect-ratio:1;
  border-radius:50%; display:grid; place-items:center;
  background:var(--ink); transform:rotate(-5deg);
  box-shadow:0 0 0 5px var(--white), 0 0 0 7px var(--cyan);
  transition:transform var(--t-move) var(--ease);
}
.tindex__seal:hover { transform:rotate(0deg) scale(1.04); }
.tindex__seal svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.tindex__seal text {
  font-family:var(--font-core); font-size:10.5px; font-weight:700;
  letter-spacing:.13em; fill:var(--white);
}
.tindex__seal-spin { transform-origin:60px 60px; animation:ringspin 24s linear infinite; }
.tindex__seal:hover .tindex__seal-spin { animation-duration:9s; }
.tindex__seal-n {
  position:relative; z-index:1;
  font-family:var(--font-display); font-size:clamp(2.125rem,3.2vw,2.875rem);
  line-height:.8; letter-spacing:-.03em; color:var(--cyan);
}
.tindex__seal-sr {
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap;
}


.tindex__list { display:flex; flex-direction:column; gap:6px; }
.tix {
  position:relative;
  display:grid; grid-template-columns:auto 1fr auto; align-items:center;
  gap:var(--s-4); width:100%; text-align:left; cursor:pointer;
  background:transparent; border:0; border-radius:var(--r-3);
  padding:clamp(11px,1.7vh,17px) var(--s-4);
  transition:background-color var(--t-colour) var(--ease),
             transform var(--t-move) var(--ease),
             box-shadow var(--t-move) var(--ease);
}

.tix__n {
  font-family:var(--font-display); font-size:1.375rem; line-height:1;
  font-variant-numeric:tabular-nums; min-width:1.6em;
  color:var(--ink-400); transition:color var(--t-colour) var(--ease);
}
.tix__t {
  font-size:var(--fs-small); font-weight:600; line-height:1.3;
  color:var(--ink-600); transition:color var(--t-colour) var(--ease);
}

.tix::after {
  content:"\2192"; justify-self:end;
  width:32px; height:32px; border-radius:var(--r-pill);
  display:grid; place-items:center;
  font-family:var(--font-display); font-size:1.0625rem; line-height:1;
  color:var(--ink-400); box-shadow:inset 0 0 0 var(--keyline) var(--ink-100);
  transition:transform var(--t-move) var(--ease), color var(--t-colour) var(--ease),
             background var(--t-colour) var(--ease), box-shadow var(--t-colour) var(--ease);
}

.tix:hover { background:var(--ink-050); transform:translateX(4px); }
.tix:hover .tix__n { color:var(--pink); }
.tix:hover .tix__t { color:var(--ink); }
.tix:hover::after { transform:translateX(4px); color:var(--ink); box-shadow:inset 0 0 0 var(--keyline) var(--ink); }

.tix.is-on {
  background:var(--ink); transform:none;
  box-shadow:5px 5px 0 var(--cyan);
  padding-bottom:calc(clamp(11px,1.7vh,17px) + 6px);
}
.tix.is-on .tix__n { color:var(--cyan); }
.tix.is-on .tix__t { color:var(--white); font-weight:700; }
.tix.is-on::after { transform:translateX(4px); background:var(--cyan); color:var(--ink); box-shadow:none; }


.tix__bar {
  position:absolute; left:var(--s-4); right:var(--s-4); bottom:9px; height:3px;
  border-radius:2px; background:rgba(255,255,255,.18);
  opacity:0; transition:opacity var(--t-colour) var(--ease);
}
.tix.is-on .tix__bar { opacity:1; }
.tix__bar i {
  display:block; height:100%; border-radius:inherit; background:var(--cyan);
  transform:scaleX(0); transform-origin:left;
}
.tix.is-on .tix__bar i { transform:scaleX(1); transition:transform var(--t-move) var(--ease); }
.tix.is-on.is-timing .tix__bar i { animation:tix-dwell var(--dwell,7.4s) linear both; }
@keyframes tix-dwell { from { transform:scaleX(0); } to { transform:scaleX(1); } }


.tindex__stage { position:relative; display:grid; min-height:clamp(340px,46vh,480px); }
.tpanel {
  grid-area:1/1; display:grid;
  grid-template-columns:minmax(220px,1.04fr) minmax(0,1.1fr);
  gap:clamp(20px,3vw,48px); align-items:stretch;
  visibility:hidden; opacity:0; transition:opacity var(--t-move) var(--ease);
}
.tpanel.is-on { visibility:visible; opacity:1; }


.tpanel__fig { margin:0; position:relative; height:100%; }
.tpanel__fig .ph, .tpanel__fig img {
  height:100%; border-radius:var(--r-3);
  box-shadow:var(--offset-chip) var(--offset-chip) 0 var(--ink);
}
.tpanel__fig .ph { min-height:0; aspect-ratio:auto; padding:var(--s-5); }
.tpanel__fig img { width:100%; object-fit:cover; }
.tpanel.is-on .tpanel__fig { animation:tp-fig var(--t-slab) var(--ease-out) both; }
@keyframes tp-fig {
  from { opacity:0; transform:translate(-12px,12px); }
  to   { opacity:1; transform:none; }
}


.tpanel__c { position:relative; align-self:center; }
.tpanel__n {
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-display); font-size:1.375rem; line-height:1;
  color:var(--cyan); letter-spacing:.02em; margin-bottom:var(--s-3);
}
.tpanel__n::after { content:""; height:2px; width:34px; background:var(--pink); }
.tpanel__c h3 { font-size:clamp(1.75rem,1rem+2.1vw,2.75rem); }
.tpanel__c p { margin:var(--s-4) 0 0; max-width:34ch; }


.tpanel__chip {
  display:inline-block; margin-top:var(--s-5); padding:6px 13px; border-radius:var(--r-pill);
  font-size:var(--fs-micro); font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink); background:color-mix(in srgb, var(--cyan) 14%, transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--cyan) 45%, transparent);
}


.tpanel__n, .tpanel__c h3, .tpanel__c p, .tpanel__chip { opacity:0; transform:translateY(14px); }
.tpanel.is-on .tpanel__n,
.tpanel.is-on .tpanel__c h3,
.tpanel.is-on .tpanel__c p,
.tpanel.is-on .tpanel__chip {
  opacity:1; transform:none;
  transition:opacity var(--t-max) var(--ease-out), transform var(--t-max) var(--ease-out);
}
.tpanel.is-on .tpanel__n     { transition-delay:40ms; }
.tpanel.is-on .tpanel__c h3  { transition-delay:100ms; }
.tpanel.is-on .tpanel__c p   { transition-delay:160ms; }
.tpanel.is-on .tpanel__chip  { transition-delay:220ms; }


@media (min-width:1180px) and (min-height:620px) and (pointer:fine) {
  .deck .vp .tindex__stage { min-height:clamp(300px,44vh,440px); }
  .deck .vp .tix { padding-block:clamp(9px,1.5vh,18px); }
  .deck .vp .tix.is-on { padding-bottom:calc(clamp(9px,1.5vh,18px) + 6px); }
  .deck .vp .tix::after { width:28px; height:28px; font-size:1rem; }
  .deck .vp .tindex__seal { width:clamp(112px,15vh,150px); }
}


@media (max-width:899px) {
  .tindex__head { grid-template-columns:1fr; align-items:start; }
  .tindex__seal { justify-self:start; width:clamp(108px,26vw,140px); }
  .tindex__body { grid-template-columns:1fr; gap:0; }
  .tindex__list { display:none; }
  .tindex__stage { display:block; min-height:0; }
  .tpanel {
    display:block; visibility:visible; opacity:1;
    padding:var(--s-6) 0; border-top:2px solid var(--ink-100);
  }
  .tpanel__fig { height:auto; max-width:460px; }
  .tpanel__fig .ph { aspect-ratio:4/5; height:auto; }
  .tpanel__fig img { aspect-ratio:4/5; height:auto; }
  .tpanel.is-on .tpanel__fig { animation:none; }
  .tpanel__c { margin-top:var(--s-6); }
  .tpanel__c h3 { font-size:var(--fs-h3); }
  .tpanel__n, .tpanel__c h3, .tpanel__c p, .tpanel__chip { opacity:1; transform:none; }
}

@media (prefers-reduced-motion:reduce) {
  .tindex__seal-spin { animation:none; }
  .tpanel.is-on .tpanel__fig { animation:none; }
  .tpanel__n, .tpanel__c h3, .tpanel__c p, .tpanel__chip { opacity:1; transform:none; }
  .tix.is-on.is-timing .tix__bar i { animation:none; transform:scaleX(1); }
}



.reel {
  position:relative; overflow:hidden;
  min-height:clamp(460px,72vh,760px);
  background:var(--ink);
  --reel-pad-b:clamp(26px,4.6vh,56px);
  --reel-lift:clamp(60px,8vh,88px);   
  --reel-fade:700ms;                  
  --reel-card-w:clamp(84px,10.5vw,146px);
  --reel-ov:calc(var(--reel-card-w) * .12);
  --reel-card-h:calc(var(--reel-card-w) + 62px);   
}


.reel__stage { position:absolute; inset:0; }
.reel__shot {
  position:absolute; inset:0; margin:0; opacity:0; visibility:hidden;
  transition:opacity var(--reel-fade) linear, visibility 0s linear var(--reel-fade);
}
.reel__shot.is-on { opacity:1; visibility:visible; transition:opacity var(--reel-fade) linear, visibility 0s; }
.reel__shot img { width:100%; height:100%; object-fit:cover; display:block; }


.reel__shot img { animation:reel-drift 26s linear infinite alternate; animation-play-state:paused; }
.reel__shot.is-on img { animation-play-state:running; }
@keyframes reel-drift {
  from { transform:scale(1.06) translate3d(0,0,0); }
  to   { transform:scale(1.15) translate3d(-1.5%,-1.7%,0); }
}


.reel__vignette {
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    linear-gradient(to top, rgba(0,0,0,.94) 0%, rgba(0,0,0,.66) 30%, rgba(0,0,0,0) 66%),
    linear-gradient(to right, rgba(0,0,0,.6), rgba(0,0,0,0) 44%),
    radial-gradient(128% 96% at 50% 34%, rgba(0,0,0,0) 44%, rgba(0,0,0,.5));
}
.reel__vignette::after {
  content:""; position:absolute; inset:0;
  background-image:var(--void-tooth); opacity:.16; mix-blend-mode:overlay;
}




.reel__over {
  position:absolute; z-index:5; inset:auto 0 0 0;
  padding:0 var(--slab-pad-x) var(--reel-pad-b);
  color:var(--white); pointer-events:none;
}
.reel__over .in { max-width:var(--container); margin-inline:auto; }
.reel__over .display-m { text-shadow:var(--offset-type) var(--offset-type) 0 var(--pink); }
.reel__meta { max-width:min(660px,100%); margin-top:clamp(16px,2.6vh,28px); }


.reel__tags { display:grid; }
.reel__tagset {
  grid-area:1/1; margin:0; display:flex; flex-wrap:wrap; align-items:flex-start; gap:8px;
  opacity:0; visibility:hidden;
  transition:opacity var(--t-max) linear, visibility 0s linear var(--t-max);
}
.reel__tagset.is-on { opacity:1; visibility:visible; transition:opacity var(--t-max) linear, visibility 0s; }
.reel__tag {
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 14px; border-radius:var(--r-pill);
  background:rgba(0,0,0,.58); box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
  font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow);
  text-transform:uppercase; color:var(--white); white-space:nowrap;
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
}
.reel__tag::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--cyan); flex:none; }
.reel__tag--lead { background:var(--cyan); color:var(--ink); box-shadow:none; }
.reel__tag--lead::before { background:var(--ink); }

.reel__tagset.is-on .reel__tag { animation:reel-tag var(--t-max) var(--ease-out) both; }
.reel__tagset.is-on .reel__tag:nth-child(1) { animation-delay:120ms; }
.reel__tagset.is-on .reel__tag:nth-child(2) { animation-delay:220ms; }
.reel__tagset.is-on .reel__tag:nth-child(3) { animation-delay:320ms; }
@keyframes reel-tag { from { opacity:0; transform:translateY(9px); } to { opacity:1; transform:none; } }


.reel__ticks { display:flex; gap:8px; margin-top:clamp(14px,2.2vh,24px); }
.reel__ticks i {
  position:relative; overflow:hidden; border-radius:2px;
  width:clamp(38px,5.4vw,84px); height:4px; background:rgba(255,255,255,.22);
}
.reel__ticks i::after {
  content:""; position:absolute; inset:0; background:rgba(255,255,255,.5);
  transform:scaleX(0); transform-origin:left;
}
.reel__ticks i.is-done::after { transform:scaleX(1); }
.reel__ticks i.is-on::after { background:var(--cyan); transform:scaleX(var(--p,0)); }


.reel__stack {
  position:absolute; z-index:6;
  right:var(--slab-pad-x); bottom:calc(var(--reel-pad-b) + var(--reel-lift));
  display:flex; align-items:flex-end;
}
.reel__card + .reel__card { margin-left:calc(var(--reel-ov) * -1); }
.reel__card {
  --tilt:0deg;
  position:relative; flex:none; cursor:pointer; opacity:0;
  width:var(--reel-card-w);
  padding:7px 7px 26px; border:0; border-radius:4px;
  background:var(--white);
  box-shadow:0 14px 28px rgba(0,0,0,.5);
  transform:rotate(var(--tilt));
  transition:transform 280ms var(--ease-out), box-shadow 280ms var(--ease);
}

.reel__card__f { position:relative; display:block; overflow:hidden; border-radius:2px; }
.reel__card img {
  width:100%; aspect-ratio:1/1; object-fit:cover; display:block;
  filter:grayscale(.72) brightness(.82) contrast(1.08);
  transform:scale(1);
  transition:transform 520ms var(--ease-out), filter 280ms var(--ease);
}
.reel__card__k {
  position:relative; display:block; margin-top:8px;
  font-size:10px; font-weight:900; letter-spacing:.07em; text-transform:uppercase;
  color:var(--ink-400); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  transition:color var(--t-colour) var(--ease);
}
.reel__card__k::after {
  content:""; position:absolute; left:50%; right:50%; bottom:-5px; height:2px; background:var(--pink);
  transition:left 260ms var(--ease-out), right 260ms var(--ease-out);
}
.reel__card:nth-child(1) { --tilt:-7deg; z-index:1; }
.reel__card:nth-child(2) { --tilt:4.5deg;  z-index:2; }
.reel__card:nth-child(3) { --tilt:-3deg; z-index:3; }
.reel__card:nth-child(4) { --tilt:6.5deg;  z-index:4; }


.reel__card:hover, .reel__card:focus-visible {
  transform:rotate(0deg) translateY(-18px) scale(1.06); z-index:9;
  box-shadow:0 30px 52px rgba(0,0,0,.62), 7px 7px 0 var(--pink);
}
.reel__card:hover img, .reel__card:focus-visible img { filter:none; transform:scale(1.09); }
.reel__card:hover .reel__card__k, .reel__card:focus-visible .reel__card__k { color:var(--ink); }
.reel__card:hover .reel__card__k::after, .reel__card:focus-visible .reel__card__k::after { left:0; right:0; }
.reel__card:focus-visible { outline:none; box-shadow:0 30px 52px rgba(0,0,0,.62), 7px 7px 0 var(--pink), var(--focus-ring); }

.reel__card:hover + .reel__card { transform:rotate(var(--tilt)) translateX(12px); }
.reel__card:has(+ .reel__card:hover) { transform:rotate(var(--tilt)) translateX(-12px); }


.reel__card.is-on {
  --tilt:0deg; z-index:8;
  transform:rotate(0deg) translateY(-12px);
  box-shadow:0 22px 42px rgba(0,0,0,.55), 0 0 0 3px var(--cyan), 7px 7px 0 rgba(5,168,236,.34);
}
.reel__card.is-on img { filter:none; }
.reel__card.is-on .reel__card__k { color:var(--ink); }
.reel__card.is-on .reel__card__k::after { left:0; right:0; background:var(--cyan); }
.reel__card.is-on:hover, .reel__card.is-on:focus-visible {
  transform:rotate(0deg) translateY(-18px) scale(1.06);
  box-shadow:0 30px 52px rgba(0,0,0,.62), 0 0 0 3px var(--cyan), 7px 7px 0 var(--pink);
}


.reel.is-live .reel__card { opacity:1; animation:reel-card-in var(--t-slab) var(--ease-out) backwards; }
.reel.is-live .reel__card:nth-child(1) { animation-delay:60ms; }
.reel.is-live .reel__card:nth-child(2) { animation-delay:130ms; }
.reel.is-live .reel__card:nth-child(3) { animation-delay:200ms; }
.reel.is-live .reel__card:nth-child(4) { animation-delay:270ms; }
@keyframes reel-card-in {
  from { opacity:0; transform:rotate(var(--tilt)) translateY(52px) scale(.82); }
}


@media (min-width:1180px) and (min-height:620px) and (pointer:fine) {
  .deck .vp .reel { min-height:0; }
}


@media (max-width:899px) {
  .reel {
    min-height:clamp(440px,68vh,620px); --reel-pad-b:clamp(18px,3vh,26px);
    --reel-lift:0px;                       
    --reel-card-w:clamp(62px,16.5vw,88px);
    --reel-ov:calc(var(--reel-card-w) * .1);
    --reel-card-h:calc(var(--reel-card-w) + 10px);
  }
  .reel__over { padding-bottom:calc(var(--reel-pad-b) + var(--reel-lift) + var(--reel-card-h) + 26px); }
  .reel__stack { left:var(--slab-pad-x); right:auto; }
  .reel__card { padding:5px; }
  .reel__card__k { display:none; }        
  .reel__ticks i { width:clamp(26px,7vw,44px); }
}
@media (max-width:639px) {
  .reel__tags { gap:6px; }
  .reel__tagset { gap:6px; }
  .reel__tag { padding:5px 10px; font-size:10px; letter-spacing:.1em; }
  .reel__tag::before { width:5px; height:5px; }
  .reel__tag:nth-child(3) { display:none; }   
}

@media (prefers-reduced-motion:reduce) {
  .reel__shot { transition:none; }
  .reel__shot img { animation:none; }
  .reel__tagset { transition:none; }
  .reel__tagset.is-on .reel__tag { animation:none; }
  .reel__ticks i.is-on::after { transform:scaleX(1); }
  .reel.is-live .reel__card { animation:none; }
  .reel__card { opacity:1; }
  .reel__card img { transition:filter var(--t-colour) linear; }
}



.no5__note {
  max-width:30ch; margin:0; text-align:right;
  font-size:var(--fs-small); font-weight:600; color:rgba(0,0,0,.72);
}

.no5s { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:clamp(12px,1.4vw,20px); }

.no5 {
  position:relative; isolation:isolate; overflow:hidden;
  display:flex; flex-direction:column; align-items:flex-start; gap:var(--s-3);
  min-height:clamp(230px,24vw,290px); padding:var(--s-5);
  background:var(--ink); color:var(--white); border-radius:var(--r-3);
  box-shadow:var(--offset-chip) var(--offset-chip) 0 var(--white);
  transform:rotate(var(--tilt,-2deg));
  transition:transform var(--t-max) var(--ease-out), box-shadow var(--t-max) var(--ease-out);
}
.no5:nth-child(1) { --tilt:-2.4deg; }
.no5:nth-child(2) { --tilt:1.8deg; }
.no5:nth-child(3) { --tilt:-1.2deg; }
.no5:nth-child(4) { --tilt:2.2deg; }
.no5:nth-child(5) { --tilt:-1.8deg; }
.no5:hover { transform:rotate(0deg) translateY(-6px); box-shadow:14px 14px 0 var(--white); }


.no5::after {
  content:""; position:absolute; right:0; bottom:0; width:0; height:0;
  border-style:solid; border-width:0 0 0 0;
  border-color:transparent transparent var(--cyan) transparent;
  transition:border-width var(--t-max) var(--ease-out);
}
.no5:hover::after { border-width:0 0 34px 34px; border-left-color:transparent; }

.no5__n {
  font-family:var(--font-display); font-size:clamp(2.5rem,3.6vw,3.5rem); line-height:.78;
  color:var(--cyan); font-variant-numeric:tabular-nums;
}
.no5 h3 {
  margin:0; font-family:var(--font-display); font-weight:400; text-transform:uppercase;
  font-size:clamp(1.375rem,1.9vw,1.875rem); line-height:.92; letter-spacing:.01em;
}
.no5 h3 em { font-style:normal; color:var(--pink); }
.no5 p { margin:0; font-size:var(--fs-small); line-height:1.5; color:var(--on-void); }
.no5__tag {
  margin-top:auto; padding:6px 11px; border-radius:var(--r-pill);
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28);
  font-size:var(--fs-micro); font-weight:900; letter-spacing:.08em; text-transform:uppercase;
  color:var(--white); transition:background-color var(--t-colour) var(--ease), color var(--t-colour) var(--ease), box-shadow var(--t-colour) var(--ease);
}
.no5:hover .no5__tag { background:var(--cyan); color:var(--ink); box-shadow:inset 0 0 0 1.5px var(--cyan); }


.no5[data-reveal] { transition-delay:0ms; }
.no5:nth-child(2)[data-reveal].is-in { transition-delay:80ms; }
.no5:nth-child(3)[data-reveal].is-in { transition-delay:160ms; }
.no5:nth-child(4)[data-reveal].is-in { transition-delay:240ms; }
.no5:nth-child(5)[data-reveal].is-in { transition-delay:320ms; }


@media (min-width:1180px) and (min-height:620px) and (pointer:fine) {
  .deck .vp .no5 { min-height:clamp(190px,28vh,270px); padding:clamp(12px,2vh,22px); }
  .deck .vp .no5__n { font-size:clamp(2rem,5vh,3.25rem); }
}

@media (max-width:1023px) {
  .no5s { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 14px; }
  .no5 { min-height:200px; }
  .no5:nth-child(5) { grid-column:1/-1; min-height:0; }
  .no5__note { text-align:left; justify-self:start !important; max-width:none; }
}
@media (max-width:599px) {
  .no5s { grid-template-columns:1fr; gap:18px; }
  .no5, .no5:nth-child(5) { min-height:0; }
  .no5 { box-shadow:6px 6px 0 var(--white); }
  .no5:hover { box-shadow:9px 9px 0 var(--white); }
}

@media (prefers-reduced-motion:reduce) {
  .no5 { transition:none; }
  .no5:hover { transform:rotate(var(--tilt,-2deg)); }
  .no5::after { transition:none; }
}



.proc { --proc-dot:clamp(46px,4.4vw,58px); }


.proc__lead { text-align:center; margin-bottom:clamp(30px,4.2vh,56px); }

.proc__lead .display-m { margin:0; white-space:nowrap; font-size:clamp(1.25rem,6.4vw,4.5rem); }
.proc__close { margin-top:clamp(26px,3.8vh,48px); text-align:center; }
.proc__close .btn-row { justify-content:center; margin-top:0; }


.proc__rail { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--s-3); }
.proc__track {
  position:absolute; left:12.5%; right:12.5%; top:calc(var(--proc-dot) / 2 - 1.5px);
  height:3px; background:rgba(0,0,0,.13); border-radius:2px; overflow:hidden;
}
.proc__track__fill {
  display:block; height:100%; width:0%;
  background:var(--cyan); box-shadow:0 0 14px rgba(5,168,236,.55);
  transition:width 100ms linear;
}
.proc__node {
  position:relative; z-index:2; min-width:0; display:flex; flex-direction:column; align-items:center; gap:var(--s-3);
  padding:0 var(--s-2); border:0; background:none; color:inherit; font:inherit; text-align:center; cursor:pointer;
}
.proc__node__dot {
  position:relative; width:var(--proc-dot); height:var(--proc-dot); border-radius:50%; flex:none;
  display:grid; place-items:center;
  background:var(--slab-bg); box-shadow:inset 0 0 0 2px rgba(0,0,0,.18);
  font-family:var(--font-display); font-size:calc(var(--proc-dot) * .40); line-height:1; color:rgba(0,0,0,.42);
  transition:background-color var(--t-move) var(--ease), color var(--t-move) var(--ease),
             box-shadow var(--t-move) var(--ease), transform var(--t-move) var(--ease-out);
}
.proc__node__dot b { font-weight:400; }

.proc__node:hover .proc__node__dot { transform:translateY(-4px); }
.proc__node.is-done .proc__node__dot { background:var(--cyan); color:var(--ink); box-shadow:none; }
.proc__node.is-on .proc__node__dot {
  background:var(--ink); color:var(--white); transform:scale(1.14);
  
  box-shadow:0 0 0 8px var(--slab-bg), 0 10px 26px rgba(0,0,0,.20);
}

.proc__node__ring {
  position:absolute; inset:-8px; border-radius:50%; pointer-events:none; opacity:0;
  background:conic-gradient(var(--cyan) calc(var(--p,0) * 360deg), rgba(0,0,0,.11) 0);
  -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 3px), #000 0);
  mask:radial-gradient(farthest-side, transparent calc(100% - 3px), #000 0);
  transition:opacity var(--t-move) var(--ease);
}
.proc__node.is-on .proc__node__ring { opacity:1; }
.proc__node__k { font-weight:700; font-size:var(--fs-small); line-height:1.25; overflow-wrap:anywhere; hyphens:auto; color:rgba(0,0,0,.66); transition:color var(--t-colour) var(--ease); }
.proc__node.is-on .proc__node__k, .proc__node:hover .proc__node__k { color:var(--ink); }
.proc__node__s {
  display:block; margin-top:3px; font-weight:600; font-size:var(--fs-micro);
  text-transform:uppercase; letter-spacing:var(--track-eyebrow); color:rgba(0,0,0,.48);
}
.proc__node:focus-visible { outline:none; }
.proc__node:focus-visible .proc__node__dot { box-shadow:0 0 0 3px var(--ink-050), 0 0 0 6px var(--cyan); }


.proc__stage {
  position:relative; display:grid; margin-top:clamp(24px,3.4vh,44px);
  background:var(--white); color:var(--ink);
  border-radius:var(--r-3);
  box-shadow:0 0 0 1px var(--ink-100), var(--offset-chip) var(--offset-chip) 0 var(--ink);
}
.proc__panel {
  grid-area:1/1; display:grid; grid-template-columns:clamp(78px,8.4vw,124px) minmax(0,1fr);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity 240ms var(--ease), visibility 0s linear 240ms;
}
.proc__panel[hidden] { display:grid; }   
.proc__panel.is-on { opacity:1; visibility:visible; pointer-events:auto; transition-delay:0s; }
.proc .proc__panel__n {
  display:grid; place-items:center; margin:0; max-width:none;
  font-family:var(--font-display); font-size:clamp(2.5rem,4.4vw,4rem); line-height:1;
  color:var(--white); background:var(--ink); border-radius:var(--r-3) 0 0 var(--r-3);
}
.proc__panel__b {
  padding:clamp(22px,3vh,36px) clamp(22px,3vw,42px);
  display:grid; grid-template-columns:minmax(0,1fr) minmax(210px,.58fr);
  gap:clamp(20px,3vw,44px); align-items:center;
}
.proc__panel__b h3 {
  margin:0; font-family:var(--font-display); font-size:var(--fs-h3);
  text-transform:uppercase; letter-spacing:.005em;
}
.proc__panel__c > p { margin:var(--s-3) 0 0; font-size:var(--fs-body); color:rgba(0,0,0,.68); max-width:58ch; }
.proc__facts {
  display:grid; gap:0; margin:0; padding:0 0 0 clamp(18px,2vw,26px); list-style:none;
  border-left:var(--keyline) solid var(--ink-100);
}
.proc__facts li {
  display:block; padding:var(--s-3) var(--s-3) var(--s-3) 0; position:relative;
  transition:padding-left var(--t-move) var(--ease-out);
}
.proc__facts li + li { border-top:1px solid var(--ink-100); }
.proc__facts li::before {
  content:""; position:absolute; left:calc(-1 * clamp(18px,2vw,26px) - var(--keyline)); top:0; bottom:0;
  width:var(--keyline); background:var(--cyan); transform:scaleY(0); transform-origin:top;
  transition:transform var(--t-move) var(--ease-out);
}
.proc__facts li:hover { padding-left:8px; }
.proc__facts li:hover::before { transform:scaleY(1); }
.proc__facts b { display:block; font-family:var(--font-display); font-size:clamp(1.375rem,1.9vw,1.75rem); line-height:1; letter-spacing:.01em; }
.proc__facts span { display:block; margin-top:5px; font-size:var(--fs-micro); text-transform:uppercase; letter-spacing:var(--track-eyebrow); color:var(--ink-600); }


.proc .proc__panel.is-on .proc__panel__n { animation:procNum 520ms var(--ease-out) both; }
.proc__panel.is-on .proc__panel__c > *,
.proc__panel.is-on .proc__facts li { animation:procIn 480ms var(--ease-out) both; animation-delay:calc(var(--d,0) * 70ms); }
.proc__panel__c > *:nth-child(2) { --d:1; }
.proc__facts li:nth-child(1) { --d:1; }
.proc__facts li:nth-child(2) { --d:2; }
.proc__facts li:nth-child(3) { --d:3; }
@keyframes procIn { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:none; } }
@keyframes procNum { from { opacity:0; transform:translateY(-14px); } to { opacity:1; transform:none; } }


@media (max-width:720px) {
  .proc { --proc-dot:44px; }
  .proc__rail { gap:var(--s-1); }
  .proc__node { padding:0; }
  .proc__node__k { font-size:var(--fs-micro); font-weight:700; }
  .proc__node__s { display:none; }
  .proc__panel { grid-template-columns:minmax(0,1fr); }
  .proc .proc__panel__n { padding:10px 0; border-radius:var(--r-3) var(--r-3) 0 0; font-size:2.25rem; }
  .proc__panel__b { grid-template-columns:minmax(0,1fr); gap:var(--s-5); }
  .proc__facts { padding-left:var(--s-4); }
  .proc__facts b { font-size:1.25rem; }
  .proc__close .btn { width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  .proc .proc__panel.is-on .proc__panel__n,
  .proc__panel.is-on .proc__panel__c > *,
  .proc__panel.is-on .proc__facts li,
  .proc__track__fill { transition:none; }
}


@media (min-width:1180px) and (min-height:620px) and (pointer:fine) {
  .deck .proc { --proc-dot:clamp(42px,6.2vh,56px); }
  .deck .proc .display-m { font-size:min(clamp(2rem,6vh,3.5rem), 6.4vw); }
  .deck .proc__lead { margin-bottom:clamp(22px,3.2vh,40px); }
  .deck .proc__stage { margin-top:clamp(16px,2.6vh,34px); }
  .deck .proc__panel__b { padding-block:clamp(14px,2.2vh,30px); }
  .deck .proc__panel__c > p { font-size:clamp(.95rem,1.9vh,1.0625rem); }
  .deck .proc__facts li { padding-block:clamp(7px,1.2vh,14px); }
  .deck .proc__facts b { font-size:clamp(1.125rem,2.6vh,1.75rem); }
  .deck .proc__close { margin-top:clamp(18px,2.8vh,38px); }
}


.no5__head { grid-template-columns:1fr auto; }
.no5[data-reveal] { opacity:0; transform:translateY(18px) rotate(var(--tilt,-2deg)); }
.no5[data-reveal].is-in { opacity:1; transform:rotate(var(--tilt,-2deg)); }
.no5[data-reveal].is-in:hover { transform:rotate(0deg) translateY(-6px); }
@media (max-width:899px) { .no5__head { grid-template-columns:1fr; } }


@media (max-width:899px) {
  .no5:nth-child(1) { --tilt:-1.2deg; }
  .no5:nth-child(2) { --tilt:1deg; }
  .no5:nth-child(3) { --tilt:-0.7deg; }
  .no5:nth-child(4) { --tilt:1.2deg; }
  .no5:nth-child(5) { --tilt:-1deg; }
}


.no5__head { grid-template-columns:1fr; text-align:center; }
.no5__cta { display:flex; justify-content:center; margin-top:clamp(20px,3vw,36px); }


.no5 { padding:var(--s-6) var(--s-5) var(--s-5); }
.no5__n {
  position:absolute; top:10px; right:14px; z-index:0;
  font-size:clamp(3rem,4.2vw,4.5rem); line-height:.8;
  color:transparent; -webkit-text-stroke:1.5px rgba(255,255,255,.24);
}
.no5 > *:not(.no5__n) { position:relative; z-index:1; }

.no5 h3 { margin:0; display:flex; flex-direction:column; gap:6px; }
.no5__kick {
  font-family:var(--font-core); font-size:var(--fs-micro); font-weight:900;
  letter-spacing:.18em; text-transform:uppercase; color:var(--on-void-dim);
  transition:color var(--t-colour) var(--ease);
}
.no5 h3 em {
  font-family:var(--font-display); font-style:normal; font-weight:400; text-transform:uppercase;
  font-size:clamp(1.625rem,2.3vw,2.375rem); line-height:.88; letter-spacing:.005em;
  color:var(--pink);
}
.no5:hover .no5__kick { color:var(--cyan); }
.no5 p {
  margin:0; max-width:28ch;
  font-size:var(--fs-small); line-height:1.55; color:var(--on-void);
  letter-spacing:.002em;
}


.no5__tag {
  display:inline-flex; align-items:center; gap:8px;
  margin-top:auto; padding:8px 13px 8px 11px; border-radius:var(--r-pill);
  background:rgba(255,255,255,.06); box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);
  font-size:10px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; line-height:1.25;
  color:var(--white);
}
.no5__tag::before {
  content:""; width:7px; height:7px; flex:none; border-radius:50%;
  background:var(--cyan); box-shadow:0 0 0 3px rgba(5,168,236,.22);
  transition:background-color var(--t-colour) var(--ease), box-shadow var(--t-colour) var(--ease);
}
.no5:hover .no5__tag { background:var(--cyan); color:var(--ink); box-shadow:inset 0 0 0 1px var(--cyan); }
.no5:hover .no5__tag::before { background:var(--ink); box-shadow:0 0 0 3px rgba(0,0,0,.18); }

@media (min-width:1180px) and (min-height:620px) and (pointer:fine) {
  .deck .vp .no5__n { font-size:clamp(2.5rem,6vh,4rem); }
}
@media (max-width:599px) {
  .no5 h3 em { font-size:1.75rem; }
  .no5 p { max-width:none; }
}


.no5__n { top:8px; right:12px; -webkit-text-stroke-color:rgba(255,255,255,.19); }
.no5 h3 { padding-right:clamp(44px,3.6vw,62px); }
@media (max-width:599px) { .no5 h3 { padding-right:64px; } }


.no5__n {
  position:static; display:block; margin-bottom:2px;
  font-size:clamp(2.5rem,3.4vw,3.5rem); line-height:.78;
  -webkit-text-stroke:1.5px rgba(255,255,255,.26); color:transparent;
}
.no5 h3 { padding-right:0; gap:4px; }
.no5 h3 em { font-size:clamp(1.5rem,2.05vw,2.125rem); }
.no5 { padding:var(--s-5); gap:var(--s-2); }
.no5 p { margin-top:var(--s-2); }
@media (max-width:599px) { .no5 h3 { padding-right:0; } }
@media (min-width:1180px) and (min-height:620px) and (pointer:fine) {
  .deck .vp .no5__n { font-size:clamp(2.25rem,5.2vh,3.25rem); }
}


.no5__tag { padding:7px 11px 7px 9px; gap:7px; font-size:9.5px; letter-spacing:.07em; }
.no5__tag::before { width:6px; height:6px; box-shadow:0 0 0 2.5px rgba(5,168,236,.22); }


.s-grey { --slab-bg:#ebebeb; --slab-fg:var(--ink); --type-shadow:var(--cyan); }
.s-grey .card { box-shadow:0 0 0 1px var(--ink-100); }
.s-grey .ghost { color:rgba(0,0,0,.05); }

.terr8__head {
  display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(24px,4vw,56px); align-items:end;
  padding-bottom:var(--s-5); margin-bottom:clamp(24px,3vw,40px); border-bottom:2px solid rgba(0,0,0,.1);
}
.terr8__lede { font-size:var(--fs-body); line-height:var(--lh-body); max-width:46ch; margin:0; }
.terr8__body { display:grid; grid-template-columns:1.04fr .96fr; gap:clamp(24px,3vw,48px); align-items:center; }


.terrfig { margin:0; display:flex; flex-direction:column; align-items:flex-start; }
.terrfig__chip { position:relative; width:100%; max-width:470px; align-self:center; }
.terrfig__chip img { display:block; border-radius:var(--r-2); }
.terrfig__badge {
  position:absolute; right:-24px; bottom:-26px; z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:2px;
  min-width:112px; padding:12px 16px 11px;
  background:var(--white); color:var(--ink); border-radius:var(--r-3);
  box-shadow:0 0 0 2px var(--ink), 6px 6px 0 var(--ink);
  transform:rotate(-3.5deg);
  transition:transform var(--t-max) var(--ease-out), box-shadow var(--t-max) var(--ease-out), background-color var(--t-move) var(--ease);
}
.terrfig__badge b { font-family:var(--font-display); font-weight:400; font-size:clamp(1.75rem,2.6vw,2.375rem); line-height:.85; }
.terrfig__badge em {
  font-style:normal; font-size:var(--fs-micro); font-weight:700; text-align:center;
  letter-spacing:var(--track-eyebrow); text-transform:uppercase; color:rgba(0,0,0,.55);
  transition:color var(--t-colour) var(--ease);
}
.terrfig__badge b { transition:color var(--t-colour) var(--ease); }
.terr8[data-picked="true"] .terrfig__badge { transform:rotate(0deg) translateY(-4px); box-shadow:0 0 0 2px var(--cyan), 9px 9px 0 var(--ink); }
.terr8[data-picked="true"] .terrfig__badge b { color:var(--cyan); }
.terr8[data-picked="true"] .terrfig__badge em { color:var(--ink); }

.terrfig figcaption {
  width:100%; display:flex; flex-wrap:wrap; align-items:center; gap:var(--s-4);
  margin-top:clamp(28px,3vw,44px); padding-top:var(--s-4); border-top:1px solid rgba(0,0,0,.14);
  font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase;
}
.terrmap__go {
  display:inline-flex; align-items:center; gap:9px; color:var(--ink); text-decoration:none;
  font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase;
  padding-bottom:3px; border-bottom:2px solid var(--cyan);
  transition:color var(--t-colour) var(--ease), border-color var(--t-colour) var(--ease);
}
.terrmap__go i {
  width:20px; height:8px; flex:none; background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='8'%3E%3Cpath d='M0 4h17M13 0l5 4-5 4' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat center;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='8'%3E%3Cpath d='M0 4h17M13 0l5 4-5 4' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat center;
  transition:transform var(--t-move) var(--ease-out);
}
.terrmap__go:hover { color:var(--cyan); border-color:var(--ink); }
.terrmap__go:hover i { transform:translateX(4px); }


.terr8__stack { display:flex; flex-direction:column; gap:clamp(10px,1.2vw,14px); padding-right:12px; }
.tsk {
  position:relative; isolation:isolate; overflow:hidden; width:100%; text-align:left;
  display:flex; flex-direction:column; align-items:flex-start; gap:6px;
  padding:var(--s-4) var(--s-5); border:0; cursor:pointer;
  background:var(--white); color:var(--ink); border-radius:var(--r-3);
  box-shadow:0 0 0 1px rgba(0,0,0,.14);
  transform:rotate(var(--tilt,-1.2deg));
  transition:transform var(--t-max) var(--ease-out), box-shadow var(--t-max) var(--ease-out), opacity var(--t-move) var(--ease);
}
.tsk:nth-child(1) { --tilt:-1.2deg; }
.tsk:nth-child(2) { --tilt:1deg; }
.tsk:nth-child(3) { --tilt:-.7deg; }
.tsk:hover, .tsk[aria-pressed="true"] { transform:rotate(0deg) translate(-3px,-3px); box-shadow:0 0 0 2px var(--ink), 10px 10px 0 var(--cyan); }
.terr8__stack.is-picked .tsk:not([aria-pressed="true"]):not(:hover) { opacity:.6; }

.tsk__n {
  position:absolute; top:8px; right:14px; z-index:0;
  font-family:var(--font-display); font-size:clamp(1.875rem,2.6vw,2.5rem); line-height:.8;
  -webkit-text-stroke:1.5px rgba(0,0,0,.16); color:transparent;
}
.tsk h3 { margin:0; display:flex; flex-direction:column; gap:3px; position:relative; z-index:1; padding-right:52px; }
.tsk__kick { font-family:var(--font-core); font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase; color:rgba(0,0,0,.42); transition:color var(--t-colour) var(--ease); }
.tsk h3 em { font-family:var(--font-display); font-style:normal; font-size:clamp(1.25rem,1.7vw,1.625rem); line-height:.95; text-transform:uppercase; letter-spacing:.01em; }
.tsk:hover .tsk__kick, .tsk[aria-pressed="true"] .tsk__kick { color:var(--cyan); }
.tsk p { margin:0; font-size:var(--fs-small); line-height:1.45; color:var(--ink-600); max-width:46ch; }
.tsk__tag {
  margin-top:2px; padding:5px 11px; border-radius:var(--r-pill);
  font-size:var(--fs-micro); font-weight:700; letter-spacing:var(--track-eyebrow); text-transform:uppercase;
  box-shadow:inset 0 0 0 1.5px rgba(0,0,0,.2);
  transition:background-color var(--t-colour) var(--ease), box-shadow var(--t-colour) var(--ease);
}
.tsk:hover .tsk__tag, .tsk[aria-pressed="true"] .tsk__tag { background:var(--cyan); box-shadow:inset 0 0 0 1.5px var(--ink); }

@media (max-width:1023px) {
  .terr8__head { grid-template-columns:1fr; align-items:start; gap:var(--s-5); }
  .terr8__body { grid-template-columns:1fr; gap:var(--s-6); }
}
@media (max-width:599px) {
  .tsk h3 { padding-right:44px; }
  .terrfig figcaption { flex-direction:column; align-items:flex-start; gap:var(--s-3); }
  .terrfig__badge { right:-8px; bottom:-16px; min-width:96px; padding:10px 13px 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .tsk { transform:none; transition:box-shadow var(--t-colour) linear, opacity var(--t-colour) linear; }
  .tsk:hover, .tsk[aria-pressed="true"] { transform:none; }
  .terrfig__badge, .terrmap__go i { transition:background-color var(--t-colour) linear; transform:none; }
}
