/* =========================================================================
   Kardile Buro Healthcare Foundation — Yash Group of Institutes
   Warm redesign: Foundation + 3 Colleges (Paramedical · Nursing · Allied Health)
   ========================================================================= */

/* ---------- Design tokens ---------- */
:root{
  /* Foundation palette — warm maroon */
  --ink:          #1A0D08;
  --primary:      #7B2035;
  --primary-deep: #5C1626;
  --primary-lt:   #A03048;
  --gold:         #B07A18;
  --gold-lt:      #CC9A2E;

  /* College accent colors */
  --para:         #1B5F7A;   /* Paramedical — steel blue  */
  --para-deep:    #134A60;
  --para-lt:      #2879A0;
  --nurse:        #8B1E3F;   /* Nursing — wine red        */
  --nurse-deep:   #6A1530;
  --nurse-lt:     #A8294F;
  --allied:       #2B6040;   /* Allied Health — forest green */
  --allied-deep:  #1F4A30;
  --allied-lt:    #3A7A52;

  /* Warm backgrounds */
  --paper:        #FDF8F3;
  --paper-2:      #F5EDE0;
  --white:        #FFFFFF;
  --line:         #E8D8CC;
  --line-soft:    #EEE6DC;
  --muted:        #7A6860;
  --ok:           #2B6040;

  /* Typography */
  --display: "DM Serif Display", Georgia, "Times New Roman", serif;
  --body:    "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Scale */
  --container: 1180px;
  --radius:    16px;
  --radius-sm: 10px;
  --shadow-sm: 0 1px 3px rgba(26,13,8,.07), 0 2px 8px rgba(26,13,8,.06);
  --shadow-md: 0 8px 30px rgba(26,13,8,.12);
  --shadow-lg: 0 20px 60px rgba(26,13,8,.20);
  --ease:      cubic-bezier(.22,.61,.36,1);
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0; font-family:var(--body); color:var(--ink);
  background:var(--paper); line-height:1.65; font-size:16px;
  -webkit-font-smoothing:antialiased; overflow-x:hidden; overflow-wrap:break-word;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ margin:0; font-family:var(--display); font-weight:400; line-height:1.12; letter-spacing:-.01em; }
p{ margin:0 0 1rem; }
:focus-visible{ outline:3px solid var(--gold); outline-offset:3px; border-radius:4px; }

/* ---------- Layout helpers ---------- */
.container{ width:min(var(--container), 92vw); margin-inline:auto; }
.section{ padding:84px 0; }
.section--tight{ padding:56px 0; }
.bg-paper2{ background:var(--paper-2); }
.bg-ink{ background:var(--paper-2); color:var(--ink); }
.center{ text-align:center; }
.eyebrow{
  font-size:.74rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase;
  color:var(--primary); display:inline-flex; align-items:center; gap:.6rem; margin-bottom:.9rem;
}
.eyebrow::before{ content:""; width:26px; height:2px; background:var(--gold); display:inline-block; }
.eyebrow.center-mark{ justify-content:center; }
.bg-ink .eyebrow{ color:var(--primary); }

