/* Dark Theme Variables & Styles */
body.dark-mode {
    background-color: #0f172a !important;
    color: #f8fafc !important;
    position: relative;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}

body.dark-mode .nav-logo img,
body.dark-mode .stcs-logo,
body.dark-mode .navbar-brand img,
body.dark-mode .ft-logo img,
body.dark-mode img[src*="logo.png"]:not([src*="logo-dark.png"]) {
    content: url('../images/logo-dark.png') !important;
}

/* ── Prevent borders, strips, and dividers from rendering as bright white lines in Dark Mode ── */
body.dark-mode .site-footer,
body.dark-mode .hero-trust-strip,
body.dark-mode .ft-col:not(:first-child),
body.dark-mode .hero-trust-item,
body.dark-mode hr,
body.dark-mode [class*="divider"],
body.dark-mode [class*="-strip"],
body.dark-mode [class*="-bar"],
body.dark-mode [class*="-border"],
body.dark-mode section,
body.dark-mode header,
body.dark-mode footer {
    border-color: #334155 !important;
}

/* ── Dark mode styling for trust banner strips at bottom of heroes ── */
body.dark-mode .hero-trust-strip {
    background: #0f172a !important;
    border-top: 1px solid #334155 !important;
}
body.dark-mode .hero-trust-item {
    border-right: 1px solid #334155 !important;
}
body.dark-mode .hero-trust-text strong {
    color: #f8fafc !important;
}
body.dark-mode .hero-trust-text span {
    color: #94a3b8 !important;
}

/* Modern Animated Background for Dark Mode */
body.dark-mode::after {
    content: '';
    position: fixed;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: 
        radial-gradient(circle at 30% 40%, rgba(99, 102, 241, 0.08) 0%, transparent 40%),
        radial-gradient(circle at 70% 60%, rgba(168, 85, 247, 0.08) 0%, transparent 40%),
        radial-gradient(circle at 50% 80%, rgba(59, 130, 246, 0.08) 0%, transparent 40%);
    z-index: -1;
    pointer-events: none;
    animation: darkmodeFloat 25s infinite linear alternate;
}

@keyframes darkmodeFloat {
    0% { transform: rotate(0deg) scale(1); }
    100% { transform: rotate(10deg) scale(1.1); }
}

/* Ensure Hero Sections Block the Background Animation */
body.dark-mode .hero,
body.dark-mode .cs-hero,
body.dark-mode .page-hero,
body.dark-mode .contact-hero,
body.dark-mode .oh-hero,
body.dark-mode .oh-hero-cyber,
body.dark-mode .bd-hero,
body.dark-mode .rm-hero,
body.dark-mode .mo-hero {
    background-color: #0f172a !important;
}

/* yFibre logo button */
body.dark-mode .nav-yfibre-btn {
    background: #0f172a !important;
    border-color: rgba(249, 115, 22, 0.4) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}
body.dark-mode .nav-yfibre-btn:hover {
    background: #1e293b !important;
    border-color: #f97316 !important;
    box-shadow: 0 4px 15px rgba(249, 115, 22, 0.3) !important;
}

/* ── Global Responsive Navigation Adjustments ── */
/* Prevent text wrapping inside nav links and buttons */
.nav-links a,
.nav-cta,
.nav-yfibre-btn {
    white-space: nowrap !important;
}

/* Ensure the nav links are always visible, overriding welcome.blade.php hiding them on tablets */
.nav-links {
    display: flex !important;
}

/* These rules scale the navbar gracefully across all display sizes */
@media (max-width: 1300px) {
    nav { padding: 0 20px !important; }
    .nav-links { gap: 16px !important; margin-right: 20px !important; }
    .nav-links a { font-size: 0.85rem !important; padding: 6px 12px !important; }
}

@media (max-width: 1100px) {
    nav { padding: 0 15px !important; }
    .nav-links { gap: 10px !important; margin-right: 15px !important; }
    .nav-links a { font-size: 0.75rem !important; padding: 4px 8px !important; }
    .nav-logo img { height: 40px !important; }
    .nav-cta { padding: 8px 16px !important; font-size: 0.8rem !important; }
}

@media (max-width: 950px) {
    nav { padding: 0 10px !important; height: 60px !important; }
    .nav-links { gap: 5px !important; margin-right: 10px !important; }
    .nav-links a { font-size: 0.65rem !important; padding: 4px 6px !important; }
    .nav-logo img { height: 30px !important; }
    .nav-cta { padding: 6px 12px !important; font-size: 0.75rem !important; }
    .nav-yfibre-btn { height: 34px !important; padding: 0 10px !important; margin-right: 8px !important; }
    .nav-yfibre-btn img { height: 16px !important; }
}

@media (max-width: 768px) {
    /* Flow into a wrap for very small mobile screens */
    nav { 
        flex-wrap: wrap !important; 
        height: auto !important; 
        padding: 15px 10px !important; 
    }
    .nav-links { 
        display: flex !important;
        margin: 15px 0 0 0 !important; 
        width: 100% !important; 
        justify-content: center !important; 
        flex-wrap: wrap !important; 
        gap: 8px !important;
        order: 10 !important; 
    }
    .nav-logo { margin-right: auto !important; }
}


/* Navbar */
body.dark-mode nav {
    background-color: #1e293b !important;
    border-bottom: 1px solid #334155 !important;
}
body.dark-mode .nav-links a {
    color: #e2e8f0 !important;
}
body.dark-mode .nav-links a:hover,
body.dark-mode .nav-links a.active {
    color: #a78bfa !important;
    background-color: #334155 !important;
}

body.dark-mode .nav-dropdown-content {
    background-color: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
}

body.dark-mode .nav-dropdown-content a {
    color: #cbd5e1 !important;
}

body.dark-mode .nav-dropdown-content a:hover {
    background-color: #334155 !important;
    color: #a78bfa !important;
}

/* Sections */
body.dark-mode section,
body.dark-mode header,
body.dark-mode footer,
body.dark-mode main,
body.dark-mode .hero,
body.dark-mode .cs-hero,
body.dark-mode .starting-point,
body.dark-mode .cs-cases,
body.dark-mode .cs-comparison,
body.dark-mode .impact-section,
body.dark-mode .site-footer,
body.dark-mode .about-hero,
body.dark-mode .mission-vision,
body.dark-mode .timeline-sec,
body.dark-mode .testi-sec,
body.dark-mode .careers-hero,
body.dark-mode .benefits-sec,
body.dark-mode .roles-sec,
body.dark-mode .contact-hero,
body.dark-mode .contact-grid,
body.dark-mode .cred-hero,
body.dark-mode .awards-sec,
body.dark-mode .insights-hero,
body.dark-mode .articles-sec,
body.dark-mode .offerings-hero,
body.dark-mode .services-sec,
body.dark-mode .partners-hero,
body.dark-mode .ecosystem-sec,
body.dark-mode .global-reach,
body.dark-mode .stcs-intro,
body.dark-mode .stcs-vision,
body.dark-mode .solutions-section,
body.dark-mode .insights-section,
body.dark-mode .wwa-sec,
body.dark-mode .team-sec,
body.dark-mode .hub-sec,
body.dark-mode .pres-sec,
body.dark-mode .journey-sec,
body.dark-mode .why-sec,
body.dark-mode .cta-sec,
body.dark-mode .page-main,
body.dark-mode .smc-bg-decor,
body.dark-mode [class*="-sec"],
body.dark-mode [class*="sec-"] {
    background-color: #0f172a !important;
}

