/* ============================================================================
   IRISE ICT Enterprise Production Stylesheet (modernized)
   Premium Blue Edition — refined motion, glass, hierarchy, accessibility
   Footer visibility + full scrolling banner visibility fixes included
   ============================================================================ */

:root {
    --navy-950: #030b16;
    --navy-900: #061427;
    --navy-850: #0a1d38;
    --navy-800: #0f2d54;
    --navy-700: #19406c;
    --navy-600: #245c8b;

    --sapphire-800: #0057d6;
    --sapphire-700: #0a72f5;
    --sapphire-600: #1592ff;
    --sapphire-500: #39a8ff;
    --sapphire-400: #7fc8ff;

    --azure-50: #f4faff;
    --azure-100: #e8f4ff;
    --azure-200: #d6ebff;
    --azure-300: #b7d9ff;

    --teal-500: #08c6d8;
    --teal-400: #3fe0ef;
    --teal-100: #e8fcfd;

    --orange-600: #e95d00;
    --orange-500: #ff7a18;
    --orange-400: #ff9a3d;

    --red-600: #de2a1f;
    --red-500: #ff3b30;
    --red-400: #ff6a54;

    --white: #ffffff;
    --ink: #0f1724;
    --ink-strong: #07111f;
    --muted: #5d6675;
    --muted-soft: #788291;

    --brand-primary: var(--sapphire-700);
    --brand-primary-gradient: linear-gradient(180deg, var(--sapphire-500) 0%, var(--sapphire-700) 52%, var(--sapphire-800) 100%);
    --brand-secondary: var(--orange-500);
    --brand-accent-red: var(--red-600);
    --surface-glass: rgba(255, 255, 255, 0.86);
    --surface-glass-strong: rgba(255, 255, 255, 0.94);

    --shadow-soft: 0 10px 24px rgba(4, 16, 31, .08);
    --shadow-card: 0 24px 70px rgba(4, 16, 31, .12);
    --shadow-glow-sapphire: 0 18px 48px rgba(10, 114, 245, .26);
    --shadow-glow-orange: 0 16px 44px rgba(255, 122, 24, .20);
    --radius-xl: 30px;
    --radius-lg: 22px;
    --radius-md: 16px;
    --radius-sm: 12px;
    --max-width: 1180px;
    --transition-smooth: 260ms cubic-bezier(.2,.8,.2,1);
    --transition-slower: 420ms cubic-bezier(.16,1,.3,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
    margin: 0;
    font-family: "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--ink);
    background:
        radial-gradient(circle at 10% 0%, rgba(10, 114, 245, .12), transparent 30%),
        radial-gradient(circle at 90% 8%, rgba(8, 198, 216, .10), transparent 26%),
        radial-gradient(circle at 50% 100%, rgba(255, 122, 24, .06), transparent 30%),
        linear-gradient(180deg, #ffffff 0%, var(--azure-50) 45%, #ffffff 100%);
    line-height: 1.6;
    overflow-x: hidden;
    letter-spacing: .003em;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: .22;
    background:
        linear-gradient(90deg, rgba(10,114,245,.04) 1px, transparent 1px),
        linear-gradient(180deg, rgba(10,114,245,.03) 1px, transparent 1px);
    background-size: 80px 80px;
    z-index: 0;
}

.container {
    width: min(var(--max-width), calc(100% - 32px));
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

::selection { background: rgba(255, 122, 24, .24); color: var(--ink-strong); }
:focus-visible { outline: 3px solid rgba(10, 114, 245, .32); outline-offset: 3px; }

.skip-link {
    position: absolute;
    top: -100px;
    left: 16px;
    z-index: 1000;
    background: var(--navy-900);
    color: var(--white);
    padding: 10px 16px;
    border-radius: 12px;
    box-shadow: var(--shadow-card);
}
.skip-link:focus { top: 16px; }

.section-title-modern {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 850 !important;
    letter-spacing: -0.05em;
    color: var(--navy-950);
}

.topbar {
    background: linear-gradient(90deg, var(--navy-950) 0%, var(--sapphire-800) 55%, var(--navy-800) 100%);
    color: rgba(255,255,255,.96);
    font-size: 13px;
    border-bottom: 3px solid var(--brand-accent-red);
    box-shadow: inset 0 -1px 0 rgba(255,255,255,.08);
    letter-spacing: .02em;
}
.topbar-inner {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}
.topbar a { color: var(--white); font-weight: 700; text-decoration: none; }
.topbar a:hover { opacity: .9; }

.site-header {
    position: sticky;
    top: 0;
    z-index: 1050;
    background: rgba(255,255,255,.82);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(10, 114, 245, 0.10);
    box-shadow: 0 10px 40px rgba(7, 18, 31, 0.06);
    transition: transform var(--transition-smooth), background var(--transition-smooth), box-shadow var(--transition-smooth);
}
.site-header.is-scrolled { background: rgba(255,255,255,.92); box-shadow: 0 14px 44px rgba(7, 18, 31, 0.10); }

.nav {
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.brand { display: flex; align-items: center; gap: 12px; font-weight: 800; text-decoration: none; }
.brand-logo {
    display: block;
    width: auto;
    height: 58px;
    max-width: 210px;
    object-fit: contain;
    filter: drop-shadow(0 10px 20px rgba(10, 114, 245, .14));
}
.nav-links {
    display: flex;
    align-items: center;
    gap: 24px;
    font-size: 14px;
    font-weight: 700;
}
.nav-links a {
    position: relative;
    padding: 8px 0;
    color: var(--ink);
    text-decoration: none;
    transition: color var(--transition-smooth), transform var(--transition-smooth);
}
.nav-links a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 100%;
    height: 3px;
    transform: scaleX(0);
    transform-origin: left;
    background: var(--sapphire-700);
    box-shadow: 0 0 16px rgba(10, 114, 245, .38);
    transition: transform var(--transition-smooth);
    border-radius: 999px;
}
.nav-links a:hover, .nav-links a:focus-visible { color: var(--sapphire-700); transform: translateY(-1px); }
.nav-links a:hover::after, .nav-links a:focus-visible::after { transform: scaleX(1); }

.menu-toggle {
    display: none;
    border: 1px solid rgba(10, 114, 245, .16);
    background: rgba(255,255,255,.96);
    width: 46px;
    height: 46px;
    border-radius: 14px;
    cursor: pointer;
    color: var(--sapphire-800);
    box-shadow: var(--shadow-soft);
    font-size: 20px;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 46px;
    padding: 0 22px;
    border-radius: 9999px;
    border: 1px solid transparent;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: .015em;
    cursor: pointer;
    transition: transform var(--transition-smooth), box-shadow var(--transition-smooth), background var(--transition-smooth), border-color var(--transition-smooth), color var(--transition-smooth), opacity var(--transition-smooth);
    white-space: nowrap;
    position: relative;
    overflow: hidden;
    text-decoration: none;
    will-change: transform;
}
.btn::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 18%, rgba(255,255,255,.26), transparent 52%);
    transform: translateX(-120%);
    transition: transform .65s ease;
}
.btn:hover::before { transform: translateX(120%); }
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }

