/* ════════════════════════════════════════════════════════════════════════
   CoraLink — Landing Page
   Estilos organizados por seção, mobile-first.
   ════════════════════════════════════════════════════════════════════════ */

/* ─── Reset & base ─────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
    font-family: var(--cora-font-body);
    font-size: clamp(15px, 0.92vw + 12.5px, 18px); /* fluido: 15px mobile → 18px desktop wide */
    line-height: 1.55;
    color: var(--cora-text);
    background: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
}

/* Performance: pula render de seções abaixo da dobra até estarem perto da viewport.
   Reduz tempo de paint no first load. Skip intencional do hero, header,
   seção do mapa (Leaflet precisa medir dimensões reais) e da .pricing
   (badge "Comece aqui" precisa transbordar pra cima do card). */
.section:not(.map-section):not(#planos),
.partner-banner,
.faq-list,
.contact-form,
.downloads {
    content-visibility: auto;
    contain-intrinsic-size: auto 500px;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: none; background: none; color: inherit; }
input, textarea, select { font: inherit; color: inherit; }
::selection { background: var(--cora-primary-soft); color: var(--cora-primary-dark); }

/* ─── Container & utilitários ──────────────────────────────────────────── */
.container {
    width: 100%;
    max-width: var(--cora-container);
    margin: 0 auto;
    padding: 0 24px;
}
.section { padding: 88px 0; }
.section-sm { padding: 56px 0; }
.section-alt { background: var(--cora-surface-alt); }
.section-coral { background: linear-gradient(180deg, #FFF7F2 0%, #FFFFFF 100%); }

.eyebrow {
    display: inline-block;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    color: var(--cora-primary-dark);
    background: var(--cora-primary-soft);
    padding: 6px 14px;
    border-radius: var(--cora-radius-pill);
}
.section-title {
    font-size: clamp(1.75rem, 3.2vw, 2.5rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.15;
    color: var(--cora-text);
    margin: 18px 0 14px;
    max-width: 720px;
}
.section-lead {
    font-size: 1.05rem;
    color: var(--cora-text-soft);
    max-width: 640px;
    line-height: 1.6;
}
.section-head { margin-bottom: 56px; }
.section-head.center { text-align: center; }
.section-head.center .section-title,
.section-head.center .section-lead { margin-left: auto; margin-right: auto; }

/* ─── Botões ───────────────────────────────────────────────────────────── */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    padding: 13px 22px;
    border-radius: var(--cora-radius);
    transition: transform 0.15s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
    white-space: nowrap;
    line-height: 1;
    border: 1.5px solid transparent;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn-primary {
    background: var(--cora-gradient);
    color: var(--cora-on-primary);
    box-shadow: 0 8px 22px rgba(245,106,61,0.28);
}
.btn-primary:hover { box-shadow: 0 12px 28px rgba(245,106,61,0.36); }
.btn-secondary {
    background: var(--cora-card);
    color: var(--cora-primary-dark);
    border-color: var(--cora-primary);
}
.btn-secondary:hover { background: var(--cora-primary-soft); }
.btn-ghost {
    background: transparent;
    color: var(--cora-text);
    border-color: var(--cora-border);
}
.btn-ghost:hover { background: var(--cora-surface); border-color: var(--cora-text-soft); }
.btn-link {
    color: var(--cora-primary-dark);
    font-weight: 600;
    padding: 0;
    background: none;
}
.btn-link:hover { color: var(--cora-primary); text-decoration: underline; }
.btn-lg { padding: 16px 28px; font-size: 1rem; }
.btn-block { width: 100%; }

/* ─── Header ───────────────────────────────────────────────────────────── */
.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255,255,255,0.85);
    backdrop-filter: saturate(180%) blur(12px);
    -webkit-backdrop-filter: saturate(180%) blur(12px);
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.site-header.scrolled {
    border-bottom-color: var(--cora-border-soft);
    box-shadow: 0 2px 12px rgba(31,38,45,0.04);
}
.header-inner {
    height: var(--cora-header-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.brand {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 800;
    font-size: 1.18rem;
    letter-spacing: -0.01em;
    color: var(--cora-text);
}
.brand .brand-mark {
    width: 36px;
    height: 36px;
    border-radius: 11px;
    background: var(--cora-primary-soft);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 14px rgba(245,106,61,0.16);
}
.brand .brand-mark svg { width: 22px; height: 22px; }
.brand span { color: var(--cora-primary-dark); }

.nav-primary {
    display: flex;
    gap: 4px;
    list-style: none;
    align-items: center;
}
.nav-primary a {
    display: inline-block;
    padding: 8px 14px;
    border-radius: 10px;
    font-size: 0.92rem;
    font-weight: 500;
    color: var(--cora-text-soft);
    transition: color 0.15s ease, background 0.15s ease;
}
.nav-primary a:hover { color: var(--cora-text); background: var(--cora-surface); }

.header-cta { display: flex; gap: 10px; align-items: center; }
.header-cta .btn { padding: 10px 18px; font-size: 0.88rem; }

.menu-toggle {
    display: none;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    align-items: center;
    justify-content: center;
    color: var(--cora-text);
}
.menu-toggle:hover { background: var(--cora-surface); }
.menu-toggle svg { width: 24px; height: 24px; }

/* Mobile drawer */
.mobile-menu {
    display: none;
    position: fixed;
    inset: var(--cora-header-h) 0 0 0;
    z-index: 99;
    background: #fff;
    padding: 24px;
    overflow-y: auto;
    transform: translateY(-8px);
    opacity: 0;
    pointer-events: none;
    transition: transform 0.2s ease, opacity 0.2s ease;
}
.mobile-menu.open { transform: translateY(0); opacity: 1; pointer-events: auto; }
.mobile-menu nav { display: flex; flex-direction: column; gap: 4px; margin-bottom: 24px; }
.mobile-menu nav a {
    padding: 14px 16px;
    border-radius: 12px;
    font-size: 1rem;
    font-weight: 500;
    color: var(--cora-text);
}
.mobile-menu nav a:hover { background: var(--cora-surface); }
.mobile-menu .mobile-cta { display: flex; flex-direction: column; gap: 10px; }

/* ─── Hero ─────────────────────────────────────────────────────────────── */
.hero {
    position: relative;
    background: var(--cora-gradient-hero);
    padding: 80px 0 96px;
    overflow: hidden;
}
.hero::before {
    content: '';
    position: absolute;
    top: -120px;
    right: -120px;
    width: 480px;
    height: 480px;
    background: radial-gradient(circle, rgba(255,127,80,0.18), transparent 60%);
    border-radius: 50%;
    pointer-events: none;
}
.hero::after {
    content: '';
    position: absolute;
    bottom: -160px;
    left: -100px;
    width: 380px;
    height: 380px;
    background: radial-gradient(circle, rgba(255,158,122,0.18), transparent 60%);
    border-radius: 50%;
    pointer-events: none;
}
.hero-grid {
    position: relative;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 64px;
    align-items: center;
}
.hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--cora-primary-dark);
    background: rgba(255,255,255,0.7);
    border: 1px solid var(--cora-primary-soft);
    padding: 6px 14px;
    border-radius: var(--cora-radius-pill);
    margin-bottom: 22px;
}
.hero-eyebrow .dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--cora-primary);
    box-shadow: 0 0 0 4px rgba(255,127,80,0.18);
    animation: pulse 2s infinite;
}
@keyframes pulse {
    0%,100% { box-shadow: 0 0 0 4px rgba(255,127,80,0.18); }
    50%     { box-shadow: 0 0 0 8px rgba(255,127,80,0.06); }
}

.hero-title {
    font-size: clamp(2.25rem, 4.6vw, 3.6rem);
    font-weight: 800;
    letter-spacing: -0.025em;
    line-height: 1.05;
    color: var(--cora-text);
    margin-bottom: 22px;
}
.hero-title em {
    font-style: normal;
    background: var(--cora-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.hero-lead {
    font-size: 1.15rem;
    color: var(--cora-text-soft);
    line-height: 1.6;
    max-width: 560px;
    margin-bottom: 32px;
}
.hero-pills {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 28px;
}
.hero-pills li {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--cora-text);
    background: rgba(255,255,255,0.78);
    border: 1px solid var(--cora-primary-soft);
    padding: 6px 14px;
    border-radius: var(--cora-radius-pill);
    backdrop-filter: blur(6px);
}
.hero-pills li::before {
    content: '';
    display: inline-block;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--cora-primary);
    margin-right: 8px;
    vertical-align: middle;
}

.hero-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 36px; }
.hero-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    font-size: 0.88rem;
    color: var(--cora-text-soft);
}
.hero-trust span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.hero-trust svg {
    width: 18px;
    height: 18px;
    color: var(--cora-success);
}

/* ═══════════════════════════════════════════════════════════════════════
   HERO VISUAL — Diorama premium (2 telefones + 3 cards orbitais)
   ═══════════════════════════════════════════════════════════════════════
   Estrutura:
   .hero-visual
     ├─ .hv-glow                    (gradient ambient atrás)
     ├─ .phone.phone-secondary      (esquerda, atrás, tilt -7°)
     ├─ .phone.phone-primary        (direita-centro, à frente, tilt +3°)
     ├─ .float-card.fc-arrival      (top-right, GPS confirmado)
     ├─ .float-card.fc-record       (bottom-left, prontuário)
     └─ .float-card.fc-rating       (right-bottom, 4,98 ★)
   ═══════════════════════════════════════════════════════════════════════ */

.hero-visual {
    --phone-w-primary:   280px;
    --phone-w-secondary: 230px;
    position: relative;
    aspect-ratio: 1 / 1.12;
    max-width: 540px;
    margin-left: auto;
    isolation: isolate;
}
@media (max-width: 1280px) {
    .hero-visual { --phone-w-primary: 260px; --phone-w-secondary: 210px; max-width: 500px; }
}
@media (max-width: 980px) {
    .hero-visual { --phone-w-primary: 280px; --phone-w-secondary: 220px; max-width: 540px; margin: 0 auto; }
}
@media (max-width: 560px) {
    .hero-visual { --phone-w-primary: 240px; --phone-w-secondary: 190px; aspect-ratio: 1 / 1.18; }
}
@media (max-width: 380px) {
    .hero-visual { --phone-w-primary: 220px; --phone-w-secondary: 170px; }
}

/* Glow ambient — base difusa coral */
.hv-glow {
    position: absolute;
    inset: 8% 4% 8% 4%;
    background:
        radial-gradient(ellipse at 30% 30%, rgba(255,127,80,0.22), transparent 60%),
        radial-gradient(ellipse at 70% 70%, rgba(255,158,122,0.18), transparent 65%);
    filter: blur(40px);
    z-index: 0;
    pointer-events: none;
}

