:root {
  /* Unified brand palette — previously --srk-primary/--srk-red (blue/red)
     and --srk-navy/--srk-maroon (navy/maroon) were two different color
     systems used in different sections of the same page. They now share
     one set of values so every section reads as one consistent brand. */
  --srk-primary: #0E1B3D;
  --srk-primary-dark: #08132c;
  --srk-primary-light: #172a5c;
  --srk-red: #7E0F2B;
  --srk-red-dark: #5C0A20;
  --srk-gold: #D6A125;
  --srk-gold-light: #F0C860;
  --srk-white: #ffffff;
  --srk-body: #f7f9fc;
  --srk-text: #152039;
  --srk-muted: #6b7182;
  --srk-border: #e4e9f1;
  --srk-shadow: 0 18px 50px rgba(17, 39, 79, 0.12);
  --srk-soft-shadow: 0 10px 30px rgba(17, 39, 79, 0.09);
  --srk-maroon: #7E0F2B;
  --srk-maroon-dark: #5C0A20;
  --srk-navy: #0E1B3D;
  --srk-navy-light: #172a5c;
  --srk-cream: #FBF7EF;
  --srk-ink: #1B1B26;
  --srk-line: #E7E1D4;
  --shadow-soft: 0 20px 50px -20px rgba(14,27,61,.25);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--srk-text);
  background: var(--srk-body);
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  overflow-x: hidden;
}

img {
  max-width: 100%;
}

a {
  text-decoration: none;
}

.srkhome-main {
  width: 100%;
  overflow: hidden;
}

.srkhome-container {
  max-width: 1320px;
}

.srkhome-section-space {
  padding: 40px 0;
}


/* =========================================================
   COMMON HEADINGS
========================================================= */

.srkhome-small-heading {
  display: inline-block;
  margin-bottom: 9px;
  color: var(--srk-red);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.srkhome-section-intro h2,
.srkhome-center-heading h2 {
  margin: 0;
  color: var(--srk-primary);
  font-size: clamp(28px, 3vw, 35px);
  font-weight: 600;
  line-height: 1.15;
}

.srkhome-section-intro h2 span {
  display: block;
}

.srkhome-center-heading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  text-align: center;
}

.srkhome-center-heading .srkhome-small-heading {
  margin-bottom: 5px;
}

.srkhome-heading-line {
  display: block;
  width: 78px;
  height: 2px;
  position: relative;
  background: linear-gradient(
    90deg,
    transparent,
    var(--srk-gold),
    transparent
  );
}

.srkhome-heading-line::after {
  width: 6px;
  height: 6px;
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  background: var(--srk-gold);
  transform: translate(-50%, -50%);
}

.srkhome-center-description {
  max-width: 880px;
  margin: 19px auto 42px;
  color: var(--srk-muted);
  font-size: 15px;
  line-height: 1.85;
  text-align: center;
}


/* =========================================================
   BUTTONS
========================================================= */

.srkhome-primary-btn,
.srkhome-outline-btn,
.srkhome-red-btn,
.srkhome-cta-button {
  min-height: 50px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  padding: 12px 22px;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  transition:
    transform 0.3s ease,
    background-color 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease;
}

.srkhome-primary-btn {
  color: #17203a;
  border: 1px solid var(--srk-gold);
  background: linear-gradient(
    135deg,
    var(--srk-gold-light),
    var(--srk-gold)
  );
  box-shadow: 0 12px 25px rgba(245, 181, 27, 0.26);
}

.srkhome-primary-btn:hover {
  color: #17203a;
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(245, 181, 27, 0.33);
}

.srkhome-outline-btn {
  color: var(--srk-white);
  border: 1px solid rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.07);
  backdrop-filter: blur(8px);
}

.srkhome-outline-btn:hover {
  color: var(--srk-white);
  border-color: var(--srk-white);
  background: rgba(255, 255, 255, 0.16);
  transform: translateY(-3px);
}

.srkhome-red-btn {
  min-height: 46px;
  padding: 11px 20px;
  color: var(--srk-white);
  background: linear-gradient(
    135deg,
    var(--srk-red),
    var(--srk-red-dark)
  );
  box-shadow: 0 12px 25px rgba(189, 0, 39, 0.2);
}

.srkhome-red-btn:hover {
  color: var(--srk-white);
  transform: translateY(-3px);
}


/* =========================================================
   QUICK LINKS
========================================================= */

.srkhome-quick-position {
  position: absolute;
  z-index: 10;
  right: 0;
  bottom: -45px;
  left: 0;
}

.srkhome-quick-links {
  min-height: 92px;
  padding: 10px 14px;
  border: 1px solid rgba(224, 229, 239, 0.85);
  border-radius: 20px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: rgba(255, 255, 255, 0.97);
  box-shadow: var(--srk-shadow);
  backdrop-filter: blur(12px);
}

.srkhome-quick-item {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 10px 16px;
  position: relative;
  color: var(--srk-primary);
}

.srkhome-quick-item:not(:last-child)::after {
  width: 1px;
  height: 50px;
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  background: var(--srk-border);
  transform: translateY(-50%);
}

.srkhome-quick-item:hover {
  color: var(--srk-red);
}

.srkhome-quick-icon {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  color: var(--srk-white);
  font-size: 22px;
  transition: transform 0.3s ease;
}

.srkhome-quick-item:hover .srkhome-quick-icon {
  transform: translateY(-3px);
}

