:root {
  --navy-950: #061422;
  --navy-900: #07182b;
  --navy-850: #09203a;
  --navy-800: #0b2648;
  --ink: #0a1b38;
  --blue: #2d83dc;
  --orange: #ff6a14;
  --orange-2: #ff7b22;
  --paper: #ffffff;
  --mist: #f5f7fb;
  --muted: #5b6473;
  --line: #e4e8ef;
  --shadow: 0 18px 50px rgba(13, 35, 68, .09);
  --radius: 22px;
  --container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--paper);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.skip-link { position:absolute; left:-9999px; top:auto; }
.skip-link:focus { left:16px; top:16px; z-index:100; background:#fff; padding:10px 14px; border-radius:8px; }

.site-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 20;
  color: white;
  padding: 24px 0;
}
.nav-wrap { display:flex; align-items:center; gap:28px; }
.brand { text-decoration:none; font-weight:900; letter-spacing:-.045em; font-size:clamp(18px, 2vw, 28px); white-space:nowrap; }
.brand-accent { color: var(--orange); }
.brand-dot { font-size:.62em; letter-spacing:-.02em; }
.desktop-nav { margin-left:auto; display:flex; gap:34px; align-items:center; }
.desktop-nav a, .footer nav a { text-decoration:none; font-weight:700; font-size:.88rem; }
.desktop-nav a:hover, .footer nav a:hover { color: var(--orange); }

.btn {
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:6px; background:linear-gradient(135deg,var(--orange),var(--orange-2));
  color:white; font-weight:850; text-decoration:none; text-transform:uppercase;
  letter-spacing:-.01em; box-shadow:0 10px 28px rgba(255,106,20,.18);
  transition:transform .18s ease, box-shadow .18s ease;
}
.btn:hover { transform:translateY(-2px); box-shadow:0 14px 32px rgba(255,106,20,.28); }
.btn-small { padding:13px 20px; font-size:.82rem; }
.btn-primary { padding:18px 28px; font-size:.95rem; }
.btn-wide { min-width: 360px; }

