/* Sail Beyond Horizons — shared styles */
:root{
  --deep:#0a2540;      /* deep navy */
  --ocean:#0e6ba8;     /* ocean blue */
  --sky:#3aa9e0;       /* bright sky */
  --sea:#1fb6a6;       /* teal/sea */
  --sand:#f4efe6;      /* warm sand */
  --sand-2:#eae2d2;
  --ink:#12222e;
  --muted:#5a6b78;
  --white:#ffffff;
  --shadow:0 10px 30px rgba(10,37,64,.12);
  --radius:16px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:"Helvetica Neue",Arial,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);line-height:1.65;background:var(--white);-webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{line-height:1.15;letter-spacing:-.01em;font-weight:800;color:var(--deep)}
h1{font-size:clamp(2.2rem,5vw,3.6rem)}
h2{font-size:clamp(1.7rem,3.4vw,2.5rem)}
h3{font-size:1.25rem}
p{color:var(--ink)}
a{color:var(--ocean);text-decoration:none}
em{font-style:italic}
.container{max-width:1120px;margin:0 auto;padding:0 24px}
.narrow{max-width:820px}
section{padding:80px 0}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;font-weight:700;color:var(--sea);margin-bottom:14px}
.lead{font-size:1.18rem;color:var(--muted);max-width:62ch}
.center{text-align:center}
.center .lead{margin-left:auto;margin-right:auto}
.disclaimer{font-size:.92rem;color:var(--muted);font-style:italic;max-width:70ch;margin-top:18px}

