/* ============================================================
   ANIMAL PHONE — estilos de las páginas interiores
   (se carga después de estilos.css)
   ============================================================ */

/* ---------- utilidades ---------- */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
/* cifras sobre fondo claro (misma retícula que .stats en fondo oscuro) */
.stats.claro .stat{ border-left-color:rgba(14,107,69,.32); }
.stats.claro .stat strong{ color:var(--tinta); }
.stats.claro .stat > span{ color:var(--tinta-3); }

/* ---------- nav: página activa y fondo sólido en interiores ---------- */
.nav-links a.activo{ color:var(--esmeralda); border-color:var(--esmeralda); }
.menu-movil a.activo{ color:var(--esmeralda); }
body.interior .nav{
  background:rgba(255,255,255,.9);
  border-color:var(--linea);
  box-shadow:0 4px 24px rgba(15,23,18,.06);
}

/* ---------- cabecera de página interior ---------- */
.page-header{
  position:relative; overflow:clip;
  background:var(--bosque); color:#fff;
  padding-top:calc(80px + 3.4rem); padding-bottom:3.2rem;
}
.page-header::before{
  content:""; position:absolute; inset:-45% -10% auto -10%; height:130%;
  background:radial-gradient(38% 46% at 74% 22%, rgba(159,216,180,.17), transparent 70%);
  pointer-events:none;
}
.page-header > .wrap{ position:relative; }
.page-header .kicker{ color:var(--lima); }
.page-header h1{
  font-size:clamp(2rem, 4.6vw, 3.15rem);
  font-weight:800; line-height:1.06; letter-spacing:-.035em;
  text-wrap:balance; max-width:20ch; margin:1rem 0 1.05rem;
}
.page-header .lede{ color:#b7c8ba; max-width:58ch; font-size:1.05rem; }
.migas{ font-size:.82rem; color:#8ba191; }
.migas a{ color:#b7c8ba; text-decoration:none; }
.migas a:hover{ color:#fff; text-decoration:underline; }
.aviso-iva{
  display:inline-flex; align-items:center; gap:.55rem; margin-top:1.5rem;
  background:rgba(243,194,104,.16); color:var(--ambar);
  border:1px solid rgba(243,194,104,.42);
  font-weight:700; font-size:.87rem; padding:.55rem 1.15rem; border-radius:999px;
}
.aviso-iva svg{ width:17px; height:17px; flex:none; }

/* precio expresado en palabras (p. ej. «Hablamos») en vez de cifra */
.tarifa-precio strong.texto{ font-size:1.85rem; letter-spacing:-.03em; }

/* ---------- tabla comparativa ---------- */
.tabla-wrap{
  overflow-x:auto; margin-top:2.2rem;
  border:1px solid var(--linea); border-radius:20px; background:var(--superficie);
  -webkit-overflow-scrolling:touch;
}
.tabla{ width:100%; border-collapse:collapse; min-width:660px; font-size:.94rem; }
.tabla th,
.tabla td{ padding:.95rem 1.15rem; text-align:left; border-bottom:1px solid var(--linea); }
.tabla thead th{
  background:var(--crudo); font-weight:800; font-size:.85rem;
  letter-spacing:.01em; white-space:nowrap; color:var(--tinta);
}
.tabla thead th:first-child{ border-top-left-radius:19px; }
.tabla thead th:last-child{ border-top-right-radius:19px; }
.tabla tbody th{ font-weight:700; color:var(--tinta); white-space:nowrap; }
.tabla td{ color:var(--tinta-2); font-variant-numeric:tabular-nums; }
.tabla tbody tr:last-child th,
.tabla tbody tr:last-child td{ border-bottom:0; }
.tabla .col-destacada{ background:rgba(14,107,69,.055); }
.tabla .si{ color:var(--esmeralda); font-weight:800; }
.tabla .no{ color:var(--tinta-3); }
.tabla-nota{ margin-top:.9rem; font-size:.85rem; color:var(--tinta-3); }
.tabla-pista{ display:none; margin-top:.7rem; font-size:.82rem; color:var(--tinta-3); }
@media (max-width: 760px){ .tabla-pista{ display:block; } }

/* ---------- bloques de valor ---------- */
.bloques{ display:grid; gap:1.2rem; margin-top:2.6rem; }
@media (min-width: 720px){ .bloques{ grid-template-columns:repeat(2,1fr); } }
@media (min-width: 1060px){ .bloques{ grid-template-columns:repeat(4,1fr); } }
.bloque{
  background:var(--superficie); border:1px solid var(--linea);
  border-radius:20px; padding:1.75rem 1.5rem;
  transition:transform .3s var(--suave), box-shadow .3s var(--suave);
}
.bloque:hover{ transform:translateY(-5px); box-shadow:var(--sombra-2); }
.bloque-icono{
  width:48px; height:48px; border-radius:14px; background:var(--menta);
  display:grid; place-items:center; margin-bottom:1.05rem;
}
.bloque-icono svg{ width:25px; height:25px; color:var(--esmeralda); }
.bloque h3{ font-size:1.08rem; font-weight:800; letter-spacing:-.015em; margin-bottom:.45rem; }
.bloque p{ color:var(--tinta-3); font-size:.92rem; }

/* ---------- lista de extras con precio ---------- */
.extras{
  margin-top:1.8rem; border:1px solid var(--linea); border-radius:18px;
  overflow:hidden; background:var(--superficie);
}
.extra{
  display:flex; justify-content:space-between; align-items:baseline; gap:1.2rem;
  padding:.95rem 1.3rem; border-bottom:1px solid var(--linea);
}
.extra:last-child{ border-bottom:0; }
.extra span{ color:var(--tinta-2); font-size:.94rem; }
.extra strong{ font-weight:800; white-space:nowrap; font-variant-numeric:tabular-nums; }
.extra strong.gratis{ color:var(--esmeralda); }

/* ---------- banner de enlace cruzado ---------- */
.banner{
  margin-top:3.2rem; background:var(--bosque); color:#fff;
  border-radius:24px; padding:2.1rem 1.8rem;
  display:grid; gap:1.4rem; align-items:center; position:relative; overflow:clip;
}
.banner::before{
  content:""; position:absolute; inset:-60% -20% auto -20%; height:180%;
  background:radial-gradient(40% 50% at 80% 30%, rgba(159,216,180,.16), transparent 70%);
  pointer-events:none;
}
.banner > *{ position:relative; }
.banner h2{ font-size:1.45rem; font-weight:800; letter-spacing:-.025em; text-wrap:balance; }
.banner p{ color:#b7c8ba; margin-top:.55rem; max-width:54ch; font-size:.97rem; }
@media (min-width: 840px){
  .banner{ grid-template-columns:1fr auto; padding:2.5rem 2.6rem; gap:2.4rem; }
}

/* ---------- pasos numerados en línea ---------- */
.ruta{ display:grid; gap:1.1rem; margin-top:2.4rem; counter-reset:ruta; }
@media (min-width: 820px){ .ruta{ grid-template-columns:repeat(4,1fr); } }
.ruta-paso{
  position:relative; padding-top:1.6rem;
  border-top:2px solid var(--linea);
}
.ruta-paso::before{
  counter-increment:ruta; content:counter(ruta);
  position:absolute; top:-1.05rem; left:0;
  width:2rem; height:2rem; border-radius:50%;
  background:var(--esmeralda); color:#fff;
  display:grid; place-items:center;
  font-size:.85rem; font-weight:800;
}
.ruta-paso h3{ font-size:1.02rem; font-weight:800; letter-spacing:-.015em; margin-bottom:.4rem; }
.ruta-paso p{ color:var(--tinta-3); font-size:.9rem; }

/* ---------- protectoras colaboradoras ---------- */
.protectoras{ display:grid; gap:.6rem; margin-top:2.2rem; }
@media (min-width: 620px){ .protectoras{ grid-template-columns:repeat(2,1fr); } }
@media (min-width: 1000px){ .protectoras{ grid-template-columns:repeat(3,1fr); } }
.protectora{
  display:flex; align-items:center; gap:.7rem;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.13);
  border-radius:14px; padding:.85rem 1rem; font-size:.92rem;
}
.protectora svg{ width:15px; height:15px; color:var(--lima); flex:none; }
.protectora b{ font-weight:700; color:#fff; }
.protectora span{ color:#a9bcae; margin-left:auto; font-size:.8rem; white-space:nowrap; }

/* ---------- contacto ---------- */
.contacto{ display:grid; gap:1.1rem; margin-top:2.4rem; }
@media (min-width: 760px){ .contacto{ grid-template-columns:repeat(3,1fr); } }
.contacto-item{
  background:var(--superficie); border:1px solid var(--linea);
  border-radius:18px; padding:1.5rem 1.4rem;
}
.contacto-item h3{
  font-size:.76rem; text-transform:uppercase; letter-spacing:.13em;
  color:var(--tinta-3); font-weight:700; margin-bottom:.7rem;
}
.contacto-item a,
.contacto-item .dato{ font-size:1.05rem; font-weight:700; color:var(--tinta); text-decoration:none; }
.contacto-item a:hover{ color:var(--esmeralda); }
.contacto-item small{ display:block; color:var(--tinta-3); font-weight:400; font-size:.85rem; margin-top:.4rem; }

/* ---------- FAQ agrupada por temas ---------- */
.faq-grupo{ margin-top:2.8rem; }
.faq-grupo:first-of-type{ margin-top:2rem; }
.faq-grupo > h2{
  font-size:1.2rem; font-weight:800; letter-spacing:-.02em;
  margin-bottom:.4rem; display:flex; align-items:center; gap:.6rem;
}
.faq-grupo > h2 svg{ width:20px; height:20px; color:var(--esmeralda); flex:none; }

/* ---------- historia larga ---------- */
.relato{ max-width:66ch; }
.relato p{ margin-bottom:1.15rem; color:var(--tinta-2); }
.relato p.destacado{ font-size:1.14rem; color:var(--tinta); }
.relato h2{ font-size:1.35rem; font-weight:800; letter-spacing:-.02em; margin:2.2rem 0 .8rem; }

/* ---------- caso ampliado ---------- */
.caso-largo{
  display:grid; gap:1.6rem; align-items:start;
  padding-block:2.4rem; border-bottom:1px solid var(--linea);
}
.caso-largo:last-child{ border-bottom:0; }
.caso-largo .foto{ border-radius:20px; overflow:hidden; box-shadow:var(--sombra); }
.caso-largo .foto img{ width:100%; height:100%; object-fit:cover; aspect-ratio:4/3; }
.caso-largo h2{ font-size:1.45rem; font-weight:800; letter-spacing:-.02em; }
.caso-largo .ficha{ display:grid; gap:.75rem; margin-top:1.1rem; }
.caso-largo .ficha div{ display:grid; gap:.15rem; }
.caso-largo .ficha dt{
  font-size:.74rem; text-transform:uppercase; letter-spacing:.12em;
  color:var(--tinta-3); font-weight:700;
}
.caso-largo .ficha dd{ color:var(--tinta-2); font-size:.96rem; }
@media (min-width: 820px){
  .caso-largo{ grid-template-columns:.85fr 1.15fr; gap:2.6rem; }
}

/* ---------- móvil ---------- */
@media (max-width: 699px){
  .page-header{ padding-top:calc(80px + 2.2rem); padding-bottom:2.4rem; }
  .page-header h1{ font-size:clamp(1.7rem, 7.2vw, 2.2rem); }
  .page-header .lede{ font-size:.95rem; }
  .bloques{ grid-template-columns:repeat(2,1fr); gap:.7rem; margin-top:1.8rem; }
  .bloque{ padding:1.1rem .9rem; border-radius:16px; }
  .bloque:hover{ transform:none; }
  .bloque-icono{ width:38px; height:38px; border-radius:11px; margin-bottom:.7rem; }
  .bloque-icono svg{ width:20px; height:20px; }
  .bloque h3{ font-size:.9rem; }
  .bloque p{ font-size:.76rem; }
  .ruta{ gap:.9rem; margin-top:1.8rem; }
  .banner{ margin-top:2.2rem; padding:1.6rem 1.3rem; border-radius:18px; }
  .banner h2{ font-size:1.2rem; }
  .banner p{ font-size:.9rem; }
  .extra{ padding:.8rem 1rem; gap:.8rem; }
  .extra span{ font-size:.86rem; }
  .contacto{ gap:.7rem; }
  .contacto-item{ padding:1.1rem 1.1rem; }
  .caso-largo{ padding-block:1.6rem; gap:1rem; }
  .caso-largo h2{ font-size:1.2rem; }
  .relato p.destacado{ font-size:1.02rem; }
  .tarifa-precio strong.texto{ font-size:1.25rem; }
}

/* ============================================================
   IMPACTO — componentes de la causa animal
   (los datos viven en _fuentes/datos-impacto.json)
   ============================================================ */

/* sin las pastillas de donación por tarifa, el botón vuelve a anclarse abajo */
.tarifa .btn{ margin-top:auto; }

/* --- cifras en la cabecera de /nuestro-impacto --- */
.impacto-cifras{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.8rem; }
.impacto-cifra{
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.16);
  border-radius:18px; padding:1rem 1.5rem; min-width:150px;
}
.impacto-cifra strong{
  display:block; font-size:2.1rem; font-weight:800; letter-spacing:-.03em;
  line-height:1.1; color:#fff;
}
.impacto-cifra > span{
  font-size:.74rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:#a9bcae;
}
.impacto-hoy{ margin-top:1.3rem; color:var(--lima); font-weight:700; font-size:1.02rem; }
.page-header .hero-ctas{ margin-top:1.8rem; display:flex; flex-wrap:wrap; gap:1rem; }

/* --- bloque de mensaje "Acabamos de empezar" --- */
.mensaje{ max-width:62ch; }
.mensaje p{ font-size:1.15rem; color:var(--tinta-2); margin-bottom:1.15rem; }
.mensaje p:first-child{
  font-size:clamp(1.6rem, 3vw, 2.1rem); font-weight:800; letter-spacing:-.025em;
  color:var(--tinta); line-height:1.15;
}
.frase-marca{
  margin-top:2.6rem; padding:2rem 2.2rem;
  background:var(--menta); border-left:5px solid var(--esmeralda); border-radius:0 22px 22px 0;
  font-size:clamp(1.35rem, 2.6vw, 1.8rem); font-weight:800; letter-spacing:-.02em;
  color:var(--bosque); text-wrap:balance;
}

/* --- tarjetas de entidades --- */
.orgs{ display:grid; gap:1.5rem; margin-top:3rem; }
@media (min-width: 760px){ .orgs{ grid-template-columns:repeat(2,1fr); } }
@media (min-width: 1100px){ .orgs{ grid-template-columns:repeat(3,1fr); } }
.org{
  background:var(--superficie); border:1px solid var(--linea); border-radius:24px;
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform .3s var(--suave), box-shadow .3s var(--suave);
}
.org:hover{ transform:translateY(-6px); box-shadow:var(--sombra-2); }
.org-foto{ aspect-ratio:16/10; position:relative; overflow:hidden; background:var(--menta); }
.org-foto img{ width:100%; height:100%; object-fit:cover; }
.org-estado{
  position:absolute; top:12px; left:12px;
  display:inline-flex; align-items:center; gap:.4rem;
  background:rgba(255,255,255,.94); color:var(--esmeralda-2);
  font-size:.7rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase;
  padding:.36rem .8rem; border-radius:999px; box-shadow:0 4px 14px rgba(0,0,0,.18);
}
.org-estado svg{ width:12px; height:12px; }
.org-local{
  position:absolute; top:12px; right:12px;
  display:inline-flex; align-items:center; gap:.35rem;
  background:var(--ambar); color:#4a3308;
  font-size:.68rem; font-weight:800; letter-spacing:.05em;
  padding:.34rem .7rem; border-radius:999px; box-shadow:0 4px 14px rgba(0,0,0,.16);
}
.org-local svg{ width:11px; height:11px; }
.org-cuerpo{ padding:1.4rem 1.4rem 1.5rem; display:flex; flex-direction:column; flex:1; gap:.7rem; }
.chips{ display:flex; flex-wrap:wrap; gap:.4rem; }
.chip{
  font-size:.7rem; font-weight:700; letter-spacing:.03em;
  background:var(--crudo); color:var(--tinta-2); border:1px solid var(--linea);
  padding:.28rem .7rem; border-radius:999px; white-space:nowrap;
}
.org h3{ font-size:1.18rem; font-weight:800; letter-spacing:-.02em; line-height:1.2; }
.org-ambito{ font-size:.8rem; color:var(--tinta-3); margin-top:-.35rem; }
.org-importe{ display:flex; align-items:baseline; gap:.5rem; }
.org-importe strong{ font-size:1.9rem; font-weight:800; letter-spacing:-.03em; color:var(--esmeralda); }
.org-importe span{ font-size:.85rem; color:var(--tinta-3); }
.org-desc{ font-size:.92rem; color:var(--tinta-3); }
.org-aportes{ display:grid; gap:.45rem; border-top:1px solid var(--linea); padding-top:.85rem; }
.org-aportes li{
  display:flex; justify-content:space-between; align-items:baseline; gap:.8rem;
  font-size:.85rem; color:var(--tinta-2); font-variant-numeric:tabular-nums;
}
.org-aportes li strong{ font-weight:800; white-space:nowrap; }
.org-acciones{ margin-top:auto; display:flex; flex-wrap:wrap; gap:.6rem; padding-top:.4rem; }
.org-acciones .btn{ flex:1; padding:.62rem .9rem; font-size:.85rem; min-width:0; white-space:normal; text-align:center; }
.just-pendiente{
  flex:1; display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  font-size:.78rem; font-weight:600; color:var(--tinta-3);
  border:1.5px dashed var(--linea); border-radius:999px; padding:.62rem .9rem; text-align:center;
}

/* --- tarjetas fantasma "próximamente" --- */
.org-ghost{
  border:1.5px dashed rgba(15,23,18,.2); border-radius:24px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.6rem; padding:2.6rem 1.6rem; text-align:center; color:var(--tinta-3);
  background:transparent; min-height:230px;
}
.org-ghost svg{ width:34px; height:34px; opacity:.4; }
.org-ghost strong{ font-size:.78rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.org-ghost p{ font-size:.85rem; max-width:26ch; }

/* --- cronología de impacto --- */
.linea-tiempo{ margin-top:2.6rem; display:grid; gap:0; max-width:640px; }
.hito{
  display:grid; grid-template-columns:110px 1fr; gap:1.2rem; align-items:baseline;
  padding:1.05rem 0; border-bottom:1px solid var(--linea);
}
.hito:last-child{ border-bottom:0; }
.hito-fecha{
  font-size:.74rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--tinta-3); white-space:nowrap;
}
.hito-info{ font-size:.98rem; color:var(--tinta-2); }
.hito-info strong{ font-weight:800; color:var(--esmeralda); font-variant-numeric:tabular-nums; }

/* --- minis de entidades (home y módulos) --- */
.impacto-minis{ display:grid; gap:.9rem; margin-top:2.4rem; }
@media (min-width: 700px){ .impacto-minis{ grid-template-columns:repeat(3,1fr); } }
.mini{
  display:flex; align-items:center; gap:.9rem; text-decoration:none;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14);
  border-radius:16px; padding:.8rem .95rem; color:#fff;
  transition:background .25s, transform .25s;
}
.mini:hover{ background:rgba(255,255,255,.12); transform:translateY(-3px); }
.mini img{ width:52px; height:52px; border-radius:12px; object-fit:cover; flex:none; }
.mini b{ display:block; font-size:.92rem; font-weight:800; letter-spacing:-.01em; line-height:1.2; }
.mini span{ font-size:.78rem; color:#a9bcae; }
.impacto-frase{ margin-top:2.2rem; font-size:1.08rem; font-weight:700; color:var(--lima); }

/* --- módulo compacto en páginas de tarifas --- */
.modulo-causa{
  margin-top:2.6rem; background:var(--superficie); border:1px solid var(--linea);
  border-radius:22px; padding:1.6rem 1.7rem;
  display:grid; gap:1.3rem; align-items:center;
}
@media (min-width: 860px){ .modulo-causa{ grid-template-columns:auto 1fr auto; padding:1.7rem 2rem; } }
.modulo-fotos{ display:flex; }
.modulo-fotos img{
  width:56px; height:56px; border-radius:50%; object-fit:cover;
  border:3px solid var(--superficie); box-shadow:0 3px 10px rgba(15,23,18,.14);
}
.modulo-fotos img + img{ margin-left:-14px; }
.modulo-causa h3{ font-size:1.08rem; font-weight:800; letter-spacing:-.015em; margin-bottom:.3rem; }
.modulo-causa p{ font-size:.9rem; color:var(--tinta-3); max-width:58ch; }
.modulo-causa .enlace{
  font-weight:700; font-size:.94rem; color:var(--esmeralda); text-decoration:none; white-space:nowrap;
}
.modulo-causa .enlace:hover{ text-decoration:underline; }

/* --- banda reutilizable entre secciones --- */
.banda-impacto{
  background:var(--bosque); color:#fff; border-radius:22px;
  padding:1.7rem 1.8rem; margin-top:3rem;
  display:grid; gap:1.1rem; align-items:center; position:relative; overflow:clip;
}
@media (min-width: 860px){ .banda-impacto{ grid-template-columns:1fr auto; padding:1.9rem 2.3rem; } }
.banda-impacto::before{
  content:""; position:absolute; inset:-60% -20% auto -20%; height:200%;
  background:radial-gradient(38% 46% at 82% 30%, rgba(159,216,180,.15), transparent 70%);
  pointer-events:none;
}
.banda-impacto > *{ position:relative; }
.banda-kicker{
  font-size:.72rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  color:var(--lima); margin-bottom:.35rem;
}
.banda-impacto p{ color:#c8d6c6; font-size:.95rem; max-width:58ch; }
.banda-impacto p b{ color:#fff; }

/* --- enlace a la causa en el hero de la portada --- */
.hero-causa{ margin-top:1.6rem; }
.hero-causa a{
  display:inline-flex; align-items:center; gap:.55rem;
  color:#e2ebe2; font-size:.92rem; font-weight:600; text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.35); padding-bottom:.15rem;
  transition:color .2s, border-color .2s;
}
.hero-causa a:hover{ color:#fff; border-color:#fff; }
.hero-causa svg{ width:15px; height:15px; color:var(--ambar); flex:none; }

/* --- menú móvil: entrada destacada de impacto --- */
.menu-movil a.menu-impacto{ border-bottom:0; }
.menu-movil .menu-impacto-sub{
  display:block; font-size:.8rem; font-weight:500; color:var(--tinta-3); margin-top:.1rem;
}

/* --- visor de justificantes --- */
.dlg-just{
  border:0; border-radius:22px; padding:0; max-width:min(720px, 92vw);
  box-shadow:0 40px 90px rgba(0,0,0,.4); background:var(--superficie);
}
.dlg-just::backdrop{ background:rgba(8,18,9,.72); }
@supports (backdrop-filter: blur(6px)){ .dlg-just::backdrop{ backdrop-filter:blur(6px); } }
.dlg-just-cab{
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  padding:1.1rem 1.4rem; border-bottom:1px solid var(--linea);
}
.dlg-just-cab h3{ font-size:1rem; font-weight:800; letter-spacing:-.01em; }
.dlg-just-cerrar{
  width:38px; height:38px; border-radius:50%; border:1px solid var(--linea);
  background:var(--crudo); cursor:pointer; font-size:1.1rem; line-height:1;
  display:grid; place-items:center; color:var(--tinta);
}
.dlg-just-cerrar:hover{ background:var(--menta); }
.dlg-just img{ display:block; width:100%; max-height:72vh; object-fit:contain; background:var(--crudo); }
.dlg-just-pie{ padding:.9rem 1.4rem 1.1rem; font-size:.8rem; color:var(--tinta-3); }

/* --- móvil --- */
@media (max-width: 699px){
  .impacto-cifra{ flex:1; min-width:130px; padding:.85rem 1.1rem; }
  .impacto-cifra strong{ font-size:1.7rem; }
  .orgs{ gap:1rem; margin-top:2rem; }
  .org-cuerpo{ padding:1.15rem 1.1rem 1.25rem; }
  .org-importe strong{ font-size:1.7rem; }
  .frase-marca{ padding:1.4rem 1.3rem; }
  .hito{ grid-template-columns:92px 1fr; gap:.8rem; }
  .modulo-causa{ padding:1.3rem 1.2rem; }
  .banda-impacto{ padding:1.4rem 1.3rem; margin-top:2.2rem; }
  .mensaje p{ font-size:1rem; }
  .mensaje p:first-child{ font-size:1.45rem; }
}

/* ============================================================
   MÓVIL — tarjetas de impacto de 2 en 2 (petición 2026-09-22)
   ============================================================ */
@media (max-width: 699px){
  .orgs{ grid-template-columns:repeat(2,1fr); gap:.7rem; }
  .org{ border-radius:18px; }
  .org-foto{ aspect-ratio:4/3; }
  .org-estado{ font-size:.55rem; padding:.26rem .5rem; top:8px; left:8px; letter-spacing:.03em; gap:.3rem; }
  .org-estado svg{ width:10px; height:10px; }
  .org-local{ font-size:.53rem; padding:.24rem .45rem; top:8px; right:8px; }
  .org-cuerpo{ padding:.85rem .8rem 1rem; gap:.5rem; }
  .org h3{ font-size:.9rem; }
  .org-ambito{ font-size:.7rem; margin-top:-.2rem; }
  .chips{ gap:.3rem; }
  .chip{ font-size:.6rem; padding:.2rem .5rem; }
  .org-desc{ display:none; }
  .org-aportes{ padding-top:.6rem; gap:.2rem; }
  .org-aportes li{ font-size:.72rem; flex-direction:column; align-items:flex-start; gap:.05rem; }
  .org-acciones{ flex-direction:column; gap:.45rem; padding-top:.5rem; }
  .org-acciones .btn{ width:100%; flex:none; font-size:.74rem; padding:.55rem .5rem; }
  .just-pendiente{ width:100%; flex:none; font-size:.64rem; padding:.5rem .45rem; }
  .org-ghost{ min-height:140px; padding:1.3rem .8rem; gap:.4rem; }
  .org-ghost svg{ width:26px; height:26px; }
  .org-ghost p{ font-size:.7rem; }
  .impacto-minis{ grid-template-columns:repeat(2,1fr); gap:.55rem; }
  .mini{ padding:.6rem .65rem; gap:.55rem; border-radius:13px; }
  .mini img{ width:38px; height:38px; border-radius:10px; }
  .mini b{ font-size:.76rem; }
  .mini span{ font-size:.64rem; }
}

/* ============================================================
   FICHAS DE ENTIDAD + TARJETAS GRANDES DE PORTADA (2026-09-22)
   ============================================================ */

/* tarjeta org: foto y título ahora son enlaces a la ficha */
a.org-foto{ display:block; text-decoration:none; }
.org h3 a{ color:inherit; text-decoration:none; }
.org h3 a:hover{ color:var(--esmeralda); }
.org:hover .org-foto img{ transform:scale(1.04); }
.org-foto img{ transition:transform .45s var(--suave); }
.org-weblink{ margin-top:.55rem; font-size:.78rem; }
.org-weblink a{ color:var(--tinta-3); text-decoration:none; border-bottom:1px dotted currentColor; }
.org-weblink a:hover{ color:var(--esmeralda); }
.hito-web{ font-size:.82rem; color:var(--tinta-3); }

/* --- tarjetas GRANDES de impacto en portada (foto dominante) --- */
.imp-grandes{ display:grid; gap:1.4rem; margin-top:2.8rem; }
@media (min-width: 820px){ .imp-grandes{ grid-template-columns:repeat(3,1fr); gap:1.6rem; } }
.imp-grande{
  position:relative; display:block; border-radius:26px; overflow:hidden;
  aspect-ratio:3/4; text-decoration:none; background:var(--bosque);
  transition:transform .35s var(--suave), box-shadow .35s var(--suave);
}
.imp-grande:hover{ transform:translateY(-8px); box-shadow:0 24px 60px rgba(0,0,0,.45); }
.imp-grande img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform .6s var(--suave);
}
.imp-grande:hover img{ transform:scale(1.06); }
.imp-grande::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(7,26,17,.88) 0%, rgba(7,26,17,.32) 42%, rgba(7,26,17,0) 65%);
}
.imp-grande-info{
  position:absolute; left:0; right:0; bottom:0; z-index:1;
  padding:1.5rem 1.5rem 1.4rem; display:flex; flex-direction:column; gap:.4rem; color:#fff;
}
.imp-grande-info b{ font-size:1.35rem; font-weight:800; letter-spacing:-.02em; line-height:1.15; }
.imp-grande-info span{
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:.82rem; font-weight:700; color:var(--lima);
}
.imp-grande-info span svg{ width:13px; height:13px; flex:none; }
.imp-grande-info em{
  font-style:normal; font-size:.8rem; font-weight:800; letter-spacing:.06em;
  text-transform:uppercase; color:rgba(255,255,255,.85); margin-top:.3rem;
  transition:color .25s;
}
.imp-grande:hover .imp-grande-info em{ color:var(--ambar); }

/* --- galería de la ficha de entidad --- */
.ficha-galeria{ display:grid; gap:1.1rem; }
@media (min-width: 760px){
  .ficha-galeria{ grid-template-columns:repeat(2,1fr); gap:1.4rem; }
  .ficha-galeria figure:first-child{ grid-column:1/-1; }
}
.ficha-galeria figure{
  margin:0; border-radius:22px; overflow:hidden; background:var(--menta);
  border:1px solid var(--linea);
}
.ficha-galeria figure:first-child img{ max-height:520px; }
.ficha-galeria img{ width:100%; height:auto; max-height:440px; object-fit:cover; display:block; }
.ficha-galeria figcaption{
  padding:.7rem 1.1rem .85rem; font-size:.78rem; color:var(--tinta-3);
  background:var(--superficie);
}

/* --- bloque donación + justificante en la ficha --- */
.org-aportes-ficha{
  margin-top:2.6rem; display:flex; flex-wrap:wrap; align-items:center; gap:1.2rem;
  justify-content:space-between; background:var(--superficie);
  border:1px solid var(--linea); border-radius:20px; padding:1.4rem 1.7rem;
  box-shadow:var(--sombra);
}
.org-aportes-ficha b{ display:block; font-size:1.05rem; font-weight:800; color:var(--esmeralda); }
.org-aportes-ficha span{ display:block; font-size:.88rem; color:var(--tinta-3); margin-top:.2rem; }

/* --- enlaces "ayúdales más" --- */
.ficha-enlaces{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2.2rem; }

/* --- móvil --- */
@media (max-width: 699px){
  .imp-grandes{ gap:1rem; margin-top:2rem; }
  .imp-grande{ aspect-ratio:4/3; border-radius:20px; }
  .imp-grande-info{ padding:1.1rem 1.1rem 1rem; }
  .imp-grande-info b{ font-size:1.15rem; }
  .ficha-galeria{ grid-template-columns:repeat(2,1fr); gap:.7rem; }
  .ficha-galeria figure{ border-radius:15px; }
  .ficha-galeria figure:first-child{ grid-column:1/-1; }
  .ficha-galeria img{ max-height:260px; }
  .ficha-galeria figcaption{ font-size:.66rem; padding:.5rem .7rem .6rem; }
  .org-aportes-ficha{ flex-direction:column; align-items:stretch; text-align:center; padding:1.2rem 1.1rem; }
  .org-aportes-ficha .btn{ width:100%; }
  .ficha-enlaces{ gap:.55rem; }
  .ficha-enlaces .btn{ flex:1 1 46%; font-size:.78rem; padding:.6rem .5rem; }
}

/* ============================================================
   TARIFAS 2.0 — selector, tarjetas con mascota, configurador,
   otros servicios (2026-09-22)
   ============================================================ */

/* --- selector Móvil | Fibra+Móvil | Fibra --- */
.selector-tarifas{
  display:flex; justify-content:center; align-items:stretch; gap:.35rem;
  background:var(--crudo); border:1px solid var(--linea); border-radius:22px;
  padding:.45rem; max-width:640px; margin:0 auto 2.6rem;
}
.sel-btn{
  flex:1; border:0; background:transparent; cursor:pointer;
  font-family:var(--fuente); font-weight:800; font-size:.95rem; color:var(--tinta-3);
  padding:.85rem .6rem; border-radius:16px; letter-spacing:-.01em;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.1rem;
  transition:background .25s var(--suave), color .25s, box-shadow .25s, transform .25s var(--suave);
}
.sel-btn small{ font-size:.66rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; opacity:.75; }
.sel-btn:hover{ color:var(--esmeralda); }
.sel-btn.activo{ background:var(--superficie); color:var(--esmeralda); box-shadow:var(--sombra); }
.sel-principal{ font-size:1.08rem; flex:1.35; }
.sel-principal.activo{ background:var(--esmeralda); color:#fff; }
.sel-principal.activo small{ color:var(--lima); opacity:1; }

/* --- paneles --- */
.panel-tarifas{ display:none; }
.panel-tarifas.activo{ display:block; animation:panelIn .3s var(--suave); }
@keyframes panelIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }

/* --- tarjetas de tarifa con mascota --- */
.trf-grid{ display:grid; gap:1.5rem; align-items:stretch; }
@media (min-width: 860px){
  .trf-grid-3{ grid-template-columns:repeat(3,1fr); gap:1.7rem; }
  .trf-grid-2{ grid-template-columns:repeat(2,1fr); gap:1.7rem; max-width:820px; margin-inline:auto; }
}
.trf{
  position:relative; display:flex; flex-direction:column;
  background:var(--superficie); border:1px solid var(--linea); border-radius:26px;
  overflow:hidden; transition:transform .3s var(--suave), box-shadow .3s var(--suave);
}
.trf:hover{ transform:translateY(-6px); box-shadow:var(--sombra-2); }
.trf-foto{ aspect-ratio:5/4; overflow:hidden; background:var(--menta); }
.trf-foto img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--suave); }
.trf:hover .trf-foto img{ transform:scale(1.05); }
.trf-cuerpo{ display:flex; flex-direction:column; gap:.55rem; padding:1.35rem 1.45rem 1.55rem; flex:1; }
.trf h3{ font-size:1.28rem; font-weight:800; letter-spacing:-.02em; }
.trf-frase{ font-size:.9rem; color:var(--tinta-3); margin-top:-.35rem; }
.trf-specs{ list-style:none; display:grid; gap:.45rem; padding:.65rem 0 .3rem; }
.trf-specs li{ display:flex; align-items:flex-start; gap:.55rem; font-size:.9rem; color:var(--tinta-2); }
.trf-specs svg{ width:15px; height:15px; flex:none; margin-top:.28em; color:var(--esmeralda); }
.trf-precio{ margin-top:auto; padding-top:.5rem; display:flex; align-items:baseline; gap:.35rem; }
.trf-precio strong{ font-size:2.1rem; font-weight:800; letter-spacing:-.04em; color:var(--esmeralda); font-variant-numeric:tabular-nums; }
.trf-precio span{ font-size:.78rem; color:var(--tinta-3); }
.trf .btn{ width:100%; justify-content:center; margin-top:.6rem; }

/* destacada: 8-12% mayor en escritorio */
.trf-destacada{ border:2px solid var(--esmeralda); }
@media (min-width: 860px){
  .trf-destacada{ transform:scale(1.09); z-index:2; box-shadow:var(--sombra-2); }
  .trf-destacada:hover{ transform:scale(1.09) translateY(-6px); }
}
.trf-etiqueta{
  position:absolute; top:14px; left:50%; transform:translateX(-50%); z-index:3;
  background:var(--ambar); color:#5c3d05; font-size:.68rem; font-weight:800;
  letter-spacing:.09em; text-transform:uppercase; padding:.4rem .95rem; border-radius:999px;
  box-shadow:0 6px 18px rgba(0,0,0,.22); white-space:nowrap;
}

/* --- configurador de líneas --- */
.configurador{
  margin-top:2.6rem; background:var(--superficie); border:1px solid var(--linea);
  border-radius:26px; padding:1.8rem 1.9rem; box-shadow:var(--sombra);
  display:grid; gap:1.4rem;
}
@media (min-width: 900px){
  .configurador{ grid-template-columns:1.1fr 1.4fr .9fr 1fr; align-items:center; gap:1.6rem; }
}
.cfg-cab h3{ font-size:1.15rem; font-weight:800; letter-spacing:-.02em; }
.cfg-cab p{ font-size:.85rem; color:var(--tinta-3); margin-top:.3rem; }
.cfg-opciones{ display:flex; flex-wrap:wrap; gap:.5rem; }
.cfg-opcion{ cursor:pointer; position:relative; }
.cfg-opcion input{ position:absolute; opacity:0; pointer-events:none; }
.cfg-opcion span{
  display:flex; flex-direction:column; align-items:center; gap:.05rem;
  border:1.5px solid var(--linea); border-radius:14px; padding:.55rem .95rem;
  transition:border-color .2s, background .2s, transform .2s var(--suave);
}
.cfg-opcion b{ font-size:.9rem; font-weight:800; }
.cfg-opcion small{ font-size:.7rem; color:var(--tinta-3); }
.cfg-opcion input:checked + span{ border-color:var(--esmeralda); background:var(--menta); transform:translateY(-2px); }
.cfg-opcion input:focus-visible + span{ outline:3px solid rgba(14,107,69,.4); outline-offset:2px; }
.cfg-lineas{ display:flex; flex-direction:column; gap:.4rem; }
.cfg-lineas > span{ font-size:.78rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--tinta-3); }
.cfg-stepper{ display:inline-flex; align-items:center; gap:.9rem; }
.cfg-stepper button{
  width:42px; height:42px; border-radius:50%; border:1.5px solid var(--linea);
  background:var(--superficie); font-size:1.3rem; font-weight:700; color:var(--esmeralda);
  cursor:pointer; transition:background .2s, border-color .2s, transform .15s var(--suave);
  line-height:1;
}
.cfg-stepper button:hover{ background:var(--menta); border-color:var(--esmeralda); }
.cfg-stepper button:active{ transform:scale(.92); }
.cfg-stepper b{ font-size:1.35rem; font-weight:800; min-width:1.4ch; text-align:center; font-variant-numeric:tabular-nums; }
.cfg-total{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  background:var(--bosque); color:#fff; border-radius:18px; padding:1rem 1.3rem;
}
.cfg-total > div > span{ display:block; font-size:.92rem; font-weight:800; }
.cfg-total small{ display:block; font-size:.7rem; color:#a9bcae; margin-top:.15rem; }
.cfg-total strong{ font-size:1.9rem; font-weight:800; letter-spacing:-.03em; color:var(--lima); font-variant-numeric:tabular-nums; white-space:nowrap; }
.cfg-total strong em{ font-style:normal; font-size:.8rem; color:#a9bcae; }
.cfg-total strong.pop{ animation:pop .3s var(--suave); }
@keyframes pop{ 0%{ transform:scale(1); } 45%{ transform:scale(1.12); } 100%{ transform:scale(1); } }

.titulo-tabla{ margin-top:3rem; font-size:1.15rem; font-weight:800; letter-spacing:-.02em; }
.titulo-tabla + .tabla-wrap{ margin-top:1.3rem; }

/* --- teaser de otras tarifas en portada --- */
.trf-otros{
  margin-top:2rem; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:.45rem 1.3rem; text-align:center;
  background:var(--superficie); border:1px solid var(--linea); border-radius:18px;
  padding:1.05rem 1.5rem; box-shadow:var(--sombra);
  font-size:1rem; color:var(--tinta-2); font-weight:600;
}
.trf-otros strong{ color:var(--esmeralda); font-weight:800; }
.trf-otros .enlace{ color:var(--esmeralda); font-weight:800; }

/* --- otros servicios --- */
.otros-grid{ display:grid; gap:1.5rem; margin-top:2.8rem; }
@media (min-width: 860px){ .otros-grid{ grid-template-columns:repeat(3,1fr); gap:1.7rem; } }
.otro{
  background:var(--superficie); border:1px solid var(--linea); border-radius:26px;
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform .3s var(--suave), box-shadow .3s var(--suave);
}
.otro:hover{ transform:translateY(-6px); box-shadow:var(--sombra-2); }
.otro-foto{ aspect-ratio:16/10; overflow:hidden; background:var(--menta); }
.otro-foto img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--suave); }
.otro:hover .otro-foto img{ transform:scale(1.05); }
.otro-cuerpo{ padding:1.3rem 1.4rem 1.5rem; display:flex; flex-direction:column; gap:.55rem; flex:1; }
.otro h3{ font-size:1.15rem; font-weight:800; letter-spacing:-.02em; }
.otro p{ font-size:.9rem; color:var(--tinta-3); }
.otro-precio{
  margin-top:auto; align-self:flex-start; background:var(--menta); color:var(--esmeralda-2);
  font-size:.8rem; font-weight:800; padding:.42rem .9rem; border-radius:999px;
}

/* --- móvil: carrusel de tarjetas + ajustes --- */
@media (max-width: 699px){
  .selector-tarifas{ margin-bottom:1.8rem; padding:.35rem; gap:.25rem; border-radius:18px; }
  .sel-btn{ font-size:.8rem; padding:.65rem .3rem; border-radius:13px; }
  .sel-btn small{ font-size:.54rem; }
  .sel-principal{ font-size:.88rem; }

  .trf-grid{
    grid-auto-flow:column; grid-auto-columns:86%;
    overflow-x:auto; scroll-snap-type:x mandatory;
    gap:.8rem; padding:0 .2rem 1rem;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
  }
  .trf-grid::-webkit-scrollbar{ display:none; }
  .trf{ scroll-snap-align:start; border-radius:20px; }
  .trf-grid-2{ grid-auto-columns:86%; }
  .trf-foto{ aspect-ratio:1/1; }
  .trf-cuerpo{ padding:1rem 1.05rem 1.2rem; }
  .trf h3{ font-size:1.1rem; }
  .trf-precio strong{ font-size:1.8rem; }
  .trf-etiqueta{ font-size:.6rem; padding:.32rem .7rem; }

  .configurador{ padding:1.3rem 1.15rem; margin-top:1.8rem; }
  .cfg-total{ flex-direction:column; align-items:stretch; text-align:center; gap:.5rem; }
  .cfg-opciones{ justify-content:center; }
  .otros-grid{ gap:1rem; margin-top:2rem; }
  .trf-otros{ font-size:.88rem; padding:.9rem 1rem; }
}

/* --- accesibilidad: sin animaciones si el sistema lo pide --- */
@media (prefers-reduced-motion: reduce){
  .panel-tarifas.activo{ animation:none; }
  .cfg-total strong.pop{ animation:none; }
  .trf, .trf-foto img, .otro, .otro-foto img, .imp-grande, .imp-grande img,
  .sel-btn, .cfg-opcion span, .cfg-stepper button{ transition:none !important; }
}

/* ============================================================
   FRANJA DE PORTADA — avatares de entidades (2026-09-23)
   ============================================================ */
.franja-fotos .avatares{ display:flex; gap:1rem; }
.avatar-ent{
  display:flex; flex-direction:column; align-items:center; gap:.35rem;
  text-decoration:none;
}
.avatar-ent img{
  width:58px; height:58px; border-radius:50%; object-fit:cover; display:block;
  border:2.5px solid var(--menta); box-shadow:var(--sombra);
  transition:transform .25s var(--suave), border-color .25s;
}
.avatar-ent:hover img{ transform:scale(1.1); border-color:var(--esmeralda); }
.avatar-ent b{
  font-size:.64rem; font-weight:800; letter-spacing:.08em;
  color:var(--esmeralda-2);
}
.franja-fotos > span{ display:block; margin-top:.55rem; }

/* móvil: tarjeta compacta, menos letra */
@media (max-width: 799px){
  .franja-card{ grid-template-columns:1fr 1fr; gap:1.1rem 1.2rem; padding:1.4rem 1.3rem 1.5rem; }
  .franja-fotos{ grid-column:1/-1; }
  .franja-fotos .avatares{ justify-content:center; gap:1.4rem; }
  .avatar-ent img{ width:68px; height:68px; }
  .franja-fotos > span{ text-align:center; font-size:.78rem; margin-top:.6rem; }
  .franja-item strong{ font-size:1.2rem; }
  .franja-item > span{ font-size:.74rem; }
  .franja-enlace{ grid-column:1/-1; justify-self:center; }
}

/* --- miniaturas en las tarjetas de informe de entidad (2026-09-23) --- */
.transp-foto{
  margin:-2.1rem -1.9rem 1.3rem; height:150px; overflow:hidden;
  border-radius:var(--radio) var(--radio) 0 0;
}
.transp-foto img{ width:100%; height:100%; object-fit:cover; object-position:50% 32%; display:block; }
@media (max-width: 699px){
  .transp-foto{ margin:-1.4rem -1.2rem 1rem; height:150px; }
}

/* --- mini mosaicos de fotos en Quienes somos (2026-09-23) --- */
.mini-mosaico{ display:flex; gap:.8rem; margin:1.7rem 0 1.5rem; }
.mini-mosaico a, .mini-mosaico span{ flex:1; display:block; }
.mini-mosaico img{
  width:100%; height:auto; aspect-ratio:1/1; object-fit:cover; display:block;
  border-radius:18px; box-shadow:var(--sombra);
  transition:transform .3s var(--suave);
}
.mini-mosaico a:hover img{ transform:scale(1.06) rotate(-1.5deg); }
.mini-mosaico-pie{ font-size:.8rem; color:var(--tinta-3); margin:-.4rem 0 1.6rem; }
.huella .mini-mosaico{ max-width:520px; margin:2.2rem auto 1.2rem; }
.huella .mini-mosaico img{ border-radius:50%; border:3px solid rgba(255,255,255,.18); }
@media (max-width: 699px){
  .mini-mosaico{ gap:.5rem; }
  .mini-mosaico img{ border-radius:14px; }
}

/* ============================================================
   BANDA FOTO + PALABRA "De esto va todo" (2026-09-23)
   ============================================================ */
.banda-palabras{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; margin-top:2.6rem; }
.bp{
  position:relative; margin:0; border-radius:22px; overflow:hidden;
  aspect-ratio:4/5; background:var(--bosque);
}
.bp img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform .5s var(--suave);
}
.bp:hover img{ transform:scale(1.06); }
.bp::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(7,26,17,.82) 0%, rgba(7,26,17,.2) 45%, rgba(7,26,17,0) 65%);
}
.bp-info{
  position:absolute; left:0; right:0; bottom:0; z-index:1;
  padding:1.1rem 1.15rem 1.05rem; color:#fff;
}
.bp-info b{
  display:block; font-size:1.25rem; font-weight:800; letter-spacing:-.02em; line-height:1.1;
}
.bp-info span{ display:block; font-size:.78rem; color:var(--lima); margin-top:.25rem; font-weight:600; }
.bp-pie{ margin-top:1.3rem; text-align:center; font-size:.8rem; color:var(--tinta-3); }
.bp-pie a{ color:var(--esmeralda); font-weight:700; text-decoration:none; }
.bp-pie a:hover{ text-decoration:underline; }

