/* Digital Legends v2 — brand pinned (Black #000000 hero/header, Red #F5333F, Teal #0481A7, Orange #F07B22, Grey #B3B6B7).
   Motion: transform+opacity only, <300ms UI, custom easings, stagger reveals, reduced-motion safe. */
:root{
  --black:#000; --ink:#101214; --coal:#0B0D0F; --panel:#14181B; --line-d:#262C31;
  --white:#fff; --grey:#B3B6B7; --paper:#F6F7F8; --line:#E7E9EB; --muted:#5B6166; --muted-d:#9AA3A8;
  --red:#F5333F; --teal:#0481A7; --orange:#F07B22; --lime:#C8CC57;
  --ease-out:cubic-bezier(.23,1,.32,1); --ease-io:cubic-bezier(.77,0,.175,1);
  --font-head:"Avenir Next","Avenir","Montserrat","Segoe UI",system-ui,sans-serif;
  --font-body:"Avenir Next","Avenir","Segoe UI",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);color:var(--ink);background:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased}
.wrap{max-width:1400px;margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-999px;top:0;background:var(--red);color:#fff;padding:8px 14px;z-index:99;border-radius:0 0 8px 0}
.skip:focus{left:0}
h1,h2,h3{font-family:var(--font-head);font-weight:900;letter-spacing:-.02em;line-height:1.02;margin:0 0 12px}
h1{font-size:clamp(40px,5.2vw,76px)}
h2{font-size:clamp(28px,3.4vw,44px)}
h3{font-size:19px}
.kicker{text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:800;color:var(--red);margin:0 0 10px}
.section-dark .kicker{color:var(--orange)}
.lede{font-size:18px;max-width:62ch}
.lede.small{font-size:16px}
.section{padding:72px 0}
.section-dark{background:var(--coal);color:#F2F4F5}
.section-dark a{color:#FFB38A}
a{color:var(--teal);text-underline-offset:3px}
.fine{font-size:13px;color:var(--muted)}
.section-dark .fine{color:var(--muted-d)}
code{background:#EFF1F2;padding:1px 5px;border-radius:4px;font-size:12px}
.section-dark code{background:#1D2328;color:#D7DCDF}

/* header: brand black, glass inner edge */
.site-header{position:sticky;top:0;z-index:30;background:rgba(0,0,0,.94);border-bottom:1px solid #222;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 24px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff}
.brand-mark{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 50% 50%, var(--red) 0 26%, transparent 27%),repeating-conic-gradient(#fff 0 4deg, transparent 4deg 9deg);border:2px solid #fff;flex:none}
.brand-word{font-family:var(--font-head);font-weight:900;letter-spacing:.06em;font-size:15px}
.brand-dot{color:var(--red)}
.site-nav{display:flex;gap:16px;align-items:center}
.site-nav a{color:#fff;text-decoration:none;font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;transition:color 160ms var(--ease-out),transform 160ms var(--ease-out)}
.nav-cta{border:1px solid var(--red);padding:8px 13px;border-radius:7px}

/* split + asymmetric grids */
.split{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:48px;align-items:start}
.split-head{position:sticky;top:84px}
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-top:24px}
.span7{grid-column:span 7}.span5{grid-column:span 5}
.panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px;box-shadow:0 20px 40px -22px rgba(0,0,0,.12)}
.section-dark .panel{background:var(--panel);border-color:var(--line-d);box-shadow:none}
.rows{list-style:none;margin:12px 0 0;padding:0}
.rows li{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-top:1px solid var(--line);font-size:15px}
.rows li:first-child{border-top:0}
.section-dark .rows li{border-top-color:var(--line-d)}
.rows span{color:var(--muted);font-size:13.5px;text-align:right}
.section-dark .rows span{color:var(--muted-d)}
.strip{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line-d);border-radius:14px;overflow:hidden}
.strip li{padding:14px 16px;font-size:14px;border-left:1px solid var(--line-d)}
.strip li:first-child{border-left:0}

/* hero: asymmetric split */
.hero{background:var(--black);color:#fff;padding:64px 0 56px;border-bottom:6px solid var(--red);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:40px;align-items:center}
.h-accent{color:var(--red)}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.btn{display:inline-block;padding:12px 18px;border-radius:9px;font-weight:800;text-decoration:none;font-size:15px;transition:transform 160ms var(--ease-out),background-color 200ms var(--ease-out),border-color 200ms var(--ease-out),opacity 160ms var(--ease-out)}
.btn-red{background:var(--red);color:#fff}
.btn-ghost{border:2px solid #fff;color:#fff}
.btn-ghost-dark{border:2px solid var(--ink);color:var(--ink)}
.btn-red{background:var(--red);color:#fff}
.hero-panel{background:#101315;border:1px solid #262C31;border-radius:20px;padding:22px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.hp-row{display:flex;justify-content:space-between;align-items:center}
.hp-label{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted-d)}
.live-dot{width:9px;height:9px;border-radius:50%;background:var(--lime);animation:pulse 2.4s var(--ease-out) infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.8)}}
.hp-big{font-size:34px;font-weight:900;margin:10px 0 6px}
.hp-big span{font-size:15px;font-weight:600;color:var(--muted-d)}
.hp-list{list-style:none;margin:0;padding:0}
.hp-list li{display:flex;justify-content:space-between;padding:9px 0;border-top:1px solid var(--line-d);font-size:14.5px}
.hp-list em{color:var(--muted-d);font-style:normal}
.hp-foot{display:flex;justify-content:space-between;gap:10px;margin-top:14px;font-size:13.5px;color:var(--muted-d)}
.hp-foot a{color:#fff}

/* timeline rows */
.tl{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.tl li{display:grid;grid-template-columns:180px 1fr;gap:18px;padding:15px 4px;border-bottom:1px solid var(--line)}
.t-date{font-weight:900;font-size:13.5px;text-transform:uppercase;letter-spacing:.05em}
.t-body{font-size:15.5px;max-width:72ch}

/* partner zigzag rows */
.feat{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:28px;padding:26px 0;border-top:1px solid var(--line);align-items:center}
.feat:last-child{border-bottom:1px solid var(--line)}
.section-dark .feat{border-top-color:var(--line-d)}
.section-dark .feat:last-child{border-bottom-color:var(--line-d)}
.feat.flip>div:first-child{order:2}
.feat.flip>.f-meta{order:1}
.f-num{font-size:12px;font-weight:800;letter-spacing:.14em;color:var(--red);margin:0 0 6px}
.f-meta{display:flex;flex-direction:column;gap:6px;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:18px;font-size:13.5px;color:var(--muted)}
.section-dark .f-meta{background:var(--panel);border-color:var(--line-d);color:var(--muted-d)}

/* gallery: varied ratios */
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.g{margin:0}
.g-tall{grid-row:span 2}
.g-wide{grid-column:1/-1}
.gallery figcaption{font-size:12.5px;color:var(--muted-d);margin-top:8px}
.section:not(.section-dark) .gallery figcaption{color:var(--muted)}
.gallery img{display:block;width:100%;border-radius:16px;border:1px solid var(--line-d);object-fit:cover}
.g-tall img{aspect-ratio:4/5}
.g:not(.g-tall):not(.g-wide) img{aspect-ratio:1/1}
.g-wide img{aspect-ratio:16/9}
.ticks{list-style:none;margin:18px 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.section-dark .ticks{border-color:var(--line-d)}
.ticks li{padding:12px 15px;font-size:14px;border-top:1px solid var(--line)}
.section-dark .ticks li{border-top-color:var(--line-d)}
.ticks li:nth-child(-n+2){border-top:0}
.ticks li:nth-child(even){border-left:1px solid var(--line)}
.section-dark .ticks li:nth-child(even){border-left-color:var(--line-d)}

/* contact */
.contact-box{background:var(--panel);border:1px solid var(--line-d);border-radius:20px;padding:28px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.contact-box.light{background:#fff;border-color:var(--line);box-shadow:0 20px 40px -22px rgba(0,0,0,.12)}
.contact-links{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
.site-footer{margin-top:26px;padding:18px 0 8px;border-top:1px solid var(--line-d);font-size:13px;color:var(--muted-d)}
.site-footer.light{border-top-color:var(--line);color:var(--muted)}

/* reveal: opacity + small rise, staggered, once */
.rv{opacity:0;transform:translateY(10px) scale(.995);transition:opacity 240ms var(--ease-out),transform 240ms var(--ease-out);transition-delay:calc(var(--i,0)*60ms)}
.rv.in{opacity:1;transform:none}

/* touch-gated hover only */
@media (hover:hover) and (pointer:fine){
  .btn:hover{transform:translateY(-1px)}
  .site-nav a:hover{color:var(--orange)}
  .panel:hover{transform:translateY(-2px)}
  .panel{transition:transform 200ms var(--ease-out)}
}
.btn:active{transform:scale(.97)}
:focus-visible{outline:3px solid var(--orange);outline-offset:2px}

@media (max-width:960px){
  .split,.hero-grid{grid-template-columns:1fr;gap:26px}
  .split-head{position:static}
  .span7,.span5{grid-column:1/-1}
  .strip{grid-template-columns:1fr 1fr}
  .strip li:nth-child(3){border-left:0}
  .feat{grid-template-columns:1fr}
  .feat.flip>div:first-child{order:0}
  .gallery{grid-template-columns:1fr}
  .g-tall{grid-row:auto}.g-tall .ph{min-height:300px}
  .site-nav{display:flex;overflow-x:auto;padding-bottom:2px}
  .section{padding:52px 0}
}
@media (max-width:600px){
  .wrap{padding:0 16px}
  .ticks,.strip{grid-template-columns:1fr}
  .strip li{border-left:0;border-top:1px solid var(--line-d)}
  .strip li:first-child{border-top:0}
  .ticks li:nth-child(even){border-left:0}
  .ticks li:nth-child(-n+2){border-top:1px solid var(--line)}
  .ticks li:first-child{border-top:0}
  .tl li{grid-template-columns:1fr;gap:4px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:opacity 160ms var(--ease-out)}
  .live-dot{animation:none}
}