/* ==========================================================================
   Sharada Vidyanikethana: premium redesign layer
   Loaded after the legacy theme CSS. All new components are prefixed `svp-`
   so they never collide with the Creote theme classes.
   ========================================================================== */

:root {
  /* Brand: taken from the logo (green wordmark + saffron seal) */
  --svp-green-950: #0b2016;
  --svp-green-900: #10301f;
  --svp-green-700: #1d5234;
  --svp-green-500: #2f7a4d;
  --svp-saffron: #e8791e;
  --svp-saffron-600: #cf6512;
  --svp-gold: #e2b25c;
  --svp-ivory: #faf6ef;
  --svp-ink: #1a1d1b;
  --svp-muted: #5f6661;
  --svp-white: #ffffff;

  --svp-font-display: "Butler", "Bodoni Moda", Georgia, serif;
  --svp-font-body: "Manrope", "Inter", system-ui, sans-serif;

  --svp-radius: 14px;
  --svp-ease: cubic-bezier(.22, .61, .36, 1);
  --svp-container: 1320px;
}

/* ---------- Buttons ---------- */
.svp-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 30px;
  border-radius: 999px;
  font: 600 15px/1 var(--svp-font-body);
  letter-spacing: .01em;
  text-decoration: none;
  border: 1px solid transparent;
  transition: background-color .35s var(--svp-ease), color .35s var(--svp-ease),
              border-color .35s var(--svp-ease), transform .35s var(--svp-ease);
  white-space: nowrap;
}
.svp-btn svg { width: 16px; height: 16px; transition: transform .35s var(--svp-ease); }
.svp-btn:hover svg { transform: translateX(4px); }

.svp-btn--primary { background: var(--svp-saffron); color: var(--svp-white); }
.svp-btn--primary:hover { background: var(--svp-saffron-600); color: var(--svp-white); }

.svp-btn--ghost { color: var(--svp-white); border-color: rgba(255,255,255,.45); }
.svp-btn--ghost:hover { background: var(--svp-white); color: var(--svp-green-900); border-color: var(--svp-white); }

/* ==========================================================================
   HERO SLIDER
   ========================================================================== */
.svp-hero {
  position: relative;
  height: clamp(620px, calc(100vh - 90px), 860px);
  background: var(--svp-green-950);
  overflow: hidden;
  font-family: var(--svp-font-body);
  color: var(--svp-white);
}
.svp-hero .swiper { height: 100%; }
/* The legacy theme sets fonts on bare elements; reclaim them inside the hero */
.svp-hero p, .svp-hero span, .svp-hero a, .svp-hero button, .svp-hero li,
.svp-hero figcaption { font-family: var(--svp-font-body); }
.svp-hero .svp-hero__title, .svp-hero .svp-hero__stats strong { font-family: var(--svp-font-display); }
.svp-hero .swiper-slide { position: relative; overflow: hidden; }

/* Background image with slow "Ken Burns" drift on the active slide */
.svp-hero__media {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transform: scale(1.12);
  transition: transform 7.5s linear;
}
.swiper-slide-active .svp-hero__media { transform: scale(1); }

.svp-hero__shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(8,24,16,.88) 0%, rgba(8,24,16,.62) 42%, rgba(8,24,16,.12) 75%),
    linear-gradient(0deg, rgba(8,24,16,.7) 0%, rgba(8,24,16,0) 38%);
}

.svp-hero__inner {
  position: relative;
  z-index: 2;
  height: 100%;
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 110px 40px 30px;
  display: flex;
  align-items: center;
}
.svp-hero__content { max-width: 640px; }

.svp-hero__title {
  margin: 0 0 36px;
  font-family: var(--svp-font-display);
  font-weight: 700;
  font-size: clamp(42px, 4.4vw, 66px);
  line-height: 1.12;
  letter-spacing: 0;
  color: var(--svp-white);
}
/* Key phrases stay on one line */
.svp-hero__title mark {
  padding: 0;
  background: none;
  color: inherit;
  white-space: nowrap;
}

.svp-hero__text {
  margin: 0 0 36px;
  max-width: 520px;
  font-size: 18px;
  line-height: 1.65;
  color: rgba(255,255,255,.82);
}
.svp-hero__text b { color: var(--svp-white); font-weight: 600; }

.svp-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }

/* Staggered entrance for text on the active slide */
.svp-hero [data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .9s var(--svp-ease), transform .9s var(--svp-ease);
}
.swiper-slide-active [data-reveal] { opacity: 1; transform: none; }
.swiper-slide-active [data-reveal="2"] { transition-delay: .15s; }
.swiper-slide-active [data-reveal="3"] { transition-delay: .3s; }
.swiper-slide-active [data-reveal="4"] { transition-delay: .45s; }
.swiper-slide-active [data-reveal="5"] { transition-delay: .6s; }

/* ---------- Slide 2: achievers ---------- */
/* See-through dark wash (plus a soft blur) so the photo recedes and the achievers take focus */
.svp-hero__slide--achievers .svp-hero__media { filter: blur(2px); inset: -8px; }
.svp-hero__slide--achievers .svp-hero__shade {
  background:
    linear-gradient(90deg, rgba(8,24,16,.74) 0%, rgba(8,24,16,.6) 45%, rgba(8,24,16,.52) 100%),
    linear-gradient(0deg, rgba(8,24,16,.45) 0%, rgba(8,24,16,0) 35%);
}

.svp-hero__slide--achievers .svp-hero__inner { justify-content: space-between; gap: 56px; }
.svp-hero__slide--achievers .svp-hero__content { flex: 0 0 auto; }
/* Keep the punchline on its two lines; the card grid takes the remaining width */
.svp-hero .svp-hero__title .svp-line { display: block; font-family: inherit; }
.svp-hero__slide--achievers .svp-hero__title { white-space: nowrap; }
@media (max-width: 991px) { .svp-hero__slide--achievers .svp-hero__title { white-space: normal; } }

.svp-hero__stats {
  display: flex;
  gap: 36px;
  margin: 0 0 36px;
  padding: 24px 0 0;
  border-top: 1px solid rgba(255,255,255,.14);
  list-style: none;
}
.svp-hero__stats li { display: flex; flex-direction: column; gap: 6px; }
.svp-hero__stats strong {
  font: 700 38px/1 var(--svp-font-display);
  color: var(--svp-white);
}
.svp-hero__stats strong sup { font-size: .5em; top: -.8em; color: var(--svp-gold); }
.svp-hero__stats span {
  font-size: 13px;
  line-height: 1.4;
  color: rgba(255,255,255,.66);
}

/* Portrait mosaic: three staggered columns */
.svp-mosaic {
  flex: 0 1 600px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  align-items: start;
}
.svp-mosaic__col { display: grid; gap: 18px; }
.svp-mosaic__col:nth-child(2) { transform: translateY(-44px); }
.svp-mosaic__col:nth-child(3) { transform: translateY(28px); }

.svp-card {
  position: relative;
  margin: 0;
  border-radius: var(--svp-radius);
  overflow: hidden;
  background: #dfe6ef;
  aspect-ratio: 4 / 5;
  box-shadow: 0 24px 48px -20px rgba(0,0,0,.55);
}
.svp-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 40% 20%;
  display: block;
}
.svp-card figcaption {
  position: absolute;
  inset: auto 0 0 0;
  padding: 40px 14px 13px;
  background: linear-gradient(0deg, rgba(8,24,16,.92) 10%, rgba(8,24,16,0));
  color: var(--svp-white);
}
.svp-card__name {
  display: block;
  font: 700 14px/1.25 var(--svp-font-body);
}
.svp-card__place {
  display: block;
  margin-top: 3px;
  font-size: 12px;
  line-height: 1.3;
  color: rgba(255,255,255,.72);
}
.svp-card__note {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  font-style: italic;
  color: rgba(255,255,255,.6);
}
.svp-card__tag {
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--svp-saffron);
  font: 700 11px/1 var(--svp-font-body);
  letter-spacing: .03em;
  color: var(--svp-white);
}

/* Rankers: three single cards, the centre one raised */
.svp-mosaic--rankers { flex: 0 1 min(760px, 66vh); gap: 22px; }
/* This slide carries more content, so it uses less top padding than the others */
@media (min-width: 992px) { .svp-hero__slide--achievers .svp-hero__inner { padding-top: 30px; padding-bottom: 130px; } }
.svp-mosaic--rankers .svp-mosaic__col { gap: 22px; }
.svp-mosaic--rankers .svp-mosaic__col:nth-child(2) { transform: translateY(-28px); }
.svp-mosaic--rankers .svp-mosaic__col:nth-child(3) { transform: translateY(16px); }

/* ---- Rank-first achiever cards ---- */
.svp-rank-card {
  margin: 0;
  border-radius: var(--svp-radius);
  overflow: hidden;
  background: var(--svp-ivory);
  box-shadow: 0 22px 44px -20px rgba(0,0,0,.6);
}
.svp-rank-card__photo {
  position: relative;
  aspect-ratio: 5 / 4;
  background: radial-gradient(circle at 50% 35%, #2c6b45 0%, var(--svp-green-900) 72%);
  overflow: hidden;
}
.svp-rank-card__photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 100%;
}
/* Rank is the hero of the card: large numeral + label on top, name and score below */
.svp-rank-card figcaption {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: end;
  column-gap: 8px;
  padding: 12px 12px 13px;
}
.svp-rank-card__info { display: contents; }
.svp-hero .svp-rank-card__num {
  grid-column: 1;
  grid-row: 1;
  font: 700 clamp(34px, 3vw, 46px)/.8 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-rank-card__num sup {
  font-size: .38em;
  top: -1.25em;
  margin-left: 1px;
  color: var(--svp-saffron-600);
}
.svp-hero .svp-rank-card__label {
  grid-column: 2;
  grid-row: 1;
  padding-bottom: 2px;
  font: 700 9.5px/1.2 var(--svp-font-body);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--svp-saffron-600);
}
.svp-hero .svp-rank-card__name {
  grid-column: 1 / -1;
  margin-top: 10px;
  font: 700 13.5px/1.25 var(--svp-font-body);
  color: var(--svp-ink);
}
.svp-hero .svp-rank-card__meta {
  grid-column: 1 / -1;
  margin-top: 3px;
  font: 500 12px/1.3 var(--svp-font-body);
  color: var(--svp-muted);
}
.svp-rank-card__meta b { font-weight: 700; color: var(--svp-saffron-600); }
.svp-rank-card__meta b::before { content: "\00b7"; margin: 0 5px; color: var(--svp-muted); font-weight: 500; }
/* When the cards get narrow, the score drops to its own line instead of wrapping mid-line */
@media (max-width: 1399px), (max-height: 820px) {
  .svp-rank-card__meta b { display: block; margin-top: 2px; }
  .svp-rank-card__meta b::before { content: none; }
}

.svp-mosaic--rankers .svp-rank-card {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity .9s var(--svp-ease), transform .9s var(--svp-ease);
}
.swiper-slide-active .svp-mosaic--rankers .svp-rank-card { opacity: 1; transform: none; }
.swiper-slide-active .svp-mosaic__col:nth-child(1) .svp-rank-card:nth-child(1) { transition-delay: .25s; }
.swiper-slide-active .svp-mosaic__col:nth-child(2) .svp-rank-card:nth-child(1) { transition-delay: .35s; }
.swiper-slide-active .svp-mosaic__col:nth-child(3) .svp-rank-card:nth-child(1) { transition-delay: .45s; }
.swiper-slide-active .svp-mosaic__col:nth-child(1) .svp-rank-card:nth-child(2) { transition-delay: .55s; }
.swiper-slide-active .svp-mosaic__col:nth-child(2) .svp-rank-card:nth-child(2) { transition-delay: .65s; }
.swiper-slide-active .svp-mosaic__col:nth-child(3) .svp-rank-card:nth-child(2) { transition-delay: .75s; }

/* Mosaic cards drift in one after another */
.svp-mosaic .svp-card {
  opacity: 0;
  transform: translateY(40px) scale(.96);
  transition: opacity .9s var(--svp-ease), transform .9s var(--svp-ease);
}
.swiper-slide-active .svp-mosaic .svp-card { opacity: 1; transform: none; }
.swiper-slide-active .svp-mosaic__col:nth-child(1) .svp-card:nth-child(1) { transition-delay: .25s; }
.swiper-slide-active .svp-mosaic__col:nth-child(2) .svp-card:nth-child(1) { transition-delay: .35s; }
.swiper-slide-active .svp-mosaic__col:nth-child(3) .svp-card:nth-child(1) { transition-delay: .45s; }
.swiper-slide-active .svp-mosaic__col:nth-child(1) .svp-card:nth-child(2) { transition-delay: .55s; }
.swiper-slide-active .svp-mosaic__col:nth-child(2) .svp-card:nth-child(2) { transition-delay: .65s; }
.swiper-slide-active .svp-mosaic__col:nth-child(3) .svp-card:nth-child(2) { transition-delay: .75s; }

/* ---------- Bottom navigation bar ---------- */
.svp-hero__nav {
  position: absolute;
  z-index: 5;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(0deg, rgba(8,24,16,.55), rgba(8,24,16,0));
}
.svp-hero__nav-inner {
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 0 40px;
  padding-top: 24px;
  padding-bottom: 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.svp-hero__arrows { display: flex; align-items: center; gap: 12px; }
.svp-hero__arrow {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.35);
  background: transparent;
  color: var(--svp-white);
  cursor: pointer;
  transition: background-color .3s var(--svp-ease), border-color .3s var(--svp-ease), color .3s var(--svp-ease);
}
.svp-hero__arrow:hover { background: var(--svp-white); border-color: var(--svp-white); color: var(--svp-green-900); }
.svp-hero__arrow svg { width: 15px; height: 15px; }

.svp-hero__counter {
  margin: 0;
  font: 600 14px/1 var(--svp-font-body);
  letter-spacing: .08em;
  color: rgba(255,255,255,.7);
}
.svp-hero__counter b { color: var(--svp-white); font-size: 18px; }

.svp-hero button:focus-visible,
.svp-hero a:focus-visible { outline: 2px solid var(--svp-gold); outline-offset: 3px; }

/* ---------- Responsive ---------- */
@media (max-width: 1199px) {
  .svp-mosaic { flex-basis: 480px; gap: 14px; }
  .svp-mosaic__col { gap: 14px; }
  .svp-hero__stats { gap: 26px; }
}

@media (max-width: 991px) {
  .svp-hero { height: auto; min-height: 640px; }
  .svp-hero__inner { padding: 110px 28px 150px; min-height: 640px; }
  .svp-hero__slide--achievers .svp-hero__inner { flex-direction: column; align-items: flex-start; justify-content: center; gap: 40px; }
  .svp-hero__slide--achievers .svp-hero__content { flex-basis: auto; }
  .svp-mosaic { flex-basis: auto; width: 100%; max-width: 560px; }
  .svp-mosaic__col:nth-child(2) { transform: translateY(-20px); }
  .svp-mosaic__col:nth-child(3) { transform: none; }
  /* All six achievers stay visible, as on desktop */
  .svp-mosaic--rankers, .svp-mosaic--rankers .svp-mosaic__col { gap: 12px; }
  .svp-mosaic--rankers .svp-mosaic__col:nth-child(2) { transform: translateY(-14px); }
  .svp-mosaic--rankers .svp-mosaic__col:nth-child(3) { transform: translateY(10px); }

  .svp-hero__nav-inner { padding: 18px 28px; }
}

