/* =========================================================
   WHY AYURVEDA
========================================================= */

.why-ayurveda {
    position: relative;
    overflow: hidden;
    padding: 100px 0;
    background:
        radial-gradient(circle at 10% 20%, rgba(22, 151, 190, 0.08), transparent 28%),
        radial-gradient(circle at 90% 80%, rgba(0, 130, 100, 0.08), transparent 30%),
        #f8fcfd;
}


/* Background Decorations */

.why-ayurveda__bg-circle {
    position: absolute;
    border: 1px solid rgba(23, 151, 190, 0.12);
    border-radius: 50%;
    pointer-events: none;
}

.why-ayurveda__bg-circle--one {
    width: 420px;
    height: 420px;
    top: -220px;
    left: -180px;
}

.why-ayurveda__bg-circle--two {
    width: 500px;
    height: 500px;
    right: -260px;
    bottom: -300px;
}


/* =========================================================
   HEADING
========================================================= */

.why-ayurveda__heading {
    max-width: 750px;
    margin: 0 auto 55px;
    text-align: center;
}

.why-ayurveda__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
    padding: 8px 16px;
    border-radius: 50px;
    background: rgba(20, 145, 175, 0.08);
    color: #087d91;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.why-ayurveda__heading h2 {
    margin: 0;
    color: #164b68;
    font-size: clamp(32px, 4vw, 52px);
    font-weight: 800;
    line-height: 1.12;
}

.why-ayurveda__heading h2 span {
    display: block;
    color: #138ca5;
}

.why-ayurveda__heading p {
    max-width: 580px;
    margin: 18px auto 0;
    color: #708696;
    font-size: 16px;
    line-height: 1.7;
}


/* =========================================================
   GRID
========================================================= */

.why-ayurveda__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}


/* =========================================================
   CARD
========================================================= */

.why-ayurveda__card {
    position: relative;
    min-height: 310px;
    padding: 30px;
    overflow: hidden;
    border: 1px solid rgba(18, 130, 160, 0.12);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 15px 45px rgba(25, 75, 100, 0.08);
    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease,
        border-color 0.4s ease;
}

.why-ayurveda__card::before {
    content: "";
    position: absolute;
    width: 130px;
    height: 130px;
    top: -70px;
    right: -70px;
    border-radius: 50%;
    background: rgba(20, 150, 180, 0.07);
    transition: transform 0.5s ease;
}

.why-ayurveda__card:hover {
    transform: translateY(-8px);
    border-color: rgba(20, 145, 175, 0.28);
    box-shadow: 0 25px 55px rgba(25, 75, 100, 0.14);
}

.why-ayurveda__card:hover::before {
    transform: scale(2);
}


/* =========================================================
   CARD TOP
========================================================= */

.why-ayurveda__top {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 28px;
}

.why-ayurveda__number {
    color: #b8cbd4;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 1px;
}

.why-ayurveda__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    border-radius: 18px;
    background: linear-gradient(
        135deg,
        #e9f8fb,
        #d8f1f5
    );
    color: #07879d;
    font-size: 25px;
    box-shadow: 0 10px 25px rgba(8, 135, 157, 0.12);
    transition:
        transform 0.4s ease,
        border-radius 0.4s ease;
}

.why-ayurveda__card:hover .why-ayurveda__icon {
    transform: rotate(-5deg) scale(1.08);
    border-radius: 50%;
}


/* =========================================================
   CONTENT
========================================================= */

.why-ayurveda__content {
    position: relative;
    z-index: 1;
}

.why-ayurveda__content h3 {
    margin-bottom: 12px;
    color: #174d6a;
    font-size: 21px;
    font-weight: 750;
    line-height: 1.3;
}

.why-ayurveda__content p {
    margin: 0;
    color: #728896;
    font-size: 15px;
    line-height: 1.75;
}


/* =========================================================
   ACCENT LINE
========================================================= */

.why-ayurveda__line {
    position: absolute;
    bottom: 0;
    left: 30px;
    width: 45px;
    height: 4px;
    border-radius: 10px 10px 0 0;
    background: #17a1bd;
    transition: width 0.4s ease;
}

.why-ayurveda__card:hover .why-ayurveda__line {
    width: 90px;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991.98px) {

    .why-ayurveda {
        padding: 80px 0;
    }

    .why-ayurveda__grid {
        grid-template-columns: repeat(2, 1fr);
    }

}


@media (max-width: 575.98px) {

    .why-ayurveda {
        padding: 65px 0;
    }

    .why-ayurveda__heading {
        margin-bottom: 35px;
    }

    .why-ayurveda__heading h2 {
        font-size: 32px;
    }

    .why-ayurveda__heading p {
        font-size: 14px;
    }

    .why-ayurveda__grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .why-ayurveda__card {
        min-height: auto;
        padding: 25px;
        border-radius: 20px;
    }

    .why-ayurveda__icon {
        width: 56px;
        height: 56px;
        font-size: 22px;
    }

    .why-ayurveda__content h3 {
        font-size: 19px;
    }

}








/* ==========================================================
   HOME CAROUSEL POSITION RESET
========================================================== */

body,
main {
    margin: 0;
}

#home {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

#home.cinematic-carousel {
    margin-top: 0 !important;
    padding-top: 0 !important;
}



/* ==========================================================
   HOME MAIN
========================================================== */

.home-main {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;
}


/* ==========================================================
   CINEMATIC CAROUSEL
========================================================== */

.cinematic-carousel {
    position: relative !important;

    display: block !important;

    width: 100% !important;

    height: 650px;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;

    background: #000;

    line-height: 0;
}


/* ==========================================================
   VIEWPORT
========================================================== */

.cinematic-carousel__viewport {
    position: absolute !important;

    inset: 0 !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;
}


/* ==========================================================
   SLIDES
========================================================== */

.cinematic-carousel__slide {
    position: absolute !important;

    inset: 0 !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;

    opacity: 0;
    visibility: hidden;

    z-index: 1;

    transition:
        opacity 1.4s cubic-bezier(.65,0,.35,1),
        visibility 1.4s ease;
}


/* ACTIVE */

.cinematic-carousel__slide.is-active {
    opacity: 1;

    visibility: visible;

    z-index: 2;
}


/* ==========================================================
   IMAGE
========================================================== */

.cinematic-carousel__image {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    max-width: none !important;

    object-fit: cover;

    object-position: center center;

    transform: scale(1);

    transition:
        transform 8s cubic-bezier(.25,.46,.45,.94);
}


/* PREMIUM ZOOM */

.cinematic-carousel__slide.is-active
.cinematic-carousel__image {
    transform: scale(1.035);
}


/* ==========================================================
   SMOKE
========================================================== */

.cinematic-carousel__smoke {
    position: absolute;

    inset: -20%;

    z-index: 10;

    pointer-events: none;

    opacity: 0;

    visibility: hidden;

    background:

        radial-gradient(
            ellipse at 0% 50%,
            rgba(0,0,0,.98) 0%,
            rgba(0,0,0,.82) 18%,
            rgba(0,0,0,.48) 36%,
            transparent 62%
        ),

        radial-gradient(
            ellipse at 100% 35%,
            rgba(0,0,0,.98) 0%,
            rgba(0,0,0,.75) 20%,
            rgba(0,0,0,.35) 42%,
            transparent 65%
        ),

        radial-gradient(
            ellipse at 50% 100%,
            rgba(0,0,0,.98) 0%,
            rgba(0,0,0,.55) 30%,
            transparent 65%
        ),

        #000;

    filter: blur(16px);

    transform: scale(1.08);
}


/* ==========================================================
   SMOKE TRANSITION
========================================================== */

.cinematic-carousel__smoke.is-transitioning {

    visibility: visible;

    animation:
        cinematicSmoke
        2.2s
        cubic-bezier(.65,0,.35,1)
        forwards;
}


@keyframes cinematicSmoke {

    0% {
        opacity: 0;

        transform: scale(1.15);

        filter: blur(24px);
    }

    20% {
        opacity: .30;

        transform: scale(1.12);

        filter: blur(20px);
    }

    45% {
        opacity: .80;

        transform: scale(1.06);

        filter: blur(14px);
    }

    55% {
        opacity: 1;

        transform: scale(1.02);

        filter: blur(10px);
    }

    70% {
        opacity: .75;

        transform: scale(1.06);

        filter: blur(14px);
    }

    85% {
        opacity: .35;

        transform: scale(1.12);

        filter: blur(20px);
    }

    100% {
        opacity: 0;

        transform: scale(1.18);

        filter: blur(25px);
    }
}


/* ==========================================================
   CAROUSEL NAVIGATION
========================================================== */

.cinematic-carousel__navigation {

    position: absolute;

    right: 32px;
    bottom: 28px;

    z-index: 20;

    display: flex;

    align-items: center;

    gap: 18px;

    padding: 10px 12px 10px 18px;

    background: rgba(255,255,255,.94);

    border: 1px solid rgba(255,255,255,.95);

    border-radius: 60px;

    box-shadow:
        0 12px 35px rgba(0,0,0,.18);

    backdrop-filter: blur(15px);

    -webkit-backdrop-filter: blur(15px);
}


/* COUNTER */

.cinematic-carousel__counter {

    display: flex;

    align-items: baseline;

    gap: 5px;

    min-width: 55px;

    color: #174a7e;

    font-size: 13px;

    letter-spacing: 1px;
}

.cinematic-carousel__counter strong {
    font-size: 18px;

    font-weight: 700;
}


/* PROGRESS */

.cinematic-carousel__progress {

    width: 100px;
    height: 3px;

    overflow: hidden;

    background: #d8e3ea;

    border-radius: 10px;
}

.cinematic-carousel__progress span {

    display: block;

    width: 33.33%;
    height: 100%;

    background: #174a7e;

    border-radius: inherit;

    transition: width .6s ease;
}


/* ARROWS */

.cinematic-carousel__arrows {

    display: flex;

    gap: 6px;
}

.cinematic-carousel__arrow {

    display: flex;

    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    padding: 0;

    color: #174a7e;

    background: #f3f7fa;

    border: 1px solid #dce7ed;

    border-radius: 50%;

    cursor: pointer;

    transition:
        color .25s ease,
        background .25s ease,
        transform .25s ease;
}

.cinematic-carousel__arrow:hover {

    color: #ffffff;

    background: #174a7e;

    transform: translateY(-2px);
}


/* ==========================================================
   LARGE SCREEN
========================================================== */

@media (min-width: 1600px) {

    .cinematic-carousel {
        height: calc(100vh - 290px);

        min-height: 600px;

        max-height: 800px;
    }
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .cinematic-carousel {
        height: 500px;
    }

    .cinematic-carousel__navigation {
        right: 20px;
        bottom: 20px;
    }
}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .cinematic-carousel {
        height: 430px;
    }

    .cinematic-carousel__navigation {

        right: 14px;
        bottom: 14px;

        gap: 10px;

        padding:
            8px
            9px
            8px
            13px;
    }

    .cinematic-carousel__progress {
        width: 60px;
    }

    .cinematic-carousel__arrow {

        width: 36px;
        height: 36px;
    }
}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 480px) {

    .cinematic-carousel {
        height: 350px;
    }

    .cinematic-carousel__navigation {

        right: 10px;
        bottom: 10px;
    }

    .cinematic-carousel__counter strong {
        font-size: 15px;
    }

    .cinematic-carousel__progress {
        width: 45px;
    }

    .cinematic-carousel__arrow {

        width: 33px;
        height: 33px;
    }
}













/* Homepage base styles */
.home-main {
  --home-medical-blue: #1677b8;
  --home-deep-blue: #174a7e;
  --home-sky-blue: #4db7e5;
  --home-soft-cyan: #eaf8fc;
  --home-light-bg: #f7f9fb;
  --home-soft-green: #dff4e7;
  --color-primary: var(--home-medical-blue);
  --color-primary-hover: var(--home-deep-blue);
  --color-sky-blue-400: var(--home-sky-blue);
  --color-soft-cyan-50: var(--home-soft-cyan);
  --color-light-gray-50: var(--home-light-bg);
  overflow: hidden;
  background:
    radial-gradient(circle at 8% 12%, rgba(197, 245, 248, 0.9), transparent 26rem),
    radial-gradient(circle at 92% 28%, rgba(198, 234, 212, 0.72), transparent 24rem),
    var(--color-white);
}

.home-hero {
  position: relative;
  min-height: 0;
  height: min(650px, calc(100vh - 1rem));
  max-height: 650px;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding-block: 1.35rem;
  isolation: isolate;
  background:
    radial-gradient(circle at 8% 12%, rgba(234, 248, 252, 0.95), transparent 23rem),
    radial-gradient(circle at 96% 18%, rgba(223, 244, 231, 0.72), transparent 24rem),
    linear-gradient(135deg, var(--color-white), var(--home-soft-cyan));
}

.home-hero__ambient {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}

.home-hero__ambient span {
  position: absolute;
  width: clamp(5rem, 10vw, 8rem);
  aspect-ratio: 1;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.84), rgba(197, 245, 248, 0.28));
  border: 1px solid rgba(142, 217, 251, 0.45);
  border-radius: 50%;
  box-shadow: var(--shadow-xs);
  animation: heroFloat 9s ease-in-out infinite;
}

.home-hero__ambient span:nth-child(1) {
  top: 10%;
  left: 4%;
}

.home-hero__ambient span:nth-child(2) {
  top: 16%;
  right: 8%;
  width: clamp(4rem, 7vw, 6rem);
  animation-delay: 1.2s;
}

.home-hero__ambient span:nth-child(3) {
  right: 38%;
  bottom: 8%;
  width: clamp(3.5rem, 6vw, 5rem);
  animation-delay: 2.4s;
}

.home-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.45fr) minmax(0, 0.55fr);
  align-items: center;
  gap: 1.4rem;
  min-height: 0;
}

.home-hero__info {
  position: relative;
  overflow: hidden;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 1.15rem;
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid rgba(77, 183, 229, 0.28);
  border-radius: 1.5rem;
  box-shadow: 0 22px 54px rgba(22, 119, 184, 0.16);
  backdrop-filter: blur(20px);
}

.home-hero__info::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 0.26rem;
  background: linear-gradient(90deg, var(--color-medical-blue-400), var(--color-soft-green-200));
}

.home-hero__trust {
  margin-bottom: 0.25rem;
  color: var(--color-primary);
  font-size: 0.72rem;
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
}

.home-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  width: fit-content;
  margin-bottom: 0.55rem;
  padding: 0.38rem 0.68rem;
  color: var(--color-primary);
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid var(--color-sky-blue-200);
  border-radius: var(--radius-pill);
  font-size: 0.68rem;
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
  box-shadow: var(--shadow-xs);
}

.home-hero h1 {
  max-width: 100%;
  margin-bottom: 0.55rem;
  color: var(--home-deep-blue);
  font-size: 2.1rem;
  line-height: 1.04;
}

.home-hero h1 span {
  display: block;
  color: var(--color-medical-blue-600);
}

.home-hero__lead {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  max-width: 100%;
  overflow: hidden;
  margin-bottom: 0.75rem;
  color: var(--color-text);
  font-size: 0.9rem;
  line-height: 1.46;
}

.home-hero__credentials {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.38rem;
  margin-bottom: 0.75rem;
}

.home-hero__credentials span {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  min-height: 2.45rem;
  padding: 0.4rem 0.45rem;
  color: var(--color-text);
  background: rgba(244, 254, 255, 0.82);
  border: 1px solid var(--color-sky-blue-200);
  border-radius: 0.72rem;
  box-shadow: var(--shadow-xs);
  font-size: 0.66rem;
  font-weight: var(--font-weight-semibold);
  line-height: 1.18;
}

.home-hero__credentials i {
  flex: 0 0 auto;
  margin-top: 0;
  color: var(--color-primary);
  font-size: 0.76rem;
}

.home-hero__stats {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.38rem;
  margin-bottom: 0.75rem;
}

.home-hero__stat {
  min-height: 4.65rem;
  padding: 0.5rem 0.35rem;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid var(--color-light-gray-200);
  border-radius: 0.78rem;
  box-shadow: var(--shadow-xs);
  text-align: center;
  transition:
    transform var(--transition-base),
    box-shadow var(--transition-base),
    border-color var(--transition-base);
}

.home-hero__stat:hover {
  transform: translateY(-0.35rem);
  border-color: var(--color-sky-blue-200);
  box-shadow: var(--shadow-md);
}

.home-hero__stat i {
  width: 1.45rem;
  height: 1.45rem;
  display: grid;
  place-items: center;
  margin: 0 auto 0.28rem;
  color: var(--color-primary);
  background: var(--color-soft-green-100);
  border: 1px solid var(--color-soft-green-200);
  border-radius: 50%;
  font-size: 0.72rem;
}

.home-hero__stat strong {
  display: block;
  color: var(--color-primary);
  font-size: 0.84rem;
  line-height: 1.1;
}

.home-hero__stat span:last-child {
  display: block;
  margin-top: 0.12rem;
  color: var(--color-text-muted);
  font-size: 0.62rem;
  font-weight: var(--font-weight-bold);
  line-height: 1.14;
}

.home-hero__actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 0.45rem;
  margin-top: 0;
}

.home-hero__actions .ds-btn {
  position: relative;
  overflow: hidden;
  min-height: 2.45rem;
  padding: 0.58rem 0.72rem;
  border-radius: var(--radius-pill);
  font-size: 0.78rem;
  line-height: 1.15;
}

.home-hero__actions .ds-btn::after {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  width: 0;
  aspect-ratio: 1;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.34);
  transform: translate(-50%, -50%);
  transition: width 420ms ease;
}

.home-hero__actions .ds-btn:hover::after {
  width: 11rem;
}

.home-hero__notice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: 2.45rem;
  padding: 0.58rem 0.74rem;
  color: var(--color-primary);
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid var(--color-sky-blue-200);
  border-radius: var(--radius-pill);
  box-shadow: var(--shadow-xs);
  font-size: 0.78rem;
  font-weight: var(--font-weight-bold);
}

.home-hero__notice:hover {
  color: var(--color-primary-hover);
  background: var(--color-sky-blue-100);
  transform: translateY(-1px);
}

.home-hero__carousel-wrap {
  min-width: 0;
  height: 100%;
}

.home-hero__carousel {
  position: relative;
  overflow: hidden;
  height: 480px;
  min-height: 420px;
  max-height: 480px;
  background: var(--color-white);
  border: 1px solid rgba(77, 183, 229, 0.34);
  border-radius: 1.5rem;
  box-shadow: 0 24px 58px rgba(22, 119, 184, 0.18);
}

.home-hero__carousel::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(22, 120, 186, 0.18)),
    linear-gradient(90deg, rgba(31, 142, 209, 0.1), transparent 42%);
  pointer-events: none;
}

.home-hero__carousel .carousel-inner,
.home-hero__carousel .carousel-item {
  height: 100%;
}

.home-hero__carousel .carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.01);
  transition: transform 5.5s ease;
}

.home-hero__carousel .carousel-item.active img {
  transform: scale(1.06);
}

.home-hero__carousel .carousel-indicators {
  z-index: 4;
  margin-bottom: var(--space-4);
}

.home-hero__carousel .carousel-indicators [data-bs-target] {
  width: 0.7rem;
  height: 0.7rem;
  margin-inline: 0.25rem;
  background: var(--color-white);
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  opacity: 0.74;
}

.home-hero__carousel .carousel-indicators .active {
  width: 1.7rem;
  background: var(--color-soft-green-200);
  border-radius: var(--radius-pill);
  opacity: 1;
}

.home-hero__carousel .carousel-control-prev,
.home-hero__carousel .carousel-control-next {
  z-index: 5;
  width: 4.75rem;
}

.home-hero__carousel .carousel-control-prev-icon,
.home-hero__carousel .carousel-control-next-icon {
  width: 2.6rem;
  height: 2.6rem;
  background-color: rgba(255, 255, 255, 0.88);
  background-size: 58%;
  border: 1px solid var(--color-sky-blue-200);
  border-radius: 50%;
  box-shadow: var(--shadow-sm);
  filter: none;
}

.home-hero__carousel-caption {
  position: absolute;
  left: 1.15rem;
  right: 1.15rem;
  bottom: 1.35rem;
  z-index: 3;
  max-width: 31rem;
  padding: 1rem;
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(189, 233, 255, 0.86);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-md);
  backdrop-filter: blur(16px);
}

.home-hero__carousel-caption span,
.course-feature-card__body > span,
.infra-card span,
.news-card span,
.event-item span,
.placement-card span,
.notice-panel__label {
  color: var(--color-primary);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
}

.home-hero__carousel-caption strong {
  display: block;
  margin: 0.25rem 0;
  color: var(--color-primary);
  font-size: 1.05rem;
  line-height: var(--line-height-tight);
}

.home-hero__carousel-caption p {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.86rem;
  line-height: var(--line-height-base);
}

.home-alert {
  position: relative;
  z-index: 3;
  margin-top: -1.2rem;
}

.home-alert__inner {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-height: 4.25rem;
  padding: var(--space-4) var(--space-5);
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid var(--color-sky-blue-200);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}

.home-alert__inner:hover {
  color: var(--color-primary);
  transform: translateY(-2px);
}

.home-alert__inner i {
  margin-left: auto;
}

.home-alert__badge {
  padding: 0.35rem 0.55rem;
  color: var(--color-primary);
  background: var(--color-soft-green-100);
  border: 1px solid var(--color-soft-green-200);
  border-radius: var(--radius-pill);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
  animation: softPulse 1.7s ease-in-out infinite;
}

.home-section {
  position: relative;
  padding-block: 4.5rem;
}

.home-section--soft {
  background:
    linear-gradient(180deg, var(--home-light-bg), var(--color-white));
}

.home-section--cyan {
  background:
    linear-gradient(180deg, var(--home-soft-cyan), var(--color-white));
}

.home-section-heading {
  max-width: 46rem;
  margin-bottom: 2.35rem;
}

.home-section-heading.text-center {
  margin-inline: auto;
}

.home-section-heading h2,
.home-copy h2,
.admission-cta h2,
.contact-cta h2 {
  margin-bottom: 0.9rem;
  color: var(--home-deep-blue);
  font-size: 2.55rem;
  letter-spacing: 0;
}

.home-section-heading p,
.home-copy p,
.admission-cta p,
.contact-cta p {
  color: var(--color-text-muted);
  font-size: 1.02rem;
  line-height: 1.72;
}

.welcome-card,
.course-feature-card,
.department-tile,
.stat-card,
.news-card,
.notice-panel,
.event-item,
.testimonial-card,
.placement-card,
.contact-cta__content,
.contact-cta__map {
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(77, 183, 229, 0.24);
  border-radius: 1.25rem;
  box-shadow: 0 14px 34px rgba(22, 119, 184, 0.1);
}

.welcome-card {
  position: relative;
  overflow: hidden;
  padding: 2rem;
  border-color: rgba(77, 183, 229, 0.26);
}

.welcome-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 0.35rem;
  background: linear-gradient(180deg, var(--home-medical-blue), var(--home-sky-blue));
}

.welcome-card p {
  color: var(--color-text);
  font-size: var(--font-size-md);
  line-height: var(--line-height-loose);
}

.welcome-card__points,
.placement-list,
.contact-cta__grid {
  display: grid;
  gap: 0.85rem;
}

.welcome-card__points span,
.placement-list span,
.contact-cta__grid a,
.contact-cta__grid span {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
}

.welcome-card__points i,
.placement-list i,
.contact-cta__grid i {
  color: var(--color-primary);
  margin-top: 0.25rem;
}

.home-image-stack {
  position: relative;
  min-height: 29rem;
}

.home-image-stack img {
  position: absolute;
  object-fit: cover;
  border: 0.45rem solid var(--color-white);
  border-radius: 1.25rem;
  box-shadow: 0 24px 58px rgba(22, 119, 184, 0.16);
}

.home-image-stack__primary {
  inset: 0 14% 16% 0;
  width: 86%;
  height: 84%;
}

.home-image-stack__secondary {
  right: 0;
  bottom: 0;
  width: 52%;
  height: 42%;
}

.credential-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
  margin-top: var(--space-6);
}

.credential-row div {
  padding: 1rem;
  background: var(--home-soft-cyan);
  border: 1px solid rgba(77, 183, 229, 0.28);
  border-radius: 1rem;
  text-align: center;
}

.credential-row strong {
  display: block;
  color: var(--color-primary);
  font-size: var(--font-size-xl);
}

.credential-row span {
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.course-feature-card {
  display: grid;
  grid-template-columns: 0.92fr 1.08fr;
  overflow: hidden;
  border-color: rgba(77, 183, 229, 0.24);
  box-shadow: 0 18px 46px rgba(22, 119, 184, 0.11);
}

.course-feature-card__image img {
  width: 100%;
  height: 100%;
  min-height: 23rem;
  object-fit: cover;
}

.course-feature-card__body {
  padding: 2.4rem;
}

.course-feature-card__body h3 {
  color: var(--home-deep-blue);
  font-size: 2rem;
}

.course-feature-card__body p {
  color: var(--color-text-muted);
  line-height: var(--line-height-loose);
}

.course-feature-card__body ul {
  display: grid;
  gap: var(--space-3);
  padding: 0;
  margin: var(--space-5) 0;
  list-style: none;
}

.course-feature-card__body li {
  display: flex;
  gap: var(--space-3);
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
}

.course-feature-card__body li i {
  color: var(--color-primary);
  margin-top: 0.2rem;
}

.department-tile {
  display: block;
  height: 100%;
  padding: 1.55rem;
  color: var(--color-text);
  border-color: rgba(77, 183, 229, 0.2);
  transition:
    transform var(--transition-base),
    box-shadow var(--transition-base),
    border-color var(--transition-base);
}

.department-tile:hover {
  color: var(--color-text);
  transform: translateY(-0.35rem);
  border-color: rgba(77, 183, 229, 0.5);
  box-shadow: 0 18px 42px rgba(22, 119, 184, 0.12);
}

.department-tile > i {
  display: inline-grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  margin-bottom: 1rem;
  color: var(--color-primary);
  background: var(--home-soft-cyan);
  border: 1px solid rgba(77, 183, 229, 0.22);
  border-radius: 1rem;
}

.department-tile h3 {
  color: var(--home-deep-blue);
  font-size: var(--font-size-lg);
}

.department-tile p {
  color: var(--color-text-muted);
}

.stats-band {
  padding-block: 3rem;
  background:
    linear-gradient(90deg, rgba(234, 248, 252, 0.9), rgba(223, 244, 231, 0.78));
}

.stat-card {
  height: 100%;
  padding: 1.35rem;
  text-align: center;
  border-color: rgba(77, 183, 229, 0.22);
}

.stat-card strong {
  display: block;
  color: var(--home-deep-blue);
  font-size: 2.65rem;
  line-height: 1;
}

.stat-card span:last-child {
  display: block;
  margin-top: var(--space-2);
  color: var(--color-text-muted);
  font-weight: var(--font-weight-semibold);
}

.infrastructure-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: 14.5rem;
  gap: var(--space-4);
}

.infra-card {
  position: relative;
  overflow: hidden;
  border-radius: 1.2rem;
  box-shadow: 0 14px 34px rgba(22, 119, 184, 0.1);
}

.infra-card--large {
  grid-column: span 2;
  grid-row: span 2;
}

.infra-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms ease;
}

.infra-card:hover img {
  transform: scale(1.05);
}

.infra-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 62%;
  background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.96));
}

.infra-card div {
  position: absolute;
  left: var(--space-5);
  right: var(--space-5);
  bottom: var(--space-5);
  z-index: 2;
}

.infra-card h3 {
  margin-bottom: 0;
  color: var(--home-deep-blue);
  font-size: 1.28rem;
}

.gallery-tile {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  padding: 0;
  overflow: hidden;
  background: var(--color-white);
  border: 0;
  border-radius: 1.05rem;
  box-shadow: 0 12px 30px rgba(22, 119, 184, 0.1);
}

.gallery-tile--wide {
  aspect-ratio: 21 / 7;
}

.gallery-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition:
    transform 700ms ease,
    filter 700ms ease;
}

.gallery-tile::after {
  content: "\f065";
  position: absolute;
  inset: 50% auto auto 50%;
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  color: var(--color-primary);
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid var(--color-sky-blue-200);
  border-radius: var(--radius-pill);
  font-family: FontAwesome;
  transform: translate(-50%, -50%) scale(0.84);
  opacity: 0;
  transition:
    opacity var(--transition-base),
    transform var(--transition-base);
}

.gallery-tile:hover img {
  transform: scale(1.04);
  filter: saturate(1.08);
}

.gallery-tile:hover::after {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.news-card {
  height: 100%;
  padding: 1.6rem;
  border-color: rgba(77, 183, 229, 0.22);
  transition:
    transform var(--transition-base),
    box-shadow var(--transition-base);
}

.news-card:hover {
  transform: translateY(-0.35rem);
  box-shadow: 0 18px 42px rgba(22, 119, 184, 0.12);
}

.news-card h3 {
  margin-top: var(--space-3);
  color: var(--home-deep-blue);
  font-size: 1.32rem;
}

.news-card p {
  color: var(--color-text-muted);
}

.news-card a,
.event-item a {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--color-primary);
  font-weight: var(--font-weight-bold);
}

.notice-panel {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-5);
  height: 100%;
  padding: 2rem;
  border-color: rgba(77, 183, 229, 0.24);
}

.notice-panel__date {
  display: grid;
  place-items: center;
  width: 7rem;
  height: 7rem;
  color: var(--color-primary);
  background: var(--home-soft-green);
  border: 1px solid rgba(89, 178, 125, 0.24);
  border-radius: var(--radius-xl);
  text-align: center;
}

.notice-panel__date strong {
  font-size: 2.5rem;
  line-height: 1;
}

.notice-panel__date span {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
}

.event-timeline {
  max-width: 52rem;
  margin-inline: auto;
  display: grid;
  gap: 1rem;
}

.event-item {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.15rem;
  padding: 1.35rem;
  border-color: rgba(77, 183, 229, 0.22);
  transition:
    transform var(--transition-base),
    box-shadow var(--transition-base),
    border-color var(--transition-base);
}

.event-item:hover {
  transform: translateY(-0.25rem);
  border-color: rgba(77, 183, 229, 0.48);
  box-shadow: 0 18px 42px rgba(22, 119, 184, 0.12);
}

.event-item__icon {
  display: grid;
  place-items: center;
  width: 3.4rem;
  height: 3.4rem;
  color: var(--color-primary);
  background: var(--home-soft-cyan);
  border: 1px solid rgba(77, 183, 229, 0.22);
  border-radius: 1rem;
}

.event-item h3 {
  margin: 0.35rem 0 0.3rem;
  color: var(--home-deep-blue);
  font-size: 1.16rem;
}

.event-item p {
  margin: 0;
  color: var(--color-text-muted);
  line-height: 1.65;
}

.testimonial-card {
  height: 100%;
  padding: 1.6rem;
  border-color: rgba(77, 183, 229, 0.2);
}

.testimonial-card > i {
  color: var(--color-sky-blue-300);
  font-size: 2rem;
}

.testimonial-card p {
  margin-top: var(--space-4);
  color: var(--color-text);
  font-size: var(--font-size-md);
  line-height: var(--line-height-loose);
}

.testimonial-card strong {
  color: var(--color-primary);
}

.placement-card {
  position: relative;
  min-height: 26rem;
  overflow: hidden;
}

.placement-card img {
  width: 100%;
  height: 100%;
  min-height: 26rem;
  object-fit: cover;
}

.placement-card div {
  position: absolute;
  left: var(--space-6);
  right: var(--space-6);
  bottom: var(--space-6);
  padding: var(--space-5);
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--color-light-gray-200);
  border-radius: var(--radius-lg);
}

.admission-cta,
.contact-cta {
  padding-block: 4.5rem;
  background:
    linear-gradient(135deg, rgba(234, 248, 252, 0.92), var(--color-white) 52%, rgba(223, 244, 231, 0.78));
}

.admission-cta__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: var(--space-6);
  padding: 2.4rem;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(77, 183, 229, 0.28);
  border-radius: 1.25rem;
  box-shadow: 0 18px 46px rgba(22, 119, 184, 0.12);
}

.admission-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}

.contact-cta__content {
  height: 100%;
  padding: clamp(1.5rem, 4vw, 3rem);
}

.contact-cta__map {
  position: relative;
  height: 100%;
  min-height: 24rem;
  overflow: hidden;
}

.contact-cta__map iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.gallery-modal .modal-content {
  background: var(--color-white);
  border: 1px solid var(--color-light-gray-200);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
}

.gallery-modal .modal-header {
  border-bottom-color: var(--color-light-gray-200);
}

.gallery-modal .modal-title {
  margin: 0;
  color: var(--color-primary);
  font-size: var(--font-size-lg);
}

.gallery-modal .modal-body {
  padding: var(--space-4);
}

.gallery-modal img {
  width: 100%;
  max-height: 78vh;
  object-fit: contain;
  border-radius: var(--radius-lg);
}

.reveal {
  opacity: 0;
  transform: translateY(1.75rem);
  transition:
    opacity 700ms ease,
    transform 700ms ease;
}

.reveal.from-left {
  transform: translateX(-2rem);
}

.reveal.from-right {
  transform: translateX(2rem);
}

.reveal.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}

@keyframes floatCard {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-0.75rem);
  }
}

@keyframes softPulse {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(198, 234, 212, 0.65);
  }

  50% {
    box-shadow: 0 0 0 0.45rem rgba(198, 234, 212, 0);
  }
}

@keyframes heroFloat {
  0%,
  100% {
    transform: translate3d(0, 0, 0);
  }

  50% {
    transform: translate3d(0.5rem, -0.8rem, 0);
  }
}

@media (max-width: 1439.98px) and (min-width: 1200px) {
  .home-hero {
    height: min(620px, calc(100vh - 0.75rem));
    max-height: 620px;
    padding-block: 1rem;
  }

  .home-hero__grid {
    gap: 1.1rem;
  }

  .home-hero__info {
    padding: 0.95rem;
  }

  .home-hero h1 {
    font-size: 1.85rem;
  }

  .home-hero__lead {
    margin-bottom: 0.6rem;
    font-size: 0.82rem;
    line-height: 1.36;
  }

  .home-hero__credentials {
    gap: 0.32rem;
    margin-bottom: 0.6rem;
  }

  .home-hero__credentials span {
    min-height: 2.25rem;
    padding: 0.34rem 0.38rem;
    font-size: 0.58rem;
  }

  .home-hero__stats {
    gap: 0.32rem;
    margin-bottom: 0.6rem;
  }

  .home-hero__stat {
    min-height: 4.25rem;
    padding: 0.44rem 0.28rem;
  }

  .home-hero__actions .ds-btn,
  .home-hero__notice {
    min-height: 2.25rem;
    padding: 0.5rem 0.58rem;
    font-size: 0.72rem;
  }

  .home-hero__carousel {
    height: 420px;
    min-height: 420px;
    max-height: 420px;
  }
}

@media (max-width: 1199.98px) {
  .home-hero {
    height: min(620px, calc(100vh - 0.75rem));
    max-height: 620px;
    padding-block: 1rem;
  }

  .home-hero__grid {
    grid-template-columns: minmax(0, 0.45fr) minmax(0, 0.55fr);
    gap: 1rem;
  }

  .home-hero__info {
    padding: 0.85rem;
  }

  .home-eyebrow {
    margin-bottom: 0.42rem;
    padding: 0.3rem 0.55rem;
    font-size: 0.6rem;
  }

  .home-hero__trust {
    margin-bottom: 0.18rem;
    font-size: 0.64rem;
  }

  .home-hero h1 {
    margin-bottom: 0.4rem;
    font-size: 1.58rem;
  }

  .home-hero__lead {
    margin-bottom: 0.48rem;
    font-size: 0.76rem;
    line-height: 1.32;
  }

  .home-hero__credentials {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.28rem;
    margin-bottom: 0.5rem;
  }

  .home-hero__credentials span {
    min-height: 2rem;
    padding: 0.3rem 0.32rem;
    border-radius: 0.55rem;
    font-size: 0.54rem;
    line-height: 1.12;
  }

  .home-hero__credentials i {
    font-size: 0.62rem;
  }

  .home-hero__stats {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.28rem;
    margin-bottom: 0.5rem;
  }

  .home-hero__stat {
    min-height: 4rem;
    padding: 0.4rem 0.25rem;
    border-radius: 0.6rem;
  }

  .home-hero__stat i {
    width: 1.25rem;
    height: 1.25rem;
    margin-bottom: 0.2rem;
    font-size: 0.62rem;
  }

  .home-hero__stat strong {
    font-size: 0.72rem;
  }

  .home-hero__stat span:last-child {
    font-size: 0.52rem;
  }

  .home-hero__actions {
    gap: 0.32rem;
  }

  .home-hero__actions .ds-btn,
  .home-hero__notice {
    min-height: 2.1rem;
    padding: 0.45rem 0.5rem;
    font-size: 0.68rem;
  }

  .home-hero__carousel {
    height: 400px;
    min-height: 400px;
    max-height: 400px;
  }

  .home-hero__carousel-caption {
    bottom: 0.85rem;
    padding: 0.75rem;
  }

  .infrastructure-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .home-hero {
    height: auto;
    max-height: none;
    min-height: auto;
    overflow: visible;
    padding-block: 2.5rem;
  }

  .home-hero__grid {
    grid-template-columns: 1fr;
    gap: 1.4rem;
    min-height: auto;
  }

  .home-hero__info,
  .home-hero__carousel {
    min-height: auto;
  }

  .home-hero__info {
    padding: 1.35rem;
  }

  .home-hero h1 {
    font-size: 2.25rem;
  }

  .home-hero__lead {
    font-size: 0.95rem;
  }

  .home-hero__credentials {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-hero__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .home-hero__stat {
    min-height: 5.2rem;
  }

  .home-hero__actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-hero__notice {
    grid-column: 1 / -1;
  }

  .home-hero__carousel {
    height: 350px;
    min-height: 350px;
    max-height: 350px;
  }

  .course-feature-card,
  .admission-cta__inner {
    grid-template-columns: 1fr;
  }

  .course-feature-card__image img {
    min-height: 20rem;
  }

  .home-image-stack {
    min-height: 27rem;
  }

  .home-section,
  .admission-cta,
  .contact-cta {
    padding-block: 3.5rem;
  }

  .home-section-heading h2,
  .home-copy h2,
  .admission-cta h2,
  .contact-cta h2 {
    font-size: 2.1rem;
  }
}

@media (max-width: 767.98px) {
  .home-hero {
    padding-block: 2rem;
  }

  .home-hero h1 {
    font-size: 2rem;
  }

  .home-hero__info {
    padding: 1.25rem;
    border-radius: var(--radius-xl);
  }

  .home-hero__credentials {
    grid-template-columns: 1fr;
  }

  .home-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-hero__stat {
    min-height: 6.6rem;
  }

  .home-hero__carousel {
    height: 300px;
    min-height: 300px;
    max-height: 300px;
    border-radius: var(--radius-xl);
  }

  .home-hero__carousel-caption {
    left: var(--space-3);
    right: var(--space-3);
    bottom: var(--space-6);
    padding: var(--space-4);
  }

  .home-hero__actions {
    grid-template-columns: 1fr;
  }

  .admission-cta__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .home-alert {
    margin-top: 0;
  }

  .home-alert__inner {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .home-alert__inner i {
    margin-left: 0;
  }

  .credential-row,
  .infrastructure-grid {
    grid-template-columns: 1fr;
  }

  .infra-card,
  .infra-card--large {
    grid-column: auto;
    grid-row: auto;
    min-height: 18rem;
  }

  .gallery-tile--wide {
    aspect-ratio: 1.4 / 1;
  }

  .notice-panel,
  .event-item {
    grid-template-columns: 1fr;
  }

  .notice-panel__date {
    width: 100%;
    height: auto;
    min-height: 5rem;
  }
}

@media (max-width: 575.98px) {
  .home-section,
  .admission-cta,
  .contact-cta {
    padding-block: 3rem;
  }

  .home-section-heading h2,
  .home-copy h2,
  .admission-cta h2,
  .contact-cta h2 {
    font-size: 1.78rem;
  }

  .home-hero__credentials {
    grid-template-columns: 1fr;
  }

  .home-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-hero__stat {
    min-height: 5rem;
  }

  .home-hero__carousel {
    height: 270px;
    min-height: 270px;
    max-height: 270px;
  }

  .home-hero__carousel-caption {
    left: var(--space-2);
    right: var(--space-2);
    bottom: var(--space-4);
    padding: var(--space-3);
  }

  .home-hero__carousel-caption strong {
    font-size: var(--font-size-base);
  }

  .home-hero__carousel-caption p {
    font-size: var(--font-size-sm);
  }

  .home-hero__carousel .carousel-control-prev,
  .home-hero__carousel .carousel-control-next {
    width: 3.5rem;
  }
}

@media (max-width: 374.98px) {
  .home-hero h1 {
    font-size: 1.72rem;
  }

  .home-hero__stats {
    grid-template-columns: 1fr;
  }

  .home-hero__carousel {
    height: 250px;
    min-height: 250px;
    max-height: 250px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}

/* Homepage redesign: all visual overrides are isolated to index.html. */
.home-page .home-main {
  --home-medical-blue: #1677b8;
  --home-deep-blue: #174a7e;
  --home-sky-blue: #4db7e5;
  --home-soft-cyan: #eaf8fc;
  --home-light-bg: #f7f9fb;
  --home-soft-green: #dff4e7;
  --home-green: #3f9b69;
  --home-shadow-sm: 0 10px 28px rgba(23, 74, 126, 0.08);
  --home-shadow-md: 0 18px 44px rgba(23, 74, 126, 0.13);
  overflow: visible;
  overflow-x: clip;
  color: #315d75;
  background: #ffffff;
}

.home-page .home-main img {
  display: block;
}

.home-page .home-hero {
  position: relative;
  display: block;
  height: auto;
  min-height: 0;
  max-height: none;
  padding-block: 3.25rem 4.25rem;
  overflow: hidden;
  isolation: auto;
  background: linear-gradient(180deg, #f4fbfe 0%, #ffffff 78%);
  border-bottom: 1px solid #e3eff4;
}

.home-page .home-hero::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 0.3rem;
  background: linear-gradient(
    90deg,
    var(--home-medical-blue) 0 36%,
    var(--home-sky-blue) 36% 72%,
    #63b984 72%
  );
}

.home-page .home-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
  align-items: center;
  gap: 3rem;
  min-height: 0;
}

.home-page .home-hero__info {
  display: block;
  min-width: 0;
  height: auto;
  padding: 0 0.75rem 0 0;
  overflow: visible;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: none;
}

.home-page .home-hero__info::before {
  display: none;
}

.home-page .home-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  width: fit-content;
  max-width: 100%;
  margin-bottom: 1rem;
  padding: 0.45rem 0.75rem;
  color: var(--home-deep-blue);
  background: #ffffff;
  border: 1px solid #bfe4f3;
  border-radius: 999rem;
  box-shadow: 0 4px 14px rgba(23, 74, 126, 0.06);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
}

.home-page .home-eyebrow i {
  color: var(--home-medical-blue);
}

.home-page .home-hero__trust {
  margin-bottom: 0.45rem;
  color: var(--home-green);
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.home-page .home-hero h1 {
  max-width: 42rem;
  margin-bottom: 1rem;
  color: var(--home-deep-blue);
  font-size: 3rem;
  line-height: 1.08;
  letter-spacing: 0;
}

.home-page .home-hero h1 span {
  display: block;
  color: var(--home-medical-blue);
}

.home-page .home-hero__lead {
  display: block;
  max-width: 42rem;
  margin-bottom: 1.2rem;
  overflow: visible;
  color: #52788c;
  font-size: 1rem;
  line-height: 1.7;
  -webkit-line-clamp: initial;
}

.home-page .home-hero__credentials {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem 1rem;
  margin-bottom: 1.15rem;
}

.home-page .home-hero__credentials span {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  min-width: 0;
  min-height: 0;
  padding: 0;
  color: #315d75;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.35;
}

.home-page .home-hero__credentials i {
  flex: 0 0 auto;
  margin-top: 0.1rem;
  color: var(--home-green);
  font-size: inherit;
}

.home-page .home-hero__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.6rem;
  margin-bottom: 1.25rem;
}

.home-page .home-hero__stat {
  min-width: 0;
  min-height: 5.1rem;
  padding: 0.8rem 0.65rem;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid #dcebf2;
  border-radius: 0.5rem;
  box-shadow: 0 6px 18px rgba(23, 74, 126, 0.05);
  text-align: left;
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.home-page .home-hero__stat:hover {
  transform: translateY(-0.2rem);
  border-color: #9fd8ef;
  box-shadow: var(--home-shadow-sm);
}

.home-page .home-hero__stat i {
  display: inline-grid;
  place-items: center;
  width: 1.8rem;
  height: 1.8rem;
  margin: 0 0 0.45rem;
  color: var(--home-medical-blue);
  background: var(--home-soft-cyan);
  border: 0;
  border-radius: 50%;
  font-size: 0.78rem;
}

.home-page .home-hero__stat strong {
  display: block;
  overflow-wrap: anywhere;
  color: var(--home-deep-blue);
  font-size: 0.9rem;
  line-height: 1.2;
}

.home-page .home-hero__stat span:last-child {
  display: block;
  margin-top: 0.15rem;
  color: #718f9e;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.25;
}

.home-page .home-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  grid-template-columns: none;
  gap: 0.7rem;
}

.home-page .home-hero__actions .ds-btn,
.home-page .home-hero__notice {
  min-height: 2.8rem;
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  font-size: 0.84rem;
}

.home-page .home-hero__notice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  color: var(--home-deep-blue);
  background: #ffffff;
  border: 1px solid #bfe4f3;
  box-shadow: none;
  font-weight: 700;
  transition:
    transform 180ms ease,
    color 180ms ease,
    background-color 180ms ease,
    border-color 180ms ease;
}

.home-page .home-hero__notice:hover {
  color: var(--home-medical-blue);
  background: var(--home-soft-cyan);
  border-color: #8dd2ec;
  transform: translateY(-1px);
}

.home-page .home-hero__carousel-wrap {
  min-width: 0;
  height: auto;
}

.home-page .home-hero__carousel {
  position: relative;
  height: 470px;
  min-height: 0;
  max-height: none;
  overflow: hidden;
  background: #e8f2f6;
  border: 1px solid #cce4ee;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-md);
}

.home-page .home-hero__carousel::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, transparent 48%, rgba(16, 54, 87, 0.46) 100%);
  pointer-events: none;
}

.home-page .home-hero__carousel .carousel-inner,
.home-page .home-hero__carousel .carousel-item {
  height: 100%;
}

.home-page .home-hero__carousel .carousel-item {
  transition: opacity 800ms ease-in-out;
}

.home-page .home-hero__carousel .carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.01);
  transition: transform 5.5s ease;
}

.home-page .home-hero__carousel .carousel-item.active img {
  transform: scale(1.055);
}

.home-page .home-hero__carousel .carousel-indicators {
  z-index: 4;
  justify-content: flex-end;
  margin: 0 1rem 1rem;
}

.home-page .home-hero__carousel .carousel-indicators [data-bs-target] {
  width: 0.55rem;
  height: 0.55rem;
  margin-inline: 0.2rem;
  background: #ffffff;
  border: 0;
  border-radius: 999rem;
  opacity: 0.7;
  transition:
    width 180ms ease,
    opacity 180ms ease;
}

.home-page .home-hero__carousel .carousel-indicators .active {
  width: 1.65rem;
  background: #ffffff;
  opacity: 1;
}

.home-page .home-hero__carousel .carousel-control-prev,
.home-page .home-hero__carousel .carousel-control-next {
  z-index: 5;
  width: 4rem;
  opacity: 1;
}

.home-page .home-hero__carousel .carousel-control-prev-icon,
.home-page .home-hero__carousel .carousel-control-next-icon {
  width: 2.45rem;
  height: 2.45rem;
  background-color: rgba(255, 255, 255, 0.92);
  background-size: 50%;
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  box-shadow: 0 6px 18px rgba(16, 54, 87, 0.2);
}

.home-page .home-hero__carousel-caption {
  position: absolute;
  left: 1rem;
  right: auto;
  bottom: 1rem;
  z-index: 3;
  width: min(33rem, calc(100% - 6rem));
  max-width: none;
  padding: 0.9rem 1rem;
  color: #315d75;
  background: rgba(255, 255, 255, 0.91);
  border: 1px solid rgba(255, 255, 255, 0.95);
  border-radius: 0.4rem;
  box-shadow: 0 8px 24px rgba(16, 54, 87, 0.18);
  backdrop-filter: blur(10px);
}

.home-page .home-hero__carousel-caption span,
.home-page .course-feature-card__body > span,
.home-page .infra-card span,
.home-page .news-card span,
.home-page .event-item span,
.home-page .placement-card span,
.home-page .notice-panel__label {
  color: var(--home-medical-blue);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
}

.home-page .home-hero__carousel-caption strong {
  display: block;
  margin: 0.2rem 0;
  color: var(--home-deep-blue);
  font-size: 1rem;
  line-height: 1.25;
}

.home-page .home-hero__carousel-caption p {
  margin: 0;
  color: #587d90;
  font-size: 0.8rem;
  line-height: 1.45;
}

.home-page .home-alert {
  position: relative;
  z-index: 4;
  margin-top: -2rem;
}

.home-page .home-alert__inner {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.85rem;
  min-height: 4.25rem;
  padding: 0.9rem 1.1rem;
  color: #315d75;
  background: #ffffff;
  border: 1px solid #c9e4ef;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-sm);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.home-page .home-alert__inner:hover {
  color: var(--home-deep-blue);
  border-color: #87cfe9;
  box-shadow: var(--home-shadow-md);
  transform: translateY(-2px);
}

.home-page .home-alert__inner > strong {
  color: var(--home-deep-blue);
}

.home-page .home-alert__inner > i {
  margin-left: 0;
}

.home-page .home-alert__badge {
  padding: 0.3rem 0.55rem;
  color: #287b4f;
  background: var(--home-soft-green);
  border: 1px solid #bfe3cc;
  border-radius: 999rem;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  animation: softPulse 1.8s ease-in-out infinite;
}

.home-page .home-section {
  position: relative;
  padding-block: 5rem;
}



.home-page .home-section--cyan {
  background: var(--home-soft-cyan);
  border-block: 1px solid #d8eef6;
}

.home-page .home-section-heading {
  max-width: 48rem;
  margin-bottom: 2.5rem;
}

.home-page .home-section-heading.text-center {
  margin-inline: auto;
}

.home-page .home-section-heading h2,
.home-page .home-copy h2,
.home-page .admission-cta h2,
.home-page .contact-cta h2 {
  margin-bottom: 0.9rem;
  color: var(--home-deep-blue);
  font-size: 2.35rem;
  line-height: 1.2;
  letter-spacing: 0;
}

.home-page .home-section-heading p,
.home-page .home-copy p,
.home-page .admission-cta p,
.home-page .contact-cta p {
  color: #648598;
  font-size: 0.98rem;
  line-height: 1.75;
}

.home-page #welcome {
  padding-block: 4.25rem;
}

.home-page #welcome .home-section-heading {
  margin-bottom: 0;
  padding-right: 1.5rem;
}

.home-page .welcome-card {
  position: relative;
  overflow: visible;
  padding: 1.75rem 1.75rem 1.75rem 2rem;
  background: #f2fbfe;
  border: 1px solid #d2ebf4;
  border-left: 0.3rem solid var(--home-medical-blue);
  border-radius: 0.5rem;
  box-shadow: none;
}

.home-page .welcome-card::before {
  display: none;
}

.home-page .welcome-card p {
  color: #3c667d;
  font-size: 1.04rem;
  line-height: 1.8;
}

.home-page .welcome-card__points,
.home-page .placement-list,
.home-page .contact-cta__grid {
  display: grid;
  gap: 0.8rem;
}

.home-page .welcome-card__points {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding-top: 1rem;
  border-top: 1px solid #d3eaf3;
}

.home-page .welcome-card__points span,
.home-page .placement-list span,
.home-page .contact-cta__grid a,
.home-page .contact-cta__grid span {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  min-width: 0;
  color: #315d75;
  font-weight: 600;
  line-height: 1.5;
}

.home-page .welcome-card__points i,
.home-page .placement-list i,
.home-page .contact-cta__grid i {
  flex: 0 0 auto;
  margin-top: 0.25rem;
  color: var(--home-green);
}

.home-page .home-image-stack {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(9rem, 0.65fr);
  align-items: center;
  gap: 0.85rem;
  min-height: 30rem;
}

.home-page .home-image-stack img {
  position: static;
  inset: auto;
  width: 100%;
  object-fit: cover;
  border: 0;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-md);
}

.home-page .home-image-stack__primary {
  width: 100%;
  height: 30rem;
}

.home-page .home-image-stack__secondary {
  width: 100%;
  height: 21rem;
}

.home-page .credential-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
  margin-top: 1.5rem;
}

.home-page .credential-row div {
  min-width: 0;
  padding: 1rem 0.75rem;
  background: #ffffff;
  border: 1px solid #cfe5ee;
  border-radius: 0.5rem;
  text-align: center;
}

.home-page .credential-row strong {
  display: block;
  overflow-wrap: anywhere;
  color: var(--home-medical-blue);
  font-size: 1.2rem;
}

.home-page .credential-row span {
  display: block;
  margin-top: 0.15rem;
  color: #6d8c9d;
  font-size: 0.78rem;
}

.home-page .course-feature-card {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #d7e7ee;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-md);
}

.home-page .course-feature-card__image {
  min-height: 25rem;
  overflow: hidden;
}

.home-page .course-feature-card__image img {
  width: 100%;
  height: 100%;
  min-height: 25rem;
  object-fit: cover;
  transition: transform 650ms ease;
}

.home-page .course-feature-card:hover .course-feature-card__image img {
  transform: scale(1.035);
}

.home-page .course-feature-card__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 2.5rem;
}

.home-page .course-feature-card__body h3 {
  margin-top: 0.45rem;
  color: var(--home-deep-blue);
  font-size: 2rem;
}

.home-page .course-feature-card__body p {
  color: #648598;
  line-height: 1.75;
}

.home-page .course-feature-card__body ul {
  display: grid;
  gap: 0.7rem;
  padding: 1.2rem 0;
  margin: 0 0 1.1rem;
  border-block: 1px solid #e4eef2;
  list-style: none;
}

.home-page .course-feature-card__body li {
  display: flex;
  gap: 0.65rem;
  color: #315d75;
  font-weight: 600;
}

.home-page .course-feature-card__body li i {
  flex: 0 0 auto;
  margin-top: 0.2rem;
  color: var(--home-green);
}

.home-page .course-feature-card__body .ds-btn {
  align-self: flex-start;
}

.home-page .department-tile {
  position: relative;
  display: block;
  height: 100%;
  min-height: 13.5rem;
  padding: 1.5rem;
  overflow: hidden;
  color: #315d75;
  background: #ffffff;
  border: 1px solid #dce8ee;
  border-radius: 0.5rem;
  box-shadow: 0 8px 24px rgba(23, 74, 126, 0.05);
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.home-page .department-tile::after {
  content: "\f061";
  position: absolute;
  right: 1.25rem;
  bottom: 1.15rem;
  color: #88b8cf;
  font-family: FontAwesome;
  font-size: 0.85rem;
  transition:
    color 180ms ease,
    transform 180ms ease;
}

.home-page .department-tile:hover {
  color: #315d75;
  border-color: #92d1e9;
  box-shadow: var(--home-shadow-sm);
  transform: translateY(-0.3rem);
}

.home-page .department-tile:hover::after {
  color: var(--home-medical-blue);
  transform: translateX(0.2rem);
}

.home-page .department-tile > i {
  display: inline-grid;
  place-items: center;
  width: 2.8rem;
  height: 2.8rem;
  margin-bottom: 1rem;
  color: var(--home-medical-blue);
  background: var(--home-soft-cyan);
  border: 1px solid #cbe9f4;
  border-radius: 0.5rem;
}

.home-page .department-tile h3 {
  padding-right: 1.4rem;
  color: var(--home-deep-blue);
  font-size: 1.1rem;
}

.home-page .department-tile p {
  margin-bottom: 1.2rem;
  color: #6a8999;
  font-size: 0.9rem;
  line-height: 1.65;
}

.home-page .stats-band {
  padding-block: 2.5rem;
  background: #ffffff;
  border-block: 1px solid #dfeaf0;
}

.home-page .stats-band .row > div:not(:last-child) {
  border-right: 1px solid #dce8ee;
}

.home-page .stat-card {
  height: 100%;
  padding: 0.75rem 1rem;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  text-align: center;
}

.home-page .stat-card strong {
  display: block;
  color: var(--home-medical-blue);
  font-size: 2.55rem;
  line-height: 1;
}

.home-page .stat-card span:last-child {
  display: block;
  margin-top: 0.55rem;
  color: #567b8e;
  font-weight: 600;
}

.home-page .infrastructure-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-flow: dense;
  grid-auto-rows: 14rem;
  gap: 0.85rem;
}

.home-page .infra-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  background: #dcebf1;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-sm);
}

.home-page .infra-card--large {
  grid-column: span 2;
  grid-row: span 2;
}

.home-page .infra-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 650ms ease;
}

.home-page .infra-card:hover img {
  transform: scale(1.05);
}

.home-page .infra-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 64%;
  background: linear-gradient(180deg, transparent, rgba(10, 45, 73, 0.78));
}

.home-page .infra-card div {
  position: absolute;
  left: 1.15rem;
  right: 1.15rem;
  bottom: 1.1rem;
  z-index: 2;
}

.home-page .infra-card span {
  color: #d8f4ff;
}

.home-page .infra-card h3 {
  margin: 0.2rem 0 0;
  color: #ffffff;
  font-size: 1.15rem;
}

.home-page .gallery-tile {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 0.82;
  padding: 0;
  overflow: hidden;
  background: #dceaf0;
  border: 0;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-sm);
}

.home-page .gallery-tile--wide {
  aspect-ratio: 21 / 6;
}

.home-page .gallery-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition:
    transform 650ms ease,
    filter 650ms ease;
}

.home-page .gallery-tile::after {
  content: "\f065";
  position: absolute;
  inset: 50% auto auto 50%;
  display: grid;
  place-items: center;
  width: 2.8rem;
  height: 2.8rem;
  color: var(--home-deep-blue);
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  box-shadow: 0 8px 20px rgba(10, 45, 73, 0.2);
  font-family: FontAwesome;
  transform: translate(-50%, -50%) scale(0.85);
  opacity: 0;
  transition:
    opacity 200ms ease,
    transform 200ms ease;
}

.home-page .gallery-tile:hover img,
.home-page .gallery-tile:focus-visible img {
  filter: saturate(1.05);
  transform: scale(1.045);
}

.home-page .gallery-tile:hover::after,
.home-page .gallery-tile:focus-visible::after {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.home-page .news-card {
  position: relative;
  height: 100%;
  padding: 1.6rem 1.6rem 1.5rem;
  background: #ffffff;
  border: 1px solid #dce8ee;
  border-top: 0.25rem solid var(--home-sky-blue);
  border-radius: 0.5rem;
  box-shadow: 0 8px 24px rgba(23, 74, 126, 0.05);
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.home-page .news-card:hover {
  border-color: #9bd6eb;
  box-shadow: var(--home-shadow-sm);
  transform: translateY(-0.3rem);
}

.home-page .news-card h3 {
  margin-top: 0.6rem;
  color: var(--home-deep-blue);
  font-size: 1.25rem;
  line-height: 1.35;
}

.home-page .news-card p {
  color: #6b8999;
  line-height: 1.7;
}

.home-page .news-card a,
.home-page .event-item a {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: var(--home-medical-blue);
  font-weight: 700;
}

.home-page .notice-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1.5rem;
  align-items: center;
  height: 100%;
  padding: 1.75rem;
  background: #ffffff;
  border: 1px solid #cae6f0;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-sm);
}

.home-page .notice-panel__date {
  display: grid;
  place-items: center;
  width: 6.5rem;
  height: 6.5rem;
  padding: 0.7rem;
  color: #287b4f;
  background: var(--home-soft-green);
  border: 1px solid #bfe3cc;
  border-radius: 0.5rem;
  text-align: center;
}

.home-page .notice-panel__date strong {
  font-size: 2.35rem;
  line-height: 1;
}

.home-page .notice-panel__date span {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
}

.home-page .notice-panel h3 {
  margin: 0.35rem 0 0.45rem;
  color: var(--home-deep-blue);
}

.home-page .notice-panel p {
  color: #698797;
}

.home-page .event-timeline {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.home-page .event-item {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem;
  min-width: 0;
  padding: 1.35rem;
  background: #ffffff;
  border: 1px solid #dce8ee;
  border-left: 0.25rem solid var(--home-medical-blue);
  border-radius: 0.5rem;
  box-shadow: 0 8px 24px rgba(23, 74, 126, 0.05);
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.home-page .event-item:last-child {
  grid-column: 1 / -1;
}

.home-page .event-item:hover {
  border-color: #9dd7eb;
  box-shadow: var(--home-shadow-sm);
  transform: translateY(-0.25rem);
}

.home-page .event-item__icon {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  color: var(--home-medical-blue);
  background: var(--home-soft-cyan);
  border: 1px solid #cce8f2;
  border-radius: 0.5rem;
}

.home-page .event-item h3 {
  margin: 0.3rem 0 0.35rem;
  color: var(--home-deep-blue);
  font-size: 1.08rem;
}

.home-page .event-item p {
  margin: 0;
  color: #6b8999;
  font-size: 0.9rem;
  line-height: 1.65;
}

.home-page .testimonial-card {
  position: relative;
  height: 100%;
  padding: 1.6rem;
  background: #ffffff;
  border: 1px solid #dce8ee;
  border-radius: 0.5rem;
  box-shadow: 0 8px 24px rgba(23, 74, 126, 0.05);
}

.home-page .testimonial-card > i {
  color: #79c8e7;
  font-size: 1.65rem;
}

.home-page .testimonial-card p {
  margin-top: 1rem;
  color: #456d82;
  font-size: 0.98rem;
  line-height: 1.75;
}

.home-page .testimonial-card strong {
  color: var(--home-medical-blue);
}

.home-page .placement-list {
  margin-top: 1.4rem;
  padding-top: 1.4rem;
  border-top: 1px solid #dde9ee;
}

.home-page .placement-card {
  position: relative;
  min-height: 26rem;
  overflow: hidden;
  background: #dceaf0;
  border: 0;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-md);
}

.home-page .placement-card img {
  width: 100%;
  height: 26rem;
  min-height: 0;
  object-fit: cover;
}

.home-page .placement-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 55%;
  background: linear-gradient(180deg, transparent, rgba(10, 45, 73, 0.76));
}

.home-page .placement-card div {
  position: absolute;
  left: 1.5rem;
  right: 1.5rem;
  bottom: 1.35rem;
  z-index: 2;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.home-page .placement-card span {
  color: #d8f4ff;
}

.home-page .placement-card h3 {
  max-width: 28rem;
  margin: 0.25rem 0 0;
  color: #ffffff;
  font-size: 1.35rem;
}

.home-page .admission-cta {
  padding-block: 4rem;
  background: var(--home-deep-blue);
  border-block: 1px solid #103b65;
}

.home-page .admission-cta__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2rem;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.home-page .admission-cta .home-eyebrow {
  color: #dff4fc;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.22);
  box-shadow: none;
}

.home-page .admission-cta .home-eyebrow i {
  color: #8ed9fb;
}

.home-page .admission-cta h2 {
  color: #ffffff;
}

.home-page .admission-cta p {
  max-width: 47rem;
  margin-bottom: 0;
  color: #d6e8f1;
}

.home-page .admission-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.home-page .admission-cta .ds-btn-primary {
  color: var(--home-deep-blue);
  background: #ffffff;
}

.home-page .admission-cta .ds-btn-primary:hover {
  color: var(--home-deep-blue);
  background: #eaf8fc;
}

.home-page .admission-cta .ds-btn-secondary {
  color: #ffffff;
  background: transparent;
  border-color: rgba(255, 255, 255, 0.42);
}

.home-page .admission-cta .ds-btn-secondary:hover {
  color: var(--home-deep-blue);
  background: #ffffff;
  border-color: #ffffff;
}

.home-page .contact-cta {
  padding-block: 5rem;
  background: #ffffff;
}

.home-page .contact-cta__content {
  height: 100%;
  padding: 0.75rem 1.75rem 0.75rem 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.home-page .contact-cta__grid {
  margin-top: 1.5rem;
}

.home-page .contact-cta__grid a,
.home-page .contact-cta__grid span {
  padding: 0.8rem 0;
  border-bottom: 1px solid #e1ebf0;
  overflow-wrap: anywhere;
}

.home-page .contact-cta__grid i {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  margin-top: 0;
  color: var(--home-medical-blue);
  background: var(--home-soft-cyan);
  border-radius: 0.4rem;
}

.home-page .contact-cta__map {
  position: relative;
  height: 100%;
  min-height: 25rem;
  overflow: hidden;
  background: #e4eef2;
  border: 1px solid #d3e5ed;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-sm);
}

.home-page .contact-cta__map iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (max-width: 1439.98px) {
  .home-page .home-hero__grid {
    gap: 2rem;
  }

  .home-page .home-hero h1 {
    font-size: 2.65rem;
  }

  .home-page .home-hero__carousel {
    height: 450px;
  }
}

@media (max-width: 1199.98px) {
  .home-page .home-hero {
    height: auto;
    max-height: none;
    padding-block: 2.75rem 4rem;
  }

  .home-page .home-hero__grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 1.5rem;
  }

  .home-page .home-hero__info {
    padding-right: 0;
  }

  .home-page .home-eyebrow {
    margin-bottom: 0.75rem;
    font-size: 0.68rem;
  }

  .home-page .home-hero h1 {
    margin-bottom: 0.75rem;
    font-size: 2.15rem;
  }

  .home-page .home-hero__lead {
    margin-bottom: 0.9rem;
    font-size: 0.88rem;
    line-height: 1.6;
  }

  .home-page .home-hero__credentials {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem 0.75rem;
    margin-bottom: 0.9rem;
  }

  .home-page .home-hero__credentials span {
    min-height: 0;
    padding: 0;
    font-size: 0.72rem;
  }

  .home-page .home-hero__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
    margin-bottom: 0.95rem;
  }

  .home-page .home-hero__stat {
    min-height: 4.55rem;
    padding: 0.6rem 0.55rem;
    border-radius: 0.5rem;
  }

  .home-page .home-hero__stat i {
    width: 1.5rem;
    height: 1.5rem;
    margin-bottom: 0.3rem;
    font-size: 0.68rem;
  }

  .home-page .home-hero__stat strong {
    font-size: 0.78rem;
  }

  .home-page .home-hero__stat span:last-child {
    font-size: 0.6rem;
  }

  .home-page .home-hero__actions {
    gap: 0.45rem;
  }

  .home-page .home-hero__actions .ds-btn,
  .home-page .home-hero__notice {
    min-height: 2.55rem;
    padding: 0.65rem 0.75rem;
    font-size: 0.74rem;
  }

  .home-page .home-hero__carousel {
    height: 420px;
    min-height: 0;
    max-height: none;
  }

  .home-page .home-hero__carousel-caption {
    width: calc(100% - 5rem);
  }

  .home-page .welcome-card__points {
    grid-template-columns: 1fr;
  }

  .home-page .infrastructure-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .home-page .home-hero {
    height: auto;
    min-height: 0;
    max-height: none;
    padding-block: 2.75rem 4.25rem;
    overflow: hidden;
  }

  .home-page .home-hero__grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .home-page .home-hero__info {
    max-width: 46rem;
    min-height: 0;
  }

  .home-page .home-hero h1 {
    font-size: 2.6rem;
  }

  .home-page .home-hero__lead {
    font-size: 0.95rem;
  }

  .home-page .home-hero__credentials {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-page .home-hero__credentials span {
    font-size: 0.8rem;
  }

  .home-page .home-hero__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .home-page .home-hero__stat {
    min-height: 4.8rem;
  }

  .home-page .home-hero__actions {
    grid-template-columns: none;
  }

  .home-page .home-hero__notice {
    grid-column: auto;
  }

  .home-page .home-hero__carousel {
    height: 350px;
    min-height: 0;
    max-height: none;
  }

  .home-page .home-section,
  .home-page .contact-cta {
    padding-block: 4rem;
  }

  .home-page .home-section-heading h2,
  .home-page .home-copy h2,
  .home-page .admission-cta h2,
  .home-page .contact-cta h2 {
    font-size: 2.05rem;
  }

  .home-page #welcome .home-section-heading {
    padding-right: 0;
  }

  .home-page .course-feature-card {
    grid-template-columns: 1fr;
  }

  .home-page .course-feature-card__image,
  .home-page .course-feature-card__image img {
    min-height: 21rem;
  }

  .home-page .home-image-stack {
    min-height: 26rem;
  }

  .home-page .home-image-stack__primary {
    height: 26rem;
  }

  .home-page .home-image-stack__secondary {
    height: 18rem;
  }

  .home-page .event-timeline {
    grid-template-columns: 1fr;
  }

  .home-page .event-item:last-child {
    grid-column: auto;
  }

  .home-page .admission-cta__inner {
    grid-template-columns: 1fr;
  }

  .home-page .contact-cta__content {
    padding: 0 0 1rem;
  }

  .home-page .contact-cta__map {
    min-height: 22rem;
  }
}

@media (max-width: 767.98px) {
  .home-page .home-hero {
    padding-block: 2.25rem 3rem;
  }

  .home-page .home-hero h1 {
    font-size: 2.15rem;
  }

  .home-page .home-hero__credentials {
    grid-template-columns: 1fr;
  }

  .home-page .home-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-page .home-hero__stat {
    min-height: 4.75rem;
  }

  .home-page .home-hero__carousel {
    height: 290px;
    min-height: 0;
    max-height: none;
    border-radius: 0.5rem;
  }

  .home-page .home-hero__carousel-caption {
    left: 0.75rem;
    right: auto;
    bottom: 0.75rem;
    width: calc(100% - 4.5rem);
    padding: 0.7rem 0.8rem;
  }

  .home-page .home-hero__carousel-caption p {
    display: none;
  }

  .home-page .home-hero__carousel .carousel-indicators {
    margin: 0 0.75rem 0.8rem;
  }

  .home-page .home-hero__carousel .carousel-control-prev,
  .home-page .home-hero__carousel .carousel-control-next {
    width: 3rem;
  }

  .home-page .home-alert {
    margin-top: 0;
  }

  .home-page .home-alert__inner {
    grid-template-columns: auto auto minmax(0, 1fr);
    border-radius: 0;
    border-inline: 0;
    box-shadow: none;
  }

  .home-page .home-alert__inner > i {
    display: none;
  }

  .home-page .home-section,
  .home-page .contact-cta {
    padding-block: 3.5rem;
  }

  .home-page #welcome {
    padding-block: 3.5rem;
  }

  .home-page .home-section-heading {
    margin-bottom: 2rem;
  }

  .home-page .welcome-card {
    padding: 1.35rem 1.35rem 1.35rem 1.55rem;
  }

  .home-page .home-image-stack {
    grid-template-columns: minmax(0, 1.3fr) minmax(7rem, 0.7fr);
    min-height: 23rem;
  }

  .home-page .home-image-stack__primary {
    height: 23rem;
  }

  .home-page .home-image-stack__secondary {
    height: 15.5rem;
  }

  .home-page .course-feature-card__body {
    padding: 1.75rem;
  }

  .home-page .stats-band .row > div:nth-child(2) {
    border-right: 0;
  }

  .home-page .stats-band .row > div:nth-child(-n + 2) {
    padding-bottom: 1rem;
    border-bottom: 1px solid #dce8ee;
  }

  .home-page .infra-card,
  .home-page .infra-card--large {
    grid-column: auto;
    grid-row: auto;
    min-height: 17rem;
  }

  .home-page .gallery-tile {
    aspect-ratio: 1 / 1;
  }

  .home-page .gallery-tile--wide {
    aspect-ratio: 1.65 / 1;
  }

  .home-page .notice-panel {
    grid-template-columns: 1fr;
  }

  .home-page .notice-panel__date {
    width: 100%;
    height: auto;
    min-height: 4.75rem;
  }

  .home-page .admission-cta__actions {
    align-items: stretch;
  }
}

@media (max-width: 575.98px) {
  .home-page .home-hero h1 {
    font-size: 1.9rem;
  }

  .home-page .home-hero__lead {
    font-size: 0.88rem;
  }

  .home-page .home-hero__actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .home-page .home-hero__actions .ds-btn,
  .home-page .home-hero__notice {
    width: 100%;
  }

  .home-page .home-hero__carousel {
    height: 270px;
    min-height: 0;
    max-height: none;
  }

  .home-page .home-hero__carousel-caption {
    right: 0.7rem;
    width: auto;
  }

  .home-page .home-hero__carousel-caption span {
    font-size: 0.62rem;
  }

  .home-page .home-hero__carousel-caption strong {
    font-size: 0.82rem;
  }

  .home-page .home-alert__inner {
    grid-template-columns: auto 1fr;
    gap: 0.55rem 0.7rem;
    padding: 0.85rem 1rem;
    font-size: 0.82rem;
  }

  .home-page .home-alert__badge {
    grid-column: 1;
    grid-row: 2;
    width: fit-content;
  }

  .home-page .home-alert__inner > span:not(.home-alert__badge) {
    grid-column: 2;
    grid-row: 1 / span 2;
  }

  .home-page .home-section-heading h2,
  .home-page .home-copy h2,
  .home-page .admission-cta h2,
  .home-page .contact-cta h2 {
    font-size: 1.75rem;
  }

  .home-page .home-section-heading p,
  .home-page .home-copy p,
  .home-page .admission-cta p,
  .home-page .contact-cta p {
    font-size: 0.92rem;
  }

  .home-page .home-image-stack {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .home-page .home-image-stack__primary,
  .home-page .home-image-stack__secondary {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
  }

  .home-page .credential-row {
    gap: 0.45rem;
  }

  .home-page .credential-row div {
    padding: 0.8rem 0.45rem;
  }

  .home-page .credential-row strong {
    font-size: 1rem;
  }

  .home-page .course-feature-card__image,
  .home-page .course-feature-card__image img {
    min-height: 16rem;
  }

  .home-page .course-feature-card__body {
    padding: 1.4rem;
  }

  .home-page .course-feature-card__body h3 {
    font-size: 1.6rem;
  }

  .home-page .infrastructure-grid {
    grid-template-columns: 1fr;
  }

  .home-page .event-item {
    grid-template-columns: 1fr;
  }

  .home-page .admission-cta {
    padding-block: 3.25rem;
  }

  .home-page .admission-cta__actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .home-page .admission-cta__actions .ds-btn {
    width: 100%;
  }

  .home-page .contact-cta__map {
    min-height: 19rem;
  }
}

@media (max-width: 374.98px) {
  .home-page .home-hero h1 {
    font-size: 1.68rem;
  }

  .home-page .home-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.4rem;
  }

  .home-page .home-hero__stat {
    padding: 0.55rem 0.45rem;
  }

  .home-page .home-hero__carousel {
    height: 250px;
    min-height: 0;
    max-height: none;
  }

  .home-page .home-hero__carousel-caption {
    left: 0.55rem;
    right: 0.55rem;
    bottom: 0.55rem;
  }

  .home-page .credential-row {
    grid-template-columns: 1fr;
  }
}

body.home-page {
  max-width: 100%;
  overflow-x: hidden;
}

.home-page .home-quick-facts {
  padding-block: 2.25rem;
  background: #ffffff;
  border-bottom: 1px solid #e3edf2;
}

.home-page .home-quick-facts .home-hero__stats {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-bottom: 0;
}

.home-page .home-quick-facts .home-hero__stat {
  height: 100%;
}

@media (max-width: 1199.98px) {
  .home-page .home-quick-facts .home-hero__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .home-page .home-quick-facts {
    padding-block: 1.75rem;
  }

  .home-page .home-quick-facts .home-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}







/* =========================================================
   PREMIUM ABOUT SECTION
========================================================= */

.about-premium {
    --about-blue: #1677b8;
    --about-deep-blue: #174a7e;
    --about-sky: #4db7e5;
    --about-cyan: #eaf8fc;
    --about-green: #35a56f;

    position: relative;
    overflow: hidden;
    padding: clamp(4.5rem, 0vw, 7rem) 0;
    background:
        radial-gradient(
            circle at 8% 20%,
            rgba(77, 183, 229, 0.13),
            transparent 28rem
        ),
        radial-gradient(
            circle at 95% 85%,
            rgba(53, 165, 111, 0.08),
            transparent 25rem
        ),
        linear-gradient(
            180deg,
            #f7fbfd 0%,
            #ffffff 50%,
            #f5fbfd 100%
        );
}


/* Decorative background circles */

.about-premium__decoration {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.about-premium__decoration--left {
    top: 7rem;
    left: -9rem;

    width: 19rem;
    height: 19rem;

    border: 3rem solid rgba(77, 183, 229, 0.06);
}

.about-premium__decoration--right {
    right: -8rem;
    bottom: -9rem;

    width: 22rem;
    height: 22rem;

    border: 4rem solid rgba(53, 165, 111, 0.05);
}


/* =========================================================
   HEADING
========================================================= */

.about-heading {
    max-width: 780px;
    margin: 0 auto clamp(2.8rem, 5vw, 4.5rem);
    text-align: center;
}

.about-heading__label {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 1rem;
    padding: 0.55rem 1rem;
    color: var(--about-blue);
    background: #fff;
    border: 1px solid rgba(77, 183, 229, 0.28);
    border-radius: 50rem;
    box-shadow: 0 6px 20px rgba(22, 119, 184, 0.08);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.about-heading h2 {
    margin-bottom: 1rem;

    color: var(--about-deep-blue);

    font-size: clamp(2rem, 4vw, 3.25rem);
    font-weight: 800;
    line-height: 1.12;
}

.about-heading h2 span {
    color: var(--about-blue);
}

.about-heading p {
    max-width: 650px;
    margin: 0 auto;

    color: #64748b;

    font-size: clamp(0.95rem, 1.4vw, 1.08rem);
    line-height: 1.75;
}


/* =========================================================
   IMAGE COMPOSITION
========================================================= */

.about-visual {
    position: relative;

    min-height: 540px;

    padding: 0 4rem 4rem 0;
}


/* Main image */

.about-visual__main {
    position: relative;

    width: 88%;
    height: 480px;

    overflow: hidden;

    background: #dcecf4;

    border: 8px solid #fff;
    border-radius: 28px;

    box-shadow:
        0 30px 70px rgba(23, 74, 126, 0.17),
        0 8px 20px rgba(22, 119, 184, 0.08);
}

.about-visual__main img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.8s cubic-bezier(.2, .8, .2, 1);
}

.about-visual:hover .about-visual__main img {
    transform: scale(1.055);
}


/* Image overlay */

.about-visual__overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            transparent 48%,
            rgba(5, 36, 63, 0.75) 100%
        );

    pointer-events: none;
}


/* Main image caption */

.about-visual__caption {
    position: absolute;
    left: 1.6rem;
    right: 1.6rem;
    bottom: 1.5rem;

    color: #fff;
}

.about-visual__caption span {
    display: flex;
    align-items: center;
    gap: 0.45rem;

    margin-bottom: 0.3rem;

    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
}

.about-visual__caption strong {
    display: block;

    font-size: clamp(1.2rem, 2vw, 1.55rem);
    font-weight: 800;
}


/* Secondary image */

.about-visual__secondary {
    position: absolute;

    right: 0;
    bottom: 0;

    width: 47%;
    height: 225px;

    overflow: hidden;

    background: #fff;

    border: 7px solid #fff;
    border-radius: 22px;

    box-shadow: 0 24px 55px rgba(23, 74, 126, 0.2);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}

.about-visual__secondary:hover {
    transform: translateY(-8px);

    box-shadow: 0 30px 65px rgba(23, 74, 126, 0.25);
}

.about-visual__secondary img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.6s ease;
}

.about-visual__secondary:hover img {
    transform: scale(1.07);
}


/* Secondary image label */

.about-visual__secondary-label {
    position: absolute;

    left: 0.8rem;
    right: 0.8rem;
    bottom: 0.8rem;

    display: flex;
    align-items: center;
    gap: 0.45rem;

    padding: 0.65rem 0.8rem;

    color: #fff;
    background: rgba(23, 74, 126, 0.82);

    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 12px;

    backdrop-filter: blur(8px);

    font-size: 0.78rem;
    font-weight: 700;
}


/* Floating recognition badge */

.about-visual__badge {
    position: absolute;

    top: 2.3rem;
    right: 0.8rem;

    display: flex;
    align-items: center;
    gap: 0.75rem;

    padding: 0.85rem 1rem;

    background: rgba(255, 255, 255, 0.94);

    border: 1px solid rgba(77, 183, 229, 0.25);
    border-radius: 15px;

    box-shadow: 0 15px 40px rgba(23, 74, 126, 0.17);

    backdrop-filter: blur(10px);

    animation: aboutBadgeFloat 4s ease-in-out infinite;
}

.about-visual__badge-icon {
    display: grid;
    place-items: center;

    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    color: var(--about-green);
    background: #eaf8f0;

    border-radius: 12px;

    font-size: 1.15rem;
}

.about-visual__badge strong,
.about-visual__badge span {
    display: block;
}

.about-visual__badge strong {
    color: var(--about-deep-blue);

    font-size: 0.85rem;
}

.about-visual__badge span {
    margin-top: 0.1rem;

    color: #64748b;

    font-size: 0.7rem;
}


/* =========================================================
   CONTENT
========================================================= */

.about-content {
    padding-left: clamp(0rem, 2vw, 1.5rem);
}

.about-content__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;

    margin-bottom: 1rem;

    color: var(--about-blue);

    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.about-content__eyebrow > span {
    width: 32px;
    height: 3px;

    background: var(--about-sky);

    border-radius: 50rem;
}

.about-content h2 {
    max-width: 650px;

    margin-bottom: 1.35rem;

    color: var(--about-deep-blue);

    font-size: clamp(2rem, 3.5vw, 3rem);
    font-weight: 800;
    line-height: 1.13;
}

.about-content h2 span {
    color: var(--about-blue);
}

.about-content p {
    margin-bottom: 1rem;

    color: #64748b;

    font-size: 0.98rem;
    line-height: 1.8;
}

.about-content__lead strong {
    color: var(--about-deep-blue);
}


/* =========================================================
   FEATURE ITEMS
========================================================= */

.about-features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 0.85rem;

    margin: 1.6rem 0;
}

.about-feature {
    display: flex;
    align-items: center;
    gap: 0.8rem;

    min-width: 0;

    padding: 0.9rem;

    background: rgba(255, 255, 255, 0.9);

    border: 1px solid rgba(77, 183, 229, 0.2);
    border-radius: 15px;

    box-shadow: 0 8px 25px rgba(22, 119, 184, 0.07);

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

.about-feature:hover {
    transform: translateY(-5px);

    border-color: rgba(22, 119, 184, 0.45);

    box-shadow: 0 15px 35px rgba(22, 119, 184, 0.12);
}

.about-feature__icon {
    display: grid;
    place-items: center;

    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    color: var(--about-blue);
    background: var(--about-cyan);

    border-radius: 13px;

    font-size: 1rem;
}

.about-feature__icon i {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;

    margin: 0;
    padding: 0;

    font-size: 1.15rem;
    line-height: 1;

    text-align: center;
}

.about-feature:hover .about-feature__icon {
    color: #ffffff;
    background: var(--about-blue);

    transform: scale(1.05);
}


/* ==========================================================
   TEXT AREA
========================================================== */

.about-feature > div {
    flex: 1 1 auto;
    min-width: 0;
}


.about-feature strong,
.about-feature > div > span {
    display: block;
}


.about-feature strong {
    margin: 0;

    color: var(--about-deep-blue);

    font-size: 0.88rem;
    font-weight: 700;

    line-height: 1.35;
}


.about-feature > div > span {
    margin-top: 0.2rem;

    color: #718096;

    font-size: 0.72rem;

    line-height: 1.4;
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .about-feature {
        min-height: 82px;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .about-features {
        grid-template-columns: 1fr;
        gap: 0.8rem;
    }

    .about-feature {
        min-height: 80px;

        padding: 0.85rem 0.9rem;

        gap: 0.85rem;
    }

    .about-feature__icon {
        width: 50px;
        height: 50px;

        min-width: 50px;
        min-height: 50px;

        flex-basis: 50px;
    }

    .about-feature__icon i {
        font-size: 1.05rem;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 374.98px) {

    .about-feature {
        min-height: 76px;

        padding: 0.75rem;

        gap: 0.75rem;

        border-radius: 14px;
    }

    .about-feature__icon {
        width: 46px;
        height: 46px;

        min-width: 46px;
        min-height: 46px;

        flex-basis: 46px;

        border-radius: 12px;
    }

    .about-feature__icon i {
        font-size: 1rem;
    }

    .about-feature strong {
        font-size: 0.84rem;
    }

    .about-feature > div > span {
        font-size: 0.69rem;
    }

}

.about-feature strong,
.about-feature span {
    display: block;
}

.about-feature strong {
    color: var(--about-deep-blue);

    font-size: 0.83rem;
}

.about-feature span {
    margin-top: 0.15rem;

    color: #718096;

    font-size: 0.7rem;
}


/* =========================================================
   AFFILIATION CARDS
========================================================= */

.about-affiliations {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 0.75rem;

    margin-top: 1.8rem;
}

.affiliation-card {
    position: relative;

    display: flex;
    align-items: center;
    gap: 0.7rem;

    min-width: 0;

    padding: 1rem 0.8rem;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f5fbfe
        );

    border: 1px solid rgba(77, 183, 229, 0.25);
    border-radius: 16px;

    box-shadow: 0 9px 25px rgba(22, 119, 184, 0.08);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease;
}

.affiliation-card::before {
    content: "";

    position: absolute;
    left: 0;
    top: 20%;
    bottom: 20%;

    width: 3px;

    background: var(--about-blue);

    border-radius: 0 5px 5px 0;

    transition: top 0.3s ease, bottom 0.3s ease;
}

.affiliation-card:hover {
    transform: translateY(-6px);

    border-color: rgba(22, 119, 184, 0.45);

    box-shadow: 0 18px 38px rgba(22, 119, 184, 0.14);
}

.affiliation-card:hover::before {
    top: 0;
    bottom: 0;
}

.affiliation-card__icon {
    display: grid;
    place-items: center;

    width: 43px;
    height: 43px;

    flex: 0 0 43px;

    color: var(--about-blue);
    background: var(--about-cyan);

    border-radius: 12px;
}

.affiliation-card strong,
.affiliation-card span {
    display: block;
}

.affiliation-card strong {
    color: var(--about-deep-blue);

    font-size: 0.88rem;
}

.affiliation-card span {
    margin-top: 0.1rem;

    color: #718096;

    font-size: 0.7rem;
}

.affiliation-card__check {
    margin-left: auto;

    color: var(--about-green);

    font-size: 0.9rem;
}


/* =========================================================
   ANIMATION
========================================================= */

@keyframes aboutBadgeFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199.98px) {

    .about-visual {
        min-height: 500px;
    }

    .about-visual__main {
        height: 440px;
    }

    .about-visual__secondary {
        height: 200px;
    }

    .about-affiliations {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 991.98px) {

    .about-premium {
        padding: 4.5rem 0;
    }

    .about-visual {
        max-width: 700px;
        min-height: 540px;

        margin: 0 auto 1rem;
    }

    .about-visual__main {
        height: 470px;
    }

    .about-content {
        padding-left: 0;
    }

    .about-content h2 {
        max-width: 720px;
    }

    .about-affiliations {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}


@media (max-width: 767.98px) {

    .about-heading {
        margin-bottom: 2.5rem;
    }

    .about-visual {
        min-height: 480px;

        padding: 0 2.5rem 3.5rem 0;
    }

    .about-visual__main {
        width: 92%;
        height: 410px;

        border-width: 6px;
        border-radius: 22px;
    }

    .about-visual__secondary {
        width: 48%;
        height: 180px;

        border-width: 5px;
        border-radius: 18px;
    }

    .about-visual__badge {
        top: 1.5rem;
        right: 0;

        padding: 0.7rem 0.8rem;
    }

    .about-features {
        grid-template-columns: 1fr;
    }

    .about-affiliations {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 575.98px) {

    .about-premium {
        padding: 3.8rem 0;
    }

    .about-heading__label {
        font-size: 0.7rem;
    }

    .about-visual {
        min-height: auto;

        padding: 0;

        display: grid;
        gap: 1rem;
    }

    .about-visual__main {
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 3;
    }

    .about-visual__secondary {
        position: relative;
        right: auto;
        bottom: auto;

        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .about-visual__badge {
        top: 1rem;
        right: 1rem;
    }

    .about-content {
        margin-top: 1rem;
    }

    .about-content h2 {
        font-size: 2rem;
    }
}


@media (max-width: 374.98px) {

    .about-premium {
        padding: 3rem 0;
    }

    .about-visual__caption {
        left: 1rem;
        right: 1rem;
        bottom: 1rem;
    }

    .about-visual__badge {
        position: relative;
        top: auto;
        right: auto;

        width: 100%;
    }

    .about-feature {
        padding: 0.8rem;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .about-visual__badge {
        animation: none;
    }

    .about-visual__main img,
    .about-visual__secondary,
    .about-visual__secondary img,
    .about-feature,
    .affiliation-card {
        transition: none;
    }
}





/* ==========================================================
   PREMIUM WELCOME SECTION
========================================================== */

.jp-welcome {
    --jp-blue: #1677B8;
    --jp-deep: #174A7E;
    --jp-sky: #4DB7E5;
    --jp-cyan: #EAF8FC;
    --jp-green: #3BAA78;
    --jp-text: #5F6F7E;

    position: relative;
    overflow: hidden;

    padding: clamp(4.5rem, 7vw, 7rem) 0;

    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(77, 183, 229, 0.12),
            transparent 30rem
        ),
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f8fcfe 55%,
            #eef9fc 100%
        );
}


/* ==========================================================
   DECORATIVE BACKGROUND
========================================================== */

.jp-welcome__shape {
    position: absolute;

    pointer-events: none;

    border-radius: 50%;
}


.jp-welcome__shape--one {
    width: 350px;
    height: 350px;

    left: -220px;
    top: -120px;

    border: 60px solid rgba(77, 183, 229, 0.07);
}


.jp-welcome__shape--two {
    width: 250px;
    height: 250px;

    right: -140px;
    bottom: -120px;

    border: 45px solid rgba(59, 170, 120, 0.06);
}


/* ==========================================================
   LEFT INTRO
========================================================== */

.jp-welcome__intro {
    position: relative;

    max-width: 540px;
}


.jp-welcome__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;

    margin-bottom: 1.4rem;

    color: #637787;

    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.4;
}


.jp-welcome__eyebrow strong {
    display: block;

    color: var(--jp-blue);

    font-size: 0.82rem;
}


.jp-welcome__eyebrow-icon {
    display: grid;
    place-items: center;

    width: 44px;
    height: 44px;

    flex: 0 0 44px;

    color: #ffffff;

    background: var(--jp-blue);

    border-radius: 13px;

    box-shadow:
        0 10px 25px rgba(22, 119, 184, 0.23);
}


.jp-welcome__intro h2 {
    margin: 0;

    color: var(--jp-deep);

    font-size: clamp(2.25rem, 4.2vw, 3.8rem);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.035em;
}


.jp-welcome__intro h2 span {
    color: var(--jp-blue);
}


.jp-welcome__line {
    position: relative;

    width: 90px;
    height: 4px;

    margin: 1.6rem 0;

    overflow: hidden;

    background: #d9eef7;

    border-radius: 20px;
}


.jp-welcome__line span {
    position: absolute;

    left: 0;
    top: 0;

    width: 42px;
    height: 100%;

    background: var(--jp-sky);

    border-radius: inherit;

    animation: welcomeLine 3s ease-in-out infinite;
}


.jp-welcome__subtitle {
    max-width: 470px;

    margin-bottom: 1.8rem;

    color: var(--jp-text);

    font-size: 1rem;
    line-height: 1.8;
}


/* Identity */

.jp-welcome__identity {
    display: inline-flex;
    align-items: center;
    gap: 0.85rem;

    padding: 0.85rem 1rem;

    background: rgba(255, 255, 255, 0.8);

    border: 1px solid rgba(22, 119, 184, 0.12);
    border-radius: 16px;

    box-shadow:
        0 10px 35px rgba(23, 74, 126, 0.08);

    backdrop-filter: blur(10px);
}


.jp-welcome__identity-icon {
    display: grid;
    place-items: center;

    width: 45px;
    height: 45px;

    flex: 0 0 45px;

    color: var(--jp-blue);

    background: var(--jp-cyan);

    border-radius: 13px;

    font-size: 1.05rem;
}


.jp-welcome__identity span,
.jp-welcome__identity strong {
    display: block;
}


.jp-welcome__identity span {
    margin-bottom: 0.1rem;

    color: #7a8b98;

    font-size: 0.68rem;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: 0.07em;
}


.jp-welcome__identity strong {
    color: var(--jp-deep);

    font-size: 0.85rem;
}


/* ==========================================================
   MAIN CARD
========================================================== */

.jp-welcome__card {
    position: relative;

    padding: clamp(1.5rem, 3vw, 2.5rem);

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.98),
            rgba(246, 252, 254, 0.96)
        );

    border: 1px solid rgba(22, 119, 184, 0.14);
    border-radius: 28px;

    box-shadow:
        0 30px 80px rgba(23, 74, 126, 0.12),
        0 5px 20px rgba(22, 119, 184, 0.05);
}


.jp-welcome__card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 45px;

    width: 90px;
    height: 4px;

    background: linear-gradient(
        90deg,
        var(--jp-blue),
        var(--jp-sky)
    );

    border-radius: 0 0 10px 10px;
}


/* ==========================================================
   CARD HEADER
========================================================== */

.jp-welcome__card-header {
    display: flex;
    align-items: center;
    gap: 1rem;

    padding-bottom: 1.4rem;
    margin-bottom: 1.35rem;

    border-bottom: 1px solid #e7f0f4;
}


.jp-welcome__quote {
    display: grid;
    place-items: center;

    width: 55px;
    height: 55px;

    flex: 0 0 55px;

    color: #ffffff;

    background: var(--jp-blue);

    border-radius: 17px;

    box-shadow:
        0 10px 25px rgba(22, 119, 184, 0.22);

    font-size: 1.1rem;
}


.jp-welcome__card-header span {
    display: block;

    margin-bottom: 0.25rem;

    color: var(--jp-blue);

    font-size: 0.69rem;
    font-weight: 800;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}


.jp-welcome__card-header h3 {
    margin: 0;

    color: var(--jp-deep);

    font-size: clamp(1rem, 2vw, 1.3rem);
    font-weight: 750;
    line-height: 1.35;
}


.jp-welcome__description {
    margin-bottom: 1.5rem;

    color: var(--jp-text);

    font-size: 0.94rem;
    line-height: 1.8;
}


/* ==========================================================
   POINT CARDS
========================================================== */

.jp-welcome__points {
    display: grid;

    gap: 0.75rem;
}


.jp-welcome__point {
    position: relative;

    display: grid;

    grid-template-columns:
        auto
        auto
        minmax(0, 1fr)
        auto;

    align-items: center;

    gap: 0.85rem;

    padding: 1rem;

    overflow: hidden;

    background: #ffffff;

    border: 1px solid #e4eff4;
    border-radius: 17px;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}


.jp-welcome__point::before {
    content: "";

    position: absolute;

    left: 0;
    top: 50%;

    width: 3px;
    height: 0;

    background: var(--jp-blue);

    transform: translateY(-50%);

    transition: height 0.3s ease;
}


.jp-welcome__point:hover {
    transform: translateX(6px);

    border-color: rgba(22, 119, 184, 0.28);

    box-shadow:
        0 12px 30px rgba(22, 119, 184, 0.1);
}


.jp-welcome__point:hover::before {
    height: 60%;
}


/* Number */

.jp-welcome__point-number {
    color: #c5dce8;

    font-size: 0.72rem;
    font-weight: 800;
}


/* Icon */

.jp-welcome__point-icon {
    display: grid;
    place-items: center;

    width: 47px;
    height: 47px;

    flex: 0 0 47px;

    color: var(--jp-blue);

    background: var(--jp-cyan);

    border-radius: 13px;

    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}


.jp-welcome__point:hover .jp-welcome__point-icon {
    color: #ffffff;

    background: var(--jp-blue);

    transform: rotate(-5deg);
}


/* Point content */

.jp-welcome__point-content h4 {
    margin: 0 0 0.2rem;

    color: var(--jp-deep);

    font-size: 0.9rem;
    font-weight: 750;
}


.jp-welcome__point-content p {
    margin: 0;

    color: #778793;

    font-size: 0.72rem;
    line-height: 1.55;
}


/* Check */

.jp-welcome__point-check {
    display: grid;
    place-items: center;

    width: 27px;
    height: 27px;

    color: var(--jp-green);

    background: #eaf8f1;

    border-radius: 50%;

    font-size: 0.65rem;
}


/* ==========================================================
   BOTTOM INFORMATION BAR
========================================================== */

.jp-welcome__footer {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 0;

    margin-top: 1.5rem;

    padding-top: 1.4rem;

    border-top: 1px solid #e5eef3;
}


.jp-welcome__footer > div {
    display: flex;
    align-items: center;
    gap: 0.65rem;

    padding: 0 0.9rem;

    border-right: 1px solid #e3edf2;
}


.jp-welcome__footer > div:first-child {
    padding-left: 0;
}


.jp-welcome__footer > div:last-child {
    border-right: 0;
}


.jp-welcome__footer i {
    color: var(--jp-blue);

    font-size: 1rem;
}


.jp-welcome__footer span {
    color: var(--jp-deep);

    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.35;
}


.jp-welcome__footer small {
    display: block;

    margin-bottom: 0.1rem;

    color: #8998a3;

    font-size: 0.58rem;
    font-weight: 600;

    text-transform: uppercase;
}


/* ==========================================================
   ANIMATION
========================================================== */

@keyframes welcomeLine {

    0%,
    100% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(45px);
    }
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .jp-welcome {
        padding: 4.5rem 0;
    }


    .jp-welcome__intro {
        max-width: 750px;

        margin-bottom: 1rem;
    }


    .jp-welcome__intro h2 {
        max-width: 700px;
    }


    .jp-welcome__subtitle {
        max-width: 680px;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .jp-welcome {
        padding: 4rem 0;
    }


    .jp-welcome__intro h2 {
        font-size: clamp(2rem, 8vw, 2.8rem);
    }


    .jp-welcome__card {
        border-radius: 22px;
    }


    .jp-welcome__point {
        grid-template-columns:
            auto
            minmax(0, 1fr)
            auto;
    }


    .jp-welcome__point-number {
        display: none;
    }


    .jp-welcome__footer {
        grid-template-columns: 1fr;

        gap: 0.8rem;
    }


    .jp-welcome__footer > div,
    .jp-welcome__footer > div:first-child {
        padding: 0 0 0.8rem;

        border-right: 0;
        border-bottom: 1px solid #e5eef3;
    }


    .jp-welcome__footer > div:last-child {
        padding-bottom: 0;

        border-bottom: 0;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 575.98px) {

    .jp-welcome {
        padding: 3.5rem 0;
    }


    .jp-welcome__eyebrow {
        align-items: flex-start;
    }


    .jp-welcome__identity {
        width: 100%;
    }


    .jp-welcome__card {
        padding: 1.25rem;
    }


    .jp-welcome__card-header {
        align-items: flex-start;
    }


    .jp-welcome__quote {
        width: 46px;
        height: 46px;

        flex-basis: 46px;

        border-radius: 13px;
    }


    .jp-welcome__point {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        align-items: start;
    }


    .jp-welcome__point-icon {
        width: 42px;
        height: 42px;
    }


    .jp-welcome__point-check {
        display: none;
    }

}


/* ==========================================================
   320px DEVICES
========================================================== */

@media (max-width: 374.98px) {

    .jp-welcome__intro h2 {
        font-size: 1.85rem;
    }


    .jp-welcome__card {
        padding: 1rem;
    }


    .jp-welcome__point {
        gap: 0.7rem;

        padding: 0.85rem;
    }

}


/* ==========================================================
   ACCESSIBILITY
========================================================== */

@media (prefers-reduced-motion: reduce) {

    .jp-welcome__line span {
        animation: none;
    }


    .jp-welcome__point,
    .jp-welcome__point-icon {
        transition: none;
    }

}




/* =========================================================
   MANAGEMENT COUNCIL — INFINITE AUTO SLIDER
========================================================= */

.management-auto {
    --mc-blue: #1677B8;
    --mc-deep: #174A7E;
    --mc-sky: #4DB7E5;
    --mc-cyan: #EAF8FC;

    position: relative;
    overflow: hidden;

    padding: clamp(0rem, 4vw, 2rem) 0;

    background:
        radial-gradient(
            circle at 10% 20%,
            rgba(77, 183, 229, 0.09),
            transparent 28rem
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f7fbfd 100%
        );
}


/* =========================================================
   HEADING
========================================================= */

.management-auto__heading {
    margin-bottom: 2.5rem;
}


.management-auto__eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 0.5rem;

    margin-bottom: 0.6rem;

    color: var(--mc-blue);

    font-size: 0.75rem;
    font-weight: 800;

    text-transform: uppercase;
    letter-spacing: 0.08em;
}


.management-auto__heading h2 {
    margin: 0;

    color: var(--mc-deep);

    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 800;

    letter-spacing: -0.03em;
}


.management-auto__heading h2 span {
    color: var(--mc-blue);
}


.management-auto__line {
    width: 70px;
    height: 4px;

    margin-top: 0.9rem;

    background:
        linear-gradient(
            90deg,
            var(--mc-blue),
            var(--mc-sky)
        );

    border-radius: 50px;
}


/* =========================================================
   SLIDER
========================================================= */

.management-auto__slider {
    position: relative;

    width: 100%;

    overflow: hidden;

    padding:
        0.75rem
        0
        2rem;
}


/* Left fade */

.management-auto__slider::before {
    content: "";

    position: absolute;

    z-index: 10;

    top: 0;
    bottom: 0;
    left: 0;

    width: 70px;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            #f9fcfd,
            transparent
        );
}


/* Right fade */

.management-auto__slider::after {
    content: "";

    position: absolute;

    z-index: 10;

    top: 0;
    bottom: 0;
    right: 0;

    width: 70px;

    pointer-events: none;

    background:
        linear-gradient(
            270deg,
            #f9fcfd,
            transparent
        );
}


/* =========================================================
   TRACK
========================================================= */

.management-auto__track {
    --card-width: 290px;
    --card-gap: 24px;

    display: flex;

    width: max-content;

    gap: var(--card-gap);

    padding-left: var(--card-gap);

    will-change: transform;

    animation:
        managementInfiniteSlide
        50s
        linear
        infinite;
}



@keyframes managementInfiniteSlide {

    from {
        transform: translateX(0);
    }

    to {
        transform:
            translateX(
                calc(
                    -1 *
                    (var(--card-width) + var(--card-gap)) *
                    6
                )
            );
    }

}


/* =========================================================
   CARD
========================================================= */

.management-auto__card {
    flex:
        0 0
        var(--card-width);

    width: var(--card-width);

    overflow: hidden;

    background: #ffffff;

    border:
        1px solid
        rgba(23, 74, 126, 0.11);

    border-radius: 22px;

    box-shadow:
        0 10px 30px
        rgba(23, 74, 126, 0.09);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}


.management-auto__card:hover {
    transform: translateY(-8px);

    box-shadow:
        0 22px 45px
        rgba(23, 74, 126, 0.16);
}


/* =========================================================
   IMAGE
========================================================= */

.management-auto__image {
    padding:
        14px
        14px
        0;
}


.management-auto__image img {
    display: block;

    width: 100%;
    height: 290px;

    object-fit: cover;
    object-position: center top;

    background: #F3F8FA;

    border-radius: 16px;

    transition:
        transform 0.5s ease;
}


.management-auto__card:hover
.management-auto__image img {
    transform: scale(1.025);
}


/* =========================================================
   CONTENT
========================================================= */

.management-auto__content {
    position: relative;

    padding:
        1.4rem
        1.2rem
        1.5rem;

    text-align: center;
}


.management-auto__content > span {
    display: inline-flex;

    margin-bottom: 0.75rem;

    padding:
        0.35rem
        0.8rem;

    color: var(--mc-blue);
    background: var(--mc-cyan);

    border-radius: 50px;

    font-size: 0.66rem;
    font-weight: 800;

    letter-spacing: 0.05em;
    text-transform: uppercase;
}


.management-auto__content h3 {
    min-height: 2.8rem;

    margin:
        0
        0
        0.45rem;

    color: var(--mc-deep);

    font-size: 1rem;
    font-weight: 800;

    line-height: 1.4;
}


.management-auto__content p {
    margin: 0;

    color: #6b7c89;

    font-size: 0.82rem;
}


/* =========================================================
   LARGE SCREEN
========================================================= */

@media (min-width: 1600px) {

    .management-auto__track {
        --card-width: 310px;
        --card-gap: 28px;
    }


    .management-auto__image img {
        height: 310px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .management-auto__track {
        --card-width: 270px;
        --card-gap: 20px;

        animation-duration: 45s;
    }


    .management-auto__image img {
        height: 275px;
    }


    .management-auto__slider::before,
    .management-auto__slider::after {
        width: 35px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .management-auto {
        padding: 3.5rem 0;
    }


    .management-auto__heading {
        margin-bottom: 2rem;
    }


    .management-auto__heading h2 {
        font-size: 2rem;
    }


    .management-auto__track {
        --card-width: 250px;
        --card-gap: 16px;

        animation-duration: 45s;
    }


    .management-auto__image {
        padding:
            11px
            11px
            0;
    }


    .management-auto__image img {
        height: 250px;
    }


    .management-auto__slider::before,
    .management-auto__slider::after {
        width: 20px;
    }

}


/* =========================================================
   320px MOBILE
========================================================= */

@media (max-width: 374.98px) {

    .management-auto__track {
        --card-width: 235px;
        --card-gap: 14px;
    }


    .management-auto__image img {
        height: 235px;
    }

}





/* =========================================================
   COURSE OFFERED SECTION
========================================================= */

.jp-course-section {
    --course-blue: #1677B8;
    --course-deep: #174A7E;
    --course-sky: #4DB7E5;
    --course-cyan: #EAF8FC;
    --course-green: #38A878;
    --course-text: #627482;

    position: relative;
    overflow: hidden;

    padding: clamp(4rem, 7vw, 7rem) 0;

    background:
        radial-gradient(
            circle at 0% 20%,
            rgba(77, 183, 229, 0.10),
            transparent 28rem
        ),
        radial-gradient(
            circle at 100% 90%,
            rgba(56, 168, 120, 0.06),
            transparent 25rem
        ),
        #F7FBFD;
}


/* =========================================================
   BACKGROUND DECORATION
========================================================= */

.jp-course-shape {
    position: absolute;

    border-radius: 50%;

    pointer-events: none;
}


.jp-course-shape--left {
    top: -130px;
    left: -170px;

    width: 320px;
    height: 320px;

    border: 60px solid rgba(77, 183, 229, 0.05);
}


.jp-course-shape--right {
    right: -130px;
    bottom: -140px;

    width: 270px;
    height: 270px;

    border: 50px solid rgba(56, 168, 120, 0.045);
}


/* =========================================================
   SECTION HEADING
========================================================= */

.jp-course-heading {
    max-width: 750px;

    margin:
        0 auto
        clamp(2.5rem, 5vw, 4rem);
}


.jp-course-eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 0.5rem;

    margin-bottom: 0.9rem;

    padding:
        0.5rem
        0.95rem;

    color: var(--course-blue);
    background: #ffffff;

    border:
        1px solid
        rgba(22, 119, 184, 0.15);

    border-radius: 50px;

    box-shadow:
        0 7px 20px
        rgba(23, 74, 126, 0.06);

    font-size: 0.72rem;
    font-weight: 800;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}


.jp-course-heading h2 {
    margin: 0 0 0.8rem;

    color: var(--course-deep);

    font-size: clamp(2.1rem, 4vw, 3.4rem);
    font-weight: 800;

    line-height: 1.12;
    letter-spacing: -0.035em;
}


.jp-course-heading h2 span {
    color: var(--course-blue);
}


.jp-course-heading p {
    max-width: 600px;

    margin: 0 auto;

    color: var(--course-text);

    font-size: 0.95rem;
    line-height: 1.75;
}


/* Heading line */

.jp-course-heading-line {
    position: relative;

    width: 80px;
    height: 4px;

    margin:
        1.25rem
        auto
        0;

    overflow: hidden;

    background: #D7EDF6;

    border-radius: 20px;
}


.jp-course-heading-line span {
    position: absolute;

    top: 0;
    left: 0;

    width: 35px;
    height: 100%;

    background:
        linear-gradient(
            90deg,
            var(--course-blue),
            var(--course-sky)
        );

    border-radius: inherit;

    animation:
        jpCourseLine
        3s
        ease-in-out
        infinite;
}


/* =========================================================
   MAIN CARD
========================================================= */

.jp-course-card {
    position: relative;

    max-width: 1180px;

    margin: 0 auto;

    overflow: hidden;

    background: #ffffff;

    border:
        1px solid
        rgba(23, 74, 126, 0.10);

    border-radius: 30px;

    box-shadow:
        0 25px 70px
        rgba(23, 74, 126, 0.12);

    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease;
}


.jp-course-card:hover {
    transform: translateY(-7px);

    box-shadow:
        0 35px 85px
        rgba(23, 74, 126, 0.17);
}


/* Top accent */

.jp-course-card::before {
    content: "";

    position: absolute;

    z-index: 10;

    top: 0;
    left: 50%;

    width: 130px;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            var(--course-blue),
            var(--course-sky)
        );

    border-radius:
        0 0
        10px 10px;

    transform: translateX(-50%);

    transition:
        width 0.45s ease;
}


.jp-course-card:hover::before {
    width: 100%;
}


/* =========================================================
   IMAGE
========================================================= */

.jp-course-image {
    position: relative;

    height: 100%;
    min-height: 570px;

    overflow: hidden;

    background: #DDEEF5;
}


.jp-course-image > img {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transition:
        transform
        0.8s
        cubic-bezier(.2, .8, .2, 1);
}


.jp-course-card:hover
.jp-course-image > img {
    transform: scale(1.055);
}


/* Overlay */

.jp-course-image__overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(23, 74, 126, 0.02) 25%,
            rgba(10, 46, 78, 0.78) 100%
        );

    pointer-events: none;
}


/* =========================================================
   IMAGE BADGE
========================================================= */

.jp-course-image__badge {
    position: absolute;

    top: 1.5rem;
    left: 1.5rem;

    display: flex;
    align-items: center;

    gap: 0.7rem;

    padding:
        0.75rem
        0.9rem;

    color: var(--course-deep);
    background: rgba(255, 255, 255, 0.94);

    border:
        1px solid
        rgba(255, 255, 255, 0.7);

    border-radius: 14px;

    box-shadow:
        0 10px 30px
        rgba(23, 74, 126, 0.16);

    backdrop-filter: blur(10px);
}


.jp-course-image__badge > i {
    display: grid;
    place-items: center;

    width: 40px;
    height: 40px;

    color: #ffffff;
    background: var(--course-blue);

    border-radius: 11px;
}


.jp-course-image__badge small,
.jp-course-image__badge strong {
    display: block;
}


.jp-course-image__badge small {
    margin-bottom: 0.05rem;

    color: #7C8D99;

    font-size: 0.6rem;

    text-transform: uppercase;
    letter-spacing: 0.06em;
}


.jp-course-image__badge strong {
    font-size: 0.78rem;
}


/* =========================================================
   IMAGE CAPTION
========================================================= */

.jp-course-image__caption {
    position: absolute;

    left: 1.7rem;
    right: 1.7rem;
    bottom: 1.7rem;

    color: #ffffff;
}


.jp-course-image__caption span {
    display: flex;
    align-items: center;

    gap: 0.5rem;

    margin-bottom: 0.45rem;

    font-size: 0.7rem;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.05em;
}


.jp-course-image__caption h3 {
    max-width: 400px;

    margin: 0;

    color: #ffffff;

    font-size: clamp(1.35rem, 2.5vw, 2rem);
    font-weight: 800;

    line-height: 1.25;
}


/* =========================================================
   CONTENT
========================================================= */

.jp-course-content {
    display: flex;
    flex-direction: column;
    justify-content: center;

    height: 100%;

    padding:
        clamp(2rem, 4vw, 3.7rem);
}


.jp-course-content__top {
    display: flex;
    align-items: center;

    gap: 0.75rem;

    margin-bottom: 1.1rem;
}


/* Number */

.jp-course-number {
    display: grid;
    place-items: center;

    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    color: var(--course-blue);
    background: var(--course-cyan);

    border-radius: 12px;

    font-size: 0.72rem;
    font-weight: 900;
}


/* Label */

.jp-course-label {
    color: var(--course-blue);

    font-size: 0.7rem;
    font-weight: 800;

    letter-spacing: 0.06em;
    text-transform: uppercase;
}


/* Course title */

.jp-course-content > h3 {
    margin:
        0
        0
        1rem;

    color: var(--course-deep);

    font-size: clamp(2rem, 4vw, 3.15rem);
    font-weight: 800;

    line-height: 1.05;
    letter-spacing: -0.035em;
}


.jp-course-content > h3 span {
    color: var(--course-blue);
}


/* Description */

.jp-course-description {
    margin-bottom: 1.7rem;

    color: var(--course-text);

    font-size: 0.95rem;
    line-height: 1.8;
}


/* =========================================================
   SUBJECTS
========================================================= */

.jp-course-subjects {
    display: grid;

    gap: 0.75rem;
}


.jp-course-subject {
    display: flex;
    align-items: center;

    gap: 0.85rem;

    padding:
        0.85rem
        1rem;

    background:
        linear-gradient(
            90deg,
            #F8FCFE,
            #FFFFFF
        );

    border:
        1px solid
        #E4F0F5;

    border-radius: 15px;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}


.jp-course-subject:hover {
    transform: translateX(6px);

    border-color:
        rgba(22, 119, 184, 0.3);

    box-shadow:
        0 9px 25px
        rgba(22, 119, 184, 0.08);
}


.jp-course-subject__icon {
    display: grid;
    place-items: center;

    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    color: var(--course-green);
    background: #EAF8F1;

    border-radius: 11px;

    font-size: 0.75rem;
}


.jp-course-subject small,
.jp-course-subject strong {
    display: block;
}


.jp-course-subject small {
    margin-bottom: 0.1rem;

    color: #83929D;

    font-size: 0.58rem;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.05em;
}


.jp-course-subject strong {
    color: var(--course-deep);

    font-size: 0.8rem;
    font-weight: 750;
}


/* =========================================================
   FOOTER
========================================================= */

.jp-course-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 1rem;

    margin-top: 1.8rem;

    padding-top: 1.5rem;

    border-top:
        1px solid
        #E7EFF3;
}


/* Button */

.jp-course-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 0.7rem;

    min-height: 48px;

    padding:
        0.8rem
        1.25rem;

    color: #ffffff;
    background: var(--course-blue);

    border:
        1px solid
        var(--course-blue);

    border-radius: 12px;

    box-shadow:
        0 10px 25px
        rgba(22, 119, 184, 0.18);

    font-size: 0.8rem;
    font-weight: 700;

    text-decoration: none;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
}


.jp-course-btn:hover {
    color: #ffffff;
    background: var(--course-deep);

    transform: translateY(-3px);

    box-shadow:
        0 15px 30px
        rgba(23, 74, 126, 0.22);
}


.jp-course-btn i {
    transition:
        transform 0.3s ease;
}


.jp-course-btn:hover i {
    transform: translateX(4px);
}


/* Footer information */

.jp-course-footer__note {
    display: flex;
    align-items: center;

    gap: 0.6rem;

    color: var(--course-deep);
}


.jp-course-footer__note > i {
    color: var(--course-blue);

    font-size: 1rem;
}


.jp-course-footer__note span {
    font-size: 0.7rem;
    font-weight: 700;

    line-height: 1.35;
}


.jp-course-footer__note small {
    display: block;

    color: #8A99A3;

    font-size: 0.56rem;
    font-weight: 600;

    text-transform: uppercase;
}


/* =========================================================
   ANIMATION
========================================================= */

@keyframes jpCourseLine {

    0%,
    100% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(45px);
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .jp-course-section {
        padding:
            4.5rem
            0;
    }


    .jp-course-card {
        max-width: 760px;

        border-radius: 25px;
    }


    .jp-course-image {
        min-height: 430px;
    }


    .jp-course-content {
        padding:
            2.5rem;
    }


    .jp-course-content > h3 {
        font-size: 2.6rem;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .jp-course-section {
        padding:
            4rem
            0;
    }


    .jp-course-heading {
        margin-bottom: 2.5rem;
    }


    .jp-course-image {
        min-height: 380px;
    }


    .jp-course-content {
        padding:
            2rem;
    }


    .jp-course-content > h3 {
        font-size: 2.25rem;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .jp-course-section {
        padding:
            3.5rem
            0;
    }


    .jp-course-card {
        border-radius: 20px;
    }


    .jp-course-image {
        min-height: 330px;
    }


    .jp-course-image__badge {
        top: 1rem;
        left: 1rem;

        padding:
            0.6rem
            0.7rem;
    }


    .jp-course-image__badge > i {
        width: 35px;
        height: 35px;
    }


    .jp-course-image__caption {
        left: 1.2rem;
        right: 1.2rem;
        bottom: 1.2rem;
    }


    .jp-course-content {
        padding:
            1.5rem;
    }


    .jp-course-content > h3 {
        font-size: 2rem;
    }


    .jp-course-description {
        font-size: 0.9rem;
    }


    .jp-course-footer {
        align-items: stretch;
        flex-direction: column;
    }


    .jp-course-btn {
        width: 100%;
    }


    .jp-course-footer__note {
        justify-content: center;

        padding-top: 0.4rem;
    }

}


/* =========================================================
   320PX DEVICES
========================================================= */

@media (max-width: 374.98px) {

    .jp-course-section {
        padding:
            3rem
            0;
    }


    .jp-course-heading h2 {
        font-size: 1.9rem;
    }


    .jp-course-image {
        min-height: 290px;
    }


    .jp-course-image__badge strong {
        font-size: 0.68rem;
    }


    .jp-course-content {
        padding:
            1.2rem;
    }


    .jp-course-content > h3 {
        font-size: 1.8rem;
    }


    .jp-course-subject {
        padding:
            0.75rem;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .jp-course-heading-line span {
        animation: none;
    }


    .jp-course-card,
    .jp-course-image > img,
    .jp-course-subject,
    .jp-course-btn,
    .jp-course-btn i {
        transition: none;
    }

}


/* =========================================================
   PREMIUM STATISTICS SECTION
========================================================= */

.jp-stats {
    --stats-blue: #1677B8;
    --stats-deep: #174A7E;
    --stats-sky: #4DB7E5;
    --stats-cyan: #EAF8FC;
    --stats-green: #3BAA78;
    --stats-text: #687A87;

    position: relative;
    overflow: hidden;

    padding: clamp(4rem, 6vw, 6rem) 0;

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(77, 183, 229, 0.11),
            transparent 25rem
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(59, 170, 120, 0.07),
            transparent 25rem
        ),
        linear-gradient(
            180deg,
            #F7FBFD 0%,
            #FFFFFF 100%
        );
}


/* =========================================================
   DECORATION
========================================================= */

.jp-stats__shape {
    position: absolute;

    pointer-events: none;

    border-radius: 50%;
}


.jp-stats__shape--left {
    top: -170px;
    left: -170px;

    width: 330px;
    height: 330px;

    border:
        60px solid
        rgba(77, 183, 229, 0.045);
}


.jp-stats__shape--right {
    right: -140px;
    bottom: -150px;

    width: 290px;
    height: 290px;

    border:
        55px solid
        rgba(59, 170, 120, 0.04);
}


/* =========================================================
   HEADING
========================================================= */

.jp-stats__heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 2rem;

    margin-bottom:
        clamp(2.5rem, 5vw, 3.8rem);
}


.jp-stats__eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 0.5rem;

    margin-bottom: 0.75rem;

    color: var(--stats-blue);

    font-size: 0.72rem;
    font-weight: 800;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}


.jp-stats__heading h2 {
    max-width: 620px;

    margin: 0;

    color: var(--stats-deep);

    font-size:
        clamp(2rem, 4vw, 3.1rem);

    font-weight: 800;

    line-height: 1.1;
    letter-spacing: -0.035em;
}


.jp-stats__heading h2 span {
    color: var(--stats-blue);
}


.jp-stats__heading p {
    max-width: 450px;

    margin: 0;

    color: var(--stats-text);

    font-size: 0.92rem;
    line-height: 1.75;
}


/* =========================================================
   STAT CARD
========================================================= */

.jp-stat-card {
    position: relative;

    height: 100%;
    min-height: 310px;

    padding:
        1.5rem
        1.4rem;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #FFFFFF 0%,
            #FAFDFE 100%
        );

    border:
        1px solid
        rgba(23, 74, 126, 0.10);

    border-radius: 22px;

    box-shadow:
        0 10px 35px
        rgba(23, 74, 126, 0.08);

    transition:
        transform 0.4s cubic-bezier(.2,.8,.2,1),
        box-shadow 0.4s ease,
        border-color 0.4s ease;
}


/* Top blue accent */

.jp-stat-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 50%;

    width: 0;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            var(--stats-blue),
            var(--stats-sky)
        );

    border-radius:
        0 0
        10px 10px;

    transform: translateX(-50%);

    transition: width 0.4s ease;
}


.jp-stat-card:hover {
    transform: translateY(-10px);

    border-color:
        rgba(22, 119, 184, 0.28);

    box-shadow:
        0 25px 55px
        rgba(23, 74, 126, 0.15);
}


.jp-stat-card:hover::before {
    width: 100%;
}


/* =========================================================
   BACKGROUND NUMBER
========================================================= */

.jp-stat-card__number-bg {
    position: absolute;

    right: -5px;
    bottom: -12px;

    color:
        rgba(22, 119, 184, 0.045);

    font-size: 7rem;
    font-weight: 900;

    line-height: 1;

    pointer-events: none;

    transition:
        transform 0.5s ease;
}


.jp-stat-card:hover
.jp-stat-card__number-bg {
    transform:
        translate(-8px, -8px);
}


/* =========================================================
   CARD TOP
========================================================= */

.jp-stat-card__top {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 1rem;

    margin-bottom: 1.5rem;
}


/* Icon */

.jp-stat-card__icon {
    display: grid;
    place-items: center;

    width: 52px;
    height: 52px;

    flex: 0 0 52px;

    color: var(--stats-blue);

    background:
        var(--stats-cyan);

    border:
        1px solid
        rgba(77, 183, 229, 0.13);

    border-radius: 15px;

    font-size: 1.1rem;

    transition:
        color 0.35s ease,
        background 0.35s ease,
        transform 0.35s ease,
        box-shadow 0.35s ease;
}


.jp-stat-card:hover
.jp-stat-card__icon {
    color: #FFFFFF;

    background:
        var(--stats-blue);

    transform:
        rotate(-5deg)
        scale(1.05);

    box-shadow:
        0 10px 25px
        rgba(22, 119, 184, 0.22);
}


/* Tag */

.jp-stat-card__tag {
    padding:
        0.4rem
        0.7rem;

    color: var(--stats-blue);

    background:
        #F1FAFD;

    border:
        1px solid
        rgba(77, 183, 229, 0.16);

    border-radius: 50px;

    font-size: 0.6rem;
    font-weight: 800;

    letter-spacing: 0.06em;
    text-transform: uppercase;
}


/* =========================================================
   COUNTER
========================================================= */

.jp-stat-card__counter {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: flex-start;

    margin-bottom: 0.35rem;
}


.jp-stat-card__counter strong {
    color: var(--stats-deep);

    font-size:
        clamp(2.7rem, 5vw, 4rem);

    font-weight: 850;

    line-height: 1;

    letter-spacing: -0.05em;
}


.jp-stat-card__plus {
    margin:
        0.2rem
        0
        0
        0.25rem;

    color: var(--stats-sky);

    font-size: 1.3rem;
    font-weight: 800;
}


/* =========================================================
   TITLE / DESCRIPTION
========================================================= */

.jp-stat-card h3 {
    position: relative;
    z-index: 2;

    margin:
        0
        0
        0.55rem;

    color: var(--stats-deep);

    font-size: 1rem;
    font-weight: 800;

    line-height: 1.35;
}


.jp-stat-card p {
    position: relative;
    z-index: 2;

    min-height: 44px;

    margin: 0;

    color: var(--stats-text);

    font-size: 0.76rem;
    line-height: 1.55;
}


/* =========================================================
   BOTTOM ACCENT
========================================================= */

.jp-stat-card__bottom {
    position: absolute;

    left: 1.4rem;
    right: 1.4rem;
    bottom: 1.3rem;

    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;
}


.jp-stat-card__bottom span {
    display: block;

    width: 35px;
    height: 3px;

    background:
        var(--stats-sky);

    border-radius: 20px;

    transition:
        width 0.4s ease;
}


.jp-stat-card:hover
.jp-stat-card__bottom span {
    width: 75px;
}


.jp-stat-card__bottom i {
    color:
        rgba(22, 119, 184, 0.35);

    font-size: 0.9rem;

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}


.jp-stat-card:hover
.jp-stat-card__bottom i {
    color: var(--stats-blue);

    transform: translateX(-4px);
}


/* =========================================================
   992px – 1199px
========================================================= */

@media (
    min-width: 992px
)
and (
    max-width: 1199.98px
) {

    .jp-stat-card {
        padding:
            1.3rem
            1.15rem;
    }


    .jp-stat-card__tag {
        font-size: 0.53rem;
    }


    .jp-stat-card h3 {
        font-size: 0.9rem;
    }


    .jp-stat-card p {
        font-size: 0.7rem;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .jp-stats {
        padding:
            4.5rem
            0;
    }


    .jp-stats__heading {
        align-items: flex-start;
        flex-direction: column;

        gap: 1rem;
    }


    .jp-stats__heading p {
        max-width: 650px;
    }


    .jp-stat-card {
        min-height: 300px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .jp-stats {
        padding:
            3.5rem
            0;
    }


    .jp-stats__heading {
        margin-bottom: 2rem;
    }


    .jp-stats__heading h2 {
        font-size: 2rem;
    }


    .jp-stat-card {
        min-height: 250px;

        padding:
            1rem
            0.9rem;

        border-radius: 17px;
    }


    .jp-stat-card__top {
        align-items: flex-start;

        margin-bottom: 1.1rem;
    }


    .jp-stat-card__icon {
        width: 44px;
        height: 44px;

        flex-basis: 44px;

        border-radius: 12px;

        font-size: 0.95rem;
    }


    .jp-stat-card__tag {
        padding:
            0.32rem
            0.5rem;

        font-size: 0.5rem;
    }


    .jp-stat-card__counter strong {
        font-size: 2.6rem;
    }


    .jp-stat-card__plus {
        font-size: 1rem;
    }


    .jp-stat-card h3 {
        font-size: 0.83rem;
    }


    .jp-stat-card p {
        min-height: 0;

        padding-bottom: 2rem;

        font-size: 0.66rem;
    }


    .jp-stat-card__bottom {
        left: 0.9rem;
        right: 0.9rem;
        bottom: 0.9rem;
    }


    .jp-stat-card__number-bg {
        font-size: 5rem;
    }

}


/* =========================================================
   320px
========================================================= */

@media (max-width: 374.98px) {

    .jp-stats {
        padding:
            3rem
            0;
    }


    .jp-stats__heading h2 {
        font-size: 1.8rem;
    }


    /*
       Keep 2 cards per row at 320px,
       but simplify the content.
    */

    .jp-stat-card {
        min-height: 225px;

        padding:
            0.85rem
            0.75rem;
    }


    .jp-stat-card__icon {
        width: 40px;
        height: 40px;

        flex-basis: 40px;
    }


    .jp-stat-card__tag {
        display: none;
    }


    .jp-stat-card__counter strong {
        font-size: 2.35rem;
    }


    .jp-stat-card h3 {
        font-size: 0.78rem;
    }


    .jp-stat-card p {
        font-size: 0.62rem;
        line-height: 1.45;
    }


    .jp-stat-card__bottom {
        left: 0.75rem;
        right: 0.75rem;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .jp-stat-card,
    .jp-stat-card__icon,
    .jp-stat-card__number-bg,
    .jp-stat-card__bottom span,
    .jp-stat-card__bottom i {
        transition: none;
    }

}



/* ==========================================================
   STUDENT VOICES
========================================================== */

.student-voices {
    --sv-blue: #1677B8;
    --sv-deep: #174A7E;
    --sv-sky: #4DB7E5;
    --sv-cyan: #EAF8FC;
    --sv-green: #48A984;
    --sv-text: #687985;

    position: relative;
    overflow: hidden;

    padding: clamp(2rem, 0vw, 6.5rem) 0;

    background: #ffffff;
}


/* ==========================================================
   HEADING
========================================================== */

.student-voices__heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 3rem;

    margin-bottom: clamp(2.5rem, 5vw, 4rem);
}


.student-voices__title {
    max-width: 650px;
}


.student-voices__eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 0.5rem;

    margin-bottom: 0.8rem;

    color: var(--sv-blue);

    font-size: 0.72rem;
    font-weight: 800;

    letter-spacing: 0.09em;
    text-transform: uppercase;
}


.student-voices__eyebrow::before {
    content: "";

    width: 28px;
    height: 2px;

    background: var(--sv-sky);

    border-radius: 20px;
}


.student-voices__heading h2 {
    margin: 0;

    color: var(--sv-deep);

    font-size: clamp(2.1rem, 4vw, 3.6rem);
    font-weight: 800;

    line-height: 1.08;
    letter-spacing: -0.04em;
}


.student-voices__heading h2 span {
    display: block;

    color: var(--sv-blue);
}


.student-voices__heading > p {
    max-width: 430px;

    margin: 0;

    color: var(--sv-text);

    font-size: 0.92rem;
    line-height: 1.8;
}


/* ==========================================================
   FEATURED CARD
========================================================== */

.voice-featured {
    position: relative;

    height: 100%;
    min-height: 430px;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #174A7E 0%,
            #1677B8 100%
        );

    border-radius: 28px;

    box-shadow:
        0 22px 55px
        rgba(23, 74, 126, 0.20);
}


/* Decorative circle */

.voice-featured::before {
    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    right: -150px;
    top: -150px;

    border:
        55px solid
        rgba(255, 255, 255, 0.055);

    border-radius: 50%;
}


.voice-featured::after {
    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    left: -90px;
    bottom: -100px;

    background:
        rgba(77, 183, 229, 0.12);

    border-radius: 50%;
}


.voice-featured__content {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;

    height: 100%;

    padding:
        clamp(2rem, 4vw, 3.2rem);
}


/* Large background quote */

.voice-featured__decor {
    position: absolute;

    right: 2rem;
    bottom: -2.5rem;

    color:
        rgba(255, 255, 255, 0.055);

    font-size: 13rem;

    line-height: 1;

    transform: rotate(-8deg);
}


/* ==========================================================
   FEATURED TOP
========================================================== */

.voice-featured__top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 2.5rem;
}


.voice-featured__label {
    display: inline-flex;

    padding:
        0.48rem
        0.9rem;

    color: #ffffff;

    background:
        rgba(255, 255, 255, 0.12);

    border:
        1px solid
        rgba(255, 255, 255, 0.18);

    border-radius: 50px;

    font-size: 0.66rem;
    font-weight: 700;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}


.voice-featured__quote {
    display: grid;
    place-items: center;

    width: 54px;
    height: 54px;

    color: var(--sv-deep);
    background: #ffffff;

    border-radius: 16px;

    box-shadow:
        0 10px 25px
        rgba(0, 0, 0, 0.10);

    font-size: 1.1rem;

    transition:
        transform 0.35s ease;
}


.voice-featured:hover
.voice-featured__quote {
    transform:
        rotate(-8deg)
        scale(1.08);
}


/* ==========================================================
   FEATURED QUOTE
========================================================== */

.voice-featured blockquote {
    max-width: 650px;

    margin:
        0
        0
        3rem;

    color: #ffffff;

    font-size:
        clamp(1.35rem, 2.4vw, 2rem);

    font-weight: 600;

    line-height: 1.55;
    letter-spacing: -0.02em;
}


/* ==========================================================
   FEATURED FOOTER
========================================================== */

.voice-featured__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 2rem;

    margin-top: auto;

    padding-top: 1.5rem;

    border-top:
        1px solid
        rgba(255, 255, 255, 0.17);
}


.voice-student {
    display: flex;
    align-items: center;

    gap: 0.85rem;
}


.voice-student__avatar {
    display: grid;
    place-items: center;

    width: 52px;
    height: 52px;

    flex: 0 0 52px;

    color: var(--sv-blue);
    background: #ffffff;

    border-radius: 50%;

    box-shadow:
        0 8px 20px
        rgba(0, 0, 0, 0.10);
}


.voice-student strong,
.voice-student span {
    display: block;
}


.voice-student strong {
    margin-bottom: 0.2rem;

    color: #ffffff;

    font-size: 0.9rem;
    font-weight: 750;
}


.voice-student span {
    color:
        rgba(255, 255, 255, 0.70);

    font-size: 0.7rem;
}


.voice-featured__mark {
    text-align: right;
}


.voice-featured__mark > span {
    display: block;

    width: 55px;
    height: 3px;

    margin:
        0
        0
        0.5rem
        auto;

    background: var(--sv-sky);

    border-radius: 20px;

    transition:
        width 0.4s ease;
}


.voice-featured:hover
.voice-featured__mark > span {
    width: 90px;
}


.voice-featured__mark small {
    color:
        rgba(255, 255, 255, 0.65);

    font-size: 0.62rem;

    letter-spacing: 0.05em;
    text-transform: uppercase;
}


/* ==========================================================
   RIGHT SIDE
========================================================== */

.voice-list {
    display: grid;

    height: 100%;

    gap: 1.25rem;
}


/* ==========================================================
   MINI CARD
========================================================== */

.voice-mini {
    position: relative;

    display: flex;

    min-height: 200px;

    overflow: hidden;

    background: #F7FBFD;

    border:
        1px solid
        #E1EEF4;

    border-radius: 22px;

    transition:
        transform 0.4s ease,
        background 0.4s ease,
        border-color 0.4s ease,
        box-shadow 0.4s ease;
}


.voice-mini:hover {
    transform: translateX(7px);

    background: #ffffff;

    border-color:
        rgba(22, 119, 184, 0.25);

    box-shadow:
        0 18px 40px
        rgba(23, 74, 126, 0.11);
}


/* Number */

.voice-mini__number {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 58px;
    flex: 0 0 58px;

    color:
        rgba(22, 119, 184, 0.42);

    background:
        var(--sv-cyan);

    border-right:
        1px solid
        rgba(22, 119, 184, 0.09);

    font-size: 0.72rem;
    font-weight: 900;

    letter-spacing: 0.08em;

    writing-mode: vertical-rl;

    transform: rotate(180deg);
}


/* Content */

.voice-mini__body {
    position: relative;

    display: flex;
    flex-direction: column;

    width: 100%;

    padding: 1.4rem 1.5rem;
}


.voice-mini__icon {
    display: grid;
    place-items: center;

    width: 42px;
    height: 42px;

    margin-bottom: 1rem;

    color: var(--sv-blue);
    background: #ffffff;

    border:
        1px solid
        #DCECF4;

    border-radius: 12px;

    box-shadow:
        0 6px 16px
        rgba(23, 74, 126, 0.07);

    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}


.voice-mini__icon--green {
    color: var(--sv-green);
}


.voice-mini:hover
.voice-mini__icon {
    color: #ffffff;
    background: var(--sv-blue);

    transform: rotate(-5deg);
}


.voice-mini:hover
.voice-mini__icon--green {
    background: var(--sv-green);
}


.voice-mini p {
    margin:
        0
        0
        1.25rem;

    color: var(--sv-deep);

    font-size: 0.9rem;
    font-weight: 600;

    line-height: 1.65;
}


/* Mini Footer */

.voice-mini__footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 1rem;

    margin-top: auto;
}


.voice-mini__footer strong,
.voice-mini__footer span {
    display: block;
}


.voice-mini__footer strong {
    margin-bottom: 0.15rem;

    color: var(--sv-deep);

    font-size: 0.78rem;
    font-weight: 800;
}


.voice-mini__footer span {
    color: var(--sv-text);

    font-size: 0.65rem;
}


.voice-mini__quote {
    color:
        rgba(22, 119, 184, 0.12);

    font-size: 2rem;

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}


.voice-mini:hover
.voice-mini__quote {
    color:
        rgba(22, 119, 184, 0.28);

    transform: scale(1.1);
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .student-voices {
        padding: 4.5rem 0;
    }


    .student-voices__heading {
        align-items: flex-start;
        flex-direction: column;

        gap: 1rem;
    }


    .student-voices__heading > p {
        max-width: 650px;
    }


    .voice-featured {
        min-height: 400px;
    }


    .voice-list {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .voice-mini {
        height: 100%;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .student-voices {
        padding: 4rem 0;
    }


    .student-voices__heading {
        margin-bottom: 2.5rem;
    }


    .student-voices__heading h2 {
        font-size: 2.25rem;
    }


    .voice-featured {
        min-height: auto;

        border-radius: 22px;
    }


    .voice-featured__content {
        min-height: 390px;

        padding: 1.8rem;
    }


    .voice-featured blockquote {
        font-size: 1.35rem;
    }


    .voice-list {
        grid-template-columns: 1fr;
    }


    .voice-mini:hover {
        transform: translateY(-5px);
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 575.98px) {

    .student-voices {
        padding: 3.5rem 0;
    }


    .student-voices__heading h2 {
        font-size: 2rem;
    }


    .student-voices__heading > p {
        font-size: 0.86rem;
    }


    .voice-featured__content {
        min-height: 370px;

        padding: 1.4rem;
    }


    .voice-featured__top {
        margin-bottom: 2rem;
    }


    .voice-featured__quote {
        width: 46px;
        height: 46px;

        border-radius: 13px;
    }


    .voice-featured blockquote {
        margin-bottom: 2rem;

        font-size: 1.15rem;
        line-height: 1.6;
    }


    .voice-featured__footer {
        align-items: flex-start;
        flex-direction: column;

        gap: 1rem;
    }


    .voice-featured__mark {
        display: none;
    }


    .voice-mini {
        min-height: 190px;

        border-radius: 18px;
    }


    .voice-mini__number {
        width: 45px;
        flex-basis: 45px;
    }


    .voice-mini__body {
        padding: 1.2rem;
    }

}


/* ==========================================================
   320PX
========================================================== */

@media (max-width: 374.98px) {

    .student-voices {
        padding: 3rem 0;
    }


    .student-voices__heading h2 {
        font-size: 1.8rem;
    }


    .voice-featured__content {
        min-height: 350px;

        padding: 1.15rem;
    }


    .voice-featured__label {
        font-size: 0.56rem;
    }


    .voice-featured blockquote {
        font-size: 1.05rem;
    }


    .voice-mini__number {
        display: none;
    }


    .voice-mini__body {
        padding: 1.15rem;
    }

}


/* ==========================================================
   REDUCED MOTION
========================================================== */

@media (prefers-reduced-motion: reduce) {

    .voice-featured__quote,
    .voice-featured__mark span,
    .voice-mini,
    .voice-mini__icon,
    .voice-mini__quote {
        transition: none;
    }

}

/* ==================================================
   TESTIMONIAL AUTO CHANGE
================================================== */

.voice-featured__changing,
.voice-mini__body {
    opacity: 1;
    transform: translateY(0);

    transition:
        opacity 0.35s ease,
        transform 0.35s ease;
}


/* Big card fade */

.voice-featured.testimonial-changing
.voice-featured__changing {
    opacity: 0;

    transform: translateY(18px);
}


/* Small cards fade */

.voice-mini.testimonial-changing
.voice-mini__body {
    opacity: 0;

    transform: translateY(12px);
}


/* ==================================================
   PROGRESS BAR
================================================== */

.voice-featured__progress {
    position: absolute;

    z-index: 20;

    left: 0;
    right: 0;
    bottom: 0;

    height: 4px;

    overflow: hidden;

    background:
        rgba(255, 255, 255, 0.12);
}


.voice-featured__progress span {
    display: block;

    width: 0;
    height: 100%;

    background: #4DB7E5;
}


.voice-featured__progress span.testimonial-progress-running {
    animation:
        testimonialAutoProgress
        4s
        linear
        forwards;
}


@keyframes testimonialAutoProgress {

    from {
        width: 0%;
    }

    to {
        width: 100%;
    }

}


/* ==================================================
   REDUCED MOTION
================================================== */

@media (prefers-reduced-motion: reduce) {

    .voice-featured__changing,
    .voice-mini__body {
        transition: none;
    }

}



/* =========================================================
   PLACEMENT — NATURAL / COMPACT FIX
========================================================= */

.placement-journey {
    padding: 5.5rem 0;
    background: #fff;
    overflow: hidden;
}


/* ---------- HEADING ---------- */

.placement-journey__heading {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    align-items: end;
    gap: 3rem;

    margin-bottom: 1.8rem;
}

.placement-journey__heading > div {
    max-width: 650px;
}

.placement-journey__eyebrow {
    margin-bottom: 0.55rem;

    font-size: 0.7rem;
    font-weight: 700;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.placement-journey__heading h2 {
    margin: 0;

    color: #174A7E;

    font-size: clamp(2rem, 3vw, 2.8rem);
    font-weight: 700;

    line-height: 1.15;
    letter-spacing: -0.025em;
}

.placement-journey__heading h2 span {
    color: #1677B8;
}

.placement-journey__heading > p {
    max-width: 440px;

    margin: 0 0 0.2rem auto;

    color: #687C89;

    font-size: 0.9rem;
    line-height: 1.65;
}


/* =========================================================
   MAIN LAYOUT
========================================================= */

.placement-journey__layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(360px, 0.85fr);

    gap: 1.5rem;

    align-items: stretch;

    max-width: 1240px;

    margin: 0 auto;
}


/* =========================================================
   LEFT IMAGE
========================================================= */

.placement-journey__visual {
    position: relative;

    min-width: 0;

    /* Do not use fixed 490px height */
    min-height: 390px;

    overflow: hidden;

    background: #EAF8FC;

    border-radius: 22px;

    box-shadow:
        0 15px 35px
        rgba(23, 74, 126, 0.12);
}

.placement-journey__visual > img {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;

    /* keeps students properly visible */
    object-position: center center;

    transition: transform 0.6s ease;
}

.placement-journey__visual:hover > img {
    transform: scale(1.025);
}


/* =========================================================
   OVERLAY
========================================================= */

.placement-journey__overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(15, 62, 99, 0.58) 0%,
            rgba(15, 62, 99, 0.20) 55%,
            rgba(15, 62, 99, 0.04) 100%
        );
}


/* =========================================================
   IMAGE BADGE
========================================================= */

.placement-journey__badge {
    position: absolute;

    top: 1.2rem;
    left: 1.2rem;

    display: flex;
    align-items: center;

    gap: 0.6rem;

    padding: 0.55rem 0.7rem;

    background: rgba(255, 255, 255, 0.95);

    border-radius: 12px;

    box-shadow:
        0 6px 18px
        rgba(23, 74, 126, 0.12);
}

.placement-journey__badge > span {
    display: grid;
    place-items: center;

    width: 34px;
    height: 34px;

    color: #fff;
    background: #1677B8;

    border-radius: 9px;
}

.placement-journey__badge small {
    display: block;

    margin-bottom: 2px;

    color: #83939D;

    font-size: 0.52rem;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.placement-journey__badge strong {
    display: block;

    color: #174A7E;

    font-size: 0.68rem;
}


/* =========================================================
   IMAGE CONTENT — REDUCED
========================================================= */

.placement-journey__visual-content {
    position: absolute;
    z-index: 3;

    left: 1.8rem;
    right: 1.8rem;
    bottom: 5.3rem;

    max-width: 440px;
}

.placement-journey__visual-content > span {
    display: block;

    margin-bottom: 0.4rem;

    color: #86DCF7;

    font-size: 0.6rem;
    font-weight: 700;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.placement-journey__visual-content h3 {
    margin: 0 0 0.45rem;

    max-width: 420px;

    color: #fff;

    /*
       Previous text was too large.
       Keep it normal.
    */
    font-size: clamp(1.5rem, 2vw, 2rem);
    font-weight: 700;

    line-height: 1.18;
    letter-spacing: -0.02em;
}

.placement-journey__visual-content p {
    max-width: 400px;

    margin: 0;

    color: rgba(255, 255, 255, 0.88);

    font-size: 0.75rem;
    line-height: 1.5;
}


/* =========================================================
   IMAGE FOOTER
========================================================= */

.placement-journey__image-footer {
    position: absolute;
    z-index: 4;

    left: 1.2rem;
    right: 1.2rem;
    bottom: 1.2rem;

    display: flex;
    align-items: center;

    gap: 0.7rem;

    padding: 0.65rem 0.8rem;

    background: rgba(255, 255, 255, 0.94);

    border-radius: 12px;
}

.placement-journey__image-footer > div {
    display: grid;
    place-items: center;

    width: 34px;
    height: 34px;

    flex: 0 0 34px;

    color: #48A984;
    background: #EAF8F1;

    border-radius: 9px;
}

.placement-journey__image-footer > span {
    display: flex;
    align-items: center;

    gap: 0.55rem;

    color: #174A7E;

    font-size: 0.68rem;
    font-weight: 700;
}

.placement-journey__image-footer i {
    color: #4DB7E5;
}


/* =========================================================
   RIGHT PANEL
========================================================= */

.placement-path {
    position: relative;

    display: flex;
    flex-direction: column;

    min-width: 0;

    padding: 1.5rem;

    background: #F8FBFD;

    border: 1px solid #DFEBF1;
    border-radius: 22px;
}


/* Accent */

.placement-path::before {
    content: "";

    position: absolute;

    top: 0;
    left: 2rem;

    width: 80px;
    height: 3px;

    background: #4DB7E5;

    border-radius: 0 0 5px 5px;
}


/* =========================================================
   PANEL HEADING
========================================================= */

.placement-path__header {
    margin-bottom: 0.6rem;
}

.placement-path__header > span {
    display: block;

    margin-bottom: 0.35rem;

    color: #1677B8;

    font-size: 0.58rem;
    font-weight: 700;

    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.placement-path__header h3 {
    max-width: 370px;

    margin: 0;

    color: #174A7E;

    font-size: clamp(1.3rem, 1.8vw, 1.7rem);
    font-weight: 700;

    line-height: 1.2;
}

.placement-path__header h3 strong {
    color: #1677B8;
}


/* =========================================================
   ITEMS
========================================================= */

.placement-path__item {
    display: grid;

    grid-template-columns:
        24px
        42px
        minmax(0, 1fr);

    align-items: center;

    gap: 0.7rem;

    padding: 0.75rem 0;

    border-bottom: 1px solid #DFEBF1;
}

.placement-path__number {
    color: #75B8DE;

    font-size: 0.58rem;
    font-weight: 700;
}

.placement-path__icon {
    display: grid;
    place-items: center;

    width: 42px;
    height: 42px;

    color: #1677B8;
    background: #fff;

    border: 1px solid #DDEBF2;
    border-radius: 11px;
}

.placement-path__icon--green {
    color: #48A984;
}

.placement-path__content > span {
    display: block;

    margin-bottom: 0.1rem;

    color: #8B9AA3;

    font-size: 0.5rem;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.placement-path__content h4 {
    margin: 0 0 0.12rem;

    color: #174A7E;

    font-size: 0.76rem;
    font-weight: 700;
}

.placement-path__content p {
    margin: 0;

    color: #687C89;

    font-size: 0.62rem;
    line-height: 1.4;
}


/* =========================================================
   PANEL FOOTER
========================================================= */

.placement-path__footer {
    display: flex;
    align-items: center;

    gap: 0.65rem;

    margin-top: auto;
    padding-top: 0.8rem;
}

.placement-path__footer-icon {
    display: grid;
    place-items: center;

    width: 36px;
    height: 36px;

    flex: 0 0 36px;

    color: #fff;
    background: #174A7E;

    border-radius: 9px;
}

.placement-path__footer span {
    display: block;

    color: #8B9AA3;

    font-size: 0.48rem;
    font-weight: 700;

    text-transform: uppercase;
}

.placement-path__footer strong {
    display: block;

    margin-top: 0.1rem;

    color: #174A7E;

    font-size: 0.65rem;
}

.placement-path__arrow {
    margin-left: auto;

    color: #1677B8;
}


/* =========================================================
   1200 - 1599
========================================================= */

@media (min-width: 1200px) and (max-width: 1599.98px) {

    .placement-journey {
        padding: 2.7rem 0;
    }

    .placement-journey__heading {
        margin-bottom: 1.5rem;
    }

    .placement-journey__heading h2 {
        font-size: 2.45rem;
    }

    .placement-journey__layout {
        max-width: 1200px;
    }

    .placement-journey__visual {
        min-height: 390px;
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .placement-journey {
        padding: 3rem 0;
    }

    .placement-journey__heading {
        grid-template-columns: 1fr;

        gap: 0.8rem;
    }

    .placement-journey__heading > p {
        max-width: 650px;

        margin-left: 0;
    }

    .placement-journey__layout {
        grid-template-columns: 1fr;

        max-width: 760px;
    }

    .placement-journey__visual {
        aspect-ratio: 16 / 9;
        min-height: 0;
    }

    .placement-path {
        min-height: 390px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .placement-journey {
        padding: 2.7rem 0;
    }

    .placement-journey__heading h2 {
        font-size: 2rem;
    }

    .placement-journey__visual {
        aspect-ratio: 4 / 3;

        border-radius: 18px;
    }

    .placement-path {
        border-radius: 18px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .placement-journey {
        padding: 2.5rem 0;
    }

    .placement-journey__heading h2 {
        font-size: 1.75rem;
    }

    .placement-journey__heading > p {
        font-size: 0.8rem;
    }


    /* Image remains natural instead of becoming very tall */

    .placement-journey__visual {
        aspect-ratio: 1 / 1;
    }

    .placement-journey__visual-content {
        left: 1rem;
        right: 1rem;
        bottom: 4.8rem;
    }

    .placement-journey__visual-content h3 {
        max-width: 290px;

        font-size: 1.35rem;
    }

    .placement-journey__visual-content p {
        font-size: 0.67rem;
    }

    .placement-journey__badge {
        top: 0.8rem;
        left: 0.8rem;
    }

    .placement-journey__image-footer {
        left: 0.8rem;
        right: 0.8rem;
        bottom: 0.8rem;
    }


    /* Right panel */

    .placement-path {
        min-height: 0;

        padding: 1.2rem;
    }

    .placement-path__item {
        grid-template-columns:
            40px
            minmax(0, 1fr);

        gap: 0.7rem;
    }

    .placement-path__number {
        display: none;
    }

    .placement-path__icon {
        width: 40px;
        height: 40px;
    }
}


/* =========================================================
   320PX
========================================================= */

@media (max-width: 374.98px) {

    .placement-journey__heading h2 {
        font-size: 1.6rem;
    }

    .placement-journey__visual-content h3 {
        font-size: 1.2rem;
    }

    .placement-journey__visual-content p {
        display: none;
    }

    .placement-journey__image-footer > span {
        gap: 0.3rem;

        font-size: 0.58rem;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .placement-journey__visual > img {
        transition: none;
    }
}


/* =========================================================
   PLACEMENT SECTION — BALANCED LARGE SIZE
   Add this AFTER previous placement CSS
========================================================= */

/* Main section */
.placement-journey {
    padding: 3.75rem 0 4rem;
}


/* Main container width */
.placement-journey .container {
    max-width: 1400px;
}


/* =========================================================
   TOP HEADING
========================================================= */

.placement-journey__heading {
    grid-template-columns: 1.3fr 0.7fr;
    gap: 3.5rem;

    margin-bottom: 2rem;
}

.placement-journey__heading > div {
    max-width: 760px;
}

.placement-journey__eyebrow {
    margin-bottom: 0.7rem;

    font-size: 0.76rem;
}

.placement-journey__heading h2 {
    max-width: 760px;

    font-size: clamp(2.5rem, 3.5vw, 3.5rem);
    font-weight: 750;

    line-height: 1.1;
}

.placement-journey__heading > p {
    max-width: 470px;

    font-size: 0.95rem;
    line-height: 1.7;
}


/* =========================================================
   MAIN GRID
========================================================= */

.placement-journey__layout {
    grid-template-columns:
        minmax(0, 1.18fr)
        minmax(400px, 0.82fr);

    gap: 1.75rem;

    max-width: 1350px;
}


/* =========================================================
   LEFT IMAGE
========================================================= */

.placement-journey__visual {
    min-height: 460px;

    border-radius: 25px;
}


/* Keep image natural */
.placement-journey__visual > img {
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transform: none;
}


/* Only slight hover zoom */
.placement-journey__visual:hover > img {
    transform: scale(1.025);
}


/* =========================================================
   IMAGE TOP BADGE
========================================================= */

.placement-journey__badge {
    top: 1.4rem;
    left: 1.4rem;

    gap: 0.7rem;

    padding: 0.7rem 0.9rem;

    border-radius: 14px;
}

.placement-journey__badge > span {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;
}

.placement-journey__badge small {
    font-size: 0.56rem;
}

.placement-journey__badge strong {
    font-size: 0.76rem;
}


/* =========================================================
   IMAGE MAIN TEXT
========================================================= */

.placement-journey__visual-content {
    left: 2.2rem;
    right: 2rem;
    bottom: 6rem;

    max-width: 500px;
}

.placement-journey__visual-content > span {
    margin-bottom: 0.55rem;

    font-size: 0.68rem;
}

.placement-journey__visual-content h3 {
    max-width: 500px;

    margin-bottom: 0.6rem;

    font-size: clamp(1.9rem, 2.5vw, 2.6rem);

    line-height: 1.13;
}

.placement-journey__visual-content p {
    max-width: 430px;

    font-size: 0.82rem;
    line-height: 1.55;
}


/* =========================================================
   IMAGE FOOTER
========================================================= */

.placement-journey__image-footer {
    left: 1.4rem;
    right: 1.4rem;
    bottom: 1.4rem;

    gap: 0.85rem;

    padding: 0.8rem 1rem;

    border-radius: 14px;
}

.placement-journey__image-footer > div {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;
}

.placement-journey__image-footer > span {
    gap: 0.7rem;

    font-size: 0.75rem;
}


/* =========================================================
   RIGHT CARD
========================================================= */

.placement-path {
    min-height: 460px;

    padding: 1.8rem;

    border-radius: 25px;
}


/* =========================================================
   RIGHT CARD HEADING
========================================================= */

.placement-path__header {
    margin-bottom: 0.8rem;
}

.placement-path__header > span {
    margin-bottom: 0.45rem;

    font-size: 0.65rem;
}

.placement-path__header h3 {
    max-width: 410px;

    font-size: clamp(1.55rem, 2vw, 2rem);

    line-height: 1.17;
}


/* =========================================================
   RIGHT ITEMS
========================================================= */

.placement-path__item {
    grid-template-columns:
        28px
        48px
        minmax(0, 1fr);

    gap: 0.85rem;

    padding: 0.9rem 0;
}

.placement-path__number {
    font-size: 0.64rem;
}

.placement-path__icon {
    width: 48px;
    height: 48px;

    border-radius: 13px;

    font-size: 1rem;
}

.placement-path__content > span {
    margin-bottom: 0.15rem;

    font-size: 0.55rem;
}

.placement-path__content h4 {
    margin-bottom: 0.2rem;

    font-size: 0.86rem;
}

.placement-path__content p {
    max-width: 390px;

    font-size: 0.69rem;
    line-height: 1.45;
}


/* =========================================================
   RIGHT BOTTOM
========================================================= */

.placement-path__footer {
    gap: 0.75rem;

    padding-top: 1rem;
}

.placement-path__footer-icon {
    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    border-radius: 11px;
}

.placement-path__footer span {
    font-size: 0.52rem;
}

.placement-path__footer strong {
    font-size: 0.72rem;
}


/* =========================================================
   1200px - 1599px
   Laptop / normal desktop
========================================================= */

@media (min-width: 1200px) and (max-width: 1599.98px) {

    .placement-journey {
        padding: 3rem 0 3.5rem;
    }

    .placement-journey .container {
        max-width: 1320px;
    }

    .placement-journey__heading {
        margin-bottom: 1.7rem;
    }

    .placement-journey__heading h2 {
        font-size: clamp(2.5rem, 3.2vw, 3.15rem);
    }

    .placement-journey__layout {
        max-width: 1280px;

        grid-template-columns:
            minmax(0, 1.16fr)
            minmax(400px, 0.84fr);
    }

    .placement-journey__visual,
    .placement-path {
        min-height: 440px;
    }

    .placement-journey__visual-content h3 {
        font-size: 2.2rem;
    }
}


/* =========================================================
   992px - 1199px
========================================================= */

@media (min-width: 992px) and (max-width: 1199.98px) {

    .placement-journey {
        padding: 3.5rem 0;
    }

    .placement-journey__heading h2 {
        font-size: 2.65rem;
    }

    .placement-journey__layout {
        grid-template-columns:
            minmax(0, 1.05fr)
            minmax(390px, 0.95fr);

        gap: 1.3rem;
    }

    .placement-journey__visual,
    .placement-path {
        min-height: 440px;
    }

    .placement-journey__visual-content h3 {
        font-size: 2rem;
    }
}


/* =========================================================
   TABLET <= 991px
========================================================= */

@media (max-width: 991.98px) {

    .placement-journey {
        padding: 3.75rem 0;
    }

    .placement-journey__heading {
        grid-template-columns: 1fr;

        gap: 1rem;

        margin-bottom: 2rem;
    }

    .placement-journey__heading h2 {
        max-width: 700px;

        font-size: clamp(2.3rem, 6vw, 3rem);
    }

    .placement-journey__heading > p {
        max-width: 650px;

        margin-left: 0;

        font-size: 0.92rem;
    }

    .placement-journey__layout {
        grid-template-columns: 1fr;

        max-width: 800px;

        gap: 1.5rem;
    }

    .placement-journey__visual {
        min-height: 0;

        aspect-ratio: 16 / 9;
    }

    .placement-path {
        min-height: 430px;
    }
}


/* =========================================================
   MOBILE <= 767px
========================================================= */

@media (max-width: 767.98px) {

    .placement-journey {
        padding: 3.25rem 0;
    }

    .placement-journey__heading h2 {
        font-size: clamp(2rem, 7vw, 2.6rem);
    }

    .placement-journey__visual {
        aspect-ratio: 4 / 3;
    }

    .placement-journey__visual-content {
        left: 1.5rem;
        right: 1.5rem;
        bottom: 5.5rem;
    }

    .placement-journey__visual-content h3 {
        font-size: clamp(1.7rem, 5vw, 2.1rem);
    }

    .placement-path {
        padding: 1.5rem;

        min-height: 0;
    }
}


/* =========================================================
   MOBILE <= 575px
========================================================= */

@media (max-width: 575.98px) {

    .placement-journey {
        padding: 3rem 0;
    }

    .placement-journey__heading h2 {
        font-size: clamp(1.9rem, 8vw, 2.35rem);
    }

    .placement-journey__heading > p {
        font-size: 0.87rem;
    }

    .placement-journey__visual {
        aspect-ratio: 4 / 4.3;

        border-radius: 20px;
    }

    .placement-journey__badge {
        top: 1rem;
        left: 1rem;
    }

    .placement-journey__visual-content {
        left: 1.25rem;
        right: 1.25rem;
        bottom: 5.3rem;
    }

    .placement-journey__visual-content h3 {
        font-size: 1.65rem;
    }

    .placement-journey__visual-content p {
        font-size: 0.75rem;
    }

    .placement-journey__image-footer {
        left: 1rem;
        right: 1rem;
        bottom: 1rem;
    }

    .placement-path__header h3 {
        font-size: 1.6rem;
    }

    .placement-path__item {
        grid-template-columns:
            46px
            minmax(0, 1fr);

        gap: 0.8rem;

        padding: 0.85rem 0;
    }

    .placement-path__number {
        display: none;
    }

    .placement-path__icon {
        width: 46px;
        height: 46px;
    }

    .placement-path__content h4 {
        font-size: 0.84rem;
    }

    .placement-path__content p {
        font-size: 0.68rem;
    }
}


/* =========================================================
   320px
========================================================= */

@media (max-width: 374.98px) {

    .placement-journey {
        padding: 2.7rem 0;
    }

    .placement-journey__heading h2 {
        font-size: 1.8rem;
    }

    .placement-journey__visual {
        aspect-ratio: 1 / 1.15;
    }

    .placement-journey__visual-content h3 {
        font-size: 1.45rem;
    }

    .placement-journey__image-footer > span {
        gap: 0.4rem;

        font-size: 0.65rem;
    }

    .placement-path {
        padding: 1.2rem;
    }
}



/* =========================================================
   COMPACT PREMIUM FOOTER
========================================================= */

.compact-footer {
    --blue: #1677B8;
    --deep-blue: #174A7E;
    --sky-blue: #4DB7E5;
    --soft-cyan: #EAF8FC;
    --text: #587381;
    --border: #D9EAF2;

    position: relative;

    background:
        linear-gradient(
            180deg,
            #F8FCFE 0%,
            #F2F9FC 100%
        );

    border-top: 1px solid var(--border);

    overflow: hidden;
}


/* Top accent */

.compact-footer::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #174A7E,
            #1677B8,
            #4DB7E5
        );
}


/* =========================================================
   MAIN
========================================================= */

.compact-footer__main {
    padding: 3rem 0 2.7rem;
}

.compact-footer__main .container {
    max-width: 1400px;
}


/* =========================================================
   LOGO / ABOUT
========================================================= */

.compact-footer__about {
    display: flex;
    flex-direction: column;
    align-items: center;

    max-width: 430px;

    text-align: center;
}


.compact-footer__brand {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;

    margin-bottom: 1.1rem;

    text-decoration: none;
}


.compact-footer__brand img {
    display: block;

    width: 250px;
    height: auto;

    max-width: 100%;

    object-fit: contain;

    transition:
        transform 0.3s ease,
        filter 0.3s ease;
}


.compact-footer__brand:hover img {
    transform: translateY(-3px);

    filter:
        drop-shadow(
            0 8px 12px
            rgba(23, 74, 126, 0.12)
        );
}


.compact-footer__about p {
    max-width: 400px;

    margin: 0 auto;

    color: var(--text);

    font-size: 0.95rem;
    line-height: 1.7;

    text-align: center;
}


/* =========================================================
   TITLES
========================================================= */

.compact-footer h2 {
    position: relative;

    margin: 0 0 1.3rem;

    padding-bottom: 0.7rem;

    color: var(--deep-blue);

    font-size: 1.25rem;
    font-weight: 800;

    line-height: 1.2;
}


.compact-footer h2::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 38px;
    height: 3px;

    background: var(--sky-blue);

    border-radius: 10px;
}


/* =========================================================
   LINKS
========================================================= */

.compact-footer__column ul {
    margin: 0;
    padding: 0;

    list-style: none;
}


.compact-footer__column li + li {
    margin-top: 0.7rem;
}


.compact-footer__column a {
    display: inline-flex;
    align-items: center;

    color: var(--text);

    font-size: 0.95rem;
    font-weight: 500;

    text-decoration: none;

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}


.compact-footer__column a::before {
    content: "";

    width: 6px;
    height: 6px;

    flex: 0 0 6px;

    margin-right: 0.65rem;

    background: #9DD8EE;

    border-radius: 50%;
}


.compact-footer__column a:hover {
    color: var(--blue);

    transform: translateX(4px);
}


/* =========================================================
   CONTACT
========================================================= */

.compact-footer__contact {
    max-width: 100%;
}


.compact-footer__contact-item {
    display: flex;
    align-items: flex-start;

    gap: 0.9rem;
}


.compact-footer__contact-item +
.compact-footer__contact-item {
    margin-top: 0.85rem;
}


.compact-footer__icon {
    display: grid;
    place-items: center;

    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    color: var(--blue);
    background: #FFFFFF;

    border: 1px solid #D5E9F2;
    border-radius: 11px;

    font-size: 1rem;

    box-shadow:
        0 5px 15px
        rgba(23, 74, 126, 0.08);

    transition:
        color 0.25s ease,
        background 0.25s ease,
        transform 0.25s ease;
}


.compact-footer__contact-item:hover
.compact-footer__icon {

    color: #FFFFFF;
    background: var(--blue);

    transform: translateY(-2px);
}


.compact-footer__contact-item p {
    margin: 0;
    padding-top: 0.5rem;

    color: var(--text);

    font-size: 0.92rem;
    font-weight: 500;

    line-height: 1.5;
}


.compact-footer__contact-item a {
    color: var(--text);

    text-decoration: none;

    transition: color 0.25s ease;
}


.compact-footer__contact-item a:hover {
    color: var(--blue);
}


/* =========================================================
   COPYRIGHT BAR
========================================================= */

.compact-footer__bottom {
    width: 100%;

    background: #FFFFFF;

    border-top: 1px solid var(--border);
}


.compact-footer__bottom-content {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 1.5rem;

    min-height: 66px;
}


.compact-footer__bottom-content p {
    margin: 0;

    color: #637B88;

    font-size: 0.82rem;
    font-weight: 500;
}


.compact-footer__bottom-links {
    display: flex;
    align-items: center;

    gap: 0.85rem;
}


.compact-footer__bottom-links a {
    color: #637B88;

    font-size: 0.82rem;
    font-weight: 600;

    text-decoration: none;

    transition: color 0.25s ease;
}


.compact-footer__bottom-links a:hover {
    color: var(--blue);
}


.compact-footer__bottom-links span {
    width: 1px;
    height: 15px;

    background: #CDDEE6;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .compact-footer__main {
        padding: 2.8rem 0 2.4rem;
    }


    .compact-footer__about {
        max-width: 100%;
    }


    .compact-footer__brand img {
        width: 235px;
    }


    .compact-footer__about p {
        max-width: 430px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .compact-footer__main {
        padding: 2.5rem 0 2rem;
    }


    .compact-footer__brand img {
        width: 220px;
    }


    .compact-footer__about p {
        font-size: 0.9rem;
    }


    .compact-footer h2 {
        font-size: 1.1rem;
    }


    .compact-footer__column a {
        font-size: 0.9rem;
    }


    .compact-footer__bottom-content {
        flex-direction: column;
        justify-content: center;

        gap: 0.55rem;

        min-height: auto;

        padding: 1rem 0;

        text-align: center;
    }

}


/* =========================================================
   MOBILE 575
========================================================= */

@media (max-width: 575.98px) {

    .compact-footer__brand img {
        width: 200px;
    }


    .compact-footer__about p {
        max-width: 350px;

        font-size: 0.87rem;
    }


    .compact-footer__contact-item p {
        font-size: 0.86rem;
    }


    .compact-footer__bottom-content p,
    .compact-footer__bottom-links a {
        font-size: 0.76rem;
    }

}


/* =========================================================
   320
========================================================= */

@media (max-width: 374.98px) {

    .compact-footer__brand img {
        width: 180px;
    }

}





/* =========================================================
   FINAL PAGE RESPONSIVE SPACING SYSTEM
   Keep existing HTML/content unchanged
========================================================= */


/* =========================================================
   1. GLOBAL RESET
========================================================= */

html {
    width: 100%;
    max-width: 100%;

    margin: 0;
    padding: 0;

    overflow-x: hidden;
    scroll-behavior: smooth;
}


body,
body.home-page {
    width: 100%;
    max-width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    overflow-x: hidden;

    background: #ffffff;
}


*,
*::before,
*::after {
    box-sizing: border-box;
}


img,
picture,
video,
iframe,
svg {
    max-width: 100%;
}


img {
    height: auto;
}


figure {
    margin: 0;
}


ul,
ol {
    margin-top: 0;
}


p:last-child,
ul:last-child,
ol:last-child {
    margin-bottom: 0;
}


/* =========================================================
   2. MAIN PAGE
========================================================= */

.home-main {
    width: 100%;
    max-width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;
}


/* =========================================================
   3. GLOBAL CONTAINER
========================================================= */

.home-page .container {
    width: 100%;

    margin-left: auto;
    margin-right: auto;

    padding-left: 20px;
    padding-right: 20px;
}


@media (min-width: 1400px) {

    .home-page .container {
        max-width: 1320px;
    }

}


@media (min-width: 1200px) and (max-width: 1399.98px) {

    .home-page .container {
        max-width: 1140px;
    }

}


@media (min-width: 992px) and (max-width: 1199.98px) {

    .home-page .container {
        max-width: 960px;
    }

}


@media (min-width: 768px) and (max-width: 991.98px) {

    .home-page .container {
        max-width: 720px;
    }

}


@media (min-width: 576px) and (max-width: 767.98px) {

    .home-page .container {
        max-width: 540px;
    }

}



/* =========================================================
   5. HERO
========================================================= */

body.home-page .campus-hero {
    width: 100%;

    margin: 0 !important;

    padding: 0 !important;
}


body.home-page .campus-hero__slides,
body.home-page .campus-hero__slide {
    margin: 0 !important;
    padding: 0 !important;
}


body.home-page .campus-hero__interface {
    margin: 0 !important;

    padding-top: 2.25rem !important;
    padding-bottom: 3.5rem !important;
}


body.home-page .campus-hero__content {
    margin: 0;
}


body.home-page .campus-hero__eyebrow {
    margin-bottom: 0.65rem !important;
}


body.home-page .campus-hero h1 {
    margin-top: 0 !important;
    margin-bottom: 0.75rem !important;
}


body.home-page .campus-hero__lead {
    margin-top: 0 !important;
    margin-bottom: 0.85rem !important;
}


body.home-page .campus-hero__credentials {
    margin-top: 0 !important;
    margin-bottom: 1rem !important;
}


body.home-page .campus-hero__actions {
    margin: 0 !important;
}


/* =========================================================
   6. STANDARD SECTION SPACING

   Makes sections use consistent vertical spacing instead of
   different 4rem / 5rem / 6rem gaps.
========================================================= */

.home-section,
.jp-welcome,
.about-premium,
.management-council-section,
.course-showcase,
.department-section,
.infrastructure-section,
.gallery-section,
.news-section,
.notice-section,
.events-section,
.testimonial-section,
.placement-journey {
    margin: 0 !important;

    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
}


/* =========================================================
   7. SECTION HEADINGS
========================================================= */

.home-section-heading,
.jp-welcome__intro,
.about-heading,
.management-council-section__heading,
.placement-journey__heading {
    margin-top: 0 !important;
    margin-bottom: 1.75rem !important;
}


.home-section-heading h2,
.jp-welcome__intro h2,
.about-heading h2,
.placement-journey__heading h2 {
    margin-top: 0 !important;
    margin-bottom: 0.65rem !important;
}


.home-section-heading p,
.jp-welcome__intro p,
.about-heading p,
.placement-journey__heading p {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


/* =========================================================
   8. BOOTSTRAP ROW SPACING

   Prevent rows from creating unnecessarily large gaps.
========================================================= */

.home-main .row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 1.5rem;
}


/* =========================================================
   9. CARDS
========================================================= */

.welcome-card,
.course-feature-card,
.department-tile,
.stat-card,
.news-card,
.notice-panel,
.event-item,
.testimonial-card,
.placement-card,
.management-card,
.jp-welcome__card {
    margin-top: 0;
    margin-bottom: 0;
}


/* =========================================================
   10. CARD TEXT
========================================================= */

.home-main h1,
.home-main h2,
.home-main h3,
.home-main h4,
.home-main h5,
.home-main h6 {
    margin-top: 0;
}


.home-main h3 {
    margin-bottom: 0.6rem;
}


.home-main p {
    margin-top: 0;
}


.home-main .card p:last-child,
.home-main article p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   11. WELCOME SECTION
========================================================= */

.jp-welcome {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
}


.jp-welcome__intro {
    margin-bottom: 1.5rem !important;
}


.jp-welcome__card {
    margin: 0 !important;
}


.jp-welcome__footer {
    margin-top: 1.25rem !important;
}


/* =========================================================
   12. ABOUT SECTION
========================================================= */

.about-premium {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
}


.about-heading {
    margin-bottom: 1.75rem !important;
}


.about-content {
    margin-top: 0 !important;
}


.about-features {
    margin-top: 1.25rem !important;
}


.about-affiliations {
    margin-top: 1.25rem !important;
}


/* =========================================================
   13. MANAGEMENT COUNCIL
========================================================= */

.management-council-section {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
}


.management-card {
    height: 100%;

    margin: 0 !important;
}


/* =========================================================
   14. STATS BAND
========================================================= */

.stats-band {
    margin: 0 !important;

    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
}


.stat-card {
    height: 100%;
}


/* =========================================================
   15. INFRASTRUCTURE
========================================================= */

.infrastructure-grid {
    gap: 1rem !important;
}


.infra-card {
    margin: 0 !important;
}


/* =========================================================
   16. GALLERY
========================================================= */

.gallery-tile {
    margin: 0 !important;
}


/* =========================================================
   17. NEWS / NOTICES / EVENTS
========================================================= */

.news-card,
.notice-panel,
.event-item {
    margin: 0 !important;
}


.event-timeline {
    gap: 0.85rem !important;
}


/* =========================================================
   18. TESTIMONIAL
========================================================= */

.testimonial-card {
    margin: 0 !important;
}


/* =========================================================
   19. PLACEMENT
========================================================= */

.placement-journey {
    padding-top: 6rem !important;
    padding-bottom: 3.5rem !important;
}


.placement-journey__heading {
    margin-bottom: 1.75rem !important;
}


.placement-journey__layout {
    margin-top: 0 !important;
}


/* =========================================================
   20. ADMISSION CTA
========================================================= */

.admission-cta {
    margin: 0 !important;

    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
}


.admission-cta__inner {
    gap: 1.5rem !important;

    margin: 0 !important;

    padding: 1.75rem !important;
}


.admission-cta__inner h2 {
    margin-top: 0 !important;
    margin-bottom: 0.55rem !important;
}


.admission-cta__inner p {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


.admission-cta__actions {
    gap: 0.75rem !important;
}


/* =========================================================
   21. FOOTER
========================================================= */

.compact-footer {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;
}


.compact-footer__main {
    margin: 0 !important;

    padding-top: 2.75rem !important;
    padding-bottom: 2.25rem !important;
}


.compact-footer__main .row {
    --bs-gutter-x: 2rem;
    --bs-gutter-y: 1.75rem;
}


.compact-footer__about {
    margin: 0;
}


.compact-footer__brand {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 100%;

    margin: 0 0 0.85rem !important;

    padding: 0 !important;
}


.compact-footer__brand img {
    display: block;

    width: 245px !important;
    height: auto !important;

    max-width: 100%;

    margin: 0 auto !important;

    object-fit: contain;
}


.compact-footer__about p {
    max-width: 390px;

    margin:
        0
        auto !important;

    text-align: center;

    line-height: 1.65;
}


.compact-footer__column {
    margin: 0;
}


.compact-footer__column h2 {
    margin-top: 0 !important;
    margin-bottom: 0.85rem !important;
}


.compact-footer__column ul {
    margin: 0 !important;
    padding-left: 1.1rem;
}


.compact-footer__column li {
    margin-bottom: 0.35rem;
}


.compact-footer__column li:last-child {
    margin-bottom: 0;
}


.compact-footer__contact-item {
    margin-bottom: 0.85rem;
}


.compact-footer__contact-item:last-child {
    margin-bottom: 0;
}


.compact-footer__contact-item p {
    margin: 0;
}


.compact-footer__bottom {
    margin: 0 !important;
}


.compact-footer__bottom-content {
    min-height: 60px;

    margin: 0 !important;

    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
}


.compact-footer__bottom-content p {
    margin: 0 !important;
}


/* =========================================================
   22. TABLET
   768px - 1199px
========================================================= */


    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .course-showcase,
    .department-section,
    .infrastructure-section,
    .gallery-section,
    .news-section,
    .notice-section,
    .events-section,
    .testimonial-section,
    .placement-journey {

        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }


    .admission-cta {
        padding-top: 2.75rem !important;
        padding-bottom: 2.75rem !important;
    }

}


/* =========================================================
   23. TABLET
   <= 991px
========================================================= */

@media (max-width: 991.98px) {

    .home-page .container {
        padding-left: 18px;
        padding-right: 18px;
    }


    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .course-showcase,
    .department-section,
    .infrastructure-section,
    .gallery-section,
    .news-section,
    .notice-section,
    .events-section,
    .testimonial-section,
    .placement-journey {

        padding-top: 2.75rem !important;
        padding-bottom: 2.75rem !important;
    }


    .home-section-heading,
    .jp-welcome__intro,
    .about-heading,
    .management-council-section__heading,
    .placement-journey__heading {

        margin-bottom: 1.5rem !important;
    }


    .admission-cta__inner {
        padding: 1.5rem !important;
    }


    .compact-footer__main {
        padding-top: 2.5rem !important;
        padding-bottom: 2rem !important;
    }

}


/* =========================================================
   24. MOBILE
   <= 767px
========================================================= */

@media (max-width: 767.98px) {

    .home-page .container {
        max-width: 100%;

        padding-left: 16px !important;
        padding-right: 16px !important;
    }





    /* ---------------- HERO ---------------- */

    body.home-page .campus-hero__interface {
        padding-top: 1.75rem !important;
        padding-bottom: 4rem !important;
    }


    body.home-page .campus-hero__eyebrow {
        margin-bottom: 0.55rem !important;
    }


    body.home-page .campus-hero h1 {
        margin-bottom: 0.65rem !important;
    }


    body.home-page .campus-hero__lead {
        margin-bottom: 0.75rem !important;
    }


    body.home-page .campus-hero__credentials {
        margin-bottom: 0.85rem !important;
    }


    /* ---------------- SECTIONS ---------------- */

    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .course-showcase,
    .department-section,
    .infrastructure-section,
    .gallery-section,
    .news-section,
    .notice-section,
    .events-section,
    .testimonial-section,
    .placement-journey {

        padding-top: 2.5rem !important;
        padding-bottom: 2.5rem !important;
    }


    .home-section-heading,
    .jp-welcome__intro,
    .about-heading,
    .management-council-section__heading,
    .placement-journey__heading {

        margin-bottom: 1.35rem !important;
    }


    /* ---------------- ROW ---------------- */

    .home-main .row {
        --bs-gutter-x: 1rem;
        --bs-gutter-y: 1rem;
    }


    /* ---------------- ADMISSION ---------------- */

    .admission-cta {
        padding-top: 2.25rem !important;
        padding-bottom: 2.25rem !important;
    }


    .admission-cta__inner {
        gap: 1.25rem !important;

        padding: 1.35rem !important;
    }


    .admission-cta__actions {
        gap: 0.6rem !important;
    }


    /* ---------------- FOOTER ---------------- */

    .compact-footer__main {
        padding-top: 2.25rem !important;
        padding-bottom: 1.75rem !important;
    }


    .compact-footer__main .row {
        --bs-gutter-x: 1.25rem;
        --bs-gutter-y: 1.5rem;
    }


    .compact-footer__brand {
        margin-bottom: 0.65rem !important;
    }


    .compact-footer__brand img {
        width: 220px !important;
    }


    .compact-footer__column h2 {
        margin-bottom: 0.7rem !important;
    }


    .compact-footer__bottom-content {
        min-height: auto;

        padding-top: 0.85rem !important;
        padding-bottom: 0.85rem !important;
    }

}


/* =========================================================
   25. MOBILE
   <= 575px
========================================================= */

@media (max-width: 575.98px) {

    .home-page .container {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }


    /* ---------------- HERO ---------------- */

    body.home-page .campus-hero__interface {
        padding-top: 1.5rem !important;
        padding-bottom: 3.75rem !important;
    }


    /* ---------------- SECTIONS ---------------- */

    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .course-showcase,
    .department-section,
    .infrastructure-section,
    .gallery-section,
    .news-section,
    .notice-section,
    .events-section,
    .testimonial-section,
    .placement-journey {

        padding-top: 2.15rem !important;
        padding-bottom: 2.15rem !important;
    }


    .home-section-heading,
    .jp-welcome__intro,
    .about-heading,
    .management-council-section__heading,
    .placement-journey__heading {

        margin-bottom: 1.15rem !important;
    }


    /* ---------------- CARDS ---------------- */

    .welcome-card,
    .news-card,
    .notice-panel,
    .event-item,
    .testimonial-card {

        padding: 1.15rem !important;
    }


    /* ---------------- ADMISSION ---------------- */

    .admission-cta {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }


    .admission-cta__inner {
        padding: 1.15rem !important;
    }


    .admission-cta__actions {
        display: grid !important;

        grid-template-columns: 1fr;

        width: 100%;
    }


    .admission-cta__actions .ds-btn {
        width: 100%;
    }


    /* ---------------- FOOTER ---------------- */

    .compact-footer__main {
        padding-top: 2rem !important;
        padding-bottom: 1.5rem !important;
    }


    .compact-footer__brand img {
        width: 200px !important;
    }


    .compact-footer__about p {
        max-width: 340px;

        line-height: 1.55;
    }

}


/* =========================================================
   26. SMALL MOBILE
   <= 374px
========================================================= */

@media (max-width: 374.98px) {

    .home-page .container {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }



    body.home-page .campus-hero__interface {
        padding-top: 1.25rem !important;
        padding-bottom: 3.5rem !important;
    }


    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .course-showcase,
    .department-section,
    .infrastructure-section,
    .gallery-section,
    .news-section,
    .notice-section,
    .events-section,
    .testimonial-section,
    .placement-journey {

        padding-top: 1.85rem !important;
        padding-bottom: 1.85rem !important;
    }


    .home-section-heading,
    .jp-welcome__intro,
    .about-heading,
    .management-council-section__heading,
    .placement-journey__heading {

        margin-bottom: 1rem !important;
    }


    .compact-footer__brand img {
        width: 180px !important;
    }

}


/* =========================================================
   27. REMOVE ACCIDENTAL EMPTY SPACE
========================================================= */

.home-main > section:first-child {
    margin-top: 0 !important;
}


.home-main > section:last-child {
    margin-bottom: 0 !important;
}


.home-main section > .container > *:first-child {
    margin-top: 0;
}


.home-main section > .container > *:last-child {
    margin-bottom: 0;
}


/* =========================================================
   28. RESPONSIVE TEXT SAFETY
========================================================= */

.home-main h1,
.home-main h2,
.home-main h3,
.home-main h4,
.home-main p,
.home-main span,
.compact-footer h2,
.compact-footer p,
.compact-footer a {

    overflow-wrap: break-word;
}


.home-main a,
.compact-footer a {

    word-break: normal;
}


/* =========================================================
   29. IMAGE SAFETY
========================================================= */

.home-main img,
.compact-footer img{

    max-width: 100%;
}


/* =========================================================
   30. PREVENT HORIZONTAL OVERFLOW
========================================================= */

.home-main section,
.home-main .container,
.home-main .row,
.home-main [class*="col-"],
.compact-footer,
.compact-footer .container,
.compact-footer .row {

    min-width: 0;
}


/* =========================================================
   31. LANDSCAPE MOBILE
========================================================= */

@media (orientation: landscape) and (max-height: 600px) {

    body.home-page .campus-hero__interface {

        padding-top: 1.25rem !important;
        padding-bottom: 3rem !important;
    }


    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .placement-journey {

        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

}
















/* =========================================================
   HOMEPAGE HERO CAROUSEL
========================================================= */

body.home-page .campus-hero {
    position: relative;
    height: calc(100svh - 17.75rem);
    min-height: 31rem;
    max-height: 50rem;
    overflow: hidden;
    isolation: isolate;
    background: #174a7e;
}

body.home-page .campus-hero__pause-toggle {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

body.home-page .campus-hero__slides,
body.home-page .campus-hero__slide,
body.home-page .campus-hero__slide::after,
body.home-page .campus-hero__media {
    position: absolute;
    inset: 0;
}

body.home-page .campus-hero__slide {
    margin: 0;
    opacity: 0;
    overflow: hidden;
    animation: campusHeroSlide 21s linear infinite both;
    will-change: opacity, transform;
}

body.home-page .campus-hero__slide:nth-child(1),
body.home-page .campus-hero__slide:nth-child(1) .campus-hero__media,
body.home-page .campus-hero__indicator:nth-child(1)::after {
    animation-delay: 0s;
}

body.home-page .campus-hero__slide:nth-child(2),
body.home-page .campus-hero__slide:nth-child(2) .campus-hero__media,
body.home-page .campus-hero__indicator:nth-child(2)::after {
    animation-delay: -14s;
}

body.home-page .campus-hero__slide:nth-child(3),
body.home-page .campus-hero__slide:nth-child(3) .campus-hero__media,
body.home-page .campus-hero__indicator:nth-child(3)::after {
    animation-delay: -7s;
}

body.home-page .campus-hero__slide::after {
    content: "";
    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(4, 22, 41, 0.9) 0%,
            rgba(7, 38, 68, 0.74) 42%,
            rgba(11, 53, 89, 0.26) 72%,
            rgba(7, 30, 52, 0.16) 100%
        ),
        linear-gradient(
            0deg,
            rgba(4, 19, 35, 0.68) 0%,
            rgba(4, 19, 35, 0.08) 48%,
            rgba(4, 19, 35, 0.2) 100%
        );

    box-shadow:
        inset 0 -10rem 10rem -8rem rgba(0, 0, 0, 0.74);

    pointer-events: none;
}

body.home-page .campus-hero__media {
    width: 100%;
    height: 100%;
    max-width: none;

    object-fit: cover;
    object-position: center;

    animation: campusHeroKenBurns 21s ease-in-out infinite both;

    will-change: transform;
}


/* =========================================================
   HERO CONTENT
========================================================= */

body.home-page .campus-hero__interface {
    position: relative;
    z-index: 3;

    height: 100%;

    display: flex;
    align-items: flex-end;

    padding-block: 3rem 4.5rem;
}

body.home-page .campus-hero__content {
    width: min(100%, 59rem);

    color: #ffffff;

    animation:
        campusHeroContentIn 900ms ease 120ms both;

    text-shadow:
        0 2px 18px rgba(0, 0, 0, 0.72);
}

body.home-page .campus-hero__eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 0.55rem;

    margin-bottom: 0.9rem;
    padding: 0.48rem 0.72rem;

    color: #ffffff;

    background:
        rgba(15, 96, 147, 0.58);

    border:
        1px solid rgba(255, 255, 255, 0.42);

    border-radius: 0.35rem;

    box-shadow:
        0 0.5rem 1.5rem rgba(0, 0, 0, 0.18);

    backdrop-filter: blur(8px);

    font-size: 0.75rem;
    font-weight: 700;

    line-height: 1.2;

    text-transform: uppercase;
}

body.home-page .campus-hero h1 {
    max-width: 58rem;

    margin: 0 0 1rem;

    color: #ffffff;

    font-size: 3.65rem;
    line-height: 1.08;

    letter-spacing: 0;

    text-wrap: balance;
}

body.home-page .campus-hero__lead {
    max-width: 46rem;

    margin: 0 0 1.15rem;

    color: rgba(255, 255, 255, 0.94);

    font-size: 1.05rem;
    line-height: 1.65;
}


/* =========================================================
   CREDENTIALS
========================================================= */

body.home-page .campus-hero__credentials {
    display: flex;
    flex-wrap: wrap;

    gap: 0.55rem 1.1rem;

    margin-bottom: 1.3rem;
}

body.home-page .campus-hero__credentials span {
    display: inline-flex;
    align-items: center;

    gap: 0.42rem;

    color: #ffffff;

    font-size: 0.8rem;
    font-weight: 700;

    line-height: 1.35;
}

body.home-page .campus-hero__credentials i {
    color: #9fe6bc;

    font-size: 0.9rem;
}


/* =========================================================
   BUTTONS
========================================================= */

body.home-page .campus-hero__actions {
    display: flex;
    flex-wrap: wrap;

    gap: 0.7rem;
}

body.home-page .campus-hero__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 0.55rem;

    min-height: 2.9rem;

    padding: 0.72rem 1.05rem;

    border: 1px solid transparent;
    border-radius: 0.4rem;

    box-shadow:
        0 0.75rem 1.8rem rgba(0, 0, 0, 0.22);

    font-size: 0.84rem;
    font-weight: 700;

    line-height: 1.2;

    text-shadow: none;

    transition:
        transform 180ms ease,
        background-color 180ms ease,
        border-color 180ms ease,
        box-shadow 180ms ease;
}

body.home-page .campus-hero__button--primary {
    color: #174a7e;

    background: #ffffff;

    border-color: #ffffff;
}

body.home-page .campus-hero__button--primary:hover {
    color: #174a7e;

    background: #eaf8fc;

    border-color: #eaf8fc;

    box-shadow:
        0 1rem 2.2rem rgba(0, 0, 0, 0.28);

    transform: translateY(-2px);
}

body.home-page .campus-hero__button--secondary {
    color: #ffffff;

    background:
        rgba(12, 63, 105, 0.55);

    border-color:
        rgba(255, 255, 255, 0.64);

    backdrop-filter: blur(8px);
}

body.home-page .campus-hero__button--secondary:hover {
    color: #ffffff;

    background:
        rgba(22, 119, 184, 0.78);

    border-color: #ffffff;

    box-shadow:
        0 1rem 2.2rem rgba(0, 0, 0, 0.28);

    transform: translateY(-2px);
}


/* =========================================================
   CAROUSEL CONTROLS
========================================================= */

body.home-page .campus-hero__controls {
    position: absolute;

    right:
        max(
            1rem,
            calc((100vw - 1320px) / 2 + 0.75rem)
        );

    bottom: 4.5rem;

    z-index: 4;

    display: flex;
    align-items: center;

    gap: 0.8rem;
}

body.home-page .campus-hero__progress {
    display: flex;
    align-items: center;

    gap: 0.45rem;

    padding: 0.55rem 0.65rem;

    background:
        rgba(5, 31, 54, 0.46);

    border:
        1px solid rgba(255, 255, 255, 0.28);

    border-radius: 0.35rem;

    box-shadow:
        0 0.6rem 1.5rem rgba(0, 0, 0, 0.18);

    backdrop-filter: blur(8px);
}

body.home-page .campus-hero__indicator {
    position: relative;

    width: 2.25rem;
    height: 0.2rem;

    overflow: hidden;

    background:
        rgba(255, 255, 255, 0.4);

    border-radius: 0.2rem;
}

body.home-page .campus-hero__indicator::after {
    content: "";

    position: absolute;

    inset: 0;

    background: #ffffff;

    border-radius: inherit;

    transform: scaleX(0);

    transform-origin: left center;

    animation:
        campusHeroProgress 21s linear infinite both;
}


/* =========================================================
   PLAY / PAUSE
========================================================= */

body.home-page .campus-hero__pause {
    width: 2.75rem;
    height: 2.75rem;

    display: grid;

    place-items: center;

    margin: 0;

    color: #ffffff;

    background:
        rgba(5, 31, 54, 0.55);

    border:
        1px solid rgba(255, 255, 255, 0.38);

    border-radius: 50%;

    box-shadow:
        0 0.6rem 1.5rem rgba(0, 0, 0, 0.2);

    backdrop-filter: blur(8px);

    cursor: pointer;

    transition:
        background-color 180ms ease,
        border-color 180ms ease,
        transform 180ms ease;
}

body.home-page .campus-hero__pause:hover {
    background:
        rgba(22, 119, 184, 0.82);

    border-color: #ffffff;

    transform: translateY(-1px);
}

body.home-page .campus-hero__pause .fa-play {
    display: none;

    margin-left: 0.12rem;
}

body.home-page
.campus-hero__pause-toggle:focus-visible
~ .campus-hero__controls
.campus-hero__pause {

    outline: 0;

    box-shadow:
        0 0 0 0.25rem rgba(142, 217, 251, 0.7);
}

body.home-page
.campus-hero__pause-toggle:checked
~ .campus-hero__slides
.campus-hero__slide,

body.home-page
.campus-hero__pause-toggle:checked
~ .campus-hero__slides
.campus-hero__media,

body.home-page
.campus-hero__pause-toggle:checked
~ .campus-hero__controls
.campus-hero__indicator::after {

    animation-play-state: paused;
}

body.home-page
.campus-hero__pause-toggle:checked
~ .campus-hero__controls
.fa-pause {

    display: none;
}

body.home-page
.campus-hero__pause-toggle:checked
~ .campus-hero__controls
.fa-play {

    display: inline-block;
}


/* =========================================================
   ANIMATIONS
========================================================= */

@keyframes campusHeroSlide {

    0%,
    27% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }

    32%,
    94% {
        opacity: 0;
        transform: translate3d(-2%, 0, 0);
    }

    95% {
        opacity: 0;
        transform: translate3d(2%, 0, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes campusHeroKenBurns {

    0%,
    100% {
        transform: scale(1.08);
    }

    32%,
    94% {
        transform: scale(1.01);
    }
}

@keyframes campusHeroProgress {

    0% {
        opacity: 1;
        transform: scaleX(0);
    }

    27% {
        opacity: 1;
        transform: scaleX(1);
    }

    32%,
    94% {
        opacity: 0;
        transform: scaleX(1);
    }

    95%,
    100% {
        opacity: 0;
        transform: scaleX(0);
    }
}

@keyframes campusHeroContentIn {

    from {
        opacity: 0;

        transform:
            translateY(1.25rem);
    }

    to {
        opacity: 1;

        transform:
            translateY(0);
    }
}


/* =========================================================
   RESPONSIVE - 1200
========================================================= */

@media (max-width: 1199.98px) {

    body.home-page .campus-hero {
        height:
            calc(100svh - 13.25rem);

        min-height: 31rem;
        max-height: 46rem;
    }

    body.home-page .campus-hero h1 {
        font-size: 3rem;
    }

    body.home-page .campus-hero__controls {
        right:
            max(
                1rem,
                calc((100vw - 960px) / 2 + 0.75rem)
            );

        bottom: 1rem;
    }
}


/* =========================================================
   RESPONSIVE - TABLET
========================================================= */

@media (max-width: 991.98px) {

    body.home-page .campus-hero {
        height:
            calc(100svh - 12.5rem);

        max-height: 43rem;
    }

    body.home-page .campus-hero__interface {
        padding-block:
            2.5rem 4rem;
    }

    body.home-page .campus-hero h1 {
        max-width: 46rem;

        font-size: 2.65rem;
    }

    body.home-page .campus-hero__lead {
        max-width: 40rem;

        font-size: 0.98rem;
    }

    body.home-page .campus-hero__controls {
        right:
            max(
                1rem,
                calc((100vw - 720px) / 2 + 0.75rem)
            );

        bottom: 1rem;
    }
}


/* =========================================================
   RESPONSIVE - MOBILE
========================================================= */

@media (max-width: 767.98px) {

    body.home-page .campus-hero {
        height:
            calc(100svh - 11.75rem);

        min-height: 31rem;
        max-height: 42rem;
    }

    body.home-page .campus-hero__slide::after {

        background:
            linear-gradient(
                90deg,
                rgba(4, 22, 41, 0.84),
                rgba(7, 38, 68, 0.42)
            ),
            linear-gradient(
                0deg,
                rgba(4, 19, 35, 0.88) 0%,
                rgba(4, 19, 35, 0.34) 58%,
                rgba(4, 19, 35, 0.42) 100%
            );

        box-shadow:
            inset 0 -12rem 10rem -7rem
            rgba(0, 0, 0, 0.76);
    }

    body.home-page .campus-hero__interface {
        align-items: center;

        padding-block:
            2.5rem 5rem;
    }

    body.home-page .campus-hero h1 {
        font-size: 2.25rem;
    }

    body.home-page .campus-hero__lead {
        margin-bottom: 1rem;

        font-size: 0.9rem;

        line-height: 1.55;
    }

    body.home-page .campus-hero__credentials {
        gap: 0.45rem 0.8rem;

        margin-bottom: 1.1rem;
    }

    body.home-page .campus-hero__credentials span {
        font-size: 0.72rem;
    }

    body.home-page .campus-hero__button {
        min-height: 2.75rem;

        padding:
            0.68rem 0.85rem;

        font-size: 0.78rem;
    }

    body.home-page .campus-hero__controls {
        right: 0.75rem;
        bottom: 1rem;
    }

    body.home-page .campus-hero__progress {
        padding:
            0.5rem 0.55rem;
    }

    body.home-page .campus-hero__indicator {
        width: 1.75rem;
    }

    body.home-page .campus-hero__pause {
        width: 2.5rem;
        height: 2.5rem;
    }
}


/* =========================================================
   RESPONSIVE - SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    body.home-page .campus-hero h1 {
        font-size: 2rem;

        line-height: 1.1;
    }

    body.home-page .campus-hero__eyebrow {
        margin-bottom: 0.75rem;

        font-size: 0.67rem;
    }

    body.home-page .campus-hero__credentials {
        display: grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    body.home-page .campus-hero__actions {
        display: grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 0.55rem;
    }

    body.home-page .campus-hero__button {
        width: 100%;

        padding-inline: 0.6rem;
    }
}


/* =========================================================
   RESPONSIVE - EXTRA SMALL
========================================================= */

@media (max-width: 374.98px) {

    body.home-page .campus-hero {
        min-height: 30rem;
    }

    body.home-page .campus-hero__interface {
        padding-top: 2rem;
    }

    body.home-page .campus-hero h1 {
        font-size: 1.72rem;
    }

    body.home-page .campus-hero__lead {
        font-size: 0.82rem;
    }

    body.home-page .campus-hero__credentials span {
        font-size: 0.65rem;
    }

    body.home-page .campus-hero__button {
        font-size: 0.7rem;
    }
}


/* =========================================================
   LANDSCAPE MOBILE
========================================================= */

@media
(orientation: landscape)
and (max-height: 600px) {

    body.home-page .campus-hero {
        height: 31rem;

        min-height: 31rem;
    }

    body.home-page .campus-hero__interface {
        padding-block:
            2rem 3.5rem;
    }

    body.home-page .campus-hero h1 {
        font-size: 2.15rem;
    }

    body.home-page .campus-hero__lead {
        margin-bottom: 0.8rem;

        font-size: 0.86rem;
    }

    body.home-page .campus-hero__credentials {
        margin-bottom: 0.85rem;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    body.home-page .campus-hero__slide,
    body.home-page .campus-hero__media,
    body.home-page .campus-hero__content,
    body.home-page .campus-hero__indicator::after {

        animation: none !important;

        transform: none !important;
    }

    body.home-page .campus-hero__slide {
        opacity: 0;
    }

    body.home-page
    .campus-hero__slide:first-child {

        opacity: 1;
    }

    body.home-page
    .campus-hero__indicator:first-child::after {

        opacity: 1;

        transform:
            scaleX(1) !important;
    }

    body.home-page .campus-hero__pause {
        display: none;
    }
}

/* =========================================================
   TEMPORARY FIX - ALWAYS SHOW PAGE CONTENT
========================================================= */

.reveal,
.reveal.from-left,
.reveal.from-right {
    opacity: 1 !important;
    transform: none !important;
}


/* =========================================================
   HOMEPAGE HERO SAFETY FIX
========================================================= */

body.home-page .campus-hero {
    position: relative;
    display: block;
    width: 100%;
    min-height: 520px;
    overflow: hidden;
    background: #174a7e;
}

body.home-page .campus-hero__slides {
    position: absolute;
    inset: 0;
    z-index: 0;
}

body.home-page .campus-hero__slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

body.home-page .campus-hero__media {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.home-page .campus-hero__interface {
    position: relative;
    z-index: 3;
}

body.home-page .campus-hero__content {
    position: relative;
    z-index: 4;
}


/* Make normal homepage sections visible */
body.home-page .jp-welcome,
body.home-page .placement-journey,
body.home-page .admission-cta {
    position: relative;
    visibility: visible;
}


/* Temporary reveal fix */
body.home-page .reveal,
body.home-page .reveal.from-left,
body.home-page .reveal.from-right {
    opacity: 1 !important;
    transform: none !important;
}


/* Tablet */
@media (max-width: 991.98px) {

    body.home-page .campus-hero {
        min-height: 560px;
    }
}


/* Mobile */
@media (max-width: 767.98px) {

    body.home-page .campus-hero {
        min-height: 620px;
    }
}


/* Small Mobile */
@media (max-width: 575.98px) {

    body.home-page .campus-hero {
        min-height: 650px;
    }
}








/* =========================================================
   HOMEPAGE HERO / CAROUSEL FINAL FIX
========================================================= */

body.home-page .campus-hero {
    position: relative;

    width: 100%;
    height: 680px;
    min-height: 680px;

    overflow: hidden;
    isolation: isolate;

    background: #082c49;
}


/* Slides container */

body.home-page .campus-hero__slides {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    z-index: 0;

    overflow: hidden;
}


/* Individual slide */

body.home-page .campus-hero__slide {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    margin: 0;
}


/* Image */

body.home-page .campus-hero__media {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transform: scale(1.01);
}


/* Dark gradient for readable text */

body.home-page .campus-hero::after {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 1;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(4, 29, 50, 0.90) 0%,
            rgba(4, 34, 58, 0.76) 34%,
            rgba(4, 34, 58, 0.35) 65%,
            rgba(4, 34, 58, 0.08) 100%
        );
}


/* Content layer */

body.home-page .campus-hero__interface {
    position: relative;

    z-index: 3;

    width: 100%;
    height: 100%;
}

body.home-page .campus-hero__interface .container {
    max-width: 1400px;
    height: 100%;

    display: flex;
    align-items: center;

    padding-left: 24px;
    padding-right: 24px;
}


/* Main content */

body.home-page .campus-hero__content {
    position: relative;

    width: 100%;
    max-width: 790px;

    padding: 25px 0;
}


/* Eyebrow */

body.home-page .campus-hero__eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 9px;

    margin-bottom: 18px;

    padding: 9px 15px;

    color: #ffffff;
    background: rgba(22, 119, 184, 0.50);

    border: 1px solid rgba(135, 211, 242, 0.65);
    border-radius: 8px;

    font-size: 14px;
    font-weight: 800;

    text-transform: uppercase;
}


/* Heading */

body.home-page .campus-hero h1 {
    max-width: 790px;

    margin: 0 0 18px;

    color: #ffffff;

    font-size: clamp(3rem, 4.2vw, 4.3rem);
    font-weight: 800;

    line-height: 1.04;
    letter-spacing: -1.5px;
}


/* Description */

body.home-page .campus-hero__lead {
    max-width: 760px;

    margin: 0 0 16px;

    color: rgba(255, 255, 255, 0.93);

    font-size: 17px;
    font-weight: 400;

    line-height: 1.7;
}


/* Trust / approval points */

body.home-page .campus-hero__trust {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 10px 18px;

    margin: 0 0 20px;
}

body.home-page .campus-hero__trust span {
    display: inline-flex;
    align-items: center;

    gap: 7px;

    color: #ffffff;

    font-size: 14px;
    font-weight: 700;
}

body.home-page .campus-hero__trust i {
    color: #82e3b4;
}


/* Buttons */

body.home-page .campus-hero__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 12px;
}


/* Carousel controls */

body.home-page .campus-hero__controls {
    position: absolute;

    right: 7%;
    bottom: 28px;

    z-index: 5;

    display: flex;
    align-items: center;

    gap: 12px;
}


/* =========================================================
   LARGE DESKTOP
========================================================= */

@media (min-width: 1600px) {

    body.home-page .campus-hero {
        height: 720px;
        min-height: 720px;
    }

    body.home-page .campus-hero__interface .container {
        max-width: 1440px;
    }
}


/* =========================================================
   LAPTOP
========================================================= */

@media (max-width: 1399.98px) {

    body.home-page .campus-hero {
        height: 620px;
        min-height: 620px;
    }

    body.home-page .campus-hero h1 {
        font-size: 3.6rem;
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    body.home-page .campus-hero {
        height: auto;
        min-height: 650px;
    }

    body.home-page .campus-hero__interface .container {
        align-items: center;
    }

    body.home-page .campus-hero__content {
        max-width: 680px;

        padding: 80px 0;
    }

    body.home-page .campus-hero h1 {
        max-width: 680px;

        font-size: clamp(2.7rem, 7vw, 3.7rem);
    }

    body.home-page .campus-hero__lead {
        max-width: 650px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    body.home-page .campus-hero {
        min-height: 650px;
    }

    body.home-page .campus-hero::after {
        background:
            linear-gradient(
                90deg,
                rgba(4, 29, 50, 0.92) 0%,
                rgba(4, 29, 50, 0.82) 65%,
                rgba(4, 29, 50, 0.55) 100%
            );
    }

    body.home-page .campus-hero__interface .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    body.home-page .campus-hero__content {
        padding: 65px 0 90px;
    }

    body.home-page .campus-hero__eyebrow {
        margin-bottom: 15px;

        padding: 8px 12px;

        font-size: 12px;
    }

    body.home-page .campus-hero h1 {
        margin-bottom: 15px;

        font-size: clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.07;
        letter-spacing: -1px;
    }

    body.home-page .campus-hero__lead {
        font-size: 15px;
        line-height: 1.65;
    }

    body.home-page .campus-hero__trust {
        align-items: flex-start;
        flex-direction: column;

        gap: 8px;
    }

    body.home-page .campus-hero__trust span {
        font-size: 13px;
    }

    body.home-page .campus-hero__actions {
        width: 100%;
    }

    body.home-page .campus-hero__actions a {
        flex: 1 1 180px;

        text-align: center;
    }

    body.home-page .campus-hero__controls {
        right: 20px;
        bottom: 20px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    body.home-page .campus-hero {
        min-height: 620px;
    }

    body.home-page .campus-hero__content {
        padding-top: 50px;
    }

    body.home-page .campus-hero h1 {
        font-size: 2.35rem;
    }

    body.home-page .campus-hero__actions {
        flex-direction: column;
        align-items: stretch;
    }

    body.home-page .campus-hero__actions a {
        width: 100%;
        flex: none;
    }
}


/* =========================================================
   EXTRA SMALL
========================================================= */

@media (max-width: 374.98px) {

    body.home-page .campus-hero {
        min-height: 640px;
    }

    body.home-page .campus-hero h1 {
        font-size: 2rem;
    }

    body.home-page .campus-hero__lead {
        font-size: 14px;
    }
}




/* =========================================================
   NEWS & UPDATES
========================================================= */

.college-news {
    position: relative;
    z-index: 20;

    padding: 18px 0;

    background:
        linear-gradient(
            135deg,
            #f4fbff 0%,
            #ffffff 48%,
            #f1fbf7 100%
        );

    border-top: 1px solid #dcecf5;
    border-bottom: 1px solid #dcecf5;

    overflow: hidden;
}


.college-news__wrapper {
    display: flex;
    align-items: stretch;

    min-height: 76px;

    background: #ffffff;

    border: 1px solid #d9e9f2;
    border-radius: 16px;

    box-shadow:
        0 10px 35px rgba(0, 54, 91, 0.08);

    overflow: hidden;
}


/* =============================
   TITLE
============================= */

.college-news__title {
    position: relative;

    min-width: 230px;

    display: flex;
    align-items: center;
    gap: 12px;

    padding: 14px 22px;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #003b67,
            #006a91
        );

    overflow: hidden;
}


.college-news__title::after {
    content: "";

    position: absolute;
    right: -35px;
    top: -45px;

    width: 100px;
    height: 100px;

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.08);
}


.college-news__title small {
    display: block;

    margin-bottom: 2px;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;

    opacity: 0.75;
}


.college-news__title strong {
    display: block;

    font-size: 16px;
    font-weight: 800;

    white-space: nowrap;
}


.college-news__title > i {
    margin-left: auto;

    font-size: 21px;

    opacity: 0.9;
}


/* =============================
   LIVE PULSE
============================= */

.college-news__pulse {
    position: relative;

    width: 10px;
    height: 10px;

    flex: 0 0 10px;

    background: #45e7a2;

    border-radius: 50%;

    box-shadow:
        0 0 0 rgba(69, 231, 162, 0.5);

    animation: newsPulse 1.8s infinite;
}


@keyframes newsPulse {

    0% {
        box-shadow:
            0 0 0 0 rgba(69, 231, 162, 0.55);
    }

    70% {
        box-shadow:
            0 0 0 10px rgba(69, 231, 162, 0);
    }

    100% {
        box-shadow:
            0 0 0 0 rgba(69, 231, 162, 0);
    }

}


/* =============================
   SCROLLING VIEWPORT
============================= */

.college-news__viewport {
    position: relative;

    flex: 1;

    display: flex;
    align-items: center;

    overflow: hidden;

    min-width: 0;
}


/* left/right fade */

.college-news__viewport::before,
.college-news__viewport::after {
    content: "";

    position: absolute;
    top: 0;

    width: 45px;
    height: 100%;

    z-index: 5;

    pointer-events: none;
}


.college-news__viewport::before {
    left: 0;

    background:
        linear-gradient(
            90deg,
            #ffffff,
            transparent
        );
}


.college-news__viewport::after {
    right: 0;

    background:
        linear-gradient(
            270deg,
            #ffffff,
            transparent
        );
}


/* =============================
   MOVING TRACK
============================= */

.college-news__track {
    display: flex;
    align-items: center;

    width: max-content;

    animation:
        collegeNewsScroll 38s linear infinite;

    will-change: transform;
}


.college-news__viewport:hover
.college-news__track {
    animation-play-state: paused;
}


@keyframes collegeNewsScroll {

    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }

}


/* =============================
   NEWS ITEM
============================= */

.college-news__item {
    position: relative;

    display: inline-flex;
    align-items: center;
    gap: 10px;

    min-height: 74px;

    padding: 0 28px;

    color: #244b68;

    font-size: 13px;
    font-weight: 600;

    text-decoration: none;

    white-space: nowrap;

    border-right: 1px solid #e4eef4;

    transition:
        color 0.25s ease,
        background 0.25s ease;
}


.college-news__item:hover {
    color: #007da8;

    background: #f5fbfe;
}


.college-news__item > i:not(.college-news__arrow) {
    color: #079bc5;

    font-size: 16px;
}


.college-news__arrow {
    color: #12a878;

    font-size: 11px;

    opacity: 0;

    transform: translateX(-5px);

    transition: 0.25s ease;
}


.college-news__item:hover
.college-news__arrow {
    opacity: 1;

    transform: translateX(0);
}


/* =============================
   BADGE
============================= */

.college-news__badge {
    padding: 5px 8px;

    color: #007c66;

    background: #e8faf4;

    border: 1px solid #c8f0e4;
    border-radius: 6px;

    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.7px;
}


/* =============================
   VIEW ALL
============================= */

.college-news__all {
    min-width: 125px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    padding: 0 18px;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #079b86,
            #08b78d
        );

    font-size: 12px;
    font-weight: 800;

    text-decoration: none;

    transition: 0.3s ease;
}


.college-news__all:hover {
    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #006b87,
            #009d8a
        );
}


.college-news__all i {
    transition:
        transform 0.25s ease;
}


.college-news__all:hover i {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .college-news {
        padding: 12px 0;
    }

    .college-news__title {
        min-width: 185px;

        padding:
            12px 16px;
    }

    .college-news__title strong {
        font-size: 14px;
    }

    .college-news__title > i {
        display: none;
    }

    .college-news__all {
        min-width: 100px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .college-news {
        padding: 10px 0;
    }

    .college-news__wrapper {
        display: block;

        border-radius: 12px;
    }


    .college-news__title {
        width: 100%;
        min-width: 100%;

        min-height: 55px;

        padding:
            10px 16px;
    }


    .college-news__title > i {
        display: block;
    }


    .college-news__viewport {
        height: 62px;
    }


    .college-news__item {
        min-height: 62px;

        padding:
            0 20px;

        font-size: 12px;
    }


    .college-news__all {
        min-height: 45px;

        width: 100%;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .college-news__track {
        animation: none;
    }

    .college-news__pulse {
        animation: none;
    }

}

/* Homepage base styles */
.home-main {
  --home-medical-blue: #1677b8;
  --home-deep-blue: #174a7e;
  --home-sky-blue: #4db7e5;
  --home-soft-cyan: #eaf8fc;
  --home-light-bg: #f7f9fb;
  --home-soft-green: #dff4e7;
  --color-primary: var(--home-medical-blue);
  --color-primary-hover: var(--home-deep-blue);
  --color-sky-blue-400: var(--home-sky-blue);
  --color-soft-cyan-50: var(--home-soft-cyan);
  --color-light-gray-50: var(--home-light-bg);
  overflow: hidden;
  background:
    radial-gradient(circle at 8% 12%, rgba(197, 245, 248, 0.9), transparent 26rem),
    radial-gradient(circle at 92% 28%, rgba(198, 234, 212, 0.72), transparent 24rem),
    var(--color-white);
}

.home-hero {
  position: relative;
  min-height: 0;
  height: min(650px, calc(100vh - 1rem));
  max-height: 650px;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding-block: 1.35rem;
  isolation: isolate;
  background:
    radial-gradient(circle at 8% 12%, rgba(234, 248, 252, 0.95), transparent 23rem),
    radial-gradient(circle at 96% 18%, rgba(223, 244, 231, 0.72), transparent 24rem),
    linear-gradient(135deg, var(--color-white), var(--home-soft-cyan));
}

.home-hero__ambient {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}

.home-hero__ambient span {
  position: absolute;
  width: clamp(5rem, 10vw, 8rem);
  aspect-ratio: 1;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.84), rgba(197, 245, 248, 0.28));
  border: 1px solid rgba(142, 217, 251, 0.45);
  border-radius: 50%;
  box-shadow: var(--shadow-xs);
  animation: heroFloat 9s ease-in-out infinite;
}

.home-hero__ambient span:nth-child(1) {
  top: 10%;
  left: 4%;
}

.home-hero__ambient span:nth-child(2) {
  top: 16%;
  right: 8%;
  width: clamp(4rem, 7vw, 6rem);
  animation-delay: 1.2s;
}

.home-hero__ambient span:nth-child(3) {
  right: 38%;
  bottom: 8%;
  width: clamp(3.5rem, 6vw, 5rem);
  animation-delay: 2.4s;
}

.home-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.45fr) minmax(0, 0.55fr);
  align-items: center;
  gap: 1.4rem;
  min-height: 0;
}

.home-hero__info {
  position: relative;
  overflow: hidden;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 1.15rem;
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid rgba(77, 183, 229, 0.28);
  border-radius: 1.5rem;
  box-shadow: 0 22px 54px rgba(22, 119, 184, 0.16);
  backdrop-filter: blur(20px);
}

.home-hero__info::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 0.26rem;
  background: linear-gradient(90deg, var(--color-medical-blue-400), var(--color-soft-green-200));
}

.home-hero__trust {
  margin-bottom: 0.25rem;
  color: var(--color-primary);
  font-size: 0.72rem;
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
}

.home-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  width: fit-content;
  margin-bottom: 0.55rem;
  padding: 0.38rem 0.68rem;
  color: var(--color-primary);
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid var(--color-sky-blue-200);
  border-radius: var(--radius-pill);
  font-size: 0.68rem;
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
  box-shadow: var(--shadow-xs);
}

.home-hero h1 {
  max-width: 100%;
  margin-bottom: 0.55rem;
  color: var(--home-deep-blue);
  font-size: 2.1rem;
  line-height: 1.04;
}

.home-hero h1 span {
  display: block;
  color: var(--color-medical-blue-600);
}

.home-hero__lead {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  max-width: 100%;
  overflow: hidden;
  margin-bottom: 0.75rem;
  color: var(--color-text);
  font-size: 0.9rem;
  line-height: 1.46;
}

.home-hero__credentials {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.38rem;
  margin-bottom: 0.75rem;
}

.home-hero__credentials span {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  min-height: 2.45rem;
  padding: 0.4rem 0.45rem;
  color: var(--color-text);
  background: rgba(244, 254, 255, 0.82);
  border: 1px solid var(--color-sky-blue-200);
  border-radius: 0.72rem;
  box-shadow: var(--shadow-xs);
  font-size: 0.66rem;
  font-weight: var(--font-weight-semibold);
  line-height: 1.18;
}

.home-hero__credentials i {
  flex: 0 0 auto;
  margin-top: 0;
  color: var(--color-primary);
  font-size: 0.76rem;
}

.home-hero__stats {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.38rem;
  margin-bottom: 0.75rem;
}

.home-hero__stat {
  min-height: 4.65rem;
  padding: 0.5rem 0.35rem;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid var(--color-light-gray-200);
  border-radius: 0.78rem;
  box-shadow: var(--shadow-xs);
  text-align: center;
  transition:
    transform var(--transition-base),
    box-shadow var(--transition-base),
    border-color var(--transition-base);
}

.home-hero__stat:hover {
  transform: translateY(-0.35rem);
  border-color: var(--color-sky-blue-200);
  box-shadow: var(--shadow-md);
}

.home-hero__stat i {
  width: 1.45rem;
  height: 1.45rem;
  display: grid;
  place-items: center;
  margin: 0 auto 0.28rem;
  color: var(--color-primary);
  background: var(--color-soft-green-100);
  border: 1px solid var(--color-soft-green-200);
  border-radius: 50%;
  font-size: 0.72rem;
}

.home-hero__stat strong {
  display: block;
  color: var(--color-primary);
  font-size: 0.84rem;
  line-height: 1.1;
}

.home-hero__stat span:last-child {
  display: block;
  margin-top: 0.12rem;
  color: var(--color-text-muted);
  font-size: 0.62rem;
  font-weight: var(--font-weight-bold);
  line-height: 1.14;
}

.home-hero__actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 0.45rem;
  margin-top: 0;
}

.home-hero__actions .ds-btn {
  position: relative;
  overflow: hidden;
  min-height: 2.45rem;
  padding: 0.58rem 0.72rem;
  border-radius: var(--radius-pill);
  font-size: 0.78rem;
  line-height: 1.15;
}

.home-hero__actions .ds-btn::after {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  width: 0;
  aspect-ratio: 1;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.34);
  transform: translate(-50%, -50%);
  transition: width 420ms ease;
}

.home-hero__actions .ds-btn:hover::after {
  width: 11rem;
}

.home-hero__notice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: 2.45rem;
  padding: 0.58rem 0.74rem;
  color: var(--color-primary);
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid var(--color-sky-blue-200);
  border-radius: var(--radius-pill);
  box-shadow: var(--shadow-xs);
  font-size: 0.78rem;
  font-weight: var(--font-weight-bold);
}

.home-hero__notice:hover {
  color: var(--color-primary-hover);
  background: var(--color-sky-blue-100);
  transform: translateY(-1px);
}

.home-hero__carousel-wrap {
  min-width: 0;
  height: 100%;
}

.home-hero__carousel {
  position: relative;
  overflow: hidden;
  height: 480px;
  min-height: 420px;
  max-height: 480px;
  background: var(--color-white);
  border: 1px solid rgba(77, 183, 229, 0.34);
  border-radius: 1.5rem;
  box-shadow: 0 24px 58px rgba(22, 119, 184, 0.18);
}

.home-hero__carousel::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(22, 120, 186, 0.18)),
    linear-gradient(90deg, rgba(31, 142, 209, 0.1), transparent 42%);
  pointer-events: none;
}

.home-hero__carousel .carousel-inner,
.home-hero__carousel .carousel-item {
  height: 100%;
}

.home-hero__carousel .carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.01);
  transition: transform 5.5s ease;
}

.home-hero__carousel .carousel-item.active img {
  transform: scale(1.06);
}

.home-hero__carousel .carousel-indicators {
  z-index: 4;
  margin-bottom: var(--space-4);
}

.home-hero__carousel .carousel-indicators [data-bs-target] {
  width: 0.7rem;
  height: 0.7rem;
  margin-inline: 0.25rem;
  background: var(--color-white);
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  opacity: 0.74;
}

.home-hero__carousel .carousel-indicators .active {
  width: 1.7rem;
  background: var(--color-soft-green-200);
  border-radius: var(--radius-pill);
  opacity: 1;
}

.home-hero__carousel .carousel-control-prev,
.home-hero__carousel .carousel-control-next {
  z-index: 5;
  width: 4.75rem;
}

.home-hero__carousel .carousel-control-prev-icon,
.home-hero__carousel .carousel-control-next-icon {
  width: 2.6rem;
  height: 2.6rem;
  background-color: rgba(255, 255, 255, 0.88);
  background-size: 58%;
  border: 1px solid var(--color-sky-blue-200);
  border-radius: 50%;
  box-shadow: var(--shadow-sm);
  filter: none;
}

.home-hero__carousel-caption {
  position: absolute;
  left: 1.15rem;
  right: 1.15rem;
  bottom: 1.35rem;
  z-index: 3;
  max-width: 31rem;
  padding: 1rem;
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(189, 233, 255, 0.86);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-md);
  backdrop-filter: blur(16px);
}

.home-hero__carousel-caption span,
.course-feature-card__body > span,
.infra-card span,
.news-card span,
.event-item span,
.placement-card span,
.notice-panel__label {
  color: var(--color-primary);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
}

.home-hero__carousel-caption strong {
  display: block;
  margin: 0.25rem 0;
  color: var(--color-primary);
  font-size: 1.05rem;
  line-height: var(--line-height-tight);
}

.home-hero__carousel-caption p {
  margin: 0;
  color: var(--color-text-muted);
  font-size: 0.86rem;
  line-height: var(--line-height-base);
}

.home-alert {
  position: relative;
  z-index: 3;
  margin-top: -1.2rem;
}

.home-alert__inner {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-height: 4.25rem;
  padding: var(--space-4) var(--space-5);
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid var(--color-sky-blue-200);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}

.home-alert__inner:hover {
  color: var(--color-primary);
  transform: translateY(-2px);
}

.home-alert__inner i {
  margin-left: auto;
}

.home-alert__badge {
  padding: 0.35rem 0.55rem;
  color: var(--color-primary);
  background: var(--color-soft-green-100);
  border: 1px solid var(--color-soft-green-200);
  border-radius: var(--radius-pill);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
  animation: softPulse 1.7s ease-in-out infinite;
}

.home-section {
  position: relative;
  padding-block: 4.5rem;
}

.home-section--soft {
  background:
    linear-gradient(180deg, var(--home-light-bg), var(--color-white));
}

.home-section--cyan {
  background:
    linear-gradient(180deg, var(--home-soft-cyan), var(--color-white));
}

.home-section-heading {
  max-width: 46rem;
  margin-bottom: 2.35rem;
}

.home-section-heading.text-center {
  margin-inline: auto;
}

.home-section-heading h2,
.home-copy h2,
.admission-cta h2,
.contact-cta h2 {
  margin-bottom: 0.9rem;
  color: var(--home-deep-blue);
  font-size: 2.55rem;
  letter-spacing: 0;
}

.home-section-heading p,
.home-copy p,
.admission-cta p,
.contact-cta p {
  color: var(--color-text-muted);
  font-size: 1.02rem;
  line-height: 1.72;
}

.welcome-card,
.course-feature-card,
.department-tile,
.stat-card,
.news-card,
.notice-panel,
.event-item,
.testimonial-card,
.placement-card,
.contact-cta__content,
.contact-cta__map {
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(77, 183, 229, 0.24);
  border-radius: 1.25rem;
  box-shadow: 0 14px 34px rgba(22, 119, 184, 0.1);
}

.welcome-card {
  position: relative;
  overflow: hidden;
  padding: 2rem;
  border-color: rgba(77, 183, 229, 0.26);
}

.welcome-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 0.35rem;
  background: linear-gradient(180deg, var(--home-medical-blue), var(--home-sky-blue));
}

.welcome-card p {
  color: var(--color-text);
  font-size: var(--font-size-md);
  line-height: var(--line-height-loose);
}

.welcome-card__points,
.placement-list,
.contact-cta__grid {
  display: grid;
  gap: 0.85rem;
}

.welcome-card__points span,
.placement-list span,
.contact-cta__grid a,
.contact-cta__grid span {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
}

.welcome-card__points i,
.placement-list i,
.contact-cta__grid i {
  color: var(--color-primary);
  margin-top: 0.25rem;
}

.home-image-stack {
  position: relative;
  min-height: 29rem;
}

.home-image-stack img {
  position: absolute;
  object-fit: cover;
  border: 0.45rem solid var(--color-white);
  border-radius: 1.25rem;
  box-shadow: 0 24px 58px rgba(22, 119, 184, 0.16);
}

.home-image-stack__primary {
  inset: 0 14% 16% 0;
  width: 86%;
  height: 84%;
}

.home-image-stack__secondary {
  right: 0;
  bottom: 0;
  width: 52%;
  height: 42%;
}

.credential-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
  margin-top: var(--space-6);
}

.credential-row div {
  padding: 1rem;
  background: var(--home-soft-cyan);
  border: 1px solid rgba(77, 183, 229, 0.28);
  border-radius: 1rem;
  text-align: center;
}

.credential-row strong {
  display: block;
  color: var(--color-primary);
  font-size: var(--font-size-xl);
}

.credential-row span {
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.course-feature-card {
  display: grid;
  grid-template-columns: 0.92fr 1.08fr;
  overflow: hidden;
  border-color: rgba(77, 183, 229, 0.24);
  box-shadow: 0 18px 46px rgba(22, 119, 184, 0.11);
}

.course-feature-card__image img {
  width: 100%;
  height: 100%;
  min-height: 23rem;
  object-fit: cover;
}

.course-feature-card__body {
  padding: 2.4rem;
}

.course-feature-card__body h3 {
  color: var(--home-deep-blue);
  font-size: 2rem;
}

.course-feature-card__body p {
  color: var(--color-text-muted);
  line-height: var(--line-height-loose);
}

.course-feature-card__body ul {
  display: grid;
  gap: var(--space-3);
  padding: 0;
  margin: var(--space-5) 0;
  list-style: none;
}

.course-feature-card__body li {
  display: flex;
  gap: var(--space-3);
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
}

.course-feature-card__body li i {
  color: var(--color-primary);
  margin-top: 0.2rem;
}

.department-tile {
  display: block;
  height: 100%;
  padding: 1.55rem;
  color: var(--color-text);
  border-color: rgba(77, 183, 229, 0.2);
  transition:
    transform var(--transition-base),
    box-shadow var(--transition-base),
    border-color var(--transition-base);
}

.department-tile:hover {
  color: var(--color-text);
  transform: translateY(-0.35rem);
  border-color: rgba(77, 183, 229, 0.5);
  box-shadow: 0 18px 42px rgba(22, 119, 184, 0.12);
}

.department-tile > i {
  display: inline-grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  margin-bottom: 1rem;
  color: var(--color-primary);
  background: var(--home-soft-cyan);
  border: 1px solid rgba(77, 183, 229, 0.22);
  border-radius: 1rem;
}

.department-tile h3 {
  color: var(--home-deep-blue);
  font-size: var(--font-size-lg);
}

.department-tile p {
  color: var(--color-text-muted);
}

.stats-band {
  padding-block: 3rem;
  background:
    linear-gradient(90deg, rgba(234, 248, 252, 0.9), rgba(223, 244, 231, 0.78));
}

.stat-card {
  height: 100%;
  padding: 1.35rem;
  text-align: center;
  border-color: rgba(77, 183, 229, 0.22);
}

.stat-card strong {
  display: block;
  color: var(--home-deep-blue);
  font-size: 2.65rem;
  line-height: 1;
}

.stat-card span:last-child {
  display: block;
  margin-top: var(--space-2);
  color: var(--color-text-muted);
  font-weight: var(--font-weight-semibold);
}

.infrastructure-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: 14.5rem;
  gap: var(--space-4);
}

.infra-card {
  position: relative;
  overflow: hidden;
  border-radius: 1.2rem;
  box-shadow: 0 14px 34px rgba(22, 119, 184, 0.1);
}

.infra-card--large {
  grid-column: span 2;
  grid-row: span 2;
}

.infra-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms ease;
}

.infra-card:hover img {
  transform: scale(1.05);
}

.infra-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 62%;
  background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.96));
}

.infra-card div {
  position: absolute;
  left: var(--space-5);
  right: var(--space-5);
  bottom: var(--space-5);
  z-index: 2;
}

.infra-card h3 {
  margin-bottom: 0;
  color: var(--home-deep-blue);
  font-size: 1.28rem;
}

.gallery-tile {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  padding: 0;
  overflow: hidden;
  background: var(--color-white);
  border: 0;
  border-radius: 1.05rem;
  box-shadow: 0 12px 30px rgba(22, 119, 184, 0.1);
}

.gallery-tile--wide {
  aspect-ratio: 21 / 7;
}

.gallery-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition:
    transform 700ms ease,
    filter 700ms ease;
}

.gallery-tile::after {
  content: "\f065";
  position: absolute;
  inset: 50% auto auto 50%;
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  color: var(--color-primary);
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid var(--color-sky-blue-200);
  border-radius: var(--radius-pill);
  font-family: FontAwesome;
  transform: translate(-50%, -50%) scale(0.84);
  opacity: 0;
  transition:
    opacity var(--transition-base),
    transform var(--transition-base);
}

.gallery-tile:hover img {
  transform: scale(1.04);
  filter: saturate(1.08);
}

.gallery-tile:hover::after {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.news-card {
  height: 100%;
  padding: 1.6rem;
  border-color: rgba(77, 183, 229, 0.22);
  transition:
    transform var(--transition-base),
    box-shadow var(--transition-base);
}

.news-card:hover {
  transform: translateY(-0.35rem);
  box-shadow: 0 18px 42px rgba(22, 119, 184, 0.12);
}

.news-card h3 {
  margin-top: var(--space-3);
  color: var(--home-deep-blue);
  font-size: 1.32rem;
}

.news-card p {
  color: var(--color-text-muted);
}

.news-card a,
.event-item a {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--color-primary);
  font-weight: var(--font-weight-bold);
}

.notice-panel {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-5);
  height: 100%;
  padding: 2rem;
  border-color: rgba(77, 183, 229, 0.24);
}

.notice-panel__date {
  display: grid;
  place-items: center;
  width: 7rem;
  height: 7rem;
  color: var(--color-primary);
  background: var(--home-soft-green);
  border: 1px solid rgba(89, 178, 125, 0.24);
  border-radius: var(--radius-xl);
  text-align: center;
}

.notice-panel__date strong {
  font-size: 2.5rem;
  line-height: 1;
}

.notice-panel__date span {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
}

.event-timeline {
  max-width: 52rem;
  margin-inline: auto;
  display: grid;
  gap: 1rem;
}

.event-item {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.15rem;
  padding: 1.35rem;
  border-color: rgba(77, 183, 229, 0.22);
  transition:
    transform var(--transition-base),
    box-shadow var(--transition-base),
    border-color var(--transition-base);
}

.event-item:hover {
  transform: translateY(-0.25rem);
  border-color: rgba(77, 183, 229, 0.48);
  box-shadow: 0 18px 42px rgba(22, 119, 184, 0.12);
}

.event-item__icon {
  display: grid;
  place-items: center;
  width: 3.4rem;
  height: 3.4rem;
  color: var(--color-primary);
  background: var(--home-soft-cyan);
  border: 1px solid rgba(77, 183, 229, 0.22);
  border-radius: 1rem;
}

.event-item h3 {
  margin: 0.35rem 0 0.3rem;
  color: var(--home-deep-blue);
  font-size: 1.16rem;
}

.event-item p {
  margin: 0;
  color: var(--color-text-muted);
  line-height: 1.65;
}

.testimonial-card {
  height: 100%;
  padding: 1.6rem;
  border-color: rgba(77, 183, 229, 0.2);
}

.testimonial-card > i {
  color: var(--color-sky-blue-300);
  font-size: 2rem;
}

.testimonial-card p {
  margin-top: var(--space-4);
  color: var(--color-text);
  font-size: var(--font-size-md);
  line-height: var(--line-height-loose);
}

.testimonial-card strong {
  color: var(--color-primary);
}

.placement-card {
  position: relative;
  min-height: 26rem;
  overflow: hidden;
}

.placement-card img {
  width: 100%;
  height: 100%;
  min-height: 26rem;
  object-fit: cover;
}

.placement-card div {
  position: absolute;
  left: var(--space-6);
  right: var(--space-6);
  bottom: var(--space-6);
  padding: var(--space-5);
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--color-light-gray-200);
  border-radius: var(--radius-lg);
}

.admission-cta,
.contact-cta {
  padding-block: 4.5rem;
  background:
    linear-gradient(135deg, rgba(234, 248, 252, 0.92), var(--color-white) 52%, rgba(223, 244, 231, 0.78));
}

.admission-cta__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: var(--space-6);
  padding: 2.4rem;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(77, 183, 229, 0.28);
  border-radius: 1.25rem;
  box-shadow: 0 18px 46px rgba(22, 119, 184, 0.12);
}

.admission-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}

.contact-cta__content {
  height: 100%;
  padding: clamp(1.5rem, 4vw, 3rem);
}

.contact-cta__map {
  position: relative;
  height: 100%;
  min-height: 24rem;
  overflow: hidden;
}

.contact-cta__map iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.gallery-modal .modal-content {
  background: var(--color-white);
  border: 1px solid var(--color-light-gray-200);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
}

.gallery-modal .modal-header {
  border-bottom-color: var(--color-light-gray-200);
}

.gallery-modal .modal-title {
  margin: 0;
  color: var(--color-primary);
  font-size: var(--font-size-lg);
}

.gallery-modal .modal-body {
  padding: var(--space-4);
}

.gallery-modal img {
  width: 100%;
  max-height: 78vh;
  object-fit: contain;
  border-radius: var(--radius-lg);
}

.reveal {
  opacity: 0;
  transform: translateY(1.75rem);
  transition:
    opacity 700ms ease,
    transform 700ms ease;
}

.reveal.from-left {
  transform: translateX(-2rem);
}

.reveal.from-right {
  transform: translateX(2rem);
}

.reveal.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}

@keyframes floatCard {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-0.75rem);
  }
}

@keyframes softPulse {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(198, 234, 212, 0.65);
  }

  50% {
    box-shadow: 0 0 0 0.45rem rgba(198, 234, 212, 0);
  }
}

@keyframes heroFloat {
  0%,
  100% {
    transform: translate3d(0, 0, 0);
  }

  50% {
    transform: translate3d(0.5rem, -0.8rem, 0);
  }
}

@media (max-width: 1439.98px) and (min-width: 1200px) {
  .home-hero {
    height: min(620px, calc(100vh - 0.75rem));
    max-height: 620px;
    padding-block: 1rem;
  }

  .home-hero__grid {
    gap: 1.1rem;
  }

  .home-hero__info {
    padding: 0.95rem;
  }

  .home-hero h1 {
    font-size: 1.85rem;
  }

  .home-hero__lead {
    margin-bottom: 0.6rem;
    font-size: 0.82rem;
    line-height: 1.36;
  }

  .home-hero__credentials {
    gap: 0.32rem;
    margin-bottom: 0.6rem;
  }

  .home-hero__credentials span {
    min-height: 2.25rem;
    padding: 0.34rem 0.38rem;
    font-size: 0.58rem;
  }

  .home-hero__stats {
    gap: 0.32rem;
    margin-bottom: 0.6rem;
  }

  .home-hero__stat {
    min-height: 4.25rem;
    padding: 0.44rem 0.28rem;
  }

  .home-hero__actions .ds-btn,
  .home-hero__notice {
    min-height: 2.25rem;
    padding: 0.5rem 0.58rem;
    font-size: 0.72rem;
  }

  .home-hero__carousel {
    height: 420px;
    min-height: 420px;
    max-height: 420px;
  }
}

@media (max-width: 1199.98px) {
  .home-hero {
    height: min(620px, calc(100vh - 0.75rem));
    max-height: 620px;
    padding-block: 1rem;
  }

  .home-hero__grid {
    grid-template-columns: minmax(0, 0.45fr) minmax(0, 0.55fr);
    gap: 1rem;
  }

  .home-hero__info {
    padding: 0.85rem;
  }

  .home-eyebrow {
    margin-bottom: 0.42rem;
    padding: 0.3rem 0.55rem;
    font-size: 0.6rem;
  }

  .home-hero__trust {
    margin-bottom: 0.18rem;
    font-size: 0.64rem;
  }

  .home-hero h1 {
    margin-bottom: 0.4rem;
    font-size: 1.58rem;
  }

  .home-hero__lead {
    margin-bottom: 0.48rem;
    font-size: 0.76rem;
    line-height: 1.32;
  }

  .home-hero__credentials {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.28rem;
    margin-bottom: 0.5rem;
  }

  .home-hero__credentials span {
    min-height: 2rem;
    padding: 0.3rem 0.32rem;
    border-radius: 0.55rem;
    font-size: 0.54rem;
    line-height: 1.12;
  }

  .home-hero__credentials i {
    font-size: 0.62rem;
  }

  .home-hero__stats {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.28rem;
    margin-bottom: 0.5rem;
  }

  .home-hero__stat {
    min-height: 4rem;
    padding: 0.4rem 0.25rem;
    border-radius: 0.6rem;
  }

  .home-hero__stat i {
    width: 1.25rem;
    height: 1.25rem;
    margin-bottom: 0.2rem;
    font-size: 0.62rem;
  }

  .home-hero__stat strong {
    font-size: 0.72rem;
  }

  .home-hero__stat span:last-child {
    font-size: 0.52rem;
  }

  .home-hero__actions {
    gap: 0.32rem;
  }

  .home-hero__actions .ds-btn,
  .home-hero__notice {
    min-height: 2.1rem;
    padding: 0.45rem 0.5rem;
    font-size: 0.68rem;
  }

  .home-hero__carousel {
    height: 400px;
    min-height: 400px;
    max-height: 400px;
  }

  .home-hero__carousel-caption {
    bottom: 0.85rem;
    padding: 0.75rem;
  }

  .infrastructure-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .home-hero {
    height: auto;
    max-height: none;
    min-height: auto;
    overflow: visible;
    padding-block: 2.5rem;
  }

  .home-hero__grid {
    grid-template-columns: 1fr;
    gap: 1.4rem;
    min-height: auto;
  }

  .home-hero__info,
  .home-hero__carousel {
    min-height: auto;
  }

  .home-hero__info {
    padding: 1.35rem;
  }

  .home-hero h1 {
    font-size: 2.25rem;
  }

  .home-hero__lead {
    font-size: 0.95rem;
  }

  .home-hero__credentials {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-hero__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .home-hero__stat {
    min-height: 5.2rem;
  }

  .home-hero__actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-hero__notice {
    grid-column: 1 / -1;
  }

  .home-hero__carousel {
    height: 350px;
    min-height: 350px;
    max-height: 350px;
  }

  .course-feature-card,
  .admission-cta__inner {
    grid-template-columns: 1fr;
  }

  .course-feature-card__image img {
    min-height: 20rem;
  }

  .home-image-stack {
    min-height: 27rem;
  }

  .home-section,
  .admission-cta,
  .contact-cta {
    padding-block: 3.5rem;
  }

  .home-section-heading h2,
  .home-copy h2,
  .admission-cta h2,
  .contact-cta h2 {
    font-size: 2.1rem;
  }
}

@media (max-width: 767.98px) {
  .home-hero {
    padding-block: 2rem;
  }

  .home-hero h1 {
    font-size: 2rem;
  }

  .home-hero__info {
    padding: 1.25rem;
    border-radius: var(--radius-xl);
  }

  .home-hero__credentials {
    grid-template-columns: 1fr;
  }

  .home-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-hero__stat {
    min-height: 6.6rem;
  }

  .home-hero__carousel {
    height: 300px;
    min-height: 300px;
    max-height: 300px;
    border-radius: var(--radius-xl);
  }

  .home-hero__carousel-caption {
    left: var(--space-3);
    right: var(--space-3);
    bottom: var(--space-6);
    padding: var(--space-4);
  }

  .home-hero__actions {
    grid-template-columns: 1fr;
  }

  .admission-cta__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .home-alert {
    margin-top: 0;
  }

  .home-alert__inner {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .home-alert__inner i {
    margin-left: 0;
  }

  .credential-row,
  .infrastructure-grid {
    grid-template-columns: 1fr;
  }

  .infra-card,
  .infra-card--large {
    grid-column: auto;
    grid-row: auto;
    min-height: 18rem;
  }

  .gallery-tile--wide {
    aspect-ratio: 1.4 / 1;
  }

  .notice-panel,
  .event-item {
    grid-template-columns: 1fr;
  }

  .notice-panel__date {
    width: 100%;
    height: auto;
    min-height: 5rem;
  }
}

@media (max-width: 575.98px) {
  .home-section,
  .admission-cta,
  .contact-cta {
    padding-block: 3rem;
  }

  .home-section-heading h2,
  .home-copy h2,
  .admission-cta h2,
  .contact-cta h2 {
    font-size: 1.78rem;
  }

  .home-hero__credentials {
    grid-template-columns: 1fr;
  }

  .home-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-hero__stat {
    min-height: 5rem;
  }

  .home-hero__carousel {
    height: 270px;
    min-height: 270px;
    max-height: 270px;
  }

  .home-hero__carousel-caption {
    left: var(--space-2);
    right: var(--space-2);
    bottom: var(--space-4);
    padding: var(--space-3);
  }

  .home-hero__carousel-caption strong {
    font-size: var(--font-size-base);
  }

  .home-hero__carousel-caption p {
    font-size: var(--font-size-sm);
  }

  .home-hero__carousel .carousel-control-prev,
  .home-hero__carousel .carousel-control-next {
    width: 3.5rem;
  }
}

@media (max-width: 374.98px) {
  .home-hero h1 {
    font-size: 1.72rem;
  }

  .home-hero__stats {
    grid-template-columns: 1fr;
  }

  .home-hero__carousel {
    height: 250px;
    min-height: 250px;
    max-height: 250px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}

/* Homepage redesign: all visual overrides are isolated to index.html. */
.home-page .home-main {
  --home-medical-blue: #1677b8;
  --home-deep-blue: #174a7e;
  --home-sky-blue: #4db7e5;
  --home-soft-cyan: #eaf8fc;
  --home-light-bg: #f7f9fb;
  --home-soft-green: #dff4e7;
  --home-green: #3f9b69;
  --home-shadow-sm: 0 10px 28px rgba(23, 74, 126, 0.08);
  --home-shadow-md: 0 18px 44px rgba(23, 74, 126, 0.13);
  overflow: visible;
  overflow-x: clip;
  color: #315d75;
  background: #ffffff;
}

.home-page .home-main img {
  display: block;
}

.home-page .home-hero {
  position: relative;
  display: block;
  height: auto;
  min-height: 0;
  max-height: none;
  padding-block: 3.25rem 4.25rem;
  overflow: hidden;
  isolation: auto;
  background: linear-gradient(180deg, #f4fbfe 0%, #ffffff 78%);
  border-bottom: 1px solid #e3eff4;
}

.home-page .home-hero::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 0.3rem;
  background: linear-gradient(
    90deg,
    var(--home-medical-blue) 0 36%,
    var(--home-sky-blue) 36% 72%,
    #63b984 72%
  );
}

.home-page .home-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
  align-items: center;
  gap: 3rem;
  min-height: 0;
}

.home-page .home-hero__info {
  display: block;
  min-width: 0;
  height: auto;
  padding: 0 0.75rem 0 0;
  overflow: visible;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: none;
}

.home-page .home-hero__info::before {
  display: none;
}

.home-page .home-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  width: fit-content;
  max-width: 100%;
  margin-bottom: 1rem;
  padding: 0.45rem 0.75rem;
  color: var(--home-deep-blue);
  background: #ffffff;
  border: 1px solid #bfe4f3;
  border-radius: 999rem;
  box-shadow: 0 4px 14px rgba(23, 74, 126, 0.06);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
}

.home-page .home-eyebrow i {
  color: var(--home-medical-blue);
}

.home-page .home-hero__trust {
  margin-bottom: 0.45rem;
  color: var(--home-green);
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.home-page .home-hero h1 {
  max-width: 42rem;
  margin-bottom: 1rem;
  color: var(--home-deep-blue);
  font-size: 3rem;
  line-height: 1.08;
  letter-spacing: 0;
}

.home-page .home-hero h1 span {
  display: block;
  color: var(--home-medical-blue);
}

.home-page .home-hero__lead {
  display: block;
  max-width: 42rem;
  margin-bottom: 1.2rem;
  overflow: visible;
  color: #52788c;
  font-size: 1rem;
  line-height: 1.7;
  -webkit-line-clamp: initial;
}

.home-page .home-hero__credentials {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem 1rem;
  margin-bottom: 1.15rem;
}

.home-page .home-hero__credentials span {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  min-width: 0;
  min-height: 0;
  padding: 0;
  color: #315d75;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.35;
}

.home-page .home-hero__credentials i {
  flex: 0 0 auto;
  margin-top: 0.1rem;
  color: var(--home-green);
  font-size: inherit;
}

.home-page .home-hero__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.6rem;
  margin-bottom: 1.25rem;
}

.home-page .home-hero__stat {
  min-width: 0;
  min-height: 5.1rem;
  padding: 0.8rem 0.65rem;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid #dcebf2;
  border-radius: 0.5rem;
  box-shadow: 0 6px 18px rgba(23, 74, 126, 0.05);
  text-align: left;
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.home-page .home-hero__stat:hover {
  transform: translateY(-0.2rem);
  border-color: #9fd8ef;
  box-shadow: var(--home-shadow-sm);
}

.home-page .home-hero__stat i {
  display: inline-grid;
  place-items: center;
  width: 1.8rem;
  height: 1.8rem;
  margin: 0 0 0.45rem;
  color: var(--home-medical-blue);
  background: var(--home-soft-cyan);
  border: 0;
  border-radius: 50%;
  font-size: 0.78rem;
}

.home-page .home-hero__stat strong {
  display: block;
  overflow-wrap: anywhere;
  color: var(--home-deep-blue);
  font-size: 0.9rem;
  line-height: 1.2;
}

.home-page .home-hero__stat span:last-child {
  display: block;
  margin-top: 0.15rem;
  color: #718f9e;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.25;
}

.home-page .home-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  grid-template-columns: none;
  gap: 0.7rem;
}

.home-page .home-hero__actions .ds-btn,
.home-page .home-hero__notice {
  min-height: 2.8rem;
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  font-size: 0.84rem;
}

.home-page .home-hero__notice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  color: var(--home-deep-blue);
  background: #ffffff;
  border: 1px solid #bfe4f3;
  box-shadow: none;
  font-weight: 700;
  transition:
    transform 180ms ease,
    color 180ms ease,
    background-color 180ms ease,
    border-color 180ms ease;
}

.home-page .home-hero__notice:hover {
  color: var(--home-medical-blue);
  background: var(--home-soft-cyan);
  border-color: #8dd2ec;
  transform: translateY(-1px);
}

.home-page .home-hero__carousel-wrap {
  min-width: 0;
  height: auto;
}

.home-page .home-hero__carousel {
  position: relative;
  height: 470px;
  min-height: 0;
  max-height: none;
  overflow: hidden;
  background: #e8f2f6;
  border: 1px solid #cce4ee;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-md);
}

.home-page .home-hero__carousel::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, transparent 48%, rgba(16, 54, 87, 0.46) 100%);
  pointer-events: none;
}

.home-page .home-hero__carousel .carousel-inner,
.home-page .home-hero__carousel .carousel-item {
  height: 100%;
}

.home-page .home-hero__carousel .carousel-item {
  transition: opacity 800ms ease-in-out;
}

.home-page .home-hero__carousel .carousel-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.01);
  transition: transform 5.5s ease;
}

.home-page .home-hero__carousel .carousel-item.active img {
  transform: scale(1.055);
}

.home-page .home-hero__carousel .carousel-indicators {
  z-index: 4;
  justify-content: flex-end;
  margin: 0 1rem 1rem;
}

.home-page .home-hero__carousel .carousel-indicators [data-bs-target] {
  width: 0.55rem;
  height: 0.55rem;
  margin-inline: 0.2rem;
  background: #ffffff;
  border: 0;
  border-radius: 999rem;
  opacity: 0.7;
  transition:
    width 180ms ease,
    opacity 180ms ease;
}

.home-page .home-hero__carousel .carousel-indicators .active {
  width: 1.65rem;
  background: #ffffff;
  opacity: 1;
}

.home-page .home-hero__carousel .carousel-control-prev,
.home-page .home-hero__carousel .carousel-control-next {
  z-index: 5;
  width: 4rem;
  opacity: 1;
}

.home-page .home-hero__carousel .carousel-control-prev-icon,
.home-page .home-hero__carousel .carousel-control-next-icon {
  width: 2.45rem;
  height: 2.45rem;
  background-color: rgba(255, 255, 255, 0.92);
  background-size: 50%;
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  box-shadow: 0 6px 18px rgba(16, 54, 87, 0.2);
}

.home-page .home-hero__carousel-caption {
  position: absolute;
  left: 1rem;
  right: auto;
  bottom: 1rem;
  z-index: 3;
  width: min(33rem, calc(100% - 6rem));
  max-width: none;
  padding: 0.9rem 1rem;
  color: #315d75;
  background: rgba(255, 255, 255, 0.91);
  border: 1px solid rgba(255, 255, 255, 0.95);
  border-radius: 0.4rem;
  box-shadow: 0 8px 24px rgba(16, 54, 87, 0.18);
  backdrop-filter: blur(10px);
}

.home-page .home-hero__carousel-caption span,
.home-page .course-feature-card__body > span,
.home-page .infra-card span,
.home-page .news-card span,
.home-page .event-item span,
.home-page .placement-card span,
.home-page .notice-panel__label {
  color: var(--home-medical-blue);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
}

.home-page .home-hero__carousel-caption strong {
  display: block;
  margin: 0.2rem 0;
  color: var(--home-deep-blue);
  font-size: 1rem;
  line-height: 1.25;
}

.home-page .home-hero__carousel-caption p {
  margin: 0;
  color: #587d90;
  font-size: 0.8rem;
  line-height: 1.45;
}

.home-page .home-alert {
  position: relative;
  z-index: 4;
  margin-top: -2rem;
}

.home-page .home-alert__inner {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.85rem;
  min-height: 4.25rem;
  padding: 0.9rem 1.1rem;
  color: #315d75;
  background: #ffffff;
  border: 1px solid #c9e4ef;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-sm);
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.home-page .home-alert__inner:hover {
  color: var(--home-deep-blue);
  border-color: #87cfe9;
  box-shadow: var(--home-shadow-md);
  transform: translateY(-2px);
}

.home-page .home-alert__inner > strong {
  color: var(--home-deep-blue);
}

.home-page .home-alert__inner > i {
  margin-left: 0;
}

.home-page .home-alert__badge {
  padding: 0.3rem 0.55rem;
  color: #287b4f;
  background: var(--home-soft-green);
  border: 1px solid #bfe3cc;
  border-radius: 999rem;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  animation: softPulse 1.8s ease-in-out infinite;
}

.home-page .home-section {
  position: relative;
  padding-block: 5rem;
}



.home-page .home-section--cyan {
  background: var(--home-soft-cyan);
  border-block: 1px solid #d8eef6;
}

.home-page .home-section-heading {
  max-width: 48rem;
  margin-bottom: 2.5rem;
}

.home-page .home-section-heading.text-center {
  margin-inline: auto;
}

.home-page .home-section-heading h2,
.home-page .home-copy h2,
.home-page .admission-cta h2,
.home-page .contact-cta h2 {
  margin-bottom: 0.9rem;
  color: var(--home-deep-blue);
  font-size: 2.35rem;
  line-height: 1.2;
  letter-spacing: 0;
}

.home-page .home-section-heading p,
.home-page .home-copy p,
.home-page .admission-cta p,
.home-page .contact-cta p {
  color: #648598;
  font-size: 0.98rem;
  line-height: 1.75;
}

.home-page #welcome {
  padding-block: 4.25rem;
}

.home-page #welcome .home-section-heading {
  margin-bottom: 0;
  padding-right: 1.5rem;
}

.home-page .welcome-card {
  position: relative;
  overflow: visible;
  padding: 1.75rem 1.75rem 1.75rem 2rem;
  background: #f2fbfe;
  border: 1px solid #d2ebf4;
  border-left: 0.3rem solid var(--home-medical-blue);
  border-radius: 0.5rem;
  box-shadow: none;
}

.home-page .welcome-card::before {
  display: none;
}

.home-page .welcome-card p {
  color: #3c667d;
  font-size: 1.04rem;
  line-height: 1.8;
}

.home-page .welcome-card__points,
.home-page .placement-list,
.home-page .contact-cta__grid {
  display: grid;
  gap: 0.8rem;
}

.home-page .welcome-card__points {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding-top: 1rem;
  border-top: 1px solid #d3eaf3;
}

.home-page .welcome-card__points span,
.home-page .placement-list span,
.home-page .contact-cta__grid a,
.home-page .contact-cta__grid span {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  min-width: 0;
  color: #315d75;
  font-weight: 600;
  line-height: 1.5;
}

.home-page .welcome-card__points i,
.home-page .placement-list i,
.home-page .contact-cta__grid i {
  flex: 0 0 auto;
  margin-top: 0.25rem;
  color: var(--home-green);
}

.home-page .home-image-stack {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(9rem, 0.65fr);
  align-items: center;
  gap: 0.85rem;
  min-height: 30rem;
}

.home-page .home-image-stack img {
  position: static;
  inset: auto;
  width: 100%;
  object-fit: cover;
  border: 0;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-md);
}

.home-page .home-image-stack__primary {
  width: 100%;
  height: 30rem;
}

.home-page .home-image-stack__secondary {
  width: 100%;
  height: 21rem;
}

.home-page .credential-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
  margin-top: 1.5rem;
}

.home-page .credential-row div {
  min-width: 0;
  padding: 1rem 0.75rem;
  background: #ffffff;
  border: 1px solid #cfe5ee;
  border-radius: 0.5rem;
  text-align: center;
}

.home-page .credential-row strong {
  display: block;
  overflow-wrap: anywhere;
  color: var(--home-medical-blue);
  font-size: 1.2rem;
}

.home-page .credential-row span {
  display: block;
  margin-top: 0.15rem;
  color: #6d8c9d;
  font-size: 0.78rem;
}

.home-page .course-feature-card {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #d7e7ee;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-md);
}

.home-page .course-feature-card__image {
  min-height: 25rem;
  overflow: hidden;
}

.home-page .course-feature-card__image img {
  width: 100%;
  height: 100%;
  min-height: 25rem;
  object-fit: cover;
  transition: transform 650ms ease;
}

.home-page .course-feature-card:hover .course-feature-card__image img {
  transform: scale(1.035);
}

.home-page .course-feature-card__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 2.5rem;
}

.home-page .course-feature-card__body h3 {
  margin-top: 0.45rem;
  color: var(--home-deep-blue);
  font-size: 2rem;
}

.home-page .course-feature-card__body p {
  color: #648598;
  line-height: 1.75;
}

.home-page .course-feature-card__body ul {
  display: grid;
  gap: 0.7rem;
  padding: 1.2rem 0;
  margin: 0 0 1.1rem;
  border-block: 1px solid #e4eef2;
  list-style: none;
}

.home-page .course-feature-card__body li {
  display: flex;
  gap: 0.65rem;
  color: #315d75;
  font-weight: 600;
}

.home-page .course-feature-card__body li i {
  flex: 0 0 auto;
  margin-top: 0.2rem;
  color: var(--home-green);
}

.home-page .course-feature-card__body .ds-btn {
  align-self: flex-start;
}

.home-page .department-tile {
  position: relative;
  display: block;
  height: 100%;
  min-height: 13.5rem;
  padding: 1.5rem;
  overflow: hidden;
  color: #315d75;
  background: #ffffff;
  border: 1px solid #dce8ee;
  border-radius: 0.5rem;
  box-shadow: 0 8px 24px rgba(23, 74, 126, 0.05);
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.home-page .department-tile::after {
  content: "\f061";
  position: absolute;
  right: 1.25rem;
  bottom: 1.15rem;
  color: #88b8cf;
  font-family: FontAwesome;
  font-size: 0.85rem;
  transition:
    color 180ms ease,
    transform 180ms ease;
}

.home-page .department-tile:hover {
  color: #315d75;
  border-color: #92d1e9;
  box-shadow: var(--home-shadow-sm);
  transform: translateY(-0.3rem);
}

.home-page .department-tile:hover::after {
  color: var(--home-medical-blue);
  transform: translateX(0.2rem);
}

.home-page .department-tile > i {
  display: inline-grid;
  place-items: center;
  width: 2.8rem;
  height: 2.8rem;
  margin-bottom: 1rem;
  color: var(--home-medical-blue);
  background: var(--home-soft-cyan);
  border: 1px solid #cbe9f4;
  border-radius: 0.5rem;
}

.home-page .department-tile h3 {
  padding-right: 1.4rem;
  color: var(--home-deep-blue);
  font-size: 1.1rem;
}

.home-page .department-tile p {
  margin-bottom: 1.2rem;
  color: #6a8999;
  font-size: 0.9rem;
  line-height: 1.65;
}

.home-page .stats-band {
  padding-block: 2.5rem;
  background: #ffffff;
  border-block: 1px solid #dfeaf0;
}

.home-page .stats-band .row > div:not(:last-child) {
  border-right: 1px solid #dce8ee;
}

.home-page .stat-card {
  height: 100%;
  padding: 0.75rem 1rem;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  text-align: center;
}

.home-page .stat-card strong {
  display: block;
  color: var(--home-medical-blue);
  font-size: 2.55rem;
  line-height: 1;
}

.home-page .stat-card span:last-child {
  display: block;
  margin-top: 0.55rem;
  color: #567b8e;
  font-weight: 600;
}

.home-page .infrastructure-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-flow: dense;
  grid-auto-rows: 14rem;
  gap: 0.85rem;
}

.home-page .infra-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  background: #dcebf1;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-sm);
}

.home-page .infra-card--large {
  grid-column: span 2;
  grid-row: span 2;
}

.home-page .infra-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 650ms ease;
}

.home-page .infra-card:hover img {
  transform: scale(1.05);
}

.home-page .infra-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 64%;
  background: linear-gradient(180deg, transparent, rgba(10, 45, 73, 0.78));
}

.home-page .infra-card div {
  position: absolute;
  left: 1.15rem;
  right: 1.15rem;
  bottom: 1.1rem;
  z-index: 2;
}

.home-page .infra-card span {
  color: #d8f4ff;
}

.home-page .infra-card h3 {
  margin: 0.2rem 0 0;
  color: #ffffff;
  font-size: 1.15rem;
}

.home-page .gallery-tile {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 0.82;
  padding: 0;
  overflow: hidden;
  background: #dceaf0;
  border: 0;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-sm);
}

.home-page .gallery-tile--wide {
  aspect-ratio: 21 / 6;
}

.home-page .gallery-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition:
    transform 650ms ease,
    filter 650ms ease;
}

.home-page .gallery-tile::after {
  content: "\f065";
  position: absolute;
  inset: 50% auto auto 50%;
  display: grid;
  place-items: center;
  width: 2.8rem;
  height: 2.8rem;
  color: var(--home-deep-blue);
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  box-shadow: 0 8px 20px rgba(10, 45, 73, 0.2);
  font-family: FontAwesome;
  transform: translate(-50%, -50%) scale(0.85);
  opacity: 0;
  transition:
    opacity 200ms ease,
    transform 200ms ease;
}

.home-page .gallery-tile:hover img,
.home-page .gallery-tile:focus-visible img {
  filter: saturate(1.05);
  transform: scale(1.045);
}

.home-page .gallery-tile:hover::after,
.home-page .gallery-tile:focus-visible::after {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.home-page .news-card {
  position: relative;
  height: 100%;
  padding: 1.6rem 1.6rem 1.5rem;
  background: #ffffff;
  border: 1px solid #dce8ee;
  border-top: 0.25rem solid var(--home-sky-blue);
  border-radius: 0.5rem;
  box-shadow: 0 8px 24px rgba(23, 74, 126, 0.05);
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.home-page .news-card:hover {
  border-color: #9bd6eb;
  box-shadow: var(--home-shadow-sm);
  transform: translateY(-0.3rem);
}

.home-page .news-card h3 {
  margin-top: 0.6rem;
  color: var(--home-deep-blue);
  font-size: 1.25rem;
  line-height: 1.35;
}

.home-page .news-card p {
  color: #6b8999;
  line-height: 1.7;
}

.home-page .news-card a,
.home-page .event-item a {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: var(--home-medical-blue);
  font-weight: 700;
}

.home-page .notice-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1.5rem;
  align-items: center;
  height: 100%;
  padding: 1.75rem;
  background: #ffffff;
  border: 1px solid #cae6f0;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-sm);
}

.home-page .notice-panel__date {
  display: grid;
  place-items: center;
  width: 6.5rem;
  height: 6.5rem;
  padding: 0.7rem;
  color: #287b4f;
  background: var(--home-soft-green);
  border: 1px solid #bfe3cc;
  border-radius: 0.5rem;
  text-align: center;
}

.home-page .notice-panel__date strong {
  font-size: 2.35rem;
  line-height: 1;
}

.home-page .notice-panel__date span {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
}

.home-page .notice-panel h3 {
  margin: 0.35rem 0 0.45rem;
  color: var(--home-deep-blue);
}

.home-page .notice-panel p {
  color: #698797;
}

.home-page .event-timeline {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.home-page .event-item {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem;
  min-width: 0;
  padding: 1.35rem;
  background: #ffffff;
  border: 1px solid #dce8ee;
  border-left: 0.25rem solid var(--home-medical-blue);
  border-radius: 0.5rem;
  box-shadow: 0 8px 24px rgba(23, 74, 126, 0.05);
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.home-page .event-item:last-child {
  grid-column: 1 / -1;
}

.home-page .event-item:hover {
  border-color: #9dd7eb;
  box-shadow: var(--home-shadow-sm);
  transform: translateY(-0.25rem);
}

.home-page .event-item__icon {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  color: var(--home-medical-blue);
  background: var(--home-soft-cyan);
  border: 1px solid #cce8f2;
  border-radius: 0.5rem;
}

.home-page .event-item h3 {
  margin: 0.3rem 0 0.35rem;
  color: var(--home-deep-blue);
  font-size: 1.08rem;
}

.home-page .event-item p {
  margin: 0;
  color: #6b8999;
  font-size: 0.9rem;
  line-height: 1.65;
}

.home-page .testimonial-card {
  position: relative;
  height: 100%;
  padding: 1.6rem;
  background: #ffffff;
  border: 1px solid #dce8ee;
  border-radius: 0.5rem;
  box-shadow: 0 8px 24px rgba(23, 74, 126, 0.05);
}

.home-page .testimonial-card > i {
  color: #79c8e7;
  font-size: 1.65rem;
}

.home-page .testimonial-card p {
  margin-top: 1rem;
  color: #456d82;
  font-size: 0.98rem;
  line-height: 1.75;
}

.home-page .testimonial-card strong {
  color: var(--home-medical-blue);
}

.home-page .placement-list {
  margin-top: 1.4rem;
  padding-top: 1.4rem;
  border-top: 1px solid #dde9ee;
}

.home-page .placement-card {
  position: relative;
  min-height: 26rem;
  overflow: hidden;
  background: #dceaf0;
  border: 0;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-md);
}

.home-page .placement-card img {
  width: 100%;
  height: 26rem;
  min-height: 0;
  object-fit: cover;
}

.home-page .placement-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 55%;
  background: linear-gradient(180deg, transparent, rgba(10, 45, 73, 0.76));
}

.home-page .placement-card div {
  position: absolute;
  left: 1.5rem;
  right: 1.5rem;
  bottom: 1.35rem;
  z-index: 2;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.home-page .placement-card span {
  color: #d8f4ff;
}

.home-page .placement-card h3 {
  max-width: 28rem;
  margin: 0.25rem 0 0;
  color: #ffffff;
  font-size: 1.35rem;
}

.home-page .admission-cta {
  padding-block: 4rem;
  background: var(--home-deep-blue);
  border-block: 1px solid #103b65;
}

.home-page .admission-cta__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2rem;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.home-page .admission-cta .home-eyebrow {
  color: #dff4fc;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.22);
  box-shadow: none;
}

.home-page .admission-cta .home-eyebrow i {
  color: #8ed9fb;
}

.home-page .admission-cta h2 {
  color: #ffffff;
}

.home-page .admission-cta p {
  max-width: 47rem;
  margin-bottom: 0;
  color: #d6e8f1;
}

.home-page .admission-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.home-page .admission-cta .ds-btn-primary {
  color: var(--home-deep-blue);
  background: #ffffff;
}

.home-page .admission-cta .ds-btn-primary:hover {
  color: var(--home-deep-blue);
  background: #eaf8fc;
}

.home-page .admission-cta .ds-btn-secondary {
  color: #ffffff;
  background: transparent;
  border-color: rgba(255, 255, 255, 0.42);
}

.home-page .admission-cta .ds-btn-secondary:hover {
  color: var(--home-deep-blue);
  background: #ffffff;
  border-color: #ffffff;
}

.home-page .contact-cta {
  padding-block: 5rem;
  background: #ffffff;
}

.home-page .contact-cta__content {
  height: 100%;
  padding: 0.75rem 1.75rem 0.75rem 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.home-page .contact-cta__grid {
  margin-top: 1.5rem;
}

.home-page .contact-cta__grid a,
.home-page .contact-cta__grid span {
  padding: 0.8rem 0;
  border-bottom: 1px solid #e1ebf0;
  overflow-wrap: anywhere;
}

.home-page .contact-cta__grid i {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  margin-top: 0;
  color: var(--home-medical-blue);
  background: var(--home-soft-cyan);
  border-radius: 0.4rem;
}

.home-page .contact-cta__map {
  position: relative;
  height: 100%;
  min-height: 25rem;
  overflow: hidden;
  background: #e4eef2;
  border: 1px solid #d3e5ed;
  border-radius: 0.5rem;
  box-shadow: var(--home-shadow-sm);
}

.home-page .contact-cta__map iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (max-width: 1439.98px) {
  .home-page .home-hero__grid {
    gap: 2rem;
  }

  .home-page .home-hero h1 {
    font-size: 2.65rem;
  }

  .home-page .home-hero__carousel {
    height: 450px;
  }
}

@media (max-width: 1199.98px) {
  .home-page .home-hero {
    height: auto;
    max-height: none;
    padding-block: 2.75rem 4rem;
  }

  .home-page .home-hero__grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 1.5rem;
  }

  .home-page .home-hero__info {
    padding-right: 0;
  }

  .home-page .home-eyebrow {
    margin-bottom: 0.75rem;
    font-size: 0.68rem;
  }

  .home-page .home-hero h1 {
    margin-bottom: 0.75rem;
    font-size: 2.15rem;
  }

  .home-page .home-hero__lead {
    margin-bottom: 0.9rem;
    font-size: 0.88rem;
    line-height: 1.6;
  }

  .home-page .home-hero__credentials {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem 0.75rem;
    margin-bottom: 0.9rem;
  }

  .home-page .home-hero__credentials span {
    min-height: 0;
    padding: 0;
    font-size: 0.72rem;
  }

  .home-page .home-hero__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
    margin-bottom: 0.95rem;
  }

  .home-page .home-hero__stat {
    min-height: 4.55rem;
    padding: 0.6rem 0.55rem;
    border-radius: 0.5rem;
  }

  .home-page .home-hero__stat i {
    width: 1.5rem;
    height: 1.5rem;
    margin-bottom: 0.3rem;
    font-size: 0.68rem;
  }

  .home-page .home-hero__stat strong {
    font-size: 0.78rem;
  }

  .home-page .home-hero__stat span:last-child {
    font-size: 0.6rem;
  }

  .home-page .home-hero__actions {
    gap: 0.45rem;
  }

  .home-page .home-hero__actions .ds-btn,
  .home-page .home-hero__notice {
    min-height: 2.55rem;
    padding: 0.65rem 0.75rem;
    font-size: 0.74rem;
  }

  .home-page .home-hero__carousel {
    height: 420px;
    min-height: 0;
    max-height: none;
  }

  .home-page .home-hero__carousel-caption {
    width: calc(100% - 5rem);
  }

  .home-page .welcome-card__points {
    grid-template-columns: 1fr;
  }

  .home-page .infrastructure-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .home-page .home-hero {
    height: auto;
    min-height: 0;
    max-height: none;
    padding-block: 2.75rem 4.25rem;
    overflow: hidden;
  }

  .home-page .home-hero__grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .home-page .home-hero__info {
    max-width: 46rem;
    min-height: 0;
  }

  .home-page .home-hero h1 {
    font-size: 2.6rem;
  }

  .home-page .home-hero__lead {
    font-size: 0.95rem;
  }

  .home-page .home-hero__credentials {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-page .home-hero__credentials span {
    font-size: 0.8rem;
  }

  .home-page .home-hero__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .home-page .home-hero__stat {
    min-height: 4.8rem;
  }

  .home-page .home-hero__actions {
    grid-template-columns: none;
  }

  .home-page .home-hero__notice {
    grid-column: auto;
  }

  .home-page .home-hero__carousel {
    height: 350px;
    min-height: 0;
    max-height: none;
  }

  .home-page .home-section,
  .home-page .contact-cta {
    padding-block: 4rem;
  }

  .home-page .home-section-heading h2,
  .home-page .home-copy h2,
  .home-page .admission-cta h2,
  .home-page .contact-cta h2 {
    font-size: 2.05rem;
  }

  .home-page #welcome .home-section-heading {
    padding-right: 0;
  }

  .home-page .course-feature-card {
    grid-template-columns: 1fr;
  }

  .home-page .course-feature-card__image,
  .home-page .course-feature-card__image img {
    min-height: 21rem;
  }

  .home-page .home-image-stack {
    min-height: 26rem;
  }

  .home-page .home-image-stack__primary {
    height: 26rem;
  }

  .home-page .home-image-stack__secondary {
    height: 18rem;
  }

  .home-page .event-timeline {
    grid-template-columns: 1fr;
  }

  .home-page .event-item:last-child {
    grid-column: auto;
  }

  .home-page .admission-cta__inner {
    grid-template-columns: 1fr;
  }

  .home-page .contact-cta__content {
    padding: 0 0 1rem;
  }

  .home-page .contact-cta__map {
    min-height: 22rem;
  }
}

@media (max-width: 767.98px) {
  .home-page .home-hero {
    padding-block: 2.25rem 3rem;
  }

  .home-page .home-hero h1 {
    font-size: 2.15rem;
  }

  .home-page .home-hero__credentials {
    grid-template-columns: 1fr;
  }

  .home-page .home-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-page .home-hero__stat {
    min-height: 4.75rem;
  }

  .home-page .home-hero__carousel {
    height: 290px;
    min-height: 0;
    max-height: none;
    border-radius: 0.5rem;
  }

  .home-page .home-hero__carousel-caption {
    left: 0.75rem;
    right: auto;
    bottom: 0.75rem;
    width: calc(100% - 4.5rem);
    padding: 0.7rem 0.8rem;
  }

  .home-page .home-hero__carousel-caption p {
    display: none;
  }

  .home-page .home-hero__carousel .carousel-indicators {
    margin: 0 0.75rem 0.8rem;
  }

  .home-page .home-hero__carousel .carousel-control-prev,
  .home-page .home-hero__carousel .carousel-control-next {
    width: 3rem;
  }

  .home-page .home-alert {
    margin-top: 0;
  }

  .home-page .home-alert__inner {
    grid-template-columns: auto auto minmax(0, 1fr);
    border-radius: 0;
    border-inline: 0;
    box-shadow: none;
  }

  .home-page .home-alert__inner > i {
    display: none;
  }

  .home-page .home-section,
  .home-page .contact-cta {
    padding-block: 3.5rem;
  }

  .home-page #welcome {
    padding-block: 3.5rem;
  }

  .home-page .home-section-heading {
    margin-bottom: 2rem;
  }

  .home-page .welcome-card {
    padding: 1.35rem 1.35rem 1.35rem 1.55rem;
  }

  .home-page .home-image-stack {
    grid-template-columns: minmax(0, 1.3fr) minmax(7rem, 0.7fr);
    min-height: 23rem;
  }

  .home-page .home-image-stack__primary {
    height: 23rem;
  }

  .home-page .home-image-stack__secondary {
    height: 15.5rem;
  }

  .home-page .course-feature-card__body {
    padding: 1.75rem;
  }

  .home-page .stats-band .row > div:nth-child(2) {
    border-right: 0;
  }

  .home-page .stats-band .row > div:nth-child(-n + 2) {
    padding-bottom: 1rem;
    border-bottom: 1px solid #dce8ee;
  }

  .home-page .infra-card,
  .home-page .infra-card--large {
    grid-column: auto;
    grid-row: auto;
    min-height: 17rem;
  }

  .home-page .gallery-tile {
    aspect-ratio: 1 / 1;
  }

  .home-page .gallery-tile--wide {
    aspect-ratio: 1.65 / 1;
  }

  .home-page .notice-panel {
    grid-template-columns: 1fr;
  }

  .home-page .notice-panel__date {
    width: 100%;
    height: auto;
    min-height: 4.75rem;
  }

  .home-page .admission-cta__actions {
    align-items: stretch;
  }
}

@media (max-width: 575.98px) {
  .home-page .home-hero h1 {
    font-size: 1.9rem;
  }

  .home-page .home-hero__lead {
    font-size: 0.88rem;
  }

  .home-page .home-hero__actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .home-page .home-hero__actions .ds-btn,
  .home-page .home-hero__notice {
    width: 100%;
  }

  .home-page .home-hero__carousel {
    height: 270px;
    min-height: 0;
    max-height: none;
  }

  .home-page .home-hero__carousel-caption {
    right: 0.7rem;
    width: auto;
  }

  .home-page .home-hero__carousel-caption span {
    font-size: 0.62rem;
  }

  .home-page .home-hero__carousel-caption strong {
    font-size: 0.82rem;
  }

  .home-page .home-alert__inner {
    grid-template-columns: auto 1fr;
    gap: 0.55rem 0.7rem;
    padding: 0.85rem 1rem;
    font-size: 0.82rem;
  }

  .home-page .home-alert__badge {
    grid-column: 1;
    grid-row: 2;
    width: fit-content;
  }

  .home-page .home-alert__inner > span:not(.home-alert__badge) {
    grid-column: 2;
    grid-row: 1 / span 2;
  }

  .home-page .home-section-heading h2,
  .home-page .home-copy h2,
  .home-page .admission-cta h2,
  .home-page .contact-cta h2 {
    font-size: 1.75rem;
  }

  .home-page .home-section-heading p,
  .home-page .home-copy p,
  .home-page .admission-cta p,
  .home-page .contact-cta p {
    font-size: 0.92rem;
  }

  .home-page .home-image-stack {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .home-page .home-image-stack__primary,
  .home-page .home-image-stack__secondary {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
  }

  .home-page .credential-row {
    gap: 0.45rem;
  }

  .home-page .credential-row div {
    padding: 0.8rem 0.45rem;
  }

  .home-page .credential-row strong {
    font-size: 1rem;
  }

  .home-page .course-feature-card__image,
  .home-page .course-feature-card__image img {
    min-height: 16rem;
  }

  .home-page .course-feature-card__body {
    padding: 1.4rem;
  }

  .home-page .course-feature-card__body h3 {
    font-size: 1.6rem;
  }

  .home-page .infrastructure-grid {
    grid-template-columns: 1fr;
  }

  .home-page .event-item {
    grid-template-columns: 1fr;
  }

  .home-page .admission-cta {
    padding-block: 3.25rem;
  }

  .home-page .admission-cta__actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .home-page .admission-cta__actions .ds-btn {
    width: 100%;
  }

  .home-page .contact-cta__map {
    min-height: 19rem;
  }
}

@media (max-width: 374.98px) {
  .home-page .home-hero h1 {
    font-size: 1.68rem;
  }

  .home-page .home-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.4rem;
  }

  .home-page .home-hero__stat {
    padding: 0.55rem 0.45rem;
  }

  .home-page .home-hero__carousel {
    height: 250px;
    min-height: 0;
    max-height: none;
  }

  .home-page .home-hero__carousel-caption {
    left: 0.55rem;
    right: 0.55rem;
    bottom: 0.55rem;
  }

  .home-page .credential-row {
    grid-template-columns: 1fr;
  }
}

body.home-page {
  max-width: 100%;
  overflow-x: hidden;
}

.home-page .home-quick-facts {
  padding-block: 2.25rem;
  background: #ffffff;
  border-bottom: 1px solid #e3edf2;
}

.home-page .home-quick-facts .home-hero__stats {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-bottom: 0;
}

.home-page .home-quick-facts .home-hero__stat {
  height: 100%;
}

@media (max-width: 1199.98px) {
  .home-page .home-quick-facts .home-hero__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .home-page .home-quick-facts {
    padding-block: 1.75rem;
  }

  .home-page .home-quick-facts .home-hero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}







/* =========================================================
   PREMIUM ABOUT SECTION
========================================================= */

.about-premium {
    --about-blue: #1677b8;
    --about-deep-blue: #174a7e;
    --about-sky: #4db7e5;
    --about-cyan: #eaf8fc;
    --about-green: #35a56f;

    position: relative;
    overflow: hidden;
    padding: clamp(4.5rem, 0vw, 7rem) 0;
    background:
        radial-gradient(
            circle at 8% 20%,
            rgba(77, 183, 229, 0.13),
            transparent 28rem
        ),
        radial-gradient(
            circle at 95% 85%,
            rgba(53, 165, 111, 0.08),
            transparent 25rem
        ),
        linear-gradient(
            180deg,
            #f7fbfd 0%,
            #ffffff 50%,
            #f5fbfd 100%
        );
}


/* Decorative background circles */

.about-premium__decoration {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.about-premium__decoration--left {
    top: 7rem;
    left: -9rem;

    width: 19rem;
    height: 19rem;

    border: 3rem solid rgba(77, 183, 229, 0.06);
}

.about-premium__decoration--right {
    right: -8rem;
    bottom: -9rem;

    width: 22rem;
    height: 22rem;

    border: 4rem solid rgba(53, 165, 111, 0.05);
}


/* =========================================================
   HEADING
========================================================= */

.about-heading {
    max-width: 780px;
    margin: 0 auto clamp(2.8rem, 5vw, 4.5rem);
    text-align: center;
}

.about-heading__label {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 1rem;
    padding: 0.55rem 1rem;
    color: var(--about-blue);
    background: #fff;
    border: 1px solid rgba(77, 183, 229, 0.28);
    border-radius: 50rem;
    box-shadow: 0 6px 20px rgba(22, 119, 184, 0.08);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.about-heading h2 {
    margin-bottom: 1rem;

    color: var(--about-deep-blue);

    font-size: clamp(2rem, 4vw, 3.25rem);
    font-weight: 800;
    line-height: 1.12;
}

.about-heading h2 span {
    color: var(--about-blue);
}

.about-heading p {
    max-width: 650px;
    margin: 0 auto;

    color: #64748b;

    font-size: clamp(0.95rem, 1.4vw, 1.08rem);
    line-height: 1.75;
}


/* =========================================================
   IMAGE COMPOSITION
========================================================= */

.about-visual {
    position: relative;

    min-height: 540px;

    padding: 0 4rem 4rem 0;
}


/* Main image */

.about-visual__main {
    position: relative;

    width: 88%;
    height: 480px;

    overflow: hidden;

    background: #dcecf4;

    border: 8px solid #fff;
    border-radius: 28px;

    box-shadow:
        0 30px 70px rgba(23, 74, 126, 0.17),
        0 8px 20px rgba(22, 119, 184, 0.08);
}

.about-visual__main img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.8s cubic-bezier(.2, .8, .2, 1);
}

.about-visual:hover .about-visual__main img {
    transform: scale(1.055);
}


/* Image overlay */

.about-visual__overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            transparent 48%,
            rgba(5, 36, 63, 0.75) 100%
        );

    pointer-events: none;
}


/* Main image caption */

.about-visual__caption {
    position: absolute;
    left: 1.6rem;
    right: 1.6rem;
    bottom: 1.5rem;

    color: #fff;
}

.about-visual__caption span {
    display: flex;
    align-items: center;
    gap: 0.45rem;

    margin-bottom: 0.3rem;

    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
}

.about-visual__caption strong {
    display: block;

    font-size: clamp(1.2rem, 2vw, 1.55rem);
    font-weight: 800;
}


/* Secondary image */

.about-visual__secondary {
    position: absolute;

    right: 0;
    bottom: 0;

    width: 47%;
    height: 225px;

    overflow: hidden;

    background: #fff;

    border: 7px solid #fff;
    border-radius: 22px;

    box-shadow: 0 24px 55px rgba(23, 74, 126, 0.2);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}

.about-visual__secondary:hover {
    transform: translateY(-8px);

    box-shadow: 0 30px 65px rgba(23, 74, 126, 0.25);
}

.about-visual__secondary img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.6s ease;
}

.about-visual__secondary:hover img {
    transform: scale(1.07);
}


/* Secondary image label */

.about-visual__secondary-label {
    position: absolute;

    left: 0.8rem;
    right: 0.8rem;
    bottom: 0.8rem;

    display: flex;
    align-items: center;
    gap: 0.45rem;

    padding: 0.65rem 0.8rem;

    color: #fff;
    background: rgba(23, 74, 126, 0.82);

    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 12px;

    backdrop-filter: blur(8px);

    font-size: 0.78rem;
    font-weight: 700;
}


/* Floating recognition badge */

.about-visual__badge {
    position: absolute;

    top: 2.3rem;
    right: 0.8rem;

    display: flex;
    align-items: center;
    gap: 0.75rem;

    padding: 0.85rem 1rem;

    background: rgba(255, 255, 255, 0.94);

    border: 1px solid rgba(77, 183, 229, 0.25);
    border-radius: 15px;

    box-shadow: 0 15px 40px rgba(23, 74, 126, 0.17);

    backdrop-filter: blur(10px);

    animation: aboutBadgeFloat 4s ease-in-out infinite;
}

.about-visual__badge-icon {
    display: grid;
    place-items: center;

    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    color: var(--about-green);
    background: #eaf8f0;

    border-radius: 12px;

    font-size: 1.15rem;
}

.about-visual__badge strong,
.about-visual__badge span {
    display: block;
}

.about-visual__badge strong {
    color: var(--about-deep-blue);

    font-size: 0.85rem;
}

.about-visual__badge span {
    margin-top: 0.1rem;

    color: #64748b;

    font-size: 0.7rem;
}


/* =========================================================
   CONTENT
========================================================= */

.about-content {
    padding-left: clamp(0rem, 2vw, 1.5rem);
}

.about-content__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;

    margin-bottom: 1rem;

    color: var(--about-blue);

    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.about-content__eyebrow > span {
    width: 32px;
    height: 3px;

    background: var(--about-sky);

    border-radius: 50rem;
}

.about-content h2 {
    max-width: 650px;

    margin-bottom: 1.35rem;

    color: var(--about-deep-blue);

    font-size: clamp(2rem, 3.5vw, 3rem);
    font-weight: 800;
    line-height: 1.13;
}

.about-content h2 span {
    color: var(--about-blue);
}

.about-content p {
    margin-bottom: 1rem;

    color: #64748b;

    font-size: 0.98rem;
    line-height: 1.8;
}

.about-content__lead strong {
    color: var(--about-deep-blue);
}


/* =========================================================
   FEATURE ITEMS
========================================================= */

.about-features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 0.85rem;

    margin: 1.6rem 0;
}

.about-feature {
    display: flex;
    align-items: center;
    gap: 0.8rem;

    min-width: 0;

    padding: 0.9rem;

    background: rgba(255, 255, 255, 0.9);

    border: 1px solid rgba(77, 183, 229, 0.2);
    border-radius: 15px;

    box-shadow: 0 8px 25px rgba(22, 119, 184, 0.07);

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

.about-feature:hover {
    transform: translateY(-5px);

    border-color: rgba(22, 119, 184, 0.45);

    box-shadow: 0 15px 35px rgba(22, 119, 184, 0.12);
}

.about-feature__icon {
    display: grid;
    place-items: center;

    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    color: var(--about-blue);
    background: var(--about-cyan);

    border-radius: 13px;

    font-size: 1rem;
}

.about-feature__icon i {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;

    margin: 0;
    padding: 0;

    font-size: 1.15rem;
    line-height: 1;

    text-align: center;
}

.about-feature:hover .about-feature__icon {
    color: #ffffff;
    background: var(--about-blue);

    transform: scale(1.05);
}


/* ==========================================================
   TEXT AREA
========================================================== */

.about-feature > div {
    flex: 1 1 auto;
    min-width: 0;
}


.about-feature strong,
.about-feature > div > span {
    display: block;
}


.about-feature strong {
    margin: 0;

    color: var(--about-deep-blue);

    font-size: 0.88rem;
    font-weight: 700;

    line-height: 1.35;
}


.about-feature > div > span {
    margin-top: 0.2rem;

    color: #718096;

    font-size: 0.72rem;

    line-height: 1.4;
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .about-feature {
        min-height: 82px;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .about-features {
        grid-template-columns: 1fr;
        gap: 0.8rem;
    }

    .about-feature {
        min-height: 80px;

        padding: 0.85rem 0.9rem;

        gap: 0.85rem;
    }

    .about-feature__icon {
        width: 50px;
        height: 50px;

        min-width: 50px;
        min-height: 50px;

        flex-basis: 50px;
    }

    .about-feature__icon i {
        font-size: 1.05rem;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 374.98px) {

    .about-feature {
        min-height: 76px;

        padding: 0.75rem;

        gap: 0.75rem;

        border-radius: 14px;
    }

    .about-feature__icon {
        width: 46px;
        height: 46px;

        min-width: 46px;
        min-height: 46px;

        flex-basis: 46px;

        border-radius: 12px;
    }

    .about-feature__icon i {
        font-size: 1rem;
    }

    .about-feature strong {
        font-size: 0.84rem;
    }

    .about-feature > div > span {
        font-size: 0.69rem;
    }

}

.about-feature strong,
.about-feature span {
    display: block;
}

.about-feature strong {
    color: var(--about-deep-blue);

    font-size: 0.83rem;
}

.about-feature span {
    margin-top: 0.15rem;

    color: #718096;

    font-size: 0.7rem;
}


/* =========================================================
   AFFILIATION CARDS
========================================================= */

.about-affiliations {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 0.75rem;

    margin-top: 1.8rem;
}

.affiliation-card {
    position: relative;

    display: flex;
    align-items: center;
    gap: 0.7rem;

    min-width: 0;

    padding: 1rem 0.8rem;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f5fbfe
        );

    border: 1px solid rgba(77, 183, 229, 0.25);
    border-radius: 16px;

    box-shadow: 0 9px 25px rgba(22, 119, 184, 0.08);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease;
}

.affiliation-card::before {
    content: "";

    position: absolute;
    left: 0;
    top: 20%;
    bottom: 20%;

    width: 3px;

    background: var(--about-blue);

    border-radius: 0 5px 5px 0;

    transition: top 0.3s ease, bottom 0.3s ease;
}

.affiliation-card:hover {
    transform: translateY(-6px);

    border-color: rgba(22, 119, 184, 0.45);

    box-shadow: 0 18px 38px rgba(22, 119, 184, 0.14);
}

.affiliation-card:hover::before {
    top: 0;
    bottom: 0;
}

.affiliation-card__icon {
    display: grid;
    place-items: center;

    width: 43px;
    height: 43px;

    flex: 0 0 43px;

    color: var(--about-blue);
    background: var(--about-cyan);

    border-radius: 12px;
}

.affiliation-card strong,
.affiliation-card span {
    display: block;
}

.affiliation-card strong {
    color: var(--about-deep-blue);

    font-size: 0.88rem;
}

.affiliation-card span {
    margin-top: 0.1rem;

    color: #718096;

    font-size: 0.7rem;
}

.affiliation-card__check {
    margin-left: auto;

    color: var(--about-green);

    font-size: 0.9rem;
}


/* =========================================================
   ANIMATION
========================================================= */

@keyframes aboutBadgeFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199.98px) {

    .about-visual {
        min-height: 500px;
    }

    .about-visual__main {
        height: 440px;
    }

    .about-visual__secondary {
        height: 200px;
    }

    .about-affiliations {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 991.98px) {

    .about-premium {
        padding: 4.5rem 0;
    }

    .about-visual {
        max-width: 700px;
        min-height: 540px;

        margin: 0 auto 1rem;
    }

    .about-visual__main {
        height: 470px;
    }

    .about-content {
        padding-left: 0;
    }

    .about-content h2 {
        max-width: 720px;
    }

    .about-affiliations {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}


@media (max-width: 767.98px) {

    .about-heading {
        margin-bottom: 2.5rem;
    }

    .about-visual {
        min-height: 480px;

        padding: 0 2.5rem 3.5rem 0;
    }

    .about-visual__main {
        width: 92%;
        height: 410px;

        border-width: 6px;
        border-radius: 22px;
    }

    .about-visual__secondary {
        width: 48%;
        height: 180px;

        border-width: 5px;
        border-radius: 18px;
    }

    .about-visual__badge {
        top: 1.5rem;
        right: 0;

        padding: 0.7rem 0.8rem;
    }

    .about-features {
        grid-template-columns: 1fr;
    }

    .about-affiliations {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 575.98px) {

    .about-premium {
        padding: 3.8rem 0;
    }

    .about-heading__label {
        font-size: 0.7rem;
    }

    .about-visual {
        min-height: auto;

        padding: 0;

        display: grid;
        gap: 1rem;
    }

    .about-visual__main {
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 3;
    }

    .about-visual__secondary {
        position: relative;
        right: auto;
        bottom: auto;

        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .about-visual__badge {
        top: 1rem;
        right: 1rem;
    }

    .about-content {
        margin-top: 1rem;
    }

    .about-content h2 {
        font-size: 2rem;
    }
}


@media (max-width: 374.98px) {

    .about-premium {
        padding: 3rem 0;
    }

    .about-visual__caption {
        left: 1rem;
        right: 1rem;
        bottom: 1rem;
    }

    .about-visual__badge {
        position: relative;
        top: auto;
        right: auto;

        width: 100%;
    }

    .about-feature {
        padding: 0.8rem;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .about-visual__badge {
        animation: none;
    }

    .about-visual__main img,
    .about-visual__secondary,
    .about-visual__secondary img,
    .about-feature,
    .affiliation-card {
        transition: none;
    }
}





/* ==========================================================
   PREMIUM WELCOME SECTION
========================================================== */

.jp-welcome {
    --jp-blue: #1677B8;
    --jp-deep: #174A7E;
    --jp-sky: #4DB7E5;
    --jp-cyan: #EAF8FC;
    --jp-green: #3BAA78;
    --jp-text: #5F6F7E;

    position: relative;
    overflow: hidden;

    padding: clamp(4.5rem, 7vw, 7rem) 0;

    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(77, 183, 229, 0.12),
            transparent 30rem
        ),
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f8fcfe 55%,
            #eef9fc 100%
        );
}


/* ==========================================================
   DECORATIVE BACKGROUND
========================================================== */

.jp-welcome__shape {
    position: absolute;

    pointer-events: none;

    border-radius: 50%;
}


.jp-welcome__shape--one {
    width: 350px;
    height: 350px;

    left: -220px;
    top: -120px;

    border: 60px solid rgba(77, 183, 229, 0.07);
}


.jp-welcome__shape--two {
    width: 250px;
    height: 250px;

    right: -140px;
    bottom: -120px;

    border: 45px solid rgba(59, 170, 120, 0.06);
}


/* ==========================================================
   LEFT INTRO
========================================================== */

.jp-welcome__intro {
    position: relative;

    max-width: 540px;
}


.jp-welcome__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;

    margin-bottom: 1.4rem;

    color: #637787;

    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.4;
}


.jp-welcome__eyebrow strong {
    display: block;

    color: var(--jp-blue);

    font-size: 0.82rem;
}


.jp-welcome__eyebrow-icon {
    display: grid;
    place-items: center;

    width: 44px;
    height: 44px;

    flex: 0 0 44px;

    color: #ffffff;

    background: var(--jp-blue);

    border-radius: 13px;

    box-shadow:
        0 10px 25px rgba(22, 119, 184, 0.23);
}


.jp-welcome__intro h2 {
    margin: 0;

    color: var(--jp-deep);

    font-size: clamp(2.25rem, 4.2vw, 3.8rem);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.035em;
}


.jp-welcome__intro h2 span {
    color: var(--jp-blue);
}


.jp-welcome__line {
    position: relative;

    width: 90px;
    height: 4px;

    margin: 1.6rem 0;

    overflow: hidden;

    background: #d9eef7;

    border-radius: 20px;
}


.jp-welcome__line span {
    position: absolute;

    left: 0;
    top: 0;

    width: 42px;
    height: 100%;

    background: var(--jp-sky);

    border-radius: inherit;

    animation: welcomeLine 3s ease-in-out infinite;
}


.jp-welcome__subtitle {
    max-width: 470px;

    margin-bottom: 1.8rem;

    color: var(--jp-text);

    font-size: 1rem;
    line-height: 1.8;
}


/* Identity */

.jp-welcome__identity {
    display: inline-flex;
    align-items: center;
    gap: 0.85rem;

    padding: 0.85rem 1rem;

    background: rgba(255, 255, 255, 0.8);

    border: 1px solid rgba(22, 119, 184, 0.12);
    border-radius: 16px;

    box-shadow:
        0 10px 35px rgba(23, 74, 126, 0.08);

    backdrop-filter: blur(10px);
}


.jp-welcome__identity-icon {
    display: grid;
    place-items: center;

    width: 45px;
    height: 45px;

    flex: 0 0 45px;

    color: var(--jp-blue);

    background: var(--jp-cyan);

    border-radius: 13px;

    font-size: 1.05rem;
}


.jp-welcome__identity span,
.jp-welcome__identity strong {
    display: block;
}


.jp-welcome__identity span {
    margin-bottom: 0.1rem;

    color: #7a8b98;

    font-size: 0.68rem;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: 0.07em;
}


.jp-welcome__identity strong {
    color: var(--jp-deep);

    font-size: 0.85rem;
}


/* ==========================================================
   MAIN CARD
========================================================== */

.jp-welcome__card {
    position: relative;

    padding: clamp(1.5rem, 3vw, 2.5rem);

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.98),
            rgba(246, 252, 254, 0.96)
        );

    border: 1px solid rgba(22, 119, 184, 0.14);
    border-radius: 28px;

    box-shadow:
        0 30px 80px rgba(23, 74, 126, 0.12),
        0 5px 20px rgba(22, 119, 184, 0.05);
}


.jp-welcome__card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 45px;

    width: 90px;
    height: 4px;

    background: linear-gradient(
        90deg,
        var(--jp-blue),
        var(--jp-sky)
    );

    border-radius: 0 0 10px 10px;
}


/* ==========================================================
   CARD HEADER
========================================================== */

.jp-welcome__card-header {
    display: flex;
    align-items: center;
    gap: 1rem;

    padding-bottom: 1.4rem;
    margin-bottom: 1.35rem;

    border-bottom: 1px solid #e7f0f4;
}


.jp-welcome__quote {
    display: grid;
    place-items: center;

    width: 55px;
    height: 55px;

    flex: 0 0 55px;

    color: #ffffff;

    background: var(--jp-blue);

    border-radius: 17px;

    box-shadow:
        0 10px 25px rgba(22, 119, 184, 0.22);

    font-size: 1.1rem;
}


.jp-welcome__card-header span {
    display: block;

    margin-bottom: 0.25rem;

    color: var(--jp-blue);

    font-size: 0.69rem;
    font-weight: 800;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}


.jp-welcome__card-header h3 {
    margin: 0;

    color: var(--jp-deep);

    font-size: clamp(1rem, 2vw, 1.3rem);
    font-weight: 750;
    line-height: 1.35;
}


.jp-welcome__description {
    margin-bottom: 1.5rem;

    color: var(--jp-text);

    font-size: 0.94rem;
    line-height: 1.8;
}


/* ==========================================================
   POINT CARDS
========================================================== */

.jp-welcome__points {
    display: grid;

    gap: 0.75rem;
}


.jp-welcome__point {
    position: relative;

    display: grid;

    grid-template-columns:
        auto
        auto
        minmax(0, 1fr)
        auto;

    align-items: center;

    gap: 0.85rem;

    padding: 1rem;

    overflow: hidden;

    background: #ffffff;

    border: 1px solid #e4eff4;
    border-radius: 17px;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}


.jp-welcome__point::before {
    content: "";

    position: absolute;

    left: 0;
    top: 50%;

    width: 3px;
    height: 0;

    background: var(--jp-blue);

    transform: translateY(-50%);

    transition: height 0.3s ease;
}


.jp-welcome__point:hover {
    transform: translateX(6px);

    border-color: rgba(22, 119, 184, 0.28);

    box-shadow:
        0 12px 30px rgba(22, 119, 184, 0.1);
}


.jp-welcome__point:hover::before {
    height: 60%;
}


/* Number */

.jp-welcome__point-number {
    color: #c5dce8;

    font-size: 0.72rem;
    font-weight: 800;
}


/* Icon */

.jp-welcome__point-icon {
    display: grid;
    place-items: center;

    width: 47px;
    height: 47px;

    flex: 0 0 47px;

    color: var(--jp-blue);

    background: var(--jp-cyan);

    border-radius: 13px;

    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}


.jp-welcome__point:hover .jp-welcome__point-icon {
    color: #ffffff;

    background: var(--jp-blue);

    transform: rotate(-5deg);
}


/* Point content */

.jp-welcome__point-content h4 {
    margin: 0 0 0.2rem;

    color: var(--jp-deep);

    font-size: 0.9rem;
    font-weight: 750;
}


.jp-welcome__point-content p {
    margin: 0;

    color: #778793;

    font-size: 0.72rem;
    line-height: 1.55;
}


/* Check */

.jp-welcome__point-check {
    display: grid;
    place-items: center;

    width: 27px;
    height: 27px;

    color: var(--jp-green);

    background: #eaf8f1;

    border-radius: 50%;

    font-size: 0.65rem;
}


/* ==========================================================
   BOTTOM INFORMATION BAR
========================================================== */

.jp-welcome__footer {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 0;

    margin-top: 1.5rem;

    padding-top: 1.4rem;

    border-top: 1px solid #e5eef3;
}


.jp-welcome__footer > div {
    display: flex;
    align-items: center;
    gap: 0.65rem;

    padding: 0 0.9rem;

    border-right: 1px solid #e3edf2;
}


.jp-welcome__footer > div:first-child {
    padding-left: 0;
}


.jp-welcome__footer > div:last-child {
    border-right: 0;
}


.jp-welcome__footer i {
    color: var(--jp-blue);

    font-size: 1rem;
}


.jp-welcome__footer span {
    color: var(--jp-deep);

    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.35;
}


.jp-welcome__footer small {
    display: block;

    margin-bottom: 0.1rem;

    color: #8998a3;

    font-size: 0.58rem;
    font-weight: 600;

    text-transform: uppercase;
}


/* ==========================================================
   ANIMATION
========================================================== */

@keyframes welcomeLine {

    0%,
    100% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(45px);
    }
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .jp-welcome {
        padding: 4.5rem 0;
    }


    .jp-welcome__intro {
        max-width: 750px;

        margin-bottom: 1rem;
    }


    .jp-welcome__intro h2 {
        max-width: 700px;
    }


    .jp-welcome__subtitle {
        max-width: 680px;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .jp-welcome {
        padding: 4rem 0;
    }


    .jp-welcome__intro h2 {
        font-size: clamp(2rem, 8vw, 2.8rem);
    }


    .jp-welcome__card {
        border-radius: 22px;
    }


    .jp-welcome__point {
        grid-template-columns:
            auto
            minmax(0, 1fr)
            auto;
    }


    .jp-welcome__point-number {
        display: none;
    }


    .jp-welcome__footer {
        grid-template-columns: 1fr;

        gap: 0.8rem;
    }


    .jp-welcome__footer > div,
    .jp-welcome__footer > div:first-child {
        padding: 0 0 0.8rem;

        border-right: 0;
        border-bottom: 1px solid #e5eef3;
    }


    .jp-welcome__footer > div:last-child {
        padding-bottom: 0;

        border-bottom: 0;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 575.98px) {

    .jp-welcome {
        padding: 3.5rem 0;
    }


    .jp-welcome__eyebrow {
        align-items: flex-start;
    }


    .jp-welcome__identity {
        width: 100%;
    }


    .jp-welcome__card {
        padding: 1.25rem;
    }


    .jp-welcome__card-header {
        align-items: flex-start;
    }


    .jp-welcome__quote {
        width: 46px;
        height: 46px;

        flex-basis: 46px;

        border-radius: 13px;
    }


    .jp-welcome__point {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        align-items: start;
    }


    .jp-welcome__point-icon {
        width: 42px;
        height: 42px;
    }


    .jp-welcome__point-check {
        display: none;
    }

}


/* ==========================================================
   320px DEVICES
========================================================== */

@media (max-width: 374.98px) {

    .jp-welcome__intro h2 {
        font-size: 1.85rem;
    }


    .jp-welcome__card {
        padding: 1rem;
    }


    .jp-welcome__point {
        gap: 0.7rem;

        padding: 0.85rem;
    }

}


/* ==========================================================
   ACCESSIBILITY
========================================================== */

@media (prefers-reduced-motion: reduce) {

    .jp-welcome__line span {
        animation: none;
    }


    .jp-welcome__point,
    .jp-welcome__point-icon {
        transition: none;
    }

}




/* =========================================================
   MANAGEMENT COUNCIL — INFINITE AUTO SLIDER
========================================================= */

.management-auto {
    --mc-blue: #1677B8;
    --mc-deep: #174A7E;
    --mc-sky: #4DB7E5;
    --mc-cyan: #EAF8FC;

    position: relative;
    overflow: hidden;

    padding: clamp(0rem, 4vw, 2rem) 0;

    background:
        radial-gradient(
            circle at 10% 20%,
            rgba(77, 183, 229, 0.09),
            transparent 28rem
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f7fbfd 100%
        );
}


/* =========================================================
   HEADING
========================================================= */

.management-auto__heading {
    margin-bottom: 2.5rem;
}


.management-auto__eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 0.5rem;

    margin-bottom: 0.6rem;

    color: var(--mc-blue);

    font-size: 0.75rem;
    font-weight: 800;

    text-transform: uppercase;
    letter-spacing: 0.08em;
}


.management-auto__heading h2 {
    margin: 0;

    color: var(--mc-deep);

    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 800;

    letter-spacing: -0.03em;
}


.management-auto__heading h2 span {
    color: var(--mc-blue);
}


.management-auto__line {
    width: 70px;
    height: 4px;

    margin-top: 0.9rem;

    background:
        linear-gradient(
            90deg,
            var(--mc-blue),
            var(--mc-sky)
        );

    border-radius: 50px;
}


/* =========================================================
   SLIDER
========================================================= */

.management-auto__slider {
    position: relative;

    width: 100%;

    overflow: hidden;

    padding:
        0.75rem
        0
        2rem;
}


/* Left fade */

.management-auto__slider::before {
    content: "";

    position: absolute;

    z-index: 10;

    top: 0;
    bottom: 0;
    left: 0;

    width: 70px;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            #f9fcfd,
            transparent
        );
}


/* Right fade */

.management-auto__slider::after {
    content: "";

    position: absolute;

    z-index: 10;

    top: 0;
    bottom: 0;
    right: 0;

    width: 70px;

    pointer-events: none;

    background:
        linear-gradient(
            270deg,
            #f9fcfd,
            transparent
        );
}


/* =========================================================
   TRACK
========================================================= */

.management-auto__track {
    --card-width: 290px;
    --card-gap: 24px;

    display: flex;

    width: max-content;

    gap: var(--card-gap);

    padding-left: var(--card-gap);

    will-change: transform;

    animation:
        managementInfiniteSlide
        50s
        linear
        infinite;
}



@keyframes managementInfiniteSlide {

    from {
        transform: translateX(0);
    }

    to {
        transform:
            translateX(
                calc(
                    -1 *
                    (var(--card-width) + var(--card-gap)) *
                    6
                )
            );
    }

}


/* =========================================================
   CARD
========================================================= */

.management-auto__card {
    flex:
        0 0
        var(--card-width);

    width: var(--card-width);

    overflow: hidden;

    background: #ffffff;

    border:
        1px solid
        rgba(23, 74, 126, 0.11);

    border-radius: 22px;

    box-shadow:
        0 10px 30px
        rgba(23, 74, 126, 0.09);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}


.management-auto__card:hover {
    transform: translateY(-8px);

    box-shadow:
        0 22px 45px
        rgba(23, 74, 126, 0.16);
}


/* =========================================================
   IMAGE
========================================================= */

.management-auto__image {
    padding:
        14px
        14px
        0;
}


.management-auto__image img {
    display: block;

    width: 100%;
    height: 290px;

    object-fit: cover;
    object-position: center top;

    background: #F3F8FA;

    border-radius: 16px;

    transition:
        transform 0.5s ease;
}


.management-auto__card:hover
.management-auto__image img {
    transform: scale(1.025);
}


/* =========================================================
   CONTENT
========================================================= */

.management-auto__content {
    position: relative;

    padding:
        1.4rem
        1.2rem
        1.5rem;

    text-align: center;
}


.management-auto__content > span {
    display: inline-flex;

    margin-bottom: 0.75rem;

    padding:
        0.35rem
        0.8rem;

    color: var(--mc-blue);
    background: var(--mc-cyan);

    border-radius: 50px;

    font-size: 0.66rem;
    font-weight: 800;

    letter-spacing: 0.05em;
    text-transform: uppercase;
}


.management-auto__content h3 {
    min-height: 2.8rem;

    margin:
        0
        0
        0.45rem;

    color: var(--mc-deep);

    font-size: 1rem;
    font-weight: 800;

    line-height: 1.4;
}


.management-auto__content p {
    margin: 0;

    color: #6b7c89;

    font-size: 0.82rem;
}


/* =========================================================
   LARGE SCREEN
========================================================= */

@media (min-width: 1600px) {

    .management-auto__track {
        --card-width: 310px;
        --card-gap: 28px;
    }


    .management-auto__image img {
        height: 310px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .management-auto__track {
        --card-width: 270px;
        --card-gap: 20px;

        animation-duration: 45s;
    }


    .management-auto__image img {
        height: 275px;
    }


    .management-auto__slider::before,
    .management-auto__slider::after {
        width: 35px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .management-auto {
        padding: 3.5rem 0;
    }


    .management-auto__heading {
        margin-bottom: 2rem;
    }


    .management-auto__heading h2 {
        font-size: 2rem;
    }


    .management-auto__track {
        --card-width: 250px;
        --card-gap: 16px;

        animation-duration: 45s;
    }


    .management-auto__image {
        padding:
            11px
            11px
            0;
    }


    .management-auto__image img {
        height: 250px;
    }


    .management-auto__slider::before,
    .management-auto__slider::after {
        width: 20px;
    }

}


/* =========================================================
   320px MOBILE
========================================================= */

@media (max-width: 374.98px) {

    .management-auto__track {
        --card-width: 235px;
        --card-gap: 14px;
    }


    .management-auto__image img {
        height: 235px;
    }

}





/* =========================================================
   COURSE OFFERED SECTION
========================================================= */

.jp-course-section {
    --course-blue: #1677B8;
    --course-deep: #174A7E;
    --course-sky: #4DB7E5;
    --course-cyan: #EAF8FC;
    --course-green: #38A878;
    --course-text: #627482;

    position: relative;
    overflow: hidden;

    padding: clamp(4rem, 7vw, 7rem) 0;

    background:
        radial-gradient(
            circle at 0% 20%,
            rgba(77, 183, 229, 0.10),
            transparent 28rem
        ),
        radial-gradient(
            circle at 100% 90%,
            rgba(56, 168, 120, 0.06),
            transparent 25rem
        ),
        #F7FBFD;
}


/* =========================================================
   BACKGROUND DECORATION
========================================================= */

.jp-course-shape {
    position: absolute;

    border-radius: 50%;

    pointer-events: none;
}


.jp-course-shape--left {
    top: -130px;
    left: -170px;

    width: 320px;
    height: 320px;

    border: 60px solid rgba(77, 183, 229, 0.05);
}


.jp-course-shape--right {
    right: -130px;
    bottom: -140px;

    width: 270px;
    height: 270px;

    border: 50px solid rgba(56, 168, 120, 0.045);
}


/* =========================================================
   SECTION HEADING
========================================================= */

.jp-course-heading {
    max-width: 750px;

    margin:
        0 auto
        clamp(2.5rem, 5vw, 4rem);
}


.jp-course-eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 0.5rem;

    margin-bottom: 0.9rem;

    padding:
        0.5rem
        0.95rem;

    color: var(--course-blue);
    background: #ffffff;

    border:
        1px solid
        rgba(22, 119, 184, 0.15);

    border-radius: 50px;

    box-shadow:
        0 7px 20px
        rgba(23, 74, 126, 0.06);

    font-size: 0.72rem;
    font-weight: 800;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}


.jp-course-heading h2 {
    margin: 0 0 0.8rem;

    color: var(--course-deep);

    font-size: clamp(2.1rem, 4vw, 3.4rem);
    font-weight: 800;

    line-height: 1.12;
    letter-spacing: -0.035em;
}


.jp-course-heading h2 span {
    color: var(--course-blue);
}


.jp-course-heading p {
    max-width: 600px;

    margin: 0 auto;

    color: var(--course-text);

    font-size: 0.95rem;
    line-height: 1.75;
}


/* Heading line */

.jp-course-heading-line {
    position: relative;

    width: 80px;
    height: 4px;

    margin:
        1.25rem
        auto
        0;

    overflow: hidden;

    background: #D7EDF6;

    border-radius: 20px;
}


.jp-course-heading-line span {
    position: absolute;

    top: 0;
    left: 0;

    width: 35px;
    height: 100%;

    background:
        linear-gradient(
            90deg,
            var(--course-blue),
            var(--course-sky)
        );

    border-radius: inherit;

    animation:
        jpCourseLine
        3s
        ease-in-out
        infinite;
}


/* =========================================================
   MAIN CARD
========================================================= */

.jp-course-card {
    position: relative;

    max-width: 1180px;

    margin: 0 auto;

    overflow: hidden;

    background: #ffffff;

    border:
        1px solid
        rgba(23, 74, 126, 0.10);

    border-radius: 30px;

    box-shadow:
        0 25px 70px
        rgba(23, 74, 126, 0.12);

    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease;
}


.jp-course-card:hover {
    transform: translateY(-7px);

    box-shadow:
        0 35px 85px
        rgba(23, 74, 126, 0.17);
}


/* Top accent */

.jp-course-card::before {
    content: "";

    position: absolute;

    z-index: 10;

    top: 0;
    left: 50%;

    width: 130px;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            var(--course-blue),
            var(--course-sky)
        );

    border-radius:
        0 0
        10px 10px;

    transform: translateX(-50%);

    transition:
        width 0.45s ease;
}


.jp-course-card:hover::before {
    width: 100%;
}


/* =========================================================
   IMAGE
========================================================= */

.jp-course-image {
    position: relative;

    height: 100%;
    min-height: 570px;

    overflow: hidden;

    background: #DDEEF5;
}


.jp-course-image > img {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transition:
        transform
        0.8s
        cubic-bezier(.2, .8, .2, 1);
}


.jp-course-card:hover
.jp-course-image > img {
    transform: scale(1.055);
}


/* Overlay */

.jp-course-image__overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(23, 74, 126, 0.02) 25%,
            rgba(10, 46, 78, 0.78) 100%
        );

    pointer-events: none;
}


/* =========================================================
   IMAGE BADGE
========================================================= */

.jp-course-image__badge {
    position: absolute;

    top: 1.5rem;
    left: 1.5rem;

    display: flex;
    align-items: center;

    gap: 0.7rem;

    padding:
        0.75rem
        0.9rem;

    color: var(--course-deep);
    background: rgba(255, 255, 255, 0.94);

    border:
        1px solid
        rgba(255, 255, 255, 0.7);

    border-radius: 14px;

    box-shadow:
        0 10px 30px
        rgba(23, 74, 126, 0.16);

    backdrop-filter: blur(10px);
}


.jp-course-image__badge > i {
    display: grid;
    place-items: center;

    width: 40px;
    height: 40px;

    color: #ffffff;
    background: var(--course-blue);

    border-radius: 11px;
}


.jp-course-image__badge small,
.jp-course-image__badge strong {
    display: block;
}


.jp-course-image__badge small {
    margin-bottom: 0.05rem;

    color: #7C8D99;

    font-size: 0.6rem;

    text-transform: uppercase;
    letter-spacing: 0.06em;
}


.jp-course-image__badge strong {
    font-size: 0.78rem;
}


/* =========================================================
   IMAGE CAPTION
========================================================= */

.jp-course-image__caption {
    position: absolute;

    left: 1.7rem;
    right: 1.7rem;
    bottom: 1.7rem;

    color: #ffffff;
}


.jp-course-image__caption span {
    display: flex;
    align-items: center;

    gap: 0.5rem;

    margin-bottom: 0.45rem;

    font-size: 0.7rem;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.05em;
}


.jp-course-image__caption h3 {
    max-width: 400px;

    margin: 0;

    color: #ffffff;

    font-size: clamp(1.35rem, 2.5vw, 2rem);
    font-weight: 800;

    line-height: 1.25;
}


/* =========================================================
   CONTENT
========================================================= */

.jp-course-content {
    display: flex;
    flex-direction: column;
    justify-content: center;

    height: 100%;

    padding:
        clamp(2rem, 4vw, 3.7rem);
}


.jp-course-content__top {
    display: flex;
    align-items: center;

    gap: 0.75rem;

    margin-bottom: 1.1rem;
}


/* Number */

.jp-course-number {
    display: grid;
    place-items: center;

    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    color: var(--course-blue);
    background: var(--course-cyan);

    border-radius: 12px;

    font-size: 0.72rem;
    font-weight: 900;
}


/* Label */

.jp-course-label {
    color: var(--course-blue);

    font-size: 0.7rem;
    font-weight: 800;

    letter-spacing: 0.06em;
    text-transform: uppercase;
}


/* Course title */

.jp-course-content > h3 {
    margin:
        0
        0
        1rem;

    color: var(--course-deep);

    font-size: clamp(2rem, 4vw, 3.15rem);
    font-weight: 800;

    line-height: 1.05;
    letter-spacing: -0.035em;
}


.jp-course-content > h3 span {
    color: var(--course-blue);
}


/* Description */

.jp-course-description {
    margin-bottom: 1.7rem;

    color: var(--course-text);

    font-size: 0.95rem;
    line-height: 1.8;
}


/* =========================================================
   SUBJECTS
========================================================= */

.jp-course-subjects {
    display: grid;

    gap: 0.75rem;
}


.jp-course-subject {
    display: flex;
    align-items: center;

    gap: 0.85rem;

    padding:
        0.85rem
        1rem;

    background:
        linear-gradient(
            90deg,
            #F8FCFE,
            #FFFFFF
        );

    border:
        1px solid
        #E4F0F5;

    border-radius: 15px;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}


.jp-course-subject:hover {
    transform: translateX(6px);

    border-color:
        rgba(22, 119, 184, 0.3);

    box-shadow:
        0 9px 25px
        rgba(22, 119, 184, 0.08);
}


.jp-course-subject__icon {
    display: grid;
    place-items: center;

    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    color: var(--course-green);
    background: #EAF8F1;

    border-radius: 11px;

    font-size: 0.75rem;
}


.jp-course-subject small,
.jp-course-subject strong {
    display: block;
}


.jp-course-subject small {
    margin-bottom: 0.1rem;

    color: #83929D;

    font-size: 0.58rem;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.05em;
}


.jp-course-subject strong {
    color: var(--course-deep);

    font-size: 0.8rem;
    font-weight: 750;
}


/* =========================================================
   FOOTER
========================================================= */

.jp-course-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 1rem;

    margin-top: 1.8rem;

    padding-top: 1.5rem;

    border-top:
        1px solid
        #E7EFF3;
}


/* Button */

.jp-course-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 0.7rem;

    min-height: 48px;

    padding:
        0.8rem
        1.25rem;

    color: #ffffff;
    background: var(--course-blue);

    border:
        1px solid
        var(--course-blue);

    border-radius: 12px;

    box-shadow:
        0 10px 25px
        rgba(22, 119, 184, 0.18);

    font-size: 0.8rem;
    font-weight: 700;

    text-decoration: none;

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
}


.jp-course-btn:hover {
    color: #ffffff;
    background: var(--course-deep);

    transform: translateY(-3px);

    box-shadow:
        0 15px 30px
        rgba(23, 74, 126, 0.22);
}


.jp-course-btn i {
    transition:
        transform 0.3s ease;
}


.jp-course-btn:hover i {
    transform: translateX(4px);
}


/* Footer information */

.jp-course-footer__note {
    display: flex;
    align-items: center;

    gap: 0.6rem;

    color: var(--course-deep);
}


.jp-course-footer__note > i {
    color: var(--course-blue);

    font-size: 1rem;
}


.jp-course-footer__note span {
    font-size: 0.7rem;
    font-weight: 700;

    line-height: 1.35;
}


.jp-course-footer__note small {
    display: block;

    color: #8A99A3;

    font-size: 0.56rem;
    font-weight: 600;

    text-transform: uppercase;
}


/* =========================================================
   ANIMATION
========================================================= */

@keyframes jpCourseLine {

    0%,
    100% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(45px);
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .jp-course-section {
        padding:
            4.5rem
            0;
    }


    .jp-course-card {
        max-width: 760px;

        border-radius: 25px;
    }


    .jp-course-image {
        min-height: 430px;
    }


    .jp-course-content {
        padding:
            2.5rem;
    }


    .jp-course-content > h3 {
        font-size: 2.6rem;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .jp-course-section {
        padding:
            4rem
            0;
    }


    .jp-course-heading {
        margin-bottom: 2.5rem;
    }


    .jp-course-image {
        min-height: 380px;
    }


    .jp-course-content {
        padding:
            2rem;
    }


    .jp-course-content > h3 {
        font-size: 2.25rem;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .jp-course-section {
        padding:
            3.5rem
            0;
    }


    .jp-course-card {
        border-radius: 20px;
    }


    .jp-course-image {
        min-height: 330px;
    }


    .jp-course-image__badge {
        top: 1rem;
        left: 1rem;

        padding:
            0.6rem
            0.7rem;
    }


    .jp-course-image__badge > i {
        width: 35px;
        height: 35px;
    }


    .jp-course-image__caption {
        left: 1.2rem;
        right: 1.2rem;
        bottom: 1.2rem;
    }


    .jp-course-content {
        padding:
            1.5rem;
    }


    .jp-course-content > h3 {
        font-size: 2rem;
    }


    .jp-course-description {
        font-size: 0.9rem;
    }


    .jp-course-footer {
        align-items: stretch;
        flex-direction: column;
    }


    .jp-course-btn {
        width: 100%;
    }


    .jp-course-footer__note {
        justify-content: center;

        padding-top: 0.4rem;
    }

}


/* =========================================================
   320PX DEVICES
========================================================= */

@media (max-width: 374.98px) {

    .jp-course-section {
        padding:
            3rem
            0;
    }


    .jp-course-heading h2 {
        font-size: 1.9rem;
    }


    .jp-course-image {
        min-height: 290px;
    }


    .jp-course-image__badge strong {
        font-size: 0.68rem;
    }


    .jp-course-content {
        padding:
            1.2rem;
    }


    .jp-course-content > h3 {
        font-size: 1.8rem;
    }


    .jp-course-subject {
        padding:
            0.75rem;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .jp-course-heading-line span {
        animation: none;
    }


    .jp-course-card,
    .jp-course-image > img,
    .jp-course-subject,
    .jp-course-btn,
    .jp-course-btn i {
        transition: none;
    }

}


/* =========================================================
   PREMIUM STATISTICS SECTION
========================================================= */

.jp-stats {
    --stats-blue: #1677B8;
    --stats-deep: #174A7E;
    --stats-sky: #4DB7E5;
    --stats-cyan: #EAF8FC;
    --stats-green: #3BAA78;
    --stats-text: #687A87;

    position: relative;
    overflow: hidden;

    padding: clamp(4rem, 6vw, 6rem) 0;

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(77, 183, 229, 0.11),
            transparent 25rem
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(59, 170, 120, 0.07),
            transparent 25rem
        ),
        linear-gradient(
            180deg,
            #F7FBFD 0%,
            #FFFFFF 100%
        );
}


/* =========================================================
   DECORATION
========================================================= */

.jp-stats__shape {
    position: absolute;

    pointer-events: none;

    border-radius: 50%;
}


.jp-stats__shape--left {
    top: -170px;
    left: -170px;

    width: 330px;
    height: 330px;

    border:
        60px solid
        rgba(77, 183, 229, 0.045);
}


.jp-stats__shape--right {
    right: -140px;
    bottom: -150px;

    width: 290px;
    height: 290px;

    border:
        55px solid
        rgba(59, 170, 120, 0.04);
}


/* =========================================================
   HEADING
========================================================= */

.jp-stats__heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 2rem;

    margin-bottom:
        clamp(2.5rem, 5vw, 3.8rem);
}


.jp-stats__eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 0.5rem;

    margin-bottom: 0.75rem;

    color: var(--stats-blue);

    font-size: 0.72rem;
    font-weight: 800;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}


.jp-stats__heading h2 {
    max-width: 620px;

    margin: 0;

    color: var(--stats-deep);

    font-size:
        clamp(2rem, 4vw, 3.1rem);

    font-weight: 800;

    line-height: 1.1;
    letter-spacing: -0.035em;
}


.jp-stats__heading h2 span {
    color: var(--stats-blue);
}


.jp-stats__heading p {
    max-width: 450px;

    margin: 0;

    color: var(--stats-text);

    font-size: 0.92rem;
    line-height: 1.75;
}


/* =========================================================
   STAT CARD
========================================================= */

.jp-stat-card {
    position: relative;

    height: 100%;
    min-height: 310px;

    padding:
        1.5rem
        1.4rem;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #FFFFFF 0%,
            #FAFDFE 100%
        );

    border:
        1px solid
        rgba(23, 74, 126, 0.10);

    border-radius: 22px;

    box-shadow:
        0 10px 35px
        rgba(23, 74, 126, 0.08);

    transition:
        transform 0.4s cubic-bezier(.2,.8,.2,1),
        box-shadow 0.4s ease,
        border-color 0.4s ease;
}


/* Top blue accent */

.jp-stat-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 50%;

    width: 0;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            var(--stats-blue),
            var(--stats-sky)
        );

    border-radius:
        0 0
        10px 10px;

    transform: translateX(-50%);

    transition: width 0.4s ease;
}


.jp-stat-card:hover {
    transform: translateY(-10px);

    border-color:
        rgba(22, 119, 184, 0.28);

    box-shadow:
        0 25px 55px
        rgba(23, 74, 126, 0.15);
}


.jp-stat-card:hover::before {
    width: 100%;
}


/* =========================================================
   BACKGROUND NUMBER
========================================================= */

.jp-stat-card__number-bg {
    position: absolute;

    right: -5px;
    bottom: -12px;

    color:
        rgba(22, 119, 184, 0.045);

    font-size: 7rem;
    font-weight: 900;

    line-height: 1;

    pointer-events: none;

    transition:
        transform 0.5s ease;
}


.jp-stat-card:hover
.jp-stat-card__number-bg {
    transform:
        translate(-8px, -8px);
}


/* =========================================================
   CARD TOP
========================================================= */

.jp-stat-card__top {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 1rem;

    margin-bottom: 1.5rem;
}


/* Icon */

.jp-stat-card__icon {
    display: grid;
    place-items: center;

    width: 52px;
    height: 52px;

    flex: 0 0 52px;

    color: var(--stats-blue);

    background:
        var(--stats-cyan);

    border:
        1px solid
        rgba(77, 183, 229, 0.13);

    border-radius: 15px;

    font-size: 1.1rem;

    transition:
        color 0.35s ease,
        background 0.35s ease,
        transform 0.35s ease,
        box-shadow 0.35s ease;
}


.jp-stat-card:hover
.jp-stat-card__icon {
    color: #FFFFFF;

    background:
        var(--stats-blue);

    transform:
        rotate(-5deg)
        scale(1.05);

    box-shadow:
        0 10px 25px
        rgba(22, 119, 184, 0.22);
}


/* Tag */

.jp-stat-card__tag {
    padding:
        0.4rem
        0.7rem;

    color: var(--stats-blue);

    background:
        #F1FAFD;

    border:
        1px solid
        rgba(77, 183, 229, 0.16);

    border-radius: 50px;

    font-size: 0.6rem;
    font-weight: 800;

    letter-spacing: 0.06em;
    text-transform: uppercase;
}


/* =========================================================
   COUNTER
========================================================= */

.jp-stat-card__counter {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: flex-start;

    margin-bottom: 0.35rem;
}


.jp-stat-card__counter strong {
    color: var(--stats-deep);

    font-size:
        clamp(2.7rem, 5vw, 4rem);

    font-weight: 850;

    line-height: 1;

    letter-spacing: -0.05em;
}


.jp-stat-card__plus {
    margin:
        0.2rem
        0
        0
        0.25rem;

    color: var(--stats-sky);

    font-size: 1.3rem;
    font-weight: 800;
}


/* =========================================================
   TITLE / DESCRIPTION
========================================================= */

.jp-stat-card h3 {
    position: relative;
    z-index: 2;

    margin:
        0
        0
        0.55rem;

    color: var(--stats-deep);

    font-size: 1rem;
    font-weight: 800;

    line-height: 1.35;
}


.jp-stat-card p {
    position: relative;
    z-index: 2;

    min-height: 44px;

    margin: 0;

    color: var(--stats-text);

    font-size: 0.76rem;
    line-height: 1.55;
}


/* =========================================================
   BOTTOM ACCENT
========================================================= */

.jp-stat-card__bottom {
    position: absolute;

    left: 1.4rem;
    right: 1.4rem;
    bottom: 1.3rem;

    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;
}


.jp-stat-card__bottom span {
    display: block;

    width: 35px;
    height: 3px;

    background:
        var(--stats-sky);

    border-radius: 20px;

    transition:
        width 0.4s ease;
}


.jp-stat-card:hover
.jp-stat-card__bottom span {
    width: 75px;
}


.jp-stat-card__bottom i {
    color:
        rgba(22, 119, 184, 0.35);

    font-size: 0.9rem;

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}


.jp-stat-card:hover
.jp-stat-card__bottom i {
    color: var(--stats-blue);

    transform: translateX(-4px);
}


/* =========================================================
   992px – 1199px
========================================================= */

@media (
    min-width: 992px
)
and (
    max-width: 1199.98px
) {

    .jp-stat-card {
        padding:
            1.3rem
            1.15rem;
    }


    .jp-stat-card__tag {
        font-size: 0.53rem;
    }


    .jp-stat-card h3 {
        font-size: 0.9rem;
    }


    .jp-stat-card p {
        font-size: 0.7rem;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .jp-stats {
        padding:
            4.5rem
            0;
    }


    .jp-stats__heading {
        align-items: flex-start;
        flex-direction: column;

        gap: 1rem;
    }


    .jp-stats__heading p {
        max-width: 650px;
    }


    .jp-stat-card {
        min-height: 300px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .jp-stats {
        padding:
            3.5rem
            0;
    }


    .jp-stats__heading {
        margin-bottom: 2rem;
    }


    .jp-stats__heading h2 {
        font-size: 2rem;
    }


    .jp-stat-card {
        min-height: 250px;

        padding:
            1rem
            0.9rem;

        border-radius: 17px;
    }


    .jp-stat-card__top {
        align-items: flex-start;

        margin-bottom: 1.1rem;
    }


    .jp-stat-card__icon {
        width: 44px;
        height: 44px;

        flex-basis: 44px;

        border-radius: 12px;

        font-size: 0.95rem;
    }


    .jp-stat-card__tag {
        padding:
            0.32rem
            0.5rem;

        font-size: 0.5rem;
    }


    .jp-stat-card__counter strong {
        font-size: 2.6rem;
    }


    .jp-stat-card__plus {
        font-size: 1rem;
    }


    .jp-stat-card h3 {
        font-size: 0.83rem;
    }


    .jp-stat-card p {
        min-height: 0;

        padding-bottom: 2rem;

        font-size: 0.66rem;
    }


    .jp-stat-card__bottom {
        left: 0.9rem;
        right: 0.9rem;
        bottom: 0.9rem;
    }


    .jp-stat-card__number-bg {
        font-size: 5rem;
    }

}


/* =========================================================
   320px
========================================================= */

@media (max-width: 374.98px) {

    .jp-stats {
        padding:
            3rem
            0;
    }


    .jp-stats__heading h2 {
        font-size: 1.8rem;
    }


    /*
       Keep 2 cards per row at 320px,
       but simplify the content.
    */

    .jp-stat-card {
        min-height: 225px;

        padding:
            0.85rem
            0.75rem;
    }


    .jp-stat-card__icon {
        width: 40px;
        height: 40px;

        flex-basis: 40px;
    }


    .jp-stat-card__tag {
        display: none;
    }


    .jp-stat-card__counter strong {
        font-size: 2.35rem;
    }


    .jp-stat-card h3 {
        font-size: 0.78rem;
    }


    .jp-stat-card p {
        font-size: 0.62rem;
        line-height: 1.45;
    }


    .jp-stat-card__bottom {
        left: 0.75rem;
        right: 0.75rem;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .jp-stat-card,
    .jp-stat-card__icon,
    .jp-stat-card__number-bg,
    .jp-stat-card__bottom span,
    .jp-stat-card__bottom i {
        transition: none;
    }

}



/* ==========================================================
   STUDENT VOICES
========================================================== */

.student-voices {
    --sv-blue: #1677B8;
    --sv-deep: #174A7E;
    --sv-sky: #4DB7E5;
    --sv-cyan: #EAF8FC;
    --sv-green: #48A984;
    --sv-text: #687985;

    position: relative;
    overflow: hidden;

    padding: clamp(2rem, 0vw, 6.5rem) 0;

    background: #ffffff;
}


/* ==========================================================
   HEADING
========================================================== */

.student-voices__heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 3rem;

    margin-bottom: clamp(2.5rem, 5vw, 4rem);
}


.student-voices__title {
    max-width: 650px;
}


.student-voices__eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 0.5rem;

    margin-bottom: 0.8rem;

    color: var(--sv-blue);

    font-size: 0.72rem;
    font-weight: 800;

    letter-spacing: 0.09em;
    text-transform: uppercase;
}


.student-voices__eyebrow::before {
    content: "";

    width: 28px;
    height: 2px;

    background: var(--sv-sky);

    border-radius: 20px;
}


.student-voices__heading h2 {
    margin: 0;

    color: var(--sv-deep);

    font-size: clamp(2.1rem, 4vw, 3.6rem);
    font-weight: 800;

    line-height: 1.08;
    letter-spacing: -0.04em;
}


.student-voices__heading h2 span {
    display: block;

    color: var(--sv-blue);
}


.student-voices__heading > p {
    max-width: 430px;

    margin: 0;

    color: var(--sv-text);

    font-size: 0.92rem;
    line-height: 1.8;
}


/* ==========================================================
   FEATURED CARD
========================================================== */

.voice-featured {
    position: relative;

    height: 100%;
    min-height: 430px;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #174A7E 0%,
            #1677B8 100%
        );

    border-radius: 28px;

    box-shadow:
        0 22px 55px
        rgba(23, 74, 126, 0.20);
}


/* Decorative circle */

.voice-featured::before {
    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    right: -150px;
    top: -150px;

    border:
        55px solid
        rgba(255, 255, 255, 0.055);

    border-radius: 50%;
}


.voice-featured::after {
    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    left: -90px;
    bottom: -100px;

    background:
        rgba(77, 183, 229, 0.12);

    border-radius: 50%;
}


.voice-featured__content {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;

    height: 100%;

    padding:
        clamp(2rem, 4vw, 3.2rem);
}


/* Large background quote */

.voice-featured__decor {
    position: absolute;

    right: 2rem;
    bottom: -2.5rem;

    color:
        rgba(255, 255, 255, 0.055);

    font-size: 13rem;

    line-height: 1;

    transform: rotate(-8deg);
}


/* ==========================================================
   FEATURED TOP
========================================================== */

.voice-featured__top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 2.5rem;
}


.voice-featured__label {
    display: inline-flex;

    padding:
        0.48rem
        0.9rem;

    color: #ffffff;

    background:
        rgba(255, 255, 255, 0.12);

    border:
        1px solid
        rgba(255, 255, 255, 0.18);

    border-radius: 50px;

    font-size: 0.66rem;
    font-weight: 700;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}


.voice-featured__quote {
    display: grid;
    place-items: center;

    width: 54px;
    height: 54px;

    color: var(--sv-deep);
    background: #ffffff;

    border-radius: 16px;

    box-shadow:
        0 10px 25px
        rgba(0, 0, 0, 0.10);

    font-size: 1.1rem;

    transition:
        transform 0.35s ease;
}


.voice-featured:hover
.voice-featured__quote {
    transform:
        rotate(-8deg)
        scale(1.08);
}


/* ==========================================================
   FEATURED QUOTE
========================================================== */

.voice-featured blockquote {
    max-width: 650px;

    margin:
        0
        0
        3rem;

    color: #ffffff;

    font-size:
        clamp(1.35rem, 2.4vw, 2rem);

    font-weight: 600;

    line-height: 1.55;
    letter-spacing: -0.02em;
}


/* ==========================================================
   FEATURED FOOTER
========================================================== */

.voice-featured__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 2rem;

    margin-top: auto;

    padding-top: 1.5rem;

    border-top:
        1px solid
        rgba(255, 255, 255, 0.17);
}


.voice-student {
    display: flex;
    align-items: center;

    gap: 0.85rem;
}


.voice-student__avatar {
    display: grid;
    place-items: center;

    width: 52px;
    height: 52px;

    flex: 0 0 52px;

    color: var(--sv-blue);
    background: #ffffff;

    border-radius: 50%;

    box-shadow:
        0 8px 20px
        rgba(0, 0, 0, 0.10);
}


.voice-student strong,
.voice-student span {
    display: block;
}


.voice-student strong {
    margin-bottom: 0.2rem;

    color: #ffffff;

    font-size: 0.9rem;
    font-weight: 750;
}


.voice-student span {
    color:
        rgba(255, 255, 255, 0.70);

    font-size: 0.7rem;
}


.voice-featured__mark {
    text-align: right;
}


.voice-featured__mark > span {
    display: block;

    width: 55px;
    height: 3px;

    margin:
        0
        0
        0.5rem
        auto;

    background: var(--sv-sky);

    border-radius: 20px;

    transition:
        width 0.4s ease;
}


.voice-featured:hover
.voice-featured__mark > span {
    width: 90px;
}


.voice-featured__mark small {
    color:
        rgba(255, 255, 255, 0.65);

    font-size: 0.62rem;

    letter-spacing: 0.05em;
    text-transform: uppercase;
}


/* ==========================================================
   RIGHT SIDE
========================================================== */

.voice-list {
    display: grid;

    height: 100%;

    gap: 1.25rem;
}


/* ==========================================================
   MINI CARD
========================================================== */

.voice-mini {
    position: relative;

    display: flex;

    min-height: 200px;

    overflow: hidden;

    background: #F7FBFD;

    border:
        1px solid
        #E1EEF4;

    border-radius: 22px;

    transition:
        transform 0.4s ease,
        background 0.4s ease,
        border-color 0.4s ease,
        box-shadow 0.4s ease;
}


.voice-mini:hover {
    transform: translateX(7px);

    background: #ffffff;

    border-color:
        rgba(22, 119, 184, 0.25);

    box-shadow:
        0 18px 40px
        rgba(23, 74, 126, 0.11);
}


/* Number */

.voice-mini__number {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 58px;
    flex: 0 0 58px;

    color:
        rgba(22, 119, 184, 0.42);

    background:
        var(--sv-cyan);

    border-right:
        1px solid
        rgba(22, 119, 184, 0.09);

    font-size: 0.72rem;
    font-weight: 900;

    letter-spacing: 0.08em;

    writing-mode: vertical-rl;

    transform: rotate(180deg);
}


/* Content */

.voice-mini__body {
    position: relative;

    display: flex;
    flex-direction: column;

    width: 100%;

    padding: 1.4rem 1.5rem;
}


.voice-mini__icon {
    display: grid;
    place-items: center;

    width: 42px;
    height: 42px;

    margin-bottom: 1rem;

    color: var(--sv-blue);
    background: #ffffff;

    border:
        1px solid
        #DCECF4;

    border-radius: 12px;

    box-shadow:
        0 6px 16px
        rgba(23, 74, 126, 0.07);

    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}


.voice-mini__icon--green {
    color: var(--sv-green);
}


.voice-mini:hover
.voice-mini__icon {
    color: #ffffff;
    background: var(--sv-blue);

    transform: rotate(-5deg);
}


.voice-mini:hover
.voice-mini__icon--green {
    background: var(--sv-green);
}


.voice-mini p {
    margin:
        0
        0
        1.25rem;

    color: var(--sv-deep);

    font-size: 0.9rem;
    font-weight: 600;

    line-height: 1.65;
}


/* Mini Footer */

.voice-mini__footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 1rem;

    margin-top: auto;
}


.voice-mini__footer strong,
.voice-mini__footer span {
    display: block;
}


.voice-mini__footer strong {
    margin-bottom: 0.15rem;

    color: var(--sv-deep);

    font-size: 0.78rem;
    font-weight: 800;
}


.voice-mini__footer span {
    color: var(--sv-text);

    font-size: 0.65rem;
}


.voice-mini__quote {
    color:
        rgba(22, 119, 184, 0.12);

    font-size: 2rem;

    transition:
        color 0.3s ease,
        transform 0.3s ease;
}


.voice-mini:hover
.voice-mini__quote {
    color:
        rgba(22, 119, 184, 0.28);

    transform: scale(1.1);
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .student-voices {
        padding: 4.5rem 0;
    }


    .student-voices__heading {
        align-items: flex-start;
        flex-direction: column;

        gap: 1rem;
    }


    .student-voices__heading > p {
        max-width: 650px;
    }


    .voice-featured {
        min-height: 400px;
    }


    .voice-list {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .voice-mini {
        height: 100%;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .student-voices {
        padding: 4rem 0;
    }


    .student-voices__heading {
        margin-bottom: 2.5rem;
    }


    .student-voices__heading h2 {
        font-size: 2.25rem;
    }


    .voice-featured {
        min-height: auto;

        border-radius: 22px;
    }


    .voice-featured__content {
        min-height: 390px;

        padding: 1.8rem;
    }


    .voice-featured blockquote {
        font-size: 1.35rem;
    }


    .voice-list {
        grid-template-columns: 1fr;
    }


    .voice-mini:hover {
        transform: translateY(-5px);
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 575.98px) {

    .student-voices {
        padding: 3.5rem 0;
    }


    .student-voices__heading h2 {
        font-size: 2rem;
    }


    .student-voices__heading > p {
        font-size: 0.86rem;
    }


    .voice-featured__content {
        min-height: 370px;

        padding: 1.4rem;
    }


    .voice-featured__top {
        margin-bottom: 2rem;
    }


    .voice-featured__quote {
        width: 46px;
        height: 46px;

        border-radius: 13px;
    }


    .voice-featured blockquote {
        margin-bottom: 2rem;

        font-size: 1.15rem;
        line-height: 1.6;
    }


    .voice-featured__footer {
        align-items: flex-start;
        flex-direction: column;

        gap: 1rem;
    }


    .voice-featured__mark {
        display: none;
    }


    .voice-mini {
        min-height: 190px;

        border-radius: 18px;
    }


    .voice-mini__number {
        width: 45px;
        flex-basis: 45px;
    }


    .voice-mini__body {
        padding: 1.2rem;
    }

}


/* ==========================================================
   320PX
========================================================== */

@media (max-width: 374.98px) {

    .student-voices {
        padding: 3rem 0;
    }


    .student-voices__heading h2 {
        font-size: 1.8rem;
    }


    .voice-featured__content {
        min-height: 350px;

        padding: 1.15rem;
    }


    .voice-featured__label {
        font-size: 0.56rem;
    }


    .voice-featured blockquote {
        font-size: 1.05rem;
    }


    .voice-mini__number {
        display: none;
    }


    .voice-mini__body {
        padding: 1.15rem;
    }

}


/* ==========================================================
   REDUCED MOTION
========================================================== */

@media (prefers-reduced-motion: reduce) {

    .voice-featured__quote,
    .voice-featured__mark span,
    .voice-mini,
    .voice-mini__icon,
    .voice-mini__quote {
        transition: none;
    }

}

/* ==================================================
   TESTIMONIAL AUTO CHANGE
================================================== */

.voice-featured__changing,
.voice-mini__body {
    opacity: 1;
    transform: translateY(0);

    transition:
        opacity 0.35s ease,
        transform 0.35s ease;
}


/* Big card fade */

.voice-featured.testimonial-changing
.voice-featured__changing {
    opacity: 0;

    transform: translateY(18px);
}


/* Small cards fade */

.voice-mini.testimonial-changing
.voice-mini__body {
    opacity: 0;

    transform: translateY(12px);
}


/* ==================================================
   PROGRESS BAR
================================================== */

.voice-featured__progress {
    position: absolute;

    z-index: 20;

    left: 0;
    right: 0;
    bottom: 0;

    height: 4px;

    overflow: hidden;

    background:
        rgba(255, 255, 255, 0.12);
}


.voice-featured__progress span {
    display: block;

    width: 0;
    height: 100%;

    background: #4DB7E5;
}


.voice-featured__progress span.testimonial-progress-running {
    animation:
        testimonialAutoProgress
        4s
        linear
        forwards;
}


@keyframes testimonialAutoProgress {

    from {
        width: 0%;
    }

    to {
        width: 100%;
    }

}


/* ==================================================
   REDUCED MOTION
================================================== */

@media (prefers-reduced-motion: reduce) {

    .voice-featured__changing,
    .voice-mini__body {
        transition: none;
    }

}



/* =========================================================
   PLACEMENT — NATURAL / COMPACT FIX
========================================================= */

.placement-journey {
    padding: 5.5rem 0;
    background: #fff;
    overflow: hidden;
}


/* ---------- HEADING ---------- */

.placement-journey__heading {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    align-items: end;
    gap: 3rem;

    margin-bottom: 1.8rem;
}

.placement-journey__heading > div {
    max-width: 650px;
}

.placement-journey__eyebrow {
    margin-bottom: 0.55rem;

    font-size: 0.7rem;
    font-weight: 700;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.placement-journey__heading h2 {
    margin: 0;

    color: #174A7E;

    font-size: clamp(2rem, 3vw, 2.8rem);
    font-weight: 700;

    line-height: 1.15;
    letter-spacing: -0.025em;
}

.placement-journey__heading h2 span {
    color: #1677B8;
}

.placement-journey__heading > p {
    max-width: 440px;

    margin: 0 0 0.2rem auto;

    color: #687C89;

    font-size: 0.9rem;
    line-height: 1.65;
}


/* =========================================================
   MAIN LAYOUT
========================================================= */

.placement-journey__layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(360px, 0.85fr);

    gap: 1.5rem;

    align-items: stretch;

    max-width: 1240px;

    margin: 0 auto;
}


/* =========================================================
   LEFT IMAGE
========================================================= */

.placement-journey__visual {
    position: relative;

    min-width: 0;

    /* Do not use fixed 490px height */
    min-height: 390px;

    overflow: hidden;

    background: #EAF8FC;

    border-radius: 22px;

    box-shadow:
        0 15px 35px
        rgba(23, 74, 126, 0.12);
}

.placement-journey__visual > img {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;

    /* keeps students properly visible */
    object-position: center center;

    transition: transform 0.6s ease;
}

.placement-journey__visual:hover > img {
    transform: scale(1.025);
}


/* =========================================================
   OVERLAY
========================================================= */

.placement-journey__overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(15, 62, 99, 0.58) 0%,
            rgba(15, 62, 99, 0.20) 55%,
            rgba(15, 62, 99, 0.04) 100%
        );
}


/* =========================================================
   IMAGE BADGE
========================================================= */

.placement-journey__badge {
    position: absolute;

    top: 1.2rem;
    left: 1.2rem;

    display: flex;
    align-items: center;

    gap: 0.6rem;

    padding: 0.55rem 0.7rem;

    background: rgba(255, 255, 255, 0.95);

    border-radius: 12px;

    box-shadow:
        0 6px 18px
        rgba(23, 74, 126, 0.12);
}

.placement-journey__badge > span {
    display: grid;
    place-items: center;

    width: 34px;
    height: 34px;

    color: #fff;
    background: #1677B8;

    border-radius: 9px;
}

.placement-journey__badge small {
    display: block;

    margin-bottom: 2px;

    color: #83939D;

    font-size: 0.52rem;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.placement-journey__badge strong {
    display: block;

    color: #174A7E;

    font-size: 0.68rem;
}


/* =========================================================
   IMAGE CONTENT — REDUCED
========================================================= */

.placement-journey__visual-content {
    position: absolute;
    z-index: 3;

    left: 1.8rem;
    right: 1.8rem;
    bottom: 5.3rem;

    max-width: 440px;
}

.placement-journey__visual-content > span {
    display: block;

    margin-bottom: 0.4rem;

    color: #86DCF7;

    font-size: 0.6rem;
    font-weight: 700;

    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.placement-journey__visual-content h3 {
    margin: 0 0 0.45rem;

    max-width: 420px;

    color: #fff;

    /*
       Previous text was too large.
       Keep it normal.
    */
    font-size: clamp(1.5rem, 2vw, 2rem);
    font-weight: 700;

    line-height: 1.18;
    letter-spacing: -0.02em;
}

.placement-journey__visual-content p {
    max-width: 400px;

    margin: 0;

    color: rgba(255, 255, 255, 0.88);

    font-size: 0.75rem;
    line-height: 1.5;
}


/* =========================================================
   IMAGE FOOTER
========================================================= */

.placement-journey__image-footer {
    position: absolute;
    z-index: 4;

    left: 1.2rem;
    right: 1.2rem;
    bottom: 1.2rem;

    display: flex;
    align-items: center;

    gap: 0.7rem;

    padding: 0.65rem 0.8rem;

    background: rgba(255, 255, 255, 0.94);

    border-radius: 12px;
}

.placement-journey__image-footer > div {
    display: grid;
    place-items: center;

    width: 34px;
    height: 34px;

    flex: 0 0 34px;

    color: #48A984;
    background: #EAF8F1;

    border-radius: 9px;
}

.placement-journey__image-footer > span {
    display: flex;
    align-items: center;

    gap: 0.55rem;

    color: #174A7E;

    font-size: 0.68rem;
    font-weight: 700;
}

.placement-journey__image-footer i {
    color: #4DB7E5;
}


/* =========================================================
   RIGHT PANEL
========================================================= */

.placement-path {
    position: relative;

    display: flex;
    flex-direction: column;

    min-width: 0;

    padding: 1.5rem;

    background: #F8FBFD;

    border: 1px solid #DFEBF1;
    border-radius: 22px;
}


/* Accent */

.placement-path::before {
    content: "";

    position: absolute;

    top: 0;
    left: 2rem;

    width: 80px;
    height: 3px;

    background: #4DB7E5;

    border-radius: 0 0 5px 5px;
}


/* =========================================================
   PANEL HEADING
========================================================= */

.placement-path__header {
    margin-bottom: 0.6rem;
}

.placement-path__header > span {
    display: block;

    margin-bottom: 0.35rem;

    color: #1677B8;

    font-size: 0.58rem;
    font-weight: 700;

    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.placement-path__header h3 {
    max-width: 370px;

    margin: 0;

    color: #174A7E;

    font-size: clamp(1.3rem, 1.8vw, 1.7rem);
    font-weight: 700;

    line-height: 1.2;
}

.placement-path__header h3 strong {
    color: #1677B8;
}


/* =========================================================
   ITEMS
========================================================= */

.placement-path__item {
    display: grid;

    grid-template-columns:
        24px
        42px
        minmax(0, 1fr);

    align-items: center;

    gap: 0.7rem;

    padding: 0.75rem 0;

    border-bottom: 1px solid #DFEBF1;
}

.placement-path__number {
    color: #75B8DE;

    font-size: 0.58rem;
    font-weight: 700;
}

.placement-path__icon {
    display: grid;
    place-items: center;

    width: 42px;
    height: 42px;

    color: #1677B8;
    background: #fff;

    border: 1px solid #DDEBF2;
    border-radius: 11px;
}

.placement-path__icon--green {
    color: #48A984;
}

.placement-path__content > span {
    display: block;

    margin-bottom: 0.1rem;

    color: #8B9AA3;

    font-size: 0.5rem;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.placement-path__content h4 {
    margin: 0 0 0.12rem;

    color: #174A7E;

    font-size: 0.76rem;
    font-weight: 700;
}

.placement-path__content p {
    margin: 0;

    color: #687C89;

    font-size: 0.62rem;
    line-height: 1.4;
}


/* =========================================================
   PANEL FOOTER
========================================================= */

.placement-path__footer {
    display: flex;
    align-items: center;

    gap: 0.65rem;

    margin-top: auto;
    padding-top: 0.8rem;
}

.placement-path__footer-icon {
    display: grid;
    place-items: center;

    width: 36px;
    height: 36px;

    flex: 0 0 36px;

    color: #fff;
    background: #174A7E;

    border-radius: 9px;
}

.placement-path__footer span {
    display: block;

    color: #8B9AA3;

    font-size: 0.48rem;
    font-weight: 700;

    text-transform: uppercase;
}

.placement-path__footer strong {
    display: block;

    margin-top: 0.1rem;

    color: #174A7E;

    font-size: 0.65rem;
}

.placement-path__arrow {
    margin-left: auto;

    color: #1677B8;
}


/* =========================================================
   1200 - 1599
========================================================= */

@media (min-width: 1200px) and (max-width: 1599.98px) {

    .placement-journey {
        padding: 2.7rem 0;
    }

    .placement-journey__heading {
        margin-bottom: 1.5rem;
    }

    .placement-journey__heading h2 {
        font-size: 2.45rem;
    }

    .placement-journey__layout {
        max-width: 1200px;
    }

    .placement-journey__visual {
        min-height: 390px;
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .placement-journey {
        padding: 3rem 0;
    }

    .placement-journey__heading {
        grid-template-columns: 1fr;

        gap: 0.8rem;
    }

    .placement-journey__heading > p {
        max-width: 650px;

        margin-left: 0;
    }

    .placement-journey__layout {
        grid-template-columns: 1fr;

        max-width: 760px;
    }

    .placement-journey__visual {
        aspect-ratio: 16 / 9;
        min-height: 0;
    }

    .placement-path {
        min-height: 390px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .placement-journey {
        padding: 2.7rem 0;
    }

    .placement-journey__heading h2 {
        font-size: 2rem;
    }

    .placement-journey__visual {
        aspect-ratio: 4 / 3;

        border-radius: 18px;
    }

    .placement-path {
        border-radius: 18px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .placement-journey {
        padding: 2.5rem 0;
    }

    .placement-journey__heading h2 {
        font-size: 1.75rem;
    }

    .placement-journey__heading > p {
        font-size: 0.8rem;
    }


    /* Image remains natural instead of becoming very tall */

    .placement-journey__visual {
        aspect-ratio: 1 / 1;
    }

    .placement-journey__visual-content {
        left: 1rem;
        right: 1rem;
        bottom: 4.8rem;
    }

    .placement-journey__visual-content h3 {
        max-width: 290px;

        font-size: 1.35rem;
    }

    .placement-journey__visual-content p {
        font-size: 0.67rem;
    }

    .placement-journey__badge {
        top: 0.8rem;
        left: 0.8rem;
    }

    .placement-journey__image-footer {
        left: 0.8rem;
        right: 0.8rem;
        bottom: 0.8rem;
    }


    /* Right panel */

    .placement-path {
        min-height: 0;

        padding: 1.2rem;
    }

    .placement-path__item {
        grid-template-columns:
            40px
            minmax(0, 1fr);

        gap: 0.7rem;
    }

    .placement-path__number {
        display: none;
    }

    .placement-path__icon {
        width: 40px;
        height: 40px;
    }
}


/* =========================================================
   320PX
========================================================= */

@media (max-width: 374.98px) {

    .placement-journey__heading h2 {
        font-size: 1.6rem;
    }

    .placement-journey__visual-content h3 {
        font-size: 1.2rem;
    }

    .placement-journey__visual-content p {
        display: none;
    }

    .placement-journey__image-footer > span {
        gap: 0.3rem;

        font-size: 0.58rem;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .placement-journey__visual > img {
        transition: none;
    }
}


/* =========================================================
   PLACEMENT SECTION — BALANCED LARGE SIZE
   Add this AFTER previous placement CSS
========================================================= */

/* Main section */
.placement-journey {
    padding: 3.75rem 0 4rem;
}


/* Main container width */
.placement-journey .container {
    max-width: 1400px;
}


/* =========================================================
   TOP HEADING
========================================================= */

.placement-journey__heading {
    grid-template-columns: 1.3fr 0.7fr;
    gap: 3.5rem;

    margin-bottom: 2rem;
}

.placement-journey__heading > div {
    max-width: 760px;
}

.placement-journey__eyebrow {
    margin-bottom: 0.7rem;

    font-size: 0.76rem;
}

.placement-journey__heading h2 {
    max-width: 760px;

    font-size: clamp(2.5rem, 3.5vw, 3.5rem);
    font-weight: 750;

    line-height: 1.1;
}

.placement-journey__heading > p {
    max-width: 470px;

    font-size: 0.95rem;
    line-height: 1.7;
}


/* =========================================================
   MAIN GRID
========================================================= */

.placement-journey__layout {
    grid-template-columns:
        minmax(0, 1.18fr)
        minmax(400px, 0.82fr);

    gap: 1.75rem;

    max-width: 1350px;
}


/* =========================================================
   LEFT IMAGE
========================================================= */

.placement-journey__visual {
    min-height: 460px;

    border-radius: 25px;
}


/* Keep image natural */
.placement-journey__visual > img {
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transform: none;
}


/* Only slight hover zoom */
.placement-journey__visual:hover > img {
    transform: scale(1.025);
}


/* =========================================================
   IMAGE TOP BADGE
========================================================= */

.placement-journey__badge {
    top: 1.4rem;
    left: 1.4rem;

    gap: 0.7rem;

    padding: 0.7rem 0.9rem;

    border-radius: 14px;
}

.placement-journey__badge > span {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;
}

.placement-journey__badge small {
    font-size: 0.56rem;
}

.placement-journey__badge strong {
    font-size: 0.76rem;
}


/* =========================================================
   IMAGE MAIN TEXT
========================================================= */

.placement-journey__visual-content {
    left: 2.2rem;
    right: 2rem;
    bottom: 6rem;

    max-width: 500px;
}

.placement-journey__visual-content > span {
    margin-bottom: 0.55rem;

    font-size: 0.68rem;
}

.placement-journey__visual-content h3 {
    max-width: 500px;

    margin-bottom: 0.6rem;

    font-size: clamp(1.9rem, 2.5vw, 2.6rem);

    line-height: 1.13;
}

.placement-journey__visual-content p {
    max-width: 430px;

    font-size: 0.82rem;
    line-height: 1.55;
}


/* =========================================================
   IMAGE FOOTER
========================================================= */

.placement-journey__image-footer {
    left: 1.4rem;
    right: 1.4rem;
    bottom: 1.4rem;

    gap: 0.85rem;

    padding: 0.8rem 1rem;

    border-radius: 14px;
}

.placement-journey__image-footer > div {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;
}

.placement-journey__image-footer > span {
    gap: 0.7rem;

    font-size: 0.75rem;
}


/* =========================================================
   RIGHT CARD
========================================================= */

.placement-path {
    min-height: 460px;

    padding: 1.8rem;

    border-radius: 25px;
}


/* =========================================================
   RIGHT CARD HEADING
========================================================= */

.placement-path__header {
    margin-bottom: 0.8rem;
}

.placement-path__header > span {
    margin-bottom: 0.45rem;

    font-size: 0.65rem;
}

.placement-path__header h3 {
    max-width: 410px;

    font-size: clamp(1.55rem, 2vw, 2rem);

    line-height: 1.17;
}


/* =========================================================
   RIGHT ITEMS
========================================================= */

.placement-path__item {
    grid-template-columns:
        28px
        48px
        minmax(0, 1fr);

    gap: 0.85rem;

    padding: 0.9rem 0;
}

.placement-path__number {
    font-size: 0.64rem;
}

.placement-path__icon {
    width: 48px;
    height: 48px;

    border-radius: 13px;

    font-size: 1rem;
}

.placement-path__content > span {
    margin-bottom: 0.15rem;

    font-size: 0.55rem;
}

.placement-path__content h4 {
    margin-bottom: 0.2rem;

    font-size: 0.86rem;
}

.placement-path__content p {
    max-width: 390px;

    font-size: 0.69rem;
    line-height: 1.45;
}


/* =========================================================
   RIGHT BOTTOM
========================================================= */

.placement-path__footer {
    gap: 0.75rem;

    padding-top: 1rem;
}

.placement-path__footer-icon {
    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    border-radius: 11px;
}

.placement-path__footer span {
    font-size: 0.52rem;
}

.placement-path__footer strong {
    font-size: 0.72rem;
}


/* =========================================================
   1200px - 1599px
   Laptop / normal desktop
========================================================= */

@media (min-width: 1200px) and (max-width: 1599.98px) {

    .placement-journey {
        padding: 3rem 0 3.5rem;
    }

    .placement-journey .container {
        max-width: 1320px;
    }

    .placement-journey__heading {
        margin-bottom: 1.7rem;
    }

    .placement-journey__heading h2 {
        font-size: clamp(2.5rem, 3.2vw, 3.15rem);
    }

    .placement-journey__layout {
        max-width: 1280px;

        grid-template-columns:
            minmax(0, 1.16fr)
            minmax(400px, 0.84fr);
    }

    .placement-journey__visual,
    .placement-path {
        min-height: 440px;
    }

    .placement-journey__visual-content h3 {
        font-size: 2.2rem;
    }
}


/* =========================================================
   992px - 1199px
========================================================= */

@media (min-width: 992px) and (max-width: 1199.98px) {

    .placement-journey {
        padding: 3.5rem 0;
    }

    .placement-journey__heading h2 {
        font-size: 2.65rem;
    }

    .placement-journey__layout {
        grid-template-columns:
            minmax(0, 1.05fr)
            minmax(390px, 0.95fr);

        gap: 1.3rem;
    }

    .placement-journey__visual,
    .placement-path {
        min-height: 440px;
    }

    .placement-journey__visual-content h3 {
        font-size: 2rem;
    }
}


/* =========================================================
   TABLET <= 991px
========================================================= */

@media (max-width: 991.98px) {

    .placement-journey {
        padding: 3.75rem 0;
    }

    .placement-journey__heading {
        grid-template-columns: 1fr;

        gap: 1rem;

        margin-bottom: 2rem;
    }

    .placement-journey__heading h2 {
        max-width: 700px;

        font-size: clamp(2.3rem, 6vw, 3rem);
    }

    .placement-journey__heading > p {
        max-width: 650px;

        margin-left: 0;

        font-size: 0.92rem;
    }

    .placement-journey__layout {
        grid-template-columns: 1fr;

        max-width: 800px;

        gap: 1.5rem;
    }

    .placement-journey__visual {
        min-height: 0;

        aspect-ratio: 16 / 9;
    }

    .placement-path {
        min-height: 430px;
    }
}


/* =========================================================
   MOBILE <= 767px
========================================================= */

@media (max-width: 767.98px) {

    .placement-journey {
        padding: 3.25rem 0;
    }

    .placement-journey__heading h2 {
        font-size: clamp(2rem, 7vw, 2.6rem);
    }

    .placement-journey__visual {
        aspect-ratio: 4 / 3;
    }

    .placement-journey__visual-content {
        left: 1.5rem;
        right: 1.5rem;
        bottom: 5.5rem;
    }

    .placement-journey__visual-content h3 {
        font-size: clamp(1.7rem, 5vw, 2.1rem);
    }

    .placement-path {
        padding: 1.5rem;

        min-height: 0;
    }
}


/* =========================================================
   MOBILE <= 575px
========================================================= */

@media (max-width: 575.98px) {

    .placement-journey {
        padding: 3rem 0;
    }

    .placement-journey__heading h2 {
        font-size: clamp(1.9rem, 8vw, 2.35rem);
    }

    .placement-journey__heading > p {
        font-size: 0.87rem;
    }

    .placement-journey__visual {
        aspect-ratio: 4 / 4.3;

        border-radius: 20px;
    }

    .placement-journey__badge {
        top: 1rem;
        left: 1rem;
    }

    .placement-journey__visual-content {
        left: 1.25rem;
        right: 1.25rem;
        bottom: 5.3rem;
    }

    .placement-journey__visual-content h3 {
        font-size: 1.65rem;
    }

    .placement-journey__visual-content p {
        font-size: 0.75rem;
    }

    .placement-journey__image-footer {
        left: 1rem;
        right: 1rem;
        bottom: 1rem;
    }

    .placement-path__header h3 {
        font-size: 1.6rem;
    }

    .placement-path__item {
        grid-template-columns:
            46px
            minmax(0, 1fr);

        gap: 0.8rem;

        padding: 0.85rem 0;
    }

    .placement-path__number {
        display: none;
    }

    .placement-path__icon {
        width: 46px;
        height: 46px;
    }

    .placement-path__content h4 {
        font-size: 0.84rem;
    }

    .placement-path__content p {
        font-size: 0.68rem;
    }
}


/* =========================================================
   320px
========================================================= */

@media (max-width: 374.98px) {

    .placement-journey {
        padding: 2.7rem 0;
    }

    .placement-journey__heading h2 {
        font-size: 1.8rem;
    }

    .placement-journey__visual {
        aspect-ratio: 1 / 1.15;
    }

    .placement-journey__visual-content h3 {
        font-size: 1.45rem;
    }

    .placement-journey__image-footer > span {
        gap: 0.4rem;

        font-size: 0.65rem;
    }

    .placement-path {
        padding: 1.2rem;
    }
}



/* =========================================================
   COMPACT PREMIUM FOOTER
========================================================= */

.compact-footer {
    --blue: #1677B8;
    --deep-blue: #174A7E;
    --sky-blue: #4DB7E5;
    --soft-cyan: #EAF8FC;
    --text: #587381;
    --border: #D9EAF2;

    position: relative;

    background:
        linear-gradient(
            180deg,
            #F8FCFE 0%,
            #F2F9FC 100%
        );

    border-top: 1px solid var(--border);

    overflow: hidden;
}


/* Top accent */

.compact-footer::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #174A7E,
            #1677B8,
            #4DB7E5
        );
}


/* =========================================================
   MAIN
========================================================= */

.compact-footer__main {
    padding: 3rem 0 2.7rem;
}

.compact-footer__main .container {
    max-width: 1400px;
}


/* =========================================================
   LOGO / ABOUT
========================================================= */

.compact-footer__about {
    display: flex;
    flex-direction: column;
    align-items: center;

    max-width: 430px;

    text-align: center;
}


.compact-footer__brand {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;

    margin-bottom: 1.1rem;

    text-decoration: none;
}


.compact-footer__brand img {
    display: block;

    width: 250px;
    height: auto;

    max-width: 100%;

    object-fit: contain;

    transition:
        transform 0.3s ease,
        filter 0.3s ease;
}


.compact-footer__brand:hover img {
    transform: translateY(-3px);

    filter:
        drop-shadow(
            0 8px 12px
            rgba(23, 74, 126, 0.12)
        );
}


.compact-footer__about p {
    max-width: 400px;

    margin: 0 auto;

    color: var(--text);

    font-size: 0.95rem;
    line-height: 1.7;

    text-align: center;
}


/* =========================================================
   TITLES
========================================================= */

.compact-footer h2 {
    position: relative;

    margin: 0 0 1.3rem;

    padding-bottom: 0.7rem;

    color: var(--deep-blue);

    font-size: 1.25rem;
    font-weight: 800;

    line-height: 1.2;
}


.compact-footer h2::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 38px;
    height: 3px;

    background: var(--sky-blue);

    border-radius: 10px;
}


/* =========================================================
   LINKS
========================================================= */

.compact-footer__column ul {
    margin: 0;
    padding: 0;

    list-style: none;
}


.compact-footer__column li + li {
    margin-top: 0.7rem;
}


.compact-footer__column a {
    display: inline-flex;
    align-items: center;

    color: var(--text);

    font-size: 0.95rem;
    font-weight: 500;

    text-decoration: none;

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}


.compact-footer__column a::before {
    content: "";

    width: 6px;
    height: 6px;

    flex: 0 0 6px;

    margin-right: 0.65rem;

    background: #9DD8EE;

    border-radius: 50%;
}


.compact-footer__column a:hover {
    color: var(--blue);

    transform: translateX(4px);
}


/* =========================================================
   CONTACT
========================================================= */

.compact-footer__contact {
    max-width: 100%;
}


.compact-footer__contact-item {
    display: flex;
    align-items: flex-start;

    gap: 0.9rem;
}


.compact-footer__contact-item +
.compact-footer__contact-item {
    margin-top: 0.85rem;
}


.compact-footer__icon {
    display: grid;
    place-items: center;

    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    color: var(--blue);
    background: #FFFFFF;

    border: 1px solid #D5E9F2;
    border-radius: 11px;

    font-size: 1rem;

    box-shadow:
        0 5px 15px
        rgba(23, 74, 126, 0.08);

    transition:
        color 0.25s ease,
        background 0.25s ease,
        transform 0.25s ease;
}


.compact-footer__contact-item:hover
.compact-footer__icon {

    color: #FFFFFF;
    background: var(--blue);

    transform: translateY(-2px);
}


.compact-footer__contact-item p {
    margin: 0;
    padding-top: 0.5rem;

    color: var(--text);

    font-size: 0.92rem;
    font-weight: 500;

    line-height: 1.5;
}


.compact-footer__contact-item a {
    color: var(--text);

    text-decoration: none;

    transition: color 0.25s ease;
}


.compact-footer__contact-item a:hover {
    color: var(--blue);
}


/* =========================================================
   COPYRIGHT BAR
========================================================= */

.compact-footer__bottom {
    width: 100%;

    background: #FFFFFF;

    border-top: 1px solid var(--border);
}


.compact-footer__bottom-content {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 1.5rem;

    min-height: 66px;
}


.compact-footer__bottom-content p {
    margin: 0;

    color: #637B88;

    font-size: 0.82rem;
    font-weight: 500;
}


.compact-footer__bottom-links {
    display: flex;
    align-items: center;

    gap: 0.85rem;
}


.compact-footer__bottom-links a {
    color: #637B88;

    font-size: 0.82rem;
    font-weight: 600;

    text-decoration: none;

    transition: color 0.25s ease;
}


.compact-footer__bottom-links a:hover {
    color: var(--blue);
}


.compact-footer__bottom-links span {
    width: 1px;
    height: 15px;

    background: #CDDEE6;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .compact-footer__main {
        padding: 2.8rem 0 2.4rem;
    }


    .compact-footer__about {
        max-width: 100%;
    }


    .compact-footer__brand img {
        width: 235px;
    }


    .compact-footer__about p {
        max-width: 430px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .compact-footer__main {
        padding: 2.5rem 0 2rem;
    }


    .compact-footer__brand img {
        width: 220px;
    }


    .compact-footer__about p {
        font-size: 0.9rem;
    }


    .compact-footer h2 {
        font-size: 1.1rem;
    }


    .compact-footer__column a {
        font-size: 0.9rem;
    }


    .compact-footer__bottom-content {
        flex-direction: column;
        justify-content: center;

        gap: 0.55rem;

        min-height: auto;

        padding: 1rem 0;

        text-align: center;
    }

}


/* =========================================================
   MOBILE 575
========================================================= */

@media (max-width: 575.98px) {

    .compact-footer__brand img {
        width: 200px;
    }


    .compact-footer__about p {
        max-width: 350px;

        font-size: 0.87rem;
    }


    .compact-footer__contact-item p {
        font-size: 0.86rem;
    }


    .compact-footer__bottom-content p,
    .compact-footer__bottom-links a {
        font-size: 0.76rem;
    }

}


/* =========================================================
   320
========================================================= */

@media (max-width: 374.98px) {

    .compact-footer__brand img {
        width: 180px;
    }

}





/* =========================================================
   FINAL PAGE RESPONSIVE SPACING SYSTEM
   Keep existing HTML/content unchanged
========================================================= */


/* =========================================================
   1. GLOBAL RESET
========================================================= */

html {
    width: 100%;
    max-width: 100%;

    margin: 0;
    padding: 0;

    overflow-x: hidden;
    scroll-behavior: smooth;
}


body,
body.home-page {
    width: 100%;
    max-width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    overflow-x: hidden;

    background: #ffffff;
}


*,
*::before,
*::after {
    box-sizing: border-box;
}


img,
picture,
video,
iframe,
svg {
    max-width: 100%;
}


img {
    height: auto;
}


figure {
    margin: 0;
}


ul,
ol {
    margin-top: 0;
}


p:last-child,
ul:last-child,
ol:last-child {
    margin-bottom: 0;
}


/* =========================================================
   2. MAIN PAGE
========================================================= */

.home-main {
    width: 100%;
    max-width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;
}


/* =========================================================
   3. GLOBAL CONTAINER
========================================================= */

.home-page .container {
    width: 100%;

    margin-left: auto;
    margin-right: auto;

    padding-left: 20px;
    padding-right: 20px;
}


@media (min-width: 1400px) {

    .home-page .container {
        max-width: 1320px;
    }

}


@media (min-width: 1200px) and (max-width: 1399.98px) {

    .home-page .container {
        max-width: 1140px;
    }

}


@media (min-width: 992px) and (max-width: 1199.98px) {

    .home-page .container {
        max-width: 960px;
    }

}


@media (min-width: 768px) and (max-width: 991.98px) {

    .home-page .container {
        max-width: 720px;
    }

}


@media (min-width: 576px) and (max-width: 767.98px) {

    .home-page .container {
        max-width: 540px;
    }

}


/* =========================================================
   5. HERO
========================================================= */

body.home-page .campus-hero {
    width: 100%;

    margin: 0 !important;

    padding: 0 !important;
}


body.home-page .campus-hero__slides,
body.home-page .campus-hero__slide {
    margin: 0 !important;
    padding: 0 !important;
}


body.home-page .campus-hero__interface {
    margin: 0 !important;

    padding-top: 2.25rem !important;
    padding-bottom: 3.5rem !important;
}


body.home-page .campus-hero__content {
    margin: 0;
}


body.home-page .campus-hero__eyebrow {
    margin-bottom: 0.65rem !important;
}


body.home-page .campus-hero h1 {
    margin-top: 0 !important;
    margin-bottom: 0.75rem !important;
}


body.home-page .campus-hero__lead {
    margin-top: 0 !important;
    margin-bottom: 0.85rem !important;
}


body.home-page .campus-hero__credentials {
    margin-top: 0 !important;
    margin-bottom: 1rem !important;
}


body.home-page .campus-hero__actions {
    margin: 0 !important;
}


/* =========================================================
   6. STANDARD SECTION SPACING

   Makes sections use consistent vertical spacing instead of
   different 4rem / 5rem / 6rem gaps.
========================================================= */

.home-section,
.jp-welcome,
.about-premium,
.management-council-section,
.course-showcase,
.department-section,
.infrastructure-section,
.gallery-section,
.news-section,
.notice-section,
.events-section,
.testimonial-section,
.placement-journey {
    margin: 0 !important;

    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
}


/* =========================================================
   7. SECTION HEADINGS
========================================================= */

.home-section-heading,
.jp-welcome__intro,
.about-heading,
.management-council-section__heading,
.placement-journey__heading {
    margin-top: 0 !important;
    margin-bottom: 1.75rem !important;
}


.home-section-heading h2,
.jp-welcome__intro h2,
.about-heading h2,
.placement-journey__heading h2 {
    margin-top: 0 !important;
    margin-bottom: 0.65rem !important;
}


.home-section-heading p,
.jp-welcome__intro p,
.about-heading p,
.placement-journey__heading p {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


/* =========================================================
   8. BOOTSTRAP ROW SPACING

   Prevent rows from creating unnecessarily large gaps.
========================================================= */

.home-main .row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 1.5rem;
}


/* =========================================================
   9. CARDS
========================================================= */

.welcome-card,
.course-feature-card,
.department-tile,
.stat-card,
.news-card,
.notice-panel,
.event-item,
.testimonial-card,
.placement-card,
.management-card,
.jp-welcome__card {
    margin-top: 0;
    margin-bottom: 0;
}


/* =========================================================
   10. CARD TEXT
========================================================= */

.home-main h1,
.home-main h2,
.home-main h3,
.home-main h4,
.home-main h5,
.home-main h6 {
    margin-top: 0;
}


.home-main h3 {
    margin-bottom: 0.6rem;
}


.home-main p {
    margin-top: 0;
}


.home-main .card p:last-child,
.home-main article p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   11. WELCOME SECTION
========================================================= */

.jp-welcome {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
}


.jp-welcome__intro {
    margin-bottom: 1.5rem !important;
}


.jp-welcome__card {
    margin: 0 !important;
}


.jp-welcome__footer {
    margin-top: 1.25rem !important;
}


/* =========================================================
   12. ABOUT SECTION
========================================================= */

.about-premium {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
}


.about-heading {
    margin-bottom: 1.75rem !important;
}


.about-content {
    margin-top: 0 !important;
}


.about-features {
    margin-top: 1.25rem !important;
}


.about-affiliations {
    margin-top: 1.25rem !important;
}


/* =========================================================
   13. MANAGEMENT COUNCIL
========================================================= */

.management-council-section {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
}


.management-card {
    height: 100%;

    margin: 0 !important;
}


/* =========================================================
   14. STATS BAND
========================================================= */

.stats-band {
    margin: 0 !important;

    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
}


.stat-card {
    height: 100%;
}


/* =========================================================
   15. INFRASTRUCTURE
========================================================= */

.infrastructure-grid {
    gap: 1rem !important;
}


.infra-card {
    margin: 0 !important;
}


/* =========================================================
   16. GALLERY
========================================================= */

.gallery-tile {
    margin: 0 !important;
}


/* =========================================================
   17. NEWS / NOTICES / EVENTS
========================================================= */

.news-card,
.notice-panel,
.event-item {
    margin: 0 !important;
}


.event-timeline {
    gap: 0.85rem !important;
}


/* =========================================================
   18. TESTIMONIAL
========================================================= */

.testimonial-card {
    margin: 0 !important;
}


/* =========================================================
   19. PLACEMENT
========================================================= */

.placement-journey {
    padding-top: 6rem !important;
    padding-bottom: 3.5rem !important;
}


.placement-journey__heading {
    margin-bottom: 1.75rem !important;
}


.placement-journey__layout {
    margin-top: 0 !important;
}


/* =========================================================
   20. ADMISSION CTA
========================================================= */

.admission-cta {
    margin: 0 !important;

    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
}


.admission-cta__inner {
    gap: 1.5rem !important;

    margin: 0 !important;

    padding: 1.75rem !important;
}


.admission-cta__inner h2 {
    margin-top: 0 !important;
    margin-bottom: 0.55rem !important;
}


.admission-cta__inner p {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


.admission-cta__actions {
    gap: 0.75rem !important;
}


/* =========================================================
   21. FOOTER
========================================================= */

.compact-footer {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;
}


.compact-footer__main {
    margin: 0 !important;

    padding-top: 2.75rem !important;
    padding-bottom: 2.25rem !important;
}


.compact-footer__main .row {
    --bs-gutter-x: 2rem;
    --bs-gutter-y: 1.75rem;
}


.compact-footer__about {
    margin: 0;
}


.compact-footer__brand {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 100%;

    margin: 0 0 0.85rem !important;

    padding: 0 !important;
}


.compact-footer__brand img {
    display: block;

    width: 245px !important;
    height: auto !important;

    max-width: 100%;

    margin: 0 auto !important;

    object-fit: contain;
}


.compact-footer__about p {
    max-width: 390px;

    margin:
        0
        auto !important;

    text-align: center;

    line-height: 1.65;
}


.compact-footer__column {
    margin: 0;
}


.compact-footer__column h2 {
    margin-top: 0 !important;
    margin-bottom: 0.85rem !important;
}


.compact-footer__column ul {
    margin: 0 !important;
    padding-left: 1.1rem;
}


.compact-footer__column li {
    margin-bottom: 0.35rem;
}


.compact-footer__column li:last-child {
    margin-bottom: 0;
}


.compact-footer__contact-item {
    margin-bottom: 0.85rem;
}


.compact-footer__contact-item:last-child {
    margin-bottom: 0;
}


.compact-footer__contact-item p {
    margin: 0;
}


.compact-footer__bottom {
    margin: 0 !important;
}


.compact-footer__bottom-content {
    min-height: 60px;

    margin: 0 !important;

    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
}


.compact-footer__bottom-content p {
    margin: 0 !important;
}


/* =========================================================
   22. TABLET
   768px - 1199px
========================================================= */

@media (max-width: 1199.98px) {

    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .course-showcase,
    .department-section,
    .infrastructure-section,
    .gallery-section,
    .news-section,
    .notice-section,
    .events-section,
    .testimonial-section,
    .placement-journey {

        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }


    .admission-cta {
        padding-top: 2.75rem !important;
        padding-bottom: 2.75rem !important;
    }

}


/* =========================================================
   23. TABLET
   <= 991px
========================================================= */

@media (max-width: 991.98px) {

    .home-page .container {
        padding-left: 18px;
        padding-right: 18px;
    }


    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .course-showcase,
    .department-section,
    .infrastructure-section,
    .gallery-section,
    .news-section,
    .notice-section,
    .events-section,
    .testimonial-section,
    .placement-journey {

        padding-top: 2.75rem !important;
        padding-bottom: 2.75rem !important;
    }


    .home-section-heading,
    .jp-welcome__intro,
    .about-heading,
    .management-council-section__heading,
    .placement-journey__heading {

        margin-bottom: 1.5rem !important;
    }


    .admission-cta__inner {
        padding: 1.5rem !important;
    }


    .compact-footer__main {
        padding-top: 2.5rem !important;
        padding-bottom: 2rem !important;
    }

}


/* =========================================================
   24. MOBILE
   <= 767px
========================================================= */

@media (max-width: 767.98px) {

    .home-page .container {
        max-width: 100%;

        padding-left: 16px !important;
        padding-right: 16px !important;
    }



    /* ---------------- HERO ---------------- */

    body.home-page .campus-hero__interface {
        padding-top: 1.75rem !important;
        padding-bottom: 4rem !important;
    }


    body.home-page .campus-hero__eyebrow {
        margin-bottom: 0.55rem !important;
    }


    body.home-page .campus-hero h1 {
        margin-bottom: 0.65rem !important;
    }


    body.home-page .campus-hero__lead {
        margin-bottom: 0.75rem !important;
    }


    body.home-page .campus-hero__credentials {
        margin-bottom: 0.85rem !important;
    }


    /* ---------------- SECTIONS ---------------- */

    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .course-showcase,
    .department-section,
    .infrastructure-section,
    .gallery-section,
    .news-section,
    .notice-section,
    .events-section,
    .testimonial-section,
    .placement-journey {

        padding-top: 2.5rem !important;
        padding-bottom: 2.5rem !important;
    }


    .home-section-heading,
    .jp-welcome__intro,
    .about-heading,
    .management-council-section__heading,
    .placement-journey__heading {

        margin-bottom: 1.35rem !important;
    }


    /* ---------------- ROW ---------------- */

    .home-main .row {
        --bs-gutter-x: 1rem;
        --bs-gutter-y: 1rem;
    }


    /* ---------------- ADMISSION ---------------- */

    .admission-cta {
        padding-top: 2.25rem !important;
        padding-bottom: 2.25rem !important;
    }


    .admission-cta__inner {
        gap: 1.25rem !important;

        padding: 1.35rem !important;
    }


    .admission-cta__actions {
        gap: 0.6rem !important;
    }


    /* ---------------- FOOTER ---------------- */

    .compact-footer__main {
        padding-top: 2.25rem !important;
        padding-bottom: 1.75rem !important;
    }


    .compact-footer__main .row {
        --bs-gutter-x: 1.25rem;
        --bs-gutter-y: 1.5rem;
    }


    .compact-footer__brand {
        margin-bottom: 0.65rem !important;
    }


    .compact-footer__brand img {
        width: 220px !important;
    }


    .compact-footer__column h2 {
        margin-bottom: 0.7rem !important;
    }


    .compact-footer__bottom-content {
        min-height: auto;

        padding-top: 0.85rem !important;
        padding-bottom: 0.85rem !important;
    }

}


/* =========================================================
   25. MOBILE
   <= 575px
========================================================= */

@media (max-width: 575.98px) {

    .home-page .container {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }


    /* ---------------- HERO ---------------- */

    body.home-page .campus-hero__interface {
        padding-top: 1.5rem !important;
        padding-bottom: 3.75rem !important;
    }


    /* ---------------- SECTIONS ---------------- */

    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .course-showcase,
    .department-section,
    .infrastructure-section,
    .gallery-section,
    .news-section,
    .notice-section,
    .events-section,
    .testimonial-section,
    .placement-journey {

        padding-top: 2.15rem !important;
        padding-bottom: 2.15rem !important;
    }


    .home-section-heading,
    .jp-welcome__intro,
    .about-heading,
    .management-council-section__heading,
    .placement-journey__heading {

        margin-bottom: 1.15rem !important;
    }


    /* ---------------- CARDS ---------------- */

    .welcome-card,
    .news-card,
    .notice-panel,
    .event-item,
    .testimonial-card {

        padding: 1.15rem !important;
    }


    /* ---------------- ADMISSION ---------------- */

    .admission-cta {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }


    .admission-cta__inner {
        padding: 1.15rem !important;
    }


    .admission-cta__actions {
        display: grid !important;

        grid-template-columns: 1fr;

        width: 100%;
    }


    .admission-cta__actions .ds-btn {
        width: 100%;
    }


    /* ---------------- FOOTER ---------------- */

    .compact-footer__main {
        padding-top: 2rem !important;
        padding-bottom: 1.5rem !important;
    }


    .compact-footer__brand img {
        width: 200px !important;
    }


    .compact-footer__about p {
        max-width: 340px;

        line-height: 1.55;
    }

}


/* =========================================================
   26. SMALL MOBILE
   <= 374px
========================================================= */

@media (max-width: 374.98px) {

    .home-page .container {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    body.home-page .campus-hero__interface {
        padding-top: 1.25rem !important;
        padding-bottom: 3.5rem !important;
    }


    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .course-showcase,
    .department-section,
    .infrastructure-section,
    .gallery-section,
    .news-section,
    .notice-section,
    .events-section,
    .testimonial-section,
    .placement-journey {

        padding-top: 1.85rem !important;
        padding-bottom: 1.85rem !important;
    }


    .home-section-heading,
    .jp-welcome__intro,
    .about-heading,
    .management-council-section__heading,
    .placement-journey__heading {

        margin-bottom: 1rem !important;
    }


    .compact-footer__brand img {
        width: 180px !important;
    }

}


/* =========================================================
   27. REMOVE ACCIDENTAL EMPTY SPACE
========================================================= */

.home-main > section:first-child {
    margin-top: 0 !important;
}


.home-main > section:last-child {
    margin-bottom: 0 !important;
}


.home-main section > .container > *:first-child {
    margin-top: 0;
}


.home-main section > .container > *:last-child {
    margin-bottom: 0;
}


/* =========================================================
   28. RESPONSIVE TEXT SAFETY
========================================================= */

.home-main h1,
.home-main h2,
.home-main h3,
.home-main h4,
.home-main p,
.home-main span,
.compact-footer h2,
.compact-footer p,
.compact-footer a {

    overflow-wrap: break-word;
}


.home-main a,
.compact-footer a {

    word-break: normal;
}


/* =========================================================
   29. IMAGE SAFETY
========================================================= */

.home-main img,
.compact-footer img{

    max-width: 100%;
}


/* =========================================================
   30. PREVENT HORIZONTAL OVERFLOW
========================================================= */

.home-main section,
.home-main .container,
.home-main .row,
.home-main [class*="col-"],
.compact-footer,
.compact-footer .container,
.compact-footer .row {

    min-width: 0;
}


/* =========================================================
   31. LANDSCAPE MOBILE
========================================================= */

@media (orientation: landscape) and (max-height: 600px) {

    body.home-page .campus-hero__interface {

        padding-top: 1.25rem !important;
        padding-bottom: 3rem !important;
    }


    .home-section,
    .jp-welcome,
    .about-premium,
    .management-council-section,
    .placement-journey {

        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

}







/* ==========================================================
   ACADEMIC HUB
   Premium Centered Department Layout
========================================================== */

.academic-hub {
    position: relative;
    overflow: hidden;

    padding: 70px 0 90px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f5fbfe 55%,
            #ffffff 100%
        );
}


/* ==========================================================
   DECORATIVE BACKGROUND
========================================================== */

.academic-hub::before {
    content: "";

    position: absolute;
    top: -180px;
    left: 50%;

    width: 700px;
    height: 350px;

    border: 1px solid rgba(77, 183, 229, 0.13);
    border-radius: 50%;

    transform: translateX(-50%);

    pointer-events: none;
}


.academic-hub::after {
    content: "";

    position: absolute;
    top: 0;
    left: 50%;

    width: 1px;
    height: 100%;

    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(77, 183, 229, 0.13),
            transparent
        );

    pointer-events: none;
}


/* Container */

.academic-hub .container {
    position: relative;
    z-index: 2;

    width: 100%;
}


/* ==========================================================
   SECTION HEADING
========================================================== */

.academic-hub__heading {
    width: 100%;
    max-width: 820px;

    margin: 0 auto 50px;

    text-align: center;
}


.academic-hub__eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 8px;

    margin-bottom: 15px;

    color: #1677b8;

    font-size: 12px;
    font-weight: 800;

    letter-spacing: 1.5px;
    text-transform: uppercase;
}


.academic-hub__eyebrow::before,
.academic-hub__eyebrow::after {
    content: "";

    width: 28px;
    height: 1px;

    background: #4db7e5;
}


.academic-hub__eyebrow i {
    font-size: 14px;
}


.academic-hub__heading h2 {
    margin: 0 0 17px;

    color: #174a7e;

    font-size: clamp(2rem, 3.6vw, 3rem);
    font-weight: 800;

    line-height: 1.12;
    letter-spacing: -1px;
}


.academic-hub__heading h2 span {
    color: #1677b8;
}


.academic-hub__heading p {
    max-width: 680px;

    margin: 0 auto;

    color: #667d8d;

    font-size: 16px;
    line-height: 1.75;
}


/* ==========================================================
   MAIN LAYOUT
   LEFT  = ACADEMIC CORE
   RIGHT = 3 DEPARTMENT CARDS
========================================================== */

.academic-hub__layout {
    width: min(100%, 1120px);

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap: 26px;

    align-items: stretch;
}


/* ==========================================================
   LEFT COLUMN
========================================================== */

.academic-hub__column--left {
    display: none;
}


/* ==========================================================
   RIGHT COLUMN
========================================================== */

.academic-hub__column--right {
    display: grid;

    grid-template-columns: 1fr;
    grid-template-rows: repeat(3, 1fr);

    gap: 20px;

    min-width: 0;
}


/* ==========================================================
   DEPARTMENT CARD
========================================================== */

.academic-unit {
    position: relative;

    display: flex;
    flex-direction: column;

    width: 100%;
    min-width: 0;
    min-height: 0;

    padding: 24px 24px 20px;

    overflow: hidden;

    color: inherit;
    text-decoration: none;

    background: #ffffff;

    border: 1px solid #dcecf4;
    border-radius: 20px;

    box-shadow:
        0 8px 26px rgba(23, 74, 126, 0.055);

    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease;
}


/* Right Accent Line */

.academic-hub__column--right .academic-unit::before {
    content: "";

    position: absolute;

    top: 22px;
    right: 0;
    bottom: 22px;

    width: 3px;

    background: #4db7e5;

    border-radius: 4px 0 0 4px;

    transform: scaleY(0.35);
    transform-origin: center;

    transition:
        transform 0.35s ease,
        background 0.35s ease;
}


/* ==========================================================
   CARD HOVER
========================================================== */

.academic-unit:hover {
    color: inherit;

    border-color: rgba(22, 119, 184, 0.28);

    box-shadow:
        0 18px 40px rgba(23, 74, 126, 0.12);

    transform: translateY(-5px);
}


.academic-unit:hover::before {
    background: #1677b8;

    transform: scaleY(1);
}


/* ==========================================================
   CARD NUMBER
========================================================== */

.academic-unit__number {
    position: absolute;

    top: 14px;
    right: 20px;

    color: rgba(23, 74, 126, 0.07);

    font-size: 44px;
    font-weight: 900;

    line-height: 1;

    pointer-events: none;
}


/* ==========================================================
   CARD BODY
========================================================== */

.academic-unit__body {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: flex-start;

    gap: 18px;

    height: 100%;
}


/* ==========================================================
   DEPARTMENT ICON
========================================================== */

.academic-unit__icon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 54px;

    width: 54px;
    height: 54px;

    color: #1677b8;

    background: #eaf8fc;

    border: 1px solid #d7edf7;
    border-radius: 15px;

    font-size: 21px;

    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}


.academic-unit:hover .academic-unit__icon {
    color: #ffffff;

    background: #1677b8;

    transform: translateY(-3px);
}


/* ==========================================================
   CARD CONTENT
========================================================== */

.academic-unit__content {
    min-width: 0;

    padding-right: 15px;
}


.academic-unit__content > span {
    display: block;

    margin-bottom: 5px;

    color: #4db7e5;

    font-size: 10px;
    font-weight: 800;

    letter-spacing: 1px;

    text-transform: uppercase;
}


.academic-unit h3 {
    margin: 0 0 8px;

    color: #174a7e;

    font-size: 19px;
    font-weight: 750;

    line-height: 1.3;
}


.academic-unit p {
    margin: 0;

    color: #6b7f8e;

    font-size: 13px;
    line-height: 1.65;
}


/* ==========================================================
   EXPLORE LINK
========================================================== */

.academic-unit__link {
    display: flex;
    align-items: center;
    justify-content: flex-end;

    gap: 8px;

    margin-top: auto;
    padding-top: 13px;

    color: #1677b8;

    font-size: 11px;
    font-weight: 700;

    border-top: 1px solid #edf3f6;
}


.academic-unit__link i {
    transition: transform 0.3s ease;
}


.academic-unit:hover .academic-unit__link i {
    transform: translateX(5px);
}


/* ==========================================================
   ACADEMIC CORE
========================================================== */

.academic-core {
    position: relative;

    display: flex;
    flex-direction: column;

    width: 100%;
    min-height: 620px;

    height: 100%;

    padding: 32px;

    overflow: hidden;

    color: #ffffff;

    background:
        linear-gradient(
            155deg,
            #174a7e 0%,
            #17699f 55%,
            #1677b8 100%
        );

    border-radius: 28px;

    box-shadow:
        0 22px 50px rgba(23, 74, 126, 0.20);
}


/* ==========================================================
   CORE DECORATIVE RINGS
========================================================== */

.academic-core__ring {
    position: absolute;

    border: 1px solid rgba(255, 255, 255, 0.11);

    border-radius: 50%;

    pointer-events: none;
}


.academic-core__ring--one {
    width: 280px;
    height: 280px;

    top: -110px;
    right: -105px;
}


.academic-core__ring--two {
    width: 210px;
    height: 210px;

    right: -90px;
    bottom: -85px;
}


/* ==========================================================
   CORE TOP
========================================================== */

.academic-core__top {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding-bottom: 25px;

    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}


.academic-core__top > span {
    font-size: 10px;
    font-weight: 800;

    letter-spacing: 1.5px;

    text-transform: uppercase;

    opacity: 0.78;
}


/* ==========================================================
   CORE SYMBOL
========================================================== */

.academic-core__symbol {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 50px;
    height: 50px;

    color: #174a7e;

    background: #ffffff;

    border-radius: 50%;

    font-size: 19px;

    box-shadow:
        0 8px 22px rgba(0, 0, 0, 0.10);
}


/* ==========================================================
   CORE CONTENT
========================================================== */

.academic-core__content {
    position: relative;
    z-index: 2;

    display: flex;
    flex: 1;

    flex-direction: column;
    justify-content: center;

    padding: 38px 0;
}


.academic-core__small {
    margin-bottom: 14px;

    color: #aee6f7;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 1.5px;

    text-transform: uppercase;
}


.academic-core h3 {
    margin: 0 0 23px;

    color: #ffffff;

    font-size: clamp(2.3rem, 4vw, 3.4rem);
    font-weight: 700;

    line-height: 1.03;

    letter-spacing: -1.5px;
}


.academic-core h3 strong {
    color: #9ee8d0;

    font-weight: 800;
}


.academic-core p {
    max-width: 420px;

    margin: 0;

    color: rgba(255, 255, 255, 0.78);

    font-size: 14px;
    line-height: 1.75;
}


/* ==========================================================
   CORE FOOTER
========================================================== */

.academic-core__footer {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    padding-top: 23px;

    border-top: 1px solid rgba(255, 255, 255, 0.15);
}


.academic-core__footer > div {
    display: flex;
    flex-direction: column;
}


.academic-core__footer strong {
    color: #ffffff;

    font-size: 30px;
    font-weight: 800;

    line-height: 1;
}


.academic-core__footer span {
    margin-top: 4px;

    color: rgba(255, 255, 255, 0.65);

    font-size: 10px;
    font-weight: 700;

    letter-spacing: 1px;

    text-transform: uppercase;
}


.academic-core__footer a {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 48px;
    height: 48px;

    color: #174a7e;

    background: #ffffff;

    border-radius: 50%;

    text-decoration: none;

    transition:
        transform 0.3s ease,
        background 0.3s ease;
}


.academic-core__footer a:hover {
    color: #174a7e;

    background: #eaf8fc;

    transform: translateX(4px);
}


/* ==========================================================
   LARGE LAPTOP
========================================================== */

@media (max-width: 1199.98px) {

    .academic-hub__layout {
        width: min(100%, 1000px);

        gap: 20px;
    }


    .academic-core {
        padding: 28px;

        min-height: 590px;
    }


    .academic-unit {
        padding: 21px;
    }


    .academic-unit__body {
        gap: 15px;
    }


    .academic-unit__icon {
        flex-basis: 48px;

        width: 48px;
        height: 48px;

        font-size: 19px;
    }


    .academic-unit h3 {
        font-size: 17px;
    }


    .academic-unit p {
        font-size: 12.5px;
    }

}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 991.98px) {

    .academic-hub {
        padding: 60px 0 70px;
    }


    .academic-hub__heading {
        margin-bottom: 38px;
    }


    .academic-hub__layout {
        width: min(100%, 720px);

        grid-template-columns: 1fr;

        gap: 22px;
    }


    /* Core first */

    .academic-core {
        min-height: 500px;

        padding: 30px;
    }


    .academic-core__content {
        padding: 32px 0;
    }


    .academic-core h3 {
        font-size: clamp(2.3rem, 6vw, 3.2rem);
    }


    .academic-core p {
        max-width: 600px;
    }


    /* Department cards */

    .academic-hub__column--right {
        grid-template-rows: none;

        gap: 16px;
    }


    .academic-unit {
        min-height: 180px;
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767.98px) {

    .academic-hub {
        padding: 50px 0 60px;
    }


    .academic-hub::after {
        display: none;
    }


    .academic-hub__heading {
        margin-bottom: 32px;
    }


    .academic-hub__heading h2 {
        font-size: 30px;

        letter-spacing: -0.5px;
    }


    .academic-hub__heading p {
        font-size: 14px;

        line-height: 1.65;
    }


    .academic-hub__eyebrow::before,
    .academic-hub__eyebrow::after {
        width: 20px;
    }


    .academic-hub__layout {
        width: 100%;

        padding: 0 12px;

        grid-template-columns: 1fr;

        gap: 16px;
    }


    .academic-core {
        min-height: 440px;

        padding: 26px;

        border-radius: 23px;
    }


    .academic-core__content {
        padding: 28px 0;
    }


    .academic-core h3 {
        font-size: 36px;
    }


    .academic-core h3 br {
        display: none;
    }


    .academic-core p {
        font-size: 13px;
    }


    .academic-hub__column--right {
        gap: 15px;
    }


    .academic-unit {
        min-height: 0;

        padding: 20px;

        border-radius: 18px;
    }


    .academic-unit__body {
        gap: 14px;
    }


    .academic-unit__icon {
        flex: 0 0 48px;

        width: 48px;
        height: 48px;
    }


    .academic-unit h3 {
        font-size: 17px;
    }


    .academic-unit p {
        font-size: 13px;
    }

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 425px) {

    .academic-hub {
        padding: 45px 0 55px;
    }


    .academic-hub__heading h2 {
        font-size: 27px;
    }


    .academic-hub__heading p {
        font-size: 13px;
    }


    .academic-hub__eyebrow {
        font-size: 10px;

        letter-spacing: 1.2px;
    }


    .academic-hub__eyebrow::before,
    .academic-hub__eyebrow::after {
        width: 14px;
    }


    .academic-core {
        min-height: 410px;

        padding: 22px;

        border-radius: 20px;
    }


    .academic-core__symbol {
        width: 44px;
        height: 44px;

        font-size: 17px;
    }


    .academic-core__content {
        padding: 24px 0;
    }


    .academic-core h3 {
        font-size: 31px;
    }


    .academic-core p {
        font-size: 12.5px;
    }


    .academic-core__footer strong {
        font-size: 26px;
    }


    .academic-core__footer a {
        width: 44px;
        height: 44px;
    }


    .academic-unit {
        padding: 18px;

        border-radius: 16px;
    }


    .academic-unit__body {
        gap: 12px;
    }


    .academic-unit__icon {
        flex: 0 0 44px;

        width: 44px;
        height: 44px;

        font-size: 18px;
    }


    .academic-unit__content > span {
        font-size: 9px;
    }


    .academic-unit h3 {
        font-size: 16px;
    }


    .academic-unit p {
        font-size: 12px;

        line-height: 1.55;
    }


    .academic-unit__number {
        font-size: 34px;
    }

}


/* ==========================================================
   EXTRA SMALL - 320PX
========================================================== */

@media (max-width: 374.98px) {

    .academic-hub__layout {
        padding: 0 8px;
    }


    .academic-hub__heading h2 {
        font-size: 25px;
    }


    .academic-core {
        min-height: 390px;

        padding: 20px;
    }


    .academic-core h3 {
        font-size: 28px;
    }


    .academic-unit {
        padding: 17px;
    }


    .academic-unit__icon {
        flex: 0 0 42px;

        width: 42px;
        height: 42px;
    }


    .academic-unit__body {
        gap: 10px;
    }

}


/* ==========================================================
   REDUCED MOTION
========================================================== */

@media (prefers-reduced-motion: reduce) {

    .academic-unit,
    .academic-unit::before,
    .academic-unit__icon,
    .academic-unit__link i,
    .academic-core__footer a {
        transition: none !important;
    }


    .academic-unit:hover,
    .academic-unit:hover .academic-unit__icon,
    .academic-core__footer a:hover {
        transform: none;
    }

}







/* =========================================================
   HOMEPAGE HERO CAROUSEL
========================================================= */

body.home-page .campus-hero {
    position: relative;
    height: calc(100svh - 17.75rem);
    min-height: 31rem;
    max-height: 50rem;
    overflow: hidden;
    isolation: isolate;
    background: #174a7e;
}

body.home-page .campus-hero__pause-toggle {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

body.home-page .campus-hero__slides,
body.home-page .campus-hero__slide,
body.home-page .campus-hero__slide::after,
body.home-page .campus-hero__media {
    position: absolute;
    inset: 0;
}

body.home-page .campus-hero__slide {
    margin: 0;
    opacity: 0;
    overflow: hidden;
    animation: campusHeroSlide 21s linear infinite both;
    will-change: opacity, transform;
}

body.home-page .campus-hero__slide:nth-child(1),
body.home-page .campus-hero__slide:nth-child(1) .campus-hero__media,
body.home-page .campus-hero__indicator:nth-child(1)::after {
    animation-delay: 0s;
}

body.home-page .campus-hero__slide:nth-child(2),
body.home-page .campus-hero__slide:nth-child(2) .campus-hero__media,
body.home-page .campus-hero__indicator:nth-child(2)::after {
    animation-delay: -14s;
}

body.home-page .campus-hero__slide:nth-child(3),
body.home-page .campus-hero__slide:nth-child(3) .campus-hero__media,
body.home-page .campus-hero__indicator:nth-child(3)::after {
    animation-delay: -7s;
}

body.home-page .campus-hero__slide::after {
    content: "";
    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(4, 22, 41, 0.9) 0%,
            rgba(7, 38, 68, 0.74) 42%,
            rgba(11, 53, 89, 0.26) 72%,
            rgba(7, 30, 52, 0.16) 100%
        ),
        linear-gradient(
            0deg,
            rgba(4, 19, 35, 0.68) 0%,
            rgba(4, 19, 35, 0.08) 48%,
            rgba(4, 19, 35, 0.2) 100%
        );

    box-shadow:
        inset 0 -10rem 10rem -8rem rgba(0, 0, 0, 0.74);

    pointer-events: none;
}

body.home-page .campus-hero__media {
    width: 100%;
    height: 100%;
    max-width: none;

    object-fit: cover;
    object-position: center;

    animation: campusHeroKenBurns 21s ease-in-out infinite both;

    will-change: transform;
}


/* =========================================================
   HERO CONTENT
========================================================= */

body.home-page .campus-hero__interface {
    position: relative;
    z-index: 3;

    height: 100%;

    display: flex;
    align-items: flex-end;

    padding-block: 3rem 4.5rem;
}

body.home-page .campus-hero__content {
    width: min(100%, 59rem);

    color: #ffffff;

    animation:
        campusHeroContentIn 900ms ease 120ms both;

    text-shadow:
        0 2px 18px rgba(0, 0, 0, 0.72);
}

body.home-page .campus-hero__eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 0.55rem;

    margin-bottom: 0.9rem;
    padding: 0.48rem 0.72rem;

    color: #ffffff;

    background:
        rgba(15, 96, 147, 0.58);

    border:
        1px solid rgba(255, 255, 255, 0.42);

    border-radius: 0.35rem;

    box-shadow:
        0 0.5rem 1.5rem rgba(0, 0, 0, 0.18);

    backdrop-filter: blur(8px);

    font-size: 0.75rem;
    font-weight: 700;

    line-height: 1.2;

    text-transform: uppercase;
}

body.home-page .campus-hero h1 {
    max-width: 58rem;

    margin: 0 0 1rem;

    color: #ffffff;

    font-size: 3.65rem;
    line-height: 1.08;

    letter-spacing: 0;

    text-wrap: balance;
}

body.home-page .campus-hero__lead {
    max-width: 46rem;

    margin: 0 0 1.15rem;

    color: rgba(255, 255, 255, 0.94);

    font-size: 1.05rem;
    line-height: 1.65;
}


/* =========================================================
   CREDENTIALS
========================================================= */

body.home-page .campus-hero__credentials {
    display: flex;
    flex-wrap: wrap;

    gap: 0.55rem 1.1rem;

    margin-bottom: 1.3rem;
}

body.home-page .campus-hero__credentials span {
    display: inline-flex;
    align-items: center;

    gap: 0.42rem;

    color: #ffffff;

    font-size: 0.8rem;
    font-weight: 700;

    line-height: 1.35;
}

body.home-page .campus-hero__credentials i {
    color: #9fe6bc;

    font-size: 0.9rem;
}


/* =========================================================
   BUTTONS
========================================================= */

body.home-page .campus-hero__actions {
    display: flex;
    flex-wrap: wrap;

    gap: 0.7rem;
}

body.home-page .campus-hero__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 0.55rem;

    min-height: 2.9rem;

    padding: 0.72rem 1.05rem;

    border: 1px solid transparent;
    border-radius: 0.4rem;

    box-shadow:
        0 0.75rem 1.8rem rgba(0, 0, 0, 0.22);

    font-size: 0.84rem;
    font-weight: 700;

    line-height: 1.2;

    text-shadow: none;

    transition:
        transform 180ms ease,
        background-color 180ms ease,
        border-color 180ms ease,
        box-shadow 180ms ease;
}

body.home-page .campus-hero__button--primary {
    color: #174a7e;

    background: #ffffff;

    border-color: #ffffff;
}

body.home-page .campus-hero__button--primary:hover {
    color: #174a7e;

    background: #eaf8fc;

    border-color: #eaf8fc;

    box-shadow:
        0 1rem 2.2rem rgba(0, 0, 0, 0.28);

    transform: translateY(-2px);
}

body.home-page .campus-hero__button--secondary {
    color: #ffffff;

    background:
        rgba(12, 63, 105, 0.55);

    border-color:
        rgba(255, 255, 255, 0.64);

    backdrop-filter: blur(8px);
}

body.home-page .campus-hero__button--secondary:hover {
    color: #ffffff;

    background:
        rgba(22, 119, 184, 0.78);

    border-color: #ffffff;

    box-shadow:
        0 1rem 2.2rem rgba(0, 0, 0, 0.28);

    transform: translateY(-2px);
}


/* =========================================================
   CAROUSEL CONTROLS
========================================================= */

body.home-page .campus-hero__controls {
    position: absolute;

    right:
        max(
            1rem,
            calc((100vw - 1320px) / 2 + 0.75rem)
        );

    bottom: 4.5rem;

    z-index: 4;

    display: flex;
    align-items: center;

    gap: 0.8rem;
}

body.home-page .campus-hero__progress {
    display: flex;
    align-items: center;

    gap: 0.45rem;

    padding: 0.55rem 0.65rem;

    background:
        rgba(5, 31, 54, 0.46);

    border:
        1px solid rgba(255, 255, 255, 0.28);

    border-radius: 0.35rem;

    box-shadow:
        0 0.6rem 1.5rem rgba(0, 0, 0, 0.18);

    backdrop-filter: blur(8px);
}

body.home-page .campus-hero__indicator {
    position: relative;

    width: 2.25rem;
    height: 0.2rem;

    overflow: hidden;

    background:
        rgba(255, 255, 255, 0.4);

    border-radius: 0.2rem;
}

body.home-page .campus-hero__indicator::after {
    content: "";

    position: absolute;

    inset: 0;

    background: #ffffff;

    border-radius: inherit;

    transform: scaleX(0);

    transform-origin: left center;

    animation:
        campusHeroProgress 21s linear infinite both;
}


/* =========================================================
   PLAY / PAUSE
========================================================= */

body.home-page .campus-hero__pause {
    width: 2.75rem;
    height: 2.75rem;

    display: grid;

    place-items: center;

    margin: 0;

    color: #ffffff;

    background:
        rgba(5, 31, 54, 0.55);

    border:
        1px solid rgba(255, 255, 255, 0.38);

    border-radius: 50%;

    box-shadow:
        0 0.6rem 1.5rem rgba(0, 0, 0, 0.2);

    backdrop-filter: blur(8px);

    cursor: pointer;

    transition:
        background-color 180ms ease,
        border-color 180ms ease,
        transform 180ms ease;
}

body.home-page .campus-hero__pause:hover {
    background:
        rgba(22, 119, 184, 0.82);

    border-color: #ffffff;

    transform: translateY(-1px);
}

body.home-page .campus-hero__pause .fa-play {
    display: none;

    margin-left: 0.12rem;
}

body.home-page
.campus-hero__pause-toggle:focus-visible
~ .campus-hero__controls
.campus-hero__pause {

    outline: 0;

    box-shadow:
        0 0 0 0.25rem rgba(142, 217, 251, 0.7);
}

body.home-page
.campus-hero__pause-toggle:checked
~ .campus-hero__slides
.campus-hero__slide,

body.home-page
.campus-hero__pause-toggle:checked
~ .campus-hero__slides
.campus-hero__media,

body.home-page
.campus-hero__pause-toggle:checked
~ .campus-hero__controls
.campus-hero__indicator::after {

    animation-play-state: paused;
}

body.home-page
.campus-hero__pause-toggle:checked
~ .campus-hero__controls
.fa-pause {

    display: none;
}

body.home-page
.campus-hero__pause-toggle:checked
~ .campus-hero__controls
.fa-play {

    display: inline-block;
}


/* =========================================================
   ANIMATIONS
========================================================= */

@keyframes campusHeroSlide {

    0%,
    27% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }

    32%,
    94% {
        opacity: 0;
        transform: translate3d(-2%, 0, 0);
    }

    95% {
        opacity: 0;
        transform: translate3d(2%, 0, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes campusHeroKenBurns {

    0%,
    100% {
        transform: scale(1.08);
    }

    32%,
    94% {
        transform: scale(1.01);
    }
}

@keyframes campusHeroProgress {

    0% {
        opacity: 1;
        transform: scaleX(0);
    }

    27% {
        opacity: 1;
        transform: scaleX(1);
    }

    32%,
    94% {
        opacity: 0;
        transform: scaleX(1);
    }

    95%,
    100% {
        opacity: 0;
        transform: scaleX(0);
    }
}

@keyframes campusHeroContentIn {

    from {
        opacity: 0;

        transform:
            translateY(1.25rem);
    }

    to {
        opacity: 1;

        transform:
            translateY(0);
    }
}


/* =========================================================
   RESPONSIVE - 1200
========================================================= */

@media (max-width: 1199.98px) {

    body.home-page .campus-hero {
        height:
            calc(100svh - 13.25rem);

        min-height: 31rem;
        max-height: 46rem;
    }

    body.home-page .campus-hero h1 {
        font-size: 3rem;
    }

    body.home-page .campus-hero__controls {
        right:
            max(
                1rem,
                calc((100vw - 960px) / 2 + 0.75rem)
            );

        bottom: 1rem;
    }
}


/* =========================================================
   RESPONSIVE - TABLET
========================================================= */

@media (max-width: 991.98px) {

    body.home-page .campus-hero {
        height:
            calc(100svh - 12.5rem);

        max-height: 43rem;
    }

    body.home-page .campus-hero__interface {
        padding-block:
            2.5rem 4rem;
    }

    body.home-page .campus-hero h1 {
        max-width: 46rem;

        font-size: 2.65rem;
    }

    body.home-page .campus-hero__lead {
        max-width: 40rem;

        font-size: 0.98rem;
    }

    body.home-page .campus-hero__controls {
        right:
            max(
                1rem,
                calc((100vw - 720px) / 2 + 0.75rem)
            );

        bottom: 1rem;
    }
}


/* =========================================================
   RESPONSIVE - MOBILE
========================================================= */

@media (max-width: 767.98px) {

    body.home-page .campus-hero {
        height:
            calc(100svh - 11.75rem);

        min-height: 31rem;
        max-height: 42rem;
    }

    body.home-page .campus-hero__slide::after {

        background:
            linear-gradient(
                90deg,
                rgba(4, 22, 41, 0.84),
                rgba(7, 38, 68, 0.42)
            ),
            linear-gradient(
                0deg,
                rgba(4, 19, 35, 0.88) 0%,
                rgba(4, 19, 35, 0.34) 58%,
                rgba(4, 19, 35, 0.42) 100%
            );

        box-shadow:
            inset 0 -12rem 10rem -7rem
            rgba(0, 0, 0, 0.76);
    }

    body.home-page .campus-hero__interface {
        align-items: center;

        padding-block:
            2.5rem 5rem;
    }

    body.home-page .campus-hero h1 {
        font-size: 2.25rem;
    }

    body.home-page .campus-hero__lead {
        margin-bottom: 1rem;

        font-size: 0.9rem;

        line-height: 1.55;
    }

    body.home-page .campus-hero__credentials {
        gap: 0.45rem 0.8rem;

        margin-bottom: 1.1rem;
    }

    body.home-page .campus-hero__credentials span {
        font-size: 0.72rem;
    }

    body.home-page .campus-hero__button {
        min-height: 2.75rem;

        padding:
            0.68rem 0.85rem;

        font-size: 0.78rem;
    }

    body.home-page .campus-hero__controls {
        right: 0.75rem;
        bottom: 1rem;
    }

    body.home-page .campus-hero__progress {
        padding:
            0.5rem 0.55rem;
    }

    body.home-page .campus-hero__indicator {
        width: 1.75rem;
    }

    body.home-page .campus-hero__pause {
        width: 2.5rem;
        height: 2.5rem;
    }
}


/* =========================================================
   RESPONSIVE - SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    body.home-page .campus-hero h1 {
        font-size: 2rem;

        line-height: 1.1;
    }

    body.home-page .campus-hero__eyebrow {
        margin-bottom: 0.75rem;

        font-size: 0.67rem;
    }

    body.home-page .campus-hero__credentials {
        display: grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    body.home-page .campus-hero__actions {
        display: grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 0.55rem;
    }

    body.home-page .campus-hero__button {
        width: 100%;

        padding-inline: 0.6rem;
    }
}


/* =========================================================
   RESPONSIVE - EXTRA SMALL
========================================================= */

@media (max-width: 374.98px) {

    body.home-page .campus-hero {
        min-height: 30rem;
    }

    body.home-page .campus-hero__interface {
        padding-top: 2rem;
    }

    body.home-page .campus-hero h1 {
        font-size: 1.72rem;
    }

    body.home-page .campus-hero__lead {
        font-size: 0.82rem;
    }

    body.home-page .campus-hero__credentials span {
        font-size: 0.65rem;
    }

    body.home-page .campus-hero__button {
        font-size: 0.7rem;
    }
}


/* =========================================================
   LANDSCAPE MOBILE
========================================================= */

@media
(orientation: landscape)
and (max-height: 600px) {

    body.home-page .campus-hero {
        height: 31rem;

        min-height: 31rem;
    }

    body.home-page .campus-hero__interface {
        padding-block:
            2rem 3.5rem;
    }

    body.home-page .campus-hero h1 {
        font-size: 2.15rem;
    }

    body.home-page .campus-hero__lead {
        margin-bottom: 0.8rem;

        font-size: 0.86rem;
    }

    body.home-page .campus-hero__credentials {
        margin-bottom: 0.85rem;
    }
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    body.home-page .campus-hero__slide,
    body.home-page .campus-hero__media,
    body.home-page .campus-hero__content,
    body.home-page .campus-hero__indicator::after {

        animation: none !important;

        transform: none !important;
    }

    body.home-page .campus-hero__slide {
        opacity: 0;
    }

    body.home-page
    .campus-hero__slide:first-child {

        opacity: 1;
    }

    body.home-page
    .campus-hero__indicator:first-child::after {

        opacity: 1;

        transform:
            scaleX(1) !important;
    }

    body.home-page .campus-hero__pause {
        display: none;
    }
}

/* =========================================================
   TEMPORARY FIX - ALWAYS SHOW PAGE CONTENT
========================================================= */

.reveal,
.reveal.from-left,
.reveal.from-right {
    opacity: 1 !important;
    transform: none !important;
}


/* =========================================================
   HOMEPAGE HERO SAFETY FIX
========================================================= */

body.home-page .campus-hero {
    position: relative;
    display: block;
    width: 100%;
    min-height: 520px;
    overflow: hidden;
    background: #174a7e;
}

body.home-page .campus-hero__slides {
    position: absolute;
    inset: 0;
    z-index: 0;
}

body.home-page .campus-hero__slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

body.home-page .campus-hero__media {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.home-page .campus-hero__interface {
    position: relative;
    z-index: 3;
}

body.home-page .campus-hero__content {
    position: relative;
    z-index: 4;
}


/* Make normal homepage sections visible */
body.home-page .jp-welcome,
body.home-page .placement-journey,
body.home-page .admission-cta {
    position: relative;
    visibility: visible;
}


/* Temporary reveal fix */
body.home-page .reveal,
body.home-page .reveal.from-left,
body.home-page .reveal.from-right {
    opacity: 1 !important;
    transform: none !important;
}


/* Tablet */
@media (max-width: 991.98px) {

    body.home-page .campus-hero {
        min-height: 560px;
    }
}


/* Mobile */
@media (max-width: 767.98px) {

    body.home-page .campus-hero {
        min-height: 620px;
    }
}


/* Small Mobile */
@media (max-width: 575.98px) {

    body.home-page .campus-hero {
        min-height: 650px;
    }
}








/* =========================================================
   HOMEPAGE HERO / CAROUSEL FINAL FIX
========================================================= */

body.home-page .campus-hero {
    position: relative;

    width: 100%;
    height: 680px;
    min-height: 680px;

    overflow: hidden;
    isolation: isolate;

    background: #082c49;
}


/* Slides container */

body.home-page .campus-hero__slides {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    z-index: 0;

    overflow: hidden;
}


/* Individual slide */

body.home-page .campus-hero__slide {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    margin: 0;
}


/* Image */

body.home-page .campus-hero__media {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    transform: scale(1.01);
}


/* Dark gradient for readable text */

body.home-page .campus-hero::after {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 1;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(4, 29, 50, 0.90) 0%,
            rgba(4, 34, 58, 0.76) 34%,
            rgba(4, 34, 58, 0.35) 65%,
            rgba(4, 34, 58, 0.08) 100%
        );
}


/* Content layer */

body.home-page .campus-hero__interface {
    position: relative;

    z-index: 3;

    width: 100%;
    height: 100%;
}

body.home-page .campus-hero__interface .container {
    max-width: 1400px;
    height: 100%;

    display: flex;
    align-items: center;

    padding-left: 24px;
    padding-right: 24px;
}


/* Main content */

body.home-page .campus-hero__content {
    position: relative;

    width: 100%;
    max-width: 790px;

    padding: 25px 0;
}


/* Eyebrow */

body.home-page .campus-hero__eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 9px;

    margin-bottom: 18px;

    padding: 9px 15px;

    color: #ffffff;
    background: rgba(22, 119, 184, 0.50);

    border: 1px solid rgba(135, 211, 242, 0.65);
    border-radius: 8px;

    font-size: 14px;
    font-weight: 800;

    text-transform: uppercase;
}


/* Heading */

body.home-page .campus-hero h1 {
    max-width: 790px;

    margin: 0 0 18px;

    color: #ffffff;

    font-size: clamp(3rem, 4.2vw, 4.3rem);
    font-weight: 800;

    line-height: 1.04;
    letter-spacing: -1.5px;
}


/* Description */

body.home-page .campus-hero__lead {
    max-width: 760px;

    margin: 0 0 16px;

    color: rgba(255, 255, 255, 0.93);

    font-size: 17px;
    font-weight: 400;

    line-height: 1.7;
}


/* Trust / approval points */

body.home-page .campus-hero__trust {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 10px 18px;

    margin: 0 0 20px;
}

body.home-page .campus-hero__trust span {
    display: inline-flex;
    align-items: center;

    gap: 7px;

    color: #ffffff;

    font-size: 14px;
    font-weight: 700;
}

body.home-page .campus-hero__trust i {
    color: #82e3b4;
}


/* Buttons */

body.home-page .campus-hero__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 12px;
}


/* Carousel controls */

body.home-page .campus-hero__controls {
    position: absolute;

    right: 7%;
    bottom: 28px;

    z-index: 5;

    display: flex;
    align-items: center;

    gap: 12px;
}


/* =========================================================
   LARGE DESKTOP
========================================================= */

@media (min-width: 1600px) {

    body.home-page .campus-hero {
        height: 720px;
        min-height: 720px;
    }

    body.home-page .campus-hero__interface .container {
        max-width: 1440px;
    }
}


/* =========================================================
   LAPTOP
========================================================= */

@media (max-width: 1399.98px) {

    body.home-page .campus-hero {
        height: 620px;
        min-height: 620px;
    }

    body.home-page .campus-hero h1 {
        font-size: 3.6rem;
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    body.home-page .campus-hero {
        height: auto;
        min-height: 650px;
    }

    body.home-page .campus-hero__interface .container {
        align-items: center;
    }

    body.home-page .campus-hero__content {
        max-width: 680px;

        padding: 80px 0;
    }

    body.home-page .campus-hero h1 {
        max-width: 680px;

        font-size: clamp(2.7rem, 7vw, 3.7rem);
    }

    body.home-page .campus-hero__lead {
        max-width: 650px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    body.home-page .campus-hero {
        min-height: 650px;
    }

    body.home-page .campus-hero::after {
        background:
            linear-gradient(
                90deg,
                rgba(4, 29, 50, 0.92) 0%,
                rgba(4, 29, 50, 0.82) 65%,
                rgba(4, 29, 50, 0.55) 100%
            );
    }

    body.home-page .campus-hero__interface .container {
        padding-left: 20px;
        padding-right: 20px;
    }

    body.home-page .campus-hero__content {
        padding: 65px 0 90px;
    }

    body.home-page .campus-hero__eyebrow {
        margin-bottom: 15px;

        padding: 8px 12px;

        font-size: 12px;
    }

    body.home-page .campus-hero h1 {
        margin-bottom: 15px;

        font-size: clamp(2.25rem, 10vw, 3.2rem);

        line-height: 1.07;
        letter-spacing: -1px;
    }

    body.home-page .campus-hero__lead {
        font-size: 15px;
        line-height: 1.65;
    }

    body.home-page .campus-hero__trust {
        align-items: flex-start;
        flex-direction: column;

        gap: 8px;
    }

    body.home-page .campus-hero__trust span {
        font-size: 13px;
    }

    body.home-page .campus-hero__actions {
        width: 100%;
    }

    body.home-page .campus-hero__actions a {
        flex: 1 1 180px;

        text-align: center;
    }

    body.home-page .campus-hero__controls {
        right: 20px;
        bottom: 20px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    body.home-page .campus-hero {
        min-height: 620px;
    }

    body.home-page .campus-hero__content {
        padding-top: 50px;
    }

    body.home-page .campus-hero h1 {
        font-size: 2.35rem;
    }

    body.home-page .campus-hero__actions {
        flex-direction: column;
        align-items: stretch;
    }

    body.home-page .campus-hero__actions a {
        width: 100%;
        flex: none;
    }
}


/* =========================================================
   EXTRA SMALL
========================================================= */

@media (max-width: 374.98px) {

    body.home-page .campus-hero {
        min-height: 640px;
    }

    body.home-page .campus-hero h1 {
        font-size: 2rem;
    }

    body.home-page .campus-hero__lead {
        font-size: 14px;
    }
}




/* =========================================================
   NEWS & UPDATES
========================================================= */

.college-news {
    position: relative;
    z-index: 20;

    padding: 18px 0;

    background:
        linear-gradient(
            135deg,
            #f4fbff 0%,
            #ffffff 48%,
            #f1fbf7 100%
        );

    border-top: 1px solid #dcecf5;
    border-bottom: 1px solid #dcecf5;

    overflow: hidden;
}


.college-news__wrapper {
    display: flex;
    align-items: stretch;

    min-height: 76px;

    background: #ffffff;

    border: 1px solid #d9e9f2;
    border-radius: 16px;

    box-shadow:
        0 10px 35px rgba(0, 54, 91, 0.08);

    overflow: hidden;
}


/* =============================
   TITLE
============================= */

.college-news__title {
    position: relative;

    min-width: 230px;

    display: flex;
    align-items: center;
    gap: 12px;

    padding: 14px 22px;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #003b67,
            #006a91
        );

    overflow: hidden;
}


.college-news__title::after {
    content: "";

    position: absolute;
    right: -35px;
    top: -45px;

    width: 100px;
    height: 100px;

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.08);
}


.college-news__title small {
    display: block;

    margin-bottom: 2px;

    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;

    opacity: 0.75;
}


.college-news__title strong {
    display: block;

    font-size: 16px;
    font-weight: 800;

    white-space: nowrap;
}


.college-news__title > i {
    margin-left: auto;

    font-size: 21px;

    opacity: 0.9;
}


/* =============================
   LIVE PULSE
============================= */

.college-news__pulse {
    position: relative;

    width: 10px;
    height: 10px;

    flex: 0 0 10px;

    background: #45e7a2;

    border-radius: 50%;

    box-shadow:
        0 0 0 rgba(69, 231, 162, 0.5);

    animation: newsPulse 1.8s infinite;
}


@keyframes newsPulse {

    0% {
        box-shadow:
            0 0 0 0 rgba(69, 231, 162, 0.55);
    }

    70% {
        box-shadow:
            0 0 0 10px rgba(69, 231, 162, 0);
    }

    100% {
        box-shadow:
            0 0 0 0 rgba(69, 231, 162, 0);
    }

}


/* =============================
   SCROLLING VIEWPORT
============================= */

.college-news__viewport {
    position: relative;

    flex: 1;

    display: flex;
    align-items: center;

    overflow: hidden;

    min-width: 0;
}


/* left/right fade */

.college-news__viewport::before,
.college-news__viewport::after {
    content: "";

    position: absolute;
    top: 0;

    width: 45px;
    height: 100%;

    z-index: 5;

    pointer-events: none;
}


.college-news__viewport::before {
    left: 0;

    background:
        linear-gradient(
            90deg,
            #ffffff,
            transparent
        );
}


.college-news__viewport::after {
    right: 0;

    background:
        linear-gradient(
            270deg,
            #ffffff,
            transparent
        );
}


/* =============================
   MOVING TRACK
============================= */

.college-news__track {
    display: flex;
    align-items: center;

    width: max-content;

    animation:
        collegeNewsScroll 38s linear infinite;

    will-change: transform;
}


.college-news__viewport:hover
.college-news__track {
    animation-play-state: paused;
}


@keyframes collegeNewsScroll {

    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }

}


/* =============================
   NEWS ITEM
============================= */

.college-news__item {
    position: relative;

    display: inline-flex;
    align-items: center;
    gap: 10px;

    min-height: 74px;

    padding: 0 28px;

    color: #244b68;

    font-size: 13px;
    font-weight: 600;

    text-decoration: none;

    white-space: nowrap;

    border-right: 1px solid #e4eef4;

    transition:
        color 0.25s ease,
        background 0.25s ease;
}


.college-news__item:hover {
    color: #007da8;

    background: #f5fbfe;
}


.college-news__item > i:not(.college-news__arrow) {
    color: #079bc5;

    font-size: 16px;
}


.college-news__arrow {
    color: #12a878;

    font-size: 11px;

    opacity: 0;

    transform: translateX(-5px);

    transition: 0.25s ease;
}


.college-news__item:hover
.college-news__arrow {
    opacity: 1;

    transform: translateX(0);
}


/* =============================
   BADGE
============================= */

.college-news__badge {
    padding: 5px 8px;

    color: #007c66;

    background: #e8faf4;

    border: 1px solid #c8f0e4;
    border-radius: 6px;

    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.7px;
}


/* =============================
   VIEW ALL
============================= */

.college-news__all {
    min-width: 125px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    padding: 0 18px;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #079b86,
            #08b78d
        );

    font-size: 12px;
    font-weight: 800;

    text-decoration: none;

    transition: 0.3s ease;
}


.college-news__all:hover {
    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #006b87,
            #009d8a
        );
}


.college-news__all i {
    transition:
        transform 0.25s ease;
}


.college-news__all:hover i {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .college-news {
        padding: 12px 0;
    }

    .college-news__title {
        min-width: 185px;

        padding:
            12px 16px;
    }

    .college-news__title strong {
        font-size: 14px;
    }

    .college-news__title > i {
        display: none;
    }

    .college-news__all {
        min-width: 100px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .college-news {
        padding: 10px 0;
    }

    .college-news__wrapper {
        display: block;

        border-radius: 12px;
    }


    .college-news__title {
        width: 100%;
        min-width: 100%;

        min-height: 55px;

        padding:
            10px 16px;
    }


    .college-news__title > i {
        display: block;
    }


    .college-news__viewport {
        height: 62px;
    }


    .college-news__item {
        min-height: 62px;

        padding:
            0 20px;

        font-size: 12px;
    }


    .college-news__all {
        min-height: 45px;

        width: 100%;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .college-news__track {
        animation: none;
    }

    .college-news__pulse {
        animation: none;
    }

}



/* =========================================================
   HOME PAGE FONT - FINAL OVERRIDE
   ========================================================= */

body.home-page .home-main,
body.home-page .home-main p,
body.home-page .home-main span,
body.home-page .home-main small,
body.home-page .home-main strong,
body.home-page .home-main h1,
body.home-page .home-main h2,
body.home-page .home-main h3,
body.home-page .home-main h4,
body.home-page .home-main h5,
body.home-page .home-main h6,
body.home-page .home-main a,
body.home-page .home-main button,
body.home-page .home-main input,
body.home-page .home-main textarea,
body.home-page .home-main select,
body.home-page .home-main label,
body.home-page .home-main li {
    font-family: "Plus Jakarta Sans", sans-serif !important;
}


/* =========================================================
   FONT WEIGHTS
   ========================================================= */

body.home-page .home-main h1,
body.home-page .home-main h2 {
    font-weight: 800;
}

body.home-page .home-main h3,
body.home-page .home-main h4 {
    font-weight: 700;
}

body.home-page .home-main strong {
    font-weight: 700;
}

body.home-page .home-main p {
    font-weight: 400;
}


/* =========================================================
   FONT AWESOME - DO NOT OVERRIDE ICON FONT
   ========================================================= */

body.home-page .home-main i.fa-solid,
body.home-page .home-main i.fas,
body.home-page .home-main i.fa-regular,
body.home-page .home-main i.far {
    font-family: "Font Awesome 6 Free" !important;
}

body.home-page .home-main i.fa-brands,
body.home-page .home-main i.fab {
    font-family: "Font Awesome 6 Brands" !important;
}








/* =========================================================
   GLOBAL PAGE SCROLL ANIMATIONS
   No HTML/content changes required
========================================================= */

.reveal {
    opacity: 0;
    transform: translateY(32px);
    transition:
        opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

.reveal.from-left {
    transform: translateX(-45px);
}

.reveal.from-right {
    transform: translateX(45px);
}

.reveal.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}


/* =========================================================
   STAGGERED CARD REVEAL
========================================================= */

.row .reveal:nth-child(1),
.jp-welcome__points .reveal:nth-child(1) {
    transition-delay: 0.05s;
}

.row .reveal:nth-child(2),
.jp-welcome__points .reveal:nth-child(2) {
    transition-delay: 0.12s;
}

.row .reveal:nth-child(3),
.jp-welcome__points .reveal:nth-child(3) {
    transition-delay: 0.19s;
}

.row .reveal:nth-child(4),
.jp-welcome__points .reveal:nth-child(4) {
    transition-delay: 0.26s;
}


/* =========================================================
   WELCOME SECTION
========================================================= */

.jp-welcome__card {
    transition:
        opacity 0.8s ease,
        transform 0.8s ease,
        box-shadow 0.4s ease;
}

.jp-welcome__card:hover {
    transform: translateY(-5px);
}

.jp-welcome__point {
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}

.jp-welcome__point:hover {
    transform: translateX(6px);
}


/* =========================================================
   ABOUT IMAGE ANIMATION
========================================================= */

.about-visual__main img,
.about-visual__secondary img {
    transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.about-visual:hover .about-visual__main img {
    transform: scale(1.025);
}

.about-visual__secondary:hover img {
    transform: scale(1.05);
}


/* Floating badge */

.about-visual__badge {
    animation: jpBadgeFloat 4s ease-in-out infinite;
}

@keyframes jpBadgeFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }
}


/* =========================================================
   STAT CARDS
========================================================= */

.jp-stat-card {
    transition:
        opacity 0.8s ease,
        transform 0.8s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.35s ease;
}

.jp-stat-card:hover {
    transform: translateY(-8px);
}


/* Icon subtle animation */

.jp-stat-card:hover .jp-stat-card__icon {
    animation: jpIconBounce 0.6s ease;
}

@keyframes jpIconBounce {

    0%,
    100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-6px);
    }

    70% {
        transform: translateY(2px);
    }
}


/* =========================================================
   TESTIMONIALS
========================================================= */

.voice-featured,
.voice-mini {
    transition:
        opacity 0.8s ease,
        transform 0.8s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.35s ease;
}

.voice-featured:hover {
    transform: translateY(-5px);
}

.voice-mini:hover {
    transform: translateX(5px);
}


/* Quote animation */

.voice-featured__quote i {
    animation: jpQuoteFloat 3.5s ease-in-out infinite;
}

@keyframes jpQuoteFloat {

    0%,
    100% {
        transform: translateY(0) rotate(0);
    }

    50% {
        transform: translateY(-5px) rotate(-4deg);
    }
}


/* =========================================================
   PLACEMENT
========================================================= */

.placement-path__item {
    transition:
        transform 0.35s ease,
        box-shadow 0.35s
}




main .reveal {
    opacity: 0;
    transform: translateY(30px);
    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}

main .reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

main .reveal.from-left {
    transform: translateX(-40px);
}

main .reveal.from-right {
    transform: translateX(40px);
}

main .reveal.from-left.is-visible,
main .reveal.from-right.is-visible {
    opacity: 1;
    transform: translateX(0);
}
















/*=================================================
UNIVERSITY OFFICERS
==================================================*/

.leaders-section{

    padding:90px 0;

    background:#f7fbff;

    position:relative;

    overflow:hidden;

}

.leaders-section::before{

    content:"";

    width:500px;

    height:500px;

    background:#0d6efd10;

    border-radius:50%;

    position:absolute;

    left:-180px;

    top:-180px;

}

.leaders-section::after{

    content:"";

    width:450px;

    height:450px;

    background:#20c99712;

    border-radius:50%;

    position:absolute;

    right:-150px;

    bottom:-150px;

}

.leaders-badge{

    display:inline-block;

    padding:8px 20px;

    border-radius:40px;

    background:#e8f5ff;

    color:#0d6efd;

    font-weight:600;

    margin-bottom:20px;

}

.leaders-title{

    font-size:42px;

    font-weight:800;

    color:#12375c;

    margin-bottom:15px;

}

.leaders-subtitle{

    color:#6c757d;

    max-width:650px;

    margin:auto;

}

.leader-card{

    background:#fff;

    border-radius:20px;

    overflow:hidden;

    box-shadow:0 15px 40px rgba(0,0,0,.08);

    transition:.4s;

    text-align:center;

    height:100%;

    position:relative;

}

.leader-card:hover{

    transform:translateY(-12px);

    box-shadow:0 30px 60px rgba(0,0,0,.15);

}

.leader-image{

    overflow:hidden;

}

.leader-image img{

    width:100%;

    height:310px;

    object-fit:cover;

    transition:.5s;

}

.leader-card:hover img{

    transform:scale(1.08);

}

.leader-content{

    padding:25px;

}

.leader-content h4{

    font-size:22px;

    font-weight:700;

    color:#12375c;

    margin-bottom:10px;

}

.designation{

    display:inline-block;

    padding:6px 18px;

    background:#0d6efd;

    color:#fff;

    border-radius:30px;

    font-size:14px;

    margin-bottom:15px;

}

.leader-content p{

    color:#6c757d;

    margin-bottom:0;

}






























/* =========================================================
   UNIVERSITY LEADERSHIP MARQUEE
   LEFT → RIGHT
========================================================= */

.leadership-marquee {
    position: relative;

    width: 100%;

    overflow: hidden;

    padding: 10px 0 30px;

    /* Premium edge fade */
    -webkit-mask-image:
        linear-gradient(
            to right,
            transparent 0%,
            #000 6%,
            #000 94%,
            transparent 100%
        );

    mask-image:
        linear-gradient(
            to right,
            transparent 0%,
            #000 6%,
            #000 94%,
            transparent 100%
        );
}


/* =========================================================
   MARQUEE TRACK
========================================================= */

.leadership-marquee__track {
    display: flex;

    width: max-content;

    /*
       LEFT → RIGHT
    */
    animation:
        leadershipSlideRight 40s linear infinite;

    /*
       IMPORTANT:
       Animation will NEVER stop on hover.
    */
    animation-play-state: running !important;

    will-change: transform;

    transform: translate3d(0, 0, 0);

    backface-visibility: hidden;
}


/* =========================================================
   REMOVE HOVER PAUSE
========================================================= */

.leadership-marquee:hover
.leadership-marquee__track {

    animation-play-state: running !important;

}


/* =========================================================
   MARQUEE GROUP
========================================================= */

.leadership-marquee__group {
    display: flex;

    align-items: stretch;

    gap: 24px;

    padding-right: 24px;
    padding-bottom: 60px;

    flex-shrink: 0;
}


/* =========================================================
   LEFT → RIGHT ANIMATION
========================================================= */

@keyframes leadershipSlideRight {

    0% {
        transform: translate3d(
            calc(-50% - 12px),
            0,
            0
        );
    }

    100% {
        transform: translate3d(
            0,
            0,
            0
        );
    }

}


/* =========================================================
   LEADERSHIP CARD
========================================================= */

.leadership-card {

    position: relative;

    width: 310px;

    min-width: 310px;

    flex: 0 0 310px;

    overflow: hidden;

    background: #ffffff;

    border: 1px solid
        rgba(7, 60, 89, 0.08);

    border-radius: 24px;

    box-shadow:
        0 18px 45px
        rgba(7, 60, 89, 0.08);

    /*
       Card itself does NOT affect marquee.
    */
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}


/* Card hover visual effect only */

.leadership-card:hover {

    transform: translateY(-8px);

    box-shadow:
        0 25px 55px
        rgba(7, 60, 89, 0.14);

}


/* =========================================================
   IMAGE
========================================================= */

.leadership-card__image {

    position: relative;

    width: 100%;

    height: 310px;

    overflow: hidden;

    
}


.leadership-card__image img {

    display: block;

    width: 100%;
    height: 100%;

    /*
       COMPLETE PERSON IMAGE
       WITHOUT CROPPING
    */
    object-fit: contain;

    object-position: center bottom;

    transition:
        transform 0.7s ease;
}


.leadership-card:hover
.leadership-card__image img {

    transform: scale(1.035);

}


/* =========================================================
   BADGE
========================================================= */

.leadership-card__badge {

    position: absolute;

    top: 18px;
    left: 18px;

    z-index: 5;

    display: inline-flex;

    align-items: center;

    padding: 8px 14px;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #078566,
            #0b9b78
        );

    border-radius: 50px;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 0.3px;

    box-shadow:
        0 8px 20px
        rgba(8, 133, 102, 0.22);
}


/* =========================================================
   CARD BODY
========================================================= */

.leadership-card__body {

    position: relative;

    min-height: 175px;

    padding: 25px 22px 28px;

    text-align: center;

    background: #ffffff;
}


/* =========================================================
   ICON
========================================================= */

.leadership-card__icon {

    display: flex;

    align-items: center;
    justify-content: center;

    width: 48px;
    height: 48px;

    margin:
        -48px auto 16px;

    position: relative;

    z-index: 6;

    color: #078566;

    background: #ffffff;

    border:
        1px solid
        rgba(8, 133, 102, 0.12);

    border-radius: 50%;

    box-shadow:
        0 8px 22px
        rgba(7, 60, 89, 0.10);

    font-size: 18px;

    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}


.leadership-card:hover
.leadership-card__icon {

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #078566,
            #087fbd
        );

    transform: rotate(8deg);

}


/* =========================================================
   NAME
========================================================= */

.leadership-card__body h3 {

    margin: 0 0 8px;

    color: #073c59;

    font-size: 18px;

    font-weight: 800;

    line-height: 1.4;
}


/* =========================================================
   DESIGNATION
========================================================= */

.leadership-card__body p {

    margin: 0;

    color: #788b98;

    font-size: 13px;

    line-height: 1.6;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .leadership-marquee__group {

        gap: 20px;

        padding-right: 20px;
        padding-bottom: 40px;
    }


    .leadership-card {

        width: 285px;

        min-width: 285px;

        flex-basis: 285px;
    }


    .leadership-card__image {

        height: 290px;
    }


    @keyframes leadershipSlideRight {

        0% {
            transform:
                translate3d(
                    calc(-50% - 10px),
                    0,
                    0
                );
        }

        100% {
            transform:
                translate3d(
                    0,
                    0,
                    0
                );
        }

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .leadership-marquee {

        padding:
            5px 0 25px;

        -webkit-mask-image:
            linear-gradient(
                to right,
                transparent 0%,
                #000 8%,
                #000 92%,
                transparent 100%
            );

        mask-image:
            linear-gradient(
                to right,
                transparent 0%,
                #000 8%,
                #000 92%,
                transparent 100%
            );
    }


    .leadership-marquee__group {

        gap: 16px;

        padding-right: 16px;
         padding-bottom: 40px;
    }


    .leadership-card {

        width: 245px;

        min-width: 245px;

        flex-basis: 245px;

        border-radius: 20px;
    }


    .leadership-card__image {

        height: 250px;
    }


    .leadership-card__image img {

        object-fit: contain;

        object-position: center bottom;
    }


    .leadership-card__badge {

        top: 13px;
        left: 13px;

        padding:
            7px 11px;

        font-size: 9px;
    }


    .leadership-card__body {

        min-height: 155px;

        padding:
            22px 15px;
    }


    .leadership-card__icon {

        width: 43px;
        height: 43px;

        margin:
            -43px auto 13px;

        font-size: 16px;
    }


    .leadership-card__body h3 {

        font-size: 15px;
    }


    .leadership-card__body p {

        font-size: 12px;
    }


    @keyframes leadershipSlideRight {

        0% {
            transform:
                translate3d(
                    calc(-50% - 8px),
                    0,
                    0
                );
        }

        100% {
            transform:
                translate3d(
                    0,
                    0,
                    0
                );
        }

    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .leadership-card {

        width: 220px;

        min-width: 220px;

        flex-basis: 220px;
    }


    .leadership-card__image {

        height: 225px;
    }


    .leadership-card__body {

        min-height: 145px;

        padding:
            20px 13px;
    }


    .leadership-card__body h3 {

        font-size: 14px;
    }


    .leadership-card__body p {

        font-size: 11px;
    }


    .leadership-card__badge {

        padding:
            6px 9px;

        font-size: 8px;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    /*
       Accessibility:
       Stop animation only when the user's
       operating system explicitly requests
       reduced motion.
    */

    .leadership-marquee__track {

        animation: none !important;

    }

}



/* =========================================================
   UNIVERSITY LEADERSHIP HEADING
========================================================= */

.university-leadership__heading {
    position: relative;

    max-width: 850px;

    margin: 0 auto 50px;

    padding: 60px 20px 0px 20px;

    text-align: center;
}


/* =========================================================
   EYEBROW
========================================================= */

.university-leadership__eyebrow {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 9px;

    margin-bottom: 15px;

    color: #176b8f;

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1.5px;

    text-transform: uppercase;
}


/* Icon */

.university-leadership__eyebrow-icon {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    width: 32px;
    height: 32px;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #087fbd,
            #0aa99a
        );

    border-radius: 10px;

    font-size: 14px;

    box-shadow:
        0 8px 20px rgba(8, 127, 189, 0.18);
}


/* =========================================================
   MAIN HEADING
========================================================= */

.university-leadership__heading h2 {
    margin: 0;

    color: #173b5d;

    font-size: clamp(36px, 4vw, 54px);

    font-weight: 800;

    line-height: 1.12;

    letter-spacing: -1.8px;
}


/* Highlight */

.university-leadership__heading h2 span {
    display: inline-block;

    color: #087fbd;

    background:
        linear-gradient(
            90deg,
            #087fbd,
            #0aa99a
        );

    -webkit-background-clip: text;
    background-clip: text;

    -webkit-text-fill-color: transparent;
}


/* =========================================================
   DECORATIVE LINE
========================================================= */

.university-leadership__line {
    position: relative;

    display: flex;

    align-items: center;
    justify-content: center;

    width: 100%;

    margin: 20px auto 18px;
}


/* Background line */

.university-leadership__line::before {
    content: "";

    position: absolute;

    width: 110px;
    height: 2px;

    background: #d9edf5;

    border-radius: 50px;
}


/* Active line */

.university-leadership__line span {
    position: relative;

    display: block;

    width: 42px;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #087fbd,
            #0aa99a
        );

    border-radius: 50px;

    box-shadow:
        0 4px 12px rgba(8, 127, 189, 0.20);
}


/* =========================================================
   DESCRIPTION
========================================================= */

.university-leadership__heading p {
    max-width: 720px;

    margin: 0 auto;

    color: #648096;

    font-size: 16px;

    font-weight: 500;

    line-height: 1.75;

    letter-spacing: 0.1px;
}


/* =========================================================
   HOVER / MICRO EFFECT
========================================================= */

.university-leadership__eyebrow-icon {
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}

.university-leadership__heading:hover
.university-leadership__eyebrow-icon {
    transform: translateY(-2px) rotate(-3deg);

    box-shadow:
        0 12px 25px rgba(8, 127, 189, 0.25);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .university-leadership__heading {
        max-width: 760px;

        margin-bottom: 40px;
            padding: 60px 20px 0px 20px;

    }

    .university-leadership__heading h2 {
        font-size: 42px;

        letter-spacing: -1.3px;
    }

    .university-leadership__heading p {
        font-size: 15px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .university-leadership__heading {
        margin-bottom: 35px;

        padding: 60px 20px 0px 20px;

    }


    .university-leadership__eyebrow {
        gap: 7px;

        margin-bottom: 13px;

        font-size: 11px;

        letter-spacing: 1.1px;
    }


    .university-leadership__eyebrow-icon {
        width: 29px;
        height: 29px;

        border-radius: 9px;

        font-size: 12px;
    }


    .university-leadership__heading h2 {
        font-size: 34px;

        line-height: 1.15;

        letter-spacing: -1px;
    }


    .university-leadership__line {
        margin:
            16px auto 15px;
    }


    .university-leadership__heading p {
        max-width: 500px;

        font-size: 14px;

        line-height: 1.65;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .university-leadership__heading {
        padding-left: 10px;
        padding-right: 10px;
    }


    .university-leadership__heading h2 {
        font-size: 29px;

        letter-spacing: -0.7px;
    }


    .university-leadership__heading p {
        font-size: 13.5px;
    }

}