@media (max-width: 860px){
  .banda-palabras{ grid-template-columns:repeat(2,1fr); gap:.7rem; margin-top:1.8rem; }
  .bp{ border-radius:16px; aspect-ratio:1/1; }
  .bp-info{ padding:.8rem .85rem .75rem; }
  .bp-info b{ font-size:1.05rem; }
  .bp-info span{ font-size:.68rem; }
}
@media (prefers-reduced-motion: reduce){
  .bp img{ transition:none !important; }
}

/* ============================================================
   GALERÍA DE FICHA v2 — celdas uniformes, pie sobre la foto
   (sustituye al estilo anterior; 2026-09-23)
   ============================================================ */
.ficha-galeria{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.2rem; }
.ficha-galeria figure{
  position:relative; margin:0; border:0; overflow:hidden;
  border-radius:22px; background:var(--bosque);
  aspect-ratio:1/1;
}
.ficha-galeria figure:first-child{ grid-column:1/-1; aspect-ratio:16/9; }
.ficha-galeria img{
  position:absolute; inset:0; width:100%; height:100%; max-height:none;
  object-fit:cover; display:block;
  transition:transform .5s var(--suave);
}
.ficha-galeria figure:hover img{ transform:scale(1.05); }
.ficha-galeria figcaption{
  position:absolute; left:0; right:0; bottom:0; z-index:1;
  padding:1.5rem 1rem .75rem; background:linear-gradient(to top, rgba(7,26,17,.85) 30%, rgba(7,26,17,0));
  color:#fff; font-size:.8rem; font-weight:600; line-height:1.3;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
@media (max-width: 699px){
  .ficha-galeria{ gap:.6rem; }
  .ficha-galeria figure{ border-radius:14px; }
  .ficha-galeria figure:first-child{ aspect-ratio:4/3; }
  .ficha-galeria figcaption{ font-size:.64rem; padding:1.1rem .65rem .55rem; }
}
@media (prefers-reduced-motion: reduce){
  .ficha-galeria img{ transition:none !important; }
}

/* banda "De esto va todo": pegada a la seccion anterior y pie solo-enlace (2026-09-23) */
#de-esto-va{ padding-top:1.5rem; }
#de-esto-va .titulo{ margin-bottom:0; }
.bp-pie{ font-size:.95rem; }
.bp-pie a{ font-size:1rem; }
@media (max-width: 699px){
  #de-esto-va{ padding-top:.4rem; }
  .banda-palabras{ margin-top:1.4rem; }
}

/* botones de accion siempre uno al lado del otro en movil (2026-09-23) */
@media (max-width: 699px){
  .hero-ctas{ flex-wrap:nowrap; gap:.6rem; }
  .hero-ctas .btn{
    flex:1 1 0; min-width:0; justify-content:center; text-align:center;
    padding:.85rem .55rem; font-size:.82rem; white-space:normal; line-height:1.25;
  }
}

/* boton "Conoce nuestra historia" (y similares) centrado en movil */
@media (max-width: 699px){
  .historia-texto .btn-verde{ display:flex; width:fit-content; margin-left:auto; margin-right:auto; }
}

/* tambien en cabeceras de pagina: botones en una sola fila en movil */
@media (max-width: 699px){
  .page-header .hero-ctas{ flex-wrap:nowrap; gap:.6rem; }
}

/* ============================================================
   TARJETAS DEL INFORME v2: foto alta y carrusel en movil,
   como las tarifas (2026-09-23)
   ============================================================ */
.transp-foto{ height:auto; aspect-ratio:16/10; }
.transp-foto img{ object-position:center; }
@media (max-width: 699px){
  #informe .transp-grid, #transparencia .transp-grid{
    display:grid; grid-auto-flow:column; grid-auto-columns:86%;
    overflow-x:auto; scroll-snap-type:x mandatory; gap:.8rem;
    padding-bottom:1rem; -webkit-overflow-scrolling:touch; scrollbar-width:none;
  }
  #informe .transp-grid::-webkit-scrollbar, #transparencia .transp-grid::-webkit-scrollbar{ display:none; }
  #informe .transp-card, #transparencia .transp-card{ scroll-snap-align:start; border-radius:20px; }
  .transp-foto{ aspect-ratio:4/3; height:auto; }
}

