/**
 * PÁGINA INICIAL - MURICY CONSULTORIA
 * CSS enxuto e otimizado
 */

/* Animações - Refinadas para elegância e coerência */
@keyframes fadeInUp{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideInRight{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}

/* Linhas de conexão fluindo */
@keyframes flowLine{
    0%{stroke-dashoffset:0;opacity:0.2}
    50%{opacity:0.4}
    100%{stroke-dashoffset:-20;opacity:0.2}
}

/* Blobs de fundo do hero flutuando lentamente */
@keyframes floatBlobA{
    0%,100%{transform:translate(0,0) scale(1)}
    50%{transform:translate(-40px,30px) scale(1.08)}
}
@keyframes floatBlobB{
    0%,100%{transform:translate(0,0) scale(1)}
    50%{transform:translate(30px,-25px) scale(1.1)}
}
@keyframes driftGrid{
    0%{transform:translate(0,0)}
    100%{transform:translate(-34px,-34px)}
}

/* ============================================
   HERO PREMIUM - Layout Grandioso
   ============================================ */

.hero-premium{
    padding:calc(var(--header-height) + 20px) 0 100px;
    background:linear-gradient(180deg, #f8fafc 0%, #ffffff 50%, #f1f5f9 100%);
    position:relative;
    overflow:hidden;
    min-height:90vh;
    display:flex;
    align-items:center;
    margin-top:0;
}

.hero-premium::before{
    content:'';
    position:absolute;
    top:-220px;
    right:-150px;
    width:750px;
    height:750px;
    background:radial-gradient(circle, rgba(0,173,186,0.22) 0%, rgba(0,173,186,0.08) 45%, transparent 70%);
    border-radius:50%;
    pointer-events:none;
    animation:floatBlobA 16s ease-in-out infinite;
    will-change:transform;
    filter:blur(10px);
}

.hero-premium::after{
    content:'';
    position:absolute;
    bottom:-150px;
    left:-100px;
    width:550px;
    height:550px;
    background:radial-gradient(circle, rgba(0,138,149,0.2) 0%, rgba(0,138,149,0.06) 45%, transparent 70%);
    border-radius:50%;
    pointer-events:none;
    animation:floatBlobB 20s ease-in-out infinite;
    will-change:transform;
    filter:blur(10px);
}

.hero-bg-gradient{
    position:absolute;
    top:-40px;
    left:-40px;
    right:-40px;
    bottom:-40px;
    background:
        radial-gradient(circle at 60% 35%, rgba(0,173,186,0.1) 0%, transparent 50%),
        radial-gradient(circle 1.5px at center, rgba(0,90,98,0.35) 1.5px, transparent 1.5px);
    background-size:auto, 34px 34px;
    animation:driftGrid 24s linear infinite;
    pointer-events:none;
    will-change:transform;
    mask-image:linear-gradient(180deg, #000 0%, #000 75%, transparent 100%);
    -webkit-mask-image:linear-gradient(180deg, #000 0%, #000 75%, transparent 100%);
}

.hero-premium .container{
    position:relative;
    z-index:1;
    max-width:1280px;
}

.hero-premium .hero-content{
    display:grid;
    grid-template-columns:1.1fr 1fr;
    gap:80px;
    align-items:center;
    position:relative;
    z-index:2;
}

/* ============================================
   HERO LEFT - Conteúdo Principal
   ============================================ */

.hero-premium .hero-left{
    animation:fadeInUp 0.8s ease-out;
    text-align:left;
}

/* Badge/Eyebrow Premium - Margem ajustada */
.hero-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:rgba(0,173,186,0.08);
    padding:8px 16px;
    border-radius:50px;
    color:var(--primary);
    font-weight:600;
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:1.5px;
    margin-bottom:24px;
    border:1px solid rgba(0,173,186,0.15);
}

.badge-dot{
    width:8px;
    height:8px;
    background:var(--primary);
    border-radius:50%;
    animation:pulse 2s ease-in-out infinite;
}

/* Título Premium - Ajustado para equilíbrio */
.hero-title-premium{
    font-size:clamp(2.25rem, 2.9vw, 3.25rem);
    font-weight:700;
    color:var(--text);
    margin-bottom:20px;
    line-height:1.2;
    letter-spacing:-0.01em;
    max-width:640px;
    text-wrap:balance;
}

.hero-title-premium .text-gradient{
    background:var(--gradient-primary);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}

/* Subtítulo Premium - Ajustado para melhor respiro */
.hero-subtitle-premium{
    font-size:clamp(1.1rem, 1.6vw, 1.25rem);
    color:var(--text-muted);
    margin-bottom:36px;
    line-height:1.65;
    max-width:500px;
}

/* CTAs Premium - Lado a lado no desktop */
.hero-cta-premium{
    display:flex;
    gap:16px;
    align-items:center;
}

/* Botões CTAs Premium */
.btn-cta-primary{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:16px 32px;
    background:var(--primary);
    color:var(--white);
    text-decoration:none;
    font-size:15px;
    font-weight:600;
    border-radius:10px;
    border:2px solid var(--primary);
    transition:all 0.25s ease;
    box-shadow:0 4px 14px rgba(0,173,186,0.3);
}

.btn-cta-primary:hover{
    background:var(--primary-dark);
    border-color:var(--primary-dark);
    transform:translateY(-2px);
    box-shadow:0 8px 24px rgba(0,173,186,0.4);
}

.btn-cta-secondary{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:16px 32px;
    background:transparent;
    color:var(--text);
    text-decoration:none;
    font-size:15px;
    font-weight:600;
    border-radius:10px;
    border:2px solid var(--border);
    transition:all 0.25s ease;
}

.btn-cta-secondary:hover{
    background:var(--white);
    border-color:var(--primary);
    color:var(--primary);
    transform:translateY(-2px);
    box-shadow:0 4px 12px rgba(0,0,0,0.08);
}

/* ============================================
   HERO RIGHT - Dashboard Premium Animado
   ============================================ */

.hero-right{
    animation:slideInRight 0.9s ease-out 0.2s both;
    position:relative;
}

.hero-dashboard{
    position:relative;
    width:100%;
    min-height:420px;
    background:linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
    border-radius:24px;
    padding:24px;
    box-shadow:
        0 20px 60px rgba(0,0,0,0.08),
        0 8px 24px rgba(0,0,0,0.04),
        inset 0 1px 0 rgba(255,255,255,0.8);
    border:1px solid rgba(0,173,186,0.1);
    overflow:visible;
    display:flex;
    flex-direction:column;
    gap:16px;
}

/* Gráfico Principal */
.dashboard-main-chart{
    background:linear-gradient(135deg, rgba(0,173,186,0.05) 0%, rgba(0,138,149,0.02) 100%);
    border-radius:16px;
    padding:20px;
    border:1px solid rgba(0,173,186,0.1);
    position:relative;
    z-index:2;
    flex:1;
    display:flex;
    flex-direction:column;
}

.chart-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:16px;
}

.chart-label{
    font-size:13px;
    font-weight:600;
    color:var(--text-muted);
    text-transform:uppercase;
    letter-spacing:0.5px;
}

.chart-value{
    font-size:18px;
    font-weight:700;
    color:var(--primary);
}

.chart-line{
    width:100%;
    flex:1;
    min-height:120px;
}

.chart-line-path{
    stroke-dasharray:1000;
    stroke-dashoffset:1000;
    animation:drawChartLine 2s ease-out forwards;
}

.chart-area{
    opacity:0;
    transform-origin:bottom;
    transform:scaleY(0.85);
    animation:revealChartArea 1.4s ease-out 0.35s forwards;
}

/* Pontos do gráfico - sincronizados com o desenho da linha */
.chart-point{
    opacity:0;
    transform-box:fill-box;
    transform-origin:center;
    animation:showPoint 0.45s ease-out forwards;
}

.point-1{animation-delay:0.65s}
.point-2{animation-delay:1s}
.point-3{animation-delay:1.35s}
.point-final{animation-delay:1.7s}

@keyframes drawChartLine{
    to{stroke-dashoffset:0}
}

@keyframes revealChartArea{
    to{
        opacity:1;
        transform:scaleY(1);
    }
}

@keyframes showPoint{
    0%{
        opacity:0;
        transform:scale(0.65);
    }
    100%{
        opacity:1;
        transform:scale(1);
    }
}

/* Cards de Métricas - Posicionamento Integrado */
.metric-card{
    position:absolute;
    background:var(--white);
    border-radius:10px;
    padding:12px 16px;
    box-shadow:0 4px 16px rgba(0,0,0,0.08);
    border:1px solid rgba(0,173,186,0.1);
    display:flex;
    align-items:center;
    gap:10px;
    opacity:0;
    transform:translateY(20px);
    animation:cardEnter 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    z-index:10;
    transition:box-shadow 0.25s ease;
    will-change:transform;
    backface-visibility:hidden;
}

.metric-card:hover{
    box-shadow:0 8px 24px rgba(0,0,0,0.12);
}

/* Card 1: Receita - Topo direito sobre o gráfico */
.metric-card-1{
    top:20px;
    right:20px;
    animation:cardEnter 0.6s cubic-bezier(0.4, 0, 0.2, 1) 1s forwards,
              cardFloat 2.6s cubic-bezier(0.45,0,0.55,1) 1.6s infinite;
}

/* Card 2: Ocupação - Meio direito entre gráfico e barras (alinhado com card-3) */
.metric-card-2{
    top:230px;
    right:40px;
    left:auto;
    bottom:auto;
    animation:cardEnter 0.6s ease 1.2s forwards,
              cardFloat 2.9s cubic-bezier(0.45,0,0.55,1) 1.8s infinite;
    z-index:10;
}

/* Card 3: Pacientes - Meio esquerdo entre gráfico e barras (alinhado com card-2) */
.metric-card-3{
    top:230px;
    left:20px;
    right:auto;
    bottom:auto;
    animation:cardEnter 0.6s ease 1.4s forwards,
              cardFloat 3.2s cubic-bezier(0.45,0,0.55,1) 2s infinite;
    z-index:10;
}

@keyframes cardEnter{
    to{
        opacity:1;
        transform:translateY(0);
    }
}

@keyframes cardIn{
    0%{
        opacity:0;
        transform:translateY(12px);
    }
    100%{
        opacity:1;
        transform:translateY(0);
    }
}

@keyframes cardEnterCenter{
    0%{
        opacity:0;
        transform:translateY(-50%) translateY(30px);
    }
    100%{
        opacity:1;
        transform:translateY(-50%) translateY(0);
    }
}

/* Micro flutuação sutil após entrada */
@keyframes cardFloat{
    0%, 100%{transform:translateY(0);}
    50%{transform:translateY(-7px);}
}

@keyframes cardFloatCenter{
    0%, 100%{transform:translateY(-50%);}
    50%{transform:translateY(calc(-50% - 4px));}
}

.metric-icon{
    width:36px;
    height:36px;
    background:linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
    border-radius:10px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--white);
    font-size:14px;
    flex-shrink:0;
}

.metric-icon.icon-secondary{
    background:linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%);
}

