:root{
  --off-white:#F6F3EC;
  --paper:#FBFAF6;
  --emerald-dark:#0B3B2E;
  --emerald-mid:#155C44;
  --land-light:#A9CC93;
  --land-mid:#6E9F5D;
  --land-dark:#2F5D3A;
  --ocean-light:#7DBAD1;
  --ocean-mid:#3E85A6;
  --ocean-dark:#0E3A52;
  --sand:#D9CBA3;
  --ink:#12241D;
  --line: rgba(11,59,46,0.14);
  --maxw: 1180px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--off-white);
  color:var(--ink);
  font-family:'Inter', sans-serif;
  line-height:1.6;
  overflow-x:hidden;
}
h1,h2,h3,h4{
  font-family:'Fraunces', serif;
  font-weight:600;
  line-height:1.08;
  letter-spacing:-0.01em;
}
.eyebrow{
  font-family:'Space Mono', monospace;
  font-size:12px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  opacity:0.75;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}
section{position:relative;}

a:focus-visible, button:focus-visible{
  outline:2px solid var(--emerald-dark);
  outline-offset:3px;
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}

/* ---------- SIDEBAR NAV (hover/tap reveal — hidden by default, everywhere) ---------- */
.logo{
  display:flex; align-items:center; gap:10px;
  font-family:'Fraunces', serif; font-weight:600; font-size:19px;
  color:var(--emerald-dark);
}
.logo-mark{height:30px; width:auto; max-width:54px; flex-shrink:0; object-fit:contain;}

.sidebar{
  position:fixed; top:0; left:0; bottom:0; width:240px; z-index:150;
  background:var(--paper); border-right:1px solid var(--line);
  display:flex; flex-direction:column; padding:30px 22px 26px;
  transform:translateX(-100%); transition:transform .28s cubic-bezier(.65,0,.35,1);
  box-shadow:0 0 0 rgba(11,20,15,0);
}
.sidebar.open{transform:translateX(0); box-shadow:24px 0 50px rgba(11,20,15,0.16);}
.sidebar .logo{margin-bottom:38px; padding-left:6px;}
.sidebar-links{display:flex; flex-direction:column; gap:4px; flex-grow:1;}
.sidebar-links a{
  padding:12px 14px; border-radius:12px; font-size:14.5px; font-weight:500;
  color:var(--emerald-dark); opacity:0.68; transition:opacity .2s, background .2s;
}
.sidebar-links a:hover{opacity:1; background:rgba(11,59,46,0.06);}
.sidebar-links a.active{opacity:1; background:rgba(11,59,46,0.09); font-weight:600;}
.sidebar-cta{margin-top:18px; text-align:center;}

.lang-switch{
  display:flex; align-items:center; gap:9px; margin-top:14px; padding:10px 12px;
  border:1px solid var(--line); border-radius:12px; background:var(--off-white);
}
.lang-switch svg{width:16px; height:16px; stroke:var(--emerald-dark); opacity:0.6; flex-shrink:0;}
.lang-switch select{
  flex-grow:1; border:none; background:transparent; font-family:'Inter',sans-serif;
  font-size:13px; font-weight:500; color:var(--emerald-dark); cursor:pointer;
}
.lang-switch select:focus{outline:none;}
html[dir="rtl"] .lang-switch svg{transform:scaleX(-1);}

.sidebar-backdrop{
  position:fixed; inset:0; background:rgba(11,20,15,0.28); z-index:140;
  opacity:0; pointer-events:none; transition:opacity .25s;
}
.sidebar-backdrop.show{opacity:1; pointer-events:auto;}

.nav-toggle{
  position:fixed; top:16px; left:16px; z-index:160;
  width:46px; height:46px; border-radius:50%; border:1px solid var(--line);
  background:rgba(251,250,246,0.92); backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:border-color .2s, background .2s;
}
.nav-toggle svg{width:20px; height:20px; stroke:var(--emerald-dark); position:relative; z-index:2;}
.nav-toggle::before{
  content:''; position:absolute; inset:-16px; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle at var(--gx,50%) var(--gy,50%), rgba(169,204,147,0.65), rgba(125,186,209,0.25) 55%, transparent 75%);
  opacity:0; transition:opacity .25s ease; filter:blur(3px);
}
.nav-toggle.glow::before{opacity:var(--glow, 0);}
.nav-toggle.glow{border-color:var(--land-mid); box-shadow:0 0 18px rgba(169,204,147,0.35);}

.persistent-logo{
  position:fixed; top:16px; left:74px; z-index:159;
  width:46px; height:46px; border-radius:50%;
  background:rgba(251,250,246,0.92); backdrop-filter:blur(8px);
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  padding:8px; transition:opacity .25s, transform .2s;
}
.persistent-logo:hover{transform:scale(1.06);}
.persistent-logo img{width:100%; height:100%; object-fit:contain;}
body.sidebar-is-open .persistent-logo{opacity:0; pointer-events:none;}

@keyframes navAttention{
  0%, 100%{ box-shadow:0 0 0 0 rgba(169,204,147,0); }
  50%{ box-shadow:0 0 0 8px rgba(169,204,147,0.25); }
}
.nav-toggle.attention{ animation:navAttention 1.4s ease-in-out 2; }
@media (prefers-reduced-motion: reduce){ .nav-toggle.attention{ animation:none; } }

/* ---------- BUTTONS ---------- */

.btn-primary{
  background:var(--emerald-dark); color:var(--off-white);
  padding:14px 26px; border-radius:100px; font-weight:600; font-size:14.5px;
  border:1px solid var(--emerald-dark);
  transition:transform .18s ease, background .2s;
  display:inline-block;
}
.btn-primary:hover{background:var(--emerald-mid); transform:translateY(-2px);}
.btn-secondary{
  padding:14px 26px; border-radius:100px; font-weight:600; font-size:14.5px;
  border:1px solid var(--emerald-dark); color:var(--emerald-dark);
  transition:transform .18s ease, background .2s;
  display:inline-block;
}
.btn-secondary:hover{background:rgba(11,59,46,0.06); transform:translateY(-2px);}
.btn-secondary.on-dark{border-color:rgba(246,243,236,0.6); color:var(--off-white);}
.btn-secondary.on-dark:hover{background:rgba(246,243,236,0.12);}

/* ---------- HERO (home) ---------- */
.hero{
  padding:96px 0 0;
  background:var(--off-white);
  position:relative;
  overflow:hidden;
}
.hero-inner{
  max-width:var(--maxw); margin:0 auto; padding:0 32px 70px;
  display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center;
}
.hero-eyebrow{color:var(--emerald-mid); margin-bottom:20px;}
.hero h1{
  font-size:clamp(38px, 5.4vw, 66px);
  color:var(--emerald-dark);
  margin-bottom:22px;
}
.hero h1 em{font-style:italic; color:var(--ocean-dark);}
.hero p.lede{
  font-size:17.5px; max-width:480px; color:#2c3f37; opacity:0.86; margin-bottom:32px;
}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap;}
.journey-art{position:relative; aspect-ratio:1/1.05;}
.journey-art svg{width:100%; height:100%;}
.wave-divider{width:100%; display:block; line-height:0;}
.wave-divider svg{width:100%; height:auto; display:block;}

