/* ---------- product page ---------- */
.pd{ padding-top:calc(var(--nav-h) + clamp(24px,4vw,56px)) }
.pd-top{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:clamp(28px,5vw,72px); align-items:start }
.pd-gallery{ position:sticky; top:calc(var(--nav-h) + 24px) }
.pd-main{ position:relative; margin:0; border-radius:var(--r-card); overflow:hidden; background:var(--void-2); border:1px solid var(--edge); aspect-ratio:16/9 }
.pd-main img{ width:100%; height:100%; object-fit:cover; display:block; transition:opacity .35s } .pd-main img.swap{ opacity:0 }
.pd-main figcaption{ position:absolute; left:16px; bottom:14px; font-family:var(--ff-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--bone); background:rgba(5,10,12,.55); padding:6px 10px; border-radius:var(--pill); backdrop-filter:blur(6px) }
.pd-arrow{ position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%; border:1px solid var(--edge); background:rgba(5,10,12,.55); color:var(--bone); display:grid; place-items:center; cursor:pointer; padding:0; backdrop-filter:blur(6px); opacity:0; transition:opacity .25s,border-color .25s }
.pd-arrow svg{ width:16px; height:16px } .pd-arrow.prev{ left:12px } .pd-arrow.next{ right:12px } .pd-main:hover .pd-arrow,.pd-arrow:focus-visible{ opacity:1 } .pd-arrow:hover{ border-color:var(--ice) }
@media (hover:none){ .pd-arrow{ opacity:1 } }
.pd-thumbs{ display:grid; grid-template-columns:repeat(8,1fr); gap:8px; margin-top:10px; padding:2px }
.pd-thumb{ appearance:none; padding:0; border:1px solid var(--edge); border-radius:10px; overflow:hidden; background:var(--void-2); cursor:pointer; aspect-ratio:16/10; opacity:.6; transition:opacity .25s,border-color .25s }
.pd-thumb img{ width:100%; height:100%; object-fit:cover; display:block } .pd-thumb:hover{ opacity:.9 } .pd-thumb.on{ opacity:1; border-color:var(--ice) }
.pd-buy{ display:grid; gap:18px; align-content:start }
.pd-batch{ margin:0; font-family:var(--ff-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ash) }
.pd h1{ font-size:clamp(40px,4.6vw,64px); max-width:none; margin:-6px 0 0 }
.pd-lede{ font-size:clamp(16px,1.25vw,18px); line-height:1.5; color:var(--ash); margin:0; max-width:44ch }
.pd-price{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; padding:18px 0; border-top:1px solid var(--edge); border-bottom:1px solid var(--edge) }
.pd-price b{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; font-family:var(--ff-display); font-weight:600; font-size:clamp(48px,4.5vw,64px); letter-spacing:-.035em; line-height:1.1; color:var(--ice) }
.pd-sub{ font-family:var(--ff-display); font-size:clamp(21px,2vw,28px); font-weight:600; letter-spacing:-.01em; color:var(--bone) }
.pd-plus{ width:100%; font-size:17px; font-weight:600; color:var(--bone); margin-left:0 }
.pd-opts{ margin:0; display:grid; gap:0 } .pd-opts > div{ display:grid; grid-template-columns:72px 1fr; gap:14px; padding:10px 0; border-bottom:1px solid var(--edge); font-size:15px }
.pd-opts dt{ font-family:var(--ff-mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ash); padding-top:3px } .pd-opts dd{ margin:0 } .pd-opts .count{ font-weight:500 }
.pd-cta{ display:grid; gap:10px; margin-top:4px } .pd-cta .btn{ width:100%; justify-content:center }
.pd-trust{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px 18px; font-size:13px; color:var(--ash) }
.pd-trust li::before{ content:"●"; color:var(--ice); font-size:6px; vertical-align:2px; margin-right:8px }
.pd-acc{ margin-top:8px; border-top:1px solid var(--edge) }
.pd-acc details{ border-bottom:1px solid var(--edge) }
.pd-acc summary{ list-style:none; cursor:pointer; padding:16px 0; font-family:var(--ff-display); font-size:18px; letter-spacing:-.01em; display:flex; justify-content:space-between; align-items:center; gap:12px }
.pd-acc summary::-webkit-details-marker{ display:none }
.pd-acc summary::after{ content:""; width:9px; height:9px; border-right:1px solid var(--ash); border-bottom:1px solid var(--ash); transform:rotate(45deg); transition:transform .25s; flex:none; margin-right:4px }
.pd-acc details[open] summary::after{ transform:rotate(-135deg) }
.pd-acc details > *:not(summary){ margin:0 0 16px } .pd-acc p{ font-size:15px; line-height:1.55; color:var(--ash) } .pd-acc p + p{ margin-top:-6px }
.pd-list{ list-style:none; padding:0; display:grid; gap:8px; font-size:15px } .pd-list li::before{ content:"●"; color:var(--ice); font-size:6px; vertical-align:2px; margin-right:10px }
.pd-specs{ display:grid; gap:0 } .pd-specs > div{ display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:9px 0; border-top:1px solid var(--edge); font-size:14.5px } .pd-specs > div:first-child{ border-top:0 }
.pd-specs dt{ color:var(--ash) } .pd-specs dd{ margin:0 }
.pd-flow{ margin-top:clamp(56px,8vw,112px); padding-bottom:clamp(56px,8vw,112px) }
.pd-flow-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,3vw,40px); border-top:1px solid var(--edge); padding-top:28px }
.pd-flow-grid h2{ font-size:22px; margin-bottom:8px; letter-spacing:-.015em; line-height:1.15 } .pd-flow-grid p{ margin:0; color:var(--ash); font-size:15px; line-height:1.5 }
@media (max-width:900px){
  .pd-top{ grid-template-columns:1fr; gap:24px } .pd-gallery{ position:static }
  .pd-thumbs{ grid-template-columns:repeat(4,1fr); gap:8px } .pd-thumb{ border-radius:10px; aspect-ratio:16/9 }
  .pd h1{ font-size:40px } .pd-price{ padding:14px 0 } .pd-acc summary{ padding:14px 0; font-size:17px }
  .pd-plus{ margin-left:0; width:100% }
  .pd-flow-grid{ grid-template-columns:1fr; gap:22px }
}

