:root{--navy:#092831;--sand:#f8efe1;--sun:#f7dc4b;--surf:#14756f;--peach:#f4a876}
*{box-sizing:border-box}
body{margin:0;color:var(--navy);background:var(--sand);font:17px/1.55 system-ui,sans-serif}
a{color:inherit;text-underline-offset:.2em}
a:focus-visible{outline:3px solid #b35121;outline-offset:5px}
header,footer{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem clamp(1rem,5vw,5rem);background:var(--navy);color:var(--sand)}
nav,.actions{display:flex;align-items:center;flex-wrap:wrap;gap:clamp(.7rem,2vw,1.5rem)}
nav>a:not(.pill){text-decoration:none;font-weight:650}
.wordmark{font:900 1.75rem/.9 Impact,"Arial Black",sans-serif;letter-spacing:.05em;text-decoration:none;display:inline-grid}
.wordmark span{color:var(--sun);font:800 .65rem/1.5 system-ui;letter-spacing:.15em}
.hero{display:grid;grid-template-columns:.95fr 1.05fr;align-items:center;gap:clamp(1rem,4vw,4rem);padding:clamp(2rem,6vw,6rem) clamp(1rem,5vw,5rem)}
.kicker{font-size:.75rem;letter-spacing:.16em;font-weight:850}
.kicker span{display:inline-block;width:.7em;height:.7em;margin-right:.5em;border-radius:50%;background:var(--surf)}
h1,h2{font:900 clamp(3.7rem,8vw,8rem)/.88 Impact,"Arial Black",sans-serif;letter-spacing:-.025em;margin:.18em 0}
h1 em{color:var(--surf);font-style:normal}
h2{font-size:clamp(2.8rem,6vw,6rem)}
.lead{max-width:38ch;font-size:clamp(1rem,2vw,1.27rem);margin:1.5rem 0}
.wave{width:100%;height:auto;display:block}
.pill{display:inline-block;background:var(--sun);color:var(--navy);border-radius:999px;padding:.85em 1.15em;font-weight:800;text-decoration:none}
.pill:hover{background:#fff08a}
.pill-small{padding:.55em .8em}
.strip{text-align:center;background:var(--sun);padding:.7rem;font-weight:850;letter-spacing:.12em;font-size:clamp(.64rem,1.5vw,.85rem)}
.strip span{margin:0 .55em}
.section{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center;padding:clamp(2rem,7vw,7rem) clamp(1rem,5vw,5rem)}
.lesson-cards{display:grid;gap:.75rem}.lesson-cards article,.contact-card{background:#fbe2ca;border-radius:22px;padding:1rem 1.3rem}
.lesson-cards article:nth-child(2){background:#d5e9df}
h3{margin:.25em 0;font-size:1.3rem}.lesson-cards p{margin:.45em 0}
.contact{background:var(--surf);color:white}.contact-card{background:var(--navy);color:var(--sand)}
address{font-style:normal}
@media(max-width:720px){.hero,.section{grid-template-columns:1fr}header,footer{align-items:flex-start}header nav{justify-content:flex-end;font-size:.88rem}.wordmark{font-size:1.45rem}footer{flex-wrap:wrap}}

.surf-parent{display:flex;justify-content:space-between;gap:1rem;padding:.4rem clamp(1rem,5vw,5rem);background:var(--sun);font-size:.73rem;font-weight:850;letter-spacing:.07em}
.surf-parent a{text-decoration:none}
.hero{position:relative;isolation:isolate;min-height:min(660px,74vw);overflow:hidden;background:#092831;color:var(--sand);border-top:1px solid #ffffff24;grid-template-columns:1fr}
.hero-copy{z-index:1;max-width:34rem}
.hero .kicker span{background:var(--sun)}
.hero h1{font-size:clamp(4.3rem,12vw,12rem);text-transform:uppercase}
.hero h1 em{color:var(--sun)}
.hero .lead{background:#092831de;border-radius:10px;padding:.35rem .55rem;margin-left:-.55rem}
.hero .wave{position:absolute;z-index:-2;right:-6%;bottom:-16%;width:min(79%,1000px);transform:rotate(-8deg);border-radius:30% 0 0 0}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#092831 0%,#092831c7 30%,#09283100 70%);pointer-events:none}
.surf-stamp{position:absolute;right:7%;top:12%;border:2px solid var(--navy);color:var(--navy);background:var(--sun);border-radius:50%;width:clamp(65px,10vw,130px);aspect-ratio:1;display:grid;place-content:center;text-align:center;font:900 clamp(.7rem,1.45vw,1.3rem)/.96 Impact,"Arial Black",sans-serif;transform:rotate(12deg)}
@media(max-width:720px){.hero{min-height:0;padding-bottom:clamp(10rem,44vw,19rem)}.hero .wave{width:105%;right:-14%;bottom:-17%}.hero::after{background:linear-gradient(180deg,#092831 0%,#092831c7 45%,#09283100 76%)}.surf-stamp{top:auto;bottom:12%;right:8%}.surf-parent span{display:none}}

.hero{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);min-height:0;gap:clamp(1.2rem,4vw,4rem)}
.hero::after{display:none}
.hero h1{font-size:clamp(3.2rem,7.6vw,8rem)}
.hero .lead{background:none;padding:0;margin-left:0}
.surf-hero-image,.surf-scene figure{position:relative;margin:0}
.surf-hero-image img,.surf-scene img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:28px 8px 28px 8px}
.surf-hero-image figcaption{position:absolute;bottom:0;left:0;background:var(--sun);color:var(--navy);padding:.45rem .8rem;font-size:.75rem;font-weight:800;border-radius:0 12px 0 0}
.surf-scene{background:#fbe2ca}
.surf-scene img{aspect-ratio:4/5;max-height:580px}
.surf-scene video{display:block;width:min(100%,420px);margin-top:1rem;border-radius:12px;background:var(--navy)}
@media(max-width:720px){.hero{grid-template-columns:1fr;padding-bottom:2rem}}
