/* Modern AI & Data Theme - Light Mode Redesign */
/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');

:root {
    /* Color Palette */
    --bg-primary: #ffffff;
    --bg-secondary: #f8fafc;
    --bg-tertiary: #f1f5f9;
    --text-primary: #0f172a;
    --text-secondary: #475569;
    --text-tertiary: #64748b;
    
    /* Accents & Gradients (Vibrant Purple Highlights based on Synapse Theme) */
    --accent-blue: #7c3aed; /* Replaces main blue with royal violet */
    --accent-indigo: #6366f1;
    --accent-cyan: #06b6d4;
    --accent-purple: #8b5cf6;
    --accent-magenta: #d946ef;
    --accent-glow: rgba(124, 58, 237, 0.15);
    
    --grad-primary: linear-gradient(135deg, #7c3aed 0%, #d946ef 100%);
    --grad-cyan-blue: linear-gradient(135deg, #06b6d4 0%, #7c3aed 100%);
    --grad-purple-indigo: linear-gradient(135deg, #8b5cf6 0%, #6366f1 100%);
    --grad-cosmic: linear-gradient(135deg, #7c3aed 0%, #a855f7 50%, #ec4899 100%);
    --grad-subtle: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    --grad-glow: linear-gradient(135deg, rgba(124, 58, 237, 0.08) 0%, rgba(217, 70, 239, 0.08) 100%);
    --grad-gold: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
    
    /* UI Element Styles */
    --border-color: rgba(226, 232, 240, 0.8);
    --glass-bg: rgba(255, 255, 255, 0.75);
    --glass-border: rgba(255, 255, 255, 0.6);
    --glass-shadow: 0 8px 32px 0 rgba(124, 58, 237, 0.08);
    --card-shadow: 0 10px 30px -10px rgba(124, 58, 237, 0.06);
    --hover-shadow: 0 20px 40px -15px rgba(124, 58, 237, 0.18);
    
    /* Font Definitions - Replaced with Fira Sans */
    --font-heading: 'Fira Sans', sans-serif;
    --font-body: 'Fira Sans', sans-serif;
    
    /* Dimensions */
    --nav-height: 80px;
    --border-radius-sm: 8px;
    --border-radius-md: 16px;
    --border-radius-lg: 24px;
    
    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Base Settings */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    font-family: var(--font-body);
    font-weight: 300;
    background-color: var(--bg-primary);
    color: var(--text-primary);
    line-height: 1.6;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

p {
    font-weight: 300;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.25;
}

a {
    text-decoration: none;
    color: inherit;
    transition: var(--transition-fast);
}

/* Global Layout & Grids */
.container {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}

.section {
    padding: 100px 0;
    position: relative;
}

.section-alt {
    background-color: var(--bg-secondary);
    padding: 100px 0;
    position: relative;
}

/* Header/Navbar (Glassmorphic) */
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--nav-height);
    background-color: var(--glass-bg);
    backdrop-filter: blur(12px) saturate(180%);
    -webkit-backdrop-filter: blur(12px) saturate(180%);
    border-bottom: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    z-index: 1000;
    transition: var(--transition-normal);
}

.header.shrunk {
    height: 70px;
    background-color: rgba(255, 255, 255, 0.95);
}

.header.scrolled .logo-img {
    height: 32px;
}

.nav-container {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    height: 100%;
    position: relative; /* Context for mega menus */
    min-width: 0;
}

.logo-link {
    display: flex;
    align-items: center;
    gap: 10px;
    grid-column: 1;
    min-width: 0;
}

.logo-img {
    height: 38px;
    width: auto;
    object-fit: contain;
    display: block;
    transition: var(--transition-fast);
}

.logo-img.logo-main {
    height: 64px;
}

.header.scrolled .logo-img.logo-main,
.header.shrunk .logo-img.logo-main {
    height: 58px;
}

.logo-link:hover .logo-img {
    transform: scale(1.02);
}

.logo-text {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 800;
    background: var(--grad-primary);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -0.5px;
}

.logo-sub {
    font-size: 0.6875rem;
    color: var(--text-secondary);
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.logo-box {
    display: flex;
    flex-direction: column;
}

.nav-bar {
    display: flex;
    align-items: center;
    height: 100%;
    grid-column: 2;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.nav-bar::-webkit-scrollbar {
    display: none;
}

/* Navigation Links */
.nav-menu {
    display: flex;
    list-style: none;
    gap: clamp(16px, 2vw, 32px);
    align-items: stretch;
    height: 100%;
    flex-wrap: nowrap;
}

.nav-item {
    display: flex;
    align-items: center;
    height: 100%;
}

.nav-link {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--text-secondary);
    height: 100%;
    display: inline-flex;
    align-items: center;
    position: relative;
    padding: 0;
    transition: color var(--transition-fast);
}

.nav-link:hover,
.nav-link.active {
    color: var(--accent-blue);
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--grad-primary);
    transition: var(--transition-fast);
}

.nav-link:hover::after,
.nav-link.active::after {
    width: 100%;
}

.header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    height: 100%;
    grid-column: 3;
    min-width: 0;
}

.header-cta-btn {
    padding: 8px 18px !important;
    font-size: 0.84375rem !important;
    border-radius: 30px !important;
    white-space: nowrap;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
}

.header-cta-btn.btn-primary {
    background: var(--grad-primary) !important;
    color: #ffffff !important;
}

.header-cta-btn.btn-primary:hover {
    box-shadow: 0 4px 15px rgba(124, 58, 237, 0.3) !important;
    transform: translateY(-1px) !important;
}

.header-cta-btn.btn-outline,
.header-cta-btn:not(.btn-primary) {
    background-color: transparent !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
}

.header-cta-btn.btn-outline:hover,
.header-cta-btn:not(.btn-primary):hover {
    background-color: var(--bg-secondary) !important;
    border-color: var(--accent-blue) !important;
    color: var(--accent-blue) !important;
    transform: translateY(-1px) !important;
}

@media (min-width: 992px) and (max-width: 1200px) {
    .nav-link {
        font-size: 0.8125rem;
    }
    .nav-menu {
        gap: 16px;
    }
    .nav-mega-menu.mega-cols-4 {
        width: 950px;
    }
    .nav-mega-menu.mega-cols-3 {
        width: 750px;
    }
    .nav-mega-menu.mega-cols-2 {
        width: 600px;
    }
}


/* Dropdown Menu */
.nav-dropdown {
    position: absolute;
    top: 100%;
    left: -20px;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    box-shadow: 0 10px 40px rgba(15, 23, 42, 0.08);
    border-radius: var(--border-radius-md);
    padding: 12px;
    min-width: 240px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: var(--transition-normal);
}

.nav-item:hover .nav-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Redesigned Premium Glassmorphic Mega Menu */
.nav-mega-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(15px);
    background-color: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(18px) saturate(180%);
    -webkit-backdrop-filter: blur(18px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.7);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.6);
    border-radius: 12px;
    padding: 24px 28px;
    opacity: 0;
    visibility: hidden;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease, visibility 0.25s;
    z-index: 1000;
}

/* Width specifications based on columns */
.nav-mega-menu.mega-cols-2 {
    width: 760px;
}

.nav-mega-menu.mega-cols-3 {
    width: 960px;
}

.nav-mega-menu.mega-cols-4 {
    width: 1160px;
}

.nav-item:hover .nav-mega-menu,
.nav-item.open .nav-mega-menu {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

.mega-menu-grid {
    display: grid;
    gap: 28px;
}

.mega-cols-2 .mega-menu-grid {
    grid-template-columns: repeat(2, 1fr);
}

.mega-cols-3 .mega-menu-grid {
    grid-template-columns: repeat(3, 1fr);
}

.mega-cols-4 .mega-menu-grid {
    grid-template-columns: repeat(4, 1fr);
}

.mega-menu-column h4 {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--accent-blue);
    margin-bottom: 14px;
    border-bottom: 2px solid var(--accent-glow);
    padding-bottom: 6px;
    font-family: var(--font-body);
}

.mega-menu-column ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mega-menu-column li {
    margin-bottom: 8px;
}

.mega-menu-link {
    display: flex;
    flex-direction: column;
    padding: 8px 12px;
    border-radius: 8px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    text-decoration: none;
}

.mega-menu-link:hover {
    background-color: var(--bg-secondary);
    transform: translateX(4px);
}

.mega-menu-title {
    font-size: 0.84375rem;
    font-weight: 600;
    color: var(--text-primary);
    transition: color 0.2s ease;
    font-family: var(--font-body);
}

.mega-menu-link:hover .mega-menu-title {
    color: var(--accent-blue);
}

.mega-menu-desc {
    font-size: 0.6875rem;
    color: var(--text-secondary);
    margin-top: 3px;
    line-height: 1.4;
    font-weight: 400;
}

/* Featured Spotlight Card inside Mega Menu */
.mega-featured-card {
    background: radial-gradient(circle at top right, rgba(139, 92, 246, 0.08), rgba(124, 58, 237, 0.03)), var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    padding: 20px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.3s ease;
}

.mega-featured-card:hover {
    box-shadow: 0 10px 30px rgba(124, 58, 237, 0.1);
    border-color: rgba(124, 58, 237, 0.3);
    transform: translateY(-2px);
}

.badge-featured {
    background-color: var(--accent-glow);
    color: var(--accent-blue);
    font-size: 0.5625rem;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 4px 8px;
    border-radius: 20px;
    align-self: flex-start;
    margin-bottom: 12px;
}

.mega-featured-card h5 {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 8px;
    font-family: var(--font-heading);
}

.mega-featured-card p {
    font-size: 0.6875rem;
    color: var(--text-secondary);
    line-height: 1.5;
    margin-bottom: 16px;
}

.mega-featured-card .btn-xs {
    padding: 6px 12px;
    font-size: 0.6875rem;
    border-radius: 6px;
    align-self: flex-start;
}

/* Target Industries Grid inside Mega Menu */
.industries-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.industry-grid-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 0.78125rem;
    font-weight: 500;
    color: var(--text-secondary);
    transition: all 0.2s ease;
    text-decoration: none;
}

.industry-grid-item i {
    font-size: 0.875rem;
    color: var(--accent-cyan);
    width: 18px;
    text-align: center;
}

.industry-grid-item:hover {
    background-color: var(--bg-secondary);
    color: var(--accent-blue);
    transform: translateY(-1px);
}

/* Resource Center Grid */
.resources-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.resource-grid-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 0.78125rem;
    font-weight: 500;
    color: var(--text-secondary);
    transition: all 0.2s ease;
    text-decoration: none;
}

.resource-grid-item i {
    font-size: 0.875rem;
    color: var(--accent-cyan);
    width: 18px;
    text-align: center;
}

.resource-grid-item:hover {
    background-color: var(--bg-secondary);
    color: var(--accent-blue);
    transform: translateY(-1px);
}

/* Technology Partners Mini Grid */
.partners-mini-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.partner-mini-item {
    display: flex;
    flex-direction: column;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-primary);
    transition: all 0.2s ease;
    border: 1px solid var(--border-color);
    background-color: var(--bg-primary);
    text-decoration: none;
}

.partner-mini-item:hover {
    background-color: var(--bg-secondary);
    border-color: var(--accent-blue);
    transform: translateY(-1px);
}

.partner-role {
    font-size: 0.5625rem;
    color: var(--text-tertiary);
    margin-top: 2px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}


/* Call to Action Button */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 28px;
    font-size: 0.9375rem;
    font-weight: 600;
    border-radius: var(--border-radius-md);
    transition: var(--transition-normal);
    cursor: pointer;
    border: none;
    font-family: var(--font-body);
}

.btn-glow {
    background: var(--grad-cyan-blue);
    color: var(--bg-primary);
    box-shadow: 0 4px 20px rgba(6, 182, 212, 0.25);
    position: relative;
    overflow: hidden;
}

.btn-glow:hover {
    box-shadow: 0 8px 30px rgba(6, 182, 212, 0.4);
    transform: translateY(-2px);
}

.btn-icon {
    margin-left: 8px;
    transition: var(--transition-fast);
}

.btn:hover .btn-icon {
    transform: translateX(4px);
}

/* Mobile Menu Toggle */
.mobile-toggle {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 24px;
    height: 18px;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 2200; /* Above mobile drawer */
}

.mobile-toggle span {
    display: block;
    width: 100%;
    height: 2px;
    background-color: var(--text-primary);
    border-radius: 2px;
    transition: var(--transition-fast);
}

.mobile-toggle.open span:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}

.mobile-toggle.open span:nth-child(2) {
    opacity: 0;
}

.mobile-toggle.open span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}

/* Hero Section */
.hero {
    min-height: 100vh;
    padding-top: calc(var(--nav-height) + 40px);
    display: flex;
    align-items: center;
    background-color: var(--bg-primary);
    position: relative;
    overflow: hidden;
}

.hero-bg-glow {
    position: absolute;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    filter: blur(150px);
    z-index: 1;
    pointer-events: none;
}

.hero-glow-1 {
    background: rgba(124, 58, 237, 0.08);
    top: -100px;
    right: -100px;
}

.hero-glow-2 {
    background: rgba(6, 182, 212, 0.06);
    bottom: -150px;
    left: -100px;
}

.hero-grid {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 48px;
    align-items: center;
    position: relative;
    z-index: 2;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    padding: 6px 14px;
    border-radius: 30px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--accent-blue);
    margin-bottom: 24px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02);
}

.hero-badge i {
    font-size: 0.75rem;
}

.hero-title {
    font-size: 3.5rem;
    font-weight: 800;
    letter-spacing: -1.5px;
    margin-bottom: 20px;
    color: var(--text-primary);
}

.hero-title .highlight {
    background: var(--grad-primary);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Animated Title Rotator (Data & AI) */
.text-rotator {
    display: inline-grid;
    grid-template-areas: "stack";
    vertical-align: bottom;
    height: 1.25em;
    overflow: hidden;
    color: var(--accent-blue);
}

.text-rotator span {
    grid-area: stack;
    opacity: 0;
    transform: translateY(60%);
    animation: rotateText 6s cubic-bezier(0.76, 0, 0.24, 1) infinite;
    background: none;
    -webkit-background-clip: initial;
    -webkit-text-fill-color: initial;
}

.text-rotator span:nth-child(2) {
    animation-delay: 3s;
}

@keyframes rotateText {
    0% {
        opacity: 0;
        transform: translateY(60%);
    }
    5%, 45% {
        opacity: 1;
        transform: translateY(0);
    }
    55%, 100% {
        opacity: 0;
        transform: translateY(-60%);
    }
}

.hero-desc {
    font-size: 1.125rem;
    color: var(--text-secondary);
    margin-bottom: 40px;
    max-width: 580px;
}

.hero-buttons {
    display: flex;
    gap: 16px;
}

/* Hero Interactive Visuals */
.hero-visual {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ai-graphic-container {
    position: relative;
    width: 100%;
    max-width: 460px;
    height: 460px;
}

.ai-node-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 1px dashed rgba(124, 58, 237, 0.2);
}

.circle-lg {
    width: 440px;
    height: 440px;
    animation: rotateCW 40s linear infinite;
}

.circle-md {
    width: 320px;
    height: 320px;
    animation: rotateCCW 30s linear infinite;
}

.circle-sm {
    width: 200px;
    height: 200px;
    animation: rotateCW 20s linear infinite;
}

.ai-core {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100px;
    height: 100px;
    background: var(--grad-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 40px rgba(124, 58, 237, 0.4);
    z-index: 5;
    animation: pulseGlow 4s ease-in-out infinite;
}

.ai-core i {
    font-size: 2.25rem;
    color: var(--bg-primary);
}

.orbiting-node {
    position: absolute;
    width: 40px;
    height: 40px;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--card-shadow);
    color: var(--accent-blue);
    font-size: 0.875rem;
    transition: var(--transition-fast);
}

.orbiting-node:hover {
    color: var(--bg-primary);
    background: var(--grad-cyan-blue);
    transform: scale(1.1);
    box-shadow: 0 0 20px rgba(6, 182, 212, 0.4);
}

/* Animations */
@keyframes rotateCW {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes rotateCCW {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to { transform: translate(-50%, -50%) rotate(-360deg); }
}

@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 40px rgba(124, 58, 237, 0.4); transform: translate(-50%, -50%) scale(1); }
    50% { box-shadow: 0 0 60px rgba(124, 58, 237, 0.6), 0 0 20px rgba(6, 182, 212, 0.3); transform: translate(-50%, -50%) scale(1.05); }
}

/* Section Header Typography */
.section-header {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 60px;
}

.section-subtitle {
    font-size: 0.8125rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--accent-blue);
    margin-bottom: 12px;
}

.section-title {
    font-size: 2.5rem;
    font-weight: 800;
    letter-spacing: -1px;
    margin-bottom: 20px;
    color: var(--text-primary);
}

.section-title span {
    background: var(--grad-primary);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.section-desc {
    font-size: 1rem;
    color: var(--text-secondary);
}

/* Core Pillar Cards / Grids */
.card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 32px;
}

.card {
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    padding: 40px;
    box-shadow: var(--card-shadow);
    transition: var(--transition-normal);
    position: relative;
    overflow: hidden;
}

.card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--grad-primary);
    opacity: 0;
    transition: var(--transition-normal);
}

.card:hover::before {
    opacity: 1;
}

.card-icon-box {
    width: 60px;
    height: 60px;
    background-color: var(--bg-secondary);
    border-radius: var(--border-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--accent-blue);
    margin-bottom: 28px;
    transition: var(--transition-normal);
}

.card:hover .card-icon-box {
    background: var(--grad-primary);
    color: var(--bg-primary);
    box-shadow: 0 8px 20px rgba(124, 58, 237, 0.2);
}

.card:hover .card-icon-box i {
    animation: wobbleGear 0.6s ease-in-out;
}

@keyframes wobbleGear {
    0%, 100% { transform: rotate(0deg); }
    30% { transform: rotate(-15deg); }
    70% { transform: rotate(15deg); }
}

.card-title {
    font-size: 1.375rem;
    font-weight: 700;
    margin-bottom: 16px;
}

.card-desc {
    color: var(--text-secondary);
    font-size: 0.9375rem;
    margin-bottom: 24px;
}

.card-link {
    display: inline-flex;
    align-items: center;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--accent-blue);
    gap: 6px;
}

.card-link i {
    transition: var(--transition-fast);
}

.card-link:hover i {
    transform: translateX(4px);
}

/* Feature/Pillar Overview Component (Z-Pattern Split) */
.feature-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
    margin-bottom: 100px;
}

.feature-split:last-child {
    margin-bottom: 0;
}

.feature-split.reversed .feature-content {
    grid-column: 2;
}

.feature-split.reversed .feature-visual {
    grid-column: 1;
    grid-row: 1;
}

.feature-content .hero-badge {
    margin-bottom: 16px;
}

.feature-title {
    font-size: 2.25rem;
    font-weight: 800;
    letter-spacing: -0.8px;
    margin-bottom: 20px;
}

.feature-desc {
    color: var(--text-secondary);
    font-size: 1rem;
    margin-bottom: 30px;
}

.feature-list {
    list-style: none;
    margin-bottom: 36px;
}

.feature-list-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 16px;
    font-size: 0.9375rem;
    color: var(--text-secondary);
    text-align: left;
}

.feature-list-item i {
    color: var(--accent-cyan);
    margin-top: 4px;
    font-size: 0.875rem;
}

.feature-visual img {
    width: 100%;
    max-width: 520px;
    border-radius: var(--border-radius-lg);
    box-shadow: var(--card-shadow);
    border: 1px solid var(--border-color);
}

.feature-visual-glow {
    position: relative;
    display: flex;
    justify-content: center;
}

.feature-visual-glow::after {
    content: '';
    position: absolute;
    width: 80%;
    height: 80%;
    background: var(--grad-glow);
    filter: blur(80px);
    z-index: -1;
    border-radius: 50%;
}

/* Statistics/Metrics Strip */
.stats-section {
    background: var(--grad-primary);
    color: var(--bg-primary);
    padding: 60px 0;
    position: relative;
    overflow: hidden;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 40px;
    text-align: center;
}

.stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.stat-number {
    font-family: var(--font-heading);
    font-size: 3rem;
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 8px;
    letter-spacing: -1px;
}

.stat-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.8);
    max-width: 180px;
}

/* Interactive Tabs Component (Artha Advantage & AI) */
.tabs-container {
    margin-top: 40px;
}

.tabs-nav {
    display: flex;
    justify-content: center;
    list-style: none;
    gap: 12px;
    margin-bottom: 48px;
    flex-wrap: wrap;
}

.tab-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    padding: 12px 24px;
    border-radius: 30px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    transition: var(--transition-fast);
}

.tab-btn:hover {
    border-color: var(--accent-blue);
    color: var(--accent-blue);
}

.tab-btn.active {
    background: var(--grad-primary);
    color: var(--bg-primary);
    border-color: transparent;
    box-shadow: 0 4px 15px rgba(124, 58, 237, 0.2);
}

.tab-pane {
    display: none;
    animation: fadeIn var(--transition-normal);
}

.tab-pane.active {
    display: block;
}

.tab-content-grid {
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 60px;
    align-items: center;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Video Testimonial Styles */
.video-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 32px;
    margin-top: 40px;
}

.video-card {
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    box-shadow: var(--card-shadow);
    transition: var(--transition-normal);
}

.video-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--hover-shadow);
    border-color: rgba(124, 58, 237, 0.2);
}

.video-frame {
    position: relative;
    width: 100%;
    height: 220px;
    background-color: #0f172a;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.video-placeholder-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.6;
    transition: var(--transition-slow);
}

.video-card:hover .video-placeholder-img {
    transform: scale(1.05);
    opacity: 0.75;
}

.video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.1) 0%, rgba(15, 23, 42, 0.6) 100%);
}

.video-play-btn {
    position: relative;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: var(--bg-primary);
    color: var(--accent-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    z-index: 10;
    transition: var(--transition-normal);
    animation: pulsePlay 3s infinite;
}

@keyframes pulsePlay {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4); }
    50% { box-shadow: 0 0 0 12px rgba(255, 255, 255, 0); }
}

.video-play-btn:hover {
    transform: scale(1.1);
    background-color: var(--accent-blue);
    color: var(--bg-primary);
}

.video-duration {
    position: absolute;
    bottom: 12px;
    right: 12px;
    background-color: rgba(15, 23, 42, 0.85);
    color: var(--bg-primary);
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.video-body {
    padding: 30px;
}

.video-title {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.video-desc {
    font-size: 0.875rem;
    color: var(--text-secondary);
    line-height: 1.5;
}

/* Video Modal Lightbox */
.video-lightbox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(15, 23, 42, 0.95);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: var(--transition-normal);
}

.video-lightbox.open {
    opacity: 1;
    visibility: visible;
}

.lightbox-content {
    position: relative;
    width: 100%;
    max-width: 800px;
    aspect-ratio: 16/9;
    background-color: #000;
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
    transform: scale(0.9);
    transition: var(--transition-normal);
}

.video-lightbox.open .lightbox-content {
    transform: scale(1);
}

.lightbox-close {
    position: absolute;
    top: -40px;
    right: 0;
    color: #fff;
    font-size: 1.5rem;
    cursor: pointer;
    background: none;
    border: none;
}

/* Webcast & IDC Banner Layout */
.webcast-idc-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-top: 40px;
}

.webcast-banner {
    background: linear-gradient(135deg, rgba(79, 70, 229, 0.04) 0%, rgba(124, 58, 237, 0.08) 100%);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    padding: 50px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
}

.webcast-banner::after {
    content: '';
    position: absolute;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(124, 58, 237, 0.1) 0%, rgba(124, 58, 237, 0) 70%);
    top: -100px;
    right: -100px;
    z-index: -1;
}

.webcast-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-color: #e0f2fe;
    color: var(--accent-blue);
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 6px 14px;
    border-radius: 30px;
    align-self: flex-start;
    margin-bottom: 24px;
}

.webcast-title {
    font-size: 1.75rem;
    font-weight: 800;
    line-height: 1.3;
    margin-bottom: 16px;
    letter-spacing: -0.5px;
}

.webcast-desc {
    color: var(--text-secondary);
    font-size: 0.9375rem;
    margin-bottom: 32px;
}

/* AI SniffGuard Section */
.ai-inception-section {
    background-color: var(--bg-secondary);
}

.ai-inception-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-top: 40px;
}

.ai-card {
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    padding: 50px;
    box-shadow: var(--card-shadow);
    transition: var(--transition-normal);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.ai-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--hover-shadow);
}

.ai-card-tag {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 30px;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 24px;
    align-self: flex-start;
}

.ai-tag-existing {
    background-color: #eff6ff;
    color: var(--accent-blue);
}

.ai-tag-new {
    background-color: #ecfeff;
    color: var(--accent-cyan);
}

.ai-card h3 {
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 10px;
    letter-spacing: -0.5px;
}

.ai-card-subtitle {
    font-size: 0.875rem;
    color: var(--text-tertiary);
    margin-bottom: 20px;
}

.ai-card-pitch {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 24px;
    line-height: 1.4;
}

.ai-card-pitch span {
    border-bottom: 2px solid var(--accent-cyan);
}

.ai-card-desc {
    font-size: 0.9375rem;
    color: var(--text-secondary);
    margin-bottom: 28px;
    line-height: 1.6;
}

.ai-card-price-callout {
    background-color: var(--bg-secondary);
    border-radius: var(--border-radius-md);
    padding: 20px;
    margin-bottom: 32px;
    border-left: 4px solid var(--accent-blue);
    font-size: 0.875rem;
    color: var(--text-secondary);
}

.ai-card-price-callout strong {
    color: var(--text-primary);
}

.ai-card-divider {
    height: 1px;
    background-color: var(--border-color);
    margin: 32px 0;
}

.ai-card-features-heading {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: var(--text-tertiary);
    margin-bottom: 20px;
}

/* Event Cards Layout */
.events-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 32px;
}

.event-card {
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    box-shadow: var(--card-shadow);
    transition: var(--transition-normal);
    display: flex;
    flex-direction: column;
}

.event-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--hover-shadow);
    border-color: rgba(6, 182, 212, 0.2);
}

.event-header {
    padding: 24px;
    background: var(--grad-glow);
    display: flex;
    align-items: center;
    gap: 16px;
    border-bottom: 1px solid var(--border-color);
}

.event-date-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    background: var(--grad-primary);
    color: var(--bg-primary);
    border-radius: var(--border-radius-md);
    font-family: var(--font-heading);
}

.event-month {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.event-day {
    font-size: 1.375rem;
    font-weight: 800;
    line-height: 1;
}

.event-meta {
    font-size: 0.75rem;
    color: var(--text-tertiary);
}

.event-meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
}

.event-meta-item:last-child {
    margin-bottom: 0;
}

.event-body {
    padding: 32px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.event-title {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 12px;
    line-height: 1.4;
}

.event-desc {
    font-size: 0.875rem;
    color: var(--text-secondary);
    margin-bottom: 24px;
    flex-grow: 1;
}

/* Partner Logo Grid */
.partner-section {
    padding: 24px 0;
    border-top: 1px solid rgba(15, 23, 42, 0.05);
    border-bottom: 1px solid rgba(15, 23, 42, 0.05);
    background-color: #f8fafc;
}

.partner-logo-grid {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 48px;
}

.partner-item {
    font-family: var(--font-heading);
    font-size: 1.8125rem;
    font-weight: 600;
    color: #94a3b8;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 12px;
}

.partner-item:hover {
    color: #4f46e5;
    transform: translateY(-1px);
}

.partner-item i {
    font-size: 2rem;
}

/* Interactive Contact Hub */
.contact-hub-grid {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 60px;
    align-items: start;
}

.contact-card {
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    padding: 40px;
    box-shadow: var(--card-shadow);
}

.form-group {
    margin-bottom: 24px;
}

.form-group.half-width {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.form-label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 8px;
}

.form-control {
    width: 100%;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-md);
    padding: 14px 18px;
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--text-primary);
    transition: var(--transition-fast);
}

.form-control:focus {
    outline: none;
    border-color: var(--accent-blue);
    background-color: var(--bg-primary);
    box-shadow: 0 0 0 4px var(--accent-glow);
}

textarea.form-control {
    min-height: 140px;
    resize: vertical;
}