/* ============================================================
   CÓMO CAMBIARTE v2 — pasos en tarjetas-cuadrado (2026-10-19)
   ============================================================ */
.ruta{ gap:1.2rem; }
.ruta-paso{
  border-top:0; padding:1.4rem 1.3rem 1.5rem;
  background:var(--superficie); border:1px solid var(--linea); border-radius:20px;
  box-shadow:var(--sombra);
  transition:transform .3s var(--suave), box-shadow .3s var(--suave);
}
.ruta-paso:hover{ transform:translateY(-5px); box-shadow:var(--sombra-2); }
.ruta-paso::before{
  position:static; display:inline-grid; place-items:center;
  width:2.1rem; height:2.1rem; margin-bottom:.8rem;
}
@media (max-width: 819px){
  .ruta{ grid-template-columns:repeat(2,1fr); gap:.7rem; }
  .ruta-paso{ padding:1.05rem 1rem 1.15rem; border-radius:16px; }
  .ruta-paso::before{ width:1.8rem; height:1.8rem; font-size:.78rem; margin-bottom:.6rem; }
  .ruta-paso h3{ font-size:.92rem; }
  .ruta-paso p{ font-size:.78rem; }
}
@media (prefers-reduced-motion: reduce){
  .ruta-paso{ transition:none !important; }
}

