:root { --ink:#111315; --panel:#191c1f; --paper:#f4f3ef; --muted:#b9bec2; --copper:#d78753; --copper-light:#f3b17c; --line:rgba(255,255,255,.13); --paper-line:#c9c9c5; --max:1180px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--paper); background:var(--ink); font:1rem/1.65 Manrope,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
img { display:block; max-width:100%; }
figure,p,h1,h2,h3,dl,dd { margin:0; }
a { color:inherit; }
a:focus-visible { outline:3px solid var(--copper-light); outline-offset:4px; }
.shell { width:min(calc(100% - 48px),var(--max)); margin-inline:auto; }
.skip-link { position:fixed; z-index:30; top:12px; left:12px; transform:translateY(-160%); padding:11px 18px; background:var(--paper); color:var(--ink); }
.skip-link:focus { transform:none; }
.eyebrow { margin-bottom:16px; color:var(--copper-light); font:500 .78rem/1.5 "IBM Plex Mono",monospace; letter-spacing:.15em; text-transform:uppercase; }
header { position:absolute; z-index:10; inset:0 0 auto; border-bottom:1px solid var(--line); }
.nav-wrap { min-height:86px; display:flex; align-items:center; justify-content:space-between; gap:32px; padding-block:16px; }
.brand { display:inline-flex; align-items:center; gap:13px; flex-shrink:0; text-decoration:none; }
.brand-mark { width:42px; height:42px; border:1px solid rgba(255,255,255,.32); border-radius:50%; display:grid; place-items:center; color:var(--copper-light); font:500 .82rem "IBM Plex Mono",monospace; }
.brand-name { font-size:1rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; }
nav { display:flex; flex-wrap:wrap; align-items:center; gap:10px 28px; }
nav a { min-height:44px; display:inline-flex; align-items:center; color:#e8e8e5; font-size:.875rem; font-weight:600; text-decoration:none; }
nav a:not(.nav-cta):hover,nav a[aria-current="page"] { color:var(--copper-light); }
nav a[aria-current="page"] { text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:9px; }
.nav-cta,.button { min-height:48px; display:inline-flex; align-items:center; justify-content:center; gap:14px; padding:10px 21px; border:1px solid var(--copper); background:var(--copper); color:#18120e; font-weight:700; text-decoration:none; transition:background .2s ease,transform .2s ease; }
.nav-cta:hover,.button:hover { background:var(--copper-light); transform:translateY(-2px); }
.hero { position:relative; overflow:hidden; background:var(--ink); }
.hero::before { content:""; position:absolute; inset:0; opacity:.08; background-image:linear-gradient(rgba(255,255,255,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.24) 1px,transparent 1px); background-size:64px 64px; mask-image:linear-gradient(to right,#000,transparent 92%); }
.hero-grid { position:relative; z-index:1; min-height:700px; display:grid; grid-template-columns:.92fr 1.08fr; gap:64px; align-items:center; padding:150px 0 58px; }
.breadcrumb { margin-bottom:18px; color:#aeb3b5; font:.76rem "IBM Plex Mono",monospace; letter-spacing:.08em; text-transform:uppercase; }
.breadcrumb a { color:var(--copper-light); text-underline-offset:4px; }
h1 { max-width:720px; font-size:clamp(3.1rem,5.8vw,5.6rem); line-height:.98; letter-spacing:-.055em; }
.hero-copy { max-width:610px; margin-top:28px; color:#d2d4d3; font-size:clamp(1.05rem,1.7vw,1.2rem); }
.hero-copy a { color:var(--copper-light); text-underline-offset:4px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.button.secondary { border-color:rgba(255,255,255,.42); background:transparent; color:var(--paper); }
.button.secondary:hover { border-color:#fff; background:rgba(255,255,255,.07); }
.hero-media { min-width:0; }
.hero-frame { min-height:430px; display:grid; place-items:center; padding:24px; border:1px solid var(--line); background:#090b0c; }
.hero-frame img { width:100%; max-height:470px; object-fit:contain; }
.hero-media figcaption { margin-top:12px; color:#9da2a4; font-size:.875rem; }
.spec-bar { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.spec { padding:22px 24px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.02); }
.spec dt { color:#aeb3b5; font-size:.82rem; }
.spec dd { margin-top:3px; font-size:clamp(1.08rem,1.8vw,1.4rem); font-weight:700; letter-spacing:-.02em; }
.overview { padding:112px 0; background:var(--paper); color:var(--ink); }
.overview-grid { display:grid; grid-template-columns:.82fr 1.18fr; gap:8vw; align-items:start; }
.overview .eyebrow { color:#97512b; }
h2 { font-size:clamp(2.3rem,4.5vw,4.15rem); line-height:1.06; letter-spacing:-.045em; }
.overview-copy>p { color:#505658; font-size:1.1rem; }
.overview-copy>p+p { margin-top:20px; }
.feature-list { margin-top:36px; border-top:1px solid var(--paper-line); }
.feature { display:grid; grid-template-columns:44px 165px 1fr; gap:18px; padding:20px 0; border-bottom:1px solid var(--paper-line); align-items:baseline; }
.feature span { color:#97512b; font:.75rem "IBM Plex Mono",monospace; }
.feature strong { font-size:1rem; }
.feature p { color:#666b6d; font-size:.92rem; }
.evidence { padding:112px 0 120px; background:var(--panel); }
.section-head { display:grid; grid-template-columns:1fr .72fr; gap:7vw; align-items:end; margin-bottom:48px; }
.section-head>p { color:var(--muted); }
.media-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.media-grid.three { grid-template-columns:repeat(3,1fr); }
.media-card { border:1px solid var(--line); background:#0d0f10; }
.media-card a { display:block; }
.media-card img { width:100%; height:360px; object-fit:contain; background:#080a0b; }
.media-grid.three .media-card img { height:300px; }
.media-card img.photo-cover { object-fit:cover; object-position:center 66%; }
.media-copy { padding:24px; border-top:1px solid var(--line); }
.media-copy h3 { font-size:1.25rem; letter-spacing:-.02em; }
.media-copy p { margin-top:8px; color:var(--muted); font-size:.94rem; }
.contact { padding:92px 0; background:var(--copper); color:#17110d; }
.contact-grid { display:grid; grid-template-columns:1fr auto; gap:48px; align-items:center; }
.contact h2 { max-width:820px; }
.contact p { max-width:650px; margin-top:17px; }
.contact .button { flex-shrink:0; border-color:var(--ink); background:var(--ink); color:#fff; }
.contact .button:hover { background:#303438; }
footer { padding:36px 0; background:#08090a; color:#b5b8b9; }
.footer-wrap { display:flex; flex-wrap:wrap; justify-content:space-between; gap:24px; align-items:center; font-size:.875rem; }
.footer-links { display:flex; flex-wrap:wrap; gap:10px 24px; }
.footer-links a { min-height:44px; display:inline-flex; align-items:center; color:#e2e3e1; text-underline-offset:5px; }
@media (max-width:900px) {
  .shell { width:min(calc(100% - 32px),var(--max)); }
  .nav-wrap { flex-wrap:wrap; gap:12px; }
  .hero-grid,.overview-grid,.section-head { grid-template-columns:1fr; gap:38px; }
  .hero-grid { padding-bottom:50px; }
  .hero-frame { min-height:360px; }
  .overview,.evidence { padding:78px 0; }
  .media-grid.three { grid-template-columns:1fr 1fr; }
}
@media (max-width:680px) {
  .nav-wrap { gap:14px; }
  nav { width:100%; gap:4px 20px; }
  .hero-grid { padding-top:195px; }
  .spec-bar,.media-grid,.media-grid.three { grid-template-columns:1fr; }
  .feature { grid-template-columns:36px 1fr; }
  .feature p { grid-column:2; }
  .media-card img,.media-grid.three .media-card img { height:320px; }
  .contact-grid { grid-template-columns:1fr; gap:30px; }
  .footer-wrap { align-items:flex-start; flex-direction:column; }
}
@media (max-width:440px) {
  .brand-name { display:none; }
  h1 { font-size:clamp(2.75rem,14vw,4.2rem); }
  .hero-actions .button { width:100%; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; } }