/* ╔══════════════════════════════════════════════════════════════╗
   ║  Obesity School — Design System                              ║
   ║  Palette: #272078 · #efeeea · #6b6b6b                       ║
   ║  Deep Indigo · Warm Cream · Warm Gray                        ║
   ╚══════════════════════════════════════════════════════════════╝ */

/* ═══════════════════════════════════════════════════════════════
   1. DESIGN TOKENS
   ═══════════════════════════════════════════════════════════════ */
:root {
    /* ── Core Brand ─────────────────── */
    --indigo:          #272078;   /* Main — deep authoritative indigo */
    --indigo-dark:     #1C1759;   /* Darker — footer, deep overlays */
    --indigo-mid:      #312890;   /* Gradient midpoint */
    --indigo-light:    #3D30A8;   /* Hover / lighter accent */
    --indigo-pale:     #ECEAF8;   /* Very light tint — chip backgrounds */

    /* ── Cream (Second) ─────────────── */
    --cream:           #efeeea;   /* Warm off-white — section backgrounds */
    --cream-dark:      #E0DED8;   /* Darker cream — borders, dividers */
    --cream-light:     #F7F6F3;   /* Lighter cream — card backgrounds */

    /* ── Gray (Third) ───────────────── */
    --gray:            #6b6b6b;   /* Body text / muted */
    --gray-dark:       #3A3A3A;   /* Dark headings / emphasis */
    --gray-light:      #9E9E9E;   /* Placeholder / captions */
    --gray-pale:       #F2F1EF;   /* Very pale gray-cream */

    /* ── Semantic ───────────────────── */
    --white:           #FFFFFF;
    --success:         #1F8B4C;
    --error:           #C0392B;

    /* ── Shadows ────────────────────── */
    --shadow-sm:       0 2px 12px rgba(39,32,120,0.08);
    --shadow-md:       0 8px 32px rgba(39,32,120,0.12);
    --shadow-lg:       0 20px 60px rgba(39,32,120,0.18);
    --shadow-indigo:   0 8px 28px rgba(39,32,120,0.30);

    /* ── Shape ──────────────────────── */
    --radius-sm:       8px;
    --radius-md:       14px;
    --radius-lg:       20px;
    --radius-xl:       28px;
    --radius-pill:     999px;

    /* ── Typography ─────────────────── */
    --font:            "Onest", "Inter", system-ui, sans-serif;

    /* ── Motion ─────────────────────── */
    --ease:            cubic-bezier(0.25, 0.46, 0.45, 0.94);

    /* ── Legacy aliases ─────────────── */
    --primary-color:   var(--indigo);
    --secondary-color: var(--cream);
    --accent-color:    var(--indigo);
    --accent-hover:    var(--indigo-light);
    --light-bg:        var(--cream);
    --border-color:    var(--cream-dark);
    --text-color:      var(--gray);
    --text-muted:      var(--gray-light);
    --white-color:     var(--white);
    --default-font:    var(--font);

    /* ── Extra aliases for inner pages ─ */
    --navy:            var(--indigo);
    --navy-dark:       var(--indigo-dark);
    --navy-mid:        var(--indigo-mid);
    --blue:            var(--indigo-light);
    --blue-pale:       var(--indigo-pale);
    --orange:          var(--indigo);
    --orange-dark:     var(--indigo-dark);
    --orange-pale:     var(--indigo-pale);
    --bg-light:        var(--cream);
    --bg-ice:          var(--cream-light);
    --border:          var(--cream-dark);
    --border-soft:     var(--gray-pale);
    --text-dark:       var(--gray-dark);
    --text-body:       var(--gray);
    --text-light:      rgba(239,238,234,0.75);
}

/* ═══════════════════════════════════════════════════════════════
   2. GLOBAL BASE
   ═══════════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }

body {
    font-family: var(--font);
    color: var(--gray);
    background: var(--white);
    -webkit-font-smoothing: antialiased;
    line-height: 1.65;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font);
    color: var(--indigo);
    line-height: 1.2;
    font-weight: 800;
    margin: 0;
}

a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
html { scroll-behavior: smooth; }

::selection { background: var(--indigo); color: var(--white); }

/* ═══════════════════════════════════════════════════════════════
   3. TOP UTILITY BAR
   ═══════════════════════════════════════════════════════════════ */