.metric-icon.icon-tertiary{
    background:linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
}

.metric-info{
    display:flex;
    flex-direction:column;
}

.metric-number-dashboard{
    font-size:15px;
    font-weight:700;
    color:var(--text);
    line-height:1.2;
}

.metric-label-dashboard{
    font-size:11px;
    color:var(--text-muted);
    font-weight:500;
}

.metric-trend{
    display:flex;
    align-items:center;
    gap:3px;
    font-size:11px;
    font-weight:600;
    padding:3px 6px;
    border-radius:20px;
    margin-left:auto;
}

.trend-up{
    color:#10b981;
    background:rgba(16,185,129,0.1);
}

/* Barras de Performance */
.performance-bars{
    background:var(--white);
    border-radius:12px;
    padding:16px 20px;
    box-shadow:0 2px 8px rgba(0,0,0,0.03);
    border:1px solid rgba(0,0,0,0.06);
    position:relative;
    z-index:5;
    margin-top:24px;
}

.bar-item{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:14px;
}

.bar-item:last-child{
    margin-bottom:0;
}

.bar-label{
    font-size:13px;
    font-weight:600;
    color:var(--text-muted);
    width:90px;
    flex-shrink:0;
}

.bar-track{
    flex:1;
    height:8px;
    background:var(--border);
    border-radius:4px;
    overflow:hidden;
}

