@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&family=Roboto:wght@300;400;500;700;900&family=Playfair+Display:wght@700;800;900&family=Vazirmatn:wght@300;400;500;600;700;900&display=swap');

/* ── Variables ── */
:root {
  --primary:       #7B1F4A;
  --primary-dark:  #4D1230;
  --primary-light: #9E2B61;
  --primary-ultra: #2A0819;
  --accent:        #C8A44A;
  --accent-light:  #E2C87A;
  --accent-dark:   #9E7D2A;

  --bg:            #FDFAF7;
  --bg-secondary:  #F5EFF2;
  --bg-card:       #FFFFFF;
  --bg-nav:        rgba(253,250,247,0.97);
  --text-primary:  #180810;
  --text-secondary:#5A3048;
  --text-muted:    #997080;
  --border:        #EAD8E0;
  --border-light:  #F3E8EE;

  --shadow-sm:  0 2px 8px rgba(123,31,74,.08);
  --shadow-md:  0 4px 20px rgba(123,31,74,.13);
  --shadow-lg:  0 10px 44px rgba(123,31,74,.18);

  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --transition: 0.3s cubic-bezier(0.4,0,0.2,1);

  --font-en:      'Montserrat', 'Roboto', sans-serif;
  --font-dari:    'Vazirmatn', 'Calibri', 'Tahoma', sans-serif;
  --font-display: 'Playfair Display', Georgia, serif;
  --nav-height:   74px;
}

[data-theme="dark"] {
  --bg:            #10040C;
  --bg-secondary:  #1A0A14;
  --bg-card:       #220D1A;
  --bg-nav:        rgba(16,4,12,0.98);
  --text-primary:  #F2E6EC;
  --text-secondary:#C0909A;
  --text-muted:    #7A5060;
  --border:        #3C1428;
  --border-light:  #2C0E1E;
  --shadow-sm:  0 2px 10px rgba(0,0,0,.4);
  --shadow-md:  0 4px 24px rgba(0,0,0,.5);
  --shadow-lg:  0 10px 48px rgba(0,0,0,.6);
}

/* ── Reset ── */
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family: var(--font-en);
  background: var(--bg);
  color: var(--text-primary);
  line-height: 1.65;
  overflow-x: hidden;
  transition: background var(--transition), color var(--transition);
}
/* Dari font — applied to text elements only, NOT icons or SVGs */
[data-lang="dari"] body { font-family: var(--font-dari) !important; }
[data-lang="dari"] p,
[data-lang="dari"] h1,[data-lang="dari"] h2,[data-lang="dari"] h3,
[data-lang="dari"] h4,[data-lang="dari"] h5,[data-lang="dari"] h6,
[data-lang="dari"] span:not(.fa):not(.fab):not(.fas):not(.far),
[data-lang="dari"] div,
[data-lang="dari"] a,
[data-lang="dari"] button,
[data-lang="dari"] label,
[data-lang="dari"] input,
[data-lang="dari"] textarea,
[data-lang="dari"] li,
[data-lang="dari"] td,[data-lang="dari"] th {
  font-family: var(--font-dari) !important;
}
/* NEVER override Font Awesome icon elements */
[data-lang="dari"] i,
[data-lang="dari"] i.fas,
[data-lang="dari"] i.fab,
[data-lang="dari"] i.far,
[data-lang="dari"] i.fal,
[data-lang="dari"] svg,
[data-lang="dari"] svg * {
  font-family: "Font Awesome 6 Free", "Font Awesome 6 Brands" !important;
}
img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }
input, textarea { font-family:inherit; }

/* ── Layout ── */
.container { max-width:1200px; margin:0 auto; padding:0 24px; }

/* ── Section Header ── */
.section-header { text-align:center; margin-bottom:60px; }
.section-tag {
  display:inline-block; font-size:.72rem; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--accent-dark); margin-bottom:12px;
  padding:5px 16px; background:rgba(200,164,74,.11);
  border-radius:100px; border:1px solid rgba(200,164,74,.28);
}
[data-theme="dark"] .section-tag { color:var(--accent-light); }
.section-title {
  font-family:var(--font-display); font-size:clamp(1.8rem,3.5vw,2.8rem);
  font-weight:800; color:var(--text-primary); line-height:1.18; margin-bottom:14px;
}
[data-lang="dari"] .section-title { font-family:var(--font-dari)!important; font-weight:700; }
.section-subtitle { font-size:1rem; color:var(--text-secondary); max-width:580px; margin:0 auto; line-height:1.78; }
.section-divider {
  width:52px; height:3px; border-radius:2px; margin:14px auto 0;
  background:linear-gradient(90deg, var(--primary), var(--accent));
}
[dir="rtl"] .section-divider { background:linear-gradient(270deg, var(--primary), var(--accent)); }

/* ── Buttons ── */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 28px; border-radius:var(--radius-md);
  font-size:.88rem; font-weight:700; letter-spacing:.03em;
  transition:all var(--transition); cursor:pointer;
  border:2px solid transparent; white-space:nowrap;
}
.btn-primary { background:var(--accent); color:var(--primary-dark); }
.btn-primary:hover { background:var(--accent-light); transform:translateY(-2px); box-shadow:0 8px 24px rgba(200,164,74,.4); }
.btn-outline { border-color:rgba(255,255,255,.65); color:#fff; }
.btn-outline:hover { background:rgba(255,255,255,.13); transform:translateY(-2px); }
.btn-dark { background:var(--primary); color:#fff; }
.btn-dark:hover { background:var(--primary-light); transform:translateY(-2px); box-shadow:var(--shadow-md); }

/* ── Pages ── */
.page { display:none; animation:pgIn .45s ease; }
.page.active { display:block; }
@keyframes pgIn { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }

/* ── Scroll Reveal ── */
.reveal      { opacity:0; transform:translateY(36px); transition:opacity .7s ease, transform .7s ease; }
.reveal-left { opacity:0; transform:translateX(-36px); transition:opacity .7s ease, transform .7s ease; }
.reveal-right{ opacity:0; transform:translateX(36px);  transition:opacity .7s ease, transform .7s ease; }
.reveal.visible,.reveal-left.visible,.reveal-right.visible { opacity:1; transform:none; }
.reveal:nth-child(2){transition-delay:.1s}
.reveal:nth-child(3){transition-delay:.2s}
.reveal:nth-child(4){transition-delay:.3s}
.reveal:nth-child(5){transition-delay:.4s}
.reveal:nth-child(6){transition-delay:.5s}

/* ================================================================
   SPLASH — simple: name + bar + LOADING text
================================================================ */
#splash {
  position:fixed; inset:0; z-index:9999;
  background:#12060C;
  display:flex; align-items:center; justify-content:center;
}
#splash.fade-out { animation:splashOut .6s ease forwards; }
@keyframes splashOut { to{opacity:0;pointer-events:none} }

.splash-content {
  display:flex; flex-direction:column; align-items:center;
  text-align:center; padding:0 32px;
}

/* School name */
.splash-school-name {
  font-family:'Montserrat', sans-serif;
  font-size:clamp(1.6rem,4vw,2.8rem);
  font-weight:800;
  color:#ffffff;
  letter-spacing:.01em;
  line-height:1.2;
  opacity:0;
  animation:spIn .55s cubic-bezier(.4,0,.2,1) .1s forwards;
}
@keyframes spIn { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }

/* Loading bar track */
.splash-bar-track {
  width:min(300px, 60vw);
  height:3px;
  background:rgba(255,255,255,.08);
  border-radius:10px;
  overflow:hidden;
  margin-top:28px;
}
/* animated fill — gold gradient, mimicking the reference */
.splash-bar-fill {
  height:100%;
  width:0%;
  border-radius:10px;
  background:linear-gradient(90deg, #9E7D2A, #C8A44A, #E2C87A);
  box-shadow:0 0 10px rgba(200,164,74,.5);
}

/* LOADING... label */
.splash-loading-text {
  font-family:'Montserrat', sans-serif;
  font-size:.7rem;
  font-weight:600;
  letter-spacing:.28em;
  color:rgba(200,164,74,.55);
  margin-top:18px;
  opacity:0;
  animation:spIn .4s ease .5s forwards;
}

/* ================================================================
   NAVIGATION
================================================================ */
#navbar {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  height:var(--nav-height);
  background:var(--bg-nav);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border-light);
  box-shadow:var(--shadow-sm);
  transition:all var(--transition);
  overflow:visible;
}
.nav-inner { display:flex; align-items:center; justify-content:space-between; height:100%; gap:8px; }

/* Logo */
.nav-logo { display:flex; align-items:center; gap:11px; flex-shrink:0; cursor:pointer; }
.nav-logo-img {
  width:52px; height:52px; object-fit:contain; flex-shrink:0;
  margin-top: 6px;
  /* Removes the white JPEG background in light theme */
  mix-blend-mode: multiply;
  transition: filter var(--transition);
}
/* In dark mode wrap logo in a tiny white pill so crest remains visible */
[data-theme="dark"] .nav-logo-img {
  mix-blend-mode: normal;
  background: rgba(255,255,255,0.92);
  border-radius: 8px;
  padding: 3px;
  box-shadow: 0 1px 6px rgba(0,0,0,.35);
}
.nav-logo-text { display:flex; flex-direction:column; line-height:1.2; }
.nav-logo-name { font-family:var(--font-display); font-size:1rem; font-weight:800; color:var(--primary); white-space:nowrap; letter-spacing:.01em; }
[data-theme="dark"] .nav-logo-name { color:var(--accent-light); }
.nav-logo-sub { font-size:.62rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); }

/* Desktop nav links */
.nav-links { display:flex; align-items:center; }
.nav-link {
  padding:8px 9px; font-size:.78rem; font-weight:600; color:var(--text-secondary);
  border-radius:var(--radius-sm); transition:all var(--transition);
  white-space:nowrap; cursor:pointer; background:none; border:none; font-family:inherit;
}
.nav-link:hover,.nav-link.active { color:var(--primary); background:rgba(123,31,74,.07); }
[data-theme="dark"] .nav-link:hover,
[data-theme="dark"] .nav-link.active { color:var(--accent-light); background:rgba(200,164,74,.1); }

/* Controls row */
.nav-controls { display:flex; align-items:center; gap:6px; flex-shrink:0; min-width:0; }

/* ── Language Dropdown ── */
.lang-dropdown { position:relative; }
.lang-trigger {
  display:flex; align-items:center; gap:7px;
  padding:7px 12px 7px 10px;
  background:var(--bg-secondary); border:1.5px solid var(--border);
  border-radius:var(--radius-md); cursor:pointer;
  font-size:.8rem; font-weight:700; color:var(--text-primary);
  transition:all var(--transition); font-family:inherit;
}
.lang-trigger:hover { border-color:var(--primary); box-shadow:var(--shadow-sm); }
[data-theme="dark"] .lang-trigger:hover { border-color:var(--accent); }
.lang-trigger .flag  { font-size:1.15rem; line-height:1; flex-shrink:0; }
.lang-trigger .lname { font-size:.78rem; font-weight:700; }
.lang-trigger .chev  { font-size:.6rem; color:var(--text-muted); transition:transform var(--transition); margin-left:2px; }
.lang-dropdown.open .chev { transform:rotate(180deg); }
@media(max-width:820px) { .lang-trigger .lname { display:none; } }

