/* /Components/Layout/MainLayout.razor.rz.scp.css */
.portfolio-layout[b-hw68jsi42i] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.portfolio-header[b-hw68jsi42i] {
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
}

.portfolio-main[b-hw68jsi42i] {
    width: 100%;
    flex: 1;
}

.portfolio-footer[b-hw68jsi42i] {
    color: #c7d2df;
    background: #05111f;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-content[b-hw68jsi42i] {
    padding-block: 40px 30px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
}

.footer-identity strong[b-hw68jsi42i] {
    color: #ffffff;
    font-size: 1.05rem;
}

.footer-identity p[b-hw68jsi42i] {
    margin: 7px 0 0;
    color: #9fb0c2;
}

.footer-contact[b-hw68jsi42i] {
    display: flex;
    gap: 22px;
}

    .footer-contact a[b-hw68jsi42i] {
        color: #c7d2df;
        text-decoration: none;
    }

        .footer-contact a:hover[b-hw68jsi42i] {
            color: #64b5f6;
        }

.privacy-note[b-hw68jsi42i] {
    padding-block: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
}

    .privacy-note p[b-hw68jsi42i] {
        max-width: 1100px;
        margin: 0 auto;
        color: #8193a5;
        font-size: 0.75rem;
        line-height: 1.6;
        text-align: center;
    }

.footer-copyright[b-hw68jsi42i] {
    padding: 17px 20px;
    color: #708295;
    background: #030c16;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    text-align: center;
}

    .footer-copyright p[b-hw68jsi42i] {
        margin: 3px 0;
        font-size: 0.72rem;
    }

#blazor-error-ui[b-hw68jsi42i] {
    display: none;
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 3000;
    padding: 0.8rem 1.25rem;
    color: #332701;
    background: #fff3cd;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.2);
}

    #blazor-error-ui .dismiss[b-hw68jsi42i] {
        position: absolute;
        top: 0.55rem;
        right: 1rem;
        cursor: pointer;
    }

@media (max-width: 700px) {
    .footer-content[b-hw68jsi42i] {
        flex-direction: column;
    }

    .footer-contact[b-hw68jsi42i] {
        flex-wrap: wrap;
    }
}
/* /Components/Layout/NavMenuBs.razor.rz.scp.css */
.main-navigation[b-40flsl1ayl] {
    min-height: var(--header-height);
    color: #ffffff;
    background: rgba(5, 17, 31, 0.97);
    border-bottom: 1px solid rgba(255, 255, 255, 0.09);
    backdrop-filter: blur(14px);
}

.navigation-container[b-40flsl1ayl] {
    min-height: var(--header-height);
    display: flex;
    align-items: center;
    gap: 30px;
}

.portfolio-brand[b-40flsl1ayl] {
    margin-right: auto;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #ffffff;
    text-decoration: none;
}

.brand-initials[b-40flsl1ayl] {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: #2d95f3;
    border-radius: 8px;
    font-size: 0.95rem;
    font-weight: 800;
}

.brand-text[b-40flsl1ayl] {
    display: flex;
    flex-direction: column;
}

    .brand-text strong[b-40flsl1ayl] {
        font-size: 1rem;
    }

    .brand-text small[b-40flsl1ayl] {
        margin-top: 1px;
        color: #8fa4b8;
        font-size: 0.67rem;
        letter-spacing: 0.07rem;
        text-transform: uppercase;
    }

.navigation-links[b-40flsl1ayl] {
    display: flex;
    align-items: center;
    gap: 4px;
}

    .navigation-links[b-40flsl1ayl]  a {
        position: relative;
        min-height: var(--header-height);
        padding: 0 10px;
        display: inline-flex;
        align-items: center;
        color: #cbd6e2;
        font-size: 0.84rem;
        font-weight: 600;
        text-decoration: none;
        transition: color var(--transition);
    }

        .navigation-links[b-40flsl1ayl]  a:hover {
            color: #ffffff;
        }

        .navigation-links[b-40flsl1ayl]  a::after {
            content: "";
            position: absolute;
            right: 10px;
            bottom: 0;
            left: 10px;
            height: 3px;
            border-radius: 3px 3px 0 0;
            background: transparent;
        }

        .navigation-links[b-40flsl1ayl]  a.active {
            color: #64b5f6;
        }

            .navigation-links[b-40flsl1ayl]  a.active::after {
                background: #2d95f3;
            }

.language-switcher[b-40flsl1ayl] {
    margin-left: 12px;
    display: flex;
    align-items: center;
    gap: 5px;
    color: #70869b;
}

    .language-switcher button[b-40flsl1ayl] {
        padding: 4px;
        color: #8196aa;
        background: transparent;
        border: none;
        font-size: 0.74rem;
        font-weight: 800;
        cursor: pointer;
    }

        .language-switcher button:hover[b-40flsl1ayl],
        .language-switcher button.active[b-40flsl1ayl] {
            color: #ffffff;
        }

.navigation-toggle[b-40flsl1ayl],
.navigation-toggle-button[b-40flsl1ayl] {
    display: none;
}

@media (max-width: 1100px) {
    .navigation-links[b-40flsl1ayl] {
        position: absolute;
        top: var(--header-height);
        right: 0;
        left: 0;
        padding: 14px 24px 24px;
        display: none;
        align-items: stretch;
        flex-direction: column;
        background: #05111f;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        box-shadow: 0 20px 35px rgba(0, 0, 0, 0.28);
    }

        .navigation-links[b-40flsl1ayl]  a {
            min-height: 45px;
            padding: 0;
        }

            .navigation-links[b-40flsl1ayl]  a::after {
                right: auto;
                bottom: 3px;
                left: 0;
                width: 35px;
                height: 2px;
            }

    .navigation-toggle-button[b-40flsl1ayl] {
        width: 42px;
        height: 38px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 5px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        border-radius: 6px;
        cursor: pointer;
    }

        .navigation-toggle-button span[b-40flsl1ayl] {
            width: 20px;
            height: 2px;
            background: #ffffff;
            border-radius: 2px;
        }

    .navigation-toggle:checked ~ .navigation-links[b-40flsl1ayl] {
        display: flex;
    }

    .language-switcher[b-40flsl1ayl] {
        margin: 10px 0 0;
    }
}

@media (max-width: 520px) {
    .brand-text small[b-40flsl1ayl] {
        display: none;
    }
}
/* /Components/Layout/NavMenuEn.razor.rz.scp.css */
.main-navigation[b-886c2gm1ip] {
    min-height: var(--header-height);
    color: #ffffff;
    background: rgba(5, 17, 31, 0.97);
    border-bottom: 1px solid rgba(255, 255, 255, 0.09);
    backdrop-filter: blur(14px);
}

.navigation-container[b-886c2gm1ip] {
    min-height: var(--header-height);
    display: flex;
    align-items: center;
    gap: 30px;
}

.portfolio-brand[b-886c2gm1ip] {
    margin-right: auto;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #ffffff;
    text-decoration: none;
}

.brand-initials[b-886c2gm1ip] {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: #2d95f3;
    border-radius: 8px;
    font-size: 0.95rem;
    font-weight: 800;
}

.brand-text[b-886c2gm1ip] {
    display: flex;
    flex-direction: column;
}

    .brand-text strong[b-886c2gm1ip] {
        font-size: 1rem;
    }

    .brand-text small[b-886c2gm1ip] {
        margin-top: 1px;
        color: #8fa4b8;
        font-size: 0.67rem;
        letter-spacing: 0.07rem;
        text-transform: uppercase;
    }

.navigation-links[b-886c2gm1ip] {
    display: flex;
    align-items: center;
    gap: 4px;
}

    .navigation-links[b-886c2gm1ip]  a {
        position: relative;
        min-height: var(--header-height);
        padding: 0 10px;
        display: inline-flex;
        align-items: center;
        color: #cbd6e2;
        font-size: 0.84rem;
        font-weight: 600;
        text-decoration: none;
        transition: color var(--transition);
    }

        .navigation-links[b-886c2gm1ip]  a:hover {
            color: #ffffff;
        }

        .navigation-links[b-886c2gm1ip]  a::after {
            content: "";
            position: absolute;
            right: 10px;
            bottom: 0;
            left: 10px;
            height: 3px;
            border-radius: 3px 3px 0 0;
            background: transparent;
        }

        .navigation-links[b-886c2gm1ip]  a.active {
            color: #64b5f6;
        }

            .navigation-links[b-886c2gm1ip]  a.active::after {
                background: #2d95f3;
            }

.language-switcher[b-886c2gm1ip] {
    margin-left: 12px;
    display: flex;
    align-items: center;
    gap: 5px;
    color: #70869b;
}

    .language-switcher button[b-886c2gm1ip] {
        padding: 4px;
        color: #8196aa;
        background: transparent;
        border: none;
        font-size: 0.74rem;
        font-weight: 800;
        cursor: pointer;
    }

        .language-switcher button:hover[b-886c2gm1ip],
        .language-switcher button.active[b-886c2gm1ip] {
            color: #ffffff;
        }

.navigation-toggle[b-886c2gm1ip],
.navigation-toggle-button[b-886c2gm1ip] {
    display: none;
}

@media (max-width: 1100px) {
    .navigation-links[b-886c2gm1ip] {
        position: absolute;
        top: var(--header-height);
        right: 0;
        left: 0;
        padding: 14px 24px 24px;
        display: none;
        align-items: stretch;
        flex-direction: column;
        background: #05111f;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        box-shadow: 0 20px 35px rgba(0, 0, 0, 0.28);
    }

        .navigation-links[b-886c2gm1ip]  a {
            min-height: 45px;
            padding: 0;
        }

            .navigation-links[b-886c2gm1ip]  a::after {
                right: auto;
                bottom: 3px;
                left: 0;
                width: 35px;
                height: 2px;
            }

    .navigation-toggle-button[b-886c2gm1ip] {
        width: 42px;
        height: 38px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 5px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        border-radius: 6px;
        cursor: pointer;
    }

        .navigation-toggle-button span[b-886c2gm1ip] {
            width: 20px;
            height: 2px;
            background: #ffffff;
            border-radius: 2px;
        }

    .navigation-toggle:checked ~ .navigation-links[b-886c2gm1ip] {
        display: flex;
    }

    .language-switcher[b-886c2gm1ip] {
        margin: 10px 0 0;
    }
}

@media (max-width: 520px) {
    .brand-text small[b-886c2gm1ip] {
        display: none;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-yby107jgnu],
.components-reconnect-repeated-attempt-visible[b-yby107jgnu],
.components-reconnect-failed-visible[b-yby107jgnu],
.components-pause-visible[b-yby107jgnu],
.components-resume-failed-visible[b-yby107jgnu],
.components-rejoining-animation[b-yby107jgnu] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-yby107jgnu],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-yby107jgnu],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-yby107jgnu],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-yby107jgnu],
#components-reconnect-modal.components-reconnect-retrying[b-yby107jgnu],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-yby107jgnu],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-yby107jgnu],
#components-reconnect-modal.components-reconnect-failed[b-yby107jgnu],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-yby107jgnu] {
    display: block;
}


#components-reconnect-modal[b-yby107jgnu] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-yby107jgnu 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-yby107jgnu 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-yby107jgnu 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-yby107jgnu]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-yby107jgnu 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-yby107jgnu {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-yby107jgnu {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-yby107jgnu {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-yby107jgnu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-yby107jgnu] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-yby107jgnu] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-yby107jgnu] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-yby107jgnu] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-yby107jgnu] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-yby107jgnu] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-yby107jgnu 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-yby107jgnu] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-yby107jgnu {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/English/About.razor.rz.scp.css */
.about-page[b-jxuavlil20] {
    width: 100%;
    padding: 55px 24px 60px;
    background: #071525;
}

.about-heading[b-jxuavlil20] {
    text-align: center;
    margin-bottom: 45px;
}

.about-eyebrow[b-jxuavlil20] {
    display: block;
    margin-bottom: 12px;
    color: #3da5ff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
}

.about-heading h1[b-jxuavlil20] {
    margin: 0;
    color: #ffffff;
    font-size: 48px;
    font-weight: 700;
    line-height: 1.1;
}

.heading-line[b-jxuavlil20] {
    width: 50px;
    height: 3px;
    margin: 18px auto 0;
    border-radius: 5px;
    background: #3da5ff;
}


/* ==================================================
   ABOUT CARD
================================================== */

.about-card[b-jxuavlil20] {
    width: 100%;
    max-width: 1050px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 43% 57%;
    overflow: hidden;
    background: #12395f;
    border: 1px solid rgba(61, 165, 255, 0.45);
    border-radius: 14px;
}


/* ==================================================
   LEFT SIDE
================================================== */

.about-visual[b-jxuavlil20] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: #12395f;
}


/* PHOTO */

.about-photo[b-jxuavlil20] {
    min-height: 430px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #12395f;
}

    .about-photo img[b-jxuavlil20] {
        display: block;
        width: auto;
        height: 390px;
        max-width: 92%;
        object-fit: contain;
        object-position: center center;
        margin: 0 auto;
    }


/* ==================================================
   PROFESSIONAL APPROACH
================================================== */

.professional-approach[b-jxuavlil20] {
    min-height: 120px;
    padding: 24px 28px 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: #12395f;
    border-top: 1px solid rgba(61, 165, 255, 0.22);
}

.approach-label[b-jxuavlil20] {
    display: block;
    margin-bottom: 10px;
    color: #4aafff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.6px;
    text-transform: uppercase;
}

.professional-approach p[b-jxuavlil20] {
    margin: 0;
    max-width: 330px;
    color: #ffffff;
    font-size: 15px;
    line-height: 1.6;
    text-align: center;
}


/* ==================================================
   RIGHT SIDE
================================================== */

.about-content[b-jxuavlil20] {
    min-width: 0;
    padding: 52px 48px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #12395f;
}

.profile-name[b-jxuavlil20] {
    display: block;
    margin-bottom: 18px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.about-content h2[b-jxuavlil20] {
    margin: 0 0 27px;
    max-width: 520px;
    color: #ffffff;
    font-size: 31px;
    font-weight: 700;
    line-height: 1.28;
}

.about-content p[b-jxuavlil20] {
    margin: 0 0 19px;
    color: #e2edf7;
    font-size: 15px;
    line-height: 1.75;
}

.about-content .about-lead[b-jxuavlil20] {
    color: #ffffff;
    font-weight: 700;
}


/* ==================================================
   BUTTONS
================================================== */

.about-actions[b-jxuavlil20] {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 10px;
}

    .about-actions a[b-jxuavlil20] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 46px;
        padding: 0 22px;
        border-radius: 6px;
        font-size: 14px;
        font-weight: 700;
        text-decoration: none;
        transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
    }

.btn-primary[b-jxuavlil20] {
    color: #ffffff;
    background: #329df4;
    border: 1px solid #329df4;
}

    .btn-primary:hover[b-jxuavlil20] {
        background: #1688e5;
        border-color: #1688e5;
        transform: translateY(-1px);
    }

.btn-secondary[b-jxuavlil20] {
    color: #ffffff;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.65);
}

    .btn-secondary:hover[b-jxuavlil20] {
        background: rgba(255, 255, 255, 0.08);
        border-color: #ffffff;
        transform: translateY(-1px);
    }


/* ==================================================
   EXPERTISE
================================================== */

.expertise-section[b-jxuavlil20] {
    padding: 10px 24px 70px;
    background: #071525;
}

.section-heading[b-jxuavlil20] {
    text-align: center;
}

    .section-heading h2[b-jxuavlil20] {
        margin: 0;
        color: #ffffff;
        font-size: 31px;
        font-weight: 700;
    }


/* ==================================================
   RESPONSIVE
================================================== */

@media (max-width: 900px) {

    .about-card[b-jxuavlil20] {
        max-width: 680px;
        grid-template-columns: 1fr;
    }

    .about-photo[b-jxuavlil20] {
        min-height: 420px;
    }

        .about-photo img[b-jxuavlil20] {
            height: 390px;
            max-width: 90%;
        }

    .professional-approach[b-jxuavlil20] {
        min-height: 110px;
    }

    .about-content[b-jxuavlil20] {
        padding: 42px 36px;
    }
}


@media (max-width: 600px) {

    .about-page[b-jxuavlil20] {
        padding: 40px 16px 45px;
    }

    .about-heading[b-jxuavlil20] {
        margin-bottom: 32px;
    }

        .about-heading h1[b-jxuavlil20] {
            font-size: 38px;
        }

    .about-photo[b-jxuavlil20] {
        min-height: 340px;
    }

        .about-photo img[b-jxuavlil20] {
            height: 320px;
            max-width: 92%;
        }

    .professional-approach[b-jxuavlil20] {
        min-height: 100px;
        padding: 20px 20px 22px;
    }

        .professional-approach p[b-jxuavlil20] {
            font-size: 14px;
        }

    .about-content[b-jxuavlil20] {
        padding: 34px 24px;
    }

        .about-content h2[b-jxuavlil20] {
            font-size: 26px;
        }

        .about-content p[b-jxuavlil20] {
            font-size: 14px;
        }

    .about-actions[b-jxuavlil20] {
        flex-direction: column;
    }

        .about-actions a[b-jxuavlil20] {
            width: 100%;
        }

    .section-heading h2[b-jxuavlil20] {
        font-size: 27px;
    }
}
/* ==================================================
   EXPERTISE SECTION
================================================== */

.expertise-section[b-jxuavlil20] {
    width: 100%;
    padding: 70px 24px 90px;
    background: #071525;
}

.section-heading[b-jxuavlil20] {
    margin-bottom: 42px;
    text-align: center;
}

    .section-heading h2[b-jxuavlil20] {
        margin: 0;
        color: #ffffff;
        font-size: 31px;
        font-weight: 700;
    }