.hero {
  min-height: 690px;
  position:relative;
  overflow:hidden;
  background: var(--navy-950);
  color:white;
  display:flex;
  align-items:center;
}
.hero-visual { position:absolute; inset:0 0 0 38%; }
.hero-visual img { width:100%; height:100%; object-fit:cover; object-position:center 47%; }
.hero-shade {
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(3,14,27,1) 0%, rgba(4,17,31,.98) 34%, rgba(4,18,33,.73) 53%, rgba(4,18,33,.14) 82%),
    linear-gradient(180deg, rgba(2,12,23,.28), transparent 45%, rgba(3,12,21,.28));
}
.hero-grid { position:relative; z-index:3; padding-top:86px; }
.hero-copy { width:min(610px, 54vw); padding:70px 0 78px; }
.eyebrow { margin:0 0 10px; font-size:.78rem; font-weight:900; letter-spacing:.05em; color:#2e80d2; text-align:center; }
.hero-eyebrow { text-align:left; color:#8bbdf3; }
.hero h1 { margin:0; font-size:clamp(52px, 5.6vw, 82px); line-height:.96; letter-spacing:-.055em; font-weight:900; }
.hero h1 span { color: var(--orange); }
.brush-line { height:5px; width:300px; margin:17px 0 28px; background:linear-gradient(90deg,var(--orange),transparent); border-radius:999px; transform:skewX(-18deg); }
.hero-lead, .hero-sub { font-size:1.18rem; max-width:560px; }
.hero-lead { margin:0 0 8px; }
.hero-sub { margin:0 0 28px; color:#f2f5f8; }
.trust-row { display:flex; gap:13px; flex-wrap:wrap; align-items:center; margin-top:15px; font-size:.85rem; color:#e8edf4; }
.centered { justify-content:center; }
.trust-item { display:inline-flex; align-items:center; gap:7px; }
.trust-item svg { width:16px; height:16px; stroke-width:2.4; color:#fff; }

.section { padding:72px 0 82px; }
.section h2, .section-dark h2, .about-copy h2, .join h2 { margin:0; letter-spacing:-.035em; line-height:1.05; font-size:clamp(34px,4.4vw,56px); font-weight:900; }
.learn h2, .section-intro { text-align:center; }
.section-intro { max-width:810px; margin:18px auto 36px; color:var(--muted); font-size:1.03rem; }
.strategy-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; align-items:stretch; }
.strategy-card { border:1px solid var(--line); border-radius:var(--radius); padding:34px 28px 30px; text-align:center; box-shadow:var(--shadow); background:white; min-height:390px; display:flex; flex-direction:column; align-items:center; transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.strategy-card:hover { transform:translateY(-6px); box-shadow:0 24px 58px rgba(13,35,68,.13); border-color:rgba(255,106,20,.28); }
.featured-card:hover { transform:translateY(-13px); }
.featured-card { transform:translateY(-7px); }
.icon-badge {
  position:relative;
  width:104px;
  height:104px;
  display:grid;
  place-items:center;
  border-radius:26px;
  margin:0 auto 24px;
  color:#0b2a55;
  background:
    radial-gradient(circle at 32% 24%, #ffffff 0 20%, transparent 21%),
    linear-gradient(145deg,#f8fbff,#eef3f9);
  border:1px solid #e5ebf3;
  box-shadow:0 14px 34px rgba(12,31,61,.10);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.icon-badge .icon-main { width:54px; height:54px; stroke-width:2.25; }
.icon-accent {
  position:absolute;
  right:-7px;
  bottom:-7px;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:12px;
  color:white;
  background:linear-gradient(145deg,var(--orange-2),var(--orange));
  border:4px solid #fff;
  box-shadow:0 8px 20px rgba(255,106,20,.28);
}
.icon-accent svg { width:19px; height:19px; stroke-width:2.5; }
.strategy-card:hover .icon-badge {
  transform:translateY(-4px);
  border-color:rgba(255,106,20,.34);
  box-shadow:0 20px 44px rgba(12,31,61,.14);
}
.strategy-card h3 { margin:0; font-size:1.55rem; line-height:1.05; letter-spacing:-.03em; }
.arrow { color:var(--orange); }
.card-rule { width:58px; height:3px; background:var(--orange); margin:18px 0; border-radius:99px; }
.strategy-card p { margin:0; color:#27354a; font-size:.97rem; }
.support-band { margin:38px auto 0; width:min(820px,100%); padding:20px 26px; border-radius:10px; background:linear-gradient(135deg,#f0f3f8,#fff); display:flex; gap:18px; align-items:center; box-shadow:0 10px 28px rgba(12,31,61,.05); }
.support-icon {
  flex:0 0 56px;
  width:56px;
  height:56px;
  display:grid;
  place-items:center;
  border-radius:16px;
  color:white;
  background:linear-gradient(145deg,var(--orange-2),var(--orange));
  box-shadow:0 10px 24px rgba(255,106,20,.22);
}
.support-icon svg { width:29px; height:29px; stroke-width:2.25; }
.support-band h3 { margin:0; color:#0c4a94; text-transform:uppercase; font-size:1rem; }
.support-band p { margin:3px 0 0; font-size:.94rem; }

.section-dark { background:linear-gradient(135deg,var(--navy-950),#08254a); color:white; padding:58px 0 66px; }
.eyebrow-blue { color:#4ca2ff; }
.section-dark h2 { text-align:center; font-size:clamp(34px,4vw,48px); }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:38px; position:relative; }
.steps::before { content:""; position:absolute; left:11%; right:11%; top:22px; border-top:1px dashed rgba(255,255,255,.42); }
.step { text-align:center; position:relative; z-index:1; padding:0 12px; }
.step-num { width:44px; height:44px; border-radius:50%; display:grid; place-items:center; margin:0 auto 13px; background:linear-gradient(145deg,#4aa8ff,#2463c6); font-weight:900; font-size:1.2rem; box-shadow:0 6px 15px rgba(38,102,199,.35); }
.step-icon {
  width:72px;
  height:72px;
  margin:0 auto 12px;
  display:grid;
  place-items:center;
  color:#eaf4ff;
  border-radius:20px;
  background:linear-gradient(145deg,rgba(77,163,255,.18),rgba(255,255,255,.04));
  border:1px solid rgba(111,181,255,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 12px 30px rgba(0,0,0,.14);
}
.step-icon svg { width:34px; height:34px; stroke-width:2.15; }
.step h3 { margin:8px 0 5px; text-transform:uppercase; font-size:.95rem; }
.step p { margin:0; color:#d9e3ef; font-size:.88rem; }

.about { background:white; }
.about-grid { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); align-items:stretch; }
.about-image-wrap { min-height:460px; overflow:hidden; background:#e8edf2; }
.about-image-wrap img { width:100%; height:100%; object-fit:cover; object-position:center 43%; }
.about-copy { padding:54px clamp(32px,6vw,92px); display:flex; flex-direction:column; justify-content:center; }
.about-copy .eyebrow { text-align:left; }
.about-copy h2 { font-size:clamp(34px,4.3vw,55px); margin-bottom:20px; }
.about-copy p { max-width:620px; color:#263449; margin:7px 0; }
.script-note { color:#1165bc !important; font-weight:800; font-size:1.3rem; font-style:italic; text-align:right; padding-right:50px; display:flex; justify-content:flex-end; align-items:center; gap:8px; }
.script-note svg { width:22px; height:22px; stroke-width:2.4; }

.join { background:linear-gradient(105deg,#11478d,#0a2c66); color:white; padding:34px 0; }
.join-grid { display:grid; grid-template-columns:1fr auto; align-items:center; gap:40px; }
.join h2 { font-size:clamp(30px,3.7vw,46px); }
.join p { max-width:560px; margin:10px 0 0; color:#e7eef8; }
.join-action { text-align:center; }

.footer { background:#051421; color:white; padding:28px 0 34px; }
.footer-grid { display:grid; grid-template-columns:1.25fr 1fr auto; gap:40px; align-items:end; }
.footer-brand { font-size:1.25rem; }
.footer p { color:#bcc9d8; font-size:.8rem; max-width:280px; margin:7px 0 0; }
.footer nav { display:flex; gap:24px; }
.copyright { white-space:nowrap; }
.mobile-cta { display:none; }

@media (max-width: 980px) {
  .container { width:min(calc(100% - 32px), var(--container)); }
  .desktop-nav { display:none; }
  .nav-wrap .btn-small { margin-left:auto; }
  .hero { min-height:auto; padding-bottom:0; display:block; }
  .hero-visual { position:relative; inset:auto; height:420px; margin-top:0; order:2; }
  .hero-visual img { object-position:center 48%; }
  .hero-shade { background:linear-gradient(180deg,rgba(3,14,27,.98) 0%,rgba(3,14,27,.96) 50%,rgba(3,14,27,.40) 74%,rgba(3,14,27,.06) 100%); }
  .hero-grid { padding-top:86px; }
  .hero-copy { width:100%; max-width:680px; padding:70px 0 430px; }
  .strategy-grid { gap:16px; }
  .strategy-card { padding:28px 18px; }
  .steps { grid-template-columns:repeat(2,1fr); gap:34px 18px; }
  .steps::before { display:none; }
  .about-grid { grid-template-columns:1fr; }
  .about-image-wrap { min-height:0; aspect-ratio:16/9; }
  .about-copy { padding:44px max(24px,7vw) 52px; }
  .join-grid { grid-template-columns:1fr; text-align:center; }
  .join p { margin-inline:auto; }
  .footer-grid { grid-template-columns:1fr; gap:22px; text-align:center; }
  .footer p { margin-inline:auto; }
  .footer nav { justify-content:center; flex-wrap:wrap; }
  .copyright { margin-inline:auto !important; }
}

@media (max-width: 720px) {
  body { padding-bottom:64px; }
  .site-header { padding:17px 0; }
  .nav-wrap { gap:12px; }
  .brand { font-size:20px; }
  .btn-small { padding:10px 13px; font-size:.73rem; }
  .hero { background:#061422; }
  .hero-grid { padding-top:68px; }
  .hero-copy { padding:54px 0 355px; text-align:left; }
  .hero-eyebrow { margin-bottom:8px; }
  .hero h1 { font-size:clamp(46px,13vw,68px); max-width:620px; }
  .brush-line { width:200px; margin:14px 0 22px; }
  .hero-lead, .hero-sub { font-size:1rem; max-width:560px; }
  .hero .btn-primary { width:100%; padding:17px 16px; }
  .trust-row { justify-content:center; font-size:.76rem; }
  .hero-visual { height:330px; position:absolute; left:0; right:0; bottom:0; }
  .hero-visual img { object-position:56% 50%; }
  .hero-shade { background:linear-gradient(180deg,#061422 0%,#061422 49%,rgba(6,20,34,.78) 66%,rgba(6,20,34,.12) 100%); }
  .section { padding:56px 0 60px; }
  .section h2, .section-dark h2 { font-size:38px; }
  .section-intro { font-size:.96rem; }
  .strategy-grid { grid-template-columns:1fr; gap:16px; }
  .featured-card { transform:none; }
  .strategy-card { min-height:0; padding:28px 24px; }
  .strategy-card h3 { font-size:1.4rem; }
  .support-band { align-items:flex-start; padding:20px; }
  .support-star { font-size:1.9rem; }
  .steps { grid-template-columns:1fr; gap:26px; }
  .step { max-width:380px; margin-inline:auto; }
  .about-image-wrap { aspect-ratio: 4 / 3; }
  .about-image-wrap img { object-position:60% center; }
  .about-copy { padding:40px 22px 46px; }
  .about-copy h2 { font-size:38px; }
  .script-note { text-align:left; padding-right:0; justify-content:flex-start; }
  .join { padding:32px 0; }
  .join-action .btn-wide { display:none; }
  .join-action .trust-row { display:none; }
  .footer { padding-bottom:28px; }
  .mobile-cta {
    display:flex; position:fixed; z-index:80; left:12px; right:12px; bottom:10px; height:52px;
    align-items:center; justify-content:center; border-radius:7px; text-decoration:none; text-transform:uppercase;
    font-weight:900; color:white; background:linear-gradient(135deg,var(--orange),var(--orange-2));
    box-shadow:0 12px 30px rgba(1,12,24,.35);
  }
}

@media (max-width: 430px) {
  .container { width:calc(100% - 28px); }
  .brand { font-size:17px; }
  .brand-dot { display:none; }
  .btn-small { font-size:.68rem; padding:9px 11px; }
  .hero-copy { padding-top:48px; padding-bottom:325px; }
  .hero h1 { font-size:44px; }
  .hero-visual { height:300px; }
  .hero-visual img { object-position:60% 50%; }
  .hero-lead, .hero-sub { font-size:.95rem; }
  .section h2, .section-dark h2, .about-copy h2 { font-size:33px; }
  .icon-badge { width:92px; height:92px; border-radius:23px; }
  .icon-badge .icon-main { width:48px; height:48px; }
  .icon-accent { width:34px; height:34px; border-radius:11px; }
  .icon-accent svg { width:17px; height:17px; }
  .about-image-wrap { aspect-ratio: 1 / 1; }
  .about-image-wrap img { object-position:58% center; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { transition:none !important; }
}