.os-top-bar {
    background: var(--indigo-dark);
    padding: 9px 0;
    font-size: 13px;
    font-family: var(--font);
    border-bottom: 1px solid rgba(239,238,234,0.06);
}
.os-top-bar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
}
.os-top-bar-left,
.os-top-bar-right { display: flex; align-items: center; gap: 24px; }
.os-top-bar-left a {
    color: rgba(239,238,234,0.80);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 7px;
    transition: color 0.2s;
    font-weight: 500;
}
.os-top-bar-left a i { color: var(--cream); font-size: 12px; opacity: 0.7; }
.os-top-bar-left a:hover { color: var(--cream); }
.os-top-bar-right span {
    color: rgba(239,238,234,0.65);
    display: flex;
    align-items: center;
    gap: 7px;
    font-weight: 500;
}
.os-top-bar-right span i { font-size: 12px; }
.os-top-bar-social {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: 8px;
    padding-left: 16px;
    border-left: 1px solid rgba(239,238,234,0.12);
}
.os-top-bar-social a {
    color: rgba(239,238,234,0.60);
    width: 28px;
    height: 28px;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(239,238,234,0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    transition: all 0.22s var(--ease);
    background: rgba(239,238,234,0.04);
}
.os-top-bar-social a:hover {
    background: var(--indigo-light);
    border-color: var(--indigo-light);
    color: #fff;
    transform: translateY(-1px);
}

/* ═══════════════════════════════════════════════════════════════
   4. HEADER & NAVIGATION
   ═══════════════════════════════════════════════════════════════ */
.main-header { border-bottom: none; }
.header-sticky {
    box-shadow: 0 2px 24px rgba(39,32,120,0.08);
    background: var(--white);
}
.navbar { padding: 0; background: var(--white); }
.navbar .container { padding-top: 0; padding-bottom: 0; }
.navbar-brand img {
    height: 70px !important;
    padding: 4px 0;
    transition: transform 0.2s;
}
.navbar-brand:hover img { transform: scale(1.02); }

/* Nav links */
.nav-menu-wrapper .navbar-nav > li > a.nav-link {
    color: var(--indigo) !important;
    font-weight: 600;
    font-size: 14.5px;
    padding: 28px 15px;
    letter-spacing: 0.015em;
    transition: color 0.2s;
    position: relative;
}
.nav-menu-wrapper .navbar-nav > li > a.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 15px;
    right: 15px;
    height: 3px;
    background: var(--indigo);
    border-radius: 3px 3px 0 0;
    transform: scaleX(0);
    transition: transform 0.25s var(--ease);
}
.nav-menu-wrapper .navbar-nav > li > a.nav-link:hover,
.nav-menu-wrapper .navbar-nav > li.active > a.nav-link {
    color: var(--indigo-light) !important;
}
.nav-menu-wrapper .navbar-nav > li > a.nav-link:hover::after,
.nav-menu-wrapper .navbar-nav > li.active > a.nav-link::after {
    transform: scaleX(1);
}

/* Dropdown */
.nav-menu-wrapper .navbar-nav li.submenu > ul {
    background: var(--white);
    border-top: 3px solid var(--indigo);
    border-radius: 0 0 var(--radius-md) var(--radius-md);
    box-shadow: var(--shadow-lg);
    min-width: 230px;
    border: 1px solid var(--cream-dark);
    border-top: 3px solid var(--indigo);
}
.nav-menu-wrapper .navbar-nav li.submenu > ul li a {
    color: var(--indigo) !important;
    font-size: 14px;
    padding: 10px 20px;
    font-weight: 500;
    border-bottom: 1px solid var(--cream);
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 8px;
}
.nav-menu-wrapper .navbar-nav li.submenu > ul li a::before {
    content: '›';
    color: var(--indigo);
    font-size: 18px;
    line-height: 1;
    opacity: 0;
    transition: opacity 0.2s, transform 0.2s;
    transform: translateX(-6px);
}
.nav-menu-wrapper .navbar-nav li.submenu > ul li a:hover {
    background: var(--cream);
    color: var(--indigo) !important;
    padding-left: 24px;
}
.nav-menu-wrapper .navbar-nav li.submenu > ul li a:hover::before {
    opacity: 1;
    transform: translateX(0);
}

/* Highlighted nav */
.nav-menu-wrapper .navbar-nav li.highlighted-menu a.nav-link {
    color: var(--indigo-light) !important;
    font-weight: 700;
}

/* Header CTA */
.header-btn .btn-default,
.header-btn .btn-highlighted {
    background: var(--indigo) !important;
    color: var(--white) !important;
    border-radius: var(--radius-md) !important;
    padding: 12px 26px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    border: 2px solid var(--indigo) !important;
    transition: all 0.25s var(--ease) !important;
    letter-spacing: 0.02em !important;
}
.header-btn .btn-default:hover,
.header-btn .btn-highlighted:hover {
    background: var(--indigo-dark) !important;
    border-color: var(--indigo-dark) !important;
    transform: translateY(-2px) !important;
    box-shadow: var(--shadow-indigo) !important;
}

/* ═══════════════════════════════════════════════════════════════
   5. BUTTON SYSTEM
   ═══════════════════════════════════════════════════════════════ */
.os-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 30px;
    border-radius: var(--radius-md);
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.28s var(--ease);
    font-family: var(--font);
    cursor: pointer;
    border: 2px solid transparent;
    letter-spacing: 0.02em;
    line-height: 1;
}
.os-btn i { font-size: 14px; }

/* Primary — Indigo */
.os-btn-primary {
    background: var(--indigo);
    color: var(--white);
    border-color: var(--indigo);
}
.os-btn-primary:hover {
    background: var(--indigo-dark);
    border-color: var(--indigo-dark);
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: var(--shadow-indigo);
}

/* Secondary — Outlined Indigo */
.os-btn-secondary {
    background: var(--indigo);
    color: var(--white);
    border-color: var(--indigo);
}
.os-btn-secondary:hover {
    background: var(--indigo-dark);
    border-color: var(--indigo-dark);
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: var(--shadow-indigo);
}

/* Accent — same as primary */
.os-btn-accent {
    background: var(--indigo);
    color: var(--white);
    border-color: var(--indigo);
}
.os-btn-accent:hover {
    background: var(--indigo-dark);
    border-color: var(--indigo-dark);
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: var(--shadow-indigo);
}

/* Navy */
.os-btn-navy {
    background: var(--indigo);
    color: var(--white);
    border-color: var(--indigo);
}
.os-btn-navy:hover {
    background: var(--indigo-dark);
    color: var(--white);
    transform: translateY(-2px);
}

/* Outline on light bg */
.os-btn-outline {
    background: transparent;
    color:white;
    border-color: var(--cream-dark);
}
.os-btn-outline:hover {
    background: var(--cream);
    border-color: var(--indigo);
    color: var(--indigo);
}