.form-checkbox-group {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 24px;
}

.form-checkbox {
    margin-top: 4px;
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1px solid var(--border-color);
    cursor: pointer;
}

.form-checkbox-label {
    font-size: 0.8125rem;
    color: var(--text-secondary);
}

.form-checkbox-label a {
    color: var(--accent-blue);
}

/* Contact Info Panel */
.contact-info-panel {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.info-block {
    display: flex;
    gap: 20px;
}

.info-icon {
    width: 50px;
    height: 50px;
    border-radius: var(--border-radius-md);
    background: var(--grad-glow);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    color: var(--accent-blue);
    flex-shrink: 0;
}

.info-content h4 {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 6px;
}

.info-content p {
    font-size: 0.875rem;
    color: var(--text-secondary);
}

/* Global Office Grid */
.office-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 20px;
}

.office-card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-md);
    padding: 20px;
    transition: var(--transition-fast);
}

.office-card:hover {
    border-color: var(--accent-cyan);
    background-color: var(--bg-primary);
}

.office-title {
    font-size: 0.9375rem;
    font-weight: 700;
    margin-bottom: 8px;
}

.office-addr {
    font-size: 0.75rem;
    color: var(--text-secondary);
}

/* Footer Section - Rich Dark Theme */
.footer {
    background:
        radial-gradient(circle at 10% 0%, rgba(20, 184, 166, 0.16), transparent 28%),
        radial-gradient(circle at 68% 10%, rgba(124, 58, 237, 0.2), transparent 34%),
        linear-gradient(135deg, #02040a 0%, #070814 42%, #11102a 100%);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding: 70px 0 30px;
    color: #94a3b8;
    position: relative;
    overflow: hidden;
}

.footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(2, 4, 10, 0.1), rgba(2, 4, 10, 0.78));
    pointer-events: none;
}

.footer-inner,
.footer-bottom {
    position: relative;
    z-index: 1;
}

.footer-top-rule {
    width: min(100%, 980px);
    height: 1px;
    margin: 0 auto 54px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), transparent);
}

.footer-brand-row {
    display: grid;
    grid-template-columns: minmax(260px, 420px) minmax(220px, 280px);
    justify-content: space-between;
    align-items: start;
    gap: 40px;
    margin-bottom: 54px;
}

.footer-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(140px, 1fr));
    gap: 42px;
    margin-bottom: 60px;
}

.footer-sitemap-grid {
    align-items: start;
}

.footer-column h4 {
    font-size: 0.875rem;
    font-weight: 700;
    margin-bottom: 22px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #ffffff;
}

.footer-logo-block {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.footer-desc {
    font-size: 0.875rem;
    color: #94a3b8;
    max-width: 320px;
    line-height: 1.6;
}

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

.social-link {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    transition: var(--transition-fast);
}

.social-link:hover {
    background: var(--grad-primary);
    color: var(--bg-primary);
}

.footer-links {
    list-style: none;
}

.footer-links-item {
    margin-bottom: 10px;
}

.footer-link {
    font-size: 0.8125rem;
    line-height: 1.45;
    color: rgba(203, 213, 225, 0.76);
    transition: var(--transition-fast);
}

.footer-link:hover {
    color: #ffffff;
    padding-left: 4px;
}

.footer-contact-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.footer-contact-link i {
    width: 16px;
    color: var(--artha-teal);
    font-size: 0.8125rem;
}

.footer-contact-card {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    justify-self: end;
    max-width: 280px;
    padding: 15px 18px;
    border: 1px solid rgba(20, 184, 166, 0.28);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.04);
    color: #ffffff;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.22);
    transition: var(--transition-fast);
}

.footer-contact-card:hover {
    transform: translateY(-2px);
    border-color: rgba(20, 184, 166, 0.55);
    background: rgba(20, 184, 166, 0.08);
}

.footer-contact-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    color: #ffffff;
    background: linear-gradient(135deg, var(--artha-teal), var(--artha-purple));
}

.footer-contact-label,
.footer-contact-copy {
    display: block;
}

.footer-contact-label {
    font-size: 0.875rem;
    font-weight: 800;
    color: #ffffff;
}

.footer-contact-copy {
    margin-top: 2px;
    font-size: 0.75rem;
    color: rgba(226, 232, 240, 0.74);
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding-top: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.8125rem;
    color: #64748b;
}

.footer-legal-links {
    display: flex;
    gap: 24px;
}

.legal-link {
    color: #64748b;
    transition: var(--transition-fast);
}

.legal-link:hover {
    color: #ffffff;
}

/* FAQ Accordion Component */
.faq-list {
    max-width: 800px;
    margin: 0 auto;
}

.faq-item {
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-md);
    margin-bottom: 16px;
    overflow: hidden;
    transition: var(--transition-fast);
}

.faq-question {
    padding: 24px;
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    background-color: var(--bg-primary);
}

.faq-answer {
    padding: 0 24px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out, padding 0.3s ease-out;
    color: var(--text-secondary);
    font-size: 0.875rem;
    border-top: 0 solid var(--border-color);
}

.faq-item.active {
    border-color: var(--accent-blue);
    box-shadow: 0 4px 20px rgba(124, 58, 237, 0.06);
}

.faq-item.active .faq-answer {
    padding: 0 24px 24px;
    max-height: 200px;
    border-top-width: 1px;
}

.faq-answer.is-open,
.faq-answer.active {
    padding: 0 24px 24px;
    max-height: 1200px;
    border-top-width: 1px;
}

.faq-icon {
    font-size: 0.75rem;
    transition: var(--transition-fast);
    color: var(--text-tertiary);
}

.faq-item.active .faq-icon {
    transform: rotate(180deg);
    color: var(--accent-blue);
}

/* Toast Message */
.toast-msg {
    position: fixed;
    bottom: 30px;
    right: 30px;
    background-color: #10b981;
    color: #ffffff;
    padding: 16px 24px;
    border-radius: var(--border-radius-md);
    box-shadow: 0 10px 30px rgba(16, 185, 129, 0.2);
    z-index: 1100;
    font-size: 0.875rem;
    font-weight: 600;
    transform: translateY(100px);
    opacity: 0;
    transition: var(--transition-normal);
}

.toast-msg.show {
    transform: translateY(0);
    opacity: 1;
}

/* Responsive Styles */
@media (max-width: 1024px) {
    .hero-title {
        font-size: 2.75rem;
    }
    .feature-split {
        gap: 40px;
    }
    .contact-hub-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .webcast-idc-container,
    .ai-inception-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .footer-brand-row {
        grid-template-columns: 1fr;
    }
    .footer-contact-card {
        justify-self: start;
    }
    .footer-grid {
        grid-template-columns: repeat(3, minmax(160px, 1fr));
    }
}

@media (max-width: 991px) {
    :root {
        --nav-height: 70px;
    }
    .mobile-toggle {
        display: flex;
    }
    .nav-bar {
        display: none !important;
    }
    .header-cta-btn {
        display: none !important;
    }
    .header-actions {
        margin-left: auto;
        margin-right: 16px;
        height: 100%;
        grid-column: unset;
    }
    .nav-container {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .hero-grid {
        grid-template-columns: 1fr;
        text-align: center;
    }
    .hero-desc {
        margin-left: auto;
        margin-right: auto;
    }
    .hero-buttons {
        justify-content: center;
    }
    .ai-graphic-container {
        margin-top: 40px;
        max-width: 320px;
        height: 320px;
    }
    .circle-lg { width: 300px; height: 300px; }
    .circle-md { width: 220px; height: 220px; }
    .circle-sm { width: 140px; height: 140px; }
    .ai-core { width: 70px; height: 70px; }
    .ai-core i { font-size: 1.5rem; }
    
    .feature-split {
        grid-template-columns: 1fr;
        text-align: center;
        margin-bottom: 60px;
    }
    .feature-split.reversed .feature-content,
    .feature-split.reversed .feature-visual {
        grid-column: auto;
        grid-row: auto;
    }
    .feature-list-item {
        justify-content: center;
    }
    .tab-content-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    .footer-top-rule {
        margin-bottom: 36px;
    }
    .footer-brand-row {
        margin-bottom: 40px;
    }
    .office-grid {
        grid-template-columns: 1fr;
    }
    .section-title {
        font-size: 2rem;
    }
    .webcast-banner {
        padding: 30px;
    }
    .ai-card {
        padding: 30px;
    }
}

/* Admin Dashboard & Editor Sidebar Custom Styles */
.tab-btn i {
    transition: var(--transition-fast);
}
.tab-btn:hover i {
    transform: scale(1.1);
}

/* SEO Scorecard Checklist Icons */
#blog-editor-form .form-group {
    margin-bottom: 20px;
}

#blog-editor-form .form-label {
    font-size: 0.8125rem;
    font-weight: 600;
    margin-bottom: 6px;
    display: block;
}

/* Checklist check states */
.chk-valid {
    color: #16a34a !important;
}
.chk-valid i {
    color: #16a34a !important;
}

.chk-invalid {
    color: var(--text-tertiary) !important;
}

.chk-valid i::before {
    content: "\f058" !important; /* fa-check-circle */
    font-weight: 900;
}

/* ==========================================================================
   Case Studies Gated PDF Download Modals & Tabs Styles
   ========================================================================== */

/* Modal Backdrop */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(15, 23, 42, 0.4);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--transition-normal), visibility var(--transition-normal);
}

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

/* Modal Content Container */
.modal-overlay .modal-content {
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    box-shadow: var(--glass-shadow);
    transform: scale(0.9);
    transition: transform var(--transition-normal);
}

.modal-overlay.active .modal-content {
    transform: scale(1);
}

/* Case Study Editor Tab Styles */
.editor-tab-trigger {
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 10px 20px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    transition: var(--transition-fast);
}

.editor-tab-trigger:hover {
    color: var(--accent-blue);
}

.editor-tab-trigger.active {
    color: var(--accent-blue) !important;
    border-bottom-color: var(--accent-blue) !important;
}

/* Form Controls and Styling Improvements for Leads */
.modal-overlay .form-group {
    margin-bottom: 16px;
    text-align: left;
}

.modal-overlay .form-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 6px;
    display: block;
}

.modal-overlay .form-control {
    padding: 10px 12px;
    font-size: 0.8125rem;
}

/* Blog Body Copy Formatting */
.blog-body-text p {
    margin-bottom: 24px;
    text-align: left;
    line-height: 1.85;
    font-weight: 300;
}

.blog-body-text h2 {
    font-family: var(--font-heading);
    font-size: 1.375rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-top: 36px;
    margin-bottom: 16px;
    line-height: 1.3;
}

.blog-body-text h3 {
    font-family: var(--font-heading);
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-top: 28px;
    margin-bottom: 12px;
    line-height: 1.3;
}

.blog-body-text ul, .blog-body-text ol {
    margin-bottom: 24px;
    padding-left: 24px;
}

.blog-body-text li {
    margin-bottom: 8px;
    line-height: 1.7;
    color: var(--text-secondary);
    font-weight: 400;
}

.blog-body-text strong, .blog-body-text b {
    color: var(--text-primary);
    font-weight: 700;
}


/* Homepage Hero Banner Slider */
.hero-slider {
    position: relative;
    background-color: var(--bg-primary);
    overflow: hidden;
    min-height: 600px;
    display: flex;
    align-items: center;
    padding-top: calc(var(--nav-height) + 25px);
    padding-bottom: 40px;
}

.slider-track {
    position: relative;
    width: 100%;
}

.slide {
    width: 100%;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.8s;
}

.slide.active {
    opacity: 1;
    visibility: visible;
}

/* Inactive slides sit behind the active slide absolute */
.slide:not(.active) {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    height: auto;
}

/* Specific background glow colors per slide to match the theme */
.hero-glow-1 {
    background: radial-gradient(circle, rgba(124, 58, 237, 0.12) 0%, rgba(124, 58, 237, 0) 70%);
}
.hero-glow-2 {
    background: radial-gradient(circle, rgba(6, 182, 212, 0.12) 0%, rgba(6, 182, 212, 0) 70%);
}
.hero-glow-3 {
    background: radial-gradient(circle, rgba(139, 92, 246, 0.12) 0%, rgba(139, 92, 246, 0) 70%);
}

/* Slider navigation arrows */
.slider-controls {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 0 40px;
    pointer-events: none;
    z-index: 10;
}

.slider-arrow {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: var(--text-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: auto;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.slider-arrow:hover {
    background-color: var(--accent-blue);
    color: #fff;
    border-color: var(--accent-blue);
    transform: scale(1.08);
    box-shadow: 0 6px 20px rgba(124, 58, 237, 0.3);
}

/* Slider indicator dots */
.slider-indicator-dots {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 12px;
    z-index: 10;
}

.slider-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: rgba(15, 23, 42, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: all 0.3s ease;
}

.slider-dot.active {
    background-color: var(--accent-blue);
    transform: scale(1.3);
    box-shadow: 0 0 0 3px var(--accent-glow);
}

/* Visual wrapper for slides 2 & 3 */
.slider-visual-card {
    width: 100%;
    height: 380px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Webcast simulated video player card */
.webcast-preview-banner {
    position: relative;
    width: 100%;
    max-width: 460px;
    height: 280px;
    border-radius: 16px;
    background: radial-gradient(circle at center, #1e293b 0%, #0f172a 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: var(--glass-shadow), 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.webcast-preview-banner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.15) 0%, rgba(124, 58, 237, 0.05) 100%);
    opacity: 0.5;
    z-index: 1;
}

.webcast-preview-banner:hover {
    transform: translateY(-6px) scale(1.02);
    border-color: rgba(6, 182, 212, 0.4);
    box-shadow: 0 30px 60px rgba(6, 182, 212, 0.15);
}

.webcast-card-logo {
    height: 24px;
    width: auto;
    object-fit: contain;
    z-index: 2;
    align-self: flex-start;
}

.play-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.95);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-primary);
    font-size: 1.25rem;
    padding-left: 4px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    z-index: 2;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.webcast-preview-banner:hover .play-overlay {
    background-color: var(--accent-cyan);
    color: #fff;
    transform: translate(-50%, -50%) scale(1.1);
    box-shadow: 0 12px 30px rgba(6, 182, 212, 0.4);
}

.webcast-card-info {
    z-index: 2;
}

.webcast-card-tag {
    font-size: 0.625rem;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--accent-cyan);
    letter-spacing: 1px;
    display: inline-block;
    margin-bottom: 6px;
}

.webcast-card-title {
    font-family: var(--font-heading);
    font-size: 1.125rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 4px;
    line-height: 1.3;
}

.webcast-card-meta {
    font-size: 0.6875rem;
    color: var(--text-tertiary);
}

/* AI Data Readiness Checklist visual card */
.readiness-card-box {
    width: 100%;
    max-width: 440px;
    background-color: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.5);
    box-shadow: var(--glass-shadow), 0 25px 50px -12px rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    padding: 24px;
}

.readiness-score-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-secondary);
}

.score-percentage {
    color: var(--accent-blue);
    font-weight: 700;
}

.progress-bar-container {
    width: 100%;
    height: 8px;
    background-color: var(--bg-secondary);
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 24px;
}

.progress-bar-fill {
    height: 100%;
    background: var(--grad-primary);
    border-radius: 4px;
    transition: width 1s ease;
}

.readiness-metrics-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.metric-row {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.metric-row i {
    font-size: 1.125rem;
    margin-top: 2px;
}

.metric-row.pass i {
    color: #16a34a;
}

.metric-row.warn i {
    color: #ea580c;
}

.metric-info {
    display: flex;
    flex-direction: column;
}

.metric-info strong {
    font-size: 0.84375rem;
    font-weight: 600;
    color: var(--text-primary);
}

.metric-info span {
    font-size: 0.6875rem;
    color: var(--text-secondary);
    margin-top: 2px;
}

/* Mobile responsive fixes for slider */
@media (max-width: 991px) {
    .hero-slider {
        padding-top: calc(var(--nav-height) + 20px);
        padding-bottom: 60px;
        min-height: auto;
    }
    .slide:not(.active) {
        position: absolute;
        top: 0;
        left: 0;
        transform: none;
        height: 100%;
    }
    .slider-visual-card {
        height: 320px;
        margin-top: 24px;
    }
    .slider-controls {
        padding: 0 15px;
    }
    .slider-arrow {
        width: 38px;
        height: 38px;
        font-size: 0.8125rem;
    }
}

/* ==========================================================================
   Synapse Theme Design System Extensions
   ========================================================================== */

/* Dark Cosmic Mode Overrides for Hero Slider & CTA */
.hero-slider.dark-theme {
    background-color: #070512;
    background-image: 
        radial-gradient(circle at 10% 20%, rgba(124, 58, 237, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 90% 80%, rgba(217, 70, 239, 0.04) 0%, transparent 50%);
    color: #ffffff;
    border-bottom: 1px solid rgba(124, 58, 237, 0.1);
}

.hero-slider.dark-theme .slide {
    color: #ffffff;
}

.hero-slider.dark-theme .hero-title {
    color: #ffffff;
}

.hero-slider.dark-theme .hero-desc {
    color: #94a3b8;
}

.hero-slider.dark-theme .hero-badge {
    background-color: rgba(124, 58, 237, 0.1);
    border-color: rgba(124, 58, 237, 0.3);
    color: #c084fc;
}

.hero-slider.dark-theme .slider-arrow {
    background-color: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}

.hero-slider.dark-theme .slider-arrow:hover {
    background-color: #7c3aed;
    border-color: #7c3aed;
}

.hero-slider.dark-theme .slider-dot {
    background-color: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.1);
}

.hero-slider.dark-theme .slider-dot.active {
    background-color: #c084fc;
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.3);
}

/* Glassmorphism & Neon Shadows */
.synapse-glass-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--border-radius-md);
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    overflow: hidden;
}

.synapse-glass-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: radial-gradient(circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(139, 92, 246, 0.12) 0%, transparent 60%);
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
    z-index: 0;
}

.synapse-glass-card:hover {
    transform: translateY(-6px);
    border-color: rgba(139, 92, 246, 0.3);
    box-shadow: 0 20px 40px rgba(124, 58, 237, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.synapse-glass-card:hover::before {
    opacity: 1;
}

/* Light Glassmorphism for hybrid sections */
.synapse-glass-card-light {
    background: rgba(255, 255, 255, 0.65);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(124, 58, 237, 0.12);
    border-radius: var(--border-radius-md);
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: var(--card-shadow);
}

.synapse-glass-card-light:hover {
    transform: translateY(-6px);
    border-color: rgba(217, 70, 239, 0.3);
    box-shadow: 0 20px 40px rgba(124, 58, 237, 0.08);
}

/* Badge System */
.section-subtitle-badge {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 6px 18px;
    background: rgba(124, 58, 237, 0.06);
    border: 1px solid rgba(124, 58, 237, 0.15);
    color: #7c3aed;
    border-radius: 50px;
    margin-bottom: 18px;
}

/* High-tech Ornaments */
.tech-dot-grid {
    background-image: radial-gradient(rgba(124, 58, 237, 0.08) 1.5px, transparent 1.5px);
    background-size: 24px 24px;
}

.glow-blob {
    position: absolute;
    width: 450px;
    height: 450px;
    border-radius: 50%;
    filter: blur(120px);
    background: radial-gradient(circle, rgba(124, 58, 237, 0.08) 0%, rgba(217, 70, 239, 0.01) 70%);
    pointer-events: none;
    z-index: 1;
}

/* Orbit Neural Graphic Overrides for Purple Theme */
.ai-node-circle {
    border-color: rgba(139, 92, 246, 0.18) !important;
}

.orbiting-node {
    color: #a855f7 !important;
    border-color: rgba(139, 92, 246, 0.25) !important;
}

.orbiting-node:hover {
    color: #ffffff !important;
    background: var(--grad-primary) !important;
    box-shadow: 0 0 25px rgba(217, 70, 239, 0.5) !important;
    border-color: transparent !important;
}

.ai-core {
    background: var(--grad-primary) !important;
    box-shadow: 0 0 50px rgba(124, 58, 237, 0.5) !important;
}

/* CTA Workshop Banner Glowing Canvas */
.cta-banner-cosmic {
    background: radial-gradient(circle at top right, rgba(217, 70, 239, 0.15), transparent 60%), radial-gradient(circle at bottom left, rgba(124, 58, 237, 0.2), transparent 60%), #070512 !important;
    border: 1px solid rgba(124, 58, 237, 0.15);
    box-shadow: 0 25px 60px -15px rgba(124, 58, 237, 0.25);
    position: relative;
    overflow: hidden;
}

/* Animated Neon Borders */
.neon-border-glow {
    position: relative;
}

.neon-border-glow::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.4), rgba(217, 70, 239, 0.1), rgba(124, 58, 237, 0.4));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    opacity: 0.6;
    transition: opacity 0.3s ease;
}

.neon-border-glow:hover::after {
    opacity: 1;
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.8), rgba(217, 70, 239, 0.6), rgba(124, 58, 237, 0.8));
}

/* Dark theme overrides for the readiness checklist card on Slide 3 */
.hero-slider.dark-theme .readiness-card-box {
    background-color: rgba(15, 12, 30, 0.65);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-color: rgba(124, 58, 237, 0.25);
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.hero-slider.dark-theme .readiness-score-header {
    color: #e2e8f0;
}

.hero-slider.dark-theme .metric-info strong {
    color: #ffffff;
}

.hero-slider.dark-theme .metric-info span {
    color: #94a3b8;
}

.hero-slider.dark-theme .progress-bar-container {
    background-color: rgba(255, 255, 255, 0.1);
}

/* Dark theme overrides for AI Inception / Engagements Section */
.ai-inception-section.dark-theme {
    background-color: #070512;
    background-image: radial-gradient(rgba(124, 58, 237, 0.05) 1.5px, transparent 1.5px);
    background-size: 32px 32px;
    color: #ffffff;
    border-bottom: 1px solid rgba(124, 58, 237, 0.1);
}

.ai-inception-section.dark-theme .section-title {
    color: #ffffff;
}

.ai-inception-section.dark-theme .section-desc {
    color: #94a3b8;
}

.ai-inception-section.dark-theme .ai-card {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(124, 58, 237, 0.15);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.05);
    color: #ffffff;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.ai-inception-section.dark-theme .ai-card:hover {
    border-color: rgba(217, 70, 239, 0.35);
    box-shadow: 0 25px 50px rgba(124, 58, 237, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    transform: translateY(-8px);
}

.ai-inception-section.dark-theme .ai-card h3 {
    color: #ffffff;
}

.ai-inception-section.dark-theme .ai-card-subtitle {
    color: #94a3b8;
}

.ai-inception-section.dark-theme .ai-card-pitch {
    color: #f1f5f9;
}

.ai-inception-section.dark-theme .ai-card-pitch span {
    border-color: #d946ef;
}

.ai-inception-section.dark-theme .ai-card-desc {
    color: #cbd5e1;
}

.ai-inception-section.dark-theme .ai-card-price-callout {
    background-color: rgba(255, 255, 255, 0.04);
    border-left-color: #7c3aed;
    color: #cbd5e1;
}

.ai-inception-section.dark-theme .ai-card-price-callout strong {
    color: #ffffff;
}

.ai-inception-section.dark-theme .ai-card-divider {
    background-color: rgba(255, 255, 255, 0.08);
}

.ai-inception-section.dark-theme .ai-card-features-heading {
    color: #c084fc;
}

.ai-inception-section.dark-theme .feature-list-item {
    color: #cbd5e1;
}

.ai-inception-section.dark-theme .ai-tag-existing {
    background-color: rgba(124, 58, 237, 0.15);
    color: #c084fc;
}

.ai-inception-section.dark-theme .ai-tag-new {
    background-color: rgba(6, 182, 212, 0.15);
    color: #22d3ee;
}

/* Play button hover gradient and glowing shadow overrides */
.video-play-btn:hover {
    transform: scale(1.1);
    background: var(--grad-primary) !important;
    color: var(--bg-primary) !important;
    box-shadow: 0 0 25px rgba(124, 58, 237, 0.4) !important;
}

.cta-banner-cosmic .section-title {
    color: #ffffff;
}

.cta-banner-cosmic .section-desc {
    color: #cbd5e1;
}

/* ==========================================================================
   Layout Grids & Cards (Synapse Inspired Layouts)
   ========================================================================== */
.challenge-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 32px;
    margin-top: 40px;
}

.split-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.pricing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 32px;
    margin-top: 40px;
    align-items: stretch;
}

/* Card Spacing & Base Layouts */
.challenge-card {
    padding: 40px;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.challenge-card-icon {
    width: 50px;
    height: 50px;
    border-radius: var(--border-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    margin-bottom: 24px;
}

.challenge-card-icon.red {
    background-color: rgba(239, 68, 68, 0.1);
    color: #ef4444;
}

.challenge-card-icon.yellow {
    background-color: rgba(245, 158, 11, 0.1);
    color: #f59e0b;
}

.challenge-card-icon.blue {
    background-color: rgba(139, 92, 246, 0.1);
    color: var(--artha-primary-500);
}

.step-card {
    padding: 40px;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    height: 100%;
}

.step-num {
    font-size: 4rem;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 20px;
    display: block;
}

.pricing-card {
    padding: 50px 40px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    position: relative;
}

/* Responsive Media Queries for Grids */
@media (max-width: 991px) {
    .split-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .challenge-grid, .pricing-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 24px;
    }
}

@media (max-width: 768px) {
    .challenge-grid, .pricing-grid {
        grid-template-columns: 1fr;
    }
    
    .challenge-card, .step-card, .pricing-card {
        padding: 30px 24px;
    }
}

/* ==========================================================================
   Full Home Page Cosmic Light Theme (Synapse Inspired - White & Shades)
   ========================================================================== */

body.home-page-light {
    background-color: #ffffff;
    color: #475569;
    font-family: var(--font-body);
}

/* Header & Navigation */
body.home-page-light .header {
    background-color: rgba(255, 255, 255, 0.82) !important;
    border-bottom: 1px solid rgba(124, 58, 237, 0.12) !important;
    box-shadow: 0 4px 30px rgba(124, 58, 237, 0.04) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
}

body.home-page-light .header.shrunk {
    background-color: rgba(255, 255, 255, 0.98) !important;
}

body.home-page-light .nav-link {
    color: #475569 !important;
}

body.home-page-light .nav-link:hover,
body.home-page-light .nav-link.active {
    color: #7c3aed !important;
}

body.home-page-light .logo-img {
    filter: none !important; /* Keep original colored logo */
}

body.home-page-light .nav-mega-menu {
    background-color: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid rgba(124, 58, 237, 0.12) !important;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.08) !important;
    backdrop-filter: blur(24px) !important;
    -webkit-backdrop-filter: blur(24px) !important;
}

body.home-page-light .mega-menu-title {
    color: #0f172a !important;
}

body.home-page-light .mega-menu-link:hover .mega-menu-title {
    color: #7c3aed !important;
}

body.home-page-light .mega-menu-desc {
    color: #64748b !important;
}

body.home-page-light .mega-menu-column h4 {
    color: #7c3aed !important;
    border-bottom-color: rgba(124, 58, 237, 0.15) !important;
}

body.home-page-light .industry-grid-item,
body.home-page-light .resource-grid-item {
    color: #475569 !important;
}

body.home-page-light .industry-grid-item:hover,
body.home-page-light .resource-grid-item:hover {
    color: #7c3aed !important;
    background-color: rgba(124, 58, 237, 0.04) !important;
}

body.home-page-light .partner-mini-item {
    background-color: #ffffff !important;
    border-color: rgba(226, 232, 240, 0.8) !important;
    color: #0f172a !important;
}

body.home-page-light .partner-mini-item:hover {
    border-color: #7c3aed !important;
    background-color: #f8fafc !important;
}

body.home-page-light .nav-mega-menu .mega-featured-card {
    background: radial-gradient(circle at top right, rgba(124, 58, 237, 0.05), rgba(217, 70, 239, 0.01)), #ffffff !important;
    border-color: rgba(226, 232, 240, 0.8) !important;
}

body.home-page-light .nav-mega-menu .mega-featured-card h5 {
    color: #0f172a !important;
}

body.home-page-light .nav-mega-menu .mega-featured-card p {
    color: #64748b !important;
}