/* Fix for Leadership (team-sec) and Global Presence (pres-sec) backgrounds in dark mode */
body.dark-mode .team-sec {
    background-image: linear-gradient(rgba(15, 23, 42, 0.85), rgba(15, 23, 42, 0.95)), url('https://images.unsplash.com/photo-1557683316-973673baf926?q=80&w=1920&auto=format&fit=crop') !important;
}
body.dark-mode .pres-sec {
    background-image: none !important;
}

/* Universal Dark Mode Override for Impact Section & Wrappers across all pages */
body.dark-mode .impact-section {
    background: #0f172a !important;
    background-image: none !important;
}
/* Animated Aurora Background Keyframes */
@keyframes stcsAuroraFloat1 {
    0% { transform: translate(0px, 0px) scale(1); opacity: 0.65; }
    33% { transform: translate(-70px, 60px) scale(1.2); opacity: 0.95; }
    66% { transform: translate(50px, -40px) scale(0.85); opacity: 0.55; }
    100% { transform: translate(0px, 0px) scale(1); opacity: 0.65; }
}
@keyframes stcsAuroraFloat2 {
    0% { transform: translate(0px, 0px) scale(1); opacity: 0.55; }
    50% { transform: translate(80px, -70px) scale(1.25); opacity: 0.85; }
    100% { transform: translate(-50px, 50px) scale(0.9); opacity: 0.55; }
}
@keyframes stcsBgGradientAnimate {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

body.dark-mode .impact-card-wrapper,
body.dark-mode .impact-container {
    position: relative !important;
    overflow: hidden !important;
    z-index: 1 !important;
    background: linear-gradient(-45deg, #0f172a, #1e293b, #111827, #1e1b4b) !important;
    background-size: 300% 300% !important;
    animation: stcsBgGradientAnimate 15s ease infinite !important;
    border: 1px solid rgba(168, 85, 247, 0.25) !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6), 0 0 45px rgba(168, 85, 247, 0.12) !important;
    border-radius: 28px !important;
}
body.dark-mode .impact-card-wrapper > *,
body.dark-mode .impact-container > * {
    position: relative !important;
    z-index: 2 !important;
}
body.dark-mode .impact-card-wrapper::before,
body.dark-mode .impact-container::before {
    content: '' !important;
    position: absolute !important;
    top: -20% !important;
    right: -10% !important;
    width: 550px !important;
    height: 550px !important;
    border-radius: 50% !important;
    background: radial-gradient(circle, rgba(192, 132, 252, 0.35) 0%, rgba(129, 140, 248, 0.18) 45%, transparent 70%) !important;
    pointer-events: none !important;
    z-index: 0 !important;
    animation: stcsAuroraFloat1 12s ease-in-out infinite alternate !important;
    filter: blur(45px) !important;
    opacity: 0.85 !important;
}
body.dark-mode .impact-card-wrapper::after,
body.dark-mode .impact-container::after {
    content: '' !important;
    position: absolute !important;
    bottom: -20% !important;
    left: -10% !important;
    width: 600px !important;
    height: 600px !important;
    border-radius: 50% !important;
    background: radial-gradient(circle, rgba(244, 114, 182, 0.28) 0%, rgba(56, 189, 248, 0.18) 50%, transparent 70%) !important;
    pointer-events: none !important;
    z-index: 0 !important;
    animation: stcsAuroraFloat2 16s ease-in-out infinite alternate !important;
    filter: blur(50px) !important;
    opacity: 0.85 !important;
}
body.dark-mode .imp-eyebrow {
    background: rgba(168, 85, 247, 0.15) !important;
    color: #c084fc !important;
}
body.dark-mode .imp-title {
    color: #f8fafc !important;
}
body.dark-mode .imp-desc {
    color: #94a3b8 !important;
}
body.dark-mode .imp-feature-card,
body.dark-mode .imp-card {
    background: #1e293b !important;
    background-color: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4) !important;
}
body.dark-mode .imp-feature-card:hover,
body.dark-mode .imp-card:hover {
    background: #0f172a !important;
    border-color: #8b5cf6 !important;
}
body.dark-mode .imp-info h4,
body.dark-mode .imp-c-text h4 {
    color: #f8fafc !important;
}
body.dark-mode .imp-info p,
body.dark-mode .imp-c-text p {
    color: #94a3b8 !important;
}
body.dark-mode .imp-btn-secondary {
    background: #1e293b !important;
    color: #f8fafc !important;
    border-color: #334155 !important;
}
body.dark-mode .imp-btn-secondary:hover {
    background: #0f172a !important;
    border-color: #a855f7 !important;
    color: #a855f7 !important;
}
body.dark-mode .pres-sec .section-eyebrow {
    color: #fb7185 !important;
    background: rgba(251, 113, 133, 0.15) !important;
    border-color: rgba(251, 113, 133, 0.3) !important;
}
body.dark-mode .tc-note {
    background: rgba(255,255,255,0.05) !important;
    color: #cbd5e1 !important;
}
body.dark-mode .team-card:hover .tc-note {
    background: rgba(255,255,255,0.08) !important;
}

/* Partnerships Page - Custom Animated Dark Mode Backgrounds */
body.dark-mode .ps-approach,
body.dark-mode .ps-ecosystem,
body.dark-mode .ps-contact {
    background-color: #0f172a !important;
    /* Combines a tech dot matrix with floating aurora glows */
    background-image: 
        radial-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        radial-gradient(circle at 15% 25%, rgba(147, 51, 234, 0.12) 0%, transparent 40%),
        radial-gradient(circle at 85% 75%, rgba(20, 184, 166, 0.12) 0%, transparent 40%) !important;
    background-size: 30px 30px, 100% 100%, 100% 100% !important;
    background-position: 0 0, 0 0, 0 0 !important;
    animation: psModernTechBg 20s linear infinite !important;
}

@keyframes psModernTechBg {
    0% { 
        background-position: 0px 0px, 0% 0%, 100% 100%; 
    }
    50% {
        background-position: 15px 15px, 50% 50%, 50% 50%;
    }
    100% { 
        background-position: 30px 30px, 100% 100%, 0% 0%; 
    }
}

