/* ============================================================
   Future University — Main Stylesheet
   نسخة محسّنة وموحّدة — بدون تعارضات
   ============================================================ */


/* ============================================================
   CSS Custom Properties (متغيرات CSS)
   ============================================================ */

:root {
    --fu-blue:         #0056A8;
    --fu-blue-dark:    #003d73;
    --fu-blue-deep:    #082b52;
    --fu-yellow:       #ffea00;
    --fu-yellow-dark:  #f1c40f;
    --fu-light:        #f5faff;
    --fu-light-2:      #eef7ff;
    --fu-border:       rgba(0, 86, 168, 0.14);
    --fu-text:         #17304d;
    --fu-muted:        #5f7287;
    --fu-white:        #ffffff;
    --fu-shadow:       0 12px 30px rgba(0, 86, 168, 0.12);
    --fu-shadow-lg:    0 25px 70px rgba(0, 0, 0, 0.42);
    --fu-radius:       18px;
    --fu-font:         'Cairo', 'Tajawal', 'Segoe UI', Tahoma, Arial, sans-serif;

    /* Home page accent tokens */
    --home-primary:        #0f5fb6;
    --home-secondary:      #123c7a;
    --home-accent:         #ffea00;
    --home-accent-2:       #5ee7ff;
    --home-surface:        rgba(255, 255, 255, 0.12);
    --home-surface-strong: rgba(255, 255, 255, 0.18);
    --home-border:         rgba(255, 255, 255, 0.22);
    --home-shadow:         0 15px 45px rgba(0, 0, 0, 0.18);
    --home-radius:         22px;

    /* Atom */
    --fu-gold:      #FFEA00;
    --fu-gold-soft: #f1c40f;
    --fu-cyan:      #5ee7ff;
}


/* ============================================================
   1. Reset & Base
   ============================================================ */

html,
body {
    margin:  0;
    padding: 0;
}

body {
    font-family: var(--fu-font);
    line-height: 1.7;
    direction:   rtl;
}

body.no-scroll {
    overflow: hidden !important;
}


/*
    .container-fluid::before{
        content:'';
        position:absolute;
        inset:0;
        background-image:
          linear-gradient(rgba(11,79,179,0.04) 1px, transparent 1px),
          linear-gradient(90deg, rgba(11,79,179,0.04) 1px, transparent 1px);
        background-size:35px 35px;
    }
*/



 
a,
a:hover,
a:focus,
a:active {
    text-decoration: none;
    color: inherit;
}

.unstyled-list,
.unstyled-list ol,
.unstyled-list ul {
    list-style: none;
}

