/* Navegación principal */
.site-header{height:88px;padding:0 max(3vw,24px);background:rgba(255,253,249,.96);border-bottom:1px solid rgba(59,45,56,.12);box-shadow:0 8px 30px rgba(45,34,43,.035)}.header-inner{display:flex;align-items:center;justify-content:space-between;width:min(1720px,100%);height:100%;margin:auto;gap:2rem}.site-header .brand{min-width:max-content;gap:.75rem}.site-header .brand img{max-width:180px;height:52px;object-fit:contain}.brand-copy{display:flex;flex-direction:column;line-height:1.2}.brand-copy strong{max-width:240px;font-size:.9rem}.brand-copy small{max-width:240px;margin-top:.2rem;color:#7a7178;font-size:.68rem;font-weight:500}.site-header nav{display:flex;align-items:center;justify-content:flex-end;gap:clamp(1rem,2vw,2rem)}.nav-links{display:flex;align-items:center;gap:clamp(.85rem,1.25vw,1.4rem)}.site-header .nav-links a{position:relative;padding:.45rem 0;color:#514a50;font-size:.79rem;font-weight:650;text-decoration:none;white-space:nowrap}.site-header .nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:.1rem;height:2px;background:var(--accent);transition:right .25s ease}.site-header .nav-links a:hover,.site-header .nav-links a[aria-current=true]{color:var(--primary)}.site-header .nav-links a:hover:after,.site-header .nav-links a[aria-current=true]:after{right:0}.nav-appointment{gap:.55rem;flex:none;padding:.72rem 1.05rem;font-size:.78rem}.nav-appointment span{transition:transform .25s ease}.nav-appointment:hover span{transform:translateX(.2rem)}.menu-toggle{width:46px;height:42px;padding:9px;border:1px solid #d6ccd2;border-radius:50%;background:#fff;cursor:pointer;position:relative}.menu-toggle span{display:block;width:20px;height:1.5px;margin:4px auto;background:var(--primary);transition:transform .25s ease,opacity .25s ease}.menu-toggle b{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.menu-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0}.menu-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}

/* Footer informativo */
.site-footer{display:block;padding:0;background:#211c23;color:#fff}.footer-main{display:grid;grid-template-columns:minmax(280px,1.25fr) repeat(3,minmax(150px,.65fr));gap:clamp(2.5rem,6vw,7rem);width:min(1500px,90%);margin:auto;padding:clamp(4rem,7vw,7rem) 0}.footer-identity{max-width:420px}.footer-brand{display:flex;align-items:center;gap:.85rem;color:#fff;text-decoration:none}.footer-brand img{max-width:210px;max-height:64px;object-fit:contain;object-position:left}.footer-brand strong{font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.25rem,2vw,1.8rem);font-weight:500}.footer-tagline{margin:1.5rem 0 .6rem;color:#f0e9ee;font-size:1.02rem}.footer-note{max-width:42ch;margin:.55rem 0;color:#aca2aa;font-size:.85rem;line-height:1.7}.footer-nav,.footer-locations,.footer-contact{display:flex;align-items:flex-start;flex-direction:column;gap:.7rem}.footer-nav>strong,.footer-locations>strong,.footer-contact>strong{margin-bottom:.55rem;color:#fff;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}.footer-nav>a,.footer-locations>a,.footer-contact>a{color:#c8bec6;font-size:.84rem;line-height:1.45;text-decoration:none;transition:color .2s ease,transform .2s ease}.footer-locations>a{max-width:27ch}.footer-nav>a:hover,.footer-locations>a:hover,.footer-contact>a:hover{color:#fff;transform:translateX(3px)}.footer-social{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.6rem}.footer-social a{padding-bottom:.1rem;color:#fff;font-size:.78rem;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.3)}.footer-bottom{display:grid;grid-template-columns:1fr auto auto;gap:2rem;align-items:center;width:min(1500px,90%);margin:auto;padding:1.5rem 0;border-top:1px solid rgba(255,255,255,.12);color:#958b93;font-size:.72rem}.footer-bottom a{color:#bcb2ba;text-decoration:none}.footer-bottom a:hover{color:#fff}

@media(max-width:1180px){body.nav-open{overflow:hidden}.menu-toggle{display:block;z-index:2}.site-header nav{display:none;position:absolute;inset:88px 0 auto;padding:1.2rem max(5vw,24px) 1.6rem;background:#fffdf9;border-bottom:1px solid #dcd3d8;box-shadow:0 22px 40px rgba(45,34,43,.12)}.site-header nav.open{display:block}.nav-links{align-items:stretch;flex-direction:column;gap:0}.site-header .nav-links a{padding:.72rem 0;border-bottom:1px solid #e6dfe3;font-size:.9rem}.site-header .nav-links a:after{display:none}.nav-appointment{display:flex;margin-top:1rem}.footer-main{grid-template-columns:1.2fr repeat(2,1fr)}.footer-identity{grid-column:1/-1}.footer-contact{grid-column:auto}}
@media(max-width:700px){.site-header{height:74px}.site-header nav{inset:74px 0 auto;max-height:calc(100svh - 74px);overflow:auto}.site-header .brand img{max-width:145px;height:45px}.brand-copy small{display:none}.brand-copy strong{max-width:190px;font-size:.82rem}.footer-main{grid-template-columns:1fr 1fr;width:calc(100% - 2.5rem);padding:4rem 0}.footer-identity{grid-column:1/-1}.footer-locations{grid-column:1/-1}.footer-bottom{grid-template-columns:1fr;width:calc(100% - 2.5rem);gap:.55rem;padding:1.4rem 0 2rem}.footer-bottom span:nth-child(2){max-width:36ch}}
@media(max-width:420px){.brand-copy strong{max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.footer-main{grid-template-columns:1fr}.footer-nav,.footer-locations,.footer-contact{grid-column:auto}}
@media(prefers-reduced-motion:reduce){.site-header .nav-links a:after,.nav-appointment span,.menu-toggle span,.footer-nav>a,.footer-locations>a,.footer-contact>a{transition:none}.nav-appointment:hover span,.footer-nav>a:hover,.footer-locations>a:hover,.footer-contact>a:hover{transform:none}}


/* =========================================================
   HEADER — ESPECIALIDAD MÉDICA MÁS VISIBLE
   SOLO afecta la segunda línea de identidad del encabezado.
   ========================================================= */

.site-header .brand-copy small{
  display:block !important;
  max-width:310px !important;
  margin-top:.24rem !important;
  color:var(--primary) !important;
  font-size:.76rem !important;
  font-weight:850 !important;
  line-height:1.25 !important;
  letter-spacing:.055em !important;
  text-transform:uppercase !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
}

/* Móvil: mantenerla visible, legible y sin cortar palabras. */
@media(max-width:700px){
  .site-header .brand-copy small{
    display:block !important;
    max-width:230px !important;
    margin-top:.18rem !important;
    font-size:.68rem !important;
    font-weight:850 !important;
    line-height:1.18 !important;
    letter-spacing:.035em !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }
}

@media(max-width:420px){
  .site-header .brand-copy small{
    max-width:205px !important;
    font-size:.64rem !important;
    letter-spacing:.025em !important;
  }
}


/* =========================================================
   NAVBAR V2 — GALERÍA + TIPOGRAFÍA DESKTOP MÁS VISIBLE
   SOLO afecta enlaces del menú en escritorio.
   Móvil conserva sus tamaños actuales.
   ========================================================= */
@media (min-width:1181px){
  .site-header .nav-links a{
    font-size:.86rem !important;
  }
}


/* =========================================================
   NAVBAR V3 — MENÚ MÓVIL DISPONIBLE EN CUALQUIER SCROLL
   SOLO corrige posición/staking del header y menú móvil.
   No cambia diseño, textos, tamaños ni enlaces.
   ========================================================= */

@media(max-width:1180px){

  /* Reafirma que el header permanezca visible durante todo el scroll */
  .site-header{
    position:sticky !important;
    top:0 !important;
    z-index:1000 !important;
  }

  .site-header .header-inner{
    position:relative;
    z-index:1001;
  }

  .menu-toggle{
    position:relative !important;
    z-index:1003 !important;
    flex:0 0 auto;
  }

  /* El menú ya no depende de la posición del documento.
     Se abre siempre debajo del header visible actual. */
  .site-header nav{
    position:fixed !important;

    top:88px !important;
    left:0 !important;
    right:0 !important;
    bottom:auto !important;

    width:100% !important;
    max-width:none !important;
    max-height:calc(100dvh - 88px) !important;

    margin:0 !important;

    overflow-y:auto !important;
    overscroll-behavior:contain;

    z-index:1002 !important;

    -webkit-overflow-scrolling:touch;
  }

  .site-header nav.open{
    display:block !important;
  }
}

/* Altura real del header en móvil */
@media(max-width:700px){
  .site-header nav{
    top:74px !important;
    max-height:calc(100dvh - 74px) !important;
  }
}

/* Fallback para navegadores sin dvh */
@supports not (height:100dvh){
  @media(max-width:1180px){
    .site-header nav{
      max-height:calc(100vh - 88px) !important;
    }
  }

  @media(max-width:700px){
    .site-header nav{
      max-height:calc(100vh - 74px) !important;
    }
  }
}


/* =========================================================
   NAVBAR V4 — HEADER FIJO REAL EN MÓVIL/TABLET
   Corrección robusta:
   - header siempre visible durante el scroll
   - menú abre desde cualquier posición
   - evita salto/desaparición por body.nav-open
   SOLO afecta <=1180px
   ========================================================= */

@media(max-width:1180px){

  /* Compensa el header fixed para no tapar el contenido */
  body{
    padding-top:88px !important;
  }

  /* Header completamente independiente del scroll */
  .site-header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;

    width:100% !important;

    margin:0 !important;

    z-index:5000 !important;

    transform:none !important;
    translate:none !important;
  }

  .site-header .header-inner{
    position:relative !important;
    z-index:5001 !important;
  }

  .menu-toggle{
    position:relative !important;
    z-index:5003 !important;
  }

  /* Evita que al abrir el menú el navegador altere el sticky/fixed
     o salte de posición. El menú ya tiene su propio scroll interno. */
  body.nav-open{
    overflow:auto !important;
  }

  /* Panel siempre anclado al viewport */
  .site-header nav{
    position:fixed !important;

    top:88px !important;
    left:0 !important;
    right:0 !important;
    bottom:auto !important;

    width:100% !important;

    max-height:calc(100dvh - 88px) !important;

    margin:0 !important;

    overflow-x:hidden !important;
    overflow-y:auto !important;

    z-index:5002 !important;

    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;

    transform:none !important;
    translate:none !important;
  }

  .site-header nav.open{
    display:block !important;
  }
}

/* Header móvil de 74px */
@media(max-width:700px){

  body{
    padding-top:74px !important;
  }

  .site-header{
    height:74px !important;
  }

  .site-header nav{
    top:74px !important;
    max-height:calc(100dvh - 74px) !important;
  }
}

/* Fallback para navegadores sin dvh */
@supports not (height:100dvh){

  @media(max-width:1180px){
    .site-header nav{
      max-height:calc(100vh - 88px) !important;
    }
  }

  @media(max-width:700px){
    .site-header nav{
      max-height:calc(100vh - 74px) !important;
    }
  }
}