/* ---------- PAGE HERO (sub-pages) ---------- */
.page-hero{
  padding:80px 0 90px;
  position:relative; overflow:hidden;
}
.page-hero.tone-emerald{background:var(--emerald-dark); color:var(--off-white);}
.page-hero.tone-ocean{background:linear-gradient(180deg, var(--ocean-mid) 0%, var(--ocean-dark) 100%); color:var(--off-white);}
.page-hero.tone-land{background:linear-gradient(180deg, var(--land-mid) 0%, var(--land-dark) 100%); color:var(--off-white);}
.page-hero-inner{max-width:760px; margin:0 auto; padding:0 32px; text-align:center; position:relative; z-index:2;}
.page-hero .eyebrow{opacity:0.75;}
.page-hero h1{font-size:clamp(34px,5vw,54px); margin:16px 0 18px;}
.page-hero p{font-size:16.5px; opacity:0.85; max-width:560px; margin:0 auto;}
.breadcrumb{
  font-family:'Space Mono', monospace; font-size:12px; opacity:0.65; margin-bottom:10px;
  display:flex; gap:8px; justify-content:center;
}

/* ---------- WHY / STATS ---------- */
.why{background:var(--emerald-dark); color:var(--off-white); padding:100px 0 110px; position:relative; overflow:hidden;}
.section-tone-paper{background:var(--paper); color:var(--ink);}
.why-head{max-width:640px; margin-bottom:56px; position:relative; z-index:2;}
.why-head .eyebrow{color:var(--land-light);}
.why-head h2{font-size:clamp(30px,4vw,44px); margin-top:14px;}
.why-head p{opacity:0.78; margin-top:16px; font-size:16px; max-width:560px;}

.stat-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:rgba(246,243,236,0.16);
  border:1px solid rgba(246,243,236,0.16);
  border-radius:18px; overflow:hidden;
  position:relative; z-index:2;
}
.stat-card{background:var(--emerald-dark); padding:34px 26px;}
.stat-num{font-family:'Space Mono', monospace; font-size:clamp(26px,3vw,36px); font-weight:700; color:var(--land-light);}
.stat-label{font-size:13.5px; opacity:0.75; margin-top:10px; line-height:1.5;}

.river-path{margin-top:80px; position:relative; z-index:2;}
.river-path-head{display:flex; align-items:baseline; justify-content:space-between; margin-bottom:28px; flex-wrap:wrap; gap:10px;}
.river-path-head h3{font-size:22px; color:var(--off-white);}
.river-path-head span{font-size:13px; opacity:0.65; font-family:'Space Mono',monospace;}
.journey-svg-wrap{width:100%;}
.journey-svg-wrap svg{width:100%; height:auto;}

/* ---------- Reasons grid (why page) ---------- */
.reasons-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:20px;}
.reason-card{
  background:var(--paper); border:1px solid var(--line); border-radius:18px; padding:30px 26px;
  transition:transform .3s ease, box-shadow .3s ease;
}
.reason-card:hover{transform:translateY(-6px); box-shadow:0 18px 34px rgba(11,59,46,0.1);}
.reason-card .num{font-family:'Space Mono',monospace; font-size:13px; color:var(--ocean-mid); margin-bottom:14px; display:block;}
.reason-card h4{font-size:18.5px; color:var(--emerald-dark); margin-bottom:10px;}
.reason-card p{font-size:14.5px; opacity:0.78;}

.timeline{margin-top:60px;}
.timeline-row{display:grid; grid-template-columns:140px 1fr; gap:24px; padding:22px 0; border-top:1px solid var(--line);}
.timeline-row:last-child{border-bottom:1px solid var(--line);}
.timeline-row .t-label{font-family:'Space Mono',monospace; font-size:13px; color:var(--emerald-mid); font-weight:700;}
.timeline-row .t-copy h5{font-size:16.5px; color:var(--emerald-dark); margin-bottom:6px; font-family:'Fraunces',serif; font-weight:600;}
.timeline-row .t-copy p{font-size:14.5px; opacity:0.75;}

/* ---------- CAROUSEL ---------- */
.carousel-section{background:var(--paper); padding:104px 0 96px; position:relative; overflow:hidden;}
.carousel-head{max-width:640px; margin:0 auto 48px; text-align:left; padding:0 32px; position:relative; z-index:2;}
.carousel-head .eyebrow{color:var(--emerald-mid);}
.carousel-head h2{font-size:clamp(30px,4vw,42px); color:var(--emerald-dark); margin-top:14px;}
.carousel-head p{opacity:0.75; margin-top:14px; font-size:16px; max-width:520px;}

.carousel{max-width:var(--maxw); margin:0 auto; padding:0 32px; position:relative; z-index:2;}
.carousel-track-wrap{overflow:hidden; border-radius:22px; border:1px solid var(--line);}
.carousel-track{display:flex; transition:transform .6s cubic-bezier(.65,0,.35,1);}
.slide{min-width:100%; display:grid; grid-template-columns:1.15fr 0.85fr; background:var(--off-white);}
.slide-art{aspect-ratio:16/11.5; display:flex; align-items:center; justify-content:center; padding:0;}
.slide-art svg{width:100%; height:100%;}
.slide-copy{padding:44px 44px 44px 8px; display:flex; flex-direction:column; justify-content:center;}
.slide-copy .eyebrow{font-family:'Space Mono',monospace; font-size:12px;}
.slide-copy h3{font-size:26px; color:var(--emerald-dark); margin:14px 0 12px;}
.slide-copy p{font-size:15px; opacity:0.78;}
.slide-tag{display:inline-block; margin-top:18px; font-size:12.5px; font-weight:600; padding:7px 14px; border-radius:100px; width:fit-content;}

.carousel-controls{display:flex; align-items:center; justify-content:space-between; margin-top:26px;}
.carousel-counter{font-family:'Space Mono',monospace; font-size:12.5px; opacity:0.6;}
.carousel-dots{display:flex; gap:9px; flex-wrap:wrap; max-width:420px;}
.dot{width:9px; height:9px; border-radius:50%; background:var(--line); border:none; cursor:pointer; transition:all .25s;}
.dot.active{background:var(--emerald-dark); width:26px; border-radius:5px;}
.carousel-arrows{display:flex; gap:10px;}
.arrow-btn{width:42px; height:42px; border-radius:50%; border:1px solid var(--line); background:var(--paper); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s, border-color .2s;}
.arrow-btn:hover{background:var(--off-white); border-color:var(--emerald-dark);}
.arrow-btn svg{width:16px; height:16px; stroke:var(--emerald-dark);}

/* ---------- LAND / OCEAN CARD SECTIONS ---------- */
.land{background:linear-gradient(180deg, var(--land-light) 0%, var(--land-dark) 100%); color:var(--off-white); padding:110px 0 120px; position:relative; overflow:hidden;}
.ocean{background:linear-gradient(180deg, var(--ocean-light) 0%, var(--ocean-dark) 100%); color:var(--off-white); padding:110px 0 120px; position:relative; overflow:hidden;}
.section-head{max-width:640px; margin-bottom:56px; position:relative; z-index:2;}
.section-head .eyebrow{opacity:0.85;}
.section-head h2{font-size:clamp(30px,4vw,44px); margin-top:14px;}
.section-head p{opacity:0.85; margin-top:16px; font-size:16px; max-width:540px;}