/* Outline on dark bg */
.os-btn-outline-white {
    background: transparent;
    color: var(--cream);
    border-color: rgba(239,238,234,0.45);
}
.os-btn-outline-white:hover {
    background: rgba(239,238,234,0.10);
    border-color: var(--cream);
    color: var(--cream);
    transform: translateY(-2px);
}

/* Cream button — on indigo bg */
.os-btn-cream {
    background: var(--cream);
    color: var(--indigo);
    border-color: var(--cream);
}
.os-btn-cream:hover {
    background: var(--white);
    border-color: var(--white);
    color: var(--indigo);
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(0,0,0,0.20);
}

/* Ghost — cream outline on dark */
.os-btn-ghost-orange {
    background: transparent;
    color: var(--cream);
    border-color: rgba(239,238,234,0.45);
}
.os-btn-ghost-orange:hover {
    background: var(--cream);
    color: var(--indigo);
    transform: translateY(-2px);
}

/* Sizes */
.os-btn-sm  { padding: 10px 22px; font-size: 13.5px; }
.os-btn-lg  { padding: 17px 38px; font-size: 16px; }
.os-btn-full { width: 100%; justify-content: center; }

/* ═══════════════════════════════════════════════════════════════
   6. HERO SECTION
   ═══════════════════════════════════════════════════════════════ */
.os-hero {
    position: relative;
    background: linear-gradient(145deg, var(--indigo-dark) 0%, var(--indigo) 55%, var(--indigo-mid) 100%);
    padding: 88px 0 70px;
    overflow: hidden;
}
.os-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url('../images/gall-5.jpg') center/cover no-repeat;
    opacity: 0.07;
    z-index: 0;
}
.os-hero-pattern {
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(ellipse at 15% 60%, rgba(61,48,168,0.35) 0%, transparent 55%),
        radial-gradient(ellipse at 85% 15%, rgba(239,238,234,0.08) 0%, transparent 50%),
        radial-gradient(ellipse at 50% 100%, rgba(28,23,89,0.50) 0%, transparent 60%);
    z-index: 0;
}
.os-hero .container { position: relative; z-index: 1; }

/* Hero badge */
.os-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(239,238,234,0.10);
    border: 1px solid rgba(239,238,234,0.22);
    border-radius: var(--radius-pill);
    padding: 7px 20px;
    margin-bottom: 24px;
    backdrop-filter: blur(8px);
}
.os-hero-badge span {
    color: var(--cream);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.os-hero-badge::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--cream);
    flex-shrink: 0;
    opacity: 0.8;
    box-shadow: 0 0 0 3px rgba(239,238,234,0.20);
    animation: pulse-dot 2s infinite;
}
@keyframes pulse-dot {
    0%, 100% { box-shadow: 0 0 0 3px rgba(239,238,234,0.20); }
    50%       { box-shadow: 0 0 0 6px rgba(239,238,234,0.08); }
}

/* Hero title */
.os-hero-content h1 {
    font-size: clamp(30px, 4vw, 54px);
    font-weight: 800;
    color: var(--white);
    line-height: 1.12;
    margin-bottom: 22px;
    letter-spacing: -0.02em;
}
.os-hero-content h1 .os-highlight {
    color: var(--cream);
    display: block;
}
.os-hero-content > p {
    font-size: 17px;
    color: rgba(239,238,234,0.75);
    line-height: 1.78;
    margin-bottom: 38px;
    max-width: 540px;
}
.os-hero-btns {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 44px;
}

/* Trust badges */
.os-hero-trust {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
    padding-top: 20px;
    border-top: 1px solid rgba(239,238,234,0.10);
}
.os-trust-item {
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgba(239,238,234,0.68);
    font-size: 13px;
    font-weight: 500;
}
.os-trust-item i {
    color: var(--cream);
    font-size: 15px;
    opacity: 0.75;
}

/* Hero gallery */
.os-hero-gallery {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 12px;
}
.os-hero-gallery-img {
    border-radius: var(--radius-md);
    overflow: hidden;
    position: relative;
    box-shadow: 0 12px 40px rgba(0,0,0,0.35);
}
.os-hero-gallery-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s var(--ease);
}
.os-hero-gallery-img:hover img { transform: scale(1.04); }
.os-hero-gallery-img:nth-child(1) { grid-row: span 2; min-height: 320px; }
.os-hero-gallery-img:nth-child(2) { min-height: 150px; }
.os-hero-gallery-img:nth-child(3) { min-height: 150px; }
.os-hero-gallery-img:nth-child(4) { grid-column: span 2; min-height: 130px; }

/* Overlay badge */
.os-hero-overlay-badge {
    position: absolute;
    bottom: 14px;
    left: 14px;
    background: rgba(28,23,89,0.88);
    backdrop-filter: blur(8px);
    border-radius: var(--radius-md);
    padding: 10px 16px;
    color: var(--white);
    border: 1px solid rgba(239,238,234,0.12);
}
.os-hero-overlay-badge strong {
    display: block;
    font-size: 24px;
    font-weight: 800;
    color: var(--cream);
    line-height: 1;
}
.os-hero-overlay-badge span {
    font-size: 11px;
    opacity: 0.70;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* ═══════════════════════════════════════════════════════════════
   7. STATS BAR
   ═══════════════════════════════════════════════════════════════ */
.os-stats-bar {
    background: var(--indigo);
    padding: 0;
    position: relative;
}
.os-stats-bar::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, var(--indigo-dark) 0%, var(--indigo) 50%, var(--indigo-mid) 100%);
}
.os-stats-inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    position: relative;
    z-index: 1;
}
.os-stat-item {
    text-align: center;
    padding: 30px 20px;
    border-right: 1px solid rgba(239,238,234,0.15);
    transition: background 0.2s;
}
.os-stat-item:hover { background: rgba(239,238,234,0.06); }
.os-stat-item:last-child { border-right: none; }
.os-stat-item h3 {
    font-size: 42px;
    font-weight: 900;
    color: var(--cream);
    line-height: 1;
    margin-bottom: 6px;
    letter-spacing: -0.02em;
}
.os-stat-item p {
    color: rgba(239,238,234,0.65);
    font-size: 12.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin: 0;
}