/* ─── Phone frame (CSS-only, parece iPhone moderno) ──────────────────── */
.phone {
    position: absolute;
    width: var(--phone-w-primary);
    z-index: 2;
    will-change: transform;
}
.phone-frame {
    position: relative;
    background: linear-gradient(180deg, #2a3038 0%, #1F262D 50%, #161b21 100%);
    border-radius: 38px;
    padding: 7px;
    box-shadow:
        /* Sombra principal — projeção coral suave abaixo */
        0 60px 120px rgba(245,106,61,0.18),
        /* Sombra da silhueta — escura, profunda */
        0 30px 60px rgba(31,38,45,0.32),
        0 12px 24px rgba(31,38,45,0.18),
        /* Highlight superior interno — simula reflexo metálico */
        inset 0 1.5px 0 rgba(255,255,255,0.12),
        /* Borda lateral interna — separa frame do screen */
        inset 0 0 0 1px rgba(255,255,255,0.04);
}
.phone-frame::before {
    /* Borda lateral metálica (efeito de brilho fino) */
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 38px;
    padding: 1px;
    background: linear-gradient(135deg, rgba(255,255,255,0.18), transparent 30%, transparent 70%, rgba(255,255,255,0.08));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    pointer-events: none;
}

/* Dynamic Island (iPhone 14+) — Phone primary */
.phone-island {
    position: absolute;
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
    width: 84px;
    height: 24px;
    background: #000;
    border-radius: 14px;
    z-index: 3;
}
/* Notch tradicional — Phone secondary */
.phone-notch {
    position: absolute;
    top: 8px;
    left: 50%;
    transform: translateX(-50%);
    width: 110px;
    height: 22px;
    background: #000;
    border-radius: 0 0 12px 12px;
    z-index: 3;
}

.phone-screen {
    position: relative;
    background: #FFFFFF;
    border-radius: 32px;
    overflow: hidden;
    aspect-ratio: 9 / 19;
    display: flex;
    flex-direction: column;
}

/* Status bar (relógio + ícones) */
.ps-statusbar {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 22px 8px;
    font-size: 0.72rem;
    font-weight: 700;
    color: #1F262D;
    height: 36px;
    letter-spacing: -0.02em;
}
.ps-icons { display: inline-flex; align-items: center; gap: 5px; color: #1F262D; }
.ps-icons svg { display: block; }

/* Conteúdo principal da tela */
.ps-content {
    flex: 1;
    overflow: hidden;
    padding: 4px 14px 0;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* Tabbar inferior (4 abas) */
.ps-tabbar {
    flex-shrink: 0;
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 8px 0 14px;
    border-top: 1px solid #F0F2F5;
    background: #fff;
}
.ps-tab i {
    display: block;
    width: 20px; height: 20px;
    border-radius: 5px;
    background: #E6E9EC;
}
.ps-tab.active i {
    background: var(--cora-gradient);
    box-shadow: 0 4px 10px rgba(245,106,61,0.35);
}

/* ═══ Padrões de tela inspirados nos apps reais (Cliente / Profissional) ═══
   Estes blocos seguem o que os apps Native exibem hoje:
   - Saudação no topo, sino + logo
   - Card de "estado atual" em destaque (solicitação ativa / status conta)
   - Grid 2x2 de atalhos / stats
   - CTA primário fullwidth
   ═══════════════════════════════════════════════════════════════════════ */

.ps-greeting {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 4px 14px;
}
.ps-greeting-text strong {
    display: block;
    font-size: 1rem;
    font-weight: 800;
    color: #1F262D;
    letter-spacing: -0.02em;
    line-height: 1.1;
}
.ps-greeting-text strong em {
    font-style: normal;
    color: var(--cora-primary);
}
.ps-greeting-text span {
    font-size: 0.66rem;
    color: #8B95A1;
    margin-top: 1px;
    display: block;
}
.ps-greeting-bell {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--cora-primary-soft);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-shrink: 0;
}
.ps-greeting-bell svg { width: 14px; height: 14px; color: var(--cora-primary-dark); }
.ps-greeting-bell::after {
    content: '';
    position: absolute;
    top: 4px;
    right: 4px;
    width: 7px; height: 7px;
    background: var(--cora-danger);
    border-radius: 50%;
    border: 2px solid #fff;
}

/* Card "estado atual" — solicitação ativa do cliente OU status conta do profissional */
.ps-active-card {
    position: relative;
    background: #fff;
    border: 1px solid var(--cora-border-soft);
    border-radius: 14px;
    padding: 14px 16px 14px 20px;
    margin-bottom: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(31,38,45,0.04);
}
.ps-active-card::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background: var(--cora-gradient);
}
.ps-active-card .ps-overline {
    font-size: 0.6rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    color: #5C6770;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}
.ps-active-card .ps-overline-tag {
    background: var(--cora-info-soft);
    color: var(--cora-info);
    padding: 2px 8px;
    border-radius: 99px;
    font-size: 0.58rem;
    letter-spacing: 0.8px;
}
.ps-active-card .ps-overline-tag.success {
    background: var(--cora-success-soft);
    color: var(--cora-success);
}
.ps-active-card .ps-overline-tag.warning {
    background: var(--cora-warning-soft);
    color: var(--cora-warning);
}
.ps-active-card h5 {
    font-size: 0.86rem;
    font-weight: 800;
    color: #1F262D;
    margin-bottom: 2px;
    letter-spacing: -0.01em;
}
.ps-active-card .ps-meta {
    font-size: 0.7rem;
    color: #8B95A1;
    margin-bottom: 8px;
}
.ps-active-card .ps-action-line {
    font-size: 0.74rem;
    font-weight: 700;
    color: var(--cora-primary-dark);
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Botão CTA primário (estilo PrimaryButton do app) */
.ps-primary-btn {
    background: var(--cora-gradient);
    color: #fff;
    border-radius: 12px;
    padding: 11px 14px;
    font-size: 0.82rem;
    font-weight: 700;
    width: 100%;
    text-align: center;
    box-shadow: 0 6px 14px rgba(245,106,61,0.30);
    margin-bottom: 12px;
    cursor: default;
}

/* Grid 2x2 de atalhos (Cliente) ou stats (Profissional) */
.ps-quick-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 8px;
}
.ps-quick-card {
    background: var(--cora-primary-soft);
    border-radius: 12px;
    padding: 12px 8px;
    text-align: center;
}
.ps-quick-card .ps-emoji {
    font-size: 1.2rem;
    line-height: 1;
    margin-bottom: 4px;
}
.ps-quick-card .ps-quick-label {
    font-size: 0.66rem;
    font-weight: 700;
    color: #1F262D;
}

/* Stat card (profissional) — número grande */
.ps-stat-card {
    background: var(--cora-primary-soft);
    border-radius: 12px;
    padding: 10px 12px;
}
.ps-stat-card .ps-stat-overline {
    font-size: 0.58rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: #5C6770;
    margin-bottom: 4px;
}
.ps-stat-card .ps-stat-value {
    font-size: 1.4rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--cora-primary-dark);
}
.ps-stat-card .ps-stat-value.info  { color: var(--cora-info); }
.ps-stat-card .ps-stat-value.success { color: var(--cora-success); }
.ps-stat-card .ps-stat-sub {
    font-size: 0.6rem;
    color: #8B95A1;
    margin-top: 2px;
}

/* Status conta (profissional) */
.ps-account-card {
    background: var(--cora-success-soft);
    border: 1px solid rgba(15,182,122,0.22);
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 10px;
}
.ps-account-card .ps-account-overline {
    font-size: 0.6rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    color: var(--cora-success);
    margin-bottom: 4px;
}
.ps-account-card strong {
    display: block;
    font-size: 0.86rem;
    font-weight: 800;
    color: #1F262D;
    margin-bottom: 2px;
}
.ps-account-card span {
    display: block;
    font-size: 0.7rem;
    color: var(--cora-success);
}

/* Lista de "chamados/oportunidades" estilo cliente */
.ps-opp-item {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 10px;
    border: 1px solid var(--cora-border-soft);
    border-radius: 10px;
    background: #fff;
    margin-bottom: 6px;
}
.ps-opp-item.highlight {
    border-color: var(--cora-primary);
    background: linear-gradient(180deg, #FFFFFF 0%, #FFF7F2 100%);
}
.ps-opp-emoji {
    width: 36px; height: 36px;
    border-radius: 10px;
    background: var(--cora-primary-soft);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}
.ps-opp-info strong {
    display: block;
    font-size: 0.78rem;
    font-weight: 800;
    color: #1F262D;
    line-height: 1.15;
}
.ps-opp-info span {
    display: block;
    font-size: 0.64rem;
    color: #8B95A1;
    margin-top: 1px;
}
.ps-opp-arrow {
    color: var(--cora-primary);
    font-size: 1.1rem;
    font-weight: 800;
}

/* ═══ Phone primary content — tela de match ═══ */
.ps-match-head {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 6px 4px 12px;
}
.ps-back {
    width: 28px; height: 28px;
    border-radius: 8px;
    background: #F6F7F9;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #1F262D;
    flex-shrink: 0;
}
.ps-match-title {
    font-size: 0.94rem;
    font-weight: 800;
    color: #1F262D;
    letter-spacing: -0.02em;
    line-height: 1.2;
}
.ps-match-sub {
    display: block;
    font-size: 0.7rem;
    color: #8B95A1;
    margin-top: 2px;
}

.ps-chips {
    display: flex;
    gap: 6px;
    margin-bottom: 14px;
    overflow: hidden;
    flex-wrap: nowrap;
}
.ps-chip {
    font-size: 0.66rem;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: 99px;
    background: #F6F7F9;
    color: #5C6770;
    white-space: nowrap;
    flex-shrink: 0;
    border: 1px solid #EDEFF2;
}
.ps-chip.active {
    background: linear-gradient(135deg, #E6F8EF, #D2F3E2);
    color: #0FB67A;
    border-color: rgba(15,182,122,0.25);
}

.ps-result-meta {
    font-size: 0.68rem;
    color: #5C6770;
    margin-bottom: 10px;
    padding-left: 2px;
}
.ps-result-meta strong {
    color: #1F262D;
    font-weight: 800;
    margin-right: 4px;
}

.ps-pro-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    overflow: hidden;
}
.ps-pro {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 8px 10px;
    border: 1px solid #EDEFF2;
    border-radius: 12px;
    background: #fff;
    transition: border-color 0.2s ease;
}
.ps-pro.selected {
    border-color: var(--cora-primary);
    border-width: 1.5px;
    background: linear-gradient(180deg, #FFFFFF 0%, #FFF7F2 100%);
    box-shadow: 0 6px 18px rgba(245,106,61,0.14);
}
.ps-avatar-md {
    width: 36px; height: 36px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 800;
    font-size: 0.74rem;
    flex-shrink: 0;
}
.ps-avatar-coral {
    background: var(--cora-gradient);
    color: #fff;
    box-shadow: 0 4px 10px rgba(245,106,61,0.35);
}
.ps-pro-info { min-width: 0; }
.ps-pro-info strong {
    display: block;
    font-size: 0.78rem;
    font-weight: 800;
    color: #1F262D;
    letter-spacing: -0.01em;
    line-height: 1.2;
}
.ps-verified {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 12px; height: 12px;
    background: var(--cora-success);
    color: #fff;
    font-size: 0.6rem;
    border-radius: 50%;
    font-weight: 800;
    margin-left: 3px;
    vertical-align: middle;
}
.ps-pro-role,
.ps-pro-stats {
    display: block;
    font-size: 0.64rem;
    color: #8B95A1;
    line-height: 1.3;
    margin-top: 1px;
}
.ps-pro-stats { color: #5C6770; font-weight: 500; }
.ps-pro-price {
    text-align: right;
    flex-shrink: 0;
}
.ps-pro-price strong {
    display: block;
    font-size: 0.82rem;
    font-weight: 800;
    color: #1F262D;
    line-height: 1;
    letter-spacing: -0.02em;
}
.ps-pro-price span {
    font-size: 0.6rem;
    color: #8B95A1;
}

.ps-cta-btn {
    margin: 12px 0 8px;
    background: var(--cora-gradient);
    color: #fff;
    font-weight: 700;
    font-size: 0.78rem;
    padding: 11px 14px;
    border-radius: 12px;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    box-shadow: 0 8px 18px rgba(245,106,61,0.35);
    cursor: default;
}

/* ═══ Phone secondary content — tela de cuidado em andamento ═══ */
.ps-content-care .ps-care-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 4px 14px;
    border-bottom: 1px solid #EDEFF2;
    margin-bottom: 12px;
}
.ps-care-meta { flex: 1; min-width: 0; }
.ps-care-meta strong {
    display: block;
    font-size: 0.82rem;
    font-weight: 800;
    color: #1F262D;
    letter-spacing: -0.01em;
}
.ps-care-meta span {
    display: block;
    font-size: 0.66rem;
    color: #8B95A1;
    margin-top: 1px;
}
.ps-live {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.6rem;
    font-weight: 800;
    color: var(--cora-success);
    text-transform: uppercase;
    letter-spacing: 1px;
}
.ps-live::before {
    content: '';
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--cora-success);
    box-shadow: 0 0 0 3px rgba(15,182,122,0.18);
    animation: livePulse 1.6s ease-in-out infinite;
}
.ps-live::after { content: 'AO VIVO'; }
@keyframes livePulse {
    0%,100% { box-shadow: 0 0 0 3px rgba(15,182,122,0.18); }
    50%     { box-shadow: 0 0 0 6px rgba(15,182,122,0.04); }
}

/* GPS card (mini-mapa decorativo) */
.ps-gps {
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 12px;
    align-items: center;
    padding: 10px;
    background: linear-gradient(180deg, #F2F8FF 0%, #E5F0FE 100%);
    border-radius: 12px;
    margin-bottom: 14px;
    border: 1px solid rgba(14,127,232,0.12);
}
.ps-gps-bg {
    position: relative;
    width: 56px; height: 56px;
    border-radius: 10px;
    background:
        radial-gradient(circle at 50% 50%, rgba(14,127,232,0.18), rgba(14,127,232,0.04) 60%, transparent 80%),
        linear-gradient(135deg, #DCE9FA, #C9DCF4);
    overflow: hidden;
}
.ps-gps-grid {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(0deg, transparent 24%, rgba(14,127,232,0.10) 25%, rgba(14,127,232,0.10) 26%, transparent 27%) 0 0 / 100% 16px,
        linear-gradient(90deg, transparent 24%, rgba(14,127,232,0.10) 25%, rgba(14,127,232,0.10) 26%, transparent 27%) 0 0 / 16px 100%;
}
.ps-gps-pin {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -85%);
    width: 14px; height: 14px;
    background: var(--cora-primary);
    border: 2px solid #fff;
    border-radius: 50% 50% 50% 0;
    transform-origin: center bottom;
    transform: translate(-50%,-85%) rotate(-45deg);
    box-shadow: 0 4px 8px rgba(245,106,61,0.4);
    z-index: 2;
}
.ps-gps-dot {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 10px; height: 10px;
    border-radius: 50%;
    background: rgba(14,127,232,0.4);
    box-shadow: 0 0 0 8px rgba(14,127,232,0.12);
    animation: gpsPulse 2.4s ease-in-out infinite;
    z-index: 1;
}
@keyframes gpsPulse {
    0%,100% { box-shadow: 0 0 0 8px rgba(14,127,232,0.12); }
    50%     { box-shadow: 0 0 0 14px rgba(14,127,232,0.02); }
}
.ps-gps-meta strong {
    display: block;
    font-size: 0.78rem;
    font-weight: 800;
    color: #1F262D;
}
.ps-gps-meta span {
    display: block;
    font-size: 0.62rem;
    color: #5C6770;
    margin-top: 1px;
}

.ps-sec-title {
    font-size: 0.66rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    color: #8B95A1;
    margin-bottom: 8px;
    padding-left: 2px;
}

/* Timeline de atividades */
.ps-timeline {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 7px;
    flex: 1;
    overflow: hidden;
}
.ps-timeline li {
    display: grid;
    grid-template-columns: 14px 36px 1fr 16px;
    gap: 8px;
    align-items: center;
    font-size: 0.7rem;
    color: #5C6770;
    padding: 5px 8px;
    border-radius: 8px;
    background: #FAFBFC;
    border: 1px solid #F0F2F5;
}
.ps-timeline li .tb {
    display: block;
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #E6E9EC;
}
.ps-timeline li.done .tb { background: var(--cora-success); }
.ps-timeline li.ongoing .tb {
    background: var(--cora-warning);
    box-shadow: 0 0 0 3px rgba(242,169,59,0.22);
}
.ps-timeline li strong {
    font-size: 0.66rem;
    font-weight: 800;
    color: #1F262D;
    letter-spacing: -0.01em;
}
.ps-timeline li em {
    font-style: normal;
    text-align: right;
    color: var(--cora-success);
    font-weight: 800;
}
.ps-timeline li.ongoing em { color: var(--cora-warning); }

/* ═══ Posicionamento dos 2 telefones ═══ */
.phone-primary {
    width: var(--phone-w-primary);
    top: 4%;
    right: -2%;
    transform: rotate(3deg);
    z-index: 4;
    animation: phoneFloatA 8s ease-in-out infinite;
}
.phone-secondary {
    width: var(--phone-w-secondary);
    bottom: 2%;
    left: -4%;
    transform: rotate(-7deg);
    z-index: 3;
    animation: phoneFloatB 8s ease-in-out infinite;
    animation-delay: -3s;
}
@keyframes phoneFloatA {
    0%,100% { transform: rotate(3deg) translateY(0); }
    50%     { transform: rotate(3deg) translateY(-8px); }
}
@keyframes phoneFloatB {
    0%,100% { transform: rotate(-7deg) translateY(0); }
    50%     { transform: rotate(-7deg) translateY(-6px); }
}

/* ═══ Cards flutuantes orbitais ═══ */
.float-card {
    position: absolute;
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: 14px;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    box-shadow:
        0 18px 40px rgba(31,38,45,0.16),
        0 6px 14px rgba(31,38,45,0.08),
        inset 0 1px 0 rgba(255,255,255,0.6);
    z-index: 5;
    backdrop-filter: blur(8px);
    will-change: transform;
}
.fc-icon {
    width: 32px; height: 32px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.fc-icon svg { width: 16px; height: 16px; }
.fc-icon-success { background: var(--cora-success-soft); color: var(--cora-success); }
.fc-icon-info    { background: var(--cora-info-soft);    color: var(--cora-info); }
.fc-body strong {
    display: block;
    font-size: 0.78rem;
    font-weight: 800;
    color: var(--cora-text);
    letter-spacing: -0.01em;
}
.fc-body span {
    display: block;
    font-size: 0.66rem;
    color: var(--cora-text-soft);
    margin-top: 1px;
}

/* Posicionamento de cada card flutuante */
.fc-arrival {
    top: 2%;
    left: -4%;
    transform: rotate(-4deg);
    animation: cardFloat1 6s ease-in-out infinite;
}
.fc-record {
    bottom: 28%;
    right: -8%;
    transform: rotate(4deg);
    animation: cardFloat2 6s ease-in-out infinite;
    animation-delay: -2s;
}
.fc-rating {
    bottom: -2%;
    right: 12%;
    padding: 8px 14px 8px 10px;
    transform: rotate(-3deg);
    animation: cardFloat3 6s ease-in-out infinite;
    animation-delay: -4s;
}
.fc-rating-star {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: var(--cora-gradient);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(245,106,61,0.4);
}
.fc-rating-star svg { width: 18px; height: 18px; }
.fc-rating-body { display: flex; flex-direction: column; }
.fc-rating-body strong {
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--cora-text);
    letter-spacing: -0.02em;
    line-height: 1;
}
.fc-rating-body span {
    font-size: 0.62rem;
    color: var(--cora-text-soft);
    margin-top: 2px;
}

@keyframes cardFloat1 {
    0%,100% { transform: rotate(-4deg) translateY(0); }
    50%     { transform: rotate(-4deg) translateY(-7px); }
}
@keyframes cardFloat2 {
    0%,100% { transform: rotate(4deg) translateY(0); }
    50%     { transform: rotate(4deg) translateY(-6px); }
}
@keyframes cardFloat3 {
    0%,100% { transform: rotate(-3deg) translateY(0); }
    50%     { transform: rotate(-3deg) translateY(-5px); }
}

@media (prefers-reduced-motion: reduce) {
    .phone-primary, .phone-secondary,
    .fc-arrival, .fc-record, .fc-rating { animation: none; }
}

/* Responsivo do diorama — NÃO deixa nada vazar do .hero-visual */
@media (max-width: 980px) {
    .hero-visual {
        aspect-ratio: 1 / 1.08;
        margin: 0 auto;
        overflow: visible;     /* desktop pode respirar */
    }
    .phone-primary   { right: 4%; }
    .phone-secondary { left: 0%; }
    .fc-arrival { left: 0; top: 0; }
    .fc-record  { right: 2%; }
    .fc-rating  { right: 18%; }
}

@media (max-width: 720px) {
    /* Reduz tilts agressivos pra evitar overflow lateral */
    .phone-primary {
        transform: rotate(2deg);
        animation: phoneFloatA-mobile 8s ease-in-out infinite;
    }
    .phone-secondary {
        transform: rotate(-4deg);
        animation: phoneFloatB-mobile 8s ease-in-out infinite;
        animation-delay: -3s;
    }
    @keyframes phoneFloatA-mobile {
        0%,100% { transform: rotate(2deg) translateY(0); }
        50%     { transform: rotate(2deg) translateY(-6px); }
    }
    @keyframes phoneFloatB-mobile {
        0%,100% { transform: rotate(-4deg) translateY(0); }
        50%     { transform: rotate(-4deg) translateY(-5px); }
    }
}

@media (max-width: 560px) {
    .hero-visual {
        aspect-ratio: 1 / 1.25;
        max-width: 100%;
        padding: 0 8px;
        /* Critical: contém o diorama nos limites do container, evita
           scroll horizontal causado por phone-secondary com offset negativo */
        overflow: hidden;
    }
    .phone-primary {
        right: 0;
        top: 1%;
        transform: rotate(2deg);
    }
    .phone-secondary {
        left: 0;
        bottom: 4%;
        transform: rotate(-4deg);
    }
    .fc-arrival { left: 2%; top: 0%;    transform: rotate(-3deg) scale(0.88); }
    .fc-record  { right: 2%; bottom: 36%; transform: rotate(3deg)  scale(0.88); }
    .fc-rating  { right: 22%; bottom: 0%;  transform: rotate(-2deg) scale(0.88); }
}

@media (max-width: 380px) {
    .hero-visual { aspect-ratio: 1 / 1.32; }
    .float-card { padding: 8px 12px; gap: 8px; max-width: 200px; }
    .fc-body strong { font-size: 0.72rem; }
    .fc-body span   { font-size: 0.6rem; }
    .fc-icon { width: 28px; height: 28px; }
    .fc-icon svg { width: 14px; height: 14px; }
    .fc-rating-star { width: 30px; height: 30px; }
    .fc-rating-star svg { width: 16px; height: 16px; }
    .fc-rating-body strong { font-size: 1rem; }
}

@media (max-width: 320px) {
    /* Telas muito pequenas: simplifica drasticamente — esconde phone-secondary
       (a tela primária já carrega a mensagem) e reposiciona toasts. */
    .phone-secondary { display: none; }
    .hero-visual { aspect-ratio: 1 / 1.05; }
    .phone-primary { right: 50%; transform: translateX(50%) rotate(0); top: 4%; }
    .fc-arrival { left: 0; top: 0; }
    .fc-record  { right: 0; bottom: 6%; }
    .fc-rating  { display: none; }
}

/* ─── Pain section (validação de dor) ─────────────────────────────────── */
.pain-section { background: var(--cora-card); }
.pain-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}
@media (max-width: 880px) {
    .pain-grid { grid-template-columns: 1fr; gap: 18px; }
}
.pain-card {
    background: var(--cora-surface-alt);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-xl);
    padding: 32px 30px;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    display: flex;
    flex-direction: column;
}
.pain-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--cora-shadow);
    border-color: var(--cora-primary-soft);
}
.pain-card.pain-profissional {
    background: linear-gradient(180deg, #FFFFFF 0%, #FFF7F2 100%);
    border-color: var(--cora-primary-soft);
}
.pain-head { margin-bottom: 18px; }
.pain-tag {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    background: var(--cora-text);
    color: #fff;
    padding: 4px 12px;
    border-radius: var(--cora-radius-pill);
    margin-bottom: 12px;
}
.pain-tag.tag-coral {
    background: var(--cora-gradient);
}
.pain-title {
    font-size: 1.18rem;
    font-weight: 800;
    line-height: 1.25;
    color: var(--cora-text);
    letter-spacing: -0.01em;
}
.pain-list {
    list-style: none;
    margin-bottom: 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
}
.pain-list li {
    position: relative;
    padding-left: 22px;
    font-size: 0.96rem;
    line-height: 1.55;
    color: var(--cora-text-soft);
    quotes: "\201C" "\201D";
}
.pain-list li::before {
    content: '"';
    position: absolute;
    left: 0;
    top: -4px;
    font-family: 'Georgia', serif;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--cora-primary);
    line-height: 1;
}
.pain-link {
    align-self: flex-start;
    color: var(--cora-primary-dark);
    font-weight: 700;
    font-size: 0.92rem;
    padding: 8px 0;
    border-bottom: 2px solid transparent;
    transition: border-color 0.2s ease, color 0.2s ease;
}
.pain-link:hover {
    color: var(--cora-primary);
    border-bottom-color: var(--cora-primary);
}

