/* ==========================================================================
   Skedmia Modern Layer — 2026 refresh
   Loaded after app.css; overrides the Rocket LMS default theme.
   Palette: ink navy / cool paper / certification green / auditor's gold.
   Type: Sora (display) + Figtree (body).
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@500;600;700&family=Figtree:wght@400;500;600;700&display=swap');

:root {
    --skd-ink: #101E3C;
    --skd-navy: #1B2E5A;
    --skd-slate: #51607C;
    --skd-paper: #F6F8FB;
    --skd-surface: #FFFFFF;
    --skd-line: #E4EAF3;
    --skd-verdict: #12B76A;
    --skd-verdict-dark: #0E9355;
    --skd-seal: #C9A227;
    --skd-seal-soft: #F6EDD4;
    --skd-radius: 14px;
    --skd-radius-sm: 10px;
    --skd-shadow-sm: 0 1px 2px rgba(16, 30, 60, .05), 0 2px 8px rgba(16, 30, 60, .05);
    --skd-shadow-md: 0 4px 14px rgba(16, 30, 60, .08), 0 12px 32px rgba(16, 30, 60, .10);
    --skd-stamp: cubic-bezier(.2, .9, .3, 1.15);
    --skd-ease: cubic-bezier(.22, .7, .3, 1);
}

/* ---------- Base ---------- */

body {
    font-family: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    background-color: var(--skd-paper);
    color: var(--skd-ink);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.section-title, .webinar-title, .stat-number {
    font-family: 'Sora', 'Figtree', sans-serif !important;
    color: var(--skd-ink);
    letter-spacing: -.015em;
}

::selection { background: var(--skd-navy); color: #fff; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--skd-paper); }
::-webkit-scrollbar-thumb { background: #C4CEDE; border-radius: 6px; border: 2px solid var(--skd-paper); }
::-webkit-scrollbar-thumb:hover { background: var(--skd-slate); }

a { transition: color .18s var(--skd-ease); }

/* ---------- Navbar: glass on scroll ---------- */

#navbar.navbar {
    background: rgba(255, 255, 255, .86);
    -webkit-backdrop-filter: saturate(160%) blur(14px);
    backdrop-filter: saturate(160%) blur(14px);
    border-bottom: 1px solid transparent;
    transition: box-shadow .3s var(--skd-ease), border-color .3s var(--skd-ease), background .3s var(--skd-ease);
}

#navbar.navbar.skd-scrolled {
    border-bottom-color: var(--skd-line);
    box-shadow: 0 6px 24px rgba(16, 30, 60, .07);
}

#navbar .nav-link {
    position: relative;
    font-weight: 500;
    color: var(--skd-ink);
}

#navbar .nav-link:not(.dropdown-toggle)::after {
    content: '';
    position: absolute;
    left: 50%; right: 50%;
    bottom: 2px;
    height: 2px;
    border-radius: 2px;
    background: var(--skd-verdict);
    transition: left .22s var(--skd-ease), right .22s var(--skd-ease);
}

#navbar .nav-item:hover .nav-link:not(.dropdown-toggle)::after,
#navbar .nav-link.active:not(.dropdown-toggle)::after { left: 18%; right: 18%; }

/* ---------- Buttons ---------- */

.btn {
    border-radius: var(--skd-radius-sm) !important;
    font-weight: 600;
    letter-spacing: .01em;
    transition: transform .22s var(--skd-stamp), box-shadow .22s var(--skd-ease),
                background-color .18s var(--skd-ease), border-color .18s var(--skd-ease);
}

.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0) scale(.985); }

.btn-primary {
    background: linear-gradient(180deg, #16C878 0%, var(--skd-verdict) 100%) !important;
    border-color: var(--skd-verdict) !important;
    box-shadow: 0 2px 6px rgba(18, 183, 106, .28);
}

.btn-primary:hover, .btn-primary:focus {
    background: var(--skd-verdict-dark) !important;
    border-color: var(--skd-verdict-dark) !important;
    box-shadow: 0 8px 20px rgba(18, 183, 106, .35);
}

.btn:focus-visible {
    outline: 3px solid rgba(18, 183, 106, .4);
    outline-offset: 2px;
}

.navbar-order .btn, .top-nav-btn { border-radius: var(--skd-radius-sm); }

/* ---------- Cards: courses, instructors, blog ---------- */

.webinar-card, .instructors-card, .blog-card,
.reward-program-section-hero-card, .stats-container {
    border-radius: var(--skd-radius) !important;
    border: 1px solid var(--skd-line);
    box-shadow: var(--skd-shadow-sm);
    overflow: hidden;
    transition: transform .32s var(--skd-stamp), box-shadow .32s var(--skd-ease), border-color .32s var(--skd-ease);
    background: var(--skd-surface);
}

.webinar-card:hover, .instructors-card:hover, .blog-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--skd-shadow-md);
    border-color: #D3DCEA;
}