.bar-fill{
    height:100%;
    border-radius:4px;
    background:linear-gradient(90deg, var(--primary) 0%, var(--primary-dark) 100%);
    transform-origin:left center;
    transform:scaleX(0);
    animation:fillBar 1s ease-out 1.2s forwards;
}

@keyframes fillBar{
    to{transform:scaleX(1)}
}

.bar-gestao{--target-width:92%;width:92%;animation-delay:1.4s}
.bar-tiss{--target-width:88%;width:88%;animation-delay:1.55s}
.bar-fat{--target-width:95%;width:95%;animation-delay:1.7s}

.bar-value{
    font-size:13px;
    font-weight:700;
    color:var(--text);
    width:40px;
    text-align:right;
}

/* Elementos Decorativos - REMOVIDOS para limpar visual */
.connection-lines,
.pulse-dot{
    display:none;
}

/* ============================================
   RESPONSIVIDADE - Hero Premium
   ============================================ */

@media (max-width:1024px){
    .hero-premium .hero-content{
        grid-template-columns:1fr;
        gap:60px;
        text-align:center;
    }
    
    .hero-premium .hero-left{
        text-align:center;
    }
    
    .hero-subtitle-premium{
        margin-left:auto;
        margin-right:auto;
    }
    
    .hero-cta-premium{
        justify-content:center;
    }
    
    .hero-dashboard{
        max-width:500px;
        margin:0 auto;
    }
    
    .metric-card{
        position:relative;
        right:auto;
        top:auto;
        margin-bottom:16px;
        animation:none;
        opacity:1;
        transform:none;
    }

    .metric-card-1,
    .metric-card-2,
    .metric-card-3{
        transform:none;
    }
    
    .pulse-dot,
    .connection-lines{
        display:none;
    }
}