.h-xl{ font-size:clamp(2.4rem, 6vw, 4.2rem); }
.h-lg{ font-size:clamp(2rem, 4.4vw, 3rem); }
.h-md{ font-size:clamp(1.5rem, 3vw, 2.1rem); }
.lead{ font-size:1.12rem; color:var(--muted); max-width:60ch; }
.bg-ink .lead{ color:var(--muted); }
.muted{ color:var(--muted); }
.section-head{ max-width:64ch; margin-bottom:48px; }
.section-head.center{ margin-inline:auto; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.55rem; font-weight:600; font-size:.98rem;
  padding:.85rem 1.5rem; border-radius:999px; border:1.5px solid transparent;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s, color .25s, border-color .25s;
  white-space:nowrap;
}
.btn svg{ width:18px; height:18px; }
.btn--primary{ background:var(--primary); color:var(--white); box-shadow:var(--shadow-sm); }
.btn--primary:hover{ background:var(--primary-deep); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn--gold{ background:var(--gold); color:#1d0e00; }
.btn--gold:hover{ background:var(--gold-lt); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn--ghost{ background:transparent; color:var(--primary); border-color:var(--line); }
.btn--ghost:hover{ border-color:var(--primary); background:var(--white); transform:translateY(-2px); }
.btn--white{ background:var(--white); color:var(--primary-deep); }
.btn--white:hover{ transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn--wa{ background:#1FA855; color:#fff; }
.btn--wa:hover{ background:#178a45; transform:translateY(-2px); box-shadow:var(--shadow-md); }
/* College-specific buttons */
.btn--para{ background:var(--para); color:#fff; }
.btn--para:hover{ background:var(--para-deep); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn--nurse{ background:var(--nurse); color:#fff; }
.btn--nurse:hover{ background:var(--nurse-deep); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn--allied{ background:var(--allied); color:#fff; }
.btn--allied:hover{ background:var(--allied-deep); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn-row{ display:flex; flex-wrap:wrap; gap:.8rem; }

/* ---------- Top utility bar ---------- */
.topbar{
  background:var(--white); color:var(--muted); font-size:.82rem;
  border-bottom:1px solid var(--line-soft);
}
.topbar .container{ display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:8px 0; flex-wrap:wrap; }
.topbar a{ color:var(--muted); display:inline-flex; align-items:center; gap:.4rem; }
.topbar a:hover{ color:var(--primary); }
.topbar .topbar-left{ display:flex; gap:1.3rem; flex-wrap:wrap; }
.topbar .iso{ color:var(--primary); font-weight:600; letter-spacing:.04em; }
.topbar svg{ width:14px; height:14px; }
@media (max-width:640px){ .topbar .topbar-left{ gap:.9rem; } .topbar .hide-xs{ display:none; } }

/* ---------- Header / Nav ---------- */
.site-header{
  position:sticky; top:0; z-index:60; background:rgba(253,248,243,.92);
  backdrop-filter:saturate(160%) blur(12px); border-bottom:1px solid var(--line-soft);
  transition:box-shadow .3s, background .3s;
}
.site-header.scrolled{ box-shadow:var(--shadow-sm); background:rgba(253,248,243,.98); }
.nav{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; gap:1rem; }
.brand{ display:flex; align-items:center; gap:.7rem; }
.brand img{ width:46px; height:46px; }
.brand-text{ line-height:1.05; }
.brand-text strong{ font-family:var(--display); font-size:1.18rem; color:var(--ink); display:block; letter-spacing:0; }
.brand-text span{ font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); font-weight:600; }
.nav-links{ display:flex; align-items:center; gap:.3rem; }
.nav-links a{ padding:.55rem .8rem; border-radius:8px; font-weight:500; font-size:.95rem; color:#3D1A12; transition:color .2s, background .2s; }
.nav-links a:hover{ color:var(--primary); background:var(--paper-2); }
.nav-links a.active{ color:var(--primary); font-weight:600; }
.nav-cta{ display:flex; align-items:center; gap:.6rem; }
.nav-toggle{ display:none; background:none; border:0; padding:8px; color:var(--ink); }
.nav-toggle svg{ width:28px; height:28px; }
@media (max-width:980px){
  .nav-links, .nav-cta .btn--ghost{ display:none; }
  .nav-toggle{ display:inline-flex; }
}
/* mobile drawer */
.mobile-menu{
  position:fixed; inset:0 0 0 auto; width:min(82vw,360px); background:var(--white);
  z-index:90; transform:translateX(100%); transition:transform .35s var(--ease);
  padding:24px; display:flex; flex-direction:column; gap:.3rem; box-shadow:var(--shadow-lg);
  overflow-y:auto;
}
.mobile-menu.open{ transform:translateX(0); }
.mobile-menu a{ padding:.9rem .6rem; border-bottom:1px solid var(--line-soft); font-weight:500; }
.mobile-menu a.active{ color:var(--primary); }
.mobile-menu .btn{ margin-top:1rem; justify-content:center; }
.mobile-menu .menu-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem; }
.mobile-menu .menu-head button{ background:none; border:0; color:var(--ink); }
.mobile-menu .menu-head svg{ width:28px; height:28px; }
.scrim{ position:fixed; inset:0; background:rgba(26,13,8,.5); z-index:80; opacity:0; visibility:hidden; transition:opacity .3s; }
.scrim.show{ opacity:1; visibility:visible; }

/* ---------- Desktop nav courses dropdown ---------- */
.nav-dropdown{ position:relative; display:flex; align-items:center; }
/* invisible bridge fills the gap so hover doesn't drop when moving to the panel */
.nav-dropdown::after{ content:""; position:absolute; top:100%; left:-8px; right:-8px; height:10px; }
.nav-dropdown>a{ display:flex; align-items:center; gap:.22rem; }
.nav-dropdown .chev{ transition:transform .22s; flex-shrink:0; }
.nav-dropdown:hover .chev,
.nav-dropdown:focus-within .chev{ transform:rotate(180deg); }
.nav-dd-panel{
  position:absolute; top:calc(100% + 8px); left:50%; transform:translateX(-50%);
  background:var(--white); border:1px solid var(--line-soft); border-radius:14px;
  box-shadow:0 8px 32px rgba(61,26,18,.14); padding:1.2rem 1.1rem;
  display:none; grid-template-columns:1fr 1.4fr; gap:0;
  min-width:500px; z-index:10;
}
.nav-dropdown:hover .nav-dd-panel,
.nav-dropdown:focus-within .nav-dd-panel{ display:grid; }
.nav-dd-left{ display:flex; flex-direction:column; padding-right:1.1rem; border-right:1px solid var(--line-soft); }
.nav-dd-allied{ padding-left:1.1rem; }
.nav-dd-col{ display:flex; flex-direction:column; }
.nav-dd-label{
  display:block; font-size:.68rem; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--primary); padding-bottom:.4rem;
  margin-bottom:.3rem; border-bottom:1px solid var(--line-soft);
}
.nav-dd-panel a{
  font-size:.875rem; padding:.3rem .45rem; border-radius:6px;
  color:var(--ink); font-weight:500; display:block;
  transition:background .15s, color .15s;
}
.nav-dd-panel a:hover{ background:var(--paper-2); color:var(--primary); }
a.nav-dd-all{
  font-size:.8rem; font-weight:600; color:var(--primary);
  margin-top:.8rem; border-top:1px solid var(--line-soft);
  padding-top:.6rem; padding-bottom:.2rem;
}
a.nav-dd-all:hover{ color:var(--primary-deep); background:transparent; }
/* ---------- Mobile courses accordion ---------- */
.mob-courses{ border-bottom:1px solid var(--line-soft); }
.mob-courses summary{
  padding:.9rem .6rem; font-weight:500; cursor:pointer; list-style:none;
  display:flex; justify-content:space-between; align-items:center; color:var(--ink);
}
.mob-courses summary::-webkit-details-marker{ display:none; }
.mob-courses summary::after{
  content:""; width:16px; height:16px; flex-shrink:0;
  background:url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='%231A0D08' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .22s;
}
.mob-courses[open]>summary::after{ transform:rotate(180deg); }
.mob-courses summary.active{ color:var(--primary); }
.mob-courses-sub{ padding:.2rem 0 .6rem 1rem; display:flex; flex-direction:column; }
.mob-sub-label{
  font-size:.65rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--primary); padding:.65rem .45rem .2rem; display:block;
}
.mob-courses-sub a{
  padding:.45rem .45rem; font-size:.88rem; border-bottom:none;
  color:var(--ink); font-weight:500; border-radius:6px;
  transition:color .15s;
}
.mob-courses-sub a:hover{ color:var(--primary); background:transparent; }

/* ---------- Hero — light ---------- */
.hero{
  position:relative; color:var(--ink); overflow:hidden;
  background:var(--white);
}
.hero::before{
  content:""; position:absolute; inset:0;
  background:url("../images/hero.jpg") right center/cover no-repeat; opacity:.08; mix-blend-mode:multiply;
}
.hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(110deg, rgba(255,255,255,.98) 0%, rgba(253,248,243,.94) 55%, rgba(245,237,224,.60) 100%);
}
.hero .container{ position:relative; z-index:2; padding:96px 0 104px; }
.hero-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:48px; align-items:center; }
.hero-badge{
  display:inline-flex; align-items:center; gap:.55rem; background:rgba(123,32,53,.07);
  border:1px solid rgba(123,32,53,.18); padding:.45rem .9rem; border-radius:999px;
  font-size:.78rem; font-weight:600; letter-spacing:.08em; margin-bottom:1.4rem; color:var(--primary);
}
.hero-badge .dot{ width:8px; height:8px; border-radius:50%; background:var(--primary); box-shadow:0 0 0 4px rgba(123,32,53,.14); }
.hero h1{ font-size:clamp(2.6rem,5.2vw,4.4rem); color:var(--ink); margin-bottom:1.2rem; }
.hero h1 em{ font-style:normal; color:var(--primary); }
.hero p.lead{ color:var(--muted); max-width:50ch; margin-bottom:1.8rem; }
.hero .btn-row{ margin-bottom:2.2rem; }
.hero-trust{ display:flex; gap:1.8rem; flex-wrap:wrap; }
.hero-trust .n{ font-family:var(--display); font-size:1.9rem; color:var(--ink); line-height:1; }
.hero-trust .l{ font-size:.78rem; letter-spacing:.06em; color:var(--muted); text-transform:uppercase; margin-top:.35rem; }

/* Hero college pills */
.hero-colleges{ display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom:2rem; }
.hero-college-pill{
  display:inline-flex; align-items:center; gap:.45rem; padding:.5rem 1rem; border-radius:999px;
  font-size:.82rem; font-weight:600; border:1.5px solid var(--line);
  background:var(--white); color:var(--ink); transition:background .2s, border-color .2s;
}
.hero-college-pill:hover{ background:var(--paper-2); border-color:var(--primary-lt); }
.hero-college-pill .dot{ width:8px; height:8px; border-radius:50%; }
.hero-college-pill.para .dot{ background:var(--para); }
.hero-college-pill.nurse .dot{ background:var(--nurse); }
.hero-college-pill.allied .dot{ background:var(--allied); }

/* hero side card — credentials */
.cred-card{
  background:var(--white); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:26px; box-shadow:var(--shadow-md);
}
.cred-card h3{ font-family:var(--body); font-weight:700; font-size:.8rem; letter-spacing:.16em; text-transform:uppercase; color:var(--primary); margin-bottom:1.1rem; }
.cred-card ul{ display:grid; gap:.9rem; }
.cred-card li{ display:flex; gap:.8rem; align-items:flex-start; font-size:.92rem; color:var(--muted); }
.cred-card li svg{ width:20px; height:20px; flex:0 0 20px; color:var(--primary); margin-top:2px; }
.cred-card li b{ color:var(--ink); font-weight:700; display:block; font-size:.95rem; }
@media (max-width:900px){ .hero-grid{ grid-template-columns:1fr; gap:36px; } .hero .container{ padding:64px 0 72px; } }

/* ---------- Credentials seals strip ---------- */
.seals{ background:var(--white); border-bottom:1px solid var(--line-soft); }
.seals .container{ display:flex; gap:14px; flex-wrap:wrap; justify-content:center; padding:26px 0; }
.seal{
  display:flex; align-items:center; gap:.7rem; padding:.7rem 1.1rem; border:1px solid var(--line);
  border-radius:999px; background:var(--paper); font-size:.84rem; font-weight:600; color:var(--ink);
}
.seal .ring{
  width:30px; height:30px; border-radius:50%; display:grid; place-items:center; flex:0 0 30px;
  background:radial-gradient(circle at 30% 30%, var(--gold-lt), var(--gold)); color:#1d0e00;
}
.seal .ring svg{ width:16px; height:16px; }
.seal small{ display:block; font-weight:500; color:var(--muted); font-size:.72rem; }

/* ================================================
   THREE COLLEGES — Main showcase section
   ================================================ */
.colleges-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:28px;
}
@media (max-width:960px){ .colleges-grid{ grid-template-columns:1fr; max-width:540px; margin-inline:auto; } }

.college-card{
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-md); background:var(--white);
  display:flex; flex-direction:column;
  transition:transform .35s var(--ease), box-shadow .35s;
}
.college-card:hover{ transform:translateY(-7px); box-shadow:var(--shadow-lg); }

.college-card__banner{
  padding:30px 28px; color:#fff; position:relative; overflow:hidden;
}
.college-card__banner::after{
  content:""; position:absolute; inset:0; opacity:.12;
  background:repeating-linear-gradient(45deg, #fff 0, #fff 1px, transparent 1px, transparent 12px);
}
.college-card__banner .num{
  font-family:var(--display); font-size:4rem; line-height:1; color:rgba(255,255,255,.18);
  position:absolute; top:16px; right:20px; font-style:italic;
}
.college-card__banner .badge{
  font-size:.72rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  padding:.3rem .8rem; border-radius:999px; background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.3); display:inline-block; margin-bottom:1rem;
}
.college-card__banner h3{ font-size:1.45rem; color:#fff; margin-bottom:.5rem; position:relative; z-index:1; }
.college-card__banner p{ font-size:.9rem; color:rgba(255,255,255,.82); margin:0; max-width:30ch; position:relative; z-index:1; }
.college-card__banner .code{ font-size:.72rem; letter-spacing:.1em; color:rgba(255,255,255,.55); margin-top:.6rem; position:relative; z-index:1; }

.college-card--para  .college-card__banner{ background:linear-gradient(135deg, var(--para-deep), var(--para)); }
.college-card--nurse .college-card__banner{ background:linear-gradient(135deg, var(--nurse-deep), var(--nurse)); }
.college-card--allied .college-card__banner{ background:linear-gradient(135deg, var(--allied-deep), var(--allied)); }

.college-card__body{ padding:22px 28px; flex:1; }
.college-card__courses{
  display:grid; gap:.55rem; margin-bottom:1.2rem;
}
.college-card__courses li{
  display:flex; align-items:center; gap:.6rem; font-size:.9rem; color:#3D1A12;
}
.college-card__courses li::before{
  content:""; width:7px; height:7px; border-radius:50%; flex:0 0 7px;
}
.college-card--para  .college-card__courses li::before{ background:var(--para); }
.college-card--nurse .college-card__courses li::before{ background:var(--nurse); }
.college-card--allied .college-card__courses li::before{ background:var(--allied); }

.college-card__foot{
  padding:18px 28px; border-top:1px solid var(--line-soft);
  background:var(--paper); display:flex; gap:.7rem; flex-wrap:wrap; align-items:center;
}

/* Foundation banner */
.foundation-band{
  background:var(--paper-2); color:var(--ink); padding:20px 0;
  border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft);
}
.foundation-band .inner{
  display:flex; align-items:center; gap:2rem; flex-wrap:wrap; justify-content:space-between;
}
.foundation-band h4{ font-family:var(--body); font-weight:700; font-size:1rem; color:var(--ink); margin:0; }
.foundation-band p{ font-size:.88rem; color:var(--muted); margin:0; }
.foundation-band .pills{ display:flex; gap:.5rem; flex-wrap:wrap; }
.foundation-band .pill{
  padding:.3rem .8rem; border-radius:999px; font-size:.78rem; font-weight:600;
  background:rgba(123,32,53,.07); border:1px solid rgba(123,32,53,.18); color:var(--primary);
}

/* ---------- Cards / grids ---------- */
.grid{ display:grid; gap:24px; }
.grid-2{ grid-template-columns:repeat(2,1fr); }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:900px){ .grid-3,.grid-4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .grid-2,.grid-3,.grid-4{ grid-template-columns:1fr; } }

.card{
  background:var(--white); border:1px solid var(--line-soft); border-radius:var(--radius);
  padding:30px; box-shadow:var(--shadow-sm); transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
}
.card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--line); }
.card .ic{
  width:54px; height:54px; border-radius:14px; display:grid; place-items:center; margin-bottom:18px;
  background:linear-gradient(135deg, var(--primary), var(--primary-lt)); color:#fff;
}
.card .ic svg{ width:26px; height:26px; }
.card h3{ font-size:1.35rem; margin-bottom:.5rem; }
.card p{ color:var(--muted); font-size:.95rem; margin-bottom:0; }
.card .more{ margin-top:1rem; color:var(--primary); font-weight:600; font-size:.9rem; display:inline-flex; gap:.35rem; }
.card .more svg{ width:16px; height:16px; transition:transform .25s; }
.card:hover .more svg{ transform:translateX(4px); }

/* feature list with checks */
.checklist{ display:grid; gap:.75rem; }
.checklist li{ display:flex; gap:.7rem; align-items:flex-start; color:#3D1A12; }
.checklist li svg{ width:22px; height:22px; flex:0 0 22px; color:var(--primary); margin-top:1px; }

/* ---------- Stats / count-up ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
@media (max-width:760px){ .stats{ grid-template-columns:repeat(2,1fr); } }
.stat{
  text-align:center; padding:30px 18px; border-radius:var(--radius);
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16);
}
.stat .num{ font-family:var(--display); font-size:clamp(2.2rem,4vw,3rem); color:#fff; line-height:1; }
.stat .num span{ color:var(--gold-lt); }
.stat .lbl{ margin-top:.6rem; font-size:.82rem; letter-spacing:.05em; text-transform:uppercase; color:#D4B5AC; }

/* ---------- Course table ---------- */
.course-block{ background:var(--white); border:1px solid var(--line-soft); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); }
.course-block__head{ padding:26px 28px; border-bottom:1px solid var(--line-soft); display:flex; flex-wrap:wrap; gap:14px 24px; align-items:flex-start; justify-content:space-between; }
.course-block__head h3{ font-size:1.6rem; margin-bottom:.35rem; }
.course-block__head .code{ font-size:.82rem; color:var(--muted); font-weight:600; letter-spacing:.04em; }
.tags{ display:flex; gap:.5rem; flex-wrap:wrap; }
.tag{ font-size:.74rem; font-weight:600; padding:.35rem .7rem; border-radius:999px; background:var(--paper-2); color:var(--primary-deep); border:1px solid var(--line); }
.tag--ok{ background:#E0F2E9; color:var(--ok); border-color:#B8DEC8; }
.tag--gold{ background:#FDF0DC; color:#7D5410; border-color:#EDD8A2; }
/* College tags */
.tag--para{ background:#E0EFF6; color:var(--para-deep); border-color:#B0D4E8; }
.tag--nurse{ background:#F6E0E7; color:var(--nurse-deep); border-color:#E2B0C0; }
.tag--allied{ background:#E0F0E8; color:var(--allied-deep); border-color:#B0D4C0; }
/* keep brass as gold alias for legacy markup */
.tag--brass{ background:#FDF0DC; color:#7D5410; border-color:#EDD8A2; }
.ctable{ width:100%; border-collapse:collapse; }
.ctable th, .ctable td{ text-align:left; padding:14px 28px; border-bottom:1px solid var(--line-soft); font-size:.95rem; }
.ctable th{ font-family:var(--body); font-weight:700; font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); background:var(--paper); }
.ctable tr:last-child td{ border-bottom:0; }
.ctable td:first-child{ font-weight:600; color:var(--ink); }
.ctable td .dur{ display:inline-flex; align-items:center; gap:.4rem; color:var(--primary); font-weight:600; }
.ctable tbody tr{ transition:background .2s; }
.ctable tbody tr:hover{ background:var(--paper); }
.course-foot{ padding:18px 28px; background:var(--paper); font-size:.9rem; color:var(--muted); display:flex; flex-wrap:wrap; gap:10px 20px; align-items:center; justify-content:space-between; }
.course-foot b{ color:var(--ink); }
@media (max-width:560px){
  .ctable th, .ctable td{ padding:12px 16px; }
  .course-block__head{ padding:20px; }
  .course-foot{ padding:16px 20px; }
}

/* College section header */
.college-section-head{
  padding:22px 28px; border-radius:var(--radius) var(--radius) 0 0; color:#fff;
  display:flex; align-items:center; gap:14px; margin-bottom:0;
}
.college-section-head .icon{ width:44px; height:44px; border-radius:12px; background:rgba(255,255,255,.18); display:grid; place-items:center; flex:0 0 44px; }
.college-section-head .icon svg{ width:24px; height:24px; }
.college-section-head h3{ font-size:1.4rem; color:#fff; margin-bottom:.15rem; }
.college-section-head p{ font-size:.85rem; color:rgba(255,255,255,.75); margin:0; }
.college-section-head--para{ background:linear-gradient(110deg, var(--para-deep), var(--para)); }
.college-section-head--nurse{ background:linear-gradient(110deg, var(--nurse-deep), var(--nurse)); }
.college-section-head--allied{ background:linear-gradient(110deg, var(--allied-deep), var(--allied)); }
.college-group{ border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); margin-bottom:36px; }
.college-group .course-block{ border-radius:0; box-shadow:none; }

/* ---------- Gallery ---------- */
.filters{ display:flex; gap:.6rem; flex-wrap:wrap; justify-content:center; margin-bottom:34px; }
.filter{
  padding:.55rem 1.1rem; border-radius:999px; border:1.5px solid var(--line); background:var(--white);
  font-weight:600; font-size:.9rem; color:#3D1A12; transition:all .25s;
}
.filter:hover{ border-color:var(--primary); color:var(--primary); }
.filter.active{ background:var(--primary); color:#fff; border-color:var(--primary); }
.gallery-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
@media (max-width:820px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .gallery-grid{ grid-template-columns:1fr; } }
.gitem{
  position:relative; border-radius:var(--radius); overflow:hidden; cursor:pointer; aspect-ratio:4/3;
  border:1px solid var(--line-soft); background:var(--paper-2); transition:transform .3s var(--ease), box-shadow .3s;
}
.gitem img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.gitem:hover{ box-shadow:var(--shadow-md); }
.gitem:hover img{ transform:scale(1.06); }
.gitem .cap{
  position:absolute; inset:auto 0 0 0; padding:16px; color:#fff; font-weight:600; font-size:.95rem;
  background:linear-gradient(transparent, rgba(92,22,38,.88)); display:flex; align-items:center; gap:.5rem;
}
.gitem .cap svg{ width:18px; height:18px; opacity:.85; }
.gitem.hide{ display:none; }

/* lightbox */
.lightbox{ position:fixed; inset:0; background:rgba(26,5,8,.95); z-index:120; display:none; align-items:center; justify-content:center; padding:24px; }
.lightbox.open{ display:flex; }
.lightbox img{ max-width:92vw; max-height:82vh; border-radius:12px; box-shadow:var(--shadow-lg); }
.lightbox .lb-cap{ position:absolute; bottom:26px; left:0; right:0; text-align:center; color:#EAD5CC; font-weight:600; }
.lb-btn{ position:absolute; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.25); color:#fff; width:50px; height:50px; border-radius:50%; display:grid; place-items:center; transition:background .2s; }
.lb-btn:hover{ background:rgba(255,255,255,.25); }
.lb-btn svg{ width:24px; height:24px; }
.lb-close{ top:22px; right:22px; }
.lb-prev{ left:22px; top:50%; transform:translateY(-50%); }
.lb-next{ right:22px; top:50%; transform:translateY(-50%); }
@media (max-width:600px){ .lb-prev{ left:10px; } .lb-next{ right:10px; } .lb-btn{ width:44px; height:44px; } }

/* ---------- Split / media sections ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:54px; align-items:center; }
.split.reverse .split-media{ order:2; }
@media (max-width:880px){ .split{ grid-template-columns:1fr; gap:34px; } .split.reverse .split-media{ order:0; } }
.split-media{ position:relative; }
.split-media img{ border-radius:var(--radius); box-shadow:var(--shadow-md); width:100%; }
.split-media .float-stat{
  position:absolute; bottom:-22px; right:-14px; background:var(--white); padding:18px 22px; border-radius:14px;
  box-shadow:var(--shadow-lg); border:1px solid var(--line-soft); text-align:center;
}
.split-media .float-stat .n{ font-family:var(--display); font-size:1.9rem; color:var(--primary); line-height:1; }
.split-media .float-stat .l{ font-size:.74rem; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-top:.3rem; }
@media (max-width:880px){ .split-media .float-stat{ right:14px; } }

/* values mini-cards */
.value{ display:flex; gap:1rem; align-items:flex-start; }
.value .vic{ width:46px; height:46px; flex:0 0 46px; border-radius:12px; background:var(--paper-2); color:var(--primary); display:grid; place-items:center; }
.value .vic svg{ width:24px; height:24px; }
.value h4{ font-family:var(--display); font-size:1.2rem; margin-bottom:.3rem; }
.value p{ color:var(--muted); font-size:.92rem; margin:0; }

/* ---------- People / staff ---------- */
.person{ background:var(--white); border:1px solid var(--line-soft); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .3s var(--ease), box-shadow .3s; }
.person:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }
.person .avatar{ aspect-ratio:1/1; display:grid; place-items:center; background:linear-gradient(140deg, var(--primary), var(--primary-deep)); color:#fff; }
.person .avatar span{ font-family:var(--display); font-size:3rem; }
.person .pbody{ padding:20px 22px; }
.person h4{ font-family:var(--display); font-size:1.3rem; margin-bottom:.2rem; }
.person .role{ color:var(--primary); font-weight:600; font-size:.88rem; }
.person p{ color:var(--muted); font-size:.9rem; margin:.7rem 0 0; }

/* ---------- Forms ---------- */
.form-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:48px; }
@media (max-width:900px){ .form-wrap{ grid-template-columns:1fr; gap:34px; } }
.form-card{ background:var(--white); border:1px solid var(--line-soft); border-radius:var(--radius); padding:34px; box-shadow:var(--shadow-md); }
.field{ margin-bottom:18px; }
.field label{ display:block; font-weight:600; font-size:.88rem; margin-bottom:.5rem; color:#3D1A12; }
.field label .req{ color:var(--primary); }
.field input, .field select, .field textarea{
  width:100%; padding:.85rem 1rem; border:1.5px solid var(--line); border-radius:var(--radius-sm);
  font-family:inherit; font-size:.98rem; background:var(--paper); color:var(--ink); transition:border-color .2s, box-shadow .2s;
}
.field textarea{ min-height:120px; resize:vertical; }
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--primary); box-shadow:0 0 0 3px rgba(123,32,53,.10); background:#fff; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:520px){ .field-row{ grid-template-columns:1fr; } }
.form-note{ font-size:.82rem; color:var(--muted); margin-top:.4rem; }
.form-msg{ display:none; padding:14px 16px; border-radius:var(--radius-sm); font-size:.92rem; font-weight:500; margin-bottom:16px; }
.form-msg.show{ display:block; }
.form-msg.ok{ background:#E0F2E9; color:var(--ok); border:1px solid #B8DEC8; }

/* contact info list */
.contact-info{ display:grid; gap:22px; }
.cinfo{ display:flex; gap:1rem; align-items:flex-start; }
.cinfo .cic{ width:50px; height:50px; flex:0 0 50px; border-radius:14px; background:linear-gradient(135deg,var(--primary),var(--primary-lt)); color:#fff; display:grid; place-items:center; }
.cinfo .cic svg{ width:24px; height:24px; }
.cinfo h4{ font-family:var(--body); font-weight:700; font-size:1rem; margin-bottom:.25rem; }
.cinfo p, .cinfo a{ color:var(--muted); font-size:.95rem; margin:0; }
.cinfo a:hover{ color:var(--primary); }

/* map */
.map-frame{ border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-sm); }
.map-frame iframe{ display:block; width:100%; height:380px; border:0; }

/* ---------- Breadcrumb / page hero ---------- */
.page-hero{ position:relative; background:var(--paper-2); color:var(--ink); overflow:hidden; border-bottom:1px solid var(--line-soft); }
.page-hero::before{ content:""; position:absolute; inset:0; background:url("../images/hero.jpg") center/cover; opacity:.05; mix-blend-mode:multiply; }
.page-hero .container{ position:relative; z-index:2; padding:70px 0 64px; }
.page-hero h1{ font-size:clamp(2.2rem,5vw,3.6rem); color:var(--ink); margin-bottom:.6rem; }
.page-hero p{ color:var(--muted); max-width:62ch; margin:0; }
.crumb{ display:flex; gap:.5rem; align-items:center; font-size:.85rem; color:var(--muted); margin-bottom:1.1rem; flex-wrap:wrap; }
.crumb a:hover{ color:var(--primary); }
.crumb svg{ width:14px; height:14px; opacity:.7; }
.crumb .here{ color:var(--primary); font-weight:600; }

/* ---------- CTA band ---------- */
.cta-band{ position:relative; color:var(--ink); overflow:hidden; border-radius:0; background:var(--paper-2); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); }
.cta-band::before{ content:""; position:absolute; inset:0; background:url("../images/cta.jpg") center/cover; opacity:.05; }
.cta-band::after{ content:""; position:absolute; inset:0; background:rgba(245,237,224,.94); }
.cta-band .inner{ position:relative; z-index:2; text-align:center; padding:72px 0; }
.cta-band h2{ color:var(--ink); margin-bottom:1rem; }
.cta-band p{ color:var(--muted); max-width:54ch; margin:0 auto 1.8rem; }
.cta-band .btn-row{ justify-content:center; }

/* ---------- Footer ---------- */
.footer{ background:var(--paper-2); color:var(--muted); padding:64px 0 28px; border-top:1px solid var(--line-soft); }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; }
@media (max-width:900px){ .footer-grid{ grid-template-columns:1fr 1fr; gap:32px; } }
@media (max-width:520px){ .footer-grid{ grid-template-columns:1fr; } }
.footer .brand-text strong{ color:var(--ink); }
.footer .brand-text span{ color:var(--muted); }
.footer p{ font-size:.9rem; line-height:1.7; }
.footer h5{ font-family:var(--body); font-weight:700; font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink); margin-bottom:1.1rem; }
.footer ul li{ margin-bottom:.7rem; font-size:.9rem; }
.footer ul a{ transition:color .2s; }
.footer ul a:hover{ color:var(--primary); }
.fcontact li{ display:flex; gap:.7rem; align-items:flex-start; }
.fcontact svg{ width:16px; height:16px; flex:0 0 16px; margin-top:3px; color:var(--primary); }
.footer-bottom{
  margin-top:44px; padding-top:22px; border-top:1px solid var(--line-soft);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.82rem;
}
.footer-bottom a{ transition:color .2s; }
.footer-bottom a:hover{ color:var(--primary); }

/* ---------- Floating action buttons ---------- */
.fab-stack{ position:fixed; bottom:28px; right:28px; z-index:50; display:flex; flex-direction:column-reverse; gap:10px; }
.fab{
  width:58px; height:58px; border-radius:50%; display:grid; place-items:center;
  box-shadow:var(--shadow-md); transition:transform .3s var(--ease), box-shadow .3s; position:relative;
}
.fab:hover{ transform:translateY(-3px) scale(1.08); box-shadow:var(--shadow-lg); }
.fab svg{ width:26px; height:26px; }
.fab--wa{ background:#25D366; color:#fff; }
.pulse{
  position:absolute; inset:-4px; border-radius:50%;
  background:rgba(37,211,102,.4); animation:pulse 2s ease-out infinite;
}
.fab .tip{
  position:absolute; right:66px; top:50%; transform:translateY(-50%);
  background:rgba(26,13,8,.85); color:#fff; padding:.35rem .75rem; border-radius:8px;
  font-size:.8rem; font-weight:600; white-space:nowrap;
  opacity:0; pointer-events:none; transition:opacity .2s;
}
.fab:hover .tip{ opacity:1; }
@keyframes pulse{ 0%{ transform:scale(1); opacity:.6; } 100%{ transform:scale(1.7); opacity:0; } }

/* ---------- Reveal animation ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.in{ opacity:1; transform:translateY(0); }
.d1{ transition-delay:.12s; }
.d2{ transition-delay:.22s; }
.d3{ transition-delay:.32s; }

/* ---------- Centres (legacy 3-centre cards) ---------- */
.centres{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media (max-width:960px){ .centres{ grid-template-columns:1fr; max-width:540px; margin-inline:auto; } }
.centre-card{ background:var(--white); border:1px solid var(--line-soft); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; transition:transform .3s var(--ease), box-shadow .3s; }
.centre-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }
.centre-card__top{ padding:24px 24px 18px; border-bottom:1px solid var(--line-soft); background:var(--paper-2); }
.centre-card__top h3{ font-size:1.28rem; margin-top:.5rem; }
.centre-badge{ font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--primary); background:rgba(123,32,53,.08); padding:.25rem .6rem; border-radius:4px; }
.centre-card__body{ padding:18px 24px; flex:1; }
.centre-row{ display:flex; gap:.7rem; align-items:flex-start; font-size:.9rem; color:var(--muted); margin-bottom:.9rem; }
.centre-row svg{ width:18px; height:18px; flex:0 0 18px; color:var(--primary); margin-top:2px; }
.centre-meta{ font-size:.88rem; color:var(--muted); margin:0; }
.centre-card__foot{ padding:16px 24px; border-top:1px solid var(--line-soft); display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; background:var(--paper); }
.centre-call{ display:inline-flex; align-items:center; gap:.45rem; font-weight:600; font-size:.9rem; color:var(--primary); transition:color .2s; }
.centre-call:hover{ color:var(--primary-deep); }
.centre-call svg{ width:18px; height:18px; }

/* ---------- Testimonial quote ---------- */
.quote-mark{ font-family:var(--display); font-size:4rem; line-height:.5; color:var(--gold-lt); opacity:.6; margin-bottom:.5rem; display:block; }

/* ---------- About timeline / milestones ---------- */
.timeline{ display:grid; gap:28px; }
.milestone{ display:flex; gap:1.4rem; align-items:flex-start; }
.milestone .year{ font-family:var(--display); font-size:1.6rem; color:var(--primary); min-width:72px; line-height:1; }
.milestone .line{ width:2px; background:var(--line); flex:0 0 2px; margin-top:8px; align-self:stretch; }
.milestone p{ color:var(--muted); margin:0; font-size:.95rem; }
.milestone h4{ margin-bottom:.3rem; }

/* ---------- Section accents ---------- */
.section-stripe{
  background:linear-gradient(110deg, var(--paper) 0%, var(--paper-2) 100%);
  border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft);
}

/* ---------- Callout / info box ---------- */
.callout{
  background:var(--paper-2); border:1px solid var(--line); border-left:4px solid var(--gold);
  border-radius:var(--radius-sm); padding:16px 20px; max-width:72ch;
}
.callout p{ margin:0; color:#3D1A12; font-size:.95rem; }

/* prose links */
.prose a{ color:var(--primary); text-decoration:underline; text-underline-offset:3px; }

/* FAB call button */
.fab--call{ background:var(--primary); color:#fff; }
.fab--ig{ background:linear-gradient(135deg,#F58529 0%,#DD2A7B 55%,#8134AF 100%); color:#fff; }

/* ---------- Responsive utilities ---------- */
@media (max-width:640px){
  .section{ padding:56px 0; }
  .section--tight{ padding:38px 0; }
  .btn{ font-size:.9rem; padding:.75rem 1.2rem; }
}

/* =========================================================================
   MEDICAL BLUE / TEAL THEME  +  app features (announcements, results, admin)
   Appended last so it governs the final look.
   ========================================================================= */
:root{
  --ink:#0C2233;
  --primary:#0284C7; --primary-deep:#075985; --primary-lt:#38BDF8;
  --gold:#0E7490;  --gold-lt:#22B8D9;                 /* secondary = cyan */
  --para:#0284C7;  --para-deep:#075985;  --para-lt:#38BDF8;     /* sky blue */
  --nurse:#0891B2; --nurse-deep:#0E7490; --nurse-lt:#22D3EE;    /* cyan */
  --allied:#0EA5E9;--allied-deep:#0369A1;--allied-lt:#7DD3FC;   /* light sky */
  --paper:#F2F8FE; --paper-2:#E3F1FC; --white:#FFFFFF;
  --line:#CFE5F7; --line-soft:#E4F1FC; --muted:#51677B; --ok:#0E7490;
  --shadow-sm:0 1px 3px rgba(3,105,161,.06), 0 2px 10px rgba(3,105,161,.07);
  --shadow-md:0 10px 34px rgba(3,105,161,.13);
  --shadow-lg:0 24px 64px rgba(3,105,161,.20);
}
body{ background:
  radial-gradient(120% 44% at 50% -8%, rgba(56,189,248,.12), transparent 60%),
  var(--paper); }
.btn--primary{ background:linear-gradient(135deg,#38BDF8,#0284C7); box-shadow:0 8px 22px rgba(2,132,199,.30); }
.btn--primary:hover{ background:linear-gradient(135deg,#0EA5E9,#075985); }
.btn--gold{ background:linear-gradient(135deg,#0891B2,#0E7490); color:#fff; box-shadow:0 8px 22px rgba(8,145,178,.30); }
.btn--gold:hover{ background:linear-gradient(135deg,#0E7490,#155E75); color:#fff; }
.hero h1 em{ color:var(--primary); }
.seal .ring{ background:radial-gradient(circle at 30% 30%, var(--primary-lt), var(--primary)); color:#fff; }
.seal:nth-child(2) .ring{ background:radial-gradient(circle at 30% 30%, var(--gold-lt), var(--gold)); }
.seal:nth-child(4) .ring{ background:radial-gradient(circle at 30% 30%, var(--allied-lt), var(--allied)); }
/* re-tone college tags to blue/teal family */
.tag--para{ background:#E0F0FB; color:var(--para-deep); border-color:#BBDCF3; }
.tag--nurse{ background:#DEF5FA; color:#0E5E72; border-color:#AEE4EF; }
.tag--allied{ background:#E3F4FE; color:var(--allied-deep); border-color:#BBE2F9; }
.tag--gold,.tag--brass{ background:#DEF5FA; color:#0E5E72; border-color:#AEE4EF; }
.card .ic{ background:linear-gradient(135deg,var(--primary-lt),var(--primary)); box-shadow:0 10px 24px rgba(10,77,140,.22); }
.footer{ background:#0B1E33; color:#A9BED4; border-top:0; position:relative; }
.footer::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg,var(--primary),var(--gold) 55%,var(--allied)); }
.footer .brand-text strong, .footer h5{ color:#fff; }
.footer .brand-text span, .footer p, .footer ul a, .footer ul li{ color:#A9BED4; }
.footer a:hover, .footer ul a:hover{ color:#fff; }
.footer .fcontact svg{ color:var(--gold-lt); }
.footer-bottom{ border-top-color:rgba(255,255,255,.1); }

/* ---- section heading accent ---- */
.section-head.center h2{ position:relative; }
.section-head.center h2::after{ content:""; display:block; width:60px; height:4px; margin:16px auto 0;
  border-radius:999px; background:linear-gradient(90deg,var(--primary),var(--gold)); }

/* =========================================================================
   ANNOUNCEMENTS / NOTICE BOARD
   ========================================================================= */
.notice-board{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
@media (max-width:900px){ .notice-board{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .notice-board{ grid-template-columns:1fr; } }
.notice-card{ position:relative; background:var(--white); border:1px solid var(--line-soft);
  border-left:4px solid var(--primary); border-radius:var(--radius-sm); padding:22px 22px 20px;
  box-shadow:var(--shadow-sm); transition:transform .3s var(--ease), box-shadow .3s; }
.notice-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }
.notice-card.pinned{ border-left-color:var(--gold); background:linear-gradient(180deg,#EFF9FF,#fff); }
.notice-date{ display:inline-flex; align-items:center; gap:.4rem; font-size:.76rem; font-weight:700;
  letter-spacing:.04em; color:var(--primary); background:var(--paper-2); padding:.28rem .7rem;
  border-radius:999px; margin-bottom:.7rem; }
.notice-card.pinned .notice-date{ color:#0E5E72; background:#DEF5FA; }
.notice-pin{ position:absolute; top:16px; right:16px; font-size:.66rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.1em; color:var(--gold); }
.notice-card h3{ font-family:var(--body); font-weight:700; font-size:1.06rem; margin:0 0 .4rem; color:var(--ink); }
.notice-card p{ color:var(--muted); font-size:.92rem; margin:0; white-space:pre-wrap; }
.notice-img{ display:block; width:100%; max-height:240px; object-fit:cover; border-radius:var(--radius-sm);
  margin:0 0 .9rem; border:1px solid var(--line-soft); }
/* admin announcements table thumbnail */
.ann-thumb{ width:46px; height:46px; object-fit:cover; border-radius:6px; vertical-align:middle; margin-right:10px; }

/* ---------- Success Stories (placed students) ---------- */
.stories{ display:block; }
.stories-row{ margin-bottom:24px; }
.stories-row:last-child{ margin-bottom:0; }
.stories-track{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.smq-clone{ display:none; }            /* duplicate cards used only by the mobile marquee */
.story{ position:relative; background:var(--white); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:24px; box-shadow:var(--shadow-sm);
  transition:transform .25s var(--ease), box-shadow .25s; }
.story:hover{ transform:translateY(-5px); box-shadow:var(--shadow-md); }
.story-top{ display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.story-top > div:last-child{ flex:1; min-width:0; padding-right:42px; }
.story-avatar{ width:64px; height:64px; flex:0 0 64px; border-radius:50%; overflow:hidden;
  border:2px solid var(--primary-lt); background:var(--paper-2); }
.story-avatar img{ width:100%; height:100%; object-fit:cover; object-position:center top; display:block; }
.story-avatar--initials{ display:grid; place-items:center; color:#fff; font-family:var(--display);
  font-size:1.25rem; border-color:transparent;
  background:linear-gradient(135deg,var(--primary-lt),var(--primary)); }
.story h4{ font-size:1.05rem; margin:0 0 .15rem; color:var(--ink); line-height:1.2; }
.story-role{ font-size:.84rem; font-weight:600; color:var(--primary); }
.story-co{ display:flex; align-items:flex-start; gap:.45rem; font-size:.9rem; color:var(--muted); margin:0; }
.story-co svg{ width:16px; height:16px; flex:0 0 16px; margin-top:2px; color:var(--primary-lt); }
.story-badge{ position:absolute; top:16px; right:16px; font-size:.64rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.08em; color:#0E5E72; background:#DEF5FA;
  padding:.22rem .55rem; border-radius:999px; }
/* Mobile: the two rows become opposing auto-scrolling marquees */
@media (max-width:760px){
  .stories[data-marquee] .stories-row{ overflow:hidden; margin-bottom:16px;
    -webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
            mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); }
  .stories[data-marquee] .stories-track{ display:flex; gap:0; width:max-content;
    animation:smq-left 30s linear infinite; will-change:transform; }
  .stories[data-marquee] .stories-row[data-dir="right"] .stories-track{ animation-name:smq-right; }
  .stories[data-marquee] .stories-track .story{ flex:0 0 250px; width:250px; margin-right:14px; }
  .stories[data-marquee] .smq-clone{ display:block; }
  .stories[data-marquee] .stories-track:hover,
  .stories[data-marquee] .stories-track:active{ animation-play-state:paused; }
}
@keyframes smq-left{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@keyframes smq-right{ from{ transform:translateX(-50%); } to{ transform:translateX(0); } }
@media (prefers-reduced-motion:reduce){
  .stories[data-marquee] .stories-track{ animation:none; }
  .stories[data-marquee] .smq-clone{ display:none; }
  .stories[data-marquee] .stories-row{ overflow-x:auto; }
}
.notice-empty{ grid-column:1/-1; text-align:center; color:var(--muted); padding:30px; border:1px dashed var(--line); border-radius:var(--radius-sm); }

/* =========================================================================
   RESULTS PORTAL
   ========================================================================= */
.result-list{ display:grid; gap:14px; }
.result-row{ display:flex; align-items:center; gap:1rem; justify-content:space-between; flex-wrap:wrap;
  background:var(--white); border:1px solid var(--line-soft); border-radius:var(--radius-sm);
  padding:18px 22px; box-shadow:var(--shadow-sm); transition:box-shadow .25s, transform .25s; }
.result-row:hover{ box-shadow:var(--shadow-md); transform:translateY(-2px); }
.result-row .r-main{ display:flex; align-items:center; gap:1rem; min-width:0; }
.result-row .r-ic{ width:44px; height:44px; flex:0 0 44px; border-radius:11px; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--primary-lt),var(--primary)); color:#fff; }
.result-row .r-ic svg{ width:22px; height:22px; }
.result-row h3{ font-family:var(--body); font-weight:700; font-size:1.02rem; margin:0; color:var(--ink); }
.result-row .r-date{ font-size:.82rem; color:var(--muted); }
.result-search{ display:flex; gap:.6rem; margin-bottom:22px; max-width:420px; }
.result-search input{ flex:1; padding:.7rem 1rem; border:1.5px solid var(--line); border-radius:999px;
  font-family:inherit; font-size:.95rem; background:var(--white); }
.result-search input:focus{ outline:none; border-color:var(--primary); box-shadow:0 0 0 3px rgba(10,77,140,.12); }

/* =========================================================================
   ADMISSION PROCESS TIMELINE
   ========================================================================= */
.process{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
@media (max-width:760px){ .process{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:460px){ .process{ grid-template-columns:1fr; } }
.process .step{ position:relative; background:var(--white); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:26px 22px; box-shadow:var(--shadow-sm); }
.process .step .n{ width:46px; height:46px; border-radius:50%; display:grid; place-items:center;
  font-family:var(--display); font-size:1.3rem; color:#fff; margin-bottom:14px;
  background:linear-gradient(135deg,var(--primary-lt),var(--primary)); }
.process .step h4{ font-family:var(--body); font-weight:700; font-size:1.05rem; margin:0 0 .3rem; }
.process .step p{ color:var(--muted); font-size:.9rem; margin:0; }

/* =========================================================================
   ADMIN PANEL
   ========================================================================= */
.admin-body{ background:var(--paper-2); min-height:100vh; }
.admin-login{ min-height:100vh; display:grid; place-items:center; padding:24px; }
.admin-card{ width:100%; max-width:400px; background:var(--white); border:1px solid var(--line-soft);
  border-radius:var(--radius); box-shadow:var(--shadow-lg); padding:34px; }
.admin-card .brand{ justify-content:center; margin-bottom:1.4rem; }
.admin-topbar{ background:var(--primary-deep); color:#fff; }
.admin-topbar .container{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; gap:1rem; }
.admin-topbar .brand-text strong{ color:#fff; } .admin-topbar .brand-text span{ color:#BBD6EE; }
/* "View site" ghost button on the dark topbar: subtle translucent hover (not white-on-white) */
.admin-topbar .btn--ghost{ background:transparent; color:#fff; border-color:rgba(255,255,255,.4); }
.admin-topbar .btn--ghost:hover{ background:rgba(255,255,255,.16); border-color:#fff; color:#fff; }
.admin-tabs{ display:flex; gap:.4rem; flex-wrap:wrap; padding:16px 0; border-bottom:1px solid var(--line); }
.admin-tab{ padding:.55rem 1rem; border-radius:999px; border:1.5px solid var(--line); background:var(--white);
  font-weight:600; font-size:.9rem; color:var(--muted); }
.admin-tab.active{ background:var(--primary); color:#fff; border-color:var(--primary); }
.admin-panel{ display:none; padding:26px 0; }
.admin-panel.active{ display:block; }
.admin-panel-head{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:18px; }
.admin-panel-head h2{ font-size:1.5rem; }
.atable{ width:100%; border-collapse:collapse; background:var(--white); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm); }
.atable th,.atable td{ text-align:left; padding:12px 16px; border-bottom:1px solid var(--line-soft); font-size:.9rem; vertical-align:top; }
.atable th{ background:var(--paper); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.atable tr:last-child td{ border-bottom:0; }
.atable .row-actions{ display:flex; gap:.4rem; flex-wrap:wrap; }
.atable-wrap{ overflow-x:auto; }
.btn-sm{ padding:.4rem .8rem; font-size:.8rem; border-radius:8px; border:1.5px solid var(--line); background:var(--white); font-weight:600; color:var(--primary); }
.btn-sm:hover{ background:var(--paper-2); }
.btn-sm.danger{ color:#C0392B; border-color:#E8C4BF; } .btn-sm.danger:hover{ background:#FBEAE8; }
.admin-form{ background:var(--white); border:1px solid var(--line-soft); border-radius:var(--radius); padding:24px; box-shadow:var(--shadow-sm); margin-bottom:24px; }
.admin-form .field-row3{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media (max-width:680px){ .admin-form .field-row3{ grid-template-columns:1fr; } }
.admin-note{ background:#FFF8E6; border:1px solid #F3E2B3; color:#7A5B12; padding:14px 16px; border-radius:var(--radius-sm); font-size:.9rem; margin-bottom:20px; }
.admin-gallery{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; }
.admin-gallery figure{ position:relative; margin:0; border-radius:var(--radius-sm); overflow:hidden; border:1px solid var(--line-soft); }
.admin-gallery img{ width:100%; height:120px; object-fit:cover; }
.admin-gallery button{ position:absolute; top:6px; right:6px; background:rgba(192,57,43,.92); color:#fff; border:0; border-radius:7px; padding:.25rem .5rem; font-size:.72rem; font-weight:700; }
.pill-count{ background:var(--gold); color:#fff; border-radius:999px; padding:.1rem .55rem; font-size:.8rem; font-weight:700; margin-left:.4rem; }

/* ---------- In the News / press coverage ---------- */
.news-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
@media (max-width:820px){ .news-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .news-grid{ grid-template-columns:1fr; } }
.news-card{ position:relative; display:block; background:var(--white); border:1px solid var(--line-soft);
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease), box-shadow .3s; }
.news-card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-md); }
.news-card img{ width:100%; height:360px; object-fit:cover; object-position:top center; display:block;
  transition:transform .5s var(--ease); }
.news-card:hover img{ transform:scale(1.04); }
.news-cap{ display:flex; align-items:center; gap:.45rem; padding:13px 16px; font-weight:600; font-size:.9rem;
  color:var(--primary-deep); border-top:1px solid var(--line-soft); }
.news-cap svg{ width:16px; height:16px; color:var(--gold); }

/* gallery caption + filter active in the blue theme */
.gitem .cap{ background:linear-gradient(transparent, rgba(8,40,80,.88)); }
.filter.active{ background:var(--primary); border-color:var(--primary); }
.lightbox{ background:rgba(6,22,44,.95); }

/* =========================================================================
   MOBILE REFINEMENT — tighter, professional sizing on phones / all devices
   ========================================================================= */
html{ overflow-x:hidden; }
img, iframe, video, table{ max-width:100%; }
@media (max-width:640px){
  .section{ padding:48px 0; }
  .section--tight{ padding:34px 0; }
  .hero .container{ padding:44px 0 52px; }
  .hero h1{ font-size:clamp(1.95rem, 8vw, 2.6rem); margin-bottom:1rem; }
  .hero p.lead{ font-size:1rem; margin-bottom:1.4rem; }
  .page-hero .container{ padding:40px 0 34px; }
  .h-lg{ font-size:clamp(1.6rem, 6.4vw, 2rem); }
  .h-md{ font-size:clamp(1.35rem, 5.4vw, 1.7rem); }
  .lead{ font-size:1rem; }
  .section-head{ margin-bottom:34px; }
  .cta-band .inner{ padding:48px 0; }
  .college-card__banner{ padding:24px 22px; }
  .college-card__banner .num{ font-size:3rem; }
  .college-card__banner h3{ font-size:1.25rem; }
  .card{ padding:24px; }
  .news-card img{ height:300px; }
  .footer{ padding:48px 0 24px; }
  .ctable th, .ctable td{ padding:11px 14px; font-size:.9rem; }
}
@media (max-width:400px){
  body{ font-size:15px; }
  .btn{ font-size:.86rem; padding:.72rem 1.05rem; }
  .topbar{ font-size:.72rem; }
  .seal{ font-size:.78rem; padding:.55rem .85rem; }
  .college-section-head h3{ font-size:1.2rem; }
  .brand-text strong{ font-size:1.06rem; }
}

/* =========================================================================
   HERO — vibrant sky-blue gradient background + slide-in text (premium)
   ========================================================================= */
.hero--photo{
  background:
    radial-gradient(120% 120% at 88% 6%, rgba(125,211,252,.45) 0%, rgba(56,189,248,0) 52%),
    radial-gradient(95% 130% at -5% 105%, rgba(3,105,161,.60) 0%, rgba(3,105,161,0) 55%),
    linear-gradient(135deg, #075985 0%, #0284C7 46%, #0369A1 100%);
}
/* soft decorative glow (replaces the old photo layer) */
.hero--photo::before{
  opacity:1; mix-blend-mode:normal; transform:none; animation:none;
  background:radial-gradient(42% 55% at 80% 80%, rgba(125,211,252,.20), transparent 72%);
}
/* no dark scrim needed on the solid-blue hero */
.hero--photo::after{ display:none; }
.hero--photo h1{ text-shadow:0 2px 18px rgba(0,22,48,.32); }
.hero--photo p.lead{ text-shadow:0 1px 10px rgba(0,22,48,.28); }

/* text + chips recoloured for the dark photo */
.hero--photo h1{ color:#fff; text-shadow:0 2px 26px rgba(0,14,34,.38); }
.hero--photo h1 em{ color:#7DD3FC; }
.hero--photo p.lead{ color:rgba(255,255,255,.92); }
.hero--photo .hero-badge{
  background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.34); color:#fff;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
}
.hero--photo .hero-badge .dot{ background:#7DD3FC; box-shadow:0 0 0 4px rgba(125,211,252,.28); }
.hero--photo .hero-trust{ border-top:1px solid rgba(255,255,255,.18); padding-top:1.5rem; }
.hero--photo .hero-trust .n{ color:#fff; }
.hero--photo .hero-trust .l{ color:rgba(255,255,255,.78); }

/* college-name pills — frosted glass */
.hero--photo .hero-college-pill{
  background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.30); color:#fff;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
}
.hero--photo .hero-college-pill:hover{ background:rgba(255,255,255,.22); border-color:rgba(255,255,255,.55); }

/* credentials card — frosted glass over the photo */
.hero--photo .cred-card{
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.22);
  -webkit-backdrop-filter:blur(15px); backdrop-filter:blur(15px);
  box-shadow:0 24px 64px rgba(0,16,38,.36);
}
.hero--photo .cred-card h3{ color:#7DD3FC; }
.hero--photo .cred-card li{ color:rgba(255,255,255,.86); }
.hero--photo .cred-card li b{ color:#fff; }
.hero--photo .cred-card li svg{ color:#7DD3FC; }

/* slide-in entrance — text from the left, card from the right.
   Longer, gently-eased and well-spaced so it reads as smooth, not snappy. */
@keyframes heroInLeft{ from{ opacity:0; transform:translateX(-54px); } to{ opacity:1; transform:translateX(0); } }
@keyframes heroInRight{ from{ opacity:0; transform:translateX(54px); } to{ opacity:1; transform:translateX(0); } }
@keyframes heroInUp{ from{ opacity:0; transform:translateY(30px); } to{ opacity:1; transform:translateY(0); } }
.hero--photo .hero-badge{ animation:heroInLeft 1.1s cubic-bezier(.16,.7,.3,1) .15s both; }
.hero--photo h1{ animation:heroInLeft 1.2s cubic-bezier(.16,.7,.3,1) .35s both; }
.hero--photo p.lead{ animation:heroInLeft 1.2s cubic-bezier(.16,.7,.3,1) .60s both; }
.hero--photo .hero-colleges{ animation:heroInUp 1.1s cubic-bezier(.16,.7,.3,1) .85s both; }
.hero--photo .btn-row{ animation:heroInUp 1.1s cubic-bezier(.16,.7,.3,1) 1.05s both; }
.hero--photo .hero-trust{ animation:heroInUp 1.1s cubic-bezier(.16,.7,.3,1) 1.25s both; }
.hero--photo .hero-card-in{ animation:heroInRight 1.3s cubic-bezier(.16,.7,.3,1) .75s both; }

/* phones: keep the photo readable with a more even, deeper scrim */
@media (max-width:640px){
  .hero--photo .hero-trust{ gap:1.2rem; }
  .hero--photo .hero-trust .n{ font-size:1.6rem; }
}

/* respect reduced-motion: no slide-ins, no zoom */
@media (prefers-reduced-motion: reduce){
  .hero--photo::before{ animation:none; transform:none; }
  .hero--photo .hero-badge,
  .hero--photo h1,
  .hero--photo p.lead,
  .hero--photo .hero-colleges,
  .hero--photo .btn-row,
  .hero--photo .hero-trust,
  .hero--photo .hero-card-in{ animation:none; }
}

/* =========================================================================
   FOUNDERS — leadership cards on the Faculty page
   ========================================================================= */
.founders{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:50px; }
.founder{
  display:flex; flex-direction:column;
  background:var(--white); border:1px solid var(--line-soft);
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-md);
  transition:transform .25s ease, box-shadow .25s ease;
}
.founder:hover{ transform:translateY(-5px); box-shadow:var(--shadow-lg); }
.founder-photo{ background:var(--paper-2); line-height:0; }
.founder-photo img{ width:100%; height:auto; display:block; }
.founder-body{ padding:22px 24px; display:flex; flex-direction:column; flex:1; }
.founder-body .role{
  align-self:flex-start; display:inline-block; font-size:.7rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase; color:#fff; padding:.3rem .7rem;
  border-radius:999px; background:linear-gradient(135deg,var(--primary-lt),var(--primary)); margin-bottom:.55rem;
}
.founder-body h4{ font-family:var(--display); font-size:1.3rem; color:var(--ink); margin:0 0 .7rem; line-height:1.15; }
.founder-body blockquote{
  margin:0; position:relative; padding-left:1.3rem; color:var(--muted);
  font-style:italic; font-size:.92rem; line-height:1.6;
}
.founder-body blockquote::before{
  content:"\201C"; position:absolute; left:-2px; top:-.4rem;
  font-family:var(--display); font-size:2.4rem; line-height:1; color:var(--primary-lt); opacity:.6;
}
.founder-body .founder-note{ margin:0; color:var(--muted); font-size:.92rem; line-height:1.6; }
@media (max-width:900px){ .founders{ grid-template-columns:1fr 1fr; max-width:760px; margin-inline:auto; } }
@media (max-width:560px){ .founders{ grid-template-columns:1fr; max-width:420px; } }

/* =========================================================================
   JOIN COMMUNITY band + footer social icons
   ========================================================================= */
.join-band{ position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(125deg,#075985 0%,#0284C7 52%,#0891B2 100%); }
.join-band::before{ content:""; position:absolute; inset:0;
  background:radial-gradient(60% 130% at 92% -10%, rgba(125,211,252,.30), transparent 60%); }
.join-inner{ position:relative; z-index:1; display:grid; grid-template-columns:1.35fr .85fr;
  gap:40px; align-items:center; padding:56px 0; }
.join-text h2{ color:#fff; margin-bottom:.6rem; }
.join-text p{ color:rgba(255,255,255,.92); max-width:56ch; margin:0; }
.join-tag{ display:inline-flex; align-items:center; gap:.5rem; background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.32); padding:.42rem .9rem; border-radius:999px;
  font-size:.78rem; font-weight:700; letter-spacing:.05em; margin-bottom:1.1rem; }
.join-tag .dot{ width:8px; height:8px; border-radius:50%; background:#FDE68A;
  box-shadow:0 0 0 4px rgba(253,230,138,.3); }
.join-actions{ display:flex; flex-direction:column; gap:.8rem; }
.join-actions .btn{ justify-content:center; }
.btn--ig{ background:linear-gradient(135deg,#F58529 0%,#DD2A7B 55%,#8134AF 100%); color:#fff;
  box-shadow:0 8px 22px rgba(221,42,123,.32); }
.btn--ig:hover{ filter:brightness(1.08); color:#fff; }
@media (max-width:820px){
  .join-inner{ grid-template-columns:1fr; padding:46px 0; gap:26px; }
  .join-actions{ flex-direction:row; flex-wrap:wrap; }
  .join-actions .btn{ flex:1 1 220px; }
}

/* footer social icons (injected by main.js) */
.social-row{ display:flex; gap:.6rem; margin-top:1.1rem; }
.social-row a{ width:40px; height:40px; display:grid; place-items:center; border-radius:11px;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); color:#fff;
  transition:background .2s, transform .2s, border-color .2s; }
.social-row a:hover{ transform:translateY(-2px); }
.social-row a svg{ width:20px; height:20px; }
.social-row .ig:hover{ background:linear-gradient(135deg,#F58529,#DD2A7B 55%,#8134AF); border-color:transparent; }
.social-row .wa:hover{ background:#25D366; border-color:transparent; }