/* ═══════════════════════════════════════════════════════════════
   8. SECTION COMMON STYLES
   ═══════════════════════════════════════════════════════════════ */
.os-section          { padding: 96px 0; }
.os-section-light    { background: var(--cream); }
.os-section-white    { background: var(--white); }
.os-section-navy,
.os-section-dark     { background: var(--indigo); }
.os-section-cream    { background: var(--cream); }

/* Tag pill */
.os-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--indigo-pale);
    color: var(--indigo);
    border-radius: var(--radius-pill);
    padding: 5px 16px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.os-tag::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--indigo);
    flex-shrink: 0;
}
.os-tag-orange,
.os-tag-accent {
    background: var(--indigo);
    color: var(--cream);
}
.os-tag-orange::before,
.os-tag-accent::before { background: var(--cream); }
.os-tag-navy {
    background: var(--indigo-pale);
    color: var(--indigo);
}

/* Section title */
.os-section-title h2 {
    font-size: clamp(26px, 3.5vw, 42px);
    font-weight: 800;
    color: var(--indigo);
    line-height: 1.18;
    margin-bottom: 16px;
    letter-spacing: -0.02em;
}
.os-section-title p {
    color: var(--gray);
    font-size: 16px;
    line-height: 1.78;
    max-width: 600px;
}
.os-section-title.text-center p { margin-left: auto; margin-right: auto; }

/* Divider accent bar */
.os-divider {
    width: 48px;
    height: 4px;
    background: var(--indigo);
    border-radius: 2px;
    margin-bottom: 20px;
}
.text-center .os-divider { margin-left: auto; margin-right: auto; }

/* ═══════════════════════════════════════════════════════════════
   9. ABOUT SECTION
   ═══════════════════════════════════════════════════════════════ */
.os-about-img-wrap {
    position: relative;
    display: inline-block;
    width: 100%;
}
.os-about-img-wrap img {
    border-radius: var(--radius-lg);
    width: 100%;
    object-fit: cover;
    height: 480px;
    box-shadow: var(--shadow-lg);
}
.os-about-badge {
    position: absolute;
    bottom: -22px;
    right: -20px;
    background: var(--indigo);
    border-radius: var(--radius-lg);
    padding: 22px 28px;
    text-align: center;
    color: var(--white);
    box-shadow: var(--shadow-indigo);
}
.os-about-badge h3 {
    font-size: 44px;
    font-weight: 900;
    color: var(--cream);
    line-height: 1;
    margin-bottom: 4px;
    letter-spacing: -0.02em;
}
.os-about-badge p {
    font-size: 12.5px;
    color: rgba(239,238,234,0.80);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
}
.os-about-list {
    list-style: none;
    padding: 0;
    margin: 24px 0;
}
.os-about-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 11px 0;
    color: var(--gray);
    font-size: 15px;
    border-bottom: 1px solid var(--cream-dark);
}
.os-about-list li:last-child { border-bottom: none; }
.os-about-list li i { color: var(--indigo); font-size: 17px; flex-shrink: 0; margin-top: 1px; }

/* ═══════════════════════════════════════════════════════════════
   10. CONFERENCE BANNER
   ═══════════════════════════════════════════════════════════════ */
.os-conference-banner {
    background: linear-gradient(145deg, var(--indigo-dark) 0%, var(--indigo) 55%, var(--indigo-mid) 100%);
    padding: 80px 0;
    position: relative;
    overflow: hidden;
}
.os-conference-banner::before {
    content: '';
    position: absolute;
    right: -120px; top: -120px;
    width: 500px; height: 500px;
    border-radius: 50%;
    background: rgba(239,238,234,0.04);
    border: 1px solid rgba(239,238,234,0.06);
}
.os-conference-banner::after {
    content: '';
    position: absolute;
    left: -60px; bottom: -80px;
    width: 320px; height: 320px;
    border-radius: 50%;
    background: rgba(61,48,168,0.15);
}
.os-conference-inner { position: relative; z-index: 1; }
.os-conf-year {
    font-size: 90px;
    font-weight: 900;
    color: rgba(239,238,234,0.04);
    line-height: 1;
    position: absolute;
    top: -10px; right: 0;
    letter-spacing: -6px;
    pointer-events: none;
}
.os-conf-tag {
    display: inline-block;
    background: var(--cream);
    color: var(--indigo);
    padding: 5px 18px;
    border-radius: var(--radius-pill);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 18px;
}
.os-conference-banner h2 {
    font-size: clamp(28px, 3vw, 46px);
    font-weight: 800;
    color: var(--white);
    margin-bottom: 16px;
    line-height: 1.18;
    letter-spacing: -0.02em;
}
.os-conference-banner p {
    color: rgba(239,238,234,0.72);
    font-size: 16px;
    max-width: 530px;
    line-height: 1.78;
    margin-bottom: 32px;
}
.os-conf-details {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
    margin-bottom: 34px;
}
.os-conf-detail-item {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(239,238,234,0.80);
    font-size: 14px;
    font-weight: 500;
}
.os-conf-detail-item i { color: var(--cream); font-size: 18px; opacity: 0.75; }