body.home-page-light .nav-mega-menu .success-story-item .mega-menu-desc {
    color: #475569 !important;
}

body.home-page-light .nav-menu form input {
    background-color: rgba(15, 23, 42, 0.02) !important;
    border-color: rgba(15, 23, 42, 0.08) !important;
    color: #0f172a !important;
}

body.home-page-light .nav-menu form input:focus {
    border-color: #7c3aed !important;
    box-shadow: 0 0 10px rgba(124, 58, 237, 0.15) !important;
}

/* Sections & Typography */
body.home-page-light .section {
    background-color: #ffffff !important;
    color: #475569 !important;
    border-bottom: 1px solid rgba(124, 58, 237, 0.05);
}

body.home-page-light .section-alt {
    background-color: #f8fafc !important;
    color: #475569 !important;
    border-bottom: 1px solid rgba(124, 58, 237, 0.05);
}

body.home-page-light .section-title {
    color: #0f172a !important;
}

body.home-page-light .section-desc {
    color: #475569 !important;
}

/* Footer overrides (Keep dark footer for strong layout anchor) */
body.home-page-light .footer {
    background-color: #080710 !important;
    border-top: 1px solid rgba(124, 58, 237, 0.12) !important;
    color: #94a3b8 !important;
}

body.home-page-light .footer-column h4 {
    color: #ffffff !important;
}

body.home-page-light .footer-link {
    color: #cbd5e1 !important;
}

body.home-page-light .footer-link:hover {
    color: #d946ef !important;
}

body.home-page-light .footer-bottom {
    border-top-color: rgba(255, 255, 255, 0.05) !important;
}

/* Partner band styling on light */
body.home-page-light .partner-section {
    background-color: #f8fafc !important;
    border-top: 1px solid #f1f5f9 !important;
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 24px 0 !important;
}

body.home-page-light .partner-item {
    color: #94a3b8 !important;
    font-size: 0.90625rem !important;
    font-weight: 600 !important;
    opacity: 1 !important;
}

body.home-page-light .partner-item:hover {
    color: #6366f1 !important;
}

/* Hero Slider Light mode */
body.home-page-light .hero-slider {
    background-color: #ffffff !important;
    background-image: 
        radial-gradient(circle at 10% 20%, rgba(124, 58, 237, 0.04) 0%, transparent 50%),
        radial-gradient(circle at 90% 80%, rgba(217, 70, 239, 0.03) 0%, transparent 50%) !important;
    color: #475569 !important;
    border-bottom: 1px solid rgba(124, 58, 237, 0.06) !important;
}

body.home-page-light .hero-slider .slide {
    color: #475569 !important;
}

body.home-page-light .hero-slider .hero-title {
    color: #0f172a !important;
}

body.home-page-light .hero-slider .hero-desc {
    color: #475569 !important;
}

body.home-page-light .hero-slider .hero-badge {
    background-color: rgba(124, 58, 237, 0.05) !important;
    border-color: rgba(124, 58, 237, 0.15) !important;
    color: #7c3aed !important;
}

body.home-page-light .hero-slider .slider-arrow {
    background-color: rgba(15, 23, 42, 0.04) !important;
    border-color: rgba(15, 23, 42, 0.08) !important;
    color: #0f172a !important;
}

body.home-page-light .hero-slider .slider-arrow:hover {
    background-color: #7c3aed !important;
    color: #ffffff !important;
    border-color: #7c3aed !important;
}

body.home-page-light .hero-slider .slider-dot {
    background-color: rgba(15, 23, 42, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.8) !important;
}

body.home-page-light .hero-slider .slider-dot.active {
    background-color: #7c3aed !important;
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15) !important;
}

body.home-page-light .hero-slider .readiness-card-box {
    background-color: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border-color: rgba(124, 58, 237, 0.15) !important;
    box-shadow: 0 20px 40px rgba(124, 58, 237, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

body.home-page-light .hero-slider .readiness-score-header {
    color: #0f172a !important;
}

body.home-page-light .hero-slider .metric-info strong {
    color: #0f172a !important;
}

body.home-page-light .hero-slider .metric-info span {
    color: #64748b !important;
}

body.home-page-light .hero-slider .progress-bar-container {
    background-color: rgba(15, 23, 42, 0.05) !important;
}

/* Challenge Cards */
body.home-page-light .challenge-card {
    background: rgba(255, 255, 255, 0.75) !important;
    border: 1px solid rgba(124, 58, 237, 0.12) !important;
    box-shadow: 0 15px 35px rgba(124, 58, 237, 0.03), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

body.home-page-light .challenge-card:hover {
    border-color: rgba(217, 70, 239, 0.3) !important;
    box-shadow: 0 20px 40px rgba(124, 58, 237, 0.08) !important;
    transform: translateY(-8px);
}

body.home-page-light .challenge-card h3 {
    color: #0f172a !important;
}

body.home-page-light .challenge-card p {
    color: #475569 !important;
}

/* Split Solution Area */
body.home-page-light .tech-visual-container {
    background-color: rgba(255, 255, 255, 0.75) !important;
    border: 1px solid rgba(124, 58, 237, 0.12) !important;
    box-shadow: 0 25px 50px rgba(124, 58, 237, 0.04), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

body.home-page-light .tech-visual-container strong {
    color: #0f172a !important;
}

body.home-page-light .tech-visual-container span {
    color: #64748b !important;
}

body.home-page-light .tech-visual-container .progress-bar-container {
    background-color: rgba(15, 23, 42, 0.05) !important;
}

/* Steps / Roadmap Section */
body.home-page-light .step-card {
    background: rgba(255, 255, 255, 0.75) !important;
    border: 1px solid rgba(124, 58, 237, 0.12) !important;
    box-shadow: 0 15px 35px rgba(124, 58, 237, 0.03), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

body.home-page-light .step-card:hover {
    border-color: rgba(217, 70, 239, 0.3) !important;
    box-shadow: 0 20px 40px rgba(124, 58, 237, 0.08) !important;
    transform: translateY(-6px);
}

body.home-page-light .step-num {
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.15) 0%, rgba(217, 70, 239, 0.02) 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* Pricing Grid */
body.home-page-light .pricing-card {
    background: rgba(255, 255, 255, 0.75) !important;
    border: 1px solid rgba(124, 58, 237, 0.12) !important;
    box-shadow: 0 15px 35px rgba(124, 58, 237, 0.03), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
    color: #475569 !important;
}

body.home-page-light .pricing-card.featured {
    border-color: #d946ef !important;
    background: radial-gradient(circle at top right, rgba(217, 70, 239, 0.04), transparent 50%), rgba(255, 255, 255, 0.85) !important;
    box-shadow: 0 20px 40px rgba(217, 70, 239, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

body.home-page-light .pricing-card:hover {
    border-color: #c084fc !important;
    box-shadow: 0 25px 45px rgba(124, 58, 237, 0.08) !important;
    transform: translateY(-8px);
}

body.home-page-light .pricing-header h3 {
    color: #475569 !important;
}

body.home-page-light .pricing-price {
    color: #0f172a !important;
}

body.home-page-light .pricing-price-sub {
    color: #64748b !important;
}

body.home-page-light .pricing-list-item {
    color: #475569 !important;
}

/* Testimonials */
body.home-page-light .video-card {
    background: rgba(255, 255, 255, 0.75) !important;
    border: 1px solid rgba(124, 58, 237, 0.12) !important;
    box-shadow: 0 15px 35px rgba(124, 58, 237, 0.03), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

body.home-page-light .video-card:hover {
    border-color: rgba(217, 70, 239, 0.3) !important;
    box-shadow: 0 20px 40px rgba(124, 58, 237, 0.08) !important;
    transform: translateY(-6px);
}

body.home-page-light .video-card h4 {
    color: #0f172a !important;
}

body.home-page-light .video-card p {
    color: #475569 !important;
}

/* Specific Home Light Theme Text Color Overrides for Visibility */
body.home-page-light .solution-details .metric-info strong {
    color: #0f172a !important;
}

body.home-page-light .solution-details .metric-info span {
    color: #64748b !important;
}

body.home-page-light .step-card h4 {
    color: #0f172a !important;
}

body.home-page-light .step-card p {
    color: #64748b !important;
}

body.home-page-light .testimonial-rating strong {
    color: #0f172a !important;
}

/* Home Page Spacing & Stats Section Adjustments */
body.home-page-light .section {
    background-color: #ffffff !important;
    color: #475569 !important;
    border-bottom: 1px solid rgba(124, 58, 237, 0.05);
    padding: 70px 0 !important; /* Reduced from 100px */
}

body.home-page-light .section-alt {
    background-color: #f8fafc !important;
    color: #475569 !important;
    border-bottom: 1px solid rgba(124, 58, 237, 0.05);
    padding: 70px 0 !important; /* Reduced from 100px */
}

body.home-page-light #client-logos {
    padding: 45px 0 !important; /* Tighter logo band */
}

body.home-page-light #home-industries {
    padding: 70px 0 45px 0 !important; /* Tighter padding at bottom, before stats */
}

body.home-page-light .stats-section {
    /* Combine radial dot grid with a very subtle gradient for cosmic light theme */
    background: radial-gradient(rgba(124, 58, 237, 0.08) 1.5px, transparent 1.5px), 
                linear-gradient(135deg, rgba(124, 58, 237, 0.04) 0%, rgba(217, 70, 239, 0.03) 100%) !important;
    background-size: 24px 24px, auto !important;
    border-top: 1px solid rgba(124, 58, 237, 0.06) !important;
    border-bottom: 1px solid rgba(124, 58, 237, 0.06) !important;
    padding: 70px 0 !important; /* Restored to standard section padding */
    color: #475569 !important;
}

body.home-page-light .stats-section .stat-number {
    background: linear-gradient(135deg, #7c3aed 0%, #d946ef 100%);
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    font-weight: 800;
}

/* Impact Grid & Cards */
body.home-page-light .impact-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 24px;
    margin-top: 40px;
}

body.home-page-light .impact-card {
    background: rgba(255, 255, 255, 0.8) !important;
    border: 1px solid rgba(124, 58, 237, 0.12) !important;
    border-radius: 16px !important;
    padding: 30px 24px !important;
    text-align: left !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: var(--card-shadow) !important;
}

body.home-page-light .impact-card:hover {
    border-color: rgba(217, 70, 239, 0.3) !important;
    box-shadow: 0 20px 40px rgba(124, 58, 237, 0.08) !important;
    transform: translateY(-6px) !important;
}

body.home-page-light .impact-card-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: rgba(124, 58, 237, 0.05);
    color: #7c3aed;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    margin-bottom: 20px;
}

body.home-page-light .impact-card-title {
    font-size: 1.0625rem;
    font-weight: 800;
    color: #0f172a !important;
    margin-bottom: 8px;
    font-family: var(--font-heading);
}

body.home-page-light .impact-card-desc {
    font-size: 0.84375rem;
    color: #475569 !important;
    line-height: 1.5;
    margin-bottom: 20px;
}

body.home-page-light .impact-card-link {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #7c3aed !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    transition: all 0.2s ease;
}

body.home-page-light .impact-card-link i {
    font-size: 0.6875rem;
    transition: transform 0.2s ease;
}

body.home-page-light .impact-card-link:hover {
    color: #d946ef !important;
}

body.home-page-light .impact-card-link:hover i {
    transform: translateX(4px);
}

body.home-page-light #testimonials {
    padding: 55px 0 70px 0 !important; /* Reduced padding above testimonials header */
}

body.home-page-light .analyst-speak-section {
    padding: 70px 0 !important; /* Reduced from 100px */
}
/* ==========================================================================
   ThinkArtha Healthcare Industry Microsite CSS
   ========================================================================== */

/* Subnavigation Bar */
.healthcare-subnav-container {
    position: sticky;
    top: 70px;
    z-index: 100;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 20px -10px rgba(0,0,0,0.05);
    padding: 12px 0;
    transition: all 0.3s ease;
}

.healthcare-subnav-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.healthcare-subnav-brand {
    font-family: var(--font-heading);
    font-weight: 800;
    font-size: 1rem;
    color: #4c1d95;
    display: flex;
    align-items: center;
    gap: 8px;
}

.healthcare-subnav-brand i {
    color: #7c3aed;
    font-size: 1.125rem;
}

.healthcare-subnav-toggle {
    display: none;
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--text-primary);
    cursor: pointer;
}

.healthcare-subnav-list {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0;
    padding: 0;
}

.healthcare-subnav-link {
    font-size: 0.84375rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-decoration: none;
    transition: all 0.2s ease;
    padding: 6px 4px;
    border-bottom: 2px solid transparent;
    white-space: nowrap !important;
}

.healthcare-subnav-link:hover,
.healthcare-subnav-link.active {
    color: #7c3aed;
    border-bottom-color: #7c3aed;
}

.btn-subnav-cta {
    padding: 8px 18px !important;
    font-size: 0.78125rem !important;
    border-radius: 30px !important;
    background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%) !important;
    color: white !important;
    border: none !important;
    box-shadow: 0 4px 15px -3px rgba(124, 58, 237, 0.4) !important;
    white-space: nowrap !important;
}

.btn-subnav-cta:hover {
    box-shadow: 0 6px 20px -3px rgba(124, 58, 237, 0.6) !important;
    transform: translateY(-1px);
}

/* Healthcare Subnav Dropdowns */
.healthcare-subnav-list li {
    position: relative;
}

.healthcare-subnav-dropdown {
    position: relative;
}

.healthcare-subnav-dropdown .dropdown-caret {
    font-size: 0.625rem;
    margin-left: 4px;
    transition: transform 0.3s ease;
}

/* Dropdown Menu (Desktop) */
@media (min-width: 992px) {
    .healthcare-dropdown-menu {
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%) translateY(10px);
        background-color: #ffffff;
        min-width: 260px;
        box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
        border: 1px solid rgba(0, 0, 0, 0.08);
        border-radius: 8px;
        padding: 8px 0;
        margin: 0;
        list-style: none;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        z-index: 110;
    }

    .healthcare-subnav-dropdown:hover .healthcare-dropdown-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateX(-50%) translateY(5px);
    }
    
    .healthcare-subnav-dropdown:hover .dropdown-caret {
        transform: rotate(180deg);
    }

    .healthcare-dropdown-menu li {
        width: 100%;
    }

    .healthcare-dropdown-menu a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 20px;
        font-size: 0.84375rem;
        font-weight: 500;
        color: var(--text-secondary) !important;
        text-decoration: none;
        transition: all 0.2s ease;
        border-left: 3px solid transparent;
        white-space: nowrap !important;
        background: transparent !important;
    }

    .healthcare-dropdown-menu a i {
        font-size: 0.875rem;
        color: #7c3aed;
        opacity: 0.8;
        width: 16px;
        text-align: center;
    }

    .healthcare-dropdown-menu a:hover {
        color: #4c1d95 !important;
        background-color: #f3e8ff !important;
        border-left-color: #7c3aed;
    }

    .healthcare-dropdown-menu a.active {
        color: #4c1d95 !important;
        background-color: #f3e8ff !important;
        border-left-color: #7c3aed;
        font-weight: 600;
    }
}

/* Mobile Dropdown Styling */
@media (max-width: 991px) {
    .healthcare-dropdown-menu {
        display: none;
        list-style: none;
        padding: 5px 0 5px 15px;
        margin: 5px 0;
        border-left: 1px solid var(--border-color);
    }
    
    .healthcare-subnav-dropdown.open .healthcare-dropdown-menu {
        display: block;
    }
    
    .healthcare-subnav-dropdown.open .dropdown-caret {
        transform: rotate(180deg);
    }
    
    .healthcare-dropdown-menu a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 8px 10px;
        font-size: 0.8125rem;
        color: var(--text-secondary) !important;
        text-decoration: none;
        border-radius: 4px;
        white-space: nowrap !important;
        background: transparent !important;
    }
    
    .healthcare-dropdown-menu a i {
        color: #7c3aed;
    }
    
    .healthcare-dropdown-menu a.active {
        color: #4c1d95 !important;
        background-color: #f3e8ff !important;
        font-weight: 600;
    }
}

/* AEO Summary Bar */
.aeo-summary-bar {
    background: #fdfdfd;
    border-bottom: 1px solid #f3e8ff;
    padding: 20px 0;
}

.aeo-summary-inner {
    background: #fbfbfe;
    border: 1px solid #e9d5ff;
    border-left: 5px solid #7c3aed;
    border-radius: 8px;
    padding: 20px 24px;
    box-shadow: 0 4px 12px -5px rgba(124, 58, 237, 0.05);
}

.aeo-summary-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(124, 58, 237, 0.08);
    color: #6d28d9;
    font-size: 0.625rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 4px 10px;
    border-radius: 4px;
    margin-bottom: 10px;
}

.aeo-summary-text {
    font-size: 0.90625rem;
    line-height: 1.6;
    color: var(--text-color);
    margin: 0 0 12px 0;
}

.aeo-entities {
    font-size: 0.75rem;
    color: var(--text-secondary);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.aeo-entity-tag {
    background: #f5f3ff;
    color: #4c1d95;
    padding: 2px 8px;
    border-radius: 4px;
    font-weight: 500;
    border: 1px solid #ddd6fe;
}

/* Healthcare Hero Section */
.healthcare-hero {
    background: radial-gradient(circle at 80% 20%, rgba(139, 92, 246, 0.04) 0%, transparent 60%), #ffffff;
    padding: 80px 0;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}

.healthcare-hero-glow {
    position: absolute;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(124, 58, 237, 0.05) 0%, rgba(124, 58, 237, 0) 70%);
    top: -200px;
    left: -200px;
    z-index: 1;
    pointer-events: none;
}

.healthcare-hero-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 60px;
    align-items: center;
    position: relative;
    z-index: 2;
}

.healthcare-hero-content {
    text-align: left;
}

.healthcare-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(124, 58, 237, 0.08);
    color: #7c3aed;
    font-size: 0.6875rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 6px 14px;
    border-radius: 30px;
    margin-bottom: 24px;
}

.healthcare-hero-title {
    font-family: var(--font-heading);
    font-size: 2.875rem;
    font-weight: 800;
    line-height: 1.2;
    color: #1e1b4b;
    margin-bottom: 20px;
    letter-spacing: -1px;
}

.healthcare-hero-title span {
    background: linear-gradient(135deg, #7c3aed 0%, #d946ef 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.healthcare-hero-subtitle {
    font-size: 1.125rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin-bottom: 35px;
}

.healthcare-hero-ctas {
    display: flex;
    gap: 15px;
    margin-bottom: 40px;
}

.healthcare-hero-bullets {
    border-top: 1px solid var(--border-color);
    padding-top: 25px;
}

.healthcare-hero-bullets h4 {
    font-size: 0.84375rem;
    font-weight: 700;
    color: #4c1d95;
    margin-bottom: 15px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.hero-bullet-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.hero-bullet-list li {
    font-size: 0.84375rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 8px;
}

.hero-bullet-list li i {
    color: #10b981;
    font-size: 0.875rem;
}

/* Hero Visual Graphic */
.healthcare-hero-visual {
    display: flex;
    justify-content: center;
    align-items: center;
}

.healthcare-vis-container {
    width: 320px;
    height: 320px;
    position: relative;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255,255,255,0.9) 0%, rgba(245,243,255,0.4) 100%);
    border: 1px dashed rgba(124, 58, 237, 0.2);
    display: flex;
    justify-content: center;
    align-items: center;
}

.tech-grid-bg {
    position: absolute;
    width: 120%;
    height: 120%;
    background-image: radial-gradient(rgba(124, 58, 237, 0.08) 1.5px, transparent 1.5px);
    background-size: 20px 20px;
    z-index: 1;
}

.tech-circle {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 10px 30px rgba(124, 58, 237, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    z-index: 2;
    border: 1px solid rgba(124, 58, 237, 0.15);
}

.tech-ring {
    position: absolute;
    border: 1px solid rgba(124, 58, 237, 0.08);
    border-radius: 50%;
}

.ring-1 { width: 180px; height: 180px; }
.ring-2 { width: 260px; height: 260px; }

.tech-node {
    position: absolute;
    background: white;
    border: 1px solid rgba(124, 58, 237, 0.15);
    box-shadow: 0 6px 15px rgba(0,0,0,0.04);
    padding: 8px 14px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.6875rem;
    font-weight: 700;
    z-index: 3;
    transition: all 0.3s ease;
}

.tech-node i {
    color: #7c3aed;
}

.tech-node-1 { top: 30px; left: -10px; }
.tech-node-2 { top: 40px; right: -15px; }
.tech-node-3 { bottom: 35px; left: -5px; }
.tech-node-4 { bottom: 25px; right: 10px; }

/* Sections */
.healthcare-section {
    padding: 90px 0;
}

.healthcare-section.section-alt {
    background-color: #fafafa;
}

.healthcare-section-header {
    max-width: 700px;
    margin-bottom: 50px;
}

.healthcare-section-header.text-center {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.healthcare-subtitle {
    font-size: 0.6875rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #7c3aed;
    display: block;
    margin-bottom: 12px;
}

.healthcare-title {
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: 800;
    color: #1e1b4b;
    line-height: 1.25;
    margin-bottom: 16px;
    letter-spacing: -0.5px;
}

.healthcare-desc {
    font-size: 1rem;
    line-height: 1.6;
    color: var(--text-secondary);
}

/* Grids and Cards */
.healthcare-card-grid {
    display: grid;
    gap: 30px;
}

.healthcare-card-grid.grid-3 {
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
}

.healthcare-card-grid.grid-4 {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.healthcare-card {
    background: #ffffff;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 35px;
    box-shadow: 0 4px 20px -5px rgba(0,0,0,0.02);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
}

.challenge-card {
    border-top: 4px solid #f87171;
}

.challenge-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px -10px rgba(0,0,0,0.05);
    border-color: #f87171;
}

.hover-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px -10px rgba(124, 58, 237, 0.08);
    border-color: rgba(124, 58, 237, 0.25);
}

.card-icon-circle {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #f5f3ff;
    color: #7c3aed;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.125rem;
    margin-bottom: 24px;
    transition: all 0.3s ease;
}

.hover-card:hover .card-icon-circle {
    background: #7c3aed;
    color: white;
}

.card-title {
    font-family: var(--font-heading);
    font-size: 1.1875rem;
    font-weight: 700;
    color: #1e1b4b;
    margin-bottom: 12px;
    line-height: 1.4;
}

.card-desc {
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin: 0;
}

.card-link {
    font-size: 0.84375rem;
    font-weight: 700;
    color: #7c3aed;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 24px;
    transition: gap 0.2s ease;
}

.card-link:hover {
    gap: 10px;
}

.card-link i {
    font-size: 0.6875rem;
}

/* 5-Layer Framework */
.framework-layers-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 900px;
    margin: 0 auto;
}

.framework-layer-item {
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    display: flex;
    gap: 30px;
    padding: 30px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.01);
    transition: transform 0.2s ease, border-color 0.2s ease;
    align-items: center;
}

.framework-layer-item:hover {
    transform: translateX(5px);
    border-color: rgba(124, 58, 237, 0.2);
}

.layer-number {
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: 800;
    color: #c084fc;
    width: 60px;
    height: 60px;
    background: #f5f3ff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.layer-content {
    flex-grow: 1;
}

.layer-title {
    font-family: var(--font-heading);
    font-size: 1.125rem;
    font-weight: 800;
    color: #1e1b4b;
    margin-bottom: 6px;
}

.layer-desc {
    font-size: 0.90625rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin: 0;
}

/* Who We Help Tabs */
.audience-tabs-container {
    max-width: 960px;
    margin: 0 auto;
}

.audience-tabs-nav {
    display: flex;
    justify-content: center;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 35px;
    gap: 15px;
}

.audience-tab-btn {
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 12px 24px;
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all 0.2s ease;
}

.audience-tab-btn.active,
.audience-tab-btn:hover {
    color: #7c3aed;
    border-bottom-color: #7c3aed;
}

.audience-tabs-content {
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 40px;
    box-shadow: 0 4px 20px -5px rgba(0,0,0,0.02);
}

.audience-tab-pane {
    display: none;
}

.audience-tab-pane.active {
    display: block;
}

.audience-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.audience-col {
    display: flex;
    flex-direction: column;
}

.aud-block-title {
    font-size: 0.84375rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #1e1b4b;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.aud-text {
    font-size: 0.90625rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin: 0;
}

/* Business Outcomes Checklist */
.outcomes-checklist-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 20px;
    max-width: 900px;
    margin: 0 auto;
}

.outcome-checklist-item {
    background: white;
    border: 1px solid var(--border-color);
    padding: 20px 25px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 0.90625rem;
    line-height: 1.4;
    color: var(--text-color);
}

.outcome-checklist-item i {
    font-size: 1.125rem;
    color: #10b981;
    flex-shrink: 0;
}

/* Architecture Flow Diagram */
.architecture-flow-diagram {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 700px;
    margin: 0 auto;
}

.flow-step {
    background: white;
    border: 1px solid var(--border-color);
    padding: 20px 30px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    gap: 15px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.02);
    width: 100%;
}

.flow-step-number {
    width: 32px;
    height: 32px;
    background: #f5f3ff;
    border: 1px solid rgba(124, 58, 237, 0.15);
    color: #7c3aed;
    font-weight: 800;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.flow-step-text {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--text-color);
}

.flow-arrow {
    color: #c084fc;
    font-size: 1.125rem;
    padding: 10px 0;
    animation: bounce 2s infinite;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-5px); }
    60% { transform: translateY(-2px); }
}

/* Metric / Outcome Cards */
.outcome-card {
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 30px;
    display: flex;
    flex-direction: column;
}

.outcome-icon {
    font-size: 1.5rem;
    color: #7c3aed;
    margin-bottom: 16px;
}

.outcome-title {
    font-size: 1rem;
    font-weight: 700;
    color: #1e1b4b;
    margin-bottom: 8px;
}

.outcome-text {
    font-size: 0.84375rem;
    color: var(--text-secondary);
    line-height: 1.5;
    margin: 0;
}

/* FAQ Accordion Layout */
.faq-accordion-container {
    max-width: 800px;
    margin: 0 auto;
    display: grid;
    gap: 16px;
}

.faq-accordion-item {
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    overflow: hidden;
}

.faq-accordion-trigger {
    width: 100%;
    background: transparent;
    border: none;
    padding: 20px 24px;
    text-align: left;
    font-size: 0.9375rem;
    font-weight: 700;
    color: #1e1b4b;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.faq-accordion-trigger.active {
    border-bottom: 1px solid var(--border-color);
}

.faq-accordion-trigger i {
    font-size: 0.6875rem;
    color: var(--text-tertiary);
    transition: transform 0.2s ease;
}

.faq-accordion-panel {
    padding: 0 24px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out, padding 0.2s ease-out;
}

.faq-accordion-item.active .faq-accordion-panel,
.faq-accordion-trigger.active + .faq-accordion-panel,
.faq-accordion-panel.is-open,
.faq-accordion-panel.active {
    max-height: 1200px;
}

.faq-accordion-panel p {
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin: 0;
}

/* Bottom CTA section */
.healthcare-bottom-cta {
    background: linear-gradient(135deg, #4c1d95 0%, #1e1b4b 100%);
    padding: 90px 0;
    color: white;
    position: relative;
    overflow: hidden;
}

.healthcare-bottom-cta::after {
    content: '';
    position: absolute;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(139, 92, 246, 0.15) 0%, transparent 60%);
    bottom: -150px;
    right: -100px;
}

.cta-title {
    font-family: var(--font-heading);
    font-size: 2.125rem;
    font-weight: 800;
    color: white;
    margin-bottom: 16px;
    letter-spacing: -0.5px;
}

.cta-subtitle {
    font-size: 1rem;
    color: #ddd6fe;
    max-width: 600px;
    margin: 0 auto 35px;
}

.cta-actions {
    display: flex;
    gap: 15px;
    justify-content: center;
}

/* Case Study Cards specific */
.case-study-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.06);
    border-color: rgba(124, 58, 237, 0.15);
}

