:root {
  --signal-navy: #001233;
  --slate-gray: #1e293b;
  --radio-amber: #f59e0b;
  --light-text: #e5e7eb;
  --muted-text: #b8c4d6;
  --line: rgba(229, 231, 235, 0.12);
  --heading-font: "IBM Plex Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --body-font: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

html, body { min-height: 100%; background: var(--signal-navy); }

body {
  margin: 0;
  color: var(--light-text);
  font-family: var(--body-font);
}

a { color: inherit; }

.page-shell {
  width: min(100% - 24px, 960px);
  min-height: 100vh;
  margin: 0 auto;
  padding: 24px 0 32px;
}

.landing-card {
  display: grid;
  gap: 24px;
  padding: clamp(24px, 4vw, 40px);
  border-radius: 28px;
  background: var(--signal-navy);
}

.brand-block { display: grid; justify-items: center; gap: 14px; }

.logo-link { width: min(100%, 560px); margin: 0 auto 0.75rem; padding: 1rem 1.25rem 0.25rem; }

.brand-logo { display: block; width: 100%; height: auto; }

.eyebrow {
  margin: 0;
  color: var(--muted-text);
  font-size: 0.96rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.content-block { width: 100%; max-width: 42rem; margin: 0 auto; }

h1, h2 { font-family: var(--heading-font); }

h1 {
  margin: 0;
  font-size: clamp(2.4rem, 7vw, 4.6rem);
  line-height: 0.96;
  letter-spacing: -0.05em;
}

h2 { margin: 0; font-size: 1.35rem; }

.lead {
  margin: 22px 0 0;
  color: var(--radio-amber);
  font-family: var(--heading-font);
  font-size: clamp(1.2rem, 3vw, 1.5rem);
  font-weight: 600;
  line-height: 1.45;
}

.body-copy {
  margin: 18px 0 0;
  color: var(--muted-text);
  font-size: 1rem;
  line-height: 1.8;
}

.action-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 20px;
  border-radius: 999px;
  font-weight: 700;
  text-decoration: none;
  transition: transform 140ms ease, box-shadow 140ms ease;
}

.button-primary { color: #08111d; background: linear-gradient(135deg, var(--radio-amber), #fbbf24); }

.button:hover, .button:focus-visible, .support-links a:hover, .support-links a:focus-visible { transform: translateY(-1px); }

.button:focus-visible, .support-links a:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.22); }

.download-note { margin: 10px 0 0; color: var(--muted-text); font-size: 0.92rem; }

.details-card {
  margin-top: 2rem;
  padding: clamp(20px, 3vw, 28px);
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(30, 41, 59, 0.45);
}

.details-card ul { display: grid; gap: 0.85rem; margin: 1rem 0 0; padding-left: 1.25rem; color: var(--muted-text); line-height: 1.65; }

.details-card li::marker { color: var(--radio-amber); }

.caveat { font-size: 0.94rem; }

.support-links { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 22px; }

.support-links a { color: var(--muted-text); font-size: 0.98rem; text-decoration: none; }

.site-footer { margin-top: 20px; padding: 0 8px; }

.site-footer p { margin: 0; color: var(--muted-text); font-size: 0.92rem; line-height: 1.8; }

@media (max-width: 640px) {
  .page-shell { width: min(100% - 16px, 960px); padding-top: 16px; }
  .landing-card { gap: 20px; padding: 22px 18px; border-radius: 24px; }
  .logo-link { width: min(100%, 360px); padding-left: 0.5rem; padding-right: 0.5rem; }
  .action-row, .support-links { flex-direction: column; }
  .button { width: 100%; }
}