/* ═══════════════════════════════════════════════════════════════
   11. COURSE CARDS
   ═══════════════════════════════════════════════════════════════ */
.os-courses-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(265px, 1fr));
    gap: 20px;
}
.os-course-card {
    background: var(--white);
    border: 1px solid var(--cream-dark);
    border-radius: var(--radius-md);
    padding: 26px 24px;
    transition: all 0.3s var(--ease);
    position: relative;
    overflow: hidden;
}
.os-course-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: var(--indigo);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s var(--ease);
}
.os-course-card:hover::before { transform: scaleX(1); }
.os-course-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-5px);
    border-color: var(--indigo);
}
.os-course-card-icon {
    width: 46px;
    height: 46px;
    background: var(--indigo-pale);
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 14px;
}
.os-course-card-icon i { color: var(--indigo); font-size: 20px; }
.os-course-card h4 {
    font-size: 14.5px;
    font-weight: 700;
    color: var(--indigo);
    line-height: 1.4;
    margin-bottom: 12px;
}
.os-course-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}
.os-course-chip {
    background: var(--cream);
    color: var(--indigo);
    border-radius: var(--radius-pill);
    padding: 4px 11px;
    font-size: 11.5px;
    font-weight: 600;
    border: 1px solid var(--cream-dark);
}
.os-course-chip.price {
    background: var(--indigo);
    color: var(--white);
    font-weight: 700;
    border-color: var(--indigo);
}
.os-course-card a.os-card-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--indigo);
    font-size: 13px;
    font-weight: 700;
    transition: gap 0.2s;
}
.os-course-card a.os-card-link:hover { gap: 12px; color: var(--indigo-light); }

/* ═══════════════════════════════════════════════════════════════
   12. PROGRAM CARDS
   ═══════════════════════════════════════════════════════════════ */
.os-program-card {
    background: var(--white);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: transform 0.3s var(--ease), box-shadow 0.3s;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.os-program-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-lg);
}
.os-program-card-header {
    padding: 38px 32px 30px;
    position: relative;
    overflow: hidden;
}
.os-program-card-header.navy,
.os-program-card-header.blue  { background: var(--indigo); }
.os-program-card-header.orange { background: var(--indigo-mid); }
.os-program-card-header::after {
    content: '';
    position: absolute;
    right: -30px; bottom: -30px;
    width: 130px; height: 130px;
    border-radius: 50%;
    background: rgba(239,238,234,0.08);
}
.os-program-number {
    font-size: 54px;
    font-weight: 900;
    color: rgba(239,238,234,0.10);
    line-height: 1;
    margin-bottom: 10px;
}
.os-program-card-header h3 {
    font-size: 20px;
    font-weight: 800;
    color: var(--white);
    margin-bottom: 8px;
    line-height: 1.25;
}
.os-program-card-header .os-program-price {
    font-size: 28px;
    font-weight: 800;
    color: var(--cream);
    line-height: 1;
}
.os-program-card-header .os-program-price span {
    font-size: 13px;
    font-weight: 400;
    opacity: 0.65;
}
.os-program-card-body {
    padding: 28px 32px;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.os-program-features {
    list-style: none;
    padding: 0;
    margin: 0 0 26px;
}
.os-program-features li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 9px 0;
    color: var(--gray);
    font-size: 14.5px;
    border-bottom: 1px solid var(--cream-dark);
}
.os-program-features li:last-child { border-bottom: none; }
.os-program-features li i { color: var(--indigo); flex-shrink: 0; font-size: 13px; margin-top: 3px; }

/* ═══════════════════════════════════════════════════════════════
   13. FACULTY CARD
   ═══════════════════════════════════════════════════════════════ */
.os-faculty-card {
    background: var(--white);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: transform 0.3s var(--ease), box-shadow 0.3s;
}
.os-faculty-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
}
.os-faculty-img-wrap {
    position: relative;
    height: 380px;
    overflow: hidden;
}
.os-faculty-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    transition: transform 0.5s var(--ease);
}
.os-faculty-card:hover .os-faculty-img-wrap img { transform: scale(1.04); }
.os-faculty-img-overlay {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 65%;
    background: linear-gradient(to top, rgba(28,23,89,0.92) 0%, transparent 100%);
}
.os-faculty-name-tag {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    padding: 20px 24px;
}
.os-faculty-name-tag h3 { color: var(--white); font-size: 22px; font-weight: 800; margin-bottom: 4px; }
.os-faculty-name-tag p  { color: var(--cream); font-size: 13px; margin: 0; opacity: 0.80; }
.os-faculty-body { padding: 24px; }
.os-faculty-body p { font-size: 14.5px; color: var(--gray); line-height: 1.78; margin-bottom: 16px; }
.os-faculty-creds { display: flex; flex-wrap: wrap; gap: 8px; }
.os-cred-chip {
    background: var(--indigo-pale);
    color: var(--indigo);
    border-radius: var(--radius-sm);
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 700;
}

/* ═══════════════════════════════════════════════════════════════
   14. WHY CHOOSE US
   ═══════════════════════════════════════════════════════════════ */