.card-image-placeholder {
    height: 180px;
    background: linear-gradient(135deg, #7c3aed, #4c1d95);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.25rem;
    flex-shrink: 0;
}

.case-study-tag {
    background: #f5f3ff;
    color: #7c3aed;
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    align-self: flex-start;
    margin-bottom: 15px;
}

/* Use cases filters */
.tag-filter-btn {
    background: white;
    border: 1px solid var(--border-color);
    padding: 8px 18px;
    border-radius: 30px;
    font-size: 0.84375rem;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all 0.2s ease;
}

.tag-filter-btn.active,
.tag-filter-btn:hover {
    background: #7c3aed;
    color: white;
    border-color: #7c3aed;
    box-shadow: 0 4px 15px rgba(124, 58, 237, 0.25);
}

.tag-pill {
    background: #f3f4f6;
    color: #4b5563;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.6875rem;
    font-weight: 600;
}

.use-case-detail-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.05) !important;
    border-color: rgba(124, 58, 237, 0.18) !important;
}

/* Modals & Lead Form Capture styles */
.healthcare-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    align-items: center;
    justify-content: center;
}

.healthcare-modal-content {
    background-color: #ffffff;
    margin: auto;
    padding: 40px;
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 16px;
    width: 90%;
    max-width: 600px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    position: relative;
    animation: modalFadeIn 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes modalFadeIn {
    from { transform: scale(0.95); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

.healthcare-modal-close {
    color: var(--text-tertiary);
    float: right;
    font-size: 1.75rem;
    font-weight: 700;
    position: absolute;
    top: 15px;
    right: 20px;
    cursor: pointer;
    transition: color 0.2s;
}

.healthcare-modal-close:hover {
    color: var(--text-primary);
}

.healthcare-modal-header {
    margin-bottom: 25px;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 15px;
}

.healthcare-modal-header h3 {
    font-family: var(--font-heading);
    font-size: 1.375rem;
    font-weight: 800;
    color: #1e1b4b;
    margin: 0 0 6px 0;
}

.healthcare-modal-header p {
    font-size: 0.84375rem;
    color: var(--text-secondary);
    margin: 0;
}

.form-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 18px;
}

.form-field {
    display: flex;
    flex-direction: column;
    margin-bottom: 18px;
}

.form-field label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 6px;
}

.form-input {
    width: 100%;
    background: #ffffff;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 10px 14px;
    font-family: var(--font-body);
    font-size: 0.875rem;
    color: var(--text-primary);
    transition: border-color 0.2s, box-shadow 0.2s;
}

.form-input:focus {
    border-color: #7c3aed;
    outline: none;
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15);
}

.form-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 15px;
}

.form-checkbox input {
    margin-top: 3px;
}

.required-star {
    color: #ef4444;
}

/* Responsive Microsite elements */
@media (max-width: 991px) {
    .healthcare-subnav-list {
        display: none;
        flex-direction: column;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: white;
        border-bottom: 1px solid var(--border-color);
        box-shadow: 0 10px 15px rgba(0,0,0,0.05);
        padding: 15px 20px;
        gap: 12px;
    }
    .healthcare-subnav-list.show {
        display: flex;
    }
    .healthcare-subnav-toggle {
        display: block;
    }
    .healthcare-hero-grid {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 40px;
    }
    .healthcare-hero-content {
        text-align: center;
    }
    .healthcare-hero-ctas {
        justify-content: center;
    }
    .hero-bullet-list {
        grid-template-columns: 1fr;
    }
    .audience-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .form-grid-2 {
        grid-template-columns: 1fr;
        gap: 0;
    }
}

/* ==========================================================================
   ThinkArtha Artificial Intelligence Solutions Microsite CSS
   ========================================================================== */

:root {
    --ai-purple: #7c3aed;
    --ai-purple-hover: #6d28d9;
    --ai-purple-light: #f3e8ff;
    --ai-purple-glow: rgba(124, 58, 237, 0.15);
}

/* Subnavigation Bar */
.ai-subnav-container {
    position: sticky;
    top: 70px;
    z-index: 100;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 20px -10px rgba(0,0,0,0.05);
    padding: 12px 0;
    transition: all 0.3s ease;
}

.ai-subnav-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.ai-subnav-brand {
    font-family: var(--font-heading);
    font-weight: 800;
    font-size: 1rem;
    color: #4c1d95;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ai-subnav-brand i {
    color: var(--ai-purple);
    font-size: 1.125rem;
}

.ai-subnav-toggle {
    display: none;
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--text-primary);
    cursor: pointer;
}

.ai-subnav-list {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0;
    padding: 0;
}

.ai-subnav-link {
    font-size: 0.84375rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-decoration: none;
    transition: all 0.2s ease;
    padding: 6px 4px;
    border-bottom: 2px solid transparent;
    white-space: nowrap !important;
}

.ai-subnav-link:hover,
.ai-subnav-link.active {
    color: var(--ai-purple);
    border-bottom-color: var(--ai-purple);
}

.btn-subnav-cta {
    padding: 8px 18px !important;
    font-size: 0.78125rem !important;
    border-radius: 20px !important;
    white-space: nowrap !important;
}

/* AI Subnav Dropdowns */
.ai-subnav-list li {
    position: relative;
}

.ai-subnav-dropdown {
    position: relative;
}

.ai-subnav-dropdown .dropdown-caret {
    font-size: 0.625rem;
    margin-left: 4px;
    transition: transform 0.3s ease;
}

/* Dropdown Menu (Desktop) */
@media (min-width: 992px) {
    .ai-dropdown-menu {
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%) translateY(10px);
        background-color: #ffffff;
        min-width: 260px;
        box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
        border: 1px solid rgba(0, 0, 0, 0.08);
        border-radius: 8px;
        padding: 8px 0;
        margin: 0;
        list-style: none;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        z-index: 110;
    }

    .ai-subnav-dropdown:hover .ai-dropdown-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateX(-50%) translateY(5px);
    }
    
    .ai-subnav-dropdown:hover .dropdown-caret {
        transform: rotate(180deg);
    }

    .ai-dropdown-menu li {
        width: 100%;
    }

    .ai-dropdown-menu a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 20px;
        font-size: 0.84375rem;
        font-weight: 500;
        color: var(--text-secondary) !important;
        text-decoration: none;
        transition: all 0.2s ease;
        border-left: 3px solid transparent;
        white-space: nowrap !important;
        background: transparent !important;
    }

    .ai-dropdown-menu a i {
        font-size: 0.875rem;
        color: var(--ai-purple);
        opacity: 0.8;
        width: 16px;
        text-align: center;
    }

    .ai-dropdown-menu a:hover {
        color: var(--text-primary) !important;
        background-color: rgba(124, 58, 237, 0.06) !important;
        border-left-color: var(--ai-purple);
    }

    .ai-dropdown-menu a.active {
        color: var(--text-primary) !important;
        background-color: rgba(124, 58, 237, 0.06) !important;
        border-left-color: var(--ai-purple);
        font-weight: 600;
    }
}

/* Mobile Dropdown Styling */
@media (max-width: 991px) {
    .ai-dropdown-menu {
        display: none;
        list-style: none;
        padding: 5px 0 5px 15px;
        margin: 5px 0;
        border-left: 1px solid var(--border-color);
    }
    
    .ai-subnav-dropdown.open .ai-dropdown-menu {
        display: block;
    }
    
    .ai-subnav-dropdown.open .dropdown-caret {
        transform: rotate(180deg);
    }
    
    .ai-dropdown-menu a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 8px 10px;
        font-size: 0.8125rem;
        color: var(--text-secondary) !important;
        text-decoration: none;
        border-radius: 4px;
        white-space: nowrap !important;
        background: transparent !important;
    }
    
    .ai-dropdown-menu a i {
        color: var(--ai-purple);
    }
    
    .ai-dropdown-menu a.active {
        color: var(--text-primary) !important;
        background-color: rgba(124, 58, 237, 0.06) !important;
        font-weight: 600;
    }
}

/* AI Hero Section */
.ai-hero {
    position: relative;
    padding: 120px 0 80px;
    background: linear-gradient(180deg, #fafafa 0%, #fff 100%);
    overflow: hidden;
}

.ai-hero-glow {
    position: absolute;
    top: -10%;
    right: -10%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(124,58,237,0.06) 0%, rgba(255,255,255,0) 70%);
    pointer-events: none;
    z-index: 1;
}

.ai-hero-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 60px;
    align-items: center;
    position: relative;
    z-index: 2;
}

.ai-badge {
    background: rgba(124, 58, 237, 0.06);
    color: var(--ai-purple);
    border: 1px solid rgba(124, 58, 237, 0.1);
    font-weight: 700;
    padding: 6px 14px;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.75rem;
    margin-bottom: 20px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.ai-hero-title {
    font-size: 3.25rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1.15;
    letter-spacing: -1.5px;
    margin-bottom: 20px;
}

.ai-hero-title span {
    background: linear-gradient(135deg, #a78bfa 0%, #7c3aed 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.ai-hero-subtitle {
    font-size: 1.125rem;
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 30px;
}

.ai-hero-ctas {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

/* AI Orbit Animation Visuals */
.ai-hero-visual {
    display: flex;
    justify-content: center;
    align-items: center;
}

.ai-vis-container {
    width: 320px;
    height: 320px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ai-core-node {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: var(--ai-purple);
    color: white;
    font-size: 2.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 30px rgba(124,58,237,0.3);
    z-index: 10;
    position: relative;
}

.ai-orbit-circle {
    position: absolute;
    border: 1px dashed rgba(124, 58, 237, 0.15);
    border-radius: 50%;
    animation: rotateOrbit 25s linear infinite;
}

.ai-orbit-circle.orbit-1 {
    width: 200px;
    height: 200px;
}

.ai-orbit-circle.orbit-2 {
    width: 290px;
    height: 290px;
    animation-duration: 35s;
    animation-direction: reverse;
}

.ai-satellite {
    position: absolute;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: white;
    border: 1px solid var(--border-color);
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ai-purple);
    font-size: 1rem;
    z-index: 5;
    transition: all 0.3s ease;
}

.ai-satellite.node-a {
    top: 30px;
    left: 40px;
    animation: bounceNode 4s ease-in-out infinite;
}

.ai-satellite.node-b {
    bottom: 40px;
    right: 30px;
    animation: bounceNode 4.5s ease-in-out infinite;
    animation-delay: 1s;
}

.ai-satellite.node-c {
    top: 130px;
    right: -10px;
    animation: bounceNode 5s ease-in-out infinite;
    animation-delay: 2s;
}

@keyframes rotateOrbit {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes bounceNode {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

/* Sections */
.ai-section {
    padding: 80px 0;
    background: white;
}

.ai-section.section-alt {
    background: var(--bg-secondary, #fafafa);
    border-top: 1px solid var(--border-color, rgba(0,0,0,0.04));
    border-bottom: 1px solid var(--border-color, rgba(0,0,0,0.04));
}

.ai-section-header {
    margin-bottom: 50px;
}

.ai-section-header.text-center {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.ai-section-header.text-center .ai-desc {
    margin-left: auto;
    margin-right: auto;
}

.ai-subtitle {
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--ai-purple);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    display: block;
    margin-bottom: 10px;
}

.ai-title {
    font-size: 2.25rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1.25;
    letter-spacing: -0.8px;
    margin-bottom: 15px;
}

.ai-title span {
    background: linear-gradient(135deg, #a78bfa 0%, #7c3aed 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.ai-desc {
    font-size: 0.96875rem;
    color: var(--text-secondary);
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Grids & Cards */
.ai-card-grid {
    display: grid;
    gap: 30px;
}

.ai-card-grid.grid-3 {
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.ai-card-grid.grid-2 {
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
}

.ai-card {
    background: white;
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 8px;
    padding: 35px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.02);
    transition: all 0.3s ease;
}

.ai-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(124, 58, 237, 0.05);
    border-color: rgba(124, 58, 237, 0.15);
}

.ai-card-icon {
    width: 50px;
    height: 50px;
    border-radius: 8px;
    background: rgba(124, 58, 237, 0.04);
    color: var(--ai-purple);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    margin-bottom: 20px;
}

.ai-card-title {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 12px;
}

.ai-card-desc {
    font-size: 0.90625rem;
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 0;
}

/* Teaser Card specific overrides */
.teaser-card {
    cursor: pointer;
}

.teaser-card-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.84375rem;
    font-weight: 700;
    color: var(--text-secondary);
    text-decoration: none;
    margin-top: 20px;
    transition: all 0.2s ease;
}

.teaser-card:hover .teaser-card-link {
    color: var(--ai-purple);
    transform: translateX(4px);
}

/* Audience Tab Switching Styles */
.audience-tabs-container {
    margin-top: 40px;
}

.audience-tabs {
    display: flex;
    justify-content: center;
    gap: 10px;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 15px;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

.audience-tab-btn {
    background: none;
    border: 1px solid var(--border-color);
    padding: 10px 20px;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all 0.2s ease;
}

.audience-tab-btn:hover {
    color: var(--ai-purple);
    border-color: var(--ai-purple);
}

.audience-tab-btn.active {
    background: var(--ai-purple);
    color: white;
    border-color: var(--ai-purple);
}

.audience-tab-pane {
    display: none;
    animation: fadeIn 0.3s ease;
}

.audience-tab-pane.active {
    display: block;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Success Card details */
.success-card {
    border-left: 4px solid var(--ai-purple);
}

.success-tag {
    font-size: 0.6875rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 4px;
    text-transform: uppercase;
}

.success-title {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 10px;
    color: var(--text-primary);
}

.success-desc {
    font-size: 0.875rem;
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 20px;
}

.success-metrics {
    display: flex;
    gap: 30px;
    border-top: 1px solid var(--border-color);
    padding-top: 15px;
}

.metric-item {
    display: flex;
    flex-direction: column;
}

.metric-val {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--ai-purple);
    font-family: var(--font-heading);
}

.metric-lbl {
    font-size: 0.71875rem;
    color: var(--text-tertiary);
    font-weight: 600;
}

/* Accordion FAQs */
.faq-item {
    border: 1px solid var(--border-color);
    border-radius: 8px;
    margin-bottom: 15px;
    background: white;
    overflow: hidden;
    transition: all 0.2s ease;
}

.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 22px 28px;
    cursor: pointer;
    font-weight: 700;
    font-size: 0.96875rem;
    color: var(--text-primary);
}

.faq-icon {
    font-size: 0.875rem;
    color: var(--text-tertiary);
    transition: transform 0.3s ease;
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
}

.faq-answer p {
    padding: 0 28px 24px;
    margin: 0;
    font-size: 0.90625rem;
    color: var(--text-secondary);
    line-height: 1.6;
}

/* Bottom CTA section overlay */
.ai-bottom-cta {
    position: relative;
    padding: 100px 0;
    background: linear-gradient(135deg, #4c1d95 0%, #7c3aed 100%);
    text-align: center;
    border-radius: 0;
    overflow: hidden;
}

.ai-bottom-cta::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: radial-gradient(circle at 70% 30%, rgba(255,255,255,0.08) 0%, transparent 60%);
    pointer-events: none;
    z-index: 1;
}

.ai-bottom-cta-dark {
    background: linear-gradient(135deg, #1c1917 0%, #0c0a09 100%);
    color: white;
    padding: 80px 0;
}

.ai-bottom-cta-dark .btn-primary {
    background: white !important;
    border-color: white !important;
    color: #1c1917 !important;
}

.ai-bottom-cta-dark .btn-primary:hover {
    background: #f8fafc !important;
    border-color: #f8fafc !important;
    color: #0c0a09 !important;
}

/* Modal form designs */
.ai-modal {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(15, 23, 42, 0.7);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    z-index: 9999;
    align-items: center;
    justify-content: center;
}

.ai-modal-content {
    background: white;
    border-radius: 12px;
    padding: 45px;
    width: 100%;
    max-width: 580px;
    box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
    position: relative;
    animation: modalSlideUp 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.ai-modal-close {
    position: absolute;
    top: 20px;
    right: 25px;
    font-size: 1.75rem;
    font-weight: 300;
    color: var(--text-tertiary);
    cursor: pointer;
    transition: color 0.2s ease;
}

.ai-modal-close:hover {
    color: var(--text-primary);
}

.ai-modal-header {
    margin-bottom: 25px;
}

.ai-modal-header h3 {
    font-size: 1.375rem;
    font-weight: 800;
    color: var(--text-primary);
    margin-bottom: 6px;
}

.ai-modal-header p {
    font-size: 0.84375rem;
    color: var(--text-secondary);
    margin: 0;
    line-height: 1.4;
}

@keyframes modalSlideUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Media Responsive Overrides */
@media (max-width: 768px) {
    .ai-subnav-list {
        display: none;
        flex-direction: column;
        width: 100%;
        position: absolute;
        top: 100%;
        left: 0;
        background: white;
        border-bottom: 1px solid var(--border-color);
        padding: 15px 20px;
        box-shadow: 0 10px 15px rgba(0,0,0,0.05);
        gap: 15px;
        align-items: flex-start;
    }
    
    .ai-subnav-list.show {
        display: flex;
    }
    
    .ai-subnav-toggle {
        display: block;
    }
    
    .ai-hero-grid {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 40px;
    }
    
    .ai-hero-content {
        text-align: center;
    }
    
    .ai-hero-ctas {
        justify-content: center;
    }
    
    .hero-bullet-list {
        justify-content: center;
    }
}



/* ==========================================================================
   Manufacturing Industry Microsite Custom Styles
   ========================================================================== */

:root {
    --mfg-orange: #f97316;
    --mfg-orange-hover: #ea580c;
    --mfg-orange-light: #fff7ed;
    --mfg-orange-border: #fed7aa;
    --mfg-dark-industrial: #1c1917;
    --mfg-audience-blue: #075985;
    --mfg-audience-blue-hover: #0c4a6e;
    --mfg-audience-blue-light: #e0f2fe;
    --mfg-value-green: #15803d;
    --mfg-value-green-light: #dcfce7;
}

/* Base resets & typography for manufacturing microsite */
.manufacturing-microsite p,
.manufacturing-microsite .card-desc,
.manufacturing-microsite .outcome-text,
.manufacturing-microsite .layer-desc,
.manufacturing-microsite .aud-text,
.manufacturing-microsite .faq-accordion-panel p,
.manufacturing-microsite .cta-subtitle {
    font-family: var(--font-body) !important;
    font-weight: 300 !important;
}

/* Sticky Subnav Bar Styles */
.manufacturing-subnav-container {
    position: sticky;
    top: 70px;
    z-index: 100;
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--border-color);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    padding: 10px 0;
    transition: all 0.3s ease;
}

.manufacturing-subnav-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.manufacturing-subnav-brand {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--mfg-dark-industrial);
    display: flex;
    align-items: center;
    gap: 8px;
}

.manufacturing-subnav-brand i {
    color: var(--mfg-orange);
}

.manufacturing-subnav-toggle {
    display: none;
    background: none;
    border: 1px solid var(--border-color);
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 0.875rem;
    color: var(--text-secondary);
    cursor: pointer;
}

.manufacturing-subnav-list {
    display: flex;
    list-style: none;
    align-items: center;
    gap: 15px;
    margin: 0;
    padding: 0;
}

.manufacturing-subnav-link {
    font-size: 0.84375rem;
    font-weight: 500;
    color: var(--text-secondary);
    text-decoration: none;
    padding: 6px 10px;
    border-radius: 4px;
    transition: all 0.2s ease;
    white-space: nowrap !important;
}

.manufacturing-subnav-link:hover {
    color: var(--mfg-orange);
    background-color: var(--mfg-orange-light);
}

.manufacturing-subnav-link.active {
    color: var(--mfg-orange);
    background-color: var(--mfg-orange-light);
    font-weight: 600;
}

.btn-subnav-cta {
    padding: 6px 14px !important;
    font-size: 0.8125rem !important;
    background-color: var(--mfg-orange) !important;
    border-color: var(--mfg-orange) !important;
    color: white !important;
    white-space: nowrap !important;
}

.btn-subnav-cta:hover {
    background-color: var(--mfg-orange-hover) !important;
    border-color: var(--mfg-orange-hover) !important;
}

/* Manufacturing Subnav Dropdowns */
.manufacturing-subnav-list li {
    position: relative;
}

.manufacturing-subnav-dropdown {
    position: relative;
}

.manufacturing-subnav-dropdown .dropdown-caret {
    font-size: 0.625rem;
    margin-left: 4px;
    transition: transform 0.3s ease;
}

/* Dropdown Menu (Desktop) */
@media (min-width: 992px) {
    .manufacturing-dropdown-menu {
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%) translateY(10px);
        background-color: #ffffff;
        min-width: 260px;
        box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
        border: 1px solid rgba(0, 0, 0, 0.08);
        border-radius: 8px;
        padding: 8px 0;
        margin: 0;
        list-style: none;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        z-index: 110;
    }

    .manufacturing-subnav-dropdown:hover .manufacturing-dropdown-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateX(-50%) translateY(5px);
    }
    
    .manufacturing-subnav-dropdown:hover .dropdown-caret {
        transform: rotate(180deg);
    }

    .manufacturing-dropdown-menu li {
        width: 100%;
    }

    .manufacturing-dropdown-menu a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 20px;
        font-size: 0.84375rem;
        font-weight: 500;
        color: var(--text-secondary) !important;
        text-decoration: none;
        transition: all 0.2s ease;
        border-left: 3px solid transparent;
        white-space: nowrap !important;
        background: transparent !important;
    }

    .manufacturing-dropdown-menu a i {
        font-size: 0.875rem;
        color: var(--mfg-orange);
        opacity: 0.8;
        width: 16px;
        text-align: center;
    }

    .manufacturing-dropdown-menu a:hover {
        color: var(--mfg-orange-hover) !important;
        background-color: var(--mfg-orange-light) !important;
        border-left-color: var(--mfg-orange);
    }

    .manufacturing-dropdown-menu a.active {
        color: var(--mfg-orange-hover) !important;
        background-color: var(--mfg-orange-light) !important;
        border-left-color: var(--mfg-orange);
        font-weight: 600;
    }
}

/* Mobile Dropdown Styling */
@media (max-width: 991px) {
    .manufacturing-dropdown-menu {
        display: none;
        list-style: none;
        padding: 5px 0 5px 15px;
        margin: 5px 0;
        border-left: 1px solid var(--border-color);
    }
    
    .manufacturing-subnav-dropdown.open .manufacturing-dropdown-menu {
        display: block;
    }
    
    .manufacturing-subnav-dropdown.open .dropdown-caret {
        transform: rotate(180deg);
    }
    
    .manufacturing-dropdown-menu a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 8px 10px;
        font-size: 0.8125rem;
        color: var(--text-secondary) !important;
        text-decoration: none;
        border-radius: 4px;
        white-space: nowrap !important;
        background: transparent !important;
    }
    
    .manufacturing-dropdown-menu a i {
        color: var(--mfg-orange);
    }
    
    .manufacturing-dropdown-menu a.active {
        color: var(--mfg-orange-hover) !important;
        background-color: var(--mfg-orange-light) !important;
        font-weight: 600;
    }
}

/* Manufacturing Hero Styles */
.manufacturing-hero {
    position: relative;
    padding: 80px 0;
    background: linear-gradient(180deg, #fafafa 0%, #ffffff 100%);
    overflow: hidden;
    border-bottom: 1px solid var(--border-color);
}

.manufacturing-hero-glow {
    position: absolute;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(249, 115, 22, 0.05) 0%, rgba(255, 255, 255, 0) 70%);
    top: -200px;
    right: -100px;
    z-index: 1;
    pointer-events: none;
}

.manufacturing-hero-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 50px;
    align-items: center;
    position: relative;
    z-index: 2;
}

.manufacturing-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background-color: var(--mfg-orange-light);
    color: var(--mfg-orange-hover);
    border: 1px solid var(--mfg-orange-border);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 20px;
}

.manufacturing-hero-title {
    font-size: 2.625rem;
    font-weight: 800;
    line-height: 1.2;
    color: var(--text-primary);
    margin-bottom: 20px;
}

.manufacturing-hero-subtitle {
    font-size: 1.125rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin-bottom: 30px;
}

.manufacturing-hero-ctas {
    display: flex;
    gap: 15px;
    margin-bottom: 35px;
}

.manufacturing-hero-ctas .btn-primary {
    background-color: var(--mfg-orange) !important;
    border-color: var(--mfg-orange) !important;
}

.manufacturing-hero-ctas .btn-primary:hover {
    background-color: var(--mfg-orange-hover) !important;
    border-color: var(--mfg-orange-hover) !important;
}

.manufacturing-hero-bullets h4 {
    font-size: 0.90625rem;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--text-primary);
}

.hero-bullet-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 10px;
}

.hero-bullet-list li {
    font-size: 0.90625rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 8px;
}

.hero-bullet-list li i {
    color: #10b981;
}

/* Connected Factory Visual */
.manufacturing-vis-container {
    position: relative;
    width: 100%;
    height: 350px;
    background: #fafafa;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
}

.tech-grid-bg {
    position: absolute;
    inset: 0;
    background-size: 20px 20px;
    background-image: linear-gradient(to right, #f3f4f6 1px, transparent 1px), linear-gradient(to bottom, #f3f4f6 1px, transparent 1px);
    opacity: 0.5;
}

.tech-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90px;
    height: 90px;
    background: white;
    border: 2px solid var(--mfg-orange);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    box-shadow: 0 0 20px rgba(249, 115, 22, 0.15);
    z-index: 10;
}

.text-orange {
    color: var(--mfg-orange);
}

.tech-ring {
    position: absolute;
    border: 1px dashed var(--mfg-orange-border);
    border-radius: 50%;
}

.ring-1 {
    width: 180px;
    height: 180px;
    animation: spin 30s linear infinite;
}

.ring-2 {
    width: 270px;
    height: 270px;
    animation: spin-reverse 45s linear infinite;
}

.tech-node {
    position: absolute;
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 30px;
    padding: 6px 15px;
    font-size: 0.75rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    z-index: 5;
}

.tech-node i {
    color: var(--mfg-orange);
}

.tech-node-1 { top: 25%; left: 15%; }
.tech-node-2 { top: 20%; right: 15%; }
.tech-node-3 { bottom: 25%; left: 18%; }
.tech-node-4 { bottom: 22%; right: 15%; }

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes spin-reverse {
    from { transform: rotate(360deg); }
    to { transform: rotate(0deg); }
}

/* Sections & Cards styling */
.manufacturing-section {
    padding: 60px 0;
}

.manufacturing-section.section-alt {
    background-color: #fafafa;
}

.manufacturing-section-header {
    max-width: 700px;
    margin: 0 auto 50px;
}

.manufacturing-section-header.text-center {
    text-align: center;
}

.manufacturing-subtitle {
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--mfg-orange);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    display: block;
    margin-bottom: 10px;
}

.manufacturing-title {
    font-size: 2rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1.3;
    margin-bottom: 15px;
}

.manufacturing-desc {
    font-size: 1rem;
    line-height: 1.6;
    color: var(--text-secondary);
}

.manufacturing-card-grid {
    display: grid;
    gap: 30px;
}

.grid-2 { grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); }
.grid-3 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.grid-4 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }

.manufacturing-card {
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 30px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02);
    transition: all 0.25s ease;
}

.challenge-card {
    border-top: 3px solid #ef4444;
}

.challenge-card .card-icon-circle {
    background: #fef2f2;
    color: #ef4444;
}

.card-icon-circle {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #f3f4f6;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.125rem;
    margin-bottom: 20px;
}

.accent-orange {
    background-color: var(--mfg-orange-light);
    color: var(--mfg-orange);
}

.manufacturing-card .card-title {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 10px;
    color: var(--text-primary);
}

.manufacturing-card .card-desc {
    font-size: 0.90625rem;
    line-height: 1.6;
    color: var(--text-secondary);
}

.hover-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
    border-color: var(--mfg-orange-border);
}

.hover-card .card-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.84375rem;
    font-weight: 600;
    color: var(--mfg-orange);
    text-decoration: none;
    margin-top: 15px;
    transition: gap 0.2s;
}

.hover-card .card-link:hover {
    gap: 10px;
}

/* Framework Layers List styling */
.framework-layers-container {
    max-width: 900px;
    margin: 0 auto;
    display: grid;
    gap: 20px;
}

.framework-layer-item {
    display: flex;
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02);
}

.layer-number {
    width: 60px;
    background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 800;
    flex-shrink: 0;
}

.layer-content {
    padding: 20px 25px;
}