@media (max-width: 575px) {
  .svp-hero, .svp-hero__inner { min-height: 0; }
  .svp-hero__inner { padding: 48px 20px 104px; }
  .svp-hero__stats li { flex: 1 1 0; }
  .svp-hero__title { font-size: 36px; line-height: 1.25; }
  .svp-hero__text { font-size: 16px; margin-bottom: 28px; }
  .svp-hero__actions .svp-btn { padding: 14px 22px; font-size: 14px; }
  .svp-hero__stats { gap: 18px; margin-bottom: 28px; }
  .svp-hero__stats strong { font-size: 30px; }
  .svp-hero__stats span { font-size: 12px; }
  .svp-card figcaption { padding: 28px 9px 9px; }
  .svp-card__name { font-size: 12px; }
  .svp-card__place { font-size: 10.5px; }
  .svp-card__tag { font-size: 9.5px; padding: 4px 7px; top: 7px; left: 7px; }
  .svp-hero__nav-inner { padding: 16px 20px; }
  .svp-hero__arrow { width: 40px; height: 40px; }
  /* Six compact achiever cards on a phone */
  .svp-hero__slide--achievers .svp-hero__inner { gap: 26px; }
  .svp-hero__slide--achievers .svp-hero__title { margin-bottom: 22px; }
  .svp-mosaic--rankers, .svp-mosaic--rankers .svp-mosaic__col { gap: 8px; }
  .svp-rank-card figcaption { padding: 8px 7px 9px; column-gap: 4px; }
  .svp-hero .svp-rank-card__num { font-size: 26px; }
  .svp-hero .svp-rank-card__label { font-size: 7px; letter-spacing: .08em; }
  .svp-hero .svp-rank-card__name { margin-top: 6px; font-size: 11px; }
  .svp-hero .svp-rank-card__meta { font-size: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .svp-hero__media,
  .svp-hero [data-reveal],
  .svp-mosaic .svp-card,
  .svp-mosaic .svp-rank-card { transition: none !important; }
  .svp-hero__media { transform: none; }
}

/* ==========================================================================
   HEADER: desktop (≥ 992px). Below that the original theme header is used
   until the mobile redesign is signed off.
   ========================================================================== */
.svp-header { display: none; }

@media (min-width: 992px) {
  .svp-legacy-header { display: none; }

  .svp-header {
    display: block;
    position: relative;
    z-index: 1000;
    font-family: var(--svp-font-body);
  }
  .svp-header a { text-decoration: none; }

  /* ---- Main bar ---- */
  .svp-navbar {
    background: var(--svp-white);
    border-bottom: 1px solid rgba(16,48,31,.08);
  }
  /* Full-width bar: logo hugs the left edge, CTA the right, menu spread in between */
  .svp-navbar__inner {
    max-width: none;
    height: 78px;
    margin: 0;
    padding: 0 clamp(24px, 2.6vw, 48px);
    display: flex;
    align-items: center;
    gap: 40px;
    transition: height .35s var(--svp-ease);
  }
  .svp-navbar__logo { flex: none; display: block; }
  .svp-navbar__logo img {
    display: block;
    width: auto;
    height: 60px;
    transition: height .35s var(--svp-ease);
  }

  .svp-nav { flex: 1 1 auto; display: flex; justify-content: center; }
  .svp-nav__list {
    display: flex;
    align-items: center;
    gap: 2px;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .svp-nav__list > li { position: relative; margin: 0; list-style: none; }
  .svp-nav__list > li::marker { content: none; }

  .svp-nav__link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 12px 14px;
    background: none;
    border: 0;
    font: 600 16px/1 var(--svp-font-body);
    color: var(--svp-ink);
    cursor: pointer;
    transition: color .25s var(--svp-ease);
  }
  .svp-nav__link svg { width: 11px; height: 11px; opacity: .6; transition: transform .3s var(--svp-ease); }
  .svp-nav__link::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 4px;
    height: 2px;
    background: var(--svp-saffron);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .35s var(--svp-ease);
  }
  .svp-nav__link:hover,
  .svp-nav__link.is-current { color: var(--svp-green-700); }
  .svp-nav__link:hover::after,
  .svp-nav__link.is-current::after { transform: scaleX(1); }

  /* Dropdown */
  .svp-nav__menu {
    position: absolute;
    top: calc(100% + 14px);
    left: 0;
    min-width: 268px;
    margin: 0;
    padding: 10px;
    list-style: none;
    background: var(--svp-white);
    border-radius: 12px;
    box-shadow: 0 24px 50px -18px rgba(11,32,22,.28), 0 0 0 1px rgba(11,32,22,.06);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity .25s var(--svp-ease), transform .25s var(--svp-ease), visibility .25s;
  }
  /* Invisible bridge so the menu doesn't close while the pointer crosses the gap */
  .svp-nav__menu::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
  .svp-nav__menu li { margin: 0; list-style: none; }
  .svp-nav__menu li::marker { content: none; }
  .svp-nav__menu a {
    display: block;
    padding: 11px 14px;
    border-radius: 8px;
    font: 500 14.5px/1.3 var(--svp-font-body);
    color: var(--svp-ink);
    transition: background-color .2s, color .2s;
  }
  .svp-nav__menu a:hover { background: var(--svp-ivory); color: var(--svp-green-700); }

  .svp-nav__item--has-menu:hover .svp-nav__menu,
  .svp-nav__item--has-menu:focus-within .svp-nav__menu,
  .svp-nav__item--has-menu.is-open .svp-nav__menu {
    opacity: 1;
    visibility: visible;
    transform: none;
  }
  .svp-nav__item--has-menu:hover .svp-nav__link svg,
  .svp-nav__item--has-menu.is-open .svp-nav__link svg { transform: rotate(180deg); }

  .svp-navbar__actions { flex: none; display: flex; align-items: center; gap: 22px; }
  .svp-navbar__cta { flex: none; padding: 13px 24px; }
  .svp-navbar__phone {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--svp-green-900);
    white-space: nowrap;
    transition: color .25s var(--svp-ease);
  }
  .svp-navbar__phone:hover { color: var(--svp-saffron-600); }
  .svp-navbar__phone-icon { width: 26px; height: 26px; color: var(--svp-saffron); flex: none; }
  .svp-navbar__phone-text { display: flex; flex-direction: column; gap: 4px; font: 700 15.5px/1 var(--svp-font-body); }
  .svp-navbar__phone-text small {
    font: 500 11.5px/1 var(--svp-font-body);
    letter-spacing: .02em;
    color: var(--svp-muted);
  }

  .svp-header a:focus-visible,
  .svp-header button:focus-visible { outline: 2px solid var(--svp-saffron); outline-offset: 2px; border-radius: 6px; }

  /* ---- Sticky state (after scrolling past the header) ---- */
  .svp-header.is-stuck .svp-navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    box-shadow: 0 10px 30px -12px rgba(11,32,22,.22);
    animation: svp-slide-down .45s var(--svp-ease);
  }
  .svp-header.is-stuck .svp-navbar__inner { height: 66px; }
  .svp-header.is-stuck .svp-navbar__logo img { height: 50px; }

  @keyframes svp-slide-down {
    from { transform: translateY(-100%); }
    to   { transform: none; }
  }

  /* The hero sits under a taller header now */
  .svp-hero { height: clamp(620px, calc(100vh - 78px), 860px); }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .svp-navbar__inner { padding: 0 24px; }
  .svp-navbar__inner { gap: 20px; }
  .svp-navbar__logo img { height: 60px; }
  .svp-header.is-stuck .svp-navbar__logo img { height: 50px; }
  .svp-nav__list { gap: 0; }
  .svp-navbar__actions { gap: 12px; }
  .svp-navbar__phone-text { display: none; }
  .svp-nav__link { padding: 12px 9px; font-size: 14.5px; }
  .svp-nav__link::after { left: 10px; right: 10px; }
  .svp-navbar__cta { padding: 13px 20px; }
}

@media (max-width: 575px) {
  .svp-hero .svp-rank-card__num { font-size: 28px; }
  .svp-hero .svp-rank-card__label { font-size: 8px; }
  .svp-rank-card figcaption { padding: 9px 9px 10px; column-gap: 5px; }
  .svp-hero .svp-rank-card__name { margin-top: 7px; }
  .svp-hero .svp-rank-card__name { font-size: 12px; }
  .svp-hero .svp-rank-card__meta { font-size: 11px; }
}

/* ==========================================================================
   CAMPUS LIFE: focus carousel (homepage)
   ========================================================================== */
.svp-life {
  padding: 110px 0;
  background: #f5f1e9;
  overflow: hidden;
  font-family: var(--svp-font-body);
}
.svp-life__inner {
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 0 40px;
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.5fr);
  align-items: center;
  gap: 48px;
}
.svp-life .svp-life__heading {
  margin: 0 0 34px;
  font: 700 clamp(36px, 3.6vw, 54px)/1.12 var(--svp-font-display);
  color: var(--svp-green-900);
}

.svp-life__carousel { position: relative; }
.svp-life__stage {
  position: relative;
  aspect-ratio: 16 / 10.5;
  overflow: hidden;
  touch-action: pan-y;
  user-select: none;
}
.svp-life__slide {
  position: absolute;
  top: 6%;
  left: 20%;
  width: 60%;
  height: 88%;
  margin: 0;
  border-radius: 6px;
  overflow: hidden;
  background: var(--svp-green-900);
  cursor: pointer;
  opacity: 0;
  transform: scale(.5);
  pointer-events: none;
  transition: transform .8s var(--svp-ease), opacity .8s var(--svp-ease), filter .8s var(--svp-ease), box-shadow .8s var(--svp-ease);
}
.svp-life__slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  -webkit-user-drag: none;
}
.svp-life__slide.is-active {
  z-index: 5;
  opacity: 1;
  transform: none;
  pointer-events: auto;
  cursor: default;
  box-shadow: 0 34px 60px -30px rgba(11,32,22,.55);
}
.svp-life__slide.is-prev,
.svp-life__slide.is-next {
  z-index: 3;
  opacity: .55;
  filter: saturate(.55);
  pointer-events: auto;
}
.svp-life__slide.is-prev { transform: translateX(-52%) scale(.74); }
.svp-life__slide.is-next { transform: translateX(52%) scale(.74); }
.svp-life__slide.is-far-prev,
.svp-life__slide.is-far-next { z-index: 1; opacity: .22; filter: saturate(.3); }
.svp-life__slide.is-far-prev { transform: translateX(-86%) scale(.56); }
.svp-life__slide.is-far-next { transform: translateX(86%) scale(.56); }

.svp-life .svp-life__slide figcaption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 60px 26px 22px;
  background: linear-gradient(0deg, rgba(8,24,16,.78), rgba(8,24,16,0));
  font: 600 17px/1.2 var(--svp-font-body);
  letter-spacing: .02em;
  color: var(--svp-white);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .5s var(--svp-ease) .25s, transform .5s var(--svp-ease) .25s;
}
.svp-life__slide.is-active figcaption { opacity: 1; transform: none; }

.svp-life__arrow {
  position: absolute;
  top: 50%;
  z-index: 6;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin-top: -24px;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 10px 24px -10px rgba(11,32,22,.45);
  transition: background-color .25s var(--svp-ease), color .25s var(--svp-ease), transform .25s var(--svp-ease);
}
.svp-life__arrow svg { width: 16px; height: 16px; }
.svp-life__arrow--prev { left: 12%; background: var(--svp-white); color: var(--svp-green-900); }
.svp-life__arrow--next { right: 12%; background: var(--svp-saffron); color: var(--svp-white); }
.svp-life__arrow--prev:hover { background: var(--svp-green-900); color: var(--svp-white); }
.svp-life__arrow--next:hover { background: var(--svp-saffron-600); }
.svp-life__arrow:focus-visible { outline: 2px solid var(--svp-saffron); outline-offset: 3px; }

.svp-life__dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 22px;
}
.svp-life__dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(16,48,31,.2);
  cursor: pointer;
  transition: width .35s var(--svp-ease), background-color .35s var(--svp-ease);
}
.svp-life__dot:hover { background: rgba(16,48,31,.45); }
.svp-life__dot.is-active { width: 26px; background: var(--svp-saffron); }

@media (max-width: 1199px) {
  .svp-life__inner { padding: 0 24px; gap: 32px; }
}
@media (max-width: 991px) {
  .svp-life { padding: 72px 0; }
  .svp-life__inner { grid-template-columns: 1fr; gap: 28px; }
  .svp-life .svp-life__heading { margin-bottom: 22px; }
  .svp-life__stage { aspect-ratio: 4 / 3.1; }
  .svp-life__slide { left: 11%; width: 78%; }
  .svp-life__slide.is-prev { transform: translateX(-66%) scale(.8); }
  .svp-life__slide.is-next { transform: translateX(66%) scale(.8); }
  .svp-life__slide.is-far-prev,
  .svp-life__slide.is-far-next { opacity: 0; }
  .svp-life__arrow { width: 40px; height: 40px; margin-top: -20px; }
  .svp-life__arrow--prev { left: 2%; }
  .svp-life__arrow--next { right: 2%; }
  .svp-life .svp-life__slide figcaption { padding: 40px 16px 14px; font-size: 14.5px; }
}
@media (prefers-reduced-motion: reduce) {
  .svp-life__slide, .svp-life__slide figcaption { transition: none; }
}

/* ==========================================================================
   ADMISSIONS CTA: framed card over a full-width campus photo
   ========================================================================== */
