/*
Theme Name: NoorAcademy Fast
Theme URI: https://example.com/nooracademy-fast
Author: NoorAcademy
Author URI: https://example.com
Description: A fast, LiteSpeed-friendly landing page theme for online Quran academies. Every section's colors and key text are editable from Appearance → Customize, including a resizable logo under Site Identity.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: noor-academy
*/

/* ============================================================
   Base tokens. Values here are safe fallbacks; the Customizer
   (see customizer.php -> noor_dynamic_css) overrides the ones
   listed as --nav-bg, --hero-bg-start, --footer-bg, etc. by
   printing a small inline <style> block after this file loads,
   so the browser only ever downloads ONE cached CSS file.
   ============================================================ */
:root{
  --green-deep:#0F3D2E; --green-mid:#1B5E42;
  --gold:#C9972F; --gold-soft:#E8C97A;
  --cream:#FBF6EC; --cream-2:#F3EBDA;
  --ink:#1B1B18; --ink-soft:#5A5750;
  --line:#E1D6BA; --radius:2px;

  --nav-bg:var(--cream); --nav-text:var(--green-deep);
  --btn-primary-bg:#1FA34A; --btn-primary-text:#ffffff;

  --hero-bg-start:var(--green-deep); --hero-bg-end:var(--green-mid);
  --hero-heading-color:var(--cream); --hero-text-color:#D8E3DA;

  --why-bg:var(--cream-2); --why-heading:var(--green-deep); --why-text:var(--ink-soft);

  --stats-bg:var(--green-deep); --stats-heading:var(--cream); --stats-number:var(--gold-soft);

  --curriculum-bg:var(--cream); --curriculum-heading:var(--green-deep); --curriculum-text:var(--green-deep);

  --safety-bg:var(--green-deep); --safety-heading:var(--cream); --safety-text:var(--cream);

  --teachers-bg:var(--cream); --teachers-card-bg:var(--cream);

  --footer-bg:var(--green-deep); --footer-text:#CFE0D4; --footer-heading:var(--gold-soft);

  --logo-width:160px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:var(--cream);color:var(--ink);line-height:1.6}
h1,h2,h3,h4{font-family:'Amiri',serif;font-weight:700;color:var(--green-deep)}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}

/* ---------- Header / nav ---------- */
header{background:var(--nav-bg);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.navbar{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;max-width:1120px;margin:0 auto;gap:24px}
.logo{font-family:'Amiri',serif;font-size:22px;font-weight:700;color:var(--nav-text);display:flex;align-items:center;gap:8px}
.logo span{color:var(--gold)}
.custom-logo-link img{width:var(--logo-width);height:auto}
nav ul{list-style:none;display:flex;gap:32px}
nav a{font-size:15px;font-weight:500;color:var(--nav-text)}
.btn{display:inline-block;background:var(--gold);color:var(--green-deep);padding:12px 26px;border-radius:var(--radius);font-weight:600;font-size:14px;border:1px solid var(--gold);cursor:pointer}

/* ---------- Hamburger + mobile menu ---------- */
.menu-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:30px;height:26px;background:none;border:none;cursor:pointer;padding:0}
.menu-toggle span{display:block;height:2.5px;width:100%;background:var(--nav-text);border-radius:2px;transition:transform .25s ease,opacity .25s ease}
.menu-toggle.active span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.menu-toggle.active span:nth-child(2){opacity:0}
.menu-toggle.active span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
.mobile-menu{display:none;position:fixed;top:0;right:0;height:100vh;width:min(78vw,300px);background:var(--cream);box-shadow:-8px 0 30px rgba(0,0,0,.18);z-index:100;transform:translateX(100%);transition:transform .3s ease;flex-direction:column;padding:24px 22px}
.mobile-menu.open{transform:translateX(0)}
.mobile-menu-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}
.mobile-menu-close{background:none;border:none;font-size:26px;line-height:1;color:var(--green-deep);cursor:pointer}
.mobile-menu ul{list-style:none;display:flex;flex-direction:column;gap:4px}
.mobile-menu ul a{display:block;padding:14px 6px;font-size:16px;font-weight:600;color:var(--green-deep);border-bottom:1px solid var(--line)}
.mobile-menu .btn{margin-top:22px;text-align:center}
.menu-overlay{display:none;position:fixed;inset:0;background:rgba(15,61,46,.45);z-index:99;opacity:0;transition:opacity .3s ease}
.menu-overlay.open{display:block;opacity:1}
body.menu-locked{overflow:hidden}