.btn-primary {
    color: white !important;
    background: var(--brand-primary-gradient);
    box-shadow: var(--shadow-glow-sapphire), inset 0 1px 0 rgba(255,255,255,.34);
    border-color: rgba(255,255,255,.18);
}
.btn-primary:hover { box-shadow: 0 24px 62px rgba(10, 114, 245, .30); }

.btn-dark {
    color: white !important;
    background: linear-gradient(180deg, var(--navy-950), #081a31);
    box-shadow: 0 18px 45px rgba(7, 18, 31, .28), inset 0 1px 0 rgba(255,255,255,.08);
}

.btn-outline {
    background: rgba(255,255,255,.88);
    color: var(--ink-strong);
    border-color: rgba(10, 114, 245, .18);
    backdrop-filter: blur(12px);
}
.btn-outline:hover {
    border-color: rgba(10, 114, 245, .42);
    color: var(--sapphire-700);
    box-shadow: 0 18px 42px rgba(10, 114, 245, .14);
}

.btn-outline-light {
    background: rgba(255,255,255,.08);
    color: white !important;
    border: 1px solid rgba(255,255,255,.28);
    backdrop-filter: blur(14px);
}
.btn-outline-light:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.68); }

.btn.large { min-height: 56px; font-size: 16px; padding: 0 28px; }

