/* ============================================================
   MIDLAND HIGH SCHOOL BUNTABA — Shared Stylesheet
   Colors: #187cc1 (Blue) · #faf500 (Yellow)
   ============================================================ */

:root {
  --primary:       #187cc1;
  --primary-dark:  #0d5a8e;
  --primary-deep:  #093f65;
  --primary-light: #e8f4fd;
  --accent:        #faf500;
  --accent-dark:   #d4c900;
  --dark:          #0d1b2a;
  --dark-2:        #1a2d42;
  --text:          #2d3748;
  --text-muted:    #718096;
  --border:        #e2e8f0;
  --bg-alt:        #f7fafd;
  --white:         #ffffff;
  --shadow-sm:     0 2px 8px rgba(24,124,193,0.10);
  --shadow:        0 4px 20px rgba(24,124,193,0.14);
  --shadow-lg:     0 12px 40px rgba(0,0,0,0.14);
  --radius-sm:     8px;
  --radius:        14px;
  --radius-lg:     20px;
  --transition:    all 0.3s ease;
}

/* ── Reset ─────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; }
body { font-family:'Segoe UI',system-ui,-apple-system,sans-serif; color:var(--text); line-height:1.65; background:var(--white); }
img  { max-width:100%; height:auto; display:block; }
a    { text-decoration:none; color:inherit; }
ul   { list-style:none; }
button { font-family:inherit; cursor:pointer; border:none; background:none; }

/* ── Typography ─────────────────────────────────────────────── */
.label {
  font-size:.75rem; font-weight:700; letter-spacing:.22em;
  text-transform:uppercase; color:var(--primary);
}
.divider {
  width:52px; height:4px; background:var(--accent);
  border-radius:2px; margin:.6rem 0;
}
.divider--center { margin:.6rem auto; }
.section-title {
  font-size:clamp(1.75rem,3vw,2.6rem);
  font-weight:900; color:var(--dark); line-height:1.15; margin-bottom:.9rem;
}
.section-title span { color:var(--primary); }
.section-lead {
  font-size:1.05rem; color:var(--text-muted);
  max-width:600px; line-height:1.75;
}

/* ── Layout ─────────────────────────────────────────────────── */
.container { max-width:1200px; margin:0 auto; }
.section   { padding:5rem 2rem; }
.section--alt { background:var(--bg-alt); }
.section__head { margin-bottom:3rem; }
.section__head--center { text-align:center; }
.section__head--center .section-lead { margin:0 auto; }

