/* ============================================================
   VIDASA DIGITAL BLANK THEME — main.css v1.0.0
   Theme by Vidasa Digital | vidasadigital.com
   Donate: paypal.me/vidasadgital
============================================================ */

/* ── CSS VARIABLES ── */
:root {
    --primary-color: #FF6B35;
    --primary-dark:  #0A1128;
    --primary-blue:  #1A237E;
    --text-light:    #FFFFFF;
    --text-gray:     #E0E0E0;
    --text-dark:     #333333;
    --card-bg:       rgba(255,255,255,0.06);
    --border-light:  rgba(255,255,255,0.12);
    --shadow:        0 12px 30px rgba(0,0,0,0.25);
    --header-bg:     #121C3D;
    --font-primary:  'Inter', sans-serif;
    --font-heading:  'Poppins', sans-serif;
    --transition:    all 0.3s ease;
    --section-padding: 80px 0;
}

/* Light Theme */
body.light-theme {
    --primary-dark:  #f8f9fa;
    --header-bg:     #ffffff;
    --text-light:    #333333;
    --text-gray:     #666666;
    --border-light:  rgba(0,0,0,0.1);
    --card-bg:       #ffffff;
    --shadow:        0 12px 30px rgba(0,0,0,0.08);
}

/* ── RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body {
    font-family: var(--font-primary);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6;
    color: var(--text-light);
    overflow-x: hidden;
    width: 100%;
    min-height: 100vh;
    background:
        radial-gradient(1200px 600px at 20% -10%, rgba(255,107,53,0.2), transparent 60%),
        radial-gradient(1000px 500px at 85% 10%,  rgba(26,35,126,0.35), transparent 60%),
        var(--primary-dark);
}
a   { text-decoration:none; color:inherit; transition:var(--transition); }
img { max-width:100%; height:auto; display:block; }
ul,ol { list-style:none; }

/* ── TYPOGRAPHY ── */
h1,h2,h3,h4,h5,h6 { font-family:var(--font-heading); font-weight:700; line-height:1.2; margin-bottom:1rem; }
h1 { font-size:clamp(2rem,5vw,3.5rem); }
h2 { font-size:clamp(1.75rem,4vw,3rem); }
h3 { font-size:clamp(1.5rem,3vw,2.2rem); }
h4 { font-size:clamp(1.25rem,2.5vw,1.8rem); }
h5 { font-size:clamp(1.1rem,2vw,1.4rem); }
h6 { font-size:clamp(1rem,1.5vw,1.2rem); }
p  { margin-bottom:1rem; color:var(--text-gray); }

/* ── LAYOUT ── */
.container    { width:100%; max-width:1400px; margin:0 auto; padding:0 20px; }
.full-width   { width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); }
.section      { padding:var(--section-padding); position:relative; }
.text-center  { text-align:center; }
.text-left    { text-align:left; }
.text-right   { text-align:right; }

.section-title { text-align:center; margin-bottom:50px; position:relative; }
.section-title h2 { margin-bottom:15px; }
.section-title p  { max-width:700px; margin:0 auto; }
.section-title.with-line::after { content:''; display:block; width:80px; height:3px; background:var(--primary-color); margin:20px auto 0; }

.highlight { color:var(--primary-color); font-weight:600; text-transform:uppercase; letter-spacing:2px; font-size:0.9rem; margin-bottom:15px; display:block; }

/* ── BUTTONS ── */
.btn { display:inline-block; padding:14px 35px; border-radius:8px; font-weight:600; cursor:pointer; transition:var(--transition); font-size:1rem; text-align:center; border:2px solid transparent; }
.btn-primary  { background:var(--primary-color); color:var(--primary-dark); }
.btn-primary:hover  { background:transparent; border-color:var(--primary-color); color:var(--primary-color); transform:translateY(-3px); box-shadow:0 10px 25px rgba(255,107,53,0.3); }
.btn-secondary { background:transparent; border:2px solid var(--primary-color); color:var(--text-light); }
.btn-secondary:hover { background:var(--primary-color); color:var(--primary-dark); transform:translateY(-3px); }
.btn-group { display:flex; gap:15px; flex-wrap:wrap; }