/* Hero Overlays for seamless image blending in dark mode */
body.dark-mode .hero-overlay,
body.dark-mode .offerings-hero-overlay,
body.dark-mode .about-hero-overlay,
body.dark-mode .cred-hero-overlay,
body.dark-mode .cs-hero-overlay,
body.dark-mode .page-hero-overlay {
    background: linear-gradient(90deg, #0f172a 0%, rgba(15, 23, 42, 0.85) 20%, rgba(15, 23, 42, 0.2) 50%, rgba(15, 23, 42, 0) 100%) !important;
}

/* Enhanced Achievements Animated Background in Dark Mode */
body.dark-mode .ach-cyber-grid {
    background-image: 
        linear-gradient(to right, rgba(168, 85, 247, 0.14) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(168, 85, 247, 0.14) 1px, transparent 1px) !important;
}
body.dark-mode .ach-orb {
    opacity: 0.45 !important;
    filter: blur(75px) !important;
}
body.dark-mode .ach-ring-outer {
    border-color: rgba(168, 85, 247, 0.55) !important;
}
body.dark-mode .ach-ring-inner {
    border-color: rgba(6, 182, 212, 0.55) !important;
}
body.dark-mode .ach-ring-core {
    border-color: rgba(236, 72, 153, 0.45) !important;
}
body.dark-mode .ach-particle {
    box-shadow: 0 0 14px currentColor, 0 0 28px currentColor !important;
}

/* Cards & Containers */
body.dark-mode .net-card,
body.dark-mode .sp-card,
body.dark-mode .cs-metrics-card,
body.dark-mode .cs-case-card,
body.dark-mode .imp-card,
body.dark-mode .role-card,
body.dark-mode .benefit-card,
body.dark-mode .award-card,
body.dark-mode .article-card,
body.dark-mode .service-card,
body.dark-mode .partner-card,
body.dark-mode .compare-grid,
body.dark-mode .cg-cell,
body.dark-mode .iso-badge {
    background: #1e293b !important;
    background-color: #1e293b !important;
    color: #f8fafc !important;
    border-color: #334155 !important;
}

/* Fix Stats Bar and Bottom Stats Strips in Dark Mode */
body.dark-mode .stats-bar,
body.dark-mode .lc-stats,
body.dark-mode [class*="-stats"]:not([class*="bar"]):not([class*="wrap"]):not([class*="grid"]):not([class*="flex"]):not([class*="left"]):not([class*="right"]),
body.dark-mode [class*="stats-"]:not([class*="bar"]):not([class*="wrap"]):not([class*="grid"]):not([class*="flex"]):not([class*="left"]):not([class*="right"]) {
    background: #1e293b !important;
    background-color: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}
body.dark-mode .stats-bar {
    border-left: none !important;
    border-right: none !important;
}
body.dark-mode .stat-col,
body.dark-mode .lc-stat {
    background: transparent !important;
    border-color: #334155 !important;
}
body.dark-mode .stat-col {
    border-right: 1px solid #334155 !important;
}
body.dark-mode .stat-col:last-child {
    border-right: none !important;
}
body.dark-mode .stat-col .stat-num,
body.dark-mode .lc-stat-num,
body.dark-mode [class*="-stat-num"],
body.dark-mode [class*="stat-num-"],
body.dark-mode [class*="-num"]:not([class*="badge"]),
body.dark-mode [class*="num-"]:not([class*="badge"]) {
    color: #f8fafc !important;
}
body.dark-mode .stat-col .stat-name,
body.dark-mode .lc-stat-label,
body.dark-mode [class*="-stat-label"],
body.dark-mode [class*="stat-label-"],
body.dark-mode [class*="-label"]:not([class*="btn"]),
body.dark-mode [class*="label-"]:not([class*="btn"]) {
    color: #cbd5e1 !important;
}
body.dark-mode .stat-col .stat-desc {
    color: #94a3b8 !important;
}
body.dark-mode .stat-icon-wrap,
body.dark-mode .lc-stat-icon {
    background: rgba(79, 70, 229, 0.2) !important;
}
body.dark-mode .stat-icon-wrap svg,
body.dark-mode .lc-stat-icon svg {
    color: #a78bfa !important;
}
body.dark-mode .lc-stats div[style*="background:#e5e7eb"],
body.dark-mode .lc-stats div[style*="background: #e5e7eb"],
body.dark-mode .lc-stats div[style*="background: rgb(229, 231, 235)"],
body.dark-mode .lc-stats div[style*="width:1px"],
body.dark-mode .lc-stats div[style*="width: 1px"] {
    background: #334155 !important;
}

/* Fix Customer Success Cards and Filters */
body.dark-mode .cs-case-card {
    background-image: none !important;
}
body.dark-mode .csc-wide-img::before {
    background: linear-gradient(to right, #1e293b, transparent) !important;
}
body.dark-mode .cs-filter-btn {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #cbd5e1 !important;
}
body.dark-mode .cs-filter-btn:hover {
    border-color: #3b82f6 !important;
    color: #60a5fa !important;
}
body.dark-mode .cs-filter-btn.active {
    background: #2563eb !important;
    color: #ffffff !important;
    border-color: #2563eb !important;
}
body.dark-mode .form-container,
body.dark-mode .contact-info-card,
body.dark-mode .ft-bottom-bar,
body.dark-mode .testimonial-card,
body.dark-mode .timeline-item,
body.dark-mode .value-card,
body.dark-mode .ad-conclusion,
body.dark-mode .ad-cta-banner,
body.dark-mode .cc-intro-box,
body.dark-mode .cc-pillar,
body.dark-mode .wp-section-wrap,
body.dark-mode .wp-hero,
body.dark-mode .wp-intro,
body.dark-mode .wp-readiness,
body.dark-mode .wp-perspective,
body.dark-mode .wp-conclusion,
body.dark-mode .wp-stats-banner,
body.dark-mode .contact-features,
body.dark-mode .lc-stats,
body.dark-mode .where-operate,
body.dark-mode .wo-map-box,
body.dark-mode .wo-features-box,
body.dark-mode [class*="-stats"]:not([class*="bar"]):not([class*="wrap"]):not([class*="grid"]):not([class*="flex"]):not([class*="left"]):not([class*="right"]),
body.dark-mode [class*="stats-"]:not([class*="bar"]):not([class*="wrap"]):not([class*="grid"]):not([class*="flex"]):not([class*="left"]):not([class*="right"]),
body.dark-mode [class*="-strip"]:not([class*="trust"]),
body.dark-mode [class*="strip-"]:not([class*="trust"]),
body.dark-mode [class*="-banner"]:not([class*="img"]):not([class*="bg"]),
body.dark-mode [class*="banner-"]:not([class*="img"]):not([class*="bg"]),
body.dark-mode [class*="-wrapper"]:not([class*="img"]):not([class*="hero"]):not([class*="section"]):not([class*="icon"]):not([class*="btn"]):not([class*="link"]),
body.dark-mode [class*="wrapper-"]:not([class*="img"]):not([class*="hero"]):not([class*="section"]):not([class*="icon"]):not([class*="btn"]):not([class*="link"]),
body.dark-mode [class*="-card"]:not([class*="img"]):not([class*="overlay"]):not([class*="title"]):not([class*="desc"]):not([class*="footer"]):not([class*="badge"]):not([class*="mini-cards"]),
body.dark-mode [class*="card-"]:not([class*="img"]):not([class*="overlay"]):not([class*="title"]):not([class*="desc"]):not([class*="footer"]):not([class*="badge"]):not([class*="mini-cards"]),
body.dark-mode [class*="-box"]:not([class*="checkbox"]):not([class*="intro-box"]):not([class*="mini"]):not([class*="shadow"]),
body.dark-mode [class*="box-"]:not([class*="shadow"]),
body.dark-mode [class*="-panel"],
body.dark-mode [class*="panel-"],
body.dark-mode [class*="-tile"],
body.dark-mode [class*="-cell"]:not([class*="hsg-cell"]),
body.dark-mode [class*="content-box"],
body.dark-mode [class*="feature-box"],
body.dark-mode [class*="stat-box"],
body.dark-mode [class*="info-box"],
body.dark-mode [class*="step-card"],
body.dark-mode [class*="process-card"],
body.dark-mode [class*="bento-cell"],
body.dark-mode [class*="bento-item"],
body.dark-mode .card,
body.dark-mode .list-group-item,
body.dark-mode .accordion-item,
body.dark-mode .modal-content {
    background-color: #1e293b !important;
    color: #f8fafc !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3) !important;
}

body.dark-mode .accordion-button:not(.collapsed) {
    background-color: #334155 !important;
    color: #a78bfa !important;
}

body.dark-mode .accordion-button::after {
    filter: invert(1) grayscale(100%) !important;
}

body.dark-mode .cc-intro-right,
body.dark-mode .wp-intro-text {
    border-color: #334155 !important;
}

/* Specific text overrides to ensure readability */
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode .text-dark,
body.dark-mode .text-black,
body.dark-mode [class*="-title"]:not([class*="btn"]):not([class*="badge"]),
body.dark-mode [class*="title-"]:not([class*="btn"]):not([class*="badge"]),
body.dark-mode [class*="-head"]:not([class*="btn"]),
body.dark-mode [class*="head-"]:not([class*="btn"]),
body.dark-mode [class*="-name"],
body.dark-mode [class*="name-"],
body.dark-mode [class*="-val"],
body.dark-mode [class*="val-"],
body.dark-mode strong,
body.dark-mode b,
body.dark-mode th,
body.dark-mode td,
body.dark-mode label,
body.dark-mode .lead,
body.dark-mode .net-val,
body.dark-mode .stat-num,
body.dark-mode .hero-h1,
body.dark-mode .hero-h1 .line-dark,
body.dark-mode .hero h1,
body.dark-mode .hero h1 span,
body.dark-mode .oh-title,
body.dark-mode .ch-title,
body.dark-mode .ch-title span,
body.dark-mode .page-hero h1,
body.dark-mode .ad-title,
body.dark-mode .cc-title,
body.dark-mode .wp-hero-title,
body.dark-mode .sp-h2,
body.dark-mode .csc-title,
body.dark-mode .imp-title,
body.dark-mode .ft-company-name,
body.dark-mode .compare-title,
body.dark-mode .cs-title,
body.dark-mode .section-title,
body.dark-mode .ch-breadcrumbs,
body.dark-mode .ch-breadcrumbs i,
body.dark-mode .ch-eyebrow,
body.dark-mode .smc-title-area h2,
body.dark-mode .smc-item-text,
body.dark-mode .smc-item-text strong,
body.dark-mode .diff-card h4,
body.dark-mode .ad-conclusion h4,
body.dark-mode .ad-cta-text h3,
body.dark-mode .wp-split-head,
body.dark-mode .wp-stat-info strong,
body.dark-mode .cffi-text h4 {
    color: #f8fafc !important;
}

body.dark-mode p,
body.dark-mode .text-muted,
body.dark-mode .text-secondary,
body.dark-mode [class*="-desc"],
body.dark-mode [class*="desc-"],
body.dark-mode [class*="-sub"]:not([class*="submit"]),
body.dark-mode [class*="sub-"]:not([class*="submit"]),
body.dark-mode [class*="-text"]:not([class*="btn"]):not([class*="badge"]):not([class*="purple"]):not([class*="blue"]):not([class*="teal"]):not([class*="orange"]):not([class*="green"]),
body.dark-mode [class*="text-"]:not([class*="btn"]):not([class*="badge"]):not([class*="purple"]):not([class*="blue"]):not([class*="teal"]):not([class*="orange"]):not([class*="green"]),
body.dark-mode [class*="-label"],
body.dark-mode [class*="label-"],
body.dark-mode [class*="-note"],
body.dark-mode [class*="note-"],
body.dark-mode [class*="-info"],
body.dark-mode [class*="info-"],
body.dark-mode li,
body.dark-mode .net-label,
body.dark-mode .stat-name,
body.dark-mode .hero-sub,
body.dark-mode .hero-desc,
body.dark-mode .oh-desc,
body.dark-mode .ch-desc,
body.dark-mode .hero p,
body.dark-mode .sp-sub,
body.dark-mode .imp-desc,
body.dark-mode .cs-desc,
body.dark-mode .ft-desc,
body.dark-mode .csc-desc,
body.dark-mode .section-desc,
body.dark-mode .adt-bullets li,
body.dark-mode .diff-card p,
body.dark-mode .ad-conclusion p,
body.dark-mode .ad-cta-text p,
body.dark-mode .cc-pillar ul li,
body.dark-mode .wp-hero-subtitle,
body.dark-mode .wp-r-sub,
body.dark-mode .wp-step p,
body.dark-mode .wp-p-content p,
body.dark-mode .wp-c-text,
body.dark-mode .wp-stat-info span,
body.dark-mode .cffi-text p,
body.dark-mode .cf-label,
body.dark-mode .cfs-desc {
    color: #cbd5e1 !important;
}

/* Gradients that should remain */
body.dark-mode .hero-h1 .line-grad,
body.dark-mode .imp-title .grad-text {
    background: linear-gradient(135deg, #818cf8, #c084fc, #e879f9) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Footers */
body.dark-mode .ft-col ul li a {
    color: #cbd5e1 !important;
}
body.dark-mode .ft-col ul li a:hover {
    color: #f8fafc !important;
}

/* Navbar Theme Switcher */
.nav-theme-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background: rgba(0, 0, 0, 0.03);
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.3);
    color: #4b5563;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-right: 15px !important;
    margin-left: 0 !important;
    flex-shrink: 0 !important;
}
.nav-theme-toggle:hover {
    background: rgba(0, 0, 0, 0.06);
    color: #4f46e5;
    transform: translateY(-1px);
}

/* Dark mode overrides for the switcher itself */
body.dark-mode .nav-theme-toggle {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.1);
    color: #cbd5e1;
}
body.dark-mode .nav-theme-toggle:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #f8fafc;
}