.webinar-card .img-cover, .blog-card .img-cover {
    transition: transform .6s var(--skd-ease);
}

.webinar-card:hover .img-cover, .blog-card:hover .img-cover { transform: scale(1.045); }

.webinar-title { font-weight: 600; line-height: 1.35; }

.webinar-price-box .real { color: var(--skd-verdict-dark); font-weight: 700; }

/* Ratings pick up the seal gold */
.stars-card i, .stars-card svg { color: var(--skd-seal) !important; fill: var(--skd-seal) !important; }

/* ---------- Badges & chips ---------- */

.badge {
    border-radius: 999px;
    font-weight: 600;
    letter-spacing: .02em;
}

.badge-primary {
    background: rgba(27, 46, 90, .09) !important;
    color: var(--skd-navy) !important;
}

/* ---------- Section headers ---------- */

.section-title {
    font-size: clamp(24px, 3.2vw, 34px);
    font-weight: 700;
    position: relative;
    padding-bottom: 14px;
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    inset-inline-start: 0;
    width: 44px; height: 3px;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--skd-seal), var(--skd-verdict));
}

.text-center .section-title::after,
.text-center.section-title::after { inset-inline-start: calc(50% - 22px); }

.section-hint { color: var(--skd-slate); }

.home-sections { padding-top: 28px; padding-bottom: 28px; }

/* ---------- Stats ---------- */

.stats-container { background: var(--skd-surface); }

.stat-number {
    font-weight: 700;
    font-size: clamp(26px, 3vw, 38px);
    color: var(--skd-navy);
    font-variant-numeric: tabular-nums;
}

.stat-icon-box { transition: transform .3s var(--skd-stamp); }
.stats-item:hover .stat-icon-box { transform: translateY(-4px) scale(1.06); }

/* ---------- Forms ---------- */

.form-control {
    border-radius: var(--skd-radius-sm) !important;
    border-color: var(--skd-line);
    transition: border-color .18s var(--skd-ease), box-shadow .18s var(--skd-ease);
}

.form-control:focus {
    border-color: var(--skd-verdict) !important;
    box-shadow: 0 0 0 3px rgba(18, 183, 106, .15) !important;
}

.input-label { font-weight: 600; color: var(--skd-ink); }

/* ---------- Footer ---------- */