/* ── HEADER ── */
.header { background:var(--header-bg); position:fixed; top:0; left:0; right:0; z-index:1000; border-bottom:1px solid var(--border-light); transition:var(--transition); }
.header.scrolled { background:rgba(18,28,61,0.95); backdrop-filter:blur(10px); box-shadow:0 6px 20px rgba(0,0,0,0.2); }
.light-theme .header.scrolled { background:rgba(255,255,255,0.95); }
.header-container { display:flex; justify-content:space-between; align-items:center; padding:15px 20px; max-width:1600px; margin:0 auto; gap:20px; }

/* LOGO */
.logo { font-family:var(--font-heading); font-size:28px; font-weight:800; white-space:nowrap; }
.logo span { color:var(--primary-color); }
.logo a { color:var(--text-light); }
.logo img { max-height:52px; width:auto; }
.custom-logo-link img { max-height:52px; width:auto; }

/* DESKTOP NAV — hidden until user assigns a menu */
.desktop-nav { flex:1; display:none; width:100%; justify-content:center; }
.desktop-nav.has-menu { display:flex !important; justify-content:center; }
.main-menu { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.main-menu li { position:relative; }
.main-menu li a { display:block; padding:10px 18px; font-weight:500; color:var(--text-gray); border-radius:6px; transition:var(--transition); }
.main-menu li a:hover,
.main-menu li.current-menu-item > a,
.main-menu li.current-menu-ancestor > a { color:var(--primary-color); background:rgba(255,255,255,0.05); }
.main-menu li.menu-item-has-children > a::after { content:'\f107'; font-family:'Font Awesome 6 Free'; font-weight:900; margin-left:8px; font-size:0.9rem; }

/* Dropdown */
.sub-menu { position:absolute; top:100%; left:0; min-width:220px; background:var(--header-bg); border:1px solid var(--border-light); border-radius:8px; opacity:0; visibility:hidden; transform:translateY(20px); transition:var(--transition); z-index:1100; box-shadow:var(--shadow); }
.main-menu li:hover > .sub-menu { opacity:1; visibility:visible; transform:translateY(10px); }
.sub-menu li { width:100%; }
.sub-menu li a { padding:12px 20px; white-space:nowrap; }
.sub-menu .sub-menu { left:100%; top:0; }

/* HEADER RIGHT */
.header-right { display:flex; gap:12px; align-items:center; }
.header-icon { width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,0.1); cursor:pointer; transition:var(--transition); color:var(--text-gray); border:1px solid var(--border-light); text-decoration:none; }
.header-icon:hover { background:var(--primary-color); color:var(--primary-dark); transform:translateY(-2px); }
.cart-badge { position:relative; }
.badge { position:absolute; top:-5px; right:-5px; min-width:18px; height:18px; border-radius:50px; background:var(--primary-color); color:var(--primary-dark); display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; padding:0 3px; }

/* HAMBURGER — shown on mobile */