/* ── EPIC LIFECYCLE DARK MODE OVERRIDES ── */
body.dark-mode .oh-lifecycle {
    background: #0b0f19 !important;
}

body.dark-mode .ohl-eyebrow {
    color: #c084fc !important;
}

body.dark-mode .ohl-title {
    color: #f8fafc !important;
}

body.dark-mode .ohl-title .text-purple {
    color: #818cf8 !important;
}

body.dark-mode .ohl-desc {
    color: #94a3b8 !important;
}

body.dark-mode .ohl-card {
    background-color: #111827 !important;
    border: 1px solid #1f2937 !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4) !important;
}

body.dark-mode .ohl-card:hover {
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.6) !important;
    border-color: var(--theme-color) !important;
}

body.dark-mode .ohl-card-bg {
    width: 100% !important;
    background-color: transparent !important;
    opacity: 1 !important;
    mask-image: linear-gradient(to right, transparent 0%, black 35%) !important;
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 35%) !important;
}

body.dark-mode .ohl-card-content {
    background: linear-gradient(to right, #111827 20%, rgba(17, 24, 39, 0.6) 45%, rgba(17, 24, 39, 0.05) 75%, transparent 100%) !important;
}

body.dark-mode .ohl-card h3 {
    color: #f8fafc !important;
}

body.dark-mode .ohl-card p {
    color: #94a3b8 !important;
}

body.dark-mode .oh-mini-cards {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

body.dark-mode .oh-mcard {
    background: #1e293b !important;
    border: 1px solid #334155 !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4) !important;
}

body.dark-mode .oh-mcard:hover {
    background: #0f172a !important;
    border-color: var(--theme-color, #8b5cf6) !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6) !important;
}

body.dark-mode .oh-mcard span {
    color: #f8fafc !important;
}

body.dark-mode .ohl-phase {
    color: var(--theme-color) !important;
}

body.dark-mode .ohl-icon {
    background: var(--theme-color) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4) !important;
}

body.dark-mode .ohl-tags span {
    background: rgba(255, 255, 255, 0.08) !important;
    color: var(--theme-color) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .ohl-explore {
    color: var(--theme-color) !important;
}

body.dark-mode .theme-purple {
    --theme-color: #a78bfa;
    --theme-light: rgba(167, 139, 250, 0.15);
    --theme-shadow: rgba(167, 139, 250, 0.3);
}

body.dark-mode .theme-blue {
    --theme-color: #60a5fa;
    --theme-light: rgba(96, 165, 250, 0.15);
    --theme-shadow: rgba(96, 165, 250, 0.3);
}

body.dark-mode .theme-teal {
    --theme-color: #2dd4bf;
    --theme-light: rgba(45, 212, 191, 0.15);
    --theme-shadow: rgba(45, 212, 191, 0.3);
}

body.dark-mode .theme-orange {
    --theme-color: #fb923c;
    --theme-light: rgba(251, 146, 60, 0.15);
    --theme-shadow: rgba(251, 146, 60, 0.3);
}

body.dark-mode .theme-green {
    --theme-color: #4ade80;
    --theme-light: rgba(74, 222, 128, 0.15);
    --theme-shadow: rgba(74, 222, 128, 0.3);
}

/* Darken hero backgrounds in dark mode for readable text */
body.dark-mode .cs-hero-bg,
body.dark-mode .hero-bg,
body.dark-mode .oh-hero-bg,
body.dark-mode .hero-bg-img {
    filter: brightness(0.35) grayscale(0.1) !important;
}

body.dark-mode .page-hero::before,
body.dark-mode .contact-hero::before,
body.dark-mode .careers-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.7) !important;
    z-index: 1;
    pointer-events: none;
}



/* ── Modern Dark Mode Animations ── */
/* Upgrades the default scroll reveal to a premium blur-fade-scale effect */
body.dark-mode .stcs-reveal {
    opacity: 0 !important;
    transform: translateY(40px) scale(0.97) !important;
    filter: blur(10px) !important;
    transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), 
                transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), 
                filter 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
}