footer.footer {
    background: linear-gradient(180deg, #16264C 0%, var(--skd-ink) 100%) !important;
}

footer.footer a { transition: color .18s var(--skd-ease), transform .18s var(--skd-ease); }
footer.footer a:hover { color: #fff !important; }

/* ---------- Dropdowns & menus ---------- */

.dropdown-menu, .sub-menu {
    border-radius: var(--skd-radius-sm) !important;
    border: 1px solid var(--skd-line) !important;
    box-shadow: var(--skd-shadow-md) !important;
}

.dropdown-item { transition: background-color .15s var(--skd-ease), padding-inline-start .18s var(--skd-ease); }
.dropdown-item:hover { background-color: var(--skd-paper); padding-inline-start: 1.75rem; }

/* ---------- Hero slider ---------- */

.slider-container .mySlides img { border-radius: 0; }

.slider-search {
    border-radius: var(--skd-radius-sm) !important;
    box-shadow: var(--skd-shadow-md);
}

/* ---------- Toasts / modals ---------- */

.modal-content { border-radius: var(--skd-radius) !important; border: none; box-shadow: var(--skd-shadow-md); }

/* ---------- Scroll-reveal (elements tagged by skedmia-modern.js) ---------- */

.skd-reveal {
    opacity: 0;
    transform: translateY(22px) scale(.99);
    transition: opacity .55s var(--skd-ease), transform .6s var(--skd-stamp);
    transition-delay: calc(var(--skd-i, 0) * 70ms);
    will-change: opacity, transform;
}

.skd-reveal.skd-in {
    opacity: 1;
    transform: none;
}

/* ---------- WhatsApp pulse: calmer ---------- */

.pulse { background-color: var(--skd-verdict) !important; }
.pulse:hover { background-color: var(--skd-verdict-dark) !important; }

/* ---------- Reduced motion: switch it all off ---------- */

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
    .skd-reveal { opacity: 1; transform: none; }
}


/* ==========================================================================
   v2 — Udemy/Coursera pass: hero, announce bar, marketplace-style cards
   ========================================================================== */

.skd-announce {
    background: var(--skd-ink);
    color: #E7EDF8;
    font-size: 13.5px;
    padding: 9px 0;
}

.skd-announce a { color: #E7EDF8; font-weight: 500; }
.skd-announce a:hover { color: #fff; text-decoration: underline; }

.skd-announce-dot {
    width: 4px; height: 4px;
    border-radius: 50%;
    background: var(--skd-seal);
    display: inline-block;
    margin: 0 14px;
}

.skd-hero {
    background:
        radial-gradient(900px 420px at 85% -10%, rgba(18, 183, 106, .07), transparent 60%),
        linear-gradient(180deg, #FFFFFF 0%, var(--skd-paper) 100%);
    padding: 64px 0 110px;
    border-bottom: 1px solid var(--skd-line);
}

.skd-eyebrow {
    display: inline-block;
    font-family: 'Sora', sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #8A6D1B;
    background: var(--skd-seal-soft);
    border: 1px solid #E8D9A8;
    border-radius: 999px;
    padding: 6px 14px;
}

.skd-hero-title {
    font-size: clamp(32px, 4.4vw, 52px);
    font-weight: 700;
    line-height: 1.12;
    margin-top: 18px;
    max-width: 13ch;
}

.skd-hero-sub {
    font-size: 17px;
    line-height: 1.65;
    color: var(--skd-slate);
    margin-top: 16px;
    max-width: 52ch;
}

.skd-hero-search {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 28px;
    max-width: 540px;
    background: #fff;
    border: 1.5px solid var(--skd-line);
    border-radius: 999px;
    padding: 6px 6px 6px 22px;
    box-shadow: var(--skd-shadow-sm);
    transition: border-color .2s var(--skd-ease), box-shadow .2s var(--skd-ease);
}

.skd-hero-search:focus-within {
    border-color: var(--skd-verdict);
    box-shadow: 0 0 0 4px rgba(18, 183, 106, .12);
}

.skd-hero-search input {
    flex: 1;
    border: none;
    outline: none;
    font-size: 16px;
    font-family: 'Figtree', sans-serif;
    color: var(--skd-ink);
    background: transparent;
    min-width: 0;
}

.skd-hero-search .btn { border-radius: 999px !important; padding: 10px 26px; }

.skd-hero-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    font-size: 14px;
}

.skd-hero-chips span { color: var(--skd-slate); margin-inline-end: 4px; }

.skd-hero-chips a {
    display: inline-block;
    padding: 6px 14px;
    border: 1px solid var(--skd-line);
    border-radius: 999px;
    background: #fff;
    color: var(--skd-navy);
    font-weight: 500;
    transition: border-color .18s var(--skd-ease), background-color .18s var(--skd-ease), transform .18s var(--skd-stamp);
}

.skd-hero-chips a:hover {
    border-color: var(--skd-navy);
    background: rgba(27, 46, 90, .05);
    transform: translateY(-1px);
}

.skd-hero-media { position: relative; padding: 12px 8px 12px 32px; }

.skd-hero-photo {
    width: 100%;
    aspect-ratio: 5 / 4;
    object-fit: cover;
    border-radius: 20px;
    box-shadow: var(--skd-shadow-md);
}

.skd-hero-card {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(255, 255, 255, .94);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: 1px solid var(--skd-line);
    border-radius: 14px;
    box-shadow: var(--skd-shadow-md);
    padding: 12px 16px;
}

.skd-hero-card strong { font-family: 'Sora', sans-serif; font-size: 15px; display: block; }
.skd-hero-card small { color: var(--skd-slate); display: block; font-size: 12.5px; }

.skd-hero-card-cert { bottom: 34px; inset-inline-start: 0; animation: skd-float 6s ease-in-out infinite; }
.skd-hero-card-rating { top: 26px; inset-inline-end: -6px; animation: skd-float 7s ease-in-out 1.2s infinite; }
.skd-hero-card-rating strong { color: #8A6D1B; }

.skd-hero-card-icon {
    width: 34px; height: 34px;
    border-radius: 50%;
    background: var(--skd-verdict);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex: none;
}

@keyframes skd-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

/* Marketplace-style course cards: tighter, information-forward */
.webinar-card { border-radius: 12px !important; }
.webinar-card .webinar-title { font-size: 16px; }
.webinar-card:hover { transform: translateY(-4px); }

@media (max-width: 991px) {
    .skd-hero { padding: 40px 0 48px; }
    .skd-hero-title { max-width: none; }
}

/* ==========================================================================
   v3 — navbar & footer rebuild
   ========================================================================== */

/* --- Top utility bar --- */
.skd-topbar {
    background: #fff;
    border-bottom: 1px solid var(--skd-line);
    padding: 7px 0;
    font-size: 13.5px;
}

.skd-topbar-links a {
    color: var(--skd-slate);
    font-weight: 500;
    margin-inline-end: 22px;
    transition: color .16s var(--skd-ease);
}

.skd-topbar-links a:hover { color: var(--skd-ink); }

.skd-topbar-login { color: var(--skd-ink); font-weight: 600; }
.skd-topbar-login:hover { color: var(--skd-verdict-dark); }

.skd-topbar-register { padding: 6px 18px !important; }

.skd-topbar .navbar-user img { width: 30px; height: 30px; object-fit: cover; }

/* --- Main navbar: single clean row --- */
#navbar.navbar { padding-top: 10px; padding-bottom: 10px; }

#navbar .navbar-brand img.allimgnew { max-height: 56px; width: auto; }

.skd-nav-search {
    align-items: center;
    gap: 10px;
    flex: 1 1 360px;
    max-width: 440px;
    min-width: 190px;
    background: #F1F4F9;
    border: 1.5px solid #E4EAF3;
    border-radius: 999px;
    padding: 6px 6px 6px 20px;
    margin: 0 26px;
    transition: border-color .2s var(--skd-ease), background-color .2s var(--skd-ease), box-shadow .2s var(--skd-ease);
}

.skd-nav-search:focus-within {
    background: #fff;
    border-color: var(--skd-verdict);
    box-shadow: 0 0 0 4px rgba(18, 183, 106, .1);
}

.skd-nav-search .skd-nav-search-icon { color: var(--skd-slate); flex: none; }

.skd-nav-search input {
    border: none;
    outline: none;
    background: transparent;
    width: 100%;
    font-size: 15px;
    font-family: 'Figtree', sans-serif;
    color: var(--skd-ink);
}

.skd-nav-search-btn {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px; height: 38px;
    border: none;
    border-radius: 50%;
    background: var(--skd-navy);
    color: #fff;
    cursor: pointer;
    transition: background-color .18s var(--skd-ease), transform .18s var(--skd-stamp);
}

.skd-nav-search-btn:hover { background: var(--skd-verdict); transform: scale(1.06); }
.skd-nav-search-btn svg { color: #fff; }

.skd-nav-cta {
    background: transparent !important;
    border: 1.5px solid var(--skd-navy) !important;
    color: var(--skd-navy) !important;
    font-weight: 600;
    padding: 8px 20px !important;
    white-space: nowrap;
    box-shadow: none;
}

.skd-nav-cta:hover {
    background: var(--skd-navy) !important;
    color: #fff !important;
    box-shadow: 0 6px 16px rgba(27, 46, 90, .25);
}

/* categories pill */
#navbar .menu-category > ul > li.xs-categories-toggle {
    background: #F1F4F9;
    border-radius: 999px;
    padding: 9px 18px;
    font-weight: 500;
    transition: background-color .18s var(--skd-ease);
}

#navbar .menu-category > ul > li.xs-categories-toggle:hover { background: #E6ECF5; }

/* --- Footer --- */
.skd-footer { padding-top: 0 !important; }

.skd-foot-cta {
    background: linear-gradient(120deg, rgba(18, 183, 106, .16), rgba(201, 162, 39, .10)),
                rgba(255, 255, 255, .04);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 18px;
    padding: 30px 34px;
    margin-top: 48px;
    color: #C6D2E6;
}

.skd-foot-cta-title {
    font-family: 'Sora', sans-serif;
    font-size: 22px;
    color: #fff;
}

.skd-foot-subscribe { max-width: 460px; }

.skd-foot-subscribe .form-group {
    background: #fff;
    border-radius: 999px;
    padding: 5px 5px 5px 18px;
}

.skd-foot-subscribe .form-control { box-shadow: none !important; }

.skd-foot-columns { padding: 44px 0 36px; }

.skd-foot-header {
    font-family: 'Sora', sans-serif;
    font-size: 13px;
    font-weight: 600 !important;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: #8FA3C8 !important;
}

.skd-footer, .skd-footer p, .skd-footer span, .skd-footer li { color: #C6D2E6; }

.skd-foot-links a, .skd-footer a { color: #C6D2E6 !important; }
.skd-foot-links a:hover, .skd-footer a:hover { color: #fff !important; }

.skd-foot-links ul { list-style: none; padding: 0; margin: 0; }
.skd-foot-links li { margin-bottom: 10px; }

.skd-foot-bottom {
    border-top: 1px solid rgba(255, 255, 255, .12);
    padding: 22px 0;
}

.skd-foot-logo { max-height: 46px; width: auto; border-radius: 8px; }

.skd-foot-copy { font-size: 13.5px; color: #8FA3C8; }

.skd-foot-socials a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px; height: 38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .12);
    margin-inline-start: 10px;
    transition: background-color .18s var(--skd-ease), transform .18s var(--skd-stamp);
}

.skd-foot-socials a:hover { background: rgba(255, 255, 255, .18); transform: translateY(-2px); }

.skd-foot-socials img { width: 18px; height: 18px; object-fit: contain; }

/* --- Auth pages: photo panel --- */
.login-container .img-cover, .register-container .img-cover { border-radius: 0 18px 18px 0; }


/* navbar density: keep the full row inside the viewport */
#navbar .navbar-toggle-content { margin-left: 14px !important; margin-right: 14px !important; }
#navbar .navbar-nav .nav-item { margin: 0 !important; padding: 0 !important; }
#navbar .navbar-nav .nav-link { padding: 8px 11px !important; font-size: 14px; white-space: nowrap; }
#navbar .menu-category > ul > li.xs-categories-toggle { padding: 8px 14px; font-size: 14px; white-space: nowrap; }
.skd-nav-search { margin: 0 14px; }
.skd-nav-cta { padding: 7px 14px !important; font-size: 13.5px; }

/* ==========================================================================
   v4 — mobile navbar drawer
   ========================================================================== */
@media (max-width: 991px) {
    #navbar.navbar { padding: 8px 14px; }
    #navbar .navbar-brand img.allimgnew { max-height: 44px; }

    /* slide-in drawer */
    #navbar .navbar-toggle-content {
        position: fixed;
        top: 0;
        inset-inline-end: 0;
        width: min(86vw, 340px);
        height: 100vh;
        background: #fff;
        box-shadow: -8px 0 40px rgba(16, 30, 60, .18);
        padding: 20px 22px;
        overflow-y: auto;
        transform: translateX(100%);
        transition: transform .3s var(--skd-ease);
        z-index: 12000;
        margin: 0 !important;
        display: block !important;
    }

    :root[dir="rtl"] #navbar .navbar-toggle-content,
    body.rtl #navbar .navbar-toggle-content {
        inset-inline-end: auto;
        inset-inline-start: 0;
        transform: translateX(-100%);
    }

    #navbar .navbar-toggle-content.skd-open,
    #navbar .navbar-toggle-content.show,
    #navbar.show .navbar-toggle-content { transform: translateX(0); }

    #navbar .navbar-toggle-content ul {
        list-style: none;
        padding: 0;
        margin: 0 0 8px;
        display: block;
    }

    #navbar .navbar-toggle-content .nav-item,
    #navbar .navbar-toggle-content li {
        display: block !important;
        width: 100%;
        border-bottom: 1px solid var(--skd-line);
    }

    #navbar .navbar-toggle-content .nav-link,
    #navbar .navbar-toggle-content li > a {
        display: block !important;
        padding: 13px 4px !important;
        font-size: 15px;
        color: var(--skd-ink) !important;
    }

    #navbar .navbar-toggle-content .dropdown-menu {
        position: static !important;
        transform: none !important;
        box-shadow: none !important;
        border: none !important;
        padding-inline-start: 14px;
    }

    /* dim backdrop */
    #navbar .navbar-toggle-content::before { content: none; }
    body.skd-nav-open { overflow: hidden; }
    body.skd-nav-open::after {
        content: '';
        position: fixed;
        inset: 0;
        background: rgba(16, 30, 60, .45);
        z-index: 11000;
    }

    .skd-nav-search { display: none !important; }
}