.card-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; position:relative; z-index:2;}
.init-card{
  background:rgba(11,30,20,0.18); border:1px solid rgba(246,243,236,0.22);
  border-radius:18px; padding:30px 26px; backdrop-filter: blur(2px);
  transition:transform .3s ease, background .3s ease;
}
.init-card:hover{transform:translateY(-6px); background:rgba(11,30,20,0.28);}
.init-card .icon{width:38px; height:38px; margin-bottom:20px;}
.init-card h4{font-size:18.5px; margin-bottom:10px;}
.init-card p{font-size:14px; opacity:0.82;}

/* ---------- GET INVOLVED PAGE ---------- */
.involve-options{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:10px;}
.involve-card{
  background:var(--paper); border:1px solid var(--line); border-radius:20px; padding:34px 28px;
  transition:transform .3s ease, box-shadow .3s ease;
  display:flex; flex-direction:column;
}
.involve-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(11,59,46,0.1);}
.involve-card .tag{font-family:'Space Mono',monospace; font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ocean-mid); margin-bottom:16px;}
.involve-card h3{font-size:21px; color:var(--emerald-dark); margin-bottom:12px;}
.involve-card p{font-size:14.5px; opacity:0.78; margin-bottom:22px; flex-grow:1;}

.contact-block{
  margin-top:90px; background:var(--emerald-dark); color:var(--off-white);
  border-radius:24px; padding:56px; display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center;
  position:relative; overflow:hidden;
}
.contact-block h3{font-size:clamp(26px,3.4vw,34px); margin-bottom:16px;}
.contact-block p{opacity:0.8; font-size:15px; max-width:420px;}
.contact-details{display:flex; flex-direction:column; gap:18px; position:relative; z-index:2;}
.contact-row{display:flex; align-items:center; gap:14px;}
.contact-row .ic{width:38px; height:38px; border-radius:50%; background:rgba(246,243,236,0.12); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.contact-row .ic svg{width:17px; height:17px; stroke:var(--off-white);}
.contact-row a, .contact-row span{font-size:15.5px; font-weight:500;}
.contact-row .cr-label{font-family:'Space Mono',monospace; font-size:11px; opacity:0.55; display:block; margin-bottom:2px; font-weight:400;}

.contact-form{display:flex; flex-direction:column; gap:14px; position:relative; z-index:2;}
.contact-form input, .contact-form textarea{
  background:rgba(246,243,236,0.08); border:1px solid rgba(246,243,236,0.25); border-radius:12px;
  padding:13px 16px; color:var(--off-white); font-family:'Inter',sans-serif; font-size:14.5px;
}
.contact-form input::placeholder, .contact-form textarea::placeholder{color:rgba(246,243,236,0.5);}
.contact-form input:focus, .contact-form textarea:focus{outline:1.5px solid var(--land-light); border-color:transparent;}
.contact-form textarea{resize:vertical; min-height:90px;}
.contact-form button{
  margin-top:4px; background:var(--land-light); color:var(--emerald-dark); border:none;
  padding:13px 22px; border-radius:100px; font-weight:700; font-size:14.5px; cursor:pointer;
  transition:background .2s;
}
.contact-form button:hover{background:var(--off-white);}
.form-note{font-size:12px; opacity:0.55; margin-top:2px;}

.faq{margin-top:90px;}
.faq-item{border-top:1px solid var(--line); padding:22px 0;}
.faq-item:last-child{border-bottom:1px solid var(--line);}
.faq-q{
  display:flex; justify-content:space-between; align-items:center; cursor:pointer;
  font-family:'Fraunces',serif; font-weight:600; font-size:17px; color:var(--emerald-dark);
  gap:16px;
}
.faq-q .plus{font-family:'Space Mono',monospace; font-size:18px; transition:transform .25s; flex-shrink:0;}
.faq-item.open .faq-q .plus{transform:rotate(45deg);}
/* Grid-rows trick: animates to the answer's real height, so nothing is ever clipped. */
.faq-a{display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s ease;}
.faq-item.open .faq-a{grid-template-rows:1fr;}
.faq-a-inner{overflow:hidden; min-height:0;}
.faq-a p{font-size:14.5px; opacity:0.75; padding-top:14px; max-width:640px;}

/* ---------- IMPACT / CTA ---------- */
.impact{background:var(--off-white); padding:110px 0 100px; text-align:center; position:relative; overflow:hidden;}
.impact .eyebrow{color:var(--emerald-mid);}
.impact h2{font-size:clamp(30px,5vw,52px); color:var(--emerald-dark); max-width:760px; margin:16px auto 34px; position:relative; z-index:2;}
.impact-actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; position:relative; z-index:2;}

/* ---------- FOOTER ---------- */
footer{background:var(--emerald-dark); color:var(--off-white); padding:56px 0 32px;}
.footer-top{display:flex; justify-content:space-between; flex-wrap:wrap; gap:36px; padding-bottom:36px; border-bottom:1px solid rgba(246,243,236,0.16); margin-bottom:24px;}
.footer-logo{font-family:'Fraunces',serif; font-size:20px; font-weight:600; display:flex; align-items:center; gap:10px;}
.footer-cols{display:flex; gap:64px; flex-wrap:wrap;}
.footer-col h5{font-size:12.5px; font-family:'Space Mono',monospace; letter-spacing:0.1em; text-transform:uppercase; opacity:0.6; margin-bottom:14px;}
.footer-col a{display:block; font-size:14px; opacity:0.85; margin-bottom:10px;}
.footer-bottom{display:flex; justify-content:space-between; font-size:12.5px; opacity:0.6; flex-wrap:wrap; gap:10px;}

/* ---------- CUSTOM CURSOR ---------- */
body.cursor-enabled, body.cursor-enabled a, body.cursor-enabled button{cursor:none;}
.cursor-dot, .cursor-ring{
  position:fixed; top:0; left:0; pointer-events:none; z-index:9999;
  border-radius:50%; will-change:transform; opacity:0;
  transition:opacity .3s ease;
}
.cursor-dot{width:8px; height:8px; background:var(--off-white); mix-blend-mode:difference;}
.cursor-ring{
  width:34px; height:34px; margin:-13px 0 0 -13px;
  border:1.4px solid var(--off-white); mix-blend-mode:difference;
  transition:opacity .3s ease, width .3s ease, height .3s ease, margin .3s ease, border-color .3s ease;
}
body.cursor-enabled .cursor-dot, body.cursor-enabled .cursor-ring{opacity:1;}
.cursor-ring.cursor-hover{width:64px; height:64px; margin:-13px 0 0 -13px; border-width:1px; background:rgba(246,243,236,0.12);}
.cursor-ring.cursor-down{width:26px; height:26px; margin:-13px 0 0 -13px;}

/* ---------- LAYERED PARALLAX DECOR ---------- */
/* Three depth bands: back (slowest, largest, blurred), mid, front (fastest, smallest, crisp) */
.pz-layer{position:absolute; pointer-events:none; will-change:transform;}
.pz-back{opacity:0.35; filter:blur(1px);}
.pz-mid{opacity:0.5;}
.pz-front{opacity:0.65;}