/* ── Buttons ─────────────────────────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.85rem 2rem; border-radius:var(--radius-sm);
  font-size:.92rem; font-weight:700; letter-spacing:.03em;
  border:2px solid transparent; transition:var(--transition);
}
.btn--primary {
  background:var(--accent); color:var(--dark); border-color:var(--accent);
}
.btn--primary:hover {
  background:var(--accent-dark); transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(250,245,0,.35);
}
.btn--blue {
  background:var(--primary); color:var(--white); border-color:var(--primary);
}
.btn--blue:hover {
  background:var(--primary-dark); transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(24,124,193,.35);
}
.btn--outline {
  background:transparent; color:var(--white);
  border-color:rgba(255,255,255,.55);
}
.btn--outline:hover {
  background:rgba(255,255,255,.12); border-color:var(--white);
  transform:translateY(-2px);
}
.btn--outline-blue {
  background:transparent; color:var(--primary);
  border-color:var(--primary);
}
.btn--outline-blue:hover {
  background:var(--primary); color:var(--white);
  transform:translateY(-2px);
}

/* ── Navigation ─────────────────────────────────────────────── */
.navbar {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:rgba(13,27,42,.97);
  backdrop-filter:blur(12px);
  border-bottom:3px solid var(--accent);
  padding:0 2rem; transition:var(--transition);
}
.nav__inner {
  max-width:1200px; margin:0 auto;
  display:flex; align-items:center;
  justify-content:space-between; height:82px;
}
.nav__brand {
  display:flex; align-items:center; gap:12px;
}
.nav__logo {
  height:66px; width:auto;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.35));
  flex-shrink:0;
}
.nav__name { display:flex; flex-direction:column; line-height:1.25; }
.nav__name-main {
  font-size:.88rem; font-weight:800;
  color:var(--white); letter-spacing:.06em; text-transform:uppercase;
}
.nav__name-sub {
  font-size:.66rem; color:var(--accent);
  letter-spacing:.18em; text-transform:uppercase; font-weight:600;
}
.nav__links {
  display:flex; align-items:center; gap:.2rem;
}
.nav__links a {
  color:rgba(255,255,255,.82); padding:.48rem 1rem;
  border-radius:6px; font-size:.84rem; font-weight:500;
  letter-spacing:.02em; transition:var(--transition);
}
.nav__links a:hover,
.nav__links a.active {
  color:var(--accent); background:rgba(250,245,0,.1);
}
.nav__links .nav__cta {
  background:var(--accent); color:var(--dark) !important;
  font-weight:700; padding:.48rem 1.2rem;
  border-radius:var(--radius-sm);
}
.nav__links .nav__cta:hover {
  background:var(--accent-dark); transform:translateY(-1px);
}
.nav__toggle {
  display:none; flex-direction:column; gap:5px;
  padding:4px; cursor:pointer;
}
.nav__toggle span {
  width:24px; height:2px; background:var(--white);
  border-radius:2px; transition:var(--transition); display:block;
}
.nav__toggle.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.nav__toggle.open span:nth-child(2) { opacity:0; }
.nav__toggle.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* ── Hero (shared base) ─────────────────────────────────────── */
.hero {
  position:relative; display:flex; align-items:center;
  justify-content:center; overflow:hidden;
}
.hero--full   { min-height:100vh; }
.hero--medium { min-height:55vh; padding-top:82px; }
.hero__bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  transform:scale(1.04); transition:transform 8s ease;
}
.hero:hover .hero__bg { transform:scale(1.0); }
.hero__overlay {
  position:absolute; inset:0;
  background:linear-gradient(
    140deg,
    rgba(13,27,42,.88) 0%,
    rgba(24,124,193,.55) 55%,
    rgba(13,27,42,.80) 100%
  );
}
.hero__content {
  position:relative; z-index:2;
  text-align:center; padding:2rem; max-width:920px;
}
.hero__logo {
  margin:0 auto 1.6rem;
  filter:drop-shadow(0 4px 20px rgba(0,0,0,.5));
  animation:fadeInDown .9s ease both;
}
.hero__badge {
  display:inline-block; background:var(--accent); color:var(--dark);
  font-size:.72rem; font-weight:700; letter-spacing:.2em;
  text-transform:uppercase; padding:.38rem 1.2rem; border-radius:50px;
  margin-bottom:1.25rem; animation:fadeInUp .9s ease .2s both;
}
.hero__title {
  font-size:clamp(2.4rem,6vw,4.6rem);
  font-weight:900; color:var(--white); line-height:1.08;
  text-shadow:0 2px 24px rgba(0,0,0,.28);
  margin-bottom:.5rem; animation:fadeInUp .9s ease .35s both;
}
.hero__title span { color:var(--accent); }
.hero__sub {
  font-size:clamp(1rem,2vw,1.35rem); color:rgba(255,255,255,.9);
  margin-bottom:.6rem; letter-spacing:.05em;
  animation:fadeInUp .9s ease .45s both;
}
.hero__motto {
  font-size:clamp(.88rem,1.5vw,1.1rem); color:var(--accent);
  font-style:italic; font-weight:600; margin-bottom:2rem;
  animation:fadeInUp .9s ease .55s both;
}
.hero__pills {
  display:flex; flex-wrap:wrap; gap:.75rem;
  justify-content:center; margin-bottom:2.5rem;
  animation:fadeInUp .9s ease .65s both;
}
.hero__pill {
  background:rgba(255,255,255,.14); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.25); color:var(--white);
  padding:.38rem 1rem; border-radius:50px; font-size:.83rem; font-weight:500;
}
.hero__actions {
  display:flex; gap:1rem; justify-content:center;
  flex-wrap:wrap; animation:fadeInUp .9s ease .75s both;
}
/* Page-hero (non-homepage) heading layout */
.hero__page-text { animation:fadeInUp .9s ease .25s both; }
.hero__page-text .label { color:rgba(255,255,255,.7); }
.hero__page-text .divider { background:var(--accent); margin:.6rem auto; }
.hero__page-text .hero__title { font-size:clamp(2rem,5vw,3.5rem); }
.hero__page-text .hero__sub   { font-size:1rem; }