/* ==========================================================================
   v5 — navbar polish: pill-hover menu, refined CTA, sticky elevation
   ========================================================================== */

/* Top-level menu items get a soft rounded hover surface (Udemy/Coursera feel) */
#navbar .navbar-nav > li .nav-link {
    border-radius: 10px;
    transition: background-color .16s var(--skd-ease), color .16s var(--skd-ease);
}

#navbar .navbar-nav > li .nav-link:hover {
    background: #F1F4F9;
    color: var(--skd-navy) !important;
}

/* the animated underline reads cleaner when confined to the text */
#navbar .navbar-nav > li .nav-link:not(.dropdown-toggle)::after { bottom: 4px; }

/* dropdown-toggle caret: use our own chevron, tighten */
#navbar .nav-item.dropdown .dropdown-toggle::after {
    border: none;
    content: '';
    width: 7px; height: 7px;
    margin-left: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform .18s var(--skd-ease);
    opacity: .55;
}
#navbar .nav-item.dropdown:hover .dropdown-toggle::after { transform: rotate(45deg) translateY(0); opacity: 1; }

/* Refined "Become instructor" CTA — subtle fill, premium hover */
.skd-nav-cta {
    background: transparent !important;
    border: 1.5px solid var(--skd-line) !important;
    color: var(--skd-navy) !important;
    font-weight: 600;
    border-radius: 999px !important;
    padding: 9px 20px !important;
    box-shadow: none;
    transition: border-color .18s var(--skd-ease), background-color .18s var(--skd-ease), color .18s var(--skd-ease), transform .18s var(--skd-stamp);
}
.skd-nav-cta:hover {
    background: var(--skd-ink) !important;
    border-color: var(--skd-ink) !important;
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(16, 30, 60, .22);
}