@media (max-width: 880px){
  .pz-layer{display:none;}
  .hero-inner{grid-template-columns:1fr; gap:40px;}
  .journey-art{max-width:380px; margin:0 auto;}
  .stat-grid{grid-template-columns:repeat(2,1fr);}
  .slide{grid-template-columns:1fr;}
  .slide-copy{padding:30px;}
  .card-grid{grid-template-columns:1fr;}
  .reasons-grid{grid-template-columns:1fr 1fr;}
  .involve-options{grid-template-columns:1fr;}
  .contact-block{grid-template-columns:1fr; padding:36px 28px;}
  .timeline-row{grid-template-columns:1fr;}
}
@media (max-width: 560px){
  .wrap, .hero-inner, .carousel, .carousel-head{padding-left:20px; padding-right:20px;}
  .stat-grid{grid-template-columns:1fr;}
  .reasons-grid{grid-template-columns:1fr;}
}

/* ---------- AUTH / LOGIN PAGE ---------- */
.auth-section{
  padding:70px 0 110px; min-height:calc(100vh - 400px);
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
}
.auth-wrap{max-width:960px; width:100%; margin:0 auto; padding:0 24px; position:relative; z-index:2;}
.auth-card{
  background:var(--paper); border:1px solid var(--line); border-radius:26px;
  padding:48px; max-width:460px; margin:0 auto;
  box-shadow:0 30px 60px rgba(11,59,46,0.08);
}
.auth-head{text-align:center; margin-bottom:30px;}
.auth-head .logo{justify-content:center; margin-bottom:18px;}
.auth-head h1{font-size:26px; color:var(--emerald-dark); margin-bottom:8px;}
.auth-head p{font-size:14.5px; opacity:0.7;}

.auth-tabs{
  display:flex; background:var(--off-white); border-radius:100px; padding:4px;
  margin-bottom:28px; border:1px solid var(--line);
}
.auth-tab{
  flex:1; text-align:center; padding:10px 0; border-radius:100px; border:none; background:none;
  font-size:14px; font-weight:600; color:var(--emerald-dark); opacity:0.55; cursor:pointer;
  transition:background .2s, opacity .2s;
}
.auth-tab.active{background:var(--emerald-dark); color:var(--off-white); opacity:1;}

.auth-panel{display:none;}
.auth-panel.active{display:block;}

.social-btn{
  width:100%; display:flex; align-items:center; justify-content:center; gap:10px;
  padding:12px 18px; border-radius:12px; border:1px solid var(--line); background:var(--off-white);
  font-size:14.5px; font-weight:600; color:var(--ink); cursor:pointer; margin-bottom:12px;
  transition:background .2s, border-color .2s, transform .18s;
}
.social-btn:hover{background:#fff; border-color:var(--emerald-dark); transform:translateY(-1px);}
.social-btn svg, .social-btn img{width:18px; height:18px; flex-shrink:0;}
.social-btn.disabled, .social-btn:disabled{opacity:0.5; cursor:not-allowed;}
.social-btn.disabled:hover, .social-btn:disabled:hover{transform:none; border-color:var(--line);}

.provider-slot{position:relative; margin-bottom:12px;}
.provider-slot:last-of-type{margin-bottom:0;}
.provider-slot.needs-setup{opacity:0.6;}
.provider-slot.needs-setup .social-btn{margin-bottom:0;}
.badge-soon{
  position:absolute; top:-8px; right:8px;
  background:var(--sand); color:var(--emerald-dark);
  font-family:'Space Mono',monospace; font-size:9.5px; letter-spacing:0.04em; text-transform:uppercase;
  padding:3px 8px; border-radius:100px; font-weight:700;
  box-shadow:0 2px 6px rgba(11,59,46,0.15);
}

.auth-divider{
  display:flex; align-items:center; gap:14px; margin:22px 0; font-size:12px;
  color:var(--ink); opacity:0.5; font-family:'Space Mono',monospace; text-transform:uppercase; letter-spacing:0.08em;
}
.auth-divider::before, .auth-divider::after{content:''; flex:1; height:1px; background:var(--line);}

.field{margin-bottom:16px;}
.field label{display:block; font-size:13px; font-weight:600; color:var(--emerald-dark); margin-bottom:7px;}
.field input, .field select, .field textarea{
  width:100%; padding:12px 14px; border-radius:10px; border:1px solid var(--line);
  background:var(--off-white); font-family:'Inter',sans-serif; font-size:14.5px; color:var(--ink);
}
.field input:focus, .field select:focus, .field textarea:focus{outline:1.5px solid var(--emerald-mid); border-color:transparent;}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:12px;}

.check-row{display:flex; align-items:flex-start; gap:10px; margin:16px 0 22px; font-size:13px; opacity:0.75;}
.check-row input{margin-top:3px;}

.auth-submit{
  width:100%; background:var(--emerald-dark); color:var(--off-white); border:none;
  padding:14px 0; border-radius:100px; font-weight:700; font-size:15px; cursor:pointer;
  transition:background .2s, transform .18s;
}
.auth-submit:hover{background:var(--emerald-mid); transform:translateY(-1px);}

.auth-foot{text-align:center; margin-top:20px; font-size:13.5px; opacity:0.7;}
.auth-foot a{font-weight:600; color:var(--emerald-dark); opacity:1;}
.auth-note{
  margin-top:18px; padding:12px 14px; border-radius:10px; background:rgba(126,184,210,0.14);
  font-size:12.5px; color:var(--ocean-dark); line-height:1.5;
}
.auth-status{
  margin-top:16px; padding:12px 14px; border-radius:10px; font-size:13.5px; display:none;
}
.auth-status.show{display:block;}
.auth-status.ok{background:rgba(169,204,147,0.25); color:var(--land-dark);}
.auth-status.err{background:rgba(231,111,81,0.15); color:#b3441f;}

@media (max-width: 560px){
  .auth-card{padding:32px 24px;}
  .field-row{grid-template-columns:1fr;}
}

/* ---------- ACCOUNT BAR (post-login) ---------- */
.account-bar{
  background:var(--paper); border-bottom:1px solid var(--line);
  padding:14px 0;
}
.account-bar-inner{
  max-width:var(--maxw); margin:0 auto; padding:0 32px;
  display:flex; align-items:center; justify-content:flex-end; gap:14px;
}
.account-chip{display:flex; align-items:center; gap:10px;}
.account-avatar{
  position:relative; width:38px; height:38px; border-radius:50%; overflow:hidden;
  background:var(--emerald-dark); color:var(--off-white); display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces',serif; font-weight:600; font-size:15px; flex-shrink:0;
  border:2px solid var(--off-white); box-shadow:0 0 0 1px var(--line);
}
.account-avatar img{width:100%; height:100%; object-fit:cover;}
.account-avatar .provider-badge{
  position:absolute; bottom:-2px; right:-2px; width:16px; height:16px; border-radius:50%;
  background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 2px var(--paper);
}
.account-avatar .provider-badge svg{width:10px; height:10px;}
.account-name{font-size:13.5px; font-weight:600; color:var(--emerald-dark); line-height:1.2;}
.account-email{font-size:11.5px; opacity:0.55; line-height:1.2;}
.logout-link{
  font-size:13px; font-weight:600; color:var(--emerald-dark); opacity:0.65;
  padding:8px 16px; border:1px solid var(--line); border-radius:100px; transition:opacity .2s, background .2s;
}
.logout-link:hover{opacity:1; background:var(--off-white);}

/* ---------- OPPORTUNITIES (dashboard) ---------- */
.opportunities-hero{padding:64px 0 20px; text-align:center;}
.opportunities-hero h1{font-size:clamp(28px,4.4vw,42px); color:var(--emerald-dark); margin-top:14px;}
.opportunities-hero p{opacity:0.75; max-width:520px; margin:12px auto 0; font-size:15.5px;}

.opp-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:50px;}
.opp-card{
  background:var(--paper); border:1px solid var(--line); border-radius:22px; padding:36px 30px;
  display:flex; flex-direction:column; text-align:left;
  transition:transform .3s ease, box-shadow .3s ease;
}
.opp-card:hover{transform:translateY(-6px); box-shadow:0 22px 44px rgba(11,59,46,0.1);}
.opp-card .opp-icon{
  width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  margin-bottom:22px;
}
.opp-card .opp-icon svg{width:24px; height:24px;}
.opp-card h3{font-size:20px; color:var(--emerald-dark); margin-bottom:10px;}
.opp-card p{font-size:14.5px; opacity:0.75; margin-bottom:24px; flex-grow:1;}
.opp-card .tag{font-family:'Space Mono',monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; opacity:0.5; margin-bottom:10px;}