.layer-title {
    font-size: 1.0625rem;
    font-weight: 700;
    margin-bottom: 6px;
    color: var(--text-primary);
}

.layer-desc {
    font-size: 0.90625rem;
    line-height: 1.5;
    color: var(--text-secondary);
    margin: 0;
}

/* Audience Tabs styling */
.audience-tabs-container {
    max-width: 1000px;
    margin: 0 auto;
}

.audience-tabs-nav {
    display: flex;
    justify-content: center;
    border-bottom: 2px solid var(--border-color);
    margin-bottom: 30px;
    gap: 10px;
    overflow-x: auto;
}

.audience-tab-btn {
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    padding: 12px 20px;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s;
}

.audience-tab-btn:hover {
    color: var(--mfg-orange);
}

.audience-tab-btn.active {
    color: var(--mfg-orange);
    border-bottom-color: var(--mfg-orange);
}

/* Keep manufacturing audience tabs isolated from shared purple/industry tab rules. */
.manufacturing-microsite .audience-tabs-nav .audience-tab-btn {
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    color: #334155;
}

.manufacturing-microsite .audience-tabs-nav .audience-tab-btn:hover {
    background: var(--mfg-audience-blue-light);
    border-bottom-color: #7dd3fc;
    color: var(--mfg-audience-blue-hover);
}

.manufacturing-microsite .audience-tabs-nav .audience-tab-btn.active {
    background: var(--mfg-audience-blue-light);
    border-bottom-color: var(--mfg-audience-blue);
    color: var(--mfg-audience-blue-hover);
}

.manufacturing-microsite .aud-block-title {
    color: var(--mfg-audience-blue-hover);
}

.manufacturing-microsite .audience-impact-icon {
    color: var(--mfg-audience-blue);
    font-size: 1rem;
}

.manufacturing-microsite .business-value-icon {
    width: 48px;
    height: 48px;
    margin-bottom: 15px;
    border-radius: 10px;
    background: var(--mfg-value-green-light);
    color: var(--mfg-value-green);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3125rem;
}

.audience-tab-pane {
    display: none;
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
}

.audience-tab-pane.active {
    display: block;
    animation: fadeIn 0.3s ease-out;
}

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

.aud-block-title {
    font-size: 0.9375rem;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
}

.aud-text {
    font-size: 0.90625rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin: 0;
}

/* Bottom CTA section styling */
.manufacturing-bottom-cta {
    background: linear-gradient(135deg, #1c1917 0%, #0c0a09 100%);
    color: white;
    padding: 80px 0;
    position: relative;
    overflow: hidden;
}

.manufacturing-bottom-cta .cta-title {
    font-size: 2.125rem;
    font-weight: 800;
    margin-bottom: 15px;
    color: white;
}

.manufacturing-bottom-cta .cta-subtitle {
    font-size: 1.0625rem;
    max-width: 700px;
    margin: 0 auto 35px;
    color: #d6d3d1;
}

.manufacturing-bottom-cta .btn-primary {
    background-color: var(--mfg-orange) !important;
    border-color: var(--mfg-orange) !important;
    color: white !important;
}

.manufacturing-bottom-cta .btn-primary:hover {
    background-color: var(--mfg-orange-hover) !important;
    border-color: var(--mfg-orange-hover) !important;
}

/* Lead Modal styling */
.manufacturing-modal {
    display: none;
    position: fixed;
    z-index: 2000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    align-items: center;
    justify-content: center;
    padding: 16px;
    animation: fadeIn 0.25s ease-out;
}

.manufacturing-modal-content {
    background-color: white;
    border-radius: 12px;
    width: 100%;
    max-width: 760px;
    padding: 28px 32px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
    position: relative;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.manufacturing-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 44px;
    height: 44px;
    border: 1px solid #cbd5e1;
    border-radius: 50%;
    background: #f8fafc;
    color: #334155;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.375rem;
    cursor: pointer;
    z-index: 2;
    transition: color 0.2s, background-color 0.2s, border-color 0.2s, transform 0.2s;
}

.manufacturing-modal-close:hover,
.manufacturing-modal-close:focus-visible {
    color: white;
    background: var(--mfg-orange-hover);
    border-color: var(--mfg-orange-hover);
    outline: none;
    transform: scale(1.05);
}

.manufacturing-modal-header {
    margin-bottom: 18px;
    padding-right: 52px;
    flex-shrink: 0;
}

.manufacturing-modal-header h3 {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--mfg-dark-industrial);
    margin-bottom: 8px;
}

.manufacturing-modal-header p {
    font-size: 0.90625rem;
    color: var(--text-secondary);
    margin: 0;
}

#manufacturing-lead-form {
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 5px;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
}

#manufacturing-lead-form::-webkit-scrollbar {
    width: 6px;
}

#manufacturing-lead-form::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 999px;
}

#manufacturing-lead-form::-webkit-scrollbar-track {
    background: transparent;
}

/* Form layouts */
.manufacturing-modal .form-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 0;
}

.manufacturing-modal .form-field {
    margin-bottom: 12px;
}

.form-field label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-primary);
    display: block;
    margin-bottom: 6px;
}

.form-input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    font-size: 0.875rem;
    outline: none;
    transition: border-color 0.2s;
}

.form-input:focus {
    border-color: var(--mfg-orange);
}

.required-star {
    color: #dc2626;
}

.form-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 18px;
}

.form-checkbox input {
    margin-top: 3px;
}

.manufacturing-modal .form-checkbox {
    width: 100%;
    height: auto;
    margin: 2px 0 0;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
}

.manufacturing-modal .form-checkbox input {
    width: 18px;
    height: 18px;
    margin: 1px 0 0;
    accent-color: var(--mfg-orange);
}

.manufacturing-modal .form-checkbox label {
    width: auto;
    margin: 0;
    color: var(--text-secondary);
    font-size: 0.78125rem;
    line-height: 1.45;
    cursor: pointer;
}

.manufacturing-modal textarea.form-input {
    height: 64px;
    min-height: 64px;
    resize: vertical;
}

.manufacturing-form-submit {
    width: 100%;
    margin-top: 12px;
}

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Responsive Overrides */
@media (max-width: 991px) {
    .manufacturing-hero-grid {
        grid-template-columns: 1fr;
        gap: 30px;
        text-align: center;
    }
    .manufacturing-hero-ctas {
        justify-content: center;
    }
    .hero-bullet-list {
        justify-content: center;
    }
    .hero-bullet-list li {
        justify-content: center;
    }
    .manufacturing-subnav-toggle {
        display: block;
    }
    .manufacturing-subnav-list {
        display: none;
        flex-direction: column;
        width: 100%;
        margin-top: 15px;
        border-top: 1px solid var(--border-color);
        padding-top: 15px;
        gap: 10px;
    }
    .manufacturing-subnav-list.show {
        display: flex;
    }
    .manufacturing-subnav-list li {
        width: 100%;
        text-align: left;
    }
    .manufacturing-subnav-link {
        display: block;
        padding: 10px;
        width: 100%;
    }
    .cta-item {
        width: 100%;
        margin-top: 10px;
    }
    .btn-subnav-cta {
        width: 100%;
        text-align: center;
    }
}
@media (max-width: 768px) {
    .manufacturing-hero-title {
        font-size: 2rem;
    }
    .grid-2, .grid-3, .grid-4 {
        grid-template-columns: 1fr;
    }
    .manufacturing-modal-content {
        padding: 24px 20px 20px;
    }
    .manufacturing-modal .form-grid-2 {
        grid-template-columns: 1fr;
        gap: 0;
    }
    .manufacturing-modal-close {
        top: 10px;
        right: 10px;
    }
    .manufacturing-modal-header {
        padding-right: 46px;
    }
}

/* ==========================================================================
   ThinkArtha BFSI Industry Microsite CSS
   ========================================================================== */
:root {
    --bfsi-blue: var(--artha-primary-600);
    --bfsi-blue-light: #eff6ff;
    --bfsi-blue-dark: #1e40af;
    --bfsi-border-color: #bfdbfe;
}

/* Base resets & typography for BFSI microsite */
.bfsi-microsite p,
.bfsi-microsite .card-desc,
.bfsi-microsite .outcome-text,
.bfsi-microsite .layer-desc,
.bfsi-microsite .aud-text,
.bfsi-microsite .faq-accordion-panel p,
.bfsi-microsite .cta-subtitle {
    font-family: var(--font-body);
    font-weight: 300;
}

.bfsi-subnav-container {
    position: sticky;
    top: 70px;
    z-index: 99;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--border-color);
    padding: 12px 0;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05);
}

.bfsi-subnav-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.bfsi-subnav-brand {
    font-weight: 700;
    font-size: 1rem;
    color: var(--bfsi-blue);
    display: flex;
    align-items: center;
    gap: 8px;
}

.bfsi-subnav-toggle {
    display: none;
    background: none;
    border: 1px solid var(--border-color);
    color: var(--text-secondary);
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 0.84375rem;
    cursor: pointer;
}

.bfsi-subnav-list {
    display: flex;
    list-style: none;
    gap: 15px;
    align-items: center;
    margin: 0;
    padding: 0;
}

.bfsi-subnav-link {
    font-size: 0.84375rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-decoration: none;
    padding: 6px 10px;
    border-radius: 4px;
    transition: all 0.2s;
    white-space: nowrap !important;
}

.bfsi-subnav-link:hover,
.bfsi-subnav-link.active {
    background: var(--bfsi-blue-light);
    color: var(--bfsi-blue-dark);
}

.btn-subnav-cta {
    font-size: 0.78125rem;
    padding: 8px 16px;
    background-color: var(--bfsi-blue);
    color: #fff;
    border-radius: 4px;
    text-decoration: none;
    white-space: nowrap !important;
}

.btn-subnav-cta:hover {
    background-color: var(--bfsi-blue-dark);
}

/* BFSI Subnav Dropdowns */
.bfsi-subnav-list li {
    position: relative;
}

.bfsi-subnav-dropdown {
    position: relative;
}

.bfsi-subnav-dropdown .dropdown-caret {
    font-size: 0.625rem;
    margin-left: 4px;
    transition: transform 0.3s ease;
}

/* Dropdown Menu (Desktop) */
@media (min-width: 992px) {
    .bfsi-dropdown-menu {
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%) translateY(10px);
        background-color: #ffffff;
        min-width: 260px;
        box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
        border: 1px solid rgba(0, 0, 0, 0.08);
        border-radius: 8px;
        padding: 8px 0;
        margin: 0;
        list-style: none;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        z-index: 110;
    }

    .bfsi-subnav-dropdown:hover .bfsi-dropdown-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateX(-50%) translateY(5px);
    }
    
    .bfsi-subnav-dropdown:hover .dropdown-caret {
        transform: rotate(180deg);
    }

    .bfsi-dropdown-menu li {
        width: 100%;
    }

    .bfsi-dropdown-menu a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 20px;
        font-size: 0.84375rem;
        font-weight: 500;
        color: var(--text-secondary) !important;
        text-decoration: none;
        transition: all 0.2s ease;
        border-left: 3px solid transparent;
        white-space: nowrap !important;
        background: transparent !important;
    }

    .bfsi-dropdown-menu a i {
        font-size: 0.875rem;
        color: var(--bfsi-blue);
        opacity: 0.8;
        width: 16px;
        text-align: center;
    }

    .bfsi-dropdown-menu a:hover {
        color: var(--bfsi-blue-dark) !important;
        background-color: var(--bfsi-blue-light) !important;
        border-left-color: var(--bfsi-blue);
    }

    .bfsi-dropdown-menu a.active {
        color: var(--bfsi-blue-dark) !important;
        background-color: var(--bfsi-blue-light) !important;
        border-left-color: var(--bfsi-blue);
        font-weight: 600;
    }
}

/* Mobile Dropdown Styling */
@media (max-width: 991px) {
    .bfsi-dropdown-menu {
        display: none;
        list-style: none;
        padding: 5px 0 5px 15px;
        margin: 5px 0;
        border-left: 1px solid var(--border-color);
    }
    
    .bfsi-subnav-dropdown.open .bfsi-dropdown-menu {
        display: block;
    }
    
    .bfsi-subnav-dropdown.open .dropdown-caret {
        transform: rotate(180deg);
    }
    
    .bfsi-dropdown-menu a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 8px 10px;
        font-size: 0.8125rem;
        color: var(--text-secondary) !important;
        text-decoration: none;
        border-radius: 4px;
        white-space: nowrap !important;
        background: transparent !important;
    }
    
    .bfsi-dropdown-menu a i {
        color: var(--bfsi-blue);
    }
    
    .bfsi-dropdown-menu a.active {
        color: var(--bfsi-blue-dark) !important;
        background-color: var(--bfsi-blue-light) !important;
        font-weight: 600;
    }
}

/* Hero Section */
.bfsi-hero {
    position: relative;
    padding: 80px 0;
    background: radial-gradient(circle at 10% 20%, rgba(239, 246, 255, 0.5) 0%, rgba(255, 255, 255, 1) 90%);
    overflow: hidden;
    border-bottom: 1px solid var(--border-color);
}

.bfsi-hero-glow {
    position: absolute;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(124, 58, 237, 0.05) 0%, rgba(255,255,255,0) 70%);
    top: -150px;
    right: -150px;
    z-index: 0;
}

.bfsi-hero-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 50px;
    align-items: center;
    position: relative;
    z-index: 1;
}

.bfsi-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--bfsi-blue-light);
    color: var(--bfsi-blue-dark);
    padding: 6px 14px;
    border-radius: 30px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 20px;
    border: 1px solid var(--bfsi-border-color);
}

.bfsi-hero-title {
    font-size: 2.75rem;
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1.15;
    color: var(--text-primary);
    margin-bottom: 20px;
}

.bfsi-hero-subtitle {
    font-size: 1.1875rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin-bottom: 30px;
}

.bfsi-hero-ctas {
    display: flex;
    align-items: center;
    margin-bottom: 40px;
}

.bfsi-hero-bullets {
    border-top: 1px solid #eff6ff;
    padding-top: 25px;
}

.bfsi-hero-bullets h4 {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--text-secondary);
    margin-bottom: 12px;
}

.hero-bullet-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.hero-bullet-list li {
    font-size: 0.875rem;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Visualization / Orbits styling */
.bfsi-hero-visual {
    display: flex;
    justify-content: center;
}

.bfsi-vis-container {
    position: relative;
    width: 320px;
    height: 320px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tech-grid-bg {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-image: radial-gradient(var(--bfsi-border-color) 1px, transparent 1px);
    background-size: 20px 20px;
    opacity: 0.3;
}

.tech-circle {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid var(--bfsi-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.8125rem;
    color: var(--bfsi-blue);
    box-shadow: 0 10px 25px -5px rgba(124, 58, 237, 0.1);
    position: relative;
    z-index: 2;
}

.tech-ring {
    position: absolute;
    border-radius: 50%;
    border: 1px dashed var(--bfsi-border-color);
}

.ring-1 {
    width: 220px;
    height: 220px;
    animation: spin 30s linear infinite;
}

.ring-2 {
    width: 300px;
    height: 300px;
    animation: spin-reverse 45s linear infinite;
}

.tech-node {
    position: absolute;
    background: #fff;
    border: 1px solid var(--bfsi-border-color);
    padding: 6px 12px;
    border-radius: 30px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05);
    z-index: 3;
}

.tech-node i {
    color: var(--bfsi-blue);
}

.tech-node-1 { top: -20px; left: 50%; transform: translateX(-50%); }
.tech-node-2 { bottom: -20px; left: 50%; transform: translateX(-50%); }
.tech-node-3 { top: 50%; left: -40px; transform: translateY(-50%); }
.tech-node-4 { top: 50%; right: -40px; transform: translateY(-50%); }

/* Section & Cards layout */
.bfsi-section {
    padding: 80px 0;
}

.bfsi-section.section-alt {
    background-color: #fafafa;
}

.bfsi-section-header {
    max-width: 750px;
    margin-bottom: 50px;
}

.bfsi-section-header.text-center {
    margin-left: auto;
    margin-right: auto;
}

.bfsi-subtitle {
    font-size: 0.78125rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--bfsi-blue);
    display: block;
    margin-bottom: 10px;
}

.bfsi-title {
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: -0.5px;
    color: var(--text-primary);
    line-height: 1.25;
    margin-bottom: 15px;
}

.bfsi-desc {
    font-size: 1.03125rem;
    line-height: 1.6;
    color: var(--text-secondary);
}

.bfsi-card-grid {
    display: grid;
    gap: 30px;
}

.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }

.bfsi-card {
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 30px;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.01);
    transition: all 0.25s ease;
}

.bfsi-card.challenge-card {
    border-top: 3px solid #ef4444;
}

.bfsi-card.challenge-card .card-icon-circle {
    background: #fef2f2;
    color: #ef4444;
}

.bfsi-card.hover-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px -5px rgba(124, 58, 237, 0.05);
    border-color: var(--bfsi-border-color);
}

.card-icon-circle {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    background: var(--bfsi-blue-light);
    color: var(--bfsi-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    margin-bottom: 20px;
}

.card-icon-circle.accent-blue {
    background-color: var(--bfsi-blue-light);
    color: var(--bfsi-blue);
}

.card-title {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 10px;
    color: var(--text-primary);
}

.card-desc {
    font-size: 0.90625rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin-bottom: 15px;
}

.card-link {
    font-size: 0.84375rem;
    font-weight: 600;
    color: var(--bfsi-blue);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: gap 0.2s;
}

.card-link:hover {
    gap: 10px;
    color: var(--bfsi-blue-dark);
}

/* Framework styling */
.framework-layers-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 800px;
    margin: 40px auto 0;
}

.framework-layer-item {
    display: flex;
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.01);
}

.layer-number {
    width: 80px;
    background: var(--bfsi-blue-light);
    color: var(--bfsi-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.375rem;
    font-weight: 800;
    border-right: 1px solid var(--bfsi-border-color);
}

.layer-content {
    padding: 24px;
    flex-grow: 1;
}

.layer-title {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 6px;
    color: var(--text-primary);
}

.layer-desc {
    font-size: 0.90625rem;
    line-height: 1.5;
    color: var(--text-secondary);
    margin: 0;
}

/* Audience tabs */
.audience-tabs-container {
    max-width: 900px;
    margin: 40px auto 0;
}

.audience-tabs-nav {
    display: flex;
    gap: 10px;
    border-bottom: 2px solid var(--border-color);
    margin-bottom: 30px;
    overflow-x: auto;
}

.audience-tab-btn {
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    padding: 12px 20px;
    font-size: 0.90625rem;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s;
}

.audience-tab-btn.active {
    color: var(--bfsi-blue);
    border-bottom-color: var(--bfsi-blue);
}

.audience-tabs-content {
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 30px;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.01);
}

.audience-tab-pane {
    display: none;
}

.audience-tab-pane.active {
    display: block;
}

.audience-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.audience-col {
    display: flex;
    flex-direction: column;
}

.aud-block-title {
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-secondary);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.aud-text {
    font-size: 0.90625rem;
    line-height: 1.6;
    color: var(--text-primary);
    margin: 0;
}

/* Bottom CTA styling */
.bfsi-bottom-cta {
    background: linear-gradient(135deg, var(--bfsi-blue) 0%, var(--bfsi-blue-dark) 100%);
    color: #fff;
    padding: 80px 0;
    position: relative;
    overflow: hidden;
}

.bfsi-bottom-cta::after {
    content: '';
    position: absolute;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0) 70%);
    bottom: -150px;
    left: -150px;
}

.bfsi-bottom-cta .cta-title {
    font-size: 2.125rem;
    font-weight: 800;
    color: #fff;
    margin-bottom: 15px;
}

.bfsi-bottom-cta .cta-subtitle {
    font-size: 1.09375rem;
    color: rgba(255,255,255,0.85);
    max-width: 700px;
    margin: 0 auto 35px;
}

.bfsi-bottom-cta .cta-actions {
    display: flex;
    justify-content: center;
    gap: 15px;
}

/* Modal Lead form */
.bfsi-modal {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(15, 23, 42, 0.6);
    z-index: 9999;
    align-items: center;
    justify-content: center;
    animation: fadeIn 0.25s ease-out;
}

.bfsi-modal-content {
    background: #fff;
    width: 100%;
    max-width: 580px;
    border-radius: 12px;
    padding: 35px;
    position: relative;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.bfsi-modal-close {
    position: absolute;
    top: 20px;
    right: 25px;
    font-size: 1.75rem;
    font-weight: 300;
    color: #9ca3af;
    cursor: pointer;
    transition: color 0.2s;
}

.bfsi-modal-close:hover {
    color: var(--text-primary);
}

.bfsi-modal-header {
    margin-bottom: 25px;
}

.bfsi-modal-header h3 {
    font-size: 1.375rem;
    font-weight: 800;
    color: var(--bfsi-blue-dark);
    margin-bottom: 8px;
}

.bfsi-modal-header p {
    font-size: 0.875rem;
    color: var(--text-secondary);
    margin: 0;
    line-height: 1.5;
}

/* Animations */
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes spin-reverse {
    from { transform: rotate(360deg); }
    to { transform: rotate(0deg); }
}

/* Responsive Overrides */
@media (max-width: 991px) {
    .bfsi-hero-grid {
        grid-template-columns: 1fr;
        gap: 30px;
        text-align: center;
    }
    .bfsi-hero-ctas {
        justify-content: center;
    }
    .hero-bullet-list {
        justify-content: center;
    }
    .hero-bullet-list li {
        justify-content: center;
    }
    .bfsi-subnav-toggle {
        display: block;
    }
    .bfsi-subnav-list {
        display: none;
        flex-direction: column;
        width: 100%;
        margin-top: 15px;
        border-top: 1px solid var(--border-color);
        padding-top: 15px;
        gap: 10px;
    }
    .bfsi-subnav-list.show {
        display: flex;
    }
    .bfsi-subnav-list li {
        width: 100%;
        text-align: left;
    }
    .bfsi-subnav-link {
        display: block;
        padding: 10px;
        width: 100%;
    }
    .bfsi-bottom-cta .cta-actions {
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }
    .bfsi-bottom-cta .cta-actions button {
        width: 100%;
        max-width: 320px;
    }
    .bfsi-bottom-cta .cta-actions .btn-outline {
        margin-left: 0 !important;
    }
}
@media (max-width: 768px) {
    .bfsi-hero-title {
        font-size: 2rem;
    }
    .bfsi-card-grid {
        grid-template-columns: 1fr !important;
    }
    .framework-layer-item {
        flex-direction: column;
    }
    .layer-number {
        width: 100%;
        height: 50px;
        border-right: none;
        border-bottom: 1px solid var(--bfsi-border-color);
    }
    .audience-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .bfsi-modal-content {
        padding: 25px;
    }
    .form-grid-2 {
        grid-template-columns: 1fr;
        gap: 0;
    }
}


/* ==========================================================================
   ThinkArtha Retail Industry Microsite CSS
   ========================================================================== */

:root {
    --retail-color: #0ea5e9;
    --retail-light: #f0f9ff;
    --retail-dark: #0369a1;
    --retail-border: #bae6fd;
    --retail-accent: #0f172a;
}

.retail-microsite p,
.retail-microsite .card-desc,
.retail-microsite .outcome-text,
.retail-microsite .layer-desc,
.retail-microsite .aud-text,
.retail-microsite .faq-accordion-panel p,
.retail-microsite .cta-subtitle {
    font-family: var(--font-body) !important;
    font-weight: 300 !important;
}

/* Sticky Subnav Bar Styles */
.retail-subnav-container {
    position: sticky;
    top: 70px;
    z-index: 100;
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--border-color);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    padding: 10px 0;
    transition: all 0.3s ease;
}

.retail-subnav-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.retail-subnav-brand {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--retail-accent);
    display: flex;
    align-items: center;
    gap: 8px;
}

.retail-subnav-brand i {
    color: var(--retail-color);
}

.retail-subnav-toggle {
    display: none;
    background: none;
    border: 1px solid var(--border-color);
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 0.875rem;
    color: var(--text-secondary);
    cursor: pointer;
}

.retail-subnav-list {
    display: flex;
    list-style: none;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 0;
}

.retail-subnav-link {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--text-secondary);
    text-decoration: none;
    padding: 6px 8px;
    border-radius: 4px;
    transition: all 0.2s ease;
    white-space: nowrap !important;
}

.retail-subnav-link:hover {
    color: var(--retail-color);
    background-color: var(--retail-light);
}

.retail-subnav-link.active {
    color: var(--retail-dark);
    background-color: var(--retail-light);
    font-weight: 600;
}

.btn-subnav-cta-retail {
    padding: 6px 14px !important;
    font-size: 0.8125rem !important;
    background-color: var(--retail-color) !important;
    border-color: var(--retail-color) !important;
    color: white !important;
    white-space: nowrap !important;
}

.btn-subnav-cta-retail:hover {
    background-color: var(--retail-dark) !important;
    border-color: var(--retail-dark) !important;
}

/* Subnav Dropdowns */
.retail-subnav-list li {
    position: relative;
}

.retail-subnav-dropdown {
    position: relative;
}

.retail-subnav-dropdown .dropdown-caret {
    font-size: 0.625rem;
    margin-left: 4px;
    transition: transform 0.3s ease;
}

/* Dropdown Menu (Desktop) */
@media (min-width: 992px) {
    .retail-dropdown-menu {
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%) translateY(10px);
        background-color: #ffffff;
        min-width: 280px;
        box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
        border: 1px solid rgba(0, 0, 0, 0.08);
        border-radius: 8px;
        padding: 8px 0;
        margin: 0;
        list-style: none;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
        z-index: 110;
    }

    .retail-subnav-dropdown:hover .retail-dropdown-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateX(-50%) translateY(5px);
    }
    
    .retail-subnav-dropdown:hover .dropdown-caret {
        transform: rotate(180deg);
    }

    .retail-dropdown-menu li {
        width: 100%;
    }

    .retail-dropdown-menu a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 20px;
        font-size: 0.84375rem;
        font-weight: 500;
        color: var(--text-secondary) !important;
        text-decoration: none;
        transition: all 0.2s ease;
        border-left: 3px solid transparent;
        white-space: nowrap !important;
        background: transparent !important;
    }

    .retail-dropdown-menu a i {
        font-size: 0.875rem;
        color: var(--retail-color);
        opacity: 0.8;
        width: 16px;
        text-align: center;
    }

    .retail-dropdown-menu a:hover {
        color: var(--retail-dark) !important;
        background-color: var(--retail-light) !important;
        border-left-color: var(--retail-color);
    }

    .retail-dropdown-menu a.active {
        color: var(--retail-dark) !important;
        background-color: var(--retail-light) !important;
        border-left-color: var(--retail-color);
        font-weight: 600;
    }
}

/* Mobile Dropdown Styling */
@media (max-width: 991px) {
    .retail-dropdown-menu {
        display: none;
        list-style: none;
        padding: 5px 0 5px 15px;
        margin: 5px 0;
        border-left: 1px solid var(--border-color);
    }
    
    .retail-subnav-dropdown.open .retail-dropdown-menu {
        display: block;
    }
    
    .retail-subnav-dropdown.open .dropdown-caret {
        transform: rotate(180deg);
    }
    
    .retail-dropdown-menu a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 8px 10px;
        font-size: 0.8125rem;
        color: var(--text-secondary) !important;
        text-decoration: none;
        border-radius: 4px;
        white-space: nowrap !important;
        background: transparent !important;
    }
    
    .retail-dropdown-menu a i {
        color: var(--retail-color);
    }
    
    .retail-dropdown-menu a.active {
        color: var(--retail-dark) !important;
        background-color: var(--retail-light) !important;
        font-weight: 600;
    }
}

/* Retail Hero Styles */
.retail-hero {
    position: relative;
    padding: 80px 0;
    background: linear-gradient(180deg, #fafafa 0%, #ffffff 100%);
    overflow: hidden;
    border-bottom: 1px solid var(--border-color);
}

.retail-hero-glow {
    position: absolute;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(14, 165, 233, 0.05) 0%, rgba(255, 255, 255, 0) 70%);
    top: -200px;
    right: -100px;
    z-index: 1;
    pointer-events: none;
}

.retail-hero-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 50px;
    align-items: center;
    position: relative;
    z-index: 2;
}