/* mascotas redondas de las tarifas de empresa (2026-10-19) */
.tarifa-mascota{ display:flex; justify-content:center; margin-bottom:.7rem; }
.tarifa-mascota img{
  width:76px; height:76px; border-radius:50%; object-fit:cover; display:block;
  border:2.5px solid var(--menta); box-shadow:var(--sombra);
}
.tarifa-popular .tarifa-mascota{ margin-top:.9rem; }
@media (max-width: 699px){
  .tarifa-mascota img{ width:58px; height:58px; }
}

/* pie en movil: columnas como cuadraditos ordenados (2026-10-19) */
@media (max-width: 699px){
  .footer-grid{ gap:.8rem; padding-block:2.4rem 1.8rem; }
  .footer-col{
    background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12);
    border-radius:18px; padding:1.15rem 1.2rem 1.3rem;
  }
  .footer-col h4{ margin-bottom:.7rem; }
  .footer-col ul{ gap:.55rem; }
  .footer-col a{ font-size:.9rem; }
  .footer-marca{ margin-bottom:.6rem; }
}

/* pie movil: cuadraditos de dos en dos (2026-10-19) */
@media (max-width: 699px){
  .footer-grid{ grid-template-columns:repeat(2,1fr); gap:.7rem; }
  .footer-marca{ grid-column:1/-1; }
  div.footer-col{ grid-column:1/-1; }
  .footer-col{ padding:1rem .95rem 1.1rem; }
  .footer-col h4{ font-size:.92rem; margin-bottom:.6rem; }
  .footer-col a{ font-size:.82rem; }
  .footer-col ul{ gap:.5rem; }
}

