:root{
  --navy:#081b33;
  --navy2:#102c52;
  --royal:rgb(216 149 3 / 94%);
  --yellow:#ffe27a;
  --maroon:#651b2c;
  --ivory:#fffaf0;
  --cream:#f8f0dc;
  --ink:#044a29;
  --muted:#616168;
  --line:rgba(8,27,51,.12);
  --white:#fff;
}
* {
  box-sizing: border-box;
}

html {
  scroll-behavior: auto; /* disable basic smooth */
}

body {
  overscroll-behavior: none;
}

/* Premium feel scrolling */
@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-padding-top: 80px; /* for sticky header */
  }

  body {
    scroll-behavior: smooth;
  }
}

/* Optional: buttery anchor transitions */
:target {
  scroll-margin-top: 90px;
}


.justify-text{
    text-align: justify;
    line-height: 1.9;
}

body {

  
  margin: 0;
  font-family: "Inter", "SF Pro Display", "Segoe UI", "Helvetica Neue",
               system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  color: #616168;
  background: #ffffff;
  overflow-x: hidden;
}

body.menu-open {
  overflow: hidden;
}

a {
  text-decoration: none;
  color: inherit;
}

img {
  max-width: 100%;
  display: block;
}

/* Loader */
.lux-loader {
  position: fixed;
  inset: 0;
  background: var(--ivory);
  display: grid;
  place-items: center;
  z-index: 9999;
  transition: .55s;
}

.lux-loader.hide {
  opacity: 0;
  visibility: hidden;
}

.lux-loader span {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 2px solid rgba(242, 194, 27, .35);
  border-top-color: var(--navy);
  animation: spin .9s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
/* Sticky Header + Slide Out Navigation */
/* ===============================
   STICKY HEADER
================================= */

.lux-sticky-header {
  position: fixed;
  top: 18px;
  left: 0;
  width: 100%;
  z-index: 1000;
  transition: .35s ease;
  pointer-events: none;
}

.nav-shell {
  width: min(1180px, calc(100% - 36px));
  margin: auto;
  height: 76px;
  padding: 10px 12px 10px 14px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  border: 1px solid rgba(255,255,255,.38);
  border-radius: 999px;

  background: rgba(255,250,240,.68);
  backdrop-filter: blur(20px);

  box-shadow: 0 24px 70px rgba(8,27,51,.14);
  pointer-events: auto;
}

.lux-sticky-header.scrolled {
  top: 10px;
}

.lux-sticky-header.scrolled .nav-shell {
  height: 68px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 18px 50px rgba(8,27,51,.12);
}

/* ===============================
   BRAND
================================= */

.brand-lux {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.brand-seal {
  width: 50px;
  height: 50px;
  border-radius: 50%;

  display: grid;
  place-items: center;

  background: linear-gradient(145deg, var(--yellow), var(--royal));
  color: var(--navy);

  font-family: Cormorant Garamond, serif;
  font-size: 30px;
  font-weight: 700;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.75),
    0 14px 28px rgba(242,194,27,.28);
}

.brand-copy b {
  display: block;
  font-size: 14px;
  line-height: 1.05;
  color: var(--navy);
  letter-spacing: .01em;
  white-space: nowrap;
}

.brand-copy small {
  display: block;
  margin-top: 4px;

  color: #8b7018;
  font-size: 9px;
  font-weight: 800;

  letter-spacing: .22em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* ===============================
   DESKTOP MENU
================================= */

.desktop-menu {
  display: flex;
  align-items: center;
  gap: 26px;
}

.desktop-menu a {
  position: relative;
  padding: 9px 0;

  color: var(--navy);
  font-size: 12px;
  font-weight: 800;

  text-transform: uppercase;
  letter-spacing: .14em;
}

.desktop-menu a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 1px;

  width: 0;
  height: 1px;

  background: var(--royal);
  transition: .32s;
}

.desktop-menu a:hover::after {
  width: 100%;
}

/* ===============================
   HEADER ACTIONS
================================= */

.header-actions {
  display: flex;
  align-items: center;
  gap: 9px;
}

.admin-dot {
  height: 40px;
  padding: 0 14px;

  display: inline-flex;
  align-items: center;

  border-radius: 999px;
  border: 1px solid var(--line);

  background: rgba(255,255,255,.54);
  color: var(--navy);

  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .14em;
}

.gold-cta {
  height: 42px;
  padding: 0 19px;

  display: inline-flex;
  align-items: center;

  border-radius: 999px;

  background: linear-gradient(135deg, var(--yellow), var(--royal));
  color: var(--navy);

  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .12em;

  box-shadow: 0 14px 28px rgba(242,194,27,.28);
}

/* ===============================
   MENU TRIGGER
================================= */

.menu-trigger {
  width: 48px;
  height: 48px;
  padding: 13px;

  display: grid;
  place-items: center;

  border-radius: 50%;
  border: 1px solid rgba(8,27,51,.13);

  background: var(--navy);
  cursor: pointer;
}

.menu-trigger span {
  width: 18px;
  height: 1.5px;
  margin: 2px 0;

  display: block;
  background: var(--yellow);

  transition: .25s;
}

.menu-trigger:hover span:nth-child(2) {
  width: 11px;
}

/* ===============================
   MENU BACKDROP
================================= */

.menu-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1001;

  background: rgba(5,14,28,.52);
  backdrop-filter: blur(5px);

  opacity: 0;
  visibility: hidden;
  transition: .35s;
}

.menu-backdrop.active {
  opacity: 1;
  visibility: visible;
}

/* ===============================
   SLIDE MENU
================================= */

.slide-menu {
  position: fixed;
  top: 0;
  right: 0;

  width: min(440px, 92vw);
  height: 100vh;
  padding: 28px;

  display: flex;
  flex-direction: column;

  z-index: 1002;

  background: linear-gradient(
    180deg,
    #fffaf0,
    #fff 48%,
    #fff8e6
  );

  box-shadow: -35px 0 90px rgba(8,27,51,.22);

  transform: translateX(106%);
  transition: .48s cubic-bezier(.19,1,.22,1);
}

.slide-menu.active {
  transform: translateX(0);
}

.slide-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.menu-close {
  width: 46px;
  height: 46px;

  border-radius: 50%;
  border: 1px solid var(--line);

  background: #fff;
  color: var(--navy);

  font-size: 28px;
  line-height: 1;
}

/* ===============================
   MENU HERO CARD
================================= */

.slide-hero-mini {
  position: relative;
  overflow: hidden;

  margin: 34px 0 24px;
  padding: 26px;

  border-radius: 28px;

  background:
    linear-gradient(
      135deg,
      rgba(216, 149, 3, 0.94),
      rgb(212, 167, 3)
    )
}

.slide-hero-mini::after {
  content: "";
  position: absolute;
  top: -60px;
  right: -60px;

  width: 160px;
  height: 160px;
  border-radius: 50%;

  background: rgba(242,194,27,.22);
}

.slide-hero-mini span {
  font-family: Cormorant Garamond, serif;
  font-size: 22px;
  line-height: 1;
}

.slide-hero-mini p {
  margin: 10px 0 0;
  line-height: 1.6;
  color: rgba(255,255,255,.72);
}

/* ===============================
   MENU LINKS
================================= */

.slide-links {
  display: grid;
  gap: 3px;
  margin-top: -8px;
}

.slide-links a {
  display: flex;
  align-items: center;
  gap: 16px;

  padding: 17px 12px;

  border-bottom: 1px solid rgba(8,27,51,.09);

  font-family: Cormorant Garamond, serif;
  font-size: 30px;
  line-height: 1;

  color: var(--navy);
  transition: .25s;
}

.slide-links a:hover {
  padding-left: 22px;
  color: var(--maroon);

  background: rgba(242,194,27,.08);
  border-radius: 18px;
}

.slide-links small {
  font-family: Inter, sans-serif;
  font-size: 11px;
  font-weight: 900;

  letter-spacing: .18em;
  color: #a7830a;
}

/* ===============================
   MENU FOOTER CONTACT
================================= */

.slide-contact {
  margin-top: auto;
  padding-top: 22px;

  display: grid;
  gap: 8px;

  border-top: 1px solid var(--line);
  color: var(--muted);
}