/* Título customizado no banner de parcerias */
.partner-title {
    margin-top: 18px;
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.18;
    color: #fff;
    margin-bottom: 14px;
}

/* ─── Sticky mobile CTA ────────────────────────────────────────────────
   Barra fixa que aparece depois que o hero sai do viewport. Garante que
   "Baixar app" / "Sou profissional" estejam sempre acessíveis no mobile. */
.sticky-cta {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 90;
    display: none;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px));
    background: rgba(255,255,255,0.95);
    backdrop-filter: saturate(180%) blur(14px);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    border-top: 1px solid var(--cora-border-soft);
    box-shadow: 0 -8px 24px rgba(31,38,45,0.08);
    transform: translateY(120%);
    transition: transform 0.3s cubic-bezier(.4,0,.2,1);
}
.sticky-cta[hidden] { display: none; }
.sticky-cta:not([hidden]) { display: grid; }
.sticky-cta.show { transform: translateY(0); }
.sticky-cta .btn { padding: 13px 16px; font-size: 0.92rem; min-height: 48px; white-space: nowrap; }

/* Só ativa no mobile/tablet (≤ 980px). Em desktop, os CTAs do header
   sticky e da página já cobrem a função. */
@media (min-width: 981px) {
    .sticky-cta { display: none !important; }
}