.retail-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background-color: var(--retail-light);
    color: var(--retail-dark);
    border: 1px solid var(--retail-border);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 20px;
}

.retail-hero-title {
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1.2;
    color: var(--text-primary);
    margin-bottom: 20px;
}

.retail-hero-subtitle {
    font-size: 1.0625rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin-bottom: 30px;
}

.retail-hero-ctas {
    display: flex;
    gap: 15px;
    margin-bottom: 35px;
    flex-wrap: wrap;
}

.retail-hero-ctas .btn-primary {
    background-color: var(--retail-color) !important;
    border-color: var(--retail-color) !important;
}

.retail-hero-ctas .btn-primary:hover {
    background-color: var(--retail-dark) !important;
    border-color: var(--retail-dark) !important;
}

.retail-hero-bullets h4 {
    font-size: 0.90625rem;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--text-primary);
}

.hero-bullet-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 10px;
}

.hero-bullet-list li {
    font-size: 0.90625rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 8px;
}

.hero-bullet-list li i {
    color: #10b981;
}

/* Retail Journey flow animation visual */
.retail-vis-container {
    position: relative;
    width: 100%;
    height: 350px;
    background: #fafafa;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
}

.tech-grid-bg {
    position: absolute;
    inset: 0;
    background-size: 20px 20px;
    background-image: linear-gradient(to right, #f3f4f6 1px, transparent 1px), linear-gradient(to bottom, #f3f4f6 1px, transparent 1px);
    opacity: 0.5;
}

.tech-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90px;
    height: 90px;
    background: white;
    border: 2px solid var(--retail-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    box-shadow: 0 0 20px rgba(14, 165, 233, 0.15);
    z-index: 10;
}

.text-retail {
    color: var(--retail-color);
}

.tech-ring {
    position: absolute;
    border: 1px dashed var(--retail-border);
    border-radius: 50%;
}

.ring-1 {
    width: 180px;
    height: 180px;
    animation: spin 30s linear infinite;
}

.ring-2 {
    width: 270px;
    height: 270px;
    animation: spin-reverse 45s linear infinite;
}

.tech-node {
    position: absolute;
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 30px;
    padding: 6px 15px;
    font-size: 0.75rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    z-index: 5;
}

.tech-node i {
    color: var(--retail-color);
}

.tech-node-retail-1 { top: 20%; left: 12%; }
.tech-node-retail-2 { top: 15%; right: 12%; }
.tech-node-retail-3 { bottom: 20%; left: 15%; }
.tech-node-retail-4 { bottom: 15%; right: 12%; }

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes spin-reverse {
    from { transform: rotate(360deg); }
    to { transform: rotate(0deg); }
}

/* Sections & Cards styling */
.retail-section {
    padding: 60px 0;
}

.retail-section.section-alt {
    background-color: #fafafa;
}

.retail-section-header {
    max-width: 750px;
    margin: 0 auto 50px;
}

.retail-section-header.text-center {
    text-align: center;
}

.retail-subtitle {
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--retail-dark);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    display: block;
    margin-bottom: 10px;
}

.retail-title {
    font-size: 2rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1.3;
    margin-bottom: 15px;
}

.retail-desc {
    font-size: 1rem;
    line-height: 1.6;
    color: var(--text-secondary);
}

.retail-card-grid {
    display: grid;
    gap: 30px;
}

.grid-2 { grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); }
.grid-3 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.grid-4 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }

.retail-card {
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 30px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02);
    transition: all 0.25s ease;
}

.challenge-card-retail {
    border-top: 3px solid #ef4444;
}

.challenge-card-retail .card-icon-circle {
    background: #fef2f2;
    color: #ef4444;
}

.card-icon-circle-retail {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #f3f4f6;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.125rem;
    margin-bottom: 20px;
}

.accent-retail {
    background-color: var(--retail-light);
    color: var(--retail-dark);
}

.retail-card .card-title {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 10px;
    color: var(--text-primary);
}

.retail-card .card-desc {
    font-size: 0.90625rem;
    line-height: 1.6;
    color: var(--text-secondary);
}

.hover-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
    border-color: var(--retail-border);
}

.hover-card .card-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.84375rem;
    font-weight: 700;
    color: var(--retail-dark);
    text-decoration: none;
    margin-top: 15px;
}

.hover-card:hover .card-link {
    color: var(--retail-color);
}

/* Framework Layers layout */
.framework-layers-container {
    display: grid;
    gap: 20px;
    margin-top: 40px;
}

.framework-layer-item {
    display: flex;
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02);
}

.layer-number-retail {
    width: 80px;
    background: var(--retail-light);
    color: var(--retail-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 800;
    border-right: 1px solid var(--retail-border);
}

.layer-content {
    padding: 20px 25px;
    flex-grow: 1;
}

.layer-title {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 6px;
    color: var(--text-primary);
}

.layer-desc {
    font-size: 0.90625rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin: 0;
}

/* Pillar Card specific styling */
.pillar-card-retail {
    border-top: 3px solid var(--retail-color);
}

.pillar-card-retail:hover {
    border-top-color: var(--retail-dark);
}

/* Outcomes and checkmark styles */
.outcomes-checklist-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-top: 30px;
}

.outcome-checklist-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.outcome-checklist-item i {
    margin-top: 4px;
    color: #10b981;
}

.outcome-checklist-item span {
    font-size: 0.90625rem;
    color: var(--text-secondary);
    line-height: 1.5;
}

/* Aud tabs settings */
.audience-grid {
    display: grid;
    grid-template-columns: 1fr 1.2fr 1fr;
    gap: 30px;
    padding: 30px;
    background: white;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
}

.aud-block-title {
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--retail-dark);
    margin-bottom: 12px;
}

.aud-text {
    font-size: 0.90625rem;
    line-height: 1.6;
    color: var(--text-secondary);
}

/* Dynamic Case Study Tags */
.case-study-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(14, 165, 233, 0.08) !important;
    border-color: var(--retail-border) !important;
}

.card-image-placeholder-retail {
    height: 185px;
    background: linear-gradient(135deg, var(--retail-color), var(--retail-dark));
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 2.25rem;
}

/* FAQ Accordion container */
.faq-accordion-container {
    max-width: 800px;
    margin: 40px auto 0;
}

.faq-accordion-item {
    border: 1px solid var(--border-color);
    border-radius: 6px;
    background: white;
    margin-bottom: 12px;
    overflow: hidden;
}

.faq-accordion-trigger {
    width: 100%;
    background: none;
    border: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    font-size: 1rem;
    font-weight: 700;
    text-align: left;
    color: var(--text-primary);
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.faq-accordion-trigger:hover {
    background-color: var(--retail-light);
}

.faq-accordion-trigger.active {
    background-color: var(--retail-light);
    color: var(--retail-dark);
}

.faq-accordion-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.25s ease-out;
    background-color: white;
}

.faq-accordion-item.active .faq-accordion-panel,
.faq-accordion-trigger.active + .faq-accordion-panel,
.faq-accordion-panel.is-open,
.faq-accordion-panel.active {
    max-height: 1200px;
}

.faq-accordion-panel p {
    padding: 0 20px 20px;
    margin: 0;
    font-size: 0.90625rem;
    color: var(--text-secondary);
    line-height: 1.6;
}

/* Bottom CTA section and Overlay */
.retail-bottom-cta {
    position: relative;
    padding: 80px 0;
    background: linear-gradient(135deg, #075985 0%, #0369a1 100%);
    text-align: center;
    color: white;
    overflow: hidden;
}

.retail-bottom-cta .cta-title {
    color: white;
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 15px;
}

.retail-bottom-cta .cta-subtitle {
    color: rgba(255, 255, 255, 0.85);
    font-size: 1rem;
    max-width: 650px;
    margin: 0 auto 30px;
}

.retail-bottom-cta .cta-actions {
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.retail-bottom-cta .btn-primary {
    background-color: white !important;
    color: var(--retail-dark) !important;
    border-color: white !important;
    font-weight: 600;
}

.retail-bottom-cta .btn-primary:hover {
    background-color: var(--retail-light) !important;
    color: var(--retail-dark) !important;
}

.retail-bottom-cta .btn-outline:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

/* Dynamic Use Case Tags & Pills */
.tag-pill-retail {
    font-size: 0.6875rem;
    background: rgba(14, 165, 233, 0.08);
    color: var(--retail-dark);
    padding: 3px 8px;
    border-radius: 4px;
    font-weight: 500;
}

.tag-filter-btn-retail {
    background: white;
    border: 1px solid var(--border-color);
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 0.84375rem;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    transition: all 0.2s ease;
}

.tag-filter-btn-retail:hover {
    color: var(--retail-color);
    border-color: var(--retail-color);
}

.tag-filter-btn-retail.active {
    background-color: var(--retail-color);
    color: white;
    border-color: var(--retail-color);
}

/* Modal Form Settings */
.retail-modal {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(15, 23, 42, 0.7);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    z-index: 9999;
    align-items: center;
    justify-content: center;
}

.retail-modal-content {
    background: white;
    border-radius: 12px;
    padding: 40px;
    width: 100%;
    max-width: 580px;
    box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
    position: relative;
    animation: modalSlideUp 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.retail-modal-close {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 1.75rem;
    font-weight: 300;
    color: var(--text-tertiary);
    cursor: pointer;
    transition: color 0.2s ease;
}

.retail-modal-close:hover {
    color: var(--text-primary);
}

.retail-modal-header {
    margin-bottom: 20px;
}

.retail-modal-header h3 {
    font-size: 1.375rem;
    font-weight: 800;
    color: var(--retail-accent);
    margin-bottom: 6px;
}

.retail-modal-header p {
    font-size: 0.84375rem;
    color: var(--text-secondary);
    margin: 0;
    line-height: 1.4;
}

/* Form Styles */
.form-field {
    margin-bottom: 15px;
    text-align: left;
}

.form-field label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 6px;
}

.form-input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    font-size: 0.875rem;
    color: var(--text-primary);
    outline: none;
    transition: border-color 0.2s ease;
}

.form-input:focus {
    border-color: var(--retail-color);
}

.form-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 10px;
    text-align: left;
}

.form-checkbox input {
    margin-top: 3px;
}

.required-star {
    color: #dc2626;
}

/* AEO Summary Card (Executive AI context block) */
.aeo-summary-bar {
    padding: 40px 0;
}

.aeo-summary-inner {
    padding: 25px 30px;
    border-radius: 8px;
}

.aeo-summary-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background-color: var(--retail-light);
    color: var(--retail-dark);
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 700;
    margin-bottom: 12px;
}

.aeo-summary-text {
    font-size: 0.90625rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin-bottom: 15px !important;
}

.aeo-entities {
    font-size: 0.8125rem;
    color: var(--text-tertiary);
}

.aeo-entity-tag {
    display: inline-block;
    background: #f1f5f9;
    color: var(--text-secondary);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.71875rem;
    margin-left: 5px;
    margin-bottom: 5px;
    font-weight: 500;
}

/* Media Responsive Overrides */
@media (max-width: 991px) {
    .retail-hero-grid {
        grid-template-columns: 1fr;
        gap: 35px;
        text-align: center;
    }
    
    .retail-hero-content {
        text-align: center;
    }
    
    .retail-hero-ctas {
        justify-content: center;
    }
    
    .hero-bullet-list {
        justify-content: center;
    }
    
    .hero-bullet-list li {
        justify-content: center;
    }
    
    .retail-subnav-toggle {
        display: block;
    }
    
    .retail-subnav-list {
        display: none;
        flex-direction: column;
        width: 100%;
        margin-top: 15px;
        border-top: 1px solid var(--border-color);
        padding-top: 15px;
        gap: 10px;
    }
    
    .retail-subnav-list.show {
        display: flex;
    }
    
    .retail-subnav-list li {
        width: 100%;
        text-align: left;
    }
    
    .retail-subnav-link {
        display: block;
        padding: 10px;
        width: 100%;
    }
    
    .retail-bottom-cta .cta-actions {
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }
    
    .retail-bottom-cta .cta-actions button,
    .retail-bottom-cta .cta-actions a {
        width: 100%;
        max-width: 320px;
    }
}

@media (max-width: 768px) {
    .retail-hero-title {
        font-size: 1.875rem;
    }
    
    .retail-card-grid {
        grid-template-columns: 1fr !important;
    }
    
    .framework-layer-item {
        flex-direction: column;
    }
    
    .layer-number-retail {
        width: 100%;
        height: 50px;
        border-right: none;
        border-bottom: 1px solid var(--retail-border);
    }
    
    .audience-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .retail-modal-content {
        padding: 25px;
    }
    
    .form-grid-2 {
        grid-template-columns: 1fr;
        gap: 0;
    }
    
    .use-case-detail-card {
        padding: 20px !important;
    }
    
    .use-case-detail-card div[style*="grid-template-columns: 1fr 1fr"] {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }
    
    .use-case-detail-card div[style*="grid-template-columns: 1.2fr 0.8fr 1fr"] {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }
}


/* ==========================================
   DYNAMIC NAVIGATION & SEARCH OVERLAY STYLES
   ========================================== */

/* Search Overlay Trigger Button in Header */
.search-overlay-trigger-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    color: var(--text-secondary);
    padding: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 38px;
    height: 38px;
    outline: none;
}
.search-overlay-trigger-btn:hover {
    color: var(--accent-blue);
    background-color: var(--bg-secondary);
}
.search-overlay-trigger-btn:focus-visible {
    box-shadow: 0 0 0 2px var(--accent-blue);
}

/* Header dynamic styles on scroll */
.header.scrolled {
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid var(--border-color);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.03);
    height: 70px;
}

/* Dropdown indicators hover trigger delay */
.nav-item.has-dropdown:hover > a i,
.nav-item.has-dropdown.open > a i {
    transform: rotate(180deg);
}

/* Mega menu column adjustments */
.nav-mega-menu {
    border-radius: 16px !important;
    background-color: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.08) !important;
}
.mega-menu-section-label {
    display: block;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-tertiary);
    margin-bottom: 16px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--border-color);
}
.mega-menu-content {
    display: flex;
    flex-direction: column;
}
.mega-menu-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-primary);
    display: flex;
    align-items: center;
}
.mega-menu-desc {
    font-size: 0.71875rem;
    color: var(--text-secondary);
    margin-top: 4px;
    line-height: 1.4;
}

/* Featured spotlight card refinements */
.featured-card-column {
    border-left: 1px solid var(--border-color);
    padding-left: 28px;
}
.mega-featured-card {
    background: radial-gradient(circle at top right, rgba(14, 165, 233, 0.06), rgba(13, 148, 136, 0.03)), var(--bg-primary);
    border-radius: 12px;
}

/* Search Overlay */
.search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2000;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.search-overlay.active {
    opacity: 1;
    visibility: visible;
}
.search-overlay-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(15, 23, 42, 0.4);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.search-overlay-container {
    position: relative;
    width: 90%;
    max-width: 680px;
    margin: 10vh auto;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    overflow: hidden;
    transform: translateY(20px);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 2001;
}
.search-overlay.active .search-overlay-container {
    transform: translateY(0);
}
.search-overlay-header {
    border-bottom: 1px solid var(--border-color);
    padding: 20px 24px;
}
.search-overlay-form {
    display: flex;
    align-items: center;
    position: relative;
}
.search-input-icon {
    font-size: 1.125rem;
    color: var(--text-tertiary);
    margin-right: 16px;
}
#search-overlay-input {
    width: 100%;
    border: none;
    outline: none;
    font-size: 1rem;
    color: var(--text-primary);
    background: transparent;
    font-family: var(--font-body);
}
.search-overlay-close {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.125rem;
    color: var(--text-tertiary);
    padding: 4px;
    transition: color 0.2s;
}
.search-overlay-close:hover {
    color: #dc2626;
}
.search-overlay-results-wrapper {
    max-height: 480px;
    overflow-y: auto;
    padding: 24px;
}
.search-suggestions-section {
    margin-bottom: 24px;
}
.search-suggestions-section:last-child {
    margin-bottom: 0;
}
.search-suggestions-label {
    display: block;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-tertiary);
    margin-bottom: 12px;
}
.popular-search-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.popular-tag {
    font-size: 0.75rem;
    padding: 6px 12px;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 20px;
    color: var(--text-secondary);
    text-decoration: none;
    transition: all 0.2s ease;
}
.popular-tag:hover {
    background-color: var(--accent-glow);
    border-color: var(--accent-blue);
    color: var(--accent-blue);
}
.dynamic-suggestions-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.suggestion-item-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--text-primary);
    text-decoration: none;
    transition: all 0.2s ease;
    font-size: 0.84375rem;
    font-weight: 600;
}
.suggestion-item-link:hover {
    background-color: var(--bg-primary);
    border-color: var(--accent-blue);
    transform: translateX(4px);
}
.suggestion-item-type {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    background-color: var(--accent-glow);
    color: var(--accent-blue);
    padding: 2px 8px;
    border-radius: 12px;
}

/* Mobile Drawer Slide-out */
.mobile-nav-drawer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2100;
    visibility: hidden;
    transition: visibility 0.3s;
}
.mobile-nav-drawer.active {
    visibility: visible;
}
.mobile-nav-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(15, 23, 42, 0.4);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.mobile-nav-drawer.active .mobile-nav-backdrop {
    opacity: 1;
}
.mobile-nav-content {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    max-width: 360px;
    height: 100%;
    background-color: var(--bg-primary);
    box-shadow: -10px 0 30px rgba(0, 0, 0, 0.1);
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.mobile-nav-drawer.active .mobile-nav-content {
    transform: translateX(0);
}
.mobile-nav-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid var(--border-color);
}
.mobile-close-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.25rem;
    color: var(--text-secondary);
    padding: 4px;
    transition: color 0.2s;
}
.mobile-close-btn:hover {
    color: var(--accent-blue);
}
.mobile-nav-body {
    flex: 1;
    overflow-y: auto;
    padding: 24px;
}
.mobile-menu-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.mobile-direct-link,
.mobile-accordion-toggle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 12px 16px;
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    font-size: 0.90625rem;
    font-weight: 700;
    color: var(--text-primary);
    cursor: pointer;
    text-decoration: none;
    font-family: var(--font-heading);
    transition: all 0.2s ease;
    text-align: left;
    outline: none;
}
.mobile-accordion-toggle i {
    font-size: 0.75rem;
    transition: transform 0.3s;
}
.mobile-accordion-toggle[aria-expanded="true"] i {
    transform: rotate(180deg);
}
.mobile-accordion-toggle:hover,
.mobile-direct-link:hover {
    border-color: var(--accent-blue);
    color: var(--accent-blue);
    background-color: var(--bg-primary);
}
.mobile-accordion-group {
    margin-top: 16px;
    border-top: 1px dashed var(--border-color);
    padding-top: 12px;
    padding-left: 12px;
}
.mobile-group-label {
    display: block;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-tertiary);
    margin-bottom: 8px;
}
.mobile-accordion-group ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.mobile-sub-link {
    display: block;
    padding: 8px 12px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-decoration: none;
    border-radius: 6px;
    transition: all 0.2s ease;
}
.mobile-sub-link:hover {
    color: var(--accent-blue);
    background-color: var(--bg-secondary);
    padding-left: 16px;
}
.mobile-nav-footer {
    padding: 24px;
    border-top: 1px solid var(--border-color);
    background-color: var(--bg-secondary);
}
.mobile-ctas {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.mobile-cta-btn {
    width: 100%;
    padding: 12px;
    font-size: 0.875rem;
}

/* ==========================================================================
   Homepage Solutions Grid
   ========================================================================== */

.solutions-grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-top: 20px;
}

@media (max-width: 1024px) {
    .solutions-grid-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .solutions-grid-4 {
        grid-template-columns: 1fr;
    }
}

.solution-card {
    padding: 40px 30px;
    border-radius: 20px;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    height: 100%;
}

.solution-card h3 {
    font-family: var(--font-title);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--text-primary);
}

.solution-card p {
    font-family: var(--font-body);
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin-bottom: 24px;
    flex-grow: 1;
}

.solution-learn-link {
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--accent-blue);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
}

.solution-learn-link i {
    font-size: 0.6875rem;
    transition: transform 0.2s ease;
}

.solution-learn-link:hover {
    color: var(--accent-purple);
}

.solution-learn-link:hover i {
    transform: translateX(4px);
}

.solution-icon-wrapper {
    position: relative;
    width: 60px;
    height: 60px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 28px;
    z-index: 2;
}

.solution-icon-wrapper.cyan {
    background: rgba(6, 182, 212, 0.1);
    color: #06b6d4;
    border: 1px solid rgba(6, 182, 212, 0.25);
}

.solution-icon-wrapper.purple {
    background: rgba(168, 85, 247, 0.1);
    color: #a855f7;
    border: 1px solid rgba(168, 85, 247, 0.25);
}

.solution-icon-wrapper.red {
    background: rgba(239, 68, 68, 0.1);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.25);
}

.solution-icon-wrapper.yellow {
    background: rgba(234, 179, 8, 0.1);
    color: #eab308;
    border: 1px solid rgba(234, 179, 8, 0.25);
}

.solution-icon {
    font-size: 1.5rem;
    z-index: 3;
}

.icon-glow-ring {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    border-radius: 14px;
    background: inherit;
    filter: blur(8px);
    opacity: 0;
    z-index: 1;
    transition: opacity 0.3s ease;
}

.solution-card:hover .icon-glow-ring {
    opacity: 0.8;
}

.hover-glow-cyan:hover {
    border-color: rgba(6, 182, 212, 0.4);
    box-shadow: 0 12px 30px rgba(6, 182, 212, 0.08);
    transform: translateY(-4px);
}
.hover-glow-purple:hover {
    border-color: rgba(168, 85, 247, 0.4);
    box-shadow: 0 12px 30px rgba(168, 85, 247, 0.08);
    transform: translateY(-4px);
}
.hover-glow-red:hover {
    border-color: rgba(239, 68, 68, 0.4);
    box-shadow: 0 12px 30px rgba(239, 68, 68, 0.08);
    transform: translateY(-4px);
}
.hover-glow-yellow:hover {
    border-color: rgba(234, 179, 8, 0.4);
    box-shadow: 0 12px 30px rgba(234, 179, 8, 0.08);
    transform: translateY(-4px);
}

/* Keyframe animations for icons */
.animated-data {
    animation: dataPulse 3s infinite ease-in-out;
}
@keyframes dataPulse {
    0%, 100% { transform: scale(1); filter: drop-shadow(0 0 0px currentColor); }
    50% { transform: scale(1.1); filter: drop-shadow(0 0 8px currentColor); }
}

.animated-chart {
    animation: chartFlip 4s infinite ease-in-out;
}
@keyframes chartFlip {
    0%, 100% { transform: rotate(0deg) scale(1); }
    50% { transform: rotate(180deg) scale(1.05); }
}

.animated-shield {
    animation: shieldRotate 3s infinite ease-in-out;
}
@keyframes shieldRotate {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(-8deg); }
    75% { transform: rotate(8deg); }
}

.animated-database {
    animation: dbFloat 3.5s infinite ease-in-out;
}
@keyframes dbFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
}

/* ==========================================================================
   Homepage Testimonials Asymmetric Grid
   ========================================================================== */

#testimonials {
    background-color: #fafaf9 !important;
    padding: 100px 0;
}

.testimonials-masonry-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-items: start;
    margin-top: 40px;
}

@media (max-width: 991px) {
    .testimonials-masonry-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .testimonials-masonry-grid {
        grid-template-columns: 1fr;
    }
}

.testimonial-col {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.logo-rating-card {
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.04);
    border-radius: 16px;
    padding: 24px 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.015);
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.logo-rating-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 32px rgba(15, 23, 42, 0.05);
    border-color: rgba(15, 23, 42, 0.08);
}

.logo-rating-card .partner-logo-svg {
    height: 22px;
    width: auto;
    opacity: 0.9;
    transition: transform 0.3s ease;
}

.logo-rating-card:hover .partner-logo-svg {
    transform: scale(1.05);
}

.logo-rating-card .rating-stars {
    display: flex;
    align-items: center;
    gap: 6px;
}

.logo-rating-card .rating-val {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 0.9375rem;
    color: #0f172a;
}

.logo-rating-card .star-blue {
    color: var(--artha-primary-600);
    font-size: 0.875rem;
}

.testimonial-detail-card {
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.04);
    border-radius: 20px;
    padding: 40px;
    box-shadow: 0 6px 24px rgba(15, 23, 42, 0.015);
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    flex-direction: column;
    text-align: left;
}

.testimonial-detail-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 24px 48px rgba(15, 23, 42, 0.06);
    border-color: rgba(15, 23, 42, 0.08);
}

.testimonial-detail-card h4 {
    font-family: var(--font-heading);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.4;
    color: #0f172a;
    margin-bottom: 16px;
    letter-spacing: -0.3px;
}

.testimonial-detail-card p {
    font-family: var(--font-body);
    font-size: 0.90625rem;
    line-height: 1.65;
    color: #475569;
    margin-bottom: 24px;
    font-weight: 300;
}

.testimonial-detail-card p strong {
    color: #0f172a;
    font-weight: 600;
}

.testimonial-author-block {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: auto;
}

.testimonial-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    background-color: #f1f5f9;
}

.testimonial-author-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.testimonial-author-name {
    font-family: var(--font-heading);
    font-size: 0.875rem;
    font-weight: 700;
    color: #0f172a;
}

.testimonial-author-role {
    font-family: var(--font-body);
    font-size: 0.75rem;
    color: #64748b;
    font-weight: 300;
}

/* ==========================================================================
   Homepage Client Logos Section (Continuous Scroll Marquee)
   ========================================================================== */

.logo-scroll-container {
    overflow: hidden;
    width: 100%;
    position: relative;
    padding: 25px 0;
    display: flex;
}

.logo-scroll-track {
    display: flex;
    width: max-content;
    animation: scroll-marquee 45s linear infinite;
}

.logo-scroll-group {
    display: flex;
    align-items: center;
    gap: 40px;
    padding-right: 40px;
}

.scrolling-logo-card {
    flex-shrink: 0;
    width: 250px;
    height: 110px;
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02);
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.scrolling-logo-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.06);
    border-color: rgba(124, 58, 237, 0.25);
}

.scrolling-logo-card img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    filter: none;
    opacity: 1.0;
    transition: all 0.3s ease;
}

.scrolling-logo-card:hover img {
    transform: scale(1.05);
}

@keyframes scroll-marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* ==========================================================================
   AI ROI Solutions Section & Landing Pages Styling (Premium Synapse Theme)
   ========================================================================== */

.ai-roi-hub-section {
    background: radial-gradient(circle at center, rgba(124, 58, 237, 0.03) 0%, rgba(15, 23, 42, 0.01) 100%), #fafaf9;
    border-top: 1px solid rgba(15, 23, 42, 0.05);
    border-bottom: 1px solid rgba(15, 23, 42, 0.05);
    padding: 100px 0;
    position: relative;
    overflow: hidden;
}

.ai-roi-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    margin-top: 50px;
}

@media (max-width: 991px) {
    .ai-roi-grid {
        grid-template-columns: 1fr;
    }
}

.ai-roi-card {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 24px;
    padding: 45px;
    position: relative;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.ai-roi-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 24px;
    padding: 2px;
    background: linear-gradient(135deg, transparent, transparent);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    transition: background 0.4s ease;
    pointer-events: none;
}

.ai-roi-card.sniffguard-theme:hover::before {
    background: linear-gradient(135deg, #ef4444, #f43f5e);
}

.ai-roi-card.framework-theme:hover::before {
    background: linear-gradient(135deg, #7c3aed, #a855f7);
}

.ai-roi-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 30px 60px rgba(15, 23, 42, 0.08);
    background: #ffffff;
}

.ai-roi-card .card-badge {
    align-self: flex-start;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 14px;
    border-radius: 30px;
    margin-bottom: 25px;
}

.ai-roi-card.sniffguard-theme .card-badge {
    background: rgba(239, 68, 68, 0.08);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.15);
}

.ai-roi-card.framework-theme .card-badge {
    background: rgba(124, 58, 237, 0.08);
    color: #7c3aed;
    border: 1px solid rgba(124, 58, 237, 0.15);
}

.ai-roi-card h3 {
    font-family: var(--font-heading);
    font-size: 1.75rem;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 12px;
}

