/* ============================================================
   PAGES.CSS — layouts das seções (home e internas)
   ============================================================ */

/* ---------- HERO CINEMATOGRÁFICO ---------- */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:flex-end;
  background:var(--forest-deep); color:var(--porcelain); overflow:hidden;
}
.hero-media{ position:absolute; inset:0 }
.hero-media img{ width:100%; height:100%; object-fit:cover; opacity:.92 }
.hero-media::after{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgb(23 27 25 / .55) 0%, transparent 34%, transparent 55%, rgb(23 27 25 / .88) 100%),
    linear-gradient(90deg, rgb(23 27 25 / .5) 0%, transparent 60%);
}
.hero-inner{ position:relative; z-index:2; width:100%; padding-bottom:clamp(3rem,8vh,6rem) }
.hero h1{ max-width:13ch; margin-block:1.6rem 1.4rem }
.hero .lead{ color:color-mix(in srgb, var(--porcelain) 80%, transparent); max-width:46ch }
.hero-ctas{ display:flex; flex-wrap:wrap; gap:1.1rem; margin-top:2.4rem }
.hero-scroll{
  position:absolute; right:var(--gutter); bottom:clamp(3rem,8vh,6rem); z-index:2;
  writing-mode:vertical-rl; font-size:.68rem; font-weight:600; letter-spacing:.4em;
  text-transform:uppercase; color:color-mix(in srgb, var(--porcelain) 55%, transparent);
  display:none; align-items:center; gap:1rem;
}
.hero-scroll::after{ content:''; width:1px; height:5rem; background:linear-gradient(var(--champagne-2), transparent) }
@media (min-width:900px){ .hero-scroll{ display:flex } }

/* Entrada orquestrada do hero (só no load) */
.hero .st{ opacity:0; transform:translateY(30px); animation:st 1.1s var(--ease-lux) forwards }
.hero .st-1{ animation-delay:.15s } .hero .st-2{ animation-delay:.3s }
.hero .st-3{ animation-delay:.5s } .hero .st-4{ animation-delay:.7s }
@keyframes st{ to{ opacity:1; transform:none } }
@media (prefers-reduced-motion:reduce){ .hero .st{ animation:none; opacity:1; transform:none } }

/* ---------- FAIXA DE NÚMEROS ---------- */
.stats{ background:var(--ivory) }
.stats .row{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-4) }
@media (min-width:900px){ .stats .row{ grid-template-columns:repeat(4,1fr) } }
.stat b{ display:block; font-family:var(--serif); font-weight:380;
  font-size:clamp(2.6rem,4.5vw,4rem); line-height:1; color:var(--ink) }
.stat b i{ font-style:italic; color:var(--champagne); font-size:.6em }
.stat span{ display:block; margin-top:.6rem; font-size:.75rem; font-weight:600;
  letter-spacing:.24em; text-transform:uppercase; color:var(--stone) }

/* ---------- PILARES (lista editorial numerada) ---------- */
.pillars{ counter-reset:p }
.pillar{ counter-increment:p; display:grid; grid-template-columns:auto 1fr; gap:1.4rem;
  padding-block:1.7rem; border-bottom:var(--hairline); align-items:baseline }
.pillar:first-child{ border-top:var(--hairline) }
.dark .pillar{ border-color:color-mix(in srgb, var(--champagne-2) 25%, transparent) }
.pillar::before{ content:counter(p,decimal-leading-zero); font-family:var(--serif); font-style:italic;
  font-size:1rem; color:var(--champagne) }
.pillar h4{ font-family:var(--serif); font-weight:440; font-size:1.35rem; margin-bottom:.35rem }
.pillar p{ font-size:.98rem; color:var(--ink-soft); max-width:52ch }
.dark .pillar p{ color:color-mix(in srgb, var(--porcelain) 65%, transparent) }

/* ---------- MÉDICOS ---------- */
.medico-card{ display:grid; gap:1.6rem }
.medico-card .ph{ aspect-ratio:4/5 }
/* depth effect nos cards: mesma altura nos dois, sujeito sentado na base da moldura */
.medico-card .ph-depth{ aspect-ratio:4/5; display:flex; align-items:flex-end; justify-content:center }
.medico-card .ph-depth img{ max-height:96%; width:auto; max-width:100% }
.medico-card .crm{ font-size:.75rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
  color:var(--champagne-2); margin-top:.4rem }
.medico-card h3{ margin-top:1rem }
.medico-card .role{ font-size:.9rem; color:color-mix(in srgb, var(--porcelain) 65%, transparent); margin-top:.3rem }

/* ---------- GALERIA ESTRUTURA (composição assimétrica) ---------- */
.gal{ display:grid; gap:1.2rem; grid-template-columns:repeat(2,1fr) }
@media (min-width:900px){
  .gal{ grid-template-columns:repeat(12,1fr); grid-auto-rows:110px }
  .gal .g1{ grid-column:1/8; grid-row:1/5 }
  .gal .g2{ grid-column:8/13; grid-row:1/3 }
  .gal .g3{ grid-column:8/13; grid-row:3/6 }
  .gal .g4{ grid-column:1/5; grid-row:5/8 }
  .gal .g5{ grid-column:5/8; grid-row:5/7 }
}
.gal .ph{ height:100%; min-height:180px }

