/* ===========================================================
   ESTILOS PROPIOS DE LAS PÁGINAS DE CENTRO
   (centro-cottolengo.html, centro-madre-teresa.html,
   centro-mision-cumbe.html, centro-santa-dorotea.html,
   centro-santa-rita.html)
   La base de marca, navegación, secciones genéricas, pie de
   página y animaciones viven en assets/styles.css.
   =========================================================== */

/* Centro hero */
.centro-hero{position:relative;overflow:hidden;background:var(--ink);min-height:clamp(340px,45vw,500px);display:flex;align-items:flex-end}
.centro-hero__bg{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;opacity:.45}
.centro-hero__overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(17,17,17,.85) 30%,rgba(17,17,17,.2) 100%)}
.centro-hero__content{position:relative;z-index:2;padding:clamp(32px,5vw,56px) 0 clamp(36px,5vw,52px)}
.centro-hero .eyebrow{color:var(--coral)}
.centro-hero .eyebrow::before{background:var(--coral)}
.centro-hero h1{font-size:clamp(2rem,5vw,3.4rem);color:var(--white);margin:.6rem 0 .8rem;max-width:16ch}
.centro-hero__meta{display:flex;gap:1.4rem;flex-wrap:wrap;margin-top:.4rem}
.centro-hero__badge{font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.06em;color:rgba(255,255,255,.8);display:flex;align-items:center;gap:.4em}
.centro-hero__badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--coral);flex-shrink:0}

/* Split info — en páginas de centro arranca alineado arriba */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,64px);align-items:start}
.split--center{align-items:center}

/* Info chips */
.info-chips{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.8rem}
.chip{display:flex;align-items:flex-start;gap:1rem;padding:1rem 1.1rem;background:var(--white);border:1px solid var(--mist);border-radius:var(--radius)}
.chip__icon{width:36px;height:36px;border-radius:50%;background:var(--rose);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chip__icon svg{width:18px;height:18px;color:var(--coral-deep)}
.chip__label{font-family:var(--sans);font-size:.68rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--coral-deep);margin-bottom:.2rem}
.chip__val{font-family:var(--sans);font-size:.92rem;color:var(--ink);font-weight:500}

/* Galería */
.gallery{display:grid;gap:12px}
.gallery--2{grid-template-columns:1fr 1fr}
.gallery--3{grid-template-columns:1fr 1fr 1fr}
.gallery--featured{grid-template-columns:1.5fr 1fr;grid-template-rows:auto auto}
.gallery__main{grid-row:1/3}
.gal-img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius);display:block;min-height:220px;background:var(--rose)}
.gal-img--tall{min-height:380px}
.gal-img--med{min-height:190px}

/* Servicios */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.serv{padding:22px 20px;background:var(--white);border:1px solid var(--mist);border-radius:var(--radius);display:flex;flex-direction:column;gap:.5rem}
.serv__icon{width:38px;height:38px;border-radius:50%;background:var(--rose);display:flex;align-items:center;justify-content:center}
.serv__icon svg{width:18px;height:18px;color:var(--coral-deep)}
.serv h3{font-family:var(--sans);font-weight:600;font-size:.98rem;color:var(--ink)}
.serv p{font-size:.88rem;margin:0}

/* Cita */
.quote-band{background:var(--rose);padding:clamp(44px,6vw,72px) 0}
.quote-band__inner{max-width:56ch;margin:0 auto;text-align:center}
.quote-band blockquote{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,2.5vw,1.65rem);color:var(--ink);line-height:1.5;margin-bottom:1rem}
.quote-band cite{font-family:var(--sans);font-size:.82rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--coral-deep)}

/* Nav centros */
.centros-nav{background:var(--ink);padding:clamp(36px,4vw,52px) 0}
.centros-nav__head{color:rgba(255,255,255,.6);font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin-bottom:1.2rem}
.centros-nav__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.centros-nav__item{padding:14px 12px;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);text-align:center;font-family:var(--sans);font-size:.78rem;font-weight:500;color:rgba(255,255,255,.8);transition:background .18s,border-color .18s,color .18s}
.centros-nav__item:hover{background:rgba(240,128,128,.15);border-color:var(--coral);color:var(--white)}
.centros-nav__item.active{background:var(--coral);border-color:var(--coral);color:var(--ink);font-weight:700}

/* CTA banda */
.cta-band{background:var(--ink);color:var(--white)}
.cta-band__inner{padding:clamp(44px,6vw,68px) 0;text-align:center;max-width:60ch;margin:0 auto}
.cta-band h2{color:var(--white);font-size:clamp(1.8rem,3.4vw,2.5rem)}
.cta-band p{color:rgba(255,255,255,.8);margin:.8rem auto 1.6rem}
.cta-band__actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ===========================================================
   RESPONSIVE — específico de las páginas de centro
   =========================================================== */
@media(max-width:900px){
  .split{grid-template-columns:1fr}
  .services-grid{grid-template-columns:repeat(2,1fr)}
  .centros-nav__grid{grid-template-columns:repeat(3,1fr)}
  .gallery--3{grid-template-columns:1fr 1fr}
  .gallery--featured{grid-template-columns:1fr}
  .gallery__main{grid-row:auto}
}
@media(max-width:768px){
  .services-grid{grid-template-columns:1fr}
  .centros-nav__grid{grid-template-columns:1fr 1fr}
  .gallery--2,.gallery--3{grid-template-columns:1fr}
}