/* Register button in topbar: refined single-tone, not candy gradient */
.skd-topbar-register.btn-primary {
    background: var(--skd-verdict) !important;
    background-image: none !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 8px rgba(18, 183, 106, .25);
}
.skd-topbar-register.btn-primary:hover { background: var(--skd-verdict-dark) !important; }

/* cart & bell icons: consistent circular hit-area */
.skd-topbar .nav-cart-menu > a,
.skd-topbar .notification-menu > a,
.skd-topbar [data-feather="shopping-cart"],
.skd-topbar [data-feather="bell"] { color: var(--skd-slate); }

.skd-topbar .dropdown > a:hover [data-feather] { color: var(--skd-ink); }

/* Sticky navbar disabled: theme's fixed-position logic conflicts with the
   two-bar layout and leaves a blank gap. Keep the navbar in normal flow. */
#navbar.navbar.sticky {
    position: static !important;
    box-shadow: none;
}
#navbarVacuum { height: 0 !important; }

/* Categories mega-dropdown: crisp card */
#navbar .cat-dropdown-menu {
    border-radius: 14px !important;
    border: 1px solid var(--skd-line) !important;
    box-shadow: var(--skd-shadow-md) !important;
    padding: 8px !important;
}
#navbar .cat-dropdown-menu > li > a {
    border-radius: 9px;
    transition: background-color .15s var(--skd-ease);
}
#navbar .cat-dropdown-menu > li > a:hover { background: #F1F4F9; }
#navbar .cat-dropdown-menu-icon { border-radius: 6px; }

