/* Styles for sobre.html */
/* Bloqueia scroll horizontal em qualquer tamanho de tela */
        html {
            overflow-x: hidden !important;
            max-width: 100% !important;
            overscroll-behavior-x: none;
        }
        body {
            overflow-x: hidden !important;
            max-width: 100% !important;
            width: 100% !important;
            overscroll-behavior-x: none;
        }
        body { font-family: 'Inter', sans-serif; font-weight: 300; line-height: 1.5; color: #334155; letter-spacing: -0.01em; }
        h1, h2, h3, h4, h5, h6 { font-family: 'Inter', sans-serif; font-weight: 700; letter-spacing: -0.025em; }

        /* Logo: mantém a mesma proporção da página principal */
        #logo-img {
            display: block;
            max-width: none !important;
            width: auto !important;
            height: 32px !important;
            object-fit: contain;
        }
        @media (min-width: 1024px) {
            #logo-img {
                height: 36px !important;
            }
        }

        /* Navbar responsive */
        @media (max-width: 1023px) {
            #desktop-nav { display: none !important; }
            #desktop-cta { display: none !important; }
            #mobile-menu-toggle { display: flex !important; }
        }
        @media (min-width: 1024px) {
            #desktop-nav { display: flex !important; }
            #desktop-cta { display: block !important; }
            #mobile-menu-toggle { display: none !important; }
        }
        /* Navbar scrolled state */
        #navbar { transition: all 0.3s ease; }
        #navbar.scrolled { background: #ffffff !important; box-shadow: 0 4px 20px rgba(0,0,0,0.08); border-bottom: 1px solid #f1f5f9; }
        #navbar.scrolled a { color: #003956 !important; }
        #navbar.scrolled #nav-nav-produtos { color: #003956 !important; }
        #navbar.scrolled > div svg { stroke: #003956 !important; }
        /* Dropdown */
        #produtos-dropdown {
            position: absolute;
            left: 0; right: 0; top: 100%;
            opacity: 0; visibility: hidden;
            transform: translateY(-6px);
            transition: opacity 0.22s ease, transform 0.22s ease, visibility 0s linear 0.22s;
            z-index: 99;
        }
        #produtos-dropdown.open {
            opacity: 1; visibility: visible; transform: translateY(0);
            transition: opacity 0.22s ease, transform 0.22s ease, visibility 0s;
        }
        .dd-prod-link {
            display: flex; align-items: center; gap: 11px;
            padding: 8px 10px; font-size: 15px; color: #334155;
            font-weight: 400; border: none; border-radius: 8px;
            background: none; cursor: pointer; width: 100%;
            text-align: left; transition: color 0.15s, background 0.15s;
            text-decoration: none;
        }
        .dd-prod-link:hover { color: #0099dd; background: #f0f7ff; }
        .dd-prod-link:hover .dd-icon { background: rgba(0,153,221,0.15); }
        .dd-icon {
            width: 30px; height: 30px; background: #f1f5f9;
            border-radius: 7px; display: flex; align-items: center;
            justify-content: center; flex-shrink: 0; transition: background 0.15s;
        }
        /* Mobile Menu */
        #mobile-menu {
            position: fixed; top: 0; right: -100%; width: 85%; max-width: 360px;
            height: 100vh; background: #fff; z-index: 200;
            transition: right 0.35s cubic-bezier(.4,0,.2,1);
            overflow-y: auto; padding: 0;
            box-shadow: -8px 0 40px rgba(0,0,0,0.15);
        }
        #mobile-menu.open { right: 0; }
        #mobile-overlay {
            display: none; position: fixed; inset: 0;
            background: rgba(0,0,0,0.5); z-index: 190;
        }
        #mobile-overlay.open { display: block; }
        .mobile-menu-logo {
            display: block;
            width: 125px !important;
            height: 36px !important;
            max-width: none !important;
            object-fit: contain;
            object-position: left center;
            flex-shrink: 0;
        }
        .nav-link { position: relative; }
        .nav-link::after { content:''; position:absolute; left:0; bottom:-4px; width:0; height:2px; background:#0099dd; transition:width 0.3s ease; }
        .nav-link:hover::after { width:100%; }

        /* â”€â”€ TIMELINE FULLSCREEN â”€â”€ */
        .tl-section { background: #ffffff; position: relative; overflow-x: hidden; }

        /* Linha vertical animada para mobile */
        #tl-mobile-line {
            display: none; /* oculta no desktop */
            position: absolute;
            left: 26px;
            top: 0;
            width: 2px;
            height: 0; /* controlado por JS */
            background: linear-gradient(to bottom, #0099dd, #005580);
            z-index: 54;
            pointer-events: none;
        }

        /* Linha zigzag SVG */
        .tl-rail-svg {
            position: absolute;
            left: 0; top: 0; width: 100%;
            pointer-events: none;
            z-index: 50;
            overflow: hidden;
        }

        /* Cada "slide" ocupa a tela toda — scroll natural */
        .tl-slide {
            position: relative;
            min-height: 70vh;
            display: flex;
            align-items: center;
            padding: 60px 80px 60px 140px;
            overflow: hidden;
            background: #ffffff;
        }
        .tl-slide.reverse {
            justify-content: flex-end;
            padding: 60px 140px 60px 80px;
        }

        /* Dot na linha */
        .tl-dot {
            position: absolute;
            left: 64px; top: 50%;
            transform: translateY(-50%) scale(0.5);
            width: 18px; height: 18px; border-radius: 50%;
            background: rgba(0,153,221,0.4);
            box-shadow: none;
            z-index: 56;
            transition: transform 0.5s cubic-bezier(.16,1,.3,1),
                        background 0.4s ease,
                        box-shadow 0.4s ease;
        }
        .tl-slide.active .tl-dot {
            background: #0099dd;
            transform: translateY(-50%) scale(1);
            box-shadow: 0 0 0 6px rgba(0,153,221,0.25), 0 0 0 14px rgba(0,153,221,0.1);
            animation: dotPulse 2.2s ease-out infinite;
        }
        @keyframes dotPulse {
            0%   { box-shadow: 0 0 0 0   rgba(0,153,221,0.55), 0 0 0 0   rgba(0,153,221,0.3); }
            60%  { box-shadow: 0 0 0 10px rgba(0,153,221,0.15), 0 0 0 22px rgba(0,153,221,0.06); }
            100% { box-shadow: 0 0 0 14px rgba(0,153,221,0),    0 0 0 28px rgba(0,153,221,0);   }
        }
        .tl-slide.reverse .tl-dot {
            left: auto;
            right: 64px;
            top: 50%;
        }

        /* Linha horizontal do dot até o conteúdo */
        .tl-connector {
            position: absolute;
            left: 82px; top: 50%; height: 1px; width: 40px;
            background: linear-gradient(to right, #0099dd, rgba(0,153,221,0.3));
            transform: translateY(-50%);
            z-index: 55;
            opacity: 0;
            transition: opacity 0.5s ease 0.3s;
        }
        .tl-slide.active .tl-connector {
            opacity: 1;
        }
        .tl-slide.reverse .tl-connector {
            left: auto;
            right: 82px;
            top: 50%;
            background: linear-gradient(to left, #0099dd, rgba(0,153,221,0.3));
        }
        #tl-3.tl-slide.reverse .tl-dot,
        #tl-4.tl-slide.reverse .tl-dot {
            right: 103px;
        }
        #tl-3.tl-slide.reverse .tl-connector,
        #tl-4.tl-slide.reverse .tl-connector {
            right: 121px;
        }

        /* Conteúdo do slide */
        .tl-content {
            max-width: 580px;
            width: 100%;
            position: relative;
            z-index: 55;
            margin-top: 80px;
        }

        /* Animação escalonada de cada elemento */
        .tl-year, .tl-title, .tl-desc, .tl-badge {
            opacity: 0;
            transform: translateY(36px);
            transition: opacity 0.7s cubic-bezier(.16,1,.3,1),
                        transform 0.7s cubic-bezier(.16,1,.3,1);
        }
        .tl-slide.active .tl-year  { opacity: 1; transform: translateY(0); transition-delay: 0.05s; }
        .tl-slide.active .tl-title { opacity: 1; transform: translateY(0); transition-delay: 0.15s; }
        .tl-slide.active .tl-desc  { opacity: 1; transform: translateY(0); transition-delay: 0.28s; }
        .tl-slide.active .tl-badge { opacity: 1; transform: translateY(0); transition-delay: 0.40s; }

        .tl-year {
            font-size: 18px; font-weight: 800; color: #0099dd;
            letter-spacing: 0.15em; text-transform: uppercase;
            display: inline-block; margin-bottom: 20px;
            padding: 0;
        }
        .tl-title {
            font-size: clamp(38px, 5.5vw, 68px);
            font-weight: 700; line-height: 1.05; color: #001e2e;
            margin-bottom: 32px; letter-spacing: -0.025em;
        }
        .tl-desc {
            font-size: clamp(16px, 1.3vw, 20px);
            line-height: 1.7; color: rgba(0,30,46,0.7); max-width: 580px;
            font-weight: 400;
        }
        .tl-badge {
            display: inline-block; margin-top: 24px;
            background: rgba(0,153,221,0.12);
            border: 1px solid rgba(0,153,221,0.3);
            color: #0099dd; font-size: 12px; font-weight: 700;
            padding: 6px 18px; border-radius: 9999px;
            letter-spacing: 0.05em;
        }
        /* Espaçamento extra no slide 2026 */
        #tl-4 {
            min-height: 90vh;
            padding-top: 100px;
            padding-bottom: 100px;
        }
        #tl-4 .tl-content {
            margin-top: 0;
        }
        #tl-4 .tl-year {
            margin-bottom: 32px;
        }
        #tl-4 .tl-title {
            margin-bottom: 48px;
        }
        #tl-4 .tl-desc {
            margin-bottom: 12px;
        }

        /* Troféu/prêmio físico */
        .tl-trophy {
            margin-top: 32px;
            display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap;
        }
        .tl-trophy-img {
            width: 90px; height: auto;
            opacity: 0; transform: translateY(10px) scale(0.96);
            transition: opacity 0.35s cubic-bezier(.16,1,.3,1), transform 0.35s cubic-bezier(.16,1,.3,1);
            mix-blend-mode: multiply;
        }
        .tl-slide.active .tl-trophy-img { opacity: 1; transform: translateY(0) scale(1); transition-delay: 0.1s; }
        .tl-trophy-label {
            font-size: 11px; font-weight: 700; color: rgba(0,30,46,0.4);
            letter-spacing: 0.1em; text-transform: uppercase;
            align-self: center;
            opacity: 0;
            transition: opacity 0.35s cubic-bezier(.16,1,.3,1);
        }
        .tl-slide.active .tl-trophy-label { opacity: 1; transition-delay: 0.18s; }

        /* Logo antiga como marca d'água — slide 2013 */
        .tl-bg-old-logo {
            position: absolute;
            right: 60px;
            top: 50%;
            transform: translateY(-50%);
            z-index: 0;
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.8s ease;
            user-select: none;
        }
        .tl-bg-old-logo img {
            width: clamp(320px, 38vw, 580px);
            height: auto;
            display: block;
            filter: grayscale(1) brightness(1.1);
            opacity: 0.07;
        }
        .tl-slide.active .tl-bg-old-logo { opacity: 1; }

        /* Ícone SVG de fundo — watermark temático */
        @keyframes icon-draw {
            from { stroke-dashoffset: 1000; opacity: 0; }
            to   { stroke-dashoffset: 0;    opacity: 1; }
        }
        @keyframes icon-scale-in {
            from { transform: translateY(-50%) scale(0.85); }
            to   { transform: translateY(-50%) scale(1); }
        }
        .tl-bg-icon {
            position: absolute;
            right: 18%;
            top: 60%;
            transform: translateY(-50%) scale(0.85);
            z-index: 0;
            opacity: 0;
            pointer-events: none;
            user-select: none;
            transition: opacity 0.6s ease, transform 0.8s cubic-bezier(.16,1,.3,1);
        }
        .tl-slide.reverse .tl-bg-icon {
            right: auto;
            left: 18%;
        }
        .tl-slide.active .tl-bg-icon {
            opacity: 1;
            transform: translateY(-50%) scale(1);
        }
        .tl-bg-icon svg {
            width: clamp(260px, 30vw, 420px);
            height: auto;
            display: block;
            color: #d1d5db;
            overflow: visible;
        }
        /* Stroke draw nos paths/polylines/circles do ícone */
        .tl-bg-icon svg path,
        .tl-bg-icon svg polyline,
        .tl-bg-icon svg circle,
        .tl-bg-icon svg rect {
            stroke-dasharray: 1000;
            stroke-dashoffset: 1000;
            opacity: 0;
        }
        .tl-slide.active .tl-bg-icon svg path,
        .tl-slide.active .tl-bg-icon svg polyline,
        .tl-slide.active .tl-bg-icon svg circle,
        .tl-slide.active .tl-bg-icon svg rect {
            animation: icon-draw 1.6s cubic-bezier(.4,0,.2,1) forwards;
            animation-delay: 0.3s;
        }
        /* Layers 2026: camadas se desenham de baixo pra cima */
        #tl-4 .tl-bg-icon svg .layer-bottom,
        #tl-4 .tl-bg-icon svg .layer-mid,
        #tl-4 .tl-bg-icon svg .layer-top {
            stroke-dasharray: 200;
            stroke-dashoffset: 200;
            opacity: 0;
            animation: none;
        }
        #tl-4.active .tl-bg-icon svg .layer-bottom { animation: layer-draw 0.3s cubic-bezier(.4,0,.2,1) forwards; animation-delay: 0.1s; }
        #tl-4.active .tl-bg-icon svg .layer-mid    { animation: layer-draw 0.3s cubic-bezier(.4,0,.2,1) forwards; animation-delay: 0.3s; }
        #tl-4.active .tl-bg-icon svg .layer-top    { animation: layer-draw 0.4s cubic-bezier(.4,0,.2,1) forwards; animation-delay: 0.5s; }
        @keyframes layer-draw {
            to { stroke-dashoffset: 0; opacity: 1; }
        }

        /* Override genérico para as polylines do gráfico 2014-2019 */
        #tl-1 .tl-bg-icon svg .chart-line,
        #tl-1 .tl-bg-icon svg .chart-arrow {
            stroke-dasharray: 120;
            stroke-dashoffset: 120;
            opacity: 0;
            animation: none;
        }

        /* Gráfico 2014-2019: linha se desenha, depois seta */
        #tl-1.active .tl-bg-icon svg .chart-line,
        #tl-1.active .tl-bg-icon svg .chart-arrow {
            stroke-dasharray: 120;
            stroke-dashoffset: 120;
            opacity: 1;
            animation: chart-draw 1.2s cubic-bezier(.4,0,.2,1) forwards;
        }
        #tl-1.active .tl-bg-icon svg .chart-line  { animation-duration: 0.5s; animation-delay: 0.1s; }
        #tl-1.active .tl-bg-icon svg .chart-arrow { animation-duration: 0.5s; animation-delay: 0.5s; }
        @keyframes chart-draw {
            to { stroke-dashoffset: 0; }
        }

        /* Bloco de cima: cai após a base ser desenhada */
        @keyframes cube-drop {
            0%   { transform: translateY(-60px); opacity: 0; }
            65%  { transform: translateY(4px);   opacity: 1; }
            80%  { transform: translateY(-3px); }
            100% { transform: translateY(0px);   opacity: 1; }
        }
        .tl-bg-icon .top-cube { opacity: 0; }
        .tl-slide.active .tl-bg-icon .top-cube {
            animation: cube-drop 0.65s cubic-bezier(.36,.07,.19,.97) forwards;
            animation-delay: 1.6s;
        }
        /* 2013: ícone mais rápido */
        #tl-0.active .tl-bg-icon svg path { animation-duration: 0.6s !important; animation-delay: 0.1s !important; }
        #tl-0.active .tl-bg-icon .top-cube { animation-delay: 0.7s !important; }
        /* Paths do cubo de cima NÃO usam stroke-draw — aparecem de uma vez com o drop */
        .tl-bg-icon svg .top-cube path {
            stroke-dasharray: none !important;
            stroke-dashoffset: 0 !important;
            opacity: 1 !important;
            animation: none !important;
        }
        .tl-slide.active .tl-bg-icon svg .top-cube path {
            animation: none !important;
        }
        /* Foguete 2020-2022: volta ao eixo principal da timeline */
        #tl-2 .tl-bg-icon   { top: 50%; }
        #tl-4 .tl-bg-icon   { top: 50%; }
        #tl-2 .tl-dot       { top: 50%; }
        #tl-2 .tl-connector { top: 50%; }

        .rocket-wrapper { display: block; transform-origin: 50% 78%; }
        .rocket-vehicle { transform-origin: 50% 52%; }
        .rocket-flame {
            opacity: 0;
            transform-origin: 50% 0%;
        }
        #tl-2.active .rocket-wrapper {
            animation: rocket-launch 4.8s cubic-bezier(.22,.8,.28,1) 0.5s infinite;
        }
        #tl-2.active .rocket-vehicle {
            animation: rocket-rumble 4.8s ease-in-out 0.5s infinite;
        }
        #tl-2.active .rocket-flame {
            animation: rocket-flame 4.8s ease-in-out 0.5s infinite;
        }
        @keyframes rocket-rumble {
            0%, 8%, 100% { transform: translateY(0) rotate(0deg); }
            2% { transform: translateY(4px) rotate(-1.2deg); }
            4% { transform: translateY(-3px) rotate(1.2deg); }
            6% { transform: translateY(3px) rotate(-0.8deg); }
            14% { transform: translateY(0) rotate(0deg); }
            28% { transform: translateY(-10px) rotate(-1deg); }
            45% { transform: translateY(-22px) rotate(0deg); }
            100% { transform: translateY(0) rotate(0deg); }
        }
        @keyframes rocket-launch {
            0%, 14% { transform: translateY(0); opacity: 1; }
            42% { transform: translateY(-210px); opacity: 0; }
            43% { transform: translateY(160px); opacity: 0; }
            58% { transform: translateY(0); opacity: 1; }
            100% { transform: translateY(0); opacity: 1; }
        }
        @keyframes rocket-flame {
            0%, 10%, 100% { opacity: 0; transform: scaleY(0.65); }
            14% { opacity: 1; transform: scaleY(1.2); }
            24% { opacity: 1; transform: scaleY(0.9); }
            34% { opacity: 0.85; transform: scaleY(1.35); }
            42% { opacity: 0; transform: scaleY(0.4); }
            58% { opacity: 0; transform: scaleY(0.4); }
            66% { opacity: 1; transform: scaleY(1.1); }
            76% { opacity: 0.9; transform: scaleY(0.95); }
        }

        @media (max-width: 768px) { .tl-bg-icon { display: none; } }
        @media (max-width: 768px) { .tl-bg-old-logo { display: none; } }

        /* Número do ano em background — sutil watermark */
        .tl-bg-year {
            position: absolute; right: 80px; top: 50%; transform: translateY(-50%);
            font-size: clamp(80px, 16vw, 220px); color: rgba(0,30,46,0.05);
            font-weight: 900; z-index: 0; user-select: none;
            letter-spacing: -0.04em; transition: all 0.8s ease;
            opacity: 0; pointer-events: none;
        }
        .tl-slide.reverse .tl-bg-year {
            right: auto;
            left: 80px;
        }
        .tl-slide.active .tl-bg-year { opacity: 1; }
        #tl-3 .tl-content { max-width: 680px; }
        .tl-consolidation-side {
            position: absolute;
            left: 20%;
            top: 50%;
            width: clamp(260px, 30vw, 420px);
            transform: translateY(-50%) translateX(-12px);
            opacity: 0;
            z-index: 1;
            pointer-events: none;
            transition: opacity 0.7s ease, transform 0.8s cubic-bezier(.16,1,.3,1);
        }
        .tl-consolidation-side svg {
            position: relative;
            width: 100%;
            height: auto;
            display: block;
            color: #d1d5db;
        }
        #tl-3.active .tl-consolidation-side {
            opacity: 1;
            transform: translateY(-50%) translateX(0);
        }

