/* ==========================================================================
   Website design styles – chosen in Admin → Appearance → Design Style.
   Each style is a body class (style-glass, style-elegant, style-minimal, style-bold)
   and works with every colour theme. "Classic" uses front.css only.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. MODERN GLASS – rounded, airy, frosted navigation, floating cards
   -------------------------------------------------------------------------- */
body.style-glass { --sr: 18px; background: linear-gradient(180deg, var(--bg) 0%, color-mix(in srgb, var(--primary) 4%, var(--bg)) 100%); }
body.style-glass .main-nav {
    background: rgba(255, 255, 255, .86); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    box-shadow: 0 10px 30px rgba(15, 23, 42, .08); border-bottom: 1px solid rgba(15, 23, 42, .06);
}
body.style-glass .nav-menu > li > a { color: var(--ink); font-weight: 600; margin: 8px 0; padding: 8px 12px; border-radius: 30px; }
body.style-glass .nav-menu > li.active > a, body.style-glass .nav-menu > li:hover > a { background: var(--primary); color: #fff; box-shadow: 0 6px 16px color-mix(in srgb, var(--primary) 35%, transparent); }
body.style-glass .nav-menu > li.active > a { box-shadow: 0 6px 16px color-mix(in srgb, var(--primary) 35%, transparent); }
body.style-glass .nav-search { color: var(--ink); border-radius: 50%; }
body.style-glass .nav-search:hover { color: #fff; }
body.style-glass .sub-menu { border-radius: 16px; border-top: 0; margin-top: 4px; box-shadow: 0 20px 44px rgba(15, 23, 42, .16); padding: 8px; }
body.style-glass .sub-menu a { border-radius: 10px; }
body.style-glass.theme-dark .main-nav { background: rgba(15, 23, 42, .86); border-bottom-color: rgba(255, 255, 255, .06); }
body.style-glass.theme-dark .nav-menu > li > a, body.style-glass.theme-dark .nav-search { color: #e6ebf3; }

body.style-glass .vm-box, body.style-glass .leader-v3, body.style-glass .ql-row, body.style-glass .award-card,
body.style-glass .prog-card, body.style-glass .mgmt-card, body.style-glass .news-card, body.style-glass .content-card,
body.style-glass .side-card, body.style-glass .contact-info-card, body.style-glass .ticker, body.style-glass .g-item {
    border-radius: var(--sr); border-color: transparent; box-shadow: 0 12px 32px rgba(15, 23, 42, .08);
}
body.style-glass .ql-row { border-radius: 12px; }
body.style-glass .sec-icon {
    width: 46px; height: 46px; border-radius: 14px; display: inline-grid; place-items: center; font-size: 20px; color: #fff;
    background: linear-gradient(135deg, var(--primary), var(--secondary)); box-shadow: 0 8px 18px color-mix(in srgb, var(--primary) 35%, transparent);
}
body.style-glass .btn-hero-1, body.style-glass .btn-hero-2, body.style-glass .btn-outline-c,
body.style-glass .btn-primary-c, body.style-glass .btn-accent { border-radius: 40px; }
body.style-glass .c-nav { width: 40px; height: 40px; box-shadow: 0 8px 20px rgba(15, 23, 42, .15); border: 0; }
body.style-glass .page-banner { border-radius: 0 0 32px 32px; }
body.style-glass .site-footer { border-radius: 32px 32px 0 0; margin-top: 40px; }
body.style-glass .stats-band { background: transparent; }
body.style-glass .stats-band::before { display: none; }
body.style-glass .stats-band .container-xxl {
    background: linear-gradient(120deg, var(--secondary), color-mix(in srgb, var(--secondary) 70%, var(--primary)));
    border-radius: 22px; padding-top: 18px; padding-bottom: 18px; box-shadow: 0 18px 40px rgba(15, 23, 42, .18);
}
@media (min-width: 992px) {
    body.style-glass .hero-v3 .hero-swiper { border-radius: 0 0 36px 36px; height: 580px; }
    body.style-glass .hero-v3 .hero-title { font-size: 42px; }
    body.style-glass .hero-v3 .hero-desc { font-size: 15px; margin-bottom: 22px; }
    html:lang(mr) body.style-glass .hero-v3 .hero-title, html:lang(hi) body.style-glass .hero-v3 .hero-title { font-size: 38px; }
    body.style-glass .hero-v3 .hero-content {
        max-width: 540px; height: auto; top: calc(50% - 22px); transform: translateY(-50%); padding: 26px 30px 28px; border-radius: 24px;
        background: rgba(255, 255, 255, .1); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, .28); box-shadow: 0 20px 50px rgba(0, 0, 0, .18);
    }
    body.style-glass .hero-v3 .hero-slide::before {
        background: linear-gradient(90deg, color-mix(in srgb, var(--primary) 75%, transparent) 0%, color-mix(in srgb, var(--primary) 35%, transparent) 45%, transparent 70%);
    }
    body.style-glass .stats-band { margin-top: -44px; position: relative; z-index: 4; padding: 0; }
    body.style-glass .hero-v3 .hero-pagination { bottom: 62px !important; }
}

/* --------------------------------------------------------------------------
   2. ELEGANT GRADIENT – rich gradients, gold accents, refined headings
   -------------------------------------------------------------------------- */
body.style-elegant .topbar { background: color-mix(in srgb, var(--secondary) 92%, #000); }
body.style-elegant .brand-header {
    background: radial-gradient(circle at 15% 0%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 45%), linear-gradient(180deg, #fff, #fbf8f2);
}
body.style-elegant.theme-dark .brand-header { background: linear-gradient(180deg, #111a2e, #0b1120); }
body.style-elegant .main-nav { background: linear-gradient(90deg, var(--secondary) 0%, color-mix(in srgb, var(--secondary) 55%, var(--primary)) 60%, var(--primary) 100%); }
body.style-elegant .nav-menu > li > a { position: relative; }
body.style-elegant .nav-menu > li > a::after {
    content: ""; position: absolute; left: 50%; right: 50%; bottom: 7px; height: 2px; background: var(--accent); transition: left .25s, right .25s;
}
body.style-elegant .nav-menu > li.active > a, body.style-elegant .nav-menu > li:hover > a { background: rgba(255, 255, 255, .12); box-shadow: none; }
body.style-elegant .nav-menu > li.active > a::after, body.style-elegant .nav-menu > li:hover > a::after { left: 12px; right: 12px; }
body.style-elegant .nav-search:hover { background: rgba(255, 255, 255, .12); }

body.style-elegant .sec-title { position: relative; padding-bottom: 10px; font-weight: 700; }
body.style-elegant .sec-title::after {
    display: block; content: ""; position: absolute; left: 0; bottom: 0; width: 64px; height: 3px; border-radius: 3px;
    background: linear-gradient(90deg, var(--primary), var(--accent));
}
body.style-elegant .sec-icon { color: var(--accent); filter: drop-shadow(0 4px 8px color-mix(in srgb, var(--primary) 35%, transparent)); }
body.style-elegant .vm-box, body.style-elegant .leader-v3, body.style-elegant .mgmt-card, body.style-elegant .award-card,
body.style-elegant .news-card, body.style-elegant .content-card, body.style-elegant .contact-info-card {
    border: 0; border-radius: 14px; box-shadow: 0 10px 30px rgba(15, 23, 42, .08); position: relative;
}
body.style-elegant .vm-box::before, body.style-elegant .leader-v3::before, body.style-elegant .mgmt-card::before,
body.style-elegant .content-card::before, body.style-elegant .contact-info-card::before {
    content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; z-index: 3;
    background: linear-gradient(90deg, var(--primary), var(--accent), var(--secondary));
}
body.style-elegant .leader-v3, body.style-elegant .contact-info-card { overflow: hidden; }
body.style-elegant .mgmt-photo::before { display: none; }
body.style-elegant .btn-hero-1, body.style-elegant .btn-primary-c {
    background: linear-gradient(120deg, var(--primary), color-mix(in srgb, var(--primary) 50%, var(--secondary))); border-radius: 30px;
    position: relative; overflow: hidden;
}
body.style-elegant .btn-hero-1::before {
    content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; transform: skewX(-20deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .35), transparent); transition: left .6s;
}
body.style-elegant .btn-hero-1:hover::before { left: 130%; }
body.style-elegant .btn-hero-2, body.style-elegant .btn-outline-c { border-radius: 30px; }
body.style-elegant .hero-v3 .hero-title span { font-style: italic; }
body.style-elegant .stats-band { background: linear-gradient(110deg, var(--secondary), color-mix(in srgb, var(--secondary) 50%, var(--primary))); }
body.style-elegant .page-banner {
    background: linear-gradient(120deg, color-mix(in srgb, var(--primary) 88%, transparent), color-mix(in srgb, var(--secondary) 85%, transparent)), var(--banner, none) center 40%/cover;
}
body.style-elegant .page-banner h1 { font-style: italic; }
body.style-elegant .site-footer { background: linear-gradient(160deg, var(--secondary), color-mix(in srgb, var(--secondary) 75%, #000)); }
body.style-elegant .footer-bottom { background: linear-gradient(90deg, var(--primary), color-mix(in srgb, var(--primary) 60%, var(--secondary))); }
@media (min-width: 992px) {
    body.style-elegant .hero-v3 .hero-slide::before {
        background: linear-gradient(115deg, color-mix(in srgb, var(--secondary) 92%, transparent) 0%, color-mix(in srgb, var(--primary) 78%, transparent) 38%, color-mix(in srgb, var(--primary) 20%, transparent) 58%, transparent 72%);
    }
}

/* --------------------------------------------------------------------------
   3. MINIMAL CLEAN – white space, thin lines, flat cards, no heavy colour blocks
   -------------------------------------------------------------------------- */
body.style-minimal .topbar { background: var(--surface); color: var(--muted); border-bottom: 1px solid var(--border); }
body.style-minimal .topbar-left { color: var(--muted); }
body.style-minimal .topbar-right .topbar-links a { color: var(--ink); }
body.style-minimal .topbar-right .topbar-links a:hover { background: var(--primary-soft); color: var(--primary); }
body.style-minimal .topbar .text-accent, body.style-minimal .topbar-right .topbar-links a i { color: var(--primary) !important; }
body.style-minimal .lang-btn { background: transparent; color: var(--ink); border-color: var(--border); }
body.style-minimal .lang-btn .fa-globe { color: var(--primary); }
body.style-minimal .lang-btn:hover, body.style-minimal .lang-btn[aria-expanded="true"] { background: var(--primary); color: #fff; border-color: var(--primary); }
body.style-minimal .lang-btn:hover .fa-globe, body.style-minimal .lang-btn[aria-expanded="true"] .fa-globe { color: #fff; }
body.style-minimal .brand-header { background: var(--surface); border-bottom: 0; }
body.style-minimal .main-nav { background: var(--surface); box-shadow: none; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
body.style-minimal .nav-menu > li > a { color: var(--ink); font-weight: 500; box-shadow: none !important; border-bottom: 3px solid transparent; padding-bottom: 12px; }
body.style-minimal .nav-menu > li.active > a, body.style-minimal .nav-menu > li:hover > a { background: transparent; color: var(--primary); border-bottom-color: var(--primary); }
body.style-minimal .nav-menu > li.active > a i:not(.caret) { color: var(--primary); }
body.style-minimal .nav-search { color: var(--ink); }
body.style-minimal .nav-search:hover { background: var(--primary-soft); color: var(--primary); }
body.style-minimal .sub-menu { border-top-width: 2px; border-top-color: var(--primary); border-radius: 0; box-shadow: 0 12px 30px rgba(15, 23, 42, .1); }

body.style-minimal .vm-box, body.style-minimal .leader-v3, body.style-minimal .ql-row, body.style-minimal .award-card,
body.style-minimal .prog-card, body.style-minimal .mgmt-card, body.style-minimal .news-card, body.style-minimal .content-card,
body.style-minimal .side-card, body.style-minimal .contact-info-card, body.style-minimal .ticker {
    border-radius: 6px; box-shadow: none; border: 1px solid var(--border); background: var(--surface);
}
body.style-minimal .vm-box:hover, body.style-minimal .leader-v3:hover, body.style-minimal .mgmt-card:hover,
body.style-minimal .prog-card:hover, body.style-minimal .news-card:hover {
    transform: none; box-shadow: none; border-color: var(--primary);
}
body.style-minimal .prog-card { background: var(--surface); }
body.style-minimal .vm-box::after { display: none; }
body.style-minimal .vm-box { padding-bottom: 54px; }
body.style-minimal .sec-icon { display: none; }
body.style-minimal .sec-title { border-left: 4px solid var(--primary); padding-left: 12px; font-weight: 600; }
body.style-minimal .sec-sub { padding-left: 16px; color: var(--muted); opacity: 1; }
body.style-minimal .btn-hero-1, body.style-minimal .btn-hero-2, body.style-minimal .btn-outline-c { border-radius: 2px; box-shadow: none; }
body.style-minimal .c-nav { box-shadow: none; border-radius: 4px; }
body.style-minimal .stats-band { background: var(--surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
body.style-minimal .stats-band::before { display: none; }
body.style-minimal .stats-band .stat-icon, body.style-minimal .stats-band .stat-val { color: var(--primary); -webkit-text-fill-color: var(--primary); }
body.style-minimal .stats-band .stat-lbl { color: var(--muted); }
body.style-minimal .stats-band .stat { border-color: var(--border); }
body.style-minimal .page-banner { background: var(--soft); color: var(--ink); border-bottom: 1px solid var(--border); padding: 40px 0 34px; }
body.style-minimal .page-banner h1 { color: var(--heading); }
body.style-minimal .page-banner p { color: var(--muted); }
body.style-minimal .page-banner .breadcrumb a { color: var(--primary); }
body.style-minimal .page-banner .breadcrumb-item.active, body.style-minimal .page-banner .breadcrumb-item + .breadcrumb-item::before { color: var(--muted); }
body.style-minimal .site-footer { background: var(--soft); color: var(--text); border-top: 1px solid var(--border); }
body.style-minimal .site-footer .f-name, body.style-minimal .site-footer .f-title { color: var(--heading); }
body.style-minimal .site-footer .f-links a, body.style-minimal .site-footer .f-contact a, body.style-minimal .site-footer .f-contact li { color: var(--text); }
body.style-minimal .site-footer .f-links a:hover { color: var(--primary); }
body.style-minimal .site-footer .f-links a::before, body.style-minimal .site-footer .f-contact i { color: var(--primary); }
body.style-minimal .site-footer .f-title::after { background: var(--primary); }
@media (min-width: 992px) {
    body.style-minimal .hero-v3 .hero-slide::before {
        background: linear-gradient(90deg, color-mix(in srgb, var(--secondary) 88%, transparent) 0%, color-mix(in srgb, var(--secondary) 60%, transparent) 34%, transparent 60%);
    }
    body.style-minimal .hero-v3 .hero-slide::after { display: none; }
}

/* --------------------------------------------------------------------------
   4. BOLD ACADEMIC – strong colour blocks, uppercase menu, angled sections
   -------------------------------------------------------------------------- */
body.style-bold .brand-header { border-bottom: 5px solid var(--accent); }
body.style-bold .main-nav { background: var(--primary); }
body.style-bold .nav-menu > li > a { text-transform: uppercase; font-weight: 700; font-size: 12.5px; letter-spacing: .4px; }
body.style-bold .nav-menu > li.active > a, body.style-bold .nav-menu > li:hover > a { background: var(--accent); color: #1b1b1b; box-shadow: none; }
body.style-bold .nav-menu > li.active > a i:not(.caret) { color: #1b1b1b; }
body.style-bold .nav-search:hover { background: var(--accent); color: #1b1b1b; }
body.style-bold .sub-menu { border-radius: 0; border-top-width: 4px; }
html:lang(mr) body.style-bold .nav-menu > li > a, html:lang(hi) body.style-bold .nav-menu > li > a { text-transform: none; letter-spacing: 0; font-size: 14px; }

body.style-bold .sec-icon {
    width: 46px; height: 46px; display: inline-grid; place-items: center; font-size: 20px;
    background: var(--primary); color: var(--accent); box-shadow: 6px 6px 0 var(--accent);
}
body.style-bold .sec-title { text-transform: uppercase; font-weight: 900; letter-spacing: .3px; }
html:lang(mr) body.style-bold .sec-title, html:lang(hi) body.style-bold .sec-title { text-transform: none; }
body.style-bold .vm-box, body.style-bold .ql-row, body.style-bold .award-card, body.style-bold .news-card,
body.style-bold .content-card, body.style-bold .side-card, body.style-bold .contact-info-card, body.style-bold .prog-card {
    border-radius: 4px; border-left: 5px solid var(--primary);
}
body.style-bold .mgmt-card, body.style-bold .leader-v3 { border-radius: 4px; border-top: 5px solid var(--primary); }
body.style-bold .mgmt-photo::before { background: var(--primary); }
body.style-bold .vm-box:hover, body.style-bold .mgmt-card:hover, body.style-bold .news-card:hover { box-shadow: 10px 10px 0 color-mix(in srgb, var(--accent) 70%, transparent); }
body.style-bold .btn-hero-1, body.style-bold .btn-hero-2, body.style-bold .btn-outline-c, body.style-bold .btn-primary-c {
    border-radius: 0; text-transform: uppercase; font-weight: 700; letter-spacing: .5px;
}
html:lang(mr) body.style-bold .btn-hero-1, html:lang(hi) body.style-bold .btn-hero-1,
html:lang(mr) body.style-bold .btn-hero-2, html:lang(hi) body.style-bold .btn-hero-2 { text-transform: none; letter-spacing: 0; }
body.style-bold .btn-hero-1 { background: var(--accent); color: #1b1b1b; border-color: var(--accent); }
body.style-bold .btn-hero-1:hover { background: #fff; color: #1b1b1b; }
body.style-bold .c-nav { border-radius: 0; }
body.style-bold .stats-band { background: var(--secondary); border-top: 5px solid var(--accent); }
body.style-bold .stats-band::before { display: none; }
body.style-bold .stats-band .stat-val { font-size: 28px; font-weight: 900; }
body.style-bold .page-banner h1 { text-transform: uppercase; }
html:lang(mr) body.style-bold .page-banner h1, html:lang(hi) body.style-bold .page-banner h1 { text-transform: none; }
body.style-bold .site-footer { border-top: 6px solid var(--accent); }
body.style-bold .footer-bottom { background: color-mix(in srgb, var(--secondary) 80%, #000); }
@media (min-width: 992px) {
    body.style-bold .hero-v3 .hero-swiper { clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%); }
    body.style-bold .hero-v3 .hero-title { font-size: 44px; text-transform: uppercase; letter-spacing: .5px; max-width: 520px; }
    html:lang(mr) body.style-bold .hero-v3 .hero-title, html:lang(hi) body.style-bold .hero-v3 .hero-title { text-transform: none; font-size: 44px; }
    body.style-bold .hero-v3 .hero-pagination { bottom: 50px !important; }
    body.style-bold .page-banner { clip-path: polygon(0 0, 100% 0, 100% 84%, 0 100%); padding-bottom: 60px; }
}

/* --------------------------------------------------------------------------
   5. ROYAL HERITAGE – cream paper, ornamental frames, centred serif titles
   -------------------------------------------------------------------------- */
body.style-heritage { background: #fbf6ec; }
body.style-heritage .brand-header { background: linear-gradient(180deg, #fffaf0, #f7efdd); border-bottom: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); }
body.style-heritage .main-nav {
    background: var(--secondary); border-top: 3px solid var(--accent); border-bottom: 3px solid var(--accent);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), inset 0 -1px 0 rgba(255, 255, 255, .15);
}
body.style-heritage .nav-menu > li > a { font-family: var(--font-heading); font-weight: 600; letter-spacing: .3px; }
body.style-heritage .nav-menu > li.active > a, body.style-heritage .nav-menu > li:hover > a { background: transparent; color: var(--accent); box-shadow: none; }
body.style-heritage .nav-menu > li.active > a i:not(.caret) { color: var(--accent); }
body.style-heritage .sub-menu { background: #fffaf0; border-top-color: var(--accent); }
body.style-heritage .sec-head { position: relative; }
body.style-heritage .sec-icon {
    width: 46px; height: 46px; display: inline-grid; place-items: center; font-size: 19px; border-radius: 50%;
    color: var(--accent); background: var(--secondary); box-shadow: 0 0 0 3px #fbf6ec, 0 0 0 5px var(--accent);
}
body.style-heritage .sec-title { font-variant: small-caps; letter-spacing: .5px; }
body.style-heritage .vm-box, body.style-heritage .leader-v3, body.style-heritage .mgmt-card, body.style-heritage .award-card,
body.style-heritage .news-card, body.style-heritage .content-card, body.style-heritage .side-card, body.style-heritage .contact-info-card,
body.style-heritage .ql-row, body.style-heritage .ticker {
    background: #fffdf8; border: 1px solid color-mix(in srgb, var(--accent) 55%, #d8cbb0); border-radius: 4px;
    box-shadow: inset 0 0 0 4px #fffdf8, inset 0 0 0 5px color-mix(in srgb, var(--accent) 35%, transparent), 0 6px 18px rgba(80, 60, 20, .08);
}
body.style-heritage .ticker, body.style-heritage .ql-row { box-shadow: 0 4px 12px rgba(80, 60, 20, .06); }
body.style-heritage .vm-box::after { opacity: .25; }
body.style-heritage .mgmt-photo, body.style-heritage .lv-photo { margin: 8px 8px 0; border: 3px double color-mix(in srgb, var(--accent) 70%, #b89b5e); }
body.style-heritage .mgmt-photo::before { display: none; }
body.style-heritage .mgmt-name, body.style-heritage .vm-box .vm-head h2 { font-variant: small-caps; }
body.style-heritage .btn-hero-1, body.style-heritage .btn-primary-c { border-radius: 2px; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .35); }
body.style-heritage .btn-hero-2, body.style-heritage .btn-outline-c { border-radius: 2px; }
body.style-heritage .stats-band { background: var(--secondary); border-top: 3px double var(--accent); border-bottom: 3px double var(--accent); }
body.style-heritage .stats-band::before { display: none; }
body.style-heritage .page-banner { border-bottom: 4px double var(--accent); }
body.style-heritage .page-banner h1 { font-variant: small-caps; }
body.style-heritage .site-footer { border-top: 4px double var(--accent); }
body.style-heritage.theme-dark { background: var(--bg); }
body.style-heritage.theme-dark .brand-header { background: linear-gradient(180deg, #111a2e, #0b1120); }
body.style-heritage.theme-dark .vm-box, body.style-heritage.theme-dark .leader-v3, body.style-heritage.theme-dark .mgmt-card,
body.style-heritage.theme-dark .award-card, body.style-heritage.theme-dark .content-card, body.style-heritage.theme-dark .ql-row,
body.style-heritage.theme-dark .ticker, body.style-heritage.theme-dark .side-card, body.style-heritage.theme-dark .contact-info-card,
body.style-heritage.theme-dark .news-card, body.style-heritage.theme-dark .sub-menu { background: var(--surface); box-shadow: none; }
@media (min-width: 992px) {
    body.style-heritage .hero-v3 .hero-content::before {
        content: ""; position: absolute; top: 50%; left: 14px; width: calc(100% + 10px); height: 82%; transform: translateY(-55%);
        border: 1px solid color-mix(in srgb, var(--accent) 60%, transparent); outline: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
        outline-offset: 6px; pointer-events: none;
    }
    body.style-heritage .hero-v3 .hero-content { padding-left: 52px; }
}

/* --------------------------------------------------------------------------
   6. VIBRANT FRESH – playful colour, gradient cards, round shapes
   -------------------------------------------------------------------------- */
body.style-vibrant { --vr: 22px; }
body.style-vibrant .topbar { background: linear-gradient(90deg, var(--primary), color-mix(in srgb, var(--primary) 70%, var(--accent))); }
body.style-vibrant .main-nav { background: var(--surface); box-shadow: 0 8px 24px rgba(15, 23, 42, .08); border-bottom: 0; }
body.style-vibrant .nav-menu > li > a { color: var(--ink); font-weight: 600; border-radius: 14px; margin: 8px 0; padding: 8px 12px; }
body.style-vibrant .nav-menu > li.active > a, body.style-vibrant .nav-menu > li:hover > a {
    background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 55%, var(--accent))); color: #fff; box-shadow: 0 8px 18px color-mix(in srgb, var(--primary) 30%, transparent);
}
body.style-vibrant .nav-search { color: var(--ink); }
body.style-vibrant .sub-menu { border-radius: 18px; border-top: 0; padding: 8px; }
body.style-vibrant .sub-menu a { border-radius: 10px; }
body.style-vibrant .sec-icon {
    width: 48px; height: 48px; display: inline-grid; place-items: center; font-size: 20px; color: #fff; border-radius: 16px 16px 16px 4px;
    background: linear-gradient(135deg, var(--accent), var(--primary)); transform: rotate(-6deg); box-shadow: 0 8px 18px color-mix(in srgb, var(--primary) 30%, transparent);
}
body.style-vibrant .vm-box, body.style-vibrant .leader-v3, body.style-vibrant .mgmt-card, body.style-vibrant .award-card,
body.style-vibrant .news-card, body.style-vibrant .content-card, body.style-vibrant .side-card, body.style-vibrant .contact-info-card,
body.style-vibrant .prog-card, body.style-vibrant .ticker {
    border-radius: var(--vr); border: 0; box-shadow: 0 14px 34px rgba(15, 23, 42, .09);
}
body.style-vibrant .vm-box:nth-child(1) { background: linear-gradient(160deg, #fff1f2, #fff); }
body.style-vibrant .vm-box:nth-child(2) { background: linear-gradient(160deg, #eef6ff, #fff); }
body.style-vibrant .vm-box:nth-child(3) { background: linear-gradient(160deg, #f0fdf4, #fff); }
body.style-vibrant .ql-row { border-radius: 14px; border: 0; background: var(--surface); box-shadow: 0 6px 16px rgba(15, 23, 42, .07); }
body.style-vibrant .ql-row:nth-child(4n+1) .ql-ic { color: #e11d48; } body.style-vibrant .ql-row:nth-child(4n+2) .ql-ic { color: #2563eb; }
body.style-vibrant .ql-row:nth-child(4n+3) .ql-ic { color: #16a34a; } body.style-vibrant .ql-row:nth-child(4n+4) .ql-ic { color: #d97706; }
body.style-vibrant .mgmt-photo::before { width: 100%; height: 6px; background: linear-gradient(90deg, var(--primary), var(--accent), #22c55e, #3b82f6); }
body.style-vibrant .btn-hero-1, body.style-vibrant .btn-hero-2, body.style-vibrant .btn-outline-c, body.style-vibrant .btn-primary-c { border-radius: 16px; }
body.style-vibrant .btn-hero-1 { background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 45%, var(--accent))); }
body.style-vibrant .c-nav { border-radius: 14px; border: 0; }
body.style-vibrant .stats-band { background: linear-gradient(120deg, var(--secondary), var(--primary)); }
body.style-vibrant .stats-band .stat-icon { background: rgba(255, 255, 255, .14) !important; width: 56px; height: 56px; border-radius: 18px; display: grid; place-items: center; font-size: 24px; }
body.style-vibrant .page-banner { border-radius: 0 0 40px 0; }
body.style-vibrant .site-footer { border-radius: 40px 0 0 0; margin-top: 40px; }
body.style-vibrant.theme-dark .vm-box:nth-child(n) { background: var(--surface); }
@media (min-width: 992px) {
    body.style-vibrant .hero-v3 .hero-swiper { border-radius: 0 0 0 60px; }
    body.style-vibrant .hero-v3 .hero-slide::before {
        background: linear-gradient(100deg, color-mix(in srgb, var(--primary) 92%, transparent) 0%, color-mix(in srgb, var(--primary) 55%, var(--accent)) 30%, color-mix(in srgb, var(--accent) 25%, transparent) 50%, transparent 66%);
    }
}

/* --------------------------------------------------------------------------
   7. EDITORIAL MAGAZINE – newspaper typography, thin rules, black & white with one colour
   -------------------------------------------------------------------------- */
body.style-magazine .topbar { background: #111; }
body.style-magazine .brand-header { background: var(--surface); border-bottom: 1px solid #111; }
body.style-magazine .main-nav { background: var(--surface); border-bottom: 3px double #111; box-shadow: none; }
body.style-magazine .nav-menu > li > a { color: #111; font-family: var(--font-heading); font-weight: 700; font-size: 14px; }
body.style-magazine .nav-menu > li.active > a, body.style-magazine .nav-menu > li:hover > a { background: transparent; color: var(--primary); box-shadow: none; text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; }
body.style-magazine .nav-menu > li.active > a i:not(.caret) { color: var(--primary); }
body.style-magazine .nav-search { color: #111; }
body.style-magazine .nav-search:hover { background: #111; color: #fff; }
body.style-magazine .sub-menu { border-radius: 0; border-top: 2px solid #111; }
body.style-magazine .sec-head { border-top: 3px solid #111; padding-top: 12px; }
body.style-magazine .sec-icon { display: none; }
body.style-magazine .sec-title { font-size: 30px; font-weight: 900; letter-spacing: -.5px; }
body.style-magazine .sec-sub { font-style: italic; }
body.style-magazine .vm-box, body.style-magazine .leader-v3, body.style-magazine .mgmt-card, body.style-magazine .award-card,
body.style-magazine .news-card, body.style-magazine .content-card, body.style-magazine .side-card, body.style-magazine .contact-info-card,
body.style-magazine .prog-card, body.style-magazine .ql-row, body.style-magazine .ticker {
    border-radius: 0; box-shadow: none; border: 0; border-top: 2px solid #111; background: var(--surface);
}
body.style-magazine .vm-box:hover, body.style-magazine .mgmt-card:hover, body.style-magazine .prog-card:hover { transform: none; box-shadow: none; }
body.style-magazine .vm-box::after { display: none; }
body.style-magazine .vm-box { padding: 18px 4px 46px; }
body.style-magazine .vm-box .vm-head h2, body.style-magazine .mgmt-name { font-weight: 900; }
body.style-magazine .vm-link { left: 4px; }
body.style-magazine .mgmt-photo img, body.style-magazine .lv-photo img { filter: grayscale(1); transition: filter .4s, transform .6s; }
body.style-magazine .mgmt-card:hover .mgmt-photo img, body.style-magazine .leader-v3:hover .lv-photo img { filter: none; }
body.style-magazine .mgmt-photo::before { display: none; }
body.style-magazine .mgmt-body { text-align: left; align-items: flex-start; padding-left: 2px; }
body.style-magazine .mgmt-line { margin-left: 0; background: #111; }
body.style-magazine .btn-hero-1, body.style-magazine .btn-hero-2, body.style-magazine .btn-outline-c, body.style-magazine .c-nav { border-radius: 0; box-shadow: none; }
body.style-magazine .btn-outline-c { border-color: #111; color: #111; }
body.style-magazine .btn-outline-c:hover { background: #111; color: #fff; }
body.style-magazine .stats-band { background: #111; }
body.style-magazine .stats-band::before { background: var(--primary); }
body.style-magazine .page-banner { background: #111; }
body.style-magazine .page-banner h1 { font-size: 42px; letter-spacing: -.5px; }
body.style-magazine .site-footer { background: #111; }
body.style-magazine .footer-bottom { background: #000; border-top: 1px solid #333; }
body.style-magazine.theme-dark .main-nav, body.style-magazine.theme-dark .brand-header { border-color: #e6ebf3; }
body.style-magazine.theme-dark .nav-menu > li > a, body.style-magazine.theme-dark .nav-search { color: #e6ebf3; }
body.style-magazine.theme-dark .sec-head, body.style-magazine.theme-dark .vm-box, body.style-magazine.theme-dark .mgmt-card,
body.style-magazine.theme-dark .prog-card, body.style-magazine.theme-dark .ql-row, body.style-magazine.theme-dark .ticker,
body.style-magazine.theme-dark .leader-v3, body.style-magazine.theme-dark .award-card { border-top-color: #e6ebf3; }
@media (min-width: 992px) {
    body.style-magazine .hero-v3 .hero-slide::before { background: linear-gradient(0deg, rgba(0, 0, 0, .82) 0%, rgba(0, 0, 0, .45) 45%, rgba(0, 0, 0, .05) 75%); }
    body.style-magazine .hero-v3 .hero-content { justify-content: flex-end; padding-bottom: 70px; max-width: 760px; }
    body.style-magazine .hero-v3 .hero-title { max-width: 720px; font-size: 52px; }
    body.style-magazine .hero-v3 .hero-tag { background: var(--primary); color: #fff; padding: 4px 12px; letter-spacing: 1px; }
    body.style-magazine .hero-v3 .hero-tag::before { display: none; }
}

/* --------------------------------------------------------------------------
   8. DARK SPOTLIGHT – dark pages (theme-dark is added automatically) with glowing accents
   -------------------------------------------------------------------------- */
body.style-spotlight { background: radial-gradient(1200px 600px at 80% -10%, color-mix(in srgb, var(--primary) 22%, transparent), transparent 60%), var(--bg); }
body.style-spotlight .topbar { background: #050914; border-bottom: 1px solid rgba(255, 255, 255, .06); }
body.style-spotlight .main-nav { background: rgba(8, 13, 28, .92); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(255, 255, 255, .08); }
body.style-spotlight .nav-menu > li.active > a, body.style-spotlight .nav-menu > li:hover > a {
    background: transparent; color: var(--accent); box-shadow: inset 0 -3px 0 var(--accent);
}
body.style-spotlight .nav-menu > li.active > a i:not(.caret) { color: var(--accent); }
body.style-spotlight .sec-icon { color: var(--accent); filter: drop-shadow(0 0 10px color-mix(in srgb, var(--accent) 60%, transparent)); }
body.style-spotlight .sec-title { color: #fff; }
body.style-spotlight .brand-l1 { color: var(--accent); }
body.style-spotlight .vm-link, body.style-spotlight .lv-name, body.style-spotlight .mgmt-des, body.style-spotlight .vm-box .vm-head i,
body.style-spotlight .vm-values .values-list i, body.style-spotlight .ticker-ctrl button, body.style-spotlight .prog-go, body.style-spotlight .text-accent { color: var(--accent); }
body.style-spotlight .mgmt-line { background: var(--accent); }
body.style-spotlight .btn-outline-c { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 70%, transparent); background: transparent; }
body.style-spotlight .btn-outline-c:hover { background: var(--accent); color: #111; border-color: var(--accent); }
body.style-spotlight .prog-go { background: rgba(255, 255, 255, .08); box-shadow: none; }
body.style-spotlight .ticker-ctrl .t-pause, body.style-spotlight .ticker-ctrl button:hover { background: rgba(255, 255, 255, .08); }
body.style-spotlight .vm-box, body.style-spotlight .leader-v3, body.style-spotlight .mgmt-card, body.style-spotlight .award-card,
body.style-spotlight .news-card, body.style-spotlight .content-card, body.style-spotlight .side-card, body.style-spotlight .contact-info-card,
body.style-spotlight .prog-card, body.style-spotlight .ql-row, body.style-spotlight .ticker {
    background: linear-gradient(160deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .02)); border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 16px; box-shadow: 0 10px 30px rgba(0, 0, 0, .35);
}
body.style-spotlight .vm-box:hover, body.style-spotlight .mgmt-card:hover, body.style-spotlight .prog-card:hover, body.style-spotlight .ql-row:hover {
    border-color: color-mix(in srgb, var(--accent) 60%, transparent); box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 40%, transparent), 0 14px 40px color-mix(in srgb, var(--accent) 18%, transparent);
}
body.style-spotlight .ticker-ctrl { background: transparent; }
body.style-spotlight .mgmt-photo::before { background: var(--accent); box-shadow: 0 0 12px var(--accent); }
body.style-spotlight .btn-hero-1, body.style-spotlight .btn-primary-c { border-radius: 30px; box-shadow: 0 0 24px color-mix(in srgb, var(--primary) 55%, transparent); }
body.style-spotlight .btn-hero-2, body.style-spotlight .btn-outline-c { border-radius: 30px; }
body.style-spotlight .stats-band { background: transparent; border-top: 1px solid rgba(255, 255, 255, .08); border-bottom: 1px solid rgba(255, 255, 255, .08); }
body.style-spotlight .stats-band .stat-val { text-shadow: 0 0 18px color-mix(in srgb, var(--accent) 55%, transparent); }
body.style-spotlight .page-banner { box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .08); }
body.style-spotlight .site-footer { background: #050914; border-top: 1px solid rgba(255, 255, 255, .08); }
body.style-spotlight .footer-bottom { background: #02050c; }
@media (min-width: 992px) {
    body.style-spotlight .hero-v3 .hero-slide::before { background: linear-gradient(90deg, rgba(5, 9, 20, .95) 0%, rgba(5, 9, 20, .8) 32%, rgba(5, 9, 20, .25) 58%, transparent 72%); }
    body.style-spotlight .hero-v3 .hero-title span { text-shadow: 0 0 26px color-mix(in srgb, var(--accent) 55%, transparent); }
}

/* --------------------------------------------------------------------------
   9. CORPORATE PRO – crisp professional look, slim menu, card images, info strips
   -------------------------------------------------------------------------- */
body.style-corporate { background: #f5f7fa; }
body.style-corporate .topbar { background: var(--secondary); min-height: 34px; }
body.style-corporate .brand-header { background: var(--surface); box-shadow: 0 1px 0 var(--border); }
body.style-corporate .main-nav { background: var(--surface); border-bottom: 1px solid var(--border); box-shadow: 0 4px 14px rgba(15, 23, 42, .05); }
body.style-corporate .nav-menu > li > a { color: var(--ink); font-weight: 600; font-size: 13px; position: relative; }
body.style-corporate .nav-menu > li > a::before {
    content: ""; position: absolute; left: 10px; right: 10px; top: 0; height: 3px; background: var(--primary); transform: scaleX(0); transition: transform .25s;
}
body.style-corporate .nav-menu > li.active > a, body.style-corporate .nav-menu > li:hover > a { background: var(--primary-soft); color: var(--primary); box-shadow: none; }
body.style-corporate .nav-menu > li.active > a::before, body.style-corporate .nav-menu > li:hover > a::before { transform: scaleX(1); }
body.style-corporate .nav-menu > li.active > a i:not(.caret) { color: var(--primary); }
body.style-corporate .nav-search { color: var(--ink); }
body.style-corporate .nav-search:hover { background: var(--primary); color: #fff; }
body.style-corporate .sub-menu { border-radius: 8px; border-top: 0; box-shadow: 0 16px 36px rgba(15, 23, 42, .14); }
body.style-corporate .sec-icon { width: 42px; height: 42px; display: inline-grid; place-items: center; font-size: 18px; border-radius: 10px; background: var(--primary-soft); color: var(--primary); }
body.style-corporate .sec-title { font-family: var(--font-body); font-weight: 700; font-size: 23px; letter-spacing: -.2px; }
body.style-corporate .vm-box, body.style-corporate .leader-v3, body.style-corporate .mgmt-card, body.style-corporate .award-card,
body.style-corporate .news-card, body.style-corporate .content-card, body.style-corporate .side-card, body.style-corporate .contact-info-card,
body.style-corporate .ql-row, body.style-corporate .ticker {
    border-radius: 10px; border: 1px solid var(--border); box-shadow: 0 2px 6px rgba(15, 23, 42, .04); background: var(--surface);
}
body.style-corporate .vm-box:hover, body.style-corporate .mgmt-card:hover { box-shadow: 0 16px 34px rgba(15, 23, 42, .1); }
body.style-corporate .vm-box .vm-head i { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 12px; background: var(--primary-soft); font-size: 24px; filter: none; }
body.style-corporate .mgmt-photo::before { display: none; }
body.style-corporate .mgmt-body { border-top: 3px solid var(--primary); }
body.style-corporate .btn-hero-1, body.style-corporate .btn-hero-2, body.style-corporate .btn-outline-c, body.style-corporate .btn-primary-c { border-radius: 6px; }
body.style-corporate .stats-band { background: var(--surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
body.style-corporate .stats-band::before { display: none; }
body.style-corporate .stats-band .stat-icon { width: 54px !important; height: 54px !important; border-radius: 12px; display: grid; place-items: center; font-size: 24px !important; background: var(--primary-soft) !important; color: var(--primary); }
body.style-corporate .stats-band .stat-val { color: var(--ink); -webkit-text-fill-color: var(--ink); }
body.style-corporate .stats-band .stat-lbl { color: var(--muted); }
body.style-corporate .stats-band .stat { border-color: var(--border); }
body.style-corporate .site-footer { background: color-mix(in srgb, var(--secondary) 92%, #000); }
body.style-corporate.theme-dark { background: var(--bg); }
@media (min-width: 992px) {
    body.style-corporate .hero-v3 .hero-slide::before { background: linear-gradient(90deg, color-mix(in srgb, var(--secondary) 94%, transparent) 0%, color-mix(in srgb, var(--secondary) 80%, transparent) 36%, transparent 62%); }
    body.style-corporate .hero-v3 .hero-tag { background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .25); color: #fff; border-radius: 30px; padding: 5px 14px; letter-spacing: .5px; }
}