@media (max-width: 880px){
  .opp-grid{grid-template-columns:1fr;}
  .account-bar-inner{justify-content:space-between;}
}

/* ---------- TERMS PAGE ---------- */
.terms-content{padding:90px 0 60px;}
.terms-layout{display:grid; grid-template-columns:220px 1fr; gap:56px; align-items:start;}

.terms-toc{position:sticky; top:100px;}
.terms-toc-label{font-family:'Space Mono',monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; opacity:0.5; margin-bottom:16px;}
.terms-toc a{
  display:flex; align-items:center; gap:10px; padding:9px 0; font-size:13.5px; color:var(--ink);
  opacity:0.6; transition:opacity .2s, color .2s; border-left:2px solid transparent; padding-left:12px; margin-left:-13px;
}
.terms-toc a .n{
  font-family:'Space Mono',monospace; font-size:11px; width:20px; height:20px; border-radius:50%;
  background:var(--off-white); display:flex; align-items:center; justify-content:center; flex-shrink:0; opacity:0.7;
}
.terms-toc a:hover{opacity:1;}
.terms-toc a.in-view{opacity:1; color:var(--emerald-dark); font-weight:600; border-left-color:var(--emerald-dark);}
.terms-toc a.in-view .n{background:var(--emerald-dark); color:var(--off-white); opacity:1;}

.terms-main .updated{font-size:13px; opacity:0.55; margin-bottom:44px; font-family:'Space Mono',monospace;}