.content-area { color: #333; }

.hidden { display: none; }

/* fixed-center helper — used by preloader only */
.centeredd {
    position: relative;
    top:       auto;
    left:      auto;
    transform: none;
    z-index:   2;
}


/* ============================================================
   2. Cards — Generic UI
   ============================================================ */

.specialty-cards-container {
    display:         flex;
    flex-wrap:       wrap;
    justify-content: center;
    gap:             25px;
    padding:         30px 0;
    max-width:       1300px;
    margin:          0 auto;
}

.specialty-card {
    flex:             1 1 320px;
    max-width:        100%;
    background-color: #fff;
    border-radius:    12px;
    overflow:         hidden;
    box-shadow:       0 6px 15px rgba(0, 0, 0, 0.15);
    transition:       transform 0.3s ease, box-shadow 0.3s ease;
    cursor:           pointer;
    display:          flex;
    flex-direction:   column;
    height:           auto;
}

.specialty-card:hover {
    transform:  translateY(-8px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.25);
}

.card-image-wrapper {
    position:            relative;
    width:               100%;
    padding-bottom:      60%;
    background-size:     cover;
    background-position: center;
    background-repeat:   no-repeat;
    flex-shrink:         0;
    border-top-left-radius:  12px;
    border-top-right-radius: 12px;
}

.fallback-img {
    position:                absolute;
    inset:                   0;
    width:                   100%;
    height:                  100%;
    object-fit:              cover;
    border-top-left-radius:  12px;
    border-top-right-radius: 12px;
}

.card-overlay {
    position:                absolute;
    inset:                   0;
    background:              linear-gradient(to bottom, rgba(31, 66, 114, 0.6), rgba(12, 21, 107, 0.5));
    border-top-left-radius:  12px;
    border-top-right-radius: 12px;
}

.card-content {
    padding:               20px;
    text-align:            center;
    flex-grow:             1;
    display:               flex;
    align-items:           center;
    justify-content:       center;
    background-color:      #f8f9fa;
    border-bottom-left-radius:  12px;
    border-bottom-right-radius: 12px;
}

.card-title {
    font-size:   clamp(1.1rem, 2vw, 1.5rem);
    color:       #1a2a4b;
    margin:      0 0 0.5em;
    line-height: 1.4;
    font-weight: 600;
    word-break:  break-word;
    text-wrap:   balance;
}

.card-body { padding: 8px; }

.specialty-card a {
    text-decoration: none;
    color:           inherit;
    display:         flex;
    flex-direction:  column;
    height:          100%;
}

/* Buttons */
.custom-btn {
    display:         inline-block;
    padding:         0.8rem;
    font-size:       1.1rem;
    font-weight:     600;
    border-radius:   50px;
    text-align:      center;
    cursor:          pointer;
    background-color: #007bff;
    color:           #fff;
    border:          2px solid #007bff;
    transition:      all 0.3s ease-in-out;
    margin-top:      15px;
}

.custom-btn:hover,
.custom-btn:focus {
    background-color: #ffc107;
    color:            #333;
    border-color:     #ffc107;
    box-shadow:       0 8px 16px rgba(0, 0, 0, 0.2);
    transform:        translateY(-3px);
}

.btn-dark,
.btn-dark:hover {
    color:            #fff;
    background-color: #0d6efd;
    border-color:     #0d6efd;
}

/* Modal header sticky */
.modal-header {
    position:         sticky;
    top:              0;
    z-index:          1051;
    background-color: #fff;
    border-bottom:    1px solid #dee2e6;
    margin-bottom:    1.75rem;
}

/* Card responsive breakpoints */
@media (max-width: 639px) {
    .specialty-card {
        flex:      0 0 95%;
        max-width: 95%;
    }
}

@media (min-width: 640px) {
    .specialty-card {
        flex:      0 0 calc(50% - 12.5px);
        max-width: calc(50% - 12.5px);
    }
}


/* ============================================================
   3. Section Headings
   ============================================================ */

/* v1 — dark banner */
.minimal-section {
    padding:          2.5rem 1rem;
    background-color: #121212;
    border-bottom:    5px solid #00bcd4;
    text-align:       center;
}

.minimal-section .main-heading {
    font-size:      2.5rem;
    color:          #fff;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.minimal-section .sub-heading {
    font-size:  1.1rem;
    color:      #e0e0e0;
    margin-top: 0.5rem;
    font-style: italic;
    opacity:    0.8;
}

/* v2 & v3 — shared structure */
.minimal-section-v2,
.minimal-section-v3 {
    padding:    1.5rem;
    text-align: center;
}

.minimal-section-v2 .title-wrapper,
.minimal-section-v3 .title-wrapper {
    display:         flex;
    align-items:     center;
    justify-content: center;
    margin-bottom:   1rem;
}

.minimal-section-v2 .title-wrapper::before,
.minimal-section-v2 .title-wrapper::after,
.minimal-section-v3 .title-wrapper::before,
.minimal-section-v3 .title-wrapper::after {
    content: '';
    flex:    1;
    margin:  0 1em;
    opacity: 0.6;
}

.minimal-section-v2 .title-wrapper::before,
.minimal-section-v2 .title-wrapper::after {
    border-bottom: solid 2px #007bff;
}

.minimal-section-v3 .title-wrapper::before,
.minimal-section-v3 .title-wrapper::after {
    border-bottom: solid 2px #fff;
}

/* v2 headings */
.minimal-section-v2 .main-heading {
    font-size:      clamp(1.7rem, 4.2vw, 2.7rem);
    color:          #0275d8;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight:    700;
    margin:         0;
}

.minimal-section-v2 .sub-heading {
    font-size:   clamp(1rem, 1.5vw, 1.2rem);
    color:       #000;
    margin-top:  0.75rem;
    line-height: 1.6;
}

/* v3 headings */
.minimal-section-v3 .main-heading {
    font-size:      clamp(2rem, 5vw, 3rem);
    color:          #fff;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight:    700;
    margin:         0;
}

.minimal-section-v3 .sub-heading {
    font-size:   clamp(1rem, 3vw, 1.25rem);
    color:       #e0e0e0;
    margin-top:  0.75rem;
    line-height: 1.6;
}

/* Shared underline bar */
.minimal-section-v2 .sub-heading::after,
.minimal-section-v3 .sub-heading::after {
    content:       '';
    display:       block;
    width:         100px;
    height:        4px;
    margin:        10px auto 0;
    border-radius: 2px;
}

.minimal-section-v2 .sub-heading::after { background-color: #007bff; }
.minimal-section-v3 .sub-heading::after { background-color: #fff; }

/* Distinctive frame */
.distinctive-frame {
    border:           2px solid #eee;
    padding:          20px;
    margin:           30px 0;
    border-radius:    8px;
    background-color: #fff;
    box-shadow:       0 4px 8px rgba(0, 0, 0, 0.1);
}

.distinctive-frame h2 { color: #333; }
.distinctive-frame p  { line-height: 1.6; }

@media (max-width: 768px) {
    .minimal-section .main-heading { font-size: 2rem; }
    .minimal-section .sub-heading  { font-size: 1rem; }
    .minimal-section-v2,
    .minimal-section-v3             { padding: 1rem; }
}


/* ============================================================
   4. Page Layout — Content / Sidebar Column
   ============================================================ */

.main-content-area {
    padding-top:    28px;
    padding-bottom: 36px;
    background:     #fff;
}

/* Desktop: both columns show normally */
@media (min-width: 1200px) {
    .sub-pages-column,
    .main-content-column { display: block; }

    .sub-pages-column {
        position:   sticky;
        top:        20px;
        max-height: calc(100vh - 40px);
        overflow-y: auto;
        overflow-x: hidden;
        direction:  ltr; /* scrollbar on the right edge */
    }

    .sub-pages-column > * { direction: rtl; }

    /* Slim custom scrollbar */
    .sub-pages-column::-webkit-scrollbar       { width: 6px; }
    .sub-pages-column::-webkit-scrollbar-track { background: transparent; border-radius: 10px; }
    .sub-pages-column::-webkit-scrollbar-thumb { background: #003b70; border-radius: 10px; }
    .sub-pages-column::-webkit-scrollbar-thumb:hover { background: var(--fu-blue); }
}

/* Tablet & Mobile: sidebar becomes a floating modal */
@media (max-width: 1199.98px) {
    .sub-pages-column {
        position: absolute !important;
        right:    0;
        top:      0;
        width:    0 !important;
        height:   0 !important;
        padding:  0 !important;
        margin:   0 !important;
        z-index:  999;
    }

    .main-content-column {
        flex:         0 0 100% !important;
        max-width:    100% !important;
        margin-right: 0 !important;
        margin-left:  0 !important;
        padding-right: 15px !important;
        padding-left:  15px !important;
    }
}


/* ============================================================
   5. Share Icons
   ============================================================ */

/* One unified ruleset — removes duplicate blocks */
.page-share-icons {
    display:     flex;
    align-items: center;
    gap:         12px;
    margin:      0 0 22px;
    padding:     10px 0;
    direction:   ltr;
    font-family: var(--fu-font);
    font-size:   1rem;
    color:       var(--fu-text);
}

.page-share-icons span {
    font-size:   0.95rem;
    font-weight: 800;
    color:       var(--fu-text);
    margin-left: 10px;
}

.page-share-icons a {
    width:            32px;
    height:           32px;
    display:          inline-flex;
    align-items:      center;
    justify-content:  center;
    font-size:        1.2rem;
    color:            var(--fu-blue);
    background:       #fff;
    border:           1px solid var(--fu-border);
    border-radius:    50%;
    text-decoration:  none;
    transition:       all 0.25s ease;
}

.page-share-icons a:hover {
    color:       var(--fu-blue-deep);
    background:  var(--fu-yellow);
    border-color: var(--fu-yellow);
    transform:   translateY(-2px);
    box-shadow:  0 8px 18px rgba(0, 86, 168, 0.16);
}


/* ============================================================
   6. Breadcrumb
   ============================================================ */

.breadcrumb-full-width-bar {
    width:      100%;
    background: linear-gradient(to left, var(--fu-blue), var(--fu-blue-dark));
    margin:     0;
    padding:    10px 0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.breadcrumb-list {
    display:          flex;
    flex-wrap:        wrap;
    padding:          0;
    margin:           0;
    list-style:       none;
    background-color: transparent;
    direction:        rtl;
    text-align:       right;
    font-size:        1rem;
}

.breadcrumb-item {
    display:     flex;
    align-items: center;
    padding:     0;
    color:       #fff;
    transition:  all 0.3s ease;
}

.breadcrumb-item + .breadcrumb-item { padding-right: 2px; }

.breadcrumb-item + .breadcrumb-item::before {
    content:     "\f100";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    padding:     0 0.3rem;
    color:       var(--fu-yellow);
}

.breadcrumb-item:first-child::before { content: none; }

.breadcrumb-item a {
    color:           #fff;
    text-decoration: none;
    display:         flex;
    align-items:     center;
    transition:      color 0.3s ease, transform 0.3s ease;
}

.breadcrumb-item a:hover {
    color:           var(--fu-yellow);
    text-decoration: underline;
    transform:       translateY(-2px);
}

.breadcrumb-item a i.fas.fa-home {
    font-size:   1.1em;
    margin-left: 0.3rem;
    color:       #fff;
}

.breadcrumb-item.active {
    font-weight:     bold;
    color:           #ccc;
    pointer-events:  none;
}

.breadcrumb-item.active a { color: #ddd; }

@media (max-width: 768px) {
    .breadcrumb-full-width-bar {
        padding:    6px 0;
        overflow-x: auto;
    }

    .breadcrumb-list {
        flex-wrap:                  nowrap !important;
        white-space:                nowrap;
        overflow-x:                 auto;
        overflow-y:                 hidden;
        -webkit-overflow-scrolling: touch;
    }

    .breadcrumb-item { flex-shrink: 0; }

    .breadcrumb-item a {
        overflow:      hidden;
        text-overflow: ellipsis;
        white-space:   nowrap;
        max-width:     150px;
        display:       inline-block;
    }

    .breadcrumb-item + .breadcrumb-item::before {
        padding:   0 0.25rem;
        font-size: 0.85em;
    }
}


/* ============================================================
   7. Sidebar Menu
   ============================================================ */

.sub-pages-hierarchy {
    margin:       0 0 30px;
    padding:      0;
    direction:    rtl;
    text-align:   right;
    background:   var(--fu-white);
    border-radius: var(--fu-radius);
    border:       1px solid var(--fu-border);
    box-shadow:   var(--fu-shadow);
    overflow:     hidden;
    font-family:  var(--fu-font);
}

.sub-pages-hierarchy h3 {
    margin:       0;
    padding:      15px 16px;
    font-size:    1rem;
    line-height:  1.6;
    font-weight:  900;
    color:        #fff;
    text-align:   center;
    background:   linear-gradient(135deg, var(--fu-blue), var(--fu-blue-dark));
    border-bottom: 4px solid var(--fu-yellow);
}

.sub-pages-hierarchy ul {
    list-style: none;
    margin:     0;
    padding:    0;
}

.sub-pages-hierarchy li { position: relative; }

.sub-pages-hierarchy a {
    display:         flex;
    align-items:     center;
    gap:             10px;
    padding:         13px 16px;
    color:           var(--fu-text);
    font-size:       0.93rem;
    line-height:     1.65;
    font-weight:     750;
    text-decoration: none;
    background:      #fff;
    border-bottom:   1px solid rgba(0, 86, 168, 0.08);
    transition:      background-color 0.25s ease, color 0.25s ease,
                     padding-right 0.25s ease, box-shadow 0.25s ease;
}

.sub-pages-hierarchy a::before {
    content:     "\f104";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color:       var(--fu-blue);
    font-size:   0.76rem;
    flex:        0 0 auto;
    transition:  transform 0.25s ease, color 0.25s ease;
}

.sub-pages-hierarchy a:hover {
    background:   var(--fu-light-2);
    color:        var(--fu-blue);
    padding-right: 22px;
}

.sub-pages-hierarchy a:hover::before {
    color:     var(--fu-yellow-dark);
    transform: translateX(-3px);
}

.sub-pages-hierarchy a:focus {
    outline:        2px solid var(--fu-yellow);
    outline-offset: -2px;
}

/* Nested children */
.sub-pages-hierarchy ul.children {
    display:      none;
    background:   #f7fbff;
    border-right: 4px solid rgba(255, 234, 0, 0.85);
}

.sub-pages-hierarchy li.current_page_item > ul.children,
.sub-pages-hierarchy li.current_page_parent > ul.children,
.sub-pages-hierarchy li.current_page_ancestor > ul.children,
.sub-pages-hierarchy li.active > ul.children {
    display:    block !important;
    max-height: none !important;
    overflow:   visible !important;
}

/* Level 2 */
.sub-pages-hierarchy ul.children > li > a {
    padding-right: 30px;
    background:    #f7fbff;
    color:         #004080;
    font-size:     0.88rem;
    font-weight:   700;
}

/* Level 3 */
.sub-pages-hierarchy ul.children ul.children {
    background:   #fff;
    border-right-color: rgba(0, 86, 168, 0.25);
}

.sub-pages-hierarchy ul.children ul.children > li > a {
    padding-right: 44px;
    font-size:     0.84rem;
    color:         #335f8a;
    background:    #fbfdff;
}

/* Active parent / ancestor */
.sub-pages-hierarchy li.current_page_parent > a,
.sub-pages-hierarchy li.current_page_ancestor > a,
.sub-pages-hierarchy li.active > a {
    background:  linear-gradient(135deg, var(--fu-blue), var(--fu-blue-dark)) !important;
    color:       #fff !important;
    font-weight: 900 !important;
    border-right: 5px solid var(--fu-yellow);
}

.sub-pages-hierarchy li.current_page_parent > a::before,
.sub-pages-hierarchy li.current_page_ancestor > a::before,
.sub-pages-hierarchy li.active > a::before {
    content:     "\f107";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color:       var(--fu-yellow) !important;
}

/* Current page */
.sub-pages-hierarchy li.current_page_item > a,
.sub-pages-hierarchy ul.children li.current_page_item > a,
.sub-pages-hierarchy ul.children ul.children li.current_page_item > a {
    background:  linear-gradient(135deg, var(--fu-yellow), var(--fu-yellow-dark)) !important;
    color:       var(--fu-blue-deep) !important;
    font-weight: 900 !important;
    border-right: 5px solid var(--fu-blue) !important;
}

.sub-pages-hierarchy li.current_page_item > a::before {
    content:     "\f00c";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color:       var(--fu-blue) !important;
}

/* Mobile floating button */
.mobile-sub-menu-button {
    display:       none;
    position:      fixed;
    bottom:        90px;
    left:          20px;
    width:         54px;
    height:        54px;
    border-radius: 50%;
    background:    linear-gradient(135deg, var(--fu-yellow), var(--fu-yellow-dark));
    color:         var(--fu-blue-deep);
    font-size:     1.25rem;
    z-index:       10000;
    cursor:        pointer;
    box-shadow:    0 10px 26px rgba(0, 0, 0, 0.28);
    align-items:   center;
    justify-content: center;
    border:        2px solid rgba(255, 255, 255, 0.72);
    transition:    all 0.25s ease;
}

.mobile-sub-menu-button:hover {
    transform:  translateY(-2px);
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.34);
}

.mobile-sub-menu-button i { position: absolute; font-family: "Font Awesome 5 Free"; font-weight: 900; }

.mobile-sub-menu-button .close-icon               { display: none; }
.mobile-sub-menu-button.open .open-icon            { display: none; }
.mobile-sub-menu-button.open .close-icon           { display: block; }

/* Overlay */
.mobile-menu-overlay {
    display:             none;
    position:            fixed;
    inset:               0;
    background:          rgba(0, 22, 48, 0.64);
    backdrop-filter:     blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.mobile-menu-overlay.active { display: block; }

body.fu-sub-menu-open { overflow: hidden; }

/* Desktop */
@media (min-width: 1200px) {
    .sub-pages-hierarchy {
        display:  block;
        position: sticky;
        top:      22px;
    }

    .mobile-sub-menu-button,
    .mobile-menu-overlay { display: none !important; }
}

/* Tablet + mobile — modal */
@media (max-width: 1199.98px) {
    .mobile-sub-menu-button { display: flex; }

    .sub-pages-hierarchy {
        display:       none;
        position:      fixed;
        top:           50%;
        left:          50%;
        width:         min(92vw, 420px);
        max-height:    78vh;
        margin:        0;
        transform:     translate(-50%, -50%);
        z-index:       9999;
        overflow-y:    auto;
        overflow-x:    hidden;
        border-radius: 20px;
        background:    #fff;
        border:        2px solid var(--fu-yellow);
        box-shadow:    var(--fu-shadow-lg);
        scrollbar-width: thin;
        scrollbar-color: var(--fu-yellow) rgba(0, 86, 168, 0.12);
    }

    .sub-pages-hierarchy.open  { display: block !important; }

    .sub-pages-hierarchy h3 {
        position: sticky;
        top:      0;
        z-index:  2;
        font-size: 0.98rem;
        padding:  14px 12px;
    }

    .sub-pages-hierarchy a                              { padding: 12px 16px; font-size: 0.9rem; line-height: 1.6; }
    .sub-pages-hierarchy ul.children > li > a           { padding-right: 28px; font-size: 0.86rem; }
    .sub-pages-hierarchy ul.children ul.children > li > a { padding-right: 40px; font-size: 0.82rem; }

    .sub-pages-hierarchy::-webkit-scrollbar            { width: 8px; }
    .sub-pages-hierarchy::-webkit-scrollbar-track      { background: rgba(0, 86, 168, 0.10); border-radius: 20px; }
    .sub-pages-hierarchy::-webkit-scrollbar-thumb      { background: linear-gradient(180deg, var(--fu-yellow), var(--fu-yellow-dark)); border-radius: 20px; border: 1px solid rgba(0, 0, 0, 0.12); }
    .sub-pages-hierarchy::-webkit-scrollbar-thumb:hover { background: #fff27a; }
}

@media (max-width: 575.98px) {
    .sub-pages-hierarchy {
        width:      min(94vw, 390px);
        max-height: 76vh;
    }

    .sub-pages-hierarchy a { font-size: 0.86rem; }

    .mobile-sub-menu-button {
        width:    50px;
        height:   50px;
        bottom:   76px;
        left:     14px;
        font-size: 1.12rem;
    }
}


/* ============================================================
   8. Posts & Pagination
   ============================================================ */

.main-post {
    border:     1px solid #b5b5b5;
    box-shadow: 2px 2px 2px #9c9b9b, -2px -2px 10px #9c9b9b;
}

.main-post .post-title { font-weight: bold; }
.main-post .post-img   { width: 100%; }
.main-post .categories { color: grey; }

.main-post .post-author,
.main-post .post-date,
.main-post .post-comment,
.main-post .categories { font-size: 0.9rem; }

.main-post .post-content { word-break: break-all; }

.post-pagination,
.pagination {
    display:         flex;
    justify-content: center;
    flex-wrap:       wrap;
    gap:             5px;
    margin-top:      30px;
    margin-bottom:   20px;
}

.post-pagination a,
.post-pagination span,
.pagination .page-numbers,
.pagination .prev,
.pagination .next {
    display:     inline-block;
    padding:     8px 16px;
    border:      1px solid #ddd;
    border-radius: 4px;
    color:       #0073aa;
    transition:  all 0.3s;
    text-align:  center;
    min-width:   40px;
}

.post-pagination .current,
.pagination .page-numbers.current {
    background:   #0073aa;
    color:        #fff !important;
    border-color: #0073aa;
}

.post-pagination a:hover,
.pagination .page-numbers:hover { background: #f5f5f5; }

.pagination .prev,
.pagination .next { color: #333; border-color: transparent; }

.pagination .prev:hover,
.pagination .next:hover { color: #0073aa; }

@media (max-width: 480px) {
    .post-pagination a,
    .post-pagination span { padding: 8px 12px; font-size: 14px; min-width: 35px; }

    .post-pagination .page-numbers:not(.current):not(.prev):not(.next) { display: none; }

    .post-pagination .prev,
    .post-pagination .next,
    .post-pagination .dots { display: inline-block !important; }

    .post-pagination .dots { padding: 8px 5px; }
}


/* ============================================================
   9. Animations — Jump / Atom / Timeline
   ============================================================ */

/* Floating jump */
.jumpimgg {
    position:  relative;
    animation: glide 1s ease-in-out alternate infinite;
}

@keyframes glide {
    from { transform: translateY(0); }
    to   { transform: translateY(12px); }
}

/* Atom */
.atom-wrap {
    display:         flex;
    justify-content: center;
    align-items:     center;
    padding:         20px;
}

@keyframes atomFloat {
    from { transform: translateY(0); }
    to   { transform: translateY(-10px); }
}

@keyframes atomPulse {
    0%   { filter: drop-shadow(0 0 8px rgba(255, 234, 0, 0.15)); }
    50%  { filter: drop-shadow(0 0 18px rgba(94, 231, 255, 0.28)); }
    100% { filter: drop-shadow(0 0 8px rgba(255, 234, 0, 0.15)); }
}

@keyframes electron-circle1 {
    from { transform: rotateY(70deg) rotateZ(20deg); }
    to   { transform: rotateY(70deg) rotateZ(380deg); }
}

@keyframes electron1 {
    from { transform: rotateZ(-20deg) rotateY(-70deg); }
    to   { transform: rotateZ(-380deg) rotateY(-70deg); }
}

@keyframes electron-circle2 {
    from { transform: rotateY(60deg) rotateX(60deg) rotateZ(-30deg); }
    to   { transform: rotateY(60deg) rotateX(60deg) rotateZ(330deg); }
}

@keyframes electron2 {
    from { transform: rotateZ(30deg) rotateX(-60deg) rotateY(-60deg); }
    to   { transform: rotateZ(-330deg) rotateX(-60deg) rotateY(-60deg); }
}

@keyframes electron-circle3 {
    from { transform: rotateY(-60deg) rotateX(60deg) rotateZ(100deg); }
    to   { transform: rotateY(-60deg) rotateX(60deg) rotateZ(460deg); }
}

@keyframes electron3 {
    from { transform: rotateZ(-100deg) rotateX(-60deg) rotateY(60deg); }
    to   { transform: rotateZ(-460deg) rotateX(-60deg) rotateY(60deg); }
}

.atom {
    position:         relative;
    width:            260px;
    height:           260px;
    margin:           10px auto;
    perspective:      800px;
    transform-style:  preserve-3d;
    animation:        atomFloat 2.6s ease-in-out infinite alternate,
                      atomPulse 3s ease-in-out infinite;
}

.atom::before {
    content:       '';
    position:      absolute;
    inset:         0;
    margin:        auto;
    width:         26px;
    height:        26px;
    border-radius: 50%;
    background:    radial-gradient(circle at 35% 35%, var(--fu-white), var(--fu-gold) 60%, #d4aa00 100%);
    box-shadow:    0 0 12px rgba(255, 234, 0, 0.6),
                   0 0 24px rgba(255, 234, 0, 0.35),
                   0 0 40px rgba(94, 231, 255, 0.18);
    z-index: 2;
}

.atom .electron {
    position:        absolute;
    inset:           0;
    margin:          auto;
    width:           110px;
    height:          110px;
    border-radius:   50%;
    border:          2px solid rgba(255, 255, 255, 0.16);
    box-shadow:      inset 0 0 10px rgba(94, 231, 255, 0.10), 0 0 14px rgba(0, 86, 168, 0.12);
    transform-style: preserve-3d;
}

.atom .electron::before {
    content:       '';
    position:      absolute;
    top:           -6px;
    left:          0;
    right:         0;
    margin:        auto;
    width:         12px;
    height:        12px;
    border-radius: 50%;
    background:    radial-gradient(circle at 35% 35%, var(--fu-white), var(--fu-cyan) 65%, var(--fu-blue) 100%);
    box-shadow:    0 0 10px rgba(94, 231, 255, 0.65), 0 0 18px rgba(94, 231, 255, 0.35);
    transform-origin: 50% 50% 0;
}

.atom .electron:nth-child(1) {
    width: 120px; height: 120px;
    border-color: rgba(255, 234, 0, 0.35);
    animation: electron-circle1 3.2s linear infinite;
}
.atom .electron:nth-child(1)::before {
    transform: rotateZ(-20deg) rotateY(-70deg);
    animation: electron1 3.2s linear infinite;
}

.atom .electron:nth-child(2) {
    width: 150px; height: 150px;
    border-color: rgba(94, 231, 255, 0.30);
    animation: electron-circle2 4s linear infinite;
}
.atom .electron:nth-child(2)::before {
    transform: rotateZ(30deg) rotateX(-60deg) rotateY(-60deg);
    animation: electron2 4s linear infinite;
}

.atom .electron:nth-child(3) {
    width: 180px; height: 180px;
    border-color: rgba(255, 255, 255, 0.20);
    animation: electron-circle3 4.8s linear infinite;
}
.atom .electron:nth-child(3)::before {
    transform: rotateZ(-100deg) rotateX(-60deg) rotateY(60deg);
    animation: electron3 4.8s linear infinite;
}

@media (max-width: 767.98px) {
    .atom { width: 190px; height: 190px; }
    .atom::before { width: 20px; height: 20px; }
    .atom .electron:nth-child(1) { width: 90px;  height: 90px;  }
    .atom .electron:nth-child(2) { width: 115px; height: 115px; }
    .atom .electron:nth-child(3) { width: 140px; height: 140px; }
    .atom .electron::before      { width: 10px;  height: 10px;  }
}

/* Timeline */
ul.timeline {
    list-style-type: none;
    position:        relative;
}

ul.timeline::before {
    content:  ' ';
    background: var(--fu-blue);
    display:  inline-block;
    position: absolute;
    right:    29px;
    width:    1px;
    height:   100%;
    z-index:  400;
}

ul.timeline > li {
    margin:       20px 0;
    padding-right: 20px;
}

ul.timeline > li::before {
    content:       ' ';
    background:    #fff;
    display:       inline-block;
    position:      absolute;
    border-radius: 50%;
    border:        3px solid #ffc107;
    right:         20px;
    width:         20px;
    height:        20px;
    z-index:       400;
}

/* Misc helpers */
.b-0 { bottom: 0; }

.bg-shadow {
    background: linear-gradient(to bottom,
        rgba(179,171,171,0)   0%,
        rgba(48,48,48,0.71)  49%,
        rgba(19,19,19,0.8)  100%);
}

.top-indicator {
    right:   0;
    top:     1rem;
    bottom:  inherit;
    left:    inherit;
    margin-right: 1rem;
}

.overflow       { position: relative; overflow: hidden; }
.zoom img       { transition: all 0.2s linear; }
.zoom:hover img { transform: scale(1.1); }


/* ============================================================
   10. Navbar
   ============================================================ */

.navbar,
.navbar-custom {
    border: 0;
    overflow: visible;
}

.dropdown          { border-radius: 0; border: 0; }
.navbar-custom,
.navbar-custom .navbar-nav,
.navbar-custom .dropdown,
.navbar-custom .dropdown-menu,
.navbar-custom .dropdown-menu li { overflow: visible !important; }

/* Link colors */
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text,
.navbar-custom .navbar-nav .nav-link,
.dropdown-menu a,
.navbar .nav-item .nav-link { color: #fff !important; }

.navbar .nav-item .nav-link:hover { color: var(--fu-yellow) !important; }

/* Dropdown menu base */
.navbar-custom .dropdown-menu,
.dropdown-menu {
    background:    #0A5CA8;
    border:        0;
    text-align:    right;
    border-radius: 10px;
    overflow:      visible !important;
}

.dropdown-menu { top: 80%; }

/* Dropdown item */
.navbar-custom .dropdown-item { color: #fff; padding-right: 8px; }

.dropdown-item:hover,
.navbar-custom .dropdown-item:hover,
.navbar-custom .dropdown-item:focus {
    background: var(--fu-yellow-dark);
    color:      #17304d;
}

/* Toggle arrow layout */
.navbar-custom .dropdown-menu .dropdown-toggle,
.navbar-custom .dropdown-menu li.menu-item-has-children > a,
.navbar-custom .navbar-nav > li.menu-item-has-children > a,
.navbar-custom .navbar-nav > li.dropdown > a.dropdown-toggle {
    display:         flex !important;
    align-items:     center;
    justify-content: space-between;
    gap:             10px;
}

/* ── Desktop (≥ 992px) ─────────────────────────── */
@media (min-width: 992px) {

    #headerbar {
        background: transparent !important;
        transition: background-color 0.35s ease, box-shadow 0.35s ease;
        z-index:    1001;
    }

    #headerbar.navbar-scrolled,
    #headerbar.navbar-open {
        background: rgba(0, 86, 168, 0.96) !important;
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    }

    /* Overlay behind open menu */
    .navbar-page-overlay {
        position:       fixed;
        inset:          0;
        background:     rgba(0, 0, 0, 0.6);
        backdrop-filter: blur(2px);
        z-index:        1000;
        opacity:        0;
        visibility:     hidden;
        pointer-events: none;
        transition:     opacity 0.25s ease, visibility 0.25s ease;
    }

    .navbar-page-overlay.active { opacity: 1; visibility: visible; }

    /* Override Bootstrap show — open only on hover */
    .navbar-custom .dropdown-menu,
    .navbar-custom .dropdown-menu.show { display: none !important; }

    .navbar-custom .dropdown:hover > .dropdown-menu,
    .navbar-custom .dropdown:focus-within > .dropdown-menu,
    .navbar-custom .dropdown-menu li:hover > .dropdown-menu,
    .navbar-custom .dropdown-menu li:focus-within > .dropdown-menu {
        display: block !important;
    }

    /* Main dropdown */
    .navbar-custom .dropdown-menu {
        position:   absolute;
        top:        100% !important;
        right:      0 !important;
        left:       auto !important;
        margin-top: 0 !important;
        min-width:  300px;
        max-width:  min(340px, 90vw);
        background: #0A5CA8;
        border:     0;
        border-radius: 10px;
        box-shadow: 0 16px 35px rgba(0, 0, 0, 0.22);
        z-index:    1003;
    }

    /* Sub-dropdown (3rd level) */
    .navbar-custom .dropdown-menu .dropdown-menu {
        top:        0 !important;
        left:       100% !important;
        right:      auto !important;
        margin:     0 !important;
        min-width:  320px;
        max-width:  min(360px, 90vw);
        max-height: calc(100vh - 180px) !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        background: #0A5CA8;
        border-radius: 10px;
        z-index:    100000 !important;
    }

    /* Bridge gap to prevent accidental close */
    .navbar-custom .dropdown-menu li.menu-item-has-children::after,
    .navbar-custom .dropdown-menu li.dropdown::after {
        content:  "";
        position: absolute;
        top:      0;
        left:     100%;
        width:    18px;
        height:   100%;
    }

    .navbar-custom .dropdown-menu > li > a,
    .navbar-custom .dropdown-menu > li > .dropdown-item { white-space: nowrap; padding: 12px 18px; background: transparent; }

    .navbar-custom .dropdown-menu > li > a:hover,
    .navbar-custom .dropdown-menu > li > .dropdown-item:hover { background: var(--fu-yellow-dark); color: #17304d !important; }

    /* Sub-menu scrollbar */
    .navbar-custom .dropdown-menu .dropdown-menu::-webkit-scrollbar       { width: 8px; }
    .navbar-custom .dropdown-menu .dropdown-menu::-webkit-scrollbar-thumb { background: var(--fu-yellow); border-radius: 10px; }
    .navbar-custom .dropdown-menu .dropdown-menu::-webkit-scrollbar-track { background: rgba(255,255,255,.18); }
}

/* ── Mobile (< 992px) ─────────────────────────── */
@media (max-width: 991.98px) {
    .navbar-page-overlay { display: none !important; }

    .navbar-collapse.show,
    .navbar-collapse.collapsing { overflow-y: hidden; }

    .navbar-collapse.show {
        max-height:  calc(100vh - 90px);
        overflow-y:  auto;
        overflow-x:  hidden;
        scrollbar-width: thin;
        scrollbar-color: var(--fu-yellow) rgba(255,255,255,.10);
        padding-left: 6px;
        background:  linear-gradient(180deg, rgba(0,86,168,0.98), rgba(0,61,115,0.98)),
                     radial-gradient(circle at top left, rgba(255,234,0,0.10), transparent 30%);
        border-radius: 18px;
        padding:     14px 14px 22px;
        box-shadow:  0 14px 35px rgba(0,0,0,0.22);
        border:      1px solid rgba(255,255,255,0.08);
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }

    .navbar-collapse.show .navbar-nav { margin-bottom: 14px; }

    .navbar-collapse.show::-webkit-scrollbar       { width: 8px; }
    .navbar-collapse.show::-webkit-scrollbar-track { background: rgba(255,255,255,.08); border-radius: 10px; }
    .navbar-collapse.show::-webkit-scrollbar-thumb { background: linear-gradient(180deg, var(--fu-yellow), var(--fu-yellow-dark)); border-radius: 10px; border: 1px solid rgba(0,0,0,.08); }
    .navbar-collapse.show::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #fff27a, var(--fu-yellow)); }

    /* Sub-menus on mobile: stack vertically */
    .navbar-custom ul.dropdown-menu li > ul.dropdown-menu,
    .navbar-custom .dropdown-menu .dropdown-menu {
        display:    none !important;
        position:   static !important;
        left:       auto !important;
        right:      auto !important;
        top:        auto !important;
        width:      100% !important;
        min-width:  100% !important;
        max-width:  100% !important;
        margin:     0 !important;
        border-top: 1px solid rgba(255,255,255,0.12);
        border-radius: 0;
    }

    ul.dropdown-menu li > ul.dropdown-menu.show { display: block !important; }

    /* Dropdown link rows */
    .navbar-nav > li > .nav-link {
        padding-left:   15px;
        padding-top:    12px;
        padding-bottom: 12px;
        border-bottom:  1px solid rgba(255,255,255,0.1);
        background-color: var(--fu-blue);
        font-weight:    bold;
        color:          #fff !important;
    }

    .navbar-custom .navbar-nav > li > a,
    .navbar-custom .navbar-nav > li > .nav-link {
        background:    rgba(255,255,255,0.04);
        border:        1px solid rgba(255,255,255,0.06);
        border-radius: 10px;
        margin-bottom: 8px;
        padding:       13px 14px;
        line-height:   1.5;
        transition:    all 0.25s ease;
    }

    .navbar-custom .navbar-nav > li > a:hover,
    .navbar-custom .navbar-nav > li > .nav-link:hover { background: rgba(255,255,255,0.07); }

    .navbar-nav .dropdown-menu > li > a {
        padding-left:   30px;
        padding-top:    10px;
        padding-bottom: 10px;
        border-bottom:  1px solid rgba(255,255,255,0.08);
        background-color: #0A5CA8;
        color:          #fff !important;
    }

    .navbar-nav .dropdown-menu .dropdown-menu > li > a {
        padding-left:   45px;
        padding-top:    8px;
        padding-bottom: 8px;
        border-bottom:  1px solid rgba(255,255,255,0.05);
        background-color: #0C79BF;
        font-size:      0.95em;
        color:          #fff !important;
    }

    .navbar-nav .dropdown-item:hover,
    .navbar-nav .dropdown-item:focus { background-color: var(--fu-yellow-dark); color: #17304d !important; }
    .navbar-nav .dropdown-menu a { color: #fff !important; }

    /* Caret icon on mobile */
    .dropdown-menu .dropdown-toggle::after,
    .navbar-custom .dropdown-menu li.menu-item-has-children > a::after,
    .navbar-custom .navbar-nav > li.menu-item-has-children > a::after {
        content:      "\f107" !important;
        font-family:  "Font Awesome 6 Free";
        font-weight:  900;
        color:        #fff;
        margin-right: 8px !important;
        transition:   transform 0.3s ease, color 0.3s ease;
    }

    .dropdown-menu li.open > .dropdown-toggle::after,
    .dropdown-menu li.open > a::after,
    .navbar-custom .navbar-nav li.open > a::after { transform: rotate(180deg); }

    /* Toggler button */
    .navbar-toggler {
        width:          44px;
        height:         44px;
        display:        flex;
        align-items:    center;
        justify-content: center;
        padding:        0 !important;
        border-radius:  14px;
        border:         1px solid rgba(255,255,255,0.16) !important;
        background:     rgba(255,255,255,0.96) !important;
        box-shadow:     0 8px 22px rgba(0,0,0,0.16);
        transition:     all 0.3s ease;
    }

    .navbar-toggler:hover  { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(0,0,0,.18); }
    .navbar-toggler:focus  { outline: none; box-shadow: 0 0 0 4px rgba(255,234,0,0.22); }

    .navbar-toggler.collapsed              { background: rgba(255,255,255,0.96) !important; }
    .navbar-toggler.collapsed .fa-bars     { color: var(--fu-blue) !important; font-size: 1.45rem; display: inline-block; }
    .navbar-toggler.collapsed .fa-times    { display: none; }

    .navbar-toggler:not(.collapsed)        { background: linear-gradient(135deg, var(--fu-yellow), var(--fu-yellow-dark)) !important; border-color: rgba(0,0,0,0.05) !important; }
    .navbar-toggler:not(.collapsed) .fa-bars   { display: none; }
    .navbar-toggler:not(.collapsed) .fa-times  { color: #0b2f59 !important; font-size: 1.6rem; display: inline-block; }

    #headerbar,
    #headerbar.navbar-scrolled,
    #headerbar.navbar-open { background: #0A5CA8 !important; }
}


/* ============================================================
   11. Header — Logo / Progress / Back to Top
   ============================================================ */

.logoimage { border-radius: 50% 10%; background-color: #ccc; }

.headerbar,
#headerbar {
    position:         fixed;
    top:              0;
    z-index:          1001;
    width:            100%;
    background-color: #1f4272;
}

.progress-container { width: 100%; height: 4px; background: #1f4272; }
.progress-bar       { height: 3px; background: var(--fu-yellow-dark); width: 0%; }

.banner, .wrapper { margin: 0; padding: 0; }
.wrapper          { width: 100%; margin: 0 auto; }

.banner p   { text-align: right; color: #aaa; margin: 0; padding: 0; display: block; }
.banner img { float: right; margin: 0 2px 0 0; padding: 0 0 0 2px; border-left: 1px solid #fff; }

.banner span,
.banner .ban2 span { margin: 0; padding: 0; padding-right: 3px; vertical-align: center; }

.navbar-toggler-icon { color: #fff; float: left; }

button.navbar-toggle         { background: none; border: none; color: #000; }
button.navbar-toggle span    { background: #000; }

/* Back to top */
#btn-back-to-top {
    position:         fixed;
    bottom:           30px;
    left:             20px;
    display:          none;
    background-color: var(--fu-yellow-dark);
    z-index:          998;
    transition:       transform 0.2s;
    border-radius:    50%;
    width:            55px;
    height:           55px;
    padding:          5px;
}

#btn-back-to-top:hover { transform: scale(1.3); }

@media (max-width: 767.98px) {
    #btn-back-to-top { bottom: 11px !important; left: 14px !important; }
}


/* ============================================================
   12. Preloader
   ============================================================ */

.preloader-wrap {
    position:   fixed;
    inset:      0;
    z-index:    10003;
    overflow:   hidden;
    background: radial-gradient(circle at center, rgba(0,86,168,0.95), rgba(0,45,95,0.98)),
                linear-gradient(135deg, var(--fu-blue), var(--fu-blue-dark));
    display:    flex;
    align-items:    center;
    justify-content: center;
}

.preloader-wrap::before {
    content:    "";
    position:   absolute;
    inset:      0;
    background: linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
    background-size: 38px 38px;
    opacity:    0.35;
}

.loading-wrapper {
    position: relative;
    width:    118px;
    height:   118px;
    display:  flex;
    align-items:    center;
    justify-content: center;
}

.loading-devover {
    position:      absolute;
    inset:         0;
    border-radius: 50%;
    border:        7px solid rgba(255,255,255,0.16);
    border-top-color:  var(--fu-yellow);
    border-left-color: rgba(255,234,0,0.75);
    animation:     fuLoaderSpin 1s linear infinite;
    box-shadow:    0 0 24px rgba(255,234,0,0.16);
}

.loading-devover::after {
    content:       "";
    position:      absolute;
    inset:         13px;
    border-radius: 50%;
    border:        1px solid rgba(94,231,255,0.25);
}

.loading-devover + .imgg {
    position:      absolute;
    width:         78px;
    height:        78px;
    inset:         50% auto auto 50%;
    transform:     translate(-50%, -50%);
    border-radius: 50%;
    background:    linear-gradient(145deg, rgba(255,255,255,0.96), rgba(235,248,255,0.92));
    box-shadow:    0 12px 30px rgba(0,0,0,0.22), inset 0 0 18px rgba(0,86,168,0.08);
    display:       flex;
    align-items:   center;
    justify-content: center;
}

.loading-devover + .imgg .counter {
    margin:      0 !important;
    color:       var(--fu-blue) !important;
    font-size:   1.8rem;
    font-weight: 800;
    line-height: 1;
}

@keyframes fuLoaderSpin { to { transform: rotate(360deg); } }

@media (max-width: 575.98px) {
    .loading-wrapper { width: 96px; height: 96px; }
    .loading-devover { border-width: 6px; }
    .loading-devover + .imgg { width: 64px; height: 64px; }
    .loading-devover + .imgg .counter { font-size: 1.45rem; }
}


/* ============================================================
   13. Site Sections & Cover
   ============================================================ */

.site-section {
    padding:     4em 0;
    min-height:  450px;
    display:     flex;
    align-items: center;
}

.site-section.site-section-sm { padding: 4em 0; }

.site-section-heading {
    position:  relative;
    font-size: 2.5rem;
}

.site-section-heading::after {
    content:    "";
    left:       0%;
    bottom:     0;
    position:   absolute;
    width:      100px;
    height:     1px;
    background: #33395b;
}

.site-section-heading.text-center::after {
    left:      50%;
    transform: translateX(-50%);
}

@media (min-width: 768px) {
    .site-section          { padding: 6em 0; min-height: 520px; }
    .site-section-heading  { font-size: 4rem; }
}

@media (min-width: 1200px) {
    .site-section { padding: 7em 0; min-height: 600px; }
}

/* Full-screen cover */
.site-blocks-cover,
.site-blocks-cover .row {
    min-height: 600px;
    height:     calc(100vh);
}

.site-blocks-cover {
    background-size:     cover;
    background-repeat:   no-repeat;
    background-position: center left;
}

.site-blocks-cover.overlay,
.site-blocks-cover2.overlay { position: relative; }

.site-blocks-cover.overlay::before {
    position:         absolute;
    content:          "";
    inset:            0;
    background-color: rgba(0,47,108,0.1);
}

.site-blocks-cover.inner-page-cover,
.site-blocks-cover.inner-page-cover .row {
    min-height: 600px;
    height:     calc(30vh);
}

.site-blocks-cover h1,
.site-blocks-cover2 h1 { font-size: 4rem; font-weight: 900; color: #fff; }

.site-blocks-cover p,
.site-blocks-cover2 p  { color: rgba(255,255,255,0.5); font-size: 1.2rem; line-height: 1.5; }

.site-blocks-cover .btn,
.site-blocks-cover2 .btn { border: 2px solid transparent; }

.site-blocks-cover .btn:hover,
.site-blocks-cover2 .btn:hover { color: #fff !important; background: none; border: 2px solid #fff; }

.site-blocks-cover .intro-text,
.site-blocks-cover2 .intro-text { font-size: 16px; line-height: 1.5; }

.site-blocks-cover2,
.site-blocks-cover2 .row { height: 330px; }

.site-blocks-cover2 {
    background-size:     cover;
    background-repeat:   no-repeat;
    background-position: center center;
}

.site-blocks-cover2.overlay::before {
    position:   absolute;
    content:    "";
    inset:      0;
    background: rgba(0,0,0,0.4);
}

@media (max-width: 991.98px) {
    .site-blocks-cover h1,
    .site-blocks-cover2 h1     { font-size: 2rem; }
    .site-blocks-cover .display-1,
    .site-blocks-cover2 .display-1 { font-size: 3rem; }
}

.cover-image-thum {
    width:               384px;
    height:              192px;
    background-size:     cover;
    background-position: center;
    background-repeat:   no-repeat;
    background-attachment: fixed;
}

.cover-image-thum2 {
    height:              256px;
    background-size:     cover;
    background-position: center;
    background-repeat:   no-repeat;
    background-attachment: fixed;
}


/* ============================================================
   14. Home Page
   ============================================================ */

body.home { scroll-behavior: smooth; }

body.home #site-blocks-cover.site-blocks-cover {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 15% 20%, rgba(255,255,255,.10), transparent 30%),
        radial-gradient(circle at 85% 15%, rgba(94,231,255,.14), transparent 25%),
        linear-gradient(135deg, #0d4f97 0%, #1465b6 45%, #0a2f61 100%) !important;
}

body.home #site-blocks-cover.site-blocks-cover::before {
    content:        "";
    position:       absolute;
    inset:          0;
    background:     linear-gradient(to bottom, rgba(255,255,255,.04), rgba(0,0,0,.12)),
                    radial-gradient(circle at center, transparent 35%, rgba(0,0,0,.18) 100%);
    pointer-events: none;
    z-index:        0;
}

body.home #particles-js {
    position: absolute;
    inset:    0;
    z-index:  0;
}

body.home #site-blocks-cover .container-fluid,
body.home #site-blocks-cover .row,
body.home #site-blocks-cover .col-md-7,
body.home #site-blocks-cover .col-md-5 { position: relative; z-index: 1; }

.glow-text {
    position:       relative;
    font-size:      clamp(3rem, 8vw, 5rem);
    letter-spacing: 8px;
    color:          rgb(29,41,29);
    text-transform: uppercase;
    width:          100%;
    text-align:     center;
    line-height:    0.70em;
    outline:        none;
    animation:      homeGlowAnimate 5s linear infinite;
}

@keyframes homeGlowAnimate {
    0%,18%,20%,50.1%,60%,65.1%,80%,90.1%,92% {
        color: rgb(29,41,29); box-shadow: none;
    }
    18.1%,20.1%,30%,50%,60.1%,65%,80.1%,90%,92.1%,100% {
        color: white;
        text-shadow:
            0 0 10px rgb(84,235,237),
            0 0 20px rgb(84,235,237),
            0 0 40px rgb(84,235,237),
            0 0 80px rgb(84,235,237),
            0 0 160px rgb(84,235,237);
    }
}

body.home .minimal-section-v2 {
    position:       relative;
    padding-top:    2.5rem;
    padding-bottom: 1.25rem;
}

body.home .minimal-section-v2 .main-heading {
    background:              linear-gradient(90deg, var(--home-primary), var(--home-secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing:          1px;
}

body.home .minimal-section-v2 .sub-heading {
    color:         #43556f;
    max-width:     720px;
    margin-inline: auto;
}

body.home .minimal-section-v2 .sub-heading::after {
    width:         120px;
    height:        5px;
    border-radius: 999px;
    background:    linear-gradient(to left, var(--home-accent), var(--home-primary));
}

/* Shimmer button */
body.home .btn-dark,
body.home .custom-btn {
    position:      relative;
    overflow:      hidden;
    border-radius: 999px;
    border:        none;
    background:    linear-gradient(135deg, var(--home-accent), #ffd54a);
    color:         #16345f !important;
    font-weight:   700;
    box-shadow:    0 10px 25px rgba(255,234,0,0.22);
}

body.home .btn-dark::before,
body.home .custom-btn::before {
    content:    "";
    position:   absolute;
    top:        0;
    right:      -120%;
    width:      60%;
    height:     100%;
    background: linear-gradient(to right, transparent, rgba(255,255,255,.55), transparent);
    transform:  skewX(-25deg);
    transition: right 0.6s ease;
}

body.home .btn-dark:hover::before,
body.home .custom-btn:hover::before { right: 140%; }

body.home .btn-dark:hover,
body.home .custom-btn:hover {
    transform:  translateY(-4px);
    box-shadow: 0 16px 30px rgba(255,234,0,0.28);
    color:      #0f2b4e !important;
}

.home-years-card {
    background:         rgba(255,255,255,0.15) !important;
    border-radius:      16px !important;
    box-shadow:         0 4px 30px rgba(0,0,0,0.1) !important;
    backdrop-filter:    blur(5px) !important;
    -webkit-backdrop-filter: blur(5px) !important;
    border:             1px solid rgba(255,255,255,0.3) !important;
    text-align:         center !important;
}

body.home .card2 {
    width:          min(100%, 390px) !important;
    max-width:      390px !important;
    margin:         0 auto !important;
    border-radius:  var(--home-radius);
    background:     linear-gradient(145deg, rgba(255,255,255,.18), rgba(255,255,255,.08)) !important;
    border:         1px solid rgba(255,255,255,.22);
    box-shadow:     0 20px 50px rgba(0,0,0,.18);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition:     transform 0.35s ease, box-shadow 0.35s ease;
}

body.home .card2:hover {
    transform:  translateY(-8px) scale(1.015);
    box-shadow: 0 28px 60px rgba(0,0,0,.24);
}

body.home .card2 img.hero-years-icon { display: block; margin: 0 auto 12px; }
body.home .card2 .glow-text          { width: 100%; text-align: center; line-height: 1; margin-bottom: 12px; }
body.home .card2 h4                  { line-height: 1.5; margin: 10px 0 0; }

body.home #site-blocks-cover p       { color: rgba(255,255,255,.88); font-size: 1.05rem; }

.hero-cta { padding: 0.95rem 1.7rem; font-size: 1.05rem; }

.typed-container {
    min-height:      2.8em;
    display:         flex;
    align-items:     center;
    justify-content: center;
    text-align:      center;
}

@media (max-width: 991px) {
    body.home .site-blocks-cover,
    body.home .site-blocks-cover .row {
        min-height:     85vh;
        height:         auto;
        padding-top:    1rem;
        padding-bottom: 2rem;
    }

    .glow-text { letter-spacing: 4px !important; }
}

@media (max-width: 767.98px) {
    body.home .card2 {
        width:     min(100%, 280px);
        max-width: 280px !important;
        padding:   1rem !important;
    }

    body.home .card2 .glow-text { font-size: 3rem !important; letter-spacing: 4px !important; }
    body.home .card2 h4         { font-size: 1.4rem !important; line-height: 1.4 !important; }
}


/* ============================================================
   15. Specialty Row Cards
   ============================================================ */

.specialty-list {
    display:   flex;
    flex-direction: column;
    gap:       18px;
    width:     100%;
    max-width: 100%;
    margin:    0 auto;
    padding:   8px 0 16px;
}

.specialty-row-card {
    background:    #fff;
    border:        1px solid #e7e7e7;
    border-radius: 14px;
    overflow:      hidden;
    box-shadow:    0 4px 14px rgba(0,0,0,0.06);
    transition:    transform 0.25s ease, box-shadow 0.25s ease;
}

.specialty-row-card:hover {
    transform:  translateY(-3px);
    box-shadow: 0 10px 22px rgba(0,0,0,0.10);
}

.specialty-row-link {
    display:     grid;
    grid-template-columns: 120px 1fr 150px;
    align-items: center;
    gap:         18px;
    color:       inherit;
    padding:     14px 18px;
}

.specialty-row-thumb {
    width:         120px;
    height:        90px;
    border-radius: 10px;
    overflow:      hidden;
    flex-shrink:   0;
    background:    #f3f5f7;
}

.specialty-row-thumb img {
    width: 100%; height: 100%; object-fit: cover; display: block;
}

.specialty-row-title {
    margin:      0;
    font-size:   1.15rem;
    line-height: 1.8;
    color:       #1f4272;
    font-weight: 700;
    word-break:  break-word;
}

.specialty-row-action {
    display:         flex;
    justify-content: flex-start;
    align-items:     center;
}

.specialty-row-btn {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    min-width:       120px;
    padding:         10px 16px;
    border-radius:   999px;
    background:      #f7fbff;
    color:           #0c5adb;
    border:          1px solid #d6e7ff;
    font-size:       0.95rem;
    font-weight:     700;
    transition:      all 0.25s ease;
}

.specialty-row-card:hover .specialty-row-btn {
    background:   #0c5adb;
    color:        #fff;
    border-color: #0c5adb;
}

.specialty-cards-empty { text-align: center; color: #666; padding: 20px; }

@media (max-width: 991.98px) {
    .specialty-row-link   { grid-template-columns: 100px 1fr 130px; gap: 14px; padding: 12px 14px; }
    .specialty-row-thumb  { width: 100px; height: 78px; }
    .specialty-row-title  { font-size: 1.02rem; }
    .specialty-row-btn    { min-width: 105px; padding: 9px 12px; font-size: 0.9rem; }
}

@media (max-width: 767.98px) {
    .specialty-row-link    { grid-template-columns: 80px 1fr; gap: 12px; padding: 12px; }
    .specialty-row-thumb   { width: 80px; height: 72px; }
    .specialty-row-content { display: flex; align-items: center; }
    .specialty-row-title   { font-size: 0.98rem; line-height: 1.6; }
    .specialty-row-action  { grid-column: 1 / -1; justify-content: flex-start; padding-top: 4px; }
    .specialty-row-btn     { min-width: auto; width: 100%; border-radius: 10px; }
}

@media (max-width: 420px) {
    .specialty-row-link  { grid-template-columns: 70px 1fr; gap: 10px; padding: 10px; }
    .specialty-row-thumb { width: 70px; height: 64px; }
    .specialty-row-title { font-size: 0.92rem; }
}


/* ============================================================
   16. Flip Cards
   ============================================================ */

.flip-card {
    background-color: transparent;
    width:            100%;
    height:           225px;
    perspective:      1000px;
    border:           1px solid #ddd;
    border-radius:    12px;
    margin-bottom:    25px;
    color:            #fff;
}

.flip-card:hover { border: 1px solid #0c5adb; }

.flip-card-inner {
    position:        relative;
    width:           100%;
    height:          100%;
    transition:      transform 0.6s;
    transform-style: preserve-3d;
    box-shadow:      0 4px 8px rgba(0,0,0,0.2);
}

.flip-card:hover .flip-card-inner { transform: rotateY(180deg); }

.flip-card-front,
.flip-card-back {
    position:                 absolute;
    width:                    100%;
    height:                   100%;
    -webkit-backface-visibility: hidden;
    backface-visibility:      hidden;
}

.flip-card-front {
    background-color: transparent;
    padding-top:      50px;
    line-height:      20px;
}

.flip-card-front h4,
.flip-card-back h4 {
    padding:     10px;
    line-height: 170%;
    font-size:   clamp(1.125rem, 3vw, 1.5rem);
}

.flip-card-back {
    background: linear-gradient(rgba(12,90,219,0.92), rgba(12,90,219,0.92)), #0c5adb;
    color:      white;
    transform:  rotateY(180deg);
    border-radius: 12px;
    padding-top: 50px;
}


/* ============================================================
   17. Search Box
   ============================================================ */

.search-box {
    position:      relative;
    height:        40px;
    width:         50px;
    border-radius: 50%;
    box-shadow:    5px 5px 30px rgba(0,0,0,.2);
    transition:    all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.search-box.active { width: 300px; }

.search-box input {
    width:         100%;
    height:        100%;
    border:        none;
    border-radius: 50px;
    background:    #fff;
    outline:       none;
    padding:       0 60px 0 20px;
    font-size:     18px;
    opacity:       0;
    transition:    all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.search-box input.active         { opacity: 1; }
.search-box input::placeholder   { color: #a6a6a6; }

.search-box .search-icon {
    position:      absolute;
    left:          0;
    top:           50%;
    transform:     translateY(-50%);
    height:        50px;
    width:         50px;
    background:    #fff;
    border-radius: 50%;
    text-align:    center;
    line-height:   50px;
    font-size:     22px;
    color:         #664AFF;
    cursor:        pointer;
    z-index:       1;
    transition:    all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.search-box .search-icon.active {
    left:          5px;
    background:    #664AFF;
    color:         #fff;
    transform:     translateY(-50%) rotate(360deg);
}

.search-box .cancel-icon {
    position:   absolute;
    right:      20px;
    top:        50%;
    transform:  translateY(-50%);
    font-size:  27px;
    color:      #da9838;
    cursor:     pointer;
    transition: all 0.5s 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.search-box .cancel-icon.active {
    left:      -40px;
    transform: translateY(-50%) rotate(360deg);
}

.search-box .search-data {
    text-align: center;
    padding-top: 7px;
    color:       #fff;
    font-size:   18px;
    word-wrap:   break-word;
}

.search-box .search-data.active { display: none; }


/* ============================================================
   18. Chatbot / Floating Icon
   ============================================================ */

.rounded-full {
    border-radius: 9999px;
    position:      fixed;
    right:         20px;
    bottom:        30px;
    width:         50px;
    height:        50px;
    z-index:       999;
}

.botradiant {
    transition:    all 0.5s;
    cursor:        pointer;
    border-radius: 9999px;
    animation:     animaterad 2s linear infinite;
}

@keyframes animaterad {
    0%   { box-shadow: 0 0 0 0  rgba(255,0,0,0.7); }
    40%  { box-shadow: 0 0 0 30px rgba(255,0,0,0); }
    80%  { box-shadow: 0 0 0 30px rgba(255,0,0,0); }
    100% { box-shadow: 0 0 0 0  rgba(255,0,0,0); }
}

/* Overlay */
#chatbot-overlay {
    position:       fixed;
    inset:          0;
    background:     rgba(0,22,48,0.58) !important;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    z-index:        30000 !important;
    display:        none;
    opacity:        0;
    pointer-events: none;
    transition:     opacity 0.3s ease;
}

#chatbot-overlay.active {
    display:        block;
    pointer-events: auto;
    opacity:        1;
}

/* Container */
.chatbot-container {
    position:   fixed !important;
    bottom:     78px;
    right:      5px;
    width:      360px;
    height:     500px;
    z-index:    30001 !important;
    border-radius: 10px;
    overflow:   hidden;
    display:    flex;
    flex-direction: column;
    opacity:    0;
    transform:  translateY(20px);
    transition: all 0.3s ease;
}

.chatbot-container.hidden {
    opacity:        0;
    pointer-events: none;
    transform:      translateY(20px);
}

.chatbot-container.active {
    opacity:        1;
    pointer-events: auto;
    transform:      translateY(0);
}

.chatbot-container iframe {
    width:      100% !important;
    height:     100% !important;
    border:     none;
    display:    block;
    background: transparent;
}

/* Fullscreen toggle button */
.fullscreen-toggle {
    position:       absolute;
    top:            12px;
    left:           12px;
    width:          42px;
    height:         42px;
    display:        flex;
    align-items:    center;
    justify-content: center;
    border-radius:  50%;
    border:         none;
    cursor:         pointer;
    background:     linear-gradient(135deg, var(--fu-yellow), var(--fu-yellow-dark));
    color:          var(--fu-blue-dark);
    font-size:      1.1rem;
    font-weight:    bold;
    box-shadow:     0 6px 18px rgba(0,0,0,0.25);
    transition:     all 0.3s ease;
    z-index:        30003 !important;
}

.fullscreen-toggle:hover  { transform: scale(1.1) rotate(5deg); box-shadow: 0 10px 25px rgba(0,0,0,.35); }
.fullscreen-toggle:active { transform: scale(0.95); }
.fullscreen-toggle i      { pointer-events: none; }

/* Fullscreen state */
.chatbot-container.fullscreen {
    inset:        0 !important;
    width:        100vw !important;
    max-width:    100vw !important;
    height:       100vh !important;
    height:       100dvh !important;
    max-height:   100dvh !important;
    z-index:      30002 !important;
    bottom:       0 !important;
    right:        0 !important;
    border-radius: 0 !important;
    transform:    none !important;
}

/* Chat icon */
.chat-bot-icon { position: fixed; right: 20px; bottom: 30px; }

@media (max-width: 767.98px) {
    .chat-bot-icon          { bottom: 11px !important; right: 14px !important; }
    .chatbot-container      { bottom: 138px !important; right: 10px !important; width: calc(100% - 20px) !important; max-width: 360px; }
}

@media (max-width: 991.98px) {
    .chatbot-container {
        right:      10px;
        bottom:     138px;
        width:      calc(100vw - 20px);
        max-width:  420px;
        height:     520px;
        z-index:    30001 !important;
    }

    .chatbot-container.fullscreen {
        inset:        0 !important;
        width:        100vw !important;
        max-width:    100vw !important;
        height:       100vh !important;
        height:       100dvh !important;
        max-height:   100dvh !important;
        z-index:      30002 !important;
    }
}


/* ============================================================
   19. College Inner Header
   ============================================================ */

/* Responsive background image */
.college-page-header {
    position:            relative;
    overflow:            hidden;
    background-size:     cover;
    background-repeat:   no-repeat;
    background-position: center;
    background-image:    var(--header-mobile);
    height:              300px;
}

@media (min-width: 768px)  { .college-page-header { background-image: var(--header-tablet); height: 320px; } }
@media (min-width: 1200px) { .college-page-header { background-image: var(--header-desktop); } }

@media (max-width: 575.98px)                      { .college-page-header { height: 280px; } }
@media (min-width: 576px) and (max-width: 991.98px) { .college-page-header { height: 320px; } }
@media (min-width: 992px)                         { .college-page-header { height: 380px; } }
@media (min-width: 1600px)                        { .college-page-header { height: 420px; } }

.college-page-header__overlay {
    position:   absolute;
    inset:      0;
    z-index:    1;
    background: linear-gradient(90deg,
        rgba(0,36,78,0.94)  0%,
        rgba(0,86,168,0.78) 50%,
        rgba(0,36,78,0.94) 100%);
}

.college-page-header__container,
.college-page-header__row {
    position: relative;
    z-index:  2;
    height:   100%;
}

.college-page-header__row {
    align-items:     center !important;
    justify-content: center !important;
}

.college-page-header__content {
    width:          min(640px, 76vw);
    min-height:     118px;
    margin:         34px auto 0;
    padding:        22px 28px;
    display:        flex;
    flex-direction: column;
    align-items:    center;
    justify-content: center;
    border-radius:  20px;
    background:     rgba(0,78,145,0.42);
    border:         1px solid rgba(94,231,255,0.32);
    box-shadow:     0 14px 32px rgba(0,0,0,0.22), inset 0 0 28px rgba(94,231,255,0.08);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.college-page-header__title {
    margin:         0 0 5px !important;
    padding:        0;
    color:          #fff;
    font-size:      clamp(1.45rem, 2.2vw, 2.15rem);
    line-height:    1.35;
    font-weight:    800;
    text-align:     center;
    text-shadow:    0 4px 15px rgba(0,0,0,0.42);
}

.college-page-header__subtitle {
    margin:      0 !important;
    color:       rgba(255,255,255,0.78);
    line-height: 1.6;
    font-weight: 600;
    text-align:  center;
    text-shadow: 0 2px 10px rgba(0,0,0,0.42);
}

.college-page-header__subtitle a,
.college-page-header__subtitle i { color: var(--fu-yellow) !important; }

@media (max-width: 991.98px) {
    .college-page-header__content {
        width: 84vw; min-height: 116px; margin-top: 28px; padding: 20px 18px; border-radius: 19px;
    }
    .college-page-header__title { font-size: clamp(1.35rem, 3.8vw, 1.8rem); line-height: 1.4; }
}

@media (max-width: 575.98px) {
    .college-page-header__content {
        width: 88vw; min-height: 112px; margin-top: 20px; padding: 18px 14px; border-radius: 17px;
    }
    .college-page-header__title { font-size: clamp(1.22rem, 5.2vw, 1.52rem); }
}

/* Breadcrumb bar */
.college-breadcrumb-bar {
    width:        100%;
    margin:       0;
    padding:      7px 0 6px;
    background:   linear-gradient(90deg, var(--fu-blue-dark), var(--fu-blue), var(--fu-blue-dark));
    box-shadow:   0 4px 12px rgba(0,0,0,0.12);
    overflow-x:   auto;
    overflow-y:   hidden;
    scrollbar-width: thin;
    scrollbar-color: var(--fu-yellow) rgba(255,255,255,0.18);
}

.college-breadcrumb-bar .container {
    max-width:     100%;
    padding-right: 14px;
    padding-left:  14px;
}

.college-breadcrumb-list {
    display:     flex !important;
    flex-wrap:   nowrap !important;
    align-items: center;
    width:       max-content;
    min-width:   100%;
    padding:     0;
    margin:      0;
    list-style:  none;
    background:  transparent;
    direction:   rtl;
    white-space: nowrap;
    font-size:   clamp(0.68rem, 0.82vw, 0.82rem);
    line-height: 1.7;
    font-weight: 700;
}

.college-breadcrumb-list .breadcrumb-item {
    display:    inline-flex !important;
    align-items: center;
    flex:        0 0 auto !important;
    color:       #fff;
    white-space: nowrap !important;
}

.college-breadcrumb-list .breadcrumb-item + .breadcrumb-item::before {
    content:     "\f100";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    padding:     0 0.22rem;
    color:       var(--fu-yellow);
    font-size:   0.76em;
    flex:        0 0 auto;
}

.college-breadcrumb-list .breadcrumb-item a {
    display:         inline-flex;
    align-items:     center;
    color:           #fff;
    text-decoration: none;
    white-space:     nowrap !important;
}

.college-breadcrumb-list .breadcrumb-item a:hover  { color: var(--fu-yellow); }

.college-breadcrumb-list .breadcrumb-item.active {
    color:          rgba(255,255,255,0.82);
    pointer-events: none;
}

.college-breadcrumb-bar::-webkit-scrollbar       { height: 7px; }
.college-breadcrumb-bar::-webkit-scrollbar-track { background: rgba(255,255,255,0.14); border-radius: 999px; }
.college-breadcrumb-bar::-webkit-scrollbar-thumb { background: linear-gradient(90deg, var(--fu-yellow), var(--fu-yellow-dark)); border-radius: 999px; border: 1px solid rgba(0,61,115,.35); }
.college-breadcrumb-bar::-webkit-scrollbar-thumb:hover { background: linear-gradient(90deg, #fff27a, var(--fu-yellow)); }

@media (max-width: 1199.98px) {
    .college-breadcrumb-bar { padding: 5px 0 4px; }
    .college-breadcrumb-bar .container { padding-right: 10px; padding-left: 10px; }
    .college-breadcrumb-list { font-size: 0.66rem !important; }
    .college-breadcrumb-list .breadcrumb-item + .breadcrumb-item::before { padding: 0 0.16rem; }
    .college-breadcrumb-bar::-webkit-scrollbar { height: 6px; }
}

@media (max-width: 575.98px) {
    .college-breadcrumb-bar { padding: 4px 0 3px; }
    .college-breadcrumb-list { font-size: 0.62rem !important; }
    .college-breadcrumb-bar::-webkit-scrollbar { height: 5px; }
}


/* ============================================================
   20. Split Showcase
   ============================================================ */

.fu-split-showcase {
    position:   relative;
    display:    flex;
    min-height: 300px;
    overflow:   hidden;
    box-shadow: 0 20px 50px rgba(0,0,0,0.12);
}

.fu-divider {
    position:   absolute;
    width:      2px;
    height:     100%;
    left:       50%;
    top:        0;
    z-index:    10;
    background: linear-gradient(to bottom, transparent, rgba(255,255,255,.4), transparent);
}

.fu-side {
    position:        relative;
    flex:            1;
    display:         flex;
    align-items:     center;
    justify-content: center;
    min-height:      300px;
    overflow:        hidden;
    transition:      all .4s ease;
}

.fu-side:hover { flex: 1.08; }

.fu-admission { background: linear-gradient(135deg, #0057B8, #0A5FB5); }
.fu-programs  { background: linear-gradient(135deg, #D89A2B, #F0B33A); }

.fu-overlay {
    position:   absolute;
    inset:      0;
    background: rgba(0,0,0,0.15);
    z-index:    2;
}

.fu-shine {
    position:   absolute;
    width:      320px;
    height:     320px;
    background: rgba(255,255,255,0.08);
    border-radius: 50%;
    filter:     blur(90px);
    top:        50%;
    left:       50%;
    transform:  translate(-50%, -50%);
    animation:  pulseGlow 6s infinite alternate;
    z-index:    3;
}

@keyframes pulseGlow {
    from { transform: translate(-50%, -50%) scale(1); }
    to   { transform: translate(-50%, -50%) scale(1.2); }
}

.fu-particles { position: absolute; inset: 0; z-index: 1; }

.fu-content {
    position:   relative;
    z-index:    20;
    color:      #fff;
    text-align: center;
    max-width:  400px;
    padding:    40px 30px;
}

.fu-badge {
    display:       inline-block;
    background:    rgba(255,255,255,0.15);
    border:        1px solid rgba(255,255,255,0.25);
    padding:       8px 16px;
    border-radius: 50px;
    margin-bottom: 18px;
    font-size:     14px;
}

.fu-icon {
    width:           85px;
    height:          85px;
    margin:          0 auto 20px;
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-size:       34px;
    border-radius:   50%;
    background:      rgba(255,255,255,0.14);
    border:          1px solid rgba(255,255,255,0.2);
}

.fu-content h2 { font-size: 30px; font-weight: 700; margin-bottom: 12px; line-height: 1.5; }
.fu-content p  { font-size: 16px; line-height: 1.8; margin-bottom: 20px; }

.fu-stats {
    display:         flex;
    justify-content: center;
    gap:             12px;
    margin-bottom:   22px;
    flex-wrap:       wrap;
}

.fu-stats span {
    background:    rgba(255,255,255,0.14);
    padding:       8px 15px;
    border-radius: 30px;
    font-size:     14px;
    font-weight:   500;
}

.fu-btn {
    display:         inline-flex;
    align-items:     center;
    gap:             8px;
    padding:         13px 26px;
    border-radius:   50px;
    font-weight:     700;
    text-decoration: none;
    color:           #fff !important;
    transition:      all .3s ease;
    box-shadow:      0 8px 20px rgba(0,0,0,0.18);
}

.fu-btn-blue { background: linear-gradient(135deg, #0057B8, #0A5FB5); }
.fu-btn-gold { background: linear-gradient(135deg, #D89A2B, #F0B33A); }

.fu-btn:hover       { transform: translateY(-4px); color: #fff !important; }
.fu-btn i           { transition: transform .3s ease; }
.fu-btn:hover i     { transform: translateX(-4px); }

@media (max-width: 991px) {
    .fu-split-showcase { flex-direction: column; min-height: auto; }
    .fu-divider        { display: none; }
    .fu-side           { min-height: 360px; }
    .fu-content        { padding: 35px 20px; }
    .fu-content h2     { font-size: 26px; }
    .fu-content p      { font-size: 15px; }
}


/* ============================================================
   21. Footer
   ============================================================ */

.site-footer {
    background: var(--fu-blue) !important;
    padding:    0;
    padding-top: 10px;
    direction:  rtl;
}

.site-footer ul { list-style-type: none; padding: 0; margin: 0; }

@media (min-width: 768px) { .site-footer { padding: 1.5em 0; padding-top: 10px; } }

.site-footer .border-top { border-top: 1px solid rgba(255,255,255,0.1) !important; }

.site-footer p,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer a,
.site-footer a:link,
.site-footer a:visited { color: #fff; }

.site-footer a           { text-decoration: none; }
.site-footer a:hover     { color: #fcd63e; }
.site-footer a:active    { color: #70DB93; }
.site-footer ul li       { margin-bottom: 10px; }
.site-footer .footer-heading { font-size: 18px; color: var(--fu-yellow); }

.site-footer ul li:not(.wp-social-link) {
    margin-bottom: 10px;
    position:      relative;
    padding-right: 25px;
    transition:    margin-right 0.3s ease;
}

.site-footer ul li:not(.wp-social-link)::before {
    font-family: "Font Awesome 6 Free";
    content:     "\2190";
    font-weight: 900;
    color:       var(--fu-yellow);
    display:     inline-block;
    margin-left: 10px;
    transition:  transform 0.3s ease, color 0.3s ease;
}

.site-footer ul li:not(.wp-social-link):hover            { margin-right: 5px; }
.site-footer ul li:not(.wp-social-link):hover::before    { transform: translateX(-5px); color: #fcd63e; }

.text-shadow-hover {
    transition:  all 0.3s ease;
    text-shadow: 2px 2px 4px rgba(245,245,245,0.1);
}

.text-shadow-hover:hover {
    transform:   scale(1.02);
    text-shadow: 3px 3px 6px rgba(245,245,245,0.3);
}

/* Map embed */
.footer-map-wrap     { position: relative; border-radius: 14px; overflow: hidden; }
.footer-map-frame    { border: 0; min-height: 220px; display: block; }
.footer-map-overlay  { display: none; }

@media (max-width: 767.98px) {
    .footer-map-overlay {
        position:        absolute;
        inset:           0;
        z-index:         2;
        display:         flex;
        align-items:     center;
        justify-content: center;
        background:      rgba(0,86,168,0.18);
        color:           #fff;
        font-weight:     700;
        text-align:      center;
        cursor:          pointer;
        backdrop-filter: blur(2px);
    }

    .footer-map-wrap.active .footer-map-overlay      { display: none; }
    .footer-map-wrap:not(.active) .footer-map-frame  { pointer-events: none; }
    .footer-map-wrap.active .footer-map-frame        { pointer-events: auto; }
}

/* Developer strip */
.developer-strip {
    background:  linear-gradient(90deg, #000, #081a33);
    border-top:  1px solid rgba(255,255,255,0.08);
    padding:     12px 16px;
    position:    relative;
    z-index:     2;
}

.developer-strip-inner {
    max-width:       1200px;
    margin:          0 auto;
    min-height:      52px;
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    gap:             14px;
    color:           #fff;
    flex-wrap:       wrap;
}

.developer-meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

.developer-label {
    background:    var(--fu-yellow);
    color:         #0b1f3a;
    font-weight:   800;
    font-size:     0.92rem;
    padding:       6px 12px;
    border-radius: 999px;
    white-space:   nowrap;
}

.developer-link {
    color:       #fff;
    font-weight: 700;
    line-height: 1.4;
    transition:  color 0.3s ease, transform 0.3s ease;
}

.developer-link:hover { color: var(--fu-yellow); transform: translateY(-1px); }

.developer-copy { color: rgba(255,255,255,0.82); font-weight: 700; font-size: 0.95rem; white-space: nowrap; }

@media (max-width: 767.98px) {
    .developer-strip          { padding: 14px 16px 18px; }
    .developer-strip-inner    { min-height: auto; flex-direction: column; justify-content: center; align-items: center; text-align: center; gap: 10px; }
    .developer-meta           { justify-content: center; gap: 10px; }
    .developer-link           { font-size: 1rem; }
    .developer-copy           { width: 100%; font-size: 0.92rem; }
}


/* ============================================================
   22. Print
   ============================================================ */

@media print {
    .sub-pages-column,
    .mobile-sub-menu-button,
    .mobile-menu-overlay,
    .page-share-icons { display: none !important; }

    .main-content-column {
        flex:      0 0 100% !important;
        max-width: 100% !important;
        width:     100% !important;
    }

    .main-content-area { padding: 0 !important; }

    body,
    .print-content {
        direction:  rtl !important;
        text-align: right !important;
    }

    .print-content { margin-right: 15px; margin-left: 0; }

    table    { direction: rtl; float: right; }
    td, th   { text-align: right !important; padding-right: 15px !important; padding-left: 8px !important; }

    img.align-left { float: right !important; margin-left: 15px !important; margin-right: 0 !important; }

    .text-start { text-align: right !important; }
    .float-start { float: right !important; }
    .text-end   { text-align: left !important; }
}

@page { direction: rtl; margin: 20mm 10mm 20mm 30mm; }