/* ===========================================================
   ESTILOS PROPIOS DE index.html
   (la base de marca, navegación, secciones genéricas, pie de
   página y animaciones viven en assets/styles.css)
   =========================================================== */

/* ===========================================================
   HERO
   =========================================================== */
.hero{padding:clamp(48px,7vw,84px) 0 clamp(40px,6vw,64px)}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,64px);align-items:center}
.hero__welcome{font-family:var(--sans);font-weight:500;color:var(--coral-deep);letter-spacing:.04em;font-size:1rem;margin-bottom:.4rem}
.hero h1{font-size:clamp(2.3rem,5.2vw,3.8rem);margin-bottom:1rem}
.hero__phrase{font-family:var(--serif);font-style:italic;font-size:clamp(1.1rem,2vw,1.4rem);color:var(--coral-deep);margin-bottom:1.3rem}
.hero p.lead{font-size:1.04rem;max-width:42ch;margin-bottom:1.9rem}
.hero__actions{display:flex;flex-wrap:wrap;gap:14px}
.hero__photo{min-height:clamp(320px,42vw,460px)}

/* --- Hero a pantalla completa: imagen impactante --- */
.hero-img{
  position:relative;
  width:100%;
  min-height:clamp(440px,74vh,700px);
  display:flex;align-items:flex-end;
  overflow:hidden;
  background:linear-gradient(150deg,var(--coral) 0%,var(--coral-deep) 100%);
}
.hero-img__media{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block;border-radius:0;
}
.hero-img__scrim{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(17,17,17,.80) 0%,rgba(17,17,17,.42) 42%,rgba(17,17,17,.06) 100%);
}
.hero-img__content{
  position:relative;
  padding-top:clamp(48px,9vw,96px);
  padding-bottom:clamp(40px,6vw,72px);
}
.hero-img__welcome{font-family:var(--sans);font-weight:500;color:var(--coral);letter-spacing:.04em;font-size:1rem;margin-bottom:.4rem}
.hero-img h1{color:var(--white);font-size:clamp(2.3rem,5.4vw,4rem);margin-bottom:1rem}
.hero-img__phrase{font-family:var(--serif);font-style:italic;font-size:clamp(1.1rem,2vw,1.45rem);color:var(--coral);margin-bottom:1.3rem}
.hero-img p.lead{color:rgba(255,255,255,.92);font-size:1.05rem;max-width:46ch;margin-bottom:1.9rem}
.hero-img__actions{display:flex;flex-wrap:wrap;gap:14px}
/* Marcador del recuadro de imagen (visible solo si no hay foto) */
.hero-img__tag{
  position:absolute;top:16px;right:18px;z-index:1;
  font-family:var(--sans);font-size:.66rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.65);
}

