/* ===== FORCE DARK OVERLAY ON REVIEW CARDS - HIGH SPECIFICITY ===== */

/* Target the review card content block with maximum specificity */
/* ===== DROPDOWN GAP FIX - SIMPLE ===== */
/* ===========================
   NAVBAR - WHITE & BLUE THEME
   =========================== */

/* Navbar */
.navbar{
    position: relative;
    background: 
        radial-gradient(ellipse 800px 600px at 20% -10%, rgba(212,175,55,.18) 0%, transparent 60%),
        radial-gradient(ellipse 900px 700px at 100% 30%, rgba(79,110,247,.35) 0%, transparent 55%),
        linear-gradient(160deg, #000524 0%, #021268 50%, #0a1f6b 100%) !important;
    background-size: 130% 130% !important;
    background-position: center !important;
    overflow: hidden;
}

.navbar::before{
    content:'';
    position:absolute;
    inset:0;
    background: linear-gradient(
        115deg,
        transparent 30%,
        rgba(255,255,255,.05) 45%,
        rgba(255,255,255,.09) 50%,
        rgba(255,255,255,.05) 55%,
        transparent 70%
    );
    pointer-events:none;
    z-index:0;
}

.navbar > *{
    position:relative;
    z-index:1;
}/* ===========================
   HERO SECTION BACKGROUND
=========================== */
.hero{
    position: relative;
    background: 
        radial-gradient(ellipse 800px 600px at 20% -10%, rgba(212,175,55,.18) 0%, transparent 60%),
        radial-gradient(ellipse 900px 700px at 100% 30%, rgba(79,110,247,.35) 0%, transparent 55%),
        radial-gradient(ellipse 700px 500px at 30% 120%, rgba(2,24,151,.7) 0%, transparent 60%),
        linear-gradient(160deg, #000524 0%, #021268 50%, #0a1f6b 100%) !important;
    background-size: 130% 130% !important;
    background-position: center !important;
    color:#fff !important;
    overflow: hidden;
    animation: heroGlow 18s ease-in-out infinite alternate;
}

.hero::before{
    content:'';
    position:absolute;
    inset:0;
    background: linear-gradient(
        115deg,
        transparent 30%,
        rgba(255,255,255,.05) 45%,
        rgba(255,255,255,.09) 50%,
        rgba(255,255,255,.05) 55%,
        transparent 70%
    );
    pointer-events:none;
    z-index:0;
}

.hero::after{
    content:'';
    position:absolute;
    inset:0;
    background-image:
        radial-gradient(2px 2px at 10% 20%, rgba(212,175,55,.6) 0%, transparent 100%),
        radial-gradient(2px 2px at 80% 15%, rgba(212,175,55,.5) 0%, transparent 100%),
        radial-gradient(1.5px 1.5px at 60% 60%, rgba(255,255,255,.4) 0%, transparent 100%),
        radial-gradient(1.5px 1.5px at 25% 75%, rgba(212,175,55,.4) 0%, transparent 100%),
        radial-gradient(2px 2px at 90% 80%, rgba(255,255,255,.3) 0%, transparent 100%),
        radial-gradient(1px 1px at 45% 30%, rgba(212,175,55,.5) 0%, transparent 100%),
        radial-gradient(1.5px 1.5px at 70% 45%, rgba(255,255,255,.35) 0%, transparent 100%);
    background-repeat: no-repeat;
    pointer-events:none;
    z-index:0;
}

.hero .container,
.hero .page-vertical-padding,
.hero .hero-content-wrapper,
.hero .hero-top-block{
    position:relative;
    z-index:1;
}

@keyframes heroGlow{
    0%   { background-position: 40% 40%; }
    100% { background-position: 60% 60%; }
}

/* ===========================
   TRUST BADGE
=========================== */
.hero-review-block{
    background: rgba(255,255,255,.08) !important;
    border: 1px solid rgba(212,175,55,.35) !important;
    border-radius:50px;
    backdrop-filter: blur(12px);
    box-shadow: 0 4px 20px rgba(0,0,0,.25);
}

.hero-review-block .paragraph-p2{
    color:#fff !important;
}

/* ===========================
   HEADLINE
=========================== */
.hero-title-block h1,
.hero-title-block h2,
.hero-title-block .heading-style-h1{
    color:#fff !important;
}

.hero-title-block::after{
    content:'';
    display:block;
    width:70px;
    height:2px;
    margin-top:22px;
    background: linear-gradient(90deg, transparent, #d4af37, transparent);
}

/* ===========================
   DESCRIPTION
=========================== */
.hero-description-block .paragraph-p1{
    color:rgba(255,255,255,.85) !important;
}

/* ===========================
   CTA BUTTON
=========================== */
.button-primary{
    background:#ffffff !important;
    border:2px solid #ffffff !important;
    border-radius:50px;
    color:#021897 !important;
}

.button-primary .button-primary-text-block,
.button-primary .button-primary-text-block div{
    color:#021897 !important;
}

.button-primary .button-circle{
    background:#021897 !important;
}

.button-primary .button-icon{
    filter:brightness(0) invert(1) !important;
}

.button-primary:hover{
    background:#021897 !important;
    border-color:#d4af37 !important;
}

.button-primary:hover .button-primary-text-block,
.button-primary:hover .button-primary-text-block div{
    color:#ffffff !important;
}

.button-primary:hover .button-circle{
    background:#d4af37 !important;
}

.button-primary:hover .button-icon{
    filter:brightness(0) saturate(100%) invert(14%) sepia(97%) saturate(4774%) hue-rotate(233deg) brightness(87%) contrast(113%) !important;
}

/* ===========================
   FLOATING CARDS (750+ / 99%)
=========================== */
.hero-floating-card{
    background:#021897 !important;
    border-radius:22px;
    padding:8px;
}

.hero-floating-card-content-block{
    background:#ffffff !important;
    border-radius:16px;
    padding:14px;
    box-shadow:0 8px 24px rgba(0,0,0,.12);
}

.hero-floating-card-content-block .paragraph-p3,
.hero-floating-card-content-block .font-weight-600{
    color:#021897 !important;
}

.floating-card-icon-block{
    background:#021897 !important;
    border-radius:50%;
    padding:10px;
}

.floating-card-icon-block img{
    filter:brightness(0) invert(1);
}

.floating-card-image{
    border:4px solid #d4af37;
    border-radius:18px;
}

/* ===========================
   HERO CARDS (image + overlay)
=========================== */
.hero-card-overlay{
    background:linear-gradient(180deg,transparent 0%,rgba(2,24,151,.9) 100%) !important;
}

.hero-card-text-block .heading-style-h4,
.hero-card-text-block .paragraph-p1{
    color:#fff !important;
}
/* ===========================
   NAVBAR - gradient background
=========================== */
.navbar{
    background: 
        radial-gradient(ellipse 800px 600px at 20% -10%, rgba(212,175,55,.18) 0%, transparent 60%),
        radial-gradient(ellipse 900px 700px at 100% 30%, rgba(79,110,247,.35) 0%, transparent 55%),
        radial-gradient(ellipse 700px 500px at 30% 120%, rgba(2,24,151,.7) 0%, transparent 60%),
        linear-gradient(160deg, #000524 0%, #021268 50%, #0a1f6b 100%) !important;
    background-attachment: fixed !important;
    background-size: 130% 130% !important;
    background-position: center !important;
}

.nav-container{
    background:#ffffff !important;
}

/* ===========================
   HERO - identical gradient, same fixed attachment
   so it lines up seamlessly with navbar above it
=========================== */
.hero{
    position: relative;
    background: 
        radial-gradient(ellipse 800px 600px at 20% -10%, rgba(212,175,55,.18) 0%, transparent 60%),
        radial-gradient(ellipse 900px 700px at 100% 30%, rgba(79,110,247,.35) 0%, transparent 55%),
        radial-gradient(ellipse 700px 500px at 30% 120%, rgba(2,24,151,.7) 0%, transparent 60%),
        linear-gradient(160deg, #000524 0%, #021268 50%, #0a1f6b 100%) !important;
    background-attachment: fixed !important;
    background-size: 130% 130% !important;
    background-position: center !important;
    color:#fff !important;
    overflow: hidden;
}

.hero::before{
    content:'';
    position:absolute;
    inset:0;
    background: linear-gradient(
        115deg,
        transparent 30%,
        rgba(255,255,255,.05) 45%,
        rgba(255,255,255,.09) 50%,
        rgba(255,255,255,.05) 55%,
        transparent 70%
    );
    pointer-events:none;
    z-index:0;
}

.hero::after{
    content:'';
    position:absolute;
    inset:0;
    background-image:
        radial-gradient(2px 2px at 10% 20%, rgba(212,175,55,.6) 0%, transparent 100%),
        radial-gradient(2px 2px at 80% 15%, rgba(212,175,55,.5) 0%, transparent 100%),
        radial-gradient(1.5px 1.5px at 60% 60%, rgba(255,255,255,.4) 0%, transparent 100%),
        radial-gradient(1.5px 1.5px at 25% 75%, rgba(212,175,55,.4) 0%, transparent 100%),
        radial-gradient(2px 2px at 90% 80%, rgba(255,255,255,.3) 0%, transparent 100%),
        radial-gradient(1px 1px at 45% 30%, rgba(212,175,55,.5) 0%, transparent 100%),
        radial-gradient(1.5px 1.5px at 70% 45%, rgba(255,255,255,.35) 0%, transparent 100%);
    background-repeat: no-repeat;
    pointer-events:none;
    z-index:0;
}

.hero .container,
.hero .page-vertical-padding,
.hero .hero-content-wrapper,
.hero .hero-top-block{
    position:relative;
    z-index:1;
}

/* ===========================
   TRUST BADGE
=========================== */
.hero-review-block{
    background: rgba(255,255,255,.08) !important;
    border: 1px solid rgba(212,175,55,.35) !important;
    border-radius:50px;
    backdrop-filter: blur(12px);
}

.hero-review-block .paragraph-p2{
    color:#fff !important;
}

/* ===========================
   HEADLINE
=========================== */
.hero-title-block h1,
.hero-title-block h2,
.hero-title-block .heading-style-h1{
    color:#fff !important;
}

.hero-title-block::after{
    content:'';
    display:block;
    width:70px;
    height:2px;
    margin-top:22px;
    background: linear-gradient(90deg, transparent, #d4af37, transparent);
}

/* ===========================
   DESCRIPTION
=========================== */
.hero-description-block .paragraph-p1{
    color:rgba(255,255,255,.85) !important;
}

/* ===========================
   CTA BUTTON
=========================== */
.button-primary{
    background:#ffffff !important;
    border:2px solid #ffffff !important;
    border-radius:50px;
    color:#021897 !important;
}

.button-primary .button-primary-text-block,
.button-primary .button-primary-text-block div{
    color:#021897 !important;
}

.button-primary .button-circle{
    background:#021897 !important;
}

.button-primary .button-icon{
    filter:brightness(0) invert(1) !important;
}

.button-primary:hover{
    background:#021897 !important;
    border-color:#d4af37 !important;
}

.button-primary:hover .button-primary-text-block,
.button-primary:hover .button-primary-text-block div{
    color:#ffffff !important;
}

.button-primary:hover .button-circle{
    background:#d4af37 !important;
}

.button-primary:hover .button-icon{
    filter:brightness(0) saturate(100%) invert(14%) sepia(97%) saturate(4774%) hue-rotate(233deg) brightness(87%) contrast(113%) !important;
}

/* ===========================
   FLOATING CARDS - only white box visible
=========================== */
.hero-floating-card{
    background: transparent !important;
    border-radius:22px;
    padding:0;
    position:relative;
}

.hero-floating-card-content-block{
    background:#ffffff !important;
    border-radius:16px;
    padding:14px;
    box-shadow:0 12px 30px rgba(0,0,0,.35);
}

.hero-floating-card-content-block .paragraph-p3,
.hero-floating-card-content-block .font-weight-600{
    color:#021897 !important;
}

.floating-card-icon-block{
    background:#021897 !important;
    border-radius:50%;
    padding:10px;
}

.floating-card-icon-block img{
    filter:brightness(0) invert(1);
}

.floating-card-image{
    border:4px solid #d4af37;
    border-radius:18px;
    box-shadow:0 8px 20px rgba(0,0,0,.3);
}

/* ===========================
   HERO CARDS
=========================== */
.hero-card-overlay{
    background:linear-gradient(180deg,transparent 0%,rgba(2,24,151,.9) 100%) !important;
}

.hero-card-text-block .heading-style-h4,
.hero-card-text-block .paragraph-p1{
    color:#fff !important;
}

/* ===========================
   VIDEO CARD
=========================== */
.hero-video-card{
    background:transparent !important;
    border-radius:16px;
}

.hero-video-card .hero-card-text-block.video-card .heading-style-h4{
    color:#fff !important;
}

.hero-video-card .hero-card-text-block.video-card .paragraph-p1{
    color:rgba(255,255,255,.8) !important;
}

.play-pause-button{
    background:rgba(255,255,255,.15) !important;
    border-radius:50%;
    backdrop-filter: blur(6px);
}

.icon-24px{
    filter:brightness(0) invert(1);
}
/* ===========================
   VIDEO CARD (ASQUAREB block)
=========================== */
.hero-video-card{
    background:#021897 !important;
    border-radius:16px;
}/* ===========================
   ASB HEADER - complete build
=========================== *//* ===== Header: bigger logo + nav font ===== */
.asb-header__logo-img {
        /* was likely ~36-40px, adjust as needed */
  width: auto;
}

.asb-header__link {
  font-size: 17px;     /* increase from default (~14-15px) */
  font-weight: 600;
}

.asb-header__cta {
  font-size: 16px;
  padding: 14px 26px;  /* keeps button proportional to bigger text */
}

/* ===== Trust pill: add outline ===== */
.hero-review-block {
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 999px;
  padding: 8px 18px;
}
.asb-header{
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
    max-width: none;      /* removed centering */
    margin: 0;              /* removed auto margin */
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 48px;    /* increased horizontal padding since it now spans full width */
    background: rgba(255,255,255,.88);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border-bottom: 1px solid rgba(2,24,151,.08);
    box-shadow: 0 1px 8px rgba(0,0,0,.05);
    transition: box-shadow .3s ease, background .3s ease;
}/* Subtle grid pattern overlay for texture */
.hero::before{
    content:'';
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size: 48px 48px;
    pointer-events:none;
    z-index:0;
}.hero{
    position: relative;
   
    color:#fff !important;
    overflow: hidden;
}

.asb-header.is-scrolled{
    background: rgba(255,255,255,.97);
    box-shadow: 0 4px 24px rgba(2,24,151,.12);
}@media screen and (max-width: 991px) {
  .asb-header__nav {
    background: #ffffff !important;   /* solid, not translucent */
    background-color: #ffffff !important;
    z-index: 9999;                     /* above hero's own z-index layers */
  }

  /* Kill any inherited transparency/blur that's letting hero bleed through */
  .asb-header__nav {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .asb-header__cta--mobile {
    width: auto !important;
    max-width: 240px !important;
    margin: 20px auto 0 !important;
    padding: 12px 24px !important;
    display: flex !important;
    justify-content: center !important;
  }

  .asb-header__cta--mobile span:nth-child(2) {
    font-size: 14px !important;
  }

  .asb-header__cta--mobile .asb-header__cta-icon {
    width: 26px !important;
    height: 26px !important;
  }
}@media screen and (max-width: 991px) {
  .asb-header__nav {
    background: #ffffff !important;
    background-color: #ffffff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    z-index: 9999;
  }

  .asb-header__dropdown-menu {
    background: #ffffff !important;
  }

  /* Remove the dim backdrop entirely */
  .asb-header__nav::before {
    display: none !important;
  }

  .asb-header__cta--mobile {
    width: auto !important;
    max-width: 240px !important;
    margin: 20px auto 0 !important;
    padding: 12px 24px !important;
    display: flex !important;
    justify-content: center !important;
  }
}
/* ============================================================
   FOOTER — FORCE WHITE BG (high specificity)
   ============================================================ */
body .asb-footer,
footer.asb-footer,
.asb-footer.asb-footer {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

/* ============================================================
   NEWSLETTER — DARK BLUE BG, WHITE TEXT
   ============================================================ */
.asb-footer__newsletter {
  background: linear-gradient(135deg, #021268 0%, #0b2545 60%, #134074 100%) !important;
  border: none !important;
}

.asb-footer__newsletter-title {
  color: #ffffff !important;
}

.asb-footer__newsletter-feature {
  color: #ffffff !important;
}

.asb-footer__newsletter-feature svg {
  stroke: #ffffff !important;
}

.asb-footer__newsletter-form-inner {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
}

.asb-footer__newsletter-input {
  color: #ffffff !important;
}

.asb-footer__newsletter-input::placeholder {
  color: rgba(255, 255, 255, 0.6) !important;
}

.asb-footer__newsletter-btn {
  background: #ffffff !important;
  color: #021268 !important;
}

.asb-footer__newsletter-btn:hover {
  background: rgba(255, 255, 255, 0.85) !important;
  color: #021268 !important;
}

/* ============================================================
   FORCE ALL FOOTER TEXT TO BLUE — catches any remaining black
   ============================================================ */
.asb-footer,
.asb-footer * {
  color: #021268;
}

/* Re-apply white specifically inside the newsletter box (dark bg) */
.asb-footer__newsletter,
.asb-footer__newsletter * {
  color: #ffffff !important;
}

.asb-footer__newsletter-input {
  color: #ffffff !important;
}

.asb-footer__newsletter-btn {
  color: #021268 !important;
}

/* Nav title underline + branch accents */
.asb-footer__nav-title::after {
  background: #021268 !important;
}

.asb-footer__nav-link::before {
  background: #021268 !important;
}/* ============================================================
   SITE-WIDE COLOR THEME — BLUE / WHITE / BLACK (no gold)
   Scope: everything except header, hero, footer (already themed)
   ============================================================ */

/* ---------- 1. GLOBAL TEXT DEFAULTS (white-bg sections) ---------- */
.about-preview, .why, .model-deck-container, .programs-professional,
.review, .blog, .faq {
  background: #ffffff !important;
}

.about-preview h2, .why h2, .model-deck-container h3, .programs-professional h2,
.review h2, .blog h2, .faq h2,
.section-title-block h2,
.about-preview-headline,
.deck-title, .programs-title,
.program-card-title, .why-card-title-block .heading-style-h4,
.faq-question-block, .blog-card-title-block .heading-style-h4 {
  color: #021268 !important;
}

.about-preview-description .paragraph-p1,
.why-top-block .section-description-block .paragraph-p1,
.section-description-block .paragraph-p1,
.deck-subtitle, .programs-subtitle,
.program-card-desc, .why-card-description-block,
.deck-item-desc, .faq-answer-wrapper,
.faq-answer-wrapper div,
.highlight-item {
  color: #444444!important;
}

/* ---------- 2. ABOUT US PREVIEW ---------- */
.about-section-tag { color: #021268 !important; }
.tag-line { background: #021268 !important; }
.highlight-text::after { background: rgba(2, 18, 104, 0.15) !important; }

.highlight-icon, .highlight-icon-svg {
  background: #021268 !important;
}
.highlight-icon { color: #ffffff !important; }
.highlight-icon-svg svg { stroke: #ffffff !important; }

.experience-number { color: #021268 !important; }
.experience-label { color: #ffffff !important; }
.about-experience-badge { background: #021268 !important; }

.about-cta-block .button-primary { background: #ffffff !important; border: 2px solid #021268 !important; }
.about-cta-block .button-primary .button-primary-text-block,
.about-cta-block .button-primary .button-primary-text-block div { color: #021268 !important; }
.about-cta-block .button-primary .button-circle { background: #021268 !important; }
.about-cta-block .button-primary .button-icon { filter: brightness(0) invert(1) !important; }
.about-cta-block .button-primary:hover { background: #021268 !important; }
.about-cta-block .button-primary:hover .button-primary-text-block,
.about-cta-block .button-primary:hover .button-primary-text-block div { color: #ffffff !important; }
.about-cta-block .button-primary:hover .button-circle { background: #ffffff !important; }
.about-cta-block .button-primary:hover .button-icon { filter: brightness(0) saturate(100%) invert(9%) sepia(90%) saturate(6000%) hue-rotate(230deg) !important; }

/* ---------- 3. STATS SECTION — solid dark blue ---------- */
.stats-section { background-image: none !important; background-color: #021268 !important; }
.stats-overlay { background: #021268 !important; }
.stat-card { background: rgba(255, 255, 255, 0.1) !important; border-color: rgba(255, 255, 255, 0.2) !important; }
.stat-number, .stat-label, .stat-icon { color: #ffffff !important; }

/* ---------- 4. CATEGORIES SECTION — solid dark blue, unify accent colors ---------- */
.categories-section { background-image: none !important; background-color: #021268 !important; }
.categories-overlay { background: #021268 !important; }
.categories-header h2, .categories-header p { color: #ffffff !important; }
.categories-header h2 span::after { background: rgba(255, 255, 255, 0.25) !important; }

.card-cyan, .card-gold, .card-purple {
  border-top: 3px solid #ffffff !important;
}
.card-top-small h4, .category-card ul li { color: #ffffff !important; }
.category-card { background: rgba(255, 255, 255, 0.08) !important; border-color: rgba(255, 255, 255, 0.1) !important; }
.category-card:hover { background: rgba(255, 255, 255, 0.14) !important; }
.card-cyan:hover, .card-gold:hover, .card-purple:hover {
  box-shadow: 0 0 20px rgba(255, 255, 255, 0.35), 0 0 40px rgba(255, 255, 255, 0.15) !important;
}
.card-cyan::before, .card-gold::before, .card-purple::before {
  background: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.15), transparent 70%) !important;
}

.admission-btn { background: rgba(255, 255, 255, 0.08) !important; border: 1px solid rgba(255, 255, 255, 0.3) !important; color: #ffffff !important; box-shadow: none !important; }
.admission-btn:hover { background: #ffffff !important; color: #021268 !important; }

/* ---------- 5. PROGRAMS SECTION ---------- */
.programs-badge { color: #021268 !important; }
.badge-dot { background: #021268 !important; }
.programs-title .gold-text::after { background: rgba(2, 18, 104, 0.12) !important; }

.program-card { background: #ffffff !important; border-color: rgba(2, 18, 104, 0.06) !important; }
.program-card-tag { color: #021268 !important; }
.badge-primary { background: #021268 !important; color: #ffffff !important; }
.badge-secondary { background: rgba(2, 18, 104, 0.06) !important; color: #021268 !important; }
.program-feature { color: #444444!important; }
.program-feature::before { background: #021268 !important; }
.program-link { background: rgba(2, 18, 104, 0.08) !important; color: #021268 !important; }
.program-link:hover { background: #021268 !important; color: #ffffff !important; }

.slider-btn { color: #021268 !important; }
.slider-btn:hover { color: #021268 !important; }

.btn-primary { background: #021268 !important; color: #ffffff !important; }
.btn-primary:hover { background: #0330c9 !important; }

/* ---------- 6. 360° LEARNING MODEL DECK ---------- */
.deck-badge { color: #021268 !important; }
.deck-badge-line { background: #021268 !important; }
.deck-title .gold-text::after { background: rgba(2, 18, 104, 0.12) !important; }
.deck-number { color: #021268 !important; }
.deck-icon { color: #021268 !important; }
.deck-item-title { color: #021268 !important; }
.deck-item-line { background: linear-gradient(90deg, #0B77A0, #021268) !important; }
.deck-item.active .deck-item-inner { border-color: rgba(2, 18, 104, 0.15) !important; }

.deck-arrow { color: #021268 !important; }
.deck-arrow:hover { background: #021268 !important; color: #ffffff !important; }
.deck-dot { background: rgba(2, 18, 104, 0.15) !important; }
.deck-dot.active { background: #021268 !important; }
.deck-dot:hover { background: #021268 !important; }
.autoplay-btn { color: #021268 !important; }
.autoplay-btn:hover { background: rgba(2, 18, 104, 0.06) !important; }

/* ---------- 7. WHY CHOOSE US ---------- */
.why-card { background: #ffffff !important; box-shadow: 0 6px 24px rgba(2, 18, 104, 0.06) !important; }

.why-card-icon-block { background: #021268 !important; border-color: #021268 !important; }
.why-card-icon-block .why-card-icon { display: block !important; filter: brightness(0) invert(1) !important; }
.why-card-icon-block .why-card-hover-icon { display: none !important; }

.why-card:hover { background: rgba(2, 18, 104, 0.03) !important; }

/* ---------- 8. TESTIMONIALS / REVIEW ---------- */
.review { background: #ffffff !important; }
.review-card { background: #021268 !important; }
.reviewer-name, .reviewer-designation, .review-card-content-block .heading-style-h4 { color: #ffffff !important; }
.left-arrow, .right-arrow { color: #021268 !important; }
.review-slide-nav .w-slider-dot { background: rgba(2, 18, 104, 0.25) !important; }
.review-slide-nav .w-slider-dot.w-active { background: #021268 !important; }

/* ---------- 9. BLOG ---------- */
.blog { background: #ffffff !important; }
.blog-card-type-block { color: #021268 !important; }
.blog-card-devider { background: #021268 !important; opacity: 0.3; }
.blog-card-arrow { background: #021268 !important; }
.blog-card-arrow svg { stroke: #ffffff !important; }
.blog-card:hover .blog-card-arrow { background: #0B77A0 !important; box-shadow: 0 4px 20px rgba(2, 18, 104, 0.3) !important; }

/* ---------- 10. FAQ ---------- */
.faq { background: #ffffff !important; }
.faq-icon-block { background: rgba(2, 18, 104, 0.06) !important; border-radius: 50% !important; }
.faq-icon { background: #021268 !important; }
.faq-item { border-bottom: 1px solid rgba(2, 18, 104, 0.08) !important; }
.faq-question-block:hover { color: #0B77A0 !important; }

/* ---------- 11. FINAL CTA — "Ready to Join" — solid dark blue ---------- */
.cta { background-image: none !important; background-color: #021268 !important; }
.cta .section-title-block h2, .cta .section-title-block h2 span { color: #ffffff !important; }

.upsell-cta-block .button-primary { background: #ffffff !important; border: 2px solid #ffffff !important; }
.upsell-cta-block .button-primary .button-primary-text-block,
.upsell-cta-block .button-primary .button-primary-text-block div { color: #021268 !important; }
.upsell-cta-block .button-primary .button-circle { background: #021268 !important; }
.upsell-cta-block .button-primary .button-icon { filter: brightness(0) invert(1) !important; }
.upsell-cta-block .button-primary:hover { background: #021268 !important; border-color: #ffffff !important; }
.upsell-cta-block .button-primary:hover .button-primary-text-block,
.upsell-cta-block .button-primary:hover .button-primary-text-block div { color: #ffffff !important; }
.upsell-cta-block .button-primary:hover .button-circle { background: #ffffff !important; }
.upsell-cta-block .button-primary:hover .button-icon { filter: brightness(0) saturate(100%) invert(9%) sepia(90%) saturate(6000%) hue-rotate(230deg) !important; }

.cta-card-tag { background: #ffffff !important; color: #021268 !important; }
.cta-card-tag.bg-yellow, .cta-card-tag.bg-purple, .cta-card-tag.bg-white {
  background: #021268 !important;
  color: #ffffff !important;
}
/* ===== LOGO ===== */
.asb-header__logo{
    flex-shrink: 0;
}

.asb-header__logo-img{
    height: 70px;
    width: auto;
    display: block;
}

/* ===== NAV LINKS ===== */
.asb-header__nav{
    display: flex;
    align-items: center;
    gap: 6px;
}

.asb-header__link{
   
    color: #021897;
    text-decoration: none;
    background: transparent;
    border: none;
    cursor: pointer;
    font-family: inherit;
    padding: 9px 15px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: background .2s ease, color .2s ease;
}

.asb-header__link:hover{
    background: rgba(2,24,151,.07);
}

.asb-header__link--active{
    font-weight: 700;
    background: rgba(2,24,151,.06);
}

/* ===== DROPDOWN ===== */
.asb-header__dropdown{
    position: relative;
}

.asb-header__dropdown-arrow{
    transition: transform .2s ease;
}

.asb-header__dropdown:hover .asb-header__dropdown-arrow{
    transform: rotate(180deg);
}

.asb-header__dropdown-menu{
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    min-width: 320px;
    background: linear-gradient(160deg, #000524 0%, #021268 50%, #0a1f6b 100%);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 12px;
    box-shadow: 0 14px 36px rgba(2,24,151,.28);
    padding: 8px 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
    z-index: 1001;
    overflow: hidden;
}

/* diagonal sheen for a shiny finish */
.asb-header__dropdown-menu::before{
    content: "";
    position: absolute;
    top: -20%;
    left: -30%;
    width: 45%;
    height: 140%;
    background: linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.14) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-18deg);
    pointer-events: none;
}

.asb-header__dropdown:hover .asb-header__dropdown-menu{
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.asb-header__dropdown-item{
    position: relative;
    display: block;
    padding: 8px 14px;
    margin-bottom: 3px;
    border-bottom: 1px solid rgba(255,255,255,.14);
    border-radius: 6px;
    font-size: 13.5px;
    font-weight: 500;
    color: #ffffff;
    white-space: nowrap;
    text-decoration: none;
    transition: background .2s ease, padding-left .2s ease;
}

.asb-header__dropdown-item:last-child{
    margin-bottom: 0;
    border-bottom: none;
    font-weight: 700;
    background: rgba(255,255,255,.08);
}

.asb-header__dropdown-item:hover{
    background: rgba(255,255,255,.14);
    padding-left: 18px;
}

/* ===== ACTIONS (CTA + burger) ===== */
.asb-header__actions{
    display: flex;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;
}

/* ===== CTA BUTTON with magnetic cursor-fill effect ===== */
.asb-header__cta{
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    background: #021897;
    border: 2px solid #021897;
    border-radius: 50px;
    padding: 8px 8px 8px 20px;
    text-decoration: none;
    overflow: hidden;
    isolation: isolate;
    transition: border-color .3s ease;
}

.asb-header__cta-fill{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #ffffff;
    border-radius: 50%;
    transform: scale(0);
    transform-origin: var(--fill-x, 50%) var(--fill-y, 50%);
    transition: transform .5s cubic-bezier(0.19, 1, 0.22, 1);
    z-index: 0;
    pointer-events: none;
}

.asb-header__cta:hover .asb-header__cta-fill{
    transform: scale(2.5);
}

.asb-header__cta span:first-of-type ~ span:not(.asb-header__cta-icon){
    /* fallback not used, kept for clarity */
}

.asb-header__cta > span:nth-child(2){
    position: relative;
    z-index: 1;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    transition: color .3s ease;
}

.asb-header__cta:hover > span:nth-child(2){
    color: #021897;
}

.asb-header__cta-icon{
    position: relative;
    z-index: 1;
    width: 30px;
    height: 30px;
    background: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #021897;
    flex-shrink: 0;
    transition: background .3s ease, color .3s ease;
}

.asb-header__cta:hover .asb-header__cta-icon{
    background: #021897;
    color: #ffffff;
}

.asb-header__cta--mobile{
    display: none;
}

/* ===== BURGER (mobile) ===== */
.asb-header__burger{
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
}

.asb-header__burger span{
    display: block;
    width: 100%;
    height: 2px;
    background: #021897;
    border-radius: 2px;
    transition: transform .3s ease, opacity .3s ease;
}

.asb-header__burger.is-open span:nth-child(1){
    transform: translateY(7px) rotate(45deg);
}

.asb-header__burger.is-open span:nth-child(2){
    opacity: 0;
}

.asb-header__burger.is-open span:nth-child(3){
    transform: translateY(-7px) rotate(-45deg);
}

/* ===== RESPONSIVE ===== */
@media screen and (max-width: 991px){
    .asb-header__nav{
        position: fixed;
        top: 84px;
        right: 0;
        width: 300px;
        height: calc(100vh - 84px);
        background: rgba(255,255,255,.98);
        backdrop-filter: blur(16px);
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 24px;
        box-shadow: -8px 0 30px rgba(0,0,0,.1);
        transform: translateX(100%);
        transition: transform .3s ease;
        overflow-y: auto;
    }

    .asb-header__nav.is-open{
        transform: translateX(0);
    }

    .asb-header__link{
        width: 100%;
        justify-content: flex-start;
        padding: 12px 10px;
    }

    .asb-header__dropdown{
        width: 100%;
    }

    .asb-header__dropdown-menu{
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border: none;
        display: none;
        margin-top: 4px;
        padding: 0 0 0 12px;
    }

    .asb-header__dropdown.is-open .asb-header__dropdown-menu{
        display: block;
    }

    .asb-header__cta--desktop{
        display: none;
    }

    .asb-header__cta--mobile{
        display: flex;
        width: 100%;
        justify-content: center;
        margin-top: 20px;
    }

    .asb-header__burger{
        display: flex;
    }
}

.hero-video-card .hero-card-text-block.video-card .heading-style-h4{
    color:#fff !important;
}

.hero-video-card .hero-card-text-block.video-card .paragraph-p1{
    color:rgba(255,255,255,.8) !important;
}

/* Play/Pause button on video */
.play-pause-button{
    background:rgba(255,255,255,.15) !important;
    border-radius:50%;
    backdrop-filter: blur(6px);
}

.icon-24px{
    filter:brightness(0) invert(1);
}
.nav-container {
    background: #ffffff !important;
}

/* Navigation Links */
.nav-link-title,
.nav-link-description,
.nav-dropdown-toggle,
.nav-dropdown-link {
    color: #021897 !important;
}

/* Slightly lighter description */
.nav-link-description {
    opacity: 0.75;
}

/* Icons */
.nav-link-icon-block img,
.icon-24px {
    filter: brightness(0) saturate(100%) invert(14%) sepia(97%) saturate(4774%) hue-rotate(233deg) brightness(87%) contrast(113%);
}

/* Dropdown Arrow */
.dropdown-arrow,
.w-icon-dropdown-toggle {
    color: #021897 !important;
}

/* Webflow Dropdown Arrow */
.w-icon-dropdown-toggle:before {
    color: #021897 !important;
}

/* Dropdown Menu */
.nav-dropdown-list {
    background: #ffffff !important;
    border: 1px solid #e8ecff;
}

/* Dropdown Hover */
.nav-dropdown-link:hover {
    background: #eef3ff !important;
    color: #021897 !important;
}

/* Navigation Hover */
.nav-link:hover .nav-link-title,
.nav-link:hover .nav-link-description {
    color: #021897 !important;
}

/* ===========================
   BUTTON
   =========================== */

.nav-button {
    background: #021897 !important;
    border: 2px solid #021897 !important;
}

.button-primary-text-block,
.button-primary-text-block div {
    color: #ffffff !important;
}

/* White Circle */
.button-circle {
    background: #ffffff !important;
}

/* Blue Arrow */
.button-icon {
    filter: brightness(0) saturate(100%) invert(14%) sepia(97%) saturate(4774%) hue-rotate(233deg) brightness(87%) contrast(113%);
}

/* Hover */
.nav-button:hover {
    background: #ffffff !important;
    border-color: #021897 !important;
}

.nav-button:hover .button-primary-text-block,
.nav-button:hover .button-primary-text-block div {
    color: #021897 !important;
}

.nav-button:hover .button-circle {
    background: #021897 !important;
}

.nav-button:hover .button-icon {
    filter: brightness(0) invert(1);
}

/* ===========================
   MOBILE MENU
   =========================== */

.w-nav-overlay,
.w-nav-menu {
    background: #ffffff !important;
}

.menu-button {
    background: #ffffff !important;
}

/* Hamburger & Close Icon */
.nav-open-icon,
.nav-close-icon {
    filter: brightness(0) saturate(100%) invert(14%) sepia(97%) saturate(4774%) hue-rotate(233deg) brightness(87%) contrast(113%);
}
.nav-dropdown-list {
    padding-top: 8px !important;
    margin-top: 0 !important;
    top: calc(100% - 2px) !important;
}

/* Desktop only - create bridge */
@media screen and (min-width: 992px) {
    .nav-dropdown {
        position: relative;
    }
    
    /* Invisible bridge to keep dropdown open */
    .nav-dropdown::before {
        content: '';
        position: absolute;
        bottom: -10px;
        left: 0;
        right: 0;
        height: 20px;
        background: transparent;
        z-index: 1002;
    }
}
.review .review-slider .review-slide .review-card .review-card-content-block {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 10 !important;
    padding: 30px 24px 24px !important;
    background: linear-gradient(to top, 
        rgba(0, 0, 0, 0.92) 0%, 
        rgba(0, 0, 0, 0.7) 40%, 
        rgba(0, 0, 0, 0.3) 65%, 
        rgba(0, 0, 0, 0) 100%
    ) !important;
    border-radius: 0 !important;
    pointer-events: none !important;
}

/* Make text clickable through overlay */
.review .review-slider .review-slide .review-card .review-card-content-block * {
    pointer-events: auto !important;
}

/* Force text colors */
.review .review-slider .review-slide .review-card .review-card-content-block .heading-style-h4 {
    
    font-size: 18px !important;
    line-height: 1.4 !important;
    font-weight: 600 !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6) !important;
}

.review .review-slider .review-slide .review-card .review-card-content-block .reviewer-name {
    
    font-size: 15px !important;
    font-weight: 600 !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;
}

.review .review-slider .review-slide .review-card .review-card-content-block .reviewer-designation {
    
    font-size: 13px !important;
    font-weight: 400 !important;
}

/* Review info block spacing */
.review .review-slider .review-slide .review-card .review-card-content-block .review-info-block {
    margin-top: 8px !important;
}

/* Ensure image fills card */
.review .review-slider .review-slide .review-card .review-image-wrapper {
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    position: relative !important;
}

.review .review-slider .review-slide .review-card .review-card-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    animation: breathEffect 6s ease-in-out infinite !important;
}

/* Zoom effect on hover */
.review .review-slider .review-slide .review-card:hover .review-card-image {
    transform: scale(1.08) !important;
    animation-play-state: paused !important;
}

/* Breath effect */
@keyframes breathEffect {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

/* Mobile responsive */
@media screen and (max-width: 767px) {
    .review .review-slider .review-slide .review-card .review-card-image {
        animation: breathEffect 8s ease-in-out infinite !important;
    }
    @keyframes breathEffect {
        0% { transform: scale(1); }
        50% { transform: scale(1.03); }
        100% { transform: scale(1); }
    }
    .review .review-slider .review-slide .review-card .review-card-content-block {
        padding: 20px 16px 16px !important;
    }
    .review .review-slider .review-slide .review-card .review-card-content-block .heading-style-h4 {
        font-size: 16px !important;
    }
}

@media screen and (max-width: 479px) {
    .review .review-slider .review-slide .review-card .review-card-image {
        animation: breathEffect 10s ease-in-out infinite !important;
    }
    @keyframes breathEffect {
        0% { transform: scale(1); }
        50% { transform: scale(1.02); }
        100% { transform: scale(1); }
    }
    .review .review-slider .review-slide .review-card .review-card-content-block {
        padding: 14px 12px 12px !important;
    }
    .review .review-slider .review-slide .review-card .review-card-content-block .heading-style-h4 {
        font-size: 14px !important;
    }
    .review .review-slider .review-slide .review-card .review-card-content-block .reviewer-name {
        font-size: 13px !important;
    }
    .review .review-slider .review-slide .review-card .review-card-content-block .reviewer-designation {
        font-size: 11px !important;
    }
}
.partner-text {
    display: inline-block;
    font-size: 24px;
    font-weight: 600;
    
    letter-spacing: 2px;
    padding: 0 30px;
    white-space: nowrap;
    font-family: 'Geist', sans-serif;
    text-transform: uppercase;
}
.partners-marquee-inner {
    display: flex;
    align-items: center;
    animation: marquee-scroll 20s linear infinite;
}
.partners-marquee-block {
    overflow: hidden;
    display: flex;
    gap: 0;
}
@keyframes marquee-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* ===== FOOTER CSS (all new classes) ===== */

/* ----- base reset (scoped) ----- */
.asb-footer * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  .asb-footer {
    background: #F3F8F0 !important;
    padding: 56px 0 24px;
    border-top: 1px solid rgba(0, 0, 0, 0.04);
    font-family: 'Interdisplay', Arial, sans-serif;
    
    line-height: 1.5;
  }

  .asb-footer__container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
  }

  .asb-footer__wrapper {
    display: flex;
    flex-direction: column;
    gap: 32px;
  }

  /* ----- grid : 3 columns ----- */
  .asb-footer__grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr 1.2fr;
    gap: 48px 60px;
    align-items: start;
  }

  /* ----- brand column ----- */
  .asb-footer__logo-link {
    display: inline-block;
    margin-bottom: 18px;
  }

  .asb-footer__logo-img {
    max-width: 180px;
    height: auto;
  }

  .asb-footer__brand-desc {
    font-size: 16px;
    line-height: 1.7;
    font-weight: 400;
    
    max-width: 380px;
    margin-bottom: 22px;
  }

  .asb-footer__socials {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
  }

  .asb-social {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    text-decoration: none;
  }

  .asb-social svg {
    width: 20px;
    height: 20px;
    
  }

  .asb-social--linkedin { background: #0B1F3A; }
  .asb-social--youtube  { background: #FF0000; }
  .asb-social--email    { background: #1A864D; }
  .asb-social--phone    { background: #0B1F3A; }

  .asb-social:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
  }

  .asb-social--linkedin:hover { background: #C9A227; }
  .asb-social--youtube:hover  { background: #cc0000; }
  .asb-social--email:hover    { background: #0B1F3A; }
  .asb-social--phone:hover    { background: #C9A227; }

  /* ----- nav & resources ----- */
  .asb-footer__nav-title {
    font-size: 16px;
    font-weight: 700;
    
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 18px;
    position: relative;
    padding-bottom: 10px;
  }

  .asb-footer__nav-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 30px;
    height: 3px;
    background: #C9A227;
    border-radius: 2px;
  }

  .asb-footer__nav-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .asb-footer__nav-link {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    text-decoration: none;
  }

  .asb-footer__nav-link::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 4px;
    background: #C9A227;
    border-radius: 50%;
    transition: all 0.3s ease;
    opacity: 0.6;
    flex-shrink: 0;
  }

  .asb-footer__nav-link:hover {
    
    transform: translateX(6px);
  }

  .asb-footer__nav-link:hover::before {
    opacity: 1;
    width: 8px;
  }

  .asb-footer__nav-link--highlight {
    
    font-weight: 700;
  }

  .asb-footer__nav-link--highlight::before {
    background: #0B77A0;
    opacity: 0.6;
  }

  .asb-footer__nav-link--highlight:hover {
    
  }

  /* ----- contact column ----- */
  .asb-footer__direct {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
  }

  .asb-footer__direct-link {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 500;
    
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  }

  .asb-footer__direct-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
  }

  .asb-footer__direct-icon svg {
    width: 18px;
    height: 18px;
  }

  .asb-footer__direct-link:hover {
    
    transform: translateX(4px);
  }

  .asb-footer__direct-link:hover .asb-footer__direct-icon svg {
    
  }

  .asb-footer__branches {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-top: 12px;
   
  }

  .asb-footer__branch {
    padding: 6px 0 6px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  }

  .asb-footer__branch--last {
    border-bottom: none;
  }

  .asb-footer__branch-name {
    display: block;
    font-size: 13px;
    font-weight: 700;
    
    margin-bottom: 2px;
  }

  .asb-footer__branch-addr {
    font-size: 13px;
    font-weight: 400;
    
    line-height: 1.6;
  }

  /* ----- branch map thumbnail ----- */
  .asb-footer__branch-map-thumb {
    position: relative;
    display: block;
    width: 100%;
    height: 120px;
    margin-top: 10px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
  }

  .asb-footer__branch-map-thumb:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.14);
  }

  .asb-footer__branch-map-thumb iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    pointer-events: none;
  }

  .asb-footer__branch-map-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: rgba(11, 37, 69, 0);
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.2px;
    opacity: 0;
    transition: opacity 0.2s ease, background 0.2s ease;
  }

  .asb-footer__branch-map-thumb:hover .asb-footer__branch-map-overlay {
    opacity: 1;
    background: rgba(11, 37, 69, 0.45);
  }

  /* ----- divider ----- */
  .asb-footer__divider {
    border: none;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    margin: 8px 0 0;
  }

  /* ----- bottom row ----- */
  .asb-footer__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 20px;
    padding-top: 8px;
  }

  .asb-footer__copy {
    font-size: 16px;
    font-weight: 500;
    
  }

  .asb-footer__copy strong {
    
    font-weight: 700;
  }

  .asb-footer__legal {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    font-size: 16px;
  }

  .asb-footer__legal-link {
    font-weight: 500;
    
    text-decoration: none;
    transition: color 0.3s ease;
  }

  .asb-footer__legal-link:hover {
    
  }

  .asb-footer__legal-sep {
    
    font-weight: 300;
  }

  .asb-footer__credit {
    font-weight: 500;
    
  }

  .asb-footer__credit-link {
    
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
  }

  .asb-footer__credit-link:hover {
    
    text-decoration: underline;
  }

/* ============================================================
   RESPONSIVE
   ============================================================ */
  @media screen and (max-width: 992px) {
    .asb-footer__grid {
      grid-template-columns: 1fr 1fr;
      gap: 40px;
    }
    .asb-footer__brand {
      grid-column: 1 / -1;
    }
    .asb-footer__brand-desc {
      max-width: 100%;
    }
  }

  @media screen and (max-width: 640px) {
    .asb-footer {
      padding: 40px 0 20px;
    }
    .asb-footer__grid {
      grid-template-columns: 1fr;
      gap: 32px;
    }
    .asb-footer__bottom {
      flex-direction: column;
      align-items: flex-start;
      gap: 8px;
    }
    .asb-footer__legal {
      font-size: 14px;
      gap: 8px;
    }
    .asb-footer__legal-sep {
      display: inline;
    }
    .asb-footer__logo-img {
      max-width: 150px;
    }
    .asb-social {
      width: 38px;
      height: 38px;
    }
    .asb-social svg {
      width: 18px;
      height: 18px;
    }
    .asb-footer__nav-title {
      font-size: 14px;
    }
    .asb-footer__brand-desc {
      font-size: 16px;
    }
    .asb-footer__direct-link {
      font-size: 14px;
    }
  }

  @media screen and (max-width: 400px) {
    .asb-footer__container {
      padding: 0 16px;
    }
    .asb-footer__legal {
      flex-direction: column;
      align-items: flex-start;
      gap: 4px;
    }
    .asb-footer__legal-sep {
      display: none;
    }
    .asb-footer__branch-addr {
      font-size: 12px;
    }
    .asb-footer__branch-name {
      font-size: 12px;
    }
  }

/* ===== REVIEW IMAGE ZOOM/BREATH EFFECT ===== */

.review-image-wrapper {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.review-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    animation: breathEffect 6s ease-in-out infinite;
}

/* Zoom effect on hover */
.review-card:hover .review-card-image {
    transform: scale(1.08);
    animation-play-state: paused;
}

/* Breath effect - gentle zoom in and out */
@keyframes breathEffect {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}

/* Ensure the review card content stays on top */
.review-card-content-block {
    z-index: 2;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: var(--_spacing---padding--padding-xl) var(--_spacing---padding--padding-xl) var(--_spacing---padding--padding-2xl);
    grid-row-gap: var(--_spacing---gap--spacing-3xl);
    
    flex-flow: column;
    display: flex;
    background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0) 100%);
}

/* Responsive adjustments */
@media screen and (max-width: 767px) {
    .review-card-image {
        animation: breathEffect 8s ease-in-out infinite;
    }
    
    @keyframes breathEffect {
        0% { transform: scale(1); }
        50% { transform: scale(1.03); }
        100% { transform: scale(1); }
    }
}

@media screen and (max-width: 479px) {
    .review-card-image {
        animation: breathEffect 10s ease-in-out infinite;
    }
    
    @keyframes breathEffect {
        0% { transform: scale(1); }
        50% { transform: scale(1.02); }
        100% { transform: scale(1); }
    }
}

/* ===== REVIEW SECTION - SMALLER PARAGRAPH FONT ===== */

/* Section description paragraph */
.review .section-description-block .paragraph-p1 {
    font-size: 15px !important;
    line-height: 1.6 !important;
}

/* Testimonial quote text inside review cards */
.review-card-content-block .heading-style-h4 {
    font-size: 18px !important;
    line-height: 1.4 !important;
}

/* Reviewer name */
.review-card-content-block .reviewer-name {
    font-size: 15px !important;
    line-height: 1.4 !important;
}

/* Reviewer designation */
.review-card-content-block .reviewer-designation {
    font-size: 13px !important;
    line-height: 1.4 !important;
}

/* "Watch Story" button text */
.review .paragraph-p3 {
    font-size: 12px !important;
    line-height: 1.4 !important;
}

/* Responsive adjustments */
@media screen and (max-width: 767px) {
    .review .section-description-block .paragraph-p1 {
        font-size: 14px !important;
    }
    
    .review-card-content-block .heading-style-h4 {
        font-size: 16px !important;
    }
    
    .review-card-content-block .reviewer-name {
        font-size: 14px !important;
    }
    
    .review-card-content-block .reviewer-designation {
        font-size: 12px !important;
    }
}

@media screen and (max-width: 479px) {
    .review .section-description-block .paragraph-p1 {
        font-size: 13px !important;
    }
    
    .review-card-content-block .heading-style-h4 {
        font-size: 14px !important;
    }
    
    .review-card-content-block .reviewer-name {
        font-size: 13px !important;
    }
    
    .review-card-content-block .reviewer-designation {
        font-size: 11px !important;
    }
}

/* ===== BLOG CARD ARROW ===== */

.blog-card {
    position: relative;
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    display: block;
}

.blog-card-description-block {
    position: relative;
    padding: 20px 24px 24px;
   
}

.blog-card-arrow {
    position: absolute;
    bottom: 20px;
    right: 20px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #0B1F3A;
    
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    opacity: 0;
    transform: translateX(-10px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.blog-card-arrow svg {
    width: 18px;
    height: 18px;
    
    stroke-width: 2.5;
}

/* Show arrow on hover */
.blog-card:hover .blog-card-arrow {
    opacity: 1;
    transform: translateX(0);
}

/* Arrow hover effect */
.blog-card:hover .blog-card-arrow {
    background: #C9A227;
    box-shadow: 0 4px 20px rgba(201, 162, 39, 0.4);
}

/* Animated arrow on hover */
.blog-card:hover .blog-card-arrow svg {
    animation: arrowBounce 0.6s ease;
}

/* Card hover effect */
.blog-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
}

@keyframes arrowBounce {
    0% { transform: translateX(0); }
    50% { transform: translateX(5px); }
    100% { transform: translateX(0); }
}

/* ===== NEWSLETTER SECTION — full-width row layout ===== */

.asb-footer__newsletter {
    background: linear-gradient(135deg, #021268 0%, #0b2545 60%, #134074 100%);
    border-radius: 20px;
    padding: 40px 44px;
    margin: 0 auto 10px;
    text-align: left;
    box-shadow: 0 10px 30px rgba(11, 37, 69, 0.18);
}

.asb-footer__newsletter-inner {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

.asb-footer__newsletter-left {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    flex: 1;
    min-width: 0;
}

.asb-footer__newsletter-title {
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 12px 0;
    line-height: 1.3;
}

.asb-footer__newsletter-features {
    display: flex;
    justify-content: flex-start;
    gap: 24px;
    flex-wrap: wrap;
}

.asb-footer__newsletter-feature {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 400;
}

.asb-footer__newsletter-feature svg {
    flex-shrink: 0;
}

.asb-footer__newsletter-form {
    width: 100%;
    max-width: 420px;
    flex-shrink: 0;
}

.asb-footer__newsletter-form-inner {
    display: flex;
    gap: 8px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 60px;
    padding: 6px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    width: 100%;
}

.asb-footer__newsletter-input {
    flex: 1;
    min-width: 0;
    background: transparent;
    border: none;
    padding: 10px 18px;
    font-size: 14px;
    outline: none;
}

.asb-footer__newsletter-btn {
    background: #ffffff !important;
    color: #021268 !important;
    border: none;
    padding: 10px 26px;
    border-radius: 40px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.asb-footer__newsletter-btn:hover {
    background: #f0f4ff !important;
    color: #021268 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}

/* Newsletter responsive */
@media screen and (max-width: 768px) {
    .asb-footer__newsletter {
        padding: 28px 20px;
        border-radius: 16px;
    }
    .asb-footer__newsletter-inner {
        flex-direction: column;
        align-items: stretch;
        gap: 18px;
    }
    .asb-footer__newsletter-left {
        align-items: flex-start;
        text-align: left;
    }
    .asb-footer__newsletter-form {
        max-width: 100%;
    }
}

@media screen and (max-width: 480px) {
    .asb-footer__newsletter {
        padding: 22px 16px;
        border-radius: 14px;
    }
    .asb-footer__newsletter-title {
        font-size: 17px;
    }
    .asb-footer__newsletter-features {
        flex-direction: column;
        gap: 8px;
    }
    .asb-footer__newsletter-feature {
        font-size: 13px;
    }
    .asb-footer__newsletter-form-inner {
        flex-direction: column;
        background: transparent;
        padding: 0;
        border: none;
        gap: 10px;
    }
    .asb-footer__newsletter-input {
        background: rgba(255, 255, 255, 0.08);
        border-radius: 40px;
        padding: 12px 18px;
        border: 1px solid rgba(255, 255, 255, 0.15);
        width: 100%;
    }
    .asb-footer__newsletter-btn {
        width: 100%;
        padding: 12px 18px;
    }
}

/* ============================================================
   MAKE ALL CTA BUTTONS SMALLER ON MOBILE
   ============================================================ */
@media screen and (max-width: 767px) {
  /* Primary buttons */
  .button-primary,
  .nav-button,
  .asb-footer__newsletter-btn,
  .admission-btn,
  .course-cta-button-block .button-primary,
  .upsell-cta-block .button-primary,
  .hero-cta-block .button-primary,
  .about-cta-block .button-primary,
  .cta .button-primary,
  .hero .button-primary {
    padding: 6px 14px !important;
    font-size: 12px !important;
    min-height: 36px !important;
    height: auto !important;
    line-height: 1.4 !important;
  }

  /* Button circle icon - make smaller */
  .button-primary .button-circle,
  .nav-button .button-circle {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
  }

  .button-primary .button-circle .button-icon-wrapper img,
  .nav-button .button-circle .button-icon-wrapper img {
    width: 14px !important;
    height: 14px !important;
  }

  /* Button text */
  .button-primary .button-primary-text-block,
  .nav-button .button-primary-text-block {
    font-size: 12px !important;
  }

  /* Hero CTA specific */
  .hero-cta-block .button-primary {
    padding: 6px 16px !important;
    font-size: 12px !important;
  }

  /* About section CTA */
  .about-cta-block .button-primary {
    padding: 6px 16px !important;
    font-size: 12px !important;
  }

  /* Newsletter button */
  .asb-footer__newsletter-btn {
    padding: 6px 16px !important;
    font-size: 12px !important;
    min-height: 36px !important;
  }

  /* Admission button */
  .admission-btn {
    padding: 6px 20px !important;
    font-size: 12px !important;
    min-height: 36px !important;
  }

  /* Enquire Now nav button on mobile */
  .nav-button {
    padding: 6px 14px !important;
    font-size: 12px !important;
    min-height: 36px !important;
  }

  /* Course CTA button */
  .course-cta-button-block .button-primary {
    padding: 6px 16px !important;
    font-size: 12px !important;
  }

  /* Upsell CTA */
  .upsell-cta-block .button-primary {
    padding: 6px 16px !important;
    font-size: 12px !important;
  }

  /* CTA section button */
  .cta .button-primary {
    padding: 6px 16px !important;
    font-size: 12px !important;
  }
}
/* ============================================================
   REDUCE CTA BUTTON WIDTH ON MOBILE
   ============================================================ */
@media screen and (max-width: 767px) {
  /* Reduce width of all CTA buttons */
  .button-primary,
  .nav-button,
  .asb-footer__newsletter-btn,
  .admission-btn,
  .course-cta-button-block .button-primary,
  .upsell-cta-block .button-primary,
  .hero-cta-block .button-primary,
  .about-cta-block .button-primary,
  .cta .button-primary,
  .hero .button-primary {
    width: auto !important;
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Make buttons inline-block to respect content width */
  .button-primary,
  .nav-button,
  .admission-btn {
    display: inline-flex !important;
    width: auto !important;
  }

  /* Hero CTA button - reduce width */
  .hero-cta-block .button-primary {
    padding: 6px 16px !important;
  }

  /* About section CTA */
  .about-cta-block .button-primary {
    padding: 6px 16px !important;
  }

  /* Course CTA button */
  .course-cta-button-block .button-primary {
    padding: 6px 16px !important;
  }

  /* Upsell CTA */
  .upsell-cta-block .button-primary {
    padding: 6px 16px !important;
  }

  /* CTA section button */
  .cta .button-primary {
    padding: 6px 16px !important;
  }

  /* Hero section button */
  .hero .button-primary {
    padding: 6px 16px !important;
  }

  /* Center the button containers */
  .hero-cta-block,
  .about-cta-block,
  .course-cta-button-block,
  .upsell-cta-block,
  .cta-top-block .upsell-cta-block {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
  }

  /* Ensure buttons don't stretch full width */
  .hero-cta-block .button-primary,
  .about-cta-block .button-primary,
  .course-cta-button-block .button-primary,
  .upsell-cta-block .button-primary,
  .cta-top-block .upsell-cta-block .button-primary {
    flex: 0 1 auto !important;
    width: auto !important;
    min-width: 120px !important;
    max-width: 280px !important;
  }

  /* Enquire Now button in nav */
  .nav-buttons-wrapper .nav-button {
    padding: 0 4px 0 16px !important;
  }

  /* Newsletter button */
  .asb-footer__newsletter-btn {
    padding: 6px 16px !important;
  }
}

/* Extra small devices - even tighter */
@media screen and (max-width: 479px) {
  .button-primary,
  .nav-button,
  .asb-footer__newsletter-btn,
  .admission-btn,
  .course-cta-button-block .button-primary,
  .upsell-cta-block .button-primary,
  .hero-cta-block .button-primary,
  .about-cta-block .button-primary,
  .cta .button-primary,
  .hero .button-primary {
    padding: 4px 12px !important;
    font-size: 11px !important;
    min-height: 32px !important;
    min-width: 80px !important;
    max-width: 200px !important;
  }

  /* Circle icon even smaller */
  .button-primary .button-circle,
  .nav-button .button-circle {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
  }

  .button-primary .button-circle .button-icon-wrapper img,
  .nav-button .button-circle .button-icon-wrapper img {
    width: 10px !important;
    height: 10px !important;
  }

  /* Hero CTA - tighter */
  .hero-cta-block .button-primary {
    padding: 4px 12px !important;
    min-width: 80px !important;
    max-width: 180px !important;
  }
}/* ===== PARTNER TEXT - 2 LINES ON MOBILE ===== */
@media screen and (max-width: 767px) {
    .partners-title-block {
        padding: 0 16px;
    }
    
    .partners-title-block div {
        font-size: 18px !important;
        line-height: 1.4 !important;
        max-width: 320px;
        margin: 0 auto;
        word-wrap: break-word;
        display: block;
        text-align: center;
    }
}

@media screen and (max-width: 480px) {
    .partners-title-block div {
        font-size: 16px !important;
        line-height: 1.4 !important;
        max-width: 260px;
        padding: 0 8px;
    }
}
/* Extra small devices */
@media screen and (max-width: 479px) {
 

  .button-primary .button-circle,
  .nav-button .button-circle {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
  }

  .button-primary .button-circle .button-icon-wrapper img,
  .nav-button .button-circle .button-icon-wrapper img {
    width: 12px !important;
    height: 12px !important;
  }

  .button-primary .button-primary-text-block,
  .nav-button .button-primary-text-block {
    font-size: 11px !important;
  }

  .asb-footer__newsletter-btn {
    padding: 4px 12px !important;
    font-size: 11px !important;
    min-height: 32px !important;
  }

  .admission-btn {
    padding: 4px 14px !important;
    font-size: 11px !important;
    min-height: 32px !important;
  }
}

/* ============================================================
   STYLES FOR HERO - NAVY BLUE & GOLDEN YELLOW HEADINGS
   ============================================================ */
.hero-title-block h1 {
    
    font-weight: 700;
}

.hero-title-block .heading-style-h1 {
    
    font-weight: 800;
}

/* ============================================================
   WHY SECTION - CARD COLORS & HOVER
   ============================================================ */

/* ===== CARD TITLES - Golden ===== */
.why-card-title-block .heading-style-h4 {
    
}

/* ===== CARD HOVER - Green Background on hover ===== */
.why-card:hover {
    
    transition: background-color 0.3s ease;
}

/* ===== CARD TITLE - White on hover ===== */
.why-card:hover .heading-style-h4 {
    
}

/* ===== CARD DESCRIPTION - White on hover ===== */
.why-card:hover .why-card-description-block div {
    
}

/* ===== CARD ICON - White background on hover ===== */
.why-card:hover .why-card-icon-block {
    
    
}

/* ===== CARD ICON - Dark icon on hover ===== */
.why-card:hover .why-card-icon {
    display: block !important;
    filter: brightness(0) invert(0) !important;
}

.why-card:hover .why-card-hover-icon {
    display: none !important;
}

/* ===== WHY SECTION - INCREASE PARAGRAPH WIDTH ===== */
/* Increase paragraph width */
.why-top-block .section-description-block {
    max-width: 750px;
    /* Increased from 562px */
    width: 100%;
}

.why-top-block .section-description-block .paragraph-p1 {
    font-size: 16px;
    line-height: 1.6;
}

/* ===== WHY SECTION - CARD SIZES TO MATCH IMAGE ===== */

.why-cards-block {
    display: flex;
    gap: var(--_spacing---gap--spacing-xl, 24px);
    align-items: stretch;
}

.why-card-side-column {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: var(--_spacing---gap--spacing-xl, 24px);
}

.why-card-center-column {
    flex: 0 0 33.333%;
    max-width: 33.333%;
    border-radius: 24px;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    height: 420px;
}

.why-center-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.why-card {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 20px 20px;
    border-radius: 16px;
    
    gap: 12px;
    min-height: 0;
}

.why-card-bottom-block {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.why-card-description-block {
    
    font-size: 16px;
    line-height: 1.5;
}

.why-card-title-block .heading-style-h4 {
    font-size: 20px;
    line-height: 1.3;
    font-weight: var(--_typography---font-weight--font-weight-600);
}

.why-card-icon-block {
    border: 1px solid var(--bg-color--bg-color-01);
    
    border-radius: 60px;
    justify-content: center;
    align-items: center;
    width: 44px;
    height: 44px;
    display: flex;
    flex-shrink: 0;
}

.why-card-icon {
    width: 22px;
    height: 22px;
}

/* ===== RESPONSIVE ===== */
@media screen and (max-width: 991px) {
    .why-cards-block {
        flex-direction: column;
    }

    .why-card-center-column {
        flex: 0 0 auto;
        max-width: 100%;
        height: 350px;
        min-height: 300px;
    }

    .why-card-side-column {
        flex: 1;
        gap: var(--_spacing---gap--spacing-xl, 24px);
    }

    .why-card {
        padding: 24px;
        gap: 16px;
    }

    .why-card-description-block {
        font-size: 16px;
    }

    .why-card-title-block .heading-style-h4 {
        font-size: 22px;
    }

    .why-top-block .section-description-block {
        max-width: 100%;
    }
}

@media screen and (max-width: 767px) {
    .why-card-center-column {
        height: 250px;
        min-height: 200px;
    }

    .why-card {
        padding: 16px;
        gap: 12px;
    }

    .why-card-description-block {
        font-size: 16px;
    }

    .why-card-title-block .heading-style-h4 {
        font-size: 16px;
    }

    .why-top-block .section-description-block .paragraph-p1 {
        font-size: 16px;
    }
}

/* ============================================================
   ADDRESS LINK STYLING
   ============================================================ */
/* Address link styling */
.asb-footer__direct-link--address {
  cursor: default;
  pointer-events: none;
}

.asb-footer__direct-link--address:hover {
  transform: none !important;
  
}

.asb-footer__direct-address {
  font-size: 16px;
  font-weight: 500;
  
}

.asb-footer__direct-address strong {
  
  font-weight: 700;
}

/* ============================================================
   STATS SECTION - OVERLAY & CARDS
   ============================================================ */
.stats-section {
    position: relative;
    width: 100%;
    padding: 80px 0;
    background-image: url('https://images.unsplash.com/photo-1524995997946-a1c2e315a42f?q=80&w=2070&auto=format&fit=crop');
    background-size: cover;
    background-attachment: fixed;
    background-position: center;
}

.stats-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(11, 119, 160, 0.85); /* Your blue with high opacity */
}

.stats-wrapper {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.stat-card {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    padding: 30px 15px;
    text-align: center;
    
}

.stat-icon { font-size: 30px; margin-bottom: 10px; }

.stat-number {
    font-size: 36px;
    font-weight: 800;
    margin-top: 10px;
}

.stat-label {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 5px;
    opacity: 0.9;
}

/* Responsive adjustment */
@media (max-width: 991px) {
    .stats-wrapper { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
    .stats-wrapper { grid-template-columns: 1fr; }
}

/* ============================================================
   CLASSES, BOARDS & SPECIAL CATEGORIES - COMPACT CARDS
   ============================================================ */

.categories-section {
    position: relative;
    padding: 0;
    background-image: url('https://images.unsplash.com/photo-1524995997946-a1c2e315a42f?q=80&w=2070&auto=format&fit=crop');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    min-height: 320px;
}

.categories-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(11, 31, 58, 0.82);
    pointer-events: none;
}

.categories-section .container {
    position: relative;
    z-index: 2;
}

/* ===== HEADER ===== */
.categories-header {
    text-align: center;
    margin-bottom: 24px;
}

.categories-header h2 {
    font-size: 32px;
    font-weight: 700;
    
    margin: 0 0 4px 0;
    letter-spacing: -0.5px;
}

.categories-header h2 span {
    
    position: relative;
}

.categories-header h2 span::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 0;
    right: 0;
    height: 3px;
    background: rgba(201, 162, 39, 0.25);
    border-radius: 4px;
}

.categories-header p {
    font-size: 16px;
    
    margin: 0;
    letter-spacing: 0.3px;
}

/* ===== GRID ===== */
.categories-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    max-width: 900px;
    margin: 0 auto;
}

/* ===== CARD ===== */
.category-card {
    background: rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 14px;
    padding: 18px 18px 16px;
    transition: all 0.4s ease;
}

.category-card:hover {
    transform: translateY(-4px);
    background: rgba(255, 255, 255, 0.10);
    
}

/* Card top border colors */
.card-cyan { border-top: 3px solid #0B77A0; }
.card-gold { border-top: 3px solid #C9A227; }
.card-purple { border-top: 3px solid #6B4C9A; }

/* ===== CARD TOP ===== */
.card-top-small {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.card-icon {
    font-size: 16px;
}

.card-top-small h4 {
    font-size: 16px;
    font-weight: 700;
    
    margin: 0;
    letter-spacing: 0.5px;
}

/* ===== CARD LIST ===== */
.category-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.category-card ul li {
    font-size: 13px;
    font-weight: 400;
    
    padding: 5px 0 5px 16px;
    position: relative;
    transition: all 0.3s ease;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.category-card ul li:last-child {
    border-bottom: none;
}

.category-card ul li::before {
    content: '◆';
    position: absolute;
    left: 0;
    
    font-size: 8px;
    top: 50%;
    transform: translateY(-50%);
}

.category-card:hover ul li {
    
}

.category-card:hover ul li::before {
    
}

/* ===== ADMISSION BUTTON ===== */
.admission-btn {
    display: inline-block;
    padding: 10px 28px;
    border-radius: 40px;
    
    text-decoration: none;
    border: 1px solid rgba(233, 200, 127, 0.25);
    box-shadow: 0 0 12px rgba(233, 200, 127, 0.12);
    font-weight: 600;
    font-size: 12px;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
    background: rgba(233, 200, 127, 0.04);
}

.admission-btn:hover {
    background: rgba(233, 200, 127, 0.10);
    
    box-shadow: 0 0 25px rgba(233, 200, 127, 0.20);
    transform: translateY(-2px);
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media screen and (max-width: 768px) {
    .categories-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
        max-width: 500px;
    }

    .categories-header h2 {
        font-size: 26px;
    }

    .categories-header p {
        font-size: 14px;
    }

    .category-card {
        padding: 14px 14px 12px;
        border-radius: 12px;
    }

    .card-top-small h4 {
        font-size: 14px;
    }

    .card-icon {
        font-size: 16px;
    }

    .category-card ul li {
        font-size: 12px;
        padding: 4px 0 4px 14px;
    }

    .categories-section {
        background-attachment: scroll;
        min-height: auto;
    }
}

@media screen and (max-width: 480px) {
    .categories-grid {
        grid-template-columns: 1fr;
        gap: 10px;
        max-width: 320px;
    }

    .categories-header h2 {
        font-size: 22px;
    }

    .categories-header p {
        font-size: 13px;
    }

    .category-card {
        padding: 12px 12px 10px;
        border-radius: 10px;
    }

    .card-top-small {
        gap: 6px;
    }

    .card-top-small h4 {
        font-size: 13px;
    }

    .card-icon {
        font-size: 14px;
    }

    .category-card ul li {
        font-size: 11px;
        padding: 3px 0 3px 12px;
    }

    .categories-header {
        margin-bottom: 16px;
    }
}

/* ============================================================
   COURSE CTA BUTTON - CENTERED
   ============================================================ */
.course-cta-button-block {
    text-align: center;
    margin-top: 48px;
}

/* Mobile adjustments */
@media screen and (max-width: 767px) {
    .course-cta-button-block {
        margin-top: 32px;
    }
}

@media screen and (max-width: 479px) {
    .course-cta-button-block {
        margin-top: 24px;
    }
}

/* ============================================================
   PROGRAMS SECTION - UNIFIED BACKGROUND
   ============================================================ */
.hero,
.partners,
.about-preview,
.why,
.model-deck-container,
.review,
.blog,
.cta,
.faq,
.asb-footer,
.programs-professional {
    
}

/* Also remove any background image from programs section if present */
.programs-professional {
    background-image: none !important;
}

/* Make sure program cards stay white for contrast */
.program-card {
    
}

/* ============================================================
   UTILITY - HIDE WEBFLOW BADGE
   ============================================================ */
.w-webflow-badge {
    display: none !important;
}

/* Alternative if the above doesn't work */
body > .w-webflow-badge,
body .w-webflow-badge {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    z-index: -9999 !important;
}

/* ============================================================
   NAVBAR - RESPONSIVE & STYLING
   ============================================================ */

/* ===== HIDE CART ===== */
.nav-cart-block,
.cart-button {
    display: none !important;
}

/* ===== BASE NAVBAR ===== */
.navbar {
    padding-top: 20px;
    padding-bottom: 20px;
    
    position: fixed;
    inset: 0% 0% auto;
    z-index: 1000;
}

.nav-container {
    padding: 2px 16px;
    border: 1px solid #e7e6e6;
    
    border-radius: 80px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1250px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.06);
}

/* ===== LOGO ===== */
.nav-brand {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 0;
    min-width: 167px;
    height: auto;
}

.nav-brand-icon {
    width: 167px;
    height: 68px;
    object-fit: contain;
}

/* ===== NAV MENU ===== */
.nav-menu-block {
    flex: 1;
    min-width: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.nav-menu-inner-block {
    width: auto;
    display: flex;
    align-items: center;
}

.nav-links-wrapper {
    display: flex !important;
    align-items: center;
    flex-wrap: nowrap;
}

/* ===== NAV LINKS ===== */
.nav-link {
    padding: 6px 8px !important;
    font-family: "Geist", sans-serif;
    
    font-size: 13px;
    line-height: 1.42em;
    font-weight: 500;
    text-transform: uppercase;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    letter-spacing: 0.3px;
    background: none;
    border: none;
    cursor: pointer;
}

.nav-link:hover .nav-link-title {
    
}

.nav-link-title {
    transition: color 0.2s ease;
    font-size: 13px;
    font-weight: 500;
    text-transform: uppercase;
}

.nav-link-description,
.nav-link-icon-block {
    display: none !important;
}

.nav-text-block {
    height: auto !important;
    overflow: visible !important;
    display: flex;
    align-items: center;
}

.nav-link-title-wrapper {
    height: auto !important;
    overflow: visible !important;
    display: flex;
    align-items: center;
}

/* Hide duplicate text */
.nav-link-title-wrapper .nav-link-title:last-child {
    display: none !important;
}

/* ===== DROPDOWN ===== */
.nav-dropdown {
    position: relative;
    display: flex;
    align-items: center;
}

.nav-dropdown-toggle {
    padding: 6px 8px !important;
    padding-right: 20px !important;
    font-family: "Geist", sans-serif;
    
    font-size: 13px;
    line-height: 1.42em;
    font-weight: 500;
    text-transform: uppercase;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 4px;
    background: none;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    letter-spacing: 0.3px;
    position: relative;
}

.nav-dropdown-toggle .w-icon-dropdown-toggle {
    font-size: 9px;
    
    transition: transform 0.3s ease;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    right: auto;
    top: auto;
    margin-left: 2px;
    width: 12px;
    height: 12px;
}

.nav-dropdown-toggle.w--open .w-icon-dropdown-toggle {
    transform: rotate(180deg);
}

.nav-dropdown-list {
    background: #ffffff !important;
    border-radius: 12px;
    min-width: 220px;
    padding: 10px !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
    border: 1px solid #e7e6e6;
    display: none;
    position: absolute;
    top: calc(100% + 5px);
    left: 0;
    z-index: 1000;
    margin-top: 0 !important;
}

.nav-dropdown-list.w--open {
    display: block !important;
}

.nav-dropdown-link {
    padding: 10px 16px !important;
    font-family: "Interdisplay", Arial, sans-serif;
    
    font-size: 14px !important;
    line-height: 1.5em;
    font-weight: 400 !important;
    text-transform: none;
    border-radius: 8px;
    transition: background-color 0.2s ease, color 0.2s ease;
    text-decoration: none;
    display: block;
    background: #ffffff !important;
}

.nav-dropdown-link:hover {
    
    
}

.nav-dropdown-link.w--current {
    
    font-weight: 600;
}

/* ===== RIGHT BUTTONS ===== */
.nav-buttons-block {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    width: auto !important;
}

.nav-buttons-wrapper {
    display: flex !important;
    align-items: center;
    gap: 6px;
}

.nav-buttons-wrapper .nav-link {
    padding: 6px 6px !important;
}

.nav-buttons-wrapper .nav-link .nav-link-title {
    font-size: 13px;
}

.nav-buttons-wrapper .nav-button {
    padding: 0 4px 0 16px;
    border: 2px solid #0B77A0;
    
    border-radius: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    height: 38px;
    gap: 10px;
    text-decoration: none;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.nav-buttons-wrapper .nav-button .button-primary-text-block {
    font-family: "Geist", sans-serif;
    
    font-size: 13px;
    line-height: 1.42em;
    font-weight: 500;
    text-transform: uppercase;
    z-index: 2;
    position: relative;
}

.nav-buttons-wrapper .nav-button .button-bg-block {
    z-index: 0;
    
    border-radius: 50px;
    width: 0%;
    height: 100%;
    position: absolute;
    inset: 0% 0% 0% auto;
    transition: width 0.3s ease;
}

.nav-buttons-wrapper .nav-button:hover .button-primary-text-block {
    
}

.nav-buttons-wrapper .nav-button:hover .button-bg-block {
    width: 100%;
}

.nav-buttons-wrapper .nav-button .button-circle {
    
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    z-index: 2;
    position: relative;
    flex-shrink: 0;
    transition: background-color 0.3s ease;
}

.nav-buttons-wrapper .nav-button:hover .button-circle {
    
}

.nav-buttons-wrapper .nav-button .button-icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 18px;
    height: 18px;
    overflow: hidden;
    gap: 2px;
}

.nav-buttons-wrapper .nav-button .button-icon {
    flex: none;
    width: 14px;
    height: 14px;
  
    transition: filter 0.3s ease;
}

/* Default Button */
.nav-buttons-wrapper .nav-button .button-icon-wrapper .button-icon{
    filter: brightness(0) saturate(100%) invert(14%) sepia(97%) saturate(4774%)
            hue-rotate(233deg) brightness(87%) contrast(113%) !important;
}

/* Hover Button */
.nav-buttons-wrapper .nav-button:hover .button-icon-wrapper .button-icon{
    filter: brightness(0) invert(1) !important;
}

/* ===== MENU BUTTON (Mobile) ===== */
.menu-button {
    display: none !important;
    height: 30px;
    padding: 0;
    background: none !important;
    border: none;
    cursor: pointer;
}

.menu-button.w--open {
    background: none !important;
}

.nav-open-icon,
.nav-close-icon {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.w-nav-button.w--open .nav-open-icon {
    display: none !important;
}

.w-nav-button.w--open .nav-close-icon {
    display: block !important;
}

.nav-link-button-for-mobile {
    display: none !important;
}

/* ============================================================
   DESKTOP SPECIFIC - EQUAL SPACING
   ============================================================ */
@media screen and (min-width: 992px) {
    .nav-links-wrapper {
        display: flex !important;
        align-items: center;
        gap: 16px !important;
        flex-wrap: nowrap;
    }

    .nav-link,
    .nav-dropdown-toggle {
        padding: 6px 8px !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center;
        gap: 4px;
        white-space: nowrap;
    }

    .nav-dropdown-toggle .w-icon-dropdown-toggle {
        width: 10px !important;
        margin-left: 2px !important;
    }

    .nav-dropdown-list {
        min-width: 220px;
        padding: 10px !important;
        top: calc(100% + 5px);
    }
}

/* ============================================================
   RESPONSIVE - TABLET & MOBILE
   ============================================================ */
@media screen and (max-width: 991px) {
    .navbar {
        padding-top: 0;
        padding-bottom: 0;
        
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    }

    .nav-container {
        max-width: 100% !important;
        padding: 8px 16px !important;
        border: none;
        border-radius: 0;
        box-shadow: none;
        justify-content: space-between;
        background: #ffffff;
    }

    .nav-brand {
        min-width: auto;
        height: auto;
        flex: none;
    }

    .nav-brand-icon {
        width: 140px !important;
        height: 56px !important;
    }

    .nav-menu-block {
        flex: none;
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: #ffffff;
        padding: 20px;
        border-radius: 0;
        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1);
        max-height: calc(100vh - 70px);
        overflow-y: auto;
    }

    .nav-menu-block.w-nav-menu {
        display: none;
    }

    .nav-menu-block.w-nav-menu[style*="display: block"] {
        display: flex !important;
    }

    .nav-menu-inner-block {
        width: 100%;
    }

    .nav-links-wrapper {
        flex-direction: column;
        align-items: stretch;
        gap: 4px !important;
        width: 100%;
    }

    .nav-link {
        padding: 10px 12px !important;
        font-size: 14px;
        width: 100%;
        white-space: normal;
        justify-content: flex-start;
        border-radius: 8px;
        transition: background-color 0.2s ease;
        margin: 0 !important;
    }

    .nav-link:hover {
        
    }

    .nav-link .nav-link-icon-block {
        display: flex !important;
        width: 40px;
        height: 40px;
        padding: 10px;
        border: 1px solid #e7e6e6;
        
        border-radius: 8px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
    }

    .nav-link .nav-link-icon-block img {
        width: 20px;
        height: 20px;
    }

    .nav-link .nav-text-block {
        display: flex !important;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        flex: 1;
        gap: 2px;
        height: auto !important;
        overflow: visible !important;
    }

    .nav-link .nav-link-description {
        display: block !important;
        font-family: "Interdisplay", Arial, sans-serif;
        
        font-size: 13px;
        font-weight: 400;
        text-transform: none;
        line-height: 1.4em;
    }

    .nav-link .nav-link-title-wrapper {
        height: auto !important;
        overflow: visible !important;
    }

    .nav-link .nav-link-title {
        font-size: 14px;
    }

    /* Mobile Dropdown - Full width, indented */
    .nav-dropdown {
        width: 100%;
        position: relative;
        flex-direction: column;
        align-items: stretch;
        margin: 0 !important;
    }

    .nav-dropdown-toggle {
        padding: 10px 12px !important;
        padding-right: 40px !important;
        font-size: 14px;
        width: 100%;
        white-space: normal;
        justify-content: flex-start;
        border-radius: 8px;
        transition: background-color 0.2s ease;
        margin: 0 !important;
    }

    .nav-dropdown-toggle:hover {
        
    }

    .nav-dropdown-toggle .w-icon-dropdown-toggle {
        font-size: 12px;
        position: absolute;
        right: 16px;
        top: 50%;
        transform: translateY(-50%);
        margin-left: 0;
        width: 16px;
        height: 16px;
        
    }

    .nav-dropdown-toggle.w--open .w-icon-dropdown-toggle {
        transform: translateY(-50%) rotate(180deg);
    }

    .nav-dropdown-toggle .nav-link-icon-block {
        display: flex !important;
        width: 40px;
        height: 40px;
        padding: 10px;
        border: 1px solid #e7e6e6;
        
        border-radius: 8px;
        justify-content: center;
        align-items: center;
        flex-shrink: 0;
    }

    .nav-dropdown-toggle .nav-link-icon-block img {
        width: 20px;
        height: 20px;
    }

    .nav-dropdown-toggle .nav-text-block {
        display: flex !important;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        flex: 1;
        gap: 2px;
        height: auto !important;
        overflow: visible !important;
    }

    .nav-dropdown-toggle .nav-link-description {
        display: block !important;
        font-family: "Interdisplay", Arial, sans-serif;
        
        font-size: 13px;
        font-weight: 400;
        text-transform: none;
        line-height: 1.4em;
    }

    .nav-dropdown-toggle .nav-link-title-wrapper {
        height: auto !important;
        overflow: visible !important;
    }

    .nav-dropdown-toggle .nav-link-title {
        font-size: 14px;
    }

    /* Mobile dropdown list - full width, indented */
    .nav-dropdown-list {
        position: static !important;
        box-shadow: none !important;
        border: none !important;
        padding: 0 !important;
        padding-left: 20px !important;
        background: transparent !important;
        min-width: auto !important;
        margin-top: 0 !important;
        border-radius: 0 !important;
        width: 100%;
        display: none;
    }

    .nav-dropdown-list.w--open {
        display: block !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
        padding-left: 20px !important;
    }

    .nav-dropdown-link {
        padding: 10px 16px !important;
        font-size: 14px !important;
        font-weight: 400 !important;
        background: transparent !important;
        border-radius: 8px;
        margin: 2px 0;
        
    }

    .nav-dropdown-link:hover {
        
        
    }

    .nav-buttons-block {
        gap: 8px;
        width: auto !important;
        justify-content: flex-end;
    }

    .nav-buttons-wrapper {
        display: none !important;
    }

    .nav-link-button-for-mobile {
        display: flex !important;
        flex-direction: column;
        justify-content: flex-start;
        align-items: stretch;
        width: 100%;
        padding-top: 8px;
        margin-top: 4px;
        border-top: 1px solid #e7e6e6;
    }

    .nav-link-button-for-mobile .nav-button {
        padding: 0 4px 0 20px;
        height: 44px;
        justify-content: center;
        width: 100%;
        
        
        border-radius: 40px;
        display: inline-flex;
        align-items: center;
        gap: 10px;
        text-decoration: none;
        position: relative;
        overflow: hidden;
    }

    .nav-link-button-for-mobile .nav-button .button-primary-text-block {
        font-family: "Geist", sans-serif;
        
        font-size: 14px;
        font-weight: 500;
        text-transform: uppercase;
        z-index: 2;
        position: relative;
    }

    .nav-link-button-for-mobile .nav-button .button-bg-block {
        z-index: 0;
        
        border-radius: 50px;
        width: 0%;
        height: 100%;
        position: absolute;
        inset: 0% 0% 0% auto;
        transition: width 0.3s ease;
    }

    .nav-link-button-for-mobile .nav-button .button-circle {
        
        border-radius: 999px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        z-index: 2;
        position: relative;
        flex-shrink: 0;
    }

    .nav-link-button-for-mobile .nav-button .button-icon-wrapper {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 20px;
        height: 20px;
    }

    .nav-link-button-for-mobile .nav-button .button-icon {
        width: 16px;
        height: 16px;
        filter: brightness(0) invert(1);
    }

    .menu-button {
        display: block !important;
        background: none !important;
        border: none;
        padding: 0;
        cursor: pointer;
        height: 32px;
        width: 32px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .menu-button.w--open {
        background: none !important;
    }

    .nav-cart-block {
        display: none !important;
    }

    .w-nav-button {
        float: none;
        font-size: 24px;
        padding: 0;
    }
}

/* ===== RESPONSIVE - MOBILE ===== */
@media screen and (max-width: 767px) {
    .nav-brand-icon {
        width: 110px !important;
        height: 44px !important;
    }

    .nav-container {
        padding: 6px 12px !important;
    }

    .nav-link .nav-link-icon-block,
    .nav-dropdown-toggle .nav-link-icon-block {
        width: 36px !important;
        height: 36px !important;
        padding: 8px !important;
    }

    .nav-link .nav-link-title,
    .nav-dropdown-toggle .nav-link-title {
        font-size: 13px !important;
    }

    .nav-link .nav-link-description,
    .nav-dropdown-toggle .nav-link-description {
        font-size: 12px !important;
    }

    .nav-links-wrapper {
        gap: 2px !important;
    }

    .nav-dropdown-link {
        font-size: 13px !important;
        padding: 8px 14px !important;
    }

    .nav-buttons-block {
        gap: 4px !important;
    }

    .nav-link-button-for-mobile .nav-button {
        height: 38px !important;
        padding: 0 4px 0 14px !important;
    }

    .nav-link-button-for-mobile .nav-button .button-primary-text-block {
        font-size: 12px !important;
    }

    .nav-link-button-for-mobile .nav-button .button-circle {
        width: 30px !important;
        height: 30px !important;
    }

    .menu-button {
        height: 28px !important;
        width: 28px !important;
    }

    .nav-open-icon,
    .nav-close-icon {
        width: 22px !important;
        height: 22px !important;
    }

    .nav-dropdown-list {
        padding-left: 16px !important;
    }
}

/* ===== RESPONSIVE - EXTRA SMALL ===== */
@media screen and (max-width: 479px) {
    .nav-brand-icon {
        width: 90px !important;
        height: 36px !important;
    }

    .nav-container {
        padding: 4px 10px !important;
    }

    .nav-link .nav-link-icon-block,
    .nav-dropdown-toggle .nav-link-icon-block {
        width: 32px !important;
        height: 32px !important;
        padding: 6px !important;
    }

    .nav-link .nav-link-title,
    .nav-dropdown-toggle .nav-link-title {
        font-size: 12px !important;
    }

    .nav-link .nav-link-description,
    .nav-dropdown-toggle .nav-link-description {
        font-size: 11px !important;
        display: none !important;
    }

    .nav-links-wrapper {
        gap: 2px !important;
    }

    .nav-dropdown-list {
        padding-left: 12px !important;
    }

    .nav-dropdown-link {
        font-size: 12px !important;
        padding: 6px 12px !important;
    }

    .nav-buttons-block {
        gap: 2px !important;
    }

    .nav-link-button-for-mobile .nav-button {
        height: 34px !important;
        padding: 0 2px 0 12px !important;
    }

    .nav-link-button-for-mobile .nav-button .button-primary-text-block {
        font-size: 11px !important;
    }

    .nav-link-button-for-mobile .nav-button .button-circle {
        width: 26px !important;
        height: 26px !important;
    }

    .menu-button {
        height: 24px !important;
        width: 24px !important;
    }

    .nav-open-icon,
    .nav-close-icon {
        width: 18px !important;
        height: 18px !important;
    }
}

/* ============================================================
   UTILITY FIXES
   ============================================================ */

/* Hide duplicate text everywhere */
.nav-link-title-wrapper .nav-link-title:last-child {
    display: none !important;
}

/* Dropdown arrow alignment */
.nav-dropdown-toggle .w-icon-dropdown-toggle {
    line-height: 1;
}

/* Ensure nav link text not cut off */
.nav-link-title {
    white-space: nowrap;
}

/* Override any conflicting styles */
.w-dropdown-list {
    background: transparent !important;
}

/* Fix w-dropdown default styles */
.w-dropdown {
    z-index: 900;
}

.w-dropdown-toggle {
    padding-right: 20px;
}

/* Ensure dropdown arrow is visible */
.w-icon-dropdown-toggle {
    font-family: "webflow-icons" !important;
}

/* Fix for mobile menu toggle */
.w-nav-button {
    float: none;
    font-size: 24px;
    padding: 0;
}

.w-nav-button:focus {
    outline: 0;
}

/* Ensure navbar stays on top */
.navbar {
    z-index: 1000;
}

/* Fix for cart hide */
.nav-cart-block,
.cart-button {
    display: none !important;
}

/* Ensure proper box sizing */
* {
    box-sizing: border-box;
}

/* ===== DROPDOWN BACKGROUND FIX - DESKTOP ===== */
@media screen and (min-width: 992px) {
    .nav-dropdown-list.w--open {
        background: #ffffff !important;
        border: 1px solid #e7e6e6 !important;
        border-radius: 12px !important;
        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12) !important;
        padding: 10px !important;
    }

    .nav-dropdown-link {
        background: #ffffff !important;
        
    }

    .nav-dropdown-link:hover {
        background: #f4f4f4 !important;
        
    }
}

/* ===== MOBILE DROPDOWN - FULL WIDTH INDENTED ===== */
@media screen and (max-width: 991px) {
    .nav-dropdown-list.w--open {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
        padding-left: 20px !important;
        position: static !important;
        width: 100% !important;
        min-width: auto !important;
        margin-top: 0 !important;
        border-radius: 0 !important;
    }

    .nav-dropdown-link {
        background: transparent !important;
        
        padding: 10px 16px !important;
        font-size: 14px !important;
        font-weight: 400 !important;
        border-radius: 8px;
        margin: 2px 0;
    }

    .nav-dropdown-link:hover {
        background: #f4f4f4 !important;
        
    }
}

/* ============================================================
   ABOUT US PREVIEW
   ============================================================ */
.about-preview {
    
    position: relative;
    overflow: hidden;
}

.about-preview-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}

/* ===== LEFT: IMAGE WITH UNIQUE SHAPE ===== */
.about-preview-image-block {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.about-image-shape {
    position: relative;
    width: 100%;
    max-width: 520px;
    aspect-ratio: 1/1.2;
    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
    overflow: hidden;
    background: linear-gradient(135deg, #0B1F3A 0%, #1A3A5C 100%);
    box-shadow: 0 30px 60px rgba(11, 31, 58, 0.15);
}

.about-preview-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.about-image-shape:hover .about-preview-image {
    transform: scale(1.05);
}

/* Decorative shape overlay */
.about-image-shape::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(201, 162, 39, 0.15) 0%, transparent 60%);
    pointer-events: none;
}

/* ===== DECORATIVE ELEMENTS ===== */
.about-shape-decoration {
    position: absolute;
    top: -20px;
    right: -30px;
    z-index: 2;
}

.shape-dot-grid {
    display: grid;
    grid-template-columns: repeat(3, 12px);
    gap: 10px;
    background: rgba(255, 255, 255, 0.9);
    padding: 14px;
    border-radius: 20px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    backdrop-filter: blur(10px);
}

.shape-dot-grid span {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: block;
}

.shape-dot-grid span:nth-child(1),
.shape-dot-grid span:nth-child(5),
.shape-dot-grid span:nth-child(9) {
    background: #C9A227;
}

.shape-dot-grid span:nth-child(2),
.shape-dot-grid span:nth-child(4),
.shape-dot-grid span:nth-child(6),
.shape-dot-grid span:nth-child(8) {
    background: #0B1F3A;
    opacity: 0.6;
}

.shape-dot-grid span:nth-child(3),
.shape-dot-grid span:nth-child(7) {
    background: #0B1F3A;
    opacity: 0.3;
}

/* ===== EXPERIENCE BADGE ===== */
.about-experience-badge {
    position: absolute;
    bottom: -20px;
    left: -20px;
    background: #C9A227;
    padding: 20px 28px;
    border-radius: 20px;
    text-align: center;
    box-shadow: 0 12px 40px rgba(201, 162, 39, 0.35);
    z-index: 3;
    animation: floatBadge 3s ease-in-out infinite;
}

@keyframes floatBadge {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

.experience-number {
    font-size: 32px;
    font-weight: 800;
    
    line-height: 1;
}

.experience-label {
    font-size: 12px;
    
    opacity: 0.9;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 4px;
}

/* ===== RIGHT: CONTENT ===== */
.about-preview-content {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Section Tag */
.about-section-tag {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    font-weight: 600;
    
    text-transform: uppercase;
    letter-spacing: 1px;
}

.tag-line {
    display: inline-block;
    width: 40px;
    height: 2px;
    background: #C9A227;
    border-radius: 2px;
}

/* Headline */
.about-preview-headline {
    font-size: var(--_typography---heading-h2--h2-font-size);
    line-height: var(--_typography---heading-h2--h2-line-height);
    font-weight: var(--_typography---font-weight--font-weight-600);
    
    margin: 0;
}

.highlight-text {
    
    position: relative;
    display: inline-block;
}

.highlight-text::after {
    content: '';
    position: absolute;
    bottom: 4px;
    left: 0;
    right: 0;
    height: 6px;
    background: rgba(201, 162, 39, 0.2);
    border-radius: 4px;
    z-index: -1;
}

/* Description */
.about-preview-description .paragraph-p1 {
    
    line-height: 1.7;
}

/* ===== HIGHLIGHTS GRID - MODERN TICK MARKS ===== */
.about-highlights-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 24px;
    margin: 8px 0 4px;
}

.highlight-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    
    font-weight: 500;
    padding: 6px 0;
    transition: all 0.3s ease;
    cursor: default;
}

.highlight-item:hover {
    transform: translateX(4px);
}

/* ===== MODERN UNIQUE TICK MARK - BLUE GREEN ===== */
.highlight-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: linear-gradient(135deg, #0B77A0 0%, #1A864D 100%);
    
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    flex-shrink: 0;
    position: relative;
    box-shadow: 0 4px 12px rgba(11, 119, 160, 0.3);
    transition: all 0.3s ease;
}

/* Glow effect on hover */
.highlight-item:hover .highlight-icon {
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(11, 119, 160, 0.4);
}

/* Alternative: Use SVG checkmark instead of text symbol */
.highlight-icon-svg {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: linear-gradient(135deg, #0B77A0 0%, #1A864D 100%);
    border-radius: 8px;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(11, 119, 160, 0.3);
    transition: all 0.3s ease;
}

.highlight-item:hover .highlight-icon-svg {
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(11, 119, 160, 0.4);
}

.highlight-icon-svg svg {
    width: 16px;
    height: 16px;
    
    
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ===== CTA ===== */
.about-cta-block {
    margin-top: 8px;
}

.about-cta-block .button-primary {
    background: #0B1F3A;
    
}

.about-cta-block .button-primary .button-primary-text-block {
    
    text-transform: none;
    font-weight: 600;
}

.about-cta-block .button-primary .button-circle {
    background: #C9A227;
}

.about-cta-block .button-primary:hover .button-circle {
    background: #0B1F3A;
}

/* ===== RESPONSIVE ===== */
@media screen and (max-width: 991px) {
    .about-preview-wrapper {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .about-preview-image-block {
        order: -1;
    }

    .about-image-shape {
        max-width: 100%;
        aspect-ratio: 1/1;
        border-radius: 40% 60% 60% 40% / 40% 40% 60% 60%;
    }

    .about-shape-decoration {
        top: -10px;
        right: -10px;
    }

    .about-experience-badge {
        bottom: -10px;
        left: -10px;
        padding: 14px 20px;
    }

    .experience-number {
        font-size: 24px;
    }

    .about-highlights-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }
}

@media screen and (max-width: 767px) {
    .about-preview-headline {
        font-size: var(--_typography---heading-h3--h3-font-size);
    }

    .about-image-shape {
        aspect-ratio: 1/1.1;
        border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
    }

    .about-shape-decoration {
        display: none;
    }

    .about-experience-badge {
        padding: 12px 16px;
        bottom: -8px;
        left: -8px;
    }

    .experience-number {
        font-size: 20px;
    }

    .experience-label {
        font-size: 10px;
    }

    .about-preview-wrapper {
        gap: 30px;
    }

    .highlight-icon,
    .highlight-icon-svg {
        width: 24px;
        height: 24px;
        font-size: 14px;
        border-radius: 6px;
    }

    .highlight-icon-svg svg {
        width: 14px;
        height: 14px;
    }
}

@media screen and (max-width: 479px) {
    .about-image-shape {
        aspect-ratio: 1/1.2;
        border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
    }

    .about-experience-badge {
        padding: 10px 14px;
        bottom: -5px;
        left: -5px;
    }

    .experience-number {
        font-size: 16px;
    }

    .highlight-item {
        font-size: 14px;
    }

    .highlight-icon,
    .highlight-icon-svg {
        width: 22px;
        height: 22px;
        font-size: 12px;
        border-radius: 6px;
    }

    .highlight-icon-svg svg {
        width: 12px;
        height: 12px;
    }
}

/* ============================================================
   ASQUAREB 360° LEARNING MODEL - AUTO-SLIDE DECK
   ============================================================ */
.model-deck-container {
    margin-top: 48px;
    padding-top: 48px;
    border-top: 1px solid rgba(0, 0, 0, 0.04);
    position: relative;
    overflow: hidden;
}

/* ===== HEADER ===== */
.deck-header {
    text-align: center;
    margin-bottom: 32px;
}

.deck-badge {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    font-weight: 600;
    
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 8px;
}

.deck-badge-line {
    display: inline-block;
    width: 30px;
    height: 2px;
    background: #C9A227;
    border-radius: 2px;
}

.deck-title {
    font-size: 32px;
    font-weight: 700;
    
    margin: 0 0 8px 0;
    line-height: 1.2;
}

.deck-title .gold-text {
    
    position: relative;
}

.deck-title .gold-text::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 0;
    right: 0;
    height: 4px;
    background: rgba(201, 162, 39, 0.2);
    border-radius: 4px;
    z-index: -1;
}

.deck-subtitle {
    font-size: 16px;
    
    margin: 0;
    line-height: 1.6;
}

/* ===== SCROLL WRAPPER ===== */
.deck-scroll-wrapper {
    overflow: hidden;
    padding: 20px 0 10px 0;
    position: relative;
}

/* ===== TRACK ===== */
.deck-track {
    display: flex;
    gap: 20px;
    padding: 0 20px;
    transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    will-change: transform;
}

/* ===== ITEM ===== */
.deck-item {
    flex: 0 0 220px;
    width: 220px;
    perspective: 1000px;
    opacity: 0.5;
    transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
    transform: scale(0.92);
}

.deck-item.active {
    opacity: 1;
    transform: scale(1);
}

.deck-item-inner {
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 20px;
    padding: 28px 20px 24px;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.04);
}

.deck-item.active .deck-item-inner {
    background: rgba(255, 255, 255, 0.85);
    
    box-shadow: 0 12px 48px rgba(201, 162, 39, 0.08);
}

/* ===== ITEM CONTENT ===== */
.deck-number {
    font-size: 11px;
    font-weight: 700;
    
    letter-spacing: 0.5px;
    opacity: 0.5;
    margin-bottom: 4px;
}

.deck-icon {
    font-size: 16px;
    
    margin-bottom: 8px;
    display: block;
    opacity: 0.6;
    transition: all 0.3s ease;
}

.deck-item.active .deck-icon {
    opacity: 1;
    transform: scale(1.1);
}

.deck-item-title {
    font-size: 16px;
    font-weight: 600;
    
    margin: 0 0 6px 0;
    line-height: 1.3;
}

.deck-item-desc {
    font-size: 13px;
    
    line-height: 1.6;
    margin: 0;
    flex: 1;
}

.deck-item-line {
    width: 0%;
    height: 2px;
    background: linear-gradient(90deg, #C9A227, #0B1F3A);
    border-radius: 2px;
    margin-top: 14px;
    transition: width 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}

.deck-item.active .deck-item-line {
    width: 60%;
}

/* ===== CONTROLS ===== */
.deck-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: 16px;
}

.deck-arrow {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.06);
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    
}

.deck-arrow:hover {
    background: #0B1F3A;
    
    
    transform: scale(1.05);
}

.deck-arrow:disabled {
    opacity: 0.3;
    cursor: not-allowed;
    pointer-events: none;
}

/* ===== DOTS ===== */
.deck-dots {
    display: flex;
    gap: 8px;
    align-items: center;
}

.deck-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.1);
    transition: all 0.4s ease;
    cursor: pointer;
    border: none;
    padding: 0;
}

.deck-dot.active {
    background: #C9A227;
    width: 24px;
    border-radius: 4px;
}

.deck-dot:hover {
    background: #C9A227;
    opacity: 0.6;
}

/* ===== AUTOPLAY TOGGLE ===== */
.deck-autoplay {
    display: flex;
    justify-content: center;
    margin-top: 12px;
}

.autoplay-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    font-size: 13px;
    
    cursor: pointer;
    padding: 4px 12px;
    border-radius: 20px;
    transition: all 0.3s ease;
}

.autoplay-btn:hover {
    
    background: rgba(0, 0, 0, 0.04);
}

.autoplay-icon {
    font-size: 14px;
}

/* ============================================================
   DECK RESPONSIVE
   ============================================================ */

@media screen and (max-width: 991px) {
    .deck-item {
        flex: 0 0 200px;
        width: 200px;
    }
    .deck-title {
        font-size: 28px;
    }
}

@media screen and (max-width: 767px) {
    .model-deck-container {
        margin-top: 32px;
        padding-top: 32px;
    }
    .deck-item {
        flex: 0 0 180px;
        width: 180px;
    }
    .deck-item-inner {
        padding: 20px 16px 18px;
        border-radius: 16px;
    }
    .deck-title {
        font-size: 24px;
    }
    .deck-subtitle {
        font-size: 14px;
    }
    .deck-item-title {
        font-size: 16px;
    }
    .deck-item-desc {
        font-size: 12px;
    }
    .deck-track {
        gap: 14px;
        padding: 0 16px;
    }
    .deck-arrow {
        width: 34px;
        height: 34px;
    }
}

@media screen and (max-width: 479px) {
    .deck-item {
        flex: 0 0 160px;
        width: 160px;
    }
    .deck-item-inner {
        padding: 16px 14px 14px;
        border-radius: 14px;
    }
    .deck-title {
        font-size: 20px;
    }
    .deck-item-title {
        font-size: 14px;
    }
    .deck-item-desc {
        font-size: 11px;
    }
    .deck-icon {
        font-size: 16px;
    }
    .deck-number {
        font-size: 10px;
    }
    .deck-badge {
        font-size: 11px;
    }
    .deck-subtitle {
        font-size: 13px;
    }
    .deck-arrow {
        width: 30px;
        height: 30px;
    }
    .deck-dots {
        gap: 6px;
    }
    .deck-dot {
        width: 6px;
        height: 6px;
    }
    .deck-dot.active {
        width: 18px;
    }
}

/* ============================================================
   EXPLORE OUR COMPREHENSIVE PROGRAMS - PROFESSIONAL
   ============================================================ */

.programs-professional {
    background: #F8FAFB;
    padding: 20px 0;
    position: relative;
    overflow: hidden;
}

/* ===== HEADER ===== */
.programs-header {
    text-align: center;
    margin-bottom: 40px;
}

.programs-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 8px;
}

.badge-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #C9A227;
}

.programs-title {
    font-size: 38px;
    font-weight: 700;
    
    margin: 0 0 10px 0;
    line-height: 1.2;
}

.programs-title .gold-text {
    
    position: relative;
}

.programs-title .gold-text::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 0;
    right: 0;
    height: 4px;
    background: rgba(201, 162, 39, 0.2);
    border-radius: 4px;
    z-index: -1;
}

.programs-subtitle {
    font-size: 16px;
    
    margin: 0;
    line-height: 1.6;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

/* ===== SLIDER ===== */
.programs-slider-wrapper {
    position: relative;
    overflow: hidden;
    padding: 10px 0;
    margin: 0 -10px;
}

.programs-slider-track {
    display: flex;
    gap: 24px;
    padding: 0 10px;
    transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);
    will-change: transform;
}

.programs-slide {
    flex: 0 0 calc(33.333% - 16px);
    min-width: calc(33.333% - 16px);
}

/* ===== CARD ===== */
.program-card {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    height: 100%;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
    border: 1px solid rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
}

.program-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
    
}

/* ===== CARD IMAGE ===== */
.program-card-image {
    position: relative;
    width: 100%;
    height: 220px;
    overflow: hidden;
    flex-shrink: 0;
}

.program-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.program-card:hover .program-card-image img {
    transform: scale(1.06);
}

.program-card-overlay {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 2;
}

.program-card-tag {
    display: inline-block;
    padding: 4px 14px;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    
    letter-spacing: 0.3px;
    text-transform: uppercase;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
}

/* ===== CARD BODY ===== */
.program-card-body {
    padding: 20px 22px 22px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* ===== CARD TOP ROW ===== */
.program-card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
}

.program-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.badge {
    padding: 3px 12px;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.badge-primary {
    background: #0B1F3A;
    
}

.badge-secondary {
    background: rgba(11, 31, 58, 0.06);
    
}

/* ===== LINK BUTTON ===== */
.program-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(201, 162, 39, 0.08);
    
    transition: all 0.3s ease;
    flex-shrink: 0;
    text-decoration: none;
}

.program-link:hover {
    background: #C9A227;
    
    transform: rotate(45deg);
}

.program-link svg {
    width: 16px;
    height: 16px;
    stroke-width: 2.5;
}

/* ===== TITLE ===== */
.program-card-title {
    font-size: 20px;
    font-weight: 700;
    
    margin: 0;
    line-height: 1.3;
}

/* ===== DESCRIPTION ===== */
.program-card-desc {
    font-size: 14px;
    
    line-height: 1.6;
    margin: 0;
    flex: 1;
}

/* ===== BOTTOM FEATURES ===== */
.program-card-bottom {
    display: flex;
    gap: 16px;
    margin-top: 4px;
    flex-wrap: wrap;
}

.program-feature {
    font-size: 12px;
    font-weight: 500;
    
    display: flex;
    align-items: center;
    gap: 4px;
}

.program-feature::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #C9A227;
}

/* ===== SLIDER BUTTONS ===== */
.slider-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(0, 0, 0, 0.04);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
}

.slider-btn:hover {
    background: #ffffff;
    
    
    box-shadow: 0 6px 30px rgba(0, 0, 0, 0.08);
}

.slider-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
    pointer-events: none;
}

.slider-btn-prev {
    left: 4px;
}

.slider-btn-next {
    right: 4px;
}

.slider-btn svg {
    width: 20px;
    height: 20px;
    stroke-width: 2.5;
}

/* ===== CTA ===== */
.programs-cta {
    text-align: center;
    margin-top: 40px;
}

.btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 36px;
    background: #0B1F3A;
    
    font-weight: 600;
    border-radius: 60px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
}

.btn-primary:hover {
    background: #1A3A5C;
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(11, 31, 58, 0.15);
}

.btn-primary svg {
    transition: transform 0.3s ease;
}

.btn-primary:hover svg {
    transform: translateX(4px);
}

/* ============================================================
   PROGRAMS RESPONSIVE
   ============================================================ */

@media screen and (max-width: 992px) {
    .programs-slide {
        flex: 0 0 calc(50% - 12px);
        min-width: calc(50% - 12px);
    }

    .programs-title {
        font-size: 32px;
    }

    .program-card-image {
        height: 180px;
    }
}

@media screen and (max-width: 640px) {
    .programs-slide {
        flex: 0 0 100%;
        min-width: 100%;
    }

    .programs-title {
        font-size: 26px;
    }

    .programs-subtitle {
        font-size: 16px;
    }

    .program-card-image {
        height: 160px;
    }

    .program-card-body {
        padding: 16px 16px 18px;
    }

    .program-card-title {
        font-size: 16px;
    }

    .program-card-desc {
        font-size: 13px;
    }

    .slider-btn {
        width: 36px;
        height: 36px;
    }

    .slider-btn svg {
        width: 16px;
        height: 16px;
    }

    .slider-btn-prev {
        left: 2px;
    }

    .slider-btn-next {
        right: 2px;
    }

    .program-card-top {
        flex-wrap: wrap;
    }

    .btn-primary {
        padding: 12px 28px;
        font-size: 14px;
    }
}

@media screen and (max-width: 400px) {
    .program-card-image {
        height: 130px;
    }

    .program-card-body {
        padding: 14px 12px 16px;
    }

    .program-card-title {
        font-size: 16px;
    }

    .program-card-desc {
        font-size: 12px;
    }

    .program-feature {
        font-size: 11px;
    }

    .badge {
        font-size: 9px;
        padding: 2px 10px;
    }

    .programs-title {
        font-size: 22px;
    }
}/* ============================================================
   ACADEMIC EXCELLENCE - NEON GLOW EFFECT
   ============================================================ */

/* Continuous neon glow pulse animation */
@keyframes neonPulse {
    0% {
        box-shadow: 0 0 5px rgba(11, 119, 160, 0.3),
                    0 0 10px rgba(11, 119, 160, 0.2),
                    0 0 20px rgba(11, 119, 160, 0.1);
    }
    25% {
        box-shadow: 0 0 10px rgba(11, 119, 160, 0.6),
                    0 0 20px rgba(11, 119, 160, 0.4),
                    0 0 40px rgba(11, 119, 160, 0.2),
                    0 0 60px rgba(11, 119, 160, 0.1);
    }
    50% {
        box-shadow: 0 0 15px rgba(11, 119, 160, 0.8),
                    0 0 30px rgba(11, 119, 160, 0.5),
                    0 0 50px rgba(11, 119, 160, 0.3),
                    0 0 80px rgba(11, 119, 160, 0.15);
    }
    75% {
        box-shadow: 0 0 10px rgba(11, 119, 160, 0.6),
                    0 0 20px rgba(11, 119, 160, 0.4),
                    0 0 40px rgba(11, 119, 160, 0.2),
                    0 0 60px rgba(11, 119, 160, 0.1);
    }
    100% {
        box-shadow: 0 0 5px rgba(11, 119, 160, 0.3),
                    0 0 10px rgba(11, 119, 160, 0.2),
                    0 0 20px rgba(11, 119, 160, 0.1);
    }
}

/* Gold neon pulse */
@keyframes neonPulseGold {
    0% {
        box-shadow: 0 0 5px rgba(201, 162, 39, 0.3),
                    0 0 10px rgba(201, 162, 39, 0.2),
                    0 0 20px rgba(201, 162, 39, 0.1);
    }
    25% {
        box-shadow: 0 0 10px rgba(201, 162, 39, 0.6),
                    0 0 20px rgba(201, 162, 39, 0.4),
                    0 0 40px rgba(201, 162, 39, 0.2),
                    0 0 60px rgba(201, 162, 39, 0.1);
    }
    50% {
        box-shadow: 0 0 15px rgba(201, 162, 39, 0.8),
                    0 0 30px rgba(201, 162, 39, 0.5),
                    0 0 50px rgba(201, 162, 39, 0.3),
                    0 0 80px rgba(201, 162, 39, 0.15);
    }
    75% {
        box-shadow: 0 0 10px rgba(201, 162, 39, 0.6),
                    0 0 20px rgba(201, 162, 39, 0.4),
                    0 0 40px rgba(201, 162, 39, 0.2),
                    0 0 60px rgba(201, 162, 39, 0.1);
    }
    100% {
        box-shadow: 0 0 5px rgba(201, 162, 39, 0.3),
                    0 0 10px rgba(201, 162, 39, 0.2),
                    0 0 20px rgba(201, 162, 39, 0.1);
    }
}

/* Purple neon pulse */
@keyframes neonPulsePurple {
    0% {
        box-shadow: 0 0 5px rgba(107, 76, 154, 0.3),
                    0 0 10px rgba(107, 76, 154, 0.2),
                    0 0 20px rgba(107, 76, 154, 0.1);
    }
    25% {
        box-shadow: 0 0 10px rgba(107, 76, 154, 0.6),
                    0 0 20px rgba(107, 76, 154, 0.4),
                    0 0 40px rgba(107, 76, 154, 0.2),
                    0 0 60px rgba(107, 76, 154, 0.1);
    }
    50% {
        box-shadow: 0 0 15px rgba(107, 76, 154, 0.8),
                    0 0 30px rgba(107, 76, 154, 0.5),
                    0 0 50px rgba(107, 76, 154, 0.3),
                    0 0 80px rgba(107, 76, 154, 0.15);
    }
    75% {
        box-shadow: 0 0 10px rgba(107, 76, 154, 0.6),
                    0 0 20px rgba(107, 76, 154, 0.4),
                    0 0 40px rgba(107, 76, 154, 0.2),
                    0 0 60px rgba(107, 76, 154, 0.1);
    }
    100% {
        box-shadow: 0 0 5px rgba(107, 76, 154, 0.3),
                    0 0 10px rgba(107, 76, 154, 0.2),
                    0 0 20px rgba(107, 76, 154, 0.1);
    }
}

/* Apply neon glow to category cards */
.category-card {
    position: relative;
    transition: all 0.4s ease;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

/* Cyan card - Blue neon glow */
.card-cyan {
    border-top: 3px solid #0B77A0;
    animation-name: neonPulse;
}

/* Gold card - Gold neon glow */
.card-gold {
    border-top: 3px solid #C9A227;
    animation-name: neonPulseGold;
}

/* Purple card - Purple neon glow */
.card-purple {
    border-top: 3px solid #6B4C9A;
    animation-name: neonPulsePurple;
}

/* Enhanced glow on hover */
.category-card:hover {
    transform: translateY(-6px) scale(1.02);
    animation-play-state: paused;
}

.card-cyan:hover {
    box-shadow: 0 0 20px rgba(11, 119, 160, 0.6),
                0 0 40px rgba(11, 119, 160, 0.3),
                0 0 60px rgba(11, 119, 160, 0.15) !important;
    
}

.card-gold:hover {
    box-shadow: 0 0 20px rgba(201, 162, 39, 0.6),
                0 0 40px rgba(201, 162, 39, 0.3),
                0 0 60px rgba(201, 162, 39, 0.15) !important;
    
}

.card-purple:hover {
    box-shadow: 0 0 20px rgba(107, 76, 154, 0.6),
                0 0 40px rgba(107, 76, 154, 0.3),
                0 0 60px rgba(107, 76, 154, 0.15) !important;
    
}

/* Inner glow ring effect */
.category-card::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: 16px;
    z-index: -1;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.card-cyan::before {
    background: radial-gradient(circle at 50% 50%, rgba(11, 119, 160, 0.2), transparent 70%);
}

.card-gold::before {
    background: radial-gradient(circle at 50% 50%, rgba(201, 162, 39, 0.2), transparent 70%);
}

.card-purple::before {
    background: radial-gradient(circle at 50% 50%, rgba(107, 76, 154, 0.2), transparent 70%);
}

.category-card:hover::before {
    opacity: 1;
}

/* ============================================================
   RESPONSIVE - NEON EFFECTS
   ============================================================ */
@media screen and (max-width: 768px) {
    .category-card {
        animation-duration: 4s;
    }
    
    .card-cyan:hover,
    .card-gold:hover,
    .card-purple:hover {
        box-shadow: 0 0 15px rgba(11, 119, 160, 0.4),
                    0 0 30px rgba(11, 119, 160, 0.2) !important;
    }
}

@media screen and (max-width: 480px) {
    .category-card {
        animation-duration: 5s;
    }
    
    .category-card:hover {
        transform: translateY(-4px) scale(1.01);
    }
}