/**
 * ECOS DESIGN SYSTEM — Theme: Mentoria Escala (Authority Edition)
 * UX refinements: hierarchy, scanability, spacing, conversion.
 */

/* Escala global: tela menor → tudo um pouco menor; tela maior → um pouco maior. Só tamanhos, disposição igual. */
html {
    font-size: clamp(14px, 100vw / 90, 20px);
}

:root {
    /* Brand Foundation */
    --ecos-color-bg: #0A0D14;
    --ecos-color-surface: #111827;
    --ecos-color-surface-2: #1F2937;

    /* Brand Accent: Official Gold (#C47200) */
    --ecos-color-primary: #C47200;
    --ecos-color-primary-rgb: 196, 114, 0;
    --ecos-color-primary-hover: #d48900;
    --ecos-color-accent: #C47200;

    /* Typography */
    --ecos-font-display: 'Archivo Black', var(--ecos-font-sans);
    --ecos-font-body: 'Archivo Narrow', var(--ecos-font-sans);

    /* Spacing — section rhythm (padding entre uma seção e outra) */
    --ecos-container-px: clamp(1.25rem, 6vw, 2.5rem);
    --ecos-space-section: clamp(6rem, 15vw, 12rem);
    --lp-section-spacing-desktop: 160px;
    --lp-section-spacing-tablet: 100px;
    --lp-section-spacing-mobile: 80px;

    /* Layout — max width 1200px, card radius 12px */
    --ecos-container-max: 75rem; /* 1200px */
    --lp-min-edge: 1rem; /* Espaçamento mínimo da borda (viewport) */
    --lp-card-radius: 12px;
    --lp-touch-min: 48px;
    /* Padding do último elemento até a borda (CTA final e caixa 30 dias) */
    --lp-edge-padding: 2.5rem;
    /* Espaço entre seções (ex.: FAQ → Garantia) — mobile primeiro, desktop em media */
    --lp-gap-between-sections: 2.5rem;
    /* Altura mínima da caixa 30 dias — mobile / desktop */
    --lp-guarantee-card-min-h: 260px;
    /* Padding inferior da seção garantia */
    --lp-guarantee-section-bottom: 3rem;

    /* Shadows */
    --ecos-shadow-cta: 0 10px 40px rgba(var(--ecos-color-primary-rgb), 0.4);
}

/* ========== GLOBAL: section spacing ========== */
.lp-section {
    padding-block: var(--lp-section-spacing-mobile);
}
@media (min-width: 768px) {
    .lp-section { padding-block: var(--lp-section-spacing-tablet); }
}
@media (min-width: 1024px) {
    .lp-section { padding-block: var(--lp-section-spacing-desktop); }
}

body .ecos-container {
    max-width: var(--ecos-container-max);
    padding-inline: max(var(--lp-min-edge), var(--ecos-container-px));
    box-sizing: border-box;
}

@media (max-width: 767px) {
    /* Diminuir escala global de elementos para melhor UX em mobile */
    html {
        font-size: 13px;
    }
    
    body .ecos-container { 
        padding-inline: max(var(--lp-min-edge), 1.5rem) !important;
    }
    /* Hero: padding extra e CTA com largura controlada no mobile */
    .ecos-hero .ecos-container {
        padding-inline: max(1.25rem, 5vw) !important;
    }
    .ecos-hero__content {
        padding-inline: 0.5rem;
    }
    .ecos-hero__actions {
        width: 100%;
        max-width: 320px;
        margin-inline: auto;
        padding-inline: 0.25rem;
    }
    .ecos-hero__actions .ecos-button--primary {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
}

/* Paragraph max width ~65ch for readability */
.lp-text-narrow {
    max-width: 65ch;
}

/* Buttons: min height 48px for accessibility */
.ecos-button--primary,
.ecos-button--lg {
    min-height: var(--lp-touch-min);
}

/* CTA: transição suave no hover + camada de textura */
.ecos-theme-mentoria .ecos-button--primary {
    position: relative;
    overflow: hidden;
    transition: background 0.35s ease, border-color 0.35s ease, color 0.35s ease, box-shadow 0.35s ease;
}
/* Textura de grão (noise) sutil sobre o vidro — só no hover */
.ecos-theme-mentoria .ecos-button--primary::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.35s ease;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='0.12'/%3E%3C/svg%3E");
    background-size: 160px 160px;
}
.ecos-theme-mentoria .ecos-button--primary:hover:not(:disabled)::before {
    opacity: 0.55;
}
/* CTA hover: glass em tom laranja (gradiente + reflexo no topo) + blur */
.ecos-theme-mentoria .ecos-button--primary:hover:not(:disabled) {
    background: linear-gradient(165deg, rgba(255, 232, 205, 0.93) 0%, rgba(255, 208, 170, 0.9) 35%, rgba(255, 180, 140, 0.93) 100%);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-color: rgba(255, 220, 195, 0.78);
    color: var(--ecos-color-bg);
    text-decoration: none;
    box-shadow:
        0 0 0 1px rgba(255, 210, 180, 0.45) inset,
        inset 0 1px 0 rgba(255, 255, 255, 0.55);
    transform: none;
}

