/* =========================================================
   Clinica Martinho - Manaus | AM
   Odontologia & Endocrinologia Pediátrica
   Author: Clinica Martinho
   Palette: #0062b0 (azul), #c0c0ba (cinza), #e7f7f8 (fundo)
   ========================================================= */

:root{
  --azul:#0062b0;
  --azul-esc:#004a85;
  --cinza:#c0c0ba;
  --fundo:#e7f7f8;
  --branco:#ffffff;
  --texto:#1a2b3c;
  --texto-suave:#4a5b6c;
  --sombra:0 6px 20px rgba(0,98,176,.10);
  --sombra-forte:0 10px 30px rgba(0,98,176,.18);
  --radius:14px;
  --radius-sm:8px;
  --transition:.28s ease;
  --container:1180px;
}

*,
*::before,
*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }

body{
  margin:0;
  font-family:'Poppins', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size:16px;
  line-height:1.65;
  color:var(--texto);
  background:var(--fundo);
  overflow-x:hidden;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

img{ max-width:100%; height:auto; display:block; }

a{ color:var(--azul); text-decoration:none; transition:color var(--transition); }
a:hover, a:focus{ color:var(--azul-esc); }

h1,h2,h3,h4{ font-family:'Playfair Display','Poppins',serif; color:var(--azul); line-height:1.25; margin:0 0 .6em; }
h1{ font-size:clamp(1.8rem, 4vw, 2.8rem); }
h2{ font-size:clamp(1.5rem, 3vw, 2.1rem); }
h3{ font-size:clamp(1.2rem, 2.5vw, 1.5rem); }

p{ margin:0 0 1em; }

.container{ width:min(100% - 2rem, var(--container)); margin-inline:auto; }

.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ===== TOPBAR ===== */
.topbar{
  background:var(--azul);
  color:#fff;
  font-size:.85rem;
  padding:.5rem 0;
}
.topbar .container{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.75rem;
}
.topbar a{ color:#fff; }
.topbar-info{ display:flex; gap:1.2rem; flex-wrap:wrap; }
.topbar-info span{ display:inline-flex; align-items:center; gap:.4rem; }
.topbar-social a{ margin-left:.6rem; }

/* ===== HEADER ===== */
.site-header{
  background:#fff;
  box-shadow:var(--sombra);
  position:sticky; top:0; z-index:100;
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between; padding:.8rem 1rem;
  gap:1rem;
}
.logo img{ height:70px; width:auto; }
.logo{ display:flex; align-items:center; }

.nav-toggle{
  background:none; border:0; cursor:pointer; padding:.4rem;
  display:none; flex-direction:column; gap:5px;
}
.nav-toggle span{
  width:26px; height:3px; background:var(--azul); border-radius:2px; transition:var(--transition);
}
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(8px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-8px) rotate(-45deg); }

.main-nav > ul{
  list-style:none; margin:0; padding:0;
  display:flex; gap:.4rem; align-items:center;
}
.main-nav a{
  padding:.6rem .9rem; border-radius:var(--radius-sm);
  color:var(--texto); font-weight:500; font-size:.95rem;
  transition:var(--transition);
  display:inline-block;
}
.main-nav a:hover,
.main-nav a.active,
.main-nav a[aria-current="page"]{
  background:var(--azul); color:#fff;
}

.has-drop{ position:relative; }
.dropdown{
  position:absolute; top:calc(100% + .35rem); left:0; right:auto;
  display:flex; flex-direction:column; align-items:stretch; gap:0;
  background:#fff; width:320px; min-width:280px; max-width:min(360px, calc(100vw - 2rem)); padding:.45rem;
  box-shadow:var(--sombra-forte); border-radius:var(--radius);
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:var(--transition); z-index:99;
  list-style:none; margin:0;
  max-height:calc(100vh - 150px);
  max-height:calc(100dvh - 150px);
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}
.has-drop:hover > .dropdown,
.has-drop:focus-within > .dropdown{ opacity:1; visibility:visible; transform:translateY(0); }
.dropdown li{ width:100%; }
.dropdown a{
  display:block; padding:.62rem .85rem; font-size:.86rem; color:var(--texto);
  border-radius:var(--radius-sm); line-height:1.35;
  white-space:normal;
  overflow-wrap:break-word;
  hyphens:auto;
}
.dropdown a:hover{ background:var(--fundo); color:var(--azul); }

/* ===== HERO ===== */
.hero{
  position:relative;
  background:linear-gradient(135deg, rgba(0,98,176,.85) 0%, rgba(0,74,133,.75) 100%);
  color:#fff;
  overflow:hidden;
  min-height:60vh;
  display:flex; align-items:center;
  padding:4rem 0;
}
.hero::before{
  content:""; position:absolute; inset:0; z-index:0;
  background-image:url('../images/banner-home.webp');
  background-size:cover; background-position:center;
  opacity:.35;
}
.hero .container{ position:relative; z-index:1; max-width:800px; text-align:center; }
.hero h1{ color:#fff; margin-bottom:1rem; }
.hero p{ font-size:1.1rem; margin-bottom:1.6rem; }

.btn{
  display:inline-block;
  background:var(--azul);
  color:#fff;
  padding:.85rem 1.6rem;
  border-radius:50px;
  font-weight:600;
  font-size:.95rem;
  border:2px solid var(--azul);
  cursor:pointer;
  transition:var(--transition);
  text-decoration:none;
}
.btn:hover, .btn:focus{
  background:#fff; color:var(--azul); transform:translateY(-2px);
  box-shadow:var(--sombra);
}
.btn-outline{ background:transparent; color:#fff; }
.btn-outline:hover{ background:#fff; color:var(--azul); }
.btn-whats{ background:#25d366; border-color:#25d366; }
.btn-whats:hover{ background:#fff; color:#25d366; border-color:#25d366; }

/* ===== SECTIONS ===== */
section{ padding:4rem 0; }
.section-title{
  text-align:center; margin-bottom:2.6rem;
}
.section-title p{ color:var(--texto-suave); max-width:640px; margin-inline:auto; }

.grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:2rem; align-items:center; }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; }

/* Cards */
.card{
  background:#fff;
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--sombra);
  transition:var(--transition);
  display:flex; flex-direction:column;
}
.card:hover{ transform:translateY(-6px); box-shadow:var(--sombra-forte); }
.card img{ width:100%; height:200px; object-fit:cover; }
.card-body{ padding:1.4rem; flex:1; display:flex; flex-direction:column; }
.card-body h3{ margin-bottom:.6rem; font-size:1.15rem; }
.card-body p{ color:var(--texto-suave); font-size:.92rem; flex:1; }
.card-body .btn{ align-self:flex-start; margin-top:.6rem; }

/* Sobre / Doctors */
.doctor-card{
  background:#fff; padding:1.6rem; border-radius:var(--radius);
  box-shadow:var(--sombra); text-align:center;
}
.doctor-card img{
  width:170px; height:170px; border-radius:50%;
  object-fit:cover; margin:0 auto 1rem; border:4px solid var(--fundo);
}
.doctor-card h3{ margin-bottom:.3rem; }
.doctor-card .role{ color:var(--texto-suave); font-size:.9rem; margin-bottom:.6rem; }

/* Bloco alternativo */
.alt-block{ background:#fff; }
.alt-block-content h2{ margin-bottom:1rem; }

/* Info clinic */
.info-clinic{
  background:var(--azul); color:#fff; padding:3rem 0;
}
.info-clinic h2{ color:#fff; }
.info-clinic a{ color:#fff; text-decoration:underline; }
.info-clinic .grid-3{ text-align:center; }
.info-clinic .grid-3 > div{ padding:1rem; }
.info-clinic img{ width:56px; height:56px; margin:0 auto 1rem; }

/* ===== FOOTER ===== */
.site-footer{
  background:#0a2540; color:#c7d3df; padding:3rem 0 1rem;
  margin-top:auto;
}
.site-footer .grid-3{ gap:2rem; }
.site-footer h4{ color:#fff; margin-bottom:1rem; font-size:1.1rem; }
.site-footer a{ color:#c7d3df; }
.site-footer a:hover{ color:#fff; }
.site-footer ul{ list-style:none; padding:0; margin:0; }
.site-footer li{ padding:.25rem 0; font-size:.92rem; }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);
  margin-top:2rem; padding-top:1rem; text-align:center; font-size:.85rem;
}

/* ===== BREADCRUMB ===== */
.breadcrumb{
  background:#fff; padding:.9rem 0; font-size:.88rem;
  border-bottom:1px solid var(--fundo);
}
.breadcrumb ol{ display:flex; flex-wrap:wrap; gap:.4rem; list-style:none; padding:0; margin:0; }
.breadcrumb li:not(:last-child)::after{ content:"›"; margin-left:.4rem; color:var(--cinza); }
.breadcrumb a{ color:var(--texto-suave); }
.breadcrumb [aria-current="page"]{ color:var(--azul); font-weight:600; }

/* ===== INNER PAGE HERO ===== */
.page-hero{
  background:linear-gradient(135deg, rgba(0,98,176,.9), rgba(0,74,133,.85)), url('../images/banner-servicos.webp');
  background-size:cover; background-position:center;
  color:#fff; text-align:center; padding:5rem 0 3rem;
}
.page-hero h1{ color:#fff; margin:0; }
.page-hero p{ opacity:.9; margin-top:.6rem; }

/* ===== ARTICLE / CONTENT ===== */
.article{ background:#fff; }
.article .container{ max-width:900px; }
.article h2{ margin-top:2rem; }
.article ul{ padding-left:1.4rem; }
.article ul li{ margin-bottom:.4rem; }
.article .highlight{
  background:var(--fundo); border-left:4px solid var(--azul);
  padding:1rem 1.2rem; border-radius:var(--radius-sm);
  margin:1.6rem 0;
}
.article-hero-img{
  width:100%; border-radius:var(--radius);
  margin-bottom:1.6rem; box-shadow:var(--sombra);
}
.doctor-info-card{
  background:var(--fundo); border-radius:var(--radius); padding:1.6rem;
  margin-top:2rem; display:flex; gap:1rem; align-items:center;
}
.doctor-info-card img{
  width:110px; height:110px; border-radius:50%;
  object-fit:cover; flex-shrink:0;
}
.doctor-info-card h4{ margin:0 0 .3rem; color:var(--azul); }
.doctor-info-card p{ margin:0; font-size:.9rem; color:var(--texto-suave); }
.doctor-info-card .instagram-link{
  display:inline-flex;align-items:center;gap:.4rem;
  margin-top:.5rem; font-weight:600;
}

/* ===== FAQ ===== */
.faq{ padding-top:0; }
.faq details{
  background:#fff; margin-bottom:.8rem;
  border-radius:var(--radius); padding:1rem 1.2rem;
  box-shadow:var(--sombra);
}
.faq summary{
  cursor:pointer; font-weight:600; color:var(--azul);
  list-style:none; display:flex; justify-content:space-between; align-items:center;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:"+"; font-size:1.5rem; color:var(--azul); font-weight:400;
  transition:var(--transition);
}
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq details p{ margin-top:.8rem; color:var(--texto-suave); }

/* ===== FORM ===== */
.form-card{
  background:#fff; padding:2rem; border-radius:var(--radius); box-shadow:var(--sombra);
}
.form-group{ margin-bottom:1rem; }
.form-group label{ display:block; margin-bottom:.4rem; font-weight:500; }
.form-group input,
.form-group textarea,
.form-group select{
  width:100%; padding:.75rem 1rem; border:1.5px solid #d8dfe6;
  border-radius:var(--radius-sm); font-size:.95rem; font-family:inherit;
  background:#fff; transition:var(--transition);
}
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus{
  outline:none; border-color:var(--azul); box-shadow:0 0 0 3px rgba(0,98,176,.15);
}

/* WhatsApp Floating */
.wa-float{
  position:fixed; bottom:20px; right:20px; z-index:98;
  width:58px; height:58px; border-radius:50%;
  background:#25d366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 18px rgba(37,211,102,.4);
  animation:pulse 2s infinite;
}
.wa-float svg{ width:32px; height:32px; fill:#fff; }
@keyframes pulse{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.06); }
}

/* Cookie banner */
.cookie-banner{
  position:fixed; bottom:0; left:0; right:0;
  background:#0a2540; color:#fff; padding:1rem;
  display:flex; justify-content:center; gap:1rem; align-items:center;
  flex-wrap:wrap; z-index:200; font-size:.9rem;
  transform:translateY(100%); transition:transform .4s ease;
}
.cookie-banner.show{ transform:translateY(0); }
.cookie-banner a{ color:#7fc4ff; }

/* Utility */
.text-center{ text-align:center; }
.mt-2{ margin-top:2rem; }
.mb-2{ margin-bottom:2rem; }

/* ===== RESPONSIVE ===== */
@media (max-width:960px){
  .grid-4{ grid-template-columns:repeat(2,1fr); }
}

@media (min-width:769px){
  .main-nav{ flex:1 1 auto; min-width:0; }
  .main-nav > ul{ justify-content:flex-end; flex-wrap:wrap; }
}

@media (min-width:769px) and (max-width:1080px){
  .site-header .container{ gap:.65rem; }
  .logo img{ height:62px; }
  .main-nav a{ padding:.5rem .62rem; font-size:.87rem; }
}

@media (max-width:768px){
  .nav-toggle{ display:flex; }
  .site-header{ position:sticky; top:0; }
  .site-header .container{ flex-wrap:wrap; justify-content:center; position:relative; padding:.6rem 1rem; }
  .logo{ margin:0 auto; }
  .logo img{ height:60px; }
  .nav-toggle{ position:absolute; right:1rem; top:50%; transform:translateY(-50%); }
  .main-nav{
    flex-basis:100%; display:none;
    max-height:calc(100vh - 130px);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }
  .main-nav.open{ display:block; }
  .main-nav > ul{
    flex-direction:column; align-items:stretch; gap:0; padding-top:.4rem; padding-bottom:1rem;
  }
  .main-nav a{ width:100%; padding:.6rem 1rem; font-size:.9rem; border-radius:0; border-bottom:1px solid var(--fundo); }
  .dropdown{
    position:static; opacity:1; visibility:visible; transform:none;
    box-shadow:none; padding:0; background:var(--fundo);
    display:none; max-width:100%; min-width:0;
    width:100%; max-height:none; overflow:visible;
  }
  .has-drop.open > .dropdown{ display:block; }
  .has-drop:hover > .dropdown,
  .has-drop:focus-within > .dropdown{ transform:none; }
  .dropdown a{ padding:.5rem .5rem .5rem 2rem; font-size:.82rem; }

  .grid-2,.grid-3,.grid-4{ grid-template-columns:1fr; }
  .hero{ min-height:auto; padding:3rem 0; }
  .topbar-info{ justify-content:center; text-align:center; }
  .topbar .container{ justify-content:center; }
  section{ padding:2.5rem 0; }
  .doctor-info-card{ flex-direction:column; text-align:center; }
}

@media (max-width:480px){
  .btn{ width:100%; text-align:center; }
  .wa-float{ width:52px; height:52px; }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}

/* Print */
@media print{
  .site-header,.site-footer,.wa-float,.cookie-banner,.topbar{ display:none; }
  body{ background:#fff; color:#000; }
}