:root {
  --bg: #031426;
  --bg-deep: #020d19;
  --panel: rgba(5, 29, 51, 0.72);
  --panel-strong: #061d32;
  --text: #f7fbff;
  --muted: #a9bfd2;
  --blue: #2a91ff;
  --blue-light: #69c4ff;
  --cyan: #6dd4ff;
  --line: rgba(112, 193, 255, 0.22);
  --max: 1480px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg-deep);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

.site-header {
  position: fixed;
  z-index: 50;
  top: 0; left: 0;
  width: 100%; height: 78px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 34px;
  padding: 0 clamp(24px, 4vw, 72px);
  background: linear-gradient(180deg, rgba(2,13,25,.94), rgba(2,13,25,.35));
  border-bottom: 1px solid rgba(255,255,255,.07);
  backdrop-filter: blur(12px);
}
.brand, .footer-brand {
  display: inline-flex;
  align-items: baseline;
  font-style: italic;
  font-weight: 900;
  letter-spacing: -.065em;
  line-height: 1;
  padding-right: .32em;
  overflow: visible;
  filter: drop-shadow(0 3px 12px rgba(0,0,0,.34));
}
.brand { font-size: 31px; }
.brand-dive, .footer-brand span { color: #fff; }
.brand-4d, .footer-brand strong {
  display: inline-block;
  padding-left: 4px;
  padding-right: .20em;
  overflow: visible;
  color: transparent;
  background: linear-gradient(180deg,#64b9ff 0%,#1685f5 56%,#0872dd 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
.nav-links {
  justify-self: center;
  display: flex;
  align-items: center;
  gap: clamp(17px,2.2vw,36px);
  color: #cfdeea;
  font-size: 12px;
  font-weight: 650;
  letter-spacing: .035em;
}
.nav-links a { transition: color .18s ease; }
.nav-links a:hover { color: #fff; }
.nav-cta {
  padding: 11px 17px;
  border: 1px solid rgba(105,196,255,.48);
  border-radius: 999px;
  color: #eaf7ff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .045em;
  background: rgba(5,54,92,.36);
}

.hero {
  position: relative;
  isolation: isolate;
  min-height: 720px;
  height: min(82vh, 900px);
  overflow: hidden;
  background: #041424;
}
.hero-image,.hero-shade { position:absolute; inset:0; }
.hero-image {
  z-index: -3;
  background: url("dive4d-hero-bg.png") center center / cover no-repeat;
}
.hero-shade {
  z-index: -2;
  background:
    linear-gradient(90deg,rgba(1,10,20,.10) 0%,rgba(1,10,20,.04) 22%,rgba(1,10,20,.18) 54%,rgba(1,10,20,.10) 100%),
    linear-gradient(180deg,rgba(1,10,20,.02) 0%,rgba(1,10,20,.02) 50%,rgba(1,10,20,.86) 100%);
}
.hero-copy {
  position: absolute;
  z-index: 2;
  left: clamp(30px, 27vw, 570px);
  bottom: clamp(68px, 9vh, 105px);
  width: min(660px, 48vw);
  padding: 27px 32px 28px;
  background: linear-gradient(100deg,rgba(1,13,25,.86),rgba(1,13,25,.52) 62%,rgba(1,13,25,.12));
  border-left: 2px solid rgba(63,168,255,.88);
  box-shadow: 0 20px 70px rgba(0,0,0,.3);
  backdrop-filter: blur(4px);
}
.eyebrow,.section-kicker {
  margin: 0 0 10px;
  color: var(--blue-light);
  text-transform: uppercase;
  letter-spacing: .2em;
  font-size: 11px;
  font-weight: 800;
}
.hero-logo {
  margin: 0;
  display: flex;
  align-items: baseline;
  line-height: .88;
  font-style: italic;
  font-weight: 900;
  letter-spacing: -.075em;
  font-size: clamp(64px,6.6vw,118px);
  padding-right: .35em;
  overflow: visible;
  text-shadow: 0 6px 24px rgba(0,0,0,.42);
}
.hero-logo span { color:#fff; }
.hero-logo strong {
  display:inline-block;
  margin-left:.03em;
  padding-right:.32em;
  overflow:visible;
  color:transparent;
  background:linear-gradient(180deg,#65bdff 0%,#2697ff 48%,#0877e9 100%);
  -webkit-background-clip:text;
  background-clip:text;
}
.hero-tagline { margin:19px 0 3px; font-size:clamp(26px,2.1vw,38px); font-weight:400; letter-spacing:.02em; }
.hero-promise { margin:0 0 16px; color:#9ed4ff; font-size:14px; font-weight:800; letter-spacing:.22em; text-transform:uppercase; }
.hero-description { max-width:610px; margin:0; color:#d7e4ee; font-size:clamp(14px,1.1vw,17px); line-height:1.62; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; }
.button {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; padding:0 19px; border-radius:5px;
  font-size:12px; font-weight:850; letter-spacing:.045em;
  transition:transform .18s ease,filter .18s ease;
}
.button:hover { transform:translateY(-1px); filter:brightness(1.06); }
.button-primary { background:linear-gradient(180deg,#289eff,#0878e7); box-shadow:0 9px 28px rgba(0,119,232,.3); }
.button-secondary { border:1px solid rgba(166,216,255,.38); background:rgba(255,255,255,.05); }
.button.large { min-height:50px; padding:0 24px; margin-top:20px; }
.hero-footnote {
  position:absolute; left:50%; bottom:22px; transform:translateX(-50%); z-index:2;
  display:flex; align-items:center; justify-content:center; gap:13px;
  width:100%; padding:0 22px; color:rgba(216,235,249,.74);
  font-size:10px; text-transform:uppercase; letter-spacing:.16em; white-space:nowrap;
}
.hero-footnote i { width:3px;height:3px;border-radius:50%;background:#3aa8ff; }

.section { padding: 104px clamp(28px, 6.4vw, 122px); }
.section > * { max-width: var(--max); margin-left:auto; margin-right:auto; }
h2 { margin:12px 0 18px; font-size:clamp(38px,4.3vw,70px); line-height:1.02; letter-spacing:-.047em; }
h3 { letter-spacing:-.03em; }
.lead { color:#d4e2ec; font-size:clamp(18px,1.55vw,23px); line-height:1.62; }
.lead-small { color:#d4e2ec; font-size:18px; line-height:1.6; }
.section-intro { max-width:880px; color:#a9c0d2; font-size:clamp(16px,1.25vw,20px); line-height:1.7; }
.centered { text-align:center; }
.centered .section-intro { margin-left:auto; margin-right:auto; }

.story {
  background:
    radial-gradient(circle at 82% 15%,rgba(24,126,200,.15),transparent 30%),
    linear-gradient(180deg,#031426,#020d19);
}
.story-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:70px; align-items:start; }
.story-grid h2 { max-width:820px; }
.story-copy { padding-top:42px; color:#a9c0d2; font-size:16px; line-height:1.75; }
.story-copy .lead { margin-top:0; }
.story-line { margin-top:30px; padding:20px 22px; border-left:2px solid #2a91ff; background:rgba(12,48,77,.44); color:#e8f5ff; font-size:18px; }

.technology { background:#020d19; }
.technology .section-heading { margin-bottom:58px; }
.feature-stack { display:grid; gap:30px; }
.feature {
  display:grid; grid-template-columns:minmax(0,1.45fr) minmax(330px,.55fr); gap:0;
  align-items:stretch; overflow:hidden;
  border:1px solid rgba(112,193,255,.2);
  background:linear-gradient(180deg,rgba(10,38,63,.92),rgba(4,20,34,.96));
  box-shadow:0 22px 70px rgba(0,0,0,.22);
}
.feature-reverse { grid-template-columns:minmax(330px,.55fr) minmax(0,1.45fr); }
.feature-reverse .feature-media { order:2; }
.feature-reverse .feature-copy { order:1; }
.feature-media { min-height:400px; background:#061929; display:flex; align-items:center; }
.feature-media img { width:100%; height:100%; object-fit:cover; }
.feature-copy { position:relative; padding:clamp(30px,4vw,58px); display:flex; flex-direction:column; justify-content:center; }
.feature-number { position:absolute; right:30px; top:22px; color:rgba(86,183,255,.28); font-size:48px; font-weight:900; }
.feature-copy h3 { margin:6px 0 15px; font-size:clamp(28px,2.5vw,44px); line-height:1.05; }
.feature-copy p:not(.section-kicker) { margin:0; color:#a9c0d2; font-size:15px; line-height:1.72; }
.chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.chips span { padding:7px 10px; border:1px solid rgba(105,196,255,.24); border-radius:999px; color:#c6e6fb; font-size:11px; letter-spacing:.03em; background:rgba(28,107,164,.10); }

.club {
  background:
    radial-gradient(circle at 20% 10%,rgba(20,112,185,.20),transparent 30%),
    linear-gradient(180deg,#041727,#03111e);
}
.club-head { max-width:930px; }
.club-stats { margin-top:46px; display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); background:rgba(5,25,43,.72); }
.club-stats div { padding:28px 24px; border-right:1px solid var(--line); }
.club-stats div:last-child { border-right:0; }
.club-stats strong { display:block; font-size:clamp(34px,3vw,54px); color:#fff; letter-spacing:-.045em; }
.club-stats span { color:#8eb6d0; font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.coach-card { margin-top:30px; display:grid; grid-template-columns:minmax(320px,.62fr) minmax(0,1.38fr); overflow:hidden; border:1px solid var(--line); background:linear-gradient(135deg,rgba(8,42,69,.95),rgba(4,20,34,.96)); }
.coach-photo-wrap { min-height:540px; background:linear-gradient(135deg,#082640,#03111e); }
.coach-photo { width:100%; height:100%; min-height:540px; object-fit:cover; object-position:center 30%; }
.coach-placeholder { height:100%; min-height:540px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; background:radial-gradient(circle at 50% 40%,rgba(42,145,255,.28),transparent 35%),linear-gradient(135deg,#0a3152,#03111e); }
.coach-placeholder span { display:grid; place-items:center; width:170px; height:170px; border-radius:50%; border:1px solid rgba(105,196,255,.46); color:#a8dcff; font-size:62px; font-weight:900; }
.coach-placeholder small { color:#7ea8c5; text-align:center; line-height:1.5; text-transform:uppercase; letter-spacing:.08em; }
.coach-copy { padding:clamp(36px,5vw,72px); }
.coach-copy h3 { margin:5px 0 2px; font-size:clamp(42px,4vw,68px); }
.coach-role { margin:0 0 26px; color:#71c7ff; text-transform:uppercase; letter-spacing:.10em; font-size:12px; font-weight:800; }
.coach-copy > p:not(.section-kicker):not(.coach-role):not(.micro-source) { color:#aec4d5; line-height:1.72; }
.coach-achievements { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:30px; }
.coach-achievements div { padding:20px 18px; background:rgba(2,16,28,.55); border:1px solid rgba(112,193,255,.16); }
.coach-achievements strong { display:block; color:#eaf7ff; font-size:19px; }
.coach-achievements span { display:block; margin-top:5px; color:#87a9c0; font-size:11px; line-height:1.45; text-transform:uppercase; letter-spacing:.05em; }
.micro-source { margin-top:22px; color:#668aa4; font-size:11px; }

.athletes { background:linear-gradient(180deg,#020d19,#041524); }
.split-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,.55fr); gap:60px; align-items:end; }
.split-heading .section-intro { margin-bottom:18px; }
.profile-demo { margin-top:54px; border:1px solid var(--line); background:linear-gradient(135deg,rgba(8,43,72,.92),rgba(3,19,32,.97)); overflow:hidden; }
.profile-visual { display:grid; grid-template-columns:auto 1fr auto; gap:22px; align-items:center; padding:30px 34px; border-bottom:1px solid var(--line); background:radial-gradient(circle at 75% 30%,rgba(33,135,207,.22),transparent 30%); }
.profile-avatar { width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,#2b9fff,#0875da);font-size:30px;font-weight:900;box-shadow:0 10px 26px rgba(0,91,180,.28); }
.profile-label { color:#75c8ff; font-size:11px; text-transform:uppercase; letter-spacing:.13em; font-weight:800; }
.profile-visual h3 { margin:5px 0 0; font-size:clamp(24px,2.2vw,37px); }
.progress-ring { width:120px;height:120px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:8px solid rgba(58,168,255,.18);box-shadow:inset 0 0 0 2px #2c9fff; }
.progress-ring span { font-size:28px;font-weight:900;color:#8dd8ff; }
.progress-ring small { margin-top:3px;color:#789db7;font-size:9px;text-align:center;text-transform:uppercase;letter-spacing:.06em; }
.profile-grid { display:grid; grid-template-columns:repeat(3,1fr); }
.profile-grid div { min-height:130px; padding:28px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.profile-grid div:nth-child(3n) { border-right:0; }
.profile-grid div:nth-child(n+4) { border-bottom:0; }
.profile-grid span { display:block; color:#6fc7ff; font-size:11px; text-transform:uppercase; letter-spacing:.11em; }
.profile-grid strong { display:block; margin-top:14px; font-size:16px; line-height:1.35; }
.privacy-note { margin-top:18px; padding:22px 24px; display:flex; gap:20px; align-items:flex-start; border-left:2px solid #38a7ff; background:rgba(9,47,76,.40); }
.privacy-note strong { min-width:275px; }
.privacy-note span { color:#9db9cc; line-height:1.6; }

.families { background:radial-gradient(circle at 12% 20%,rgba(26,115,183,.2),transparent 30%),#03111f; }
.family-panel { display:grid; grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); gap:70px; align-items:center; }
.family-copy h2 { max-width:720px; }
.family-copy > p:not(.section-kicker) { color:#a9c0d2; line-height:1.75; }
.family-steps { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.family-steps div { min-height:180px; padding:28px; border:1px solid var(--line); background:linear-gradient(180deg,rgba(9,42,69,.84),rgba(5,24,40,.92)); }
.family-steps span { color:#4db1ff; font-size:12px;font-weight:900;letter-spacing:.12em; }
.family-steps strong { display:block; margin-top:28px; font-size:21px; }
.family-steps small { display:block; margin-top:7px; color:#87a8bd; font-size:12px; line-height:1.45; }

.partners { background:linear-gradient(180deg,#041627,#020b14); }
.partner-shell { position:relative; padding:clamp(38px,5vw,72px); border:1px solid rgba(112,193,255,.22); background:radial-gradient(circle at 83% 10%,rgba(30,127,201,.22),transparent 30%),linear-gradient(135deg,rgba(7,37,62,.98),rgba(3,17,29,.98)); overflow:hidden; }
.partner-shell::after { content:"4D"; position:absolute; right:-25px; top:-55px; font-style:italic; font-weight:900; font-size:250px; color:rgba(38,145,255,.045); letter-spacing:-.08em; }
.partner-copy { position:relative; z-index:1; max-width:870px; }
.partner-copy h2 { max-width:870px; }
.partner-copy > p:not(.section-kicker) { color:#a9c0d2; line-height:1.7; }
.partner-benefits { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:48px; }
.partner-benefits article { padding:28px; border:1px solid var(--line); background:rgba(3,19,32,.66); }
.partner-benefits span { color:#4eaffb; font-weight:900; letter-spacing:.1em; font-size:12px; }
.partner-benefits h3 { margin:24px 0 10px; font-size:23px; }
.partner-benefits p { margin:0; color:#8eabbf; font-size:14px; line-height:1.65; }
.partner-slots { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:22px; }
.partner-slots div { min-height:120px; display:flex; align-items:center; justify-content:space-between; padding:24px 26px; border:1px dashed rgba(105,196,255,.33); color:#83aac4; background:rgba(1,13,23,.44); }
.partner-slots span { font-size:10px; letter-spacing:.13em; }
.partner-slots strong { color:rgba(115,201,255,.45); font-size:34px; }

.closing { text-align:center; background:linear-gradient(180deg,#020b14,#01070d); }
.closing h2 { max-width:1050px; margin-left:auto; margin-right:auto; }
.closing-links { display:flex; justify-content:center; gap:12px; color:#78c9ff; margin-top:30px; font-size:13px; }
.site-footer { min-height:150px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:28px; padding:34px clamp(28px,6.4vw,122px); border-top:1px solid rgba(112,193,255,.12); background:#01070d; }
.footer-brand { font-size:28px; }
.site-footer p { margin:0; color:#7e9cb0; font-size:12px; }
.footer-source { text-align:right; max-width:520px; }

@media (max-width: 1120px) {
  .nav-links { display:none; }
  .site-header { grid-template-columns:auto 1fr; }
  .nav-cta { justify-self:end; }
  .hero-copy { left:24px; width:min(680px,62vw); }
  .feature,.feature-reverse { grid-template-columns:1fr; }
  .feature-reverse .feature-media,.feature-reverse .feature-copy { order:initial; }
  .club-stats { grid-template-columns:repeat(2,1fr); }
  .club-stats div:nth-child(2) { border-right:0; }
  .club-stats div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .coach-card { grid-template-columns:.8fr 1.2fr; }
  .coach-achievements { grid-template-columns:1fr; }
  .profile-grid { grid-template-columns:repeat(2,1fr); }
  .profile-grid div:nth-child(3n) { border-right:1px solid var(--line); }
  .profile-grid div:nth-child(2n) { border-right:0; }
  .profile-grid div:nth-child(n+5) { border-bottom:0; }
  .profile-grid div:nth-child(4) { border-bottom:1px solid var(--line); }
}

@media (max-width: 780px) {
  .site-header { height:68px; padding:0 18px; }
  .brand { font-size:26px; }
  .nav-cta { display:none; }
  .hero { height:auto; min-height:800px; display:flex; align-items:flex-end; }
  .hero-image { background-size:auto 470px; background-position:31% 70px; background-color:#031426; }
  .hero-shade { background:linear-gradient(180deg,rgba(2,13,25,.02) 0%,rgba(2,13,25,.15) 40%,#020d19 64%,#020d19 100%); }
  .hero-copy { position:relative; inset:auto; width:100%; margin:0; padding:390px 22px 55px; border-left:0; background:transparent; box-shadow:none; backdrop-filter:none; }
  .hero-logo { font-size:64px; }
  .hero-footnote { display:none; }
  .section { padding:74px 22px; }
  .story-grid,.split-heading,.family-panel { grid-template-columns:1fr; gap:25px; }
  .story-copy { padding-top:0; }
  .feature-media { min-height:0; }
  .feature-copy { padding:30px 24px 34px; }
  .feature-number { display:none; }
  .club-stats { grid-template-columns:1fr 1fr; }
  .coach-card { grid-template-columns:1fr; }
  .coach-photo-wrap,.coach-photo,.coach-placeholder { min-height:420px; }
  .profile-visual { grid-template-columns:auto 1fr; }
  .progress-ring { grid-column:1 / -1; justify-self:start; }
  .profile-grid { grid-template-columns:1fr; }
  .profile-grid div,.profile-grid div:nth-child(3n),.profile-grid div:nth-child(2n),.profile-grid div:nth-child(n+5),.profile-grid div:nth-child(4) { border-right:0; border-bottom:1px solid var(--line); }
  .profile-grid div:last-child { border-bottom:0; }
  .privacy-note { flex-direction:column; gap:8px; }
  .privacy-note strong { min-width:0; }
  .family-steps,.partner-benefits,.partner-slots { grid-template-columns:1fr; }
  .site-footer { grid-template-columns:1fr; text-align:left; }
  .footer-source { text-align:left; }
}