body {
            background-color: #f8f9fa;
            font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
        }
        .maintenance-card {
            max-width: 460px;
            width: 100%;
        }

:root { --racing-yellow: #facc15; --carbon-dark: #121214; --asphalt-gray: #1e1e24; --borders: #2d2d34; }
        body { background-color: var(--carbon-dark); color: #f3f4f6; font-family: 'Outfit', sans-serif; background-image: radial-gradient(rgba(250,204,21,0.05) 1px, transparent 0), radial-gradient(rgba(250,204,21,0.05) 1px, transparent 0); background-size: 20px 20px; background-position: 0 0, 10px 10px; }
        .font-racing-title { font-family: 'Outfit', sans-serif; font-weight: 900; letter-spacing: -0.03em; text-transform: uppercase; font-style: italic; }
        .btn-slant { clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%); }
        .checkered-pattern { background-color: #000; background-image: linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%), linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%); background-size: 16px 16px; background-position: 0 0, 8px 8px; }
        .glow-yellow { box-shadow: 0 0 15px rgba(250,204,21,0.4); }
        .nav-dropdown { position: relative; }
        .nav-dropdown-menu { display: none; position: absolute; top: 100%; left: 0; background: #1a1a20; border: 1px solid #2d2d34; border-radius: 0.5rem; min-width: 200px; padding: 0.5rem 0; z-index: 50; margin-top: 0.25rem; }
        .nav-dropdown:hover .nav-dropdown-menu { display: block; }
        .nav-dropdown-menu a { display: block; padding: 0.5rem 1rem; font-size: 0.8rem; color: #d1d5db; text-decoration: none; transition: all 0.2s; }
        .nav-dropdown-menu a:hover { background: rgba(250,204,21,0.1); color: #facc15; }
        .mobile-nav-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.95); z-index: 100; overflow-y: auto; padding: 80px 24px 40px; }
        .mobile-nav-overlay.open { display: block; }
        .mobile-nav-overlay a { display: block; color: #f3f4f6; font-size: 1.1rem; padding: 12px 0; border-bottom: 1px solid #2d2d34; text-decoration: none; }
        .mobile-nav-overlay .sub-link { padding-left: 20px; font-size: 0.95rem; color: #9ca3af; }
        #chat-teaser { position: fixed; bottom: 110px; right: 20px; z-index: 9999; max-width: 260px; opacity: 0; transform: translateY(10px) scale(0.95); transition: opacity 0.4s ease, transform 0.4s ease; pointer-events: none; }
        #chat-teaser.visible { opacity: 1; transform: translateY(0) scale(1); pointer-events: all; }
        #chat-teaser.hidden { opacity: 0 !important; transform: translateY(10px) scale(0.95) !important; pointer-events: none !important; }
        .teaser-bubble { background: #1a1a20; border: 1.5px solid var(--racing-yellow); border-radius: 16px 16px 4px 16px; padding: 14px 36px 14px 16px; box-shadow: 0 8px 32px rgba(0,0,0,0.55); position: relative; }
        .teaser-bubble::after { content: ''; position: absolute; bottom: -10px; right: 18px; width: 0; height: 0; border-left: 10px solid transparent; border-top: 10px solid var(--racing-yellow); }
        .teaser-bubble::before { content: ''; position: absolute; bottom: -8px; right: 19px; width: 0; height: 0; border-left: 9px solid transparent; border-top: 9px solid #1a1a20; z-index: 1; }
        .teaser-close { position: absolute; top: 8px; right: 10px; background: none; border: none; color: rgba(200,200,200,0.5); font-size: 1rem; cursor: pointer; }
        #custom-chat-btn { position: fixed; bottom: 16px; right: 16px; z-index: 9999; width: 96px; height: 96px; background: transparent; border: none; padding: 0; cursor: pointer; transition: transform 0.2s; }
        #custom-chat-btn:hover { transform: scale(1.1); }
        #custom-chat-btn img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }
        @keyframes chatBounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
        .chat-bounce { animation: chatBounce 2s ease-in-out infinite; }
        #chat-panel { position: fixed; bottom: 120px; right: 16px; z-index: 9998; width: 380px; height: 560px; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.6); border: 1px solid rgba(250,204,21,0.3); display: none; flex-direction: column; }
        #chat-panel.open { display: flex; }
        #chat-panel iframe { width: 100%; flex: 1; border: none; }
        .service-area-text { font-size: 0.65rem; color: #6b7280; line-height: 1.6; }
        .step-pill { transition: all 0.3s ease; }
        @media(max-width:768px) { .desktop-nav { display: none !important; } .mobile-hamburger { display: flex !important; } #chat-panel { width: calc(100vw - 32px); } }
        @media(min-width:769px) { .mobile-hamburger { display: none !important; } }

:root {
            --racing-yellow: #facc15;
            --carbon-dark: #121214;
            --asphalt-gray: #1e1e24;
            --borders: #2d2d34;
        }
        body {
            font-family: 'Outfit', sans-serif;
            background-color: var(--carbon-dark);
            color: #f3f4f6;
            background-image: radial-gradient(rgba(250,204,21,0.05) 1px, transparent 0), radial-gradient(rgba(250,204,21,0.05) 1px, transparent 0);
            background-size: 20px 20px;
            background-position: 0 0, 10px 10px;
        }
        /* ===== RACING YELLOW UTILITY ===== */
        .racing-yellow { color: #facc15; }
        .bg-racing-yellow { background-color: #facc15; }
        .border-racing-yellow { border-color: #facc15; }
        
        /* ===== CHECKERED PATTERN ===== */
        .checkered-pattern {
            background-color: #000;
            background-image: linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%), linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%);
            background-size: 16px 16px;
            background-position: 0 0, 8px 8px;
        }
        .checkered-bg-sm {
            background-image:
                linear-gradient(45deg, rgba(250, 204, 21, 0.12) 25%, transparent 25%),
                linear-gradient(-45deg, rgba(250, 204, 21, 0.12) 25%, transparent 25%),
                linear-gradient(45deg, transparent 75%, rgba(250, 204, 21, 0.12) 75%),
                linear-gradient(-45deg, transparent 75%, rgba(250, 204, 21, 0.12) 75%);
            background-size: 14px 14px;
            background-position: 0 0, 0 7px, 7px -7px, -7px 0px;
        }
        /* ===== ITALIC UPPERCASE RACING TITLE ===== */
        .font-racing-title {
            font-family: 'Outfit', sans-serif;
            font-weight: 900;
            letter-spacing: -0.03em;
            text-transform: uppercase;
            font-style: italic;
        }
        .racing-title {
            font-style: italic;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: 0.04em;
            color: #facc15;
        }
        .btn-slant { clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%); }
        .glow-yellow { box-shadow: 0 0 15px rgba(250,204,21,0.4); }

        /* ===== DROPDOWNS ===== */
        .nav-dropdown { position: relative; }
        .nav-dropdown-menu {
            display: none; position: absolute; top: 100%; left: 0; background: #1a1a20; border: 1px solid #2d2d34;
            border-radius: 0.5rem; min-width: 200px; padding: 0.5rem 0; z-index: 50; margin-top: 0.25rem;
        }
        .nav-dropdown:hover .nav-dropdown-menu { display: block; }
        .nav-dropdown-menu a { display: block; padding: 0.5rem 1rem; font-size: 0.8rem; color: #d1d5db; text-decoration: none; transition: all 0.2s; }
        .nav-dropdown-menu a:hover { background: rgba(250,204,21,0.1); color: #facc15; }
        .mobile-nav-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.95); z-index: 100; overflow-y: auto; padding: 80px 24px 40px; }
        .mobile-nav-overlay.open { display: block; }
        .mobile-nav-overlay a { display: block; color: #f3f4f6; font-size: 1.1rem; padding: 12px 0; border-bottom: 1px solid #2d2d34; text-decoration: none; }
        .mobile-nav-overlay .sub-link { padding-left: 20px; font-size: 0.95rem; color: #9ca3af; }

        /* ===== VALUE CARD SYSTEM ===== */
        .value-card { transition: transform 0.25s ease, box-shadow 0.25s ease; }
        .value-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 12px 32px -8px rgba(250, 204, 21, 0.20);
        }

        /* ===== CHAT TELEMETRY ===== */
        #chat-teaser {
            position: fixed; bottom: 110px; right: 20px; z-index: 9999; max-width: 260px;
            opacity: 0; transform: translateY(10px) scale(0.95);
            transition: opacity 0.4s ease, transform 0.4s ease; pointer-events: none;
        }
        #chat-teaser.visible { opacity: 1; transform: translateY(0) scale(1); pointer-events: all; }
        #chat-teaser.hidden { opacity: 0 !important; transform: translateY(10px) scale(0.95) !important; pointer-events: none !important; }
        .teaser-bubble {
            background: #1a1a20; border: 1.5px solid var(--racing-yellow); border-radius: 16px 16px 4px 16px;
            padding: 14px 36px 14px 16px; box-shadow: 0 8px 32px rgba(0,0,0,0.55); position: relative;
        }
        .teaser-bubble::after { content: ''; position: absolute; bottom: -10px; right: 18px; width: 0; height: 0; border-left: 10px solid transparent; border-top: 10px solid var(--racing-yellow); }
        .teaser-bubble::before { content: ''; position: absolute; bottom: -8px; right: 19px; width: 0; height: 0; border-left: 9px solid transparent; border-top: 9px solid #1a1a20; z-index: 1; }
        .teaser-close { position: absolute; top: 8px; right: 10px; background: none; border: none; color: rgba(200,200,200,0.5); font-size: 1rem; cursor: pointer; }
        #custom-chat-btn {
            position: fixed; bottom: 16px; right: 16px; z-index: 9999; width: 96px; height: 96px;
            background: transparent; border: none; padding: 0; cursor: pointer; transition: transform 0.2s;
        }
        #custom-chat-btn:hover { transform: scale(1.1); }
        #custom-chat-btn img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }
        @keyframes chatBounce {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-6px); }
        }
        .chat-bounce { animation: chatBounce 2s ease-in-out infinite; }
        #chat-panel {
            position: fixed; bottom: 120px; right: 16px; z-index: 9998; width: 380px; height: 560px;
            border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.6);
            border: 1px solid rgba(250,204,21,0.3); display: none; flex-direction: column;
        }
        #chat-panel.open { display: flex; }
        #chat-panel iframe { width: 100%; flex: 1; border: none; }
        .service-area-text { font-size: 0.65rem; color: #6b7280; line-height: 1.6; }
        @media(max-width:768px) {
            .desktop-nav { display: none !important; }
            .mobile-hamburger { display: flex !important; }
            #chat-panel { width: calc(100vw - 32px); }
        }
        @media(min-width:769px) {
            .mobile-hamburger { display: none !important; }
        }

html { scroll-behavior: smooth; }
    body { font-family: 'Outfit', sans-serif; background: #121214; color: #f5f5f5; }
    .racing-title { font-style: italic; text-transform: uppercase; letter-spacing: 0.08em; }
    .yellow-glow { box-shadow: 0 0 0 1px rgba(250,204,21,.2), 0 10px 30px rgba(250,204,21,.12); }
    .card-lift { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
    .card-lift:hover { transform: translateY(-6px); box-shadow: 0 24px 60px rgba(0,0,0,.38); border-color: rgba(250,204,21,.35); }
    .glass-dark { background: rgba(18,18,20,.82); backdrop-filter: blur(12px); }
    .dropdown-panel { display:none; }
    .dropdown-open .dropdown-panel { display:block; }
    .menu-open { display:block; }
    .article-modal[hidden] { display:none; }

:root {
            --racing-yellow: #facc15;
            --carbon-dark: #121214;
            --asphalt-gray: #1e1e24;
            --borders: #2d2d34;
        }
        body {
            background-color: var(--carbon-dark);
            color: #f3f4f6;
            font-family: 'Outfit', sans-serif;
            background-image: radial-gradient(rgba(250,204,21,0.05) 1px, transparent 0), radial-gradient(rgba(250,204,21,0.05) 1px, transparent 0);
            background-size: 20px 20px;
            background-position: 0 0, 10px 10px;
        }
        .font-racing-title {
            font-family: 'Outfit', sans-serif;
            font-weight: 900;
            letter-spacing: -0.03em;
            text-transform: uppercase;
            font-style: italic;
        }
        .btn-slant { clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%); }
        .checkered-pattern {
            background-color: #000;
            background-image: linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%), linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%);
            background-size: 16px 16px;
            background-position: 0 0, 8px 8px;
        }
        .glow-yellow { box-shadow: 0 0 15px rgba(250,204,21,0.4); }
        .nav-dropdown { position: relative; }
        .nav-dropdown-menu {
            display: none; position: absolute; top: 100%; left: 0; background: #1a1a20; border: 1px solid #2d2d34;
            border-radius: 0.5rem; min-width: 200px; padding: 0.5rem 0; z-index: 50; margin-top: 0.25rem;
        }
        .nav-dropdown:hover .nav-dropdown-menu { display: block; }
        .nav-dropdown-menu a { display: block; padding: 0.5rem 1rem; font-size: 0.8rem; color: #d1d5db; text-decoration: none; transition: all 0.2s; }
        .nav-dropdown-menu a:hover { background: rgba(250,204,21,0.1); color: #facc15; }
        .mobile-nav-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.95); z-index: 100; overflow-y: auto; padding: 80px 24px 40px; }
        .mobile-nav-overlay.open { display: block; }
        .mobile-nav-overlay a { display: block; color: #f3f4f6; font-size: 1.1rem; padding: 12px 0; border-bottom: 1px solid #2d2d34; text-decoration: none; }
        .mobile-nav-overlay .sub-link { padding-left: 20px; font-size: 0.95rem; color: #9ca3af; }
        #chat-teaser {
            position: fixed; bottom: 110px; right: 20px; z-index: 9999; max-width: 260px;
            opacity: 0; transform: translateY(10px) scale(0.95);
            transition: opacity 0.4s ease, transform 0.4s ease; pointer-events: none;
        }
        #chat-teaser.visible { opacity: 1; transform: translateY(0) scale(1); pointer-events: all; }
        #chat-teaser.hidden { opacity: 0 !important; transform: translateY(10px) scale(0.95) !important; pointer-events: none !important; }
        .teaser-bubble {
            background: #1a1a20; border: 1.5px solid var(--racing-yellow); border-radius: 16px 16px 4px 16px;
            padding: 14px 36px 14px 16px; box-shadow: 0 8px 32px rgba(0,0,0,0.55); position: relative;
        }
        .teaser-bubble::after { content: ''; position: absolute; bottom: -10px; right: 18px; width: 0; height: 0; border-left: 10px solid transparent; border-top: 10px solid var(--racing-yellow); }
        .teaser-bubble::before { content: ''; position: absolute; bottom: -8px; right: 19px; width: 0; height: 0; border-left: 9px solid transparent; border-top: 9px solid #1a1a20; z-index: 1; }
        .teaser-close { position: absolute; top: 8px; right: 10px; background: none; border: none; color: rgba(200,200,200,0.5); font-size: 1rem; cursor: pointer; }
        #custom-chat-btn {
            position: fixed; bottom: 16px; right: 16px; z-index: 9999; width: 96px; height: 96px;
            background: transparent; border: none; padding: 0; cursor: pointer; transition: transform 0.2s;
        }
        #custom-chat-btn:hover { transform: scale(1.1); }
        #custom-chat-btn img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }
        @keyframes chatBounce {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-6px); }
        }
        .chat-bounce { animation: chatBounce 2s ease-in-out infinite; }
        #chat-panel {
            position: fixed; bottom: 120px; right: 16px; z-index: 9998; width: 380px; height: 560px;
            border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.6);
            border: 1px solid rgba(250,204,21,0.3); display: none; flex-direction: column;
        }
        #chat-panel.open { display: flex; }
        #chat-panel iframe { width: 100%; flex: 1; border: none; }
        .service-area-text { font-size: 0.65rem; color: #6b7280; line-height: 1.6; }
        @media(max-width:768px) {
            .desktop-nav { display: none !important; }
            .mobile-hamburger { display: flex !important; }
            #chat-panel { width: calc(100vw - 32px); }
        }
        @media(min-width:769px) {
            .mobile-hamburger { display: none !important; }
        }

/* ===== GLOBAL STYLES ===== */
        * { margin: 0; padding: 0; box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            font-family: 'Outfit', sans-serif;
            background-color: #121214;
            color: #f3f4f6;
        }

        /* ===== CHECKERED PATTERN UTILITY ===== */
        .checkered-pattern {
            background-color: #000;
            background-image: linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%), linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%);
            background-size: 16px 16px;
            background-position: 0 0, 8px 8px;
        }
        .checkered-pattern-sm {
            background-image:
                linear-gradient(45deg, rgba(250, 204, 21, 0.12) 25%, transparent 25%),
                linear-gradient(-45deg, rgba(250, 204, 21, 0.12) 25%, transparent 25%),
                linear-gradient(45deg, transparent 75%, rgba(250, 204, 21, 0.12) 75%),
                linear-gradient(-45deg, transparent 75%, rgba(250, 204, 21, 0.12) 75%);
            background-size: 12px 12px;
            background-position: 0 0, 0 6px, 6px -6px, -6px 0px;
        }
        .checkered-pattern-lg {
            background-image:
                linear-gradient(45deg, rgba(250, 204, 21, 0.08) 25%, transparent 25%),
                linear-gradient(-45deg, rgba(250, 204, 21, 0.08) 25%, transparent 25%),
                linear-gradient(45deg, transparent 75%, rgba(250, 204, 21, 0.08) 75%),
                linear-gradient(-45deg, transparent 75%, rgba(250, 204, 21, 0.08) 75%);
            background-size: 40px 40px;
            background-position: 0 0, 0 20px, 20px -20px, -20px 0px;
        }

        /* ===== RACING TITLE STYLE ===== */
        .font-racing-title {
            font-family: 'Outfit', sans-serif;
            font-weight: 900;
            letter-spacing: -0.03em;
            text-transform: uppercase;
            font-style: italic;
        }
        .racing-title {
            font-style: italic;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            font-weight: 800;
            text-shadow: 2px 2px 0 rgba(250, 204, 21, 0.2);
        }
        .racing-title-yellow {
            color: #facc15;
            text-shadow: 3px 3px 0 rgba(18, 18, 20, 0.5);
        }
        .btn-slant { clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%); }
        .glow-yellow { box-shadow: 0 0 15px rgba(250,204,21,0.4); }

        /* ===== NAV DROPDOWN ===== */
        .nav-dropdown { position: relative; }
        .nav-dropdown-menu {
            display: none; position: absolute; top: 100%; left: 0; background: #1a1a20; border: 1px solid #2d2d34;
            border-radius: 0.5rem; min-width: 200px; padding: 0.5rem 0; z-index: 50; margin-top: 0.25rem;
        }
        .nav-dropdown:hover .nav-dropdown-menu { display: block; }
        .nav-dropdown-menu a { display: block; padding: 0.5rem 1rem; font-size: 0.8rem; color: #d1d5db; text-decoration: none; transition: all 0.2s; }
        .nav-dropdown-menu a:hover { background: rgba(250,204,21,0.1); color: #facc15; }
        .mobile-nav-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.95); z-index: 100; overflow-y: auto; padding: 80px 24px 40px; }
        .mobile-nav-overlay.open { display: block; }
        .mobile-nav-overlay a { display: block; color: #f3f4f6; font-size: 1.1rem; padding: 12px 0; border-bottom: 1px solid #2d2d34; text-decoration: none; }
        .mobile-nav-overlay .sub-link { padding-left: 20px; font-size: 0.95rem; color: #9ca3af; }

        /* ===== GALLERY CARD STYLES ===== */
        .gallery-card {
            position: relative;
            overflow: hidden;
            border: 1px solid rgba(250, 204, 21, 0.15);
            transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), border-color 0.4s ease, box-shadow 0.4s ease;
            cursor: pointer;
        }
        .gallery-card:hover {
            transform: translateY(-6px) scale(1.02);
            border-color: #facc15;
            box-shadow: 0 20px 40px -12px rgba(250, 204, 21, 0.25);
        }
        .gallery-card::after {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(250, 204, 21, 0.05) 0%, transparent 50%);
            pointer-events: none;
        }
        .gallery-card .card-overlay {
            position: absolute;
            bottom: 0;
            left: 0; right: 0;
            padding: 1rem 1.25rem;
            background: linear-gradient(0deg, rgba(18,18,20,0.92) 40%, transparent 100%);
            transform: translateY(8px);
            opacity: 0.9;
            transition: transform 0.3s ease, opacity 0.3s ease;
        }
        .gallery-card:hover .card-overlay {
            transform: translateY(0);
            opacity: 1;
        }

        /* ===== BEFORE / AFTER COMPARISON PLACEHOLDER ===== */
        .comparison-card {
            position: relative;
            overflow: hidden;
            border: 1px solid rgba(250, 204, 21, 0.1);
            transition: border-color 0.3s ease, box-shadow 0.3s ease;
        }
        .comparison-card:hover {
            border-color: rgba(250, 204, 21, 0.4);
            box-shadow: 0 0 30px -8px rgba(250, 204, 21, 0.15);
        }

        /* ===== DIVIDER LINE ===== */
        .divider-yellow {
            height: 3px;
            background: linear-gradient(90deg, transparent, #facc15, transparent);
            width: 120px;
            margin: 0.5rem auto 0;
        }

        /* ===== CHAT WIDGET ===== */
        #chat-teaser {
            position: fixed; bottom: 110px; right: 20px; z-index: 9999; max-width: 260px;
            opacity: 0; transform: translateY(10px) scale(0.95);
            transition: opacity 0.4s ease, transform 0.4s ease; pointer-events: none;
        }
        #chat-teaser.visible { opacity: 1; transform: translateY(0) scale(1); pointer-events: all; }
        #chat-teaser.hidden { opacity: 0 !important; transform: translateY(10px) scale(0.95) !important; pointer-events: none !important; }
        .teaser-bubble {
            background: #1a1a20; border: 1.5px solid var(--racing-yellow); border-radius: 16px 16px 4px 16px;
            padding: 14px 36px 14px 16px; box-shadow: 0 8px 32px rgba(0,0,0,0.55); position: relative;
        }
        .teaser-bubble::after { content: ''; position: absolute; bottom: -10px; right: 18px; width: 0; height: 0; border-left: 10px solid transparent; border-top: 10px solid var(--racing-yellow); }
        .teaser-bubble::before { content: ''; position: absolute; bottom: -8px; right: 19px; width: 0; height: 0; border-left: 9px solid transparent; border-top: 9px solid #1a1a20; z-index: 1; }
        .teaser-close { position: absolute; top: 8px; right: 10px; background: none; border: none; color: rgba(200,200,200,0.5); font-size: 1rem; cursor: pointer; }

        #custom-chat-btn {
            position: fixed; bottom: 16px; right: 16px; z-index: 9999; width: 96px; height: 96px;
            background: transparent; border: none; padding: 0; cursor: pointer; transition: transform 0.2s;
        }
        #custom-chat-btn:hover { transform: scale(1.1); }
        #custom-chat-btn img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }
        @keyframes chatBounce {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-6px); }
        }
        .chat-bounce { animation: chatBounce 2s ease-in-out infinite; }

        #chat-panel {
            position: fixed; bottom: 120px; right: 16px; z-index: 9998; width: 380px; height: 560px;
            border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.6);
            border: 1px solid rgba(250,204,21,0.3); display: none; flex-direction: column;
        }
        #chat-panel.open { display: flex; }
        #chat-panel iframe { width: 100%; flex: 1; border: none; }

        /* ===== ASPECT RATIO FIX ===== */
        .aspect-4-3 { aspect-ratio: 4 / 3; }
        .aspect-square { aspect-ratio: 1 / 1; }
        .aspect-video { aspect-ratio: 16 / 9; }