/* Local purchase-page redesign: reference structure, STASIS identity. */
.pd-body { --ash:#9BA9B0; }
.pd { padding-top:calc(var(--nav-h) + 42px); }
.pd-top { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,5vw,72px); }
.pd-gallery { top:calc(var(--nav-h) + 28px); }
.pd-main { aspect-ratio:1/1; border-radius:16px; background:#060c0f; }
.pd-main img { object-fit:contain; }
.pd-main figcaption.sr-only { position:absolute; padding:0; }
.pd-arrow { opacity:1; }
.pd-thumbs { grid-template-columns:repeat(4,1fr); gap:10px; margin-top:12px; }
.pd-thumb { border-radius:8px; aspect-ratio:16/10; }
.pd-buy { gap:0; }
.pd-batch { color:var(--ice); font-size:10px; margin:0 0 16px; }
.pd h1 { font-size:clamp(34px,3.5vw,50px); margin:0 0 14px; letter-spacing:-.04em; line-height:1.08; }
.pd h1 span { display:block; color:var(--ash); font-weight:300; }
.pd-lede { font-size:16px; max-width:42ch; margin-bottom:22px; }
.purchase-price { display:flex; align-items:center; gap:16px; }
.purchase-price strong { font:400 42px/1.1 var(--ff-display); letter-spacing:-.04em; }
.purchase-price s { color:var(--ash); font-size:21px; }
.purchase-price > span { font-size:11px; color:var(--ice); background:#132a30; padding:5px 9px; border-radius:4px; }
.purchase-once { margin:7px 0 20px; color:var(--ash); font-size:13px; }
.purchase-finish { display:flex; align-items:center; justify-content:space-between; padding:0 0 18px; font-size:13px; color:var(--ash); }
.purchase-finish strong { color:var(--bone); display:flex; align-items:center; gap:9px; font-weight:400; }
.purchase-finish i { display:inline-block; width:22px; height:22px; border-radius:50%; background:#070a0b; box-shadow:0 0 0 1px #63717b,inset 0 0 0 4px #151d20; }
.purchase-benefit { background:var(--void-2); border:1px solid var(--edge); padding:13px 16px; border-radius:10px; margin-bottom:10px; }
.purchase-benefit strong { font-size:14px; font-weight:500; }
.purchase-benefit p { color:var(--ash); font-size:12px; line-height:1.5; margin:4px 0 0; }
.pd-cta { margin:6px 0 0; }
.pd-cta .btn { border-radius:10px; display:flex; justify-content:space-between; padding:16px 20px; font-size:13px; }
.pd-cta .btn span { font-size:20px; line-height:1; }
.purchase-payment { text-align:center; font-size:11px; color:var(--ash); margin:12px 0 22px; }
.purchase-shipping { border-top:1px solid var(--edge); padding-top:20px; }
.purchase-shipping strong { font-weight:500; font-size:14px; }
.purchase-shipping p,.purchase-small { color:var(--ash); font-size:12px; line-height:1.65; margin:5px 0 16px; }
.purchase-included { list-style:none; padding:0; margin:0 0 16px; font-size:13px; display:grid; gap:9px; }
.purchase-included li { position:relative; padding-left:22px; }
.purchase-included li::before { content:'✓'; color:var(--ice); position:absolute; left:0; }
.purchase-wait { justify-self:start; border:0; border-bottom:1px solid var(--ash); background:none; padding:0 0 2px; font-size:12px; cursor:pointer; color:var(--ash); }
.buy-features { padding-block:100px; }
.buy-section-head h2,.buy-membership h2,.buy-faq h2,.buy-final h2 { font-size:clamp(30px,3.7vw,48px); line-height:1.1; }
.buy-section-head > p { color:var(--ash); margin:15px 0 36px; }
.buy-feature-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:32px 64px; }
.buy-feature-grid article { border-top:1px solid var(--edge); padding-top:22px; }
.buy-feature-grid h3 { font-size:21px; }
.buy-feature-grid p { color:var(--ash); font-size:15px; max-width:44ch; margin-bottom:0; }
.buy-membership { background:var(--void-2); padding-block:72px; }
.membership-grid { display:grid; grid-template-columns:1fr 1fr; gap:72px; }
.membership-grid > div > p:last-child { color:var(--ash); max-width:36ch; margin:22px 0 0; font-size:16px; }
.membership-prices { display:grid; gap:28px; }
.membership-prices > div + div { border-top:1px solid var(--edge); padding-top:28px; }
.membership-prices span { display:block; font-size:14px; margin-bottom:12px; }
.membership-prices strong { display:block; font:400 42px/1 var(--ff-display); color:var(--ice); }
.membership-prices s { color:var(--ash); font-size:24px; margin-left:12px; }
.membership-prices small { font-size:16px; color:var(--ash); }
.membership-prices p { font-size:13px; color:var(--ash); margin:14px 0 0; max-width:42ch; }
.buy-faq { padding-block:90px; max-width:880px; }
.buy-faq .pd-acc { margin-top:30px; }
.buy-faq summary { min-height:60px; font-size:17px; }
.buy-faq details p { max-width:74ch; line-height:1.7; }
.buy-faq a { text-decoration:underline; }
.buy-final { text-align:center; padding:0 0 96px; }
.buy-final p { color:var(--ash); font-size:15px; margin:20px 0 28px; }
.buy-final .btn { border-radius:10px; }
.purchase-dock { position:fixed; bottom:18px; left:50%; transform:translateX(-50%); width:min(700px,calc(100% - 32px)); z-index:50; padding:12px 16px; background:#102026; border:1px solid #29434c; border-radius:12px; box-shadow:0 12px 48px #0006; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.purchase-dock[hidden] { display:none; }
.purchase-dock > div:first-child { display:grid; gap:2px; }
.purchase-dock > div:last-child { display:flex; gap:14px; align-items:center; }
.purchase-dock span { font-size:11px; color:var(--ash); }
.purchase-dock s { color:var(--ash); font-size:13px; }
.purchase-dock .btn { border-radius:8px; padding:10px 18px; }
@media(max-width:900px){
 .pd-top { grid-template-columns:1fr 1fr; gap:26px; }
 .pd-gallery { position:sticky; }
 .pd-thumbs { gap:6px; }
 .pd h1 { font-size:34px; }
 .membership-grid { gap:32px; }
}
@media(max-width:640px){
 .pd { padding-top:calc(var(--nav-h) + 20px); }
 .pd-top { grid-template-columns:1fr; gap:28px; }
 .pd-gallery { position:static; }
 .pd-main { aspect-ratio:5/4; }
 .pd-thumbs { grid-template-columns:repeat(8,72px); overflow-x:auto; padding:3px; scrollbar-width:thin; }
 .pd-thumb { aspect-ratio:4/3; }
 .pd h1 { font-size:38px; }
 .pd h1 span { display:inline; }
 .pd-batch { margin-bottom:12px; }
 .buy-features { padding-block:64px; }
 .buy-feature-grid { grid-template-columns:1fr; gap:24px; }
 .membership-grid { grid-template-columns:1fr; gap:36px; }
 .buy-membership { padding-block:52px; }
 .buy-faq { padding-block:60px; }
 .buy-final { padding-bottom:70px; }
 .purchase-dock { bottom:10px; padding:10px 12px; }
 .purchase-dock s { display:none; }
 .pd-body footer { padding-bottom:100px; }
}
@media(prefers-reduced-motion:reduce){ .pd-main img,.pd-thumb,.pd-arrow { transition:none; } }
.pd-gallery,.pd-buy { min-width:0; }

/* Founding batch benefits and access explanation. */
.purchase-founding { border-color:#35545c; background:#102329; }
.purchase-founding > strong { color:var(--ice); }
.purchase-founding > a { display:inline-flex; align-items:center; gap:12px; margin-top:10px; color:var(--bone); font-size:12px; text-decoration:underline; text-underline-offset:4px; }
.membership-grid > div > .founding-access-note { margin-top:18px; font-size:13px; color:var(--ice); }
.founding-benefit-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; margin-top:52px; }
.founding-benefit-grid article { border-top:1px solid #29434c; padding-top:24px; }
.founding-category { display:block; color:var(--ice); font-size:12px; margin-bottom:14px; }
.founding-benefit-grid h3 { font-size:22px; line-height:1.2; }
.founding-benefit-grid p { color:var(--ash); font-size:15px; line-height:1.65; margin:14px 0 0; }
.founding-expectations { margin-top:38px; padding-top:28px; border-top:1px solid var(--edge); }
.founding-expectations strong { font-weight:500; font-size:17px; }
.founding-expectations p { color:var(--ash); font-size:15px; line-height:1.65; max-width:78ch; margin:10px 0; }
.founding-expectations > span { display:block; color:var(--ash); font-size:12px; max-width:90ch; }
@media(max-width:640px){ .founding-benefit-grid { grid-template-columns:1fr; gap:26px; margin-top:36px; } .founding-benefit-grid article { padding-top:20px; } }