/* Scroll indicator */
.hero__scroll {
  position:absolute; bottom:1.75rem; left:50%; transform:translateX(-50%);
  z-index:2; animation:bounce 2.5s infinite;
}
.hero__scroll span {
  display:block; width:24px; height:40px;
  border:2px solid rgba(255,255,255,.45);
  border-radius:12px; position:relative; margin:0 auto;
}
.hero__scroll span::after {
  content:''; position:absolute; top:6px; left:50%; transform:translateX(-50%);
  width:4px; height:8px; background:var(--accent);
  border-radius:2px; animation:scroll-dot 2s infinite;
}

/* ── Stats Bar ──────────────────────────────────────────────── */
.stats-bar { background:var(--primary); padding:1.6rem 2rem; }
.stats-bar__grid {
  max-width:1200px; margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;
  text-align:center;
}
.stat { color:var(--white); padding:.4rem; }
.stat__num {
  font-size:2.1rem; font-weight:900; color:var(--accent);
  display:block; line-height:1;
}
.stat__label {
  font-size:.74rem; opacity:.85;
  text-transform:uppercase; letter-spacing:.1em; margin-top:.25rem;
}

/* ── Cards ──────────────────────────────────────────────────── */
.card {
  background:var(--white); border-radius:var(--radius);
  box-shadow:var(--shadow); transition:var(--transition);
  border:1px solid rgba(24,124,193,.08);
  overflow:hidden;
}
.card:hover { transform:translateY(-7px); box-shadow:var(--shadow-lg); }
.card__img { width:100%; height:220px; object-fit:cover; }
.card__body { padding:1.5rem; }
.card__tag {
  font-size:.68rem; font-weight:700; letter-spacing:.18em;
  text-transform:uppercase; color:var(--primary); margin-bottom:.5rem;
}
.card__title {
  font-size:1.05rem; font-weight:800; color:var(--dark); margin-bottom:.5rem;
}
.card__text { font-size:.875rem; color:var(--text-muted); line-height:1.65; }

/* Program card (icon-style) */
.prog-card {
  background:var(--white); border-radius:var(--radius);
  padding:2rem 1.5rem; text-align:center;
  box-shadow:var(--shadow); transition:var(--transition);
  border-top:4px solid var(--primary); position:relative; overflow:hidden;
}
.prog-card::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  opacity:0; transition:var(--transition);
}
.prog-card:hover { transform:translateY(-7px); box-shadow:var(--shadow-lg); }
.prog-card:hover::before { opacity:1; }
.prog-card:hover .prog-card__icon,
.prog-card:hover .prog-card__title,
.prog-card:hover .prog-card__text { color:var(--white); position:relative; z-index:1; }
.prog-card:hover .prog-card__tag  { background:rgba(250,245,0,.2); color:var(--accent); position:relative; z-index:1; }
.prog-card__icon { font-size:2.6rem; display:block; margin-bottom:1rem; position:relative; }
.prog-card__title { font-size:.98rem; font-weight:800; color:var(--dark); margin-bottom:.5rem; position:relative; }
.prog-card__text  { font-size:.8rem; color:var(--text-muted); line-height:1.6; position:relative; }
.prog-card__tag {
  display:inline-block; background:var(--primary-light);
  color:var(--primary); font-size:.68rem; font-weight:700;
  padding:.28rem .75rem; border-radius:50px; margin-top:.75rem; position:relative;
}

/* Value pill */
.value-pill {
  display:flex; align-items:flex-start; gap:.75rem;
  padding:.9rem 1rem; background:var(--primary-light);
  border-radius:var(--radius-sm); border-left:3px solid var(--primary);
}
.value-pill__icon { font-size:1.35rem; flex-shrink:0; line-height:1; }
.value-pill__text { font-size:.875rem; font-weight:600; color:var(--dark); }

/* Pillar row */
.pillar {
  display:flex; align-items:center; gap:1rem;
}
.pillar__dot {
  width:38px; height:38px; background:var(--accent); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; flex-shrink:0;
}
.pillar__text { font-weight:600; font-size:.95rem; color:var(--white); }

/* Destination card */
.dest-card {
  border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow); transition:var(--transition); position:relative;
}
.dest-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.dest-card img { width:100%; height:230px; object-fit:cover; }
.dest-card__body {
  padding:1.25rem 1.5rem;
  background:var(--white);
}
.dest-card__flag { font-size:1.8rem; margin-bottom:.5rem; }
.dest-card__country { font-size:1rem; font-weight:800; color:var(--dark); }
.dest-card__desc { font-size:.8rem; color:var(--text-muted); margin-top:.25rem; }