/* ==========================================================================
   v6 — page banners, static content, course detail, listing polish
   ========================================================================== */

/* Shared page-header banners (static pages, cart, etc.) — gradient + texture */
.cart-banner, .site-top-banner {
    background:
        radial-gradient(1200px 300px at 80% -40%, rgba(18,183,106,.22), transparent 60%),
        linear-gradient(120deg, var(--skd-ink) 0%, var(--skd-navy) 60%, #24407A 100%) !important;
    position: relative;
    overflow: hidden;
    padding: 64px 0 !important;
    border-bottom: 3px solid var(--skd-seal);
}
.cart-banner::after, .site-top-banner::after {
    content: '';
    position: absolute; inset: 0;
    background-image: radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px);
    background-size: 22px 22px;
    opacity: .6;
    pointer-events: none;
}
.cart-banner h1, .site-top-banner h1 {
    font-family: 'Sora', sans-serif;
    font-weight: 700;
    letter-spacing: -.02em;
    position: relative;
    z-index: 1;
}

/* Static page rich content — comfortable reading measure & rhythm */
.post-show {
    font-size: 16.5px;
    line-height: 1.8;
    color: #33415C;
    max-width: 860px;
    margin-inline: auto;
}
.post-show h1, .post-show h2, .post-show h3, .post-show h4 {
    color: var(--skd-ink);
    margin-top: 1.6em;
    margin-bottom: .5em;
    font-weight: 700;
}
.post-show u { text-decoration-color: var(--skd-seal); text-underline-offset: 3px; }
.post-show img { border-radius: 14px; max-width: 100%; height: auto; box-shadow: var(--skd-shadow-sm); }
.post-show a { color: var(--skd-verdict-dark); font-weight: 600; }

