/* =========================================================
   AITM Premium UI (Brand Guideline + Layout)
   Fonts: Inter + Playfair Display
   Palette:
     --navy: #0F172A;
     --gold: #C6A15B;
     --text: #0B1220;
     --muted:#64748B;
     --bg:   #F7F8FB;
========================================================= */

:root {
    --navy: #0F172A;
    --gold: #C6A15B;
    --text: #0B1220;
    --muted: #64748B;
    --bg: #F7F8FB;
    --card: #FFFFFF;
    --border: rgba(15,23,42,.10);
    /* spacing system */
    --r-12: 12px;
    --r-16: 16px;
    --r-20: 20px;
    --r-24: 24px;
    --shadow: 0 18px 50px rgba(15,23,42,.12);
    --shadow-soft: 0 10px 30px rgba(15,23,42,.10);
}

* {
    box-sizing: border-box;
}

html, body {
    height: 100%;
}

    body.site-body {
        font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
        background: var(--bg);
        color: var(--text);
        line-height: 1.65;
    }











/* =========================
   iPad & Tablet header fix
   Range: 768px - 1199.98px
   ========================= */
@media (min-width: 768px) and (max-width: 1199.98px) {

    /* Navbar container spacing */
    .navbar .navbar-nav {
        gap: 10px !important;
        align-items: center;
    }

    /* Nav link sizing for tablets */
    .navbar .nav-link {
        font-size: 14px;
        padding: 10px 10px;
        white-space: nowrap;
    }

    /* Dropdown menu base: keep within viewport */
    .navbar .dropdown-menu {
        border-radius: 14px;
        box-shadow: 0 14px 40px rgba(0,0,0,.12);
        overflow: hidden;
    }

    /* ========= AITM dropdown (small menu) ========= */
    .dropdown-menu-aitm {
        min-width: 240px;
        padding: 10px;
    }

        .dropdown-menu-aitm .aitm-item {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 10px 12px;
            border-radius: 10px;
        }

            .dropdown-menu-aitm .aitm-item i {
                font-size: 18px;
            }

        .dropdown-menu-aitm .aitm-divider {
            margin: 10px 0;
            opacity: .25;
        }

    /* ========= Mega dropdown (Təlimlər) ========= */
    .dropdown-mega {
        width: min(96vw, 980px); /* fit in tablet view */
        left: 50% !important; /* center align */
        transform: translateX(-50%);
        right: auto !important;
        max-width: 96vw;
    }

        /* Make columns adapt nicely */
        .dropdown-mega .dd-grid {
            row-gap: 16px;
        }

        /* On tablets, 6 cols is too tight. Make it 3 columns per row. */
        .dropdown-mega .col-xl-2 {
            flex: 0 0 33.3333%;
            max-width: 33.3333%;
        }

        /* Headings + links readability */
        .dropdown-mega .dd-title {
            font-size: 13px;
            font-weight: 700;
            margin-bottom: 8px;
            letter-spacing: .2px;
        }

        .dropdown-mega .dd-link {
            display: block;
            font-size: 13px;
            padding: 6px 0;
            line-height: 1.25;
            white-space: normal; /* allow wrap */
        }

        /* Footer wraps on tablet */
        .dropdown-mega .dd-footer {
            flex-wrap: wrap;
            gap: 10px;
        }

        .dropdown-mega .dd-note {
            font-size: 13px;
            opacity: .85;
        }

    /* ========= Buttons on right ========= */
    .navbar .tb-test {
        padding: 10px 12px;
        font-size: 13px;
        white-space: nowrap;
    }

    .navbar .btn.btn-premium {
        padding: 10px 12px;
        font-size: 13px;
        white-space: nowrap;
    }

    /* Reduce extra margin so it doesn’t push off-screen */
    .navbar .nav-item.ms-lg-2 {
        margin-left: 8px !important;
    }

    /* If text still overflows, allow slight shrink */
    .navbar .navbar-nav {
        flex-wrap: wrap; /* allows second row if needed */
        justify-content: flex-end;
    }
}

/* =========================
   iPad portrait edge case
   Range: 768px - 991.98px
   Make mega dropdown 2 columns per row
   ========================= */
@media (min-width: 768px) and (max-width: 991.98px) {
    .dropdown-mega .col-xl-2 {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .dropdown-mega {
        width: min(96vw, 760px);
    }
}

/* =========================
   HARD FIX: Header overflow
   iPad & tablets
   ========================= */
@media (min-width: 768px) and (max-width: 1199.98px) {

    /* 1. Heç vaxt viewport-dan böyük olmasın */
    .navbar,
    .navbar > .container,
    .navbar > .container-fluid {
        max-width: 100%;
        overflow-x: hidden;
    }

    /* 2. Navbar row çevik olsun */
    .navbar-nav {
        flex-wrap: wrap !important;
        width: 100%;
        justify-content: flex-end;
        row-gap: 6px;
    }

        /* 3. Nav item-lar özünü zorla saxlamasın */
        .navbar-nav .nav-item {
            flex-shrink: 1;
        }

    /* 4. Linklər bir az kompakt */
    .navbar .nav-link {
        padding: 8px 10px;
        font-size: 14px;
        white-space: nowrap;
    }

    /* 5. Test CTA ayrı sətrə düşə bilsin */
    .navbar .tb-test {
        order: 10;
        padding: 8px 12px;
        font-size: 13px;
    }

    /* 6. Premium button son sırada, sağda */
    .navbar .btn-premium {
        order: 11;
        padding: 8px 14px;
        font-size: 13px;
    }

    /* 7. Əgər yenə sıxlıq olsa – ikinci sətir */
    .navbar-nav::after {
        content: "";
        flex-basis: 100%;
        height: 0;
    }
}







/* AİTM horizontal dropdown */
/* default: bağlı */
.dropdown-menu-aitm {
    display: none;
    grid-template-columns: repeat(7, 1fr);
    gap: 12px;
    min-width: 420px;
    padding: 14px;
    border-radius: 18px;
    border: 1px solid rgba(15,23,42,.10);
    background: rgba(255,255,255,.92);
    box-shadow: 0 24px 60px rgba(15,23,42,.14);
    animation: aitmFadeUp .18s ease;
}

    /* Bootstrap açanda */
    .dropdown-menu-aitm.show {
        display: grid;
    }


/* item */
.aitm-item {
    width: 76px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 14px 10px;
    border-radius: 14px;
    text-decoration: none;
    color: rgba(15,23,42,.85);
    font-weight: 700;
    font-size: 14px;
    transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

    /* icon */
    .aitm-item i {
       
        font-size: 26px;
        color: rgba(15,23,42,.75);
        transition: transform .18s ease, color .18s ease;
    }

    /* hover */
    .aitm-item:hover {
        background: rgba(15,23,42,.06);
        box-shadow: 0 10px 24px rgba(15,23,42,.12);
        transform: translateY(-2px);
    }

        .aitm-item:hover i {
            transform: scale(1.12);
            color: rgba(15,23,42,.95);
        }

/* animation */
@keyframes aitmFadeUp {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* mobile fallback */
@media (max-width: 768px) {
    .dropdown-menu-aitm {
        grid-template-columns: 1fr;
        min-width: 100%;
    }

    .aitm-item {
        flex-direction: row;
        justify-content: flex-start;
        gap: 12px;
    }

        .aitm-item i {
            font-size: 22px;
        }
}








/* Helpers */
.page-wrap {
    min-height: 60vh;
    background: #f7f8fc;
}

a {
    text-decoration: none;
}

.container {
    max-width: 1140px;
}

/* ===================== Topbar ===================== */
.topbar {
  
}

/* -------------------------
   Topbar refinement
-------------------------- */

.topbar {
    font-size: 13px;
    background: rgba(15,23,42,.96);
    color: rgba(255,255,255,.88);
    font-size: 13px;
    padding: 10px 0;
}

.topbar-left {
    display: flex;
    align-items: center;
    gap: 14px;
}

.tb-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

    .tb-item i {
        font-size: 13px;
        opacity: .7;
    }

.tb-sep {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(11,18,32,.35);
}

/* 🔹 Personality Test mini-CTA */
.tb-test {
    margin-left: 4px;
    padding: 6px 12px;
    border-radius: 999px;
    font-weight: 500;
    color: rgba(11,18,32,.86) !important;
    background: linear-gradient(135deg, rgba(43, 107, 255, .14), rgba(34, 197, 94, .27));
    border: 1px solid rgb(255 255 255);
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
    border-radius: 16px;
}

    .tb-test:hover {
        transform: translateY(-1px);
        box-shadow: 0 6px 18px rgba(2,6,23,.12);
        background: linear-gradient( 135deg, rgba(43,107,255,.22), rgba(34,197,94,.18) );
    }

/* right icons */
.topbar-right a {
    margin-left: 14px;
    color: inherit;
    opacity: .75;
    transition: opacity .2s ease, transform .2s ease;
}

    .topbar-right a:hover {
        opacity: 1;
        transform: translateY(-1px);
    }

/* ===================== Navbar ===================== */
.site-header {
    position: sticky;
    top: 0;
    z-index: 1030;
}

.navbar-premium {
    background: rgba(255,255,255,.85);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border);
    padding: 14px 0;
    transition: box-shadow .2s ease, background .2s ease;
    position: relative;
    z-index: 1000;
}

    .navbar-premium.scrolled {
        background: rgba(255,255,255,.92);
        box-shadow: 0 10px 30px rgba(15,23,42,.08);
    }

.brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.brand-logo {
    width: 130px;
    height: 63px;
    object-fit: contain;
    border-radius: 10px;
}

.brand-text .brand-name {
    font-weight: 700;
    letter-spacing: .2px;
    color: var(--text);
}

.brand-text .brand-sub {
    font-size: 12px;
    color: var(--muted);
    margin-top: -2px;
}

.nav-link {
    color: rgba(11,18,32,.86) !important;
    font-weight: 500;
    letter-spacing: .2px;
    padding: 10px 12px !important;
    border-radius: 12px;
    transition: background .2s ease, color .2s ease;
}

    .nav-link:hover {
        background: rgba(198,161,91,.10);
        color: var(--text) !important;
    }

  /*  .nav-link::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: -4px;
        width: 0;
        height: 2px;
        background: #3b5cff;
        transition: .25s ease;
    }

    .nav-link:hover::after {
        width: 100%;
    }*/

.nav-news {
    font-weight: 600;
}

    .nav-news:hover {
        color: #111;
    }



/* Premium dropdown */
.dropdown-menu-premium {
    min-width: 220px;
    padding: 12px;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.12);
    animation: fadeUp .2s ease;
}

    /* Itemlər */
    .dropdown-menu-premium .dropdown-item {
        padding: 10px 14px;
        border-radius: 10px;
        font-size: 14px;
        font-weight: 500;
        color: rgba(15, 23, 42, 0.85);
        transition: background .2s ease, padding-left .2s ease;
    }

        /* Hover effekti */
        .dropdown-menu-premium .dropdown-item:hover {
            background: rgba(15, 23, 42, 0.06);
            padding-left: 18px;
        }

/* Açılma animasiyası */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}