/* Quando sticky CTA está ativa, dá folga pro footer não ser clipado */
body.has-sticky-cta { padding-bottom: 76px; }
@media (min-width: 981px) {
    body.has-sticky-cta { padding-bottom: 0; }
}

/* ─── Steps ────────────────────────────────────────────────────────────── */
.steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 20px;
    counter-reset: step;
}
.step {
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-lg);
    padding: 28px 24px;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.step:hover {
    transform: translateY(-3px);
    box-shadow: var(--cora-shadow);
    border-color: var(--cora-primary-soft);
}
.step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: var(--cora-primary-soft);
    color: var(--cora-primary-dark);
    font-weight: 800;
    font-size: 0.95rem;
    margin-bottom: 16px;
}
.step-title {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--cora-text);
    margin-bottom: 8px;
}
.step-text {
    font-size: 0.92rem;
    color: var(--cora-text-soft);
    line-height: 1.55;
}

/* ─── Services grid (Home: Serviços mais procurados) ─────────────────── */
.services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}
@media (max-width: 1100px) { .services-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px)  { .services-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .services-grid { grid-template-columns: 1fr; } }

.service-card {
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-lg);
    padding: 24px 22px;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.service-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--cora-shadow);
    border-color: var(--cora-primary-soft);
}
.service-card .sc-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--cora-gradient-soft);
    color: var(--cora-primary-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}
.service-card .sc-icon svg { width: 22px; height: 22px; }
.service-card h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--cora-text);
    margin-bottom: 6px;
    letter-spacing: -0.01em;
}
.service-card p {
    font-size: 0.88rem;
    line-height: 1.5;
    color: var(--cora-text-soft);
}
.service-card-cta {
    background: linear-gradient(135deg, #FFF7F2 0%, #FFEDE2 100%);
    border-color: var(--cora-primary-soft);
    display: flex;
    flex-direction: column;
}
.service-card-cta .btn-link {
    margin-top: auto;
    padding-top: 14px;
    font-weight: 700;
    color: var(--cora-primary-dark);
}

/* ─── Manifesto editorial (substitui o grid de features) ──────────────── */
.manifesto { position: relative; overflow: hidden; }
.manifesto::before {
    content: '';
    position: absolute;
    top: -200px; right: -180px;
    width: 520px; height: 520px;
    background: radial-gradient(circle, rgba(255,127,80,0.10), transparent 65%);
    border-radius: 50%;
    pointer-events: none;
}
.manifesto-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 80px;
    align-items: start;
    position: relative;
}
.manifesto-title {
    font-size: clamp(2rem, 3.6vw, 3rem);
    font-weight: 800;
    letter-spacing: -0.025em;
    line-height: 1.05;
    margin: 18px 0 22px;
    max-width: 14ch;
}
.manifesto-title em {
    font-style: normal;
    background: var(--cora-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.manifesto-lead {
    font-size: 1.06rem;
    line-height: 1.7;
    color: var(--cora-text-soft);
    max-width: 46ch;
}

/* Stat oversize com lista */
.manifesto-aside {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.ma-stat {
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-xl);
    padding: 28px 32px;
    box-shadow: var(--cora-shadow);
    position: relative;
    margin-bottom: 14px;
    transform: rotate(-0.6deg); /* leve desalinhamento editorial */
    transition: transform 0.3s ease;
}
.ma-stat:hover { transform: rotate(0deg) translateY(-2px); }
.ma-num {
    display: block;
    font-size: clamp(3.4rem, 5.6vw, 4.8rem);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 0.95;
    background: var(--cora-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin-bottom: 4px;
}
.ma-label {
    display: block;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    color: var(--cora-text-soft);
    margin-bottom: 14px;
}
.ma-cities {
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 18px;
}
.ma-cities li {
    font-size: 0.94rem;
    font-weight: 500;
    color: var(--cora-text);
    display: flex;
    align-items: center;
    gap: 8px;
}
.ma-cities li::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--cora-primary);
}

/* Pilares numerados */
.ma-pillar {
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 18px;
    padding: 18px 4px;
    border-bottom: 1px solid var(--cora-border-soft);
    transition: padding-left 0.2s ease;
}
.ma-pillar:last-child { border-bottom: none; }
.ma-pillar:hover { padding-left: 6px; }
.ma-pillar strong {
    font-family: 'Georgia', 'Times New Roman', serif;
    font-size: 2.4rem;
    font-weight: 400;
    font-style: italic;
    color: var(--cora-primary);
    line-height: 1;
    letter-spacing: -0.02em;
}
.ma-pillar h4 {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--cora-text);
    margin-bottom: 4px;
}
.ma-pillar p {
    font-size: 0.92rem;
    color: var(--cora-text-soft);
    line-height: 1.55;
}

@media (max-width: 980px) {
    .manifesto-grid { grid-template-columns: 1fr; gap: 48px; }
    .ma-stat { transform: none; }
}
@media (max-width: 560px) {
    .ma-cities { grid-template-columns: 1fr; }
    .ma-pillar { grid-template-columns: 44px 1fr; gap: 14px; }
    .ma-pillar strong { font-size: 2rem; }
}

/* ─── Features (diferenciais) ─────────────────────────────────────────── */
.features {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 20px;
}
.feature {
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-lg);
    padding: 28px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.feature:hover { transform: translateY(-3px); box-shadow: var(--cora-shadow); }
.feature-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: var(--cora-gradient-soft);
    color: var(--cora-primary-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
}
.feature-icon svg { width: 24px; height: 24px; }
.feature-title { font-size: 1.05rem; font-weight: 700; margin-bottom: 8px; }
.feature-text { font-size: 0.92rem; color: var(--cora-text-soft); line-height: 1.55; }

/* ─── Mapa Brasil ──────────────────────────────────────────────────────── */
.map-section { background: var(--cora-surface-alt); }

.map-wrap {
    position: relative;
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-xl);
    padding: 14px;
    box-shadow: var(--cora-shadow);
    aspect-ratio: 1 / 1.05;
    min-height: 460px;       /* fallback se aspect-ratio não for suportado */
    max-width: 560px;
    margin: 0 auto;
    overflow: hidden;
}

/* Variante hero: mapa full-width, mais alto, dominante na seção */
.map-wrap-hero {
    aspect-ratio: 16 / 9;
    max-width: 100%;
    min-height: 540px;
    margin-bottom: 40px;
}
@media (max-width: 720px) {
    .map-wrap-hero {
        aspect-ratio: 4 / 5;
        min-height: 420px;
    }
}