.slide-contact b {
  color: var(--navy);
}

/* ===================================
   STICKY HEADER
=================================== */

.lux-sticky-header {
  position: fixed;
  top: 18px;
  left: 0;
  width: 100%;
  z-index: 1000;
  transition: .35s ease;
  pointer-events: none;
}

.nav-shell {
  width: min(1180px, calc(100% - 36px));
  margin: auto;
  height: 76px;
  padding: 10px 12px 10px 14px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  border: 1px solid rgba(255,255,255,.38);
  border-radius: 999px;

  background: rgba(255,250,240,.68);
  backdrop-filter: blur(20px);

  box-shadow: 0 24px 70px rgba(8,27,51,.14);
  pointer-events: auto;
}

.lux-sticky-header.scrolled {
  top: 10px;
}

.lux-sticky-header.scrolled .nav-shell {
  height: 68px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 18px 50px rgba(8,27,51,.12);
}

/* ===================================
   BRAND
=================================== */

.brand-lux {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.brand-seal {
  width: 50px;
  height: 50px;
  border-radius: 50%;

  display: grid;
  place-items: center;

  background: linear-gradient(145deg, var(--yellow), var(--royal));
  color: var(--navy);

  font-family: Cormorant Garamond, serif;
  font-size: 30px;
  font-weight: 700;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.75),
    0 14px 28px rgba(242,194,27,.28);
}

.brand-copy b {
  display: block;
  font-size: 14px;
  line-height: 1.05;
  color: var(--navy);
  letter-spacing: .01em;
  white-space: nowrap;
}

.brand-copy small {
  display: block;
  margin-top: 4px;

  color: #8b7018;
  font-size: 9px;
  font-weight: 800;

  letter-spacing: .22em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* ===================================
   DESKTOP MENU
=================================== */

.desktop-menu {
  display: flex;
  align-items: center;
  gap: 26px;
}

.desktop-menu a {
  position: relative;
  padding: 9px 0;

  color: var(--navy);
  font-size: 12px;
  font-weight: 800;

  text-transform: uppercase;
  letter-spacing: .14em;
}

.desktop-menu a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 1px;

  width: 0;
  height: 1px;

  background: var(--royal);
  transition: .32s;
}

.desktop-menu a:hover::after {
  width: 100%;
}

/* ===================================
   HEADER ACTIONS
=================================== */

.header-actions {
  display: flex;
  align-items: center;
  gap: 9px;
}

.admin-dot {
  height: 40px;
  padding: 0 14px;

  display: inline-flex;
  align-items: center;

  border-radius: 999px;
  border: 1px solid var(--line);

  background: rgba(255,255,255,.54);
  color: var(--navy);

  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .14em;
}

.gold-cta {
  height: 42px;
  padding: 0 19px;

  display: inline-flex;
  align-items: center;

  border-radius: 999px;

  background: linear-gradient(135deg, var(--yellow), var(--royal));
  color: var(--navy);

  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .12em;

  box-shadow: 0 14px 28px rgba(242,194,27,.28);
}

/* ===================================
   MENU TRIGGER
=================================== */

.menu-trigger {
  width: 48px;
  height: 48px;
  padding: 13px;

  display: grid;
  place-items: center;

  border-radius: 50%;
  border: 1px solid rgba(8,27,51,.13);

  background: var(--navy);
  cursor: pointer;
}

.menu-trigger span {
  width: 18px;
  height: 1.5px;
  margin: 2px 0;

  display: block;
  background: var(--yellow);

  transition: .25s;
}

.menu-trigger:hover span:nth-child(2) {
  width: 11px;
}

/* ===================================
   BACKDROP
=================================== */

.menu-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1001;

  background: rgba(5,14,28,.52);
  backdrop-filter: blur(5px);

  opacity: 0;
  visibility: hidden;
  transition: .35s;
}

.menu-backdrop.active {
  opacity: 1;
  visibility: visible;
}

/* ===================================
   SLIDE MENU
=================================== */

.slide-menu {
  position: fixed;
  top: 0;
  right: 0;

  width: min(440px, 92vw);
  height: 100vh;
  padding: 28px;

  display: flex;
  flex-direction: column;

  z-index: 1002;

  background: linear-gradient(
    180deg,
    #fffaf0,
    #fff 48%,
    #fff8e6
  );

  box-shadow: -35px 0 90px rgba(8,27,51,.22);

  transform: translateX(106%);
  transition: .48s cubic-bezier(.19,1,.22,1);
}

.slide-menu.active {
  transform: translateX(0);
}

.slide-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.menu-close {
  width: 46px;
  height: 46px;

  border-radius: 50%;
  border: 1px solid var(--line);

  background: #fff;
  color: var(--navy);

  font-size: 28px;
  line-height: 1;
}

/* ===================================
   MINI HERO
=================================== */



.slide-hero-mini::after {
  content: "";
  position: absolute;
  top: -60px;
  right: -60px;

  width: 160px;
  height: 160px;
  border-radius: 50%;

  background: rgba(242,194,27,.22);
}



.slide-hero-mini p {
  margin-top: 10px;
  line-height: 1.6;
  color: rgba(255,255,255,.72);
}

/* ===================================
   LINKS
=================================== */

.slide-links {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}



.slide-links a:hover {
  padding-left: 22px;

  color: var(--maroon);
  background: rgba(242,194,27,.08);

  border-radius: 18px;
}

.slide-links small {
  font-family: Inter, sans-serif;
  font-size: 11px;
  font-weight: 900;

  letter-spacing: .18em;
  color: #a7830a;
}

/* ===================================
   CONTACT FOOTER
=================================== */

.slide-contact {
  margin-top: auto;
  padding-top: 22px;

  display: grid;
  gap: 8px;

  border-top: 1px solid var(--line);
  color: var(--muted);
}

.slide-contact b {
  color: var(--navy);
}
/* Hero */
/* ===============================
   HERO SECTION
================================= */

.hero-lux {
  min-height: 100vh;
  padding: 148px 0 80px;
  position: relative;
  isolation: isolate;

  background:
    linear-gradient(
      115deg,
      rgba(250, 252, 255, 0.9),
      rgba(101,27,44,.52) 42%,
      rgba(8,27,51,.65)
    ),
    var(--hero-img, url('../images/hero-campus.jpg'))
    center / cover no-repeat;

  color: #fff;
}

.hero-lux::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;

  background:
    radial-gradient(
      circle at 72% 18%,
      rgba(255,226,122,.45),
      transparent 25%
    ),
    linear-gradient(
      180deg,
      rgba(0,0,0,.1),
      rgba(8,27,51,.7)
    );
}

.hero-lux::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 120px;
  z-index: -1;

  background: linear-gradient(
    180deg,
    transparent,
    #fff
  );
}

/* ===============================
   HERO LAYOUT
================================= */

.hero-shell {
  min-height: calc(100vh - 220px);

  display: grid;
  grid-template-columns: 1.04fr .78fr;
  align-items: end;
  gap: 50px;
}

.hero-copy {
  max-width: 760px;
}

/* ===============================
   HERO TAG
================================= */

.eyebrow {
  display: inline-flex;
  padding: 10px 15px;

  border: 1px solid rgba(255,226,122,.38);
  border-radius: 999px;

  background: rgba(255,255,255,.09);
  backdrop-filter: blur(10px);

  font-size: 12px;
  font-weight: 400;
  letter-spacing: .42em;
  text-transform: uppercase;

  color: var(--yellow);
}

/* ===============================
   HERO TEXT
================================= */

.hero-lux h1 {
  margin: 24px 0;

  font-family: Cormorant Garamond, serif;
  font-weight: 700;

  font-size: clamp(58px, 8vw, 118px);
  line-height: .9;
  letter-spacing: -.045em;

  color: #fff;
  text-shadow: 0 18px 55px rgba(0,0,0,.24);
}

.hero-lux p {
  max-width: 610px;

  font-size: 18px;
  line-height: 1.85;

  color: rgba(255,255,255,.78);
}

/* ===============================
   HERO BUTTONS
================================= */

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;

  margin-top: 34px;
}

.btn-gold,
.gold-cta {
  transition: .25s;
}