.expertise-grid[b-jxuavlil20] {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.expertise-card[b-jxuavlil20] {
    min-height: 220px;
    padding: 30px 28px;
    background: linear-gradient( 145deg, rgba(23, 63, 104, 0.82), rgba(10, 36, 65, 0.97) );
    border: 1px solid rgba(100, 181, 246, 0.30);
    border-radius: 12px;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

    .expertise-card:hover[b-jxuavlil20] {
        transform: translateY(-5px);
        border-color: rgba(100, 181, 246, 0.75);
        box-shadow: 0 20px 45px rgba(0, 0, 0, 0.22);
    }

.expertise-number[b-jxuavlil20] {
    display: block;
    margin-bottom: 25px;
    color: #64b5f6;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.expertise-card h3[b-jxuavlil20] {
    margin: 0 0 15px;
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
}

.expertise-card p[b-jxuavlil20] {
    margin: 0;
    color: #c1d0df;
    font-size: 15px;
    line-height: 1.7;
}


/* PGP / EDUCATION CARD */

.pgp-card[b-jxuavlil20] {
    grid-column: 2;
    border-color: rgba(100, 181, 246, 0.55);
    background: linear-gradient( 145deg, #184d7d, #0d3154 );
}


/* TABLET */

@media (max-width: 900px) {

    .expertise-grid[b-jxuavlil20] {
        grid-template-columns: repeat(2, 1fr);
    }

    .pgp-card[b-jxuavlil20] {
        grid-column: 1 / -1;
        max-width: 540px;
        width: 100%;
        margin: 0 auto;
    }
}


/* MOBILE */

@media (max-width: 600px) {

    .expertise-section[b-jxuavlil20] {
        padding: 55px 16px 70px;
    }

    .expertise-grid[b-jxuavlil20] {
        grid-template-columns: 1fr;
    }

    .pgp-card[b-jxuavlil20] {
        grid-column: auto;
        max-width: none;
    }

    .expertise-card[b-jxuavlil20] {
        min-height: auto;
    }
}
/* /Components/Pages/English/Awards .razor.rz.scp.css */
.awards-page[b-mt6auge8hh] {
    --page-background: #07111f;
    --page-background-soft: #0b1727;
    --card-background: rgba(13, 29, 48, 0.82);
    --card-background-strong: rgba(15, 34, 56, 0.96);
    --border-color: rgba(148, 184, 221, 0.17);
    --border-highlight: rgba(197, 160, 72, 0.42);
    --primary-text: #f4f7fb;
    --secondary-text: #b5c2d1;
    --muted-text: #8999ab;
    --gold: #d7b45d;
    --gold-light: #f0d58a;
    --blue: #5da7e8;
    --shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
    min-height: 100%;
    overflow: hidden;
    color: var(--primary-text);
    background: radial-gradient( circle at 15% 15%, rgba(43, 106, 168, 0.12), transparent 32% ), linear-gradient( 180deg, #07111f 0%, #091525 46%, #07111f 100% );
}

.page-shell[b-mt6auge8hh] {
    width: min(1180px, calc(100% - 40px));
    margin-inline: auto;
}

/* HERO */

.awards-hero[b-mt6auge8hh] {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    min-height: 520px;
    padding: 110px 0 90px;
    overflow: hidden;
    border-bottom: 1px solid var(--border-color);
}

    .awards-hero[b-mt6auge8hh]::before {
        position: absolute;
        z-index: -2;
        inset: 0;
        content: "";
        background: linear-gradient( 90deg, rgba(7, 17, 31, 0.98) 0%, rgba(7, 17, 31, 0.86) 55%, rgba(7, 17, 31, 0.64) 100% );
    }

    .awards-hero[b-mt6auge8hh]::after {
        position: absolute;
        z-index: -1;
        right: -120px;
        bottom: -160px;
        width: 600px;
        height: 600px;
        content: "";
        border: 1px solid rgba(215, 180, 93, 0.12);
        border-radius: 50%;
        box-shadow: 0 0 0 80px rgba(215, 180, 93, 0.025), 0 0 0 160px rgba(215, 180, 93, 0.018);
    }

.hero-content[b-mt6auge8hh] {
    position: relative;
    z-index: 2;
}

.eyebrow[b-mt6auge8hh],
.section-kicker[b-mt6auge8hh] {
    margin: 0 0 14px;
    color: var(--gold-light);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.19em;
    text-transform: uppercase;
}

.awards-hero h1[b-mt6auge8hh] {
    max-width: 850px;
    margin: 0;
    color: var(--primary-text);
    font-size: clamp(3.1rem, 6vw, 6.2rem);
    font-weight: 750;
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.hero-lead[b-mt6auge8hh] {
    max-width: 760px;
    margin: 30px 0 0;
    color: var(--secondary-text);
    font-size: clamp(1.05rem, 2vw, 1.3rem);
    line-height: 1.8;
}

.hero-highlights[b-mt6auge8hh] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 36px;
}

    .hero-highlights span[b-mt6auge8hh] {
        padding: 10px 16px;
        border: 1px solid rgba(215, 180, 93, 0.23);
        border-radius: 999px;
        color: #d8e1eb;
        background: rgba(215, 180, 93, 0.055);
        font-size: 0.84rem;
        font-weight: 650;
    }

.hero-glow[b-mt6auge8hh] {
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    filter: blur(5px);
    pointer-events: none;
}

.hero-glow-left[b-mt6auge8hh] {
    top: -180px;
    left: -180px;
    width: 520px;
    height: 520px;
    background: rgba(42, 112, 181, 0.14);
}

.hero-glow-right[b-mt6auge8hh] {
    right: 10%;
    bottom: -240px;
    width: 500px;
    height: 500px;
    background: rgba(215, 180, 93, 0.07);
}

/* AWARD SECTIONS */

.award-section[b-mt6auge8hh] {
    position: relative;
    padding: 110px 0;
    border-bottom: 1px solid var(--border-color);
}

.award-section-iraq[b-mt6auge8hh] {
    background: linear-gradient( 135deg, rgba(11, 27, 45, 0.94), rgba(7, 17, 31, 0.98) );
}

.award-section-kuwait[b-mt6auge8hh] {
    background: radial-gradient( circle at 85% 50%, rgba(49, 113, 169, 0.08), transparent 34% ), var(--page-background);
}

.award-layout[b-mt6auge8hh] {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(440px, 1.08fr);
    gap: clamp(48px, 7vw, 90px);
    align-items: center;
}

.award-layout-reversed .award-content[b-mt6auge8hh] {
    order: 2;
}

.award-layout-reversed .award-visual[b-mt6auge8hh] {
    order: 1;
}

.award-content h2[b-mt6auge8hh] {
    margin: 0;
    color: var(--primary-text);
    font-size: clamp(1.8rem, 3vw);
    font-weight: 650;
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.award-introduction[b-mt6auge8hh] {
    margin: 24px 0 0;
    color: var(--secondary-text);
    font-size: 1.03rem;
    line-height: 1.85;
}

.recognition-list[b-mt6auge8hh] {
    display: grid;
    gap: 16px;
    margin-top: 34px;
}

.recognition-item[b-mt6auge8hh] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 18px;
    padding: 22px;
    border: 1px solid var(--border-color);
    border-radius: 18px;
    background: linear-gradient( 145deg, rgba(20, 42, 67, 0.72), rgba(10, 24, 41, 0.8) );
    box-shadow: 0 15px 34px rgba(0, 0, 0, 0.12);
    transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

    .recognition-item:hover[b-mt6auge8hh] {
        transform: translateY(-3px);
        border-color: var(--border-highlight);
    }

.recognition-icon[b-mt6auge8hh] {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(215, 180, 93, 0.32);
    border-radius: 13px;
    color: var(--gold-light);
    background: rgba(215, 180, 93, 0.08);
    font-size: 1rem;
}

.recognition-item h3[b-mt6auge8hh] {
    margin: 1px 0 8px;
    color: var(--primary-text);
    font-size: 1.06rem;
    font-weight: 730;
}

.recognition-item p[b-mt6auge8hh] {
    margin: 0;
    color: var(--secondary-text);
    font-size: 0.94rem;
    line-height: 1.68;
}

/* IMAGES */

.award-visual[b-mt6auge8hh] {
    position: relative;
    margin: 0;
}

.image-frame[b-mt6auge8hh] {
    position: relative;
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(215, 180, 93, 0.24);
    border-radius: 26px;
    background: linear-gradient( 145deg, rgba(215, 180, 93, 0.1), rgba(76, 139, 197, 0.07) );
    box-shadow: var(--shadow);
}

    .image-frame[b-mt6auge8hh]::before {
        position: absolute;
        z-index: 2;
        inset: 10px;
        content: "";
        border: 1px solid rgba(255, 255, 255, 0.07);
        border-radius: 18px;
        pointer-events: none;
    }

    .image-frame img[b-mt6auge8hh] {
        display: block;
        width: 100%;
        height: auto;
        max-height: 660px;
        object-fit: contain;
        border-radius: 18px;
        background: #081321;
    }

.award-visual figcaption[b-mt6auge8hh] {
    max-width: 90%;
    margin: 17px auto 0;
    color: var(--muted-text);
    font-size: 0.83rem;
    line-height: 1.6;
    text-align: center;
}

/* VERIFICATION */

.verification-section[b-mt6auge8hh] {
    padding: 95px 0 115px;
    background: linear-gradient( 180deg, rgba(9, 21, 37, 0.78), rgba(7, 17, 31, 1) );
}

.verification-card[b-mt6auge8hh] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 26px;
    padding: clamp(30px, 5vw, 48px);
    border: 1px solid rgba(215, 180, 93, 0.23);
    border-radius: 24px;
    background: linear-gradient( 135deg, rgba(18, 38, 61, 0.94), rgba(10, 24, 41, 0.94) );
    box-shadow: var(--shadow);
}

.verification-badge[b-mt6auge8hh] {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border: 1px solid rgba(215, 180, 93, 0.42);
    border-radius: 17px;
    color: #07111f;
    background: linear-gradient( 135deg, var(--gold-light), var(--gold) );
    font-size: 1.3rem;
    font-weight: 900;
    box-shadow: 0 12px 28px rgba(215, 180, 93, 0.18);
}

.verification-card h2[b-mt6auge8hh] {
    margin: 0 0 18px;
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    line-height: 1.2;
    letter-spacing: -0.025em;
}

.verification-card p:not(.section-kicker)[b-mt6auge8hh] {
    max-width: 880px;
    margin: 0;
    color: var(--secondary-text);
    line-height: 1.8;
}

.verification-card p + p[b-mt6auge8hh] {
    margin-top: 14px;
}

/* RESPONSIVE */

@media (max-width: 980px) {
    .award-layout[b-mt6auge8hh] {
        grid-template-columns: 1fr;
    }

    .award-layout-reversed .award-content[b-mt6auge8hh],
    .award-layout-reversed .award-visual[b-mt6auge8hh] {
        order: initial;
    }

    .award-visual[b-mt6auge8hh] {
        max-width: 760px;
        width: 100%;
        margin-inline: auto;
    }
}

@media (max-width: 700px) {
    .page-shell[b-mt6auge8hh] {
        width: min(100% - 28px, 1180px);
    }

    .awards-hero[b-mt6auge8hh] {
        min-height: auto;
        padding: 88px 0 72px;
    }

        .awards-hero h1[b-mt6auge8hh] {
            font-size: clamp(2.8rem, 15vw, 4.3rem);
        }

    .hero-lead[b-mt6auge8hh] {
        margin-top: 24px;
        font-size: 1rem;
    }

    .hero-highlights[b-mt6auge8hh] {
        margin-top: 28px;
    }

        .hero-highlights span[b-mt6auge8hh] {
            padding: 8px 12px;
            font-size: 0.76rem;
        }

    .award-section[b-mt6auge8hh] {
        padding: 78px 0;
    }

    .award-layout[b-mt6auge8hh] {
        gap: 42px;
    }

    .recognition-item[b-mt6auge8hh] {
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 20px;
    }

    .recognition-icon[b-mt6auge8hh] {
        width: 40px;
        height: 40px;
    }

    .verification-section[b-mt6auge8hh] {
        padding: 72px 0 90px;
    }

    .verification-card[b-mt6auge8hh] {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 26px 22px;
    }

    .verification-badge[b-mt6auge8hh] {
        width: 50px;
        height: 50px;
        border-radius: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .recognition-item[b-mt6auge8hh] {
        transition: none;
    }

        .recognition-item:hover[b-mt6auge8hh] {
            transform: none;
        }
}
/* /Components/Pages/English/Contact.razor.rz.scp.css */
.contact-hero[b-ss5ze3yuwo] {
    padding: 6rem 0 4rem;
    background: linear-gradient(180deg,#0b1220,#111827);
    text-align: center;
    color: #ccd3d9;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    line-height: 1.6;
}
.portfolio-container1[b-ss5ze3yuwo] {
    overflow-x: hidden;
    color: #ccd3d9;
    background: #0f172a;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    line-height: 1.6;
}
.contact-info[b-ss5ze3yuwo] {
    padding: 6rem 0 4rem;
    color: #ccd3d9;
    background: #0f172a;
    text-align: center;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    line-height: 1.6;
}
.section-label[b-ss5ze3yuwo] {
    color: #ccd3d9;
    letter-spacing: .2rem;
    text-transform: uppercase;
    font-size: .85rem; 
}

.lead[b-ss5ze3yuwo] {
    max-width: 760px;
    margin: 1.5rem auto;
    color: #cbd5e1;
    line-height: 1.8
}

.linkedin-card[b-ss5ze3yuwo] {
    display: inline-block;
    width: 300px;
    max-width: 100%;
    margin-top: 2rem;
    border-radius: 14px;
    overflow: hidden;
    transition: .25s ease;
}

    .linkedin-card img[b-ss5ze3yuwo] {
        display: block;
        width: 100%;
        height: auto;
    }

    .linkedin-card:hover[b-ss5ze3yuwo] {
        transform: translateY(-4px);
        box-shadow: 0 12px 30px rgba(10,102,194,.30);
    }
    
    .contact-section[b-ss5ze3yuwo] {
    padding: 5rem 0;
    background: #0f172a
}

.grid[b-ss5ze3yuwo] {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(300px,1fr));
    gap: 2rem
}

.card[b-ss5ze3yuwo] {
    background: #1e293b;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    padding: 2rem;
    box-shadow: 0 20px 40px rgba(0,0,0,.25);
    color: #ccd3d9;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    line-height: 1.6;
}

    .card h2[b-ss5ze3yuwo] {
        margin-bottom: 1rem 
    }

    .card p[b-ss5ze3yuwo], .card li[b-ss5ze3yuwo] {
        line-height: 1.7;
        color: #8fa7c4
    }

.closing[b-ss5ze3yuwo] {
    padding: 5rem 0;
    text-align: center;
    background: #111827;
    color: #ccd3d9;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    line-height: 1.6;
}

    @media(max-width:885px) {
        .grid[b-ss5ze3yuwo] {
            grid-template-columns: 1fr
        }

        .contact-hero[b-ss5ze3yuwo] {
            padding: 4rem 0 3rem
        }

        .contact-section[b-ss5ze3yuwo], .closing[b-ss5ze3yuwo] {
            padding: 3rem 0
        }
    }
/* /Components/Pages/English/Education.razor.rz.scp.css */
.education-hero[b-i9lctlmcap] {
    position: relative;
    overflow: hidden;
    padding: 105px 0 85px;
    color: #ffffff;
    background: radial-gradient( circle at 82% 25%, rgba(45, 149, 243, 0.27), transparent 35% ), linear-gradient( 120deg, #041120 0%, #082445 55%, #0b3158 100% );
}

    .education-hero[b-i9lctlmcap]::before {
        content: "";
        position: absolute;
        inset: 0;
        opacity: 0.2;
        pointer-events: none;
        background-image: linear-gradient( rgba(100, 181, 246, 0.08) 1px, transparent 1px ), linear-gradient( 90deg, rgba(100, 181, 246, 0.08) 1px, transparent 1px );
        background-size: 70px 70px;
    }

.education-hero-container[b-i9lctlmcap] {
    position: relative;
    z-index: 1;
}

.section-label[b-i9lctlmcap] {
    margin: 0 0 16px;
    color: #64b5f6;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.18rem;
}

.education-hero h1[b-i9lctlmcap] {
    margin: 0;
    color: #ffffff;
    font-size: clamp(3.1rem, 7vw, 5.5rem);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.13rem;
}

.education-intro[b-i9lctlmcap] {
    max-width: 800px;
    margin: 28px 0 0;
    color: #cbd7e4;
    font-size: 1.1rem;
    line-height: 1.8;
}

.education-summary[b-i9lctlmcap] {
    margin-top: 50px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    overflow: hidden;
    background: rgba(7, 21, 37, 0.7);
    border: 1px solid rgba(100, 181, 246, 0.22);
    border-radius: 14px;
    backdrop-filter: blur(8px);
}

    .education-summary article[b-i9lctlmcap] {
        min-height: 125px;
        padding: 25px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        border-right: 1px solid rgba(100, 181, 246, 0.18);
    }

        .education-summary article:last-child[b-i9lctlmcap] {
            border-right: none;
        }

    .education-summary strong[b-i9lctlmcap] {
        color: #ffffff;
        font-size: 2rem;
        line-height: 1;
    }

    .education-summary span[b-i9lctlmcap] {
        margin-top: 10px;
        color: #9fb4c7;
        font-size: 0.9rem;
        line-height: 1.45;
    }

/* GLAVNA SEKCIJA */

.education-section[b-i9lctlmcap] {
    padding: 95px 0;
    color: #ffffff;
    background: #071525;
}

.section-heading[b-i9lctlmcap] {
    max-width: 790px;
    margin-bottom: 60px;
}

    .section-heading h2[b-i9lctlmcap] {
        margin: 0;
        color: #ffffff;
        font-size: clamp(2rem, 4vw, 3.2rem);
        font-weight: 600;
        letter-spacing: -0.05rem;
    }

    .section-heading > p:last-child[b-i9lctlmcap] {
        margin: 20px 0 0;
        color: #aebdca;
        font-size: 1.03rem;
        line-height: 1.75;
    }

/* VREMENSKA LINIJA */

.education-timeline[b-i9lctlmcap] {
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
}

    .education-timeline[b-i9lctlmcap]::before {
        content: "";
        position: absolute;
        top: 10px;
        bottom: 10px;
        left: 15px;
        width: 2px;
        background: linear-gradient( to bottom, #2d95f3, rgba(45, 149, 243, 0.18) );
    }

.education-item[b-i9lctlmcap] {
    position: relative;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 26px;
    margin-bottom: 32px;
}

    .education-item:last-child[b-i9lctlmcap] {
        margin-bottom: 0;
    }

.education-marker[b-i9lctlmcap] {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: center;
    padding-top: 36px;
}

    .education-marker span[b-i9lctlmcap] {
        display: block;
        width: 17px;
        height: 17px;
        background: #2d95f3;
        border: 4px solid #071525;
        border-radius: 50%;
        box-shadow: 0 0 0 2px rgba(100, 181, 246, 0.5);
    }

.education-card[b-i9lctlmcap] {
    padding: 34px;
    background: linear-gradient( 145deg, rgba(23, 63, 104, 0.72), rgba(10, 36, 65, 0.96) );
    border: 1px solid rgba(100, 181, 246, 0.24);
    border-radius: 14px;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

    .education-card:hover[b-i9lctlmcap] {
        transform: translateY(-4px);
        border-color: rgba(100, 181, 246, 0.65);
        box-shadow: 0 22px 48px rgba(0, 0, 0, 0.25);
    }

.featured-item .education-card[b-i9lctlmcap] {
    border-color: rgba(100, 181, 246, 0.52);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.18);
}

.education-card-header[b-i9lctlmcap] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 25px;
}

.education-period[b-i9lctlmcap] {
    margin: 0 0 12px;
    color: #64b5f6;
    font-size: 0.83rem;
    font-weight: 800;
    letter-spacing: 0.08rem;
}

.education-card h3[b-i9lctlmcap] {
    max-width: 760px;
    margin: 0;
    color: #ffffff;
    font-size: 1.45rem;
    line-height: 1.4;
}

.education-degree[b-i9lctlmcap] {
    margin: 13px 0 0;
    color: #d9e7f5;
    font-size: 1.02rem;
    font-weight: 600;
    line-height: 1.55;
}

    .education-degree span[b-i9lctlmcap] {
        margin-left: 8px;
        color: #8dc8fb;
    }

.education-status[b-i9lctlmcap] {
    flex: 0 0 auto;
    padding: 8px 12px;
    color: #d9efff;
    background: rgba(45, 149, 243, 0.16);
    border: 1px solid rgba(100, 181, 246, 0.38);
    border-radius: 999px;
    font-size: 0.77rem;
    font-weight: 800;
    letter-spacing: 0.04rem;
}

.education-status-neutral[b-i9lctlmcap] {
    color: #d7dde3;
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.18);
}

.education-description[b-i9lctlmcap] {
    margin: 25px 0 0;
    color: #b7c5d3;
    font-size: 1rem;
    line-height: 1.75;
}

.education-highlights[b-i9lctlmcap] {
    margin-top: 27px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow: hidden;
    background: rgba(4, 17, 32, 0.45);
    border: 1px solid rgba(100, 181, 246, 0.15);
    border-radius: 10px;
}

    .education-highlights div[b-i9lctlmcap] {
        min-height: 95px;
        padding: 19px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        border-right: 1px solid rgba(100, 181, 246, 0.14);
    }

        .education-highlights div:last-child[b-i9lctlmcap] {
            border-right: none;
        }

    .education-highlights strong[b-i9lctlmcap] {
        color: #ffffff;
        font-size: 1.5rem;
    }

    .education-highlights span[b-i9lctlmcap] {
        margin-top: 7px;
        color: #93a8ba;
        font-size: 0.82rem;
    }

.education-tags[b-i9lctlmcap] {
    margin-top: 24px;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

    .education-tags span[b-i9lctlmcap] {
        padding: 7px 11px;
        color: #a9d7fc;
        background: rgba(45, 149, 243, 0.1);
        border: 1px solid rgba(100, 181, 246, 0.2);
        border-radius: 999px;
        font-size: 0.78rem;
        font-weight: 700;
    }

/* ZAVRŠNA SEKCIJA */

.education-connection-section[b-i9lctlmcap] {
    padding: 85px 0;
    color: #ffffff;
    background: #0a2037;
}

.education-connection-card[b-i9lctlmcap] {
    padding: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    background: linear-gradient( 135deg, rgba(23, 63, 104, 0.88), rgba(7, 21, 37, 0.96) );
    border: 1px solid rgba(100, 181, 246, 0.3);
    border-radius: 14px;
}

    .education-connection-card > div[b-i9lctlmcap] {
        max-width: 780px;
    }

    .education-connection-card h2[b-i9lctlmcap] {
        margin: 0;
        color: #ffffff;
        font-size: clamp(1.8rem, 4vw, 2.7rem);
    }

    .education-connection-card p:last-child[b-i9lctlmcap] {
        margin: 20px 0 0;
        color: #b7c5d3;
        line-height: 1.75;
    }

/* TABLET */

@media (max-width: 1000px) {
    .education-summary[b-i9lctlmcap] {
        grid-template-columns: repeat(2, 1fr);
    }

        .education-summary article:nth-child(2)[b-i9lctlmcap] {
            border-right: none;
        }

        .education-summary article:nth-child(-n + 2)[b-i9lctlmcap] {
            border-bottom: 1px solid rgba(100, 181, 246, 0.18);
        }

    .education-connection-card[b-i9lctlmcap] {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* MOBITEL */

@media (max-width: 650px) {
    .education-hero[b-i9lctlmcap] {
        padding: 80px 0 65px;
    }

        .education-hero h1[b-i9lctlmcap] {
            font-size: clamp(2.8rem, 15vw, 4rem);
            letter-spacing: -0.07rem;
        }

    .education-intro[b-i9lctlmcap] {
        font-size: 1rem;
    }

    .education-summary[b-i9lctlmcap] {
        grid-template-columns: 1fr;
    }

        .education-summary article[b-i9lctlmcap] {
            min-height: 105px;
            border-right: none;
            border-bottom: 1px solid rgba(100, 181, 246, 0.18);
        }

            .education-summary article:last-child[b-i9lctlmcap] {
                border-bottom: none;
            }

    .education-section[b-i9lctlmcap] {
        padding: 75px 0;
    }

    .education-item[b-i9lctlmcap] {
        grid-template-columns: 22px minmax(0, 1fr);
        gap: 14px;
    }

    .education-timeline[b-i9lctlmcap]::before {
        left: 10px;
    }

    .education-marker[b-i9lctlmcap] {
        padding-top: 30px;
    }

        .education-marker span[b-i9lctlmcap] {
            width: 14px;
            height: 14px;
            border-width: 3px;
        }

    .education-card[b-i9lctlmcap] {
        padding: 25px 21px;
    }

    .education-card-header[b-i9lctlmcap] {
        flex-direction: column;
        gap: 16px;
    }

    .education-card h3[b-i9lctlmcap] {
        font-size: 1.22rem;
    }

    .education-degree span[b-i9lctlmcap] {
        display: block;
        margin: 5px 0 0;
    }

    .education-highlights[b-i9lctlmcap] {
        grid-template-columns: 1fr;
    }

        .education-highlights div[b-i9lctlmcap] {
            min-height: 82px;
            border-right: none;
            border-bottom: 1px solid rgba(100, 181, 246, 0.14);
        }

            .education-highlights div:last-child[b-i9lctlmcap] {
                border-bottom: none;
            }

    .education-connection-card[b-i9lctlmcap] {
        padding: 30px 24px;
    }

        .education-connection-card .portfolio-button[b-i9lctlmcap] {
            width: 100%;
            text-align: center;
        }
}
/* /Components/Pages/English/Experience.razor.rz.scp.css */
html[b-g3hm25d6gv] {
    scroll-behavior: smooth;
}


/* =========================================================
   HERO
========================================================= */

.experience-hero[b-g3hm25d6gv] {
    position: relative;
    overflow: hidden;
    padding: 105px 0 95px;
    color: #ffffff;
    background: radial-gradient( circle at 80% 20%, rgba(45, 149, 243, 0.22), transparent 34% ), linear-gradient( 120deg, #041120 0%, #082445 55%, #0b3158 100% );
}

    .experience-hero[b-g3hm25d6gv]::before {
        content: "";
        position: absolute;
        inset: 0;
        opacity: 0.2;
        pointer-events: none;
        background-image: linear-gradient( rgba(100, 181, 246, 0.08) 1px, transparent 1px ), linear-gradient( 90deg, rgba(100, 181, 246, 0.08) 1px, transparent 1px );
        background-size: 70px 70px;
    }

.experience-hero-content[b-g3hm25d6gv] {
    position: relative;
    z-index: 1;
}

.page-label[b-g3hm25d6gv] {
    margin: 0 0 17px;
    color: #64b5f6;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.2rem;
}

.experience-hero h1[b-g3hm25d6gv] {
    max-width: 900px;
    margin: 0;
    font-size: clamp(3rem, 6vw, 5.4rem);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.15rem;
}

.experience-hero-description[b-g3hm25d6gv] {
    max-width: 800px;
    margin: 27px 0 0;
    color: #cbd7e4;
    font-size: 1.1rem;
    line-height: 1.75;
}


/* =========================================================
   SUMMARY
========================================================= */

.experience-summary[b-g3hm25d6gv] {
    max-width: 880px;
    margin-top: 45px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow: hidden;
    border: 1px solid rgba(100, 181, 246, 0.25);
    border-radius: 12px;
    background: rgba(4, 17, 32, 0.42);
    backdrop-filter: blur(12px);
}

    .experience-summary article[b-g3hm25d6gv] {
        min-height: 125px;
        padding: 25px 27px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        border-right: 1px solid rgba(100, 181, 246, 0.2);
    }

        .experience-summary article:last-child[b-g3hm25d6gv] {
            border-right: none;
        }

    .experience-summary strong[b-g3hm25d6gv] {
        color: #ffffff;
        font-size: 2rem;
        line-height: 1;
    }

    .experience-summary span[b-g3hm25d6gv] {
        margin-top: 10px;
        color: #aebdcd;
        line-height: 1.45;
    }


/* =========================================================
   EXPERIENCE NAVIGATION
========================================================= */

.experience-navigation[b-g3hm25d6gv] {
    position: sticky;
    top: 78px;
    z-index: 50;
    background: rgba(7, 21, 37, 0.96);
    border-bottom: 1px solid rgba(100, 181, 246, 0.15);
    box-shadow: 0 10px 30px rgba(2, 12, 24, 0.15);
    backdrop-filter: blur(14px);
}

.experience-navigation-content[b-g3hm25d6gv] {
    min-height: 72px;
    display: flex;
    align-items: stretch;
    justify-content: center;
}

.experience-navigation a[b-g3hm25d6gv] {
    min-width: 190px;
    padding: 14px 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #d7e2ed;
    text-align: center;
    text-decoration: none;
    border-right: 1px solid rgba(100, 181, 246, 0.12);
    transition: color 180ms ease, background-color 180ms ease;
}

    .experience-navigation a:first-child[b-g3hm25d6gv] {
        border-left: 1px solid rgba(100, 181, 246, 0.12);
    }

    .experience-navigation a:hover[b-g3hm25d6gv] {
        color: #ffffff;
        background: rgba(45, 149, 243, 0.12);
    }

    .experience-navigation a span[b-g3hm25d6gv] {
        margin-bottom: 3px;
        color: #64b5f6;
        font-size: 0.75rem;
        font-weight: 800;
        letter-spacing: 0.06rem;
    }


/* =========================================================
   MAIN PAGE
========================================================= */

.experience-page[b-g3hm25d6gv] {
    padding: 100px 0;
    color: #ffffff;
    background: #071525;
}


/* =========================================================
   TIMELINE
========================================================= */

.timeline[b-g3hm25d6gv] {
    position: relative;
}

    .timeline[b-g3hm25d6gv]::before {
        content: "";
        position: absolute;
        top: 25px;
        bottom: 25px;
        left: 205px;
        width: 1px;
        background: linear-gradient( to bottom, transparent, rgba(100, 181, 246, 0.5) 5%, rgba(100, 181, 246, 0.22) 95%, transparent );
    }

.timeline-entry[b-g3hm25d6gv] {
    position: relative;
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    gap: 70px;
    scroll-margin-top: 175px;
}

    .timeline-entry + .timeline-entry[b-g3hm25d6gv] {
        margin-top: 95px;
    }


/* =========================================================
   TIMELINE MARKER
========================================================= */

.timeline-marker[b-g3hm25d6gv] {
    position: absolute;
    top: 30px;
    left: 194px;
    z-index: 2;
    width: 23px;
    height: 23px;
    padding: 4px;
    border: 1px solid #64b5f6;
    border-radius: 50%;
    background: #071525;
    box-shadow: 0 0 0 7px rgba(100, 181, 246, 0.08);
}

    .timeline-marker span[b-g3hm25d6gv] {
        display: block;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        background: #2d95f3;
    }


/* =========================================================
   TIMELINE PERIOD
========================================================= */

.timeline-period[b-g3hm25d6gv] {
    padding-top: 27px;
    text-align: right;
}

    .timeline-period strong[b-g3hm25d6gv] {
        display: block;
        color: #ffffff;
        font-size: 1.18rem;
    }

    .timeline-period span[b-g3hm25d6gv] {
        display: block;
        margin-top: 7px;
        color: #8297aa;
        font-size: 0.88rem;
    }


/* =========================================================
   EXPERIENCE PANEL
========================================================= */

.experience-panel[b-g3hm25d6gv] {
    overflow: hidden;
    background: linear-gradient( 145deg, rgba(16, 49, 82, 0.88), rgba(7, 29, 52, 0.98) );
    border: 1px solid rgba(100, 181, 246, 0.22);
    border-radius: 16px;
    box-shadow: 0 28px 75px rgba(0, 0, 0, 0.22);
}


/* =========================================================
   EXPERIENCE HEADER
========================================================= */

.experience-header[b-g3hm25d6gv] {
    padding: 38px 40px 32px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    border-bottom: 1px solid rgba(100, 181, 246, 0.16);
}

.experience-type[b-g3hm25d6gv] {
    margin: 0 0 11px;
    color: #64b5f6;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.15rem;
}

.experience-header h2[b-g3hm25d6gv] {
    margin: 0;
    color: #ffffff;
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: 600;
    line-height: 1.2;
}

.experience-organization[b-g3hm25d6gv] {
    max-width: 780px;
    margin: 12px 0 0;
    color: #9fb0c2;
    line-height: 1.55;
}

.experience-badge[b-g3hm25d6gv] {
    flex-shrink: 0;
    padding: 9px 13px;
    color: #8dc8fb;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.1rem;
    border: 1px solid rgba(100, 181, 246, 0.35);
    border-radius: 5px;
    background: rgba(45, 149, 243, 0.08);
}


/* =========================================================
   INTRODUCTION
========================================================= */

.experience-introduction[b-g3hm25d6gv] {
    padding: 32px 40px 8px;
}

    .experience-introduction p[b-g3hm25d6gv] {
        margin: 0;
        color: #c2cfdb;
        font-size: 1rem;
        line-height: 1.75;
    }

        .experience-introduction p + p[b-g3hm25d6gv] {
            margin-top: 17px;
        }

    .experience-introduction strong[b-g3hm25d6gv] {
        color: #ffffff;
    }


/* =========================================================
   FEDERALNI ZAVOD ZA STATISTIKU
========================================================= */

.statistics-content[b-g3hm25d6gv] {
    width: 100%;
    padding: 30px 55px 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .statistics-content .experience-description[b-g3hm25d6gv] {
        width: 100%;
        max-width: 900px;
        margin: 0 auto;
        padding: 0;
        color: #c2cfdb;
        font-size: 1rem;
        line-height: 1.75;
        text-align: justify;
        text-justify: inter-word;
    }


/* =========================================================
   SECTIONS
========================================================= */

.responsibilities-section[b-g3hm25d6gv],
.systems-section[b-g3hm25d6gv],
.formal-responsibilities[b-g3hm25d6gv] {
    padding: 30px 40px 5px;
}

    .responsibilities-section h3[b-g3hm25d6gv],
    .systems-section h3[b-g3hm25d6gv],
    .formal-responsibilities h3[b-g3hm25d6gv] {
        margin: 0 0 22px;
        color: #ffffff;
        font-size: 1.18rem;
    }


/* =========================================================
   RESPONSIBILITIES
========================================================= */

.responsibilities-grid[b-g3hm25d6gv] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 17px;
}

.responsibility-card[b-g3hm25d6gv] {
    min-height: 200px;
    padding: 24px;
    background: rgba(4, 22, 41, 0.55);
    border: 1px solid rgba(100, 181, 246, 0.16);
    border-radius: 10px;
    transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

    .responsibility-card:hover[b-g3hm25d6gv] {
        transform: translateY(-4px);
        border-color: rgba(100, 181, 246, 0.55);
        background: rgba(9, 40, 69, 0.75);
    }

.responsibility-number[b-g3hm25d6gv] {
    color: #64b5f6;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1rem;
}

.responsibility-card h4[b-g3hm25d6gv] {
    margin: 17px 0 10px;
    color: #ffffff;
    font-size: 1.05rem;
}

.responsibility-card p[b-g3hm25d6gv] {
    margin: 0;
    color: #aebdca;
    line-height: 1.65;
}


/* =========================================================
   SYSTEMS
========================================================= */

.systems-content[b-g3hm25d6gv] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 17px;
}

    .systems-content > div[b-g3hm25d6gv] {
        padding: 24px;
        background: rgba(4, 22, 41, 0.55);
        border-top: 2px solid #2d95f3;
        border-radius: 7px;
    }

    .systems-content h4[b-g3hm25d6gv] {
        margin: 0 0 10px;
        color: #ffffff;
        font-size: 1.03rem;
    }

    .systems-content p[b-g3hm25d6gv] {
        margin: 0;
        color: #aebdca;
        line-height: 1.65;
    }


/* =========================================================
   MENTOR
========================================================= */

.mentor-section[b-g3hm25d6gv] {
    margin: 30px 40px 0;
    padding: 28px 30px;
    background: rgba(212, 175, 55, 0.06);
    border-left: 3px solid #d4af37;
    border-radius: 0 9px 9px 0;
}

    .mentor-section h3[b-g3hm25d6gv] {
        margin: 0 0 14px;
        color: #e6c868;
    }

    .mentor-section p[b-g3hm25d6gv] {
        margin: 0;
        color: #c9d3dd;
        line-height: 1.75;
    }

        .mentor-section p + p[b-g3hm25d6gv] {
            margin-top: 13px;
        }


/* =========================================================
   FORMAL RESPONSIBILITIES
========================================================= */

.formal-responsibilities ul[b-g3hm25d6gv] {
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    list-style: none;
}

.formal-responsibilities li[b-g3hm25d6gv] {
    padding: 9px 13px;
    color: #c9d6e2;
    font-size: 0.84rem;
    border: 1px solid rgba(100, 181, 246, 0.2);
    border-radius: 5px;
    background: rgba(4, 22, 41, 0.45);
}


/* =========================================================
   RECOGNITION
========================================================= */

.recognition-card[b-g3hm25d6gv] {
    margin: 34px 40px 5px;
    padding: 27px 30px;
    display: flex;
    align-items: flex-start;
    gap: 22px;
    background: linear-gradient( 120deg, rgba(212, 175, 55, 0.13), rgba(212, 175, 55, 0.035) );
    border: 1px solid rgba(212, 175, 55, 0.35);
    border-radius: 10px;
}

.recognition-icon[b-g3hm25d6gv] {
    flex-shrink: 0;
    width: 49px;
    height: 49px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #071525;
    background: #d4af37;
    border-radius: 50%;
    font-size: 1.35rem;
}

.recognition-label[b-g3hm25d6gv] {
    margin: 0 0 7px;
    color: #d4af37;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12rem;
}

.recognition-card h3[b-g3hm25d6gv] {
    margin: 0 0 9px;
    color: #ffffff;
    font-size: 1.22rem;
}

.recognition-card p:last-child[b-g3hm25d6gv] {
    margin: 0;
    color: #becad5;
    line-height: 1.65;
}


/* =========================================================
   COMPETENCIES
========================================================= */

.competency-list[b-g3hm25d6gv] {
    padding: 31px 40px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

    .competency-list span[b-g3hm25d6gv] {
        padding: 8px 12px;
        color: #a9d6ff;
        font-size: 0.78rem;
        font-weight: 700;
        border: 1px solid rgba(100, 181, 246, 0.25);
        border-radius: 999px;
        background: rgba(45, 149, 243, 0.08);
    }


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

.experience-links[b-g3hm25d6gv] {
    margin-top: 34px;
    padding: 28px 40px 37px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 25px;
    background: rgba(2, 16, 31, 0.3);
    border-top: 1px solid rgba(100, 181, 246, 0.13);
}

.text-link[b-g3hm25d6gv] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #9dcfff;
    font-weight: 700;
    text-decoration: none;
}

    .text-link:hover[b-g3hm25d6gv] {
        color: #ffffff;
    }

    .text-link span[b-g3hm25d6gv] {
        transition: transform 180ms ease;
    }

    .text-link:hover span[b-g3hm25d6gv] {
        transform: translateX(4px);
    }


/* =========================================================
   FOOTER CTA
========================================================= */

.experience-footer-cta[b-g3hm25d6gv] {
    padding: 80px 0;
    color: #ffffff;
    background: radial-gradient( circle at 80% 40%, rgba(45, 149, 243, 0.18), transparent 30% ), #0a2037;
    border-top: 1px solid rgba(100, 181, 246, 0.14);
}

.cta-content[b-g3hm25d6gv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}

    .cta-content > div[b-g3hm25d6gv] {
        max-width: 820px;
    }

    .cta-content h2[b-g3hm25d6gv] {
        margin: 0;
        font-size: clamp(1.8rem, 3.5vw, 2.8rem);
        line-height: 1.2;
    }

    .cta-content p:last-child[b-g3hm25d6gv] {
        margin: 18px 0 0;
        color: #aebdca;
        line-height: 1.7;
    }

    .cta-content > a[b-g3hm25d6gv] {
        flex-shrink: 0;
    }


/* =========================================================
   DOCUMENT NOTE
========================================================= */

.document-note[b-g3hm25d6gv] {
    padding: 24px 0;
    color: #788da1;
    background: #041120;
    border-top: 1px solid rgba(100, 181, 246, 0.1);
}

    .document-note p[b-g3hm25d6gv] {
        max-width: 1100px;
        margin: 0 auto;
        font-size: 0.74rem;
        line-height: 1.65;
        text-align: center;
    }


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {

    .timeline[b-g3hm25d6gv]::before,
    .timeline-marker[b-g3hm25d6gv] {
        display: none;
    }

    .timeline-entry[b-g3hm25d6gv] {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .timeline-period[b-g3hm25d6gv] {
        padding: 0;
        text-align: left;
    }

        .timeline-period strong[b-g3hm25d6gv],
        .timeline-period span[b-g3hm25d6gv] {
            display: inline;
        }

        .timeline-period span[b-g3hm25d6gv] {
            margin-left: 10px;
        }

    .systems-content[b-g3hm25d6gv] {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   SMALL TABLET
========================================================= */

@media (max-width: 800px) {

    .experience-navigation[b-g3hm25d6gv] {
        position: static;
    }

    .experience-navigation-content[b-g3hm25d6gv] {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }

    .experience-navigation a[b-g3hm25d6gv] {
        min-width: 0;
        padding-inline: 10px;
    }

    .experience-summary[b-g3hm25d6gv] {
        grid-template-columns: 1fr;
    }

        .experience-summary article[b-g3hm25d6gv] {
            min-height: 105px;
            border-right: none;
            border-bottom: 1px solid rgba(100, 181, 246, 0.2);
        }

            .experience-summary article:last-child[b-g3hm25d6gv] {
                border-bottom: none;
            }

    .responsibilities-grid[b-g3hm25d6gv] {
        grid-template-columns: 1fr;
    }

    .experience-header[b-g3hm25d6gv] {
        flex-direction: column;
    }

    .cta-content[b-g3hm25d6gv] {
        align-items: flex-start;
        flex-direction: column;
    }

    .statistics-content[b-g3hm25d6gv] {
        padding: 28px 32px 32px;
    }

        .statistics-content .experience-description[b-g3hm25d6gv] {
            max-width: 100%;
        }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .experience-hero[b-g3hm25d6gv] {
        padding: 75px 0 65px;
    }

        .experience-hero h1[b-g3hm25d6gv] {
            letter-spacing: -0.08rem;
        }

    .experience-navigation-content[b-g3hm25d6gv] {
        grid-template-columns: 1fr;
    }

    .experience-navigation a[b-g3hm25d6gv] {
        min-height: 59px;
        border-right: none;
        border-left: none !important;
        border-bottom: 1px solid rgba(100, 181, 246, 0.12);
    }

    .experience-page[b-g3hm25d6gv] {
        padding: 70px 0;
    }

    .experience-header[b-g3hm25d6gv],
    .experience-introduction[b-g3hm25d6gv],
    .responsibilities-section[b-g3hm25d6gv],
    .systems-section[b-g3hm25d6gv],
    .formal-responsibilities[b-g3hm25d6gv] {
        padding-right: 22px;
        padding-left: 22px;
    }

    .mentor-section[b-g3hm25d6gv],
    .recognition-card[b-g3hm25d6gv] {
        margin-right: 22px;
        margin-left: 22px;
    }

    .mentor-section[b-g3hm25d6gv] {
        padding: 23px;
    }

    .recognition-card[b-g3hm25d6gv] {
        padding: 23px;
        flex-direction: column;
    }

    .competency-list[b-g3hm25d6gv] {
        padding-right: 22px;
        padding-left: 22px;
    }

    .experience-links[b-g3hm25d6gv] {
        padding-right: 22px;
        padding-left: 22px;
        align-items: stretch;
        flex-direction: column;
    }

        .experience-links .portfolio-button[b-g3hm25d6gv] {
            width: 100%;
        }

    .text-link[b-g3hm25d6gv] {
        justify-content: center;
    }

    .experience-introduction[b-g3hm25d6gv] {
        padding: 25px 22px 30px;
    }

        .experience-introduction p[b-g3hm25d6gv] {
            max-width: 100%;
            text-align: left;
        }

    .statistics-content[b-g3hm25d6gv] {
        padding: 24px 22px 28px;
    }

        .statistics-content .experience-description[b-g3hm25d6gv] {
            max-width: 100%;
            font-size: 0.95rem;
            line-height: 1.7;
            text-align: left;
        }
}
/* /Components/Pages/English/Gallery.razor.rz.scp.css */
.gallery-page[b-3znjozrbne] {
    min-height: 100vh;
    padding: 7rem 1.25rem 5rem;
    background: radial-gradient( circle at top right, rgba(212, 175, 55, 0.08), transparent 32rem ), #0f172a;
    color: #f8fafc;
}

.gallery-container[b-3znjozrbne] {
    width: min(1400px, 100%);
    margin: 0 auto;
}

.gallery-header[b-3znjozrbne] {
    max-width: 850px;
    margin-bottom: 2.5rem;
}

.gallery-eyebrow[b-3znjozrbne] {
    display: inline-block;
    margin-bottom: 0.85rem;
    color: #d4af37;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.18em;
}

.gallery-header h1[b-3znjozrbne] {
    margin: 0 0 1rem;
    color: #f8fafc;
    font-size: clamp(2rem, 5vw, 3.7rem);
    font-weight: 700;
    line-height: 1.12;
}

.gallery-header p[b-3znjozrbne] {
    max-width: 760px;
    margin: 0;
    color: #cbd5e1;
    font-size: 1.05rem;
    line-height: 1.8;
}

.gallery-filters[b-3znjozrbne] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.gallery-filter[b-3znjozrbne] {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.75rem 1.1rem;
    border: 1px solid rgba(148, 163, 184, 0.25);
    border-radius: 999px;
    background: #1e293b;
    color: #cbd5e1;
    font: inherit;
    font-size: 0.92rem;
    font-weight: 600;
    cursor: pointer;
    transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease, color 180ms ease;
}

    .gallery-filter span[b-3znjozrbne] {
        display: grid;
        min-width: 1.7rem;
        height: 1.7rem;
        padding: 0 0.35rem;
        place-items: center;
        border-radius: 999px;
        background: rgba(15, 23, 42, 0.85);
        color: #94a3b8;
        font-size: 0.75rem;
    }

    .gallery-filter:hover[b-3znjozrbne] {
        transform: translateY(-2px);
        border-color: rgba(212, 175, 55, 0.65);
        color: #ffffff;
    }

    .gallery-filter.active[b-3znjozrbne] {
        border-color: #d4af37;
        background: #d4af37;
        color: #0f172a;
    }

        .gallery-filter.active span[b-3znjozrbne] {
            background: #0f172a;
            color: #f8fafc;
        }

.gallery-status[b-3znjozrbne] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
    color: #94a3b8;
    font-size: 0.9rem;
}

    .gallery-status p[b-3znjozrbne] {
        margin: 0;
    }

    .gallery-status strong[b-3znjozrbne] {
        color: #d4af37;
    }

.gallery-grid[b-3znjozrbne] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.gallery-card[b-3znjozrbne] {
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 1rem;
    background: #1e293b;
    box-shadow: 0 18px 45px rgba(2, 6, 23, 0.22);
    transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

    .gallery-card:hover[b-3znjozrbne] {
        transform: translateY(-6px);
        border-color: rgba(212, 175, 55, 0.55);
        box-shadow: 0 24px 55px rgba(2, 6, 23, 0.42);
    }

.gallery-image-wrapper[b-3znjozrbne] {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    background: #020617;
}

    .gallery-image-wrapper img[b-3znjozrbne] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        transition: transform 350ms ease;
    }

.gallery-card:hover .gallery-image-wrapper img[b-3znjozrbne] {
    transform: scale(1.025);
}

.gallery-category[b-3znjozrbne] {
    position: absolute;
    left: 0.85rem;
    bottom: 0.85rem;
    padding: 0.4rem 0.7rem;
    border: 1px solid rgba(212, 175, 55, 0.45);
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.9);
    color: #d4af37;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    backdrop-filter: blur(8px);
}

.gallery-card-content[b-3znjozrbne] {
    padding: 1.25rem;
}

    .gallery-card-content h2[b-3znjozrbne] {
        margin: 0 0 0.75rem;
        color: #f8fafc;
        font-size: 1.12rem;
        font-weight: 650;
        line-height: 1.4;
    }

    .gallery-card-content p[b-3znjozrbne] {
        margin: 0;
        color: #94a3b8;
        font-size: 0.92rem;
        line-height: 1.7;
    }

.gallery-note[b-3znjozrbne] {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    margin-top: 2.5rem;
    padding: 1rem 1.2rem;
    border-left: 3px solid #d4af37;
    border-radius: 0.35rem;
    background: rgba(30, 41, 59, 0.55);
    color: #94a3b8;
    font-size: 0.8rem;
    line-height: 1.65;
}

    .gallery-note span[b-3znjozrbne] {
        color: #d4af37;
        font-size: 1rem;
    }

    .gallery-note p[b-3znjozrbne] {
        margin: 0;
    }

@media (max-width: 1050px) {
    .gallery-grid[b-3znjozrbne] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .gallery-page[b-3znjozrbne] {
        padding: 5.5rem 1rem 3rem;
    }

    .gallery-grid[b-3znjozrbne] {
        grid-template-columns: 1fr;
    }

    .gallery-status[b-3znjozrbne] {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.25rem;
    }

    .gallery-filter[b-3znjozrbne] {
        flex: 1 1 calc(50% - 0.75rem);
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gallery-card[b-3znjozrbne],
    .gallery-filter[b-3znjozrbne],
    .gallery-image-wrapper img[b-3znjozrbne] {
        transition: none;
    }
}
/* /Components/Pages/English/Home.razor.rz.scp.css */
.hero-section[b-anmxuecat7] {
    position: relative;
    overflow: hidden;
    color: #ffffff;
    background: radial-gradient( circle at 20% 32%, rgba(45, 149, 243, 0.30), transparent 36% ), linear-gradient( 120deg, #041120 0%, #082445 52%, #0b3158 100% );
}

    .hero-section[b-anmxuecat7]::before {
        content: "";
        position: absolute;
        inset: 0;
        opacity: 0.22;
        pointer-events: none;
        background-image: linear-gradient( rgba(100, 181, 246, 0.08) 1px, transparent 1px ), linear-gradient( 90deg, rgba(100, 181, 246, 0.08) 1px, transparent 1px );
        background-size: 70px 70px;
    }


/* =========================================================
   HERO LAYOUT
========================================================= */

.hero-container[b-anmxuecat7] {
    position: relative;
    z-index: 1;
    min-height: 720px;
    display: grid;
    grid-template-columns: 46% 54%;
    align-items: center;
    gap: 55px;
}


/* =========================================================
   LEFT SIDE - PHOTO
========================================================= */

.hero-photo-area[b-anmxuecat7] {
    position: relative;
    min-height: 650px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: visible;
}

.hero-photo-glow[b-anmxuecat7] {
    position: absolute;
    z-index: 1;
    width: 500px;
    height: 500px;
    left: -30px;
    bottom: 45px;
    border-radius: 50%;
    background: rgba(45, 149, 243, 0.22);
    filter: blur(70px);
    pointer-events: none;
}

.hero-photo[b-anmxuecat7] {
    position: relative;
    z-index: 2;
    display: block;
    width: auto;
    height: 650px;
    max-width: none;
    object-fit: contain;
    object-position: center bottom;
    transform: translateY(16px) scale(1.02);
    transform-origin: center bottom;
    filter: drop-shadow( 0 28px 42px rgba(0, 0, 0, 0.42) );
    transition: transform 300ms ease, filter 300ms ease;
}

.hero-photo-area:hover .hero-photo[b-anmxuecat7] {
    transform: translateY(12px) scale(1.06);
    filter: drop-shadow( 0 34px 52px rgba(0, 0, 0, 0.48) );
}


/* =========================================================
   RIGHT SIDE - TEXT
========================================================= */

.hero-content[b-anmxuecat7] {
    padding: 90px 0 85px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.hero-label[b-anmxuecat7] {
    margin: 0 0 18px;
    color: #64b5f6;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.18rem;
}

.hero-content h1[b-anmxuecat7] {
    margin: 0;
    color: #ffffff;
    font-size: clamp(3.4rem, 5.6vw, 5.8rem);
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -0.20rem;
}

.hero-content h2[b-anmxuecat7] {
    max-width: 720px;
    margin: 27px 0 0;
    color: #d9e7f5;
    font-size: clamp(1.35rem, 2.4vw, 2rem);
    font-weight: 400;
    line-height: 1.4;
}

.hero-fields[b-anmxuecat7] {
    margin: 22px 0 0;
    color: #8dc8fb;
    font-size: 0.96rem;
    font-weight: 700;
}

    .hero-fields span[b-anmxuecat7] {
        margin-inline: 8px;
        color: #2d95f3;
    }

.hero-description[b-anmxuecat7] {
    max-width: 760px;
    margin: 25px 0 0;
    color: #cbd7e4;
    font-size: 1.05rem;
    line-height: 1.75;
}

.hero-description-secondary[b-anmxuecat7] {
    margin-top: 14px;
    color: #aebdcb;
}

.hero-actions[b-anmxuecat7] {
    margin-top: 34px;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.hero-contact[b-anmxuecat7] {
    margin-top: 31px;
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    color: #9fb0c2;
    font-size: 0.88rem;
}

    .hero-contact a[b-anmxuecat7] {
        color: #cbd7e4;
        text-decoration: none;
    }

        .hero-contact a:hover[b-anmxuecat7] {
            color: #64b5f6;
        }


/* =========================================================
   STATISTICS
========================================================= */

.statistics-section[b-anmxuecat7] {
    position: relative;
    z-index: 4;
    margin-top: -42px;
    padding-bottom: 30px;
    background: #071525;
    color: #e2e8f0;
}

.statistics-grid[b-anmxuecat7] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    overflow: hidden;
    background: #082445;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(5, 25, 45, 0.18);
    color: #e2e8f0;
}

    .statistics-grid article[b-anmxuecat7] {
        min-height: 145px;
        padding: 28px 25px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        border-right: 1px solid rgba(226, 232, 240, 0.22);
    }

        .statistics-grid article:last-child[b-anmxuecat7] {
            border-right: none;
        }

    .statistics-grid strong[b-anmxuecat7] {
        color: #ffffff;
        font-size: 2.4rem;
        line-height: 1;
    }

    .statistics-grid span[b-anmxuecat7] {
        margin-top: 11px;
        color: #8fa5b9;
        line-height: 1.4;
    }


/* =========================================================
   AREAS OF EXPERTISE
========================================================= */

.expertise-section[b-anmxuecat7] {
    padding: 80px 0 95px;
    color: #ffffff;
    background: #071525;
}

.expertise-grid[b-anmxuecat7] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.expertise-card[b-anmxuecat7] {
    min-height: 250px;
    padding: 32px 29px;
    background: linear-gradient( 145deg, rgba(23, 63, 104, 0.78), rgba(10, 36, 65, 0.96) );
    border: 1px solid rgba(100, 181, 246, 0.25);
    border-radius: 12px;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

    .expertise-card:hover[b-anmxuecat7] {
        transform: translateY(-5px);
        border-color: rgba(100, 181, 246, 0.75);
        box-shadow: 0 20px 45px rgba(0, 0, 0, 0.22);
    }

.card-number[b-anmxuecat7] {
    color: #64b5f6;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.12rem;
}

.expertise-card h3[b-anmxuecat7] {
    margin: 25px 0 13px;
    color: #ffffff;
    font-size: 1.25rem;
}

.expertise-card p[b-anmxuecat7] {
    margin: 0;
    color: #b7c5d3;
    line-height: 1.7;
}


/* =========================================================
   PROFESSIONAL JOURNEY
========================================================= */

.journey-section[b-anmxuecat7] {
    padding: 85px 0;
    color: #ffffff;
    background: #0a2037;
}

.journey-image[b-anmxuecat7] {
    overflow: hidden;
    background: #071525;
    border: 1px solid rgba(212, 175, 55, 0.45);
    border-radius: 12px;
    box-shadow: 0 24px 65px rgba(0, 0, 0, 0.3);
}

    .journey-image img[b-anmxuecat7] {
        display: block;
        width: 100%;
        height: auto;
    }


/* =========================================================
   PROFESSIONAL EXPERIENCE
========================================================= */

.experience-preview[b-anmxuecat7] {
    padding: 85px 0;
    color: #ffffff;
    background: #071525;
}

.experience-grid[b-anmxuecat7] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.experience-card[b-anmxuecat7] {
    min-height: 245px;
    padding: 30px;
    background: linear-gradient( 145deg, rgba(23, 63, 104, 0.72), rgba(10, 36, 65, 0.96) );
    border: 1px solid rgba(100, 181, 246, 0.25);
    border-radius: 12px;
}

.experience-period[b-anmxuecat7] {
    margin: 0 0 15px;
    color: #64b5f6;
    font-weight: 800;
    letter-spacing: 0.05rem;
}

.experience-card h3[b-anmxuecat7] {
    margin: 0 0 14px;
    color: #ffffff;
    font-size: 1.35rem;
}

.experience-card p:last-child[b-anmxuecat7] {
    margin: 0;
    color: #b7c5d3;
    line-height: 1.7;
}

.experience-action[b-anmxuecat7] {
    margin-top: 34px;
    text-align: center;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .hero-container[b-anmxuecat7] {
        grid-template-columns: minmax(360px, 0.85fr) minmax(0, 1.15fr);
        gap: 35px;
    }

    .hero-photo[b-anmxuecat7] {
        height: 600px;
    }

    .hero-photo-glow[b-anmxuecat7] {
        width: 440px;
        height: 440px;
    }
}


/* =========================================================
   SMALL TABLET
========================================================= */

@media (max-width: 1000px) {

    .hero-container[b-anmxuecat7] {
        min-height: auto;
        grid-template-columns: 1fr;
        gap: 0;
    }

    .hero-content[b-anmxuecat7] {
        order: 1;
        padding: 75px 0 25px;
        text-align: center;
    }

    .hero-photo-area[b-anmxuecat7] {
        order: 2;
        min-height: 500px;
    }

    .hero-photo[b-anmxuecat7] {
        height: 500px;
        max-width: 100%;
        transform: translateY(10px) scale(1.02);
    }

    .hero-photo-area:hover .hero-photo[b-anmxuecat7] {
        transform: translateY(10px) scale(1.04);
    }

    .hero-photo-glow[b-anmxuecat7] {
        width: 400px;
        height: 400px;
        left: 50%;
        bottom: 30px;
        transform: translateX(-50%);
        filter: blur(60px);
    }

    .hero-description[b-anmxuecat7] {
        margin-inline: auto;
    }

    .hero-actions[b-anmxuecat7],
    .hero-contact[b-anmxuecat7] {
        justify-content: center;
    }

    .statistics-grid[b-anmxuecat7] {
        grid-template-columns: repeat(2, 1fr);
    }

        .statistics-grid article:nth-child(2)[b-anmxuecat7] {
            border-right: none;
        }

        .statistics-grid article:nth-child(-n + 2)[b-anmxuecat7] {
            border-bottom: 1px solid rgba(226, 232, 240, 0.22);
        }

    .expertise-grid[b-anmxuecat7] {
        grid-template-columns: repeat(2, 1fr);
    }

    .experience-grid[b-anmxuecat7] {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 650px) {

    .hero-container[b-anmxuecat7] {
        min-height: auto;
    }

    .hero-content[b-anmxuecat7] {
        padding-top: 60px;
    }

        .hero-content h1[b-anmxuecat7] {
            font-size: clamp(2.8rem, 14vw, 4.2rem);
            letter-spacing: -0.08rem;
        }

        .hero-content h2[b-anmxuecat7] {
            font-size: 1.22rem;
        }

    .hero-label[b-anmxuecat7] {
        font-size: 0.74rem;
        line-height: 1.5;
        letter-spacing: 0.12rem;
    }

    .hero-description[b-anmxuecat7] {
        font-size: 0.97rem;
        line-height: 1.7;
    }

    .hero-fields[b-anmxuecat7] {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }

        .hero-fields span[b-anmxuecat7] {
            display: none;
        }

    .hero-actions[b-anmxuecat7] {
        flex-direction: column;
    }

        .hero-actions .portfolio-button[b-anmxuecat7] {
            width: 100%;
            text-align: center;
        }

    .hero-contact[b-anmxuecat7] {
        align-items: center;
        flex-direction: column;
        gap: 10px;
    }

    .hero-photo-area[b-anmxuecat7] {
        min-height: 420px;
    }

    .hero-photo[b-anmxuecat7] {
        height: 420px;
        max-width: 110%;
        transform: translateY(8px) scale(1.02);
    }

    .hero-photo-area:hover .hero-photo[b-anmxuecat7] {
        transform: translateY(8px) scale(1.02);
    }

    .hero-photo-glow[b-anmxuecat7] {
        width: 320px;
        height: 320px;
        bottom: 25px;
        filter: blur(50px);
    }

    .statistics-section[b-anmxuecat7] {
        margin-top: -20px;
    }

    .statistics-grid[b-anmxuecat7] {
        grid-template-columns: 1fr;
    }

        .statistics-grid article[b-anmxuecat7] {
            border-right: none;
            border-bottom: 1px solid rgba(226, 232, 240, 0.22);
        }

            .statistics-grid article:last-child[b-anmxuecat7] {
                border-bottom: none;
            }

    .expertise-grid[b-anmxuecat7] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/English/Professional-development.razor.rz.scp.css */
.professional-development-page[b-huuoimmahx] {
    --page-bg: #07111f;
    --page-bg-soft: #0b1728;
    --surface: rgba(13, 28, 47, 0.82);
    --surface-strong: #10213a;
    --surface-muted: rgba(255, 255, 255, 0.035);
    --border: rgba(148, 180, 214, 0.16);
    --border-strong: rgba(82, 189, 255, 0.28);
    --text: #f3f7fb;
    --text-soft: #c5d2df;
    --text-muted: #8fa3b8;
    --accent: #45bff3;
    --accent-strong: #1d91d0;
    --accent-soft: rgba(69, 191, 243, 0.14);
    --success: #62d6aa;
    --shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    color: var(--text);
    background: radial-gradient(circle at 10% 8%, rgba(27, 125, 183, 0.16), transparent 26rem), radial-gradient(circle at 92% 28%, rgba(39, 175, 220, 0.09), transparent 30rem), linear-gradient(180deg, #06101d 0%, var(--page-bg) 50%, #081321 100%);
}

.page-shell[b-huuoimmahx] {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
}

.hero-section[b-huuoimmahx] {
    position: relative;
    isolation: isolate;
    padding: 132px 0 104px;
    border-bottom: 1px solid var(--border);
}

    .hero-section[b-huuoimmahx]::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -3;
        background: linear-gradient(rgba(255, 255, 255, 0.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px);
        background-size: 42px 42px;
        mask-image: linear-gradient(to bottom, black, transparent 88%);
    }

.hero-content[b-huuoimmahx] {
    position: relative;
    z-index: 2;
    max-width: 920px;
}

.hero-glow[b-huuoimmahx] {
    position: absolute;
    z-index: -2;
    border-radius: 999px;
    filter: blur(10px);
    pointer-events: none;
}

.hero-glow-one[b-huuoimmahx] {
    top: -170px;
    left: -160px;
    width: 510px;
    height: 510px;
    background: radial-gradient(circle, rgba(69, 191, 243, 0.18), transparent 68%);
}

.hero-glow-two[b-huuoimmahx] {
    right: -130px;
    bottom: -230px;
    width: 560px;
    height: 560px;
    background: radial-gradient(circle, rgba(41, 115, 182, 0.16), transparent 68%);
}

.eyebrow[b-huuoimmahx],
.section-kicker[b-huuoimmahx] {
    margin: 0 0 14px;
    color: var(--accent);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.hero-section h1[b-huuoimmahx] {
    max-width: 890px;
    margin: 0;
    font-size: clamp(3rem, 7vw, 6.3rem);
    font-weight: 650;
    line-height: 0.98;
    letter-spacing: -0.055em;
    text-wrap: balance;
}

.hero-lead[b-huuoimmahx] {
    max-width: 790px;
    margin: 30px 0 0;
    color: var(--text-soft);
    font-size: clamp(1.05rem, 2vw, 1.28rem);
    line-height: 1.8;
}

.hero-highlights[b-huuoimmahx] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 36px;
}

    .hero-highlights span[b-huuoimmahx] {
        padding: 10px 15px;
        border: 1px solid var(--border-strong);
        border-radius: 999px;
        color: #dff5ff;
        background: var(--accent-soft);
        font-size: 0.88rem;
        font-weight: 700;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025);
    }

.content-section[b-huuoimmahx] {
    padding: 96px 0;
}

.section-muted[b-huuoimmahx] {
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.006));
}

.section-heading[b-huuoimmahx] {
    max-width: 790px;
    margin-bottom: 48px;
}

    .section-heading h2[b-huuoimmahx],
    .digital-copy h2[b-huuoimmahx],
    .application-card h2[b-huuoimmahx],
    .verification-card h2[b-huuoimmahx] {
        margin: 0;
        font-size: clamp(2rem, 4vw, 3.4rem);
        line-height: 1.08;
        letter-spacing: -0.035em;
    }

    .section-heading > p:last-child[b-huuoimmahx],
    .digital-copy > p[b-huuoimmahx],
    .application-copy p[b-huuoimmahx],
    .verification-card p[b-huuoimmahx] {
        color: var(--text-soft);
        line-height: 1.82;
    }

    .section-heading > p:last-child[b-huuoimmahx] {
        margin: 20px 0 0;
        font-size: 1.02rem;
    }

.development-grid[b-huuoimmahx] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.development-card[b-huuoimmahx],
.expertise-card[b-huuoimmahx],
.digital-panel[b-huuoimmahx],
.application-card[b-huuoimmahx],
.verification-card[b-huuoimmahx] {
    border: 1px solid var(--border);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.042), rgba(255, 255, 255, 0.012)), var(--surface);
    box-shadow: var(--shadow);
    backdrop-filter: blur(16px);
}

.development-card[b-huuoimmahx] {
    position: relative;
    min-height: 265px;
    padding: 30px;
    border-radius: 24px;
    overflow: hidden;
}

    .development-card[b-huuoimmahx]::after {
        content: "";
        position: absolute;
        right: -55px;
        bottom: -65px;
        width: 150px;
        height: 150px;
        border-radius: 999px;
        background: radial-gradient(circle, rgba(69, 191, 243, 0.13), transparent 70%);
    }

.card-number[b-huuoimmahx] {
    margin-bottom: 50px;
    color: var(--accent);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.15em;
}

.development-card h3[b-huuoimmahx],
.expertise-card h3[b-huuoimmahx] {
    margin: 0;
    font-size: 1.22rem;
}

.development-card p[b-huuoimmahx],
.expertise-card p[b-huuoimmahx] {
    margin: 15px 0 0;
    color: var(--text-muted);
    line-height: 1.72;
}

.expertise-grid[b-huuoimmahx] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.expertise-card[b-huuoimmahx] {
    min-height: 235px;
    padding: 24px;
    border-radius: 20px;
    transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

    .expertise-card:hover[b-huuoimmahx] {
        transform: translateY(-5px);
        border-color: var(--border-strong);
        background-color: rgba(15, 36, 59, 0.92);
    }

.expertise-icon[b-huuoimmahx] {
    display: grid;
    width: 48px;
    height: 48px;
    margin-bottom: 24px;
    place-items: center;
    border: 1px solid var(--border-strong);
    border-radius: 14px;
    color: var(--accent);
    background: var(--accent-soft);
    font-size: 1.18rem;
}

.digital-section[b-huuoimmahx] {
    position: relative;
}

    .digital-section[b-huuoimmahx]::before {
        content: "";
        position: absolute;
        top: 90px;
        left: 0;
        width: 38%;
        height: 520px;
        background: radial-gradient(circle at left, rgba(43, 147, 202, 0.09), transparent 68%);
        pointer-events: none;
    }

.digital-layout[b-huuoimmahx] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(340px, 0.8fr);
    gap: 52px;
    align-items: start;
}

.digital-copy > p[b-huuoimmahx] {
    margin: 20px 0 0;
}

.digital-copy strong[b-huuoimmahx] {
    color: #ffffff;
}

.digital-panel[b-huuoimmahx] {
    position: sticky;
    top: 100px;
    padding: 30px;
    border-color: var(--border-strong);
    border-radius: 26px;
}

.panel-label[b-huuoimmahx] {
    display: inline-flex;
    margin-bottom: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    color: var(--accent);
    background: var(--accent-soft);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.digital-panel ul[b-huuoimmahx] {
    display: grid;
    gap: 0;
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
}

.digital-panel li[b-huuoimmahx] {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 14px;
    padding: 20px 0;
    border-bottom: 1px solid var(--border);
}

    .digital-panel li:last-child[b-huuoimmahx] {
        border-bottom: 0;
        padding-bottom: 0;
    }

.checkmark[b-huuoimmahx] {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 999px;
    color: #062017;
    background: var(--success);
    font-size: 0.85rem;
    font-weight: 900;
}

.digital-panel strong[b-huuoimmahx] {
    display: block;
    color: var(--text);
    font-size: 0.98rem;
}

.digital-panel p[b-huuoimmahx] {
    margin: 7px 0 0;
    color: var(--text-muted);
    font-size: 0.9rem;
    line-height: 1.6;
}

.technology-strip[b-huuoimmahx] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 58px;
    border: 1px solid var(--border);
    border-radius: 24px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.022);
}

    .technology-strip > div[b-huuoimmahx] {
        min-height: 170px;
        padding: 25px;
        border-right: 1px solid var(--border);
    }

        .technology-strip > div:last-child[b-huuoimmahx] {
            border-right: 0;
        }

.technology-year[b-huuoimmahx] {
    display: block;
    margin-bottom: 28px;
    color: var(--accent);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.technology-strip strong[b-huuoimmahx],
.technology-strip small[b-huuoimmahx] {
    display: block;
}

.technology-strip strong[b-huuoimmahx] {
    color: var(--text);
    font-size: 1rem;
}

.technology-strip small[b-huuoimmahx] {
    margin-top: 8px;
    color: var(--text-muted);
    font-size: 0.86rem;
    line-height: 1.55;
}

.application-card[b-huuoimmahx] {
    display: grid;
    grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
    gap: 54px;
    padding: 46px;
    border-radius: 28px;
}

.application-copy p[b-huuoimmahx] {
    margin: 0;
}

    .application-copy p + p[b-huuoimmahx] {
        margin-top: 18px;
    }

.verification-section[b-huuoimmahx] {
    padding: 20px 0 110px;
}

.verification-card[b-huuoimmahx] {
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 28px;
    padding: 42px;
    border-color: rgba(98, 214, 170, 0.26);
    border-radius: 28px;
    background: linear-gradient(145deg, rgba(98, 214, 170, 0.075), rgba(255, 255, 255, 0.012)), var(--surface);
}

.verification-badge[b-huuoimmahx] {
    display: grid;
    width: 62px;
    height: 62px;
    place-items: center;
    border: 1px solid rgba(98, 214, 170, 0.35);
    border-radius: 20px;
    color: #062017;
    background: var(--success);
    font-size: 1.5rem;
    font-weight: 900;
    box-shadow: 0 14px 34px rgba(98, 214, 170, 0.15);
}

.verification-card p[b-huuoimmahx] {
    max-width: 880px;
    margin: 18px 0 0;
}

@media (max-width: 1050px) {
    .expertise-grid[b-huuoimmahx] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .digital-layout[b-huuoimmahx] {
        grid-template-columns: 1fr;
    }

    .digital-panel[b-huuoimmahx] {
        position: static;
    }

    .technology-strip[b-huuoimmahx] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

        .technology-strip > div:nth-child(2)[b-huuoimmahx] {
            border-right: 0;
        }

        .technology-strip > div:nth-child(-n + 2)[b-huuoimmahx] {
            border-bottom: 1px solid var(--border);
        }
}

@media (max-width: 820px) {
    .hero-section[b-huuoimmahx] {
        padding: 105px 0 78px;
    }

    .content-section[b-huuoimmahx] {
        padding: 78px 0;
    }

    .development-grid[b-huuoimmahx] {
        grid-template-columns: 1fr;
    }

    .development-card[b-huuoimmahx] {
        min-height: auto;
    }

    .card-number[b-huuoimmahx] {
        margin-bottom: 32px;
    }

    .expertise-grid[b-huuoimmahx] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .application-card[b-huuoimmahx] {
        grid-template-columns: 1fr;
        gap: 26px;
        padding: 34px;
    }
}

@media (max-width: 580px) {
    .page-shell[b-huuoimmahx] {
        width: min(100% - 26px, 1180px);
    }

    .hero-section[b-huuoimmahx] {
        padding: 92px 0 68px;
    }

        .hero-section h1[b-huuoimmahx] {
            font-size: clamp(2.55rem, 14vw, 4rem);
        }

    .hero-lead[b-huuoimmahx] {
        font-size: 1rem;
        line-height: 1.72;
    }

    .hero-highlights[b-huuoimmahx] {
        gap: 9px;
    }

        .hero-highlights span[b-huuoimmahx] {
            padding: 9px 12px;
            font-size: 0.8rem;
        }

    .content-section[b-huuoimmahx] {
        padding: 65px 0;
    }

    .section-heading[b-huuoimmahx] {
        margin-bottom: 34px;
    }

    .expertise-grid[b-huuoimmahx] {
        grid-template-columns: 1fr;
    }

    .expertise-card[b-huuoimmahx] {
        min-height: auto;
    }

    .digital-layout[b-huuoimmahx] {
        gap: 34px;
    }

    .digital-panel[b-huuoimmahx] {
        padding: 23px;
        border-radius: 22px;
    }

    .technology-strip[b-huuoimmahx] {
        grid-template-columns: 1fr;
        border-radius: 20px;
    }

        .technology-strip > div[b-huuoimmahx],
        .technology-strip > div:nth-child(2)[b-huuoimmahx] {
            border-right: 0;
            border-bottom: 1px solid var(--border);
        }

            .technology-strip > div:last-child[b-huuoimmahx] {
                border-bottom: 0;
            }

    .application-card[b-huuoimmahx] {
        padding: 27px;
        border-radius: 22px;
    }

    .verification-section[b-huuoimmahx] {
        padding-bottom: 75px;
    }

    .verification-card[b-huuoimmahx] {
        grid-template-columns: 1fr;
        padding: 27px;
        border-radius: 22px;
    }

    .verification-badge[b-huuoimmahx] {
        width: 54px;
        height: 54px;
        border-radius: 17px;
    }
}

@media (prefers-reduced-motion: no-preference) {
    .hero-content[b-huuoimmahx],
    .section-heading[b-huuoimmahx],
    .development-card[b-huuoimmahx],
    .expertise-card[b-huuoimmahx],
    .digital-copy[b-huuoimmahx],
    .digital-panel[b-huuoimmahx],
    .technology-strip[b-huuoimmahx],
    .application-card[b-huuoimmahx],
    .verification-card[b-huuoimmahx] {
        animation: reveal-up-b-huuoimmahx 620ms ease both;
    }

        .development-card:nth-child(2)[b-huuoimmahx],
        .expertise-card:nth-child(2)[b-huuoimmahx],
        .expertise-card:nth-child(6)[b-huuoimmahx],
        .expertise-card:nth-child(10)[b-huuoimmahx] {
            animation-delay: 70ms;
        }

        .development-card:nth-child(3)[b-huuoimmahx],
        .expertise-card:nth-child(3)[b-huuoimmahx],
        .expertise-card:nth-child(7)[b-huuoimmahx],
        .expertise-card:nth-child(11)[b-huuoimmahx] {
            animation-delay: 140ms;
        }

        .expertise-card:nth-child(4)[b-huuoimmahx],
        .expertise-card:nth-child(8)[b-huuoimmahx] {
            animation-delay: 210ms;
        }

        .expertise-card:nth-child(5)[b-huuoimmahx],
        .expertise-card:nth-child(9)[b-huuoimmahx] {
            animation-delay: 280ms;
        }
}

@keyframes reveal-up-b-huuoimmahx {
    from {
        opacity: 0;
        transform: translateY(18px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Components/Pages/English/Recommendations.razor.rz.scp.css */
.recommendations-page[b-1pctvgmcmk] {
    min-height: 100vh;
    background: #0f172a;
    color: #ffffff;
}

.container[b-1pctvgmcmk] {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
}

.recommendations-hero[b-1pctvgmcmk] {
    position: relative;
    overflow: hidden;
    padding: 8rem 0 5rem;
    background: radial-gradient( circle at 85% 20%, rgba(59, 130, 246, 0.2), transparent 34% ), radial-gradient( circle at 10% 90%, rgba(14, 165, 233, 0.12), transparent 30% ), linear-gradient( 135deg, #0f172a 0%, #172554 55%, #1e3a8a 100% );
}

    .recommendations-hero[b-1pctvgmcmk]::before {
        content: "";
        position: absolute;
        top: -160px;
        right: -160px;
        width: 430px;
        height: 430px;
        border-radius: 50%;
        border: 1px solid rgba(255, 255, 255, 0.08);
    }

    .recommendations-hero[b-1pctvgmcmk]::after {
        content: "";
        position: absolute;
        right: 70px;
        bottom: -220px;
        width: 480px;
        height: 480px;
        border-radius: 50%;
        border: 1px solid rgba(255, 255, 255, 0.06);
    }

.hero-content[b-1pctvgmcmk],
.recommendation-statistics[b-1pctvgmcmk] {
    position: relative;
    z-index: 1;
}

.hero-content[b-1pctvgmcmk] {
    max-width: 900px;
}

.section-label[b-1pctvgmcmk] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    color: #93c5fd;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

    .section-label[b-1pctvgmcmk]::before {
        content: "";
        width: 36px;
        height: 2px;
        border-radius: 999px;
        background: #60a5fa;
    }

.hero-content h1[b-1pctvgmcmk] {
    max-width: 850px;
    margin: 1rem 0 1.4rem;
    color: #ffffff;
    font-size: clamp(2.6rem, 6vw, 4.7rem);
    font-weight: 850;
    line-height: 1.05;
    letter-spacing: -0.045em;
}

.hero-content p[b-1pctvgmcmk] {
    max-width: 850px;
    margin: 0;
    color: #dbeafe;
    font-size: 1.08rem;
    line-height: 1.85;
}

.recommendation-statistics[b-1pctvgmcmk] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    margin-top: 3.25rem;
}

.statistic-card[b-1pctvgmcmk] {
    padding: 1.6rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 18px 45px rgba(2, 6, 23, 0.12);
    backdrop-filter: blur(15px);
}

    .statistic-card strong[b-1pctvgmcmk] {
        display: block;
        margin-bottom: 0.4rem;
        color: #ffffff;
        font-size: 2.1rem;
        line-height: 1;
    }

    .statistic-card span[b-1pctvgmcmk] {
        color: #bfdbfe;
        font-size: 0.92rem;
        line-height: 1.5;
    }

.recommendations-content[b-1pctvgmcmk] {
    padding: 5.5rem 0 6rem;
    background: linear-gradient( rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.96) ), radial-gradient( circle at center, rgba(37, 99, 235, 0.18), transparent 48% );
}

.section-heading[b-1pctvgmcmk] {
    max-width: 820px;
    margin: 0 auto 3.5rem;
    text-align: center;
}

    .section-heading .section-label[b-1pctvgmcmk] {
        justify-content: center;
    }

    .section-heading h2[b-1pctvgmcmk] {
        margin: 1rem 0;
        color: #ffffff;
        font-size: clamp(2rem, 4vw, 3rem);
        font-weight: 800;
        line-height: 1.15;
        letter-spacing: -0.03em;
    }

    .section-heading p[b-1pctvgmcmk] {
        margin: 0;
        color: #cbd5e1;
        font-size: 1rem;
        line-height: 1.8;
    }

.recommendation-links[b-1pctvgmcmk] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 1.5rem;
}

.recommendation-link-card[b-1pctvgmcmk] {
    position: relative;
    display: flex;
    min-height: 500px;
    flex-direction: column;
    overflow: hidden;
    padding: 2rem;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 26px;
    background: linear-gradient( 145deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.98) );
    box-shadow: 0 24px 55px rgba(2, 6, 23, 0.25);
    color: #ffffff;
    text-decoration: none;
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

    .recommendation-link-card[b-1pctvgmcmk]::after {
        content: "";
        position: absolute;
        right: -95px;
        bottom: -95px;
        width: 210px;
        height: 210px;
        border-radius: 50%;
        background: rgba(37, 99, 235, 0.09);
        transition: transform 0.35s ease;
    }

    .recommendation-link-card:hover[b-1pctvgmcmk] {
        transform: translateY(-10px);
        border-color: rgba(96, 165, 250, 0.55);
        box-shadow: 0 32px 75px rgba(2, 6, 23, 0.38);
    }

        .recommendation-link-card:hover[b-1pctvgmcmk]::after {
            transform: scale(1.25);
        }

.recommendation-link-card-featured[b-1pctvgmcmk] {
    border-color: rgba(96, 165, 250, 0.45);
    background: radial-gradient( circle at top right, rgba(59, 130, 246, 0.2), transparent 35% ), linear-gradient( 145deg, #1e3a8a, #172554 55%, #0f172a );
}

.featured-label[b-1pctvgmcmk] {
    position: absolute;
    top: 1.2rem;
    right: 1.2rem;
    z-index: 2;
    padding: 0.45rem 0.75rem;
    border: 1px solid rgba(147, 197, 253, 0.32);
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.2);
    color: #dbeafe;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.card-number[b-1pctvgmcmk] {
    position: absolute;
    top: 1.35rem;
    left: 1.5rem;
    color: rgba(255, 255, 255, 0.11);
    font-size: 3.4rem;
    font-weight: 900;
    line-height: 1;
}

.card-icon[b-1pctvgmcmk] {
    position: relative;
    z-index: 1;
    display: grid;
    width: 62px;
    height: 62px;
    place-items: center;
    margin: 4.5rem 0 1.6rem;
    border: 1px solid rgba(147, 197, 253, 0.25);
    border-radius: 18px;
    background: rgba(37, 99, 235, 0.15);
}

    .card-icon svg[b-1pctvgmcmk] {
        width: 31px;
        height: 31px;
        fill: #93c5fd;
    }

.card-content[b-1pctvgmcmk] {
    position: relative;
    z-index: 1;
    display: flex;
    height: 100%;
    flex-direction: column;
}

.card-location[b-1pctvgmcmk] {
    display: block;
    margin-bottom: 0.65rem;
    color: #60a5fa;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    line-height: 1.5;
    text-transform: uppercase;
}

.card-content h3[b-1pctvgmcmk] {
    margin: 0 0 1rem;
    color: #ffffff;
    font-size: 1.65rem;
    font-weight: 800;
    line-height: 1.25;
}

.card-content p[b-1pctvgmcmk] {
    margin: 0 0 1.6rem;
    color: #cbd5e1;
    font-size: 0.94rem;
    line-height: 1.8;
}

.card-details[b-1pctvgmcmk] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-bottom: 2rem;
}

    .card-details span[b-1pctvgmcmk] {
        padding: 0.48rem 0.72rem;
        border: 1px solid rgba(148, 163, 184, 0.18);
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.05);
        color: #dbeafe;
        font-size: 0.75rem;
        font-weight: 650;
    }

.card-action[b-1pctvgmcmk] {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    margin-top: auto;
    color: #93c5fd;
    font-size: 0.93rem;
    font-weight: 800;
}

    .card-action span[b-1pctvgmcmk] {
        font-size: 1.25rem;
        transition: transform 0.25s ease;
    }

.recommendation-link-card:hover .card-action span[b-1pctvgmcmk] {
    transform: translateX(6px);
}

.recommendations-footer[b-1pctvgmcmk] {
    padding: 0 0 6rem;
    background: #0f172a;
}

.footer-card[b-1pctvgmcmk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2.5rem;
    padding: 3rem;
    border: 1px solid rgba(147, 197, 253, 0.16);
    border-radius: 28px;
    background: radial-gradient( circle at right, rgba(37, 99, 235, 0.18), transparent 35% ), linear-gradient( 135deg, #172554, #0f172a );
    box-shadow: 0 24px 60px rgba(2, 6, 23, 0.3);
}

.footer-content[b-1pctvgmcmk] {
    max-width: 720px;
}

    .footer-content h2[b-1pctvgmcmk] {
        margin: 1rem 0;
        color: #ffffff;
        font-size: clamp(1.8rem, 4vw, 2.6rem);
        font-weight: 800;
        line-height: 1.2;
    }

    .footer-content p[b-1pctvgmcmk] {
        margin: 0;
        color: #cbd5e1;
        line-height: 1.8;
    }

.footer-actions[b-1pctvgmcmk] {
    display: flex;
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 0.85rem;
}

.button[b-1pctvgmcmk] {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 1.25rem;
    border-radius: 12px;
    font-size: 0.9rem;
    font-weight: 750;
    text-decoration: none;
    transition: transform 0.25s ease, background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

    .button:hover[b-1pctvgmcmk] {
        transform: translateY(-3px);
    }

.button-primary[b-1pctvgmcmk] {
    border: 1px solid #2563eb;
    background: #2563eb;
    color: #ffffff;
}

    .button-primary:hover[b-1pctvgmcmk] {
        border-color: #3b82f6;
        background: #3b82f6;
        color: #ffffff;
    }

.button-secondary[b-1pctvgmcmk] {
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.05);
    color: #ffffff;
}

    .button-secondary:hover[b-1pctvgmcmk] {
        border-color: #ffffff;
        background: #ffffff;
        color: #0f172a;
    }

@media (max-width: 1050px) {
    .recommendation-links[b-1pctvgmcmk] {
        grid-template-columns: 1fr;
    }

    .recommendation-link-card[b-1pctvgmcmk] {
        min-height: auto;
    }

    .card-icon[b-1pctvgmcmk] {
        margin-top: 3.8rem;
    }

    .footer-card[b-1pctvgmcmk] {
        align-items: flex-start;
        flex-direction: column;
    }

    .footer-actions[b-1pctvgmcmk] {
        flex-shrink: 1;
    }
}

@media (max-width: 760px) {
    .recommendations-hero[b-1pctvgmcmk] {
        padding: 6.5rem 0 4rem;
    }

    .recommendation-statistics[b-1pctvgmcmk] {
        grid-template-columns: 1fr;
    }

    .recommendations-content[b-1pctvgmcmk] {
        padding: 4.5rem 0;
    }

    .recommendation-link-card[b-1pctvgmcmk] {
        padding: 1.5rem;
        border-radius: 22px;
    }

    .footer-card[b-1pctvgmcmk] {
        padding: 2rem;
    }
}

@media (max-width: 520px) {
    .container[b-1pctvgmcmk] {
        width: min(100% - 1.2rem, 1180px);
    }

    .hero-content h1[b-1pctvgmcmk] {
        font-size: 2.45rem;
    }

    .section-label[b-1pctvgmcmk] {
        font-size: 0.67rem;
        letter-spacing: 0.12em;
    }

    .card-number[b-1pctvgmcmk] {
        top: 1.2rem;
        left: 1.25rem;
        font-size: 2.8rem;
    }

    .featured-label[b-1pctvgmcmk] {
        max-width: 150px;
        text-align: center;
    }

    .card-icon[b-1pctvgmcmk] {
        margin-top: 4.2rem;
    }

    .footer-actions[b-1pctvgmcmk] {
        width: 100%;
        flex-direction: column;
    }

    .button[b-1pctvgmcmk] {
        width: 100%;
    }
}
/* /Components/Pages/English/RecommendationsIraq.razor.rz.scp.css */
/* ===========================================================
   Recommendations – Iraq
=========================================================== */

.recommendendations-section[b-nljld7gzch],
.recommendations-section[b-nljld7gzch] {
    width: 100%;
    padding: 5rem 0;
    background: #04172b;
}


/* ===========================================================
   Section Title
=========================================================== */

.recommendations-title[b-nljld7gzch] {
    margin-bottom: 1.3rem;
    background: #04172b;
}

    .recommendations-title h1[b-nljld7gzch] {
        margin: 0;
        color: #e3e9f1;
        font-size: clamp(2rem, 4vw, 3rem);
        font-weight: 700;
        line-height: 1.2;
        background: #04172b;
    }

    .recommendations-title span[b-nljld7gzch] {
        display: block;
        width: 72px;
        height: 4px;
        margin-top: 1rem;
        border-radius: 999px;
        background: #04172b;
    }


/* ===========================================================
   Introduction
=========================================================== */

.recommendation-intro[b-nljld7gzch] {
    max-width: 10001px;
    margin: 0 0 1rem;
    color: #f7f9fc;
    font-size: 1.35rem;
    line-height: 1.55;
    background: #04172b;
}


/* ===========================================================
   Recommendation Card
=========================================================== */

.recommendation-card[b-nljld7gzch] {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
    gap: 3rem;
    align-items: center;
    padding: 3rem;
    background: #043165;
    border: 1px solid #e3e9f1;
    border-radius: 22px;
    box-shadow: 0 14px 40px rgba(20, 46, 79, 0.08);
    overflow: hidden;
}

    .recommendation-card + .recommendation-card[b-nljld7gzch] {
        margin-top: 3rem;
    }


/* ===========================================================
   Recommendation Content
=========================================================== */

.recommendation-content[b-nljld7gzch] {
    min-width: 0;
}

.recommendation-label[b-nljld7gzch] {
    margin: 0 0 0.8rem;
    color: #e3e9f1;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 1.4;
    text-transform: uppercase;
    background: #043165;
}

.recommendation-content h2[b-nljld7gzch] {
    margin: 0 0 1rem;
    color: #e3e9f1;
    font-size: clamp(1.7rem, 3vw, 2.35rem);
    font-weight: 700;
    line-height: 1.25;
    background: #043165;
}

.recommendation-position[b-nljld7gzch] {
    margin: 0 0 0.45rem;
    color: #e3e9f1;
    font-size: 1.08rem;
    font-weight: 700;
    line-height: 1.55;
    background: #043165;
}

.recommendation-period[b-nljld7gzch] {
    margin: 0 0 1.8rem;
    color: #e3e9f1;
    font-size: 0.96rem;
    font-weight: 500;
    background: #043165;
}

.recommendation-description[b-nljld7gzch] {
    margin: 0 0 1rem;
    color: #e3e9f1;
    font-size: 1rem;
    line-height: 1.8;
    background: #043165;
}

    .recommendation-description:last-of-type[b-nljld7gzch] {
        margin-bottom: 0;
    }


/* ===========================================================
   Actions
=========================================================== */

.recommendation-actions[b-nljld7gzch] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 2rem;
}

    .recommendation-actions .portfolio-button[b-nljld7gzch] {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        min-height: 48px;
        padding: 0.8rem 1.35rem;
        border-radius: 9px;
        text-align: center;
        text-decoration: none;
        font-size: 0.95rem;
        font-weight: 700;
        line-height: 1.2;
        transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    }

    .recommendation-actions .portfolio-button-primary[b-nljld7gzch] {
        border: 2px solid #173f77;
        background: #043165;
        color: #f7f9fc;
        box-shadow: 0 8px 20px rgba(23, 63, 119, 0.16);
    }

        .recommendation-actions .portfolio-button-primary:hover[b-nljld7gzch] {
            border-color: #1d5ca4;
            background: #043165;
            color: #f7f9fc;
            transform: translateY(-2px);
            box-shadow: 0 12px 26px rgba(23, 63, 119, 0.23);
        }

    .recommendation-actions .portfolio-button-outline[b-nljld7gzch] {
        border: 2px solid #173f77;
        background: #043165;
        color: #f7f9fc;
    }

        .recommendation-actions .portfolio-button-outline:hover[b-nljld7gzch] {
            background: #043165;
            color: #f7f9fc;
            transform: translateY(-2px);
            box-shadow: 0 10px 24px rgba(23, 63, 119, 0.17);
        }

    .recommendation-actions .portfolio-button:focus-visible[b-nljld7gzch] {
        outline: 3px solid rgba(29, 92, 164, 0.35);
        outline-offset: 3px;
    }


/* ===========================================================
   Recommendation Document
=========================================================== */

.recommendation-document[b-nljld7gzch] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 0;
    padding-left: 1rem;
}

    .recommendation-document a[b-nljld7gzch] {
        display: block;
        width: 100%;
        max-width: 470px;
        padding: 0.65rem;
        background: #043165;
        border: 1px solid #dce4ee;
        border-radius: 14px;
        box-shadow: 0 14px 34px rgba(20, 46, 79, 0.13);
        overflow: hidden;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

        .recommendation-document a:hover[b-nljld7gzch] {
            border-color: #b8cbe2;
            transform: translateY(-5px);
            box-shadow: 0 20px 44px rgba(20, 46, 79, 0.18);
        }

        .recommendation-document a:focus-visible[b-nljld7gzch] {
            outline: 3px solid rgba(29, 92, 164, 0.35);
            outline-offset: 4px;
        }

    .recommendation-document img[b-nljld7gzch] {
        display: block;
        width: 100%;
        height: auto;
        max-height: 680px;
        object-fit: contain;
        border-radius: 8px;
        background: #043165;
    }


/* ===========================================================
   Responsive – Tablet
=========================================================== */

@media (max-width: 992px) {

    .recommendations-section[b-nljld7gzch] {
        padding: 4rem 0;
    }

    .recommendation-card[b-nljld7gzch] {
        grid-template-columns: 1fr;
        gap: 2.5rem;
        padding: 2.5rem;
    }

    .recommendation-document[b-nljld7gzch] {
        width: 100%;
    }

        .recommendation-document a[b-nljld7gzch] {
            max-width: 620px;
        }

        .recommendation-document img[b-nljld7gzch] {
            max-height: none;
        }
}


/* ===========================================================
   Responsive – Mobile
=========================================================== */

@media (max-width: 768px) {

    .recommendations-section[b-nljld7gzch] {
        padding: 3.5rem 0;
    }

    .recommendation-intro[b-nljld7gzch] {
        margin-bottom: 2.3rem;
        font-size: 1rem;
        line-height: 1.75;
    }

    .recommendation-card[b-nljld7gzch] {
        gap: 2rem;
        padding: 2rem;
        border-radius: 18px;
    }

        .recommendation-card + .recommendation-card[b-nljld7gzch] {
            margin-top: 2.5rem;
        }

    .recommendation-position[b-nljld7gzch] {
        font-size: 1rem;
    }

    .recommendation-description[b-nljld7gzch] {
        font-size: 0.97rem;
        line-height: 1.75;
    }

    .recommendation-actions[b-nljld7gzch] {
        margin-top: 1.7rem;
    }
}


/* ===========================================================
   Responsive – Small Mobile
=========================================================== */

@media (max-width: 560px) {

    .recommendations-section[b-nljld7gzch] {
        padding: 3rem 0;
    }

    .recommendations-title h1[b-nljld7gzch] {
        font-size: 2rem;
    }

    .recommendations-title span[b-nljld7gzch] {
        width: 58px;
        height: 3px;
    }

    .recommendation-card[b-nljld7gzch] {
        padding: 1.4rem;
        border-radius: 15px;
    }

    .recommendation-content h2[b-nljld7gzch] {
        font-size: 1.55rem;
    }

    .recommendation-actions[b-nljld7gzch] {
        flex-direction: column;
        width: 100%;
    }

        .recommendation-actions .portfolio-button[b-nljld7gzch] {
            width: 100%;
        }

    .recommendation-document a[b-nljld7gzch] {
        padding: 0.45rem;
        border-radius: 11px;
    }

    .recommendation-document img[b-nljld7gzch] {
        border-radius: 7px;
    }
}
/* /Components/Pages/English/RecommendationsKuwait.razor.rz.scp.css */
/* ===========================================================
   Recommendations – Iraq
=========================================================== */

.recommendendations-section[b-mx9xqmv34h],
.recommendations-section[b-mx9xqmv34h] {
    width: 100%;
    padding: 5rem 0;
    background: #04172b;
}


/* ===========================================================
   Section Title
=========================================================== */

.recommendations-title[b-mx9xqmv34h] {
    margin-bottom: 1.3rem;
    background: #04172b;
}

    .recommendations-title h1[b-mx9xqmv34h] {
        margin: 0;
        color: #e3e9f1;
        font-size: clamp(2rem, 4vw, 3rem);
        font-weight: 700;
        line-height: 1.2;
        background: #04172b;
    }

    .recommendations-title span[b-mx9xqmv34h] {
        display: block;
        width: 72px;
        height: 4px;
        margin-top: 1rem;
        border-radius: 999px;
        background: #04172b;
    }


/* ===========================================================
   Introduction
=========================================================== */

.recommendation-intro[b-mx9xqmv34h] {
    max-width: 10001px;
    margin: 0 0 1rem;
    color: #f7f9fc;
    font-size: 1.35rem;
    line-height: 1.55;
    background: #04172b;
}


/* ===========================================================
   Recommendation Card
=========================================================== */

.recommendation-card[b-mx9xqmv34h] {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
    gap: 3rem;
    align-items: center;
    padding: 3rem;
    background: #043165;
    border: 1px solid #e3e9f1;
    border-radius: 22px;
    box-shadow: 0 14px 40px rgba(20, 46, 79, 0.08);
    overflow: hidden;
}

    .recommendation-card + .recommendation-card[b-mx9xqmv34h] {
        margin-top: 3rem;
    }


/* ===========================================================
   Recommendation Content
=========================================================== */

.recommendation-content[b-mx9xqmv34h] {
    min-width: 0;
}

.recommendation-label[b-mx9xqmv34h] {
    margin: 0 0 0.8rem;
    color: #e3e9f1;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 1.4;
    text-transform: uppercase;
    background: #043165;
}

.recommendation-content h2[b-mx9xqmv34h] {
    margin: 0 0 1rem;
    color: #e3e9f1;
    font-size: clamp(1.7rem, 3vw, 2.35rem);
    font-weight: 700;
    line-height: 1.25;
    background: #043165;
}

.recommendation-position[b-mx9xqmv34h] {
    margin: 0 0 0.45rem;
    color: #e3e9f1;
    font-size: 1.08rem;
    font-weight: 700;
    line-height: 1.55;
    background: #043165;
}

.recommendation-period[b-mx9xqmv34h] {
    margin: 0 0 1.8rem;
    color: #e3e9f1;
    font-size: 0.96rem;
    font-weight: 500;
    background: #043165;
}

.recommendation-description[b-mx9xqmv34h] {
    margin: 0 0 1rem;
    color: #e3e9f1;
    font-size: 1rem;
    line-height: 1.8;
    background: #043165;
}

    .recommendation-description:last-of-type[b-mx9xqmv34h] {
        margin-bottom: 0;
    }


/* ===========================================================
   Actions
=========================================================== */

.recommendation-actions[b-mx9xqmv34h] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 2rem;
}

    .recommendation-actions .portfolio-button[b-mx9xqmv34h] {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        min-height: 48px;
        padding: 0.8rem 1.35rem;
        border-radius: 9px;
        text-align: center;
        text-decoration: none;
        font-size: 0.95rem;
        font-weight: 700;
        line-height: 1.2;
        transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    }

    .recommendation-actions .portfolio-button-primary[b-mx9xqmv34h] {
        border: 2px solid #173f77;
        background: #043165;
        color: #f7f9fc;
        box-shadow: 0 8px 20px rgba(23, 63, 119, 0.16);
    }

        .recommendation-actions .portfolio-button-primary:hover[b-mx9xqmv34h] {
            border-color: #1d5ca4;
            background: #043165;
            color: #f7f9fc;
            transform: translateY(-2px);
            box-shadow: 0 12px 26px rgba(23, 63, 119, 0.23);
        }

    .recommendation-actions .portfolio-button-outline[b-mx9xqmv34h] {
        border: 2px solid #173f77;
        background: #043165;
        color: #f7f9fc;
    }

        .recommendation-actions .portfolio-button-outline:hover[b-mx9xqmv34h] {
            background: #043165;
            color: #f7f9fc;
            transform: translateY(-2px);
            box-shadow: 0 10px 24px rgba(23, 63, 119, 0.17);
        }

    .recommendation-actions .portfolio-button:focus-visible[b-mx9xqmv34h] {
        outline: 3px solid rgba(29, 92, 164, 0.35);
        outline-offset: 3px;
    }


/* ===========================================================
   Recommendation Document
=========================================================== */

.recommendation-document[b-mx9xqmv34h] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 0;
    padding-left: 1rem;
}

    .recommendation-document a[b-mx9xqmv34h] {
        display: block;
        width: 100%;
        max-width: 470px;
        padding: 0.65rem;
        background: #043165;
        border: 1px solid #dce4ee;
        border-radius: 14px;
        box-shadow: 0 14px 34px rgba(20, 46, 79, 0.13);
        overflow: hidden;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

        .recommendation-document a:hover[b-mx9xqmv34h] {
            border-color: #b8cbe2;
            transform: translateY(-5px);
            box-shadow: 0 20px 44px rgba(20, 46, 79, 0.18);
        }

        .recommendation-document a:focus-visible[b-mx9xqmv34h] {
            outline: 3px solid rgba(29, 92, 164, 0.35);
            outline-offset: 4px;
        }

    .recommendation-document img[b-mx9xqmv34h] {
        display: block;
        width: 100%;
        height: auto;
        max-height: 680px;
        object-fit: contain;
        border-radius: 8px;
        background: #043165;
    }


/* ===========================================================
   Responsive – Tablet
=========================================================== */

@media (max-width: 992px) {

    .recommendations-section[b-mx9xqmv34h] {
        padding: 4rem 0;
    }

    .recommendation-card[b-mx9xqmv34h] {
        grid-template-columns: 1fr;
        gap: 2.5rem;
        padding: 2.5rem;
    }

    .recommendation-document[b-mx9xqmv34h] {
        width: 100%;
    }

        .recommendation-document a[b-mx9xqmv34h] {
            max-width: 620px;
        }

        .recommendation-document img[b-mx9xqmv34h] {
            max-height: none;
        }
}


/* ===========================================================
   Responsive – Mobile
=========================================================== */

@media (max-width: 768px) {

    .recommendations-section[b-mx9xqmv34h] {
        padding: 3.5rem 0;
    }

    .recommendation-intro[b-mx9xqmv34h] {
        margin-bottom: 2.3rem;
        font-size: 1rem;
        line-height: 1.75;
    }

    .recommendation-card[b-mx9xqmv34h] {
        gap: 2rem;
        padding: 2rem;
        border-radius: 18px;
    }

        .recommendation-card + .recommendation-card[b-mx9xqmv34h] {
            margin-top: 2.5rem;
        }

    .recommendation-position[b-mx9xqmv34h] {
        font-size: 1rem;
    }

    .recommendation-description[b-mx9xqmv34h] {
        font-size: 0.97rem;
        line-height: 1.75;
    }

    .recommendation-actions[b-mx9xqmv34h] {
        margin-top: 1.7rem;
    }
}


/* ===========================================================
   Responsive – Small Mobile
=========================================================== */

@media (max-width: 560px) {

    .recommendations-section[b-mx9xqmv34h] {
        padding: 3rem 0;
    }

    .recommendations-title h1[b-mx9xqmv34h] {
        font-size: 2rem;
    }

    .recommendations-title span[b-mx9xqmv34h] {
        width: 58px;
        height: 3px;
    }

    .recommendation-card[b-mx9xqmv34h] {
        padding: 1.4rem;
        border-radius: 15px;
    }

    .recommendation-content h2[b-mx9xqmv34h] {
        font-size: 1.55rem;
    }

    .recommendation-actions[b-mx9xqmv34h] {
        flex-direction: column;
        width: 100%;
    }

        .recommendation-actions .portfolio-button[b-mx9xqmv34h] {
            width: 100%;
        }

    .recommendation-document a[b-mx9xqmv34h] {
        padding: 0.45rem;
        border-radius: 11px;
    }

    .recommendation-document img[b-mx9xqmv34h] {
        border-radius: 7px;
    }
}
/* /Components/Pages/English/RecommendationsRmu.razor.rz.scp.css */
.recommendations-section[b-imv4bqleav] {
    min-height: 100vh;
    padding: 90px 0 100px;
    color: #ffffff;
    background: #071525;
}

.recommendations-title[b-imv4bqleav] {
    text-align: center;
}

    .recommendations-title h1[b-imv4bqleav] {
        margin: 0;
        color: #ffffff;
        font-size: clamp(2rem, 4vw, 3rem);
        font-weight: 700;
    }

    .recommendations-title span[b-imv4bqleav] {
        display: block;
        width: 60px;
        height: 3px;
        margin: 20px auto 0;
        background: #2d95f3;
        border-radius: 999px;
    }

.recommendation-intro[b-imv4bqleav] {
    max-width: 900px;
    margin: 38px auto 55px;
    color: #b7c5d3;
    font-size: 1rem;
    line-height: 1.8;
    text-align: center;
}

.recommendation-card[b-imv4bqleav] {
    display: grid;
    grid-template-columns: minmax(300px, 0.8fr) minmax(420px, 1.2fr);
    align-items: center;
    gap: 50px;
    padding: 38px;
    background: linear-gradient( 145deg, rgba(23, 63, 104, 0.82), rgba(10, 36, 65, 0.97) );
    border: 1px solid rgba(100, 181, 246, 0.35);
    border-radius: 14px;
    box-shadow: 0 24px 65px rgba(0, 0, 0, 0.3);
}

.recommendation-content[b-imv4bqleav] {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.recommendation-label[b-imv4bqleav] {
    margin: 0 0 18px;
    color: #64b5f6;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.18rem;
}

.recommendation-content h2[b-imv4bqleav] {
    margin: 0;
    color: #ffffff;
    font-size: clamp(1.65rem, 3vw, 2.2rem);
    line-height: 1.25;
}

.recommendation-position[b-imv4bqleav] {
    margin: 18px 0 0;
    color: #d9e7f5;
    font-size: 1rem;
    font-weight: 700;
}

.recommendation-period[b-imv4bqleav] {
    margin: 8px 0 24px;
    color: #8dc8fb;
    font-size: 0.9rem;
    font-weight: 600;
}

.recommendation-description[b-imv4bqleav] {
    margin: 0 0 16px;
    color: #cbd7e4;
    font-size: 0.98rem;
    line-height: 1.75;
}

.recommendation-actions[b-imv4bqleav] {
    margin-top: 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.recommendation-document[b-imv4bqleav] {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .recommendation-document a[b-imv4bqleav] {
        display: block;
        width: 100%;
        max-width: 620px;
        overflow: hidden;
        border-radius: 10px;
        text-decoration: none;
    }

    .recommendation-document img[b-imv4bqleav] {
        display: block;
        width: 100%;
        height: auto;
        border: 1px solid rgba(255, 255, 255, 0.16);
        border-radius: 10px;
        box-shadow: 0 20px 55px rgba(0, 0, 0, 0.38);
        transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
    }

    .recommendation-document a:hover img[b-imv4bqleav] {
        transform: scale(1.015);
        border-color: rgba(100, 181, 246, 0.65);
        box-shadow: 0 26px 70px rgba(0, 0, 0, 0.48);
    }

@media (max-width: 1000px) {
    .recommendations-section[b-imv4bqleav] {
        padding-top: 75px;
    }

    .recommendation-card[b-imv4bqleav] {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .recommendation-content[b-imv4bqleav] {
        text-align: center;
    }

    .recommendation-actions[b-imv4bqleav] {
        justify-content: center;
    }

    .recommendation-document a[b-imv4bqleav] {
        max-width: 680px;
    }
}

@media (max-width: 650px) {
    .recommendations-section[b-imv4bqleav] {
        padding: 60px 0 75px;
    }

    .recommendation-intro[b-imv4bqleav] {
        margin-bottom: 38px;
        font-size: 0.95rem;
    }

    .recommendation-card[b-imv4bqleav] {
        padding: 22px;
        gap: 30px;
    }

    .recommendation-actions[b-imv4bqleav] {
        flex-direction: column;
    }

        .recommendation-actions .portfolio-button[b-imv4bqleav] {
            width: 100%;
            text-align: center;
        }

    .recommendation-description[b-imv4bqleav] {
        font-size: 0.94rem;
    }
}
/* /Components/Pages/Home/About.razor.rz.scp.css */
.about-page[b-t7hf8h44dm] {
    width: 100%;
    padding: 55px 24px 60px;
    background: #071525;
}

.about-heading[b-t7hf8h44dm] {
    text-align: center;
    margin-bottom: 45px;
}

.about-eyebrow[b-t7hf8h44dm] {
    display: block;
    margin-bottom: 12px;
    color: #3da5ff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
}

.about-heading h1[b-t7hf8h44dm] {
    margin: 0;
    color: #ffffff;
    font-size: 48px;
    font-weight: 700;
    line-height: 1.1;
}

.heading-line[b-t7hf8h44dm] {
    width: 50px;
    height: 3px;
    margin: 18px auto 0;
    border-radius: 5px;
    background: #3da5ff;
}


/* ==================================================
   ABOUT CARD
================================================== */

.about-card[b-t7hf8h44dm] {
    width: 100%;
    max-width: 1050px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 43% 57%;
    overflow: hidden;
    background: #12395f;
    border: 1px solid rgba(61, 165, 255, 0.45);
    border-radius: 14px;
}


/* ==================================================
   LEFT SIDE
================================================== */

.about-visual[b-t7hf8h44dm] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: #12395f;
}


/* PHOTO */

.about-photo[b-t7hf8h44dm] {
    min-height: 430px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #12395f;
}

    .about-photo img[b-t7hf8h44dm] {
        display: block;
        width: auto;
        height: 390px;
        max-width: 92%;
        object-fit: contain;
        object-position: center center;
        margin: 0 auto;
    }


/* ==================================================
   PROFESSIONAL APPROACH
================================================== */

.professional-approach[b-t7hf8h44dm] {
    min-height: 120px;
    padding: 24px 28px 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: #12395f;
    border-top: 1px solid rgba(61, 165, 255, 0.22);
}

.approach-label[b-t7hf8h44dm] {
    display: block;
    margin-bottom: 10px;
    color: #4aafff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.6px;
    text-transform: uppercase;
}

.professional-approach p[b-t7hf8h44dm] {
    margin: 0;
    max-width: 330px;
    color: #ffffff;
    font-size: 15px;
    line-height: 1.6;
    text-align: center;
}


/* ==================================================
   RIGHT SIDE
================================================== */

.about-content[b-t7hf8h44dm] {
    min-width: 0;
    padding: 52px 48px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #12395f;
}

.profile-name[b-t7hf8h44dm] {
    display: block;
    margin-bottom: 18px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.about-content h2[b-t7hf8h44dm] {
    margin: 0 0 27px;
    max-width: 520px;
    color: #ffffff;
    font-size: 31px;
    font-weight: 700;
    line-height: 1.28;
}

.about-content p[b-t7hf8h44dm] {
    margin: 0 0 19px;
    color: #e2edf7;
    font-size: 15px;
    line-height: 1.75;
}

.about-content .about-lead[b-t7hf8h44dm] {
    color: #ffffff;
    font-weight: 700;
}


/* ==================================================
   BUTTONS
================================================== */

.about-actions[b-t7hf8h44dm] {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 10px;
}

    .about-actions a[b-t7hf8h44dm] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 46px;
        padding: 0 22px;
        border-radius: 6px;
        font-size: 14px;
        font-weight: 700;
        text-decoration: none;
        transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
    }

.btn-primary[b-t7hf8h44dm] {
    color: #ffffff;
    background: #329df4;
    border: 1px solid #329df4;
}

    .btn-primary:hover[b-t7hf8h44dm] {
        background: #1688e5;
        border-color: #1688e5;
        transform: translateY(-1px);
    }

.btn-secondary[b-t7hf8h44dm] {
    color: #ffffff;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.65);
}

    .btn-secondary:hover[b-t7hf8h44dm] {
        background: rgba(255, 255, 255, 0.08);
        border-color: #ffffff;
        transform: translateY(-1px);
    }


/* ==================================================
   EXPERTISE
================================================== */

.expertise-section[b-t7hf8h44dm] {
    padding: 10px 24px 70px;
    background: #071525;
}

.section-heading[b-t7hf8h44dm] {
    text-align: center;
}

    .section-heading h2[b-t7hf8h44dm] {
        margin: 0;
        color: #ffffff;
        font-size: 31px;
        font-weight: 700;
    }


/* ==================================================
   RESPONSIVE
================================================== */

@media (max-width: 900px) {

    .about-card[b-t7hf8h44dm] {
        max-width: 680px;
        grid-template-columns: 1fr;
    }

    .about-photo[b-t7hf8h44dm] {
        min-height: 420px;
    }

        .about-photo img[b-t7hf8h44dm] {
            height: 390px;
            max-width: 90%;
        }

    .professional-approach[b-t7hf8h44dm] {
        min-height: 110px;
    }

    .about-content[b-t7hf8h44dm] {
        padding: 42px 36px;
    }
}


@media (max-width: 600px) {

    .about-page[b-t7hf8h44dm] {
        padding: 40px 16px 45px;
    }

    .about-heading[b-t7hf8h44dm] {
        margin-bottom: 32px;
    }

        .about-heading h1[b-t7hf8h44dm] {
            font-size: 38px;
        }

    .about-photo[b-t7hf8h44dm] {
        min-height: 340px;
    }

        .about-photo img[b-t7hf8h44dm] {
            height: 320px;
            max-width: 92%;
        }

    .professional-approach[b-t7hf8h44dm] {
        min-height: 100px;
        padding: 20px 20px 22px;
    }

        .professional-approach p[b-t7hf8h44dm] {
            font-size: 14px;
        }

    .about-content[b-t7hf8h44dm] {
        padding: 34px 24px;
    }

        .about-content h2[b-t7hf8h44dm] {
            font-size: 26px;
        }

        .about-content p[b-t7hf8h44dm] {
            font-size: 14px;
        }

    .about-actions[b-t7hf8h44dm] {
        flex-direction: column;
    }

        .about-actions a[b-t7hf8h44dm] {
            width: 100%;
        }

    .section-heading h2[b-t7hf8h44dm] {
        font-size: 27px;
    }
}
/* ==================================================
   EXPERTISE SECTION
================================================== */

.expertise-section[b-t7hf8h44dm] {
    width: 100%;
    padding: 70px 24px 90px;
    background: #071525;
}

.section-heading[b-t7hf8h44dm] {
    margin-bottom: 42px;
    text-align: center;
}

    .section-heading h2[b-t7hf8h44dm] {
        margin: 0;
        color: #ffffff;
        font-size: 31px;
        font-weight: 700;
    }

.expertise-grid[b-t7hf8h44dm] {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.expertise-card[b-t7hf8h44dm] {
    min-height: 220px;
    padding: 30px 28px;
    background: linear-gradient( 145deg, rgba(23, 63, 104, 0.82), rgba(10, 36, 65, 0.97) );
    border: 1px solid rgba(100, 181, 246, 0.30);
    border-radius: 12px;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

    .expertise-card:hover[b-t7hf8h44dm] {
        transform: translateY(-5px);
        border-color: rgba(100, 181, 246, 0.75);
        box-shadow: 0 20px 45px rgba(0, 0, 0, 0.22);
    }

.expertise-number[b-t7hf8h44dm] {
    display: block;
    margin-bottom: 25px;
    color: #64b5f6;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.expertise-card h3[b-t7hf8h44dm] {
    margin: 0 0 15px;
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
}

.expertise-card p[b-t7hf8h44dm] {
    margin: 0;
    color: #c1d0df;
    font-size: 15px;
    line-height: 1.7;
}


/* PGP / EDUCATION CARD */

.pgp-card[b-t7hf8h44dm] {
    grid-column: 2;
    border-color: rgba(100, 181, 246, 0.55);
    background: linear-gradient( 145deg, #184d7d, #0d3154 );
}


/* TABLET */

@media (max-width: 900px) {

    .expertise-grid[b-t7hf8h44dm] {
        grid-template-columns: repeat(2, 1fr);
    }

    .pgp-card[b-t7hf8h44dm] {
        grid-column: 1 / -1;
        max-width: 540px;
        width: 100%;
        margin: 0 auto;
    }
}


/* MOBILE */

@media (max-width: 600px) {

    .expertise-section[b-t7hf8h44dm] {
        padding: 55px 16px 70px;
    }

    .expertise-grid[b-t7hf8h44dm] {
        grid-template-columns: 1fr;
    }

    .pgp-card[b-t7hf8h44dm] {
        grid-column: auto;
        max-width: none;
    }

    .expertise-card[b-t7hf8h44dm] {
        min-height: auto;
    }
}
/* /Components/Pages/Home/Awards.razor.rz.scp.css */
.awards-page[b-o48rn900vx] {
    --page-background: #07111f;
    --page-background-soft: #0b1727;
    --card-background: rgba(13, 29, 48, 0.82);
    --card-background-strong: rgba(15, 34, 56, 0.96);
    --border-color: rgba(148, 184, 221, 0.17);
    --border-highlight: rgba(197, 160, 72, 0.42);
    --primary-text: #f4f7fb;
    --secondary-text: #b5c2d1;
    --muted-text: #8999ab;
    --gold: #d7b45d;
    --gold-light: #f0d58a;
    --blue: #5da7e8;
    --shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
    min-height: 100%;
    overflow: hidden;
    color: var(--primary-text);
    background: radial-gradient( circle at 15% 15%, rgba(43, 106, 168, 0.12), transparent 32% ), linear-gradient( 180deg, #07111f 0%, #091525 46%, #07111f 100% );
}

.page-shell[b-o48rn900vx] {
    width: min(1180px, calc(100% - 40px));
    margin-inline: auto;
}

/* HERO */

.awards-hero[b-o48rn900vx] {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    min-height: 520px;
    padding: 110px 0 90px;
    overflow: hidden;
    border-bottom: 1px solid var(--border-color);
}

    .awards-hero[b-o48rn900vx]::before {
        position: absolute;
        z-index: -2;
        inset: 0;
        content: "";
        background: linear-gradient( 90deg, rgba(7, 17, 31, 0.98) 0%, rgba(7, 17, 31, 0.86) 55%, rgba(7, 17, 31, 0.64) 100% );
    }

    .awards-hero[b-o48rn900vx]::after {
        position: absolute;
        z-index: -1;
        right: -120px;
        bottom: -160px;
        width: 600px;
        height: 600px;
        content: "";
        border: 1px solid rgba(215, 180, 93, 0.12);
        border-radius: 50%;
        box-shadow: 0 0 0 80px rgba(215, 180, 93, 0.025), 0 0 0 160px rgba(215, 180, 93, 0.018);
    }

.hero-content[b-o48rn900vx] {
    position: relative;
    z-index: 2;
}

.eyebrow[b-o48rn900vx],
.section-kicker[b-o48rn900vx] {
    margin: 0 0 14px;
    color: var(--gold-light);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.19em;
    text-transform: uppercase;
}

.awards-hero h1[b-o48rn900vx] {
    max-width: 850px;
    margin: 0;
    color: var(--primary-text);
    font-size: clamp(3.1rem, 6vw, 6.2rem);
    font-weight: 750;
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.hero-lead[b-o48rn900vx] {
    max-width: 760px;
    margin: 30px 0 0;
    color: var(--secondary-text);
    font-size: clamp(1.05rem, 2vw, 1.3rem);
    line-height: 1.8;
}

.hero-highlights[b-o48rn900vx] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 36px;
}

    .hero-highlights span[b-o48rn900vx] {
        padding: 10px 16px;
        border: 1px solid rgba(215, 180, 93, 0.23);
        border-radius: 999px;
        color: #d8e1eb;
        background: rgba(215, 180, 93, 0.055);
        font-size: 0.84rem;
        font-weight: 650;
    }

.hero-glow[b-o48rn900vx] {
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    filter: blur(5px);
    pointer-events: none;
}

.hero-glow-left[b-o48rn900vx] {
    top: -180px;
    left: -180px;
    width: 520px;
    height: 520px;
    background: rgba(42, 112, 181, 0.14);
}

.hero-glow-right[b-o48rn900vx] {
    right: 10%;
    bottom: -240px;
    width: 500px;
    height: 500px;
    background: rgba(215, 180, 93, 0.07);
}

/* AWARD SECTIONS */

.award-section[b-o48rn900vx] {
    position: relative;
    padding: 110px 0;
    border-bottom: 1px solid var(--border-color);
}

.award-section-iraq[b-o48rn900vx] {
    background: linear-gradient( 135deg, rgba(11, 27, 45, 0.94), rgba(7, 17, 31, 0.98) );
}

.award-section-kuwait[b-o48rn900vx] {
    background: radial-gradient( circle at 85% 50%, rgba(49, 113, 169, 0.08), transparent 34% ), var(--page-background);
}

.award-layout[b-o48rn900vx] {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(440px, 1.08fr);
    gap: clamp(48px, 7vw, 90px);
    align-items: center;
}

.award-layout-reversed .award-content[b-o48rn900vx] {
    order: 2;
}

.award-layout-reversed .award-visual[b-o48rn900vx] {
    order: 1;
}

.award-content h2[b-o48rn900vx] {
    margin: 0;
    color: var(--primary-text);
    font-size: clamp(1.8rem, 3vw);
    font-weight: 650;
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.award-introduction[b-o48rn900vx] {
    margin: 24px 0 0;
    color: var(--secondary-text);
    font-size: 1.03rem;
    line-height: 1.85;
}

.recognition-list[b-o48rn900vx] {
    display: grid;
    gap: 16px;
    margin-top: 34px;
}

.recognition-item[b-o48rn900vx] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 18px;
    padding: 22px;
    border: 1px solid var(--border-color);
    border-radius: 18px;
    background: linear-gradient( 145deg, rgba(20, 42, 67, 0.72), rgba(10, 24, 41, 0.8) );
    box-shadow: 0 15px 34px rgba(0, 0, 0, 0.12);
    transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

    .recognition-item:hover[b-o48rn900vx] {
        transform: translateY(-3px);
        border-color: var(--border-highlight);
    }

.recognition-icon[b-o48rn900vx] {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(215, 180, 93, 0.32);
    border-radius: 13px;
    color: var(--gold-light);
    background: rgba(215, 180, 93, 0.08);
    font-size: 1rem;
}

.recognition-item h3[b-o48rn900vx] {
    margin: 1px 0 8px;
    color: var(--primary-text);
    font-size: 1.06rem;
    font-weight: 730;
}

.recognition-item p[b-o48rn900vx] {
    margin: 0;
    color: var(--secondary-text);
    font-size: 0.94rem;
    line-height: 1.68;
}

/* IMAGES */

.award-visual[b-o48rn900vx] {
    position: relative;
    margin: 0;
}

.image-frame[b-o48rn900vx] {
    position: relative;
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(215, 180, 93, 0.24);
    border-radius: 26px;
    background: linear-gradient( 145deg, rgba(215, 180, 93, 0.1), rgba(76, 139, 197, 0.07) );
    box-shadow: var(--shadow);
}

    .image-frame[b-o48rn900vx]::before {
        position: absolute;
        z-index: 2;
        inset: 10px;
        content: "";
        border: 1px solid rgba(255, 255, 255, 0.07);
        border-radius: 18px;
        pointer-events: none;
    }

    .image-frame img[b-o48rn900vx] {
        display: block;
        width: 100%;
        height: auto;
        max-height: 660px;
        object-fit: contain;
        border-radius: 18px;
        background: #081321;
    }

.award-visual figcaption[b-o48rn900vx] {
    max-width: 90%;
    margin: 17px auto 0;
    color: var(--muted-text);
    font-size: 0.83rem;
    line-height: 1.6;
    text-align: center;
}

/* VERIFICATION */

.verification-section[b-o48rn900vx] {
    padding: 95px 0 115px;
    background: linear-gradient( 180deg, rgba(9, 21, 37, 0.78), rgba(7, 17, 31, 1) );
}

.verification-card[b-o48rn900vx] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 26px;
    padding: clamp(30px, 5vw, 48px);
    border: 1px solid rgba(215, 180, 93, 0.23);
    border-radius: 24px;
    background: linear-gradient( 135deg, rgba(18, 38, 61, 0.94), rgba(10, 24, 41, 0.94) );
    box-shadow: var(--shadow);
}

.verification-badge[b-o48rn900vx] {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border: 1px solid rgba(215, 180, 93, 0.42);
    border-radius: 17px;
    color: #07111f;
    background: linear-gradient( 135deg, var(--gold-light), var(--gold) );
    font-size: 1.3rem;
    font-weight: 900;
    box-shadow: 0 12px 28px rgba(215, 180, 93, 0.18);
}

.verification-card h2[b-o48rn900vx] {
    margin: 0 0 18px;
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    line-height: 1.2;
    letter-spacing: -0.025em;
}

.verification-card p:not(.section-kicker)[b-o48rn900vx] {
    max-width: 880px;
    margin: 0;
    color: var(--secondary-text);
    line-height: 1.8;
}

.verification-card p + p[b-o48rn900vx] {
    margin-top: 14px;
}

/* RESPONSIVE */

@media (max-width: 980px) {
    .award-layout[b-o48rn900vx] {
        grid-template-columns: 1fr;
    }

    .award-layout-reversed .award-content[b-o48rn900vx],
    .award-layout-reversed .award-visual[b-o48rn900vx] {
        order: initial;
    }

    .award-visual[b-o48rn900vx] {
        max-width: 760px;
        width: 100%;
        margin-inline: auto;
    }
}

@media (max-width: 700px) {
    .page-shell[b-o48rn900vx] {
        width: min(100% - 28px, 1180px);
    }

    .awards-hero[b-o48rn900vx] {
        min-height: auto;
        padding: 88px 0 72px;
    }

        .awards-hero h1[b-o48rn900vx] {
            font-size: clamp(2.8rem, 15vw, 4.3rem);
        }

    .hero-lead[b-o48rn900vx] {
        margin-top: 24px;
        font-size: 1rem;
    }

    .hero-highlights[b-o48rn900vx] {
        margin-top: 28px;
    }

        .hero-highlights span[b-o48rn900vx] {
            padding: 8px 12px;
            font-size: 0.76rem;
        }

    .award-section[b-o48rn900vx] {
        padding: 78px 0;
    }

    .award-layout[b-o48rn900vx] {
        gap: 42px;
    }

    .recognition-item[b-o48rn900vx] {
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 20px;
    }

    .recognition-icon[b-o48rn900vx] {
        width: 40px;
        height: 40px;
    }

    .verification-section[b-o48rn900vx] {
        padding: 72px 0 90px;
    }

    .verification-card[b-o48rn900vx] {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 26px 22px;
    }

    .verification-badge[b-o48rn900vx] {
        width: 50px;
        height: 50px;
        border-radius: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .recognition-item[b-o48rn900vx] {
        transition: none;
    }

        .recognition-item:hover[b-o48rn900vx] {
            transform: none;
        }
}
/* /Components/Pages/Home/Contact.razor.rz.scp.css */
.contact-hero[b-fmqs5763za] {
    padding: 6rem 0 4rem;
    background: linear-gradient(180deg,#0b1220,#111827);
    text-align: center;
    color: #ccd3d9;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    line-height: 1.6;
}
.portfolio-container1[b-fmqs5763za] {
    overflow-x: hidden;
    color: #ccd3d9;
    background: #0f172a;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    line-height: 1.6;
}
.contact-info[b-fmqs5763za] {
    padding: 6rem 0 4rem;
    color: #ccd3d9;
    background: #0f172a;
    text-align: center;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    line-height: 1.6;
}
.section-label[b-fmqs5763za] {
    color: #ccd3d9;
    letter-spacing: .2rem;
    text-transform: uppercase;
    font-size: .85rem; 
}

.lead[b-fmqs5763za] {
    max-width: 760px;
    margin: 1.5rem auto;
    color: #cbd5e1;
    line-height: 1.8
}

.linkedin-card[b-fmqs5763za] {
    display: inline-block;
    width: 300px;
    max-width: 100%;
    margin-top: 2rem;
    border-radius: 14px;
    overflow: hidden;
    transition: .25s ease;
}

    .linkedin-card img[b-fmqs5763za] {
        display: block;
        width: 100%;
        height: auto;
    }

    .linkedin-card:hover[b-fmqs5763za] {
        transform: translateY(-4px);
        box-shadow: 0 12px 30px rgba(10,102,194,.30);
    }
    
    .contact-section[b-fmqs5763za] {
    padding: 5rem 0;
    background: #0f172a
}

.grid[b-fmqs5763za] {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(300px,1fr));
    gap: 2rem
}

.card[b-fmqs5763za] {
    background: #1e293b;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    padding: 2rem;
    box-shadow: 0 20px 40px rgba(0,0,0,.25);
    color: #ccd3d9;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    line-height: 1.6;
}

    .card h2[b-fmqs5763za] {
        margin-bottom: 1rem 
    }

    .card p[b-fmqs5763za], .card li[b-fmqs5763za] {
        line-height: 1.7;
        color: #8fa7c4
    }

.closing[b-fmqs5763za] {
    padding: 5rem 0;
    text-align: center;
    background: #111827;
    color: #ccd3d9;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    line-height: 1.6;
}

    @media(max-width:885px) {
        .grid[b-fmqs5763za] {
            grid-template-columns: 1fr
        }

        .contact-hero[b-fmqs5763za] {
            padding: 4rem 0 3rem
        }

        .contact-section[b-fmqs5763za], .closing[b-fmqs5763za] {
            padding: 3rem 0
        }
    }
/* /Components/Pages/Home/Education.razor.rz.scp.css */
.education-hero[b-schje8pmop] {
    position: relative;
    overflow: hidden;
    padding: 105px 0 85px;
    color: #ffffff;
    background: radial-gradient( circle at 82% 25%, rgba(45, 149, 243, 0.27), transparent 35% ), linear-gradient( 120deg, #041120 0%, #082445 55%, #0b3158 100% );
}

    .education-hero[b-schje8pmop]::before {
        content: "";
        position: absolute;
        inset: 0;
        opacity: 0.2;
        pointer-events: none;
        background-image: linear-gradient( rgba(100, 181, 246, 0.08) 1px, transparent 1px ), linear-gradient( 90deg, rgba(100, 181, 246, 0.08) 1px, transparent 1px );
        background-size: 70px 70px;
    }

.education-hero-container[b-schje8pmop] {
    position: relative;
    z-index: 1;
}

.section-label[b-schje8pmop] {
    margin: 0 0 16px;
    color: #64b5f6;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.18rem;
}

.education-hero h1[b-schje8pmop] {
    margin: 0;
    color: #ffffff;
    font-size: clamp(3.1rem, 7vw, 5.5rem);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.13rem;
}

.education-intro[b-schje8pmop] {
    max-width: 800px;
    margin: 28px 0 0;
    color: #cbd7e4;
    font-size: 1.1rem;
    line-height: 1.8;
}

.education-summary[b-schje8pmop] {
    margin-top: 50px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    overflow: hidden;
    background: rgba(7, 21, 37, 0.7);
    border: 1px solid rgba(100, 181, 246, 0.22);
    border-radius: 14px;
    backdrop-filter: blur(8px);
}

    .education-summary article[b-schje8pmop] {
        min-height: 125px;
        padding: 25px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        border-right: 1px solid rgba(100, 181, 246, 0.18);
    }

        .education-summary article:last-child[b-schje8pmop] {
            border-right: none;
        }

    .education-summary strong[b-schje8pmop] {
        color: #ffffff;
        font-size: 2rem;
        line-height: 1;
    }

    .education-summary span[b-schje8pmop] {
        margin-top: 10px;
        color: #9fb4c7;
        font-size: 0.9rem;
        line-height: 1.45;
    }

/* GLAVNA SEKCIJA */

.education-section[b-schje8pmop] {
    padding: 95px 0;
    color: #ffffff;
    background: #071525;
}

.section-heading[b-schje8pmop] {
    max-width: 790px;
    margin-bottom: 60px;
}

    .section-heading h2[b-schje8pmop] {
        margin: 0;
        color: #ffffff;
        font-size: clamp(2rem, 4vw, 3.2rem);
        font-weight: 600;
        letter-spacing: -0.05rem;
    }

    .section-heading > p:last-child[b-schje8pmop] {
        margin: 20px 0 0;
        color: #aebdca;
        font-size: 1.03rem;
        line-height: 1.75;
    }

/* VREMENSKA LINIJA */

.education-timeline[b-schje8pmop] {
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
}

    .education-timeline[b-schje8pmop]::before {
        content: "";
        position: absolute;
        top: 10px;
        bottom: 10px;
        left: 15px;
        width: 2px;
        background: linear-gradient( to bottom, #2d95f3, rgba(45, 149, 243, 0.18) );
    }

.education-item[b-schje8pmop] {
    position: relative;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 26px;
    margin-bottom: 32px;
}

    .education-item:last-child[b-schje8pmop] {
        margin-bottom: 0;
    }

.education-marker[b-schje8pmop] {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: center;
    padding-top: 36px;
}

    .education-marker span[b-schje8pmop] {
        display: block;
        width: 17px;
        height: 17px;
        background: #2d95f3;
        border: 4px solid #071525;
        border-radius: 50%;
        box-shadow: 0 0 0 2px rgba(100, 181, 246, 0.5);
    }

.education-card[b-schje8pmop] {
    padding: 34px;
    background: linear-gradient( 145deg, rgba(23, 63, 104, 0.72), rgba(10, 36, 65, 0.96) );
    border: 1px solid rgba(100, 181, 246, 0.24);
    border-radius: 14px;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

    .education-card:hover[b-schje8pmop] {
        transform: translateY(-4px);
        border-color: rgba(100, 181, 246, 0.65);
        box-shadow: 0 22px 48px rgba(0, 0, 0, 0.25);
    }

.featured-item .education-card[b-schje8pmop] {
    border-color: rgba(100, 181, 246, 0.52);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.18);
}

.education-card-header[b-schje8pmop] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 25px;
}

.education-period[b-schje8pmop] {
    margin: 0 0 12px;
    color: #64b5f6;
    font-size: 0.83rem;
    font-weight: 800;
    letter-spacing: 0.08rem;
}

.education-card h3[b-schje8pmop] {
    max-width: 760px;
    margin: 0;
    color: #ffffff;
    font-size: 1.45rem;
    line-height: 1.4;
}

.education-degree[b-schje8pmop] {
    margin: 13px 0 0;
    color: #d9e7f5;
    font-size: 1.02rem;
    font-weight: 600;
    line-height: 1.55;
}

    .education-degree span[b-schje8pmop] {
        margin-left: 8px;
        color: #8dc8fb;
    }

.education-status[b-schje8pmop] {
    flex: 0 0 auto;
    padding: 8px 12px;
    color: #d9efff;
    background: rgba(45, 149, 243, 0.16);
    border: 1px solid rgba(100, 181, 246, 0.38);
    border-radius: 999px;
    font-size: 0.77rem;
    font-weight: 800;
    letter-spacing: 0.04rem;
}

.education-status-neutral[b-schje8pmop] {
    color: #d7dde3;
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.18);
}

.education-description[b-schje8pmop] {
    margin: 25px 0 0;
    color: #b7c5d3;
    font-size: 1rem;
    line-height: 1.75;
}

.education-highlights[b-schje8pmop] {
    margin-top: 27px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow: hidden;
    background: rgba(4, 17, 32, 0.45);
    border: 1px solid rgba(100, 181, 246, 0.15);
    border-radius: 10px;
}

    .education-highlights div[b-schje8pmop] {
        min-height: 95px;
        padding: 19px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        border-right: 1px solid rgba(100, 181, 246, 0.14);
    }

        .education-highlights div:last-child[b-schje8pmop] {
            border-right: none;
        }

    .education-highlights strong[b-schje8pmop] {
        color: #ffffff;
        font-size: 1.5rem;
    }

    .education-highlights span[b-schje8pmop] {
        margin-top: 7px;
        color: #93a8ba;
        font-size: 0.82rem;
    }

.education-tags[b-schje8pmop] {
    margin-top: 24px;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

    .education-tags span[b-schje8pmop] {
        padding: 7px 11px;
        color: #a9d7fc;
        background: rgba(45, 149, 243, 0.1);
        border: 1px solid rgba(100, 181, 246, 0.2);
        border-radius: 999px;
        font-size: 0.78rem;
        font-weight: 700;
    }

/* ZAVRŠNA SEKCIJA */

.education-connection-section[b-schje8pmop] {
    padding: 85px 0;
    color: #ffffff;
    background: #0a2037;
}

.education-connection-card[b-schje8pmop] {
    padding: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    background: linear-gradient( 135deg, rgba(23, 63, 104, 0.88), rgba(7, 21, 37, 0.96) );
    border: 1px solid rgba(100, 181, 246, 0.3);
    border-radius: 14px;
}

    .education-connection-card > div[b-schje8pmop] {
        max-width: 780px;
    }

    .education-connection-card h2[b-schje8pmop] {
        margin: 0;
        color: #ffffff;
        font-size: clamp(1.8rem, 4vw, 2.7rem);
    }

    .education-connection-card p:last-child[b-schje8pmop] {
        margin: 20px 0 0;
        color: #b7c5d3;
        line-height: 1.75;
    }

/* TABLET */

@media (max-width: 1000px) {
    .education-summary[b-schje8pmop] {
        grid-template-columns: repeat(2, 1fr);
    }

        .education-summary article:nth-child(2)[b-schje8pmop] {
            border-right: none;
        }

        .education-summary article:nth-child(-n + 2)[b-schje8pmop] {
            border-bottom: 1px solid rgba(100, 181, 246, 0.18);
        }

    .education-connection-card[b-schje8pmop] {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* MOBITEL */

@media (max-width: 650px) {
    .education-hero[b-schje8pmop] {
        padding: 80px 0 65px;
    }

        .education-hero h1[b-schje8pmop] {
            font-size: clamp(2.8rem, 15vw, 4rem);
            letter-spacing: -0.07rem;
        }

    .education-intro[b-schje8pmop] {
        font-size: 1rem;
    }

    .education-summary[b-schje8pmop] {
        grid-template-columns: 1fr;
    }

        .education-summary article[b-schje8pmop] {
            min-height: 105px;
            border-right: none;
            border-bottom: 1px solid rgba(100, 181, 246, 0.18);
        }

            .education-summary article:last-child[b-schje8pmop] {
                border-bottom: none;
            }

    .education-section[b-schje8pmop] {
        padding: 75px 0;
    }

    .education-item[b-schje8pmop] {
        grid-template-columns: 22px minmax(0, 1fr);
        gap: 14px;
    }

    .education-timeline[b-schje8pmop]::before {
        left: 10px;
    }

    .education-marker[b-schje8pmop] {
        padding-top: 30px;
    }

        .education-marker span[b-schje8pmop] {
            width: 14px;
            height: 14px;
            border-width: 3px;
        }

    .education-card[b-schje8pmop] {
        padding: 25px 21px;
    }

    .education-card-header[b-schje8pmop] {
        flex-direction: column;
        gap: 16px;
    }

    .education-card h3[b-schje8pmop] {
        font-size: 1.22rem;
    }

    .education-degree span[b-schje8pmop] {
        display: block;
        margin: 5px 0 0;
    }

    .education-highlights[b-schje8pmop] {
        grid-template-columns: 1fr;
    }

        .education-highlights div[b-schje8pmop] {
            min-height: 82px;
            border-right: none;
            border-bottom: 1px solid rgba(100, 181, 246, 0.14);
        }

            .education-highlights div:last-child[b-schje8pmop] {
                border-bottom: none;
            }

    .education-connection-card[b-schje8pmop] {
        padding: 30px 24px;
    }

        .education-connection-card .portfolio-button[b-schje8pmop] {
            width: 100%;
            text-align: center;
        }
}
/* /Components/Pages/Home/Experience.razor.rz.scp.css */
html[b-gegy9nast3] {
    scroll-behavior: smooth;
}


/* =========================================================
   HERO
========================================================= */

.experience-hero[b-gegy9nast3] {
    position: relative;
    overflow: hidden;
    padding: 105px 0 95px;
    color: #ffffff;
    background: radial-gradient( circle at 80% 20%, rgba(45, 149, 243, 0.22), transparent 34% ), linear-gradient( 120deg, #041120 0%, #082445 55%, #0b3158 100% );
}

    .experience-hero[b-gegy9nast3]::before {
        content: "";
        position: absolute;
        inset: 0;
        opacity: 0.2;
        pointer-events: none;
        background-image: linear-gradient( rgba(100, 181, 246, 0.08) 1px, transparent 1px ), linear-gradient( 90deg, rgba(100, 181, 246, 0.08) 1px, transparent 1px );
        background-size: 70px 70px;
    }

.experience-hero-content[b-gegy9nast3] {
    position: relative;
    z-index: 1;
}

.page-label[b-gegy9nast3] {
    margin: 0 0 17px;
    color: #64b5f6;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.2rem;
}

.experience-hero h1[b-gegy9nast3] {
    max-width: 900px;
    margin: 0;
    font-size: clamp(3rem, 6vw, 5.4rem);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -0.15rem;
}

.experience-hero-description[b-gegy9nast3] {
    max-width: 800px;
    margin: 27px 0 0;
    color: #cbd7e4;
    font-size: 1.1rem;
    line-height: 1.75;
}


/* =========================================================
   SUMMARY
========================================================= */

.experience-summary[b-gegy9nast3] {
    max-width: 880px;
    margin-top: 45px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow: hidden;
    border: 1px solid rgba(100, 181, 246, 0.25);
    border-radius: 12px;
    background: rgba(4, 17, 32, 0.42);
    backdrop-filter: blur(12px);
}

    .experience-summary article[b-gegy9nast3] {
        min-height: 125px;
        padding: 25px 27px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        border-right: 1px solid rgba(100, 181, 246, 0.2);
    }

        .experience-summary article:last-child[b-gegy9nast3] {
            border-right: none;
        }

    .experience-summary strong[b-gegy9nast3] {
        color: #ffffff;
        font-size: 2rem;
        line-height: 1;
    }

    .experience-summary span[b-gegy9nast3] {
        margin-top: 10px;
        color: #aebdcd;
        line-height: 1.45;
    }


/* =========================================================
   EXPERIENCE NAVIGATION
========================================================= */

.experience-navigation[b-gegy9nast3] {
    position: sticky;
    top: 78px;
    z-index: 50;
    background: rgba(7, 21, 37, 0.96);
    border-bottom: 1px solid rgba(100, 181, 246, 0.15);
    box-shadow: 0 10px 30px rgba(2, 12, 24, 0.15);
    backdrop-filter: blur(14px);
}

.experience-navigation-content[b-gegy9nast3] {
    min-height: 72px;
    display: flex;
    align-items: stretch;
    justify-content: center;
}

.experience-navigation a[b-gegy9nast3] {
    min-width: 190px;
    padding: 14px 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #d7e2ed;
    text-align: center;
    text-decoration: none;
    border-right: 1px solid rgba(100, 181, 246, 0.12);
    transition: color 180ms ease, background-color 180ms ease;
}

    .experience-navigation a:first-child[b-gegy9nast3] {
        border-left: 1px solid rgba(100, 181, 246, 0.12);
    }

    .experience-navigation a:hover[b-gegy9nast3] {
        color: #ffffff;
        background: rgba(45, 149, 243, 0.12);
    }

    .experience-navigation a span[b-gegy9nast3] {
        margin-bottom: 3px;
        color: #64b5f6;
        font-size: 0.75rem;
        font-weight: 800;
        letter-spacing: 0.06rem;
    }


/* =========================================================
   MAIN PAGE
========================================================= */

.experience-page[b-gegy9nast3] {
    padding: 100px 0;
    color: #ffffff;
    background: #071525;
}


/* =========================================================
   TIMELINE
========================================================= */

.timeline[b-gegy9nast3] {
    position: relative;
}

    .timeline[b-gegy9nast3]::before {
        content: "";
        position: absolute;
        top: 25px;
        bottom: 25px;
        left: 205px;
        width: 1px;
        background: linear-gradient( to bottom, transparent, rgba(100, 181, 246, 0.5) 5%, rgba(100, 181, 246, 0.22) 95%, transparent );
    }

.timeline-entry[b-gegy9nast3] {
    position: relative;
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    gap: 70px;
    scroll-margin-top: 175px;
}

    .timeline-entry + .timeline-entry[b-gegy9nast3] {
        margin-top: 95px;
    }


/* =========================================================
   TIMELINE MARKER
========================================================= */

.timeline-marker[b-gegy9nast3] {
    position: absolute;
    top: 30px;
    left: 194px;
    z-index: 2;
    width: 23px;
    height: 23px;
    padding: 4px;
    border: 1px solid #64b5f6;
    border-radius: 50%;
    background: #071525;
    box-shadow: 0 0 0 7px rgba(100, 181, 246, 0.08);
}

    .timeline-marker span[b-gegy9nast3] {
        display: block;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        background: #2d95f3;
    }


/* =========================================================
   TIMELINE PERIOD
========================================================= */

.timeline-period[b-gegy9nast3] {
    padding-top: 27px;
    text-align: right;
}

    .timeline-period strong[b-gegy9nast3] {
        display: block;
        color: #ffffff;
        font-size: 1.18rem;
    }

    .timeline-period span[b-gegy9nast3] {
        display: block;
        margin-top: 7px;
        color: #8297aa;
        font-size: 0.88rem;
    }


/* =========================================================
   EXPERIENCE PANEL
========================================================= */

.experience-panel[b-gegy9nast3] {
    overflow: hidden;
    background: linear-gradient( 145deg, rgba(16, 49, 82, 0.88), rgba(7, 29, 52, 0.98) );
    border: 1px solid rgba(100, 181, 246, 0.22);
    border-radius: 16px;
    box-shadow: 0 28px 75px rgba(0, 0, 0, 0.22);
}


/* =========================================================
   EXPERIENCE HEADER
========================================================= */

.experience-header[b-gegy9nast3] {
    padding: 38px 40px 32px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    border-bottom: 1px solid rgba(100, 181, 246, 0.16);
}

.experience-type[b-gegy9nast3] {
    margin: 0 0 11px;
    color: #64b5f6;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.15rem;
}

.experience-header h2[b-gegy9nast3] {
    margin: 0;
    color: #ffffff;
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: 600;
    line-height: 1.2;
}

.experience-organization[b-gegy9nast3] {
    max-width: 780px;
    margin: 12px 0 0;
    color: #9fb0c2;
    line-height: 1.55;
}

.experience-badge[b-gegy9nast3] {
    flex-shrink: 0;
    padding: 9px 13px;
    color: #8dc8fb;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.1rem;
    border: 1px solid rgba(100, 181, 246, 0.35);
    border-radius: 5px;
    background: rgba(45, 149, 243, 0.08);
}


/* =========================================================
   INTRODUCTION
========================================================= */

.experience-introduction[b-gegy9nast3] {
    padding: 32px 40px 8px;
}

    .experience-introduction p[b-gegy9nast3] {
        margin: 0;
        color: #c2cfdb;
        font-size: 1rem;
        line-height: 1.75;
    }

        .experience-introduction p + p[b-gegy9nast3] {
            margin-top: 17px;
        }

    .experience-introduction strong[b-gegy9nast3] {
        color: #ffffff;
    }


/* =========================================================
   FEDERALNI ZAVOD ZA STATISTIKU
========================================================= */

.statistics-content[b-gegy9nast3] {
    width: 100%;
    padding: 30px 55px 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .statistics-content .experience-description[b-gegy9nast3] {
        width: 100%;
        max-width: 900px;
        margin: 0 auto;
        padding: 0;
        color: #c2cfdb;
        font-size: 1rem;
        line-height: 1.75;
        text-align: justify;
        text-justify: inter-word;
    }


/* =========================================================
   SECTIONS
========================================================= */

.responsibilities-section[b-gegy9nast3],
.systems-section[b-gegy9nast3],
.formal-responsibilities[b-gegy9nast3] {
    padding: 30px 40px 5px;
}

    .responsibilities-section h3[b-gegy9nast3],
    .systems-section h3[b-gegy9nast3],
    .formal-responsibilities h3[b-gegy9nast3] {
        margin: 0 0 22px;
        color: #ffffff;
        font-size: 1.18rem;
    }


/* =========================================================
   RESPONSIBILITIES
========================================================= */

.responsibilities-grid[b-gegy9nast3] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 17px;
}

.responsibility-card[b-gegy9nast3] {
    min-height: 200px;
    padding: 24px;
    background: rgba(4, 22, 41, 0.55);
    border: 1px solid rgba(100, 181, 246, 0.16);
    border-radius: 10px;
    transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

    .responsibility-card:hover[b-gegy9nast3] {
        transform: translateY(-4px);
        border-color: rgba(100, 181, 246, 0.55);
        background: rgba(9, 40, 69, 0.75);
    }

.responsibility-number[b-gegy9nast3] {
    color: #64b5f6;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1rem;
}

.responsibility-card h4[b-gegy9nast3] {
    margin: 17px 0 10px;
    color: #ffffff;
    font-size: 1.05rem;
}

.responsibility-card p[b-gegy9nast3] {
    margin: 0;
    color: #aebdca;
    line-height: 1.65;
}


/* =========================================================
   SYSTEMS
========================================================= */

.systems-content[b-gegy9nast3] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 17px;
}

    .systems-content > div[b-gegy9nast3] {
        padding: 24px;
        background: rgba(4, 22, 41, 0.55);
        border-top: 2px solid #2d95f3;
        border-radius: 7px;
    }

    .systems-content h4[b-gegy9nast3] {
        margin: 0 0 10px;
        color: #ffffff;
        font-size: 1.03rem;
    }

    .systems-content p[b-gegy9nast3] {
        margin: 0;
        color: #aebdca;
        line-height: 1.65;
    }


/* =========================================================
   MENTOR
========================================================= */

.mentor-section[b-gegy9nast3] {
    margin: 30px 40px 0;
    padding: 28px 30px;
    background: rgba(212, 175, 55, 0.06);
    border-left: 3px solid #d4af37;
    border-radius: 0 9px 9px 0;
}

    .mentor-section h3[b-gegy9nast3] {
        margin: 0 0 14px;
        color: #e6c868;
    }

    .mentor-section p[b-gegy9nast3] {
        margin: 0;
        color: #c9d3dd;
        line-height: 1.75;
    }

        .mentor-section p + p[b-gegy9nast3] {
            margin-top: 13px;
        }


/* =========================================================
   FORMAL RESPONSIBILITIES
========================================================= */

.formal-responsibilities ul[b-gegy9nast3] {
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    list-style: none;
}

.formal-responsibilities li[b-gegy9nast3] {
    padding: 9px 13px;
    color: #c9d6e2;
    font-size: 0.84rem;
    border: 1px solid rgba(100, 181, 246, 0.2);
    border-radius: 5px;
    background: rgba(4, 22, 41, 0.45);
}


/* =========================================================
   RECOGNITION
========================================================= */

.recognition-card[b-gegy9nast3] {
    margin: 34px 40px 5px;
    padding: 27px 30px;
    display: flex;
    align-items: flex-start;
    gap: 22px;
    background: linear-gradient( 120deg, rgba(212, 175, 55, 0.13), rgba(212, 175, 55, 0.035) );
    border: 1px solid rgba(212, 175, 55, 0.35);
    border-radius: 10px;
}

.recognition-icon[b-gegy9nast3] {
    flex-shrink: 0;
    width: 49px;
    height: 49px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #071525;
    background: #d4af37;
    border-radius: 50%;
    font-size: 1.35rem;
}

.recognition-label[b-gegy9nast3] {
    margin: 0 0 7px;
    color: #d4af37;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12rem;
}

.recognition-card h3[b-gegy9nast3] {
    margin: 0 0 9px;
    color: #ffffff;
    font-size: 1.22rem;
}

.recognition-card p:last-child[b-gegy9nast3] {
    margin: 0;
    color: #becad5;
    line-height: 1.65;
}


/* =========================================================
   COMPETENCIES
========================================================= */

.competency-list[b-gegy9nast3] {
    padding: 31px 40px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

    .competency-list span[b-gegy9nast3] {
        padding: 8px 12px;
        color: #a9d6ff;
        font-size: 0.78rem;
        font-weight: 700;
        border: 1px solid rgba(100, 181, 246, 0.25);
        border-radius: 999px;
        background: rgba(45, 149, 243, 0.08);
    }


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

.experience-links[b-gegy9nast3] {
    margin-top: 34px;
    padding: 28px 40px 37px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 25px;
    background: rgba(2, 16, 31, 0.3);
    border-top: 1px solid rgba(100, 181, 246, 0.13);
}

.text-link[b-gegy9nast3] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #9dcfff;
    font-weight: 700;
    text-decoration: none;
}

    .text-link:hover[b-gegy9nast3] {
        color: #ffffff;
    }

    .text-link span[b-gegy9nast3] {
        transition: transform 180ms ease;
    }

    .text-link:hover span[b-gegy9nast3] {
        transform: translateX(4px);
    }


/* =========================================================
   FOOTER CTA
========================================================= */

.experience-footer-cta[b-gegy9nast3] {
    padding: 80px 0;
    color: #ffffff;
    background: radial-gradient( circle at 80% 40%, rgba(45, 149, 243, 0.18), transparent 30% ), #0a2037;
    border-top: 1px solid rgba(100, 181, 246, 0.14);
}

.cta-content[b-gegy9nast3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
}

    .cta-content > div[b-gegy9nast3] {
        max-width: 820px;
    }

    .cta-content h2[b-gegy9nast3] {
        margin: 0;
        font-size: clamp(1.8rem, 3.5vw, 2.8rem);
        line-height: 1.2;
    }

    .cta-content p:last-child[b-gegy9nast3] {
        margin: 18px 0 0;
        color: #aebdca;
        line-height: 1.7;
    }

    .cta-content > a[b-gegy9nast3] {
        flex-shrink: 0;
    }


/* =========================================================
   DOCUMENT NOTE
========================================================= */

.document-note[b-gegy9nast3] {
    padding: 24px 0;
    color: #788da1;
    background: #041120;
    border-top: 1px solid rgba(100, 181, 246, 0.1);
}

    .document-note p[b-gegy9nast3] {
        max-width: 1100px;
        margin: 0 auto;
        font-size: 0.74rem;
        line-height: 1.65;
        text-align: center;
    }


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {

    .timeline[b-gegy9nast3]::before,
    .timeline-marker[b-gegy9nast3] {
        display: none;
    }

    .timeline-entry[b-gegy9nast3] {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .timeline-period[b-gegy9nast3] {
        padding: 0;
        text-align: left;
    }

        .timeline-period strong[b-gegy9nast3],
        .timeline-period span[b-gegy9nast3] {
            display: inline;
        }

        .timeline-period span[b-gegy9nast3] {
            margin-left: 10px;
        }

    .systems-content[b-gegy9nast3] {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   SMALL TABLET
========================================================= */

@media (max-width: 800px) {

    .experience-navigation[b-gegy9nast3] {
        position: static;
    }

    .experience-navigation-content[b-gegy9nast3] {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }

    .experience-navigation a[b-gegy9nast3] {
        min-width: 0;
        padding-inline: 10px;
    }

    .experience-summary[b-gegy9nast3] {
        grid-template-columns: 1fr;
    }

        .experience-summary article[b-gegy9nast3] {
            min-height: 105px;
            border-right: none;
            border-bottom: 1px solid rgba(100, 181, 246, 0.2);
        }

            .experience-summary article:last-child[b-gegy9nast3] {
                border-bottom: none;
            }

    .responsibilities-grid[b-gegy9nast3] {
        grid-template-columns: 1fr;
    }

    .experience-header[b-gegy9nast3] {
        flex-direction: column;
    }

    .cta-content[b-gegy9nast3] {
        align-items: flex-start;
        flex-direction: column;
    }

    .statistics-content[b-gegy9nast3] {
        padding: 28px 32px 32px;
    }

        .statistics-content .experience-description[b-gegy9nast3] {
            max-width: 100%;
        }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .experience-hero[b-gegy9nast3] {
        padding: 75px 0 65px;
    }

        .experience-hero h1[b-gegy9nast3] {
            letter-spacing: -0.08rem;
        }

    .experience-navigation-content[b-gegy9nast3] {
        grid-template-columns: 1fr;
    }

    .experience-navigation a[b-gegy9nast3] {
        min-height: 59px;
        border-right: none;
        border-left: none !important;
        border-bottom: 1px solid rgba(100, 181, 246, 0.12);
    }

    .experience-page[b-gegy9nast3] {
        padding: 70px 0;
    }

    .experience-header[b-gegy9nast3],
    .experience-introduction[b-gegy9nast3],
    .responsibilities-section[b-gegy9nast3],
    .systems-section[b-gegy9nast3],
    .formal-responsibilities[b-gegy9nast3] {
        padding-right: 22px;
        padding-left: 22px;
    }

    .mentor-section[b-gegy9nast3],
    .recognition-card[b-gegy9nast3] {
        margin-right: 22px;
        margin-left: 22px;
    }

    .mentor-section[b-gegy9nast3] {
        padding: 23px;
    }

    .recognition-card[b-gegy9nast3] {
        padding: 23px;
        flex-direction: column;
    }

    .competency-list[b-gegy9nast3] {
        padding-right: 22px;
        padding-left: 22px;
    }

    .experience-links[b-gegy9nast3] {
        padding-right: 22px;
        padding-left: 22px;
        align-items: stretch;
        flex-direction: column;
    }

        .experience-links .portfolio-button[b-gegy9nast3] {
            width: 100%;
        }

    .text-link[b-gegy9nast3] {
        justify-content: center;
    }

    .experience-introduction[b-gegy9nast3] {
        padding: 25px 22px 30px;
    }

        .experience-introduction p[b-gegy9nast3] {
            max-width: 100%;
            text-align: left;
        }

    .statistics-content[b-gegy9nast3] {
        padding: 24px 22px 28px;
    }

        .statistics-content .experience-description[b-gegy9nast3] {
            max-width: 100%;
            font-size: 0.95rem;
            line-height: 1.7;
            text-align: left;
        }
}
/* /Components/Pages/Home/Gallery.razor.rz.scp.css */
.gallery-page[b-b2bfr3qnzy] {
    min-height: 100vh;
    padding: 7rem 1.25rem 5rem;
    background: radial-gradient( circle at top right, rgba(212, 175, 55, 0.08), transparent 32rem ), #0f172a;
    color: #f8fafc;
}

.gallery-container[b-b2bfr3qnzy] {
    width: min(1400px, 100%);
    margin: 0 auto;
}

.gallery-header[b-b2bfr3qnzy] {
    max-width: 850px;
    margin-bottom: 2.5rem;
}

.gallery-eyebrow[b-b2bfr3qnzy] {
    display: inline-block;
    margin-bottom: 0.85rem;
    color: #d4af37;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.18em;
}

.gallery-header h1[b-b2bfr3qnzy] {
    margin: 0 0 1rem;
    color: #f8fafc;
    font-size: clamp(2rem, 5vw, 3.7rem);
    font-weight: 700;
    line-height: 1.12;
}

.gallery-header p[b-b2bfr3qnzy] {
    max-width: 760px;
    margin: 0;
    color: #cbd5e1;
    font-size: 1.05rem;
    line-height: 1.8;
}

.gallery-filters[b-b2bfr3qnzy] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.gallery-filter[b-b2bfr3qnzy] {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.75rem 1.1rem;
    border: 1px solid rgba(148, 163, 184, 0.25);
    border-radius: 999px;
    background: #1e293b;
    color: #cbd5e1;
    font: inherit;
    font-size: 0.92rem;
    font-weight: 600;
    cursor: pointer;
    transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease, color 180ms ease;
}

    .gallery-filter span[b-b2bfr3qnzy] {
        display: grid;
        min-width: 1.7rem;
        height: 1.7rem;
        padding: 0 0.35rem;
        place-items: center;
        border-radius: 999px;
        background: rgba(15, 23, 42, 0.85);
        color: #94a3b8;
        font-size: 0.75rem;
    }

    .gallery-filter:hover[b-b2bfr3qnzy] {
        transform: translateY(-2px);
        border-color: rgba(212, 175, 55, 0.65);
        color: #ffffff;
    }

    .gallery-filter.active[b-b2bfr3qnzy] {
        border-color: #d4af37;
        background: #d4af37;
        color: #0f172a;
    }

        .gallery-filter.active span[b-b2bfr3qnzy] {
            background: #0f172a;
            color: #f8fafc;
        }

.gallery-status[b-b2bfr3qnzy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
    color: #94a3b8;
    font-size: 0.9rem;
}

    .gallery-status p[b-b2bfr3qnzy] {
        margin: 0;
    }

    .gallery-status strong[b-b2bfr3qnzy] {
        color: #d4af37;
    }

.gallery-grid[b-b2bfr3qnzy] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.gallery-card[b-b2bfr3qnzy] {
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 1rem;
    background: #1e293b;
    box-shadow: 0 18px 45px rgba(2, 6, 23, 0.22);
    transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

    .gallery-card:hover[b-b2bfr3qnzy] {
        transform: translateY(-6px);
        border-color: rgba(212, 175, 55, 0.55);
        box-shadow: 0 24px 55px rgba(2, 6, 23, 0.42);
    }

.gallery-image-wrapper[b-b2bfr3qnzy] {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    background: #020617;
}

    .gallery-image-wrapper img[b-b2bfr3qnzy] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        transition: transform 350ms ease;
    }

.gallery-card:hover .gallery-image-wrapper img[b-b2bfr3qnzy] {
    transform: scale(1.025);
}

.gallery-category[b-b2bfr3qnzy] {
    position: absolute;
    left: 0.85rem;
    bottom: 0.85rem;
    padding: 0.4rem 0.7rem;
    border: 1px solid rgba(212, 175, 55, 0.45);
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.9);
    color: #d4af37;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    backdrop-filter: blur(8px);
}

.gallery-card-content[b-b2bfr3qnzy] {
    padding: 1.25rem;
}

    .gallery-card-content h2[b-b2bfr3qnzy] {
        margin: 0 0 0.75rem;
        color: #f8fafc;
        font-size: 1.12rem;
        font-weight: 650;
        line-height: 1.4;
    }

    .gallery-card-content p[b-b2bfr3qnzy] {
        margin: 0;
        color: #94a3b8;
        font-size: 0.92rem;
        line-height: 1.7;
    }

.gallery-note[b-b2bfr3qnzy] {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    margin-top: 2.5rem;
    padding: 1rem 1.2rem;
    border-left: 3px solid #d4af37;
    border-radius: 0.35rem;
    background: rgba(30, 41, 59, 0.55);
    color: #94a3b8;
    font-size: 0.8rem;
    line-height: 1.65;
}

    .gallery-note span[b-b2bfr3qnzy] {
        color: #d4af37;
        font-size: 1rem;
    }

    .gallery-note p[b-b2bfr3qnzy] {
        margin: 0;
    }

@media (max-width: 1050px) {
    .gallery-grid[b-b2bfr3qnzy] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .gallery-page[b-b2bfr3qnzy] {
        padding: 5.5rem 1rem 3rem;
    }

    .gallery-grid[b-b2bfr3qnzy] {
        grid-template-columns: 1fr;
    }

    .gallery-status[b-b2bfr3qnzy] {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.25rem;
    }

    .gallery-filter[b-b2bfr3qnzy] {
        flex: 1 1 calc(50% - 0.75rem);
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gallery-card[b-b2bfr3qnzy],
    .gallery-filter[b-b2bfr3qnzy],
    .gallery-image-wrapper img[b-b2bfr3qnzy] {
        transition: none;
    }
}
/* /Components/Pages/Home/Home.razor.rz.scp.css */
/* =========================================================
   HERO
========================================================= */

.hero-section[b-6wy0u4ghr7] {
    position: relative;
    overflow: hidden;
    color: #ffffff;
    background: radial-gradient( circle at 20% 32%, rgba(45, 149, 243, 0.30), transparent 36% ), linear-gradient( 120deg, #041120 0%, #082445 52%, #0b3158 100% );
}

    .hero-section[b-6wy0u4ghr7]::before {
        content: "";
        position: absolute;
        inset: 0;
        opacity: 0.22;
        pointer-events: none;
        background-image: linear-gradient( rgba(100, 181, 246, 0.08) 1px, transparent 1px ), linear-gradient( 90deg, rgba(100, 181, 246, 0.08) 1px, transparent 1px );
        background-size: 70px 70px;
    }


/* =========================================================
   HERO RASPORED
========================================================= */

.hero-container[b-6wy0u4ghr7] {
    position: relative;
    z-index: 1;
    min-height: 720px;
    display: grid;
    grid-template-columns: 46% 54%;
    align-items: center;
    gap: 55px;
}


/* =========================================================
   LIJEVA STRANA - FOTOGRAFIJA
========================================================= */

.hero-photo-area[b-6wy0u4ghr7] {
    position: relative;
    min-height: 650px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: visible;
}

.hero-photo-glow[b-6wy0u4ghr7] {
    position: absolute;
    z-index: 1;
    width: 500px;
    height: 500px;
    left: -30px;
    bottom: 45px;
    border-radius: 50%;
    background: rgba(45, 149, 243, 0.22);
    filter: blur(70px);
    pointer-events: none;
}

.hero-photo[b-6wy0u4ghr7] {
    position: relative;
    z-index: 2;
    display: block;
    width: auto;
    height: 650px;
    max-width: none;
    object-fit: contain;
    object-position: center bottom;
    transform: translateY(16px) scale(1.02);
    transform-origin: center bottom;
    filter: drop-shadow( 0 28px 42px rgba(0, 0, 0, 0.42) );
    transition: transform 300ms ease, filter 300ms ease;
}

.hero-photo-area:hover .hero-photo[b-6wy0u4ghr7] {
    transform: translateY(12px) scale(1.06);
    filter: drop-shadow( 0 34px 52px rgba(0, 0, 0, 0.48) );
}


/* =========================================================
   DESNA STRANA - TEKST
========================================================= */

.hero-content[b-6wy0u4ghr7] {
    padding: 90px 0 85px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.hero-label[b-6wy0u4ghr7] {
    margin: 0 0 18px;
    color: #64b5f6;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.18rem;
}

.hero-content h1[b-6wy0u4ghr7] {
    margin: 0;
    color: #ffffff;
    font-size: clamp(3.4rem, 5.6vw, 5.8rem);
    font-weight: 600;
    line-height: 1.05;
    letter-spacing: -0.20rem;
}

.hero-content h2[b-6wy0u4ghr7] {
    max-width: 720px;
    margin: 27px 0 0;
    color: #d9e7f5;
    font-size: clamp(1.35rem, 2.4vw, 2rem);
    font-weight: 400;
    line-height: 1.4;
}

.hero-fields[b-6wy0u4ghr7] {
    margin: 22px 0 0;
    color: #8dc8fb;
    font-size: 0.96rem;
    font-weight: 700;
}

    .hero-fields span[b-6wy0u4ghr7] {
        margin-inline: 8px;
        color: #2d95f3;
    }

.hero-description[b-6wy0u4ghr7] {
    max-width: 760px;
    margin: 25px 0 0;
    color: #cbd7e4;
    font-size: 1.05rem;
    line-height: 1.75;
}

.hero-description-secondary[b-6wy0u4ghr7] {
    margin-top: 14px;
    color: #aebdcb;
}

.hero-actions[b-6wy0u4ghr7] {
    margin-top: 34px;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.hero-contact[b-6wy0u4ghr7] {
    margin-top: 31px;
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    color: #9fb0c2;
    font-size: 0.88rem;
}

    .hero-contact a[b-6wy0u4ghr7] {
        color: #cbd7e4;
        text-decoration: none;
    }

        .hero-contact a:hover[b-6wy0u4ghr7] {
            color: #64b5f6;
        }


/* =========================================================
   STATISTIKA
========================================================= */

.statistics-section[b-6wy0u4ghr7] {
    position: relative;
    z-index: 4;
    margin-top: -42px;
    padding-bottom: 30px;
    background: #071525;
    color: #e2e8f0;
}

.statistics-grid[b-6wy0u4ghr7] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    overflow: hidden;
    background: #082445;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(5, 25, 45, 0.18);
    color: #e2e8f0;
}

    .statistics-grid article[b-6wy0u4ghr7] {
        min-height: 145px;
        padding: 28px 25px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        border-right: 1px solid rgba(226, 232, 240, 0.22);
    }

        .statistics-grid article:last-child[b-6wy0u4ghr7] {
            border-right: none;
        }

    .statistics-grid strong[b-6wy0u4ghr7] {
        color: #ffffff;
        font-size: 2.4rem;
        line-height: 1;
    }

    .statistics-grid span[b-6wy0u4ghr7] {
        margin-top: 11px;
        color: #8fa5b9;
        line-height: 1.4;
    }


/* =========================================================
   OBLASTI STRUČNOG ISKUSTVA
========================================================= */

.expertise-section[b-6wy0u4ghr7] {
    padding: 80px 0 95px;
    color: #ffffff;
    background: #071525;
}

.expertise-grid[b-6wy0u4ghr7] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.expertise-card[b-6wy0u4ghr7] {
    min-height: 250px;
    padding: 32px 29px;
    background: linear-gradient( 145deg, rgba(23, 63, 104, 0.78), rgba(10, 36, 65, 0.96) );
    border: 1px solid rgba(100, 181, 246, 0.25);
    border-radius: 12px;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

    .expertise-card:hover[b-6wy0u4ghr7] {
        transform: translateY(-5px);
        border-color: rgba(100, 181, 246, 0.75);
        box-shadow: 0 20px 45px rgba(0, 0, 0, 0.22);
    }

.card-number[b-6wy0u4ghr7] {
    color: #64b5f6;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.12rem;
}

.expertise-card h3[b-6wy0u4ghr7] {
    margin: 25px 0 13px;
    color: #ffffff;
    font-size: 1.25rem;
}

.expertise-card p[b-6wy0u4ghr7] {
    margin: 0;
    color: #b7c5d3;
    line-height: 1.7;
}


/* =========================================================
   PROFESIONALNI PUT
========================================================= */

.journey-section[b-6wy0u4ghr7] {
    padding: 85px 0;
    color: #ffffff;
    background: #0a2037;
}

.journey-image[b-6wy0u4ghr7] {
    overflow: hidden;
    background: #071525;
    border: 1px solid rgba(212, 175, 55, 0.45);
    border-radius: 12px;
    box-shadow: 0 24px 65px rgba(0, 0, 0, 0.3);
}

    .journey-image img[b-6wy0u4ghr7] {
        display: block;
        width: 100%;
        height: auto;
    }


/* =========================================================
   PROFESIONALNO ISKUSTVO
========================================================= */

.experience-preview[b-6wy0u4ghr7] {
    padding: 85px 0;
    color: #ffffff;
    background: #071525;
}

.experience-grid[b-6wy0u4ghr7] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.experience-card[b-6wy0u4ghr7] {
    min-height: 245px;
    padding: 30px;
    background: linear-gradient( 145deg, rgba(23, 63, 104, 0.72), rgba(10, 36, 65, 0.96) );
    border: 1px solid rgba(100, 181, 246, 0.25);
    border-radius: 12px;
}

.experience-period[b-6wy0u4ghr7] {
    margin: 0 0 15px;
    color: #64b5f6;
    font-weight: 800;
    letter-spacing: 0.05rem;
}

.experience-card h3[b-6wy0u4ghr7] {
    margin: 0 0 14px;
    color: #ffffff;
    font-size: 1.35rem;
}

.experience-card p:last-child[b-6wy0u4ghr7] {
    margin: 0;
    color: #b7c5d3;
    line-height: 1.7;
}

.experience-action[b-6wy0u4ghr7] {
    margin-top: 34px;
    text-align: center;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .hero-container[b-6wy0u4ghr7] {
        grid-template-columns: minmax(360px, 0.85fr) minmax(0, 1.15fr);
        gap: 35px;
    }

    .hero-photo[b-6wy0u4ghr7] {
        height: 600px;
    }

    .hero-photo-glow[b-6wy0u4ghr7] {
        width: 440px;
        height: 440px;
    }
}


/* =========================================================
   MANJI TABLET
========================================================= */

@media (max-width: 1000px) {

    .hero-container[b-6wy0u4ghr7] {
        min-height: auto;
        grid-template-columns: 1fr;
        gap: 0;
    }

    .hero-content[b-6wy0u4ghr7] {
        order: 1;
        padding: 75px 0 25px;
        text-align: center;
    }

    .hero-photo-area[b-6wy0u4ghr7] {
        order: 2;
        min-height: 500px;
    }

    .hero-photo[b-6wy0u4ghr7] {
        height: 500px;
        max-width: 100%;
        transform: translateY(10px) scale(1.02);
    }

    .hero-photo-area:hover .hero-photo[b-6wy0u4ghr7] {
        transform: translateY(10px) scale(1.04);
    }

    .hero-photo-glow[b-6wy0u4ghr7] {
        width: 400px;
        height: 400px;
        left: 50%;
        bottom: 30px;
        transform: translateX(-50%);
        filter: blur(60px);
    }

    .hero-description[b-6wy0u4ghr7] {
        margin-inline: auto;
    }

    .hero-actions[b-6wy0u4ghr7],
    .hero-contact[b-6wy0u4ghr7] {
        justify-content: center;
    }

    .statistics-grid[b-6wy0u4ghr7] {
        grid-template-columns: repeat(2, 1fr);
    }

        .statistics-grid article:nth-child(2)[b-6wy0u4ghr7] {
            border-right: none;
        }

        .statistics-grid article:nth-child(-n + 2)[b-6wy0u4ghr7] {
            border-bottom: 1px solid rgba(226, 232, 240, 0.22);
        }

    .expertise-grid[b-6wy0u4ghr7] {
        grid-template-columns: repeat(2, 1fr);
    }

    .experience-grid[b-6wy0u4ghr7] {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   MOBITEL
========================================================= */

@media (max-width: 650px) {

    .hero-container[b-6wy0u4ghr7] {
        min-height: auto;
    }

    .hero-content[b-6wy0u4ghr7] {
        padding-top: 60px;
    }

        .hero-content h1[b-6wy0u4ghr7] {
            font-size: clamp(2.8rem, 14vw, 4.2rem);
            letter-spacing: -0.08rem;
        }

        .hero-content h2[b-6wy0u4ghr7] {
            font-size: 1.22rem;
        }

    .hero-label[b-6wy0u4ghr7] {
        font-size: 0.74rem;
        line-height: 1.5;
        letter-spacing: 0.12rem;
    }

    .hero-description[b-6wy0u4ghr7] {
        font-size: 0.97rem;
        line-height: 1.7;
    }

    .hero-fields[b-6wy0u4ghr7] {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }

        .hero-fields span[b-6wy0u4ghr7] {
            display: none;
        }

    .hero-actions[b-6wy0u4ghr7] {
        flex-direction: column;
    }

        .hero-actions .portfolio-button[b-6wy0u4ghr7] {
            width: 100%;
            text-align: center;
        }

    .hero-contact[b-6wy0u4ghr7] {
        align-items: center;
        flex-direction: column;
        gap: 10px;
    }

    .hero-photo-area[b-6wy0u4ghr7] {
        min-height: 420px;
    }

    .hero-photo[b-6wy0u4ghr7] {
        height: 420px;
        max-width: 110%;
        transform: translateY(8px) scale(1.02);
    }

    .hero-photo-area:hover .hero-photo[b-6wy0u4ghr7] {
        transform: translateY(8px) scale(1.02);
    }

    .hero-photo-glow[b-6wy0u4ghr7] {
        width: 320px;
        height: 320px;
        bottom: 25px;
        filter: blur(50px);
    }

    .statistics-section[b-6wy0u4ghr7] {
        margin-top: -20px;
    }

    .statistics-grid[b-6wy0u4ghr7] {
        grid-template-columns: 1fr;
    }

        .statistics-grid article[b-6wy0u4ghr7] {
            border-right: none;
            border-bottom: 1px solid rgba(226, 232, 240, 0.22);
        }

            .statistics-grid article:last-child[b-6wy0u4ghr7] {
                border-bottom: none;
            }

    .expertise-grid[b-6wy0u4ghr7] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Home/Professional-development.razor.rz.scp.css */
.professional-development-page[b-7kimk5dlm3] {
    --page-bg: #07111f;
    --page-bg-soft: #0b1728;
    --surface: rgba(13, 28, 47, 0.82);
    --surface-strong: #10213a;
    --surface-muted: rgba(255, 255, 255, 0.035);
    --border: rgba(148, 180, 214, 0.16);
    --border-strong: rgba(82, 189, 255, 0.28);
    --text: #f3f7fb;
    --text-soft: #c5d2df;
    --text-muted: #8fa3b8;
    --accent: #45bff3;
    --accent-strong: #1d91d0;
    --accent-soft: rgba(69, 191, 243, 0.14);
    --success: #62d6aa;
    --shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    color: var(--text);
    background: radial-gradient(circle at 10% 8%, rgba(27, 125, 183, 0.16), transparent 26rem), radial-gradient(circle at 92% 28%, rgba(39, 175, 220, 0.09), transparent 30rem), linear-gradient(180deg, #06101d 0%, var(--page-bg) 50%, #081321 100%);
}

.page-shell[b-7kimk5dlm3] {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
}

.hero-section[b-7kimk5dlm3] {
    position: relative;
    isolation: isolate;
    padding: 132px 0 104px;
    border-bottom: 1px solid var(--border);
}

    .hero-section[b-7kimk5dlm3]::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -3;
        background: linear-gradient(rgba(255, 255, 255, 0.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px);
        background-size: 42px 42px;
        mask-image: linear-gradient(to bottom, black, transparent 88%);
    }

.hero-content[b-7kimk5dlm3] {
    position: relative;
    z-index: 2;
    max-width: 920px;
}

.hero-glow[b-7kimk5dlm3] {
    position: absolute;
    z-index: -2;
    border-radius: 999px;
    filter: blur(10px);
    pointer-events: none;
}

.hero-glow-one[b-7kimk5dlm3] {
    top: -170px;
    left: -160px;
    width: 510px;
    height: 510px;
    background: radial-gradient(circle, rgba(69, 191, 243, 0.18), transparent 68%);
}

.hero-glow-two[b-7kimk5dlm3] {
    right: -130px;
    bottom: -230px;
    width: 560px;
    height: 560px;
    background: radial-gradient(circle, rgba(41, 115, 182, 0.16), transparent 68%);
}

.eyebrow[b-7kimk5dlm3],
.section-kicker[b-7kimk5dlm3] {
    margin: 0 0 14px;
    color: var(--accent);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

.hero-section h1[b-7kimk5dlm3] {
    max-width: 890px;
    margin: 0;
    font-size: clamp(3rem, 7vw, 6.3rem);
    font-weight: 650;
    line-height: 0.98;
    letter-spacing: -0.055em;
    text-wrap: balance;
}

.hero-lead[b-7kimk5dlm3] {
    max-width: 790px;
    margin: 30px 0 0;
    color: var(--text-soft);
    font-size: clamp(1.05rem, 2vw, 1.28rem);
    line-height: 1.8;
}

.hero-highlights[b-7kimk5dlm3] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 36px;
}

    .hero-highlights span[b-7kimk5dlm3] {
        padding: 10px 15px;
        border: 1px solid var(--border-strong);
        border-radius: 999px;
        color: #dff5ff;
        background: var(--accent-soft);
        font-size: 0.88rem;
        font-weight: 700;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025);
    }

.content-section[b-7kimk5dlm3] {
    padding: 96px 0;
}

.section-muted[b-7kimk5dlm3] {
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.006));
}

.section-heading[b-7kimk5dlm3] {
    max-width: 790px;
    margin-bottom: 48px;
}

    .section-heading h2[b-7kimk5dlm3],
    .digital-copy h2[b-7kimk5dlm3],
    .application-card h2[b-7kimk5dlm3],
    .verification-card h2[b-7kimk5dlm3] {
        margin: 0;
        font-size: clamp(2rem, 4vw, 3.4rem);
        line-height: 1.08;
        letter-spacing: -0.035em;
    }

    .section-heading > p:last-child[b-7kimk5dlm3],
    .digital-copy > p[b-7kimk5dlm3],
    .application-copy p[b-7kimk5dlm3],
    .verification-card p[b-7kimk5dlm3] {
        color: var(--text-soft);
        line-height: 1.82;
    }

    .section-heading > p:last-child[b-7kimk5dlm3] {
        margin: 20px 0 0;
        font-size: 1.02rem;
    }

.development-grid[b-7kimk5dlm3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.development-card[b-7kimk5dlm3],
.expertise-card[b-7kimk5dlm3],
.digital-panel[b-7kimk5dlm3],
.application-card[b-7kimk5dlm3],
.verification-card[b-7kimk5dlm3] {
    border: 1px solid var(--border);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.042), rgba(255, 255, 255, 0.012)), var(--surface);
    box-shadow: var(--shadow);
    backdrop-filter: blur(16px);
}

.development-card[b-7kimk5dlm3] {
    position: relative;
    min-height: 265px;
    padding: 30px;
    border-radius: 24px;
    overflow: hidden;
}

    .development-card[b-7kimk5dlm3]::after {
        content: "";
        position: absolute;
        right: -55px;
        bottom: -65px;
        width: 150px;
        height: 150px;
        border-radius: 999px;
        background: radial-gradient(circle, rgba(69, 191, 243, 0.13), transparent 70%);
    }

.card-number[b-7kimk5dlm3] {
    margin-bottom: 50px;
    color: var(--accent);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.15em;
}

.development-card h3[b-7kimk5dlm3],
.expertise-card h3[b-7kimk5dlm3] {
    margin: 0;
    font-size: 1.22rem;
}

.development-card p[b-7kimk5dlm3],
.expertise-card p[b-7kimk5dlm3] {
    margin: 15px 0 0;
    color: var(--text-muted);
    line-height: 1.72;
}

.expertise-grid[b-7kimk5dlm3] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.expertise-card[b-7kimk5dlm3] {
    min-height: 235px;
    padding: 24px;
    border-radius: 20px;
    transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

    .expertise-card:hover[b-7kimk5dlm3] {
        transform: translateY(-5px);
        border-color: var(--border-strong);
        background-color: rgba(15, 36, 59, 0.92);
    }

.expertise-icon[b-7kimk5dlm3] {
    display: grid;
    width: 48px;
    height: 48px;
    margin-bottom: 24px;
    place-items: center;
    border: 1px solid var(--border-strong);
    border-radius: 14px;
    color: var(--accent);
    background: var(--accent-soft);
    font-size: 1.18rem;
}

.digital-section[b-7kimk5dlm3] {
    position: relative;
}

    .digital-section[b-7kimk5dlm3]::before {
        content: "";
        position: absolute;
        top: 90px;
        left: 0;
        width: 38%;
        height: 520px;
        background: radial-gradient(circle at left, rgba(43, 147, 202, 0.09), transparent 68%);
        pointer-events: none;
    }

.digital-layout[b-7kimk5dlm3] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(340px, 0.8fr);
    gap: 52px;
    align-items: start;
}

.digital-copy > p[b-7kimk5dlm3] {
    margin: 20px 0 0;
}

.digital-copy strong[b-7kimk5dlm3] {
    color: #ffffff;
}

.digital-panel[b-7kimk5dlm3] {
    position: sticky;
    top: 100px;
    padding: 30px;
    border-color: var(--border-strong);
    border-radius: 26px;
}

.panel-label[b-7kimk5dlm3] {
    display: inline-flex;
    margin-bottom: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    color: var(--accent);
    background: var(--accent-soft);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.digital-panel ul[b-7kimk5dlm3] {
    display: grid;
    gap: 0;
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
}

.digital-panel li[b-7kimk5dlm3] {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 14px;
    padding: 20px 0;
    border-bottom: 1px solid var(--border);
}

    .digital-panel li:last-child[b-7kimk5dlm3] {
        border-bottom: 0;
        padding-bottom: 0;
    }

.checkmark[b-7kimk5dlm3] {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 999px;
    color: #062017;
    background: var(--success);
    font-size: 0.85rem;
    font-weight: 900;
}

.digital-panel strong[b-7kimk5dlm3] {
    display: block;
    color: var(--text);
    font-size: 0.98rem;
}

.digital-panel p[b-7kimk5dlm3] {
    margin: 7px 0 0;
    color: var(--text-muted);
    font-size: 0.9rem;
    line-height: 1.6;
}

.technology-strip[b-7kimk5dlm3] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 58px;
    border: 1px solid var(--border);
    border-radius: 24px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.022);
}

    .technology-strip > div[b-7kimk5dlm3] {
        min-height: 170px;
        padding: 25px;
        border-right: 1px solid var(--border);
    }

        .technology-strip > div:last-child[b-7kimk5dlm3] {
            border-right: 0;
        }

.technology-year[b-7kimk5dlm3] {
    display: block;
    margin-bottom: 28px;
    color: var(--accent);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.technology-strip strong[b-7kimk5dlm3],
.technology-strip small[b-7kimk5dlm3] {
    display: block;
}

.technology-strip strong[b-7kimk5dlm3] {
    color: var(--text);
    font-size: 1rem;
}

.technology-strip small[b-7kimk5dlm3] {
    margin-top: 8px;
    color: var(--text-muted);
    font-size: 0.86rem;
    line-height: 1.55;
}

.application-card[b-7kimk5dlm3] {
    display: grid;
    grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
    gap: 54px;
    padding: 46px;
    border-radius: 28px;
}

.application-copy p[b-7kimk5dlm3] {
    margin: 0;
}

    .application-copy p + p[b-7kimk5dlm3] {
        margin-top: 18px;
    }

.verification-section[b-7kimk5dlm3] {
    padding: 20px 0 110px;
}

.verification-card[b-7kimk5dlm3] {
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 28px;
    padding: 42px;
    border-color: rgba(98, 214, 170, 0.26);
    border-radius: 28px;
    background: linear-gradient(145deg, rgba(98, 214, 170, 0.075), rgba(255, 255, 255, 0.012)), var(--surface);
}

.verification-badge[b-7kimk5dlm3] {
    display: grid;
    width: 62px;
    height: 62px;
    place-items: center;
    border: 1px solid rgba(98, 214, 170, 0.35);
    border-radius: 20px;
    color: #062017;
    background: var(--success);
    font-size: 1.5rem;
    font-weight: 900;
    box-shadow: 0 14px 34px rgba(98, 214, 170, 0.15);
}

.verification-card p[b-7kimk5dlm3] {
    max-width: 880px;
    margin: 18px 0 0;
}

@media (max-width: 1050px) {
    .expertise-grid[b-7kimk5dlm3] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .digital-layout[b-7kimk5dlm3] {
        grid-template-columns: 1fr;
    }

    .digital-panel[b-7kimk5dlm3] {
        position: static;
    }

    .technology-strip[b-7kimk5dlm3] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

        .technology-strip > div:nth-child(2)[b-7kimk5dlm3] {
            border-right: 0;
        }

        .technology-strip > div:nth-child(-n + 2)[b-7kimk5dlm3] {
            border-bottom: 1px solid var(--border);
        }
}

@media (max-width: 820px) {
    .hero-section[b-7kimk5dlm3] {
        padding: 105px 0 78px;
    }

    .content-section[b-7kimk5dlm3] {
        padding: 78px 0;
    }

    .development-grid[b-7kimk5dlm3] {
        grid-template-columns: 1fr;
    }

    .development-card[b-7kimk5dlm3] {
        min-height: auto;
    }

    .card-number[b-7kimk5dlm3] {
        margin-bottom: 32px;
    }

    .expertise-grid[b-7kimk5dlm3] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .application-card[b-7kimk5dlm3] {
        grid-template-columns: 1fr;
        gap: 26px;
        padding: 34px;
    }
}

@media (max-width: 580px) {
    .page-shell[b-7kimk5dlm3] {
        width: min(100% - 26px, 1180px);
    }

    .hero-section[b-7kimk5dlm3] {
        padding: 92px 0 68px;
    }

        .hero-section h1[b-7kimk5dlm3] {
            font-size: clamp(2.55rem, 14vw, 4rem);
        }

    .hero-lead[b-7kimk5dlm3] {
        font-size: 1rem;
        line-height: 1.72;
    }

    .hero-highlights[b-7kimk5dlm3] {
        gap: 9px;
    }

        .hero-highlights span[b-7kimk5dlm3] {
            padding: 9px 12px;
            font-size: 0.8rem;
        }

    .content-section[b-7kimk5dlm3] {
        padding: 65px 0;
    }

    .section-heading[b-7kimk5dlm3] {
        margin-bottom: 34px;
    }

    .expertise-grid[b-7kimk5dlm3] {
        grid-template-columns: 1fr;
    }

    .expertise-card[b-7kimk5dlm3] {
        min-height: auto;
    }

    .digital-layout[b-7kimk5dlm3] {
        gap: 34px;
    }

    .digital-panel[b-7kimk5dlm3] {
        padding: 23px;
        border-radius: 22px;
    }

    .technology-strip[b-7kimk5dlm3] {
        grid-template-columns: 1fr;
        border-radius: 20px;
    }

        .technology-strip > div[b-7kimk5dlm3],
        .technology-strip > div:nth-child(2)[b-7kimk5dlm3] {
            border-right: 0;
            border-bottom: 1px solid var(--border);
        }

            .technology-strip > div:last-child[b-7kimk5dlm3] {
                border-bottom: 0;
            }

    .application-card[b-7kimk5dlm3] {
        padding: 27px;
        border-radius: 22px;
    }

    .verification-section[b-7kimk5dlm3] {
        padding-bottom: 75px;
    }

    .verification-card[b-7kimk5dlm3] {
        grid-template-columns: 1fr;
        padding: 27px;
        border-radius: 22px;
    }

    .verification-badge[b-7kimk5dlm3] {
        width: 54px;
        height: 54px;
        border-radius: 17px;
    }
}

@media (prefers-reduced-motion: no-preference) {
    .hero-content[b-7kimk5dlm3],
    .section-heading[b-7kimk5dlm3],
    .development-card[b-7kimk5dlm3],
    .expertise-card[b-7kimk5dlm3],
    .digital-copy[b-7kimk5dlm3],
    .digital-panel[b-7kimk5dlm3],
    .technology-strip[b-7kimk5dlm3],
    .application-card[b-7kimk5dlm3],
    .verification-card[b-7kimk5dlm3] {
        animation: reveal-up-b-7kimk5dlm3 620ms ease both;
    }

        .development-card:nth-child(2)[b-7kimk5dlm3],
        .expertise-card:nth-child(2)[b-7kimk5dlm3],
        .expertise-card:nth-child(6)[b-7kimk5dlm3],
        .expertise-card:nth-child(10)[b-7kimk5dlm3] {
            animation-delay: 70ms;
        }

        .development-card:nth-child(3)[b-7kimk5dlm3],
        .expertise-card:nth-child(3)[b-7kimk5dlm3],
        .expertise-card:nth-child(7)[b-7kimk5dlm3],
        .expertise-card:nth-child(11)[b-7kimk5dlm3] {
            animation-delay: 140ms;
        }

        .expertise-card:nth-child(4)[b-7kimk5dlm3],
        .expertise-card:nth-child(8)[b-7kimk5dlm3] {
            animation-delay: 210ms;
        }

        .expertise-card:nth-child(5)[b-7kimk5dlm3],
        .expertise-card:nth-child(9)[b-7kimk5dlm3] {
            animation-delay: 280ms;
        }
}

@keyframes reveal-up-b-7kimk5dlm3 {
    from {
        opacity: 0;
        transform: translateY(18px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Components/Pages/Home/Recommendations.razor.rz.scp.css */
.recommendations-page[b-87iyo7txk1] {
    min-height: 100vh;
    background: #0f172a;
    color: #ffffff;
}

.container[b-87iyo7txk1] {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
}

.recommendations-hero[b-87iyo7txk1] {
    position: relative;
    overflow: hidden;
    padding: 8rem 0 5rem;
    background: radial-gradient( circle at 85% 20%, rgba(59, 130, 246, 0.2), transparent 34% ), radial-gradient( circle at 10% 90%, rgba(14, 165, 233, 0.12), transparent 30% ), linear-gradient( 135deg, #0f172a 0%, #172554 55%, #1e3a8a 100% );
}

    .recommendations-hero[b-87iyo7txk1]::before {
        content: "";
        position: absolute;
        top: -160px;
        right: -160px;
        width: 430px;
        height: 430px;
        border-radius: 50%;
        border: 1px solid rgba(255, 255, 255, 0.08);
    }

    .recommendations-hero[b-87iyo7txk1]::after {
        content: "";
        position: absolute;
        right: 70px;
        bottom: -220px;
        width: 480px;
        height: 480px;
        border-radius: 50%;
        border: 1px solid rgba(255, 255, 255, 0.06);
    }

.hero-content[b-87iyo7txk1],
.recommendation-statistics[b-87iyo7txk1] {
    position: relative;
    z-index: 1;
}

.hero-content[b-87iyo7txk1] {
    max-width: 900px;
}

.section-label[b-87iyo7txk1] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    color: #93c5fd;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

    .section-label[b-87iyo7txk1]::before {
        content: "";
        width: 36px;
        height: 2px;
        border-radius: 999px;
        background: #60a5fa;
    }

.hero-content h1[b-87iyo7txk1] {
    max-width: 850px;
    margin: 1rem 0 1.4rem;
    color: #ffffff;
    font-size: clamp(2.6rem, 6vw, 4.7rem);
    font-weight: 850;
    line-height: 1.05;
    letter-spacing: -0.045em;
}

.hero-content p[b-87iyo7txk1] {
    max-width: 850px;
    margin: 0;
    color: #dbeafe;
    font-size: 1.08rem;
    line-height: 1.85;
}

.recommendation-statistics[b-87iyo7txk1] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    margin-top: 3.25rem;
}

.statistic-card[b-87iyo7txk1] {
    padding: 1.6rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 18px 45px rgba(2, 6, 23, 0.12);
    backdrop-filter: blur(15px);
}

    .statistic-card strong[b-87iyo7txk1] {
        display: block;
        margin-bottom: 0.4rem;
        color: #ffffff;
        font-size: 2.1rem;
        line-height: 1;
    }

    .statistic-card span[b-87iyo7txk1] {
        color: #bfdbfe;
        font-size: 0.92rem;
        line-height: 1.5;
    }

.recommendations-content[b-87iyo7txk1] {
    padding: 5.5rem 0 6rem;
    background: linear-gradient( rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.96) ), radial-gradient( circle at center, rgba(37, 99, 235, 0.18), transparent 48% );
}

.section-heading[b-87iyo7txk1] {
    max-width: 820px;
    margin: 0 auto 3.5rem;
    text-align: center;
}

    .section-heading .section-label[b-87iyo7txk1] {
        justify-content: center;
    }

    .section-heading h2[b-87iyo7txk1] {
        margin: 1rem 0;
        color: #ffffff;
        font-size: clamp(2rem, 4vw, 3rem);
        font-weight: 800;
        line-height: 1.15;
        letter-spacing: -0.03em;
    }

    .section-heading p[b-87iyo7txk1] {
        margin: 0;
        color: #cbd5e1;
        font-size: 1rem;
        line-height: 1.8;
    }

.recommendation-links[b-87iyo7txk1] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 1.5rem;
}

.recommendation-link-card[b-87iyo7txk1] {
    position: relative;
    display: flex;
    min-height: 500px;
    flex-direction: column;
    overflow: hidden;
    padding: 2rem;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 26px;
    background: linear-gradient( 145deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.98) );
    box-shadow: 0 24px 55px rgba(2, 6, 23, 0.25);
    color: #ffffff;
    text-decoration: none;
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

    .recommendation-link-card[b-87iyo7txk1]::after {
        content: "";
        position: absolute;
        right: -95px;
        bottom: -95px;
        width: 210px;
        height: 210px;
        border-radius: 50%;
        background: rgba(37, 99, 235, 0.09);
        transition: transform 0.35s ease;
    }

    .recommendation-link-card:hover[b-87iyo7txk1] {
        transform: translateY(-10px);
        border-color: rgba(96, 165, 250, 0.55);
        box-shadow: 0 32px 75px rgba(2, 6, 23, 0.38);
    }

        .recommendation-link-card:hover[b-87iyo7txk1]::after {
            transform: scale(1.25);
        }

.recommendation-link-card-featured[b-87iyo7txk1] {
    border-color: rgba(96, 165, 250, 0.45);
    background: radial-gradient( circle at top right, rgba(59, 130, 246, 0.2), transparent 35% ), linear-gradient( 145deg, #1e3a8a, #172554 55%, #0f172a );
}

.featured-label[b-87iyo7txk1] {
    position: absolute;
    top: 1.2rem;
    right: 1.2rem;
    z-index: 2;
    padding: 0.45rem 0.75rem;
    border: 1px solid rgba(147, 197, 253, 0.32);
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.2);
    color: #dbeafe;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.card-number[b-87iyo7txk1] {
    position: absolute;
    top: 1.35rem;
    left: 1.5rem;
    color: rgba(255, 255, 255, 0.11);
    font-size: 3.4rem;
    font-weight: 900;
    line-height: 1;
}

.card-icon[b-87iyo7txk1] {
    position: relative;
    z-index: 1;
    display: grid;
    width: 62px;
    height: 62px;
    place-items: center;
    margin: 4.5rem 0 1.6rem;
    border: 1px solid rgba(147, 197, 253, 0.25);
    border-radius: 18px;
    background: rgba(37, 99, 235, 0.15);
}

    .card-icon svg[b-87iyo7txk1] {
        width: 31px;
        height: 31px;
        fill: #93c5fd;
    }

.card-content[b-87iyo7txk1] {
    position: relative;
    z-index: 1;
    display: flex;
    height: 100%;
    flex-direction: column;
}

.card-location[b-87iyo7txk1] {
    display: block;
    margin-bottom: 0.65rem;
    color: #60a5fa;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    line-height: 1.5;
    text-transform: uppercase;
}

.card-content h3[b-87iyo7txk1] {
    margin: 0 0 1rem;
    color: #ffffff;
    font-size: 1.65rem;
    font-weight: 800;
    line-height: 1.25;
}

.card-content p[b-87iyo7txk1] {
    margin: 0 0 1.6rem;
    color: #cbd5e1;
    font-size: 0.94rem;
    line-height: 1.8;
}

.card-details[b-87iyo7txk1] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-bottom: 2rem;
}

    .card-details span[b-87iyo7txk1] {
        padding: 0.48rem 0.72rem;
        border: 1px solid rgba(148, 163, 184, 0.18);
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.05);
        color: #dbeafe;
        font-size: 0.75rem;
        font-weight: 650;
    }

.card-action[b-87iyo7txk1] {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    margin-top: auto;
    color: #93c5fd;
    font-size: 0.93rem;
    font-weight: 800;
}

    .card-action span[b-87iyo7txk1] {
        font-size: 1.25rem;
        transition: transform 0.25s ease;
    }

.recommendation-link-card:hover .card-action span[b-87iyo7txk1] {
    transform: translateX(6px);
}

.recommendations-footer[b-87iyo7txk1] {
    padding: 0 0 6rem;
    background: #0f172a;
}

.footer-card[b-87iyo7txk1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2.5rem;
    padding: 3rem;
    border: 1px solid rgba(147, 197, 253, 0.16);
    border-radius: 28px;
    background: radial-gradient( circle at right, rgba(37, 99, 235, 0.18), transparent 35% ), linear-gradient( 135deg, #172554, #0f172a );
    box-shadow: 0 24px 60px rgba(2, 6, 23, 0.3);
}

.footer-content[b-87iyo7txk1] {
    max-width: 720px;
}

    .footer-content h2[b-87iyo7txk1] {
        margin: 1rem 0;
        color: #ffffff;
        font-size: clamp(1.8rem, 4vw, 2.6rem);
        font-weight: 800;
        line-height: 1.2;
    }

    .footer-content p[b-87iyo7txk1] {
        margin: 0;
        color: #cbd5e1;
        line-height: 1.8;
    }

.footer-actions[b-87iyo7txk1] {
    display: flex;
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 0.85rem;
}

.button[b-87iyo7txk1] {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 1.25rem;
    border-radius: 12px;
    font-size: 0.9rem;
    font-weight: 750;
    text-decoration: none;
    transition: transform 0.25s ease, background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

    .button:hover[b-87iyo7txk1] {
        transform: translateY(-3px);
    }

.button-primary[b-87iyo7txk1] {
    border: 1px solid #2563eb;
    background: #2563eb;
    color: #ffffff;
}

    .button-primary:hover[b-87iyo7txk1] {
        border-color: #3b82f6;
        background: #3b82f6;
        color: #ffffff;
    }

.button-secondary[b-87iyo7txk1] {
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.05);
    color: #ffffff;
}

    .button-secondary:hover[b-87iyo7txk1] {
        border-color: #ffffff;
        background: #ffffff;
        color: #0f172a;
    }

@media (max-width: 1050px) {
    .recommendation-links[b-87iyo7txk1] {
        grid-template-columns: 1fr;
    }

    .recommendation-link-card[b-87iyo7txk1] {
        min-height: auto;
    }

    .card-icon[b-87iyo7txk1] {
        margin-top: 3.8rem;
    }

    .footer-card[b-87iyo7txk1] {
        align-items: flex-start;
        flex-direction: column;
    }

    .footer-actions[b-87iyo7txk1] {
        flex-shrink: 1;
    }
}

@media (max-width: 760px) {
    .recommendations-hero[b-87iyo7txk1] {
        padding: 6.5rem 0 4rem;
    }

    .recommendation-statistics[b-87iyo7txk1] {
        grid-template-columns: 1fr;
    }

    .recommendations-content[b-87iyo7txk1] {
        padding: 4.5rem 0;
    }

    .recommendation-link-card[b-87iyo7txk1] {
        padding: 1.5rem;
        border-radius: 22px;
    }

    .footer-card[b-87iyo7txk1] {
        padding: 2rem;
    }
}

@media (max-width: 520px) {
    .container[b-87iyo7txk1] {
        width: min(100% - 1.2rem, 1180px);
    }

    .hero-content h1[b-87iyo7txk1] {
        font-size: 2.45rem;
    }

    .section-label[b-87iyo7txk1] {
        font-size: 0.67rem;
        letter-spacing: 0.12em;
    }

    .card-number[b-87iyo7txk1] {
        top: 1.2rem;
        left: 1.25rem;
        font-size: 2.8rem;
    }

    .featured-label[b-87iyo7txk1] {
        max-width: 150px;
        text-align: center;
    }

    .card-icon[b-87iyo7txk1] {
        margin-top: 4.2rem;
    }

    .footer-actions[b-87iyo7txk1] {
        width: 100%;
        flex-direction: column;
    }

    .button[b-87iyo7txk1] {
        width: 100%;
    }
}
/* /Components/Pages/Home/RecommendationsIraq.razor.rz.scp.css */
/* ===========================================================
   Recommendations – Iraq
=========================================================== */

.recommendendations-section[b-95bhfk2n6n],
.recommendations-section[b-95bhfk2n6n] {
    width: 100%;
    padding: 5rem 0;
    background: #04172b;
}


/* ===========================================================
   Section Title
=========================================================== */

.recommendations-title[b-95bhfk2n6n] {
    margin-bottom: 1.3rem;
    background: #04172b;
}

    .recommendations-title h1[b-95bhfk2n6n] {
        margin: 0;
        color: #e3e9f1;
        font-size: clamp(2rem, 4vw, 3rem);
        font-weight: 700;
        line-height: 1.2;
        background: #04172b;
    }

    .recommendations-title span[b-95bhfk2n6n] {
        display: block;
        width: 72px;
        height: 4px;
        margin-top: 1rem;
        border-radius: 999px;
        background: #04172b;
    }


/* ===========================================================
   Introduction
=========================================================== */

.recommendation-intro[b-95bhfk2n6n] {
    max-width: 10001px;
    margin: 0 0 1rem;
    color: #f7f9fc;
    font-size: 1.35rem;
    line-height: 1.55;
    background: #04172b;
}


/* ===========================================================
   Recommendation Card
=========================================================== */

.recommendation-card[b-95bhfk2n6n] {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
    gap: 3rem;
    align-items: center;
    padding: 3rem;
    background: #043165;
    border: 1px solid #e3e9f1;
    border-radius: 22px;
    box-shadow: 0 14px 40px rgba(20, 46, 79, 0.08);
    overflow: hidden;
}

    .recommendation-card + .recommendation-card[b-95bhfk2n6n] {
        margin-top: 3rem;
    }


/* ===========================================================
   Recommendation Content
=========================================================== */

.recommendation-content[b-95bhfk2n6n] {
    min-width: 0;
}

.recommendation-label[b-95bhfk2n6n] {
    margin: 0 0 0.8rem;
    color: #e3e9f1;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 1.4;
    text-transform: uppercase;
    background: #043165;
}

.recommendation-content h2[b-95bhfk2n6n] {
    margin: 0 0 1rem;
    color: #e3e9f1;
    font-size: clamp(1.7rem, 3vw, 2.35rem);
    font-weight: 700;
    line-height: 1.25;
    background: #043165;
}

.recommendation-position[b-95bhfk2n6n] {
    margin: 0 0 0.45rem;
    color: #e3e9f1;
    font-size: 1.08rem;
    font-weight: 700;
    line-height: 1.55;
    background: #043165;
}

.recommendation-period[b-95bhfk2n6n] {
    margin: 0 0 1.8rem;
    color: #e3e9f1;
    font-size: 0.96rem;
    font-weight: 500;
    background: #043165;
}

.recommendation-description[b-95bhfk2n6n] {
    margin: 0 0 1rem;
    color: #e3e9f1;
    font-size: 1rem;
    line-height: 1.8;
    background: #043165;
}

    .recommendation-description:last-of-type[b-95bhfk2n6n] {
        margin-bottom: 0;
    }


/* ===========================================================
   Actions
=========================================================== */

.recommendation-actions[b-95bhfk2n6n] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 2rem;
}

    .recommendation-actions .portfolio-button[b-95bhfk2n6n] {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        min-height: 48px;
        padding: 0.8rem 1.35rem;
        border-radius: 9px;
        text-align: center;
        text-decoration: none;
        font-size: 0.95rem;
        font-weight: 700;
        line-height: 1.2;
        transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    }

    .recommendation-actions .portfolio-button-primary[b-95bhfk2n6n] {
        border: 2px solid #173f77;
        background: #043165;
        color: #f7f9fc;
        box-shadow: 0 8px 20px rgba(23, 63, 119, 0.16);
    }

        .recommendation-actions .portfolio-button-primary:hover[b-95bhfk2n6n] {
            border-color: #1d5ca4;
            background: #043165;
            color: #f7f9fc;
            transform: translateY(-2px);
            box-shadow: 0 12px 26px rgba(23, 63, 119, 0.23);
        }

    .recommendation-actions .portfolio-button-outline[b-95bhfk2n6n] {
        border: 2px solid #173f77;
        background: #043165;
        color: #f7f9fc;
    }

        .recommendation-actions .portfolio-button-outline:hover[b-95bhfk2n6n] {
            background: #043165;
            color: #f7f9fc;
            transform: translateY(-2px);
            box-shadow: 0 10px 24px rgba(23, 63, 119, 0.17);
        }

    .recommendation-actions .portfolio-button:focus-visible[b-95bhfk2n6n] {
        outline: 3px solid rgba(29, 92, 164, 0.35);
        outline-offset: 3px;
    }


/* ===========================================================
   Recommendation Document
=========================================================== */

.recommendation-document[b-95bhfk2n6n] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 0;
    padding-left: 1rem;
}

    .recommendation-document a[b-95bhfk2n6n] {
        display: block;
        width: 100%;
        max-width: 470px;
        padding: 0.65rem;
        background: #043165;
        border: 1px solid #dce4ee;
        border-radius: 14px;
        box-shadow: 0 14px 34px rgba(20, 46, 79, 0.13);
        overflow: hidden;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

        .recommendation-document a:hover[b-95bhfk2n6n] {
            border-color: #b8cbe2;
            transform: translateY(-5px);
            box-shadow: 0 20px 44px rgba(20, 46, 79, 0.18);
        }

        .recommendation-document a:focus-visible[b-95bhfk2n6n] {
            outline: 3px solid rgba(29, 92, 164, 0.35);
            outline-offset: 4px;
        }

    .recommendation-document img[b-95bhfk2n6n] {
        display: block;
        width: 100%;
        height: auto;
        max-height: 680px;
        object-fit: contain;
        border-radius: 8px;
        background: #043165;
    }


/* ===========================================================
   Responsive – Tablet
=========================================================== */

@media (max-width: 992px) {

    .recommendations-section[b-95bhfk2n6n] {
        padding: 4rem 0;
    }

    .recommendation-card[b-95bhfk2n6n] {
        grid-template-columns: 1fr;
        gap: 2.5rem;
        padding: 2.5rem;
    }

    .recommendation-document[b-95bhfk2n6n] {
        width: 100%;
    }

        .recommendation-document a[b-95bhfk2n6n] {
            max-width: 620px;
        }

        .recommendation-document img[b-95bhfk2n6n] {
            max-height: none;
        }
}


/* ===========================================================
   Responsive – Mobile
=========================================================== */

@media (max-width: 768px) {

    .recommendations-section[b-95bhfk2n6n] {
        padding: 3.5rem 0;
    }

    .recommendation-intro[b-95bhfk2n6n] {
        margin-bottom: 2.3rem;
        font-size: 1rem;
        line-height: 1.75;
    }

    .recommendation-card[b-95bhfk2n6n] {
        gap: 2rem;
        padding: 2rem;
        border-radius: 18px;
    }

        .recommendation-card + .recommendation-card[b-95bhfk2n6n] {
            margin-top: 2.5rem;
        }

    .recommendation-position[b-95bhfk2n6n] {
        font-size: 1rem;
    }

    .recommendation-description[b-95bhfk2n6n] {
        font-size: 0.97rem;
        line-height: 1.75;
    }

    .recommendation-actions[b-95bhfk2n6n] {
        margin-top: 1.7rem;
    }
}


/* ===========================================================
   Responsive – Small Mobile
=========================================================== */

@media (max-width: 560px) {

    .recommendations-section[b-95bhfk2n6n] {
        padding: 3rem 0;
    }

    .recommendations-title h1[b-95bhfk2n6n] {
        font-size: 2rem;
    }

    .recommendations-title span[b-95bhfk2n6n] {
        width: 58px;
        height: 3px;
    }

    .recommendation-card[b-95bhfk2n6n] {
        padding: 1.4rem;
        border-radius: 15px;
    }

    .recommendation-content h2[b-95bhfk2n6n] {
        font-size: 1.55rem;
    }

    .recommendation-actions[b-95bhfk2n6n] {
        flex-direction: column;
        width: 100%;
    }

        .recommendation-actions .portfolio-button[b-95bhfk2n6n] {
            width: 100%;
        }

    .recommendation-document a[b-95bhfk2n6n] {
        padding: 0.45rem;
        border-radius: 11px;
    }

    .recommendation-document img[b-95bhfk2n6n] {
        border-radius: 7px;
    }
}
/* /Components/Pages/Home/RecommendationsKuwait.razor.rz.scp.css */
/* ===========================================================
   Recommendations – Iraq
=========================================================== */

.recommendendations-section[b-vjf1le6au3],
.recommendations-section[b-vjf1le6au3] {
    width: 100%;
    padding: 5rem 0;
    background: #04172b;
}


/* ===========================================================
   Section Title
=========================================================== */

.recommendations-title[b-vjf1le6au3] {
    margin-bottom: 1.3rem;
    background: #04172b;
}

    .recommendations-title h1[b-vjf1le6au3] {
        margin: 0;
        color: #e3e9f1;
        font-size: clamp(2rem, 4vw, 3rem);
        font-weight: 700;
        line-height: 1.2;
        background: #04172b;
    }

    .recommendations-title span[b-vjf1le6au3] {
        display: block;
        width: 72px;
        height: 4px;
        margin-top: 1rem;
        border-radius: 999px;
        background: #04172b;
    }


/* ===========================================================
   Introduction
=========================================================== */

.recommendation-intro[b-vjf1le6au3] {
    max-width: 10001px;
    margin: 0 0 1rem;
    color: #f7f9fc;
    font-size: 1.35rem;
    line-height: 1.55;
    background: #04172b;
}


/* ===========================================================
   Recommendation Card
=========================================================== */

.recommendation-card[b-vjf1le6au3] {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
    gap: 3rem;
    align-items: center;
    padding: 3rem;
    background: #043165;
    border: 1px solid #e3e9f1;
    border-radius: 22px;
    box-shadow: 0 14px 40px rgba(20, 46, 79, 0.08);
    overflow: hidden;
}

    .recommendation-card + .recommendation-card[b-vjf1le6au3] {
        margin-top: 3rem;
    }


/* ===========================================================
   Recommendation Content
=========================================================== */

.recommendation-content[b-vjf1le6au3] {
    min-width: 0;
}

.recommendation-label[b-vjf1le6au3] {
    margin: 0 0 0.8rem;
    color: #e3e9f1;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    line-height: 1.4;
    text-transform: uppercase;
    background: #043165;
}

.recommendation-content h2[b-vjf1le6au3] {
    margin: 0 0 1rem;
    color: #e3e9f1;
    font-size: clamp(1.7rem, 3vw, 2.35rem);
    font-weight: 700;
    line-height: 1.25;
    background: #043165;
}

.recommendation-position[b-vjf1le6au3] {
    margin: 0 0 0.45rem;
    color: #e3e9f1;
    font-size: 1.08rem;
    font-weight: 700;
    line-height: 1.55;
    background: #043165;
}

.recommendation-period[b-vjf1le6au3] {
    margin: 0 0 1.8rem;
    color: #e3e9f1;
    font-size: 0.96rem;
    font-weight: 500;
    background: #043165;
}

.recommendation-description[b-vjf1le6au3] {
    margin: 0 0 1rem;
    color: #e3e9f1;
    font-size: 1rem;
    line-height: 1.8;
    background: #043165;
}

    .recommendation-description:last-of-type[b-vjf1le6au3] {
        margin-bottom: 0;
    }


/* ===========================================================
   Actions
=========================================================== */

.recommendation-actions[b-vjf1le6au3] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 2rem;
}

    .recommendation-actions .portfolio-button[b-vjf1le6au3] {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        min-height: 48px;
        padding: 0.8rem 1.35rem;
        border-radius: 9px;
        text-align: center;
        text-decoration: none;
        font-size: 0.95rem;
        font-weight: 700;
        line-height: 1.2;
        transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    }

    .recommendation-actions .portfolio-button-primary[b-vjf1le6au3] {
        border: 2px solid #173f77;
        background: #043165;
        color: #f7f9fc;
        box-shadow: 0 8px 20px rgba(23, 63, 119, 0.16);
    }

        .recommendation-actions .portfolio-button-primary:hover[b-vjf1le6au3] {
            border-color: #1d5ca4;
            background: #043165;
            color: #f7f9fc;
            transform: translateY(-2px);
            box-shadow: 0 12px 26px rgba(23, 63, 119, 0.23);
        }

    .recommendation-actions .portfolio-button-outline[b-vjf1le6au3] {
        border: 2px solid #173f77;
        background: #043165;
        color: #f7f9fc;
    }

        .recommendation-actions .portfolio-button-outline:hover[b-vjf1le6au3] {
            background: #043165;
            color: #f7f9fc;
            transform: translateY(-2px);
            box-shadow: 0 10px 24px rgba(23, 63, 119, 0.17);
        }

    .recommendation-actions .portfolio-button:focus-visible[b-vjf1le6au3] {
        outline: 3px solid rgba(29, 92, 164, 0.35);
        outline-offset: 3px;
    }


/* ===========================================================
   Recommendation Document
=========================================================== */

.recommendation-document[b-vjf1le6au3] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 0;
    padding-left: 1rem;
}

    .recommendation-document a[b-vjf1le6au3] {
        display: block;
        width: 100%;
        max-width: 470px;
        padding: 0.65rem;
        background: #043165;
        border: 1px solid #dce4ee;
        border-radius: 14px;
        box-shadow: 0 14px 34px rgba(20, 46, 79, 0.13);
        overflow: hidden;
        transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    }

        .recommendation-document a:hover[b-vjf1le6au3] {
            border-color: #b8cbe2;
            transform: translateY(-5px);
            box-shadow: 0 20px 44px rgba(20, 46, 79, 0.18);
        }

        .recommendation-document a:focus-visible[b-vjf1le6au3] {
            outline: 3px solid rgba(29, 92, 164, 0.35);
            outline-offset: 4px;
        }

    .recommendation-document img[b-vjf1le6au3] {
        display: block;
        width: 100%;
        height: auto;
        max-height: 680px;
        object-fit: contain;
        border-radius: 8px;
        background: #043165;
    }


/* ===========================================================
   Responsive – Tablet
=========================================================== */

@media (max-width: 992px) {

    .recommendations-section[b-vjf1le6au3] {
        padding: 4rem 0;
    }

    .recommendation-card[b-vjf1le6au3] {
        grid-template-columns: 1fr;
        gap: 2.5rem;
        padding: 2.5rem;
    }

    .recommendation-document[b-vjf1le6au3] {
        width: 100%;
    }

        .recommendation-document a[b-vjf1le6au3] {
            max-width: 620px;
        }

        .recommendation-document img[b-vjf1le6au3] {
            max-height: none;
        }
}


/* ===========================================================
   Responsive – Mobile
=========================================================== */

@media (max-width: 768px) {

    .recommendations-section[b-vjf1le6au3] {
        padding: 3.5rem 0;
    }

    .recommendation-intro[b-vjf1le6au3] {
        margin-bottom: 2.3rem;
        font-size: 1rem;
        line-height: 1.75;
    }

    .recommendation-card[b-vjf1le6au3] {
        gap: 2rem;
        padding: 2rem;
        border-radius: 18px;
    }

        .recommendation-card + .recommendation-card[b-vjf1le6au3] {
            margin-top: 2.5rem;
        }

    .recommendation-position[b-vjf1le6au3] {
        font-size: 1rem;
    }

    .recommendation-description[b-vjf1le6au3] {
        font-size: 0.97rem;
        line-height: 1.75;
    }

    .recommendation-actions[b-vjf1le6au3] {
        margin-top: 1.7rem;
    }
}


/* ===========================================================
   Responsive – Small Mobile
=========================================================== */

@media (max-width: 560px) {

    .recommendations-section[b-vjf1le6au3] {
        padding: 3rem 0;
    }

    .recommendations-title h1[b-vjf1le6au3] {
        font-size: 2rem;
    }

    .recommendations-title span[b-vjf1le6au3] {
        width: 58px;
        height: 3px;
    }

    .recommendation-card[b-vjf1le6au3] {
        padding: 1.4rem;
        border-radius: 15px;
    }

    .recommendation-content h2[b-vjf1le6au3] {
        font-size: 1.55rem;
    }

    .recommendation-actions[b-vjf1le6au3] {
        flex-direction: column;
        width: 100%;
    }

        .recommendation-actions .portfolio-button[b-vjf1le6au3] {
            width: 100%;
        }

    .recommendation-document a[b-vjf1le6au3] {
        padding: 0.45rem;
        border-radius: 11px;
    }

    .recommendation-document img[b-vjf1le6au3] {
        border-radius: 7px;
    }
}
/* /Components/Pages/Home/RecommendationsRmu.razor.rz.scp.css */
.recommendations-section[b-0kjaq1te7e] {
    min-height: 100vh;
    padding: 90px 0 100px;
    color: #ffffff;
    background: #071525;
}

.recommendations-title[b-0kjaq1te7e] {
    text-align: center;
}

    .recommendations-title h1[b-0kjaq1te7e] {
        margin: 0;
        color: #ffffff;
        font-size: clamp(2rem, 4vw, 3rem);
        font-weight: 700;
    }

    .recommendations-title span[b-0kjaq1te7e] {
        display: block;
        width: 60px;
        height: 3px;
        margin: 20px auto 0;
        background: #2d95f3;
        border-radius: 999px;
    }

.recommendation-intro[b-0kjaq1te7e] {
    max-width: 900px;
    margin: 38px auto 55px;
    color: #b7c5d3;
    font-size: 1rem;
    line-height: 1.8;
    text-align: center;
}

.recommendation-card[b-0kjaq1te7e] {
    display: grid;
    grid-template-columns: minmax(300px, 0.8fr) minmax(420px, 1.2fr);
    align-items: center;
    gap: 50px;
    padding: 38px;
    background: linear-gradient( 145deg, rgba(23, 63, 104, 0.82), rgba(10, 36, 65, 0.97) );
    border: 1px solid rgba(100, 181, 246, 0.35);
    border-radius: 14px;
    box-shadow: 0 24px 65px rgba(0, 0, 0, 0.3);
}

.recommendation-content[b-0kjaq1te7e] {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.recommendation-label[b-0kjaq1te7e] {
    margin: 0 0 18px;
    color: #64b5f6;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.18rem;
}

.recommendation-content h2[b-0kjaq1te7e] {
    margin: 0;
    color: #ffffff;
    font-size: clamp(1.65rem, 3vw, 2.2rem);
    line-height: 1.25;
}

.recommendation-position[b-0kjaq1te7e] {
    margin: 18px 0 0;
    color: #d9e7f5;
    font-size: 1rem;
    font-weight: 700;
}

.recommendation-period[b-0kjaq1te7e] {
    margin: 8px 0 24px;
    color: #8dc8fb;
    font-size: 0.9rem;
    font-weight: 600;
}

.recommendation-description[b-0kjaq1te7e] {
    margin: 0 0 16px;
    color: #cbd7e4;
    font-size: 0.98rem;
    line-height: 1.75;
}

.recommendation-actions[b-0kjaq1te7e] {
    margin-top: 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.recommendation-document[b-0kjaq1te7e] {
    display: flex;
    align-items: center;
    justify-content: center;
}

    .recommendation-document a[b-0kjaq1te7e] {
        display: block;
        width: 100%;
        max-width: 620px;
        overflow: hidden;
        border-radius: 10px;
        text-decoration: none;
    }

    .recommendation-document img[b-0kjaq1te7e] {
        display: block;
        width: 100%;
        height: auto;
        border: 1px solid rgba(255, 255, 255, 0.16);
        border-radius: 10px;
        box-shadow: 0 20px 55px rgba(0, 0, 0, 0.38);
        transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
    }

    .recommendation-document a:hover img[b-0kjaq1te7e] {
        transform: scale(1.015);
        border-color: rgba(100, 181, 246, 0.65);
        box-shadow: 0 26px 70px rgba(0, 0, 0, 0.48);
    }

@media (max-width: 1000px) {
    .recommendations-section[b-0kjaq1te7e] {
        padding-top: 75px;
    }

    .recommendation-card[b-0kjaq1te7e] {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .recommendation-content[b-0kjaq1te7e] {
        text-align: center;
    }

    .recommendation-actions[b-0kjaq1te7e] {
        justify-content: center;
    }

    .recommendation-document a[b-0kjaq1te7e] {
        max-width: 680px;
    }
}

@media (max-width: 650px) {
    .recommendations-section[b-0kjaq1te7e] {
        padding: 60px 0 75px;
    }

    .recommendation-intro[b-0kjaq1te7e] {
        margin-bottom: 38px;
        font-size: 0.95rem;
    }

    .recommendation-card[b-0kjaq1te7e] {
        padding: 22px;
        gap: 30px;
    }

    .recommendation-actions[b-0kjaq1te7e] {
        flex-direction: column;
    }

        .recommendation-actions .portfolio-button[b-0kjaq1te7e] {
            width: 100%;
            text-align: center;
        }

    .recommendation-description[b-0kjaq1te7e] {
        font-size: 0.94rem;
    }
}
/* /Components/Pages/Statistika.razor.rz.scp.css */
.statistics-page[b-b09bzsiil7] {
    min-height: calc(100vh - 160px);
    padding: 70px 24px 90px;
    background: linear-gradient( 135deg, #0d2538 0%, #123b55 55%, #174d68 100% );
    color: #ffffff;
}

.statistics-container[b-b09bzsiil7] {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    text-align: center;
}

.statistics-label[b-b09bzsiil7] {
    display: block;
    margin-bottom: 14px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    color: #d9b35f;
}

.statistics-page h1[b-b09bzsiil7] {
    margin: 0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.4rem, 5vw, 4rem);
    font-weight: 500;
    color: #ffffff;
}

.statistics-intro[b-b09bzsiil7] {
    max-width: 620px;
    margin: 18px auto 42px;
    font-size: 1rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.78);
}

.statistics-grid[b-b09bzsiil7] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    max-width: 900px;
    margin: 0 auto;
}

.statistics-card[b-b09bzsiil7] {
    display: flex;
    min-height: 190px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 28px 20px;
    border: 1px solid rgba(217, 179, 95, 0.55);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.06);
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.12);
    transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

    .statistics-card:hover[b-b09bzsiil7] {
        transform: translateY(-4px);
        background: rgba(255, 255, 255, 0.09);
        border-color: #d9b35f;
    }

.statistics-card-title[b-b09bzsiil7] {
    margin-bottom: 18px;
    font-size: 0.95rem;
    color: rgba(255, 255, 255, 0.82);
}

.statistics-number[b-b09bzsiil7] {
    display: block;
    margin-bottom: 10px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 2.8rem;
    font-weight: 500;
    line-height: 1;
    color: #e4bd67;
}

.statistics-unit[b-b09bzsiil7] {
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.68);
}

.statistics-note[b-b09bzsiil7] {
    max-width: 760px;
    margin: 38px auto 0;
    padding: 24px 28px;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
}

    .statistics-note strong[b-b09bzsiil7] {
        display: block;
        margin-bottom: 8px;
        color: #d9b35f;
    }

    .statistics-note p[b-b09bzsiil7] {
        margin: 0;
        font-size: 0.9rem;
        line-height: 1.7;
        color: rgba(255, 255, 255, 0.7);
    }


/* TABLET */

@media (max-width: 800px) {

    .statistics-page[b-b09bzsiil7] {
        padding: 55px 20px 70px;
    }

    .statistics-grid[b-b09bzsiil7] {
        grid-template-columns: 1fr;
        max-width: 520px;
    }

    .statistics-card[b-b09bzsiil7] {
        min-height: 155px;
    }
}


/* MOBITEL */

@media (max-width: 480px) {

    .statistics-page[b-b09bzsiil7] {
        padding: 45px 16px 60px;
    }

        .statistics-page h1[b-b09bzsiil7] {
            font-size: 2.25rem;
        }

    .statistics-intro[b-b09bzsiil7] {
        margin-bottom: 30px;
    }

    .statistics-card[b-b09bzsiil7] {
        padding: 24px 16px;
    }

    .statistics-number[b-b09bzsiil7] {
        font-size: 2.4rem;
    }

    .statistics-note[b-b09bzsiil7] {
        padding: 22px 10px;
    }
}
.statistics-loading[b-b09bzsiil7] {
    margin-top: 40px;
    color: rgba(255, 255, 255, 0.75);
}

.statistics-last-visit[b-b09bzsiil7] {
    margin: 25px 0 0;
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.55);
}