/* Leaflet container — dimensões EXPLÍCITAS são essenciais; sem isso o
   Leaflet inicia com 0×0 e nenhum tile aparece. */
.cora-map {
    width: 100%;
    height: 100%;
    min-height: 420px;
    border-radius: var(--cora-radius-lg);
    background: #F2F4F7;
    position: relative;
    overflow: hidden;
}
.cora-map .leaflet-container {
    background: #F2F4F7;
    font-family: var(--cora-font-body);
}
.cora-map .leaflet-control-attribution {
    font-size: 0.66rem;
    background: rgba(255,255,255,0.78);
    padding: 2px 6px;
    border-radius: 6px 0 0 0;
}
.cora-map .leaflet-control-attribution a { color: var(--cora-text-soft); }
.cora-map .leaflet-control-zoom a {
    background: var(--cora-card);
    color: var(--cora-text);
    border: 1px solid var(--cora-border-soft);
    transition: background 0.15s ease, color 0.15s ease;
}
.cora-map .leaflet-control-zoom a:hover {
    background: var(--cora-primary-soft);
    color: var(--cora-primary-dark);
}

/* Skeleton enquanto Leaflet não carrega — fica POR CIMA do #cora-map
   ocupando a área padding-box do .map-wrap. */
.map-skeleton {
    position: absolute;
    top: 14px; left: 14px; right: 14px; bottom: 14px;
    border-radius: var(--cora-radius-lg);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: var(--cora-muted);
    font-size: 0.88rem;
    background: linear-gradient(135deg, #FFF7F2, #F2F4F7);
    z-index: 3;
    pointer-events: none;
    transition: opacity 0.3s ease;
}
.map-skeleton.hidden { opacity: 0; pointer-events: none; }
.ms-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid var(--cora-primary-soft);
    border-top-color: var(--cora-primary);
    border-radius: 50%;
    animation: msSpin 0.85s linear infinite;
}
@keyframes msSpin { to { transform: rotate(360deg); } }

/* Marcadores customizados */
.cora-marker {
    position: relative;
    width: 22px;
    height: 22px;
    transform: translate(-50%, -50%);
}
.cora-marker .cm-dot {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--cora-primary-light);
    border: 2px solid #fff;
    box-shadow: 0 4px 12px rgba(31,38,45,0.18);
}
.cora-marker.is-active .cm-dot {
    background: var(--cora-primary);
    box-shadow: 0 4px 14px rgba(245,106,61,0.45);
}
.cora-marker .cm-pulse {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--cora-primary);
    opacity: 0;
}
.cora-marker.is-active .cm-pulse {
    animation: cmPulse 2.2s ease-out infinite;
}
@keyframes cmPulse {
    0%   { transform: scale(0.6); opacity: 0.55; }
    80%  { transform: scale(2.4); opacity: 0; }
    100% { transform: scale(2.4); opacity: 0; }
}

/* Popup */
.cora-map .leaflet-popup-content-wrapper {
    border-radius: var(--cora-radius);
    box-shadow: var(--cora-shadow-lg);
    border: 1px solid var(--cora-border-soft);
    padding: 0;
}
.cora-map .leaflet-popup-content {
    margin: 14px 18px;
    font-family: var(--cora-font-body);
    font-size: 0.9rem;
    line-height: 1.45;
    color: var(--cora-text);
}
.cora-map .leaflet-popup-content strong {
    display: block;
    font-size: 0.95rem;
    color: var(--cora-text);
    margin-bottom: 2px;
}
.cora-map .leaflet-popup-content .pp-tag {
    display: inline-block;
    margin-top: 6px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 3px 10px;
    border-radius: var(--cora-radius-pill);
    background: var(--cora-primary-soft);
    color: var(--cora-primary-dark);
}
.cora-map .leaflet-popup-content .pp-tag.muted {
    background: var(--cora-border-soft);
    color: var(--cora-muted);
}
.cora-map .leaflet-popup-tip { box-shadow: var(--cora-shadow); }

/* Controles flutuantes (focar ABC / Brasil) */
.map-controls {
    position: absolute;
    top: 24px;
    right: 24px;
    display: flex;
    gap: 6px;
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(8px);
    padding: 4px;
    border-radius: var(--cora-radius-pill);
    border: 1px solid var(--cora-border-soft);
    box-shadow: var(--cora-shadow);
    z-index: 2;
    opacity: 0;
    transform: translateY(-6px);
    transition: opacity 0.25s ease, transform 0.25s ease;
    pointer-events: none;
}
.map-controls[data-ready="true"] {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
.map-ctrl {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cora-text-soft);
    padding: 7px 14px;
    border-radius: var(--cora-radius-pill);
    transition: background 0.15s ease, color 0.15s ease;
}
.map-ctrl:hover { background: var(--cora-surface); color: var(--cora-text); }
.map-ctrl.is-active {
    background: var(--cora-gradient);
    color: #fff;
    box-shadow: 0 4px 12px rgba(245,106,61,0.28);
}

/* Legenda */
.map-legend {
    position: absolute;
    bottom: 22px;
    left: 22px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 0.78rem;
    color: var(--cora-text-soft);
    background: rgba(255,255,255,0.92);
    padding: 10px 14px;
    border-radius: 12px;
    backdrop-filter: blur(8px);
    border: 1px solid var(--cora-border-soft);
    z-index: 2;
}
.map-legend span { display: inline-flex; align-items: center; gap: 8px; }
.map-legend i {
    width: 10px; height: 10px;
    border-radius: 50%;
    display: inline-block;
}
.map-legend .lg-active   { background: var(--cora-primary); box-shadow: 0 0 0 3px rgba(245,106,61,0.18); }
.map-legend .lg-planned  { background: var(--cora-primary-light); }

/* Status / contador */
.map-status {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    padding: 10px 16px;
    border-radius: var(--cora-radius-pill);
    margin-top: 24px;
    font-size: 0.88rem;
    color: var(--cora-text-soft);
}
.map-status[data-state="loading"] .ms-label { color: var(--cora-muted); }
.map-status[data-state="ok"]      .ms-label { color: var(--cora-text); font-weight: 600; }
.map-status[data-state="error"]   .ms-label { color: var(--cora-danger); }
.map-status .ms-row { display: inline-flex; align-items: center; gap: 10px; }
.map-status .ms-count {
    font-weight: 700;
    color: var(--cora-primary-dark);
    background: var(--cora-primary-soft);
    padding: 2px 10px;
    border-radius: var(--cora-radius-pill);
    font-size: 0.78rem;
}

/* Listas dinâmicas */
.map-cities-title {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    color: var(--cora-primary-dark);
    margin: 24px 0 12px;
}
.map-cities-title.soon-title { color: var(--cora-muted); margin-top: 22px; }

.map-cities {
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 24px;
}
.map-cities li {
    font-size: 0.92rem;
    color: var(--cora-text);
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
}
.map-cities li::before {
    content: '';
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--cora-primary);
    flex-shrink: 0;
}
.map-cities li.loading {
    color: var(--cora-muted);
    font-style: italic;
}
.map-cities li.loading::before { background: var(--cora-border); }
.map-cities.soon-list li,
.map-cities li.soon { color: var(--cora-muted); }
.map-cities.soon-list li::before,
.map-cities li.soon::before { background: var(--cora-border); }
.map-footnote {
    margin: 28px auto 0;
    font-size: 0.92rem;
    color: var(--cora-muted);
    text-align: center;
    max-width: 620px;
}

/* ─── Badge sobreposta no mapa (resumo da região ativa) ───────────────── */
.map-region-badge {
    position: absolute;
    bottom: 22px;
    right: 22px;
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-lg);
    padding: 16px 22px;
    box-shadow: var(--cora-shadow-lg);
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-width: 260px;
    backdrop-filter: blur(10px);
}
.map-region-badge[hidden] { display: none; }
.map-region-badge::before {
    content: '';
    position: absolute;
    top: -1px; left: -1px;
    width: 36px; height: 4px;
    background: var(--cora-gradient);
    border-radius: var(--cora-radius-lg) 0 0 0;
}
.mrb-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.6px;
    color: var(--cora-primary-dark);
}
.mrb-name {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--cora-text);
    letter-spacing: -0.01em;
}
.mrb-meta {
    font-size: 0.84rem;
    color: var(--cora-text-soft);
}

/* ─── Grid de regiões (lateral) ───────────────────────────────────────── */
.map-summary {
    max-width: 920px;
    margin: 0 auto;
}
.region-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    margin-top: 28px;
}
@media (max-width: 720px) {
    .region-grid { grid-template-columns: 1fr; gap: 32px; }
}
.region-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.region-list li {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius);
    transition: border-color 0.2s ease, transform 0.2s ease;
}
.region-list li:hover { border-color: var(--cora-primary-soft); transform: translateY(-1px); }
.region-list li.loading {
    color: var(--cora-muted);
    font-style: italic;
    background: transparent;
    border: 1px dashed var(--cora-border);
}
.region-list .rl-state {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--cora-primary-soft);
    color: var(--cora-primary-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 0.82rem;
    letter-spacing: 0.5px;
}
.region-list .rl-region {
    flex: 1;
    font-size: 0.94rem;
    font-weight: 600;
    color: var(--cora-text);
    line-height: 1.3;
}
.region-list .rl-count {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cora-text-soft);
    background: var(--cora-surface);
    padding: 4px 10px;
    border-radius: var(--cora-radius-pill);
}
.region-list.soon-list .rl-state {
    background: var(--cora-border-soft);
    color: var(--cora-muted);
}
.region-list.soon-list .rl-region {
    color: var(--cora-text-soft);
    font-weight: 500;
}

/* ─── Mancha de região (Leaflet circle) ──────────────────────────────── */
.cora-map .region-blob {
    fill: #FF7F50;
    fill-opacity: 0.18;
    stroke: #F56A3D;
    stroke-width: 1.5;
    stroke-opacity: 0.65;
    stroke-dasharray: 6 4;
}
.cora-map .region-blob-pulse {
    fill: #FF7F50;
    fill-opacity: 0.10;
    stroke: none;
    animation: regionPulse 3s ease-in-out infinite;
    transform-origin: center;
}
@keyframes regionPulse {
    0%, 100% { fill-opacity: 0.10; }
    50%      { fill-opacity: 0.04; }
}

/* ─── Audience CTA blocks (cliente / profissional) ────────────────────── */
.audience {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}
.audience-card {
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-xl);
    padding: 40px;
    box-shadow: var(--cora-shadow);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.audience-card:hover { transform: translateY(-3px); box-shadow: var(--cora-shadow-lg); }