/* MOBILE MENU — hidden until menu items added */
.mobile-menu { position:fixed; top:0; left:-100%; width:min(400px,85%); height:100vh; background:var(--header-bg); z-index:2000; transition:left 0.3s ease; overflow-y:auto; box-shadow:5px 0 15px rgba(0,0,0,0.3); display:none; }
.mobile-menu.active { left:0; }
.mobile-menu-header { display:flex; justify-content:space-between; align-items:center; padding:20px; border-bottom:1px solid var(--border-light); }
.mobile-logo { font-family:var(--font-heading); font-size:22px; font-weight:700; }
.mobile-logo span { color:var(--primary-color); }
.close-menu { width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,0.1); cursor:pointer; font-size:20px; }
.mobile-nav { display:flex; flex-direction:column; padding:10px 0; }
.mobile-nav-link { display:block; padding:15px 20px; border-bottom:1px solid var(--border-light); font-size:16px; color:var(--text-gray); transition:var(--transition); }
.mobile-nav-link:hover { background:rgba(255,255,255,0.05); color:var(--primary-color); padding-left:30px; }
.mobile-submenu-toggle { display:flex; justify-content:space-between; align-items:center; padding:15px 20px; border-bottom:1px solid var(--border-light); cursor:pointer; color:var(--text-gray); }
.mobile-submenu-toggle i { transition:transform 0.3s; }
.mobile-submenu-toggle.active i { transform:rotate(180deg); }
.mobile-submenu { display:none; background:rgba(0,0,0,0.2); }
.mobile-submenu a { display:block; padding:12px 20px 12px 40px; color:var(--text-gray); font-size:14px; border-bottom:1px solid rgba(255,255,255,0.05); position:relative; }
.mobile-submenu a::before { content:"•"; color:var(--primary-color); position:absolute; left:20px; }

/* MENU OVERLAY */
.menu-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:1500; opacity:0; visibility:hidden; transition:var(--transition); display:none; }
.menu-overlay.active { opacity:1; visibility:visible; }

/* ── HERO ── */
.hero {
    min-height:100vh;
    display:flex; align-items:center; justify-content:center;
    padding-top:100px;
    background: transparent;
}
.hero-content { max-width:900px; margin:0 auto; text-align:center; padding:0 20px; }
.hero-content h1 { color:var(--text-light); }
.hero-content p   { color:var(--text-gray); }
.hero-subtitle    { font-size:1.1rem; margin-bottom:30px; }
.hero-buttons     { display:flex; gap:15px; justify-content:center; flex-wrap:wrap; margin-top:10px; }

/* ── SETUP PANEL — only on home page, disappears when user has content ── */
.home-welcome {
    text-align:center;
    padding:70px 20px 80px;
    max-width:900px;
    margin:0 auto;
}
.home-welcome h2 { color:var(--primary-color); margin-bottom:16px; }
.home-welcome > p { font-size:1.15rem; margin-bottom:10px; }

.setup-badge {
    display:inline-flex; align-items:center; gap:8px;
    background:rgba(255,107,53,0.12); border:1px solid rgba(255,107,53,0.3);
    color:var(--primary-color); padding:7px 18px; border-radius:50px;
    font-size:0.8rem; font-weight:700; letter-spacing:2px; text-transform:uppercase;
    margin-bottom:22px;
}

.setup-instructions {
    background:var(--card-bg);
    border-radius:12px; padding:34px;
    margin-top:38px; border:1px solid var(--border-light);
    text-align:left;
}
.setup-instructions h3 { color:var(--primary-color); margin-bottom:22px; }
.setup-instructions ul { padding-left:0; }
.setup-instructions li {
    margin-bottom:14px;
    color:var(--text-gray);
    padding-left:22px;
    position:relative;
    font-size:0.95rem;
    line-height:1.6;
}
.setup-instructions li::before { content:"›"; color:var(--primary-color); font-weight:700; position:absolute; left:0; }
.setup-instructions code { background:rgba(255,255,255,0.1); padding:2px 7px; border-radius:4px; font-family:monospace; font-size:0.85rem; }
.setup-instructions strong { color:var(--text-light); }
.setup-note { margin-top:22px; padding:14px 18px; background:rgba(255,107,53,0.1); border:1px solid rgba(255,107,53,0.25); border-radius:8px; font-size:0.9rem; color:var(--primary-color); display:flex; align-items:center; gap:10px; }
.setup-note i { flex-shrink:0; }