.hero-slider {
    position: relative;
    min-height: 680px;
    height: 86vh;
    background: #020914;
    overflow: hidden;
}
.slider-wrapper { position: relative; width: 100%; height: 100%; }
.slide {
    position: absolute;
    inset: 0;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    opacity: 0;
    visibility: hidden;
    transform: scale(1.03);
    transition: opacity .8s cubic-bezier(.25,.46,.45,.94), visibility .8s, transform 1.1s cubic-bezier(.16,1,.3,1);
    display: flex;
    align-items: center;
    z-index: 1;
}
.slide.active {
    opacity: 1;
    visibility: visible;
    z-index: 2;
    transform: scale(1);
}
.slide-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(4, 16, 31, .96) 0%, rgba(4, 16, 31, .86) 34%, rgba(0, 87, 214, .48) 68%, rgba(10, 114, 245, .22) 100%),
        radial-gradient(circle at 70% 20%, rgba(63, 224, 239, .16), transparent 26%);
}
.slide-content {
    position: relative;
    z-index: 5;
    max-width: var(--max-width);
    margin: 0 auto;
    padding: 0 18px;
    width: 100%;
}
.slide-text h1 span {
    color: var(--sapphire-400);
    text-shadow: 0 0 30px rgba(10, 114, 245, .40);
}
.hero-copy {
    font-size: clamp(16px, 2vw, 19px);
    color: rgba(255, 255, 255, 0.90);
    margin-bottom: 30px;
    max-width: 680px;
}
.eyebrow, .kicker-premium, .kicker-light {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.pulse {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--teal-400);
    box-shadow: 0 0 0 0 rgba(63,224,239,.55);
    animation: pulse 1.9s infinite;
}
@keyframes pulse {
    70% { box-shadow: 0 0 0 14px rgba(63,224,239,0); }
    100% { box-shadow: 0 0 0 0 rgba(63,224,239,0); }
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }

.promo-ads-bar {
    background:
        linear-gradient(180deg, rgba(5, 11, 20, .96), rgba(4, 16, 31, .98)),
        radial-gradient(circle at 20% 0%, rgba(10,114,245,.16), transparent 22%);
    border-bottom: 3px solid var(--brand-accent-red);
    padding: 28px 0;
    overflow: hidden;
    position: relative;
}

/* FULL VIEW BANNER FIX */
.promo-ads-bar,
.promo-ads-bar .container-fluid,
.promo-ads-bar .promo-marquee-engine {
    overflow: visible !important;
}

.promo-marquee-engine {
    display: flex;
    width: max-content;
    gap: 22px;
    animation: engineeringMarquee 38s linear infinite;
    align-items: stretch;
    padding: 6px 0;
}
.promo-item-box {
    width: 360px;
    min-width: 360px;
    min-height: 210px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(10, 114, 245, 0.18);
    border-radius: 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 0;
    position: relative;
    transition: transform var(--transition-smooth), background var(--transition-smooth), border-color var(--transition-smooth), box-shadow var(--transition-smooth);
    box-shadow: 0 16px 34px rgba(0, 0, 0, .18);
}
.promo-item-box:hover {
    border-color: var(--brand-secondary);
    background: rgba(255, 255, 255, 0.12);
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(0,0,0,.28);
}
.promo-link-card {
    display: block;
    color: inherit;
    text-decoration: none;
    height: 100%;
}
.promo-image {
    width: 100%;
    height: 150px;
    display: block;
    object-fit: cover;
    object-position: center center;
    background: #08111f;
}
.promo-text {
    padding: 14px 16px 16px;
}
.promo-text h4,
.promo-text p,
.promo-text span {
    color: #f5f9ff !important;
}
@keyframes engineeringMarquee {
    0% { transform: translate3d(0,0,0); }
    100% { transform: translate3d(-50%,0,0); }
}

.impact-bar {
    background:
        radial-gradient(circle at 20% 0%, rgba(63, 224, 239, .24), transparent 26%),
        linear-gradient(180deg, var(--sapphire-800), var(--navy-950));
    color: white;
    padding: 46px 0;
    border-top: 1px solid rgba(255,255,255,.16);
    border-bottom: 3px solid var(--red-600);
}
.impact-value {
    font-size: clamp(42px, 6vw, 66px);
    font-weight: 850;
    letter-spacing: -.07em;
    line-height: 1;
    color: #ffffff;
    text-shadow: 0 0 28px rgba(10, 114, 245, .38);
}

