/* =====================================================================
   Business-Theme · Génesis 1.00 · Sitio público · estilo HomeSpace
   El acento se inyecta desde el layout con --hs-accent (configurable).
   ===================================================================== */
:root{
  --hs-accent:#199a8e;
  --hs-accent-d:#137c72;
  --hs-dark:#0b2239;
  --hs-text:#4b5768;
  --hs-muted:#8a94a6;
  --hs-bg:#ffffff;
  --hs-soft:#f4f8f7;
  --hs-border:#e7ecf1;
  --hs-radius:14px;
  --hs-shadow:0 18px 50px rgba(11,34,57,.10);
  --hs-heading-font:'Poppins',sans-serif;
  --hs-body-font:'Open Sans',sans-serif;
}
*{box-sizing:border-box;}
html{overflow-x:clip;}
/* Evita el scroll horizontal en móvil por las animaciones AOS (fade-left/right desplazan en X) */
@media (max-width:768px){
  [data-aos="fade-left"],[data-aos="fade-right"]{transform:translate3d(0,30px,0)!important;}
  [data-aos="fade-left"].aos-animate,[data-aos="fade-right"].aos-animate{transform:translate3d(0,0,0)!important;}
}
body.hs{margin:0;font-family:var(--hs-body-font);color:var(--hs-text);background:var(--hs-bg);font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:clip;max-width:100%;}
.hs h1,.hs h2,.hs h3,.hs h4,.hs h5,.hs h6{font-family:var(--hs-heading-font);color:var(--hs-dark);font-weight:600;}
.hs a{color:var(--hs-accent);text-decoration:none;transition:color .2s;}
.hs a:hover{color:var(--hs-accent-d);}
.hs img{max-width:100%;}
.hs-container{max-width:1200px;margin:0 auto;padding:0 20px;}
.hs-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:50px;font-weight:600;font-size:14px;border:2px solid transparent;cursor:pointer;transition:all .2s;font-family:var(--hs-heading-font);}
.hs-btn-primary{background:var(--hs-accent);color:#fff;}
.hs-btn-primary:hover{background:var(--hs-accent-d);color:#fff;}
.hs-btn-outline{background:transparent;color:var(--hs-accent);border-color:var(--hs-accent);}
.hs-btn-outline:hover{background:var(--hs-accent);color:#fff;}
.hs-btn-light{background:#fff;color:var(--hs-dark);}
.hs-btn-light:hover{background:var(--hs-accent);color:#fff;}
.hs-section{padding:90px 0;}
.hs-section.soft{background:var(--hs-soft);}
.hs-sec-head{text-align:center;max-width:640px;margin:0 auto 50px;}
.hs-sec-head span{display:inline-block;color:var(--hs-accent);font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:uppercase;font-family:var(--hs-heading-font);margin-bottom:8px;}
.hs-sec-head h2{font-size:38px;margin:0 0 12px;line-height:1.2;}
.hs-sec-head p{color:var(--hs-muted);margin:0;}

/* ---------- Header ---------- */
.hs-header{position:sticky;top:0;z-index:1000;background:#fff;box-shadow:0 2px 20px rgba(11,34,57,.06);}
.hs-header .hs-container{display:flex;align-items:center;justify-content:space-between;min-height:76px;gap:20px;}
.hs-logo{display:flex;align-items:center;gap:10px;font-family:var(--hs-heading-font);font-weight:700;font-size:22px;color:var(--hs-dark);}
.hs-logo img{max-height:42px;}
.hs-logo i{color:var(--hs-accent);}
.hs-nav{display:flex;align-items:center;gap:28px;}
.hs-nav a{color:var(--hs-dark);font-weight:600;font-size:15px;font-family:var(--hs-heading-font);position:relative;}
.hs-nav a:hover,.hs-nav a.active{color:var(--hs-accent);}
.hs-nav a.active::after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--hs-accent);border-radius:2px;}
.hs-head-actions{display:flex;align-items:center;gap:14px;}
.hs-burger{display:none;background:none;border:0;font-size:26px;color:var(--hs-dark);cursor:pointer;}

/* ---------- Hero ---------- */
.hs-hero{position:relative;background:linear-gradient(120deg,#0b2239 0%,#123a52 100%);color:#fff;overflow:hidden;}
.hs-hero.has-img{background-size:cover;background-position:center;}
.hs-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(120deg,rgba(11,34,57,.86),rgba(11,34,57,.55));}
.hs-hero .hs-container{position:relative;padding:96px 20px 120px;}
.hs-hero .hs-eyebrow{display:inline-block;background:rgba(255,255,255,.14);padding:7px 16px;border-radius:50px;font-size:13px;font-weight:600;letter-spacing:.04em;margin-bottom:18px;}
.hs-hero h1{color:#fff;font-size:52px;line-height:1.12;margin:0 0 18px;max-width:760px;}
.hs-hero p{color:rgba(255,255,255,.85);font-size:19px;max-width:600px;margin:0 0 30px;}
.hs-searchbar{background:#fff;border-radius:16px;box-shadow:var(--hs-shadow);padding:14px;display:grid;grid-template-columns:1.4fr 1fr 1fr auto;gap:10px;max-width:920px;}
.hs-searchbar .fld{display:flex;flex-direction:column;padding:6px 12px;border-right:1px solid var(--hs-border);min-width:0;}
.hs-searchbar .fld:last-of-type{border-right:0;}
.hs-searchbar label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--hs-muted);font-family:var(--hs-heading-font);}
.hs-searchbar select,.hs-searchbar input{border:0;outline:0;background:transparent;font-size:15px;color:var(--hs-dark);padding:4px 0;font-family:var(--hs-body-font);width:100%;min-width:0;max-width:100%;}
.hs-searchbar .hs-btn{justify-content:center;white-space:nowrap;}
.hs-hero-badges{display:flex;gap:30px;margin-top:34px;flex-wrap:wrap;}
.hs-hero-badges div{display:flex;flex-direction:column;}
.hs-hero-badges strong{font-family:var(--hs-heading-font);font-size:30px;color:#fff;line-height:1;}
.hs-hero-badges small{color:rgba(255,255,255,.75);font-size:13px;margin-top:4px;}

/* ---------- About ---------- */
.hs-about{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center;}
.hs-about-img{border-radius:20px;overflow:hidden;box-shadow:var(--hs-shadow);min-height:380px;background:var(--hs-soft) center/cover;}
.hs-about h2{font-size:36px;margin:0 0 16px;}
.hs-check{list-style:none;padding:0;margin:20px 0;}
.hs-check li{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px;color:var(--hs-text);}
.hs-check i{color:var(--hs-accent);font-size:20px;flex-shrink:0;}

/* ---------- Services ---------- */
.hs-serv{background:#fff;border-radius:var(--hs-radius);padding:34px 26px;box-shadow:var(--hs-shadow);text-align:center;transition:transform .25s;height:100%;}
.hs-serv:hover{transform:translateY(-6px);}
.hs-serv .ic{width:70px;height:70px;border-radius:18px;background:var(--hs-soft);color:var(--hs-accent);display:grid;place-items:center;font-size:32px;margin:0 auto 18px;transition:all .25s;}
.hs-serv:hover .ic{background:var(--hs-accent);color:#fff;}
.hs-serv h3{font-size:19px;margin:0 0 8px;}
.hs-serv p{color:var(--hs-muted);font-size:14px;margin:0;}

/* ---------- Counters ---------- */
.hs-counters{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;}
.hs-counter{text-align:center;}
.hs-counter .ic{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;display:grid;place-items:center;font-size:28px;margin:0 auto 14px;}
.hs-counter strong{display:block;font-family:var(--hs-heading-font);font-size:40px;color:#fff;line-height:1;}
.hs-counter small{color:rgba(255,255,255,.8);font-size:14px;}
.hs-counters-wrap{background:linear-gradient(120deg,var(--hs-accent),var(--hs-accent-d));}

/* ---------- Testimonials ---------- */
.hs-testi{background:#fff;border-radius:var(--hs-radius);padding:30px;box-shadow:var(--hs-shadow);height:100%;}
.hs-testi .stars{color:#f5b301;margin-bottom:12px;font-size:16px;}
.hs-testi p{font-style:italic;color:var(--hs-text);margin:0 0 18px;}
.hs-testi .who{display:flex;align-items:center;gap:12px;}
.hs-testi .who .av{width:48px;height:48px;border-radius:50%;background:var(--hs-accent);color:#fff;display:grid;place-items:center;font-weight:700;font-family:var(--hs-heading-font);}
.hs-testi .who strong{display:block;color:var(--hs-dark);font-family:var(--hs-heading-font);}
.hs-testi .who small{color:var(--hs-muted);}

/* ---------- CTA ---------- */
.hs-cta{background:linear-gradient(120deg,var(--hs-dark),#123a52);border-radius:24px;padding:60px;text-align:center;color:#fff;}
.hs-cta h2{color:#fff;font-size:36px;margin:0 0 12px;}
.hs-cta p{color:rgba(255,255,255,.85);max-width:560px;margin:0 auto 26px;}

/* ---------- Contact ---------- */
.hs-contact{display:grid;grid-template-columns:1fr 1.3fr;gap:40px;}
.hs-info-item{display:flex;gap:16px;margin-bottom:24px;}
.hs-info-item .ic{width:54px;height:54px;flex-shrink:0;border-radius:14px;background:var(--hs-soft);color:var(--hs-accent);display:grid;place-items:center;font-size:24px;}
.hs-info-item strong{display:block;color:var(--hs-dark);font-family:var(--hs-heading-font);}
.hs-info-item span{color:var(--hs-muted);font-size:14px;}
.hs-form{background:#fff;border-radius:var(--hs-radius);padding:30px;box-shadow:var(--hs-shadow);}
.hs-form .row2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.hs-form label{font-size:13px;font-weight:600;color:var(--hs-dark);margin-bottom:5px;display:block;font-family:var(--hs-heading-font);}
.hs-form input,.hs-form textarea,.hs-form select{width:100%;border:1.5px solid var(--hs-border);border-radius:10px;padding:12px 14px;font-size:15px;font-family:var(--hs-body-font);margin-bottom:16px;outline:0;transition:border .2s,box-shadow .2s;}
.hs-form input:focus,.hs-form textarea:focus,.hs-form select:focus{border-color:var(--hs-accent);box-shadow:0 0 0 4px rgba(25,154,142,.12);}

/* ---------- alert ---------- */
.hs-alert{padding:14px 18px;border-radius:12px;margin-bottom:20px;font-weight:600;}
.hs-alert.ok{background:#e0f6ef;color:#0b7a5f;}
.hs-alert.err{background:#fdecec;color:#b42318;}

/* ---------- Footer ---------- */
.hs-footer{background:var(--hs-dark);color:rgba(255,255,255,.72);padding:70px 0 0;}
.hs-footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.4fr;gap:40px;padding-bottom:44px;}
.hs-footer h4{color:#fff;font-size:17px;margin:0 0 18px;}
.hs-footer .brand{display:flex;align-items:center;gap:10px;color:#fff;font-family:var(--hs-heading-font);font-weight:700;font-size:22px;margin-bottom:14px;}
.hs-footer .brand i{color:var(--hs-accent);}
.hs-footer ul{list-style:none;padding:0;margin:0;}
.hs-footer ul li{margin-bottom:10px;}
.hs-footer ul li a{color:rgba(255,255,255,.72);}
.hs-footer ul li a:hover{color:#fff;padding-left:4px;}
.hs-foot-soc{display:flex;gap:10px;margin-top:16px;}
.hs-foot-soc a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;display:grid;place-items:center;font-size:17px;}
.hs-foot-soc a:hover{background:var(--hs-accent);}
.hs-news{display:flex;gap:8px;margin-top:14px;}
.hs-news input{flex:1;border:0;border-radius:10px;padding:12px 14px;font-family:var(--hs-body-font);}
.hs-foot-bottom{border-top:1px solid rgba(255,255,255,.1);padding:22px 0;text-align:center;font-size:14px;color:rgba(255,255,255,.6);}
.hs-foot-bottom a{color:var(--hs-accent);}

/* ---------- page hero (subpáginas) ---------- */
.hs-page-hero{background:linear-gradient(120deg,#0b2239,#123a52);color:#fff;padding:70px 0;text-align:center;}
.hs-page-hero h1{color:#fff;font-size:42px;margin:0 0 8px;}
.hs-page-hero .crumb{color:rgba(255,255,255,.7);font-size:14px;}
.hs-page-hero .crumb a{color:rgba(255,255,255,.9);}

/* ---------- Fix: enlaces con estilo de botón conservan su color de texto ---------- */
.hs-btn{text-decoration:none;}
a.hs-btn-primary,a.hs-btn-primary:hover,a.hs-btn-primary:focus{color:#fff !important;}
a.hs-btn-wa,a.hs-btn-wa:hover,a.hs-btn-wa:focus{color:#fff !important;}
a.hs-btn-light,a.hs-btn-light:hover{color:var(--hs-dark);}
a.hs-btn-outline{color:var(--hs-accent);}
a.hs-btn-outline:hover{color:#fff !important;}

/* ---------- Barra lateral más sutil + botón "Mi panel" compacto ---------- */
.hs-side-card{padding:18px;}
.hs-prop-aside .hs-btn{padding:10px 16px;font-size:13.5px;gap:6px;}
.hs-side-actions{gap:8px;margin-top:10px;}
.hs-side-actions .hs-btn{padding:9px 10px;font-size:13px;}
.hs-agent-cta{gap:8px;}
.hs-agent-cta .hs-btn{padding:10px 14px;font-size:13.5px;}
.hs-agent-head{margin-bottom:14px;}
.hs-agent-mono,.hs-agent-photo{width:56px;height:56px;}
.hs-agent-mono{font-size:20px;}

/* Encabezado público: "Mi panel"/acciones más compactas, sobre todo en móvil */
.hs-head-actions .hs-btn{padding:10px 18px;}
@media (max-width:768px){
  .hs-head-actions .hs-btn{padding:8px 12px;font-size:13px;gap:5px;border-radius:12px;}
  .hs-logo{font-size:18px;gap:8px;}
  .hs-logo img{max-height:34px;}
  .hs-header .hs-container{gap:10px;}
}




/* ── Rescatadas del recorte ────────────────────────────────
   El tema mezcla en la misma sección cosas de la ficha de
   propiedad —que aquí no existe— con utilidades que el sitio sí
   usa. Al quitar la sección se fueron de más. Estas volvieron
   porque una vista las nombra. */
.hs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.hs-tag{position:absolute;top:14px;left:14px;background:var(--hs-accent);color:#fff;padding:5px 13px;border-radius:50px;font-size:12px;font-weight:700;font-family:var(--hs-heading-font);}
.hs-tag.occupied{background:#6b7280;}
.hs-btn-block{width:100%;justify-content:center;}
.hs-modal .modal-header{border-bottom:1px solid var(--hs-border);padding:18px 22px;}
.hs-modal .modal-title{font-family:var(--hs-heading-font);font-size:18px;color:var(--hs-dark);display:flex;align-items:center;gap:8px;}
.hs-modal .modal-title i{color:var(--hs-accent);}
.hs-modal .modal-footer{border-top:1px solid var(--hs-border);gap:8px;}

/* El verde de WhatsApp. Vivía en la sección de la ficha de propiedad, así que
   el recorte se lo llevó — y el botón quedó transparente. En México ese verde
   es reconocible sin leer la etiqueta; perderlo no es un detalle. */
.hs-btn-wa{background:#25d366;color:#fff;margin-top:12px;}
.hs-btn-wa:hover{background:#1db954;color:#fff;}

/* ══════════════════════════════════════════════════════════════
   RESCATADAS DEL RECORTE — las reglas de teléfono

   Al podar site.css de 23 KB a 12 KB me llevé CUATRO de los seis
   bloques @media completos. En una computadora no se notaba nada;
   en un teléfono el sitio se rompía en dos partes distintas:

     · El menú. `.hs-burger` está en `display:none` y era este
       bloque el que lo encendía. Sin él, la hamburguesa nunca
       aparecía Y el menú completo se quedaba en fila, así que el
       nombre del centro se partía en cuatro renglones.

     · El titular del héroe. Sin la regla de 36px se quedaba con
       el tamaño de escritorio y se comía la pantalla entera.

   Se restauran sólo las reglas cuyas clases usan de verdad las
   vistas del sitio. Las del tema inmobiliario (.hs-prop-aside,
   .hs-searchbar, .hs-spec) siguen fuera: ahí el recorte estuvo bien.

   Por qué se me pasó: comparé los estilos calculados de 1,835
   elementos ANTES y DESPUÉS del recorte, pero en UN SOLO ancho de
   ventana, el de escritorio. Un bloque @media de teléfono puede
   desaparecer entero sin que esa comparación se entere.
   ══════════════════════════════════════════════════════════════ */

@media (max-width:992px){
  .hs-footer-grid{grid-template-columns:1fr 1fr;}
  .hs-contact{grid-template-columns:1fr;}
}

@media (max-width:768px){
  /* El menú se convierte en panel desplegable */
  .hs-nav{
    position:fixed;inset:76px 0 auto 0;flex-direction:column;background:#fff;
    padding:20px;gap:16px;box-shadow:0 20px 40px rgba(11,34,57,.12);
    transform:translateY(-140%);transition:transform .3s;align-items:flex-start;
  }
  .hs-nav.open{transform:translateY(0);}
  .hs-burger{display:block;}

  /* Tamaños de teléfono */
  .hs-hero h1{font-size:36px;}
  .hs-sec-head h2{font-size:30px;}
  .hs-section{padding:60px 0;}
  .hs-cta{padding:40px 24px;}
  .hs-grid,.hs-counters,.hs-footer-grid{grid-template-columns:1fr;}
  .hs-form .row2{grid-template-columns:1fr;}
}

/* ── Y esto NO estaba ni en el original ────────────────────────
   El nombre del centro se sigue partiendo si es largo: «Serenity
   For Elderly Care» son cuatro palabras dentro de un flex que le
   cede el ancho al menú. Se le da permiso de encogerse y de cortar
   con puntos suspensivos antes que apilarse.
   Probado con nombres de hasta 40 caracteres. */
.hs-logo{min-width:0;flex:0 1 auto;}

/* El botón del menú lleva medidas propias.
   Su contenido es un icono de fuente (`ri-menu-3-line`). Si esa fuente
   tarda o no carga, el botón se queda de 12x2 px y el menú del teléfono
   se vuelve inalcanzable — medido. Con caja propia sigue siendo un
   objetivo de 44x44, que es el mínimo para tocar con el pulgar. */
.hs-burger{
  width:44px;height:44px;padding:0;line-height:1;flex:0 0 auto;
  align-items:center;justify-content:center;border-radius:10px;
}
.hs-burger:active{background:rgba(11,34,57,.06);}

@media (max-width:768px){
  .hs-header .hs-container{min-height:64px;gap:8px;}
  .hs-burger{display:flex;}
  .hs-nav{inset:64px 0 auto 0;}
  .hs-head-actions{gap:6px;flex:0 0 auto;}

  /* El nombre del centro, hasta en DOS renglones y luego sí recorta.
     «Serenity For Elderly Care» son cuatro palabras: cortarlo en un
     solo renglón deja «Serenity For Elderl…», que se lee mal. En dos
     renglones cabe entero y la cabecera no crece. */
  .hs-logo{font-size:15px;max-width:46vw;}
  .hs-logo span{
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
    overflow:hidden;line-height:1.15;min-width:0;
  }
}
@media (max-width:420px){
  .hs-logo{font-size:14px;max-width:42vw;}
  .hs-head-actions .hs-btn{padding:8px 10px;font-size:12px;}
}
/* ── Teléfono angosto: el CTA se queda con el icono ────────────
   Medido a 390 px: «Agendar visita» ocupaba 179 px de los 390, y
   entre eso, el acceso y la hamburguesa al nombre del centro le
   quedaban 150 px. Por eso se partía.

   Bajo 560 px los dos botones se quedan sólo con su icono, en
   cajas de 44x44. El nombre pasa a tener más de 200 px y cabe.
   El destino no cambia; lo que cambia es cuánto ocupa el camino. */
/* Las tres rayas del menú, dibujadas. No dependen de ninguna fuente. */
.hs-rayas,.hs-rayas::before,.hs-rayas::after{
  display:block;width:20px;height:2px;background:currentColor;border-radius:2px;
}
.hs-rayas{position:relative;}
.hs-rayas::before,.hs-rayas::after{content:'';position:absolute;left:0;}
.hs-rayas::before{top:-6px;}
.hs-rayas::after{top:6px;}

/* Texto largo y texto corto: se enseña uno u otro. */
.hs-corto{display:none;}

/* ── Teléfono angosto ──────────────────────────────────────────
   Medido a 390 px: «Agendar visita» ocupaba 179 px de los 390 y al
   nombre del centro le quedaban 150. Por eso se partía en cuatro
   renglones.

   La primera versión de este arreglo dejaba los botones SÓLO con su
   icono. Se deshizo: los tres iconos vienen de RemixIcon por CDN, y
   tres cuadros en blanco es peor que un texto apretado. Un texto
   corto siempre se dibuja. */
@media (max-width:560px){
  .hs-largo{display:none;}
  .hs-corto{display:inline;}
  .hs-head-actions .hs-btn{padding:9px 13px;font-size:12.5px;gap:5px;border-radius:12px;}
  .hs-acceso{font-size:12.5px;gap:5px;}
  .hs-logo{max-width:none;flex:1 1 auto;}
  .hs-logo span{-webkit-line-clamp:2;}
}
/* Nada en la barra de acciones se encoge: el `.hs-acceso` se estaba
   quedando en 20 px de ancho, con su texto dentro y sin poder leerse.
   El único que cede ancho es el nombre del centro. */
.hs-head-actions > *{flex:0 0 auto;}

/* El acceso duplicado dentro del menú: invisible en escritorio. */
.hs-nav-acceso{display:none;}
@media (max-width:768px){
  .hs-nav-acceso{
    display:flex;align-items:center;gap:8px;margin-top:6px;padding-top:16px;
    border-top:1px solid rgba(11,34,57,.10);width:100%;
    color:var(--hs-accent);font-weight:600;
  }
}
/* Bajo 480 px el acceso sale de la barra y se queda sólo en el menú.
   Ahí caben el nombre, el botón de visita y la hamburguesa; los cuatro
   no. Sigue estando también en el pie. */
@media (max-width:480px){
  .hs-head-actions .hs-acceso{display:none;}
}