/* ── FOOTER — hidden until widgets added ── */
.footer { background:var(--header-bg); padding:60px 0 20px; border-top:1px solid var(--border-light); display:none; }
.footer-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); gap:40px; margin-bottom:40px; }
.footer-widget-title { font-size:1.2rem; margin-bottom:20px; position:relative; padding-bottom:10px; }
.footer-widget-title::after { content:''; position:absolute; bottom:0; left:0; width:40px; height:2px; background:var(--primary-color); }
.footer-links li { margin-bottom:10px; }
.footer-links a { color:var(--text-gray); transition:var(--transition); }
.footer-links a:hover { color:var(--primary-color); padding-left:5px; }
.footer-bottom { text-align:center; padding-top:30px; border-top:1px solid var(--border-light); color:var(--text-gray); font-size:0.9rem; }
.footer-credit { margin-top:6px; font-size:0.82rem; }
.footer-credit a { color:var(--primary-color); }

/* ── MOBILE BOTTOM ACTIONS — hidden until configured ── */
.mobile-actions {
    position:fixed; left:12px; right:12px; bottom:12px;
    z-index:9999; display:none;
    gap:8px; padding:8px; border-radius:50px;
    background:rgba(10,17,40,0.9);
    border:1px solid rgba(255,255,255,0.14);
    backdrop-filter:blur(10px);
    box-shadow:0 18px 50px rgba(0,0,0,0.35);
}
.mobile-actions a { flex:1; display:flex; align-items:center; justify-content:center; gap:8px; padding:12px 8px; border-radius:50px; color:var(--text-light); background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.12); font-weight:600; font-size:14px; transition:var(--transition); }
.mobile-actions a:hover { background:rgba(255,255,255,0.2); }
.mobile-actions a.primary-action { background:var(--primary-color); color:var(--primary-dark); border-color:transparent; }
.mobile-actions a.primary-action:hover { background:#e05520; }

/* ── SCROLL-TO-TOP — square, orange, right side above mobile bar ── */
.go-top {
    position:fixed; right:18px; bottom:82px; z-index:9990;
    width:46px; height:46px; border-radius:10px;
    background:var(--primary-color); color:#fff;
    border:none; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    font-size:1.1rem; transition:var(--transition);
    box-shadow:0 8px 24px rgba(255,107,53,0.4);
    opacity:0; visibility:hidden;
}
.go-top.visible { opacity:1; visibility:visible; }
.go-top:hover   { background:#e05520; transform:translateY(-4px); }

/* ── GDPR POPUP — hidden until enabled ── */
.gdpr-popup { position:fixed; bottom:20px; left:20px; max-width:350px; background:var(--header-bg); padding:20px; border-radius:12px; box-shadow:var(--shadow); z-index:10000; border:1px solid var(--border-light); display:none; }
.gdpr-popup.active { display:block; }
.gdpr-content p { margin-bottom:15px; font-size:0.9rem; }
.gdpr-buttons { display:flex; gap:10px; }
.gdpr-btn { padding:8px 20px; border-radius:6px; font-size:0.9rem; font-weight:500; cursor:pointer; border:none; transition:var(--transition); }
.gdpr-accept  { background:var(--primary-color); color:var(--primary-dark); }
.gdpr-accept:hover { background:#e05520; }
.gdpr-decline { background:rgba(255,255,255,0.1); color:var(--text-gray); border:1px solid var(--border-light) !important; }
.gdpr-decline:hover { background:rgba(255,255,255,0.15); }

/* ── RESPONSIVE ── */
@media (max-width:768px) {
    .section { padding:60px 0; }
    .hero-buttons .btn { width:100%; }
    .home-welcome { padding:50px 20px; }
}
@media (max-width:576px) {
    .btn-group { flex-direction:column; }
    .header-icon { width:38px; height:38px; }
    .logo { font-size:22px; }
}

/* ═══════════════════════════════════════════
   VIDASA DIGITAL — Header Social Icons
   ═══════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════
   VIDASA DIGITAL v2.3.0 — Complete Header Styles
   ═══════════════════════════════════════════════════════════════ */

/* ── Header wrapper ── */
.header {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 1000;
    width: 100%;
    transition: box-shadow 0.3s ease;
}
.header.scrolled { box-shadow: 0 4px 24px rgba(0,0,0,0.4); }

/* ══════════════════════════════════════
   ROW 1 — TOP BAR
   DESKTOP: socials RIGHT + toggle far right
   MOBILE:  socials CENTER + toggle RIGHT
══════════════════════════════════════ */
.vd-topbar {
    background: rgba(10,17,40,0.97);
    border-bottom: 1px solid rgba(255,255,255,0.07);
    width: 100%;
}
.vd-topbar-inner {
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 24px;
    height: 42px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
}

/* Desktop: left spacer pushes socials to right */
.vd-topbar-left { flex: 1; }

/* Social icons group */
.vd-topbar-center {
    display: flex;
    align-items: center;
    gap: 7px;
}

/* Dark/light toggle */
.vd-topbar-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

/* Social icon circles */
.vd-soc-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--primary-color, #FF6B35);
    color: #fff !important;
    font-size: 12px;
    text-decoration: none;
    flex-shrink: 0;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.vd-soc-icon:hover {
    transform: translateY(-2px) scale(1.1);
    box-shadow: 0 4px 14px rgba(255,107,53,0.5);
}

/* Dark/light toggle */
.vd-theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    color: rgba(255,255,255,0.75);
    font-size: 12px;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.2s, color 0.2s, transform 0.2s;
}
.vd-theme-toggle:hover {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
    transform: rotate(20deg);
}

/* ══════════════════════════════════════
   ROW 2 — MAIN BAR
   Logo LEFT | Nav CENTER | Icons RIGHT
══════════════════════════════════════ */
.vd-mainbar {
    background: var(--header-bg, #121C3D);
    border-bottom: 1px solid var(--border-light);
    width: 100%;
}
.header-container {
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 24px;
    min-height: 68px;
    display: flex;
    align-items: center;
    gap: 20px;
}

/* Nav wrapper — stacks 2 menu rows */
.vd-nav-wrap {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
}

/* Desktop nav rows */
.desktop-nav {
    display: none;
    width: 100%;
    justify-content: center;
}
.desktop-nav.has-menu { display: flex !important; }

/* Secondary nav — slightly smaller */
.desktop-nav-secondary .main-menu-secondary > li > a {
    font-size: 0.85rem;
    padding: 6px 14px;
    color: rgba(255,255,255,0.7);
}
.desktop-nav-secondary .main-menu-secondary > li > a:hover {
    color: var(--primary-color);
}

/* Right icons */
.header-right {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-shrink: 0;
}
.header-icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.08);
    cursor: pointer;
    transition: var(--transition);
    color: var(--text-gray);
    border: 1px solid var(--border-light);
    text-decoration: none;
    position: relative;
    flex-shrink: 0;
}
.header-icon:hover {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
    transform: translateY(-2px);
}
.cart-badge .badge {
    position: absolute;
    top: -4px; right: -4px;
    background: var(--primary-color);
    color: #fff;
    border-radius: 50%;
    width: 17px; height: 17px;
    font-size: 10px;
    font-weight: 700;
    display: flex; align-items: center; justify-content: center;
    border: 2px solid var(--primary-dark, #0A1128);
}

/* ══════════════════════════════════════
   HAMBURGER — NO CIRCLE, NO BACKGROUND
   Plain 3 lines only. Both desktop & mobile.
══════════════════════════════════════ */
.menu-toggle {
    display: none !important;
    width: 28px;
    height: 20px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    cursor: pointer;
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 0;
    flex-shrink: 0;
}
.menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--text-light, #fff);
    border-radius: 2px;
    transition: all 0.3s ease;
    pointer-events: none;
}
.menu-toggle:hover span { background: var(--primary-color); }
.menu-toggle.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 7px); }
.menu-toggle.active span:nth-child(2) { opacity: 0; width: 0; }
.menu-toggle.active span:nth-child(3) { transform: rotate(-45deg) translate(5px, -7px); }