.btn-gold {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 14px 24px;
  border-radius: 999px;

  background: linear-gradient(
    135deg,
    var(--yellow),
    var(--royal)
  );

  color: var(--navy);

  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .12em;

  box-shadow: 0 20px 40px rgba(242,194,27,.28);
}

.btn-outline-lux {
  padding: 14px 24px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.38);

  background: rgba(255,255,255,.08);
  backdrop-filter: blur(12px);

  color: #fff;

  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .12em;
}

.btn-gold:hover,
.gold-cta:hover {
  transform: translateY(-2px);
}

/* ===============================
   HERO SIDE PANEL
================================= */

.hero-panel {
  align-self: end;
  padding: 26px;

  border-radius: 34px;
  border: 1px solid rgba(255,255,255,.5);

  background: rgba(255,250,240,.9);
  backdrop-filter: blur(18px);

  color: var(--navy);

  box-shadow: 0 30px 90px rgba(0,0,0,.22);
}

.hero-panel img {
  width: 100%;
  height: 235px;

  object-fit: cover;

  border-radius: 24px;
  border: 1px solid rgba(8,27,51,.08);

  background: var(--cream);
}

/* ===============================
   STATS STRIP
================================= */

.stat-strip {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 1px;

  margin-top: 16px;
  overflow: hidden;

  border-radius: 24px;
  border: 1px solid rgba(8,27,51,.08);

  background: rgba(8,27,51,.1);
}

.stat-strip div {
  padding: 18px 10px;
  text-align: center;

  background: rgba(255,255,255,.76);
}

.stat-strip b {
  display: block;

  font-size: 26px;
  color: var(--navy);
}

.stat-strip span {
  font-size: 9px;
  font-weight: 900;

  letter-spacing: .16em;
  text-transform: uppercase;

  color: #8b7018;
}
/* ===================================
   SECTIONS / COMMON LAYOUT
=================================== */

.section {
  padding: 110px 0;
}

.section-soft {
  background: linear-gradient(
    180deg,
    var(--ivory),
    #fff
  );
}

/* ===================================
   SECTION TITLE
=================================== */

.section-title {
  max-width: 780px;
  margin-bottom: 50px;
}

.section-title.center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.kicker {
  font-size: 14px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: .42em;
  color: #e4b407;
}

.section-title h2 {
  margin: 12px 0;

  font-family: Cormorant Garamond, serif;
  font-size: clamp(30px, 4vw, 35px);
  line-height: .98;
  

  color: var(--navy);
}

.section-title p {
  color: var(--muted);
  line-height: 1.8;
  letter-spacing: .01em;
}

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

.lux-card {
  height: 100%;
  padding: 34px;

  position: relative;
  overflow: hidden;

  border: 1px solid var(--line);
  border-radius: 30px;

  background: #fff;
  transition: .35s;
}

.lux-card::before {
  content: "";
  position: absolute;
  top: -42px;
  right: -42px;

  width: 120px;
  height: 120px;
  border-radius: 50%;

  background: var(--yellow);
  opacity: .14;
}

.lux-card:hover {
  transform: translateY(-8px);
  border-color: rgba(242,194,27,.48);
  box-shadow: 0 28px 70px rgba(8,27,51,.1);
}

.lux-card h3 {
  font-family: Cormorant Garamond, serif;
  font-size: 31px;
  color: var(--navy);
}

.lux-card p {
  color: var(--muted);
  line-height: 1.8;
}

.feature-no {
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .18em;
  color: #a17b05;
}

/* ===================================
   SPLIT SECTION
=================================== */

.split {
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 70px;
  align-items: center;
}

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

.image-frame {
  padding: 12px;

  border: 1px solid var(--line);
  border-radius: 34px;

  background: #fff;
  box-shadow: 0 28px 80px rgba(8,27,51,.09);
}

.image-frame img {
  width: 100%;
  border-radius: 24px;
}

/* ===================================
   PILLS
=================================== */

.pill-list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;

  margin-top: 26px;
}

.pill-list span {
  padding: 12px 16px;

  border: 1px solid var(--line);
  border-radius: 999px;
  letter-spacing: .01454em;

  background: #fff;
  color: var(--navy);

  font-size: 12px;
  font-weight: 400;
}

/* ===================================
   INNER PAGE HERO
=================================== */

.page-hero {
  padding: 170px 0 90px;

  background:
    linear-gradient(
      135deg,
      rgba(8,27,51,.86),
      rgba(101,27,44,.55)
    ),
    url('/sengol-luxury1/assets/images/hero-campus.jpg') center / cover;

  border-bottom: 1px solid var(--line);
  color: #fff;
}

.page-hero h1 {
  font-family: Cormorant Garamond, serif;
  font-size: 43px;
  line-height: 1.5;
  color: var(--yellow);
}

.page-hero p {
  max-width: 720px;

  color: rgba(255, 255, 255, 0.76);
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: .10em;
}

/* ===================================
   CONTACT / LOGIN BOX
=================================== */

.contact-box,
.login-box {
  max-width: 520px;
  margin: auto;
  padding: 38px;

  border: 1px solid var(--line);
  border-radius: 34px;

  background: #fff;
  box-shadow: 0 30px 90px rgba(8,27,51,.09);
}

.form-control {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
}

/* ===================================
   FOOTER
=================================== */

.footer-lux {
  padding: 70px 0 24px;

  background: var(--navy);
  color: #d8dfec;
}

.footer-brand {
  font-family: Cormorant Garamond, serif;
  font-size: 36px;
  color: #fff;
}

.footer-lux h6 {
  color: var(--yellow);

  font-size: 12px;
  font-weight: 900;

  letter-spacing: .12em;
  text-transform: uppercase;
}

.footer-lux a {
  display: block;
  margin: 10px 0;
  color: #d8dfec;
}

.footer-bottom {
  margin-top: 44px;
  padding-top: 20px;

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

  font-size: 13px;
  color: #9aa8bd;
}

/* ===================================
   ADMIN PANEL
=================================== */

.admin-wrap {
  min-height: 100vh;
  padding: 120px 0;

  background: linear-gradient(
    180deg,
    #fff9e4,
    #fff
  );
}

.dash-card {
  padding: 28px;

  border: 1px solid var(--line);
  border-radius: 28px;

  background: #fff;
  box-shadow: 0 20px 60px rgba(8,27,51,.08);
}

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

.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: .75s ease;
}

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

/* ===================================
   RESPONSIVE - TABLET
=================================== */

@media (max-width:1100px){

  .desktop-menu {
    display: none;
  }

  .nav-shell {
    height: 70px;
  }

  .admin-dot {
    display: none;
  }

  .hero-shell {
    grid-template-columns: 1fr;
  }

  .hero-panel {
    max-width: 560px;
  }

  .hero-lux {
    padding-top: 130px;
  }

}

/* ===================================
   RESPONSIVE - MOBILE
=================================== */

@media (max-width:680px){

  .lux-sticky-header {
    top: 10px;
  }

  .nav-shell {
    width: calc(100% - 20px);
    border-radius: 28px;
  }

  .brand-copy b {
    font-size: 12px;
  }

  .brand-copy small {
    font-size: 8px;
  }

  .brand-seal {
    width: 44px;
    height: 44px;
  }

  .gold-cta {
    display: none;
  }

  .hero-lux {
    padding: 120px 0 64px;
  }

  .hero-shell {
    min-height: auto;
  }

  .hero-lux h1 {
    font-size: 56px;
  }

  .hero-panel {
    padding: 16px;
    border-radius: 26px;
  }

  .hero-panel img {
    height: 180px;
  }

  .stat-strip {
    grid-template-columns: 1fr;
  }

  .section {
    padding: 78px 0;
  }

  .split {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .slide-menu {
    padding: 20px;
  }

  .slide-links a {
    font-size: 18px;
  }

  .page-hero {
    padding-top: 140px;
  }

}

.hero-slider-lux {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  isolation: isolate;
}

.hero-slide {
  position: absolute;
  inset: 0;
  min-height: 100vh;
  padding: 148px 0 80px;

  display: flex;
  align-items: flex-end;

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  opacity: 0;
  visibility: hidden;
  transform: scale(1.04);

  transition:
    opacity 1s ease,
    visibility 1s ease,
    transform 4.5s ease;
}

.hero-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;

  background:
    radial-gradient(
      circle at 72% 18%,
      rgba(255,226,122,.42),
      transparent 25%
    ),
    linear-gradient(
      115deg,
      rgba(8,27,51,.92),
      rgba(101,27,44,.52) 42%,
      rgba(8,27,51,.72)
    );
}

