:root {
  --graphite: #0B0B0B;
  --charcoal: #1F1F1F;
  --ivory: #F7F5EE;
  --neutral: #D3D0C9;
  --gold: #B88B4F;
  --gold-soft: #D4AF72;
  --paper: #FBFAF7;
  --ink-muted: #5D5A55;
  --line: rgba(11,11,11,.12);
  --max: 1180px;
  --radius: 22px;
  --shadow: 0 24px 60px rgba(0,0,0,.10);
  --font-display: "Inter Display", Inter, Arial, sans-serif;
  --font-body: Inter, Arial, system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--graphite);
  font-family: var(--font-body);
  font-optical-sizing: auto;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
}
a { color: inherit; }
img { max-width: 100%; display: block; }
button, input, textarea { font: inherit; }
.skip-link { position:absolute; left:-999px; top:0; }
.skip-link:focus { left:1rem; top:1rem; z-index:100; background:var(--ivory); padding:.7rem 1rem; border-radius:8px; }

.container { width: min(calc(100% - 40px), var(--max)); margin-inline:auto; }
.eyebrow { text-transform: uppercase; letter-spacing: .19em; font-size: .72rem; font-weight: 700; color: var(--gold); }
.section { padding: 92px 0; }
.section--dark { background: var(--graphite); color: var(--ivory); }
.section--ivory { background: var(--ivory); }
.section-title { font-family: var(--font-display); font-size: clamp(2rem, 4.2vw, 4.4rem); line-height: 1.02; letter-spacing: -.04em; margin: 10px 0 24px; max-width: 900px; }
.lede { font-size: clamp(1.08rem, 1.6vw, 1.34rem); color: var(--ink-muted); max-width: 760px; }
.section--dark .lede { color: #C8C4BC; }

.site-header { position: sticky; top:0; z-index:50; background: rgba(251,250,247,.92); backdrop-filter: blur(14px); border-bottom:1px solid rgba(11,11,11,.07); }
.header-inner { min-height:80px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand img { width: 220px; height:auto; }
.site-header--dark { background: rgba(11,11,11,.86); border-bottom-color: rgba(255,255,255,.08); color: var(--ivory); }
.site-header--dark .menu-button { color: var(--ivory); }
@media (max-width: 900px) { .site-header--dark .nav { background:#141414; border-color:rgba(255,255,255,.1); } }
.nav { display:flex; align-items:center; gap:30px; font-size:.94rem; font-weight:600; }
.nav a { text-decoration:none; position:relative; }
.nav a::after { content:""; position:absolute; left:0; bottom:-7px; height:2px; width:0; background:var(--gold); transition:width .2s ease; }
.nav a:hover::after, .nav a[aria-current="page"]::after { width:100%; }
.menu-button { display:none; border:0; background:transparent; padding:8px; }

.hero { min-height: calc(100vh - 80px); display:grid; align-items:center; padding:72px 0 80px; position:relative; overflow:hidden; background: var(--graphite); color:var(--ivory); }
.hero::before { content:""; position:absolute; inset:0; background:
  radial-gradient(circle at 78% 30%, rgba(184,139,79,.15), transparent 22%),
  radial-gradient(circle at 68% 78%, rgba(255,255,255,.06), transparent 28%);
}
.hero::after { content:""; position:absolute; right:-8%; top:10%; width:54%; height:80%; opacity:.48; background-image:repeating-linear-gradient(90deg, transparent 0 57px, rgba(255,255,255,.05) 58px 59px); transform:skewX(-8deg); }
.hero-grid { position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr); align-items:center; gap:70px; }
.hero h1 { font-family:var(--font-display); font-size:clamp(3.2rem, 7vw, 7.2rem); line-height:.92; letter-spacing:-.055em; margin:.4rem 0 1.6rem; max-width:880px; }
.hero h1 span { color: var(--gold-soft); }
.hero-copy { font-size:clamp(1.1rem,1.55vw,1.35rem); color:#D6D2CB; max-width:680px; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; margin-top:32px; }
.button { display:inline-flex; align-items:center; gap:10px; padding:14px 21px; border-radius:999px; text-decoration:none; font-weight:700; border:1px solid transparent; transition:transform .2s ease, background .2s ease; }
.button:hover { transform:translateY(-2px); }
.button--gold { background:var(--gold); color:#111; }
.button--ghost { border-color:rgba(255,255,255,.28); color:var(--ivory); }
.signal-orbit { width:min(420px,100%); aspect-ratio:1; margin-left:auto; position:relative; border:1px solid rgba(255,255,255,.08); border-radius:50%; }
.signal-orbit::before, .signal-orbit::after { content:""; position:absolute; border-radius:50%; border:1px solid rgba(184,139,79,.34); }
.signal-orbit::before { inset:12%; }
.signal-orbit::after { inset:30%; }
.signal-dot { position:absolute; width:13px; height:13px; background:var(--gold-soft); border-radius:50%; box-shadow:0 0 28px rgba(212,175,114,.6); }
.signal-dot:nth-child(1){ left:12%; top:48%; }
.signal-dot:nth-child(2){ right:18%; top:18%; width:8px; height:8px; }
.signal-dot:nth-child(3){ right:11%; bottom:31%; width:17px; height:17px; }
.signal-dot:nth-child(4){ left:40%; bottom:5%; width:7px; height:7px; background:#fff; }
.signal-path { position:absolute; inset:0; display:grid; place-items:center; font-family:var(--font-display); font-size:clamp(1.3rem,2.2vw,2rem); text-align:center; line-height:1.15; padding:70px; color:#F0ECE3; }

.story-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:72px; align-items:start; }
.story-number { font-family:var(--font-display); font-size:clamp(5rem,10vw,10rem); color:rgba(184,139,79,.23); line-height:.8; }
.story-copy p { font-size:clamp(1.2rem,2vw,1.6rem); line-height:1.55; margin:0 0 1.25rem; }
.story-copy .punch { font-size:clamp(1.7rem,3.4vw,3rem); line-height:1.15; font-family:var(--font-display); letter-spacing:-.03em; margin:2.2rem 0; }
.gold { color:var(--gold); }

.video-placeholder { aspect-ratio:16/9; border-radius:var(--radius); border:1px solid rgba(184,139,79,.55); background:linear-gradient(145deg,#0D0D0D,#171717); position:relative; overflow:hidden; display:grid; place-items:center; box-shadow:var(--shadow); }
.video-placeholder::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 70% 35%, rgba(184,139,79,.16), transparent 34%); }
.video-inner { position:relative; text-align:center; max-width:560px; padding:36px; }
.video-icon { width:64px; height:64px; border:1px solid rgba(255,255,255,.35); border-radius:50%; display:grid; place-items:center; margin:0 auto 18px; color:var(--gold-soft); font-size:1.5rem; }
.video-title { font-family:var(--font-display); font-size:clamp(1.5rem,3vw,2.4rem); margin:0 0 .7rem; }
.video-note { color:#AAA59D; margin:0; }
.video-frame { width:100%; height:100%; border:0; position:absolute; inset:0; }

.chain { margin-top:48px; display:grid; grid-template-columns:repeat(7,1fr); gap:10px; }
.chain-item { min-height:112px; border-top:2px solid var(--gold); padding:15px 10px 10px; font-weight:700; font-size:.92rem; }
.chain-item small { display:block; color:#7A766F; font-weight:500; margin-top:8px; }

.not-tools { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:42px; }
.card { background:#fff; border:1px solid var(--line); border-radius:18px; padding:30px; box-shadow:0 8px 30px rgba(0,0,0,.035); }
.card h3 { font-family:var(--font-display); font-size:1.3rem; margin:0 0 .7rem; }
.card p { color:var(--ink-muted); margin:0; }
.card--dark { background:#141414; border-color:rgba(255,255,255,.08); }
.card--dark p { color:#BCB8B1; }

.question-block { border-left:4px solid var(--gold); padding:8px 0 8px 28px; margin:42px 0; }
.question-block p { font-size:clamp(1.6rem,3vw,2.8rem); font-family:var(--font-display); line-height:1.18; letter-spacing:-.025em; margin:0; }

.blog-hero { padding:92px 0 52px; background:var(--ivory); }
.blog-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; padding:34px 0 96px; }
.article-card { display:flex; flex-direction:column; min-height:320px; background:#fff; border:1px solid var(--line); border-radius:18px; padding:28px; text-decoration:none; transition:transform .18s ease, box-shadow .18s ease; }
.article-card:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
.article-card .meta { color:#7C7770; font-size:.82rem; text-transform:uppercase; letter-spacing:.12em; }
.article-card h2 { font-family:var(--font-display); font-size:1.65rem; line-height:1.12; letter-spacing:-.025em; margin:16px 0 12px; }
.article-card p { color:var(--ink-muted); }
.article-card .read { margin-top:auto; font-weight:700; color:#8A6336; }

.article-shell { width:min(calc(100% - 40px), 820px); margin:0 auto; padding:82px 0 110px; }
.article-header { margin-bottom:52px; }
.article-header h1 { font-family:var(--font-display); font-size:clamp(2.8rem,6vw,5.8rem); line-height:.98; letter-spacing:-.055em; margin:12px 0 24px; }
.article-meta { color:#716D66; display:flex; gap:14px; flex-wrap:wrap; }
.article-body { font-family:Georgia, "Times New Roman", serif; font-size:1.18rem; line-height:1.83; }
.article-body h2, .article-body h3 { font-family:var(--font-display); letter-spacing:-.025em; line-height:1.15; margin-top:2.5em; }
.article-body h2 { font-size:2rem; }
.article-body h3 { font-size:1.45rem; }
.article-body blockquote { margin:2.2rem 0; padding:1.2rem 0 1.2rem 1.8rem; border-left:3px solid var(--gold); color:#3D3A36; font-size:1.35rem; }
.article-body a { color:#845C2C; text-decoration-thickness:1px; text-underline-offset:3px; }
.article-body hr { border:0; border-top:1px solid var(--line); margin:3rem 0; }
.article-source { margin-top:48px; padding:20px 22px; background:var(--ivory); border-radius:12px; font-family:Inter,sans-serif; font-size:.9rem; color:#625E58; }

.cta { background:var(--charcoal); color:var(--ivory); border-radius:28px; padding:48px; display:grid; grid-template-columns:1.2fr .8fr; gap:34px; align-items:end; }
.cta h2 { font-family:var(--font-display); font-size:clamp(2rem,4.5vw,4rem); line-height:1; letter-spacing:-.04em; margin:0; }
.cta p { color:#C7C3BB; margin:12px 0 0; }
.cta-form { display:flex; gap:10px; }
.cta-form input { flex:1; min-width:0; border-radius:999px; border:1px solid rgba(255,255,255,.2); background:#111; color:white; padding:14px 18px; }

.site-footer { background:#080808; color:#B8B4AD; padding:54px 0; }
.footer-grid { display:flex; justify-content:space-between; gap:28px; align-items:flex-end; }
.footer-title { color:var(--ivory); font-family:var(--font-display); font-size:1.3rem; font-weight:700; }
.footer-nav { display:flex; gap:20px; flex-wrap:wrap; }
.footer-nav a { text-decoration:none; }

[data-reveal] { opacity:0; transform:translateY(20px); transition:opacity .65s ease, transform .65s ease; }
[data-reveal].is-visible { opacity:1; transform:none; }

@media (max-width: 900px) {
  .nav { position:absolute; display:none; right:20px; top:72px; background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:18px; flex-direction:column; align-items:flex-start; width:min(280px,calc(100vw - 40px)); box-shadow:var(--shadow); }
  .nav[data-open] { display:flex; }
  .menu-button { display:block; }
  .hero-grid, .story-grid, .cta { grid-template-columns:1fr; }
  .hero { min-height:auto; }
  .signal-orbit { margin:18px auto 0; width:min(340px,88vw); }
  .chain { grid-template-columns:repeat(2,1fr); }
  .not-tools, .blog-grid { grid-template-columns:1fr; }
  .footer-grid { align-items:flex-start; flex-direction:column; }
}

@media (max-width: 560px) {
  .container { width:min(calc(100% - 28px), var(--max)); }
  .brand img { width:208px; }
  .header-inner { min-height:70px; }
  .section { padding:68px 0; }
  .hero { padding:62px 0; }
  .hero h1 { font-size:clamp(2.85rem,14vw,4.8rem); }
  .chain { grid-template-columns:1fr; }
  .cta { padding:30px; }
  .cta-form { flex-direction:column; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; transition-duration:.01ms !important; }
  [data-reveal] { opacity:1; transform:none; }
}