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

/* Animações */
@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* Blobs de fundo do hero flutuando lentamente (mesmo tratamento da home) */
@keyframes qsFloatBlobA{
    0%,100%{transform:translate(0,0) scale(1)}
    50%{transform:translate(-40px,30px) scale(1.08)}
}
@keyframes qsFloatBlobB{
    0%,100%{transform:translate(0,0) scale(1)}
    50%{transform:translate(30px,-25px) scale(1.1)}
}
@keyframes qsDriftGrid{
    0%{transform:translate(0,0)}
    100%{transform:translate(-34px,-34px)}
}

/* Hero */
.hero-institucional{background:var(--gradient-light);padding:calc(var(--header-height) + var(--space-xl)) 0 var(--section-lg);min-height:500px;display:flex;align-items:center;position:relative;overflow:hidden}
.hero-institucional::before,.hero-institucional::after{content:'';position:absolute;border-radius:50%;pointer-events:none;filter:blur(10px)}
.hero-institucional::before{top:-30%;right:-10%;width:500px;height:500px;background:radial-gradient(circle,rgba(0,173,186,0.2) 0%,rgba(0,173,186,0.07) 45%,transparent 70%);animation:qsFloatBlobA 16s ease-in-out infinite}
.hero-institucional::after{bottom:-20%;left:-5%;width:380px;height:380px;background:radial-gradient(circle,rgba(0,138,149,0.18) 0%,rgba(0,138,149,0.05) 45%,transparent 70%);animation:qsFloatBlobB 20s ease-in-out infinite}

.hero-institucional-dots{position:absolute;top:-40px;left:-40px;right:-40px;bottom:-40px;background:radial-gradient(circle 1.5px at center,rgba(0,90,98,0.3) 1.5px,transparent 1.5px);background-size:34px 34px;animation:qsDriftGrid 24s linear infinite;pointer-events:none;mask-image:linear-gradient(180deg,#000 0%,#000 75%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 75%,transparent 100%)}

.hero-institucional .hero-content{text-align:center;max-width:800px;margin:0 auto;position:relative;z-index:1}

.quem-somos-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)}
.quem-somos-badge-dot{width:8px;height:8px;background:var(--primary);border-radius:50%;animation:pulse 2s ease-in-out infinite}

.hero-institucional h1{font-size:clamp(2.25rem, 2.9vw, 3.25rem);font-weight:700;color:var(--text);line-height:1.2;letter-spacing:-0.01em;margin-bottom:var(--space-lg);text-wrap:balance}
.hero-institucional .hero-subtitle{font-size:var(--text-lg);color:var(--text-muted);line-height:1.7;max-width:700px;margin:0 auto}

/* Introdução */
.introducao{background:var(--white);padding:var(--section-lg);position:relative}
.introducao-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2xl);align-items:center}
.introducao-content h2{font-size:var(--title-section);font-weight:700;color:var(--text);margin-bottom:var(--space-lg);position:relative;padding-bottom:var(--space-md)}
.introducao-content h2::after{content:'';position:absolute;bottom:0;left:0;width:60px;height:3px;background:var(--primary);border-radius:var(--radius-sm)}
.introducao-text{font-size:var(--text-base);line-height:1.8;color:var(--text-muted)}
.introducao-text p{margin-bottom:var(--space-lg)}
.introducao-text strong{color:var(--text);font-weight:600}

.introducao-image{position:relative}
.introducao-image::before{content:'';position:absolute;top:var(--space-md);left:var(--space-md);right:calc(var(--space-md) * -1);bottom:calc(var(--space-md) * -1);background:var(--primary-light);border-radius:var(--radius-md);z-index:-1}

.institucional-image{max-width:100%;height:auto;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);transition:transform var(--transition-base),box-shadow var(--transition-base)}
.institucional-image:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}

/* História */
.historia{background:var(--mist);padding:var(--section-lg)}
.historia-content{max-width:800px;margin:0 auto;text-align:center}
.historia-content p{font-size:var(--text-lg);line-height:1.8;color:var(--text-muted);margin-bottom:var(--space-lg)}
.historia .timeline{max-width:500px;margin:0 auto}

/* Autoridade - bloco sólido teal, estatísticas com selo + número mono */
.autoridade{padding:var(--section-lg)}
.autoridade-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-lg)}

.autoridade-item{text-align:center;display:flex;flex-direction:column;align-items:center}
.autoridade-item .stat-badge-icon{margin-bottom:var(--space-md)}
.autoridade-item:hover .stat-badge-icon{transform:translateY(-3px) scale(1.05)}
.autoridade-number{font-family:var(--font-mono);font-size:clamp(2rem,1.5rem + 2vw,2.8rem);font-weight:700;color:var(--white);margin-bottom:var(--space-xs);display:block;font-variant-numeric:tabular-nums}
.autoridade-label{font-size:var(--text-base);color:rgba(255,255,255,0.85);font-weight:500}

/* Especialização */
.especializacao{background:var(--white);padding:var(--section-lg)}
.especializacao-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg);max-width:900px;margin:0 auto}

.especializacao-item{background:var(--white);padding:var(--space-lg);border-radius:var(--radius-md);text-align:left;font-weight:600;color:var(--text);font-size:var(--text-base);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)}
.especializacao-item:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm)}

