/* =============================================================================
   Dra. Mónica Álvarez · sujetos v2 (Hugo, 27-sep-2026)
   Nuevas fotos de la doctora (PNG 2048×2048 tal cual). Solo ajustes de tamaño/posición
   por encuadre y técnica de presentación de cada sección; el diseño no cambia.
   ============================================================================= */

/* avatares de las hojas: recorte al rostro con CSS a partir del PNG del héroe */
.mon-av{position:relative;flex:none;border-radius:50%;overflow:hidden;background:var(--sky-100)}
.mon-av img{position:absolute;left:50%;top:-24%;width:262%;height:auto;max-width:none;translate:-50% 0}
.mon-sheet__who .mon-av{width:62px;height:62px}
.mon-vcard__who .mon-av{width:60px;height:60px;box-shadow:0 0 0 3px var(--blue)}

/* ───────── SITIO WEB ───────── */
@media (min-width:1025px) and (min-aspect-ratio:10001/11000){
  /* Overview: pop-out — la cabeza sale de la cápsula negra, el cuerpo se corta en la base */
  .mon-ov__fig{clip-path:inset(-50% -50% 0 -50%)}
  .mon-ov__fig img{bottom:auto;top:-14.5%;height:145%;translate:-49% 0}
  /* Experiencia: anclada al arco, un poco más cerca */
  .mon-ex__fig{clip-path:inset(-50% -50% 0 -50%)}
  .mon-ex__fig img{bottom:auto;top:-11.5%;height:118%;translate:-50.8% 0}
  /* Opiniones: sobre el arco, a la escucha */
  .mon-ts__fig{clip-path:inset(-50% -50% 0 -50%)}
  .mon-ts__fig img{bottom:auto;top:-13%;height:118%;translate:-55% 0}
  /* Banner: saludando, sale por encima de la franja cian y se corta en su base */
  .mon-cb__fig{clip-path:inset(-100vh -100vw 0 -100vw)}
  .mon-cb__fig img{bottom:auto;translate:-50.5% 0;
    top:calc(-1*(clamp(90px,8vw,130px) - 20px) - .0986*(100% + clamp(90px,8vw,130px) - 20px));
    height:calc(1.3*(100% + clamp(90px,8vw,130px) - 20px))}
}

/* ───────── APP (celular y tableta) ───────── */
@media (max-width:1024px),(max-aspect-ratio:10/11){
  /* héroe: retrato de busto → un poco más chico para que la cabeza respire bajo el nombre */
  .mon-subject{top:calc(var(--sub-top) - (100% - var(--sub-top))*.06);height:calc((100% - var(--sub-top))*1.22)}
  .mon-ov__fig{clip-path:inset(-50% -50% 0 -50%)}
  .mon-ov__fig img{bottom:auto;top:-14.5%;height:140%;translate:-49% 0}
  .mon-ex__fig img{bottom:auto;top:-15.5%;height:140%;translate:-50.8% 0}
  .mon-ts__fig{clip-path:inset(-50% -50% 0 -50%)}
  .mon-ts__fig img{bottom:auto;top:-16%;height:125%}
  .mon-cb__fig img{bottom:auto;top:-15%;height:140%;translate:-50.5% 0}
}