.srkhome-icon-red {
  background: linear-gradient(135deg, #d21039, #9d001f);
}

.srkhome-icon-blue {
  background: linear-gradient(135deg, #1768b5, #00336e);
}

.srkhome-icon-yellow {
  background: linear-gradient(135deg, #ffc744, #ef9e00);
}

.srkhome-icon-green {
  background: linear-gradient(135deg, #1baa76, #006a4b);
}

.srkhome-icon-purple {
  background: linear-gradient(135deg, #7e4be7, #4722a7);
}

.srkhome-quick-item strong,
.srkhome-quick-item small {
  display: block;
}

.srkhome-quick-item strong {
  font-size: 20px;
  font-weight: 600;
}

.srkhome-quick-item small {
  color: var(--srk-muted);
  font-size: 16px;
}


/* =========================================================
   ABOUT
========================================================= */

.srkhome-about {
  padding-top: 80px;
  background:
    radial-gradient(
      circle at 92% 50%,
      rgba(0, 39, 96, 0.045),
      transparent 23%
    ),
    var(--srk-white);
}

.srkhome-about-text,
.srkhome-about-summary {
  color: var(--srk-muted);
  font-size: 16px;
  line-height: 1.85;
}

.srkhome-about-text {
  margin: 23px 0 20px;
}

.srkhome-about-summary {
  margin: 18px 0 24px;
}

.srkhome-about-feature {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 15px;
}

.srkhome-about-feature > span {
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--srk-red);
  font-size: 17px;
}

.srkhome-about-feature h3 {
  margin: 0 0 3px;
  color: var(--srk-primary);
  font-size: 16px;
  font-weight: 600;
}

.srkhome-about-feature p {
  margin: 0;
  color: var(--srk-muted);
  font-size: 16px;
  line-height: 1.65;
}

.srkhome-about-media {
  min-height: 480px;
  position: relative;
  padding: 15px 20px 25px;
}

.srkhome-about-image {
  width: 100%;
  height: 455px;
  border-radius: 32px 9px 32px 9px;
  display: block;
  object-fit: cover;
  box-shadow: var(--srk-shadow);
}

.srkhome-play-btn {
  width: 74px;
  height: 74px;
  position: absolute;
  top: 50%;
  left: 50%;
  border: 8px solid rgba(255, 255, 255, 0.86);
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--srk-white);
  background: var(--srk-red);
  box-shadow: 0 12px 30px rgba(189, 0, 39, 0.3);
  transform: translate(-50%, -50%);
}

.srkhome-play-btn i {
  margin-left: 4px;
  font-size: 30px;
}

.srkhome-play-btn:hover {
  color: var(--srk-white);
  background: var(--srk-red-dark);
}

.srkhome-years-card {
  width: 135px;
  min-height: 130px;
  position: absolute;
  right: 0;
  bottom: 0;
  border: 1px solid var(--srk-border);
  border-radius: 13px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 20px;
  background: var(--srk-white);
  box-shadow: var(--srk-shadow);
}

.srkhome-years-card strong,
.srkhome-years-card span,
.srkhome-years-card small {
  display: block;
}

.srkhome-years-card strong {
  color: var(--srk-red);
  font-size: 30px;
  font-weight: 600;
  line-height: 1;
}

.srkhome-years-card span {
  color: var(--srk-red);
  font-size: 16px;
  font-weight: 500;
}

.srkhome-years-card small {
  color: var(--srk-primary);
  font-size: 16px;
  font-weight: 600;
}

.srkhome-about-dots {
  width: 76px;
  height: 76px;
  position: absolute;
  z-index: 2;
  opacity: 0.85;
  background-image: radial-gradient(
    var(--srk-gold) 2px,
    transparent 2px
  );
  background-size: 12px 12px;
}

.srkhome-dots-left {
  left: -8px;
  bottom: 8px;
}

.srkhome-dots-right {
  top: 0;
  right: -10px;
}


/* =========================================================
   HIGHLIGHTS
========================================================= */

.srkhome-highlights {
  padding: 0 0 35px;
  background: var(--srk-white);
}

.srkhome-highlights-box {
  min-height: 145px;
  border: 1px solid var(--srk-border);
  border-radius: 20px;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  padding: 22px;
  background: var(--srk-white);
  box-shadow: var(--srk-shadow);
}

.srkhome-highlight-item {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  position: relative;
  padding: 10px 18px;
}

.srkhome-highlight-item:not(:last-child)::after {
  width: 1px;
  content: "";
  position: absolute;
  top: 14px;
  right: 0;
  bottom: 14px;
  background: var(--srk-border);
}

.srkhome-highlight-icon {
  flex: 0 0 48px;
  color: var(--srk-gold);
  font-size: 43px;
  line-height: 1;
}

.srkhome-highlight-item strong,
.srkhome-highlight-item span {
  display: block;
}

.srkhome-highlight-item strong {
  color: var(--srk-primary);
  font-size: 21px;
  font-weight: 600;
  line-height: 1.2;
}

.srkhome-highlight-item span {
  margin-top: 5px;
  color: var(--srk-text);
  font-size: 10px;
  line-height: 1.4;
}


/* =========================================================
   FACILITIES
========================================================= */

.srkhome-facilities {
  padding-top: 60px;
  background:
    linear-gradient(
      180deg,
      #f8faff 0%,
      #ffffff 100%
    );
}

.srkhome-facility-card {
  height: 100%;
  border: 1px solid var(--srk-border);
  border-radius: 17px;
  display: block;
  overflow: hidden;
  color: var(--srk-primary);
  background: var(--srk-white);
  box-shadow: var(--srk-soft-shadow);
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.srkhome-facility-card:hover {
  color: var(--srk-red);
  transform: translateY(-7px);
  box-shadow: var(--srk-shadow);
}

.srkhome-facility-image {
  height: 195px;
  position: relative;
  overflow: hidden;
}

.srkhome-facility-image::after {
  content: "";
  position: absolute;
  inset: 45% 0 0;
  background: linear-gradient(
    transparent,
    rgba(0, 27, 73, 0.58)
  );
}

.srkhome-facility-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform 0.55s ease;
}

.srkhome-facility-card:hover img {
  transform: scale(1.08);
}

.srkhome-facility-image span {
  width: 44px;
  height: 44px;
  position: absolute;
  z-index: 3;
  right: 15px;
  bottom: 12px;
  border: 4px solid var(--srk-white);
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--srk-white);
  background: var(--srk-red);
  font-size: 18px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

.srkhome-facility-card h3 {
  margin: 0;
  padding: 17px 15px;
  color: inherit;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
}


/* =========================================================
   EXTRA CURRICULAR ACTIVITIES
========================================================= */

.srkhome-eca {
  background: #f8faff;
}

.srkhome-eca-card {
  height: 100%;
  border: 1px solid var(--srk-border);
  border-radius: 18px;
  overflow: hidden;
  background: var(--srk-white);
  box-shadow: var(--srk-soft-shadow);
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.srkhome-eca-card:hover {
  transform: translateY(-7px);
  box-shadow: var(--srk-shadow);
}

.srkhome-eca-image {
  height: 190px;
  overflow: hidden;
}

.srkhome-eca-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.srkhome-eca-card:hover .srkhome-eca-image img {
  transform: scale(1.07);
}

.srkhome-eca-body {
  min-height: 180px;
  padding: 0 20px 21px;
  position: relative;
  text-align: center;
}

.srkhome-eca-icon {
  width: 52px;
  height: 52px;
  margin: -45px auto 13px;
  border: 5px solid var(--srk-white);
  border-radius: 50%;
  display: grid;
  place-items: center;
  position: relative;
  z-index: 3;
  background: #fff0f3;
  font-size: 23px;
  box-shadow: 0 7px 18px rgba(17, 39, 79, 0.12);
}

.srkhome-eca-body small {
  display: block;
  color: var(--srk-red);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.srkhome-eca-body h3 {
  margin: 5px 0 9px;
  color: var(--srk-primary);
  font-size: 17px;
  font-weight: 600;
}

.srkhome-eca-body p {
  margin: 0;
  color: var(--srk-muted);
  font-size: 11px;
  line-height: 1.7;
}

.srkhome-eca-body a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--srk-red);
  font-size: 11px;
  font-weight: 600;
}

.srkhome-eca-body a:hover {
  color: var(--srk-primary);
}

.srkhome-passion-box {
  margin-top: 40px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
  padding: 28px 34px;
  color: var(--srk-white);
  background:
    radial-gradient(
      circle at 85% 50%,
      rgba(245, 181, 27, 0.2),
      transparent 25%
    ),
    linear-gradient(
      135deg,
      var(--srk-primary-dark),
      var(--srk-primary-light)
    );
  box-shadow: var(--srk-shadow);
}

.srkhome-passion-box span {
  color: var(--srk-gold);
  font-size: 21px;
  font-weight: 600;
}

.srkhome-passion-box p {
  margin: 5px 0 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 13px;
}


/* =========================================================
   ANNOUNCEMENTS
========================================================= */

.srkhome-news-achievers {
  background: var(--srk-white);
}

.srkhome-announcements,
.srkhome-achievers {
  height: 100%;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: var(--srk-shadow);
}

.srkhome-announcements {
  border: 1px solid var(--srk-border);
  padding: 30px;
  background: var(--srk-white);
}

.srkhome-panel-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 15px;
  padding-bottom: 19px;
  border-bottom: 1px solid var(--srk-border);
}

.srkhome-panel-heading span {
  display: block;
  margin-bottom: 3px;
  color: var(--srk-red);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
}

.srkhome-panel-heading h2 {
  margin: 0;
  color: var(--srk-red);
  font-size: 21px;
  font-weight: 600;
}

.srkhome-panel-heading > a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--srk-red);
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}