.svp-apply {
  position: relative;
  padding: 120px 24px;
  background-size: cover;
  background-position: center;
  font-family: var(--svp-font-body);
}
.svp-apply { background-position: 28% 45%; }
.svp-apply::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(11,32,22,.05) 0%, rgba(11,32,22,.18) 45%, rgba(11,32,22,.4) 100%);
}
/* Desktop: card sits on the right so the student on the left of the photo stays visible */
@media (min-width: 992px) {
  .svp-apply { padding: 64px 0; }
  .svp-apply__inner {
    position: relative;
    max-width: var(--svp-container);
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    justify-content: flex-end;
  }
  .svp-apply .svp-apply__card { margin: 0; max-width: 600px; padding: 40px 48px 36px; }
  .svp-apply .svp-apply__heading { font-size: clamp(32px, 2.9vw, 42px); }
}
.svp-apply__card {
  position: relative;
  max-width: 840px;
  margin: 0 auto;
  padding: 64px 72px 56px;
  background: var(--svp-white);
  text-align: center;
  box-shadow: 0 40px 80px -40px rgba(0,0,0,.45);
}
/* Thin inner frame, as on the reference */
.svp-apply__card::before {
  content: "";
  position: absolute;
  inset: 14px;
  border: 1px solid rgba(16,48,31,.12);
  pointer-events: none;
}
.svp-apply .svp-apply__heading {
  margin: 0;
  font: 700 clamp(32px, 3.4vw, 48px)/1.15 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-apply__rule {
  display: block;
  width: 56px;
  height: 3px;
  margin: 18px auto 20px;
  background: var(--svp-saffron);
}
.svp-apply .svp-apply__text {
  max-width: 560px;
  margin: 0 auto 26px;
  font: 400 16.5px/1.7 var(--svp-font-body);
  color: var(--svp-muted);
}
.svp-apply .svp-apply__call {
  margin: 14px 0 0;
  font: 500 14px/1.4 var(--svp-font-body);
  color: var(--svp-muted);
}
.svp-apply__call a { color: var(--svp-green-900); font-weight: 700; text-decoration: none; }
.svp-apply__call a:hover { color: var(--svp-saffron-600); }

@media (max-width: 767px) {
  .svp-apply { padding: 72px 16px; }
  .svp-apply__card { padding: 44px 26px 38px; }
  .svp-apply__card::before { inset: 8px; }
  .svp-apply .svp-apply__text { font-size: 15.5px; margin-bottom: 28px; }
}
.svp-apply .svp-nowrap { white-space: nowrap; font-family: inherit; }

/* ==========================================================================
   ABOUT: Facebook reel on a campus panel + intro copy
   ========================================================================== */
.svp-about {
  padding: 110px 0;
  background: var(--svp-white);
  font-family: var(--svp-font-body);
}
.svp-about__inner {
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 0 40px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  align-items: center;
  gap: 80px;
}

.svp-about__media {
  position: relative;
  display: flex;
  justify-content: center;
  padding: 48px 0;
}
/* Rounded campus-photo panel behind the reel */
.svp-about__panel {
  position: absolute;
  inset: 0 12% 0 0;
  border-radius: 28px;
  background-size: cover;
  background-position: center;
  overflow: hidden;
}
.svp-about__panel::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, rgba(11,32,22,.35), rgba(11,32,22,.7));
}
.svp-about__reel {
  position: relative;
  z-index: 1;
  width: min(340px, 72%);
  aspect-ratio: 9 / 16;
  margin-right: 12%;
  border-radius: 20px;
  overflow: hidden;
  background: #000;
  box-shadow: 0 40px 70px -30px rgba(0,0,0,.6);
}
.svp-about__reel iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.svp-about__badge {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 70px;
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 12px;
  align-items: end;
  width: 230px;
  padding: 22px 24px;
  border-radius: 18px;
  background: var(--svp-ivory);
  box-shadow: 0 24px 50px -22px rgba(11,32,22,.45);
}
.svp-about .svp-about__badge-small {
  grid-column: 1 / -1;
  font: 600 12px/1 var(--svp-font-body);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--svp-saffron-600);
}
.svp-about .svp-about__badge-year {
  margin-top: 6px;
  font: 700 46px/1 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-about .svp-about__badge-text {
  padding-bottom: 5px;
  font: 500 12.5px/1.3 var(--svp-font-body);
  color: var(--svp-muted);
}

.svp-about .svp-about__heading {
  margin: 0 0 28px;
  font: 700 clamp(34px, 3.3vw, 50px)/1.14 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-about__content p {
  margin: 0 0 18px;
  font: 400 17px/1.8 var(--svp-font-body);
  color: var(--svp-muted);
}
.svp-about__footer {
  margin-top: 34px;
  padding-top: 34px;
  border-top: 1px solid rgba(16,48,31,.12);
}

@media (max-width: 1199px) {
  .svp-about__inner { padding: 0 24px; gap: 48px; }
}
@media (max-width: 991px) {
  .svp-about { padding: 72px 0; }
  .svp-about__inner { grid-template-columns: 1fr; }
  .svp-about__media { max-width: 520px; width: 100%; margin: 0 auto; }
}
@media (max-width: 575px) {
  .svp-about__media { padding: 28px 0; }
  .svp-about__panel { inset: 0 8% 0 0; border-radius: 20px; }
  .svp-about__reel { width: 70%; margin-right: 8%; border-radius: 16px; }
  .svp-about__badge { width: 180px; padding: 16px 18px; bottom: 40px; }
  .svp-about .svp-about__badge-year { font-size: 36px; }
  .svp-about__content p { font-size: 15.5px; }
}
.svp-about__reel video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.svp-about__sound {
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 50%;
  background: rgba(0,0,0,.45);
  color: var(--svp-white);
  cursor: pointer;
  backdrop-filter: blur(4px);
  transition: background-color .25s var(--svp-ease);
}
.svp-about__sound:hover { background: var(--svp-saffron); }
.svp-about__sound svg { width: 20px; height: 20px; }
.svp-about__sound .is-on,
.svp-about__reel.is-sound .svp-about__sound .is-off { display: none; }
.svp-about__reel.is-sound .svp-about__sound .is-on { display: block; }
/* No video file yet: show the poster only, hide the sound control */
.svp-about__reel.is-poster .svp-about__sound { display: none; }

/* ==========================================================================
   QUICK LINKS: sits half over the bottom of the hero slider
   ========================================================================== */
.svp-quick {
  position: relative;
  z-index: 10;
  margin-top: -34px;
  padding: 0 40px;
  font-family: var(--svp-font-body);
}
.svp-quick__inner {
  max-width: var(--svp-container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  background: var(--svp-white);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 30px 60px -28px rgba(11,32,22,.35), 0 0 0 1px rgba(16,48,31,.06);
}
.svp-quick .svp-quick__item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 116px;
  padding: 26px 28px;
  color: var(--svp-ink);
  text-decoration: none;
  transition: background-color .3s var(--svp-ease), color .3s var(--svp-ease);
}
/* Hairline dividers between the white tiles */
.svp-quick__item + .svp-quick__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 26px;
  bottom: 26px;
  width: 1px;
  background: rgba(16,48,31,.1);
}
.svp-quick__item--primary + .svp-quick__item::before { display: none; }

.svp-quick__icon {
  flex: none;
  width: 34px;
  height: 34px;
  color: var(--svp-saffron);
  transition: color .3s var(--svp-ease), transform .3s var(--svp-ease);
}
.svp-quick__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.svp-quick .svp-quick__label {
  font: 500 12.5px/1.3 var(--svp-font-body);
  color: var(--svp-muted);
  transition: color .3s var(--svp-ease);
}
.svp-quick .svp-quick__title {
  font: 700 21px/1.15 var(--svp-font-display);
  color: var(--svp-green-900);
  transition: color .3s var(--svp-ease);
}
.svp-quick__arrow {
  flex: none;
  width: 16px;
  height: 16px;
  color: var(--svp-saffron);
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity .3s var(--svp-ease), transform .3s var(--svp-ease);
}
.svp-quick__item:hover .svp-quick__arrow,
.svp-quick__item:focus-visible .svp-quick__arrow { opacity: 1; transform: none; }
.svp-quick__item:hover { background: var(--svp-ivory); }
.svp-quick__item:hover .svp-quick__icon { transform: translateY(-2px); }

/* Primary tile */
.svp-quick .svp-quick__item--primary { background: var(--svp-saffron); }
.svp-quick .svp-quick__item--primary:hover { background: var(--svp-saffron-600); }
.svp-quick__item--primary .svp-quick__icon,
.svp-quick__item--primary .svp-quick__arrow { color: var(--svp-white); }
.svp-quick .svp-quick__item--primary .svp-quick__label { color: rgba(255,255,255,.85); }
.svp-quick .svp-quick__item--primary .svp-quick__title { color: var(--svp-white); }
.svp-quick__item--primary .svp-quick__arrow { opacity: .9; transform: none; }

.svp-quick__item:focus-visible { outline: 2px solid var(--svp-green-900); outline-offset: -4px; }

/* Lift the slider counter/arrows above the overlapping bar */
/* Slider counter/arrows sit just above the bar (bar overlaps the slider by 34px) */
.svp-hero__nav { bottom: 34px; }
@media (min-width: 992px) { .svp-hero__inner { padding-bottom: 60px; } }

@media (max-width: 1199px) {
  .svp-quick { padding: 0 24px; }
  .svp-quick .svp-quick__item { padding: 22px 20px; gap: 12px; }
  .svp-quick .svp-quick__title { font-size: 18px; }
  .svp-quick__icon { width: 28px; height: 28px; }
}
@media (max-width: 991px) {
  .svp-quick { margin-top: -40px; padding: 0 20px; }
  .svp-quick__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .svp-quick .svp-quick__item { min-height: 96px; }
  .svp-quick__item + .svp-quick__item::before { display: none; }
  .svp-quick__item:nth-child(2n) { border-left: 1px solid rgba(16,48,31,.1); }
  .svp-quick__item:nth-child(n+3) { border-top: 1px solid rgba(16,48,31,.1); }
  .svp-quick__arrow { display: none; }
  .svp-hero__nav { bottom: 40px; }
  .svp-hero__inner { padding-bottom: 170px; }
}
@media (max-width: 575px) {
  .svp-quick { padding: 0 14px; }
  .svp-quick .svp-quick__item { flex-direction: column; align-items: flex-start; gap: 10px; padding: 18px 16px; }
  .svp-quick .svp-quick__label { font-size: 11px; }
  .svp-quick .svp-quick__title { font-size: 17px; }
  .svp-quick__icon { width: 26px; height: 26px; }
  .svp-hero__inner { padding-bottom: 150px; }
}

/* Short laptop screens: tighter ranker cards so they clear the slider arrows */
@media (min-width: 992px) and (max-height: 820px) {
  .svp-hero__slide--achievers .svp-hero__inner { padding-bottom: 96px; }
  .svp-mosaic--rankers .svp-mosaic__col:nth-child(2) { transform: translateY(-20px); }
  .svp-mosaic--rankers .svp-mosaic__col:nth-child(3) { transform: none; }
  .svp-mosaic--rankers, .svp-mosaic--rankers .svp-mosaic__col { gap: 16px; }
  .svp-rank-card figcaption { padding: 8px 10px 9px; }
  .svp-hero .svp-rank-card__num { font-size: 30px; }
  .svp-hero .svp-rank-card__name { margin-top: 6px; font-size: 12.5px; }
  .svp-hero .svp-rank-card__meta { font-size: 11px; }
}
@media (min-width: 992px) and (max-height: 740px) {
  .svp-hero__slide--achievers .svp-hero__inner { padding-top: 10px; padding-bottom: 136px; }
}

/* ---- About: organic "blob" photo (replaces the reel frame) ---- */
.svp-about { padding: 84px 0; }
.svp-about__media { padding: 0; }
.svp-about__blob {
  position: relative;
  z-index: 1;
  width: min(500px, 100%);
  aspect-ratio: 1 / 1;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 62% 38% 46% 54% / 42% 58% 42% 58%;
  box-shadow: 0 40px 70px -40px rgba(11,32,22,.5);
}
.svp-about__blob img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* Soft offset shape behind the photo */
.svp-about__blob-bg {
  position: absolute;
  z-index: 0;
  top: 50%;
  left: 50%;
  width: min(500px, 100%);
  aspect-ratio: 1 / 1;
  transform: translate(-46%, -47%) rotate(-8deg);
  border-radius: 46% 54% 60% 40% / 55% 45% 55% 45%;
  background: var(--svp-ivory);
  border: 1px solid rgba(232,121,30,.25);
}
.svp-about__media .svp-about__badge { right: 2%; bottom: 8%; }
.svp-about .svp-about__heading { margin-bottom: 22px; }
.svp-about__content p { margin-bottom: 14px; line-height: 1.75; }
.svp-about__footer { margin-top: 26px; padding-top: 26px; }

@media (max-width: 991px) {
  .svp-about { padding: 64px 0; }
  .svp-about__blob, .svp-about__blob-bg { width: min(420px, 88%); }
}
@media (max-width: 575px) {
  .svp-about { padding: 52px 0; }
  .svp-about__media .svp-about__badge { right: 0; bottom: 4%; }
}

/* ==========================================================================
   LEGACY STATS: deep green band with a 3 × 2 number grid
   ========================================================================== */
.svp-stats {
  position: relative;
  padding: 90px 0;
  background:
    radial-gradient(circle at 85% 0%, rgba(47,122,77,.55), transparent 55%),
    radial-gradient(circle at 0% 100%, rgba(232,121,30,.12), transparent 45%),
    var(--svp-green-900);
  color: var(--svp-white);
  font-family: var(--svp-font-body);
  overflow: hidden;
}
.svp-stats__inner {
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 0 40px;
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 2fr);
  gap: 64px;
  align-items: center;
}
.svp-stats .svp-stats__heading {
  margin: 0 0 18px;
  font: 700 clamp(34px, 3.4vw, 50px)/1.1 var(--svp-font-display);
  color: var(--svp-white);
}
.svp-stats .svp-stats__sub {
  margin: 0;
  max-width: 340px;
  font: 400 16px/1.7 var(--svp-font-body);
  color: rgba(255,255,255,.7);
}
.svp-stats__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}
.svp-stats__item {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 30px 30px 30px 32px;
  list-style: none;
  border-left: 1px solid rgba(255,255,255,.14);
}
.svp-stats__item::marker { content: none; }
.svp-stats__item:nth-child(-n+3) { border-bottom: 1px solid rgba(255,255,255,.14); }
.svp-stats .svp-stats__num {
  font: 700 clamp(40px, 3.8vw, 58px)/1 var(--svp-font-display);
  color: var(--svp-white);
  font-variant-numeric: tabular-nums;
}
.svp-stats .svp-stats__num span { font-family: inherit; }
.svp-stats .svp-stats__plus { color: var(--svp-saffron); margin-left: 2px; }
.svp-stats .svp-stats__label {
  font: 500 15px/1.4 var(--svp-font-body);
  color: rgba(255,255,255,.72);
}

@media (max-width: 1199px) {
  .svp-stats__inner { padding: 0 24px; gap: 40px; }
  .svp-stats__item { padding: 26px 22px; }
}
@media (max-width: 991px) {
  .svp-stats { padding: 64px 0; }
  .svp-stats__inner { grid-template-columns: 1fr; gap: 28px; }
  .svp-stats .svp-stats__sub { max-width: none; }
}
@media (max-width: 575px) {
  .svp-stats__inner { padding: 0 20px; }
  .svp-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .svp-stats__item { padding: 22px 14px 22px 16px; border-bottom: 1px solid rgba(255,255,255,.14); }
  .svp-stats__item:nth-child(odd) { border-left: 0; padding-left: 0; }
  .svp-stats__item:nth-child(n+5) { border-bottom: 0; }
  .svp-stats .svp-stats__num { font-size: 36px; }
  .svp-stats .svp-stats__label { font-size: 13.5px; }
}

/* Stats: deep green with soft glows, plus line icons */
.svp-stats { background: var(--svp-green-900); }
.svp-stats::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.svp-stats::after {
  background:
    radial-gradient(circle at 85% 0%, rgba(47,122,77,.55), transparent 55%),
    radial-gradient(circle at 0% 100%, rgba(232,121,30,.12), transparent 45%);
}
.svp-stats__inner { position: relative; z-index: 1; }
.svp-stats__icon {
  width: 30px;
  height: 30px;
  margin-bottom: 6px;
  color: var(--svp-saffron);
}
@media (max-width: 575px) {
  .svp-stats__icon { width: 26px; height: 26px; }
}
.svp-about .svp-about__badge-of { font-size: .5em; color: var(--svp-saffron-600); font-family: inherit; }
.svp-about__badge { width: 250px; }
/* Result badge: label, score and caption stacked */
.svp-about__badge { grid-template-columns: 1fr; width: auto; min-width: 200px; padding: 18px 22px; }
.svp-about .svp-about__badge-text { padding: 6px 0 0; font-size: 13px; color: var(--svp-green-700); font-weight: 600; }
.svp-about .svp-about__badge-year--text { font-size: 26px; line-height: 1.1; margin-top: 8px; }
.svp-about .svp-about__badge-text { letter-spacing: .04em; }
/* Compact coaching badge */
.svp-about__badge { min-width: 0; padding: 12px 16px; border-radius: 14px; }
.svp-about .svp-about__badge-year--text { font-size: 19px; margin-top: 0; }
.svp-about .svp-about__badge-text { padding-top: 4px; font-size: 11.5px; }
/* Badge sits bottom-left so it doesn't cover the student on the right of the lab photo */
.svp-about__media .svp-about__badge { right: auto; left: 2%; bottom: 6%; }
@media (max-width: 575px) { .svp-about__media .svp-about__badge { left: 0; } }

/* ==========================================================================
   STATE RANKER REELS: cover cards + on-page pop-up player
   ========================================================================== */
.svp-reels {
  padding: 90px 0;
  background: var(--svp-white);
  font-family: var(--svp-font-body);
  overflow: hidden;
}
.svp-reels__inner {
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 0 40px;
  display: grid;
  grid-template-columns: minmax(0, .7fr) minmax(0, 2fr);
  gap: 56px;
  align-items: center;
}
.svp-reels .svp-reels__heading {
  margin: 0 0 16px;
  font: 700 clamp(32px, 3.2vw, 46px)/1.12 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-reels .svp-reels__sub {
  margin: 0 0 30px;
  font: 400 16px/1.7 var(--svp-font-body);
  color: var(--svp-muted);
}
.svp-reels__arrows { display: flex; gap: 10px; }
.svp-reels__arrow {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(16,48,31,.2);
  border-radius: 50%;
  background: transparent;
  color: var(--svp-green-900);
  cursor: pointer;
  transition: background-color .25s var(--svp-ease), color .25s var(--svp-ease), border-color .25s var(--svp-ease);
}
.svp-reels__arrow:hover { background: var(--svp-green-900); border-color: var(--svp-green-900); color: var(--svp-white); }
.svp-reels__arrow svg { width: 15px; height: 15px; }

.svp-reels__viewport { min-width: 0; margin-right: -40px; }
.svp-reels__track {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding-left: 2px;
  padding: 6px 40px 26px 2px;
  scrollbar-width: none;
}
.svp-reels__track::-webkit-scrollbar { display: none; }

.svp-reels .svp-reels__card {
  position: relative;
  flex: 0 0 clamp(220px, 22vw, 280px);
  aspect-ratio: 4 / 5;
  padding: 0;
  border: 0;
  border-radius: 16px;
  overflow: hidden;
  background: var(--svp-ivory);
  cursor: pointer;
  scroll-snap-align: start;
  box-shadow: 0 24px 40px -26px rgba(11,32,22,.5);
  transition: transform .35s var(--svp-ease), box-shadow .35s var(--svp-ease);
}
.svp-reels__card:hover { transform: translateY(-4px); box-shadow: 0 30px 50px -26px rgba(11,32,22,.55); }
.svp-reels__card img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Darken the lower part so the caption reads on the poster */
.svp-reels__card::after {
  content: "";
  position: absolute;
  inset: 45% 0 0 0;
  background: linear-gradient(0deg, rgba(11,32,22,.88), rgba(11,32,22,0));
}
.svp-reels__play {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: -29px 0 0 -29px;
  border-radius: 50%;
  background: var(--svp-saffron);
  color: var(--svp-white);
  box-shadow: 0 0 0 8px rgba(232,121,30,.25);
  transition: transform .3s var(--svp-ease), box-shadow .3s var(--svp-ease);
}
.svp-reels__play svg { width: 22px; height: 22px; margin-left: 3px; }
.svp-reels__card:hover .svp-reels__play { transform: scale(1.08); box-shadow: 0 0 0 12px rgba(232,121,30,.22); }
.svp-reels .svp-reels__meta {
  position: absolute;
  z-index: 2;
  left: 16px;
  right: 16px;
  bottom: 14px;
  text-align: left;
}
.svp-reels .svp-reels__name {
  display: block;
  font: 700 16px/1.2 var(--svp-font-body);
  color: var(--svp-white);
}
.svp-reels .svp-reels__rank {
  display: block;
  margin-top: 4px;
  font: 500 12.5px/1.3 var(--svp-font-body);
  color: rgba(255,255,255,.8);
}
.svp-reels__card:focus-visible { outline: 3px solid var(--svp-saffron); outline-offset: 3px; }

/* Pop-up player */
.svp-no-scroll { overflow: hidden; }
.svp-reel-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: grid;
  place-items: center;
  padding: 24px;
  opacity: 0;
  transition: opacity .25s var(--svp-ease);
}
.svp-reel-modal[hidden] { display: none; }
.svp-reel-modal.is-open { opacity: 1; }
.svp-reel-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(6,16,11,.82);
  backdrop-filter: blur(4px);
}
.svp-reel-modal__dialog {
  position: relative;
  width: min(400px, 100%);
  height: min(720px, calc(100vh - 48px));
  border-radius: 16px;
  overflow: hidden;
  background: var(--svp-white);
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.7);
  transform: translateY(16px) scale(.98);
  transition: transform .3s var(--svp-ease);
}
.svp-reel-modal.is-open .svp-reel-modal__dialog { transform: none; }
.svp-reel-modal__frame, .svp-reel-modal__frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.svp-reel-modal__close {
  position: absolute;
  z-index: 2;
  top: 10px;
  right: 10px;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: rgba(0,0,0,.6);
  color: var(--svp-white);
  cursor: pointer;
}
.svp-reel-modal__close svg { width: 18px; height: 18px; }
.svp-reel-modal__close:hover { background: var(--svp-saffron); }

