/* ALTHA — Cambios solicitados: WhatsApp flotante, menú estable, cinta y redes. */
/* El navbar sticky no se vuelve fixed. Sin cambios de overflow o posición del documento. */
@media(max-width:900px){
  html.altha-scroll-locked,html.altha-scroll-locked body,body.drawer-open{
    overflow:visible!important;overscroll-behavior:auto!important;
  }
  body.drawer-open .header{
    position:sticky!important;top:0!important;left:auto!important;right:auto!important;
    width:auto!important;max-width:none!important;margin:0!important;
  }
  .altha-whatsapp-float{
    position:fixed;right:max(14px,env(safe-area-inset-right));
    bottom:calc(18px + env(safe-area-inset-bottom));
    z-index:175;display:inline-flex;align-items:center;justify-content:center;gap:10px;
    max-width:calc(100vw - 28px);min-height:58px;padding:10px 17px;
    border-radius:100px;color:white;background:#20C864;border:1px solid #11A850;
    box-shadow:0 8px 22px rgba(0,0,0,.25);font:750 clamp(14px,3.65vw,17px)/1.15 system-ui,-apple-system,Segoe UI,Arial,sans-serif;
    text-decoration:none;white-space:nowrap;-webkit-tap-highlight-color:transparent;
  }
  .altha-whatsapp-float svg{width:28px;height:28px;display:block;flex-shrink:0;color:white}
  .altha-whatsapp-float:focus-visible{outline:3px solid #fff;outline-offset:3px}
  body.drawer-open .altha-whatsapp-float,body:has(#search-dialog[open]) .altha-whatsapp-float,
  body:has(.inquiry-panel input:focus) .altha-whatsapp-float,
  body:has(.inquiry-panel textarea:focus) .altha-whatsapp-float,
  body:has(.inquiry-panel select:focus) .altha-whatsapp-float{opacity:0;visibility:hidden;pointer-events:none}
  body:has(.altha-whatsapp-float) footer{padding-bottom:calc(95px + env(safe-area-inset-bottom))}
}
@media(max-width:350px){.altha-whatsapp-float{padding:10px 13px;gap:8px;font-size:13px;min-height:54px}.altha-whatsapp-float svg{width:25px;height:25px}}
@media(min-width:901px){.altha-whatsapp-float{display:none!important}}
/* La cinta tipográfica sigue siendo continua y se detiene únicamente con mouse encima,
   sin controles manuales. En dispositivos con reduce motion se respeta la preferencia del sistema. */
.marquee-group{font-weight:800!important}
.marquee-track{animation:ticker 35s linear infinite}
@media(hover:hover){.marquee:hover .marquee-track{animation-play-state:paused!important}}
/* Instagram: icono naranja y enlace accesible, sin texto decorativo. */
a[href*="instagram.com/althaconstrucciones"]{display:inline-flex;align-items:center;justify-content:center;color:#F48C54!important;min-width:36px;min-height:36px}
a[href*="instagram.com/althaconstrucciones"] .altha-instagram-icon{width:23px;height:23px;display:block;color:#F48C54;flex-shrink:0}
a[href*="instagram.com/althaconstrucciones"]:focus-visible{outline:2px solid #F48C54;outline-offset:3px}
.mobile-drawer .drawer-instagram{align-self:flex-start}
/* Imagen futura sin cambiar el hero de hoy. Al activar heroBanner, el texto permanece legible. */
.hero.has-hero-banner{background-position:34% center!important;background-size:cover!important;background-repeat:no-repeat!important}
.hero.has-hero-banner .hero-light{opacity:.22}
@media(max-width:900px){.hero.has-hero-banner{background-position:24% center!important}}
@media(max-width:560px){.hero.has-hero-banner{background-position:21% center!important}}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none!important}}


/* Ajustes solicitados: menú móvil al estilo de la referencia, sin tocar el navbar. */
@media(max-width:900px){
  .mobile-drawer .drawer-scroll{padding:0 0 1.2rem!important}
  .mobile-drawer .drawer-main{
    display:flex!important;flex-direction:column!important;align-items:stretch!important;
    gap:0!important;margin:0!important;padding:17px 0 0!important;
  }
  .mobile-drawer .drawer-main>a{
    display:flex!important;align-items:center!important;justify-content:flex-start!important;
    min-height:63px!important;width:100%!important;
    padding:0 clamp(26px,7.5vw,40px)!important;
    margin:0!important;border:0!important;border-bottom:0!important;
    background:transparent!important;border-radius:0!important;box-shadow:none!important;
    color:#F48C54!important;font-family:Arial,Helvetica,sans-serif!important;
    font-size:20px!important;font-weight:400!important;line-height:1.3!important;
    letter-spacing:0!important;text-align:left!important;
    transform:none!important;transition:none!important;
  }
  .mobile-drawer .drawer-main>a:is(:hover,:active,:focus){
    padding-left:clamp(26px,7.5vw,40px)!important;
    color:#F48C54!important;transform:none!important;
  }
  .mobile-drawer .drawer-main>a[aria-current="page"],
  .mobile-drawer .drawer-main>a[aria-current="page"]:is(:hover,:focus,:active){
    background:rgba(22,27,31,.075)!important;
    color:#F48C54!important;
    font-weight:400!important;
  }
  .mobile-drawer .drawer-search-link{display:none!important}
  .mobile-drawer .drawer-accordion{
    margin:0!important;padding:0!important;border:0!important;
    background:transparent!important;
  }
  .mobile-drawer .drawer-accordion>summary{
    display:flex!important;align-items:center!important;justify-content:space-between!important;
    min-height:63px!important;width:100%!important;
    padding:0 clamp(26px,7.5vw,40px)!important;margin:0!important;
    border:0!important;border-top:0!important;border-bottom:0!important;
    border-radius:0!important;background:transparent!important;
    color:#F48C54!important;font-family:Arial,Helvetica,sans-serif!important;
    font-size:20px!important;font-weight:400!important;letter-spacing:0!important;
    line-height:1.3!important;transition:none!important;
  }
  .mobile-drawer .drawer-accordion-icon{font-size:22px!important;font-weight:400!important;color:#F48C54!important}
  .mobile-drawer #drawer-categories{
    padding:0 clamp(26px,7.5vw,40px) 8px!important;gap:0!important;
  }
  .mobile-drawer #drawer-categories a{
    min-height:46px!important;padding:10px 0!important;
    color:#F48C54!important;font-family:Arial,Helvetica,sans-serif!important;
    font-size:17px!important;font-weight:400!important;line-height:1.3!important;
    border:0!important;border-bottom:0!important;
  }
  .mobile-drawer .drawer-secondary{margin:12px clamp(26px,7.5vw,40px) 0!important}
  .mobile-drawer .drawer-footer{
    display:flex!important;flex-direction:row!important;align-items:center!important;
    justify-content:flex-start!important;gap:0!important;
    margin-top:auto!important;
    padding:10px clamp(24px,6vw,40px) max(18px,env(safe-area-inset-bottom))!important;
    border-top:0!important;background:var(--altha-menu-surface)!important;
  }
  .mobile-drawer .drawer-social-links{display:flex;flex-direction:row;align-items:center;gap:9px}
  .mobile-drawer .drawer-social-links>a{
    width:46px!important;height:46px!important;min-width:46px!important;min-height:46px!important;
    padding:9px!important;border:0!important;border-radius:0!important;
    background:transparent!important;color:#F48C54!important;
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    margin:0!important;text-decoration:none!important;
  }
  .mobile-drawer .drawer-social-links svg{
    width:25px!important;height:25px!important;display:block!important;
    color:#F48C54!important;stroke:currentColor;
  }
  .mobile-drawer .drawer-cta{display:none!important}
  /* WhatsApp permanece sobre el menú, con el mismo enlace y posición de siempre. */
  .altha-whatsapp-float,
  body.drawer-open .altha-whatsapp-float{
    position:fixed!important;z-index:260!important;
    display:inline-flex!important;opacity:1!important;
    visibility:visible!important;pointer-events:auto!important;
  }
}
/* Se habilita el botón existente de WhatsApp también en computadora. */
@media(min-width:901px){
  .altha-whatsapp-float{
    position:fixed!important;right:max(18px,env(safe-area-inset-right))!important;
    bottom:calc(18px + env(safe-area-inset-bottom))!important;
    z-index:260!important;display:inline-flex!important;
    align-items:center!important;justify-content:center!important;gap:10px!important;
    padding:11px 18px!important;min-height:58px!important;
    max-width:calc(100vw - 28px)!important;
    background:#20C864!important;color:#fff!important;
    border:1px solid #11A850!important;border-radius:100px!important;
    box-shadow:0 8px 22px rgba(0,0,0,.25)!important;
    font:750 16px/1.15 system-ui,-apple-system,Segoe UI,Arial,sans-serif!important;
    text-decoration:none!important;white-space:nowrap!important;
  }
  .altha-whatsapp-float svg{width:28px;height:28px;display:block;flex-shrink:0;color:#fff}
  .altha-whatsapp-float:focus-visible{outline:3px solid #fff;outline-offset:3px}
  body:has(.altha-whatsapp-float) footer{padding-bottom:90px}
}
/* En pantallas muy angostas, mantener los iconos separados del WhatsApp flotante. */
@media(max-width:370px){
  .mobile-drawer .drawer-footer{padding-bottom:calc(98px + env(safe-area-inset-bottom))!important}
}

/* ALTHA · Ajuste de color y selección del menú (25-10-2026).
   Exclusivamente móvil. No modifica tamaños, posición, estructura ni animación del navbar. */
@media (max-width:900px){
  :root{
    --altha-menu-surface:#F48C54;
    --altha-menu-ink:#161B1F;
  }
  /* Solo los iconos del navbar, incluida la X al abrir el menú. */
  .header .search-trigger,
  .header .menu-toggle,
  .header .search-trigger:is(:hover,:active,:focus),
  .header .menu-toggle:is(:hover,:active,:focus),
  body.drawer-open .header .menu-toggle{
    color:#F48C54!important;
  }
  .header .menu-toggle span{background:currentColor!important}

  /* Fondo corporativo uniforme en las tres zonas del sidebar. */
  .mobile-drawer,
  body.drawer-open .mobile-drawer,
  .mobile-drawer .drawer-scroll,
  .mobile-drawer .drawer-main,
  .mobile-drawer .drawer-accordion,
  .mobile-drawer .drawer-footer{
    background:#F48C54!important;
    color:#161B1F!important;
  }
  /* Textos e iconos oscuros sobre naranja, sin cambiar la distribución. */
  .mobile-drawer .drawer-main>a,
  .mobile-drawer .drawer-main>a:is(:hover,:focus,:active),
  .mobile-drawer .drawer-main>a[aria-current="page"],
  .mobile-drawer .drawer-main>a[aria-current="page"]:is(:hover,:focus,:active),
  .mobile-drawer .drawer-accordion>summary,
  .mobile-drawer .drawer-accordion-icon,
  .mobile-drawer #drawer-categories a,
  .mobile-drawer .drawer-secondary a,
  .mobile-drawer .drawer-social-links>a,
  .mobile-drawer .drawer-social-links svg{
    color:#161B1F!important;
  }
  /* Zona tocable de 63px intacta; el rectángulo activo es 12px menos alto
     (6px menos arriba y abajo), con el texto exactamente centrado. */
  .mobile-drawer .drawer-main>a[aria-current="page"],
  .mobile-drawer .drawer-main>a[aria-current="page"]:is(:hover,:focus,:active){
    background:linear-gradient(to bottom,
      transparent 0, transparent 6px,
      rgba(22,27,31,.13) 6px,
      rgba(22,27,31,.13) calc(100% - 6px),
      transparent calc(100% - 6px), transparent 100%)!important;
  }
}

/* === Override final: especialidades con imágenes y proyectos en dos columnas === */
#especialidades .category-grid,
.categories-page-section .category-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.3rem;background:transparent;border:0}
#especialidades .category-card,
#especialidades .category-card:nth-child(3n+2),
#especialidades .category-card:nth-child(3n),
.categories-page-section .category-card,
.categories-page-section .category-card:nth-child(3n+2),
.categories-page-section .category-card:nth-child(3n){background:#F7F4EE;border:1px solid #D9D3C8;border-radius:4px;min-height:0;padding:0;overflow:hidden;color:var(--ink)}
#especialidades .category-card::before,
#especialidades .category-card::after,
.categories-page-section .category-card::before,
.categories-page-section .category-card::after{display:none!important}
#especialidades .category-card:hover,
#especialidades .category-card:focus-visible,
.categories-page-section .category-card:hover,
.categories-page-section .category-card:focus-visible{transform:translateY(-6px);box-shadow:0 22px 44px rgba(22,27,31,.12);border-color:#c9c1b3;color:var(--ink)}
#especialidades .category-card-media,
.categories-page-section .category-card-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:#2D3438}
#especialidades .category-card-media img,
.categories-page-section .category-card-media img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .8s var(--ease),filter .4s var(--ease)}
#especialidades .category-card:hover .category-card-media img,
#especialidades .category-card:focus-visible .category-card-media img,
.categories-page-section .category-card:hover .category-card-media img,
.categories-page-section .category-card:focus-visible .category-card-media img{transform:scale(1.05)}
#especialidades .category-card-media::after,
.categories-page-section .category-card-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,18,20,.06) 5%,rgba(15,18,20,.24) 48%,rgba(15,18,20,.7) 100%)}
#especialidades .category-card-top,
.categories-page-section .category-card-top{position:absolute;inset:1rem 1rem auto 1rem;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:1rem}
#especialidades .category-index,
.categories-page-section .category-index{color:#fff;font-size:.78rem;letter-spacing:.12em}
#especialidades .category-icon-badge,
.categories-page-section .category-icon-badge{background:rgba(248,245,239,.92);border-color:rgba(255,255,255,.6);color:#162022;backdrop-filter:blur(10px)}
#especialidades .category-card:hover .category-icon-badge,
#especialidades .category-card:focus-visible .category-icon-badge,
.categories-page-section .category-card:hover .category-icon-badge,
.categories-page-section .category-card:focus-visible .category-icon-badge{transform:none;background:rgba(248,245,239,.96);border-color:rgba(255,255,255,.78);box-shadow:none;color:#162022}
#especialidades .category-card-body,
.categories-page-section .category-card-body{padding:1.2rem 1.15rem 1.1rem;display:flex;flex-direction:column;gap:1rem;flex:1}
#especialidades .category-card-copy,
.categories-page-section .category-card-copy{display:flex;flex-direction:column;gap:.7rem}
#especialidades .category-card h3,
.categories-page-section .category-card h3{font-size:clamp(1.45rem,2.15vw,2.15rem);font-weight:500;letter-spacing:-.048em;line-height:1.08;max-width:none;margin:0}
#especialidades .category-subtitle,
.categories-page-section .category-subtitle{color:#697173;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
#especialidades .category-card:hover .category-subtitle,
#especialidades .category-card:focus-visible .category-subtitle,
.categories-page-section .category-card:hover .category-subtitle,
.categories-page-section .category-card:focus-visible .category-subtitle{color:#697173}
#especialidades .category-card-copy p,
.categories-page-section .category-card-copy p{margin:0;color:#576064;font-size:.97rem;line-height:1.58}
#especialidades .category-project-count,
.categories-page-section .category-project-count{margin-top:auto;padding-top:.95rem;border-top:1px solid #D7D1C4;display:flex;align-items:center;justify-content:space-between;gap:1rem}
#especialidades .category-availability,
.categories-page-section .category-availability{font-size:.88rem;color:#5F6768;line-height:1.45}
#especialidades .category-cta-arrow,
.categories-page-section .category-cta-arrow{display:inline-flex;align-items:center;gap:.55rem;font-size:.77rem;letter-spacing:.11em;text-transform:uppercase;color:#183B39;font-weight:700;white-space:nowrap}
#especialidades .category-cta-arrow svg,
.categories-page-section .category-cta-arrow svg{width:1.15rem;height:1.15rem;transition:transform .28s var(--ease),color .28s var(--ease)}
#especialidades .category-card:hover .category-cta-arrow svg,
#especialidades .category-card:focus-visible .category-cta-arrow svg,
.categories-page-section .category-card:hover .category-cta-arrow svg,
.categories-page-section .category-card:focus-visible .category-cta-arrow svg{transform:translateX(4px);color:var(--copper)}
#especialidades .category-card .category-card-bottom,
.categories-page-section .category-card .category-card-bottom{transform:none!important}
#project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem 1.8rem}
#project-grid>.project-card:first-child{grid-column:auto}
#project-grid>.project-card:first-child .project-visual{aspect-ratio:4/3}
@media(max-width:960px){
  #especialidades .category-grid,
  .categories-page-section .category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
}
@media(max-width:760px){
  #especialidades .category-grid,
  .categories-page-section .category-grid{grid-template-columns:1fr;gap:1rem}
  #especialidades .category-card,
  .categories-page-section .category-card{transform:none!important}
  #especialidades .category-card-body,
  .categories-page-section .category-card-body{padding:1rem}
  #especialidades .category-card-copy p,
  .categories-page-section .category-card-copy p{font-size:.93rem}
  #project-grid{grid-template-columns:1fr;gap:2.2rem}
}
@media(max-width:420px){
  #especialidades .category-card-media,
  .categories-page-section .category-card-media{aspect-ratio:1.28}
  #especialidades .category-card h3,
  .categories-page-section .category-card h3{font-size:clamp(1.36rem,7vw,1.8rem)}
  #especialidades .category-project-count,
  .categories-page-section .category-project-count{flex-direction:column;align-items:flex-start;gap:.5rem}
}