:root {
            --racing-yellow: #facc15;
            --carbon-dark: #121214;
            --asphalt-gray: #1e1e24;
            --borders: #2d2d34;
        }
        body {
            background-color: var(--carbon-dark);
            color: #f3f4f6;
            font-family: 'Outfit', sans-serif;
            background-image: radial-gradient(rgba(250,204,21,0.05) 1px, transparent 0), radial-gradient(rgba(250,204,21,0.05) 1px, transparent 0);
            background-size: 20px 20px;
            background-position: 0 0, 10px 10px;
        }
        .font-racing-title {
            font-family: 'Outfit', sans-serif;
            font-weight: 900;
            letter-spacing: -0.03em;
            text-transform: uppercase;
            font-style: italic;
        }
        .btn-slant { clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%); }
        .checkered-pattern {
            background-color: #000;
            background-image: linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%), linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%);
            background-size: 16px 16px;
            background-position: 0 0, 8px 8px;
        }
        .glow-yellow { box-shadow: 0 0 15px rgba(250,204,21,0.4); }
        .nav-dropdown { position: relative; }
        .nav-dropdown-menu {
            display: none; position: absolute; top: 100%; left: 0; background: #1a1a20; border: 1px solid #2d2d34;
            border-radius: 0.5rem; min-width: 200px; padding: 0.5rem 0; z-index: 50; margin-top: 0.25rem;
        }
        .nav-dropdown:hover .nav-dropdown-menu { display: block; }
        .nav-dropdown-menu a { display: block; padding: 0.5rem 1rem; font-size: 0.8rem; color: #d1d5db; text-decoration: none; transition: all 0.2s; }
        .nav-dropdown-menu a:hover { background: rgba(250,204,21,0.1); color: #facc15; }
        .mobile-nav-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.95); z-index: 100; overflow-y: auto; padding: 80px 24px 40px; }
        .mobile-nav-overlay.open { display: block; }
        .mobile-nav-overlay a { display: block; color: #f3f4f6; font-size: 1.1rem; padding: 12px 0; border-bottom: 1px solid #2d2d34; text-decoration: none; }
        .mobile-nav-overlay .sub-link { padding-left: 20px; font-size: 0.95rem; color: #9ca3af; }
        
        /* Before/After Conceptual Cards System */
        .ba-container { position: relative; overflow: hidden; border-radius: 0.75rem; }
        .ba-overlay {
            position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
            background: rgba(18, 18, 20, 0.85); backdrop-filter: blur(2px); transition: opacity 0.4s ease;
        }
        .ba-container:hover .ba-overlay { opacity: 0; pointer-events: none; }

        #chat-teaser {
            position: fixed; bottom: 110px; right: 20px; z-index: 9999; max-width: 260px;
            opacity: 0; transform: translateY(10px) scale(0.95);
            transition: opacity 0.4s ease, transform 0.4s ease; pointer-events: none;
        }
        #chat-teaser.visible { opacity: 1; transform: translateY(0) scale(1); pointer-events: all; }
        #chat-teaser.hidden { opacity: 0 !important; transform: translateY(10px) scale(0.95) !important; pointer-events: none !important; }
        .teaser-bubble {
            background: #1a1a20; border: 1.5px solid var(--racing-yellow); border-radius: 16px 16px 4px 16px;
            padding: 14px 36px 14px 16px; box-shadow: 0 8px 32px rgba(0,0,0,0.55); position: relative;
        }
        .teaser-bubble::after { content: ''; position: absolute; bottom: -10px; right: 18px; width: 0; height: 0; border-left: 10px solid transparent; border-top: 10px solid var(--racing-yellow); }
        .teaser-bubble::before { content: ''; position: absolute; bottom: -8px; right: 19px; width: 0; height: 0; border-left: 9px solid transparent; border-top: 9px solid #1a1a20; z-index: 1; }
        .teaser-close { position: absolute; top: 8px; right: 10px; background: none; border: none; color: rgba(200,200,200,0.5); font-size: 1rem; cursor: pointer; }
        #custom-chat-btn {
            position: fixed; bottom: 16px; right: 16px; z-index: 9999; width: 96px; height: 96px;
            background: transparent; border: none; padding: 0; cursor: pointer; transition: transform 0.2s;
        }
        #custom-chat-btn:hover { transform: scale(1.1); }
        #custom-chat-btn img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }
        @keyframes chatBounce {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-6px); }
        }
        .chat-bounce { animation: chatBounce 2s ease-in-out infinite; }
        #chat-panel {
            position: fixed; bottom: 120px; right: 16px; z-index: 9998; width: 380px; height: 560px;
            border-radius: 16px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,0.6);
            border: 1px solid rgba(250,204,21,0.3); display: none; flex-direction: column;
        }
        #chat-panel.open { display: flex; }
        #chat-panel iframe { width: 100%; flex: 1; border: none; }
        .service-area-text { font-size: 0.65rem; color: #6b7280; line-height: 1.6; }
        @media(max-width:768px) {
            .desktop-nav { display: none !important; }
            .mobile-hamburger { display: flex !important; }
            #chat-panel { width: calc(100vw - 32px); }
        }
        @media(min-width:769px) {
            .mobile-hamburger { display: none !important; }
        }

/* ===== GLOBAL RESET & BASE ===== */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body {
            background-color: #121214;
            color: #f0f0f0;
            font-family: 'Outfit', sans-serif;
            background-image: radial-gradient(rgba(250,204,21,0.05) 1px, transparent 0), radial-gradient(rgba(250,204,21,0.05) 1px, transparent 0);
            background-size: 20px 20px;
            background-position: 0 0, 10px 10px;
        }
        /* ===== RACING YELLOW ACCENT ===== */
        .racing-yellow { color: #facc15; }
        .bg-racing-yellow { background-color: #facc15; }
        .border-racing-yellow { border-color: #facc15; }
        .hover-racing-yellow:hover {
            background-color: #facc15;
            color: #121214;
        }
        /* ===== ITALIC UPPERCASE RACING TITLE ===== */
        .racing-title {
            font-style: italic;
            text-transform: uppercase;
            font-weight: 900;
            letter-spacing: -0.03em;
        }
        .racing-title-light {
            font-style: italic;
            text-transform: uppercase;
            font-weight: 600;
            letter-spacing: 0.03em;
        }
        /* ===== CHECKERED PATTERN OVERLAY ===== */
        .checkered-bg {
            background-image: linear-gradient(45deg, rgba(250, 204, 21, 0.04) 25%, transparent 25%),
                linear-gradient(-45deg, rgba(250, 204, 21, 0.04) 25%, transparent 25%),
                linear-gradient(45deg, transparent 75%, rgba(250, 204, 21, 0.04) 75%),
                linear-gradient(-45deg, transparent 75%, rgba(250, 204, 21, 0.04) 75%);
            background-size: 40px 40px;
            background-position: 0 0, 0 20px, 20px -20px, -20px 0px;
        }
        .checkered-sm {
            background-image: linear-gradient(45deg, rgba(250, 204, 21, 0.08) 25%, transparent 25%),
                linear-gradient(-45deg, rgba(250, 204, 21, 0.08) 25%, transparent 25%),
                linear-gradient(45deg, transparent 75%, rgba(250, 204, 21, 0.08) 75%),
                linear-gradient(-45deg, transparent 75%, rgba(250, 204, 21, 0.08) 75%);
            background-size: 20px 20px;
            background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
        }
        /* ===== DROPDOWN ===== */
        .dropdown-menu {
            visibility: hidden;
            opacity: 0;
            position: absolute;
            top: 100%;
            left: 0;
            background: #1a1a20;
            border: 1px solid #2d2d34;
            border-radius: 0.5rem;
            min-width: 200px;
            padding: 0.5rem 0;
            z-index: 50;
            margin-top: 0.25rem;
            transition: opacity 0.2s ease, transform 0.2s ease;
            transform: translateY(10px);
        }
        .nav-dropdown:hover .dropdown-menu {
            visibility: visible;
            opacity: 1;
            transform: translateY(0);
        }
        .dropdown-menu a {
            display: block;
            padding: 0.5rem 1rem;
            font-size: 0.8rem;
            color: #d1d5db;
            text-decoration: none;
            transition: all 0.2s;
        }
        .dropdown-menu a:hover {
            background: rgba(250,204,21,0.1);
            color: #facc15;
        }
        /* ===== BENEFIT CARD ===== */
        .benefit-card {
            background: rgba(255, 255, 255, 0.02);
            border: 1px solid rgba(250, 204, 21, 0.15);
            border-radius: 1rem;
            padding: 1.75rem 1.5rem;
            transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s;
        }
        .benefit-card:hover {
            border-color: #facc15;
            transform: translateY(-4px);
            box-shadow: 0 12px 32px -8px rgba(250, 204, 21, 0.15);
        }
        /* ===== TINT LEVEL CARD ===== */
        .tint-card {
            background: rgba(255, 255, 255, 0.02);
            border: 1px solid rgba(250, 204, 21, 0.10);
            border-radius: 1rem;
            padding: 1.5rem 1.25rem;
            text-align: center;
            transition: border-color 0.3s, transform 0.3s;
        }
        .tint-card:hover {
            border-color: #facc15;
            transform: scale(1.03);
        }
        /* ===== CHAT WIDGET ===== */
        #chat-widget {
            position: fixed;
            bottom: 24px;
            right: 24px;
            width: 96px;
            height: 96px;
            z-index: 9999;
            cursor: pointer;
            border-radius: 50%;
            overflow: hidden;
            box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6);
            transition: transform 0.25s, box-shadow 0.25s;
            border: 2px solid #facc15;
            background-color: #121214;
        }
        #chat-widget:hover {
            transform: scale(1.07);
            box-shadow: 0 12px 32px rgba(250, 204, 21, 0.25);
        }
        #chat-widget img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }
        /* ===== EMBED OVERLAY ===== */
        #chat-overlay {
            position: fixed;
            inset: 0;
            z-index: 9998;
            background: rgba(0, 0, 0, 0.7);
            display: none;
            align-items: center;
            justify-content: center;
            backdrop-filter: blur(4px);
        }
        #chat-overlay.active { display: flex; }
        #chat-overlay iframe {
            width: 90%;
            max-width: 480px;
            height: 80vh;
            max-height: 700px;
            border: none;
            border-radius: 1.25rem;
            box-shadow: 0 24px 64px rgba(0, 0, 0, 0.8);
        }
        #chat-close {
            position: absolute;
            top: 20px;
            right: 20px;
            background: #facc15;
            color: #121214;
            border: none;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            font-size: 1.5rem;
            font-weight: 700;
            cursor: pointer;
            line-height: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
            transition: transform 0.2s;
        }
        #chat-close:hover { transform: scale(1.1); }
        .hero-stripe {
            background: repeating-linear-gradient(90deg, #facc15 0px, #facc15 4px, transparent 4px, transparent 12px);
            height: 6px;
            width: 100%;
        }
        .btn-slant { clip-path: polygon(6% 0, 100% 0, 94% 100%, 0 100%); }
        .mobile-nav-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.95); z-index: 100; overflow-y: auto; padding: 80px 24px 40px; }
        .mobile-nav-overlay.open { display: block; }
        .mobile-nav-overlay a { display: block; color: #f3f4f6; font-size: 1.1rem; padding: 12px 0; border-bottom: 1px solid #2d2d34; text-decoration: none; }
        .mobile-nav-overlay .sub-link { padding-left: 20px; font-size: 0.95rem; color: #9ca3af; }
        .service-area-text { font-size: 0.65rem; color: #6b7280; line-height: 1.6; }
        .checkered-pattern {
            background-color: #000;
            background-image: linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%), linear-gradient(45deg, #1f2937 25%, transparent 25%, transparent 75%, #1f2937 75%);
            background-size: 16px 16px;
            background-position: 0 0, 8px 8px;
        }
        ::-webkit-scrollbar { width: 6px; }
        ::-webkit-scrollbar-track { background: #1a1a1e; }
        ::-webkit-scrollbar-thumb { background: #facc15; border-radius: 3px; }