.audience-card.coral {
    background: var(--cora-gradient);
    color: var(--cora-on-primary);
    border-color: transparent;
    box-shadow: 0 16px 48px rgba(245,106,61,0.28);
}
.audience-card .ac-icon {
    width: 56px; height: 56px;
    border-radius: 16px;
    background: var(--cora-primary-soft);
    color: var(--cora-primary-dark);
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 22px;
}
.audience-card.coral .ac-icon {
    background: rgba(255,255,255,0.2);
    color: #fff;
}
.audience-card .ac-icon svg { width: 28px; height: 28px; }
.audience-card h3 {
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    margin-bottom: 12px;
}
.audience-card p { font-size: 1rem; line-height: 1.6; opacity: 0.92; margin-bottom: 22px; }
.audience-card .ac-list {
    list-style: none;
    margin-bottom: 28px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.audience-card .ac-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.95rem;
    line-height: 1.5;
}
.audience-card .ac-list svg {
    width: 18px; height: 18px;
    flex-shrink: 0;
    margin-top: 2px;
    color: var(--cora-success);
}
.audience-card.coral .ac-list svg { color: #fff; }
.audience-card .ac-cta { display: flex; flex-wrap: wrap; gap: 10px; }

/* ─── Benefits (sections #clientes / #profissionais) ─────────────────── */
.section-clientes { background: var(--cora-card); }
.section-profissionais {
    background: linear-gradient(180deg, #FFF7F2 0%, #FFEDE2 100%);
    position: relative;
    overflow: hidden;
}
.section-profissionais::before {
    content: '';
    position: absolute;
    top: -160px; right: -160px;
    width: 480px; height: 480px;
    background: radial-gradient(circle, rgba(245,106,61,0.16), transparent 65%);
    border-radius: 50%;
    pointer-events: none;
}
.section-profissionais::after {
    content: '';
    position: absolute;
    bottom: -180px; left: -160px;
    width: 460px; height: 460px;
    background: radial-gradient(circle, rgba(255,158,122,0.18), transparent 60%);
    border-radius: 50%;
    pointer-events: none;
}
.section-profissionais > .container { position: relative; }

.free-eyebrow {
    background: var(--cora-success-soft) !important;
    color: var(--cora-success) !important;
}
.free-eyebrow::before {
    content: '✓ ';
    font-weight: 800;
}

.benefits-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 40px;
}
.benefits-grid.prof-grid {
    grid-template-columns: repeat(4, 1fr);
}
@media (max-width: 980px) {
    .benefits-grid,
    .benefits-grid.prof-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 560px) {
    .benefits-grid,
    .benefits-grid.prof-grid {
        grid-template-columns: 1fr;
    }
}

.benefit {
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-lg);
    padding: 28px 26px;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.benefit:hover {
    transform: translateY(-3px);
    box-shadow: var(--cora-shadow);
    border-color: var(--cora-primary-soft);
}
.benefit-highlight {
    background: var(--cora-text);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 16px 40px rgba(31,38,45,0.12);
}
.benefit-highlight:hover {
    box-shadow: 0 20px 48px rgba(31,38,45,0.18);
    border-color: transparent;
}
.benefit-highlight .bn-icon {
    background: rgba(255,127,80,0.18);
    color: var(--cora-primary-light);
}
.benefit-highlight h3 { color: #fff; }
.benefit-highlight p  { color: rgba(255,255,255,0.78); }

.bn-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: var(--cora-gradient-soft);
    color: var(--cora-primary-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
}
.bn-icon.coral-icon {
    background: var(--cora-card);
    color: var(--cora-primary-dark);
    box-shadow: 0 4px 14px rgba(245,106,61,0.18);
}
.bn-icon svg { width: 22px; height: 22px; }
.benefit h3 {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--cora-text);
    margin-bottom: 8px;
    letter-spacing: -0.01em;
}
.benefit p {
    font-size: 0.94rem;
    line-height: 1.55;
    color: var(--cora-text-soft);
}

/* CTA-row debaixo de cada seção */
.cta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 18px;
    margin-top: 8px;
}
.cta-row .cta-foot {
    font-size: 0.86rem;
    color: var(--cora-text-soft);
    margin-left: 4px;
}
.section-profissionais .cta-row .cta-foot { color: var(--cora-text); }

/* ─── Hero compacto (página /contato) ─────────────────────────────────── */
.hero.hero-compact { padding: 88px 0 56px; }
@media (max-width: 560px) { .hero.hero-compact { padding: 56px 0 32px; } }

/* ─── Mock balance (página /profissional) ─────────────────────────────── */
.ps-balance {
    text-align: center;
    padding: 14px 12px 16px;
    background: linear-gradient(180deg, #FFF7F2, #FFFFFF);
    border: 1px solid var(--cora-primary-soft);
    border-radius: 12px;
    margin-bottom: 14px;
}
.ps-balance strong {
    display: block;
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--cora-text);
    background: var(--cora-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -0.02em;
    line-height: 1.05;
}
.ps-balance span {
    display: block;
    font-size: 0.66rem;
    color: var(--cora-muted);
    margin-top: 2px;
}

/* ─── Comparativo ético (página /profissional) ────────────────────────── */
.compare-card {
    max-width: 820px;
    margin: 0 auto;
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-xl);
    padding: 36px 40px;
    box-shadow: var(--cora-shadow);
    border-left: 4px solid var(--cora-primary);
}
.compare-intro {
    font-size: 1.04rem;
    line-height: 1.65;
    color: var(--cora-text-soft);
    margin-bottom: 20px;
    padding-bottom: 18px;
    border-bottom: 1px dashed var(--cora-border);
}
.compare-intro strong { color: var(--cora-text); font-weight: 700; }
.compare-cora {
    font-size: 1.04rem;
    line-height: 1.65;
    color: var(--cora-text);
    font-weight: 500;
}
@media (max-width: 560px) {
    .compare-card { padding: 24px 22px; }
    .compare-intro,
    .compare-cora { font-size: 0.96rem; }
}

/* ─── Simulador (página /profissional) ────────────────────────────────── */
.simulator {
    max-width: 920px;
    margin: 0 auto;
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-xl);
    padding: 36px 40px;
    box-shadow: var(--cora-shadow-lg);
}
.sim-controls {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    margin-bottom: 32px;
    padding-bottom: 28px;
    border-bottom: 1px solid var(--cora-border-soft);
}
@media (max-width: 720px) {
    .simulator { padding: 28px 22px; }
    .sim-controls { grid-template-columns: 1fr; gap: 24px; }
}

.sim-control { display: block; }
.sim-label {
    display: block;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: var(--cora-text-soft);
    margin-bottom: 10px;
}
.sim-input-wrap {
    display: flex;
    align-items: baseline;
    gap: 8px;
    background: var(--cora-surface);
    border: 1.5px solid var(--cora-border);
    border-radius: var(--cora-radius);
    padding: 10px 14px;
    margin-bottom: 12px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.sim-input-wrap:focus-within {
    border-color: var(--cora-primary);
    box-shadow: 0 0 0 3px rgba(255,127,80,0.18);
}
.sim-prefix, .sim-suffix {
    font-size: 0.92rem;
    color: var(--cora-text-soft);
    font-weight: 500;
}
.sim-input-wrap input[type=number] {
    flex: 1;
    border: none;
    background: none;
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--cora-text);
    letter-spacing: -0.02em;
    width: 100%;
    -moz-appearance: textfield;
}
.sim-input-wrap input[type=number]::-webkit-outer-spin-button,
.sim-input-wrap input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.sim-control input[type=range] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 6px;
    border-radius: 99px;
    background: var(--cora-border);
    outline: none;
    cursor: pointer;
}
.sim-control input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 22px; height: 22px;
    border-radius: 50%;
    background: var(--cora-gradient);
    border: 3px solid #fff;
    box-shadow: 0 4px 10px rgba(245,106,61,0.4);
    cursor: grab;
}
.sim-control input[type=range]::-moz-range-thumb {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: var(--cora-primary);
    border: 3px solid #fff;
    box-shadow: 0 4px 10px rgba(245,106,61,0.4);
    cursor: grab;
}

.sim-results {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 18px;
    margin-bottom: 24px;
}
@media (max-width: 720px) { .sim-results { grid-template-columns: 1fr; } }