.premium-services {
    padding: 104px 0 90px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(244,250,255,.78) 100%);
    position: relative;
}
.premium-services::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 20% 10%, rgba(10,114,245,.08), transparent 24%), radial-gradient(circle at 80% 0%, rgba(255,122,24,.05), transparent 22%);
    pointer-events: none;
}
.filter-nav-pills .nav-link-pill {
    appearance: none;
    background: #ffffff;
    color: var(--navy-950);
    font-weight: 700;
    padding: 10px 22px;
    border-radius: 99px;
    border: 1px solid rgba(10, 114, 245, 0.14);
    margin: 5px;
    cursor: pointer;
    transition: transform var(--transition-smooth), background var(--transition-smooth), color var(--transition-smooth), box-shadow var(--transition-smooth), border-color var(--transition-smooth);
}
.filter-nav-pills .nav-link-pill.active-pill, .filter-nav-pills .nav-link-pill:hover, .filter-nav-pills .nav-link-pill:focus-visible {
    background: var(--brand-primary-gradient);
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(10, 114, 245, 0.28);
    border-color: transparent;
    transform: translateY(-1px);
}
.premium-service-card, .hub-card, .modern-form, .voice-card, .industry-flow-item {
    background: rgba(255,255,255,.90);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(10, 114, 245, .12);
    box-shadow: 0 22px 62px rgba(4, 16, 31, .12);
    border-radius: var(--radius-xl);
    overflow: hidden;
    transition: transform var(--transition-slower), box-shadow var(--transition-slower), border-color var(--transition-slower);
}
.premium-service-card:hover, .voice-card:hover, .hub-card:hover, .modern-form:hover {
    transform: translate3d(0, -8px, 0);
    box-shadow: 0 32px 84px rgba(10, 114, 245, .16);
    border-color: rgba(10, 114, 245, .24);
}
.card-visual {
    background:
        linear-gradient(180deg, rgba(10, 114, 245, .96), rgba(5, 24, 54, .96));
    position: relative;
}
.card-visual::after {
    content: "";
    position: absolute;
    inset: auto -15% -55% -15%;
    height: 160px;
    background: radial-gradient(circle, rgba(127,200,255,.30), transparent 62%);
}
.card-content { padding: 30px; }
.card-actions-premium { display: flex; gap: 10px; }

.spotlight-bulk {
    position: relative;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: var(--navy-950);
    padding: 120px 0;
    overflow: hidden;
}
.spotlight-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(4,16,31,.96) 0%, rgba(4,16,31,.84) 38%, rgba(0,87,214,.50) 74%, rgba(10,114,245,.30) 100%),
        radial-gradient(circle at 75% 18%, rgba(63,224,239,.10), transparent 24%);
}
.workflow-card {
    background: rgba(255,255,255,.10);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    border-radius: 28px;
    padding: 28px;
    border: 1px solid rgba(255,255,255,.18);
    box-shadow: 0 28px 70px rgba(0, 0, 0, .24);
}
.step-num {
    width: 40px;
    height: 40px;
    background: linear-gradient(180deg, var(--sapphire-500), var(--sapphire-800));
    color: white;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 15px;
    flex-shrink: 0;
    box-shadow: 0 12px 24px rgba(10,114,245,.25);
}

.industries-flow {
    padding: 70px 0;
    background:
        linear-gradient(180deg, rgba(244,250,255,.94), rgba(255,255,255,.70));
    position: relative;
}
.industries-flow::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 0%, rgba(10,114,245,.06), transparent 28%);
    pointer-events: none;
}
.infinite-marquee-stream {
    display: flex;
    width: max-content;
    gap: 18px;
    animation: streamEngine 32s linear infinite;
    align-items: center;
}
@keyframes streamEngine {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-50%, 0, 0); }
}
.industry-flow-item {
    background: var(--white);
    padding: 14px 26px;
    border-radius: 9999px;
    font-weight: 700;
    color: var(--navy-950);
    font-size: 15px;
    white-space: nowrap;
}

.journey-timeline { padding: 110px 0; background: #ffffff; }
.timeline-wrapper::before {
    content: '';
    position: absolute;
    left: 28px;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--sapphire-500), var(--sapphire-800));
    border-radius: 9999px;
}
.timeline-marker {
    width: 60px;
    height: 60px;
    background: var(--white);
    border: 2px solid rgba(10, 114, 245, .22);
    color: var(--sapphire-700);
    font-weight: 850;
    font-size: 22px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    z-index: 2;
    box-shadow: var(--shadow-soft);
}