/* ========== HERO: auto-layout — primeira section preenche toda a tela ========== */
.ecos-hero {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-image: linear-gradient(to bottom, rgba(10, 13, 20, 0.6), rgba(10, 13, 20, 0.95)), url('../../assets/background%201.png');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: clamp(8rem, 25vh, 14rem);
    padding-bottom: clamp(2rem, 6vh, 4rem);
}

/* Título usa toda a largura do container para não quebrar com zoom do navegador */
.ecos-hero .ecos-container {
    text-align: center;
    width: 100%;
}

.ecos-hero__title {
    margin-bottom: 24px;
    margin-inline: auto;
    max-width: 100%;
}

.ecos-hero__title-line {
    display: block;
}

/* Subtítulo e CTA ficam no bloco estreito (640px) */
.ecos-hero__content {
    max-width: 640px;
    margin-inline: auto;
    text-align: center;
}

.ecos-hero__subtitle {
    margin-top: 0;
    margin-bottom: 32px;
    font-size: 1.0625rem;
    line-height: 1.3;
}

.ecos-hero__subtitle .text-gold {
    color: var(--ecos-color-primary-hover);
    font-weight: 700;
    margin-top: 0.35em;
    display: block;
}

.ecos-hero__actions {
    margin-top: 0;
    margin-bottom: 2rem;
}

.ecos-hero__micro {
    font-size: 0.875rem;
    color: var(--ecos-color-text-muted);
    margin-top: 0.5rem;
}

.ecos-hero__trust {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--ecos-color-text-muted);
    margin-top: 0.25rem;
}

.text-gold {
    color: var(--ecos-color-primary);
    font-weight: 700;
}

/* Gradiente ouro (hero e CTA): creme quente → ouro → âmbar escuro (sem branco nem verde) */
.text-gradient-gold {
    background: linear-gradient(90deg, #e8d4a8 0%, var(--ecos-color-primary) 50%, #a65f00 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: 700;
    filter: drop-shadow(0 0 12px rgba(var(--ecos-color-primary-rgb), 0.2));
}

/* Authority: layout agressivo — coluna única, tudo centralizado */
/* Authority: espaçamento mínimo da borda só nesta section (background continua até a borda) */
.lp-authority {
    background: radial-gradient(circle at center, rgba(10, 13, 20, 0.8) 0%, var(--ecos-color-bg) 100%);
    position: relative;
    z-index: 10;
    padding-top: clamp(3.5rem, 8vh, 5rem);
    padding-bottom: 0;
    padding-inline: var(--lp-min-edge);
    text-align: center;
    box-sizing: border-box;
}

.lp-authority__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* Gap menor para a foto subir um pouco */
    gap: clamp(0.4rem, 1.2vw, 0.85rem);
    width: 100%;
    max-width: var(--ecos-container-max);
    margin-inline: auto;
    padding-inline: var(--ecos-container-px);
    overflow: visible;
}

.lp-authority__header {
    width: 100%;
    max-width: 36rem;
    margin-inline: auto;
    text-align: center;
}

.lp-authority__title {
    font-family: var(--ecos-font-display);
    font-size: clamp(2rem, 5vw, 2.75rem);
    text-transform: uppercase;
    margin: 0 0 0.75rem;
    color: #fff;
}

.lp-authority__intro {
    margin: 0;
    color: var(--ecos-color-text-muted);
    font-size: 1.0625rem;
    line-height: 1.6;
    max-width: 42ch;
    margin-inline: auto;
}

/* Founders: centralizado, foto com cards sobrepostos — imagem maior (bleed + 5px) */
.lp-authority__inner .b2g-founders-wrapper {
    width: calc(100% + 2 * var(--ecos-container-px) + 10px);
    max-width: calc(var(--ecos-container-max) + 2 * var(--ecos-container-px) + 10px);
    margin-inline: calc(-1 * var(--ecos-container-px) - 5px);
}

.b2g-founders-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    max-width: 100%;
    overflow: visible;
    margin-top: -0.35rem;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.b2g-founders-img {
    max-width: 100%;
    width: 100%;
    height: auto;
    max-height: none;
    object-fit: contain;
    display: block;
    filter: drop-shadow(0 20px 50px rgba(0, 0, 0, 0.5));
    position: relative;
    z-index: 25;
    margin-bottom: -1px; /* remove any sub-pixel gap, docked to bottom! */
}

.b2g-case-card {
    position: absolute;
    width: 280px;
    background: rgba(17, 24, 39, 0.9);
    backdrop-filter: blur(16px);
    border: 1px solid rgba(var(--ecos-color-primary-rgb), 0.5);
    padding: 1.5rem;
    border-radius: var(--lp-card-radius);
    z-index: 35;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.8);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
    text-align: center;
}

.b2g-case-card:hover {
    transform: translateY(-5px) scale(1.02);
    border-color: var(--ecos-color-primary);
}