/* Premium toggler */
.premium-toggler {
    width: 48px;
    height: 42px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: rgba(255,255,255,.9);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 6px;
}

    .premium-toggler span {
        width: 22px;
        height: 2px;
        background: rgba(11,18,32,.8);
        border-radius: 4px;
    }

/ /* =========================================================
   BASE DROPDOWN (normal dropdown-lar üçün)
   ========================================================= */
.dropdown-premium {
    min-width: 420px; /* normal dropdown üçün minimum */
    border-radius: 18px;
    border: 1px solid var(--border);
    box-shadow: var(--shadow-soft);
    margin-left: 10%;
}


/* =========================================================
   MEGA DROPDOWN – DESKTOP (>= 992px)
   ========================================================= */
@media (min-width: 992px) {

    /* Mega dropdown ümumi ölçü */
    .dropdown-premium.dropdown-mega {
        width: 1300px; /* 7 sütun üçün ideal */
        max-width: calc(100vw - 48px); /* ekran daralanda avtomatik kiçilsin */
        left: 146%; /* 50% əvəzinə */
        transform: translateX(-50%);
        z-index: 1050; /* vacib */
        position: absolute;
    }

    /* Mega grid – 7 sütun horizontal */
    .dd-grid {
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 10px;
        align-items: start;
    }
}


/* =========================================================
   MEGA DROPDOWN – MOBILE / TABLET (< 992px)
   ========================================================= */
@media (max-width: 991px) {

    .dropdown-premium.dropdown-mega {
        width: 100%;
        max-width: 100%;
        left: 0;
        transform: none;
        border-radius: 0; /* mobil üçün daha təmiz */
    }

    /* Mobil-də sütunlar alt-alta düşsün */
    .dd-grid {
        display: grid;
        grid-template-columns: repeat(7, minmax(0, 1fr));
        gap: 24px;
        align-items: start;
    }
}


/* =========================================================
   MEGA MENU TITLE (kateqoriya başlıqları)
   ========================================================= */
.dd-title {
    font-size: 12px;
    font-weight: 600;
    color: rgba(11,18,32,.70);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: 10px;
    white-space: nowrap;
}


/* =========================================================
   MEGA MENU LINKS (təlim adları)
   ========================================================= */
.dd-link {
    display: block;
    width: max-content; /* ⬅️ ƏSAS FIX */
    box-sizing: border-box; /* padding daxil hesablansın */

    padding: 8px 10px;
    border-radius: 10px;
    font-size: 14px;
    line-height: 1.35;
    color: rgba(11,18,32,.86);
    white-space: nowrap;
    text-overflow: ellipsis;
    min-height: 38px;
    transition: background .2s ease;
}

    /* Hover – indi BÜTÜN səth reaksiya verir */
    .dd-link:hover {
        background: rgba(15,23,42,.06);
    }




/* =========================================================
   MEGA MENU FOOTER
   ========================================================= */
.dd-note {
    font-size: 13px;
    color: var(--muted);
}


.dd-footer {
    border-top: 1px solid var(--border);
}

.btn-premium {
    background: var(--navy);
    color: #fff;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 14px;
    padding: 10px 16px;
    font-weight: 600;
    letter-spacing: .2px;
    box-shadow: 0 12px 25px rgba(15,23,42,.16);
    transition: transform .12s ease, box-shadow .2s ease, opacity .2s ease;
}

    .btn-premium:hover {
        background-color: #171414;
        transform: translateY(-1px);
        box-shadow: 0 18px 35px rgba(15,23,42,.20);
        opacity: .98;
        color: #4cff00;
    }

.btn-outline-premium {
    border-radius: 12px;
    border: 1px solid var(--border);
    background: rgba(255,255,255,.8);
}

.btn-ghost {
    border-radius: 14px;
    border: 1px solid var(--border);
    background: rgba(255,255,255,.65);
    color: rgba(11,18,32,.90);
    transition: background .2s ease;
}

    .btn-ghost:hover {
        background: rgba(255,255,255,.95);
    }

/* ===================== Offcanvas ===================== */


/* =========================
   MOBILE MENU – BASE
========================= */

