/* ==================================================================
   NAIIT v53 — "Aura" premium design layer (public website only)
   ------------------------------------------------------------------
   • Pure CSS on top of style.css + naiit-premium-ui.css + naiit-v51.css.
   • No class names, IDs, forms, links or PHP logic are changed.
   • Loaded BEFORE the admin's saved styles (Style Editor / Visual
     Builder), so anything the admin sets still wins.
   • To switch the new look off: delete this one file.
   ================================================================== */

:root{
  /* brand palette — taken from the NAIIT logo */
  --a-midnight:#0B1736;      /* deep navy: hero, footer, dark bands */
  --a-midnight-2:#13224A;
  --a-blue:#2453D6;          /* logo blue: links, primary actions */
  --a-blue-deep:#173A9E;
  --a-leaf:#17944A;          /* logo green: admission / enquire */
  --a-leaf-deep:#0E7239;
  --a-sun:#F5B301;           /* logo sunburst: highlights */
  --a-sun-soft:#FFF4D2;
  --a-cloud:#F4F7FC;         /* page background */
  --a-mist:#E8EEF8;
  --a-line:#DCE4F1;
  --a-ink:#0F1C3A;
  --a-ink-2:#4A5873;
  --a-white:#FFFFFF;

  --a-display:'Bricolage Grotesque','Figtree','Noto Sans Devanagari',system-ui,sans-serif;
  --a-body:'Figtree','Noto Sans Devanagari',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;

  --a-r-lg:24px; --a-r:18px; --a-r-sm:12px;
  --a-shadow:0 1px 2px rgba(15,28,58,.06),0 12px 32px -12px rgba(15,28,58,.18);
  --a-shadow-lg:0 2px 4px rgba(15,28,58,.06),0 28px 60px -20px rgba(15,28,58,.32);
  --a-ease:cubic-bezier(.2,.7,.2,1);

  /* re-point the old tokens so every older rule picks up the new look */
  --ink:var(--a-ink); --ink-soft:var(--a-ink-2);
  --paper:var(--a-cloud); --paper-deep:var(--a-mist);
  --card:#fff; --line:var(--a-line);
  --blue:var(--a-blue); --blue-deep:var(--a-blue-deep);
  --green:var(--a-leaf); --green-deep:var(--a-leaf-deep);
  --gold:var(--a-sun); --gold-deep:#D99A00;
  --serif:var(--a-display); --sans:var(--a-body);
  --shadow:var(--a-shadow); --shadow-lg:var(--a-shadow-lg);
  --radius:var(--a-r); --radius-sm:var(--a-r-sm);
  --naiit-ink:var(--a-ink); --naiit-paper:var(--a-cloud); --naiit-green:var(--a-leaf);
  --naiit-green-dark:var(--a-leaf-deep); --naiit-gold:var(--a-sun); --naiit-blue:var(--a-blue);
  --naiit-muted:var(--a-ink-2); --naiit-border:var(--a-line);
}

/* ---------- Base ---------- */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--a-body) !important;
  color:var(--a-ink);
  background:var(--a-cloud) !important;
  background-attachment:scroll !important;
  font-size:16px; line-height:1.65;
}
h1,h2,h3,h4,h5,h6{font-family:var(--a-display) !important;color:var(--a-ink);letter-spacing:-.02em;font-weight:700}
p{color:var(--a-ink-2)}
::selection{background:var(--a-sun);color:var(--a-ink)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:3px solid var(--a-sun) !important;outline-offset:2px !important;box-shadow:none !important}

/* small labels above headings: sentence case pill with a sun dot */
.eyebrow{
  display:inline-flex !important;align-items:center;gap:8px;
  text-transform:none !important;letter-spacing:0 !important;
  font-family:var(--a-body) !important;font-size:13.5px !important;font-weight:600 !important;
  color:var(--a-blue-deep) !important;background:#fff;border:1px solid var(--a-line);
  padding:5px 13px 5px 10px !important;border-radius:999px;margin-bottom:14px !important;
}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--a-sun);box-shadow:0 0 0 3px rgba(245,179,1,.22);flex:none}

.section-head h2,.section-head h1{font-size:clamp(28px,3.6vw,44px) !important;line-height:1.1 !important;font-weight:800 !important}
.section-head p{font-size:17px;max-width:62ch}