/* Base: posição dos cards (mobile/tablet sobrescreve em max-width: 1024px) */
.b2g-case-card--alberto {
    left: -100px;
    bottom: 10%;
}

.b2g-case-card--waldo {
    right: -140px;
    top: 28%;
}

/* Desktop: cards alinhados à altura do torso (não altera mobile) */
@media (min-width: 1025px) {
    .b2g-case-card--alberto {
        left: 3%;
        top: 52%;
        right: auto;
        bottom: auto;
    }
    .b2g-case-card--waldo {
        right: 3%;
        top: 52%;
        left: auto;
        bottom: auto;
    }
}

.b2g-case-name {
    font-family: var(--ecos-font-display);
    color: var(--ecos-color-primary);
    font-size: 1.25rem;
    margin-bottom: 0.25rem;
    display: block;
}

.b2g-case-role {
    font-size: 0.9rem;
    font-weight: 700;
    color: #E4E4E7;
    margin-bottom: 1rem;
    letter-spacing: 0.02em;
}

.b2g-case-bullets {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.9rem;
    color: #E4E4E7;
    line-height: 1.7;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.b2g-case-bullets li {
    padding-left: 0;
    padding-right: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    text-align: center;
}

.b2g-case-bullets li::before {
    content: "•";
    position: static;
    color: var(--ecos-color-primary);
    flex-shrink: 0;
}


/* Section: Mitos + Timeline — fundo e disposição melhorados */
.section-mitos-timeline {
    padding-block: clamp(5rem, 12vw, 8rem);
    position: relative;
    z-index: 10;
    background-color: #0e1118;
    background-image:
        radial-gradient(ellipse 120% 80% at 50% 0%, rgba(196, 114, 0, 0.06) 0%, transparent 55%),
        radial-gradient(circle at 50% 100%, rgba(17, 24, 39, 0.9) 0%, transparent 50%),
        url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
    background-size: 100% 100%, 100% 100%, 200px 200px;
}

.section-mitos-timeline__inner {
    max-width: 1000px;
    padding-inline: calc(clamp(1.5rem, 5vw, 4rem) + 20px);
    margin-inline: auto;
}

@media (min-width: 1025px) {
    .section-mitos-timeline__inner {
        max-width: 1340px; /* acompanha o grid (1320px + padding) para cards mais largos */
    }
}

.section-mitos-timeline__title {
    font-family: var(--ecos-font-display);
    font-size: clamp(2rem, 5vw, 2.8rem);
    text-align: center;
    line-height: 1.2;
    margin-bottom: 3rem;
}

/* ========== PROBLEM: colado ao fim da Authority (sem gap) ========== */
.lp-problem {
    position: relative;
    z-index: 20;
    background: #FAF9F6;
    border-top: 1px solid rgba(196, 114, 0, 0.1);
    padding-top: 0;
    padding-bottom: clamp(3rem, 8vw, 5rem);
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

@media (max-width: 767px) {
    html {
        font-size: 15px;
    }
    .lp-problem {
        padding-inline: 24px;
    }
}

.lp-problem__container {
    width: 100%;
    max-width: 900px;
    margin-inline: auto;
    padding-top: clamp(2rem, 5vw, 3rem);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(2rem, 4vw, 3rem);
}

.lp-problem__title {
    font-family: var(--ecos-font-display);
    font-size: clamp(2rem, 5vw, 3rem);
    margin: 0;
    text-align: center;
    color: #1A1A1A;
}

/* Espaçamento entre cards e divisor (autolayout: gap responsivo) */
.lp-problem__grid {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: clamp(1.5rem, 4vw, 2.5rem);
    align-items: stretch;
}

@media (max-width: 768px) {
    .lp-problem__grid {
        grid-template-columns: 1fr;
        gap: clamp(1.25rem, 4vw, 1.5rem);
    }
    .lp-problem-divider { display: none; }
}

.lp-problem-card {
    background: #fff;
    padding: 32px;
    border-radius: var(--lp-card-radius);
    box-shadow: 0 15px 35px rgba(0,0,0,0.05);
    max-width: 100%;
}

.lp-problem-card--error {
    border: 1px solid rgba(0,0,0,0.06);
}

.lp-problem-card--solution {
    border: 1px solid rgba(196, 114, 0, 0.2);
}

.lp-problem-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: #FEE2E2;
    color: #C41E3A;
    font-size: 1rem;
    font-weight: bold;
    margin-bottom: 1rem;
}

.lp-problem-card__icon--ok {
    background: rgba(196, 114, 0, 0.15);
    color: var(--ecos-color-primary);
}

.lp-problem-card__heading {
    font-family: var(--ecos-font-display);
    font-size: 1.25rem;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.lp-problem-card--error .lp-problem-card__heading { color: #EF4444; }
.lp-problem-card--solution .lp-problem-card__heading { color: var(--ecos-color-primary); }

.lp-problem-card__text {
    color: #333;
    line-height: 1.6;
    font-size: 1rem;
    max-height: 6.4em;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.lp-problem-divider {
    width: 1px;
    min-height: 80px;
    background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.12), transparent);
    align-self: center;
}

/* ========== MYTH CARDS: área lateral ampla no desktop, centralizado ========== */
.section-mitos-timeline__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: stretch;
    max-width: 1100px;
    margin-inline: auto;
    width: 100%;
}

@media (min-width: 1025px) {
    .section-mitos-timeline__grid {
        max-width: 1320px; /* colunas mais largas para “portal de licitações” não quebrar */
        gap: 2rem;
    }
}

@media (max-width: 900px) {
    .section-mitos-timeline__grid {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }
}

.mito-card {
    display: flex;
    flex-direction: column;
    text-align: center;
    padding: 2rem 1.5rem;
    min-height: 100%;
    min-width: 0;
    max-width: 100%;
    border-radius: var(--lp-card-radius);
    background: linear-gradient(165deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 100%);
    border: 1px solid rgba(255,255,255,0.06);
    box-shadow: 0 4px 24px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.04);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

@media (min-width: 1025px) {
    .mito-card {
        max-width: 100%; /* ocupa a célula do grid (grid já garante largura mínima) */
        margin-inline: auto;
        padding: 2.25rem 1.5rem; /* padding lateral menor = mais espaço para o texto */
        min-height: 280px;
    }
}

.mito-card__titulo {
    color: var(--ecos-color-primary);
    margin-bottom: 1rem;
    font-family: var(--ecos-font-display);
    text-transform: uppercase;
    font-size: var(--ecos-text-lg);
    letter-spacing: 0.05em;
    flex-shrink: 0;
}

.mito-card__numero {
    display: inline-block;
    opacity: 0;
    transform: scale(0.6);
    animation-name: mito-numero-in;
    animation-duration: 0.45s;
    animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
    animation-fill-mode: forwards;
}

.lp-anim-stagger.lp-in-view .mito-card:nth-child(1) .mito-card__numero { animation-delay: 0.08s; }
.lp-anim-stagger.lp-in-view .mito-card:nth-child(2) .mito-card__numero { animation-delay: 0.2s; }
.lp-anim-stagger.lp-in-view .mito-card:nth-child(3) .mito-card__numero { animation-delay: 0.32s; }

@keyframes mito-numero-in {
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .mito-card__numero {
        opacity: 1;
        transform: none;
        animation: none;
    }
}

@media (min-width: 1025px) {
    .mito-card__titulo {
        margin-bottom: 1.15rem;
    }
}

@media (min-width: 1000px) {
    .mito-card__titulo {
        white-space: nowrap;
    }
}

@media (max-width: 999px) {
    .mito-card__titulo {
        white-space: normal;
    }
}

.mito-card__texto {
    flex: 1;
    opacity: 0.9;
    line-height: 1.65;
    font-size: var(--ecos-text-base);
    color: var(--ecos-color-text);
    margin: 0;
    min-height: 0;
    min-width: 0;
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens: none;
    text-align: center;
}


/* “de licitações” e outros trechos que não devem quebrar no meio */
.mito-card__texto .no-wrap {
    white-space: nowrap;
}

.mito-card__texto strong.text-gold {
    display: inline-block; /* largura pelo conteúdo, não 100% do card */
    width: max-content;
    max-width: 100%;
    margin-top: 0.75rem;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
    font-size: 0.88em;
    font-weight: 700 !important;
    font-style: normal !important; /* negrito laranja, nunca itálico */
}

@media (min-width: 1025px) {
    .mito-card__texto {
        line-height: 1.7;
    }
    .mito-card__texto strong.text-gold {
        margin-top: 1rem;
        font-size: 0.85em; /* cabe em uma linha no card desktop */
        white-space: nowrap !important;
        font-weight: 700 !important;
        font-style: normal !important;
    }
}

@media (min-width: 1025px) {
    .mito-card,
    .mito-card .mito-card__titulo,
    .mito-card .mito-card__texto {
        text-align: left;
    }
}

.mito-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 40px rgba(0,0,0,0.25), 0 0 0 1px rgba(var(--ecos-color-primary-rgb), 0.2), inset 0 1px 0 rgba(255,255,255,0.06);
    border-color: rgba(var(--ecos-color-primary-rgb), 0.25);
}

