:root{
  --green-900:#0b3d2e;
  --green-800:#0f4c3a;
  --green-700:#146c4f;
  --gold-500:#d3a44a;
  --gold-400:#e2bc70;
  --cream:#faf7f0;
  --ink:#1c2321;
  --muted:#5c6b64;
  --border:#e6e1d6;
  --radius:14px;
  --shadow:0 10px 30px rgba(11,61,46,.08);
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);line-height:1.65}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* ---------- Top bar ---------- */
.topbar{background:var(--green-900);color:#cfe6dc;font-size:13px}
.topbar .container{display:flex;justify-content:space-between;align-items:center;height:36px;flex-wrap:wrap;gap:6px}
.topbar a{opacity:.9}
.topbar a:hover{opacity:1;color:var(--gold-400)}
.topbar .tb-links{display:flex;gap:18px}

/* ---------- Header ---------- */
header.site-header{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
.logo img{height:52px;width:auto}
nav.main-nav ul{display:flex;align-items:center;gap:28px}
nav.main-nav a{font-weight:500;font-size:15px;color:var(--ink)}
nav.main-nav a:hover{color:var(--green-700)}
.has-dropdown{position:relative}
.dropdown{position:absolute;top:calc(100% + 14px);left:0;background:#fff;box-shadow:var(--shadow);border-radius:10px;padding:10px;min-width:220px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s}
.has-dropdown:hover .dropdown{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown li a{display:block;padding:8px 12px;border-radius:6px;font-size:14px}
.dropdown li a:hover{background:var(--cream);color:var(--green-700)}
.cta-btn,.btn{display:inline-flex;align-items:center;gap:8px;background:var(--gold-500);color:#fff!important;font-weight:600;padding:12px 26px;border-radius:50px;border:none;cursor:pointer;transition:.2s;font-size:14.5px}
.cta-btn:hover,.btn:hover{background:var(--green-800);color:#fff!important}
.btn-outline{background:transparent;border:1.5px solid var(--gold-500);color:var(--gold-500)!important}
.btn-outline:hover{background:var(--gold-500);color:#fff!important}
.hamburger{display:none;background:none;border:none;font-size:26px;cursor:pointer}

/* ---------- Hero ---------- */
.hero{background:linear-gradient(120deg,var(--green-900),var(--green-800));color:#fff;padding:90px 0 70px;position:relative;overflow:hidden}
.hero .container{position:relative;z-index:2}
.eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);padding:8px 16px;border-radius:50px;font-size:13px;letter-spacing:.5px;color:var(--gold-400);margin-bottom:22px}
.hero h1{font-size:clamp(32px,5vw,54px);margin:0 0 20px;line-height:1.15;max-width:760px}
.hero p.lead{font-size:18px;color:#dfeee7;max-width:620px;margin:0 0 32px}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}

.page-hero{background:linear-gradient(120deg,var(--green-900),var(--green-800));color:#fff;padding:70px 0 60px;text-align:center}
.page-hero h1{font-size:clamp(30px,4.5vw,46px);margin:0 0 14px}
.page-hero p{color:#dfeee7;max-width:640px;margin:0 auto;font-size:16.5px}

/* ---------- Sections ---------- */
section{padding:72px 0}
.section-head{text-align:center;max-width:680px;margin:0 auto 46px}
.section-head .eyebrow{background:rgba(211,164,74,.12);color:var(--gold-500)}
.section-head h2{font-size:clamp(26px,3.5vw,38px);margin:8px 0 14px}
.section-head p{color:var(--muted);font-size:16px}
.tech-strip{display:flex;justify-content:center;align-items:center;gap:48px;flex-wrap:wrap;opacity:.85}
.tech-strip img{height:36px;filter:grayscale(1);opacity:.65;transition:.2s}
.tech-strip img:hover{filter:none;opacity:1}

.video-frame{max-width:900px;margin:44px auto 0;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.video-frame video{width:100%;display:block}

/* ---------- Course cards ---------- */
.course-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:28px}
.course-card{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--border);transition:.2s}
.course-card:hover{transform:translateY(-6px)}
.course-thumb{position:relative}
.course-thumb img{height:200px;width:100%;object-fit:cover}
.badge-free{position:absolute;top:14px;left:14px;background:var(--gold-500);color:#fff;font-size:12px;font-weight:700;padding:5px 12px;border-radius:50px}
.course-body{padding:22px}
.course-body h3{margin:0 0 8px;font-size:18px}
.course-body p{color:var(--muted);font-size:14.5px;margin:0 0 18px}
.course-body .btn{width:100%;justify-content:center;padding:11px 20px;font-size:14px}
.grid-nav{text-align:center;margin-top:40px;color:var(--muted);font-size:14px}

/* ---------- Features ---------- */
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.feature-card{background:#fff;border-radius:var(--radius);padding:30px;box-shadow:var(--shadow);border:1px solid var(--border)}
.feature-icon{width:52px;height:52px;border-radius:50%;background:rgba(211,164,74,.14);color:var(--gold-500);display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:18px}
.feature-card h4{margin:0 0 10px;font-size:17px}
.feature-card p{color:var(--muted);font-size:14.5px;margin:0}

/* ---------- Why choose split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split-list{display:flex;flex-direction:column;gap:22px;margin-top:24px}
.split-item{display:flex;gap:16px}
.split-item .num{width:38px;height:38px;border-radius:50%;background:var(--green-800);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}
.split-item h4{margin:0 0 6px;font-size:16.5px}
.split-item p{margin:0;color:var(--muted);font-size:14.5px}
.split img{border-radius:var(--radius);box-shadow:var(--shadow)}

/* ---------- Testimonials ---------- */
.testi-strip{background:var(--green-900);color:#fff;border-radius:var(--radius);padding:40px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px;margin-bottom:44px}
.testi-strip .rating{color:var(--gold-400);font-size:20px}
.testi-strip small{color:#bcd6cb}
.testi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.testi-card{background:#fff;border-radius:var(--radius);padding:26px;box-shadow:var(--shadow);border:1px solid var(--border)}
.testi-card .rating{color:var(--gold-500);margin-bottom:10px;font-size:14px}
.testi-card p{font-style:italic;color:var(--ink);margin:0 0 18px}
.testi-person{display:flex;align-items:center;gap:12px}
.testi-person img{width:42px;height:42px;border-radius:50%;object-fit:cover}
.testi-person span{font-weight:600;font-size:14px}

/* ---------- Map + reviews ---------- */
.map-frame{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:0}
.map-frame iframe{width:100%;height:340px;border:0;display:block}
.review-cta{text-align:center;background:#fff;border-radius:var(--radius);padding:44px;box-shadow:var(--shadow);border:1px solid var(--border)}
.review-cta .rating{color:var(--gold-500);font-size:22px;margin-bottom:12px}

/* ---------- Newsletter ---------- */
.newsletter{background:linear-gradient(120deg,var(--green-800),var(--green-900));color:#fff;border-radius:var(--radius);padding:50px;display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap}
.newsletter h3{margin:0 0 6px;font-size:24px}
.newsletter p{margin:0;color:#dfeee7}
.newsletter form{display:flex;gap:10px;flex-wrap:wrap}
.newsletter input{padding:13px 18px;border-radius:50px;border:none;min-width:240px;font-size:14px}
.newsletter button{border-radius:50px;border:none;background:var(--gold-500);color:#fff;padding:13px 24px;font-weight:600;cursor:pointer}

/* ---------- Footer ---------- */
footer.site-footer{background:var(--green-900);color:#cfe6dc;padding-top:64px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.1)}
.footer-grid h4{color:#fff;font-size:16px;margin:0 0 18px}
.footer-grid p{font-size:14px;color:#a9c7ba;margin:0 0 16px}
.footer-grid ul li{margin-bottom:10px}
.footer-grid ul li a{font-size:14px;color:#cfe6dc}
.footer-grid ul li a:hover{color:var(--gold-400)}
.social-row{display:flex;gap:10px;margin-top:16px}
.social-row a{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:14px}
.social-row a:hover{background:var(--gold-500)}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;padding:26px 0;flex-wrap:wrap;gap:14px;font-size:13px;color:#a9c7ba}
.pay-icons{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.pay-icons img{height:20px;filter:brightness(0) invert(1);opacity:.75}
.payment-methods{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.payment-methods span{display:inline-flex;padding:6px 9px;border:1px solid rgba(255,255,255,.2);border-radius:7px;background:rgba(255,255,255,.08);color:#fff;font-size:11px;font-weight:700}

/* ---------- WhatsApp float ---------- */
.wa-float{position:fixed;bottom:24px;right:24px;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:80}

/* ---------- Generic content page ---------- */
.prose{max-width:820px;margin:0 auto}
.prose h2{margin-top:36px;font-size:22px}
.prose h3{margin-top:26px;font-size:18px}
.prose p,.prose li{color:var(--muted);font-size:15.5px}
.prose ul{padding-left:20px;list-style:disc}
.prose ol{padding-left:20px}

/* ---------- Pricing ---------- */
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.price-card{background:#fff;border-radius:var(--radius);padding:36px 30px;text-align:center;box-shadow:var(--shadow);border:1px solid var(--border)}
.price-card.featured{border:2px solid var(--gold-500);position:relative;transform:translateY(-10px)}
.price-card .plan-eyebrow{color:var(--gold-500);font-weight:700;font-size:12px;letter-spacing:1px}
.price-card .duration{color:var(--muted);font-size:13.5px;margin:6px 0 14px}
.price-card .amount{font-size:40px;font-weight:700;color:var(--green-900)}
.price-card .per{color:var(--muted);font-size:13px;margin-bottom:22px}
.price-card ul{margin:0 0 26px;text-align:left;display:flex;flex-direction:column;gap:10px}
.price-card ul li{font-size:14px;color:var(--ink);display:flex;gap:8px}
.price-card ul li:before{content:"✓";color:var(--green-700);font-weight:700}

/* ---------- Instructors ---------- */
.instructor-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px}
.instructor-card{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--border);text-align:center}
.instructor-card img{height:260px;width:100%;object-fit:cover}
.instructor-body{padding:22px}
.instructor-body .role{color:var(--gold-500);font-size:12.5px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.instructor-body h4{margin:8px 0 8px;font-size:18px}
.instructor-body p{color:var(--muted);font-size:14px;margin:0 0 14px}

/* ---------- Contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:44px}
.contact-list{display:flex;flex-direction:column;gap:20px;margin:26px 0}
.contact-list li{display:flex;gap:14px;align-items:flex-start;font-size:15px}
.contact-list li .ic{width:40px;height:40px;border-radius:50%;background:var(--cream);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0}

/* ---------- Course detail ---------- */
.course-detail{display:grid;grid-template-columns:1.6fr 1fr;gap:44px}
.course-detail img.hero-img{border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:26px}
.sidebar-card{background:#fff;border-radius:var(--radius);padding:26px;box-shadow:var(--shadow);border:1px solid var(--border);position:sticky;top:110px}
.sidebar-card .price{font-size:30px;font-weight:700;color:var(--green-900);margin-bottom:4px}
.sidebar-card .btn{width:100%;justify-content:center;margin-top:16px}
.sidebar-card ul{margin:20px 0 0;display:flex;flex-direction:column;gap:12px}
.sidebar-card ul li{font-size:14px;display:flex;gap:8px}
.sidebar-card ul li:before{content:"✓";color:var(--green-700);font-weight:700}
.breadcrumb{font-size:13.5px;color:#bcd6cb;margin-bottom:10px}
.breadcrumb a{color:#bcd6cb}
.breadcrumb a:hover{color:var(--gold-400)}

@media(max-width:980px){
  .feature-grid,.pricing-grid,.contact-grid,.course-detail,.split{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  nav.main-nav{display:none}
  .hamburger{display:block}
  .price-card.featured{transform:none}
}
@media(max-width:600px){
  .footer-grid{grid-template-columns:1fr}
  .topbar .container{justify-content:center;text-align:center}
}

/* =========================================================
   Zahra refresh — calm, academic, and conversion-focused
   ========================================================= */
:root{
  --green-950:#062c22;
  --green-900:#0a3b2d;
  --green-800:#0d4f3c;
  --green-700:#176c52;
  --gold-500:#c89532;
  --gold-400:#e5c477;
  --gold-200:#f5ead0;
  --cream:#f8f5ee;
  --paper:#fffdf9;
  --ink:#17211d;
  --muted:#627069;
  --border:#e7e2d8;
  --shadow:0 18px 44px rgba(6,44,34,.10);
  --shadow-soft:0 8px 24px rgba(6,44,34,.07);
}
body{background:var(--cream);color:var(--ink);font-size:16px}
::selection{background:var(--gold-200);color:var(--green-950)}
:focus-visible{outline:3px solid rgba(229,196,119,.9);outline-offset:3px}
.container{max-width:1180px;padding:0 28px}
.topbar{background:var(--green-950);font-size:12.5px;letter-spacing:.1px}
.topbar .container{min-height:38px;height:auto;padding-top:8px;padding-bottom:8px}
.topbar strong{color:#fff}
.topbar .tb-links{gap:16px}
.site-header{box-shadow:0 4px 18px rgba(6,44,34,.04)}
.nav-wrap{height:82px}
.logo{display:flex;align-items:center;min-width:150px}
.logo img{height:56px;object-fit:contain}
nav.main-nav ul{gap:20px}
/* every primary menu entry stays visible on all screen sizes */
nav.main-nav a{font-size:13.5px;letter-spacing:.1px}
nav.main-nav a:hover, nav.main-nav .active>a{color:var(--green-700)}
nav.main-nav .active>a{font-weight:700}
.cta-btn,.btn{min-height:46px;padding:12px 21px;border-radius:10px;background:var(--gold-500);font-size:14px;box-shadow:0 6px 14px rgba(200,149,50,.18)}
.cta-btn:hover,.btn:hover{background:var(--green-800);transform:translateY(-2px);box-shadow:0 8px 18px rgba(6,44,34,.16)}
.btn-outline{background:transparent;border:1px solid rgba(229,196,119,.65);color:var(--gold-400)!important;box-shadow:none}
.btn-outline:hover{background:var(--gold-500);border-color:var(--gold-500)}
.hamburger{color:var(--green-900);width:46px;height:46px;border-radius:10px}

.hero{background:radial-gradient(circle at 85% 18%,rgba(229,196,119,.14),transparent 28%),linear-gradient(124deg,var(--green-950),var(--green-800));padding:82px 0 74px;isolation:isolate}
.hero:before{content:"";position:absolute;inset:0;opacity:.18;background-image:radial-gradient(rgba(255,255,255,.4) 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(90deg,black,transparent 78%);pointer-events:none}
.hero-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);align-items:center;gap:72px}
.hero-copy{position:relative;z-index:1}
.hero .eyebrow{border:1px solid rgba(229,196,119,.26);background:rgba(255,255,255,.07);color:var(--gold-400);font-weight:600;letter-spacing:.8px}
.hero h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(42px,6vw,72px);line-height:1.03;letter-spacing:-2.2px;max-width:760px;margin:0 0 24px}
.hero h1 em{color:var(--gold-400);font-style:normal}
.hero p.lead{font-size:18px;line-height:1.65;max-width:610px;color:#e4efe9;margin-bottom:30px}
.hero-actions{gap:12px}
.hero-note{display:flex;align-items:center;gap:11px;margin-top:28px;color:#dcebe4;font-size:13px;line-height:1.3}
.hero-note small{color:#b5cbc1;font-size:12px}
.note-mark{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:rgba(229,196,119,.16);color:var(--gold-400);font-weight:700}
.hero-art{position:relative;min-height:420px;border:1px solid rgba(255,255,255,.16);border-radius:24px;background:rgba(255,255,255,.94);display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.2)}
.hero-art:after{content:"";position:absolute;inset:14px;border:1px solid rgba(200,149,50,.28);border-radius:17px;pointer-events:none}
.hero-art-glow{position:absolute;width:320px;height:320px;background:rgba(229,196,119,.35);filter:blur(40px);border-radius:50%}
.hero-art img{position:relative;z-index:1;width:min(88%,380px);height:auto;object-fit:contain}
.hero-art-caption{position:absolute;bottom:24px;z-index:2;display:flex;gap:10px;align-items:center;color:var(--green-800);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.1px}
.hero-art-caption span:nth-child(2){color:var(--gold-500);font-size:17px}
.page-hero{background:radial-gradient(circle at 78% 10%,rgba(229,196,119,.16),transparent 24%),linear-gradient(124deg,var(--green-950),var(--green-800));padding:68px 0 60px}
.page-hero h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(36px,5vw,58px);letter-spacing:-1px}
.page-hero p{font-size:17px;line-height:1.65}
.breadcrumb{color:#cce0d6}
section{padding:88px 0}
/* Alternating section tint. Wrapped in :where() so it contributes no
   specificity and can never override a section that has its own background
   (the hero, the page heroes and the dark bands were being flattened to
   cream, which made their white text nearly invisible). */
section:where(:nth-of-type(even)){background:var(--paper)}
.section-head{margin-bottom:42px}
.section-head h2,.prose h2{font-family:Georgia,'Times New Roman',serif;letter-spacing:-.5px}
.section-head h2{font-size:clamp(30px,4vw,44px);line-height:1.15}
.section-head .eyebrow{border:1px solid rgba(200,149,50,.25);background:var(--gold-200);color:var(--green-800);font-weight:700}
.section-head p{line-height:1.7}
.pathways-section{background:var(--paper)}
.pathways-intro{max-width:620px;margin:0 auto 32px;text-align:center}
.pathways-intro h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(29px,4vw,42px);margin:10px 0 12px}
.pathways-intro p{color:var(--muted);line-height:1.7;margin:0}
.pathway-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.pathway-card{min-height:108px;display:flex;align-items:center;gap:15px;padding:20px;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-soft);transition:.2s}
.pathway-card:hover{border-color:rgba(200,149,50,.55);transform:translateY(-3px);box-shadow:var(--shadow)}
.pathway-number{font-family:Georgia,'Times New Roman',serif;font-size:24px;color:var(--gold-500)}
.pathway-card strong{display:block;color:var(--green-900);font-size:15px;margin-bottom:4px}
.pathway-card small{display:block;color:var(--muted);font-size:12.5px;line-height:1.4}
.pathway-arrow{margin-left:auto;color:var(--gold-500);font-size:22px}
.video-frame{margin-top:34px;box-shadow:var(--shadow);border-radius:18px}
.video-frame video{background:var(--green-950);aspect-ratio:16/9;object-fit:cover}
.course-grid{gap:20px}
.course-card,.feature-card,.testi-card,.price-card,.review-cta{border-radius:16px;box-shadow:var(--shadow-soft);background:#fff;border-color:var(--border)}
.course-card:hover{box-shadow:var(--shadow);transform:translateY(-5px)}
.course-thumb{background:var(--green-900)}
.course-thumb img{height:190px;object-fit:cover}
.badge-free{background:var(--green-800);padding:6px 11px;border-radius:7px;letter-spacing:.3px}
.course-body{padding:21px}
.course-body h3{font-size:18px;line-height:1.35}
.course-body h3 a:hover{color:var(--green-700)}
.course-body p{line-height:1.55;min-height:68px}
.course-body .btn{min-height:42px}
.feature-grid{gap:18px}
.feature-card{padding:26px}
.feature-card:hover{border-color:rgba(200,149,50,.38);transform:translateY(-3px)}
.feature-icon{width:48px;height:48px;background:var(--gold-200);border-radius:12px}
.feature-card h4{font-size:17px}
.split{gap:70px}
.split h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(29px,4vw,42px);line-height:1.15}
.split img{max-height:560px;width:100%;object-fit:cover}
.testi-strip{background:linear-gradient(120deg,var(--green-950),var(--green-800));border-radius:18px;padding:34px 36px;box-shadow:var(--shadow)}
.testi-strip .btn-outline{color:var(--gold-400)!important}
.testi-card{padding:24px}
.testi-card p{line-height:1.65}
.testi-person img{border:2px solid var(--gold-200)}
.map-frame{border-radius:16px;box-shadow:var(--shadow-soft)}
.review-cta{padding:36px}
.newsletter{border-radius:18px;padding:42px 46px;background:linear-gradient(120deg,var(--green-800),var(--green-950));box-shadow:var(--shadow)}
.newsletter h3{font-family:Georgia,'Times New Roman',serif;font-size:28px}
.newsletter input{min-height:46px;border-radius:10px;padding:12px 16px}
.newsletter button{min-height:46px;border-radius:10px;background:var(--gold-500)}
footer.site-footer{background:var(--green-950);padding-top:70px}
.footer-grid{gap:50px}
.footer-logo{height:72px;width:auto;margin-bottom:16px}
.footer-grid p{line-height:1.7}
.footer-grid ul li a:hover{color:var(--gold-400)}
.social-row a{border-radius:10px}
.foot-bottom{border-top-color:rgba(255,255,255,.14)}
.pay-icons{display:none}
.wa-float{width:56px;height:56px;right:22px;bottom:22px;border:4px solid var(--cream);font-size:25px;box-shadow:0 10px 28px rgba(0,0,0,.22)}
.prose{max-width:820px;background:#fff;padding:42px 48px;border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow-soft)}
.prose h2:first-child{margin-top:0}
.prose h2{font-size:28px}
.prose h3{color:var(--green-800);font-size:18px}
.prose p,.prose li{line-height:1.75}
.pricing-grid{gap:18px}
.price-card{padding:32px 26px}
.price-card.featured{border:2px solid var(--gold-500);box-shadow:var(--shadow)}
.price-card .amount{font-family:Georgia,'Times New Roman',serif}
.sidebar-card{border-radius:16px;box-shadow:var(--shadow-soft)}
.sidebar-card .price{font-family:Georgia,'Times New Roman',serif;font-size:27px}
.course-detail img.hero-img{max-height:510px;width:100%;object-fit:cover}
.contact-grid{align-items:stretch}
.contact-grid h2{font-family:Georgia,'Times New Roman',serif;font-size:40px;line-height:1.15;margin-top:0}
.muted-intro{color:var(--muted);line-height:1.7}
.instructor-card{border-radius:16px;box-shadow:var(--shadow-soft)}
.instructor-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.instructor-body .role{color:var(--green-700)}

@media(max-width:1080px){
  nav.main-nav ul{gap:14px}
  nav.main-nav a{font-size:12.5px}
  .hero-layout{gap:42px}
}
@media(max-width:980px){
  .hero-layout{grid-template-columns:1fr;gap:40px}
  .hero-art{min-height:340px;max-width:620px;width:100%;margin:0 auto}
  .pathway-grid{grid-template-columns:1fr}
  nav.main-nav{position:absolute;top:82px;left:0;right:0;background:#fff;border-bottom:1px solid var(--border);box-shadow:var(--shadow-soft);padding:12px 28px}
  nav.main-nav.nav-open ul{display:flex;flex-direction:column;align-items:stretch;gap:2px}
  nav.main-nav.nav-open li{display:block}
  nav.main-nav.nav-open a{display:block;padding:12px 10px;border-radius:8px;font-size:15px}
  nav.main-nav.nav-open a:hover{background:var(--cream)}
  nav.main-nav .dropdown{position:static;display:none!important;box-shadow:none;padding:0 0 4px 12px;opacity:1;visibility:visible;transform:none}
  nav.main-nav .has-dropdown:hover .dropdown, nav.main-nav .has-dropdown:focus-within .dropdown{display:block!important}
  .hero h1{font-size:clamp(42px,10vw,64px)}
  .prose{padding:34px 28px}
}
@media(max-width:600px){
  .container{padding:0 18px}
  .topbar .container{padding-left:18px;padding-right:18px}
  .topbar .tb-links{display:none}
  .nav-wrap{height:72px}
  .logo img{height:48px}
  nav.main-nav{top:72px;padding:10px 18px}
  .nav-wrap>.cta-btn{display:none}
  .hero{padding:58px 0 54px}
  .hero h1{letter-spacing:-1.4px;font-size:clamp(38px,12vw,54px)}
  .hero p.lead{font-size:16px}
  .hero-art{min-height:270px;border-radius:18px}
  .hero-art-caption{font-size:9px;letter-spacing:.7px;bottom:14px}
  section{padding:64px 0}
  .section-head{margin-bottom:30px}
  .course-grid{grid-template-columns:1fr}
  .course-thumb img{height:210px}
  .newsletter{padding:30px 22px}
  .newsletter form,.newsletter input,.newsletter button{width:100%}
  .newsletter h3{font-size:25px}
  .footer-grid{gap:28px}
  .footer-logo{height:64px}
  .prose{padding:26px 20px}
  .contact-grid{gap:30px}
  .contact-grid h2{font-size:34px}
  .wa-float{right:16px;bottom:16px;width:52px;height:52px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media(min-width:981px){.hero-layout{grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);gap:48px}}
html,body{overflow-x:hidden}
/* Keep the dropdown from inheriting the horizontal desktop nav layout. */
nav.main-nav>ul{display:flex}
nav.main-nav .dropdown{display:block}
@media(max-width:980px){
  nav.main-nav.nav-open>ul{display:flex}
  nav.main-nav.nav-open .dropdown{display:none!important}
  nav.main-nav.nav-open .has-dropdown:hover .dropdown,
  nav.main-nav.nav-open .has-dropdown:focus-within .dropdown{display:block!important}
}
@media(max-width:600px){
  .hero-art{transform:none;overflow:hidden}
  .wa-float{position:absolute;top:auto;bottom:22px}
}
.hamburger{font-size:0;position:relative}
.hamburger:before{content:"";width:20px;height:14px;display:block;margin:auto;background:linear-gradient(var(--green-900),var(--green-900)) 0 0/20px 2px no-repeat,linear-gradient(var(--green-900),var(--green-900)) 0 6px/20px 2px no-repeat,linear-gradient(var(--green-900),var(--green-900)) 0 12px/20px 2px no-repeat}
@media(max-width:600px){
  .hero-art{height:300px;min-height:0}
  .hero-art img{width:auto;max-width:88%;max-height:238px}
  .wa-float{display:none}
}
@media(max-width:600px){.hero-art-glow{width:220px;height:220px}}
/* Public admission enquiry form */
.enquiry-section{background:#fff}
.public-enquiry{display:grid;grid-template-columns:.8fr 1.2fr;gap:52px;align-items:start;background:var(--paper);border:1px solid var(--border);border-radius:18px;padding:42px;box-shadow:var(--shadow-soft)}
.public-enquiry .section-head h2{margin-top:10px}
.enquiry-form{display:flex;flex-direction:column;gap:14px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.enquiry-form label{font-size:13px;font-weight:700;color:var(--green-800)}
.enquiry-form input,.enquiry-form textarea{margin-top:6px;background:#fff;border:1px solid var(--border);border-radius:9px;padding:12px 13px;font:inherit;color:var(--ink);width:100%}
.enquiry-form textarea{resize:vertical;min-height:125px}
.enquiry-form .cta-btn{align-self:flex-start}
.form-notice{padding:12px 14px;border-radius:9px;font-size:14px;margin-bottom:14px}
.form-notice.success{background:#e7f3ec;color:var(--green-800)}
.form-notice.error{background:#f9e7e5;color:#8c322c}
@media(max-width:800px){.public-enquiry{grid-template-columns:1fr;padding:28px 22px;gap:28px}.form-row{grid-template-columns:1fr}.enquiry-form .cta-btn{width:100%;justify-content:center}}
.location-card{min-height:340px;padding:36px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;background:radial-gradient(circle at 82% 18%,rgba(229,196,119,.3),transparent 27%),linear-gradient(135deg,var(--green-950),var(--green-800));color:#fff;border:0}
.location-card:before{content:"";position:absolute;inset:18px;border:1px solid rgba(229,196,119,.3);border-radius:13px;pointer-events:none}
.location-card>*{position:relative;z-index:1}
.location-card .eyebrow{align-self:flex-start;background:rgba(255,255,255,.1);color:var(--gold-400);margin-bottom:14px}
.location-card h3{font:700 34px/1.1 Georgia,serif;margin:0 0 8px}
.location-card p{color:#d9e8e1;margin:0 0 8px}
.location-card .location-copy{max-width:390px;margin:14px 0 22px;color:#bdd2c8;font-size:14px}
.location-card .btn{align-self:flex-start}
.location-orbit{position:absolute!important;right:42px;top:42px;width:74px;height:74px;border:1px solid rgba(229,196,119,.5);border-radius:50%;display:grid;place-items:center;color:var(--gold-400);font-size:26px}
@media(max-width:600px){.location-card{min-height:260px;padding:28px 22px}.location-card h3{font-size:28px}.location-orbit{right:24px;top:24px;width:56px;height:56px}.location-card .location-copy{max-width:245px}}
.course-category{margin:0 0 8px;color:var(--green-700);font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}
.testi-person span small{display:block;color:var(--muted);font-size:11px;font-weight:400;margin-top:2px}
.course-filters{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:12px;padding:14px;background:var(--paper);border:1px solid var(--border);border-radius:12px;margin:0 0 24px}
.course-filters input,.course-filters select{margin:0;min-height:44px}
.course-empty{display:none;padding:28px;text-align:center;color:var(--muted);border:1px dashed var(--border);border-radius:12px;grid-column:1/-1}
@media(max-width:700px){.course-filters{grid-template-columns:1fr}}
.appointment-section{background:var(--cream)}
.appointment-card{display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;align-items:start;background:linear-gradient(135deg,var(--green-950),var(--green-800));color:#fff;border-radius:18px;padding:42px;box-shadow:var(--shadow)}
.appointment-card .section-head{text-align:left;margin:0}.appointment-card .section-head h2{color:#fff}.appointment-card .section-head p{color:#c9ddd4}.appointment-card .eyebrow{background:rgba(255,255,255,.1);color:var(--gold-400)}
.appointment-form{display:flex;flex-direction:column;gap:14px}.appointment-form label{color:#e4efe9}.appointment-form input,.appointment-form select,.appointment-form textarea{background:rgba(255,255,255,.98);border:0}.appointment-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.appointment-form .cta-btn{align-self:flex-start}
@media(max-width:800px){.appointment-card{grid-template-columns:1fr;padding:28px 22px;gap:26px}.appointment-form .form-row{grid-template-columns:1fr}.appointment-form .cta-btn{width:100%;justify-content:center}}

.announcement-strip{background:#f5ead0;border-bottom:1px solid #e4c887}.announcement-strip article{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 0}.announcement-strip .eyebrow{margin:0 0 4px;color:#83621f}.announcement-strip strong{display:block;color:var(--green);font:700 20px Georgia,serif}.announcement-strip p{margin:4px 0 0;color:#4a5a52;font-size:14px}.announcement-strip .btn{flex:0 0 auto}.announcement-strip .btn-outline{color:#6b4f0e!important;border-color:rgba(107,79,14,.55)}@media(max-width:700px){.announcement-strip article{align-items:flex-start;flex-direction:column;gap:12px}.announcement-strip .btn{width:100%;justify-content:center}}
.related-courses{background:#fff}.related-courses .course-grid{margin-top:22px}.related-courses .course-card{height:100%}

html[dir="rtl"] body{font-family:"Noto Sans Arabic",Arial,sans-serif}html[dir="rtl"] .main-nav ul,html[dir="rtl"] .nav-wrap,html[dir="rtl"] .hero-layout,html[dir="rtl"] .footer-grid{direction:rtl}html[dir="rtl"] .hero-copy,html[dir="rtl"] .section-head,html[dir="rtl"] .course-body{text-align:right}

/* =========================================================
   v39 — unified menu, WhatsApp channel strip, payment icons
   ========================================================= */

/* ---------- "More" dropdown ---------- */
.dropdown{min-width:258px;max-height:min(74vh,540px);overflow-y:auto;overscroll-behavior:contain}
.dropdown .dd-head{padding:12px 12px 5px;margin-top:4px;font-size:10px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--border)}
.dropdown .dd-head:first-child{margin-top:0;padding-top:6px;border-top:0}

/* ---------- Footer: WhatsApp channel button ---------- */
.footer-channel{display:inline-flex;align-items:center;gap:9px;margin-top:18px;padding:10px 16px;border-radius:10px;background:rgba(37,211,102,.14);border:1px solid rgba(37,211,102,.4);color:#d9f7e6;font-size:13.5px;font-weight:700;transition:.18s}
.footer-channel:hover{background:rgba(37,211,102,.26);color:#fff}
.footer-channel-svg{width:18px;height:18px;color:#25d366}

/* ---------- Footer bottom: legal links + payment icon layer ---------- */
.foot-bottom{display:block;padding:24px 0 26px}
.foot-bottom-row{display:flex;align-items:center;justify-content:space-between;gap:14px 22px;flex-wrap:wrap;font-size:13px;color:#a9c7ba}
.foot-copy strong{color:#e6f2ec}
.foot-legal{display:flex;flex-wrap:wrap;gap:6px 18px}
.foot-legal a{font-size:12.5px;color:#a9c7ba}
.foot-legal a:hover{color:var(--gold-400)}
.pay-strip{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12)}
.pay-strip-title{font-size:10.5px;font-weight:800;letter-spacing:1.3px;text-transform:uppercase;color:#8fb3a5;white-space:nowrap}
.pay-icons{display:flex;align-items:center;gap:9px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.pay-icon{display:flex;align-items:center;justify-content:center;width:54px;height:34px;border-radius:6px;background:#fff;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.24)}
.pay-icon svg{display:block;width:100%;height:100%}
.pay-icon-text{width:auto;height:34px;padding:0 12px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#dcebe4;font-size:11.5px;font-weight:700;box-shadow:none;white-space:nowrap}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.wa-float-svg{width:27px;height:27px}

/* ---------- Responsive menu ---------- */
@media(max-width:1080px){
  nav.main-nav ul{gap:15px}
  .nav-btn{padding:9px 12px;font-size:12.5px}
}
@media(max-width:980px){
  nav.main-nav{max-height:calc(100vh - 118px);overflow-y:auto}
  nav.main-nav.nav-open .nav-cta{display:block}
  nav.main-nav.nav-open .nav-cta .nav-btn{width:100%;min-height:46px;font-size:15px;justify-content:center}
  nav.main-nav.nav-open .has-dropdown.open .dropdown{display:block!important}
  nav.main-nav.nav-open .dropdown .dd-head{display:block;padding:12px 10px 4px}
  nav.main-nav.nav-open .dropdown li a{padding:11px 10px;font-size:14.5px}
}
@media(max-width:600px){
  .nav-actions{gap:8px}
  .nav-admission{display:none}
  .pay-strip{gap:10px}
  .pay-strip-title{flex:1 1 100%}
  .pay-icon{width:48px;height:31px}
  .foot-bottom-row{justify-content:flex-start}
}
.policy-meta{margin-top:30px;padding-top:16px;border-top:1px solid var(--border);font-size:13px;color:var(--muted)}
.contact-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.contact-actions .cta-btn{margin-top:0}
@media(max-width:600px){.contact-actions .cta-btn,.contact-actions .btn{width:100%;justify-content:center}}

/* =========================================================
   v40 — header rebuild + site-wide visual polish
   ========================================================= */

/* ---------- Sticky header shell ---------- */
.site-header{position:sticky;top:0;z-index:60;background:#fff;border-bottom:1px solid var(--border);box-shadow:0 6px 24px rgba(6,44,34,.06)}
body{padding-top:0}

/* ---------- Utility bar ---------- */
.topbar{background:var(--green-950);color:#cfe6dc;font-size:12.5px;letter-spacing:.1px}
.topbar .container{height:auto;min-height:42px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:7px;padding-bottom:7px;flex-wrap:nowrap}
.tb-contact{display:flex;align-items:center;gap:20px;min-width:0}
.tb-contact a{display:inline-flex;align-items:center;gap:7px;color:#cfe6dc;white-space:nowrap;opacity:1}
.tb-contact a:hover{color:var(--gold-400)}
.tb-ic{font-size:11.5px;opacity:.8}
.tb-links{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.tb-social{width:27px;height:27px;display:grid;place-items:center;border-radius:8px;background:rgba(255,255,255,.08);color:#cfe6dc;font-size:11px;font-weight:700;line-height:1}
.tb-social:hover{background:var(--gold-500);color:#fff}
.tb-channel{display:inline-flex;align-items:center;gap:7px;padding:6px 13px;border-radius:999px;background:rgba(37,211,102,.16);border:1px solid rgba(37,211,102,.42);color:#cdf3e0;font-weight:700;font-size:12px;white-space:nowrap}
.tb-channel-svg{width:14px;height:14px;color:#25d366;flex:0 0 auto}
.tb-channel:hover{background:rgba(37,211,102,.32);color:#fff}
.tb-cta{display:inline-flex;align-items:center;min-height:32px;padding:7px 16px;border-radius:999px;background:var(--gold-500);color:#fff;font-weight:800;font-size:12.5px;white-space:nowrap;box-shadow:0 4px 14px rgba(200,149,50,.3)}
.tb-cta:hover{background:var(--gold-400);color:var(--green-950)}

/* ---------- Masthead row ---------- */
.nav-wrap{display:flex;align-items:center;gap:20px;height:auto;min-height:80px;padding-top:12px;padding-bottom:12px;flex-wrap:nowrap}
.nav-wrap .logo{flex:0 0 auto;min-width:0;display:flex;align-items:center}
.nav-wrap .logo img{height:52px;width:auto;object-fit:contain}
.nav-actions{display:none;align-items:center;gap:10px;flex:0 0 auto}
.hamburger{display:none;align-items:center;justify-content:center;flex:0 0 auto}

/* ---------- Desktop navigation ---------- */
nav.main-nav{flex:1 1 auto;display:flex;justify-content:flex-end;min-width:0}
nav.main-nav>ul{display:flex;align-items:center;gap:20px;flex-wrap:nowrap}
nav.main-nav .nav-item{flex:0 0 auto}
nav.main-nav .nav-item>a{position:relative;display:inline-flex;align-items:center;gap:6px;padding:10px 2px;font-weight:600;font-size:14px;letter-spacing:.1px;color:var(--ink);white-space:nowrap}
nav.main-nav .nav-item>a:after{content:"";position:absolute;left:0;right:0;bottom:4px;height:2px;border-radius:2px;background:var(--gold-500);transform:scaleX(0);transform-origin:left center;transition:transform .22s ease}
nav.main-nav .nav-item>a:hover{color:var(--green-700)}
nav.main-nav .nav-item>a:hover:after,nav.main-nav .nav-item.active>a:after{transform:scaleX(1)}
nav.main-nav .nav-item.active>a{color:var(--green-700);font-weight:700}
nav.main-nav li.has-dropdown{margin-right:auto}
nav.main-nav .nav-cta{flex:0 0 auto}
nav.main-nav .nav-btn{min-height:44px}
nav.main-nav .dropdown-toggle .caret{font-size:9px;opacity:.7}
.nav-close{display:none}

/* ---------- Site-wide polish ---------- */
.btn,.cta-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;letter-spacing:.1px;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease}
.btn:active,.cta-btn:active{transform:translateY(0) scale(.985)}
.btn-outline{background:transparent}
.section-head h2,.prose h2,.hero h1{text-wrap:balance}
.section-head p,.hero p.lead{text-wrap:pretty}
.feature-card,.course-card,.testi-card,.price-card,.instructor-card,.pathway-card{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.course-card:hover,.feature-card:hover,.price-card:hover,.pathway-card:hover{transform:translateY(-5px)}
.course-card,.feature-card,.testi-card,.instructor-card{overflow:hidden}
.course-thumb img,.instructor-card img{aspect-ratio:16/10;object-fit:cover;width:100%}
.prose ul,.prose ol{padding-left:22px}
.prose li{margin-bottom:8px}
.prose a{color:var(--green-700);font-weight:600;text-decoration:underline;text-decoration-color:rgba(23,108,82,.35);text-underline-offset:3px}
.prose a:hover{color:var(--gold-500);text-decoration-color:currentColor}
.prose h3{margin-top:30px}
.prose p{font-size:15.5px;line-height:1.8}
input,select,textarea{font:inherit}
input:focus,select:focus,textarea:focus{border-color:var(--green-700);outline:0;box-shadow:0 0 0 3px rgba(23,108,82,.14)}
.site-footer{padding-top:0}
.footer-grid h4{letter-spacing:.2px}
.footer-grid ul li a{transition:color .16s ease,padding-left .16s ease}
.footer-grid ul li a:hover{padding-left:3px}
.footer-logo{height:60px;width:auto;object-fit:contain}
.wa-float{transition:transform .2s ease,box-shadow .2s ease}
.wa-float:hover{transform:translateY(-3px) scale(1.04)}
html{scroll-padding-top:150px}

/* ---------- WhatsApp Channel strip ---------- */
.wa-channel{background:linear-gradient(90deg,#e9f9f0,#f4fbf7);border-bottom:1px solid #d7efe2}
.wa-channel-inner{display:flex;align-items:center;gap:13px;padding:10px 28px;flex-wrap:nowrap}
.wa-channel-badge{flex:0 0 auto;display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:#25d366;color:#fff;box-shadow:0 4px 12px rgba(37,211,102,.32)}
.wa-channel-svg{width:19px;height:19px}
.wa-channel-text{margin:0;flex:1 1 auto;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.wa-channel-text strong{font-size:13.5px;color:var(--green-950);font-weight:800}
.wa-channel-text span{font-size:12.5px;color:#4a6b5e}
.wa-channel-btn{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:9px 17px;border-radius:999px;background:var(--green-700);color:#fff;font-weight:700;font-size:13px;white-space:nowrap;box-shadow:0 5px 14px rgba(23,108,82,.24)}
.wa-channel-btn:hover{background:var(--green-950);color:#fff}
.wa-channel-close{flex:0 0 auto;width:30px;height:30px;border:0;border-radius:50%;background:rgba(11,61,46,.07);color:#406456;font-size:17px;line-height:1;cursor:pointer}
.wa-channel-close:hover{background:rgba(11,61,46,.14)}

/* ---------- Responsive header ---------- */
@media(max-width:1360px){
  nav.main-nav>ul{gap:15px}
  nav.main-nav .nav-item>a{font-size:13.5px}
}
@media(min-width:1181px){
  .main-nav .has-dropdown:hover .dropdown,.main-nav .has-dropdown.open .dropdown{opacity:1;visibility:visible;transform:translateY(0)}
}
@media(max-width:1180px){
  .tb-cta{display:none}
  .tb-social{display:none}
  .nav-actions{display:flex}
  .nav-admission{display:inline-flex}
  .hamburger{display:flex;color:var(--green-900);width:46px;height:46px;border-radius:12px;background:var(--cream);border:1px solid var(--border)}
  .hamburger:hover{background:var(--green-950);border-color:var(--green-950)}
  .hamburger:hover:before{background:linear-gradient(#fff,#fff) 0 0/20px 2px no-repeat,linear-gradient(#fff,#fff) 0 6px/20px 2px no-repeat,linear-gradient(#fff,#fff) 0 12px/20px 2px no-repeat}
  .nav-wrap{min-height:72px;padding-top:10px;padding-bottom:10px;gap:12px}
  .nav-wrap .logo img{height:46px}
  nav.main-nav{position:absolute;top:100%;left:0;right:0;display:none;flex:none;background:#fff;border-top:1px solid var(--border);border-bottom:1px solid var(--border);box-shadow:0 22px 44px rgba(6,44,34,.16);max-height:calc(100vh - 130px);overflow-y:auto;overscroll-behavior:contain;padding:10px 0 18px}
  nav.main-nav.nav-open{display:block}
  nav.main-nav>ul{display:flex;flex-direction:column;align-items:stretch;gap:2px;padding:0 22px}
  nav.main-nav li.has-dropdown{margin-right:0}
  nav.main-nav .nav-item>a{padding:13px 12px;font-size:15.5px;border-radius:10px}
  nav.main-nav .nav-item>a:after{display:none}
  nav.main-nav .nav-item>a:hover{background:var(--cream)}
  nav.main-nav .nav-cta{order:-1;margin-top:8px}
  nav.main-nav .nav-cta .nav-btn{width:100%;justify-content:center;min-height:48px;font-size:15px}
  nav.main-nav .nav-cta+.nav-cta{margin-top:0}
  nav.main-nav .dropdown{position:static;display:none!important;opacity:1;visibility:visible;transform:none;box-shadow:none;max-height:none;min-width:0;border-radius:0;padding:0 0 8px 14px;background:transparent}
  nav.main-nav .has-dropdown:hover .dropdown{display:none!important}
  nav.main-nav .has-dropdown.open .dropdown{display:block!important}
  nav.main-nav .dropdown .dd-head{padding:12px 12px 5px}
  nav.main-nav .dropdown li a{padding:11px 12px;font-size:14.5px}
  .nav-close{display:grid;place-items:center;position:absolute;top:12px;right:20px;width:36px;height:36px;border:1px solid var(--border);border-radius:50%;background:#fff;color:var(--green-900);font-size:20px;line-height:1;cursor:pointer;z-index:2}
  .nav-close:hover{background:var(--cream)}
  .wa-float{display:flex;position:fixed;right:16px;bottom:16px;width:54px;height:54px}
  html{scroll-padding-top:110px}
}
@media(max-width:900px){
  .tb-contact a:nth-child(2){display:none}
}
@media(max-width:700px){
  /* the utility bar keeps the phone number and the language switch;
     the channel link lives in the strip directly below */
  .topbar .tb-links{display:flex;gap:8px}
  .tb-social,.tb-channel,.tb-cta{display:none}
  .tb-contact{display:flex}
  .tb-contact a:nth-child(2){display:none}
  .topbar .container{justify-content:space-between;gap:10px}
  .wa-channel-inner{flex-wrap:nowrap;gap:10px;padding:9px 16px}
  .wa-channel-text span{display:none}
  .wa-channel-text strong{font-size:12.5px}
  .wa-channel-btn{min-height:34px;padding:8px 12px;font-size:12px;flex:0 0 auto}
  .wa-channel-close{width:28px;height:28px;font-size:15px}
}
@media(max-width:480px){
  .tb-channel{padding:6px 10px;font-size:11.5px}
  .tb-channel-svg{width:13px;height:13px}
  .nav-wrap .logo img{height:42px}
  .nav-admission{min-height:40px;padding:9px 13px;font-size:12.5px}
  .wa-channel-badge{width:30px;height:30px;border-radius:9px}
  .wa-channel-btn span{display:none}
}

/* ---------- Compact sticky header after scrolling ---------- */
.site-header.is-scrolled{box-shadow:0 8px 26px rgba(6,44,34,.1)}
.site-header.is-scrolled .topbar{display:none}
.site-header.is-scrolled .nav-wrap{min-height:64px;padding-top:8px;padding-bottom:8px}
.site-header.is-scrolled .nav-wrap .logo img{height:42px}
.site-header.is-scrolled nav.main-nav .nav-item>a{padding-top:6px;padding-bottom:6px}
.site-header.is-scrolled nav.main-nav .nav-btn{min-height:40px}
@media(max-width:1180px){
  .site-header.is-scrolled .nav-wrap{min-height:60px}
  .site-header.is-scrolled .nav-wrap .logo img{height:38px}
}

/* =========================================================
   v40b — section rhythm, cards, hero art and footer polish
   ========================================================= */

/* ---------- Inner-page hero, matched to the homepage hero ---------- */
.page-hero{position:relative;overflow:hidden;padding:62px 0 56px;background:radial-gradient(circle at 78% 8%,rgba(229,196,119,.2),transparent 26%),linear-gradient(124deg,var(--green-950),var(--green-800))}
.page-hero:before{content:"";position:absolute;inset:0;opacity:.16;background-image:radial-gradient(rgba(255,255,255,.45) 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(90deg,black,transparent 78%);pointer-events:none}
.page-hero>.container{position:relative;z-index:1}
.page-hero h1{letter-spacing:-.8px;margin-bottom:10px}
.page-hero p{max-width:680px;color:#d8e9e1}
.page-hero .eyebrow{background:rgba(255,255,255,.1);color:var(--gold-400)}

/* ---------- Consistent vertical rhythm ---------- */
section{padding:76px 0}
.section-head{margin-bottom:40px}
.section-head h2{letter-spacing:-.6px}
.section-head p{line-height:1.7}
.grid-nav{margin-top:44px}
.grid-nav .btn+.btn,.grid-nav .cta-btn+.btn{margin-left:10px}
@media(max-width:600px){
  section{padding:54px 0}
  .section-head{margin-bottom:30px}
  .grid-nav .btn,.grid-nav .cta-btn{width:100%;justify-content:center;margin:8px 0 0!important}
}

/* ---------- Course & feature cards ---------- */
.course-card{border-radius:18px;box-shadow:var(--shadow-soft)}
.course-card:hover{border-color:rgba(200,149,50,.5);box-shadow:0 24px 48px rgba(6,44,34,.14)}
.course-thumb{overflow:hidden}
.course-thumb img{transition:transform .55s cubic-bezier(.2,.7,.3,1)}
.course-card:hover .course-thumb img{transform:scale(1.05)}
.badge-free{top:12px;left:12px;font-size:10.5px;font-weight:800;letter-spacing:.9px;text-transform:uppercase;padding:6px 12px;box-shadow:0 6px 16px rgba(6,44,34,.22)}
.course-body{padding:22px 22px 24px}
.course-body h3{font-size:18.5px;line-height:1.32}
.course-category{letter-spacing:1.1px}
.feature-card{border-radius:16px;box-shadow:var(--shadow-soft)}
.feature-card:hover{border-color:rgba(200,149,50,.42)}
.feature-icon{font-size:25px;line-height:1}
.testi-card{border-radius:16px;box-shadow:var(--shadow-soft);display:flex;flex-direction:column}
.testi-card p{flex:1 1 auto}
.testi-card:hover{border-color:rgba(200,149,50,.42)}
.price-card{border-radius:18px}
.course-filters{border-radius:14px;box-shadow:var(--shadow-soft)}
.course-filters input,.course-filters select{background:#fff;border:1px solid var(--border);border-radius:10px;padding:0 13px;color:var(--ink)}
.course-detail{align-items:start}

/* ---------- Hero artwork panel ---------- */
.hero-art{background:linear-gradient(160deg,#fffdf9,#f3efe3);transform:none}
.hero-art img{filter:drop-shadow(0 18px 30px rgba(6,44,34,.14))}
.hero-art-caption{background:rgba(255,255,255,.82);border:1px solid rgba(200,149,50,.3);border-radius:999px;padding:7px 16px;backdrop-filter:blur(6px)}
@media(max-width:600px){.hero-art-caption{padding:6px 12px}}

/* ---------- Footer ---------- */
.site-footer{padding:70px 0 0}
.footer-grid{gap:46px;padding-bottom:48px}
.footer-grid h4{font-size:15px;letter-spacing:.3px;margin-bottom:16px}
.footer-grid p{line-height:1.75}
.footer-channel{margin-top:20px}
.foot-bottom{padding:26px 0 30px}
.foot-legal a{position:relative}
.newsletter{border-radius:20px;box-shadow:0 24px 56px rgba(6,44,34,.16)}
@media(max-width:980px){.footer-grid{gap:36px}}

/* ---------- Policy / prose pages ---------- */
.prose{border-radius:20px}
.prose h2{font-size:27px;letter-spacing:-.4px}
.prose h2:first-child+p{margin-top:0}
.prose h3:before{content:"";display:block;width:34px;height:3px;border-radius:3px;background:var(--gold-500);opacity:.55;margin-bottom:10px}
.policy-meta{font-style:italic}
@media(max-width:600px){.prose h2{font-size:23px}.prose h3:before{width:26px;height:2px}}

/* ---------- Forms ---------- */
.enquiry-form input,.enquiry-form textarea,.appointment-form input,.appointment-form textarea,.appointment-form select{transition:box-shadow .18s ease,border-color .18s ease}
.contact-list li{display:flex;align-items:flex-start;gap:10px}
.contact-list .ic{flex:0 0 auto}

/* ---------- Reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  .course-thumb img,.course-card,.feature-card,.btn,.cta-btn,.wa-float{transition:none!important}
  .course-card:hover,.feature-card:hover,.price-card:hover,.pathway-card:hover{transform:none}
}

/* Keep the desktop "More" dropdown inside the page container */
@media(min-width:1181px){
  nav.main-nav .dropdown{left:auto;right:0}
}

/* =========================================================
   v41 — menu row alignment, Online Classes button,
          wider payment method icon row
   ========================================================= */

/* ---------- Every menu entry shares one box height ---------- */
nav.main-nav>ul{align-items:center;gap:18px}
nav.main-nav .nav-item{display:flex;align-items:center;height:44px}
nav.main-nav .nav-item>a{height:44px;min-height:44px;padding:0 2px;display:inline-flex;align-items:center;line-height:1;letter-spacing:.1px}
nav.main-nav .nav-item>a:after{bottom:7px;height:2px}
nav.main-nav .nav-item>a .caret{position:relative;top:1px}
nav.main-nav .nav-btn{height:44px;min-height:44px;padding:0 16px;line-height:1}
nav.main-nav .nav-cta{display:flex;align-items:center;height:44px}

/* ---------- Online Classes button ---------- */
.nav-btn-live{background:var(--green-800);color:#fff;gap:9px;box-shadow:0 6px 16px rgba(13,79,60,.24)}
.nav-btn-live:hover{background:var(--green-950);color:#fff;transform:translateY(-2px);box-shadow:0 9px 20px rgba(6,44,34,.26)}
.live-dot{flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:#ff5f5f;box-shadow:0 0 0 3px rgba(255,95,95,.28)}
@media(prefers-reduced-motion:no-preference){
  .live-dot{animation:zahraLivePulse 2.2s ease-in-out infinite}
}
@keyframes zahraLivePulse{0%,100%{box-shadow:0 0 0 3px rgba(255,95,95,.28)}50%{box-shadow:0 0 0 6px rgba(255,95,95,.06)}}

/* ---------- Payment method icons ---------- */
.pay-strip{gap:16px}
.pay-icons{gap:8px}
.pay-icon{width:56px;height:35px;border-radius:7px;border:1px solid rgba(255,255,255,.14)}
.pay-icon-text{width:auto;height:35px}
@media(max-width:900px){.pay-icon{width:52px;height:33px}}
@media(max-width:600px){
  .pay-strip{gap:12px}
  .pay-icons{gap:7px}
  .pay-icon{width:47px;height:30px;border-radius:6px}
  .pay-icon-text{height:30px;padding:0 10px;font-size:11px}
}

/* ---------- Mobile menu: three stacked action buttons ---------- */
@media(max-width:1180px){
  nav.main-nav .nav-cta{display:block;height:auto}
  nav.main-nav .nav-cta .nav-btn{height:48px;min-height:48px}
  nav.main-nav .nav-item{height:auto}
  nav.main-nav .nav-item>a{height:auto;min-height:0;padding:13px 12px;line-height:1.3}
}

/* =========================================================
   v42 — menu action buttons restored, Trustpilot review
          presence, and header polish
   ========================================================= */

/* ---------- Menu action buttons ------------------------------------------
   The three menu actions (Online Classes, Student Login, Admin Login) share
   one button system so they read as a single, deliberate group.
   ------------------------------------------------------------------------ */
nav.main-nav .nav-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:44px;min-height:44px;padding:0 19px;box-sizing:border-box;
  border-radius:999px;border:1.5px solid transparent;
  font-size:13.5px;font-weight:700;line-height:1;letter-spacing:.15px;
  text-decoration:none;white-space:nowrap;cursor:pointer;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
nav.main-nav .nav-btn:focus-visible{outline:2.5px solid var(--gold-500);outline-offset:2px}

/* Live classes — the primary menu action */
nav.main-nav .nav-btn-live{
  background:linear-gradient(135deg,var(--green-700) 0%,var(--green-800) 62%,var(--green-950) 100%);
  color:#fff;box-shadow:0 6px 16px rgba(13,79,60,.26);
}
nav.main-nav .nav-btn-live:hover{
  background:linear-gradient(135deg,var(--green-800) 0%,var(--green-950) 100%);
  color:#fff;transform:translateY(-2px);box-shadow:0 10px 22px rgba(6,44,34,.3);
}
.live-dot{flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:#ff5f5f;box-shadow:0 0 0 3px rgba(255,95,95,.3)}
.nav-btn-live .live-dot{background:#ff8080;box-shadow:0 0 0 3px rgba(255,128,128,.28)}

/* Student portal — the gold menu action */
nav.main-nav .nav-btn-gold{
  background:linear-gradient(135deg,#d5a03a 0%,#b9862b 55%,#9d7020 100%);
  color:#fff;box-shadow:0 6px 16px rgba(200,149,50,.26);
}
nav.main-nav .nav-btn-gold:hover{
  background:linear-gradient(135deg,#b9862b 0%,#9d7020 100%);
  color:#fff;transform:translateY(-2px);box-shadow:0 10px 22px rgba(157,112,32,.3);
}

/* Admin portal — the quiet secondary action */
nav.main-nav .nav-btn-outline{
  background:#fff;color:var(--green-800);border-color:rgba(13,79,60,.24);
  box-shadow:0 2px 8px rgba(6,44,34,.05);
}
nav.main-nav .nav-btn-outline:hover{
  background:var(--green-800);border-color:var(--green-800);color:#fff;
  transform:translateY(-2px);box-shadow:0 9px 20px rgba(6,44,34,.2);
}

/* A hairline separator between the menu links and the action buttons */
nav.main-nav .nav-item + .nav-cta{position:relative;margin-left:2px;padding-left:16px}
nav.main-nav .nav-item + .nav-cta:before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:1px;height:26px;
  background:linear-gradient(rgba(6,44,34,0),rgba(6,44,34,.22),rgba(6,44,34,0));
}
/* The header container is capped at 1180px, so the menu must fit that width
   on every desktop size. Tighten the rhythm just enough to keep the full
   menu, the separator and all three actions on one calm line. */
@media(min-width:1181px){
  nav.main-nav>ul{gap:14px}
  nav.main-nav .nav-item>a{font-size:13.5px}
  nav.main-nav .nav-btn{padding:0 15px;gap:7px}
}
@media(max-width:1180px){
  nav.main-nav>ul{align-items:stretch;gap:2px}
  nav.main-nav .nav-cta{width:100%}
  nav.main-nav .nav-item + .nav-cta{margin-left:0;padding-left:0}
  nav.main-nav .nav-item + .nav-cta:before{display:none}
  nav.main-nav .nav-cta .nav-btn{width:100%;justify-content:center;border-radius:12px}
}
/* Keep the group compact while the header is in its scrolled state */
.site-header.is-scrolled nav.main-nav .nav-btn{height:40px;min-height:40px;padding:0 16px}

/* =========================================================
   Trustpilot review presence
   ========================================================= */
:root{--tp-green:#00b67a;--tp-green-dark:#009a68;--tp-ink:#191919}

.tp-stars{display:inline-flex;align-items:center;gap:2px;line-height:0;flex:0 0 auto}
.tp-tile{display:block;border-radius:2.5px}
.tp-logo{display:inline-flex;align-items:center;gap:7px;line-height:1;flex:0 0 auto}
.tp-logo-star{display:block;border-radius:3px}
.tp-logo-word{font-weight:800;font-size:15px;letter-spacing:-.3px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}

/* ---------- Utility-bar chip ---------- */
.tp-chip{
  display:inline-flex;align-items:center;gap:7px;padding:5px 11px 5px 9px;
  border-radius:999px;background:rgba(0,182,122,.14);border:1px solid rgba(0,182,122,.4);
  color:#d8f5e9;font-size:12px;font-weight:700;white-space:nowrap;line-height:1;
}
.tp-chip:hover{background:rgba(0,182,122,.3);border-color:rgba(0,182,122,.7);color:#fff}
.tp-chip-text strong{color:#fff;font-weight:800}
.tp-chip .tp-tile{box-shadow:0 1px 2px rgba(0,0,0,.18)}

/* ---------- Slim trust rail under the masthead ---------- */
.tp-strip{background:linear-gradient(90deg,#f1faf6 0%,#fbfefd 52%,#f4fbf7 100%);border-bottom:1px solid #ddf0e7}
.tp-strip-inner{display:flex;align-items:center;gap:16px;min-height:46px;padding:8px 28px;flex-wrap:nowrap}
.tp-strip-logo{padding-right:16px;border-right:1px solid rgba(6,44,34,.1)}
.tp-strip-stars{flex:0 0 auto}
.tp-strip-copy{display:flex;flex-direction:column;line-height:1.28;min-width:0;flex:1 1 auto}
.tp-strip-copy strong{font-size:13.5px;font-weight:800;color:var(--green-950)}
.tp-strip-copy small{font-size:12px;color:#4f6f62}
.tp-strip-btn{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:8px 16px;
  border-radius:999px;background:var(--tp-green);color:#fff;font-weight:800;font-size:12.5px;
  white-space:nowrap;box-shadow:0 5px 14px rgba(0,182,122,.26);transition:.2s;
}
.tp-strip-btn:hover{background:var(--tp-green-dark);color:#fff;transform:translateY(-1px);box-shadow:0 8px 18px rgba(0,182,122,.3)}
.site-header.is-scrolled .tp-strip{display:none}

/* ---------- Hero badge ---------- */
.tp-hero-badge{
  display:inline-flex;align-items:center;gap:13px;margin-top:26px;padding:11px 18px 11px 14px;
  border-radius:14px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(3px);max-width:100%;transition:.2s;
}
.tp-hero-badge:hover{background:rgba(255,255,255,.15);border-color:rgba(229,196,119,.5);transform:translateY(-2px)}
.tp-hero-stars{display:flex;flex:0 0 auto}
.tp-hero-copy{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.tp-hero-copy strong{color:#fff;font-size:13.5px;font-weight:800}
.tp-hero-copy small{color:#c9e3d8;font-size:12px}
.tp-hero-badge .tp-tile{box-shadow:0 1px 3px rgba(0,0,0,.28)}

/* ---------- Homepage review panel ---------- */
.tp-card{
  position:relative;display:grid;grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr);gap:0;
  background:var(--paper);border:1px solid var(--border);border-radius:20px;overflow:hidden;
  box-shadow:var(--shadow-soft);
}
.tp-card-top{
  display:flex;flex-direction:column;justify-content:center;gap:18px;padding:38px 34px;
  background:linear-gradient(150deg,var(--green-950),var(--green-800));color:#fff;position:relative;
}
.tp-card-top:after{
  content:"";position:absolute;inset:0;opacity:.22;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.5) 1px,transparent 1px);background-size:20px 20px;
  mask-image:linear-gradient(160deg,black,transparent 72%);
}
.tp-card-logo{position:relative;z-index:1}
.tp-card-logo .tp-logo-word{color:#fff;font-size:17px}
.tp-card-score{position:relative;z-index:1;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.tp-score-number{font-family:Georgia,'Times New Roman',serif;font-size:56px;line-height:1;color:#fff;font-weight:700}
.tp-score-word{font-size:36px;letter-spacing:-.6px}
.tp-score-meta{font-size:12.5px;color:#c2ded2}
.tp-card-body{padding:38px 36px;display:flex;flex-direction:column;justify-content:center;gap:16px}
.tp-card-body h3{font-size:clamp(21px,2.4vw,27px);margin:0;color:var(--green-950);letter-spacing:-.4px}
.tp-card-body p{margin:0;color:var(--muted);font-size:15px;line-height:1.68}
.tp-card-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
.tp-card-ribbon{
  position:absolute;top:-14px;right:-14px;width:96px;height:96px;display:grid;place-items:center;
  background:var(--tp-green);color:#fff;font-size:30px;border-radius:50%;opacity:.14;pointer-events:none;
}
.tp-card-note{
  position:absolute;bottom:14px;right:20px;margin:0;font-size:11.5px;color:var(--muted);letter-spacing:.2px;
}
.tp-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 22px;
  border-radius:999px;font-size:14px;font-weight:800;line-height:1;white-space:nowrap;
  transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease;
}
.tp-btn-solid{background:var(--tp-green);color:#fff;box-shadow:0 8px 20px rgba(0,182,122,.3)}
.tp-btn-solid:hover{background:var(--tp-green-dark);color:#fff;transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,182,122,.34)}
.tp-btn-solid .tp-logo-word{font-size:14px}
.tp-btn-ghost{background:transparent;color:var(--green-800);border:1.5px solid rgba(13,79,60,.24)}
.tp-btn-ghost:hover{background:var(--green-800);border-color:var(--green-800);color:#fff;transform:translateY(-2px)}

/* ---------- Inner-page review band ---------- */
.tp-cta-band{background:linear-gradient(120deg,#f4fbf7,#eef8f3);border-top:1px solid #ddf0e7;padding:40px 0}
.tp-cta-inner{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.tp-cta-left{display:flex;flex-direction:column;gap:10px;flex:0 0 auto;padding-right:26px;border-right:1px solid rgba(6,44,34,.1)}
.tp-cta-copy{flex:1 1 320px;min-width:0}
.tp-cta-copy h2{font-size:clamp(20px,2.3vw,26px);margin:0 0 6px;color:var(--green-950);letter-spacing:-.3px}
.tp-cta-copy p{margin:0;color:var(--muted);font-size:14.5px;line-height:1.6}
.tp-cta-actions{display:flex;gap:12px;flex-wrap:wrap;flex:0 0 auto}

/* ---------- Footer badge ---------- */
.tp-footer-badge{
  display:inline-flex;align-items:center;gap:12px;margin-top:16px;padding:11px 16px;border-radius:12px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);transition:.2s;
}
.tp-footer-badge:hover{background:rgba(0,182,122,.16);border-color:rgba(0,182,122,.5);transform:translateY(-2px)}
.tp-footer-stars{display:flex;flex:0 0 auto}
.tp-footer-copy{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.tp-footer-copy strong{color:#fff;font-size:13px;font-weight:800}
.tp-footer-copy small{color:#a9c6b9;font-size:11.5px}
.tp-footer-badge .tp-tile{box-shadow:0 1px 2px rgba(0,0,0,.3)}

/* ---------- Floating review chip ---------- */
.tp-float{
  position:fixed;left:18px;bottom:18px;z-index:70;display:flex;align-items:center;
  border-radius:999px;overflow:hidden;background:var(--tp-green);color:#fff;
  box-shadow:0 10px 28px rgba(0,182,122,.36);
  transition:transform .2s ease,box-shadow .2s ease,opacity .28s ease,visibility .28s ease;
}
/* Held back until the visitor scrolls past the opening screen, so the chip
   never sits on top of the hero heading or lead paragraph. */
.tp-float.tp-float-pending{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(10px)}
.tp-float:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(0,182,122,.44)}
.tp-float-link{display:inline-flex;align-items:center;gap:9px;padding:9px 4px 9px 14px;color:#fff}
.tp-float-star{font-size:17px;line-height:1}
.tp-float-text{display:flex;flex-direction:column;line-height:1.15;font-size:12.5px;font-weight:800}
.tp-float-text small{font-weight:600;font-size:10.5px;color:rgba(255,255,255,.82)}
.tp-float-close{
  align-self:stretch;width:26px;border:0;background:rgba(0,0,0,.14);color:#fff;
  font-size:14px;line-height:1;cursor:pointer;padding:0;
}
.tp-float-close:hover{background:rgba(0,0,0,.28)}

/* ---------- Inline rating link ---------- */
.tp-inline{display:inline-flex;align-items:center;gap:9px;font-size:13.5px;font-weight:700;color:var(--green-800)}
.tp-inline:hover{color:var(--green-700)}
.tp-inline .tp-stars{transform:translateY(-1px)}

/* ---------- Responsive ---------- */
@media(max-width:1180px){
  .tp-strip-inner{gap:12px;padding:8px 18px}
  .tp-strip-logo{padding-right:12px}
  .tp-strip-copy small{display:none}
}
@media(max-width:900px){
  .tp-chip{display:none}
  .tp-strip-copy strong{font-size:12.5px}
  .tp-strip-btn{min-height:32px;padding:7px 13px;font-size:12px}
  .tp-card{grid-template-columns:1fr}
  .tp-card-top{padding:30px 24px}
  .tp-card-body{padding:28px 24px}
  .tp-score-number{font-size:46px}
  .tp-cta-inner{gap:18px}
  .tp-cta-left{flex-direction:row;align-items:center;gap:14px;padding-right:0;border-right:0;border-bottom:1px solid rgba(6,44,34,.1);padding-bottom:14px;width:100%}
  .tp-cta-actions{width:100%}
  .tp-cta-actions .tp-btn{flex:1 1 200px}
}
@media(max-width:600px){
  .tp-strip-inner{flex-wrap:wrap;gap:10px;padding:9px 16px}
  .tp-strip-logo{padding-right:0;border-right:0}
  .tp-strip-copy{flex:1 1 100%;order:3}
  .tp-strip-copy small{display:block}
  .tp-strip-btn{order:2;margin-left:auto}
  .tp-hero-badge{width:100%;justify-content:flex-start;gap:11px;padding:10px 14px}
  .tp-hero-copy small{font-size:11.5px}
  .tp-float{bottom:14px;left:12px}
  .tp-float-text small{display:none}
  .tp-float-text{font-size:12px}
  .tp-card-note{position:static;text-align:center;padding:0 20px 16px}
  .tp-footer-badge{width:100%}
  .tp-btn{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .tp-btn,.tp-strip-btn,.tp-float,.tp-hero-badge,.tp-footer-badge{transition:none}
  .tp-btn:hover,.tp-strip-btn:hover,.tp-float:hover,.tp-hero-badge:hover,.tp-footer-badge:hover{transform:none}
}
html.tp-float-off .tp-float{display:none}

/* ---------- Homepage Trustpilot review section ---------- */
.tp-review-section{background:linear-gradient(180deg,#fffdf9,#f6fbf8)}
.tp-trust-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:26px}
.tp-trust-point{
  background:#fff;border:1px solid var(--border);border-radius:16px;padding:24px 22px;
  display:flex;flex-direction:column;gap:9px;box-shadow:var(--shadow-soft);transition:.2s;
}
.tp-trust-point:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(6,44,34,.09);border-color:rgba(0,182,122,.35)}
.tp-trust-point span{font-size:22px;line-height:1}
.tp-trust-point strong{font-size:15px;color:var(--green-950);font-weight:800}
.tp-trust-point p{margin:0;font-size:13.5px;color:var(--muted);line-height:1.6}
@media(max-width:900px){.tp-trust-points{grid-template-columns:1fr;gap:14px}}

/* Slim the trust rail so the header stays compact on laptops */
.tp-strip-inner{min-height:40px;padding:5px 28px;gap:14px}
.tp-strip-logo .tp-logo-word{font-size:14px}
.tp-strip-btn{min-height:30px;padding:6px 14px;font-size:12px}
.tp-strip-copy strong{font-size:13px}
.tp-strip-copy small{font-size:11.5px}
@media(max-width:1180px){.tp-strip-inner{min-height:38px;padding:5px 18px}}
@media(max-width:600px){.tp-strip-inner{min-height:36px;padding:6px 16px}}

/* The trust rail reads as a calm sub-header rather than a second banner */
.tp-strip{background:linear-gradient(90deg,#ffffff 0%,#f8fdfb 55%,#ffffff 100%);border-bottom:1px solid #e6f1ec}
.tp-strip-copy strong{color:var(--green-800)}
/* Balance the inner-page review band */
.tp-cta-band{padding:34px 0}
.tp-cta-copy h2{font-size:clamp(19px,2.1vw,24px)}
.tp-cta-left{min-width:150px}

/* ---------- Compact trust rail on small screens ---------- */
.tp-label-short{display:none}
@media(max-width:600px){
  .tp-strip-inner{flex-wrap:nowrap;gap:9px;padding:7px 16px;min-height:38px}
  .tp-strip-logo{display:none}
  .tp-strip-stars .tp-tile{width:16px;height:16px}
  .tp-strip-copy{flex:1 1 auto;order:0;flex-direction:row;align-items:center;overflow:hidden}
  .tp-strip-copy small{display:none}
  .tp-strip-copy strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:700}
  .tp-strip-btn{order:0;margin-left:auto;min-height:28px;padding:6px 12px;font-size:11.5px;gap:4px}
  .tp-label-full{display:none}
  .tp-label-short{display:inline}
  .tp-arrow{display:none}
}

/* =========================================================
   v43 — readability pass
   ---------------------------------------------------------
   The academy palette is dark green + gold. Gold is beautiful on
   dark green but washed out on cream, and white text on the bright
   brand gold only reaches 2.7:1. These rules keep the exact brand
   colours and fix the text that sits on them, so every label and
   every button is genuinely readable.
   ========================================================= */
:root{
  --gold-700:#8a6410;   /* gold text on light surfaces   (5.4:1 on white) */
  --gold-600:#a1751f;   /* gold accents and icons        (4.1:1 on white) */
  --tp-green-btn:#00805a; /* Trustpilot green for buttons (4.9:1 with white) */
}

/* ---------- Gold labels on light backgrounds ---------- */
.eyebrow{color:var(--gold-700)}
.section-head .eyebrow{color:var(--gold-700);background:rgba(200,149,50,.16)}
.pathway-number,.pathway-arrow,.plan-eyebrow,.price-card .plan-eyebrow,
.instructor-body .role,.hero-art-caption span:nth-child(2),
.prose a:hover,.testi-strip .btn-outline{color:var(--gold-700)!important}
.testi-card .rating,.review-cta .rating,.testi-strip .rating{color:var(--gold-600)}
.testi-card .rating,.review-cta .rating{color:var(--gold-600)!important}

/* Gold stays light wherever it sits on the academy's dark green */
.hero .eyebrow,.page-hero .eyebrow,.location-card .eyebrow,
.appointment-card .eyebrow,.site-footer .eyebrow,.tp-card-top .eyebrow{color:var(--gold-400)}
.hero .btn-outline,.page-hero .btn-outline,.location-card .btn-outline,
.appointment-card .btn-outline,.site-footer .btn-outline,.tp-card-top .btn-outline{color:var(--gold-400)!important;border-color:rgba(229,196,119,.6)}

/* ---------- Outlined buttons on light backgrounds ---------- */
.btn-outline{color:var(--gold-700)!important;border-color:rgba(138,100,16,.55)}
.btn-outline:hover{background:var(--gold-500);border-color:var(--gold-500);color:var(--green-950)!important}

/* ---------- Filled gold buttons: dark green text instead of white ----------
   The gold itself is unchanged; only the label colour moves, which lifts the
   contrast from 2.7:1 to 5.6:1. Hover still flips to deep green with white. */
.cta-btn,.btn:not(.btn-outline){background:linear-gradient(135deg,#e2b153 0%,var(--gold-500) 100%);color:var(--green-950)!important}
.tb-cta{background:linear-gradient(135deg,#e2b153 0%,var(--gold-500) 100%);color:var(--green-950)}
.tb-cta:hover{background:linear-gradient(135deg,var(--gold-400) 0%,#d5a03a 100%);color:var(--green-950)}
nav.main-nav .nav-btn-gold{background:linear-gradient(135deg,#e2b153 0%,var(--gold-500) 100%);color:var(--green-950)}
nav.main-nav .nav-btn-gold:hover{background:linear-gradient(135deg,var(--gold-500) 0%,#a97c22 100%);color:var(--green-950)}
.newsletter button{background:linear-gradient(135deg,#e2b153 0%,var(--gold-500) 100%);color:var(--green-950)}
.newsletter button:hover{background:linear-gradient(135deg,var(--gold-500) 0%,#a97c22 100%);color:var(--green-950)}
.badge-free{background:linear-gradient(135deg,#e2b153 0%,var(--gold-500) 100%);color:var(--green-950)}
.tb-social:hover,.social-row a:hover{color:var(--green-950)}

/* ---------- Trustpilot buttons: deeper green keeps white text readable ---------- */
.tp-strip-btn,.tp-btn-solid{background:var(--tp-green-btn)}
.tp-strip-btn:hover,.tp-btn-solid:hover{background:#006c4c}
.tp-float{background:var(--tp-green-btn)}
.tp-float-close{background:rgba(0,0,0,.22)}

/* ---------- Small labels lifted for legibility ---------- */
.pay-strip-title{font-size:12px}
.tp-float-text small{font-size:11.5px}
.tp-footer-copy small{font-size:12px}
.tp-strip-copy small{font-size:12px}
.badge-free{font-size:11.5px}
.tp-card-note{font-size:12px}

/* ---------- Images keep their space so the page never jumps ---------- */
.hero-art img{aspect-ratio:120 / 86;height:auto}
.testi-person img{aspect-ratio:1 / 1;object-fit:cover}
.instructor-card img,.instructor-body img{height:auto}

/* =========================================================
   v43b — mobile comfort, focus visibility and typography
   ========================================================= */

/* ---------- A clear focus ring for every interactive element ---------- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
  outline:2.5px solid var(--gold-500);outline-offset:2px;
}
.hero a:focus-visible,.page-hero a:focus-visible,.site-footer a:focus-visible,
.location-card a:focus-visible,.tp-card-top a:focus-visible{outline-color:var(--gold-400)}

/* ---------- Comfortable tap targets in the footer on phones ---------- */
@media(max-width:768px){
  .footer-grid ul{gap:0}
  .footer-grid ul li a,.foot-legal a,.tb-contact a{display:inline-block;padding:8px 0}
  .footer-grid ul li{line-height:1.35}
  .foot-legal{gap:0 18px}
  .tb-contact{gap:6px 18px}
  .social-row a{width:38px;height:38px;border-radius:11px}
  .footer-channel,.tp-footer-badge{min-height:44px}
  .course-category,.course-body p{font-size:12px}
  .hero-art-caption{font-size:10px}
  .testi-person small,.footer-grid p{font-size:12px}
}
@media(max-width:600px){
  .prose p,.prose li{font-size:15px}
  .section-head p{font-size:15px}
}

/* ---------- Typography: let headings break on their own terms ---------- */
h1,h2,h3,.hero h1,.page-hero h1,.section-head h2{text-wrap:balance}
p,li,.hero p.lead,.tp-card-body p{text-wrap:pretty}

/* ---------- Brand-tinted text selection ---------- */
::selection{background:rgba(200,149,50,.32);color:var(--green-950)}

/* Placeholders shown when a profile or course has no photo, so a card never
   renders a broken image. */
.instructor-photo-fallback{height:260px;display:flex;align-items:center;justify-content:center;background:linear-gradient(150deg,var(--green-800),var(--green-950));color:#e9d8a6;font-family:Georgia,'Times New Roman',serif;font-size:40px;letter-spacing:3px}
.course-thumb-fallback{display:flex;align-items:center;justify-content:center;height:200px;padding:0 16px;text-align:center;background:linear-gradient(150deg,#f6faf4,#e4eee0);color:var(--green-700);font-weight:800;letter-spacing:1.1px;text-transform:uppercase;font-size:12px;line-height:1.4}
@media (max-width:900px){.instructor-photo-fallback{height:220px}}


/* =========================================================
   v56 — a calmer top of the page, and WhatsApp within reach
   ========================================================= */

/* Phones and tablets were stacking four rows before the content: the utility
   bar, the masthead, the Trustpilot strip and the WhatsApp channel strip.
   Keep the one thing that matters up there — the phone number — and let the
   page itself do the talking. */
@media(max-width:1180px){
  .topbar .tb-links{display:none}
  .tb-contact a:nth-child(2){display:none}
  .topbar .container{justify-content:center}
  .tp-strip,.wa-channel{display:none}
}
/* The WhatsApp button is the quickest way to reach the academy, so it stays on
   phones too, sitting clear of the Trustpilot chip in the opposite corner. */
@media(max-width:600px){
  .wa-float{display:flex;position:fixed;right:14px;bottom:14px;width:48px;height:48px;border-width:3px;font-size:22px}
  .wa-float-svg{width:23px;height:23px}
}

/* Messages the portal sends back after a form is submitted, so a visitor who
   signs up from any page sees the confirmation in the site's own design. */
.zp-note{border-radius:10px;margin:0 0 14px;padding:12px 15px;font-size:13.5px;font-weight:600;line-height:1.5}
.zp-note--ok{background:#eaf6ee;border:1px solid #b6dfc3;color:#14532d}
.zp-note--error{background:#fdeceb;border:1px solid #f0c2bd;color:#8f2b21}
.zp-note--info{background:#f5f7f6;border:1px solid #e0e5e2;color:#4a5a52}


/* =========================================================
   v57 — headings in order, a skip link, and the phone and
   WhatsApp always within reach
   ========================================================= */

/* The footer columns and the feature cards were marked up as fourth-level
   headings, so the order skipped a level on every page. Same look, correct
   order. */
.feature-card h3{margin:0 0 10px;font-size:17px}
.footer-grid h3{color:#fff;font-size:15px;letter-spacing:.3px;margin:0 0 16px}
.instructor-body h3{margin:8px 0 8px;font-size:18px}
.heading-sm{font-size:16px;line-height:1.45;margin:0 0 10px;font-weight:700;color:inherit}

/* Words meant for screen readers and keyboard visitors only. */
.za-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--green-950);color:#fff;padding:12px 20px;border-radius:0 0 12px 0;font-weight:700;text-decoration:none}
.skip-link:focus{left:0}

/* Call and WhatsApp, within reach the whole way down: on phones and tablets
   from the first moment, and on desktop whenever the contact bar is there. */
.nav-actions .nav-icon{display:none;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;border:1px solid var(--border);background:var(--cream);color:var(--green-900);font-size:18px;line-height:1;text-decoration:none}
.nav-actions .nav-icon:hover{background:var(--green-950);color:#fff;border-color:var(--green-950)}
.nav-actions .nav-wa{background:#e9f9f0;border-color:#bfe6cf;color:#128c4a}
.nav-actions .nav-wa:hover{background:#25d366;border-color:#25d366;color:#fff}
.nav-actions .nav-wa-svg{width:21px;height:21px}
@media(max-width:1180px){.nav-actions .nav-icon{display:inline-flex}}
@media(max-width:420px){
  .nav-actions{gap:7px}
  .nav-actions .nav-icon{width:40px;height:40px}
  .nav-actions .nav-wa-svg{width:19px;height:19px}
}


/* =========================================================
   v58 — a lighter homepage, and a way to search the site
   ========================================================= */

/* The search box in the footer, so a visitor who has not found what they want
   in the menu can look for it by name. */
.footer-search{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 28px}
.footer-search input[type=search]{flex:1 1 260px;min-height:46px;padding:0 16px;border-radius:12px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;font-size:15px}
.footer-search input[type=search]::placeholder{color:rgba(255,255,255,.62)}
.footer-search button{min-height:46px;padding:0 22px;border:0;border-radius:12px;background:var(--gold-500);color:#fff;font-weight:800;font-size:14.5px;cursor:pointer;transition:background .18s ease,color .18s ease}
.footer-search button:hover{background:var(--gold-400);color:var(--green-950)}