/* Course detail: purchase panel as a clean sticky card */
.webinar-single-purchase-box, .single-webinar-purchase-box, .buy-box, .webinar-price-container {
    border-radius: 16px !important;
    border: 1px solid var(--skd-line);
    box-shadow: var(--skd-shadow-md);
    overflow: hidden;
}

/* Course detail hero readability: overlay behind the title band */
.webinar-single-header, .single-course-header, .course-header {
    position: relative;
}

/* Info / content / reviews tab bar */
.nav-tab, .webinar-tabs, .course-tabs {
    border-radius: 12px !important;
    overflow: hidden;
}

/* Listing: filter toolbar as a clean card */
.webinars-filter, .filter-box, .classes-filter-box {
    border-radius: 14px !important;
    border: 1px solid var(--skd-line);
    box-shadow: var(--skd-shadow-sm);
}

/* Search hero on listing pages: pill it */
.search-top-banner .form-control,
.search-top-banner input[type="text"] { border-radius: 999px !important; }

/* Toggle switches (Upcoming/Free/Discount) accent */
.custom-switch input:checked + label::before,
.switch input:checked + .slider { background: var(--skd-verdict) !important; }

/* Pagination */
.pagination .page-link {
    border-radius: 10px !important;
    margin: 0 3px;
    border: 1px solid var(--skd-line);
    color: var(--skd-navy);
}
.pagination .page-item.active .page-link {
    background: var(--skd-navy) !important;
    border-color: var(--skd-navy) !important;
}

/* Breadcrumbs */
.breadcrumb { background: transparent !important; padding-inline: 0; }
.breadcrumb a { color: var(--skd-slate); }

/* ==========================================================================
   v7 — course detail hero readability
   ========================================================================== */
.course-cover-container { position: relative; }

/* dark scrim over the cover image so overlaid text is legible */
.course-cover-container::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(16,30,60,.55) 0%, rgba(16,30,60,.78) 100%);
    z-index: 1;
    pointer-events: none;
}
.course-cover-container > *, .course-content-section { position: relative; z-index: 2; }