.offcanvas-premium {
    background: linear-gradient(180deg, #0f172a, #020617);
    color: #e5e7eb;
}

    .offcanvas-premium .offcanvas-header {
        background: rgba(255,255,255,.04);
    }

/* =========================
   MAIN LINKS
========================= */

.m-link {
    display: block;
    padding: 12px 6px;
    font-weight: 500;
    color: #e5e7eb;
    text-decoration: none;
    border-bottom: 1px solid rgba(255,255,255,.06);
}

    .m-link:hover {
        color: #38bdf8;
    }

/* =========================
   ACCORDION HEADERS
========================= */

.offcanvas-premium .accordion-item {
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(255,255,255,.06);
}

.offcanvas-premium .accordion-button {
    background: transparent;
    color: #f8fafc;
    font-weight: 600;
    padding: 14px 6px;
    box-shadow: none;
}

    .offcanvas-premium .accordion-button::after {
        filter: invert(1);
        transform: scale(.85);
    }

    .offcanvas-premium .accordion-button:not(.collapsed) {
        color: #38bdf8;
    }

/* =========================
   ACCORDION BODY
========================= */

.offcanvas-premium .accordion-body {
    padding: 10px 6px 14px;
}

/* sub links */
.m-sublink {
    display: block;
    padding: 8px 0 8px 14px;
    font-size: 14px;
    color: #cbd5f5;
    text-decoration: none;
    position: relative;
}

    .m-sublink::before {
        content: "";
        position: absolute;
        left: 0;
        top: 50%;
        width: 6px;
        height: 6px;
        background: #38bdf8;
        border-radius: 50%;
        transform: translateY(-50%);
        opacity: .6;
    }

    .m-sublink:hover {
        color: #38bdf8;
    }

/* =========================
   CTA BUTTON
========================= */

.offcanvas-premium .btn-premium {
    background: linear-gradient(135deg,#38bdf8,#6366f1);
    border: none;
    font-weight: 600;
}

/* =========================
   SOCIAL ICONS
========================= */

.m-social a {
    font-size: 20px;
    color: #94a3b8;
    margin: 0 8px;
}

    .m-social a:hover {
        color: #38bdf8;
    }


.brand-logo-sm {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    object-fit: contain;
}

.offcanvas-premium .brand-name {
    font-weight: 700;
}

.offcanvas-premium .brand-sub {
    font-size: 12px;
    opacity: .75;
    margin-top: -2px;
}



.m-group {
    margin-top: 14px;
}

.m-group-title {
    font-size: 12px;
    letter-spacing: .8px;
    text-transform: uppercase;
    opacity: .70;
    margin: 10px 0;
}





/* ===================== Hero ===================== */
.hero-premium {
    position: relative;
    padding: 64px 0 44px;
    background: radial-gradient(900px 400px at 20% 10%, rgba(198,161,91,.22), transparent 55%), radial-gradient(900px 500px at 90% 0%, rgba(255,255,255,.20), transparent 55%), linear-gradient(180deg, var(--navy), #0B1220);
    color: rgba(255,255,255,.92);
    overflow: hidden;
}



.hero-title {
    font-family: "Playfair Display", serif;
    font-weight: 700;
    letter-spacing: .2px;
    margin-top: 14px;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.08;
}

.hero-text {
    margin-top: 14px;
    color: rgba(255,255,255,.78);
    font-size: 16px;
    max-width: 56ch;
}

.hero-cta {
    margin-top: 22px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.hero-metrics {
    margin-top: 28px;
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
}

.metric {
    padding: 12px 14px;
    border-radius: 16px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.10);
}

.metric-val {
    font-weight: 800;
    letter-spacing: .4px;
}

.metric-label {
    font-size: 12px;
    opacity: .75;
}

/* Hero form card */
.hero-card {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 22px;
    padding: 22px;
    box-shadow: 0 24px 70px rgba(0,0,0,.28);
}

.hero-card-title {
    font-weight: 800;
    letter-spacing: .2px;
    font-size: 18px;
}

.hero-card-text {
    font-size: 13px;
    opacity: .78;
    margin-top: 6px;
}

.hero-form {
    margin-top: 14px;
    display: grid;
    gap: 10px;
}

    .hero-form input, .hero-form select {
        width: 100%;
        border-radius: 14px;
        padding: 12px 12px;
        border: 1px solid rgba(255,255,255,.14);
        background: rgba(15,23,42,.55);
        color: rgba(255,255,255,.92);
        outline: none;
    }

        .hero-form input::placeholder {
            color: rgba(255,255,255,.60);
        }

    .hero-form button {
        border-radius: 14px;
        border: 1px solid rgba(255,255,255,.14);
        background: linear-gradient(90deg, rgba(198,161,91,.98), rgba(198,161,91,.82));
        color: #0B1220;
        font-weight: 800;
        padding: 12px 14px;
        transition: transform .12s ease, opacity .2s ease;
    }

        .hero-form button:hover {
            transform: translateY(-1px);
            opacity: .98;
        }

.hero-card-note {
    margin-top: 12px;
    font-size: 12px;
    opacity: .75;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ===================== Sections ===================== */
.section-premium {
    padding: 56px 0;
    background: linear-gradient(180deg,#fafbff,#ffffff);
}

.section-alt {
    background: #FFFFFF;
}

.section-head {
    margin-bottom: 22px;
    text-align: center;
}

.section-title {
    font-family: "Playfair Display", serif;
    font-weight: 700;
    letter-spacing: .2px;
    font-size: 30px;
}

.section-sub {
    margin-top: 6px;
    color: var(--muted);
    max-width: 70ch;
}

/* Program cards */
.p-card {
    display: block;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 22px;
    padding: 18px 18px 16px;
    box-shadow: 0 12px 40px rgba(15,23,42,.06);
    transition: transform .14s ease, box-shadow .2s ease, border-color .2s ease;
    height: 100%;
}

    .p-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 22px 70px rgba(15,23,42,.10);
        border-color: rgba(198,161,91,.35);
    }

.p-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.p-pill {
    font-size: 12px;
    font-weight: 700;
    color: rgba(15,23,42,.75);
    background: rgba(198,161,91,.14);
    border: 1px solid rgba(198,161,91,.22);
    padding: 6px 10px;
    border-radius: 999px;
}

.p-card-top i {
    font-size: 20px;
    color: rgba(15,23,42,.55);
}

.p-card-title {
    font-weight: 800;
    color: rgba(11,18,32,.92);
    font-size: 18px;
}

.p-card-text {
    margin-top: 8px;
    color: var(--muted);
    font-size: 14px;
}

.p-card-cta {
    margin-top: 14px;
    font-weight: 700;
    color: rgba(15,23,42,.86);
}

/* CTA block */
.cta-premium {
    display: flex;
    gap: 18px;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    border: 1px solid var(--border);
    border-radius: 24px;
    padding: 22px;
    background: radial-gradient(800px 300px at 10% 20%, rgba(198,161,91,.16), transparent 55%), linear-gradient(180deg, rgba(15,23,42,.02), rgba(15,23,42,.00));
}

.cta-title {
    font-weight: 900;
    margin: 0;
    letter-spacing: .2px;
}

.cta-text {
    margin: 6px 0 0;
    color: var(--muted);
    max-width: 70ch;
}

/* ===================== Footer ===================== */
.footer-premium {
    background: #0B1220;
    color: rgba(255,255,255,.82);
    padding: 44px 0 22px;
}

.footer-brand {
    display: flex;
    gap: 12px;
    align-items: center;
}

.footer-logo {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    object-fit: contain;
}

.footer-title {
    font-weight: 800;
}

.footer-sub {
    font-size: 13px;
    opacity: .75;
    margin-top: 2px;
}

.footer-contacts div {
    margin-top: 8px;
    font-size: 14px;
}

.footer-contacts i {
    margin-right: 8px;
    opacity: .9;
}

.footer-col-title {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .8px;
    opacity: .70;
    margin-bottom: 10px;
    font-weight: 800;
}

.footer-link {
    display: block;
    padding: 8px 0;
    color: rgba(255,255,255,.78);
}

    .footer-link:hover {
        color: #fff;
    }

.footer-note {
    font-size: 13px;
    opacity: .75;
    margin-bottom: 10px;
}

.footer-form {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

    .footer-form input {
        flex: 1;
        min-width: 220px;
        border-radius: 14px;
        padding: 12px 12px;
        border: 1px solid rgba(255,255,255,.12);
        background: rgba(255,255,255,.06);
        color: rgba(255,255,255,.92);
        outline: none;
    }

    .footer-form button {
        border-radius: 14px;
        padding: 12px 14px;
        border: 1px solid rgba(255,255,255,.12);
        background: #00fd54;
        font-weight: 900;
        color: #0B1220;
    }

.footer-social a {
    display: inline-flex;
    width: 40px;
    height: 40px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,.85);
    margin-right: 10px;
}

    .footer-social a:hover {
        color: #fff;
        background: rgba(255,255,255,.06);
    }

.footer-bottom {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,.10);
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

    .footer-bottom a {
        color: #00fd54;
    }

/* ===================== WhatsApp float ===================== */
.wa-float {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 9999;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 999px;
    background: rgba(15,23,42,.92);
    color: #fff;
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 18px 45px rgba(15,23,42,.25);
    transition: transform .12s ease, opacity .2s ease;
}

    .wa-float i {
        font-size: 18px;
        color: #00fd54;
    }

    .wa-float:hover {
        transform: translateY(-2px);
        opacity: .98;
        color: #fff;
    }

/* ===================== Mobile tweaks ===================== */
@media (max-width: 991px) {
    .navbar-premium {
        padding: 12px 0;

    }

    .brand-text {
        display: none !important;
    }

    .hero-premium {
        padding: 52px 0 34px;
    }

    .section-premium {
        padding: 46px 0;
    }
}




/* Optional: icon-free, clean look already aligned */





.about-hero {
    padding: 80px 0 60px;
    background: radial-gradient(900px 300px at 20% 10%, rgba(198,161,91,.18), transparent 60%), linear-gradient(180deg, var(--navy), #0B1220);
    color: #fff;
}

    .about-hero h1 {
        font-family: "Playfair Display", serif;
        font-size: clamp(34px,4vw,52px);
        line-height: 1.1;
        margin-top: 14px;
    }

    .about-hero p {
        max-width: 60ch;
        opacity: .8;
        margin-top: 12px;
    }

.value-card {
    background: #fff;
    border-radius: 20px;
    padding: 22px;
    border: 1px solid var(--border);
}

    .value-card h3 {
        font-weight: 800;
    }

.metric-box {
    padding: 20px;
}

.metric-val {
    font-size: 34px;
    font-weight: 900;
}

.metric-label {
    color: var(--muted);
}

.team-card {
    background: #fff;
    border-radius: 24px;
    padding: 24px;
    text-align: center;
    border: 1px solid var(--border);
}

    .team-card img {
        width: 96px;
        height: 96px;
        border-radius: 50%;
        object-fit: cover;
    }

    .team-card h3 {
        margin-top: 14px;
        font-weight: 800;
    }

    .team-card span {
        display: block;
        font-size: 13px;
        color: var(--muted);
    }

    .team-card a {
        margin-top: 12px;
        display: inline-block;
        font-weight: 700;
    }

.clients-premium {
    padding: 40px 0;
    background: #fff;
}

.clients-note {
    text-align: center;
    color: var(--muted);
    margin-bottom: 18px;
}

.clients-logos {
    display: flex;
    gap: 28px;
    justify-content: center;
    flex-wrap: wrap;
    opacity: .7;
}

    .clients-logos img {
        height: 36px;
        filter: grayscale(100%);
    }















/* ================= BLOG ================= */

.blog-hero {
    padding: 70px 0 50px;
    background: radial-gradient(800px 300px at 20% 10%, rgba(198,161,91,.18), transparent 60%), linear-gradient(180deg, var(--navy), #0B1220);
    color: #fff;
}

    .blog-hero h1 {
        font-family: "Playfair Display", serif;
        font-size: clamp(32px,4vw,48px);
        margin-top: 14px;
    }

    .blog-hero p {
        max-width: 60ch;
        opacity: .8;
        margin-top: 10px;
    }

.blog-card {
    background: #fff;
    border-radius: 24px;
    padding: 26px;
    border: 1px solid var(--border);
    transition: transform .15s ease, box-shadow .2s ease;
}

    .blog-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 20px 60px rgba(15,23,42,.10);
    }

    .blog-card h2 {
        font-size: 22px;
        font-weight: 800;
    }

        .blog-card h2 a {
            color: var(--text);
        }

    .blog-card p {
        margin-top: 10px;
        color: var(--muted);
    }

.blog-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
}

.blog-date {
    font-size: 13px;
    color: var(--muted);
}

.read-more {
    font-weight: 800;
    color: var(--navy);
}

.pagination-premium {
    display: flex;
    gap: 10px;
    justify-content: center;
}

    .pagination-premium .page {
        width: 38px;
        height: 38px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--border);
    }

        .pagination-premium .page.active {
            background: var(--navy);
            color: #fff;
        }

/* Sidebar */
.blog-sidebar {
    background: #fff;
    border-radius: 24px;
    padding: 24px;
    border: 1px solid var(--border);
}

    .blog-sidebar h3 {
        font-size: 14px;
        letter-spacing: .8px;
        text-transform: uppercase;
        font-weight: 800;
        margin-bottom: 12px;
    }

    .blog-sidebar ul {
        list-style: none;
        padding: 0;
    }

    .blog-sidebar li a {
        display: block;
        padding: 8px 0;
        color: var(--text);
    }

.tag-cloud a {
    display: inline-block;
    margin: 4px 6px 0 0;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(198,161,91,.14);
    font-size: 12px;
    font-weight: 700;
}

/* Article */
.article-hero {
    padding: 80px 0 40px;
    background: #fff;
    border-bottom: 1px solid var(--border);
}

    .article-hero h1 {
        font-family: "Playfair Display", serif;
        font-size: clamp(30px,4vw,44px);
    }

.article-meta {
    font-size: 13px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .8px;
}

.article-image {
    width: 100%;
    border-radius: 24px;
    margin-bottom: 24px;
}

.article-text {
    font-size: 17px;
    line-height: 1.8;
}

    .article-text p {
        margin-bottom: 18px;
    }

.article-footer {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
}

.article-categories span {
    font-size: 13px;
    margin-right: 10px;
    color: var(--muted);
}

.article-tags a {
    margin-right: 8px;
    font-size: 13px;
    font-weight: 700;
}








/* ================= CONTACT ================= */

.contact-hero {
    padding: 80px 0 60px;
    background: radial-gradient(800px 300px at 20% 10%, rgba(198,161,91,.18), transparent 60%), linear-gradient(180deg, var(--navy), #0B1220);
    color: #fff;
}

    .contact-hero h1 {
        font-family: "Playfair Display", serif;
        font-size: clamp(34px,4vw,52px);
        line-height: 1.1;
        margin-top: 14px;
    }

    .contact-hero p {
        max-width: 60ch;
        opacity: .8;
        margin-top: 12px;
    }

.contact-card {
    background: #fff;
    border-radius: 28px;
    padding: 32px;
    border: 1px solid var(--border);
    box-shadow: 0 30px 80px rgba(15,23,42,.12);
}

    .contact-card h2 {
        font-weight: 900;
    }

.contact-note {
    color: var(--muted);
    margin-top: 6px;
}

.contact-form label {
    font-size: 13px;
    font-weight: 700;
    color: var(--muted);
}

.contact-form input,
.contact-form textarea {
    width: 100%;
    border-radius: 14px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    margin-top: 6px;
}

    .contact-form input:focus,
    .contact-form textarea:focus {
        outline: none;
        border-color: rgba(198,161,91,.6);
    }

.form-status {
    margin-top: 16px;
    font-weight: 700;
    color: var(--navy);
}

.contact-info-card {
    background: linear-gradient(180deg,#fff, #f9fafb);
    border-radius: 28px;
    padding: 28px;
    border: 1px solid var(--border);
}

    .contact-info-card h3 {
        font-weight: 900;
    }

    .contact-info-card p {
        color: var(--muted);
        margin-top: 8px;
    }

.contact-info {
    margin-top: 22px;
}

    .contact-info div {
        margin-bottom: 14px;
    }

    .contact-info span {
        font-size: 12px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .8px;
        color: var(--muted);
    }

















/* ===== TRAINING PAGE ===== */

.training-hero {
    padding: 80px 0 60px;
    background: radial-gradient(900px 300px at 20% 10%, rgba(198,161,91,.18), transparent 60%), linear-gradient(180deg, var(--navy), #0B1220);
    color: #fff;
}

    .training-hero h1 {
        font-family: "Playfair Display", serif;
        font-size: clamp(36px,4vw,52px);
    }

    .training-hero p {
        max-width: 60ch;
        opacity: .8;
    }

.accordion-premium .accordion-item {
    border-radius: 18px;
    border: 1px solid var(--border);
    margin-bottom: 12px;
    overflow: hidden;
}

.training-info-card,
.trainer-card {
    background: #fff;
    border-radius: 24px;
    padding: 24px;
    border: 1px solid var(--border);
}

    .training-info-card ul {
        list-style: none;
        padding: 0;
    }

    .training-info-card li {
        margin-bottom: 10px;
        font-weight: 600;
    }

.trainer {
    display: flex;
    gap: 12px;
    align-items: center;
}

    .trainer img {
        width: 56px;
        height: 56px;
        border-radius: 50%;
        object-fit: cover;
    }

.request-card {
    max-width: 720px;
    margin: 0 auto;
    background: #fff;
    padding: 32px;
    border-radius: 28px;
    border: 1px solid var(--border);
    box-shadow: 0 30px 80px rgba(15,23,42,.12);
}

    .request-card input,
    .request-card textarea {
        width: 100%;
        margin-top: 12px;
        padding: 14px;
        border-radius: 14px;
        border: 1px solid var(--border);
    }






/* ===== SPECIAL OFFER ===== */

.offer-hero {
    padding: 90px 0 60px;
    background: radial-gradient(900px 300px at 20% 10%, rgba(198,161,91,.18), transparent 60%), linear-gradient(180deg, var(--navy), #0B1220);
    color: #fff;
}

    .offer-hero h1 {
        font-family: "Playfair Display", serif;
        font-size: clamp(36px,4vw,52px);
        line-height: 1.1;
        margin-top: 14px;
    }

    .offer-hero p {
        max-width: 60ch;
        opacity: .8;
        margin-top: 12px;
    }

.offer-card {
    max-width: 760px;
    margin: 0 auto;
    background: #fff;
    padding: 36px;
    border-radius: 28px;
    border: 1px solid var(--border);
    box-shadow: 0 30px 80px rgba(15,23,42,.12);
}

    .offer-card h2 {
        font-weight: 900;
    }

.offer-note {
    margin-top: 6px;
    color: var(--muted);
}

.offer-card label {
    font-size: 13px;
    font-weight: 800;
    color: var(--muted);
    margin-top: 16px;
    display: block;
}

.offer-card input,
.offer-card textarea,
.offer-card select {
    width: 100%;
    margin-top: 6px;
    padding: 14px;
    border-radius: 14px;
    border: 1px solid var(--border);
}

    .offer-card input:focus,
    .offer-card textarea:focus,
    .offer-card select:focus {
        outline: none;
        border-color: rgba(198,161,91,.6);
    }

.phone-input {
    display: flex;
    align-items: center;
}

    .phone-input span {
        padding: 14px;
        border: 1px solid var(--border);
        border-radius: 14px 0 0 14px;
        background: #f9fafb;
    }

    .phone-input input {
        border-radius: 0 14px 14px 0;
        border-left: none;
    }








/* ===== HERO ===== */
.training-hero {
    background: radial-gradient(1200px 400px at 50% -100px, rgba(255,255,255,.12), transparent), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    color: #fff;
    padding: 120px 0 110px;
    position: relative;
}

.hero-inner {
    max-width: 820px;
    margin: 0 auto;
    text-align: center;
}

.training-hero h1 {
    font-size: 52px;
    font-weight: 700;
    line-height: 1.15;
    margin-bottom: 20px;
    letter-spacing: -.5px;
}

.training-hero p {
    font-size: 18px;
    line-height: 1.7;
    opacity: .9;
    max-width: 700px;
    margin: 0 auto;
}

/* BADGE */
.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 22px;
    border-radius: 40px;
    background: rgba(255,255,255,.14);
    backdrop-filter: blur(6px);
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 22px;
}

/* MOBILE */
@media (max-width: 768px) {
    .training-hero {
        padding: 90px 0 80px;
    }

        .training-hero h1 {
            font-size: 36px;
        }

        .training-hero p {
            font-size: 16px;
        }
}


/* ===== FILTER NOTE ===== */
.training-filter-note {
    background: #f4f7fb;
    padding: 18px 25px;
    border-radius: 14px;
    font-size: 16px;
    text-align: center;
}

/* ===== CARD ===== */
.training-card {
    background: #fff;
    border-radius: 18px;
    padding: 28px;
    height: 100%;
    box-shadow: 0 10px 30px rgba(0,0,0,.06);
    transition: .35s ease;
    position: relative;
    overflow: hidden;
}

    .training-card::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(120deg,#27ae60,#2ecc71);
        opacity: 0;
        transition: .35s;
    }

    .training-card:hover {
        transform: translateY(-8px);
    }

        .training-card:hover::before {
            opacity: .05;
        }

.training-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.training-card h3 {
    font-size: 22px;
    font-weight: 600;
}

/* TAG */
.tag {
    font-size: 12px;
    padding: 5px 12px;
    border-radius: 20px;
    background: #eef2f7;
    font-weight: 600;
}

/* META */
.training-meta {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    margin: 18px 0;
    color: #555;
}

/* BUTTONS */
.btn-premium-outline {
    border: 2px solid #27ae60;
    color: #27ae60;
    font-weight: 600;
    border-radius: 30px;
    padding: 10px;
}

    .btn-premium-outline:hover {
        background: #27ae60;
        color: #fff;
    }

/* ===== SPECIAL CARD ===== */
.training-card-alt {
    background: linear-gradient(135deg,#f7971e,#ffd200);
    color: #222;
}

    .training-card-alt .tag {
        background: rgba(0,0,0,.15);
        color: #000;
    }

    .training-card-alt .btn-premium {
        background: #000;
        color: #fff;
        border-radius: 30px;
        font-weight: 600;
    }

/* ===== CTA ===== */
.training-cta {
    background: linear-gradient(135deg,#141e30,#243b55);
    color: #fff;
    padding: 90px 0;
}

    .training-cta h2 {
        font-size: 38px;
        font-weight: 700;
    }













/* HERO */
.audit-hero {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    color: #fff;
    padding: 90px 20px;
}

    .audit-hero h1 {
        font-size: 48px;
        font-weight: 800;
    }

    .audit-hero h2 {
        font-size: 22px;
        opacity: .9;
        margin-top: 10px
    }

/* CONTAINER */
.audit-wrap {
    max-width: 1150px;
    margin: auto
}

/* SECTION */
.audit-section {
    background: var(--bg);
    padding: 80px 20px
}

.audit-text {
    line-height: 1.75;
    color: var(--muted);
    margin-bottom: 25px
}

/* INFO GRID */
.audit-info {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(240px,1fr));
    gap: 20px;
    margin: 40px 0
}

    .audit-info div {
        background: #fff;
        border-radius: 14px;
        padding: 22px;
        box-shadow: 0 10px 30px rgba(0,0,0,.08);
        font-weight: 600
    }

/* CREDIBILITY */
.icfm-cred {
    background: #fff;
    border-radius: 18px;
    padding: 35px;
    margin: 50px 0;
    box-shadow: 0 15px 40px rgba(0,0,0,.12);
}

.icfm-cred-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(220px,1fr));
    gap: 25px
}

.icfm-card {
    border-left: 6px solid var(--primary);
    padding-left: 18px
}

/* PDF */
.pdf-box {
    background: linear-gradient(135deg,#ecfeff,#f0fdf4);
    border-radius: 16px;
    padding: 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 40px 0
}

    .pdf-box a {
        padding: 12px 26px;
        border-radius: 30px;
        background: var(--primary);
        color: #fff;
        text-decoration: none;
        font-weight: 700
    }

/* ACCORDION */
.audit-accordion {
    max-width: 1000px;
    margin: 40px auto;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.audit-item {
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 12px 30px rgba(0,0,0,.08);
    overflow: hidden;
    border: 1px solid #e5e7eb;
}

.audit-header {
    width: 100%;
    background: transparent;
    border: none;
    padding: 22px 26px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

    .audit-header .left {
        display: flex;
        align-items: center;
        gap: 18px;
    }
    
.module-badge {
    background: linear-gradient(135deg,#16a34a,#22c55e);
    color: #fff;
    font-weight: 700;
    padding: 8px 14px;
    border-radius: 10px;
    font-size: 14px;
}

.audit-header .title {
    font-size: 18px;
    font-weight: 700;
    color: #0f172a;
}

.audit-header .arrow {
    font-size: 20px;
    transition: transform .35s ease;
    color: #64748b;
}

.audit-item.active .arrow {
    transform: rotate(180deg);
}

.audit-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s ease;
    background: #f8fafc;
}

    .audit-body ul {
        padding: 22px 30px 30px;
        list-style: none;
        margin: 0;
    }

    .audit-body li {
        padding: 10px 0;
        border-bottom: 1px dashed #e5e7eb;
        font-size: 15px;
        color: #334155;
    }

        .audit-body li:last-child {
            border-bottom: none;
        }


/* CTA */
.audit-cta {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    color: #fff;
    padding: 70px 20px;
    text-align: center
}

    .audit-cta a {
        background: #fff;
        color: #14532d;
        padding: 14px 36px;
        border-radius: 40px;
        font-weight: 800;
        text-decoration: none
    }

@media(max-width:768px) {
    .audit-hero h1 {
        font-size: 34px
    }
}



.diploma-hero {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    color: #fff;
    padding: 100px 0;
    text-align: center;
}



.diploma-about,
.diploma-info,
.diploma-program,
.diploma-cta {
    padding: 80px 0;
}

    .diploma-info .grid {
        display: grid;
        grid-template-columns: repeat(auto-fit,minmax(280px,1fr));
        gap: 30px;
    }

.info-card {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    border-radius: 18px;
    padding: 30px;
    box-shadow: 0 20px 40px rgba(0,0,0,.08);
}

    .info-card ul {
        list-style: none;
        padding: 0;
    }

    .info-card li {
        padding: 10px 0;
        border-bottom: 1px dashed #e5e7eb;
    }

        .info-card li.active {
            font-weight: 700;
            color: #16a34a;
        }

.audit-accordion {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.audit-item {
    background: #fff;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 15px 30px rgba(0,0,0,.08);
    overflow: hidden;
}

.audit-header {
    width: 100%;
    padding: 22px 26px;
    border: none;
    background: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.module-badge {
    background: #16a34a;
    color: #fff;
    padding: 8px 14px;
    border-radius: 10px;
    font-weight: 700;
}

.audit-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s ease;
    background: #f8fafc;
}

    .audit-body ul {
        padding: 25px 30px;
        list-style: none;
    }

.audit-item.active .audit-body {
    max-height: 500px;
}

.audit-item.active .arrow {
    transform: rotate(180deg);
}

.arrow {
    transition: .3s;
}

.diploma-cta {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    color: #fff;
    text-align: center;
}

.btn-primary {
    display: inline-block;
    margin-top: 20px;
    padding: 16px 36px;
    background: #16a34a;
    color: #fff;
    border-radius: 40px;
    text-decoration: none;
    font-weight: 700;
}










/* ================= PMS PREMIUM ================= */
.pms-hero {
    position: relative;
    padding: 90px 0 70px;
    color: #fff;
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    overflow: hidden;
}

.pms-glow {
    position: absolute;
    inset: -40% -30% auto auto;
    width: 520px;
    height: 520px;
    background: radial-gradient(circle, rgba(46, 204, 113,.35), transparent 60%);
    filter: blur(20px);
    pointer-events: none;
}

.pms-hero-wrap {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 28px;
    align-items: stretch;
}

.pms-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 16px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.18);
    font-size: 14px;
    margin-bottom: 14px;
}

.pms-hero h1 {
    font-size: 44px;
    line-height: 1.12;
    margin: 0 0 12px 0;
    font-weight: 800;
    letter-spacing: .2px;
}

.pms-lead {
    font-size: 18px;
    opacity: .92;
    max-width: 680px;
    margin: 0 0 18px 0;
}

.pms-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 18px 0 22px;
}

.pms-mini-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}

.pms-stat {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 14px;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.16);
    min-width: 190px;
}

    .pms-stat i {
        font-size: 18px;
        opacity: .95;
    }

    .pms-stat .k {
        font-weight: 800;
    }

    .pms-stat .v {
        font-size: 12px;
        opacity: .85;
        margin-top: 2px;
    }

.pms-side-card {
    height: 100%;
    border-radius: 18px;
    padding: 18px 18px 16px;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.16);
    backdrop-filter: blur(10px);
}

.pms-side-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

    .pms-side-head .ic {
        width: 44px;
        height: 44px;
        border-radius: 14px;
        display: grid;
        place-items: center;
        background: rgba(255,255,255,.14);
        border: 1px solid rgba(255,255,255,.16);
    }

    .pms-side-head .t {
        font-weight: 800;
    }

    .pms-side-head .s {
        font-size: 12px;
        opacity: .85;
    }

.pms-side-text {
    font-size: 14px;
    opacity: .92;
    line-height: 1.55;
    margin: 0 0 12px;
}

.pms-side-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

    .pms-side-pills .pill {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 8px 10px;
        border-radius: 999px;
        background: rgba(0,0,0,.18);
        border: 1px solid rgba(255,255,255,.12);
        font-size: 12px;
    }

.pms-download {
    margin-top: 12px;
    border-radius: 18px;
    padding: 14px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.14);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

    .pms-download .l {
        display: flex;
        align-items: center;
        gap: 12px;
    }

    .pms-download .ic2 {
        width: 44px;
        height: 44px;
        border-radius: 14px;
        display: grid;
        place-items: center;
        background: rgba(255,255,255,.14);
        border: 1px solid rgba(255,255,255,.16);
    }

    .pms-download .t {
        font-weight: 800;
    }

    .pms-download .s {
        font-size: 12px;
        opacity: .85;
    }

.pms-grid-2 {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 22px;
    align-items: start;
}

.pms-card {
    background: #fff;
    border-radius: 18px;
    padding: 22px;
    box-shadow: 0 20px 45px rgba(0,0,0,.06);
    border: 1px solid rgba(0,0,0,.06);
}

.pms-card-alt {
    background: linear-gradient(180deg, #ffffff, #fbfbfb);
}

.pms-h2 {
    font-size: 22px;
    margin: 0 0 12px;
    font-weight: 900;
    letter-spacing: .2px;
}

.pms-note {
    margin: 14px 0 12px;
    padding: 12px 14px;
    border-radius: 14px;
    background: rgba(13,110,253,.08);
    border: 1px solid rgba(13,110,253,.15);
    display: flex;
    gap: 10px;
    align-items: flex-start;
    color: #153a7a;
}

    .pms-note i {
        margin-top: 2px;
    }

.pms-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .pms-list li {
        display: flex;
        gap: 10px;
        padding: 10px 0;
        border-bottom: 1px dashed rgba(0,0,0,.10);
    }

        .pms-list li:last-child {
            border-bottom: none;
        }

.pms-soft {
    margin-top: 14px;
    padding: 14px;
    border-radius: 16px;
    background: rgba(46,204,113,.08);
    border: 1px solid rgba(46,204,113,.18);
    display: flex;
    gap: 10px;
    align-items: flex-start;
    color: #135c35;
}

    .pms-soft i {
        margin-top: 2px;
    }

/* ===== Premium Accordion ===== */
.pms-accordion {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 8px;
}

.pms-item {
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,.08);
    background: #fff;
}

.pms-head {
    width: 100%;
    border: none;
    background: linear-gradient(180deg, #ffffff, #fbfbfb);
    padding: 14px 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    text-align: left;
}

    .pms-head .n {
        width: 42px;
        height: 42px;
        border-radius: 14px;
        display: grid;
        place-items: center;
        font-weight: 900;
        background: rgba(13,110,253,.10);
        color: #0d6efd;
    }

    .pms-head .t {
        flex: 1;
        font-weight: 800;
    }

    .pms-head .c {
        width: 38px;
        height: 38px;
        border-radius: 14px;
        display: grid;
        place-items: center;
        background: rgba(0,0,0,.04);
        border: 1px solid rgba(0,0,0,.06);
        transition: transform .25s ease;
    }

.pms-item.open .pms-head .c {
    transform: rotate(180deg);
}

.pms-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height .28s ease;
    background: #fff;
}

.pms-steps {
    display: grid;
    gap: 12px;
    padding: 14px 14px 16px;
}

    .pms-steps .step {
        border-radius: 14px;
        padding: 12px 12px 10px;
        background: rgba(0,0,0,.03);
        border: 1px solid rgba(0,0,0,.06);
    }

    .pms-steps .st {
        font-weight: 900;
        margin-bottom: 8px;
    }

    .pms-steps ul {
        margin: 0;
        padding-left: 18px;
    }

    .pms-steps li {
        margin: 6px 0;
    }

.pms-benefits {
    list-style: none;
    padding: 14px;
    margin: 0;
    display: grid;
    gap: 12px;
}

    .pms-benefits li {
        display: flex;
        gap: 10px;
        align-items: flex-start;
        padding: 12px;
        border-radius: 14px;
        background: rgba(46,204,113,.08);
        border: 1px solid rgba(46,204,113,.18);
    }

    .pms-benefits i {
        margin-top: 2px;
    }

/* CTA */
.pms-cta {
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: space-between;
    padding: 26px;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.06));
    border: 1px solid rgba(255,255,255,.16);
    color: #fff;
}

    .pms-cta h2 {
        margin: 0 0 8px 0;
        font-weight: 900;
    }

    .pms-cta p {
        margin: 0;
        opacity: .9;
        max-width: 720px;
    }

/* Responsive */
@media (max-width: 992px) {
    .pms-hero-wrap {
        grid-template-columns: 1fr;
    }

    .pms-grid-2 {
        grid-template-columns: 1fr;
    }

    .pms-cta {
        flex-direction: column;
        align-items: flex-start;
    }

    .pms-hero h1 {
        font-size: 36px;
    }
}





/* ===== HERO ===== */
.training-hero-management {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    padding: 90px 0;
    color: #fff;
}

.hero-badge {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    padding: 6px 18px;
    background: rgba(255,255,255,.15);
    border-radius: 30px;
    font-size: 14px;
}

.hero-sub {
    max-width: 620px;
    margin: 16px auto 0;
    opacity: .9;
}

/* ===== ACCORDION ===== */
.accordion-premium .accordion-item {
    border: none;
    margin-bottom: 12px;
    border-radius: 14px;
    background: #f8fafc;
}

.accordion-premium .accordion-button {
    font-weight: 600;
    background: #f8fafc;
    display: flex;
    gap: 12px;
}

.lesson-num {
    font-weight: 700;
    color: #2563eb;
}

/* ===== INFO CARD ===== */
.info-card {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    color: #fff;
    padding: 26px;
    border-radius: 18px;
}

.info-list {
    list-style: none;
    padding-left: 0;
}

    .info-list li {
        padding: 8px 0;
        border-bottom: 1px solid rgba(255,255,255,.08);
    }

/* ===== TRAINER ===== */
.trainer-card {
    background: #f8fafc;
    padding: 22px;
    border-radius: 18px;
    margin-top: 24px;
}

.trainer {
    display: flex;
    align-items: center;
    gap: 12px;
}

    .trainer img {
        width: 52px;
        height: 52px;
        border-radius: 50%;
        object-fit: cover;
    }





/* ===== SALES HERO ===== */
.training-hero-sales {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    padding: 90px 0;
    color: #fff;
}

    .training-hero-sales .hero-sub {
        max-width: 640px;
        margin: 18px auto 0;
        opacity: .9;
    }

/* ===== SALES ACCENT ===== */
.info-card-sales {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
}

/* Reuse from previous pages */
.lesson-num {
    font-weight: 700;
    color: #22c55e;
}





/* ===== DIGITAL SALES HERO ===== */
.training-hero-digital {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    padding: 90px 0;
    color: #fff;
}

    .training-hero-digital .hero-sub {
        max-width: 680px;
        margin: 18px auto 0;
        opacity: .9;
    }

/* ===== DIGITAL INFO CARD ===== */
.info-card-digital {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
}

/* shared */
.lesson-num {
    font-weight: 700;
    color: #22c55e;
}


/* ===== STRATEGY HERO ===== */
.training-hero-strategy {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    padding: 90px 0;
    color: #fff;
}

    .training-hero-strategy .hero-sub {
        max-width: 720px;
        margin: 18px auto 0;
        opacity: .9;
    }

/* ===== INFO CARD ===== */
.info-card-strategy {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
}

/* ===== SHARED ===== */
.lesson-num {
    font-weight: 700;
    color: #60a5fa;
}


/* ===== TEAM HERO ===== */
.training-hero-team {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    padding: 90px 0;
    color: #fff;
}

    .training-hero-team .hero-sub {
        max-width: 720px;
        margin: 18px auto 0;
        opacity: .9;
    }

/* ===== INFO CARD ===== */
.info-card-team {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
}

/* ===== SHARED ===== */
.lesson-num {
    font-weight: 700;
    color: #38bdf8;
}


/* ===== TIME HERO ===== */
.training-hero-time {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    padding: 90px 0;
    color: #fff;
}

    .training-hero-time .hero-sub {
        max-width: 720px;
        margin: 18px auto 0;
        opacity: .9;
    }

/* ===== INFO CARD ===== */
.info-card-time {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
}

/* ===== TABLE ===== */
.table-premium {
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
}

    .table-premium thead {
        background: #0f172a;
        color: #fff;
    }

    .table-premium th,
    .table-premium td {
        padding: 14px;
        border: none;
    }

/* ===== SHARED ===== */
.lesson-num {
    font-weight: 700;
    color: #38bdf8;
}



/* ===== MANAGEMENT HERO ===== */
.training-hero-management {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
    padding: 90px 0;
    color: #fff;
}

    .training-hero-management .hero-sub {
        max-width: 760px;
        margin: 18px auto 0;
        opacity: .9;
    }

/* ===== INFO CARD ===== */
.info-card-management {
    background: radial-gradient(900px 500px at 15% 20%, rgba(255,255,255,.18), transparent 60%), linear-gradient(135deg,#0f2027,#203a43,#2c5364);
}

/* ===== SHARED ===== */
.lesson-num {
    font-weight: 700;
    color: #22d3ee;
}








.up-slider-section {
    padding: 40px 0;
}

.up-slider-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    margin-bottom: 16px;
}

    .up-slider-head h2 {
        margin: 0;
        font-size: 28px;
    }

    .up-slider-head p {
        margin: 4px 0 0;
        opacity: .7;
    }

.up-all {
    text-decoration: none;
    opacity: .85;
}

    .up-all:hover {
        opacity: 1;
    }

.up-slide-card {
    position: relative;
    display: flex;
    gap: 16px;
    padding: 18px;
    border-radius: 22px;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: 0 18px 60px rgba(0,0,0,.25);
    height: 100%;
}

.up-date {
    min-width: 64px;
    text-align: center;
    border-radius: 16px;
    background: rgba(255,255,255,.1);
    padding: 8px;
}

    .up-date .day {
        font-size: 22px;
        font-weight: 800;
    }

    .up-date .month {
        font-size: 12px;
        text-transform: uppercase;
        opacity: .7;
    }

.up-body h3 {
    margin: 6px 0 8px;
    font-size: 18px;
}

.up-tags {
    display: flex;
    gap: 6px;
}

.tag {
    font-size: 11px;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.1);
}

    .tag.hot {
        background: rgba(255,70,70,.35);
    }