@media (max-width:768px){
    .hero-premium{
        padding:100px 0 60px;
        min-height:auto;
    }
    
    .hero-title-premium{
        font-size:clamp(2rem, 8vw, 2.5rem);
    }
    
    .hero-subtitle-premium{
        font-size:1.1rem;
    }
    
    .hero-cta-premium{
        flex-direction:column;
        gap:12px;
    }
    
    .btn-cta-primary,
    .btn-cta-secondary{
        width:100%;
        max-width:320px;
    }
    
    .hero-dashboard{
        min-height:auto;
        padding:24px;
    }
    
    .metric-card{
        padding:14px 16px;
    }
    
    .metric-icon{
        width:38px;
        height:38px;
        font-size:16px;
    }
    
    .metric-number-dashboard{
        font-size:16px;
    }
}

@media (max-width:480px){
    .hero-badge{
        font-size:12px;
        padding:6px 12px;
    }
    
    .hero-dashboard{
        padding:20px;
    }
    
    .dashboard-main-chart{
        padding:16px;
    }
    
    .performance-bars{
        padding:16px;
    }
    
    .bar-label{
        width:70px;
        font-size:12px;
    }
}


/* ============================================
   TICKER BAR - Faixa de credibilidade em gradiente
   ============================================ */

.ticker-bar{
    padding:0;
    background:var(--gradient-primary);
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:64px;
}

.ticker-bar-marquee{
    position:relative;
    width:100%;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
}

.ticker-bar-track{
    display:flex;
    align-items:center;
    justify-content:center;
    width:max-content;
    animation:marqueeScroll 30s linear infinite;
    will-change:transform;
}

.ticker-bar-marquee:hover .ticker-bar-track{
    animation-play-state:paused;
}

/* Keyframes da animação - desloca 16.67% para loop contínuo (6 cópias) */
@keyframes marqueeScroll{
    0%{
        transform:translateX(0);
    }
    100%{
        transform:translateX(-16.666%);
    }
}

.ticker-bar-item{
    flex:0 0 auto;
    padding:var(--space-md) var(--space-md);
    white-space:nowrap;
    font-size:var(--text-sm);
    font-weight:700;
    color:var(--white);
    text-transform:uppercase;
    letter-spacing:0.04em;
}