/* ---------- Buttons ---------- */
.btn{
  font-family:var(--a-body) !important;font-weight:700 !important;letter-spacing:0 !important;
  border-radius:999px !important;min-height:48px;padding:12px 24px !important;
  transition:transform .25s var(--a-ease),box-shadow .25s var(--a-ease),background-color .2s,color .2s !important;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn-gold{background:var(--a-sun) !important;color:var(--a-ink) !important;border-color:var(--a-sun) !important;
  box-shadow:0 10px 26px -8px rgba(245,179,1,.65) !important}
.btn-gold:hover{background:#FFC21A !important;box-shadow:0 16px 34px -10px rgba(245,179,1,.75) !important}
.btn-blue{background:var(--a-blue) !important;color:#fff !important;border-color:var(--a-blue) !important;
  box-shadow:0 10px 26px -10px rgba(36,83,214,.7) !important}
.btn-blue:hover{background:var(--a-blue-deep) !important}
.btn-line{background:rgba(255,255,255,.06) !important;color:#fff !important;border:1.5px solid rgba(255,255,255,.38) !important;
  backdrop-filter:blur(6px);box-shadow:none !important}
.btn-line:hover{background:rgba(255,255,255,.14) !important;border-color:#fff !important}

/* ---------- Top bar + header ---------- */
.topbar{background:var(--a-midnight) !important;color:rgba(255,255,255,.82) !important;border:0 !important}
.topbar .ticker{font-size:13px;font-weight:500;letter-spacing:.01em}

header.site{
  background:rgba(255,255,255,.88) !important;
  -webkit-backdrop-filter:saturate(160%) blur(14px);backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid rgba(15,28,58,.07) !important;box-shadow:0 1px 0 rgba(255,255,255,.6) inset !important;
}
header.site .brand img{border-radius:50%;box-shadow:0 0 0 3px #fff,0 6px 18px -6px rgba(15,28,58,.35)}
header.site .brand .word{font-family:var(--a-display) !important;font-weight:800 !important;letter-spacing:-.01em;color:var(--a-ink) !important}
header.site .brand .word span{font-family:var(--a-body) !important;font-weight:500 !important;color:var(--a-ink-2) !important;letter-spacing:0 !important}

header.site .brand{flex:none;margin-right:auto}
header.site .wrap{gap:14px !important}
.header-cta .btn,.header-contact{white-space:nowrap}
@media (min-width:701px){
  /* two-tier header: brand + contact + CTA on top, full menu in its own row */
  header.site .wrap{flex-wrap:wrap !important;padding-top:10px !important;padding-bottom:0 !important;row-gap:6px !important}
  nav.main{order:9;flex:1 1 100% !important;justify-content:flex-start;gap:2px !important;
    border-top:1px solid rgba(15,28,58,.07);padding:6px 0 !important;margin:0 !important;flex-wrap:wrap}
  nav.main a{padding:7px 8px !important}
}
nav.main a{
  font-family:var(--a-body) !important;font-size:13.5px !important;font-weight:600 !important;
  color:var(--a-ink-2) !important;border-bottom:0 !important;border-radius:10px;
  padding:7px 9px !important;position:relative;line-height:1.3;
}
nav.main a:hover{color:var(--a-ink) !important;background:var(--a-mist)}
nav.main a.active{color:var(--a-blue-deep) !important;background:rgba(36,83,214,.08)}
nav.main a.active::after{content:"";position:absolute;left:12px;right:12px;bottom:3px;height:2px;border-radius:2px;background:var(--a-sun)}
nav.main a[href="/admission-form.php"]{color:var(--a-leaf-deep) !important}
.nav-dd-menu{border-radius:14px !important;border:1px solid var(--a-line) !important;box-shadow:var(--a-shadow-lg) !important;padding:6px !important;background:#fff !important}
.nav-dd-menu a{border-radius:9px}

.header-contact{border-radius:999px !important;background:#fff !important;border:1px solid var(--a-line) !important;color:var(--a-ink) !important;font-weight:700 !important}
.header-contact svg{color:var(--a-blue)}
.header-cta .btn,.header-enquire-animated{
  background:var(--a-leaf) !important;color:#fff !important;border-color:var(--a-leaf) !important;
  box-shadow:0 10px 24px -10px rgba(23,148,74,.8) !important;animation:none !important;min-height:44px}
.header-cta .btn:hover{background:var(--a-leaf-deep) !important}
.navtoggle{border-radius:12px !important;border:1px solid var(--a-line) !important;background:#fff !important;color:var(--a-ink) !important;width:44px;height:44px}

/* ---------- Hero slider: the "aura" ---------- */
.slider{background:var(--a-midnight) !important;isolation:isolate}
.slider .slide .bgwrap{background:var(--a-midnight) !important}
.slider .slide .bgwrap svg rect:first-child{fill:var(--a-midnight)}
.slider .scrim,.slider .slide .scrim{
  display:block !important;opacity:1 !important;pointer-events:none;
  background:
    radial-gradient(520px 420px at 12% 100%,rgba(245,179,1,.30),transparent 70%),
    linear-gradient(90deg,rgba(11,23,54,.92) 0%,rgba(11,23,54,.70) 42%,rgba(11,23,54,.15) 75%,rgba(11,23,54,0) 100%) !important;
}
/* concentric rings — echo the ring of the NAIIT logo */
.slider .slide .scrim::before,.slider .slide .scrim::after{
  content:"";position:absolute;border-radius:50%;pointer-events:none;
  top:50%;right:-6%;transform:translateY(-50%);
}
.slider .slide .scrim::before{
  width:min(78vh,640px);aspect-ratio:1;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 0 0 46px rgba(255,255,255,.025),0 0 0 47px rgba(255,255,255,.07),0 0 0 110px rgba(255,255,255,.015),0 0 0 111px rgba(255,255,255,.05);
}
.slider .slide .scrim::after{
  width:min(60vh,500px);aspect-ratio:1;right:calc(-6% + min(9vh,70px));
  border:1.5px dashed rgba(245,179,1,.45);
  animation:a-spin 80s linear infinite;
}
@keyframes a-spin{to{transform:translateY(-50%) rotate(360deg)}}

.slider .slide .content{position:relative;z-index:2}
.slider .content .eyebrow,.slide .eyebrow{
  background:rgba(255,255,255,.08) !important;border-color:rgba(255,255,255,.18) !important;color:#fff !important;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.slide h1,.slide h2,.slider .content h1,.slider .content h2{
  color:#fff !important;font-weight:800 !important;
  font-size:clamp(34px,4.6vw,60px) !important;line-height:1.02 !important;letter-spacing:-.035em !important;
  text-wrap:balance;margin:6px 0 16px !important}
.slide p,.slider .content p{color:rgba(232,238,250,.86) !important;font-size:17.5px !important;line-height:1.6 !important;text-align:left !important}

/* one orchestrated entrance each time a slide becomes active */
.slide.active .content > *{animation:a-rise .8s var(--a-ease) both}
.slide.active .content > *:nth-child(2){animation-delay:.08s}
.slide.active .content > *:nth-child(3){animation-delay:.16s}
.slide.active .content > *:nth-child(4){animation-delay:.24s}
@keyframes a-rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

.slide-arrow{
  width:48px !important;height:48px !important;border-radius:50% !important;
  background:rgba(255,255,255,.08) !important;border:1px solid rgba(255,255,255,.22) !important;color:#fff !important;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:24px !important;z-index:5 !important}
.slide-arrow:hover{background:var(--a-sun) !important;color:var(--a-ink) !important;border-color:var(--a-sun) !important}
.slider .dots{z-index:5 !important}
.slider .dots .dot{width:10px !important;height:10px !important;border-radius:999px !important;background:rgba(255,255,255,.35) !important;border:0 !important;transition:width .35s var(--a-ease),background .3s !important}
.slider .dots .dot.active{width:34px !important;background:var(--a-sun) !important}

/* ---------- Trust strip: a floating panel over the hero edge ---------- */
.trust-strip{background:transparent !important;position:relative;z-index:6;margin-top:-56px;padding:0 16px}
.trust-strip .wrap{
  background:#fff;border:1px solid var(--a-line);border-radius:var(--a-r-lg);
  box-shadow:var(--a-shadow-lg);padding:22px 12px !important;gap:0 !important;max-width:1180px}
.trust-strip .wrap > div{color:var(--a-ink-2) !important;font-size:13px !important;padding:4px 14px;border-left:1px solid var(--a-line)}
.trust-strip .wrap > div:first-child{border-left:0}
.trust-strip b{font-family:var(--a-display) !important;color:var(--a-ink) !important;font-size:24px !important;font-weight:800;letter-spacing:-.02em}

/* recently joined marquee */
.marquee-wrap{background:transparent !important;border:0 !important;padding:26px 0 6px !important}
.mchip{background:#fff !important;border:1px solid var(--a-line) !important;border-radius:999px !important;box-shadow:none !important}
.mchip .initials{background:var(--a-mist) !important;color:var(--a-blue-deep) !important;font-weight:700}
.mchip b{font-family:var(--a-body) !important;color:var(--a-ink) !important}

/* ---------- Sections ---------- */
.about,.why,.courses,.success,.testimonials-section,.admission,.contact,.alt-bg{
  padding-top:clamp(56px,7vw,100px) !important;padding-bottom:clamp(56px,7vw,100px) !important}
.about{background:transparent !important}
.why{background:#fff !important;border-top:1px solid var(--a-line);border-bottom:1px solid var(--a-line)}
.courses{background:transparent !important}
.success{background:var(--a-midnight) !important;position:relative;overflow:hidden}
.success::before{content:"";position:absolute;left:-160px;bottom:-220px;width:560px;height:560px;border-radius:50%;
  background:radial-gradient(circle,rgba(245,179,1,.18),transparent 65%);pointer-events:none}
.success .wrap{position:relative}
.success .section-head h2,.success h3,.success .student-status-head h3{color:#fff !important}
.success .section-head p,.success p,.success .empty-note{color:rgba(232,238,250,.72) !important}
.success .eyebrow{background:rgba(255,255,255,.08) !important;border-color:rgba(255,255,255,.18) !important;color:#fff !important}
.alt-bg{background:#fff !important}

/* director card */
.director-card{
  background:var(--a-midnight) !important;color:#fff !important;border:0 !important;border-radius:var(--a-r-lg) !important;
  box-shadow:var(--a-shadow-lg) !important;position:relative;overflow:hidden;padding:clamp(28px,4vw,44px) !important}
.director-card::after{content:"";position:absolute;width:320px;height:320px;right:-120px;bottom:-140px;border-radius:50%;
  background:radial-gradient(circle,rgba(245,179,1,.35),transparent 65%);pointer-events:none}
.director-card p{color:rgba(232,238,250,.92) !important;font-size:19px !important;line-height:1.55 !important;font-style:normal !important;position:relative;z-index:1}
.director-card .quote-mark{color:var(--a-sun) !important;font-family:var(--a-display) !important;opacity:1 !important}
.director-card .who b{color:#fff !important}
.director-card .who span{color:rgba(232,238,250,.65) !important}
.about-copy h2{font-size:clamp(26px,3.2vw,40px) !important;line-height:1.12 !important;font-weight:800 !important}
.stat-row .s{background:#fff !important;border:1px solid var(--a-line) !important;border-radius:var(--a-r-sm) !important;box-shadow:none !important;border-top:3px solid var(--a-sun) !important}
.stat-row .s b{font-family:var(--a-display) !important;color:var(--a-ink) !important;font-weight:800}

/* why cards: quiet, icon tile, lift on hover */
.why-card{
  background:var(--a-cloud) !important;border:1px solid transparent !important;border-radius:var(--a-r) !important;
  box-shadow:none !important;padding:26px 22px !important;
  transition:transform .3s var(--a-ease),background-color .3s,border-color .3s,box-shadow .3s var(--a-ease) !important}
.why-card:hover{background:#fff !important;border-color:var(--a-line) !important;box-shadow:var(--a-shadow) !important;transform:translateY(-4px) !important}
.why-card .ic{width:52px !important;height:52px !important;padding:11px;border-radius:14px;background:#fff;border:1px solid var(--a-line);margin-bottom:16px !important;stroke:var(--a-blue)}
.why-card .ic *{stroke:var(--a-blue)}
.why-card .ic circle[fill]{fill:var(--a-blue)}
.why-card h4{font-size:18px !important;font-weight:700 !important;margin-bottom:8px !important}
.why-card p{font-size:15px !important;line-height:1.6 !important}

/* ---------- Course cards ---------- */
.course-card{
  border-radius:var(--a-r-lg) !important;border:1px solid var(--a-line) !important;background:#fff !important;
  box-shadow:0 1px 2px rgba(15,28,58,.05) !important;overflow:hidden;
  transition:transform .35s var(--a-ease),box-shadow .35s var(--a-ease),border-color .3s !important}
.course-card:hover{transform:translateY(-6px) !important;box-shadow:var(--a-shadow-lg) !important;border-color:rgba(36,83,214,.25) !important}
.course-card .course-thumb{background:var(--a-mist) !important;position:relative}
.course-card .course-thumb .cimg{background:var(--a-mist) !important}
.course-card .course-thumb .cph{font-family:var(--a-display) !important;font-weight:800 !important;color:#fff !important;letter-spacing:-.02em}
.course-card .course-thumb img{transition:transform .6s var(--a-ease) !important}
.course-card:hover .course-thumb img{transform:scale(1.03) !important}
.course-card .ribbon{background:var(--a-sun) !important;color:var(--a-ink) !important;font-size:12px !important;border-radius:999px !important;font-weight:700 !important;box-shadow:0 6px 16px -6px rgba(0,0,0,.4) !important}
.course-card h3{font-size:19px !important;line-height:1.25 !important;font-weight:700 !important;color:var(--a-ink) !important}
.course-card .meta{color:var(--a-leaf-deep) !important;font-weight:600 !important}
.course-card ul li::before{color:var(--a-leaf) !important}
.course-cta-buttons a{border-radius:12px !important;font-weight:700 !important;min-height:42px;transition:transform .2s var(--a-ease),background-color .2s,box-shadow .2s !important}
.course-cta-buttons a:hover{transform:translateY(-1px)}
.course-details-btn{background:#fff !important;color:var(--a-blue-deep) !important;border:1.5px solid rgba(36,83,214,.35) !important}
.course-details-btn:hover{background:rgba(36,83,214,.07) !important}
.course-enquire-btn{background:var(--a-leaf) !important;color:#fff !important;border:1.5px solid var(--a-leaf) !important}
.course-enquire-btn:hover{background:var(--a-leaf-deep) !important}
.course-call-btn{background:var(--a-mist) !important;color:var(--a-ink) !important;border:1.5px solid transparent !important}

/* course filter (courses page) */
.filter-btn{border-radius:999px !important;border:1px solid var(--a-line) !important;background:#fff !important;color:var(--a-ink-2) !important;font-weight:600 !important}
.filter-btn.active,.filter-btn:hover{background:var(--a-midnight) !important;color:#fff !important;border-color:var(--a-midnight) !important}

/* digital marketing band */
.dm-strip{
  background:var(--a-midnight) !important;border-radius:var(--a-r-lg) !important;border:0 !important;
  position:relative;overflow:hidden;box-shadow:var(--a-shadow-lg) !important}
.dm-strip::before{content:"";position:absolute;left:-120px;top:-160px;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle,rgba(36,83,214,.55),transparent 65%);pointer-events:none}
.dm-strip > *{position:relative}
.dm-strip h3{color:#fff !important;font-size:clamp(22px,2.6vw,30px) !important}
.dm-strip p{color:rgba(232,238,250,.8) !important}
.dm-card{background:rgba(255,255,255,.06) !important;border:1px solid rgba(255,255,255,.14) !important;border-radius:var(--a-r) !important;color:#fff !important;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.dm-card b{font-family:var(--a-display) !important;color:#fff !important}
.dm-card .dur{color:var(--a-sun) !important;text-transform:none !important;letter-spacing:0 !important;font-weight:600}
.dm-card .new{color:var(--a-sun) !important;font-family:var(--a-display) !important;font-weight:800}
.dm-card .old{color:rgba(255,255,255,.5) !important}
.dm-card li{color:rgba(232,238,250,.8) !important}

/* students */
.stu{border-radius:var(--a-r) !important;transition:transform .3s var(--a-ease),box-shadow .3s,border-color .3s !important}
.stu:hover{transform:translateY(-3px) !important}
.success .stu{background:rgba(255,255,255,.05) !important;border:1px solid rgba(255,255,255,.12) !important}
.success .stu b{color:#fff !important}
.success .stu:hover{border-color:rgba(245,179,1,.5) !important}
.stu .fallback{background:linear-gradient(140deg,var(--a-blue),var(--a-midnight)) !important;color:#fff !important;font-family:var(--a-display) !important}
.review-cta{border-radius:var(--a-r-lg) !important;background:rgba(255,255,255,.06) !important;border:1px solid rgba(255,255,255,.14) !important}
.review-cta p,.review-cta b,.review-cta span{color:#fff !important}

/* testimonials */
.testimonials-section{background:transparent !important}
.testimonial-card{background:#fff !important;border:1px solid var(--a-line) !important;border-radius:var(--a-r-lg) !important;box-shadow:var(--a-shadow) !important}
.testimonial-stars,.rt-stars{color:var(--a-sun) !important}
.testimonial-photo.testimonial-initials{background:linear-gradient(140deg,var(--a-blue),var(--a-midnight)) !important;color:#fff !important}

/* ---------- Admission band (dark) + forms ---------- */
.admission{background:var(--a-midnight) !important;position:relative;overflow:hidden}
.admission::before{content:"";position:absolute;right:-200px;top:-200px;width:620px;height:620px;border-radius:50%;
  border:1px solid rgba(255,255,255,.08);box-shadow:0 0 0 60px rgba(255,255,255,.02),0 0 0 61px rgba(255,255,255,.06);pointer-events:none}
.admission .wrap{position:relative}
.admission-copy h2{color:#fff !important;font-size:clamp(28px,3.6vw,44px) !important;font-weight:800 !important}
.admission-copy p,.admission-copy .step p{color:rgba(232,238,250,.75) !important}
.admission-copy b,.admission-copy h4,.admission-copy .step b{color:#fff !important}
.admission-copy .eyebrow{background:rgba(255,255,255,.08) !important;border-color:rgba(255,255,255,.18) !important;color:#fff !important}
.admission-copy .step{border-color:rgba(255,255,255,.12) !important}
.admission-copy .step .n,.admission-copy .step span:first-child{background:var(--a-sun) !important;color:var(--a-ink) !important}
.form-card{background:#fff !important;border:0 !important;border-radius:var(--a-r-lg) !important;box-shadow:0 30px 80px -30px rgba(0,0,0,.55) !important}
.form-card h3{font-size:24px !important}

input[type=text],input[type=email],input[type=tel],input[type=number],input[type=date],input[type=password],input[type=search],input:not([type]),select,textarea{
  border-radius:12px !important;border:1.5px solid var(--a-line) !important;background:#fff !important;
  min-height:48px;font-size:16px !important;color:var(--a-ink) !important;
  transition:border-color .2s,box-shadow .2s !important}
textarea{min-height:110px}
input:focus,select:focus,textarea:focus{border-color:var(--a-blue) !important;box-shadow:0 0 0 4px rgba(36,83,214,.14) !important;outline:none !important}
label{color:var(--a-ink) !important;font-weight:600}

/* contact + map */
.contact{background:transparent !important}
.map-frame{border-radius:var(--a-r-lg) !important;overflow:hidden;border:1px solid var(--a-line) !important;box-shadow:var(--a-shadow) !important}

/* ---------- FAQ ---------- */
.faq-section{background:#fff !important}
.faq-topbar{background:var(--a-midnight) !important}
.faq-item{border-radius:var(--a-r) !important;border:1px solid var(--a-line) !important;background:#fff !important;box-shadow:none !important}
.faq-item[open]{border-color:rgba(36,83,214,.35) !important;box-shadow:var(--a-shadow) !important}
.faq-question{font-family:var(--a-display) !important;font-weight:700 !important;color:var(--a-ink) !important}

/* ---------- Footer ---------- */
footer.site{background:var(--a-midnight) !important;position:relative;overflow:hidden;color:rgba(232,238,250,.72) !important}
footer.site::before{content:"";position:absolute;right:-180px;top:-260px;width:620px;height:620px;border-radius:50%;
  background:radial-gradient(circle,rgba(36,83,214,.35),transparent 62%);pointer-events:none}
footer.site .wrap{position:relative}
footer.site h4{font-family:var(--a-display) !important;color:#fff !important;font-size:16px !important;text-transform:none !important;letter-spacing:0 !important}
footer.site ul li,footer.site p{color:rgba(232,238,250,.72) !important}
footer.site ul li a{color:rgba(232,238,250,.72) !important;font-size:14px !important}
footer.site ul li a:hover{color:var(--a-sun) !important}
footer.site .footer-brand .word{font-family:var(--a-display) !important;color:#fff !important;font-weight:800}
footer.site .footer-brand img{border-radius:50%;background:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1) !important;color:rgba(232,238,250,.55) !important}

/* floating buttons */
.floaters a{box-shadow:0 12px 28px -8px rgba(15,28,58,.45) !important;transition:transform .25s var(--a-ease) !important}
.floaters a:hover{transform:translateY(-3px) scale(1.04)}
.floaters .call{background:var(--a-blue) !important}
.app-fab{background:var(--a-midnight) !important;box-shadow:0 14px 34px -10px rgba(11,23,54,.6) !important}
.app-fab-ic{background:var(--a-sun) !important}

/* ---------- Inner pages (shared patterns) ---------- */
.breadcrumb,.breadcrumbs,.naiit-breadcrumb{font-size:14px}
.page-hero,.gal-hero,.course-hero,.inner-hero{background:var(--a-midnight) !important;color:#fff;position:relative;overflow:hidden}
.page-hero h1,.gal-hero h1,.course-hero h1,.inner-hero h1{color:#fff;font-weight:800 !important;letter-spacing:-.03em}
.page-hero p,.gal-hero p,.course-hero p,.inner-hero p{color:rgba(232,238,250,.8)}
.page-hero::after,.gal-hero::after,.course-hero::after,.inner-hero::after{content:"";position:absolute;right:-140px;top:50%;width:460px;height:460px;transform:translateY(-50%);
  border-radius:50%;border:1.5px dashed rgba(245,179,1,.35);pointer-events:none}
.naiit-page-banner img{border-radius:0}
table{border-radius:var(--a-r-sm);overflow:hidden}

/* ---------- Scroll reveal (only when JS is running) ---------- */
html.v53js .reveal{opacity:0 !important;transform:translateY(18px) !important;transition:opacity .7s var(--a-ease),transform .7s var(--a-ease) !important}
html.v53js .reveal.in{opacity:1 !important;transform:none !important}
html.v53js .why-grid .reveal:nth-child(4n+2),html.v53js .course-grid .reveal:nth-child(3n+2){transition-delay:.07s !important}
html.v53js .why-grid .reveal:nth-child(4n+3),html.v53js .course-grid .reveal:nth-child(3n+3){transition-delay:.14s !important}
html.v53js .why-grid .reveal:nth-child(4n+4){transition-delay:.21s !important}

/* ---------- Responsive ---------- */
@media (max-width:1320px){
  header.site .brand .word span{display:none !important}
  .header-contact .htxt{display:none}
}
@media (max-width:1100px){
  nav.main a{padding:7px 6px !important;font-size:13px !important}
}
@media (max-width:900px){
  .trust-strip{margin-top:-36px}
  .trust-strip .wrap{grid-template-columns:repeat(3,1fr) !important;row-gap:14px !important}
  .trust-strip .wrap > div:nth-child(4){border-left:0}
  .slider .slide .scrim::before,.slider .slide .scrim::after{right:-40%;opacity:.6}
}
@media (max-width:700px){
  body{font-size:15.5px}
  #mainNav[style*="flex"]{
    background:#fff !important;border-radius:0 0 20px 20px;box-shadow:var(--a-shadow-lg);
    gap:2px !important;padding:12px 16px 18px !important;max-height:calc(100vh - 80px);overflow:auto}
  #mainNav[style*="flex"] a{width:100%;padding:12px 12px !important;font-size:15.5px !important}
  .slider .slide .content{background:transparent !important;padding:8px 4px 0 !important}
  .slide h1,.slide h2,.slider .content h1,.slider .content h2{font-size:clamp(30px,8.6vw,40px) !important}
  .slide p,.slider .content p{font-size:15.5px !important}
  .slider .slide .scrim{background:
    radial-gradient(320px 260px at 0% 100%,rgba(245,179,1,.28),transparent 70%),
    linear-gradient(180deg,rgba(11,23,54,.88) 0%,rgba(11,23,54,.78) 60%,rgba(11,23,54,.92) 100%) !important}
  .slider .slide .scrim::before{width:420px;right:-55%;top:28%}
  .slider .slide .scrim::after{width:320px;right:-45%;top:28%}
  .slide-arrow{display:none !important}
  .trust-strip{margin-top:-28px;padding:0 12px}
  .trust-strip .wrap{grid-template-columns:repeat(2,1fr) !important;padding:16px 6px !important}
  .trust-strip .wrap > div{border-left:0 !important;padding:6px 10px}
  .trust-strip .wrap > div:last-child{grid-column:1/-1}
  .trust-strip b{font-size:20px !important}
  .director-card p{font-size:17px !important}
  .course-cta-buttons a{min-height:44px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  html.v53js .reveal{opacity:1 !important;transform:none !important}
}
@media print{
  .slider .slide .scrim::before,.slider .slide .scrim::after,footer.site::before,.admission::before{display:none}
}

/* ---------- Readability: left-aligned prose (no justified "rivers") ----------
   The admin's own alignment settings (Style Editor) still override this. */
html body section p,html body section li,html body .why-card p,html body .director-card p,
html body .testimonial-card p,html body footer.site p{text-align:start;hyphens:manual}
.section-head.center{max-width:780px !important}
.section-head.center p{margin-left:auto;margin-right:auto}

/* ---------- Photo slides (uploaded from Admin → Slider) ----------
   Keep the uploaded image clean and uncropped, exactly as before:
   no dark wash and no rings on top of a real photo/banner. */
.slider .slide:has(.bgwrap img) .scrim{display:none !important}
.slider .slide:has(.bgwrap img) .content .eyebrow{background:rgba(11,23,54,.55) !important}

/* ---------- Testimonials + contact: light sections ---------- */
.testimonials-section{background:#fff !important;border-top:1px solid var(--a-line)}
.testimonials-section .section-head h2{color:var(--a-ink) !important}
.testimonials-section .section-head p{color:var(--a-ink-2) !important}
.testimonials-section .eyebrow,.contact .eyebrow{color:var(--a-blue-deep) !important}
.testimonials-section .testimonial-card{background:var(--a-cloud) !important;border-color:var(--a-line) !important;box-shadow:none !important}
.testimonials-section .testimonial-person b{color:var(--a-ink) !important}
.testimonials-section .testimonial-person small,.testimonials-section .testimonial-footer{color:var(--a-ink-2) !important}
.testimonials-section .testimonial-text{color:var(--a-ink) !important;font-size:15.5px !important}
.testimonials-section .testimonial-rating{color:var(--a-ink) !important}
.testimonials-section .testimonial-arrow{background:#fff !important;border-color:var(--a-line) !important;color:var(--a-ink) !important}
.testimonials-section .testimonial-arrow:hover{background:var(--a-midnight) !important;color:#fff !important}
.testimonials-section p,.testimonials-section .empty-note{color:var(--a-ink-2) !important}

.contact{background:var(--a-cloud) !important}
.contact h2{color:var(--a-ink) !important}
.contact .contact-list b{color:var(--a-ink) !important}
.contact .contact-list span{color:var(--a-ink-2) !important}
.contact .contact-list .ic{color:var(--a-blue) !important;background:#fff;border:1px solid var(--a-line);border-radius:12px}
.contact .social-row a{background:#fff !important;border-color:var(--a-line) !important;color:var(--a-ink) !important}
.contact .social-row a:hover{background:var(--a-midnight) !important;color:#fff !important}
.contact p{color:var(--a-ink-2) !important}

/* student blocks used on light pages (e.g. Certified Students) */
.student-status-head h3{color:var(--a-ink) !important}
.student-status-head span{color:var(--a-ink-2) !important}
.success .student-status-head span{color:rgba(232,238,250,.6) !important}

/* course card actions: two side by side, call on its own row */
.course-cta-buttons{display:grid !important;grid-template-columns:1fr 1fr;gap:8px !important}
.course-cta-buttons a{font-size:13px !important;padding:10px 10px !important;justify-content:center;display:inline-flex;align-items:center;gap:6px}
.course-cta-buttons a.course-call-btn{grid-column:1/-1}
.form-card label,.form-row label{text-transform:none !important;letter-spacing:0 !important;font-size:14px !important}
@media (max-width:700px){
  header.site .wrap{gap:8px !important;padding-left:12px !important;padding-right:12px !important}
  header.site .brand img{width:40px !important;height:40px !important}
  .header-contact{width:40px;height:40px;padding:0 !important;justify-content:center}
  .header-cta .btn{min-height:40px !important;padding:8px 14px !important;font-size:13px !important}
  .navtoggle{width:40px !important;height:40px !important;flex:none}
  .trust-strip b{font-size:17px !important}
}
@media (max-width:380px){
  .header-cta .btn span{display:none}
  header.site .brand .word{font-size:17px !important}
}

/* inner page heading band */
.pagehead{background:var(--a-midnight) !important;position:relative;overflow:hidden;
  padding-top:clamp(48px,6vw,84px) !important;padding-bottom:clamp(44px,5vw,72px) !important}
.pagehead::before{content:"";position:absolute;top:auto;right:auto;left:-140px;bottom:-240px;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(245,179,1,.22),transparent 65%);pointer-events:none}
.pagehead::after{content:"";position:absolute;right:-120px;top:50%;width:440px;height:440px;transform:translateY(-50%);border-radius:50%;
  border:1.5px dashed rgba(245,179,1,.35);box-shadow:0 0 0 60px rgba(255,255,255,.02),0 0 0 61px rgba(255,255,255,.06);pointer-events:none}
.pagehead .wrap{position:relative;z-index:1}
.pagehead h1{color:#fff !important;font-size:clamp(32px,4.6vw,56px) !important;font-weight:800 !important;letter-spacing:-.03em !important;line-height:1.05 !important}
.pagehead p{color:rgba(232,238,250,.8) !important;font-size:17px}
.pagehead .eyebrow{background:rgba(255,255,255,.08) !important;border-color:rgba(255,255,255,.18) !important;color:#fff !important}
.pagehead a{color:var(--a-sun) !important}
.pm-in{max-width:100%}

/* blog + notes store heading bands follow the same aura look */
.bl-hero,.ns-hero{background:
  radial-gradient(520px 380px at 0% 100%,rgba(245,179,1,.22),transparent 65%),
  radial-gradient(620px 420px at 100% 0%,rgba(36,83,214,.35),transparent 62%),
  var(--a-midnight) !important}
.bl-hero h1,.ns-hero h1{color:#fff !important;font-weight:800 !important;letter-spacing:-.03em !important}
.bl-art-hero{background:#fff !important;border-bottom:1px solid var(--a-line) !important}
.course-card .course-thumb .cph{color:#fff !important;letter-spacing:-.02em !important;line-height:1.05 !important;text-align:center;padding:0 18px;
  background:radial-gradient(240px 180px at 88% 0%,rgba(245,179,1,.38),transparent 70%),radial-gradient(260px 200px at 0% 100%,rgba(36,83,214,.45),transparent 70%),var(--a-midnight) !important}