/* ===== activities.html ===== */
:root{--saffron:#E85D04;--saffron-light:#FEF0E7;--saffron-dark:#9A3E00;--teal:#0A7B6C;--teal-light:#E0F4F1;--teal-dark:#064E46;--indigo:#3730A3;--indigo-light:#EEF2FF;--indigo-dark:#1E1B6E;--gold:#B45309;--gold-light:#FEFCE8;--ink:#0D1117;--ink-soft:#374151;--muted:#6B7280;--border:#E5E7EB;--surface:#F9FAFB;--white:#FFFFFF;--font-display: Arial, sans-serif;--font-body: Arial, sans-serif;--r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-full:999px;--shadow-sm:0 2px 10px rgba(0,0,0,0.08);--shadow-md:0 4px 24px rgba(0,0,0,0.12);--shadow-lg:0 8px 48px rgba(0,0,0,0.16)}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.7;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}ul,ol{list-style:none}button{font-family:var(--font-body);cursor:pointer}
.container{max-width:1120px;margin:0 auto;padding:0 1.5rem}
.section{padding:5rem 0}.section-alt{background:var(--white)}
.eyebrow.section-title{font-family:var(--font-display);font-size:clamp(1.75rem,3.2vw,2.4rem);font-weight:700;line-height:1.15;margin-bottom:.75rem;color:var(--ink)}
.section-title{font-family:var(--font-display);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.12;margin-bottom:.75rem}
.badge{display:inline-flex;align-items:center;font-size:.68rem;font-weight:700;padding:.2rem .55rem;border-radius:6px;white-space:nowrap}
.badge-cbse{background:#FEF3C7;color:#92400E}.badge-icse{background:var(--teal-light);color:var(--teal-dark)}.badge-ib{background:var(--indigo-light);color:var(--indigo-dark)}.badge-state{background:#F0FDF4;color:#166534}.badge-unplugged{background:#F0FDF4;color:#166534}.badge-plugged{background:#EFF6FF;color:#1E40AF}.badge-grade{background:var(--surface);color:var(--ink-soft);border:1px solid var(--border)}
.ct-pill{display:inline-flex;align-items:center;font-size:.62rem;font-weight:700;padding:.15rem .45rem;border-radius:4px}
.ct-d{background:#FEE2E2;color:#991B1B}.ct-p{background:var(--teal-light);color:var(--teal-dark)}.ct-a{background:var(--indigo-light);color:var(--indigo-dark)}.ct-al{background:#FEF3C7;color:#78350F}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.72rem 1.5rem;border-radius:var(--r-md);font-weight:600;font-size:.875rem;transition:all .18s;border:none;cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--saffron);color:#fff}.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-sm{padding:.42rem .9rem;font-size:.8rem;border-radius:var(--r-sm)}

/* NAV */
nav{position:sticky;top:0;z-index:200;background:rgba(249,250,251,.96);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);padding:0 1.5rem;height:64px;display:flex;align-items:center;transition:box-shadow .2s}
nav.scrolled{box-shadow:var(--shadow-sm)}
.nav-brand{display:flex;align-items:center;gap:10px}
.nav-logo{width:36px;height:36px;background:linear-gradient(135deg,var(--saffron),#F59E0B);border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:1rem;font-weight:700;color:#fff}
.nav-brand-text{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--ink)}.nav-brand-text span{color:var(--saffron)}
.nav-links{display:flex;align-items:center;margin-left:1.75rem;flex:1;overflow-x:auto}.nav-links::-webkit-scrollbar{display:none}
.nav-link{display:block;padding:.4rem .8rem;color:var(--muted);font-size:.84rem;font-weight:500;white-space:nowrap;border-radius:var(--r-sm);transition:color .15s,background .15s}
.nav-link:hover,.nav-link.active{color:var(--ink);background:rgba(0,0,0,.05)}
.nav-right{display:flex;align-items:center;gap:.75rem;margin-left:auto;flex-shrink:0}
.nav-join{background:var(--saffron);color:#fff;padding:.44rem 1.1rem;border-radius:var(--r-sm);font-size:.84rem;font-weight:600;transition:all .15s;border:none;cursor:pointer}.nav-join:hover{background:var(--saffron-dark)}
.hamburger{display:none;flex-direction:column;gap:4px;cursor:pointer;padding:.4rem;border:none;background:none}
.hamburger span{width:22px;height:2px;background:var(--ink);border-radius:2px}
@media(max-width:900px){.nav-links{display:none}.hamburger{display:flex}}
.mobile-menu{display:none;position:fixed;inset:0;z-index:300;background:var(--white);overflow-y:auto;padding:1.5rem;flex-direction:column}
.mobile-menu.open{display:flex}
.mobile-menu-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}
.mobile-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--ink)}
.mobile-nav-link{display:block;padding:1rem 0;font-size:1.1rem;font-weight:500;color:var(--ink);border-bottom:1px solid var(--border)}
.mobile-auth{display:flex;gap:.75rem;margin-top:2rem}
.mobile-auth .btn{flex:1;justify-content:center}

/* PAGE HERO */
.page-hero{background:var(--ink);color:#fff;padding:4rem 1.5rem 3.5rem;position:relative;overflow:hidden}
.page-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 80% at 30% 60%, rgba(10,123,108,.22) 0%, transparent 55%),radial-gradient(ellipse 50% 55% at 80% 25%, rgba(55,48,163,.28) 0%, transparent 55%)}
.page-hero-inner{position:relative;z-index:1;max-width:700px}
.page-hero h1{font-family:var(--font-display);font-size:clamp(2rem,4.5vw,3.2rem);font-weight:700;line-height:1.1;margin-bottom:.85rem;letter-spacing:-.02em}
.page-hero p{color:rgba(255,255,255,.62);font-size:1rem;line-height:1.7;max-width:520px}
.page-hero-stats{display:flex;gap:2.5rem;margin-top:2rem;flex-wrap:wrap}
.ph-stat-num{display:block;font-family:var(--font-display);font-size:1.6rem;font-weight:700;color:#FBBF24;line-height:1}
.ph-stat-label{font-size:.75rem;color:rgba(255,255,255,.4);margin-top:.2rem}

/* GRADE FILTER TABS */
.grade-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2.5rem;background:var(--white);padding:1.1rem 1.5rem;border-bottom:1px solid var(--border);position:sticky;top:64px;z-index:100}
.grade-tab{padding:.5rem 1.1rem;border-radius:var(--r-full);font-size:.82rem;font-weight:600;border:1.5px solid var(--border);background:var(--white);color:var(--ink-soft);cursor:pointer;transition:all .15s;white-space:nowrap}
.grade-tab:hover,.grade-tab.active{border-color:var(--saffron);color:var(--saffron);background:var(--saffron-light)}
.grade-tab.active{background:var(--saffron);color:#fff;border-color:var(--saffron)}



.framework-wrap1{display:grid;grid-template-columns:1fr;gap:2.5rem;align-items:start}
.framework-visual1{
  background:linear-gradient(145deg,var(--indigo-light),var(--teal-light));
  border-radius:var(--r-xl);padding:2rem;
  border:1px solid var(--border);
}


.fv-title{font-family:var(--font-display);font-size:1.05rem;font-weight:700;margin-bottom:1.25rem;text-align:center}
.fv-cycle{
  display:grid;grid-template-columns:1fr 1fr;
  gap:1rem;
}
.fv-step{
  background:var(--white);border-radius:var(--r-md);
  padding:1rem;text-align:center;border:1px solid var(--border);
}
.fv-num{
  width:28px;height:28px;border-radius:50%;
  margin:0 auto .5rem;
  display:flex;align-items:center;justify-content:center;
  font-size:.75rem;font-weight:700;color:#fff;
}
.fv-step h5{font-size:.82rem;font-weight:700;margin-bottom:.2rem}
.fv-step p{font-size:.75rem;color:var(--muted)}

/* ACTIVITY CARDS */
.activities-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:1.5rem}
@media(max-width:720px){.activities-grid{grid-template-columns:1fr}}
.activity-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);overflow:hidden;transition:box-shadow .2s,transform .2s}
.activity-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.activity-card[data-grade="preschool"]{display:block}
.activity-card.hidden{display:none!important}

