@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300&display=swap');

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}

:root{
  --navy:#1E3A5F;
  --navy2:#243659;
  --teal:#3D8B7A;
  --teal-mid:#5BA898;
  --mint:#7ECFBF;
  --mint-light:#B8E8DE;
  --mint-pale:#D4F0E8;
  --cream:#EAF6F2;
  --cream2:#F0F9F6;
  --yellow:#F5D06A;
  --yellow-warm:#F0C040;
  --white:#F8FEFC;
  --text:#1E3A5F;
  --text2:#3A5A6A;
  --text3:#7A9AA8;
  --border:rgba(30,58,95,.1);
  --border2:rgba(30,58,95,.2);
}

body{font-family:'DM Sans',sans-serif;background:var(--cream);color:var(--text);line-height:1.6;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}

/* NAV */
nav{display:flex;align-items:center;padding:0 36px;background:var(--navy);position:sticky;top:0;z-index:100;height:56px;}
.nav-logo{font-family:'DM Serif Display',serif;font-size:20px;color:#fff;white-space:nowrap;}
.nav-logo em{font-style:italic;color:var(--yellow);}
.nav-links{display:flex;gap:24px;margin-left:32px;}
.nav-links a{font-size:12px;color:rgba(255,255,255,.55);transition:color .15s;letter-spacing:.02em;}
.nav-links a:hover,.nav-links a.active{color:#fff;}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:12px;}
.lang-switcher{display:flex;align-items:center;gap:2px;background:rgba(255,255,255,.08);border-radius:3px;padding:2px;}
.lang-btn{font-size:11px;font-weight:500;letter-spacing:.06em;padding:4px 8px;border-radius:2px;cursor:pointer;color:rgba(255,255,255,.5);border:none;background:transparent;transition:all .15s;}
.lang-btn.active{background:var(--yellow);color:var(--navy);}
.lang-btn:hover:not(.active){color:#fff;}
.nav-cta{font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;padding:7px 16px;background:var(--yellow);color:var(--navy);border-radius:3px;transition:all .15s;white-space:nowrap;}
.nav-cta:hover{background:#fff;}

/* BUTTONS */
.btn-primary{font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;padding:12px 26px;background:var(--yellow);color:var(--navy);border:none;border-radius:3px;cursor:pointer;display:inline-block;transition:all .15s;}
.btn-primary:hover{background:#fff;}
.btn-ghost{font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;padding:12px 26px;background:transparent;color:rgba(255,255,255,.85);border:1.5px solid rgba(255,255,255,.3);border-radius:3px;cursor:pointer;display:inline-block;transition:all .15s;}
.btn-ghost:hover{border-color:rgba(255,255,255,.7);color:#fff;}
.btn-navy{font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;padding:12px 26px;background:var(--navy);color:#fff;border:none;border-radius:3px;cursor:pointer;display:inline-block;transition:all .15s;}
.btn-navy:hover{background:var(--teal);}
.btn-teal{font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;padding:10px 22px;background:var(--teal);color:#fff;border:none;border-radius:3px;cursor:pointer;display:inline-block;transition:all .15s;}
.btn-teal:hover{background:var(--navy);}

/* SECTIONS */
.section{padding:64px 36px;}
.section-sm{padding:40px 36px;}
.sec-eyebrow{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--teal);margin-bottom:12px;font-weight:500;}
.sec-eyebrow::before{content:'';display:block;width:20px;height:1px;background:var(--teal);}
.sec-eyebrow.light{color:var(--mint);}
.sec-eyebrow.light::before{background:var(--mint);}
.sec-title{font-family:'DM Serif Display',serif;font-size:42px;line-height:1.05;color:var(--navy);margin-bottom:10px;}
.sec-title em{font-style:italic;color:var(--teal);}
.sec-title.light{color:#fff;}
.sec-sub{font-size:14px;color:var(--text2);max-width:480px;line-height:1.75;margin-bottom:36px;font-weight:300;}
.sec-sub.light{color:rgba(255,255,255,.65);}

/* WAVE DIVIDERS */
.wave-down-teal{width:100%;display:block;background:var(--cream);}
.wave-up-navy{width:100%;display:block;}
.wave-down-cream{width:100%;display:block;}

/* CALLOUT */
.callout{border-left:3px solid var(--teal);padding:12px 16px;background:rgba(61,139,122,.07);margin:14px 0;border-radius:0 4px 4px 0;}
.callout-title{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin-bottom:4px;font-weight:500;}
.callout-text{font-size:13px;line-height:1.6;color:var(--text2);}
.callout.muted{border-left-color:var(--border2);background:var(--mint-pale);}
.callout.muted .callout-title{color:var(--text3);}

/* TRACK CARDS */
.tracks-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);}
.track-card{background:var(--white);padding:24px;transition:background .15s;display:block;}
.track-card:hover{background:var(--mint-pale);}
.track-num{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--teal);margin-bottom:8px;font-weight:500;}
.track-title{font-family:'DM Serif Display',serif;font-size:19px;color:var(--navy);margin-bottom:8px;line-height:1.2;}
.track-img{width:100%;height:120px;object-fit:cover;border-radius:3px;margin-bottom:12px;}
.track-desc{font-size:12px;color:var(--text2);line-height:1.65;margin-bottom:12px;font-weight:300;}
.track-count{font-size:11px;color:var(--text3);letter-spacing:.04em;}
.tag-live{display:inline-block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:3px 8px;border-radius:2px;margin-top:7px;background:rgba(61,139,122,.1);color:var(--teal);border:1px solid rgba(61,139,122,.25);}
.tag-soon{display:inline-block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:3px 8px;border-radius:2px;margin-top:7px;background:rgba(30,58,95,.05);color:var(--text3);border:1px solid var(--border);}

/* MODULE LIST */
.module-row{display:flex;align-items:center;gap:16px;padding:14px 18px;border:1px solid var(--border);border-radius:4px;background:var(--white);transition:all .15s;margin-bottom:8px;}
.module-row:hover{border-color:rgba(61,139,122,.4);background:var(--mint-pale);}
.module-row.locked{opacity:.5;cursor:default;}
.module-code{font-size:13px;letter-spacing:.12em;color:var(--teal);min-width:36px;font-weight:500;}
.module-title{font-size:14px;font-weight:400;flex:1;color:var(--text);}
.module-time{font-size:11px;color:var(--text3);letter-spacing:.06em;white-space:nowrap;}

/* PROSE */
.prose{font-size:14px;line-height:1.8;color:var(--text2);margin-bottom:14px;font-weight:300;}

/* MODULE INTERFACE */
.mod-header{background:var(--navy);padding:20px 28px;display:flex;align-items:center;gap:14px;}
.mod-track{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mint);}
.mod-title{font-family:'DM Serif Display',serif;font-size:28px;color:#fff;margin-top:2px;}
.mod-badge{margin-left:auto;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow);border:1px solid rgba(245,208,106,.3);padding:3px 10px;border-radius:2px;}
.mod-tabs{display:flex;border-bottom:1px solid var(--border);background:var(--cream2);overflow-x:auto;}
.mod-tab{font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:10px 16px;color:var(--text3);border-bottom:2px solid transparent;font-weight:500;white-space:nowrap;cursor:pointer;background:none;border-top:none;border-left:none;border-right:none;transition:all .15s;}
.mod-tab.active{color:var(--navy);border-bottom-color:var(--teal);}
.mod-tab.done{color:var(--teal);}
.mod-progress{height:3px;background:var(--border);}
.mod-prog-fill{height:100%;background:var(--teal);transition:width .3s;}
.mod-sec{display:none;padding:28px;}
.mod-sec.active{display:block;}
.mod-sec-label{font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--teal);margin-bottom:10px;font-weight:500;}
.mod-sec-title{font-family:'DM Serif Display',serif;font-size:28px;color:var(--navy);margin-bottom:14px;line-height:1.2;}

/* QUIZ */
.q-block{margin-bottom:20px;}
.q-text{font-size:15px;font-weight:500;line-height:1.5;margin-bottom:12px;color:var(--text);}
.q-opt{border:1px solid var(--border2);border-radius:4px;padding:11px 14px;margin-bottom:8px;cursor:pointer;font-size:13px;color:var(--text2);transition:all .15s;background:var(--white);}
.q-opt:hover{border-color:var(--teal);background:var(--mint-pale);}
.q-opt.correct{border-color:#2a9d5c;background:rgba(42,157,92,.08);color:var(--text);}
.q-opt.wrong{border-color:#cc4400;background:rgba(204,68,0,.07);color:var(--text);}
.q-opt.show-correct{border-color:#2a9d5c;background:rgba(42,157,92,.04);}
.fb{font-size:12px;line-height:1.6;padding:10px 14px;border-radius:4px;margin-top:4px;}
.fb.ok{border-left:3px solid #2a9d5c;background:rgba(42,157,92,.06);color:var(--text2);}
.fb.no{border-left:3px solid #cc4400;background:rgba(204,68,0,.06);color:var(--text2);}

/* NAV BUTTONS */
.mod-nav{display:flex;gap:10px;margin-top:20px;padding:0 28px 28px;}
.btn-mod{font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;padding:10px 22px;border-radius:3px;cursor:pointer;border:none;transition:all .15s;}
.btn-mod-primary{background:var(--navy);color:#fff;}
.btn-mod-primary:hover{background:var(--teal);}
.btn-mod-ghost{background:transparent;color:var(--text);border:1px solid var(--border2);}
.btn-mod-ghost:hover{border-color:var(--navy);}

/* FREE BANNER */
.free-banner{background:var(--mint-light);padding:40px 36px;display:flex;align-items:center;gap:32px;border-top:1px solid var(--mint);border-bottom:1px solid var(--mint);flex-wrap:wrap;}
.free-title{font-family:'DM Serif Display',serif;font-size:28px;color:var(--navy);margin-bottom:6px;}
.free-sub{font-size:13px;color:var(--text2);line-height:1.65;font-weight:300;max-width:520px;}

/* ORG PILLS */
.org-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.org-pill{font-size:12px;padding:6px 14px;border:1px solid var(--border2);border-radius:3px;color:var(--text2);background:var(--white);}

/* FOOTER */
footer{background:var(--navy);padding:28px 36px 22px;}
.footer-row1{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:14px;}
.footer-logo{font-family:'DM Serif Display',serif;font-size:18px;color:#fff;}
.footer-logo em{font-style:italic;color:var(--yellow);}
.footer-links{display:flex;gap:20px;flex-wrap:wrap;}
.footer-links a{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.35);transition:color .15s;}
.footer-links a:hover{color:#fff;}
.footer-copy{font-size:11px;color:rgba(255,255,255,.2);margin-left:auto;letter-spacing:.04em;}
.footer-row2{display:flex;align-items:center;justify-content:flex-end;gap:24px;border-top:1px solid rgba(255,255,255,.06);padding-top:12px;flex-wrap:wrap;}
.footer-legal-links{display:flex;gap:16px;}
.footer-legal-links a{font-size:10px;letter-spacing:.06em;color:rgba(255,255,255,.2);text-transform:none;transition:color .15s;}
.footer-legal-links a:hover{color:rgba(255,255,255,.5);}
.footer-copyright{font-size:10px;color:rgba(255,255,255,.18);letter-spacing:.04em;}

/* ABOUT / NGO PAGES */
.page-hero{padding:56px 36px 48px;background:var(--navy);position:relative;overflow:hidden;}
.page-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.18;}
.page-hero-content{position:relative;z-index:2;}
.page-hero h1{font-family:'DM Serif Display',serif;font-size:52px;font-weight:400;color:#fff;line-height:1.05;margin-bottom:16px;}
.page-hero h1 em{font-style:italic;color:var(--yellow);}
.page-hero p{font-size:15px;color:rgba(255,255,255,.65);max-width:500px;line-height:1.8;font-weight:300;}
.content-block{max-width:720px;margin-bottom:48px;}
.content-block h2{font-family:'DM Serif Display',serif;font-size:28px;color:var(--navy);margin-bottom:14px;}
.content-block p{font-size:14px;color:var(--text2);line-height:1.8;margin-bottom:12px;font-weight:300;}
.content-block p:last-child{margin-bottom:0;}

/* RESPONSIVE */
@media(max-width:640px){
  nav{padding:0 16px;}
  .nav-links{display:none;}
  .section{padding:40px 16px;}
  .section-sm{padding:28px 16px;}
  .tracks-grid{grid-template-columns:1fr;}
  .free-banner{padding:28px 16px;gap:20px;}
  .page-hero{padding:40px 16px 36px;}
  .page-hero h1{font-size:36px;}
  footer{padding:20px 16px 16px;}
  .footer-row1{gap:14px;}
  .footer-copy{margin-left:0;width:100%;}
  .footer-row2{justify-content:flex-start;}
  .mod-header{padding:16px 20px;}
  .mod-sec{padding:20px;}
  .mod-nav{padding:0 20px 20px;}
}

/* ═══ END-OF-PATH SURVEY ═══ */
.survey-wrap{background:var(--cream2);border:1px solid var(--border);border-radius:6px;padding:28px;margin:24px 0 0;text-align:left;}
.survey-eyebrow{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--teal);font-weight:600;margin-bottom:6px;}
.survey-title{font-family:'DM Serif Display',serif;font-size:22px;color:var(--navy);line-height:1.2;margin-bottom:8px;}
.survey-intro{font-size:13px;color:var(--text2);line-height:1.65;margin-bottom:18px;font-weight:300;}
.survey-q{margin-bottom:18px;}
.survey-q-label{display:block;font-size:13px;font-weight:500;color:var(--navy);margin-bottom:8px;line-height:1.5;}
.survey-rating{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.survey-star{width:36px;height:36px;border:1.5px solid var(--border2);background:#fff;border-radius:3px;font-family:'DM Sans',sans-serif;font-size:14px;font-weight:500;color:var(--text3);cursor:pointer;transition:all .15s;}
.survey-star:hover{border-color:var(--teal);color:var(--teal);}
.survey-star.selected{background:var(--teal);border-color:var(--teal);color:#fff;}
.survey-rating-hint{font-size:11px;color:var(--text3);margin-left:6px;font-weight:300;}
.survey-textarea,.survey-input{width:100%;padding:10px 14px;border:1.5px solid var(--border2);border-radius:3px;font-family:'DM Sans',sans-serif;font-size:13px;color:var(--text);background:#fff;font-weight:300;resize:vertical;transition:border-color .15s;box-sizing:border-box;}
.survey-textarea:focus,.survey-input:focus{outline:none;border-color:var(--teal);}
.survey-send{display:inline-block;background:var(--teal);color:#fff;border:none;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;padding:11px 22px;border-radius:3px;cursor:pointer;transition:background .15s;margin-top:4px;}
.survey-send:hover{background:#2f6f60;}
.survey-privacy{font-size:11px;color:var(--text3);margin-top:10px;line-height:1.6;font-weight:300;}
@media(max-width:600px){
  .survey-wrap{padding:20px;}
  .survey-rating{gap:4px;}
  .survey-star{width:32px;height:32px;font-size:13px;}
  .survey-rating-hint{width:100%;margin-left:0;margin-top:6px;}
}