.os-why-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 24px;
}
.os-why-item {
    background: var(--white);
    border-radius: var(--radius-lg);
    padding: 32px 26px;
    text-align: center;
    border: 1px solid var(--cream-dark);
    transition: all 0.3s var(--ease);
}
.os-why-item:hover {
    border-color: var(--indigo);
    box-shadow: var(--shadow-md);
    transform: translateY(-5px);
}
.os-why-icon {
    width: 64px;
    height: 64px;
    border-radius: var(--radius-md);
    background: var(--indigo);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px;
    font-size: 26px;
    color: var(--cream);
    box-shadow: var(--shadow-indigo);
    transition: transform 0.3s var(--ease);
}
.os-why-item:hover .os-why-icon { transform: scale(1.08) rotate(-3deg); }
.os-why-item h4 { font-size: 16px; font-weight: 700; color: var(--indigo); margin-bottom: 10px; }
.os-why-item p  { color: var(--gray); font-size: 14.5px; line-height: 1.7; margin: 0; }

/* ═══════════════════════════════════════════════════════════════
   15. STATE CHAPTERS MARQUEE
   ═══════════════════════════════════════════════════════════════ */
.os-chapters-marquee-wrap {
    overflow: hidden;
    background: var(--white);
    padding: 44px 0;
    border-top: 1px solid var(--cream-dark);
    border-bottom: 1px solid var(--cream-dark);
}
.os-chapters-inner {
    display: flex;
    gap: 16px;
    animation: marquee 32s linear infinite;
    width: max-content;
}
.os-chapters-inner:hover { animation-play-state: paused; }
@keyframes marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.os-chapter-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--cream);
    border: 1px solid var(--cream-dark);
    border-radius: var(--radius-pill);
    padding: 10px 22px;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 600;
    color: var(--indigo);
    flex-shrink: 0;
    transition: all 0.2s;
}
.os-chapter-pill:hover {
    background: var(--indigo);
    border-color: var(--indigo);
    color: var(--cream);
}
.os-chapter-pill i { color: var(--indigo); }

/* ═══════════════════════════════════════════════════════════════
   16. PAGE HEADER (Inner Pages)
   ═══════════════════════════════════════════════════════════════ */
.page-header {
    background: linear-gradient(145deg, var(--indigo-dark) 0%, var(--indigo) 60%, var(--indigo-mid) 100%);
    padding: 64px 0 60px;
    position: relative;
    overflow: hidden;
}
.page-header::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(ellipse at 10% 50%, rgba(61,48,168,0.30) 0%, transparent 55%),
        radial-gradient(ellipse at 90% 20%, rgba(239,238,234,0.05) 0%, transparent 50%);
    z-index: 0;
}
.page-header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0; right: 0;
    height: 3px;
    background: var(--cream);
    opacity: 0.15;
}
.page-header .container { position: relative; z-index: 1; }
.page-header-box { text-align: center; }
.page-header h1 {
    font-size: clamp(30px, 4vw, 52px);
    font-weight: 800;
    color: var(--white);
    margin-bottom: 16px;
    letter-spacing: -0.02em;
}
.page-header .breadcrumb {
    justify-content: center;
    background: transparent;
    padding: 0; margin: 0; gap: 8px;
}
.page-header .breadcrumb-item a {
    color: rgba(239,238,234,0.60);
    font-size: 14px;
    font-weight: 500;
    transition: color 0.2s;
}
.page-header .breadcrumb-item a:hover { color: var(--cream); }
.page-header .breadcrumb-item.active {
    color: var(--cream);
    font-weight: 600;
    font-size: 14px;
    opacity: 0.9;
}
.page-header .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(239,238,234,0.30);
    content: '›';
    font-size: 18px;
    line-height: 1;
}

/* ═══════════════════════════════════════════════════════════════
   17. BLOG CARDS
   ═══════════════════════════════════════════════════════════════ */
.blog-item {
    border-radius: var(--radius-lg) !important;
    overflow: hidden;
    box-shadow: var(--shadow-sm) !important;
    border: 1px solid var(--cream-dark);
    transition: transform 0.3s var(--ease), box-shadow 0.3s !important;
    background: var(--white);
}
.blog-item:hover {
    transform: translateY(-5px) !important;
    box-shadow: var(--shadow-md) !important;
    border-color: var(--indigo);
}
.blog-item .post-featured-image figure { border-radius: 0 !important; }
.blog-item .post-item-body { padding: 22px 24px !important; background: var(--white); }
.blog-item .post-item-content h3 a {
    color: var(--indigo) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    transition: color 0.2s;
}
.blog-item .post-item-content h3 a:hover { color: var(--indigo-light) !important; }
.blog-item .post-item-btn a.redmore-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--indigo);
    font-weight: 700;
    font-size: 13.5px;
    transition: gap 0.2s;
}
.blog-item .post-item-btn a.redmore-btn::after { content: '→'; }
.blog-item .post-item-btn a.redmore-btn:hover { gap: 10px; }

/* ═══════════════════════════════════════════════════════════════
   18. FAQ
   ═══════════════════════════════════════════════════════════════ */
.our-faqs .accordion-item {
    border: 1.5px solid var(--cream-dark) !important;
    border-radius: var(--radius-md) !important;
    margin-bottom: 12px !important;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}
.our-faqs .accordion-button {
    color: var(--indigo) !important;
    font-weight: 700 !important;
    background: var(--white) !important;
    font-size: 15px !important;
    padding: 20px 24px !important;
    font-family: var(--font);
}
.our-faqs .accordion-button:not(.collapsed) {
    color: var(--indigo) !important;
    background: var(--cream) !important;
    box-shadow: none !important;
}
.our-faqs .accordion-button:focus { box-shadow: none !important; }
.our-faqs .accordion-body {
    padding: 16px 24px 20px !important;
    background: var(--cream-light);
}
.our-faqs .accordion-body p {
    color: var(--gray) !important;
    margin: 0 !important;
    font-size: 14.5px !important;
    line-height: 1.78 !important;
}

