/* ==================== DESIGN TOKENS ==================== */
    :root {
        /* Colors — Primary (blue, matches existing codebase) */
        --color-primary: #2563eb;
        --color-primary-dark: #1d4ed8;
        --color-primary-darker: #1e3a8a;
        --color-primary-light: #3b82f6;
        --color-primary-lighter: #dbeafe;

        /* Colors — Secondary */
        --color-secondary: #4b5563;
        --color-secondary-dark: #374151;
        --color-secondary-light: #6b7280;

        /* Colors — Accent (purple/violet brand) */
        --color-accent: #2563EB;
        --color-accent-dark: #1D4ED8;
        --color-accent-light: #60A5FA;

        /* Colors — Grays */
        --color-gray-50: #f9fafb;
        --color-gray-100: #f3f4f6;
        --color-gray-200: #e5e7eb;
        --color-gray-300: #d1d5db;
        --color-gray-400: #9ca3af;
        --color-gray-500: #6b7280;
        --color-gray-600: #4b5563;
        --color-gray-700: #374151;
        --color-gray-800: #1f2937;
        --color-gray-900: #111827;

        /* Colors — Semantic */
        --color-success: #10b981;
        --color-warning: #f59e0b;
        --color-error: #ef4444;
        --color-info: #3b82f6;

        /* Spacing scale (4px base) */
        --space-1: 0.25rem;   /* 4px */
        --space-2: 0.5rem;    /* 8px */
        --space-3: 0.75rem;   /* 12px */
        --space-4: 1rem;      /* 16px */
        --space-5: 1.25rem;   /* 20px */
        --space-6: 1.5rem;    /* 24px */
        --space-8: 2rem;      /* 32px */
        --space-10: 2.5rem;   /* 40px */
        --space-12: 3rem;     /* 48px */
        --space-16: 4rem;     /* 64px */

        /* Border radius */
        --radius-sm: 4px;
        --radius-md: 8px;
        --radius-lg: 12px;
        --radius-xl: 16px;
        --radius-2xl: 20px;
        --radius-full: 9999px;

        /* Shadows */
        --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
        --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
        --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
        --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);

        /* Z-index scale */
        --z-base: 1;
        --z-raised: 10;
        --z-dropdown: 100;
        --z-sticky: 1000;
        --z-overlay: 1500;
        --z-modal: 2000;
        --z-notification: 3000;
        --z-toast: 9999;

        /* Typography scale */
        --text-xs: 0.75rem;     /* 12px */
        --text-sm: 0.875rem;    /* 14px */
        --text-base: 1rem;      /* 16px */
        --text-lg: 1.125rem;    /* 18px */
        --text-xl: 1.25rem;     /* 20px */
        --text-2xl: 1.5rem;     /* 24px */
        --text-3xl: 1.875rem;   /* 30px */
        --text-4xl: 2.25rem;    /* 36px */

        /* Breakpoints (for reference, used in media queries) */
        --bp-sm: 640px;
        --bp-md: 768px;
        --bp-lg: 1024px;
        --bp-xl: 1280px;

        /* Focus ring */
        --focus-ring: 0 0 0 3px rgba(37, 99, 235, 0.4);
        --focus-ring-offset: 0 0 0 2px #ffffff, 0 0 0 4px rgba(37, 99, 235, 0.4);
    }

    /* ==================== FOCUS STATES ==================== */
    .nav-link:focus-visible,
    .nav-dropdown-trigger:focus-visible,
    .dropdown-link:focus-visible {
        outline: none;
        box-shadow: var(--focus-ring);
        border-radius: var(--radius-sm);
    }

    .btn:focus-visible,
    .btn-primary:focus-visible,
    .btn-secondary:focus-visible,
    .btn-outline:focus-visible {
        outline: none;
        box-shadow: var(--focus-ring-offset);
    }

    a:focus-visible {
        outline: 2px solid var(--color-primary);
        outline-offset: 2px;
        border-radius: 2px;
    }

    input:focus-visible,
    select:focus-visible,
    textarea:focus-visible {
        outline: none;
        box-shadow: var(--focus-ring);
    }

    button:focus-visible {
        outline: none;
        box-shadow: var(--focus-ring-offset);
    }

    /* ==================== REDUCED MOTION ==================== */
    @media (prefers-reduced-motion: reduce) {
        *, *::before, *::after {
            animation-duration: 0.01ms !important;
            animation-iteration-count: 1 !important;
            transition-duration: 0.01ms !important;
            scroll-behavior: auto !important;
        }
    }

    /* Reset PicoCSS defaults that might interfere.
       Breadcrumb trails are exempt: they are semantic <nav> elements we DO want
       rendered (the /resources and /glossary hubs were shipping an invisible trail
       alongside their BreadcrumbList JSON-LD). */
    nav:not(.navbar):not(.mobile-nav-items):not([aria-label="Breadcrumb"]) {
        display: none !important;
    }

    footer:not(.footer) {
        display: none !important;
    }

    /* Override PicoCSS container styles */
    body > .container,
    main > .container {
        max-width: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Mobile language section is now a flat grid - no dropdown positioning needed */

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

    /* Force clean background without any gradients */
    html {
        background: #f8f9fa !important;
        background-image: none !important;
        background-color: #f8f9fa !important;
    }

    body {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
        color: #1f2937;
        line-height: 1.6;
        background: #f8f9fa !important;
        background-image: none !important;
        background-color: #f8f9fa !important;
        min-height: 100vh;
        overflow-x: hidden;
    }
    
    
    /* Default heading colors */
    h1, h2, h3, h4, h5, h6 {
        color: #1f2937;
    }
    
    .container {
        max-width: 1280px;
        margin: 0 auto;
        padding: 0 2rem;
    }
    
    /* Centering utilities */
    .center-container {
        max-width: 600px;
        margin: 0 auto;
        padding: 0 2rem;
    }

    .center-card {
        max-width: 500px;
        margin: 3rem auto;
        padding: 3rem;
    }

    /* Credit Cost Badges - Global Styles */
    .free-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        background: linear-gradient(135deg, #10b981 0%, #059669 100%);
        color: white;
        padding: 0.25rem 0.625rem;
        border-radius: 999px;
        font-size: 0.6875rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.02em;
        box-shadow: 0 1px 2px rgba(16, 185, 129, 0.2);
    }

    .credit-cost-indicator {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        background: rgba(37, 99, 235, 0.1);
        color: #3b82f6;
        padding: 0.1875rem 0.5rem;
        border-radius: 999px;
        font-size: 0.625rem;
        font-weight: 600;
        margin-left: 0.5rem;
        white-space: nowrap;
    }

    .free-feature-badge {
        display: inline-flex;
        align-items: center;
        background: linear-gradient(135deg, #10b981 0%, #059669 100%);
        color: white;
        padding: 0.375rem 0.875rem;
        border-radius: 999px;
        font-size: 0.75rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        box-shadow: 0 2px 4px rgba(16, 185, 129, 0.3);
    }

    .credit-action-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
    }
    
    /* ===== NAVIGATION STYLES (v4 redesign) ===== */
    .navbar {
        position: sticky;
        top: 0;
        z-index: var(--z-sticky);
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 1.5rem;
        height: 60px;
        background: white;
        border-bottom: 1px solid #e5e7eb;
        backdrop-filter: blur(12px);
    }

    .nav-content {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        max-width: 100%;
        height: 100%;
        position: relative;
    }

    .nav-logo {
        font-size: 1.5rem;
        font-weight: 800;
        background: linear-gradient(135deg, #2563eb, #1d4ed8);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-decoration: none;
        flex-shrink: 0;
    }

    .beta-badge {
        background: linear-gradient(135deg, #10b981 0%, #059669 100%);
        color: white;
        font-size: 0.625rem;
        font-weight: 600;
        padding: 0.125rem 0.375rem;
        border-radius: 0.25rem;
        letter-spacing: 0.5px;
        text-transform: uppercase;
        position: relative;
        top: -0.5rem;
    }

    /* Nav links row */
    .nav-links {
        display: flex;
        align-items: center;
        list-style: none;
        gap: 0;
        margin: 0;
        padding: 0;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }

    /* Each nav item is a hover-dropdown trigger */
    .nav-item {
        position: relative;
    }

    .nav-trigger {
        display: flex;
        align-items: center;
        gap: 3px;
        padding: 8px 13px;
        font-size: 0.8125rem;
        font-weight: 500;
        color: #374151;
        cursor: pointer;
        border: none;
        background: none;
        border-radius: 6px;
        transition: background 0.15s;
        white-space: nowrap;
        font-family: inherit;
    }

    .nav-trigger:hover {
        background: #f3f4f6;
    }

    .nav-trigger .arr {
        font-size: 0.55rem;
        color: #9ca3af;
    }

    /* Legacy nav-link support (non-authenticated flat links) */
    .nav-link {
        color: #374151;
        text-decoration: none;
        transition: color 0.2s, background 0.15s;
        font-weight: 500;
        font-size: 0.8125rem;
        padding: 8px 13px;
        border-radius: 6px;
        display: inline-flex;
        align-items: center;
    }

    .nav-link:hover {
        color: #2563eb;
        background: #f3f4f6;
    }

    .nav-link.active {
        color: #2563eb;
        font-weight: 600;
    }

    /* Dropdowns - padding-top bridge so mouse can travel from trigger to menu */
    .dropdown {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        padding-top: 4px;
        z-index: 100;
    }

    .dropdown-inner {
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
        min-width: 200px;
        padding: 4px;
    }

    .nav-item:hover > .dropdown {
        display: block;
    }

    .dd-link {
        display: block;
        padding: 7px 12px;
        font-size: 0.8125rem;
        color: #374151;
        border-radius: 6px;
        transition: background 0.12s;
        white-space: nowrap;
        text-decoration: none;
    }

    .dd-link:hover {
        background: #f3f4f6;
    }

    .dd-link.active {
        background: #eff6ff;
        color: #2563eb;
        font-weight: 600;
    }

    .dd-sep {
        height: 1px;
        background: #e5e7eb;
        margin: 4px 0;
    }

    /* Legacy dropdown-menu / dropdown-link support (kept for backward compat) */
    .dropdown-menu {
        display: none;
        position: absolute;
        right: 0;
        top: 100%;
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
        min-width: 160px;
        z-index: var(--z-sticky);
        padding: 4px;
    }

    .dropdown-link {
        display: block;
        padding: 7px 12px;
        color: #374151;
        text-decoration: none;
        font-size: 0.8125rem;
        border-radius: 6px;
        transition: background 0.12s;
    }

    .dropdown-link:hover {
        background: #f3f4f6;
        color: #2563eb;
    }

    .dropdown-link.active {
        background: #eff6ff;
        color: #2563eb;
        font-weight: 600;
    }

    .dropdown-link.active:hover {
        background: #dbeafe;
        color: #1d4ed8;
    }

    /* Legacy dropdown trigger classes */
    .nav-item-dropdown,
    .nav-insights-dropdown,
    .nav-aidocs-dropdown,
    .nav-tenders-dropdown,
    .nav-subscription-dropdown,
    .nav-tools-dropdown,
    .nav-info-dropdown {
        position: relative;
        display: inline-flex;
        align-items: center;
    }

    .nav-dropdown-trigger {
        color: #374151;
        font-weight: 500;
        font-size: 0.8125rem;
        cursor: pointer;
        padding: 8px 13px;
        border-radius: 6px;
        transition: background 0.15s;
        display: inline-flex;
        align-items: center;
        gap: 3px;
    }

    .nav-dropdown-arrow {
        font-size: 0.55rem;
        color: #9ca3af;
        margin-left: 2px;
        transition: transform 0.2s ease;
    }

    .nav-item-dropdown:hover .nav-dropdown-arrow {
        transform: rotate(180deg);
    }

    .nav-dropdown-trigger:hover {
        background: #f3f4f6;
    }

    .nav-item-dropdown:hover .dropdown-menu,
    .nav-insights-dropdown:hover .dropdown-menu,
    .nav-aidocs-dropdown:hover .dropdown-menu,
    .nav-tenders-dropdown:hover .dropdown-menu,
    .nav-subscription-dropdown:hover .dropdown-menu,
    .nav-tools-dropdown:hover .dropdown-menu,
    .nav-info-dropdown:hover .dropdown-menu {
        display: block;
    }

    .nav-dropdown-menu {
        left: 0;
        right: auto;
        min-width: 200px;
    }

    .dropdown-icon {
        margin-right: 0.5rem;
        font-size: 1rem;
    }

    /* ===== RIGHT SIDE ICONS ===== */
    .nav-right {
        display: flex;
        align-items: center;
        gap: 6px;
        flex-shrink: 0;
    }

    /* Auth links (Login / Sign Up) in nav-right */
    .nav-right .auth-link {
        font-size: 0.8125rem;
        font-weight: 500;
        padding: 7px 14px;
        border-radius: 6px;
        white-space: nowrap;
        transition: all 0.15s;
        color: #2563eb;
        border: 1px solid #2563eb;
    }
    .nav-right .auth-link:hover {
        background: #eff6ff;
    }
    .nav-right .auth-link.btn-primary {
        background: #2563eb;
        color: white;
        font-weight: 600;
    }
    .nav-right .auth-link.btn-primary:hover {
        background: #1d4ed8;
    }

    /* Credits link */
    .credits-link {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 6px 12px;
        font-size: 0.775rem;
        font-weight: 500;
        color: #475569;
        border-radius: 6px;
        transition: all 0.15s;
        cursor: pointer;
        white-space: nowrap;
        border: 1px solid #e2e8f0;
        background: #f8fafc;
        text-decoration: none;
    }

    .credits-link:hover {
        background: #eff6ff;
        border-color: #bfdbfe;
    }

    .credits-link svg {
        width: 14px;
        height: 14px;
        color: #3b82f6;
        flex-shrink: 0;
    }

    .credits-link .val {
        font-weight: 700;
        color: #1e293b;
        font-variant-numeric: tabular-nums;
    }

    .credits-link .add-text {
        color: #2563eb;
        font-weight: 600;
    }

    /* Icon dropdown wrapper */
    .icon-dw {
        position: relative;
    }

    .icon-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 34px;
        height: 34px;
        color: #6b7280;
        border-radius: 6px;
        transition: all 0.15s;
        position: relative;
        cursor: pointer;
        border: none;
        background: none;
    }

    .icon-btn:hover {
        background: #f3f4f6;
        color: #374151;
    }

    .icon-btn svg {
        width: 18px;
        height: 18px;
    }

    .badge-red {
        position: absolute;
        top: 3px;
        right: 3px;
        min-width: 16px;
        height: 16px;
        background: #ef4444;
        border-radius: 999px;
        border: 2px solid white;
        font-size: 0.6rem;
        font-weight: 700;
        color: white;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 3px;
    }

    .badge-dot {
        position: absolute;
        top: 5px;
        right: 5px;
        width: 8px;
        height: 8px;
        background: #ef4444;
        border-radius: 50%;
        border: 2px solid white;
    }

    /* Icon dropdown panel - with padding bridge */
    .icon-dd {
        display: none;
        position: absolute;
        top: 100%;
        right: 0;
        padding-top: 6px;
        z-index: 200;
    }

    .icon-dd-inner {
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
        min-width: 220px;
        padding: 6px;
    }

    .icon-dw:hover > .icon-dd {
        display: block;
    }

    .icon-dd-header {
        padding: 8px 12px;
        font-size: 0.75rem;
        font-weight: 600;
        color: #6b7280;
        border-bottom: 1px solid #f3f4f6;
        margin-bottom: 4px;
    }

    .icon-dd-empty {
        padding: 12px;
        font-size: 0.8rem;
        color: #9ca3af;
        text-align: center;
    }

    /* Shared dropdown link style (icon panels) */
    .ddl {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 7px 12px;
        font-size: 0.8125rem;
        color: #374151;
        border-radius: 6px;
        transition: background 0.12s;
        text-decoration: none;
    }

    .ddl:hover {
        background: #f3f4f6;
    }

    .ddl svg {
        width: 16px;
        height: 16px;
        color: #6b7280;
        flex-shrink: 0;
    }

    .ddl.danger {
        color: #dc2626;
    }

    .ddl.danger:hover {
        background: #fef2f2;
    }

    .ddl.danger svg {
        color: #dc2626;
    }

    .dd-section-label {
        font-size: 0.65rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: #9ca3af;
        padding: 8px 12px 4px;
    }

    .dd-user-header {
        padding: 10px 12px 8px;
        border-bottom: 1px solid #f3f4f6;
        margin-bottom: 4px;
    }

    .dd-user-name {
        font-size: 0.875rem;
        font-weight: 600;
        color: #1f2937;
    }

    .dd-user-email {
        font-size: 0.75rem;
        color: #6b7280;
        margin-top: 1px;
    }

    /* Language dropdown */
    .lang-dw {
        position: relative;
    }

    .lang-btn {
        display: flex;
        align-items: center;
        gap: 4px;
        padding: 5px 8px;
        font-size: 0.75rem;
        font-weight: 500;
        border: none;
        border-radius: 6px;
        cursor: pointer;
        color: #374151;
        background: transparent;
        transition: all 0.15s;
        white-space: nowrap;
        font-family: inherit;
    }

    .lang-btn:hover {
        background: #f3f4f6;
    }

    .lang-btn .flag {
        font-size: 0.9rem;
        line-height: 1;
    }

    .lang-btn .arr {
        font-size: 0.5rem;
        color: #9ca3af;
    }

    .lang-dd {
        display: none;
        position: absolute;
        top: 100%;
        right: 0;
        padding-top: 4px;
        z-index: 200;
    }

    .lang-dd-inner {
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
        min-width: 155px;
        padding: 4px;
    }

    .lang-dw:hover > .lang-dd {
        display: block;
    }

    .lang-opt {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 7px 12px;
        font-size: 0.8125rem;
        color: #374151;
        border-radius: 6px;
        transition: background 0.12s;
        cursor: pointer;
        white-space: nowrap;
        text-decoration: none;
    }

    .lang-opt:hover {
        background: #f3f4f6;
    }

    .lang-opt.active {
        background: #eff6ff;
        color: #2563eb;
        font-weight: 600;
    }

    .lang-opt .flag {
        font-size: 1rem;
        line-height: 1;
    }

    /* User Dropdown (legacy) */
    .nav-user-dropdown {
        position: relative;
        display: inline-block;
    }

    .nav-user-name {
        color: #374151;
        font-weight: 500;
        font-size: 0.875rem;
        cursor: pointer;
        padding: 0.5rem;
        border-radius: 0.375rem;
        transition: background-color 0.2s;
    }

    .nav-user-name:hover {
        background-color: #f3f4f6;
    }

    .nav-user-dropdown:hover .dropdown-menu {
        display: block;
    }

    /* ===== MOBILE STYLES ===== */
    .mobile-toggle {
        display: none;
        width: 40px;
        height: 40px;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        background: white;
        cursor: pointer;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
    }

    .mobile-toggle span {
        display: block;
        width: 18px;
        height: 2px;
        background: #374151;
        border-radius: 1px;
        transition: all 0.3s;
    }

    .mobile-toggle.open {
        display: none;
    }

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

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

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

    /* Drawer must sit ABOVE the cookie consent banner (z-index 9999),
       otherwise the banner covers the drawer's bottom CTA buttons on mobile. */
    .mobile-backdrop {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.5);
        backdrop-filter: blur(4px);
        z-index: 10000;
    }

    .mobile-backdrop.open {
        display: block;
    }

    .mobile-drawer {
        position: fixed;
        top: 0;
        left: 0;
        width: 85%;
        max-width: 340px;
        height: 100dvh;
        background: white;
        z-index: 10001;
        transform: translateX(-100%);
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        box-shadow: 2px 0 20px rgba(0, 0, 0, 0.15);
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }

    .mobile-drawer.open {
        transform: translateX(0);
    }

    .m-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 14px 16px;
        border-bottom: 1px solid #e5e7eb;
        flex-shrink: 0;
    }

    .m-close {
        width: 32px;
        height: 32px;
        border: none;
        background: none;
        cursor: pointer;
        border-radius: 6px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.25rem;
        color: #6b7280;
        transition: all 0.15s;
    }

    .m-close:hover {
        background: #f3f4f6;
        color: #374151;
    }

    .m-body {
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .m-credits {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 16px;
        background: #f0f7ff;
        border-bottom: 1px solid #bfdbfe;
    }

    .m-credits .left {
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .m-credits .left svg {
        width: 16px;
        height: 16px;
        color: #3b82f6;
    }

    .m-credits .left span {
        font-size: 0.8125rem;
        font-weight: 600;
        color: #1e3a5f;
    }

    .m-credits .add-btn {
        display: flex;
        align-items: center;
        gap: 4px;
        padding: 7px 14px;
        background: #2563eb;
        color: white;
        font-size: 0.8rem;
        font-weight: 600;
        border-radius: 8px;
        border: none;
        cursor: pointer;
        text-decoration: none;
    }

    .m-icon-row {
        display: flex;
        align-items: center;
        gap: 2px;
        padding: 8px 16px;
        border-bottom: 1px solid #e5e7eb;
        background: #fafbfc;
    }

    .m-icon-link {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 8px 12px;
        font-size: 0.8125rem;
        font-weight: 500;
        color: #374151;
        border-radius: 6px;
        flex: 1;
        justify-content: center;
        transition: background 0.12s;
        text-decoration: none;
    }

    .m-icon-link:hover {
        background: #f3f4f6;
    }

    .m-icon-link svg {
        width: 16px;
        height: 16px;
        color: #6b7280;
    }

    .m-badge {
        font-size: 0.65rem;
        font-weight: 700;
        background: #ef4444;
        color: white;
        border-radius: 999px;
        min-width: 16px;
        height: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 4px;
    }

    /* Mobile nav sections with expandable submenus */
    .m-section-trigger {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 11px 16px;
        font-weight: 500;
        font-size: 0.875rem;
        color: #1f2937;
        cursor: pointer;
        border-left: 3px solid transparent;
        border-bottom: 1px solid #f3f4f6;
        transition: all 0.15s;
    }

    .m-section-trigger:hover {
        background: #f9fafb;
        border-left-color: #3b82f6;
    }

    .m-section-trigger .arr {
        font-size: 0.6rem;
        color: #9ca3af;
        transition: transform 0.2s;
    }

    .m-section-trigger.open .arr {
        transform: rotate(180deg);
    }

    .m-section-body {
        display: none;
        background: #f9fafb;
    }

    .m-section-body.open {
        display: block;
    }

    .m-sub-link {
        display: block;
        padding: 9px 16px 9px 28px;
        font-size: 0.8125rem;
        color: #4b5563;
        border-bottom: 1px solid #f3f4f6;
        transition: background 0.12s;
        text-decoration: none;
    }

    .m-sub-link:hover {
        background: #f3f4f6;
    }

    .m-sub-link:last-child {
        border-bottom: none;
    }

    .m-sub-sep {
        height: 1px;
        background: #e5e7eb;
        margin: 2px 16px;
    }

    .m-account {
        padding: 12px 16px;
        border-top: 1px solid #e5e7eb;
        background: #f9fafb;
    }

    .m-account-label {
        font-size: 0.65rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #9ca3af;
        margin-bottom: 6px;
    }

    .m-account-link {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 0;
        font-size: 0.8125rem;
        font-weight: 500;
        color: #374151;
        text-decoration: none;
    }

    .m-account-link svg {
        width: 16px;
        height: 16px;
        color: #6b7280;
    }

    .m-account-link.danger {
        color: #dc2626;
        margin-top: 4px;
        padding-top: 12px;
        border-top: 1px solid #e5e7eb;
    }

    .m-account-link.danger svg {
        color: #dc2626;
    }

    .m-lang {
        padding: 10px 16px;
        border-top: 1px solid #e5e7eb;
        background: #f9fafb;
        flex-shrink: 0;
    }

    .m-lang-label {
        font-size: 0.65rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #9ca3af;
        margin-bottom: 6px;
    }

    .m-lang-select {
        width: 100%;
        padding: 10px 32px 10px 12px;
        font-size: 0.8125rem;
        font-weight: 500;
        color: #374151;
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        cursor: pointer;
        appearance: none;
        -webkit-appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 12px center;
        font-family: inherit;
    }

    /* Mobile auth section (non-authenticated) */
    .m-auth-section {
        padding: 12px 16px;
        border-top: 1px solid #e5e7eb;
        background: #f9fafb;
        flex-shrink: 0;
    }

    .m-auth-btn {
        display: block;
        width: 100%;
        padding: 10px 16px;
        margin-bottom: 8px;
        border: none;
        border-radius: 8px;
        font-weight: 600;
        font-size: 0.8125rem;
        text-decoration: none;
        text-align: center;
        transition: all 0.2s;
        cursor: pointer;
    }

    .m-auth-btn-primary {
        background: #2563eb;
        color: white;
    }

    .m-auth-btn-primary:hover {
        background: #1d4ed8;
    }

    .m-auth-btn-secondary {
        background: white;
        color: #374151;
        border: 1px solid #e5e7eb;
    }

    .m-auth-btn-secondary:hover {
        background: #f9fafb;
    }

    /* Responsive: hide desktop nav on mobile, show hamburger */
    @media (max-width: 1024px) {
        .nav-links {
            display: none !important;
        }

        .mobile-toggle {
            display: flex;
        }

        .credits-link,
        .icon-dw,
        .lang-dw,
        .auth-link {
            display: none;
        }
    }

    /* Compact navbar on shorter viewports */
    @media (max-height: 800px) {
        .navbar {
            height: 52px;
        }

        .nav-logo {
            font-size: 1.3rem;
        }

        .nav-trigger {
            font-size: 0.75rem;
            padding: 6px 10px;
        }

        .nav-dropdown-trigger {
            font-size: 0.75rem;
            padding: 6px 10px;
        }
    }

    /* Compact navbar on narrower desktop screens */
    @media (max-width: 1200px) and (min-width: 1025px) {
        .nav-logo {
            font-size: 1.3rem;
        }

        .nav-trigger {
            font-size: 0.75rem;
            padding: 6px 10px;
        }

        .nav-dropdown-trigger {
            font-size: 0.75rem;
            padding: 6px 10px;
        }

        .credits-link {
            padding: 5px 8px;
            font-size: 0.7rem;
        }
    }

    /* Button Styles */
    .btn {
        padding: 0.5rem 1rem;
        border-radius: 0.375rem;
        font-weight: 600;
        text-decoration: none;
        display: inline-block;
        transition: all 0.2s;
        border: none;
        cursor: pointer;
        font-size: 0.8125rem;
        letter-spacing: 0.025em;
        line-height: 1.5;
    }
    
    
    
    .btn-outline {
        background: transparent;
        color: #2563eb;
        border: 2px solid #2563eb;
    }
    
    .btn-outline:hover {
        background: #2563eb;
        color: #ffffff;
    }
    
    /* Hero Section */
    .hero {
        padding: 6rem 0;
        text-align: center;
        background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%);
    }
    
    .hero-title {
        font-size: 3.5rem;
        font-weight: 800;
        margin-bottom: 1.5rem;
        color: #111827;
        letter-spacing: -0.025em;
        line-height: 1.1;
    }
    
    .hero-gradient {
        background: linear-gradient(135deg, #2563eb 0%, #2563eb 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }
    
    .hero-subtitle {
        font-size: 1.25rem;
        color: #4b5563;
        margin-bottom: 3rem;
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
        line-height: 1.6;
        font-weight: 400;
    }
    
    .hero-badge {
        display: flex;
        justify-content: center;
        margin-bottom: 1.5rem;
    }
    
    /* Problem/Solution Cards */
    .problem-card {
        background: white;
        padding: 2rem;
        border-radius: 12px;
        text-align: center;
        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
        transition: transform 0.2s;
    }
    
    .problem-card:hover {
        transform: translateY(-2px);
    }
    
    .solution-card {
        background: white;
        padding: 2rem;
        border-radius: 12px;
        text-align: center;
        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
        transition: transform 0.2s;
    }
    
    .solution-card:hover {
        transform: translateY(-2px);
    }
    
    /* Testimonial Cards */
    .testimonial-card {
        background: white;
        padding: 2rem;
        border-radius: 12px;
        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
        transition: transform 0.2s;
    }
    
    .testimonial-card:hover {
        transform: translateY(-2px);
    }
    
    /* Professional Icon Containers */
    .icon-container {
        width: 60px;
        height: 60px;
        background: #f3f4f6;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 1rem;
        border: 2px solid #e5e7eb;
        position: relative;
    }
    
    .solution-icon {
        width: 60px;
        height: 60px;
        background: #dbeafe;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 1rem;
        border: 2px solid #3b82f6;
        position: relative;
    }
    
    /* Enhanced Typography */
    .hero-title {
        font-size: 3.5rem;
        font-weight: 800;
        margin-bottom: 1.5rem;
        color: #111827;
        letter-spacing: -0.025em;
        line-height: 1.1;
    }
    
    @media (max-width: 768px) {
        .hero-title {
            font-size: 2.5rem;
        }
    }
    
    /* Professional spacing and layout */
    .stats-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 2rem;
        margin: 3rem 0;
    }
    
    .features-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 2rem;
        margin: 2rem 0;
    }
    
    /* Enhanced buttons */
    .btn-primary {
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        color: white;
        font-weight: 600;
        padding: 0.625rem 1.25rem;
        border-radius: var(--radius-md);
        text-decoration: none;
        display: inline-block;
        transition: all 0.3s ease;
        border: none;
        cursor: pointer;
        box-shadow: 0 4px 14px 0 rgba(37, 99, 235, 0.3);
    }
    
    .btn-primary:hover {
        background: linear-gradient(135deg, #1d4ed8 0%, #1e3a8a 100%);
        transform: translateY(-2px);
        box-shadow: 0 8px 25px 0 rgba(37, 99, 235, 0.4);
    }
    
    .btn-secondary {
        padding: 0.625rem 1.25rem;
        font-size: 1rem;
        font-weight: 600;
        color: #4b5563;
        background: #ffffff;
        border: 2px solid #e5e7eb;
        border-radius: var(--radius-md);
        text-decoration: none;
        display: inline-block;
        transition: all 0.3s ease;
        cursor: pointer;
        box-sizing: border-box;
    }
    
    .btn-secondary:hover {
        background: #f8fafc;
        border-color: #d1d5db;
        color: #374151;
        transform: translateY(-2px);
        box-shadow: 0 8px 20px rgba(107, 114, 128, 0.15);
    }
    
    .btn-secondary:active {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(107, 114, 128, 0.15);
    }
    
    /* Card Styles */
    .card {
        background: #ffffff;
        border-radius: var(--radius-xl);
        padding: 2.5rem;
        box-shadow: 0 1px 3px rgba(0,0,0,0.08);
        transition: all 0.3s;
        border: 1px solid #f3f4f6;
    }
    
    .card:hover {
        box-shadow: 0 8px 24px rgba(0,0,0,0.12);
        transform: translateY(-2px);
    }
    
    .card-bordered {
        border: 2px solid #e5e7eb;
    }
    
    /* Stats Grid */
    .stats-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
        gap: 2rem;
        margin: 4rem 0;
    }
    
    .stat-card {
        text-align: center;
        padding: 2.5rem;
        background: #ffffff;
        border-radius: 1.25rem;
        border: 1px solid #e5e7eb;
    }
    
    .stat-number {
        font-size: 3rem;
        font-weight: 800;
        background: linear-gradient(135deg, #2563eb 0%, #2563eb 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        margin-bottom: 0.5rem;
        letter-spacing: -1px;
    }
    
    .stat-label {
        color: #4b5563;
        font-size: 0.875rem;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        font-weight: 600;
    }
    
    /* Features Grid */
    .features-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 2.5rem;
        margin: 4rem 0;
    }
    
    .feature-card {
        text-align: left;
        padding: 2rem;
        min-width: 320px;
        width: 100%;
    }
    
    .feature-card .feature-title {
        font-size: 1.125rem;
        font-weight: 600;
        color: #1f2937;
        margin-bottom: 0.75rem;
        line-height: 1.3;
    }
    
    .feature-card .feature-description {
        font-size: 0.875rem;
        color: #6b7280;
        line-height: 1.6;
        margin: 0;
        word-break: normal;
        overflow-wrap: break-word;
    }
    
    .feature-icon {
        width: 56px;
        height: 56px;
        background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
        border-radius: 1rem;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 1.5rem;
        font-weight: 500;
        font-size: 0.875rem;
        color: #3b82f6;
        border: 1px solid #dbeafe;
    }
    
    .feature-title {
        font-size: 1.125rem;
        font-weight: 600;
        margin-bottom: 0.75rem;
        color: #111827;
        letter-spacing: -0.025em;
    }
    
    .feature-description {
        color: #4b5563;
        line-height: 1.6;
        font-size: 0.875rem;
    }
    
    /* Tenders Grid Layout */
    .tenders-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
        gap: 1.5rem;
        margin-bottom: 2rem;
    }
    
    /* Dashboard specific grid - 2 columns */
    .dashboard .tenders-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* Matching page grid - 2 columns */
    .matching-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
        margin-bottom: 2rem;
    }
    
    
    @media (max-width: 768px) {
        .tenders-grid,
        .dashboard .tenders-grid,
        .matching-grid {
            grid-template-columns: 1fr;
        }
        
        .filter-row {
            flex-direction: column;
        }
        
        .filter-item {
            width: 100%;
            max-width: none !important;
        }
    }
    
    /* Enhanced Tender Card Styles */
    .tender-card-enhanced {
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 1.5rem;
        margin-bottom: 0;
        transition: all 0.3s ease;
        height: 100%;
        display: flex;
        flex-direction: column;
        background: white;
        position: relative;
        overflow: hidden;
    }

    .tender-card-enhanced::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: linear-gradient(90deg, #2563eb 0%, #2563eb 100%);
    }

    .tender-card-enhanced:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
        border-color: #bfdbfe;
    }

    /* Legacy tender card (keep for compatibility) */
    .tender-card {
        border-left: 4px solid #2563eb;
        margin-bottom: 0;
        transition: all 0.3s;
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    .tender-card:hover {
        border-left-color: #2563eb;
    }
    
    .tender-header {
        display: flex;
        justify-content: space-between;
        align-items: start;
        margin-bottom: 1.25rem;
    }
    
    .tender-title {
        font-size: 1.25rem;
        font-weight: 600;
        color: #111827;
        margin-bottom: 0.75rem;
        letter-spacing: -0.025em;
        line-height: 1.4;
    }
    
    .tender-meta {
        display: flex;
        gap: 2rem;
        flex-wrap: wrap;
        color: #4b5563;
        font-size: 0.9rem;
    }
    
    .tender-meta-item {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }
    
    .tender-badge {
        padding: 0.25rem 0.75rem;
        border-radius: 9999px;
        font-size: 0.75rem;
        font-weight: 600;
        display: inline-block;
        letter-spacing: 0.025em;
    }
    
    .badge-urgent {
        background: #fee2e2;
        color: #dc2626;
        border: 1px solid #fecaca;
    }
    
    .badge-new {
        background: #dcfce7;
        color: #16a34a;
        border: 1px solid #bbf7d0;
    }
    
    .badge-country {
        background: #f3f4f6;
        color: #4b5563;
        border: 1px solid #e5e7eb;
    }
    
    .badge-match {
        background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
        color: #2563eb;
        border: 1px solid #bfdbfe;
        font-weight: 700;
    }

    /* Enhanced Tender Card Component Styles */
    .tender-category-badge {
        padding: 0.25rem 0.75rem;
        border-radius: 9999px;
        font-size: 0.75rem;
        font-weight: 600;
        letter-spacing: 0.025em;
        display: inline-block;
    }

    .tender-badges-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 0.75rem;
    }

    .tender-badges-row {
        display: flex;
        gap: 0.5rem;
        flex-wrap: wrap;
        align-items: center;
    }

    .badge-urgent-new {
        background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
        color: #dc2626;
        border: 1px solid #f87171;
        animation: pulse 2s infinite;
    }

    @keyframes pulse {
        0%, 100% { opacity: 1; }
        50% { opacity: 0.8; }
    }

    .badge-expired {
        background: #f3f4f6;
        color: #6b7280;
        border: 1px solid #d1d5db;
    }

    .badge-closing-soon {
        background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
        color: #d97706;
        border: 1px solid #f59e0b;
    }

    .badge-eu {
        background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
        color: #1e40af;
        border: 1px solid #3b82f6;
    }

    .badge-green {
        background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%);
        color: #059669;
        border: 1px solid #10b981;
    }

    .badge-negotiable {
        background: linear-gradient(135deg, #f3e8ff 0%, #bfdbfe 100%);
        color: #2563eb;
        border: 1px solid #3b82f6;
    }

    .badge-municipal {
        background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
        color: #92400e;
        border: 1px solid #f59e0b;
    }

    .badge-match-score {
        background: linear-gradient(135deg, #fef7cd 0%, #fef3c7 100%);
        color: #d97706;
        border: 1px solid #f59e0b;
        font-weight: 700;
    }

    .tender-title-enhanced {
        font-size: 1.375rem;
        font-weight: 700;
        color: #111827;
        line-height: 1.3;
        margin-bottom: 0.5rem;
        letter-spacing: -0.025em;
    }

    .tender-organization {
        color: #6b7280;
        font-size: 0.95rem;
        font-weight: 500;
        margin: 0;
    }

    .tender-details-section {
        background: #f8fafc;
        border-radius: 8px;
        padding: 1rem;
        border: 1px solid #e2e8f0;
    }

    .tender-details-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
        margin-bottom: 0.75rem;
    }

    .tender-details-grid:last-child {
        margin-bottom: 0;
    }

    .tender-detail-item {
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

    .tender-icon {
        font-size: 1.125rem;
        opacity: 0.8;
    }

    .tender-detail-content {
        flex: 1;
        min-width: 0;
    }

    .tender-detail-label {
        font-size: 0.75rem;
        font-weight: 600;
        color: #6b7280;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin-bottom: 0.125rem;
    }

    .tender-detail-value {
        font-size: 0.875rem;
        font-weight: 600;
        color: #111827;
        word-break: break-word;
    }

    .tender-description {
        color: #6b7280;
        font-size: 0.925rem;
        line-height: 1.5;
        margin: 1.5rem 0;
        flex-grow: 1;
    }

    .tender-actions {
        display: flex;
        gap: 0.75rem;
        margin-top: auto;
        padding-top: 1rem;
        align-items: stretch; /* Ensure all buttons stretch to same height */
    }

    .tender-actions-vertical {
        display: flex;
        flex-direction: column;
        margin-top: auto;
        padding-top: 1rem;
        gap: 0;
    }

    /* Base button styles - shared properties for all tender buttons */
    .btn-tender-primary,
    .btn-tender-secondary,
    .btn-tender-success {
        /* Uniform box model */
        box-sizing: border-box;
        padding: 0.75rem 1rem;
        border: 2px solid transparent;
        border-radius: 8px;

        /* Uniform dimensions */
        min-height: 44px;
        height: 44px;

        /* Flexbox for perfect centering */
        display: flex;
        align-items: center;
        justify-content: center;

        /* Typography */
        font-weight: 600;
        font-size: 0.875rem;
        text-align: center;
        text-decoration: none;
        white-space: nowrap;

        /* Interaction */
        cursor: pointer;
        transition: all 0.2s ease;

        /* Prevent text overflow */
        text-overflow: ellipsis;
        overflow: hidden;
    }

    /* Primary button - blue gradient */
    .btn-tender-primary {
        background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
        color: white;
        border-color: transparent;
    }

    .btn-tender-primary:hover {
        background: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%);
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
    }

    /* Secondary button - white with border */
    .btn-tender-secondary {
        background: white;
        color: #6b7280;
        border-color: #e5e7eb;
    }

    /* Card icon buttons (pencil note, chat bubble) */
    .tender-card-icon-btn {
        width: 32px;
        height: 32px;
        border-radius: 0.375rem;
        background: #f1f5f9;
        border: none;
        color: #64748b;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 0.8125rem;
        transition: all 0.2s;
        text-decoration: none;
        padding: 0;
        flex-shrink: 0;
    }

    .tender-card-icon-btn:hover {
        background: #e2e8f0;
        color: #1e293b;
    }

    /* Add to Pipeline button */
    .btn-add-pipeline {
        padding: 0.375rem 1rem;
        background: #2563eb;
        color: white;
        border: none;
        border-radius: 0.5rem;
        font-size: 0.8125rem;
        font-weight: 700;
        cursor: pointer;
        transition: all 0.2s;
        white-space: nowrap;
    }

    .btn-add-pipeline:hover {
        background: #1d4ed8;
        box-shadow: 0 2px 8px rgba(37, 99, 235, 0.3);
    }

    .btn-add-pipeline.saved {
        background: #059669;
    }

    .btn-add-pipeline.saved:hover {
        background: #047857;
    }

    .btn-tender-secondary:hover {
        background: #f9fafb;
        border-color: #d1d5db;
        color: #374151;
    }

    /* Success button - green (saved state) */
    .btn-tender-success {
        background: #16a34a;
        color: white;
        border-color: #16a34a;
    }

    .btn-tender-success:hover {
        background: #15803d;
        border-color: #15803d;
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(22, 163, 74, 0.3);
    }

    /* Uniform sizing helper - now just for flex properties */
    .btn-tender-uniform {
        flex: 1 1 0%; /* flex-grow: 1, flex-shrink: 1, flex-basis: 0% */
        min-width: 0;
        width: 100%; /* Ensure button fills its container */
    }

    /* Responsive adjustments for enhanced cards */
    @media (max-width: 768px) {
        .tender-details-grid {
            grid-template-columns: 1fr;
            gap: 0.75rem;
        }

        .tender-badges-header {
            flex-direction: column;
            align-items: flex-start;
        }

        .tender-actions {
            flex-direction: column;
        }

        .btn-tender-primary {
            flex: none;
        }
    }

    /* Loading States for HTMX */
    .htmx-indicator {
        display: none;
    }

    .htmx-request .htmx-indicator {
        display: inline;
    }

    .htmx-request.htmx-indicator {
        display: inline;
    }

    /* Loading overlay for results */
    .results-loading {
        position: relative;
    }

    .results-loading::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(255, 255, 255, 0.8);
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 10;
    }

    .loading-spinner {
        width: 40px;
        height: 40px;
        border: 4px solid #f3f4f6;
        border-top: 4px solid #2563eb;
        border-radius: 50%;
        animation: spin 1s linear infinite;
    }

    @keyframes spin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }

    /* Enhanced results container */
    #results-container {
        min-height: 400px;
        transition: all 0.3s ease;
    }

    /* Improved filter bar styling */
    .filter-bar {
        background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 1.5rem;
        margin-bottom: 2rem;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    }

    /* Enhanced pagination */
    .btn-page:hover:not(.active):not(:disabled) {
        background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
        border-color: #cbd5e1;
        color: #475569;
        transform: translateY(-1px);
    }

    .btn-page.active {
        background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
        color: white;
        border-color: #2563eb;
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
    }

    /* Improved search input */
    .tender-search-input {
        background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
        border: 2px solid #e2e8f0;
        transition: all 0.3s ease;
    }

    .tender-search-input:focus {
        background: white;
        border-color: #2563eb;
        box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1);
        transform: translateY(-1px);
    }

    /* Results count styling */
    .results-count {
        background: white;
        padding: 1rem 1.5rem;
        border-radius: 8px;
        border: 1px solid #e2e8f0;
        margin: 2rem 0 1.5rem;
        font-weight: 600;
        color: #374151;
    }
    
    /* Tender Search Styles */
    .tender-search-wrapper {
        position: relative;
        width: 100%;
    }
    
    .tender-search-input {
        width: 100%;
        padding: 0.875rem 1rem;
        border: 1px solid #e2e8f0;
        border-radius: 0.5rem;
        font-size: 0.95rem;
        background: white;
        color: #000000;
        transition: all 0.2s;
    }
    
    .tender-search-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }
    
    .tender-search-input::placeholder {
        color: #94a3b8;
    }
    
    /* Filter Bar Styles */
    .filter-bar {
        background: white;
        border: 1px solid #e2e8f0;
        border-radius: 0.75rem;
        padding: 1rem;
        margin-bottom: 1.5rem;
    }
    
    .filter-row {
        display: flex;
        gap: 1rem;
        flex-wrap: wrap;
        align-items: flex-end;
    }
    
    
    .filter-item {
        display: flex;
        flex-direction: column;
        gap: 0.375rem;
        flex: 1;
        min-width: 140px;
    }
    
    .filter-label {
        font-size: 0.75rem;
        font-weight: 600;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    
    .filter-select {
        padding: 0.5rem 2.5rem 0.5rem 0.75rem;
        border: 1px solid #e2e8f0;
        border-radius: 0.375rem;
        font-size: 0.875rem;
        background: white;
        color: #1e293b;
        cursor: pointer;
        appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath fill='%236b7280' d='M7 7l3 3 3-3 1.41 1.41L10 12.83 5.59 8.41z'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 0.5rem center;
        background-size: 1.25rem;
        transition: all 0.2s;
    }
    
    .filter-select:hover {
        border-color: #cbd5e1;
    }
    
    .filter-select:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }
    
    /* Button Styles for Filter Bar */
    .btn-icon {
        padding: 0.5rem;
        border: 1px solid #e2e8f0;
        border-radius: 0.375rem;
        background: white;
        cursor: pointer;
        transition: all 0.2s;
        font-size: 1rem;
    }
    
    .btn-icon:hover {
        background: #f8fafc;
        border-color: #cbd5e1;
    }
    
    .btn-clear-filters {
        padding: 0.5rem 1rem;
        border: 1px solid #e2e8f0;
        border-radius: 0.375rem;
        background: white;
        color: #64748b;
        font-size: 0.875rem;
        font-weight: 500;
        cursor: pointer;
        transition: all 0.2s;
        height: 38px;
    }
    
    .btn-clear-filters:hover {
        background: #f8fafc;
        border-color: #cbd5e1;
        color: #475569;
    }
    
    /* Pagination Styles */
    .btn-page {
        padding: 0.5rem 0.75rem;
        border: 1px solid #e2e8f0;
        border-radius: 0.375rem;
        background: white;
        color: #64748b;
        font-size: 0.875rem;
        font-weight: 500;
        cursor: pointer;
        transition: all 0.2s;
    }
    
    .btn-page:hover {
        background: #f8fafc;
        border-color: #cbd5e1;
        color: #475569;
    }
    
    .btn-page.active {
        background: #2563eb;
        color: white;
        border-color: #2563eb;
    }
    
    .btn-page:disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }
    
    /* Old Filter Section - Remove */
    .filter-section {
        display: none;
    }
    
    .filter-grid {
        display: none;
    }
    
    /* Form Styles */
    .form-group {
        margin-bottom: 1.75rem;
    }
    
    .form-label {
        display: block;
        margin-bottom: 0.625rem;
        font-weight: 600;
        color: #374151;
        font-size: 0.9rem;
        letter-spacing: 0.2px;
    }
    
    .form-input {
        width: 100%;
        padding: 0.875rem 1.25rem;
        border: 2px solid #e5e7eb;
        border-radius: 0.75rem;
        font-size: 0.95rem;
        transition: all 0.2s;
        background: #ffffff;
        color: #1f2937;
    }
    
    .form-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }
    
    .form-textarea {
        width: 100%;
        padding: 1rem 1.25rem;
        border: 2px solid #e5e7eb;
        border-radius: 0.75rem;
        font-size: 0.95rem;
        transition: all 0.2s;
        background: #ffffff;
        color: #1f2937;
        min-height: 120px;
        resize: vertical;
    }
    
    /* Dashboard Styles */
    .dashboard-grid {
        display: grid;
        grid-template-columns: 280px 1fr;
        gap: 2.5rem;
        margin-top: 2.5rem;
    }
    
    .sidebar {
        background: #ffffff;
        border-radius: 1.25rem;
        padding: 2rem;
        height: fit-content;
        border: 1px solid #e5e7eb;
    }
    
    .sidebar-menu {
        list-style: none;
    }
    
    .sidebar-item {
        padding: 1rem 1.25rem;
        margin-bottom: 0.5rem;
        border-radius: 0.75rem;
        transition: all 0.2s;
        cursor: pointer;
        font-weight: 500;
        color: #4b5563;
        font-size: 0.95rem;
    }
    
    .sidebar-item:hover {
        background: #f8f9fa;
        color: #2563eb;
    }
    
    .sidebar-item.active {
        background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
        color: #2563eb;
        font-weight: 600;
    }
    
    /* Alert Styles */
    .alert {
        padding: 1.25rem 1.75rem;
        border-radius: 0.875rem;
        margin-bottom: 1.75rem;
        font-size: 0.95rem;
    }
    
    .alert-info {
        background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
        border-left: 4px solid #2563eb;
        color: #1e40af;
    }
    
    .alert-success {
        background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
        border-left: 4px solid #16a34a;
        color: #14532d;
    }
    
    /* Match Score */
    .match-score {
        display: inline-flex;
        align-items: center;
        padding: 0.375rem 0.75rem;
        background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
        border-radius: 9999px;
        font-weight: 600;
        font-size: 0.75rem;
        color: #2563eb;
        border: 1px solid #bfdbfe;
    }
    
    .match-score-high {
        background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
        color: #16a34a;
        border-color: #86efac;
    }
    
    /* Progress Bar */
    .progress-bar {
        width: 100%;
        height: 8px;
        background: #e5e7eb;
        border-radius: 9999px;
        overflow: hidden;
        margin: 1rem 0;
    }
    
    .progress-fill {
        height: 100%;
        background: linear-gradient(90deg, #2563eb 0%, #2563eb 100%);
        border-radius: 9999px;
        transition: width 0.3s;
    }
    
    /* Document Upload Area */
    .upload-area {
        border: 2px dashed #e5e7eb;
        border-radius: 1rem;
        padding: 3rem;
        text-align: center;
        transition: all 0.3s;
        background: #f8f9fa;
    }
    
    .upload-area:hover {
        border-color: #2563eb;
        background: #eff6ff;
    }
    
    /* Section Headers */
    .section-header {
        margin-bottom: 3rem;
        text-align: center;
    }
    
    .section-title {
        font-size: 2.5rem;
        font-weight: 700;
        color: #1f2937;
        margin-bottom: 1rem;
        letter-spacing: -0.025em;
    }
    
    .section-subtitle {
        font-size: 1.125rem;
        color: #4b5563;
        max-width: 600px;
        margin: 0 auto;
        line-height: 1.7;
    }

    /* Form Section Styles for Onboarding */
    .form-section {
        margin-bottom: 0.25rem;
    }

    .form-section .section-title {
        font-size: 1.5rem;
        font-weight: 600;
        color: #1f2937;
        margin-bottom: 0.5rem;
    }

    .form-section .section-subtitle {
        font-size: 0.875rem;
        color: #6b7280;
        margin: 0 0 1rem 0;
        text-align: left;
        max-width: none;
    }

    /* Tighter spacing for form groups in onboarding */
    .form-section .form-group {
        margin-bottom: 1rem;
    }

    /* Reduce spacing for navigation buttons */
    .onboarding-navigation {
        margin-top: 1.5rem;
        padding-top: 1rem;
    }
    
    /* Enhanced Footer Styles - Now defined in components_i18n.py */
    /* Removed redundant .enhanced-footer::before override that was causing greenish gradient */

    .footer-container {
        position: relative;
        z-index: 1;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 2rem;
    }

    .footer-main-content {
        display: grid;
        grid-template-columns: 2fr 1fr 1fr 1.5fr;
        gap: 3rem;
        padding: 4rem 0 3rem;
        border-bottom: 1px solid rgba(148, 163, 184, 0.2);
    }

    @media (max-width: 1024px) {
        .footer-main-content {
            grid-template-columns: repeat(2, 1fr);
            gap: 2.5rem;
        }
    }

    @media (max-width: 640px) {
        .footer-main-content {
            grid-template-columns: 1fr;
            gap: 2rem;
            padding: 3rem 0 2rem;
        }
    }

    .footer-column {
        display: flex;
        flex-direction: column;
    }

    .footer-brand {
        font-size: 2rem;
        font-weight: 800;
        margin-bottom: 1rem;
        background: linear-gradient(135deg, #60a5fa 0%, #60a5fa 50%, #34d399 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        letter-spacing: -0.025em;
    }

    .footer-brand-logo {
        font-size: 1.75rem;
        font-weight: 700;
        margin-bottom: 1rem;
        background: linear-gradient(135deg, #3b82f6 0%, #60a5fa 50%, #93c5fd 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        letter-spacing: -0.025em;
    }

    .footer-description {
        color: #cbd5e1;
        line-height: 1.7;
        margin-bottom: 1.5rem;
        font-size: 0.95rem;
    }

    .footer-section-title {
        font-size: 1.1rem;
        font-weight: 600;
        margin-bottom: 1.5rem;
        color: #f1f5f9;
        letter-spacing: 0.025em;
    }

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

    .footer-list li {
        margin-bottom: 0.75rem;
    }

    .footer-link {
        color: #94a3b8;
        text-decoration: none;
        transition: all 0.3s ease;
        font-size: 0.9rem;
        display: inline-block;
    }

    .footer-link:hover {
        color: #60a5fa;
        transform: translateX(4px);
    }

    .contact-info p {
        margin-bottom: 0.75rem;
        font-size: 0.9rem;
        color: #cbd5e1;
    }

    .footer-contact-link {
        color: #60a5fa;
        text-decoration: none;
        transition: color 0.3s ease;
    }

    .footer-contact-link:hover {
        color: #34d399;
    }

    .footer-office-block {
        margin-bottom: 0.875rem;
        padding-bottom: 0.875rem;
        border-bottom: 1px solid rgba(148, 163, 184, 0.1);
    }

    .footer-office-label {
        font-size: 0.8rem;
        font-weight: 600;
        color: #cbd5e1;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .footer-company-reg {
        color: #6b7280;
        font-size: 0.85rem;
        line-height: 1.6;
        margin-top: 0.25rem;
    }

    .footer-text {
        color: #94a3b8;
    }

    /* Social Links */
    .social-links {
        display: flex;
        gap: 1rem;
        margin-top: 0.5rem;
    }

    .social-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        background: rgba(96, 165, 250, 0.1);
        border: 1px solid rgba(96, 165, 250, 0.2);
        border-radius: 8px;
        text-decoration: none;
        font-size: 1.2rem;
        transition: all 0.3s ease;
    }

    .social-link:hover {
        background: rgba(96, 165, 250, 0.2);
        border-color: rgba(96, 165, 250, 0.4);
        transform: translateY(-2px);
    }

    /* Footer Social Links */
    .footer-social-links {
        display: flex;
        gap: 0.75rem;
        margin-top: 1.25rem;
    }

    .footer-social-link {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        background: rgba(96, 165, 250, 0.1);
        border: 1px solid rgba(96, 165, 250, 0.2);
        border-radius: 8px;
        color: #94a3b8;
        text-decoration: none;
        transition: all 0.3s ease;
    }

    .footer-social-link:hover {
        background: rgba(96, 165, 250, 0.2);
        border-color: rgba(96, 165, 250, 0.4);
        color: #60a5fa;
        transform: translateY(-2px);
    }

    .footer-social-link svg {
        width: 18px;
        height: 18px;
    }

    /* Newsletter Section */
    .newsletter-section {
        background: rgba(15, 23, 42, 0.8);
        margin: 0 -2rem;
        padding: 3rem 2rem;
        border-top: 1px solid rgba(148, 163, 184, 0.1);
        border-bottom: 1px solid rgba(148, 163, 184, 0.1);
    }

    .newsletter-content {
        max-width: 600px;
        margin: 0 auto;
        text-align: center;
    }

    .newsletter-title {
        font-size: 1.5rem;
        font-weight: 700;
        margin-bottom: 0.75rem;
        color: #f1f5f9;
    }

    .newsletter-description {
        color: #94a3b8;
        margin-bottom: 2rem;
        line-height: 1.6;
    }

    .newsletter-form {
        display: flex;
        gap: 1rem;
        max-width: 400px;
        margin: 0 auto;
    }

    @media (max-width: 480px) {
        .newsletter-form {
            flex-direction: column;
            gap: 0.75rem;
        }
    }

    .newsletter-input {
        flex: 1;
        padding: 0.75rem 1rem;
        border: 1px solid rgba(148, 163, 184, 0.3);
        border-radius: 8px;
        background: rgba(30, 41, 59, 0.8);
        color: #f1f5f9;
        font-size: 0.9rem;
        transition: border-color 0.3s ease;
    }

    .newsletter-input:focus {
        outline: none;
        border-color: #60a5fa;
        box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.1);
    }

    .newsletter-input::placeholder {
        color: #64748b;
    }

    .newsletter-button {
        padding: 0.75rem 1.5rem;
        background: linear-gradient(135deg, #60a5fa, #60a5fa);
        border: none;
        border-radius: 8px;
        color: white;
        font-weight: 600;
        font-size: 0.9rem;
        cursor: pointer;
        transition: all 0.3s ease;
        white-space: nowrap;
    }

    .newsletter-button:hover {
        background: linear-gradient(135deg, #3b82f6, #3b82f6);
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(96, 165, 250, 0.4);
    }

    /* Legal Section */
    .legal-container {
        padding: 2rem 0;
    }

    .legal-section {
        display: flex;
        justify-content: center;
    }

    .legal-links {
        display: flex;
        gap: 2rem;
        list-style: none;
        padding: 0;
        margin: 0;
        flex-wrap: wrap;
        justify-content: center;
    }

    @media (max-width: 480px) {
        .legal-links {
            gap: 1rem;
            flex-direction: column;
            text-align: center;
        }
    }

    .footer-legal-link {
        color: #64748b;
        text-decoration: none;
        font-size: 0.85rem;
        transition: color 0.3s ease;
    }

    .footer-legal-link:hover {
        color: #94a3b8;
    }

    /* Bottom Section */
    .footer-bottom {
        background: rgba(0, 0, 0, 0.3);
        margin: 0 -2rem;
        padding: 1.5rem 2rem;
    }

    .bottom-content {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 1rem;
        text-align: center;
    }

    @media (max-width: 640px) {
        .bottom-content {
            flex-direction: column;
            gap: 0.5rem;
        }
    }

    .copyright-text {
        color: #64748b;
        font-size: 0.85rem;
        margin: 0;
    }

    .made-with-love {
        color: #64748b;
        font-size: 0.85rem;
        margin: 0;
    }

    /* Legacy footer styles for compatibility */
    .footer {
        background: #111827;
        color: #ffffff;
        padding: 4rem 0 2rem;
        margin-top: 6rem;
    }

    .footer-content {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
        gap: 3rem;
        margin-bottom: 3rem;
    }
    
    /* Table Styles */
    .table {
        width: 100%;
        border-collapse: collapse;
        background: #ffffff;
        border-radius: 1rem;
        overflow: hidden;
        box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    }
    
    .table th {
        background: #f8f9fa;
        padding: 1.25rem 1.5rem;
        text-align: left;
        font-weight: 600;
        color: #374151;
        font-size: 0.9rem;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        border-bottom: 2px solid #e5e7eb;
    }
    
    .table td {
        padding: 1.25rem 1.5rem;
        border-bottom: 1px solid #e5e7eb;
        color: #4b5563;
        background: #ffffff;
    }
    
    .table tr {
        background: #ffffff;
    }
    
    .table tbody tr {
        background: #ffffff;
    }
    
    .table tr:hover {
        background: #f8f9fa !important;
    }
    
    .table tbody tr:hover {
        background: #f8f9fa !important;
    }
    
    /* Modal Styles */
    .modal-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: var(--z-modal);
    }
    
    .modal {
        background: #ffffff;
        border-radius: var(--radius-xl);
        padding: 3rem;
        max-width: 500px;
        width: 90%;
        box-shadow: 0 25px 50px rgba(0, 0, 0, 0.25);
        position: relative;
    }
    
    .modal-header {
        margin-bottom: 2rem;
        text-align: center;
    }
    
    .modal-title {
        font-size: 1.75rem;
        font-weight: 700;
        color: #111827;
        margin-bottom: 0.5rem;
    }
    
    .modal-subtitle {
        color: #4b5563;
        font-size: 0.95rem;
    }
    
    /* Tabs */
    .tabs {
        display: flex;
        border-bottom: 2px solid #e5e7eb;
        margin-bottom: 2rem;
    }
    
    .tab {
        padding: 1rem 2rem;
        background: none;
        border: none;
        cursor: pointer;
        font-weight: 500;
        color: #4b5563;
        transition: all 0.2s;
        border-bottom: 2px solid transparent;
    }
    
    .tab.active {
        color: #2563eb;
        border-bottom-color: #2563eb;
    }
    
    .tab:hover {
        color: #2563eb;
    }
    
    /* Modern Pricing Cards */
    .modern-pricing-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 1.5rem;
        margin: 3rem 0;
    }
    
    .modern-pricing-card {
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 0.75rem;
        padding: 2rem 1.5rem;
        text-align: center;
        position: relative;
        transition: all 0.3s;
        display: flex;
        flex-direction: column;
        height: 100%;
    }
    
    .modern-pricing-card.featured {
        border-color: #3b82f6;
        box-shadow: 0 4px 14px rgba(59, 130, 246, 0.15);
        background: linear-gradient(135deg, #fefefe 0%, #f8fafc 100%);
    }
    
    .modern-pricing-card:hover {
        box-shadow: 0 6px 20px rgba(0,0,0,0.08);
        transform: translateY(-2px);
    }
    
    .modern-pricing-badge {
        position: absolute;
        top: -8px;
        left: 50%;
        transform: translateX(-50%);
        background: #3b82f6;
        color: white;
        padding: 0.25rem 0.75rem;
        border-radius: 9999px;
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }
    
    .modern-pricing-title {
        font-size: 1.25rem;
        font-weight: 600;
        margin-bottom: 0.5rem;
        color: #0f172a;
    }
    
    .modern-pricing-desc {
        color: #64748b;
        font-size: 0.875rem;
        margin-bottom: 1rem;
    }
    
    .modern-pricing-price {
        font-size: 2.25rem;
        font-weight: 700;
        color: #3b82f6;
        line-height: 1;
    }
    
    .modern-pricing-period {
        color: #64748b;
        font-size: 0.875rem;
        font-weight: 500;
    }
    
    .modern-pricing-features {
        flex: 1;
        margin: 1.5rem 0;
        text-align: left;
    }
    
    .modern-pricing-feature {
        display: flex;
        align-items: flex-start;
        padding: 0.5rem 0;
        gap: 0.5rem;
    }
    
    .modern-pricing-btn {
        padding: 0.75rem 1.5rem;
        border: 1px solid #e2e8f0;
        border-radius: 0.5rem;
        background: white;
        color: #475569;
        font-size: 0.875rem;
        font-weight: 500;
        cursor: pointer;
        transition: all 0.2s;
        width: 100%;
        text-decoration: none;
        display: inline-block;
    }
    
    .modern-pricing-btn:hover {
        background: #f8fafc;
        border-color: #cbd5e1;
    }
    
    .modern-pricing-btn.primary {
        background: #3b82f6;
        color: white;
        border-color: #3b82f6;
    }
    
    .modern-pricing-btn.primary:hover {
        background: #2563eb;
        border-color: #2563eb;
    }
    
    /* Modern FAQ Styles */
    .modern-faq-item {
        border-bottom: 1px solid #f1f5f9;
        padding: 1.25rem 0;
    }
    
    .modern-faq-item:last-child {
        border-bottom: none;
    }
    
    .modern-faq-question {
        font-weight: 600;
        color: #0f172a;
        margin-bottom: 0.75rem;
        font-size: 1rem;
        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    .modern-faq-answer {
        color: #64748b;
        line-height: 1.6;
        font-size: 0.875rem;
        padding-left: 0;
    }
    
    /* ===== About Page — "contract notice" design system ===== */

    .abt {
        --abt-ink: #0b1220;
        --abt-body: #3f4a5c;
        --abt-muted: #64748b;
        --abt-brand: #2563eb;
        --abt-brand-strong: #1d4ed8;
        --abt-border: #e5e7eb;
        --abt-tint: #f7f9fc;
        --abt-navy: #061c40;
        --abt-display: 'Bricolage Grotesque', 'Inter', system-ui, sans-serif;
        --abt-mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', monospace;
        font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
        color: var(--abt-ink);
        background: #ffffff;
        -webkit-font-smoothing: antialiased;
    }

    .abt .container {
        max-width: 1140px;
        margin: 0 auto;
        padding: 0 1.5rem;
    }

    /* Scroll reveal */
    .abt-reveal {
        opacity: 0;
        transform: translateY(18px);
        transition: opacity 0.6s cubic-bezier(0.22, 1, 0.36, 1), transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
    }

    .abt-in {
        opacity: 1;
        transform: none;
    }

    /* ---- Hero ---- */
    .abt-hero {
        position: relative;
        overflow: hidden;
        background:
            radial-gradient(760px 420px at 85% -10%, rgba(37, 99, 235, 0.07), transparent 65%),
            linear-gradient(to right, rgba(37, 99, 235, 0.045) 1px, transparent 1px),
            linear-gradient(to bottom, rgba(37, 99, 235, 0.045) 1px, transparent 1px),
            #fbfcfe;
        background-size: auto, 56px 56px, 56px 56px, auto;
    }

    .abt-hero-grid {
        display: grid;
        grid-template-columns: 1.05fr 0.95fr;
        gap: 3rem;
        align-items: center;
        padding-top: 6.5rem;
        padding-bottom: 5rem;
    }

    .abt-kicker {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 0.6rem 1rem;
        font-family: var(--abt-mono);
        font-size: 0.75rem;
        font-weight: 500;
        letter-spacing: 0.08em;
        color: var(--abt-muted);
        margin-bottom: 1.75rem;
        animation: abtRise 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    .abt-kicker-brand {
        color: var(--abt-brand-strong);
        font-weight: 600;
    }

    .abt-kicker-item::before {
        content: '·';
        margin-right: 1rem;
        color: #cbd5e1;
    }

    .abt-h1 {
        font-family: var(--abt-display);
        font-size: clamp(2.5rem, 5.2vw, 4rem);
        font-weight: 800;
        line-height: 1.02;
        letter-spacing: -0.03em;
        margin-bottom: 1.5rem;
        animation: abtRise 0.6s 0.08s cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    .abt-h1-a,
    .abt-h1-b {
        display: block;
    }

    .abt-h1-b {
        color: var(--abt-brand);
    }

    .abt-hero-sub {
        font-size: 1.125rem;
        line-height: 1.7;
        color: var(--abt-body);
        max-width: 520px;
        margin-bottom: 2rem;
        animation: abtRise 0.6s 0.16s cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    .abt-hero-ctas {
        display: flex;
        flex-wrap: wrap;
        gap: 0.875rem;
        animation: abtRise 0.6s 0.24s cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    .abt-btn {
        display: inline-block;
        font-weight: 600;
        font-size: 0.9375rem;
        padding: 0.8125rem 1.75rem;
        border-radius: 10px;
        text-decoration: none;
        transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease, color 150ms ease;
        cursor: pointer;
    }

    .abt-btn:focus-visible {
        outline: 2px solid var(--abt-brand);
        outline-offset: 2px;
    }

    .abt-btn-primary {
        background: var(--abt-brand);
        color: #ffffff;
        box-shadow: 0 1px 2px rgba(17, 24, 39, 0.08);
    }

    .abt-btn-primary:hover {
        background: var(--abt-brand-strong);
        color: #ffffff;
        transform: translateY(-1px);
        box-shadow: 0 6px 16px rgba(37, 99, 235, 0.28);
    }

    .abt-btn-ghost {
        background: #ffffff;
        color: var(--abt-ink);
        border: 1px solid var(--abt-border);
    }

    .abt-btn-ghost:hover {
        border-color: #bfdbfe;
        color: var(--abt-brand-strong);
        transform: translateY(-1px);
    }

    .abt-btn-invert {
        background: #ffffff;
        color: var(--abt-brand-strong);
    }

    .abt-btn-invert:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22);
        color: #1e3a8a;
    }

    /* Notice stack */
    .abt-notice-stack {
        position: relative;
        min-height: 600px;
    }

    .abt-notice {
        position: absolute;
        width: min(400px, 92%);
        background: #ffffff;
        border: 1px solid var(--abt-border);
        border-radius: 14px;
        padding: 1.25rem 1.375rem;
        box-shadow: 0 8px 28px rgba(11, 18, 32, 0.07), 0 2px 6px rgba(11, 18, 32, 0.04);
        animation: abtCard 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
    }

    .abt-notice-0 { top: 0; left: 4%; z-index: 2; transform: rotate(-1.5deg); animation-delay: 0.15s; }
    .abt-notice-1 { top: 26%; right: 0; z-index: 3; transform: rotate(1.75deg); animation-delay: 0.3s; }
    .abt-notice-2 { top: 52%; left: 0; z-index: 4; transform: rotate(-2.5deg); animation-delay: 0.45s; }
    .abt-notice-3 { top: 76%; right: 6%; z-index: 5; transform: rotate(1deg); animation-delay: 0.6s; }

    .abt-notice-hot {
        border-color: #93c5fd;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12), 0 14px 34px rgba(37, 99, 235, 0.16);
    }

    .abt-notice-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        margin-bottom: 0.625rem;
    }

    .abt-notice-ref {
        font-family: var(--abt-mono);
        font-size: 0.6875rem;
        font-weight: 500;
        letter-spacing: 0.04em;
        color: var(--abt-muted);
        white-space: nowrap;
    }

    .abt-notice-match {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        font-family: var(--abt-mono);
        font-size: 0.6875rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: #ffffff;
        background: var(--abt-brand);
        padding: 0.25rem 0.625rem;
        border-radius: 9999px;
        white-space: nowrap;
    }

    .abt-notice-dot {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #ffffff;
        animation: abtPulse 2s ease-in-out infinite;
    }

    .abt-notice-title {
        font-weight: 600;
        font-size: 0.9375rem;
        line-height: 1.45;
        color: var(--abt-ink);
        margin-bottom: 0.75rem;
    }

    .abt-notice-bottom {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
    }

    .abt-notice-meta {
        font-family: var(--abt-mono);
        font-size: 0.8125rem;
        font-weight: 600;
        color: var(--abt-ink);
    }

    .abt-notice-deadline {
        font-family: var(--abt-mono);
        font-size: 0.6875rem;
        font-weight: 500;
        color: #b45309;
        background: #fef3c7;
        padding: 0.2rem 0.55rem;
        border-radius: 6px;
        white-space: nowrap;
    }

    /* Stats band */
    .abt-stats-band {
        position: relative;
        border-top: 1px solid var(--abt-border);
        background: rgba(255, 255, 255, 0.7);
        backdrop-filter: blur(4px);
    }

    .abt-stats {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }

    .abt-stat {
        padding: 1.5rem 1rem;
        display: flex;
        flex-direction: column;
        gap: 0.3rem;
        border-left: 1px solid var(--abt-border);
    }

    .abt-stat:first-child {
        border-left: none;
    }

    .abt-stat-value {
        font-family: var(--abt-display);
        font-size: 1.75rem;
        font-weight: 700;
        letter-spacing: -0.02em;
        color: var(--abt-ink);
        line-height: 1;
    }

    .abt-stat-label {
        font-family: var(--abt-mono);
        font-size: 0.6875rem;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.08em;
        color: var(--abt-muted);
    }

    /* ---- Sections ---- */
    .abt-section {
        padding: 5.5rem 0;
    }

    .abt-section-tinted {
        background: var(--abt-tint);
        border-top: 1px solid #eef2f7;
        border-bottom: 1px solid #eef2f7;
    }

    .abt-sec-head {
        display: flex;
        align-items: center;
        gap: 1.25rem;
        margin-bottom: 3rem;
    }

    .abt-sec-label {
        font-family: var(--abt-mono);
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.12em;
        color: var(--abt-brand);
        white-space: nowrap;
    }

    .abt-sec-rule {
        flex: 1;
        height: 1px;
        background: var(--abt-border);
    }

    .abt-heading-wrap {
        margin-bottom: 3rem;
        max-width: 640px;
    }

    .abt-heading {
        font-family: var(--abt-display);
        font-size: clamp(1.875rem, 3.2vw, 2.5rem);
        font-weight: 700;
        letter-spacing: -0.025em;
        color: var(--abt-ink);
        margin-bottom: 0.75rem;
    }

    .abt-subheading {
        font-size: 1.0625rem;
        color: var(--abt-muted);
        line-height: 1.6;
    }

    /* Section I — story */
    .abt-story-grid {
        display: grid;
        grid-template-columns: 320px 1fr;
        gap: 3rem;
        margin-bottom: 4rem;
    }

    .abt-story-heading {
        font-family: var(--abt-display);
        font-size: clamp(2rem, 3.6vw, 2.75rem);
        font-weight: 700;
        letter-spacing: -0.03em;
        color: var(--abt-ink);
        line-height: 1.1;
    }

    .abt-story-body {
        max-width: 640px;
    }

    .abt-story-p {
        font-size: 1.125rem;
        line-height: 1.8;
        color: var(--abt-body);
        margin-bottom: 1.5rem;
    }

    .abt-story-p:first-child {
        font-size: 1.25rem;
        color: var(--abt-ink);
    }

    .abt-story-p:last-child {
        margin-bottom: 0;
    }

    .abt-markets {
        border-top: 1px solid var(--abt-border);
        padding-top: 2.5rem;
    }

    .abt-markets-caption {
        display: block;
        font-family: var(--abt-mono);
        font-size: 0.75rem;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        color: var(--abt-muted);
        margin-bottom: 1.25rem;
    }

    .abt-markets-wall {
        display: flex;
        flex-wrap: wrap;
        gap: 0.625rem;
    }

    .abt-market-code {
        font-family: var(--abt-mono);
        font-size: 0.9375rem;
        font-weight: 600;
        letter-spacing: 0.06em;
        color: var(--abt-ink);
        border: 1px solid var(--abt-border);
        border-radius: 8px;
        padding: 0.5rem 0.875rem;
        background: #ffffff;
        transition: background 150ms ease, color 150ms ease, border-color 150ms ease, transform 150ms ease;
        cursor: default;
    }

    .abt-market-code:hover {
        background: var(--abt-brand);
        border-color: var(--abt-brand);
        color: #ffffff;
        transform: translateY(-2px);
    }

    /* Section II — mission */
    .abt-mission {
        position: relative;
        overflow: hidden;
        background:
            radial-gradient(820px 460px at 78% 120%, rgba(37, 99, 235, 0.35), transparent 60%),
            radial-gradient(620px 340px at 8% -30%, rgba(14, 165, 233, 0.18), transparent 60%),
            var(--abt-navy);
        padding: 6rem 0;
    }

    .abt-sec-label-dark {
        display: block;
        color: #7fb3ff;
        margin-bottom: 2rem;
    }

    .abt-mission-statement {
        font-family: var(--abt-display);
        font-size: clamp(2rem, 4.4vw, 3.375rem);
        font-weight: 700;
        line-height: 1.12;
        letter-spacing: -0.03em;
        color: #ffffff;
        max-width: 900px;
        margin-bottom: 1.75rem;
    }

    .abt-mission-support {
        font-size: 1.125rem;
        line-height: 1.7;
        color: #9db6e4;
        max-width: 560px;
    }

    /* Section III — team */
    .abt-team {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 3rem 2.25rem;
        max-width: 1060px;
        margin: 0 auto;
    }

    .abt-member {
        width: 300px;
        text-align: left;
    }

    .abt-member-frame {
        border-radius: 14px;
        overflow: hidden;
        background: #eef1f5;
        margin-bottom: 1.25rem;
        border: 1px solid var(--abt-border);
    }

    .abt-member-photo {
        display: block;
        width: 100%;
        height: auto;
        aspect-ratio: 1 / 1;
        object-fit: cover;
        transition: transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
    }

    .abt-member:hover .abt-member-photo {
        transform: scale(1.03);
    }

    .abt-member-name {
        font-family: var(--abt-display);
        font-size: 1.25rem;
        font-weight: 700;
        letter-spacing: -0.015em;
        color: var(--abt-ink);
        margin-bottom: 0.375rem;
    }

    .abt-member-role {
        display: block;
        font-family: var(--abt-mono);
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        color: var(--abt-brand);
        margin-bottom: 0.75rem;
    }

    .abt-member-bio {
        font-size: 0.9063rem;
        line-height: 1.65;
        color: var(--abt-muted);
        margin: 0;
    }

    /* Section IV — values */
    .abt-values {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 2.5rem 3.5rem;
        max-width: 1000px;
    }

    .abt-value {
        display: flex;
        gap: 1.25rem;
        align-items: flex-start;
        border-top: 1px solid var(--abt-border);
        padding-top: 1.5rem;
    }

    .abt-value-num {
        font-family: var(--abt-mono);
        font-size: 0.8125rem;
        font-weight: 600;
        color: var(--abt-brand);
        padding-top: 0.3rem;
        min-width: 3rem;
    }

    .abt-value-title {
        font-family: var(--abt-display);
        font-size: 1.25rem;
        font-weight: 700;
        letter-spacing: -0.015em;
        color: var(--abt-ink);
        margin-bottom: 0.5rem;
    }

    .abt-value-text {
        font-size: 0.9375rem;
        line-height: 1.65;
        color: var(--abt-body);
        margin: 0;
    }

    /* Section V — contact */
    .abt-offices {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 2.5rem;
        max-width: 900px;
        margin-bottom: 2.5rem;
    }

    .abt-office {
        border-top: 1px solid var(--abt-border);
        padding-top: 1.5rem;
    }

    .abt-office-label {
        display: block;
        font-family: var(--abt-mono);
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        color: var(--abt-brand);
        margin-bottom: 0.875rem;
    }

    .abt-office-address {
        font-size: 1rem;
        color: var(--abt-ink);
        line-height: 1.6;
        margin-bottom: 0.75rem;
    }

    .abt-office-links {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem 1.5rem;
    }

    .abt-office-link {
        font-family: var(--abt-mono);
        font-size: 0.8125rem;
        font-weight: 500;
        color: var(--abt-brand);
        text-decoration: none;
    }

    .abt-office-link:hover {
        color: var(--abt-brand-strong);
        text-decoration: underline;
    }

    .abt-reg {
        font-size: 0.875rem;
        color: var(--abt-muted);
    }

    .abt-reg-name {
        font-weight: 600;
        color: var(--abt-body);
    }

    /* Section VI — CTA */
    .abt-cta {
        padding: 3rem 0 5.5rem;
    }

    .abt-cta-card {
        position: relative;
        overflow: hidden;
        background:
            radial-gradient(560px 300px at 15% -20%, rgba(255, 255, 255, 0.14), transparent 60%),
            radial-gradient(680px 380px at 90% 130%, rgba(14, 165, 233, 0.45), transparent 60%),
            linear-gradient(135deg, #1e3a8a 0%, var(--abt-brand) 70%);
        border-radius: 20px;
        padding: 4.5rem 2rem;
        text-align: center;
    }

    .abt-cta-label {
        display: block;
        font-family: var(--abt-mono);
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.12em;
        color: rgba(255, 255, 255, 0.65);
        margin-bottom: 1.5rem;
    }

    .abt-cta-title {
        font-family: var(--abt-display);
        font-size: clamp(1.75rem, 3.4vw, 2.5rem);
        font-weight: 700;
        letter-spacing: -0.025em;
        color: #ffffff;
        margin-bottom: 1rem;
    }

    .abt-cta-sub {
        font-size: 1.0625rem;
        line-height: 1.6;
        color: rgba(255, 255, 255, 0.85);
        max-width: 540px;
        margin: 0 auto 2.25rem;
    }

    /* Animations */
    @keyframes abtRise {
        from { opacity: 0; transform: translateY(20px); }
        to { opacity: 1; transform: none; }
    }

    @keyframes abtCard {
        from { opacity: 0; transform: translateY(28px) rotate(0deg); }
    }

    @keyframes abtPulse {
        0%, 100% { opacity: 1; }
        50% { opacity: 0.35; }
    }

    @media (prefers-reduced-motion: reduce) {
        .abt-kicker,
        .abt-h1,
        .abt-hero-sub,
        .abt-hero-ctas,
        .abt-notice {
            animation: none;
        }

        .abt-reveal {
            opacity: 1;
            transform: none;
            transition: none;
        }

        .abt-notice-dot {
            animation: none;
        }
    }

    /* ---- Responsive ---- */
    @media (max-width: 1024px) {
        .abt-hero-grid {
            gap: 2rem;
        }

        .abt-notice-stack {
            min-height: 560px;
        }

        .abt-notice {
            width: min(360px, 96%);
        }
    }

    @media (max-width: 900px) {
        .abt-hero-grid {
            grid-template-columns: 1fr;
            gap: 3rem;
            padding-top: 3.5rem;
            padding-bottom: 3.5rem;
        }

        .abt-hero-sub {
            max-width: 100%;
        }

        .abt-notice-stack {
            min-height: 0;
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }

        .abt-notice {
            position: static;
            width: 100%;
        }

        .abt-notice-0 { transform: rotate(0.75deg); }
        .abt-notice-1 { transform: rotate(-0.75deg); }
        .abt-notice-2,
        .abt-notice-3 { display: none; }

        .abt-story-grid {
            grid-template-columns: 1fr;
            gap: 1.5rem;
        }

        .abt-values {
            grid-template-columns: 1fr;
            gap: 2rem;
        }

        .abt-offices {
            grid-template-columns: 1fr;
            gap: 2rem;
        }
    }

    @media (max-width: 640px) {
        .abt-section {
            padding: 3.5rem 0;
        }

        .abt-mission {
            padding: 4rem 0;
        }

        .abt-stats {
            grid-template-columns: repeat(2, 1fr);
        }

        .abt-stat {
            border-left: none;
            border-top: 1px solid var(--abt-border);
            padding: 1.125rem 0.5rem;
        }

        .abt-stat:nth-child(-n+2) {
            border-top: none;
        }

        .abt-stat:nth-child(even) {
            border-left: 1px solid var(--abt-border);
        }

        .abt-sec-head {
            margin-bottom: 2rem;
        }

        .abt-heading-wrap {
            margin-bottom: 2rem;
        }

        .abt-team {
            gap: 2.5rem;
        }

        .abt-member {
            width: 100%;
            max-width: 360px;
        }

        .abt-cta-card {
            padding: 3rem 1.5rem;
            border-radius: 16px;
        }
    }

    /* Loading Spinner */
    .spinner {
        width: 20px;
        height: 20px;
        border: 2px solid #e5e7eb;
        border-top: 2px solid #3b82f6;
        border-radius: 50%;
        animation: spin 1s linear infinite;
    }
    
    .htmx-indicator {
        display: none;
    }
    
    .htmx-request .htmx-indicator {
        display: block;
    }

    /* Enhanced Landing Page Styles */
    .hero-title {
        font-size: 3.5rem;
        font-weight: 800;
        color: #0f172a;
        margin-bottom: 1rem;
        letter-spacing: -0.025em;
        line-height: 1.1;
        text-align: center;
    }

    .hero-subtitle {
        font-size: 1.2rem;
        color: #374151;
        line-height: 1.6;
        text-align: center;
        max-width: 650px;
        margin: 0 auto;
    }

    .problem-card {
        background: white;
        padding: 2rem;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08);
        border: 1px solid #e5e7eb;
        text-align: center;
        transition: all 0.3s ease;
    }

    .problem-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 8px 20px rgba(0,0,0,0.12);
    }

    .icon-container {
        width: 50px;
        height: 50px;
        background: #f1f5f9;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 1.5rem;
        border: 2px solid #e2e8f0;
    }

    .solution-card {
        background: white;
        padding: 2.5rem 2rem;
        border-radius: 16px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.08);
        border: 1px solid #e5e7eb;
        text-align: center;
        transition: all 0.3s ease;
    }

    .solution-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 12px 28px rgba(0,0,0,0.15);
        border-color: #2563eb;
    }

    .solution-icon {
        width: 60px;
        height: 60px;
        background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 1.5rem;
        border: 2px solid #2563eb;
    }

    .stats-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 2rem;
        margin: 2rem 0;
    }

    .features-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 2rem;
        margin: 3rem 0;
    }

    /* Responsive enhancements */
    @media (max-width: 768px) {
        .hero-title {
            font-size: 2.5rem;
        }

        .hero-subtitle {
            font-size: 1.1rem;
        }

        .problem-card,
        .solution-card {
            padding: 1.5rem;
        }

        .stats-grid,
        .features-grid {
            grid-template-columns: 1fr;
            gap: 1.5rem;
        }
    }

    /* CTA button hover effects */
    a[href="/signup"]:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(37, 99, 235, 0.4) !important;
    }

    /* Testimonial cards styling */
    .testimonial-card {
        background: white;
        padding: 2rem;
        border-radius: 12px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
        border: 1px solid #e5e7eb;
        transition: all 0.3s ease;
    }

    .testimonial-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    }

    /* Enhanced Tender Card Styles */
    .tender-card-enhanced {
        background: white;
        border-radius: 12px;
        padding: 1.75rem;
        border: 1px solid #e2e8f0;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
        transition: all 0.3s ease;
        position: relative;
        overflow: hidden;
    }

    .tender-card-enhanced:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
        border-color: #cbd5e1;
    }

    .tender-badges-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .tender-category-badge {
        padding: 0.25rem 0.625rem;
        border-radius: 5px;
        font-size: 0.75rem;
        font-weight: 600;
        letter-spacing: 0.025em;
    }

    .tender-badges-row {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .tender-badge {
        padding: 0.25rem 0.625rem;
        border-radius: 5px;
        font-size: 0.75rem;
        font-weight: 600;
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
    }

    .badge-urgent-new {
        background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);
        color: #dc2626;
        border: 1px solid #fca5a5;
        animation: pulse 2s infinite;
    }

    @keyframes pulse {
        0%, 100% { opacity: 1; }
        50% { opacity: 0.8; }
    }

    .badge-expired {
        background: #f3f4f6;
        color: #6b7280;
        border: 1px solid #d1d5db;
    }

    .badge-closing-soon {
        background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
        color: #d97706;
        border: 1px solid #fbbf24;
    }

    .badge-eu {
        background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
        color: #1e40af;
        border: 1px solid #60a5fa;
    }

    .badge-green {
        background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);
        color: #059669;
        border: 1px solid #34d399;
    }

    .badge-negotiable {
        background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
        color: #2563eb;
        border: 1px solid #60a5fa;
    }

    .badge-municipal {
        background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
        color: #92400e;
        border: 1px solid #f59e0b;
    }

    .badge-match-score {
        background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
        color: #92400e;
        border: 1px solid #f59e0b;
        font-weight: 700;
    }

    .tender-title-enhanced {
        font-size: 1.125rem;
        font-weight: 700;
        color: #0f172a;
        margin-bottom: 0.5rem;
        line-height: 1.4;
        transition: color 0.2s;
    }

    .tender-card-enhanced:hover .tender-title-enhanced {
        color: #2563eb;
    }

    .tender-organization {
        color: #64748b;
        font-size: 0.875rem;
        font-weight: 500;
    }

    .tender-details-section {
        margin: 1.5rem 0;
    }

    .tender-details-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
        margin-bottom: 0.75rem;
    }

    .tender-detail-item {
        display: flex;
        gap: 0.75rem;
        align-items: flex-start;
    }

    .tender-icon {
        font-size: 1.25rem;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 28px;
    }

    .tender-detail-content {
        flex: 1;
    }

    .tender-detail-label {
        font-size: 0.75rem;
        color: #94a3b8;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin-bottom: 0.125rem;
    }

    .tender-detail-value {
        font-size: 0.95rem;
        font-weight: 600;
        color: #1f2937;
    }

    .tender-description {
        color: #6b7280;
        font-size: 0.875rem;
        line-height: 1.6;
        margin-bottom: 1.5rem;
    }

    .tender-actions {
        display: flex;
        gap: 0.75rem;
    }

    /* Button styles defined above - see lines 854-934 for complete button styling */

    /* Tenders Page Styles */
    .tenders-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
        gap: 1.5rem;
        margin-bottom: 3rem;
    }


    @media (max-width: 768px) {
        .tenders-grid {
            grid-template-columns: 1fr;
        }
    }

    .tender-search-wrapper {
        position: relative;
        max-width: 100%;
    }

    .tender-search-input {
        width: 100%;
        padding: 1rem 1.25rem;
        font-size: 1rem;
        border-radius: 8px;
        border: 2px solid #e5e7eb;
        transition: all 0.2s;
        background: white;
    }

    .tender-search-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }

    .filter-bar {
        background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
        padding: 1.5rem;
        border-radius: 12px;
        border: 1px solid #e2e8f0;
        margin-bottom: 2rem;
    }

    .filter-row {
        display: flex;
        gap: 1.5rem;
        align-items: flex-end;
        flex-wrap: wrap;
    }

    .filter-item {
        display: flex;
        flex-direction: column;
        gap: 0.375rem;
        flex: 1;
        min-width: 150px;
    }

    .filter-label {
        font-size: 0.875rem;
        font-weight: 600;
        color: #374151;
    }

    .filter-select {
        padding: 0.625rem 0.75rem;
        border-radius: 6px;
        border: 1px solid #d1d5db;
        background: white;
        font-size: 0.875rem;
        color: #374151;
        cursor: pointer;
        transition: all 0.2s;
    }

    .filter-select:hover {
        border-color: #9ca3af;
    }

    .filter-select:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }

    .btn-clear-filters {
        padding: 0.625rem 1.25rem;
        background: white;
        color: #6b7280;
        border: 1px solid #d1d5db;
        border-radius: 6px;
        font-size: 0.875rem;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.2s;
    }

    .btn-clear-filters:hover {
        background: #f9fafb;
        border-color: #9ca3af;
        color: #374151;
    }

    .results-count {
        background: white;
        padding: 1rem 1.5rem;
        border-radius: 8px;
        border: 1px solid #e2e8f0;
        color: #374151;
        font-weight: 600;
    }

    /* Pagination Styles */
    .btn-page {
        padding: 0.5rem 0.75rem;
        background: white;
        color: #6b7280;
        border: 1px solid #e5e7eb;
        border-radius: 6px;
        font-size: 0.875rem;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.2s;
        min-width: 36px;
        text-align: center;
    }

    .btn-page:hover {
        background: #f9fafb;
        border-color: #2563eb;
        color: #2563eb;
    }

    .btn-page.active {
        background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
        color: white;
        border-color: #2563eb;
        cursor: default;
    }

    .btn-page:disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }

    /* Loading Spinner */
    .loading-spinner {
        width: 24px;
        height: 24px;
        border: 3px solid #e5e7eb;
        border-top-color: #2563eb;
        border-radius: 50%;
        animation: spinner-rotate 0.8s linear infinite;
    }

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

    /* Modern AI Documents Styles */
    .modern-ai-card {
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 0.75rem;
        padding: 2rem;
        margin-bottom: 2rem;
    }
    
    .modern-ai-section-title {
        font-size: 1.375rem;
        font-weight: 600;
        color: #0f172a;
        margin-bottom: 1.5rem;
    }
    
    /* Upload Area */
    .modern-upload-area {
        border: 2px dashed #cbd5e1;
        border-radius: 0.75rem;
        padding: 3rem;
        text-align: center;
        background: #f8fafc;
        transition: all 0.3s;
    }
    
    .modern-upload-area:hover {
        border-color: #3b82f6;
        background: #eff6ff;
    }
    
    .modern-upload-title {
        font-size: 1.125rem;
        font-weight: 500;
        color: #374151;
        margin-bottom: 0.5rem;
    }
    
    .modern-upload-subtitle {
        color: #64748b;
        font-size: 0.875rem;
        margin-bottom: 1.5rem;
    }
    
    .modern-upload-btn {
        padding: 0.75rem 2rem;
        background: #3b82f6;
        color: white;
        border: none;
        border-radius: 0.5rem;
        font-weight: 500;
        cursor: pointer;
        transition: all 0.2s;
    }
    
    .modern-upload-btn:hover {
        background: #2563eb;
    }
    
    .modern-upload-note {
        color: #94a3b8;
        font-size: 0.8125rem;
        margin-top: 1rem;
    }
    
    /* Form Styles */
    .modern-form-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1.5rem;
        margin-bottom: 1.5rem;
    }
    
    .modern-form-row-3 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.5rem;
        margin-bottom: 1.5rem;
    }
    
    .modern-form-label {
        display: block;
        font-size: 0.875rem;
        font-weight: 500;
        color: #374151;
        margin-bottom: 0.5rem;
    }
    
    .modern-form-input {
        width: 100%;
        padding: 0.75rem;
        border: 1px solid #d1d5db;
        border-radius: 0.5rem;
        font-size: 0.875rem;
        transition: all 0.2s;
        background: #ffffff;
        color: #1f2937;
    }
    
    .modern-form-input:focus {
        outline: none;
        border-color: #3b82f6;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
    }
    
    .modern-form-select {
        width: 100%;
        padding: 0.75rem;
        border: 1px solid #d1d5db;
        border-radius: 0.5rem;
        font-size: 0.875rem;
        transition: all 0.2s;
        background: #ffffff;
        color: #1f2937;
        cursor: pointer;
        appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath fill='%236b7280' d='M7 7l3 3 3-3 1.41 1.41L10 12.83 5.59 8.41z'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 0.75rem center;
        background-size: 1.25rem;
    }
    
    .modern-form-select:focus {
        outline: none;
        border-color: #3b82f6;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
    }
    
    .modern-form-textarea {
        width: 100%;
        min-height: 100px;
        padding: 0.75rem;
        border: 1px solid #d1d5db;
        border-radius: 0.5rem;
        font-size: 0.875rem;
        resize: vertical;
        transition: all 0.2s;
        margin-bottom: 1.5rem;
        background: #ffffff;
        color: #1f2937;
    }
    
    .modern-form-textarea:focus {
        outline: none;
        border-color: #3b82f6;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
    }
    
    /* Checkbox Options */
    .modern-options-list {
        margin-bottom: 2rem;
    }
    
    .modern-checkbox-item {
        display: flex;
        align-items: center;
        padding: 0.75rem 0;
        cursor: pointer;
        border-bottom: 1px solid #f1f5f9;
    }
    
    .modern-checkbox-item:last-child {
        border-bottom: none;
    }
    
    .modern-checkbox {
        margin-right: 0.75rem;
        width: 16px;
        height: 16px;
    }
    
    .modern-checkbox-label {
        color: #475569;
        font-size: 0.875rem;
        font-weight: 500;
    }
    
    /* Generate Button */
    .modern-generate-btn {
        width: 100%;
        padding: 1rem;
        background: #3b82f6;
        color: white;
        border: none;
        border-radius: 0.5rem;
        font-size: 1rem;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.2s;
    }
    
    .modern-generate-btn:hover {
        background: #2563eb;
        transform: translateY(-1px);
    }
    
    /* Sidebar Styles */
    .modern-sidebar-title {
        font-size: 1.25rem;
        font-weight: 600;
        color: #0f172a;
        margin-bottom: 1.25rem;
    }
    
    .modern-steps-container {
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 0.75rem;
        padding: 1.5rem;
        margin-bottom: 2rem;
    }
    
    .modern-step-item {
        display: flex;
        gap: 1rem;
        margin-bottom: 1.5rem;
    }
    
    .modern-step-item:last-child {
        margin-bottom: 0;
    }
    
    .modern-step-number {
        width: 32px;
        height: 32px;
        background: #eff6ff;
        border: 2px solid #3b82f6;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 600;
        font-size: 0.875rem;
        color: #3b82f6;
        flex-shrink: 0;
    }
    
    .modern-step-content {
        flex: 1;
    }
    
    .modern-step-title {
        font-size: 0.9375rem;
        font-weight: 600;
        color: #0f172a;
        margin-bottom: 0.25rem;
    }
    
    .modern-step-desc {
        color: #64748b;
        font-size: 0.8125rem;
        line-height: 1.5;
    }
    
    /* Capabilities List */
    .modern-capabilities-list {
        padding: 0;
    }
    
    .modern-capability-item {
        display: flex;
        align-items: flex-start;
        padding: 0.625rem 0;
        gap: 0.5rem;
    }
    
    .modern-capability-text {
        color: #475569;
        font-size: 0.875rem;
        line-height: 1.5;
    }
    
    /* Responsive AI Documents */
    @media (max-width: 768px) {
        .modern-form-row,
        .modern-form-row-3 {
            grid-template-columns: 1fr;
        }
        
        .modern-upload-area {
            padding: 2rem 1rem;
        }
        
        .modern-ai-card {
            padding: 1.5rem;
        }
    }
    
    /* Breadcrumb */
    .breadcrumb {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-bottom: 2rem;
        color: #4b5563;
        font-size: 0.9rem;
    }
    
    .breadcrumb a {
        color: #2563eb;
        text-decoration: none;
    }
    
    .breadcrumb a:hover {
        text-decoration: underline;
    }
    
    /* Loading Spinner */
    .spinner {
        width: 24px;
        height: 24px;
        border: 2px solid #e5e7eb;
        border-top: 2px solid #2563eb;
        border-radius: 50%;
        animation: spin 1s linear infinite;
        display: inline-block;
    }
    
    /* Notification */
    .notification {
        position: fixed;
        top: 20px;
        right: 20px;
        background: #ffffff;
        border-radius: var(--radius-lg);
        padding: 1.25rem 1.75rem;
        box-shadow: 0 10px 25px rgba(0,0,0,0.15);
        border-left: 4px solid #2563eb;
        z-index: var(--z-notification);
        min-width: 300px;
    }
    
    .notification.success {
        border-left-color: #16a34a;
    }
    
    .notification.error {
        border-left-color: #dc2626;
    }
    
    /* Dashboard Stats Grid */
    .dashboard-stats-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 1.25rem;
        margin: 2rem 0;
    }
    
    .dashboard-stat-card {
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 0.75rem;
        padding: 1.5rem;
        text-align: center;
    }
    
    .dashboard-stat-number {
        font-size: 2rem;
        font-weight: 700;
        color: #3b82f6;
        margin-bottom: 0.5rem;
        line-height: 1;
    }
    
    .dashboard-stat-label {
        color: #64748b;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        font-weight: 600;
    }
    
    /* Performance Metrics Grid */
    .perf-metrics-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 1rem;
    }
    
    .perf-metric-card {
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 0.5rem;
        padding: 1.25rem;
        text-align: center;
    }
    
    .perf-metric-value {
        font-size: 1.5rem;
        font-weight: 700;
        color: #3b82f6;
        margin-bottom: 0.25rem;
        line-height: 1;
    }
    
    .perf-metric-label {
        color: #64748b;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.3px;
        font-weight: 500;
        margin-bottom: 0.5rem;
    }
    
    .perf-metric-change {
        font-size: 0.75rem;
        font-weight: 600;
    }
    
    .perf-metric-change.positive {
        color: #16a34a;
    }
    
    .perf-metric-change.negative {
        color: #dc2626;
    }
    
    /* Dashboard Action Buttons */
    .dashboard-action-btn {
        display: block;
        width: 100%;
        padding: 0.625rem 1rem;
        margin-bottom: 0.625rem;
        border: 1px solid #e2e8f0;
        border-radius: 0.5rem;
        background: white;
        color: #475569;
        font-size: 0.875rem;
        font-weight: 500;
        text-decoration: none;
        text-align: center;
        transition: all 0.2s;
    }
    
    .dashboard-action-btn:hover {
        background: #f8fafc;
        border-color: #cbd5e1;
        color: #1e293b;
    }
    
    .dashboard-action-btn.primary {
        background: #3b82f6;
        color: white;
        border-color: #3b82f6;
    }
    
    .dashboard-action-btn.primary:hover {
        background: #2563eb;
        border-color: #2563eb;
    }
    
    .dashboard-action-btn.outline {
        border-color: #3b82f6;
        color: #3b82f6;
    }
    
    .dashboard-action-btn.outline:hover {
        background: #eff6ff;
    }
    
    /* Deadline Items */
    .deadline-item {
        padding: 0.75rem 0;
        border-bottom: 1px solid #f1f5f9;
    }
    
    .deadline-item:last-child {
        border-bottom: none;
    }
    
    /* Responsive Dashboard */
    @media (max-width: 1200px) {
        .dashboard-stats-grid {
            grid-template-columns: repeat(2, 1fr);
        }
        
        .perf-metrics-grid {
            grid-template-columns: repeat(2, 1fr);
        }
    }
    
    @media (max-width: 768px) {
        .dashboard-stats-grid {
            grid-template-columns: 1fr;
        }
        
        .perf-metrics-grid {
            grid-template-columns: 1fr;
        }
    }
    
    /* Help/FAQ Styles */
    .faq-item {
        border-bottom: 1px solid #e5e7eb;
        padding: 1.5rem 0;
    }
    
    .faq-question {
        font-weight: 600;
        color: #111827;
        margin-bottom: 1rem;
        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    .faq-answer {
        color: #4b5563;
        line-height: 1.7;
        padding-left: 1rem;
    }
    
    /* Search Bar */
    .search-bar {
        position: relative;
        max-width: 500px;
        margin: 0 auto 2rem;
    }
    
    .search-input {
        width: 100%;
        padding: 1rem 1.25rem 1rem 3rem;
        border: 2px solid #e5e7eb;
        border-radius: 9999px;
        font-size: 0.95rem;
        transition: all 0.2s;
        background: #ffffff;
        color: #1f2937;
    }
    
    .search-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }
    
    .search-icon {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #9ca3af;
    }
    
    /* Responsive Design */
    @media (max-width: 768px) {
        .hero-title {
            font-size: 2.75rem;
        }

        .dashboard-grid {
            grid-template-columns: 1fr;
        }

        .nav-links {
            display: none;
        }

        .container {
            padding: 0 1rem;
        }

        .stats-grid {
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        }

        .features-grid {
            grid-template-columns: 1fr;
        }

        .pricing-grid {
            grid-template-columns: 1fr;
        }

        .modern-pricing-grid {
            grid-template-columns: 1fr;
        }

        .modal {
            width: 95%;
            padding: 2rem;
        }

        .tabs {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
        }

        .tab {
            white-space: nowrap;
            min-width: max-content;
        }

        .feature-card {
            min-width: 0;
        }

        .center-card {
            padding: 1.5rem;
            margin: 1.5rem auto;
        }

        .section-title {
            font-size: 1.75rem;
        }
    }
    
    /* Checkbox Styles */
    input[type="checkbox"] {
        -webkit-appearance: none;
        appearance: none;
        width: 18px;
        height: 18px;
        min-width: 18px;
        min-height: 18px;
        border: 2px solid #d1d5db;
        border-radius: 4px;
        background: #ffffff;
        position: relative;
        cursor: pointer;
        transition: all 0.2s;
        flex-shrink: 0;
    }
    
    input[type="checkbox"]:checked {
        background: #2563eb;
        border-color: #2563eb;
    }
    
    input[type="checkbox"]:checked::after {
        content: "";
        position: absolute;
        left: 5px;
        top: 1px;
        width: 5px;
        height: 10px;
        border: solid #ffffff;
        border-width: 0 2px 2px 0;
        transform: rotate(45deg);
    }
    
    input[type="checkbox"]:hover {
        border-color: #9ca3af;
    }
    
    input[type="checkbox"]:focus {
        outline: none;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }
    
    /* Modern Authentication Styles */
    .modern-auth-section {
        min-height: calc(100vh - 80px);
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, #f8faff 0%, #e8f2ff 100%);
        padding: 0;
        position: relative;
        width: 100%;
    }
    
    .modern-auth-section .container {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        padding: 2rem 1rem;
        box-sizing: border-box;
    }
    
    .modern-auth-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: radial-gradient(circle at 30% 20%, rgba(37, 99, 235, 0.1) 0%, transparent 50%),
                    radial-gradient(circle at 70% 80%, rgba(16, 185, 129, 0.1) 0%, transparent 50%);
        pointer-events: none;
    }
    
    .modern-auth-card {
        background: #ffffff;
        border-radius: 1.5rem;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08), 0 8px 16px rgba(0, 0, 0, 0.06);
        padding: 3rem;
        max-width: 500px;
        width: 100%;
        position: relative;
        z-index: 1;
        border: 1px solid rgba(255, 255, 255, 0.8);
        margin: 0 auto;
    }
    
    .modern-auth-header {
        text-align: center;
        margin-bottom: 2.5rem;
    }
    
    .modern-auth-title {
        font-size: 1.875rem;
        font-weight: 700;
        color: #1f2937;
        margin-bottom: 0.5rem;
        letter-spacing: -0.025em;
    }
    
    .modern-auth-subtitle {
        font-size: 0.95rem;
        color: #6b7280;
        line-height: 1.5;
    }
    
    .modern-auth-label {
        display: block;
        font-size: 0.875rem;
        font-weight: 600;
        color: #374151;
        margin-bottom: 0.5rem;
    }
    
    .modern-auth-input {
        width: 100%;
        padding: 1rem 1.25rem;
        font-size: 1rem;
        border: 2px solid #e5e7eb;
        border-radius: 0.875rem;
        background: #ffffff;
        color: #1f2937;
        transition: all 0.3s ease;
        margin-bottom: 0;
        box-sizing: border-box;
    }
    
    .modern-auth-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1);
        transform: translateY(-1px);
    }
    
    .modern-auth-input::placeholder {
        color: #9ca3af;
    }
    
    .modern-auth-select {
        width: 100%;
        padding: 1rem 1.25rem;
        font-size: 1rem;
        border: 2px solid #e5e7eb;
        border-radius: 0.875rem;
        background: #ffffff;
        color: #1f2937;
        cursor: pointer;
        transition: all 0.3s ease;
        margin-bottom: 0;
        box-sizing: border-box;
    }
    
    .modern-auth-select:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1);
        transform: translateY(-1px);
    }

    .modern-auth-select:not([value=""]) {
        background: #ffffff !important;
        color: #1f2937 !important;
    }

    .modern-auth-select option {
        background: #ffffff;
        color: #1f2937;
        padding: 0.5rem;
    }
    
    .modern-auth-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1.25rem;
        margin-bottom: 1.5rem;
    }
    
    .modern-auth-checkbox-group {
        margin-bottom: 2rem;
    }
    
    .modern-auth-form-group {
        margin-bottom: 1.5rem;
    }
    
    .modern-auth-checkbox-label {
        display: flex;
        align-items: flex-start;
        gap: 0.75rem;
        font-size: 0.875rem;
        color: #4b5563;
        line-height: 1.5;
        cursor: pointer;
        flex-wrap: wrap;
    }
    
    .modern-auth-checkbox-label.simple {
        align-items: center;
        gap: 0.5rem;
    }
    
    .modern-auth-checkbox {
        margin: 0;
        flex-shrink: 0;
    }
    
    .modern-auth-btn-primary {
        width: 100%;
        padding: 1rem 1.5rem;
        font-size: 1rem;
        font-weight: 600;
        color: #ffffff;
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        border: 2px solid transparent;
        border-radius: 0.875rem;
        cursor: pointer;
        transition: all 0.3s ease;
        min-height: 50px;
        display: flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
    }
    
    .modern-auth-btn-primary:hover {
        background: linear-gradient(135deg, #1d4ed8 0%, #1e3a8a 100%);
        transform: translateY(-2px);
        box-shadow: 0 8px 20px rgba(37, 99, 235, 0.3);
    }
    
    /* Auth Input Styles - Fix for black inputs */
    .modern-auth-input {
        width: 100%;
        padding: 0.875rem 1.25rem;
        border: 2px solid #e5e7eb;
        border-radius: 0.75rem;
        font-size: 0.95rem;
        transition: all 0.2s;
        background-color: #ffffff !important;
        color: #1f2937 !important;
        -webkit-text-fill-color: #1f2937 !important;
    }
    
    .modern-auth-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
        background-color: #ffffff !important;
    }
    
    /* Fix for browser autofill styling */
    .modern-auth-input:-webkit-autofill,
    .modern-auth-input:-webkit-autofill:hover,
    .modern-auth-input:-webkit-autofill:focus,
    .modern-auth-input:-webkit-autofill:active {
        -webkit-box-shadow: 0 0 0 30px white inset !important;
        -webkit-text-fill-color: #1f2937 !important;
        box-shadow: 0 0 0 30px white inset !important;
        background-color: #ffffff !important;
    }
    
    /* Search Input Styles - Fix for black inputs */
    .search-input {
        width: 100%;
        padding: 0.75rem 1rem;
        border: 1px solid #d1d5db;
        border-radius: 0.5rem;
        font-size: 0.9rem;
        transition: all 0.2s;
        background: #ffffff !important;
        color: #1f2937 !important;
    }
    
    .search-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }
    
    .modern-auth-btn-primary:active {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
    }

    .modern-auth-btn-secondary {
        padding: 1rem 1.5rem;
        font-size: 1rem;
        font-weight: 600;
        color: #4b5563;
        background: #ffffff;
        border: 2px solid #e5e7eb;
        border-radius: 0.875rem;
        cursor: pointer;
        transition: all 0.3s ease;
        min-height: 50px;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
    }

    .modern-auth-btn-secondary:hover {
        background: #f9fafb;
        border-color: #d1d5db;
        color: #374151;
        transform: translateY(-2px);
        box-shadow: 0 8px 20px rgba(107, 114, 128, 0.15);
    }

    .modern-auth-btn-secondary:active {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(107, 114, 128, 0.15);
    }

    /* Button normalization for perfect alignment */
    .modern-auth-btn-primary,
    .modern-auth-btn-secondary {
        /* Reset all default button/link styles */
        margin: 0;
        padding: 1rem 1.5rem;
        border: 2px solid;
        outline: none;
        font-family: inherit;
        font-size: 1rem;
        font-weight: 600;
        line-height: 1;
        text-align: center;
        text-decoration: none;
        white-space: nowrap;
        vertical-align: baseline;

        /* Consistent box model */
        box-sizing: border-box;
        min-height: 50px;

        /* Consistent display and alignment */
        display: inline-flex;
        align-items: center;
        justify-content: center;

        /* Consistent interaction */
        cursor: pointer;
        user-select: none;

        /* Consistent transitions */
        transition: all 0.3s ease;

        /* Border radius */
        border-radius: 0.875rem;
    }

    .modern-auth-footer {
        text-align: center;
    }
    
    .modern-auth-text {
        font-size: 0.875rem;
        color: #6b7280;
    }
    
    .modern-auth-link {
        color: #2563eb;
        text-decoration: none;
        font-weight: 500;
        transition: color 0.2s;
    }
    
    .modern-auth-link:hover {
        color: #1d4ed8;
        text-decoration: underline;
    }
    
    .modern-auth-forgot {
        display: block;
        text-align: right;
        margin-top: 0.5rem;
        margin-bottom: 1.25rem;
        font-size: 0.875rem;
        color: #2563eb;
        text-decoration: none;
        font-weight: 500;
        transition: color 0.2s;
    }
    
    .modern-auth-forgot:hover {
        color: #1d4ed8;
        text-decoration: underline;
    }
    
    @media (max-width: 640px) {
        .modern-auth-section {
            padding: 0;
            min-height: calc(100vh - 60px);
        }
        
        .modern-auth-section .container {
            padding: 1rem 0.5rem;
        }
        
        .modern-auth-card {
            padding: 2rem 1.5rem;
            margin: 0;
            max-width: none;
            width: calc(100% - 1rem);
        }
        
        .modern-auth-title {
            font-size: 1.5rem;
        }
        
        .modern-auth-row {
            grid-template-columns: 1fr;
            gap: 0;
        }
        
        .modern-auth-input,
        .modern-auth-select {
            padding: 0.875rem 1rem;
        }
    }
    
    @media (max-width: 480px) {
        .hero-title {
            font-size: 2.25rem;
        }
        
        .tender-meta {
            flex-direction: column;
            gap: 0.5rem;
        }
        
        .btn {
            padding: 0.5rem 1rem;
            font-size: 0.75rem;
        }
        
        .card {
            padding: 1.25rem;
        }
    }
    
    /* Promotional Banner Styles */
    .promotional-banner {
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        color: white;
        padding: 0.75rem 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        font-size: 0.9rem;
        position: relative;
        z-index: var(--z-dropdown);
        overflow: hidden;
    }
    
    .promo-content {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1rem;
        flex-wrap: wrap;
        position: relative;
    }
    
    .promo-badge {
        background: rgba(255, 255, 255, 0.2);
        padding: 0.25rem 0.75rem;
        border-radius: 1rem;
        font-weight: 600;
        font-size: 0.8rem;
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
    }
    
    .promo-text {
        color: rgba(255, 255, 255, 0.95);
        font-weight: 500;
    }
    
    .promo-cta {
        background: rgba(255, 255, 255, 0.15);
        color: white;
        padding: 0.5rem 1rem;
        border-radius: 0.5rem;
        text-decoration: none;
        font-weight: 600;
        font-size: 0.85rem;
        border: 1px solid rgba(255, 255, 255, 0.2);
        transition: all 0.2s ease;
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
    }
    
    .promo-cta:hover {
        background: rgba(255, 255, 255, 0.25);
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    }
    
    .promo-highlight {
        background: rgba(16, 185, 129, 0.2);
        color: #10b981;
        padding: 0.25rem 0.75rem;
        border-radius: 0.5rem;
        font-weight: 600;
        font-size: 0.8rem;
        border: 1px solid rgba(16, 185, 129, 0.3);
    }
    
    .promo-close {
        background: none;
        border: none;
        color: rgba(255, 255, 255, 0.7);
        font-size: 1.2rem;
        cursor: pointer;
        padding: 0.25rem 0.5rem;
        border-radius: 0.25rem;
        transition: all 0.2s ease;
        position: absolute;
        right: 1rem;
        top: 50%;
        transform: translateY(-50%);
    }
    
    .promo-close:hover {
        background: rgba(255, 255, 255, 0.1);
        color: white;
    }
    
    /* Navigation Highlight Styles */
    .nav-highlight {
        background: rgba(16, 185, 129, 0.1);
        color: #059669;
        padding: 0.25rem 0.75rem;
        border-radius: 0.5rem;
        font-weight: 600;
        font-size: 0.75rem;
        border: 1px solid rgba(16, 185, 129, 0.2);
        white-space: nowrap;
    }
    
    /* Responsive adjustments for promotional banner */
    @media (max-width: 768px) {
        .promo-content {
            flex-direction: column;
            text-align: center;
            gap: 0.5rem;
            padding: 0 0.75rem;
            max-width: 100%;
            overflow: hidden;
        }

        .promo-content > div:first-child {
            flex-direction: column;
            gap: 0.5rem;
            max-width: 100%;
        }

        .promotional-banner {
            padding: 0.5rem 0;
        }

        .promo-text {
            font-size: 0.75rem;
            text-align: center;
            word-break: break-word;
            overflow-wrap: break-word;
            max-width: 100%;
        }

        .promo-badge {
            font-size: 0.7rem;
            padding: 0.2rem 0.5rem;
        }

        .promo-cta {
            font-size: 0.75rem;
            padding: 0.35rem 0.75rem;
        }

        .nav-highlight {
            font-size: 0.7rem;
            padding: 0.2rem 0.5rem;
        }
    }

    @media (max-width: 480px) {
        .promo-content > div:first-child {
            flex-direction: column;
            gap: 0.5rem;
        }

        .promo-text {
            font-size: 0.7rem;
            text-align: center;
        }

        .promo-badge {
            font-size: 0.65rem;
        }
    }
    
    /* Modern Progress Indicator for Onboarding */
    .modern-progress-container {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 2.5rem;
        padding: 0 1rem;
    }
    
    .modern-progress-step {
        width: 2.5rem;
        height: 2.5rem;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 600;
        font-size: 0.875rem;
        background: #f3f4f6;
        color: #9ca3af;
        border: 2px solid #e5e7eb;
        position: relative;
        z-index: 1;
    }
    
    .modern-progress-step.active {
        background: #2563eb;
        color: white;
        border-color: #2563eb;
        box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1);
    }
    
    .modern-progress-step.completed {
        background: #10b981;
        color: white;
        border-color: #10b981;
    }
    
    .modern-progress-line {
        flex: 1;
        height: 2px;
        background: #e5e7eb;
        margin: 0 0.75rem;
        position: relative;
    }
    
    .modern-progress-line.completed {
        background: #10b981;
    }
    
    /* Checkbox grid for onboarding - matches project patterns */
    .modern-checkbox-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 0.75rem;
        margin-top: 1rem;
    }
    
    /* Responsive adjustments for progress indicator */
    @media (max-width: 768px) {
        .modern-progress-container {
            padding: 0 0.5rem;
            margin-bottom: 2rem;
        }
        
        .modern-progress-step {
            width: 2rem;
            height: 2rem;
            font-size: 0.75rem;
        }
        
        .modern-progress-line {
            margin: 0 0.5rem;
        }
        
        .modern-checkbox-grid {
            grid-template-columns: 1fr;
            gap: 0.5rem;
        }
        
        /* Make 2x2 grid responsive on mobile */
        .onboarding-2x2-grid {
            grid-template-columns: 1fr !important;
            gap: 1rem !important;
        }
    }
    
    @media (max-width: 480px) {
        .modern-progress-container {
            margin-bottom: 1.5rem;
        }
        
        .modern-progress-step {
            width: 1.75rem;
            height: 1.75rem;
            font-size: 0.7rem;
        }

        .modern-progress-line {
            margin: 0 0.25rem;
            height: 1px;
        }
    }

    /* Tender Chat Styles */
    .chat-fab {
        position: fixed;
        bottom: 2rem;
        right: 2rem;
        z-index: var(--z-sticky);
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        color: white;
        padding: 1rem 1.5rem;
        border-radius: 50px;
        border: none;
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4);
        cursor: pointer;
        transition: all 0.3s ease;
        font-weight: 600;
        font-size: 0.9375rem;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .chat-fab:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(37, 99, 235, 0.5);
    }

    .chat-popup {
        position: fixed;
        bottom: 2rem;
        right: 2rem;
        width: 650px;
        max-height: 800px;
        background: white;
        border-radius: 16px;
        box-shadow: 0 20px 40px rgba(37, 99, 235, 0.15), 0 8px 32px rgba(0, 0, 0, 0.1);
        z-index: calc(var(--z-sticky) - 1);
        display: flex;
        flex-direction: column;
        transition: transform 0.3s ease, opacity 0.3s ease;
        overflow: hidden;
        border: 1px solid rgba(37, 99, 235, 0.1);
    }

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

    .chat-header {
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        color: white;
        padding: 1.25rem 1.5rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: none;
        position: relative;
    }

    .chat-header::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 1px;
        background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.2) 50%, transparent 100%);
    }

    .chat-messages {
        flex: 1;
        overflow-y: auto;
        padding: 1.5rem;
        max-height: 600px;
        background: linear-gradient(180deg, #fafbff 0%, #f8fafc 100%);
    }

    .chat-message-user {
        background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
        padding: 1rem 1.25rem;
        border-radius: 18px 18px 6px 18px;
        margin-bottom: 1rem;
        margin-left: 3rem;
        box-shadow: 0 2px 8px rgba(37, 99, 235, 0.15);
        color: #111827 !important;
        border: 1px solid rgba(37, 99, 235, 0.1);
        position: relative;
    }

    .chat-message-user::before {
        content: '';
        position: absolute;
        bottom: 0;
        right: -6px;
        width: 0;
        height: 0;
        border: 6px solid transparent;
        border-top-color: #bfdbfe;
        border-left-color: #bfdbfe;
    }

    .chat-message-user * {
        color: #111827 !important;
    }

    .chat-message-ai {
        background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
        padding: 1rem 1.25rem;
        border-radius: 18px 18px 18px 6px;
        margin-bottom: 1rem;
        margin-right: 3rem;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
        border: 1px solid rgba(148, 163, 184, 0.2);
        color: #111827 !important;
        position: relative;
    }

    .chat-message-ai::before {
        content: '';
        position: absolute;
        bottom: 0;
        left: -6px;
        width: 0;
        height: 0;
        border: 6px solid transparent;
        border-top-color: #f8fafc;
        border-right-color: #f8fafc;
    }

    .chat-message-ai * {
        color: #111827 !important;
    }

    .chat-input-container {
        display: flex;
        gap: 0.5rem;
        padding: 1rem;
        background: white;
        border-top: 1px solid #e5e7eb;
    }

    .chat-input {
        flex: 1;
        padding: 0.75rem 1rem;
        border: 1px solid #d1d5db;
        border-radius: 8px;
        font-size: 0.9375rem;
        transition: all 0.2s;
        background: white;
        color: #111827;
    }

    .chat-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
        background: white;
    }

    .chat-input::placeholder {
        color: #9ca3af;
    }

    .chat-send-btn {
        padding: 0.75rem 1.5rem;
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        color: white;
        border: none;
        border-radius: 8px;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.2s;
    }

    .chat-send-btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 4px 8px rgba(37, 99, 235, 0.3);
    }

    .loading-dots {
        display: inline-block;
        font-weight: 500;
    }

    .loading-dots::after {
        content: '...';
        animation: loadingDots 1.5s infinite;
    }

    @keyframes loadingDots {
        0%, 20% { content: '.'; }
        40% { content: '..'; }
        60%, 100% { content: '...'; }
    }

    /* Mobile responsive */
    @media (max-width: 768px) {
        .chat-fab {
            bottom: 1rem;
            right: 1rem;
            padding: 0.875rem 1.25rem;
            font-size: 0.875rem;
        }

        .chat-popup {
            width: calc(100vw - 2rem);
            right: 1rem;
            left: 1rem;
            bottom: 1rem;
            max-height: 500px;
        }

        .chat-message-user {
            margin-left: 1rem;
        }

        .chat-message-ai {
            margin-right: 1rem;
        }
    }

    /* Smooth scrollbar for chat messages */
    .chat-messages::-webkit-scrollbar {
        width: 6px;
    }

    .chat-messages::-webkit-scrollbar-track {
        background: #f3f4f6;
    }

    .chat-messages::-webkit-scrollbar-thumb {
        background: #d1d5db;
        border-radius: 3px;
    }

    .chat-messages::-webkit-scrollbar-thumb:hover {
        background: #9ca3af;
    }

    /* Share Buttons Styles */
    .share-buttons-container {
        display: flex;
        gap: 0.5rem;
        align-items: center;
    }

    .share-label {
        font-size: 0.875rem;
        font-weight: 500;
        color: #6b7280;
        margin-right: 0.5rem;
    }

    .share-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border-radius: 8px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        cursor: pointer;
        transition: all 0.2s ease;
        color: #64748b;
        text-decoration: none;
    }

    .share-btn svg {
        width: 18px;
        height: 18px;
    }

    .share-btn:hover {
        background: #e2e8f0;
        border-color: #cbd5e1;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    }

    /* Twitter/X hover state */
    .share-btn.twitter:hover {
        background: #f0f9ff;
        color: #0f172a;
        border-color: #e0e7ff;
    }

    /* LinkedIn hover state */
    .share-btn.linkedin:hover {
        background: #eff6ff;
        color: #0A66C2;
        border-color: #bfdbfe;
    }

    /* Facebook hover state */
    .share-btn.facebook:hover {
        background: #eff6ff;
        color: #1877F2;
        border-color: #bfdbfe;
    }

    /* Copy link hover and copied states */
    .share-btn.copy-link:hover {
        background: #f0fdf4;
        color: #16a34a;
        border-color: #bbf7d0;
    }

    .share-btn.copy-link.copied {
        background: #f0fdf4;
        color: #16a34a;
        border-color: #22c55e;
    }

    /* Copy confirmation tooltip */
    .copy-tooltip {
        position: absolute;
        background: #1f2937;
        color: white;
        padding: 0.5rem 0.75rem;
        border-radius: 6px;
        font-size: 0.75rem;
        font-weight: 500;
        top: -40px;
        left: 50%;
        transform: translateX(-50%);
        opacity: 0;
        visibility: hidden;
        transition: all 0.2s ease;
        pointer-events: none;
        white-space: nowrap;
        z-index: var(--z-dropdown);
    }

    .copy-tooltip::after {
        content: '';
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%);
        border: 5px solid transparent;
        border-top-color: #1f2937;
    }

    .copy-tooltip.show {
        opacity: 1;
        visibility: visible;
        top: -45px;
    }

    /* Share button container variations */
    .share-buttons-container.compact {
        gap: 0.375rem;
    }

    .share-buttons-container.compact .share-btn {
        width: 32px;
        height: 32px;
    }

    .share-buttons-container.compact .share-btn svg {
        width: 16px;
        height: 16px;
    }

    .share-buttons-container.compact .share-label {
        font-size: 0.8125rem;
    }

    /* Header style share buttons (for inline with title) */
    .share-buttons-header {
        display: flex;
        gap: 0.5rem;
        align-items: center;
        padding: 0.5rem 0.75rem;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
    }

    .share-buttons-header .share-label {
        display: none;
    }

    /* Mobile responsive share buttons */
    @media (max-width: 768px) {
        .share-buttons-container {
            gap: 0.375rem;
        }

        .share-btn {
            width: 40px;
            height: 40px;
        }

        .share-btn svg {
            width: 20px;
            height: 20px;
        }

        .share-label {
            display: none;
        }

        .share-buttons-header {
            padding: 0.375rem 0.5rem;
        }
    }

    /* HTMX disabled button styles for preventing double-clicks */
    button[disabled],
    .btn[disabled],
    button.htmx-request,
    .btn.htmx-request {
        opacity: 0.6;
        cursor: not-allowed !important;
        pointer-events: none;
    }

    /* Loading indicator for buttons during HTMX request */
    button.htmx-request::after,
    .btn.htmx-request::after {
        content: '';
        display: inline-block;
        width: 14px;
        height: 14px;
        margin-left: 8px;
        border: 2px solid transparent;
        border-top-color: currentColor;
        border-radius: 50%;
        animation: button-spin 0.8s linear infinite;
        vertical-align: middle;
    }

    @keyframes button-spin {
        to {
            transform: rotate(360deg);
        }
    }

    /* ============================================
       TEAM MEMBER ACTION BUTTONS - Professional Design
       ============================================ */

    .tm-action-buttons {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .tm-action-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 2.25rem;
        height: 2.25rem;
        border-radius: 0.5rem;
        border: 1px solid transparent;
        cursor: pointer;
        transition: all 0.2s ease;
        background: transparent;
        padding: 0;
    }

    .tm-action-btn svg {
        width: 1rem;
        height: 1rem;
        transition: transform 0.2s ease;
    }

    /* Delete Button - Red/Danger theme */
    .tm-action-btn.tm-btn-delete {
        background: #fef2f2;
        border-color: #fecaca;
        color: #dc2626;
    }

    .tm-action-btn.tm-btn-delete:hover {
        background: #fee2e2;
        border-color: #f87171;
        box-shadow: 0 2px 8px rgba(220, 38, 38, 0.15);
    }

    .tm-action-btn.tm-btn-delete:hover svg {
        transform: scale(1.1);
    }

    .tm-action-btn.tm-btn-delete:active {
        background: #fecaca;
        transform: scale(0.95);
    }

    /* Edit Button - Blue/Primary theme */
    .tm-action-btn.tm-btn-edit {
        background: #eff6ff;
        border-color: #bfdbfe;
        color: #2563eb;
    }

    .tm-action-btn.tm-btn-edit:hover {
        background: #dbeafe;
        border-color: #60a5fa;
        box-shadow: 0 2px 8px rgba(37, 99, 235, 0.15);
    }

    .tm-action-btn.tm-btn-edit:hover svg {
        transform: scale(1.1);
    }

    .tm-action-btn.tm-btn-edit:active {
        background: #bfdbfe;
        transform: scale(0.95);
    }

    /* Expand/Collapse Button - Neutral/Gray theme */
    .tm-action-btn.tm-btn-toggle {
        background: #f8fafc;
        border-color: #e2e8f0;
        color: #64748b;
    }

    .tm-action-btn.tm-btn-toggle:hover {
        background: #f1f5f9;
        border-color: #cbd5e1;
        box-shadow: 0 2px 8px rgba(100, 116, 139, 0.1);
    }

    .tm-action-btn.tm-btn-toggle:hover svg {
        transform: scale(1.1);
    }

    .tm-action-btn.tm-btn-toggle:active {
        background: #e2e8f0;
        transform: scale(0.95);
    }

    /* Toggle icon rotation for expanded state */
    .tm-action-btn.tm-btn-toggle.expanded svg {
        transform: rotate(180deg);
    }

    .tm-action-btn.tm-btn-toggle.expanded:hover svg {
        transform: rotate(180deg) scale(1.1);
    }

    /* Focus states for accessibility */
    .tm-action-btn:focus {
        outline: none;
        box-shadow: 0 0 0 2px #fff, 0 0 0 4px #3b82f6;
    }

    .tm-action-btn.tm-btn-delete:focus {
        box-shadow: 0 0 0 2px #fff, 0 0 0 4px #dc2626;
    }

    /* Responsive adjustments */
    @media (max-width: 480px) {
        .tm-action-buttons {
            gap: 0.375rem;
        }

        .tm-action-btn {
            width: 2rem;
            height: 2rem;
        }

        .tm-action-btn svg {
            width: 0.875rem;
            height: 0.875rem;
        }
    }

    /* ==================== FEEDBACK WIDGET ==================== */

    .feedback-widget {
        position: fixed;
        bottom: 1.5rem;
        right: 1.5rem;
        z-index: var(--z-toast);
    }

    .feedback-trigger-btn {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        color: white;
        border: none;
        padding: 0.75rem 1.25rem;
        border-radius: 2rem;
        cursor: pointer;
        font-size: 0.875rem;
        font-weight: 600;
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.35);
        transition: all 0.2s ease;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    }

    .feedback-trigger-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(37, 99, 235, 0.45);
    }

    .feedback-trigger-btn.active {
        background: #6b7280;
        box-shadow: 0 2px 8px rgba(107, 114, 128, 0.3);
        transform: none;
    }

    .feedback-trigger-btn svg {
        flex-shrink: 0;
    }

    .feedback-panel {
        position: absolute;
        bottom: calc(100% + 0.75rem);
        right: 0;
        width: 360px;
        background: white;
        border-radius: 1rem;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15), 0 2px 8px rgba(0, 0, 0, 0.08);
        opacity: 0;
        visibility: hidden;
        transform: translateY(10px) scale(0.95);
        transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
        overflow: hidden;
    }

    .feedback-panel.open {
        opacity: 1;
        visibility: visible;
        transform: translateY(0) scale(1);
    }

    .feedback-panel-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1rem 1.25rem;
        border-bottom: 1px solid #e5e7eb;
        background: #f9fafb;
    }

    .feedback-panel-title {
        margin: 0;
        font-size: 1rem;
        font-weight: 700;
        color: #1f2937;
    }

    .feedback-close-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        background: transparent;
        border: none;
        border-radius: 0.375rem;
        cursor: pointer;
        color: #6b7280;
        transition: all 0.15s ease;
    }

    .feedback-close-btn:hover {
        background: #e5e7eb;
        color: #374151;
    }

    .feedback-type-selection {
        padding: 1.25rem;
    }

    .feedback-prompt {
        font-size: 0.875rem;
        color: #6b7280;
        margin: 0 0 1rem 0;
    }

    .feedback-type-btn {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        width: 100%;
        padding: 0.875rem 1rem;
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 0.625rem;
        cursor: pointer;
        font-size: 0.875rem;
        font-weight: 500;
        color: #374151;
        transition: all 0.15s ease;
        margin-bottom: 0.5rem;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
        text-align: left;
    }

    .feedback-type-btn:last-child {
        margin-bottom: 0;
    }

    .feedback-type-btn:hover {
        border-color: #2563eb;
        background: #eff6ff;
        color: #1d4ed8;
    }

    .feedback-type-bug:hover {
        border-color: #dc2626;
        background: #fef2f2;
        color: #dc2626;
    }

    .feedback-type-feature:hover {
        border-color: #f59e0b;
        background: #fffbeb;
        color: #b45309;
    }

    .feedback-type-question:hover {
        border-color: #10b981;
        background: #ecfdf5;
        color: #059669;
    }

    .feedback-form-step {
        padding: 1.25rem;
    }

    .feedback-back-btn {
        display: flex;
        align-items: center;
        gap: 0.375rem;
        background: transparent;
        border: none;
        cursor: pointer;
        font-size: 0.8125rem;
        color: #6b7280;
        padding: 0;
        margin-bottom: 0.75rem;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
        transition: color 0.15s ease;
    }

    .feedback-back-btn:hover {
        color: #374151;
    }

    .feedback-selected-type {
        font-size: 0.9375rem;
        font-weight: 700;
        color: #1f2937;
        margin-bottom: 1rem;
        padding-bottom: 0.75rem;
        border-bottom: 1px solid #f3f4f6;
    }

    .feedback-label {
        display: block;
        font-size: 0.8125rem;
        font-weight: 600;
        color: #4b5563;
        margin-bottom: 0.375rem;
    }

    .feedback-email-group {
        margin-bottom: 0.75rem;
    }

    .feedback-input {
        width: 100%;
        padding: 0.625rem 0.75rem;
        border: 1px solid #d1d5db;
        border-radius: 0.5rem;
        font-size: 0.875rem;
        color: #1f2937;
        background: white;
        transition: border-color 0.15s ease;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
        box-sizing: border-box;
    }

    .feedback-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }

    .feedback-textarea {
        width: 100%;
        padding: 0.625rem 0.75rem;
        border: 1px solid #d1d5db;
        border-radius: 0.5rem;
        font-size: 0.875rem;
        color: #1f2937;
        resize: vertical;
        min-height: 100px;
        max-height: 200px;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
        transition: border-color 0.15s ease;
        box-sizing: border-box;
    }

    .feedback-textarea:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }

    .feedback-submit-btn {
        width: 100%;
        padding: 0.75rem;
        margin-top: 0.75rem;
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        color: white;
        border: none;
        border-radius: 0.5rem;
        font-size: 0.875rem;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.15s ease;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    }

    .feedback-submit-btn:hover {
        background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
        box-shadow: 0 2px 8px rgba(37, 99, 235, 0.3);
    }

    .feedback-submit-btn:disabled {
        opacity: 0.6;
        cursor: not-allowed;
    }

    .feedback-success-step {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 2rem 1.25rem;
        text-align: center;
    }

    .feedback-success-text {
        font-size: 0.9375rem;
        font-weight: 600;
        color: #059669;
        margin: 1rem 0;
    }

    .feedback-done-btn {
        padding: 0.625rem 2rem;
        background: #f3f4f6;
        color: #374151;
        border: none;
        border-radius: 0.5rem;
        font-size: 0.875rem;
        font-weight: 500;
        cursor: pointer;
        transition: background 0.15s ease;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    }

    .feedback-done-btn:hover {
        background: #e5e7eb;
    }

    /* Mobile responsive */
    @media (max-width: 768px) {
        .feedback-widget {
            bottom: 1rem;
            right: 1rem;
        }

        .feedback-btn-text {
            display: none;
        }

        .feedback-trigger-btn {
            padding: 0.75rem;
            border-radius: 50%;
            width: 48px;
            height: 48px;
            justify-content: center;
        }

        .feedback-panel {
            width: calc(100vw - 2rem);
            right: 0;
        }
    }

    /* ==================== Organization / Company Landing Pages ==================== */
    .org-hero {
        background: linear-gradient(135deg, #1e3a5f 0%, #0f172a 100%);
        color: white;
        padding: 4rem 0 3rem;
        margin-bottom: 0;
    }

    .org-hero-content {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 1.5rem;
    }

    .org-badge-container {
        margin-bottom: 1.5rem;
    }

    .org-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        background: rgba(255, 255, 255, 0.15);
        padding: 0.5rem 1rem;
        border-radius: 2rem;
        font-size: 0.875rem;
        backdrop-filter: blur(4px);
    }

    .org-hero-title {
        font-size: 2.5rem;
        font-weight: 800;
        margin-bottom: 0.75rem;
        line-height: 1.2;
        color: #ffffff;
    }

    .org-hero-description {
        font-size: 1.125rem;
        color: rgba(255, 255, 255, 0.85);
        max-width: 700px;
        margin-bottom: 2rem;
        line-height: 1.6;
    }

    .org-stats-row {
        display: flex;
        gap: 3rem;
        flex-wrap: wrap;
        margin-bottom: 1.5rem;
    }

    .org-stat {
        text-align: left;
    }

    .org-stat-value {
        font-size: 2rem;
        font-weight: 700;
        color: #3b82f6;
    }

    .org-stat-label {
        font-size: 0.875rem;
        color: rgba(255, 255, 255, 0.7);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .org-company-details {
        display: flex;
        gap: 1.5rem;
        flex-wrap: wrap;
        margin-top: 1rem;
        padding-top: 1rem;
        border-top: 1px solid rgba(255, 255, 255, 0.15);
    }

    .org-detail-item {
        font-size: 0.9rem;
        color: rgba(255, 255, 255, 0.75);
    }

    .org-detail-link {
        font-size: 0.9rem;
        color: #60a5fa;
        text-decoration: none;
    }

    .org-detail-link:hover {
        color: #93bbfd;
        text-decoration: underline;
    }

    /* Sections */
    .org-tenders-section {
        background: #f8fafc;
        padding: 2.5rem 0;
    }

    .org-categories-section {
        background: white;
        padding: 2.5rem 0;
        border-bottom: 1px solid #e5e7eb;
    }

    .org-suppliers-section {
        background: #f8fafc;
        padding: 2.5rem 0;
    }

    .org-awarded-section {
        background: white;
        padding: 2.5rem 0;
        border-bottom: 1px solid #e5e7eb;
    }

    .org-section-header {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        margin-bottom: 1.5rem;
    }

    .org-section-title {
        font-size: 1.5rem;
        font-weight: 700;
        color: #0f172a;
        margin-bottom: 1.5rem;
    }

    .org-section-count {
        font-size: 1rem;
        color: #64748b;
        font-weight: 500;
    }

    .org-tenders-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
        gap: 1.5rem;
    }

    .org-empty-text {
        color: #64748b;
        font-size: 1rem;
    }

    /* Categories list */
    .org-categories-list {
        display: flex;
        flex-wrap: wrap;
        gap: 0.75rem;
    }

    .org-category-item {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.625rem 1rem;
        background: #f1f5f9;
        border: 1px solid #e2e8f0;
        border-radius: 0.5rem;
        transition: all 0.2s;
    }

    .org-category-item:hover {
        background: #e2e8f0;
    }

    .org-category-name {
        font-size: 0.9rem;
        color: #334155;
        font-weight: 500;
    }

    .org-category-count {
        font-size: 0.8rem;
        color: #64748b;
        background: #e2e8f0;
        padding: 0.125rem 0.5rem;
        border-radius: 1rem;
        font-weight: 600;
    }

    /* Tables */
    .org-table-wrapper {
        overflow-x: auto;
        border-radius: 0.75rem;
        border: 1px solid #e5e7eb;
    }

    .org-table {
        width: 100%;
        border-collapse: collapse;
        background: white;
    }

    .org-table thead th {
        padding: 0.875rem 1rem;
        text-align: left;
        font-weight: 600;
        font-size: 0.85rem;
        color: #475569;
        background: #f8fafc;
        border-bottom: 2px solid #e5e7eb;
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }

    .org-table tbody td {
        padding: 0.875rem 1rem;
        font-size: 0.9rem;
        color: #334155;
        border-bottom: 1px solid #f1f5f9;
    }

    .org-table tbody tr:hover {
        background: #f8fafc;
    }

    .org-table tbody tr:last-child td {
        border-bottom: none;
    }

    .org-table-center {
        text-align: center;
    }

    .org-table-right {
        text-align: right;
    }

    .org-supplier-link,
    .org-tender-link {
        color: #3b82f6;
        text-decoration: none;
        font-weight: 500;
    }

    .org-supplier-link:hover,
    .org-tender-link:hover {
        color: #1d4ed8;
        text-decoration: underline;
    }

    /* Buyer profile (#1407): summary, disambiguation notice, how-to-win */
    .org-summary-section {
        background: white;
        padding: 2rem 0 1.5rem;
    }

    .org-summary {
        max-width: 760px;
    }

    .org-summary-line {
        font-size: 1.05rem;
        line-height: 1.65;
        color: #334155;
        margin: 0 0 0.5rem;
    }

    .org-notice-section {
        background: white;
        padding: 1.5rem 0 0;
    }

    .org-notice {
        border-left: 3px solid #2563eb;
        background: #eff6ff;
        border-radius: 0 0.5rem 0.5rem 0;
        padding: 1rem 1.25rem;
    }

    .org-notice-title {
        font-weight: 700;
        color: #1e3a8a;
        margin-bottom: 0.35rem;
    }

    .org-notice-body {
        margin: 0;
        color: #1e40af;
        font-size: 0.95rem;
        line-height: 1.6;
    }

    .org-advice-section {
        background: #f8fafc;
        padding: 2.5rem 0;
        border-bottom: 1px solid #e5e7eb;
    }

    .org-section-lead {
        color: #64748b;
        font-size: 0.95rem;
        margin: -0.75rem 0 1.25rem;
        max-width: 700px;
    }

    .org-advice-list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: grid;
        gap: 0.75rem;
        max-width: 820px;
    }

    .org-advice-item {
        position: relative;
        padding: 0.9rem 1rem 0.9rem 2.5rem;
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 0.5rem;
        color: #334155;
        line-height: 1.6;
    }

    .org-advice-item::before {
        content: "";
        position: absolute;
        left: 1rem;
        top: 1.35rem;
        width: 0.5rem;
        height: 0.5rem;
        border-radius: 50%;
        background: #2563eb;
    }

    .org-table-note {
        margin: 0.75rem 0 0;
        font-size: 0.85rem;
        color: #64748b;
    }

    /* Responsive */
    @media (max-width: 768px) {
        .org-hero {
            padding: 3rem 0 2rem;
        }

        .org-summary-line {
            font-size: 1rem;
        }

        .org-advice-item {
            padding: 0.8rem 0.9rem 0.8rem 2.1rem;
            font-size: 0.95rem;
        }

        .org-advice-item::before {
            left: 0.85rem;
        }

        .org-hero-title {
            font-size: 1.75rem;
        }

        .org-hero-description {
            font-size: 1rem;
        }

        .org-stats-row {
            gap: 2rem;
        }

        .org-stat-value {
            font-size: 1.5rem;
        }

        .org-tenders-grid {
            grid-template-columns: 1fr;
        }

        .org-company-details {
            flex-direction: column;
            gap: 0.5rem;
        }

        .org-table-wrapper {
            margin: 0 -1rem;
            border-radius: 0;
            border-left: none;
            border-right: none;
        }

        /* The wrapper is overflow-x:auto, but width:100% makes the table
           squeeze to fit instead of scrolling, which turns the 4-column
           winners table into a column of single words at 390px. A min-width
           lets it scroll horizontally inside its own box — the page itself
           still never scrolls sideways. */
        .org-table {
            min-width: 34rem;
        }
    }

    /* ═══════════════════════════════════════════════════════════
       TENDER DETAIL WORKSPACE - 3-Column Layout
       ═══════════════════════════════════════════════════════════ */

    /* Outer page wrapper – flex column so the workspace fills whatever
       vertical space remains after navbar + optional promo banner. */
    .td-detail-page {
        display: flex;
        flex-direction: column;
        height: 100vh;
        overflow: hidden;
    }

    .td-workspace {
        display: flex;
        flex-direction: column;
        flex: 1;
        min-height: 0;
        background: #f9fafb;
        overflow: hidden;
    }

    /* ── Header Bar ── */
    .td-header {
        height: 56px;
        background: white;
        border-bottom: 1px solid #e5e7eb;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 1.5rem;
        flex-shrink: 0;
    }

    .td-header-left {
        display: flex;
        align-items: center;
        gap: 1rem;
        flex: 1;
        min-width: 0;
    }

    .td-back-btn {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        color: #6b7280;
        text-decoration: none;
        font-size: 0.875rem;
        font-weight: 500;
        transition: color 0.15s ease;
        flex-shrink: 0;
    }

    .td-back-btn:hover {
        color: #111827;
    }

    .td-header-divider {
        height: 1.25rem;
        width: 1px;
        background: #d1d5db;
        flex-shrink: 0;
    }

    .td-header-title {
        font-size: 0.9375rem;
        font-weight: 600;
        color: #111827;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin: 0;
        line-height: 1.4;
    }

    .td-status-badge {
        display: inline-flex;
        align-items: center;
        padding: 0.25rem 0.75rem;
        border-radius: 9999px;
        font-size: 0.75rem;
        font-weight: 600;
        flex-shrink: 0;
    }

    .td-status-open {
        background: #dcfce7;
        color: #166534;
    }

    .td-status-closed {
        background: #fee2e2;
        color: #991b1b;
    }

    .td-header-actions {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
    }

    .td-header-pipeline-btn {
        display: flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.375rem 0.75rem;
        border-radius: 0.5rem;
        font-size: 0.75rem;
        font-weight: 500;
        cursor: pointer;
        background: #f0f9ff;
        color: #2563eb;
        border: 1px solid #bfdbfe;
        transition: all 0.15s ease;
        white-space: nowrap;
    }

    .td-header-pipeline-btn:hover {
        background: #dbeafe;
        border-color: #93c5fd;
    }

    .td-header-icon-btn {
        padding: 0.5rem;
        border-radius: 0.5rem;
        background: transparent;
        border: none;
        cursor: pointer;
        color: #6b7280;
        transition: all 0.15s ease;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .td-header-icon-btn:hover {
        background: #f3f4f6;
        color: #111827;
    }

    .td-header-primary-btn {
        padding: 0.5rem 1.25rem;
        background: #2563eb;
        color: white;
        border: none;
        border-radius: 9999px;
        font-size: 0.875rem;
        font-weight: 500;
        cursor: pointer;
        transition: background 0.15s ease;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
    }

    .td-header-primary-btn:hover {
        background: #1d4ed8;
    }

    /* ── 3-Column Body ── */
    .td-body {
        flex: 1;
        display: flex;
        overflow: hidden;
    }

    /* ── Column A: Left Metadata Rail ── */
    .td-left-rail {
        width: 248px;
        background: #f9fafb;
        border-right: 1px solid #e5e7eb;
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }

    .td-left-rail-scroll {
        flex: 1;
        overflow-y: auto;
        padding: 1rem;
    }

    .td-left-rail-scroll::-webkit-scrollbar {
        width: 5px;
    }
    .td-left-rail-scroll::-webkit-scrollbar-track {
        background: transparent;
    }
    .td-left-rail-scroll::-webkit-scrollbar-thumb {
        background: #d1d5db;
        border-radius: 3px;
    }

    .td-left-rail-footer {
        padding: 1rem;
        border-top: 1px solid #e5e7eb;
        flex-shrink: 0;
        background: #f9fafb;
    }

    /* Deadline Countdown Card */
    .td-deadline-card {
        background: linear-gradient(135deg, #fffbeb, #fff7ed);
        border: 1px solid #fde68a;
        border-radius: 0.75rem;
        padding: 1rem;
        margin-bottom: 1.5rem;
    }

    .td-deadline-card.expired {
        background: linear-gradient(135deg, #fef2f2, #fff1f2);
        border-color: #fecaca;
    }

    .td-deadline-card.urgent {
        background: linear-gradient(135deg, #fef2f2, #fff1f2);
        border-color: #fca5a5;
    }

    .td-deadline-header {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .td-deadline-label {
        font-size: 0.6875rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #92400e;
    }

    .td-deadline-card.expired .td-deadline-label,
    .td-deadline-card.urgent .td-deadline-label {
        color: #991b1b;
    }

    .td-deadline-value {
        font-size: 1.375rem;
        font-weight: 700;
        color: #92400e;
        line-height: 1.2;
    }

    .td-deadline-card.expired .td-deadline-value,
    .td-deadline-card.urgent .td-deadline-value {
        color: #991b1b;
    }

    .td-deadline-date {
        font-size: 0.75rem;
        color: #b45309;
        margin-top: 0.125rem;
    }

    .td-deadline-card.expired .td-deadline-date,
    .td-deadline-card.urgent .td-deadline-date {
        color: #b91c1c;
    }

    .td-deadline-progress {
        display: none;
    }

    .td-deadline-card.expired .td-deadline-progress,
    .td-deadline-card.urgent .td-deadline-progress {
        background: #fecaca;
    }

    .td-deadline-progress-bar {
        height: 100%;
        border-radius: 9999px;
        background: #f59e0b;
        transition: width 0.3s ease;
    }

    .td-deadline-card.expired .td-deadline-progress-bar,
    .td-deadline-card.urgent .td-deadline-progress-bar {
        background: #ef4444;
    }

    /* Metadata Section */
    .td-meta-section {
        margin-bottom: 1.5rem;
    }

    .td-meta-heading {
        font-size: 0.6875rem;
        font-weight: 700;
        color: #6b7280;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin-bottom: 0.75rem;
    }

    .td-meta-item {
        display: flex;
        align-items: flex-start;
        gap: 0.625rem;
        margin-bottom: 0.75rem;
    }

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

    .td-meta-icon {
        width: 1rem;
        height: 1rem;
        color: #9ca3af;
        flex-shrink: 0;
        margin-top: 0.125rem;
    }

    .td-meta-label {
        font-size: 0.75rem;
        color: #6b7280;
        margin-bottom: 0.125rem;
    }

    .td-meta-value {
        font-size: 0.875rem;
        font-weight: 500;
        color: #111827;
    }

    .td-meta-value a {
        color: #2563eb;
        text-decoration: none;
    }

    .td-meta-value a:hover {
        text-decoration: underline;
    }

    .td-meta-value-mono {
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    }

    /* Evaluation Weights (sidebar) */
    .td-eval-item {
        margin-bottom: 0.75rem;
    }

    .td-eval-item:last-child {
        margin-bottom: 0;
    }

    .td-eval-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 0.375rem;
    }

    .td-eval-name {
        font-size: 0.75rem;
        color: #374151;
    }

    .td-eval-weight {
        font-size: 0.75rem;
        font-weight: 600;
        color: #111827;
    }

    .td-eval-bar {
        height: 0.5rem;
        background: #e5e7eb;
        border-radius: 9999px;
        overflow: hidden;
    }

    .td-eval-bar-fill {
        height: 100%;
        border-radius: 9999px;
        transition: width 0.3s ease;
    }

    /* Timeline */
    .td-timeline-step {
        display: flex;
        gap: 0.75rem;
    }

    .td-timeline-track {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .td-timeline-dot {
        width: 1.5rem;
        height: 1.5rem;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }

    .td-timeline-dot.completed {
        background: #dcfce7;
    }

    .td-timeline-dot.current {
        background: #dbeafe;
    }

    .td-timeline-dot.future {
        background: #f3f4f6;
    }

    .td-timeline-line {
        width: 2px;
        height: 1.5rem;
        flex-shrink: 0;
    }

    .td-timeline-line.completed {
        background: #86efac;
    }

    .td-timeline-line.future {
        background: #e5e7eb;
    }

    .td-timeline-text {
        padding-bottom: 0.25rem;
    }

    .td-timeline-event {
        font-size: 0.75rem;
        font-weight: 500;
        color: #111827;
    }

    .td-timeline-event.current {
        color: #2563eb;
    }

    .td-timeline-date {
        font-size: 0.75rem;
        color: #6b7280;
        margin-top: 0.125rem;
    }

    /* View Original Button */
    .td-view-original-btn {
        width: 100%;
        padding: 0.625rem 1rem;
        border: 1px solid #d1d5db;
        border-radius: 0.5rem;
        font-size: 0.875rem;
        font-weight: 500;
        color: #374151;
        background: white;
        cursor: pointer;
        transition: all 0.15s ease;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        text-decoration: none;
    }

    .td-view-original-btn:hover {
        background: #f9fafb;
        border-color: #9ca3af;
    }

    /* ── Column B: Reading Pane (Center) ── */
    .td-reading-pane {
        flex: 1;
        display: flex;
        flex-direction: column;
        background: white;
        overflow: hidden;
        min-width: 0;
    }

    /* Reading Pane Tabs */
    .td-tabs-bar {
        flex-shrink: 0;
        border-bottom: 1px solid #e5e7eb;
        padding: 0 1.5rem;
        background: white;
    }

    .td-tabs-list {
        display: flex;
        gap: 0.25rem;
    }

    .td-tab-btn {
        padding: 0.75rem 1rem;
        font-size: 0.875rem;
        font-weight: 500;
        color: #6b7280;
        background: transparent;
        border: none;
        cursor: pointer;
        position: relative;
        transition: color 0.15s ease;
        white-space: nowrap;
    }

    .td-tab-btn:hover {
        color: #111827;
    }

    .td-tab-btn.active {
        color: #2563eb;
        font-weight: 600;
    }

    .td-tab-btn.active::after {
        content: '';
        position: absolute;
        bottom: -1px;
        left: 0;
        right: 0;
        height: 2px;
        background: #2563eb;
        border-radius: 2px 2px 0 0;
    }

    /* Reading Pane Content */
    .td-content-scroll {
        flex: 1;
        overflow-y: auto;
    }

    .td-content-scroll::-webkit-scrollbar {
        width: 6px;
    }
    .td-content-scroll::-webkit-scrollbar-track {
        background: transparent;
    }
    .td-content-scroll::-webkit-scrollbar-thumb {
        background: #d1d5db;
        border-radius: 3px;
    }

    .td-content-area {
        padding: 2rem;
    }

    .td-tab-panel {
        display: none;
        animation: tdFadeIn 0.2s ease;
    }

    .td-tab-panel.active {
        display: block;
    }

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

    /* Requirement card hover effect */
    .req-card-hover:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
    }

    /* Overview Tab: Summary Cards */
    .td-summary-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
        margin-bottom: 2rem;
    }

    .td-summary-card {
        padding: 1rem;
        border-radius: 0.75rem;
        border: 1px solid #e5e7eb;
        background: #f9fafb;
        transition: border-color 0.15s ease;
    }

    .td-summary-card:hover {
        border-color: #d1d5db;
    }

    .td-summary-inner {
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

    .td-summary-icon {
        width: 2.5rem;
        height: 2.5rem;
        border-radius: 0.5rem;
        background: white;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }

    .td-summary-label {
        font-size: 0.75rem;
        color: #6b7280;
        font-weight: 500;
    }

    .td-summary-value {
        font-size: 1.125rem;
        font-weight: 700;
        color: #111827;
    }

    /* Overview Tab: Market Benchmark Card */
    .td-bench-card {
        background: white;
        border: 1.5px solid #bfdbfe;
        border-radius: 0.75rem;
        padding: 1rem;
        margin-bottom: 1.5rem;
        box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    }

    .td-bench-header {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-bottom: 0.75rem;
    }

    .td-bench-title {
        font-weight: 600;
        color: #1f2937;
        font-size: 0.875rem;
    }

    .td-bench-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 0.75rem;
    }

    .td-bench-metric {
        text-align: center;
        padding: 0.5rem;
        background: #eff6ff;
        border-radius: 0.5rem;
    }

    .td-bench-label {
        font-size: 0.6875rem;
        color: #6b7280;
        font-weight: 500;
        margin-bottom: 0.25rem;
    }

    .td-bench-value {
        font-size: 1rem;
        font-weight: 700;
        color: #1f2937;
    }

    .td-bench-badge {
        display: inline-block;
        font-size: 0.6875rem;
        font-weight: 600;
        padding: 0.125rem 0.5rem;
        border-radius: 9999px;
        margin-top: 0.125rem;
    }

    .td-bench-badge-green {
        background: #f0fdf4;
        color: #166534;
    }

    .td-bench-badge-yellow {
        background: #fffbeb;
        color: #92400e;
    }

    .td-bench-badge-red {
        background: #fef2f2;
        color: #991b1b;
    }

    .td-bench-note {
        font-size: 0.6875rem;
        color: #9ca3af;
        margin-top: 0.5rem;
        text-align: center;
    }

    /* Sidebar Intelligence Panels (Win Probability, Buyer Intelligence, Sector Insights) */
    .td-intel-panel {
        background: white;
        border: 1.5px solid #bfdbfe;
        border-radius: 0.75rem;
        margin-top: 1rem;
        overflow: hidden;
        transition: box-shadow 0.15s ease;
    }
    .td-intel-panel:hover {
        box-shadow: 0 2px 8px rgba(37, 99, 235, 0.08);
    }
    .td-intel-header {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.75rem 1rem;
        cursor: pointer;
        user-select: none;
        background: linear-gradient(135deg, #eff6ff 0%, #eff6ff 100%);
        border-bottom: 1px solid #f3e8ff;
    }
    .td-intel-header:hover {
        background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    }
    .td-intel-title {
        font-weight: 600;
        font-size: 0.8125rem;
        color: #1f2937;
        flex: 1;
    }
    .td-intel-badge {
        font-size: 0.5625rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        padding: 0.125rem 0.375rem;
        border-radius: 9999px;
        background: #2563eb;
        color: white;
    }
    .td-intel-chevron {
        transition: transform 0.2s ease;
        color: #9ca3af;
    }
    .td-intel-panel.open .td-intel-chevron {
        transform: rotate(180deg);
    }
    .td-intel-body {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
    }
    .td-intel-panel.open .td-intel-body {
        max-height: 500px;
    }
    .td-intel-content {
        padding: 0.75rem 1rem;
    }
    .td-intel-metric {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.375rem 0;
        border-bottom: 1px solid #f9fafb;
    }
    .td-intel-metric:last-child {
        border-bottom: none;
    }
    .td-intel-metric-label {
        font-size: 0.75rem;
        color: #6b7280;
        font-weight: 500;
    }
    .td-intel-metric-value {
        font-size: 0.8125rem;
        font-weight: 600;
        color: #1f2937;
    }
    /* Win probability gauge */
    .td-win-gauge {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        padding: 0.5rem 0;
    }
    .td-win-pct {
        font-size: 1.5rem;
        font-weight: 800;
        line-height: 1;
    }
    .td-win-pct.high { color: #059669; }
    .td-win-pct.medium { color: #d97706; }
    .td-win-pct.low { color: #dc2626; }
    .td-win-bar-track {
        flex: 1;
        height: 6px;
        background: #f3f4f6;
        border-radius: 3px;
        overflow: hidden;
    }
    .td-win-bar-fill {
        height: 100%;
        border-radius: 3px;
        transition: width 0.6s ease;
    }
    .td-win-bar-fill.high { background: #059669; }
    .td-win-bar-fill.medium { background: #d97706; }
    .td-win-bar-fill.low { background: #dc2626; }
    .td-win-label {
        font-size: 0.6875rem;
        font-weight: 600;
    }
    .td-win-label.high { color: #059669; }
    .td-win-label.medium { color: #d97706; }
    .td-win-label.low { color: #dc2626; }
    /* Pro locked teaser */
    .td-intel-locked {
        text-align: center;
        padding: 1rem 0.75rem;
    }
    .td-intel-locked-icon {
        font-size: 1.25rem;
        margin-bottom: 0.375rem;
    }
    .td-intel-locked-title {
        font-size: 0.8125rem;
        font-weight: 600;
        color: #374151;
        margin-bottom: 0.25rem;
    }
    .td-intel-locked-desc {
        font-size: 0.6875rem;
        color: #9ca3af;
        margin-bottom: 0.5rem;
        line-height: 1.4;
    }
    .td-intel-locked-cta {
        display: inline-block;
        font-size: 0.6875rem;
        font-weight: 600;
        color: white;
        background: #2563eb;
        padding: 0.375rem 0.875rem;
        border-radius: 0.375rem;
        text-decoration: none;
        transition: background 0.15s ease;
    }
    .td-intel-locked-cta:hover {
        background: #1e40af;
    }
    .td-intel-note {
        font-size: 0.625rem;
        color: #9ca3af;
        text-align: center;
        padding: 0.375rem 1rem 0.5rem;
        border-top: 1px solid #f9fafb;
    }

    /* Overview Tab: Description section */
    .td-description-section {
        margin-bottom: 2rem;
    }

    .td-section-title {
        font-size: 1.25rem;
        font-weight: 700;
        color: #111827;
        margin-bottom: 1rem;
    }

    .td-description-text {
        line-height: 1.7;
        white-space: pre-line;
        color: #374151;
        font-size: 0.9375rem;
    }

    /* ── Column C: Right Panel (AI & Actions) ── */
    .td-right-panel {
        min-width: 340px;
        width: 27.5vw;
        max-width: 530px;
        background: white;
        border-left: 1px solid #e5e7eb;
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }

    /* Quick Actions Section */
    .td-actions-section {
        flex-shrink: 0;
        padding: 0.75rem 1.25rem;
        border-bottom: 1px solid #e5e7eb;
    }

    .td-actions-heading {
        font-size: 0.6875rem;
        font-weight: 700;
        color: #6b7280;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin-bottom: 0.75rem;
    }

    .td-actions-row {
        display: flex;
        gap: 0.5rem;
        margin-bottom: 0.25rem;
    }

    .td-actions-row .td-action-btn-primary {
        flex: 1;
        width: auto;
        margin-bottom: 0;
        font-size: 0.75rem;
        padding: 0.5rem 0.625rem;
    }

    .td-action-btn-primary {
        width: 100%;
        padding: 0.625rem 1rem;
        border-radius: 0.5rem;
        font-size: 0.875rem;
        font-weight: 500;
        cursor: pointer;
        transition: all 0.15s ease;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        text-decoration: none;
        border: none;
        margin-bottom: 0.5rem;
    }

    .td-action-btn-primary:last-child {
        margin-bottom: 0;
    }

    .td-action-btn-generate {
        background: linear-gradient(135deg, #2563eb, #1d4ed8);
        color: white;
    }

    .td-action-btn-generate:hover {
        background: linear-gradient(135deg, #1d4ed8, #1e40af);
    }

    .td-action-btn-review {
        background: white;
        border: 1px solid #d1d5db;
        color: #374151;
    }

    .td-action-btn-review:hover {
        background: #f9fafb;
        border-color: #9ca3af;
    }

    .td-action-btn-save {
        background: white;
        border: 1px solid #d1d5db;
        color: #374151;
    }

    .td-action-btn-save:hover {
        background: #f0fdf4;
        border-color: #86efac;
        color: #166534;
    }

    .td-action-btn-save.saved {
        background: #f0fdf4;
        border-color: #86efac;
        color: #166534;
    }

    /* TaaS CTA Card - Collapsible */
    .td-taas-card {
        background: #ffffff; position: relative; overflow: hidden;
        border-bottom: 1px solid #e5e7eb;
    }
    .td-taas-accent {
        position: absolute; top: 0; left: 16px; right: 16px; height: 3px;
        background: linear-gradient(90deg, #2563EB, #60A5FA); border-radius: 0 0 4px 4px;
    }
    .td-taas-body { padding: 14px 16px 12px; }
    .td-taas-badge-row { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
    .td-taas-pulse { position: relative; width: 8px; height: 8px; flex-shrink: 0; }
    .td-taas-pulse::before {
        content: ''; position: absolute; inset: 0; background: #2563EB; border-radius: 50%; z-index: 1;
    }
    .td-taas-pulse::after {
        content: ''; position: absolute; inset: -3px; background: rgba(37,99,235,0.35); border-radius: 50%;
        animation: td-taas-pulse-ring 2s cubic-bezier(0.4,0,0.2,1) infinite;
    }
    @keyframes td-taas-pulse-ring {
        0% { transform: scale(0.7); opacity: 1; }
        70% { transform: scale(1.6); opacity: 0; }
        100% { transform: scale(0.7); opacity: 0; }
    }
    .td-taas-label {
        font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
        color: #2563EB; background: rgba(37,99,235,0.07); padding: 2px 8px; border-radius: 4px;
    }
    .td-taas-headline { font-size: 15px; font-weight: 700; line-height: 1.25; color: #0F172A; margin: 0 0 2px; }
    .td-taas-subtitle { font-size: 11.5px; line-height: 1.4; color: #64748B; margin: 0 0 8px; }

    /* Stat pills - always visible */
    .td-taas-pills { display: flex; gap: 6px; margin-bottom: 8px; }
    .td-taas-pill {
        flex: 1; text-align: center; padding: 5px 4px;
        background: linear-gradient(135deg, #ECFDF5, #F0FDF9); border: 1px solid #A7F3D0;
        border-radius: 8px;
    }
    .td-taas-pill-val { display: block; font-size: 15px; font-weight: 800; color: #059669; }
    .td-taas-pill-label { display: block; font-size: 9px; color: #6B7280; font-weight: 500; text-transform: uppercase; letter-spacing: 0.03em; }

    /* Toggle */
    .td-taas-toggle {
        text-align: center; margin-bottom: 8px; cursor: pointer;
    }
    .td-taas-toggle-text {
        font-size: 11.5px; font-weight: 600; color: #2563EB; display: inline-flex; align-items: center; gap: 3px;
    }
    .td-taas-toggle-text:hover { color: #1D4ED8; }
    .td-taas-chevron { transition: transform 0.3s ease; }
    .td-taas-expanded .td-taas-chevron { transform: rotate(180deg); }

    /* Collapsible comparison grid */
    .td-taas-compare {
        max-height: 0; overflow: hidden; transition: max-height 0.4s ease, opacity 0.3s ease;
        opacity: 0; padding: 0 0;
    }
    .td-taas-expanded .td-taas-compare {
        max-height: 400px; opacity: 1; padding: 4px 0 8px;
    }
    .td-taas-compare-header {
        display: grid; grid-template-columns: 1fr 24px 1fr; align-items: center;
        padding: 0 0 4px; margin-bottom: 2px;
    }
    .td-taas-col-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; text-align: center; }
    .td-taas-col-label-without { color: #94A3B8; }
    .td-taas-col-label-with { color: #059669; }
    .td-taas-row {
        display: grid; grid-template-columns: 1fr 24px 1fr; align-items: stretch; margin-bottom: 6px;
    }
    .td-taas-without {
        background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 8px;
        padding: 6px 8px; text-align: center; transition: background 0.2s;
    }
    .td-taas-row:hover .td-taas-without { background: #F1F5F9; }
    .td-taas-without .td-taas-val { font-size: 13px; font-weight: 700; color: #94A3B8; line-height: 1.2; }
    .td-taas-without .td-taas-sub { font-size: 10px; color: #B0BBC9; margin-top: 1px; font-weight: 500; }
    .td-taas-arrow { display: flex; align-items: center; justify-content: center; }
    .td-taas-arrow svg { color: #CBD5E1; transition: color 0.2s, transform 0.2s; }
    .td-taas-row:hover .td-taas-arrow svg { color: #2563EB; transform: translateX(2px); }
    .td-taas-with {
        background: linear-gradient(135deg, #ECFDF5, #F0FDF9); border: 1px solid #A7F3D0;
        border-radius: 8px; padding: 6px 8px; text-align: center;
        transition: background 0.2s, border-color 0.2s;
    }
    .td-taas-row:hover .td-taas-with { border-color: #6EE7B7; background: linear-gradient(135deg, #D1FAE5, #ECFDF5); }
    .td-taas-with .td-taas-val { font-size: 13px; font-weight: 800; color: #059669; line-height: 1.2; }
    .td-taas-with .td-taas-sub { font-size: 10px; color: #34D399; margin-top: 1px; font-weight: 600; }

    /* CTA */
    .td-taas-cta {
        display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%;
        padding: 10px 16px; background: linear-gradient(135deg, #2563EB, #1D4ED8); color: #fff;
        font-size: 13px; font-weight: 700; border: none; border-radius: 10px; cursor: pointer;
        transition: transform 0.2s, box-shadow 0.2s; box-shadow: 0 2px 8px rgba(37,99,235,0.25);
        text-decoration: none; margin-bottom: 8px;
    }
    .td-taas-cta:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(37,99,235,0.35); color: #fff; text-decoration: none; }
    .td-taas-cta-arrow { transition: transform 0.25s; display: flex; }
    .td-taas-cta:hover .td-taas-cta-arrow { transform: translateX(3px); }

    /* Trust line */
    .td-taas-trust-line { text-align: center; font-size: 11px; color: #94A3B8; font-weight: 500; }
    .td-taas-trust-text { color: #059669; font-weight: 600; }

    /* Doc action buttons */
    .td-taas-doc-section { margin-top: 10px; }
    .td-taas-divider { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
    .td-taas-divider::before, .td-taas-divider::after { content: ''; flex: 1; height: 1px; background: #E2E8F0; }
    .td-taas-divider-text { font-size: 10px; color: #94A3B8; font-weight: 500; white-space: nowrap; text-transform: uppercase; letter-spacing: 0.05em; }
    .td-taas-doc-row { display: flex; gap: 6px; }
    .td-taas-doc-btn {
        flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 5px;
        padding: 7px 8px; border: 1px solid #E2E8F0; border-radius: 8px; background: #fff;
        font-size: 11px; font-weight: 600; color: #475569; cursor: pointer;
        transition: border-color 0.2s, color 0.2s, background 0.2s; font-family: inherit;
    }
    .td-taas-doc-btn:hover { border-color: #2563EB; color: #2563EB; background: #F8FAFC; }
    .td-taas-doc-btn svg { flex-shrink: 0; }

    /* Compact TaaS strip (replaces old bulky card) — ALWAYS stacked vertically */
    .td-taas-strip {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 10px 14px;
        margin: 8px 12px 4px 12px;
        min-height: 48px;
        background: linear-gradient(135deg, #EFF6FF 0%, #EBF4FF 100%);
        border: 1px solid #DBEAFE;
        border-radius: 8px;
        color: #1E3A8A;
        font-size: 12.5px;
        font-weight: 600;
        text-decoration: none;
        transition: all 0.15s ease;
        cursor: pointer;
        line-height: 1.3;
    }
    .td-taas-strip:hover {
        transform: translateY(-1px);
        border-color: #BFDBFE;
        box-shadow: 0 3px 10px rgba(37, 99, 235, 0.12);
        background: linear-gradient(135deg, #EBF4FF 0%, #E0ECFE 100%);
    }
    .td-taas-strip-left { display: flex; align-items: center; gap: 8px; width: 100%; min-width: 0; }
    .td-taas-strip-icon { font-size: 14px; flex-shrink: 0; }
    .td-taas-strip-text {
        white-space: normal;
        overflow-wrap: break-word;
        word-break: break-word;
        line-height: 1.25;
    }
    .td-taas-strip-right {
        display: flex;
        align-items: center;
        gap: 6px;
        flex-shrink: 0;
        width: 100%;
        padding-left: 22px;
        color: #2563EB;
    }
    .td-taas-strip-cta { font-size: 11.5px; font-weight: 700; }

    /* Gen/Review buttons inside AI chat header */
    .td-ai-header-actions {
        display: flex;
        gap: 6px;
        align-items: center;
        margin-left: auto;
    }
    .td-ai-header-btn {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 5px 9px;
        font-size: 11px;
        font-weight: 500;
        color: #475569;
        background: #F8FAFC;
        border: 1px solid #E2E8F0;
        border-radius: 6px;
        cursor: pointer;
        transition: all 0.15s ease;
        font-family: inherit;
    }
    .td-ai-header-btn:hover {
        background: #EFF6FF;
        border-color: #BFDBFE;
        color: #1D4ED8;
    }
    .td-ai-header-btn svg { flex-shrink: 0; }
    @media (max-width: 640px) {
        .td-ai-header-btn-label { display: none; }
        .td-ai-header-btn { padding: 6px 8px; }
        .td-taas-strip { font-size: 12px; padding: 9px 12px; }
    }

    /* AI Copilot Section */
    .td-ai-section {
        flex: 1;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        min-height: 0;
    }

    .td-ai-header {
        flex-shrink: 0;
        padding: 1.25rem;
        border-bottom: 1px solid #e5e7eb;
    }

    .td-ai-header-row {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        margin-bottom: 1rem;
    }

    .td-ai-avatar {
        width: 2.5rem;
        height: 2.5rem;
        background: linear-gradient(135deg, #2563eb, #2563eb);
        border-radius: 0.75rem;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
    }

    .td-ai-header-title {
        font-size: 0.875rem;
        font-weight: 700;
        color: #111827;
    }

    .td-ai-header-subtitle {
        font-size: 0.75rem;
        color: #6b7280;
    }

    /* Suggested Prompts */
    .td-prompts {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .td-prompt-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.375rem 0.75rem;
        background: #f3f4f6;
        border: none;
        border-radius: 9999px;
        font-size: 0.75rem;
        font-weight: 500;
        color: #374151;
        cursor: pointer;
        transition: all 0.15s ease;
    }

    .td-prompt-btn:hover {
        background: #e5e7eb;
        color: #111827;
    }

    /* AI Messages */
    .td-ai-messages {
        flex: 1;
        overflow-y: auto;
        padding: 1.25rem;
        min-height: 0;
    }

    .td-ai-messages::-webkit-scrollbar {
        width: 5px;
    }
    .td-ai-messages::-webkit-scrollbar-track {
        background: transparent;
    }
    .td-ai-messages::-webkit-scrollbar-thumb {
        background: #d1d5db;
        border-radius: 3px;
    }

    /* AI Input */
    .td-ai-input-area {
        flex-shrink: 0;
        padding: 1.25rem;
        border-top: 1px solid #e5e7eb;
    }

    .td-ai-input-row {
        display: flex;
        gap: 0.5rem;
    }

    .td-ai-input {
        flex: 1;
        min-width: 0;
        width: 100%;
        padding: 0.75rem 1rem;
        background: #f9fafb;
        border: 1px solid #d1d5db;
        border-radius: 0.75rem;
        font-size: 0.875rem;
        color: #111827;
        transition: all 0.15s ease;
        outline: none;
    }

    .td-ai-input:focus {
        border-color: transparent;
        box-shadow: 0 0 0 2px #2563eb;
    }

    .td-ai-send-btn {
        padding: 0.75rem 1rem;
        background: #2563eb;
        color: white;
        border: none;
        border-radius: 0.75rem;
        cursor: pointer;
        transition: background 0.15s ease;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    }

    .td-ai-send-btn:hover {
        background: #1d4ed8;
    }

    .td-ai-disclaimer {
        font-size: 0.6875rem;
        color: #9ca3af;
        text-align: center;
        margin-top: 0.5rem;
    }

    /* Segmented Control Toggle (AI Copilot / Team Chat) */
    .td-view-toggle-container {
        flex-shrink: 0;
        padding: 0.75rem 1.25rem 0.5rem;
        border-bottom: 1px solid #e5e7eb;
    }

    .td-view-toggle {
        display: flex;
        gap: 0.25rem;
        padding: 0.25rem;
        background: #f3f4f6;
        border-radius: 0.5rem;
    }

    .td-view-toggle-btn {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        padding: 0.5rem 1rem;
        border-radius: 0.375rem;
        font-size: 0.75rem;
        font-weight: 500;
        border: none;
        cursor: pointer;
        transition: all 0.15s ease;
        color: #6b7280;
        background: transparent;
    }

    .td-view-toggle-btn:hover {
        color: #111827;
    }

    .td-view-toggle-btn.active {
        background: white;
        color: #111827;
        box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    }

    /* Toggle row: tabs + expand button */
    .td-view-toggle-row {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }
    .td-view-toggle-row .td-view-toggle {
        flex: 1;
    }

    /* Expand/Collapse Chat Button */
    .td-chat-expand-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        border: 1px solid #e5e7eb;
        border-radius: 0.375rem;
        background: white;
        color: #6b7280;
        cursor: pointer;
        transition: all 0.15s ease;
        flex-shrink: 0;
        padding: 0;
    }
    .td-chat-expand-btn:hover {
        background: #f3f4f6;
        color: #111827;
        border-color: #d1d5db;
    }
    .td-chat-expand-btn .td-collapse-icon { display: none; }
    .td-chat-expand-btn .td-expand-icon { display: block; }

    /* ── Expanded Chat State ── */
    .td-right-panel.td-chat-expanded {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: 560px;
        max-width: 100vw;
        z-index: 1000;
        box-shadow: -4px 0 24px rgba(0,0,0,0.15);
        border-left: 1px solid #e5e7eb;
    }
    .td-right-panel.td-chat-expanded .td-actions-section {
        display: none;
    }
    .td-right-panel.td-chat-expanded .td-chat-expand-btn .td-expand-icon { display: none; }
    .td-right-panel.td-chat-expanded .td-chat-expand-btn .td-collapse-icon { display: block; }

    /* Overlay behind expanded chat */
    .td-chat-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0,0,0,0.3);
        z-index: 999;
    }
    .td-chat-overlay.active { display: block; }

    @media (max-width: 768px) {
        .td-right-panel.td-chat-expanded {
            width: 100vw;
        }
    }

    /* Team Chat View */
    .td-team-view {
        flex: 1;
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }

    .td-team-header {
        flex-shrink: 0;
        padding: 1rem 1.25rem;
        border-bottom: 1px solid #e5e7eb;
    }

    .td-team-header-row {
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

    .td-team-avatar {
        width: 2.5rem;
        height: 2.5rem;
        background: linear-gradient(135deg, #3b82f6, #2563eb);
        border-radius: 0.75rem;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 2px 8px rgba(59, 130, 246, 0.25);
    }

    .td-team-messages {
        flex: 1;
        overflow-y: auto;
        padding: 1.25rem;
        min-height: 0;
    }

    .td-team-messages::-webkit-scrollbar {
        width: 5px;
    }
    .td-team-messages::-webkit-scrollbar-track {
        background: transparent;
    }
    .td-team-messages::-webkit-scrollbar-thumb {
        background: #d1d5db;
        border-radius: 3px;
    }

    .td-team-message {
        display: flex;
        gap: 0.75rem;
        margin-bottom: 1rem;
    }

    .td-team-msg-avatar {
        width: 2rem;
        height: 2rem;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        font-size: 0.6875rem;
        font-weight: 600;
        flex-shrink: 0;
    }

    .td-team-msg-content {
        flex: 1;
        min-width: 0;
    }

    .td-team-msg-meta {
        display: flex;
        align-items: baseline;
        gap: 0.5rem;
        margin-bottom: 0.25rem;
    }

    .td-team-msg-name {
        font-size: 0.875rem;
        font-weight: 600;
        color: #111827;
    }

    .td-team-msg-time {
        font-size: 0.75rem;
        color: #6b7280;
    }

    .td-team-msg-bubble {
        background: #f3f4f6;
        border-radius: 1rem;
        padding: 0.625rem 1rem;
    }

    .td-team-msg-bubble p {
        margin: 0;
        font-size: 0.875rem;
        color: #111827;
        line-height: 1.5;
    }

    /* No organization prompt */
    .td-no-org-prompt {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 2rem 1.5rem;
        text-align: center;
    }

    .td-no-org-icon {
        width: 3.5rem;
        height: 3.5rem;
        background: #f3f4f6;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 1rem;
    }

    .td-no-org-title {
        font-size: 1rem;
        font-weight: 600;
        color: #111827;
        margin: 0 0 0.5rem;
    }

    .td-no-org-message {
        font-size: 0.875rem;
        color: #6b7280;
        line-height: 1.5;
        margin: 0 0 1.25rem;
    }

    .td-no-org-link {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.625rem 1.25rem;
        background: #2563eb;
        color: white;
        border-radius: 0.5rem;
        text-decoration: none;
        font-weight: 600;
        font-size: 0.875rem;
        transition: background 0.15s ease;
    }

    .td-no-org-link:hover {
        background: #1d4ed8;
    }

    /* @Mention Dropdown */
    .td-mention-dropdown {
        position: absolute;
        bottom: 100%;
        left: 0;
        right: 0;
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 0.5rem;
        box-shadow: 0 -4px 12px rgba(0,0,0,0.1);
        max-height: 200px;
        overflow-y: auto;
        display: none;
        z-index: 50;
        margin-bottom: 0.25rem;
    }
    .td-mention-dropdown::-webkit-scrollbar {
        width: 5px;
    }
    .td-mention-dropdown::-webkit-scrollbar-track {
        background: transparent;
    }
    .td-mention-dropdown::-webkit-scrollbar-thumb {
        background: #d1d5db;
        border-radius: 3px;
    }
    .td-mention-item {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.5rem 0.75rem;
        cursor: pointer;
        transition: background 0.15s ease;
    }
    .td-mention-item:hover,
    .td-mention-item.active {
        background: #f3f4f6;
    }
    .td-mention-avatar {
        width: 1.75rem;
        height: 1.75rem;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        font-size: 0.625rem;
        font-weight: 600;
        flex-shrink: 0;
    }
    .td-mention-name {
        font-size: 0.875rem;
        color: #374151;
        font-weight: 500;
    }
    .td-mention-email {
        font-size: 0.75rem;
        color: #9ca3af;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* Unified Input Area */
    .td-unified-input {
        position: relative;
        flex-shrink: 0;
        padding: 1.25rem;
        border-top: 1px solid #e5e7eb;
    }

    /* Match Analysis Card in right panel */
    .td-match-card {
        margin: 0 1.25rem 1.25rem;
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 0.75rem;
        overflow: hidden;
    }

    .td-match-header {
        padding: 1rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .td-match-title {
        font-size: 0.875rem;
        font-weight: 600;
        color: white;
    }

    .td-match-score-badge {
        padding: 0.25rem 0.75rem;
        border-radius: 0.5rem;
        background: rgba(255,255,255,0.2);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(255,255,255,0.3);
        text-align: center;
    }

    .td-match-score-value {
        font-size: 1rem;
        font-weight: 700;
        color: white;
    }

    .td-match-score-label {
        font-size: 0.6875rem;
        color: rgba(255,255,255,0.9);
    }

    .td-match-body {
        padding: 1rem;
    }

    .td-match-reason {
        background: #f0f9ff;
        border: 1px solid #bae6fd;
        border-radius: 0.5rem;
        padding: 0.75rem;
        margin-bottom: 0.75rem;
    }

    .td-match-reason p {
        margin: 0;
        font-size: 0.8125rem;
        color: #374151;
        font-style: italic;
        line-height: 1.5;
    }

    .td-match-action {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
    }

    .td-match-action-label {
        font-size: 0.8125rem;
        font-weight: 600;
        color: #6b7280;
    }

    .td-match-action-badge {
        padding: 0.25rem 0.75rem;
        border-radius: 0.25rem;
        font-weight: 600;
        font-size: 0.8125rem;
        color: white;
    }

    /* AI Match Analysis - Expandable text in overview card */
    .td-ai-reason-text {
        font-size: 0.8125rem;
        color: #6b7280;
        line-height: 1.5;
        margin: 0 0 0.375rem 0;
        font-style: italic;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        transition: all 0.3s ease;
    }

    .td-ai-reason-text.expanded {
        display: block;
        -webkit-line-clamp: unset;
        overflow: visible;
    }

    .td-ai-read-more {
        font-size: 0.75rem;
        color: #2563EB;
        font-weight: 500;
        cursor: pointer;
        border: none;
        background: none;
        padding: 0;
        margin: 0 0 0.375rem 0;
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        transition: color 0.15s ease;
    }

    .td-ai-read-more:hover {
        color: #1D4ED8;
    }

    .td-ai-read-more svg {
        transition: transform 0.3s ease;
    }

    .td-ai-read-more.expanded svg {
        transform: rotate(180deg);
    }

    @media (max-width: 768px) {
        .td-ai-reason-text {
            font-size: 0.8rem;
            line-height: 1.5;
        }
    }

    /* Quality Score Badge in right panel */
    .td-quality-badge {
        margin: 0 1.25rem 0.75rem;
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 0.75rem;
        padding: 0.75rem;
        cursor: pointer;
        transition: all 0.15s ease;
    }

    .td-quality-badge:hover {
        border-color: #93c5fd;
        box-shadow: 0 2px 8px rgba(37, 99, 235, 0.08);
    }

    .td-quality-inner {
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

    /* Expired Banner */
    .td-expired-banner {
        background: #fef2f2;
        border: 2px solid #fecaca;
        border-radius: 0.75rem;
        padding: 1.5rem;
        margin-bottom: 1.5rem;
        text-align: center;
    }

    .td-expired-banner h2 {
        color: #dc2626;
        font-size: 1.25rem;
        font-weight: 700;
        margin: 0 0 0.5rem;
    }

    .td-expired-banner p {
        color: #991b1b;
        font-size: 0.875rem;
        margin: 0 0 1rem;
        line-height: 1.5;
    }

    .td-expired-browse-btn {
        display: inline-block;
        background: #dc2626;
        color: white;
        padding: 0.5rem 1.5rem;
        border-radius: 0.5rem;
        text-decoration: none;
        font-weight: 600;
        font-size: 0.875rem;
    }

    .td-expired-browse-btn:hover {
        background: #b91c1c;
    }

    /* Unauthenticated overlay for right panel */
    .td-login-prompt {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 2rem;
        text-align: center;
    }

    .td-login-prompt h3 {
        font-size: 1.125rem;
        font-weight: 700;
        color: #111827;
        margin: 0 0 0.5rem;
    }

    .td-login-prompt p {
        font-size: 0.875rem;
        color: #6b7280;
        margin: 0 0 1.5rem;
        line-height: 1.5;
    }

    .td-login-cta {
        display: block;
        width: 100%;
        padding: 0.75rem;
        background: linear-gradient(135deg, #2563eb, #1d4ed8);
        color: white;
        border-radius: 0.5rem;
        text-decoration: none;
        font-weight: 600;
        font-size: 0.875rem;
        text-align: center;
        margin-bottom: 0.5rem;
        transition: all 0.15s ease;
    }

    .td-login-cta:hover {
        background: linear-gradient(135deg, #1d4ed8, #1e40af);
    }

    .td-login-secondary {
        display: block;
        width: 100%;
        padding: 0.625rem;
        border: 2px solid #2563eb;
        color: #2563eb;
        border-radius: 0.5rem;
        text-decoration: none;
        font-weight: 600;
        font-size: 0.875rem;
        text-align: center;
        transition: all 0.15s ease;
    }

    .td-login-secondary:hover {
        background: #2563eb;
        color: white;
    }

    /* ── Responsive ── */
    @media (max-width: 1280px) {
        .td-right-panel {
            min-width: 300px;
            width: 24.2vw;
        }
        /* Compact TaaS CTA to free space for chat on smaller screens */
        .td-actions-section {
            padding: 0.5rem 1rem;
        }
        .td-taas-pills { display: none; }
        .td-taas-subtitle { display: none; }
        .td-taas-trust-line { display: none; }
        .td-taas-card .td-taas-body { padding: 10px 14px; }
        .td-taas-headline { font-size: 13px; margin-bottom: 6px; }
        .td-taas-badge-row { margin-bottom: 4px; }
        .td-taas-toggle { margin-bottom: 6px; }
        .td-taas-cta { padding: 8px 12px; font-size: 12px; }
        /* Compact AI header */
        .td-ai-header { padding: 0.75rem 1rem; }
        .td-ai-header-row { margin-bottom: 0.5rem; }
        .td-ai-avatar { width: 2rem; height: 2rem; }
        .td-prompt-btn { font-size: 0.6875rem; padding: 0.25rem 0.5rem; }
        /* Compact AI input */
        .td-ai-input-area { padding: 0.75rem 1rem; }
    }

    @media (max-width: 1024px) {
        .td-detail-page {
            height: auto;
            overflow: visible;
        }

        .td-workspace {
            flex: none;
            height: auto;
            min-height: 100vh;
            overflow: visible;
        }

        .td-body {
            flex-direction: column;
            overflow: visible;
        }

        .td-left-rail {
            width: 100%;
            border-right: none;
            border-bottom: 1px solid #e5e7eb;
            max-height: none;
            overflow: visible;
        }

        .td-left-rail-scroll {
            display: flex;
            flex-wrap: wrap;
            gap: 1rem;
            overflow: visible;
        }

        .td-meta-section {
            flex: 1;
            min-width: 200px;
            margin-bottom: 0;
        }

        .td-deadline-card {
            flex: 1 1 100%;
            margin-bottom: 0;
        }

        .td-intel-panel {
            flex: 1 1 100%;
            margin-top: 0.5rem;
        }

        .td-reading-pane {
            overflow: visible;
        }

        .td-content-scroll {
            overflow: visible;
        }

        .td-right-panel {
            width: 100%;
            border-left: none;
            border-top: 1px solid #e5e7eb;
            overflow: visible;
        }

        .td-ai-messages {
            min-height: 300px;
            max-height: 500px;
        }

        .td-ai-section {
            min-height: 400px;
        }
    }

    @media (max-width: 768px) {
        .td-header {
            padding: 0.5rem 1rem;
            height: auto;
            min-height: 44px;
            flex-wrap: wrap;
            gap: 0.5rem;
        }

        .td-header-left {
            width: 100%;
            flex: none;
        }

        .td-header-title {
            font-size: 0.8125rem;
            white-space: normal;
            line-height: 1.3;
        }

        .td-header-actions {
            width: 100%;
            justify-content: flex-end;
        }

        .td-header-actions .td-header-icon-btn {
            display: none;
        }

        .td-left-rail-scroll {
            padding: 1rem;
            flex-direction: column;
        }

        .td-content-area {
            padding: 1.25rem;
        }

        .td-summary-grid {
            grid-template-columns: 1fr;
        }

        .td-bench-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .td-tab-btn {
            padding: 0.75rem 0.75rem;
            font-size: 0.8125rem;
        }

        .td-tabs-bar {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            padding: 0 1rem;
            scrollbar-width: none;
        }

        .td-tabs-bar::-webkit-scrollbar {
            display: none;
        }

        .td-tabs-list {
            min-width: max-content;
        }
    }

    /* ========== COMPETITOR PREDICTION ========== */

    .cp-header {
        padding: 2rem;
        background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
        border-radius: 0.75rem;
        margin-bottom: 2rem;
    }

    .cp-header h3 {
        margin: 0 0 0.5rem 0;
        color: #1f2937;
        font-size: 1.5rem;
    }

    .cp-header p {
        margin: 0;
        color: #4b5563;
        font-size: 1rem;
        line-height: 1.6;
    }

    .cp-list {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
    }

    .cp-card {
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 0.75rem;
        padding: 1.25rem;
        transition: all 0.2s ease;
        cursor: pointer;
    }

    .cp-card:hover {
        border-color: #bfdbfe;
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.08);
    }

    .cp-card-top {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1rem;
        margin-bottom: 0.75rem;
    }

    .cp-company-info {
        flex: 1;
        min-width: 0;
    }

    .cp-company-name {
        font-weight: 600;
        color: #1f2937;
        font-size: 0.95rem;
        margin-bottom: 0.25rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .cp-company-reg {
        font-size: 0.75rem;
        color: #9ca3af;
        font-family: monospace;
    }

    .cp-probability-badge {
        flex-shrink: 0;
        padding: 0.25rem 0.75rem;
        border-radius: 9999px;
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.025em;
    }

    .cp-probability-high {
        background: #dcfce7;
        color: #166534;
    }

    .cp-probability-medium {
        background: #fef3c7;
        color: #92400e;
    }

    .cp-probability-low {
        background: #f3f4f6;
        color: #6b7280;
    }

    .cp-stats-row {
        display: flex;
        gap: 1.5rem;
        margin-bottom: 0.75rem;
        flex-wrap: wrap;
    }

    .cp-stat {
        display: flex;
        align-items: center;
        gap: 0.375rem;
        font-size: 0.8125rem;
        color: #6b7280;
    }

    .cp-stat-value {
        font-weight: 600;
        color: #374151;
    }

    .cp-confidence-bar-track {
        height: 4px;
        background: #f3f4f6;
        border-radius: 2px;
        overflow: hidden;
        margin-bottom: 0.75rem;
    }

    .cp-confidence-bar {
        height: 100%;
        border-radius: 2px;
        transition: width 0.5s ease;
    }

    .cp-reasons {
        display: none;
        padding-top: 0.75rem;
        border-top: 1px solid #f3f4f6;
    }

    .cp-card.expanded .cp-reasons {
        display: block;
    }

    .cp-card.expanded {
        border-color: #a5b4fc;
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.1);
    }

    .cp-reason-item {
        display: flex;
        align-items: flex-start;
        gap: 0.5rem;
        padding: 0.375rem 0;
        font-size: 0.8125rem;
        color: #4b5563;
    }

    .cp-reason-icon {
        flex-shrink: 0;
        width: 18px;
        height: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: #dbeafe;
        color: #2563eb;
        font-size: 0.625rem;
        margin-top: 1px;
    }

    .cp-expand-hint {
        font-size: 0.75rem;
        color: #9ca3af;
        text-align: right;
        margin-top: 0.25rem;
    }

    .cp-card.expanded .cp-expand-hint {
        display: none;
    }

    .cp-similar-tender {
        font-size: 0.75rem;
        color: #6b7280;
        font-style: italic;
        margin-top: 0.375rem;
        padding: 0.5rem 0.75rem;
        background: #f9fafb;
        border-radius: 0.375rem;
        border-left: 3px solid #a5b4fc;
    }

    .cp-insights-link {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        margin-top: 0.75rem;
        font-size: 0.8125rem;
        color: #2563eb;
        font-weight: 500;
        text-decoration: none;
        transition: color 0.15s ease;
    }

    .cp-insights-link:hover {
        color: #1d4ed8;
    }

    .cp-empty {
        text-align: center;
        padding: 3rem 2rem;
    }

    .cp-empty-icon {
        width: 64px;
        height: 64px;
        margin: 0 auto 1.5rem;
        background: #f3f4f6;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 3px solid #e5e7eb;
    }

    .cp-empty-title {
        font-size: 1.25rem;
        font-weight: 600;
        color: #374151;
        margin-bottom: 0.5rem;
    }

    .cp-empty-desc {
        font-size: 0.875rem;
        color: #6b7280;
        line-height: 1.6;
        max-width: 400px;
        margin: 0 auto;
    }

    /* Premium gate overlay */
    .cp-premium-gate {
        position: relative;
        min-height: 300px;
    }

    .cp-premium-overlay {
        position: absolute;
        top: 0; left: 0; right: 0; bottom: 0;
        background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 20%, rgba(255,255,255,0.9) 40%, rgba(255,255,255,0.98) 60%);
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 10;
        border-radius: 0.75rem;
    }

    .cp-premium-card {
        background: white;
        padding: 2rem;
        border-radius: 1.25rem;
        box-shadow: 0 20px 50px -12px rgba(0, 0, 0, 0.15);
        border: 2px solid #e5e7eb;
        text-align: center;
        max-width: 380px;
    }

    .cp-premium-icon {
        width: 56px;
        height: 56px;
        margin: 0 auto 1rem;
        background: linear-gradient(135deg, #2563eb, #1d4ed8);
        border-radius: 1rem;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .cp-premium-title {
        font-size: 1.125rem;
        font-weight: 700;
        color: #1f2937;
        margin-bottom: 0.5rem;
    }

    .cp-premium-desc {
        font-size: 0.875rem;
        color: #6b7280;
        line-height: 1.6;
        margin-bottom: 1.25rem;
    }

    .cp-premium-cta {
        display: inline-block;
        padding: 0.625rem 1.5rem;
        background: linear-gradient(135deg, #2563eb, #1d4ed8);
        color: white;
        border-radius: 0.5rem;
        font-weight: 600;
        font-size: 0.875rem;
        text-decoration: none;
        transition: transform 0.15s ease, box-shadow 0.15s ease;
    }

    .cp-premium-cta:hover {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
    }

    .cp-footer-note {
        font-size: 0.75rem;
        color: #9ca3af;
        text-align: center;
        margin-top: 1.5rem;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.375rem;
    }

    @media (max-width: 640px) {
        .cp-card-top {
            flex-direction: column;
            gap: 0.5rem;
        }

        .cp-stats-row {
            gap: 0.75rem;
        }

        .cp-header {
            padding: 1.25rem;
        }

        .cp-header h3 {
            font-size: 1.25rem;
        }
    }

    /* ========== RISK ANALYSIS TAB ========== */

    .ra-empty {
        text-align: center;
        padding: 3rem 2rem;
    }

    .ra-empty-icon {
        width: 64px;
        height: 64px;
        margin: 0 auto 1.5rem;
        background: #eff6ff;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 3px solid #bfdbfe;
    }

    .ra-empty-title {
        font-size: 1.25rem;
        font-weight: 600;
        color: #374151;
        margin-bottom: 0.5rem;
    }

    .ra-empty-desc {
        font-size: 0.875rem;
        color: #6b7280;
        line-height: 1.6;
        max-width: 400px;
        margin: 0 auto;
    }

    /* ========== DOCUMENT DRAWER PANEL ========== */

    /* Overlay */
    .doc-drawer-overlay {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.3);
        z-index: calc(var(--z-sticky) - 1);
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.3s ease, visibility 0.3s ease;
        backdrop-filter: blur(2px);
    }

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

    /* Drawer Panel */
    .doc-drawer {
        position: fixed;
        top: 0;
        right: 0;
        width: 62%;
        max-width: 900px;
        height: 100vh;
        background: #ffffff;
        z-index: var(--z-sticky);
        transform: translateX(100%);
        transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
        display: flex;
        flex-direction: column;
        box-shadow: -8px 0 30px rgba(0, 0, 0, 0.12);
    }

    .doc-drawer.active {
        transform: translateX(0);
    }

    /* Drawer Header */
    .doc-drawer-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 1.25rem 1.5rem;
        border-bottom: 1px solid #e5e7eb;
        background: #ffffff;
        flex-shrink: 0;
    }

    .doc-drawer-title {
        font-size: 1.125rem;
        font-weight: 700;
        color: #111827;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .doc-drawer-title-icon {
        width: 32px;
        height: 32px;
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
    }

    .doc-drawer-close {
        width: 36px;
        height: 36px;
        border-radius: 10px;
        border: 1px solid #e5e7eb;
        background: white;
        color: #6b7280;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.15s ease;
        font-size: 1.125rem;
    }

    .doc-drawer-close:hover {
        background: #f3f4f6;
        color: #111827;
        border-color: #d1d5db;
    }

    /* Drawer Tabs */
    .doc-drawer-tabs {
        display: flex;
        padding: 0 1.5rem;
        border-bottom: 1px solid #e5e7eb;
        background: #fafbfc;
        flex-shrink: 0;
    }

    .doc-drawer-tab {
        padding: 0.875rem 1.25rem;
        font-size: 0.875rem;
        font-weight: 600;
        color: #6b7280;
        background: none;
        border: none;
        border-bottom: 2px solid transparent;
        cursor: pointer;
        transition: all 0.15s ease;
        display: flex;
        align-items: center;
        gap: 0.5rem;
        white-space: nowrap;
    }

    .doc-drawer-tab:hover {
        color: #374151;
        background: #f3f4f6;
    }

    .doc-drawer-tab.active {
        color: #2563eb;
        border-bottom-color: #2563eb;
        background: transparent;
    }

    .doc-drawer-tab-icon {
        font-size: 1rem;
    }

    /* Drawer Body */
    .doc-drawer-body {
        flex: 1;
        overflow-y: auto;
        padding: 1.5rem;
        background: #f8fafc;
    }

    /* Beta badge in drawer */
    .doc-drawer-beta {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
        color: white;
        font-size: 0.625rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        padding: 0.2rem 0.5rem;
        border-radius: 999px;
    }

    /* Document Generation Panel Content */
    .doc-gen-section {
        background: white;
        border-radius: 16px;
        border: 1px solid #e5e7eb;
        padding: 1.5rem;
        margin-bottom: 1.25rem;
    }

    .doc-gen-section-title {
        font-size: 1rem;
        font-weight: 600;
        color: #111827;
        margin-bottom: 0.75rem;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .doc-gen-section-desc {
        font-size: 0.875rem;
        color: #6b7280;
        margin-bottom: 1rem;
        line-height: 1.5;
    }

    /* File Upload Zone in Drawer */
    .doc-drawer-upload-zone {
        border: 2px dashed #d1d5db;
        border-radius: 12px;
        padding: 2rem 1.5rem;
        text-align: center;
        transition: all 0.2s ease;
        cursor: pointer;
        background: #fafbfc;
    }

    .doc-drawer-upload-zone:hover,
    .doc-drawer-upload-zone.drag-over {
        border-color: #2563eb;
        background: #eff6ff;
    }

    .doc-drawer-upload-zone.drag-over {
        background: #dbeafe;
    }

    .doc-drawer-upload-icon {
        width: 56px;
        height: 56px;
        margin: 0 auto 1rem;
        background: linear-gradient(135deg, #e0e7ff 0%, #bfdbfe 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.5rem;
    }

    .doc-drawer-upload-title {
        font-size: 1rem;
        font-weight: 600;
        color: #374151;
        margin-bottom: 0.25rem;
    }

    .doc-drawer-upload-subtitle {
        font-size: 0.8125rem;
        color: #6b7280;
    }

    .doc-drawer-upload-formats {
        display: flex;
        gap: 0.375rem;
        justify-content: center;
        flex-wrap: wrap;
        margin-top: 1rem;
    }

    .doc-drawer-format-badge {
        padding: 0.25rem 0.625rem;
        background: white;
        border: 1px solid #e5e7eb;
        border-radius: 999px;
        font-size: 0.75rem;
        color: #4b5563;
        font-weight: 500;
    }

    /* File list in drawer */
    .doc-drawer-file-item {
        background: #f9fafb;
        border: 1px solid #e5e7eb;
        border-radius: 10px;
        padding: 0.75rem 1rem;
        display: flex;
        align-items: center;
        gap: 0.75rem;
        margin-bottom: 0.5rem;
    }

    .doc-drawer-file-icon {
        width: 40px;
        height: 40px;
        background: linear-gradient(135deg, #dbeafe 0%, #93c5fd 100%);
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.125rem;
        flex-shrink: 0;
    }

    .doc-drawer-file-info {
        flex: 1;
        min-width: 0;
    }

    .doc-drawer-file-name {
        font-weight: 600;
        color: #111827;
        font-size: 0.875rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .doc-drawer-file-meta {
        font-size: 0.75rem;
        color: #6b7280;
        margin-top: 0.125rem;
    }

    .doc-drawer-file-remove {
        width: 28px;
        height: 28px;
        border-radius: 6px;
        border: none;
        background: transparent;
        color: #9ca3af;
        cursor: pointer;
        font-size: 1rem;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.15s ease;
    }

    .doc-drawer-file-remove:hover {
        background: #fee2e2;
        color: #dc2626;
    }

    /* Source selection (template vs scratch) */
    .doc-drawer-source-options {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
        margin-bottom: 1rem;
    }

    .doc-drawer-source-option {
        border: 2px solid #e5e7eb;
        border-radius: 12px;
        padding: 1rem;
        cursor: pointer;
        transition: all 0.15s ease;
        text-align: center;
        background: white;
    }

    .doc-drawer-source-option:hover {
        border-color: #93c5fd;
        background: #f0f7ff;
    }

    .doc-drawer-source-option.selected {
        border-color: #2563eb;
        background: #eff6ff;
    }

    .doc-drawer-source-option-icon {
        font-size: 1.5rem;
        margin-bottom: 0.5rem;
    }

    .doc-drawer-source-option-title {
        font-size: 0.875rem;
        font-weight: 600;
        color: #111827;
    }

    .doc-drawer-source-option-desc {
        font-size: 0.75rem;
        color: #6b7280;
        margin-top: 0.25rem;
    }

    /* Tender template selection in drawer */
    .drawer-tpl-list {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
    }

    .drawer-tpl-item {
        position: relative;
    }

    .drawer-tpl-radio {
        position: absolute;
        opacity: 0;
        width: 0;
        height: 0;
    }

    .drawer-tpl-label {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        padding: 0.75rem;
        border: 2px solid #e5e7eb;
        border-radius: 10px;
        cursor: pointer;
        transition: all 0.15s ease;
        background: white;
    }

    .drawer-tpl-item:hover .drawer-tpl-label {
        border-color: #93c5fd;
        background: #f8fafc;
    }

    .drawer-tpl-item.selected .drawer-tpl-label,
    .drawer-tpl-radio:checked + .drawer-tpl-label {
        border-color: #2563eb;
        background: #eff6ff;
    }

    .drawer-tpl-icon {
        flex-shrink: 0;
        width: 36px;
        height: 36px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #f0f4ff;
        border-radius: 8px;
    }

    .drawer-tpl-ext {
        font-size: 0.625rem;
        font-weight: 700;
        color: #2563eb;
        text-transform: uppercase;
    }

    .drawer-tpl-info {
        flex: 1;
        min-width: 0;
    }

    .drawer-tpl-name {
        font-size: 0.8125rem;
        font-weight: 500;
        color: #111827;
        line-height: 1.3;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .drawer-tpl-meta {
        display: flex;
        align-items: center;
        gap: 0.375rem;
        margin-top: 0.25rem;
        flex-wrap: wrap;
    }

    .drawer-tpl-type-badge {
        font-size: 0.625rem;
        font-weight: 600;
        color: #6b7280;
        background: #f3f4f6;
        padding: 0.125rem 0.375rem;
        border-radius: 4px;
    }

    .drawer-tpl-size {
        font-size: 0.6875rem;
        color: #9ca3af;
    }

    .drawer-tpl-badge {
        font-size: 0.625rem;
        font-weight: 600;
        padding: 0.125rem 0.375rem;
        border-radius: 4px;
    }

    .drawer-tpl-badge.required {
        background: #fee2e2;
        color: #dc2626;
    }

    .drawer-tpl-badge.optional {
        background: #f3f4f6;
        color: #6b7280;
    }

    .drawer-tpl-check {
        flex-shrink: 0;
        width: 20px;
        height: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        border: 2px solid #d1d5db;
        color: transparent;
        transition: all 0.15s ease;
    }

    .drawer-tpl-radio:checked + .drawer-tpl-label .drawer-tpl-check {
        background: #2563eb;
        border-color: #2563eb;
        color: white;
    }

    /* Disabled (non-selectable) template items */
    .drawer-tpl-item-disabled .drawer-tpl-label {
        cursor: default;
        opacity: 0.7;
        background: #f9fafb;
    }
    .drawer-tpl-item-disabled .drawer-tpl-label:hover {
        border-color: #e5e7eb;
        background: #f9fafb;
    }

    /* Document URL external link */
    .drawer-tpl-url-link {
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 28px;
        height: 28px;
        border-radius: 6px;
        color: #6b7280;
        transition: all 0.15s ease;
        text-decoration: none;
    }
    .drawer-tpl-url-link:hover {
        color: #2563eb;
        background: #eff6ff;
    }

    /* Collapsible document groups in drawer */
    .drawer-tpl-group {
        margin-bottom: 1rem;
    }

    .drawer-tpl-group-header {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.625rem 0.75rem;
        background: #f8fafc;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        cursor: pointer;
        user-select: none;
        transition: all 0.15s ease;
        margin-bottom: 0.5rem;
    }

    .drawer-tpl-group-header:hover {
        background: #f1f5f9;
    }

    .drawer-tpl-group-chevron {
        width: 16px;
        height: 16px;
        transition: transform 0.2s ease;
        color: #6b7280;
        flex-shrink: 0;
    }

    .drawer-tpl-group-header.collapsed .drawer-tpl-group-chevron {
        transform: rotate(-90deg);
    }

    .drawer-tpl-group-title {
        font-size: 0.8125rem;
        font-weight: 600;
        color: #374151;
    }

    .drawer-tpl-group-count {
        font-size: 0.75rem;
        color: #6b7280;
        font-weight: 400;
    }

    .drawer-tpl-group-content {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        overflow: hidden;
        transition: max-height 0.3s ease;
    }

    .drawer-tpl-group-content.collapsed {
        max-height: 0 !important;
        overflow: hidden;
    }

    .drawer-tpl-required-info {
        display: flex;
        align-items: flex-start;
        gap: 0.5rem;
        padding: 0.625rem 0.75rem;
        background: #eff6ff;
        border: 1px solid #bfdbfe;
        border-radius: 8px;
        margin-bottom: 0.5rem;
        font-size: 0.75rem;
        color: #1e40af;
        line-height: 1.4;
    }

    .drawer-tpl-required-info svg {
        flex-shrink: 0;
        margin-top: 1px;
    }

    .doc-drawer-scratch-hint {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.5rem 0.75rem;
        background: #eff6ff;
        border: 1px solid #e0d7f9;
        border-radius: 8px;
        margin-top: 0.75rem;
        font-size: 0.75rem;
        color: #3b82f6;
        line-height: 1.4;
    }

    .doc-drawer-scratch-hint svg {
        flex-shrink: 0;
    }

    /* Action buttons in drawer */
    .doc-drawer-actions {
        padding: 1rem 1.5rem;
        border-top: 1px solid #e5e7eb;
        background: white;
        flex-shrink: 0;
        display: flex;
        gap: 0.75rem;
    }

    .doc-drawer-btn-primary {
        flex: 1;
        padding: 0.75rem 1.25rem;
        border-radius: 10px;
        font-size: 0.875rem;
        font-weight: 600;
        cursor: pointer;
        border: none;
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        color: white;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        transition: all 0.2s ease;
    }

    .doc-drawer-btn-primary:hover:not(:disabled) {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
    }

    .doc-drawer-btn-primary:disabled {
        opacity: 0.5;
        cursor: not-allowed;
        transform: none;
    }

    .doc-drawer-btn-secondary {
        padding: 0.75rem 1.25rem;
        border-radius: 10px;
        font-size: 0.875rem;
        font-weight: 600;
        cursor: pointer;
        background: white;
        color: #374151;
        border: 1px solid #d1d5db;
        transition: all 0.15s ease;
    }

    .doc-drawer-btn-secondary:hover {
        background: #f9fafb;
        border-color: #9ca3af;
    }

    /* Additional context section in drawer */
    .doc-drawer-context-section {
        margin-top: 1.25rem;
        padding: 1rem;
        background: #fafbfc;
        border: 1px solid #e5e7eb;
        border-radius: 12px;
    }

    .doc-drawer-context-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 0.5rem;
    }

    .doc-drawer-context-title {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.875rem;
        font-weight: 600;
        color: #374151;
    }

    .doc-drawer-context-badge {
        font-size: 0.6875rem;
        font-weight: 500;
        color: #6b7280;
        background: #f3f4f6;
        padding: 0.125rem 0.5rem;
        border-radius: 100px;
        border: 1px solid #e5e7eb;
    }

    .doc-drawer-context-textarea {
        width: 100%;
        min-height: 100px;
        max-height: 200px;
        padding: 0.75rem;
        border: 1.5px solid #d1d5db;
        border-radius: 8px;
        font-size: 0.8125rem;
        font-family: inherit;
        resize: vertical;
        background: white;
        color: #111827;
        line-height: 1.5;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
        box-sizing: border-box;
    }

    .doc-drawer-context-textarea:focus {
        outline: none;
        border-color: #3b82f6;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }

    .doc-drawer-context-textarea::placeholder {
        color: #9ca3af;
        font-size: 0.8125rem;
    }

    .doc-drawer-context-counter {
        text-align: right;
        margin-top: 0.375rem;
        font-size: 0.75rem;
    }

    .doc-drawer-context-char-count {
        font-weight: 600;
        color: #3b82f6;
    }

    .doc-drawer-context-char-label {
        color: #9ca3af;
    }

    /* Credit cost info in drawer */
    .drawer-credits-banner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        background: #f0f9ff;
        border: 1px solid #bae6fd;
        border-radius: 10px;
        padding: 0.625rem 1rem;
        margin-top: 1rem;
    }

    .drawer-credits-banner.insufficient {
        background: #fef3c7;
        border-color: #fcd34d;
    }

    .drawer-credits-info {
        display: flex;
        align-items: center;
        gap: 0.375rem;
        font-size: 0.8125rem;
        color: #0369a1;
        flex-wrap: wrap;
    }

    .drawer-credits-banner.insufficient .drawer-credits-info {
        color: #92400e;
    }

    .drawer-credits-buy-link {
        font-size: 0.8125rem;
        font-weight: 600;
        color: #2563eb;
        text-decoration: none;
        white-space: nowrap;
        padding: 0.25rem 0.625rem;
        border-radius: 6px;
        background: white;
        border: 1px solid #bfdbfe;
        transition: all 0.15s ease;
    }

    .drawer-credits-buy-link:hover {
        background: #eff6ff;
        border-color: #93c5fd;
    }

    /* Progress indicator in drawer */
    .doc-drawer-progress {
        background: white;
        border-radius: 16px;
        border: 1px solid #e5e7eb;
        padding: 2rem 1.5rem;
        text-align: center;
    }

    .doc-drawer-progress-spinner {
        width: 48px;
        height: 48px;
        border: 3px solid #e5e7eb;
        border-top-color: #2563eb;
        border-radius: 50%;
        animation: doc-drawer-spin 1s linear infinite;
        margin: 0 auto 1rem;
    }

    @keyframes doc-drawer-spin {
        to { transform: rotate(360deg); }
    }

    .doc-drawer-progress-title {
        font-size: 1rem;
        font-weight: 600;
        color: #111827;
        margin-bottom: 0.5rem;
    }

    .doc-drawer-progress-subtitle {
        font-size: 0.875rem;
        color: #6b7280;
    }

    .doc-drawer-progress-bar-track {
        height: 6px;
        background: #e5e7eb;
        border-radius: 999px;
        overflow: hidden;
        margin-top: 1rem;
    }

    .doc-drawer-progress-bar-fill {
        height: 100%;
        background: linear-gradient(90deg, #2563eb 0%, #60a5fa 100%);
        border-radius: 999px;
        transition: width 0.5s ease;
        animation: doc-drawer-shimmer 2s linear infinite;
        background-size: 200% 100%;
    }

    @keyframes doc-drawer-shimmer {
        0% { background-position: -200% 0; }
        100% { background-position: 200% 0; }
    }

    /* Results in drawer */
    .doc-drawer-result-card {
        background: white;
        border-radius: 12px;
        border: 1px solid #e5e7eb;
        padding: 1.25rem;
        margin-bottom: 0.75rem;
        transition: all 0.15s ease;
    }

    .doc-drawer-result-card:hover {
        border-color: #93c5fd;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    }

    /* Review issue cards */
    .doc-drawer-issue {
        background: white;
        border-radius: 12px;
        border: 1px solid #e5e7eb;
        padding: 1rem;
        margin-bottom: 0.75rem;
    }

    .doc-drawer-issue-header {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .doc-drawer-issue-severity {
        padding: 0.2rem 0.5rem;
        border-radius: 6px;
        font-size: 0.6875rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.03em;
    }

    .doc-drawer-issue-severity.critical {
        background: #fef2f2;
        color: #dc2626;
    }

    .doc-drawer-issue-severity.major {
        background: #fff7ed;
        color: #ea580c;
    }

    .doc-drawer-issue-severity.minor {
        background: #fefce8;
        color: #ca8a04;
    }

    .doc-drawer-issue-severity.info {
        background: #eff6ff;
        color: #2563eb;
    }

    .doc-drawer-issue-title {
        font-size: 0.875rem;
        font-weight: 600;
        color: #111827;
        flex: 1;
    }

    .doc-drawer-issue-desc {
        font-size: 0.8125rem;
        color: #6b7280;
        line-height: 1.5;
    }

    .doc-drawer-issue-location {
        font-size: 0.75rem;
        color: #9ca3af;
        margin-top: 0.5rem;
        font-style: italic;
    }

    /* Score badge in drawer */
    .doc-drawer-score {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1rem;
        padding: 1.25rem;
        background: white;
        border-radius: 16px;
        border: 1px solid #e5e7eb;
        margin-bottom: 1.25rem;
    }

    .doc-drawer-score-circle {
        width: 72px;
        height: 72px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.5rem;
        font-weight: 800;
        color: white;
        flex-shrink: 0;
    }

    .doc-drawer-score-info {
        flex: 1;
    }

    .doc-drawer-score-label {
        font-size: 0.8125rem;
        color: #6b7280;
        margin-bottom: 0.25rem;
    }

    .doc-drawer-score-title {
        font-size: 1rem;
        font-weight: 700;
        color: #111827;
    }

    /* Tender search in drawer */
    .doc-drawer-tender-search {
        position: relative;
        margin-bottom: 1rem;
    }

    .doc-drawer-tender-input {
        width: 100%;
        padding: 0.75rem 1rem 0.75rem 2.75rem;
        border: 2px solid #e5e7eb;
        border-radius: 10px;
        font-size: 0.875rem;
        transition: all 0.15s ease;
        background: white;
        box-sizing: border-box;
    }

    .doc-drawer-tender-input:focus {
        outline: none;
        border-color: #2563eb;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    }

    .doc-drawer-search-icon {
        position: absolute;
        left: 0.875rem;
        top: 50%;
        transform: translateY(-50%);
        color: #9ca3af;
    }

    /* Tender result item in drawer search */
    .doc-drawer-tender-item {
        padding: 0.75rem;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        cursor: pointer;
        transition: all 0.15s ease;
        margin-bottom: 0.5rem;
        background: white;
    }

    .doc-drawer-tender-item:hover {
        border-color: #93c5fd;
        background: #f0f7ff;
    }

    .doc-drawer-tender-item.selected {
        border-color: #2563eb;
        background: #eff6ff;
    }

    .doc-drawer-tender-item-title {
        font-size: 0.875rem;
        font-weight: 600;
        color: #111827;
        margin-bottom: 0.25rem;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .doc-drawer-tender-item-meta {
        font-size: 0.75rem;
        color: #6b7280;
    }

    /* Empty state in drawer */
    .doc-drawer-empty {
        text-align: center;
        padding: 3rem 1.5rem;
    }

    .doc-drawer-empty-icon {
        font-size: 2.5rem;
        margin-bottom: 1rem;
        opacity: 0.5;
    }

    .doc-drawer-empty-title {
        font-size: 1rem;
        font-weight: 600;
        color: #374151;
        margin-bottom: 0.5rem;
    }

    .doc-drawer-empty-desc {
        font-size: 0.875rem;
        color: #6b7280;
    }

    /* Responsive */
    @media (max-width: 1200px) {
        .doc-drawer {
            width: 75%;
        }
    }

    @media (max-width: 768px) {
        .doc-drawer {
            width: 100%;
            max-width: none;
        }
    }

    /* ========== LANDING PAGE REDESIGN ========== */

    /* Animations */
    @keyframes lp-fadeInUp {
        from { opacity: 0; transform: translateY(24px); }
        to { opacity: 1; transform: translateY(0); }
    }
    @keyframes lp-fadeInDown {
        from { opacity: 0; transform: translateY(-16px); }
        to { opacity: 1; transform: translateY(0); }
    }
    @keyframes lp-pulseDot {
        0%, 100% { opacity: 1; transform: scale(1); }
        50% { opacity: 0.5; transform: scale(1.5); }
    }
    @keyframes lp-blinkCursor {
        0%, 100% { opacity: 1; }
        50% { opacity: 0; }
    }
    @keyframes lp-cardSlideIn {
        to { opacity: 1; transform: translateY(0); }
    }
    @keyframes lp-tabFadeIn {
        from { opacity: 0; transform: translateY(10px); }
        to { opacity: 1; transform: translateY(0); }
    }
    .lp-scroll-animate {
        opacity: 0;
        transform: translateY(30px);
        transition: opacity 0.7s ease-out, transform 0.7s ease-out;
    }
    .lp-scroll-animate.visible {
        opacity: 1;
        transform: translateY(0);
    }
    .lp-scroll-animate.delay-1 { transition-delay: 0.1s; }
    .lp-scroll-animate.delay-2 { transition-delay: 0.2s; }
    .lp-scroll-animate.delay-3 { transition-delay: 0.3s; }

    /* Hero Section */
    .lp-hero {
        padding: 130px 0 80px;
        background: linear-gradient(180deg, #eff6ff 0%, #f8fafc 60%, #ffffff 100%);
        position: relative;
        overflow: hidden;
    }
    .lp-hero::before {
        content: '';
        position: absolute;
        top: -100px;
        right: -200px;
        width: 600px;
        height: 600px;
        background: radial-gradient(circle, rgba(37,99,235,0.06) 0%, transparent 70%);
        border-radius: 50%;
        pointer-events: none;
    }
    .lp-hero::after {
        content: '';
        position: absolute;
        bottom: -100px;
        left: -150px;
        width: 500px;
        height: 500px;
        background: radial-gradient(circle, rgba(6,182,212,0.04) 0%, transparent 70%);
        border-radius: 50%;
        pointer-events: none;
    }
    .lp-hero-content {
        text-align: center;
        max-width: 700px;
        margin: 0 auto 48px;
        position: relative;
        z-index: 1;
    }
    .lp-hero-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: #ffffff;
        border: 1px solid #dbeafe;
        color: #2563eb;
        font-size: 13px;
        font-weight: 600;
        padding: 6px 16px;
        border-radius: 9999px;
        margin-bottom: 24px;
        animation: lp-fadeInDown 0.6s ease-out;
    }
    .lp-hero-badge-dot {
        width: 6px;
        height: 6px;
        background: #10b981;
        border-radius: 50%;
        animation: lp-pulseDot 2s infinite;
    }
    .lp-hero h1 {
        font-size: 44px;
        font-weight: 800;
        line-height: 1.15;
        letter-spacing: -1.2px;
        color: #0f172a;
        margin-bottom: 20px;
        animation: lp-fadeInUp 0.6s ease-out 0.1s both;
    }
    .lp-hero h1 span {
        color: #2563eb;
    }
    .lp-hero-sub {
        font-size: 19px;
        color: #64748b;
        max-width: 540px;
        margin: 0 auto;
        line-height: 1.7;
        animation: lp-fadeInUp 0.6s ease-out 0.2s both;
    }

    /* Search Demo */
    .lp-search-demo {
        max-width: 700px;
        margin: 0 auto;
        position: relative;
        z-index: 1;
        animation: lp-fadeInUp 0.8s ease-out 0.3s both;
    }

    /* Chat Hero Widget */
    .hw-browser-frame {
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.07), 0 20px 50px -12px rgba(0,0,0,0.12);
        border: 1px solid #e2e8f0;
        background: #fff;
    }
    .hw-browser-chrome {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 10px 14px;
        background: #f8fafc;
        border-bottom: 1px solid #e2e8f0;
    }
    .hw-traffic-lights { display: flex; gap: 6px; flex-shrink: 0; }
    .hw-traffic-lights span { width: 10px; height: 10px; border-radius: 50%; }
    .hw-tl-red { background: #ef4444; }
    .hw-tl-yellow { background: #eab308; }
    .hw-tl-green { background: #22c55e; }
    .hw-url-bar {
        flex: 1;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 6px;
        padding: 5px 12px;
        font-size: 12px;
        color: #64748b;
        text-align: center;
        user-select: none;
    }
    .hw-chat-container {
        height: 390px;
        display: flex;
        flex-direction: column;
        background: #fff;
        overflow: hidden;
        position: relative;
    }
    .hw-chat-messages {
        flex: 1;
        padding: 16px 24px 10px;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        gap: 12px;
        overflow: hidden;
    }
    .hw-msg { display: flex; gap: 10px; }
    .hw-msg-user { flex-direction: row-reverse; }
    .hw-msg-animated { opacity: 0; }
    .hw-msg-animated.hw-visible { opacity: 1; }
    .hw-msg-animated.hw-msg-user { animation: hw-fadeSlideLeft 300ms ease forwards; }
    .hw-msg-animated.hw-msg-ai { animation: hw-fadeSlideRight 350ms ease forwards; }
    .hw-avatar {
        width: 28px; height: 28px;
        border-radius: 50%;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 11px;
        font-weight: 600;
    }
    .hw-avatar-user { background: #e2e8f0; color: #64748b; }
    .hw-avatar-ai { background: #2563eb; color: #fff; }
    .hw-avatar-ai svg { width: 13px; height: 13px; }
    .hw-bubble {
        max-width: 85%;
        padding: 10px 14px;
        font-size: 13px;
        line-height: 1.55;
        color: #1e293b;
    }
    .hw-bubble-user {
        background: #eff6ff;
        border-radius: 14px 14px 4px 14px;
    }
    .hw-bubble-ai {
        background: #fff;
        border: 1px solid #e5e7eb;
        border-radius: 14px 14px 14px 4px;
        box-shadow: 0 1px 2px rgba(0,0,0,0.04);
    }
    .hw-bubble-ai strong { color: #111827; font-weight: 600; }
    .hw-bubble-ai em { color: #2563eb; font-style: normal; font-weight: 500; }
    .hw-thinking { display: inline-flex; gap: 4px; padding: 4px 0; }
    .hw-thinking span {
        width: 5px; height: 5px;
        border-radius: 50%;
        background: #94a3b8;
        animation: hw-bounce 1.4s ease-in-out infinite;
    }
    .hw-thinking span:nth-child(2) { animation-delay: 0.2s; }
    .hw-thinking span:nth-child(3) { animation-delay: 0.4s; }
    @keyframes hw-bounce {
        0%, 80%, 100% { transform: translateY(0); opacity: 0.4; }
        40% { transform: translateY(-5px); opacity: 1; }
    }
    .hw-tender-rows { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
    .hw-tender-row {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 10px;
        background: #f9fafb;
        border: 1px solid #f1f5f9;
        border-radius: 8px;
        cursor: pointer;
        transition: border-color 150ms, background 150ms;
        opacity: 0;
        transform: translateY(8px);
    }
    .hw-tender-row.hw-visible {
        opacity: 1;
        transform: translateY(0);
        transition: opacity 300ms ease, transform 300ms ease, border-color 150ms, background 150ms;
    }
    .hw-tender-row:hover { border-color: #dbeafe; background: #f0f7ff; }
    .hw-tender-flag { font-size: 15px; flex-shrink: 0; line-height: 1; }
    .hw-tender-info { flex: 1; min-width: 0; }
    .hw-tender-title {
        font-size: 12.5px;
        font-weight: 600;
        color: #1e293b;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .hw-tender-meta {
        font-size: 11px;
        color: #64748b;
        margin-top: 1px;
        display: flex;
        align-items: center;
        gap: 6px;
    }
    .hw-tender-meta .hw-dot { color: #cbd5e1; }
    .hw-tender-value { font-size: 12px; font-weight: 600; color: #1e293b; white-space: nowrap; flex-shrink: 0; }
    .hw-match-badge {
        font-size: 10px;
        font-weight: 600;
        padding: 2px 7px;
        border-radius: 4px;
        white-space: nowrap;
        flex-shrink: 0;
    }
    .hw-match-high { background: #ecfdf5; color: #047857; border: 1px solid #a7f3d0; }
    .hw-match-mid { background: #eff6ff; color: #1d4ed8; border: 1px solid #bfdbfe; }
    .hw-chips { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; opacity: 0; }
    .hw-chips.hw-visible { opacity: 1; transition: opacity 350ms ease; }
    .hw-chip {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 4px 10px;
        background: #f9fafb;
        border: 1px solid #e2e8f0;
        border-radius: 14px;
        font-size: 11px;
        font-weight: 500;
        color: #475569;
        cursor: pointer;
        transition: all 180ms;
    }
    .hw-chip:hover { background: #eff6ff; border-color: #93c5fd; color: #2563eb; }
    .hw-chip svg { width: 10px; height: 10px; flex-shrink: 0; }
    .hw-composer { padding: 8px 16px 14px; border-top: 1px solid #f1f5f9; background: #fff; }
    .hw-composer-inner {
        display: flex;
        align-items: center;
        gap: 8px;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 6px 10px;
        background: #fff;
        transition: border-color 200ms, box-shadow 200ms;
    }
    .hw-composer-inner.hw-focused { border-color: #93c5fd; box-shadow: 0 0 0 2px rgba(37,99,235,0.08); }
    .hw-composer-icon {
        width: 28px; height: 28px;
        border-radius: 6px;
        border: none;
        background: transparent;
        color: #94a3b8;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        flex-shrink: 0;
    }
    .hw-composer-text {
        flex: 1;
        font-size: 13px;
        color: #1e293b;
        min-height: 20px;
        display: flex;
        align-items: center;
        user-select: none;
        white-space: nowrap;
        overflow: hidden;
    }
    .hw-composer-text.hw-placeholder { color: #94a3b8; }
    .hw-composer-send {
        width: 28px; height: 28px;
        border-radius: 50%;
        border: none;
        background: #2563eb;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        flex-shrink: 0;
        transition: transform 150ms;
    }
    .hw-composer-send svg { width: 13px; height: 13px; }
    .hw-cursor {
        display: inline-block;
        width: 1.5px;
        height: 14px;
        background: #2563eb;
        margin-left: 1px;
        flex-shrink: 0;
        animation: hw-blink 0.7s step-end infinite;
    }
    @keyframes hw-blink { 50% { opacity: 0; } }
    @keyframes hw-fadeSlideLeft {
        from { opacity: 0; transform: translateX(12px); }
        to { opacity: 1; transform: translateX(0); }
    }
    @keyframes hw-fadeSlideRight {
        from { opacity: 0; transform: translateX(-12px); }
        to { opacity: 1; transform: translateX(0); }
    }
    @media (max-width: 768px) {
        .hw-browser-frame { border-radius: 10px; }
        .hw-chat-container { height: 340px; }
        .hw-chat-messages { padding: 12px; gap: 8px; }
        .hw-bubble { font-size: 12px; padding: 8px 12px; max-width: 88%; }
        .hw-avatar { width: 24px; height: 24px; font-size: 10px; }
        .hw-tender-row { gap: 6px; padding: 6px 8px; }
        .hw-tender-title { font-size: 11px; }
        .hw-tender-meta { font-size: 10px; }
        .hw-tender-value { font-size: 11px; }
        .hw-match-badge { font-size: 9px; padding: 2px 5px; }
        .hw-tender-flag { font-size: 13px; }
        .hw-chip { font-size: 10px; padding: 4px 8px; }
        .hw-composer { padding: 6px 10px 10px; }
        .hw-url-bar { font-size: 11px; }
    }
    @media (max-width: 480px) {
        .hw-chat-container { height: 320px; }
        .hw-chat-messages { padding: 10px; gap: 8px; }
        .hw-bubble { font-size: 11.5px; padding: 7px 10px; }
        .hw-tender-title { font-size: 10.5px; }
        .hw-tender-meta span { font-size: 9px; }
        .hw-composer { padding: 6px 8px 8px; }
    }
    .lp-hero-stats {
        text-align: center;
        margin-top: 32px;
        font-size: 14px;
        color: #64748b;
        animation: lp-fadeInUp 0.6s ease-out 1.5s both;
    }
    .lp-hero-stats strong { color: #2563eb; font-weight: 700; }

    /* Section Common */
    .lp-section-label {
        display: inline-block;
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1.5px;
        color: #2563eb;
        margin-bottom: 12px;
    }
    .lp-section-title {
        font-size: 40px;
        font-weight: 800;
        letter-spacing: -1px;
        color: #0f172a;
        margin-bottom: 16px;
        line-height: 1.15;
    }
    .lp-section-subtitle {
        font-size: 17px;
        color: #64748b;
        max-width: 560px;
        line-height: 1.7;
    }

    /* Feature Tabs */
    .lp-features {
        padding: 100px 0;
        background: #eff6ff;
    }
    .lp-features-header {
        text-align: center;
        margin-bottom: 48px;
    }
    .lp-features-header .lp-section-subtitle { margin: 0 auto; }
    .lp-tab-system { position: relative; overflow: hidden; }
    .lp-tab-radio { display: none; }
    .lp-tab-nav {
        display: flex;
        justify-content: center;
        gap: 4px;
        margin-bottom: 40px;
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        padding: 4px;
        max-width: 960px;
        flex-wrap: nowrap;
        margin-left: auto;
        margin-right: auto;
        box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    }
    .lp-tab-label {
        flex: 1;
        text-align: center;
        padding: 12px 16px;
        font-size: 14px;
        font-weight: 600;
        color: #64748b;
        border-radius: 8px;
        cursor: pointer;
        transition: all 0.3s;
        user-select: none;
        white-space: nowrap;
    }
    .lp-tab-label:hover { color: #334155; }
    #lp-tab1:checked ~ .lp-tab-nav .lp-tab-label[for="lp-tab1"],
    #lp-tab2:checked ~ .lp-tab-nav .lp-tab-label[for="lp-tab2"],
    #lp-tab3:checked ~ .lp-tab-nav .lp-tab-label[for="lp-tab3"],
    #lp-tab4:checked ~ .lp-tab-nav .lp-tab-label[for="lp-tab4"],
    #lp-tab5:checked ~ .lp-tab-nav .lp-tab-label[for="lp-tab5"],
    #lp-tab6:checked ~ .lp-tab-nav .lp-tab-label[for="lp-tab6"] {
        background: #2563eb;
        color: #ffffff;
        box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    }
    .lp-tab-panels { position: relative; min-height: 400px; }
    .lp-tab-panel {
        display: none;
        animation: lp-tabFadeIn 0.4s ease-out;
    }
    #lp-tab1:checked ~ .lp-tab-panels .lp-tab-panel:nth-child(1),
    #lp-tab2:checked ~ .lp-tab-panels .lp-tab-panel:nth-child(2),
    #lp-tab3:checked ~ .lp-tab-panels .lp-tab-panel:nth-child(3),
    #lp-tab4:checked ~ .lp-tab-panels .lp-tab-panel:nth-child(4),
    #lp-tab5:checked ~ .lp-tab-panels .lp-tab-panel:nth-child(5),
    #lp-tab6:checked ~ .lp-tab-panels .lp-tab-panel:nth-child(6) {
        display: flex;
        gap: 48px;
        align-items: flex-start;
    }

    /* ═══ Mockup screen (shared shell) ═══ */
    .lp-mockup-screen {
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 16px;
        overflow: hidden;
        max-width: 900px;
        width: 100%;
        margin: 0 auto;
        box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
        box-sizing: border-box;
    }
    .lp-mockup-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 16px 24px;
        background: #ffffff;
        border-bottom: 1px solid #e2e8f0;
    }
    .lp-mockup-header-title { font-weight: 700; font-size: 16px; color: #1e293b; }
    .lp-mockup-header-actions { display: flex; gap: 8px; }
    .lp-mockup-btn {
        padding: 6px 14px;
        border-radius: 6px;
        font-size: 12px;
        font-weight: 600;
        border: 1px solid #e2e8f0;
        background: #ffffff;
        color: #475569;
    }
    .lp-mockup-btn.primary { background: #2563eb; color: #ffffff; border-color: #2563eb; }
    .lp-mockup-body { padding: 24px; }

    /* Feature panel: side-by-side layout */
    .lp-fp-mockup { flex: 1; min-width: 0; max-width: 100%; overflow: hidden; }
    .lp-fp-text { flex: 0 0 340px; }
    .lp-fp-title { font-size: 24px; font-weight: 800; color: #0f172a; margin-bottom: 12px; line-height: 1.3; }
    .lp-fp-desc { font-size: 15px; color: #475569; line-height: 1.7; margin-bottom: 16px; }
    .lp-fp-bullets { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
    .lp-fp-bullets li { font-size: 14px; color: #334155; padding-left: 20px; position: relative; line-height: 1.5; }
    .lp-fp-bullets li::before { content: ""; position: absolute; left: 0; top: 7px; width: 8px; height: 8px; border-radius: 50%; background: #2563eb; }

    /* ═══ Shared composer bar (chat + insights) ═══ */
    .lp-composer-bar {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 14px;
        background: #ffffff;
        border-top: 1px solid #e2e8f0;
    }
    .lp-composer-placeholder { flex: 1; font-size: 13px; color: #94a3b8; }
    .lp-composer-send {
        width: 32px; height: 32px;
        background: #2563eb; border: none; border-radius: 8px;
        color: #fff; display: flex; align-items: center; justify-content: center;
    }

    /* ═══ TAB 1: AI Chat — conversation ═══ */
    .lp-mockup-chat { display: flex; flex-direction: column; }
    .lp-chat-messages { flex: 1; padding: 16px; display: flex; flex-direction: column; gap: 12px; overflow: hidden; }
    .lp-chat-msg { display: flex; gap: 8px; }
    .lp-chat-msg-user { flex-direction: row-reverse; }
    .lp-chat-avatar {
        width: 26px; height: 26px; border-radius: 50%;
        font-size: 11px; font-weight: 600;
        display: flex; align-items: center; justify-content: center;
        flex-shrink: 0;
    }
    .lp-chat-avatar-user { background: #e2e8f0; color: #64748b; }
    .lp-chat-avatar-ai { background: #2563eb; color: #fff; }
    .lp-chat-bubble {
        max-width: 85%; border-radius: 12px;
        padding: 8px 12px; font-size: 12px; line-height: 1.5;
    }
    .lp-chat-bubble-user { background: #2563eb; color: #fff; border-bottom-right-radius: 4px; }
    .lp-chat-bubble-ai { background: #f8fafc; color: #334155; border: 1px solid #e2e8f0; border-bottom-left-radius: 4px; }
    .lp-chat-bubble-ai strong { color: #111827; font-weight: 600; }
    .lp-chat-tender-rows { display: flex; flex-direction: column; gap: 5px; margin-top: 8px; }
    .lp-chat-tender-row {
        display: flex; align-items: center; gap: 8px;
        padding: 6px 8px; border-radius: 8px;
        background: #fff; border: 1px solid #e5e7eb;
    }
    .lp-chat-flag { font-size: 14px; flex-shrink: 0; }
    .lp-chat-tender-info { flex: 1; min-width: 0; }
    .lp-chat-tender-title { font-size: 11px; font-weight: 600; color: #0f172a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .lp-chat-tender-meta { font-size: 10px; color: #94a3b8; }
    .lp-chat-tender-value { font-size: 11px; font-weight: 600; color: #0f172a; white-space: nowrap; }
    .lp-chat-match-badge {
        font-size: 10px; font-weight: 700; color: #fff;
        background: #22c55e; padding: 2px 6px; border-radius: 4px;
        white-space: nowrap;
    }
    .lp-chat-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
    .lp-chat-chip {
        font-size: 10px; font-weight: 500; color: #475569;
        padding: 4px 10px; border-radius: 8px;
        background: #fff; border: 1px solid #e2e8f0;
    }

    /* ═══ TAB 2: Smart Matching ═══ */
    .lp-match-header { background: #fff; border-bottom: 1px solid #e2e8f0; padding: 16px 20px 12px; }

    /* Scope card */
    .lp-scope-card { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
    .lp-scope-icon {
        width: 36px; height: 36px; border-radius: 8px;
        background: #eff6ff; display: flex; align-items: center; justify-content: center;
    }
    .lp-scope-text { min-width: 0; }
    .lp-scope-title { font-size: 14px; font-weight: 600; color: #0f172a; }
    .lp-scope-meta { font-size: 11px; color: #94a3b8; display: flex; align-items: center; gap: 2px; flex-wrap: wrap; }

    /* Tier pill tabs */
    .lp-tier-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
    .lp-tier-pill {
        display: inline-flex; align-items: center; gap: 5px;
        padding: 5px 12px; border-radius: 9999px;
        font-size: 12px; font-weight: 500; color: #475569;
        background: #fff; border: 1px solid #e5e7eb;
        white-space: nowrap;
    }
    .lp-tier-pill.active { background: #0f172a; color: #fff; border-color: #0f172a; }
    .lp-tier-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
    .lp-tier-count { font-size: 11px; font-weight: 600; opacity: 0.7; }

    /* Match card grid — 3 columns side by side */
    .lp-match-body { padding: 10px 12px; }
    .lp-mc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
    .lp-mc-card {
        background: #fff; border: 1px solid #e2e8f0; border-radius: 10px;
        padding: 12px;
        transition: box-shadow 0.2s;
        display: flex; flex-direction: column;
        min-width: 0;
    }
    .lp-mc-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.06); }

    /* Match card: top row with tier badge */
    .lp-mc-top { margin-bottom: 8px; }
    .lp-mc-tier {
        display: inline-block;
        font-size: 10px; font-weight: 600;
        padding: 2px 8px; border-radius: 5px;
    }
    .lp-mc-tier.perfect { background: #dcfce7; color: #166534; }
    .lp-mc-tier.strong { background: #dbeafe; color: #1e40af; }
    .lp-mc-tier.possible { background: #fef3c7; color: #92400e; }

    /* Match card: title row with score dial */
    .lp-mc-title-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
    .lp-mc-dial {
        width: 36px; height: 36px; border-radius: 50%;
        display: flex; align-items: center; justify-content: center;
        font-size: 11px; font-weight: 800; flex-shrink: 0;
        position: relative;
        background: conic-gradient(var(--dial-color) calc(var(--p) * 1%), #e2e8f0 0);
    }
    .lp-mc-dial::after {
        content: ''; position: absolute;
        inset: 3px; border-radius: 50%; background: #fff;
    }
    .lp-mc-dial { z-index: 0; color: var(--dial-color); }
    .lp-mc-dial * { position: relative; z-index: 1; }
    .lp-mc-dial.perfect { --dial-color: #22c55e; color: #166534; }
    .lp-mc-dial.strong { --dial-color: #3b82f6; color: #1e40af; }
    .lp-mc-dial.possible { --dial-color: #f59e0b; color: #92400e; }
    .lp-mc-title-col { min-width: 0; }
    .lp-mc-title { font-size: 13px; font-weight: 600; color: #1e293b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .lp-mc-buyer { font-size: 10px; color: #64748b; margin-top: 2px; display: flex; align-items: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

    /* Match card: facts row */
    .lp-mc-facts { display: flex; gap: 0; margin-bottom: 8px; border-top: 1px solid #f1f5f9; border-bottom: 1px solid #f1f5f9; padding: 6px 0; }
    .lp-mc-facts > div { flex: 1; }
    .lp-mc-facts > div:nth-child(2) { text-align: center; }
    .lp-mc-facts > div:last-child { text-align: right; }
    .lp-mc-fact-label { font-size: 8px; font-weight: 600; color: #94a3b8; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 1px; }
    .lp-mc-fact-value { font-size: 11px; font-weight: 600; color: #1e293b; }

    /* Match card: AI reason */
    .lp-mc-reason {
        display: flex; align-items: flex-start; gap: 5px;
        padding: 6px 8px; background: #f8fafc; border-radius: 6px;
        font-size: 10px; color: #475569; line-height: 1.4;
    }
    .lp-mc-reason svg { margin-top: 1px; }
    .lp-mc-reason-text { flex: 1; }

    /* Match card: bid decision */
    .lp-mc-bid-section {
        margin-top: 10px; padding-top: 10px;
        border-top: 1px solid #f1f5f9;
    }
    .lp-mc-bid-prompt { font-size: 10px; color: #64748b; margin-bottom: 5px; }
    .lp-mc-bid-group { display: flex; gap: 0; }
    .lp-mc-bid-btn {
        flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 3px;
        padding: 5px 2px; font-size: 10px; font-weight: 500; color: #475569;
        background: #fff; border: 1px solid #e5e7eb; cursor: pointer;
    }
    .lp-mc-bid-btn:first-child { border-radius: 6px 0 0 6px; }
    .lp-mc-bid-btn:last-child { border-radius: 0 6px 6px 0; }
    .lp-mc-bid-btn:not(:first-child) { border-left: none; }
    .lp-mc-bid-btn:hover { background: #f8fafc; }

    /* ═══ TAB 3: Insights — analytics charts ═══ */
    .lp-mockup-insights { display: flex; flex-direction: column; }
    .lp-ins-analytics { padding: 16px 20px; display: flex; flex-direction: column; gap: 12px; }
    .lp-ins-section-title { display: flex; align-items: center; margin-bottom: 2px; }
    .lp-ins-card {
        background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 14px 16px;
    }
    .lp-ins-card-title { font-size: 12px; font-weight: 700; color: #0f172a; margin-bottom: 2px; }
    .lp-ins-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2px; }

    /* Insights: period pills */
    .lp-ins-periods { display: flex; gap: 4px; }
    .lp-ins-period {
        font-size: 10px; font-weight: 500; color: #64748b;
        padding: 2px 8px; border-radius: 6px; background: #f8fafc;
    }
    .lp-ins-period.active { background: #eff6ff; color: #2563eb; font-weight: 600; }

    /* Insights: line chart */
    .lp-ins-line-svg { width: 100%; height: 80px; display: block; margin-top: 8px; }
    .lp-ins-x-axis {
        display: flex; justify-content: space-between;
        margin-top: 4px; padding: 0 2px;
    }
    .lp-ins-x-axis span { font-size: 9px; color: #94a3b8; }

    /* Insights: bottom grid */
    .lp-ins-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }

    /* Insights: segmented distribution bar */
    .lp-ins-seg-bar {
        display: flex; height: 12px; border-radius: 4px; overflow: hidden; gap: 1px;
        margin-top: 8px;
    }
    .lp-ins-seg { min-width: 3px; }
    .lp-ins-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 8px; }
    .lp-ins-leg { display: inline-flex; align-items: center; gap: 4px; font-size: 9px; color: #475569; white-space: nowrap; }
    .lp-ins-dot { width: 6px; height: 6px; border-radius: 2px; display: inline-block; flex-shrink: 0; }

    /* Insights: donut chart */
    .lp-ins-donut-layout { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
    .lp-ins-donut-svg { width: 70px; height: 70px; flex-shrink: 0; }
    .lp-ins-donut-legend { display: flex; flex-direction: column; gap: 3px; }

    /* ═══ TAB 4: Pipeline ═══ */
    .lp-mockup-pipeline { display: flex; flex-direction: column; }
    .lp-pl-topbar {
        display: flex; align-items: center; justify-content: space-between;
        padding: 12px 16px; background: #fff; border-bottom: 1px solid #e2e8f0;
    }
    .lp-pl-search { display: flex; align-items: center; }
    .lp-pl-search-icon { color: #94a3b8; }
    .lp-pl-meta { display: flex; gap: 6px; }
    .lp-pl-meta-pill {
        font-size: 11px; font-weight: 500; color: #64748b;
        padding: 3px 10px; border-radius: 9999px;
        background: #f1f5f9;
    }

    /* Kanban board */
    .lp-kb-board { display: flex; gap: 8px; padding: 12px; overflow-x: auto; }
    .lp-kb-col { flex: 1; min-width: 130px; background: #f1f5f9; border-radius: 10px; padding: 10px; }
    .lp-kb-col-title {
        font-size: 12px; font-weight: 600; color: #475569;
        margin-bottom: 8px; display: flex; align-items: center; gap: 6px;
    }
    .lp-stage-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
    .lp-kb-count { font-size: 10px; background: #e2e8f0; color: #64748b; padding: 1px 6px; border-radius: 10px; margin-left: auto; }

    /* Pipeline card */
    .lp-pl-card {
        background: #fff; border: 1px solid #e2e8f0; border-radius: 8px;
        padding: 10px; margin-bottom: 6px;
    }
    .lp-pl-card-deadline {
        display: flex; align-items: center; gap: 4px;
        font-size: 10px; font-weight: 500; margin-bottom: 4px;
    }
    .lp-pl-deadline-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
    .lp-pl-card-title { font-size: 12px; font-weight: 600; color: #1e293b; margin-bottom: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .lp-pl-card-meta { font-size: 10px; color: #64748b; margin-bottom: 4px; display: flex; align-items: center; }
    .lp-pl-card-value { font-size: 12px; font-weight: 700; color: #2563eb; }

    /* ═══ TAB 5: Calendar ═══ */
    .lp-mockup-calendar { display: flex; flex-direction: column; }
    .lp-cal-topbar {
        display: flex; align-items: center; justify-content: space-between;
        padding: 14px 20px; background: #fff; border-bottom: 1px solid #e2e8f0;
    }
    .lp-cal-nav { display: flex; align-items: center; gap: 10px; }
    .lp-cal-nav-btn { color: #94a3b8; display: flex; align-items: center; }
    .lp-cal-month-label { font-size: 15px; font-weight: 700; color: #0f172a; }
    .lp-cal-view-toggle { display: flex; gap: 4px; }

    .lp-cal-body { padding: 12px 20px 16px; }
    .lp-cal-legend { display: flex; gap: 16px; justify-content: flex-end; margin-bottom: 8px; }
    .lp-cal-legend-item { display: flex; align-items: center; gap: 4px; font-size: 11px; color: #64748b; flex-direction: row-reverse; }
    .lp-cal-legend-dot { width: 7px; height: 7px; border-radius: 50%; }

    .lp-cal-header { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; margin-bottom: 2px; }
    .lp-cal-day-name { font-size: 11px; font-weight: 600; color: #94a3b8; padding: 4px 0; }
    .lp-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
    .lp-cal-cell {
        font-size: 12px; color: #334155; padding: 6px 4px 4px; text-align: center;
        border-radius: 6px; min-height: 44px;
        display: flex; flex-direction: column; align-items: center; gap: 2px;
    }
    .lp-cal-cell.dim { color: #cbd5e1; }
    .lp-cal-cell.today { background: #eff6ff; font-weight: 700; color: #2563eb; }
    .lp-cal-cell.has-dl { background: #fff; }
    .lp-cal-type-pill {
        display: inline-flex; align-items: center; gap: 2px;
        font-size: 9px; font-weight: 600; padding: 1px 5px; border-radius: 4px;
    }
    .lp-cal-type-pill.sub { background: #dbeafe; color: #1e40af; }
    .lp-cal-type-pill.qs { background: #fef3c7; color: #92400e; }
    .lp-cal-type-dot { width: 5px; height: 5px; border-radius: 50%; }
    .lp-cal-type-dot.sub { background: #3b82f6; }
    .lp-cal-type-dot.qs { background: #f59e0b; }

    /* ═══ TAB 6: Document Generator ═══ */
    .lp-doc-layout { display: flex; min-height: 280px; }
    .lp-doc-sidebar { width: 160px; background: #f8fafc; border-right: 1px solid #e2e8f0; padding: 12px; display: flex; flex-direction: column; gap: 4px; }
    .lp-doc-item { font-size: 12px; color: #475569; padding: 8px 10px; border-radius: 6px; cursor: pointer; }
    .lp-doc-item.active { background: #2563eb; color: #fff; font-weight: 600; }
    .lp-doc-editor { flex: 1; padding: 20px; overflow: hidden; }
    .lp-doc-paragraph { font-size: 12px; color: #475569; line-height: 1.7; margin-bottom: 14px; }
    .lp-doc-paragraph strong { color: #1e293b; }

    /* More Features Grid */
    .lp-more-features { padding: 80px 0 100px; background: #ffffff; }
    .lp-more-features-header { text-align: center; margin-bottom: 56px; }
    .lp-more-features-header .lp-section-subtitle { margin: 0 auto; }
    .lp-more-features-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }
    .lp-more-feature-card {
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 16px;
        padding: 32px 24px;
        transition: all 0.3s;
    }
    .lp-more-feature-card:hover {
        border-color: #dbeafe;
        transform: translateY(-4px);
        box-shadow: 0 12px 24px rgba(0,0,0,0.06);
    }
    .lp-more-feature-icon {
        width: 48px;
        height: 48px;
        background: #eff6ff;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 20px;
        color: #2563eb;
    }
    .lp-more-feature-card h4 { font-size: 17px; font-weight: 700; color: #0f172a; margin-bottom: 8px; }
    .lp-more-feature-card p { font-size: 14px; color: #64748b; line-height: 1.6; }

    /* ROI Section */
    .lp-roi { padding: 100px 0; background: #f8fafc; }
    .lp-roi-content { text-align: center; margin-bottom: 60px; }
    .lp-roi-headline {
        font-size: 48px;
        font-weight: 800;
        letter-spacing: -1.2px;
        line-height: 1.15;
        margin-bottom: 16px;
        color: #0f172a;
    }
    .lp-roi-headline .accent { color: #2563eb; }
    .lp-roi-desc { font-size: 17px; color: #64748b; }
    .lp-roi-comparison {
        display: grid;
        grid-template-columns: 1fr auto 1fr;
        gap: 40px;
        align-items: stretch;
        max-width: 900px;
        margin: 0 auto;
    }
    .lp-roi-card { padding: 40px 32px; border-radius: 16px; text-align: left; }
    .lp-roi-card.before { background: #ffffff; border: 1px solid #e2e8f0; }
    .lp-roi-card.after { background: #eff6ff; border: 1px solid #bfdbfe; }
    .lp-roi-card-title {
        font-size: 14px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1px;
        margin-bottom: 24px;
    }
    .lp-roi-card.before .lp-roi-card-title { color: #94a3b8; }
    .lp-roi-card.after .lp-roi-card-title { color: #2563eb; }
    .lp-roi-steps { display: flex; flex-direction: column; gap: 16px; list-style: none; padding: 0; margin: 0; }
    .lp-roi-step { display: flex; align-items: center; gap: 12px; font-size: 14px; color: #334155; }
    .lp-roi-step-time {
        flex-shrink: 0;
        width: 56px;
        padding: 4px 0;
        text-align: center;
        border-radius: 9999px;
        font-size: 12px;
        font-weight: 700;
    }
    .lp-roi-card.before .lp-roi-step-time { background: #f8fafc; border: 1px solid #e2e8f0; color: #64748b; }
    .lp-roi-card.after .lp-roi-step-time { background: #ffffff; border: 1px solid #bfdbfe; color: #2563eb; }
    .lp-roi-divider {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
    }
    .lp-roi-arrow {
        width: 48px;
        height: 48px;
        background: #2563eb;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
    }
    .lp-roi-savings { font-size: 13px; font-weight: 700; color: #2563eb; white-space: nowrap; }
    .lp-roi-total {
        margin-top: 24px;
        padding-top: 16px;
        border-top: 1px solid #e2e8f0;
        font-size: 13px;
        color: #64748b;
    }
    .lp-roi-total strong { font-size: 24px; display: block; margin-top: 4px; }
    .lp-roi-card.before .lp-roi-total strong { color: #1e293b; }
    .lp-roi-card.after .lp-roi-total strong { color: #2563eb; }

    /* How It Works */
    .lp-how-it-works { padding: 100px 0; background: #ffffff; }
    .lp-how-header { text-align: center; margin-bottom: 64px; }
    .lp-how-header .lp-section-subtitle { margin: 0 auto; }
    .lp-steps {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 20px;
        position: relative;
    }
    .lp-steps::before {
        content: '';
        position: absolute;
        top: 40px;
        left: 60px;
        right: 60px;
        height: 2px;
        background: linear-gradient(90deg, #dbeafe, #2563eb, #dbeafe);
        z-index: 0;
    }
    .lp-step { text-align: center; position: relative; z-index: 1; }
    .lp-step-icon {
        width: 80px;
        height: 80px;
        margin: 0 auto 20px;
        background: #ffffff;
        border: 2px solid #dbeafe;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s;
    }
    .lp-step:hover .lp-step-icon {
        background: #2563eb;
        border-color: #2563eb;
        transform: scale(1.1);
        box-shadow: 0 8px 24px rgba(37,99,235,0.3);
    }
    .lp-step:hover .lp-step-icon svg { color: #ffffff; stroke: #ffffff; }
    .lp-step-number {
        position: absolute;
        top: -8px;
        right: calc(50% - 52px);
        width: 24px;
        height: 24px;
        background: #2563eb;
        color: #ffffff;
        border-radius: 50%;
        font-size: 11px;
        font-weight: 700;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .lp-step-title { font-weight: 700; font-size: 16px; color: #1e293b; margin-bottom: 8px; }
    .lp-step-desc { font-size: 14px; color: #64748b; line-height: 1.5; }

    /* Coverage Section */
    .lp-coverage {
        padding: 100px 0;
        background: #0f172a;
        color: #ffffff;
        position: relative;
        overflow: hidden;
    }
    .lp-coverage::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: radial-gradient(ellipse at center, rgba(37,99,235,0.15) 0%, transparent 70%);
        pointer-events: none;
    }
    .lp-coverage-header { text-align: center; margin-bottom: 64px; position: relative; z-index: 1; }
    .lp-coverage-header .lp-section-label { color: #06b6d4; }
    .lp-coverage-header .lp-section-title { color: #ffffff; }
    .lp-coverage-header .lp-section-subtitle { color: #94a3b8; margin: 0 auto; }
    .lp-map-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
        position: relative;
        z-index: 1;
    }
    .lp-country-card {
        background: rgba(255,255,255,0.05);
        border: 1px solid rgba(255,255,255,0.1);
        border-radius: 16px;
        padding: 32px 24px;
        text-align: center;
        transition: all 0.3s;
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
    }
    .lp-country-card:hover {
        background: rgba(255,255,255,0.1);
        border-color: #2563eb;
        transform: translateY(-4px);
    }
    .lp-country-flag { font-size: 48px; margin-bottom: 16px; }
    .lp-country-name { font-weight: 700; font-size: 18px; margin-bottom: 16px; }
    .lp-country-stats { display: flex; flex-direction: column; gap: 10px; }
    .lp-country-stat { display: flex; justify-content: space-between; align-items: center; font-size: 13px; }
    .lp-country-stat-label { color: #94a3b8; }
    .lp-country-stat-value { font-weight: 700; color: #06b6d4; }

    /* Testimonial Section */
    .lp-testimonial { padding: 100px 0; background: #eff6ff; }
    .lp-testimonial .lp-section-label { color: #2563EB; }
    .lp-testimonial .lp-section-title { text-align: center; margin-bottom: 48px; }
    #lp-testimonial-carousel {
        display: grid;
        max-width: 800px;
        margin: 0 auto;
    }
    .lp-testimonial-card {
        grid-area: 1 / 1;
        background: #ffffff;
        border-radius: 24px;
        padding: 48px;
        box-shadow: 0 8px 32px rgba(37, 99, 235, 0.08);
        border: 1px solid #bfdbfe;
        opacity: 0;
        transition: opacity 0.4s ease;
        pointer-events: none;
    }
    #lp-testimonial-carousel .lp-testimonial-card {
        opacity: 0;
    }
    #lp-testimonial-carousel .lp-testimonial-card.lp-testimonial-active {
        opacity: 1;
        pointer-events: auto;
    }
    .lp-testimonial-quote-mark {
        font-size: 72px;
        line-height: 1;
        color: #2563EB;
        opacity: 0.2;
        font-family: Georgia, serif;
        margin-bottom: -20px;
    }
    .lp-testimonial-text {
        font-size: 20px;
        line-height: 1.8;
        color: #334155;
        font-style: italic;
        margin-bottom: 32px;
        min-height: 144px;
    }
    .lp-testimonial-divider {
        width: 60px;
        height: 3px;
        background: #2563EB;
        border-radius: 2px;
        margin-bottom: 24px;
    }
    .lp-testimonial-author {
        display: flex;
        align-items: center;
        gap: 16px;
    }
    .lp-testimonial-avatar {
        width: 56px;
        height: 56px;
        border-radius: 50%;
        background: linear-gradient(135deg, #2563EB, #60a5fa);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        font-weight: 700;
        font-size: 18px;
        flex-shrink: 0;
    }
    .lp-testimonial-info { display: flex; flex-direction: column; }
    .lp-testimonial-name {
        font-size: 18px;
        font-weight: 700;
        color: #1e293b;
        line-height: 1.3;
    }
    .lp-testimonial-role {
        font-size: 15px;
        color: #64748b;
        line-height: 1.4;
    }
    .lp-testimonial-dot {
        width: 10px; height: 10px; border-radius: 50%;
        background: #d4d4d8; cursor: pointer;
        transition: background 0.3s, transform 0.3s;
    }
    .lp-testimonial-dot.active { background: #2563EB; transform: scale(1.2); }
    .lp-testimonial-dot:hover { background: #60a5fa; }

    /* Newcomer Section */
    .lp-newcomer { padding: 100px 0; background: #eff6ff; position: relative; overflow: hidden; }
    .lp-newcomer-layout {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        align-items: center;
    }
    .lp-newcomer-content .lp-section-label { color: #2563eb; }
    .lp-newcomer-content h2 {
        font-size: 36px;
        font-weight: 800;
        letter-spacing: -1px;
        color: #0f172a;
        margin-bottom: 16px;
        line-height: 1.15;
    }
    .lp-newcomer-content > p {
        font-size: 17px;
        color: #64748b;
        line-height: 1.7;
        margin-bottom: 32px;
    }
    .lp-newcomer-benefits {
        list-style: none;
        padding: 0;
        margin: 0 0 36px;
        display: flex;
        flex-direction: column;
        gap: 16px;
    }
    .lp-newcomer-benefits li {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        font-size: 15px;
        color: #334155;
        line-height: 1.5;
    }
    .lp-newcomer-check {
        flex-shrink: 0;
        width: 28px;
        height: 28px;
        background: #2563eb;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #ffffff;
        margin-top: 1px;
    }
    .lp-newcomer-visual {
        background: #ffffff;
        border-radius: 24px;
        padding: 40px;
        box-shadow: 0 8px 32px rgba(0,0,0,0.06);
        border: 1px solid #e2e8f0;
    }
    .lp-newcomer-stat-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }
    .lp-newcomer-stat-card {
        background: #f8fafc;
        border-radius: 16px;
        padding: 24px 20px;
        text-align: center;
    }
    .lp-newcomer-stat-card .stat-number {
        font-size: 32px;
        font-weight: 800;
        color: #2563eb;
        line-height: 1;
        margin-bottom: 6px;
    }
    .lp-newcomer-stat-card .stat-label {
        font-size: 13px;
        color: #64748b;
        line-height: 1.4;
    }
    .lp-newcomer-quote {
        margin-top: 24px;
        padding: 20px 24px;
        background: #eff6ff;
        border-radius: 12px;
        border-left: 3px solid #2563eb;
    }
    .lp-newcomer-quote p {
        font-size: 14px;
        color: #475569;
        font-style: italic;
        line-height: 1.6;
        margin-bottom: 8px;
    }
    .lp-newcomer-quote cite { font-size: 13px; color: #94a3b8; font-style: normal; }

    /* Try AI Matching Section */
    .lp-try-matching {
        padding: 100px 0;
        background: #ffffff;
        position: relative;
    }
    .lp-try-matching-layout {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        align-items: center;
    }
    .lp-try-matching-label { color: #2563EB !important; }
    .lp-try-matching-title {
        font-size: 38px;
        font-weight: 800;
        letter-spacing: -1px;
        color: #0f172a;
        line-height: 1.2;
        margin-bottom: 16px;
    }
    .lp-try-matching-desc {
        font-size: 17px;
        color: #64748b;
        line-height: 1.7;
        margin-bottom: 28px;
    }
    .lp-try-matching-points {
        display: flex;
        flex-direction: column;
        gap: 14px;
        margin-bottom: 32px;
    }
    .lp-try-matching-point {
        display: flex;
        align-items: center;
        gap: 12px;
        font-size: 15px;
        color: #334155;
        font-weight: 500;
    }
    .lp-try-matching-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: #2563EB;
        color: #ffffff;
        border: none;
        padding: 16px 36px;
        border-radius: 9999px;
        font-weight: 700;
        font-size: 16px;
        cursor: pointer;
        transition: all 0.3s;
        text-decoration: none;
    }
    .lp-try-matching-btn:hover {
        background: #1D4ED8;
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(37, 99, 235, 0.3);
    }
    .lp-try-matching-visual {
        display: flex;
        justify-content: center;
    }
    .lp-try-matching-mock-body {
        padding: 20px;
    }
    .lp-try-matching-mock-form {
        margin-bottom: 16px;
    }
    .lp-try-matching-mock-label {
        font-size: 13px;
        font-weight: 600;
        color: #374151;
        margin-bottom: 8px;
    }
    .lp-try-matching-mock-input {
        background: #f9fafb;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        padding: 12px 14px;
        font-size: 13px;
        color: #6b7280;
        line-height: 1.5;
        margin-bottom: 12px;
    }
    .lp-try-matching-mock-btn {
        background: #2563EB;
        color: white;
        text-align: center;
        padding: 10px 20px;
        border-radius: 8px;
        font-size: 13px;
        font-weight: 600;
    }
    .lp-try-matching-mock-results {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    .lp-try-matching-mock-result {
        display: flex;
        align-items: center;
        gap: 12px;
        background: #f9fafb;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        padding: 10px 14px;
    }
    .lp-try-matching-mock-score {
        font-size: 13px;
        font-weight: 700;
        padding: 3px 8px;
        border-radius: 6px;
        flex-shrink: 0;
    }
    .lp-try-matching-mock-score.high {
        background: #dcfce7;
        color: #16a34a;
    }
    .lp-try-matching-mock-score.med {
        background: #fef3c7;
        color: #d97706;
    }
    .lp-try-matching-mock-result-text {
        font-size: 13px;
        color: #374151;
        font-weight: 500;
    }

    /* Compare Section */
    .lp-compare {
        padding: 80px 0;
        background: #f8fafc;
    }
    .lp-compare-card {
        max-width: 800px;
        margin: 0 auto;
        text-align: center;
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 20px;
        padding: 56px 48px;
        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04);
    }
    .lp-compare-title {
        font-size: 36px;
        font-weight: 800;
        letter-spacing: -0.8px;
        color: #0f172a;
        margin-top: 20px;
        margin-bottom: 12px;
        line-height: 1.2;
    }
    .lp-compare-desc {
        font-size: 17px;
        color: #64748b;
        line-height: 1.7;
        max-width: 560px;
        margin: 0 auto 32px;
    }
    .lp-compare-points-wrapper {
        display: flex;
        justify-content: center;
        margin-bottom: 32px;
    }
    .lp-compare-points {
        display: flex;
        flex-direction: column;
        gap: 12px;
        text-align: left;
    }
    .lp-compare-point {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 15px;
        color: #334155;
        font-weight: 500;
    }
    .lp-compare-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: transparent;
        color: #2563EB;
        border: 2px solid #2563EB;
        padding: 14px 32px;
        border-radius: 9999px;
        font-weight: 700;
        font-size: 16px;
        cursor: pointer;
        transition: all 0.3s;
        text-decoration: none;
    }
    .lp-compare-btn:hover {
        background: #2563EB;
        color: #ffffff;
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(37, 99, 235, 0.25);
    }

    /* Security & Trust Section */
    .lp-security {
        padding: 100px 0;
        background: #1e293b;
        position: relative;
        overflow: hidden;
    }
    .lp-security::before {
        content: '';
        position: absolute;
        top: -200px;
        left: 50%;
        transform: translateX(-50%);
        width: 900px;
        height: 900px;
        background: radial-gradient(circle, rgba(30,58,138,0.15) 0%, transparent 60%);
        pointer-events: none;
    }
    .lp-security-header {
        text-align: center;
        margin-bottom: 56px;
        position: relative;
        z-index: 1;
    }
    .lp-security-label {
        display: inline-block;
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 2px;
        color: #06b6d4;
        margin-bottom: 16px;
    }
    .lp-security-title {
        font-size: 40px;
        font-weight: 800;
        letter-spacing: -1px;
        color: #ffffff;
        line-height: 1.2;
        margin: 0;
    }
    .lp-security-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
        position: relative;
        z-index: 1;
    }
    .lp-security-card {
        background: rgba(255,255,255,0.05);
        border: 1px solid rgba(255,255,255,0.08);
        border-radius: 16px;
        padding: 32px;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }
    .lp-security-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 32px rgba(0,0,0,0.2);
    }
    .lp-security-icon {
        width: 56px;
        height: 56px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(30,58,138,0.4);
        border-radius: 14px;
        margin-bottom: 20px;
        color: #60a5fa;
    }
    .lp-security-card-title {
        font-size: 20px;
        font-weight: 700;
        color: #ffffff;
        margin: 0 0 10px 0;
    }
    .lp-security-card-desc {
        font-size: 15px;
        color: #94a3b8;
        line-height: 1.7;
        margin: 0;
    }

    /* CTA Section */
    .lp-cta {
        padding: 100px 0;
        background: #0f172a;
        position: relative;
        overflow: hidden;
    }
    .lp-cta::before {
        content: '';
        position: absolute;
        top: -100px;
        left: 50%;
        transform: translateX(-50%);
        width: 800px;
        height: 800px;
        background: radial-gradient(circle, rgba(37,99,235,0.2) 0%, transparent 60%);
        pointer-events: none;
    }
    .lp-cta-card {
        max-width: 800px;
        margin: 0 auto;
        text-align: center;
        position: relative;
        z-index: 1;
    }
    .lp-cta-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: rgba(37,99,235,0.15);
        border: 1px solid rgba(37,99,235,0.3);
        border-radius: 9999px;
        padding: 8px 20px;
        font-size: 13px;
        font-weight: 600;
        color: #06b6d4;
        margin-bottom: 28px;
    }
    .lp-cta-card h2 {
        font-size: 44px;
        font-weight: 800;
        letter-spacing: -1.2px;
        color: #ffffff;
        margin-bottom: 16px;
        line-height: 1.15;
    }
    .lp-cta-card p {
        font-size: 18px;
        color: #94a3b8;
        max-width: 520px;
        margin: 0 auto 40px;
        line-height: 1.7;
    }
    .lp-cta-actions {
        display: flex;
        gap: 16px;
        justify-content: center;
        align-items: center;
        margin-bottom: 32px;
    }
    .lp-cta-btn-primary {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: #2563eb;
        color: #ffffff;
        border: none;
        padding: 16px 36px;
        border-radius: 9999px;
        font-weight: 700;
        font-size: 16px;
        cursor: pointer;
        transition: all 0.3s;
        text-decoration: none;
    }
    .lp-cta-btn-primary:hover {
        background: #1d4ed8;
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(37,99,235,0.3);
    }
    .lp-cta-btn-secondary {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: transparent;
        color: #ffffff;
        border: 1px solid rgba(255,255,255,0.2);
        padding: 16px 36px;
        border-radius: 9999px;
        font-weight: 600;
        font-size: 16px;
        cursor: pointer;
        transition: all 0.3s;
        text-decoration: none;
    }
    .lp-cta-btn-secondary:hover {
        border-color: rgba(255,255,255,0.4);
        background: rgba(255,255,255,0.05);
    }
    .lp-cta-btn-meeting {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: transparent;
        color: #06b6d4;
        border: 2px solid #06b6d4;
        padding: 16px 32px;
        border-radius: 9999px;
        font-weight: 600;
        font-size: 16px;
        cursor: pointer;
        transition: all 0.3s;
        text-decoration: none;
    }
    .lp-cta-btn-meeting:hover {
        background: #06b6d4;
        color: #ffffff;
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(6,182,212,0.3);
    }
    .lp-cta-trust { display: flex; gap: 32px; justify-content: center; align-items: center; }
    .lp-cta-trust-item { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #94a3b8; }
    .lp-cta-trust-icon { color: #06b6d4; }

    /* Pricing Summary Section (Homepage) */
    .lp-pricing-summary { padding: 80px 0; background: #f8fafc; }
    .lp-pricing-summary-header { text-align: center; margin-bottom: 48px; }
    .lp-pricing-summary-header .lp-section-subtitle { margin: 0 auto; }
    .lp-pricing-summary-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 24px;
        max-width: 1200px;
        margin: 0 auto;
    }
    .lp-pricing-summary-card {
        background: #ffffff;
        border-radius: 16px;
        padding: 32px 24px;
        text-align: center;
        border: 1px solid #e2e8f0;
        position: relative;
        display: flex;
        flex-direction: column;
        transition: transform 0.3s, box-shadow 0.3s;
    }
    .lp-pricing-summary-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 24px rgba(0,0,0,0.08);
    }
    .lp-pricing-summary-card-popular {
        border: 2px solid #3b82f6;
        transform: scale(1.04);
    }
    .lp-pricing-summary-card-popular:hover {
        transform: scale(1.04) translateY(-4px);
    }
    .lp-pricing-summary-card-strategist {
        border: 2px solid #0f172b;
    }
    .lp-pricing-popular-badge.lp-pricing-strategist-badge {
        background: linear-gradient(135deg, #0f172b 0%, #334155 100%);
    }
    .lp-pricing-popular-badge {
        position: absolute;
        top: -12px;
        left: 50%;
        transform: translateX(-50%);
        background: linear-gradient(135deg, #3b82f6 0%, #1e40af 100%);
        color: white;
        padding: 4px 16px;
        border-radius: 20px;
        font-size: 12px;
        font-weight: 600;
        white-space: nowrap;
    }
    .lp-pricing-card-name {
        font-size: 1.25rem;
        font-weight: 700;
        color: #1e293b;
        margin-bottom: 12px;
    }
    .lp-pricing-card-price-row { margin-bottom: 8px; }
    .lp-pricing-card-price {
        font-size: 2.5rem;
        font-weight: 800;
        color: #3b82f6;
        line-height: 1;
    }
    .lp-pricing-card-period {
        font-size: 1rem;
        color: #64748b;
        font-weight: 500;
    }
    .lp-pricing-card-features {
        list-style: none;
        padding: 0;
        margin: 16px 0 24px;
        text-align: left;
        flex-grow: 1;
    }
    .lp-pricing-card-features li {
        padding: 6px 0;
        color: #475569;
        font-size: 0.9rem;
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .lp-pricing-card-features li::before {
        content: "\2713";
        color: #10b981;
        font-weight: 700;
        flex-shrink: 0;
    }
    .lp-pricing-card-btn {
        display: block;
        padding: 12px 24px;
        border-radius: 8px;
        font-weight: 600;
        text-decoration: none;
        text-align: center;
        transition: all 0.3s;
        background: #f1f5f9;
        color: #1e293b;
        margin-top: auto;
    }
    .lp-pricing-card-btn:hover {
        background: #e2e8f0;
        transform: translateY(-2px);
    }
    .lp-pricing-card-btn-primary {
        background: linear-gradient(135deg, #3b82f6 0%, #1e40af 100%);
        color: white;
    }
    .lp-pricing-card-btn-primary:hover {
        box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
        color: white;
    }
    .lp-pricing-view-all-link {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        color: #3b82f6;
        font-weight: 600;
        text-decoration: none;
        font-size: 1rem;
        transition: gap 0.2s;
    }
    .lp-pricing-view-all-link:hover { gap: 10px; }
    @media (max-width: 768px) {
        .lp-pricing-summary-grid {
            grid-template-columns: 1fr;
            max-width: 400px;
        }
        .lp-pricing-summary-card-popular {
            transform: none;
            order: -1;
        }
        .lp-pricing-summary-card-popular:hover {
            transform: translateY(-4px);
        }
    }

    /* Comparison Table */
    .lp-comparison { padding: 100px 0; background: #f8fafc; }
    .lp-comparison-header { text-align: center; margin-bottom: 48px; }
    .lp-comparison-header .lp-section-subtitle { margin: 0 auto; }
    .lp-comparison-table-wrapper {
        max-width: 800px;
        margin: 0 auto;
        background: #ffffff;
        border-radius: 16px;
        box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
        overflow: hidden;
    }
    .lp-comparison-table { width: 100%; border-collapse: collapse; }
    .lp-comparison-table thead th {
        padding: 20px 24px;
        text-align: left;
        font-size: 14px;
        font-weight: 700;
        color: #1e293b;
        border-bottom: 2px solid #e2e8f0;
    }
    .lp-comparison-table thead th:first-child { width: 50%; }
    .lp-comparison-table thead th:nth-child(2) {
        color: #2563eb;
        background: #eff6ff;
        text-align: center;
    }
    .lp-comparison-table thead th:nth-child(3) { color: #64748b; text-align: center; }
    .lp-comparison-table tbody td {
        padding: 16px 24px;
        font-size: 14px;
        border-bottom: 1px solid #f1f5f9;
        color: #475569;
    }
    .lp-comparison-table tbody td:nth-child(2),
    .lp-comparison-table tbody td:nth-child(3) { text-align: center; }
    .lp-comparison-table tbody tr:last-child td { border-bottom: none; }
    .lp-comparison-table tbody td:nth-child(2) { background: #eff6ff; }
    .lp-check { color: #10b981; font-weight: 700; font-size: 18px; }
    .lp-cross { color: #ef4444; font-weight: 700; font-size: 18px; }
    .lp-partial { color: #f59e0b; font-weight: 700; font-size: 13px; }

    /* Button styles */
    .lp-hero-cta-row {
        display: flex;
        gap: 16px;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        margin-top: 32px;
        margin-bottom: 16px;
    }
    .lp-btn-primary {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: #2563eb;
        color: #ffffff;
        border: none;
        font-size: 14px;
        font-weight: 600;
        padding: 10px 20px;
        border-radius: 9999px;
        cursor: pointer;
        transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
        text-decoration: none;
    }
    .lp-btn-primary:hover {
        background: #1d4ed8;
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
    }
    .lp-btn-primary-lg { padding: 14px 28px; font-size: 15px; }
    .lp-btn-meeting {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        background: transparent;
        color: #2563EB;
        border: 2px solid #2563EB;
        padding: 14px 28px;
        border-radius: 9999px;
        font-weight: 600;
        font-size: 15px;
        cursor: pointer;
        transition: all 0.3s;
        text-decoration: none;
    }
    .lp-btn-meeting:hover {
        background: #2563EB;
        color: #ffffff;
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(37, 99, 235, 0.25);
    }

    /* ========== BEGINNER LANDING PAGE (bl-*) ========== */

    /* Hero split layout */
    .bl-hero { padding: 130px 0 80px; }
    .bl-hero-layout {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 60px;
        align-items: center;
    }
    .bl-hero-text { text-align: left; }
    .bl-hero-text h1 {
        font-size: 40px;
        font-weight: 800;
        line-height: 1.15;
        letter-spacing: -1.2px;
        color: #0f172a;
        margin-bottom: 20px;
    }
    .bl-hero-subtitle {
        font-size: 18px;
        color: #64748b;
        line-height: 1.7;
        margin-bottom: 28px;
    }
    .bl-hero-visual {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .bl-hero-visual .lp-search-demo-window {
        max-width: 400px;
        width: 100%;
        animation: lp-fadeInUp 0.8s ease-out 0.3s both;
    }

    /* Match score card in hero */
    .bl-match-card-body { padding: 24px; }
    .bl-match-card-inner {
        text-align: center;
        padding-bottom: 20px;
        border-bottom: 1px solid #e2e8f0;
        margin-bottom: 20px;
    }
    .bl-match-label {
        font-size: 13px;
        color: #64748b;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-bottom: 8px;
    }
    .bl-match-score {
        font-size: 56px;
        font-weight: 800;
        color: #2563EB;
        line-height: 1;
        margin-bottom: 8px;
    }
    .bl-match-tag {
        display: inline-block;
        background: #f0fdf4;
        color: #16a34a;
        font-size: 13px;
        font-weight: 600;
        padding: 4px 12px;
        border-radius: 9999px;
    }
    .bl-match-details { display: flex; flex-direction: column; gap: 14px; }
    .bl-match-detail {
        display: flex;
        align-items: center;
        gap: 12px;
    }
    .bl-match-detail-label {
        font-size: 13px;
        color: #64748b;
        font-weight: 500;
        min-width: 80px;
    }
    .bl-progress-bar {
        flex: 1;
        height: 8px;
        background: #e2e8f0;
        border-radius: 9999px;
        overflow: hidden;
    }
    .bl-progress-fill {
        height: 100%;
        background: linear-gradient(90deg, #2563EB, #60a5fa);
        border-radius: 9999px;
        transition: width 1s ease-out;
    }

    /* Stability comparison colors */
    .bl-compare-negative {
        color: #dc2626;
        font-size: 13px;
    }
    .bl-compare-positive {
        color: #16a34a;
        font-weight: 600;
        font-size: 13px;
    }

    /* Regulatory backing grid */
    .bl-reg-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 32px;
    }
    .bl-reg-card { text-align: center; }
    .bl-reg-icon {
        width: 72px;
        height: 72px;
        background: #eff6ff;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 20px;
    }

    /* Sectors grid */
    .bl-sectors-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }
    .bl-sector-card {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 20px 24px;
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
    }
    .bl-sector-card:hover {
        border-color: #93c5fd;
        box-shadow: 0 4px 12px rgba(37,99,235,0.1);
        transform: translateY(-2px);
    }
    .bl-sector-icon {
        width: 48px;
        height: 48px;
        background: #eff6ff;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
    .bl-sector-name {
        font-size: 15px;
        font-weight: 600;
        color: #0f172a;
    }

    /* Efficiency table */
    .bl-eff-table thead th:nth-child(2) {
        color: #dc2626;
        background: #fef2f2;
    }
    .bl-eff-table thead th:nth-child(3) {
        color: #16a34a;
        background: #f0fdf4;
    }
    .bl-eff-table tbody td:nth-child(2) { background: #fef2f2; }
    .bl-eff-table tbody td:nth-child(3) { background: #f0fdf4; }
    .bl-eff-slow {
        color: #dc2626;
        font-weight: 600;
    }
    .bl-eff-fast {
        color: #16a34a;
        font-weight: 700;
    }
    .bl-eff-total-row td {
        border-top: 2px solid #e2e8f0 !important;
        padding-top: 16px !important;
    }

    /* Landing Page Responsive */
    @media (min-width: 769px) and (max-width: 1024px) {
        .lp-pricing-summary-grid { grid-template-columns: repeat(2, 1fr); max-width: 700px; }
    }
    @media (max-width: 1024px) {
        .lp-steps { grid-template-columns: repeat(2, 1fr); }
        .lp-steps::before { display: none; }
        .lp-map-grid { grid-template-columns: repeat(2, 1fr); }
        .lp-roi-comparison { grid-template-columns: 1fr; gap: 24px; }
        .lp-roi-divider { flex-direction: row; }
        .lp-more-features-grid { grid-template-columns: repeat(2, 1fr); }
        .lp-newcomer-layout { grid-template-columns: 1fr; gap: 48px; }
        .lp-try-matching-layout { grid-template-columns: 1fr; gap: 40px; }
        .bl-hero-layout { grid-template-columns: 1fr; gap: 40px; }
        .bl-hero-text { text-align: center; }
        .bl-reg-grid { grid-template-columns: 1fr; gap: 24px; }
        .bl-sectors-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 768px) {
        .lp-hero { padding: 110px 0 60px; }
        .lp-hero h1 { font-size: 36px; letter-spacing: -1px; }
        .lp-hero-sub { font-size: 16px; }
        .lp-section-title { font-size: 30px; }
        .lp-roi-headline { font-size: 32px; }
        .lp-search-demo-body { padding: 16px; }
        .lp-result-card { flex-wrap: wrap; }
        .lp-tab-nav { flex-wrap: wrap; max-width: 100%; padding: 10px 8px; gap: 4px; }
        .lp-tab-label { padding: 8px 12px; font-size: 12px; }
        .lp-tab-panel { flex-direction: column !important; gap: 20px !important; }
        .lp-tab-panels { min-height: auto; }
        .lp-fp-text { flex: 1 1 auto; padding: 0 4px; order: -1; }
        .lp-fp-mockup { order: 1; }
        .lp-fp-title { font-size: 20px; }
        .lp-fp-desc { font-size: 14px; }
        .lp-fp-bullets li { font-size: 13px; }
        .lp-mockup-screen { border-radius: 12px; }
        .lp-mockup-header { padding: 12px 16px; }
        .lp-mockup-header-title { font-size: 14px; }
        .lp-mockup-body { padding: 12px; }
        .lp-doc-sidebar { display: none; }

        /* Tab 1: AI Chat mockup mobile */
        .lp-chat-messages { padding: 12px; gap: 10px; }
        .lp-chat-avatar { width: 22px; height: 22px; font-size: 10px; }
        .lp-chat-bubble { font-size: 11.5px; padding: 7px 10px; max-width: 90%; }
        .lp-chat-tender-row { gap: 6px; padding: 5px 6px; }
        .lp-chat-tender-title { font-size: 10.5px; }
        .lp-chat-tender-meta { font-size: 9px; }
        .lp-chat-tender-value { font-size: 10.5px; }
        .lp-chat-chip { font-size: 9px; padding: 3px 8px; }
        .lp-chat-flag { font-size: 12px; }
        .lp-composer-bar { padding: 8px 12px; }
        .lp-composer-placeholder { font-size: 12px; }

        /* Tab 2: AI Matching mobile */
        .lp-match-header { padding: 12px 14px 10px; }
        .lp-scope-title { font-size: 13px; }
        .lp-scope-meta { font-size: 10px; }
        .lp-scope-icon { width: 30px; height: 30px; }
        .lp-mc-grid { grid-template-columns: 1fr; }
        .lp-mc-card:nth-child(n+2) { display: none; }
        .lp-mc-title { white-space: normal; font-size: 12px; }
        .lp-mc-card { padding: 10px; }
        .lp-mc-facts { gap: 8px; }
        .lp-mc-reason-text { font-size: 10px; }
        .lp-mc-bid-prompt { font-size: 10px; }
        .lp-mc-bid-btn { font-size: 10px; padding: 4px 8px; }
        .lp-tier-tabs { gap: 4px; }
        .lp-tier-pill { font-size: 11px; padding: 4px 8px; }

        /* Tab 3: Insights mobile */
        .lp-ins-grid { grid-template-columns: 1fr; gap: 8px; }
        .lp-ins-card-title { font-size: 11px; }
        .lp-ins-line-svg { height: 70px; }
        .lp-ins-period { font-size: 9px; padding: 2px 6px; }
        .lp-ins-x-axis span { font-size: 8px; }
        .lp-ins-seg-bar { height: 10px; }
        .lp-ins-leg { font-size: 9px; }
        .lp-ins-donut-svg { width: 60px; height: 60px; }

        /* Tab 4: Pipeline mobile */
        .lp-kb-board { overflow-x: auto; -webkit-overflow-scrolling: touch; }
        .lp-kb-col { min-width: 140px; }
        .lp-pl-topbar { padding: 10px 12px; }

        /* Tab 5: Calendar mobile */
        .lp-cal-grid { gap: 0; }
        .lp-cal-cell { min-height: 36px; font-size: 11px; padding: 2px; }
        .lp-cal-header-cell { font-size: 10px; }
        .lp-cal-topbar { padding: 8px 12px; flex-wrap: wrap; gap: 6px; }
        .lp-cal-nav { font-size: 13px; }
        .lp-cal-view-toggle { gap: 2px; }
        .lp-cal-view-btn { font-size: 10px; padding: 3px 8px; }
        .lp-cal-legend { gap: 8px; }
        .lp-cal-type-dot { width: 5px; height: 5px; }
        .lp-cal-legend span { font-size: 10px; }
        .lp-cal-type-pill { font-size: 7px; padding: 1px 3px; }
        .lp-comparison-table { font-size: 13px; }
        .lp-comparison-table thead th,
        .lp-comparison-table tbody td { padding: 12px 14px; }

        /* ROI comparison mobile */
        .lp-roi { padding: 60px 0; }
        .lp-roi-comparison { grid-template-columns: 1fr; gap: 0; }
        .lp-roi-card { padding: 28px 20px; }
        .lp-roi-divider { display: flex; justify-content: center; padding: 12px 0; }
        .lp-roi-headline { font-size: 28px; }
        .lp-roi-content { margin-bottom: 32px; }

        /* Search section mobile */
        .home-search-container { padding: 12px; }
        .popular-searches-row { display: none; }
        .sort-row { display: none; }
        .lp-hero-cta-row { flex-direction: column; align-items: stretch; }
        .lp-hero-cta-row .lp-btn-primary,
        .lp-hero-cta-row .lp-btn-meeting { width: 100%; justify-content: center; text-align: center; }
        .lp-cta-actions { flex-direction: column; }
        .lp-cta-btn-primary,
        .lp-cta-btn-secondary,
        .lp-cta-btn-meeting { width: 100%; justify-content: center; text-align: center; }
        .lp-btn-meeting { width: 100%; justify-content: center; }
        .lp-cta-card h2 { font-size: 32px; }
        .lp-cta-trust { flex-direction: column; gap: 16px; }
        .lp-testimonial { padding: 60px 0; }
        .lp-testimonial-card { padding: 32px 24px; }
        .lp-testimonial-text { font-size: 17px; }
        .lp-testimonial-quote-mark { font-size: 56px; }
        .lp-newcomer-content h2 { font-size: 30px; }
        .lp-try-matching-title { font-size: 30px; }
        .lp-try-matching { padding: 60px 0; }
        .lp-compare { padding: 60px 0; }
        .lp-compare-card { padding: 40px 24px; }
        .lp-compare-title { font-size: 28px; }
        .lp-security { padding: 60px 0; }
        .lp-security-title { font-size: 32px; }
        .lp-security-grid { grid-template-columns: 1fr; gap: 20px; }
        .lp-security-card { padding: 28px 24px; }
        .bl-hero-text h1 { font-size: 32px; }
        .bl-hero-subtitle { font-size: 16px; }
        .bl-match-score { font-size: 44px; }
        .bl-sectors-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
        .bl-sector-card { padding: 14px 16px; }
        .bl-sector-name { font-size: 13px; }
    }
    @media (max-width: 480px) {
        .lp-hero h1 { font-size: 28px; }
        .lp-map-grid { grid-template-columns: 1fr; }
        .lp-steps { grid-template-columns: 1fr; }
        .lp-more-features-grid { grid-template-columns: 1fr; }

        /* Tab system small phone */
        .lp-tab-label { padding: 7px 10px; font-size: 11px; }
        .lp-tab-panel { gap: 16px !important; }
        .lp-fp-title { font-size: 18px; }
        .lp-fp-desc { font-size: 13px; }
        .lp-chat-bubble { font-size: 11px; }
        .lp-chat-tender-title { font-size: 10px; }
        .lp-scope-card { gap: 8px; }
        .lp-scope-icon { width: 28px; height: 28px; }
        .lp-mc-dial { width: 32px; height: 32px; font-size: 10px; }
        .lp-ins-donut-layout { gap: 8px; }
        .lp-ins-donut-svg { width: 52px; height: 52px; }
        .lp-cal-cell { min-height: 32px; font-size: 10px; }
        .lp-cal-type-pill { font-size: 6px; }
        .lp-testimonial-card { padding: 24px 20px; }
        .lp-testimonial-text { font-size: 16px; }
        .lp-newcomer-stat-grid { grid-template-columns: 1fr; }
        .lp-try-matching-title { font-size: 26px; }
        .lp-try-matching-btn { padding: 14px 28px; font-size: 15px; }
        .lp-compare-title { font-size: 24px; }
        .lp-security-title { font-size: 26px; }
        .lp-security-header { margin-bottom: 36px; }
        .lp-security-card { padding: 24px 20px; }
        .lp-security-card-title { font-size: 18px; }
        .lp-security-card-desc { font-size: 14px; }
        .bl-hero-text h1 { font-size: 26px; }
        .bl-sectors-grid { grid-template-columns: 1fr; }
        .bl-match-score { font-size: 36px; }
        .bl-hero-visual .lp-search-demo-window { max-width: 100%; }
    }

    /* ========== TENDER PIPELINE / CRM BOARD ========== */

    .pl-header {
        background: white;
        border-bottom: 1px solid #e5e7eb;
        padding: 0.5rem 1.5rem;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    }

    .pl-header-content {
        max-width: 100%;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
    }

    .pl-header-top {
        display: flex;
        align-items: center;
        gap: 2rem;
    }

    .pl-header-left {
        display: flex;
        align-items: center;
        gap: 1rem;
    }

    .pl-page-title {
        font-size: 1.25rem;
        font-weight: 700;
        color: #111827;
        letter-spacing: -0.025em;
        white-space: nowrap;
    }

    .pl-stats-divider {
        width: 1px;
        height: 24px;
        background: #D1D5DB;
    }

    .pl-stats {
        display: flex;
        gap: 0.75rem;
        align-items: center;
        font-size: 0.875rem;
    }

    .pl-stat-item {
        display: flex;
        align-items: center;
        gap: 0.375rem;
    }

    .pl-stat-label {
        font-size: 0.875rem;
        font-weight: 500;
        color: #4B5563;
    }

    .pl-stat-value {
        font-size: 0.875rem;
        font-weight: 700;
        color: #111827;
    }

    .pl-stat-separator {
        color: #9CA3AF;
        margin: 0 0.25rem;
    }

    .pl-header-filters {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-left: auto;
    }

    .pl-filters {
        display: flex;
        gap: 0.5rem;
        flex-wrap: wrap;
    }

    .pl-filter-chip {
        padding: 0.375rem 0.875rem;
        border-radius: 20px;
        font-size: 0.8125rem;
        font-weight: 500;
        background: white;
        color: #374151;
        border: 1px solid #E5E7EB;
        cursor: pointer;
        transition: all 0.2s ease;
    }

    .pl-filter-chip:hover {
        border-color: #D1D5DB;
        background: #F9FAFB;
    }

    .pl-filter-chip.active {
        background: #EFF6FF;
        color: #1D4ED8;
        border-color: #2563EB;
    }

    .pl-filter-dropdown {
        padding: 0.5rem 0.875rem;
        border: 1px solid #E5E7EB;
        border-radius: 6px;
        font-size: 0.8125rem;
        font-weight: 500;
        color: #374151;
        background: white;
        cursor: pointer;
        min-width: 140px;
        transition: all 0.2s ease;
        font-family: inherit;
    }

    .pl-filter-dropdown:hover {
        border-color: #D1D5DB;
        background: #F9FAFB;
    }

    .pl-filter-dropdown:focus {
        outline: none;
        border-color: #2563EB;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
    }

    .pl-board-wrapper {
        padding: 1rem 1.5rem;
        overflow-x: auto;
        height: calc(100vh - 180px);
        background: #F9FAFB;
    }

    .pl-board {
        display: flex;
        gap: 1rem;
        height: 100%;
        min-height: 0;
    }

    .pl-column {
        display: flex;
        flex-direction: column;
        flex: 1 1 0;
        min-width: 220px;
        background: white;
        border-radius: 12px;
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
        border: 1px solid #E5E7EB;
        max-height: 100%;
        overflow: hidden;
    }

    .pl-column-header {
        padding: 1rem 1.25rem;
        border-bottom: 1px solid #E5E7EB;
        background: linear-gradient(to bottom, #F9FAFB, white);
        border-radius: 12px 12px 0 0;
    }

    .pl-column-title-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 0.375rem;
    }

    .pl-column-title {
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

    .pl-column-title h3 {
        font-size: 0.9375rem;
        font-weight: 700;
        color: #111827;
        margin: 0;
    }

    .pl-column-count {
        background: #F3F4F6;
        color: #4B5563;
        padding: 0.125rem 0.5rem;
        border-radius: 12px;
        font-size: 0.75rem;
        font-weight: 700;
    }

    .pl-column-desc {
        font-size: 0.8125rem;
        color: #6B7280;
        line-height: 1.4;
        margin: 0;
    }

    .pl-column-cards {
        padding: 0.75rem;
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        overflow-y: auto;
        flex: 1 1 0;
        min-height: 0;
    }

    .pl-column-cards.drag-over {
        background: #EFF6FF;
        border-radius: 0 0 12px 12px;
    }

    .pl-card {
        background: white;
        border: 1px solid #E5E7EB;
        border-radius: 10px;
        padding: 1rem;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
        transition: all 0.2s ease;
        cursor: grab;
        position: relative;
    }

    .pl-card:hover {
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
        border-color: #D1D5DB;
        transform: translateY(-2px);
    }

    .pl-card.dragging {
        opacity: 0.5;
        cursor: grabbing;
    }

    .pl-card-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 0.5rem;
        margin-bottom: 0.75rem;
    }

    .pl-card-remove-btn {
        background: none;
        border: none;
        color: #94a3b8;
        cursor: pointer;
        padding: 0.25rem;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 0;
        transition: all 0.2s ease;
        flex-shrink: 0;
    }

    .pl-card:hover .pl-card-remove-btn {
        opacity: 1;
    }

    .pl-card-remove-btn:hover {
        color: #ef4444;
        background: #fef2f2;
    }

    .pl-deadline-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.25rem 0.625rem;
        border-radius: 6px;
        font-size: 0.75rem;
        font-weight: 600;
        flex-shrink: 0;
    }

    .pl-deadline-badge.critical {
        background: #FEF2F2;
        color: #DC2626;
    }

    .pl-deadline-badge.urgent {
        background: #FFF7ED;
        color: #EA580C;
    }

    .pl-deadline-badge.normal {
        background: #EFF6FF;
        color: #2563EB;
    }

    .pl-deadline-badge.relaxed {
        background: #F3F4F6;
        color: #4B5563;
    }

    .pl-card-header-badges {
        display: flex;
        align-items: center;
        gap: 0.375rem;
        flex-wrap: wrap;
        min-width: 0;
    }

    .pl-country-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.1875rem 0.5rem;
        border-radius: 6px;
        font-size: 0.6875rem;
        font-weight: 500;
        background: #DBEAFE;
        color: #1D4ED8;
        white-space: nowrap;
        flex-shrink: 0;
    }

    .pl-match-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.25rem 0.625rem;
        border-radius: 20px;
        font-size: 0.75rem;
        font-weight: 700;
        white-space: nowrap;
    }

    .pl-match-badge.high {
        background: #F0FDF4;
        color: #16A34A;
    }

    .pl-match-badge.medium {
        background: #FEFCE8;
        color: #CA8A04;
    }

    .pl-match-badge.low {
        background: #F3F4F6;
        color: #4B5563;
    }

    .pl-card-title {
        font-size: 0.9375rem;
        font-weight: 700;
        color: #111827;
        line-height: 1.4;
        margin-bottom: 0.375rem;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .pl-card-title a {
        color: inherit;
        text-decoration: none;
    }

    .pl-card-title a:hover {
        color: #2563EB;
    }

    .pl-card-client-row {
        display: flex;
        flex-direction: column;
        gap: 0.375rem;
        margin-bottom: 0.75rem;
    }

    .pl-card-client {
        font-size: 0.8125rem;
        color: #6B7280;
        display: flex;
        align-items: center;
        gap: 0.25rem;
        margin: 0;
    }

    .pl-card-middle {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.75rem 0;
        border-top: 1px solid #F3F4F6;
        border-bottom: 1px solid #F3F4F6;
        margin-bottom: 0.75rem;
    }

    .pl-card-assignee {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .pl-assignee-select {
        padding: 0.375rem 0.75rem;
        padding-right: 2rem;
        border: 1px solid #E5E7EB;
        border-radius: 6px;
        background: white;
        color: #374151;
        font-size: 0.8125rem;
        font-weight: 500;
        font-family: inherit;
        max-width: 160px;
        text-overflow: ellipsis;
        cursor: pointer;
        transition: all 0.2s ease;
        appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 0.5rem center;
    }

    .pl-assignee-select:hover {
        border-color: #D1D5DB;
        background-color: #F9FAFB;
    }

    .pl-assignee-select:focus {
        outline: none;
        border-color: #2563EB;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
    }

    .pl-stage-pill {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.25rem 0.625rem;
        border-radius: 6px;
        font-size: 0.75rem;
        font-weight: 600;
        border: 1px solid;
        cursor: pointer;
        transition: all 0.2s ease;
        position: relative;
    }

    .pl-stage-pill:hover {
        transform: translateY(-1px);
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    }

    .pl-stage-pill.saved {
        background: #F9FAFB;
        color: #374151;
        border-color: #D1D5DB;
    }

    .pl-stage-pill.qualifying {
        background: #FEFCE8;
        color: #A16207;
        border-color: #EAB308;
    }

    .pl-stage-pill.drafting {
        background: #EFF6FF;
        color: #1D4ED8;
        border-color: #3B82F6;
    }

    .pl-stage-pill.review {
        background: #EFF6FF;
        color: #7E22CE;
        border-color: #A855F7;
    }

    .pl-stage-pill.submitted {
        background: #F0FDF4;
        color: #15803D;
        border-color: #22C55E;
    }

    .pl-stage-pill.taas {
        background: linear-gradient(135deg, #EFF6FF, #E0E7FF);
        color: #1D4ED8;
        border-color: #818CF8;
    }

    /* TaaS column distinctive styling */
    .pl-column[data-stage="taas"] .pl-column-header {
        background: linear-gradient(135deg, #EFF6FF 0%, #E0E7FF 50%, #BFDBFE 100%);
        border-bottom: 2px solid #818CF8;
    }

    .pl-column[data-stage="taas"] .pl-column-title h3 {
        background: linear-gradient(135deg, #1D4ED8, #3B82F6);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

    .pl-column[data-stage="taas"] .pl-column-count {
        background: linear-gradient(135deg, #1D4ED8, #3B82F6);
        color: white;
    }

    .pl-column[data-stage="taas"] .pl-column-desc {
        color: #1D4ED8;
    }

    .pl-column[data-stage="taas"] .pl-column-cards.drag-over {
        background: #EFF6FF;
    }

    .pl-taas-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        background: linear-gradient(135deg, #1D4ED8, #3B82F6);
        color: white;
        font-size: 0.625rem;
        font-weight: 700;
        padding: 0.125rem 0.5rem;
        border-radius: 999px;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        line-height: 1;
    }

    .pl-taas-badge svg {
        stroke: white;
    }

    .pl-card-actions {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
    }

    .pl-action-label {
        font-size: 0.6875rem;
        font-weight: 600;
        color: #6B7280;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .pl-docs-row {
        display: flex;
        gap: 0.375rem;
        flex-wrap: wrap;
    }

    .pl-doc-chip {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.375rem 0.625rem;
        background: #F9FAFB;
        border: 1px solid #E5E7EB;
        border-radius: 6px;
        font-size: 0.75rem;
        font-weight: 500;
        color: #374151;
        cursor: pointer;
        transition: all 0.2s ease;
        text-decoration: none;
    }

    .pl-doc-chip:hover {
        background: #F3F4F6;
        border-color: #D1D5DB;
        transform: translateY(-1px);
    }

    .pl-doc-chip.exists {
        background: #EFF6FF;
        border-color: #BFDBFE;
        color: #1D4ED8;
    }

    .pl-doc-chip.exists:hover {
        background: #DBEAFE;
        border-color: #93C5FD;
    }

    .pl-generate-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.375rem 0.625rem;
        background: transparent;
        border: 1px dashed #D1D5DB;
        border-radius: 6px;
        font-size: 0.75rem;
        font-weight: 500;
        color: #6B7280;
        cursor: pointer;
        font-family: inherit;
        transition: all 0.2s ease;
        text-decoration: none;
    }

    .pl-generate-btn:hover {
        border-color: #3B82F6;
        color: #2563EB;
        background: #EFF6FF;
    }

    .pl-card-footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 0.5rem;
    }

    .pl-comments-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.375rem 0.625rem;
        background: transparent;
        border: 1px solid #E5E7EB;
        border-radius: 6px;
        font-size: 0.75rem;
        font-weight: 500;
        color: #4B5563;
        cursor: pointer;
        font-family: inherit;
        transition: all 0.2s ease;
        text-decoration: none;
    }

    .pl-comments-btn:hover {
        background: #F9FAFB;
        border-color: #D1D5DB;
        color: #111827;
    }

    .pl-comments-btn.has-comments {
        background: #EFF6FF;
        border-color: #BFDBFE;
        color: #1D4ED8;
    }

    .pl-comment-count {
        background: #2563EB;
        color: white;
        padding: 0.0625rem 0.375rem;
        border-radius: 10px;
        font-size: 0.6875rem;
        font-weight: 700;
    }

    .pl-value-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.1875rem 0.5rem;
        background: #F0FDF4;
        border: 1px solid #BBF7D0;
        border-radius: 6px;
        font-size: 0.6875rem;
        font-weight: 600;
        color: #15803D;
    }

    .pl-empty-column {
        text-align: center;
        padding: 2rem 1rem;
        color: #9CA3AF;
        font-size: 0.875rem;
    }

    .pl-empty-state {
        text-align: center;
        padding: 4rem 2rem;
        background: white;
        border-radius: 1rem;
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
        border: 1px solid #E5E7EB;
        max-width: 600px;
        margin: 2rem auto;
    }

    .pl-empty-state h3 {
        font-size: 1.5rem;
        font-weight: 700;
        color: #111827;
        margin-bottom: 0.75rem;
    }

    .pl-empty-state p {
        color: #6B7280;
        font-size: 1rem;
        line-height: 1.6;
        margin-bottom: 1.5rem;
    }

    .pl-btn-primary {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.625rem 1.125rem;
        border-radius: 8px;
        font-size: 0.875rem;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.2s ease;
        border: none;
        background: #2563EB;
        white-space: nowrap;
        flex-shrink: 0;
        color: white;
        text-decoration: none;
        font-family: inherit;
    }

    .pl-btn-primary:hover {
        background: #1D4ED8;
        transform: translateY(-1px);
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    }

    .pl-stage-dropdown {
        position: relative;
        display: inline-block;
    }

    .pl-stage-menu {
        display: none;
        position: absolute;
        top: 100%;
        right: 0;
        margin-top: 0.25rem;
        background: white;
        border: 1px solid #E5E7EB;
        border-radius: 8px;
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
        z-index: 20;
        min-width: 160px;
        padding: 0.25rem;
    }

    .pl-stage-menu.open {
        display: block;
    }

    .pl-stage-option {
        display: block;
        width: 100%;
        padding: 0.5rem 0.75rem;
        text-align: left;
        border: none;
        background: transparent;
        color: #374151;
        font-size: 0.8125rem;
        font-weight: 500;
        cursor: pointer;
        border-radius: 6px;
        font-family: inherit;
        transition: background 0.15s ease;
    }

    .pl-stage-option:hover {
        background: #F3F4F6;
    }

    .pl-stage-option.current {
        background: #EFF6FF;
        color: #1D4ED8;
        font-weight: 600;
    }

    .pl-notes-preview {
        background: #FFFBEB;
        border: 1px solid #FDE68A;
        border-radius: 6px;
        padding: 0.5rem 0.75rem;
        margin-bottom: 0.5rem;
        font-size: 0.75rem;
        color: #92400E;
        font-style: italic;
        display: flex;
        align-items: flex-start;
        gap: 0.5rem;
        position: relative;
    }

    .pl-notes-preview.pl-notes-empty {
        background: transparent;
        border: 1px dashed #d1d5db;
        padding: 0.375rem 0.75rem;
    }

    .pl-notes-text {
        flex: 1;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .pl-notes-edit-link {
        cursor: pointer;
        color: #92400E;
        opacity: 0.6;
        flex-shrink: 0;
        padding: 2px;
        transition: opacity 0.2s;
    }

    .pl-notes-edit-link:hover {
        opacity: 1;
    }

    .pl-notes-add-link {
        cursor: pointer;
        color: #6b7280;
        display: flex;
        align-items: center;
        gap: 0.375rem;
        font-size: 0.75rem;
        font-style: normal;
        text-decoration: none;
        transition: color 0.2s;
    }

    .pl-notes-add-link:hover {
        color: #374151;
    }

    /* Pipeline inline note area (matching search page pattern) */
    .pl-notes-wrapper {
        margin-bottom: 0.5rem;
    }

    .pl-note-area {
        margin-top: 0.375rem;
    }

    .pl-note-input {
        width: 100%;
        min-height: 60px;
        padding: 0.5rem;
        border: 1px solid #e5e7eb;
        border-radius: 6px;
        font-size: 0.75rem;
        resize: vertical;
        font-family: inherit;
        background: white;
        color: #1f2937;
        box-sizing: border-box;
        transition: border-color 0.2s;
    }

    .pl-note-input:focus {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.1);
    }

    .pl-note-actions {
        display: flex;
        gap: 0.375rem;
        justify-content: flex-end;
        margin-top: 0.375rem;
    }

    .pl-note-cancel-btn {
        padding: 0.25rem 0.625rem;
        border: 1px solid #e5e7eb;
        background: white;
        border-radius: 4px;
        font-size: 0.6875rem;
        cursor: pointer;
        color: #6b7280;
        font-weight: 500;
        transition: all 0.15s;
    }

    .pl-note-cancel-btn:hover {
        border-color: #d1d5db;
        background: #f9fafb;
    }

    .pl-note-save-btn {
        padding: 0.25rem 0.625rem;
        border: none;
        background: linear-gradient(135deg, #667eea, #764ba2);
        color: white;
        border-radius: 4px;
        font-size: 0.6875rem;
        cursor: pointer;
        font-weight: 600;
        transition: all 0.15s;
    }

    .pl-note-save-btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);
    }

    /* Edit Notes Modal (pipeline page) */
    .save-notes-modal-overlay {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.5);
        backdrop-filter: blur(8px);
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: var(--z-sticky);
        opacity: 0;
        visibility: hidden;
        transition: all 0.3s ease;
    }

    .save-notes-modal-overlay.show {
        opacity: 1;
        visibility: visible;
    }

    .save-notes-modal {
        background: white;
        border-radius: 1rem;
        padding: 0;
        max-width: 500px;
        width: 90%;
        max-height: 90vh;
        overflow: hidden;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
        border: 1px solid rgba(0, 0, 0, 0.05);
        transform: scale(0.9);
        transition: transform 0.3s ease;
    }

    .save-notes-modal-overlay.show .save-notes-modal {
        transform: scale(1);
    }

    .save-notes-modal-header {
        padding: 1.5rem 1.5rem 1rem 1.5rem;
        border-bottom: 1px solid #f3f4f6;
        position: relative;
    }

    .save-notes-modal-title {
        font-size: 1.25rem;
        font-weight: 700;
        color: #1f2937;
        margin: 0;
        padding-right: 2rem;
    }

    .save-notes-modal-close {
        position: absolute;
        top: 1rem;
        right: 1rem;
        width: 2rem;
        height: 2rem;
        border: none;
        background: #f3f4f6;
        border-radius: 0.5rem;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1rem;
        color: #6b7280;
        transition: all 0.2s;
    }

    .save-notes-modal-close:hover {
        background: #e5e7eb;
        color: #374151;
    }

    .save-notes-modal-body {
        padding: 1.5rem;
    }

    .save-notes-modal-textarea {
        width: 100%;
        min-height: 100px;
        padding: 0.75rem;
        border: 2px solid #e5e7eb;
        border-radius: 0.75rem;
        font-size: 0.875rem;
        resize: vertical;
        margin-bottom: 1rem;
        transition: border-color 0.2s;
        font-family: inherit;
        background: white;
        color: #1f2937;
        box-sizing: border-box;
    }

    .save-notes-modal-textarea:focus {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    }

    .save-notes-modal-textarea::placeholder {
        color: #9ca3af;
    }

    .save-notes-modal-actions {
        display: flex;
        gap: 0.75rem;
        justify-content: flex-end;
        padding-top: 1rem;
        border-top: 1px solid #f3f4f6;
    }

    .save-notes-modal-btn {
        padding: 0.75rem 1.5rem;
        border-radius: 0.75rem;
        font-weight: 600;
        font-size: 0.875rem;
        cursor: pointer;
        transition: all 0.2s;
        border: 2px solid transparent;
        min-width: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .save-notes-modal-btn-cancel {
        background: white;
        color: #6b7280;
        border-color: #e5e7eb;
    }

    .save-notes-modal-btn-cancel:hover {
        border-color: #d1d5db;
        background: #f9fafb;
    }

    .save-notes-modal-btn-primary {
        background: linear-gradient(135deg, #667eea, #764ba2);
        color: white;
    }

    .save-notes-modal-btn-primary:hover {
        transform: translateY(-1px);
        box-shadow: 0 8px 25px rgba(102, 126, 234, 0.3);
    }

    @media (max-width: 1024px) {
        .pl-header {
            padding: 0.5rem 1rem;
        }
        .pl-page-title {
            font-size: 1.125rem;
        }
        .pl-stats {
            display: none;
        }
        .pl-stats-divider {
            display: none;
        }
        .pl-board-wrapper {
            padding: 0.75rem;
            height: calc(100vh - 160px);
        }
        .pl-board {
            gap: 0.75rem;
        }
        .pl-column {
            min-width: 260px;
        }
        .pl-filter-dropdown {
            min-width: 110px;
            font-size: 0.75rem;
            padding: 0.375rem 0.625rem;
        }
    }

    @media (max-width: 768px) {
        .pl-header-top {
            flex-direction: column;
            gap: 0.75rem;
            align-items: stretch;
        }
        .pl-header-filters {
            flex-wrap: wrap;
            margin-left: 0;
        }
        .pl-filter-dropdown {
            flex: 1 1 auto;
            min-width: 0;
        }
        .pl-btn-primary {
            width: 100%;
            justify-content: center;
        }
        .pl-board-wrapper {
            padding: 0.5rem;
            height: auto;
            overflow-x: visible;
        }
        .pl-board {
            flex-direction: column;
            gap: 1rem;
            height: auto;
        }
        .pl-column {
            min-width: 0;
            max-height: none;
            flex: none;
            overflow: visible;
        }
        .pl-column-cards {
            max-height: none;
            overflow-y: visible;
            flex: none;
        }
        .pl-card {
            padding: 0.75rem;
        }
        .pl-column-header {
            padding: 0.75rem 1rem;
        }
    }

    /* ============================================
       Savings / Success Cards for Social Sharing
       ============================================ */

    .sc-container {
        max-width: 420px;
        margin: 0 auto;
        animation: scFadeInUp 0.5s ease-out;
    }

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

    .sc-card {
        border-radius: 20px;
        padding: 2rem 2rem 1.75rem;
        color: white;
        position: relative;
        overflow: hidden;
        box-shadow: 0 20px 60px -12px rgba(0, 0, 0, 0.25);
    }

    .sc-card::before {
        content: '';
        position: absolute;
        top: -50%;
        right: -30%;
        width: 300px;
        height: 300px;
        background: radial-gradient(circle, rgba(255,255,255,0.08) 0%, transparent 70%);
        border-radius: 50%;
        pointer-events: none;
    }

    .sc-card::after {
        content: '';
        position: absolute;
        bottom: -40%;
        left: -20%;
        width: 250px;
        height: 250px;
        background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, transparent 70%);
        border-radius: 50%;
        pointer-events: none;
    }

    .sc-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 1.5rem;
        position: relative;
        z-index: 1;
    }

    .sc-icon {
        width: 48px;
        height: 48px;
        background: rgba(255,255,255,0.2);
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        backdrop-filter: blur(10px);
    }

    .sc-brand {
        display: flex;
        align-items: center;
        gap: 0.375rem;
    }

    .sc-brand-name {
        font-size: 0.875rem;
        font-weight: 600;
        color: rgba(255,255,255,0.8);
        letter-spacing: 0.02em;
    }

    .sc-headline {
        font-size: 1.125rem;
        font-weight: 600;
        color: rgba(255,255,255,0.9);
        margin-bottom: 1.25rem;
        line-height: 1.4;
        position: relative;
        z-index: 1;
    }

    .sc-metric {
        text-align: center;
        margin-bottom: 1.75rem;
        position: relative;
        z-index: 1;
    }

    .sc-metric-value {
        font-size: 3.5rem;
        font-weight: 800;
        color: white;
        line-height: 1;
        letter-spacing: -0.02em;
        text-shadow: 0 2px 10px rgba(0,0,0,0.1);
        margin-bottom: 0.375rem;
    }

    .sc-metric-label {
        font-size: 0.8125rem;
        color: rgba(255,255,255,0.75);
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.08em;
    }

    .sc-comparison {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1rem;
        background: rgba(255,255,255,0.12);
        border-radius: 14px;
        padding: 1rem 1.25rem;
        backdrop-filter: blur(10px);
        margin-bottom: 1rem;
        position: relative;
        z-index: 1;
    }

    .sc-compare-item {
        flex: 1;
        text-align: center;
    }

    .sc-compare-value {
        font-size: 1.25rem;
        font-weight: 700;
        color: white;
        margin-bottom: 0.125rem;
    }

    .sc-compare-label {
        font-size: 0.6875rem;
        color: rgba(255,255,255,0.65);
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .sc-compare-vs {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }

    .sc-compare-tendly .sc-compare-value {
        color: #fef08a;
    }

    .sc-estimate {
        display: flex;
        align-items: center;
        gap: 0.375rem;
        font-size: 0.6875rem;
        color: rgba(255,255,255,0.5);
        justify-content: center;
        position: relative;
        z-index: 1;
    }

    /* Share row below the card */
    .sc-share-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 1rem;
        padding: 0 0.25rem;
    }

    .sc-share-label {
        font-size: 0.8125rem;
        font-weight: 600;
        color: #6b7280;
    }

    .sc-share-buttons {
        display: flex;
        gap: 0.5rem;
    }

    .sc-share-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.375rem;
        padding: 0.5rem 0.875rem;
        border-radius: 8px;
        font-size: 0.75rem;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.2s ease;
        text-decoration: none;
        border: 1px solid #e5e7eb;
        background: white;
        color: #374151;
    }

    .sc-share-btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }

    .sc-share-btn svg {
        flex-shrink: 0;
    }

    .sc-share-x:hover {
        background: #0f1419;
        color: white;
        border-color: #0f1419;
    }

    .sc-share-linkedin:hover {
        background: #0077b5;
        color: white;
        border-color: #0077b5;
    }

    .sc-share-invite:hover {
        background: #2563eb;
        color: white;
        border-color: #2563eb;
    }

    /* Responsive */
    @media (max-width: 480px) {
        .sc-container {
            max-width: 100%;
        }
        .sc-card {
            padding: 1.5rem;
            border-radius: 16px;
        }
        .sc-metric-value {
            font-size: 2.75rem;
        }
        .sc-share-row {
            flex-direction: column;
            gap: 0.75rem;
            align-items: stretch;
        }
        .sc-share-buttons {
            justify-content: center;
        }
        .sc-share-btn span {
            display: none;
        }
    }

    /* ============================================
       MY GENERATED DOCUMENTS TAB
       ============================================ */
    .mydocs-row:hover {
        background: #f8fafc;
    }

    @media (max-width: 768px) {
        .mydocs-row {
            flex-wrap: wrap;
            gap: 0.5rem;
        }
        .mydocs-row > div {
            flex: none !important;
            width: 100%;
        }
        .mydocs-row > div:last-child {
            justify-content: flex-start !important;
        }
    }

    /* ============================================
       ANONYMOUS USER TENDER LIMIT - SIGNUP CTA
       ============================================ */

    /* --- Listing CTA card (shown below 12 tenders) --- */
    .tender-limit-cta-card {
        text-align: center;
        padding: 3rem 2rem;
        background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 50%, #eff6ff 100%);
        border: 2px dashed #93c5fd;
        border-radius: 16px;
        max-width: 600px;
        margin: 0 auto;
    }
    .tender-limit-cta-title {
        font-size: 1.5rem;
        font-weight: 700;
        color: #1f2937;
        margin-bottom: 0.5rem;
    }
    .tender-limit-cta-desc {
        color: #6b7280;
        font-size: 1rem;
        line-height: 1.6;
        margin-bottom: 1.5rem;
        max-width: 450px;
        margin-left: auto;
        margin-right: auto;
    }
    .tender-limit-benefits {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        align-items: center;
        margin-bottom: 1.5rem;
    }
    .tender-limit-benefit {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        color: #374151;
        font-size: 0.9375rem;
    }
    .tender-limit-signup-btn {
        display: inline-block;
        background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%);
        color: white;
        padding: 0.875rem 2.5rem;
        border-radius: 10px;
        font-weight: 600;
        font-size: 1rem;
        text-decoration: none;
        box-shadow: 0 4px 14px rgba(37, 99, 235, 0.3);
        transition: all 0.2s ease;
    }
    .tender-limit-signup-btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 6px 20px rgba(37, 99, 235, 0.4);
        color: white;
    }

    /* --- Full-page signup wall (shown after 5 tender opens) --- */
    .tender-limit-wall-section {
        padding: 4rem 0;
        background: linear-gradient(180deg, #f8fafc 0%, #eff6ff 100%);
        min-height: calc(100vh - 80px);
        display: flex;
        align-items: center;
    }
    .tender-limit-wall-container {
        max-width: 720px;
        margin: 0 auto;
        padding: 0 1.5rem;
        text-align: center;
    }
    .tender-limit-wall-icon {
        margin-bottom: 1.5rem;
    }
    .tender-limit-wall-title {
        font-size: 2.25rem;
        font-weight: 800;
        color: #0f172a;
        margin-bottom: 0.75rem;
        line-height: 1.2;
    }
    .tender-limit-wall-subtitle {
        color: #64748b;
        font-size: 1.125rem;
        line-height: 1.6;
        margin-bottom: 2.5rem;
        max-width: 540px;
        margin-left: auto;
        margin-right: auto;
    }
    .tender-limit-wall-benefits {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1.5rem;
        margin-bottom: 2.5rem;
        text-align: left;
    }
    .tender-limit-wall-benefit {
        background: white;
        padding: 1.25rem;
        border-radius: 12px;
        border: 1px solid #e5e7eb;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    }
    .tender-limit-wall-benefit-icon {
        margin-bottom: 0.75rem;
    }
    .tender-limit-wall-benefit-title {
        font-size: 1rem;
        font-weight: 600;
        color: #1f2937;
        margin-bottom: 0.25rem;
    }
    .tender-limit-wall-benefit-desc {
        font-size: 0.875rem;
        color: #6b7280;
        line-height: 1.5;
    }
    .tender-limit-wall-actions {
        display: flex;
        gap: 1rem;
        justify-content: center;
        align-items: center;
        margin-bottom: 1.5rem;
        flex-wrap: wrap;
    }
    .tender-limit-wall-btn-primary {
        display: inline-block;
        background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%);
        color: white;
        padding: 1rem 2.5rem;
        border-radius: 10px;
        font-weight: 600;
        font-size: 1.0625rem;
        text-decoration: none;
        box-shadow: 0 4px 14px rgba(37, 99, 235, 0.3);
        transition: all 0.2s ease;
    }
    .tender-limit-wall-btn-primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(37, 99, 235, 0.4);
        color: white;
    }
    .tender-limit-wall-btn-secondary {
        display: inline-block;
        background: white;
        color: #2563EB;
        padding: 1rem 2.5rem;
        border-radius: 10px;
        font-weight: 600;
        font-size: 1.0625rem;
        text-decoration: none;
        border: 2px solid #2563EB;
        transition: all 0.2s ease;
    }
    .tender-limit-wall-btn-secondary:hover {
        background: #eff6ff;
        color: #1D4ED8;
    }
    .tender-limit-wall-free {
        color: #9ca3af;
        font-size: 0.8125rem;
    }

    @media (max-width: 768px) {
        .tender-limit-wall-title {
            font-size: 1.75rem;
        }
        .tender-limit-wall-subtitle {
            font-size: 1rem;
        }
        .tender-limit-wall-benefits {
            grid-template-columns: 1fr;
            gap: 1rem;
        }
        .tender-limit-wall-actions {
            flex-direction: column;
        }
        .tender-limit-wall-btn-primary,
        .tender-limit-wall-btn-secondary {
            width: 100%;
            text-align: center;
        }
        .tender-limit-wall-section {
            padding: 2rem 0;
        }
        .tender-limit-cta-card {
            padding: 2rem 1.25rem;
        }
        .tender-limit-cta-title {
            font-size: 1.25rem;
        }
    }

    /* === INSIGHTS LOADING SKELETON === */
    @keyframes insights-skeleton-shimmer {
        0% { background-position: -800px 0; }
        100% { background-position: 800px 0; }
    }

    @keyframes insights-pulse-glow {
        0%, 100% { opacity: 0.4; }
        50% { opacity: 1; }
    }

    @keyframes insights-spin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }

    .insights-skeleton-page {
        background: #f8fafc;
        min-height: 100vh;
        padding-bottom: 3rem;
    }

    .insights-skeleton-hero {
        background: linear-gradient(135deg, #1D4ED8 0%, #2563EB 50%, #3B82F6 100%);
        padding: 2.5rem 1.5rem 2rem;
        position: relative;
        overflow: hidden;
    }

    .insights-skeleton-hero::before {
        content: '';
        position: absolute;
        top: 0; left: 0; right: 0; bottom: 0;
        background: radial-gradient(circle at 20% 50%, rgba(255,255,255,0.08) 0%, transparent 50%),
                    radial-gradient(circle at 80% 20%, rgba(255,255,255,0.05) 0%, transparent 40%);
        pointer-events: none;
    }

    .insights-skeleton-hero-inner {
        max-width: 1200px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1rem;
        position: relative;
        z-index: 1;
    }

    .insights-skeleton-bar {
        background: linear-gradient(90deg, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0.18) 50%, rgba(255,255,255,0.08) 100%);
        background-size: 800px 100%;
        animation: insights-skeleton-shimmer 1.8s infinite ease-in-out;
        border-radius: 8px;
    }

    .insights-skeleton-bar-dark {
        background: linear-gradient(90deg, #e5e7eb 0%, #f3f4f6 50%, #e5e7eb 100%);
        background-size: 800px 100%;
        animation: insights-skeleton-shimmer 1.8s infinite ease-in-out;
        border-radius: 8px;
    }

    .insights-skeleton-spinner {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 3rem 1rem;
        gap: 1.25rem;
    }

    .insights-skeleton-spinner-ring {
        width: 48px;
        height: 48px;
        border: 3px solid #e5e7eb;
        border-top-color: #2563EB;
        border-radius: 50%;
        animation: insights-spin 0.8s linear infinite;
    }

    .insights-skeleton-spinner-text {
        font-size: 1rem;
        color: #6b7280;
        font-weight: 500;
    }

    .insights-skeleton-container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 1.5rem;
    }

    .insights-skeleton-kpi-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 1rem;
        margin-bottom: 1.5rem;
    }

    .insights-skeleton-kpi-card {
        background: #fff;
        border-radius: 12px;
        padding: 1.5rem;
        box-shadow: 0 1px 3px rgba(0,0,0,0.06);
        border: 1px solid #f0f0f0;
    }

    .insights-skeleton-section {
        background: #fff;
        border-radius: 12px;
        padding: 1.5rem;
        margin-bottom: 1.5rem;
        box-shadow: 0 1px 3px rgba(0,0,0,0.06);
        border: 1px solid #f0f0f0;
    }

    .insights-skeleton-table-row {
        display: flex;
        gap: 1rem;
        padding: 0.75rem 0;
        border-bottom: 1px solid #f3f4f6;
    }

    .insights-skeleton-charts-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1.5rem;
        margin-bottom: 1.5rem;
    }

    @media (max-width: 768px) {
        .insights-skeleton-kpi-grid {
            grid-template-columns: repeat(2, 1fr);
            gap: 0.75rem;
        }
        .insights-skeleton-charts-grid {
            grid-template-columns: 1fr;
        }
        .insights-skeleton-hero {
            padding: 1.5rem 1rem;
        }
        .insights-skeleton-container {
            padding: 1rem;
        }
        .insights-skeleton-kpi-card {
            padding: 1rem;
        }
    }

    @media (max-width: 480px) {
        .insights-skeleton-kpi-grid {
            grid-template-columns: 1fr 1fr;
            gap: 0.5rem;
        }
    }

    /* ================================================================
       Upgrade CTA Components
       ================================================================ */

    /* Inline CTA - replaces feature content */
    .upgrade-cta-inline {
        background: white;
        border-radius: 16px;
        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
        padding: 2.5rem 2rem;
        max-width: 28rem;
        margin: 2rem auto;
        text-align: center;
    }

    .upgrade-cta-icon {
        margin-bottom: 1rem;
    }

    .upgrade-cta-title {
        font-size: 1.25rem;
        font-weight: 700;
        color: #1f2937;
        margin: 0 0 0.5rem 0;
    }

    .upgrade-cta-description {
        color: #6b7280;
        font-size: 0.9375rem;
        line-height: 1.6;
        margin: 0 0 1.5rem 0;
        max-width: 24rem;
        margin-left: auto;
        margin-right: auto;
    }

    .upgrade-cta-btn-primary {
        display: inline-block;
        padding: 0.75rem 2rem;
        background: linear-gradient(135deg, #3b82f6 0%, #1e40af 100%);
        color: white !important;
        border: none;
        border-radius: 10px;
        font-weight: 600;
        font-size: 0.9375rem;
        text-decoration: none;
        box-shadow: 0 4px 14px rgba(59, 130, 246, 0.35);
        transition: transform 0.15s ease, box-shadow 0.15s ease;
        cursor: pointer;
    }

    .upgrade-cta-btn-primary:hover {
        transform: translateY(-1px);
        box-shadow: 0 6px 20px rgba(59, 130, 246, 0.4);
        color: white !important;
        text-decoration: none;
    }

    .upgrade-cta-btn-secondary {
        display: inline-block;
        padding: 0.625rem 1.5rem;
        background: white;
        color: #6b7280;
        border: 1px solid #d1d5db;
        border-radius: 8px;
        font-weight: 500;
        font-size: 0.875rem;
        text-decoration: none;
        transition: border-color 0.15s ease, color 0.15s ease;
        cursor: pointer;
    }

    .upgrade-cta-btn-secondary:hover {
        border-color: #2563EB;
        color: #2563EB;
        text-decoration: none;
    }

    .upgrade-cta-price {
        display: block;
        color: #9ca3af;
        font-size: 0.8125rem;
        margin: 0.75rem 0 0.5rem 0;
    }

    .upgrade-cta-link {
        color: #3b82f6;
        text-decoration: none;
        font-weight: 500;
        font-size: 0.875rem;
    }

    .upgrade-cta-link:hover {
        text-decoration: underline;
    }

    .upgrade-cta-recommended-badge {
        display: inline-block;
        background: linear-gradient(135deg, #3b82f6, #1e40af);
        color: white;
        padding: 0.2rem 0.625rem;
        border-radius: 999px;
        font-size: 0.6875rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .upgrade-cta-upsell-box {
        background: linear-gradient(135deg, #eff6ff, #f0f7ff);
        border: 1px solid #bfdbfe;
        border-radius: 12px;
        padding: 1.25rem 1.5rem;
        margin-bottom: 1.25rem;
    }

    .upgrade-cta-divider {
        text-align: center;
        border-top: 1px solid #e5e7eb;
        margin: 0 2rem 1rem 2rem;
        position: relative;
        top: -0.5rem;
    }

    .upgrade-cta-divider span {
        position: relative;
        top: -0.625rem;
    }

    /* Banner CTA - slim horizontal bar */
    .upgrade-cta-banner {
        background: linear-gradient(135deg, #eff6ff 0%, #eff6ff 100%);
        border: 1px solid #bfdbfe;
        border-radius: 10px;
        padding: 0.625rem 1rem;
        margin-bottom: 1rem;
    }

    .upgrade-cta-banner-inner {
        display: flex;
        align-items: center;
        gap: 0.625rem;
        flex-wrap: wrap;
    }

    .upgrade-cta-banner-text {
        flex: 1;
        color: #374151;
        font-size: 0.875rem;
        font-weight: 500;
        min-width: 0;
    }

    .upgrade-cta-banner-btn {
        display: inline-block;
        padding: 0.375rem 1rem;
        background: linear-gradient(135deg, #3b82f6 0%, #1e40af 100%);
        color: white !important;
        border-radius: 6px;
        font-weight: 600;
        font-size: 0.8125rem;
        text-decoration: none;
        white-space: nowrap;
        transition: transform 0.15s ease;
    }

    .upgrade-cta-banner-btn:hover {
        transform: translateY(-1px);
        color: white !important;
        text-decoration: none;
    }

    /* Modal CTA - overlay */
    .upgrade-cta-modal-overlay {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.5);
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: var(--z-toast);
        padding: 1rem;
    }

    .upgrade-cta-modal-card {
        background: white;
        border-radius: 16px;
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
        padding: 2.5rem 2rem;
        max-width: 28rem;
        width: 100%;
        text-align: center;
        position: relative;
    }

    .upgrade-cta-modal-close {
        position: absolute;
        top: 1rem;
        right: 1rem;
        background: none;
        border: none;
        color: #9ca3af;
        cursor: pointer;
        padding: 0.25rem;
        line-height: 1;
    }

    .upgrade-cta-modal-close:hover {
        color: #374151;
    }

    .upgrade-cta-modal-actions {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.75rem;
    }

    .upgrade-cta-modal-dismiss {
        color: #9ca3af;
        font-size: 0.875rem;
        text-decoration: none;
    }

    .upgrade-cta-modal-dismiss:hover {
        color: #6b7280;
        text-decoration: underline;
    }

    /* Responsive adjustments */
    @media (max-width: 640px) {
        .upgrade-cta-inline {
            padding: 1.5rem 1.25rem;
            margin: 1rem;
            max-width: none;
        }

        .upgrade-cta-modal-card {
            padding: 2rem 1.5rem;
        }

        .upgrade-cta-banner-inner {
            flex-direction: column;
            text-align: center;
        }

        .upgrade-cta-banner-text {
            text-align: center;
        }
    }

    /* ==================== NOTIFICATIONS ==================== */

    /* Bell icon in navbar */
    .nav-bell-container { display: flex; align-items: center; margin: 0 12px; }
    .nav-bell-link { color: #6B7280; display: flex; align-items: center; text-decoration: none; transition: color 0.2s; position: relative; }
    .nav-bell-link:hover { color: #2563EB; }
    .bell-icon-wrapper { position: relative; display: flex; align-items: center; padding: 6px; }
    .notification-dot { position: absolute; top: 4px; right: 4px; width: 8px; height: 8px; background: #3B82F6; border-radius: 50%; border: 2px solid white; }

    /* Notifications page */
    .notifications-container { max-width: 700px; margin: 0 auto; padding: 32px 16px; }
    .notifications-header { margin-bottom: 24px; }
    .notifications-page-title { font-size: 24px; font-weight: 700; color: #111827; margin: 0 0 4px; }
    .notifications-page-subtitle { font-size: 14px; color: #6B7280; margin: 0; }
    .notifications-list { display: flex; flex-direction: column; gap: 1px; background: #E5E7EB; border-radius: 12px; overflow: hidden; border: 1px solid #E5E7EB; }
    .notification-link { text-decoration: none; color: inherit; }
    .notification-item { display: flex; gap: 12px; padding: 16px; background: white; transition: background 0.15s; cursor: pointer; }
    .notification-item:hover { background: #F9FAFB; }
    .notification-unread { background: #EFF6FF; }
    .notification-unread:hover { background: #DBEAFE; }
    .notification-icon { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .mention-icon { background: #DBEAFE; color: #2563EB; }
    .assignment-icon { background: #DBEAFE; color: #3B82F6; }
    .notification-content { flex: 1; min-width: 0; }
    .notification-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
    .notification-text { font-size: 14px; color: #374151; line-height: 1.4; }
    .notification-time { font-size: 12px; color: #9CA3AF; white-space: nowrap; flex-shrink: 0; }
    .notification-message-preview { font-size: 13px; color: #6B7280; margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

    /* Empty state */
    .notifications-empty-container { padding: 48px 24px; }
    .notifications-empty { text-align: center; }

    /* Notifications mobile responsive */
    @media (max-width: 768px) {
        .notifications-container { padding: 16px; }
        .notification-header { flex-direction: column; gap: 2px; }
        .notification-time { font-size: 11px; }
        .nav-bell-container { margin: 0 8px; }
    }

    /* ==================== TAAS MESSAGES ==================== */

    /* TaaS nav badge */
    .taas-nav-badge-wrapper { display: inline-flex; align-items: center; }
    .taas-nav-badge {
        display: inline-flex; align-items: center; justify-content: center;
        min-width: 18px; height: 18px; padding: 0 5px;
        background: #2563EB; color: white; font-size: 11px; font-weight: 700;
        border-radius: 9px; line-height: 1;
    }

    /* Page layout */
    .taas-messages-container { max-width: 1200px; margin: 0 auto; padding: 24px 16px; }
    .taas-page-header { margin-bottom: 24px; }
    .taas-page-title { font-size: 24px; font-weight: 700; color: #111827; margin: 0 0 4px; }
    .taas-page-subtitle { font-size: 14px; color: #6B7280; margin: 0; }

    /* Chat layout — sidebar + main */
    .taas-chat-layout {
        display: grid; grid-template-columns: 280px 1fr;
        border: 1px solid #E5E7EB; border-radius: 12px; overflow: hidden;
        background: white; min-height: 560px; max-height: 75vh;
    }

    /* Sidebar */
    .taas-sidebar {
        border-right: 1px solid #E5E7EB; background: #F9FAFB;
        display: flex; flex-direction: column; overflow: hidden;
    }
    .taas-sidebar-header {
        padding: 16px; border-bottom: 1px solid #E5E7EB; background: white;
    }
    .taas-sidebar-title { font-size: 14px; font-weight: 600; color: #374151; margin: 0; }
    .taas-sidebar-list { overflow-y: auto; flex: 1; }
    .taas-sidebar-empty { padding: 24px 16px; color: #9CA3AF; font-size: 13px; text-align: center; }
    .taas-sidebar-item {
        display: block; padding: 12px 16px; border-bottom: 1px solid #E5E7EB;
        text-decoration: none; color: inherit; transition: background 0.15s; cursor: pointer;
    }
    .taas-sidebar-item:hover { background: #DBEAFE; }
    .taas-sidebar-item-active { background: #DBEAFE; border-left: 3px solid #2563EB; }
    .taas-sidebar-item-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
    .taas-sidebar-id { font-size: 12px; font-weight: 600; color: #2563EB; }
    .taas-sidebar-badge {
        display: inline-flex; align-items: center; justify-content: center;
        min-width: 18px; height: 18px; padding: 0 5px;
        background: #2563EB; color: white; font-size: 10px; font-weight: 700; border-radius: 9px;
    }
    .taas-sidebar-tender-name {
        font-size: 13px; color: #374151; margin: 4px 0 0; line-height: 1.3;
        overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }

    /* Chat main area */
    .taas-chat-main { display: flex; flex-direction: column; overflow: hidden; }

    /* Messages thread */
    .taas-messages-thread {
        flex: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 16px;
    }

    /* Message rows */
    .taas-message-row { display: flex; gap: 10px; max-width: 85%; }
    .taas-message-agent { align-self: flex-start; }
    .taas-message-user { align-self: flex-end; }

    /* Avatars */
    .taas-avatar {
        width: 36px; height: 36px; border-radius: 50%; display: flex;
        align-items: center; justify-content: center; flex-shrink: 0;
    }
    .taas-avatar-agent { background: #DBEAFE; color: #2563EB; }
    .taas-avatar-user { background: #DBEAFE; color: #2563EB; }

    /* Bubbles */
    .taas-bubble { border-radius: 12px; padding: 10px 14px; min-width: 0; }
    .taas-bubble-agent { background: #F3F4F6; border: 1px solid #E5E7EB; border-top-left-radius: 4px; }
    .taas-bubble-user { background: #DBEAFE; border: 1px solid #BFDBFE; border-top-right-radius: 4px; }

    /* Message header */
    .taas-message-header { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
    .taas-sender-label { font-size: 12px; font-weight: 600; color: #374151; }
    .taas-message-time { font-size: 11px; color: #9CA3AF; }

    /* Message text */
    .taas-message-text { font-size: 14px; color: #1F2937; line-height: 1.5; margin: 0; white-space: pre-wrap; word-break: break-word; }

    /* File request card */
    .taas-file-request-card {
        background: #FEFCE8; border: 1px solid #FDE68A; border-radius: 8px;
        padding: 12px; margin-top: 6px;
    }
    .taas-file-request-icon { margin-bottom: 8px; }
    .taas-file-request-label { font-size: 12px; font-weight: 600; color: #2563EB; text-transform: uppercase; letter-spacing: 0.05em; }
    .taas-file-request-desc { font-size: 13px; color: #374151; margin: 4px 0 10px; line-height: 1.4; }
    .taas-file-upload-form { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    .taas-file-input { font-size: 12px; color: #6B7280; max-width: 200px; }
    .taas-upload-btn {
        display: inline-flex; align-items: center; gap: 6px;
        padding: 6px 14px; background: #2563EB; color: white; border: none;
        border-radius: 6px; font-size: 13px; font-weight: 500; cursor: pointer;
        transition: background 0.2s;
    }
    .taas-upload-btn:hover { background: #1E40AF; }

    /* Info request card */
    .taas-info-request-card { margin-top: 4px; }
    .taas-info-request-header { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
    .taas-info-request-label { font-size: 12px; font-weight: 600; color: #D97706; text-transform: uppercase; letter-spacing: 0.05em; }

    /* File upload indicator */
    .taas-file-upload-card { margin-top: 4px; }
    .taas-file-upload-indicator {
        display: inline-flex; align-items: center; gap: 6px;
        background: #F0FDF4; border: 1px solid #BBF7D0; border-radius: 6px;
        padding: 6px 10px; margin-bottom: 4px;
    }
    .taas-file-name { font-size: 13px; font-weight: 500; color: #166534; }

    /* Reply form */
    .taas-reply-form {
        padding: 12px 16px; border-top: 1px solid #E5E7EB; background: white;
    }
    .taas-reply-row { display: flex; gap: 8px; align-items: center; }
    .taas-reply-input {
        flex: 1; padding: 10px 14px; border: 1px solid #D1D5DB; border-radius: 8px;
        font-size: 14px; color: #1F2937; outline: none; transition: border-color 0.2s;
        background: #F9FAFB;
    }
    .taas-reply-input:focus { border-color: #2563EB; box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1); background: white; }
    .taas-reply-input::placeholder { color: #9CA3AF; }
    .taas-send-btn {
        display: inline-flex; align-items: center; gap: 6px;
        padding: 10px 20px; background: #2563EB; color: white; border: none;
        border-radius: 8px; font-size: 14px; font-weight: 600; cursor: pointer;
        transition: background 0.2s; white-space: nowrap;
    }
    .taas-send-btn:hover { background: #1E40AF; }
    .taas-send-btn svg { flex-shrink: 0; }

    /* Empty state */
    .taas-empty-state { text-align: center; padding: 48px 24px; }
    .taas-empty-title { font-size: 18px; font-weight: 600; color: #374151; margin: 16px 0 8px; }
    .taas-empty-desc { font-size: 14px; color: #6B7280; margin: 0; max-width: 360px; margin-left: auto; margin-right: auto; line-height: 1.5; }

    /* TaaS messages mobile responsive */
    @media (max-width: 768px) {
        .taas-messages-container { padding: 12px; }
        .taas-chat-layout {
            grid-template-columns: 1fr; min-height: auto; max-height: none;
        }
        .taas-sidebar {
            border-right: none; border-bottom: 1px solid #E5E7EB;
            max-height: 200px; overflow-y: auto;
        }
        .taas-sidebar-list { display: flex; overflow-x: auto; gap: 0; }
        .taas-sidebar-item {
            min-width: 160px; border-bottom: none; border-right: 1px solid #E5E7EB;
            flex-shrink: 0;
        }
        .taas-sidebar-item-active { border-left: none; border-bottom: 3px solid #2563EB; }
        .taas-messages-thread { min-height: 300px; max-height: 50vh; padding: 12px; }
        .taas-message-row { max-width: 95%; }
        .taas-reply-row { flex-wrap: wrap; }
        .taas-send-btn { width: 100%; justify-content: center; }
        .taas-send-btn span { display: inline; }
        .taas-page-title { font-size: 20px; }
    }

    @media (max-width: 480px) {
        .taas-avatar { width: 28px; height: 28px; }
        .taas-avatar svg { width: 16px; height: 16px; }
        .taas-bubble { padding: 8px 10px; }
        .taas-message-text { font-size: 13px; }
        .taas-file-input { max-width: 150px; }
    }

    /* ===== TAAS LANDING PAGE ===== */

    /* Layout */
    .taas-hero { padding-top: 9.5rem; padding-bottom: 4rem; background: #fff; border-bottom: 1px solid #F1F5F9; }
    .taas-hero .container { max-width: 1120px; margin: 0 auto; }
    .taas-hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
    .taas-hero-left .taas-hero-title { font-size: 2.8rem; max-width: 520px; }
    .taas-hero-left .taas-hero-subtitle { margin-bottom: 2rem; max-width: 460px; }

    /* Typography */
    .taas-hero-label, .taas-section-label {
        display: inline-block; text-transform: uppercase; font-size: 0.72rem; font-weight: 700;
        letter-spacing: 2px; color: #2563EB; background: #EFF6FF;
        padding: 0.3rem 0.75rem; border-radius: 6px; margin-bottom: 1rem;
    }
    .taas-hero-title, .taas-section-title {
        font-size: 2.25rem; font-weight: 800; line-height: 1.15; margin-bottom: 1rem;
        color: #0F172A; letter-spacing: -0.02em;
    }
    .taas-hero-subtitle, .taas-section-subtitle, .taas-market-subtitle, .taas-signup-subtitle {
        font-size: 1.05rem; color: #64748B; max-width: 560px; line-height: 1.7;
    }
    .taas-section-header { margin-bottom: 3rem; text-align: center; }
    .taas-section-header .taas-section-subtitle { margin: 0 auto; }
    .taas-text-left { text-align: left; }

    /* Buttons */
    .taas-btn-primary {
        display: inline-flex; align-items: center; gap: 0.5rem;
        background: linear-gradient(135deg, #2563EB, #1D4ED8); color: #fff;
        padding: 0.85rem 1.8rem; border-radius: 10px; text-decoration: none;
        font-weight: 600; font-size: 0.95rem; cursor: pointer; border: none;
        transition: transform 0.15s ease, box-shadow 0.2s ease;
        box-shadow: 0 1px 3px rgba(37,99,235,0.25);
    }
    .taas-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(37,99,235,0.3); }
    .taas-btn-secondary {
        display: inline-flex; align-items: center; gap: 0.5rem;
        border: 1.5px solid #CBD5E1; color: #475569; padding: 0.85rem 1.8rem;
        border-radius: 10px; text-decoration: none; font-weight: 600; font-size: 0.95rem;
        cursor: pointer; background: #fff; transition: border-color 0.2s ease, color 0.2s ease;
    }
    .taas-btn-secondary:hover { border-color: #2563EB; color: #2563EB; }
    .taas-btn-full { width: 100%; justify-content: center; }
    .taas-btn-outline {
        display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
        width: 100%; padding: 0.75rem; background: #fff; color: #2563EB;
        border: 1.5px solid #2563EB; border-radius: 10px; font-size: 0.92rem; font-weight: 600;
        cursor: pointer; text-decoration: none; transition: background 0.2s ease, color 0.2s ease;
    }
    .taas-btn-outline:hover { background: #2563EB; color: #fff; }

    /* Hero CTA */
    .taas-hero-cta-group { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
    .taas-hero-note { font-size: 0.82rem; color: #94A3B8; display: flex; align-items: center; gap: 0.25rem; }

    /* Hero Performance Card */
    .taas-perf-card {
        background: #fff; border-radius: 16px; border: 1px solid #E2E8F0;
        box-shadow: 0 4px 24px rgba(0,0,0,0.04), 0 1px 4px rgba(0,0,0,0.02); overflow: hidden;
    }
    .taas-perf-card-header {
        background: linear-gradient(135deg, #EFF6FF, #DBEAFE); padding: 1rem 1.5rem;
        display: flex; align-items: center; gap: 0.5rem; border-bottom: 1px solid #93C5FD;
    }
    .taas-perf-card-title { font-weight: 700; font-size: 0.82rem; color: #2563EB; letter-spacing: 1px; text-transform: uppercase; }
    .taas-perf-card-body { padding: 1.5rem; }
    .taas-perf-stat-row {
        display: flex; justify-content: space-between; align-items: center;
        padding: 0.85rem 0; border-bottom: 1px solid #F1F5F9;
    }
    .taas-perf-stat-row:last-child { border-bottom: none; }
    .taas-perf-icon { color: #2563EB; width: 20px; height: 20px; min-width: 20px; display: none; }
    .taas-perf-stat-content { display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; flex: 1; }
    .taas-perf-stat-label { font-size: 0.88rem; color: #64748B; font-weight: 500; }
    .taas-perf-comparison { display: flex; align-items: center; gap: 0.5rem; }
    .taas-perf-before { font-size: 1rem; font-weight: 500; color: #94A3B8; text-decoration: line-through; }
    .taas-perf-after { font-size: 1.15rem; font-weight: 700; color: #2563EB; }
    .taas-perf-highlight { font-size: 1.15rem; font-weight: 700; color: #2563EB; }

    /* Trust Strip */
    .taas-trust-strip { padding: 2.5rem 2rem; background: #fff; border-bottom: 1px solid #F1F5F9; }
    .taas-trust-grid {
        display: flex; align-items: center; justify-content: center; gap: 3rem; flex-wrap: wrap;
        max-width: 1120px; margin: 0 auto;
    }
    .taas-trust-badge { display: flex; align-items: center; gap: 0.5rem; font-size: 0.85rem; font-weight: 600; color: #475569; }
    .taas-trust-text { /* inherits from badge */ }

    /* Stats */
    .taas-stats-section { padding: 3.5rem 2rem; background: #F8FAFC; }
    .taas-stats-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; max-width: 1120px; margin: 0 auto; }
    .taas-stat-card {
        text-align: center; padding: 1.75rem 1rem; background: #fff;
        border: 1px solid #E2E8F0; border-radius: 12px;
        transition: transform 0.2s ease, box-shadow 0.2s ease; cursor: default;
    }
    .taas-stat-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,0.05); }
    .taas-stat-icon {
        width: 44px; height: 44px; margin: 0 auto 0.75rem; border-radius: 10px;
        background: #EFF6FF; display: flex; align-items: center; justify-content: center; color: #2563EB;
    }
    .taas-stat-number { display: block; font-size: 1.6rem; font-weight: 800; color: #0F172A; margin-bottom: 0.15rem; letter-spacing: -0.02em; text-align: center; }
    .taas-stat-label { display: block; font-size: 0.8rem; color: #94A3B8; font-weight: 500; text-align: center; }

    /* Testimonials */
    .taas-testimonials-section { background: #fff; border-bottom: 1px solid #F1F5F9; padding: 5.5rem 2rem; }
    .taas-testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; max-width: 1120px; margin: 0 auto; }
    .taas-testimonial-card {
        padding: 1.75rem; background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 14px;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
    .taas-testimonial-card:hover { border-color: #93C5FD; box-shadow: 0 4px 16px rgba(0,0,0,0.04); }
    .taas-testimonial-stars { color: #F59E0B; font-size: 0.85rem; margin-bottom: 0.85rem; letter-spacing: 2px; display: flex; gap: 2px; }
    .taas-testimonial-quote { font-size: 0.92rem; color: #334155; line-height: 1.65; margin-bottom: 1.25rem; font-style: italic; }
    .taas-testimonial-author { display: flex; align-items: center; gap: 0.75rem; }
    .taas-testimonial-avatar {
        width: 40px; height: 40px; border-radius: 50%;
        background: linear-gradient(135deg, #2563EB, #1D4ED8);
        display: flex; align-items: center; justify-content: center;
        color: #fff; font-weight: 700; font-size: 0.85rem;
    }
    .taas-testimonial-info { display: flex; flex-direction: column; }
    .taas-testimonial-name { font-size: 0.85rem; font-weight: 700; color: #0F172A; }
    .taas-testimonial-role { font-size: 0.78rem; color: #94A3B8; }

    /* Market Section */
    .taas-market-section { background: #F8FAFC; padding: 5.5rem 2rem; }
    .taas-market-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; max-width: 1120px; margin: 0 auto; }
    .taas-market-left .taas-market-subtitle { margin-bottom: 2rem; }
    .taas-market-big-stats { display: flex; gap: 2.5rem; }
    .taas-market-big-stat { display: block; font-size: 2rem; font-weight: 800; color: #2563EB; letter-spacing: -0.02em; }
    .taas-market-big-label { display: block; font-size: 0.82rem; color: #94A3B8; font-weight: 500; }
    .taas-market-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
    .taas-market-tile {
        padding: 1.4rem; background: #fff; border: 1px solid #E2E8F0; border-radius: 12px;
        transition: border-color 0.2s ease, transform 0.2s ease; cursor: default;
    }
    .taas-market-tile:hover { border-color: #60A5FA; transform: translateY(-2px); }
    .taas-market-tile-value { display: block; font-size: 1.35rem; font-weight: 800; color: #0F172A; margin-bottom: 0.1rem; letter-spacing: -0.01em; }
    .taas-market-tile-label { display: block; font-size: 0.8rem; color: #64748B; }

    /* How It Works Timeline */
    .taas-how-section { background: #fff; border-bottom: 1px solid #F1F5F9; padding: 5.5rem 2rem; }
    .taas-timeline { position: relative; max-width: 680px; margin: 0 auto; }
    .taas-timeline::before {
        content: ''; position: absolute; left: 27px; top: 30px; bottom: 30px;
        width: 2px; background: linear-gradient(180deg, #60A5FA, #E2E8F0); border-radius: 2px;
    }
    .taas-timeline-item { display: flex; gap: 1.5rem; margin-bottom: 2rem; position: relative; }
    .taas-timeline-item-last { margin-bottom: 0; }
    .taas-timeline-dot {
        width: 56px; height: 56px; min-width: 56px; border-radius: 50%;
        background: linear-gradient(135deg, #2563EB, #1D4ED8);
        display: flex; align-items: center; justify-content: center;
        z-index: 1; box-shadow: 0 2px 8px rgba(37,99,235,0.25);
    }
    .taas-timeline-number { font-weight: 700; font-size: 1.1rem; color: #fff; }
    .taas-timeline-card {
        background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 12px;
        padding: 1.25rem 1.5rem; flex: 1;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
    .taas-timeline-card:hover { border-color: #60A5FA; box-shadow: 0 4px 16px rgba(0,0,0,0.04); }
    .taas-timeline-icon { color: #2563EB; margin-bottom: 0.5rem; }
    .taas-timeline-title { font-size: 1rem; font-weight: 700; color: #0F172A; margin-bottom: 0.3rem; }
    .taas-timeline-desc { font-size: 0.88rem; color: #64748B; line-height: 1.6; }

    /* FAQ */
    .taas-faq-section { background: #F8FAFC; padding: 5.5rem 2rem; }
    .taas-faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; max-width: 900px; margin: 0 auto; }
    .taas-faq-card {
        padding: 1.5rem; background: #fff; border: 1px solid #E2E8F0; border-radius: 12px;
    }
    .taas-faq-header { display: flex; align-items: center; }
    .taas-faq-question { font-size: 0.92rem; font-weight: 700; color: #0F172A; }
    .taas-faq-answer-text { font-size: 0.85rem; color: #64748B; line-height: 1.6; padding-top: 0.75rem; }

    /* Security */
    .taas-security-section { background: #fff; border-bottom: 1px solid #F1F5F9; padding: 5.5rem 2rem; }
    .taas-security-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: flex-start; max-width: 1120px; margin: 0 auto; }
    .taas-security-left .taas-section-subtitle { margin-bottom: 1.5rem; }
    .taas-security-badges { display: flex; gap: 0.75rem; flex-wrap: wrap; }
    .taas-security-badge {
        display: flex; align-items: center; gap: 0.4rem;
        padding: 0.45rem 0.85rem; background: #EFF6FF; border-radius: 8px;
        font-size: 0.78rem; font-weight: 600; color: #2563EB;
    }
    .taas-security-badge-text { /* inherits */ }
    .taas-security-right { display: flex; flex-direction: column; gap: 0.85rem; }
    .taas-security-detail-item {
        display: flex; gap: 0.85rem; align-items: flex-start;
        padding: 1.1rem 1.25rem; background: #F8FAFC; border: 1px solid #E2E8F0;
        border-radius: 10px; transition: border-color 0.2s ease;
    }
    .taas-security-detail-item:hover { border-color: #60A5FA; }
    .taas-security-detail-icon { color: #2563EB; min-width: 20px; margin-top: 0.2rem; }
    .taas-security-detail-content { display: flex; flex-direction: column; }
    .taas-security-detail-title { font-size: 0.9rem; font-weight: 700; color: #0F172A; margin-bottom: 0.15rem; }
    .taas-security-detail-desc { font-size: 0.82rem; color: #64748B; }

    /* Founder */
    .taas-founder-section { background: #F8FAFC; border-bottom: 1px solid #E2E8F0; padding: 5.5rem 2rem; }
    .taas-founder-wrapper { max-width: 1120px; margin: 0 auto; }
    .taas-founder-card {
        max-width: 720px; margin: 0 auto; display: flex; flex-direction: column; gap: 1.25rem; align-items: center; text-align: center;
        background: #fff; border: 1px solid #E2E8F0; border-radius: 14px; padding: 2rem;
    }
    .taas-founder-avatar {
        width: 80px; height: 80px; min-width: 80px; border-radius: 50%;
        background: linear-gradient(135deg, #2563EB, #1D4ED8);
        display: flex; align-items: center; justify-content: center;
        margin: 0 auto;
    }
    .taas-founder-avatar-letter { color: #fff; font-weight: 800; font-size: 1.5rem; }
    .taas-founder-name { font-size: 1.1rem; font-weight: 700; color: #0F172A; margin-bottom: 0.15rem; text-align: center; }
    .taas-founder-location { font-size: 0.85rem; color: #2563EB; font-weight: 600; margin-bottom: 0.5rem; text-align: center; }
    .taas-founder-desc { font-size: 0.9rem; color: #64748B; line-height: 1.6; text-align: center; }
    .taas-founder-link { color: #2563EB; text-decoration: none; font-weight: 600; font-size: 0.85rem; display: inline-flex; align-items: center; gap: 0.35rem; margin-top: 0.75rem; justify-content: center; }

    /* Signup */
    .taas-signup-section { background: #fff; padding: 5.5rem 2rem; }
    .taas-signup-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: 3rem; align-items: flex-start; max-width: 1120px; margin: 0 auto; }
    .taas-signup-left .taas-section-title { font-size: 2rem; }
    .taas-signup-left .taas-signup-subtitle { margin-bottom: 1.5rem; }
    .taas-signup-benefits { list-style: none; display: flex; flex-direction: column; gap: 0.65rem; padding: 0; margin: 0; }
    .taas-signup-benefit-item { display: flex; align-items: center; gap: 0.6rem; font-size: 0.9rem; color: #475569; font-weight: 500; }
    .taas-signup-appeal-note { margin-top: 1.25rem; font-size: 0.88rem; color: #64748B; }
    .taas-signup-appeal-link { color: #2563EB; font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: 0.3rem; }
    .taas-signup-appeal-link:hover { text-decoration: underline; }
    .taas-signup-form-card {
        background: #F8FAFC; border-radius: 14px; padding: 2rem;
        border: 1px solid #E2E8F0; box-shadow: 0 4px 20px rgba(0,0,0,0.04);
    }
    .taas-signup-form-title { font-size: 1.1rem; font-weight: 700; color: #0F172A; margin-bottom: 1.25rem; }
    .taas-signup-form { display: flex; flex-direction: column; }
    .taas-form-group { margin-bottom: 1.1rem; }
    .taas-form-label { display: block; font-size: 0.82rem; font-weight: 600; color: #334155; margin-bottom: 0.35rem; }
    .taas-form-input, .taas-form-textarea {
        width: 100%; padding: 0.7rem 0.9rem; border: 1px solid #CBD5E1; border-radius: 8px;
        font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
        font-size: 0.92rem; color: #0F172A; background: #fff;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
    .taas-form-input::placeholder, .taas-form-textarea::placeholder { color: #94A3B8; }
    .taas-form-input:focus, .taas-form-textarea:focus {
        outline: none; border-color: #2563EB; box-shadow: 0 0 0 3px rgba(37,99,235,0.12);
    }
    .taas-form-textarea { resize: vertical; min-height: 72px; }
    .taas-form-checkbox-group { display: flex; gap: 0.6rem; flex-wrap: wrap; margin-top: 0.3rem; }
    .taas-form-checkbox-wrapper {
        display: flex; align-items: center; gap: 0.35rem; font-size: 0.85rem; color: #475569;
        background: #fff; padding: 0.35rem 0.65rem; border-radius: 6px;
        border: 1px solid #E2E8F0; cursor: pointer; transition: border-color 0.2s ease;
    }
    .taas-form-checkbox-wrapper:hover { border-color: #60A5FA; }
    .taas-form-checkbox-disabled { opacity: 0.6; cursor: not-allowed; }
    .taas-form-checkbox { accent-color: #2563EB; width: 15px; height: 15px; cursor: pointer; }
    .taas-form-checkbox-label { font-size: 0.85rem; }
    .taas-form-soon-tag { font-size: 0.68rem; color: #94A3B8; font-style: italic; }
    .taas-divider { display: flex; align-items: center; gap: 0.75rem; margin: 1.25rem 0; }
    .taas-divider-line { flex: 1; height: 1px; background: #E2E8F0; }
    .taas-divider-text { color: #94A3B8; font-size: 0.78rem; font-weight: 500; }
    .taas-signup-footer-text { text-align: center; margin-top: 1.25rem; font-size: 0.8rem; color: #94A3B8; }

    /* Form success */
    .taas-success-card { text-align: center; padding: 2.5rem 1rem; }
    .taas-success-icon {
        width: 64px; height: 64px; margin: 0 auto 1rem; border-radius: 50%;
        background: #EFF6FF; display: flex; align-items: center; justify-content: center; color: #2563EB;
    }
    .taas-success-title { font-size: 1.25rem; font-weight: 700; color: #0F172A; margin-bottom: 0.5rem; }
    .taas-success-message { font-size: 0.92rem; color: #64748B; line-height: 1.6; margin-bottom: 1.5rem; }

    /* Form validation */
    .taas-form-input:invalid:not(:placeholder-shown) { border-color: #EF4444; }
    .taas-form-input:valid:not(:placeholder-shown) { border-color: #2563EB; }

    /* Responsive */
    @media (max-width: 900px) {
        .taas-hero-grid, .taas-market-grid, .taas-security-grid, .taas-signup-grid { grid-template-columns: 1fr; gap: 2.5rem; }
        .taas-hero .taas-hero-title { font-size: 2.2rem; }
        .taas-hero { padding-top: 7rem; }
        .taas-section-title { font-size: 1.8rem; }
        .taas-stats-grid { grid-template-columns: repeat(2, 1fr); }
        .taas-market-tiles { grid-template-columns: 1fr 1fr; }
        .taas-market-big-stats { flex-direction: column; gap: 1rem; }
        .taas-testimonials-grid { grid-template-columns: 1fr; }
        .taas-faq-grid { grid-template-columns: 1fr; }
        .taas-founder-card { flex-direction: column; text-align: center; }
        .taas-perf-card { margin-top: 1rem; }
    }
    @media (max-width: 560px) {
        .taas-stats-grid { grid-template-columns: 1fr; gap: 0.75rem; }
        .taas-market-tiles { grid-template-columns: 1fr; }
        .taas-trust-grid { flex-direction: column; gap: 1rem; }
        .taas-hero-cta-group { flex-direction: column; }
        .taas-hero-cta-group .taas-btn-primary,
        .taas-hero-cta-group .taas-btn-secondary { width: 100%; justify-content: center; }
        .taas-hero .taas-hero-title { font-size: 1.8rem; }
        .taas-section-title { font-size: 1.5rem; }
        .taas-perf-stat-row { flex-direction: column; align-items: flex-start; gap: 0.25rem; }
        .taas-signup-grid { gap: 1.5rem; }
        .taas-signup-form-card { padding: 1.25rem; }
        .taas-testimonial-quote { font-size: 0.85rem; }
        .taas-faq-question { font-size: 0.85rem; }
    }

    /* ==================== TAAS APPEAL & COMPLAINTS PAGE ==================== */

    /* Cross-link banner */
    .taas-appeal-cross-link {
        background: #EFF6FF; text-align: center; padding: 0.5rem 1rem;
        font-size: 0.82rem; color: #475569;
    }
    .taas-appeal-cross-link a { color: #2563EB; font-weight: 600; text-decoration: none; }
    .taas-appeal-cross-link a:hover { text-decoration: underline; }

    /* Section label / title / subtitle (shared) */
    .taas-appeal-section-label {
        display: inline-block; text-transform: uppercase;
        font-size: 0.72rem; font-weight: 700; letter-spacing: 2px;
        color: #2563EB; background: #EFF6FF;
        padding: 0.3rem 0.75rem; border-radius: 6px; margin-bottom: 1rem;
    }
    .taas-appeal-section-title {
        font-size: 2.25rem; font-weight: 800; line-height: 1.15;
        margin-bottom: 1rem; color: #0F172A; letter-spacing: -0.02em;
    }
    .taas-appeal-section-subtitle { font-size: 1.05rem; color: #64748B; max-width: 560px; line-height: 1.7; }
    .taas-appeal-section-header { margin-bottom: 3rem; }
    .taas-appeal-section-header.center { text-align: center; }
    .taas-appeal-section-header.center .taas-appeal-section-subtitle { margin: 0 auto; }

    /* Buttons */
    .taas-appeal-btn-primary {
        display: inline-flex; align-items: center; gap: 0.5rem;
        background: linear-gradient(135deg, #2563EB, #1D4ED8);
        color: #fff; padding: 0.85rem 1.8rem; border-radius: 10px;
        text-decoration: none; font-weight: 600; font-size: 0.95rem;
        transition: transform 0.15s ease, box-shadow 0.2s ease;
        cursor: pointer; box-shadow: 0 1px 3px rgba(37,99,235,0.25); border: none;
        white-space: nowrap;
    }
    .taas-appeal-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(37,99,235,0.3); }
    .taas-appeal-btn-secondary {
        display: inline-flex; align-items: center; gap: 0.5rem;
        border: 1.5px solid #CBD5E1; color: #475569;
        padding: 0.85rem 1.8rem; border-radius: 10px;
        text-decoration: none; font-weight: 600; font-size: 0.95rem;
        transition: border-color 0.2s ease, color 0.2s ease; cursor: pointer; background: #fff;
        white-space: nowrap;
    }
    .taas-appeal-btn-secondary:hover { border-color: #2563EB; color: #2563EB; }

    /* ===== HERO ===== */
    .taas-appeal-hero {
        padding-top: 7rem; padding-bottom: 4rem;
        background: #fff; border-bottom: 1px solid #F1F5F9;
    }
    .taas-appeal-hero-split {
        display: grid; grid-template-columns: 1.1fr 1fr;
        gap: 5rem; align-items: center;
    }

    /* Scenario box */
    .taas-appeal-scenario-box {
        background: #F8FAFC; border: 1px solid #E2E8F0;
        border-radius: 16px; padding: 1.75rem 2rem;
        box-shadow: 0 4px 24px rgba(0,0,0,0.03);
    }
    .taas-appeal-scenario-label {
        display: inline-flex; align-items: center; gap: 0.4rem;
        font-size: 0.72rem; font-weight: 600; color: #94A3B8;
        text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 0.85rem;
    }
    .taas-appeal-scenario-label i { font-size: 0.7rem; }
    .taas-appeal-scene {
        font-size: 0.95rem; color: #475569; line-height: 1.8; margin-bottom: 0.85rem;
    }
    .taas-appeal-scene em { font-style: italic; color: #0F172A; font-weight: 600; }
    .taas-appeal-alert-box {
        background: #FEF2F2; padding: 0.85rem 1.1rem; border-radius: 10px;
        border-left: 4px solid #EF4444; margin-bottom: 0.75rem;
    }
    .taas-appeal-alert-box p { font-size: 0.88rem; color: #475569; font-weight: 500; margin: 0; }
    .taas-appeal-alert-box p i { color: #EF4444; margin-right: 0.35rem; }
    .taas-appeal-insight-box {
        background: #EFF6FF; padding: 0.85rem 1.1rem; border-radius: 10px;
        border-left: 4px solid #2563EB;
    }
    .taas-appeal-insight-box p { font-size: 0.88rem; color: #475569; font-weight: 500; margin: 0; }
    .taas-appeal-insight-box p i { color: #2563EB; margin-right: 0.35rem; }

    /* Hero CTA side */
    .taas-appeal-hero-cta-side { text-align: left; }
    .taas-appeal-hero-title { font-size: 2.4rem; max-width: 480px; margin-bottom: 0.75rem; font-weight: 800; line-height: 1.15; color: #0F172A; letter-spacing: -0.02em; }
    .taas-appeal-hero-title em { font-style: normal; color: #2563EB; }
    .taas-appeal-hero-subtitle { max-width: 440px; margin-bottom: 1.75rem; font-size: 1.05rem; color: #64748B; line-height: 1.7; }

    /* Stats mini-cards */
    .taas-appeal-hero-stats {
        display: grid; grid-template-columns: 1fr 1fr;
        gap: 0.65rem; margin-bottom: 1.75rem;
    }
    .taas-appeal-stat {
        text-align: left; padding: 0.65rem 0.85rem;
        background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 8px;
    }
    .taas-appeal-stat-val {
        font-size: 1.2rem; font-weight: 800; color: #2563EB;
        display: block; letter-spacing: -0.02em;
    }
    .taas-appeal-stat-lbl { font-size: 0.75rem; color: #64748B; display: block; }
    .taas-appeal-hero-cta-group {
        display: flex; gap: 0.75rem; flex-wrap: nowrap; align-items: center;
    }

    /* ===== GROUNDS ===== */
    .taas-appeal-grounds-section { background: #F8FAFC; padding: 5.5rem 2rem; }
    .taas-appeal-grounds-grid {
        display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 1.25rem;
    }
    .taas-appeal-ground-card {
        background: #fff; border: 1px solid #E2E8F0; border-radius: 12px;
        padding: 1.5rem; transition: border-color 0.2s ease, box-shadow 0.2s ease;
        overflow: visible; height: auto; min-height: 0;
    }
    .taas-appeal-ground-card:hover { border-color: #60A5FA; box-shadow: 0 4px 16px rgba(0,0,0,0.04); }
    .taas-appeal-gc-top { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.65rem; }
    .taas-appeal-gc-icon {
        width: 40px; height: 40px; min-width: 40px; border-radius: 10px;
        display: flex; align-items: center; justify-content: center;
        background: #EFF6FF; color: #2563EB; font-size: 0.95rem;
    }
    .taas-appeal-gc-title { font-size: 0.95rem; font-weight: 700; color: #0F172A; margin: 0; }
    .taas-appeal-gc-desc { font-size: 0.88rem; color: #64748B; margin-bottom: 0.65rem; line-height: 1.6; display: block; }
    .taas-appeal-gc-example {
        font-size: 0.82rem; color: #64748B; background: #F8FAFC;
        padding: 0.65rem 0.85rem; border-radius: 8px;
        border-left: 3px solid #CBD5E1; font-style: italic;
        display: block;
    }
    .taas-appeal-grounds-cta { text-align: center; margin-top: 2.5rem; }

    /* ===== CENTER ALTERNATING TIMELINE ===== */
    .taas-appeal-process-section {
        background: #fff; border-top: 1px solid #E2E8F0; border-bottom: 1px solid #E2E8F0;
        padding: 5.5rem 2rem;
    }
    .taas-appeal-timeline { position: relative; max-width: 820px; margin: 0 auto; }
    .taas-appeal-timeline::before {
        content: ''; position: absolute;
        left: 50%; transform: translateX(-50%);
        top: 0; bottom: 0; width: 3px;
        background: linear-gradient(to bottom, #EF4444, #F59E0B, #2563EB, #059669);
        border-radius: 3px;
    }
    .taas-appeal-tl-item {
        display: flex; align-items: flex-start;
        margin-bottom: 2.5rem; position: relative;
    }
    .taas-appeal-tl-item:last-child { margin-bottom: 0; }
    .taas-appeal-tl-item:nth-child(odd) { flex-direction: row-reverse; text-align: right; }
    .taas-appeal-tl-content {
        width: calc(50% - 48px);
        background: #F8FAFC; border: 1px solid #E2E8F0; border-radius: 12px;
        padding: 1.25rem 1.5rem;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
    .taas-appeal-tl-content:hover { border-color: #60A5FA; box-shadow: 0 4px 16px rgba(0,0,0,0.04); }
    .taas-appeal-tl-item:nth-child(odd) .taas-appeal-tl-content { margin-right: auto; }
    .taas-appeal-tl-item:nth-child(even) .taas-appeal-tl-content { margin-left: auto; }
    .taas-appeal-tl-title {
        font-size: 1rem; font-weight: 700; color: #0F172A; margin-bottom: 0.3rem; margin-top: 0;
        display: flex; align-items: center; gap: 0.4rem;
    }
    .taas-appeal-tl-item:nth-child(odd) .taas-appeal-tl-title { flex-direction: row-reverse; }
    .taas-appeal-tl-desc { font-size: 0.88rem; color: #64748B; line-height: 1.6; margin: 0; }
    .taas-appeal-tl-dot {
        position: absolute; left: 50%; transform: translateX(-50%);
        width: 48px; height: 48px; border-radius: 50%;
        display: flex; align-items: center; justify-content: center;
        font-weight: 700; font-size: 1rem; color: #fff; z-index: 2;
    }
    .taas-appeal-tl-dot.urgent { background: #EF4444; box-shadow: 0 2px 10px rgba(239,68,68,0.35); }
    .taas-appeal-tl-dot.work { background: #F59E0B; box-shadow: 0 2px 10px rgba(245,158,11,0.35); }
    .taas-appeal-tl-dot.purple { background: linear-gradient(135deg, #2563EB, #1D4ED8); box-shadow: 0 2px 10px rgba(37,99,235,0.3); }
    .taas-appeal-tl-dot.success { background: #059669; box-shadow: 0 2px 10px rgba(5,150,105,0.35); }

    /* ===== COUNTRIES ===== */
    .taas-appeal-countries-section { background: #F8FAFC; padding: 5.5rem 2rem; }
    .taas-appeal-country-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; max-width: 860px; margin: 0 auto; }
    .taas-appeal-country-card {
        border: 1px solid #E2E8F0; border-radius: 14px; padding: 1.75rem;
        background: #fff; transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
    .taas-appeal-country-card:hover { border-color: #60A5FA; box-shadow: 0 4px 16px rgba(0,0,0,0.04); }
    .taas-appeal-cc-flag { font-size: 2rem; margin-bottom: 0.5rem; }
    .taas-appeal-cc-name { font-size: 1.1rem; font-weight: 800; color: #0F172A; margin-bottom: 0.1rem; margin-top: 0; }
    .taas-appeal-cc-sub { font-size: 0.8rem; color: #94A3B8; margin-bottom: 0.65rem; }
    .taas-appeal-deadline-badge {
        display: inline-flex; align-items: center; gap: 0.4rem;
        background: #FEF2F2; border: 1px solid #FECACA; color: #DC2626;
        padding: 0.3rem 0.75rem; border-radius: 6px;
        font-size: 0.78rem; font-weight: 700; margin-bottom: 0.75rem;
    }
    .taas-appeal-cc-detail {
        display: flex; align-items: flex-start; gap: 0.6rem;
        margin-bottom: 0.6rem; font-size: 0.87rem; color: #64748B;
    }
    .taas-appeal-cc-detail i { color: #2563EB; min-width: 16px; margin-top: 0.2rem; }
    .taas-appeal-coming-soon-bar {
        text-align: center; margin-top: 1.25rem; padding: 0.85rem;
        border: 1px dashed #CBD5E1; border-radius: 10px;
        color: #94A3B8; font-size: 0.88rem; max-width: 860px; margin-left: auto; margin-right: auto;
    }
    .taas-appeal-coming-soon-bar i { color: #2563EB; margin-right: 0.35rem; }

    /* ===== PRICING ===== */
    .taas-appeal-pricing-section { background: #fff; border-bottom: 1px solid #E2E8F0; padding: 5.5rem 2rem; }
    .taas-appeal-pricing-wrapper { max-width: 660px; margin: 0 auto; }
    .taas-appeal-price-card {
        border: 2px solid #2563EB; border-radius: 16px; overflow: hidden; background: #fff;
    }
    .taas-appeal-price-head {
        background: linear-gradient(135deg, #2563EB, #1D4ED8);
        color: #fff; padding: 1.75rem 2rem; text-align: center;
    }
    .taas-appeal-price-head-title { font-size: 1.5rem; font-weight: 800; margin: 0 0 0.25rem; color: #fff; }
    .taas-appeal-price-head-desc { font-size: 0.92rem; opacity: 0.85; margin: 0; color: #fff; }
    .taas-appeal-price-body { padding: 1.75rem 2rem; }
    .taas-appeal-price-item {
        display: flex; align-items: flex-start; gap: 0.75rem;
        margin-bottom: 1rem; font-size: 0.92rem; color: #475569;
    }
    .taas-appeal-price-item i { color: #059669; margin-top: 0.2rem; min-width: 18px; }
    .taas-appeal-price-item strong { color: #0F172A; }
    .taas-appeal-guarantee-box {
        background: #EFF6FF; border: 1px solid #93C5FD; border-radius: 10px;
        padding: 1rem; margin-top: 1.25rem; text-align: center;
        font-size: 0.88rem; color: #475569;
    }
    .taas-appeal-guarantee-box i { color: #2563EB; margin-right: 0.35rem; }
    .taas-appeal-guarantee-box strong { color: #0F172A; }

    /* ===== URGENCY / CONTACT ===== */
    .taas-appeal-urgency-section {
        background: #F8FAFC; border-bottom: 1px solid #E2E8F0; text-align: center;
        padding: 5.5rem 2rem;
    }
    .taas-appeal-urgency-inner {
        max-width: 680px; margin: 0 auto;
        background: #fff; border: 1px solid #E2E8F0;
        border-radius: 20px; padding: 3rem 2.5rem;
    }
    .taas-appeal-urgency-badge {
        display: inline-flex; align-items: center; gap: 0.5rem;
        background: #FEF2F2; border: 1px solid #FECACA;
        color: #DC2626; padding: 0.45rem 1.1rem; border-radius: 100px;
        font-size: 0.78rem; font-weight: 700; text-transform: uppercase;
        letter-spacing: 1.5px; margin-bottom: 1.25rem;
    }
    .taas-appeal-urgency-title {
        font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 800;
        margin-bottom: 0.5rem; color: #0F172A;
    }
    .taas-appeal-urgency-sub {
        color: #64748B; max-width: 520px;
        margin: 0 auto 1.75rem; font-size: 0.95rem;
    }
    .taas-appeal-timer-boxes {
        display: flex; justify-content: center; gap: 0.85rem; margin-bottom: 2rem;
    }
    .taas-appeal-timer-box {
        background: #F8FAFC; border: 1px solid #E2E8F0;
        border-radius: 12px; padding: 0.85rem 1.1rem; text-align: center; min-width: 72px;
    }
    .taas-appeal-timer-num { display: block; font-size: 1.6rem; font-weight: 900; color: #EF4444; }
    .taas-appeal-timer-lbl { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 1px; color: #94A3B8; }

    /* Contact form */
    .taas-appeal-contact-form {
        display: grid; grid-template-columns: 1fr 1fr;
        gap: 0.75rem; max-width: 520px; margin: 0 auto; text-align: left;
    }
    .taas-appeal-form-field { }
    .taas-appeal-form-label {
        display: block; font-size: 0.78rem; font-weight: 600;
        color: #334155; margin-bottom: 0.25rem;
    }
    .taas-appeal-form-input,
    .taas-appeal-form-textarea {
        width: 100%; background: #fff; border: 1px solid #CBD5E1;
        border-radius: 8px; padding: 0.7rem 0.9rem; color: #0F172A;
        font-family: 'Plus Jakarta Sans', sans-serif; font-size: 0.9rem;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
    .taas-appeal-form-input::placeholder,
    .taas-appeal-form-textarea::placeholder { color: #94A3B8; }
    .taas-appeal-form-input:focus,
    .taas-appeal-form-textarea:focus {
        outline: none; border-color: #2563EB;
        box-shadow: 0 0 0 3px rgba(37,99,235,0.12);
    }
    .taas-appeal-span-full { grid-column: 1 / -1; }
    .taas-appeal-submit-btn {
        display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
        background: linear-gradient(135deg, #2563EB, #1D4ED8);
        color: #fff; padding: 0.85rem 1.5rem;
        border-radius: 10px; font-weight: 700; font-size: 0.95rem;
        border: none; cursor: pointer; width: 100%;
        transition: transform 0.15s ease, box-shadow 0.2s ease;
        font-family: 'Plus Jakarta Sans', sans-serif;
        box-shadow: 0 1px 3px rgba(37,99,235,0.25);
    }
    .taas-appeal-submit-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(37,99,235,0.3); }
    .taas-appeal-submit-btn:disabled { opacity: 0.7; cursor: not-allowed; transform: none; }
    .taas-appeal-resp-note { margin-top: 0.85rem; font-size: 0.82rem; color: #94A3B8; text-align: center; }

    /* Urgency quote */
    .taas-appeal-urgency-quote {
        font-size: 1rem; color: #64748B; font-style: italic;
        max-width: 500px; margin: 1.5rem auto 0; line-height: 1.7;
        padding-top: 1.25rem; border-top: 1px solid #E2E8F0;
    }
    .taas-appeal-urgency-quote strong { color: #0F172A; font-style: normal; }

    /* Form success */
    .taas-appeal-form-success { text-align: center; padding: 2rem 1rem; }
    .taas-appeal-form-success-icon {
        width: 64px; height: 64px; margin: 0 auto 1rem; border-radius: 50%;
        background: #EFF6FF; display: flex; align-items: center;
        justify-content: center; color: #2563EB; font-size: 1.5rem;
    }
    .taas-appeal-form-success-title { font-size: 1.25rem; font-weight: 700; color: #0F172A; margin-bottom: 0.5rem; }
    .taas-appeal-form-success-desc { font-size: 0.92rem; color: #64748B; line-height: 1.6; }

    /* ===== FAQ ===== */
    .taas-appeal-faq-section { background: #fff; padding: 5.5rem 2rem; }
    .taas-appeal-faq-list { max-width: 720px; margin: 0 auto; }
    .taas-appeal-faq-item {
        border: 1px solid #E2E8F0; border-radius: 10px;
        margin-bottom: 0.65rem; background: #F8FAFC; overflow: hidden;
    }
    .taas-appeal-faq-q {
        padding: 1rem 1.25rem; cursor: pointer;
        display: flex; justify-content: space-between; align-items: center;
        font-weight: 600; font-size: 0.92rem; color: #0F172A;
        transition: color 0.2s ease;
    }
    .taas-appeal-faq-q:hover { color: #2563EB; }
    .taas-appeal-faq-q:focus-visible { outline: 2px solid #2563EB; outline-offset: 2px; border-radius: 8px; }
    .taas-appeal-faq-q i { transition: transform 0.3s; color: #94A3B8; font-size: 0.8rem; }
    .taas-appeal-faq-item.open .taas-appeal-faq-q i { transform: rotate(180deg); color: #2563EB; }
    .taas-appeal-faq-a { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }
    .taas-appeal-faq-item.open .taas-appeal-faq-a { max-height: 500px; }
    .taas-appeal-faq-a p { padding: 0 1.25rem 1rem; font-size: 0.88rem; color: #64748B; line-height: 1.7; margin: 0; }

    /* ===== RESPONSIVE ===== */
    @media (max-width: 900px) {
        .taas-appeal-hero-split { grid-template-columns: 1fr; gap: 2.5rem; }
        .taas-appeal-hero-title { font-size: 2rem; }
        .taas-appeal-hero-cta-side { text-align: center; }
        .taas-appeal-hero-subtitle { margin: 0 auto 1.5rem; }
        .taas-appeal-hero-stats { justify-items: center; }
        .taas-appeal-stat { text-align: center; }
        .taas-appeal-hero-cta-group { justify-content: center; flex-wrap: wrap; }
        .taas-appeal-grounds-grid { grid-template-columns: 1fr; }
        .taas-appeal-ground-card { overflow: visible; height: auto; }
        .taas-appeal-gc-desc { display: block; }
        .taas-appeal-gc-example { display: block; }
        .taas-appeal-country-grid { grid-template-columns: 1fr; }
        .taas-appeal-contact-form { grid-template-columns: 1fr; }
        .taas-appeal-timer-boxes { flex-wrap: wrap; }
        .taas-appeal-urgency-inner { padding: 2rem 1.5rem; }
        .taas-appeal-section-title { font-size: 1.8rem; }
        .taas-appeal-hero { padding-top: 5rem; }
        .taas-appeal-grounds-section,
        .taas-appeal-process-section,
        .taas-appeal-countries-section,
        .taas-appeal-pricing-section,
        .taas-appeal-urgency-section,
        .taas-appeal-faq-section { padding: 4rem 1.25rem; }
        .taas-appeal-timeline::before { left: 22px; transform: none; }
        .taas-appeal-tl-item, .taas-appeal-tl-item:nth-child(odd) {
            flex-direction: column; align-items: flex-start; padding-left: 56px;
            text-align: left;
        }
        .taas-appeal-tl-item:nth-child(odd) .taas-appeal-tl-content { text-align: left; }
        .taas-appeal-tl-item:nth-child(odd) .taas-appeal-tl-title { flex-direction: row; justify-content: flex-start; }
        .taas-appeal-tl-content { width: 100%; }
        .taas-appeal-tl-dot { left: 22px; transform: translateX(-50%); width: 40px; height: 40px; font-size: 0.85rem; }
    }
    @media (max-width: 560px) {
        .taas-appeal-scenario-box { padding: 1.5rem; }
        .taas-appeal-hero-cta-group { flex-direction: column; }
        .taas-appeal-hero-cta-group .taas-appeal-btn-primary,
        .taas-appeal-hero-cta-group .taas-appeal-btn-secondary { width: 100%; justify-content: center; }
        .taas-appeal-cross-link { font-size: 0.78rem; }
        .taas-appeal-hero-title { font-size: 1.8rem; }
        .taas-appeal-section-title { font-size: 1.5rem; }
    }

    /* ==================== FEATURE INFO PAGES ==================== */

    /* Hero */
    .fp-hero {
        padding-top: 9.5rem; padding-bottom: 4rem;
        background: linear-gradient(180deg, #EFF6FF 0%, #fff 100%);
        border-bottom: 1px solid #F1F5F9;
    }
    .fp-hero .container { max-width: 800px; margin: 0 auto; text-align: center; }
    .fp-hero-grid { display: flex; flex-direction: column; align-items: center; }
    .fp-hero-content { display: flex; flex-direction: column; align-items: center; }
    .fp-hero-icon {
        width: 64px; height: 64px; border-radius: 16px;
        background: linear-gradient(135deg, #2563EB, #1D4ED8);
        display: flex; align-items: center; justify-content: center;
        color: #fff; margin-bottom: 1.25rem;
        box-shadow: 0 4px 16px rgba(37,99,235,0.25);
    }
    .fp-hero-title {
        font-size: 2.6rem; font-weight: 800; line-height: 1.15;
        margin-bottom: 1rem; color: #0F172A; letter-spacing: -0.02em;
        max-width: 700px;
    }
    .fp-hero-subtitle {
        font-size: 1.1rem; color: #64748B; max-width: 600px;
        line-height: 1.7; margin-bottom: 2rem;
    }
    .fp-hero-cta-group {
        display: flex; gap: 0.75rem; flex-wrap: wrap;
        justify-content: center;
    }

    /* Section common */
    .fp-section-label {
        display: inline-block; text-transform: uppercase; font-size: 0.72rem; font-weight: 700;
        letter-spacing: 2px; color: #2563EB; background: #EFF6FF;
        padding: 0.3rem 0.75rem; border-radius: 6px; margin-bottom: 1rem;
    }
    .fp-section-title {
        font-size: 2.25rem; font-weight: 800; line-height: 1.15; margin-bottom: 1rem;
        color: #0F172A; letter-spacing: -0.02em;
    }
    .fp-section-header { margin-bottom: 3rem; text-align: center; }

    /* Buttons */
    .fp-btn-primary {
        display: inline-flex; align-items: center; gap: 0.5rem;
        background: linear-gradient(135deg, #2563EB, #1D4ED8); color: #fff;
        padding: 0.85rem 1.8rem; border-radius: 10px; text-decoration: none;
        font-weight: 600; font-size: 0.95rem; cursor: pointer; border: none;
        transition: transform 0.15s ease, box-shadow 0.2s ease;
        box-shadow: 0 1px 3px rgba(37,99,235,0.25);
    }
    .fp-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(37,99,235,0.3); }
    .fp-btn-primary.fp-btn-lg { padding: 1rem 2.25rem; font-size: 1.05rem; }
    .fp-btn-secondary {
        display: inline-flex; align-items: center; gap: 0.5rem;
        border: 1.5px solid #CBD5E1; color: #475569; padding: 0.85rem 1.8rem;
        border-radius: 10px; text-decoration: none; font-weight: 600; font-size: 0.95rem;
        cursor: pointer; background: #fff; transition: border-color 0.2s ease, color 0.2s ease;
    }
    .fp-btn-secondary:hover { border-color: #2563EB; color: #2563EB; }

    /* Stats Section */
    .fp-stats-section { padding: 3rem 2rem; background: #F8FAFC; border-bottom: 1px solid #F1F5F9; }
    .fp-stats-grid {
        display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem;
        max-width: 1120px; margin: 0 auto;
    }
    .fp-stat-card {
        text-align: center; padding: 1.5rem 1rem; background: #fff;
        border: 1px solid #E2E8F0; border-radius: 12px;
        transition: transform 0.2s ease, box-shadow 0.2s ease; cursor: default;
    }
    .fp-stat-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,0.05); }
    .fp-stat-number {
        display: block; font-size: 1.6rem; font-weight: 800; color: #2563EB;
        margin-bottom: 0.15rem; letter-spacing: -0.02em;
    }
    .fp-stat-label { display: block; font-size: 0.8rem; color: #94A3B8; font-weight: 500; }

    /* Benefits Section */
    .fp-benefits-section { padding: 5.5rem 2rem; background: #fff; }
    .fp-benefits-section .container { max-width: 1120px; margin: 0 auto; }
    .fp-benefits-grid {
        display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem;
        max-width: 1120px; margin: 0 auto;
    }
    .fp-benefit-card {
        padding: 1.75rem; background: #F8FAFC; border: 1px solid #E2E8F0;
        border-radius: 14px; transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    }
    .fp-benefit-card:hover { border-color: #60A5FA; box-shadow: 0 4px 16px rgba(0,0,0,0.04); transform: translateY(-2px); }
    .fp-benefit-icon {
        width: 48px; height: 48px; border-radius: 12px;
        background: #EFF6FF; display: flex; align-items: center;
        justify-content: center; color: #2563EB; margin-bottom: 1rem;
    }
    .fp-benefit-title { font-size: 1rem; font-weight: 700; color: #0F172A; margin-bottom: 0.5rem; }
    .fp-benefit-desc { font-size: 0.88rem; color: #64748B; line-height: 1.6; }

    /* How It Works */
    .fp-how-section { background: #F8FAFC; padding: 5.5rem 2rem; border-top: 1px solid #F1F5F9; }
    .fp-how-section .container { max-width: 1120px; margin: 0 auto; }
    .fp-steps-timeline { position: relative; max-width: 680px; margin: 0 auto; }
    .fp-steps-timeline::before {
        content: ''; position: absolute; left: 27px; top: 30px; bottom: 30px;
        width: 2px; background: linear-gradient(180deg, #60A5FA, #E2E8F0); border-radius: 2px;
    }
    .fp-step-item { display: flex; gap: 1.5rem; margin-bottom: 2rem; position: relative; }
    .fp-step-last { margin-bottom: 0; }
    .fp-step-dot {
        width: 56px; height: 56px; min-width: 56px; border-radius: 50%;
        background: linear-gradient(135deg, #2563EB, #1D4ED8);
        display: flex; align-items: center; justify-content: center;
        z-index: 1; box-shadow: 0 2px 8px rgba(37,99,235,0.25);
    }
    .fp-step-number { font-weight: 700; font-size: 1.1rem; color: #fff; }
    .fp-step-card {
        background: #fff; border: 1px solid #E2E8F0; border-radius: 12px;
        padding: 1.25rem 1.5rem; flex: 1;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
    .fp-step-card:hover { border-color: #60A5FA; box-shadow: 0 4px 16px rgba(0,0,0,0.04); }
    .fp-step-title { font-size: 1rem; font-weight: 700; color: #0F172A; margin-bottom: 0.3rem; }
    .fp-step-desc { font-size: 0.88rem; color: #64748B; line-height: 1.6; }

    /* Features List */
    .fp-features-list-section { padding: 5.5rem 2rem; background: #fff; border-top: 1px solid #F1F5F9; }
    .fp-features-list-section .container { max-width: 1120px; margin: 0 auto; }
    .fp-features-list-wrapper { max-width: 720px; margin: 0 auto; }
    .fp-features-list {
        list-style: none; display: grid; grid-template-columns: 1fr 1fr;
        gap: 0.75rem; padding: 0; margin: 0;
    }
    .fp-feature-item {
        display: flex; align-items: flex-start; gap: 0.6rem;
        font-size: 0.9rem; color: #475569; font-weight: 500;
        padding: 0.6rem 0.85rem; background: #F8FAFC;
        border: 1px solid #E2E8F0; border-radius: 8px;
    }
    .fp-feature-item svg { color: #2563EB; min-width: 16px; margin-top: 2px; }

    /* CTA Section */
    .fp-cta-section {
        padding: 5.5rem 2rem;
        background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 50%, #EFF6FF 100%);
        border-top: 1px solid #E2E8F0;
    }
    .fp-cta-section .container { max-width: 1120px; margin: 0 auto; }
    .fp-cta-content { text-align: center; max-width: 600px; margin: 0 auto; }
    .fp-cta-title { font-size: 2rem; font-weight: 800; color: #0F172A; margin-bottom: 1rem; letter-spacing: -0.02em; }
    .fp-cta-subtitle { font-size: 1.05rem; color: #64748B; line-height: 1.7; margin-bottom: 2rem; }
    .fp-cta-btn-wrapper { margin-bottom: 1rem; }
    .fp-cta-note { font-size: 0.82rem; color: #94A3B8; }

    /* Responsive */
    @media (max-width: 900px) {
        .fp-hero { padding-top: 7rem; }
        .fp-hero-title { font-size: 2.2rem; }
        .fp-section-title { font-size: 1.8rem; }
        .fp-benefits-grid { grid-template-columns: repeat(2, 1fr); }
        .fp-stats-grid { grid-template-columns: repeat(2, 1fr); }
        .fp-features-list { grid-template-columns: 1fr; }
    }
    @media (max-width: 560px) {
        .fp-hero-title { font-size: 1.8rem; }
        .fp-section-title { font-size: 1.5rem; }
        .fp-hero-cta-group { flex-direction: column; width: 100%; }
        .fp-hero-cta-group .fp-btn-primary,
        .fp-hero-cta-group .fp-btn-secondary { width: 100%; justify-content: center; }
        .fp-benefits-grid { grid-template-columns: 1fr; }
        .fp-stats-grid { grid-template-columns: 1fr; gap: 0.75rem; }
        .fp-cta-title { font-size: 1.5rem; }
        .fp-step-item { flex-direction: column; align-items: flex-start; gap: 0.75rem; }
        .fp-steps-timeline::before { display: none; }
    }

    /* ═══════════════════════════════════════════════════════════════════
       Feature Page: Document Generation (redesign) — .fp-dg-*
       Uses blue color scheme; self-contained, does not rely on .fp-*
       ═══════════════════════════════════════════════════════════════════ */

    /* CSS variables scoped via class */
    .fp-dg-hero-wrap, .fp-dg-stats-bar, .fp-dg-section, .fp-dg-features-cta {
        --fp-blue-50:  #eff6ff; --fp-blue-100: #dbeafe; --fp-blue-200: #bfdbfe;
        --fp-blue-300: #93c5fd; --fp-blue-400: #60a5fa; --fp-blue-500: #3b82f6;
        --fp-blue-600: #2563eb; --fp-blue-700: #1d4ed8; --fp-blue-800: #1e40af;
        --fp-slate-50:  #f8fafc; --fp-slate-100: #f1f5f9; --fp-slate-200: #e2e8f0;
        --fp-slate-300: #cbd5e1; --fp-slate-400: #94a3b8; --fp-slate-500: #64748b;
        --fp-slate-600: #475569; --fp-slate-700: #334155; --fp-slate-800: #1e293b;
        --fp-slate-900: #0f172a;
        --fp-green-50: #f0fdf4; --fp-green-100: #dcfce7; --fp-green-500: #22c55e; --fp-green-600: #16a34a;
        --fp-radius-sm: 6px; --fp-radius-md: 10px; --fp-radius-lg: 14px; --fp-radius-xl: 20px;
        --fp-shadow-sm: 0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.05);
        --fp-shadow-md: 0 4px 6px -1px rgba(0,0,0,.07), 0 2px 4px -1px rgba(0,0,0,.05);
        --fp-shadow-lg: 0 10px 15px -3px rgba(0,0,0,.07), 0 4px 6px -2px rgba(0,0,0,.04);
        --fp-shadow-xl: 0 20px 25px -5px rgba(0,0,0,.09), 0 10px 10px -5px rgba(0,0,0,.04);
    }

    .fp-dg-section { padding: 5rem 2rem; }
    .fp-dg-section-inner { max-width: 1100px; margin: 0 auto; }
    .fp-dg-eyebrow { display: inline-block; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--fp-blue-600); margin-bottom: .625rem; }
    .fp-dg-section-title { font-size: clamp(1.625rem, 3vw, 2.25rem); font-weight: 800; letter-spacing: -.025em; color: var(--fp-slate-900); line-height: 1.2; margin-bottom: .875rem; }
    .fp-dg-section-sub { font-size: 1rem; color: var(--fp-slate-500); line-height: 1.75; max-width: 580px; }
    .fp-dg-section-header { margin-bottom: 3.5rem; }
    .fp-dg-section-header.center { text-align: center; }
    .fp-dg-section-header.center .fp-dg-section-sub { margin: 0 auto; }

    .fp-dg-btn { display: inline-flex; align-items: center; gap: .5rem; padding: .75rem 1.5rem; border-radius: var(--fp-radius-md); font-family: inherit; font-size: .9375rem; font-weight: 600; text-decoration: none; cursor: pointer; border: none; transition: all 180ms; white-space: nowrap; line-height: 1; }
    .fp-dg-btn-primary { background: var(--fp-blue-600); color: #fff; box-shadow: 0 1px 3px rgba(37,99,235,.3); padding: .8125rem 1.625rem; }
    .fp-dg-btn-primary:hover { background: var(--fp-blue-700); transform: translateY(-1px); box-shadow: 0 6px 16px rgba(37,99,235,.4); }
    .fp-dg-btn-outline { background: transparent; color: var(--fp-slate-700); border: 1.5px solid var(--fp-slate-200); padding: .8125rem 1.625rem; }
    .fp-dg-btn-outline:hover { border-color: var(--fp-blue-300); color: var(--fp-blue-600); background: var(--fp-blue-50); }
    .fp-dg-btn-white { background: #fff; color: var(--fp-blue-700); box-shadow: var(--fp-shadow-sm); padding: .75rem 1.375rem; }
    .fp-dg-btn-white:hover { background: var(--fp-blue-50); transform: translateY(-1px); box-shadow: var(--fp-shadow-md); }

    .fp-dg-hero-wrap { background: linear-gradient(155deg, var(--fp-blue-50) 0%, #fff 55%, var(--fp-blue-50) 100%); padding: 5rem 2rem 4.5rem; }
    .fp-dg-hero { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
    .fp-dg-hero-badge { display: inline-flex; align-items: center; gap: .5rem; padding: .3rem .875rem; background: var(--fp-blue-50); border: 1px solid var(--fp-blue-200); border-radius: 100px; font-size: .78rem; font-weight: 600; color: var(--fp-blue-700); margin-bottom: 1.375rem; }
    .fp-dg-hero-title { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.12; color: var(--fp-slate-900); margin-bottom: 1.25rem; }
    .fp-dg-hero-title span { color: var(--fp-blue-600); }
    .fp-dg-hero-sub { font-size: 1.0625rem; color: var(--fp-slate-500); line-height: 1.75; margin-bottom: 2rem; max-width: 460px; }
    .fp-dg-hero-actions { display: flex; gap: .875rem; flex-wrap: wrap; margin-bottom: 1.5rem; }

    .fp-dg-demo-wrap { position: relative; }
    .fp-dg-demo-glow { position: absolute; inset: -40px; background: radial-gradient(ellipse at 60% 40%, rgba(37,99,235,.1) 0%, transparent 65%); pointer-events: none; z-index: 0; }
    .fp-dg-demo-browser { position: relative; z-index: 1; background: #fff; border-radius: var(--fp-radius-xl); box-shadow: var(--fp-shadow-xl), 0 0 0 1px rgba(0,0,0,.06); overflow: hidden; }
    .fp-dg-dp { padding: 1.25rem; }
    .fp-dg-dp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .875rem; }
    .fp-dg-dp-head-left { display: flex; align-items: center; gap: .5rem; font-size: .875rem; font-weight: 700; color: var(--fp-slate-800); }
    .fp-dg-dp-close { color: var(--fp-slate-400); cursor: pointer; }
    .fp-dg-dp-tabs { display: flex; border-bottom: 1.5px solid var(--fp-slate-200); margin-bottom: 1rem; }
    .fp-dg-dp-tab { display: flex; align-items: center; gap: .3rem; padding: .45rem .75rem; font-size: .775rem; font-weight: 600; color: var(--fp-slate-400); border-bottom: 2px solid transparent; margin-bottom: -1.5px; cursor: pointer; transition: color 150ms; }
    .fp-dg-dp-tab.on { color: var(--fp-blue-600); border-bottom-color: var(--fp-blue-600); }
    .fp-dg-dp-section-label { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--fp-slate-400); margin-bottom: .5rem; }
    .fp-dg-dp-doc { display: flex; align-items: center; gap: .5rem; padding: .55rem .75rem; border: 1.5px solid var(--fp-slate-200); border-radius: var(--fp-radius-sm); margin-bottom: .4rem; cursor: pointer; transition: border-color 200ms, background 200ms; }
    .fp-dg-dp-doc:hover { border-color: var(--fp-blue-300); background: var(--fp-blue-50); }
    .fp-dg-dp-doc.sel { border-color: var(--fp-blue-500); background: var(--fp-blue-50); }
    .fp-dg-dp-doc-type { font-size: .58rem; font-weight: 700; text-transform: uppercase; padding: 2px 5px; border-radius: 4px; flex-shrink: 0; }
    .fp-dg-dp-doc-type.pdf { background: #fee2e2; color: #dc2626; }
    .fp-dg-dp-doc-type.docx { background: var(--fp-blue-100); color: var(--fp-blue-700); }
    .fp-dg-dp-doc-name { font-size: .76rem; font-weight: 500; color: var(--fp-slate-700); flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .fp-dg-dp-doc-req { font-size: .6rem; font-weight: 600; padding: 2px 6px; border-radius: 100px; background: #fee2e2; color: #dc2626; flex-shrink: 0; }
    .fp-dg-dp-radio { width: 15px; height: 15px; border-radius: 50%; border: 2px solid var(--fp-slate-300); flex-shrink: 0; display: flex; align-items: center; justify-content: center; transition: border-color 200ms, background 200ms; }
    .fp-dg-dp-doc.sel .fp-dg-dp-radio { border-color: var(--fp-blue-600); background: var(--fp-blue-600); }
    .fp-dg-dp-doc.sel .fp-dg-dp-radio::after { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #fff; }
    .fp-dg-dp-gen { border-top: 1.5px solid var(--fp-slate-200); padding-top: .875rem; margin-top: .625rem; }
    .fp-dg-dp-gen-head { font-size: .775rem; font-weight: 700; color: var(--fp-slate-700); display: flex; align-items: center; gap: .375rem; margin-bottom: .75rem; }
    .fp-dg-dp-gen-modes { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin-bottom: .75rem; }
    .fp-dg-dp-mode { padding: .75rem .625rem; border: 1.5px solid var(--fp-slate-200); border-radius: var(--fp-radius-sm); text-align: center; cursor: pointer; transition: border-color 200ms, background 200ms; }
    .fp-dg-dp-mode.on { border-color: var(--fp-blue-500); background: var(--fp-blue-50); }
    .fp-dg-dp-mode-title { font-size: .7rem; font-weight: 700; color: var(--fp-slate-700); }
    .fp-dg-dp-mode-desc { font-size: .63rem; color: var(--fp-slate-400); margin-top: 2px; line-height: 1.3; }
    .fp-dg-dp-upload { border: 1.5px dashed var(--fp-slate-300); border-radius: var(--fp-radius-sm); padding: .875rem; text-align: center; margin-bottom: .625rem; transition: border-color 300ms, background 300ms; }
    .fp-dg-dp-upload.done { border-color: var(--fp-green-500); background: var(--fp-green-50); border-style: solid; }
    .fp-dg-dp-upload-idle { font-size: .72rem; color: var(--fp-slate-400); line-height: 1.5; }
    .fp-dg-dp-upload-idle svg { display: block; margin: 0 auto .375rem; }
    .fp-dg-dp-upload-ok { display: none; align-items: center; justify-content: center; gap: .5rem; font-size: .76rem; font-weight: 600; color: var(--fp-green-600); }
    .fp-dg-dp-upload.done .fp-dg-dp-upload-idle { display: none; }
    .fp-dg-dp-upload.done .fp-dg-dp-upload-ok { display: flex; }
    .fp-dg-dp-meta { font-size: .68rem; color: var(--fp-slate-400); display: flex; align-items: center; gap: .3rem; margin-bottom: .625rem; }
    .fp-dg-dp-switch { position: relative; height: 62px; }
    .fp-dg-dp-switch > * { position: absolute; top: 0; left: 0; right: 0; transition: opacity 220ms ease; }
    .fp-dg-dp-gen-btn { width: 100%; padding: .7rem; background: var(--fp-blue-600); color: #fff; border: none; border-radius: var(--fp-radius-sm); font-family: inherit; font-size: .825rem; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: .45rem; transition: background 150ms, opacity 200ms; }
    .fp-dg-dp-gen-btn:hover { background: var(--fp-blue-700); }
    .fp-dg-dp-progress { display: flex; flex-direction: column; gap: .5rem; background: var(--fp-slate-50); border: 1px solid var(--fp-slate-200); border-radius: var(--fp-radius-sm); padding: .75rem; opacity: 0; pointer-events: none; }
    .fp-dg-dp-prog-label { display: flex; align-items: center; gap: .375rem; font-size: .76rem; font-weight: 600; color: var(--fp-slate-600); }
    .fp-dg-dp-prog-label svg { animation: fp-dg-spin 1s linear infinite; }
    .fp-dg-dp-prog-track { height: 5px; background: var(--fp-slate-200); border-radius: 100px; overflow: hidden; }
    .fp-dg-dp-prog-fill { height: 100%; background: var(--fp-blue-600); border-radius: 100px; width: 0%; transition: width 300ms ease; }
    .fp-dg-dp-success { display: flex; align-items: center; gap: .75rem; background: var(--fp-green-50); border: 1.5px solid var(--fp-green-500); border-radius: var(--fp-radius-sm); padding: .75rem; opacity: 0; pointer-events: none; }
    .fp-dg-dp-success-icon { width: 34px; height: 34px; border-radius: 50%; background: var(--fp-green-500); color: #fff; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .fp-dg-dp-success-body { flex: 1; }
    .fp-dg-dp-success-title { font-size: .8rem; font-weight: 700; color: var(--fp-green-600); }
    .fp-dg-dp-success-file { font-size: .68rem; color: var(--fp-slate-400); margin-top: 1px; }
    .fp-dg-dp-dl-btn { padding: .35rem .7rem; background: var(--fp-green-600); color: #fff; border: none; border-radius: 6px; font-family: inherit; font-size: .72rem; font-weight: 600; cursor: pointer; flex-shrink: 0; }
    .fp-dg-demo-dots-row { display: flex; justify-content: center; gap: .375rem; margin-top: .875rem; }
    .fp-dg-demo-dot-step { width: 6px; height: 6px; border-radius: 100px; background: var(--fp-slate-300); transition: all 350ms ease; }
    .fp-dg-demo-dot-step.on { background: var(--fp-blue-600); width: 18px; }

    .fp-dg-stats-bar { background: #fff; border-top: 1px solid var(--fp-slate-200); border-bottom: 1px solid var(--fp-slate-200); }
    .fp-dg-stats-inner { max-width: 960px; margin: 0 auto; padding: 2.25rem 2rem; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; text-align: center; }
    .fp-dg-stat-item { padding: 0 1.5rem; position: relative; }
    .fp-dg-stat-item + .fp-dg-stat-item::before { content: ''; position: absolute; left: 0; top: 20%; bottom: 20%; width: 1px; background: var(--fp-slate-200); }
    .fp-dg-stat-val { font-size: 2rem; font-weight: 800; color: var(--fp-blue-600); letter-spacing: -.03em; line-height: 1; margin-bottom: .3rem; }
    .fp-dg-stat-lbl { font-size: .8rem; color: var(--fp-slate-500); font-weight: 500; }

    .fp-dg-hiw { background: var(--fp-slate-50); }
    .fp-dg-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; position: relative; }
    .fp-dg-steps::before { content: ''; position: absolute; top: 24px; left: calc(12.5% + 20px); right: calc(12.5% + 20px); height: 2px; background: linear-gradient(to right, var(--fp-blue-200), var(--fp-blue-300), var(--fp-blue-200)); }
    .fp-dg-step { text-align: center; }
    .fp-dg-step-num { width: 48px; height: 48px; margin: 0 auto 1.25rem; background: var(--fp-blue-600); color: #fff; border-radius: 50%; font-size: 1.1rem; font-weight: 800; display: flex; align-items: center; justify-content: center; position: relative; z-index: 1; box-shadow: 0 0 0 5px var(--fp-blue-50), var(--fp-shadow-sm); }
    .fp-dg-step-title { font-size: .9rem; font-weight: 700; color: var(--fp-slate-800); margin-bottom: .5rem; }
    .fp-dg-step-desc { font-size: .8rem; color: var(--fp-slate-500); line-height: 1.65; }
    .fp-dg-step-chip { display: inline-block; margin-top: .625rem; background: var(--fp-blue-50); color: var(--fp-blue-700); border: 1px solid var(--fp-blue-100); font-size: .7rem; font-weight: 600; padding: .2rem .55rem; border-radius: 100px; }

    .fp-dg-use-cases { background: #fff; }
    .fp-dg-use-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.75rem; }
    .fp-dg-uc-card { border: 1.5px solid var(--fp-slate-200); border-radius: var(--fp-radius-xl); overflow: hidden; transition: transform 240ms, box-shadow 240ms, border-color 240ms; display: flex; flex-direction: column; }
    .fp-dg-uc-card:hover { transform: translateY(-3px); box-shadow: var(--fp-shadow-lg); border-color: var(--fp-blue-200); }
    .fp-dg-uc-body { padding: 1.75rem 1.75rem 1.5rem; flex: 1; }
    .fp-dg-uc-icon-wrap { width: 48px; height: 48px; background: var(--fp-blue-50); border: 1px solid var(--fp-blue-100); border-radius: var(--fp-radius-md); display: flex; align-items: center; justify-content: center; margin-bottom: .875rem; }
    .fp-dg-uc-eyebrow { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--fp-blue-600); margin-bottom: .375rem; }
    .fp-dg-uc-title { font-size: 1.125rem; font-weight: 800; letter-spacing: -.02em; color: var(--fp-slate-900); margin-bottom: .75rem; line-height: 1.3; }
    .fp-dg-uc-desc { font-size: .85rem; color: var(--fp-slate-500); line-height: 1.75; margin-bottom: 1rem; }
    .fp-dg-uc-tags { display: flex; flex-wrap: wrap; gap: .375rem; }
    .fp-dg-uc-tag { background: var(--fp-blue-50); color: var(--fp-blue-700); border: 1px solid var(--fp-blue-100); border-radius: 100px; font-size: .72rem; font-weight: 600; padding: .2rem .625rem; }
    .fp-dg-uc-flow { background: var(--fp-slate-50); border-top: 1px solid var(--fp-slate-200); padding: 1.125rem 1.75rem; display: flex; align-items: center; gap: .625rem; }
    .fp-dg-flow-node { flex: 1; text-align: center; }
    .fp-dg-flow-icon { width: 42px; height: 42px; margin: 0 auto .4rem; background: #fff; border: 1.5px solid var(--fp-slate-200); border-radius: var(--fp-radius-md); display: flex; align-items: center; justify-content: center; }
    .fp-dg-flow-icon.ai { background: var(--fp-blue-50); border-color: var(--fp-blue-200); }
    .fp-dg-flow-icon.done { background: var(--fp-green-50); border-color: var(--fp-green-500); }
    .fp-dg-flow-lbl { font-size: .68rem; color: var(--fp-slate-500); font-weight: 500; line-height: 1.35; }
    .fp-dg-flow-lbl.done { color: var(--fp-green-600); font-weight: 600; }
    .fp-dg-flow-arr { color: var(--fp-slate-300); flex-shrink: 0; }

    .fp-dg-callout { background: linear-gradient(135deg, var(--fp-blue-600) 0%, var(--fp-blue-800) 100%); border-radius: var(--fp-radius-xl); padding: 2.25rem 2.5rem; margin-top: 1.75rem; color: #fff; display: grid; grid-template-columns: 1fr auto; gap: 2rem; align-items: center; }
    .fp-dg-callout-eyebrow { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.55); margin-bottom: .5rem; }
    .fp-dg-callout-title { font-size: 1.25rem; font-weight: 800; letter-spacing: -.02em; margin-bottom: .625rem; line-height: 1.3; }
    .fp-dg-callout-desc { font-size: .875rem; color: rgba(255,255,255,.75); line-height: 1.75; max-width: 520px; }
    .fp-dg-callout-aside { text-align: center; flex-shrink: 0; }
    .fp-dg-callout-note { font-size: .72rem; color: rgba(255,255,255,.45); margin-top: .5rem; }

    .fp-dg-benefits { background: var(--fp-slate-50); }
    .fp-dg-ben-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
    .fp-dg-ben-card { background: #fff; padding: 1.5rem; border: 1.5px solid var(--fp-slate-200); border-radius: var(--fp-radius-lg); transition: border-color 220ms, transform 220ms, box-shadow 220ms; }
    .fp-dg-ben-card:hover { border-color: var(--fp-blue-300); transform: translateY(-2px); box-shadow: var(--fp-shadow-md); }
    .fp-dg-ben-icon { width: 40px; height: 40px; background: var(--fp-blue-50); border: 1px solid var(--fp-blue-100); border-radius: var(--fp-radius-md); display: flex; align-items: center; justify-content: center; color: var(--fp-blue-600); margin-bottom: .875rem; }
    .fp-dg-ben-title { font-size: .9rem; font-weight: 700; color: var(--fp-slate-800); margin-bottom: .4rem; }
    .fp-dg-ben-desc { font-size: .8rem; color: var(--fp-slate-500); line-height: 1.65; }

    .fp-dg-features-cta { background: var(--fp-blue-600); padding: 5rem 2rem; }
    .fp-dg-features-inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
    .fp-dg-feat-eyebrow { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.5); margin-bottom: .5rem; }
    .fp-dg-feat-title { font-size: 1.75rem; font-weight: 800; color: #fff; letter-spacing: -.025em; margin-bottom: 1.5rem; line-height: 1.2; }
    .fp-dg-feat-list { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: .625rem; padding: 0; margin: 0; }
    .fp-dg-feat-item { display: flex; align-items: flex-start; gap: .45rem; font-size: .825rem; color: rgba(255,255,255,.85); line-height: 1.45; }
    .fp-dg-feat-item::before { content: '¹3'; color: var(--fp-blue-200); font-weight: 700; flex-shrink: 0; }
    .fp-dg-feat-cta-box { text-align: center; }
    .fp-dg-feat-cta-icon { width: 56px; height: 56px; background: rgba(255,255,255,.1); border-radius: var(--fp-radius-lg); display: flex; align-items: center; justify-content: center; margin: 0 auto 1.25rem; border: 1.5px solid rgba(255,255,255,.15); }
    .fp-dg-feat-cta-title { font-size: 1.5rem; font-weight: 800; color: #fff; letter-spacing: -.02em; margin-bottom: .75rem; }
    .fp-dg-feat-cta-sub { font-size: .875rem; color: rgba(255,255,255,.65); margin-bottom: 1.75rem; line-height: 1.65; }
    .fp-dg-feat-credit-note { font-size: .75rem; color: rgba(255,255,255,.45); margin-top: .75rem; }

    @keyframes fp-dg-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
    @keyframes fadeUp { from { transform: translateY(12px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

    @media (max-width: 1024px) {
        .fp-dg-hero { grid-template-columns: 1fr; gap: 3rem; }
        .fp-dg-steps { grid-template-columns: repeat(2, 1fr); }
        .fp-dg-steps::before { display: none; }
        .fp-dg-use-grid { grid-template-columns: 1fr; }
        .fp-dg-ben-grid { grid-template-columns: repeat(2, 1fr); }
        .fp-dg-features-inner { grid-template-columns: 1fr; gap: 3rem; }
        .fp-dg-stats-inner { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
        .fp-dg-stat-item::before { display: none; }
        .fp-dg-callout { grid-template-columns: 1fr; }
    }
    @media (max-width: 640px) {
        .fp-dg-hero-wrap, .fp-dg-section { padding: 3rem 1rem; }
        .fp-dg-stats-inner { padding: 1.75rem 1rem; }
        .fp-dg-ben-grid { grid-template-columns: 1fr; }
        .fp-dg-steps { grid-template-columns: 1fr; gap: 2rem; }
        .fp-dg-hero-actions { flex-direction: column; }
        .fp-dg-hero-actions .fp-dg-btn { justify-content: center; }
        .fp-dg-feat-list { grid-template-columns: 1fr; }
    }

    /* ==================== FEATURE DOC REVIEW REDESIGN ==================== */

    .fp-dr-section { padding: 5rem 2rem; }
    .fp-dr-section-inner { max-width: 1100px; margin: 0 auto; }
    .fp-dr-eyebrow { display: inline-block; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: #2563eb; margin-bottom: .625rem; }
    .fp-dr-section-title { font-size: clamp(1.625rem, 3vw, 2.25rem); font-weight: 800; letter-spacing: -.025em; color: #0f172a; line-height: 1.2; margin-bottom: .875rem; }
    .fp-dr-section-sub { font-size: 1rem; color: #64748b; line-height: 1.75; max-width: 580px; }
    .fp-dr-section-header { margin-bottom: 3.5rem; }
    .fp-dr-center { text-align: center; }
    .fp-dr-center .fp-dr-section-sub { margin: 0 auto; }

    .fp-dr-btn { display: inline-flex; align-items: center; gap: .5rem; padding: .75rem 1.5rem; border-radius: 10px; font-family: inherit; font-size: .9375rem; font-weight: 600; text-decoration: none; cursor: pointer; border: none; transition: all 180ms; white-space: nowrap; line-height: 1; }
    .fp-dr-btn-primary { background: #2563eb; color: #fff; box-shadow: 0 1px 3px rgba(37,99,235,.3); padding: .8125rem 1.625rem; }
    .fp-dr-btn-primary:hover { background: #1d4ed8; transform: translateY(-1px); box-shadow: 0 6px 16px rgba(37,99,235,.4); }
    .fp-dr-btn-outline { background: transparent; color: #334155; border: 1.5px solid #e2e8f0; padding: .8125rem 1.625rem; }
    .fp-dr-btn-outline:hover { border-color: #93c5fd; color: #2563eb; background: #eff6ff; }
    .fp-dr-btn-white { background: #fff; color: #1d4ed8; box-shadow: 0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.05); }
    .fp-dr-btn-white:hover { background: #eff6ff; transform: translateY(-1px); box-shadow: 0 4px 6px -1px rgba(0,0,0,.07), 0 2px 4px -1px rgba(0,0,0,.05); }
    .fp-dr-btn-lg { font-size: .9375rem; padding: .8125rem 2rem; }

    .fp-dr-hero-wrap { background: linear-gradient(155deg, #eff6ff 0%, #fff 55%, #eff6ff 100%); padding: 5rem 2rem 4.5rem; }
    .fp-dr-hero { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
    .fp-dr-hero-left { }
    .fp-dr-hero-badge { display: inline-flex; align-items: center; gap: .5rem; padding: .3rem .875rem; background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 100px; font-size: .78rem; font-weight: 600; color: #1d4ed8; margin-bottom: 1.375rem; }
    .fp-dr-hero-title { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; letter-spacing: -.03em; line-height: 1.12; color: #0f172a; margin-bottom: 1.25rem; }
    .fp-dr-hero-highlight { color: #2563eb; }
    .fp-dr-hero-sub { font-size: 1.0625rem; color: #64748b; line-height: 1.75; margin-bottom: 2rem; max-width: 460px; }
    .fp-dr-hero-actions { display: flex; gap: .875rem; flex-wrap: wrap; }

    .fp-dr-demo-wrap { position: relative; }
    .fp-dr-demo-glow { position: absolute; inset: -40px; background: radial-gradient(ellipse at 60% 40%, rgba(37,99,235,.1) 0%, transparent 65%); pointer-events: none; z-index: 0; }
    .fp-dr-demo-browser { position: relative; z-index: 1; background: #fff; border-radius: 20px; box-shadow: 0 20px 25px -5px rgba(0,0,0,.09), 0 10px 10px -5px rgba(0,0,0,.04), 0 0 0 1px rgba(0,0,0,.06); overflow: hidden; height: 370px; }
    .fp-dr-dp { padding: 1.25rem; }
    .fp-dr-dp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .875rem; }
    .fp-dr-dp-head-left { display: flex; align-items: center; gap: .5rem; font-size: .875rem; font-weight: 700; color: #1e293b; }
    .fp-dr-dp-close { color: #94a3b8; cursor: pointer; }
    .fp-dr-dp-tabs { display: flex; border-bottom: 1.5px solid #e2e8f0; margin-bottom: 1rem; }
    .fp-dr-dp-tab { display: flex; align-items: center; gap: .3rem; padding: .45rem .75rem; font-size: .775rem; font-weight: 600; color: #94a3b8; border-bottom: 2px solid transparent; margin-bottom: -1.5px; cursor: pointer; transition: color 150ms; }
    .fp-dr-dp-tab-on { color: #2563eb; border-bottom-color: #2563eb; }
    .fp-dr-dp-rev-head { font-size: .775rem; font-weight: 700; color: #334155; display: flex; align-items: center; gap: .375rem; margin-bottom: .75rem; }
    .fp-dr-dp-upload { border: 1.5px dashed #cbd5e1; border-radius: 6px; padding: .875rem; text-align: center; margin-bottom: .625rem; transition: border-color 300ms, background 300ms; }
    .fp-dr-dp-upload.fp-dr-upload-done { border-color: #22c55e; background: #f0fdf4; border-style: solid; }
    .fp-dr-dp-upload-idle { font-size: .72rem; color: #94a3b8; line-height: 1.5; }
    .fp-dr-dp-upload-idle svg { display: block; margin: 0 auto .375rem; }
    .fp-dr-dp-upload-ok { display: none; align-items: center; justify-content: center; gap: .5rem; font-size: .76rem; font-weight: 600; color: #16a34a; }
    .fp-dr-dp-upload.fp-dr-upload-done .fp-dr-dp-upload-idle { display: none; }
    .fp-dr-dp-upload.fp-dr-upload-done .fp-dr-dp-upload-ok { display: flex; }
    .fp-dr-dp-meta { font-size: .68rem; color: #94a3b8; display: flex; align-items: center; gap: .3rem; margin-bottom: .625rem; }
    .fp-dr-dp-gen-btn { width: 100%; padding: .7rem; background: #2563eb; color: #fff; border: none; border-radius: 6px; font-family: inherit; font-size: .825rem; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: .45rem; transition: background 150ms, opacity 200ms; }
    .fp-dr-dp-gen-btn:hover { background: #1d4ed8; }
    .fp-dr-dp-switch { position: relative; height: 92px; }
    .fp-dr-dp-switch > * { position: absolute; top: 0; left: 0; right: 0; transition: opacity 220ms ease; }
    .fp-dr-dp-progress { display: flex; flex-direction: column; gap: .5rem; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 6px; padding: .75rem; opacity: 0; pointer-events: none; }
    .fp-dr-dp-prog-label { display: flex; align-items: center; gap: .375rem; font-size: .76rem; font-weight: 600; color: #475569; }
    .fp-dr-dp-prog-label svg { animation: fp-dr-spin 1s linear infinite; }
    .fp-dr-dp-prog-track { height: 5px; background: #e2e8f0; border-radius: 100px; overflow: hidden; }
    .fp-dr-dp-prog-fill { height: 100%; background: #2563eb; border-radius: 100px; width: 0%; transition: width 300ms ease; }
    .fp-dr-dp-results { background: #eff6ff; border: 1.5px solid #bfdbfe; border-radius: 6px; padding: .625rem .75rem; opacity: 0; pointer-events: none; }
    .fp-dr-dp-res-row { display: flex; align-items: center; gap: .5rem; margin-bottom: .4rem; }
    .fp-dr-dp-score-badge { width: 38px; height: 38px; border-radius: 50%; background: #f97316; color: #fff; display: flex; align-items: center; justify-content: center; font-size: .76rem; font-weight: 800; flex-shrink: 0; line-height: 1; }
    .fp-dr-dp-score-body { flex: 1; }
    .fp-dr-dp-score-title { font-size: .8rem; font-weight: 700; color: #1e293b; }
    .fp-dr-dp-score-sub { font-size: .65rem; color: #64748b; margin-top: 1px; }
    .fp-dr-dp-rep-btn { padding: .35rem .7rem; background: #2563eb; color: #fff; border: none; border-radius: 6px; font-family: inherit; font-size: .72rem; font-weight: 600; cursor: pointer; flex-shrink: 0; }
    .fp-dr-dp-issue-badges { display: flex; gap: .375rem; }
    .fp-dr-dp-issue-badge { font-size: .6rem; font-weight: 700; padding: 2px 7px; border-radius: 100px; }
    .fp-dr-dp-issue-critical { background: #fee2e2; color: #dc2626; }
    .fp-dr-dp-issue-major { background: #fef3c7; color: #d97706; }
    .fp-dr-dp-issue-minor { background: #f1f5f9; color: #475569; }
    .fp-dr-demo-dots-row { display: flex; justify-content: center; gap: .375rem; margin-top: .875rem; }
    .fp-dr-dot { width: 6px; height: 6px; border-radius: 100px; background: #cbd5e1; transition: all 350ms ease; }
    .fp-dr-dot.fp-dr-dot-on { background: #2563eb; width: 18px; }

    .fp-dr-stats-bar { background: #fff; border-top: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0; }
    .fp-dr-stats-inner { max-width: 960px; margin: 0 auto; padding: 2.25rem 2rem; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; text-align: center; }
    .fp-dr-stat-item { padding: 0 1.5rem; position: relative; }
    .fp-dr-stat-item + .fp-dr-stat-item::before { content: ''; position: absolute; left: 0; top: 20%; bottom: 20%; width: 1px; background: #e2e8f0; }
    .fp-dr-stat-val { font-size: 2rem; font-weight: 800; color: #2563eb; letter-spacing: -.03em; line-height: 1; margin-bottom: .3rem; }
    .fp-dr-stat-lbl { font-size: .8rem; color: #64748b; font-weight: 500; }

    .fp-dr-hiw { background: #f8fafc; }
    .fp-dr-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; position: relative; }
    .fp-dr-steps::before { content: ''; position: absolute; top: 24px; left: calc(12.5% + 20px); right: calc(12.5% + 20px); height: 2px; background: linear-gradient(to right, #bfdbfe, #93c5fd, #bfdbfe); }
    .fp-dr-step { text-align: center; }
    .fp-dr-step-num { width: 48px; height: 48px; margin: 0 auto 1.25rem; background: #2563eb; color: #fff; border-radius: 50%; font-size: 1.1rem; font-weight: 800; display: flex; align-items: center; justify-content: center; position: relative; z-index: 1; box-shadow: 0 0 0 5px #eff6ff, 0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.05); }
    .fp-dr-step-title { font-size: .9rem; font-weight: 700; color: #1e293b; margin-bottom: .5rem; }
    .fp-dr-step-desc { font-size: .8rem; color: #64748b; line-height: 1.65; }
    .fp-dr-step-chip { display: inline-block; margin-top: .625rem; background: #eff6ff; color: #1d4ed8; border: 1px solid #dbeafe; font-size: .7rem; font-weight: 600; padding: .2rem .55rem; border-radius: 100px; }

    .fp-dr-use-cases { background: #fff; }
    .fp-dr-use-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.75rem; }
    .fp-dr-uc-card { border: 1.5px solid #e2e8f0; border-radius: 20px; overflow: hidden; transition: transform 240ms, box-shadow 240ms, border-color 240ms; display: flex; flex-direction: column; }
    .fp-dr-uc-card:hover { transform: translateY(-3px); box-shadow: 0 10px 15px -3px rgba(0,0,0,.07), 0 4px 6px -2px rgba(0,0,0,.04); border-color: #bfdbfe; }
    .fp-dr-uc-body { padding: 1.75rem 1.75rem 1.5rem; flex: 1; }
    .fp-dr-uc-icon-wrap { width: 48px; height: 48px; background: #eff6ff; border: 1px solid #dbeafe; border-radius: 10px; display: flex; align-items: center; justify-content: center; margin-bottom: .875rem; }
    .fp-dr-uc-eyebrow { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: #2563eb; margin-bottom: .375rem; }
    .fp-dr-uc-title { font-size: 1.125rem; font-weight: 800; letter-spacing: -.02em; color: #0f172a; margin-bottom: .75rem; line-height: 1.3; }
    .fp-dr-uc-desc { font-size: .85rem; color: #64748b; line-height: 1.75; margin-bottom: 1rem; }
    .fp-dr-uc-tags { display: flex; flex-wrap: wrap; gap: .375rem; }
    .fp-dr-uc-tag { background: #eff6ff; color: #1d4ed8; border: 1px solid #dbeafe; border-radius: 100px; font-size: .72rem; font-weight: 600; padding: .2rem .625rem; }
    .fp-dr-uc-flow { background: #f8fafc; border-top: 1px solid #e2e8f0; padding: 1.125rem 1.75rem; display: flex; align-items: center; gap: .625rem; }
    .fp-dr-flow-node { flex: 1; text-align: center; }
    .fp-dr-flow-icon { width: 42px; height: 42px; margin: 0 auto .4rem; background: #fff; border: 1.5px solid #e2e8f0; border-radius: 10px; display: flex; align-items: center; justify-content: center; }
    .fp-dr-flow-icon-ai { background: #eff6ff; border-color: #bfdbfe; }
    .fp-dr-flow-icon-warn { background: #fff7ed; border-color: #f97316; }
    .fp-dr-flow-lbl { font-size: .68rem; color: #64748b; font-weight: 500; line-height: 1.35; }
    .fp-dr-flow-lbl-warn { color: #ea580c; font-weight: 600; }
    .fp-dr-flow-arr { color: #cbd5e1; flex-shrink: 0; }
    .fp-dr-callout { background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%); border-radius: 20px; padding: 2.25rem 2.5rem; color: #fff; display: flex; flex-direction: column; gap: 1.25rem; justify-content: space-between; }
    .fp-dr-callout-eyebrow { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.55); margin-bottom: .5rem; }
    .fp-dr-callout-title { font-size: 1.25rem; font-weight: 800; letter-spacing: -.02em; margin-bottom: .625rem; line-height: 1.3; color: #fff; }
    .fp-dr-callout-desc { font-size: .875rem; color: rgba(255,255,255,.75); line-height: 1.75; max-width: 520px; }
    .fp-dr-callout-aside { text-align: center; flex-shrink: 0; }
    .fp-dr-callout-note { font-size: .72rem; color: rgba(255,255,255,.45); margin-top: .5rem; }

    .fp-dr-benefits { background: #f8fafc; }
    .fp-dr-ben-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
    .fp-dr-ben-card { background: #fff; padding: 1.5rem; border: 1.5px solid #e2e8f0; border-radius: 14px; transition: border-color 220ms, transform 220ms, box-shadow 220ms; }
    .fp-dr-ben-card:hover { border-color: #93c5fd; transform: translateY(-2px); box-shadow: 0 4px 6px -1px rgba(0,0,0,.07), 0 2px 4px -1px rgba(0,0,0,.05); }
    .fp-dr-ben-icon { width: 40px; height: 40px; background: #eff6ff; border: 1px solid #dbeafe; border-radius: 10px; display: flex; align-items: center; justify-content: center; color: #2563eb; margin-bottom: .875rem; }
    .fp-dr-ben-title { font-size: .9rem; font-weight: 700; color: #1e293b; margin-bottom: .4rem; }
    .fp-dr-ben-desc { font-size: .8rem; color: #64748b; line-height: 1.65; }

    .fp-dr-features-cta { background: #2563eb; padding: 5rem 2rem; }
    .fp-dr-features-inner { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
    .fp-dr-feat-eyebrow { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.5); margin-bottom: .5rem; }
    .fp-dr-feat-title { font-size: 1.75rem; font-weight: 800; color: #fff; letter-spacing: -.025em; margin-bottom: 1.5rem; line-height: 1.2; }
    .fp-dr-feat-list { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: .625rem; padding: 0; margin: 0; }
    .fp-dr-feat-list li { display: flex; align-items: flex-start; gap: .45rem; font-size: .825rem; color: rgba(255,255,255,.85); line-height: 1.45; }
    .fp-dr-feat-list li::before { content: '¹3'; color: #bfdbfe; font-weight: 700; flex-shrink: 0; }
    .fp-dr-feat-cta-box { text-align: center; }
    .fp-dr-feat-cta-icon { width: 56px; height: 56px; background: rgba(255,255,255,.1); border-radius: 14px; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.25rem; border: 1.5px solid rgba(255,255,255,.15); }
    .fp-dr-feat-cta-title { font-size: 1.5rem; font-weight: 800; color: #fff; letter-spacing: -.02em; margin-bottom: .75rem; }
    .fp-dr-feat-cta-sub { font-size: .875rem; color: rgba(255,255,255,.65); margin-bottom: 1.75rem; line-height: 1.65; }
    .fp-dr-feat-credit-note { font-size: .75rem; color: rgba(255,255,255,.45); margin-top: .75rem; }

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

    @media (max-width: 1024px) {
        .fp-dr-hero { grid-template-columns: 1fr; gap: 3rem; }
        .fp-dr-steps { grid-template-columns: repeat(2, 1fr); }
        .fp-dr-steps::before { display: none; }
        .fp-dr-use-grid { grid-template-columns: 1fr; }
        .fp-dr-ben-grid { grid-template-columns: repeat(2, 1fr); }
        .fp-dr-features-inner { grid-template-columns: 1fr; gap: 3rem; }
        .fp-dr-stats-inner { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
        .fp-dr-stat-item::before { display: none !important; }
    }
    @media (max-width: 640px) {
        .fp-dr-hero-wrap, .fp-dr-section { padding: 3rem 1rem; }
        .fp-dr-stats-inner { padding: 1.75rem 1rem; }
        .fp-dr-ben-grid { grid-template-columns: 1fr; }
        .fp-dr-steps { grid-template-columns: 1fr; gap: 2rem; }
        .fp-dr-hero-actions { flex-direction: column; }
        .fp-dr-hero-actions .fp-dr-btn { justify-content: center; }
        .fp-dr-feat-list { grid-template-columns: 1fr; }
        .fp-dr-features-cta { padding: 3rem 1rem; }
    }

    /* ============================================================
       AI CHAT FEATURE PAGE (.fp-ac-*)
       ============================================================ */

    .fp-ac-hero, .fp-ac-stats-bar, .fp-ac-benefits, .fp-ac-capabilities,
    .fp-ac-how, .fp-ac-languages, .fp-ac-final-cta {
        --blue-600: #2563EB; --blue-500: #3B82F6; --blue-100: #DBEAFE; --blue-50: #EFF6FF;
        --slate-900: #0F172A; --slate-700: #334155; --slate-500: #64748B; --slate-300: #CBD5E1; --slate-100: #F1F5F9;
        --bg: #F8FAFC; --green-500: #22C55E;
        --radius-sm: 8px; --radius-md: 12px; --radius-lg: 20px;
        --shadow-sm: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.05);
        --shadow-md: 0 4px 16px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.05);
        --shadow-lg: 0 12px 40px rgba(37,99,235,.10), 0 4px 12px rgba(0,0,0,.06);
    }

    .fp-ac-section-inner { max-width: 1200px; margin: 0 auto; }
    .fp-ac-section-label { display: inline-block; background: var(--blue-50); color: var(--blue-600); border: 1px solid var(--blue-100); border-radius: 100px; padding: 4px 14px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 14px; }
    .fp-ac-section-title { font-size: clamp(26px, 3.5vw, 42px); font-weight: 800; color: var(--slate-900); letter-spacing: -.02em; margin-bottom: 14px; line-height: 1.2; }
    .fp-ac-section-title span { color: var(--blue-600); }
    .fp-ac-section-sub { font-size: 17px; color: var(--slate-500); max-width: 580px; line-height: 1.7; }
    .fp-ac-section-head { text-align: center; margin-bottom: 56px; }
    .fp-ac-section-head .fp-ac-section-sub { margin: 0 auto; }

    .fp-ac-btn-primary { background: var(--blue-600); color: #fff; border: none; border-radius: var(--radius-sm); padding: 14px 28px; font-size: 16px; font-weight: 700; cursor: pointer; text-decoration: none; transition: background .15s, transform .1s, box-shadow .15s; display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 4px 14px rgba(37,99,235,.35); }
    .fp-ac-btn-primary:hover { background: #1D4ED8; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(37,99,235,.4); }
    .fp-ac-btn-white { background: white; color: var(--blue-600); border: none; border-radius: var(--radius-sm); padding: 14px 32px; font-size: 16px; font-weight: 700; cursor: pointer; text-decoration: none; transition: transform .15s, box-shadow .15s; display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 4px 14px rgba(0,0,0,.15); }
    .fp-ac-btn-white:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,.2); }
    .fp-ac-btn-ghost { background: transparent; color: white; border: 1.5px solid rgba(255,255,255,.5); border-radius: var(--radius-sm); padding: 14px 32px; font-size: 16px; font-weight: 600; cursor: pointer; text-decoration: none; transition: border-color .15s, background .15s; }
    .fp-ac-btn-ghost:hover { border-color: white; background: rgba(255,255,255,.08); }

    .fp-ac-hero { background: #fff; padding: 80px 24px 0; overflow: hidden; }
    .fp-ac-hero-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
    .fp-ac-hero-badge { display: inline-flex; align-items: center; gap: 8px; background: var(--blue-50); color: var(--blue-600); border: 1px solid var(--blue-100); border-radius: 100px; padding: 5px 14px; font-size: 13px; font-weight: 600; margin-bottom: 20px; }
    .fp-ac-hero-badge svg { width: 14px; height: 14px; }
    .fp-ac-hero-title { font-size: clamp(32px, 4vw, 52px); font-weight: 800; line-height: 1.15; color: var(--slate-900); margin-bottom: 20px; letter-spacing: -.02em; }
    .fp-ac-hero-title span { color: var(--blue-600); }
    .fp-ac-hero-sub { font-size: 18px; color: var(--slate-500); margin-bottom: 36px; line-height: 1.7; max-width: 480px; }
    .fp-ac-hero-actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-bottom: 40px; }

    .fp-ac-hero-demo-wrap { position: relative; padding-bottom: 32px; }
    .fp-ac-demo-glow { position: absolute; inset: -30px; background: radial-gradient(ellipse 70% 60% at 50% 50%, rgba(37,99,235,.08) 0%, transparent 70%); pointer-events: none; z-index: 0; }
    .fp-ac-hero-demo { position: relative; background: #fff; border: 1.5px solid var(--slate-300); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); overflow: hidden; height: 520px; display: flex; flex-direction: column; z-index: 1; }
    .fp-ac-demo-header { background: #fff; border-bottom: 1px solid var(--slate-100); padding: 14px 18px; display: flex; align-items: center; gap: 10px; }
    .fp-ac-demo-avatar { width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, var(--blue-600), var(--blue-500)); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .fp-ac-demo-header-info { flex: 1; }
    .fp-ac-demo-header-name { font-size: 14px; font-weight: 700; color: var(--slate-900); }
    .fp-ac-demo-header-sub { font-size: 12px; color: var(--slate-500); }
    .fp-ac-demo-status { display: flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--green-500); }
    .fp-ac-demo-status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green-500); animation: fp-ac-pulse-dot 2s ease-in-out infinite; }
    @keyframes fp-ac-pulse-dot { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .6; transform: scale(1.2); } }
    .fp-ac-demo-context-bar { background: var(--blue-50); border-bottom: 1px solid var(--blue-100); padding: 8px 16px; display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--blue-600); font-weight: 500; }
    .fp-ac-demo-messages { flex: 1; padding: 16px; display: flex; flex-direction: column; gap: 12px; overflow-y: auto; overflow-x: hidden; scroll-behavior: smooth; }

    .fp-ac-msg { display: flex; gap: 10px; max-width: 100%; opacity: 0; transform: translateY(8px); transition: opacity .3s ease, transform .3s ease; }
    .fp-ac-msg-visible { opacity: 1; transform: translateY(0); }
    .fp-ac-msg-user { flex-direction: row-reverse; }
    .fp-ac-msg-avatar-sm { width: 28px; height: 28px; border-radius: 50%; background: var(--slate-100); display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 11px; font-weight: 700; color: var(--slate-500); margin-top: 2px; }
    .fp-ac-msg-avatar-user { background: var(--blue-100); color: var(--blue-600); }
    .fp-ac-msg-ai-avatar { width: 28px; height: 28px; border-radius: 50%; background: linear-gradient(135deg, var(--blue-600), var(--blue-500)); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 2px; }
    .fp-ac-bubble { max-width: calc(100% - 42px); padding: 10px 14px; border-radius: 14px; font-size: 13px; line-height: 1.65; }
    .fp-ac-bubble-user { background: var(--blue-600); color: white; border-bottom-right-radius: 4px; }
    .fp-ac-bubble-ai { background: var(--slate-100); color: var(--slate-900); border-bottom-left-radius: 4px; }
    .fp-ac-typing-indicator { display: none; align-items: center; gap: 4px; padding: 10px 14px; background: var(--slate-100); border-radius: 14px; border-bottom-left-radius: 4px; width: fit-content; }
    .fp-ac-typing-indicator.active { display: flex; }
    .fp-ac-typing-dot { width: 6px; height: 6px; border-radius: 50%; background: #94A3B8; animation: fp-ac-typing 1.2s ease-in-out infinite; }
    .fp-ac-typing-dot:nth-child(2) { animation-delay: .15s; }
    .fp-ac-typing-dot:nth-child(3) { animation-delay: .3s; }
    @keyframes fp-ac-typing { 0%,60%,100% { transform: translateY(0); opacity: .4; } 30% { transform: translateY(-4px); opacity: 1; } }

    .fp-ac-demo-input-bar { border-top: 1px solid var(--slate-100); padding: 10px 14px; display: flex; gap: 8px; align-items: center; }
    .fp-ac-demo-input { flex: 1; background: var(--slate-100); border: none; border-radius: var(--radius-sm); padding: 8px 12px; font-size: 13px; color: var(--slate-500); outline: none; font-family: inherit; }
    .fp-ac-demo-send { width: 34px; height: 34px; border-radius: 50%; background: var(--blue-600); border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .15s; }
    .fp-ac-demo-send:hover { background: #1D4ED8; }

    .fp-ac-stats-bar { background: #fff; border-top: 1px solid var(--slate-100); border-bottom: 1px solid var(--slate-100); padding: 32px 24px; }
    .fp-ac-stats-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; text-align: center; }
    .fp-ac-stat-item { padding: 0 24px; border-right: 1px solid var(--slate-100); }
    .fp-ac-stat-item:last-child { border-right: none; }
    .fp-ac-stat-val { font-size: 32px; font-weight: 800; color: var(--blue-600); letter-spacing: -.02em; }
    .fp-ac-stat-lbl { font-size: 14px; color: var(--slate-500); margin-top: 2px; }

    .fp-ac-benefits { background: var(--bg); padding: 80px 24px; }
    .fp-ac-benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
    .fp-ac-benefit-card { background: #fff; border: 1.5px solid var(--slate-100); border-radius: var(--radius-md); padding: 28px; transition: border-color .2s, box-shadow .2s, transform .2s; cursor: default; }
    .fp-ac-benefit-card:hover { border-color: var(--blue-100); box-shadow: var(--shadow-md); transform: translateY(-3px); }
    .fp-ac-benefit-icon { width: 44px; height: 44px; border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; margin-bottom: 16px; }
    .fp-ac-benefit-icon svg { width: 22px; height: 22px; }
    .fp-ac-benefit-title { font-size: 16px; font-weight: 700; color: var(--slate-900); margin-bottom: 8px; }
    .fp-ac-benefit-desc { font-size: 14px; color: var(--slate-500); line-height: 1.65; }
    .fp-ac-benefit-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
    .fp-ac-tag { background: var(--blue-50); color: var(--blue-600); border-radius: 100px; padding: 3px 10px; font-size: 11px; font-weight: 600; }

    .fp-ac-capabilities { background: #fff; padding: 80px 24px; }
    .fp-ac-cap-groups { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; }
    .fp-ac-cap-group { background: var(--bg); border: 1.5px solid var(--slate-100); border-radius: var(--radius-md); padding: 28px; transition: border-color .2s; }
    .fp-ac-cap-group:hover { border-color: var(--blue-100); }
    .fp-ac-cap-group-header { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
    .fp-ac-cap-icon { width: 38px; height: 38px; border-radius: var(--radius-sm); background: var(--blue-50); display: flex; align-items: center; justify-content: center; }
    .fp-ac-cap-icon svg { width: 18px; height: 18px; color: var(--blue-600); }
    .fp-ac-cap-group-title { font-size: 15px; font-weight: 700; color: var(--slate-900); }
    .fp-ac-cap-items { display: flex; flex-direction: column; gap: 8px; }
    .fp-ac-cap-item { display: flex; align-items: flex-start; gap: 10px; font-size: 13.5px; color: var(--slate-700); }
    .fp-ac-cap-item-dot { width: 18px; height: 18px; border-radius: 50%; background: var(--blue-50); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
    .fp-ac-cap-item-dot svg { width: 10px; height: 10px; color: var(--blue-600); }

    .fp-ac-how { background: var(--bg); padding: 80px 24px; }
    .fp-ac-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; position: relative; }
    .fp-ac-steps::before { content: ''; position: absolute; top: 28px; left: 10%; right: 10%; height: 1px; background: repeating-linear-gradient(90deg, var(--blue-100) 0, var(--blue-100) 8px, transparent 8px, transparent 16px); }
    .fp-ac-step { text-align: center; position: relative; }
    .fp-ac-step-num { width: 56px; height: 56px; border-radius: 50%; background: #fff; border: 2px solid var(--blue-100); display: flex; align-items: center; justify-content: center; margin: 0 auto 18px; position: relative; z-index: 1; font-size: 20px; font-weight: 800; color: var(--blue-600); box-shadow: var(--shadow-sm); }
    .fp-ac-step-title { font-size: 15px; font-weight: 700; color: var(--slate-900); margin-bottom: 8px; }
    .fp-ac-step-desc { font-size: 13px; color: var(--slate-500); line-height: 1.6; }

    .fp-ac-languages { background: #fff; padding: 80px 24px; }
    .fp-ac-lang-row { display: flex; align-items: center; justify-content: center; gap: 16px; flex-wrap: wrap; }
    .fp-ac-lang-pill { display: flex; align-items: center; gap: 8px; background: var(--bg); border: 1.5px solid var(--slate-100); border-radius: 100px; padding: 8px 18px; font-size: 14px; font-weight: 600; color: var(--slate-700); transition: border-color .2s, color .2s; }
    .fp-ac-lang-pill:hover { border-color: var(--blue-600); color: var(--blue-600); }
    .fp-ac-lang-flag { font-size: 20px; }

    .fp-ac-final-cta { background: var(--blue-600); padding: 80px 24px; text-align: center; }
    .fp-ac-final-cta h2 { font-size: clamp(28px, 4vw, 46px); font-weight: 800; color: white; margin-bottom: 14px; letter-spacing: -.02em; }
    .fp-ac-final-cta p { font-size: 18px; color: rgba(255,255,255,.75); margin-bottom: 36px; }
    .fp-ac-cta-group { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

    @media (max-width: 1024px) {
        .fp-ac-hero-inner { grid-template-columns: 1fr; gap: 48px; }
        .fp-ac-hero-demo { max-width: 520px; margin: 0 auto; width: 100%; }
        .fp-ac-hero-demo-wrap { max-width: 520px; margin: 0 auto; width: 100%; }
        .fp-ac-stats-inner { grid-template-columns: repeat(2, 1fr); }
        .fp-ac-stat-item:nth-child(2) { border-right: none; }
        .fp-ac-stat-item:nth-child(3) { border-right: 1px solid var(--slate-100); }
        .fp-ac-steps { grid-template-columns: repeat(2, 1fr); }
        .fp-ac-steps::before { display: none; }
    }
    @media (max-width: 768px) {
        .fp-ac-benefits-grid { grid-template-columns: 1fr; }
        .fp-ac-cap-groups { grid-template-columns: 1fr; }
        .fp-ac-stats-inner { grid-template-columns: repeat(2, 1fr); }
        .fp-ac-steps { grid-template-columns: 1fr; }
        .fp-ac-hero { padding: 56px 20px 0; }
        .fp-ac-benefits, .fp-ac-capabilities, .fp-ac-how, .fp-ac-languages { padding: 56px 20px; }
        .fp-ac-final-cta { padding: 56px 20px; }
    }
    @media (prefers-reduced-motion: reduce) {
        .fp-ac-msg, .fp-ac-typing-dot, .fp-ac-demo-status-dot { animation-duration: .01ms !important; transition-duration: .01ms !important; }
    }

/* ==================== ANALYTICS FEATURE PAGE (Redesigned) ==================== */

    /* ── Hero ── */
    .fp-an-hero {
        background: linear-gradient(145deg, #f8fafc 0%, #eff6ff 55%, #dbeafe 100%);
        min-height: 100vh; display: flex; align-items: center;
        overflow: hidden; position: relative; padding: 96px 24px 80px;
    }
    .fp-an-hero-grid-bg {
        position: absolute; inset: 0;
        background-image:
            linear-gradient(rgba(37,99,235,.05) 1px, transparent 1px),
            linear-gradient(90deg, rgba(37,99,235,.05) 1px, transparent 1px);
        background-size: 44px 44px; pointer-events: none;
    }
    .fp-an-hero-orb-1 {
        position: absolute; top: -120px; right: -80px;
        width: 560px; height: 560px;
        background: radial-gradient(circle, rgba(37,99,235,.1) 0%, transparent 68%);
        pointer-events: none;
    }
    .fp-an-hero-orb-2 {
        position: absolute; bottom: -180px; left: -120px;
        width: 440px; height: 440px;
        background: radial-gradient(circle, rgba(59,130,246,.07) 0%, transparent 70%);
        pointer-events: none;
    }
    .fp-an-hero-particle {
        position: absolute; border-radius: 50%;
        background: rgba(37,99,235,.18);
        animation: fpAnParticleDrift var(--dur, 8s) ease-in-out infinite var(--delay, 0s);
        pointer-events: none;
    }
    @keyframes fpAnParticleDrift {
        0%,100% { transform: translate(0, 0) scale(1); opacity: .3; }
        33%     { transform: translate(var(--dx1, 20px), var(--dy1, -30px)) scale(1.2); opacity: .6; }
        66%     { transform: translate(var(--dx2, -15px), var(--dy2, 20px)) scale(.8); opacity: .2; }
    }
    .fp-an-hero-inner {
        max-width: 1200px; margin: 0 auto; width: 100%;
        display: grid; grid-template-columns: 1fr 1fr; gap: 64px;
        align-items: center; position: relative; z-index: 1;
    }
    .fp-an-hero-badge {
        display: inline-flex; align-items: center; gap: 8px;
        background: #eff6ff; border: 1px solid #bfdbfe;
        color: #1d4ed8; font-size: 12px; font-weight: 600;
        padding: 5px 14px; border-radius: 20px; margin-bottom: 22px;
        letter-spacing: .04em; text-transform: uppercase;
    }
    .fp-an-hero-h1 {
        font-size: clamp(32px, 4vw, 52px); font-weight: 800;
        color: #0f172a; line-height: 1.13; margin-bottom: 20px;
        letter-spacing: -0.035em;
    }
    .fp-an-accent {
        background: linear-gradient(135deg, #2563eb, #1e40af);
        -webkit-background-clip: text; -webkit-text-fill-color: transparent;
        background-clip: text;
    }
    .fp-an-hero-sub {
        font-size: 17px; color: #475569; margin-bottom: 36px;
        line-height: 1.75; max-width: 500px;
    }
    .fp-an-hero-sub strong { color: #1e293b; font-weight: 600; }
    .fp-an-hero-cta { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 28px; }
    .fp-an-btn-hero-primary {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 14px 28px; background: #2563eb; color: #fff;
        font-size: 15px; font-weight: 700; border-radius: 14px;
        text-decoration: none; transition: all .2s;
        box-shadow: 0 0 0 0 rgba(37,99,235,.4);
    }
    .fp-an-btn-hero-primary:hover {
        background: #1d4ed8; transform: translateY(-2px);
        box-shadow: 0 10px 28px rgba(37,99,235,.45);
    }
    .fp-an-btn-hero-secondary {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 14px 22px; background: #fff;
        color: #334155; font-size: 15px; font-weight: 500;
        border-radius: 14px; text-decoration: none;
        border: 1.5px solid #e2e8f0; transition: all .2s;
    }
    .fp-an-btn-hero-secondary:hover { background: #f8fafc; color: #0f172a; border-color: #cbd5e1; }

    /* ── Dashboard Card (hero right) ── */
    .fp-an-hero-dashboard { position: relative; }
    .fp-an-dashboard-card {
        background: #fff; border-radius: 18px; padding: 22px;
        box-shadow: 0 0 0 1px rgba(0,0,0,.06), 0 20px 60px rgba(0,0,0,.1), 0 0 80px rgba(37,99,235,.08);
        animation: fpAnCardFloat 7s ease-in-out infinite;
        max-width: 468px; margin-left: auto;
    }
    @keyframes fpAnCardFloat {
        0%,100% { transform: translateY(0) rotateX(1.5deg) rotateY(-1.5deg); }
        50%     { transform: translateY(-14px) rotateX(1.5deg) rotateY(-1.5deg); }
    }
    .fp-an-card-search {
        display: flex; align-items: center; gap: 8px;
        background: #f8fafc; border: 1.5px solid #e2e8f0;
        border-radius: 10px; padding: 10px 14px; margin-bottom: 18px;
        font-size: 14px;
    }
    .fp-an-card-search svg { color: #94a3b8; flex-shrink: 0; }
    .fp-an-typing-wrapper { flex: 1; display: flex; align-items: center; min-height: 20px; }
    #fp-an-typing-text { font-weight: 500; color: #1e293b; font-size: 14px; }
    .fp-an-cursor {
        display: inline-block; width: 2px; height: 15px;
        background: #2563eb; margin-left: 2px;
        animation: fpAnBlink 1s infinite; vertical-align: middle;
    }
    @keyframes fpAnBlink { 0%,100% { opacity: 1; } 50% { opacity: 0; } }
    .fp-an-buyer-header {
        display: flex; align-items: flex-start; justify-content: space-between;
        margin-bottom: 14px; opacity: 0;
        animation: fpAnFadeUp .5s ease forwards 1.6s;
    }
    .fp-an-buyer-name { font-size: 17px; font-weight: 800; color: #0f172a; }
    .fp-an-buyer-meta { font-size: 11px; color: #64748b; margin-top: 2px; }
    .fp-an-badge-country {
        background: #eff6ff; color: #1d4ed8;
        font-size: 11px; font-weight: 700; padding: 3px 8px;
        border-radius: 5px; white-space: nowrap; margin-top: 2px;
    }
    .fp-an-kpis { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; margin-bottom: 16px; }
    .fp-an-kpi-box {
        background: #f8fafc; border: 1px solid #e2e8f0;
        border-radius: 6px; padding: 9px 6px; text-align: center;
        opacity: 0; animation: fpAnFadeUp .4s ease forwards;
    }
    .fp-an-kpi-box:nth-child(1) { animation-delay: 2.1s; }
    .fp-an-kpi-box:nth-child(2) { animation-delay: 2.25s; }
    .fp-an-kpi-box:nth-child(3) { animation-delay: 2.4s; }
    .fp-an-kpi-box:nth-child(4) { animation-delay: 2.55s; }
    .fp-an-kpi-num { font-size: 14px; font-weight: 800; color: #2563eb; display: block; }
    .fp-an-kpi-lbl { font-size: 9px; color: #94a3b8; line-height: 1.3; margin-top: 2px; }
    .fp-an-card-chart {
        margin-bottom: 14px; opacity: 0;
        animation: fpAnFadeUp .5s ease forwards 3s;
    }
    .fp-an-chart-lbl {
        font-size: 10px; font-weight: 700; color: #94a3b8;
        text-transform: uppercase; letter-spacing: .06em; margin-bottom: 6px;
    }
    .fp-an-chart-svg { width: 100%; height: 52px; display: block; }
    .fp-an-chart-bar {
        fill: #2563eb; rx: 2;
        animation: fpAnBarGrow .55s ease-out both;
        animation-delay: var(--bd, 3.1s);
    }
    @keyframes fpAnBarGrow {
        from { clip-path: inset(99% 0 0 0); }
        to   { clip-path: inset(0% 0 0 0); }
    }
    .fp-an-suppliers { opacity: 0; animation: fpAnFadeUp .5s ease forwards 3.8s; }
    .fp-an-suppliers-lbl {
        font-size: 10px; font-weight: 700; color: #94a3b8;
        text-transform: uppercase; letter-spacing: .06em; margin-bottom: 8px;
    }
    .fp-an-sup-row { display: flex; align-items: center; gap: 7px; margin-bottom: 6px; }
    .fp-an-sup-row:last-child { margin-bottom: 0; }
    .fp-an-sup-rank {
        width: 17px; height: 17px; background: #eff6ff;
        color: #1d4ed8; font-size: 9px; font-weight: 800;
        border-radius: 50%; display: flex; align-items: center;
        justify-content: center; flex-shrink: 0;
    }
    .fp-an-sup-name { font-size: 11px; font-weight: 600; color: #334155; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .fp-an-sup-track { height: 5px; background: #e2e8f0; border-radius: 3px; overflow: hidden; width: 80px; }
    .fp-an-sup-fill {
        height: 100%; background: #2563eb; border-radius: 3px;
        transform: scaleX(0); transform-origin: left;
        animation: fpAnFillBar .7s ease-out forwards;
    }
    .fp-an-sup-row:nth-child(1) .fp-an-sup-fill { animation-delay: 4s;   --tw: 100%; }
    .fp-an-sup-row:nth-child(2) .fp-an-sup-fill { animation-delay: 4.15s; --tw: 83%; }
    .fp-an-sup-row:nth-child(3) .fp-an-sup-fill { animation-delay: 4.3s;  --tw: 52%; }
    @keyframes fpAnFillBar { to { transform: scaleX(var(--tw, 1)); } }
    .fp-an-sup-val { font-size: 11px; font-weight: 700; color: #2563eb; white-space: nowrap; }
    @keyframes fpAnFadeUp {
        from { opacity: 0; transform: translateY(8px); }
        to   { opacity: 1; transform: translateY(0); }
    }

    /* ── Stats Strip ── */
    .fp-an-stats-strip {
        background: #fff; border-bottom: 1px solid #e2e8f0;
        padding: 28px 24px;
    }
    .fp-an-stats-inner {
        max-width: 1200px; margin: 0 auto;
        display: flex; justify-content: space-around; flex-wrap: wrap; gap: 20px;
    }
    .fp-an-stat-item { text-align: center; }
    .fp-an-stat-num {
        font-size: 30px; font-weight: 800;
        color: #2563eb; letter-spacing: -0.03em; line-height: 1;
    }
    .fp-an-stat-desc { font-size: 13px; color: #64748b; margin-top: 5px; }

    /* ── Shared section ── */
    .fp-an-section { padding: 96px 24px; }
    .fp-an-section-alt { background: #f8fafc; }
    .fp-an-section-inner { max-width: 1200px; margin: 0 auto; }
    .fp-an-section-hd { margin-bottom: 56px; }
    .fp-an-section-label {
        display: inline-flex; align-items: center; gap: 7px;
        font-size: 11px; font-weight: 800; text-transform: uppercase;
        letter-spacing: .1em; color: #2563eb; margin-bottom: 14px;
    }
    .fp-an-section-label::before {
        content: ''; display: block; width: 18px; height: 2px;
        background: #2563eb; border-radius: 1px;
    }
    .fp-an-section-h2 {
        font-size: clamp(28px, 3.5vw, 40px); font-weight: 800;
        color: #0f172a; line-height: 1.18;
        letter-spacing: -0.03em; margin-bottom: 14px;
    }
    .fp-an-section-sub {
        font-size: 17px; color: #64748b;
        max-width: 560px; line-height: 1.75;
    }

    /* ── Analytics Panel (preview) ── */
    .fp-an-ap-panel {
        background: #fff; border: 1px solid #e2e8f0;
        border-radius: 18px; overflow: hidden;
        box-shadow: 0 4px 24px rgba(0,0,0,.06), 0 20px 60px rgba(37,99,235,.05);
    }
    .fp-an-ap-header {
        background: linear-gradient(135deg, #1e40af 0%, #2563eb 100%);
        padding: 22px 28px; display: flex; align-items: center;
        justify-content: space-between; gap: 20px; flex-wrap: wrap;
    }
    .fp-an-ap-buyer-name { font-size: 18px; font-weight: 800; color: #fff; margin-bottom: 3px; }
    .fp-an-ap-buyer-meta { font-size: 12px; color: #bfdbfe; }
    .fp-an-ap-kpi-row { display: flex; gap: 0; }
    .fp-an-ap-kpi { text-align: center; padding: 0 18px; }
    .fp-an-ap-kpi + .fp-an-ap-kpi { border-left: 1px solid rgba(255,255,255,.15); }
    .fp-an-ap-kv { display: block; font-size: 18px; font-weight: 800; color: #fff; }
    .fp-an-ap-kl { font-size: 11px; color: #bfdbfe; margin-top: 2px; }
    .fp-an-ap-body { padding: 22px 24px; }
    .fp-an-ap-charts-grid {
        display: grid; grid-template-columns: repeat(2,1fr); gap: 14px;
    }
    .fp-an-ap-chart-card {
        background: #f8fafc; border: 1px solid #e2e8f0;
        border-radius: 14px; padding: 16px;
    }
    .fp-an-ap-chart-title {
        font-size: 12px; font-weight: 600; color: #475569; margin-bottom: 12px;
    }
    .fp-an-ap-line-svg { width: 100%; height: 88px; display: block; overflow: visible; }
    .fp-an-ap-chart-x-labels {
        display: flex; justify-content: space-between;
        font-size: 9px; color: #94a3b8; margin-top: 5px; padding: 0 2px;
    }
    .fp-an-ap-donut-wrap { display: flex; align-items: center; gap: 12px; }
    .fp-an-ap-donut-svg { width: 88px; height: 88px; flex-shrink: 0; }
    .fp-an-ap-legend { flex: 1; display: flex; flex-direction: column; gap: 5px; }
    .fp-an-ap-legend-item { display: flex; align-items: center; gap: 6px; font-size: 10.5px; color: #475569; line-height: 1.3; }
    .fp-an-ap-legend-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
    .fp-an-ap-legend-label { flex: 1; }
    .fp-an-ap-legend-pct { font-weight: 700; font-size: 11px; color: #1e293b; white-space: nowrap; }

    /* ── Value Props ── */
    .fp-an-value-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
    .fp-an-value-card {
        background: #fff; border: 1px solid #e2e8f0;
        border-radius: 18px; padding: 30px;
        position: relative; overflow: hidden;
        transition: transform .2s, box-shadow .2s, border-color .2s;
    }
    .fp-an-value-card::before {
        content: ''; position: absolute; top: 0; left: 0; right: 0;
        height: 3px; background: #2563eb;
    }
    .fp-an-value-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 18px 40px rgba(0,0,0,.08);
        border-color: #bfdbfe;
    }
    .fp-an-val-icon {
        width: 46px; height: 46px; background: #eff6ff;
        border-radius: 12px; display: flex; align-items: center;
        justify-content: center; margin-bottom: 18px;
    }
    .fp-an-val-icon svg { color: #2563eb; }
    .fp-an-val-h3 {
        font-size: 19px; font-weight: 700; color: #0f172a;
        margin-bottom: 8px; line-height: 1.25;
    }
    .fp-an-val-p { font-size: 14px; color: #64748b; line-height: 1.7; margin-bottom: 18px; }
    .fp-an-val-example {
        background: #f8fafc; border: 1px solid #e2e8f0;
        border-left: 3px solid #2563eb;
        border-radius: 0 8px 8px 0; padding: 11px 13px;
        font-size: 13px; color: #475569; line-height: 1.6;
    }
    .fp-an-val-example strong { color: #1d4ed8; font-weight: 700; }

    /* ── Anatomy ── */
    .fp-an-anatomy-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
    .fp-an-anat-card {
        background: #fff; border: 1px solid #e2e8f0;
        border-radius: 14px; padding: 22px; transition: all .2s;
    }
    .fp-an-anat-card:hover {
        border-color: #93c5fd;
        box-shadow: 0 8px 28px rgba(37,99,235,.07);
    }
    .fp-an-anat-card-special {
        background: #2563eb; border-color: #2563eb;
    }
    .fp-an-anat-card-special:hover {
        border-color: #1d4ed8;
        box-shadow: 0 8px 28px rgba(37,99,235,.2);
    }
    .fp-an-anat-hd { display: flex; align-items: center; gap: 11px; margin-bottom: 14px; }
    .fp-an-anat-icon {
        width: 36px; height: 36px; background: #eff6ff;
        border-radius: 9px; display: flex; align-items: center; justify-content: center;
    }
    .fp-an-anat-icon svg { color: #2563eb; }
    .fp-an-anat-icon-special { background: rgba(255,255,255,.15); }
    .fp-an-anat-title { font-size: 14px; font-weight: 700; color: #0f172a; }
    .fp-an-anat-title-special { color: #fff; }
    .fp-an-anat-items { list-style: none; display: flex; flex-direction: column; gap: 5px; padding: 0; margin: 0; }
    .fp-an-anat-item {
        display: flex; align-items: flex-start; gap: 8px;
        font-size: 12px; color: #475569; line-height: 1.5;
    }
    .fp-an-anat-item::before {
        content: ''; display: block; width: 5px; height: 5px;
        background: #60a5fa; border-radius: 50%;
        margin-top: 5px; flex-shrink: 0;
    }
    .fp-an-anat-item-special { color: rgba(255,255,255,.8); }
    .fp-an-anat-item-special::before { background: rgba(255,255,255,.5); }

    /* ── How It Works ── */
    .fp-an-hiw-steps { display: flex; flex-direction: column; gap: 0; position: relative; }
    .fp-an-hiw-steps::before {
        content: ''; position: absolute; left: 27px; top: 0; bottom: 0;
        width: 2px; background: linear-gradient(to bottom, #2563eb, #1e40af);
        opacity: .25;
    }
    .fp-an-hiw-step {
        display: flex; gap: 26px; padding: 30px 0;
        border-bottom: 1px solid #e2e8f0;
    }
    .fp-an-hiw-step:last-child { border-bottom: none; }
    .fp-an-step-num {
        width: 54px; height: 54px; flex-shrink: 0;
        background: #eff6ff; border: 2px solid #bfdbfe;
        border-radius: 14px; display: flex; align-items: center;
        justify-content: center; font-size: 22px; font-weight: 800;
        color: #1d4ed8;
    }
    .fp-an-step-content { flex: 1; padding-top: 6px; }
    .fp-an-step-title { font-size: 19px; font-weight: 700; color: #0f172a; margin-bottom: 6px; }
    .fp-an-step-desc { font-size: 14px; color: #475569; line-height: 1.7; }
    .fp-an-step-outcome {
        display: inline-flex; align-items: center; gap: 6px;
        background: rgba(22,163,74,.1); color: #15803d;
        font-size: 12px; font-weight: 600; padding: 4px 11px;
        border-radius: 6px; margin-top: 10px;
    }

    /* ── CTA Section ── */
    .fp-an-cta-section {
        background: linear-gradient(135deg, #1e40af 0%, #2563eb 55%, #3b82f6 100%);
        padding: 96px 24px; text-align: center; position: relative; overflow: hidden;
    }
    .fp-an-cta-section::before {
        content: ''; position: absolute; inset: 0;
        background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
            linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
        background-size: 40px 40px;
    }
    .fp-an-cta-inner { max-width: 600px; margin: 0 auto; position: relative; z-index: 1; }
    .fp-an-cta-h2 {
        font-size: clamp(26px,3.5vw,42px); font-weight: 800;
        color: #fff; letter-spacing: -0.03em; margin-bottom: 14px;
    }
    .fp-an-cta-sub { font-size: 17px; color: rgba(255,255,255,.7); margin-bottom: 38px; line-height: 1.7; }
    .fp-an-cta-btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
    .fp-an-btn-cta-w {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 15px 32px; background: #fff; color: #1d4ed8;
        font-size: 15px; font-weight: 800; border-radius: 14px;
        text-decoration: none; transition: all .2s;
    }
    .fp-an-btn-cta-w:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(0,0,0,.18); }
    .fp-an-btn-cta-outline {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 15px 26px; background: rgba(255,255,255,.12); color: #fff;
        font-size: 15px; font-weight: 600; border-radius: 14px;
        text-decoration: none; border: 1px solid rgba(255,255,255,.25); transition: all .2s;
    }
    .fp-an-btn-cta-outline:hover { background: rgba(255,255,255,.2); transform: translateY(-2px); }
    .fp-an-cta-note { margin-top: 20px; font-size: 13px; color: rgba(255,255,255,.45); }

    /* ── Scroll Reveal (visible by default, animated if JS loads) ── */
    .fp-an-reveal {
        opacity: 1; transform: translateY(0);
        transition: opacity .65s ease, transform .65s ease;
    }
    .fp-an-visible { opacity: 1; transform: translateY(0); }
    .fp-an-reveal-d1 { transition-delay: .1s; }
    .fp-an-reveal-d2 { transition-delay: .2s; }

    /* ── Responsive ── */
    @media (max-width: 1000px) {
        .fp-an-hero-inner { grid-template-columns: 1fr; }
        .fp-an-hero-dashboard { display: none; }
        .fp-an-value-grid { grid-template-columns: 1fr; }
        .fp-an-anatomy-grid { grid-template-columns: 1fr 1fr; }
        .fp-an-ap-header { flex-direction: column; align-items: flex-start; gap: 16px; }
        .fp-an-ap-kpi-row { width: 100%; }
    }
    @media (max-width: 640px) {
        .fp-an-hero { padding: 72px 20px 56px; }
        .fp-an-hero-sub { font-size: 15px; }
        .fp-an-hero-cta { flex-direction: column; }
        .fp-an-btn-hero-primary, .fp-an-btn-hero-secondary { justify-content: center; width: 100%; }
        .fp-an-stats-inner { justify-content: center; }
        .fp-an-stat-item { min-width: 140px; flex: 0 0 calc(50% - 10px); }
        .fp-an-stat-num { font-size: 26px; }
        .fp-an-section { padding: 56px 20px; }
        .fp-an-section-h2 { font-size: clamp(22px, 6vw, 32px); }
        .fp-an-section-sub { font-size: 15px; }
        .fp-an-section-hd { margin-bottom: 36px; }
        .fp-an-ap-panel { border-radius: 14px; }
        .fp-an-ap-header { padding: 18px 16px; flex-direction: column; align-items: flex-start; gap: 14px; }
        .fp-an-ap-buyer-name { font-size: 16px; }
        .fp-an-ap-kpi-row {
            display: grid; grid-template-columns: 1fr 1fr;
            width: 100%; gap: 8px;
        }
        .fp-an-ap-kpi {
            padding: 8px 6px; text-align: center;
            background: rgba(255,255,255,.1); border-radius: 6px;
        }
        .fp-an-ap-kpi + .fp-an-ap-kpi { border-left: none; }
        .fp-an-ap-kv { font-size: 16px; }
        .fp-an-ap-body { padding: 16px; }
        .fp-an-ap-charts-grid { grid-template-columns: 1fr; gap: 12px; }
        .fp-an-ap-donut-svg { width: 80px; height: 80px; }
        .fp-an-kpis { grid-template-columns: repeat(2,1fr); }
        .fp-an-anatomy-grid { grid-template-columns: 1fr; }
        .fp-an-hiw-steps::before { left: 21px; }
        .fp-an-step-num { width: 44px; height: 44px; font-size: 18px; border-radius: 11px; }
        .fp-an-step-title { font-size: 17px; }
        .fp-an-cta-section { padding: 72px 20px; }
        .fp-an-cta-btns { flex-direction: column; align-items: center; }
        .fp-an-btn-cta-w, .fp-an-btn-cta-outline { width: 100%; justify-content: center; }
    }

/* ==================== COMPETITOR INTELLIGENCE REDESIGN ==================== */

    /* ── Hero ──────────────────────────────────────────── */
    .fp-ci-hero {
        background: linear-gradient(145deg, #eff6ff 0%, #eff6ff 55%, #dbeafe 100%);
        min-height: 100vh; display: flex; align-items: center;
        overflow: hidden; position: relative; padding: 96px 24px 80px;
    }
    .fp-ci-hero-grid-bg {
        position: absolute; inset: 0;
        background-image:
            linear-gradient(rgba(37,99,235,.05) 1px, transparent 1px),
            linear-gradient(90deg, rgba(37,99,235,.05) 1px, transparent 1px);
        background-size: 44px 44px; pointer-events: none;
    }
    .fp-ci-hero-orb-1 {
        position: absolute; top: -120px; right: -80px;
        width: 560px; height: 560px;
        background: radial-gradient(circle, rgba(37,99,235,.1) 0%, transparent 68%);
        pointer-events: none;
    }
    .fp-ci-hero-orb-2 {
        position: absolute; bottom: -180px; left: -120px;
        width: 440px; height: 440px;
        background: radial-gradient(circle, rgba(96,165,250,.07) 0%, transparent 70%);
        pointer-events: none;
    }
    .fp-ci-hero-particle {
        position: absolute; border-radius: 50%;
        background: rgba(37,99,235,.18);
        animation: fpCiParticleDrift var(--dur, 8s) ease-in-out infinite var(--delay, 0s);
        pointer-events: none;
    }
    @keyframes fpCiParticleDrift {
        0%,100% { transform: translate(0,0) scale(1); opacity:.3; }
        33%      { transform: translate(var(--dx1,20px),var(--dy1,-30px)) scale(1.2); opacity:.6; }
        66%      { transform: translate(var(--dx2,-15px),var(--dy2,20px)) scale(.8); opacity:.2; }
    }
    .fp-ci-hero-inner {
        max-width: 1200px; margin: 0 auto; width: 100%;
        display: grid; grid-template-columns: 1fr 1fr; gap: 64px;
        align-items: center; position: relative; z-index: 1;
    }
    .fp-ci-hero-badge {
        display: inline-flex; align-items: center; gap: 8px;
        background: #eff6ff; border: 1px solid #bfdbfe;
        color: #1d4ed8; font-size: 12px; font-weight: 600;
        padding: 5px 14px; border-radius: 20px; margin-bottom: 22px;
        letter-spacing: .04em; text-transform: uppercase;
    }
    .fp-ci-hero-h1 {
        font-size: clamp(32px, 4vw, 52px); font-weight: 800;
        color: #0F172A; line-height: 1.13; margin-bottom: 20px;
        letter-spacing: -0.035em;
    }
    .fp-ci-accent {
        background: linear-gradient(135deg, #2563eb, #1d4ed8);
        -webkit-background-clip: text; -webkit-text-fill-color: transparent;
        background-clip: text;
    }
    .fp-ci-hero-sub { font-size: 17px; color: #64748B; margin-bottom: 36px; line-height: 1.75; max-width: 500px; }
    .fp-ci-hero-sub strong { color: #1E293B; font-weight: 600; }
    .fp-ci-hero-cta { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 28px; }
    .fp-ci-btn-hero-primary {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 14px 28px; background: linear-gradient(135deg, #2563eb, #1d4ed8); color: #fff;
        font-size: 15px; font-weight: 700; border-radius: 14px;
        text-decoration: none; transition: all .2s;
        box-shadow: 0 0 0 0 rgba(37,99,235,.4);
    }
    .fp-ci-btn-hero-primary:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(37,99,235,.45); }
    .fp-ci-btn-hero-secondary {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 14px 22px; background: #fff;
        color: #334155; font-size: 15px; font-weight: 500;
        border-radius: 14px; text-decoration: none;
        border: 1.5px solid #E2E8F0; transition: all .2s;
    }
    .fp-ci-btn-hero-secondary:hover { background: #F8FAFC; color: #0F172A; border-color: #CBD5E1; }

    /* ── Hero dashboard card ────────────────────────────── */
    .fp-ci-hero-dashboard { position: relative; }
    .fp-ci-dashboard-card {
        background: #fff; border-radius: 18px; padding: 22px;
        box-shadow: 0 0 0 1px rgba(0,0,0,.06), 0 20px 60px rgba(0,0,0,.1), 0 0 80px rgba(37,99,235,.08);
        animation: fpCiCardFloat 7s ease-in-out infinite;
        max-width: 468px; margin-left: auto;
    }
    @keyframes fpCiCardFloat {
        0%,100% { transform: translateY(0) rotateX(1.5deg) rotateY(-1.5deg); }
        50%      { transform: translateY(-14px) rotateX(1.5deg) rotateY(-1.5deg); }
    }
    .fp-ci-card-search {
        display: flex; align-items: center; gap: 8px;
        background: #F8FAFC; border: 1.5px solid #E2E8F0;
        border-radius: 10px; padding: 10px 14px; margin-bottom: 18px;
    }
    .fp-ci-card-search svg { color: #94A3B8; flex-shrink: 0; }
    .fp-ci-typing-wrapper { flex: 1; display: flex; align-items: center; min-height: 20px; }
    #ci-typing-text { font-weight: 500; color: #1E293B; font-size: 14px; }
    .fp-ci-cursor {
        display: inline-block; width: 2px; height: 15px;
        background: #2563eb; margin-left: 2px;
        animation: fpCiBlink 1s infinite; vertical-align: middle;
    }
    @keyframes fpCiBlink { 0%,100% { opacity:1; } 50% { opacity:0; } }
    .fp-ci-card-comp-header {
        display: flex; align-items: flex-start; justify-content: space-between;
        margin-bottom: 14px; opacity: 0;
        animation: fpCiFadeUp .5s ease forwards 1.6s;
    }
    .fp-ci-card-comp-name { font-size: 16px; font-weight: 800; color: #0F172A; }
    .fp-ci-card-comp-reg { font-size: 11px; color: #64748B; margin-top: 2px; }
    .fp-ci-badge-strategy {
        background: #eff6ff; color: #1d4ed8;
        font-size: 10px; font-weight: 700; padding: 3px 8px;
        border-radius: 5px; white-space: nowrap; margin-top: 2px;
        border: 1px solid #bfdbfe; text-transform: uppercase; letter-spacing: .04em;
    }
    .fp-ci-card-kpis { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; margin-bottom: 16px; }
    .fp-ci-kpi-box {
        background: #F8FAFC; border: 1px solid #E2E8F0;
        border-radius: 6px; padding: 9px 6px; text-align: center;
        opacity: 0; animation: fpCiFadeUp .4s ease forwards;
    }
    .fp-ci-kpi-box:nth-child(1) { animation-delay: 2.1s; }
    .fp-ci-kpi-box:nth-child(2) { animation-delay: 2.25s; }
    .fp-ci-kpi-box:nth-child(3) { animation-delay: 2.4s; }
    .fp-ci-kpi-box:nth-child(4) { animation-delay: 2.55s; }
    .fp-ci-kpi-num { font-size: 14px; font-weight: 800; color: #2563eb; display: block; }
    .fp-ci-kpi-lbl { font-size: 9px; color: #94A3B8; line-height: 1.3; margin-top: 2px; }
    .fp-ci-card-chart { margin-bottom: 14px; opacity: 0; animation: fpCiFadeUp .5s ease forwards 3s; }
    .fp-ci-chart-lbl { font-size: 10px; font-weight: 700; color: #94A3B8; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 4px; }
    .fp-ci-chart-svg { width: 100%; height: 64px; display: block; }
    .fp-ci-chart-bar {
        fill: #2563eb;
        animation: fpCiBarGrow .55s ease-out both;
        animation-delay: var(--bd, 3.1s);
    }
    .fp-ci-chart-bar-peak { fill: #1d4ed8; }
    .fp-ci-chart-bar-dim  { fill: #bfdbfe; }
    @keyframes fpCiBarGrow {
        from { clip-path: inset(99% 0 0 0); }
        to   { clip-path: inset(0% 0 0 0); }
    }
    .fp-ci-chart-years {
        display: flex; justify-content: space-between; padding: 0 2px;
        font-size: 9px; color: #94A3B8; margin-top: 2px;
    }
    .fp-ci-card-buyers { opacity: 0; animation: fpCiFadeUp .5s ease forwards 3.8s; }
    .fp-ci-buyers-lbl { font-size: 10px; font-weight: 700; color: #94A3B8; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 8px; }
    .fp-ci-buyer-row { display: flex; align-items: center; gap: 7px; margin-bottom: 6px; }
    .fp-ci-buyer-row:last-child { margin-bottom: 0; }
    .fp-ci-buyer-rank { width: 17px; height: 17px; background: #eff6ff; color: #1d4ed8; font-size: 9px; font-weight: 800; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .fp-ci-buyer-name { font-size: 11px; font-weight: 600; color: #334155; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .fp-ci-buyer-track { height: 5px; background: #E2E8F0; border-radius: 3px; overflow: hidden; width: 70px; }
    .fp-ci-buyer-fill { height: 100%; background: #2563eb; border-radius: 3px; transform: scaleX(0); transform-origin: left; animation: fpCiFillBar .7s ease-out forwards; }
    .fp-ci-buyer-row:nth-child(1) .fp-ci-buyer-fill { animation-delay: 4s; --tw: 100%; }
    .fp-ci-buyer-row:nth-child(2) .fp-ci-buyer-fill { animation-delay: 4.15s; --tw: 64%; }
    .fp-ci-buyer-row:nth-child(3) .fp-ci-buyer-fill { animation-delay: 4.3s; --tw: 38%; }
    @keyframes fpCiFillBar { to { transform: scaleX(var(--tw, 1)); } }
    .fp-ci-buyer-val { font-size: 11px; font-weight: 700; color: #2563eb; white-space: nowrap; }
    @keyframes fpCiFadeUp {
        from { opacity:0; transform:translateY(8px); }
        to   { opacity:1; transform:translateY(0); }
    }

    /* ── Stats Strip ───────────────────────────────────── */
    .fp-ci-stats-strip { background: #fff; border-bottom: 1px solid #E2E8F0; padding: 28px 24px; }
    .fp-ci-stats-inner { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-around; flex-wrap: wrap; gap: 20px; }
    .fp-ci-stat-item { text-align: center; }
    .fp-ci-stat-num { font-size: 30px; font-weight: 800; color: #2563eb; letter-spacing: -0.03em; line-height: 1; }
    .fp-ci-stat-desc { font-size: 13px; color: #64748B; margin-top: 5px; }

    /* ── Shared section ────────────────────────────────── */
    .fp-ci-section { padding: 96px 24px; }
    .fp-ci-section-alt { background: #F8FAFC; }
    .fp-ci-section-inner { max-width: 1200px; margin: 0 auto; }
    .fp-ci-section-hd { margin-bottom: 56px; }
    .fp-ci-section-label {
        display: inline-flex; align-items: center; gap: 7px;
        font-size: 11px; font-weight: 800; text-transform: uppercase;
        letter-spacing: .1em; color: #2563eb; margin-bottom: 14px;
    }
    .fp-ci-section-label::before { content: ''; display: block; width: 18px; height: 2px; background: #2563eb; border-radius: 1px; }
    .fp-ci-section-h2 { font-size: clamp(28px, 3.5vw, 40px); font-weight: 800; color: #0F172A; line-height: 1.18; letter-spacing: -0.03em; margin-bottom: 14px; }
    .fp-ci-section-sub { font-size: 17px; color: #64748B; max-width: 560px; line-height: 1.75; }

    /* ── Strategy Analytics Panel ───────────────────────── */
    .fp-ci-sp-panel {
        background: #fff; border: 1px solid #E2E8F0;
        border-radius: 18px; overflow: hidden;
        box-shadow: 0 4px 24px rgba(0,0,0,.06), 0 20px 60px rgba(37,99,235,.05);
    }
    .fp-ci-sp-header {
        background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 100%);
        padding: 22px 28px; display: flex; align-items: center;
        justify-content: space-between; gap: 20px; flex-wrap: wrap;
    }
    .fp-ci-sp-company-name { font-size: 18px; font-weight: 800; color: #fff; margin-bottom: 4px; }
    .fp-ci-sp-meta-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
    .fp-ci-sp-tag { font-size: 10px; font-weight: 700; padding: 3px 9px; border-radius: 4px; text-transform: uppercase; letter-spacing: .06em; }
    .fp-ci-sp-tag-strategy { background: rgba(255,255,255,.18); color: #fff; }
    .fp-ci-sp-tag-country  { background: rgba(255,255,255,.12); color: rgba(255,255,255,.85); }
    .fp-ci-sp-kpi-row { display: flex; gap: 0; }
    .fp-ci-sp-kpi { text-align: center; padding: 0 18px; }
    .fp-ci-sp-kpi + .fp-ci-sp-kpi { border-left: 1px solid rgba(255,255,255,.15); }
    .fp-ci-sp-kv { display: block; font-size: 18px; font-weight: 800; color: #fff; }
    .fp-ci-sp-kl { font-size: 11px; color: #bfdbfe; margin-top: 2px; }
    .fp-ci-sp-body { padding: 0; }
    .fp-ci-sp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
    .fp-ci-sp-card {
        padding: 24px 26px; border-right: 1px solid #E2E8F0;
        border-bottom: 1px solid #E2E8F0;
    }
    .fp-ci-sp-card:nth-child(2) { border-right: none; }
    .fp-ci-sp-card:nth-child(3) { border-bottom: none; }
    .fp-ci-sp-card:nth-child(4) { border-right: none; border-bottom: none; }
    .fp-ci-sp-card-hd { display: flex; align-items: center; gap: 9px; margin-bottom: 16px; }
    .fp-ci-sp-card-icon {
        width: 30px; height: 30px; background: #eff6ff;
        border-radius: 8px; display: flex; align-items: center; justify-content: center;
    }
    .fp-ci-sp-card-icon svg { color: #2563eb; }
    .fp-ci-sp-card-title { font-size: 13px; font-weight: 700; color: #334155; text-transform: uppercase; letter-spacing: .06em; }
    .fp-ci-sp-stats { display: flex; gap: 10px; margin-bottom: 18px; }
    .fp-ci-sp-stat {
        flex: 1; background: #F8FAFC; border: 1px solid #E2E8F0;
        border-radius: 6px; padding: 9px 8px; text-align: center;
    }
    .fp-ci-sp-stat-val { font-size: 15px; font-weight: 800; color: #2563eb; display: block; }
    .fp-ci-sp-stat-lbl { font-size: 9px; color: #94A3B8; line-height: 1.3; margin-top: 2px; }
    .fp-ci-sp-sublabel { font-size: 11px; font-weight: 700; color: #94A3B8; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 10px; }

    /* Distribution bars */
    .fp-ci-dist-bar-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
    .fp-ci-dist-bar-row:last-child { margin-bottom: 0; }
    .fp-ci-dist-bar-label { font-size: 11px; color: #475569; width: 110px; flex-shrink: 0; }
    .fp-ci-dist-bar-track { flex: 1; height: 8px; background: #E2E8F0; border-radius: 4px; overflow: hidden; }
    .fp-ci-dist-bar-fill { height: 100%; border-radius: 4px; width: 0; transition: width 1s ease 0.3s; }
    .fp-ci-dist-bar-fill-lg { background: #1d4ed8; }
    .fp-ci-dist-bar-fill-md { background: #60a5fa; }
    .fp-ci-dist-bar-fill-sm { background: #bfdbfe; }
    .fp-ci-dist-bar-pct { font-size: 11px; font-weight: 700; color: #475569; width: 38px; text-align: right; flex-shrink: 0; }

    /* Buyer list */
    .fp-ci-sp-buyer-item { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #F1F5F9; }
    .fp-ci-sp-buyer-item:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
    .fp-ci-sp-buyer-rank { width: 20px; height: 20px; background: #2563eb; color: #fff; font-size: 9px; font-weight: 800; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .fp-ci-sp-buyer-info { flex: 1; min-width: 0; }
    .fp-ci-sp-buyer-name { font-size: 12px; font-weight: 600; color: #1E293B; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .fp-ci-sp-buyer-sub { font-size: 10px; color: #94A3B8; margin-top: 1px; }
    .fp-ci-sp-buyer-val { font-size: 12px; font-weight: 700; color: #2563eb; white-space: nowrap; }

    /* Competition bars */
    .fp-ci-comp-bar-row { display: flex; align-items: center; gap: 8px; margin-bottom: 9px; }
    .fp-ci-comp-bar-row:last-child { margin-bottom: 0; }
    .fp-ci-comp-bar-label { font-size: 11px; color: #475569; width: 100px; flex-shrink: 0; }
    .fp-ci-comp-bar-track { flex: 1; height: 10px; background: #F1F5F9; border-radius: 5px; overflow: hidden; position: relative; }
    .fp-ci-comp-bar-fill { height: 100%; border-radius: 5px; width: 0; transition: width 1s ease 0.5s; }
    .fp-ci-comp-bar-fill-low  { background: linear-gradient(90deg, #22c55e, #4ade80); }
    .fp-ci-comp-bar-fill-med  { background: linear-gradient(90deg, #2563eb, #60a5fa); }
    .fp-ci-comp-bar-fill-high { background: linear-gradient(90deg, #f97316, #fb923c); }
    .fp-ci-comp-bar-pct { font-size: 11px; font-weight: 700; color: #475569; width: 38px; text-align: right; flex-shrink: 0; }

    /* Timing chart */
    .fp-ci-timing-chart-wrap { position: relative; }
    .fp-ci-timing-svg { width: 100%; height: 72px; display: block; overflow: visible; }
    .fp-ci-timing-bar {
        fill: #2563eb;
        animation: fpCiTimingGrow .6s ease-out both;
        animation-delay: var(--tbd, 0.3s);
    }
    .fp-ci-timing-bar-peak { fill: #1d4ed8; }
    @keyframes fpCiTimingGrow {
        from { transform: scaleY(0); transform-origin: bottom; }
        to   { transform: scaleY(1); transform-origin: bottom; }
    }
    .fp-ci-timing-labels { display: flex; justify-content: space-around; font-size: 10px; color: #94A3B8; margin-top: 4px; }
    .fp-ci-timing-peak-label {
        display: inline-flex; align-items: center; gap: 4px;
        background: rgba(37,99,235,.08); color: #1d4ed8;
        font-size: 10px; font-weight: 700; padding: 3px 8px;
        border-radius: 4px; margin-bottom: 12px;
    }

    /* ── Intelligence type cards ────────────────────────── */
    .fp-ci-intel-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
    .fp-ci-intel-card {
        background: #fff; border: 1px solid #E2E8F0;
        border-radius: 18px; padding: 28px;
        position: relative; overflow: hidden;
        transition: transform .2s, box-shadow .2s, border-color .2s;
    }
    .fp-ci-intel-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: #2563eb; }
    .fp-ci-intel-card:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(0,0,0,.08); border-color: #bfdbfe; }
    .fp-ci-ic-icon { width: 44px; height: 44px; background: #eff6ff; border-radius: 11px; display: flex; align-items: center; justify-content: center; margin-bottom: 16px; }
    .fp-ci-ic-icon svg { color: #2563eb; }
    .fp-ci-ic-h3 { font-size: 17px; font-weight: 700; color: #0F172A; margin-bottom: 8px; line-height: 1.3; }
    .fp-ci-ic-p { font-size: 13.5px; color: #64748B; line-height: 1.7; margin-bottom: 16px; }
    .fp-ci-ic-example {
        background: #F8FAFC; border: 1px solid #E2E8F0;
        border-left: 3px solid #2563eb;
        border-radius: 0 8px 8px 0; padding: 10px 12px;
        font-size: 12.5px; color: #475569; line-height: 1.6;
    }
    .fp-ci-ic-example strong { color: #1d4ed8; font-weight: 700; }

    /* ── Use Cases ──────────────────────────────────────── */
    .fp-ci-uc-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
    .fp-ci-uc-card {
        background: #eff6ff; border: 1px solid #dbeafe;
        border-radius: 18px; padding: 28px;
        transition: transform .2s, box-shadow .2s;
    }
    .fp-ci-uc-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(37,99,235,.12); }
    .fp-ci-uc-num {
        width: 36px; height: 36px; background: #2563eb; color: #fff;
        border-radius: 10px; font-size: 16px; font-weight: 800;
        display: flex; align-items: center; justify-content: center;
        margin-bottom: 16px;
    }
    .fp-ci-uc-h3 { font-size: 17px; font-weight: 700; color: #0F172A; margin-bottom: 10px; line-height: 1.3; }
    .fp-ci-uc-p { font-size: 14px; color: #475569; line-height: 1.7; }

    /* ── How it works ───────────────────────────────────── */
    .fp-ci-hiw-steps { display: flex; flex-direction: column; gap: 0; position: relative; }
    .fp-ci-hiw-steps::before {
        content: ''; position: absolute; left: 27px; top: 0; bottom: 0;
        width: 2px; background: linear-gradient(to bottom, #2563eb, #1d4ed8);
        opacity: .2;
    }
    .fp-ci-hiw-step { display: flex; gap: 26px; padding: 30px 0; border-bottom: 1px solid #E2E8F0; }
    .fp-ci-hiw-step:last-child { border-bottom: none; }
    .fp-ci-step-num {
        width: 54px; height: 54px; flex-shrink: 0;
        background: #eff6ff; border: 2px solid #bfdbfe;
        border-radius: 14px; display: flex; align-items: center;
        justify-content: center; font-size: 22px; font-weight: 800; color: #1d4ed8;
    }
    .fp-ci-step-content { flex: 1; padding-top: 6px; }
    .fp-ci-step-title { font-size: 19px; font-weight: 700; color: #0F172A; margin-bottom: 6px; }
    .fp-ci-step-desc { font-size: 14px; color: #475569; line-height: 1.7; }
    .fp-ci-step-outcome {
        display: inline-flex; align-items: center; gap: 6px;
        background: rgba(22,163,74,.1); color: #15803d;
        font-size: 12px; font-weight: 600; padding: 4px 11px;
        border-radius: 6px; margin-top: 10px;
    }

    /* ── CTA ────────────────────────────────────────────── */
    .fp-ci-cta-section {
        background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 55%, #60a5fa 100%);
        padding: 96px 24px; text-align: center; position: relative; overflow: hidden;
    }
    .fp-ci-cta-section::before {
        content: ''; position: absolute; inset: 0;
        background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
            linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
        background-size: 40px 40px;
    }
    .fp-ci-cta-inner { max-width: 640px; margin: 0 auto; position: relative; z-index: 1; }
    .fp-ci-cta-h2 { font-size: clamp(26px,3.5vw,42px); font-weight: 800; color: #fff; letter-spacing: -0.03em; margin-bottom: 14px; }
    .fp-ci-cta-sub { font-size: 17px; color: rgba(255,255,255,.7); margin-bottom: 38px; line-height: 1.7; }
    .fp-ci-cta-search {
        display: flex; align-items: center; gap: 10px;
        background: #fff; border-radius: 14px;
        padding: 10px 14px 10px 18px;
        box-shadow: 0 8px 32px rgba(0,0,0,.2);
        margin-bottom: 20px;
    }
    .fp-ci-cta-search svg { color: #94A3B8; flex-shrink: 0; }
    .fp-ci-cta-search input {
        flex: 1; border: none; outline: none; font-size: 15px;
        color: #1E293B; font-family: inherit; background: none;
    }
    .fp-ci-cta-search input::placeholder { color: #94A3B8; }
    .fp-ci-cta-search-btn {
        padding: 10px 22px; background: #2563eb; color: #fff;
        font-size: 14px; font-weight: 700; border: none;
        border-radius: 10px; cursor: pointer; white-space: nowrap;
        transition: background .15s; text-decoration: none;
    }
    .fp-ci-cta-search-btn:hover { background: #1d4ed8; }
    .fp-ci-cta-btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
    .fp-ci-btn-cta-w {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 15px 32px; background: #fff; color: #1d4ed8;
        font-size: 15px; font-weight: 800; border-radius: 14px;
        text-decoration: none; transition: all .2s;
    }
    .fp-ci-btn-cta-w:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(0,0,0,.18); }
    .fp-ci-btn-cta-outline {
        display: inline-flex; align-items: center; gap: 8px;
        padding: 15px 26px; background: rgba(255,255,255,.12); color: #fff;
        font-size: 15px; font-weight: 600; border-radius: 14px;
        text-decoration: none; border: 1px solid rgba(255,255,255,.25); transition: all .2s;
    }
    .fp-ci-btn-cta-outline:hover { background: rgba(255,255,255,.2); transform: translateY(-2px); }
    .fp-ci-cta-note { margin-top: 20px; font-size: 13px; color: rgba(255,255,255,.45); }

    /* ── Scroll reveal ─────────────────────────────────── */
    .fp-ci-reveal { opacity: 1; transform: translateY(0); transition: opacity .65s ease, transform .65s ease; }
    .fp-ci-visible { opacity: 1; transform: translateY(0); }
    .fp-ci-reveal-d1 { transition-delay: .1s; }
    .fp-ci-reveal-d2 { transition-delay: .2s; }

    /* ── Responsive ────────────────────────────────────── */
    @media (max-width: 1000px) {
        .fp-ci-hero-inner { grid-template-columns: 1fr; }
        .fp-ci-hero-dashboard { display: none; }
        .fp-ci-intel-grid { grid-template-columns: 1fr 1fr; }
        .fp-ci-uc-grid { grid-template-columns: 1fr 1fr; }
        .fp-ci-sp-grid { grid-template-columns: 1fr; }
        .fp-ci-sp-card { border-right: none; }
        .fp-ci-sp-card:nth-child(3) { border-bottom: 1px solid #E2E8F0; }
        .fp-ci-sp-header { flex-direction: column; align-items: flex-start; gap: 16px; }
        .fp-ci-sp-kpi-row { width: 100%; }
    }
    @media (max-width: 640px) {
        .fp-ci-hero { padding: 72px 20px 56px; }
        .fp-ci-hero-sub { font-size: 15px; }
        .fp-ci-hero-cta { flex-direction: column; }
        .fp-ci-btn-hero-primary, .fp-ci-btn-hero-secondary { justify-content: center; width: 100%; }
        .fp-ci-stats-inner { justify-content: center; }
        .fp-ci-stat-item { min-width: 140px; flex: 0 0 calc(50% - 10px); }
        .fp-ci-stat-num { font-size: 26px; }
        .fp-ci-section { padding: 56px 20px; }
        .fp-ci-section-h2 { font-size: clamp(22px, 6vw, 32px); }
        .fp-ci-section-hd { margin-bottom: 36px; }
        .fp-ci-intel-grid { grid-template-columns: 1fr; }
        .fp-ci-uc-grid { grid-template-columns: 1fr; }
        .fp-ci-sp-kpi-row { display: grid; grid-template-columns: 1fr 1fr; width: 100%; gap: 8px; }
        .fp-ci-sp-kpi { padding: 8px 6px; text-align: center; background: rgba(255,255,255,.1); border-radius: 6px; }
        .fp-ci-sp-kpi + .fp-ci-sp-kpi { border-left: none; }
        .fp-ci-sp-kv { font-size: 16px; }
        .fp-ci-cta-section { padding: 72px 20px; }
        .fp-ci-cta-search { flex-direction: column; }
        .fp-ci-cta-search input, .fp-ci-cta-search-btn { width: 100%; }
        .fp-ci-cta-btns { flex-direction: column; align-items: center; }
        .fp-ci-btn-cta-w, .fp-ci-btn-cta-outline { width: 100%; justify-content: center; }
        .fp-ci-hiw-step { flex-direction: column; align-items: flex-start; gap: 12px; }
        .fp-ci-hiw-steps::before { display: none; }
    }

/* ==================== STRATEGY ANALYSER REDESIGN ==================== */

    /* ─── Design Tokens (scoped) ──────────────────────────────── */
    :root {
      --fp-sa-blue: #2563eb;
      --fp-sa-blue-dark: #1d4ed8;
      --fp-sa-blue-light: #eff6ff;
      --fp-sa-blue-mid: #dbeafe;
      --fp-sa-slate50: #f8fafc;
      --fp-sa-slate100: #f1f5f9;
      --fp-sa-slate200: #e2e8f0;
      --fp-sa-slate400: #94a3b8;
      --fp-sa-slate500: #64748b;
      --fp-sa-slate600: #475569;
      --fp-sa-slate700: #334155;
      --fp-sa-slate800: #1e293b;
      --fp-sa-slate900: #0f172a;
      --fp-sa-green: #16a34a;
      --fp-sa-green-bg: #f0fdf4;
      --fp-sa-amber: #d97706;
      --fp-sa-amber-bg: #fffbeb;
      --fp-sa-red: #dc2626;
      --fp-sa-red-bg: #fef2f2;
      --fp-sa-radius-sm: 6px;
      --fp-sa-radius: 10px;
      --fp-sa-radius-lg: 16px;
      --fp-sa-radius-xl: 24px;
      --fp-sa-shadow-sm: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
      --fp-sa-shadow: 0 4px 16px rgba(0,0,0,.07);
      --fp-sa-shadow-lg: 0 12px 40px rgba(0,0,0,.10);
    }

    /* ─── Shared layout ───────────────────────────────────────── */
    .fp-sa-section { padding: 96px 0; }
    .fp-sa-section-sm { padding: 72px 0; }
    .fp-sa-section-alt { background: var(--fp-sa-slate50); }
    .fp-sa-text-center { text-align: center; }
    .fp-sa-text-center .fp-sa-section-subtitle { margin: 14px auto 0; }

    /* ─── Typography ──────────────────────────────────────────── */
    .fp-sa-eyebrow {
        display: inline-flex; align-items: center; gap: 8px;
        font-size: 13px; font-weight: 600; letter-spacing: .05em;
        text-transform: uppercase; color: var(--fp-sa-blue);
    }
    .fp-sa-eyebrow-dot {
        width: 6px; height: 6px; border-radius: 50%; background: var(--fp-sa-blue); flex-shrink: 0;
    }
    .fp-sa-section-title {
        font-size: clamp(28px, 3.5vw, 40px);
        font-weight: 800; line-height: 1.15; letter-spacing: -.02em;
        color: var(--fp-sa-slate900);
    }
    .fp-sa-section-subtitle {
        font-size: 17px; color: var(--fp-sa-slate600); max-width: 540px;
        line-height: 1.7; margin-top: 14px;
    }

    /* ─── Buttons ─────────────────────────────────────────────── */
    .fp-sa-btn {
        display: inline-flex; align-items: center; gap: 8px;
        font-family: inherit; font-size: 15px; font-weight: 600;
        padding: 13px 24px; border-radius: var(--fp-sa-radius); cursor: pointer;
        border: none; transition: all .18s ease; white-space: nowrap;
        text-decoration: none;
    }
    .fp-sa-btn-primary { background: var(--fp-sa-blue); color: #fff; }
    .fp-sa-btn-primary:hover { background: var(--fp-sa-blue-dark); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(37,99,235,.3); }
    .fp-sa-btn-outline {
        background: transparent; color: var(--fp-sa-slate700);
        border: 1.5px solid var(--fp-sa-slate200);
    }
    .fp-sa-btn-outline:hover { border-color: var(--fp-sa-blue); color: var(--fp-sa-blue); background: var(--fp-sa-blue-light); }
    .fp-sa-btn-lg { font-size: 16px; padding: 15px 28px; }
    .fp-sa-btn svg { flex-shrink: 0; }

    /* ─── Hero ────────────────────────────────────────────────── */
    .fp-sa-hero {
        background: linear-gradient(160deg, #eff6ff 0%, #ffffff 55%);
        padding: 88px 0 80px;
        border-bottom: 1px solid var(--fp-sa-slate200);
    }
    .fp-sa-hero-inner {
        max-width: 1120px; margin: 0 auto; padding: 0 24px;
        display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center;
    }
    .fp-sa-hero-title {
        font-size: clamp(36px, 5vw, 58px);
        font-weight: 800; line-height: 1.1; letter-spacing: -.02em;
        color: var(--fp-sa-slate900); margin-top: 16px;
    }
    .fp-sa-hero-subtitle {
        font-size: 18px; color: var(--fp-sa-slate600); max-width: 560px;
        line-height: 1.7; margin-top: 20px;
    }
    .fp-sa-hero-ctas { display: flex; align-items: center; gap: 12px; margin-top: 32px; flex-wrap: wrap; }

    /* ─── Stats Bar ───────────────────────────────────────────── */
    .fp-sa-stats-bar { background: var(--fp-sa-blue); padding: 32px 0; }
    .fp-sa-stats-grid {
        display: grid; grid-template-columns: repeat(4, 1fr);
        gap: 0; max-width: 1120px; margin: 0 auto; padding: 0 24px;
    }
    .fp-sa-stat-item {
        text-align: center; padding: 0 20px;
        border-right: 1px solid rgba(255,255,255,.2);
    }
    .fp-sa-stat-item:last-child { border-right: none; }
    .fp-sa-stat-number { font-size: 32px; font-weight: 800; color: #fff; letter-spacing: -.02em; line-height: 1; }
    .fp-sa-stat-label { font-size: 13px; color: rgba(255,255,255,.75); margin-top: 6px; font-weight: 500; }

    /* ─── Product Preview ─────────────────────────────────────── */
    .fp-sa-product-preview {
        background: var(--fp-sa-slate50);
        padding: 96px 0;
        border-bottom: 1px solid var(--fp-sa-slate200);
    }
    .fp-sa-preview-header { text-align: center; margin-bottom: 56px; }
    .fp-sa-preview-wrapper {
        background: #fff;
        border: 1px solid var(--fp-sa-slate200);
        border-radius: var(--fp-sa-radius-xl);
        overflow: hidden;
        box-shadow: var(--fp-sa-shadow-lg);
    }

    /* Browser chrome */
    .fp-sa-browser-bar {
        background: var(--fp-sa-slate100); border-bottom: 1px solid var(--fp-sa-slate200);
        padding: 10px 16px; display: flex; align-items: center; gap: 10px;
    }
    .fp-sa-browser-dots { display: flex; gap: 6px; }
    .fp-sa-browser-dot { width: 10px; height: 10px; border-radius: 50%; }
    .fp-sa-browser-dot-r { background: #ff5f57; }
    .fp-sa-browser-dot-y { background: #ffbd2e; }
    .fp-sa-browser-dot-g { background: #28ca41; }
    .fp-sa-browser-url {
        flex: 1; background: #fff; border: 1px solid var(--fp-sa-slate200);
        border-radius: var(--fp-sa-radius-sm); padding: 4px 12px;
        font-size: 12px; color: var(--fp-sa-slate400); font-family: monospace;
        max-width: 420px; margin: 0 auto;
    }

    /* Mock tabs */
    .fp-sa-mock-tabs {
        background: #fff; border-bottom: 1px solid var(--fp-sa-slate200);
        padding: 0 24px; display: flex; gap: 0; overflow-x: auto;
    }
    .fp-sa-mock-tab {
        padding: 14px 18px; font-size: 13px; font-weight: 500;
        color: var(--fp-sa-slate500); border-bottom: 2px solid transparent;
        white-space: nowrap; cursor: default;
    }
    .fp-sa-mock-tab-active {
        color: var(--fp-sa-blue); border-bottom-color: var(--fp-sa-blue); font-weight: 600;
    }

    /* Mock content area */
    .fp-sa-mock-content { padding: 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    .fp-sa-mock-card {
        background: #fff; border: 1px solid var(--fp-sa-slate200);
        border-radius: var(--fp-sa-radius); padding: 20px; box-shadow: var(--fp-sa-shadow-sm);
    }
    .fp-sa-mock-card-title {
        font-size: 11px; font-weight: 600; text-transform: uppercase;
        letter-spacing: .06em; color: var(--fp-sa-slate400); margin-bottom: 14px;
        display: flex; align-items: center; gap: 8px;
    }
    .fp-sa-mock-card-title svg { color: var(--fp-sa-blue); }
    .fp-sa-mock-prob-row { display: flex; align-items: center; gap: 16px; }
    .fp-sa-mock-gauge {
        width: 68px; height: 68px; flex-shrink: 0;
        border-radius: 50%; display: flex; align-items: center; justify-content: center;
        background: conic-gradient(var(--fp-sa-blue) 0% 70%, var(--fp-sa-slate200) 70% 100%);
        position: relative;
    }
    .fp-sa-mock-gauge-inner {
        width: 50px; height: 50px; border-radius: 50%; background: #fff;
        display: flex; align-items: center; justify-content: center;
        font-size: 14px; font-weight: 800; color: var(--fp-sa-blue);
    }
    .fp-sa-mock-prob-text { font-size: 12px; color: var(--fp-sa-slate600); margin-top: 8px; line-height: 1.5; }
    .fp-sa-mock-badge {
        display: inline-block; padding: 2px 10px; border-radius: 999px;
        font-size: 11px; font-weight: 600;
    }
    .fp-sa-mock-badge-amber { background: var(--fp-sa-amber-bg); color: var(--fp-sa-amber); }
    .fp-sa-mock-badge-green { background: var(--fp-sa-green-bg); color: var(--fp-sa-green); }
    .fp-sa-mock-badge-blue  { background: var(--fp-sa-blue-light); color: var(--fp-sa-blue); }
    .fp-sa-mock-badge-red   { background: var(--fp-sa-red-bg); color: var(--fp-sa-red); }

    /* Winning messages */
    .fp-sa-mock-messages { grid-column: 1 / -1; }
    .fp-sa-mock-msg-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 4px; }
    .fp-sa-mock-msg-item {
        background: var(--fp-sa-blue-light); border-radius: var(--fp-sa-radius-sm);
        padding: 12px 14px; display: flex; gap: 10px; align-items: flex-start;
    }
    .fp-sa-mock-msg-icon {
        width: 20px; height: 20px; border-radius: 50%; background: var(--fp-sa-blue);
        flex-shrink: 0; display: flex; align-items: center; justify-content: center;
    }
    .fp-sa-mock-msg-icon svg { color: #fff; }
    .fp-sa-mock-msg-text { font-size: 12px; color: var(--fp-sa-slate700); line-height: 1.45; font-weight: 500; }

    /* Opportunities / Challenges */
    .fp-sa-mock-opps-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; grid-column: 1/-1; }
    .fp-sa-mock-list { list-style: none; display: flex; flex-direction: column; gap: 8px; margin-top: 4px; padding: 0; }
    .fp-sa-mock-list li { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--fp-sa-slate700); line-height: 1.4; }
    .fp-sa-mock-dot-green { width: 6px; height: 6px; border-radius: 50%; background: var(--fp-sa-green); margin-top: 5px; flex-shrink: 0; display: inline-block; }
    .fp-sa-mock-dot-amber { width: 6px; height: 6px; border-radius: 50%; background: var(--fp-sa-amber); margin-top: 5px; flex-shrink: 0; display: inline-block; }

    /* Recommendations */
    .fp-sa-mock-recs { grid-column: 1/-1; }
    .fp-sa-mock-rec-list { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }
    .fp-sa-mock-rec-item {
        border: 1px solid var(--fp-sa-slate200); border-radius: var(--fp-sa-radius-sm);
        padding: 10px 14px; display: flex; align-items: flex-start; gap: 10px;
    }
    .fp-sa-mock-rec-critical { border-left: 3px solid var(--fp-sa-red); }
    .fp-sa-mock-rec-medium  { border-left: 3px solid var(--fp-sa-amber); }
    .fp-sa-mock-rec-title { font-size: 12px; font-weight: 600; color: var(--fp-sa-slate800); }
    .fp-sa-mock-rec-desc  { font-size: 11px; color: var(--fp-sa-slate500); margin-top: 2px; line-height: 1.4; }
    .fp-sa-mock-rec-badges { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
    .fp-sa-mock-rec-num {
        width: 20px; height: 20px; border-radius: 50%; background: var(--fp-sa-slate100);
        flex-shrink: 0; display: flex; align-items: center; justify-content: center;
        font-size: 11px; font-weight: 700; color: var(--fp-sa-slate600); margin-top: 1px;
    }

    /* Annotations */
    .fp-sa-annotations { display: flex; gap: 24px; margin-top: 32px; flex-wrap: wrap; justify-content: center; }
    .fp-sa-annotation {
        display: flex; align-items: center; gap: 10px;
        background: #fff; border: 1px solid var(--fp-sa-slate200);
        border-radius: 999px; padding: 8px 18px;
        font-size: 13px; font-weight: 500; color: var(--fp-sa-slate700);
        box-shadow: var(--fp-sa-shadow-sm);
    }
    .fp-sa-annotation-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }

    /* ─── Benefits ────────────────────────────────────────────── */
    .fp-sa-benefits-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 48px; }
    .fp-sa-benefit-card {
        background: #fff; border: 1px solid var(--fp-sa-slate200);
        border-radius: var(--fp-sa-radius-lg); padding: 28px;
        transition: box-shadow .2s, transform .2s;
    }
    .fp-sa-benefit-card:hover { box-shadow: var(--fp-sa-shadow); transform: translateY(-2px); }
    .fp-sa-benefit-icon {
        width: 44px; height: 44px; border-radius: var(--fp-sa-radius);
        display: flex; align-items: center; justify-content: center;
        margin-bottom: 18px; flex-shrink: 0;
    }
    .fp-sa-benefit-icon-blue  { background: var(--fp-sa-blue-light); color: var(--fp-sa-blue); }
    .fp-sa-benefit-icon-green { background: var(--fp-sa-green-bg); color: var(--fp-sa-green); }
    .fp-sa-benefit-icon-amber { background: var(--fp-sa-amber-bg); color: var(--fp-sa-amber); }
    .fp-sa-benefit-card h3 { font-size: 16px; font-weight: 700; color: var(--fp-sa-slate900); margin-bottom: 10px; }
    .fp-sa-benefit-card p  { font-size: 14px; color: var(--fp-sa-slate600); line-height: 1.65; }

    /* ─── Bento Grid ──────────────────────────────────────────── */
    .fp-sa-bento-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-auto-rows: auto;
        gap: 16px;
        margin-top: 52px;
    }
    .fp-sa-bento-cell {
        background: #fff; border: 1px solid var(--fp-sa-slate200);
        border-radius: var(--fp-sa-radius-lg); padding: 24px;
        transition: box-shadow .2s;
    }
    .fp-sa-bento-cell:hover { box-shadow: var(--fp-sa-shadow); }
    .fp-sa-bento-wide { grid-column: span 2; }
    .fp-sa-bento-icon {
        width: 36px; height: 36px; border-radius: var(--fp-sa-radius-sm);
        background: var(--fp-sa-blue-light); color: var(--fp-sa-blue);
        display: flex; align-items: center; justify-content: center;
        margin-bottom: 14px;
    }
    .fp-sa-bento-icon-green { background: var(--fp-sa-green-bg); color: var(--fp-sa-green); }
    .fp-sa-bento-icon-amber { background: var(--fp-sa-amber-bg); color: var(--fp-sa-amber); }
    .fp-sa-bento-cell h4 { font-size: 14px; font-weight: 700; color: var(--fp-sa-slate900); margin-bottom: 6px; }
    .fp-sa-bento-cell p  { font-size: 13px; color: var(--fp-sa-slate500); line-height: 1.6; }
    .fp-sa-bento-tag {
        display: inline-flex; align-items: center; gap: 5px;
        background: var(--fp-sa-blue-light); color: var(--fp-sa-blue);
        font-size: 11px; font-weight: 600; padding: 3px 10px;
        border-radius: 999px; margin-top: 12px;
    }
    .fp-sa-bento-featured {
        background: var(--fp-sa-blue); border-color: var(--fp-sa-blue);
        grid-column: span 2; grid-row: span 2;
    }
    .fp-sa-bento-featured .fp-sa-bento-icon { background: rgba(255,255,255,.2); color: #fff; }
    .fp-sa-bento-featured h4 { color: #fff; font-size: 17px; }
    .fp-sa-bento-featured p  { color: rgba(255,255,255,.8); font-size: 14px; }
    .fp-sa-bento-featured .fp-sa-bento-tag { background: rgba(255,255,255,.2); color: #fff; }

    /* ─── Steps (horizontal) ──────────────────────────────────── */
    .fp-sa-steps-grid {
        display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
        margin-top: 52px; position: relative;
    }
    .fp-sa-steps-grid::before {
        content: '';
        position: absolute; top: 22px; left: calc(12.5% + 8px); right: calc(12.5% + 8px);
        height: 2px; background: var(--fp-sa-slate200); z-index: 0;
    }
    .fp-sa-step-item { text-align: center; padding: 0 16px; position: relative; z-index: 1; }
    .fp-sa-step-num {
        width: 44px; height: 44px; border-radius: 50%;
        background: var(--fp-sa-blue); color: #fff;
        font-size: 16px; font-weight: 800;
        display: flex; align-items: center; justify-content: center;
        margin: 0 auto 18px; box-shadow: 0 0 0 4px #fff, 0 0 0 5px var(--fp-sa-blue-mid);
    }
    .fp-sa-step-item h3 { font-size: 15px; font-weight: 700; color: var(--fp-sa-slate900); margin-bottom: 8px; }
    .fp-sa-step-item p  { font-size: 13px; color: var(--fp-sa-slate500); line-height: 1.6; }

    /* ─── Feature List (split layout) ─────────────────────────── */
    .fp-sa-feature-split {
        display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start;
    }
    .fp-sa-feature-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 48px; }
    .fp-sa-feature-item { display: flex; align-items: flex-start; gap: 10px; padding: 4px 0; }
    .fp-sa-feature-check {
        width: 20px; height: 20px; border-radius: 50%; background: var(--fp-sa-green-bg);
        color: var(--fp-sa-green); flex-shrink: 0; margin-top: 1px;
        display: flex; align-items: center; justify-content: center;
    }
    .fp-sa-feature-item span { font-size: 14px; color: var(--fp-sa-slate700); line-height: 1.5; }

    /* ─── Hero Visual (mockup in hero) ────────────────────────── */
    .fp-sa-hero-visual { /* shown by default, hidden on mobile */ }

    /* ─── Responsive ──────────────────────────────────────────── */
    @media (max-width: 1024px) {
        .fp-sa-bento-grid { grid-template-columns: repeat(2, 1fr); }
        .fp-sa-bento-featured { grid-column: span 2; }
    }
    @media (max-width: 900px) {
        .fp-sa-hero-inner { grid-template-columns: 1fr; gap: 40px; }
        .fp-sa-hero-visual { display: none; }
        .fp-sa-stats-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
        .fp-sa-stat-item { border-right: none; }
        .fp-sa-benefits-grid { grid-template-columns: repeat(2, 1fr); }
        .fp-sa-steps-grid { grid-template-columns: repeat(2, 1fr); gap: 32px; }
        .fp-sa-steps-grid::before { display: none; }
        .fp-sa-feature-split { grid-template-columns: 1fr; gap: 40px; }
    }
    @media (max-width: 640px) {
        .fp-sa-section { padding: 64px 0; }
        .fp-sa-benefits-grid { grid-template-columns: 1fr; }
        .fp-sa-bento-grid { grid-template-columns: 1fr; }
        .fp-sa-bento-wide, .fp-sa-bento-featured { grid-column: span 1; }
        .fp-sa-feature-cols { grid-template-columns: 1fr; }
        .fp-sa-mock-content { grid-template-columns: 1fr; }
        .fp-sa-mock-messages .fp-sa-mock-msg-grid { grid-template-columns: 1fr; }
        .fp-sa-mock-opps-row { grid-template-columns: 1fr; }
        .fp-sa-steps-grid { grid-template-columns: 1fr; }
        .fp-sa-hero-title { font-size: clamp(28px, 4vw, 36px); }
        .fp-sa-hero-ctas { flex-direction: column; width: 100%; }
        .fp-sa-hero-ctas .fp-sa-btn { width: 100%; justify-content: center; }
        .fp-sa-annotations { flex-direction: column; align-items: center; }
    }

    /* =================================================================
       AI MATCHING V3 REDESIGN — .fp- prefixed styles
       ================================================================= */

    /* CSS Variables for v3 */
    :root {
        --fp-blue-900: #1e3a8a; --fp-blue-800: #1e40af; --fp-blue-700: #1d4ed8;
        --fp-blue-600: #2563eb; --fp-blue-500: #3b82f6; --fp-blue-400: #60a5fa;
        --fp-blue-300: #93c5fd; --fp-blue-200: #bfdbfe; --fp-blue-100: #dbeafe;
        --fp-blue-50: #eff6ff;
        --fp-green: #10b981; --fp-green-dark: #059669;
        --fp-yellow: #f59e0b; --fp-red: #ef4444; --fp-orange: #f97316;
        --fp-slate-900: #0f172a; --fp-slate-800: #1e293b; --fp-slate-700: #334155;
        --fp-slate-600: #475569; --fp-slate-500: #64748b; --fp-slate-400: #94a3b8;
        --fp-slate-200: #e2e8f0; --fp-slate-100: #f1f5f9; --fp-slate-50: #f8fafc;
    }

    /* Section label v3 — pill badge */
    .fp-section-label-v3 {
        display: inline-block; font-size: 11px; font-weight: 700;
        letter-spacing: .1em; text-transform: uppercase;
        color: var(--fp-blue-600); background: var(--fp-blue-50);
        border: 1px solid var(--fp-blue-200);
        padding: 4px 12px; border-radius: 999px; margin-bottom: 16px;
    }
    .fp-section-label-white {
        background: rgba(255,255,255,.15); color: rgba(255,255,255,.9);
        border-color: rgba(255,255,255,.2);
    }

    /* ── HERO V3 ────────────────────────────────────────────────── */
    .fp-hero-v3 {
        background: linear-gradient(160deg, var(--fp-blue-50) 0%, #fff 60%);
        padding: 80px 0 60px; overflow: hidden; position: relative;
    }
    .fp-hero-v3::before {
        content: ''; position: absolute; top: -200px; right: -200px;
        width: 600px; height: 600px;
        background: radial-gradient(circle, rgba(37,99,235,.06) 0%, transparent 70%);
        pointer-events: none;
    }
    .fp-hero-v3-inner {
        display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center;
    }
    .fp-hero-v3-title {
        font-size: clamp(32px, 4vw, 52px); font-weight: 800; line-height: 1.12;
        letter-spacing: -.03em; color: var(--fp-slate-900); margin-bottom: 12px;
    }
    .fp-hero-problem {
        font-size: 15px; font-weight: 500; color: var(--fp-slate-600);
        background: var(--fp-slate-100); border-left: 3px solid var(--fp-blue-400);
        padding: 12px 16px; border-radius: 0 8px 8px 0; margin-bottom: 20px; line-height: 1.55;
    }
    .fp-hero-v3-sub {
        font-size: 17px; color: var(--fp-slate-600); line-height: 1.65; margin-bottom: 32px;
    }
    .fp-hero-v3-actions {
        display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 32px;
    }
    .fp-hero-trust {
        display: flex; align-items: center; gap: 8px; font-size: 13px;
        color: var(--fp-slate-500); flex-wrap: wrap;
    }
    .fp-hero-trust-dot {
        width: 6px; height: 6px; border-radius: 50%; background: var(--fp-slate-400);
    }

    /* Buttons v3 */
    .fp-btn-pro {
        display: inline-flex; align-items: center; gap: 8px; padding: 15px 30px;
        border-radius: 12px; font-size: 16px; font-weight: 600;
        background: linear-gradient(135deg, var(--fp-blue-700), var(--fp-blue-500));
        color: #fff; text-decoration: none; cursor: pointer; border: none;
        box-shadow: 0 8px 32px rgba(37,99,235,.30);
        transition: all .2s ease;
    }
    .fp-btn-pro:hover {
        transform: translateY(-2px); box-shadow: 0 14px 40px rgba(37,99,235,.40);
    }
    .fp-btn-secondary-v3 {
        display: inline-flex; align-items: center; gap: 8px; padding: 14px 28px;
        border-radius: 12px; font-size: 15px; font-weight: 600;
        background: #fff; color: var(--fp-blue-600);
        border: 2px solid var(--fp-blue-200); text-decoration: none; cursor: pointer;
        transition: all .2s ease;
    }
    .fp-btn-secondary-v3:hover {
        border-color: var(--fp-blue-400); background: var(--fp-blue-50);
        transform: translateY(-1px);
    }
    .fp-btn-white {
        display: inline-flex; align-items: center; gap: 8px; padding: 16px 36px;
        border-radius: 12px; font-size: 16px; font-weight: 600;
        background: #fff; color: var(--fp-blue-600); text-decoration: none; cursor: pointer;
        box-shadow: 0 8px 24px rgba(0,0,0,.15); transition: all .2s ease;
    }
    .fp-btn-white:hover { background: var(--fp-blue-50); transform: translateY(-2px); }
    .fp-btn-ghost-white {
        display: inline-flex; align-items: center; gap: 8px; padding: 16px 32px;
        border-radius: 12px; font-size: 16px; font-weight: 600;
        color: rgba(255,255,255,.85); border: 2px solid rgba(255,255,255,.3);
        text-decoration: none; cursor: pointer; transition: all .2s ease;
    }
    .fp-btn-ghost-white:hover { background: rgba(255,255,255,.1); transform: translateY(-1px); }

    /* ── HERO MATCH CARD ────────────────────────────────────────── */
    .fp-hero-demo {
        position: relative; display: flex; justify-content: center; align-items: center;
    }
    .fp-match-card {
        background: #fff; border: 2px solid var(--fp-blue-200); border-radius: 24px;
        box-shadow: 0 10px 40px rgba(0,0,0,.10), 0 0 0 4px rgba(37,99,235,.06);
        padding: 20px; width: 340px; animation: fpCardFloat 4s ease-in-out infinite;
        transition: all .3s ease; position: relative;
    }
    .fp-match-card:hover {
        transform: translateY(-6px) scale(1.01); box-shadow: 0 20px 60px rgba(37,99,235,.18);
    }
    @keyframes fpCardFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
    .fp-match-card-header {
        display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px;
    }
    .fp-match-score-ring { display: flex; align-items: center; gap: 10px; }
    .fp-ring-wrap { position: relative; width: 52px; height: 52px; }
    .fp-ring-wrap svg { transform: rotate(-90deg); }
    .fp-ring-bg { fill: none; stroke: var(--fp-slate-100); stroke-width: 4; }
    .fp-ring-fill {
        fill: none; stroke: url(#ringGradGreen); stroke-width: 4;
        stroke-linecap: round; stroke-dasharray: 138.2; stroke-dashoffset: 138.2;
        animation: fpRingDraw90 1.6s ease-out 0.4s forwards;
    }
    @keyframes fpRingDraw90 { to { stroke-dashoffset: 13.82; } }
    .fp-ring-label {
        position: absolute; inset: 0; display: flex; align-items: center;
        justify-content: center; font-size: 13px; font-weight: 800; color: var(--fp-green-dark);
    }
    .fp-match-score-info { display: flex; flex-direction: column; gap: 2px; }
    .fp-match-score-text {
        font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
    }
    .fp-match-score-tier { font-size: 12px; color: var(--fp-slate-500); font-weight: 500; }
    .fp-match-badge-new {
        background: linear-gradient(135deg, var(--fp-blue-600), var(--fp-blue-500));
        color: #fff; font-size: 10px; font-weight: 700; padding: 4px 10px;
        border-radius: 999px; letter-spacing: .06em;
        animation: fpPulse 2s ease-in-out infinite;
    }
    @keyframes fpPulse {
        0%, 100% { box-shadow: 0 0 0 0 rgba(37,99,235,.4); }
        50% { box-shadow: 0 0 0 6px rgba(37,99,235,0); }
    }
    .fp-match-tag {
        display: inline-flex; align-items: center; gap: 5px;
        font-size: 10px; font-weight: 700; color: var(--fp-blue-600);
        background: var(--fp-blue-50); border: 1px solid var(--fp-blue-200);
        padding: 3px 10px; border-radius: 6px; letter-spacing: .04em;
        text-transform: uppercase; margin-bottom: 10px;
    }
    .fp-match-title {
        font-size: 14px; font-weight: 700; color: var(--fp-slate-900);
        line-height: 1.4; margin-bottom: 4px;
    }
    .fp-match-org {
        font-size: 12px; color: var(--fp-blue-500); font-weight: 500; margin-bottom: 12px;
    }
    .fp-match-ai-rationale {
        background: var(--fp-blue-50); border: 1px solid var(--fp-blue-100);
        border-radius: 8px; padding: 10px 12px; margin-bottom: 12px;
    }
    .fp-match-ai-label {
        font-size: 10px; font-weight: 700; color: var(--fp-blue-500);
        letter-spacing: .06em; text-transform: uppercase; margin-bottom: 4px;
        display: flex; align-items: center; gap: 5px;
    }
    .fp-match-ai-text { font-size: 12px; color: var(--fp-slate-600); line-height: 1.55; }
    .fp-match-meta {
        display: flex; gap: 16px; margin-bottom: 14px; font-size: 12px;
    }
    .fp-match-meta-item {
        display: flex; align-items: center; gap: 5px; color: var(--fp-slate-600); font-weight: 500;
    }
    .fp-match-meta-value { font-weight: 700; color: var(--fp-blue-600); }
    .fp-match-meta-days { font-weight: 600; color: var(--fp-green); }
    .fp-match-actions { display: flex; gap: 8px; margin-bottom: 14px; }
    .fp-btn-details {
        flex: 1; padding: 9px 14px; border-radius: 8px; font-size: 12px; font-weight: 600;
        color: var(--fp-blue-600); border: 1.5px solid var(--fp-blue-200);
        background: #fff; text-align: center; cursor: pointer; transition: all .15s;
    }
    .fp-btn-details:hover { background: var(--fp-blue-50); }
    .fp-btn-pipeline {
        flex: 2; padding: 9px 14px; border-radius: 8px; font-size: 12px; font-weight: 600;
        color: #fff; background: var(--fp-blue-600); text-align: center;
        cursor: pointer; transition: all .15s;
    }
    .fp-btn-pipeline:hover { background: var(--fp-blue-700); }
    .fp-match-bid { border-top: 1px solid var(--fp-slate-100); padding-top: 12px; }
    .fp-match-bid-label {
        font-size: 11px; font-weight: 700; color: var(--fp-slate-500);
        letter-spacing: .04em; margin-bottom: 8px; text-transform: uppercase;
    }
    .fp-match-bid-buttons { display: flex; gap: 8px; }
    .fp-bid-btn {
        flex: 1; padding: 7px 0; border-radius: 8px; font-size: 12px; font-weight: 600;
        border: 1.5px solid; cursor: pointer; transition: all .15s; text-align: center;
    }
    .fp-bid-yes { color: var(--fp-green); border-color: #a7f3d0; background: #f0fdf4; }
    .fp-bid-yes:hover { background: var(--fp-green); color: #fff; border-color: var(--fp-green); }
    .fp-bid-maybe { color: var(--fp-yellow); border-color: #fde68a; background: #fffbeb; }
    .fp-bid-maybe:hover { background: var(--fp-yellow); color: #fff; border-color: var(--fp-yellow); }
    .fp-bid-no { color: var(--fp-red); border-color: #fecaca; background: #fff5f5; }
    .fp-bid-no:hover { background: var(--fp-red); color: #fff; border-color: var(--fp-red); }

    /* ── STATS STRIP ────────────────────────────────────────────── */
    .fp-stats-strip { background: var(--fp-blue-600); padding: 32px 0; }
    .fp-stats-v3-grid {
        display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; text-align: center;
    }
    .fp-stats-v3-value {
        font-size: 36px; font-weight: 800; color: #fff; letter-spacing: -.02em; line-height: 1.1;
    }
    .fp-stats-v3-label { font-size: 13px; color: var(--fp-blue-200); font-weight: 500; margin-top: 4px; }
    .fp-stats-v3-source { font-size: 11px; color: rgba(255,255,255,.45); margin-top: 2px; }

    /* ── BEFORE / AFTER ─────────────────────────────────────────── */
    .fp-before-after { padding: 80px 0; background: #fff; }
    .fp-ba-title {
        font-size: clamp(28px, 3.5vw, 40px); font-weight: 800;
        letter-spacing: -.025em; color: var(--fp-slate-900); margin-top: 8px;
    }
    .fp-ba-grid {
        display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch;
        border: 1px solid var(--fp-slate-200); border-radius: 24px; overflow: hidden;
        box-shadow: 0 4px 16px rgba(0,0,0,.08);
    }
    .fp-ba-col { padding: 40px 36px; }
    .fp-ba-before { background: var(--fp-slate-50); }
    .fp-ba-after { background: var(--fp-blue-600); }
    .fp-ba-divider {
        width: 1px; background: var(--fp-slate-200); position: relative;
        display: flex; align-items: center;
    }
    .fp-ba-divider-badge {
        position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
        background: #fff; border: 2px solid var(--fp-blue-200); color: var(--fp-blue-600);
        font-size: 13px; font-weight: 800; width: 44px; height: 44px; border-radius: 50%;
        display: flex; align-items: center; justify-content: center; z-index: 2;
    }
    .fp-ba-head {
        font-size: 12px; font-weight: 700; letter-spacing: .08em;
        text-transform: uppercase; margin-bottom: 20px;
    }
    .fp-ba-before .fp-ba-head { color: var(--fp-slate-400); }
    .fp-ba-after .fp-ba-head { color: rgba(255,255,255,.6); }
    .fp-ba-item {
        display: flex; align-items: flex-start; gap: 10px; margin-bottom: 16px;
        font-size: 14px; line-height: 1.5;
    }
    .fp-ba-before .fp-ba-item { color: var(--fp-slate-600); }
    .fp-ba-after .fp-ba-item { color: rgba(255,255,255,.9); }
    .fp-ba-icon {
        width: 20px; height: 20px; min-width: 20px; border-radius: 50%;
        display: flex; align-items: center; justify-content: center;
        flex-shrink: 0; font-size: 10px; margin-top: 2px;
    }
    .fp-ba-icon-x { background: #fee2e2; color: var(--fp-red); }
    .fp-ba-icon-ok { background: rgba(255,255,255,.2); color: #fff; }

    /* ── PRO DEMO SECTION ───────────────────────────────────────── */
    .fp-demo-section {
        padding: 80px 0; background: linear-gradient(180deg, var(--fp-blue-50) 0%, #fff 100%);
    }
    .fp-demo-header { text-align: center; margin-bottom: 40px; }
    .fp-demo-header-title {
        font-size: clamp(28px, 3.5vw, 42px); font-weight: 800;
        letter-spacing: -.025em; color: var(--fp-slate-900);
    }
    .fp-demo-header-sub {
        font-size: 17px; color: var(--fp-slate-500); margin-top: 12px;
        max-width: 580px; margin-left: auto; margin-right: auto;
    }

    /* Pro banner */
    .fp-pro-banner {
        display: flex; align-items: center; justify-content: space-between;
        background: linear-gradient(135deg, var(--fp-blue-700), var(--fp-blue-600));
        border-radius: 16px; padding: 14px 24px; margin-bottom: 24px;
    }
    .fp-pro-banner-left { display: flex; align-items: center; gap: 12px; }
    .fp-pro-badge-pill {
        background: rgba(255,255,255,.2); color: #fff; font-size: 11px; font-weight: 800;
        padding: 4px 12px; border-radius: 999px; letter-spacing: .06em;
        border: 1px solid rgba(255,255,255,.3);
    }
    .fp-pro-banner-text { font-size: 14px; font-weight: 600; color: rgba(255,255,255,.9); }
    .fp-pro-banner-sub { font-size: 12px; color: rgba(255,255,255,.6); margin-top: 2px; }
    .fp-pro-banner-cta {
        background: rgba(255,255,255,.15); color: white; font-size: 12px; font-weight: 700;
        padding: 8px 18px; border-radius: 8px; border: 1px solid rgba(255,255,255,.3);
        white-space: nowrap; text-decoration: none; transition: all .15s;
    }
    .fp-pro-banner-cta:hover { background: rgba(255,255,255,.25); }

    /* Summary tiles */
    .fp-demo-summary-row {
        display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 24px;
    }
    .fp-summary-tile { border-radius: 12px; padding: 16px 20px; border: 1px solid; }
    .fp-summary-tile-label {
        font-size: 11px; font-weight: 700; text-transform: uppercase;
        letter-spacing: .06em; margin-bottom: 6px;
    }
    .fp-summary-tile-value { font-size: 28px; font-weight: 800; line-height: 1; margin-bottom: 3px; }
    .fp-summary-tile-range { font-size: 11px; }
    .fp-tile-perfect { background: #f0fdf4; border-color: #a7f3d0; }
    .fp-tile-perfect .fp-summary-tile-label { color: #047857; }
    .fp-tile-perfect .fp-summary-tile-value { color: #059669; }
    .fp-tile-perfect .fp-summary-tile-range { color: #6ee7b7; }
    .fp-tile-strong { background: var(--fp-blue-50); border-color: var(--fp-blue-200); }
    .fp-tile-strong .fp-summary-tile-label { color: var(--fp-blue-700); }
    .fp-tile-strong .fp-summary-tile-value { color: var(--fp-blue-600); }
    .fp-tile-strong .fp-summary-tile-range { color: var(--fp-blue-300); }
    .fp-tile-possible { background: #fffbeb; border-color: #fde68a; }
    .fp-tile-possible .fp-summary-tile-label { color: #92400e; }
    .fp-tile-possible .fp-summary-tile-value { color: var(--fp-yellow); }
    .fp-tile-possible .fp-summary-tile-range { color: #fcd34d; }
    .fp-tile-weak { background: var(--fp-slate-50); border-color: var(--fp-slate-200); }
    .fp-tile-weak .fp-summary-tile-label { color: var(--fp-slate-500); }
    .fp-tile-weak .fp-summary-tile-value { color: var(--fp-slate-400); }
    .fp-tile-weak .fp-summary-tile-range { color: var(--fp-slate-400); }

    /* Country tabs */
    .fp-demo-country-tabs {
        display: flex; gap: 8px; align-items: center; margin-bottom: 20px; flex-wrap: wrap;
    }
    .fp-country-tab {
        display: flex; align-items: center; gap: 6px; padding: 6px 14px;
        border-radius: 999px; font-size: 13px; font-weight: 600;
        border: 1.5px solid; transition: all .15s; cursor: pointer;
    }
    .fp-country-tab-active {
        background: var(--fp-blue-600); color: #fff; border-color: var(--fp-blue-600);
    }
    .fp-country-tab-inactive {
        background: #fff; color: var(--fp-slate-600); border-color: var(--fp-slate-200);
    }
    .fp-country-tab-inactive:hover {
        border-color: var(--fp-blue-300); color: var(--fp-blue-600);
    }
    .fp-country-tab-soon {
        font-size: 10px; background: var(--fp-slate-100); color: var(--fp-slate-500);
        padding: 2px 6px; border-radius: 4px; margin-left: 4px;
    }

    /* Pro cards grid */
    .fp-pro-cards-grid {
        display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-bottom: 16px;
    }
    .fp-country-cards { display: none; }
    .fp-pro-card {
        background: #fff; border-radius: 16px; box-shadow: 0 1px 3px rgba(0,0,0,.08);
        border: 1.5px solid var(--fp-slate-200); padding: 16px;
        transition: transform .2s, box-shadow .2s;
    }
    .fp-pro-card:hover {
        transform: translateY(-3px); box-shadow: 0 4px 16px rgba(0,0,0,.08);
        border-color: var(--fp-blue-200);
    }
    .fp-pc-highlight {
        border-color: var(--fp-blue-300);
        box-shadow: 0 4px 16px rgba(0,0,0,.08), 0 0 0 3px rgba(37,99,235,.07);
    }
    .fp-pc-highlight-green {
        border-color: #6ee7b7;
        box-shadow: 0 4px 16px rgba(0,0,0,.08), 0 0 0 3px rgba(16,185,129,.07);
    }
    .fp-pc-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
    .fp-pc-score { display: flex; align-items: center; gap: 7px; }
    .fp-mini-ring { position: relative; width: 40px; height: 40px; }
    .fp-mini-ring svg { transform: rotate(-90deg); }
    .fp-mini-ring-label {
        position: absolute; inset: 0; display: flex; align-items: center;
        justify-content: center; font-size: 10px; font-weight: 800;
    }
    .fp-pc-score-info { display: flex; flex-direction: column; gap: 1px; }
    .fp-pc-match-text { font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
    .fp-pc-tier-text { font-size: 10px; color: var(--fp-slate-500); }
    .fp-pc-new {
        background: linear-gradient(135deg, var(--fp-blue-600), var(--fp-blue-500));
        color: #fff; font-size: 9px; font-weight: 700; padding: 3px 8px;
        border-radius: 999px; letter-spacing: .05em;
    }
    .fp-pc-tags { display: flex; gap: 5px; margin-bottom: 8px; flex-wrap: wrap; }
    .fp-pc-tag {
        font-size: 9px; font-weight: 700; padding: 2px 7px; border-radius: 4px;
        letter-spacing: .04em; text-transform: uppercase;
    }
    .fp-pc-tag-services {
        background: var(--fp-blue-50); color: var(--fp-blue-600); border: 1px solid var(--fp-blue-200);
    }
    .fp-pc-tag-closing {
        background: #fff7ed; color: #c2410c; border: 1px solid #fed7aa;
    }
    .fp-pc-tag-eu {
        background: #dbeafe; color: #1e40af; border: 1px solid #bfdbfe;
    }
    .fp-pc-title {
        font-size: 11px; font-weight: 700; color: var(--fp-slate-900);
        line-height: 1.4; margin-bottom: 6px;
    }
    .fp-pc-org { font-size: 10px; color: var(--fp-blue-500); font-weight: 500; margin-bottom: 6px; }
    .fp-pc-rationale {
        background: var(--fp-blue-50); border: 1px solid var(--fp-blue-100);
        border-radius: 6px; padding: 7px 9px; margin-bottom: 8px;
    }
    .fp-pc-rationale-label {
        font-size: 9px; font-weight: 700; color: var(--fp-blue-500);
        letter-spacing: .06em; text-transform: uppercase; margin-bottom: 3px;
    }
    .fp-pc-rationale-text { font-size: 10px; color: var(--fp-slate-600); line-height: 1.5; }
    .fp-pc-meta { display: flex; justify-content: space-between; font-size: 10px; margin-bottom: 8px; }
    .fp-pc-meta-val { font-weight: 700; color: var(--fp-blue-600); }
    .fp-pc-meta-days { font-weight: 600; }
    .fp-pc-days-soon { color: var(--fp-red); }
    .fp-pc-days-ok { color: var(--fp-green); }
    .fp-pc-actions { display: flex; gap: 6px; margin-bottom: 8px; }
    .fp-pc-btn-view {
        flex: 1; padding: 6px; border-radius: 6px; font-size: 10px; font-weight: 600;
        color: var(--fp-blue-600); border: 1.5px solid var(--fp-blue-200);
        background: #fff; text-align: center; cursor: pointer; transition: all .15s;
    }
    .fp-pc-btn-view:hover { background: var(--fp-blue-50); }
    .fp-pc-btn-add {
        flex: 2; padding: 6px; border-radius: 6px; font-size: 10px; font-weight: 600;
        color: #fff; background: var(--fp-blue-600); text-align: center;
        cursor: pointer; transition: all .15s;
    }
    .fp-pc-btn-add:hover { background: var(--fp-blue-700); }
    .fp-pc-bid { display: flex; gap: 5px; }
    .fp-pc-bid-btn {
        flex: 1; padding: 5px 0; border-radius: 5px; font-size: 10px; font-weight: 600;
        border: 1.5px solid; cursor: pointer; transition: all .15s; text-align: center;
    }
    .fp-pc-bid-yes { color: var(--fp-green); border-color: #a7f3d0; background: #f0fdf4; }
    .fp-pc-bid-yes:hover { background: var(--fp-green); color: #fff; border-color: var(--fp-green); }
    .fp-pc-bid-maybe { color: var(--fp-yellow); border-color: #fde68a; background: #fffbeb; }
    .fp-pc-bid-maybe:hover { background: var(--fp-yellow); color: #fff; border-color: var(--fp-yellow); }
    .fp-pc-bid-no { color: var(--fp-red); border-color: #fecaca; background: #fff5f5; }
    .fp-pc-bid-no:hover { background: var(--fp-red); color: #fff; border-color: var(--fp-red); }

    .fp-demo-footer-note {
        text-align: center; font-size: 13px; color: var(--fp-slate-500); margin-top: 20px;
    }

    /* ── BENEFITS V3 ────────────────────────────────────────────── */
    .fp-benefits-section-v3 { padding: 80px 0; background: #fff; }
    .fp-benefits-header-v3 { text-align: center; margin-bottom: 56px; }
    .fp-benefits-header-title {
        font-size: clamp(28px, 3.5vw, 42px); font-weight: 800;
        letter-spacing: -.025em; color: var(--fp-slate-900);
    }
    .fp-benefits-header-sub {
        font-size: 17px; color: var(--fp-slate-500); margin-top: 12px;
        max-width: 560px; margin-left: auto; margin-right: auto;
    }
    .fp-benefits-grid-v3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
    .fp-benefit-card-v3 {
        background: #fff; border: 1.5px solid var(--fp-slate-200); border-radius: 16px;
        padding: 28px 24px; transition: all .2s;
    }
    .fp-benefit-card-v3:hover {
        border-color: var(--fp-blue-300); box-shadow: 0 4px 16px rgba(0,0,0,.08);
        transform: translateY(-3px);
    }
    .fp-benefit-icon-v3 {
        width: 44px; height: 44px; background: var(--fp-blue-50); border-radius: 8px;
        display: flex; align-items: center; justify-content: center; margin-bottom: 16px;
        font-size: 20px;
    }
    .fp-benefit-title-v3 { font-size: 16px; font-weight: 700; color: var(--fp-slate-900); margin-bottom: 8px; }
    .fp-benefit-desc-v3 { font-size: 14px; color: var(--fp-slate-500); line-height: 1.6; }

    /* ── HOW IT WORKS V3 — horizontal cards ─────────────────────── */
    .fp-how-section-v3 { padding: 80px 0; background: var(--fp-slate-50); }
    .fp-how-header-v3 { text-align: center; margin-bottom: 56px; }
    .fp-how-header-title {
        font-size: clamp(28px, 3.5vw, 42px); font-weight: 800;
        letter-spacing: -.025em; color: var(--fp-slate-900);
    }
    .fp-how-grid-v3 {
        display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; position: relative;
    }
    .fp-how-grid-v3::before {
        content: ''; position: absolute; top: 28px;
        left: calc(12.5% + 20px); right: calc(12.5% + 20px);
        height: 2px;
        background: linear-gradient(90deg, var(--fp-blue-200), var(--fp-blue-400), var(--fp-blue-200));
        z-index: 0;
    }
    .fp-how-step-v3 {
        background: #fff; border: 1.5px solid var(--fp-slate-200); border-radius: 16px;
        padding: 24px 20px; text-align: center; position: relative; z-index: 1;
        transition: all .2s;
    }
    .fp-how-step-v3:hover {
        border-color: var(--fp-blue-300); box-shadow: 0 4px 16px rgba(0,0,0,.08);
        transform: translateY(-3px);
    }
    .fp-how-step-num {
        width: 52px; height: 52px; background: var(--fp-blue-600); color: #fff;
        border-radius: 50%; display: flex; align-items: center; justify-content: center;
        font-size: 18px; font-weight: 800; margin: 0 auto 16px;
        box-shadow: 0 8px 32px rgba(37,99,235,.20);
    }
    .fp-how-step-title { font-size: 15px; font-weight: 700; color: var(--fp-slate-900); margin-bottom: 8px; }
    .fp-how-step-desc { font-size: 13px; color: var(--fp-slate-500); line-height: 1.6; }

    /* ── FEATURES CHECKLIST V3 ──────────────────────────────────── */
    .fp-features-section-v3 {
        padding: 80px 0; background: #fff; border-top: 1px solid var(--fp-slate-100);
    }
    .fp-features-header-title {
        font-size: clamp(26px, 3vw, 40px); font-weight: 800;
        letter-spacing: -.025em; color: var(--fp-slate-900); margin-top: 8px;
    }
    .fp-features-header-sub {
        color: var(--fp-slate-500); font-size: 16px; margin-top: 12px;
        max-width: 560px; margin-left: auto; margin-right: auto;
    }
    .fp-feat-grid-v3 {
        display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;
        max-width: 840px; margin: 0 auto;
    }
    .fp-feat-item-v3 {
        display: flex; align-items: flex-start; gap: 12px; padding: 14px 18px;
        background: var(--fp-blue-50); border: 1px solid var(--fp-blue-100);
        border-radius: 12px;
    }
    .fp-feat-check {
        color: var(--fp-green-dark); font-size: 16px; font-weight: 700;
        flex-shrink: 0; line-height: 1.5;
    }
    .fp-feat-item-v3 span:last-child {
        font-size: 14px; color: var(--fp-slate-700); line-height: 1.55;
    }

    /* ── PRICING SECTION V3 ─────────────────────────────────────── */
    .fp-pricing-section { padding: 80px 0; background: #fff; }
    .fp-pricing-header { text-align: center; margin-bottom: 56px; }
    .fp-pricing-header-title {
        font-size: clamp(28px, 3.5vw, 42px); font-weight: 800;
        letter-spacing: -.025em; color: var(--fp-slate-900);
    }
    .fp-pricing-header-sub {
        font-size: 17px; color: var(--fp-slate-500); margin-top: 12px;
        max-width: 580px; margin-left: auto; margin-right: auto;
    }
    .fp-pricing-grid {
        display: grid; grid-template-columns: 1fr 1.1fr; gap: 20px;
        max-width: 760px; margin: 0 auto; align-items: start;
    }
    .fp-pricing-card {
        border-radius: 24px; padding: 28px 24px; border: 2px solid var(--fp-slate-200);
        position: relative; transition: all .2s;
    }
    .fp-pricing-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.08); }
    .fp-pricing-free .fp-pricing-tier-name { color: var(--fp-slate-500); }
    .fp-pricing-free .fp-pricing-price { color: var(--fp-slate-900); }
    .fp-pricing-free .fp-pricing-period { color: var(--fp-slate-400); }
    .fp-pricing-free .fp-pricing-credits {
        background: var(--fp-slate-100); color: var(--fp-slate-600);
    }
    .fp-pricing-pro {
        background: var(--fp-blue-600); border-color: var(--fp-blue-600);
        box-shadow: 0 16px 48px rgba(37,99,235,.30); transform: scale(1.03);
    }
    .fp-pricing-pro:hover {
        transform: scale(1.05); box-shadow: 0 20px 56px rgba(37,99,235,.38);
    }
    .fp-pricing-pro .fp-pricing-tier-name { color: rgba(255,255,255,.7); }
    .fp-pricing-pro .fp-pricing-price { color: #fff; }
    .fp-pricing-pro .fp-pricing-period { color: rgba(255,255,255,.6); }
    .fp-pricing-pro .fp-pricing-credits {
        background: rgba(255,255,255,.15); color: #fff;
    }
    .fp-pricing-badge {
        position: absolute; top: -14px; left: 50%; transform: translateX(-50%);
        background: var(--fp-orange); color: #fff; font-size: 11px; font-weight: 700;
        padding: 5px 16px; border-radius: 999px; letter-spacing: .04em; white-space: nowrap;
    }
    .fp-pricing-tier-name {
        font-size: 13px; font-weight: 700; letter-spacing: .07em;
        text-transform: uppercase; margin-bottom: 10px;
    }
    .fp-pricing-price {
        font-size: 42px; font-weight: 800; letter-spacing: -.03em; line-height: 1; margin-bottom: 2px;
    }
    .fp-pricing-period { font-size: 14px; margin-bottom: 20px; }
    .fp-pricing-credits {
        display: inline-flex; align-items: center; gap: 6px; font-size: 12px;
        font-weight: 600; padding: 4px 12px; border-radius: 999px; margin-bottom: 20px;
    }
    .fp-pricing-items {
        list-style: none; display: flex; flex-direction: column; gap: 0; margin-bottom: 24px;
        padding: 0;
    }
    .fp-pricing-item {
        display: flex; align-items: flex-start; gap: 8px; padding: 9px 0;
        font-size: 13px; border-bottom: 1px solid;
    }
    .fp-pricing-item:last-child { border-bottom: none; }
    .fp-pricing-free .fp-pricing-item { color: var(--fp-slate-600); border-color: var(--fp-slate-100); }
    .fp-pricing-pro .fp-pricing-item { color: rgba(255,255,255,.85); border-color: rgba(255,255,255,.12); }
    .fp-pricing-icon { flex-shrink: 0; font-weight: 700; font-size: 13px; }
    .fp-pricing-yes { color: var(--fp-green); }
    .fp-pricing-no { color: var(--fp-slate-400); }
    .fp-pricing-yes-pro { color: #a5f3fc; }
    .fp-pricing-tag-new {
        font-size: 9px; font-weight: 700; background: rgba(255,255,255,.2);
        color: #fff; padding: 2px 6px; border-radius: 4px; margin-left: 4px;
    }
    .fp-pricing-cta {
        width: 100%; padding: 12px; border-radius: 12px; font-size: 14px; font-weight: 700;
        text-align: center; cursor: pointer; transition: all .2s; display: block;
        text-decoration: none;
    }
    .fp-pricing-cta-free {
        background: #fff; color: var(--fp-blue-600); border: 2px solid var(--fp-blue-200);
    }
    .fp-pricing-cta-free:hover { background: var(--fp-blue-50); border-color: var(--fp-blue-400); }
    .fp-pricing-cta-pro {
        background: #fff; color: var(--fp-blue-600); border: none; font-size: 15px;
    }
    .fp-pricing-cta-pro:hover { background: var(--fp-blue-50); }
    .fp-pricing-note { font-size: 11px; text-align: center; margin-top: 6px; }
    .fp-pricing-free .fp-pricing-note { color: var(--fp-slate-400); }
    .fp-pricing-pro .fp-pricing-note { color: rgba(255,255,255,.5); }
    .fp-pricing-addons-note {
        text-align: center; font-size: 13px; color: var(--fp-slate-400); margin-top: 24px;
    }

    /* ── TESTIMONIALS V3 ────────────────────────────────────────── */
    .fp-testimonials-section { padding: 80px 0; background: var(--fp-slate-50); }
    .fp-testimonials-header { text-align: center; margin-bottom: 48px; }
    .fp-testimonials-header-title {
        font-size: clamp(24px, 3vw, 38px); font-weight: 800;
        letter-spacing: -.025em; color: var(--fp-slate-900);
    }
    .fp-testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
    .fp-testimonial-card {
        background: #fff; border: 1.5px solid var(--fp-slate-200); border-radius: 16px;
        padding: 24px; transition: all .2s;
    }
    .fp-testimonial-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.08); transform: translateY(-2px); }
    .fp-testimonial-stars { color: #f59e0b; font-size: 14px; margin-bottom: 12px; letter-spacing: 2px; }
    .fp-testimonial-text {
        font-size: 14px; color: var(--fp-slate-600); line-height: 1.65;
        font-style: italic; margin-bottom: 16px;
    }
    .fp-testimonial-text strong { color: var(--fp-blue-600); font-style: normal; }
    .fp-testimonial-author { display: flex; align-items: center; gap: 12px; }
    .fp-testimonial-avatar {
        width: 40px; height: 40px; border-radius: 50%; background: var(--fp-blue-100);
        display: flex; align-items: center; justify-content: center;
        font-size: 16px; font-weight: 700; color: var(--fp-blue-600); flex-shrink: 0;
    }
    .fp-testimonial-name { font-size: 14px; font-weight: 700; color: var(--fp-slate-800); }
    .fp-testimonial-role { font-size: 12px; color: var(--fp-slate-400); margin-top: 1px; }
    .fp-testimonial-result {
        display: inline-flex; align-items: center; gap: 4px; font-size: 11px;
        font-weight: 600; color: var(--fp-green); background: #f0fdf4;
        border: 1px solid #a7f3d0; padding: 3px 10px; border-radius: 999px; margin-top: 12px;
    }

    /* ── FINAL CTA V3 ───────────────────────────────────────────── */
    .fp-final-cta {
        padding: 80px 0; text-align: center; position: relative; overflow: hidden;
        background: linear-gradient(135deg, var(--fp-blue-700) 0%, var(--fp-blue-600) 50%, var(--fp-blue-500) 100%);
    }
    .fp-final-cta::before {
        content: ''; position: absolute; top: -100px; left: -100px;
        width: 400px; height: 400px;
        background: radial-gradient(circle, rgba(255,255,255,.07) 0%, transparent 70%);
    }
    .fp-final-cta::after {
        content: ''; position: absolute; bottom: -100px; right: -100px;
        width: 400px; height: 400px;
        background: radial-gradient(circle, rgba(255,255,255,.07) 0%, transparent 70%);
    }
    .fp-final-cta-title {
        font-size: clamp(28px, 4vw, 48px); font-weight: 800; color: #fff;
        letter-spacing: -.03em; margin-bottom: 12px; margin-top: 12px;
        position: relative; z-index: 1;
    }
    .fp-final-cta-sub {
        font-size: 17px; color: rgba(255,255,255,.75); max-width: 500px;
        margin: 0 auto 32px; position: relative; z-index: 1;
    }
    .fp-final-cta-actions {
        display: flex; gap: 12px; justify-content: center;
        position: relative; z-index: 1; flex-wrap: wrap;
    }

    /* ── RESPONSIVE V3 ──────────────────────────────────────────── */
    @media (max-width: 1100px) {
        .fp-pro-cards-grid { grid-template-columns: repeat(3, 1fr); }
        .fp-pro-cards-grid .fp-pro-card:nth-child(n+4) { display: none; }
        .fp-pricing-grid { grid-template-columns: 1fr; max-width: 440px; }
        .fp-pricing-pro { transform: none; }
    }
    @media (max-width: 900px) {
        .fp-hero-v3-inner { grid-template-columns: 1fr; }
        .fp-hero-demo { margin-top: 20px; justify-content: center; }
        .fp-stats-v3-grid { grid-template-columns: repeat(2, 1fr); }
        .fp-ba-grid { grid-template-columns: 1fr; }
        .fp-ba-divider { display: none; }
        .fp-benefits-grid-v3 { grid-template-columns: repeat(2, 1fr); }
        .fp-how-grid-v3 { grid-template-columns: repeat(2, 1fr); }
        .fp-how-grid-v3::before { display: none; }
        .fp-testimonials-grid { grid-template-columns: 1fr; }
        .fp-demo-summary-row { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 640px) {
        .fp-hero-v3 { padding: 60px 0 40px; }
        .fp-hero-v3-title { font-size: clamp(28px, 6vw, 36px); }
        .fp-benefits-grid-v3 { grid-template-columns: 1fr; }
        .fp-how-grid-v3 { grid-template-columns: 1fr; }
        .fp-pro-cards-grid { grid-template-columns: 1fr; }
        .fp-pro-cards-grid .fp-pro-card:nth-child(n+2) { display: none; }
        .fp-final-cta-actions { flex-direction: column; align-items: center; }
        .fp-feat-grid-v3 { grid-template-columns: 1fr; }
        .fp-stats-v3-grid { grid-template-columns: 1fr; }
        .fp-demo-summary-row { grid-template-columns: 1fr; }
        .fp-hero-v3-actions { flex-direction: column; }
        .fp-hero-v3-actions .fp-btn-pro,
        .fp-hero-v3-actions .fp-btn-secondary-v3 { width: 100%; justify-content: center; }
    }

    /* ==================== TAAS PROMO STRIP ==================== */
    .taas-promo-strip {
        background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
        color: #ffffff;
        padding: 10px 20px;
        text-align: center;
        font-size: 0.9rem;
        font-weight: 500;
        position: relative;
        z-index: 99;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        line-height: 1.4;
    }

    .taas-promo-strip-text {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 4px;
    }

    .taas-promo-strip a {
        color: #ffffff;
        text-decoration: underline;
        text-underline-offset: 2px;
        font-weight: 700;
        transition: opacity 0.2s ease;
    }

    .taas-promo-strip a:hover {
        opacity: 0.85;
    }

    .taas-promo-strip-close {
        position: absolute;
        right: 12px;
        top: 50%;
        transform: translateY(-50%);
        background: none;
        border: none;
        color: #ffffff;
        cursor: pointer;
        padding: 4px 8px;
        font-size: 1.1rem;
        line-height: 1;
        opacity: 0.7;
        transition: opacity 0.2s ease;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .taas-promo-strip-close:hover {
        opacity: 1;
        background: rgba(255, 255, 255, 0.15);
    }

    @media (max-width: 640px) {
        .taas-promo-strip {
            font-size: 0.8rem;
            padding: 8px 40px 8px 12px;
        }

        .taas-promo-strip-close {
            right: 6px;
        }
    }

    @media (max-width: 480px) {
        .taas-promo-strip {
            font-size: 0.7rem;
            padding: 6px 32px 6px 8px;
            gap: 2px;
            line-height: 1.3;
        }

        .taas-promo-strip-text {
            gap: 2px;
        }

        .taas-promo-strip-close {
            right: 4px;
            font-size: 0.9rem;
            padding: 2px 4px;
        }
    }

    /* ===== ABM LANDING PAGE (/for) ===== */
    /* Reuses taas-* buttons, labels, section headers, stat cards, perf card. */

    .abm-page { background: #F8FAFC; }
    .abm-container { max-width: 1120px; margin: 0 auto; }
    .abm-section { padding: 4rem 2rem; }

    /* Hero */
    .abm-hero { padding: 5rem 2rem 1.5rem; background: #fff; border-bottom: 1px solid #F1F5F9; }
    .abm-hero-grid {
        display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 3.5rem;
        align-items: center; max-width: 1120px; margin: 0 auto;
    }
    .abm-hero-title {
        font-size: 2.6rem; font-weight: 800; line-height: 1.12; color: #0F172A;
        letter-spacing: -0.02em; margin-bottom: 1rem;
    }
    .abm-hero-company { color: #2563EB; }
    .abm-hero-subtitle { font-size: 1.02rem; color: #475569; line-height: 1.6; margin-bottom: 1.25rem; max-width: 540px; }
    .abm-cpv-row { gap: 0.6rem; }
    .abm-cpv-row .taas-perf-stat-label { flex: 1; }
    .abm-tracked-tag {
        font-size: 0.7rem; font-weight: 700; color: #059669; background: #ECFDF5;
        padding: 0.15rem 0.5rem; border-radius: 999px; text-transform: uppercase; letter-spacing: 0.5px;
    }

    /* Stats strip */
    .abm-stats-section { padding: 2.5rem 2rem; background: #F8FAFC; border-bottom: 1px solid #F1F5F9; }
    .abm-stats-grid { grid-template-columns: repeat(4, 1fr); }

    /* Pain -> Solution mapping */
    .abm-painmap-section { background: #fff; }
    .abm-painmap-row {
        display: grid; grid-template-columns: 1fr 44px 1.15fr; gap: 1rem;
        align-items: stretch; margin-bottom: 1rem;
    }
    .abm-pain-card {
        display: flex; gap: 0.85rem; padding: 1.15rem 1.25rem;
        background: #FAFAFA; border: 1px solid #E2E8F0; border-left: 3px solid #F87171;
        border-radius: 12px;
    }
    .abm-pain-mark { color: #EF4444; margin-top: 0.2rem; flex-shrink: 0; }
    .abm-pain-title { font-size: 0.95rem; font-weight: 700; color: #0F172A; margin: 0 0 0.3rem; line-height: 1.35; }
    .abm-pain-desc { font-size: 0.85rem; color: #64748B; line-height: 1.55; margin: 0; }
    .abm-painmap-arrow { display: flex; align-items: center; justify-content: center; color: #94A3B8; }
    .abm-solution-card {
        padding: 1.15rem 1.25rem; background: #fff;
        border: 1px solid #BFDBFE; border-left: 3px solid #2563EB; border-radius: 12px;
        box-shadow: 0 1px 3px rgba(37,99,235,0.06);
    }
    .abm-feature-chip {
        display: inline-flex; align-items: center; gap: 0.35rem;
        font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1px;
        color: #2563EB; background: #EFF6FF; padding: 0.25rem 0.65rem;
        border-radius: 6px; margin-bottom: 0.55rem;
    }
    .abm-solution-desc { font-size: 0.875rem; color: #334155; line-height: 1.6; margin: 0; }

    /* TaaS band */
    .abm-taas-band { background: linear-gradient(135deg, #0F172A, #1E293B); padding: 3rem 2rem; }
    .abm-taas-band-inner {
        max-width: 1120px; margin: 0 auto;
        display: flex; align-items: center; justify-content: space-between; gap: 2.5rem;
    }
    .abm-taas-label {
        display: inline-block; text-transform: uppercase; font-size: 0.72rem; font-weight: 700;
        letter-spacing: 2px; color: #93C5FD; background: rgba(37,99,235,0.18);
        padding: 0.3rem 0.75rem; border-radius: 6px; margin-bottom: 0.85rem;
    }
    .abm-taas-title { font-size: 1.6rem; font-weight: 800; color: #fff; margin: 0 0 0.6rem; letter-spacing: -0.01em; }
    .abm-taas-body { font-size: 0.95rem; color: #CBD5E1; line-height: 1.65; max-width: 620px; margin: 0 0 1.1rem; }
    .abm-taas-chips { display: flex; gap: 0.75rem; flex-wrap: wrap; }
    .abm-taas-chip {
        display: inline-flex; align-items: center; gap: 0.4rem;
        font-size: 0.82rem; font-weight: 600; color: #E2E8F0;
        background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.14);
        padding: 0.4rem 0.85rem; border-radius: 999px;
    }
    .abm-taas-chip svg { color: #34D399; }
    .abm-taas-cta { margin-top: 1.4rem; }
    .abm-taas-left { flex: 1; display: flex; flex-direction: column; align-items: flex-start; }
    .abm-taas-examples {
        flex: 0 0 420px; background: rgba(255,255,255,0.06);
        border: 1px solid rgba(255,255,255,0.12); border-radius: 14px;
        padding: 1.5rem 1.6rem;
    }
    .abm-taas-examples-heading {
        display: block; font-size: 0.72rem; font-weight: 700; text-transform: uppercase;
        letter-spacing: 1.5px; color: #93C5FD; margin-bottom: 0.85rem;
    }
    .abm-taas-examples-list { list-style: none; padding: 0; margin: 0; }
    .abm-taas-examples-list li {
        display: flex; align-items: flex-start; gap: 0.55rem;
        font-size: 0.875rem; color: #E2E8F0; line-height: 1.55; padding: 0.4rem 0;
    }
    .abm-taas-examples-list li:not(:last-child) { border-bottom: 1px solid rgba(255,255,255,0.08); }
    .abm-taas-examples-list li svg { color: #34D399; flex-shrink: 0; margin-top: 0.18rem; }

    /* Live opportunities grid (Explorer card anatomy, compact density) */
    .abm-tenders-section { background: #F8FAFC; padding-top: 1rem; }
    /* Tighter header above the live tenders grid so the cards sit higher / nearer the fold. */
    .abm-tenders-section .taas-section-header { margin-bottom: 1.5rem; }
    .abm-tender-grid {
        display: grid; grid-template-columns: repeat(3, 1fr);
        gap: 1rem;
    }
    .abm-tender-card {
        background: #fff; border: 1px solid #E2E8F0; border-radius: 12px;
        padding: 1.1rem 1.2rem; display: flex; flex-direction: column;
        min-width: 0;
        transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }
    .abm-tender-card:hover { border-color: #93C5FD; box-shadow: 0 4px 16px rgba(0,0,0,0.05); }
    .abm-tender-chips { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-bottom: 0.65rem; }
    .abm-cpv-pill {
        display: inline-flex; align-items: center;
        font-size: 0.72rem; font-weight: 700; color: #1D4ED8; background: #DBEAFE;
        padding: 0.2rem 0.55rem; border-radius: 999px; white-space: nowrap;
    }
    .abm-tender-title {
        font-size: 0.95rem; font-weight: 700; color: #0F172A;
        line-height: 1.4; margin: 0 0 0.4rem;
    }
    .abm-tender-meta {
        font-size: 0.78rem; color: #64748B; margin-bottom: 0.75rem;
        overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    .abm-tender-buyer { font-weight: 600; }
    .abm-tender-ref { color: #94A3B8; margin-left: 0.25rem; }
    .abm-tender-datastrip {
        display: grid; grid-template-columns: 1fr 1.2fr 0.9fr; gap: 0.5rem;
        padding: 0.6rem 0; border-top: 1px solid #F1F5F9; border-bottom: 1px solid #F1F5F9;
        margin-bottom: 0.75rem;
    }
    .abm-data-label {
        display: block; font-size: 0.65rem; font-weight: 700; text-transform: uppercase;
        letter-spacing: 0.8px; color: #94A3B8; margin-bottom: 0.15rem;
    }
    .abm-data-value { display: block; font-size: 0.92rem; font-weight: 700; color: #0F172A; font-feature-settings: 'tnum'; }
    .abm-data-value-money { color: #059669; }
    .abm-data-urgent { color: #D97706; }
    .abm-tender-desc {
        background: #EFF6FF; border-radius: 8px; padding: 0.7rem 0.85rem;
        margin: 0 0 0.85rem;
    }
    .abm-tender-desc-text {
        font-size: 0.82rem; color: #475569; line-height: 1.55; margin: 0;
        display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
    }
    .abm-tender-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-top: auto; }
    .abm-btn-overview {
        display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
        min-height: 44px; padding: 0.5rem 0.75rem; background: #fff; color: #475569;
        border: 1px solid #CBD5E1; border-radius: 8px;
        font-size: 0.82rem; font-weight: 600; text-decoration: none; cursor: pointer;
        transition: border-color 0.2s ease, color 0.2s ease;
    }
    .abm-btn-overview:hover { border-color: #2563EB; color: #2563EB; }
    .abm-btn-askai {
        display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
        min-height: 44px; padding: 0.5rem 0.75rem; background: #2563EB; color: #fff;
        border: none; border-radius: 8px;
        font-size: 0.82rem; font-weight: 600; text-decoration: none; cursor: pointer;
        transition: background 0.2s ease;
    }
    .abm-btn-askai:hover { background: #1D4ED8; }
    .abm-explorer-link-row { text-align: center; margin-top: 1.75rem; }
    .abm-explorer-link {
        display: inline-flex; align-items: center; gap: 0.4rem;
        font-size: 0.92rem; font-weight: 600; color: #2563EB; text-decoration: none;
    }
    .abm-explorer-link:hover { text-decoration: underline; }

    /* Final dual CTA */
    .abm-cta-section { background: #fff; border-top: 1px solid #F1F5F9; }
    .abm-cta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; max-width: 880px; margin: 0 auto; }
    .abm-cta-card {
        padding: 1.75rem; background: #fff; border: 1px solid #E2E8F0; border-radius: 14px;
        display: flex; flex-direction: column;
    }
    .abm-cta-card-featured { border: 2px solid #2563EB; box-shadow: 0 4px 24px rgba(37,99,235,0.08); }
    .abm-cta-card-label {
        display: inline-block; align-self: flex-start; text-transform: uppercase; font-size: 0.68rem;
        font-weight: 700; letter-spacing: 1.5px; color: #2563EB; background: #EFF6FF;
        padding: 0.25rem 0.65rem; border-radius: 6px; margin-bottom: 0.85rem;
    }
    .abm-cta-label-dark { color: #475569; background: #F1F5F9; }
    .abm-cta-card-title { font-size: 1.15rem; font-weight: 800; color: #0F172A; margin: 0 0 1rem; letter-spacing: -0.01em; }
    .abm-check-list { list-style: none; padding: 0; margin: 0 0 1.5rem; flex: 1; }
    .abm-check-list li {
        display: flex; align-items: flex-start; gap: 0.55rem;
        font-size: 0.875rem; color: #334155; line-height: 1.5; padding: 0.3rem 0;
    }
    .abm-check-list li svg { color: #059669; flex-shrink: 0; margin-top: 0.18rem; }
    .abm-cta-note { font-size: 0.78rem; color: #94A3B8; text-align: center; margin: 0.75rem 0 0; }

    /* Responsive */
    @media (max-width: 1024px) {
        .abm-hero-grid { grid-template-columns: 1fr; gap: 2.5rem; }
        .abm-hero-title { font-size: 2.2rem; }
        .abm-stats-grid { grid-template-columns: repeat(2, 1fr); }
        .abm-taas-band-inner { flex-direction: column; align-items: stretch; }
        .abm-taas-examples { flex-basis: auto; }
        .abm-tender-grid { grid-template-columns: repeat(2, 1fr); }
    }
    @media (max-width: 768px) {
        .abm-hero { padding-top: 5rem; padding-left: 1.25rem; padding-right: 1.25rem; }
        .abm-section { padding: 3rem 1.25rem; }
        .abm-tenders-section { padding-top: 1.75rem; }
        .abm-stats-section { padding: 2rem 1.25rem; }
        .abm-painmap-row { grid-template-columns: 1fr; gap: 0.5rem; margin-bottom: 1.5rem; }
        .abm-painmap-arrow { transform: rotate(90deg); padding: 0.1rem 0; }
        .abm-cta-grid { grid-template-columns: 1fr; }
        .abm-tender-grid { grid-template-columns: 1fr; }
        .abm-taas-band { padding: 2.5rem 1.25rem; }
        .abm-taas-title { font-size: 1.35rem; }
        .abm-taas-cta { width: 100%; justify-content: center; }
        .abm-taas-examples { padding: 1.25rem; }
        .abm-cta-card { padding: 1.4rem 1.25rem; }
    }
    @media (max-width: 480px) {
        .abm-hero { padding-top: 4.5rem; }
        .abm-hero-title { font-size: 1.8rem; }
        .abm-hero-subtitle { font-size: 0.95rem; }
        .abm-stats-grid { grid-template-columns: 1fr 1fr; gap: 0.75rem; }
        .abm-tender-card { padding: 1rem; }
        .abm-tender-datastrip { grid-template-columns: 1fr 1fr; }
        .abm-taas-chips { flex-direction: column; align-items: flex-start; }
    }

    /* ==================== CALENDLY BOOKING MODAL ==================== */
    /* In-page Calendly scheduler (components.calendly_modal_script). The modal
       is >=1000px wide so Calendly renders its SHORT two-column desktop layout
       (~600px every step) that fits without scrolling; narrower embeds stack
       vertically and always overflow inside the iframe. */
    .calendly-modal-backdrop {
        position: fixed; inset: 0; z-index: 11000;
        background: rgba(15, 23, 42, 0.55);
        -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
        display: flex; align-items: center; justify-content: center;
        padding: 16px;
    }
    .calendly-modal {
        position: relative;
        width: min(1060px, calc(100vw - 32px));
        background: #fff; border-radius: 16px;
        padding: 44px 20px 12px;
        box-shadow: 0 24px 64px rgba(15, 23, 42, 0.28);
        display: flex; flex-direction: column; gap: 6px;
    }
    .calendly-modal-close {
        position: absolute; top: 10px; right: 12px;
        background: none; border: 0; padding: 6px;
        font-size: 18px; line-height: 1; color: #6b7280; cursor: pointer;
    }
    .calendly-modal-close:hover { color: #111827; }
    .calendly-modal-frame {
        width: 100%; height: min(640px, calc(100vh - 200px)); min-height: 400px;
        border: 0; border-radius: 12px; background: #fff;
    }
    .calendly-modal-fallback {
        text-align: center; font-size: 11.5px; color: #9ca3af;
        text-decoration: none; padding: 2px 0 4px;
    }
    .calendly-modal-fallback:hover { color: #1d4ed8; text-decoration: underline; }
    @media (max-width: 640px) {
        .calendly-modal { padding: 40px 8px 8px; border-radius: 14px; }
        .calendly-modal-frame { height: calc(100vh - 150px); min-height: 320px; }
    }