/* =========================================================
   style-landing.css — LP “Urologista em Vitória”
   Marca: #516082 (primária), #d0a156 (secundária)
   Compatível com o HTML limpo (sem inline)
   Data: 2025-11-01
   ========================================================= */

/* ---------- Fontes locais ---------- */
@font-face{
  font-family:"RobotoLocal";
  src:url("/assets/fonts/roboto/roboto-latin-400.woff2") format("woff2");
  font-weight:400;font-style:normal;font-display:swap
}
@font-face{
  font-family:"RobotoLocal";
  src:url("/assets/fonts/roboto/roboto-latin-700.woff2") format("woff2");
  font-weight:700;font-style:normal;font-display:swap
}

/* ---------- Variáveis ---------- */
:root{
  --cor-primaria:#516082;
  --cor-secundaria:#d0a156;
  --cor-secundaria-hover:#b78a42;
  --cor-fundo:#fff;
  --cor-neutro:#f6f6f6;
  --cor-texto:#333;
  --mc-borda:#E7E9EE;
  --btn-min:340px;
}

/* ---------- Base / Acessibilidade ---------- */
html{scroll-behavior:smooth;scroll-padding-top:80px}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

body.pagina-landing-v4{
  font-family:"RobotoLocal",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  background:linear-gradient(to bottom,#fff,#f3f3f3);
  color:var(--cor-texto);
  font-size:1rem;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility
}
img{max-width:100%;height:auto;display:block}
a:focus-visible,button:focus-visible{outline:3px solid var(--cor-secundaria);outline-offset:2px}

.container{width:min(1100px,92%);margin-inline:auto}
.txt-center{text-align:center}

/* ---------- Header / logo ---------- */
.header{
  background-color:var(--cor-primaria);
  padding:22px 0;border-bottom:3px solid var(--cor-secundaria);
  display:flex;justify-content:center;align-items:center
}
.logo-box{
  background:#fff;border-radius:16px;padding:12px;width:160px;height:160px;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 6px rgba(0,0,0,.08)
}
.logo{
  width:90px;height:90px;display:inline-block;object-fit:contain;
  background:transparent;border:0;padding:0;box-shadow:none
}

/* ---------- Banner ---------- */
.banner-unificado{background:#f9f9fb;padding:56px 0 44px}
.banner-flex{
  display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:36px;align-items:center
}
.banner-texto{max-width:640px;min-height:420px}
.banner-texto h1,.banner-texto p,.banner-texto span{font-size-adjust:.5}
.banner-texto h1{
  font-size:clamp(28px,4vw,40px);color:var(--cor-primaria);
  line-height:1.15;margin-bottom:10px
}
.banner-texto .subtitulo{
  font-size:clamp(16px,2.2vw,18px);color:#4a5266;margin-bottom:14px
}
.banner-texto .frase-banner span{
  display:block;font-size:1.125rem;font-weight:600;margin-bottom:4px;color:var(--cor-primaria)
}
/* imagem do banner (sem inline) */
.foto-circular{
  width:380px;height:380px;border-radius:24px;overflow:hidden;
  border:4px solid rgba(208,161,86,.55);background:#fff;
  box-shadow:0 6px 20px rgba(0,0,0,.08);justify-self:end
}
.foto-circular img{
  width:100%;height:100%;object-fit:cover;object-position:center 15%;
  aspect-ratio:1/1;max-height:380px
}

/* ---------- Botões ---------- */
.botoes-duplos{display:flex;gap:14px;flex-wrap:wrap;margin-top:16px;min-height:52px}
.btn-principal,.btn-secundario,.btn-mapa,.btn-waze{
  display:inline-flex;align-items:center;justify-content:center;
  height:52px;line-height:52px;padding:0 24px;border-radius:10px;
  font-weight:800;text-decoration:none;white-space:nowrap;user-select:none;
  -webkit-tap-highlight-color:transparent;box-sizing:border-box;
  min-width:var(--btn-min);transition:transform .15s ease,box-shadow .15s ease,background-color .2s ease
}
.btn-principal{background:var(--cor-secundaria);color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.btn-principal:hover,.btn-principal:focus-visible{
  background:var(--cor-secundaria-hover);transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,0,0,.12)
}
/* WhatsApp verde quando for link wa.me */
a[href*="wa.me"].btn-principal{
  background:#128C7E!important;color:#fff!important;text-shadow:0 1px 1px rgba(0,0,0,.22)
}
a[href*="wa.me"].btn-principal:hover{background:#0d7a6e!important}

.btn-secundario{background:var(--cor-primaria);color:#fff}
.btn-secundario:hover,.btn-secundario:focus-visible{
  background:#3d4c64;transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,0,0,.12)
}

/* Mapas/Waze (sólidos institucionais) */
.btn-mapa{background:var(--cor-primaria)!important;color:#fff!important}
.btn-mapa:hover{background:var(--cor-secundaria-hover)!important;transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.15)}
.btn-waze{background:#516082!important;color:#fff!important}
.btn-waze:hover{background:#b78a42!important;color:#fff!important;transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.15)}

/* Telefones (box limpo) */
.telefones{
  background:#fff;border-left:5px solid var(--cor-secundaria);
  color:var(--cor-primaria);padding:14px 16px;border-radius:10px;
  margin-top:14px;font-size:1.05rem;display:flex;flex-direction:column;gap:4px;text-align:center
}
.telefones .tel,.telefones .wa{display:block}

/* ---------- Serviços ---------- */
.bloco{
  background:#fff;padding:44px 26px;margin:36px auto;border-radius:16px;
  box-shadow:0 4px 16px rgba(0,0,0,.05)
}
section h2{
  text-align:center;color:var(--cor-primaria);
  font-size:clamp(22px,2.6vw,28px);margin:0 0 18px;line-height:1.25;font-weight:700;letter-spacing:-.2px
}
section h2::after{
  content:"";display:block;width:60px;height:3px;margin:10px auto 0;
  background:var(--cor-secundaria);border-radius:2px
}
.lista-destaque{list-style:none}
.lista-destaque li{
  position:relative;padding-left:30px;margin-bottom:12px;font-size:1.0625rem
}
.lista-destaque li::before{
  content:"";position:absolute;left:0;top:2px;width:18px;height:18px;
  background:no-repeat center/contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='%23d0a156'><path d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>")
}

/* ---------- Avaliações (#avaliacoes) ---------- */
#avaliacoes{
  padding:70px 16px;background:linear-gradient(to bottom,#ffffff,#f8f8f8);
  border-top:1px solid rgba(0,0,0,.05)
}
#avaliacoes h2{
  font-size:clamp(24px,2.6vw,30px);color:#516082;text-align:center;margin-bottom:10px;position:relative
}
#avaliacoes h2::after{
  content:"";display:block;width:80px;height:3px;background:#d0a156;margin:12px auto 0;border-radius:2px
}
.avaliacoes-intro{text-align:center;margin-bottom:32px}
.intro-avaliacoes{color:#555;font-size:1.05rem;margin-bottom:16px}
.selo-google-premium{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  background:#fff;border:1px solid #e6e6e6;border-radius:50px;padding:12px 24px;
  box-shadow:0 2px 8px rgba(0,0,0,.05);margin-bottom:12px
}
.selo-google-premium img{width:85px;height:auto}
.selo-google-premium .dados{
  display:flex;flex-direction:column;align-items:flex-start;line-height:1.3;font-size:.95rem
}
.selo-google-premium .nota strong{color:#000;font-weight:700}
.frase-confianca{font-size:1rem;color:#444;margin-top:6px}

.reviews-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:22px;max-width:1000px;margin:0 auto 36px
}
.review-card{
  background:#fff;border-radius:12px;border:1px solid rgba(0,0,0,.05);
  box-shadow:0 4px 10px rgba(0,0,0,.04);padding:24px;font-size:.97rem;line-height:1.6;
  transition:transform .25s ease,box-shadow .25s ease,opacity .3s ease
}
/* animação de entrada alinhada ao JS (.review-card) */
.review-card{opacity:0;transform:translateY(8px)}
.review-card.visivel{opacity:1;transform:none}

.review-card:hover{transform:translateY(-4px);box-shadow:0 6px 16px rgba(0,0,0,.07)}
.review-card footer{margin-top:12px;color:#666;font-size:.85rem;text-align:right}

.cta-avaliacoes{text-align:center;margin-bottom:32px}
.cta-avaliacoes .btn-secundario{
  font-weight:700;background:#516082;color:#fff;border-radius:10px;padding:12px 26px;transition:background .2s ease
}
.cta-avaliacoes .btn-secundario:hover{background:#3f4c64}

.mini-cta-avaliacoes{
  display:block;max-width:820px;margin:0 auto;padding:32px 20px;text-align:center;
  background:#f9f9f9;border:1px solid #eee;border-radius:12px
}
.mini-cta-avaliacoes p{margin-bottom:14px;font-size:1rem;color:#333}
.mini-cta-avaliacoes .botoes-duplos{display:flex;justify-content:center;flex-wrap:wrap;gap:12px}
.mini-cta-avaliacoes .btn-principal,
.mini-cta-avaliacoes .btn-secundario{margin:0;min-width:240px;text-align:center}
.selo-confianca{text-align:center;color:#666;font-size:.95rem;margin-top:14px}

/* ---------- Localização ---------- */
.lp-localizacao{background:#f8f9fb;padding-top:56px;padding-bottom:44px;border-top:1px solid rgba(0,0,0,.08)}
.lp-localizacao h2{margin-bottom:6px}
.lp-localizacao address{font-style:normal;margin:8px 0 6px}
.loc-desc{max-width:680px;margin:0 auto 16px;line-height:1.5;color:#333}
.loc-info{margin:0 0 18px}
.lp-localizacao .btn-mapa{margin:0}
.lp-localizacao .btn-waze{margin-left:12px}

/* ---------- CTA final ---------- */
.lp-cta{
  background:var(--cor-secundaria);padding:48px 0;
  border-top:3px solid var(--cor-secundaria-hover);border-bottom:1px solid rgba(0,0,0,.06)
}
.lp-cta .container{display:flex;align-items:center;justify-content:space-between;gap:32px}
.cta-texto{flex:1;max-width:540px}
.lp-cta h2{
  color:#2b2b2b;font-size:clamp(22px,2.8vw,28px);margin:0 0 10px;line-height:1.2;
  display:flex;align-items:center;gap:8px
}
.lp-cta h2::before{
  content:"";width:1.2em;height:1.2em;display:inline-block;
  background:no-repeat center/contain url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23516082'><path d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 14H5V9h14v9z'/></svg>")
}
.lp-cta p{color:#2b2b2b;margin:0;font-size:1.05rem;line-height:1.4}
.lp-cta .botoes-duplos{display:flex;flex-wrap:nowrap;gap:14px;margin:0}
.lp-cta .btn-principal{background:var(--cor-primaria);color:#fff}
.lp-cta .btn-principal:hover{background:#3d4c64}
.lp-cta .btn-secundario{
  background:#fff;color:var(--cor-primaria);border:2px solid var(--cor-primaria)
}
.lp-cta .btn-secundario:hover{color:var(--cor-secundaria-hover);border-color:var(--cor-secundaria-hover)}

/* ---------- Rodapé ---------- */
.rodape{
  background:var(--cor-primaria);color:#fff;text-align:center;
  padding:18px 0;font-size:.9rem;margin-top:28px
}
.rodape a{color:#f1f1f1;text-decoration:underline;font-weight:500}
.rodape a:hover{color:var(--cor-secundaria-hover)}

/* ---------- WhatsApp flutuante ---------- */
.whatsapp-flutuante{
  position:fixed;bottom:20px;right:20px;z-index:1000;
  width:64px;height:64px;border-radius:50%;
  background:#128C7E;box-shadow:0 6px 16px rgba(0,0,0,.18);
  display:grid;place-items:center;text-decoration:none
}
/* usamos ícone via mask para evitar <img> extra */
.whatsapp-flutuante img{display:none}
.whatsapp-flutuante::after{
  content:"";width:28px;height:28px;background:#fff;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'><path fill='%23000' d='M128 0a128 128 0 0 0-110.9 189.9L0 256l67.2-16.7A128 128 0 1 0 128 0Zm0 24a104 104 0 0 1 89.2 156.8l-3 4.9 8.2 30.7-30.9-8-4.8 2.9A104 104 0 1 1 128 24Zm-47.7 49.5c3.3-7.4 6.9-7.6 10.1-7.7c2.6-.1 5.7-.1 8.8 0c3 .1 6.4 1 9.7 7.5c3.5 6.8 12 23.5 12.9 25.2c.9 1.7 2 3.9 0 6.3c-2 2.5-3 4.1-5.8 6.8s-6 6.1-2.4 12c3.6 5.9 16.1 26.4 34.7 35.8c17.1 8.5 20.6 5.7 24.3 3.5c3.7-2.1 10.7-9.5 13.6-12.5c2.9-3 5.8-2.5 9.7-1c3.9 1.6 24.7 11.6 28.9 13.7c4.2 2.1 7 3.1 8 4.9c1 1.8 1 10.4-2.4 20.5c-3.4 10.1-19.7 19-27.6 19.8c-7.9.8-15.2 2.5-51.6-10.6c-36.4-13.1-60.1-50.7-62-53.1c-1.9-2.4-15-19.9-15-38.1c0-18.2 11.5-27.1 14.8-34.5Z'/></svg>") no-repeat center/contain;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'><path fill='%23000' d='M128 0a128 128 0 0 0-110.9 189.9L0 256l67.2-16.7A128 128 0 1 0 128 0Zm0 24a104 104 0 0 1 89.2 156.8l-3 4.9 8.2 30.7-30.9-8-4.8 2.9A104 104 0 1 1 128 24Zm-47.7 49.5c3.3-7.4 6.9-7.6 10.1-7.7c2.6-.1 5.7-.1 8.8 0c3 .1 6.4 1 9.7 7.5c3.5 6.8 12 23.5 12.9 25.2c.9 1.7 2 3.9 0 6.3c-2 2.5-3 4.1-5.8 6.8s-6 6.1-2.4 12c3.6 5.9 16.1 26.4 34.7 35.8c17.1 8.5 20.6 5.7 24.3 3.5c3.7-2.1 10.7-9.5 13.6-12.5c2.9-3 5.8-2.5 9.7-1c3.9 1.6 24.7 11.6 28.9 13.7c4.2 2.1 7 3.1 8 4.9c1 1.8 1 10.4-2.4 20.5c-3.4 10.1-19.7 19-27.6 19.8c-7.9.8-15.2 2.5-51.6-10.6c-36.4-13.1-60.1-50.7-62-53.1c-1.9-2.4-15-19.9-15-38.1c0-18.2 11.5-27.1 14.8-34.5Z'/></svg>") no-repeat center/contain
}
.whatsapp-flutuante:hover{filter:brightness(1.05)}

/* ---------- Animações/visibilidade ---------- */
@keyframes sk{0%{background-position:100% 0}100%{background-position:0 0}}

/* ---------- Espaçamento padrão das sections ---------- */
section{padding:40px 16px}

/* ---------- Acessibilidade: reduzir movimentos ---------- */
@media (prefers-reduced-motion: reduce){
  .btn-principal:hover,
  .btn-secundario:hover,
  .btn-mapa:hover,
  .btn-waze:hover,
  .review-card:hover{
    transform:none;
    transition:none;
  }
}

/* ---------- Responsivo ---------- */
@media(max-width:920px){
  .banner-flex{grid-template-columns:1fr;gap:24px}
  .foto-circular{justify-self:center;width:300px;height:300px}
  .banner-texto{text-align:center;margin-inline:auto}
  .botoes-duplos{justify-content:center}

  .lp-cta .container{flex-direction:column;text-align:center}
  .lp-cta .botoes-duplos{width:100%;justify-content:center;flex-wrap:wrap}
  .lp-cta .btn-principal,.lp-cta .btn-secundario{width:100%}
  .lp-localizacao .btn-waze{display:block;margin:14px auto 0}
}
@media(max-width:768px){
  .logo-box{width:120px;height:120px;padding:8px}
  .logo{width:90px;height:90px}
  .btn-principal,.btn-secundario,.btn-mapa,.btn-waze{
    width:100%;min-width:unset;text-align:center;font-size:1.05rem
  }
}
@media(max-width:600px){
  .selo-google-premium{flex-direction:column;text-align:center}
  .selo-google-premium .dados{align-items:center}
  .reviews-grid{grid-template-columns:1fr}
  .mini-cta-avaliacoes .botoes-duplos{flex-direction:column}
}
@media(max-width:480px){
  .rodape{padding-bottom:26px}
}