/* ==========================================================================
   ESCALA DE ESCRITORIO v1 · Lic. Fernando Echeverría · 15-oct-2026
   Problema: en laptops (pantalla 1920×1080 con Windows al 125 % / 150 %, o
   1366×768) el navegador ve ~1536×730 o ~1280×600. Las secciones estaban
   calibradas solo por ANCHO (vw) y medían 1.4–2 pantallas de alto.
   Solución (SOLO escritorio ≥1025px y horizontal con mouse (no tabletas táctiles), SOLO pantallas de menos de 1000 px de alto):
   1) Las secciones (no el héroe) se escalan en proporción a la altura de la
      pantalla con `zoom` (≈ altura ÷ 960, mínimo .72): se ven igual que en un
      monitor 1920×1080 al 100 %.
   2) Los márgenes verticales grandes dejan de depender solo del ancho.
   No toca: héroe (#inicio), barras de navegación, hojas emergentes, botón de
   WhatsApp, celular ni tableta. En monitores de 1000 px de alto o más no
   cambia nada. Se carga al final para no alterar los demás archivos.
   ========================================================================== */
@media (min-width:1025px) and (min-aspect-ratio:10/11) and (hover:hover) and (pointer:fine) and (max-height:999.98px){:root{--esc-z:1}}
@media (min-width:1025px) and (min-aspect-ratio:10/11) and (hover:hover) and (pointer:fine) and (max-height:959.98px){:root{--esc-z:0.979}}
@media (min-width:1025px) and (min-aspect-ratio:10/11) and (hover:hover) and (pointer:fine) and (max-height:919.98px){:root{--esc-z:0.938}}
@media (min-width:1025px) and (min-aspect-ratio:10/11) and (hover:hover) and (pointer:fine) and (max-height:879.98px){:root{--esc-z:0.896}}
@media (min-width:1025px) and (min-aspect-ratio:10/11) and (hover:hover) and (pointer:fine) and (max-height:839.98px){:root{--esc-z:0.854}}
@media (min-width:1025px) and (min-aspect-ratio:10/11) and (hover:hover) and (pointer:fine) and (max-height:799.98px){:root{--esc-z:0.812}}
@media (min-width:1025px) and (min-aspect-ratio:10/11) and (hover:hover) and (pointer:fine) and (max-height:759.98px){:root{--esc-z:0.771}}
@media (min-width:1025px) and (min-aspect-ratio:10/11) and (hover:hover) and (pointer:fine) and (max-height:719.98px){:root{--esc-z:0.729}}
@media (min-width:1025px) and (min-aspect-ratio:10/11) and (hover:hover) and (pointer:fine) and (max-height:679.98px){:root{--esc-z:.72}}
@media (min-width:1025px) and (min-aspect-ratio:10/11) and (hover:hover) and (pointer:fine) and (max-height:999.98px){
  main > section:not(#inicio), #footer{zoom:var(--esc-z,1)}
  /* las columnas fijas al hacer scroll conservan su distancia a la barra */
  .fe-fq__side{top:calc(110px / var(--esc-z,1))}
  /* el salto desde el menú queda justo debajo de la barra fija, igual que antes */
  main > section:not(#inicio){scroll-margin-top:calc(84px / var(--esc-z,1))}
}
@media (min-width:1025px) and (min-aspect-ratio:10/11) and (hover:hover) and (pointer:fine) and (max-height:999.98px){
  :root{--esc-py:clamp(56px,min(7.6vw,12svh),150px)}
  :is(#overview,#servicios,#sobre-mi,#experiencia,#testimonios,#ubicacion,#contacto,#faq,#tarjeta).fe-s{padding-top:var(--esc-py)}
  :is(#servicios,#ubicacion,#contacto,#faq,#tarjeta).fe-s{padding-bottom:var(--esc-py)}
  .fe-ov__txt,.fe-ab__txt,.fe-ts__main{padding-bottom:var(--esc-py)}
  .fe-bn{padding-top:clamp(60px,min(8vw,13svh),160px)}
}