@media (max-width: 1199px) {
  .svp-reels__inner { padding: 0 24px; gap: 36px; }
  .svp-reels__viewport { margin-right: -24px; }
  .svp-reels__track { padding-right: 24px; }
}
@media (max-width: 991px) {
  .svp-reels { padding: 64px 0; }
  .svp-reels__inner { grid-template-columns: 1fr; gap: 24px; }
  .svp-reels .svp-reels__sub { margin-bottom: 20px; }
  .svp-reels__arrows { display: none; }
}
@media (max-width: 575px) {
  .svp-reels__inner { padding: 0 20px; }
  .svp-reels__viewport { margin-right: -20px; }
  .svp-reels .svp-reels__card { flex-basis: 72vw; }
  .svp-reel-modal { padding: 12px; }
  .svp-reel-modal__dialog { height: calc(100vh - 24px); }
}
/* Play button in the caption row (keeps the student's face clear) */
.svp-reels .svp-reels__play {
  top: auto;
  left: auto;
  right: 14px;
  bottom: 14px;
  width: 44px;
  height: 44px;
  margin: 0;
  box-shadow: 0 0 0 6px rgba(232,121,30,.25);
}
.svp-reels .svp-reels__play svg { width: 18px; height: 18px; }
.svp-reels .svp-reels__meta { right: 70px; }
.svp-reels__card::after {
  inset: 58% 0 0 0;
  background: linear-gradient(0deg, rgba(11,32,22,.96) 0%, rgba(11,32,22,.9) 45%, rgba(11,32,22,0) 100%);
}
/* Loading spinner while Instagram's player loads */
.svp-reel-modal__frame { position: relative; background: var(--svp-ivory); }
.svp-reel-modal__frame.is-loading::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 38px;
  height: 38px;
  margin: -19px 0 0 -19px;
  border: 3px solid rgba(232,121,30,.25);
  border-top-color: var(--svp-saffron);
  border-radius: 50%;
  animation: svp-spin .8s linear infinite;
}
.svp-reel-modal__frame.is-loading iframe { opacity: 0; }
.svp-reel-modal__frame iframe { transition: opacity .3s; }
@keyframes svp-spin { to { transform: rotate(360deg); } }

/* ==========================================================================
   WHY PARENTS TRUST US: numbered feature cards
   ========================================================================== */
.svp-trust {
  padding: 96px 0;
  background: #f5f1e9;
  font-family: var(--svp-font-body);
}
.svp-trust__inner {
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 0 40px;
}
.svp-trust__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 48px;
}
.svp-trust .svp-trust__heading {
  max-width: 640px;
  margin: 0;
  font: 700 clamp(32px, 3.3vw, 48px)/1.12 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-trust__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}
.svp-trust__card {
  position: relative;
  padding: 30px 30px 32px;
  border: 1px solid rgba(16,48,31,.1);
  border-radius: 16px;
  background: var(--svp-white);
  overflow: hidden;
  transition: transform .35s var(--svp-ease), box-shadow .35s var(--svp-ease), border-color .35s var(--svp-ease), background-color .35s var(--svp-ease);
}
/* Saffron line that draws across the top on hover */
.svp-trust__card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--svp-saffron);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .45s var(--svp-ease);
}
.svp-trust__card:hover {
  transform: translateY(-4px);
  border-color: transparent;
  background: var(--svp-ivory);
  box-shadow: 0 28px 50px -30px rgba(11,32,22,.35);
}
.svp-trust__card:hover::before { transform: scaleX(1); }
.svp-trust__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 26px;
}
.svp-trust__icon {
  display: block;
  width: 96px;
  height: 96px;
  object-fit: contain;
  flex: 0 0 auto;
}
.svp-trust .svp-trust__num {
  font: 700 26px/1 var(--svp-font-display);
  color: rgba(16,48,31,.18);
  transition: color .35s var(--svp-ease);
}
.svp-trust__card:hover .svp-trust__num { color: var(--svp-saffron); }
.svp-trust .svp-trust__title {
  margin: 0 0 10px;
  font: 700 22px/1.2 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-trust .svp-trust__text {
  margin: 0;
  font: 400 15.5px/1.65 var(--svp-font-body);
  color: var(--svp-muted);
}

@media (max-width: 1199px) {
  .svp-trust__inner { padding: 0 24px; }
  .svp-trust__card { padding: 26px 24px 28px; }
}
@media (max-width: 991px) {
  .svp-trust { padding: 68px 0; }
  .svp-trust__head { flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 32px; }
  .svp-trust__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
  .svp-trust__inner { padding: 0 20px; }
  .svp-trust__grid { grid-template-columns: 1fr; gap: 14px; }
  .svp-trust__top { margin-bottom: 18px; }
}
/* Trust section: centred heading (no button beside it) */
.svp-trust__head { justify-content: center; text-align: center; }
.svp-trust .svp-trust__heading { margin: 0 auto; max-width: 760px; }
@media (max-width: 991px) { .svp-trust__head { align-items: center; } }

/* ==========================================================================
   OUR ACHIEVERS: portrait cards with rank rosette
   ========================================================================== */
.svp-ach {
  padding: 92px 0 84px;
  background: #f5f1e9;
  font-family: var(--svp-font-body);
  overflow: hidden;
}
.svp-ach__inner {
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 0 40px;
}
.svp-ach__head { text-align: center; margin-bottom: 46px; }
.svp-ach .svp-ach__heading {
  margin: 0 0 12px;
  font: 700 clamp(34px, 3.4vw, 50px)/1.1 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-ach .svp-ach__sub { margin: 0; font: 400 16.5px/1.6 var(--svp-font-body); color: var(--svp-muted); }

.svp-ach__track {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: 4px 4px 26px;
  scrollbar-width: none;
}
.svp-ach__track::-webkit-scrollbar { display: none; }

.svp-ach__card {
  flex: 0 0 calc((100% - 72px) / 4);
  scroll-snap-align: start;
  border-radius: 18px;
  overflow: hidden;
  background: var(--svp-white);
  box-shadow: 0 24px 44px -30px rgba(11,32,22,.4);
  transition: transform .35s var(--svp-ease), box-shadow .35s var(--svp-ease);
}
.svp-ach__card:hover { transform: translateY(-5px); box-shadow: 0 32px 54px -30px rgba(11,32,22,.5); }

/* Green band with a fine diagonal pattern that curves behind the portrait */
.svp-ach__media {
  position: relative;
  padding: 26px 0 8px;
  display: flex;
  justify-content: center;
}
.svp-ach__media::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 62%;
  border-radius: 0 0 50% 50% / 0 0 34% 34%;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,.05) 0 2px, transparent 2px 14px),
    linear-gradient(160deg, var(--svp-green-700), var(--svp-green-900));
}
.svp-ach__photo {
  position: relative;
  width: 74%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  padding: 6px;
  background: var(--svp-white);
  box-shadow: 0 0 0 4px var(--svp-saffron), 0 18px 30px -18px rgba(0,0,0,.45);
}
.svp-ach__photo img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  background: radial-gradient(circle at 50% 35%, #fffaf2, #efe6d6);
}

/* Rank rosette */
.svp-ach__rosette {
  position: absolute;
  left: 8%;
  bottom: 2px;
  width: 78px;
  height: 78px;
}
.svp-ach__rosette::before,
.svp-ach__rosette::after {
  content: "";
  position: absolute;
  top: 52px;
  width: 22px;
  height: 36px;
  background: var(--svp-green-700);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 78%, 0 100%);
  z-index: 0;
}
.svp-ach__rosette::before { left: 16px; transform: rotate(14deg); }
.svp-ach__rosette::after { right: 16px; transform: rotate(-14deg); }
.svp-ach__rosette-disc {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 78px;
  height: 78px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #f6c77a, var(--svp-saffron) 60%, var(--svp-saffron-600));
  box-shadow: 0 0 0 3px rgba(255,255,255,.85), 0 10px 18px -8px rgba(0,0,0,.45);
  color: var(--svp-white);
  line-height: 1;
}
.svp-ach .svp-ach__rosette-disc small { font: 700 8.5px/1 var(--svp-font-body); letter-spacing: .14em; text-transform: uppercase; }
.svp-ach .svp-ach__rosette-disc b { margin: 3px 0 2px; font: 700 26px/1 var(--svp-font-display); }
.svp-ach .svp-ach__rosette-disc sup { font-size: .45em; top: -.9em; margin-left: 1px; }

.svp-ach__body { padding: 20px 22px 22px; }
.svp-ach .svp-ach__stream {
  display: block;
  font: 700 11.5px/1 var(--svp-font-body);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--svp-saffron-600);
}
.svp-ach .svp-ach__name {
  margin: 10px 0 14px;
  font: 700 21px/1.2 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-ach__meta {
  display: flex;
  gap: 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(16,48,31,.1);
}
.svp-ach .svp-ach__meta span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font: 600 14px/1 var(--svp-font-body);
  color: var(--svp-ink);
}
.svp-ach__meta svg { width: 16px; height: 16px; color: var(--svp-saffron); }

.svp-ach__nav { display: flex; justify-content: center; gap: 10px; margin-top: 12px; }

@media (max-width: 1199px) {
  .svp-ach__inner { padding: 0 24px; }
  .svp-ach__card { flex-basis: calc((100% - 48px) / 3); }
}
@media (max-width: 991px) {
  .svp-ach { padding: 68px 0 64px; }
  .svp-ach__card { flex-basis: calc((100% - 24px) / 2); }
}
@media (max-width: 575px) {
  .svp-ach__inner { padding: 0 20px; }
  .svp-ach__card { flex-basis: 78%; }
  .svp-ach__head { margin-bottom: 30px; }
}
.svp-ach__body { padding-top: 30px; }

/* ==========================================================================
   COURSE COMBINATIONS: stream list + preview panel
   ========================================================================== */
.svp-courses {
  padding: 96px 0;
  background: var(--svp-white);
  font-family: var(--svp-font-body);
}
.svp-courses__inner { max-width: var(--svp-container); margin: 0 auto; padding: 0 40px; }
.svp-courses__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px;
  align-items: end;
  margin-bottom: 44px;
}
.svp-courses .svp-courses__heading {
  margin: 0;
  font: 700 clamp(34px, 3.4vw, 50px)/1.1 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-courses .svp-courses__sub { margin: 0; font: 400 16px/1.7 var(--svp-font-body); color: var(--svp-muted); }

.svp-courses__body {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.5fr);
  gap: 40px;
  align-items: stretch;
}

/* Stream list */
.svp-courses__tabs { display: flex; flex-direction: column; border-top: 1px solid rgba(16,48,31,.12); }
.svp-courses__tab {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 28px 24px 28px 28px;
  border: 0;
  border-bottom: 1px solid rgba(16,48,31,.12);
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: background-color .3s var(--svp-ease);
}
.svp-courses__tab::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18px;
  bottom: 18px;
  width: 3px;
  border-radius: 3px;
  background: var(--svp-saffron);
  transform: scaleY(0);
  transition: transform .35s var(--svp-ease);
}
.svp-courses__tab.is-active { background: var(--svp-ivory); }
.svp-courses__tab.is-active::before { transform: scaleY(1); }
.svp-courses .svp-courses__tab-name {
  font: 700 26px/1.15 var(--svp-font-display);
  color: rgba(16,48,31,.55);
  transition: color .3s var(--svp-ease);
}
.svp-courses__tab.is-active .svp-courses__tab-name,
.svp-courses__tab:hover .svp-courses__tab-name { color: var(--svp-green-900); }
.svp-courses .svp-courses__tab-codes {
  font: 600 12.5px/1.3 var(--svp-font-body);
  letter-spacing: .08em;
  color: var(--svp-muted);
}
.svp-courses__tab.is-active .svp-courses__tab-codes { color: var(--svp-saffron-600); }
.svp-courses__tab:focus-visible { outline: 2px solid var(--svp-saffron); outline-offset: -2px; }

/* Preview panel */
.svp-courses__panels { position: relative; min-height: 440px; border-radius: 18px; overflow: hidden; }
.svp-courses__panel {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .5s var(--svp-ease), visibility .5s;
}
.svp-courses__panel.is-active { opacity: 1; visibility: visible; }
.svp-courses__photo { width: 100%; height: 100%; object-fit: cover; display: block; }
.svp-courses__card {
  position: absolute;
  left: 24px;
  bottom: 24px;
  max-width: 360px;
  padding: 24px 26px 26px;
  border-radius: 14px;
  background: var(--svp-white);
  box-shadow: 0 24px 50px -24px rgba(0,0,0,.45);
}
.svp-courses .svp-courses__card-title {
  display: block;
  font: 700 22px/1.2 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-courses .svp-courses__card-label {
  display: block;
  margin: 14px 0 10px;
  font: 700 11px/1 var(--svp-font-body);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--svp-muted);
}
.svp-courses__codes { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.svp-courses .svp-courses__codes span {
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--svp-ivory);
  border: 1px solid rgba(232,121,30,.35);
  font: 700 13px/1 var(--svp-font-body);
  letter-spacing: .06em;
  color: var(--svp-green-900);
}
.svp-courses__card .svp-btn { padding: 13px 22px; font-size: 14px; }

@media (max-width: 1199px) { .svp-courses__inner { padding: 0 24px; } }
@media (max-width: 991px) {
  .svp-courses { padding: 68px 0; }
  .svp-courses__head { grid-template-columns: 1fr; gap: 16px; margin-bottom: 28px; }
  /* Phones/tablets: no switching: each stream shows its own photo and card */
  .svp-courses__body { grid-template-columns: 1fr; gap: 0; }
  .svp-courses__tabs { display: none; }
  .svp-courses__panels { min-height: 0; border-radius: 0; overflow: visible; display: grid; gap: 22px; }
  .svp-courses__panel { position: relative; inset: auto; opacity: 1; visibility: visible; border-radius: 16px; overflow: hidden; }
  .svp-courses__photo { height: 240px; }
  .svp-courses__card { position: static; max-width: none; border-radius: 0 0 16px 16px; box-shadow: none; border: 1px solid rgba(16,48,31,.1); border-top: 0; }
}
@media (max-width: 575px) {
  .svp-courses__inner { padding: 0 20px; }
  .svp-courses__photo { height: 190px; }
}

/* ==========================================================================
   NEWS, EVENTS & ANNOUNCEMENTS
   Event cards scroll sideways in one full-width row.
   ========================================================================== */
.svp-news {
  padding: 96px 0;
  background: var(--svp-white);
  font-family: var(--svp-font-body);
}
.svp-news__inner { max-width: var(--svp-container); margin: 0 auto; padding: 0 40px; }
.svp-news__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 32px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(16,48,31,.1);
}
.svp-news__actions { display: flex; align-items: center; gap: 24px; }
.svp-news__arrows { display: flex; gap: 10px; }
.svp-news .svp-news__heading {
  margin: 0;
  font: 700 clamp(32px, 3.3vw, 48px)/1.12 var(--svp-font-display);
  color: var(--svp-green-900);
}

.svp-news .svp-news__all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font: 600 14px/1 var(--svp-font-body);
  color: var(--svp-green-700);
  text-decoration: none;
}
.svp-news__all svg, .svp-news__more svg { width: 16px; height: 16px; transition: transform .35s var(--svp-ease); }
.svp-news .svp-news__all:hover { color: var(--svp-saffron-600); }
.svp-news__all:hover svg { transform: translateX(3px); }

/* Events row */
.svp-news__viewport {
  overflow: hidden;
  outline: none;
}
.svp-news__list { display: flex; margin: 0; padding: 0; list-style: none; will-change: transform; }
.svp-news__list { gap: 24px; }
.svp-news .svp-news__card { list-style: none; }
.svp-news__card { flex: 0 0 300px; margin: 0; }
.svp-news .svp-news__link { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; }
.svp-news__media {
  display: block;
  aspect-ratio: 4 / 3;
  border-radius: 14px;
  overflow: hidden;
  background: #e9e3d7;
}
.svp-news__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--svp-ease); }
.svp-news__link:hover .svp-news__media img { transform: scale(1.05); }
.svp-news .svp-news__meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 18px 0 10px;
  font: 500 13px/1 var(--svp-font-body);
  color: var(--svp-muted);
}
.svp-news .svp-news__cat { font-weight: 700; color: var(--svp-saffron-600); }
.svp-news__cat::after { content: "\00B7"; margin-left: 10px; color: var(--svp-muted); font-weight: 400; }
.svp-news .svp-news__name {
  font: 700 20px/1.3 var(--svp-font-display);
  color: var(--svp-green-900);
  transition: color .3s var(--svp-ease);
}
.svp-news__link:hover .svp-news__name { color: var(--svp-green-700); }
.svp-news .svp-news__more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  padding-top: 14px;
  font: 600 14px/1 var(--svp-font-body);
  color: var(--svp-green-700);
}
.svp-news__link:hover .svp-news__more svg { transform: translateX(3px); }