.srkhome-panel-heading > a:hover {
  color: var(--srk-red);
}

.srkhome-news-item {
  padding: 20px 0;
  border-bottom: 1px solid var(--srk-border);
}

.srkhome-news-item:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.srkhome-news-date {
  width: 62px;
  height: 68px;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--srk-red);
  background: #fff0f3;
}

.srkhome-news-date span {
  font-size: 9px;
  font-weight: 600;
}

.srkhome-news-date strong {
  font-size: 23px;
  font-weight: 600;
  line-height: 1.05;
}

.srkhome-news-type {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 5px;
  color: var(--srk-red);
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
}

.srkhome-news-content h3 {
  margin: 0;
  color: var(--srk-primary);
  font-size: 16px;
  font-weight: 600;
}

.srkhome-news-content p {
  margin: 5px 0 0;
  color: var(--srk-muted);
  display: -webkit-box;
  overflow: hidden;
  font-size: 14px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.srkhome-news-content a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 7px;
  color: var(--srk-red);
  font-size: 14px;
  font-weight: 600;
}


/* =========================================================
   ACHIEVERS
========================================================= */

.srkhome-achievers {
  padding: 25px;
  color: var(--srk-white);
  background:
    radial-gradient(circle at 95% 15%, rgba(245, 181, 27, 0.15), transparent 25%),
    linear-gradient(135deg, var(--srk-primary-dark), var(--srk-primary-light));
}