.up-trainer {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

    .up-trainer img {
        width: 30px;
        height: 30px;
        border-radius: 50%;
        object-fit: cover;
    }

.up-meta {
    display: flex;
    gap: 14px;
    font-size: 13px;
    opacity: .8;
}

.up-progress {
    height: 5px;
    background: rgba(255,255,255,.15);
    border-radius: 5px;
    overflow: hidden;
    margin-top: 8px;
}

    .up-progress .bar {
        height: 100%;
        background: linear-gradient(90deg,#fff,#bbb);
    }

.up-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
    margin-left: 18px;
}

.price {
    font-weight: 800;
}

.btn {
    padding: 8px 14px;
    border-radius: 14px;
    border: 1px solid rgb(0 0 0 / 20%);
    text-decoration: none;
    color: #fff;
}

.up-countdown {
    margin-top: 6px;
    font-size: 12px;
    opacity: .7;
}
    /* Swiper */
    .upSwiper .swiper-slide {
        height: auto;
    }
    /*===== HOME BLOG PREMIUM ===== */


    .home-blog-premium {
        padding: 80px 0;
    }

    .home-blog-head {
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        gap: 30px;
        margin-bottom: 40px;
        flex-wrap: wrap;
    }

        .home-blog-head h2 {
            font-size: 34px;
            margin: 10px 0 8px;
            letter-spacing: -0.4px;
        }

        .home-blog-head p {
            max-width: 520px;
            opacity: .75;
        }




.see-all {
    --c: rgba(15,23,42,.85);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-radius: 999px;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    color: var(--c);
    background: rgba(15,23,42,.04);
    border: 1px solid rgba(15,23,42,.08);
    opacity: 1;
    transition: background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease, color .2s ease;
}

    /* icon (əgər varsa) */
    .see-all i {
        font-size: 15px;
        transition: transform .2s ease;
    }

    /* hover */
    .see-all:hover {
        background: rgba(15,23,42,.08);
        border-color: rgba(15,23,42,.18);
        box-shadow: 0 8px 22px rgba(15,23,42,.18);
        transform: translateY(-1px);
        color: rgba(15,23,42,1);
    }

        /* hover icon micro-anim */
        .see-all:hover i {
            transform: translateX(3px);
        }

    /* active (click hissi) */
    .see-all:active {
        transform: translateY(0);
        box-shadow: 0 4px 10px rgba(15,23,42,.14);
    }




    .home-blog-grid {
        display: grid;
        grid-template-columns: 1.4fr 1fr;
        gap: 30px;
    }
    /* FEATURED */
    .blog-featured {
        padding: 32px;
        border-radius: 28px;
        background: rgba(255,255,255,.05);
        border: 1px solid rgba(255,255,255,.14);
        box-shadow: 0 30px 90px rgba(0,0,0,.35);
    }

        .blog-featured .post-tag {
            font-size: 12px;
            padding: 5px 12px;
            border-radius: 999px;
            background: rgba(255,255,255,.12);
        }

        .blog-featured h3 {
            font-size: 24px;
            margin: 16px 0 12px;
        }

        .blog-featured p {
            opacity: .78;
            line-height: 1.6;
        }

        .blog-featured .meta {
            display: flex;
            gap: 16px;
            margin-top: 16px;
            font-size: 13px;
            opacity: .7;
        }
    /* MINI LIST */
    .blog-list-mini {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    .blog-mini {
        padding: 22px;
        border-radius: 22px;
        background: rgba(255,255,255,.03);
        border: 1px solid rgba(255,255,255,.12);
        transition: transform .2s ease;
    }

        .blog-mini:hover {
            transform: translateY(-4px);
        }

        .blog-mini h4 {
            margin: 0 0 6px;
            font-size: 16px;
        }

        .blog-mini span {
            font-size: 12px;
            opacity: .6;
        }
    /* RESPONSIVE */
    @media (max-width: 900px) {
        .home-blog-grid {
            grid-template-columns: 1fr;
        }

        .home-blog-head {
            align-items: flex-start;
        }
    }
    /*Blog Details*/

    .related-articles h2 {
        margin-bottom: 24px;
    }

    .related-card {
        padding: 22px;
        border-radius: 22px;
        background: rgba(255,255,255,.04);
        border: 1px solid rgba(255,255,255,.14);
        height: 100%;
    }

        .related-card h4 {
            margin-bottom: 8px;
            font-size: 16px;
        }

        .related-card .date {
            font-size: 12px;
            opacity: .6;
        }
    /* ===== HOME Trainer tranings list PREMIUM ===== */

    .upc-section {
        padding: 60px 0;
    }

    .upc-head {
        text-align: center;
        margin-bottom: 35px;
    }

        .upc-head h1 {
            font-size: 34px;
            font-weight: 800;
        }

    .upc-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
        gap: 22px;
    }

    .upc-card {
        background: #fff;
        border-radius: 18px;
        padding: 20px;
        box-shadow: 0 20px 35px rgba(0,0,0,.06);
        transition: .25s ease;
        position: relative;
    }

        .upc-card:hover {
            transform: translateY(-6px);
            box-shadow: 0 25px 45px rgba(0,0,0,.12);
        }

    .upc-top {
        display: flex;
        gap: 8px;
        margin-bottom: 12px;
    }

    .badgesup {
        background: #00fd54;
        padding: 6px 10px;
        border-radius: 999px;
        font-size: 12px;
    }

    .badge.hot {
        background: #fff0ec;
        color: #e8503a;
    }

    .upc-card h3 {
        font-size: 18px;
        margin: 6px 0 10px;
        line-height: 1.35;
    }

    .upc-trainer {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 14px;
    }

        .upc-trainer img {
            width: 34px;
            height: 34px;
            border-radius: 50%;
            object-fit: cover;
        }

    .upc-info {
        display: grid;
        gap: 6px;
        margin-bottom: 14px;
        font-size: 13px;
        color: #666;
    }

    .upc-footer {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 6px;
    }

    .price {
        font-size: 18px;
        font-weight: 800;
    }

    .upc-btn {
        background: #3b5cff;
        color: #fff;
        padding: 8px 14px;
        border-radius: 999px;
        font-size: 14px;
        transition: .2s;
    }

        .upc-btn:hover {
            background: #1f38e5;
        }

    .upc-empty {
        text-align: center;
        margin-top: 40px;
        color: #777;
    }


.topbar-test {
    font-weight: 500;
    color: inherit;
    text-decoration: none;
    opacity: .9;
    transition: opacity .2s ease, transform .2s ease;
}

    .topbar-test:hover {
        opacity: 1;
        transform: translateY(-1px);
    }




.hero-intel {
    background: rgba(255,255,255,.18);
    border-radius: 20px;
    padding: 28px;
    box-shadow: 0 30px 80px rgba(0,0,0,.08);
}

.hi-title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 18px;
}