/* Reduced motion: plain scrollable lists */
.svp-news__viewport.is-static { overflow-x: auto; }

@media (max-width: 1199px) {
  .svp-news__card { flex-basis: 270px; }
}
@media (max-width: 991px) {
  .svp-news { padding: 72px 0; }
  .svp-news__inner { padding: 0 24px; }
}
@media (max-width: 575px) {
  .svp-news { padding: 56px 0; }
  .svp-news__inner { padding: 0 16px; }
  .svp-news__head { flex-wrap: wrap; align-items: center; margin-bottom: 24px; padding-bottom: 16px; }
  .svp-news__actions { width: 100%; justify-content: space-between; }
  .svp-news__card { flex-basis: 250px; }
}

/* ==========================================================================
   NOTICE BOARD: fixed button bottom-left with a small link panel
   ========================================================================== */
#svp-news { scroll-margin-top: 110px; }

.svp-dock {
  position: fixed;
  left: 24px;
  bottom: 24px;
  z-index: 998;
  font-family: var(--svp-font-body);
}
.svp-dock .svp-dock__toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 50px;
  padding: 0 22px 0 18px;
  border: 2px solid rgba(255,255,255,.9);
  border-radius: 999px;
  background: var(--svp-saffron);
  box-shadow: 0 14px 30px -10px rgba(207,101,18,.6), 0 2px 6px rgba(0,0,0,.12);
  font: 700 14.5px/1 var(--svp-font-body);
  color: var(--svp-white);
  cursor: pointer;
  transition: background-color .3s var(--svp-ease), transform .3s var(--svp-ease);
}
.svp-dock .svp-dock__toggle:hover { background: var(--svp-saffron-600); transform: translateY(-2px); }
.svp-dock.is-open .svp-dock__toggle { background: var(--svp-green-900); box-shadow: 0 12px 28px -12px rgba(11,32,22,.55); }
/* Soft ring that pulses out every few seconds to draw the eye (closed state only) */
.svp-dock__toggle::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  box-shadow: 0 0 0 0 rgba(232,121,30,.55);
  animation: svp-dock-pulse 3.2s var(--svp-ease) infinite;
  pointer-events: none;
}
.svp-dock.is-open .svp-dock__toggle::before { animation: none; }
@keyframes svp-dock-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(232,121,30,.55); }
  45%  { box-shadow: 0 0 0 14px rgba(232,121,30,0); }
  100% { box-shadow: 0 0 0 0 rgba(232,121,30,0); }
}
.svp-dock__toggle:focus-visible { outline: 2px solid var(--svp-saffron); outline-offset: 3px; }
.svp-dock__toggle svg { width: 20px; height: 20px; flex: none; }
/* Small saffron dot on the bell */
.svp-dock__toggle::after {
  content: "";
  position: absolute;
  top: 13px;
  left: 31px;
  width: 8px;
  height: 8px;
  border: 2px solid var(--svp-saffron);
  border-radius: 50%;
  background: var(--svp-white);
}
.svp-dock__close { display: none; }
.svp-dock.is-open .svp-dock__toggle::after { display: none; }
.svp-dock.is-open .svp-dock__bell { display: none; }
.svp-dock.is-open .svp-dock__close { display: block; }

.svp-dock__panel {
  position: absolute;
  left: 0;
  bottom: calc(100% + 12px);
  width: 330px;
  max-width: calc(100vw - 32px);
  max-height: calc(100vh - 180px);
  overflow-y: auto;
  padding: 8px;
  border: 1px solid rgba(16,48,31,.08);
  border-radius: 16px;
  background: var(--svp-white);
  box-shadow: 0 24px 48px -20px rgba(11,32,22,.35);
  opacity: 0;
  transform: translateY(8px);
  transform-origin: bottom left;
  transition: opacity .25s var(--svp-ease), transform .25s var(--svp-ease);
}
.svp-dock.is-open .svp-dock__panel { opacity: 1; transform: none; }
.svp-dock .svp-dock__link {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 11px 12px;
  border-radius: 10px;
  font: 600 15px/1.2 var(--svp-font-body);
  color: var(--svp-green-900);
  text-decoration: none;
  transition: background-color .25s var(--svp-ease), color .25s var(--svp-ease);
}
.svp-dock .svp-dock__link + .svp-dock__link { margin-top: 2px; }
.svp-dock .svp-dock__link:hover,
.svp-dock .svp-dock__link:focus-visible { background: var(--svp-ivory); color: var(--svp-saffron-600); outline: none; }
.svp-dock__icon {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  flex: none;
  border-radius: 10px;
  background: rgba(47,122,77,.09);
  color: var(--svp-green-700);
}
.svp-dock__icon svg { width: 18px; height: 18px; }
.svp-dock__link:hover .svp-dock__icon { background: rgba(232,121,30,.12); color: var(--svp-saffron-600); }

/* Latest announcements at the top of the panel */
.svp-dock .svp-dock__heading {
  margin: 0;
  padding: 12px 12px 6px;
  font: 700 18px/1.2 var(--svp-font-display);
  color: var(--svp-green-900);
}
.svp-dock__scroller {
  max-height: 232px;
  margin-bottom: 8px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(16,48,31,.2) transparent;
  outline: none;
}
.svp-dock__scroller.is-looping {
  -webkit-mask-image: linear-gradient(180deg, #000 82%, transparent);
          mask-image: linear-gradient(180deg, #000 82%, transparent);
}
.svp-dock__scroller:focus-visible { outline: 2px solid var(--svp-saffron); outline-offset: -2px; border-radius: 10px; }
.svp-dock__scroller::-webkit-scrollbar { width: 4px; }
.svp-dock__scroller::-webkit-scrollbar-thumb { border-radius: 4px; background: rgba(16,48,31,.2); }
.svp-dock__notices { margin: 0; padding: 0 4px; list-style: none; }
.svp-dock .svp-dock__notice {
  margin: 0;
  padding: 10px 8px;
  list-style: none;
  font: 500 13.5px/1.5 var(--svp-font-body);
  color: var(--svp-ink);
}
.svp-dock .svp-dock__notice + .svp-dock__notice { border-top: 1px solid rgba(16,48,31,.08); }
.svp-dock .svp-dock__notice a { font: inherit; color: inherit; text-decoration: none; }
.svp-dock .svp-dock__notice a:hover { color: var(--svp-green-700); text-decoration: underline; text-underline-offset: 3px; }
.svp-dock .svp-dock__date {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
  font: 700 12px/1 var(--svp-font-body);
  color: var(--svp-green-700);
}
.svp-dock .svp-dock__new {
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--svp-saffron);
  font: 700 10px/1.2 var(--svp-font-body);
  letter-spacing: .04em;
  color: var(--svp-white);
}
.svp-dock__links { padding-top: 6px; border-top: 1px solid rgba(16,48,31,.1); }

/* Phones: sit above the Enquire / Call bar */
@media (max-width: 768px) {
  .svp-dock { left: 16px; bottom: 91px; }
  .svp-dock .svp-dock__toggle { height: 46px; padding: 0 18px 0 15px; font-size: 14px; }
  .svp-dock__toggle::after { top: 11px; left: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .svp-dock__panel, .svp-dock__toggle { transition: none; }
  .svp-dock__toggle::before { animation: none; }
}

/* ==========================================================================
   STUDENTS CORNER: yearly programmes, title-only photo cards on deep green
   ========================================================================== */
#students-corner { scroll-margin-top: 90px; }
.svp-corner {
  padding: 96px 0 104px;
  background: var(--svp-green-900);
  font-family: var(--svp-font-body);
}
.svp-corner__inner { max-width: var(--svp-container); margin: 0 auto; padding: 0 40px; }
.svp-corner .svp-corner__heading {
  margin: 0 0 52px;
  text-align: center;
  font: 700 clamp(32px, 3.3vw, 48px)/1.12 var(--svp-font-display);
  color: var(--svp-white);
}
.svp-corner .svp-corner__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.svp-corner .svp-corner__card { margin: 0; list-style: none; }
.svp-corner .svp-corner__link {
  position: relative;
  display: flex;
  align-items: flex-end;
  aspect-ratio: 4 / 3.25;
  padding: 28px 30px;
  border-radius: 18px;
  overflow: hidden;
  isolation: isolate;
  background: var(--svp-green-950);
  text-decoration: none;
  box-shadow: 0 24px 44px -28px rgba(0,0,0,.6);
}
.svp-corner__link img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
  transition: transform 1.1s var(--svp-ease);
}
/* Soft shade at the foot only, so the photo stays the hero */
.svp-corner__link::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(11,32,22,0) 50%, rgba(11,32,22,.78) 100%);
  transition: background-color .5s var(--svp-ease);
}
/* Thin inset frame that draws in on hover */
.svp-corner__link::after {
  content: "";
  position: absolute;
  inset: 14px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 12px;
  opacity: 0;
  transform: scale(1.03);
  transition: opacity .5s var(--svp-ease), transform .5s var(--svp-ease);
  pointer-events: none;
}
.svp-corner .svp-corner__title {
  font: 700 26px/1.15 var(--svp-font-display);
  color: var(--svp-white);
  transition: transform .5s var(--svp-ease);
}
.svp-corner__go {
  position: absolute;
  top: 26px;
  right: 26px;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--svp-white);
  color: var(--svp-green-900);
  opacity: 0;
  transform: translate(-6px, 6px) scale(.85);
  transition: opacity .45s var(--svp-ease), transform .45s var(--svp-ease), background-color .3s var(--svp-ease), color .3s var(--svp-ease);
}
.svp-corner__go svg { width: 20px; height: 20px; }

.svp-corner__link:hover img, .svp-corner__link:focus-visible img { transform: scale(1.06); }
.svp-corner__link:hover::before, .svp-corner__link:focus-visible::before { background-color: rgba(11,32,22,.18); }
.svp-corner__link:hover::after, .svp-corner__link:focus-visible::after { opacity: 1; transform: none; }
.svp-corner__link:hover .svp-corner__title, .svp-corner__link:focus-visible .svp-corner__title { transform: translateY(-4px); }
.svp-corner__link:hover .svp-corner__go, .svp-corner__link:focus-visible .svp-corner__go { opacity: 1; transform: none; }
.svp-corner__link:hover .svp-corner__go { background: var(--svp-saffron); color: var(--svp-white); }
.svp-corner__link:focus-visible { outline: 2px solid var(--svp-saffron); outline-offset: 3px; }
.svp-corner__more { display: flex; justify-content: center; margin-top: 48px; }

@media (max-width: 991px) {
  .svp-corner { padding: 72px 0 80px; }
  .svp-corner__inner { padding: 0 24px; }
  .svp-corner .svp-corner__heading { margin-bottom: 36px; }
  .svp-corner__more { margin-top: 36px; }
  .svp-corner .svp-corner__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  /* No hover on touch screens: keep the arrow visible */
  .svp-corner__go { opacity: 1; transform: none; width: 40px; height: 40px; top: 18px; right: 18px; }
}
@media (max-width: 575px) {
  .svp-corner { padding: 56px 0 64px; }
  .svp-corner__inner { padding: 0 16px; }
  .svp-corner .svp-corner__grid { grid-template-columns: minmax(0, 1fr); }
  .svp-corner .svp-corner__link { padding: 22px 24px; }
  .svp-corner .svp-corner__title { font-size: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .svp-corner__link img, .svp-corner__link::after, .svp-corner__title, .svp-corner__go { transition: none; }
}

/* ==========================================================================
   INNER PAGES (About, Admissions): banner, section links, and small
   additions to the homepage components (svp-about, svp-trust) they reuse
   ========================================================================== */
.svp-pagehero {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: clamp(360px, 46vh, 460px);
  padding: 150px 0 64px;
  background-color: var(--svp-green-950);
  background-size: cover;
  background-position: center 45%;
  isolation: isolate;
}
.svp-pagehero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(11,32,22,.78) 0%, rgba(11,32,22,.5) 55%, rgba(11,32,22,.35) 100%);
}
.svp-pagehero__inner { width: 100%; max-width: var(--svp-container); margin: 0 auto; padding: 0 40px; }
.svp-pagehero .svp-pagehero__title {
  margin: 0;
  font: 700 clamp(42px, 4.4vw, 66px)/1.12 var(--svp-font-display);
  color: var(--svp-white);
}

/* Links to the other pages in the section */
.svp-subnav { background: var(--svp-white); border-bottom: 1px solid rgba(16,48,31,.1); font-family: var(--svp-font-body); }
.svp-subnav .svp-subnav__list {
  display: flex;
  gap: 40px;
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 0 40px;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
}
.svp-subnav__list::-webkit-scrollbar { display: none; }
.svp-subnav li { margin: 0; list-style: none; flex: none; }
.svp-subnav a {
  position: relative;
  display: block;
  padding: 22px 0 20px;
  font: 600 15px/1.2 var(--svp-font-body);
  color: var(--svp-muted);
  text-decoration: none;
  white-space: nowrap;
  transition: color .3s var(--svp-ease);
}
.svp-subnav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: var(--svp-saffron);
  transform: scaleX(0);
  transition: transform .35s var(--svp-ease);
}
.svp-subnav a:hover, .svp-subnav a.is-current { color: var(--svp-green-900); }
.svp-subnav a.is-current::after, .svp-subnav a:hover::after { transform: scaleX(1); }

/* svp-about additions: image on the right, portrait photos, role line, extra links */
.svp-about--flip .svp-about__media { order: 2; }
.svp-about--tint { background: #f5f1e9; }
.svp-about--tint .svp-about__blob-bg { background: var(--svp-white); }
.svp-about__portrait { position: relative; z-index: 1; width: min(420px, 100%); margin: 0 auto; }
.svp-about__portrait img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 24px; box-shadow: 0 40px 70px -40px rgba(11,32,22,.5); }
.svp-about__portrait::before {
  content: "";
  position: absolute;
  inset: 22px -22px -22px 22px;
  z-index: -1;
  border-radius: 24px;
  border: 1px solid rgba(232,121,30,.3);
  background: var(--svp-ivory);
}
.svp-about .svp-about__role { margin: -16px 0 26px; font: 600 15px/1.5 var(--svp-font-body); color: var(--svp-saffron-600); }
.svp-about__footer { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; }
.svp-about .svp-about__textlink { font: 600 15px/1.4 var(--svp-font-body); color: var(--svp-green-700); text-decoration: underline; text-decoration-color: rgba(47,122,77,.35); text-underline-offset: 4px; }
.svp-about .svp-about__textlink:hover { color: var(--svp-saffron-600); text-decoration-color: currentColor; }

/* svp-trust additions: white background, 2 or 4 columns, small labels, lists, a dark card */
.svp-trust--white { background: var(--svp-white); }
.svp-trust--white .svp-trust__card { background: var(--svp-white); }
.svp-trust--white .svp-trust__card:hover { background: var(--svp-ivory); }
.svp-trust__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.svp-trust__grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.svp-trust .svp-trust__sub { max-width: 620px; margin: 14px auto 0; font: 400 16.5px/1.7 var(--svp-font-body); color: var(--svp-muted); }
.svp-trust__head--stack { flex-direction: column; align-items: center; gap: 0; }
.svp-trust .svp-trust__label { display: block; margin-bottom: 14px; font: 700 13px/1 var(--svp-font-body); color: var(--svp-saffron-600); }
.svp-trust .svp-trust__list { margin: 0; padding: 0; list-style: none; }
.svp-trust .svp-trust__list li { position: relative; margin: 0 0 10px; padding-left: 20px; list-style: none; font: 400 15.5px/1.6 var(--svp-font-body); color: var(--svp-muted); }
.svp-trust .svp-trust__list li:last-child { margin-bottom: 0; }
.svp-trust__list li::before { content: ""; position: absolute; left: 2px; top: .66em; width: 6px; height: 6px; border-radius: 50%; background: var(--svp-saffron); }
.svp-trust .svp-trust__card--dark { background: var(--svp-green-900); border-color: var(--svp-green-900); }
.svp-trust .svp-trust__card--dark:hover { background: var(--svp-green-900); }
.svp-trust .svp-trust__card--dark .svp-trust__title { color: var(--svp-white); }
.svp-trust .svp-trust__card--dark .svp-trust__text,
.svp-trust .svp-trust__card--dark .svp-trust__list li { color: rgba(255,255,255,.78); }
.svp-trust .svp-trust__card a:not(.svp-btn) { color: var(--svp-green-700); font-weight: 600; text-underline-offset: 3px; }
.svp-trust .svp-trust__more { display: flex; justify-content: center; margin-top: 44px; }

