:root{
  --navy:        #0a192f;
  --navy-2:      #0f2340;
  --navy-3:      #16304f;
  --navy-soft:   #1c3a5e;
  --blue:        #0072bc;
  --blue-deep:   #005696;
  --blue-pale:   #e8f3fb;
  --magenta:     #9e0059;
  --magenta-2:   #b5006c;
  --magenta-pale:#fbe8f2;
  --gold:        #d4af37;
  --gold-light:  #e8c766;
  --gold-dark:   #a9862a;
  --white:       #ffffff;
  --offwhite:    #f8fafc;
  --ink:         #0a192f;
  --muted:       #54627a;
  --muted-2:     #8b97ab;
  --border:      #e3e8f0;
  --border-dark: rgba(255,255,255,.14);
  --whatsapp:    #25d366;

  --font-display: 'Fraunces', Georgia, serif;
  --font-body:    'Plus Jakarta Sans', -apple-system, Segoe UI, Arial, sans-serif;
  --font-data:    'Space Grotesk', 'Plus Jakarta Sans', monospace;

  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-full: 999px;

  --shadow-sm: 0 2px 12px rgba(10,25,47,.07);
  --shadow-md: 0 14px 34px rgba(10,25,47,.12);
  --shadow-lg: 0 26px 64px rgba(10,25,47,.18);
  --shadow-gold: 0 12px 28px rgba(212,175,55,.32);

  --container: 1240px;
  --nav-h: 88px;
  --ease: cubic-bezier(.22,1,.36,1);
}


*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; scroll-padding-top: calc(var(--nav-h) + 12px); }
body{
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  line-height: 1.6;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }
button{ font:inherit; cursor:pointer; border:none; background:none; color:inherit; }
input,select,textarea{ font:inherit; color:inherit; }
svg{ display:block; }
::selection{ background: var(--gold); color: var(--navy); }

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

:focus-visible{ outline: 3px solid var(--gold); outline-offset: 3px; border-radius: 4px; }


h1,h2,h3,h4{ font-family: var(--font-display); color: var(--navy); line-height:1.12; font-weight:600; letter-spacing:-.01em; }
p{ color: var(--muted); }
.lead{ font-size: clamp(1.05rem,1.4vw,1.25rem); color: var(--muted); }

.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family: var(--font-data); font-size:.78rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color: var(--gold-dark);
}
.eyebrow::before{ content:""; width:26px; height:2px; background: var(--gold); display:inline-block; }
.section--dark .eyebrow, .on-dark .eyebrow{ color: var(--gold-light); }

.section-head{ max-width:680px; margin-bottom: clamp(36px,5vw,56px); }
.section-head.center{ margin-inline:auto; text-align:center; }
.section-title{ font-size: clamp(2rem,3.4vw,2.9rem); margin-top:14px; }
.section-title em{ font-style:italic; color: var(--blue); }
.section--dark .section-title{ color: var(--white); }
.section--dark .section-title em{ color: var(--gold-light); }
.section-subtitle{ margin-top:16px; font-size:1.06rem; }
.section--dark .section-subtitle{ color: rgba(255,255,255,.68); }

.text-gold{ color: var(--gold-dark); }
.text-blue{ color: var(--blue); }
.text-magenta{ color: var(--magenta); }
.italic-serif{ font-family:var(--font-display); font-style:italic; }