.terms-section{
  display:grid; grid-template-columns:52px 1fr; gap:22px;
  padding:34px 0; border-top:1px solid var(--line);
  scroll-margin-top:100px;
}
.terms-section:first-of-type{border-top:none; padding-top:0;}
.terms-section .t-icon{
  width:52px; height:52px; border-radius:14px; background:var(--paper); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.terms-section .t-icon svg{width:22px; height:22px; stroke:var(--emerald-dark);}
.terms-section h3{font-size:19px; color:var(--emerald-dark); margin-bottom:10px;}
.terms-section p{font-size:14.5px; opacity:0.78; margin-bottom:10px; max-width:620px;}
.terms-section ul{padding-left:20px; margin-bottom:6px;}
.terms-section li{font-size:14.5px; opacity:0.78; margin-bottom:8px; max-width:600px;}
.terms-section a.inline-link{color:var(--emerald-dark); font-weight:600; opacity:1; text-decoration:underline; text-underline-offset:2px;}

/* Sticky accept bar */
.accept-bar-spacer{height:120px;}
.accept-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:200;
  background:rgba(251,250,246,0.9); backdrop-filter:blur(14px);
  border-top:1px solid var(--line); box-shadow:0 -10px 30px rgba(11,59,46,0.06);
  padding:18px 0;
}
.accept-bar-inner{
  max-width:var(--maxw); margin:0 auto; padding:0 32px;
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.accept-check{display:flex; align-items:flex-start; gap:10px; font-size:13.5px; max-width:520px; flex:1; min-width:260px;}
.accept-check input{margin-top:3px; width:17px; height:17px; flex-shrink:0; accent-color:var(--emerald-dark);}
.accept-actions{display:flex; gap:12px; flex-shrink:0;}
.accept-actions .auth-submit{width:auto; padding:13px 30px;}

@media (max-width: 880px){
  .terms-layout{grid-template-columns:1fr;}
  .terms-toc{position:static; display:flex; gap:8px; overflow-x:auto; padding-bottom:8px; margin-bottom:10px;}
  .terms-toc-label{display:none;}
  .terms-toc a{border-left:none; padding-left:0; margin-left:0; white-space:nowrap; background:var(--paper); padding:8px 14px; border-radius:100px; border:1px solid var(--line);}
  .terms-toc a.in-view{border-left:none;}
  .terms-section{grid-template-columns:44px 1fr; gap:16px;}
  .accept-bar-inner{flex-direction:column; align-items:stretch;}
  .accept-actions{justify-content:stretch;}
  .accept-actions a, .accept-actions button{flex:1; text-align:center;}
}


/* ---------- 24/7 AI HELPLINE WIDGET ---------- */
.helpline-launcher{
  position:fixed; bottom:24px; right:24px; z-index:180;
  display:flex; align-items:center; gap:10px;
  background:var(--emerald-dark); color:var(--off-white);
  border:none; border-radius:100px; padding:14px 20px 14px 16px; cursor:pointer;
  box-shadow:0 14px 34px rgba(11,59,46,0.28);
  transition:transform .2s ease, background .2s;
}
.helpline-launcher:hover{transform:translateY(-2px); background:var(--emerald-mid);}
.helpline-launcher .hl-icon{
  width:26px; height:26px; border-radius:50%; background:rgba(246,243,236,0.14);
  display:flex; align-items:center; justify-content:center; flex-shrink:0; position:relative;
}
.helpline-launcher .hl-icon svg{width:15px; height:15px;}
.helpline-launcher .hl-dot{
  position:absolute; top:-2px; right:-2px; width:9px; height:9px; border-radius:50%;
  background:#7DBAD1; border:2px solid var(--emerald-dark);
}
.helpline-launcher .hl-text{text-align:left; line-height:1.25;}
.helpline-launcher .hl-title{font-size:13px; font-weight:700;}
.helpline-launcher .hl-sub{font-size:10.5px; opacity:0.7; font-family:'Space Mono',monospace; letter-spacing:0.03em;}

.helpline-panel{
  position:fixed; bottom:24px; right:24px; z-index:190;
  width:352px; max-width:calc(100vw - 32px); height:480px; max-height:calc(100vh - 48px);
  background:var(--paper); border:1px solid var(--line); border-radius:22px;
  box-shadow:0 30px 70px rgba(11,20,15,0.25);
  display:flex; flex-direction:column; overflow:hidden;
  transform:translateY(16px) scale(0.97); opacity:0; pointer-events:none;
  transition:transform .25s ease, opacity .25s ease;
}
.helpline-panel.open{transform:translateY(0) scale(1); opacity:1; pointer-events:auto;}

.hl-header{
  background:var(--emerald-dark); color:var(--off-white); padding:16px 18px;
  display:flex; align-items:center; justify-content:space-between; flex-shrink:0;
}
.hl-header-info{display:flex; align-items:center; gap:10px;}
.hl-avatar{
  width:34px; height:34px; border-radius:50%; background:rgba(246,243,236,0.15);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.hl-avatar svg{width:17px; height:17px;}
.hl-header-title{font-size:14px; font-weight:700;}
.hl-header-status{font-size:11px; opacity:0.75; display:flex; align-items:center; gap:5px;}
.hl-header-status .dot{width:6px; height:6px; border-radius:50%; background:#A9CC93;}
.hl-close{background:none; border:none; cursor:pointer; padding:6px; opacity:0.8;}
.hl-close svg{width:16px; height:16px; stroke:var(--off-white);}

.hl-messages{flex-grow:1; overflow-y:auto; padding:18px; display:flex; flex-direction:column; gap:12px;}
.hl-msg{max-width:84%; padding:10px 14px; border-radius:16px; font-size:13.5px; line-height:1.5;}
.hl-msg.bot{background:var(--off-white); border:1px solid var(--line); color:var(--ink); border-bottom-left-radius:4px; align-self:flex-start;}
.hl-msg.user{background:var(--emerald-dark); color:var(--off-white); border-bottom-right-radius:4px; align-self:flex-end;}
.hl-msg a{color:inherit; font-weight:700; text-decoration:underline;}
.hl-quick{display:flex; flex-wrap:wrap; gap:6px; padding:0 18px 12px; flex-shrink:0;}
.hl-quick button{
  font-size:12px; padding:7px 12px; border-radius:100px; border:1px solid var(--line);
  background:var(--off-white); color:var(--emerald-dark); cursor:pointer; transition:background .2s;
}
.hl-quick button:hover{background:#fff; border-color:var(--emerald-dark);}

.hl-input-row{display:flex; gap:8px; padding:14px; border-top:1px solid var(--line); flex-shrink:0; background:var(--paper);}
.hl-input-row input{
  flex-grow:1; padding:11px 14px; border-radius:100px; border:1px solid var(--line);
  background:var(--off-white); font-family:'Inter',sans-serif; font-size:13.5px;
}
.hl-input-row input:focus{outline:1.5px solid var(--emerald-mid); border-color:transparent;}
.hl-input-row button{
  width:40px; height:40px; border-radius:50%; background:var(--emerald-dark); border:none;
  color:var(--off-white); cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0;
  transition:background .2s;
}
.hl-input-row button:hover{background:var(--emerald-mid);}
.hl-input-row button svg{width:15px; height:15px;}

@media (max-width: 560px){
  .helpline-launcher .hl-text{display:none;}
  .helpline-launcher{padding:14px; border-radius:50%;}
  .helpline-panel{right:16px; bottom:16px; width:calc(100vw - 32px);}
}

/* ---------- LOGIN SUCCESS STATE ---------- */
.auth-success{text-align:center; padding:20px 6px 10px;}
.success-badge{
  width:64px; height:64px; border-radius:50%; background:var(--emerald-dark);
  display:flex; align-items:center; justify-content:center; margin:0 auto 22px;
  animation:successPop .45s cubic-bezier(.34,1.56,.64,1);
}
.success-badge svg{width:28px; height:28px;}
@keyframes successPop{
  0%{transform:scale(0.4); opacity:0;}
  60%{transform:scale(1.08); opacity:1;}
  100%{transform:scale(1);}
}
.auth-success h1{font-size:24px; color:var(--emerald-dark); margin-bottom:8px;}
.auth-success p{font-size:14.5px; opacity:0.72; margin-bottom:26px;}
.success-bar{height:4px; border-radius:100px; background:var(--off-white); overflow:hidden; max-width:220px; margin:0 auto;}
.success-bar-fill{height:100%; width:0%; background:var(--land-mid); border-radius:100px; transition:width 0.9s linear;}
@media (prefers-reduced-motion: reduce){
  .success-badge{animation:none;}
}

/* ---------- NEWS PAGE ---------- */
.news-section{padding:80px 0 100px; background:var(--paper);}
.news-toolbar{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px;
  margin-bottom:36px;
}
.news-live{
  display:flex; align-items:center; gap:9px; font-size:13px; opacity:0.65;
  font-family:'Space Mono',monospace;
}
.news-live .dot{
  width:8px; height:8px; border-radius:50%; background:var(--land-mid);
  animation:pulseDot 1.8s ease-in-out infinite;
}
@keyframes pulseDot{
  0%, 100%{ box-shadow:0 0 0 0 rgba(110,159,93,0.5); }
  50%{ box-shadow:0 0 0 6px rgba(110,159,93,0); }
}
@media (prefers-reduced-motion: reduce){ .news-live .dot{ animation:none; } }

.news-submit-form{
  background:var(--off-white); border:1px solid var(--line); border-radius:18px;
  padding:26px; margin-bottom:36px;
}
.news-demo-note{font-size:12px; opacity:0.55; margin-top:14px;}

.news-feed{display:flex; flex-direction:column; gap:18px;}
.news-card{
  display:grid; grid-template-columns:110px 1fr; gap:22px;
  background:var(--off-white); border:1px solid var(--line); border-radius:18px; padding:24px 26px;
  transition:transform .25s ease, box-shadow .25s ease;
}
.news-card:hover{transform:translateY(-3px); box-shadow:0 16px 34px rgba(11,59,46,0.08);}
.news-card.pinned{border-color:var(--land-mid); background:linear-gradient(135deg, rgba(169,204,147,0.14), var(--off-white) 40%);}
.news-meta{display:flex; flex-direction:column; gap:8px;}
.news-date{font-family:'Space Mono',monospace; font-size:11.5px; opacity:0.55;}
.news-tag{
  font-family:'Space Mono',monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:0.05em;
  padding:5px 9px; border-radius:100px; width:fit-content; font-weight:700;
}
.news-tag.ocean{background:rgba(125,186,209,0.25); color:var(--ocean-dark);}
.news-tag.policy{background:rgba(217,203,163,0.35); color:#8a6d2f;}
.news-tag.guidelines{background:rgba(62,133,166,0.2); color:var(--ocean-dark);}
.news-tag.community{background:rgba(169,204,147,0.3); color:var(--land-dark);}
.news-tag.awards{background:rgba(11,59,46,0.12); color:var(--emerald-dark);}
.news-content h3{font-size:17.5px; color:var(--emerald-dark); margin-bottom:8px;}
.news-content p{font-size:14px; opacity:0.78; margin-bottom:8px;}
.news-byline{font-size:11.5px; opacity:0.45; font-family:'Space Mono',monospace;}

@media (max-width: 640px){
  .news-card{grid-template-columns:1fr;}
}

/* ---------- COURSES PAGE ---------- */
.courses-section{padding:80px 0 110px; background:var(--paper);}
.course-card{
  display:grid; grid-template-columns:1fr 280px; gap:0;
  background:var(--off-white); border:1px solid var(--line); border-radius:22px;
  overflow:hidden; margin-bottom:30px;
}
.course-main{padding:38px 40px;}
.course-icon{
  width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  margin-bottom:18px;
}
.course-icon svg{width:24px; height:24px;}
.course-tags{display:flex; gap:8px; margin-bottom:14px;}
.course-tag{
  font-family:'Space Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.05em;
  padding:5px 11px; border-radius:100px; background:var(--paper); border:1px solid var(--line); color:var(--emerald-dark);
}
.course-main h3{font-size:22px; color:var(--emerald-dark); margin-bottom:12px;}
.course-main p{font-size:14.5px; opacity:0.78; margin-bottom:18px; max-width:560px;}
.course-main h4{font-size:12.5px; text-transform:uppercase; letter-spacing:0.06em; font-family:'Space Mono',monospace; opacity:0.55; margin-bottom:12px;}
.course-main ul{padding-left:20px;}
.course-main li{font-size:14px; opacity:0.78; margin-bottom:8px; max-width:520px;}

.course-cert{
  background:var(--emerald-dark); color:var(--off-white); padding:34px 30px;
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:6px;
}
.course-cert-icon{
  width:44px; height:44px; border-radius:50%; background:rgba(246,243,236,0.14);
  display:flex; align-items:center; justify-content:center; margin-bottom:10px;
}
.course-cert-icon svg{width:20px; height:20px;}
.course-cert h5{font-size:15.5px; margin-bottom:4px;}
.course-cert p{font-size:12.5px; opacity:0.72; margin-bottom:16px;}
.course-cert .btn-primary{background:var(--land-light); color:var(--emerald-dark); border-color:var(--land-light); width:100%; text-align:center;}
.course-cert .btn-primary:hover{background:var(--off-white);}

@media (max-width: 880px){
  .course-card{grid-template-columns:1fr;}
  .course-cert{padding:28px 30px;}
}

/* ---------- COURSE LESSON PAGES ---------- */
.wrap-narrow{max-width:760px; margin:0 auto; padding:0 32px;}

.course-lesson-hero{background:var(--emerald-dark); color:var(--off-white); padding:70px 0 40px;}
.back-link{font-size:13px; opacity:0.75; display:inline-block; margin-bottom:20px;}
.back-link:hover{opacity:1;}
.course-lesson-hero .eyebrow{opacity:0.75; margin-bottom:12px;}
.course-lesson-hero h1{font-size:clamp(26px,3.6vw,38px); margin-bottom:26px; max-width:700px;}

.course-progress-wrap{max-width:520px;}
.course-progress-track{height:8px; border-radius:100px; background:rgba(246,243,236,0.16); overflow:hidden;}
.course-progress-fill{height:100%; width:0%; background:var(--land-light); border-radius:100px; transition:width .4s ease;}
.course-progress-label{font-family:'Space Mono',monospace; font-size:12px; opacity:0.7; margin-top:10px;}

.course-lesson-body{background:var(--paper); padding:60px 0 110px;}

.module-block{
  padding:30px 0; border-bottom:1px solid var(--line);
}
.module-block:first-child{padding-top:0;}
.module-block h3{font-size:20px; color:var(--emerald-dark); margin-bottom:14px;}
.module-body p{font-size:15px; opacity:0.8; margin-bottom:12px; max-width:640px;}
.module-check{
  display:flex; align-items:center; gap:10px; margin-top:16px; font-size:14px; font-weight:600;
  color:var(--emerald-dark); cursor:pointer; width:fit-content;
}
.module-check input{width:17px; height:17px; accent-color:var(--emerald-dark);}
.module-block.done{opacity:0.75;}
.module-block.done h3::after{content:' ✓'; color:var(--land-mid);}

.quiz-block{
  background:var(--off-white); border:1px solid var(--line); border-radius:18px;
  padding:28px 30px; margin:26px 0;
}
.quiz-block.passed{border-color:var(--land-mid); background:rgba(169,204,147,0.08);}
.quiz-title{font-size:16px; color:var(--emerald-dark); margin-bottom:6px;}
.quiz-intro{font-size:13.5px; opacity:0.65; margin-bottom:18px;}
.quiz-question{margin-bottom:20px;}
.q-text{font-size:14.5px; font-weight:600; color:var(--ink); margin-bottom:10px;}
.q-options{display:flex; flex-direction:column; gap:8px;}
.q-option{
  display:flex; align-items:flex-start; gap:10px; font-size:14px; padding:9px 12px;
  border-radius:10px; border:1px solid var(--line); cursor:pointer; transition:background .15s;
}
.q-option:hover{background:var(--paper);}
.q-option input{margin-top:3px;}
.q-feedback{font-size:12.5px; margin-top:6px; font-weight:600;}
.q-feedback.ok{color:var(--land-dark);}
.q-feedback.err{color:#b3441f;}
.quiz-submit{margin-top:6px;}
.quiz-result{font-size:13.5px; margin-top:14px; font-weight:600;}
.quiz-result.ok{color:var(--land-dark);}
.quiz-result.err{color:#b3441f;}

.completion-block{
  background:var(--emerald-dark); color:var(--off-white); border-radius:20px;
  padding:36px 34px; margin-top:36px; text-align:center;
}
.completion-block h3{font-size:21px; margin-bottom:10px;}
.completion-block p{font-size:14px; opacity:0.8; max-width:520px; margin:0 auto 22px;}
.completion-block .auth-submit{margin:0 auto;}
.cert-result{margin-top:20px; font-size:14px; max-width:480px; margin-left:auto; margin-right:auto;}
.cert-result.ok{color:var(--land-light);}
.cert-result.err{color:#f0a688;}

/* ---------- SUSTAINABLE SOLUTIONS PAGE ---------- */
.solutions-section{padding:90px 0 40px; background:var(--paper);}
.solution-feature{
  display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;
  margin-bottom:90px;
}
.solution-feature.reverse .solution-feature-media{order:2;}
.solution-feature.reverse .solution-feature-copy{order:1;}
.solution-feature-media{border-radius:22px; overflow:hidden; box-shadow:0 24px 50px rgba(11,59,46,0.12);}
.solution-feature-media img{width:100%; height:100%; object-fit:cover; display:block; aspect-ratio:4/3;}
.solution-kicker{
  font-family:'Space Mono',monospace; font-size:12px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--ocean-mid); font-weight:700; display:block; margin-bottom:14px;
}
.solution-feature-copy h2{font-size:clamp(22px,2.6vw,30px); color:var(--emerald-dark); margin-bottom:16px;}
.solution-feature-copy p{font-size:15px; opacity:0.78; max-width:460px;}

.solutions-grid-head{max-width:640px; margin:20px 0 40px;}
.solutions-grid-head h2{font-size:clamp(24px,3vw,32px); color:var(--emerald-dark); margin-top:12px;}
.solutions-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:20px;}
.solution-card{
  background:var(--off-white); border:1px solid var(--line); border-radius:18px; padding:28px 26px;
  transition:transform .3s ease, box-shadow .3s ease;
}
.solution-card:hover{transform:translateY(-6px); box-shadow:0 18px 36px rgba(11,59,46,0.08);}
.solution-icon{
  width:48px; height:48px; border-radius:12px; background:var(--paper);
  display:flex; align-items:center; justify-content:center; margin-bottom:18px;
}
.solution-icon svg{width:22px; height:22px;}
.solution-card h4{font-size:16.5px; color:var(--emerald-dark); margin-bottom:10px;}
.solution-card p{font-size:13.5px; opacity:0.75;}

@media (max-width: 880px){
  .solution-feature{grid-template-columns:1fr; gap:26px;}
  .solution-feature.reverse .solution-feature-media{order:1;}
  .solution-feature.reverse .solution-feature-copy{order:2;}
  .solutions-grid{grid-template-columns:1fr;}
}

/* ---------- COURSE STEP NAVIGATION (v2 engine) ---------- */
.step-nav{margin-bottom:22px;}
.step-label{
  font-family:'Space Mono',monospace; font-size:12px; text-transform:uppercase; letter-spacing:0.06em;
  color:var(--ocean-mid); font-weight:700;
}
.step-next{margin-top:20px;}

/* ---------- CERTIFICATE PRICING ---------- */
.pricing-section{padding:20px 0 90px; background:var(--paper);}
.pricing-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:28px; max-width:820px; margin:44px auto 0;
}
.pricing-card{
  background:var(--off-white); border:1px solid var(--line); border-radius:22px; padding:36px 32px;
  display:flex; flex-direction:column;
}
.pricing-card.featured{
  background:var(--emerald-dark); color:var(--off-white); border-color:var(--emerald-dark);
  position:relative; transform:translateY(-8px);
  box-shadow:0 24px 50px rgba(11,59,46,0.22);
}
.pricing-card.featured::before{
  content:'MOST POPULAR'; position:absolute; top:-13px; left:50%; transform:translateX(-50%);
  background:var(--land-light); color:var(--emerald-dark); font-family:'Space Mono',monospace;
  font-size:10.5px; font-weight:700; letter-spacing:0.06em; padding:5px 14px; border-radius:100px;
}
.pricing-tag{font-family:'Space Mono',monospace; font-size:12px; text-transform:uppercase; letter-spacing:0.06em; opacity:0.65; margin-bottom:10px;}
.pricing-amount{font-family:'Fraunces',serif; font-size:42px; font-weight:600; margin-bottom:10px;}
.pricing-amount span{font-size:14px; font-weight:500; opacity:0.6; margin-left:4px;}
.pricing-sub{font-size:14px; opacity:0.75; margin-bottom:22px;}
.pricing-features{list-style:none; margin-bottom:28px; flex-grow:1;}
.pricing-features li{
  font-size:13.5px; padding:8px 0 8px 26px; position:relative; opacity:0.88;
  border-top:1px solid rgba(0,0,0,0.06);
}
.pricing-card.featured .pricing-features li{border-top:1px solid rgba(246,243,236,0.14);}
.pricing-features li:first-child{border-top:none;}
.pricing-features li::before{content:'✓'; position:absolute; left:0; font-weight:700; color:var(--land-mid);}
.pricing-card.featured .pricing-features li::before{color:var(--land-light);}
.pricing-card .btn-primary, .pricing-card .btn-secondary{text-align:center;}
.pricing-card.featured .btn-secondary{border-color:rgba(246,243,236,0.5); color:var(--off-white);}
.pricing-note{text-align:center; font-size:12.5px; opacity:0.6; max-width:520px; margin:28px auto 0;}

@media (max-width: 700px){
  .pricing-grid{grid-template-columns:1fr;}
  .pricing-card.featured{transform:none;}
}

/* ---------- BOTTOM MOBILE NAV BAR ---------- */
.bottom-nav{
  display:none;
  position:fixed; left:0; right:0; bottom:0; z-index:150;
  background:rgba(251,250,246,0.95); backdrop-filter:blur(14px);
  border-top:1px solid var(--line);
  padding:8px 6px calc(8px + env(safe-area-inset-bottom));
  justify-content:space-around; align-items:center;
}
.bottom-nav-item{
  display:flex; flex-direction:column; align-items:center; gap:4px;
  font-size:10.5px; font-weight:600; color:var(--emerald-dark); opacity:0.55;
  padding:4px 8px; border-radius:12px; transition:opacity .2s, background .2s;
}
.bottom-nav-item svg{width:21px; height:21px; stroke:var(--emerald-dark);}
.bottom-nav-item.active{opacity:1; background:rgba(11,59,46,0.08);}
.bottom-nav-item:hover{opacity:1;}

@media (max-width: 640px){
  .bottom-nav{display:flex;}
  body{padding-bottom:70px;}
  .helpline-launcher{bottom:84px;}
  .helpline-panel{bottom:84px;}
  .accept-bar{padding-bottom:calc(18px + 70px);}
}

/* ---------- PLEDGE SECTION (Climate Pledge structure + bold statement style) ---------- */
.pledge-section{background:var(--emerald-dark); color:var(--off-white); padding:100px 0; position:relative; overflow:hidden;}
.pledge-statement{max-width:820px; margin-bottom:64px;}
.pledge-statement .eyebrow{color:var(--land-light); margin-bottom:18px; display:block;}
.pledge-statement h2{font-size:clamp(28px,4.2vw,46px); line-height:1.15;}
.pledge-statement h2 em{font-style:italic; color:var(--land-light);}
.pledge-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:36px; margin-bottom:44px; position:relative; z-index:2;}
.pledge-item{border-top:1px solid rgba(246,243,236,0.2); padding-top:22px;}
.pledge-num{font-family:'Space Mono',monospace; font-size:13px; color:var(--land-light); opacity:0.8;}
.pledge-item h4{font-size:19px; margin:14px 0 10px;}
.pledge-item p{font-size:14px; opacity:0.78; max-width:340px;}
.pledge-cta{position:relative; z-index:2;}

@media (max-width: 880px){
  .pledge-grid{grid-template-columns:1fr; gap:26px;}
}

/* ---------- SCROLL-REVEAL (Dubai Future / Climate Pledge style entrance) ---------- */
.reveal{opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in-view{opacity:1; transform:translateY(0);}
.reveal-stagger > *{opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease;}
.reveal-stagger.in-view > *{opacity:1; transform:translateY(0);}
.reveal-stagger.in-view > *:nth-child(1){transition-delay:.05s;}
.reveal-stagger.in-view > *:nth-child(2){transition-delay:.15s;}
.reveal-stagger.in-view > *:nth-child(3){transition-delay:.25s;}
.reveal-stagger.in-view > *:nth-child(4){transition-delay:.35s;}
.reveal-stagger.in-view > *:nth-child(5){transition-delay:.45s;}
.reveal-stagger.in-view > *:nth-child(6){transition-delay:.55s;}
@media (prefers-reduced-motion: reduce){
  .reveal, .reveal-stagger > *{opacity:1; transform:none; transition:none;}
}

/* ---------- ANIMATED STAT COUNTERS ---------- */
.stat-num[data-count-to]{font-variant-numeric:tabular-nums;}

/* ---------- MARQUEE (signatory-style scrolling strip) ---------- */
.marquee-section{background:var(--paper); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:22px 0; overflow:hidden;}
.marquee-track{display:flex; gap:0; width:max-content; animation:marqueeScroll 28s linear infinite;}
.marquee-track span{
  display:flex; align-items:center; gap:10px;
  font-family:'Space Mono',monospace; font-size:13px; letter-spacing:0.04em; text-transform:uppercase;
  color:var(--emerald-dark); opacity:0.6; padding:0 34px; white-space:nowrap; flex-shrink:0;
}
.marquee-track span::before{content:'●'; font-size:6px; color:var(--land-mid); opacity:0.8;}
@keyframes marqueeScroll{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}
.marquee-section:hover .marquee-track{animation-play-state:paused;}
@media (prefers-reduced-motion: reduce){
  .marquee-track{animation:none;}
}