.srkhome-panel-heading-light { border-bottom-color: rgba(255, 255, 255, 0.2); }
.srkhome-panel-heading-light span { color: var(--srk-gold); }
.srkhome-panel-heading-light h2 { color: var(--srk-white); }
.srkhome-panel-heading-light > a { color: var(--srk-white); }
.srkhome-panel-heading-light > a:hover { color: var(--srk-gold); }

.srkhome-achievers-description {
  margin: 15px 0 19px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 16px;
  line-height: 1.65;
}

/* Carousel wrapper */
.srkhome-achievers-carousel-wrap {
  position: relative;
  padding: 6px 4px 46px;
}

.srkhome-achievers-swiper {
  overflow: hidden;
  padding: 6px 2px 4px;
}

.srkhome-achievers-swiper .swiper-slide {
  height: auto;
  display: flex;
}

/* Card (unchanged) */
.srkhome-student-card {
  height: 100%;
  width: 100%;
  min-height: 300px;
  border-radius: 15px;
  padding: 20px 13px 16px;
  position: relative;
  color: var(--srk-text);
  text-align: center;
  background: var(--srk-white);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.16);
}

.srkhome-rank-badge {
  width: 36px;
  height: 36px;
  position: absolute;
  z-index: 3;
  top: 21px;
  left: 16px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--srk-white);
  background: var(--srk-gold);
  font-size: 14px;
  font-weight: 600;
  box-shadow: 0 7px 15px rgba(245, 181, 27, 0.28);
}

.srkhome-student-photo {
  width: 105px;
  height: 105px;
  margin: 0 auto 12px;
  border: 5px solid #fff2d1;
  overflow: hidden;
  background: #f3f5f9;
}

.srkhome-student-photo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center top;
}

.srkhome-student-card h3 {
  margin: 0;
  color: var(--srk-primary);
  font-size: 13px;
  font-weight: 600;
}

.srkhome-student-card > span {
  display: block;
  margin-top: 3px;
  color: var(--srk-muted);
  font-size: 9px;
  font-weight: 500;
}

.srkhome-student-card > strong {
  display: block;
  margin-top: 13px;
  color: var(--srk-red);
  font-size: 18px;
  font-weight: 600;
}

.srkhome-student-card > b {
  display: block;
  margin-top: 2px;
  color: var(--srk-primary);
  font-size: 15px;
  font-weight: 600;
}

.srkhome-student-card > small {
  display: inline-block;
  margin-top: 9px;
  border-radius: 20px;
  padding: 5px 10px;
  color: var(--srk-primary);
  background: #eef3fb;
  font-size: 12px;
  font-weight: 600;
}

/* Nav arrows */
.srkhome-swiper-nav {
  width: 38px;
  height: 38px;
  position: absolute;
  top: 45%;
  transform: translateY(-50%);
  z-index: 10;
  display: grid;
  place-items: center;
  border: none;
  border-radius: 50%;
  color: var(--srk-primary);
  background: var(--srk-white);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}

.srkhome-swiper-nav:hover {
  background: var(--srk-gold);
  color: var(--srk-white);
}

.srkhome-swiper-nav.swiper-button-disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.srkhome-swiper-prev { left: -6px; }
.srkhome-swiper-next { right: -6px; }

/* Pagination dots */
.srkhome-achievers-pagination {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
}

.srkhome-achievers-pagination .swiper-pagination-bullet {
  background: rgba(255, 255, 255, 0.5);
  opacity: 1;
}

.srkhome-achievers-pagination .swiper-pagination-bullet-active {
  background: var(--srk-gold);
}

@media (max-width: 767px) {
  .srkhome-swiper-prev { left: 2px; }
  .srkhome-swiper-next { right: 2px; }
}

/* =========================================================
   ADMISSION CTA
========================================================= */

.srkhome-admission-cta {
  padding: 0 0 0;
  background: var(--srk-white);
}

.srkhome-admission-inner {
  min-height: 170px;
  border-radius: 80px 80px 0 0;
  display: grid;
  grid-template-columns: 245px minmax(0, 1fr) auto 60px;
  align-items: center;
  gap: 28px;
  padding: 20px 45px 0;
  position: relative;
  overflow: hidden;
  color: var(--srk-white);
  background:
    radial-gradient(
      circle at 17% 45%,
      rgba(245, 181, 27, 0.18),
      transparent 25%
    ),
    linear-gradient(
      110deg,
      #700f14
    );
}

.srkhome-admission-inner::after {
  width: 280px;
  height: 280px;
  content: "";
  position: absolute;
  right: -80px;
  bottom: -170px;
  border: 2px solid rgba(245, 181, 27, 0.25);
  border-radius: 50%;
}

.srkhome-cta-decoration {
  position: absolute;
  top: 25px;
  left: 20px;
  color: rgba(245, 181, 27, 0.4);
  font-size: 55px;
}

.srkhome-cta-students {
  height: 150px;
  position: relative;
  align-self: end;
  overflow: hidden;
  clip-path: polygon(16% 0, 100% 0, 90% 100%, 0 100%);
}

.srkhome-cta-students img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center 15%;
}

.srkhome-cta-content {
  position: relative;
  z-index: 2;
}

.srkhome-cta-content span {
  display: block;
  margin-bottom: 4px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 11px;
  text-transform: uppercase;
}

.srkhome-cta-content h2 {
  margin: 0;
  color: var(--srk-gold-light);
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 600;
}

.srkhome-cta-content p {
  margin: 6px 0 0;
  color: rgba(255, 255, 255, 0.86);
  font-size: 13px;
}