/* ---------- SEGURANÇA (seção-assinatura, escura) ---------- */
.sec-seguranca{ position:relative; overflow:hidden }
.sec-seguranca::before{
  content:''; position:absolute; top:-10%; right:-6%; width:52vw; height:52vw; max-width:780px; max-height:780px;
  border:1px solid color-mix(in srgb, var(--champagne-2) 16%, transparent); border-radius:50%;
  pointer-events:none;
}
.sec-seguranca::after{
  content:''; position:absolute; top:6%; right:4%; width:34vw; height:34vw; max-width:520px; max-height:520px;
  border:1px solid color-mix(in srgb, var(--champagne-2) 10%, transparent); border-radius:50%;
  pointer-events:none;
}
.evidencia{
  margin-top:var(--sp-4); padding:1.8rem 2rem; position:relative;
  background:color-mix(in srgb, var(--porcelain) 4%, transparent);
  border-left:2px solid var(--champagne);
}
.evidencia p{ font-family:var(--serif); font-style:italic; font-size:1.15rem; line-height:1.6;
  color:color-mix(in srgb, var(--porcelain) 88%, transparent); max-width:58ch }
.evidencia cite{ display:block; margin-top:1rem; font-family:var(--sans); font-style:normal;
  font-size:.75rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:color-mix(in srgb, var(--champagne-2) 85%, transparent) }

/* ---------- ESPECIALIDADES (grupos) ---------- */
.spec-groups{ display:grid; gap:var(--sp-5) }
.spec-group .overline{ margin-bottom:1.2rem }

/* ---------- HOTELARIA ---------- */
.sec-hotelaria{ background:var(--paper) }

/* ---------- SIMULADORES (teaser) ---------- */
.sim-tiles{ display:grid; gap:1.2rem }
@media (min-width:900px){ .sim-tiles{ grid-template-columns:repeat(3,1fr) } }
.sim-tile{
  position:relative; padding:2.6rem 2.2rem; min-height:300px;
  display:flex; flex-direction:column; justify-content:flex-end; gap:.6rem;
  background:color-mix(in srgb, var(--porcelain) 4%, transparent);
  border:1px solid color-mix(in srgb, var(--champagne-2) 22%, transparent);
  transition:all .5s var(--ease-lux); overflow:hidden;
}
.sim-tile:hover{ background:color-mix(in srgb, var(--porcelain) 8%, transparent);
  border-color:var(--champagne-2); transform:translateY(-6px) }
.sim-tile .ico{ font-family:var(--serif); font-style:italic; font-size:3.4rem; line-height:1;
  color:transparent; -webkit-text-stroke:1px var(--champagne-2); margin-bottom:auto }
.sim-tile h4{ font-family:var(--serif); font-weight:430; font-size:1.5rem }
.sim-tile p{ font-size:.92rem; color:color-mix(in srgb, var(--porcelain) 62%, transparent) }
.sim-tile .btn-line{ margin-top:1rem; align-self:flex-start }

/* ---------- PROVA SOCIAL ---------- */
.trust-band{ display:grid; gap:var(--sp-4); align-items:center }
@media (min-width:900px){ .trust-band{ grid-template-columns:1fr 1fr } }
.quote{ font-family:var(--serif); font-style:italic; font-weight:360;
  font-size:clamp(1.35rem,2.4vw,1.9rem); line-height:1.45 }
.quote footer{ margin-top:1.4rem; font-family:var(--sans); font-style:normal;
  font-size:.75rem; font-weight:600; letter-spacing:.24em; text-transform:uppercase; color:var(--stone) }

/* ---------- LOCALIZAÇÃO ---------- */
.map-frame{ position:relative; aspect-ratio:16/9; background:var(--paper); filter:grayscale(.9) sepia(.12);
  transition:filter .6s var(--ease-lux) }
.map-frame:hover{ filter:none }
.map-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0 }

/* ---------- CTA FINAL ---------- */
.sec-cta-final{ position:relative; overflow:hidden }
.sec-cta-final h2{ max-width:16ch }

/* ---------- PÁGINAS INTERNAS: cabeçalho padrão ---------- */
.page-head{
  background:var(--forest-deep); color:var(--porcelain);
  padding:calc(var(--sp-6) + 4rem) 0 var(--sp-5);
}
.page-head h1{ font-size:var(--t-display); max-width:16ch; margin-top:1.4rem }
.page-head .lead{ margin-top:1.2rem; color:color-mix(in srgb, var(--porcelain) 72%, transparent) }

/* ---------- FAQ (páginas de especialidade) ---------- */
.faq details{ border-bottom:var(--hairline); padding-block:1.3rem }
.faq details:first-child{ border-top:var(--hairline) }
.faq summary{ cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:baseline; gap:1rem;
  font-family:var(--serif); font-size:1.2rem; font-weight:440 }
.faq summary::-webkit-details-marker{ display:none }
.faq summary::after{ content:'+'; font-family:var(--serif); font-style:italic; color:var(--champagne); font-size:1.4rem; transition:transform .35s }
.faq details[open] summary::after{ transform:rotate(45deg) }
.faq details p{ margin-top:.9rem; color:var(--ink-soft); max-width:60ch }