@media (max-width: 767px) {
    .mito-card {
        padding: 2rem 1.25rem;
    }
    .mito-card__titulo {
        font-size: var(--ecos-text-base);
        margin-bottom: 0.75rem;
    }
    .mito-card__texto {
        font-size: var(--ecos-text-base);
        line-height: 1.55;
    }
}

.section-mitos-timeline__divider {
    height: 1px;
    background: linear-gradient(to right, transparent, var(--ecos-color-primary), transparent);
    opacity: 0.3;
    margin: clamp(4rem, 8vw, 6rem) auto clamp(3rem, 6vw, 4rem);
    max-width: 500px;
}

/* Header da Timeline */
.lp-timeline-header {
    text-align: center;
    margin-bottom: clamp(2.5rem, 5vw, 4rem);
    max-width: 800px;
    margin-inline: auto;
    overflow: hidden;
}

.lp-timeline-kicker {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--ecos-color-primary);
    margin: 0 0 0.75rem;
    opacity: 0.9;
}

.lp-timeline-title-section {
    font-family: var(--ecos-font-display);
    font-size: clamp(1.4rem, 5vw, 2.5rem);
    color: #fff;
    margin: 0 0 1rem;
    line-height: 1.2;
    /* Removed white-space: nowrap to allow breaking on very small mobile screens */
}