body.dark-mode .stcs-reveal.active {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
    filter: blur(0) !important;
}

/* ── OEM ECOSYSTEM SECTION ── */
body.dark-mode .oem-ecosystem {
    background: transparent !important;
}

body.dark-mode .oem-title {
    color: #f8fafc !important;
}

body.dark-mode .oem-sub {
    color: #94a3b8 !important;
}

body.dark-mode .oem-sub-hl {
    color: #a78bfa !important;
}

body.dark-mode .oem-logos-container,
body.dark-mode .oem-features-container {
    background: rgba(30, 41, 59, 0.7) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2) !important;
}

body.dark-mode .oem-marquee-item {
    background: rgba(30, 41, 59, 0.4) !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .oem-marquee-item:hover {
    background: rgba(30, 41, 59, 0.8) !important;
    border-color: rgba(99, 102, 241, 0.4) !important;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.4), inset 0 0 0 1px rgba(99, 102, 241, 0.3) !important;
}

body.dark-mode .oem-logo-name {
    color: #94a3b8 !important;
}

body.dark-mode .oem-feat-icon {
    background: rgba(99, 102, 241, 0.2) !important;
    color: #a78bfa !important;
}

body.dark-mode .oem-feat-text h4 {
    color: #f8fafc !important;
}

body.dark-mode .oem-feat-text p {
    color: #94a3b8 !important;
}

body.dark-mode .oem-cta-btn {
    background: #1e293b !important;
    border-color: #818cf8 !important;
    color: #818cf8 !important;
}

body.dark-mode .oem-cta-btn:hover {
    background: #818cf8 !important;
    color: #ffffff !important;
}

body.dark-mode .oem-feat-divider {
    background: #334155 !important;
}

/* ── WORLD OPERATIONS (WO) SECTION ── */
body.dark-mode .wo-pre-title {
    color: #a78bfa !important;
}

body.dark-mode .wo-h2 {
    color: #f8fafc !important;
}

body.dark-mode .wo-sub {
    color: #94a3b8 !important;
}