/* Documents list: heading left, two-column list right */
.svp-docs { padding: 96px 0; background: var(--svp-white); font-family: var(--svp-font-body); }
.svp-docs__inner { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: 64px; max-width: var(--svp-container); margin: 0 auto; padding: 0 40px; }
.svp-docs .svp-docs__heading { margin: 0; font: 700 clamp(32px, 3.3vw, 48px)/1.12 var(--svp-font-display); color: var(--svp-green-900); }
.svp-docs .svp-docs__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; margin: 0; padding: 0; list-style: none; }
.svp-docs .svp-docs__list li { margin: 0; padding: 18px 0; border-top: 1px solid rgba(16,48,31,.12); list-style: none; font: 500 16px/1.55 var(--svp-font-body); color: var(--svp-ink); }

/* Five-fold education (Who We Are) */
.svp-five { padding: 104px 0; background: var(--svp-white); font-family: var(--svp-font-body); text-align: center; }
.svp-five__inner { max-width: var(--svp-container); margin: 0 auto; padding: 0 40px; }
.svp-five .svp-five__heading { margin: 0 0 56px; font: 700 clamp(32px, 3.3vw, 48px)/1.12 var(--svp-font-display); color: var(--svp-green-900); }
.svp-five .svp-five__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 28px; margin: 0; padding: 0; list-style: none; }
.svp-five__grid li { margin: 0; list-style: none; }
.svp-five__grid img { width: 100%; max-width: 190px; aspect-ratio: 1; margin: 0 auto 22px; border-radius: 50%; box-shadow: 0 0 0 6px var(--svp-white), 0 0 0 7px rgba(232,121,30,.35); transition: transform .5s var(--svp-ease); }
.svp-five__grid li:hover img { transform: scale(1.04); }
.svp-five .svp-five__grid h3 { margin: 0 0 6px; font: 700 22px/1.2 var(--svp-font-display); color: var(--svp-green-900); }
.svp-five .svp-five__grid p { margin: 0; font: 400 15px/1.5 var(--svp-font-body); color: var(--svp-muted); }

/* Quote band */
.svp-quote { padding: 96px 0; background: var(--svp-green-900); font-family: var(--svp-font-body); }
.svp-quote__inner { max-width: 920px; margin: 0 auto; padding: 0 40px; text-align: center; }
.svp-quote blockquote { margin: 0; padding: 0; border: 0; font: 700 clamp(28px, 3vw, 42px)/1.3 var(--svp-font-display); color: var(--svp-white); }
.svp-quote figcaption { margin-top: 22px; font: 600 15px/1.5 var(--svp-font-body); color: var(--svp-gold); }

/* Leadership: management grid */
.svp-team__card img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; margin-bottom: 22px; border-radius: 12px; }
.svp-trust .svp-team__card { padding: 16px 16px 26px; text-align: center; }
.svp-trust .svp-team__card a { display: block; text-decoration: none; }
.svp-trust .svp-team__card .svp-trust__title { margin-bottom: 6px; }
.svp-trust .svp-team__role { margin: 0; font: 600 14px/1.4 var(--svp-font-body); color: var(--svp-saffron-600); }

@media (max-width: 1199px) {
  .svp-trust__grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .svp-five .svp-five__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 40px; }
}
@media (max-width: 991px) {
  .svp-pagehero { min-height: 320px; padding: 130px 0 48px; }
  .svp-pagehero__inner, .svp-subnav .svp-subnav__list, .svp-docs__inner, .svp-five__inner, .svp-quote__inner { padding-left: 24px; padding-right: 24px; }
  .svp-subnav .svp-subnav__list { gap: 28px; }
  .svp-about--flip .svp-about__media { order: 0; }
  .svp-trust__grid--2 { grid-template-columns: minmax(0, 1fr); }
  .svp-docs, .svp-five, .svp-quote { padding: 72px 0; }
  .svp-docs__inner { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .svp-about__portrait { width: min(360px, 86%); }
}
@media (max-width: 575px) {
  .svp-pagehero { min-height: 280px; padding: 110px 0 40px; }
  .svp-pagehero__inner, .svp-subnav .svp-subnav__list, .svp-docs__inner, .svp-five__inner, .svp-quote__inner { padding-left: 16px; padding-right: 16px; }
  .svp-subnav a { padding: 18px 0 16px; font-size: 14.5px; }
  .svp-trust__grid--4 { grid-template-columns: minmax(0, 1fr); }
  .svp-docs .svp-docs__list { grid-template-columns: minmax(0, 1fr); }
  .svp-five .svp-five__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 16px; }
  .svp-about__portrait::before { inset: 16px -12px -12px 16px; }
}
.svp-docs--tint { background: #f5f1e9; }

/* Facilities page additions */
.svp-anchor { scroll-margin-top: 90px; }
.svp-courses .svp-courses__card-text { margin: 0 0 16px; font: 400 15px/1.6 var(--svp-font-body); color: var(--svp-muted); }
.svp-courses__card-text:last-child { margin-bottom: 0; }
.svp-about--follow { padding-top: 0; }
.svp-about .svp-about__list { margin: 8px 0 0; padding: 0; list-style: none; }
.svp-about .svp-about__list li { position: relative; margin: 0; padding: 14px 0 14px 22px; border-top: 1px solid rgba(16,48,31,.1); list-style: none; font: 400 16px/1.6 var(--svp-font-body); color: var(--svp-muted); }
.svp-about .svp-about__list li::before { content: ""; position: absolute; left: 2px; top: 1.45em; width: 7px; height: 7px; border-radius: 50%; background: var(--svp-saffron); }
.svp-about .svp-about__list strong { font-weight: 700; color: var(--svp-green-900); }
.svp-corner .svp-corner__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.svp-corner__grid--2 .svp-corner__link { aspect-ratio: 16 / 10; cursor: default; }
.svp-corner .svp-corner__note { max-width: 680px; margin: 40px auto 0; text-align: center; font: 400 16.5px/1.7 var(--svp-font-body); color: rgba(255,255,255,.78); }
@media (max-width: 575px) {
  .svp-corner .svp-corner__grid--2 { grid-template-columns: minmax(0, 1fr); }
}

/* ==========================================================================
   FACILITIES: sticky index of every facility + one stream of large photos
   ========================================================================== */
.svp-fac { padding: 96px 0 110px; background: var(--svp-white); font-family: var(--svp-font-body); }
.svp-fac__inner {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 72px;
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 0 40px;
  align-items: start;
}

/* Index */
.svp-fac__index { position: sticky; top: 110px; }
.svp-fac__index ul { margin: 0; padding: 0; list-style: none; border-left: 1px solid rgba(16,48,31,.12); }
.svp-fac__index li { margin: 0; list-style: none; }
.svp-fac__index a {
  position: relative;
  display: block;
  padding: 10px 0 10px 22px;
  font: 700 19px/1.25 var(--svp-font-display);
  color: rgba(16,48,31,.42);
  text-decoration: none;
  transition: color .3s var(--svp-ease);
}
.svp-fac__index a::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 3px;
  background: var(--svp-saffron);
  transform: scaleY(0);
  transition: transform .35s var(--svp-ease);
}
.svp-fac__index a:hover { color: var(--svp-green-900); }
.svp-fac__index a.is-active { color: var(--svp-green-900); }
.svp-fac__index a.is-active::before { transform: scaleY(1); }

/* Facilities */
.svp-fac__list { display: grid; gap: 88px; }
.svp-fac__item { scroll-margin-top: 110px; }
.svp-fac__photo { margin: 0; aspect-ratio: 16 / 9; border-radius: 20px; overflow: hidden; background: #efe9dd; }
.svp-fac__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--svp-ease); }
.svp-fac__item:hover .svp-fac__photo img { transform: scale(1.03); }
.svp-fac__text {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 40px;
  align-items: baseline;
  padding-top: 26px;
}
.svp-fac .svp-fac__name { margin: 0; font: 700 clamp(28px, 2.6vw, 38px)/1.15 var(--svp-font-display); color: var(--svp-green-900); }
.svp-fac .svp-fac__desc { margin: 0; font: 400 17px/1.75 var(--svp-font-body); color: var(--svp-muted); }

@media (max-width: 991px) {
  .svp-fac { padding: 0 0 80px; }
  .svp-fac__inner { grid-template-columns: minmax(0, 1fr); gap: 36px; padding: 0 24px; }
  /* Index becomes a sticky, sideways-scrolling row of names under the header */
  .svp-fac__index { top: 63px; z-index: 5; margin: 0 -24px; padding: 0 24px; background: var(--svp-white); border-bottom: 1px solid rgba(16,48,31,.1); }
  .svp-fac__index ul { display: flex; gap: 26px; border-left: 0; overflow-x: auto; scrollbar-width: none; }
  .svp-fac__index ul::-webkit-scrollbar { display: none; }
  .svp-fac__index li { flex: none; }
  .svp-fac__index a { padding: 18px 0 16px; font: 600 14.5px/1.2 var(--svp-font-body); white-space: nowrap; color: var(--svp-muted); }
  .svp-fac__index a::before { left: 0; right: 0; top: auto; bottom: -1px; width: auto; height: 2px; transform: scaleX(0); }
  .svp-fac__index a.is-active::before { transform: scaleX(1); }
  .svp-fac__list { gap: 56px; }
  .svp-fac__item { scroll-margin-top: 136px; }
  .svp-fac__text { grid-template-columns: minmax(0, 1fr); gap: 10px; padding-top: 20px; }
}
@media (max-width: 575px) {
  .svp-fac__inner { padding: 0 16px; }
  .svp-fac__index { margin: 0 -16px; padding: 0 16px; }
  .svp-fac__photo { aspect-ratio: 4 / 3; border-radius: 16px; }
}
/* The theme wrapper uses overflow:hidden, which stops position:sticky working inside it.
   overflow:clip trims the same overflow without creating a scroll container. */
#wrapper_full.content_all_warpper, #page.page_wapper { overflow: clip; }
/* Same for <body>: the theme's overflow-x:hidden turns it into a scroll box that never scrolls */
html body { overflow-x: clip; overflow-y: visible; }
.svp-fac .svp-fac__name .svp-fac__note { display: block; margin-top: 6px; font: 600 15px/1.4 var(--svp-font-body); color: var(--svp-saffron-600); }
.svp-fac__index .svp-fac__note { font: inherit; }

/* ==========================================================================
   SAT page: terms line and past results table
   ========================================================================== */
.svp-about .svp-sat__terms { margin: 18px 0 0; font: 400 13px/1.5 var(--svp-font-body); color: var(--svp-muted); }
.svp-results { padding: 96px 0 104px; background: #f5f1e9; font-family: var(--svp-font-body); }
.svp-results__inner { max-width: 1040px; margin: 0 auto; padding: 0 40px; }
.svp-results .svp-results__heading { margin: 0 0 36px; text-align: center; font: 700 clamp(32px, 3.3vw, 48px)/1.12 var(--svp-font-display); color: var(--svp-green-900); }
.svp-results__wrap { overflow-x: auto; border-radius: 16px; background: var(--svp-white); border: 1px solid rgba(16,48,31,.1); }
.svp-results .svp-results__table { width: 100%; margin: 0; border-collapse: collapse; font: 400 15px/1.5 var(--svp-font-body); }
.svp-results__table th, .svp-results__table td { padding: 14px 20px; border: 0; border-bottom: 1px solid rgba(16,48,31,.08); text-align: left; color: var(--svp-ink); }
.svp-results__table thead th { font: 600 13px/1.3 var(--svp-font-body); color: var(--svp-muted); background: var(--svp-white); }
.svp-results__table td:first-child, .svp-results__table th:first-child { width: 72px; text-align: center; color: var(--svp-muted); }
.svp-results__table td:nth-child(2) { font-weight: 600; color: var(--svp-green-900); }
.svp-results .svp-results__group th { padding: 12px 20px; background: var(--svp-ivory); font: 700 18px/1.3 var(--svp-font-display); color: var(--svp-saffron-600); text-align: left; }
.svp-results__table tbody tr:last-child td { border-bottom: 0; }
.svp-results__older { margin-top: 28px; }
.svp-results__older summary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 22px;
  border: 1px solid rgba(16,48,31,.18);
  border-radius: 999px;
  font: 600 15px/1 var(--svp-font-body);
  color: var(--svp-green-900);
  cursor: pointer;
  list-style: none;
}
.svp-results__older summary::-webkit-details-marker { display: none; }
.svp-results__older summary::after { content: "+"; font-size: 18px; line-height: 1; color: var(--svp-saffron-600); }
.svp-results__older[open] summary::after { content: "\2212"; }
.svp-results__older summary:hover { border-color: var(--svp-green-700); background: var(--svp-white); }
.svp-results .svp-results__links { margin: 22px 0 8px; font: 600 15px/1.5 var(--svp-font-body); }
.svp-results__links a { color: var(--svp-green-700); text-underline-offset: 3px; }
.svp-results .svp-results__sub { margin: 24px 0 16px; font: 700 24px/1.2 var(--svp-font-display); color: var(--svp-green-900); }
@media (max-width: 991px) {
  .svp-results { padding: 72px 0 80px; }
  .svp-results__inner { padding: 0 24px; }
}
@media (max-width: 575px) {
  .svp-results__inner { padding: 0 16px; }
  .svp-results__table th, .svp-results__table td { padding: 12px 14px; }
  .svp-results__table td:first-child, .svp-results__table th:first-child { width: 48px; }
}

/* ==========================================================================
   STUDENTS CORNER pages: overview spacing and programme photo gallery
   ========================================================================== */
.svp-corner--page { padding-top: 88px; }
.svp-gallery { padding: 96px 0 104px; background: #f5f1e9; font-family: var(--svp-font-body); }
.svp-gallery__inner { max-width: var(--svp-container); margin: 0 auto; padding: 0 40px; }
.svp-gallery .svp-gallery__heading { margin: 0 0 44px; text-align: center; font: 700 clamp(32px, 3.3vw, 48px)/1.12 var(--svp-font-display); color: var(--svp-green-900); }
.svp-gallery .svp-gallery__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 0; padding: 0; list-style: none; }
.svp-gallery__grid li { margin: 0; list-style: none; }
.svp-gallery__grid a { display: block; height: 100%; border-radius: 16px; overflow: hidden; background: #e9e3d7; }
.svp-gallery__grid img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .9s var(--svp-ease); }
.svp-gallery__grid a:hover img { transform: scale(1.05); }
.svp-gallery .svp-gallery__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Five photos: the first one tall on the left, four in a square on the right */
.svp-gallery__grid--5 li:first-child { grid-row: span 2; }
.svp-gallery__grid--5 li:first-child img { aspect-ratio: auto; }
@media (max-width: 991px) {
  .svp-gallery { padding: 72px 0 80px; }
  .svp-gallery__inner { padding: 0 24px; }
  .svp-gallery .svp-gallery__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .svp-gallery__grid--5 li:first-child { grid-row: auto; grid-column: span 2; }
  .svp-gallery__grid--5 li:first-child img { aspect-ratio: 16 / 9; }
  .svp-corner--page { padding-top: 64px; }
}
@media (max-width: 575px) {
  .svp-gallery__inner { padding: 0 16px; }
  .svp-gallery .svp-gallery__grid { grid-template-columns: minmax(0, 1fr); }
  .svp-gallery__grid--5 li:first-child { grid-column: auto; }
}

/* ==========================================================================
   FOOTER: light band with five columns, slim green bar underneath
   ========================================================================== */
.svp-footer { background: #f5f1e9; font-family: var(--svp-font-body); border-top: 1px solid rgba(16,48,31,.08); }
.svp-footer__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, .8fr)) minmax(0, 1.15fr);
  gap: 48px;
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 80px 40px 64px;
}
.svp-footer__logo { display: inline-block; }
.svp-footer__logo img { display: block; height: 64px; width: auto; }
.svp-footer .svp-footer__about { max-width: 320px; margin: 22px 0 24px; font: 400 15px/1.7 var(--svp-font-body); color: var(--svp-muted); }
.svp-footer .svp-footer__social { display: flex; gap: 10px; margin: 0; padding: 0; list-style: none; }
.svp-footer__social li { margin: 0; list-style: none; }
.svp-footer .svp-footer__social a {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(16,48,31,.18);
  border-radius: 50%;
  color: var(--svp-green-900);
  transition: background-color .3s var(--svp-ease), border-color .3s var(--svp-ease), color .3s var(--svp-ease);
}
.svp-footer__social svg { width: 18px; height: 18px; }
.svp-footer .svp-footer__social a:hover { background: var(--svp-green-900); border-color: var(--svp-green-900); color: var(--svp-white); }