.srkhome-cta-button {
  position: relative;
  z-index: 3;
  color: #17203a;
  background: var(--srk-gold);
  box-shadow: 0 10px 25px rgba(83, 37, 0, 0.22);
}

.srkhome-cta-button:hover {
  color: #17203a;
  background: var(--srk-gold-light);
  transform: translateY(-3px);
}

.srkhome-cta-school-icon {
  position: relative;
  z-index: 2;
  color: var(--srk-gold);
  font-size: 95px;
  line-height: 1;
  text-align: center;
}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1199.98px) {

  .srkhome-container {
    max-width: 1140px;
  }

  .srkhome-quick-links {
    overflow-x: auto;
    grid-template-columns: repeat(4, minmax(205px, 1fr));
    scrollbar-width: thin;
  }

  .srkhome-highlight-item {
    gap: 10px;
    padding-inline: 10px;
  }

  .srkhome-highlight-icon {
    flex-basis: 38px;
    font-size: 35px;
  }

  .srkhome-highlight-item strong {
    font-size: 18px;
  }

  .srkhome-admission-inner {
    grid-template-columns: 200px minmax(0, 1fr) auto 55px;
    padding-inline: 30px;
  }

  .srkhome-cta-school-icon {
    font-size: 75px;
  }
}


/* =========================================================
   IPAD / IPAD MINI
========================================================= */

@media (max-width: 991.98px) {

  .srkhome-section-space {
    padding: 75px 0;
  }

  .srkhome-about-media {
    min-height: auto;
    margin-top: 5px;
  }

  .srkhome-about-image {
    height: 430px;
  }

  .srkhome-highlights-box {
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
  }

  .srkhome-highlight-item:nth-child(2)::after,
  .srkhome-highlight-item:nth-child(4)::after {
    display: none;
  }

  .srkhome-highlight-item:nth-child(-n + 4) {
    border-bottom: 1px solid var(--srk-border);
  }

  .srkhome-highlight-item:last-child {
    grid-column: 1 / -1;
  }

  .srkhome-admission-inner {
    min-height: 230px;
    grid-template-columns: 180px minmax(0, 1fr) auto;
    border-radius: 55px 55px 0 0;
  }

  .srkhome-cta-school-icon {
    display: none;
  }

  .srkhome-cta-students {
    height: 190px;
  }
}


/* =========================================================
   MOBILE AND SMALL TABLETS
========================================================= */

@media (max-width: 767.98px) {

  .srkhome-section-space {
    padding: 65px 0;
  }

  .srkhome-center-heading {
    gap: 10px;
  }

  .srkhome-heading-line {
    width: 36px;
  }

  .srkhome-center-description {
    margin-bottom: 30px;
    font-size: 13px;
  }

  .srkhome-quick-position {
    bottom: -50px;
  }

  .srkhome-quick-links {
    min-height: 100px;
    border-radius: 17px;
    grid-template-columns: repeat(5, minmax(190px, 1fr));
  }

  .srkhome-about {
    padding-top: 130px;
  }

  .srkhome-about-media {
    padding-inline: 0;
  }

  .srkhome-about-image {
    height: 360px;
  }

  .srkhome-years-card {
    width: 135px;
    min-height: 130px;
  }

  .srkhome-years-card strong {
    font-size: 35px;
  }

  .srkhome-highlights-box {
    padding: 15px;
  }

  .srkhome-highlight-item {
    justify-content: flex-start;
    padding: 18px 12px;
  }

  .srkhome-passion-box {
    align-items: flex-start;
    flex-direction: column;
    padding: 26px;
  }

  .srkhome-admission-inner {
    grid-template-columns: 1fr auto;
    min-height: 240px;
    gap: 20px;
    padding: 35px 25px;
  }

  .srkhome-cta-students {
    display: none;
  }

  .srkhome-cta-content {
    min-width: 0;
  }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

  .srkhome-container {
    padding-right: 18px;
    padding-left: 18px;
  }

  .srkhome-section-space {
    padding: 55px 0;
  }

  .srkhome-section-intro h2,
  .srkhome-center-heading h2 {
    font-size: 28px;
  }

  .srkhome-center-heading {
    display: block;
  }

  .srkhome-heading-line {
    display: none;
  }

  .srkhome-quick-position {
    bottom: -48px;
  }

  .srkhome-quick-links {
    grid-template-columns: repeat(4, minmax(175px, 1fr));
    padding: 8px;
  }

  .srkhome-quick-item {
    gap: 10px;
    padding-inline: 11px;
  }

  .srkhome-quick-icon {
    flex-basis: 43px;
    width: 43px;
    height: 43px;
  }

  .srkhome-about {
    padding-top: 120px;
  }

  .srkhome-about-image {
    height: 300px;
    border-radius: 22px 7px 22px 7px;
  }

  .srkhome-play-btn {
    width: 62px;
    height: 62px;
    border-width: 6px;
  }

  .srkhome-years-card {
    right: -4px;
    bottom: -20px;
  }

  .srkhome-about-media {
    margin-bottom: 25px;
  }

  .srkhome-highlights-box {
    grid-template-columns: 1fr;
  }

  .srkhome-highlight-item {
    border-bottom: 1px solid var(--srk-border);
  }

  .srkhome-highlight-item::after {
    display: none;
  }

  .srkhome-highlight-item:last-child {
    grid-column: auto;
    border-bottom: 0;
  }

  .srkhome-facility-image,
  .srkhome-eca-image {
    height: 210px;
  }

  .srkhome-panel-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .srkhome-news-item {
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 12px;
  }

  .srkhome-news-date {
    width: 54px;
    height: 63px;
  }

  .srkhome-announcements,
  .srkhome-achievers {
    padding: 20px 17px;
  }

  .srkhome-student-card {
    min-height: 285px;
  }

  .srkhome-admission-inner {
    grid-template-columns: 1fr;
    border-radius: 35px 35px 0 0;
    padding: 35px 22px;
    text-align: center;
  }

  .srkhome-cta-content h2 {
    font-size: 28px;
  }

  .srkhome-cta-button {
    width: 100%;
  }

  /* CTA decoration star used to sit at a fixed top-left offset; once the
     layout collapses to one centered column at this width it landed on
     top of the heading text. Hide it here the same way the school-icon
     is already hidden on smaller breakpoints. */
  .srkhome-cta-decoration {
    display: none;
  }
}