/* ── Two-col layouts ─────────────────────────────────────────── */
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.two-col--wide { grid-template-columns:2fr 3fr; }

/* Image stack */
.img-stack { position:relative; }
.img-stack__main { width:100%; height:440px; object-fit:cover; border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); }
.img-stack__float {
  position:absolute; bottom:-28px; right:-28px;
  width:200px; height:158px; object-fit:cover;
  border-radius:var(--radius); border:4px solid var(--white);
  box-shadow:var(--shadow-lg);
}
.img-stack__badge {
  position:absolute; top:20px; left:-20px;
  background:var(--accent); color:var(--dark);
  padding:1rem 1.25rem; border-radius:var(--radius-sm);
  font-weight:800; text-align:center; box-shadow:var(--shadow); line-height:1.25;
}
.img-stack__badge .num { font-size:2rem; display:block; }
.img-stack__badge .lbl { font-size:.68rem; text-transform:uppercase; letter-spacing:.1em; }

/* ── Director strip ─────────────────────────────────────────── */
.director-strip {
  background:linear-gradient(135deg,var(--dark) 0%,var(--dark-2) 100%);
  padding:5rem 2rem; position:relative; overflow:hidden;
}
.director-strip::before {
  content:'"'; position:absolute; top:-70px; left:3%;
  font-size:22rem; color:rgba(250,245,0,.04);
  font-family:Georgia,serif; line-height:1; pointer-events:none;
}
.director-strip__grid {
  max-width:1200px; margin:0 auto;
  display:grid; grid-template-columns:1fr 2fr; gap:4rem; align-items:center;
}
.director-strip__img {
  width:100%; max-width:280px; height:320px; object-fit:cover;
  border-radius:var(--radius-lg); margin:0 auto;
  border:3px solid var(--accent); display:block;
}
.director-strip__name { font-size:1.4rem; font-weight:800; color:var(--white); margin-top:1rem; }
.director-strip__role { color:var(--accent); font-size:.82rem; font-weight:600; text-transform:uppercase; letter-spacing:.12em; }
.director-strip__quote {
  font-size:1.15rem; line-height:1.85; color:rgba(255,255,255,.9);
  font-style:italic; margin:1.5rem 0;
  border-left:3px solid var(--accent); padding-left:1.25rem;
}

/* ── Admissions CTA ─────────────────────────────────────────── */
.cta-band {
  background:linear-gradient(135deg,var(--primary),var(--primary-dark));
  padding:4.5rem 2rem; text-align:center;
}
.cta-band .section-title { color:var(--white); }
.cta-band .section-lead  { color:rgba(255,255,255,.85); margin:0 auto 2rem; }

/* ── Fees Table ─────────────────────────────────────────────── */
.fees-table { width:100%; border-collapse:collapse; font-size:.95rem; }
.fees-table th,
.fees-table td { padding:1rem 1.25rem; text-align:left; border-bottom:1px solid var(--border); }
.fees-table thead th { background:var(--primary); color:var(--white); font-weight:700; }
.fees-table tbody tr:hover { background:var(--primary-light); }
.fees-table .total-row td { font-weight:800; color:var(--primary); font-size:1rem; background:var(--primary-light); }

/* ── Contact ────────────────────────────────────────────────── */
.contact-item {
  display:flex; align-items:flex-start; gap:1rem;
  padding:1.25rem; background:var(--primary-light);
  border-radius:var(--radius-sm); transition:var(--transition);
}
.contact-item:hover { background:var(--primary); }
.contact-item:hover .contact-item__icon  { color:var(--accent); }
.contact-item:hover .contact-item__label { color:rgba(255,255,255,.7); }
.contact-item:hover .contact-item__val   { color:var(--white); }
.contact-item__icon  { font-size:1.5rem; flex-shrink:0; color:var(--primary); margin-top:2px; }
.contact-item__label { font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; color:var(--text-muted); margin-bottom:.15rem; }
.contact-item__val   { font-weight:600; color:var(--dark); }

