:root {
  color-scheme: dark;
  --bg: #061019;
  --surface: #0d1d2a;
  --surface-2: #122a39;
  --text: #edf7fa;
  --muted: #a8bdc7;
  --line: #284858;
  --teal: #5eead4;
  --amber: #fbbf24;
  --max: 72rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 20rem;
  background: radial-gradient(circle at 92% 0%, rgba(94,234,212,.13), transparent 30rem), linear-gradient(180deg, #061019, #08131d);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.75;
}
a { color: inherit; }
.site-bar { border-bottom: 1px solid rgba(94,234,212,.18); background: rgba(6,16,25,.9); backdrop-filter: blur(14px); }
.site-bar__inner { max-width: var(--max); margin: 0 auto; padding: .8rem 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.brand { display: inline-flex; align-items: center; gap: .7rem; color: var(--teal); font-size: .9rem; font-weight: 800; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.mark { width: 1.8rem; height: 1.8rem; display: grid; place-items: center; border: 1px solid rgba(94,234,212,.45); border-radius: .5rem; color: var(--amber); font-size: 1.05rem; }
.site-nav, .footer-links { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 1rem; }
.nav-link, .footer-links a { color: #cce0e7; font-size: .82rem; text-decoration: none; }
.nav-link:hover, .footer-links a:hover { color: var(--teal); }
main { max-width: var(--max); margin: 0 auto; padding: clamp(2.5rem, 7vw, 5.5rem) 1.25rem 5rem; }
article { max-width: 50rem; }
.eyebrow { margin: 0 0 .75rem; color: var(--teal); font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
h1, h2 { line-height: 1.12; letter-spacing: -.03em; text-wrap: balance; }
h1 { margin: 0 0 1.4rem; font-size: clamp(2.75rem, 8vw, 5.8rem); font-weight: 850; }
h1::after { content: ""; display: block; width: 5rem; height: .3rem; margin-top: 1.3rem; border-radius: 999px; background: linear-gradient(90deg, var(--teal), var(--amber)); }
.answer { max-width: 45rem; margin: 0 0 3rem; padding: 1.2rem 1.3rem; border-left: 3px solid var(--amber); border-radius: .2rem .8rem .8rem .2rem; background: rgba(17,42,57,.62); font-size: clamp(1.15rem, 2.2vw, 1.45rem); line-height: 1.6; }
h2 { margin: 3.6rem 0 1rem; color: #fff; font-size: clamp(1.65rem, 4vw, 2.7rem); }
p { max-width: 72ch; margin: 0 0 1.25rem; }
.contact-card { max-width: 38rem; padding: 1.35rem 1.5rem; border: 1px solid var(--line); border-radius: 1rem; background: linear-gradient(135deg, rgba(17,42,57,.85), rgba(12,25,37,.7)); }
.email-link { display: inline-block; margin-top: .4rem; color: var(--teal); font-size: clamp(1.2rem, 3vw, 1.6rem); font-weight: 750; overflow-wrap: anywhere; }
footer { max-width: var(--max); margin: 0 auto; padding: 1.8rem 1.25rem 2.6rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; color: #78909b; font-size: .78rem; }
.footer-links a { color: #a8bdc7; }
@media (max-width: 700px) {
  body { font-size: 1rem; line-height: 1.7; }
  .site-bar__inner, main, footer { padding-inline: 1rem; }
  .site-bar__inner { align-items: flex-start; }
  .site-nav { gap: .65rem .85rem; }
  h2 { margin-top: 3rem; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }