:root{
    --void:#0A0A0B;--ink:#060607;--raise:#0E0E10;--bone:#F4F2EC;
    --smoke:#73737A;--ash:#46464B;--hair:rgba(255,255,255,.10);--hair-soft:rgba(255,255,255,.055);
    --blood:#6E0B14;--blood-lit:#9A1422;--blood-bright:#C2152A;
    --chrome-hi:#FFFFFF;--chrome-1:#EDEEF1;--chrome-2:#A7A9B0;--chrome-3:#6F7178;
    --serif:"Bodoni Moda",Georgia,serif;--grot:"Hanken Grotesk",system-ui,sans-serif;
    --anton:"Anton",Impact,sans-serif;--mono:"JetBrains Mono",ui-monospace,monospace;
    --ease:cubic-bezier(.16,1,.3,1);
  }
  *{box-sizing:border-box;margin:0;padding:0;border-radius:0}
  html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
  body{background:var(--void);color:var(--bone);font-family:var(--grot);font-weight:300;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
  ::selection{background:var(--blood);color:var(--bone)}
  body::after{content:"";position:fixed;inset:-50%;z-index:80;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

  .wrap{max-width:1280px;margin:0 auto;padding:0 44px}
  @media(max-width:720px){.wrap{padding:0 22px}}
  .chrome{background:linear-gradient(176deg,var(--chrome-hi),var(--chrome-1) 22%,var(--chrome-3) 52%,var(--chrome-1) 74%,#fff);-webkit-background-clip:text;background-clip:text;color:transparent}
  .mono{font-family:var(--mono);font-weight:400;letter-spacing:.24em;text-transform:uppercase;font-size:11px;color:var(--smoke)}

  /* ── street wordmark ── */
  .wm{display:inline-flex;align-items:center;gap:.34em;transform:skewX(-9deg);text-decoration:none;line-height:.8}
  .wm .mk{position:relative;font-family:var(--anton);text-transform:uppercase;letter-spacing:.02em;line-height:.8;
    background:linear-gradient(168deg,#fff,#cfd1d6 30%,#7d7f86 55%,#e6e7ea 80%,#fff);-webkit-background-clip:text;background-clip:text;color:transparent}
  .wm .mk::after{content:"";position:absolute;left:-6%;top:56%;width:112%;height:.09em;background:var(--void);transform:rotate(-7deg)}
  .wm .dot{width:.16em;height:.16em;background:var(--blood-lit);align-self:flex-start;margin-top:.12em}

  /* ── nav ── */
  nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:20px 44px;transition:background .5s var(--ease),backdrop-filter .5s var(--ease),border-color .5s var(--ease),padding .5s var(--ease);border-bottom:1px solid transparent}
  nav.scrolled{background:rgba(6,6,7,.62);backdrop-filter:blur(18px) saturate(140%);border-bottom:1px solid var(--hair-soft);padding:14px 44px}
  @media(max-width:720px){nav,nav.scrolled{padding:14px 22px}}
  nav .wm .mk{font-size:24px}
  .nav-links{display:flex;gap:32px;align-items:center}
  .nav-links a{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--smoke);text-decoration:none;transition:color .3s var(--ease);font-weight:400}
  .nav-links a:hover{color:var(--bone)}
  .nav-cta{border:1px solid var(--hair);padding:9px 18px;color:var(--bone)!important;transition:border-color .3s,background .3s}
  .nav-cta:hover{border-color:var(--blood-lit);background:rgba(110,11,20,.12)}
  @media(max-width:880px){.nav-links a:not(.nav-cta){display:none}}
  a:focus-visible,button:focus-visible{outline:1px solid var(--chrome-1);outline-offset:4px}

  /* ── hero ── */
  .hero{position:relative;height:100svh;min-height:660px;overflow:hidden;display:flex;align-items:flex-end}
  .hero-bg{position:absolute;inset:0;background-image:url('../img/hero-dive.jpg');background-size:cover;background-position:44% 22%;filter:saturate(.5) contrast(1.12) brightness(.7);transform:scale(1.04);animation:drift 24s ease-in-out infinite alternate}
  @keyframes drift{to{transform:scale(1.08) translateX(-1.2%)}}
  .hero-grade{position:absolute;inset:0;background:
    radial-gradient(125% 95% at 52% 32%,transparent 38%,rgba(0,0,0,.55)),
    linear-gradient(180deg,rgba(6,6,7,.55) 0%,transparent 16%,transparent 42%,rgba(10,10,11,.82) 86%,var(--void) 100%)}
  .hero-blood{position:absolute;inset:0;mix-blend-mode:multiply;background:
    linear-gradient(180deg,transparent 42%,rgba(110,11,20,.5) 100%),
    radial-gradient(90% 70% at 50% 128%,rgba(110,11,20,.55),transparent 60%)}
  .hero-inner{position:relative;z-index:2;width:100%;padding-bottom:64px}
  .hero-eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:24px;opacity:0;transform:translateY(14px);animation:rise .9s var(--ease) .2s forwards}
  .hero-eyebrow .bar{width:30px;height:2px;background:var(--blood-lit)}
  h1.hero-title{font-family:var(--anton);text-transform:uppercase;font-weight:400;font-size:clamp(3rem,9vw,8.4rem);line-height:.86;letter-spacing:.005em;transform:skewX(-4deg);max-width:15ch;text-shadow:0 18px 50px rgba(0,0,0,.6)}
  h1.hero-title .ln{display:block;overflow:hidden}
  h1.hero-title .ln i{display:block;font-style:normal;transform:translateY(110%);animation:reveal 1.05s var(--ease) forwards}
  h1.hero-title .ln:nth-child(1) i{animation-delay:.32s}
  h1.hero-title .ln:nth-child(2) i{animation-delay:.44s}
  h1.hero-title .dot{color:var(--blood-bright)}
  .hero-sub{margin-top:26px;max-width:42ch;font-size:clamp(1rem,1.4vw,1.18rem);color:#CDCDD2;font-weight:300;opacity:0;transform:translateY(14px);animation:rise 1s var(--ease) .85s forwards}
  .hero-actions{margin-top:34px;display:flex;gap:16px;align-items:center;flex-wrap:wrap;opacity:0;transform:translateY(14px);animation:rise 1s var(--ease) 1s forwards}
  .btn{font-family:var(--grot);font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:12px;transition:all .35s var(--ease)}
  .btn-primary{background:var(--bone);color:var(--ink);padding:15px 30px;border:1px solid var(--bone)}
  .btn-primary:hover{background:transparent;color:var(--bone)}
  .btn-ghost{color:#CDCDD2;padding:15px 2px;background:none;border:none}
  .btn-ghost:hover{color:var(--bone)}
  .btn-ghost .arr{transition:transform .35s var(--ease)}.btn-ghost:hover .arr{transform:translateX(5px)}
  .hero-slate{position:absolute;right:44px;bottom:64px;z-index:2;text-align:right;display:flex;flex-direction:column;gap:6px;opacity:0;animation:rise 1s var(--ease) 1.2s forwards}
  .hero-slate .s{display:flex;align-items:center;justify-content:flex-end;gap:8px}
  .hero-slate .s .tk{width:6px;height:6px;background:var(--blood-lit)}
  @media(max-width:720px){.hero-slate{display:none}}

  @keyframes reveal{to{transform:translateY(0)}}
  @keyframes rise{to{opacity:1;transform:translateY(0)}}

  /* ── sections ── */
  section{position:relative;z-index:3}
  .band{padding:128px 0;border-top:1px solid var(--hair-soft)}
  .sec-mark{display:flex;align-items:center;gap:16px;margin-bottom:52px}
  .sec-mark .ln{height:1px;flex:1;background:var(--hair-soft)}
  .reveal-up{opacity:0;transform:translateY(28px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
  .reveal-up.in{opacity:1;transform:translateY(0)}

  /* thesis */
  .thesis-lead{font-family:var(--serif);font-weight:400;font-size:clamp(1.7rem,3.6vw,3.1rem);line-height:1.18;letter-spacing:-.01em;max-width:20ch;margin-bottom:78px}
  .thesis-lead em{font-style:italic}
  .owns{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hair-soft)}
  @media(max-width:820px){.owns{grid-template-columns:1fr}}
  .own{background:var(--void);padding:40px 36px 46px;position:relative}
  .own::before{content:"";position:absolute;top:0;left:0;width:34px;height:2px;background:var(--blood-lit)}
  .own .n{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--ash);margin-bottom:44px}
  .own h3{font-family:var(--anton);text-transform:uppercase;font-weight:400;font-size:1.7rem;letter-spacing:.01em;margin-bottom:14px;transform:skewX(-4deg)}
  .own p{color:var(--smoke);font-size:.98rem;max-width:24ch}

  /* the lot — editorial provenance dossier, no render */
  .lot{border-top:1px solid var(--hair);background:linear-gradient(180deg,#060607,#0A0A0B 60%)}
  .lot-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:8px}
  .lot-no{font-family:var(--mono);font-size:12px;letter-spacing:.3em;color:var(--smoke);margin-bottom:16px}
  .lot-name{font-family:var(--anton);text-transform:uppercase;font-weight:400;font-size:clamp(2.4rem,6vw,5rem);line-height:.88;letter-spacing:.01em;transform:skewX(-4deg)}
  .lot-house{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--chrome-2);font-size:1.15rem;margin-top:14px}
  .toggle{display:inline-flex;border:1px solid var(--hair);overflow:hidden;flex:0 0 auto}
  .toggle button{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;background:none;border:none;color:var(--smoke);padding:12px 24px;cursor:pointer;transition:color .35s,background .35s}
  .toggle button.active{color:var(--ink);background:var(--bone)}
  .lot[data-mode="combat"] .toggle button.active{background:var(--blood-lit);color:var(--bone)}
  .panel{position:relative;margin:36px 0 60px;max-width:62ch;min-height:78px}
  .panel .view{position:absolute;inset:0;opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease),transform .5s var(--ease);pointer-events:none}
  .panel .view.show{opacity:1;transform:none;pointer-events:auto;position:relative}
  .panel p{color:#C4C4C9;font-size:clamp(1.05rem,1.6vw,1.32rem);line-height:1.55;font-family:var(--serif);font-weight:400}
  .panel .combat p{color:#D8B4B8}

  /* provenance trail */
  .trail{position:relative;display:grid;grid-template-columns:repeat(6,1fr);margin-bottom:6px;padding-top:30px}
  .trail::before{content:"";position:absolute;top:36px;left:0;right:0;height:1px;background:linear-gradient(90deg,var(--hair-soft),var(--hair) 50%,var(--hair-soft));transition:background .5s var(--ease)}
  .node{position:relative;padding-right:18px}
  .node .pt{width:11px;height:11px;border:1px solid var(--chrome-2);background:var(--void);transform:rotate(45deg);margin-bottom:24px}
  .node.claim .pt{border-color:var(--blood-bright);background:var(--blood)}
  .node.now .pt{background:var(--chrome-1);border-color:var(--chrome-1)}
  .node .ev{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--smoke);margin-bottom:8px}
  .node.claim .ev{color:var(--blood-bright)}
  .node.now .ev{color:var(--chrome-1)}
  .node .who{font-size:.95rem;color:var(--bone);line-height:1.35}
  .node .when{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--ash);margin-top:6px}
  .lot[data-mode="combat"] .trail::before{background:linear-gradient(90deg,var(--hair-soft),rgba(154,20,34,.55) 50%,var(--hair-soft))}
  @media(max-width:820px){
    .trail{grid-template-columns:1fr;padding-top:4px}
    .trail::before{top:6px;bottom:6px;left:5px;right:auto;width:1px;height:auto}
    .node{padding:0 0 26px 28px}
    .node .pt{position:absolute;left:0;top:3px;margin:0}
  }

  /* ledger + valuation */
  .lot-foot{display:grid;grid-template-columns:1.45fr .75fr;border-top:1px solid var(--hair);margin-top:50px}
  @media(max-width:820px){.lot-foot{grid-template-columns:1fr}}
  .ledger{border-right:1px solid var(--hair-soft)}
  @media(max-width:820px){.ledger{border-right:none}}
  .ledger .row{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:15px 40px 15px 0;border-bottom:1px solid var(--hair-soft)}
  @media(max-width:820px){.ledger .row{padding-right:0}}
  .ledger .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ash)}
  .ledger .v{font-size:.96rem;color:var(--bone);text-align:right;font-weight:400}
  .ledger .v.blood{color:var(--blood-bright)}
  .valuation{display:flex;flex-direction:column;justify-content:center;align-items:flex-end;padding:24px 0 24px 40px;text-align:right}
  @media(max-width:820px){.valuation{align-items:flex-start;padding:30px 0 0;text-align:left}}
  .valuation .vlbl{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ash);margin-bottom:14px}
  .valuation .val{font-family:var(--anton);font-weight:400;font-size:clamp(2.4rem,4.4vw,3.6rem);letter-spacing:.02em;transform:skewX(-4deg);line-height:1}

  /* duality */
  .duality{border-top:1px solid var(--hair)}
  .duo-half{padding:108px 0;position:relative}
  .duo-top{background:linear-gradient(180deg,#121110,#0A0A0B);border-bottom:1px solid var(--hair)}
  .duo-bot{background:linear-gradient(180deg,#0A0A0B,#140609)}
  .duo-label{font-family:var(--mono);font-size:11px;letter-spacing:.26em;text-transform:uppercase;margin-bottom:22px}
  .duo-top .duo-label{color:var(--chrome-2)}
  .duo-bot .duo-label{color:var(--blood-bright)}
  .duo-line{font-family:var(--anton);text-transform:uppercase;font-weight:400;font-size:clamp(2.2rem,6vw,5rem);line-height:.92;letter-spacing:.01em;max-width:15ch;transform:skewX(-4deg)}
  .duo-bot .duo-line em{font-style:normal;color:var(--blood-bright)}
  .duo-top .duo-line em{font-style:normal;background:linear-gradient(176deg,#fff,#cfd1d6 50%,#fff);-webkit-background-clip:text;background-clip:text;color:transparent}
  .duo-sub{margin-top:24px;color:var(--smoke);max-width:42ch;font-size:1.05rem}
  .duo-bot .duo-sub{color:#9A7479}

  /* creators */
  .cre-lead{font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,4.4vw,3.4rem);line-height:1.1;letter-spacing:-.01em;max-width:18ch}
  .cre-lead em{font-style:italic;color:var(--chrome-2)}
  .cre-body{margin-top:60px;display:grid;grid-template-columns:1.2fr 1fr;gap:58px;align-items:end}
  @media(max-width:820px){.cre-body{grid-template-columns:1fr;gap:36px}}
  .cre-body p{color:#BFBFC4;font-size:1.08rem;line-height:1.65;max-width:44ch}
  .cre-stats{display:flex;flex-direction:column;gap:1px;background:var(--hair-soft);border:1px solid var(--hair-soft)}
  .cre-stats .s{background:var(--void);padding:22px 26px;display:flex;justify-content:space-between;align-items:baseline}
  .cre-stats .s .big{font-family:var(--anton);font-weight:400;font-size:1.7rem;transform:skewX(-4deg)}
  .cre-stats .s .lbl{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--smoke);text-align:right;max-width:16ch}

  /* why now */
  .why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--hair-soft);margin-top:58px}
  @media(max-width:820px){.why-grid{grid-template-columns:1fr 1fr}}
  @media(max-width:480px){.why-grid{grid-template-columns:1fr}}
  .why{background:var(--void);padding:32px 26px 38px}
  .why .mono{display:block;margin-bottom:18px;color:var(--ash)}
  .why h4{font-family:var(--serif);font-weight:500;font-size:1.3rem;margin-bottom:10px}
  .why p{color:var(--smoke);font-size:.92rem;line-height:1.55}
  .why-close{font-family:var(--anton);text-transform:uppercase;font-weight:400;font-size:clamp(1.6rem,4vw,3rem);margin-top:62px;text-align:center;line-height:1.05;max-width:18ch;margin-left:auto;margin-right:auto;transform:skewX(-4deg)}
  .why-close em{font-style:normal;color:var(--blood-bright)}

  /* entry */
  .entry{padding:156px 0;text-align:center;border-top:1px solid var(--hair);position:relative;overflow:hidden}
  .entry::before{content:"";position:absolute;top:-40%;left:50%;transform:translateX(-50%);width:50vw;height:120%;background:radial-gradient(50% 50% at 50% 40%,rgba(110,11,20,.18),transparent 70%)}
  .entry .mono{display:block;margin-bottom:28px}
  .entry h2{font-family:var(--anton);text-transform:uppercase;font-weight:400;font-size:clamp(2.8rem,8vw,6.6rem);line-height:.9;letter-spacing:.01em;margin-bottom:22px;transform:skewX(-4deg)}
  .entry h2 .dot{color:var(--blood-bright)}
  .entry .sub{color:var(--smoke);max-width:38ch;margin:0 auto 42px;font-size:1.05rem}

  /* footer */
  footer{border-top:1px solid var(--hair-soft);padding:44px 0 58px}
  .foot-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px}
  .foot-row .wm .mk{font-size:20px}
  .foot-links{display:flex;gap:28px}
  .foot-links a{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--smoke);text-decoration:none;transition:color .3s}
  .foot-links a:hover{color:var(--bone)}
  .foot-fine{margin-top:32px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:var(--ash);text-transform:uppercase}

  @media(prefers-reduced-motion:reduce){
    *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
    .reveal-up{opacity:1;transform:none}
    h1.hero-title .ln i{transform:none}
    .hero-eyebrow,.hero-sub,.hero-actions,.hero-slate{opacity:1;transform:none}
    .hero-bg{transform:scale(1.06)}
  }