.lp-timeline-subtitle {
    font-size: 1rem;
    color: var(--ecos-color-text-muted);
    line-height: 1.65;
    margin: 0;
    max-width: 50ch;
    margin-inline: auto;
}

/* ========== TIMELINE: vertical progress line, 48px spacing, strong titles ========== */
.lp-timeline {
    position: relative;
}

.lp-timeline-item {
    margin-bottom: 48px;
    padding-left: 2.5rem;
    position: relative;
    border-left: 2px solid var(--ecos-color-primary);
}

@media (max-width: 767px) {
    .lp-timeline-item {
        padding-left: 1.5rem;
        padding-right: 0;
        border-left: 2px solid var(--ecos-color-primary);
        text-align: left;
        margin-left: 32px; 
        margin-right: 16px; /* Loosened on the right to compensate ragged text */
        margin-bottom: 3rem;
    }
    .lp-timeline-item::before {
        left: -11px;
        transform: none;
        top: 0.25rem;
    }
    
    .lp-timeline-title {
        font-size: clamp(0.85rem, 4.2vw, 1.15rem) !important;
    }
    
    .lp-timeline-title-wrap {
        gap: 0.35rem !important;
    }
}

.lp-timeline-item:last-child {
    margin-bottom: 0;
}

.lp-timeline-item::before {
    content: "";
    position: absolute;
    left: -11px;
    top: 0.25rem;
    width: 20px;
    height: 20px;
    background: var(--ecos-color-bg);
    border: 2px solid var(--ecos-color-primary);
    border-radius: 50%;
}

.lp-timeline-title-wrap {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 0.5rem !important;
    margin-bottom: 0.5rem;
    width: 100%;
}

.lp-timeline-icon {
    font-size: 0.9rem !important;
    color: var(--ecos-color-primary);
    opacity: 0.8;
    flex-shrink: 0 !important;
    display: inline-block !important;
    line-height: 1 !important;
    margin: 0 !important;
}

.lp-timeline-title {
    font-family: var(--ecos-font-display);
    font-weight: 700;
    font-size: clamp(0.9rem, 4vw, 1.2rem) !important;
    color: #fff;
    margin: 0 !important;
    display: block !important;
    white-space: nowrap !important;
    line-height: 1.2 !important;
}

.lp-timeline-desc {
    opacity: 0.85;
    font-size: 0.95rem;
    line-height: 1.6;
    margin-top: 0.25rem;
    color: var(--ecos-color-text);
}
.lp-timeline-desc strong,
.lp-timeline-desc .text-gold {
    color: inherit;
    font-weight: 700;
}

/* Timeline base (fallback) */
.timeline-item {
    border-left: 2px solid var(--ecos-color-primary);
    padding-left: 2rem;
    margin-bottom: 3rem;
    position: relative;
}

.timeline-item::before {
    content: "";
    position: absolute;
    left: -11px;
    top: 0;
    width: 20px;
    height: 20px;
    background: var(--ecos-color-bg);
    border: 2px solid var(--ecos-color-primary);
    border-radius: 50%;
}

@media (max-width: 1024px) {
    .lp-authority__inner {
        overflow: visible;
    }
    .b2g-founders-wrapper {
        position: relative;
        display: block;
        width: calc(100% + 2 * var(--ecos-container-px) + 10px);
        max-width: 100vw;
        margin-inline: calc(-1 * var(--ecos-container-px) - 5px);
        padding-inline: 0;
        padding-top: 0.5rem;
        margin-bottom: 0 !important;
    }

    .b2g-founders-img {
        display: block;
        width: 100%;
        max-width: 100%;
        height: auto !important;
        max-height: none !important;
        object-fit: contain;
        margin: 0;
        margin-bottom: -1px !important;
        z-index: 10;
        position: relative;
    }

    .b2g-case-card {
        position: absolute !important;
        width:  min(185px, 62vw) !important;
        max-width: 185px !important;
        margin: 0 !important;
        padding: 0.65rem 0.55rem !important;
        box-sizing: border-box;
        z-index: 30;
        transform: none !important;
    }

    .b2g-case-card--alberto {
        left: clamp(0.5rem, 2vw, 1rem);
        bottom: clamp(8%, 4vw, 12%);
        top: auto !important;
        right: auto !important;
    }

    .b2g-case-card--waldo {
        right: clamp(0.5rem, 2vw, 1rem);
        bottom: clamp(8%, 4vw, 12%);
        top: auto !important;
        left: auto !important;
    }

    .b2g-case-name {
        font-size: 0.85rem !important;
    }
    .b2g-case-role {
        font-size: 0.65rem !important;
        margin-bottom: 0.3rem !important;
    }
    .b2g-case-bullets {
        font-size: 0.65rem !important;
    }
    .b2g-case-bullets li {
        padding-left: 0;
    }
}

