:root{
  --space-1:8px;
  --space-2:12px;
  --space-3:16px;
  --space-4:24px;
  --space-5:32px;
  --space-6:48px;
  --radius:14px;
  --glass: rgba(255,255,255,.08);
  --bg:#040608;
  --text:#e9e0d4;
  --muted:#b5a89a;
  --primary:#e6d5b3;
  --focus:#e6d5b3;
}
*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
html{font-size:16px}
body{
  margin:0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Inter",Arial,sans-serif;
  color:var(--text);
  background:#000;
  background-image:
    radial-gradient(circle at 20%0%,rgba(100,150,210,.08),transparent 40%),
    radial-gradient(circle at 85%10%,rgba(180,150,100,.12),transparent 35%),
    linear-gradient(135deg, #0a0a0a 0%, #0a0a0a 60%, #050505 100%);
  background-attachment:fixed;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
header{position:sticky;top:0;z-index:5;display:grid;place-items:center;padding:var(--space-3) 0;
  background:linear-gradient(to bottom right, rgba(0,0,0,.25), rgba(0,0,0,.35));
  border-bottom:1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(6px) saturate(120%);
}
.brand{padding:.4rem .9rem;border-radius:999px;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18); font-weight:700; color:#fff; letter-spacing:.2px}
main{display:block}
.hero-grid{width:min(92%,860px);margin:0 auto;padding:var(--space-5) var(--space-4);
  display:grid;gap:var(--space-4);justify-items:center;text-align:center}
.hero-grid h1{font-size:clamp(1.75rem,4vw+1rem,3rem);margin:0;letter-spacing:.5px}
.subhead{color:var(--muted);font-size:clamp(1rem,2vw,1.125rem);margin:0}
.hero-media{width:100%;display:grid;place-items:center}
.hero-media img{width:100%;max-width:760px;height:auto;border-radius:20px;
  box-shadow:0 20px 50px rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.15)}
.cta{display:inline-block;margin:0 auto;padding:1rem 1.5rem;border-radius:14px;
  background:rgba(253,246,216,.95);color:#1a1a1a;font-weight:800;letter-spacing:.2px;
  text-decoration:none;border:1px solid rgba(0,0,0,.08);box-shadow:0 6px 16px rgba(0,0,0,.25);
  transition:transform .2s ease,box-shadow .2s ease}
.cta:hover,.cta:focus-visible{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,.32);
  text-decoration:underline;text-underline-offset:4px}
.cta:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
footer{padding:var(--space-5) var(--space-4)}
.footer-ad{width:min(92%,860px);margin:0 auto 1rem;padding:1rem 1rem;background:var(--glass);
  border:1px solid rgba(255,255,255,.15);border-radius:var(--radius);text-align:center}
.footer-ad a{color:#efe3d0;text-decoration:none;font-weight:600}
.footer-ad a:hover,.footer-ad a:focus-visible{text-decoration:underline;color:#f6ead5}
.closing-note{text-align:center;color:var(--muted);font-size:0.95rem;margin:0}
@media (min-width:900px){
  .hero-grid{gap:2rem;text-align:left}
  .hero-grid{justify-items:center}
}
@media (max-width:359px){
  article p:first-of-type::first-letter{font-size:clamp(2.8rem,6vw,5rem)}
}
@media (prefers-reduced-motion: reduce){
  *{animation:none!important;transition:none!important}
}