/* ═══════════════════════════════════════════════════════════════
   19. FOOTER
   ═══════════════════════════════════════════════════════════════ */

/* CTA Band */
.os-footer-cta {
    background: var(--indigo);
    padding: 56px 0;
    position: relative;
    overflow: hidden;
}
.os-footer-cta::before {
    content: '';
    position: absolute;
    right: -80px; top: -80px;
    width: 300px; height: 300px;
    border-radius: 50%;
    background: rgba(239,238,234,0.04);
}
.os-footer-cta::after {
    content: '';
    position: absolute;
    left: -50px; bottom: -50px;
    width: 200px; height: 200px;
    border-radius: 50%;
    background: rgba(61,48,168,0.20);
}
.os-footer-cta .container { position: relative; z-index: 1; }
.os-footer-cta h2 {
    color: var(--white) !important;
    font-size: clamp(22px, 2.5vw, 34px);
    font-weight: 800;
    margin-bottom: 8px;
    line-height: 1.2;
}
.os-footer-cta p {
    color: rgba(239,238,234,0.80);
    font-size: 15px;
    margin: 0;
    line-height: 1.6;
}
.os-footer-cta-btn {
    background: var(--cream);
    color: var(--indigo) !important;
    border-radius: var(--radius-md);
    padding: 15px 34px;
    font-weight: 800;
    font-size: 15px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    transition: all 0.28s var(--ease);
    box-shadow: 0 4px 20px rgba(0,0,0,0.12);
    letter-spacing: 0.02em;
}
.os-footer-cta-btn:hover {
    background: var(--white);
    color: var(--indigo) !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(0,0,0,0.18);
}

/* Footer body */
.main-footer {
    background: var(--indigo-dark) !important;
    padding-top: 0 !important;
    border-top: none !important;
}
.os-footer-body { padding: 68px 0 44px; }

/* Brand */
.os-footer-brand img {
    height: 70px;
    border-radius: var(--radius-md);
    margin-bottom: 20px;
}
.os-footer-brand p {
    color: rgba(239,238,234,0.55);
    font-size: 14px;
    line-height: 1.78;
    margin-bottom: 22px;
}

/* Social icons */
.os-footer-social { display: flex; gap: 10px; }
.os-footer-social a {
    width: 38px;
    height: 38px;
    border-radius: var(--radius-sm);
    background: rgba(239,238,234,0.06);
    border: 1px solid rgba(239,238,234,0.10);
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(239,238,234,0.50);
    font-size: 15px;
    text-decoration: none;
    transition: all 0.22s var(--ease);
}
.os-footer-social a:hover {
    background: var(--cream);
    border-color: var(--cream);
    color: var(--indigo);
    transform: translateY(-2px);
}

/* Footer columns */
.os-footer-col h4 {
    color: var(--cream) !important;
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 24px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(239,238,234,0.06);
    position: relative;
    opacity: 0.90;
}
.os-footer-col h4::after {
    content: '';
    position: absolute;
    bottom: -1px; left: 0;
    width: 36px; height: 2px;
    background: var(--cream);
    opacity: 0.35;
    border-radius: 2px;
}
.os-footer-links { list-style: none; padding: 0; margin: 0; }
.os-footer-links li { margin-bottom: 10px; }
.os-footer-links a {
    color: rgba(239,238,234,0.48);
    font-size: 14px;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
}
.os-footer-links a::before {
    content: '›';
    font-size: 16px;
    color: var(--cream);
    opacity: 0.35;
    line-height: 1;
    transition: transform 0.2s;
}
.os-footer-links a:hover { color: var(--cream); padding-left: 4px; }
.os-footer-links a:hover::before { transform: translateX(3px); opacity: 0.70; }

/* Footer contact */
.os-footer-contact-item {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 16px;
    color: rgba(239,238,234,0.50);
    font-size: 14px;
    line-height: 1.6;
}
.os-footer-contact-item i {
    color: var(--cream);
    font-size: 16px;
    margin-top: 2px;
    flex-shrink: 0;
    opacity: 0.55;
}
.os-footer-contact-item a { color: rgba(239,238,234,0.50); text-decoration: none; transition: color 0.2s; }
.os-footer-contact-item a:hover { color: var(--cream); }

/* Footer bottom */
.os-footer-bottom {
    border-top: 1px solid rgba(239,238,234,0.05);
    padding: 22px 0;
}
.os-footer-bottom p { color: rgba(239,238,234,0.28); font-size: 13px; margin: 0; text-align: center; }
.os-footer-bottom a { color: rgba(239,238,234,0.55); text-decoration: none; transition: color 0.2s; }
.os-footer-bottom a:hover { color: var(--cream); }

/* Hide old footer */
.main-footer .footer-booking-box { display: none !important; }
.main-footer .about-footer,
.main-footer .footer-links,
.main-footer .footer-social-links,
.main-footer .footer-copyright { display: none !important; }

/* ═══════════════════════════════════════════════════════════════
   20. UTILITY OVERRIDES
   ═══════════════════════════════════════════════════════════════ */
.section-title h2, .section-title h3 { color: var(--indigo) !important; }
.section-title h3 {
    color: var(--gray) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
}

.service-item {
    border: 1.5px solid var(--cream-dark) !important;
    border-radius: var(--radius-lg) !important;
    transition: all 0.3s var(--ease) !important;
}
.service-item:hover {
    box-shadow: var(--shadow-md) !important;
    border-color: var(--indigo) !important;
    transform: translateY(-5px) !important;
}