.hi-options {
    display: grid;
    gap: 12px;
}

    .hi-options button {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 14px 16px;
        border-radius: 14px;
        border: 1px solid #e5e7eb;
        background: #fff;
        font-size: 15px;
        font-weight: 500;
        cursor: pointer;
        transition: all .25s ease;
    }

        .hi-options button:hover {
            border-color: #111;
            transform: translateY(-1px);
        }

.hi-result {
    margin-top: 22px;
    font-size: 15px;
    line-height: 1.55;
    display: none;
}

@media (max-width: 576px) {

    .hero-intel {
        padding: 18px;
        border-radius: 16px;
        box-shadow: 0 18px 48px rgba(0,0,0,.08);
    }

    .hi-title {
        font-size: 16px;
        text-align: center;
        margin-bottom: 14px;
    }

    .hi-options {
        gap: 10px;
    }

        .hi-options button {
            padding: 12px 14px;
            font-size: 14px;
            border-radius: 12px;
            color: #0a0a0a;
        }

            .hi-options button i {
                font-size: 18px;
                min-width: 20px;
                text-align: center;
               
            }

            /* Mobil hover yoxdu — klik fokus effekti */
            .hi-options button:active {
                transform: scale(.97);
                border-color: #111;
            }

    .hi-result {
        margin-top: 16px;
        font-size: 14px;
        line-height: 1.6;
    }
}