.hero-slide::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 120px;
  z-index: 0;

  background: linear-gradient(
    180deg,
    transparent,
    #fff
  );
}

.hero-slide.active {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  z-index: 2;
}

.hero-slide .container {
  position: relative;
  z-index: 3;
}

.hero-slider-lux .hero-shell {
  min-height: calc(100vh - 220px);
  display: flex;
  align-items: flex-end;
}

.hero-slider-lux .hero-copy {
  max-width: 760px;
}

.hero-dots {
  position: absolute;
  left: 50%;
  bottom: 42px;
  z-index: 10;

  display: flex;
  gap: 10px;

  transform: translateX(-50%);
}

.hero-dots button {
  width: 38px;
  height: 4px;

  border: 0;
  border-radius: 999px;

  background: rgba(255,255,255,.42);
  cursor: pointer;

  transition: .3s;
}

.hero-dots button.active {
  width: 62px;
  background: var(--yellow);
}


.hero-center-up{
  min-height: calc(100vh - 220px);
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-55px);
}

.hero-title-gold{
  color: var(--yellow);
  text-shadow: 0 18px 45px rgba(0,0,0,.30);
}

.hero-text-light{
  color: rgba(255,255,255,.92);
  max-width: 760px;
}

.hero-tag-light{
  color: #fff;
  border-color: rgba(255,255,255,.35);
  background: rgba(255,255,255,.08);
}


/* Remove blue hover from all links */
a:hover,
a:focus,
a:active {
  color: inherit !important;
  text-decoration: none;
  outline: none;
}

/* Buttons hover no blue */
button:hover,
button:focus,
button:active {
  outline: none;
  box-shadow: none;
}

/* Bootstrap buttons fix */
.btn:hover,
.btn:focus,
.btn:active {
  box-shadow: none !important;
  color: inherit !important;
}

/* Mobile tap blue highlight remove */
a,
button,
input,
textarea,
select {
  -webkit-tap-highlight-color: transparent;
}



.nature-footer {
  position: relative;
  width: 100%;
  min-height: 620px;
  overflow: hidden;
  background: #0d5a5a;
  color: #fff;
  border-radius: 0;
}

.nature-footer-art {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.nature-footer-art img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.nature-footer-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0) 0%,
      rgba(12,83,84,.12) 32%,
      rgba(8,76,77,.92) 60%,
      rgba(8,76,77,.98) 100%
    );
}

.nature-footer-content {
  position: relative;
  z-index: 3;
  min-height: 620px;
  padding: 320px 0 40px;
}

.nature-footer-title h2 {
  margin: 0;
  max-width: 430px;
  color: #f3eac6;
  font-size: clamp(34px, 4vw, 56px);
  font-weight: 700;
  line-height: .98;
  letter-spacing: -.04em;
}

.nature-footer-main {
  margin-top: 70px;
  display: grid;
  grid-template-columns: 1fr 1.6fr auto;
  gap: 50px;
  align-items: start;
}

.footer-school {
  max-width: 280px;
}

.footer-logo-mark {
  width: 44px;
  height: 44px;
  margin-bottom: 12px;
  border: 2px solid rgba(255,255,255,.8);
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: #fff8dc;
  font-weight: 900;
  font-size: 24px;
}

.footer-school h3 {
  margin: 0 0 8px;
  font-size: 17px;
  font-weight: 700;
  color: #fff;
}

.footer-school p {
  margin: 0;
  color: rgba(255,255,255,.7);
  font-size: 13px;
  line-height: 1.6;
}

.footer-links-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}

.footer-links-grid div {
  padding-left: 18px;
  border-left: 2px solid rgba(112,211,154,.45);
}

.footer-links-grid a {
  display: block;
  margin-bottom: 13px;
  color: rgba(255,255,255,.78);
  font-size: 13px;
  transition: .25s;
}

.footer-links-grid a:hover {
  color: #fff8dc;
  transform: translateX(4px);
}

.footer-contact-btn {
  min-width: 130px;
  height: 48px;
  padding: 0 22px;
  border-radius: 8px;
  background: #efc34c;
  color: #073f40;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.footer-contact-btn:hover {
  color: #073f40;
  background: #073f40;
}

.nature-footer-bottom {
  margin-top: 38px;
  padding-top: 26px;
  border-top: 2px solid rgba(255,255,255,.5);
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
}

.nature-footer-bottom p {
  margin: 0 0 4px;
  font-size: 13px;
  color: #fff;
}

.nature-footer-bottom small {
  color: rgba(255,255,255,.65);
  font-size: 11px;
}

.footer-social {
  display: flex;
  gap: 18px;
}

.footer-social a {
  color: #7ee39e;
  font-size: 13px;
  font-weight: 900;
}

/* Tablet */
@media (max-width: 992px) {
  .nature-footer-content {
    padding-top: 300px;
  }

  .nature-footer-main {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .footer-links-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .footer-contact-btn {
    width: max-content;
  }
}

/* Mobile */
@media (max-width: 768px) {
  .nature-footer {
    min-height: auto;
  }

  .nature-footer-content {
    min-height: auto;
    padding: 240px 0 32px;
  }

  .nature-footer-title h2 {
    max-width: 320px;
    font-size: 36px;
  }

  .nature-footer-main {
    margin-top: 42px;
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .footer-links-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .nature-footer-bottom {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Small Mobile */
@media (max-width: 480px) {
  .nature-footer-content {
    padding-top: 210px;
  }

  .nature-footer-title h2 {
    font-size: 32px;
  }

  .footer-contact-btn {
    width: 100%;
  }

  .footer-social {
    flex-wrap: wrap;
  }
}

/* ===== SECTION ===== */
.gallery-curve-section {
  padding: 100px 6vw;
  background:
    radial-gradient(circle at 12% 20%, rgba(242,194,27,.12), transparent 28%),
    linear-gradient(180deg, #fff, #f9f6ef);
}

/* ===== HEAD ===== */
.gallery-curve-head {
  max-width: 720px;
  margin: 0 auto 60px;
  text-align: center;
}

.gallery-curve-head h2 {
  margin: 12px 0;
  font-family: Cormorant Garamond, serif;
  font-size: clamp(30px, 4vw, 35px);
  line-height: .95;
  color: #0b1f3a;
}

.gallery-curve-head p {
  color: #5f6b7a;
  line-height: 1.7;
}

/* ===== GRID ===== */
.gallery-curve-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr 1fr;
  grid-auto-rows: 260px;
  gap: 16px;
}

/* ===== ITEMS ===== */
.gallery-curve-item {
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  background: #eee;
}

/* Image */
.gallery-curve-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 1s ease;
}

.gallery-curve-item:hover img {
  transform: scale(1.08);
}

/* Overlay */
.gallery-curve-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    transparent 40%,
    rgba(0,0,0,.65)
  );
}

/* Caption */
.gallery-caption {
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  color: #fff;
  z-index: 2;
}

.gallery-caption small {
  display: block;
  font-size: 11px;
  letter-spacing: .18em;
  color: #f2c21b;
  margin-bottom: 6px;
}

.gallery-caption h3 {
  margin: 0;
  font-family: Cormorant Garamond, serif;
  font-size: 20px;
}

/* ===== UNIQUE SHAPES ===== */
.gallery-item-1 { grid-row: span 2; border-radius: 40px 40px 40px 90px; }
.gallery-item-2 { border-radius: 40px 110px 40px 40px; }
.gallery-item-3 { border-radius: 110px 40px 40px 40px; }
.gallery-item-4 { border-radius: 40px; }
.gallery-item-5 { border-radius: 40px 40px 110px 40px; }
.gallery-item-6 { border-radius: 40px 40px 40px 95px; }

/* ===== TABLET ===== */
@media (max-width: 900px) {
  .gallery-curve-grid {
    grid-template-columns: 1fr 1fr;
  }

  .gallery-item-1 {
    grid-row: auto;
  }

  .gallery-curve-item {
    height: 260px;
  }
}

/* ===== MOBILE ===== */
@media (max-width: 600px) {
  .gallery-curve-section {
    padding: 70px 20px;
  }

  .gallery-curve-grid {
    grid-template-columns: 1fr;
  }

  .gallery-curve-item {
    height: 240px;
    border-radius: 24px !important;
  }

  .gallery-caption h3 {
    font-size: 26px;
  }
}

.stats-soft-section {
  position: relative;
  padding: 100px 0;
  overflow: hidden;
  background: #f9f6ef;
}

.stats-soft-section {
  position: relative;
  padding: 100px 0;
  overflow: hidden;
  background: #f9f6ef;
}

/* Campus Image (soft, not loud) */
.stats-soft-bg {
  position: absolute;
  inset: 0;
   background: url('../images/hero-campus.jpg') center / cover no-repeat;
  opacity: 0.65;               /* important: keep low */
  filter: blur(3px) brightness(1.05) saturate(85%);
  transform: scale(1.05);      /* smooth zoom for premium feel */
}

/* Soft luxury overlay */
.stats-soft-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgb(9 77 78),
      rgba(255, 255, 255, 0.073)
    );
}

