/* ==========================================================================
   site-home.css — landing pública novolante.com.br (Site/Home.cshtml).

   Felipe 2026-05-12 — extraído pra arquivo externo. Antes 890 linhas embedded
   em 3 blocos <style> dentro do Razor: design system, ml-banner, ml-hub.
   Externalização permite:
     - Cache pelo navegador (asp-append-version invalida quando muda)
     - Não repinta em toda navegação inter-página
     - Manutenibilidade
     - Code split entre Home.cshtml e outras views Site/*

   Ordem original preservada (referências entre seletores intactas).
   Tokens --brand/--accent/--driver permanecem locais a este arquivo (não
   sobrescrevem nv-design-system.css; landing usa paleta própria).
   ========================================================================== */

        :root {
            --brand: #2E4C6F;
            --brand-deep: #1B2A38;
            --brand-soft: #F6F4FE;
            --accent: #10b981;
            --accent-deep: #059669;
            --driver: #f97316;
            --driver-deep: #ea580c;
            --ink: #0f172a;
            --ink-2: #334155;
            --muted: #64748b;
            --surface: #ffffff;
            --bg: #f8fafc;
            --border: #e2e8f0;
            --radius: 12px;
            --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
            --shadow-md: 0 10px 30px rgba(15, 23, 42, 0.08);
            --shadow-lg: 0 24px 50px rgba(15, 23, 42, 0.12);
        }

        * { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            margin: 0;
            font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
            color: var(--ink);
            background: var(--surface);
            line-height: 1.5;
            -webkit-font-smoothing: antialiased;
        }
        img { max-width: 100%; display: block; }
        a { color: inherit; text-decoration: none; }
        button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
        h1, h2, h3, h4 { margin: 0; font-weight: 700; letter-spacing: -0.01em; }
        .container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

        /* Nav ========================================================== */
        .nv-nav {
            position: sticky;
            top: 0;
            z-index: 50;
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: saturate(1.5) blur(12px);
            border-bottom: 1px solid var(--border);
        }
        .nv-nav__inner {
            display: flex;
            align-items: center;
            justify-content: space-between;
            height: 64px;
        }
        .nv-nav__logo { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 18px; color: var(--brand-deep); }
        .nv-nav__logo img { height: 36px; width: auto; }
        .nv-nav__links { display: flex; gap: 24px; }
        .nv-nav__link {
            font-size: 14px;
            font-weight: 500;
            color: var(--ink-2);
            padding: 6px 0;
            transition: color 0.15s;
        }
        .nv-nav__link:hover { color: var(--brand); }
        .nv-nav__cta {
            padding: 8px 16px;
            background: var(--ink);
            color: #fff;
            border-radius: 8px;
            font-weight: 600;
            font-size: 14px;
        }
        .nv-nav__cta:hover { background: var(--brand-deep); }

        /* Hero dual ==================================================== */
        .nv-hero {
            padding: 48px 0 56px;
            background:
                radial-gradient(ellipse at top left, rgba(46, 76, 111, 0.08), transparent 60%),
                radial-gradient(ellipse at top right, rgba(16, 185, 129, 0.08), transparent 60%),
                var(--surface);
        }
        .nv-hero__tagline {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            font-size: 13px;
            font-weight: 600;
            color: var(--brand);
            background: var(--brand-soft);
            padding: 6px 12px;
            border-radius: 20px;
            margin-bottom: 20px;
        }
        .nv-hero__title {
            font-size: 48px;
            line-height: 1.05;
            max-width: 840px;
            margin-bottom: 14px;
            color: var(--ink);
        }
        .nv-hero__title strong { color: var(--brand); font-weight: 800; }
        .nv-hero__subtitle {
            font-size: 18px;
            color: var(--muted);
            max-width: 640px;
            margin-bottom: 36px;
        }
        .nv-hero__split {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 20px;
            margin-top: 28px;
        }
        .nv-persona {
            padding: 32px;
            border-radius: var(--radius);
            background: var(--surface);
            border: 1px solid var(--border);
            display: flex;
            flex-direction: column;
            transition: transform 0.15s, box-shadow 0.15s;
        }
        .nv-persona:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
        .nv-persona--driver {
            border-color: var(--driver);
            background: linear-gradient(135deg, #fff7ed 0%, #fff 100%);
        }
        .nv-persona--company {
            border-color: var(--brand);
            background: linear-gradient(135deg, #f0f4fb 0%, #fff 100%);
        }
        .nv-persona__tag {
            font-size: 11px;
            font-weight: 700;
            letter-spacing: 0.8px;
            text-transform: uppercase;
            color: var(--muted);
            margin-bottom: 8px;
        }
        .nv-persona--driver .nv-persona__tag { color: var(--driver-deep); }
        .nv-persona--company .nv-persona__tag { color: var(--brand); }
        .nv-persona__title {
            font-size: 24px;
            margin-bottom: 10px;
            color: var(--ink);
        }
        .nv-persona__desc {
            font-size: 15px;
            color: var(--ink-2);
            margin-bottom: 20px;
            flex: 1;
        }
        .nv-persona__actions { display: flex; gap: 10px; flex-wrap: wrap; }
        .nv-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            padding: 10px 18px;
            border-radius: 8px;
            font-weight: 600;
            font-size: 14px;
            transition: transform 0.12s, background 0.12s, color 0.12s, border-color 0.12s;
            border: 1px solid transparent;
        }
        .nv-btn:hover { transform: translateY(-1px); }
        .nv-btn--primary { background: var(--driver); color: #fff; }
        .nv-btn--primary:hover { background: var(--driver-deep); }
        .nv-btn--brand { background: var(--brand); color: #fff; }
        .nv-btn--brand:hover { background: var(--brand-deep); }
        .nv-btn--ghost { background: transparent; border-color: var(--border); color: var(--ink-2); }
        .nv-btn--ghost:hover { background: var(--bg); color: var(--ink); }
        .nv-btn--accent { background: var(--accent); color: #fff; }
        .nv-btn--accent:hover { background: var(--accent-deep); }
        .nv-btn--lg { padding: 14px 24px; font-size: 15px; }

        /* Stats ========================================================= */
        .nv-stats {
            padding: 32px 0;
            background: var(--bg);
            border-top: 1px solid var(--border);
            border-bottom: 1px solid var(--border);
        }
        .nv-stats__grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 16px;
        }
        .nv-stat { text-align: center; padding: 12px; }
        .nv-stat__value {
            font-size: 40px;
            font-weight: 800;
            color: var(--brand);
            line-height: 1;
        }
        .nv-stat__label {
            font-size: 13px;
            font-weight: 500;
            color: var(--muted);
            margin-top: 6px;
        }

        /* Vagas em destaque ============================================= */
        .nv-section { padding: 72px 0; }
        .nv-section__eyebrow {
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 1px;
            text-transform: uppercase;
            color: var(--accent);
            margin-bottom: 8px;
        }
        .nv-section__title {
            font-size: 36px;
            color: var(--ink);
            margin-bottom: 14px;
            max-width: 680px;
        }
        .nv-section__subtitle {
            font-size: 17px;
            color: var(--muted);
            max-width: 620px;
            margin-bottom: 40px;
        }

        .nv-jobs__grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 16px;
        }
        .nv-job {
            padding: 20px;
            border: 1px solid var(--border);
            border-radius: var(--radius);
            background: var(--surface);
            display: flex;
            flex-direction: column;
            transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
        }
        .nv-job:hover {
            transform: translateY(-2px);
            box-shadow: var(--shadow-md);
            border-color: var(--brand);
        }
        .nv-job__tag {
            display: inline-block;
            font-size: 10px;
            font-weight: 700;
            letter-spacing: 0.5px;
            text-transform: uppercase;
            color: var(--accent-deep);
            background: #d1fae5;
            padding: 3px 8px;
            border-radius: 4px;
            margin-bottom: 10px;
            align-self: flex-start;
        }
        .nv-job__tag--ml { background: #fef3c7; color: #b45309; }
        .nv-job__title {
            font-size: 16px;
            font-weight: 700;
            color: var(--ink);
            margin-bottom: 6px;
        }
        .nv-job__meta {
            font-size: 13px;
            color: var(--muted);
            margin-bottom: 14px;
        }
        .nv-job__empresa {
            font-size: 12px;
            color: var(--muted);
            margin-bottom: 12px;
        }
        .nv-job__salary {
            font-size: 15px;
            font-weight: 700;
            color: var(--brand);
            margin-top: auto;
            padding-top: 12px;
            border-top: 1px dashed var(--border);
        }
        .nv-jobs__more {
            text-align: center;
            margin-top: 36px;
        }

        /* Como funciona (driver) ======================================= */
        .nv-steps {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 20px;
            margin-top: 24px;
        }
        .nv-step {
            padding: 24px;
            background: var(--surface);
            border: 1px solid var(--border);
            border-radius: var(--radius);
            position: relative;
        }
        .nv-step__num {
            width: 36px;
            height: 36px;
            border-radius: 10px;
            background: var(--driver);
            color: #fff;
            font-size: 16px;
            font-weight: 800;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 14px;
        }
        .nv-step__title { font-size: 17px; margin-bottom: 6px; }
        .nv-step__desc { font-size: 14px; color: var(--muted); }

        /* Categorias CNH (SEO) ======================================== */
        .nv-cats {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 16px;
            margin-bottom: 40px;
        }
        .nv-cat {
            padding: 24px;
            border: 1px solid var(--border);
            border-radius: var(--radius);
            background: var(--surface);
            transition: transform 0.15s, box-shadow 0.15s;
        }
        .nv-cat:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
        .nv-cat__badge {
            width: 40px;
            height: 40px;
            border-radius: 10px;
            background: var(--brand);
            color: #fff;
            font-size: 16px;
            font-weight: 800;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 14px;
        }
        .nv-cat h3 { font-size: 17px; margin-bottom: 6px; color: var(--ink); }
        .nv-cat p { font-size: 14px; color: var(--muted); line-height: 1.55; margin: 0; }
        .nv-cat p a { color: var(--brand); font-weight: 600; white-space: nowrap; }
        .nv-cat p a:hover { color: var(--accent); }

        .nv-cats__cities {
            padding: 24px;
            background: var(--bg);
            border-radius: var(--radius);
            border: 1px solid var(--border);
        }
        .nv-cats__cities-title {
            font-size: 14px;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            color: var(--muted);
            margin: 0 0 10px;
            font-weight: 700;
        }
        .nv-cats__cities-list {
            font-size: 15px;
            color: var(--ink-2);
            line-height: 1.9;
            margin: 0;
        }
        .nv-cats__cities-list a {
            color: var(--brand);
            font-weight: 500;
        }
        .nv-cats__cities-list a:hover { color: var(--accent); text-decoration: underline; }

        /* FAQ ========================================================= */
        .nv-faq {
            max-width: 880px;
            margin: 24px 0 0;
            display: flex;
            flex-direction: column;
            gap: 8px;
        }
        .nv-faq__item {
            background: var(--surface);
            border: 1px solid var(--border);
            border-radius: var(--radius);
            padding: 4px 20px;
            transition: box-shadow 0.15s;
        }
        .nv-faq__item[open] {
            box-shadow: var(--shadow-sm);
            border-color: var(--brand);
        }
        .nv-faq__question {
            font-size: 16px;
            font-weight: 600;
            color: var(--ink);
            padding: 16px 0;
            cursor: pointer;
            list-style: none;
            position: relative;
            padding-right: 32px;
        }
        .nv-faq__question::-webkit-details-marker { display: none; }
        .nv-faq__question::after {
            content: "+";
            position: absolute;
            right: 4px;
            top: 50%;
            transform: translateY(-50%);
            font-size: 20px;
            color: var(--brand);
            font-weight: 400;
            transition: transform 0.2s;
        }
        .nv-faq__item[open] .nv-faq__question::after {
            content: "−";
        }
        .nv-faq__answer {
            font-size: 15px;
            color: var(--ink-2);
            padding: 4px 0 20px;
            line-height: 1.6;
        }

        /* Features (empresa) =========================================== */
        .nv-section--dark {
            background: var(--brand-deep);
            color: #fff;
        }
        .nv-section--dark .nv-section__title { color: #fff; }
        .nv-section--dark .nv-section__subtitle { color: rgba(255, 255, 255, 0.7); }
        .nv-section--dark .nv-section__eyebrow { color: #6ee7b7; }

        .nv-features__grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 16px;
            margin-top: 24px;
        }
        .nv-feature {
            padding: 24px;
            border-radius: var(--radius);
            background: rgba(255, 255, 255, 0.05);
            border: 1px solid rgba(255, 255, 255, 0.08);
            transition: background 0.2s;
        }
        .nv-feature:hover { background: rgba(255, 255, 255, 0.08); }
        .nv-feature__icon {
            width: 40px;
            height: 40px;
            border-radius: 10px;
            background: rgba(16, 185, 129, 0.15);
            color: #6ee7b7;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 20px;
            margin-bottom: 14px;
        }
        .nv-feature__title {
            font-size: 16px;
            color: #fff;
            margin-bottom: 6px;
        }
        .nv-feature__desc {
            font-size: 13px;
            color: rgba(255, 255, 255, 0.7);
        }

        /* Depoimentos ================================================== */
        .nv-testimonials {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 16px;
            margin-top: 24px;
        }
        .nv-testimonial {
            padding: 24px;
            background: var(--surface);
            border: 1px solid var(--border);
            border-radius: var(--radius);
        }
        .nv-testimonial__quote {
            font-size: 15px;
            color: var(--ink-2);
            margin-bottom: 14px;
            line-height: 1.6;
        }
        .nv-testimonial__quote::before { content: "\201C"; font-size: 32px; color: var(--brand); line-height: 0; vertical-align: -8px; margin-right: 4px; }
        .nv-testimonial__author {
            font-size: 13px;
            color: var(--muted);
            font-weight: 600;
        }

        /* CTA final ==================================================== */
        .nv-cta-final {
            padding: 72px 0;
            background: linear-gradient(135deg, var(--brand) 0%, var(--brand-deep) 100%);
            color: #fff;
        }
        .nv-cta-final__grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 24px;
        }
        .nv-cta-card {
            padding: 32px;
            background: rgba(255, 255, 255, 0.06);
            border: 1px solid rgba(255, 255, 255, 0.12);
            border-radius: var(--radius);
        }
        .nv-cta-card h3 { color: #fff; font-size: 22px; margin-bottom: 10px; }
        .nv-cta-card p { font-size: 15px; color: rgba(255, 255, 255, 0.8); margin: 0 0 20px; }

        /* Footer ======================================================= */
        footer {
            background: var(--ink);
            color: #94a3b8;
            padding: 56px 0 24px;
        }
        .nv-footer__grid {
            display: grid;
            grid-template-columns: 2fr 1fr 1fr 1fr;
            gap: 32px;
            margin-bottom: 40px;
        }
        .nv-footer h4 {
            color: #fff;
            font-size: 13px;
            text-transform: uppercase;
            letter-spacing: 1px;
            margin-bottom: 12px;
        }
        .nv-footer__desc { font-size: 14px; line-height: 1.6; margin-top: 12px; }
        .nv-footer ul { list-style: none; padding: 0; margin: 0; }
        .nv-footer ul li { margin-bottom: 8px; }
        .nv-footer ul a { font-size: 14px; color: #cbd5e1; }
        .nv-footer ul a:hover { color: #fff; }
        .nv-footer__bottom {
            padding-top: 24px;
            border-top: 1px solid rgba(255, 255, 255, 0.1);
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 13px;
        }

        /* Responsivo =================================================== */
        @media (max-width: 900px) {
            .nv-hero__title { font-size: 36px; }
            .nv-section__title { font-size: 28px; }
            .nv-hero__split,
            .nv-jobs__grid,
            .nv-steps,
            .nv-cats,
            .nv-features__grid,
            .nv-testimonials,
            .nv-cta-final__grid { grid-template-columns: 1fr; }
            .nv-stats__grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
            .nv-stat__value { font-size: 28px; }
            .nv-footer__grid { grid-template-columns: 1fr 1fr; gap: 24px; }
            .nv-nav__links { display: none; }
        }
        @media (max-width: 500px) {
            .nv-section { padding: 48px 0; }
            .nv-footer__grid { grid-template-columns: 1fr; }
            .nv-footer__bottom { flex-direction: column; gap: 10px; text-align: center; }
        }
        /* Felipe 2026-05-12 — banner mantém cores brand Mercado Livre
           (amarelo #FFE600 + azul #3483FA): faz sentido visual porque é
           anúncio explícito da campanha ML. O restante do site
           (spotlight/hub/etc) já vive em paleta NoVolante — banner é
           o único elemento intencionalmente ML. Dispense-able cookie 7d. */
        .ml-banner {
            position: sticky; top: 0; z-index: 2000;
            display: flex; align-items: stretch;
            background: linear-gradient(90deg, #FFE600 0%, #FFF06B 50%, #FFE600 100%);
            background-size: 200% 100%;
            animation: mlBannerShine 8s ease-in-out infinite;
            border-bottom: 2px solid #3483FA;
            box-shadow: 0 2px 6px rgba(0,0,0,0.08);
        }
        @keyframes mlBannerShine { 0%,100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
        .ml-banner[hidden] { display: none !important; }
        .ml-banner__link {
            flex: 1;
            display: flex; align-items: center; gap: 12px;
            padding: 10px 18px;
            color: #2d3436;
            text-decoration: none;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Inter, sans-serif;
            min-width: 0;
        }
        .ml-banner__link:hover { color: #3483FA; }
        .ml-banner__pulse {
            width: 10px; height: 10px; border-radius: 50%;
            background: #ef4444;
            box-shadow: 0 0 0 0 rgba(239,68,68,0.8);
            animation: mlPulse 1.6s infinite;
            flex-shrink: 0;
        }
        @keyframes mlPulse {
            0%   { box-shadow: 0 0 0 0 rgba(239,68,68,0.7); }
            70%  { box-shadow: 0 0 0 12px rgba(239,68,68,0); }
            100% { box-shadow: 0 0 0 0 rgba(239,68,68,0); }
        }
        .ml-banner__emoji { font-size: 22px; flex-shrink: 0; }
        .ml-banner__text {
            display: flex; flex-direction: column; gap: 1px;
            min-width: 0;
            line-height: 1.25;
        }
        .ml-banner__text strong {
            font-size: 14px; font-weight: 800; color: #2d3436;
            white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
        }
        .ml-banner__sub {
            font-size: 12px; color: #4b5563; font-weight: 500;
            white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
        }
        .ml-banner__cta {
            margin-left: auto;
            padding: 8px 18px;
            background: #3483FA; color: #fff;
            border-radius: 999px;
            font-size: 13px; font-weight: 700;
            white-space: nowrap; flex-shrink: 0;
            transition: background 0.12s, transform 0.12s;
        }
        .ml-banner__link:hover .ml-banner__cta { background: #1d4ed8; transform: translateX(2px); }
        .ml-banner__close {
            background: transparent; border: none; cursor: pointer;
            font-size: 22px; line-height: 1; color: #2d3436;
            padding: 0 14px; font-weight: 300;
            align-self: stretch;
            opacity: 0.5;
        }
        .ml-banner__close:hover { opacity: 1; }

        @media (max-width: 700px) {
            .ml-banner__link { padding: 8px 12px; gap: 8px; }
            .ml-banner__emoji { font-size: 18px; }
            .ml-banner__text strong { font-size: 12px; }
            .ml-banner__sub { font-size: 10px; }
            .ml-banner__cta { padding: 6px 12px; font-size: 11px; margin-left: 6px; }
            .ml-banner__close { padding: 0 10px; font-size: 18px; }
        }
            .ml-hub {
                padding: 64px 0;
                background: linear-gradient(135deg, #eaf1fa 0%, #2E4C6F 60%, #1B2A38 100%);
                position: relative;
                overflow: hidden;
            }
            .ml-hub::before {
                content: "";
                position: absolute;
                top: -80px; right: -80px;
                width: 360px; height: 360px;
                background: radial-gradient(circle, rgba(46,76,111,0.18) 0%, transparent 70%);
                pointer-events: none;
            }
            .ml-hub__grid {
                display: block;
                position: relative;
                z-index: 1;
                max-width: 820px;
            }
            .ml-hub__eyebrow {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                font-size: 13px;
                font-weight: 700;
                color: #1B2A38;
                background: rgba(255,255,255,0.6);
                padding: 6px 14px;
                border-radius: 999px;
                margin-bottom: 16px;
                border: 1px solid rgba(27,42,56,0.1);
            }
            .ml-hub__eyebrow-dot {
                width: 8px; height: 8px;
                background: #dc2626;
                border-radius: 50%;
                animation: mlPulse 1.5s infinite;
            }
            @keyframes mlPulse {
                0%, 100% { opacity: 1; transform: scale(1); }
                50% { opacity: 0.6; transform: scale(1.2); }
            }
            .ml-hub__title {
                font-size: 40px;
                line-height: 1.15;
                font-weight: 800;
                color: #1B2A38;
                margin: 0 0 16px;
            }
            .ml-hub__title strong { color: #2E4C6F; font-weight: 900; }
            .ml-hub__lead {
                font-size: 17px;
                line-height: 1.55;
                color: #374151;
                margin: 0 0 28px;
                max-width: 580px;
            }
            .ml-hub__stats {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 16px;
                margin-bottom: 32px;
            }
            .ml-hub__stat {
                background: rgba(255,255,255,0.75);
                padding: 18px 16px;
                border-radius: 14px;
                border: 1px solid rgba(27,42,56,0.08);
                backdrop-filter: blur(4px);
            }
            .ml-hub__stat-value {
                font-size: 28px;
                font-weight: 900;
                color: #2E4C6F;
                line-height: 1;
                margin-bottom: 6px;
            }
            .ml-hub__stat-label {
                font-size: 12px;
                color: #374151;
                font-weight: 600;
                line-height: 1.35;
            }
            .ml-hub__cta-row {
                display: flex;
                gap: 12px;
                flex-wrap: wrap;
                margin-bottom: 20px;
            }
            .ml-hub__btn-primary {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                background: #1B2A38;
                color: #fff;
                padding: 16px 28px;
                border-radius: 12px;
                font-weight: 800;
                font-size: 16px;
                text-decoration: none;
                transition: all 0.15s;
                box-shadow: 0 4px 14px rgba(27,42,56,0.25);
            }
            .ml-hub__btn-primary:hover {
                background: #2E4C6F;
                color: #fff;
                transform: translateY(-2px);
                box-shadow: 0 8px 20px rgba(46,76,111,0.35);
            }
            .ml-hub__btn-secondary {
                display: inline-flex;
                align-items: center;
                background: rgba(255,255,255,0.85);
                color: #1B2A38;
                padding: 16px 24px;
                border-radius: 12px;
                font-weight: 700;
                font-size: 15px;
                text-decoration: none;
                border: 2px solid #1B2A38;
                transition: all 0.15s;
            }
            .ml-hub__btn-secondary:hover { background: #1B2A38; color: #fff; }
            .ml-hub__trust {
                font-size: 14px;
                color: #374151;
                font-weight: 500;
                display: inline-flex;
                align-items: center;
                gap: 6px;
            }
            .ml-hub__trust-check {
                width: 20px; height: 20px;
                background: #16a34a;
                color: #fff;
                border-radius: 50%;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-size: 12px;
                font-weight: 900;
            }
            .ml-hub__card {
                background: #fff;
                border-radius: 20px;
                padding: 26px;
                box-shadow: 0 20px 40px rgba(27,42,56,0.15);
                border: 1px solid rgba(27,42,56,0.06);
            }
            .ml-hub__card-head {
                display: flex;
                align-items: center;
                gap: 14px;
                padding-bottom: 18px;
                margin-bottom: 18px;
                border-bottom: 1px solid #f1f5f9;
            }
            .ml-hub__card-icon {
                width: 52px; height: 52px;
                background: linear-gradient(135deg, #2E4C6F, #2E4C6F);
                border-radius: 14px;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 28px;
            }
            .ml-hub__card-head-txt { display: flex; flex-direction: column; }
            .ml-hub__card-head-txt strong {
                font-size: 17px;
                color: #1B2A38;
                font-weight: 800;
            }
            .ml-hub__card-head-txt span {
                font-size: 13px;
                color: #64748b;
            }
            .ml-hub__checks {
                list-style: none;
                padding: 0;
                margin: 0 0 20px;
                display: flex;
                flex-direction: column;
                gap: 10px;
            }
            .ml-hub__checks li {
                display: flex;
                align-items: center;
                gap: 10px;
                font-size: 15px;
                color: #1B2A38;
                font-weight: 500;
            }
            .ml-hub__checks li span {
                width: 22px; height: 22px;
                background: #dcfce7;
                color: #16a34a;
                border-radius: 50%;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-weight: 900;
                font-size: 13px;
                flex-shrink: 0;
            }
            .ml-hub__cities { padding-top: 16px; border-top: 1px solid #f1f5f9; }
            .ml-hub__cities strong {
                display: block;
                font-size: 13px;
                color: #64748b;
                font-weight: 700;
                margin-bottom: 10px;
                text-transform: uppercase;
                letter-spacing: 0.5px;
            }
            .ml-hub__cities-chips {
                display: flex;
                flex-wrap: wrap;
                gap: 6px;
            }
            .ml-hub__cities-chips span {
                font-size: 12px;
                background: #f1f5f9;
                color: #1B2A38;
                padding: 5px 10px;
                border-radius: 999px;
                font-weight: 600;
            }

            @media (max-width: 900px) {
                .ml-hub { padding: 40px 0; }
                .ml-hub__grid { grid-template-columns: 1fr; gap: 28px; }
                .ml-hub__title { font-size: 28px; }
                .ml-hub__lead { font-size: 15px; }
                .ml-hub__stats { grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
                .ml-hub__stat { padding: 12px 10px; }
                .ml-hub__stat-value { font-size: 20px; }
                .ml-hub__stat-label { font-size: 10px; }
                .ml-hub__btn-primary, .ml-hub__btn-secondary { padding: 14px 20px; font-size: 14px; flex: 1; justify-content: center; }
            }