/* Telas pequenas: cards empilhados abaixo da imagem para não sumir/sobrepor */
@media (max-width: 560px) {
    .b2g-founders-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding-top: 0.5rem;
    }
    .b2g-founders-img {
        order: 1;
        width: 100%;
        max-width: 100%;
        height: auto !important;
        max-height: none !important;
        object-fit: contain;
    }
    .b2g-case-card {
        position: relative !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        width: 100% !important;
        max-width: 280px !important;
        margin: 0 auto !important;
        margin-top: 1rem !important;
    }
    .b2g-case-card--alberto { order: 2; }
    .b2g-case-card--waldo { order: 3; }
    .b2g-case-card:last-child {
        margin-bottom: 0 !important;
    }
}

/* Premium Polish — radial por baixo de tudo, texto e elementos por cima */
.ecos-cta-block--dark {
    position: relative;
    background-color: #0A0D14;
    background-image:
        url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.035'/%3E%3C/svg%3E"),
        linear-gradient(to top, rgba(17, 24, 39, 0.5) 0%, transparent 55%);
    background-size: 256px 256px, 100% 100%;
    background-position: 0 0, 0 0;
    background-repeat: repeat, stretch;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding-top: clamp(5rem, 12vw, 8rem);
    padding-bottom: var(--lp-edge-padding);
    overflow: hidden;
}

.lp-cta-final.ecos-cta-block--dark {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: min(70vh, 720px);
    padding-top: clamp(6rem, 14vw, 10rem);
    padding-bottom: clamp(4rem, 10vw, 6rem);
}

/* Radial fixo por baixo de toda a visualização (camada mais atrás) */
.ecos-cta-block--dark::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: radial-gradient(
        ellipse 120% 80% at 50% 100%,
        rgba(196, 114, 0, 0.12) 0%,
        rgba(196, 114, 0, 0.04) 40%,
        transparent 70%
    );
    pointer-events: none;
}

/* Container do CTA: garante que texto e botão fiquem por cima do radial */
.ecos-cta-block--dark .ecos-container,
.cta-final-mesa__inner {
    position: relative;
    z-index: 1;
}

.ecos-cta-block__title {
    text-align: center;
    max-width: 25ch;
    margin-inline: auto;
    font-size: clamp(2rem, 5vw, 3rem);
    line-height: 1.1;
}

/* CTA Final "Assuma seu lugar na mesa" — conteúdo centralizado (horizontal e vertical) */
.cta-final-mesa__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 0;
    width: 100%;
    max-width: 560px;
    margin-inline: auto;
}
.cta-final-mesa__inner .cta-final-mesa__kicker,
.cta-final-mesa__inner .cta-final-mesa__title,
.cta-final-mesa__inner .cta-final-mesa__reinforcement,
.cta-final-mesa__inner .cta-final-mesa__subtitle,
.cta-final-mesa__inner .ecos-cta-block__actions,
.cta-final-mesa__inner .cta-final-mesa__micro {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 100%;
}

.cta-final-mesa__kicker {
    font-size: 0.75rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #60a5fa;
    margin-bottom: 0.75rem;
    font-weight: 700;
}

/* Título CTA final: gradiente horizontal (creme quente → ouro → âmbar escuro), leve brilho */
.cta-final-mesa__title {
    margin-bottom: 0.75rem;
    background: linear-gradient(90deg, #e8d4a8 0%, var(--ecos-color-primary) 50%, #a65f00 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: 700;
    filter: drop-shadow(0 0 12px rgba(var(--ecos-color-primary-rgb), 0.2));
}

.cta-final-mesa__subtitle {
    font-size: 1.05rem;
    color: var(--ecos-color-text-muted);
    max-width: 32ch;
    margin-inline: auto;
    margin-bottom: 2rem;
    line-height: 1.5;
}

.cta-final-mesa__actions {
    margin-top: 0;
}

.cta-final-mesa__btn {
    padding: 1rem 2rem;
    font-size: 1.1rem;
    box-shadow: 0 4px 24px rgba(var(--ecos-color-primary-rgb), 0.25);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.cta-final-mesa__btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 32px rgba(var(--ecos-color-primary-rgb), 0.35);
}

/* ========== FAQ: kicker, padding, transition 200ms, larger question ========== */
.lp-faq-kicker {
    text-align: center;
    font-size: 0.875rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ecos-color-primary);
    margin-bottom: 0.5rem;
}

.lp-faq-title {
    text-align: center;
    font-family: var(--ecos-font-display);
    font-size: 2.5rem;
    margin-bottom: 3rem;
}

.lp-faq .ecos-faq__item {
    border-radius: var(--lp-card-radius);
    transition: border-color 200ms ease, box-shadow 200ms ease;
}