.sim-card {
    background: var(--cora-surface-alt);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-lg);
    padding: 22px 20px;
    position: relative;
    transition: transform 0.2s ease;
}
.sim-card:hover { transform: translateY(-2px); }
.sim-card-cora {
    background: linear-gradient(180deg, #FFFFFF 0%, #FFF7F2 100%);
    border-color: var(--cora-primary);
    border-width: 1.5px;
    box-shadow: 0 12px 28px rgba(245,106,61,0.16);
}
.sim-card-diff {
    background: var(--cora-text);
    color: #fff;
    border-color: transparent;
}
.sim-card-badge {
    position: absolute;
    top: -10px;
    right: 16px;
    background: var(--cora-gradient);
    color: #fff;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 1.2px;
    padding: 4px 10px;
    border-radius: var(--cora-radius-pill);
    text-transform: uppercase;
}
.sim-card-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}
.sim-tag {
    font-size: 0.74rem;
    font-weight: 700;
    color: var(--cora-text-soft);
    text-transform: uppercase;
    letter-spacing: 1px;
}
.sim-card-cora .sim-tag { color: var(--cora-primary-dark); }
.sim-card-diff .sim-tag { color: rgba(255,255,255,0.7); }
.sim-pct {
    font-size: 0.72rem;
    font-weight: 700;
    background: var(--cora-card);
    color: var(--cora-text-soft);
    padding: 3px 10px;
    border-radius: var(--cora-radius-pill);
    border: 1px solid var(--cora-border-soft);
}
.sim-card-cora .sim-pct {
    background: var(--cora-primary-soft);
    color: var(--cora-primary-dark);
    border-color: rgba(245,106,61,0.25);
}
.sim-amount {
    display: block;
    font-size: 1.88rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    line-height: 1.05;
    color: var(--cora-text);
    margin-bottom: 6px;
}
.sim-card-cora .sim-amount {
    background: var(--cora-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.sim-card-diff .sim-amount,
.sim-amount-diff { color: #fff; }
.sim-amount-diff::before { content: ''; }
.sim-sub {
    font-size: 0.84rem;
    color: var(--cora-text-soft);
    line-height: 1.4;
}
.sim-card-diff .sim-sub { color: rgba(255,255,255,0.78); }

.sim-presets {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    margin-bottom: 22px;
}
.sim-preset {
    font-size: 0.86rem;
    font-weight: 600;
    padding: 8px 16px;
    border-radius: var(--cora-radius-pill);
    background: var(--cora-surface);
    color: var(--cora-text-soft);
    border: 1.5px solid var(--cora-border);
    transition: all 0.15s ease;
}
.sim-preset:hover {
    background: var(--cora-primary-soft);
    color: var(--cora-primary-dark);
    border-color: var(--cora-primary);
}
.sim-preset.active {
    background: var(--cora-gradient);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 6px 14px rgba(245,106,61,0.3);
}

.sim-disclaimer {
    font-size: 0.78rem;
    line-height: 1.55;
    color: var(--cora-muted);
    text-align: center;
    max-width: 720px;
    margin: 0 auto;
    padding-top: 22px;
    border-top: 1px dashed var(--cora-border);
}

/* ─── Fineprint (taxas, disclaimers discretos) ────────────────────────── */
.fineprint {
    margin-top: 32px;
    font-size: 0.78rem;
    line-height: 1.55;
    color: var(--cora-muted);
    text-align: center;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

/* ─── Info card (sobre valores - página cliente) ──────────────────────── */
.info-card {
    max-width: 820px;
    margin: 0 auto;
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-xl);
    padding: 32px 36px;
    box-shadow: var(--cora-shadow);
    display: flex;
    gap: 22px;
    align-items: flex-start;
}
.info-icon {
    flex-shrink: 0;
    width: 48px; height: 48px;
    border-radius: 14px;
    background: var(--cora-primary-soft);
    color: var(--cora-primary-dark);
    display: flex; align-items: center; justify-content: center;
}
.info-icon svg { width: 24px; height: 24px; }
.info-title {
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--cora-text);
    margin-bottom: 10px;
    letter-spacing: -0.01em;
}
.info-card p {
    font-size: 0.98rem;
    line-height: 1.6;
    color: var(--cora-text-soft);
    margin-bottom: 12px;
}
.info-card p:last-child { margin-bottom: 0; }
.info-foot {
    font-size: 0.86rem !important;
    color: var(--cora-muted) !important;
    border-top: 1px dashed var(--cora-border);
    padding-top: 12px;
    margin-top: 14px !important;
}
@media (max-width: 560px) {
    .info-card { flex-direction: column; padding: 24px 22px; gap: 16px; }
    .info-title { font-size: 1.2rem; }
}

/* ─── CTA banner (Home final + cliente CTA + profissional CTA) ────────── */
.cta-banner {
    background: linear-gradient(135deg, #FFF7F2 0%, #FFEDE2 100%);
    border: 1px solid var(--cora-primary-soft);
    border-radius: var(--cora-radius-xl);
    padding: 48px 56px;
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 32px;
    align-items: center;
    box-shadow: var(--cora-shadow);
    position: relative;
    overflow: hidden;
}
.cta-banner::before {
    content: '';
    position: absolute;
    top: -120px; right: -100px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(255,127,80,0.16), transparent 65%);
    border-radius: 50%;
    pointer-events: none;
}
.cta-banner > * { position: relative; }
.cta-banner-title {
    font-size: clamp(1.5rem, 2.6vw, 2rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.18;
    color: var(--cora-text);
    margin: 14px 0 12px;
}
.cta-banner-lead {
    font-size: 1rem;
    color: var(--cora-text-soft);
    line-height: 1.55;
}
.cta-banner-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: stretch;
}
.cta-banner-actions .btn { white-space: normal; }

@media (max-width: 720px) {
    .cta-banner { grid-template-columns: 1fr; padding: 32px 24px; gap: 24px; }
}

/* ─── Pricing (planos profissional) ────────────────────────────────────── */
.pricing {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    align-items: stretch;
    /* padding-top deixa espaço pro badge translade -16px do plan-featured
       sem ser clipado por contain/overflow do ancestral. */
    padding-top: 24px;
}
/* Variante "lg" — cards maiores, featured cresce mais */
.pricing-lg {
    grid-template-columns: 1fr 1.1fr 1fr;
    gap: 24px;
    margin-top: 20px;
    padding-top: 28px;
}
@media (max-width: 980px) {
    .pricing,
    .pricing-lg { grid-template-columns: 1fr; gap: 20px; }
}

.plan {
    background: var(--cora-card);
    border: 1.5px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-xl);
    padding: 36px 32px 32px;
    position: relative;
    display: flex;
    flex-direction: column;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.plan:hover { transform: translateY(-4px); box-shadow: var(--cora-shadow); }

/* Card secundário (Pro / Plus): altura natural */
.plan-secondary { padding-top: 32px; }
.plan-secondary .plan-features { margin-bottom: 20px; }

/* Card destaque (Básico no centro): bigger, mais respiro */
.plan-featured {
    border-color: var(--cora-primary);
    box-shadow: 0 24px 56px rgba(245,106,61,0.22);
    transform: translateY(-12px);
    padding: 48px 36px 38px;
    background: linear-gradient(180deg, #FFFFFF 0%, #FFF7F2 100%);
}
.plan-featured:hover { transform: translateY(-16px); box-shadow: 0 28px 64px rgba(245,106,61,0.28); }
.plan-featured .plan-name {
    font-size: 1rem;
    color: var(--cora-primary-dark);
}
.plan-featured .plan-price {
    font-size: 3.6rem;
}
.plan-featured .plan-fee   { font-size: 1.05rem; }
.plan-featured .plan-features li { font-size: 1rem; }

@media (max-width: 980px) {
    .plan-featured { transform: none; padding: 44px 32px 32px; }
    .plan-featured:hover { transform: translateY(-4px); }
}

.plan-badge {
    position: absolute;
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--cora-gradient);
    color: #fff;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 1.2px;
    padding: 7px 18px;
    border-radius: var(--cora-radius-pill);
    text-transform: uppercase;
    box-shadow: 0 8px 20px rgba(245,106,61,0.36);
    white-space: nowrap;
}

.plan-price-free {
    background: var(--cora-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.plan-name {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    color: var(--cora-primary-dark);
    margin-bottom: 8px;
}
.plan-price {
    font-size: 2.4rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    line-height: 1;
    color: var(--cora-text);
    display: flex;
    align-items: baseline;
    gap: 6px;
}
.plan-price small {
    font-size: 0.92rem;
    font-weight: 500;
    color: var(--cora-muted);
}
.plan-fee {
    margin-top: 10px;
    font-size: 0.92rem;
    color: var(--cora-text-soft);
    padding-bottom: 22px;
    border-bottom: 1px dashed var(--cora-border);
}
.plan-fee strong { color: var(--cora-text); font-weight: 700; }
.plan-target {
    margin-top: 6px;
    margin-bottom: 24px;
    font-size: 0.85rem;
    color: var(--cora-muted);
    font-weight: 500;
}
.plan > .btn { margin-top: auto; }
.plan-features { flex: 1; }
.plan-features {
    list-style: none;
    margin: 16px 0 24px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.plan-features li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.92rem;
    color: var(--cora-text-soft);
}
.plan-features svg {
    width: 16px; height: 16px;
    flex-shrink: 0;
    margin-top: 3px;
    color: var(--cora-primary);
}

.pricing-note {
    margin-top: 32px;
    text-align: center;
    font-size: 0.86rem;
    color: var(--cora-muted);
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

/* Cliente fee callout */
.client-fee {
    margin-top: 32px;
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-lg);
    padding: 24px 28px;
    display: flex;
    align-items: center;
    gap: 20px;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}
.client-fee .cf-icon {
    width: 48px; height: 48px;
    border-radius: 14px;
    background: var(--cora-primary-soft);
    color: var(--cora-primary-dark);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.client-fee .cf-icon svg { width: 24px; height: 24px; }
.client-fee strong { display: block; font-size: 1.05rem; margin-bottom: 4px; color: var(--cora-text); }
.client-fee span { font-size: 0.92rem; color: var(--cora-text-soft); line-height: 1.5; }

/* ─── Parcerias ────────────────────────────────────────────────────────── */
.partner-banner {
    background: var(--cora-text);
    color: #fff;
    border-radius: var(--cora-radius-xl);
    padding: 56px;
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 40px;
    align-items: center;
    position: relative;
    overflow: hidden;
}
.partner-banner::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 360px; height: 360px;
    background: radial-gradient(circle, rgba(255,127,80,0.32), transparent 60%);
    border-radius: 50%;
}
.partner-banner > * { position: relative; z-index: 1; }
.partner-banner h3 {
    font-size: clamp(1.65rem, 2.6vw, 2.2rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.15;
    margin-bottom: 14px;
}
.partner-banner p {
    color: rgba(255,255,255,0.78);
    font-size: 1.02rem;
    line-height: 1.6;
    margin-bottom: 22px;
    max-width: 540px;
}
.partner-banner .pb-cta { display: flex; flex-wrap: wrap; gap: 12px; }
.partner-banner .btn-secondary {
    background: #fff;
    color: var(--cora-primary-dark);
    border-color: #fff;
}
.partner-banner .btn-secondary:hover { background: var(--cora-primary-soft); }
.partner-banner .btn-ghost {
    color: #fff;
    border-color: rgba(255,255,255,0.32);
}
.partner-banner .btn-ghost:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.6); }

/* ─── Download apps ────────────────────────────────────────────────────── */
.downloads {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}
.download-card {
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-xl);
    padding: 36px;
    text-align: center;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.download-card:hover { transform: translateY(-3px); box-shadow: var(--cora-shadow); }
.download-card .dc-icon {
    width: 64px; height: 64px;
    border-radius: 18px;
    background: var(--cora-gradient);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 18px;
    box-shadow: 0 10px 24px rgba(245,106,61,0.28);
}
.download-card .dc-icon svg { width: 32px; height: 32px; }
.download-card h3 {
    font-size: 1.25rem;
    font-weight: 800;
    margin-bottom: 6px;
}
.download-card p {
    font-size: 0.95rem;
    color: var(--cora-text-soft);
    margin-bottom: 22px;
    line-height: 1.55;
}
.store-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}
.store-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--cora-text);
    color: #fff;
    padding: 10px 18px;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 600;
    transition: background 0.15s ease, transform 0.15s ease;
}
.store-btn:hover { background: #000; transform: translateY(-1px); }
.store-btn svg { width: 22px; height: 22px; flex-shrink: 0; }
.store-btn small {
    display: block;
    font-size: 0.66rem;
    font-weight: 500;
    opacity: 0.78;
    line-height: 1.1;
}
.store-btn b { display: block; font-size: 0.92rem; line-height: 1.1; font-weight: 700; }

/* ─── Contato ──────────────────────────────────────────────────────────── */
.contact-grid {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: 56px;
    align-items: start;
}
.contact-info { display: flex; flex-direction: column; gap: 18px; }
.contact-info .ci-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius);
    padding: 16px 18px;
    transition: border-color 0.2s ease, transform 0.2s ease;
}
.contact-info .ci-item:hover { border-color: var(--cora-primary); transform: translateY(-2px); }
.contact-info .ci-icon {
    width: 40px; height: 40px;
    border-radius: 11px;
    background: var(--cora-primary-soft);
    color: var(--cora-primary-dark);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.contact-info .ci-icon svg { width: 20px; height: 20px; }
.contact-info strong { display: block; font-size: 0.92rem; font-weight: 700; margin-bottom: 2px; }
.contact-info span { font-size: 0.88rem; color: var(--cora-text-soft); }

.contact-form {
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius-xl);
    padding: 32px;
    box-shadow: var(--cora-shadow);
}
.form-row { margin-bottom: 18px; }
.form-row.split { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-row label {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--cora-text);
    margin-bottom: 6px;
}
.form-row input,
.form-row select,
.form-row textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1.5px solid var(--cora-border);
    border-radius: var(--cora-radius-sm);
    background: var(--cora-card);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    font-size: 0.95rem;
}
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus {
    outline: none;
    border-color: var(--cora-primary);
    box-shadow: 0 0 0 3px rgba(255,127,80,0.18);
}
.form-row textarea { resize: vertical; min-height: 110px; }
/* Captcha matemático — pergunta destacada acima do campo */
.captcha-row .captcha-label {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 6px;
    font-size: 0.92rem;
}
.captcha-row .captcha-label strong {
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--cora-primary-dark);
    letter-spacing: 0.5px;
    background: var(--cora-primary-soft);
    padding: 4px 12px;
    border-radius: 8px;
}
.captcha-row .captcha-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    color: var(--cora-success);
    background: var(--cora-success-soft);
    padding: 4px 10px;
    border-radius: 99px;
}
.captcha-row .captcha-tag svg { color: var(--cora-success); }
.captcha-row input { max-width: 200px; }