/* Atuação */
.atuacao{background:var(--mist);padding:var(--section-lg)}
.atuacao-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg)}

.atuacao-item{background:var(--white);padding:var(--space-xl) 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)}
.atuacao-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm)}
.atuacao-item h3{font-size:var(--text-xl);font-weight:700;color:var(--primary);margin-bottom:var(--space-md)}
.atuacao-item p{font-size:var(--text-base);line-height:1.6;color:var(--text-muted)}

.atuacao-icon{font-size:var(--text-3xl);color:var(--primary);margin-bottom:var(--space-md);display:inline-block;transition:transform var(--transition-base)}
.atuacao-item:hover .atuacao-icon{transform:scale(1.05)}

/* Diferenciais */
.diferenciais{background:var(--gradient-soft);padding:var(--section-lg)}

/* Grid com mais respiro entre colunas */
.diferenciais-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-xl);max-width:900px;margin:0 auto;padding:0 var(--space-md)}

/* Coluna com gap vertical consistente entre itens */
.diferenciais-column{display:flex;flex-direction:column;gap:var(--space-lg)}

/* Cards mais elegantes e premium */
.diferencial-item{
    background:var(--white);
    padding:var(--space-xl) var(--space-lg) var(--space-xl) 72px;
    border-radius:var(--radius-lg);
    font-size:var(--text-base);
    color:var(--text);
    font-weight:500;
    line-height:1.7;
    position:relative;
    box-shadow:var(--shadow-xs);
    border:1px solid rgba(0,173,186,0.06);
    border-left:3px solid var(--primary);
    transition:transform var(--transition-base),box-shadow var(--transition-base),border-color var(--transition-base)
}

/* Ícone de check maior e mais elegante */
.diferencial-item::before{
    content:'✓';
    position:absolute;
    left:var(--space-lg);
    top:50%;
    transform:translateY(-50%);
    color:var(--white);
    font-weight:700;
    font-size:var(--text-sm);
    width:32px;
    height:32px;
    background:var(--primary);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 2px 8px rgba(0,173,186,0.25)
}

/* Hover sutil e elegante */
.diferencial-item:hover{
    transform:translateY(-3px) translateX(4px);
    box-shadow:var(--shadow-sm);
    border-color:rgba(0,173,186,0.12);
    border-left-color:var(--primary)
}

/* Posicionamento */
.posicionamento{padding:var(--section-lg);text-align:center}
.posicionamento-content{max-width:800px;margin:0 auto}
.posicionamento-content p{font-size:var(--text-lg);line-height:1.7;color:var(--text-muted);margin-bottom:var(--space-md)}

/* CTA Final - faixa teal, mesmo tratamento de contraste da home */
.cta-final{padding:var(--section-lg)}
.cta-content{text-align:center;max-width:700px;margin:0 auto}
.cta-content p{font-size:var(--text-lg);line-height:1.7;color:rgba(255,255,255,0.9);margin-bottom:var(--space-xl)}
.cta-buttons{display:flex;gap:var(--space-lg);justify-content:center;flex-wrap:wrap}

.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)}

/* Responsivo */
@media (max-width:1024px){
    .hero-institucional{padding:var(--section-md)}
    .introducao-grid{gap:var(--space-xl)}
    .autoridade-grid,.especializacao-grid{grid-template-columns:repeat(2,1fr)}
    .atuacao-grid{grid-template-columns:1fr;gap:var(--space-lg);max-width:500px;margin:0 auto}
    /* Diferenciais: 1 coluna no tablet com mais respiro */
    .diferenciais-grid{grid-template-columns:1fr;max-width:600px;gap:var(--space-lg)}
    .diferenciais-column{gap:var(--space-md)}
    .diferencial-item{padding:var(--space-lg) var(--space-lg) var(--space-lg) 68px}
}

@media (max-width:768px){
    .hero-institucional{padding:var(--section-sm);min-height:400px}
    .introducao,.historia,.autoridade,.especializacao,.atuacao,.diferenciais,.posicionamento,.cta-final{padding:var(--section-md)}
    .introducao-grid{grid-template-columns:1fr;gap:var(--space-lg)}
    .introducao-image::before{display:none}
    .historia-timeline{flex-direction:column;align-items:center;max-width:200px;margin:0 auto}
    .autoridade-grid,.especializacao-grid{grid-template-columns:1fr;max-width:400px;margin:0 auto}
    .cta-buttons{flex-direction:column;align-items:center}
    .cta-buttons .btn{width:100%;max-width:280px}
}

@media (max-width:480px){
    /* Diferenciais mobile: cards compactos mas respirados */
    .diferenciais-grid{padding:0 var(--space-sm);gap:var(--space-md)}
    .diferenciais-column{gap:var(--space-sm)}
    .diferencial-item{
        padding:var(--space-md) var(--space-md) var(--space-md) 52px;
        font-size:var(--text-sm);
        border-radius:var(--radius-md);
        line-height:1.6
    }
    .diferencial-item::before{
        left:var(--space-md);
        width:26px;
        height:26px;
        font-size:var(--text-xs)
    }
    .atuacao-item{padding:var(--space-lg)}
    .timeline-item{padding:var(--space-md)}
}