.svp-footer .svp-footer__title { margin: 6px 0 20px; font: 700 20px/1.2 var(--svp-font-display); color: var(--svp-green-900); }
.svp-footer__col ul { margin: 0; padding: 0; list-style: none; }
.svp-footer__col li { margin: 0 0 12px; list-style: none; }
.svp-footer .svp-footer__col a {
  font: 500 15px/1.45 var(--svp-font-body);
  color: var(--svp-muted);
  text-decoration: none;
  background: linear-gradient(var(--svp-saffron), var(--svp-saffron)) 0 100% / 0 1px no-repeat;
  transition: color .3s var(--svp-ease), background-size .35s var(--svp-ease);
}
.svp-footer .svp-footer__col a:hover { color: var(--svp-green-900); background-size: 100% 1px; }
.svp-footer address { margin: 0 0 16px; font: 400 15px/1.7 var(--svp-font-body); font-style: normal; color: var(--svp-muted); }
.svp-footer .svp-footer__visit .svp-footer__line { display: table; margin-bottom: 8px; font-weight: 600; color: var(--svp-green-900); }
.svp-footer .svp-footer__visit .svp-footer__directions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  font-weight: 700;
  color: var(--svp-saffron-600);
  background: none;
}
.svp-footer__directions svg { width: 14px; height: 14px; transition: transform .3s var(--svp-ease); }
.svp-footer .svp-footer__visit .svp-footer__directions:hover { color: var(--svp-saffron-600); }
.svp-footer__directions:hover svg { transform: translateX(3px); }

.svp-footer__bar { background: var(--svp-green-950); }
.svp-footer__bar-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 40px;
  max-width: var(--svp-container);
  margin: 0 auto;
  padding: 18px 40px;
  text-align: center;
}
.svp-footer .svp-footer__bar p { margin: 0; font: 400 13.5px/1.5 var(--svp-font-body); color: rgba(255,255,255,.7); }
.svp-footer .svp-footer__bar a { color: var(--svp-white); text-decoration: none; }
.svp-footer .svp-footer__bar a:hover { color: var(--svp-gold); }

@media (max-width: 1199px) {
  .svp-footer__inner { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 32px; }
  .svp-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  .svp-footer__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 56px 24px 44px; }
  .svp-footer__visit { grid-column: 1 / -1; }
  .svp-footer__bar-inner { padding: 16px 24px 84px; flex-direction: column; }
}
@media (max-width: 575px) {
  .svp-footer__inner { padding: 48px 16px 40px; }
  .svp-footer__bar-inner { padding-left: 16px; padding-right: 16px; }
}
/* The theme forces paragraphs to 14px on small screens; keep the footer sizes */
.svp-footer p.svp-footer__title { font-size: 20px !important; }
.svp-footer p.svp-footer__about { font-size: 15px !important; }
.svp-footer .svp-footer__bar p { font-size: 13.5px !important; }
/* Stronger footer text for readability */
.svp-footer .svp-footer__col a { font-weight: 600; color: #2b332e; }
.svp-footer .svp-footer__col a:hover { color: var(--svp-green-700); }
.svp-footer p.svp-footer__about, .svp-footer address { color: #3a413c; font-weight: 500; }
.svp-footer .svp-footer__visit .svp-footer__line { font-weight: 700; color: var(--svp-green-900); }
.svp-footer .svp-footer__bar p { color: rgba(255,255,255,.9); font-weight: 500; }

/* Reel card (Students Corner programme pages) */
.svp-reelcard {
  position: relative;
  display: block;
  width: min(320px, 78%);
  aspect-ratio: 9 / 16;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 22px;
  overflow: hidden;
  background: var(--svp-green-950);
  cursor: pointer;
  box-shadow: 0 40px 70px -36px rgba(11,32,22,.6);
}
.svp-reelcard img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--svp-ease); }
.svp-reelcard::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,32,22,0) 55%, rgba(11,32,22,.55)); }
.svp-reelcard__play {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  margin: -36px 0 0 -36px;
  border-radius: 50%;
  background: var(--svp-saffron);
  color: var(--svp-white);
  box-shadow: 0 0 0 10px rgba(232,121,30,.25);
  transition: transform .35s var(--svp-ease), box-shadow .35s var(--svp-ease);
}
.svp-reelcard__play svg { width: 26px; height: 26px; margin-left: 4px; }
.svp-reelcard:hover img { transform: scale(1.04); }
.svp-reelcard:hover .svp-reelcard__play { transform: scale(1.08); box-shadow: 0 0 0 14px rgba(232,121,30,.22); }
.svp-reelcard:focus-visible { outline: 3px solid var(--svp-saffron); outline-offset: 4px; }