.eyebrow{
  font-family: "Poppins", sans-serif;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-size:.75rem;
  font-weight:700;
  color:var(--srk-maroon);
}
.eyebrow .rule{display:inline-block;width:28px;height:2px;background:var(--srk-gold);vertical-align:middle;margin-right:10px;}
.section-title{font-weight:700;color:var(--srk-navy);letter-spacing:-.01em;}
.btn-srk-maroon{
  background:var(--srk-maroon);border:1px solid var(--srk-maroon);color:#fff;
  font-weight:600;letter-spacing:.03em;padding:.65rem 1.6rem;border-radius:2px;
  transition:.25s ease;
}
.btn-srk-maroon:hover{background:var(--srk-maroon-dark);color:#fff;transform:translateY(-2px);box-shadow:0 10px 20px -8px rgba(126,15,43,.5);}
.btn-srk-gold{
  background:var(--srk-gold);border:1px solid var(--srk-gold);color:var(--srk-navy);
  font-weight:700;letter-spacing:.03em;padding:.7rem 1.7rem;border-radius:2px;
  transition:.25s ease;
}
.btn-srk-gold:hover{background:var(--srk-gold-light);color:var(--srk-navy);transform:translateY(-2px);box-shadow:0 10px 24px -8px rgba(214,161,37,.6);}
.btn-srk-outline{
  border:1.5px solid var(--srk-navy);color:var(--srk-navy);font-weight:600;padding:.6rem 1.5rem;border-radius:2px;background:transparent;
  transition:.25s ease;
}
.btn-srk-outline:hover{background:var(--srk-navy);color:#fff;}

/* ===== Hero carousel ===== */
.srk-hero{position:relative;background:var(--srk-navy);}
.srk-hero .carousel-item{
  height:78vh;min-height:460px;max-height:720px;
}
.srk-hero .carousel-item img{
  width:100%;height:100%;object-fit:cover;
}
.srk-hero .carousel-item::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(14,27,61,.15) 0%, rgba(14,27,61,0) 35%, rgba(14,27,61,.55) 100%);
}
.srk-hero .carousel-indicators{
  bottom: 4.6rem;
}
.srk-hero .carousel-indicators [data-bs-target]{
  width:34px;height:4px;border-radius:2px;background:rgba(255,255,255,.45);
  border:none;opacity:1;
}
.srk-hero .carousel-indicators .active{background:var(--srk-gold);}
.srk-hero .carousel-control-prev,
.srk-hero .carousel-control-next{
  width:56px;height:56px;top:50%;transform:translateY(-50%);
  background:rgba(255,255,255,.14);backdrop-filter:blur(4px);border-radius:50%;opacity:0;
  transition:.25s;
}
.srk-hero:hover .carousel-control-prev,
.srk-hero:hover .carousel-control-next{opacity:1;}
.srk-hero .carousel-control-prev{left:24px;}
.srk-hero .carousel-control-next{right:24px;}
.srk-hero .carousel-control-prev-icon,
.srk-hero .carousel-control-next-icon{width:1.1rem;height:1.1rem;}

/* ===== Mobile hero fix — show full image ===== */
@media (max-width: 767.98px){
  .srk-hero .carousel-item{
    height:auto;          
    min-height:0;
    max-height:none;
  }
  .srk-hero .carousel-item img{
    width:100%;
    height:400px;          
    object-fit:cover;   
    background:var(--srk-navy); 
  }
}

/* Jubilee seal over hero */
.srk-seal{
  position:absolute;top:45px;right:5%;z-index:5;
  width:135px;height:135px;
  color:#fff;text-align:center;
  filter:drop-shadow(0 12px 20px rgba(0,0,0,.35));
}
.srk-seal svg{width:100%;height:100%;}
.srk-seal .seal-text{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-family: "Poppins", sans-serif;
}
.srk-seal .seal-text b{font-size:20px;}
.srk-seal .seal-text span{font-size:10px;}

/* Seal had no mobile sizing before — at small widths it crowded the
   right edge of the hero. Scaled down to match. */
@media (max-width: 575.98px) {
  .srk-seal{
    top: 50px;
    width: 100px;
    height: 100px;
  }
  .srk-seal .seal-text b{ font-size: 1.15rem; }
  .srk-seal .seal-text span{ font-size: .42rem; max-width: 52px; }
}


