:root{
    /* Apotheotik — three colours, no more */
    --orange:#FF4A2B;
    --black:#000000;
    --white:#FFFFFF;
    /* structural neutrals (UI only, never the logo) */
    --ink-1:#0a0a0a;
    --ink-2:#121212;
    --ink-3:#1c1c1c;
    --line:rgba(255,255,255,.12);
    --line-strong:rgba(255,255,255,.22);
    --muted:#9a9a9a;
    --muted-2:#6f6f6f;
    --type:"Bahnschrift SemiCondensed","Bahnschrift","Barlow Semi Condensed","Segoe UI",system-ui,sans-serif;
    --maxw:1240px;
    --gut:clamp(20px,5vw,72px);
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;background:var(--black);color:var(--white);
    font-family:var(--type);font-weight:400;
    font-size:clamp(16px,1.05vw,18px);line-height:1.6;
    -webkit-font-smoothing:antialiased;letter-spacing:.1px;
    overflow-x:hidden;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}

  .wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut);}

  /* labels / kickers */
  .label{
    font-weight:600;text-transform:uppercase;letter-spacing:.32em;
    font-size:.72rem;color:var(--muted);
  }
  .label .num{color:var(--orange);}
  h1,h2,h3{font-weight:700;line-height:1.02;letter-spacing:-.01em;margin:0;}
  h1{font-size:clamp(2.6rem,7.4vw,6.4rem);}
  h2{font-size:clamp(2rem,4.6vw,3.6rem);}
  h3{font-size:clamp(1.3rem,2.2vw,1.7rem);letter-spacing:0;}
  p{margin:0 0 1.1em;}
  .lead{font-size:clamp(1.12rem,1.7vw,1.45rem);line-height:1.5;color:#eaeaea;font-weight:400;}
  .muted{color:var(--muted);}

  /* ---------- logo mark ---------- */
  .apo-mark{width:1em;height:1em;overflow:visible;}
  .apo-mark .apo-arrow{fill:var(--orange);}
  .apo-mark .apo-dot{fill:var(--orange);}

  .wordmark{
    font-weight:700;letter-spacing:-.02em;color:var(--orange);
    font-size:1.25rem;line-height:1;text-transform:lowercase;
  }

  /* ---------- top nav ---------- */
  header.nav{
    position:sticky;top:0;z-index:50;
    background:rgba(0,0,0,.72);backdrop-filter:blur(12px);
    border-bottom:1px solid var(--line);
  }
  .nav-in{display:flex;align-items:center;justify-content:space-between;height:64px;}
  .brand{display:flex;align-items:center;gap:.6rem;}
  .brand .apo-mark{font-size:26px;}
  .nav-meta{display:flex;align-items:center;gap:1.4rem;}
  .nav-meta .label{color:var(--muted-2);}
  .nav-meta a:hover{color:var(--orange);}
  /* unified menu + breadcrumb */
  header.nav .wrap{max-width:none;}
  header.nav .nav-in{height:auto;padding:18px var(--gut);}
  header.nav .apo-mark{display:none;}
  header.nav .wm{height:22px;width:96px;color:#fff;display:block;}
  .nav-meta{gap:30px;}
  .nav-meta a{color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:1.5px;font-size:14px;transition:color .2s;}
  .nav-meta a:hover{color:#fff;}
  .nav-meta a.active{color:var(--orange);}
  .nav-meta a.cta{color:#000;background:var(--orange);padding:9px 18px;border-radius:2px;}
  .nav-meta a.cta:hover{background:#fff;color:#000;}
  .crumb{padding:18px 0 0;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
  .crumb a:hover{color:var(--orange);} .crumb .sep{margin:0 .6em;color:var(--muted-2);} .crumb .cur{color:#fff;}
  @media(max-width:680px){.nav-meta a:not(.cta){display:none;}}

  /* ---------- hero ---------- */
  .hero{position:relative;padding:clamp(56px,9vw,120px) 0 clamp(28px,4vw,52px);}
  .hero .kick{display:flex;gap:.9rem;align-items:center;margin-bottom:1.6rem;}
  .hero .kick .dot{width:7px;height:7px;border-radius:50%;background:var(--orange);}
  .hero h1{max-width:15ch;}
  .hero h1 em{font-style:normal;color:var(--orange);}
  .hero .lead{max-width:48ch;margin-top:1.5rem;}
  .credit-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem;}
  .chip{
    border:1px solid var(--line-strong);border-radius:999px;
    padding:.5rem 1rem;font-size:.78rem;font-weight:600;
    text-transform:uppercase;letter-spacing:.14em;color:#dcdcdc;
  }
  .chip.solid{background:var(--orange);border-color:var(--orange);color:var(--black);}

  .hero-figure{margin-top:clamp(34px,5vw,64px);position:relative;}
  .hero-figure .frame{
    border:1px solid var(--line);border-radius:14px;overflow:hidden;
    background:var(--ink-2);position:relative;
  }
  .hero-figure video,.hero-figure img{width:100%;display:block;aspect-ratio:16/9;object-fit:cover;background:#0a0a0a;}
  .play-tag{
    position:absolute;left:18px;bottom:16px;z-index:3;
    display:flex;align-items:center;gap:.6rem;
    background:rgba(0,0,0,.55);backdrop-filter:blur(6px);
    border:1px solid var(--line-strong);border-radius:999px;
    padding:.5rem .95rem;font-size:.74rem;font-weight:600;
    text-transform:uppercase;letter-spacing:.16em;
  }
  .play-tag .tri{
    width:0;height:0;border-left:9px solid var(--orange);
    border-top:6px solid transparent;border-bottom:6px solid transparent;
  }
  .hero-figure .frame.reel{cursor:pointer;}
  .hero-figure .frame iframe{width:100%;aspect-ratio:16/9;display:block;border:0;}

  /* ---------- meta strip ---------- */
  .meta{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:clamp(40px,6vw,80px);}
  .meta-grid{display:grid;grid-template-columns:repeat(5,1fr);}
  .meta-grid .cell{
    padding:clamp(20px,2.4vw,30px) clamp(14px,1.6vw,22px);
    border-left:1px solid var(--line);
  }
  .meta-grid .cell:first-child{border-left:0;}
  .meta-grid .k{font-size:.66rem;}
  .meta-grid .v{font-size:1.02rem;font-weight:600;margin-top:.5rem;color:#fff;line-height:1.25;}

  /* ---------- sections ---------- */
  section.block{padding:clamp(64px,10vw,150px) 0;border-top:1px solid var(--line);}
  .sec-head{margin-bottom:clamp(34px,5vw,64px);}
  .sec-head .label{margin-bottom:1.1rem;display:block;}
  .sec-head h2{max-width:18ch;}
  .sec-head .sub{max-width:54ch;margin-top:1.4rem;color:#cfcfcf;}

  .two{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(28px,5vw,72px);align-items:start;}
  .two.flip{grid-template-columns:1fr 1.1fr;}

  .factlist{list-style:none;margin:0;padding:0;}
  .factlist li{display:flex;gap:1rem;padding:1.05rem 0;border-top:1px solid var(--line);}
  .factlist li:last-child{border-bottom:1px solid var(--line);}
  .factlist .arw{color:var(--orange);font-weight:700;flex:0 0 auto;}
  .factlist .ft{color:#d6d6d6;}
  .factlist .ft b{color:#fff;font-weight:700;}

  /* figures / gallery */
  figure{margin:0;}
  .fig{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--ink-2);}
  .fig img,.fig video{width:100%;display:block;}
  figcaption{font-size:.78rem;color:var(--muted);padding:.85rem 1rem;letter-spacing:.04em;border-top:1px solid var(--line);}
  .cap-strong{color:#cfcfcf;font-weight:600;}

  .gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,1.8vw,22px);margin-top:clamp(28px,4vw,48px);}
  .gallery .span2{grid-column:1 / -1;}

  /* big stat row */
  .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,28px);margin-top:clamp(30px,4vw,52px);}
  .stat{border-top:2px solid var(--orange);padding-top:1.1rem;}
  .stat .n{font-size:clamp(2.2rem,4.4vw,3.4rem);font-weight:700;line-height:1;letter-spacing:-.02em;}
  .stat .n small{color:var(--orange);}
  .stat .t{font-size:.82rem;color:var(--muted);text-transform:uppercase;letter-spacing:.14em;margin-top:.7rem;}

  /* outro */
  .outro{background:var(--orange);color:var(--black);border-top:none;}
  .outro .label{color:rgba(0,0,0,.6);}
  .outro .label .num{color:var(--black);}
  .outro h2{color:var(--black);max-width:20ch;}
  .outro .quote{font-size:clamp(1.4rem,2.8vw,2.2rem);font-weight:600;line-height:1.2;max-width:24ch;margin-top:1.6rem;}
  .outro .quote .gr{display:block;font-size:.62em;font-weight:400;color:rgba(0,0,0,.62);margin-top:.6rem;}
  .outro .endcard{border:1px solid rgba(0,0,0,.18);border-radius:12px;overflow:hidden;background:#000;margin-top:clamp(30px,4vw,52px);}

  /* footer */
  footer.foot{background:var(--black);padding:clamp(56px,8vw,110px) 0 clamp(36px,5vw,60px);border-top:1px solid var(--line);}
  .foot-top{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;}
  .foot .lock{display:flex;align-items:center;gap:1rem;}
  .foot .lock .apo-mark{font-size:54px;}
  .foot .stack{font-weight:700;line-height:.92;font-size:1.5rem;color:var(--orange);text-transform:lowercase;letter-spacing:-.02em;}
  .foot .contact{text-align:right;font-size:.92rem;color:var(--muted);}
  .foot .contact a:hover{color:var(--orange);}
  .foot-bottom{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:clamp(40px,6vw,72px);padding-top:1.4rem;border-top:1px solid var(--line);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);}

  /* reveal — hidden initial state only when JS is active, so no-JS renderers show everything */
  .js .rev{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);}
  .js .rev.in{opacity:1;transform:none;}
  @media (prefers-reduced-motion:reduce){.js .rev{opacity:1;transform:none;transition:none;}}

  @media (max-width:880px){
    .meta-grid{grid-template-columns:repeat(2,1fr);}
    .meta-grid .cell{border-left:1px solid var(--line);}
    .meta-grid .cell:nth-child(odd){border-left:0;}
    .two,.two.flip{grid-template-columns:1fr;gap:2.4rem;}
    .stats{grid-template-columns:repeat(2,1fr);}
    .gallery{grid-template-columns:1fr;}
    .nav-meta .hide-sm{display:none;}
    .foot-top{align-items:flex-start;}
    .foot .contact{text-align:left;}
  }