/* Footer social icons in their brand colours */
.svp-footer .svp-footer__social a { border: 0; color: #fff; }
.svp-footer .svp-footer__social a[aria-label="Facebook"] { background: #1877f2; }
.svp-footer .svp-footer__social a[aria-label="Instagram"] { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.svp-footer .svp-footer__social a[aria-label="YouTube"] { background: #ff0000; }
.svp-footer .svp-footer__social a:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 10px 18px -8px rgba(0,0,0,.35); }
.svp-footer .svp-footer__social a[aria-label="Facebook"]:hover { background: #1877f2; }
.svp-footer .svp-footer__social a[aria-label="Instagram"]:hover { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.svp-footer .svp-footer__social a[aria-label="YouTube"]:hover { background: #ff0000; }
.svp-footer .svp-footer__social a { transition: transform .3s var(--svp-ease), box-shadow .3s var(--svp-ease); }

/* ==========================================================================
   MOBILE / TABLET HEADER (< 992px): bar + full-screen menu
   ========================================================================== */
.svp-legacy-header { display: none !important; }
.svp-mhead { position: relative; z-index: 1000; font-family: var(--svp-font-body); }
.svp-mhead a { text-decoration: none; }
.svp-mhead__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  height: 68px;
  padding: 0 20px;
  background: var(--svp-white);
  border-bottom: 1px solid rgba(16,48,31,.08);
}
.svp-mhead.is-stuck .svp-mhead__bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  box-shadow: 0 10px 30px -18px rgba(11,32,22,.35);
  animation: svp-mhead-in .35s var(--svp-ease);
}
@keyframes svp-mhead-in { from { transform: translateY(-100%); } to { transform: none; } }
.svp-mhead__logo img { display: block; height: 44px; width: auto; }
.svp-mhead__actions { display: flex; align-items: center; gap: 10px; }
.svp-mhead__call {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(232,121,30,.12);
  color: var(--svp-saffron-600);
}
.svp-mhead__call svg { width: 20px; height: 20px; }
.svp-mhead .svp-mhead__toggle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 0 11px;
  border: 0;
  border-radius: 50%;
  background: var(--svp-green-900);
  cursor: pointer;
}
.svp-mhead__toggle span { display: block; height: 2px; border-radius: 2px; background: var(--svp-white); }
.svp-mhead__toggle span:nth-child(2) { width: 70%; margin-left: auto; }

/* Full-screen menu */
.svp-mnav {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  flex-direction: column;
  background: var(--svp-white);
  opacity: 0;
  transform: translateY(-12px);
  transition: opacity .3s var(--svp-ease), transform .3s var(--svp-ease);
}
.svp-mnav[hidden] { display: none; }
.svp-mnav.is-open { opacity: 1; transform: none; }
.svp-mnav__top { display: flex; align-items: center; justify-content: space-between; height: 68px; padding: 0 20px; border-bottom: 1px solid rgba(16,48,31,.08); flex: none; }
.svp-mnav .svp-mnav__close {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(16,48,31,.15);
  border-radius: 50%;
  background: var(--svp-white);
  color: var(--svp-green-900);
  cursor: pointer;
}
.svp-mnav__close svg { width: 20px; height: 20px; }
.svp-mnav__body { flex: 1 1 auto; overflow-y: auto; padding: 8px 20px 24px; overscroll-behavior: contain; }
.svp-mnav .svp-mnav__list { margin: 0; padding: 0; list-style: none; }
.svp-mnav__item { margin: 0; list-style: none; border-bottom: 1px solid rgba(16,48,31,.08); }
.svp-mnav .svp-mnav__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 16px 0;
  border: 0;
  background: none;
  font: 700 24px/1.2 var(--svp-font-display);
  color: var(--svp-green-900);
  text-align: left;
  cursor: pointer;
}
.svp-mnav__link svg { width: 16px; height: 16px; color: var(--svp-saffron-600); transition: transform .3s var(--svp-ease); }
.svp-mnav__item.is-open .svp-mnav__link svg { transform: rotate(180deg); }
.svp-mnav__item.is-current > .svp-mnav__link { color: var(--svp-saffron-600); }
.svp-mnav .svp-mnav__subs { display: none; margin: 0 0 14px; padding: 0 0 0 14px; list-style: none; border-left: 2px solid rgba(232,121,30,.35); }
.svp-mnav__item.is-open .svp-mnav__subs { display: block; }
.svp-mnav__subs li { margin: 0; list-style: none; }
.svp-mnav .svp-mnav__subs a { display: block; padding: 9px 0; font: 600 16px/1.35 var(--svp-font-body); color: #3a413c; }
.svp-mnav .svp-mnav__subs a[aria-current] { color: var(--svp-saffron-600); }
.svp-mnav__foot { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 20px calc(16px + env(safe-area-inset-bottom)); border-top: 1px solid rgba(16,48,31,.08); background: #f5f1e9; }
.svp-mnav .svp-mnav__cta { padding: 14px 22px; }
.svp-mnav .svp-mnav__phone { display: flex; flex-direction: column; font: 700 15px/1.25 var(--svp-font-body); color: var(--svp-green-900); text-align: right; }
.svp-mnav__phone small { font: 500 12px/1.2 var(--svp-font-body); color: var(--svp-muted); }

@media (min-width: 992px) {
  .svp-mhead, .svp-mnav { display: none !important; }
}
@media (max-width: 380px) {
  .svp-mhead__bar, .svp-mnav__top { padding: 0 14px; }
  .svp-mhead__logo img { height: 38px; }
  .svp-mnav__foot { flex-direction: column; align-items: stretch; }
  .svp-mnav .svp-mnav__phone { text-align: center; }
  .svp-mnav .svp-mnav__cta { justify-content: center; }
}

/* Old-page fixes on phones: wide tables swipe sideways, reCAPTCHA fits */
@media (max-width: 767px) {
  .table-responsive, table.table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
@media (max-width: 400px) {
  .g-recaptcha > div { transform: scale(.88); transform-origin: left top; }
  .g-recaptcha { height: 70px; }
}
/* Phones: the Notice Board becomes a round bell so it covers less of the page */
@media (max-width: 575px) {
  .svp-dock .svp-dock__toggle { width: 52px; height: 52px; padding: 0; justify-content: center; }
  .svp-dock__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .svp-dock__toggle::after { top: 12px; left: 29px; }
  .svp-dock__toggle svg { width: 22px; height: 22px; }
}
/* Phones/tablets: the hero height is automatic, so stretch every slide to the tallest one */
@media (max-width: 991px) {
  .svp-hero .swiper-wrapper { align-items: stretch; }
  .svp-hero .swiper-slide { height: auto; }
  .svp-hero .swiper-slide .svp-hero__media { inset: 0; height: 100%; }
}

/* ==========================================================================
   SAT 2026 POPUP (footer.php): the poster with a button to the SAT page
   ========================================================================== */
.svp-promo { position: fixed; inset: 0; z-index: 10000; display: grid; place-items: center; padding: 20px; }
.svp-promo[hidden] { display: none; }
.svp-promo__backdrop { position: absolute; inset: 0; background: rgba(8,24,16,.72); opacity: 0; transition: opacity .3s var(--svp-ease); }
.svp-promo__dialog {
  position: relative;
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  width: min(460px, 100%, calc((100vh - 140px) * .7126));
  width: min(460px, 100%, calc((100dvh - 140px) * .7126));
  opacity: 0; transform: translateY(18px) scale(.97);
  transition: opacity .35s var(--svp-ease), transform .35s var(--svp-ease);
}
.svp-promo.is-open .svp-promo__backdrop { opacity: 1; }
.svp-promo.is-open .svp-promo__dialog { opacity: 1; transform: none; }
.svp-promo__poster { display: block; width: 100%; border-radius: 12px; overflow: hidden; box-shadow: 0 30px 60px -20px rgba(0,0,0,.6); }
/* The dialog width follows the screen height, so the poster keeps its shape and the button always fits */
.svp-promo__poster img { display: block; width: 100%; height: auto; }
.svp-promo__actions .svp-btn { box-shadow: 0 12px 28px -10px rgba(0,0,0,.5); }
.svp-promo__close {
  position: absolute; top: -14px; right: -14px; z-index: 2;
  display: grid; place-items: center; width: 40px; height: 40px;
  border: 0; border-radius: 50%; background: var(--svp-white); color: var(--svp-green-900);
  box-shadow: 0 8px 20px -6px rgba(0,0,0,.45); cursor: pointer;
}
.svp-promo__close svg { width: 18px; height: 18px; }
.svp-promo__close:focus-visible, .svp-promo a:focus-visible { outline: 2px solid var(--svp-saffron); outline-offset: 3px; }
@media (max-width: 575px) {
  .svp-promo { padding: 24px 16px; }
  .svp-promo__close { top: -12px; right: -8px; width: 36px; height: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  .svp-promo__backdrop, .svp-promo__dialog { transition: none; }
}

/* Phones: the banner is exactly one screen under the 68px header, so the slide arrows are always visible without scrolling */
@media (max-width: 575px) {
  .svp-hero { height: calc(100vh - 68px); height: calc(100svh - 68px); min-height: 520px; }
  .svp-hero .swiper, .svp-hero .swiper-wrapper, .svp-hero .swiper-slide { height: 100%; }
  .svp-hero__inner { height: 100%; }

  /* Achievers slide: compact so all six cards fit above the arrows */
  .svp-hero__slide--achievers .svp-hero__inner { padding: 18px 16px 78px; gap: 16px; justify-content: center; }
  .svp-hero__slide--achievers .svp-hero__title { font-size: 28px; line-height: 1.2; margin-bottom: 14px; }
  .svp-hero__slide--achievers .svp-hero__actions .svp-btn { padding: 11px 18px; font-size: 13px; }
  .svp-mosaic--rankers .svp-mosaic__col:nth-child(2) { transform: translateY(-8px); }
  .svp-mosaic--rankers .svp-mosaic__col:nth-child(3) { transform: translateY(6px); }
  .svp-mosaic--rankers .svp-rank-card__photo { aspect-ratio: 4 / 3; }
  .svp-rank-card figcaption { padding: 6px 7px 7px; }
  .svp-hero .svp-rank-card__num { font-size: 22px; }
  .svp-hero .svp-rank-card__name { margin-top: 4px; font-size: 10.5px; line-height: 1.2; }
  .svp-hero .svp-rank-card__meta { margin-top: 1px; font-size: 9.5px; }
}
/* Short phones: shorter photos */
@media (max-width: 575px) and (max-height: 700px) {
  .svp-mosaic--rankers .svp-rank-card__photo { aspect-ratio: 16 / 10; }
  .svp-hero__slide--achievers .svp-hero__title { font-size: 25px; }
}

/* Page banner titles: keep a phrase like "XI & XII" together */
.svp-pagehero__title .svp-nowrap { white-space: nowrap; font-family: inherit; }

/* ==========================================================================
   PLAIN TEXT PAGES (payment policy): one readable column, no cards
   ========================================================================== */
.svp-prose { background: var(--svp-white); padding: 80px 24px 96px; font-family: var(--svp-font-body); }
.svp-prose__inner { max-width: 820px; margin: 0 auto; }
.svp-prose h2 { margin: 48px 0 16px; font: 700 30px/1.25 var(--svp-font-display); color: var(--svp-green-900); }
.svp-prose h2:first-child { margin-top: 0; }
.svp-prose p, .svp-prose li { font-family: var(--svp-font-body); font-size: 16.5px !important; line-height: 1.8; color: #4a5550; }
.svp-prose p { margin: 0 0 16px; }
.svp-prose strong { font-family: var(--svp-font-body); color: var(--svp-green-900); font-weight: 700; }
.svp-prose ul { margin: 0 0 16px; padding-left: 22px; list-style: disc; }
.svp-prose li { margin-bottom: 10px; padding-left: 4px; }
.svp-prose li::marker { color: var(--svp-saffron); }
.svp-prose a { color: var(--svp-green-900); text-decoration: underline; text-underline-offset: 3px; word-break: break-word; }
.svp-prose a:hover { color: var(--svp-saffron-600); }
@media (max-width: 767px) {
  .svp-prose { padding: 56px 16px 64px; }
  .svp-prose h2 { margin-top: 40px; font-size: 25px; }
  .svp-prose p, .svp-prose li { font-size: 15.5px !important; }
}

/* ==========================================================================
   CONTACT PAGE: details beside a form card, then the map
   ========================================================================== */
.svp-contact { background: var(--svp-ivory); padding: 96px 24px; font-family: var(--svp-font-body); }
.svp-contact__inner { max-width: var(--svp-container); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 72px; align-items: start; }
.svp-contact .svp-contact__heading { margin: 0 0 16px; font: 700 clamp(32px, 3.2vw, 44px)/1.15 var(--svp-font-display); color: var(--svp-green-900); }
.svp-contact .svp-contact__lead { font-family: var(--svp-font-body); margin: 0 0 36px; max-width: 460px; font-size: 17px !important; line-height: 1.7; color: var(--svp-muted); }
.svp-contact__block { padding: 20px 0; border-top: 1px solid rgba(16,48,31,.12); }
.svp-contact__block:last-of-type { border-bottom: 1px solid rgba(16,48,31,.12); }
.svp-contact .svp-contact__block h3 { margin: 0 0 6px; font: 700 20px/1.3 var(--svp-font-display); color: var(--svp-green-900); }
.svp-contact .svp-contact__block p { margin: 0; font-family: var(--svp-font-body); font-size: 16px !important; line-height: 1.7; color: #4a5550; }
.svp-contact__block a { color: inherit; text-decoration: none; }
.svp-contact__block a:hover { color: var(--svp-saffron-600); }
.svp-contact .svp-contact__link { display: inline-block; margin-top: 8px; font: 600 15px/1.4 var(--svp-font-body); color: var(--svp-green-900); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--svp-saffron); }
.svp-contact .svp-contact__social { display: flex; gap: 10px; margin: 28px 0 0; padding: 0; list-style: none; }
.svp-contact__social li { margin: 0; }
.svp-contact .svp-contact__social a { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; color: #fff; transition: transform .3s var(--svp-ease), box-shadow .3s var(--svp-ease); }
.svp-contact__social a[aria-label="Facebook"] { background: #1877f2; }
.svp-contact__social a[aria-label="Instagram"] { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.svp-contact__social a[aria-label="YouTube"] { background: #ff0000; }
.svp-contact .svp-contact__social a:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 10px 18px -8px rgba(0,0,0,.35); }
.svp-contact__social svg { width: 18px; height: 18px; }

.svp-contact__card { background: var(--svp-white); border-radius: 20px; padding: 44px; box-shadow: 0 30px 60px -34px rgba(16,48,31,.35); }
.svp-contact .svp-contact__card-title { margin: 0 0 26px; font: 700 28px/1.2 var(--svp-font-display); color: var(--svp-green-900); }
.svp-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.svp-form__field { margin-bottom: 18px; }
.svp-form label { display: block; margin: 0 0 7px; font: 600 14px/1.3 var(--svp-font-body); color: var(--svp-green-900); }
.svp-form label span { font-weight: 500; color: var(--svp-muted); }
.svp-form input, .svp-form textarea {
  display: block; width: 100%; margin: 0; padding: 13px 15px;
  border: 1px solid rgba(16,48,31,.18); border-radius: 12px; background: var(--svp-white);
  font: 500 16px/1.4 var(--svp-font-body); color: var(--svp-ink);
  transition: border-color .2s var(--svp-ease), box-shadow .2s var(--svp-ease);
}
.svp-form textarea { resize: vertical; min-height: 110px; }
.svp-form input:focus, .svp-form textarea:focus { outline: none; border-color: var(--svp-saffron); box-shadow: 0 0 0 3px rgba(232,121,30,.18); }
.svp-form .g-recaptcha { margin: 6px 0 22px; }
.svp-form .svp-form__submit { border: 0; cursor: pointer; }

.svp-map { background: var(--svp-ivory); padding: 0 24px 96px; }
.svp-map__inner { max-width: var(--svp-container); margin: 0 auto; border-radius: 20px; overflow: hidden; box-shadow: 0 30px 60px -40px rgba(16,48,31,.4); }
.svp-map iframe { display: block; width: 100%; height: 440px; border: 0; }

@media (max-width: 991px) {
  .svp-contact { padding: 64px 20px; }
  .svp-contact__inner { grid-template-columns: minmax(0, 1fr); gap: 44px; }
  .svp-map { padding: 0 20px 64px; }
}
@media (max-width: 575px) {
  .svp-contact { padding: 52px 16px; }
  .svp-contact__card { padding: 28px 20px; border-radius: 16px; }
  .svp-form__row { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .svp-map { padding: 0 16px 52px; }
  .svp-map iframe { height: 340px; }
  .svp-form .g-recaptcha { transform: scale(.9); transform-origin: 0 0; }
}
/* One item per line inside a contact block */
.svp-contact__block p > span, .svp-contact__block p > a { display: block; }
/* The theme restyles submit buttons; restore the site button */
.svp-form button.svp-form__submit { padding: 16px 30px; font: 600 15px/1 var(--svp-font-body) !important; letter-spacing: .01em; text-transform: none; height: auto; }

/* ==========================================================================
   ACHIEVERS PAGE: the homepage achiever cards as a grid, then result posters
   ========================================================================== */
.svp-ach__track--grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; overflow: visible; scroll-snap-type: none; padding: 4px 0 0; }
.svp-ach__track--grid .svp-ach__card { flex: none; }
@media (max-width: 1199px) { .svp-ach__track--grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px)  { .svp-ach__track--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .svp-ach--page .svp-ach__inner { padding: 0 16px; } }

.svp-reelcard--wide { width: 100%; aspect-ratio: 16 / 9; }

.svp-posters { background: #f5f1e9; padding: 92px 24px 96px; font-family: var(--svp-font-body); }
.svp-posters__inner { max-width: var(--svp-container); margin: 0 auto; }
.svp-posters .svp-posters__heading { margin: 0 0 44px; text-align: center; font: 700 clamp(32px, 3.2vw, 46px)/1.15 var(--svp-font-display); color: var(--svp-green-900); }
.svp-posters__grid { columns: 4 240px; column-gap: 20px; margin: 0; padding: 0; list-style: none; }
.svp-posters__grid li { break-inside: avoid; margin: 0 0 20px; }
.svp-posters__grid li[hidden] { display: none; }
.svp-posters__grid a { display: block; border-radius: 14px; overflow: hidden; background: var(--svp-white); box-shadow: 0 20px 40px -30px rgba(11,32,22,.45); transition: transform .35s var(--svp-ease), box-shadow .35s var(--svp-ease); }
.svp-posters__grid a:hover { transform: translateY(-4px); box-shadow: 0 28px 50px -30px rgba(11,32,22,.55); }
.svp-posters__grid img { display: block; width: 100%; height: auto; }
.svp-posters__more { margin-top: 36px; text-align: center; }
.svp-posters__more .svp-btn { border: 0; cursor: pointer; font: 600 15px/1 var(--svp-font-body) !important; text-transform: none; }
@media (max-width: 767px) {
  .svp-posters { padding: 64px 16px; }
  .svp-posters__grid { columns: 2; column-gap: 12px; }
  .svp-posters__grid li { margin-bottom: 12px; }
}
/* Two narrow cards per row on phones: tighter body, marks and year may wrap */
@media (max-width: 575px) {
  .svp-ach__track--grid .svp-ach__body { padding: 26px 14px 16px; }
  .svp-ach__track--grid .svp-ach__meta { flex-wrap: wrap; gap: 8px 12px; }
  .svp-ach--page .svp-ach__track--grid .svp-ach__name { font-size: 18px; }
  .svp-ach--page .svp-ach__track--grid .svp-ach__meta span { font-size: 13px; }
}

/* Facebook post embed (Sharada Ignite videos) */
.svp-fbpost { display: flex; justify-content: center; width: 100%; }
.svp-fbpost iframe { display: block; max-width: 100%; border: 0; border-radius: 14px; background: var(--svp-white); box-shadow: 0 30px 60px -36px rgba(11,32,22,.45); overflow: hidden; }

/* A full poster in the photo column (no blob crop, so its text stays readable) */
.svp-about__poster { display: block; width: min(440px, 100%); margin: 0 auto; border-radius: 16px; overflow: hidden; box-shadow: 0 34px 64px -34px rgba(11,32,22,.55); transition: transform .35s var(--svp-ease); }
.svp-about__poster:hover { transform: translateY(-4px); }
.svp-about__poster img { display: block; width: 100%; height: auto; }

/* Gallery with eight photos: four across, two rows */
.svp-gallery .svp-gallery__grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 991px) { .svp-gallery .svp-gallery__grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px) { .svp-gallery .svp-gallery__grid--4 { grid-template-columns: minmax(0, 1fr); } }

/* ==========================================================================
   NEWS & EVENTS PAGE: every card in a grid
   ========================================================================== */
.svp-news--page { padding: 72px 0 96px; }
.svp-news--page .svp-news__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 28px; transform: none; }
.svp-news--page .svp-news__card { flex: none; }
@media (max-width: 991px) { .svp-news--page .svp-news__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 20px; } }
@media (max-width: 575px) {
  .svp-news--page { padding: 52px 0 64px; }
  .svp-news--page .svp-news__list { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}

/* Form selects (enquiry form): same look as the text fields, with a chevron */
.svp-form select {
  display: block; width: 100%; height: auto; margin: 0; padding: 13px 40px 13px 15px;
  border: 1px solid rgba(16,48,31,.18); border-radius: 12px;
  background: var(--svp-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%2310301f' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 15px center / 12px;
  font: 500 16px/1.4 var(--svp-font-body); color: var(--svp-ink);
  -webkit-appearance: none; appearance: none; cursor: pointer;
  transition: border-color .2s var(--svp-ease), box-shadow .2s var(--svp-ease);
}
.svp-form select:invalid { color: var(--svp-muted); }
.svp-form select:focus { outline: none; border-color: var(--svp-saffron); box-shadow: 0 0 0 3px rgba(232,121,30,.18); }
/* Course links in a contact block */
.svp-contact__block p > a:hover { color: var(--svp-saffron-600); }
/* Enquiry page: on phones and tablets the form comes before the details */
@media (max-width: 991px) { .svp-contact--form-first .svp-contact__card { order: -1; } }

/* ==========================================================================
   SAT 2026 SIDE TAB (footer.php): a strip on the right edge; the poster slides out on hover
   ========================================================================== */
.svp-sattab {
  position: fixed; right: 0; top: 50%; z-index: 990;
  display: flex; align-items: center;
  transform: translate(260px, -50%);
  transition: transform .45s var(--svp-ease);
  text-decoration: none;
  filter: drop-shadow(0 18px 30px rgba(11,32,22,.35));
}
.svp-sattab:hover, .svp-sattab:focus-visible { transform: translate(0, -50%); }
.svp-sattab:focus-visible { outline: none; }
.svp-sattab:focus-visible .svp-sattab__strip { box-shadow: inset 0 0 0 2px #f4c542; }
.svp-sattab__strip {
  display: flex; align-items: center; justify-content: center;
  width: 42px; padding: 22px 0;
  background: #7d1f1a; color: #f4c542;
  font: 700 15px/1 var(--svp-font-body); letter-spacing: .12em;
  writing-mode: vertical-rl; transform: rotate(180deg);
  border-radius: 0 12px 12px 0; /* flipped by the rotation, so this rounds the outer (left) corners */
}
.svp-sattab__poster { display: block; width: 260px; height: auto; border-radius: 12px 0 0 12px; background: #7d1f1a; }
@media (hover: none), (max-width: 991px) {
  /* Touch screens: just the strip; a tap opens the SAT page */
  .svp-sattab, .svp-sattab:hover { transform: translate(0, -50%); }
  .svp-sattab__poster { display: none; }
  .svp-sattab__strip { width: 34px; padding: 16px 0; font-size: 12.5px; }
}
@media (prefers-reduced-motion: reduce) { .svp-sattab { transition: none; } }

/* Students Corner on inner pages: light background instead of the homepage's dark green band.
   Beige by default; white when it follows the beige photo gallery, so neighbouring sections stay distinct. */
.svp-corner--light { background: #f5f1e9; }
.svp-gallery + .svp-corner--light { background: var(--svp-white); }
.svp-corner--light .svp-corner__heading { color: var(--svp-green-900); }
.svp-corner--light .svp-corner__link { box-shadow: 0 24px 44px -30px rgba(11,32,22,.45); }
.svp-corner--light .svp-corner__note { color: var(--svp-muted); }
/* Students Corner overview: the card grid sits on white */
.svp-corner--page.svp-corner--light { background: var(--svp-white); }

/* ==========================================================================
   LOGO TAB (desktop): a bigger logo on a white tab that hangs below the menu bar.
   The bar keeps its height; once the header turns sticky the logo returns inside the bar.
   ========================================================================== */
@media (min-width: 992px) {
  .svp-navbar__logo {
    position: relative; z-index: 2;
    align-self: flex-start;
    padding: 12px 22px 16px;
    margin-left: -8px;
    background: var(--svp-white);
    border-radius: 0 0 18px 18px;
    box-shadow: 0 16px 26px -16px rgba(11,32,22,.35);
    transition: padding .35s var(--svp-ease), box-shadow .35s var(--svp-ease), border-radius .35s var(--svp-ease);
  }
  .svp-navbar__logo img { height: 86px; }
  /* Sticky bar: back to a plain logo inside the bar */
  .svp-header.is-stuck .svp-navbar__logo { align-self: center; padding: 0; margin-left: 0; box-shadow: none; border-radius: 0; }
  .svp-header.is-stuck .svp-navbar__logo img { height: 50px; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .svp-navbar__logo { padding: 12px 16px 14px; }
  .svp-navbar__logo img { height: 74px; }
}
/* Phones and tablets: a slightly bigger logo inside the same 68px bar */
@media (max-width: 991px) { .svp-mhead__bar .svp-mhead__logo img { height: 50px; } }
@media (max-width: 380px) { .svp-mhead__bar .svp-mhead__logo img { height: 44px; } }
/* New logo (2026 file) includes "Talapady, Mangalore", so it runs a little taller for the same visual size */
@media (min-width: 992px) {
  .svp-navbar__logo { padding: 11px 22px 14px; }
  .svp-navbar__logo img { height: 94px; }
  .svp-header.is-stuck .svp-navbar__logo img { height: 52px; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .svp-navbar__logo { padding: 11px 16px 13px; }
  .svp-navbar__logo img { height: 80px; }
}
/* Room for the bigger logo on common laptop widths */
@media (min-width: 1200px) and (max-width: 1599px) {
  .svp-navbar__inner { gap: 28px; }
  .svp-nav__link { padding: 12px 11px; }
  .svp-nav__link::after { left: 11px; right: 11px; }
}
@media (min-width: 1200px) and (max-width: 1439px) {
  .svp-navbar__inner { gap: 22px; }
  .svp-navbar__logo img { height: 86px; }
  .svp-nav__link { padding: 12px 10px; font-size: 15.5px; }
  .svp-nav__link::after { left: 10px; right: 10px; }
  .svp-navbar__phone-text { display: none; }   /* the phone icon stays and still calls */
}
@media (min-width: 992px) and (max-width: 1199px) {
  .svp-navbar__inner { gap: 14px; }
  .svp-navbar__logo { padding: 10px 14px 12px; }
  .svp-navbar__logo img { height: 70px; }
  .svp-nav__link { padding: 12px 7px; font-size: 14px; }
  .svp-nav__link::after { left: 7px; right: 7px; }
  .svp-navbar__cta { padding: 12px 16px; }
}
@media (min-width: 1200px) and (max-width: 1279px) { .svp-navbar__logo img { height: 80px; } .svp-nav__link { padding: 12px 9px; } }
@media (min-width: 992px) and (max-width: 1059px) { .svp-navbar__logo img { height: 64px; } .svp-nav__link { padding: 12px 6px; } }

/* LOGO TAB (phones and tablets): the same white hanging tab as desktop, smaller.
   The 68px bar keeps its height; when the bar turns sticky the logo returns inside it. */
@media (max-width: 991px) {
  .svp-mhead__bar .svp-mhead__logo {
    position: relative; z-index: 2;
    align-self: flex-start;
    margin-left: -6px;
    padding: 8px 12px 10px;
    background: var(--svp-white);
    border-radius: 0 0 14px 14px;
    box-shadow: 0 12px 20px -12px rgba(11,32,22,.35);
  }
  .svp-mhead__bar .svp-mhead__logo img { height: 68px; }
  .svp-mhead.is-stuck .svp-mhead__bar .svp-mhead__logo { align-self: center; margin-left: 0; padding: 0; box-shadow: none; border-radius: 0; }
  .svp-mhead.is-stuck .svp-mhead__bar .svp-mhead__logo img { height: 48px; }
}
@media (max-width: 374px) {
  .svp-mhead__bar .svp-mhead__logo { padding: 8px 10px 10px; }
  .svp-mhead__bar .svp-mhead__logo img { height: 62px; }
  .svp-mhead.is-stuck .svp-mhead__bar .svp-mhead__logo img { height: 44px; }
}
@media (max-width: 339px) {
  .svp-mhead__bar .svp-mhead__logo img { height: 56px; }
  .svp-mhead.is-stuck .svp-mhead__bar .svp-mhead__logo img { height: 42px; }
}

/* Complete commerce portraits: keep the full head visible in each responsive crop. */
.svp-rank-card__photo img.svp-rank-card__portrait-repaired { object-position: 50% 0%; }