/* Mobile nav divider between primary and secondary */
.mobile-nav-divider {
    height: 1px;
    background: var(--border-light);
    margin: 8px 20px;
}

/* ══════════════════════════════════════
   BODY PADDING for fixed header
   topbar 42px + mainbar ~68px = 110px
══════════════════════════════════════ */
body { padding-top: 110px; }

/* ══════════════════════════════════════
   HERO — up to 5 buttons
══════════════════════════════════════ */
.hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin-top: 28px;
}

/* ══════════════════════════════════════
   MOBILE — max 768px
══════════════════════════════════════ */
@media (max-width: 768px) {

    body { padding-top: 100px; }

    /* Top bar: use grid so socials are truly centered */
    .vd-topbar-inner {
        display: grid;
        grid-template-columns: 1fr auto 1fr;
        padding: 0 16px;
    }
    .vd-topbar-left  { /* empty left spacer */ }
    .vd-topbar-center { justify-content: center; }
    .vd-topbar-right  { justify-content: flex-end; margin-left: 0; }

    /* Bigger social icons on mobile */
    .vd-soc-icon {
        width: 38px;
        height: 38px;
        font-size: 15px;
    }
    .vd-theme-toggle {
        width: 34px;
        height: 34px;
        font-size: 13px;
    }

    /* Main bar */
    .header-container { padding: 0 16px; min-height: 60px; }

    /* Hide desktop nav on mobile */
    .vd-nav-wrap { display: none !important; }
    .desktop-nav, .desktop-nav.has-menu { display: none !important; }

    /* Show hamburger on mobile — NO circle */
    .menu-toggle {
        display: flex !important;
        background: none !important;
        border: none !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }
}