/* Form */
.form-card { background:var(--white); padding:2.5rem; border-radius:var(--radius); box-shadow:var(--shadow); }
.form-card h3 { font-size:1.25rem; font-weight:800; color:var(--dark); margin-bottom:1.5rem; }
.form-group { margin-bottom:1.2rem; }
.form-group label { display:block; font-size:.875rem; font-weight:600; color:var(--text); margin-bottom:.4rem; }
.form-group input,
.form-group textarea,
.form-group select {
  width:100%; padding:.75rem 1rem;
  border:2px solid var(--border); border-radius:var(--radius-sm);
  font-size:.9rem; color:var(--text); font-family:inherit;
  background:#fafafa; transition:var(--transition);
}
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus { outline:none; border-color:var(--primary); background:var(--white); }
.form-group textarea { height:110px; resize:vertical; }

/* ── Gallery ────────────────────────────────────────────────── */
.gallery-filters {
  display:flex; flex-wrap:wrap; gap:.75rem;
  justify-content:center; margin-bottom:2.5rem;
}
.filter-btn {
  padding:.48rem 1.25rem; border-radius:50px; font-size:.84rem;
  font-weight:600; border:2px solid var(--border); color:var(--text-muted);
  cursor:pointer; transition:var(--transition); background:var(--white);
}
.filter-btn:hover,
.filter-btn.active {
  background:var(--primary); color:var(--white); border-color:var(--primary);
}
.gallery-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem;
}
.gallery-item {
  border-radius:var(--radius); overflow:hidden;
  position:relative; cursor:pointer;
  aspect-ratio:4/3; box-shadow:var(--shadow-sm);
}
.gallery-item img {
  width:100%; height:100%; object-fit:cover; transition:transform .4s ease;
}
.gallery-item:hover img { transform:scale(1.06); }
.gallery-item__overlay {
  position:absolute; inset:0;
  background:rgba(13,27,42,.6); opacity:0; transition:var(--transition);
  display:flex; align-items:center; justify-content:center;
}
.gallery-item:hover .gallery-item__overlay { opacity:1; }
.gallery-item__icon { font-size:2rem; color:var(--white); }
.gallery-item__caption {
  position:absolute; bottom:0; left:0; right:0; padding:.75rem 1rem;
  background:linear-gradient(transparent,rgba(13,27,42,.8));
  color:var(--white); font-size:.8rem; font-weight:600;
  opacity:0; transition:var(--transition);
}
.gallery-item:hover .gallery-item__caption { opacity:1; }

/* Lightbox */
.lightbox {
  position:fixed; inset:0; z-index:9000;
  background:rgba(0,0,0,.92); display:none;
  align-items:center; justify-content:center; padding:2rem;
}
.lightbox.open { display:flex; }
.lightbox__img { max-width:90vw; max-height:85vh; object-fit:contain; border-radius:var(--radius-sm); }
.lightbox__close {
  position:absolute; top:1.25rem; right:1.5rem;
  font-size:2rem; color:var(--white); cursor:pointer;
  width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; background:rgba(255,255,255,.12);
  transition:var(--transition);
}
.lightbox__close:hover { background:var(--accent); color:var(--dark); }
.lightbox__prev,
.lightbox__next {
  position:absolute; top:50%; transform:translateY(-50%);
  font-size:1.5rem; color:var(--white); cursor:pointer;
  width:50px; height:50px; display:flex; align-items:center; justify-content:center;
  border-radius:50%; background:rgba(255,255,255,.12); transition:var(--transition);
}
.lightbox__prev { left:1.5rem; }
.lightbox__next { right:1.5rem; }
.lightbox__prev:hover,
.lightbox__next:hover { background:var(--accent); color:var(--dark); }