/* buttons */
.btn{display:inline-block;padding:14px 28px;border-radius:999px;font-weight:700;font-size:1rem;cursor:pointer;border:2px solid transparent;transition:.2s}
.btn-primary{background:var(--sea);color:#fff}
.btn-primary:hover{background:#149a8c;transform:translateY(-2px)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.btn-outline{background:transparent;color:var(--ocean);border-color:var(--ocean)}
.btn-outline:hover{background:var(--ocean);color:#fff}
.btn-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.center .btn-row{justify-content:center}
.textlink{font-weight:600;color:var(--ocean);align-self:center}

/* nav */
header.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(10,37,64,.08)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:70px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;color:var(--deep);font-size:1.08rem}
.brand svg{flex:0 0 auto}
.brand-logo{height:40px;width:40px;border-radius:50%;object-fit:cover;flex:0 0 auto;display:block}
.footer-logo{height:54px;width:54px;border:1px solid rgba(255,255,255,.28)}
.partner-logo{height:66px;display:block;background:#fff;padding:8px 16px;border-radius:10px}
.foot-bottom{align-items:center}
.video-embed{position:relative;max-width:900px;margin:34px auto 0;aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:#000}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.foot-donate{color:#7fe6d3;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.foot-donate:hover{color:#fff}
.nav-links{display:flex;gap:24px;align-items:center}
.nav-links a{color:var(--deep);font-weight:600;font-size:.95rem}
.nav-links a:hover,.nav-links a.active{color:var(--sea)}
.nav-cta{background:var(--sea);color:#fff !important;padding:9px 20px;border-radius:999px}
.nav-cta:hover{background:#149a8c}
.menu-toggle{display:none;background:none;border:0;cursor:pointer}

/* hero */
.hero{position:relative;color:#fff;padding:116px 0 128px;overflow:hidden;
  background:linear-gradient(180deg,rgba(10,37,64,.72),rgba(14,107,168,.5)),
    radial-gradient(1200px 600px at 72% -10%,var(--sky),transparent),
    linear-gradient(160deg,var(--deep),var(--ocean) 60%,var(--sea))}
.hero .container{position:relative;z-index:2;max-width:840px}
.hero h1{color:#fff;margin-bottom:22px}
.hero p{font-size:1.28rem;color:rgba(255,255,255,.94);max-width:60ch;margin-bottom:6px}
.hero .btn-row{margin-top:32px}
.page-hero{background:linear-gradient(160deg,var(--deep),var(--ocean));color:#fff;padding:72px 0}
.page-hero .container{position:relative;z-index:2}
.page-hero h1{color:#fff;margin-bottom:14px}
.page-hero p{color:rgba(255,255,255,.9);font-size:1.15rem;max-width:60ch}
.waves{position:absolute;left:0;right:0;bottom:-1px;z-index:1;line-height:0}
.waves svg{width:100%;height:88px;display:block}

/* promise band */
.promise{background:var(--sand)}
.promise .container{max-width:900px}
.promise p{font-size:1.35rem;color:var(--deep);line-height:1.5}

/* steps / how it works */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:44px}
.step{padding:30px;border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);border:1px solid rgba(10,37,64,.05)}
.step .n{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(160deg,var(--sky),var(--sea));color:#fff;font-weight:800;font-size:1.1rem;margin-bottom:16px}
.step h3{margin-bottom:8px}
.step p{color:var(--muted)}

/* stat band */
.stats{background:linear-gradient(160deg,var(--deep),var(--ocean));color:#fff}
.stats h2{color:#fff}
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:40px}
.stat{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:var(--radius);padding:30px;text-align:center}
.stat .num{font-size:2.4rem;font-weight:800;color:#bfeef0}
.stat .lbl{color:rgba(255,255,255,.9);font-size:.98rem;margin-top:8px}
.stat .src{display:block;margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.16);font-size:.76rem;line-height:1.4;color:rgba(255,255,255,.72);font-style:italic}
.stat .src a{color:#bfeef0;text-decoration:underline;text-underline-offset:2px}
.stat .src a:hover{color:#fff}
.stats .kicker{margin-top:34px;font-size:1.1rem;color:rgba(255,255,255,.92);max-width:70ch}

/* skills cards */
.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:44px}
.skill{background:#fff;border-radius:var(--radius);padding:30px;box-shadow:var(--shadow);border:1px solid rgba(10,37,64,.05);transition:.2s}
.skill:hover{transform:translateY(-5px)}
.skill h3{color:var(--ocean);margin-bottom:10px;display:flex;gap:10px;align-items:flex-start}
.skill h3 .anchor{color:var(--sea);flex:0 0 auto}
.skill p{color:var(--muted)}

/* media placeholders (swap each <figure class="media"> for an <img> when real photos arrive) */
.media{position:relative;display:grid;place-items:center;text-align:center;overflow:hidden;border-radius:var(--radius);box-shadow:var(--shadow);background:linear-gradient(150deg,var(--deep),var(--ocean) 55%,var(--sea));color:#fff;margin:0}
.media > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.media:has(> img)::before{content:none}
.media::before{content:"";position:absolute;left:0;right:0;bottom:-1px;height:60px;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 90" preserveAspectRatio="none"><path fill="rgba(255,255,255,0.10)" d="M0,40 C240,90 480,0 720,30 C960,60 1200,95 1440,45 L1440,90 L0,90 Z"/></svg>') bottom/100% 100% no-repeat;z-index:1}
.ratio-21-9{aspect-ratio:21/9}
.ratio-16-9{aspect-ratio:16/9}
.ratio-3-2{aspect-ratio:3/2}
.ratio-4-3{aspect-ratio:4/3}
.ratio-1-1{aspect-ratio:1/1}
.media .ph{position:relative;z-index:2;padding:28px;max-width:560px}
.media .ph .tag{display:inline-block;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.32);padding:5px 12px;border-radius:999px;margin-bottom:14px}
.media .ph svg{display:block;margin:0 auto 12px;opacity:.92}
.media .ph .cap{font-size:.98rem;line-height:1.45;color:#fff;font-style:italic}
.media .ph .hint{margin-top:10px;font-size:.72rem;color:rgba(255,255,255,.6);font-style:normal}
.media-band{padding:48px 0}
.media-3up{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
figure.figcap{display:block}
figure.figcap figcaption{margin-top:10px;font-size:.85rem;color:var(--muted);font-style:italic;text-align:center}

/* generic content blocks */
.block{background:var(--sand)}
.card{background:#fff;border-radius:var(--radius);padding:34px;box-shadow:var(--shadow);border:1px solid rgba(10,37,64,.05)}
.checklist{list-style:none;margin:22px 0;display:grid;gap:12px}
.checklist li{position:relative;padding-left:34px;color:var(--ink)}
.checklist li::before{content:"";position:absolute;left:0;top:3px;width:20px;height:20px;border-radius:50%;
  background:var(--sea) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>') center/13px no-repeat}
.feature-list{list-style:none;margin:22px 0;display:grid;gap:16px}
.feature-list li{padding:0}
.feature-list strong{color:var(--deep)}
.two-col{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:start}

/* evidence */
.evidence-item{padding:24px 0;border-bottom:1px solid rgba(10,37,64,.1)}
.evidence-item:last-child{border-bottom:0}
.evidence-item h3{margin-bottom:6px}
.evidence-item .cite{color:var(--muted);font-size:.9rem;font-style:italic}
.sources{background:var(--sand)}
.sources ol{margin:22px 0 0 20px;display:grid;gap:12px;color:var(--muted);font-size:.95rem}
.note{background:#f2f9fe;border-left:4px solid var(--sky);border-radius:8px;padding:20px 24px;margin-top:26px;color:var(--deep);font-style:italic}

/* faq */
.faq{max-width:820px;margin:0 auto}
.faq details{border:1px solid rgba(10,37,64,.12);border-radius:12px;padding:4px 22px;margin-bottom:14px;background:#fff}
.faq summary{cursor:pointer;font-weight:700;color:var(--deep);padding:18px 0;list-style:none;display:flex;justify-content:space-between;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.5rem;color:var(--sea);font-weight:400}
.faq details[open] summary::after{content:"\2013"}
.faq details p{color:var(--muted);padding:0 0 20px}

/* closing CTA band */
.closing{background:linear-gradient(160deg,var(--ocean),var(--sea));color:#fff;text-align:center}
.closing h2{color:#fff}
.closing .btn-row{justify-content:center;margin-top:28px}

/* footer */
footer{background:var(--deep);color:#cfe1ee;padding:56px 0 30px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:36px}
footer h4{color:#fff;margin-bottom:14px;font-size:1rem}
footer a{color:#cfe1ee;display:block;margin-bottom:8px}
footer a:hover{color:#fff}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:36px;padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.85rem;color:#9fb8ca}

@media(max-width:860px){
  .nav-links{position:fixed;inset:70px 0 auto 0;background:#fff;flex-direction:column;gap:0;padding:10px 0;box-shadow:var(--shadow);display:none}
  .nav-links.open{display:flex}
  .nav-links a{padding:14px 24px;width:100%}
  .menu-toggle{display:block}
  .steps,.stat-grid,.skills-grid,.two-col,.foot-grid,.media-3up{grid-template-columns:1fr}
  section{padding:60px 0}
}