/* Info card */
.os-info-card {
    background: var(--white);
    border-radius: var(--radius-lg);
    padding: 28px 26px;
    border: 1px solid var(--cream-dark);
    box-shadow: var(--shadow-sm);
    transition: all 0.3s var(--ease);
}
.os-info-card:hover {
    box-shadow: var(--shadow-md);
    border-color: var(--indigo);
    transform: translateY(-4px);
}
.os-info-card-icon {
    width: 54px;
    height: 54px;
    border-radius: var(--radius-md);
    background: var(--indigo-pale);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}
.os-info-card-icon i { color: var(--indigo); font-size: 22px; }

/* Color helpers */
.os-text-orange, .os-text-accent { color: var(--indigo) !important; }
.os-text-navy   { color: var(--indigo) !important; }
.os-text-blue   { color: var(--indigo-light) !important; }
.os-bg-orange   { background: var(--indigo) !important; }
.os-bg-navy     { background: var(--indigo) !important; }

/* Number badge */
.os-number-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px; height: 38px;
    border-radius: 50%;
    background: var(--indigo);
    color: var(--cream);
    font-size: 15px;
    font-weight: 800;
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════════
   21. PRELOADER
   ═══════════════════════════════════════════════════════════════ */
.preloader {
    background: var(--white);
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}
.loading {
    border: 3px solid var(--cream-dark);
    border-top-color: var(--indigo);
    border-radius: 50%;
    width: 42px; height: 42px;
    animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ═══════════════════════════════════════════════════════════════
   22. WHATSAPP FLOATING BUTTON
   ═══════════════════════════════════════════════════════════════ */
.wtspwrapper { left: 25px; }
.shareiconcode { position: fixed; bottom: 3%; z-index: 999 !important; }
.shareiconcode a {
    height: 52px; width: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 20px rgba(0,0,0,0.25);
    border-radius: 50%;
    background: #25D366;
    transition: transform 0.22s, box-shadow 0.22s;
}
.shareiconcode a:hover {
    transform: scale(1.1);
    box-shadow: 0 8px 28px rgba(0,0,0,0.30);
}
.shareiconcode img { max-width: 60%; max-height: 60%; }

/* ═══════════════════════════════════════════════════════════════
   23. FORMS
   ═══════════════════════════════════════════════════════════════ */
.form-control, .form-select {
    border: 1.5px solid var(--cream-dark);
    border-radius: var(--radius-sm);
    font-family: var(--font);
    color: var(--gray-dark);
    background: var(--cream-light);
    transition: border-color 0.2s, box-shadow 0.2s;
}
.form-control:focus, .form-select:focus {
    border-color: var(--indigo);
    box-shadow: 0 0 0 3px rgba(39,32,120,0.12);
    background: var(--white);
    outline: none;
}

/* ═══════════════════════════════════════════════════════════════
   24. EDUCATION PAGE (override inner styles)
   ═══════════════════════════════════════════════════════════════ */
.edu-overview { padding: 80px 0 60px; }

/* ═══════════════════════════════════════════════════════════════
   25. RESPONSIVE
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 1199px) { .os-hero { padding: 72px 0 56px; } }

@media (max-width: 991px) {
    .os-top-bar-inner { justify-content: center; }
    .os-top-bar-left  { flex-wrap: wrap; justify-content: center; }
    .os-top-bar-right { display: none; }
    .os-stats-inner   { grid-template-columns: repeat(2, 1fr); }
    .os-stat-item:nth-child(2) { border-right: none; }
    .os-about-badge   { right: 0; bottom: -16px; }
    .os-hero          { padding: 60px 0 40px; }
    .os-hero-gallery  { margin-top: 44px; }
    .page-header      { padding: 52px 0 48px; }
}
@media (max-width: 767px) {
    .os-section           { padding: 64px 0; }
    .os-stats-inner       { grid-template-columns: repeat(2, 1fr); }
    .os-hero-btns         { flex-direction: column; }
    .os-btn               { justify-content: center; }
    .os-conf-details      { gap: 16px; }
    .os-courses-grid      { grid-template-columns: 1fr; }
    .os-why-grid          { grid-template-columns: repeat(2, 1fr); }
    .os-footer-body       { padding: 52px 0 32px; }
    .os-footer-cta        { padding: 44px 0; }
    .page-header          { padding: 44px 0 40px; }
    .os-conference-banner { padding: 60px 0; }
}
@media (max-width: 575px) {
    .os-stats-inner    { grid-template-columns: 1fr 1fr; }
    .os-stat-item      { padding: 22px 12px; }
    .os-stat-item h3   { font-size: 32px; }
    .os-why-grid       { grid-template-columns: 1fr; }
    .os-hero-gallery   { grid-template-columns: 1fr; }
    .os-hero-gallery-img:nth-child(1) { grid-row: auto; min-height: 220px !important; }
    .os-hero-gallery-img:nth-child(4) { grid-column: auto; }
}

/* ═══════════════════════════════════════════════════════════════
   26. SCROLLBAR
   ═══════════════════════════════════════════════════════════════ */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--cream); }
::-webkit-scrollbar-thumb { background: var(--indigo); border-radius: 4px; opacity: 0.5; }
::-webkit-scrollbar-thumb:hover { background: var(--indigo-light); }

/* ═══════════════════════════════════════════════════════════════
   27. PRINT
   ═══════════════════════════════════════════════════════════════ */
@media print {
    .os-top-bar, .main-header, .os-footer-cta,
    .main-footer, .shareiconcode { display: none !important; }
}