/* ── Footer ─────────────────────────────────────────────────── */
.footer { background:var(--dark); color:rgba(255,255,255,.65); padding:4.5rem 2rem 0; }
.footer__grid {
  max-width:1200px; margin:0 auto;
  display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3rem; padding-bottom:3rem;
}
.footer__brand { display:flex; flex-direction:column; gap:1rem; }
.footer__logo-row { display:flex; align-items:center; gap:12px; }
.footer__logo-row img { height:54px; width:auto; filter:brightness(0) invert(1); opacity:.88; }
.footer__school-name { font-size:.88rem; font-weight:800; color:var(--white); line-height:1.35; text-transform:uppercase; }
.footer__motto { font-style:italic; color:var(--accent); font-size:.875rem; }
.footer__desc { font-size:.85rem; line-height:1.75; color:rgba(255,255,255,.55); }
.footer__social { display:flex; gap:.75rem; margin-top:.25rem; }
.social-btn {
  width:38px; height:38px; border-radius:var(--radius-sm);
  background:rgba(255,255,255,.1); display:flex; align-items:center;
  justify-content:center; font-size:.85rem; font-weight:700;
  color:var(--white); transition:var(--transition);
}
.social-btn:hover { background:var(--accent); color:var(--dark); transform:translateY(-2px); }
.footer__col h4 {
  font-size:.78rem; font-weight:800; text-transform:uppercase;
  letter-spacing:.18em; color:var(--accent); margin-bottom:1.25rem;
}
.footer__links { display:flex; flex-direction:column; gap:.6rem; }
.footer__links a {
  font-size:.85rem; color:rgba(255,255,255,.58); transition:var(--transition);
  display:flex; align-items:center; gap:.4rem;
}
.footer__links a::before { content:'›'; color:var(--accent); font-size:1rem; transition:var(--transition); }
.footer__links a:hover { color:var(--white); padding-left:4px; }
.footer__bottom {
  max-width:1200px; margin:0 auto;
  padding:1.5rem 0; border-top:1px solid rgba(255,255,255,.09);
  display:flex; justify-content:space-between; align-items:center; font-size:.78rem;
}
.footer__bottom .accent { color:var(--accent); }

/* ── Scroll-reveal ──────────────────────────────────────────── */
.reveal {
  opacity:0; transform:translateY(28px);
  transition:opacity .65s ease, transform .65s ease;
}
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-delay-1 { transition-delay:.1s; }
.reveal-delay-2 { transition-delay:.2s; }
.reveal-delay-3 { transition-delay:.3s; }

/* ── Animations ─────────────────────────────────────────────── */
@keyframes fadeInDown {
  from { opacity:0; transform:translateY(-32px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes fadeInUp {
  from { opacity:0; transform:translateY(28px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes bounce {
  0%,100% { transform:translateX(-50%) translateY(0); }
  50%      { transform:translateX(-50%) translateY(-10px); }
}
@keyframes scroll-dot {
  0%   { top:6px; opacity:1; }
  100% { top:22px; opacity:0; }
}

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width:1024px) {
  .footer__grid { grid-template-columns:1fr 1fr; }
  .director-strip__grid { grid-template-columns:1fr 2fr; gap:2.5rem; }
}

@media (max-width:768px) {
  .nav__links {
    display:none; flex-direction:column;
    position:absolute; top:82px; left:0; right:0;
    background:rgba(13,27,42,.98);
    padding:1rem 2rem 2rem; gap:.2rem;
    border-bottom:2px solid var(--accent);
  }
  .nav__links.open { display:flex; }
  .nav__toggle { display:flex; }
  .two-col { grid-template-columns:1fr; gap:2.5rem; }
  .two-col--wide { grid-template-columns:1fr; }
  .img-stack__float { display:none; }
  .img-stack__badge { display:none; }
  .stats-bar__grid { grid-template-columns:repeat(2,1fr); }
  .director-strip__grid { grid-template-columns:1fr; text-align:center; }
  .gallery-grid { grid-template-columns:repeat(2,1fr); }
  .footer__grid { grid-template-columns:1fr 1fr; gap:2rem; }
  .footer__bottom { flex-direction:column; gap:.5rem; text-align:center; }
  .hero--full { min-height:90vh; }
}

@media (max-width:480px) {
  .hero__logo { width:90px; }
  .gallery-grid { grid-template-columns:1fr; }
  .footer__grid { grid-template-columns:1fr; }
}

/* ── Font Awesome icon polish ──────────────────────────────── */
/* Give standalone icon containers a primary-blue color */
.prog-card__icon          { color: var(--primary); }
.prog-card:hover .prog-card__icon { color: var(--accent); }

/* Value pill icon – keep compact with proper line-height */
.value-pill__icon i       { display:inline-block; line-height:1; }

/* Contact icons already styled in .contact-item__icon (color:primary) */

/* Foundation / Why / Skill card icons inherit page-local font-size */
.foundation-card__icon i,
.why-card__icon i         { display:inline-block; }

/* Leadership dot – white icon on primary circle */
.leadership-item__dot     { color: var(--white); }

/* Pillar dot – dark icon on accent circle */
.pillar__dot              { color: var(--dark); }

/* Subject card & club heading icons */
.subject-card h4 i,
.club-section h4 i        { margin-right:.35rem; color:var(--primary); }

/* Req-item icon sizing */
.req-item__icon           { font-size:1.1rem; color:var(--primary); }