.stats-soft-content {
  position: relative;
  z-index: 2;
}

/* ===== Heading ===== */
.stats-soft-intro {
  max-width: 720px;
  margin: 0 auto 60px;
  text-align: center;
}

.stats-soft-intro h2 {
  margin: 14px 0;
  font-family: Cormorant Garamond, serif;
  font-size: clamp(30px, 4vw, 35px);
  line-height: .95;
  color: rgb(255 255 255 / 77%);
}

.stats-soft-intro p {
  color: rgb(255 255 255 / 96%);
  line-height: 1.8;
}

/* ===== Grid ===== */
.stats-soft-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 38px 20px;
  text-align: center;
}

/* ===== Items ===== */
.stat-soft-item {
  padding: 28px 20px;
  border-radius: 8px;
  background: rgb(255, 254, 254);
  border: 1px solid #ffe27a;
  backdrop-filter: blur(8px);
  transition: .3s ease;
}

.stat-soft-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 50px rgba(8,27,51,.06);
}

/* ===== Numbers (SOFT, NOT LOUD) ===== */
.stat-soft-item h3 {
  margin: 0 0 6px;
  font-family: Cormorant Garamond, serif;
  font-size: clamp(24px, 4vw, 22px);
  font-weight: 500;
  color: #c79605; /* muted gold */
  letter-spacing: -.02em;
}

/* ===== Labels ===== */
.stat-soft-item span {
  font-size: 16px;
  font-weight: 400;
  color: var(--navy);
  opacity: .75;
}

/* ===== Responsive ===== */
@media (max-width: 992px) {
  .stats-soft-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .stats-soft-section {
    padding: 70px 0;
  }

  .stats-soft-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .stat-soft-item {
    padding: 22px;
  }

  .stat-soft-item h3 {
    font-size: 38px;
  }
}


.why-image-section {
  padding: 100px 0;
  background: linear-gradient(180deg, var(--ivory), #fff);
}

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

/* ===== Card ===== */
.why-image-card {
  position: relative;
  border-radius: 30px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
  transition: .35s ease;
}



/* ===== Image ===== */
.why-image {
  height: 220px;
  overflow: hidden;
}

.why-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 1s ease;
}