/* ===== Navy recognition band ===== */
.srk-band-navy{
  background:linear-gradient(135deg,var(--srk-navy) 0%,var(--srk-navy-light) 100%);
  padding:3.2rem 0;position:relative;overflow:hidden;
}
.srk-band-navy::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 15% 20%,rgba(214,161,37,.10),transparent 40%),
             radial-gradient(circle at 85% 80%,rgba(214,161,37,.08),transparent 40%);
}
.srk-recog-card{
  text-align:center;padding:1.6rem 1rem;border:1px solid rgba(255,255,255,.12);border-radius:8px;
  height:100%;transition:.25s;
}
.srk-recog-card:hover{background:rgba(255,255,255,.06);transform:translateY(-4px);border-color:var(--srk-gold);}
.srk-recog-card i{font-size:1.9rem;color:var(--srk-gold-light);}
.srk-recog-card .t{color:#fff;font-weight:700;margin-top:.7rem;font-size:.95rem;}
.srk-recog-card .s{color:#aab2cf;font-size:.76rem;margin-top:.15rem;}

/* ===== Stats strip ===== */
.srk-stats{background:#fff;padding:2.6rem 0;border-bottom:1px solid var(--srk-line);}
.srk-stat{text-align:center;}
.srk-stat i{font-size:35px;color:var(--srk-maroon);}
.srk-stat b{display:block;font-family: "Poppins", sans-serif;font-size:1.9rem;color:var(--srk-navy); margin-top: 15px;}
.srk-stat span{font-size:.8rem;color:var(--srk-muted);font-weight:500;}

.excellence-section{
    background:#fff;
    position:relative;
    overflow:hidden;
  }
 
  /* ===== Heading ===== */
  .section-badge{
    display:inline-block;
    background:var(--srk-maroon);
    color:var(--srk-white);
    padding:8px 22px;
    border-radius:50px;
    font-size:12.5px;
    letter-spacing:1.5px;
    font-weight:600;
    text-transform:uppercase;
  }
 
  .section-title{
    font-size:42px;
    font-weight:800;
    color:var(--srk-navy);
    margin-top:16px;
  }
  .section-title span{ color:var(--srk-maroon); }
 
  .section-desc{
    max-width:700px;
    margin:14px auto 0;
    color:var(--srk-muted);
    line-height:30px;
    font-size:15.5px;
  }
 
  /* ===== Feature cards (white, image + overlapping icon badge) ===== */
  .srk-feature-card{
    background:var(--srk-white);
    border-radius:18px;
    overflow:visible;
    box-shadow:var(--srk-soft-shadow);
    border:1px solid var(--srk-border);
    margin-bottom:10px;
    transition:transform .35s ease, box-shadow .35s ease;
  }
 
  .srk-feature-card:hover{
    transform:translateY(-8px);
    box-shadow:var(--srk-shadow);
  }
 
  .srk-feature-img{
    position:relative;
    border-radius:18px 18px 0 0;
    overflow:hidden;
    height:165px;
  }
 
  .srk-feature-img img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .5s ease;
  }
 
  .srk-feature-card:hover .srk-feature-img img{
    transform:scale(1.08);
  }
 
  .srk-feature-icon{
    position:absolute;
    right:14px;
    bottom:0px;
    width:42px;
    height:42px;
    border-radius:50%;
    background:var(--srk-maroon);
    color:var(--srk-white);
    display:flex;
    align-items:center;
    justify-content:center;
    border:4px solid var(--srk-white);
    box-shadow:0 8px 18px rgba(126,15,43,.35);
    z-index:2;
  }
  .srk-feature-icon svg{ width:18px; height:18px; stroke:var(--srk-white); }
 
  .srk-feature-content{
    padding:5px 10px 15px;
    text-align:center;
  }
 
  .srk-feature-content h6{
    margin:0;
    font-size:14.5px;
    font-weight:600;
    line-height:1.4;
    color:var(--srk-navy);
  }
 
  /* ===== Center image ===== */
  .center-image{
    position:relative;
    border-radius:26px;
    overflow:hidden;
    border:6px solid var(--srk-white);
    box-shadow:var(--shadow-soft);
    transition:.5s;
  }
 
  .center-image img{
    width:100%;
    display:block;
  }
 
  .center-image:hover{
    transform:translateY(-8px);
  }
 
  .shine{
    position:absolute;
    top:-120%;
    left:-60%;
    width:50%;
    height:300%;
    background:rgba(255,255,255,.28);
    transform:rotate(25deg);
    transition:.8s;
    pointer-events:none;
  }
 
  .center-image:hover .shine{ left:130%; }
 
  .center-badge{
    position:absolute;
    left:50%;
    bottom:0;
    transform:translateX(-50%);
    background:var(--srk-navy);
    color:var(--srk-white);
    font-weight:600;
    font-size:12.5px;
    letter-spacing:.4px;
    padding:10px 24px;
    border-radius:999px 999px 0 0;
    display:flex;
    align-items:center;
    gap:8px;
    z-index:3;
  }
  .center-badge .dot{
    width:7px; height:7px; border-radius:50%;
    background:var(--srk-gold);
  }
 
  /* ===== Responsive ===== */
  @media(max-width:991px){
    .section-title{ font-size:34px; }
    .center-image{ margin:30px 0; }
  }
 
  @media(max-width:576px){
    .section-title{ font-size:27px; }
    .section-desc{ font-size:15px; line-height:28px; }
    .srk-feature-img{ height:170px; }
  }

  .excellence-cta{
    display:inline-flex; align-items:center; gap:.6rem;
    background:var(--srk-navy); color:#fff; font-weight:700; font-size:.95rem;
    padding:.85rem 1.6rem; border-radius:50px; text-decoration:none;
    box-shadow:0 16px 30px -14px rgba(14,27,61,.5);
    transition:transform .2s ease, background .2s ease;
  }
  .excellence-cta:hover{ transform:translateY(-2px); background:var(--srk-maroon); color:#fff; }

  .achv {
    background: #fff;
    position: relative;
    overflow: hidden;
  }
 
  /* faint corner dot pattern, echoes the reference */
  .achv::before,
  .achv::after {
    content: "";
    position: absolute;
    width: 140px;
    height: 140px;
    background-image: radial-gradient(var(--srk-gold) 1.5px, transparent 1.5px);
    background-size: 14px 14px;
    opacity: .25;
  }
  .achv::before { top: 30px; left: -30px; }
  .achv::after { bottom: 20px; right: -30px; }
 
  .achv__inner {
    margin: 0 auto;
    position: relative;
    z-index: 1;
  }
 
  /* ---------- Header ---------- */
  .achv__eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 2px;
    color: var(--srk-gold);
    text-transform: uppercase;
    margin-bottom: 14px;
  }
  .achv__eyebrow svg { flex-shrink: 0; }
 
  .achv__title {
    text-align: center;
    font-size: clamp(28px, 4vw, 40px);
    font-weight: 700;
    color: var(--srk-navy);
    margin: 0 0 14px;
    letter-spacing: -0.5px;
  }
  .achv__title span {
    color: var(--srk-maroon);
    font-weight: 800;
  }
 
  .achv__subtitle {
    text-align: center;
    color: var(--srk-muted);
    font-size: 15.5px;
    margin: 0 0 64px;
    font-weight: 400;
  }
 
  /* ---------- Timeline ---------- */
  .achv__timeline {
    position: relative;
  }
 
  .achv__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 40px;
    position: relative;
    margin-bottom: 56px;
  }
  .achv__row:last-child { margin-bottom: 0; }
 
  .achv__row--reverse .achv__media { order: 2; }
  .achv__row--reverse .achv__content { order: 1; }
 
  /* connecting spine */
  /* .achv__row:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -56px;
    width: 2px;
    height: 56px;
    background: linear-gradient(var(--srk-maroon), var(--srk-maroon));
    opacity: .55;
  } */
 
  /* ---------- Media ---------- */
  .achv__media {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-soft);
    background: var(--srk-navy);
    aspect-ratio: 4 / 3;
    border: 6px solid var(--srk-white);
  }
  .achv__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
 
  /* ---------- Content ---------- */
  .achv__content { position: relative; padding: 4px 10px; }
 
  .achv__row--reverse .achv__content { text-align: right; }
 
  .achv__year {
    display: inline-block;
    background: var(--srk-maroon);
    color: var(--srk-white);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    padding: 5px 16px;
    border-radius: 20px;
    margin-bottom: 14px;
    box-shadow: 0 6px 14px rgba(126,15,43,0.35);
  }
 
  /* connector dot linking badge to the spine */
  .achv__content::before {
    content: "";
    position: absolute;
    top: 15px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--srk-white);
    border: 2px solid var(--srk-maroon);
  }
  .achv__row:not(.achv__row--reverse) .achv__content::before { left: -40px; }
  .achv__row--reverse .achv__content::before { right: -40px; }
  .achv__row:not(.achv__row--reverse) .achv__content::after,
  .achv__row--reverse .achv__content::after {
    content: "";
    position: absolute;
    top: 19px;
    width: 36px;
    height: 1.5px;
    background: var(--srk-maroon);
    opacity: .5;
  }
  .achv__row:not(.achv__row--reverse) .achv__content::after { left: -36px; }
  .achv__row--reverse .achv__content::after { right: -36px; }
 
  .achv__award {
    display: block;
    font-size: 21px;
    font-weight: 700;
    color: var(--srk-maroon);
    margin-bottom: 10px;
  }
 
  .achv__desc {
    font-size: 16px;
    color: var(--srk-text);
    margin: 0 0 10px;
    font-weight: 400;
  }
 
  .achv__rate-label {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--srk-gold);
    display: block;
    margin-bottom: 4px;
    position: relative;
  }
  .achv__rate-label::after {
    content: "";
    display: block;
    width: 28px;
    height: 2px;
    background: var(--srk-gold);
    margin-top: 6px;
  }
  .achv__row--reverse .achv__rate-label::after { margin-left: auto; }
 
  .achv__rate {
    font-size: 30px;
    font-weight: 800;
    color: var(--srk-navy);
    line-height: 1.1;
  }
 
  /* ---------- CTA ---------- */
  .achv__cta-wrap {
    text-align: center;
    margin-top: 72px;
  }
  .achv__cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--srk-maroon);
    color: var(--srk-white);
    font-family: 'Poppins', sans-serif;
    font-size: 14.5px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-decoration: none;
    text-transform: uppercase;
    padding: 15px 32px;
    border-radius: 999px;
    box-shadow: 0 14px 30px rgba(126,15,43,0.3);
    transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
  }
  .achv__cta:hover {
    background: var(--srk-maroon-dark);
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(126,15,43,0.4);
  }
  .achv__cta svg { transition: transform .25s ease; }
  .achv__cta:hover svg { transform: translateX(4px); }
 
  /* ---------- Responsive ---------- */
  @media (max-width: 700px) {
    .achv { padding: 64px 18px 72px; }
    .achv__row,
    .achv__row--reverse {
      grid-template-columns: 1fr;
      gap: 24px;
      margin-bottom: 44px;
    }
    .achv__row--reverse .achv__media,
    .achv__row--reverse .achv__content { order: initial; }
    .achv__row .achv__content,
    .achv__row--reverse .achv__content { text-align: left; }
    .achv__content::before,
    .achv__content::after { display: none; }
    .achv__row:not(:last-child)::after { display: none; }
    .achv__content { padding: 0 4px; }
  }

  @media (max-width: 991.98px) {
  .achv__desc {
    font-size: 12px;
  }
}