.activity-hero{padding:1.5rem;position:relative}
.ac-preschool{background:linear-gradient(135deg,#FFF4EE,#FFE0C5)}
.ac-primary{background:linear-gradient(135deg,#FFFBEB,#FDE68A)}
.ac-middle{background:linear-gradient(135deg,var(--teal-light),#C5EDE8)}
.ac-high{background:linear-gradient(135deg,var(--indigo-light),#D4CEF5)}
.ac-senior{background:linear-gradient(135deg,#FFF1F2,#FDD8DC)}
.activity-grade-badge{display:inline-block;background:rgba(255,255,255,.75);border-radius:var(--r-sm);padding:.22rem .6rem;font-size:.7rem;font-weight:700;margin-bottom:.75rem}
.activity-emoji{font-size:2.5rem;display:block;margin-bottom:.5rem}
.activity-type-tag{font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem}
.activity-hero h4{font-size:1rem;font-weight:700;line-height:1.35;color:var(--ink)}
.activity-body{padding:1.25rem}
.activity-body>p{font-size:.86rem;color:var(--ink-soft);line-height:1.65;margin-bottom:.9rem}
.activity-meta-row{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:1rem}
.activity-expand{padding:.42rem .9rem;border-radius:var(--r-sm);font-size:.8rem;font-weight:600;border:1.5px solid var(--border);background:var(--white);color:var(--ink-soft);cursor:pointer;transition:all .15s}
.activity-expand:hover{border-color:var(--saffron);color:var(--saffron)}
.activity-detail{display:none;padding:0 1.25rem 1.25rem;border-top:1px solid var(--border)}
.activity-detail.open{display:block}
.activity-detail h5{font-size:.85rem;font-weight:700;color:var(--ink);margin-bottom:.35rem;margin-top:.9rem}
.activity-detail p{font-size:.84rem;color:var(--ink-soft);line-height:1.65}
.activity-detail ol{font-size:.84rem;color:var(--ink-soft);line-height:1.75;padding-left:1.1rem;list-style:decimal}
.activity-detail ul{font-size:.84rem;color:var(--ink-soft);line-height:1.75;padding-left:1.1rem;list-style:disc}
.activity-note{margin-top:.75rem;padding:.75rem;background:var(--saffron-light);border-radius:var(--r-sm);font-size:.8rem;color:var(--saffron-dark);line-height:1.55}

/* MODAL */
.modal-overlay{position:fixed;inset:0;z-index:500;background:rgba(13,17,23,.7);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:1.5rem}
.modal-overlay.open{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);padding:2.5rem 2rem;max-width:440px;width:100%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:var(--shadow-lg)}
.modal-close{position:absolute;top:1rem;right:1rem;background:var(--surface);border:1px solid var(--border);width:32px;height:32px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--muted)}
.modal-close:hover{background:var(--border);color:var(--ink)}
.auth-tabs{display:flex;border-bottom:1px solid var(--border);margin-bottom:1.75rem}
.auth-tab{flex:1;padding:.75rem;text-align:center;font-size:.9rem;font-weight:600;color:var(--muted);cursor:pointer;border:none;background:none;border-bottom:2.5px solid transparent;transition:all .15s;font-family:var(--font-body)}
.auth-tab.active{color:var(--saffron);border-bottom-color:var(--saffron)}
.auth-pane{display:none}.auth-pane.active{display:block}
.form-group{margin-bottom:1.1rem}
.form-label{display:block;font-size:.82rem;font-weight:600;color:var(--ink-soft);margin-bottom:.35rem}
.form-input{width:100%;border:1.5px solid var(--border);border-radius:var(--r-sm);padding:.65rem .85rem;font-size:.9rem;color:var(--ink);outline:none;transition:border-color .15s;font-family:var(--font-body);background:var(--white)}
.form-input:focus{border-color:var(--saffron)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}

.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.7rem 1.4rem;border-radius:var(--r-full);font-size:.86rem;font-weight:500;box-shadow:var(--shadow-md);opacity:0;transition:all .3s;pointer-events:none;z-index:999;white-space:nowrap}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

footer{background:var(--ink);padding:2rem 1.5rem}
.footer-bottom{max-width:1120px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;font-size:.78rem;color:rgba(255,255,255,.3)}
.footer-bottom a{color:rgba(255,255,255,.3);margin-left:1.25rem;transition:color .15s}.footer-bottom a:hover{color:rgba(255,255,255,.7)}

/* ===== community.html ===== */
:root{--saffron:#E85D04;--saffron-light:#FEF0E7;--saffron-dark:#9A3E00;--teal:#0A7B6C;--teal-light:#E0F4F1;--teal-mid:#29A898;--teal-dark:#064E46;--indigo:#3730A3;--indigo-light:#EEF2FF;--indigo-dark:#1E1B6E;--gold:#B45309;--gold-light:#FEFCE8;--green:#15803D;--green-light:#F0FDF4;--ink:#0D1117;--ink-soft:#374151;--muted:#6B7280;--border:#E5E7EB;--surface:#F9FAFB;--white:#FFFFFF;--font-display: Arial, sans-serif;--font-body: Arial, sans-serif;--r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-full:999px;--shadow-sm:0 2px 10px rgba(0,0,0,.08);--shadow-md:0 4px 24px rgba(0,0,0,.12);--shadow-lg:0 8px 48px rgba(0,0,0,.16)}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.7;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}ul,ol{list-style:none}button{font-family:var(--font-body);cursor:pointer}
.container{max-width:1120px;margin:0 auto;padding:0 1.5rem}
.section{padding:5rem 0}.section-alt{background:var(--white)}
.eyebrow{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--saffron);margin-bottom:.6rem}
.section-title{font-family:var(--font-display);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.12;margin-bottom:.75rem}
.section-sub{color:var(--muted);font-size:1rem;max-width:520px;line-height:1.7}
.section-header{text-align:center;margin-bottom:3rem}
.section-header .section-sub{margin:0 auto}
.section-header .eyebrow{display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#F48C42;margin-bottom:.8rem;background:none;border:none;padding:0}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.72rem 1.5rem;border-radius:var(--r-md);font-weight:600;font-size:.875rem;transition:all .18s;border:none;cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--saffron);color:#fff}.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-teal{background:var(--teal);color:#fff}.btn-teal:hover{background:var(--teal-dark)}
.btn-sm{padding:.42rem .9rem;font-size:.8rem;border-radius:var(--r-sm)}
.badge{display:inline-flex;align-items:center;font-size:.68rem;font-weight:700;padding:.2rem .55rem;border-radius:6px;white-space:nowrap}
.badge-cbse{background:#FEF3C7;color:#92400E}.badge-icse{background:var(--teal-light);color:var(--teal-dark)}.badge-ib{background:var(--indigo-light);color:var(--indigo-dark)}.badge-state{background:#F0FDF4;color:#166534}
.ct-pill{display:inline-flex;align-items:center;font-size:.62rem;font-weight:700;padding:.15rem .45rem;border-radius:4px}
.ct-d{background:#FEE2E2;color:#991B1B}.ct-p{background:var(--teal-light);color:var(--teal-dark)}.ct-a{background:var(--indigo-light);color:var(--indigo-dark)}.ct-al{background:#FEF3C7;color:#78350F}

/* NAV */
nav{position:sticky;top:0;z-index:200;background:rgba(249,250,251,.96);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);padding:0 1.5rem;height:64px;display:flex;align-items:center;transition:box-shadow .2s}
nav.scrolled{box-shadow:var(--shadow-sm)}
.nav-brand{display:flex;align-items:center;gap:10px}
.nav-logo{width:36px;height:36px;background:linear-gradient(135deg,var(--saffron),#F59E0B);border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:1rem;font-weight:700;color:#fff}
.nav-brand-text{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--ink)}.nav-brand-text span{color:var(--saffron)}
.nav-links{display:flex;align-items:center;margin-left:1.75rem;flex:1;overflow-x:auto}.nav-links::-webkit-scrollbar{display:none}
.nav-link{display:block;padding:.4rem .8rem;color:var(--muted);font-size:.84rem;font-weight:500;white-space:nowrap;border-radius:var(--r-sm);transition:color .15s,background .15s}
.nav-link:hover,.nav-link.active{color:var(--ink);background:rgba(0,0,0,.05)}
.nav-right{display:flex;align-items:center;gap:.75rem;margin-left:auto;flex-shrink:0}
.nav-join{background:var(--saffron);color:#fff;padding:.44rem 1.1rem;border-radius:var(--r-sm);font-size:.84rem;font-weight:600;transition:all .15s;border:none;cursor:pointer}.nav-join:hover{background:var(--saffron-dark)}
.hamburger{display:none;flex-direction:column;gap:4px;cursor:pointer;padding:.4rem;border:none;background:none}
.hamburger span{width:22px;height:2px;background:var(--ink);border-radius:2px}
@media(max-width:900px){.nav-links{display:none}.hamburger{display:flex}}
.mobile-menu{display:none;position:fixed;inset:0;z-index:300;background:var(--white);overflow-y:auto;padding:1.5rem;flex-direction:column}
.mobile-menu.open{display:flex}
.mobile-menu-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}
.mobile-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--ink)}
.mobile-nav-link{display:block;padding:1rem 0;font-size:1.1rem;font-weight:500;color:var(--ink);border-bottom:1px solid var(--border)}
.mobile-auth{display:flex;gap:.75rem;margin-top:2rem}.mobile-auth .btn{flex:1;justify-content:center}

/* PAGE HERO */
.page-hero{background:var(--ink);color:#fff;padding:4rem 1.5rem 3.5rem;position:relative;overflow:hidden}
.page-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 15% 55%, rgba(10,123,108,.22) 0%,transparent 55%),radial-gradient(ellipse 50% 60% at 85% 30%, rgba(232,93,4,.22) 0%,transparent 55%)}
.page-hero-inner{position:relative;z-index:1;max-width:700px}
.page-hero h1{font-family:var(--font-display);font-size:clamp(2rem,4.5vw,3.2rem);font-weight:700;line-height:1.1;margin-bottom:.85rem;letter-spacing:-.02em}
.page-hero p{color:rgba(255,255,255,.62);font-size:1rem;line-height:1.7;max-width:520px}
.hero-stat-row{display:flex;gap:2.5rem;margin-top:2rem;flex-wrap:wrap}
.hs-num{display:block;font-family:var(--font-display);font-size:1.6rem;font-weight:700;color:#FBBF24;line-height:1}
.hs-label{font-size:.75rem;color:rgba(255,255,255,.4);margin-top:.2rem}

/* COMMUNITY LAYOUT */
.community-layout{display:grid;grid-template-columns:1fr 320px;gap:2rem;align-items:start}
@media(max-width:900px){.community-layout{grid-template-columns:1fr}}

/* FEED */
.feed-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;flex-wrap:wrap;gap:.75rem}
.feed-header h3{font-family:var(--font-display);font-size:1.2rem;font-weight:700}
.feed-filters{display:flex;gap:.4rem;flex-wrap:wrap}
.feed-filter{padding:.3rem .75rem;border-radius:var(--r-full);font-size:.76rem;font-weight:600;border:1.5px solid var(--border);background:var(--white);color:var(--muted);cursor:pointer;transition:all .15s}
.feed-filter:hover,.feed-filter.active{border-color:var(--saffron);color:var(--saffron);background:var(--saffron-light)}

.post-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);padding:1.5rem;margin-bottom:1.25rem;transition:box-shadow .2s}
.post-card:hover{box-shadow:var(--shadow-sm)}
.post-header{display:flex;align-items:flex-start;gap:.85rem;margin-bottom:1rem}
.avatar{width:42px;height:42px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem}
.av1{background:#FEE2E2;color:#991B1B}.av2{background:var(--teal-light);color:var(--teal-dark)}.av3{background:var(--indigo-light);color:var(--indigo-dark)}.av4{background:#FEF3C7;color:#78350F}.av5{background:#F0FDF4;color:#166534}.av6{background:#FCE7F3;color:#9D174D}
.post-author{flex:1}
.post-name{font-size:.9rem;font-weight:700;margin-bottom:.12rem}
.post-meta{font-size:.75rem;color:var(--muted)}
.post-type-chip{display:inline-flex;align-items:center;gap:.3rem;font-size:.68rem;font-weight:700;padding:.2rem .55rem;border-radius:var(--r-sm);margin-left:.5rem}
.chip-activity{background:var(--teal-light);color:var(--teal-dark)}
.chip-question{background:#FEF3C7;color:#78350F}
.chip-story{background:var(--indigo-light);color:var(--indigo-dark)}
.chip-resource{background:#FEE2E2;color:#991B1B}
.chip-event{background:#F0FDF4;color:#166534}
.post-title{font-size:.96rem;font-weight:700;margin-bottom:.5rem;line-height:1.35}
.post-body{font-size:.875rem;color:var(--ink-soft);line-height:1.7;margin-bottom:1rem}
.post-tags{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.9rem}
.post-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem}
.post-reactions{display:flex;gap:.4rem}
.react-btn{display:inline-flex;align-items:center;gap:.3rem;padding:.3rem .65rem;border-radius:var(--r-full);border:1.5px solid var(--border);background:var(--white);font-size:.78rem;font-weight:600;color:var(--muted);cursor:pointer;transition:all .15s;font-family:var(--font-body)}
.react-btn:hover{border-color:var(--saffron);color:var(--saffron)}
.react-btn.liked{border-color:var(--saffron);color:var(--saffron);background:var(--saffron-light)}
.react-btn.saved{border-color:var(--teal);color:var(--teal);background:var(--teal-light)}
.post-share{font-size:.76rem;color:var(--muted);cursor:pointer;transition:color .15s}
.post-share:hover{color:var(--saffron)}
.post-image-placeholder{background:linear-gradient(135deg,#F3F4F6,#E5E7EB);border-radius:var(--r-md);padding:2rem;text-align:center;margin-bottom:1rem;color:var(--muted);font-size:.85rem}

/* SIDEBAR */
.sidebar{display:flex;flex-direction:column;gap:1.25rem}
.sidebar-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);padding:1.25rem}
.sidebar-card h4{font-size:.875rem;font-weight:700;margin-bottom:.9rem;color:var(--ink)}
.stat-row{display:flex;justify-content:space-between;align-items:center;padding:.55rem 0;border-bottom:1px solid var(--border);font-size:.83rem}
.stat-row:last-child{border-bottom:none}
.stat-val{font-weight:700;font-family:var(--font-display);color:var(--saffron)}
.tag-cloud{display:flex;flex-wrap:wrap;gap:.4rem}
.tag-pill{padding:.28rem .65rem;border-radius:var(--r-full);font-size:.73rem;font-weight:600;border:1.5px solid var(--border);color:var(--ink-soft);cursor:pointer;transition:all .15s}
.tag-pill:hover{border-color:var(--saffron);color:var(--saffron)}
.member-row{display:flex;align-items:center;gap:.65rem;padding:.5rem 0;border-bottom:1px solid var(--border)}
.member-row:last-child{border-bottom:none}
.member-info{flex:1}
.member-name{font-size:.82rem;font-weight:700}
.member-detail{font-size:.72rem;color:var(--muted)}
.follow-btn{font-size:.72rem;font-weight:700;color:var(--teal);border:1.5px solid var(--teal-light);border-radius:var(--r-full);padding:.2rem .6rem;background:none;cursor:pointer;transition:all .15s;font-family:var(--font-body)}
.follow-btn:hover{background:var(--teal);color:#fff;border-color:var(--teal)}

/* EVENTS */
.events-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.25rem}
.event-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);overflow:hidden;transition:box-shadow .2s,transform .2s}
.event-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.event-hero{padding:1.4rem;position:relative}
.ev-online{background:linear-gradient(135deg,var(--teal-light),#C5EDE8)}
.ev-hybrid{background:linear-gradient(135deg,var(--indigo-light),#D4CEF5)}
.ev-inperson{background:linear-gradient(135deg,#FFF4EE,#FFE0C5)}
.event-date-badge{display:inline-block;background:rgba(255,255,255,.8);border-radius:var(--r-sm);padding:.3rem .75rem;font-size:.72rem;font-weight:700;margin-bottom:.75rem}
.event-emoji{font-size:2rem;display:block;margin-bottom:.5rem}
.event-type{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.3rem;color:var(--muted)}
.event-card h4{font-size:1rem;font-weight:700;line-height:1.35;color:var(--ink)}
.event-body{padding:1.1rem 1.25rem}
.event-detail-row{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--muted);margin-bottom:.4rem}
.event-body .btn{margin-top:.9rem;width:100%;justify-content:center}

/* WHATSAPP GROUPS */
.wa-groups-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.1rem}
.wa-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.35rem;display:flex;flex-direction:column;gap:.75rem;transition:box-shadow .2s,border-color .2s}
.wa-card:hover{box-shadow:var(--shadow-sm);border-color:#25D366}
.wa-top{display:flex;align-items:center;gap:.75rem}
.wa-icon{width:42px;height:42px;border-radius:50%;background:#E8F5E9;display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0}
.wa-name{font-size:.9rem;font-weight:700;line-height:1.2}
.wa-desc{font-size:.78rem;color:var(--muted);line-height:1.55}
.wa-meta{font-size:.73rem;color:var(--muted)}
.wa-join{display:inline-flex;align-items:center;gap:.35rem;font-size:.78rem;font-weight:700;color:#128C7E;border:1.5px solid #C8E6C9;padding:.32rem .75rem;border-radius:var(--r-full);background:none;cursor:pointer;transition:all .15s;font-family:var(--font-body)}
.wa-join:hover{background:#25D366;color:#fff;border-color:#25D366}

/* WRITE FOR CT */
.write-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}
@media(max-width:720px){.write-grid{grid-template-columns:1fr}}
.write-info h3{font-family:var(--font-display);font-size:1.35rem;font-weight:700;margin-bottom:.75rem}
.write-info p{font-size:.9rem;color:var(--ink-soft);line-height:1.7;margin-bottom:1rem}
.write-types{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem}
.write-type{display:flex;align-items:center;gap:.75rem;padding:.85rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-md)}
.wt-icon{font-size:1.2rem;flex-shrink:0}
.wt-text h5{font-size:.85rem;font-weight:700;margin-bottom:.12rem}
.wt-text p{font-size:.78rem;color:var(--muted);line-height:1.5}
.write-form{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);padding:1.75rem}
.write-form h4{font-family:var(--font-display);font-size:1.1rem;font-weight:700;margin-bottom:1.25rem}
.form-group{margin-bottom:1rem}
.form-label{display:block;font-size:.82rem;font-weight:600;color:var(--ink-soft);margin-bottom:.35rem}
.form-input{width:100%;border:1.5px solid var(--border);border-radius:var(--r-sm);padding:.65rem .85rem;font-size:.9rem;color:var(--ink);outline:none;transition:border-color .15s;font-family:var(--font-body);background:var(--white)}
.form-input:focus{border-color:var(--saffron)}
textarea.form-input{resize:vertical;min-height:90px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
@media(max-width:500px){.form-row{grid-template-columns:1fr}}

/* MODAL */
.modal-overlay{position:fixed;inset:0;z-index:500;background:rgba(13,17,23,.7);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:1.5rem}
.modal-overlay.open{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);padding:2.5rem 2rem;max-width:440px;width:100%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:var(--shadow-lg)}
.modal-close{position:absolute;top:1rem;right:1rem;background:var(--surface);border:1px solid var(--border);width:32px;height:32px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--muted)}
.modal-close:hover{background:var(--border)}
.auth-tabs{display:flex;border-bottom:1px solid var(--border);margin-bottom:1.75rem}
.auth-tab{flex:1;padding:.75rem;text-align:center;font-size:.9rem;font-weight:600;color:var(--muted);cursor:pointer;border:none;background:none;border-bottom:2.5px solid transparent;transition:all .15s;font-family:var(--font-body)}
.auth-tab.active{color:var(--saffron);border-bottom-color:var(--saffron)}
.auth-pane{display:none}.auth-pane.active{display:block}
.modal-form-group{margin-bottom:1.1rem}
.modal-label{display:block;font-size:.82rem;font-weight:600;color:var(--ink-soft);margin-bottom:.35rem}
.modal-input{width:100%;border:1.5px solid var(--border);border-radius:var(--r-sm);padding:.65rem .85rem;font-size:.9rem;color:var(--ink);outline:none;transition:border-color .15s;font-family:var(--font-body);background:var(--white)}
.modal-input:focus{border-color:var(--saffron)}
.modal-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.7rem 1.4rem;border-radius:var(--r-full);font-size:.86rem;font-weight:500;box-shadow:var(--shadow-md);opacity:0;transition:all .3s;pointer-events:none;z-index:999;white-space:nowrap}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
footer{background:var(--ink);padding:2rem 1.5rem}
.footer-bottom{max-width:1120px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;font-size:.78rem;color:rgba(255,255,255,.3)}
.footer-bottom a{color:rgba(255,255,255,.3);margin-left:1.25rem;transition:color .15s}.footer-bottom a:hover{color:rgba(255,255,255,.7)}
@media(max-width:700px){.page-hero{padding:3rem 1.25rem 2.5rem}.section{padding:3.5rem 0}}

/* ===== index.html ===== */
/* ══════════════════ DESIGN TOKENS ══════════════════ */
:root {
  --saffron:       #E85D04;
  --saffron-light: #FEF0E7;
  --saffron-mid:   #F48C42;
  --saffron-dark:  #9A3E00;
  --teal:          #0A7B6C;
  --teal-light:    #E0F4F1;
  --teal-mid:      #29A898;
  --teal-dark:     #064E46;
  --indigo:        #3730A3;
  --indigo-light:  #EEF2FF;
  --indigo-dark:   #1E1B6E;
  --gold:          #B45309;
  --gold-light:    #FEFCE8;
  --ink:           #0D1117;
  --ink-soft:      #374151;
  --muted:         #6B7280;
  --border:        #E5E7EB;
  --surface:       #F9FAFB;
  --white:         #FFFFFF;
  --font-display: Arial, sans-serif;
  --font-body: Arial, sans-serif;
  --font-mono: Arial, sans-serif;
  --r-sm: 8px; --r-md: 14px; --r-lg: 20px; --r-xl: 28px; --r-full: 999px;
  --shadow-sm: 0 2px 10px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 24px rgba(0,0,0,0.12);
  --shadow-lg: 0 8px 48px rgba(0,0,0,0.16);
}

/* ══════════════════ RESET ══════════════════ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.7;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button{font-family:var(--font-body);cursor:pointer}
[id]{scroll-margin-top:72px}

/* ══════════════════ UTILITIES ══════════════════ */
.container{max-width:1120px;margin:0 auto;padding:0 1.5rem}
.section{padding:5rem 0}
.section-alt{background:var(--white)}
.eyebrow{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--saffron);margin-bottom:.6rem}
.section-title{font-family:var(--font-display);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.12;margin-bottom:.75rem;color:var(--ink)}
.section-sub{color:var(--muted);font-size:1rem;max-width:520px;line-height:1.7}
.section-header{text-align:center;margin-bottom:3.5rem}
.section-header .section-sub{margin:0 auto}

.badge{display:inline-flex;align-items:center;gap:.25rem;font-size:.68rem;font-weight:700;padding:.2rem .55rem;border-radius:6px;letter-spacing:.03em;white-space:nowrap}
.badge-cbse{background:#FEF3C7;color:#92400E}
.badge-icse{background:var(--teal-light);color:var(--teal-dark)}
.badge-ib{background:var(--indigo-light);color:var(--indigo-dark)}
.badge-state{background:#F0FDF4;color:#166534}
.badge-unplugged{background:#F0FDF4;color:#166534}
.badge-plugged{background:#EFF6FF;color:#1E40AF}
.badge-grade{background:var(--surface);color:var(--ink-soft);border:1px solid var(--border)}

.ct-pill{display:inline-flex;align-items:center;font-size:.62rem;font-weight:700;padding:.15rem .45rem;border-radius:4px;letter-spacing:.04em}
.ct-d{background:#FEE2E2;color:#991B1B}
.ct-p{background:var(--teal-light);color:var(--teal-dark)}
.ct-a{background:var(--indigo-light);color:var(--indigo-dark)}
.ct-al{background:#FEF3C7;color:#78350F}

.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.72rem 1.5rem;border-radius:var(--r-md);font-weight:600;font-size:.875rem;transition:all .18s;border:none;cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--saffron);color:#fff}
.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px);box-shadow:0 4px 16px rgba(232,93,4,.35)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}
.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-ghost{background:rgba(255,255,255,.1);color:#fff;border:1.5px solid rgba(255,255,255,.25)}
.btn-ghost:hover{background:rgba(255,255,255,.2)}
.btn-teal{background:var(--teal);color:#fff}
.btn-teal:hover{background:var(--teal-dark)}
.btn-sm{padding:.42rem .9rem;font-size:.8rem;border-radius:var(--r-sm)}

/* ══════════════════ ANNOUNCE BAR ══════════════════ */
.announce-bar{background:var(--indigo);color:#fff;padding:.5rem 1.5rem;text-align:center;font-size:.8rem;font-weight:500;display:flex;align-items:center;justify-content:center;gap:.75rem;position:relative}
.announce-bar a{color:#A5B4FC;font-weight:700;text-decoration:underline}
.announce-bar-close{position:absolute;right:1rem;top:50%;transform:translateY(-50%);background:none;border:none;color:rgba(255,255,255,.6);font-size:1.1rem;cursor:pointer;line-height:1}

/* ══════════════════ NAV ══════════════════ */
nav{position:sticky;top:0;z-index:200;background:rgba(249,250,251,.96);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border);padding:0 1.5rem;height:64px;display:flex;align-items:center;transition:box-shadow .2s}
nav.scrolled{box-shadow:var(--shadow-sm)}
.nav-brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.nav-logo{width:36px;height:36px;background:linear-gradient(135deg,var(--saffron),#F59E0B);border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:1rem;font-weight:700;color:#fff;box-shadow:0 2px 8px rgba(232,93,4,.3)}
.nav-brand-text{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.nav-brand-text span{color:var(--saffron)}
.nav-links{display:flex;align-items:center;gap:0;margin-left:1.75rem;flex:1;overflow-x:auto}
.nav-links::-webkit-scrollbar{display:none}
.nav-link{display:block;padding:.4rem .8rem;color:var(--muted);font-size:.84rem;font-weight:500;white-space:nowrap;border-radius:var(--r-sm);transition:color .15s,background .15s}
.nav-link:hover,.nav-link.active{color:var(--ink);background:rgba(0,0,0,.05)}
.nav-right{display:flex;align-items:center;gap:.75rem;margin-left:auto;flex-shrink:0}
.nav-login{color:var(--ink-soft);font-size:.875rem;font-weight:500;padding:.4rem .75rem;border-radius:var(--r-sm);transition:color .15s;cursor:pointer}
.nav-login:hover{color:var(--saffron)}
.nav-join{background:var(--saffron);color:#fff;padding:.44rem 1.1rem;border-radius:var(--r-sm);font-size:.84rem;font-weight:600;transition:all .15s;border:none;cursor:pointer}
.nav-join:hover{background:var(--saffron-dark);box-shadow:0 2px 8px rgba(232,93,4,.3)}
.hamburger{display:none;flex-direction:column;gap:4px;cursor:pointer;padding:.4rem;border:none;background:none}
.hamburger span{width:22px;height:2px;background:var(--ink);border-radius:2px;transition:all .2s}
@media(max-width:900px){.nav-links{display:none}.hamburger{display:flex}}
@media(max-width:560px){.nav-login{display:none}}

/* Mobile menu */
.mobile-menu{display:none;position:fixed;inset:0;z-index:300;background:var(--white);overflow-y:auto;padding:1.5rem;flex-direction:column;gap:0}
.mobile-menu.open{display:flex}
.mobile-menu-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}
.mobile-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--ink)}
.mobile-nav-link{display:block;padding:1rem 0;font-size:1.1rem;font-weight:500;color:var(--ink);border-bottom:1px solid var(--border)}
.mobile-nav-link:hover{color:var(--saffron)}
.mobile-auth{display:flex;gap:.75rem;margin-top:2rem}
.mobile-auth .btn{flex:1;justify-content:center}

/* ══════════════════ HERO ══════════════════ */
.hero{background:var(--ink);color:#fff;padding:6rem 1.5rem 5rem;position:relative;overflow:hidden;text-align:center}
.hero-bg{position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 15% 40%, rgba(232,93,4,.28) 0%, transparent 55%),radial-gradient(ellipse 55% 60% at 85% 25%, rgba(55,48,163,.35) 0%, transparent 55%),radial-gradient(ellipse 45% 45% at 55% 85%, rgba(10,123,108,.2) 0%, transparent 55%)}
.hero-bg-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);background-size:40px 40px;opacity:.6}
.hero-content{position:relative;z-index:1;max-width:880px;margin:0 auto}
.hero-eyebrow{display:inline-flex;align-items:center;gap:.6rem;background:rgba(232,93,4,.18);border:1px solid rgba(232,93,4,.4);color:#FBBF24;padding:.32rem 1rem;border-radius:var(--r-full);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:1.75rem;animation:fadeUp .6s ease both}
.hero-eyebrow-dot{width:6px;height:6px;background:#F59E0B;border-radius:50%;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.6)}}
.hero h1{font-family:var(--font-display);font-size:clamp(2.5rem,6vw,4.2rem);line-height:1.08;font-weight:700;margin-bottom:1.5rem;letter-spacing:-.025em;animation:fadeUp .6s .1s ease both}
.hero h1 em{color:#FBBF24;font-style:italic;font-weight:300}
.hero h1 strong{color:var(--saffron-mid)}
.hero-sub{font-size:1.1rem;color:rgba(255,255,255,.68);max-width:560px;margin:0 auto 2.25rem;line-height:1.7;animation:fadeUp .6s .2s ease both}
.hero-ctas{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:2.5rem;animation:fadeUp .6s .3s ease both}
.hero-search{display:flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:var(--r-full);padding:.5rem .65rem .5rem 1.25rem;max-width:480px;margin:0 auto;backdrop-filter:blur(4px);transition:border-color .2s,background .2s;animation:fadeUp .6s .4s ease both}
.hero-search:focus-within{border-color:rgba(251,191,36,.55);background:rgba(255,255,255,.1)}
.hero-search input{flex:1;background:none;border:none;outline:none;color:#fff;font-size:.9rem;font-family:var(--font-body)}
.hero-search input::placeholder{color:rgba(255,255,255,.35)}
.hero-search button{background:var(--saffron);color:#fff;border:none;border-radius:var(--r-full);padding:.42rem 1.2rem;font-weight:600;font-size:.82rem;transition:background .15s;font-family:var(--font-body)}
.hero-search button:hover{background:var(--saffron-dark)}
.hero-stats{display:flex;align-items:center;justify-content:center;gap:3rem;margin-top:3.5rem;padding-top:3rem;border-top:1px solid rgba(255,255,255,.1);flex-wrap:wrap;animation:fadeUp .6s .5s ease both}
.hero-stat{text-align:center}
.hero-stat-num{display:block;font-family:var(--font-display);font-size:2.1rem;font-weight:700;color:#FBBF24;line-height:1}
.hero-stat-label{font-size:.73rem;color:rgba(255,255,255,.4);margin-top:.3rem}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

/* ══════════════════ SOCIAL PROOF STRIP ══════════════════ */
.social-proof{background:var(--white);border-bottom:1px solid var(--border);padding:.9rem 1.5rem;overflow:hidden}
.social-proof-inner{display:flex;align-items:center;gap:2rem;max-width:1120px;margin:0 auto;flex-wrap:wrap;justify-content:center}
.proof-item{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--muted);white-space:nowrap}
.proof-item svg{color:var(--saffron);width:14px;height:14px;flex-shrink:0}
.proof-sep{color:var(--border);font-size:.9rem}

/* ══════════════════ PILLARS ══════════════════ */
.pillars-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem}
.pillar-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.75rem 1.5rem;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s;cursor:default}
.pillar-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px}
.pillar-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.pc-decomp::before{background:linear-gradient(90deg,var(--saffron),#F59E0B)}
.pc-pattern::before{background:linear-gradient(90deg,var(--teal),var(--teal-mid))}
.pc-abstraction::before{background:linear-gradient(90deg,var(--indigo),#6366F1)}
.pc-algorithm::before{background:linear-gradient(90deg,var(--gold),#D97706)}
.pillar-icon-wrap{width:52px;height:52px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:1.1rem}
.pc-decomp .pillar-icon-wrap{background:var(--saffron-light)}
.pc-pattern .pillar-icon-wrap{background:var(--teal-light)}
.pc-abstraction .pillar-icon-wrap{background:var(--indigo-light)}
.pc-algorithm .pillar-icon-wrap{background:var(--gold-light)}
.pillar-card h3{font-size:1.05rem;font-weight:700;margin-bottom:.5rem}
.pillar-card>p{font-size:.86rem;color:var(--ink-soft);line-height:1.65;margin-bottom:.9rem}
.pillar-tag{display:inline-block;font-size:.63rem;font-weight:700;padding:.22rem .55rem;border-radius:5px;letter-spacing:.06em;text-transform:uppercase}
.pc-decomp .pillar-tag{background:var(--saffron-light);color:var(--saffron-dark)}
.pc-pattern .pillar-tag{background:var(--teal-light);color:var(--teal-dark)}
.pc-abstraction .pillar-tag{background:var(--indigo-light);color:var(--indigo-dark)}
.pc-algorithm .pillar-tag{background:var(--gold-light);color:var(--gold)}
.pillar-example{margin-top:1rem;padding:.85rem;background:var(--surface);border-radius:var(--r-sm);font-size:.82rem;color:var(--ink-soft);line-height:1.6;border-left:3px solid transparent}
.pc-decomp .pillar-example{border-left-color:var(--saffron)}
.pc-pattern .pillar-example{border-left-color:var(--teal)}
.pc-abstraction .pillar-example{border-left-color:var(--indigo)}
.pc-algorithm .pillar-example{border-left-color:var(--gold)}

/* CT not CS */
.ct-not-cs{margin-top:3rem;background:linear-gradient(135deg,var(--indigo-light),var(--teal-light));border-radius:var(--r-xl);padding:2.5rem;border:1px solid var(--border)}
.ct-not-cs h3{font-family:var(--font-display);font-size:1.3rem;font-weight:700;margin-bottom:1.5rem;text-align:center}
.ct-subjects-mini{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.ct-subject-mini{background:rgba(255,255,255,.75);backdrop-filter:blur(4px);border-radius:var(--r-md);padding:1rem;font-size:.84rem;line-height:1.65;color:var(--ink-soft);border:1px solid rgba(255,255,255,.6)}
.ct-subject-mini strong{display:block;color:var(--ink);font-size:.88rem;margin-bottom:.35rem}

/* ══════════════════ FEATURES / HOW IT WORKS ══════════════════ */
.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}
.feature-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.75rem;transition:box-shadow .2s,border-color .2s}
.feature-card:hover{box-shadow:var(--shadow-sm);border-color:var(--saffron)}
.feature-icon{width:52px;height:52px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:1rem}
.fi-1{background:var(--saffron-light)}.fi-2{background:var(--teal-light)}.fi-3{background:var(--indigo-light)}.fi-4{background:var(--gold-light)}.fi-5{background:#FEE2E2}.fi-6{background:#F0FDF4}
.feature-card h3{font-size:1rem;font-weight:700;margin-bottom:.45rem}
.feature-card p{font-size:.85rem;color:var(--muted);line-height:1.65}

/* ══════════════════ TEACHER SPOTLIGHTS ══════════════════ */
.spotlight-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}
.spotlight-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);overflow:hidden;transition:box-shadow .2s}
.spotlight-card:hover{box-shadow:var(--shadow-md)}
.spotlight-hero{padding:1.5rem;position:relative}
.spotlight-hero-tag{position:absolute;top:1rem;right:1rem;background:rgba(255,255,255,.75);border-radius:var(--r-sm);padding:.25rem .6rem;font-size:.7rem;font-weight:700}
.spotlight-emoji{font-size:2rem;margin-bottom:.5rem;display:block}
.spotlight-location{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.3rem}
.spotlight-hero h4{font-size:1rem;font-weight:700;line-height:1.35}
.spotlight-body{padding:1.25rem}
.avatar{width:40px;height:40px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem}
.av1{background:#FEE2E2;color:#991B1B}.av2{background:var(--teal-light);color:var(--teal-dark)}.av3{background:var(--indigo-light);color:var(--indigo-dark)}.av4{background:#FEF3C7;color:#78350F}.av5{background:#F0FDF4;color:#166534}.av6{background:#FCE7F3;color:#9D174D}
.spotlight-quote{font-size:.845rem;color:var(--ink-soft);line-height:1.65}

/* ══════════════════ BOARDS SECTION ══════════════════ */
.boards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.25rem}
.board-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.5rem;text-align:center;transition:box-shadow .2s,border-color .2s;cursor:pointer}
.board-card:hover{box-shadow:var(--shadow-sm)}
.board-emoji{font-size:2rem;display:block;margin-bottom:.75rem}
.board-name{font-weight:700;font-size:.95rem;margin-bottom:.25rem}
.board-meta{font-size:.78rem;color:var(--muted)}
.board-card.bc-cbse{border-top:3px solid #F59E0B}.board-card.bc-icse{border-top:3px solid var(--teal)}.board-card.bc-ib{border-top:3px solid var(--indigo)}.board-card.bc-igcse{border-top:3px solid #EC4899}.board-card.bc-state{border-top:3px solid var(--green,#15803D)}

/* ══════════════════ STATS BANNER ══════════════════ */
.stats-banner{background:var(--ink);color:#fff;padding:4rem 1.5rem;position:relative;overflow:hidden}
.stats-banner::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 80% at 50% 50%, rgba(232,93,4,.15) 0%, transparent 70%)}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:2rem;position:relative;max-width:900px;margin:0 auto}
.stat-item{text-align:center}
.stat-num{display:block;font-family:var(--font-display);font-size:2.5rem;font-weight:700;color:#FBBF24;line-height:1;margin-bottom:.35rem}
.stat-label{font-size:.82rem;color:rgba(255,255,255,.45)}

/* ══════════════════ CTA BANNER ══════════════════ */
.cta-banner{background:var(--ink);color:#fff;padding:5rem 1.5rem;text-align:center;position:relative;overflow:hidden}
.cta-banner::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 70% at 50% 50%, rgba(232,93,4,.18) 0%, transparent 70%)}
.cta-banner .cta-inner{position:relative;max-width:560px;margin:0 auto}
.cta-banner h2{font-family:var(--font-display);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;margin-bottom:.75rem}
.cta-banner p{color:rgba(255,255,255,.62);font-size:1rem;margin-bottom:2rem;line-height:1.7}
.cta-form{display:flex;gap:.6rem;max-width:420px;margin:0 auto;flex-wrap:wrap;justify-content:center}
.cta-form input{flex:1;min-width:200px;border:1.5px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);border-radius:var(--r-sm);padding:.65rem 1rem;font-size:.9rem;color:#fff;outline:none;font-family:var(--font-body)}
.cta-form input::placeholder{color:rgba(255,255,255,.32)}
.cta-form input:focus{border-color:rgba(251,191,36,.55)}

/* ══════════════════ FOOTER ══════════════════ */
footer{background:var(--ink);color:rgba(255,255,255,.55);padding:4rem 1.5rem 2rem;font-size:.875rem}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:2.5rem;max-width:1120px;margin:0 auto;padding-bottom:3rem;border-bottom:1px solid rgba(255,255,255,.1)}
@media(max-width:900px){.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.footer-grid{grid-template-columns:1fr}}
.footer-brand p{font-size:.84rem;line-height:1.75;margin-top:.85rem;color:rgba(255,255,255,.4);max-width:280px}
.footer-logo{display:flex;align-items:center;gap:.6rem}
.footer-logo-icon{width:36px;height:36px;background:linear-gradient(135deg,var(--saffron),#F59E0B);border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:1rem;font-weight:700;color:#fff}
.footer-logo-text{font-family:var(--font-display);font-size:1.2rem;font-weight:700;color:#fff}
.footer-social{display:flex;gap:.6rem;margin-top:1.25rem}
.footer-social a{width:34px;height:34px;border-radius:var(--r-sm);background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:.85rem;color:rgba(255,255,255,.5);transition:all .15s}
.footer-social a:hover{background:var(--saffron);color:#fff}
.footer-col h5{color:#fff;font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:1.1rem}
.footer-col a{display:block;color:rgba(255,255,255,.42);margin-bottom:.6rem;font-size:.84rem;transition:color .15s}
.footer-col a:hover{color:#fff}
.footer-bottom{max-width:1120px;margin:2rem auto 0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;font-size:.78rem;color:rgba(255,255,255,.3)}
.footer-bottom-links{display:flex;gap:1.25rem}
.footer-bottom-links a{color:rgba(255,255,255,.3);transition:color .15s}
.footer-bottom-links a:hover{color:rgba(255,255,255,.7)}

/* ══════════════════ MODAL ══════════════════ */
.modal-overlay{position:fixed;inset:0;z-index:500;background:rgba(13,17,23,.7);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:1.5rem}
.modal-overlay.open{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);padding:2.5rem 2rem;max-width:440px;width:100%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:var(--shadow-lg)}
.modal-close{position:absolute;top:1rem;right:1rem;background:var(--surface);border:1px solid var(--border);width:32px;height:32px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--muted);transition:all .15s}
.modal-close:hover{background:var(--border);color:var(--ink)}
.auth-tabs{display:flex;border-bottom:1px solid var(--border);margin-bottom:1.75rem}
.auth-tab{flex:1;padding:.75rem;text-align:center;font-size:.9rem;font-weight:600;color:var(--muted);cursor:pointer;border:none;background:none;border-bottom:2.5px solid transparent;transition:all .15s;font-family:var(--font-body)}
.auth-tab.active{color:var(--saffron);border-bottom-color:var(--saffron)}
.auth-pane{display:none}.auth-pane.active{display:block}
.form-group{margin-bottom:1.1rem}
.form-label{display:block;font-size:.82rem;font-weight:600;color:var(--ink-soft);margin-bottom:.35rem}
.form-input{width:100%;border:1.5px solid var(--border);border-radius:var(--r-sm);padding:.65rem .85rem;font-size:.9rem;color:var(--ink);outline:none;transition:border-color .15s;font-family:var(--font-body);background:var(--white)}
.form-input:focus{border-color:var(--saffron)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.social-login{display:flex;gap:.75rem;margin-top:.5rem}
.social-login-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem;border:1.5px solid var(--border);border-radius:var(--r-sm);font-size:.83rem;font-weight:500;color:var(--ink-soft);background:var(--white);cursor:pointer;transition:border-color .15s;font-family:var(--font-body)}
.social-login-btn:hover{border-color:var(--border)}
.auth-divider{text-align:center;font-size:.78rem;color:var(--muted);margin:1rem 0;position:relative}
.auth-divider::before,.auth-divider::after{content:'';position:absolute;top:50%;width:42%;height:1px;background:var(--border)}
.auth-divider::before{left:0}.auth-divider::after{right:0}

/* ══════════════════ TOAST ══════════════════ */
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.7rem 1.4rem;border-radius:var(--r-full);font-size:.86rem;font-weight:500;box-shadow:var(--shadow-md);opacity:0;transition:all .3s;pointer-events:none;z-index:999;white-space:nowrap}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ══════════════════ GRADE BANDS ══════════════════ */
.grade-bands-wrap{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
@media(max-width:700px){.grade-bands-wrap{grid-template-columns:repeat(3,1fr)}}
@media(max-width:450px){.grade-bands-wrap{grid-template-columns:repeat(2,1fr)}}
.grade-band{border-radius:var(--r-lg);padding:1.5rem 1rem;text-align:center;cursor:pointer;transition:transform .2s,box-shadow .2s;border:1.5px solid transparent;user-select:none}
.grade-band:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.gb1{background:linear-gradient(135deg,#FFF4EE,#FFE4CC);border-color:#FFD0A8}
.gb2{background:linear-gradient(135deg,#FFF9E6,#FEEFC3);border-color:#FDDFA0}
.gb3{background:linear-gradient(135deg,#EFF9F7,#C6EBE4);border-color:#A0D9CE}
.gb4{background:linear-gradient(135deg,var(--indigo-light),#D4CEF5);border-color:#B4ABEC}
.gb5{background:linear-gradient(135deg,#FFF1F2,#FDD8DC);border-color:#F9B8BF}
.grade-emoji{display:block;font-size:1.75rem;margin-bottom:.5rem}
.grade-label{font-weight:700;font-size:.9rem;color:var(--ink);margin-bottom:.2rem}
.grade-sub{font-size:.75rem;color:var(--muted)}

/* ══════════════════ RESPONSIVE ══════════════════ */
@media(max-width:700px){
  .hero{padding:4rem 1.25rem 3.5rem}
  .hero-stats{gap:1.5rem}
  .section{padding:3.5rem 0}
  .footer-grid{gap:1.75rem}
  .stats-grid{gap:1.5rem}
}

/* ===== lessons.html ===== */
:root{--saffron:#E85D04;--saffron-light:#FEF0E7;--saffron-mid:#F48C42;--saffron-dark:#9A3E00;--teal:#0A7B6C;--teal-light:#E0F4F1;--teal-mid:#29A898;--teal-dark:#064E46;--indigo:#3730A3;--indigo-light:#EEF2FF;--indigo-dark:#1E1B6E;--gold:#B45309;--gold-light:#FEFCE8;--ink:#0D1117;--ink-soft:#374151;--muted:#6B7280;--border:#E5E7EB;--surface:#F9FAFB;--white:#FFFFFF;--font-display: Arial, sans-serif;--font-body: Arial, sans-serif;--r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-full:999px;--shadow-sm:0 2px 10px rgba(0,0,0,0.08);--shadow-md:0 4px 24px rgba(0,0,0,0.12);--shadow-lg:0 8px 48px rgba(0,0,0,0.16)}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}ul,ol{list-style:none}
button{font-family:var(--font-body);cursor:pointer}

.container{max-width:1120px;margin:0 auto;padding:0 1.5rem}
.section{padding:5rem 0}
.section-alt{background:var(--white)}
.eyebrow{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--saffron);margin-bottom:.6rem}
.section-title{font-family:var(--font-display);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.12;margin-bottom:.75rem}
.section-sub{color:var(--muted);font-size:1rem;max-width:520px;line-height:1.7}

.badge{display:inline-flex;align-items:center;font-size:.68rem;font-weight:700;padding:.2rem .55rem;border-radius:6px;letter-spacing:.03em;white-space:nowrap}
.badge-cbse{background:#FEF3C7;color:#92400E}.badge-icse{background:var(--teal-light);color:var(--teal-dark)}.badge-ib{background:var(--indigo-light);color:var(--indigo-dark)}.badge-igcse{background:#FCE7F3;color:#9D174D}.badge-state{background:#F0FDF4;color:#166534}
.badge-grade{background:var(--surface);color:var(--ink-soft);border:1px solid var(--border)}.badge-unplugged{background:#F0FDF4;color:#166534}.badge-plugged{background:#EFF6FF;color:#1E40AF}.badge-project{background:#FFF7ED;color:#9A3E00}
.ct-pill{display:inline-flex;align-items:center;font-size:.62rem;font-weight:700;padding:.15rem .45rem;border-radius:4px;letter-spacing:.04em}
.ct-d{background:#FEE2E2;color:#991B1B}.ct-p{background:var(--teal-light);color:var(--teal-dark)}.ct-a{background:var(--indigo-light);color:var(--indigo-dark)}.ct-al{background:#FEF3C7;color:#78350F}

.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.72rem 1.5rem;border-radius:var(--r-md);font-weight:600;font-size:.875rem;transition:all .18s;border:none;cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--saffron);color:#fff}.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-sm{padding:.42rem .9rem;font-size:.8rem;border-radius:var(--r-sm)}

/* NAV */
nav{position:sticky;top:0;z-index:200;background:rgba(249,250,251,.96);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);padding:0 1.5rem;height:64px;display:flex;align-items:center;transition:box-shadow .2s}
nav.scrolled{box-shadow:var(--shadow-sm)}
.nav-brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.nav-logo{width:36px;height:36px;background:linear-gradient(135deg,var(--saffron),#F59E0B);border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:1rem;font-weight:700;color:#fff}
.nav-brand-text{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--ink)}
.nav-brand-text span{color:var(--saffron)}
.nav-links{display:flex;align-items:center;gap:0;margin-left:1.75rem;flex:1;overflow-x:auto}
.nav-links::-webkit-scrollbar{display:none}
.nav-link{display:block;padding:.4rem .8rem;color:var(--muted);font-size:.84rem;font-weight:500;white-space:nowrap;border-radius:var(--r-sm);transition:color .15s,background .15s}
.nav-link:hover,.nav-link.active{color:var(--ink);background:rgba(0,0,0,.05)}
.nav-right{display:flex;align-items:center;gap:.75rem;margin-left:auto;flex-shrink:0}
.nav-join{background:var(--saffron);color:#fff;padding:.44rem 1.1rem;border-radius:var(--r-sm);font-size:.84rem;font-weight:600;transition:all .15s;border:none;cursor:pointer}
.nav-join:hover{background:var(--saffron-dark)}
.hamburger{display:none;flex-direction:column;gap:4px;cursor:pointer;padding:.4rem;border:none;background:none}
.hamburger span{width:22px;height:2px;background:var(--ink);border-radius:2px}
@media(max-width:900px){.nav-links{display:none}.hamburger{display:flex}}
.mobile-menu{display:none;position:fixed;inset:0;z-index:300;background:var(--white);overflow-y:auto;padding:1.5rem;flex-direction:column}
.mobile-menu.open{display:flex}
.mobile-menu-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}
.mobile-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--ink)}
.mobile-nav-link{display:block;padding:1rem 0;font-size:1.1rem;font-weight:500;color:var(--ink);border-bottom:1px solid var(--border)}
.mobile-auth{display:flex;gap:.75rem;margin-top:2rem}
.mobile-auth .btn{flex:1;justify-content:center}

/* PAGE HERO */
.page-hero{background:var(--ink);color:#fff;padding:4rem 1.5rem 3.5rem;position:relative;overflow:hidden}
.page-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 20% 50%, rgba(232,93,4,.22) 0%, transparent 55%),radial-gradient(ellipse 50% 55% at 80% 30%, rgba(55,48,163,.28) 0%, transparent 55%)}
.page-hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);background-size:40px 40px}
.page-hero-inner{position:relative;z-index:1;max-width:700px}
.page-hero h1{font-family:var(--font-display);font-size:clamp(2rem,4.5vw,3.2rem);font-weight:700;line-height:1.1;margin-bottom:.85rem;letter-spacing:-.02em}
.page-hero p{color:rgba(255,255,255,.62);font-size:1rem;line-height:1.7;max-width:520px}
.page-hero-stats{display:flex;gap:2.5rem;margin-top:2rem;flex-wrap:wrap}
.ph-stat{text-align:left}
.ph-stat-num{display:block;font-family:var(--font-display);font-size:1.6rem;font-weight:700;color:#FBBF24;line-height:1}
.ph-stat-label{font-size:.75rem;color:rgba(255,255,255,.4);margin-top:.2rem}

/* FILTERS */
.filters-wrap{background:var(--white);border-bottom:1px solid var(--border);padding:1.25rem 0;position:sticky;top:64px;z-index:100}
.filters-inner{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap;max-width:1120px;margin:0 auto;padding:0 1.5rem}
.filter-group{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.filter-label{font-size:.75rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}
.filter-btn{padding:.38rem .85rem;border-radius:var(--r-full);font-size:.78rem;font-weight:600;border:1.5px solid var(--border);background:var(--white);color:var(--ink-soft);cursor:pointer;transition:all .15s;white-space:nowrap}
.filter-btn:hover,.filter-btn.active{border-color:var(--saffron);color:var(--saffron);background:var(--saffron-light)}
.filter-sep{width:1px;height:24px;background:var(--border);flex-shrink:0}

/* TAB STRIP */
.tab-strip{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:2rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}
.tab-btn{padding:.55rem 1.05rem;border-radius:var(--r-full);font-size:.82rem;font-weight:600;border:1.5px solid var(--border);background:var(--white);color:var(--ink-soft);cursor:pointer;transition:all .15s;white-space:nowrap}
.tab-btn:hover{border-color:var(--saffron);color:var(--saffron)}
.tab-btn.active{background:var(--saffron);border-color:var(--saffron);color:#fff}

.subject-pane{display:none}.subject-pane.active{display:block}

/* LESSONS GRID */
.lessons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.25rem}
.lesson-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.4rem;transition:box-shadow .2s,border-color .2s}
.lesson-card:hover{box-shadow:var(--shadow-sm);border-color:var(--saffron-mid)}
.lesson-meta{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.8rem}
.lesson-card h4{font-size:.95rem;font-weight:700;line-height:1.35;margin-bottom:.5rem;color:var(--ink)}
.lesson-card p{font-size:.845rem;color:var(--ink-soft);line-height:1.65;margin-bottom:.85rem}
.lesson-footer{display:flex;gap:.3rem;flex-wrap:wrap;padding-top:.75rem;border-top:1px solid var(--border)}
.lesson-actions{display:flex;gap:.5rem;justify-content:flex-end;margin-top:.75rem}

/* GLOSSARY */
.glossary-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem}
.glossary-item{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-md);padding:1.25rem;transition:border-color .15s}
.glossary-item:hover{border-color:var(--saffron)}
.g-term{font-family:var(--font-display);font-size:.95rem;font-weight:600;color:var(--saffron);margin-bottom:.35rem}
.g-def{font-size:.845rem;color:var(--ink-soft);line-height:1.65}
.g-example{margin-top:.6rem;font-size:.78rem;color:var(--teal-dark);font-style:italic;padding:.4rem .65rem;background:var(--teal-light);border-radius:var(--r-sm);line-height:1.5}

/* MODAL */
.modal-overlay{position:fixed;inset:0;z-index:500;background:rgba(13,17,23,.7);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:1.5rem}
.modal-overlay.open{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);padding:2.5rem 2rem;max-width:440px;width:100%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:var(--shadow-lg)}
.modal-close{position:absolute;top:1rem;right:1rem;background:var(--surface);border:1px solid var(--border);width:32px;height:32px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--muted);transition:all .15s}
.modal-close:hover{background:var(--border);color:var(--ink)}
.auth-tabs{display:flex;border-bottom:1px solid var(--border);margin-bottom:1.75rem}
.auth-tab{flex:1;padding:.75rem;text-align:center;font-size:.9rem;font-weight:600;color:var(--muted);cursor:pointer;border:none;background:none;border-bottom:2.5px solid transparent;transition:all .15s;font-family:var(--font-body)}
.auth-tab.active{color:var(--saffron);border-bottom-color:var(--saffron)}
.auth-pane{display:none}.auth-pane.active{display:block}
.form-group{margin-bottom:1.1rem}
.form-label{display:block;font-size:.82rem;font-weight:600;color:var(--ink-soft);margin-bottom:.35rem}
.form-input{width:100%;border:1.5px solid var(--border);border-radius:var(--r-sm);padding:.65rem .85rem;font-size:.9rem;color:var(--ink);outline:none;transition:border-color .15s;font-family:var(--font-body);background:var(--white)}
.form-input:focus{border-color:var(--saffron)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}

/* TOAST */
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.7rem 1.4rem;border-radius:var(--r-full);font-size:.86rem;font-weight:500;box-shadow:var(--shadow-md);opacity:0;transition:all .3s;pointer-events:none;z-index:999;white-space:nowrap}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

footer{background:var(--ink);color:rgba(255,255,255,.5);padding:3rem 1.5rem 2rem;font-size:.875rem}
.footer-bottom{max-width:1120px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;font-size:.78rem;color:rgba(255,255,255,.3)}
.footer-bottom a{color:rgba(255,255,255,.3);margin-left:1.25rem;transition:color .15s}
.footer-bottom a:hover{color:rgba(255,255,255,.7)}

@media(max-width:700px){.page-hero{padding:3rem 1.25rem 2.5rem}.section{padding:3.5rem 0}.lessons-grid{grid-template-columns:1fr}}

/* ===== resources.html ===== */
:root{--saffron:#E85D04;--saffron-light:#FEF0E7;--saffron-dark:#9A3E00;--teal:#0A7B6C;--teal-light:#E0F4F1;--teal-mid:#29A898;--teal-dark:#064E46;--indigo:#3730A3;--indigo-light:#EEF2FF;--indigo-dark:#1E1B6E;--gold:#B45309;--gold-light:#FEFCE8;--green:#15803D;--green-light:#F0FDF4;--ink:#0D1117;--ink-soft:#374151;--muted:#6B7280;--border:#E5E7EB;--surface:#F9FAFB;--white:#FFFFFF;--font-display: Arial, sans-serif;--font-body: Arial, sans-serif;--r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-full:999px;--shadow-sm:0 2px 10px rgba(0,0,0,0.08);--shadow-md:0 4px 24px rgba(0,0,0,0.12);--shadow-lg:0 8px 48px rgba(0,0,0,0.16)}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.7;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}ul,ol{list-style:none}button{font-family:var(--font-body);cursor:pointer}
.container{max-width:1120px;margin:0 auto;padding:0 1.5rem}
.section{padding:5rem 0}.section-alt{background:var(--white)}
.eyebrow{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--saffron);margin-bottom:.6rem}
.section-title{font-family:var(--font-display);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;line-height:1.12;margin-bottom:.75rem}
.section-sub{color:var(--muted);font-size:1rem;max-width:520px;line-height:1.7}
.section-header{text-align:center;margin-bottom:3rem}
.section-header .section-sub{margin:0 auto}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.72rem 1.5rem;border-radius:var(--r-md);font-weight:600;font-size:.875rem;transition:all .18s;border:none;cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--saffron);color:#fff}.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-sm{padding:.42rem .9rem;font-size:.8rem;border-radius:var(--r-sm)}
.btn-teal{background:var(--teal);color:#fff}.btn-teal:hover{background:var(--teal-dark)}

/* NAV */
nav{position:sticky;top:0;z-index:200;background:rgba(249,250,251,.96);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);padding:0 1.5rem;height:64px;display:flex;align-items:center;transition:box-shadow .2s}
nav.scrolled{box-shadow:var(--shadow-sm)}
.nav-brand{display:flex;align-items:center;gap:10px}
.nav-logo{width:36px;height:36px;background:linear-gradient(135deg,var(--saffron),#F59E0B);border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:1rem;font-weight:700;color:#fff}
.nav-brand-text{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--ink)}.nav-brand-text span{color:var(--saffron)}
.nav-links{display:flex;align-items:center;margin-left:1.75rem;flex:1;overflow-x:auto}.nav-links::-webkit-scrollbar{display:none}
.nav-link{display:block;padding:.4rem .8rem;color:var(--muted);font-size:.84rem;font-weight:500;white-space:nowrap;border-radius:var(--r-sm);transition:color .15s,background .15s}
.nav-link:hover,.nav-link.active{color:var(--ink);background:rgba(0,0,0,.05)}
.nav-right{display:flex;align-items:center;gap:.75rem;margin-left:auto;flex-shrink:0}
.nav-join{background:var(--saffron);color:#fff;padding:.44rem 1.1rem;border-radius:var(--r-sm);font-size:.84rem;font-weight:600;transition:all .15s;border:none;cursor:pointer}.nav-join:hover{background:var(--saffron-dark)}
.hamburger{display:none;flex-direction:column;gap:4px;cursor:pointer;padding:.4rem;border:none;background:none}
.hamburger span{width:22px;height:2px;background:var(--ink);border-radius:2px}
@media(max-width:900px){.nav-links{display:none}.hamburger{display:flex}}
.mobile-menu{display:none;position:fixed;inset:0;z-index:300;background:var(--white);overflow-y:auto;padding:1.5rem;flex-direction:column}
.mobile-menu.open{display:flex}
.mobile-menu-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}
.mobile-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--ink)}
.mobile-nav-link{display:block;padding:1rem 0;font-size:1.1rem;font-weight:500;color:var(--ink);border-bottom:1px solid var(--border)}
.mobile-auth{display:flex;gap:.75rem;margin-top:2rem}.mobile-auth .btn{flex:1;justify-content:center}

/* PAGE HERO */
.page-hero{background:var(--ink);color:#fff;padding:4rem 1.5rem 3.5rem;position:relative;overflow:hidden}
.page-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 70% 40%, rgba(180,83,9,.22) 0%, transparent 55%),radial-gradient(ellipse 50% 60% at 20% 60%, rgba(55,48,163,.25) 0%, transparent 55%)}
.page-hero-inner{position:relative;z-index:1;max-width:700px}
.page-hero h1{font-family:var(--font-display);font-size:clamp(2rem,4.5vw,3.2rem);font-weight:700;line-height:1.1;margin-bottom:.85rem;letter-spacing:-.02em}
.page-hero p{color:rgba(255,255,255,.62);font-size:1rem;line-height:1.7;max-width:520px}

/* RESOURCE CARDS */
.resources-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}
.resource-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.5rem;display:flex;flex-direction:column;transition:box-shadow .2s,border-color .2s}
.resource-card:hover{box-shadow:var(--shadow-sm);border-color:var(--teal)}
.resource-icon{width:48px;height:48px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:1rem}
.ri-pdf{background:#FEE2E2}.ri-doc{background:var(--indigo-light)}.ri-video{background:#FEF3C7}.ri-template{background:var(--teal-light)}.ri-audio{background:#F0FDF4}
.resource-card h4{font-size:.93rem;font-weight:700;margin-bottom:.4rem;line-height:1.35}
.resource-card p{font-size:.835rem;color:var(--ink-soft);line-height:1.6;flex:1}
.resource-footer{margin-top:1rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem}
.resource-meta{font-size:.75rem;color:var(--muted)}
.resource-dl{display:inline-flex;align-items:center;gap:.35rem;font-size:.78rem;font-weight:700;color:var(--teal);border:1.5px solid var(--teal-light);padding:.3rem .7rem;border-radius:var(--r-sm);transition:all .15s;background:none;cursor:pointer;font-family:var(--font-body)}
.resource-dl:hover{background:var(--teal);color:#fff;border-color:var(--teal)}
.resource-locked{display:inline-flex;align-items:center;gap:.35rem;font-size:.78rem;font-weight:700;color:var(--muted);border:1.5px solid var(--border);padding:.3rem .7rem;border-radius:var(--r-sm);background:none;cursor:pointer;font-family:var(--font-body)}
.resource-locked:hover{border-color:var(--saffron);color:var(--saffron)}

/* ASSESSMENT SECTION */
.assessment-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.25rem;margin-bottom:2.5rem}
.assess-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.5rem}
.assess-icon{width:48px;height:48px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:1rem}
.assess-card h4{font-size:.95rem;font-weight:700;margin-bottom:.45rem}
.assess-card p{font-size:.845rem;color:var(--ink-soft);line-height:1.65}

/* PROFICIENCY LADDER */
.proficiency-ladder{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);padding:2rem;margin-bottom:2rem}
.proficiency-ladder h3{font-family:var(--font-display);font-size:1.15rem;font-weight:700;margin-bottom:1.25rem}
.ladder-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:.75rem}
.ladder-level{border-radius:var(--r-md);padding:1.1rem;text-align:center}
.ll-1{background:#FFF8F5;border:1px solid #FFD0A8}
.ll-2{background:var(--teal-light);border:1px solid #A8DDD8}
.ll-3{background:var(--indigo-light);border:1px solid #C4BAF0}
.ll-4{background:var(--gold-light);border:1px solid #F5D88A}
.ll-5{background:var(--green-light);border:1px solid #A7D7B8}
.ladder-emoji{font-size:1.3rem;margin-bottom:.4rem;display:block}
.ladder-title{font-size:.8rem;font-weight:700;margin-bottom:.3rem}
.ll-1 .ladder-title{color:var(--saffron-dark)}.ll-2 .ladder-title{color:var(--teal-dark)}.ll-3 .ladder-title{color:var(--indigo-dark)}.ll-4 .ladder-title{color:var(--gold)}.ll-5 .ladder-title{color:var(--green)}
.ladder-desc{font-size:.75rem;color:var(--muted);line-height:1.5}

/* MULTILINGUAL CT */
.lang-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.25rem}
.lang-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.5rem}
.lang-flag{font-size:1.4rem;margin-bottom:.75rem;display:block}
.lang-card h4{font-size:.95rem;font-weight:700;margin-bottom:.9rem}
.lang-vocab{display:flex;flex-direction:column;gap:.5rem}
.lang-row{display:flex;justify-content:space-between;align-items:center;padding:.4rem 0;border-bottom:1px solid var(--border);font-size:.845rem}
.lang-row:last-child{border-bottom:none}
.lang-term{font-weight:600}
.lang-translation{font-weight:700}
.lang-example{margin-top:1rem;padding:.75rem;border-radius:var(--r-sm);font-size:.78rem;line-height:1.55}

/* APP SECTION */
.app-section{background:linear-gradient(135deg,var(--indigo-light),var(--teal-light));padding:4rem 1.5rem;border-top:1px solid var(--border)}
.app-content{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;max-width:1000px;margin:0 auto}
@media(max-width:700px){.app-content{grid-template-columns:1fr;text-align:center}}
.app-text h2{font-family:var(--font-display);font-size:clamp(1.6rem,3vw,2.2rem);font-weight:700;margin-bottom:.75rem}
.app-text p{color:var(--ink-soft);font-size:.95rem;margin-bottom:1.5rem;line-height:1.65}
.app-badges{display:flex;gap:.75rem;flex-wrap:wrap}
@media(max-width:700px){.app-badges{justify-content:center}}
.app-badge-btn{display:flex;align-items:center;gap:.65rem;background:var(--ink);color:#fff;border-radius:var(--r-md);padding:.7rem 1.25rem;font-size:.835rem;transition:transform .15s,box-shadow .15s;border:none;cursor:pointer;font-family:var(--font-body)}
.app-badge-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.app-badge-btn .store-icon{font-size:1.4rem;line-height:1}
.app-badge-btn small{display:block;font-size:.62rem;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.05em}
.app-badge-btn strong{display:block;font-size:.9rem;font-weight:700}
.app-mockup{background:var(--white);border-radius:var(--r-xl);padding:1.75rem;box-shadow:var(--shadow-lg);border:1px solid var(--border)}
.app-mockup-dots{display:flex;gap:.4rem;margin-bottom:1rem}
.app-dot{width:10px;height:10px;border-radius:50%}
.ad-red{background:#FF5F57}.ad-yellow{background:#FEBC2E}.ad-green{background:#28C840}
.app-screen{background:var(--surface);border-radius:var(--r-md);padding:1rem;display:flex;flex-direction:column;gap:.75rem}
.mock-nav-bar{background:var(--white);border-radius:var(--r-sm);padding:.6rem .9rem;display:flex;align-items:center;justify-content:space-between;border:1px solid var(--border)}
.mock-brand{font-family:var(--font-display);font-size:.85rem;font-weight:700;color:var(--saffron)}
.mock-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-sm);padding:.75rem}
.mock-card-head{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem}
.mock-av{width:22px;height:22px;border-radius:50%;background:var(--saffron-light);flex-shrink:0}
.mock-name{font-size:.7rem;font-weight:600}
.mock-body{font-size:.68rem;color:var(--muted);line-height:1.5}
.mock-pills{display:flex;gap:.4rem;margin-top:.4rem}
.mock-pill{font-size:.58rem;font-weight:700;padding:.1rem .35rem;border-radius:3px}
.mp-1{background:#FEE2E2;color:#991B1B}.mp-2{background:var(--teal-light);color:var(--teal-dark)}.mp-3{background:#FEF3C7;color:#78350F}

/* MODAL */
.modal-overlay{position:fixed;inset:0;z-index:500;background:rgba(13,17,23,.7);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:1.5rem}
.modal-overlay.open{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);padding:2.5rem 2rem;max-width:440px;width:100%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:var(--shadow-lg)}
.modal-close{position:absolute;top:1rem;right:1rem;background:var(--surface);border:1px solid var(--border);width:32px;height:32px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;color:var(--muted)}
.modal-close:hover{background:var(--border);color:var(--ink)}
.auth-tabs{display:flex;border-bottom:1px solid var(--border);margin-bottom:1.75rem}
.auth-tab{flex:1;padding:.75rem;text-align:center;font-size:.9rem;font-weight:600;color:var(--muted);cursor:pointer;border:none;background:none;border-bottom:2.5px solid transparent;transition:all .15s;font-family:var(--font-body)}
.auth-tab.active{color:var(--saffron);border-bottom-color:var(--saffron)}
.auth-pane{display:none}.auth-pane.active{display:block}
.form-group{margin-bottom:1.1rem}
.form-label{display:block;font-size:.82rem;font-weight:600;color:var(--ink-soft);margin-bottom:.35rem}
.form-input{width:100%;border:1.5px solid var(--border);border-radius:var(--r-sm);padding:.65rem .85rem;font-size:.9rem;color:var(--ink);outline:none;transition:border-color .15s;font-family:var(--font-body);background:var(--white)}
.form-input:focus{border-color:var(--saffron)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.7rem 1.4rem;border-radius:var(--r-full);font-size:.86rem;font-weight:500;box-shadow:var(--shadow-md);opacity:0;transition:all .3s;pointer-events:none;z-index:999;white-space:nowrap}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
footer{background:var(--ink);padding:2rem 1.5rem}
.footer-bottom{max-width:1120px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem;font-size:.78rem;color:rgba(255,255,255,.3)}
.footer-bottom a{color:rgba(255,255,255,.3);margin-left:1.25rem;transition:color .15s}.footer-bottom a:hover{color:rgba(255,255,255,.7)}
@media(max-width:700px){.page-hero{padding:3rem 1.25rem 2.5rem}.section{padding:3.5rem 0}.resources-grid{grid-template-columns:1fr}.lang-grid{grid-template-columns:1fr}}

/* ===== subject-art.html ===== */
:root{
  --saffron:#E85D04;--saffron-light:#FEF0E7;--saffron-dark:#9A3E00;
  --teal:#0A7B6C;--teal-light:#E0F4F1;--teal-dark:#064E46;
  --indigo:#3730A3;--indigo-light:#EEF2FF;--indigo-dark:#1E1B6E;
  --gold:#B45309;--gold-light:#FEFCE8;
  --rose:#BE123C;--rose-light:#FFF1F2;
  --green:#15803D;--green-light:#F0FDF4;--green-dark:#14532D;
  --violet:#7C3AED;--violet-light:#F5F3FF;--violet-dark:#4C1D95;
  --ink:#111827;--ink-soft:#374151;--muted:#6B7280;
  --border:#E5E7EB;--surface:#F9FAFB;--white:#FFFFFF;
  --font-display: Arial, sans-serif;
  --font-body: Arial, sans-serif;
  --r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-full:999px;
  --shadow-sm:0 2px 10px rgba(0,0,0,.08);
  --shadow-md:0 4px 24px rgba(0,0,0,.10);
  --shadow-lg:0 8px 40px rgba(0,0,0,.14);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}ul,ol{list-style:none}[id]{scroll-margin-top:76px}

nav{position:sticky;top:0;z-index:200;background:rgba(249,250,251,.97);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);height:64px;display:flex;align-items:center;padding:0 2rem;gap:1rem}
.nav-logo{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--ink)}.nav-logo span{color:var(--saffron)}
.nav-breadcrumb{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--muted)}
.nav-breadcrumb a:hover{color:var(--saffron)}
.nav-sep{color:#d1d5db}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:.75rem}
.btn{display:inline-flex;align-items:center;padding:.55rem 1.25rem;border-radius:var(--r-md);font-weight:600;font-size:.875rem;transition:all .18s;border:none;cursor:pointer;font-family:var(--font-body)}
.btn-primary{background:var(--saffron);color:#fff}.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-sm{padding:.4rem 1rem;font-size:.8rem}

.hero{color:#fff;padding:5rem 2rem 4rem;position:relative;overflow:hidden;background:var(--ink)}
.hero-bg{position:absolute;inset:0}
.hero-inner{position:relative;z-index:1;max-width:860px;margin:0 auto}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;padding:.28rem .9rem;border-radius:var(--r-full);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:1.4rem}
.hero h1{font-family:var(--font-display);font-size:clamp(1.9rem,4.5vw,3.1rem);line-height:1.1;font-weight:700;letter-spacing:-.02em;margin-bottom:1.1rem}
.hero h1 em{font-style:italic;font-weight:300;color:#FBBF24}
.hero-sub{font-size:1rem;color:rgba(255,255,255,.68);max-width:600px;line-height:1.7;margin-bottom:1.8rem}
.hero-meta{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.hero-meta-item{font-size:.8rem;color:rgba(255,255,255,.45)}
.hero-meta-item span{color:rgba(255,255,255,.7);font-weight:500}
.hero-tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1.1rem}
.tag{display:inline-flex;align-items:center;padding:.2rem .65rem;border-radius:var(--r-full);font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.tag-a{background:rgba(232,93,4,.25);color:#FBBF24;border:1px solid rgba(232,93,4,.3)}
.tag-b{background:rgba(10,123,108,.25);color:#6EE7B7;border:1px solid rgba(10,123,108,.3)}
.tag-c{background:rgba(55,48,163,.25);color:#A5B4FC;border:1px solid rgba(55,48,163,.3)}

.pillars-strip{background:var(--white);border-bottom:1px solid var(--border);padding:1.25rem 2rem}
.pillars-strip-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media(max-width:640px){.pillars-strip-inner{grid-template-columns:repeat(2,1fr)}}
.pillar-chip{display:flex;align-items:flex-start;gap:.65rem;padding:.75rem .9rem;border-radius:var(--r-md);border:1.5px solid}
.pillar-chip-icon{width:32px;height:32px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;background:rgba(255,255,255,.6)}
.pillar-chip h4{font-size:.8rem;font-weight:700;margin-bottom:.1rem}
.pillar-chip p{font-size:.7rem;line-height:1.4;margin:0;opacity:.75}

.blog-layout{max-width:1100px;margin:0 auto;padding:3rem 2rem;display:grid;grid-template-columns:1fr 285px;gap:3rem;align-items:start}
@media(max-width:880px){.blog-layout{grid-template-columns:1fr}}
@media(max-width:560px){.blog-layout{padding:2rem 1.25rem}}

.blog-article h2{font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--ink);margin:2.5rem 0 .8rem;line-height:1.2}
.blog-article h3{font-family:var(--font-display);font-size:1.08rem;font-weight:600;color:var(--ink-soft);margin:1.75rem 0 .55rem}
.blog-article p{font-size:.98rem;color:var(--ink-soft);line-height:1.8;margin-bottom:1.1rem}
.blog-article strong{color:var(--ink);font-weight:600}
.blog-article code{font-family:monospace;font-size:.84rem;background:#F3F4F6;padding:.1rem .3rem;border-radius:4px}
.divider{height:1px;background:var(--border);margin:2rem 0}

.pull-quote{border-left:4px solid;padding:1rem 1.4rem;border-radius:0 var(--r-md) var(--r-md) 0;margin:1.75rem 0;font-family:var(--font-display);font-size:1.02rem;font-style:italic;line-height:1.6}

.callout{border:1.5px solid;border-radius:var(--r-lg);padding:1.1rem 1.4rem;margin:1.75rem 0}
.callout h4{font-weight:700;font-size:.88rem;margin-bottom:.3rem}
.callout p{font-size:.865rem;margin:0;line-height:1.65}

.tip-row{display:flex;flex-direction:column;gap:.65rem;margin:1rem 0}
.tip-item{display:flex;align-items:flex-start;gap:.85rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-md);padding:.9rem 1.1rem;font-size:.865rem;color:var(--ink-soft);line-height:1.65}
.tip-icon{font-size:1.1rem;flex-shrink:0;margin-top:.05rem}

.lesson-plan-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);overflow:hidden;margin:1.5rem 0}
.lesson-plan-header{padding:1rem 1.5rem;border-bottom:1px solid var(--border)}
.lesson-plan-header h3{font-size:.97rem;font-weight:700;margin-bottom:.15rem}
.lesson-plan-header p{font-size:.78rem;color:var(--muted);margin:0}
.lesson-row{display:flex;gap:1rem;padding:.58rem .5rem;border-bottom:1px solid var(--border);font-size:.845rem}
.lesson-row:last-child{border-bottom:none}
.lesson-label{font-weight:700;width:88px;flex-shrink:0;color:var(--ink-soft);font-size:.78rem}
.lesson-val{color:var(--ink-soft);line-height:1.6}

.sidebar{position:sticky;top:80px}
.sidebar-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.3rem;margin-bottom:1rem}
.sidebar-box h5{font-family:var(--font-display);font-size:.87rem;font-weight:700;margin-bottom:.85rem;color:var(--ink)}
.toc-link{display:flex;align-items:center;gap:.5rem;padding:.3rem 0;font-size:.79rem;color:var(--muted);border-bottom:1px solid var(--border);transition:color .15s}
.toc-link:last-child{border-bottom:none}.toc-link:hover,.toc-link.active{color:var(--saffron)}
.toc-dot{width:5px;height:5px;border-radius:50%;background:var(--border);flex-shrink:0}
.toc-link.active .toc-dot,.toc-link:hover .toc-dot{background:var(--saffron)}
.subj-link{display:flex;align-items:center;gap:.6rem;padding:.45rem .6rem;border-radius:var(--r-md);font-size:.81rem;font-weight:500;color:var(--muted);transition:all .15s;margin-bottom:.2rem}
.subj-link:hover{color:var(--ink);background:var(--surface)}
.subj-link.cur{background:var(--saffron-light);color:var(--saffron-dark);font-weight:700}

.activities-section{background:var(--white);border-top:2px solid var(--border);padding:4rem 2rem}
.activities-inner{max-width:1100px;margin:0 auto}
.act-header{text-align:center;margin-bottom:2rem}
.act-eyebrow{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--saffron);margin-bottom:.45rem}
.act-header h2{font-family:var(--font-display);font-size:clamp(1.4rem,3vw,1.9rem);font-weight:700;margin-bottom:.45rem}
.act-header p{font-size:.88rem;color:var(--muted);max-width:440px;margin:0 auto}

.act-filters{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;margin-bottom:1.75rem}
.act-filter{padding:.33rem .82rem;border-radius:var(--r-full);border:1.5px solid var(--border);background:transparent;font-size:.78rem;font-weight:600;color:var(--muted);cursor:pointer;transition:all .15s;font-family:var(--font-body)}
.act-filter:hover{border-color:var(--saffron);color:var(--saffron)}
.act-filter.active{background:var(--saffron);color:#fff;border-color:var(--saffron)}

.act-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
@media(max-width:760px){.act-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.act-grid{grid-template-columns:1fr}}
.act-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:transform .2s,box-shadow .2s}
.act-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.act-card-top{padding:1.15rem 1.15rem .9rem;position:relative}
.act-emoji{font-size:1.9rem;display:block;margin-bottom:.4rem}
.act-ct-label{font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.15rem}
.act-card h4{font-size:.88rem;font-weight:700;line-height:1.35;color:var(--ink)}
.act-grade{position:absolute;top:.75rem;right:.75rem;font-size:.6rem;font-weight:700;padding:.14rem .42rem;border-radius:4px;background:rgba(255,255,255,.85);color:var(--ink-soft);border:1px solid rgba(0,0,0,.1)}
.act-card-body{padding:.75rem 1.15rem 1rem}
.act-card-body p{font-size:.8rem;color:var(--ink-soft);line-height:1.6;margin-bottom:.6rem}
.act-chips{display:flex;flex-wrap:wrap;gap:.22rem}
.chip{font-size:.6rem;font-weight:700;padding:.13rem .42rem;border-radius:3px;letter-spacing:.03em}
.chip-unp{background:#F0FDF4;color:#166534}
.chip-plug{background:#EFF6FF;color:#1E40AF}
.chip-grp{background:var(--gold-light);color:var(--gold)}
.chip-ind{background:var(--saffron-light);color:var(--saffron-dark)}
.chip-pair{background:var(--violet-light);color:var(--violet-dark)}
.chip-t20{background:#F5F3FF;color:#6D28D9}
.chip-t30{background:#FFF7ED;color:#9A3E00}
.chip-t45{background:var(--teal-light);color:var(--teal-dark)}

.login-wall{position:relative;overflow:hidden}
.login-wall-content{filter:blur(5px) brightness(.97);pointer-events:none;user-select:none;max-height:460px;overflow:hidden}
.login-wall-overlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.55) 25%,rgba(255,255,255,.94) 55%,#fff 100%)}
.lw-box{text-align:center;padding:2.1rem 2rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);max-width:375px;width:90%}
.lw-lock{width:56px;height:56px;border-radius:50%;background:var(--saffron-light);display:flex;align-items:center;justify-content:center;font-size:1.55rem;margin:0 auto .85rem;border:2px solid rgba(232,93,4,.2)}
.lw-box h3{font-family:var(--font-display);font-size:1.12rem;font-weight:700;margin-bottom:.4rem;color:var(--ink)}
.lw-box p{font-size:.83rem;color:var(--muted);margin-bottom:1.25rem;line-height:1.6}
.lw-btns{display:flex;gap:.55rem;justify-content:center}
.lw-btn-p{background:var(--saffron);color:#fff;padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:none;cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-p:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.lw-btn-s{background:var(--white);color:var(--ink);padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:1.5px solid var(--border);cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-s:hover{border-color:var(--saffron);color:var(--saffron)}
.lw-perks{display:flex;justify-content:center;gap:.9rem;flex-wrap:wrap;margin-top:.85rem;padding-top:.8rem;border-top:1px solid var(--border)}
.lw-perk{font-size:.7rem;color:var(--muted)}

.modal-overlay{display:none;position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);align-items:center;justify-content:center;padding:1rem}
.modal-overlay.open{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);padding:2rem;width:100%;max-width:420px;position:relative;box-shadow:var(--shadow-lg);animation:mi .2s ease}
@keyframes mi{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--muted)}
.auth-tabs{display:flex;gap:.4rem;background:var(--surface);border-radius:var(--r-md);padding:.3rem;margin-bottom:1.4rem}
.auth-tab{flex:1;padding:.42rem;border-radius:var(--r-sm);border:none;background:transparent;cursor:pointer;font-size:.85rem;font-weight:600;color:var(--muted);transition:all .15s;font-family:var(--font-body)}
.auth-tab.active{background:var(--white);color:var(--ink);box-shadow:var(--shadow-sm)}
.auth-pane{display:none}.auth-pane.active{display:block}
.form-g{margin-bottom:.9rem}
.form-label{display:block;font-size:.8rem;font-weight:600;color:var(--ink-soft);margin-bottom:.3rem}
.form-input{width:100%;padding:.6rem .9rem;border:1.5px solid var(--border);border-radius:var(--r-md);font-size:.9rem;font-family:var(--font-body);color:var(--ink);background:var(--white)}
.form-input:focus{outline:none;border-color:var(--saffron)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.auth-submit{width:100%;justify-content:center;padding:.68rem;margin-top:.2rem}

.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.6rem 1.2rem;border-radius:var(--r-full);font-size:.84rem;font-weight:500;opacity:0;transition:all .3s;z-index:1000;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

.blog-footer{background:var(--ink);color:rgba(255,255,255,.45);text-align:center;padding:2rem;font-size:.8rem}
.blog-footer a{color:#F48C42}

@keyframes fu{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.fu{animation:fu .5s ease both}.d1{animation-delay:.1s}.d2{animation-delay:.2s}.d3{animation-delay:.3s}

.hero-bg{background:radial-gradient(ellipse 55% 65% at 10% 35%,rgba(21,128,61,.38) 0%,transparent 55%),
    radial-gradient(ellipse 45% 55% at 88% 20%,rgba(34,197,94,.28) 0%,transparent 55%),
    radial-gradient(ellipse 35% 40% at 60% 88%,rgba(10,123,108,.25) 0%,transparent 50%)}
.eyebrow{background:rgba(21,128,61,.2);border:1px solid rgba(21,128,61,.4);color:#FBBF24}
.pull-quote{border-left-color:#15803D;background:#F0FDF4;color:#14532D}
.callout-s{background:#F0FDF4;border:1.5px solid rgba(21,128,61,.25);color:#14532D}
.callout-s h4{color:#15803D}
.lesson-plan-header{background:#F0FDF4;border-bottom:1px solid rgba(21,128,61,.2)}

/* ===== subject-english.html ===== */
:root{
  --saffron:#E85D04;--saffron-light:#FEF0E7;--saffron-dark:#9A3E00;
  --teal:#0A7B6C;--teal-light:#E0F4F1;--teal-dark:#064E46;
  --indigo:#3730A3;--indigo-light:#EEF2FF;--indigo-dark:#1E1B6E;
  --gold:#B45309;--gold-light:#FEFCE8;
  --rose:#BE123C;--rose-light:#FFF1F2;
  --green:#15803D;--green-light:#F0FDF4;--green-dark:#14532D;
  --violet:#7C3AED;--violet-light:#F5F3FF;--violet-dark:#4C1D95;
  --ink:#111827;--ink-soft:#374151;--muted:#6B7280;
  --border:#E5E7EB;--surface:#F9FAFB;--white:#FFFFFF;
  --font-display: Arial, sans-serif;
  --font-body: Arial, sans-serif;
  --r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-full:999px;
  --shadow-sm:0 2px 10px rgba(0,0,0,.08);
  --shadow-md:0 4px 24px rgba(0,0,0,.10);
  --shadow-lg:0 8px 40px rgba(0,0,0,.14);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}ul,ol{list-style:none}[id]{scroll-margin-top:76px}

nav{position:sticky;top:0;z-index:200;background:rgba(249,250,251,.97);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);height:64px;display:flex;align-items:center;padding:0 2rem;gap:1rem}
.nav-logo{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--ink)}.nav-logo span{color:var(--saffron)}
.nav-breadcrumb{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--muted)}
.nav-breadcrumb a:hover{color:var(--saffron)}
.nav-sep{color:#d1d5db}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:.75rem}
.btn{display:inline-flex;align-items:center;padding:.55rem 1.25rem;border-radius:var(--r-md);font-weight:600;font-size:.875rem;transition:all .18s;border:none;cursor:pointer;font-family:var(--font-body)}
.btn-primary{background:var(--saffron);color:#fff}.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-sm{padding:.4rem 1rem;font-size:.8rem}

.hero{color:#fff;padding:5rem 2rem 4rem;position:relative;overflow:hidden;background:var(--ink)}
.hero-bg{position:absolute;inset:0}
.hero-inner{position:relative;z-index:1;max-width:860px;margin:0 auto}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;padding:.28rem .9rem;border-radius:var(--r-full);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:1.4rem}
.hero h1{font-family:var(--font-display);font-size:clamp(1.9rem,4.5vw,3.1rem);line-height:1.1;font-weight:700;letter-spacing:-.02em;margin-bottom:1.1rem}
.hero h1 em{font-style:italic;font-weight:300;color:#FBBF24}
.hero-sub{font-size:1rem;color:rgba(255,255,255,.68);max-width:600px;line-height:1.7;margin-bottom:1.8rem}
.hero-meta{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.hero-meta-item{font-size:.8rem;color:rgba(255,255,255,.45)}
.hero-meta-item span{color:rgba(255,255,255,.7);font-weight:500}
.hero-tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1.1rem}
.tag{display:inline-flex;align-items:center;padding:.2rem .65rem;border-radius:var(--r-full);font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.tag-a{background:rgba(232,93,4,.25);color:#FBBF24;border:1px solid rgba(232,93,4,.3)}
.tag-b{background:rgba(10,123,108,.25);color:#6EE7B7;border:1px solid rgba(10,123,108,.3)}
.tag-c{background:rgba(55,48,163,.25);color:#A5B4FC;border:1px solid rgba(55,48,163,.3)}

.pillars-strip{background:var(--white);border-bottom:1px solid var(--border);padding:1.25rem 2rem}
.pillars-strip-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media(max-width:640px){.pillars-strip-inner{grid-template-columns:repeat(2,1fr)}}
.pillar-chip{display:flex;align-items:flex-start;gap:.65rem;padding:.75rem .9rem;border-radius:var(--r-md);border:1.5px solid}
.pillar-chip-icon{width:32px;height:32px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;background:rgba(255,255,255,.6)}
.pillar-chip h4{font-size:.8rem;font-weight:700;margin-bottom:.1rem}
.pillar-chip p{font-size:.7rem;line-height:1.4;margin:0;opacity:.75}

.blog-layout{max-width:1100px;margin:0 auto;padding:3rem 2rem;display:grid;grid-template-columns:1fr 285px;gap:3rem;align-items:start}
@media(max-width:880px){.blog-layout{grid-template-columns:1fr}}
@media(max-width:560px){.blog-layout{padding:2rem 1.25rem}}

.blog-article h2{font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--ink);margin:2.5rem 0 .8rem;line-height:1.2}
.blog-article h3{font-family:var(--font-display);font-size:1.08rem;font-weight:600;color:var(--ink-soft);margin:1.75rem 0 .55rem}
.blog-article p{font-size:.98rem;color:var(--ink-soft);line-height:1.8;margin-bottom:1.1rem}
.blog-article strong{color:var(--ink);font-weight:600}
.blog-article code{font-family:monospace;font-size:.84rem;background:#F3F4F6;padding:.1rem .3rem;border-radius:4px}
.divider{height:1px;background:var(--border);margin:2rem 0}

.pull-quote{border-left:4px solid;padding:1rem 1.4rem;border-radius:0 var(--r-md) var(--r-md) 0;margin:1.75rem 0;font-family:var(--font-display);font-size:1.02rem;font-style:italic;line-height:1.6}

.callout{border:1.5px solid;border-radius:var(--r-lg);padding:1.1rem 1.4rem;margin:1.75rem 0}
.callout h4{font-weight:700;font-size:.88rem;margin-bottom:.3rem}
.callout p{font-size:.865rem;margin:0;line-height:1.65}

.tip-row{display:flex;flex-direction:column;gap:.65rem;margin:1rem 0}
.tip-item{display:flex;align-items:flex-start;gap:.85rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-md);padding:.9rem 1.1rem;font-size:.865rem;color:var(--ink-soft);line-height:1.65}
.tip-icon{font-size:1.1rem;flex-shrink:0;margin-top:.05rem}

.lesson-plan-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);overflow:hidden;margin:1.5rem 0}
.lesson-plan-header{padding:1rem 1.5rem;border-bottom:1px solid var(--border)}
.lesson-plan-header h3{font-size:.97rem;font-weight:700;margin-bottom:.15rem}
.lesson-plan-header p{font-size:.78rem;color:var(--muted);margin:0}
.lesson-row{display:flex;gap:1rem;padding:.58rem .5rem;border-bottom:1px solid var(--border);font-size:.845rem}
.lesson-row:last-child{border-bottom:none}
.lesson-label{font-weight:700;width:88px;flex-shrink:0;color:var(--ink-soft);font-size:.78rem}
.lesson-val{color:var(--ink-soft);line-height:1.6}

.sidebar{position:sticky;top:80px}
.sidebar-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.3rem;margin-bottom:1rem}
.sidebar-box h5{font-family:var(--font-display);font-size:.87rem;font-weight:700;margin-bottom:.85rem;color:var(--ink)}
.toc-link{display:flex;align-items:center;gap:.5rem;padding:.3rem 0;font-size:.79rem;color:var(--muted);border-bottom:1px solid var(--border);transition:color .15s}
.toc-link:last-child{border-bottom:none}.toc-link:hover,.toc-link.active{color:var(--saffron)}
.toc-dot{width:5px;height:5px;border-radius:50%;background:var(--border);flex-shrink:0}
.toc-link.active .toc-dot,.toc-link:hover .toc-dot{background:var(--saffron)}
.subj-link{display:flex;align-items:center;gap:.6rem;padding:.45rem .6rem;border-radius:var(--r-md);font-size:.81rem;font-weight:500;color:var(--muted);transition:all .15s;margin-bottom:.2rem}
.subj-link:hover{color:var(--ink);background:var(--surface)}
.subj-link.cur{background:var(--saffron-light);color:var(--saffron-dark);font-weight:700}

.activities-section{background:var(--white);border-top:2px solid var(--border);padding:4rem 2rem}
.activities-inner{max-width:1100px;margin:0 auto}
.act-header{text-align:center;margin-bottom:2rem}
.act-eyebrow{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--saffron);margin-bottom:.45rem}
.act-header h2{font-family:var(--font-display);font-size:clamp(1.4rem,3vw,1.9rem);font-weight:700;margin-bottom:.45rem}
.act-header p{font-size:.88rem;color:var(--muted);max-width:440px;margin:0 auto}

.act-filters{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;margin-bottom:1.75rem}
.act-filter{padding:.33rem .82rem;border-radius:var(--r-full);border:1.5px solid var(--border);background:transparent;font-size:.78rem;font-weight:600;color:var(--muted);cursor:pointer;transition:all .15s;font-family:var(--font-body)}
.act-filter:hover{border-color:var(--saffron);color:var(--saffron)}
.act-filter.active{background:var(--saffron);color:#fff;border-color:var(--saffron)}

.act-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
@media(max-width:760px){.act-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.act-grid{grid-template-columns:1fr}}
.act-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:transform .2s,box-shadow .2s}
.act-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.act-card-top{padding:1.15rem 1.15rem .9rem;position:relative}
.act-emoji{font-size:1.9rem;display:block;margin-bottom:.4rem}
.act-ct-label{font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.15rem}
.act-card h4{font-size:.88rem;font-weight:700;line-height:1.35;color:var(--ink)}
.act-grade{position:absolute;top:.75rem;right:.75rem;font-size:.6rem;font-weight:700;padding:.14rem .42rem;border-radius:4px;background:rgba(255,255,255,.85);color:var(--ink-soft);border:1px solid rgba(0,0,0,.1)}
.act-card-body{padding:.75rem 1.15rem 1rem}
.act-card-body p{font-size:.8rem;color:var(--ink-soft);line-height:1.6;margin-bottom:.6rem}
.act-chips{display:flex;flex-wrap:wrap;gap:.22rem}
.chip{font-size:.6rem;font-weight:700;padding:.13rem .42rem;border-radius:3px;letter-spacing:.03em}
.chip-unp{background:#F0FDF4;color:#166534}
.chip-plug{background:#EFF6FF;color:#1E40AF}
.chip-grp{background:var(--gold-light);color:var(--gold)}
.chip-ind{background:var(--saffron-light);color:var(--saffron-dark)}
.chip-pair{background:var(--violet-light);color:var(--violet-dark)}
.chip-t20{background:#F5F3FF;color:#6D28D9}
.chip-t30{background:#FFF7ED;color:#9A3E00}
.chip-t45{background:var(--teal-light);color:var(--teal-dark)}

.login-wall{position:relative;overflow:hidden}
.login-wall-content{filter:blur(5px) brightness(.97);pointer-events:none;user-select:none;max-height:460px;overflow:hidden}
.login-wall-overlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.55) 25%,rgba(255,255,255,.94) 55%,#fff 100%)}
.lw-box{text-align:center;padding:2.1rem 2rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);max-width:375px;width:90%}
.lw-lock{width:56px;height:56px;border-radius:50%;background:var(--saffron-light);display:flex;align-items:center;justify-content:center;font-size:1.55rem;margin:0 auto .85rem;border:2px solid rgba(232,93,4,.2)}
.lw-box h3{font-family:var(--font-display);font-size:1.12rem;font-weight:700;margin-bottom:.4rem;color:var(--ink)}
.lw-box p{font-size:.83rem;color:var(--muted);margin-bottom:1.25rem;line-height:1.6}
.lw-btns{display:flex;gap:.55rem;justify-content:center}
.lw-btn-p{background:var(--saffron);color:#fff;padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:none;cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-p:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.lw-btn-s{background:var(--white);color:var(--ink);padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:1.5px solid var(--border);cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-s:hover{border-color:var(--saffron);color:var(--saffron)}
.lw-perks{display:flex;justify-content:center;gap:.9rem;flex-wrap:wrap;margin-top:.85rem;padding-top:.8rem;border-top:1px solid var(--border)}
.lw-perk{font-size:.7rem;color:var(--muted)}

.modal-overlay{display:none;position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);align-items:center;justify-content:center;padding:1rem}
.modal-overlay.open{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);padding:2rem;width:100%;max-width:420px;position:relative;box-shadow:var(--shadow-lg);animation:mi .2s ease}
@keyframes mi{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--muted)}
.auth-tabs{display:flex;gap:.4rem;background:var(--surface);border-radius:var(--r-md);padding:.3rem;margin-bottom:1.4rem}
.auth-tab{flex:1;padding:.42rem;border-radius:var(--r-sm);border:none;background:transparent;cursor:pointer;font-size:.85rem;font-weight:600;color:var(--muted);transition:all .15s;font-family:var(--font-body)}
.auth-tab.active{background:var(--white);color:var(--ink);box-shadow:var(--shadow-sm)}
.auth-pane{display:none}.auth-pane.active{display:block}
.form-g{margin-bottom:.9rem}
.form-label{display:block;font-size:.8rem;font-weight:600;color:var(--ink-soft);margin-bottom:.3rem}
.form-input{width:100%;padding:.6rem .9rem;border:1.5px solid var(--border);border-radius:var(--r-md);font-size:.9rem;font-family:var(--font-body);color:var(--ink);background:var(--white)}
.form-input:focus{outline:none;border-color:var(--saffron)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.auth-submit{width:100%;justify-content:center;padding:.68rem;margin-top:.2rem}

.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.6rem 1.2rem;border-radius:var(--r-full);font-size:.84rem;font-weight:500;opacity:0;transition:all .3s;z-index:1000;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

.blog-footer{background:var(--ink);color:rgba(255,255,255,.45);text-align:center;padding:2rem;font-size:.8rem}
.blog-footer a{color:#F48C42}

@keyframes fu{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.fu{animation:fu .5s ease both}.d1{animation-delay:.1s}.d2{animation-delay:.2s}.d3{animation-delay:.3s}

.hero-bg{background:radial-gradient(ellipse 55% 65% at 10% 35%,rgba(55,48,163,.38) 0%,transparent 55%),
    radial-gradient(ellipse 45% 55% at 88% 20%,rgba(99,102,241,.3) 0%,transparent 55%),
    radial-gradient(ellipse 35% 40% at 60% 88%,rgba(124,58,237,.2) 0%,transparent 50%)}
.eyebrow{background:rgba(55,48,163,.2);border:1px solid rgba(55,48,163,.4);color:#FBBF24}
.pull-quote{border-left-color:#3730A3;background:#EEF2FF;color:#1E1B6E}
.callout-s{background:#EEF2FF;border:1.5px solid rgba(55,48,163,.25);color:#1E1B6E}
.callout-s h4{color:#3730A3}
.lesson-plan-header{background:#EEF2FF;border-bottom:1px solid rgba(55,48,163,.2)}

/* ===== subject-hindi.html ===== */
:root{
  --saffron:#E85D04;--saffron-light:#FEF0E7;--saffron-dark:#9A3E00;
  --teal:#0A7B6C;--teal-light:#E0F4F1;--teal-dark:#064E46;
  --indigo:#3730A3;--indigo-light:#EEF2FF;--indigo-dark:#1E1B6E;
  --gold:#B45309;--gold-light:#FEFCE8;
  --rose:#BE123C;--rose-light:#FFF1F2;
  --green:#15803D;--green-light:#F0FDF4;--green-dark:#14532D;
  --violet:#7C3AED;--violet-light:#F5F3FF;--violet-dark:#4C1D95;
  --ink:#111827;--ink-soft:#374151;--muted:#6B7280;
  --border:#E5E7EB;--surface:#F9FAFB;--white:#FFFFFF;
  --font-display: Arial, sans-serif;
  --font-body: Arial, sans-serif;
  --r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-full:999px;
  --shadow-sm:0 2px 10px rgba(0,0,0,.08);
  --shadow-md:0 4px 24px rgba(0,0,0,.10);
  --shadow-lg:0 8px 40px rgba(0,0,0,.14);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}ul,ol{list-style:none}[id]{scroll-margin-top:76px}

nav{position:sticky;top:0;z-index:200;background:rgba(249,250,251,.97);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);height:64px;display:flex;align-items:center;padding:0 2rem;gap:1rem}
.nav-logo{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--ink)}.nav-logo span{color:var(--saffron)}
.nav-breadcrumb{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--muted)}
.nav-breadcrumb a:hover{color:var(--saffron)}
.nav-sep{color:#d1d5db}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:.75rem}
.btn{display:inline-flex;align-items:center;padding:.55rem 1.25rem;border-radius:var(--r-md);font-weight:600;font-size:.875rem;transition:all .18s;border:none;cursor:pointer;font-family:var(--font-body)}
.btn-primary{background:var(--saffron);color:#fff}.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-sm{padding:.4rem 1rem;font-size:.8rem}

.hero{color:#fff;padding:5rem 2rem 4rem;position:relative;overflow:hidden;background:var(--ink)}
.hero-bg{position:absolute;inset:0}
.hero-inner{position:relative;z-index:1;max-width:860px;margin:0 auto}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;padding:.28rem .9rem;border-radius:var(--r-full);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:1.4rem}
.hero h1{font-family:var(--font-display);font-size:clamp(1.9rem,4.5vw,3.1rem);line-height:1.1;font-weight:700;letter-spacing:-.02em;margin-bottom:1.1rem}
.hero h1 em{font-style:italic;font-weight:300;color:#FBBF24}
.hero-sub{font-size:1rem;color:rgba(255,255,255,.68);max-width:600px;line-height:1.7;margin-bottom:1.8rem}
.hero-meta{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.hero-meta-item{font-size:.8rem;color:rgba(255,255,255,.45)}
.hero-meta-item span{color:rgba(255,255,255,.7);font-weight:500}
.hero-tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1.1rem}
.tag{display:inline-flex;align-items:center;padding:.2rem .65rem;border-radius:var(--r-full);font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.tag-a{background:rgba(232,93,4,.25);color:#FBBF24;border:1px solid rgba(232,93,4,.3)}
.tag-b{background:rgba(10,123,108,.25);color:#6EE7B7;border:1px solid rgba(10,123,108,.3)}
.tag-c{background:rgba(55,48,163,.25);color:#A5B4FC;border:1px solid rgba(55,48,163,.3)}

.pillars-strip{background:var(--white);border-bottom:1px solid var(--border);padding:1.25rem 2rem}
.pillars-strip-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media(max-width:640px){.pillars-strip-inner{grid-template-columns:repeat(2,1fr)}}
.pillar-chip{display:flex;align-items:flex-start;gap:.65rem;padding:.75rem .9rem;border-radius:var(--r-md);border:1.5px solid}
.pillar-chip-icon{width:32px;height:32px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;background:rgba(255,255,255,.6)}
.pillar-chip h4{font-size:.8rem;font-weight:700;margin-bottom:.1rem}
.pillar-chip p{font-size:.7rem;line-height:1.4;margin:0;opacity:.75}

.blog-layout{max-width:1100px;margin:0 auto;padding:3rem 2rem;display:grid;grid-template-columns:1fr 285px;gap:3rem;align-items:start}
@media(max-width:880px){.blog-layout{grid-template-columns:1fr}}
@media(max-width:560px){.blog-layout{padding:2rem 1.25rem}}

.blog-article h2{font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--ink);margin:2.5rem 0 .8rem;line-height:1.2}
.blog-article h3{font-family:var(--font-display);font-size:1.08rem;font-weight:600;color:var(--ink-soft);margin:1.75rem 0 .55rem}
.blog-article p{font-size:.98rem;color:var(--ink-soft);line-height:1.8;margin-bottom:1.1rem}
.blog-article strong{color:var(--ink);font-weight:600}
.blog-article code{font-family:monospace;font-size:.84rem;background:#F3F4F6;padding:.1rem .3rem;border-radius:4px}
.divider{height:1px;background:var(--border);margin:2rem 0}

.pull-quote{border-left:4px solid;padding:1rem 1.4rem;border-radius:0 var(--r-md) var(--r-md) 0;margin:1.75rem 0;font-family:var(--font-display);font-size:1.02rem;font-style:italic;line-height:1.6}

.callout{border:1.5px solid;border-radius:var(--r-lg);padding:1.1rem 1.4rem;margin:1.75rem 0}
.callout h4{font-weight:700;font-size:.88rem;margin-bottom:.3rem}
.callout p{font-size:.865rem;margin:0;line-height:1.65}

.tip-row{display:flex;flex-direction:column;gap:.65rem;margin:1rem 0}
.tip-item{display:flex;align-items:flex-start;gap:.85rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-md);padding:.9rem 1.1rem;font-size:.865rem;color:var(--ink-soft);line-height:1.65}
.tip-icon{font-size:1.1rem;flex-shrink:0;margin-top:.05rem}

.lesson-plan-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);overflow:hidden;margin:1.5rem 0}
.lesson-plan-header{padding:1rem 1.5rem;border-bottom:1px solid var(--border)}
.lesson-plan-header h3{font-size:.97rem;font-weight:700;margin-bottom:.15rem}
.lesson-plan-header p{font-size:.78rem;color:var(--muted);margin:0}
.lesson-row{display:flex;gap:1rem;padding:.58rem .5rem;border-bottom:1px solid var(--border);font-size:.845rem}
.lesson-row:last-child{border-bottom:none}
.lesson-label{font-weight:700;width:88px;flex-shrink:0;color:var(--ink-soft);font-size:.78rem}
.lesson-val{color:var(--ink-soft);line-height:1.6}

.sidebar{position:sticky;top:80px}
.sidebar-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.3rem;margin-bottom:1rem}
.sidebar-box h5{font-family:var(--font-display);font-size:.87rem;font-weight:700;margin-bottom:.85rem;color:var(--ink)}
.toc-link{display:flex;align-items:center;gap:.5rem;padding:.3rem 0;font-size:.79rem;color:var(--muted);border-bottom:1px solid var(--border);transition:color .15s}
.toc-link:last-child{border-bottom:none}.toc-link:hover,.toc-link.active{color:var(--saffron)}
.toc-dot{width:5px;height:5px;border-radius:50%;background:var(--border);flex-shrink:0}
.toc-link.active .toc-dot,.toc-link:hover .toc-dot{background:var(--saffron)}
.subj-link{display:flex;align-items:center;gap:.6rem;padding:.45rem .6rem;border-radius:var(--r-md);font-size:.81rem;font-weight:500;color:var(--muted);transition:all .15s;margin-bottom:.2rem}
.subj-link:hover{color:var(--ink);background:var(--surface)}
.subj-link.cur{background:var(--saffron-light);color:var(--saffron-dark);font-weight:700}

.activities-section{background:var(--white);border-top:2px solid var(--border);padding:4rem 2rem}
.activities-inner{max-width:1100px;margin:0 auto}
.act-header{text-align:center;margin-bottom:2rem}
.act-eyebrow{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--saffron);margin-bottom:.45rem}
.act-header h2{font-family:var(--font-display);font-size:clamp(1.4rem,3vw,1.9rem);font-weight:700;margin-bottom:.45rem}
.act-header p{font-size:.88rem;color:var(--muted);max-width:440px;margin:0 auto}

.act-filters{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;margin-bottom:1.75rem}
.act-filter{padding:.33rem .82rem;border-radius:var(--r-full);border:1.5px solid var(--border);background:transparent;font-size:.78rem;font-weight:600;color:var(--muted);cursor:pointer;transition:all .15s;font-family:var(--font-body)}
.act-filter:hover{border-color:var(--saffron);color:var(--saffron)}
.act-filter.active{background:var(--saffron);color:#fff;border-color:var(--saffron)}

.act-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
@media(max-width:760px){.act-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.act-grid{grid-template-columns:1fr}}
.act-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:transform .2s,box-shadow .2s}
.act-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.act-card-top{padding:1.15rem 1.15rem .9rem;position:relative}
.act-emoji{font-size:1.9rem;display:block;margin-bottom:.4rem}
.act-ct-label{font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.15rem}
.act-card h4{font-size:.88rem;font-weight:700;line-height:1.35;color:var(--ink)}
.act-grade{position:absolute;top:.75rem;right:.75rem;font-size:.6rem;font-weight:700;padding:.14rem .42rem;border-radius:4px;background:rgba(255,255,255,.85);color:var(--ink-soft);border:1px solid rgba(0,0,0,.1)}
.act-card-body{padding:.75rem 1.15rem 1rem}
.act-card-body p{font-size:.8rem;color:var(--ink-soft);line-height:1.6;margin-bottom:.6rem}
.act-chips{display:flex;flex-wrap:wrap;gap:.22rem}
.chip{font-size:.6rem;font-weight:700;padding:.13rem .42rem;border-radius:3px;letter-spacing:.03em}
.chip-unp{background:#F0FDF4;color:#166534}
.chip-plug{background:#EFF6FF;color:#1E40AF}
.chip-grp{background:var(--gold-light);color:var(--gold)}
.chip-ind{background:var(--saffron-light);color:var(--saffron-dark)}
.chip-pair{background:var(--violet-light);color:var(--violet-dark)}
.chip-t20{background:#F5F3FF;color:#6D28D9}
.chip-t30{background:#FFF7ED;color:#9A3E00}
.chip-t45{background:var(--teal-light);color:var(--teal-dark)}

.login-wall{position:relative;overflow:hidden}
.login-wall-content{filter:blur(5px) brightness(.97);pointer-events:none;user-select:none;max-height:460px;overflow:hidden}
.login-wall-overlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.55) 25%,rgba(255,255,255,.94) 55%,#fff 100%)}
.lw-box{text-align:center;padding:2.1rem 2rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);max-width:375px;width:90%}
.lw-lock{width:56px;height:56px;border-radius:50%;background:var(--saffron-light);display:flex;align-items:center;justify-content:center;font-size:1.55rem;margin:0 auto .85rem;border:2px solid rgba(232,93,4,.2)}
.lw-box h3{font-family:var(--font-display);font-size:1.12rem;font-weight:700;margin-bottom:.4rem;color:var(--ink)}
.lw-box p{font-size:.83rem;color:var(--muted);margin-bottom:1.25rem;line-height:1.6}
.lw-btns{display:flex;gap:.55rem;justify-content:center}
.lw-btn-p{background:var(--saffron);color:#fff;padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:none;cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-p:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.lw-btn-s{background:var(--white);color:var(--ink);padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:1.5px solid var(--border);cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-s:hover{border-color:var(--saffron);color:var(--saffron)}
.lw-perks{display:flex;justify-content:center;gap:.9rem;flex-wrap:wrap;margin-top:.85rem;padding-top:.8rem;border-top:1px solid var(--border)}
.lw-perk{font-size:.7rem;color:var(--muted)}

.modal-overlay{display:none;position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);align-items:center;justify-content:center;padding:1rem}
.modal-overlay.open{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);padding:2rem;width:100%;max-width:420px;position:relative;box-shadow:var(--shadow-lg);animation:mi .2s ease}
@keyframes mi{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--muted)}
.auth-tabs{display:flex;gap:.4rem;background:var(--surface);border-radius:var(--r-md);padding:.3rem;margin-bottom:1.4rem}
.auth-tab{flex:1;padding:.42rem;border-radius:var(--r-sm);border:none;background:transparent;cursor:pointer;font-size:.85rem;font-weight:600;color:var(--muted);transition:all .15s;font-family:var(--font-body)}
.auth-tab.active{background:var(--white);color:var(--ink);box-shadow:var(--shadow-sm)}
.auth-pane{display:none}.auth-pane.active{display:block}
.form-g{margin-bottom:.9rem}
.form-label{display:block;font-size:.8rem;font-weight:600;color:var(--ink-soft);margin-bottom:.3rem}
.form-input{width:100%;padding:.6rem .9rem;border:1.5px solid var(--border);border-radius:var(--r-md);font-size:.9rem;font-family:var(--font-body);color:var(--ink);background:var(--white)}
.form-input:focus{outline:none;border-color:var(--saffron)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.auth-submit{width:100%;justify-content:center;padding:.68rem;margin-top:.2rem}

.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.6rem 1.2rem;border-radius:var(--r-full);font-size:.84rem;font-weight:500;opacity:0;transition:all .3s;z-index:1000;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

.blog-footer{background:var(--ink);color:rgba(255,255,255,.45);text-align:center;padding:2rem;font-size:.8rem}
.blog-footer a{color:#F48C42}

@keyframes fu{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.fu{animation:fu .5s ease both}.d1{animation-delay:.1s}.d2{animation-delay:.2s}.d3{animation-delay:.3s}

.hero-bg{background:radial-gradient(ellipse 55% 65% at 10% 35%,rgba(124,58,237,.38) 0%,transparent 55%),
    radial-gradient(ellipse 45% 55% at 88% 20%,rgba(139,92,246,.3) 0%,transparent 55%),
    radial-gradient(ellipse 35% 40% at 60% 88%,rgba(55,48,163,.25) 0%,transparent 50%)}
.eyebrow{background:rgba(124,58,237,.2);border:1px solid rgba(124,58,237,.4);color:#FBBF24}
.pull-quote{border-left-color:#7C3AED;background:#F5F3FF;color:#4C1D95}
.callout-s{background:#F5F3FF;border:1.5px solid rgba(124,58,237,.25);color:#4C1D95}
.callout-s h4{color:#7C3AED}
.lesson-plan-header{background:#F5F3FF;border-bottom:1px solid rgba(124,58,237,.2)}

/* ===== subject-mathematics.html ===== */
:root{
  --saffron:#E85D04;--saffron-light:#FEF0E7;--saffron-dark:#9A3E00;
  --teal:#0A7B6C;--teal-light:#E0F4F1;--teal-dark:#064E46;
  --indigo:#3730A3;--indigo-light:#EEF2FF;--indigo-dark:#1E1B6E;
  --gold:#B45309;--gold-light:#FEFCE8;
  --rose:#BE123C;--rose-light:#FFF1F2;
  --green:#15803D;--green-light:#F0FDF4;--green-dark:#14532D;
  --violet:#7C3AED;--violet-light:#F5F3FF;--violet-dark:#4C1D95;
  --ink:#111827;--ink-soft:#374151;--muted:#6B7280;
  --border:#E5E7EB;--surface:#F9FAFB;--white:#FFFFFF;
  --font-display: Arial, sans-serif;
  --font-body: Arial, sans-serif;
  --r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-full:999px;
  --shadow-sm:0 2px 10px rgba(0,0,0,.08);
  --shadow-md:0 4px 24px rgba(0,0,0,.10);
  --shadow-lg:0 8px 40px rgba(0,0,0,.14);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}ul,ol{list-style:none}[id]{scroll-margin-top:76px}

nav{position:sticky;top:0;z-index:200;background:rgba(249,250,251,.97);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);height:64px;display:flex;align-items:center;padding:0 2rem;gap:1rem}
.nav-logo{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--ink)}.nav-logo span{color:var(--saffron)}
.nav-breadcrumb{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--muted)}
.nav-breadcrumb a:hover{color:var(--saffron)}
.nav-sep{color:#d1d5db}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:.75rem}
.btn{display:inline-flex;align-items:center;padding:.55rem 1.25rem;border-radius:var(--r-md);font-weight:600;font-size:.875rem;transition:all .18s;border:none;cursor:pointer;font-family:var(--font-body)}
.btn-primary{background:var(--saffron);color:#fff}.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-sm{padding:.4rem 1rem;font-size:.8rem}

.hero{color:#fff;padding:5rem 2rem 4rem;position:relative;overflow:hidden;background:var(--ink)}
.hero-bg{position:absolute;inset:0}
.hero-inner{position:relative;z-index:1;max-width:860px;margin:0 auto}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;padding:.28rem .9rem;border-radius:var(--r-full);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:1.4rem}
.hero h1{font-family:var(--font-display);font-size:clamp(1.9rem,4.5vw,3.1rem);line-height:1.1;font-weight:700;letter-spacing:-.02em;margin-bottom:1.1rem}
.hero h1 em{font-style:italic;font-weight:300;color:#FBBF24}
.hero-sub{font-size:1rem;color:rgba(255,255,255,.68);max-width:600px;line-height:1.7;margin-bottom:1.8rem}
.hero-meta{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.hero-meta-item{font-size:.8rem;color:rgba(255,255,255,.45)}
.hero-meta-item span{color:rgba(255,255,255,.7);font-weight:500}
.hero-tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1.1rem}
.tag{display:inline-flex;align-items:center;padding:.2rem .65rem;border-radius:var(--r-full);font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.tag-a{background:rgba(232,93,4,.25);color:#FBBF24;border:1px solid rgba(232,93,4,.3)}
.tag-b{background:rgba(10,123,108,.25);color:#6EE7B7;border:1px solid rgba(10,123,108,.3)}
.tag-c{background:rgba(55,48,163,.25);color:#A5B4FC;border:1px solid rgba(55,48,163,.3)}

.pillars-strip{background:var(--white);border-bottom:1px solid var(--border);padding:1.25rem 2rem}
.pillars-strip-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media(max-width:640px){.pillars-strip-inner{grid-template-columns:repeat(2,1fr)}}
.pillar-chip{display:flex;align-items:flex-start;gap:.65rem;padding:.75rem .9rem;border-radius:var(--r-md);border:1.5px solid}
.pillar-chip-icon{width:32px;height:32px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;background:rgba(255,255,255,.6)}
.pillar-chip h4{font-size:.8rem;font-weight:700;margin-bottom:.1rem}
.pillar-chip p{font-size:.7rem;line-height:1.4;margin:0;opacity:.75}

.blog-layout{max-width:1100px;margin:0 auto;padding:3rem 2rem;display:grid;grid-template-columns:1fr 285px;gap:3rem;align-items:start}
@media(max-width:880px){.blog-layout{grid-template-columns:1fr}}
@media(max-width:560px){.blog-layout{padding:2rem 1.25rem}}

.blog-article h2{font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--ink);margin:2.5rem 0 .8rem;line-height:1.2}
.blog-article h3{font-family:var(--font-display);font-size:1.08rem;font-weight:600;color:var(--ink-soft);margin:1.75rem 0 .55rem}
.blog-article p{font-size:.98rem;color:var(--ink-soft);line-height:1.8;margin-bottom:1.1rem}
.blog-article strong{color:var(--ink);font-weight:600}
.blog-article code{font-family:monospace;font-size:.84rem;background:#F3F4F6;padding:.1rem .3rem;border-radius:4px}
.divider{height:1px;background:var(--border);margin:2rem 0}

.pull-quote{border-left:4px solid;padding:1rem 1.4rem;border-radius:0 var(--r-md) var(--r-md) 0;margin:1.75rem 0;font-family:var(--font-display);font-size:1.02rem;font-style:italic;line-height:1.6}

.callout{border:1.5px solid;border-radius:var(--r-lg);padding:1.1rem 1.4rem;margin:1.75rem 0}
.callout h4{font-weight:700;font-size:.88rem;margin-bottom:.3rem}
.callout p{font-size:.865rem;margin:0;line-height:1.65}

.tip-row{display:flex;flex-direction:column;gap:.65rem;margin:1rem 0}
.tip-item{display:flex;align-items:flex-start;gap:.85rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-md);padding:.9rem 1.1rem;font-size:.865rem;color:var(--ink-soft);line-height:1.65}
.tip-icon{font-size:1.1rem;flex-shrink:0;margin-top:.05rem}

.lesson-plan-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);overflow:hidden;margin:1.5rem 0}
.lesson-plan-header{padding:1rem 1.5rem;border-bottom:1px solid var(--border)}
.lesson-plan-header h3{font-size:.97rem;font-weight:700;margin-bottom:.15rem}
.lesson-plan-header p{font-size:.78rem;color:var(--muted);margin:0}
.lesson-row{display:flex;gap:1rem;padding:.58rem .5rem;border-bottom:1px solid var(--border);font-size:.845rem}
.lesson-row:last-child{border-bottom:none}
.lesson-label{font-weight:700;width:88px;flex-shrink:0;color:var(--ink-soft);font-size:.78rem}
.lesson-val{color:var(--ink-soft);line-height:1.6}

.sidebar{position:sticky;top:80px}
.sidebar-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.3rem;margin-bottom:1rem}
.sidebar-box h5{font-family:var(--font-display);font-size:.87rem;font-weight:700;margin-bottom:.85rem;color:var(--ink)}
.toc-link{display:flex;align-items:center;gap:.5rem;padding:.3rem 0;font-size:.79rem;color:var(--muted);border-bottom:1px solid var(--border);transition:color .15s}
.toc-link:last-child{border-bottom:none}.toc-link:hover,.toc-link.active{color:var(--saffron)}
.toc-dot{width:5px;height:5px;border-radius:50%;background:var(--border);flex-shrink:0}
.toc-link.active .toc-dot,.toc-link:hover .toc-dot{background:var(--saffron)}
.subj-link{display:flex;align-items:center;gap:.6rem;padding:.45rem .6rem;border-radius:var(--r-md);font-size:.81rem;font-weight:500;color:var(--muted);transition:all .15s;margin-bottom:.2rem}
.subj-link:hover{color:var(--ink);background:var(--surface)}
.subj-link.cur{background:var(--saffron-light);color:var(--saffron-dark);font-weight:700}

.activities-section{background:var(--white);border-top:2px solid var(--border);padding:4rem 2rem}
.activities-inner{max-width:1100px;margin:0 auto}
.act-header{text-align:center;margin-bottom:2rem}
.act-eyebrow{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--saffron);margin-bottom:.45rem}
.act-header h2{font-family:var(--font-display);font-size:clamp(1.4rem,3vw,1.9rem);font-weight:700;margin-bottom:.45rem}
.act-header p{font-size:.88rem;color:var(--muted);max-width:440px;margin:0 auto}

.act-filters{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;margin-bottom:1.75rem}
.act-filter{padding:.33rem .82rem;border-radius:var(--r-full);border:1.5px solid var(--border);background:transparent;font-size:.78rem;font-weight:600;color:var(--muted);cursor:pointer;transition:all .15s;font-family:var(--font-body)}
.act-filter:hover{border-color:var(--saffron);color:var(--saffron)}
.act-filter.active{background:var(--saffron);color:#fff;border-color:var(--saffron)}

.act-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
@media(max-width:760px){.act-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.act-grid{grid-template-columns:1fr}}
.act-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:transform .2s,box-shadow .2s}
.act-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.act-card-top{padding:1.15rem 1.15rem .9rem;position:relative}
.act-emoji{font-size:1.9rem;display:block;margin-bottom:.4rem}
.act-ct-label{font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.15rem}
.act-card h4{font-size:.88rem;font-weight:700;line-height:1.35;color:var(--ink)}
.act-grade{position:absolute;top:.75rem;right:.75rem;font-size:.6rem;font-weight:700;padding:.14rem .42rem;border-radius:4px;background:rgba(255,255,255,.85);color:var(--ink-soft);border:1px solid rgba(0,0,0,.1)}
.act-card-body{padding:.75rem 1.15rem 1rem}
.act-card-body p{font-size:.8rem;color:var(--ink-soft);line-height:1.6;margin-bottom:.6rem}
.act-chips{display:flex;flex-wrap:wrap;gap:.22rem}
.chip{font-size:.6rem;font-weight:700;padding:.13rem .42rem;border-radius:3px;letter-spacing:.03em}
.chip-unp{background:#F0FDF4;color:#166534}
.chip-plug{background:#EFF6FF;color:#1E40AF}
.chip-grp{background:var(--gold-light);color:var(--gold)}
.chip-ind{background:var(--saffron-light);color:var(--saffron-dark)}
.chip-pair{background:var(--violet-light);color:var(--violet-dark)}
.chip-t20{background:#F5F3FF;color:#6D28D9}
.chip-t30{background:#FFF7ED;color:#9A3E00}
.chip-t45{background:var(--teal-light);color:var(--teal-dark)}

.login-wall{position:relative;overflow:hidden}
.login-wall-content{filter:blur(5px) brightness(.97);pointer-events:none;user-select:none;max-height:460px;overflow:hidden}
.login-wall-overlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.55) 25%,rgba(255,255,255,.94) 55%,#fff 100%)}
.lw-box{text-align:center;padding:2.1rem 2rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);max-width:375px;width:90%}
.lw-lock{width:56px;height:56px;border-radius:50%;background:var(--saffron-light);display:flex;align-items:center;justify-content:center;font-size:1.55rem;margin:0 auto .85rem;border:2px solid rgba(232,93,4,.2)}
.lw-box h3{font-family:var(--font-display);font-size:1.12rem;font-weight:700;margin-bottom:.4rem;color:var(--ink)}
.lw-box p{font-size:.83rem;color:var(--muted);margin-bottom:1.25rem;line-height:1.6}
.lw-btns{display:flex;gap:.55rem;justify-content:center}
.lw-btn-p{background:var(--saffron);color:#fff;padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:none;cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-p:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.lw-btn-s{background:var(--white);color:var(--ink);padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:1.5px solid var(--border);cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-s:hover{border-color:var(--saffron);color:var(--saffron)}
.lw-perks{display:flex;justify-content:center;gap:.9rem;flex-wrap:wrap;margin-top:.85rem;padding-top:.8rem;border-top:1px solid var(--border)}
.lw-perk{font-size:.7rem;color:var(--muted)}

.modal-overlay{display:none;position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);align-items:center;justify-content:center;padding:1rem}
.modal-overlay.open{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);padding:2rem;width:100%;max-width:420px;position:relative;box-shadow:var(--shadow-lg);animation:mi .2s ease}
@keyframes mi{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--muted)}
.auth-tabs{display:flex;gap:.4rem;background:var(--surface);border-radius:var(--r-md);padding:.3rem;margin-bottom:1.4rem}
.auth-tab{flex:1;padding:.42rem;border-radius:var(--r-sm);border:none;background:transparent;cursor:pointer;font-size:.85rem;font-weight:600;color:var(--muted);transition:all .15s;font-family:var(--font-body)}
.auth-tab.active{background:var(--white);color:var(--ink);box-shadow:var(--shadow-sm)}
.auth-pane{display:none}.auth-pane.active{display:block}
.form-g{margin-bottom:.9rem}
.form-label{display:block;font-size:.8rem;font-weight:600;color:var(--ink-soft);margin-bottom:.3rem}
.form-input{width:100%;padding:.6rem .9rem;border:1.5px solid var(--border);border-radius:var(--r-md);font-size:.9rem;font-family:var(--font-body);color:var(--ink);background:var(--white)}
.form-input:focus{outline:none;border-color:var(--saffron)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.auth-submit{width:100%;justify-content:center;padding:.68rem;margin-top:.2rem}

.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.6rem 1.2rem;border-radius:var(--r-full);font-size:.84rem;font-weight:500;opacity:0;transition:all .3s;z-index:1000;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

.blog-footer{background:var(--ink);color:rgba(255,255,255,.45);text-align:center;padding:2rem;font-size:.8rem}
.blog-footer a{color:#F48C42}

@keyframes fu{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.fu{animation:fu .5s ease both}.d1{animation-delay:.1s}.d2{animation-delay:.2s}.d3{animation-delay:.3s}

.hero-bg{background:radial-gradient(ellipse 55% 65% at 10% 35%,rgba(180,83,9,.35) 0%,transparent 55%),
    radial-gradient(ellipse 45% 55% at 88% 20%,rgba(232,93,4,.3) 0%,transparent 55%),
    radial-gradient(ellipse 35% 40% at 60% 88%,rgba(55,48,163,.2) 0%,transparent 50%)}
.eyebrow{background:rgba(180,83,9,.2);border:1px solid rgba(180,83,9,.4);color:#FBBF24}
.pull-quote{border-left-color:#B45309;background:#FEFCE8;color:#78350F}
.callout-s{background:#FEFCE8;border:1.5px solid rgba(180,83,9,.25);color:#78350F}
.callout-s h4{color:#B45309}
.lesson-plan-header{background:#FEFCE8;border-bottom:1px solid rgba(180,83,9,.2)}

/* ===== subject-science.html ===== */
:root{
  --saffron:#E85D04;--saffron-light:#FEF0E7;--saffron-dark:#9A3E00;
  --teal:#0A7B6C;--teal-light:#E0F4F1;--teal-dark:#064E46;
  --indigo:#3730A3;--indigo-light:#EEF2FF;--indigo-dark:#1E1B6E;
  --gold:#B45309;--gold-light:#FEFCE8;
  --rose:#BE123C;--rose-light:#FFF1F2;
  --green:#15803D;--green-light:#F0FDF4;--green-dark:#14532D;
  --violet:#7C3AED;--violet-light:#F5F3FF;--violet-dark:#4C1D95;
  --ink:#111827;--ink-soft:#374151;--muted:#6B7280;
  --border:#E5E7EB;--surface:#F9FAFB;--white:#FFFFFF;
  --font-display: Arial, sans-serif;
  --font-body: Arial, sans-serif;
  --r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-full:999px;
  --shadow-sm:0 2px 10px rgba(0,0,0,.08);
  --shadow-md:0 4px 24px rgba(0,0,0,.10);
  --shadow-lg:0 8px 40px rgba(0,0,0,.14);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}ul,ol{list-style:none}[id]{scroll-margin-top:76px}

nav{position:sticky;top:0;z-index:200;background:rgba(249,250,251,.97);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);height:64px;display:flex;align-items:center;padding:0 2rem;gap:1rem}
.nav-logo{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--ink)}.nav-logo span{color:var(--saffron)}
.nav-breadcrumb{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--muted)}
.nav-breadcrumb a:hover{color:var(--saffron)}
.nav-sep{color:#d1d5db}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:.75rem}
.btn{display:inline-flex;align-items:center;padding:.55rem 1.25rem;border-radius:var(--r-md);font-weight:600;font-size:.875rem;transition:all .18s;border:none;cursor:pointer;font-family:var(--font-body)}
.btn-primary{background:var(--saffron);color:#fff}.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-sm{padding:.4rem 1rem;font-size:.8rem}

.hero{color:#fff;padding:5rem 2rem 4rem;position:relative;overflow:hidden;background:var(--ink)}
.hero-bg{position:absolute;inset:0}
.hero-inner{position:relative;z-index:1;max-width:860px;margin:0 auto}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;padding:.28rem .9rem;border-radius:var(--r-full);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:1.4rem}
.hero h1{font-family:var(--font-display);font-size:clamp(1.9rem,4.5vw,3.1rem);line-height:1.1;font-weight:700;letter-spacing:-.02em;margin-bottom:1.1rem}
.hero h1 em{font-style:italic;font-weight:300;color:#FBBF24}
.hero-sub{font-size:1rem;color:rgba(255,255,255,.68);max-width:600px;line-height:1.7;margin-bottom:1.8rem}
.hero-meta{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.hero-meta-item{font-size:.8rem;color:rgba(255,255,255,.45)}
.hero-meta-item span{color:rgba(255,255,255,.7);font-weight:500}
.hero-tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1.1rem}
.tag{display:inline-flex;align-items:center;padding:.2rem .65rem;border-radius:var(--r-full);font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.tag-a{background:rgba(232,93,4,.25);color:#FBBF24;border:1px solid rgba(232,93,4,.3)}
.tag-b{background:rgba(10,123,108,.25);color:#6EE7B7;border:1px solid rgba(10,123,108,.3)}
.tag-c{background:rgba(55,48,163,.25);color:#A5B4FC;border:1px solid rgba(55,48,163,.3)}

.pillars-strip{background:var(--white);border-bottom:1px solid var(--border);padding:1.25rem 2rem}
.pillars-strip-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media(max-width:640px){.pillars-strip-inner{grid-template-columns:repeat(2,1fr)}}
.pillar-chip{display:flex;align-items:flex-start;gap:.65rem;padding:.75rem .9rem;border-radius:var(--r-md);border:1.5px solid}
.pillar-chip-icon{width:32px;height:32px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;background:rgba(255,255,255,.6)}
.pillar-chip h4{font-size:.8rem;font-weight:700;margin-bottom:.1rem}
.pillar-chip p{font-size:.7rem;line-height:1.4;margin:0;opacity:.75}

.blog-layout{max-width:1100px;margin:0 auto;padding:3rem 2rem;display:grid;grid-template-columns:1fr 285px;gap:3rem;align-items:start}
@media(max-width:880px){.blog-layout{grid-template-columns:1fr}}
@media(max-width:560px){.blog-layout{padding:2rem 1.25rem}}

.blog-article h2{font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--ink);margin:2.5rem 0 .8rem;line-height:1.2}
.blog-article h3{font-family:var(--font-display);font-size:1.08rem;font-weight:600;color:var(--ink-soft);margin:1.75rem 0 .55rem}
.blog-article p{font-size:.98rem;color:var(--ink-soft);line-height:1.8;margin-bottom:1.1rem}
.blog-article strong{color:var(--ink);font-weight:600}
.blog-article code{font-family:monospace;font-size:.84rem;background:#F3F4F6;padding:.1rem .3rem;border-radius:4px}
.divider{height:1px;background:var(--border);margin:2rem 0}

.pull-quote{border-left:4px solid;padding:1rem 1.4rem;border-radius:0 var(--r-md) var(--r-md) 0;margin:1.75rem 0;font-family:var(--font-display);font-size:1.02rem;font-style:italic;line-height:1.6}

.callout{border:1.5px solid;border-radius:var(--r-lg);padding:1.1rem 1.4rem;margin:1.75rem 0}
.callout h4{font-weight:700;font-size:.88rem;margin-bottom:.3rem}
.callout p{font-size:.865rem;margin:0;line-height:1.65}

.tip-row{display:flex;flex-direction:column;gap:.65rem;margin:1rem 0}
.tip-item{display:flex;align-items:flex-start;gap:.85rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-md);padding:.9rem 1.1rem;font-size:.865rem;color:var(--ink-soft);line-height:1.65}
.tip-icon{font-size:1.1rem;flex-shrink:0;margin-top:.05rem}

.lesson-plan-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);overflow:hidden;margin:1.5rem 0}
.lesson-plan-header{padding:1rem 1.5rem;border-bottom:1px solid var(--border)}
.lesson-plan-header h3{font-size:.97rem;font-weight:700;margin-bottom:.15rem}
.lesson-plan-header p{font-size:.78rem;color:var(--muted);margin:0}
.lesson-row{display:flex;gap:1rem;padding:.58rem .5rem;border-bottom:1px solid var(--border);font-size:.845rem}
.lesson-row:last-child{border-bottom:none}
.lesson-label{font-weight:700;width:88px;flex-shrink:0;color:var(--ink-soft);font-size:.78rem}
.lesson-val{color:var(--ink-soft);line-height:1.6}

.sidebar{position:sticky;top:80px}
.sidebar-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.3rem;margin-bottom:1rem}
.sidebar-box h5{font-family:var(--font-display);font-size:.87rem;font-weight:700;margin-bottom:.85rem;color:var(--ink)}
.toc-link{display:flex;align-items:center;gap:.5rem;padding:.3rem 0;font-size:.79rem;color:var(--muted);border-bottom:1px solid var(--border);transition:color .15s}
.toc-link:last-child{border-bottom:none}.toc-link:hover,.toc-link.active{color:var(--saffron)}
.toc-dot{width:5px;height:5px;border-radius:50%;background:var(--border);flex-shrink:0}
.toc-link.active .toc-dot,.toc-link:hover .toc-dot{background:var(--saffron)}
.subj-link{display:flex;align-items:center;gap:.6rem;padding:.45rem .6rem;border-radius:var(--r-md);font-size:.81rem;font-weight:500;color:var(--muted);transition:all .15s;margin-bottom:.2rem}
.subj-link:hover{color:var(--ink);background:var(--surface)}
.subj-link.cur{background:var(--saffron-light);color:var(--saffron-dark);font-weight:700}

.activities-section{background:var(--white);border-top:2px solid var(--border);padding:4rem 2rem}
.activities-inner{max-width:1100px;margin:0 auto}
.act-header{text-align:center;margin-bottom:2rem}
.act-eyebrow{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--saffron);margin-bottom:.45rem}
.act-header h2{font-family:var(--font-display);font-size:clamp(1.4rem,3vw,1.9rem);font-weight:700;margin-bottom:.45rem}
.act-header p{font-size:.88rem;color:var(--muted);max-width:440px;margin:0 auto}

.act-filters{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;margin-bottom:1.75rem}
.act-filter{padding:.33rem .82rem;border-radius:var(--r-full);border:1.5px solid var(--border);background:transparent;font-size:.78rem;font-weight:600;color:var(--muted);cursor:pointer;transition:all .15s;font-family:var(--font-body)}
.act-filter:hover{border-color:var(--saffron);color:var(--saffron)}
.act-filter.active{background:var(--saffron);color:#fff;border-color:var(--saffron)}

.act-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
@media(max-width:760px){.act-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.act-grid{grid-template-columns:1fr}}
.act-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:transform .2s,box-shadow .2s}
.act-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.act-card-top{padding:1.15rem 1.15rem .9rem;position:relative}
.act-emoji{font-size:1.9rem;display:block;margin-bottom:.4rem}
.act-ct-label{font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.15rem}
.act-card h4{font-size:.88rem;font-weight:700;line-height:1.35;color:var(--ink)}
.act-grade{position:absolute;top:.75rem;right:.75rem;font-size:.6rem;font-weight:700;padding:.14rem .42rem;border-radius:4px;background:rgba(255,255,255,.85);color:var(--ink-soft);border:1px solid rgba(0,0,0,.1)}
.act-card-body{padding:.75rem 1.15rem 1rem}
.act-card-body p{font-size:.8rem;color:var(--ink-soft);line-height:1.6;margin-bottom:.6rem}
.act-chips{display:flex;flex-wrap:wrap;gap:.22rem}
.chip{font-size:.6rem;font-weight:700;padding:.13rem .42rem;border-radius:3px;letter-spacing:.03em}
.chip-unp{background:#F0FDF4;color:#166534}
.chip-plug{background:#EFF6FF;color:#1E40AF}
.chip-grp{background:var(--gold-light);color:var(--gold)}
.chip-ind{background:var(--saffron-light);color:var(--saffron-dark)}
.chip-pair{background:var(--violet-light);color:var(--violet-dark)}
.chip-t20{background:#F5F3FF;color:#6D28D9}
.chip-t30{background:#FFF7ED;color:#9A3E00}
.chip-t45{background:var(--teal-light);color:var(--teal-dark)}

.login-wall{position:relative;overflow:hidden}
.login-wall-content{filter:blur(5px) brightness(.97);pointer-events:none;user-select:none;max-height:460px;overflow:hidden}
.login-wall-overlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.55) 25%,rgba(255,255,255,.94) 55%,#fff 100%)}
.lw-box{text-align:center;padding:2.1rem 2rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);max-width:375px;width:90%}
.lw-lock{width:56px;height:56px;border-radius:50%;background:var(--saffron-light);display:flex;align-items:center;justify-content:center;font-size:1.55rem;margin:0 auto .85rem;border:2px solid rgba(232,93,4,.2)}
.lw-box h3{font-family:var(--font-display);font-size:1.12rem;font-weight:700;margin-bottom:.4rem;color:var(--ink)}
.lw-box p{font-size:.83rem;color:var(--muted);margin-bottom:1.25rem;line-height:1.6}
.lw-btns{display:flex;gap:.55rem;justify-content:center}
.lw-btn-p{background:var(--saffron);color:#fff;padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:none;cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-p:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.lw-btn-s{background:var(--white);color:var(--ink);padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:1.5px solid var(--border);cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-s:hover{border-color:var(--saffron);color:var(--saffron)}
.lw-perks{display:flex;justify-content:center;gap:.9rem;flex-wrap:wrap;margin-top:.85rem;padding-top:.8rem;border-top:1px solid var(--border)}
.lw-perk{font-size:.7rem;color:var(--muted)}

.modal-overlay{display:none;position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);align-items:center;justify-content:center;padding:1rem}
.modal-overlay.open{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);padding:2rem;width:100%;max-width:420px;position:relative;box-shadow:var(--shadow-lg);animation:mi .2s ease}
@keyframes mi{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--muted)}
.auth-tabs{display:flex;gap:.4rem;background:var(--surface);border-radius:var(--r-md);padding:.3rem;margin-bottom:1.4rem}
.auth-tab{flex:1;padding:.42rem;border-radius:var(--r-sm);border:none;background:transparent;cursor:pointer;font-size:.85rem;font-weight:600;color:var(--muted);transition:all .15s;font-family:var(--font-body)}
.auth-tab.active{background:var(--white);color:var(--ink);box-shadow:var(--shadow-sm)}
.auth-pane{display:none}.auth-pane.active{display:block}
.form-g{margin-bottom:.9rem}
.form-label{display:block;font-size:.8rem;font-weight:600;color:var(--ink-soft);margin-bottom:.3rem}
.form-input{width:100%;padding:.6rem .9rem;border:1.5px solid var(--border);border-radius:var(--r-md);font-size:.9rem;font-family:var(--font-body);color:var(--ink);background:var(--white)}
.form-input:focus{outline:none;border-color:var(--saffron)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.auth-submit{width:100%;justify-content:center;padding:.68rem;margin-top:.2rem}

.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.6rem 1.2rem;border-radius:var(--r-full);font-size:.84rem;font-weight:500;opacity:0;transition:all .3s;z-index:1000;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

.blog-footer{background:var(--ink);color:rgba(255,255,255,.45);text-align:center;padding:2rem;font-size:.8rem}
.blog-footer a{color:#F48C42}

@keyframes fu{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.fu{animation:fu .5s ease both}.d1{animation-delay:.1s}.d2{animation-delay:.2s}.d3{animation-delay:.3s}

.hero-bg{background:radial-gradient(ellipse 55% 65% at 10% 35%,rgba(10,123,108,.38) 0%,transparent 55%),
    radial-gradient(ellipse 45% 55% at 88% 20%,rgba(41,168,152,.3) 0%,transparent 55%),
    radial-gradient(ellipse 35% 40% at 60% 88%,rgba(21,128,61,.2) 0%,transparent 50%)}
.eyebrow{background:rgba(10,123,108,.2);border:1px solid rgba(10,123,108,.4);color:#FBBF24}
.pull-quote{border-left-color:#0A7B6C;background:#E0F4F1;color:#064E46}
.callout-s{background:#E0F4F1;border:1.5px solid rgba(10,123,108,.25);color:#064E46}
.callout-s h4{color:#0A7B6C}
.lesson-plan-header{background:#E0F4F1;border-bottom:1px solid rgba(10,123,108,.2)}

/* ===== subject-social-science.html ===== */
:root{
  --saffron:#E85D04;--saffron-light:#FEF0E7;--saffron-dark:#9A3E00;
  --teal:#0A7B6C;--teal-light:#E0F4F1;--teal-dark:#064E46;
  --indigo:#3730A3;--indigo-light:#EEF2FF;--indigo-dark:#1E1B6E;
  --gold:#B45309;--gold-light:#FEFCE8;
  --rose:#BE123C;--rose-light:#FFF1F2;
  --green:#15803D;--green-light:#F0FDF4;--green-dark:#14532D;
  --violet:#7C3AED;--violet-light:#F5F3FF;--violet-dark:#4C1D95;
  --ink:#111827;--ink-soft:#374151;--muted:#6B7280;
  --border:#E5E7EB;--surface:#F9FAFB;--white:#FFFFFF;
  --font-display: Arial, sans-serif;
  --font-body: Arial, sans-serif;
  --r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-full:999px;
  --shadow-sm:0 2px 10px rgba(0,0,0,.08);
  --shadow-md:0 4px 24px rgba(0,0,0,.10);
  --shadow-lg:0 8px 40px rgba(0,0,0,.14);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}ul,ol{list-style:none}[id]{scroll-margin-top:76px}

nav{position:sticky;top:0;z-index:200;background:rgba(249,250,251,.97);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);height:64px;display:flex;align-items:center;padding:0 2rem;gap:1rem}
.nav-logo{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--ink)}.nav-logo span{color:var(--saffron)}
.nav-breadcrumb{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--muted)}
.nav-breadcrumb a:hover{color:var(--saffron)}
.nav-sep{color:#d1d5db}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:.75rem}
.btn{display:inline-flex;align-items:center;padding:.55rem 1.25rem;border-radius:var(--r-md);font-weight:600;font-size:.875rem;transition:all .18s;border:none;cursor:pointer;font-family:var(--font-body)}
.btn-primary{background:var(--saffron);color:#fff}.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-sm{padding:.4rem 1rem;font-size:.8rem}

.hero{color:#fff;padding:5rem 2rem 4rem;position:relative;overflow:hidden;background:var(--ink)}
.hero-bg{position:absolute;inset:0}
.hero-inner{position:relative;z-index:1;max-width:860px;margin:0 auto}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;padding:.28rem .9rem;border-radius:var(--r-full);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:1.4rem}
.hero h1{font-family:var(--font-display);font-size:clamp(1.9rem,4.5vw,3.1rem);line-height:1.1;font-weight:700;letter-spacing:-.02em;margin-bottom:1.1rem}
.hero h1 em{font-style:italic;font-weight:300;color:#FBBF24}
.hero-sub{font-size:1rem;color:rgba(255,255,255,.68);max-width:600px;line-height:1.7;margin-bottom:1.8rem}
.hero-meta{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap}
.hero-meta-item{font-size:.8rem;color:rgba(255,255,255,.45)}
.hero-meta-item span{color:rgba(255,255,255,.7);font-weight:500}
.hero-tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1.1rem}
.tag{display:inline-flex;align-items:center;padding:.2rem .65rem;border-radius:var(--r-full);font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.tag-a{background:rgba(232,93,4,.25);color:#FBBF24;border:1px solid rgba(232,93,4,.3)}
.tag-b{background:rgba(10,123,108,.25);color:#6EE7B7;border:1px solid rgba(10,123,108,.3)}
.tag-c{background:rgba(55,48,163,.25);color:#A5B4FC;border:1px solid rgba(55,48,163,.3)}

.pillars-strip{background:var(--white);border-bottom:1px solid var(--border);padding:1.25rem 2rem}
.pillars-strip-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
@media(max-width:640px){.pillars-strip-inner{grid-template-columns:repeat(2,1fr)}}
.pillar-chip{display:flex;align-items:flex-start;gap:.65rem;padding:.75rem .9rem;border-radius:var(--r-md);border:1.5px solid}
.pillar-chip-icon{width:32px;height:32px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;background:rgba(255,255,255,.6)}
.pillar-chip h4{font-size:.8rem;font-weight:700;margin-bottom:.1rem}
.pillar-chip p{font-size:.7rem;line-height:1.4;margin:0;opacity:.75}

.blog-layout{max-width:1100px;margin:0 auto;padding:3rem 2rem;display:grid;grid-template-columns:1fr 285px;gap:3rem;align-items:start}
@media(max-width:880px){.blog-layout{grid-template-columns:1fr}}
@media(max-width:560px){.blog-layout{padding:2rem 1.25rem}}

.blog-article h2{font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--ink);margin:2.5rem 0 .8rem;line-height:1.2}
.blog-article h3{font-family:var(--font-display);font-size:1.08rem;font-weight:600;color:var(--ink-soft);margin:1.75rem 0 .55rem}
.blog-article p{font-size:.98rem;color:var(--ink-soft);line-height:1.8;margin-bottom:1.1rem}
.blog-article strong{color:var(--ink);font-weight:600}
.blog-article code{font-family:monospace;font-size:.84rem;background:#F3F4F6;padding:.1rem .3rem;border-radius:4px}
.divider{height:1px;background:var(--border);margin:2rem 0}

.pull-quote{border-left:4px solid;padding:1rem 1.4rem;border-radius:0 var(--r-md) var(--r-md) 0;margin:1.75rem 0;font-family:var(--font-display);font-size:1.02rem;font-style:italic;line-height:1.6}

.callout{border:1.5px solid;border-radius:var(--r-lg);padding:1.1rem 1.4rem;margin:1.75rem 0}
.callout h4{font-weight:700;font-size:.88rem;margin-bottom:.3rem}
.callout p{font-size:.865rem;margin:0;line-height:1.65}

.tip-row{display:flex;flex-direction:column;gap:.65rem;margin:1rem 0}
.tip-item{display:flex;align-items:flex-start;gap:.85rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-md);padding:.9rem 1.1rem;font-size:.865rem;color:var(--ink-soft);line-height:1.65}
.tip-icon{font-size:1.1rem;flex-shrink:0;margin-top:.05rem}

.lesson-plan-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);overflow:hidden;margin:1.5rem 0}
.lesson-plan-header{padding:1rem 1.5rem;border-bottom:1px solid var(--border)}
.lesson-plan-header h3{font-size:.97rem;font-weight:700;margin-bottom:.15rem}
.lesson-plan-header p{font-size:.78rem;color:var(--muted);margin:0}
.lesson-row{display:flex;gap:1rem;padding:.58rem .5rem;border-bottom:1px solid var(--border);font-size:.845rem}
.lesson-row:last-child{border-bottom:none}
.lesson-label{font-weight:700;width:88px;flex-shrink:0;color:var(--ink-soft);font-size:.78rem}
.lesson-val{color:var(--ink-soft);line-height:1.6}

.sidebar{position:sticky;top:80px}
.sidebar-box{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);padding:1.3rem;margin-bottom:1rem}
.sidebar-box h5{font-family:var(--font-display);font-size:.87rem;font-weight:700;margin-bottom:.85rem;color:var(--ink)}
.toc-link{display:flex;align-items:center;gap:.5rem;padding:.3rem 0;font-size:.79rem;color:var(--muted);border-bottom:1px solid var(--border);transition:color .15s}
.toc-link:last-child{border-bottom:none}.toc-link:hover,.toc-link.active{color:var(--saffron)}
.toc-dot{width:5px;height:5px;border-radius:50%;background:var(--border);flex-shrink:0}
.toc-link.active .toc-dot,.toc-link:hover .toc-dot{background:var(--saffron)}
.subj-link{display:flex;align-items:center;gap:.6rem;padding:.45rem .6rem;border-radius:var(--r-md);font-size:.81rem;font-weight:500;color:var(--muted);transition:all .15s;margin-bottom:.2rem}
.subj-link:hover{color:var(--ink);background:var(--surface)}
.subj-link.cur{background:var(--saffron-light);color:var(--saffron-dark);font-weight:700}

.activities-section{background:var(--white);border-top:2px solid var(--border);padding:4rem 2rem}
.activities-inner{max-width:1100px;margin:0 auto}
.act-header{text-align:center;margin-bottom:2rem}
.act-eyebrow{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--saffron);margin-bottom:.45rem}
.act-header h2{font-family:var(--font-display);font-size:clamp(1.4rem,3vw,1.9rem);font-weight:700;margin-bottom:.45rem}
.act-header p{font-size:.88rem;color:var(--muted);max-width:440px;margin:0 auto}

.act-filters{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;margin-bottom:1.75rem}
.act-filter{padding:.33rem .82rem;border-radius:var(--r-full);border:1.5px solid var(--border);background:transparent;font-size:.78rem;font-weight:600;color:var(--muted);cursor:pointer;transition:all .15s;font-family:var(--font-body)}
.act-filter:hover{border-color:var(--saffron);color:var(--saffron)}
.act-filter.active{background:var(--saffron);color:#fff;border-color:var(--saffron)}

.act-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
@media(max-width:760px){.act-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.act-grid{grid-template-columns:1fr}}
.act-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:transform .2s,box-shadow .2s}
.act-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.act-card-top{padding:1.15rem 1.15rem .9rem;position:relative}
.act-emoji{font-size:1.9rem;display:block;margin-bottom:.4rem}
.act-ct-label{font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.15rem}
.act-card h4{font-size:.88rem;font-weight:700;line-height:1.35;color:var(--ink)}
.act-grade{position:absolute;top:.75rem;right:.75rem;font-size:.6rem;font-weight:700;padding:.14rem .42rem;border-radius:4px;background:rgba(255,255,255,.85);color:var(--ink-soft);border:1px solid rgba(0,0,0,.1)}
.act-card-body{padding:.75rem 1.15rem 1rem}
.act-card-body p{font-size:.8rem;color:var(--ink-soft);line-height:1.6;margin-bottom:.6rem}
.act-chips{display:flex;flex-wrap:wrap;gap:.22rem}
.chip{font-size:.6rem;font-weight:700;padding:.13rem .42rem;border-radius:3px;letter-spacing:.03em}
.chip-unp{background:#F0FDF4;color:#166534}
.chip-plug{background:#EFF6FF;color:#1E40AF}
.chip-grp{background:var(--gold-light);color:var(--gold)}
.chip-ind{background:var(--saffron-light);color:var(--saffron-dark)}
.chip-pair{background:var(--violet-light);color:var(--violet-dark)}
.chip-t20{background:#F5F3FF;color:#6D28D9}
.chip-t30{background:#FFF7ED;color:#9A3E00}
.chip-t45{background:var(--teal-light);color:var(--teal-dark)}

.login-wall{position:relative;overflow:hidden}
.login-wall-content{filter:blur(5px) brightness(.97);pointer-events:none;user-select:none;max-height:460px;overflow:hidden}
.login-wall-overlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.55) 25%,rgba(255,255,255,.94) 55%,#fff 100%)}
.lw-box{text-align:center;padding:2.1rem 2rem;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);max-width:375px;width:90%}
.lw-lock{width:56px;height:56px;border-radius:50%;background:var(--saffron-light);display:flex;align-items:center;justify-content:center;font-size:1.55rem;margin:0 auto .85rem;border:2px solid rgba(232,93,4,.2)}
.lw-box h3{font-family:var(--font-display);font-size:1.12rem;font-weight:700;margin-bottom:.4rem;color:var(--ink)}
.lw-box p{font-size:.83rem;color:var(--muted);margin-bottom:1.25rem;line-height:1.6}
.lw-btns{display:flex;gap:.55rem;justify-content:center}
.lw-btn-p{background:var(--saffron);color:#fff;padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:none;cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-p:hover{background:var(--saffron-dark);transform:translateY(-1px)}
.lw-btn-s{background:var(--white);color:var(--ink);padding:.56rem 1.3rem;border-radius:var(--r-md);font-weight:700;font-size:.87rem;border:1.5px solid var(--border);cursor:pointer;font-family:var(--font-body);transition:all .18s}
.lw-btn-s:hover{border-color:var(--saffron);color:var(--saffron)}
.lw-perks{display:flex;justify-content:center;gap:.9rem;flex-wrap:wrap;margin-top:.85rem;padding-top:.8rem;border-top:1px solid var(--border)}
.lw-perk{font-size:.7rem;color:var(--muted)}

.modal-overlay{display:none;position:fixed;inset:0;z-index:500;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);align-items:center;justify-content:center;padding:1rem}
.modal-overlay.open{display:flex}
.modal-box{background:var(--white);border-radius:var(--r-xl);padding:2rem;width:100%;max-width:420px;position:relative;box-shadow:var(--shadow-lg);animation:mi .2s ease}
@keyframes mi{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--muted)}
.auth-tabs{display:flex;gap:.4rem;background:var(--surface);border-radius:var(--r-md);padding:.3rem;margin-bottom:1.4rem}
.auth-tab{flex:1;padding:.42rem;border-radius:var(--r-sm);border:none;background:transparent;cursor:pointer;font-size:.85rem;font-weight:600;color:var(--muted);transition:all .15s;font-family:var(--font-body)}
.auth-tab.active{background:var(--white);color:var(--ink);box-shadow:var(--shadow-sm)}
.auth-pane{display:none}.auth-pane.active{display:block}
.form-g{margin-bottom:.9rem}
.form-label{display:block;font-size:.8rem;font-weight:600;color:var(--ink-soft);margin-bottom:.3rem}
.form-input{width:100%;padding:.6rem .9rem;border:1.5px solid var(--border);border-radius:var(--r-md);font-size:.9rem;font-family:var(--font-body);color:var(--ink);background:var(--white)}
.form-input:focus{outline:none;border-color:var(--saffron)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.auth-submit{width:100%;justify-content:center;padding:.68rem;margin-top:.2rem}

.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.6rem 1.2rem;border-radius:var(--r-full);font-size:.84rem;font-weight:500;opacity:0;transition:all .3s;z-index:1000;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

.blog-footer{background:var(--ink);color:rgba(255,255,255,.45);text-align:center;padding:2rem;font-size:.8rem}
.blog-footer a{color:#F48C42}

@keyframes fu{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.fu{animation:fu .5s ease both}.d1{animation-delay:.1s}.d2{animation-delay:.2s}.d3{animation-delay:.3s}

.hero-bg{background:radial-gradient(ellipse 55% 65% at 10% 35%,rgba(190,18,60,.35) 0%,transparent 55%),
    radial-gradient(ellipse 45% 55% at 88% 20%,rgba(244,63,94,.28) 0%,transparent 55%),
    radial-gradient(ellipse 35% 40% at 60% 88%,rgba(232,93,4,.2) 0%,transparent 50%)}
.eyebrow{background:rgba(190,18,60,.2);border:1px solid rgba(190,18,60,.4);color:#FBBF24}
.pull-quote{border-left-color:#BE123C;background:#FFF1F2;color:#9F1239}
.callout-s{background:#FFF1F2;border:1.5px solid rgba(190,18,60,.25);color:#9F1239}
.callout-s h4{color:#BE123C}
.lesson-plan-header{background:#FFF1F2;border-bottom:1px solid rgba(190,18,60,.2)}




/* ══════════════════════════════════════════════════════
   ENQUIRY SECTION
══════════════════════════════════════════════════════ */
.enquiry-wrap{
  display:grid;grid-template-columns:1fr 1.6fr;gap:2.5rem;align-items:start;
}
@media(max-width:820px){.enquiry-wrap{grid-template-columns:1fr}}

.enquiry-info{display:flex;flex-direction:column;gap:1rem}
.eq-info-card{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-lg);padding:1.4rem 1.25rem;
  display:flex;gap:1rem;align-items:flex-start;
  transition:box-shadow .2s,transform .2s;
}
.eq-info-card:hover{box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.eq-info-icon{font-size:1.5rem;flex-shrink:0;width:42px;height:42px;background:var(--saffron-light);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center}
.eq-info-card h4{font-size:.93rem;font-weight:700;margin-bottom:.3rem}
.eq-info-card p{font-size:.82rem;color:var(--muted);line-height:1.6}

.eq-contact-strip{
  background:linear-gradient(135deg,var(--indigo),var(--indigo-dark));
  border-radius:var(--r-lg);padding:1.35rem 1.4rem;
  display:flex;flex-direction:column;gap:.7rem;
}
.eq-contact-item{display:flex;align-items:center;gap:.65rem;color:#fff;font-size:.85rem}
.eq-contact-icon{font-size:1rem;width:28px;text-align:center}

.enquiry-form-box{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-xl);padding:2rem;
  box-shadow:var(--shadow-sm);
}
.form-textarea{resize:vertical;min-height:110px;line-height:1.65}
.enquiry-alert{
  padding:.7rem 1rem;border-radius:var(--r-sm);margin-bottom:1rem;
  font-size:.83rem;font-weight:600;
}
.enquiry-alert.error{background:var(--rose-light);color:var(--rose);border:1px solid #FECDD3}
.enquiry-alert.success{background:var(--green-light);color:var(--green);border:1px solid #BBF7D0}


















/* ══════════════════════════════════════════════════════
   DESIGN TOKENS
══════════════════════════════════════════════════════ */
:root {
  /* Core palette — warm saffron + deep teal + rich indigo */
  --saffron:       #E85D04;
  --saffron-light: #FEF0E7;
  --saffron-mid:   #F48C42;
  --saffron-dark:  #9A3E00;
  --teal:          #0A7B6C;
  --teal-light:    #E0F4F1;
  --teal-mid:      #29A898;
  --teal-dark:     #064E46;
  --indigo:        #3730A3;
  --indigo-light:  #EEF2FF;
  --indigo-dark:   #1E1B6E;
  --gold:          #B45309;
  --gold-light:    #FEFCE8;
  --rose:          #BE123C;
  --rose-light:    #FFF1F2;
  --green:         #15803D;
  --green-light:   #F0FDF4;

  /* Neutrals */
  --ink:           #111827;
  --ink-soft:      #374151;
  --muted:         #6B7280;
  --border:        #E5E7EB;
  --border-dark:   #D1D5DB;
  --surface:       #F9FAFB;
  --white:         #FFFFFF;

  /* Typography */
  --font-display:  Arial, sans-serif;
  --font-body:     Arial, sans-serif;
  --font-mono:     Arial, sans-serif;

  /* Radii */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-full: 999px;

  /* Shadows */
  --shadow-xs: 0 1px 3px rgba(0,0,0,0.07);
  --shadow-sm: 0 2px 10px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 24px rgba(0,0,0,0.10);
  --shadow-lg: 0 8px 40px rgba(0,0,0,0.13);
}

/* ══════════════════════════════════════════════════════
   RESET & BASE
══════════════════════════════════════════════════════ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-body);background:var(--surface);color:var(--ink);line-height:1.7;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button{font-family:var(--font-body);cursor:pointer}
input,textarea,select{font-family:var(--font-body)}
[id]{scroll-margin-top:72px}

/* ══════════════════════════════════════════════════════
   UTILITIES
══════════════════════════════════════════════════════ */
.container{max-width:1120px;margin:0 auto;padding:0 1.5rem}
.container-wide{max-width:1320px;margin:0 auto;padding:0 1.5rem}
.section{padding:5rem 0}
.section-alt{background:var(--white)}
.section-header{text-align:center;margin-bottom:3.5rem}
.eyebrow{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--saffron);margin-bottom:.6rem}
.section-title{font-family:var(--font-display);font-size:clamp(1.75rem,3.2vw,2.4rem);font-weight:700;line-height:1.15;margin-bottom:.75rem;color:var(--ink)}
.section-sub{color:var(--muted);font-size:1rem;max-width:520px;margin:0 auto;line-height:1.65}
.text-center{text-align:center}
.flex{display:flex}
.gap-1{gap:.5rem}.gap-2{gap:1rem}.gap-3{gap:1.5rem}.gap-4{gap:2rem}
.items-center{align-items:center}
.wrap{flex-wrap:wrap}
.grid{display:grid}
.hidden{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

/* Badges */
.badge{display:inline-flex;align-items:center;gap:.25rem;font-size:.68rem;font-weight:700;padding:.2rem .55rem;border-radius:var(--r-sm);letter-spacing:.03em;white-space:nowrap}
.badge-cbse{background:#FEF3C7;color:#92400E}
.badge-icse{background:var(--teal-light);color:var(--teal-dark)}
.badge-ib{background:var(--indigo-light);color:var(--indigo-dark)}
.badge-igcse{background:#FCE7F3;color:#9D174D}
.badge-state{background:var(--green-light);color:#166534}
.badge-grade{background:var(--surface);color:var(--ink-soft);border:1px solid var(--border)}
.badge-unplugged{background:#F0FDF4;color:#166534}
.badge-plugged{background:#EFF6FF;color:#1E40AF}
.badge-project{background:#FFF7ED;color:#9A3E00}
.badge-board{background:var(--indigo-light);color:var(--indigo)}

/* CT Pill tags */
.ct-pill{display:inline-flex;align-items:center;font-size:.62rem;font-weight:700;padding:.15rem .45rem;border-radius:4px;letter-spacing:.04em}
.ct-d{background:#FEE2E2;color:#991B1B}
.ct-p{background:var(--teal-light);color:var(--teal-dark)}
.ct-a{background:var(--indigo-light);color:var(--indigo-dark)}
.ct-al{background:#FEF3C7;color:#78350F}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1.5rem;border-radius:var(--r-md);font-weight:600;font-size:.9rem;transition:all .18s;border:none;cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--saffron);color:#fff}
.btn-primary:hover{background:var(--saffron-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}
.btn-secondary{background:var(--white);color:var(--ink);border:1.5px solid var(--border)}
.btn-secondary:hover{border-color:var(--saffron);color:var(--saffron)}
.btn-ghost{background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.25)}
.btn-ghost:hover{background:rgba(255,255,255,.22)}
.btn-teal{background:var(--teal);color:#fff}
.btn-teal:hover{background:var(--teal-dark)}
.btn-sm{padding:.45rem 1rem;font-size:.8rem;border-radius:var(--r-sm)}
.btn-icon{padding:.6rem;border-radius:var(--r-sm)}

/* ══════════════════════════════════════════════════════
   TOP ANNOUNCEMENT BAR
══════════════════════════════════════════════════════ */
.announce-bar{
  background:var(--indigo);color:#fff;
  padding:.5rem 1.5rem;text-align:center;
  font-size:.8rem;font-weight:500;
  display:flex;align-items:center;justify-content:center;gap:.75rem;
  position:relative;
}
.announce-bar a{color:#A5B4FC;font-weight:700;text-decoration:underline}
.announce-bar-close{position:absolute;right:1rem;top:50%;transform:translateY(-50%);background:none;border:none;color:rgba(255,255,255,.7);font-size:1.1rem;cursor:pointer;line-height:1}

/* ══════════════════════════════════════════════════════
   NAVIGATION
══════════════════════════════════════════════════════ */
nav{
  position:sticky;top:0;z-index:200;
  background:rgba(249,250,251,.97);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
  padding:0 1.5rem;
  height:64px;
  display:flex;align-items:center;gap:0;
  transition:box-shadow .2s;
}
nav.scrolled{box-shadow:var(--shadow-sm)}
.nav-brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.nav-logo-wrap{
  width:80px;border-radius:10px;
  /*background:linear-gradient(135deg,var(--saffron),#F59E0B);*/
  display:flex;align-items:center;justify-content:center;
/*  font-family:var(--font-display);font-size:1.05rem;font-weight:700;color:#fff;
  box-shadow:0 2px 8px rgba(232,93,4,.35);*/
}
.nav-brand-text{font-family:var(--font-display);font-size:1.3rem;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.nav-brand-text span{color:var(--saffron)}

.nav-links{display:flex;align-items:center;gap:0;margin-left:1.75rem;overflow-x:auto;flex:1}
.nav-links::-webkit-scrollbar{display:none}
.nav-link{
  display:block;padding:.4rem .8rem;
  color:var(--muted);font-size:.845rem;font-weight:500;
  white-space:nowrap;border-radius:var(--r-sm);
  transition:color .15s,background .15s;
}
.nav-link:hover,.nav-link.active{color:var(--ink);background:rgba(0,0,0,.05)}

.nav-right{display:flex;align-items:center;gap:.75rem;margin-left:auto;flex-shrink:0}
.nav-search-btn{
  display:flex;align-items:center;gap:.5rem;
  background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-full);padding:.35rem .9rem;
  font-size:.82rem;color:var(--muted);cursor:pointer;
  transition:border-color .15s;
}
.nav-search-btn:hover{border-color:var(--saffron);color:var(--ink)}
.nav-login{color:var(--ink-soft);font-size:.875rem;font-weight:500;padding:.4rem .75rem;border-radius:var(--r-sm);transition:color .15s}
.nav-login:hover{color:var(--saffron)}
.nav-join{background:var(--saffron);color:#fff;padding:.45rem 1.1rem;border-radius:var(--r-sm);font-size:.85rem;font-weight:600;transition:all .15s}
.nav-join:hover{background:var(--saffron-dark);box-shadow:0 2px 8px rgba(232,93,4,.3)}

.hamburger{display:none;flex-direction:column;gap:4px;cursor:pointer;padding:.4rem;border:none;background:none}
.hamburger span{width:22px;height:2px;background:var(--ink);border-radius:2px;transition:all .2s}

@media(max-width:900px){
  .nav-links{display:none}
  .hamburger{display:flex}
}
@media(max-width:560px){
  .nav-search-btn span{display:none}
  .nav-login{display:none}
}

/* Mobile menu */
.mobile-menu{
  display:none;position:fixed;inset:0;z-index:300;
  background:var(--white);overflow-y:auto;
  padding:1.5rem;
  flex-direction:column;gap:0;
}
.mobile-menu.open{display:flex}
.mobile-menu-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}
.mobile-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--ink)}
.mobile-nav-link{
  display:block;padding:1rem 0;
  font-size:1.1rem;font-weight:500;color:var(--ink);
  border-bottom:1px solid var(--border);
}
.mobile-nav-link:hover{color:var(--saffron)}
.mobile-auth{display:flex;gap:.75rem;margin-top:2rem}
.mobile-auth .btn{flex:1;justify-content:center}

/* ══════════════════════════════════════════════════════
   HERO
══════════════════════════════════════════════════════ */
.hero{
  background:var(--ink);color:#fff;
  padding:5.5rem 1.5rem 4.5rem;
  position:relative;overflow:hidden;
  text-align:center;
}
.hero-bg{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 55% 60% at 15% 40%, rgba(232,93,4,.3) 0%, transparent 55%),
    radial-gradient(ellipse 50% 55% at 85% 25%, rgba(55,48,163,.38) 0%, transparent 55%),
    radial-gradient(ellipse 40% 40% at 55% 85%, rgba(10,123,108,.22) 0%, transparent 55%),
    radial-gradient(ellipse 30% 30% at 70% 60%, rgba(180,83,9,.18) 0%, transparent 50%);
}

.hero-content{position:relative;z-index:1;max-width:860px;margin:0 auto}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:.6rem;
  background:rgba(232,93,4,.2);border:1px solid rgba(232,93,4,.45);
  color:#FBBF24;padding:.32rem 1rem;border-radius:var(--r-full);
  font-size:.73rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  margin-bottom:1.6rem;
}
.hero-eyebrow-dot{width:6px;height:6px;background:#F59E0B;border-radius:50%;animation:pulse-dot 2s ease-in-out infinite}
@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.7)}}

.hero h1{
  font-family:var(--font-display);
  font-size:clamp(2.4rem,5.5vw,4rem);
  line-height:1.1;font-weight:700;
  margin-bottom:1.4rem;
  letter-spacing:-.02em;
}
.hero h1 em{color:#FBBF24;font-style:italic;font-weight:300}
.hero h1 strong{color:var(--saffron-mid)}
.hero-sub{
  font-size:1.1rem;color:rgba(255,255,255,.72);
  max-width:580px;margin:0 auto 2rem;line-height:1.7;
}
.hero-ctas{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:2.5rem}

/* Hero search */
.hero-search{
  display:flex;align-items:center;gap:.5rem;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);
  border-radius:var(--r-full);padding:.5rem .65rem .5rem 1.25rem;
  max-width:480px;margin:0 auto;backdrop-filter:blur(4px);
  transition:border-color .2s,background .2s;
}
.hero-search:focus-within{border-color:rgba(251,191,36,.6);background:rgba(255,255,255,.1)}
.hero-search input{
  flex:1;background:none;border:none;outline:none;
  color:#fff;font-size:.9rem;
}
.hero-search input::placeholder{color:rgba(255,255,255,.4)}
.hero-search button{
  background:var(--saffron);color:#fff;border:none;
  border-radius:var(--r-full);padding:.42rem 1.15rem;
  font-weight:600;font-size:.82rem;transition:background .15s;
}
.hero-search button:hover{background:var(--saffron-dark)}

/* Hero stats */
.hero-stats{
  display:flex;align-items:center;justify-content:center;gap:2.5rem;
  margin-top:3rem;padding-top:2.5rem;
  border-top:1px solid rgba(255,255,255,.1);
  flex-wrap:wrap;
}
.hero-stat{text-align:center}
.hero-stat-num{display:block;font-family:var(--font-display);font-size:2rem;font-weight:700;color:#FBBF24;line-height:1}
.hero-stat-label{font-size:.75rem;color:rgba(255,255,255,.45);margin-top:.2rem}

/* Social proof strip */
.social-proof{
  background:var(--white);border-bottom:1px solid var(--border);
  padding:.875rem 1.5rem;overflow:hidden;
}
.social-proof-inner{
  display:flex;align-items:center;gap:2rem;
  max-width:1120px;margin:0 auto;flex-wrap:wrap;
  justify-content:center;
}
.proof-item{display:flex;align-items:center;gap:.5rem;font-size:.82rem;color:var(--muted);white-space:nowrap}
.proof-item svg{color:var(--saffron);width:15px;height:15px;flex-shrink:0}
.proof-sep{color:var(--border-dark);font-size:.9rem}

/* ══════════════════════════════════════════════════════
   LOGIN WALL OVERLAY (for locked sections)
══════════════════════════════════════════════════════ */
.login-wall{
  position:relative;overflow:hidden;
}
.login-wall-content{
  filter:blur(4px);
  pointer-events:none;
  user-select:none;
  max-height:480px;
  overflow:hidden;
}
.login-wall-overlay{
  position:absolute;inset:0;z-index:10;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(to bottom, transparent 0%, rgba(249,250,251,.7) 30%, rgba(249,250,251,.97) 60%, rgba(249,250,251,1) 100%);
}
.login-wall-box{
  text-align:center;padding:2.5rem 2rem;
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--r-xl);box-shadow:var(--shadow-lg);
  max-width:380px;width:90%;
}
.lock-icon{font-size:2.5rem;margin-bottom:.75rem}
.login-wall-box h3{font-family:var(--font-display);font-size:1.25rem;font-weight:700;margin-bottom:.5rem}
.login-wall-box p{font-size:.875rem;color:var(--muted);margin-bottom:1.25rem;line-height:1.6}
.login-wall-btns{display:flex;gap:.75rem;justify-content:center}

/* ══════════════════════════════════════════════════════
   CT PILLARS — WHAT IS CT
══════════════════════════════════════════════════════ */
.pillars-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:1.5rem;
}
.pillar-card{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-lg);padding:1.75rem 1.5rem;
  position:relative;overflow:hidden;
  transition:transform .2s,box-shadow .2s;
  cursor:default;
}
.pillar-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px}
.pillar-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.pc-decomp::before{background:linear-gradient(90deg,var(--saffron),#F59E0B)}
.pc-pattern::before{background:linear-gradient(90deg,var(--teal),var(--teal-mid))}
.pc-abstraction::before{background:linear-gradient(90deg,var(--indigo),#6366F1)}
.pc-algorithm::before{background:linear-gradient(90deg,var(--gold),#D97706)}
.pillar-icon-wrap{
  width:54px;height:54px;border-radius:var(--r-md);
  display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;margin-bottom:1.1rem;
}
.pc-decomp .pillar-icon-wrap{background:var(--saffron-light)}
.pc-pattern .pillar-icon-wrap{background:var(--teal-light)}
.pc-abstraction .pillar-icon-wrap{background:var(--indigo-light)}
.pc-algorithm .pillar-icon-wrap{background:var(--gold-light)}
.pillar-card h3{font-size:1.05rem;font-weight:700;margin-bottom:.5rem}
.pillar-card>p{font-size:.865rem;color:var(--ink-soft);line-height:1.65;margin-bottom:.9rem}
.pillar-tag{
  display:inline-block;font-size:.65rem;font-weight:700;
  padding:.22rem .55rem;border-radius:5px;letter-spacing:.05em;text-transform:uppercase;
}
.pc-decomp .pillar-tag{background:var(--saffron-light);color:var(--saffron-dark)}
.pc-pattern .pillar-tag{background:var(--teal-light);color:var(--teal-dark)}
.pc-abstraction .pillar-tag{background:var(--indigo-light);color:var(--indigo-dark)}
.pc-algorithm .pillar-tag{background:var(--gold-light);color:var(--gold)}
.pillar-example{
  margin-top:.75rem;padding:.75rem 1rem;border-radius:var(--r-sm);
  font-size:.8rem;color:var(--ink-soft);line-height:1.6;
  border-left:3px solid;
}
.pc-decomp .pillar-example{background:var(--saffron-light);border-color:var(--saffron-mid)}
.pc-pattern .pillar-example{background:var(--teal-light);border-color:var(--teal-mid)}
.pc-abstraction .pillar-example{background:var(--indigo-light);border-color:#818CF8}
.pc-algorithm .pillar-example{background:var(--gold-light);border-color:#D97706}

/* CT Is Not CS banner */
.ct-not-cs{
  margin-top:2.5rem;
  background:linear-gradient(135deg,var(--indigo-light),var(--teal-light));
  border:1px solid var(--border);border-radius:var(--r-xl);padding:2.25rem 2rem;
}
.ct-not-cs h3{font-family:var(--font-display);font-size:1.15rem;font-weight:700;margin-bottom:1.25rem;text-align:center}
.ct-subjects-mini{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1rem;
}

.ct-subject-mini{
    background:var(--white);
    border-radius:var(--r-md);
    padding:1rem;
    font-size:.845rem;
    color:var(--ink-soft);
    line-height:1.55;
}

.ct-subject-mini strong{
    display:block;
    color:var(--ink);
    font-weight:600;
    margin-bottom:.3rem;
    font-size:.875rem;
}

/* ══════════════════════════════════════════════════════
   SUBJECT TABS + LESSON CARDS
══════════════════════════════════════════════════════ */
.tab-strip{
  display:flex;gap:.4rem;flex-wrap:wrap;
  justify-content:center;margin-bottom:2.25rem;
}
.tab-btn{
  padding:.45rem 1rem;border-radius:var(--r-full);
  border:1.5px solid var(--border);background:transparent;
  font-size:.825rem;font-weight:500;color:var(--muted);
  transition:all .15s;cursor:pointer;
}
.tab-btn:hover{border-color:var(--saffron);color:var(--saffron)}
.tab-btn.active{background:var(--saffron);color:#fff;border-color:var(--saffron)}

.subject-pane{display:none}.subject-pane.active{display:block}

.lessons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.25rem}
.lesson-card{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-lg);padding:1.5rem;
  transition:box-shadow .2s,border-color .2s;
  display:flex;flex-direction:column;
}
.lesson-card:hover{box-shadow:var(--shadow-sm);border-color:var(--border-dark)}
.lesson-meta{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.85rem}
.lesson-card h4{font-size:.965rem;font-weight:700;margin-bottom:.4rem;line-height:1.4}
.lesson-card p{font-size:.845rem;color:var(--ink-soft);line-height:1.65;flex:1}
.lesson-footer{margin-top:1rem;display:flex;gap:.3rem;flex-wrap:wrap}

/* ══════════════════════════════════════════════════════
   ACTIVITIES SECTION
══════════════════════════════════════════════════════ */
.activities-filter{
  display:flex;gap:.5rem;flex-wrap:wrap;
  justify-content:center;margin-bottom:2rem;
}
.filter-chip{
  padding:.38rem .85rem;border-radius:var(--r-full);
  border:1.5px solid var(--border);background:transparent;
  font-size:.8rem;font-weight:500;color:var(--muted);
  cursor:pointer;transition:all .15s;
}
.filter-chip:hover{border-color:var(--teal);color:var(--teal)}
.filter-chip.active{background:var(--teal);color:#fff;border-color:var(--teal)}

.activities-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.5rem}
.activity-card{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-lg);overflow:hidden;
  transition:transform .2s,box-shadow .2s;
}
.activity-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.activity-hero{
  padding:1.5rem 1.5rem 1.25rem;
  position:relative;
}
.ac-preschool{background:linear-gradient(135deg,#FFF4EE 0%,#FFE8D4 100%)}
.ac-primary{background:linear-gradient(135deg,#EEF9F8 0%,#D4EDEA 100%)}
.ac-middle{background:linear-gradient(135deg,#F0EEFF 0%,#DDD6F5 100%)}
.ac-high{background:linear-gradient(135deg,#FEFCE8 0%,#F5ECC5 100%)}
.ac-senior{background:linear-gradient(135deg,#FFF1F2 0%,#FECDD3 100%)}
.activity-grade-badge{
  position:absolute;top:1rem;right:1rem;
  font-size:.68rem;font-weight:700;
  padding:.2rem .55rem;border-radius:var(--r-sm);
  background:rgba(255,255,255,.8);color:var(--ink-soft);
  border:1px solid rgba(0,0,0,.1);
}
.activity-emoji{font-size:2.25rem;margin-bottom:.6rem;display:block}
.activity-card h4{font-size:.96rem;font-weight:700;margin-bottom:.2rem;line-height:1.35}
.activity-type-tag{
  font-size:.65rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--muted);margin-bottom:.25rem;
}
.activity-body{padding:1rem 1.5rem 1.5rem}
.activity-body p{font-size:.84rem;color:var(--ink-soft);line-height:1.65}
.activity-meta-row{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.75rem}
.activity-expand{
  display:inline-flex;align-items:center;gap:.35rem;
  margin-top:.75rem;font-size:.78rem;font-weight:700;
  color:var(--saffron);border:none;background:none;
  padding:0;cursor:pointer;transition:gap .15s;
}
.activity-expand:hover{gap:.55rem}
.activity-detail{
  display:none;border-top:1px solid var(--border);
  padding:1.25rem 1.5rem;background:var(--surface);
  font-size:.845rem;
}
.activity-detail.open{display:block}
.activity-detail h5{font-weight:700;margin-bottom:.4rem;font-size:.875rem}
.activity-detail ol,.activity-detail ul{padding-left:1.2rem;color:var(--ink-soft);line-height:1.75}
.activity-detail li{margin-bottom:.25rem}
.activity-note{
  margin-top:.9rem;background:var(--gold-light);
  border-left:3px solid #D97706;
  padding:.6rem .85rem;border-radius:0 var(--r-sm) var(--r-sm) 0;
  font-size:.79rem;color:var(--ink-soft);
}

/* ══════════════════════════════════════════════════════
   GRADE BANDS
══════════════════════════════════════════════════════ */
.grade-bands-wrap{
  display:grid;grid-template-columns:repeat(5,1fr);
  border:1.5px solid var(--border);border-radius:var(--r-xl);overflow:hidden;
}
@media(max-width:640px){.grade-bands-wrap{grid-template-columns:1fr 1fr}}
.grade-band{
  padding:1.75rem 1rem;text-align:center;
  border-right:1px solid var(--border);
  cursor:pointer;transition:background .2s;
}
.grade-band:last-child{border-right:none}
.grade-band:hover{background:var(--saffron-light)}
.gb1{background:#FFF8F5}
.gb2{background:#F5FFFE}
.gb3{background:#F5F4FF}
.gb4{background:#FEFCE8}
.gb5{background:#FFF0F2}
.grade-emoji{font-size:1.9rem;margin-bottom:.6rem;display:block}
.grade-label{font-size:.9rem;font-weight:700;margin-bottom:.25rem;color:var(--ink)}
.grade-sub{font-size:.72rem;color:var(--muted)}

/* ══════════════════════════════════════════════════════
   BOARD COMPATIBILITY
══════════════════════════════════════════════════════ */
.boards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.25rem;margin-bottom:2.5rem}
.board-card{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-lg);padding:1.5rem;
  text-align:center;transition:box-shadow .2s,transform .2s;
}
.board-card:hover{box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.board-name{
  font-family:var(--font-display);font-size:1.6rem;font-weight:700;
  line-height:1;margin-bottom:.3rem;
}
.board-name.cbse{color:var(--saffron)}
.board-name.icse{color:var(--teal)}
.board-name.igcse{color:var(--indigo)}
.board-name.ib{color:var(--gold)}
.board-name.state{color:var(--green)}
.board-card p{font-size:.8rem;color:var(--muted);line-height:1.55;margin-top:.3rem}
.board-card .badge{margin-top:.75rem}

/* ══════════════════════════════════════════════════════
   FRAMEWORK / LESSON PLANNING
══════════════════════════════════════════════════════ */
.framework-wrap{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}
@media(max-width:700px){.framework-wrap{grid-template-columns:1fr}}
.framework-steps{}
.framework-step{display:flex;gap:1rem;margin-bottom:1.75rem}
.step-circle{
  width:38px;height:38px;flex-shrink:0;border-radius:50%;
  background:var(--saffron);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.875rem;
}
.step-content h4{font-size:.95rem;font-weight:700;margin-bottom:.3rem}
.step-content p{font-size:.845rem;color:var(--ink-soft);line-height:1.6}
.framework-visual{
  background:linear-gradient(145deg,var(--indigo-light),var(--teal-light));
  border-radius:var(--r-xl);padding:2rem;
  border:1px solid var(--border);
}

.framework-wrap1{display:grid;grid-template-columns:1fr;gap:2.5rem;align-items:start}
.framework-visual1{
  background:linear-gradient(145deg,var(--indigo-light),var(--teal-light));
  border-radius:var(--r-xl);padding:2rem;
  border:1px solid var(--border);
}


.fv-title{font-family:var(--font-display);font-size:1.05rem;font-weight:700;margin-bottom:1.25rem;text-align:center}
.fv-cycle{
  display:grid;grid-template-columns:1fr 1fr;
  gap:1rem;
}
.fv-step{
  background:var(--white);border-radius:var(--r-md);
  padding:1rem;text-align:center;border:1px solid var(--border);
}
.fv-num{
  width:28px;height:28px;border-radius:50%;
  margin:0 auto .5rem;
  display:flex;align-items:center;justify-content:center;
  font-size:.75rem;font-weight:700;color:#fff;
}
.fv-step h5{font-size:.82rem;font-weight:700;margin-bottom:.2rem}
.fv-step p{font-size:.75rem;color:var(--muted)}

/* ══════════════════════════════════════════════════════
   GLOSSARY
══════════════════════════════════════════════════════ */
.glossary-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.1rem}
.glossary-item{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-md);padding:1.25rem;
  transition:border-color .15s;
}
.glossary-item:hover{border-color:var(--saffron)}
.g-term{
  font-family:var(--font-mono);font-size:.88rem;font-weight:500;
  color:var(--saffron);margin-bottom:.4rem;
}
.g-def{font-size:.845rem;color:var(--ink-soft);line-height:1.65}
.g-example{
  margin-top:.6rem;font-size:.78rem;
  color:var(--teal-dark);font-style:italic;
  padding:.4rem .65rem;background:var(--teal-light);
  border-radius:var(--r-sm);line-height:1.5;
}

/* ══════════════════════════════════════════════════════
   COMMUNITY / SOCIAL FEED
══════════════════════════════════════════════════════ */
.community-wrap{
  display:grid;
  grid-template-columns:1fr 320px;
  gap:1.75rem;align-items:start;
}
@media(max-width:800px){.community-wrap{grid-template-columns:1fr}}

/* Compose box */
.compose-card{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-lg);padding:1.25rem;margin-bottom:1.25rem;
}
.compose-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.85rem}
.compose-textarea{
  width:100%;border:1.5px solid var(--border);border-radius:var(--r-md);
  padding:.75rem;font-family:var(--font-body);font-size:.875rem;
  color:var(--ink);resize:vertical;min-height:90px;outline:none;
  transition:border-color .15s;
}
.compose-textarea:focus{border-color:var(--saffron)}
.compose-actions{display:flex;align-items:center;justify-content:space-between;margin-top:.75rem;flex-wrap:wrap;gap:.5rem}
.compose-tools{display:flex;gap:.4rem}
.compose-tool{
  width:32px;height:32px;border-radius:var(--r-sm);
  display:flex;align-items:center;justify-content:center;
  border:1.5px solid var(--border);background:transparent;
  color:var(--muted);font-size:.875rem;cursor:pointer;transition:all .15s;
}
.compose-tool:hover{border-color:var(--saffron);color:var(--saffron)}

/* Feed posts */
.feed-post{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-lg);padding:1.4rem;margin-bottom:1.1rem;
  transition:box-shadow .2s;
}
.feed-post:hover{box-shadow:var(--shadow-sm)}
.post-header{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:1rem}
.avatar{
  width:42px;height:42px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.88rem;letter-spacing:0;
}
.av1{background:#FEE2E2;color:#991B1B}
.av2{background:var(--teal-light);color:var(--teal-dark)}
.av3{background:var(--indigo-light);color:var(--indigo-dark)}
.av4{background:#FEF3C7;color:#78350F}
.av5{background:var(--green-light);color:#166534}
.av6{background:#FCE7F3;color:#9D174D}
.post-author{flex:1}
.post-author-name{font-size:.9rem;font-weight:700;line-height:1.2}
.post-author-meta{font-size:.76rem;color:var(--muted);margin-top:.05rem}
.post-tag{
  margin-left:auto;font-size:.68rem;font-weight:700;
  padding:.2rem .55rem;border-radius:var(--r-sm);
  background:var(--saffron-light);color:var(--saffron-dark);flex-shrink:0;
}
.post-board-tag{background:var(--indigo-light);color:var(--indigo-dark)}

.feed-post h4{font-size:.96rem;font-weight:700;margin-bottom:.45rem;line-height:1.4}
.feed-post p{font-size:.862rem;color:var(--ink-soft);line-height:1.65}

/* Media card in post */
.post-media{
  margin-top:1rem;border-radius:var(--r-md);overflow:hidden;
  border:1px solid var(--border);
}
.post-media-placeholder{
  background:linear-gradient(135deg,var(--indigo-light),var(--teal-light));
  height:180px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:.5rem;
  color:var(--muted);font-size:.82rem;
}
.post-media-placeholder .icon{font-size:2rem}

/* Post footer */
.post-footer{
  display:flex;align-items:center;gap:1.25rem;
  margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border);
  flex-wrap:wrap;
}
.post-action{
  display:flex;align-items:center;gap:.4rem;
  font-size:.8rem;color:var(--muted);cursor:pointer;
  transition:color .15s;padding:.25rem .4rem;border-radius:var(--r-sm);
  background:none;border:none;
}
.post-action:hover,.post-action.liked{color:var(--saffron)}
.post-action.liked{font-weight:600}
.post-action svg{width:15px;height:15px;flex-shrink:0}

.post-time{margin-left:auto;font-size:.75rem;color:var(--muted)}

/* Tags in post */
.post-tags-row{display:flex;gap:.3rem;flex-wrap:wrap;margin-top:.6rem}
.post-hashtag{font-size:.76rem;font-weight:600;color:var(--teal);background:var(--teal-light);padding:.15rem .45rem;border-radius:5px}

/* Sidebar */
.sidebar-card{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-lg);padding:1.4rem;margin-bottom:1.1rem;
}
.sidebar-card h4{font-size:.92rem;font-weight:700;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}
.sidebar-card h4 span{font-size:.8rem;color:var(--muted);font-weight:400}

/* Trending */
.trending-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:.55rem 0;border-bottom:1px solid var(--border);
  font-size:.845rem;
}
.trending-row:last-child{border-bottom:none;padding-bottom:0}
.trending-topic{color:var(--ink);font-weight:500;cursor:pointer}
.trending-topic:hover{color:var(--saffron)}
.trending-count{font-size:.75rem;color:var(--muted);flex-shrink:0}

/* Teacher profile suggestions */
.teacher-row{
  display:flex;align-items:center;gap:.65rem;
  padding:.55rem 0;border-bottom:1px solid var(--border);
}
.teacher-row:last-child{border-bottom:none;padding-bottom:0}
.teacher-info{flex:1;min-width:0}
.teacher-info h6{font-size:.862rem;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.teacher-info span{font-size:.75rem;color:var(--muted)}
.follow-btn{
  padding:.28rem .7rem;border-radius:var(--r-sm);
  border:1.5px solid var(--saffron);color:var(--saffron);
  background:none;font-size:.72rem;font-weight:700;
  cursor:pointer;transition:all .15s;flex-shrink:0;
}
.follow-btn:hover{background:var(--saffron);color:#fff}
.follow-btn.following{background:var(--saffron);color:#fff}

/* Community Stats bar */
.community-stats{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:var(--border);
  border:1px solid var(--border);border-radius:var(--r-lg);
  overflow:hidden;margin-bottom:2rem;
}
.c-stat{
  background:var(--white);padding:1.25rem 1rem;
  text-align:center;
}
.c-stat-num{display:block;font-family:var(--font-display);font-size:1.6rem;font-weight:700;color:var(--saffron);line-height:1}
.c-stat-label{font-size:.75rem;color:var(--muted);margin-top:.25rem}
@media(max-width:500px){.community-stats{grid-template-columns:1fr 1fr}}

/* ══════════════════════════════════════════════════════
   RESOURCES / DOWNLOADS
══════════════════════════════════════════════════════ */
.resources-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.25rem}
.resource-card{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-lg);padding:1.5rem;
  display:flex;flex-direction:column;
  transition:box-shadow .2s,border-color .2s;
}
.resource-card:hover{box-shadow:var(--shadow-sm);border-color:var(--teal)}
.resource-icon{
  width:48px;height:48px;border-radius:var(--r-md);
  display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;margin-bottom:1rem;
}
.ri-pdf{background:#FEE2E2}
.ri-doc{background:var(--indigo-light)}
.ri-video{background:#FEF3C7}
.ri-template{background:var(--teal-light)}
.resource-card h4{font-size:.93rem;font-weight:700;margin-bottom:.4rem;line-height:1.35}
.resource-card p{font-size:.835rem;color:var(--ink-soft);line-height:1.6;flex:1}
.resource-footer{margin-top:1rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem}
.resource-meta{font-size:.75rem;color:var(--muted)}
.resource-dl{
  display:inline-flex;align-items:center;gap:.35rem;
  font-size:.78rem;font-weight:700;color:var(--teal);
  border:1.5px solid var(--teal-light);padding:.3rem .7rem;
  border-radius:var(--r-sm);transition:all .15s;
  background:none;cursor:pointer;
}
.resource-dl:hover{background:var(--teal);color:#fff;border-color:var(--teal)}

/* ══════════════════════════════════════════════════════
   MODAL
══════════════════════════════════════════════════════ */
.modal-overlay{
  position:fixed;inset:0;z-index:500;
  background:rgba(17,24,39,.65);backdrop-filter:blur(4px);
  display:none;align-items:center;justify-content:center;padding:1.5rem;
}
.modal-overlay.open{display:flex}
.modal-box{
  background:var(--white);border-radius:var(--r-xl);
  padding:2.25rem 2rem;max-width:620px;width:100%;
  max-height:88vh;overflow-y:auto;position:relative;
  box-shadow:var(--shadow-lg);
}
.modal-close{
  position:absolute;top:1rem;right:1rem;
  background:var(--surface);border:1px solid var(--border);
  width:32px;height:32px;border-radius:50%;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  font-size:1rem;color:var(--muted);transition:all .15s;
}
.modal-close:hover{background:var(--border-dark);color:var(--ink)}

/* Auth modal */
.auth-modal{max-width:420px}
.auth-tabs{display:flex;border-bottom:1px solid var(--border);margin-bottom:1.75rem}
.auth-tab{
  flex:1;padding:.75rem;text-align:center;font-size:.9rem;
  font-weight:600;color:var(--muted);cursor:pointer;border:none;background:none;
  border-bottom:2.5px solid transparent;transition:all .15s;
}
.auth-tab.active{color:var(--saffron);border-bottom-color:var(--saffron)}
.auth-pane{display:none}.auth-pane.active{display:block}
.form-group{margin-bottom:1.1rem}
.form-label{display:block;font-size:.82rem;font-weight:600;color:var(--ink-soft);margin-bottom:.35rem}
.form-input{
  width:100%;border:1.5px solid var(--border);border-radius:var(--r-sm);
  padding:.65rem .85rem;font-size:.9rem;color:var(--ink);outline:none;
  transition:border-color .15s;
}
.form-input:focus{border-color:var(--saffron)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.auth-submit{width:100%;margin-top:.25rem}
.auth-divider{
  text-align:center;font-size:.78rem;color:var(--muted);
  margin:1rem 0;position:relative;
}
.auth-divider::before,.auth-divider::after{
  content:'';position:absolute;top:50%;
  width:42%;height:1px;background:var(--border);
}
.auth-divider::before{left:0}.auth-divider::after{right:0}
.social-login{display:flex;gap:.75rem}
.social-login-btn{
  flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.6rem;border:1.5px solid var(--border);border-radius:var(--r-sm);
  font-size:.83rem;font-weight:500;color:var(--ink-soft);background:var(--white);
  cursor:pointer;transition:border-color .15s;
}
.social-login-btn:hover{border-color:var(--border-dark)}

/* ══════════════════════════════════════════════════════
   NEWSLETTER / CTA BANNER
══════════════════════════════════════════════════════ */
.cta-banner{
  background:var(--ink);color:#fff;
  padding:4rem 1.5rem;text-align:center;
  position:relative;overflow:hidden;
}
.cta-banner::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 70% 70% at 50% 50%, rgba(232,93,4,.2) 0%, transparent 70%);
}
.cta-banner h2{
  font-family:var(--font-display);
  font-size:clamp(1.7rem,3.5vw,2.4rem);font-weight:700;
  margin-bottom:.75rem;position:relative;
}
.cta-banner p{color:rgba(255,255,255,.65);font-size:1rem;max-width:460px;margin:0 auto 2rem;position:relative}
.cta-form{
  display:flex;gap:.6rem;max-width:420px;margin:0 auto;
  position:relative;flex-wrap:wrap;justify-content:center;
}
.cta-form input{
  flex:1;min-width:200px;border:1.5px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.07);border-radius:var(--r-sm);
  padding:.65rem 1rem;font-size:.9rem;color:#fff;outline:none;
}
.cta-form input::placeholder{color:rgba(255,255,255,.35)}
.cta-form input:focus{border-color:rgba(251,191,36,.6)}

/* ══════════════════════════════════════════════════════
   APP DOWNLOAD SECTION
══════════════════════════════════════════════════════ */
.app-section{
  padding:4rem 1.5rem;
  background:linear-gradient(135deg,var(--indigo-light),var(--teal-light));
}
.app-content{
  display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;
  max-width:1000px;margin:0 auto;
}
@media(max-width:700px){.app-content{grid-template-columns:1fr;text-align:center}}
.app-text h2{font-family:var(--font-display);font-size:clamp(1.6rem,3vw,2.2rem);font-weight:700;margin-bottom:.75rem}
.app-text p{color:var(--ink-soft);font-size:.95rem;margin-bottom:1.5rem;line-height:1.65}
.app-badges{display:flex;gap:.75rem;flex-wrap:wrap}
@media(max-width:700px){.app-badges{justify-content:center}}
.app-badge-btn{
  display:flex;align-items:center;gap:.65rem;
  background:var(--ink);color:#fff;
  border-radius:var(--r-md);padding:.7rem 1.25rem;
  font-size:.835rem;transition:transform .15s,box-shadow .15s;
  border:none;cursor:pointer;
}
.app-badge-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.app-badge-btn .store-icon{font-size:1.4rem;line-height:1}
.app-badge-btn .store-text{}
.app-badge-btn .store-text small{display:block;font-size:.62rem;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.05em}
.app-badge-btn .store-text strong{display:block;font-size:.9rem;font-weight:700}
.app-mockup{
  background:var(--white);border-radius:var(--r-xl);
  padding:1.75rem;box-shadow:var(--shadow-lg);
  border:1px solid var(--border);
}
.app-mockup-bar{
  display:flex;gap:.4rem;margin-bottom:1rem;
}
.app-mockup-dot{width:10px;height:10px;border-radius:50%}
.app-mockup-screen{
  background:var(--surface);border-radius:var(--r-md);
  padding:1rem;min-height:200px;
  display:flex;flex-direction:column;gap:.75rem;
}
.mock-nav{
  background:var(--white);border-radius:var(--r-sm);
  padding:.6rem .9rem;display:flex;align-items:center;justify-content:space-between;
  border:1px solid var(--border);
}
.mock-nav-brand{font-family:var(--font-display);font-size:.85rem;font-weight:700;color:var(--saffron)}
.mock-post{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--r-sm);padding:.75rem;
}
.mock-post-head{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem}
.mock-avatar{width:22px;height:22px;border-radius:50%;background:var(--saffron-light);flex-shrink:0}
.mock-name{font-size:.7rem;font-weight:600;color:var(--ink)}
.mock-body{font-size:.68rem;color:var(--muted);line-height:1.5}
.mock-actions{display:flex;gap:.75rem;margin-top:.4rem}
.mock-action{font-size:.62rem;color:var(--muted)}

/* ══════════════════════════════════════════════════════
   FOOTER
══════════════════════════════════════════════════════ */
footer{background:var(--ink);color:rgba(255,255,255,.65);padding:4rem 1.5rem 2rem}
.footer-grid{
  display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;
  gap:2rem;max-width:1120px;margin:0 auto 3rem;
}
@media(max-width:900px){.footer-grid{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:560px){.footer-grid{grid-template-columns:1fr 1fr}}
.footer-brand{}
.footer-logo{display:flex;align-items:center;gap:.65rem;margin-bottom:.75rem}
.footer-logo-icon{
  width:34px;height:34px;border-radius:8px;
  background:linear-gradient(135deg,var(--saffron),#F59E0B);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-size:.95rem;font-weight:700;color:#fff;
}
.footer-logo-text{font-family:var(--font-display);font-size:1.15rem;font-weight:700;color:#fff}
.footer-brand p{font-size:.82rem;line-height:1.65;color:rgba(255,255,255,.5)}
.footer-social{display:flex;gap:.6rem;margin-top:1rem}
.footer-social a{
  width:32px;height:32px;border-radius:var(--r-sm);
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:center;
  font-size:.875rem;color:rgba(255,255,255,.55);transition:all .15s;
}
.footer-social a:hover{background:var(--saffron);border-color:var(--saffron);color:#fff}
.footer-col h5{color:#fff;font-size:.845rem;font-weight:700;margin-bottom:.85rem;letter-spacing:.02em}
.footer-col a{
  display:block;color:rgba(255,255,255,.5);font-size:.8rem;
  margin-bottom:.42rem;transition:color .15s;
}
.footer-col a:hover{color:#FBBF24}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);padding-top:1.75rem;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:.75rem;max-width:1120px;margin:0 auto;
}
.footer-bottom p{font-size:.78rem}
.footer-bottom-links{display:flex;gap:1.25rem}
.footer-bottom-links a{font-size:.78rem;color:rgba(255,255,255,.4);transition:color .15s}
.footer-bottom-links a:hover{color:#FBBF24}

/* ══════════════════════════════════════════════════════
   TOAST
══════════════════════════════════════════════════════ */
.toast{
  position:fixed;bottom:2rem;right:1.5rem;z-index:600;
  background:var(--ink);color:#fff;
  padding:.85rem 1.25rem;border-radius:var(--r-md);
  font-size:.875rem;box-shadow:var(--shadow-lg);
  transform:translateY(120%);opacity:0;
  transition:transform .28s cubic-bezier(.34,1.56,.64,1), opacity .28s;
  pointer-events:none;max-width:300px;
}
.toast.show{transform:translateY(0);opacity:1}

/* ══════════════════════════════════════════════════════
   RESPONSIVE HELPERS
══════════════════════════════════════════════════════ */
@media(max-width:768px){
  .section{padding:3.5rem 0}
  .hero{padding:4rem 1.5rem 3.5rem}
  .hero-stats{gap:1.5rem}
  .hero-stat-num{font-size:1.6rem}
  .grade-bands-wrap{grid-template-columns:1fr 1fr}
  .grade-band{border-right:1px solid var(--border);border-bottom:1px solid var(--border)}
  .community-wrap{grid-template-columns:1fr}
}
@media(max-width:480px){
  .hero h1{font-size:2rem}
  .form-row{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
}

/* Animations */
@keyframes fade-up{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:translateY(0)}
}
.fade-up{animation:fade-up .5s ease both}
.fade-up-d1{animation-delay:.1s}
.fade-up-d2{animation-delay:.2s}
.fade-up-d3{animation-delay:.3s}
.fade-up-d4{animation-delay:.4s}
/* ══════════════════════════════════════════════════════
   ENQUIRY SECTION
══════════════════════════════════════════════════════ */
.enquiry-wrap{
  display:grid;grid-template-columns:1fr 1.6fr;gap:2.5rem;align-items:start;
}
@media(max-width:820px){.enquiry-wrap{grid-template-columns:1fr}}

.enquiry-info{display:flex;flex-direction:column;gap:1rem}
.eq-info-card{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-lg);padding:1.4rem 1.25rem;
  display:flex;gap:1rem;align-items:flex-start;
  transition:box-shadow .2s,transform .2s;
}
.eq-info-card:hover{box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.eq-info-icon{font-size:1.5rem;flex-shrink:0;width:42px;height:42px;background:var(--saffron-light);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center}
.eq-info-card h4{font-size:.93rem;font-weight:700;margin-bottom:.3rem}
.eq-info-card p{font-size:.82rem;color:var(--muted);line-height:1.6}

.eq-contact-strip{
  background:linear-gradient(135deg,var(--indigo),var(--indigo-dark));
  border-radius:var(--r-lg);padding:1.35rem 1.4rem;
  display:flex;flex-direction:column;gap:.7rem;
}
.eq-contact-item{display:flex;align-items:center;gap:.65rem;color:#fff;font-size:.85rem}
.eq-contact-icon{font-size:1rem;width:28px;text-align:center}

.enquiry-form-box{
  background:var(--white);border:1.5px solid var(--border);
  border-radius:var(--r-xl);padding:2rem;
  box-shadow:var(--shadow-sm);
}
.form-textarea{resize:vertical;min-height:110px;line-height:1.65}
.enquiry-alert{
  padding:.7rem 1rem;border-radius:var(--r-sm);margin-bottom:1rem;
  font-size:.83rem;font-weight:600;
}
.enquiry-alert.error{background:var(--rose-light);color:var(--rose);border:1px solid #FECDD3}
.enquiry-alert.success{background:var(--green-light);color:var(--green);border:1px solid #BBF7D0}