.form-feedback {
    margin-top: 14px;
    font-size: 0.88rem;
    padding: 10px 14px;
    border-radius: 10px;
    display: none;
}
.form-feedback.success { display: block; background: var(--cora-success-soft); color: var(--cora-success); }
.form-feedback.error   { display: block; background: var(--cora-danger-soft);  color: var(--cora-danger); }

/* ─── FAQ ─────────────────────────────────────────────────────────────── */
.faq-list {
    max-width: 820px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.faq-item {
    background: var(--cora-card);
    border: 1px solid var(--cora-border-soft);
    border-radius: var(--cora-radius);
    overflow: hidden;
    transition: border-color 0.2s ease;
}
.faq-item[open] { border-color: var(--cora-primary-soft); }
.faq-item summary {
    list-style: none;
    cursor: pointer;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    font-weight: 600;
    font-size: 1rem;
    color: var(--cora-text);
    user-select: none;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
    content: '';
    width: 20px; height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F56A3D' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}
.faq-item[open] summary::after { transform: rotate(180deg); }
.faq-item .faq-body {
    padding: 0 24px 22px;
    font-size: 0.95rem;
    color: var(--cora-text-soft);
    line-height: 1.65;
}

/* ─── Footer ──────────────────────────────────────────────────────────── */
.site-footer {
    background: var(--cora-text);
    color: rgba(255,255,255,0.74);
    padding: 72px 0 28px;
    font-size: 0.92rem;
}
.footer-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 48px;
    margin-bottom: 56px;
}
.footer-brand .brand { color: #fff; margin-bottom: 16px; }
.footer-brand .brand .brand-mark { background: rgba(255,255,255,0.08); }
.footer-brand p {
    color: rgba(255,255,255,0.62);
    line-height: 1.6;
    max-width: 320px;
    font-size: 0.9rem;
}
.footer-col h4 {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    color: #fff;
    margin-bottom: 16px;
}
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-col a { color: rgba(255,255,255,0.66); transition: color 0.15s ease; }
.footer-col a:hover { color: var(--cora-primary-light); }

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.08);
    padding-top: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    color: rgba(255,255,255,0.5);
    font-size: 0.84rem;
}
.footer-social { display: flex; gap: 10px; }
.footer-social a {
    width: 36px; height: 36px;
    border-radius: 10px;
    background: rgba(255,255,255,0.06);
    display: flex; align-items: center; justify-content: center;
    color: rgba(255,255,255,0.74);
    transition: background 0.15s ease, color 0.15s ease;
}
.footer-social a:hover { background: var(--cora-primary); color: #fff; }
.footer-social svg { width: 18px; height: 18px; }

/* ─── Reveal-on-scroll ────────────────────────────────────────────────── */
.reveal {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 0.6s ease, transform 0.6s ease;
    will-change: opacity, transform;
}
.reveal.visible { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transform: none; transition: none; }
    html { scroll-behavior: auto; }
}

/* ─── Responsivo ──────────────────────────────────────────────────────── */
@media (max-width: 980px) {
    .section { padding: 64px 0; }
    .nav-primary, .header-cta .btn-secondary, .header-cta .btn-primary { display: none; }
    .header-cta { display: none; }
    .menu-toggle { display: inline-flex; }
    .mobile-menu { display: block; }
    .hero { padding: 56px 0 72px; }
    .hero-grid { grid-template-columns: 1fr; gap: 48px; }
    .hero-visual { margin-left: 0; max-width: 460px; margin-right: auto; }
    .map-grid { grid-template-columns: 1fr; gap: 40px; }
    .audience { grid-template-columns: 1fr; }
    .pricing { grid-template-columns: 1fr; }
    .plan.featured { transform: none; }
    .partner-banner { grid-template-columns: 1fr; padding: 40px; }
    .downloads { grid-template-columns: 1fr; }
    .contact-grid { grid-template-columns: 1fr; gap: 32px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}

@media (max-width: 560px) {
    .container { padding: 0 18px; }
    .section { padding: 56px 0; }
    .hero-card { padding: 14px; }
    .hero-card-1 { width: 70%; }
    .hero-card-2 { width: 70%; }
    .hero-card-3 { width: 60%; }
    .audience-card { padding: 28px 24px; }
    .partner-banner { padding: 32px 24px; }
    .download-card { padding: 28px 22px; }
    .contact-form { padding: 24px; }
    .form-row.split { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; gap: 32px; margin-bottom: 40px; }
    .footer-bottom { flex-direction: column; align-items: flex-start; }
    .map-cities { grid-template-columns: 1fr; }
    .btn { padding: 12px 18px; }
    .btn-lg { padding: 14px 22px; }
    .hero-cta { width: 100%; }
    .hero-cta .btn { flex: 1; min-width: 140px; }
    .hero-pills li { font-size: 0.78rem; padding: 5px 12px; }
}

/* ═══ Telas grandes (1280–1599) ═════════════════════════════════════════ */
@media (min-width: 1280px) {
    :root { --cora-container: 1240px; }
    .section { padding: 104px 0; }
    .hero { padding: 112px 0 128px; }
    .map-wrap { max-width: 620px; }
}

/* ═══ Wide / 4K parcial (1600–1919) ═════════════════════════════════════ */
@media (min-width: 1600px) {
    :root { --cora-container: 1320px; }
    .section { padding: 120px 0; }
    .hero { padding: 128px 0 144px; }
    .hero-grid { gap: 80px; }
    .hero-visual { max-width: 580px; }
    .map-wrap { max-width: 680px; }
    .features { gap: 24px; }
}

/* ═══ TV / 4K nativo (1920+) ════════════════════════════════════════════ */
@media (min-width: 1920px) {
    :root {
        --cora-container: 1440px;
        --cora-header-h: 84px;
    }
    body { font-size: 18px; }
    .section { padding: 144px 0; }
    .hero { padding: 144px 0 168px; }
    .section-title { max-width: 820px; }
    .hero-lead { max-width: 620px; font-size: 1.22rem; }
    .map-wrap { max-width: 760px; }
    .audience-card,
    .partner-banner { padding: 56px; }
    .features,
    .steps {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* ═══ Ultra-wide / TV gigante (2400+) ═══════════════════════════════════ */
@media (min-width: 2400px) {
    :root { --cora-container: 1560px; }
    .hero-title { max-width: 14ch; }
}

/* ═══ Touch refinements (touch-only devices) ═══════════════════════════ */
@media (hover: none) and (pointer: coarse) {
    .btn { min-height: 44px; }       /* WCAG 2.5.5 — alvo mínimo de toque */
    .nav-primary a { min-height: 44px; display: inline-flex; align-items: center; }
    .faq-item summary { min-height: 56px; }
    .hero-card { transform: none !important; }  /* sem rotação no toque, evita visual estranho */
}

/* ═══ Print (gera material limpo se imprimirem) ═════════════════════════ */
@media print {
    .site-header, .menu-toggle, .mobile-menu, .map-controls,
    .hero-cta, .ac-cta, .pb-cta, .store-buttons, .contact-form,
    .footer-social, .map-status { display: none !important; }
    .hero, .section { padding: 24px 0; }
    body { color: #000; background: #fff; }
    a { color: #000; text-decoration: underline; }
    .audience-card.coral, .partner-banner { background: #fff !important; color: #000 !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   MOBILE — fix do drawer (menu hambúrguer ficando atrás dos cards)
   ───────────────────────────────────────────────────────────────────────
   Causa raiz: .site-header tem `backdrop-filter: blur(...)`, que pelo
   spec do CSS cria um containing block pra descendentes `position: fixed`.
   Isso prende o .mobile-menu DENTRO do header (em vez de relativo ao
   viewport), e o stacking context fica capado pelo z-index do header.
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 980px) {
    .site-header {
        /* Remove o backdrop-filter no mobile — o drawer volta a ser fixed
           relativo ao viewport. Compensamos o efeito visual aumentando
           levemente a opacidade do background. */
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(255,255,255,0.97);
    }
    /* Drawer com z-index alto pra ficar acima de TUDO — cards do hero,
       sticky CTA, blobs do mapa, etc. */
    .mobile-menu {
        z-index: 200 !important;
    }
    /* Header também sobe pra acompanhar (acima de todos os outros
       stacking contexts da página) */
    .site-header {
        z-index: 200 !important;
    }
}

/* ═══════════════════════════════════════════════════════════════════════
   MOBILE — refino final (CTAs em coluna + ícones centralizados)
   Carregado por último pra garantir prioridade sobre regras anteriores.
   ═══════════════════════════════════════════════════════════════════════ */

@media (max-width: 720px) {
    /* ─── CTAs sempre EMPILHADOS no mobile ─────────────────────────────
       Hero, sections de CTA, audience-card e partner-banner: cada botão
       em uma linha com gap vertical de 10px. */
    .hero-cta,
    .cta-row,
    .ac-cta,
    .pb-cta,
    .cta-banner-actions {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100%;
    }
    .hero-cta .btn,
    .cta-row .btn,
    .ac-cta .btn,
    .pb-cta .btn,
    .cta-banner-actions .btn {
        flex: none !important;
        width: 100%;
        min-width: 0;
        justify-content: center;
        white-space: normal;
    }

    /* Footnotes que vinham na mesma linha do CTA-row vão pra baixo,
       centralizadas */
    .cta-row .cta-foot {
        margin-left: 0;
        text-align: center;
        margin-top: 4px;
    }
}

@media (max-width: 560px) {
    /* ─── Ícones de cards centralizados no mobile ──────────────────────
       Cards de benefit / audience / feature alinham conteúdo ao centro
       pra ficar mais respirado e equilibrado em telas pequenas. */
    .benefit,
    .audience-card,
    .feature,
    .step,
    .pain-card {
        text-align: center;
    }
    .bn-icon,
    .ac-icon,
    .feature-icon,
    .step-num,
    .info-icon {
        margin-left: auto;
        margin-right: auto;
    }
    /* Listas internas voltam pra texto-left pra leitura confortável */
    .ac-list,
    .pain-list,
    .plan-features {
        text-align: left;
    }
    /* Pain-card mantém o link "A CoraLink resolve isso →" centralizado */
    .pain-link { align-self: center; }

    /* Step com numeração: também centralizada */
    .step-title { text-align: center; }
    .step-text  { text-align: center; }

    /* CTA banner — quando vira coluna, alinha tudo central */
    .cta-banner > div:first-child { text-align: center; }
}