.ticker-bar-dot{
    color:rgba(255,255,255,0.5);
    font-size:var(--text-sm);
}

/* Responsividade */
@media (max-width:768px){
    .ticker-bar-item{
        padding:var(--space-sm) var(--space-sm);
        font-size:var(--text-xs);
    }

    /* Velocidade ligeiramente diferente em mobile */
    .ticker-bar-track{
        animation-duration:25s;
    }
}

/* Institucional - declaração editorial + pilares de apoio */
.institucional{padding:var(--section-xl);background:var(--white)}
.institucional-statement{max-width:800px;margin:0 auto;text-align:center}
.institucional-statement h2{font-size:var(--title-section);font-weight:700;color:var(--text);margin-bottom:var(--space-lg);line-height:1.2}
.institucional-statement p{font-size:var(--text-lg);color:var(--text-muted);line-height:1.7}

.institucional-pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg);max-width:1000px;margin:var(--space-2xl) auto 0}
.institucional-block{background:var(--gradient-soft);padding:var(--space-lg);border-radius:var(--radius-md);border-left:3px solid var(--primary);box-shadow:var(--shadow-xs);transition:transform var(--transition-base),box-shadow var(--transition-base)}
.institucional-block:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm)}
.institucional-block h4{font-size:var(--text-lg);font-weight:700;color:var(--primary);margin-bottom:var(--space-md)}
.institucional-block p{font-size:var(--text-base);color:var(--text-muted);line-height:1.5}

/* Problema x Solução - grid de cards numerados */
.problema-solucao{padding:var(--section-lg);background:var(--mist)}
.problem-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-lg);max-width:1000px;margin:var(--space-xl) auto 0}

.problem-card{position:relative;background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-xl) calc(var(--space-lg) + 40px) var(--space-xl) var(--space-lg);box-shadow:var(--shadow-xs);transition:transform var(--transition-base),box-shadow var(--transition-base)}
.problem-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm)}

.problem-card-index{position:absolute;top:var(--space-lg);right:var(--space-lg);font-family:var(--font-mono);font-size:var(--text-lg);font-weight:700;color:var(--border);line-height:1}

.problem-card-problema,
.problem-card-solucao{display:flex;align-items:flex-start;gap:12px;font-size:var(--text-base);line-height:1.5;margin:0}
.problem-card-problema{color:var(--text-muted);margin-bottom:var(--space-md)}
.problem-card-solucao{color:var(--text);font-weight:600}

.problem-card-problema i,
.problem-card-solucao i{flex:none;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;margin-top:2px}
.problem-card-problema i{background:#c0392b;color:var(--white)}
.problem-card-solucao i{background:var(--primary);color:var(--white)}

/* Oferta - showcase em abas */
.oferta{padding:var(--section-lg)}

.tabs{max-width:900px;margin:var(--space-xl) auto 0}

.tab-pills{display:flex;justify-content:center;gap:var(--space-sm);flex-wrap:wrap;margin-bottom:var(--space-xl)}
.tab-pill{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:var(--radius-full);border:1px solid rgba(255,255,255,0.3);background:rgba(255,255,255,0.1);color:rgba(255,255,255,0.85);font-weight:600;font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-fast)}
.tab-pill:hover{border-color:var(--white);color:var(--white);background:rgba(255,255,255,0.18)}
.tab-pill.is-active{background:var(--white);border-color:transparent;color:var(--primary-dark);box-shadow:0 4px 15px rgba(0,0,0,0.15)}

.tab-panel{display:none;background:var(--gradient-soft);border-radius:var(--radius-lg);padding:var(--space-2xl);text-align:center;box-shadow:0 20px 50px rgba(0,0,0,0.15)}
.tab-panel.is-active{display:block}
.tab-panel h3{font-size:var(--title-card);font-weight:700;color:var(--text);margin-bottom:var(--space-md)}
.tab-panel p{font-size:var(--text-lg);color:var(--text-muted);line-height:1.6;max-width:600px;margin:0 auto}