.ai-roi-card h4 {
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 20px;
}

.ai-roi-card p {
    font-family: var(--font-body);
    font-size: 0.9375rem;
    line-height: 1.65;
    color: #64748b;
    margin-bottom: 30px;
    flex-grow: 1;
}

.ai-roi-features-list {
    list-style: none;
    padding: 0;
    margin: 0 0 35px 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ai-roi-features-list li {
    font-family: var(--font-body);
    font-size: 0.90625rem;
    font-weight: 500;
    color: #334155;
    display: flex;
    align-items: center;
    gap: 12px;
}

.ai-roi-features-list li i {
    font-size: 1rem;
}

.ai-roi-card.sniffguard-theme .ai-roi-features-list li i {
    color: #ef4444;
}

.ai-roi-card.framework-theme .ai-roi-features-list li i {
    color: #7c3aed;
}

.ai-roi-card .card-cta {
    margin-top: auto;
    width: 100%;
    text-align: center;
    padding: 14px 28px;
    font-weight: 700;
    border-radius: 12px;
    transition: all 0.3s ease;
}

/* SniffGuard Interactive Data Flow styling */
.interactive-flow-container {
    background: rgba(15, 23, 42, 0.03);
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 20px;
    padding: 40px;
    margin: 40px auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    max-width: 800px;
}

@media (max-width: 640px) {
    .interactive-flow-container {
        flex-direction: column;
        gap: 40px;
        text-align: center;
    }
}

.flow-node {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: #ffffff;
    border: 2px solid rgba(15, 23, 42, 0.08);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 2;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.03);
    transition: all 0.3s ease;
}

.flow-node i {
    font-size: 1.5rem;
    margin-bottom: 6px;
}

.flow-node span {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.flow-node.client-node {
    color: #06b6d4;
    border-color: rgba(6, 182, 212, 0.3);
}

.flow-node.sniffguard-node {
    width: 130px;
    height: 130px;
    background: linear-gradient(135deg, #ef4444, #f43f5e);
    color: #ffffff;
    border: none;
    box-shadow: 0 15px 30px rgba(239, 68, 68, 0.3);
    animation: flowPulse 2.5s infinite ease-in-out;
}

.flow-node.sniffguard-node i {
    font-size: 2rem;
}

.flow-node.llm-node {
    color: #7c3aed;
    border-color: rgba(124, 58, 237, 0.3);
}

.flow-line {
    flex-grow: 1;
    height: 4px;
    background: rgba(15, 23, 42, 0.06);
    position: relative;
    z-index: 1;
    margin: 0 -10px;
}

.flow-line::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 30px;
    background: linear-gradient(90deg, transparent, #06b6d4, transparent);
    animation: flowCharge 2s infinite linear;
}

.flow-line.llm-line::after {
    background: linear-gradient(90deg, transparent, #7c3aed, transparent);
    animation-delay: 1s;
}

@keyframes flowPulse {
    0%, 100% { transform: scale(1); box-shadow: 0 15px 30px rgba(239, 68, 68, 0.25); }
    50% { transform: scale(1.05); box-shadow: 0 15px 40px rgba(239, 68, 68, 0.45); }
}

@keyframes flowCharge {
    0% { left: 0%; }
    100% { left: 100%; }
}

/* MAAC Catalyst Layout */
.maac-catalyst-block {
    background: #0f172a;
    border-radius: 24px;
    padding: 60px;
    color: #ffffff;
    position: relative;
    overflow: hidden;
    margin: 60px 0;
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.maac-catalyst-block h2 {
    color: #ffffff !important;
}

.maac-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 60px;
    align-items: center;
}

@media (max-width: 991px) {
    .maac-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}

.maac-stats-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.maac-stat-card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 16px;
    padding: 30px 20px;
    text-align: center;
    transition: all 0.3s ease;
}

.maac-stat-card:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(124, 58, 237, 0.3);
    transform: translateY(-3px);
}

.maac-stat-val {
    font-size: 2.25rem;
    font-weight: 800;
    color: #a855f7;
    margin-bottom: 8px;
    font-family: var(--font-heading);
}

.maac-stat-lbl {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #94a3b8;
    font-weight: 700;
}

/* ==========================================================================
   Analyst Speak Section Styles
   ========================================================================== */

.analyst-speak-section {
    padding: 100px 0;
    background-color: var(--bg-primary);
    border-bottom: 1px solid var(--border-color);
    position: relative;
    overflow: hidden;
}

.analyst-speak-grid {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 60px;
    align-items: center;
}

@media (max-width: 991px) {
    .analyst-speak-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }
}

.analyst-badge-row {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}

.analyst-idc-logo {
    height: 24px;
    width: auto;
    object-fit: contain;
}

.analyst-metrics-row {
    display: flex;
    gap: 30px;
    margin: 35px 0;
}

.analyst-metric-box {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.analyst-metric-box .icon-box {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background-color: var(--accent-glow);
    color: var(--accent-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
}

.analyst-metric-box .metric-info h4 {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--text-primary);
    margin-bottom: 4px;
    line-height: 1.1;
    font-family: var(--font-heading);
}

.analyst-metric-box .metric-info p {
    font-size: 0.6875rem;
    color: var(--text-tertiary);
    text-transform: uppercase;
    font-weight: 750;
    letter-spacing: 0.5px;
    margin-bottom: 0;
}

.analyst-buttons {
    display: flex;
    gap: 16px;
    align-items: center;
}

@media (max-width: 480px) {
    .analyst-buttons {
        flex-direction: column;
        align-items: stretch;
    }
}

.analyst-visual-box {
    position: relative;
    border-radius: 24px;
    background: radial-gradient(circle at top right, rgba(14, 165, 233, 0.05), rgba(124, 58, 237, 0.03));
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.analyst-photo-frame {
    width: 100%;
    max-width: 320px;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.05);
    background-color: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.05);
    position: relative;
}

.analyst-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    aspect-ratio: 1 / 1;
}

/* Floating Status Card Overlay */
.floating-status-card {
    position: absolute;
    bottom: 40px;
    right: -20px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 16px;
    padding: 20px 24px;
    width: 240px;
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.06);
    z-index: 10;
    transition: all 0.3s ease;
}

@media (max-width: 576px) {
    .floating-status-card {
        right: 10px;
        bottom: 10px;
        width: 200px;
        padding: 15px;
    }
}

.floating-status-card h5 {
    font-family: var(--font-heading);
    font-size: 0.84375rem;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 4px;
}

.floating-status-card p {
    font-size: 0.6875rem;
    color: #64748b;
    margin-bottom: 12px;
}

.floating-status-card .scan-val {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--artha-primary-600);
    margin-bottom: 10px;
    font-family: var(--font-heading);
}

.floating-status-card .progress-container {
    height: 5px;
    background-color: rgba(15, 23, 42, 0.05);
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 6px;
}

.floating-status-card .progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #7c3aed, #06b6d4);
    width: 78%;
}

.floating-status-card .progress-label {
    display: flex;
    justify-content: space-between;
    font-size: 0.625rem;
    color: #94a3b8;
    font-weight: 600;
}

/* Roadmap Offering Links styling */
.roadmap-grid {
    align-items: stretch;
}

.roadmap-card {
    padding: 30px 34px 34px;
}

.roadmap-icon {
    width: 148px;
    height: 148px;
    margin: -8px auto 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 2;
}

.roadmap-icon::before {
    content: "";
    position: absolute;
    inset: 13px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 40% 35%, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.48) 40%, transparent 70%),
        linear-gradient(145deg, rgba(124, 58, 237, 0.10), rgba(6, 182, 212, 0.08));
    border: 1px solid rgba(124, 58, 237, 0.11);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 12px 28px rgba(124, 58, 237, 0.08);
}

.roadmap-icon svg {
    width: 122px;
    height: 122px;
    overflow: visible;
    position: relative;
    z-index: 1;
}

.roadmap-line,
.roadmap-orbit,
.roadmap-module,
.roadmap-signal {
    fill: none;
    stroke: #7c3aed;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.roadmap-orbit {
    stroke-width: 1.5;
    stroke-dasharray: 5 7;
    opacity: 0.33;
    transform-origin: 60px 60px;
}

.roadmap-orbit-outer {
    animation: roadmap-spin 16s linear infinite;
}

.roadmap-orbit-inner {
    animation: roadmap-spin-reverse 11s linear infinite;
}

.roadmap-pulse {
    fill: rgba(124, 58, 237, 0.12);
    stroke: rgba(124, 58, 237, 0.45);
    stroke-width: 2;
    transform-origin: 60px 60px;
    animation: roadmap-pulse 2.4s ease-in-out infinite;
}

.roadmap-node {
    fill: #ffffff;
    stroke: #7c3aed;
    stroke-width: 3;
}

.roadmap-node-a,
.roadmap-node-c {
    animation: roadmap-node-pulse 2.4s ease-in-out infinite;
}

.roadmap-node-c {
    animation-delay: 0.8s;
}

.roadmap-strategy-arrow,
.roadmap-arrow-head {
    stroke-dasharray: 120;
    stroke-dashoffset: 120;
    animation: roadmap-draw 3s ease-in-out infinite;
}

.roadmap-icon-implementation .roadmap-line,
.roadmap-icon-implementation .roadmap-module {
    stroke: #6366f1;
}

.roadmap-flow-line {
    stroke-dasharray: 8 7;
    animation: roadmap-flow 2.2s linear infinite;
}

.roadmap-flow-line-two {
    animation-delay: -0.7s;
}

.roadmap-module {
    fill: rgba(255, 255, 255, 0.92);
}

.roadmap-module-one,
.roadmap-module-two {
    transform-box: fill-box;
    transform-origin: center;
    animation: roadmap-module-float 2.8s ease-in-out infinite;
}

.roadmap-module-two {
    animation-delay: -1.4s;
}

.roadmap-module-target {
    fill: rgba(99, 102, 241, 0.06);
    transform-origin: 91px 60px;
    animation: roadmap-target-pulse 2.5s ease-in-out infinite;
}

.roadmap-check {
    stroke-dasharray: 32;
    stroke-dashoffset: 32;
    animation: roadmap-check-draw 2.5s ease-in-out infinite;
}

.roadmap-data-dot {
    fill: #06b6d4;
    filter: drop-shadow(0 0 5px rgba(6, 182, 212, 0.45));
}

.roadmap-data-dot-one {
    animation: roadmap-data-one 2.2s ease-in-out infinite;
}

.roadmap-data-dot-two {
    animation: roadmap-data-two 2.2s ease-in-out infinite;
}

.roadmap-icon-support .roadmap-line,
.roadmap-icon-support .roadmap-module,
.roadmap-icon-support .roadmap-node {
    stroke: #8b5cf6;
}

.roadmap-support-ring {
    fill: rgba(139, 92, 246, 0.07);
    stroke: rgba(139, 92, 246, 0.25);
    stroke-width: 2;
}

.roadmap-support-arc {
    stroke-dasharray: 96;
    stroke-dashoffset: 96;
    animation: roadmap-draw 2.8s ease-in-out infinite;
}

.roadmap-earpiece {
    fill: #ffffff;
    transform-box: fill-box;
    transform-origin: center;
    animation: roadmap-earpiece 2.4s ease-in-out infinite;
}

.roadmap-earpiece-right {
    animation-delay: -1.2s;
}

.roadmap-support-status {
    fill: #ffffff;
    animation: roadmap-node-pulse 2.2s ease-in-out infinite;
}

.roadmap-support-check {
    stroke-width: 2.4;
}

.roadmap-support-mic {
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: roadmap-check-draw 2.8s ease-in-out infinite;
}

.roadmap-signal {
    stroke-width: 1.5;
    opacity: 0;
    transform-origin: 60px 55px;
    animation: roadmap-signal 3s ease-out infinite;
}

.roadmap-signal-two {
    animation-delay: 1.5s;
}

@keyframes roadmap-spin {
    to { transform: rotate(360deg); }
}

@keyframes roadmap-spin-reverse {
    to { transform: rotate(-360deg); }
}

@keyframes roadmap-pulse {
    0%, 100% { transform: scale(0.88); opacity: 0.55; }
    50% { transform: scale(1.15); opacity: 1; }
}

@keyframes roadmap-node-pulse {
    0%, 100% { filter: drop-shadow(0 0 0 rgba(124, 58, 237, 0)); }
    50% { filter: drop-shadow(0 0 7px rgba(124, 58, 237, 0.55)); }
}

@keyframes roadmap-draw {
    0%, 15% { stroke-dashoffset: 120; opacity: 0.35; }
    55%, 80% { stroke-dashoffset: 0; opacity: 1; }
    100% { stroke-dashoffset: -120; opacity: 0.35; }
}

@keyframes roadmap-flow {
    to { stroke-dashoffset: -30; }
}

@keyframes roadmap-module-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
}

@keyframes roadmap-target-pulse {
    0%, 100% { transform: scale(0.94); }
    50% { transform: scale(1.04); }
}

@keyframes roadmap-check-draw {
    0%, 20% { stroke-dashoffset: 32; opacity: 0.35; }
    55%, 85% { stroke-dashoffset: 0; opacity: 1; }
    100% { stroke-dashoffset: -32; opacity: 0.35; }
}

@keyframes roadmap-data-one {
    0% { transform: translate(0, 0); opacity: 0; }
    20% { opacity: 1; }
    65%, 100% { transform: translate(35px, 22px); opacity: 0; }
}

@keyframes roadmap-data-two {
    0% { transform: translate(0, 0); opacity: 0; }
    25% { opacity: 1; }
    70%, 100% { transform: translate(35px, -22px); opacity: 0; }
}

@keyframes roadmap-earpiece {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(3px); }
}

@keyframes roadmap-signal {
    0% { transform: scale(0.72); opacity: 0.42; }
    80%, 100% { transform: scale(1.12); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .roadmap-icon * {
        animation: none !important;
    }
}

.roadmap-stage {
    width: fit-content;
    margin: 0 0 13px;
    padding: 6px 12px;
    border: 1px solid rgba(124, 58, 237, 0.16);
    border-radius: 999px;
    background: rgba(124, 58, 237, 0.06);
    color: var(--accent-purple);
    font-family: var(--font-heading);
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    position: relative;
    z-index: 2;
}

.roadmap-card h3 {
    min-height: 56px;
    margin: 0 0 12px;
    color: var(--text-primary);
    font-size: 1.25rem;
    font-weight: 750;
    line-height: 1.35;
    position: relative;
    z-index: 2;
}

.roadmap-card > p {
    min-height: 90px;
    margin: 0;
    color: var(--text-secondary);
    font-size: 0.875rem;
    line-height: 1.65;
    position: relative;
    z-index: 2;
}

.roadmap-links {
    margin-top: 20px;
    border-top: 1px dashed rgba(15, 23, 42, 0.08);
    padding-top: 15px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    z-index: 10;
    position: relative;
    text-align: left;
    width: 100%;
}

.roadmap-link-item {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--accent-blue);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
}

.roadmap-link-item i {
    font-size: 0.6875rem;
    width: 14px;
    text-align: center;
    transition: transform 0.2s ease;
}

.roadmap-link-item:hover {
    color: var(--accent-purple);
}

.roadmap-link-item:hover i {
    transform: translateX(2px);
}

@media (max-width: 991px) {
    .roadmap-card h3,
    .roadmap-card > p {
        min-height: 0;
    }
}

@media (max-width: 576px) {
    .roadmap-card {
        padding: 26px 24px 30px;
    }

    .roadmap-icon {
        width: 126px;
        height: 126px;
    }

    .roadmap-icon svg {
        width: 106px;
        height: 106px;
    }
}

/* Purple Theme for Hero Visual Animation */
.purple-theme .ai-node-circle {
    border-color: rgba(139, 92, 246, 0.25);
}
.purple-theme .ai-core {
    background: linear-gradient(135deg, #8b5cf6, #a78bfa);
    box-shadow: 0 0 40px rgba(139, 92, 246, 0.45);
}
.purple-theme .orbiting-node {
    color: #8b5cf6;
    border-color: rgba(139, 92, 246, 0.15);
}
.purple-theme .orbiting-node:hover {
    box-shadow: 0 0 20px rgba(139, 92, 246, 0.3);
    border-color: #8b5cf6;
}

/* Assessment Radar Visual */
.assessment-radar-container {
    position: relative;
    width: 100%;
    max-width: 440px;
    height: 440px;
    margin: 0 auto;
}

.radar-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 1px dashed rgba(124, 58, 237, 0.15);
    background: radial-gradient(circle, rgba(124, 58, 237, 0.02) 0%, transparent 70%);
}

.radar-lg { width: 400px; height: 400px; }
.radar-md { width: 280px; height: 280px; }
.radar-sm { width: 160px; height: 160px; }

.radar-sweep {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 200px;
    height: 200px;
    background: conic-gradient(from 0deg, rgba(124, 58, 237, 0.1) 0deg, transparent 90deg, transparent 360deg);
    transform-origin: top left;
    border-radius: 100% 0 0 0;
    animation: radarScan 6s linear infinite;
}

@keyframes radarScan {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.radar-node {
    position: absolute;
    width: 12px;
    height: 12px;
    background-color: #7c3aed;
    border-radius: 50%;
    box-shadow: 0 0 15px #7c3aed;
    animation: nodePulse 2s ease-in-out infinite;
    display: flex;
    align-items: center;
    justify-content: center;
}

.radar-node i {
    font-size: 0.5rem;
    color: white;
}

.node-1 { top: 25%; left: 30%; animation-delay: 0.5s; }
.node-2 { top: 65%; left: 20%; animation-delay: 1.2s; }
.node-3 { top: 40%; left: 75%; animation-delay: 0.1s; }
.node-4 { top: 75%; left: 60%; animation-delay: 1.8s; }
.node-5 { top: 15%; left: 65%; animation-delay: 0.9s; }

@keyframes nodePulse {
    0%, 100% { transform: scale(1); opacity: 0.6; }
    50% { transform: scale(1.4); opacity: 1; box-shadow: 0 0 25px #7c3aed; }
}

.radar-core {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #7c3aed, #d946ef);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 30px rgba(124, 58, 237, 0.4);
    z-index: 5;
    color: white;
    font-size: 1.75rem;
}

/* Promo Card Container */
.promo-card-container {
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(124, 58, 237, 0.15);
    border-radius: 24px;
    padding: 50px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(124, 58, 237, 0.05);
    margin: 40px 0;
}

.promo-card-container::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -30%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(217, 70, 239, 0.1) 0%, transparent 70%);
    z-index: 1;
    pointer-events: none;
}

.promo-card-container::after {
    content: '';
    position: absolute;
    bottom: -50%;
    left: -30%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(124, 58, 237, 0.1) 0%, transparent 70%);
    z-index: 1;
    pointer-events: none;
}

.promo-grid {
    display: grid;
    grid-template-columns: 1.3fr 0.7fr;
    gap: 40px;
    align-items: center;
    position: relative;
    z-index: 2;
}

.promo-price-tag {
    background: linear-gradient(135deg, #7c3aed, #d946ef);
    padding: 30px 20px;
    border-radius: 20px;
    text-align: center;
    color: white;
    box-shadow: 0 10px 25px rgba(124, 58, 237, 0.25);
}

.promo-price-val {
    font-size: 4rem;
    font-weight: 800;
    font-family: var(--font-heading);
    line-height: 1;
    margin-bottom: 5px;
}

.promo-price-lbl {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    opacity: 0.9;
    font-weight: 700;
}

@media (max-width: 768px) {
    .promo-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

/* Industry Section Styles */
.industry-carousel-wrapper {
    position: relative;
    width: 100%;
}

.industry-carousel-track {
    display: flex;
    gap: 30px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 20px 5px;
    scrollbar-width: none; /* Hide scrollbar for Firefox */
    -ms-overflow-style: none; /* Hide scrollbar for IE/Edge */
    scroll-behavior: smooth;
}

.industry-carousel-track::-webkit-scrollbar {
    display: none; /* Hide scrollbar for Chrome/Safari/Opera */
}

.industry-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s ease, border-color 0.4s ease;
    cursor: pointer;
    text-decoration: none;
    background: var(--glass-bg, rgba(255, 255, 255, 0.75));
    border: 1px solid var(--border-color, rgba(226, 232, 240, 0.8));
    border-radius: 24px;
    overflow: hidden;
    box-shadow: var(--card-shadow, 0 8px 32px 0 rgba(124, 58, 237, 0.05));
    padding: 30px 25px 0 25px; /* no padding-bottom as image touches bottom */
    flex: 0 0 calc(25% - 22.5px); /* 4 columns on desktop */
    min-width: 290px;
    scroll-snap-align: start;
}

.industry-card:hover {
    transform: translateY(-8px);
    border-color: rgba(124, 58, 237, 0.3);
    box-shadow: var(--hover-shadow, 0 20px 40px -15px rgba(124, 58, 237, 0.15));
}

.industry-card-text {
    margin-bottom: 25px;
}

.industry-card-tag {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: var(--accent-blue, #7c3aed);
    display: inline-block;
    margin-bottom: 10px;
}

.industry-card-title {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--text-primary, #0f172a);
    margin-bottom: 12px;
    line-height: 1.35;
    font-family: var(--font-heading);
    transition: color 0.3s ease;
}

.industry-card:hover .industry-card-title {
    color: var(--accent-blue, #7c3aed);
}

.industry-card-desc {
    font-size: 0.84375rem;
    line-height: 1.6;
    color: var(--text-secondary, #475569);
    margin-bottom: 0;
}

.industry-card-img-box {
    position: relative;
    width: 100%;
    height: 220px;
    border-radius: 16px 16px 0 0;
    overflow: hidden;
    margin-top: auto;
}

.industry-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.industry-card:hover .industry-card-img {
    transform: scale(1.08);
}

.industry-card-img-box::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(15, 23, 42, 0.25) 100%);
    transition: opacity 0.3s ease;
}

.industry-carousel-controls {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 30px;
}

.industry-carousel-arrow {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: var(--bg-primary, #ffffff);
    border: 1px solid var(--border-color, rgba(226, 232, 240, 0.8));
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-primary, #0f172a);
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: var(--card-shadow, 0 4px 12px rgba(0,0,0,0.03));
}

.industry-carousel-arrow:hover {
    background-color: var(--accent-blue, #7c3aed);
    color: #ffffff;
    border-color: var(--accent-blue, #7c3aed);
    transform: scale(1.05);
}

/* Responsiveness for Industry Section */
@media (max-width: 1200px) {
    .industry-card {
        flex: 0 0 calc(33.333% - 20px); /* 3 columns */
    }
}

@media (max-width: 991px) {
    .industry-card {
        flex: 0 0 calc(50% - 15px); /* 2 columns */
    }
}

@media (max-width: 600px) {
    body.home-page-light #home-industries .industry-carousel-track {
        display: grid;
        grid-template-columns: 1fr;
        gap: 24px;
        overflow-x: visible;
        scroll-snap-type: none;
        padding: 20px 0;
    }

    .industry-card {
        flex: 0 0 100%; /* 1 column */
    }

    body.home-page-light #home-industries .industry-card {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        flex: none;
        scroll-snap-align: none;
    }

    body.home-page-light #home-industries .industry-carousel-controls {
        display: none;
    }
}










/* Fullscreen Video Background for Hero Slider */
.hero-slider {
    position: relative !important;
    overflow: hidden !important;
    height: 100vh !important;
    min-height: 650px !important;
    display: flex !important;
    align-items: center !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background-color: #0f172a !important; /* solid fallback base */
}

.slider-track {
    position: relative !important;
    z-index: 3 !important;
    width: 100% !important;
    height: 100% !important;
}

.hero-slider .slide {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    background: transparent !important;
    transform: none !important;
    padding-top: var(--nav-height) !important; /* Offset content to clear the header area */
}

/* Individual Slide Video Containers */
.slide-video-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 1;
}

.slide-poster {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    z-index: 1;
}

/* Emulating object-fit: cover for Vimeo Iframes */
.hero-vimeo-bg {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100vw;
    height: 56.25vw; /* 16:9 Aspect Ratio */
    min-height: 100vh;
    min-width: 177.77vh; /* 16:9 Aspect Ratio */
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 2;
}

@media (max-width: 640px) {
    body.home-page-light #content .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    body.home-page-light #content .section {
        overflow-x: clip;
    }

    body.home-page-light .hero-vimeo-bg {
        display: none;
    }

    body.home-page-light .hero-bg-glow,
    body.home-page-light .glow-blob {
        width: min(300px, 80vw) !important;
        height: min(300px, 80vw) !important;
        filter: blur(80px);
    }

    body.home-page-light .hero-bg-glow.hero-glow-1 {
        left: 10% !important;
        right: auto !important;
    }

    body.home-page-light .hero-bg-glow.hero-glow-2,
    body.home-page-light .hero-bg-glow.hero-glow-3 {
        left: auto !important;
        right: 0 !important;
    }

    body.home-page-light .glow-blob {
        left: 50% !important;
        right: auto !important;
        transform: translate(-50%, -50%) !important;
    }
}

.hero-video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.45) 0%, rgba(15, 23, 42, 0.7) 100%);
    z-index: 3;
}

/* Light mode contrast adjustments for Video Background */
body.home-page-light .hero-slider .hero-title {
    color: #ffffff !important;
}

body.home-page-light .hero-slider .hero-desc {
    color: #e2e8f0 !important;
}

body.home-page-light .hero-slider .hero-badge {
    background-color: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    color: #a5b4fc !important;
}

body.home-page-light .hero-slider .slider-arrow {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
}

body.home-page-light .hero-slider .slider-arrow:hover {
    background-color: #6366f1 !important;
    color: #ffffff !important;
    border-color: #6366f1 !important;
}

body.home-page-light .hero-slider .slider-dot {
    background-color: rgba(255, 255, 255, 0.3) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
}

body.home-page-light .hero-slider .slider-dot.active {
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.25) !important;
}