.tl-consolidation-awards {
            margin-top: 34px;
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            align-items: stretch;
        }
        .tl-consolidation-award {
            width: clamp(58px, 5.5vw, 76px);
            border-radius: 14px;
            padding: 7px;
            background: rgba(255,255,255,0.94);
            border: 1px solid rgba(0,57,86,0.08);
            box-shadow: 0 8px 20px rgba(0,30,46,0.08);
            backdrop-filter: blur(10px);
            opacity: 0;
            transform: translateY(22px);
            transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease, opacity 0.5s ease;
        }
        #tl-3.active .tl-consolidation-award {
            opacity: 1;
            transform: translateY(0);
        }
        #tl-3.active .tl-consolidation-award:nth-child(1) { transition-delay: 0.38s; }
        #tl-3.active .tl-consolidation-award:nth-child(2) { transition-delay: 0.46s; }
        #tl-3.active .tl-consolidation-award:nth-child(3) { transition-delay: 0.54s; }
        #tl-3.active .tl-consolidation-award:nth-child(4) { transition-delay: 0.62s; }
        #tl-3.active .tl-consolidation-award:nth-child(5) { transition-delay: 0.70s; }
        .tl-consolidation-award:hover {
            transform: translateY(-8px);
            border-color: rgba(0,153,221,0.32);
            box-shadow: 0 22px 48px rgba(0,153,221,0.18);
        }
        .tl-consolidation-award img {
            display: block;
            width: 100%;
            height: auto;
            filter: grayscale(0.25);
            opacity: 0.9;
            transition: filter 0.3s ease, opacity 0.3s ease;
        }
        .tl-consolidation-award:hover img {
            filter: grayscale(0);
            opacity: 1;
        }

        /* Cabeçalho da timeline */
        .tl-header {
            padding: 120px 80px 60px 140px;
            position: relative;
            z-index: 2;
        }
        /* Mobile: ajusta posição da linha e conteúdo */
        /* ── MOBILE ── */
        @media (max-width: 768px) {

            /* Overflow global */
            html, body {
                overflow-x: clip !important;
                max-width: 100% !important;
                width: 100% !important;
            }
            #navbar,
            #navbar > div,
            .sobre-hero-section,
            #hero-inner,
            .sobre-hero-grid,
            .tl-section,
            #cta-section,
            #main-footer {
                max-width: 100vw !important;
                overflow-x: clip !important;
            }
            #mobile-menu {
                width: min(85vw, 360px) !important;
                max-width: min(85vw, 360px) !important;
            }

            /* Hero: reduz padding excessivo */
            #hero-inner { padding-top: 100px !important; padding-bottom: 48px !important; }
            .sobre-hero-section h1 { font-size: clamp(1.9rem, 9vw, 2.6rem) !important; }
            .sobre-hero-grid { grid-template-columns: 1fr !important; gap: 36px !important; }

            /* Stats: empilha label e valor em coluna */
            .sobre-stat-row {
                flex-direction: column !important;
                align-items: flex-start !important;
                gap: 4px;
            }
            .sobre-stat-row span:last-child {
                text-align: left !important;
            }

            /* Slides */
            .tl-slide {
                padding: 48px 20px 48px 56px;
                min-height: auto;
                align-items: flex-start;
            }
            .tl-slide.reverse {
                justify-content: flex-start;
                padding: 48px 20px 48px 56px;
            }

            /* Header da timeline */
            .tl-header { padding: 48px 20px 24px 20px; }

            /* Dot e conector */
            .tl-dot { left: 18px; }
            .tl-connector { left: 36px; width: 20px; }
            .tl-slide.reverse .tl-dot  { right: auto; left: 18px; top: 50%; }
            .tl-slide.reverse .tl-connector {
                right: auto; left: 36px; top: 50%;
                background: linear-gradient(to right, #0099dd, rgba(0,153,221,0.3));
            }

            /* Fix dot/conector de #tl-3 e #tl-4 (reverse com offset extra) */
            #tl-3.tl-slide.reverse .tl-dot,
            #tl-4.tl-slide.reverse .tl-dot { right: auto; left: 18px; }
            #tl-3.tl-slide.reverse .tl-connector,
            #tl-4.tl-slide.reverse .tl-connector { right: auto; left: 36px; }

            /* Fix foguete #tl-2: dot e conector voltam para top:50% */
            #tl-2 .tl-dot      { top: 50%; left: 18px; }
            #tl-2 .tl-connector { top: 50%; left: 36px; }

            /* No mobile: esconde o SVG JS e usa div animada por JS */
            .tl-rail-svg { display: none; }
            #tl-mobile-line { display: block; }

            /* Conteúdo */
            .tl-content { margin-top: 0; max-width: 100%; }

            /* Badge de ano */
            .tl-year { font-size: 14px; padding: 3px 10px; margin-bottom: 16px; letter-spacing: 0.1em; }

            /* Título */
            .tl-title { font-size: clamp(26px, 8vw, 40px); margin-bottom: 16px; }

            /* Descrição */
            .tl-desc { font-size: 15px; line-height: 1.6; }

            /* Badge */
            .tl-badge { margin-top: 16px; }

            /* Watermark do ano */
            .tl-bg-year { right: 8px; font-size: clamp(48px, 14vw, 80px); }
            .tl-slide.reverse .tl-bg-year { left: auto; right: 8px; }

            /* Slide 2026: reduz espaçamento excessivo */
            #tl-4 { min-height: auto; padding-top: 56px; padding-bottom: 56px; }
            #tl-4 .tl-year   { margin-bottom: 16px; }
            #tl-4 .tl-title  { margin-bottom: 20px; }
            #tl-4 .tl-desc   { margin-bottom: 8px; }

            /* Consolidação */
            .tl-consolidation-side   { display: none; }
            .tl-consolidation-awards { margin-top: 20px; gap: 8px; }
            .tl-consolidation-award  { width: calc(33.333% - 6px); max-width: 70px; }

            /* CTA */
            .cta-nowrap-desktop { white-space: normal; }

            /* Seção CTA: reduz padding excessivo */
            #cta-section { padding: 64px 0 !important; }

            /* Botão CTA principal: full-width no mobile */
            #cta-main-btn {
                width: 100% !important;
                padding: 16px 24px !important;
                font-size: 15px !important;
                border-radius: 14px !important;
            }

            /* Bullets de benefícios: empilha verticalmente */
            #cta-section > div > div:last-child {
                flex-direction: column;
                align-items: center;
                gap: 14px !important;
            }

            /* Footer: reduz padding excessivo */
            #main-footer { padding: 72px 0 !important; }
            #main-footer .grid { margin-bottom: 48px !important; }

            /* WhatsApp float: mais próximo das bordas no mobile */
            #wa-float { bottom: 16px !important; right: 16px !important; width: 50px !important; height: 50px !important; }
        }
        @media (min-width: 1024px) {
            .cta-nowrap-desktop { white-space: nowrap; }
        }

        /* ── NOTEBOOK (769px – 1440px) ── */
        @media (min-width: 769px) and (max-width: 1440px) {
            /* Header da timeline */
            .tl-header { padding: 72px 60px 40px 100px; }

            /* Slides: min-height generoso para ícone e texto não se sobreporem */
            .tl-slide         { padding: 56px 60px 56px 120px; min-height: 80vh; }
            .tl-slide.reverse { padding: 56px 120px 56px 60px; }

            /* Conteúdo */
            .tl-content { margin-top: 40px; max-width: 480px; }

            /* Título menor */
            .tl-title { font-size: clamp(28px, 3.6vw, 50px); margin-bottom: 20px; }

            /* Descrição */
            .tl-desc { font-size: clamp(14px, 1.1vw, 17px); }

            /* Todos os ícones no mesmo tamanho proporcional para notebook */
            .tl-bg-icon svg        { width: clamp(180px, 22vw, 300px); }
            .tl-consolidation-side { width: clamp(180px, 22vw, 300px); left: 10%; }

            /* Prêmios menores */
            .tl-consolidation-award { width: clamp(48px, 4.5vw, 66px); }

            /* Slide 2026 */
            #tl-4 { min-height: 80vh; padding-top: 72px; padding-bottom: 72px; }
            #tl-4 .tl-title { margin-bottom: 28px; }
            #tl-4 .tl-year  { margin-bottom: 20px; }
        }

        /* Progress bar */
        #timeline-progress {
            position: absolute; bottom: 32px; left: 80px;
            right: 80px; height: 1px;
            background: rgba(255,255,255,0.1); border-radius: 9999px;
        }
        #timeline-progress-bar {
            height: 100%; background: #0099dd;
            border-radius: 9999px; width: 0%;
            transition: width 0.1s linear;
        }

        /* Counter animation */
        .counter-val { transition: all 0.1s; }

        /* Fade-in on scroll */
        .fade-up { opacity: 0; transform: translateY(30px); transition: opacity 0.6s ease, transform 0.6s ease; }
        .fade-up.visible { opacity: 1; transform: translateY(0); }

        /* Dot grid background */
        .dot-bg {
            background-image: radial-gradient(circle at 2px 2px, rgba(255,255,255,0.05) 1px, transparent 0);
            background-size: 40px 40px;
        }

        /* responsive handled above */

        /* Smooth scroll */
        html { scroll-behavior: smooth; }
