/* Shared static-site package stylesheet. */
:root { color-scheme: light dark; }
[data-static-site-package] { min-height: 100%; }
img, video { max-width: 100%; height: auto; }
.site-nav { display: flex; align-items: center; justify-content: center; min-width: 0; max-width: 100%; }
.site-nav__inner { display: flex; align-items: center; justify-content: center; gap: clamp(0.75rem, 1.6vw, 1.5rem); min-width: 0; max-width: 100%; }
.site-nav a { color: inherit; text-decoration: none; font: inherit; font-size: 0.875rem; font-weight: 600; line-height: 1.2; opacity: 0.76; white-space: nowrap; transition: opacity 0.2s ease, color 0.2s ease; }
.site-nav a:hover, .site-nav a:focus-visible { opacity: 1; }
.site-nav a[aria-current='page'] { font-weight: 700; }
@media (max-width: 768px) { .site-nav { justify-content: flex-start; overflow-x: auto; scrollbar-width: none; } .site-nav::-webkit-scrollbar { display: none; } .site-nav__inner { justify-content: flex-start; flex-wrap: nowrap; } }

/* Page CSS: / (inline-style-1) */
:root{
      --bg:#f4f2ec;
      --surface:#fbfaf7;
      --surface2:#efede7;
      --text:#111111;
      --muted:#5f5d57;
      --line:rgba(17,17,17,.12);
      --accent:#0f7bff;
      --accent2:#0b63d1;
      --shadow:0 18px 50px rgba(17,17,17,.08);
      --radius:24px;
    }
    html{scroll-behavior:smooth}
    body{
      background:
        radial-gradient(circle at top left, rgba(15,123,255,.08), transparent 24%),
        radial-gradient(circle at 90% 10%, rgba(15,123,255,.05), transparent 18%),
        linear-gradient(180deg, #f8f6f1 0%, var(--bg) 100%);
      color:var(--text);
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      letter-spacing:-0.01em;
    }
    .grid-noise{
      background-image: linear-gradient(rgba(17,17,17,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(17,17,17,.05) 1px, transparent 1px);
      background-size: 24px 24px;
      mask-image: linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,0));
      pointer-events:none;
    }
    .card{
      background: rgba(251,250,247,.9);
      backdrop-filter: blur(10px);
      border: 1px solid var(--line);
      box-shadow: var(--shadow);
      border-radius: var(--radius);
    }
    .kicker{
      text-transform: uppercase;
      letter-spacing: .18em;
      font-size: .72rem;
      color: var(--muted);
    }
    .accent-line::before{
      content:"";
      position:absolute;
      inset:0 auto 0 0;
      width:4px;
      background:linear-gradient(180deg,var(--accent),rgba(15,123,255,.15));
      border-radius:999px;
    }
    .focus-ring:focus{
      outline:none;
      box-shadow: 0 0 0 4px rgba(15,123,255,.15), 0 0 0 1px rgba(15,123,255,.45) inset;
      border-color: rgba(15,123,255,.65);
    }
    .reveal{opacity:0; transform: translateY(14px); transition: opacity .7s ease, transform .7s ease;}
    .reveal.in{opacity:1; transform: translateY(0);}
    @media (prefers-reduced-motion: reduce){
      html{scroll-behavior:auto}
      .reveal{opacity:1; transform:none; transition:none}
      *, *::before, *::after{animation:none !important; transition:none !important; scroll-behavior:auto !important}
    }
    .sticky-float{
      position: sticky;
      top: 1.25rem;
    }
    .btn-primary{
      background: linear-gradient(180deg, var(--accent), var(--accent2));
      box-shadow: 0 14px 30px rgba(15,123,255,.25);
    }
    .btn-primary:hover{filter:saturate(1.06) brightness(1.01)}
    .tiny-badge{
      border:1px solid var(--line);
      background: rgba(255,255,255,.6);
      border-radius:999px;
    }
    .metric{
      border-top:1px solid var(--line);
      padding-top: 1rem;
    }
    .section-rule{
      border-top:1px solid rgba(17,17,17,.1);
    }
    .media-frame{
      position:relative;
      overflow:hidden;
      border:1px solid var(--line);
      border-radius: 28px;
      background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(239,237,231,.75));
    }
    .media-frame:after{
      content:"";
      position:absolute;
      inset:auto -10% -18% auto;
      width: 58%;
      height: 58%;
      background: radial-gradient(circle, rgba(15,123,255,.22), transparent 60%);
      pointer-events:none;
    }