body.dark-mode .wo-stat-card,
body.dark-mode .wo-features-box {
    background: #1e293b !important;
    border-color: #334155 !important;
}

body.dark-mode .wo-stat-icon {
    background: rgba(126, 34, 206, 0.2) !important;
    color: #c084fc !important;
}

body.dark-mode .wo-stat-val {
    color: #818cf8 !important;
}

body.dark-mode .wo-stat-title,
body.dark-mode .wo-feat-title {
    color: #f8fafc !important;
}

body.dark-mode .wo-stat-desc,
body.dark-mode .wo-feat-desc {
    color: #94a3b8 !important;
}

body.dark-mode .wo-btn {
    border-color: #818cf8 !important;
    color: #818cf8 !important;
}

body.dark-mode .wo-btn:hover {
    background: #818cf8 !important;
    color: #ffffff !important;
}

body.dark-mode .bd-process-img {
    mix-blend-mode: normal !important;
    background-color: #f8fafc !important;
    border-radius: 16px !important;
    padding: 20px !important;
}

/* Fix for Partnership illustration (handshake on puzzle) in dark mode */
body.dark-mode .ps-illustration {
    mix-blend-mode: normal !important;
    background-color: #f8fafc !important;
    border-radius: 16px !important;
    padding: 20px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5) !important;
}

body.dark-mode .wo-node-label {
    background: #1e293b !important;
    color: #e2e8f0 !important;
    border: 1px solid #334155 !important;
}

body.dark-mode .wo-node-center-title {
    color: #f8fafc !important;
}

body.dark-mode .wo-node-center-sub {
    color: #94a3b8 !important;
}

body.dark-mode .wo-feat-icon {
    background: rgba(79, 70, 229, 0.2) !important;
    color: #a78bfa !important;
}

/* Contact Form Overrides */
body.dark-mode .cf-input,
body.dark-mode .form-control,
body.dark-mode .form-select,
body.dark-mode input[type="text"],
body.dark-mode input[type="email"],
body.dark-mode input[type="tel"],
body.dark-mode textarea,
body.dark-mode select {
    background-color: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}
body.dark-mode .cf-input::placeholder,
body.dark-mode .form-control::placeholder,
body.dark-mode textarea::placeholder,
body.dark-mode input::placeholder {
    color: #94a3b8 !important;
}

/* Feature Bar Dark Mode */
body.dark-mode .oh-feature-bar {
    background: #111827 !important;
    border: 1px solid #1f2937 !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6) !important;
}
body.dark-mode .ohfb-item {
    border-right: 1px solid #1f2937 !important;
}
body.dark-mode .ohfb-icon {
    background: #1e293b !important;
}
body.dark-mode .ohfb-text h4 {
    color: #f8fafc !important;
}
body.dark-mode .ohfb-text p {
    color: #94a3b8 !important;
}

/* Stats Section Dark Mode */
body.dark-mode .stats-sec {
    background: #0f172a !important;
}
body.dark-mode .stats-header h2 {
    color: #f8fafc !important;
}
body.dark-mode .stats-header p {
    color: #cbd5e1 !important;
}
body.dark-mode .bento-cell:nth-child(1) { background: rgba(2, 132, 199, 0.05) !important; border-color: rgba(2, 132, 199, 0.2) !important; }
body.dark-mode .bento-cell:nth-child(2) { background: rgba(192, 38, 211, 0.05) !important; border-color: rgba(192, 38, 211, 0.2) !important; }
body.dark-mode .bento-cell:nth-child(3) { background: rgba(5, 150, 105, 0.05) !important; border-color: rgba(5, 150, 105, 0.2) !important; }
body.dark-mode .bento-cell:nth-child(4) { background: rgba(234, 88, 12, 0.05) !important; border-color: rgba(234, 88, 12, 0.2) !important; }
body.dark-mode .bento-cell:nth-child(5) { background: rgba(220, 38, 38, 0.05) !important; border-color: rgba(220, 38, 38, 0.2) !important; }

body.dark-mode .bento-num {
    color: #f8fafc !important;
}
body.dark-mode .bento-label {
    color: #cbd5e1 !important;
}
body.dark-mode .bento-desc {
    color: #94a3b8 !important;
}

/* Manufacturing Section Dark Mode */
body.dark-mode .india-sec {
    background: #0f172a !important;
    border-color: #1e293b !important;
}
body.dark-mode .india-left h2 {
    color: #f8fafc !important;
}
body.dark-mode .india-left > p {
    color: #cbd5e1 !important;
}
body.dark-mode .mfg-item {
    background: rgba(255, 255, 255, 0.03) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}
body.dark-mode .mfg-item:hover {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(37, 99, 235, 0.4) !important;
}
body.dark-mode .mfg-content h4 {
    color: #f8fafc !important;
}
body.dark-mode .mfg-content p {
    color: #94a3b8 !important;
}
body.dark-mode .mfg-dot {
    background: rgba(37, 99, 235, 0.1) !important;
    border-color: rgba(37, 99, 235, 0.3) !important;
}

/* Technology Credentials Dark Mode */
body.dark-mode .tech-sec {
    background-image: linear-gradient(rgba(15, 23, 42, 0.85), rgba(15, 23, 42, 0.95)), url('https://images.unsplash.com/photo-1550684848-fac1c5b4e853?q=80&w=1920&auto=format&fit=crop') !important;
}
body.dark-mode .tech-header h2 {
    color: #f8fafc !important;
}
body.dark-mode .tech-header p {
    color: #cbd5e1 !important;
}
body.dark-mode .tech-domain {
    background: rgba(30, 41, 59, 0.7) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}
body.dark-mode .tech-domain:hover {
    background: rgba(30, 41, 59, 0.9) !important;
}
body.dark-mode .tech-domain:nth-child(1) { background: linear-gradient(135deg, rgba(30, 41, 59, 0.8), rgba(37, 99, 235, 0.1)) !important; border-color: rgba(37, 99, 235, 0.2) !important; }
body.dark-mode .tech-domain:nth-child(2) { background: linear-gradient(135deg, rgba(30, 41, 59, 0.8), rgba(124, 58, 237, 0.1)) !important; border-color: rgba(124, 58, 237, 0.2) !important; }
body.dark-mode .tech-domain:nth-child(3) { background: linear-gradient(135deg, rgba(30, 41, 59, 0.8), rgba(225, 29, 72, 0.1)) !important; border-color: rgba(225, 29, 72, 0.2) !important; }

body.dark-mode .td-title {
    color: #f8fafc !important;
}
body.dark-mode .td-tag {
    color: #94a3b8 !important;
}
body.dark-mode .td-icon {
    background: rgba(255, 255, 255, 0.05) !important;
}