.lang-menu {
  display:none;
  position:fixed;
  top:0;
  min-width:160px;
  background:var(--bg-card);
  border:1.5px solid var(--border);
  border-radius:var(--radius-md);
  box-shadow:0 8px 32px rgba(0,0,0,.22);
  overflow:visible;
  z-index:9998;
  animation:dropIn .2s ease;
}
[dir="rtl"] .lang-menu { left:auto; }
@keyframes dropIn { from{opacity:0;transform:translateY(-6px)} to{opacity:1;transform:translateY(0)} }
.lang-dropdown.open .lang-menu { display:block; }

.lang-opt {
  display:flex; align-items:center; gap:10px;
  padding:11px 16px; cursor:pointer; width:100%;
  font-size:.84rem; font-weight:600; color:var(--text-secondary);
  transition:all var(--transition); border:none; background:none; font-family:inherit;
  text-align:left;
}
[dir="rtl"] .lang-opt { text-align:right; flex-direction:row-reverse; }
.lang-opt:hover { background:var(--bg-secondary); color:var(--primary); }
[data-theme="dark"] .lang-opt:hover { color:var(--accent-light); }
.lang-opt.active { background:rgba(123,31,74,.07); color:var(--primary); font-weight:700; }
[data-theme="dark"] .lang-opt.active { background:rgba(200,164,74,.1); color:var(--accent-light); }
.lang-opt .flag  { font-size:1.15rem; }
.lang-opt .check { margin-left:auto; color:var(--primary); font-size:.75rem; opacity:0; }
[dir="rtl"] .lang-opt .check { margin-left:0; margin-right:auto; }
[data-theme="dark"] .lang-opt .check { color:var(--accent); }
.lang-opt.active .check { opacity:1; }

/* ── Theme Toggle — icon only ── */
.theme-btn {
  width:38px; height:38px; border-radius:50%;
  background:var(--bg-secondary); border:1.5px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; font-size:1rem; color:var(--text-primary);
  transition:all var(--transition); flex-shrink:0;
  box-shadow:none;
}
.theme-btn:hover {
  border-color:var(--primary); color:var(--primary);
  box-shadow:var(--shadow-sm);
  background:var(--bg-card);
}
[data-theme="dark"] .theme-btn { color:var(--accent-light); }
[data-theme="dark"] .theme-btn:hover { border-color:var(--accent); color:var(--accent); }

/* Hamburger */
.hamburger { display:none; flex-direction:column; gap:5px; padding:8px; cursor:pointer; border-radius:var(--radius-sm); transition:background var(--transition); }
.hamburger:hover { background:var(--bg-secondary); }
.hamburger span { display:block; width:20px; height:2px; background:var(--text-primary); border-radius:2px; transition:all var(--transition); }
.hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity:0; }
.hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* Mobile menu */
.mobile-menu {
  display:none;
  position:fixed;
  top:var(--nav-height);
  left:0;
  right:0;
  width:100%;
  max-width:100vw;
  box-sizing:border-box;
  overflow-x:hidden;
  background:var(--bg-nav);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
  padding:8px 16px 16px;
  z-index:999;
  flex-direction:column;
  gap:2px;
  animation:mobileIn .25s ease;
  box-shadow:0 8px 24px rgba(0,0,0,.15);
}
.mobile-menu.open { display:flex; }
@keyframes mobileIn { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }
.mob-link {
  display:block;
  padding:11px 14px;
  font-size:.875rem;
  font-weight:600;
  color:var(--text-secondary);
  border-radius:var(--radius-sm);
  transition:all var(--transition);
  cursor:pointer;
  background:none;
  border:none;
  text-align:left;
  font-family:inherit;
  width:100%;
  box-sizing:border-box;
}
[dir="rtl"] .mob-link { text-align:right; }
[dir="rtl"] .mobile-menu { align-items:flex-end; padding-right:16px; padding-left:16px; }
.mob-link:hover { background:var(--bg-secondary); color:var(--primary); }
[data-theme="dark"] .mob-link:hover { color:var(--accent-light); }

/* ================================================================
   HERO
================================================================ */
.hero {
  min-height:100vh; padding-top:var(--nav-height);
  position:relative; display:flex; align-items:center; overflow:hidden;
  background:var(--primary-ultra);
}
.hero-bg {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse at 15% 55%, rgba(200,164,74,.13) 0%, transparent 55%),
    radial-gradient(ellipse at 80% 20%, rgba(123,31,74,.45) 0%, transparent 50%),
    linear-gradient(148deg,#2A0819 0%,#4D1230 42%,#7B1F4A 100%);
}
.hero-mesh {
  position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:72px 72px;
}
.hero-content { position:relative; z-index:2; padding:80px 0; max-width:700px; }
.hero-content.hero-center {
  max-width:820px;
  margin:0 auto;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.hero-content.hero-center .hero-tag { justify-content:center; }
.hero-content.hero-center .hero-tag::before { display:none; }
.hero-content.hero-center .hero-tag::after  { display:none; }
.hero-content.hero-center .hero-title { text-align:center; }
.hero-content.hero-center .hero-subtitle { text-align:center; max-width:640px; font-size:1.18rem; line-height:1.75; }
.hero-actions-center { justify-content:center; }
.hero-tag { display:inline-flex; align-items:center; gap:10px; font-size:.74rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--accent-light); margin-bottom:24px; animation:hIn .8s ease .2s both; }
.hero-tag::before { content:''; display:block; width:30px; height:2px; background:var(--accent); }
[dir="rtl"] .hero-tag::before { display:none; }
[dir="rtl"] .hero-tag::after  { content:''; display:block; width:30px; height:2px; background:var(--accent); }
.hero-title { font-family:var(--font-display); font-size:clamp(2rem,5vw,3.7rem); font-weight:900; color:#fff; line-height:1.12; margin-bottom:22px; animation:hIn .8s ease .4s both; }
[data-lang="dari"] .hero-title { font-family:var(--font-dari)!important; font-weight:700; }
.hero-title .hl { color:var(--accent-light); }
.hero-subtitle { font-size:1.05rem; color:rgba(255,255,255,.73); line-height:1.78; margin-bottom:40px; max-width:540px; animation:hIn .8s ease .6s both; }
.hero-actions { display:flex; gap:14px; flex-wrap:wrap; animation:hIn .8s ease .8s both; }
@keyframes hIn { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }
.hero-deco { position:absolute; right:0; bottom:0; top:0; width:42%; z-index:1; display:flex; align-items:center; justify-content:center; opacity:.07; }

/* ================================================================
   STATS
================================================================ */
.stats { background:var(--primary); padding:60px 0; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.stat-item { text-align:center; padding:28px 16px; position:relative; }
.stat-item:not(:last-child)::after { content:''; position:absolute; right:0; top:20%; height:60%; width:1px; background:rgba(255,255,255,.13); }
[dir="rtl"] .stat-item:not(:last-child)::after { right:auto; left:0; }
.stat-icon  { font-size:1.45rem; color:var(--accent); margin-bottom:9px; display:block; }
.stat-num   { font-family:var(--font-display); font-size:2.7rem; font-weight:800; color:var(--accent-light); line-height:1; margin-bottom:7px; }
[data-lang="dari"] .stat-num { font-family:var(--font-dari)!important; }
.stat-label { font-size:.84rem; font-weight:500; color:rgba(255,255,255,.7); }

/* ================================================================
   PROGRAMS
================================================================ */
.programs { padding:100px 0; background:var(--bg); }
.programs-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.prog-card {
  background:var(--bg-card); border-radius:var(--radius-lg);
  padding:34px 26px; border:1px solid var(--border);
  transition:all var(--transition); position:relative; overflow:hidden;
}
.prog-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  transform:scaleX(0); transform-origin:left; transition:transform var(--transition);
}
[dir="rtl"] .prog-card::before { transform-origin:right; }
.prog-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:var(--primary); }
.prog-card:hover::before { transform:scaleX(1); }
.prog-icon {
  width:52px; height:52px; border-radius:var(--radius-md);
  background:rgba(123,31,74,.09); display:flex; align-items:center;
  justify-content:center; font-size:1.4rem; color:var(--primary);
  margin-bottom:18px; transition:all var(--transition);
}
[data-theme="dark"] .prog-icon { background:rgba(123,31,74,.3); }
.prog-card:hover .prog-icon { background:var(--primary); color:var(--accent-light); }
.prog-title { font-size:1.05rem; font-weight:700; color:var(--text-primary); margin-bottom:9px; }
.prog-desc  { font-size:.875rem; color:var(--text-secondary); line-height:1.67; }
.prog-link  { display:inline-flex; align-items:center; gap:6px; margin-top:18px; font-size:.84rem; font-weight:700; color:var(--primary); transition:gap var(--transition); cursor:pointer; }
[data-theme="dark"] .prog-link { color:var(--accent-light); }
.prog-card:hover .prog-link { gap:10px; }

/* ================================================================
   NEWS PREVIEW
================================================================ */
/* ════════════════════════════════════════
   HOME — ACHIEVEMENTS PREVIEW
   ════════════════════════════════════════ */
.achv-preview { padding: 100px 0; background: var(--bg-secondary); }

.achv-prev-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-bottom: 52px;
}

.achv-prev-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  overflow: hidden;
  transition: all var(--transition);
  position: relative;
}
.achv-prev-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 64px rgba(0,0,0,0.13);
  border-color: var(--accent);
}
.achv-prev-card::after {
  content: '';
  position: absolute; bottom: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  transform: scaleX(0); transform-origin: left;
  transition: transform var(--transition);
}
[dir="rtl"] .achv-prev-card::after { transform-origin: right; }
.achv-prev-card:hover::after { transform: scaleX(1); }