.lp-faq .ecos-faq__question {
    padding: 1.25rem 1.5rem;
    font-size: 1.1rem;
    transition: color 200ms ease;
}

.lp-faq .ecos-faq__answer {
    padding: 0.75rem 2.5rem 1.25rem;
    transition: opacity 200ms ease;
    max-width: 62ch;
    margin-inline: auto;
}

/* FAQ: área mais larga no desktop (não parecer encolhida) */
.lp-faq-list {
    max-width: 800px;
    margin-inline: auto;
}

@media (min-width: 1025px) {
    .lp-faq-list {
        max-width: 1080px;
    }
    .lp-faq .ecos-faq__answer {
        max-width: 94ch; /* frame largo, poucas quebras de linha */
        padding-left: 2.5rem;
        padding-right: 2.5rem;
    }
}

@media (max-width: 767px) {
    .lp-faq-title {
        font-size: clamp(1.6rem, 5vw, 2.5rem);
        margin-bottom: 2rem;
    }
    
    .lp-faq .ecos-faq__question {
        padding: 1.25rem 24px 1.25rem 32px;
        font-size: 0.95rem;
    }
    
    .lp-faq .ecos-faq__answer {
        padding: 0.75rem 1.5rem 1.25rem 2rem;
        font-size: 0.9rem;
        line-height: 1.5;
        max-width: 100%;
    }
}

/* ========== GUARANTEE: background distinto, centralizado verticalmente ========== */
/* Gap entre FAQ e Garantia = padding-top da garantia (único espaço entre as duas seções) */
.lp-faq {
    padding-bottom: 0;
}

.lp-guarantee {
    text-align: center;
    background: #0d1119;
    background-image: radial-gradient(ellipse 80% 60% at 50% 50%, rgba(196, 114, 0, 0.14) 0%, transparent 60%);
    padding-top: var(--lp-gap-between-sections);
    padding-bottom: var(--lp-guarantee-section-bottom);
    padding-inline: var(--ecos-container-px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    min-height: min(50vh, 320px);
}

@media (min-width: 768px) {
    .lp-guarantee {
        padding-top: 3rem;
        padding-bottom: clamp(4.5rem, 10vw, 6rem);
        min-height: min(55vh, 380px);
    }
    .lp-guarantee-card {
        min-height: 300px;
        padding: clamp(2.5rem, 5vw, 3.5rem) var(--lp-edge-padding);
    }
}

.lp-guarantee .ecos-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: var(--ecos-container-max);
    margin-inline: auto;
}

.lp-guarantee-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    max-width: 620px;
    width: 100%;
    min-height: var(--lp-guarantee-card-min-h);
    padding: clamp(2.25rem, 5vw, 3.5rem) var(--lp-edge-padding);
    border-radius: var(--lp-card-radius);
    background: rgba(17, 24, 39, 0.6);
    backdrop-filter: blur(10px);
    border: 1px solid var(--ecos-color-primary);
    box-shadow: 0 0 32px rgba(var(--ecos-color-primary-rgb), 0.12);
}

.lp-guarantee-icon-wrap {
    width: 3.5rem;
    height: 3.5rem;
    margin-inline: auto;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(196, 114, 0, 0.15);
    border-radius: 50%;
}

.lp-guarantee-icon {
    width: 2rem;
    height: 2rem;
    object-fit: contain;
}

.lp-guarantee-title {
    font-family: var(--ecos-font-display);
    text-transform: uppercase;
    margin-bottom: 0.75rem;
    font-size: 1.35rem;
    color: var(--ecos-color-primary);
    text-align: center;
}

.lp-guarantee-text {
    opacity: 0.9;
    line-height: 1.65;
    margin-inline: auto;
    color: var(--ecos-color-text);
    text-align: center;
    max-width: 100%;
}

.lp-guarantee-text strong.text-gold {
    font-weight: 700 !important;
}

@media (max-width: 767px) {
    .lp-guarantee-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-height: 260px;
        box-sizing: border-box;
        padding: clamp(2.25rem, 5vw, 3rem) 24px clamp(2.25rem, 5vw, 3rem) 32px;
    }
    .lp-guarantee-icon-wrap {
        width: 3rem;
        height: 3rem;
        margin-bottom: 1rem;
    }
    .lp-guarantee-icon {
        width: 1.5rem;
        height: 1.5rem;
    }
    .lp-guarantee-title {
        font-size: 1.25rem;
    }
    .lp-guarantee-text {
        font-size: 0.95rem;
        line-height: 1.6;
    }
}

/* ========== FINAL CTA: reinforcement, CTA +15%, micro ========== */
.lp-cta-final {
    margin-top: 0;
}

.cta-final-mesa__reinforcement {
    font-size: 1.1rem;
    color: var(--ecos-color-text);
    margin-inline: auto;
    margin-bottom: 0.75rem;
    line-height: 1.5;
    opacity: 0.95;
}

.cta-final-mesa__subtitle {
    margin-bottom: 1.5rem;
}

.cta-final-mesa__btn {
    padding: 1.15rem 2.25rem;
    font-size: 1.15rem;
    min-height: var(--lp-touch-min);
    transform: scale(1);
}