/* ═══════════════════════════════════════════════════════════════
   VIDASA DIGITAL — Advertisement Slots
   ═══════════════════════════════════════════════════════════════ */

/* Wrapper for all ads in a position */
.vd-ads-wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

/* Below header — flush full-width, no extra padding */
.vd-ads-below_header {
    background: rgba(0, 0, 0, 0.18);
    border-bottom: 1px solid var(--border-light);
    padding: 10px 0;
}

/* Between content — inside page flow */
.vd-ads-between_content {
    padding: 20px 0;
    border-top: 1px solid var(--border-light);
    border-bottom: 1px solid var(--border-light);
    margin: 0 0 8px;
}

/* Above footer — just before footer */
.vd-ads-above_footer {
    padding: 20px 0;
    border-top: 1px solid var(--border-light);
    background: rgba(0, 0, 0, 0.12);
}

/* Individual slot */
.vd-ad-slot {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 1200px;
    padding: 0 20px;
    overflow: hidden;
}

/* Make sure iframes/banners are responsive */
.vd-ad-slot iframe,
.vd-ad-slot img,
.vd-ad-slot ins {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Light theme adjustments */
.light-theme .vd-ads-below_header  { background: rgba(0,0,0,0.04); }
.light-theme .vd-ads-above_footer  { background: rgba(0,0,0,0.04); }

/* ══════════════════════════════════════════
   HERO SLIDER
══════════════════════════════════════════ */
.hero-slider-wrap {
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 100px;
    background: #0A1128;
    isolation: isolate;
}

.hero-slides {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.hero-slide {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 0;
    transition: opacity 1.5s ease;
    transform: scale(1.05);
    will-change: opacity, transform;
}

.hero-slide.active {
    opacity: 1;
    transform: scale(1);
    transition: opacity 1.5s ease, transform 7s ease;
}

/* Dark overlay on top of slides — light enough to see images, dark enough for readable text */
.hero-overlay {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        to bottom,
        rgba(10,17,40,0.30) 0%,
        rgba(10,17,40,0.45) 60%,
        rgba(10,17,40,0.60) 100%
    );
    z-index: 2;
}

/* Fallback when no slider images — use default bg */
.hero-slider-wrap:not(:has(.hero-slides .hero-slide)) {
    background:
        linear-gradient(rgba(10,17,40,0.85), rgba(10,17,40,0.92)),
        url('https://images.unsplash.com/photo-1462331940025-496dfbfc7564?auto=format&fit=crop&w=1910&q=80') center/cover no-repeat;
}

/* Dots */
.hero-dots {
    position: absolute;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 3;
}

.hero-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.5);
    background: transparent;
    cursor: pointer;
    transition: background 0.3s, border-color 0.3s, transform 0.3s;
    padding: 0;
}