/* Header banner */
.achv-prev-hdr {
  height: 136px;
  display: flex; align-items: center; justify-content: center;
  position: relative; overflow: hidden;
}
.achv-prev-hdr.hdr-gold   { background: linear-gradient(140deg, #5a1535, #8B2252, #C8A44A 130%); }
.achv-prev-hdr.hdr-maroon { background: linear-gradient(140deg, #2d5016, #4a8024, #6ab832 130%); }
.achv-prev-hdr.hdr-navy   { background: linear-gradient(140deg, #102040, #1a3a6a, #2e6bac 130%); }

/* Shimmer orb */
.achv-prev-shine {
  position: absolute; top: -30px; right: -30px;
  width: 110px; height: 110px; border-radius: 50%;
  background: rgba(255,255,255,0.06);
  pointer-events: none;
}

/* Icon circle */
.achv-prev-icon {
  width: 78px; height: 78px; border-radius: 50%;
  background: rgba(255,255,255,0.15);
  border: 2px solid rgba(255,255,255,0.28);
  display: flex; align-items: center; justify-content: center;
  font-size: 2.2rem; color: rgba(255,255,255,0.95);
  box-shadow: 0 8px 28px rgba(0,0,0,0.22);
  position: relative; z-index: 1;
  transition: transform var(--transition);
}
.achv-prev-card:hover .achv-prev-icon { transform: scale(1.08); }
.hdr-gold .achv-prev-icon {
  background: linear-gradient(135deg, rgba(200,164,74,0.45), rgba(226,200,122,0.25));
  border-color: rgba(226,200,122,0.5);
  color: #fff3c4;
}

/* Card body */
.achv-prev-body { padding: 26px 28px 34px; text-align: center; }

.achv-prev-badge {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 0.67rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase;
  padding: 5px 14px; border-radius: 100px; margin-bottom: 18px;
}
.achv-prev-badge.intl { color: #8a6b10; background: rgba(200,164,74,0.12); border: 1px solid rgba(200,164,74,0.32); }
.achv-prev-badge.prov { color: var(--primary); background: rgba(123,31,74,0.08); border: 1px solid rgba(123,31,74,0.18); }
.achv-prev-badge.natl { color: #15602a; background: rgba(21,96,42,0.08); border: 1px solid rgba(21,96,42,0.2); }
[data-theme="dark"] .achv-prev-badge.intl,
[data-theme="dark"] .achv-prev-badge.prov,
[data-theme="dark"] .achv-prev-badge.natl {
  color: var(--accent-light); background: rgba(200,164,74,0.1); border-color: rgba(200,164,74,0.22);
}

.achv-prev-title {
  font-size: 1rem; font-weight: 800;
  color: var(--text-primary); line-height: 1.38; margin-bottom: 12px;
}
.achv-prev-desc {
  font-size: 0.845rem; color: var(--text-secondary); line-height: 1.7;
}

/* CTA — gold outline button */
.btn-outline-gold {
  background: transparent;
  border: 2px solid var(--accent);
  color: var(--accent-dark);
  padding: 15px 38px; border-radius: var(--radius-xl);
  font-size: 0.95rem; font-weight: 700; letter-spacing: 0.04em;
  display: inline-flex; align-items: center; gap: 10px;
  cursor: pointer; transition: all var(--transition);
}
.btn-outline-gold:hover {
  background: var(--accent); color: #fff;
  transform: translateY(-3px); box-shadow: 0 10px 30px rgba(200,164,74,0.35);
}
[data-theme="dark"] .btn-outline-gold { border-color: var(--accent-light); color: var(--accent-light); }
[data-theme="dark"] .btn-outline-gold:hover { background: var(--accent-light); color: #1a0810; }

@media(max-width:1080px) { .achv-prev-grid { grid-template-columns: repeat(2,1fr); } }
@media(max-width:680px)  { .achv-prev-grid { grid-template-columns: 1fr; } }
[dir="rtl"] .achv-prev-badge { letter-spacing: 0; }

.news-preview { padding:100px 0; background:var(--bg-secondary); }
.news-grid    { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-bottom:44px; }
.news-card    { background:var(--bg-card); border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--border); transition:all var(--transition); }
.news-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.news-thumb   { height:190px; display:flex; align-items:center; justify-content:center; font-size:2.8rem; color:rgba(255,255,255,.3); }
.news-body    { padding:22px; }
.news-meta    { display:flex; align-items:center; gap:10px; margin-bottom:10px; flex-wrap:wrap; }
.news-cat     { font-size:.7rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--primary); background:rgba(123,31,74,.08); padding:3px 10px; border-radius:100px; }
[data-theme="dark"] .news-cat { color:var(--accent-light); background:rgba(200,164,74,.1); }
.news-date    { font-size:.78rem; color:var(--text-muted); }
.news-ttl     { font-size:.97rem; font-weight:700; color:var(--text-primary); line-height:1.43; margin-bottom:8px; }
.news-excerpt { font-size:.86rem; color:var(--text-secondary); line-height:1.65; }
.news-more    { display:inline-flex; align-items:center; gap:6px; margin-top:14px; font-size:.83rem; font-weight:700; color:var(--primary); transition:gap var(--transition); cursor:pointer; }
[data-theme="dark"] .news-more { color:var(--accent-light); }
.news-card:hover .news-more { gap:10px; }
.cta-center { text-align:center; }

/* ================================================================
   CTA BANNER
================================================================ */
.cta-banner {
  padding:100px 0;
  background:linear-gradient(142deg,var(--primary-ultra) 0%,var(--primary-dark) 44%,var(--primary) 100%);
  position:relative; overflow:hidden;
}
.cta-banner::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 70% 50%,rgba(200,164,74,.11),transparent 55%),
    linear-gradient(rgba(255,255,255,.017) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.017) 1px,transparent 1px);
  background-size:auto,55px 55px,55px 55px;
}
.cta-inner    { position:relative; z-index:2; text-align:center; max-width:680px; margin:0 auto; }
.cta-title    { font-family:var(--font-display); font-size:clamp(1.7rem,3.5vw,2.7rem); font-weight:800; color:#fff; margin-bottom:14px; }
[data-lang="dari"] .cta-title { font-family:var(--font-dari)!important; }
.cta-subtitle { font-size:1rem; color:rgba(255,255,255,.73); margin-bottom:38px; line-height:1.75; }
.cta-actions  { display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }

/* ================================================================
   PAGE HERO (inner pages)
================================================================ */
.page-hero {
  padding:calc(var(--nav-height) + 60px) 0 60px;
  background:linear-gradient(142deg,var(--primary-ultra) 0%,var(--primary-dark) 48%,var(--primary) 100%);
  position:relative; overflow:hidden;
}
.page-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 72% 50%,rgba(200,164,74,.1),transparent 55%); }
.page-hero-content { position:relative; z-index:2; }
.ph-tag   { font-size:.74rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--accent-light); display:block; margin-bottom:12px; }
.ph-title { font-family:var(--font-display); font-size:clamp(1.8rem,4vw,2.9rem); font-weight:800; color:#fff; margin-bottom:14px; }
[data-lang="dari"] .ph-title { font-family:var(--font-dari)!important; }
.ph-sub   { font-size:1rem; color:rgba(255,255,255,.73); max-width:540px; line-height:1.76; }
.breadcrumb { display:flex; align-items:center; gap:8px; margin-top:22px; font-size:.82rem; color:rgba(255,255,255,.55); }
.bc-sep  { opacity:.4; }
[dir="rtl"] .bc-sep { transform:scaleX(-1); }
.bc-cur  { color:var(--accent-light); }
.bc-home { cursor:pointer; }
.bc-home:hover { color:white; }

/* ================================================================
   ABOUT
================================================================ */
.about-intro { padding:100px 0; }
.about-grid  { display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center; }
.about-text .section-header { text-align:left; margin-bottom:24px; }
[dir="rtl"] .about-text .section-header { text-align:right; }
[dir="rtl"] .about-text .section-divider { margin:14px 0 0; }
.about-text p { color:var(--text-secondary); line-height:1.82; margin-bottom:14px; }
.about-img   { border-radius:var(--radius-xl); min-height:400px; background:linear-gradient(135deg,var(--primary-dark),var(--primary)); display:flex; align-items:center; justify-content:center; font-size:6.5rem; color:rgba(255,255,255,.18); position:relative; overflow:hidden; }
.about-img::after { content:''; position:absolute; bottom:0; left:0; right:0; height:40%; background:linear-gradient(to top,rgba(200,164,74,.14),transparent); }

.values-section { padding:80px 0; background:var(--bg-secondary); }
.values-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.val-card { background:var(--bg-card); border-radius:var(--radius-lg); padding:30px 22px; text-align:center; border:1px solid var(--border); transition:all var(--transition); }
.val-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--accent); }
.val-icon  { width:58px; height:58px; border-radius:50%; background:linear-gradient(135deg,var(--primary-dark),var(--primary)); display:flex; align-items:center; justify-content:center; font-size:1.5rem; color:var(--accent-light); margin:0 auto 18px; }
.val-name  { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:9px; }
.val-desc  { font-size:.858rem; color:var(--text-secondary); line-height:1.65; }

.mv-section { padding:80px 0; }
.mv-grid    { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.mv-card    { border-radius:var(--radius-xl); padding:46px 38px; position:relative; overflow:hidden; }
.mv-card.mission { background:var(--primary); }
.mv-card.vision  { background:var(--bg-card); border:2px solid var(--accent); }
.mv-card::before { content:''; position:absolute; top:-30%; right:-8%; width:190px; height:190px; border-radius:50%; background:rgba(255,255,255,.04); }
[dir="rtl"] .mv-card::before { right:auto; left:-8%; }
.mv-lbl   { font-size:.72rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; display:block; margin-bottom:14px; }
.mv-card.mission .mv-lbl  { color:var(--accent-light); }
.mv-card.vision  .mv-lbl  { color:var(--accent-dark); }
[data-theme="dark"] .mv-card.vision .mv-lbl { color:var(--accent-light); }
.mv-title { font-family:var(--font-display); font-size:1.55rem; font-weight:800; margin-bottom:14px; }
[data-lang="dari"] .mv-title { font-family:var(--font-dari)!important; }
.mv-card.mission .mv-title { color:white; }
.mv-card.vision  .mv-title { color:var(--text-primary); }
.mv-card.mission .mv-text  { color:rgba(255,255,255,.8); line-height:1.77; font-size:.93rem; }
.mv-card.vision  .mv-text  { color:var(--text-secondary); line-height:1.77; font-size:.93rem; }

.history-section { padding:80px 0 100px; background:var(--bg-secondary); }
.timeline { position:relative; max-width:780px; margin:0 auto; }
.timeline::before { content:''; position:absolute; left:50%; top:0; bottom:0; width:2px; background:linear-gradient(to bottom,var(--accent),var(--primary)); transform:translateX(-50%); }
[dir="rtl"] .timeline::before { left:auto; right:50%; transform:translateX(50%); }
.tl-item { display:flex; gap:44px; margin-bottom:44px; position:relative; }
.tl-item:nth-child(odd)  { flex-direction:row; }
.tl-item:nth-child(even) { flex-direction:row-reverse; }
[dir="rtl"] .tl-item:nth-child(odd)  { flex-direction:row-reverse; }
[dir="rtl"] .tl-item:nth-child(even) { flex-direction:row; }
.tl-content { flex:1; }
.tl-item:nth-child(odd)  .tl-content { text-align:right; }
.tl-item:nth-child(even) .tl-content { text-align:left;  }
[dir="rtl"] .tl-item:nth-child(odd)  .tl-content { text-align:left; }
[dir="rtl"] .tl-item:nth-child(even) .tl-content { text-align:right; }
.tl-year  { display:inline-block; font-size:.74rem; font-weight:700; color:var(--accent-dark); background:rgba(200,164,74,.12); padding:3px 11px; border-radius:100px; margin-bottom:7px; }
[data-theme="dark"] .tl-year { color:var(--accent-light); }
.tl-title { font-weight:700; color:var(--text-primary); margin-bottom:5px; }
.tl-desc  { font-size:.858rem; color:var(--text-secondary); line-height:1.62; }
.tl-dot   { position:absolute; left:50%; top:6px; transform:translateX(-50%); width:14px; height:14px; border-radius:50%; background:var(--accent); border:3px solid var(--bg-secondary); z-index:1; }
[dir="rtl"] .tl-dot { left:auto; right:50%; transform:translateX(50%); }

/* ================================================================
   ACADEMICS
================================================================ */
.grades-section { padding:100px 0; }
.grades-grid    { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-bottom:60px; }
.grade-card { background:var(--bg-card); border-radius:var(--radius-lg); padding:34px 26px; border:1px solid var(--border); text-align:center; transition:all var(--transition); position:relative; overflow:hidden; }
.grade-card::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,var(--primary-dark),var(--primary)); opacity:0; transition:opacity var(--transition); }
.grade-card:hover::before { opacity:1; }
.grade-card * { position:relative; z-index:1; }
.grade-card:hover { border-color:var(--primary); transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.grade-card:hover .grade-num,.grade-card:hover .grade-ttl,.grade-card:hover .grade-desc { color:white; }
.grade-icon { width:56px; height:56px; border-radius:var(--radius-md); background:rgba(123,31,74,.09); display:flex; align-items:center; justify-content:center; font-size:1.4rem; color:var(--primary); margin:0 auto 18px; transition:all var(--transition); }
.grade-card:hover .grade-icon { background:rgba(255,255,255,.15); color:var(--accent-light); }
.grade-num  { font-family:var(--font-display); font-size:2.4rem; font-weight:800; color:var(--accent-dark); line-height:1; margin-bottom:4px; transition:color var(--transition); }
[data-theme="dark"] .grade-num { color:var(--accent-light); }
.grade-ttl  { font-size:.96rem; font-weight:700; color:var(--text-primary); margin-bottom:9px; transition:color var(--transition); }
.grade-desc { font-size:.858rem; color:var(--text-secondary); line-height:1.63; transition:color var(--transition); }


/* ── Grade Levels full grid ─────────────────────────────────── */
.grade-levels-grid {
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:16px;
  margin-bottom:60px;
}
.gl-card {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:22px 16px 20px;
  text-align:center;
  transition:all var(--transition);
  position:relative;
  overflow:hidden;
  cursor:default;
}
.gl-card::before {
  content:'';
  position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--primary), var(--accent));
  transform:scaleX(0); transform-origin:left;
  transition:transform var(--transition);
}
[dir="rtl"] .gl-card::before { transform-origin:right; }
.gl-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); border-color:var(--primary); }
.gl-card:hover::before { transform:scaleX(1); }
.gl-card-highlight { border-color:rgba(123,31,74,.25); }
.gl-card-highlight .gl-icon { background:rgba(123,31,74,.12); color:var(--primary); }
.gl-icon {
  width:48px; height:48px;
  border-radius:var(--radius-md);
  background:rgba(200,164,74,.1);
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem; color:var(--accent-dark);
  margin:0 auto 12px;
  transition:all var(--transition);
}
[data-theme="dark"] .gl-icon { color:var(--accent-light); background:rgba(200,164,74,.12); }
.gl-card:hover .gl-icon { background:var(--primary); color:var(--accent-light); }
.gl-num {
  font-family:var(--font-display);
  font-size:2rem; font-weight:800;
  color:var(--accent-dark); line-height:1;
  margin-bottom:6px;
}
[data-theme="dark"] .gl-num { color:var(--accent-light); }
.gl-card:hover .gl-num { color:var(--primary); }
[data-theme="dark"] .gl-card:hover .gl-num { color:var(--accent-light); }
.gl-label {
  font-size:1rem; font-weight:800;
  color:var(--accent-dark); line-height:1;
  margin-bottom:6px;
}
[data-theme="dark"] .gl-label { color:var(--accent-light); }
.gl-card:hover .gl-label { color:var(--primary); }
.gl-desc {
  font-size:.75rem; color:var(--text-secondary);
  line-height:1.5; margin-top:4px;
}
/* Responsive */
@media(max-width:1080px) { .grade-levels-grid { grid-template-columns:repeat(4,1fr); } }
@media(max-width:768px)  { .grade-levels-grid { grid-template-columns:repeat(3,1fr); } }
@media(max-width:480px)  { .grade-levels-grid { grid-template-columns:repeat(2,1fr); } }