/* =========================
   POST TRAINING IMPACT
   ========================= */

.post-impact {
    padding: 96px 0;
    background: linear-gradient( 180deg, #0b1220 0%, #0e1628 100% );
    color: #e5e7eb;
    position: relative;
}

.post-impact-head {
    max-width: 720px;
    margin: 0 auto 64px;
    text-align: center;
}

.post-impact-badge {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 12px;
    letter-spacing: .04em;
    text-transform: uppercase;
    background: rgba(255,255,255,.08);
    color: #c7d2fe;
    margin-bottom: 14px;
}

.post-impact-head h2 {
    font-size: clamp(28px, 3vw, 40px);
    line-height: 1.2;
    margin-bottom: 12px;
    font-weight: 600;
}

.post-impact-head p {
    font-size: 16px;
    color: rgba(229,231,235,.75);
}

/* GRID */
.post-impact-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

@media (max-width: 992px) {
    .post-impact-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .post-impact-grid {
        grid-template-columns: 1fr;
    }
}

/* CARD */
.impact-card {
    background: rgba(255,255,255,.03);
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 18px;
    padding: 28px;
    transition: transform .3s ease, border-color .3s ease;
}

    .impact-card:hover {
        transform: translateY(-4px);
        border-color: rgba(99,102,241,.4);
    }

.impact-step {
    display: inline-block;
    font-size: 12px;
    letter-spacing: .12em;
    color: #a5b4fc;
    margin-bottom: 12px;
}

.impact-card h4 {
    font-size: 18px;
    margin-bottom: 8px;
    font-weight: 500;
}

.impact-card p {
    font-size: 14.5px;
    line-height: 1.6;
    color: rgba(229,231,235,.75);
}

/* NOTE */
.post-impact-note {
    margin-top: 48px;
    text-align: center;
    font-size: 15px;
    color: rgba(229,231,235,.6);
}










.section-test-cta {
    padding: 4rem 0;
    background: linear-gradient(135deg, #f7f9fc, #eef2ff);
}

.cta-test {
    display: flex;
    gap: 18px;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    border: 1px solid var(--border);
    border-radius: 24px;
    padding: 22px;
    background: radial-gradient(800px 300px at 10% 20%, rgba(198, 161, 91, .16), transparent 55%), linear-gradient(180deg, rgba(15, 23, 42, .02), rgba(15, 23, 42, .00));
}

.btn-test {
    background: var(--navy);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 14px;
    padding: 10px 16px;
    font-weight: 600;
    letter-spacing: .2px;
    box-shadow: 0 12px 25px rgba(15, 23, 42, .16);
    transition: transform .12s ease, box-shadow .2s ease, opacity .2s ease;
}

    .btn-test:hover {
        background-color: #171414;
        transform: translateY(-1px);
        box-shadow: 0 18px 35px rgba(15,23,42,.20);
        opacity: .98;
        color: #4cff00;
    }




/* === AITM MODAL SYSTEM === */
/* === FORCE MODAL VISIBILITY FIX === */














/* Article typography polish */
.article-text {
    font-size: 1.06rem;
    line-height: 1.9;
    letter-spacing: .1px;
    color: #1b1f23;
}

    .article-text p {
        margin: 0 0 1.05rem 0;
    }

        .article-text p:last-child {
            margin-bottom: 0;
        }

    /* Abzas hissi: ilk sətir içəri girsin (klassik kitab üslubu) */
    .article-text p {
        text-indent: 1.25em;
    }

        /* Amma paraqrafdan sonra yeni başlıq kimi hiss olunmasın deyə:
   birinci paraqrafı indent etmə */
        .article-text p:first-child {
            text-indent: 0;
        }

    /* Uzun sətirlər göz yorur: linklər */
    .article-text a {
        text-decoration: underline;
        text-underline-offset: 3px;
    }

/* Mobil oxunaqlılıq */
@media (max-width: 576px) {
    .article-text {
        font-size: 1rem;
        line-height: 1.85;
    }

        .article-text p {
            text-indent: 1.1em;
            margin-bottom: 0.95rem;
        }
}

.blogcolor {
    color: #0F172A;
}





/* =========================
   Mobile Account Block
   ========================= */

.m-account {
    padding: 14px;
    border-top: 1px solid rgba(255,255,255,.08);
}

/* Header (icon + name) */
.m-account-head {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-radius: 12px;
    background: rgba(255,255,255,.06);
    border: none;
    color: #fff;
}

    .m-account-head i {
        font-size: 28px;
        color: #fff;
        opacity: .9;
    }

.m-account-name {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
}

.m-account-sub {
    font-size: 12px;
    color: rgba(255,255,255,.6);
}

/* Links */
.m-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    margin-bottom: 6px;
    border-radius: 10px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    background: rgba(255,255,255,.04);
    transition: background .15s ease, transform .05s ease;
}

    .m-link i {
        font-size: 16px;
        opacity: .85;
    }

    .m-link:active {
        transform: scale(.98);
    }

    .m-link:hover {
        background: rgba(255,255,255,.08);
    }

/* Logout button */
.m-account form button {
    margin-top: 6px;
    font-size: 14px;
    border-radius: 10px;
}

/* Login button (guest) */
.m-account .mybtn {
    border-radius: 12px;
    font-size: 14px;
    padding: 12px;
}

/* =========================
   Only Mobile
   ========================= */
@media (min-width: 992px) {
    .m-account {
        display: none;
    }
}

.m-account-meta {
    flex: 1;
    text-align: left;
}

.m-account-caret {
    font-size: 14px;
    transition: transform .2s ease;
}

/* menu hidden by default */
.m-account-menu {
    display: none;
    margin-top: 8px;
}

/* open state */
.m-account.open .m-account-menu {
    display: block;
}

.m-account.open .m-account-caret {
    transform: rotate(180deg);
}
.badges {
    color: #0b1220;
}