.hero-dot.active,
.hero-dot:hover {
    background: var(--primary-color, #FF6B35);
    border-color: var(--primary-color, #FF6B35);
    transform: scale(1.2);
}

/* Arrows */
.hero-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.25);
    color: #fff;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    font-size: 1.2rem;
    cursor: pointer;
    transition: background 0.3s, transform 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(6px);
}

.hero-arrow:hover {
    background: var(--primary-color, #FF6B35);
    border-color: var(--primary-color, #FF6B35);
}

.hero-prev { left: 20px; }
.hero-next { right: 20px; }

@media (max-width: 600px) {
    .hero-arrow { width: 36px; height: 36px; font-size: 1rem; }
    .hero-prev  { left: 10px; }
    .hero-next  { right: 10px; }
}

/* ══════════════════════════════════════════
   VIDASA HERO SLIDER SHORTCODE
══════════════════════════════════════════ */
.vidasa-hero-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #0A1128;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vhs-slide {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 0;
    transition: opacity 1.5s ease;
    z-index: 1;
}

.vhs-slide.active {
    opacity: 1;
}

.vhs-overlay {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    z-index: 2;
    pointer-events: none;
}

.vhs-content {
    position: relative;
    z-index: 10;
    text-align: center;
    color: #fff;
    width: 90%;
    max-width: 900px;
    padding: 20px;
}

.vhs-title {
    font-size: clamp(2rem, 5vw, 4rem);
    font-weight: 800;
    color: #fff !important;
    margin-bottom: 16px;
    text-shadow: 0 2px 12px rgba(0,0,0,0.5);
    font-family: var(--font-heading, 'Poppins', sans-serif);
}

.vhs-subtitle {
    font-size: clamp(1rem, 2vw, 1.3rem);
    color: #E0E0E0 !important;
    margin-bottom: 28px;
}

.vhs-buttons {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 10px;
}

.vhs-btn {
    padding: 14px 32px;
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-block;
}

.vhs-btn-primary {
    background: var(--primary-color, #FF6B35);
    color: #fff;
    border: 2px solid var(--primary-color, #FF6B35);
}
.vhs-btn-primary:hover {
    background: #e85a24;
    border-color: #e85a24;
    transform: translateY(-2px);
    color: #fff;
}

.vhs-btn-secondary {
    background: transparent;
    color: #fff;
    border: 2px solid #fff;
}
.vhs-btn-secondary:hover {
    background: #fff;
    color: #0A1128;
    transform: translateY(-2px);
}

/* Dots */
.vhs-dots {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
}

.vhs-dot {
    width: 12px; height: 12px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.6);
    background: transparent;
    cursor: pointer;
    padding: 0;
    transition: all 0.3s ease;
}

.vhs-dot.active,
.vhs-dot:hover {
    background: var(--primary-color, #FF6B35);
    border-color: var(--primary-color, #FF6B35);
    transform: scale(1.3);
}

/* Arrows */
.vhs-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.3);
    color: #fff;
    width: 48px; height: 48px;
    border-radius: 50%;
    font-size: 1.2rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    backdrop-filter: blur(6px);
}

.vhs-arrow:hover {
    background: var(--primary-color, #FF6B35);
    border-color: var(--primary-color, #FF6B35);
}

.vhs-prev { left: 20px; }
.vhs-next { right: 20px; }

@media (max-width: 600px) {
    .vhs-arrow { width: 36px; height: 36px; font-size: 1rem; }
    .vhs-prev { left: 10px; }
    .vhs-next { right: 10px; }
}