:root {
  color-scheme: light;
  --bg: #dff3ff;
  --bg-soft: #eef9ff;
  --ink: #082a4a;
  --muted: #45677f;
  --line: rgba(31, 105, 158, 0.22);
  --panel: rgba(255, 255, 255, 0.84);
  --panel-strong: #ffffff;
  --blue-950: #031a30;
  --blue-900: #062642;
  --blue-800: #073a68;
  --blue-700: #0c5f9f;
  --blue-600: #1578bf;
  --blue-400: #68bdf0;
  --blue-200: #c8ebff;
  --blue-100: #e7f6ff;
  --gold: #c79532;
  --shadow: 0 22px 70px rgba(8, 42, 74, 0.16);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: linear-gradient(180deg, #d8efff 0%, #edf9ff 44%, #dff3ff 100%); color: var(--ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; margin: 0; }
body.nav-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
img { display: block; max-width: 100%; }
h1, h2, h3, p, dl, dd, ul { margin: 0; }
h1 { font-size: clamp(2.5rem, 7vw, 6rem); letter-spacing: 0; line-height: 0.92; max-width: 10ch; }
h2 { font-size: clamp(1.75rem, 4vw, 3.25rem); letter-spacing: 0; line-height: 1; }
h3 { font-size: 1.06rem; line-height: 1.2; }
p, li { line-height: 1.65; }
ul { padding-left: 1.1rem; }

.site-header { align-items: center; background: rgba(226, 244, 255, 0.92); border-bottom: 1px solid var(--line); backdrop-filter: blur(18px); display: flex; gap: 24px; justify-content: space-between; padding: 12px clamp(18px, 4vw, 56px); position: sticky; top: 0; z-index: 20; }
.brand { align-items: center; display: inline-flex; gap: 12px; min-width: 0; }
.brand-main { align-items: center; display: inline-flex; gap: 12px; min-width: 0; }
.brand-logo { background: white; border: 1px solid rgba(255, 255, 255, 0.86); border-radius: 8px; box-shadow: 0 8px 22px rgba(8, 42, 74, 0.1); flex: 0 0 auto; height: 78px; object-fit: contain; padding: 5px; width: 78px; }
.brand strong, .brand small { display: block; }
.brand-email { border-left: 1px solid var(--line); color: var(--blue-800); font-size: 0.92rem; font-weight: 800; margin-left: 4px; padding-left: 14px; white-space: nowrap; }
.brand small { color: var(--muted); margin-top: 2px; }
.primary-nav { align-items: center; display: flex; gap: 6px; }
.primary-nav a { border-radius: 8px; color: var(--muted); font-size: 0.95rem; font-weight: 700; padding: 10px 10px; white-space: nowrap; }
.primary-nav a:hover { background: rgba(255, 255, 255, 0.65); color: var(--ink); }
.nav-toggle { background: transparent; border: 1px solid var(--line); border-radius: 8px; display: none; height: 42px; padding: 9px; width: 44px; }
.nav-toggle span { background: var(--ink); display: block; height: 2px; margin: 5px 0; }

.hero { display: grid; gap: clamp(28px, 5vw, 70px); grid-template-columns: minmax(280px, 0.82fr) minmax(0, 1.18fr); min-height: calc(100vh - 77px); padding: clamp(26px, 5vw, 72px) clamp(18px, 4vw, 56px) 40px; }
.hero-photo { align-items: center; align-self: stretch; background: linear-gradient(145deg, #f8fcff, #acdfff 48%, #2a86c7); border: 1px solid rgba(255, 255, 255, 0.72); border-radius: 8px; box-shadow: var(--shadow); display: flex; justify-content: center; justify-self: end; max-width: 360px; min-height: 245px; overflow: hidden; padding: clamp(10px, 1.8vw, 17px); width: 100%; position: relative; }
.hero-photo img { aspect-ratio: 4 / 5; background: linear-gradient(180deg, #ffffff, #d7efff); border: 0; border-radius: 8px; box-shadow: 0 24px 55px rgba(8, 42, 74, 0.24); height: min(50vh, 360px); object-fit: cover; object-position: 34% 58%; width: min(86%, 292px); }
.media-stat { background: rgba(255, 255, 255, 0.92); border: 1px solid rgba(255, 255, 255, 0.8); border-radius: 8px; bottom: 22px; left: 22px; max-width: calc(100% - 44px); padding: 18px; position: absolute; }
.media-stat span { color: var(--blue-700); display: block; font-size: 2.2rem; font-weight: 850; line-height: 1; }
.media-stat strong { display: block; margin-top: 8px; }
.hero-copy { align-content: start; display: grid; gap: 22px; }
.hero-logo { background: white; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 14px 34px rgba(8, 42, 74, 0.12); height: clamp(180px, 29vw, 292px); object-fit: contain; padding: 12px; width: clamp(180px, 29vw, 292px); }
.eyebrow { color: var(--blue-700); font-size: 0.78rem; font-weight: 850; letter-spacing: 0; text-transform: uppercase; }
.lead { color: #254d6c; font-size: clamp(1.05rem, 2vw, 1.35rem); max-width: 820px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.button { align-items: center; border: 1px solid var(--blue-900); border-radius: 8px; cursor: pointer; display: inline-flex; font-weight: 800; justify-content: center; min-height: 48px; padding: 0 18px; }
.button.primary { background: linear-gradient(135deg, var(--blue-900), var(--blue-600)); color: white; }
.button.secondary { background: rgba(255, 255, 255, 0.54); }
.button:hover { transform: translateY(-1px); }
.hero-proof { border-top: 1px solid var(--line); display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); padding-top: 24px; }
.hero-proof div { min-width: 0; }
.hero-proof dt { color: var(--blue-700); font-size: clamp(1.45rem, 3vw, 2.2rem); font-weight: 850; }
.hero-proof dd { color: var(--muted); line-height: 1.35; }

.section { padding: clamp(58px, 8vw, 112px) clamp(18px, 4vw, 56px); }
.strip { background: linear-gradient(135deg, var(--blue-950), var(--blue-800) 45%, var(--blue-600)); color: white; padding-bottom: clamp(32px, 6vw, 58px); padding-top: clamp(32px, 6vw, 58px); }
.strip p { font-size: clamp(1.25rem, 3vw, 2.3rem); font-weight: 760; line-height: 1.18; max-width: 1160px; }
.split { display: grid; gap: 42px; grid-template-columns: minmax(260px, 0.76fr) minmax(0, 1.24fr); }
.split h2, .section-heading h2 { margin-top: 10px; max-width: 940px; }
.pain-grid, .offer-grid, .benefit-grid, .value-grid, .asset-grid { display: grid; gap: 14px; }
.pain-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pain-grid article, .offer-card, .add-ons article, .profile-text, .contact-form, .benefit-grid article, .value-grid article, .asset-grid article { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 10px 36px rgba(8, 42, 74, 0.07); }
.pain-grid article { min-height: 174px; padding: 22px; }
.pain-grid article p:first-child { color: var(--ink); font-size: 1.02rem; font-weight: 760; margin-top: 0; }
.pain-grid p, .offer-card p, .contact p, .form-note, .profile-text p, .benefit-grid li, .value-grid p, .asset-grid p { color: var(--muted); }
.pain-grid p, .offer-card p, .value-grid p, .asset-grid p { margin-top: 10px; }
.section-heading { margin-bottom: 28px; }
.benefits { background: linear-gradient(180deg, rgba(255, 255, 255, 0.38), rgba(198, 235, 255, 0.5)); }
.benefit-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.benefit-grid article { padding: 24px; }
.benefit-grid ul { display: grid; gap: 9px; margin-top: 14px; }
.benefit-grid li { font-weight: 700; }
.offer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.offer-card { display: grid; gap: 14px; min-height: 360px; padding: 24px; }
.offer-card.featured { background: linear-gradient(145deg, var(--blue-900), var(--blue-700)); border-color: rgba(255, 255, 255, 0.45); color: white; }
.offer-card.featured p, .offer-card.featured small { color: #dff3ff; }
.offer-kicker { color: var(--blue-700); font-size: 0.78rem; font-weight: 850; text-transform: uppercase; }
.featured .offer-kicker { color: #aee2ff; }
.price { color: var(--blue-700); font-size: 2rem; font-weight: 850; margin-top: auto; }
.featured .price { color: #ffffff; }
.offer-card small { color: var(--muted); }
.add-ons { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 14px; }
.add-ons article { display: grid; gap: 8px; min-height: 132px; padding: 18px; }
.add-ons span { color: var(--muted); line-height: 1.5; }

.value-section { background: linear-gradient(135deg, #d2edff, #f4fbff 46%, #c0e7ff); }
.value-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.value-grid article { min-height: 220px; padding: 22px; }
.value-grid span { align-items: center; background: linear-gradient(135deg, var(--blue-900), var(--blue-600)); border-radius: 8px; color: white; display: inline-flex; font-size: 2rem; font-weight: 900; height: 54px; justify-content: center; margin-bottom: 18px; width: 54px; }
.deliverables { background: linear-gradient(180deg, rgba(255, 255, 255, 0.46), rgba(198, 235, 255, 0.62)); }
.table-wrap { overflow-x: auto; }
.deliverables-table { border-collapse: collapse; min-width: 840px; width: 100%; }
.deliverables-table th, .deliverables-table td { border-bottom: 1px solid var(--line); padding: 15px 16px; text-align: left; vertical-align: top; }
.deliverables-table th { background: linear-gradient(135deg, var(--blue-900), var(--blue-700)); color: white; font-size: 0.92rem; }
.deliverables-table td { background: rgba(255, 255, 255, 0.76); color: var(--muted); }
.deliverables-table td:first-child { color: var(--ink); font-weight: 780; }
.deliverables-table tr:hover td { background: #ffffff; }
.assets-section { background: linear-gradient(180deg, #eef9ff, #d8efff); }
.asset-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.asset-grid article { min-height: 170px; padding: 22px; }
.proof-section { display: grid; gap: 30px; grid-template-columns: 1fr; }
.proof-copy { align-content: start; display: grid; gap: 18px; max-width: 940px; }
.profile-text { display: grid; gap: 16px; padding: clamp(22px, 4vw, 34px); }
.profile-text p { font-size: 1.04rem; font-weight: 700; }

.contact { background: linear-gradient(135deg, #d3efff, #eef9ff 58%, #bce6ff); display: grid; gap: 34px; grid-template-columns: minmax(280px, 0.85fr) minmax(0, 1.15fr); padding: clamp(58px, 8vw, 112px) clamp(18px, 4vw, 56px); }
.contact h2 { margin: 10px 0 18px; }
.contact-intro { align-content: start; display: grid; gap: 18px; }
.contact-portrait { aspect-ratio: 4 / 5; border-radius: 8px; box-shadow: 0 18px 42px rgba(8, 42, 74, 0.18); height: 220px; object-fit: cover; object-position: 50% 18%; width: 165px; }
.contact-bio { background: rgba(255, 255, 255, 0.56); border: 1px solid var(--line); border-radius: 8px; display: grid; gap: 12px; padding: 18px; }
.contact-bio strong { color: var(--ink); }
.strengths-list { gap: 14px; }
.strengths-list h3 { color: var(--blue-900); font-size: 1.35rem; }
.strengths-list article { border-top: 1px solid var(--line); display: grid; gap: 6px; padding-top: 12px; }
.strengths-list article:first-of-type { border-top: 0; padding-top: 0; }
.contact-form { display: grid; gap: 14px; padding: clamp(20px, 4vw, 30px); }
.contact-form label { color: #164160; display: grid; font-weight: 760; gap: 7px; }
.contact-form input, .contact-form select, .contact-form textarea { background: #fbfdff; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); min-height: 46px; padding: 10px 12px; width: 100%; }
.contact-form textarea { resize: vertical; }
.form-note { font-size: 0.92rem; }
.site-footer { align-items: center; background: linear-gradient(135deg, #061f36, #0b558d); color: white; display: grid; gap: 12px; justify-items: center; text-align: center; padding: 24px clamp(18px, 4vw, 56px); }
.footer-links { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.site-footer a { color: #d7f0ff; font-weight: 800; }

@media (max-width: 1180px) {
  .pain-grid, .benefit-grid, .asset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .value-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .add-ons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
  .hero, .split, .proof-section, .contact { grid-template-columns: 1fr; }
  .hero { min-height: 0; }
  .hero-photo { justify-self: start; max-width: 330px; min-height: 230px; order: 2; }
  .hero-copy { order: 1; }
  h1 { max-width: 13ch; }
  .offer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .site-header { align-items: center; }
  .nav-toggle { display: block; }
  .primary-nav { background: #e2f4ff; border-bottom: 1px solid var(--line); display: none; flex-direction: column; left: 0; padding: 14px 18px 18px; position: absolute; right: 0; top: 77px; }
  .nav-open .primary-nav { display: flex; }
  .primary-nav a { width: 100%; }
  .hero-proof, .pain-grid, .benefit-grid, .offer-grid, .add-ons, .value-grid, .asset-grid { grid-template-columns: 1fr; }
  .brand-logo { height: 60px; width: 60px; }
  .brand strong { font-size: 0.95rem; }
  .brand small { font-size: 0.78rem; }
  .brand-email { border-left: 0; flex-basis: 100%; font-size: 0.78rem; margin-left: 72px; padding-left: 0; }
  .hero-photo { max-width: 300px; min-height: 215px; }
  .hero-photo img { height: min(46vh, 330px); object-position: 34% 58%; width: min(88%, 270px); }
}