:root {
  color-scheme: dark;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #0b1119;
  color: #f7f9fc;
}

* { box-sizing: border-box; }

body { margin: 0; }

a { color: #76bdff; text-underline-offset: 0.2em; }
a:hover { color: #acd9ff; }
a:focus-visible { outline: 2px solid #76bdff; outline-offset: 4px; border-radius: 2px; }

.page-shell {
  width: min(100% - 48px, 1040px);
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}

.site-header, .site-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.site-header { padding: 28px 0; border-bottom: 1px solid #2c3948; }
.site-header nav, .site-footer nav { display: flex; flex-wrap: wrap; gap: 24px; }
.site-header nav a, .site-footer nav a { color: #c6d2df; text-decoration: none; }
.site-header nav a:hover, .site-footer nav a:hover,
.site-header nav a[aria-current="page"] { color: #76bdff; }

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #f7f9fc;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  text-decoration: none;
  white-space: nowrap;
}
.brand:hover { color: #f7f9fc; }
.brand-mark { display: flex; align-items: center; gap: 3px; height: 20px; }
.brand-mark span { display: block; width: 3px; border-radius: 4px; background: #57aaff; }
.brand-mark span:nth-child(1), .brand-mark span:nth-child(4) { height: 8px; }
.brand-mark span:nth-child(2) { height: 20px; }
.brand-mark span:nth-child(3) { height: 14px; }

main { flex: 1; }
.hero { max-width: 780px; padding: clamp(72px, 11vw, 132px) 0 76px; }
.eyebrow {
  margin: 0 0 18px;
  color: #76bdff;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}
h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 16px; font-size: clamp(3.4rem, 10vw, 6.8rem); letter-spacing: -0.065em; line-height: 1; }
h2 { margin-bottom: 18px; font-size: clamp(1.6rem, 3vw, 2.3rem); letter-spacing: -0.04em; line-height: 1.16; }
.hero-lead { margin-bottom: 18px; font-size: clamp(1.3rem, 2.5vw, 1.85rem); font-weight: 550; letter-spacing: -0.025em; }
.hero-copy, .access-card p, .article p { color: #c6d2df; font-size: 1.05rem; line-height: 1.7; }
.hero-copy { max-width: 630px; margin-bottom: 0; }

.checks { padding: 0 0 72px; }
.section-heading { margin-bottom: 24px; }
.check-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.check-list li {
  display: flex;
  align-items: baseline;
  gap: 20px;
  min-height: 76px;
  padding: 22px 24px;
  border: 1px solid #354557;
  border-radius: 13px;
  background: #161e29;
  font-weight: 600;
  line-height: 1.45;
}
.check-number { color: #76bdff; font-size: 0.83rem; font-variant-numeric: tabular-nums; }

.access-card, .contact-card { padding: clamp(26px, 5vw, 42px); border: 1px solid #375878; border-radius: 18px; background: #142131; }
.access-card { margin-bottom: 80px; }
.access-card p:last-child, .contact-card p:last-child { max-width: 760px; margin-bottom: 0; }

.article { width: min(100%, 760px); padding: clamp(68px, 9vw, 108px) 0 90px; }
.article h1 { margin-bottom: 12px; font-size: clamp(2.8rem, 7vw, 4.7rem); }
.article .updated { margin-bottom: 52px; color: #acbbc9; font-size: 0.92rem; }
.article section { margin-top: 42px; }
.article section h2 { margin-bottom: 12px; font-size: 1.45rem; }
.article section p { margin-bottom: 0; }
.article-lead { max-width: 660px; margin: 28px 0 0; }
.article .contact-card { margin-top: 52px; }
.contact-card .email-link { font-size: clamp(1.1rem, 3vw, 1.45rem); font-weight: 650; overflow-wrap: anywhere; }
.support-note { margin-top: 40px; }

.site-footer { padding: 26px 0 34px; border-top: 1px solid #2c3948; color: #acbbc9; font-size: 0.88rem; }

@media (max-width: 640px) {
  .page-shell { width: min(100% - 36px, 1040px); }
  .site-header { align-items: flex-start; flex-direction: column; gap: 18px; }
  .site-header nav { gap: 20px; }
  .hero { padding: 76px 0 64px; }
  .hero h1 { font-size: clamp(2.7rem, 12vw, 3.4rem); }
  .checks { padding-bottom: 56px; }
  .check-list { grid-template-columns: 1fr; }
  .access-card { margin-bottom: 64px; }
  .site-footer { align-items: flex-start; flex-direction: column; gap: 14px; }
}
