
/* V5 — imagens em escala grande até a borda direita, mistura suave para a esquerda.
   Os textos originais permanecem inalterados. */
.detail-hero.cinematic-hero {
  position:relative; isolation:isolate; overflow:hidden;
  min-height:490px; padding:53px 0 64px;
  background:radial-gradient(circle at 79% 45%,#144481 0%,#071e49 59%,#04132e 100%);
}
.detail-hero.cinematic-hero::before {
  content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(ellipse at 83% 43%,rgba(38,105,207,.20),transparent 52%);
}
.detail-hero.cinematic-hero::after {
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg,#061735 0%,rgba(6,25,59,.98) 24%,rgba(7,29,66,.90) 38%,rgba(9,35,74,.63) 51%,rgba(5,28,67,.16) 77%,rgba(4,21,54,.06) 100%),
    linear-gradient(0deg,rgba(2,14,36,.68) 0%,rgba(3,18,47,.12) 24%,transparent 49%,rgba(3,17,42,.22) 100%);
}
.cinematic-hero .cinematic-media{
  position:absolute;right:0;top:0;bottom:0;width:76%;height:100%;
  display:block;object-fit:cover;object-position:center center;
  z-index:0;pointer-events:none;
  filter:brightness(.74) saturate(.95) contrast(1.10);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 15%,rgba(0,0,0,.8) 31%,#000 52%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 15%,rgba(0,0,0,.8) 31%,#000 52%);
}
.cinematic-hero.cinematic-portrait .cinematic-media{
  object-fit:contain;object-position:right center;width:70%;
  filter:brightness(.79) saturate(1.10) contrast(1.10) drop-shadow(-15px 10px 26px rgba(0,0,0,.35));
}
.cinematic-hero.cinematic-emblem .cinematic-media{
  object-fit:contain;object-position:right center;width:72%;
  filter:brightness(.89) saturate(1.18) contrast(1.05) drop-shadow(-12px 12px 24px rgba(0,0,0,.24));
}
.cinematic-hero.cinematic-monofasicos .cinematic-media{
  object-fit:contain;object-position:right center;width:74%;
  filter:brightness(.75) saturate(.99) contrast(1.11) drop-shadow(-10px 14px 30px rgba(0,0,0,.35));
}
.cinematic-hero .wrap{position:relative;z-index:3}
.cinematic-hero .breadcrumb{position:relative;z-index:3;margin-bottom:29px}
.cinematic-hero .detail-hero-grid{
  display:block;position:relative;min-height:315px;
}
.cinematic-hero .detail-hero-grid > div:first-child{
  position:relative;z-index:3;width: min(55%,650px);min-width:0;
}
.cinematic-hero .detail-hero-grid h1{font-size:clamp(36px,3.85vw,61px);line-height:1.075;max-width:660px;text-wrap:balance}
.cinematic-hero .detail-tag{max-width:600px;text-shadow:0 2px 14px #03142c}
.cinematic-hero .detail-lead{max-width:595px;text-shadow:0 2px 12px #03142c}
.cinematic-hero:not(.cinematic-diagnostic) .detail-visual{display:none}
.cinematic-hero.cinematic-diagnostic .detail-visual{
  position:absolute;right:0;top:1%;bottom:auto;z-index:4;
  width:43%;border:0;background:transparent;box-shadow:none;overflow:visible;
  border-radius:0;
}
.cinematic-hero.cinematic-diagnostic .diagnostic-visual{
  background:linear-gradient(145deg,rgba(6,27,66,.96),rgba(16,54,111,.9));
  border:1px solid rgba(128,181,248,.38);
  border-radius:22px;padding:28px 26px 25px;
  box-shadow:0 32px 70px rgba(0,5,30,.6),inset 0 0 20px rgba(47,126,232,.12);
  backdrop-filter:blur(8px);
}
.cinematic-hero.cinematic-diagnostic .diagnostic-pie{width:150px;height:150px;flex-basis:150px}
.cinematic-hero.cinematic-diagnostic .diagnostic-bars{height:155px}
.cinematic-hero.cinematic-diagnostic .diagnostic-legend{gap:10px}
/* Tablet: texto acima do visual em telas estreitas, imagem ainda forte e íntegra. */
@media(max-width:1024px){
  .detail-hero.cinematic-hero{min-height:480px;padding:45px 0 56px}
  .cinematic-hero .detail-hero-grid>div:first-child{width:min(56%,590px)}
  .cinematic-hero .detail-hero-grid h1{font-size:clamp(33px,4vw,49px)}
  .cinematic-hero .cinematic-media{width:78%}
  .cinematic-hero.cinematic-portrait .cinematic-media{width:64%}
  .cinematic-hero.cinematic-diagnostic .detail-visual{width:43%}
  .cinematic-hero.cinematic-diagnostic .diagnostic-pie{width:95px;height:95px;flex-basis:95px}
  .cinematic-hero.cinematic-diagnostic .diagnostic-bars{height:110px}
}
@media(max-width:700px){
  .detail-hero.cinematic-hero{padding:35px 0 0;min-height:0}
  .cinematic-hero .breadcrumb{margin-bottom:20px}
  .cinematic-hero .detail-hero-grid{min-height:0;display:block}
  .cinematic-hero .detail-hero-grid>div:first-child{width:100%;padding-bottom:20px}
  .cinematic-hero .detail-hero-grid h1{font-size:clamp(31px,8vw,43px);max-width:100%}
  .cinematic-hero .detail-tag,.cinematic-hero .detail-lead{max-width:100%}
  .cinematic-hero .cinematic-media{
     position:relative;inset:auto;width:100%;height:260px;
     object-fit:cover;object-position:center;
     margin-top:12px;
     -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 70%,transparent 100%);
     mask-image:linear-gradient(180deg,#000 0%,#000 70%,transparent 100%);
  }
  .cinematic-hero.cinematic-portrait .cinematic-media,
  .cinematic-hero.cinematic-emblem .cinematic-media,
  .cinematic-hero.cinematic-monofasicos .cinematic-media{
    width:100%;height:300px;object-fit:contain;object-position:center center;
    margin-top:0;
  }
  .detail-hero.cinematic-hero::after{
    background:linear-gradient(180deg,#061735 0%,rgba(6,27,63,.95) 44%,rgba(8,36,83,.38) 75%,rgba(4,21,54,.25) 100%);
  }
  .cinematic-hero.cinematic-diagnostic .detail-visual{
    position:relative;top:auto;right:auto;bottom:auto;width:100%;margin:0 auto 16px;z-index:4
  }
  .cinematic-hero.cinematic-diagnostic .cinematic-media{position:absolute;inset:auto 0 0;width:100%;height:270px;opacity:.35}
  .cinematic-hero.cinematic-diagnostic .diagnostic-visual{padding:17px 16px}
  .cinematic-hero.cinematic-diagnostic .diagnostic-pie{width:113px;height:113px;flex-basis:113px}
  .cinematic-hero.cinematic-diagnostic .diagnostic-bars{height:125px}
}
@media(max-width:400px){
  .cinematic-hero .detail-hero-grid h1{font-size:31px}
  .cinematic-hero.cinematic-portrait .cinematic-media,
  .cinematic-hero.cinematic-monofasicos .cinematic-media{height:252px}
  .cinematic-hero.cinematic-diagnostic .diagnostic-pie{width:96px;height:96px;flex-basis:96px}
  .cinematic-hero.cinematic-diagnostic .diagnostic-bars{height:112px}
}
@media(prefers-reduced-motion:reduce){
  .cinematic-hero .diagnostic-bars span,.cinematic-hero .diagnostic-pie{animation:none!important}
}

/* Ajuste da página de IR: fotografia de paciente acamado à direita,
   textos reais do HTML restaurados e sempre acima da fotografia. */
.cinematic-hero.cinematic-illness {
 background:#061938;
}
.cinematic-hero.cinematic-illness .cinematic-media {
 width:82%;object-position:right 40%;
 filter:brightness(.92) saturate(.94) contrast(1.06);
 -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.27) 15%,rgba(0,0,0,.85) 38%,#000 60%);
 mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.27) 15%,rgba(0,0,0,.85) 38%,#000 60%);
}
.cinematic-hero.cinematic-illness::after {
 background:linear-gradient(90deg,#061735 0%,rgba(6,24,55,.96) 23%,rgba(6,24,55,.79) 38%,rgba(6,24,55,.26) 65%,rgba(5,22,51,.06) 100%),linear-gradient(0deg,rgba(2,12,35,.34),transparent 32%);
}
.cinematic-hero.cinematic-illness .detail-hero-grid>div:first-child {width:min(54%,630px)}
.cinematic-hero.cinematic-illness .detail-hero-grid h1,
.cinematic-hero.cinematic-illness .detail-tag,
.cinematic-hero.cinematic-illness .detail-lead {position:relative;z-index:4}
@media(max-width:700px){
  .cinematic-hero.cinematic-illness .detail-hero-grid>div:first-child{width:100%}
  .cinematic-hero.cinematic-illness .cinematic-media{
    width:100%;height:265px;object-fit:cover;object-position:center;
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 76%,transparent 100%);
    mask-image:linear-gradient(180deg,#000 0%,#000 76%,transparent 100%);
  }
  .cinematic-hero.cinematic-illness::after{
    background:linear-gradient(180deg,#061735 0%,rgba(6,24,55,.94) 42%,rgba(6,24,55,.08) 77%,rgba(5,22,51,.18) 100%);
  }
}