.action-hub {
    padding: 100px 0;
    background:
        linear-gradient(180deg, rgba(244,250,255,.90), rgba(255,255,255,.70));
}
.gateway-item {
    background: rgba(244, 250, 255, .88);
    border: 1px solid rgba(10, 114, 245, .10);
    border-radius: 12px;
}
.field label {
    display: block;
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--navy-800);
    letter-spacing: 0.05em;
}
.field input, .field select, .field textarea {
    width: 100%;
    border: 1px solid rgba(10, 114, 245, .14);
    background: var(--white);
    color: var(--ink-strong);
    border-radius: 14px;
    padding: 14px 16px;
    transition: border-color var(--transition-smooth), box-shadow var(--transition-smooth), transform var(--transition-smooth), background var(--transition-smooth);
}
.field input:focus, .field select:focus, .field textarea:focus {
    border-color: rgba(10, 114, 245, .44);
    box-shadow: 0 0 0 4px rgba(10, 114, 245, .10);
    transform: translate3d(0, -1px, 0);
    outline: none;
}
.form-status-banner {
    display: none;
    padding: 16px;
    border-radius: 12px;
    font-weight: 600;
    margin-bottom: 20px;
    text-align: center;
}
.form-status-banner.banner-success {
    background: rgba(40, 167, 69, 0.10);
    color: #1e7e34;
    border: 1px solid rgba(40, 167, 69, 0.18);
}
.form-status-banner.banner-error {
    background: rgba(220, 53, 69, 0.10);
    color: #bd2130;
    border: 1px solid rgba(220, 53, 69, 0.18);
}
.processing-spinner {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 3px solid rgba(255,255,255,0.3);
    border-radius: 50%;
    border-top-color: #fff;
    animation: spinEngine 0.8s linear infinite;
    vertical-align: middle;
    margin-right: 8px;
}
@keyframes spinEngine { to { transform: rotate(360deg); } }
.field-error-msg { color: var(--red-600); font-size: 11px; font-weight: 700; margin-top: 4px; display: none; }
.is-invalid-field { border-color: var(--red-600) !important; background-color: rgba(225,31,20,0.02) !important; }

.footer {
    background:
        linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(244,250,255,.96) 55%, rgba(232,245,255,.98) 100%);
    color: var(--muted) !important;
    border-top: 1px solid rgba(10, 114, 245, .12);
    padding: 64px 0 28px;
    position: relative;
}
.footer h4 {
    color: var(--navy-950) !important;
    margin-bottom: 16px;
    font-weight: 800;
}
.footer a {
    color: var(--navy-800) !important;
    font-weight: 700;
    display: block;
    margin: 8px 0;
    text-decoration: none;
    transition: color var(--transition-smooth), transform var(--transition-smooth), opacity var(--transition-smooth);
}
.footer a:hover { color: var(--sapphire-700) !important; transform: translate3d(3px, 0, 0); }
.footer-logo {
    display: block;
    width: auto;
    height: 68px;
    max-width: 230px;
    object-fit: contain;
    filter: drop-shadow(0 10px 20px rgba(10, 114, 245, .14));
}
.footer-socials { display: flex; gap: 8px; margin: 14px 0; }
.footer-social-btn {
    width: 40px;
    height: 40px;
    display: inline-grid !important;
    place-items: center;
    border-radius: 999px;
    color: var(--sapphire-800) !important;
    background: rgba(255, 255, 255, 0.90);
    border: 1px solid rgba(10, 114, 245, .16);
    box-shadow: 0 12px 28px rgba(10, 114, 245, .10);
}
.footer-social-btn:hover {
    transform: translate3d(0, -4px, 0) !important;
    color: #ffffff !important;
    background: var(--sapphire-700);
    border-color: rgba(10, 114, 245, .28);
    box-shadow: 0 18px 42px rgba(10, 114, 245, .22);
}
.footer-bottom { border-color: rgba(10, 114, 245, .10) !important; }

.reveal-on-scroll, .slide-up-card, .scale-up, .slide-in-left, .slide-in-right {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .75s ease, transform .75s cubic-bezier(.16,1,.3,1);
    will-change: opacity, transform;
}
.reveal-on-scroll.is-visible, .slide-up-card.is-visible, .scale-up.is-visible, .slide-in-left.is-visible, .slide-in-right.is-visible {
    opacity: 1;
    transform: none;
}
.slide-in-left { transform: translateX(-26px); }
.slide-in-right { transform: translateX(26px); }
.scale-up { transform: scale(.96); }