/* keep the on-cover title/text white (our global h1 rule was overriding it) */
.course-body-on-cover, .course-body-on-cover .course-title,
.course-body-on-cover h1, .course-body-on-cover span,
.course-body-on-cover a { color: #fff !important; }
.course-body-on-cover .course-title {
    font-family: 'Sora', sans-serif;
    font-weight: 700;
    letter-spacing: -.02em;
    text-shadow: 0 2px 18px rgba(0,0,0,.35);
}

/* the floating video/price card sits above the scrim cleanly */
.course-cover-container .video-box, .single-course-video, .webinar-video-box { border-radius: 16px !important; overflow: hidden; }

/* ==========================================================================
   v8 — landing page redesign: stats band, marquee, instructor CTA,
        testimonials, categories
   ========================================================================== */

/* ---- Stats: one elevated panel overlapping the hero ---- */
.skd-stats { background: transparent !important; margin-top: -56px; position: relative; z-index: 5; padding-bottom: 10px; }
.skd-stats .container { padding-inline: 15px; }

.skd-stats-panel {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: #fff;
    border: 1px solid var(--skd-line);
    border-radius: 20px;
    box-shadow: 0 18px 50px rgba(16, 30, 60, .12);
    overflow: hidden;
}

.skd-stat {
    text-align: center;
    padding: 34px 22px;
    position: relative;
    transition: background-color .2s var(--skd-ease);
}
.skd-stat + .skd-stat::before {
    content: '';
    position: absolute;
    inset-inline-start: 0; top: 22px; bottom: 22px;
    width: 1px;
    background: var(--skd-line);
}
.skd-stat:hover { background: #FAFCFF; }

.skd-stat-icon {
    width: 60px; height: 60px;
    margin: 0 auto 16px;
    border-radius: 16px;
    background: linear-gradient(145deg, var(--skd-navy), var(--skd-ink));
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 8px 18px rgba(16, 30, 60, .22);
    position: relative;
    transition: transform .3s var(--skd-stamp);
}
/* gold seal accent dot */
.skd-stat-icon::after {
    content: '';
    position: absolute;
    top: -5px; inset-inline-end: -5px;
    width: 14px; height: 14px;
    border-radius: 50%;
    background: var(--skd-seal);
    border: 2.5px solid #fff;
    box-shadow: 0 2px 6px rgba(201,162,39,.4);
}
.skd-stat:hover .skd-stat-icon { transform: translateY(-4px) scale(1.05); }
.skd-stat-icon img { width: 30px; height: 30px; filter: brightness(0) invert(1); }

.skd-stat-num {
    display: block;
    font-family: 'Sora', sans-serif;
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 700;
    color: var(--skd-ink);
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.skd-stat-title {
    font-family: 'Sora', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: var(--skd-navy);
    margin: 12px 0 6px;
}
.skd-stat-desc { font-size: 13.5px; line-height: 1.55; color: var(--skd-slate); margin: 0; max-width: 22ch; margin-inline: auto; }

@media (max-width: 991px) {
    .skd-stats { margin-top: -30px; }
    .skd-stats-panel { grid-template-columns: repeat(2, 1fr); }
    .skd-stat:nth-child(3)::before, .skd-stat:nth-child(2)::before { content: none; }
    .skd-stat:nth-child(2)::before { content: ''; }
}
@media (max-width: 575px) {
    .skd-stats-panel { grid-template-columns: 1fr; }
    .skd-stat::before { content: none !important; }
    .skd-stat + .skd-stat { border-top: 1px solid var(--skd-line); }
}

/* ---- "Premium Courses" marquee: edge-fade + framed items ---- */
.marquee { -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
           mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.marquee-item img, .marquee-item .allimg2 {
    border-radius: 14px;
    box-shadow: var(--skd-shadow-sm);
    border: 1px solid var(--skd-line);
}
h1.pl-150 {
    font-family: 'Sora', sans-serif;
    font-weight: 700;
    font-size: clamp(22px, 3vw, 30px);
    padding-inline-start: 0 !important;
    text-align: center;
    color: var(--skd-ink);
}

/* ---- Instructor CTA (purple angular) → modern gradient card ---- */
.reward-program-section-hero, .become-instructor-section,
.home-sections .find-instructor-section-hero {
    border-radius: 20px !important;
}
[class*="reward-program"] [style*="clip-path"],
.become-instructor-hero { clip-path: none !important; }

/* the purple "Join us as an Instructor" block */
.home-sections a[href*="instructor"] img,
.home-sections .instructor-cta-card { border-radius: 18px; }

/* ---- Testimonials: kill dated blobs, clean quote cards ---- */
.customers-testimonials .shadow-effect, .stars-card,
.testimonial-item, .testimonial-card {
    border-radius: 16px !important;
    border: 1px solid var(--skd-line);
    box-shadow: var(--skd-shadow-sm) !important;
    background: #fff;
}
/* decorative green blobs behind testimonials */
.home-sections .testimonial-bg-shape,
.home-sections [class*="shape"] img[src*="green"],
.home-sections .bg-shape { opacity: .35; }

/* ---- Trending categories: uniform modern tiles ---- */
.home-categories-item, .category-card, .trending-category-item {
    border-radius: 16px !important;
    border: 1px solid var(--skd-line);
    box-shadow: var(--skd-shadow-sm);
    transition: transform .28s var(--skd-stamp), box-shadow .28s var(--skd-ease);
}
.home-categories-item:hover, .category-card:hover, .trending-category-item:hover {
    transform: translateY(-4px);
    box-shadow: var(--skd-shadow-md);
}

/* ---- Section title alignment when centered ---- */
.home-sections .text-center .section-title { display: inline-block; }