body.home-page-light .hero-slider .slider-visual-card {
    background: rgba(255, 255, 255, 0.08) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

body.home-page-light .hero-slider .readiness-card-box {
    background-color: rgba(15, 23, 42, 0.45) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

body.home-page-light .hero-slider .readiness-score-header {
    color: #ffffff !important;
}

body.home-page-light .hero-slider .metric-info strong {
    color: #ffffff !important;
}

body.home-page-light .hero-slider .metric-info span {
    color: #94a3b8 !important;
}

body.home-page-light .hero-slider .progress-bar-container {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

/* Home Page Header Transparency & Scroll Transitions */
body.home-page-light .header {
    background-color: transparent !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transition: background-color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease, backdrop-filter 0.35s ease, height 0.35s ease !important;
}

body.home-page-light .header.scrolled {
    background-color: rgba(255, 255, 255, 0.95) !important;
    border-bottom: 1px solid rgba(124, 58, 237, 0.12) !important;
    box-shadow: 0 4px 30px rgba(124, 58, 237, 0.04) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
}

/* Logo transition (toggle main / white logo depending on scroll) */
body.home-page-light .header:not(.scrolled) .logo-white {
    display: block !important;
}

body.home-page-light .header:not(.scrolled) .logo-main {
    display: none !important;
}

body.home-page-light .header.scrolled .logo-white {
    display: none !important;
}

body.home-page-light .header.scrolled .logo-main {
    display: block !important;
}

/* Nav Link Colors */
body.home-page-light .nav-link {
    transition: color 0.35s ease !important;
}

body.home-page-light .header:not(.scrolled) .nav-link {
    color: rgba(255, 255, 255, 0.9) !important;
}

body.home-page-light .header:not(.scrolled) .nav-link:hover,
body.home-page-light .header:not(.scrolled) .nav-link.active {
    color: #ffffff !important;
}

body.home-page-light .header.scrolled .nav-link {
    color: #475569 !important;
}

body.home-page-light .header.scrolled .nav-link:hover,
body.home-page-light .header.scrolled .nav-link.active {
    color: #7c3aed !important;
}

/* Search overlay button colors */
body.home-page-light .search-overlay-trigger-btn {
    transition: color 0.35s ease, background-color 0.35s ease !important;
}

body.home-page-light .header.scrolled .search-overlay-trigger-btn {
    color: #475569 !important;
}

body.home-page-light .header.scrolled .search-overlay-trigger-btn:hover {
    color: var(--accent-blue) !important;
    background-color: var(--bg-secondary) !important;
}

/* CTA Header button overrides */
body.home-page-light .header:not(.scrolled) .header-cta-btn.btn-outline,
body.home-page-light .header:not(.scrolled) .header-cta-btn:not(.btn-primary) {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.45) !important;
    background-color: transparent !important;
}

body.home-page-light .header:not(.scrolled) .header-cta-btn.btn-outline:hover,
body.home-page-light .header:not(.scrolled) .header-cta-btn:not(.btn-primary):hover {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border-color: #ffffff !important;
}

body.home-page-light .header.scrolled .header-cta-btn.btn-outline,
body.home-page-light .header.scrolled .header-cta-btn:not(.btn-primary) {
    color: #475569 !important;
    border-color: var(--border-color) !important;
    background-color: transparent !important;
}

body.home-page-light .header.scrolled .header-cta-btn.btn-outline:hover,
body.home-page-light .header.scrolled .header-cta-btn:not(.btn-primary):hover {
    background-color: var(--bg-secondary) !important;
    border-color: var(--accent-blue) !important;
    color: var(--accent-blue) !important;
}

.mega-menu-section-label-link:hover .mega-menu-section-label {
    color: var(--accent-blue) !important;
}

/* ============================================================
   Dark Hero Nav – for pages with dark hero sections
   (e.g. Careers, Industry pages with dark banners)
   Add class="dark-hero-nav" to <body> in the template
   ============================================================ */
body.dark-hero-nav .header {
    background-color: rgba(10, 8, 26, 0.35) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
    backdrop-filter: blur(16px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(160%) !important;
    transition: background-color 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease !important;
}

body.dark-hero-nav .header.scrolled-past-hero {
    background-color: rgba(255, 255, 255, 0.95) !important;
    border-bottom: 1px solid rgba(124, 58, 237, 0.12) !important;
    box-shadow: 0 4px 24px rgba(124, 58, 237, 0.08) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
}

body.dark-hero-nav .nav-link {
    color: rgba(255, 255, 255, 0.9) !important;
    transition: color 0.2s ease !important;
}

body.dark-hero-nav .nav-link:hover,
body.dark-hero-nav .nav-link.active {
    color: #a78bfa !important;
}

body.dark-hero-nav .header.scrolled-past-hero .nav-link {
    color: #475569 !important;
}

body.dark-hero-nav .header.scrolled-past-hero .nav-link:hover,
body.dark-hero-nav .header.scrolled-past-hero .nav-link.active {
    color: #7c3aed !important;
}

/* Keep colored logo on dark nav, switch appropriately */
body.dark-hero-nav .logo-main {
    display: none !important;
}

body.dark-hero-nav .logo-white {
    display: inline-block !important;
    filter: brightness(1) !important;
}

body.dark-hero-nav .header.scrolled-past-hero .logo-main {
    display: inline-block !important;
}

body.dark-hero-nav .header.scrolled-past-hero .logo-white {
    display: none !important;
}

/* Header CTAs on dark nav */
body.dark-hero-nav .header-cta-btn.btn-primary {
    background: linear-gradient(135deg, #6d28d9, #d946ef) !important;
    border-color: transparent !important;
    color: #fff !important;
}

body.dark-hero-nav .header-cta-btn:not(.btn-primary) {
    color: rgba(255, 255, 255, 0.85) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
    background: transparent !important;
}

body.dark-hero-nav .header-cta-btn:not(.btn-primary):hover {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
}

/* Scrolled-past-hero: restore standard CTA styles */
body.dark-hero-nav .header.scrolled-past-hero .header-cta-btn:not(.btn-primary) {
    color: #7c3aed !important;
    border-color: rgba(124, 58, 237, 0.4) !important;
}

/* Search icon */
body.dark-hero-nav .search-overlay-trigger-btn {
    color: rgba(255, 255, 255, 0.8) !important;
}

body.dark-hero-nav .header.scrolled-past-hero .search-overlay-trigger-btn {
    color: var(--text-secondary) !important;
}

/* Mega menu dropdown - always stays light */
body.dark-hero-nav .nav-mega-menu {
    background-color: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid rgba(124, 58, 237, 0.12) !important;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.12) !important;
    backdrop-filter: blur(24px) !important;
    -webkit-backdrop-filter: blur(24px) !important;
}

body.dark-hero-nav .mega-menu-title {
    color: #0f172a !important;
}

body.dark-hero-nav .mega-menu-link:hover .mega-menu-title {
    color: #7c3aed !important;
}

body.dark-hero-nav .mega-menu-desc {
    color: #64748b !important;
}

body.dark-hero-nav .mega-menu-section-label {
    color: #7c3aed !important;
}

/* Chevron on dark nav */
body.dark-hero-nav .nav-link .fa-chevron-down {
    color: rgba(255, 255, 255, 0.6) !important;
}

body.dark-hero-nav .header.scrolled-past-hero .nav-link .fa-chevron-down {
    color: var(--text-tertiary) !important;
}

/* Public Forms Validation UI Styles */
.is-invalid {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.2) !important;
}

.validation-error-msg {
    color: #dc2626 !important;
    font-size: 0.75rem !important;
    display: block !important;
    margin-top: 4px !important;
    font-weight: 500 !important;
}

/* ==========================================
   ADMIN PANEL DARK THEME OVERRIDES
   ========================================== */

/* Dark Theme Variables */
body.dark-theme {
    --bg-primary: #0b0f19;
    --bg-secondary: #070a12;
    --bg-tertiary: #111827;
    --text-primary: #f9fafb;
    --text-secondary: #d1d5db;
    --text-tertiary: #9ca3af;
    --border-color: rgba(255, 255, 255, 0.08);
    --glass-bg: rgba(11, 15, 25, 0.85);
    --glass-border: rgba(255, 255, 255, 0.06);
    --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.35);
    --card-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.25);
    --hover-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.4);
    --accent-glow: rgba(124, 58, 237, 0.3);
}

/* Header logo adjustments for dark mode */
body.dark-theme .logo-main {
    display: none !important;
}
body.dark-theme .logo-white {
    display: inline-block !important;
}

/* Shrunk header background in dark mode */
body.dark-theme .header.shrunk {
    background-color: rgba(11, 15, 25, 0.95) !important;
}

/* Sidebar button styling overrides in dark mode */
body.dark-theme .tab-btn:not(.active) {
    color: var(--text-secondary);
}
body.dark-theme .tab-btn:not(.active):hover {
    background-color: rgba(255, 255, 255, 0.05);
}

/* Form selects dropdown styling in dark mode */
body.dark-theme select.form-control option {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

/* Table element backgrounds inside workspace */
body.dark-theme table tr:hover {
    background-color: var(--bg-secondary) !important;
}

/* Ensure rich text editor modals and popups look great */
body.dark-theme .note-editor .note-modal-header,
body.dark-theme .note-editor .note-modal-footer {
    border-color: var(--border-color) !important;
}

/* ==========================================
   SUCCESS PARTNERS SECTION
   ========================================== */
.success-partners-section {
    background:
        radial-gradient(circle at 12% 20%, rgba(124, 58, 237, 0.08), transparent 34%),
        radial-gradient(circle at 88% 24%, rgba(6, 182, 212, 0.08), transparent 32%),
        linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    padding: 84px 0 76px;
    position: relative;
    border-bottom: 1px solid rgba(124, 58, 237, 0.10);
    overflow: hidden;
}

.success-partners-glow {
    position: absolute;
    width: 420px;
    height: 420px;
    border-radius: 999px;
    pointer-events: none;
    filter: blur(8px);
    opacity: 0.42;
}

.success-partners-glow-left {
    left: -180px;
    top: 36px;
    background: radial-gradient(circle, rgba(124, 58, 237, 0.16), transparent 68%);
}

.success-partners-glow-right {
    right: -160px;
    bottom: -80px;
    background: radial-gradient(circle, rgba(217, 70, 239, 0.14), transparent 70%);
}

.success-partners-container {
    max-width: 1120px;
    position: relative;
    z-index: 2;
}

.success-partners-header {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 40px;
}

.success-partners-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px;
    border-radius: 999px;
    background: rgba(124, 58, 237, 0.07);
    border: 1px solid rgba(124, 58, 237, 0.16);
    color: #7c3aed;
    font-family: var(--font-heading);
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 1.3px;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.success-partners-title {
    font-family: var(--font-heading);
    font-size: 2.75rem;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1.12;
    margin-bottom: 16px;
}

.success-partners-desc {
    color: var(--text-secondary);
    font-size: 1rem;
    line-height: 1.7;
    font-weight: 400;
    margin: 0;
}

.success-partners-showcase {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    align-items: stretch;
    margin-bottom: 28px;
}

.success-logo-cloud {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    padding: 22px;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.76);
    border: 1px solid rgba(226, 232, 240, 0.95);
    box-shadow: 0 18px 45px rgba(124, 58, 237, 0.08);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.success-logo-tile {
    min-height: 82px;
    border-radius: 16px;
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.85);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.success-logo-tile:hover {
    transform: translateY(-3px);
    border-color: rgba(124, 58, 237, 0.22);
    box-shadow: 0 16px 32px rgba(124, 58, 237, 0.10);
}

.success-logo-tile img {
    max-width: 132px;
    max-height: 42px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.success-claude-card {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
    padding: 28px;
    background:
        radial-gradient(circle at 90% 0%, rgba(217, 119, 87, 0.18), transparent 44%),
        linear-gradient(160deg, #fff8f3 0%, #ffffff 58%, #f8fafc 100%);
    border: 1px solid rgba(217, 119, 87, 0.22);
    box-shadow: 0 18px 45px rgba(204, 102, 51, 0.10);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.success-claude-card::before {
    content: "";
    position: absolute;
    inset: 12px;
    border-radius: 20px;
    border: 1px solid rgba(217, 119, 87, 0.12);
    pointer-events: none;
}

.success-claude-topline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #cc6633;
    font-family: var(--font-heading);
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 1.1px;
    text-transform: uppercase;
    margin-bottom: 24px;
}

.success-claude-logo {
    width: min(100%, 220px);
    height: auto;
    margin-bottom: 20px;
}

.success-claude-card p {
    color: #374151;
    font-size: 0.9375rem;
    line-height: 1.65;
    font-weight: 500;
    margin-bottom: 22px;
}

.success-claude-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #cc6633;
    font-family: var(--font-heading);
    font-size: 0.8125rem;
    font-weight: 800;
}

.success-partner-value-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.success-value-card {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.92);
    border-radius: 18px;
    padding: 24px;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.05);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.success-value-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 36px rgba(124, 58, 237, 0.10);
}

.success-value-icon {
    width: 42px;
    height: 42px;
    border-radius: 13px;
    background: var(--grad-glow);
    color: var(--accent-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

.success-value-card h3 {
    font-size: 1.0625rem;
    font-weight: 800;
    color: var(--text-primary);
    margin-bottom: 8px;
}

.success-value-card p {
    font-size: 0.875rem;
    line-height: 1.65;
    color: var(--text-secondary);
    font-weight: 400;
    margin: 0;
}

@media (max-width: 980px) {
    .success-partners-showcase {
        grid-template-columns: 1fr;
    }

    .success-logo-cloud {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .success-claude-card {
        min-height: 260px;
    }
}

@media (max-width: 768px) {
    .success-partners-section {
        padding: 64px 0;
    }

    .success-partners-title {
        font-size: 2.125rem;
    }

    .success-logo-cloud,
    .success-partner-value-grid {
        grid-template-columns: 1fr;
    }

    .success-logo-tile {
        min-height: 74px;
    }
}

@media (max-width: 640px) {
    .success-partners-glow {
        width: 260px;
        height: 260px;
        filter: blur(6px);
        opacity: 0.32;
    }

    .success-partners-glow-left {
        left: 0;
    }

    .success-partners-glow-right {
        right: 0;
        bottom: -40px;
    }
}

/* ─────────────────────────────────────────────────────────── */
/* Redesigned Events & Webinars Section (Inspiration Layout) */
/* ─────────────────────────────────────────────────────────── */
.events-redesigned-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    margin-top: 20px;
}

@media (max-width: 1024px) {
    .events-redesigned-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
}

@media (max-width: 768px) {
    .events-redesigned-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

.event-premium-card {
    display: flex;
    flex-direction: column;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.4s ease;
    height: 100%;
}

.event-premium-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--hover-shadow);
    border-color: var(--accent-blue);
}

.event-card-img-wrapper {
    position: relative;
    width: 100%;
    height: 220px;
    overflow: hidden;
    background-color: #000000;
}

.event-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(100%);
    transition: filter 0.5s ease, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.event-premium-card:hover .event-card-img {
    filter: grayscale(0%);
    transform: scale(1.05);
}

.event-card-badges {
    position: absolute;
    top: 15px;
    left: 15px;
    display: flex;
    gap: 8px;
    z-index: 2;
}

.badge-type {
    font-size: 0.6875rem;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

.badge-type.live {
    background-color: var(--artha-primary-500);
    color: #ffffff;
}

.badge-type.webinar {
    background-color: #a855f7;
    color: #ffffff;
}

.event-card-body {
    padding: 24px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.event-card-title {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.35;
    margin-bottom: 12px;
    color: var(--text-primary);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 54px;
}

.event-card-desc {
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--text-secondary);
    margin-bottom: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 67px;
}

.event-card-divider {
    border: 0;
    border-top: 1px solid var(--border-color);
    margin: 8px 0 20px 0;
}

.event-card-meta {
    margin-top: auto;
}

.meta-label {
    font-family: monospace;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--text-tertiary);
    display: block;
    margin-bottom: 12px;
}

.meta-details {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.meta-detail-item {
    font-size: 0.84375rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.meta-detail-item i {
    color: var(--accent-blue);
    font-size: 0.875rem;
    width: 16px;
    text-align: center;
}

.event-card-footer {
    padding: 0 24px 24px 24px;
    background-color: var(--bg-primary);
}

.event-card-cta {
    font-family: monospace;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    color: var(--accent-blue);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color 0.3s ease, gap 0.3s ease;
    text-transform: uppercase;
}

.event-card-cta:hover {
    color: var(--accent-purple);
    gap: 10px;
}

.cta-arrow {
    font-size: 0.875rem;
    font-weight: 700;
    transition: transform 0.3s ease;
}

.event-premium-card:hover .cta-arrow {
    transform: translateX(4px);
}


/* ============================================================
   WHITEPAPER CARDS — Inspiration-Driven Premium Layout
   ============================================================ */

@media (max-width: 1100px) {
    .events-filter-form {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 768px) {
    .events-listing-hero-grid {
        grid-template-columns: 1fr !important;
        gap: 34px;
        max-width: 100%;
        overflow: hidden;
    }

    .events-listing-hero-grid .hero-title {
        font-size: 2.375rem !important;
        line-height: 1.12;
        overflow-wrap: anywhere;
    }

    .events-listing-hero-grid .hero-content,
    .events-listing-hero-grid .hero-desc {
        max-width: 100%;
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .events-listing-hero-grid .hero-buttons {
        flex-wrap: wrap;
        max-width: 100%;
    }

    .events-listing-hero-grid .hero-visual {
        display: none;
    }

    .events-filter-form {
        grid-template-columns: 1fr !important;
        padding: 16px !important;
    }

    .events-filter-actions {
        flex-direction: column;
    }

    .events-filter-actions .btn {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .events-listing-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .event-card-img-wrapper {
        height: 190px;
    }

    .event-card-body {
        padding: 20px;
    }

    .event-card-title,
    .event-card-desc {
        height: auto;
    }

    .meta-detail-item {
        align-items: flex-start;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        line-height: 1.45;
    }

    .event-card-footer {
        padding: 0 20px 20px;
    }

    .event-card-cta {
        width: 100%;
        justify-content: space-between;
        gap: 10px;
        line-height: 1.35;
        white-space: normal;
    }
}

@media (max-width: 420px) {
    .events-listing-hero-grid .hero-title {
        font-size: 2rem !important;
    }

    .events-listing-hero-grid .hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .events-listing-hero-grid .hero-buttons .btn {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .event-card-badges {
        left: 12px;
        right: 12px;
        flex-wrap: wrap;
    }

    .badge-type {
        max-width: 100%;
        line-height: 1.25;
    }
}

.wp-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 10px;
}

@media (max-width: 1100px) {
    .wp-cards-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 28px;
    }
}

@media (max-width: 680px) {
    .wp-cards-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

/* Card shell */
.wp-card {
    display: flex;
    flex-direction: column;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 32px;
    transition: transform 0.38s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.38s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.3s ease;
    position: relative;
    overflow: hidden;
}

/* Subtle top-edge accent line that appears on hover */
.wp-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--grad-primary);
    opacity: 0;
    transition: opacity 0.35s ease;
    border-radius: 16px 16px 0 0;
}

.wp-card:hover {
    transform: translateY(-7px);
    box-shadow: var(--hover-shadow);
    border-color: rgba(124, 58, 237, 0.3);
}

.wp-card:hover::before {
    opacity: 1;
}

/* Publisher watermark — italic, muted, top of card */
.wp-card-publisher {
    font-family: var(--font-heading);
    font-style: italic;
    font-size: 0.8125rem;
    font-weight: 400;
    color: var(--text-tertiary);
    letter-spacing: 0.2px;
    margin-bottom: 22px;
    display: flex;
    align-items: center;
    gap: 7px;
    opacity: 0.7;
    transition: opacity 0.3s ease;
}

.wp-card:hover .wp-card-publisher {
    opacity: 1;
}

.wp-publisher-icon {
    font-size: 0.75rem;
    color: var(--accent-blue);
    opacity: 0.6;
}

/* Main content body */
.wp-card-body {
    flex-grow: 1;
    margin-bottom: 28px;
}

/* Large bold title — first word (publisher brand) in accent, rest in dark */
.wp-card-title {
    font-family: var(--font-heading);
    font-size: 1.375rem;
    font-weight: 800;
    line-height: 1.35;
    color: var(--text-primary);
    margin-bottom: 16px;
    letter-spacing: -0.3px;
}

.wp-title-highlight {
    color: var(--accent-blue);
    font-weight: 800;
}

/* Summary paragraph */
.wp-card-summary {
    font-size: 0.90625rem;
    line-height: 1.65;
    color: var(--text-secondary);
    font-weight: 300;
}

/* Footer: meta info + CTA pill */
.wp-card-footer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
}

/* Meta row: page count, PDF available */
.wp-meta {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.wp-meta-item {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-tertiary);
    display: inline-flex;
    align-items: center;
    gap: 5px;
    letter-spacing: 0.2px;
}

.wp-meta-item i {
    color: var(--accent-blue);
    font-size: 0.75rem;
    opacity: 0.7;
}

.wp-meta-pdf {
    color: #dc2626;
}

.wp-meta-pdf i {
    color: #dc2626;
    opacity: 1;
}

/* Pill-shaped CTA button — dark background, uppercase monospace */
.wp-card-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: monospace;
    font-size: 0.71875rem;
    font-weight: 700;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    color: var(--text-primary);
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    padding: 10px 24px;
    border-radius: 50px;
    transition: background-color 0.28s ease,
                color 0.28s ease,
                border-color 0.28s ease,
                box-shadow 0.28s ease,
                transform 0.2s ease;
    text-decoration: none;
    white-space: nowrap;
}

.wp-card-cta:hover {
    background: var(--grad-primary);
    color: #ffffff;
    border-color: transparent;
    box-shadow: 0 6px 20px rgba(124, 58, 237, 0.3);
    transform: translateY(-1px);
}

/* ==========================================================================
   Sitewide Public Experience Components
   Applied explicitly to eligible public pages; resource editorial types are
   intentionally excluded.
   ========================================================================== */

.healthcare-microsite {
    --sitewide-accent: #7c3aed;
    --sitewide-accent-dark: #6d28d9;
    --sitewide-accent-light: #f3e8ff;
}

.manufacturing-microsite {
    --sitewide-accent: #f97316;
    --sitewide-accent-dark: #ea580c;
    --sitewide-accent-light: #fff7ed;
}

.bfsi-microsite {
    --sitewide-accent: var(--artha-primary-600);
    --sitewide-accent-dark: #1d4ed8;
    --sitewide-accent-light: #eff6ff;
}

.retail-microsite {
    --sitewide-accent: #0ea5e9;
    --sitewide-accent-dark: #0369a1;
    --sitewide-accent-light: #f0f9ff;
}

.ai-microsite {
    --sitewide-accent: #7c3aed;
    --sitewide-accent-dark: #6d28d9;
    --sitewide-accent-light: #f3e8ff;
}

.claude-partner-announcement {
    background: #fbfaf9;
    border-top: 1px solid #ece7e3;
    border-bottom: 1px solid #ece7e3;
}

.claude-partner-announcement-inner {
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    padding-top: 14px;
    padding-bottom: 14px;
}

.claude-partner-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    flex-shrink: 0;
    padding: 7px 12px 7px 8px;
    background: #ffffff;
    border: 1px solid #ded7d2;
    border-radius: 999px;
}

.claude-partner-mark {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #d65a31;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.claude-partner-badge small,
.claude-partner-badge strong {
    display: block;
    font-family: var(--font-heading);
    line-height: 1.05;
}

.claude-partner-badge small {
    margin-bottom: 3px;
    color: #78716c;
    font-size: 0.5rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.claude-partner-badge strong {
    color: #1c1917;
    font-size: 0.75rem;
    font-weight: 800;
}

.claude-partner-announcement p {
    margin: 0;
    color: #334155;
    font-family: var(--font-heading);
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.45;
}

.claude-partner-announcement p strong {
    color: #1e293b;
    font-weight: 750;
}

.sitewide-lead-modal {
    overflow: hidden !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 16px !important;
}

.sitewide-lead-modal-content {
    width: 100% !important;
    max-width: 760px !important;
    max-height: calc(100vh - 32px) !important;
    max-height: calc(100dvh - 32px) !important;
    margin: 0 !important;
    padding: 28px 32px !important;
    border-radius: 12px !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

.sitewide-modal-close {
    position: absolute !important;
    top: 16px !important;
    right: 16px !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 50% !important;
    background: #f8fafc !important;
    color: #334155 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    float: none !important;
    font-size: 1.375rem !important;
    line-height: 1 !important;
    cursor: pointer;
    z-index: 5;
    transition: color 0.2s, background-color 0.2s, border-color 0.2s, transform 0.2s;
}

.sitewide-modal-close:hover,
.sitewide-modal-close:focus-visible {
    background: var(--sitewide-accent-dark, #6d28d9) !important;
    border-color: var(--sitewide-accent-dark, #6d28d9) !important;
    color: #ffffff !important;
    outline: none;
    transform: scale(1.05);
}

.sitewide-modal-header {
    margin-bottom: 18px !important;
    padding: 0 52px 0 0 !important;
    border-bottom: 0 !important;
    flex-shrink: 0;
}

.sitewide-lead-form {
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 5px;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
}

.sitewide-lead-form::-webkit-scrollbar {
    width: 6px;
}

.sitewide-lead-form::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 999px;
}

.sitewide-lead-form::-webkit-scrollbar-track {
    background: transparent;
}

.sitewide-lead-modal .form-grid-2 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
    margin-bottom: 0 !important;
}

.sitewide-lead-modal .form-field {
    margin-bottom: 12px !important;
}

.sitewide-lead-modal textarea.form-input {
    height: 64px !important;
    min-height: 64px !important;
    resize: vertical;
}

.sitewide-consent-row {
    width: 100% !important;
    height: auto !important;
    margin: 2px 0 0 !important;
    display: grid !important;
    grid-template-columns: 18px minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 10px !important;
    text-align: left;
}

.sitewide-consent-row input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    margin: 1px 0 0 !important;
    accent-color: var(--sitewide-accent, #7c3aed);
}

.sitewide-consent-row label {
    width: auto !important;
    margin: 0 !important;
    color: var(--text-secondary) !important;
    font-size: 0.78125rem !important;
    line-height: 1.45 !important;
    cursor: pointer;
}

.sitewide-form-submit {
    width: 100% !important;
    margin-top: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
}

.sitewide-public-form .sitewide-consent-row {
    margin: 15px 0 !important;
}

.form-checkbox-group.sitewide-consent-row {
    margin: 0 0 24px !important;
}

.sitewide-audience-icon {
    color: var(--sitewide-accent-dark, #334155) !important;
    font-size: 1rem;
}

.manufacturing-microsite .sitewide-audience-icon {
    color: var(--mfg-audience-blue) !important;
}

.sitewide-outcome-icon {
    width: 48px !important;
    height: 48px !important;
    margin-bottom: 15px !important;
    border-radius: 10px !important;
    background: #dcfce7 !important;
    color: #15803d !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1.3125rem !important;
}

.sitewide-challenge-icon {
    background: #fef2f2 !important;
    color: #dc2626 !important;
}

.healthcare-microsite .audience-tabs-nav .audience-tab-btn,
.bfsi-microsite .audience-tabs-nav .audience-tab-btn,
.retail-microsite .audience-tabs-nav .audience-tab-btn,
.ai-microsite .audience-tabs .audience-tab-btn {
    background: transparent !important;
    border: 1px solid transparent !important;
    border-bottom: 3px solid transparent !important;
    color: #334155 !important;
}

.healthcare-microsite .audience-tabs-nav .audience-tab-btn:hover,
.bfsi-microsite .audience-tabs-nav .audience-tab-btn:hover,
.retail-microsite .audience-tabs-nav .audience-tab-btn:hover,
.ai-microsite .audience-tabs .audience-tab-btn:hover {
    background: var(--sitewide-accent-light) !important;
    border-color: color-mix(in srgb, var(--sitewide-accent) 35%, transparent) !important;
    color: var(--sitewide-accent-dark) !important;
}

.healthcare-microsite .audience-tabs-nav .audience-tab-btn.active,
.bfsi-microsite .audience-tabs-nav .audience-tab-btn.active,
.retail-microsite .audience-tabs-nav .audience-tab-btn.active,
.ai-microsite .audience-tabs .audience-tab-btn.active {
    background: var(--sitewide-accent-light) !important;
    border-color: transparent !important;
    border-bottom-color: var(--sitewide-accent) !important;
    color: var(--sitewide-accent-dark) !important;
}

/* Keep solution approach counters circular across industry microsites. */
.healthcare-microsite .framework-layer-item,
.manufacturing-microsite .framework-layer-item,
.bfsi-microsite .framework-layer-item,
.retail-microsite .framework-layer-item {
    align-items: center !important;
}

.healthcare-microsite .framework-layer-item .layer-number,
.manufacturing-microsite .framework-layer-item .layer-number,
.bfsi-microsite .framework-layer-item .layer-number,
.retail-microsite .framework-layer-item .layer-number-retail {
    width: 60px !important;
    min-width: 60px !important;
    height: 60px !important;
    min-height: 60px !important;
    flex: 0 0 60px !important;
    aspect-ratio: 1 / 1;
    border-radius: 50% !important;
    border-right: 0 !important;
    margin-left: 24px !important;
}

@media (max-width: 768px) {
    .claude-partner-announcement-inner {
        min-height: 0;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 12px;
        padding-top: 14px;
        padding-bottom: 14px;
    }

    .claude-partner-announcement p {
        padding-top: 4px;
        font-size: 0.8125rem;
    }

    .sitewide-lead-modal {
        padding: 12px !important;
    }

    .sitewide-lead-modal-content {
        max-height: calc(100vh - 24px) !important;
        max-height: calc(100dvh - 24px) !important;
        padding: 24px 20px 20px !important;
    }

    .sitewide-modal-close {
        top: 10px !important;
        right: 10px !important;
    }

    .sitewide-modal-header {
        padding-right: 46px !important;
    }

    .sitewide-lead-modal .form-grid-2 {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
    }

    .healthcare-microsite .framework-layer-item .layer-number,
    .manufacturing-microsite .framework-layer-item .layer-number,
    .bfsi-microsite .framework-layer-item .layer-number,
    .retail-microsite .framework-layer-item .layer-number-retail {
        width: 48px !important;
        min-width: 48px !important;
        height: 48px !important;
        min-height: 48px !important;
        flex-basis: 48px !important;
        margin-left: 18px !important;
        font-size: 1.125rem !important;
    }
}