/* Credentials Hero Dark Mode */
body.dark-mode .hero {
    background-color: #0f172a !important;
}
body.dark-mode .hero-bg {
    opacity: 0.1 !important;
    mix-blend-mode: normal !important;
}
body.dark-mode .trust-pill {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #cbd5e1 !important;
}
body.dark-mode .hero-desc {
    color: #94a3b8 !important;
}
body.dark-mode .hero-stats-panel {
    background: #1e293b !important;
    border-color: #334155 !important;
}
body.dark-mode .hero-stats-grid {
    background: #334155 !important;
}
body.dark-mode .hsg-cell:nth-child(1) { background: linear-gradient(145deg, rgba(30, 41, 59, 0.9), rgba(59, 130, 246, 0.1)) !important; }
body.dark-mode .hsg-cell:nth-child(2) { background: linear-gradient(145deg, rgba(30, 41, 59, 0.9), rgba(34, 197, 94, 0.1)) !important; }
body.dark-mode .hsg-cell:nth-child(3) { background: linear-gradient(145deg, rgba(30, 41, 59, 0.9), rgba(217, 70, 239, 0.1)) !important; }
body.dark-mode .hsg-cell:nth-child(4) { background: linear-gradient(145deg, rgba(30, 41, 59, 0.9), rgba(245, 158, 11, 0.1)) !important; }
body.dark-mode .hsg-cell:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}
body.dark-mode .hsg-num {
    color: #f8fafc !important;
}
body.dark-mode .hsg-label {
    color: #cbd5e1 !important;
}
body.dark-mode .hero-bottom-bar {
    background: rgba(255, 255, 255, 0.03) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}
body.dark-mode .hbb-text {
    color: #cbd5e1 !important;
}
body.dark-mode .hbb-icon {
    background: rgba(59, 130, 246, 0.1) !important;
    border-color: rgba(59, 130, 246, 0.3) !important;
}

/* ── UNIVERSAL ANTI-OVERLAP NAVBAR BUTTON FIX ── */
.nav-theme-toggle,
.nav-yfibre-btn,
.nav-cta,
.nav-logo,
.stcs-nav-actions {
    flex-shrink: 0 !important;
}

.stcs-nav-actions {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
}

.stcs-nav-actions .nav-theme-toggle,
.stcs-nav-actions .nav-yfibre-btn,
.stcs-nav-actions .nav-cta {
    margin: 0 !important;
    flex-shrink: 0 !important;
    position: relative !important;
    z-index: 10 !important;
}

/* Base Theme Toggle Button Styling */
.nav-theme-toggle {
    height: 42px !important;
    min-height: 42px !important;
    display: inline-flex;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    position: relative !important;
    z-index: 10 !important;
    margin: 0 !important;
    transition: all 0.25s ease !important;
}

/* Desktop Theme Switcher (Icon Only) */
@media (min-width: 1200px) {
    .stcs-mobile-header-btn {
        display: none !important;
    }
    .stcs-theme-btn-menu {
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
        border-radius: 8px !important;
    }
}

/* Mobile Menu Actions Bar */
@media (max-width: 1199px) {
    .stcs-nav-actions {
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        margin-top: 16px !important;
        padding-top: 16px !important;
        border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
        gap: 12px !important;
    }
    body.dark-mode .stcs-nav-actions .nav-yfibre-btn,
    body.dark-mode .stcs-nav-actions .nav-cta {
        width: 100% !important;
        height: 46px !important;
        justify-content: center !important;
    }
}