/* Footer visibility overrides */
.footer.premium-layered-footer {
    background:
        radial-gradient(circle at 15% 25%, rgba(8, 120, 242, 0.15) 0%, transparent 45%),
        radial-gradient(circle at 85% 75%, rgba(244, 63, 94, 0.10) 0%, transparent 45%),
        linear-gradient(135deg, #08111f 0%, #0b1324 55%, #111827 100%);
    color: #e5eefb !important;
    position: relative;
    overflow: hidden;
    border-top: 3px solid transparent;
    border-image: linear-gradient(to right, #0878f2, #f43f5e, #f97316) 1;
}

.footer.premium-layered-footer::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 0),
        linear-gradient(rgba(255, 255, 255, 0.015) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.015) 1px, transparent 1px);
    background-size: 16px 16px, 32px 32px, 32px 32px;
    pointer-events: none;
    opacity: 0.75;
    z-index: 1;
}

.footer-body,
.footer-bottom {
    position: relative;
    z-index: 2;
}

.footer-brand-column,
.footer-brand-column p,
.footer-brand-column a,
.footer-body p,
.footer-body li,
.footer-body span {
    color: #d8e6fb !important;
}

.footer h4,
.footer .text-white {
    color: #ffffff !important;
}

.footer-description-text {
    color: #d0dbee !important;
}

.footer-link {
    color: #b8c6d9 !important;
    transition: color 0.2s ease-in-out, padding-left 0.2s ease-in-out;
}

.footer-link:hover,
.footer-link:focus-visible {
    color: #7dd3fc !important;
    padding-left: 4px;
    text-decoration: none;
}

.footer-link-highlight {
    color: #7dd3fc !important;
}

.footer-link-highlight:hover,
.footer-link-highlight:focus-visible {
    color: #ffffff !important;
    padding-left: 4px;
    text-decoration: none;
}

.footer-mail-link {
    color: #ffffff !important;
    font-weight: 700;
    transition: color 0.2s ease-in-out;
}

.footer-mail-link:hover,
.footer-mail-link:focus-visible {
    color: #7dd3fc !important;
    text-decoration: none;
}

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

.footer-social-btn {
    width: 40px;
    height: 40px;
    display: inline-grid !important;
    place-items: center;
    border-radius: 999px;
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(125, 211, 252, 0.20);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
    text-decoration: none;
    transition: transform 0.25s ease, background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.footer-social-btn i {
    color: #ffffff !important;
    opacity: 1;
    font-size: 16px;
    line-height: 1;
}

.footer-social-btn:hover,
.footer-social-btn:focus-visible {
    background: #0a72f5 !important;
    border-color: rgba(255, 255, 255, 0.32);
    transform: translateY(-3px);
    box-shadow: 0 18px 42px rgba(10, 114, 245, 0.30);
    color: #ffffff !important;
    text-decoration: none;
}

.page-routing-links .sub-link {
    color: #9fb0c7 !important;
}

.page-routing-links .sub-link:hover,
.page-routing-links .sub-link:focus-visible {
    color: #7dd3fc !important;
}

.footer-bottom {
    border-top: 1px solid rgba(125, 211, 252, 0.14) !important;
    color: #c9d6e6 !important;
}

.footer-bottom span {
    color: #c9d6e6 !important;
}

.footer .opacity-70 {
    opacity: 1 !important;
}

.footer .fa,
.footer i {
    color: currentColor;
}

.footer-logo {
    filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.35));
}

@media (max-width: 991px) {
    .nav-links, .nav-actions { display: none !important; }
    .menu-toggle { display: inline-grid !important; place-items: center; }
    .hero-slider { min-height: 620px; height: auto; }
    .action-hub { background-attachment: scroll; }
    .timeline-wrapper::before { left: 18px; }
    .hero-actions { gap: 10px; }
    .card-actions-premium { flex-direction: column; }
    .promo-item-box { width: 320px; min-width: 320px; }
}

@media (max-width: 767px) {
    .container { width: min(var(--max-width), calc(100% - 24px)); }
    .topbar-inner { justify-content: center; text-align: center; }
    .nav { min-height: 70px; }
    .brand-logo, .footer-logo { height: 52px; }
    .hero-slider { min-height: 560px; }
    .promo-item-box { width: 300px; min-width: 300px; }
    .promo-image { height: 130px; }
    .impact-value { letter-spacing: -.05em; }
    .footer-bottom { flex-direction: column; gap: 6px; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
    .promo-marquee-engine, .infinite-marquee-stream, .pulse, .processing-spinner { animation: none !important; }
    .slide, .reveal-on-scroll, .slide-up-card, .scale-up, .slide-in-left, .slide-in-right { transform: none !important; opacity: 1 !important; }
}