.cta-final-mesa__btn:hover {
    transform: translateY(-2px) scale(1.02);
}

.cta-final-mesa__micro {
    font-size: 0.8rem;
    color: var(--ecos-color-text-muted);
    margin-top: 1rem;
}

@media (max-width: 767px) {
    .lp-cta-final { margin-top: 0; }
}

/* Footer: sem cantos arredondados, mais espaço lateral e tipografia padrão */
footer,
footer > div {
    border-radius: 0 !important;
}
.lp-footer__inner {
    padding: 0.75rem 1rem !important;
    width: 100%;
    box-sizing: border-box;
    background: rgba(10, 13, 20, 0.25) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}
.lp-footer {
    border-top-color: rgba(255, 255, 255, 0.08) !important;
}
.lp-footer__copy {
    width: 100%;
    text-align: center;
    font-size: 0.8125rem !important;
    opacity: 0.85;
    color: var(--ecos-color-text-muted) !important;
    letter-spacing: 0.02em;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* Footer "Sobre": frame em 3 linhas, quebra suave */
.lp-footer__about {
    margin: 0.5rem 0 0;
    font-size: 0.7rem;
    line-height: 1.5;
    color: var(--ecos-color-text-muted);
    opacity: 0.65;
    text-align: center;
    max-width: 200ch;
    margin-inline: auto;
    box-sizing: border-box;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 3;
}
@media (max-width: 767px) {
    .lp-footer__about {
        -webkit-line-clamp: 5;
        max-width: 100%;
    }
}
/* ========== MOBILE FIXES (Manus AI) ========== */
/* Garante que em telas muito pequenas o layout se ajuste sem quebras de frames ou erros de espaçamento */

@media (max-width: 480px) {
    /* Escala global: diminui um pouco mais a base para telas pequenas */
    html {
        font-size: clamp(12px, 4vw, 14px) !important;
    }

    /* Trava os espaçamentos laterais e garante que nada extrapole */
    body, html {
        overflow-x: hidden !important;
        width: 100% !important;
        position: relative !important;
    }

    .ecos-container {
        padding-inline: 1.25rem !important;
        width: 100% !important;
        box-sizing: border-box !important;
        max-width: 100vw !important;
    }

    /* Hero: Ajuste de escala e auto-layout nos textos */
    .ecos-hero__title {
        font-size: clamp(1.8rem, 8vw, 2.5rem) !important;
        line-height: 1.1 !important;
        width: 100% !important;
        max-width: 100% !important;
        word-break: break-word !important;
    }

    .ecos-hero__title-line {
        display: inline !important; /* Permite quebra natural de linha */
    }

    .ecos-hero__subtitle {
        font-size: 1rem !important;
        line-height: 1.4 !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: auto !important;
    }

    /* Authority: Ajuste dos cards para não quebrar o frame */
    .lp-authority__title {
        font-size: 1.75rem !important;
    }

    .b2g-founders-wrapper {
        width: 100% !important;
        margin-inline: 0 !important;
        padding-inline: 0 !important;
    }

    .b2g-case-card {
        width: 100% !important;
        max-width: 100% !important;
        margin-top: 1rem !important;
        padding: 1.25rem !important;
        box-sizing: border-box !important;
    }

    /* Problem Section: Auto-layout e escala */
    .lp-problem__title {
        font-size: 1.75rem !important;
        margin-bottom: 2rem !important;
    }

    .lp-problem-card {
        padding: 1.5rem !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .lp-problem-card__text {
        -webkit-line-clamp: unset !important; /* Mostra todo o texto no mobile */
        max-height: none !important;
    }

    /* Mitos: Garante que o texto não quebre o card */
    .section-mitos-timeline__grid {
        gap: 1.5rem !important;
    }

    .mito-card {
        padding: 1.5rem 1rem !important;
    }

    .mito-card__titulo {
        font-size: 1.1rem !important;
        white-space: normal !important;
    }

    .mito-card__texto strong.text-gold {
        white-space: normal !important; /* Permite quebra em telas muito estreitas */
        width: auto !important;
    }

    /* Timeline: Ajuste de espaçamento */
    .lp-timeline-title-section {
        font-size: 1.5rem !important;
    }

    .lp-timeline {
        padding-left: 1.5rem !important;
    }

    .lp-timeline-icon {
        left: -1.95rem !important;
    }

    /* FAQ: Ajuste de padding */
    .lp-faq-title {
        font-size: 1.75rem !important;
    }

    .lp-faq .ecos-faq__question {
        padding: 1rem 1.25rem !important;
        font-size: 0.9rem !important;
    }

    /* Guarantee: Ajuste de escala */
    .lp-guarantee-card {
        padding: 2rem 1.25rem !important;
    }

    .lp-guarantee-title {
        font-size: 1.15rem !important;
    }

    /* Footer: Garante que o texto não quebre o layout */
    .lp-footer__about {
        -webkit-line-clamp: unset !important;
        font-size: 0.65rem !important;
    }
}