.container{ max-width: var(--container); margin-inline:auto; padding-inline: clamp(20px,4vw,40px); }
.section{ padding-block: clamp(64px,8vw,116px); position:relative; }
.section--dark{ background: var(--navy); color: rgba(255,255,255,.82); }
.section--tint{ background: var(--offwhite); }
.section--gradient{ background: radial-gradient(120% 140% at 15% 0%, #0f2440 0%, var(--navy) 55%, #081525 100%); }
.section--tight{ padding-block: clamp(40px,5vw,72px); }
.divider-gold{ width:64px; height:3px; background: linear-gradient(90deg, var(--gold), var(--magenta)); border-radius:99px; margin-block:18px; }


.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 30px; border-radius: var(--radius-full);
  font-weight:700; font-size:.96rem; white-space:nowrap;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease), color .25s var(--ease);
}
.btn i, .btn svg{ font-size:.95em; }
.btn--primary{ background: linear-gradient(135deg, var(--gold-light), var(--gold) 60%, var(--gold-dark)); color: var(--navy); border: none; box-shadow: none; }
.btn--primary:hover{ transform: translateY(-2px); box-shadow: 0 8px 20px rgba(212,175,55,.38); }
.btn--secondary{ background: var(--blue); color:var(--white); box-shadow: none; }
.btn--secondary:hover{ background: var(--blue-deep); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,114,188,.32); }
.btn--outline{ background:transparent; border:1.5px solid rgba(255,255,255,.5); color:var(--white); }
.btn--outline:hover{ background: rgba(255,255,255,.1); border-color:#fff; }
.btn--outline-dark{ background:transparent; border:1.5px solid var(--navy); color:var(--navy); }
.btn--outline-dark:hover{ background: var(--navy); color:#fff; }
.btn--gold{ background: linear-gradient(135deg, var(--gold-light), var(--gold-dark)); color: var(--navy); font-weight:800; border:none; box-shadow: none; }
.btn--gold:hover{ box-shadow: 0 8px 20px rgba(212,175,55,.45); transform:translateY(-2px); }
.btn--whatsapp{ background: var(--whatsapp); color:#fff; box-shadow: 0 12px 26px rgba(37,211,102,.35); }
.btn--whatsapp:hover{ background:#1eb958; transform: translateY(-3px); }
.btn--block{ width:100%; }
.btn--lg{ padding:16px 34px; font-size:1rem; }
.btn--sm{ padding:8px 15px; font-size:.82rem; font-weight:700; }
.btn[disabled]{ opacity:.55; cursor:not-allowed; transform:none !important; }

.link-arrow{ display:inline-flex; align-items:center; gap:8px; font-weight:700; color: var(--blue); }
.link-arrow i{ transition: transform .25s var(--ease); }
.link-arrow:hover i{ transform: translateX(5px); }


.navbar{
  position:fixed; inset:0 0 auto 0; height:var(--nav-h); z-index:900;
  display:flex; align-items:center;
  background: rgba(10,25,47,.92);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border-bottom:1.5px solid rgba(212,175,55,.2);
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  transition: background .3s var(--ease), height .3s var(--ease), box-shadow .3s var(--ease);
}
.navbar.is-scrolled{ background: rgba(7,16,31,.98); height:72px; border-bottom-color: rgba(158,0,89,.4); box-shadow: 0 14px 35px rgba(0,0,0,.45); }
.navbar .navbar__inner,
.navbar__inner{
  max-width: 1540px !important;
  width: 100%;
  margin-inline: auto;
  padding-inline: clamp(14px, 2.5vw, 36px);
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  min-width:0;
}
.navbar__brand{ display:flex; align-items:center; gap:10px; flex-shrink:0; text-decoration:none; }
.navbar__brand img{ width:42px; height:42px; border-radius:50%; background:#ffffff; padding:2px; box-shadow:0 4px 14px rgba(0,0,0,.35); transition: transform .3s var(--ease); object-fit:contain; }
.navbar__brand:hover img{ transform: scale(1.06); }
.navbar__brand-text{ display:flex; flex-direction:column; line-height:1.2; }
.navbar__brand-text strong{ font-family:var(--font-display); font-size:1.1rem; color:#fff; letter-spacing:.01em; white-space:nowrap; }
.navbar__subtext,
.navbar__brand-text span{ font-size:.65rem; letter-spacing:.08em; text-transform:uppercase; color: var(--gold-light); font-weight:700; white-space:nowrap; }

.navbar__links{
  display:flex; align-items:center; gap:2px;
  background: rgba(255,255,255,.06);
  padding:4px 6px;
  border-radius: var(--radius-full);
  border:1px solid rgba(255,255,255,.1);
  flex-shrink:0;
}
.navbar__links a{
  display:inline-flex; align-items:center; justify-content:center;
  padding:7px 11px; border-radius: var(--radius-full);
  font-size:.82rem; font-weight:700; color: rgba(255,255,255,.88);
  transition: all .2s var(--ease); text-decoration:none;
  white-space: nowrap;
}
.navbar__links a i{ display:none; }
.navbar__links a:hover{ background: rgba(255,255,255,.14); color:#fff; transform: translateY(-1px); }
.navbar__links a.is-active{ background: linear-gradient(135deg, var(--magenta), var(--blue)); color:#fff; box-shadow: 0 4px 14px rgba(158,0,89,.35); border:1px solid rgba(255,255,255,.2); }

.navbar__actions{ display:flex; align-items:center; gap:8px; flex-shrink:0; }
.navbar__actions .btn{ padding:8px 14px; font-size:.82rem; font-weight:700; white-space:nowrap; }
.navbar__actions [data-schedule-btn]{ display: none; }
.navbar__actions [data-schedule-btn].is-visible{ display: inline-flex; }

/* ---------- 7. Navbar Toggle (3 Modern Dots) ---------- */
.navbar__toggle{
  display:none;
  align-items:center;
  justify-content:center;
  gap:4px;
  width:42px;
  height:42px;
  border-radius:12px;
  background: rgba(255,255,255,.08);
  border:1px solid rgba(212,175,55,.3);
  cursor:pointer;
  transition: all .25s var(--ease);
  flex-shrink:0;
  padding:0;
}
.navbar__toggle:hover, .navbar__toggle:active{
  background: rgba(212,175,55,.18);
  border-color: var(--gold);
  transform: scale(1.05);
}
.navbar__toggle span{
  width:5px;
  height:5px;
  border-radius:50%;
  background: var(--gold-light);
  transition: all .3s cubic-bezier(.22,1,.36,1);
  display:block;
}
.navbar__toggle.is-open{
  background: rgba(212,175,55,.2);
  border-color: var(--gold);
}
.navbar__toggle.is-open span:nth-child(1){ transform: scale(1.25); background: #fff; }
.navbar__toggle.is-open span:nth-child(2){ transform: scale(1.5); background: var(--gold); }
.navbar__toggle.is-open span:nth-child(3){ transform: scale(1.25); background: #fff; }

/* ---------- 8. Side Drawer & Backdrop (Yan Panel) ---------- */
.navbar__mobile-backdrop{
  position:fixed; inset:0; z-index:99998;
  background: rgba(4,12,24,.75);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  opacity:0; pointer-events:none;
  transition: opacity .35s ease;
}
.navbar__mobile-backdrop.is-open{
  opacity:1; pointer-events:auto;
}

.navbar__mobile{
  position:fixed; top:0; right:0; bottom:0; z-index:99999;
  width:86%; max-width:360px;
  background: linear-gradient(180deg, #0d223c 0%, #0a192f 50%, #061120 100%);
  box-shadow: -14px 0 50px rgba(0,0,0,.85);
  border-left:1px solid rgba(212,175,55,.3);
  padding:22px 18px 28px;
  display:flex; flex-direction:column; gap:16px;
  transform: translateX(105%);
  transition: transform .35s cubic-bezier(.22,1,.36,1);
  overflow-y:auto; -webkit-overflow-scrolling:touch;
}
.navbar__mobile.is-open{
  transform: translateX(0);
  pointer-events:auto;
  visibility:visible;
}

.navbar__mobile-header{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding-bottom:12px; border-bottom:1px solid rgba(255,255,255,.1);
}
.navbar__mobile-header .navbar__brand{
  display:flex; align-items:center; gap:8px; text-decoration:none;
  flex:1; min-width:0; overflow:hidden;
}
.navbar__mobile-header .navbar__brand img{
  width:32px; height:32px; border-radius:50%; background:#fff; padding:2px;
  flex-shrink:0;
}
.navbar__mobile-header .navbar__brand-text{
  display:flex; flex-direction:column; min-width:0; overflow:hidden;
}
.navbar__mobile-header .navbar__brand strong{
  font-family:var(--font-display); font-size:.92rem; color:#fff;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block;
}
.navbar__mobile-header .navbar__brand span{
  font-size:.58rem; color:var(--gold-light); text-transform:uppercase; letter-spacing:.06em;
  font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block;
}
.navbar__mobile-close{
  width:32px; height:32px; border-radius:50%;
  background: rgba(255,255,255,.08); border:1px solid rgba(212,175,55,.3);
  color:#fff; font-size:.9rem;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition: all .2s ease;
  flex-shrink:0; margin:0; padding:0; line-height:1;
}
.navbar__mobile-close:hover{
  background: rgba(212,175,55,.25); color:var(--gold-light); transform: rotate(90deg) scale(1.05);
}

.navbar__mobile-nav{
  display:flex; flex-direction:column; gap:4px; flex:1;
}
.navbar__mobile a{
  display:flex; align-items:center; gap:12px;
  padding:10px 12px; font-size:.9rem; font-weight:700; color:rgba(255,255,255,.9);
  border-radius: var(--radius-sm); transition: all .2s;
  text-decoration:none;
}
.navbar__mobile a i{
  width:20px; color:var(--gold-light); font-size:.95rem; text-align:center;
  transition: transform .2s;
}
.navbar__mobile a:hover{
  background: rgba(255,255,255,.08); color:#fff; transform: translateX(4px);
}
.navbar__mobile a:hover i{ transform: scale(1.15); }
.navbar__mobile a.is-active{
  background: linear-gradient(135deg, rgba(158,0,89,.35), rgba(0,114,188,.35));
  color:#fff; border:1px solid rgba(212,175,55,.3); font-weight:800;
}
.navbar__mobile a.is-active i{ color: var(--gold-light); }

.navbar__mobile-actions{
  display:flex; flex-direction:column; gap:8px;
  padding-top:12px; border-top:1px solid rgba(255,255,255,.08);
}
.navbar__mobile-actions .btn{
  width:100%; padding:10px 16px; font-size:.84rem; font-weight:700; justify-content:center;
}
.navbar__mobile [data-schedule-btn]{
  display:flex !important; align-items:center; justify-content:center; gap:8px;
  padding:10px 16px; font-size:.84rem; font-weight:800; color:var(--navy) !important;
  border-radius: var(--radius-full); background: linear-gradient(135deg, var(--gold-light), var(--gold-dark));
  border:none; margin-top:2px;
}

.navbar__mobile-footer{
  display:flex; gap:8px; margin-top:auto; padding-top:10px;
}
.mobile-contact-pill{
  flex:1; display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding:8px 10px; font-size:.78rem; font-weight:700; color:rgba(255,255,255,.8) !important;
  background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1);
  border-radius: var(--radius-full); text-decoration:none; transition: all .2s;
}
.mobile-contact-pill:hover{
  background: rgba(212,175,55,.15); border-color:var(--gold-light); color:#fff !important;
}

/* ---------- 9. Media Queries (All Resolutions) ---------- */
@media (max-width: 1280px){
  .navbar__subtext,
  .navbar__brand-text span{ display: none; }
  .navbar__links a{ padding: 6px 8px; font-size: .78rem; }
  .navbar__actions .btn{ padding: 7px 11px; font-size: .78rem; }
}

@media (max-width: 1120px){
  .navbar__links{ display: none !important; }
  .navbar__actions [data-schedule-btn],
  .navbar__actions [data-open-modal],
  .navbar__actions .btn{ display: none !important; }
  .navbar__toggle{ display: flex !important; }
}

@media (max-width: 720px){
  .navbar{ height: 68px; }
  :root{ --nav-h: 68px; }
  .navbar__brand img{ width: 36px; height: 36px; }
  .navbar__brand-text strong{ font-size: .98rem; }
  .call-bar{ display:block; }
  body{ padding-bottom:60px; }

  /* FAB stack order: Mail (top) -> WhatsApp (middle) -> Instagram (bottom) */
  .fab-mail{ bottom: 184px !important; right: 14px !important; width: 48px !important; height: 48px !important; }
  .fab-mail svg{ width: 24px !important; height: 24px !important; }
  .fab-whatsapp{ bottom: 128px !important; right: 14px !important; width: 48px !important; height: 48px !important; font-size: 1.4rem !important; }
  .fab-instagram{ bottom: 72px !important; right: 14px !important; width: 48px !important; height: 48px !important; font-size: 1.4rem !important; }
}

.call-bar{
  display:none; position:fixed; left:0; right:0; bottom:0; z-index:850;
  background: linear-gradient(90deg, var(--navy), var(--navy-3));
  border-top:1px solid rgba(212,175,55,.35);
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
}
.call-bar__inner{ display:flex; align-items:center; justify-content:center; gap:10px; color:#fff; font-weight:700; font-size:.98rem; }
.call-bar__inner i{ color: var(--gold-light); font-size:1.1rem; }

/* 1. Mail FAB (Top) - Real Gmail */
.fab-mail{
  position:fixed; right:22px; bottom:168px; z-index:860;
  width:60px; height:60px; border-radius:50%;
  background: #ffffff;
  border: 1.5px solid rgba(0,0,0,0.06);
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 10px 28px rgba(0,0,0,.22);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
  text-decoration:none;
}
.fab-mail svg{ width:34px; height:34px; display:block; }
.fab-mail:hover{ transform: scale(1.12) translateY(-3px); box-shadow: 0 16px 36px rgba(66,133,244,.4); }

/* 2. WhatsApp FAB (Middle) */
.fab-whatsapp{
  position:fixed; right:22px; bottom:96px; z-index:860;
  width:60px; height:60px; border-radius:50%; background: #25d366; color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.7rem;
  box-shadow: 0 12px 30px rgba(37,211,102,.45);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
  animation: pulseWA 2.6s ease-in-out infinite;
  text-decoration:none;
}
.fab-whatsapp:hover{ transform: scale(1.12) translateY(-3px); box-shadow: 0 18px 36px rgba(37,211,102,.65); }

/* 3. Instagram FAB (Bottom) */
.fab-instagram{
  position:fixed; right:22px; bottom:24px; z-index:860;
  width:60px; height:60px; border-radius:50%;
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.7rem;
  box-shadow: 0 12px 30px rgba(214,36,159,.45);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
  animation: pulseIG 2.6s ease-in-out infinite 1.3s;
  text-decoration:none;
}
.fab-instagram:hover{ transform: scale(1.12) translateY(-3px); box-shadow: 0 18px 36px rgba(214,36,159,.65); }


#dynamicGalleryLightbox {
  position: fixed;
  inset: 0;
  z-index: 999999;

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

  padding: 0;
  box-sizing: border-box;

  background: rgba(5, 14, 30, 0.96);
  backdrop-filter: blur(10px);

  animation: lbFadeIn .22s ease;
}

@keyframes lbFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.gallery-lightbox-content {
  width: 100%;
  height: 100%;

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

  pointer-events: none;
}

.gallery-lightbox-image {
  display: block;

  max-width: 82vw;
  max-height: 86vh;

  width: auto;
  height: auto;

  object-fit: contain;

  border-radius: 10px;
  box-shadow: 0 24px 80px rgba(0,0,0,.7);

  user-select: none;
  -webkit-user-drag: none;

  animation: lbImgIn .2s ease;
}

@keyframes lbImgIn {
  from { opacity: 0; transform: scale(.96); }
  to   { opacity: 1; transform: scale(1); }
}


.gallery-lightbox-close,
.gallery-lightbox-prev,
.gallery-lightbox-next {
  position: absolute;

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

  padding: 0;
  margin: 0;
  border: 1.5px solid rgba(255,255,255,.18);
  border-radius: 50%;

  color: #fff;
  background: rgba(11, 25, 46, 0.75);

  cursor: pointer;
  z-index: 1000000;
  box-sizing: border-box;

  transition: background .2s, border-color .2s, transform .2s, color .2s;
}


.gallery-lightbox-close:hover,
.gallery-lightbox-prev:hover,
.gallery-lightbox-next:hover {
  background: rgba(212, 175, 55, 0.18);
  border-color: #d4af37;
  color: #d4af37;
}


.gallery-lightbox-close {
  top: 20px;
  left: 20px;        
  right: auto;

  width: 48px;
  height: 48px;

  font-size: 20px;
}

.gallery-lightbox-close:hover {
  transform: rotate(90deg);
}


.gallery-lightbox-prev,
.gallery-lightbox-next {
  top: 50%;

  width: 54px;
  height: 54px;

  font-size: 18px;

  transform: translateY(-50%);
}

.gallery-lightbox-prev:hover,
.gallery-lightbox-next:hover {
  transform: translateY(-50%) scale(1.08);
}

.gallery-lightbox-prev { left: 22px; }
.gallery-lightbox-next { right: 22px; }

.gallery-lightbox-close i,
.gallery-lightbox-prev i,
.gallery-lightbox-next i {
  display: block;
  line-height: 1;
}


.gallery-lightbox-counter {
  position: absolute;
  bottom: 22px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(11, 25, 46, 0.7);
  border: 1px solid rgba(212,175,55,.35);
  color: rgba(255,255,255,.85);
  font-size: 13px;
  font-weight: 600;
  padding: 5px 16px;
  border-radius: 99px;
  pointer-events: none;
  white-space: nowrap;
}

@media (max-width: 600px) {
  #dynamicGalleryLightbox {
    padding: 0;
  }

  .gallery-lightbox-image {
    max-width: 96vw;
    max-height: 78vh;
    border-radius: 6px;
  }

  .gallery-lightbox-prev,
  .gallery-lightbox-next {
    width: 42px;
    height: 42px;
    font-size: 15px;
  }

  .gallery-lightbox-prev { left: 8px; }
  .gallery-lightbox-next { right: 8px; }

  .gallery-lightbox-close {
    top: 12px;
    left: 12px;
    width: 42px;
    height: 42px;
    font-size: 17px;
  }
}


@media (max-width:720px){
  .fab-whatsapp{ bottom:142px; right:16px; width:54px; height:54px; font-size:1.45rem; }
  .fab-instagram{ bottom:80px; right:16px; width:54px; height:54px; font-size:1.45rem; }
}


.hero{ position:relative; min-height:100svh; display:flex; align-items:center; padding-top:calc(var(--nav-h) + 24px); padding-bottom:56px; overflow:hidden; background: var(--navy); }
.hero__bg{ position:absolute; inset:0; z-index:0; }
.hero__slide{
  position:absolute; inset:0; opacity:0; transition: opacity 1.2s var(--ease); pointer-events:none;
  background:
    radial-gradient(ellipse 90% 70% at 82% 15%, rgba(0,114,188,.38), transparent 60%),
    radial-gradient(ellipse 80% 60% at 10% 90%, rgba(158,0,89,.34), transparent 60%),
    linear-gradient(160deg, #081422 0%, var(--navy) 45%, #0d2038 100%);
}
.hero__slide.is-active{ opacity:1; }
.hero__slide::before{
  content:""; position:absolute; inset:0; opacity:.5; mix-blend-mode:overlay;
  background-image: radial-gradient(rgba(212,175,55,.5) 1px, transparent 1.4px);
  background-size: 26px 26px;
}
.hero__slide--2{ background:
    radial-gradient(ellipse 90% 70% at 15% 10%, rgba(158,0,89,.4), transparent 60%),
    radial-gradient(ellipse 80% 60% at 88% 85%, rgba(0,114,188,.36), transparent 60%),
    linear-gradient(200deg, #0a1a2e 0%, var(--navy) 50%, #0e1f38 100%); }
.hero__slide--3{ background:
    radial-gradient(ellipse 85% 70% at 50% 0%, rgba(212,175,55,.24), transparent 62%),
    radial-gradient(ellipse 80% 60% at 90% 90%, rgba(0,114,188,.3), transparent 60%),
    linear-gradient(180deg, #071220 0%, var(--navy) 55%, #0c1c33 100%); }

.hero__container{ position:relative; z-index:2; width:100%; display:flex; flex-direction:column; gap:clamp(26px, 3.8vw, 38px); }
.hero__top-grid{ display:grid; grid-template-columns:1.15fr 0.85fr; gap:clamp(30px, 4.5vw, 56px); align-items:center; width:100%; }

.hero__col--info{ display:flex; flex-direction:column; justify-content:center; }
.hero__eyebrow{ display:inline-flex; align-items:center; gap:10px; background: rgba(212,175,55,.14); border:1px solid rgba(212,175,55,.4); color: var(--gold-light); padding:8px 16px; border-radius: var(--radius-full); font-size:.82rem; font-weight:700; letter-spacing:.04em; align-self:flex-start; }
.hero__eyebrow i{ color: var(--gold-light); }
.hero__title{ color:#fff; font-size: clamp(2.1rem,3.4vw,3.2rem); margin-top:16px; line-height:1.12; }
.hero__title em{ font-style:italic; background: linear-gradient(100deg, var(--gold-light), var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero__desc{ margin-top:16px; color: rgba(255,255,255,.78); font-size:1.05rem; line-height:1.65; max-width:560px; }
.hero__trust{ display:flex; flex-wrap:wrap; gap:22px; margin-top:28px; }
.hero__trust-item{ display:flex; align-items:center; gap:12px; }
.hero__trust-item strong{ display:block; font-family:var(--font-data); font-size:1.45rem; color:#fff; }
.hero__trust-item span{ font-size:.78rem; color: rgba(255,255,255,.65); text-transform:uppercase; letter-spacing:.06em; }

.slider__dots{ position:relative; z-index:2; display:flex; gap:9px; margin-top:28px; }
.slider__dots button{ width:34px; height:4px; border-radius:99px; background: rgba(255,255,255,.25); transition: background .3s var(--ease), width .3s var(--ease); }
.slider__dots button.is-active{ background: var(--gold); width:52px; }

/* Video Card in Hero */
.hero__col--video .video-card-container{ max-width: 340px; width:100%; margin-inline:auto; }
.hero__col--video .video-card-frame{
  position:relative;
  width:100%;
  aspect-ratio: 9/16;
  max-height: 520px;
  border-radius: var(--radius-lg);
  overflow:hidden;
  background:#000;
  box-shadow: 0 24px 60px rgba(0,0,0,.6), 0 0 35px rgba(212,175,55,.22);
  border: 2px solid rgba(212,175,55,.35);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.hero__col--video .video-card-frame:hover{
  transform: translateY(-4px) scale(1.015);
  box-shadow: 0 30px 70px rgba(0,0,0,.7), 0 0 45px rgba(212,175,55,.35);
  border-color: var(--gold);
}
.hero__col--video .video-overlay{ padding:20px; }
.hero__col--video .play-btn-pulse{ width:72px; height:72px; font-size:1.65rem; }
.hero__col--video .video-overlay__title{ font-size:1.05rem; }
.hero__col--video .video-badge{ font-size:.76rem; padding:5px 12px; }
.hero__col--video .video-overlay__footer{ font-size:.8rem; }

/* Loader Badge */
.video-loading-badge{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 18;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  background: rgba(10, 25, 47, 0.9);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  padding: 18px 24px;
  border-radius: var(--radius-md);
  border: 1.5px solid rgba(212, 175, 55, 0.45);
  color: #fff;
  font-size: 0.85rem;
  font-weight: 700;
  box-shadow: 0 12px 35px rgba(0,0,0,0.6);
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  white-space: nowrap;
}
.video-card-frame.is-loading .video-loading-badge,
.video-card-frame.is-buffering .video-loading-badge{
  opacity: 1;
  visibility: visible;
}
.video-loading-badge i{
  font-size: 1.8rem;
  color: var(--gold-light);
}

/* YouTube-style buffer track */
.video-buffer-track{
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: rgba(255, 255, 255, 0.22);
  z-index: 14;
  overflow: hidden;
  pointer-events: none;
}
.video-buffer-loaded{
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 0%;
  background: rgba(255, 255, 255, 0.6);
  transition: width 0.25s ease-out;
}
.video-buffer-played{
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 0%;
  background: linear-gradient(90deg, var(--gold), var(--magenta));
  box-shadow: 0 0 10px rgba(212, 175, 55, 0.9);
  transition: width 0.1s linear;
}

/* Board Row Under CTA */
.hero__board-row{
  width: 100%;
  max-width: 820px;
  margin-inline: auto;
}
.hero__board-row .board{
  padding: 26px 30px 22px;
  border-radius: var(--radius-lg);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.hero__board-row .flap{
  max-width: 56px;
}
.hero__board-row .flap__face{
  font-size: clamp(1.4rem, 2.5vw, 2.15rem);
}

/* Light CTA Band */
.cta-band--light{
  background: #ffffff !important;
  border: 1.5px solid rgba(212, 175, 55, 0.45) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.28), 0 0 30px rgba(212, 175, 55, 0.15) !important;
  padding: clamp(24px, 3.2vw, 36px) clamp(20px, 4vw, 44px) !important;
  border-radius: var(--radius-lg);
}
.cta-band--light::before{
  background-image: radial-gradient(rgba(10, 25, 47, 0.08) 1px, transparent 1.4px) !important;
  opacity: 0.7 !important;
}
.cta-band--light h2{
  color: var(--navy) !important;
  font-size: clamp(1.5rem, 2.4vw, 2.1rem) !important;
  font-weight: 700;
  margin-top: 8px;
}
.cta-band--light p{
  color: var(--muted) !important;
  font-size: 0.98rem !important;
  margin-top: 8px;
}
.cta-band--light .eyebrow{
  color: var(--gold-dark) !important;
}
.cta-band--light .eyebrow::before{
  background: var(--gold) !important;
}
.cta-band--light .hero__cta{
  justify-content: center;
  margin-top: 20px;
  gap: 12px;
}
.cta-band--light .btn--outline-dark{
  border: 1.5px solid var(--navy);
  color: var(--navy);
  background: transparent;
}
.cta-band--light .btn--outline-dark:hover{
  background: var(--navy);
  color: #fff;
}

@media (max-width: 992px){
  .hero__top-grid{ grid-template-columns: 1fr; gap: 32px; }
  .hero__col--info{ text-align: center; align-items: center; }
  .hero__col--info .hero__eyebrow{ align-self: center; }
  .hero__col--info .hero__desc{ max-width: 680px; }
  .hero__col--info .hero__trust{ justify-content: center; }
  .hero__col--info .slider__dots{ justify-content: center; }
  .hero__col--video .video-card-container{ max-width: 320px; }
}

@media (max-width: 640px){
  .hero{ padding-top: calc(var(--nav-h) + 16px); padding-bottom: 36px; }
  .hero__container{ gap: 20px; }
  .hero__top-grid{ gap: 20px; }
  .hero__col--info .hero__title{ font-size: clamp(1.75rem, 6.5vw, 2.25rem); margin-top: 12px; }
  .hero__col--info .hero__desc{ font-size: .94rem; margin-top: 10px; }
  .hero__col--info .hero__trust{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; width: 100%; margin-top: 18px; }
  .hero__col--info .hero__trust-item{ flex-direction: column; gap: 4px; text-align: center; }
  .hero__col--info .hero__trust-item strong{ font-size: 1.15rem; }
  .hero__col--info .hero__trust-item span{ font-size: .65rem; }
  .hero__col--info .slider__dots{ margin-top: 16px; }
  .hero__col--video .video-card-container{ max-width: 270px; }
  .hero__col--video .video-card-frame{ max-height: 420px; }
  .hero__col--video .play-btn-pulse{ width: 58px; height: 58px; font-size: 1.35rem; }
  .hero__board-row .board{ padding: 20px 14px 16px; }
  .hero__board-row .flap{ max-width: 44px; }
  .hero__board-row .flap__face{ font-size: 1.25rem; }
  .cta-band--light .hero__cta{ flex-direction: column; width: 100%; gap: 10px; }
  .cta-band--light .hero__cta .btn{ width: 100%; }
}


.board-wrap{ position:relative; z-index:2; }
.board{
  background: linear-gradient(180deg, #0c2038, #081527);
  border:1px solid rgba(212,175,55,.28);
  border-radius: var(--radius-lg);
  padding: 26px 24px 22px;
  box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,.05);
}
.board__head{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:20px; }
.board__label{ display:flex; align-items:center; gap:10px; color: rgba(255,255,255,.6); font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; font-family:var(--font-data); }
.board__label i{ color: var(--gold-light); animation: spin 6s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.board__tabs{ display:flex; gap:8px; background: rgba(255,255,255,.06); padding:5px; border-radius: var(--radius-full); }
.board__tab{ padding:8px 18px; border-radius: var(--radius-full); font-size:.82rem; font-weight:700; color: rgba(255,255,255,.6); transition: all .25s var(--ease); }
.board__tab.is-active{ background: linear-gradient(135deg, var(--gold-light), var(--gold-dark)); color: var(--navy); }

.board__groups{ display:grid; grid-template-columns: repeat(4,1fr); gap:12px; }
.board__group{ text-align:center; }
.flap-row{ display:flex; justify-content:center; gap:5px; }
.flap{ position:relative; width:100%; max-width:56px; aspect-ratio:3/4; perspective:240px; font-family:var(--font-data); }
.flap__face{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size: clamp(1.5rem,2.6vw,2.15rem); font-weight:700; color: var(--gold-light);
  background: linear-gradient(180deg, #1a3557, #0e2038);
  border-radius:7px; backface-visibility:hidden;
  box-shadow: inset 0 -10px 14px -8px rgba(0,0,0,.55), inset 0 10px 14px -8px rgba(255,255,255,.05);
}
.flap__face::after{ content:""; position:absolute; left:0; right:0; top:50%; height:1px; background: rgba(0,0,0,.45); }
.flap__face--back{ transform: rotateX(180deg); }
.flap.is-flipping .flap__face--front{ animation: flapFront .48s var(--ease) forwards; }
.flap.is-flipping .flap__face--back{ animation: flapBack .48s var(--ease) forwards; }
@keyframes flapFront{ from{ transform:rotateX(0deg); } to{ transform:rotateX(-180deg); } }
@keyframes flapBack{ from{ transform:rotateX(180deg); } to{ transform:rotateX(0deg); } }
.board__group-label{ margin-top:10px; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color: rgba(255,255,255,.55); }
.board__sep{ display:none; }
.board__note{ margin-top:18px; font-size:.76rem; color: rgba(255,255,255,.42); text-align:center; }
.board__note i{ margin-right:5px; }

.board--mini{ padding:18px 16px 16px; }
.board--mini .flap{ max-width:42px; }
.board--mini .flap__face{ font-size:1.1rem; }

@media (max-width:520px){
  .board__groups{ gap:7px; }
  .flap-row{ gap:3px; }
}


.stat-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:1px; background: var(--border); border-radius: var(--radius-lg); overflow:hidden; box-shadow: var(--shadow-md); }
.stat-card{ background:#fff; padding: 38px 22px; text-align:center; }
.stat-card__num{ font-family: var(--font-data); font-size: clamp(2.1rem,3.6vw,3rem); font-weight:700; color: var(--navy); display:flex; align-items:baseline; justify-content:center; gap:2px; }
.stat-card__num span.suffix{ color: var(--magenta); font-size:.62em; }
.stat-card__label{ margin-top:8px; font-size:.86rem; color: var(--muted); font-weight:600; }
.section--dark .stat-card{ background: rgba(255,255,255,.04); }
.section--dark .stat-card__num{ color:#fff; }
.section--dark .stat-grid{ background: rgba(255,255,255,.08); }
@media (max-width:860px){ .stat-grid{ grid-template-columns: repeat(2,1fr); } }


.card{ background:#fff; border:1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.card:hover{ transform: translateY(-6px); box-shadow: var(--shadow-md); }
.icon-tile{ width:58px; height:58px; border-radius:16px; display:flex; align-items:center; justify-content:center; font-size:1.4rem; color:#fff; background: linear-gradient(135deg, var(--blue), var(--blue-deep)); flex-shrink:0; }
.icon-tile--gold{ background: linear-gradient(135deg, var(--gold-light), var(--gold-dark)); color: var(--navy); }
.icon-tile--magenta{ background: linear-gradient(135deg, var(--magenta-2), var(--magenta)); }
.icon-tile--navy{ background: linear-gradient(135deg, var(--navy-3), var(--navy)); }
.section--dark .card, .section--dark .quick-card{ background: rgba(255,255,255,.045); border-color: rgba(255,255,255,.1); }
.section--dark .card h3, .section--dark .card h4{ color:#fff; }
.section--dark .card p{ color: rgba(255,255,255,.64); }
.section--dark .card:hover{ box-shadow: 0 20px 44px rgba(0,0,0,.35); }


.quick-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:24px; }
.quick-card{ padding:30px 26px; }
.quick-card h3{ margin-top:18px; font-size:1.24rem; }
.quick-card p{ margin-top:10px; font-size:.94rem; }
.quick-card .link-arrow{ margin-top:18px; }
@media (max-width:900px){ .quick-grid{ grid-template-columns:1fr; } }


.preview-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap:16px; }
.preview-tile{ position:relative; aspect-ratio:4/5; border-radius: var(--radius-md); overflow:hidden; display:flex; align-items:flex-end; padding:18px; color:#fff; font-weight:700; isolation:isolate; }
.preview-tile::before{ content:""; position:absolute; inset:0; z-index:-1; }
.preview-tile.t1::before{ background: linear-gradient(160deg, var(--blue), var(--navy)); }
.preview-tile.t2::before{ background: linear-gradient(160deg, var(--magenta), var(--navy)); }
.preview-tile.t3::before{ background: linear-gradient(160deg, var(--gold-dark), var(--navy)); }
.preview-tile.t4::before{ background: linear-gradient(160deg, var(--navy-soft), var(--navy)); }
.preview-tile i{ position:absolute; top:18px; right:18px; font-size:1.3rem; opacity:.7; }
.preview-tile span{ font-size:.95rem; }
@media (max-width:900px){ .preview-grid{ grid-template-columns: repeat(2,1fr); } }


.value-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:24px; }
.value-card{ padding:32px 28px; }
.value-card h3{ margin-top:20px; font-size:1.2rem; }
.value-card p{ margin-top:10px; font-size:.94rem; }
@media (max-width:900px){ .value-grid{ grid-template-columns:1fr; } }

.mission-grid{ display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.mission-card{ padding:34px; border-radius: var(--radius-lg); }
.mission-card--navy{ background: var(--navy); color: rgba(255,255,255,.78); }
.mission-card--navy h3{ color:#fff; }
.mission-card--tint{ background: var(--offwhite); border:1px solid var(--border); }
@media (max-width:820px){ .mission-grid{ grid-template-columns:1fr; } }

.model-steps{ display:grid; grid-template-columns: repeat(4,1fr); gap:22px; counter-reset: step; }
.model-step{ position:relative; padding:30px 22px 26px; border:1px solid var(--border); border-radius: var(--radius-md); background:#fff; }
.model-step::before{ counter-increment: step; content: counter(step,decimal-leading-zero); font-family:var(--font-data); font-size:.82rem; font-weight:700; color: var(--gold-dark); letter-spacing:.08em; }
.model-step h4{ margin-top:14px; font-size:1.05rem; }
.model-step p{ margin-top:8px; font-size:.88rem; }
.model-step:not(:last-child)::after{ content:"›"; position:absolute; top:32px; right:-18px; color: var(--border); font-size:1.6rem; display:none; }
@media (min-width:1000px){ .model-step:not(:last-child)::after{ display:block; } }
@media (max-width:900px){ .model-steps{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .model-steps{ grid-template-columns:1fr; } }


.timeline{ position:relative; max-width:780px; margin-inline:auto; padding-left:28px; border-left:2px solid var(--border); }
.timeline-item{ position:relative; padding-bottom:34px; padding-left:24px; }
.timeline-item::before{ content:""; position:absolute; left:-35px; top:4px; width:14px; height:14px; border-radius:50%; background: var(--gold); border:3px solid #fff; box-shadow:0 0 0 2px var(--gold); }
.timeline-item strong{ font-family:var(--font-data); color: var(--blue); font-size:.85rem; letter-spacing:.06em; }
.timeline-item h4{ margin-top:6px; font-size:1.08rem; }
.timeline-item p{ margin-top:6px; font-size:.92rem; }


.achieve-hero-stats{ display:grid; grid-template-columns: repeat(4,1fr); gap:18px; margin-top:40px; }
.rank-tabs{ display:flex; gap:10px; margin-bottom:30px; flex-wrap:wrap; }
.rank-tab{ padding:12px 24px; border-radius: var(--radius-full); border:1.5px solid var(--border); font-weight:700; font-size:.9rem; color: var(--muted); transition:.25s var(--ease); }
.rank-tab.is-active, .rank-tab:hover{ background: var(--navy); border-color:var(--navy); color:#fff; }

.rank-list{ display:flex; flex-direction:column; gap:14px; }
.rank-item{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 24px; background:#fff; border:1px solid var(--border); border-radius: var(--radius-md); transition: transform .25s var(--ease), box-shadow .25s var(--ease); }
.rank-item:hover{ transform: translateX(6px); box-shadow: var(--shadow-md); }
.rank-item__num{ width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--font-data); font-weight:700; font-size:1.15rem; background: linear-gradient(135deg, var(--blue-pale), #fff); color: var(--blue-deep); border:1px solid var(--border); }
.rank-item:nth-child(1) .rank-item__num{ background: linear-gradient(135deg, var(--gold-light), var(--gold-dark)); color:#fff; border-color:transparent; }
.rank-item:nth-child(2) .rank-item__num{ background: linear-gradient(135deg,#cfd8e3,#98a4b3); color:#fff; border-color:transparent; }
.rank-item:nth-child(3) .rank-item__num{ background: linear-gradient(135deg,#d99a5b,#a9682f); color:#fff; border-color:transparent; }
.rank-item__name{ font-weight:700; color: var(--navy); }
.rank-item__meta{ font-size:.86rem; color: var(--muted); margin-top:3px; }
.rank-item__score{ text-align:right; font-family:var(--font-data); font-weight:700; color: var(--magenta); white-space:nowrap; }
.rank-item__score span{ display:block; font-family:var(--font-body); font-weight:600; font-size:.72rem; color: var(--muted-2); text-transform:uppercase; letter-spacing:.05em; }

.percentile-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.percentile-card{ padding:24px 26px; background:#fff; border:1px solid var(--border); border-radius: var(--radius-md); }
.percentile-card__top{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:12px; }
.percentile-card__top strong{ font-size:1.02rem; color: var(--navy); }
.percentile-card__top span{ font-family:var(--font-data); font-weight:700; color: var(--magenta); }
.percentile-bar{ height:10px; border-radius:99px; background: var(--border); overflow:hidden; }
.percentile-bar__fill{ height:100%; border-radius:99px; background: linear-gradient(90deg, var(--blue), var(--magenta)); width:0; transition: width 1.4s var(--ease); }
@media (max-width:780px){ .achieve-hero-stats{ grid-template-columns: repeat(2,1fr);} .percentile-grid{ grid-template-columns:1fr; } }


.branch-block{ margin-bottom:64px; }
.branch-block__head{ display:flex; align-items:center; gap:16px; margin-bottom:26px; }
.branch-block__head .icon-tile{ width:48px; height:48px; font-size:1.15rem; border-radius:13px; }
.branch-block__head h3{ font-size:1.32rem; }
.branch-block__head span{ font-size:.86rem; color: var(--muted); }

.teacher-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:22px; }
.teacher-card{ padding:26px 22px; text-align:center; }
.teacher-avatar{ width:84px; height:84px; margin-inline:auto; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:1.5rem; font-weight:700; color:#fff; background: linear-gradient(135deg, var(--blue), var(--magenta)); }
.teacher-card h4{ margin-top:16px; font-size:1.05rem; color:var(--navy); }
.teacher-card .branch-tag{ display:inline-block; margin-top:6px; font-size:.74rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color: var(--gold-dark); background: rgba(212,175,55,.12); padding:4px 12px; border-radius:99px; }
.teacher-card p{ margin-top:12px; font-size:.85rem; }
.teacher-grid-scroll.is-scrollable .teacher-card {
  min-width: 260px;
  scroll-snap-align: start;
  flex-shrink: 0;
}


.big-gallery-card {
  background: var(--navy);
  border-radius: var(--radius-lg);
  padding: 20px;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.45);
  border: 1.5px solid rgba(212, 175, 55, 0.25);
  position: relative;
  overflow: hidden;
  max-width: 1060px;
  margin-inline: auto;
}

.big-gallery-image-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: #050c16;
  cursor: pointer;
}

.big-gallery-image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s var(--ease), opacity 0.3s var(--ease);
}

.big-gallery-image-wrap:hover img {
  transform: scale(1.03);
}

.big-gallery-badge {
  position: absolute;
  left: 20px;
  bottom: 20px;
  z-index: 5;
  background: rgba(10, 25, 47, 0.82);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: #ffffff;
  padding: 10px 18px;
  border-radius: var(--radius-full);
  font-size: 0.86rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  pointer-events: none;
}

.big-gallery-badge i {
  color: var(--gold-light);
}

.gallery-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(10, 25, 47, 0.75);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  cursor: pointer;
  transition: background 0.2s var(--ease), transform 0.2s var(--ease);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}

.gallery-arrow:hover {
  background: var(--magenta);
  border-color: var(--magenta);
  transform: translateY(-50%) scale(1.1);
}

.gallery-arrow--prev {
  left: 20px;
}

.gallery-arrow--next {
  right: 20px;
}

.big-gallery-thumbs {
  display: flex;
  align-items: center;
  gap: 10px;
  overflow-x: auto;
  padding-top: 16px;
  padding-bottom: 6px;
  scroll-behavior: smooth;
}

.big-gallery-thumbs::-webkit-scrollbar {
  height: 6px;
}

.big-gallery-thumbs::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 99px;
}

.gallery-thumb {
  width: 76px;
  height: 52px;
  border-radius: 8px;
  overflow: hidden;
  flex-shrink: 0;
  cursor: pointer;
  opacity: 0.55;
  border: 2px solid transparent;
  transition: opacity 0.2s var(--ease), border-color 0.2s var(--ease), transform 0.2s var(--ease);
}

.gallery-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery-thumb:hover {
  opacity: 0.9;
  transform: translateY(-2px);
}

.gallery-thumb.is-active {
  opacity: 1;
  border-color: var(--gold-light);
  transform: scale(1.05);
}

@media (max-width: 640px) {
  .gallery-arrow { width: 40px; height: 40px; font-size: 1rem; }
  .gallery-arrow--prev { left: 10px; }
  .gallery-arrow--next { right: 10px; }
  .big-gallery-badge { left: 10px; bottom: 10px; padding: 6px 12px; font-size: 0.76rem; }
  .gallery-thumb { width: 56px; height: 40px; }
}

.big-gallery-lightbox {
  position: fixed; inset: 0; z-index: 1500;
  background: rgba(5, 12, 22, 0.95);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; visibility: hidden;
  transition: opacity 0.3s var(--ease), visibility 0.3s;
}
.big-gallery-lightbox.is-open { opacity: 1; visibility: visible; }
.big-gallery-lightbox-img {
  max-width: 90vw; max-height: 90vh;
  object-fit: contain; border-radius: 8px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.5);
}
.big-gallery-lightbox-close,
.big-gallery-lightbox-prev,
.big-gallery-lightbox-next {
  position: absolute;
  width: 50px; height: 50px;
  border-radius: 50%;
  background: rgba(255,255,255,0.1);
  color: #fff; border: 1px solid rgba(255,255,255,0.2);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; cursor: pointer;
  transition: all 0.2s var(--ease);
}
.big-gallery-lightbox-close:hover,
.big-gallery-lightbox-prev:hover,
.big-gallery-lightbox-next:hover {
  background: var(--magenta); border-color: var(--magenta);
}
.big-gallery-lightbox-close { top: 20px; right: 20px; }
.big-gallery-lightbox-prev { left: 20px; top: 50%; transform: translateY(-50%); }
.big-gallery-lightbox-next { right: 20px; top: 50%; transform: translateY(-50%); }
@media (max-width:1080px){ .teacher-grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width:560px){ .teacher-grid{ grid-template-columns: 1fr; } }


.tilt-gallery{ display:grid; grid-template-columns: repeat(3,1fr); gap:24px; }
.tilt-card{ position:relative; aspect-ratio:4/3; border-radius: var(--radius-lg); overflow:hidden; cursor:pointer; transform-style:preserve-3d; transition: transform .15s ease-out, box-shadow .3s var(--ease); box-shadow: var(--shadow-sm); }
.tilt-card:hover{ box-shadow: var(--shadow-lg); }
.tilt-card__bg{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:14px; color:#fff; transform: translateZ(20px); }
.tilt-card__bg i{ font-size:2.4rem; opacity:.9; }
.tilt-card__bg span{ font-family:var(--font-display); font-size:1.2rem; font-weight:600; }
.tilt-card.g1 .tilt-card__bg{ background: radial-gradient(circle at 30% 20%, var(--blue-deep), var(--navy) 70%); }
.tilt-card.g2 .tilt-card__bg{ background: radial-gradient(circle at 70% 20%, var(--magenta), var(--navy) 70%); }
.tilt-card.g3 .tilt-card__bg{ background: radial-gradient(circle at 30% 80%, var(--gold-dark), var(--navy) 70%); }
.tilt-card.g4 .tilt-card__bg{ background: radial-gradient(circle at 70% 80%, var(--blue), var(--navy) 70%); }
.tilt-card.g5 .tilt-card__bg{ background: radial-gradient(circle at 50% 30%, var(--magenta-2), var(--navy) 70%); }
.tilt-card.g6 .tilt-card__bg{ background: radial-gradient(circle at 50% 70%, var(--navy-soft), var(--navy) 70%); }
.tilt-card__zoom{ position:absolute; right:16px; bottom:16px; width:38px; height:38px; border-radius:50%; background: rgba(255,255,255,.16); backdrop-filter: blur(6px); display:flex; align-items:center; justify-content:center; color:#fff; transform: translateZ(30px); }
@media (max-width:980px){ .tilt-gallery{ grid-template-columns: repeat(2,1fr);} }
@media (max-width:560px){ .tilt-gallery{ grid-template-columns: 1fr;} }

.lightbox{ position:fixed; inset:0; z-index:1200; display:flex; align-items:center; justify-content:center; padding:28px; background: rgba(6,14,26,.92); backdrop-filter: blur(6px); opacity:0; visibility:hidden; transition: opacity .3s var(--ease), visibility .3s; }
.lightbox.is-open{ opacity:1; visibility:visible; }
.lightbox__stage{ position:relative; width:min(880px,100%); aspect-ratio:16/10; border-radius: var(--radius-lg); overflow:hidden; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:16px; color:#fff; }
.lightbox__caption{ position:absolute; left:24px; bottom:22px; text-align:left; }
.lightbox__caption strong{ font-family:var(--font-display); font-size:1.4rem; display:block; }
.lightbox__caption span{ font-size:.86rem; color: rgba(255,255,255,.7); }
.lightbox__close, .lightbox__prev, .lightbox__next{ position:absolute; width:48px; height:48px; border-radius:50%; background: rgba(255,255,255,.12); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.1rem; transition: background .2s var(--ease); }
.lightbox__close:hover, .lightbox__prev:hover, .lightbox__next:hover{ background: rgba(255,255,255,.28); }
.lightbox__close{ top:-60px; right:0; }
.lightbox__prev{ left:-64px; top:50%; transform:translateY(-50%); }
.lightbox__next{ right:-64px; top:50%; transform:translateY(-50%); }
@media (max-width:900px){ .lightbox__prev{ left:10px; } .lightbox__next{ right:10px; } .lightbox__close{ top:10px; right:10px; } }


.form-field{ position:relative; margin-bottom:20px; }
.form-field label{ display:block; font-size:.82rem; font-weight:700; color: var(--navy); margin-bottom:8px; }
.section--dark .form-field label, .on-dark .form-field label{ color: rgba(255,255,255,.85); }
.form-field input, .form-field select, .form-field textarea{
  width:100%; padding:14px 16px; border-radius: var(--radius-sm); border:1.5px solid var(--border);
  background:#fff; font-size:.95rem; color: var(--ink); transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus{ border-color: var(--blue); box-shadow: 0 0 0 4px rgba(0,114,188,.12); outline:none; }
.form-field textarea{ resize:vertical; min-height:120px; }
.form-field .hint{ margin-top:6px; font-size:.76rem; color: var(--muted-2); }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:640px){ .form-row{ grid-template-columns:1fr; } }
.form-check{ display:flex; align-items:flex-start; gap:10px; font-size:.84rem; color: var(--muted); }
.form-check input{ margin-top:3px; width:16px; height:16px; accent-color: var(--blue); flex-shrink:0; }
.form-error{ display:none; margin-top:6px; font-size:.78rem; color: var(--magenta); font-weight:600; }
.form-field.has-error input, .form-field.has-error select{ border-color: var(--magenta); }
.form-field.has-error .form-error{ display:block; }
.form-success{ display:none; align-items:center; gap:12px; padding:16px 18px; border-radius: var(--radius-sm); background: rgba(37,211,102,.1); border:1px solid rgba(37,211,102,.35); color:#128a48; font-weight:700; font-size:.9rem; margin-top:16px; }
.form-success.is-visible{ display:flex; }
.form-success i{ font-size:1.3rem; }


.apply-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:24px; }
.apply-card{ padding:30px 26px; display:flex; flex-direction:column; gap:14px; }
.apply-card__tag{ align-self:flex-start; font-size:.72rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; padding:5px 12px; border-radius:99px; }
.apply-card__tag.gold{ background: rgba(212,175,55,.15); color: var(--gold-dark); }
.apply-card__tag.magenta{ background: rgba(158,0,89,.1); color: var(--magenta); }
.apply-card__tag.blue{ background: rgba(0,114,188,.1); color: var(--blue-deep); }
.apply-card h3{ font-size:1.2rem; }
.apply-card ul{ display:flex; flex-direction:column; gap:8px; font-size:.86rem; color: var(--muted); }
.apply-card ul li{ display:flex; gap:8px; align-items:flex-start; }
.apply-card ul li i{ color: var(--blue); margin-top:3px; font-size:.8rem; }
@media (max-width:980px){ .apply-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:640px){ .apply-grid{ grid-template-columns:1fr; } }

.apply-form-wrap{ display:grid; grid-template-columns: 1fr 1fr; gap:44px; align-items:start; }
@media (max-width:980px){ .apply-form-wrap{ grid-template-columns:1fr; } }
.form-panel{ background:#fff; border:1px solid var(--border); border-radius: var(--radius-lg); padding: clamp(26px,4vw,40px); box-shadow: var(--shadow-md); }
.apply-side-card{ background: var(--navy); border-radius: var(--radius-lg); padding: 30px 28px; color: rgba(255,255,255,.78); margin-bottom:22px; }
.apply-side-card h4{ color:#fff; font-size:1.1rem; display:flex; align-items:center; gap:10px; }
.apply-side-card ul{ margin-top:14px; display:flex; flex-direction:column; gap:10px; font-size:.88rem; }
.apply-side-card ul li{ display:flex; gap:10px; }
.apply-side-card ul li i{ color: var(--gold-light); margin-top:3px; }


.contact-grid{ display:grid; grid-template-columns: .9fr 1.1fr; gap:44px; align-items:start; }
@media (max-width:980px){ .contact-grid{ grid-template-columns:1fr; } }
.contact-info-card{ display:flex; gap:16px; padding:22px; background:#fff; border:1px solid var(--border); border-radius: var(--radius-md); margin-bottom:16px; }
.contact-info-card h4{ font-size:1rem; color: var(--navy); }
.contact-info-card p, .contact-info-card a{ font-size:.9rem; margin-top:4px; }
.contact-info-card a:hover{ color: var(--blue); }
.map-frame{ margin-top:22px; border-radius: var(--radius-lg); overflow:hidden; border:1px solid var(--border); box-shadow: var(--shadow-sm); }
.map-frame iframe{ width:100%; height:320px; border:0; display:block; filter: grayscale(.15) contrast(1.05); }
.social-row{ display:flex; gap:12px; margin-top:22px; }
.social-row a{ width:44px; height:44px; border-radius:50%; background: var(--offwhite); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; color: var(--navy); transition:.25s var(--ease); }
.social-row a:hover{ background: var(--navy); color:#fff; }


.faq-list{ max-width:820px; margin-inline:auto; display:flex; flex-direction:column; gap:12px; }
.faq-item{ background:#fff; border:1px solid var(--border); border-radius: var(--radius-md); overflow:hidden; }
.faq-item__q{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 24px; text-align:left; font-weight:700; color: var(--navy); }
.faq-item__q i{ color: var(--gold-dark); transition: transform .3s var(--ease); flex-shrink:0; }
.faq-item.is-open .faq-item__q i{ transform: rotate(45deg); }
.faq-item__a{ max-height:0; overflow:hidden; transition: max-height .35s var(--ease); }
.faq-item__a p{ padding:0 24px 20px; font-size:.92rem; }


.cta-band{ position:relative; background: linear-gradient(120deg, var(--navy) 0%, #0e2c4d 55%, var(--magenta) 165%); border-radius: var(--radius-lg); padding: clamp(40px,6vw,64px); text-align:center; overflow:hidden; }
.cta-band::before{ content:""; position:absolute; inset:0; background-image: radial-gradient(rgba(212,175,55,.4) 1px, transparent 1.4px); background-size:24px 24px; opacity:.3; }
.cta-band > *{ position:relative; z-index:1; }
.cta-band h2{ color:#fff; font-size: clamp(1.7rem,3vw,2.4rem); }
.cta-band p{ color: rgba(255,255,255,.72); margin-top:14px; max-width:560px; margin-inline:auto; }
.cta-band .hero__cta{ justify-content:center; margin-top:28px; }


.footer{ background: var(--navy); color: rgba(255,255,255,.62); padding-top: clamp(56px,7vw,90px); }
.footer__grid{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap:40px; padding-bottom:50px; border-bottom:1px solid rgba(255,255,255,.08); }
.footer__brand{ display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.footer__brand img{ width:48px; height:48px; border-radius:50%; background:#ffffff; padding:3px; box-shadow:0 4px 14px rgba(0,0,0,.35); object-fit:contain; }
.footer__brand strong{ font-family:var(--font-display); color:#fff; font-size:1.15rem; }
.footer p{ font-size:.88rem; line-height:1.7; }
.footer h5{ color:#fff; font-size:.86rem; letter-spacing:.06em; text-transform:uppercase; margin-bottom:18px; }
.footer__col ul{ display:flex; flex-direction:column; gap:11px; }
.footer__col a{ font-size:.89rem; transition: color .2s var(--ease); }
.footer__col a:hover{ color: var(--gold-light); }
.footer__col li{ display:flex; gap:10px; align-items:flex-start; font-size:.89rem; }
.footer__col li i{ color: var(--gold-light); margin-top:4px; }
.footer__bottom{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding-block:24px; font-size:.8rem; }
.footer__bottom .social-row a{ background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.1); color:#fff; width:38px; height:38px; }
@media (max-width:720px){ .footer__bottom{ flex-direction:column; text-align:center; gap:10px; } }
@media (max-width:980px){ .footer__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .footer__grid{ grid-template-columns:1fr; } }


.modal-overlay{
  position:fixed; inset:0; z-index:1400; display:flex; align-items:center; justify-content:center; padding:18px;
  background: rgba(5,12,22,.72); backdrop-filter: blur(6px);
  opacity:0; visibility:hidden; transition: opacity .35s var(--ease), visibility .35s;
}
.modal-overlay.is-open{ opacity:1; visibility:visible; }
.modal{
  position:relative; width:min(980px,100%); max-height:92vh; overflow:hidden;
  display:grid; grid-template-columns:1fr 1.15fr; background:#fff; border-radius: var(--radius-lg);
  box-shadow: 0 40px 90px rgba(0,0,0,.5);
  transform: scale(.94) translateY(14px); transition: transform .35s var(--ease);
}
.modal-overlay.is-open .modal{ transform: scale(1) translateY(0); }
.modal__close{
  position:absolute; top:16px; right:16px; z-index:20; width:36px; height:36px; border-radius:50%;
  background: rgba(255,255,255,.14); border:1.5px solid rgba(255,255,255,.3); color:#ffffff;
  display:flex; align-items:center; justify-content:center; font-size:.95rem; line-height:1;
  box-shadow: 0 4px 14px rgba(0,0,0,.3); cursor:pointer;
  transition: all .2s var(--ease);
}
.modal__close:hover{ background: var(--magenta); border-color:var(--magenta); transform: rotate(90deg) scale(1.06); }

.modal__left{
  position:relative;
  background: linear-gradient(145deg, #0d223c 0%, #0a192f 55%, #061120 100%);
  color:#fff;
  padding: 40px 34px;
  overflow:hidden;
}
.modal__left::before{
  content:"";
  position:absolute;
  right:-30px;
  bottom:-30px;
  width:300px;
  height:300px;
  background: url('../img/logo-icon.webp') no-repeat center center;
  background-size: contain;
  opacity: 0.12;
  pointer-events: none;
  transform: rotate(-10deg);
  z-index: 0;
}
.modal__canvas{ position:absolute; inset:0; z-index:0; opacity:.4; }
.modal__left-content{ position:relative; z-index:1; height:100%; display:flex; flex-direction:column; }
.modal__badge{ align-self:flex-start; display:inline-flex; align-items:center; gap:8px; background: rgba(212,175,55,.18); border:1px solid rgba(212,175,55,.4); color: var(--gold-light); padding:8px 16px; border-radius:99px; font-size:.76rem; font-weight:700; }
.modal__title{ color:#fff; font-size: clamp(1.5rem,2.6vw,1.9rem); margin-top:20px; line-height:1.2; }
.modal__title em{ color: var(--gold-light); font-style:italic; }
.modal__perks{ margin-top:24px; display:flex; flex-direction:column; gap:13px; }
.modal__perks li{ display:flex; gap:10px; font-size:.88rem; color: rgba(255,255,255,.82); }
.modal__perks li i{ color: var(--gold-light); margin-top:3px; }
.modal__branches{ margin-top:auto; padding-top:26px; border-top:1px solid rgba(255,255,255,.14); display:flex; flex-wrap:wrap; gap:8px; }
.modal__branches span{ font-size:.74rem; background: rgba(255,255,255,.08); padding:6px 12px; border-radius:99px; color: rgba(255,255,255,.7); }

.modal__right{ padding: 40px 36px; overflow-y: auto; max-height: 92vh; }
.modal__right h3{ font-size:1.15rem; color: var(--navy); }
.modal__right > p{ font-size:.86rem; margin-top:6px; }
.modal__form{ margin-top:22px; }
.modal__submit-note{ display:flex; align-items:center; gap:8px; font-size:.74rem; color: var(--muted-2); margin-top:4px; }
.modal__submit-note i{ color: var(--whatsapp); }

@media (max-width:768px){
  .modal-overlay{ padding:12px; align-items:center; }
  .modal{ grid-template-columns:1fr; max-width:460px; width:100%; max-height:92vh; border-radius:16px; overflow-y:auto; -webkit-overflow-scrolling:touch; }
  .modal__left{ display:none; }
  .modal__right{ padding:22px 18px 18px; max-height:none; background:#fff; }
  .modal__right h3{ font-size:1.15rem; color:var(--navy); padding-right:34px; }
  .modal__right > p{ font-size:.82rem; color:var(--muted); margin-top:4px; }
  .modal__form{ margin-top:14px; }
  .modal__form .form-row{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
  .modal__form .form-field{ margin-bottom:10px; }
  .modal__form .form-field label{ font-size:.76rem; margin-bottom:4px; font-weight:700; }
  .modal__form input, .modal__form select{ padding:9px 12px; font-size:16px; border-radius:8px; border:1.5px solid var(--border); }
  .modal__form .btn{ padding:12px 18px; font-size:.9rem; font-weight:700; margin-top:4px; }
  .modal__submit-note{ font-size:.72rem; margin-top:6px; text-align:center; justify-content:center; }
  .modal__close{ top:14px; right:14px; width:32px; height:32px; background:rgba(10,25,47,.08); border:1px solid rgba(10,25,47,.15); color:var(--navy); font-size:.9rem; }
  .modal__close:hover{ background:var(--magenta); border-color:var(--magenta); color:#fff; }
}

@media (max-width:480px){
  .modal-overlay{ padding:8px; }
  .modal{ max-height:94vh; border-radius:14px; }
  .modal__right{ padding:18px 14px 14px; }
  .modal__right h3{ font-size:1.05rem; padding-right:30px; }
  .modal__form input, .modal__form select{ padding:8px 10px; font-size:16px; }
  .modal__close{ top:12px; right:12px; width:30px; height:30px; font-size:.82rem; }
}


.reveal{
  opacity:0;
  transform: translateY(32px) scale(.98);
  transition: opacity .65s cubic-bezier(.22,.61,.36,1), transform .65s cubic-bezier(.22,.61,.36,1);
}
.reveal.in-view{ opacity:1; transform:none; }
.reveal-delay-1.in-view{ transition-delay:.07s; }
.reveal-delay-2.in-view{ transition-delay:.14s; }
.reveal-delay-3.in-view{ transition-delay:.22s; }
.reveal-delay-4.in-view{ transition-delay:.30s; }
.reveal-delay-5.in-view{ transition-delay:.38s; }


.reveal-left{
  opacity:0; transform: translateX(-30px);
  transition: opacity .65s cubic-bezier(.22,.61,.36,1), transform .65s cubic-bezier(.22,.61,.36,1);
}
.reveal-left.in-view{ opacity:1; transform:none; }


.reveal-fade{
  opacity:0;
  transition: opacity .8s ease;
}
.reveal-fade.in-view{ opacity:1; }


.page-hero{
  position:relative;
  padding-top: calc(var(--nav-h) + 72px);
  padding-bottom:72px;
  background: var(--navy);
  overflow:hidden;
}
.page-hero::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 70% 60% at 85% 0%, rgba(0,114,188,.32), transparent 60%),
    radial-gradient(ellipse 60% 60% at 5% 100%, rgba(158,0,89,.3), transparent 60%);
}
.page-hero::after{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(ellipse 40% 50% at 50% 50%, rgba(212,175,55,.06), transparent 70%);
  pointer-events:none;
}
.page-hero__inner{ position:relative; z-index:1; max-width:760px; }
.breadcrumb{ display:flex; align-items:center; gap:8px; font-size:.82rem; color: rgba(255,255,255,.55); margin-top:18px; }
.breadcrumb a:hover{ color: var(--gold-light); }
.page-hero h1{ color:#fff; font-size: clamp(2.1rem,4vw,3.1rem); margin-top:16px; }
.page-hero p{ color: rgba(255,255,255,.68); margin-top:16px; font-size:1.05rem; max-width:600px; }

@media (max-width: 720px){
  .page-hero{ padding-top: calc(var(--nav-h) + 24px); padding-bottom: 40px; }
  .page-hero h1{ font-size: clamp(1.75rem, 6.5vw, 2.4rem); margin-top:10px; }
  .page-hero p{ font-size: .95rem; margin-top:10px; }
  .breadcrumb{ margin-top:10px; }
}


.badge-pill{ display:inline-flex; align-items:center; gap:8px; background: var(--offwhite); border:1px solid var(--border); padding:7px 14px; border-radius:99px; font-size:.78rem; font-weight:700; color: var(--navy); }
.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
@media (max-width:900px){ .two-col{ grid-template-columns:1fr; gap:32px; } }
.list-check{ display:flex; flex-direction:column; gap:12px; margin-top:20px; }
.list-check li{ display:flex; gap:12px; align-items:flex-start; font-size:.94rem; color: var(--muted); }
.list-check li i{ width:22px; height:22px; border-radius:50%; background: rgba(0,114,188,.12); color: var(--blue); display:flex; align-items:center; justify-content:center; font-size:.68rem; flex-shrink:0; margin-top:2px; }

.branch-scroll{ display:flex; gap:10px; overflow-x:auto; padding-bottom:6px; margin-top:28px; }
.branch-scroll::-webkit-scrollbar{ height:5px; }
.branch-scroll::-webkit-scrollbar-thumb{ background: var(--border); border-radius:99px; }


.mt-8{ margin-top:8px;} .mt-16{ margin-top:16px;} .mt-24{ margin-top:24px;} .mt-32{ margin-top:32px;} .mt-48{ margin-top:48px;}
.text-center{ text-align:center; }




.card{
  transition: box-shadow .28s ease, transform .28s ease;
}
.card:hover{
  box-shadow: 0 12px 36px rgba(0,0,0,.10), 0 2px 8px rgba(0,0,0,.06);
  transform: translateY(-3px);
}


.section--dark .eyebrow::before{
  background: linear-gradient(90deg, var(--gold), var(--gold-light), var(--gold));
  background-size: 200%;
  animation: eyebrowShimmer 3s linear infinite;
}
@keyframes eyebrowShimmer{
  0%   { background-position: 200% center; }
  100% { background-position: -200% center; }
}


.stat-card,
.feature-card,
.feature-block{
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.stat-card:hover,
.feature-card:hover,
.feature-block:hover{
  border-color: rgba(212,175,55,.45);
  box-shadow: 0 8px 30px rgba(212,175,55,.12), 0 2px 8px rgba(0,0,0,.06);
  transform: translateY(-2px);
}


.rank-item{
  transition: background .22s ease, box-shadow .22s ease;
}
.rank-item:hover{
  background: rgba(212,175,55,.06);
  box-shadow: inset 3px 0 0 var(--gold);
}


.tilt-card{
  transition: transform .32s cubic-bezier(.22,.61,.36,1), box-shadow .32s ease;
}
.tilt-card:hover{
  transform: translateY(-5px) scale(1.018);
  box-shadow: 0 18px 48px rgba(0,0,0,.22), 0 4px 12px rgba(212,175,55,.18);
}


.slider__dots button{
  transition: background .35s ease, width .35s ease;
}
.slider__dots button.is-active{
  background: var(--gold) !important;
  width: 42px !important;
}


.section--dark::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:1px;
  background: linear-gradient(90deg, transparent, rgba(212,175,55,.35), transparent);
  pointer-events:none;
}


.gallery-lightbox-caption{
  position: absolute;
  bottom: 56px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(10, 25, 47, 0.75);
  border: 1px solid rgba(212, 175, 55, .3);
  color: rgba(255,255,255,.9);
  font-size: .85rem;
  font-weight: 600;
  padding: 6px 20px;
  border-radius: 99px;
  pointer-events: none;
  white-space: nowrap;
  max-width: 80vw;
  overflow: hidden;
  text-overflow: ellipsis;
  backdrop-filter: blur(6px);
}

/* ==========================================================================
   Responsive Video Showcase Component
   ========================================================================== */
.video-showcase {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
}

@media (max-width: 991px) {
  .video-showcase {
    grid-template-columns: 1fr;
  }
}

.video-showcase__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.video-showcase__features {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-block: 24px 32px;
}

.video-feature-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: rgba(212, 175, 55, 0.08);
  border: 1px solid rgba(212, 175, 55, 0.25);
  border-radius: var(--radius-full);
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--navy);
}

.section--dark .video-feature-pill {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.15);
  color: var(--white);
}

.video-feature-pill i {
  color: var(--gold-dark);
}
.section--dark .video-feature-pill i {
  color: var(--gold-light);
}

.video-card-container {
  position: relative;
  width: 100%;
  max-width: 380px;
  margin-inline: auto;
}

.video-card-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 9 / 16;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: #000;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4), 0 0 30px rgba(212, 175, 55, 0.15);
  border: 2px solid rgba(212, 175, 55, 0.3);
  transition: transform 0.35s var(--ease), box-shadow 0.35s var(--ease);
}

.video-card-frame:hover {
  transform: translateY(-4px);
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.5), 0 0 40px rgba(212, 175, 55, 0.25);
}

.video-card-frame video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.video-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10, 25, 47, 0.25) 0%, rgba(10, 25, 47, 0.8) 100%);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 24px;
  cursor: pointer;
  z-index: 10;
  transition: opacity 0.4s var(--ease), visibility 0.4s var(--ease);
}

.video-card-frame.is-playing .video-overlay {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

.video-overlay__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.video-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  background: rgba(10, 25, 47, 0.85);
  border: 1px solid rgba(212, 175, 55, 0.4);
  border-radius: var(--radius-full);
  color: var(--white);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  backdrop-filter: blur(8px);
}

.video-badge i {
  color: var(--gold-light);
}

.video-badge--sound {
  background: rgba(37, 211, 102, 0.9);
  border: none;
  color: #fff;
}

.video-overlay__center {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  text-align: center;
}

.play-btn-pulse {
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--gold-light), var(--gold-dark));
  color: var(--navy);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.8rem;
  box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.6);
  animation: pulse-gold 2s infinite;
  transition: transform 0.3s var(--ease);
  padding-left: 4px;
}

.video-overlay:hover .play-btn-pulse {
  transform: scale(1.1);
}

@keyframes pulse-gold {
  0% {
    box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.7);
  }
  70% {
    box-shadow: 0 0 0 20px rgba(212, 175, 55, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(212, 175, 55, 0);
  }
}

.video-overlay__title {
  color: var(--white);
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 700;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
}

.video-overlay__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: rgba(255, 255, 255, 0.9);
  font-size: 0.82rem;
  font-weight: 600;
}

.video-custom-controls {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, rgba(10, 25, 47, 0.95));
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 14px;
  z-index: 12;
  opacity: 0;
  transition: opacity 0.3s var(--ease);
  pointer-events: none;
}

.video-card-frame.is-playing:hover .video-custom-controls,
.video-card-frame.is-paused .video-custom-controls {
  opacity: 1;
  pointer-events: auto;
}

.video-control-btn {
  color: var(--white);
  font-size: 1.1rem;
  transition: color 0.2s ease, transform 0.2s ease;
  cursor: pointer;
}
.video-control-btn:hover {
  color: var(--gold-light);
  transform: scale(1.1);
}

.video-progress-bar {
  flex: 1;
  height: 5px;
  background: rgba(255, 255, 255, 0.3);
  border-radius: 99px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.video-progress-fill {
  height: 100%;
  width: 0%;
  background: var(--gold);
  border-radius: 99px;
  transition: width 0.1s linear;
}

/* ==========================================================================
   Video Lightbox Modal (Constrained Size Popup Like Gallery Photos)
   ========================================================================== */
.video-lightbox {
  position: fixed;
  inset: 0;
  z-index: 2500;
  background: rgba(5, 12, 22, 0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s var(--ease), visibility 0.3s var(--ease);
  padding: 20px;
}

.video-lightbox.is-open {
  opacity: 1;
  visibility: visible;
}

.video-lightbox-backdrop {
  position: absolute;
  inset: 0;
}

.video-lightbox-container {
  position: relative;
  width: 100%;
  max-width: 400px;
  max-height: 82vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 10;
  transform: scale(0.94);
  transition: transform 0.35s var(--ease);
}

.video-lightbox.is-open .video-lightbox-container {
  transform: scale(1);
}

.video-lightbox-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 9 / 16;
  max-height: 78vh;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: #000;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.7), 0 0 40px rgba(212, 175, 55, 0.25);
  border: 2px solid rgba(212, 175, 55, 0.4);
}

.video-lightbox-frame video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #000;
  display: block;
}

.video-lightbox-close {
  position: absolute;
  top: -54px;
  right: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  cursor: pointer;
  transition: all 0.2s var(--ease);
  z-index: 12;
}

.video-lightbox-close:hover {
  background: var(--magenta);
  border-color: var(--magenta);
  transform: scale(1.08);
}

@media (max-width: 640px) {
  .video-lightbox {
    padding: 14px 10px;
  }
  .video-lightbox-container {
    max-width: 320px;
    max-height: 84vh;
  }
  .video-lightbox-frame {
    max-height: 76vh;
    border-radius: var(--radius-md);
  }
  .video-lightbox-close {
    top: -46px;
    right: 2px;
    width: 38px;
    height: 38px;
    font-size: 1.05rem;
  }
}

@media (max-width: 380px) {
  .video-lightbox-container {
    max-width: 290px;
  }
}