/* ---------- Hero ---------- */
.hero{background:linear-gradient(180deg,var(--hero-bg-start),var(--hero-bg-end));color:var(--hero-heading-color);padding:70px 24px;overflow:hidden}
.hero-inner{max-width:1120px;margin:auto;display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:start}
.eyebrow{color:var(--gold-soft);font-size:14px;margin-bottom:14px}
.hero h1{color:var(--hero-heading-color);font-size:40px;line-height:1.25;margin-bottom:18px}
.hero p{color:var(--hero-text-color);font-size:16px;margin-bottom:32px}
.hero-bullets{list-style:none;margin-bottom:26px}
.hero-bullets li{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:14.5px;color:var(--hero-text-color)}
.hero-bullets .tick{width:20px;height:20px;font-size:11px;background:var(--gold-soft);color:var(--green-deep)}
.hero-cta{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;margin:28px 0 8px}
.btn-primary-cta{background:var(--btn-primary-bg);border-color:var(--btn-primary-bg);color:var(--btn-primary-text);font-size:16px;padding:16px 34px;border-radius:6px;box-shadow:0 8px 24px rgba(31,163,74,.4)}
.hero-form{background:var(--cream);border-radius:var(--radius);padding:28px;color:var(--ink);box-shadow:0 20px 50px rgba(0,0,0,.25)}
.hero-form h3{font-size:18px;margin-bottom:4px}
.hero-form .sub{font-size:13.5px;color:var(--ink-soft);margin-bottom:18px}
.hero-form input,.hero-form textarea{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:var(--radius);font:14px 'Inter',sans-serif;margin-bottom:12px;background:#fff;color:var(--ink)}
.hero-form textarea{resize:vertical;min-height:70px}
.hero-form .btn{width:100%}

section{padding:80px 24px}

/* ---------- Why Choose Us ---------- */
.trust{background:var(--why-bg)}
.trust-split{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:center}
.trust-visual{background:linear-gradient(135deg,var(--green-mid),var(--green-deep));min-height:430px;display:grid;place-items:center;border:1px solid var(--gold-soft);box-shadow:0 18px 40px rgba(15,61,46,.2);overflow:hidden}
.trust-visual img{width:100%;height:100%;min-height:430px;object-fit:cover}
.book{font-size:110px}
.trust-content h2{font-size:32px;margin-bottom:14px;color:var(--why-heading)}
.trust-lead{color:var(--why-text);margin-bottom:26px}
.trust-list{list-style:none;margin-bottom:30px}
.trust-list li{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-weight:500;color:var(--ink)}
.tick{width:24px;height:24px;border-radius:50%;background:var(--green-deep);color:var(--gold-soft);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.why-intro{max-width:760px;margin:0 auto 46px;text-align:center}
.why-eyebrow{color:var(--gold);font-size:18px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;margin-bottom:10px}
.why-intro h2{font-size:40px;line-height:1.2;margin-bottom:12px;color:var(--why-heading)}
.why-intro p{color:var(--why-text);font-size:16px;max-width:680px;margin:0 auto}

/* ---------- Global Reach / stats band ---------- */
.stats-band{background:var(--stats-bg);color:var(--stats-heading);padding:60px 24px;text-align:center}
.stats-band h2{color:var(--stats-heading);font-size:32px}
.stats-band>.eyebrow{color:var(--gold-soft);font-size:18px!important;font-weight:700;letter-spacing:.05em;text-transform:uppercase;margin-bottom:12px}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:1120px;margin:35px auto}
.stats-grid strong{display:block;font-family:'Amiri';font-size:34px;color:var(--stats-number)}
.stats-grid span{font-size:13.5px;color:#CFE0D4}
.flags{display:flex;justify-content:center;gap:14px 28px;flex-wrap:wrap;border-top:1px solid rgba(232,201,122,.25);padding-top:28px;max-width:1000px;margin:auto;font-size:14px;color:var(--stats-heading)}
.flags .flag-ico{display:inline-block;width:22px;height:15px;vertical-align:-3px;margin-right:5px;border-radius:2px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.25)}
.flags .flag-ico svg{display:block;width:100%;height:100%}

/* ---------- Generic section head ---------- */
.section-head{max-width:600px;margin:0 auto 48px;text-align:center}
.section-head h2{font-size:32px}
.section-head p{color:var(--ink-soft)}
.section-head>.eyebrow{font-size:18px!important;font-weight:700;letter-spacing:.05em;text-transform:uppercase;margin-bottom:12px;color:var(--gold)!important}

/* ---------- Curriculum ---------- */
.learn-section{background:var(--curriculum-bg)}
.learn-section .section-head h2{color:var(--curriculum-heading)}
.curriculum-grid{display:grid;grid-template-columns:repeat(4,1fr);max-width:1080px;margin:0 auto}
.curriculum-item{display:flex;flex-direction:column;align-items:center;text-align:center;padding:30px 14px;border-right:1px solid var(--line)}
.curriculum-item:nth-child(4n){border-right:none}
.curriculum-item:nth-child(n+5){border-top:1px solid var(--line)}
.curriculum-icon{font-size:32px;margin-bottom:14px;transition:transform .2s ease}
.curriculum-item:hover .curriculum-icon{transform:translateY(-4px)}
.curriculum-item h4{font-size:14.5px;color:var(--curriculum-text);font-weight:600;line-height:1.4}

/* ---------- Safety band ---------- */
.safety-band{background:var(--safety-bg);color:var(--safety-text)}
.safety-band .section-head h2{color:var(--safety-heading)}
.safety-band .section-head p{color:#CFE0D4}
.safety-eyebrow{color:var(--gold-soft)}
.safety-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 56px;max-width:880px;margin:0 auto}
.safety-item{display:flex;align-items:center;gap:16px;padding:18px 0;border-bottom:1px solid rgba(232,201,122,.25)}
.safety-item:last-child{border-bottom:none}
.safety-icon-wrap{width:42px;height:42px;border-radius:50%;background:rgba(232,201,122,.12);border:1px solid rgba(232,201,122,.3);display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0}
.safety-item span.label{font-size:15px;font-weight:500;color:var(--safety-text)}
@media(min-width:601px){.safety-item:nth-child(5),.safety-item:nth-child(6){border-bottom:none}}

/* ---------- Teachers ---------- */
#teachers{background:var(--teachers-bg)}
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.tcard{background:var(--teachers-card-bg);border:1px solid var(--line);overflow:hidden}
.tphoto{aspect-ratio:4/3;background:linear-gradient(135deg,var(--green-mid),var(--green-deep));display:flex;align-items:center;justify-content:center;color:var(--gold-soft);font-family:'Amiri';font-size:34px;overflow:hidden}
.tphoto img{width:100%;height:100%;object-fit:cover}
.tbody{padding:16px 18px 18px}
.tbody h4{font-size:17px}
.trole{font-size:13.5px;color:var(--gold);font-weight:600;margin-bottom:12px}
.tmeta{display:flex;flex-direction:column;gap:8px}
.tmeta-row{font-size:13px;color:var(--ink-soft)}

/* ---------- Footer ---------- */
footer{background:var(--footer-bg);color:var(--footer-text);padding:50px 24px 24px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px;max-width:1120px;margin:auto}
.footer-grid p{color:var(--footer-text)}
.footer-grid ul{list-style:none}
.footer-grid li{color:var(--footer-text);padding:4px 0}
.footer-grid h4{color:var(--footer-heading);margin-bottom:10px}
.footer-bottom{max-width:1120px;margin:32px auto 0;padding-top:20px;border-top:1px solid rgba(232,201,122,.2);font-size:13px;color:var(--footer-text);text-align:center}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .hero-inner,.trust-split{grid-template-columns:1fr}
  .team-grid{grid-template-columns:repeat(2,1fr)}
  .stats-grid,.footer-grid{grid-template-columns:1fr}
  nav ul{display:none}
  .hero h1{font-size:30px}
  .menu-toggle{display:flex}
  .mobile-menu,.menu-overlay{display:flex}
  .navbar>a.btn{display:none}
  .curriculum-grid{grid-template-columns:repeat(2,1fr)}
  .curriculum-item:nth-child(4n){border-right:1px solid var(--line)}
  .curriculum-item:nth-child(2n){border-right:none}
  .curriculum-item:nth-child(n+3){border-top:1px solid var(--line)}
}
@media(max-width:600px){
  .team-grid{grid-template-columns:1fr}
  .hero{padding:50px 18px}
  .navbar{padding:14px 18px}
  .navbar>.btn{padding:10px 12px;font-size:12px}
  .why-intro h2{font-size:26px}
  .why-intro p{font-size:14.5px}
  .why-eyebrow{font-size:15px}
  .stats-band h2{font-size:24px}
  .section-head h2{font-size:24px}
  .section-head p{font-size:14.5px}
  .stats-band>.eyebrow,.section-head>.eyebrow{font-size:14px!important}
  .trust-content h2{font-size:24px}
  .learn-section h2,.safety-band h2{font-size:24px}
  .curriculum-grid{grid-template-columns:1fr}
  .curriculum-item{flex-direction:row;text-align:left;gap:16px;padding:16px 2px;border-right:none!important;border-top:none!important;border-bottom:1px solid var(--line)}
  .curriculum-item:last-child{border-bottom:none}
  .curriculum-icon{margin-bottom:0;font-size:26px}
  .safety-grid{grid-template-columns:1fr}
  .safety-item{padding:16px 0}
  .custom-logo-link img{width:min(var(--logo-width),140px)}
}
@media(min-width:901px){.mobile-menu,.menu-overlay{display:none!important}}