/* pie movil: cuatro cuadraditos en 2x2 (2026-10-19) */
@media (max-width: 699px){
  div.footer-col{ grid-column:auto; }
}

/* ============================================================
   FORMULARIO "TE LLAMAMOS" del cierre de tarifas (2026-10-19)
   ============================================================ */
.form-llamada{
  max-width:420px; margin:2.4rem auto 0; text-align:left;
  background:var(--superficie); border-radius:26px; padding:1.8rem 1.7rem 1.6rem;
  box-shadow:0 24px 60px rgba(0,0,0,.35);
  display:grid; gap:.8rem;
}
.form-llamada h3{
  color:var(--tinta); font-size:1.25rem; font-weight:800; letter-spacing:-.02em;
  text-align:center; margin-bottom:.2rem;
}
.form-llamada input[type="text"],
.form-llamada input[type="email"],
.form-llamada input[type="tel"]{
  width:100%; border:1.5px solid var(--linea); border-radius:14px;
  padding:.9rem 1rem; font-family:var(--fuente); font-size:1rem; color:var(--tinta);
  background:var(--fondo); transition:border-color .2s;
}
.form-llamada input:focus{ outline:none; border-color:var(--esmeralda); }
.form-llamada .btn{ width:100%; justify-content:center; }
.form-llamada .btn-blanco{
  background:var(--esmeralda); color:#fff; border-color:var(--esmeralda);
}
.form-llamada .btn-blanco:hover{ background:var(--esmeralda-2); }
.btn-wsp{
  display:inline-flex; align-items:center; gap:.55rem;
  background:#25d366; color:#fff; border:0;
}
.btn-wsp:hover{ background:#1fb859; color:#fff; }
.btn-wsp svg{ width:19px; height:19px; flex:none; }
.form-micro{
  font-size:.72rem; color:var(--tinta-3); text-align:center; line-height:1.5; margin-top:.2rem;
}
@media (max-width: 699px){
  .form-llamada{ margin-top:1.8rem; padding:1.4rem 1.2rem 1.3rem; border-radius:20px; }
}

/* ============================================================
   BANDA DE CONTACTO del pie (2026-10-19)
   ============================================================ */
.footer-contacto{
  border-top:1px solid rgba(255,255,255,.1);
  padding-block:1.9rem 1.7rem;
}
.footer-contacto h4{
  font-size:.78rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--lima); margin-bottom:1.1rem;
}
.fc-grid{ display:grid; gap:.7rem; }
@media (min-width: 760px){ .fc-grid{ grid-template-columns:repeat(3,1fr); gap:.9rem; } }
.fc-item{
  display:flex; align-items:center; gap:.85rem; text-decoration:none;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12);
  border-radius:16px; padding:.9rem 1.05rem;
  transition:background .25s, transform .25s var(--suave), border-color .25s;
}
.fc-item:hover{ background:rgba(255,255,255,.1); transform:translateY(-3px); border-color:rgba(255,255,255,.25); }
.fc-icono{
  width:42px; height:42px; border-radius:50%; display:grid; place-items:center; flex:none;
}
.fc-icono svg{ width:20px; height:20px; }
.fc-tel{ background:rgba(159,216,180,.16); color:var(--lima); }
.fc-wsp{ background:rgba(37,211,102,.18); color:#25d366; }
.fc-mail{ background:rgba(243,194,104,.16); color:var(--ambar); }
.fc-texto{ min-width:0; }
.fc-texto small{ display:block; font-size:.68rem; color:#8b9889; letter-spacing:.04em; }
.fc-texto b{
  display:block; color:#fff; font-size:.95rem; font-weight:700; letter-spacing:-.01em;
  overflow-wrap:anywhere;
}
@media (max-width: 699px){
  .footer-contacto{ padding-block:1.5rem 1.3rem; }
  .fc-texto b{ font-size:.88rem; }
}

/* formulario Te llamamos: colores armonizados con la marca (2026-10-19) */
.form-llamada input[type="text"],
.form-llamada input[type="email"],
.form-llamada input[type="tel"]{
  background:#f3f8f4; border-color:rgba(14,107,69,.18);
}
.form-llamada input::placeholder{ color:#7d8c80; }
.form-llamada input:focus{ background:#fff; }
.btn-wsp{
  background:rgba(37,211,102,.12); color:#0d9644;
  border:1.5px solid rgba(37,211,102,.45);
}
.btn-wsp:hover{ background:rgba(37,211,102,.2); color:#0a7d38; border-color:#25d366; }
.btn-wsp svg{ color:#1fb859; }
.form-micro{ color:#8a968c; }

/* formulario de cobertura en la portada (2026-10-20) */
#cobertura{ padding-top:3.2rem; padding-bottom:1.5rem; }
.form-cobertura{
  max-width:520px; margin:2rem auto 0;
  box-shadow:var(--sombra); border:1px solid var(--linea);
}
.cob-extra{ display:grid; gap:.8rem; }
.cob-extra[hidden]{ display:none; }
@media (max-width: 699px){
  #cobertura{ padding-top:2.2rem; padding-bottom:.8rem; }
  .form-cobertura{ margin-top:1.4rem; }
}

/* ============================================================
   POP-UP DE TELÉFONO del comprobador de cobertura (2026-10-20)
   ============================================================ */
.dlg-cob{
  border:0; padding:2rem 1.6rem 1.5rem; border-radius:24px;
  width:min(400px, calc(100% - 2rem)); background:var(--superficie);
  box-shadow:0 30px 80px rgba(0,0,0,.4); text-align:center;
}
.dlg-cob::backdrop{ background:rgba(7,26,17,.72); }
.dlg-cob[open]{ display:grid; gap:.85rem; animation:dlgIn .25s var(--suave); }
@keyframes dlgIn{ from{ opacity:0; transform:translateY(14px) scale(.97); } to{ opacity:1; transform:none; } }
.dlg-cob-cerrar{
  position:absolute; top:.8rem; right:.8rem; width:34px; height:34px; border-radius:50%;
  border:0; background:var(--crudo); color:var(--tinta-2); font-size:.95rem; cursor:pointer;
}
.dlg-cob-cerrar:hover{ background:var(--menta); color:var(--esmeralda); }
.dlg-cob-icono{
  width:56px; height:56px; border-radius:50%; margin:0 auto .2rem;
  display:grid; place-items:center; background:var(--menta); color:var(--esmeralda);
}
.dlg-cob-icono svg{ width:26px; height:26px; }
.dlg-cob h3{ font-size:1.25rem; font-weight:800; letter-spacing:-.02em; color:var(--tinta); }
.dlg-cob-sub{ font-size:.88rem; color:var(--tinta-3); margin-top:-.4rem; }
.dlg-cob input{ text-align:center; font-size:1.1rem !important; letter-spacing:.03em; }
@media (prefers-reduced-motion: reduce){ .dlg-cob[open]{ animation:none; } }

/* pop-up fuera del formulario: campo y boton con estilo propio */
.dlg-cob input{
  width:100%; border:1.5px solid rgba(14,107,69,.18); border-radius:14px;
  padding:.9rem 1rem; font-family:var(--fuente); color:var(--tinta); background:#f3f8f4;
  transition:border-color .2s, background .2s;
}
.dlg-cob input::placeholder{ color:#7d8c80; }
.dlg-cob input:focus{ outline:none; border-color:var(--esmeralda); background:#fff; }
.dlg-cob .btn{ width:100%; justify-content:center; }
.dlg-cob .form-micro{ font-size:.72rem; color:#8a968c; }

.dlg-cob{ margin:auto; position:fixed; inset:0; height:fit-content; }

/* ============================================================
   COBERTURA como tarjeta flotante bajo la portada + franja de
   protectoras debajo (2026-10-20)
   ============================================================ */
.cob-card{
  background:var(--superficie); border:1px solid var(--linea); border-radius:var(--radio);
  box-shadow:var(--sombra-2); padding:1.9rem 2rem;
  display:grid; gap:1.3rem;
}
@media (min-width: 900px){
  .cob-card{ grid-template-columns:1fr 1.05fr; align-items:center; gap:2.6rem; padding:2.2rem 2.4rem; }
}
.cob-card .kicker{ margin-bottom:.55rem; }
.cob-card h2{
  font-size:clamp(1.45rem, 3vw, 1.95rem); font-weight:800; letter-spacing:-.03em; line-height:1.12;
  color:var(--tinta);
}
.cob-sub{ color:var(--tinta-3); font-size:.95rem; margin-top:.55rem; }
/* el formulario va dentro de la tarjeta: sin segunda caja */
.cob-card .form-llamada{
  margin:0; max-width:none; padding:0; background:transparent;
  border:0; border-radius:0; box-shadow:none;
}
.franja-baja{ margin-top:1.5rem; }
@media (max-width: 699px){
  .cob-card{ padding:1.4rem 1.2rem 1.3rem; gap:1rem; }
  .cob-sub{ font-size:.88rem; }
  .franja-baja{ margin-top:1rem; }
}

/* franja de protectoras: fecha y justificante centrados en movil (2026-10-20) */
@media (max-width: 799px){
  .franja-card .franja-item{ text-align:center; }
}