/* ===== Content ===== */
.why-content {
  padding: 22px;
  background: linear-gradient(180deg, #fff, #fffaf0);
}

.why-content span {
  display: inline-block;
  margin-bottom: 8px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .18em;
  color: var(--royal);
}

.why-content h3 {
  margin: 6px 0 10px;
  font-family: Cormorant Garamond, serif;
  font-size: 28px;
  color: var(--navy);
}

.why-content p {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}

/* ===== Responsive ===== */
@media (max-width: 992px) {
  .why-image-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .why-image-section {
    padding: 70px 0;
  }

  .why-image-grid {
    grid-template-columns: 1fr;
  }

  .why-image {
    height: 200px;
  }
}

.brand-logo img {
  height: 56px;
  width: auto;
}


.footer-logo img {
  height: 99px;
  width: auto;
}




.about-identity-section,
.about-vmv-section,
.principal-soft-section {
  padding: 95px 6vw;
}

.about-identity-section {
  background: linear-gradient(180deg, #fff, var(--ivory));
}

.about-identity-wrap {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 56px;
  align-items: center;
}

.about-identity-image {
  overflow: hidden;
  border-radius: 44px 44px 44px 150px;
}

.about-identity-image img {
  width: 100%;
  height: 520px;
  object-fit: cover;
}

.about-identity-content h2,
.about-vmv-head h2,
.principal-quote h2 {
  margin: 16px 0;
  font-family: Cormorant Garamond, serif;
  font-size: clamp(30px, 4vw, 35px);
  line-height: .92;
  color: var(--navy);
}

.about-identity-content p,
.about-vmv-head p,
.principal-quote p,
.vmv-card p {
  color: var(--muted);
  line-height: 1.5;
}

.identity-points {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 32px;
}

.identity-points div {
  padding: 20px;
  border-radius: 24px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
}

.identity-points b,
.vmv-card small {
  display: block;
  margin-bottom: 10px;
  color: var(--royal);
  font-weight: 900;
}

.identity-points span {
  color: var(--navy);
  font-weight: 500;
}

/* VMV */
.about-vmv-section {
  background: #fff;
}

.about-vmv-head {
  max-width: 760px;
  margin: 0 auto 46px;
  text-align: center;
}

.about-vmv-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.vmv-card {
  min-height: 310px;
  padding: 34px;
  border-radius: 36px;
  background: linear-gradient(180deg, #fff, #fffaf0);
  border: 1px solid rgba(8,27,51,.08);
  box-shadow: 0 18px 50px rgba(8,27,51,.05);
}

.vmv-card h3 {
  margin: 70px 0 12px;
  font-family: Cormorant Garamond, serif;
  font-size: 38px;
  color: var(--navy);
}

/* Principal */
.principal-soft-section {
  background: linear-gradient(180deg, var(--ivory), #fff);
}

.principal-soft-card {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 46px;
  align-items: center;
  padding: 34px;
  border-radius: 52px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
  box-shadow: 0 28px 80px rgba(8,27,51,.08);
}

.principal-quote {
  padding: 20px 20px 20px 30px;
}

.principal-quote strong {
  display: block;
  margin-top: 24px;
  color: var(--navy);
}

.principal-image {
  overflow: hidden;
  border-radius: 38px 120px 38px 38px;
}

.principal-image img {
  width: 100%;
  height: 430px;
  object-fit: cover;
}

/* Responsive */
@media (max-width: 992px) {
  .about-identity-wrap,
  .principal-soft-card {
    grid-template-columns: 1fr;
  }

  .about-vmv-grid,
  .identity-points {
    grid-template-columns: 1fr;
  }

  .about-identity-image img,
  .principal-image img {
    height: 340px;
  }
}

@media (max-width: 576px) {
  .about-identity-section,
  .about-vmv-section,
  .principal-soft-section {
    padding: 70px 20px;
  }

  .about-identity-image,
  .principal-image {
    border-radius: 28px 28px 28px 90px;
  }

  .principal-soft-card {
    padding: 18px;
    border-radius: 34px;
  }

  .principal-quote {
    padding: 10px;
  }
}


/* ===== COMMON ===== */
.about-head {
  max-width: 760px;
  margin: 0 auto 50px;
  text-align: center;
}

.about-head h2 {
  margin: 14px 0;
  font-family: Cormorant Garamond, serif;
  font-size: clamp(30px,4vw,35px);
  line-height: .95;
  color: var(--navy);
}

/* ===== TIMELINE ===== */
.timeline-premium-section {
  padding: 95px 6vw;
  background: linear-gradient(180deg,#fff,var(--ivory));
}

.timeline-premium {
  position: relative;
  max-width: 980px;
  margin: auto;
}

.timeline-premium::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  background: rgba(8,27,51,.14);
}

.timeline-node {
  width: 50%;
  padding: 18px 38px;
  position: relative;
}

.timeline-node:nth-child(even) {
  margin-left: auto;
}

.timeline-node::before {
  content: "";
  position: absolute;
  top: 34px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--royal);
  box-shadow: 0 0 0 8px rgba(242,194,27,.18);
}

.timeline-node:nth-child(odd)::before {
  right: -7px;
}

.timeline-node:nth-child(even)::before {
  left: -7px;
}

.timeline-year {
  color: var(--royal);
  font-weight: 900;
  letter-spacing: .16em;
}

.timeline-content {
  margin-top: 10px;
  padding: 26px;
  border-radius: 28px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
  box-shadow: 0 18px 50px rgba(8,27,51,.06);
}

.timeline-content span {
  color: rgba(8,27,51,.28);
  font-weight: 900;
}

.timeline-content h3 {
  margin: 16px 0 0;
  font-family: Cormorant Garamond, serif;
  color: var(--navy);
  font-size: 20px;
}

/* ===== STAFF CARDS ===== */
.staff-profile-section {
  padding: 95px 6vw;
  background: #fff;
}

.staff-profile-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 22px;
}

.staff-card {
  overflow: hidden;
  border-radius: 34px;
  background: linear-gradient(180deg,#fff,#fffaf0);
  border: 1px solid rgba(8,27,51,.08);
  box-shadow: 0 22px 60px rgba(8,27,51,.06);
  transition: .35s;
}

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

.staff-card img {
  width: 100%;
  height: 260px;
  object-fit: cover;
}

.staff-card div {
  padding: 24px;
}

.staff-card h3 {
  font-family: Cormorant Garamond, serif;
  color: var(--navy);
  font-size: 22px;
}

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

/* ===== ORG CHART ===== */
.org-chart-section {
  padding: 95px 6vw;
  background: var(--ivory);
}

.org-chart {
  max-width: 980px;
  margin: auto;
  text-align: center;
}

.org-box {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 72px;
  padding: 18px 28px;
  border-radius: 24px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.1);
  color: var(--navy);
  font-weight: 900;
  box-shadow: 0 18px 50px rgba(8,27,51,.06);
}

.org-top {
  background: linear-gradient(135deg,var(--yellow),var(--royal));
}

.org-line {
  width: 1px;
  height: 42px;
  margin: 0 auto;
  background: rgba(8,27,51,.18);
}

.org-branches {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 18px;
  margin-top: 32px;
  position: relative;
}

.org-branches.small {
  margin-top: 24px;
}

/* ===== INTERACTIVE FOUNDER ===== */
.founder-interactive-section {
  padding: 95px 6vw;
  background: linear-gradient(180deg,#fff,var(--ivory));
}

.founder-interactive-card {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 50px;
  align-items: center;
  padding: 30px;
  border-radius: 54px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
  box-shadow: 0 30px 90px rgba(8,27,51,.08);
}

.founder-photo {
  overflow: hidden;
  border-radius: 44px 130px 44px 44px;
}

.founder-photo img {
  width: 100%;
  height: 480px;
  object-fit: cover;
}

.founder-message h2 {
  margin: 16px 0;
  font-family: Cormorant Garamond, serif;
  font-size: clamp(30px,4vw,35px);
  line-height: .92;
  color: var(--navy);
}

.founder-message p {
  color: var(--muted);
  line-height: 1.5;
}

.message-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 28px 0;
}

.message-tabs button {
  border: 1px solid rgba(8,27,51,.1);
  background: #fff;
  color: var(--navy);
  padding: 11px 18px;
  border-radius: 999px;
  font-weight: 900;
  cursor: pointer;
}

.message-tabs button.active {
  background: linear-gradient(135deg,var(--yellow),var(--royal));
}

/* ===== RESPONSIVE ===== */
@media(max-width: 992px) {
  .staff-profile-grid,
  .org-branches,
  .founder-interactive-card {
    grid-template-columns: 1fr;
  }

  .timeline-premium::before {
    left: 8px;
  }

  .timeline-node {
    width: 100%;
    padding-left: 34px;
    padding-right: 0;
  }

  .timeline-node:nth-child(even) {
    margin-left: 0;
  }

  .timeline-node::before,
  .timeline-node:nth-child(odd)::before,
  .timeline-node:nth-child(even)::before {
    left: 1px;
    right: auto;
  }
}

@media(max-width: 576px) {
  .timeline-premium-section,
  .staff-profile-section,
  .org-chart-section,
  .founder-interactive-section {
    padding: 70px 20px;
  }

  .founder-interactive-card {
    padding: 16px;
    border-radius: 4px;
  }

  .founder-photo {
    border-radius: 28px 90px 28px 28px;
  }

  .founder-photo img {
    height: 320px;
  }

  .staff-card img {
    height: 220px;
  }
}


.academics-intro-section,
.learning-stage-section,
.curriculum-section,
.teaching-method-section,
.academic-support-section,
.academic-cta-section {
  padding: 95px 6vw;
}

.academics-intro-section,
.curriculum-section,
.academic-support-section {
  background: linear-gradient(180deg, #fff, var(--ivory));
}

.learning-stage-section,
.teaching-method-section {
  background: #fff;
}

.academic-head {
  max-width: 760px;
  margin: 0 auto 48px;
  text-align: center;
}

.academic-head h2,
.academic-intro-text h2,
.teaching-method-content h2,
.academic-cta-box h2 {
  margin: 16px 0;
  font-family: Cormorant Garamond, serif;
  font-size: clamp(30px, 5vw, 45px);
  line-height: .92;
  color: var(--navy);
}

.academic-head p,
.academic-intro-text p,
.teaching-method-content p,
.support-card p,
.academic-cta-box p {
  color: var(--muted);
  line-height: 1.85;
}

.academic-intro-wrap {
  display: grid;
  grid-template-columns: 1fr .9fr;
  gap: 56px;
  align-items: center;
}

.academic-intro-image {
  overflow: hidden;
  border-radius: 44px 44px 130px 44px;
}

.academic-intro-image img {
  width: 100%;
  height: 480px;
  object-fit: cover;
}

/* Learning Stages */
.learning-stage-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 18px;
}

.learning-stage-card {
  min-height: 300px;
  padding: 30px;
  border-radius: 34px;
  background: linear-gradient(180deg, #fff, #fffaf0);
  border: 1px solid rgba(8,27,51,.08);
  box-shadow: 0 18px 50px rgba(8,27,51,.05);
}

.learning-stage-card small {
  color: var(--royal);
  font-weight: 500;
}

.learning-stage-card h3 {
  margin: 68px 0 12px;
  font-family: Cormorant Garamond, serif;
  font-size: 24px;
  color: var(--navy);
}

.learning-stage-card p {
  color: var(--muted);
  line-height: 1.7;
}

/* Curriculum */
.curriculum-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 14px;
}

.curriculum-item {
  padding: 22px;
  border-radius: 24px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
  display: flex;
  gap: 14px;
  align-items: center;
}

.curriculum-item b {
  color: var(--royal);
}

.curriculum-item span {
  color: var(--navy);
  font-weight: 900;
}

/* Teaching Method */
.teaching-method-card {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 50px;
  align-items: center;
  padding: 30px;
  border-radius: 54px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
  box-shadow: 0 30px 90px rgba(8,27,51,.08);
}

.teaching-method-image {
  overflow: hidden;
  border-radius: 44px 130px 44px 44px;
}

.teaching-method-image img {
  width: 100%;
  height: 460px;
  object-fit: cover;
}

.method-points {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 14px;
  margin-top: 30px;
}

.method-points div {
  padding: 18px;
  border-radius: 22px;
  background: linear-gradient(180deg, #fff, #fffaf0);
  border: 1px solid rgba(8,27,51,.08);
  color: var(--navy);
  font-weight: 900;
}

/* Support */
.support-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 18px;
}

.support-card {
  padding: 30px;
  border-radius: 32px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
}

.support-card h3 {
  font-family: Cormorant Garamond, serif;
  font-size: 32px;
  color: var(--navy);
}

/* CTA */
.academic-cta-section {
  background: #fff;
}

.academic-cta-box {
  text-align: center;
  padding: 70px 30px;
  border-radius: 52px 52px 52px 150px;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,226,122,.24), transparent 30%),
    linear-gradient(135deg, var(--navy), #06172c);
  color: #fff;
}

.academic-cta-box span {
  color: var(--yellow);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.academic-cta-box h2,
.academic-cta-box p {
  color: #fff;
}

.academic-cta-box p {
  max-width: 640px;
  margin: 0 auto;
}

.academic-cta-box a {
  display: inline-flex;
  margin-top: 26px;
  padding: 14px 26px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--yellow), var(--royal));
  color: var(--navy);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

/* Responsive */
@media(max-width: 992px) {
  .academic-intro-wrap,
  .teaching-method-card {
    grid-template-columns: 1fr;
  }

  .learning-stage-grid,
  .curriculum-grid,
  .support-grid {
    grid-template-columns: repeat(2,1fr);
  }
}

@media(max-width: 576px) {
  .academics-intro-section,
  .learning-stage-section,
  .curriculum-section,
  .teaching-method-section,
  .academic-support-section,
  .academic-cta-section {
    padding: 70px 20px;
  }

  .learning-stage-grid,
  .curriculum-grid,
  .support-grid,
  .method-points {
    grid-template-columns: 1fr;
  }

  .academic-intro-image img,
  .teaching-method-image img {
    height: 320px;
  }

  .teaching-method-card {
    padding: 16px;
    border-radius: 34px;
  }

  .academic-cta-box {
    padding: 50px 22px;
    border-radius: 34px 34px 34px 90px;
  }
}


.admission-process-section,
.admission-form-section,
.admission-docs-section,
.admission-cta-section {
  padding: 95px 6vw;
}

.admission-process-section,
.admission-docs-section {
  background: linear-gradient(180deg, #fff, var(--ivory));
}

.admission-form-section {
  background: #fff;
}

.admission-head {
  max-width: 760px;
  margin: 0 auto 48px;
  text-align: center;
}

.admission-head h2,
.admission-form-info h2,
.admission-cta-box h2 {
  margin: 16px 0;
  font-family: Cormorant Garamond, serif;
  font-size: clamp(30px, 5vw, 45px);
  line-height: .92;
  color: var(--navy);
}

.admission-head p,
.admission-form-info p {
  color: var(--muted);
  line-height: 1.85;
}

.admission-process-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
}

.admission-step-card {
  min-height: 230px;
  padding: 28px;
  border-radius: 32px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
  box-shadow: 0 18px 50px rgba(8,27,51,.05);
}

.admission-step-card b {
  color: var(--royal);
  font-size: 12px;
  font-weight: 900;
}

.admission-step-card h3 {
  margin: 52px 0 10px;
  font-family: Cormorant Garamond, serif;
  font-size: 30px;
  color: var(--navy);
}

.admission-step-card p {
  color: var(--muted);
  line-height: 1.6;
}

.admission-form-wrap {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 50px;
  align-items: start;
  padding: 34px;
  border-radius: 52px;
  background: linear-gradient(180deg, #fff, #fffaf0);
  border: 1px solid rgba(8,27,51,.08);
  box-shadow: 0 30px 90px rgba(8,27,51,.08);
}

.admission-info-list {
  display: grid;
  gap: 14px;
  margin-top: 30px;
}

.admission-info-list div {
  padding: 18px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
}

.admission-info-list b {
  display: block;
  color: var(--royal);
  font-size: 12px;
  margin-bottom: 6px;
}

.admission-info-list span {
  color: var(--navy);
  font-weight: 700;
}

.admission-form {
  padding: 28px;
  border-radius: 36px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.admission-form input,
.admission-form textarea {
  width: 100%;
  border: 1px solid rgba(8,27,51,.12);
  border-radius: 18px;
  padding: 15px 16px;
  color: var(--navy);
  outline: none;
  font-family: inherit;
  background: #fff;
}

.admission-form textarea {
  grid-column: 1 / -1;
  min-height: 130px;
  resize: vertical;
}

.admission-form input:focus,
.admission-form textarea:focus {
  border-color: var(--royal);
  box-shadow: 0 0 0 4px rgba(242,194,27,.14);
}

.admission-form button {
  margin-top: 18px;
  border: 0;
  border-radius: 999px;
  padding: 15px 28px;
  background: linear-gradient(135deg, var(--yellow), var(--royal));
  color: var(--navy);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .12em;
  cursor: pointer;
}

.form-alert {
  padding: 14px 16px;
  margin-bottom: 16px;
  border-radius: 16px;
  font-weight: 800;
}

.form-alert.success {
  background: rgba(36,145,91,.1);
  color: #14663d;
}

.form-alert.error {
  background: rgba(201,67,67,.1);
  color: #9a2424;
}

.docs-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.docs-grid div {
  padding: 22px;
  border-radius: 26px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
  color: var(--navy);
  font-weight: 900;
}

.admission-cta-section {
  background: #fff;
}

.admission-cta-box {
  text-align: center;
  padding: 70px 30px;
  border-radius: 52px 52px 52px 150px;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,226,122,.24), transparent 30%),
    linear-gradient(135deg, var(--navy), #06172c);
}

.admission-cta-box span {
  color: var(--yellow);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.admission-cta-box h2 {
  color: #fff;
}

.admission-cta-box a {
  display: inline-flex;
  margin-top: 24px;
  padding: 14px 26px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--yellow), var(--royal));
  color: var(--navy);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .12em;
}

@media(max-width: 992px) {
  .admission-process-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .admission-form-wrap {
    grid-template-columns: 1fr;
  }

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

@media(max-width: 576px) {
  .admission-process-section,
  .admission-form-section,
  .admission-docs-section,
  .admission-cta-section {
    padding: 70px 20px;
  }

  .admission-process-grid,
  .docs-grid,
  .form-grid {
    grid-template-columns: 1fr;
  }

  .admission-form-wrap {
    padding: 16px;
    border-radius: 34px;
  }

  .admission-form {
    padding: 18px;
    border-radius: 28px;
  }

  .admission-cta-box {
    padding: 48px 22px;
    border-radius: 34px 34px 34px 90px;
  }
}


.complete-admission-section {
  padding: 95px 6vw;
  background: linear-gradient(180deg, #fff, var(--ivory));
}

.admission-form-shell {
  max-width: 1100px;
  margin: auto;
  padding: 34px;
  border-radius: 46px;
  background: #fff;
  border: 1px solid rgba(8,27,51,.08);
  box-shadow: 0 30px 90px rgba(8,27,51,.08);
}

.admission-form-head {
  max-width: 720px;
  margin-bottom: 38px;
}

.admission-form-head h2 {
  margin: 14px 0;
  font-family: Cormorant Garamond, serif;
  font-size: clamp(30px, 5vw, 45px);
  line-height: .92;
  color: var(--navy);
}

.admission-form-head p {
  color: var(--muted);
  line-height: 1.8;
}

.form-block {
  margin-top: 28px;
  padding: 24px;
  border-radius: 30px;
  background: linear-gradient(180deg, #fff, #fffaf0);
  border: 1px solid rgba(8,27,51,.08);
}

.form-block h3 {
  margin: 0 0 18px;
  font-family: Cormorant Garamond, serif;
  font-size: 32px;
  color: var(--navy);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.complete-admission-form input,
.complete-admission-form select,
.complete-admission-form textarea {
  width: 100%;
  border: 1px solid rgba(8,27,51,.12);
  border-radius: 16px;
  padding: 14px 16px;
  font-family: inherit;
  outline: none;
  background: #fff;
  color: var(--navy);
}

.complete-admission-form textarea {
  min-height: 110px;
  resize: vertical;
  grid-column: 1 / -1;
}

.complete-admission-form input:focus,
.complete-admission-form select:focus,
.complete-admission-form textarea:focus {
  border-color: var(--royal);
  box-shadow: 0 0 0 4px rgba(242,194,27,.14);
}

.checkbox-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.checkbox-grid label,
.declaration {
  color: var(--navy);
  font-weight: 700;
}

.declaration {
  display: flex;
  gap: 10px;
  margin: 26px 0;
}

.complete-admission-form button {
  border: 0;
  border-radius: 999px;
  padding: 15px 30px;
  background: linear-gradient(135deg, var(--yellow), var(--royal));
  color: var(--navy);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
  cursor: pointer;
}

.form-alert {
  padding: 14px 16px;
  margin-bottom: 16px;
  border-radius: 16px;
  font-weight: 800;
}

.form-alert.success {
  background: rgba(36,145,91,.1);
  color: #14663d;
}

.form-alert.error {
  background: rgba(201,67,67,.1);
  color: #9a2424;
}

@media(max-width: 768px) {
  .complete-admission-section {
    padding: 70px 20px;
  }

  .admission-form-shell {
    padding: 18px;
    border-radius: 32px;
  }

  .form-grid,
  .checkbox-grid {
    grid-template-columns: 1fr;
  }

  .form-block {
    padding: 18px;
    border-radius: 24px;
  }
}


.contact-one-section{
  padding:90px 5%;
  background:linear-gradient(180deg,#fff,#fffaf0);
}

.contact-one-wrap{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  max-width:1100px;
  margin:auto;
}

.contact-one-info h2{
  font-family: Cormorant Garamond;
  font-size:48px;
  margin:15px 0;
  color:#0b1f3a;
}

.contact-one-info p{
  color:#666;
  line-height:1.7;
}

.contact-info-box{
  margin-top:15px;
  padding:15px;
  border-radius:16px;
  border:1px solid #eee;
}

.contact-info-box b{
  display:block;
  color:#d4a017;
}

.contact-one-form{
  padding:30px;
  border-radius:30px;
  background:#fff;
  box-shadow:0 20px 60px rgba(0,0,0,.05);
}

.contact-one-form h3{
  font-family: Cormorant Garamond;
  font-size:32px;
  margin-bottom:20px;
}

.contact-one-form input,
.contact-one-form textarea{
  width:100%;
  margin-bottom:12px;
  padding:14px;
  border-radius:12px;
  border:1px solid #ddd;
}

.contact-one-form textarea{
  min-height:120px;
}

.contact-one-form button{
  width:100%;
  padding:14px;
  border-radius:999px;
  border:0;
  background:linear-gradient(135deg,#f2c21b,#e0a800);
  font-weight:700;
  cursor:pointer;
}

.form-msg{
  padding:10px;
  margin-bottom:10px;
  border-radius:10px;
}

.form-msg.success{
  background:#e6f7ed;
  color:#0c6b3c;
}

.form-msg.error{
  background:#ffe6e6;
  color:#a11;
}

/* MAP */
.contact-map{
  margin-top:50px;
  max-width:1100px;
  margin-inline:auto;
  border-radius:30px;
  overflow:hidden;
}

.contact-map iframe{
  width:100%;
  height:400px;
  border:0;
}

/* MOBILE */
@media(max-width:768px){
  .contact-one-wrap{
    grid-template-columns:1fr;
  }

  .contact-one-info h2{
    font-size:32px;
  }
}

.justify-text{
    text-align: justify;
    line-height: 1.2;
}

.ordered-points{
    padding-left: 22px;
}

.ordered-points li{
    margin-bottom: 10px;
}


/* ================= SOFT HOSTEL SECTION ================= */

.sengol-hostel-section{
    padding:70px 0;
    background:#faf8f4;
}

.hostel-heading{
    max-width:720px;
    margin:0 auto 45px;
    text-align:center;
}

.hostel-tag{
    display:inline-block;
    font-size:12px;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#9a7a4f;
    margin-bottom:10px;
}

.hostel-heading h2{
    font-size:32px;
    font-weight:500;
    color:#242424;
    margin-bottom:10px;
    line-height:1.4;
}

.hostel-heading p{
    font-size:15.5px;
    color:#666;
    line-height:1.8;
    margin:0;
}

.hostel-layout{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:35px;
    align-items:center;
    margin-bottom:45px;
}

.hostel-content p{
    font-size:15px;
    color:#555;
    line-height:1.95;
    margin-bottom:18px;
    text-align:justify;
}

.hostel-image img{
    width:100%;
    border-radius:18px;
    display:block;
    box-shadow:0 10px 30px rgba(0,0,0,.05);
}

.hostel-facilities{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
    margin-bottom:40px;
}

.facility-card{
    background:#fff;
    padding:22px;
    border-radius:16px;
    border:1px solid #eee7dd;
    box-shadow:0 8px 24px rgba(0,0,0,.03);
    transition:.3s ease;
}

.facility-card:hover{
    transform:translateY(-4px);
    box-shadow:0 12px 28px rgba(0,0,0,.05);
}

.facility-card span{
    display:inline-block;
    font-size:11px;
    color:#b28b58;
    letter-spacing:1px;
    margin-bottom:10px;
}

.facility-card h4{
    font-size:18px;
    font-weight:500;
    color:#2b2b2b;
    margin-bottom:10px;
}

.facility-card p{
    font-size:14.5px;
    color:#666;
    line-height:1.8;
    margin:0;
    text-align:justify;
}

.hostel-bottom{
    max-width:760px;
    margin:0 auto;
    padding:24px 28px;
    background:#fff;
    border-left:3px solid #c8aa7a;
    border-radius:14px;
    text-align:center;
}

.hostel-bottom h3{
    font-size:24px;
    font-weight:500;
    color:#242424;
    margin-bottom:14px;
}

.hostel-bottom p{
    font-size:15px;
    line-height:1.9;
    color:#555;
    text-align:justify;
    margin-bottom:18px;
}

.hostel-bottom strong{
    font-size:15px;
    color:#7c6746;
    font-weight:600;
    line-height:1.8;
}

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

@media(max-width:991px){

    .hostel-layout{
        grid-template-columns:1fr;
    }

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

    .hostel-heading h2{
        font-size:28px;
    }
}

@media(max-width:767px){

    .sengol-hostel-section{
        padding:55px 0;
    }

    .hostel-facilities{
        grid-template-columns:1fr;
    }

    .hostel-heading h2{
        font-size:24px;
    }

    .hostel-bottom{
        padding:22px;
    }

    .hostel-bottom h3{
        font-size:21px;
    }
}

/* ================= SOFT INFRASTRUCTURE SECTION ================= */

.soft-infra-section{
    padding:70px 0;
    background:#faf8f4;
}

.soft-infra-head{
    max-width:720px;
    margin:0 auto 35px;
    text-align:center;
}

.soft-infra-head span{
    display:inline-block;
    font-size:12px;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#9a7a4f;
    margin-bottom:10px;
}

.soft-infra-head h2{
    font-size:32px;
    font-weight:500;
    line-height:1.35;
    color:#242424;
    margin-bottom:12px;
}

.soft-infra-head p{
    font-size:16px;
    line-height:1.8;
    color:#666;
    margin:0;
}

.soft-infra-intro{
    max-width:850px;
    margin:0 auto 38px;
}

.soft-infra-intro p{
    text-align:justify;
    font-size:15.5px;
    line-height:1.9;
    color:#555;
    margin:0;
}

.soft-infra-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:18px;
}

.soft-infra-card{
    background:#fff;
    padding:24px 24px 22px;
    border-radius:16px;
    border:1px solid #eee7dd;
    box-shadow:0 8px 24px rgba(0,0,0,.035);
    transition:.3s ease;
}

.soft-infra-card:hover{
    transform:translateY(-4px);
    box-shadow:0 12px 32px rgba(0,0,0,.055);
}

.soft-infra-card h4{
    font-size:18px;
    font-weight:500;
    color:#2b2b2b;
    margin:0 0 10px;
}

.soft-infra-card p{
    font-size:14.5px;
    line-height:1.75;
    color:#666;
    margin:0;
    text-align:justify;
}

.soft-infra-note{
    max-width:760px;
    margin:36px auto 0;
    padding:22px 28px;
    background:#fff;
    border-left:3px solid #c8aa7a;
    border-radius:14px;
}

.soft-infra-note p{
    font-size:15.5px;
    line-height:1.8;
    color:#555;
    margin:0;
    text-align:center;
}

/* Responsive */

@media(max-width:991px){
    .soft-infra-grid{
        grid-template-columns:repeat(2, 1fr);
    }

    .soft-infra-head h2{
        font-size:28px;
    }
}

@media(max-width:767px){
    .soft-infra-section{
        padding:55px 0;
    }

    .soft-infra-grid{
        grid-template-columns:1fr;
    }

    .soft-infra-head h2{
        font-size:24px;
    }

    .soft-infra-card{
        padding:22px;
    }

    .soft-infra-note{
        padding:20px;
    }
}