/* ── Curriculum Cards ──────────────────────────────────────── */
.curriculum-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  align-items:start;
}
.curr-card {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  overflow:hidden;
  transition:all var(--transition);
  box-shadow:var(--shadow-sm);
}
.curr-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }

.curr-header {
  display:flex; align-items:flex-start; gap:14px;
  padding:24px 24px 20px;
  border-bottom:1px solid var(--border);
}
[dir="rtl"] .curr-header { flex-direction:row-reverse; text-align:right; }
.curr-flag { font-size:2rem; line-height:1; flex-shrink:0; margin-top:2px; }
.curr-name { font-size:.95rem; font-weight:800; color:var(--text-primary); margin-bottom:4px; line-height:1.3; }
.curr-sub  { font-size:.72rem; font-weight:600; color:var(--text-muted); letter-spacing:.02em; }

/* Top accent per curriculum */
.curr-af { background:linear-gradient(135deg,rgba(0,100,0,.06),rgba(0,100,0,.02)); border-top:3px solid #2d6a2d; }
.curr-uk { background:linear-gradient(135deg,rgba(123,31,74,.08),rgba(123,31,74,.02)); border-top:3px solid var(--primary); }
.curr-tr { background:linear-gradient(135deg,rgba(200,30,30,.06),rgba(200,30,30,.02)); border-top:3px solid #c41e1e; }

.curr-subjects { padding:20px 24px 24px; display:flex; flex-direction:column; gap:10px; }

.curr-subj {
  display:flex; align-items:flex-start; gap:10px;
  font-size:.855rem; color:var(--text-secondary); line-height:1.5;
}
[dir="rtl"] .curr-subj { flex-direction:row-reverse; text-align:right; }
.curr-subj i { color:var(--accent-dark); flex-shrink:0; margin-top:3px; font-size:.8rem; }
[data-theme="dark"] .curr-subj i { color:var(--accent); }

@media(max-width:1080px) { .curriculum-grid { grid-template-columns:1fr; } }
@media(max-width:768px)  { .curr-header { padding:18px 18px 14px; } .curr-subjects { padding:16px 18px 18px; } }

.subjects-section { padding:80px 0; background:var(--bg-secondary); }
/* ── Teaching Approach Section ───────────────────────────────── */
.teaching-section { padding:80px 0; background:var(--bg); }

.teach-layout {
  display:grid;
  grid-template-columns:1fr 380px;
  gap:48px;
  align-items:start;
}

/* numbered approach rows */
.teach-approaches { display:flex; flex-direction:column; gap:0; }

.teach-approach {
  display:flex; gap:20px; align-items:flex-start;
  padding:28px 0;
  border-bottom:1px solid var(--border);
  transition:all var(--transition);
}
[dir="rtl"] .teach-approach { flex-direction:row-reverse; }
.teach-approach:first-child { padding-top:0; }
.teach-approach:last-child  { border-bottom:none; }
.teach-approach:hover .teach-approach-num { color:var(--primary); }
[data-theme="dark"] .teach-approach:hover .teach-approach-num { color:var(--accent-light); }

.teach-approach-num {
  font-family:var(--font-display);
  font-size:2.4rem; font-weight:900;
  color:rgba(123,31,74,.15);
  line-height:1; flex-shrink:0; width:52px;
  transition:color var(--transition);
}
[data-theme="dark"] .teach-approach-num { color:rgba(200,164,74,.18); }

.teach-approach-body { flex:1; }
.teach-approach-title {
  font-size:1.05rem; font-weight:800;
  color:var(--text-primary); margin-bottom:8px;
}
.teach-approach-desc {
  font-size:.9rem; color:var(--text-secondary);
  line-height:1.75;
}

/* right panel */
.teach-panel {
  position:sticky; top:calc(var(--nav-height) + 24px);
}
.teach-panel-inner {
  background:linear-gradient(145deg, var(--primary-dark), var(--primary));
  border-radius:var(--radius-xl);
  padding:36px 30px;
  box-shadow:var(--shadow-lg);
}
.teach-panel-title {
  font-family:var(--font-display);
  font-size:1.25rem; font-weight:800;
  color:#fff; margin-bottom:28px;
  padding-bottom:16px;
  border-bottom:1px solid rgba(255,255,255,.15);
}
.teach-stat-list { display:flex; flex-direction:column; gap:20px; margin-bottom:28px; }
.teach-stat { display:flex; align-items:center; gap:14px; }
[dir="rtl"] .teach-stat { flex-direction:row-reverse; }
.teach-stat-num {
  font-family:var(--font-display);
  font-size:2rem; font-weight:900;
  color:var(--accent-light); line-height:1; flex-shrink:0; min-width:52px;
  text-align:center;
}
.teach-stat-label { font-size:.84rem; color:rgba(255,255,255,.75); line-height:1.45; }

.teach-panel-quote {
  background:rgba(255,255,255,.07);
  border-radius:var(--radius-md);
  padding:18px 20px;
  border-left:3px solid var(--accent);
}
[dir="rtl"] .teach-panel-quote { border-left:none; border-right:3px solid var(--accent); }
.teach-panel-quote i { color:var(--accent); font-size:.9rem; margin-bottom:8px; display:block; }
.teach-panel-quote p {
  font-size:.84rem; color:rgba(255,255,255,.8);
  line-height:1.65; font-style:italic;
}

@media(max-width:1080px) {
  .teach-layout { grid-template-columns:1fr; }
  .teach-panel  { position:static; }
  .teach-stat-list { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
}
@media(max-width:480px) {
  .teach-stat-list { grid-template-columns:1fr; }
  .teach-approach-num { font-size:1.8rem; width:40px; }
}

.subjects-grid    { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.subj-chip { display:flex; align-items:center; gap:10px; padding:13px 15px; background:var(--bg-card); border-radius:var(--radius-md); border:1px solid var(--border); transition:all var(--transition); }
.subj-chip:hover { border-color:var(--primary); background:rgba(123,31,74,.04); transform:translateX(4px); }
[dir="rtl"] .subj-chip:hover { transform:translateX(-4px); }
.subj-chip-icon { font-size:1.1rem; width:22px; text-align:center; flex-shrink:0; }
.subj-chip-name { font-size:.875rem; font-weight:600; color:var(--text-primary); }

/* ================================================================
   ADMISSIONS
================================================================ */
.adm-section { padding:100px 0; }
/* ── Admission key rules banner ───────────────────────────────── */
.adm-rules {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-bottom:60px;
}
.adm-rule-item {
  display:flex; align-items:flex-start; gap:14px;
  padding:24px 22px;
  background:linear-gradient(135deg,var(--primary-dark),var(--primary));
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md);
}
[dir="rtl"] .adm-rule-item { flex-direction:row-reverse; }
.adm-rule-icon {
  width:42px; height:42px; border-radius:var(--radius-md); flex-shrink:0;
  background:rgba(200,164,74,.18);
  display:flex; align-items:center; justify-content:center;
  font-size:1.1rem; color:var(--accent-light);
}
.adm-rule-text {
  font-size:.88rem; color:rgba(255,255,255,.88);
  line-height:1.65; font-weight:500;
}
@media(max-width:768px) { .adm-rules { grid-template-columns:1fr; } }

.process-steps { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; position:relative; margin-bottom:70px; }
.process-steps::before { content:''; position:absolute; top:34px; left:10%; right:10%; height:2px; background:linear-gradient(90deg,var(--accent),var(--primary)); z-index:0; }
[dir="rtl"] .process-steps::before { background:linear-gradient(270deg,var(--accent),var(--primary)); }
.proc-step { text-align:center; position:relative; z-index:1; }
.step-circle { width:68px; height:68px; border-radius:50%; background:var(--primary); display:flex; align-items:center; justify-content:center; font-size:1.35rem; color:var(--accent-light); margin:0 auto 13px; position:relative; box-shadow:var(--shadow-sm); }
.step-num { position:absolute; top:-5px; right:-5px; width:20px; height:20px; border-radius:50%; background:var(--accent); color:white; font-size:.65rem; font-weight:700; display:flex; align-items:center; justify-content:center; }
[dir="rtl"] .step-num { right:auto; left:-5px; }
.step-ttl  { font-size:.82rem; font-weight:700; color:var(--text-primary); margin-bottom:6px; }
.step-desc { font-size:.76rem; color:var(--text-secondary); line-height:1.5; }
.reqs-grid { display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.req-card  { background:var(--bg-card); border-radius:var(--radius-lg); padding:32px; border:1px solid var(--border); }
.req-head  { display:flex; align-items:center; gap:11px; font-size:1.05rem; font-weight:700; color:var(--text-primary); margin-bottom:20px; padding-bottom:14px; border-bottom:2px solid var(--border); }
[dir="rtl"] .req-head { flex-direction:row-reverse; }
.req-head i { color:var(--accent-dark); }
[data-theme="dark"] .req-head i { color:var(--accent-light); }
.req-list  { display:flex; flex-direction:column; gap:10px; }
.req-item  { display:flex; align-items:flex-start; gap:10px; font-size:.875rem; color:var(--text-secondary); }
[dir="rtl"] .req-item { flex-direction:row-reverse; }
.req-item i { color:var(--accent-dark); flex-shrink:0; margin-top:2px; }
[data-theme="dark"] .req-item i { color:var(--accent); }

/* ================================================================
   TEACHERS
================================================================ */
.teachers-section { padding:100px 0; }
.teachers-grid    { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.teacher-card { background:var(--bg-card); border-radius:var(--radius-xl); overflow:hidden; border:1px solid var(--border); transition:all var(--transition); }
.teacher-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.teacher-photo { height:210px; display:flex; align-items:flex-end; justify-content:center; position:relative; overflow:hidden; }
.teacher-photo-icon { font-size:5rem; color:rgba(255,255,255,.2); position:absolute; top:50%; left:50%; transform:translate(-50%,-62%); }
.teacher-wave { position:absolute; bottom:-18px; left:0; right:0; height:56px; background:var(--bg-card); border-radius:50% 50% 0 0; }
.teacher-body { padding:6px 22px 26px; text-align:center; }
.teacher-name { font-size:1.05rem; font-weight:700; color:var(--text-primary); margin-bottom:4px; }
.teacher-pos  { font-size:.83rem; font-weight:700; color:var(--primary); margin-bottom:10px; }
[data-theme="dark"] .teacher-pos { color:var(--accent-light); }
.teacher-quals{ font-size:.8rem; color:var(--text-muted); line-height:1.5; margin-bottom:13px; }
.teacher-soc  { display:flex; justify-content:center; gap:8px; }
.teacher-soc a{ width:30px; height:30px; border-radius:50%; background:var(--bg-secondary); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:.78rem; color:var(--text-secondary); transition:all var(--transition); }
.teacher-soc a:hover { background:var(--primary); border-color:var(--primary); color:white; }

/* ================================================================
   STUDENT LIFE
================================================================ */
.life-section     { padding:100px 0; }
.life-categories  { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.life-cat { background:var(--bg-card); border-radius:var(--radius-xl); padding:36px; border:1px solid var(--border); transition:all var(--transition); }
.life-cat:hover   { box-shadow:var(--shadow-md); border-color:var(--accent); }
.life-cat-header  { display:flex; align-items:center; gap:13px; margin-bottom:20px; }
[dir="rtl"] .life-cat-header { flex-direction:row-reverse; }
.life-cat-icon    { width:48px; height:48px; border-radius:var(--radius-md); background:linear-gradient(135deg,var(--primary-dark),var(--primary)); display:flex; align-items:center; justify-content:center; font-size:1.25rem; color:var(--accent-light); flex-shrink:0; }
.life-cat-title   { font-size:1.12rem; font-weight:700; color:var(--text-primary); }
.life-items       { display:flex; flex-wrap:wrap; gap:8px; }
.life-item { display:flex; align-items:center; gap:7px; padding:7px 13px; background:var(--bg-secondary); border-radius:100px; font-size:.845rem; font-weight:600; color:var(--text-secondary); border:1px solid var(--border); transition:all var(--transition); }
.life-item:hover  { background:var(--primary); color:white; border-color:var(--primary); }
.life-item i { color:var(--accent-dark); font-size:.82rem; transition:color var(--transition); }
[data-theme="dark"] .life-item i { color:var(--accent); }
.life-item:hover i { color:var(--accent-light); }

/* ================================================================
   GALLERY
================================================================ */
.gallery-section  { padding:100px 0; background:var(--bg-secondary); }
.gallery-grid     { display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:196px; gap:14px; }
.gallery-item     { border-radius:var(--radius-md); overflow:hidden; cursor:pointer; position:relative; transition:transform var(--transition); }
.gallery-item:nth-child(5n+1) { grid-column:span 2; grid-row:span 2; }
.gallery-item:hover { transform:scale(1.02); z-index:2; }
.gal-placeholder  { width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; }
.gal-placeholder i{ font-size:1.9rem; color:rgba(255,255,255,.38); }
.gal-placeholder span { font-size:.77rem; color:rgba(255,255,255,.48); font-weight:500; }
.gal-placeholder--photo { background:rgba(0,0,0,.38); }
.gal-placeholder--photo i { color:rgba(255,255,255,.7); }
.gal-placeholder--photo span { color:rgba(255,255,255,.9); font-weight:600; text-shadow:0 1px 4px rgba(0,0,0,.5); }
.gal-placeholder--album { background:rgba(0,0,0,.48); justify-content:flex-end; padding-bottom:18px; }
.gal-placeholder--album i { font-size:2rem; color:rgba(255,255,255,.75); }
.gal-placeholder--album span:not(.gal-album-badge) { font-size:.85rem; color:#fff; font-weight:700; letter-spacing:.02em; }
.gal-overlay { position:absolute; inset:0; background:rgba(77,18,48,.78); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; opacity:0; transition:opacity var(--transition); }
.gallery-item:hover .gal-overlay { opacity:1; }
.gal-overlay i    { color:white; font-size:1.65rem; }
.gal-overlay span { color:rgba(255,255,255,.84); font-size:.79rem; font-weight:600; text-align:center; padding:0 12px; }
/* Lightbox */
.lightbox { display:none; position:fixed; inset:0; z-index:9000; background:rgba(0,0,0,.93); align-items:center; justify-content:center; }
.lightbox.open { display:flex; animation:fadeIn .3s ease; }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
.lb-content  { max-width:85vw; max-height:85vh; text-align:center; }
.lb-inner    { min-width:300px; min-height:220px; border-radius:var(--radius-lg); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:13px; }
.lb-inner i  { font-size:3.8rem; color:rgba(255,255,255,.3); }
.lb-caption  { color:rgba(255,255,255,.68); font-size:.9rem; margin-top:12px; }
.lb-close    { position:absolute; top:22px; right:22px; width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.11); color:white; font-size:1.15rem; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background var(--transition); border:none; }
.lb-close:hover { background:rgba(255,255,255,.22); }

/* ================================================================
   NEWS & EVENTS
================================================================ */
/* ================================================================
   EVENTS PAGE — 2-column magazine grid
================================================================ */
.events-section   { padding:80px 0 100px; }

.events-grid {
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:28px;
  margin-top:48px;
}

/* ── Event Card ── */
.ev-card {
  background:var(--bg-card);
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--border);
  cursor:pointer;
  display:flex;
  flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ev-card:hover {
  transform:translateY(-6px);
  box-shadow:0 20px 48px rgba(0,0,0,.13);
  border-color:var(--accent);
}
[data-theme="dark"] .ev-card:hover {
  box-shadow:0 20px 48px rgba(0,0,0,.4);
}

/* ── Card image area ── */
.ev-card-img {
  position:relative;
  width:100%;
  height:220px;
  display:flex;
  align-items:flex-end;
  justify-content:flex-start;
  padding:14px;
  flex-shrink:0;
}

/* Category badge — bottom-left of image */
.ev-card-cat {
  display:inline-flex;
  align-items:center;
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#fff;
  background:var(--primary);
  padding:4px 12px;
  border-radius:100px;
  backdrop-filter:blur(4px);
}

/* Photo count badge — top-right of image */
.news-photo-badge {
  position:absolute;
  top:12px;
  right:12px;
  left:auto;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(6px);
  color:#fff;
  font-size:.72rem;
  font-weight:600;
  padding:4px 10px;
  border-radius:100px;
  display:flex;
  align-items:center;
  gap:5px;
}
[dir="rtl"] .news-photo-badge { right:auto; left:12px; }

/* ── Card body ── */
.ev-card-body {
  padding:22px 24px 20px;
  display:flex;
  flex-direction:column;
  flex:1;
}
.ev-card-ttl {
  font-size:1rem;
  font-weight:700;
  color:var(--text-primary);
  margin-bottom:10px;
  line-height:1.4;
}
.ev-card-exc {
  font-size:.858rem;
  color:var(--text-secondary);
  line-height:1.68;
  flex:1;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  margin-bottom:14px;
}

/* View Photos link */
.news-view-photos {
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:.82rem;
  font-weight:700;
  color:var(--primary);
  margin-top:auto;
  transition:gap var(--transition);
}
[data-theme="dark"] .news-view-photos { color:var(--accent-light); }
.ev-card:hover .news-view-photos { gap:10px; }

/* ── Responsive ── */
@media(max-width:768px) {
  .events-grid { grid-template-columns:1fr; gap:20px; }
  .ev-card-img  { height:190px; }
}
@media(max-width:480px) {
  .events-section { padding:60px 0 80px; }
  .ev-card-img    { height:170px; }
  .ev-card-body   { padding:18px; }
}
/* Sidebar */
.ev-ttl           { font-size:.845rem; font-weight:600; color:var(--text-primary); margin-bottom:3px; line-height:1.35; }

/* ── News card — clickable + photo badge ── */

/* ── News Photo Lightbox ── */
.nph-overlay {
  position:fixed; inset:0; z-index:9900;
  background:rgba(0,0,0,.92); backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition:opacity .25s ease;
}
.nph-overlay.open { opacity:1; pointer-events:all; }

.nph-close {
  position:absolute; top:18px; right:22px;
  background:rgba(255,255,255,.1); border:none; color:#fff;
  width:40px; height:40px; border-radius:50%; font-size:1rem;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background var(--transition); z-index:10;
}
[dir="rtl"] .nph-close { right:auto; left:22px; }
.nph-close:hover { background:rgba(255,255,255,.22); }

.nph-arrow {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(255,255,255,.1); border:none; color:#fff;
  width:44px; height:44px; border-radius:50%; font-size:1rem;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background var(--transition); z-index:10;
}
.nph-arrow:hover { background:rgba(255,255,255,.22); }
.nph-prev { left:18px; }
.nph-next { right:18px; }
[dir="rtl"] .nph-prev { left:auto; right:18px; }
[dir="rtl"] .nph-next { right:auto; left:18px; }

.nph-inner {
  width:min(860px, 90vw);
  display:flex; flex-direction:column; gap:14px;
  padding:0 60px;
}
@media(max-width:600px) { .nph-inner { padding:0 10px; } }

.nph-title {
  text-align:center; color:#fff;
  font-size:1rem; font-weight:600;
  opacity:.75; letter-spacing:.02em;
}

.nph-img-wrap {
  width:100%; aspect-ratio:16/10;
  border-radius:12px; overflow:hidden;
  background:#111; display:flex;
  align-items:center; justify-content:center;
}
.nph-img-wrap img {
  width:100%; height:100%; object-fit:contain;
  transition:opacity .15s ease;
}

.nph-footer { display:flex; flex-direction:column; gap:8px; }

.nph-progress-bar {
  width:100%; height:2px; background:rgba(255,255,255,.15);
  border-radius:2px; overflow:hidden;
}
.nph-progress-fill {
  height:100%; width:0%;
  background:linear-gradient(90deg,var(--accent),#E2C87A);
}

.nph-meta {
  display:flex; align-items:center; justify-content:space-between;
}
.nph-counter { color:rgba(255,255,255,.5); font-size:.8rem; font-weight:600; }
.nph-dots    { display:flex; gap:6px; }
.nph-dot {
  width:7px; height:7px; border-radius:50%;
  background:rgba(255,255,255,.25); cursor:pointer;
  transition:background .2s, transform .2s;
}
.nph-dot.active { background:var(--accent); transform:scale(1.3); }

/* ================================================================
   CONTACT
================================================================ */
.contact-section  { padding:100px 0; }
.contact-grid     { display:grid; grid-template-columns:1fr 1.55fr; gap:44px; }
.contact-info     { display:flex; flex-direction:column; gap:17px; }
.contact-info-head{ font-size:1.3rem; font-weight:700; color:var(--text-primary); margin-bottom:4px; }
.contact-card     { display:flex; gap:13px; padding:18px; background:var(--bg-card); border-radius:var(--radius-lg); border:1px solid var(--border); transition:all var(--transition); }
[dir="rtl"] .contact-card { flex-direction:row-reverse; }
.contact-card:hover { border-color:var(--accent); box-shadow:var(--shadow-sm); }
.contact-icon     { width:44px; height:44px; border-radius:var(--radius-md); background:linear-gradient(135deg,var(--primary-dark),var(--primary)); display:flex; align-items:center; justify-content:center; font-size:1rem; color:var(--accent-light); flex-shrink:0; }
.contact-lbl      { font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted); margin-bottom:3px; }
.contact-val      { font-size:.9rem; font-weight:600; color:var(--text-primary); }
/* Form */
.form-wrap  { background:var(--bg-card); border-radius:var(--radius-xl); padding:44px; border:1px solid var(--border); }
.form-title { font-size:1.25rem; font-weight:700; color:var(--text-primary); margin-bottom:26px; }
.form-row   { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-group { display:flex; flex-direction:column; gap:5px; margin-bottom:17px; }
.form-label { font-size:.8rem; font-weight:700; color:var(--text-secondary); }
.form-input { width:100%; padding:11px 15px; background:var(--bg); border:1.5px solid var(--border); border-radius:var(--radius-md); font-size:.88rem; color:var(--text-primary); transition:border-color var(--transition),box-shadow var(--transition); outline:none; }
.form-input:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(123,31,74,.1); }
[data-theme="dark"] .form-input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(200,164,74,.15); }
textarea.form-input { resize:vertical; min-height:130px; }
.form-submit { width:100%; padding:13px; background:var(--primary); color:white; border:none; border-radius:var(--radius-md); font-size:.95rem; font-weight:700; cursor:pointer; transition:all var(--transition); display:flex; align-items:center; justify-content:center; gap:8px; font-family:inherit; }
.form-submit:hover { background:var(--primary-light); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.form-success { display:none; text-align:center; padding:22px; color:#2d8653; font-weight:600; }
.form-error   { display:none; text-align:center; padding:18px; color:#c0392b; font-weight:600; background:rgba(192,57,43,.07); border-radius:var(--radius-md); margin-top:10px; }
[data-theme="dark"] .form-success { color:#5dd898; }
[data-theme="dark"] .form-error   { color:#ff6b6b; background:rgba(255,107,107,.08); }
.map-wrap { margin-top:44px; border-radius:var(--radius-xl); overflow:hidden; border:1px solid var(--border); height:340px; }
.map-wrap iframe { width:100%; height:100%; border:none; }

/* ================================================================
   FOOTER
================================================================ */
footer { background:var(--primary-ultra); color:rgba(255,255,255,.8); padding:80px 0 0; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:44px; margin-bottom:60px; }
.footer-brand-desc { font-size:.858rem; color:rgba(255,255,255,.46); line-height:1.78; margin-bottom:22px; margin-top:14px; }
.footer-social { display:flex; gap:8px; }
.footer-social a { width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.07); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.5); font-size:.88rem; transition:all var(--transition); }
.footer-social a:hover { background:var(--accent); color:var(--primary-dark); }
.footer-col-title { font-size:.76rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--accent-light); margin-bottom:17px; }
.footer-links { display:flex; flex-direction:column; gap:10px; }
.footer-lnk   { font-size:.845rem; color:rgba(255,255,255,.46); transition:color var(--transition); cursor:pointer; }
.footer-lnk:hover { color:var(--accent-light); }
.footer-ci    { display:flex; gap:9px; font-size:.845rem; color:rgba(255,255,255,.46); margin-bottom:10px; align-items:flex-start; }
[dir="rtl"] .footer-ci { flex-direction:row-reverse; }
.footer-ci i  { color:var(--accent); flex-shrink:0; margin-top:2px; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.07); padding:22px 0; display:flex; justify-content:space-between; align-items:center; font-size:.79rem; color:rgba(255,255,255,.28); }
.footer-br { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.footer-br .heart { color:#e85d6b; }
a.dev-link {
  color:var(--accent-light); font-weight:700;
  text-decoration:none; transition:opacity var(--transition);
}
a.dev-link:hover { opacity:.7; text-decoration:underline; }

/* ── RTL global visibility fixes ─────────────────────────── */
/* Ensure all icons remain visible in RTL */
[dir="rtl"] i.fas,
[dir="rtl"] i.fab,
[dir="rtl"] i.far { display:inline-block; }

/* Arrow icons in links/buttons — flip direction for RTL */
[dir="rtl"] .prog-link i.fa-arrow-right,
[dir="rtl"] .news-more i.fa-arrow-right,
[dir="rtl"] .news-readmore i.fa-arrow-right { transform:scaleX(-1); display:inline-block; }

/* Ensure flex items with icons don't collapse in RTL */
[dir="rtl"] .req-head,
[dir="rtl"] .life-cat-header,
[dir="rtl"] .contact-card,
[dir="rtl"] .teacher-soc { display:flex; }

/* Teacher social links RTL */
[dir="rtl"] .teacher-soc { justify-content:center; }
[dir="rtl"] .teacher-soc a { display:flex; }

/* Stat icons RTL */
[dir="rtl"] .stat-icon { display:block; }

/* Footer social RTL */
[dir="rtl"] .footer-social { flex-direction:row; }
[dir="rtl"] .footer-social a { display:flex; }

/* Breadcrumb icons */
[dir="rtl"] .bc-sep { transform:scaleX(-1); display:inline-block; }

/* Process step circles */
[dir="rtl"] .step-circle { display:flex; }

/* Form submit icon */
[dir="rtl"] .form-submit i { display:inline-block; }

/* Nav link icons */
[dir="rtl"] .btn i { display:inline-block; }

/* Contact icons */
[dir="rtl"] .footer-ci i { display:inline-block; flex-shrink:0; }
[dir="rtl"] .contact-icon { display:flex; flex-shrink:0; }

/* Value / grade / subject cards */
[dir="rtl"] .val-icon,
[dir="rtl"] .grade-icon,
[dir="rtl"] .life-cat-icon { display:flex; }

/* Reveal animations — correct direction for RTL */
[dir="rtl"] .reveal-left { transform:translateX(36px); }
[dir="rtl"] .reveal-right { transform:translateX(-36px); }
[dir="rtl"] .reveal-left.visible,
[dir="rtl"] .reveal-right.visible { transform:translateX(0); }

/* News full card hover direction */

/* Subject chips RTL hover */
[dir="rtl"] .subj-chip:hover { transform:translateX(-4px); }

/* Life items RTL hover */
[dir="rtl"] .life-item:hover { transform:none; }

/* ── Footer RTL — full alignment fix ── */
[dir="rtl"] .footer-grid               { direction:rtl; }
[dir="rtl"] .footer-col-title          { text-align:right; display:block; }
[dir="rtl"] .footer-links              { align-items:flex-end; }
[dir="rtl"] .footer-lnk                { text-align:right; display:block; width:100%; }
[dir="rtl"] .footer-ci                 { flex-direction:row-reverse; text-align:right; justify-content:flex-end; }
[dir="rtl"] .footer-ci span            { text-align:right; }
[dir="rtl"] .footer-brand-desc         { text-align:right; }
[dir="rtl"] footer .footer-ci { justify-content:flex-end; direction:rtl; }
[dir="rtl"] .footer-social             { flex-direction:row; justify-content:flex-end; }
[dir="rtl"] .footer-bottom             { flex-direction:row-reverse; direction:ltr; }
[dir="rtl"] .footer-br                 { flex-direction:row; }
[dir="rtl"] .nav-logo-text             { text-align:right; }

/* Mobile footer RTL — stack columns right-aligned */
@media(max-width:1080px) {
  [dir="rtl"] .footer-grid             { direction:rtl; text-align:right; }
  [dir="rtl"] .footer-col-title        { text-align:right; }
  [dir="rtl"] .footer-links            { align-items:flex-end; }
  [dir="rtl"] .footer-lnk              { text-align:right; }
  [dir="rtl"] .footer-ci               { flex-direction:row-reverse; justify-content:flex-end; }
}

/* Section divider RTL */
[dir="rtl"] .section-divider { background:linear-gradient(270deg,var(--primary),var(--accent)); }

/* ================================================================
   RESPONSIVE
================================================================ */
@media(max-width:1080px) {
  .nav-links { display:none; }
  .hamburger { display:flex; }
  .stats-grid,.values-grid { grid-template-columns:repeat(2,1fr); }
  .stat-item:nth-child(2)::after { display:none; }
  .programs-grid,.news-grid { grid-template-columns:repeat(2,1fr); }
  .grades-grid,.teachers-grid { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:1fr 1fr; gap:28px; }
  .about-grid { grid-template-columns:1fr; gap:36px; }
  .about-img  { min-height:260px; }
  .mv-grid { grid-template-columns:1fr; }
  .contact-grid { grid-template-columns:1fr; }
}
@media(max-width:768px) {
  :root { --nav-height:64px; }
  .hero-content { padding:54px 0; }
  .hero-deco { display:none; }
  .programs-grid,.news-grid { grid-template-columns:1fr; }
  .values-grid { grid-template-columns:repeat(2,1fr); }
  .grades-grid,.teachers-grid { grid-template-columns:1fr; }
  .subjects-grid { grid-template-columns:repeat(2,1fr); }
  .process-steps { grid-template-columns:repeat(2,1fr); }
  .process-steps::before { display:none; }
  .reqs-grid { grid-template-columns:1fr; }
  .life-categories { grid-template-columns:1fr; }
  .gallery-grid { grid-template-columns:repeat(2,1fr); grid-auto-rows:150px; }
  .gallery-item:nth-child(5n+1) { grid-column:span 1; grid-row:span 1; }
  .form-row { grid-template-columns:1fr; }
  .form-wrap { padding:26px 18px; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; gap:7px; text-align:center; }
  /* Timeline mobile */
  .timeline::before { left:18px; }
  [dir="rtl"] .timeline::before { right:18px; left:auto; }
  .tl-item { flex-direction:row!important; padding-left:50px; }
  [dir="rtl"] .tl-item { flex-direction:row-reverse!important; padding-left:0; padding-right:50px; }
  .tl-content { text-align:left!important; }
  [dir="rtl"] .tl-content { text-align:right!important; }
  .tl-dot { left:11px; right:auto; transform:none; }
  [dir="rtl"] .tl-dot { right:11px; left:auto; }
}
@media(max-width:480px) {
  .values-grid,.subjects-grid { grid-template-columns:1fr; }
  .hero-title  { font-size:1.85rem; }
  .stat-num    { font-size:2rem; }
  /* nav-logo-sub responsive rule removed */
  .process-steps { grid-template-columns:1fr; }
}

/* ── School Achievements ─────────────────────────────────────── */
.achievements-section { margin-top:0; }

.achievements-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.achv-card {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  padding:28px 26px;
  display:flex; gap:18px; align-items:flex-start;
  transition:all var(--transition);
  position:relative; overflow:hidden;
}
[dir="rtl"] .achv-card { flex-direction:row-reverse; }
.achv-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  transform:scaleX(0); transform-origin:left; transition:transform var(--transition);
}
[dir="rtl"] .achv-card::before { transform-origin:right; }
.achv-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:var(--accent); }
.achv-card:hover::before { transform:scaleX(1); }

/* wide card spans 2 columns */
.achv-card-wide { grid-column:span 2; }

.achv-medal {
  width:52px; height:52px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem;
}
.achv-medal.gold {
  background:linear-gradient(135deg,rgba(200,164,74,.2),rgba(200,164,74,.1));
  color:var(--accent-dark);
  border:2px solid rgba(200,164,74,.3);
}
[data-theme="dark"] .achv-medal.gold { color:var(--accent-light); }
.achv-medal.silver {
  background:linear-gradient(135deg,rgba(123,31,74,.15),rgba(123,31,74,.07));
  color:var(--primary);
  border:2px solid rgba(123,31,74,.2);
}
[data-theme="dark"] .achv-medal.silver { color:var(--accent-light); border-color:rgba(200,164,74,.25); }

.achv-body { flex:1; min-width:0; }
.achv-title {
  font-size:.97rem; font-weight:800;
  color:var(--text-primary); margin-bottom:9px; line-height:1.35;
}
.achv-desc {
  font-size:.845rem; color:var(--text-secondary);
  line-height:1.68; margin-bottom:14px;
}
.achv-badge {
  display:inline-flex; align-items:center; gap:6px;
  font-size:.72rem; font-weight:700; letter-spacing:.06em;
  color:var(--primary); background:rgba(123,31,74,.07);
  padding:4px 12px; border-radius:100px;
  border:1px solid rgba(123,31,74,.15);
}
[data-theme="dark"] .achv-badge { color:var(--accent-light); background:rgba(200,164,74,.1); border-color:rgba(200,164,74,.2); }
.achv-badge-gold {
  color:var(--accent-dark); background:rgba(200,164,74,.12);
  border-color:rgba(200,164,74,.3);
}
[data-theme="dark"] .achv-badge-gold { color:var(--accent-light); }

@media(max-width:1080px) { .achievements-grid { grid-template-columns:repeat(2,1fr); } .achv-card-wide { grid-column:span 2; } }
@media(max-width:768px)  { .achievements-grid { grid-template-columns:1fr; } .achv-card-wide { grid-column:span 1; } }

/* ════════════════════════════════════════
   TEACHERS & STAFF — Tabbed Interface
════════════════════════════════════════ */
.staff-section { padding:80px 0 100px; }

/* ── Tab Switcher ── */
.staff-tabs {
  display:flex; gap:0;
  background:var(--bg-secondary);
  border:1.5px solid var(--border);
  border-radius:var(--radius-lg);
  padding:6px;
  width:fit-content;
  margin:0 auto 0;
  box-shadow:var(--shadow-sm);
}
.staff-tab {
  display:flex; align-items:center; gap:9px;
  padding:12px 32px;
  border-radius:var(--radius-md);
  font-size:.9rem; font-weight:700;
  color:var(--text-muted);
  cursor:pointer; border:none; background:none;
  font-family:inherit; transition:all var(--transition);
  white-space:nowrap;
}
.staff-tab i { font-size:1rem; }
.staff-tab:hover { color:var(--text-primary); }
.staff-tab.active {
  background:var(--primary);
  color:#fff;
  box-shadow:0 4px 14px rgba(123,31,74,.35);
}
[data-theme="dark"] .staff-tab.active { background:var(--primary); }

/* ── Panels ── */
.staff-panel { display:none; animation:pgIn .4s ease; }
.staff-panel.active { display:block; }

/* ── Teacher cards (updated with subject badge) ── */
.teacher-subject {
  display:flex; align-items:center; gap:6px;
  font-size:.75rem; font-weight:700;
  color:var(--accent-dark); margin-bottom:8px;
  letter-spacing:.04em;
}
[data-theme="dark"] .teacher-subject { color:var(--accent-light); }
.teacher-subject i { font-size:.8rem; }

/* ── Founder Featured Card ── */
.founder-card {
  display:grid;
  grid-template-columns:220px 1fr;
  gap:0;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius-xl);
  overflow:hidden;
  margin-bottom:32px;
  box-shadow:var(--shadow-md);
  transition:all var(--transition);
}
[dir="rtl"] .founder-card { direction:rtl; }
.founder-card:hover { box-shadow:var(--shadow-lg); transform:translateY(-3px); }

.founder-photo {
  background:linear-gradient(145deg,var(--primary-dark),var(--primary));
  display:flex; align-items:center; justify-content:center;
  font-size:5rem; color:rgba(255,255,255,.18);
  min-height:280px; position:relative;
}
.founder-photo::after {
  content:''; position:absolute;
  bottom:0; left:0; right:0; height:40%;
  background:linear-gradient(to top, rgba(200,164,74,.18), transparent);
}
.founder-body {
  padding:36px 36px;
  display:flex; flex-direction:column; justify-content:center;
  border-left:4px solid var(--accent);
}
[dir="rtl"] .founder-body { border-left:none; border-right:4px solid var(--accent); }
.founder-role-tag {
  display:inline-block;
  font-size:.72rem; font-weight:800; letter-spacing:.16em;
  text-transform:uppercase; color:var(--accent-dark);
  background:rgba(200,164,74,.12); border:1px solid rgba(200,164,74,.3);
  padding:4px 14px; border-radius:100px; margin-bottom:12px;
  width:fit-content;
}
[data-theme="dark"] .founder-role-tag { color:var(--accent-light); }
.founder-name {
  font-family:var(--font-display);
  font-size:1.6rem; font-weight:800;
  color:var(--text-primary); margin-bottom:14px; line-height:1.2;
}
.founder-bio {
  font-size:.9rem; color:var(--text-secondary);
  line-height:1.8; margin-bottom:20px;
}
.founder-badges { display:flex; flex-wrap:wrap; gap:9px; }
.founder-badge {
  display:inline-flex; align-items:center; gap:7px;
  font-size:.76rem; font-weight:700;
  color:var(--primary); background:rgba(123,31,74,.06);
  border:1px solid rgba(123,31,74,.15);
  padding:6px 14px; border-radius:100px;
  transition:all var(--transition);
}
[data-theme="dark"] .founder-badge { color:var(--accent-light); background:rgba(200,164,74,.08); border-color:rgba(200,164,74,.2); }
.founder-badge:hover { background:var(--primary); color:#fff; border-color:var(--primary); }
[data-theme="dark"] .founder-badge:hover { background:var(--accent-dark); color:var(--primary-dark); }

/* ── Admin Grid ── */
.admin-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.admin-card {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  overflow:hidden;
  transition:all var(--transition);
  display:flex; flex-direction:column;
}
.admin-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); border-color:var(--accent); }
.admin-icon-wrap {
  height:100px;
  display:flex; align-items:center; justify-content:center;
  font-size:2.4rem; color:rgba(255,255,255,.3);
  position:relative;
}
.admin-icon-wrap::after {
  content:''; position:absolute; bottom:-18px; left:0; right:0;
  height:36px; background:var(--bg-card); border-radius:50% 50% 0 0;
}
.admin-body { padding:6px 20px 22px; text-align:center; }
.admin-name { font-size:1rem; font-weight:700; color:var(--text-primary); margin-bottom:4px; }
.admin-pos  { font-size:.83rem; font-weight:700; color:var(--primary); margin-bottom:8px; }
[data-theme="dark"] .admin-pos { color:var(--accent-light); }
.admin-dept { display:flex; align-items:center; justify-content:center; gap:6px; font-size:.75rem; color:var(--text-muted); }
.admin-dept i { font-size:.72rem; color:var(--accent-dark); }
[data-theme="dark"] .admin-dept i { color:var(--accent); }

/* Responsive */
@media(max-width:1080px) {
  .founder-card { grid-template-columns:160px 1fr; }
  .admin-grid   { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:768px) {
  .founder-card { grid-template-columns:1fr; }
  .founder-photo{ min-height:160px; font-size:3.5rem; }
  .founder-body { padding:24px; border-left:none; border-top:4px solid var(--accent); }
  [dir="rtl"] .founder-body { border-right:none; border-top:4px solid var(--accent); }
  .admin-grid   { grid-template-columns:1fr; }
  .staff-tab    { padding:11px 20px; font-size:.82rem; }
}

/* ── Map overlay link ────────────────────────────────────────── */
.map-wrap { position:relative; }
.map-overlay-link {
  position:absolute; bottom:16px; left:50%; transform:translateX(-50%);
  z-index:10;
}
.map-open-btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 22px;
  background:var(--primary); color:#fff;
  border-radius:var(--radius-md);
  font-size:.85rem; font-weight:700;
  box-shadow:0 4px 16px rgba(123,31,74,.45);
  transition:all var(--transition);
  text-decoration:none; white-space:nowrap;
}
.map-open-btn:hover { background:var(--primary-light); transform:translateY(-2px); box-shadow:0 6px 20px rgba(123,31,74,.5); }
.map-open-btn i { font-size:.9rem; color:var(--accent-light); }

/* Force footer credit to always read: label → name (LTR text order) */
[dir="rtl"] #footerCredit {
  direction:ltr;
  unicode-bidi:plaintext;
}
[dir="rtl"] #footerCredit #devLabel,
[dir="rtl"] #footerCredit .dev-link {
  direction:rtl;
  unicode-bidi:embed;
}
/* footer-br-rtl-fix */

/* ── About page building photo ─────────────────────────────────── */
.about-img-wrap {
  position:relative; border-radius:var(--radius-xl); overflow:hidden;
  box-shadow:var(--shadow-lg);
}
.about-building-img {
  width:100%; height:420px; object-fit:cover;
  display:block;
  border-radius:var(--radius-xl);
  transition:transform .5s ease;
}
.about-img-wrap:hover .about-building-img { transform:scale(1.03); }
.about-img-caption {
  position:absolute; bottom:0; left:0; right:0;
  background:linear-gradient(to top, rgba(77,18,48,.85) 0%, transparent 100%);
  color:rgba(255,255,255,.9); font-size:.8rem; font-weight:600;
  padding:28px 18px 14px; text-align:center; letter-spacing:.04em;
}
[dir="rtl"] .about-img-caption { text-align:center; }
@media(max-width:768px) { .about-building-img { height:260px; } }

/* ════════════════════════════════════════
   ABOUT PAGE CAROUSEL
════════════════════════════════════════ */
.about-carousel {
  position:relative;
  border-radius:var(--radius-xl);
  overflow:hidden;
  box-shadow:var(--shadow-lg);
  background:var(--primary-dark);
  aspect-ratio:4/3;
  max-height:440px;
}

/* Slides */
.carousel-track { position:relative; width:100%; height:100%; }
.carousel-slide {
  position:absolute; inset:0;
  opacity:0;
  transition:opacity .9s ease;
  z-index:1;
}
.carousel-slide.active {
  opacity:1;
  z-index:2;
}
.carousel-slide img {
  width:100%; height:100%;
  object-fit:cover; display:block;
}

/* Caption overlay */
.carousel-caption {
  position:absolute; bottom:0; left:0; right:0;
  background:linear-gradient(to top, rgba(42,8,25,.88) 0%, rgba(42,8,25,.4) 60%, transparent 100%);
  padding:40px 22px 16px;
  font-size:.8rem; font-weight:600; color:rgba(255,255,255,.9);
  letter-spacing:.04em; text-align:center;
}

/* Prev / Next buttons */
.carousel-btn {
  position:absolute; top:50%; transform:translateY(-50%);
  z-index:10; width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,.15); border:1.5px solid rgba(255,255,255,.3);
  backdrop-filter:blur(8px); color:#fff; font-size:.95rem;
  cursor:pointer; transition:all var(--transition);
  display:flex; align-items:center; justify-content:center;
}
.carousel-btn:hover {
  background:var(--primary); border-color:var(--primary);
  box-shadow:0 4px 16px rgba(123,31,74,.5);
  transform:translateY(-50%) scale(1.08);
}
.carousel-prev { left:14px; }
.carousel-next { right:14px; }
[dir="rtl"] .carousel-prev { left:auto; right:14px; }
[dir="rtl"] .carousel-next { right:auto; left:14px; }
[dir="rtl"] .carousel-prev i { transform:scaleX(-1); }
[dir="rtl"] .carousel-next i { transform:scaleX(-1); }

/* Dots */
.carousel-dots {
  position:absolute; bottom:12px; left:50%; transform:translateX(-50%);
  display:flex; gap:7px; z-index:10;
}
.carousel-dot {
  width:8px; height:8px; border-radius:50%;
  background:rgba(255,255,255,.4); border:none; cursor:pointer;
  transition:all var(--transition); padding:0;
}
.carousel-dot.active {
  background:var(--accent);
  width:22px; border-radius:4px;
  box-shadow:0 2px 8px rgba(200,164,74,.5);
}
.carousel-dot:hover { background:rgba(255,255,255,.75); }

/* Counter */
.carousel-counter {
  position:absolute; top:12px; right:14px; z-index:10;
  background:rgba(0,0,0,.35); backdrop-filter:blur(6px);
  color:rgba(255,255,255,.85); font-size:.72rem; font-weight:700;
  padding:4px 10px; border-radius:100px;
  letter-spacing:.06em;
}
[dir="rtl"] .carousel-counter { right:auto; left:14px; }

/* Progress bar — thin gold line that fills over 5s */


/* Responsive */
@media(max-width:768px) {
  .about-carousel { aspect-ratio:16/10; max-height:280px; }
  .carousel-btn   { width:34px; height:34px; font-size:.8rem; }
}

/* ── Consul General Album Section ───────────────────────── */
.gal-album-section   { padding: 60px 0 20px; }
.gal-album-header    { margin-bottom: 28px; }
.gal-album-tag       { display:inline-flex; align-items:center; gap:7px; font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--primary); background:rgba(123,31,74,.08); padding:5px 14px; border-radius:100px; margin-bottom:12px; }
[data-theme="dark"] .gal-album-tag { color:var(--accent-light); background:rgba(200,164,74,.1); }
.gal-album-title     { font-size:1.45rem; font-weight:700; color:var(--text-primary); }
.gal-album-grid      { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.gal-real-photo      { height:240px; border-radius:var(--radius-lg); overflow:hidden; cursor:pointer; position:relative; transition:transform .3s ease, box-shadow .3s ease; }
.gal-real-photo:hover { transform:translateY(-5px); box-shadow:0 16px 40px rgba(0,0,0,.25); }
.gal-real-photo .gal-overlay { background:rgba(0,0,0,.35); }

/* ── Lightbox photo fix ──────────────────────────────────── */
.lb-content { max-width:92vw; max-height:90vh; }
#lbInner img { border-radius:12px; box-shadow:0 8px 40px rgba(0,0,0,.5); }

@media (max-width:768px) {
  .gal-album-grid { grid-template-columns:repeat(2,1fr); }
  .gal-real-photo { height:180px; }
}
@media (max-width:480px) {
  .gal-album-grid { grid-template-columns:1fr; }
}

/* ── Consul Gallery Album ─────────────────────────────────── */
.gal-album-section        { padding:60px 0 10px; }
.gal-album-header         { margin-bottom:28px; }
.gal-album-tag            { display:inline-flex; align-items:center; gap:7px; font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--primary); background:rgba(123,31,74,.08); padding:5px 14px; border-radius:100px; margin-bottom:12px; }
[data-theme="dark"] .gal-album-tag { color:var(--accent-light); background:rgba(200,164,74,.1); }
.gal-album-title          { font-size:1.45rem; font-weight:700; color:var(--text-primary); }
.gal-real-photo           { position:relative; cursor:pointer; }
.gal-real-label           { position:absolute; bottom:0; left:0; right:0; background:linear-gradient(transparent,rgba(0,0,0,.55)); padding:28px 12px 10px; display:flex; align-items:flex-end; justify-content:center; }
.gal-real-label span      { font-size:.72rem; color:rgba(255,255,255,.75); font-weight:500; text-align:center; }