/* --- Hero emblema: logotipo + frase de marca sobre fotografía --- */
.hero-emblem{
  position:relative;
  width:100%;
  min-height:clamp(460px,82vh,720px);
  display:flex;align-items:center;justify-content:center;
  text-align:center;
  overflow:hidden;
  background:linear-gradient(150deg,var(--coral) 0%,var(--coral-deep) 100%);
}
.hero-emblem__media{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block;
}
.hero-emblem__scrim{
  position:absolute;inset:0;
  /* Velo en Tinta para garantizar contraste del logotipo negativo y la frase */
  background:linear-gradient(to bottom,rgba(17,17,17,.55) 0%,rgba(17,17,17,.34) 45%,rgba(17,17,17,.60) 100%);
}
.hero-emblem__content{
  position:relative;
  display:flex;flex-direction:column;align-items:center;
  gap:clamp(1rem,2.4vw,1.6rem);
  padding:clamp(64px,11vw,128px) 0;
}
/* Logotipo negativo, usado íntegro (siglas + filete + nombre) */
.hero-emblem__logo{
  width:clamp(180px,42vw,400px);
  height:auto;
  filter:drop-shadow(0 6px 22px rgba(0,0,0,.38));
}
.hero-emblem__phrase{
  font-family:var(--serif);font-style:italic;
  font-size:clamp(1.25rem,3vw,2rem);
  color:var(--white);
  letter-spacing:.01em;
  text-shadow:0 2px 14px rgba(0,0,0,.45);
  max-width:24ch;
}
/* Indicador sutil para invitar a desplazarse */
.hero-emblem__scroll{
  position:absolute;left:50%;bottom:clamp(18px,3vw,30px);
  transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  color:rgba(255,255,255,.8);
  font-family:var(--sans);font-size:.66rem;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;
}
.hero-emblem__scroll svg{width:20px;height:20px;animation:bobMove 1.8s ease-in-out infinite}
@keyframes bobMove{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@media(prefers-reduced-motion:reduce){.hero-emblem__scroll svg{animation:none}}

/* ===========================================================
   BANDA DE CIFRA (contador)
   =========================================================== */
.stat-band{background:var(--ink);color:var(--white)}
.stat-band__inner{display:flex;align-items:center;gap:clamp(20px,4vw,52px);padding:clamp(34px,4vw,46px) 0;flex-wrap:wrap}
.stat__num{font-family:var(--serif);font-weight:700;font-size:clamp(3.2rem,8vw,5rem);color:var(--coral);line-height:1}
.stat__txt{font-family:var(--sans);font-size:1.05rem;max-width:46ch;color:rgba(255,255,255,.88)}
.stat__txt strong{color:var(--white);font-weight:600}

/* ===========================================================
   GRILLA DE CENTROS
   =========================================================== */
.centros-head{text-align:center;max-width:60ch;margin:0 auto clamp(38px,5vw,56px)}
.centros-head .eyebrow{justify-content:center}
.centros-head h2{font-size:clamp(2rem,4vw,2.9rem);margin-top:.7rem}
.centros-head p{margin-top:.8rem}

.centros-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.card{
  background:var(--white);
  border:1px solid var(--mist);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .2s ease, box-shadow .2s ease;
}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 36px rgba(17,17,17,.10)}
.card .photo-ph{min-height:180px;border-radius:0}
.card__body{padding:22px 22px 26px;display:flex;flex-direction:column;flex:1}
.card__loc{font-family:var(--sans);font-weight:600;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--coral-deep);margin-bottom:.5rem}
.card__name{font-family:var(--serif);font-weight:700;font-size:1.22rem;line-height:1.25;margin-bottom:.6rem}
.card__desc{font-size:.92rem;color:var(--stone);flex:1}
.card__meta{margin-top:1.1rem;padding-top:1rem;border-top:1px solid var(--mist);font-family:var(--sans);font-size:.82rem;color:var(--ink);font-weight:500}
.card__meta b{font-family:var(--serif);color:var(--coral-deep);font-size:1.05rem}
.card__origin{display:inline-block;margin-top:.4rem;font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}

/* ===========================================================
   TRANSPARENCIA
   =========================================================== */
.transparencia-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:1.6rem}
.tp-card{
  background:var(--white);
  border:1px solid var(--mist);
  border-radius:var(--radius);
  padding:26px 24px;
  display:flex;flex-direction:column;gap:.6rem;
}
.tp-card__icon{
  width:42px;height:42px;border-radius:50%;
  background:var(--rose);color:var(--coral-deep);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-weight:700;font-size:1.05rem;
}
.tp-card h3{font-family:var(--serif);font-weight:700;font-size:1.08rem}
.tp-card p{font-size:.9rem;margin:0}
.tp-card a.tp-link{
  font-family:var(--sans);font-weight:600;font-size:.84rem;
  color:var(--coral-deep);display:inline-flex;align-items:center;gap:.4em;
  margin-top:.3rem;
}
.tp-card a.tp-link::after{content:"→";transition:transform .18s ease}
.tp-card a.tp-link:hover::after{transform:translateX(3px)}
.tp-note{
  margin-top:1.8rem;padding:18px 20px;
  background:var(--rose);border-radius:var(--radius);
  font-size:.88rem;color:var(--stone);
}

/* ===========================================================
   RESPONSIVE — específico de index.html
   =========================================================== */
@media(max-width:900px){
  .centros-grid{grid-template-columns:repeat(2,1fr)}
  .transparencia-grid{grid-template-columns:1fr}
}
@media(max-width:768px){
  .centros-grid{grid-template-columns:1fr}
}
