:root { --navy:#06264a; --navy-dark:#031a34; --blue:#5d91b4; --sky:#dfeaf0; --paper:#f5f5f1; --ink:#122236; --muted:#5d6975; --white:#fff; --line:rgba(6,38,74,.16); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"DM Sans",sans-serif; line-height:1.65; }
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
.skip-link { position:fixed; left:1rem; top:-5rem; z-index:99; padding:.8rem 1rem; background:#fff; border-radius:.35rem; }
.skip-link:focus { top:1rem; }
.site-header { height:86px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(1.25rem,4vw,5rem); background:rgba(245,245,241,.94); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20; backdrop-filter:blur(12px); }
.brand { display:flex; align-items:center; gap:.8rem; font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.brand-mark { display:grid; place-items:center; width:40px; height:40px; color:white; background:var(--navy); font-family:"Oswald",sans-serif; font-size:1rem; letter-spacing:.04em; }
nav { display:flex; align-items:center; gap:clamp(1rem,2.4vw,2.5rem); font-size:.84rem; font-weight:600; }
.nav-cta { padding:.75rem 1rem; color:#fff; background:var(--navy); }
.hero { min-height:calc(100vh - 86px); display:grid; grid-template-columns:minmax(0, .86fr) minmax(420px, 1.14fr); background:var(--navy); color:white; overflow:hidden; }
.hero-inner { display:flex; flex-direction:column; justify-content:center; padding:clamp(4rem,8vw,9rem) clamp(2rem,6vw,7.5rem); }
.eyebrow { margin:0 0 1.2rem; text-transform:uppercase; letter-spacing:.18em; font-size:.74rem; font-weight:700; }
.hero .eyebrow { color:#9ec0d5; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:1.7rem; font-family:"Oswald",sans-serif; font-size:clamp(4.5rem,8.6vw,9rem); font-weight:600; line-height:.82; text-transform:uppercase; letter-spacing:-.035em; }
h1 span { color:#8eb8d2; }
.hero-copy { max-width:610px; color:#d8e5ee; font-size:clamp(1rem,1.35vw,1.25rem); }
.hero-actions { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.5rem; }
.button { display:inline-flex; align-items:center; justify-content:center; padding:1rem 1.25rem; border:1px solid transparent; font-weight:700; font-size:.88rem; transition:.2s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:#fff; color:var(--navy); }
.button-secondary { border-color:rgba(255,255,255,.5); color:#fff; }
.hero-visual { position:relative; min-height:580px; }
.hero-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--navy),transparent 35%), linear-gradient(0deg,rgba(3,26,52,.2),transparent); }
.hero-visual img { width:100%; height:100%; object-fit:cover; }
.hero-stat { position:absolute; right:clamp(1rem,4vw,4rem); bottom:clamp(1rem,4vw,4rem); z-index:2; display:flex; align-items:baseline; gap:.8rem; padding:1.2rem 1.5rem; background:rgba(255,255,255,.93); color:var(--navy); }
.hero-stat strong { font-family:"Oswald",sans-serif; font-size:3.2rem; line-height:1; }
.hero-stat span { font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.intro { display:grid; grid-template-columns:1fr 3fr; gap:3rem; max-width:1320px; margin:auto; padding:clamp(5rem,10vw,10rem) clamp(1.25rem,4vw,4rem); border-bottom:1px solid var(--line); }
.section-number { color:var(--blue); font-family:"Oswald",sans-serif; font-size:1.2rem; }
.intro h2,.outcomes h2,.contact h2 { margin-bottom:1.5rem; font-family:"Oswald",sans-serif; color:var(--navy); font-size:clamp(2.8rem,5.5vw,5.7rem); font-weight:600; line-height:.98; letter-spacing:-.025em; text-transform:uppercase; }
.intro div > p { max-width:790px; color:var(--muted); font-size:clamp(1.05rem,1.5vw,1.3rem); }
.process { max-width:1440px; margin:auto; padding:0 clamp(1.25rem,4vw,4rem) clamp(5rem,10vw,10rem); }
.process-step { display:grid; grid-template-columns:minmax(300px,.75fr) minmax(0,1.45fr); min-height:500px; border-bottom:1px solid var(--line); }
.process-step.reverse { grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr); }
.process-step.reverse .step-copy { order:2; }
.process-step.reverse img { order:1; }
.step-copy { position:relative; align-self:center; padding:clamp(3rem,6vw,6rem); }
.step-number { position:absolute; top:2.8rem; right:2rem; color:rgba(6,38,74,.12); font-family:"Oswald",sans-serif; font-size:5rem; line-height:1; font-weight:700; }
.step-label { margin-bottom:.6rem; color:var(--blue); text-transform:uppercase; letter-spacing:.16em; font-size:.72rem; font-weight:700; }
.step-copy h2 { margin-bottom:1.3rem; color:var(--navy); font-family:"Oswald",sans-serif; font-size:clamp(2rem,3.4vw,3.7rem); line-height:1.02; text-transform:uppercase; }
.step-copy > p:last-child { max-width:470px; color:var(--muted); }
.process-step > img { width:100%; height:100%; min-height:500px; object-fit:cover; }
.outcomes { padding:clamp(5rem,10vw,10rem) clamp(1.25rem,5vw,6rem); background:#e5edf1; }
.outcomes-heading { max-width:1320px; margin:0 auto 4rem; }
.outcomes .eyebrow { color:var(--blue); }
.outcome-grid { max-width:1320px; margin:auto; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid rgba(6,38,74,.25); }
.outcome-grid article { padding:2rem 2rem 0 0; }
.outcome-grid span { color:var(--blue); font-family:"Oswald",sans-serif; }
.outcome-grid h3 { margin:.6rem 0 .8rem; color:var(--navy); font-family:"Oswald",sans-serif; font-size:1.45rem; text-transform:uppercase; }
.outcome-grid p { color:var(--muted); font-size:.92rem; }
.contact { padding:clamp(5rem,10vw,10rem) 1.25rem; text-align:center; background:var(--navy); color:white; }
.contact .eyebrow { color:#9ec0d5; }
.contact h2 { color:white; }
.button-light { background:white; color:var(--navy); }
.contact-note { margin:1.2rem auto 0; color:#aabcca; font-size:.72rem; }
footer { display:flex; justify-content:space-between; padding:2rem clamp(1.25rem,4vw,5rem); background:var(--navy-dark); color:#9fb1c1; font-size:.8rem; }
@media (max-width:900px) {
  nav a:not(.nav-cta) { display:none; }
  .hero { min-height:auto; grid-template-columns:1fr; }
  .hero-inner { min-height:620px; }
  .hero-visual { min-height:420px; }
  .hero-visual::after { background:linear-gradient(180deg,var(--navy),transparent 35%); }
  .intro { grid-template-columns:1fr; gap:1rem; }
  .process-step,.process-step.reverse { grid-template-columns:1fr; }
  .process-step.reverse .step-copy,.process-step.reverse img { order:initial; }
  .step-copy { padding:5rem 1rem 3rem; }
  .process-step > img { min-height:340px; }
  .outcome-grid { grid-template-columns:repeat(2,1fr); gap:2rem; }
}
@media (max-width:560px) {
  .site-header { height:72px; }
  .brand > span:last-child { display:none; }
  .nav-cta { padding:.65rem .8rem; }
  .hero-inner { min-height:570px; padding:4rem 1.25rem; }
  h1 { font-size:4.2rem; }
  .hero-visual { min-height:300px; }
  .hero-stat { right:.75rem; bottom:.75rem; }
  .hero-stat strong { font-size:2.5rem; }
  .process { padding-inline:0; }
  .step-copy { padding-inline:1.25rem; }
  .step-number { right:1.25rem; }
  .process-step > img { min-height:260px; }
  .outcome-grid { grid-template-columns:1fr; }
  footer { flex-direction:column; gap:.6rem; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .button { transition:none; } }