/* ── Carousel Lightbox ────────────────────────────────────── */
.consul-carousel           { display:none; position:fixed; inset:0; z-index:9500; background:rgba(0,0,0,.96); align-items:center; justify-content:center; animation:fadeIn .25s ease; }
.consul-carousel.open      { display:flex; }
.cc-close                  { position:absolute; top:20px; right:22px; width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.12); color:white; font-size:1.1rem; display:flex; align-items:center; justify-content:center; cursor:pointer; border:none; transition:background .2s; z-index:10; }
.cc-close:hover            { background:rgba(255,255,255,.25); }
.cc-arrow                  { position:absolute; top:50%; transform:translateY(-50%); width:50px; height:50px; border-radius:50%; background:rgba(255,255,255,.12); color:white; font-size:1.2rem; display:flex; align-items:center; justify-content:center; cursor:pointer; border:none; transition:background .2s, transform .2s; z-index:10; }
.cc-arrow:hover            { background:rgba(255,255,255,.25); transform:translateY(-50%) scale(1.08); }
.cc-prev                   { left:22px; }
.cc-next                   { right:22px; }
.cc-content                { display:flex; flex-direction:column; align-items:center; gap:16px; max-width:88vw; width:100%; }
.cc-img-wrap               { width:100%; max-height:72vh; display:flex; align-items:center; justify-content:center; }
.cc-img-wrap img           { max-width:100%; max-height:72vh; border-radius:10px; box-shadow:0 12px 50px rgba(0,0,0,.6); object-fit:contain; display:block; }
.cc-footer                 { width:100%; max-width:720px; }
.cc-progress-bar           { width:100%; height:3px; background:rgba(255,255,255,.15); border-radius:3px; overflow:hidden; margin-bottom:10px; }
.cc-progress-fill          { height:100%; width:0%; background:var(--primary); border-radius:3px; }
[data-theme="dark"] .cc-progress-fill { background:var(--accent-light); }
.cc-caption                { color:rgba(255,255,255,.75); font-size:.88rem; text-align:center; margin-bottom:10px; min-height:1.2em; }
.cc-meta                   { display:flex; align-items:center; justify-content:space-between; }
.cc-dots                   { display:flex; gap:7px; }
.carousel-dot              { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.28); transition:background .25s, transform .25s; cursor:pointer; }
.carousel-dot.active       { background:var(--primary); transform:scale(1.3); }
[data-theme="dark"] .carousel-dot.active { background:var(--accent-light); }
.cc-counter                { font-size:.78rem; color:rgba(255,255,255,.45); font-weight:600; letter-spacing:.05em; }

