/* jalenrekt shared design system — the single source of truth */
:root{
  --color-bg:#0a0a0b;
  --color-surface:#141416;
  --color-text:#f5f3ef;
  --color-muted:#aaa69e;
  --color-accent:#e8c547;
  --color-accent-ink:#121006;
  --color-border:rgba(245,243,239,.15);
  --font-display:"Archivo Black",system-ui,sans-serif;
  --font-body:"Inter",system-ui,-apple-system,sans-serif;
  --text-display:clamp(2.35rem,3.6vw,3.65rem);
  --text-heading:clamp(1.55rem,3vw,2.5rem);
  --text-body:clamp(1.02rem,1.5vw,1.16rem);
  --text-small:.78rem;
  --page-edge:clamp(1.25rem,5vw,4rem);
  --section-space:clamp(4rem,9vw,7rem);
  --content-width:72rem;
  --reading-width:44rem;
  --radius-sm:6px;
  --radius-md:10px;
  --touch-target:44px;
  /* Backward-compatible aliases used by the current site. */
  --bg:var(--color-bg);--bg-raised:var(--color-surface);--raised:var(--color-surface);
  --ink:var(--color-text);--dim:var(--color-muted);--ink-dim:var(--color-muted);
  --gold:var(--color-accent);--accent:var(--color-accent);--accent-ink:var(--color-accent-ink);
  --line:var(--color-border);--hairline:var(--color-border);
  --display:var(--font-display);--body:var(--font-body);
  --edge:var(--page-edge);--edge-pad:var(--page-edge);
}

/* Shared editorial masthead */
.story-hero{display:grid;grid-template-columns:minmax(10rem,14rem) minmax(0,58rem) 1fr;column-gap:clamp(2rem,5vw,5.5rem);align-items:start;padding:clamp(3rem,6vw,5.5rem) var(--page-edge)}
.story-hero .story-kicker{grid-column:1;padding-top:.85rem;border-top:2px solid var(--color-accent);font-size:.7rem;line-height:1.55}
.story-hero h1{grid-column:2;max-width:24ch;margin:0;font-family:var(--font-display);font-size:var(--text-display);font-weight:400;line-height:1.04;letter-spacing:-.025em;text-transform:none;text-wrap:balance}
.story-hero .story-dek{grid-column:2;max-width:48rem;margin-top:1.5rem;color:var(--color-muted);font-size:clamp(1.05rem,1.5vw,1.25rem);line-height:1.65}
.stories-index h1{max-width:18ch;font-size:clamp(2.6rem,5.5vw,5rem);line-height:1}

/* Shared interaction rules */
.story-actions a,.press__links a{min-height:var(--touch-target)}
:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}

/* Homepage navigation: platform links belong in the footer. */
.site-header .social-row--sm{display:none}
.site-header__page-link{font-family:var(--font-display);font-size:.76rem;letter-spacing:.14em;text-decoration:none;text-transform:uppercase;transition:color .2s ease}
.site-header__page-link:hover,.site-header__page-link:focus-visible{color:var(--color-accent)}

@media(max-width:48rem){
  .story-hero{display:block;padding-top:3rem;padding-bottom:3.5rem}
  .story-hero .story-kicker{max-width:13rem;margin-bottom:1.5rem}
  .story-hero h1{max-width:22ch;font-size:clamp(2rem,8.5vw,2.8rem);line-height:1.06}
  .story-hero .story-dek{margin-top:1.25rem}
  .site-header__page-link{font-size:.7rem;letter-spacing:.08em}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