.nav-yfibre-btn {
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    position: relative !important;
    z-index: 10 !important;
    margin-right: 15px !important;
    white-space: nowrap !important;
    background: #0f172a !important;
    border: 1px solid rgba(249, 115, 22, 0.35) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.nav-yfibre-btn:hover {
    background: #1e293b !important;
    border-color: #f97316 !important;
    box-shadow: 0 4px 15px rgba(249, 115, 22, 0.25) !important;
    transform: translateY(-1px) !important;
}

.nav-cta {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
}

/* ==========================================================================
   DARK MODE RESPONSIVE PERFORMANCE & SPEED ENHANCEMENTS
   ========================================================================== */

/* 0. INSTANT ZERO-LAG THEME SWITCHING (Disable all transitions during theme toggle) */
body.stcs-theme-switching *,
body.stcs-theme-switching *::before,
body.stcs-theme-switching *::after,
body.stcs-theme-switching [class*="-card"],
body.stcs-theme-switching [class*="card-"],
body.stcs-theme-switching [class*="-box"],
body.stcs-theme-switching [class*="box-"],
body.stcs-theme-switching .stcs-navbar,
body.stcs-theme-switching .hero {
    transition: none !important;
    animation: none !important;
}

/* Hardware acceleration for dark mode containers on desktop to prevent reflow stutter */
body.dark-mode .stcs-navbar,
body.dark-mode .hero-bg-img,
body.dark-mode [class*="-card"]:not([class*="img"]),
body.dark-mode [class*="card-"]:not([class*="img"]),
body.dark-mode [class*="-box"]:not([class*="checkbox"]),
body.dark-mode [class*="box-"]:not([class*="checkbox"]) {
    will-change: transform, opacity;
    transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* Throttle dark mode infinite aurora & optimize GPU memory on mobile/tablet viewports (<= 991px) */
@media (max-width: 991px), (prefers-reduced-motion: reduce) {
    body.dark-mode *,
    body.dark-mode *::before,
    body.dark-mode *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
    
    /* Free up GPU memory on mobile devices by removing unnecessary compositing layers from static cards/boxes */
    body.dark-mode [class*="-card"]:not([class*="img"]),
    body.dark-mode [class*="card-"]:not([class*="img"]),
    body.dark-mode [class*="-box"]:not([class*="checkbox"]),
    body.dark-mode [class*="box-"]:not([class*="checkbox"]),
    body.dark-mode .hero {
        will-change: auto !important;
        transform: none !important;
    }
    
    /* Keep interactive UI transitions (dropdowns, buttons, modals, accordion) smooth and fast */
    body.dark-mode .dropdown-menu,
    body.dark-mode .modal,
    body.dark-mode .collapse,
    body.dark-mode .collapsing,
    body.dark-mode .nav-link,
    body.dark-mode .btn,
    body.dark-mode button,
    body.dark-mode a {
        transition: opacity 0.15s ease, transform 0.15s ease, background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease !important;
    }
}

/* Eliminate mobile touch delay on theme toggles */
.nav-theme-toggle {
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    user-select: none !important;
    -webkit-user-select: none !important;
}

/* ABSOLUTE ZERO-LAG THEME SWITCHING OVERRIDE (Highest specificity to stop all transitions during toggle) */
body.stcs-theme-switching,
body.stcs-theme-switching *,
body.stcs-theme-switching *::before,
body.stcs-theme-switching *::after,
body.stcs-theme-switching [class*="-card"],
body.stcs-theme-switching [class*="card-"],
body.stcs-theme-switching [class*="-box"],
body.stcs-theme-switching [class*="box-"],
body.stcs-theme-switching .stcs-navbar,
body.stcs-theme-switching .hero,
body.stcs-theme-switching a,
body.stcs-theme-switching button,
body.stcs-theme-switching .btn,
body.stcs-theme-switching .nav-link,
body.stcs-theme-switching .dropdown-menu,
body.stcs-theme-switching .collapse,
body.stcs-theme-switching .collapsing {
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
}

/* ==========================================================================
   SITEWIDE AUTOMATIC RESPONSIVE ENGINE (ALL PAGES & ALL VIEWPORTS)
   Guarantees 100% automatic responsive adaptation on mobile, tablet & desktop
   ========================================================================== */
html, body {
    max-width: 100% !important;
    position: relative !important;
    -webkit-text-size-adjust: 100% !important;
    -ms-text-size-adjust: 100% !important;
}
body {
    overflow-x: hidden !important;
}

/* 1. Universal Media & Element Scaling */
img, video, iframe, embed, object, svg, canvas {
    max-width: 100% !important;
    height: auto;
}

/* 2. Prevent fixed widths from breaking mobile viewports */
* {
    box-sizing: border-box !important;
}
.container, .container-fluid, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl,
.row, .col, [class*="col-"], .card, .box, .panel, .wrapper, .section, header, footer, main, article, section {
    max-width: 100% !important;
}

/* 3. Automatic Table & Code Horizontal Scrolling */
table, .table {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 1rem;
}
.table-responsive, table {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
}
@media (min-width: 768px) {
    table {
        display: table !important;
        overflow-x: visible !important;
    }
}

/* 4. Automatic Word Wrapping & Overflow Prevention */
p, h1, h2, h3, h4, h5, h6, li, span, a, div, blockquote, code, pre, .card-title, .card-text {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word;
}

/* Tablet & Mobile Layout Auto-Corrections (< 992px) */
@media (max-width: 991.98px) {
    .p-5 { padding: 2rem !important; }
    .py-5 { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
    .px-5 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
    .my-5 { margin-top: 2.5rem !important; margin-bottom: 2.5rem !important; }
    
    h1, .h1, .display-1, .display-2, .display-3, .display-4 {
        font-size: clamp(2rem, 5vw, 3rem) !important;
        line-height: 1.25 !important;
    }
    h2, .h2 {
        font-size: clamp(1.6rem, 4vw, 2.25rem) !important;
        line-height: 1.3 !important;
    }
}

/* Mobile Viewport Auto-Corrections (< 768px) */
@media (max-width: 767.98px) {
    h1, .h1, .display-1, .display-2, .display-3, .display-4 {
        font-size: clamp(1.6rem, 6.5vw, 2.25rem) !important;
        line-height: 1.25 !important;
    }
    h2, .h2 {
        font-size: clamp(1.35rem, 5.5vw, 1.8rem) !important;
        line-height: 1.3 !important;
    }
    h3, .h3 {
        font-size: clamp(1.15rem, 4.5vw, 1.45rem) !important;
        line-height: 1.35 !important;
    }
    h4, .h4 {
        font-size: clamp(1.05rem, 4vw, 1.25rem) !important;
    }
    
    .d-flex:not(.flex-row-reverse):not(.nav-theme-toggle):not(.stcs-mobile-header-btn):not(.navbar-nav):not(.btn-group):not(.badge):not(.stcs-nav-actions):not(.navbar) {
        flex-wrap: wrap !important;
    }
    
    .card, .stcs-card, .offering-card, .insight-card, .feature-box, .stat-card {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    .p-5, .p-4 { padding: 1.25rem !important; }
    .py-5, .py-4 { padding-top: 1.75rem !important; padding-bottom: 1.75rem !important; }
    .px-5, .px-4 { padding-left: 1rem !important; padding-right: 1rem !important; }
    .my-5, .my-4 { margin-top: 1.75rem !important; margin-bottom: 1.75rem !important; }
    .section-padding, .section-py { padding-top: 3rem !important; padding-bottom: 3rem !important; }
}

/* ==========================================================================
   CAREERS PAGE DARK MODE
   ========================================================================== */
body.dark-mode .careers-info-section {
    background-color: #0f172a !important;
}
body.dark-mode .ci-left {
    background-color: #0f172a !important;
    background-blend-mode: multiply !important;
}
body.dark-mode .ci-right {
    background-color: #1e293b !important;
    box-shadow: -10px 0 40px rgba(0,0,0,0.5) !important;
}
body.dark-mode .ci-eyebrow {
    color: #2dd4bf !important;
}
body.dark-mode .ci-title,
body.dark-mode .ci-f-text h3,
body.dark-mode .ci-r-text h3 {
    color: #f8fafc !important;
}
body.dark-mode .ci-left .ci-title span { color: #2dd4bf !important; }
body.dark-mode .ci-right .ci-title span { color: #fb923c !important; }
body.dark-mode .ci-desc,
body.dark-mode .ci-f-text p,
body.dark-mode .ci-r-text p {
    color: #94a3b8 !important;
}
body.dark-mode .ci-feature {
    border-bottom: 1px dashed #334155 !important;
}
body.dark-mode .ci-f-icon {
    background-color: rgba(255, 255, 255, 0.05) !important;
}
body.dark-mode .ci-role-card {
    background-color: #0f172a !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.4) !important;
    border: 1px solid #334155 !important;
}
body.dark-mode .ci-role-card:hover {
    box-shadow: 0 12px 30px rgba(0,0,0,0.6) !important;
    border-color: #4f46e5 !important;
}
body.dark-mode .ci-cta {
    background-color: #115e59 !important;
    box-shadow: 0 10px 30px rgba(17, 94, 89, 0.4) !important;
}
body.dark-mode .ci-cta:hover {
    background-color: #0f766e !important;
}
body.dark-mode .ci-cta-arrow {
    border-color: rgba(255,255,255,0.2) !important;
}
body.dark-mode .ci-cta:hover .ci-cta-arrow {
    background-color: #ffffff !important;
    color: #115e59 !important;
}

body.dark-mode .careers-hero .breadcrumbs {
    color: #94a3b8 !important;
}
body.dark-mode .careers-hero .breadcrumbs span {
    color: #c084fc !important;
}
body.dark-mode .careers-hero .eyebrow {
    color: #c084fc !important;
}
body.dark-mode .careers-hero h1 span {
    color: #c084fc !important;
}

@media (max-width: 1024px) {
    body.dark-mode .careers-hero .hero-content {
        background: rgba(15, 23, 42, 0.85) !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
    }
}