.tab-panel-tags{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--space-sm);margin-top:var(--space-lg)}
.tag-chip{display:inline-flex;padding:6px 16px;border-radius:var(--radius-full);background:var(--white);border:1px solid rgba(0,173,186,0.25);color:var(--primary-dark);font-size:var(--text-sm);font-weight:600}

/* Autoridade - faixa de números (stat band) */
.autoridade{padding:var(--section-lg)}
.autoridade-content{max-width:900px;margin:0 auto}
.stat-band{display:grid;grid-template-columns:repeat(4,1fr)}

.stat-band-item{text-align:center;padding:0 var(--space-lg);border-right:1px solid rgba(255,255,255,0.15)}
.stat-band-item:last-child{border-right:none}
.metric-number{font-family:var(--font-mono);font-size:clamp(2rem,1.5rem + 2vw,3rem);font-weight:700;color:var(--white);margin-bottom:var(--space-xs);display:block;font-variant-numeric:tabular-nums}
.metric-label{font-size:var(--text-base);color:rgba(255,255,255,0.85);font-weight:500}

/* Cursos */
.cursos{padding:var(--section-lg);background:var(--white)}
.cursos-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--space-lg)}

.curso-card{background:var(--white);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-xs);transition:transform var(--transition-base),box-shadow var(--transition-base)}
.curso-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm)}
.curso-content{padding:var(--space-lg)}
.curso-content h3{font-size:var(--text-xl);font-weight:700;color:var(--text);margin-bottom:var(--space-md)}
.curso-content p{font-size:var(--text-base);color:var(--text-muted);line-height:1.6}

/* Botão Ver Todos - substitui inline style */
.cursos-ver-todos{text-align:center;margin-top:var(--space-xl)}

/* Conteúdo Gratuito */
.conteudo-gratuito{padding:var(--section-lg);background:var(--mist)}
.conteudo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-lg)}

.conteudo-item{background:var(--white);padding:var(--space-lg);border-radius:var(--radius-md);text-align:left;border:1px solid var(--border);border-left:4px solid var(--primary);box-shadow:var(--shadow-xs);transition:transform var(--transition-base),box-shadow var(--transition-base)}
.conteudo-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm)}
.conteudo-item h4{font-size:var(--text-lg);font-weight:700;color:var(--text);margin-bottom:var(--space-md)}
.conteudo-item p{font-size:var(--text-base);color:var(--text-muted);line-height:1.5}

/* Diferenciais */
.diferenciais{padding:var(--section-lg);background:var(--white)}
.diferenciais-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xl);max-width:900px;margin:0 auto;align-items:center}

/* Layout de lista e texto lateral */
.diferenciais-texto p{font-size:var(--text-lg);line-height:1.6;color:var(--text-muted)}

.diferencial-list{list-style:none}
.diferencial-list li{padding:var(--space-md) 0 var(--space-md) 44px;font-size:var(--text-lg);color:var(--text);font-weight:500;border-bottom:1px solid var(--border);position:relative}
.diferencial-list li:last-child{border-bottom:none}
.diferencial-list li::before{content:'✓';position:absolute;left:0;top:50%;transform:translateY(-50%);width:28px;height:28px;background:var(--primary);color:var(--white);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--text-sm)}

/* CTA Final - faixa em gradiente forte, com blobs decorativos do section-block-teal */
.cta-final{padding:var(--section-xl);text-align:center}
.cta-final.section-block-teal{background:var(--gradient-primary)}
.cta-final h2{font-size:var(--title-section);font-weight:700;margin-bottom:var(--space-lg);color:var(--white)}
.cta-final p{font-size:var(--text-lg);line-height:1.7;max-width:600px;margin:0 auto var(--space-xl);opacity:0.95;color:var(--white)}

/* Container de botões CTA */
.cta-final-buttons{display:flex;gap:var(--space-lg);flex-wrap:wrap;justify-content:center}

/* Contraste: botão primário passa a ser branco sobre o fundo em gradiente, secundário fica ghost */
.cta-final .btn-primary{background:var(--white);color:var(--primary-dark);box-shadow:0 6px 20px rgba(0,0,0,0.15)}
.cta-final .btn-primary:hover{background:var(--white);box-shadow:0 8px 26px rgba(0,0,0,0.22)}
.cta-final .btn-secondary{background:transparent;border-color:rgba(255,255,255,0.6);color:var(--white)}
.cta-final .btn-secondary:hover{background:rgba(255,255,255,0.15);border-color:var(--white);color:var(--white)}