@media (max-width:600px) {
  .cc-arrow  { width:38px; height:38px; font-size:1rem; }
  .cc-prev   { left:8px; }
  .cc-next   { right:8px; }
  .cc-content { max-width:96vw; }
}

/* ── Consul General Visit — Album Card ───────────────────── */
.gal-consul-card {
  background: linear-gradient(135deg, #8B1A1A, #c8102e, #8B1A1A);
  background-size: 200% 200%;
  animation: consulCardShimmer 4s ease infinite;
  position: relative;
}
@keyframes consulCardShimmer {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.gal-consul-card .gal-placeholder { gap: 10px; }
.gal-consul-card .gal-placeholder i { font-size: 2.2rem; color: rgba(255,255,255,.55); }
.gal-consul-card .gal-placeholder span { font-size: .82rem; color: rgba(255,255,255,.7); font-weight: 600; letter-spacing:.03em; }
.gal-album-badge {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: .68rem !important; font-weight: 600 !important;
  background: rgba(255,255,255,.18); color: rgba(255,255,255,.85) !important;
  padding: 3px 10px; border-radius: 100px; letter-spacing:.05em;
}

/* ── Istanbul Sightseeing — Album Card ───────────────────── */
.gal-istanbul-card {
  background: linear-gradient(135deg, #0d3b6e, #1a6ea8, #0d3b6e);
  background-size: 200% 200%;
  animation: istanbulCardShimmer 4s ease infinite;
}
@keyframes istanbulCardShimmer {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.gal-istanbul-card .gal-placeholder { gap: 10px; }
.gal-istanbul-card .gal-placeholder i { font-size: 2.2rem; color: rgba(255,255,255,.55); }
.gal-istanbul-card .gal-placeholder span { font-size: .82rem; color: rgba(255,255,255,.7); font-weight: 600; letter-spacing:.03em; }

.gal-grad-card {
  background: linear-gradient(135deg, #7B1F4A, #C8A44A, #7B1F4A);
  background-size: 200% 200%;
  animation: gradCardShimmer 4s ease infinite;
}
@keyframes gradCardShimmer {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.gal-grad-card .gal-placeholder { gap: 10px; }
.gal-grad-card .gal-placeholder i { font-size: 2.2rem; color: rgba(255,255,255,.55); }
.gal-grad-card .gal-placeholder span { font-size: .82rem; color: rgba(255,255,255,.7); font-weight: 600; letter-spacing:.03em; }

.gal-td-card {
  background: linear-gradient(135deg, #6a0d91, #c44bb0, #6a0d91);
  background-size: 200% 200%;
  animation: tdCardShimmer 4s ease infinite;
}
@keyframes tdCardShimmer {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.gal-td-card .gal-placeholder { gap: 10px; }
.gal-td-card .gal-placeholder i { font-size: 2.2rem; color: rgba(255,255,255,.55); }
.gal-td-card .gal-placeholder span { font-size: .82rem; color: rgba(255,255,255,.7); font-weight: 600; letter-spacing:.03em; }