:root {
  --ease-out: cubic-bezier(.22,1,.36,1);
  --shadow: 0 10px 34px rgb(22 61 102 / 5%);
}
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; -webkit-font-smoothing: antialiased; }
::selection { color: #fff; background: #007d85; }
html { scroll-padding-top: 128px; }
section[id] { scroll-margin-top: 0; }
.header { position: sticky; top: 0; transition: box-shadow .3s, border-color .3s; }
.header.is-scrolled { box-shadow: 0 6px 25px #0c315519; border-bottom-color: #d9e6f2; }
.reading-progress { position: fixed; inset: 0 0 auto; height: 3px; z-index: 100; pointer-events: none; }
.reading-progress span { display: block; width: 100%; height: 100%; transform: scaleX(0); transform-origin: left; background: linear-gradient(90deg,#0068ec,#24b8f2); }
.header .brand-emblem { transition: transform .35s var(--ease-out); }
.header .brand:hover .brand-emblem { transform: translateY(-2px) rotate(-4deg); }
.header .nav-dropdown .dropdown-menu.show { animation: menu-entrance .2s var(--ease-out); }
.hero .hero-title { font-size: clamp(40px,3.6vw,52px); font-weight: 750; line-height: 1.12; }
.hero .hero-content p { font-size: 19px; line-height: 1.6; margin: 18px 0 26px; color: #edf5fc; }
.hero .hero-shade { background: linear-gradient(90deg,#06283ded,#06283da3 48%,#06283d20); }
.hero-eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; color: #e5f1fc; font-size: 11px; font-weight: 600; letter-spacing: 2.5px; line-height: 1.5; }
.hero-eyebrow::before { content: ""; height: 2px; width: 28px; background: #ffcc09; }
.hero .carousel-item.active .hero-eyebrow { animation: hero-entrance .7s var(--ease-out) both; }
.hero .carousel-item.active .hero-title { animation: hero-entrance .85s .1s var(--ease-out) both; }
.hero .carousel-item.active .hero-content p { animation: hero-entrance .85s .2s var(--ease-out) both; }
.hero .carousel-item.active .pill-button { animation: hero-entrance .85s .3s var(--ease-out) both; }
.hero .carousel-item.active .slide-image { animation: image-drift 7s ease-out both; }
.hero .pill-button { min-height: 48px; padding-inline: 25px; font-weight: 600; box-shadow: 0 5px 24px #00152515; }
.button, .pill-button { transition: background .25s, box-shadow .25s, filter .25s; }
.button span, .pill-button span, .text-link span { display: inline-block; transition: transform .25s var(--ease-out); }
.button:hover span, .pill-button:hover span, .text-link:hover span { transform: translateX(4px); }
.button:hover { box-shadow: 0 7px 20px #005bd526; }
.round-arrow, .small-arrow { transition: background .25s, box-shadow .25s; }
.hero > .round-arrow { background: #00293c77; border: 1px solid #ffffff30; backdrop-filter: blur(6px); }
.hero > .round-arrow:hover { background: #005bd5; border-color: #005bd5; }
.hero-dots button { transition: width .3s, border-radius .3s, background .3s; }
.hero-dots button.active { width: 24px; border-radius: 8px; }
.page-content { background: radial-gradient(ellipse at 0 6%,#eaf5ff 0,transparent 32%),radial-gradient(ellipse at 100% 65%,#e9f4ff 0,transparent 35%),#f7fbfe; }
.panel { transition: border-color .3s, box-shadow .3s; }
.contact-panel, .notice-panel { border-top: 3px solid #005bd5; }
.panel-heading p { color: #62718a; }
form label { transition: border-color .25s, background .25s, box-shadow .25s; }
form label:focus-within { background: #fff; box-shadow: 0 0 0 3px #005bd50d; }
input::placeholder, textarea::placeholder { color: #6a7b93; }
.contact-details > a { transition: color .2s; }
.contact-details > a:hover { color: #005bd5; }
.notice-row { border-radius: 6px; transition: background .25s; }
.notice-row:hover { background: #f5f9ff; }
.notice-date { background: linear-gradient(145deg,#edf5ff,#f4f8fd); }
.notice-date strong { color: #005bd5; }
.notice-copy h3 { font-weight: 650; }
.view-button { transition: color .2s, background .2s; }
.view-button:hover { background: #005bd5; color: #fff; }
.feature-strip { background: #fff; }
.feature-strip > div { transition: background .25s; }
.feature-strip > div:hover { background: #f7fbff; }
.feature-strip svg { transition: transform .4s var(--ease-out); }
.feature-strip > div:hover svg { transform: translateY(-5px) rotate(-4deg); }
.eyebrow { font-weight: 700; font-size: 11px; letter-spacing: 1.7px; }
.about-copy p, .course-card p { color: #536681; }
.about-highlights { background: linear-gradient(145deg,#fff,#f3f8ff); }
.about-highlights > div { transition: transform .3s var(--ease-out); }
.about-highlights > div:hover { transform: translateX(4px); }
.section-heading h2 { font-weight: 750; }
.section-heading::after { content: ""; display: block; height: 3px; width: 42px; border-radius: 3px; background: linear-gradient(90deg,#005bd5,#68baff); margin: 16px auto 0; }
.course-card { position: relative; overflow: hidden; transition: transform .35s var(--ease-out), box-shadow .35s, border-color .35s; }
.course-card::after { content: ""; position: absolute; inset: auto 0 0; height: 3px; transform: scaleX(0); transform-origin: left; background: linear-gradient(90deg,#005bd5,#53b9ff); transition: transform .4s var(--ease-out); }
.course-card > svg { width: 54px; height: 54px; padding: 10px; border-radius: 12px; background: #edf5ff; stroke-width: 1.6; transition: background .3s, transform .35s var(--ease-out); }
.course-card:hover::after, .course-card:focus-within::after { transform: scaleX(1); }
.course-card:hover > svg { background: #e1eeff; transform: rotate(-5deg); }
.course-card .text-link { font-weight: 650; }
.gallery-photo { isolation: isolate; transition: box-shadow .3s, filter .3s; }
.gallery-caption { position: absolute; inset: auto 0 0; z-index: 1; padding: 26px 14px 12px; background: linear-gradient(transparent,#021b38dd); color: white; text-align: left; font-size: 12px; font-weight: 600; line-height: 1.5; opacity: 0; transform: translateY(8px); transition: opacity .3s, transform .3s var(--ease-out); }
.gallery-photo:hover .gallery-caption, .gallery-photo:focus-visible .gallery-caption { opacity: 1; transform: none; }
.dialog-photo .gallery-caption { display: none; }
.testimonial-panel { position: relative; overflow: hidden; }
.testimonial-panel::after { content: "“"; position: absolute; top: 8px; right: 22px; font: 140px/1 Georgia,serif; color: #005bd508; pointer-events: none; }
.quote blockquote { color: #435b79; }
.portrait { box-shadow: 0 0 0 4px #edf5ff; }
.apply-panel { position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(140deg,#e6f2ff,#dcecff); border: 1px solid #d5e7fc; }
.apply-panel::before, .apply-panel::after { content: ""; position: absolute; width: 200px; height: 200px; z-index: -1; border: 1px solid #005bd513; border-radius: 50%; pointer-events: none; }
.apply-panel::before { top: -100px; right: -75px; }
.apply-panel::after { bottom: -140px; left: -65px; width: 250px; height: 250px; }
.apply-panel > svg { animation: cap-float 5s ease-in-out infinite; }
.footer-grid > div > a:not(.brand), .footer-grid > div > button { transition: color .2s, transform .2s; }
.footer-grid > div > a:not(.brand):hover, .footer-grid > div > button:hover { color: #93c8ff; transform: translateX(3px); }
.back-to-top { position: fixed; right: 24px; bottom: 24px; z-index: 30; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid #ffffff50; border-radius: 12px; background: #005bd5; color: #fff; box-shadow: 0 5px 20px #003a8e33; font-size: 23px; transition: background .2s; }
.back-to-top[hidden] { display: none; }
.back-to-top:hover { background: #0049ac; }
dialog[open] { animation: dialog-entrance .25s var(--ease-out); }

@keyframes hero-entrance { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes image-drift { from { transform: scale(1); } to { transform: scale(1.055); } }
@keyframes cap-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes menu-entrance { from { opacity: 0; } to { opacity: 1; } }
@keyframes dialog-entrance { from { opacity: 0; translate: 0 12px; } to { opacity: 1; translate: 0 0; } }
@media (hover: hover) and (pointer: fine) {
  .course-card:hover { transform: translateY(-7px); border-color: #cadff7; box-shadow: 0 16px 35px #14478312; }
  .contact-panel:hover, .notice-panel:hover { box-shadow: 0 12px 32px #1447830d; }
  .gallery-photo:hover { filter: saturate(1.1); box-shadow: 0 8px 24px #1447831a; }
}
@media (max-width: 1199.98px) { html { scroll-padding-top: 112px; } }
@media (max-width: 575.98px) {
  html { scroll-padding-top: 108px; }
  .hero .hero-title { font-size: clamp(29px,8.2vw,36px); }
  .hero .hero-content p { font-size: 16px; margin: 16px 0 22px; }
  .hero-eyebrow { font-size: 9px; letter-spacing: 1.6px; gap: 9px; margin-bottom: 18px; }
  .hero-eyebrow::before { width: 18px; }
  .hero .pill-button { padding-inline: 19px; min-height: 44px; }
  .gallery-caption { opacity: 1; transform: none; font-size: 11px; }
  .back-to-top { right: 16px; bottom: 16px; width: 40px; height: 40px; }
  .header #main-nav { max-height: min(70vh,580px); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* A brighter campus palette: blue, teal, amber and violet. */
:root {
  --teal: #007d85;
  --amber: #ffbd59;
  --violet: #7046bb;
}
.topbar { background: linear-gradient(105deg, #123b73, #006f79); }
.header { background: linear-gradient(110deg, #eef5ff, #fff9ef 65%, #eaf8f5); border-bottom-color: #cbdfe8; }
.header .brand-emblem { color: var(--teal); background: #dcf3ed; }
.header #main-nav .nav-admission { background: linear-gradient(115deg, #005bd5, #007d85); }
.header #main-nav .nav-admission:hover { background: #006872; }
.reading-progress span { background: linear-gradient(90deg, #007d85, #ffbd59, #9165d6); }
.hero .hero-shade { background: linear-gradient(100deg, #092a57f5, #07525bbd 50%, #152a4020); }
.hero .hero-title span { color: #ffd078; }
.hero .pill-button { color: #253454; background: #ffce79; border-color: #ffce79; }
.hero .pill-button:hover { color: #182c4b; background: #ffbb4f; }
.page-content {
  background:
    radial-gradient(ellipse at 0 4%, #d5ecff 0, transparent 35%),
    radial-gradient(ellipse at 100% 36%, #d7f2e9 0, transparent 36%),
    radial-gradient(ellipse at 5% 76%, #e8def9 0, transparent 34%),
    linear-gradient(180deg, #f0f7ff, #fff5e7 58%, #eef6ff);
}
.contact-panel { background: linear-gradient(145deg, #e7f7f3, #f6fcfa); border-color: #bce0d7; border-top-color: var(--teal); }
.contact-panel .heading-icon, .contact-details svg { color: var(--teal); }
.contact-panel form label { background: #ffffffde; border-color: #bfded7; }
.contact-panel form label:focus-within { border-color: var(--teal); box-shadow: 0 0 0 3px #007d851a; }
.send-button { background: linear-gradient(110deg, #007d85, #006b60); }
.send-button:hover { background: #00655f; }
.notice-panel { background: linear-gradient(145deg, #fff2db, #fffaf1); border-color: #efd4a6; border-top-color: #df8a24; }
.notice-panel .heading-icon { color: #b66513; }
.notice-tabs button { background: #fff9ed; border-color: #ead4ad; color: #79552c; }
.notice-tabs button.active { color: #fff; background: #985117; border-color: #985117; }
.notice-tabs button:hover:not(.active) { background: #ffe8bf; color: #6a421a; }
.notice-row:hover { background: #fff0d5; }
.notice-date { background: #ffdfab; color: #754515; }
.notice-date strong { color: #874610; }
.notice-row:nth-child(3n+2) .notice-date { background: #dce9ff; color: #254c87; }
.notice-row:nth-child(3n+2) .notice-date strong { color: #254c87; }
.notice-row:nth-child(3n+3) .notice-date { background: #e8dcf8; color: #68419c; }
.notice-row:nth-child(3n+3) .notice-date strong { color: #68419c; }
.feature-strip { overflow: hidden; border-color: #d1dfea; }
.feature-strip > div:nth-child(1) { background: #e0edff; color: #214c92; }
.feature-strip > div:nth-child(2) { background: #ffecd0; color: #91500b; }
.feature-strip > div:nth-child(3) { background: #d9f1e8; color: #186852; }
.feature-strip > div:nth-child(4) { background: #ece1fa; color: #70409c; }
.feature-strip > div > svg { color: inherit; }
.feature-strip > div + div::before { background: #ffffffa6; }
.eyebrow { color: var(--teal); }
.photo-caption { background: linear-gradient(120deg, #075f71ee, #16448aee); }
.about-highlights { background: linear-gradient(145deg, #e4edfF, #eee5fa); border-color: #d1cfec; }
.about-highlights > div:nth-child(even) svg { color: var(--violet); }
.course-grid > div { --card-accent: #245db0; --card-tint: #e4efff; --card-edge: #bdD4f3; }
.course-grid > div:nth-child(2) { --card-accent: #00756c; --card-tint: #def4eb; --card-edge: #b9dfcf; }
.course-grid > div:nth-child(3) { --card-accent: #7950ac; --card-tint: #eee3fa; --card-edge: #d8c4ee; }
.course-grid > div:nth-child(4) { --card-accent: #a25916; --card-tint: #fff0d8; --card-edge: #eed0a2; }
.course-card { background: var(--card-tint); border-color: var(--card-edge); border-top: 4px solid var(--card-accent); }
.course-card > svg, .course-card:hover > svg { color: var(--card-accent); background: #ffffffb8; }
.course-card .text-link { color: var(--card-accent); }
.course-card::after { background: var(--card-accent); }
.course-card:hover { border-color: var(--card-accent); }
.courses-section .section-heading::after { background: linear-gradient(90deg, #007d85, #e4a544, #7950ac); width: 72px; }
.testimonial-panel { background: linear-gradient(130deg, #eee5fc, #f6f0fd); border-color: #dbcaed; }
.testimonial-panel .eyebrow { color: #7546a5; }
.testimonial-panel::after { color: #7546a51a; }
.portrait { box-shadow: 0 0 0 4px #d8c5ef; }
.apply-panel { background: linear-gradient(130deg, #075b68, #153e7a); border-color: #126c79; color: #fff; }
.apply-panel h2 { color: #fff; }
.apply-panel > svg { color: #ffcf7d; }
.apply-panel .button { color: #283650; background: #ffcf7d; }
.apply-panel .button:hover { background: #ffbc50; }
.apply-panel::before, .apply-panel::after { border-color: #ffffff25; }
footer { background: linear-gradient(115deg, #102b56, #064f59); border-top: 4px solid #e9ac50; }
.footer-grid h3 { color: #ffcf7d; }
.footer-bottom { background: #071f3938; }
.back-to-top { background: var(--teal); }
.back-to-top:hover { background: #005f66; }