/* Hero Image Placeholder */
.hero-image-placeholder{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:400px;
    background:var(--gradient-soft);
    border-radius:var(--radius-lg);
    border:2px dashed var(--border);
    color:var(--text-muted);
    font-size:var(--text-base);
}

/* ============================================
   MELHORIAS VISUAIS - ÍCONES, IMAGENS, CARDS
   ============================================ */

/* Cursos - Cards Premium */
.curso-card{
    background:linear-gradient(145deg, var(--white) 0%, var(--gradient-soft) 100%);
    border:1px solid rgba(0,173,186,0.1);
    box-shadow:0 4px 20px rgba(0,0,0,0.06);
    transition:all 0.3s ease;
    position:relative;
}

.curso-card-badge{
    display:inline-flex;
    padding:4px 14px;
    border-radius:var(--radius-full);
    background:var(--primary-light);
    color:var(--primary-dark);
    font-size:var(--text-xs);
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.04em;
    margin-bottom:var(--space-md);
}

.curso-card-icon{
    width:48px;
    height:48px;
    background:var(--primary);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 0 var(--space-md);
    color:var(--white);
    font-size:18px;
    box-shadow:0 6px 16px rgba(0,173,186,0.3);
    transition:transform 0.25s ease;
}

.curso-card:hover .curso-card-icon{
    transform:translateY(-3px) scale(1.05);
}

.curso-card::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:4px;
    background:linear-gradient(90deg, var(--primary) 0%, var(--primary-dark) 100%);
    opacity:0;
    transition:opacity 0.3s ease;
}

.curso-card:hover{
    transform:translateY(-8px);
    box-shadow:0 12px 32px rgba(0,0,0,0.1), 0 4px 16px rgba(0,173,186,0.15);
    border-color:rgba(0,173,186,0.2);
}

.curso-card:hover::before{
    opacity:1;
}

/* Conteúdo Gratuito - Ícones */
.conteudo-icon{
    width:48px;
    height:48px;
    background:var(--primary);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 0 var(--space-md);
    color:var(--white);
    font-size:20px;
    box-shadow:0 6px 16px rgba(0,173,186,0.3);
    transition:transform 0.25s ease;
}

.conteudo-item:hover .conteudo-icon{
    transform:translateY(-3px) scale(1.05);
}

/* Responsivo */
@media (max-width:1024px){
    .hero-content,.diferenciais-content{grid-template-columns:1fr;gap:var(--space-xl)}
    .institucional-pillars,.stat-band{grid-template-columns:repeat(2,1fr)}
    .problem-grid{grid-template-columns:1fr;max-width:500px}
    .stat-band-item{border-right:none;border-bottom:1px solid rgba(255,255,255,0.15);padding:var(--space-md) 0}
    .stat-band-item:nth-child(2n){border-right:none}
}

@media (max-width:768px){
    .institucional-pillars,.stat-band{grid-template-columns:1fr;max-width:450px;margin:var(--space-xl) auto 0}
    .tab-pills{gap:var(--space-xs)}
    .tab-pill{padding:10px 16px;font-size:var(--text-xs)}
    .tab-panel{padding:var(--space-xl) var(--space-lg)}
    .cursos-grid{grid-template-columns:1fr}
    .cta-final-buttons{flex-direction:column;align-items:center}
    .cta-final-buttons .btn{width:100%;max-width:280px}
    .diferenciais-content{grid-template-columns:1fr}
    .diferenciais-texto p{font-size:var(--text-base)}

    .metric-number{
        font-size:clamp(2rem, 1.5rem + 2vw, 2.5rem);
    }

    .conteudo-icon{
        width:48px;
        height:48px;
        font-size:18px;
    }
}

@media (max-width:480px){
    .hero-subtitle-premium,.institucional-statement p,.cta-final p{font-size:var(--text-base)}
    .diferencial-list li{font-size:var(--text-base);padding-left:36px}
    .diferencial-list li::before{width:24px;height:24px}
}