/* ==================================================================
   PANZONES Y FELICES A.C. — hoja de estilo única de las tres páginas
   ------------------------------------------------------------------
   Índice
     01 Tokens            08 Lo que hacemos      15 Contacto
     02 Base              09 Cómo ayudar         16 Footer
     03 Tipografía        10 Fichas de perros    17 Barra fija celular
     04 Botón hueso       11 Banda morada        18 Páginas internas
     05 Navegación        12 Programas           19 Perros calados
     06 Hero              13 Historia            20 Responsivo
     07 Misión            14 Cifras              21 Movimiento reducido
   Reglas de la casa: porcentajes y margin:auto, nunca coordenadas
   fijas para acomodar; ninguna sección con color liso.
   ================================================================== */

/* ---------- 01 · TOKENS ---------- */
:root{
  --morado:#533D7F;
  --morado-alto:#614990;
  --morado-bajo:#412F65;
  --morado-oscuro:#40305F;
  --morado-noche:#33254E;
  --morado-titulo:#5F4494;
  --coral:#DD7986;
  --coral-oscuro:#C4636F;
  --coral-texto:#B4505E;      /* coral de botones y letra chica: 4.8:1 con blanco y crema (AA) */
  --coral-hondo:#9E4351;      /* hover de botones */
  --rosa-claro:#F4B2BC;       /* acentos sobre morado */
  --crema:#F9F2E6;
  --crema-claro:#FFFCF6;
  --base:#FBF6EE;             /* color de unión: todas las secciones claras empiezan y terminan aquí */
  --texto:#4A4050;
  --texto-suave:#6E6377;

  --t-arena:#F6EDDF;
  --t-durazno:#F9E8DE;
  --t-rosa:#F7E3DE;
  --t-lila:#EFEAF5;
  --t-verde:#EDF1E6;

  --sombra:0 2px 5px rgba(64,48,95,.09),0 18px 36px rgba(64,48,95,.15);
  --sombra-alta:0 4px 8px rgba(64,48,95,.10),0 26px 48px rgba(64,48,95,.20);
  --radio:22px;
  --max:1200px;
  --orilla:clamp(20px,4vw,32px);
  --nav-alto:78px;
}

/* ---------- 02 · BASE ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-alto) + 12px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--base);color:var(--texto);
  font-family:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:17px;line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
img{height:auto}
figure,blockquote{margin:0}
a{color:inherit}
button{font:inherit}
::selection{background:var(--rosa-claro);color:var(--morado-oscuro)}
:focus-visible{outline:3px solid var(--morado-titulo);outline-offset:3px;border-radius:6px}
.salto{position:absolute;left:12px;top:-60px;z-index:200;background:var(--morado);color:#fff;padding:10px 18px;
  border-radius:0 0 12px 12px;font-weight:700;text-decoration:none;transition:top .2s}
.salto:focus{top:0}
.oculto-visual{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.envoltorio{max-width:var(--max);margin:0 auto;padding:0 var(--orilla)}
.seccion{padding:clamp(64px,8vw,104px) 0}
.seccion.pegada{padding-top:clamp(40px,5vw,64px)}   /* la que va justo debajo de una ola */
.centrado{text-align:center}
.rel{position:relative;z-index:3}  /* las secciones con perro calado van encima de la siguiente */

/* fondos: degradado vertical que nace y muere en --base, así no hay costuras */
.tinte-arena  {background:linear-gradient(180deg,var(--base) 0%,var(--t-arena) 52%,var(--base) 100%)}
.tinte-durazno{background:linear-gradient(180deg,var(--base) 0%,var(--t-durazno) 50%,var(--base) 100%)}
.tinte-rosa   {background:linear-gradient(180deg,var(--base) 0%,var(--t-rosa) 48%,var(--base) 100%)}
.tinte-lila   {background:linear-gradient(180deg,var(--base) 0%,var(--t-lila) 50%,var(--base) 100%)}
.tinte-verde  {background:linear-gradient(180deg,var(--base) 0%,var(--t-verde) 50%,var(--base) 100%)}

/* textura de huellas al 5.5 % */
.textura{position:relative;isolation:isolate}
.textura::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.055;
  background-repeat:repeat;background-size:150px 150px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='150' height='150' viewBox='0 0 150 150'><g fill='%23533D7F'><ellipse cx='30' cy='40' rx='7' ry='9'/><ellipse cx='44' cy='31' rx='6' ry='8'/><ellipse cx='58' cy='34' rx='6' ry='8'/><ellipse cx='70' cy='44' rx='6' ry='8'/><path d='M50 50c12 0 19 9 19 16s-8 9-19 9-19-2-19-9 7-16 19-16z'/><ellipse cx='105' cy='112' rx='5' ry='6.5'/><ellipse cx='115' cy='105' rx='4.5' ry='6'/><ellipse cx='125' cy='107' rx='4.5' ry='6'/><ellipse cx='134' cy='114' rx='4.5' ry='6'/><path d='M119 121c9 0 14 6 14 11s-6 6-14 6-14-1-14-6 5-11 14-11z'/></g></svg>")}

/* luz radial de esquina (coral arriba-derecha; morado abajo-izquierda) */
.luz{position:relative;isolation:isolate;overflow:hidden}
.luz::after{content:"";position:absolute;top:-300px;right:-220px;width:780px;height:780px;border-radius:50%;
  pointer-events:none;z-index:-1;background:radial-gradient(circle,rgba(221,121,134,.15) 0%,rgba(221,121,134,0) 66%)}
.luz-izq::after{left:-240px;right:auto;top:auto;bottom:-320px;
  background:radial-gradient(circle,rgba(83,61,127,.15) 0%,rgba(83,61,127,0) 66%)}

/* ---------- 03 · TIPOGRAFÍA ---------- */
h1,h2,h3,h4{font-family:"Baloo 2","Nunito",sans-serif;line-height:1.12;margin:0 0 .4em;color:var(--morado-titulo);
  letter-spacing:-.01em;text-wrap:balance}
h1{font-size:clamp(2.2rem,4.4vw,3.6rem);font-weight:800}
h2{font-size:clamp(1.85rem,3.3vw,2.75rem);font-weight:800}
h3{font-size:1.24rem;font-weight:700;line-height:1.2}
p{margin:0 0 1em;text-wrap:pretty}
strong{color:var(--morado-oscuro)}
.script{font-family:"Caveat",cursive;color:var(--coral);font-weight:700;line-height:1.05;letter-spacing:0}

/* encabezado de sección: antetítulo + título + divisor + entrada */
.cabeza{max-width:720px;margin:0 auto clamp(36px,4.5vw,56px);text-align:center}
.cabeza h2{margin-bottom:.25em}
.cabeza .plomo{margin:0 auto}
.antetitulo{display:block;font-family:"Caveat",cursive;font-weight:700;font-size:1.55rem;line-height:1;
  color:var(--coral-texto);margin-bottom:.3em}
.plomo{max-width:620px;font-size:1.08rem;color:var(--texto-suave);margin:0 auto}
.cabeza-izq{text-align:left;margin-left:0}
.cabeza-izq .divisor{justify-content:flex-start}

.divisor{display:flex;align-items:center;justify-content:center;gap:10px;margin:2px 0 18px}
.divisor span{display:block;width:56px;border-top:2px dotted var(--coral);opacity:.7}
.divisor svg{width:18px;height:18px;fill:var(--coral);flex:0 0 auto}

/* ---------- 04 · BOTÓN HUESO ----------
   Cuerpo de píldora + dos nudos por lado (::before y ::after, cada uno
   con su gemelo hecho con box-shadow). Todo en em: escala con la letra. */
.hueso{--hb:var(--coral-texto);--ht:#fff;--hb-hover:var(--coral-hondo);
  position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;
  min-height:3em;padding:.85em 2.1em;margin:0 .55em;border:0;border-radius:999px;
  background:var(--hb);color:var(--ht);cursor:pointer;
  font-family:"Baloo 2",sans-serif;font-weight:700;font-size:1.06rem;line-height:1.15;letter-spacing:.05em;
  text-transform:uppercase;text-decoration:none;white-space:nowrap;text-align:center;
  box-shadow:0 10px 22px -12px rgba(150,60,75,.75);
  transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease}
.hueso::before,.hueso::after{content:"";position:absolute;top:50%;z-index:-1;width:1.5em;height:1.5em;border-radius:50%;
  background:var(--hb);box-shadow:0 1.2em 0 var(--hb);transform:translateY(-1.35em);
  transition:background-color .2s ease,box-shadow .2s ease}
.hueso::before{left:-.5em}
.hueso::after{right:-.5em}
.hueso:hover{--hb:var(--hb-hover);transform:translateY(-2px);box-shadow:0 14px 26px -12px rgba(150,60,75,.8)}
.hueso:active{transform:translateY(0)}
.hueso:disabled{opacity:.5;cursor:not-allowed;transform:none}
.hueso:focus-visible{outline:3px solid var(--morado-titulo);outline-offset:6px}
.hueso.chico{font-size:.86rem;padding:.75em 1.7em}
.hueso.claro{--hb:#fff;--ht:var(--morado);--hb-hover:#F6EEF7;box-shadow:0 10px 22px -12px rgba(20,10,40,.6)}
.hueso.contorno{--hb:transparent;--ht:var(--morado);box-shadow:inset 0 0 0 2px var(--morado)}
.hueso.contorno::before,.hueso.contorno::after{display:none}
.hueso.contorno:hover{--hb:var(--morado);--ht:#fff}
.botones{display:flex;flex-wrap:wrap;gap:16px 10px;align-items:center}
.centrado .botones,.botones.centrado{justify-content:center}

/* ---------- 05 · NAVEGACIÓN ---------- */
.aviso{background:var(--morado-noche);color:var(--rosa-claro);text-align:center;font-size:.8rem;line-height:1.4;
  padding:8px 16px;font-family:"Baloo 2",sans-serif;font-weight:600;letter-spacing:.03em}
.nav{position:sticky;top:0;z-index:60;background:rgba(255,252,246,.92);
  -webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid rgba(83,61,127,.10);box-shadow:0 6px 20px -16px rgba(64,48,95,.5)}
.nav-int{max-width:var(--max);min-height:var(--nav-alto);margin:0 auto;padding:10px var(--orilla);
  display:flex;align-items:center;gap:24px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;flex:0 0 auto}
.logo-marca{width:50px;height:50px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--coral) 0%,var(--coral-oscuro) 100%);
  box-shadow:0 0 0 3px #fff,0 0 0 5px rgba(221,121,134,.35)}
.logo-marca svg{width:28px;height:28px;fill:#fff}
.logo-txt{display:flex;flex-direction:column;font-family:"Baloo 2",sans-serif;line-height:1.05}
.logo-txt b{font-weight:800;font-size:1.12rem;color:var(--morado);white-space:nowrap}
.logo-txt small{font-weight:600;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--coral-texto);margin-top:3px}
.nav-lig{margin-left:auto;display:flex;align-items:center;gap:30px}
.nav-lig a:not(.hueso){position:relative;font-family:"Baloo 2",sans-serif;font-weight:600;font-size:1.02rem;
  text-decoration:none;color:var(--morado);padding:6px 0;white-space:nowrap}
.nav-lig a:not(.hueso)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:3px;
  background:var(--coral);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.nav-lig a:not(.hueso):hover::after,.nav-lig a.activo::after{transform:scaleX(1)}
.nav-lig a.activo{color:var(--coral-texto)}
.nav-lig .hueso{margin-left:8px;margin-right:.55em}
.nav-boton{display:none;margin-left:auto;width:48px;height:48px;border:0;border-radius:14px;background:var(--t-lila);
  color:var(--morado);cursor:pointer;place-items:center}
.nav-boton svg{width:24px;height:24px;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;fill:none}
.nav-boton .x{display:none}
.nav.abierta .nav-boton .x{display:block}
.nav.abierta .nav-boton .tres{display:none}

/* ---------- 06 · HERO ---------- */
.hero{position:relative;overflow:hidden;
  background:linear-gradient(180deg,rgba(251,246,238,0) calc(100% - 90px),var(--base) calc(100% - 90px)),
    linear-gradient(165deg,#FFFDF9 0%,var(--t-arena) 70%,#F1E4D2 100%)}
.hero::before{content:"";position:absolute;width:640px;height:640px;right:-120px;top:-180px;border-radius:50%;
  background:radial-gradient(circle,rgba(221,121,134,.16) 0%,rgba(221,121,134,0) 68%);pointer-events:none}
.hero-rej{position:relative;max-width:var(--max);margin:0 auto;padding:clamp(40px,6vw,76px) var(--orilla) 0;
  display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(32px,5vw,64px);align-items:end}
.hero-txt{padding-bottom:clamp(40px,5vw,72px)}
.hero h1{margin-bottom:.35em}
.hero h1 span{color:var(--coral)}
.hero .entrada{font-size:1.14rem;color:var(--texto-suave);max-width:520px;margin-bottom:1.6em}
.cita{position:relative;margin:0 0 30px;padding:2px 0 2px 22px;border-left:4px solid var(--coral);
  font-family:"Baloo 2",sans-serif;font-weight:500;font-size:1.06rem;color:var(--morado);line-height:1.45;max-width:520px}
.cita em{font-style:normal;display:block;margin-top:4px;font-family:"Caveat",cursive;font-size:1.3rem;color:var(--coral-texto)}
.hero-foto{position:relative;border-radius:200px 200px 26px 26px;overflow:hidden;box-shadow:var(--sombra-alta);
  aspect-ratio:4/5;max-height:600px;width:100%;justify-self:end;border:8px solid #fff;border-bottom:0}
.hero-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.tira{position:relative;z-index:2;background:linear-gradient(180deg,var(--morado) 0%,var(--morado-bajo) 100%);color:#fff}
.tira-int{max-width:var(--max);margin:0 auto;padding:24px var(--orilla);display:grid;grid-template-columns:repeat(3,auto);
  justify-content:space-between;gap:20px 32px}
.tira-it{display:flex;align-items:center;gap:14px;font-family:"Baloo 2",sans-serif;font-weight:600;font-size:1.04rem;line-height:1.2}
.globo{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.14);display:grid;place-items:center;flex:0 0 auto;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.globo svg{width:22px;height:22px;fill:#fff}
.ola{display:block;width:100%;height:clamp(40px,5.5vw,78px)}
.ola-arriba{transform:rotate(180deg)}

/* ---------- 07 · MISIÓN ---------- */
.mision-rej{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,80px);align-items:center}
.mision-foto{position:relative;aspect-ratio:5/4;overflow:hidden;box-shadow:var(--sombra-alta)}
.mision-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mision-txt .cabeza{margin-bottom:22px}
.mision-txt p{font-size:1.08rem}
.mision-txt .remate{font-family:"Baloo 2",sans-serif;font-size:1.3rem;font-weight:600;line-height:1.35;color:var(--morado);
  margin:1.2em 0 1.4em;padding-left:20px;border-left:4px solid var(--coral)}

/* formas de foto que rompen el rectángulo */
.forma-organica{border-radius:58% 42% 46% 54% / 52% 48% 52% 48%}
.forma-arco{border-radius:200px 200px 22px 22px}
.forma-hoja{border-radius:26px 140px 26px 140px}

/* ---------- 08 · LO QUE HACEMOS ---------- */
.hacemos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px}
.hacemos-t{background:var(--crema-claro);border-radius:var(--radio);overflow:hidden;box-shadow:var(--sombra);
  border:1px solid rgba(255,255,255,.85);display:flex;flex-direction:column;transition:transform .25s ease,box-shadow .25s ease}
.hacemos-t:hover{transform:translateY(-4px);box-shadow:var(--sombra-alta)}
.hacemos-t figure{margin:0;position:relative;aspect-ratio:1/1;overflow:hidden}
.hacemos-t img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hacemos-t div{padding:18px 18px 22px}
.hacemos-t .num{display:block;font-family:"Baloo 2",sans-serif;font-weight:800;font-size:.8rem;letter-spacing:.14em;
  color:var(--coral-texto);margin-bottom:6px}
.hacemos-t h3{font-size:1.08rem;margin-bottom:.35em}
.hacemos-t p{font-size:.92rem;margin:0;line-height:1.55;color:var(--texto-suave)}

/* ---------- 09 · CÓMO AYUDAR ---------- */
.ayudar-rej{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.ayudar-t{position:relative;background:rgba(255,252,246,.78);border:1px solid rgba(255,255,255,.9);border-radius:var(--radio);
  box-shadow:var(--sombra);padding:32px 22px 30px;text-align:center;display:flex;flex-direction:column;align-items:center;
  transition:transform .25s ease,box-shadow .25s ease}
.ayudar-t:hover{transform:translateY(-4px);box-shadow:var(--sombra-alta)}
.ayudar-ic{width:76px;height:76px;border-radius:50%;margin:0 0 18px;display:grid;place-items:center;
  background:linear-gradient(145deg,var(--morado-alto),var(--morado-bajo));box-shadow:0 10px 22px -10px rgba(64,48,95,.7)}
.ayudar-ic svg{width:34px;height:34px;fill:#fff}
.ayudar-t h3{margin-bottom:.4em}
.ayudar-t p{font-size:.95rem;color:var(--texto-suave);margin-bottom:22px}
.ayudar-t .hueso{margin-top:auto}
.ayudar-t.destacada{background:linear-gradient(160deg,#fff 0%,#FFF4F1 100%);box-shadow:var(--sombra-alta);
  border-color:rgba(221,121,134,.45)}

/* ---------- 10 · FICHAS DE PERROS ---------- */
.perros,.catalogo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.ficha{background:var(--crema-claro);border-radius:var(--radio);overflow:hidden;box-shadow:var(--sombra);
  border:1px solid rgba(255,255,255,.85);display:flex;flex-direction:column;transition:transform .25s ease,box-shadow .25s ease}
.ficha:hover{transform:translateY(-4px);box-shadow:var(--sombra-alta)}
.ficha-img{position:relative;aspect-ratio:5/4;overflow:hidden;margin:0}
.ficha-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.ficha:hover .ficha-img img{transform:scale(1.04)}
.ficha-img::after{content:"";position:absolute;inset:auto 0 0 0;height:40%;
  background:linear-gradient(180deg,rgba(40,28,60,0) 0%,rgba(40,28,60,.28) 100%);pointer-events:none}
.etiqueta{position:absolute;z-index:2;top:14px;left:14px;background:#fff;color:var(--morado);
  font-family:"Baloo 2",sans-serif;font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;
  padding:6px 13px 5px;border-radius:999px;box-shadow:0 4px 12px -4px rgba(40,28,60,.4)}
.etiqueta::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--coral);
  margin-right:7px;vertical-align:1px}
.etiqueta.tratamiento::before{background:#E0A23B}
.etiqueta.padrino::before{background:var(--morado-alto)}
.ficha-cuerpo{padding:22px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.ficha-cuerpo h3{margin:0;font-size:1.36rem}
.datos-perro{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.datos-perro li{font-family:"Baloo 2",sans-serif;font-weight:600;font-size:.82rem;color:var(--morado);
  background:var(--t-lila);padding:3px 11px 2px;border-radius:999px}
.ficha-cuerpo p{font-size:.95rem;margin:0;color:var(--texto-suave)}
.ficha-cuerpo .hueso{margin-top:auto;align-self:flex-start}
.ficha-cuerpo .acciones{margin-top:auto;padding-top:8px}

/* ---------- 11 · BANDA MORADA ---------- */
.banda{position:relative;color:#fff;
  background:linear-gradient(135deg,var(--morado-alto) 0%,var(--morado) 46%,var(--morado-bajo) 100%)}
.banda::before{content:"";position:absolute;inset:0;opacity:.07;pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'><g fill='%23ffffff'><ellipse cx='24' cy='32' rx='5.5' ry='7'/><ellipse cx='35' cy='25' rx='5' ry='6.5'/><ellipse cx='46' cy='27' rx='5' ry='6.5'/><ellipse cx='56' cy='35' rx='5' ry='6.5'/><path d='M40 40c10 0 15 7 15 13s-6 7-15 7-15-2-15-7 5-13 15-13z'/></g></svg>");background-size:120px 120px}
.banda-rej{position:relative;max-width:var(--max);margin:0 auto;padding:clamp(52px,6vw,72px) var(--orilla);
  display:flex;align-items:center;gap:clamp(28px,4vw,48px)}
.banda-foto{width:188px;height:188px;border-radius:50%;overflow:hidden;flex:0 0 auto;position:relative;
  border:6px solid rgba(255,255,255,.28);box-shadow:0 18px 40px -16px rgba(0,0,0,.5)}
.banda-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.banda-txt{max-width:560px}
.banda-txt p{font-family:"Baloo 2",sans-serif;font-size:clamp(1.35rem,2.2vw,1.65rem);font-weight:600;line-height:1.25;margin:0 0 4px;color:#fff}
.banda-txt .script{display:block;font-size:clamp(2.2rem,3.6vw,3rem);color:var(--rosa-claro);margin:0 0 24px}
.banda-txt .hueso{margin-left:.55em}

/* ---------- 12 · PROGRAMAS ---------- */
.prog,.progs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.prog-t{position:relative;background:var(--crema-claro);border-radius:var(--radio);overflow:hidden;box-shadow:var(--sombra);
  border:1px solid rgba(255,255,255,.85);display:flex;flex-direction:column;transition:transform .25s ease,box-shadow .25s ease}
.prog-t:hover{transform:translateY(-4px);box-shadow:var(--sombra-alta)}
.prog-t figure{margin:0;position:relative;aspect-ratio:16/10;overflow:hidden}
.prog-t img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.prog-t>div{padding:22px 24px 26px}
.prog-t h3{margin-bottom:.35em}
.prog-t p{font-size:.95rem;margin:0;color:var(--texto-suave)}
.num{display:block;font-family:"Baloo 2",sans-serif;font-weight:800;color:var(--coral-texto);font-size:.78rem;
  letter-spacing:.14em;text-transform:uppercase;margin-bottom:6px}
.prog-t .estado{position:absolute;top:14px;right:14px;z-index:2;background:rgba(51,37,78,.88);color:#fff;
  font-family:"Baloo 2",sans-serif;font-weight:700;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;
  padding:5px 12px 4px;border-radius:999px}
.mas{margin-top:clamp(36px,4vw,52px);text-align:center}

/* ---------- 13 · HISTORIA ---------- */
.hist-rej{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(36px,5vw,72px);align-items:center}
.hist-foto{position:relative;aspect-ratio:1/1;overflow:hidden;box-shadow:var(--sombra-alta);margin:0}
.hist-rej .cabeza{margin-bottom:22px}
.hist-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.testimonio{position:relative;font-family:"Baloo 2",sans-serif;font-size:clamp(1.15rem,1.7vw,1.32rem);font-weight:500;
  line-height:1.5;color:var(--morado);margin:0 0 18px;padding-left:22px;border-left:4px solid var(--coral)}
.firma{font-family:"Caveat",cursive;font-size:1.55rem;line-height:1.2;color:var(--coral-texto);margin:0 0 26px}

/* ---------- 14 · CIFRAS ---------- */
.confianza{position:relative;color:#fff;text-align:center;padding:clamp(52px,6vw,72px) var(--orilla);
  background:linear-gradient(180deg,var(--morado-bajo) 0%,var(--morado-noche) 100%)}
.cifras{display:grid;grid-template-columns:repeat(3,minmax(0,200px));justify-content:center;gap:24px 56px;margin:0 auto 26px;max-width:var(--max)}
.cifra b{display:block;font-family:"Baloo 2",sans-serif;font-size:clamp(2.4rem,4vw,3.2rem);font-weight:800;color:var(--rosa-claro);line-height:1}
.cifra span{display:block;margin-top:6px;font-size:.95rem;opacity:.9}
.confianza p{margin:0;opacity:.95}
.confianza a{color:#fff;text-decoration:underline;text-decoration-color:var(--rosa-claro);text-underline-offset:5px;font-weight:700}

/* ---------- 15 · CONTACTO ---------- */
.cont-rej{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(32px,5vw,64px);align-items:start}
.forma{background:var(--crema-claro);border:1px solid rgba(255,255,255,.9);border-radius:var(--radio);box-shadow:var(--sombra);
  padding:clamp(24px,3.4vw,40px)}
.campo{display:block;margin-bottom:18px}
.campo span{display:block;font-family:"Baloo 2",sans-serif;font-weight:600;color:var(--morado);font-size:.96rem;margin-bottom:6px}
.campo input,.campo textarea,.campo select{width:100%;padding:13px 16px;border:2px solid rgba(83,61,127,.16);border-radius:14px;
  background:#fff;font:inherit;font-size:1rem;color:var(--texto);transition:border-color .2s,box-shadow .2s}
.campo textarea{resize:vertical;min-height:132px}
.campo input:focus,.campo textarea:focus,.campo select:focus{outline:none;border-color:var(--coral);box-shadow:0 0 0 4px rgba(221,121,134,.18)}
.forma .hueso{margin-top:6px}
.forma-nota{font-size:.88rem;color:var(--texto-suave);margin:14px 0 0}
.aviso-datos{font-size:.8rem;line-height:1.5;color:var(--texto-suave);margin:4px 0 18px}
.aviso-datos a{color:var(--morado);font-weight:700}
.foot-nota a{font-size:inherit;text-decoration:underline;text-underline-offset:3px}
.forma-nota:empty{display:none}
.datos{padding:0;margin:0 0 28px;list-style:none}
.datos li{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px;font-size:1rem}
.datos .ic{width:40px;height:40px;border-radius:12px;background:var(--t-lila);display:grid;place-items:center;flex:0 0 auto}
.datos svg{width:20px;height:20px;fill:var(--coral-oscuro)}
.datos b{display:block;font-family:"Baloo 2",sans-serif;color:var(--morado);font-weight:700;line-height:1.2}
.datos span{color:var(--texto-suave);font-size:.95rem}
.redes{display:flex;gap:12px;flex-wrap:wrap}
.redes a{width:46px;height:46px;border-radius:50%;background:var(--morado);display:grid;place-items:center;
  transition:background-color .2s,transform .2s}
.redes a:hover{background:var(--coral-oscuro);transform:translateY(-2px)}
.redes svg{width:20px;height:20px;fill:#fff}
.cont-lado h3{margin:30px 0 14px}

/* ---------- 16 · FOOTER ---------- */
footer{background:linear-gradient(180deg,var(--morado-oscuro) 0%,#2E2246 100%);color:rgba(255,255,255,.88);
  padding:clamp(48px,6vw,72px) var(--orilla) 28px}
.foot-rej{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px}
.foot-marca .logo-txt b{color:#fff}
.foot-marca .logo-txt small{color:var(--rosa-claro)}
.foot-marca p{font-size:.95rem;margin:16px 0 18px;max-width:300px}
footer h4{color:var(--rosa-claro);font-size:1.02rem;letter-spacing:.02em;margin-bottom:.8em}
footer ul{list-style:none;margin:0;padding:0}
footer li{margin-bottom:8px}
footer a{color:#fff;text-decoration:none;font-size:.95rem}
footer a:hover{text-decoration:underline;text-underline-offset:4px}
footer .redes a{background:rgba(255,255,255,.12)}
footer .redes a:hover{background:var(--coral-oscuro)}
.foot-nota{max-width:var(--max);margin:44px auto 0;padding-top:22px;border-top:1px solid rgba(255,255,255,.16);
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;font-size:.84rem;opacity:.78}
.foot-nota p{margin:0}

/* ---------- 17 · BARRA FIJA CELULAR ---------- */
.cta-fija{position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;gap:10px;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(51,37,78,.96);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 -8px 24px rgba(0,0,0,.22)}
.cta-fija a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;border-radius:999px;
  min-height:46px;padding:10px 8px;font-family:"Baloo 2",sans-serif;font-weight:700;font-size:.98rem;letter-spacing:.02em}
.cta-fija svg{width:18px;height:18px;fill:currentColor}
.cta-fija .donar{background:var(--coral-texto);color:#fff}
.cta-fija .wa{background:rgba(255,255,255,.14);color:#fff}
body.ed-on .cta-fija{display:none!important}

/* ---------- 18 · PÁGINAS INTERNAS ---------- */
.encabezado{position:relative;overflow:hidden;isolation:isolate;color:#fff;text-align:center;
  padding:clamp(64px,8vw,104px) var(--orilla) clamp(48px,6vw,72px);
  background:linear-gradient(180deg,rgba(65,47,101,0) 45%,var(--morado-bajo) 100%),
    linear-gradient(150deg,var(--morado-alto) 0%,var(--morado) 55%,var(--morado-bajo) 100%)}
.encabezado .foto-fondo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.encabezado.con-foto::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(51,37,78,.62) 0%,rgba(83,61,127,.72) 55%,var(--morado-bajo) 100%)}
.encabezado-txt{position:relative;z-index:1;max-width:780px;margin:0 auto}
.encabezado h1{color:#fff;margin-bottom:.15em}
.encabezado .script{display:block;color:var(--rosa-claro);font-size:clamp(2rem,3.6vw,2.8rem);margin-bottom:16px}
.encabezado p{max-width:620px;margin:0 auto;font-size:1.12rem;color:rgba(255,255,255,.94)}
.migas{display:flex;justify-content:center;gap:8px;margin:0 0 18px;padding:0;list-style:none;
  font-family:"Baloo 2",sans-serif;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.8)}
.migas a{color:#fff;text-decoration:none}
.migas a:hover{text-decoration:underline}
.migas li+li::before{content:"·";margin-right:8px;color:var(--rosa-claro)}
.ola-morada{background:var(--base)}
.ola-morada path:last-child{fill:var(--morado-bajo)}

/* --- adopta --- */
.filtros{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:0 auto 40px}
.filtro{font-family:"Baloo 2",sans-serif;font-weight:600;font-size:.95rem;padding:9px 20px;min-height:44px;
  border-radius:999px;border:2px solid rgba(83,61,127,.2);background:var(--crema-claro);color:var(--morado);cursor:pointer;
  transition:background-color .2s,border-color .2s,color .2s}
.filtro:hover{border-color:var(--morado)}
.filtro[aria-pressed="true"]{background:var(--morado);border-color:var(--morado);color:#fff}
.ficha[hidden]{display:none}
.sin-resultados{text-align:center;color:var(--texto-suave);margin:8px 0 0}

.par{background:var(--crema-claro);border-radius:var(--radio);box-shadow:var(--sombra);border:1px solid rgba(255,255,255,.85);
  overflow:hidden;display:grid;grid-template-columns:1.05fr .95fr}
.par+.par{margin-top:30px}
.par:nth-of-type(even){grid-template-columns:.95fr 1.05fr}
.par:nth-of-type(even) .par-fotos{order:2}
.par-fotos{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#fff}
.par-foto{position:relative;aspect-ratio:4/5;margin:0;overflow:hidden}
.par-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.par-foto figcaption{position:absolute;bottom:12px;left:12px;background:rgba(51,37,78,.88);color:#fff;
  font-family:"Baloo 2",sans-serif;font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;
  padding:5px 12px 4px;border-radius:999px}
.par-foto.despues figcaption{background:var(--coral-texto)}
.par-txt{padding:clamp(26px,3.4vw,42px);display:flex;flex-direction:column;justify-content:center}
.par-txt h3{font-size:1.5rem;margin-bottom:.3em}
.par-txt p{font-size:1rem}
.linea-tiempo{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 0;padding:0;list-style:none}
.linea-tiempo li{font-family:"Baloo 2",sans-serif;font-weight:600;font-size:.86rem;color:var(--morado);background:var(--t-lila);
  padding:4px 12px 3px;border-radius:999px}

.testis{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.testi{position:relative;background:var(--crema-claro);border-radius:var(--radio);box-shadow:var(--sombra);
  border:1px solid rgba(255,255,255,.85);padding:32px 32px 30px;margin:0;
  display:grid;grid-template-columns:88px 1fr;column-gap:22px;align-content:start}
.testi img{grid-row:1 / span 2}
.testi::before{content:"\201C";position:absolute;top:-8px;right:24px;font-family:"Baloo 2",serif;font-size:6rem;line-height:1;
  color:var(--coral);opacity:.25}
.testi img{width:88px;height:88px;border-radius:50%;object-fit:cover;flex:0 0 auto;border:4px solid #fff;box-shadow:var(--sombra)}
.testi blockquote{margin:0 0 12px;font-size:1.02rem;color:var(--texto)}
.testi figcaption{font-family:"Caveat",cursive;font-size:1.4rem;line-height:1.1;color:var(--coral-texto)}

/* --- transparencia --- */
.mv{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.mv-t{background:var(--crema-claro);border-radius:var(--radio);overflow:hidden;box-shadow:var(--sombra);
  border:1px solid rgba(255,255,255,.85);display:flex;flex-direction:column}
.mv-t figure{position:relative;margin:0;aspect-ratio:16/9;overflow:hidden}
.mv-t figure.forma-arco{margin:14px 14px 0;border-radius:200px 200px 16px 16px}
.mv-t img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mv-t>div{padding:clamp(26px,3vw,38px)}
.mv-t h2{font-size:clamp(1.6rem,2.4vw,2rem);color:var(--coral-texto);text-align:left;margin-bottom:.5em}
.mv-t p{font-size:1.02rem}
.mv-t p:last-child{margin-bottom:0}

.valores{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.valor{background:var(--crema-claro);border-radius:var(--radio);box-shadow:var(--sombra);border:1px solid rgba(255,255,255,.85);
  padding:32px 28px 32px;text-align:center;transition:transform .25s ease,box-shadow .25s ease}
.valor:hover{transform:translateY(-4px);box-shadow:var(--sombra-alta)}
.valor img{width:104px;height:104px;border-radius:50%;object-fit:cover;margin:0 auto 18px;border:4px solid #fff;
  box-shadow:0 0 0 3px var(--coral),var(--sombra)}
.valor h3{font-size:1.18rem;margin-bottom:.4em}
.valor p{font-size:.95rem;margin:0;color:var(--texto-suave)}

.barras{max-width:780px;margin:0 auto;background:var(--crema-claro);border-radius:var(--radio);box-shadow:var(--sombra);
  border:1px solid rgba(255,255,255,.85);padding:clamp(26px,3.4vw,40px)}
.barra+.barra{margin-top:22px}
.barra-top{display:flex;justify-content:space-between;gap:16px;font-family:"Baloo 2",sans-serif;font-weight:700;
  color:var(--morado);margin-bottom:8px;font-size:1rem}
.barra-pista{height:14px;background:rgba(83,61,127,.12);border-radius:999px;overflow:hidden}
.barra-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--coral) 0%,var(--coral-oscuro) 100%)}
.barra-fill.pendiente{width:100%;opacity:.35;
  background:repeating-linear-gradient(-45deg,var(--coral) 0 8px,rgba(221,121,134,.25) 8px 16px)}
.barra-top span:last-child{white-space:nowrap}
.barra-top span:last-child:not(:first-child){font-weight:600;color:var(--texto-suave)}
.nota{max-width:680px;margin:22px auto 0;font-size:.92rem;text-align:center;color:var(--texto-suave)}

.docs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.doc{background:var(--crema-claro);border-radius:var(--radio);box-shadow:var(--sombra);border:1px solid rgba(255,255,255,.85);
  padding:30px 28px;display:flex;flex-direction:column;gap:10px}
.doc-ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;margin-bottom:6px;
  background:linear-gradient(145deg,var(--morado-alto),var(--morado-bajo))}
.doc-ic svg{width:26px;height:26px;fill:#fff}
.doc h3{font-size:1.14rem;margin:0}
.doc p{font-size:.95rem;margin:0;color:var(--texto-suave)}
.doc .pendiente{margin-top:auto;padding-top:12px;font-family:"Baloo 2",sans-serif;font-weight:700;font-size:.92rem;color:var(--morado);
  display:flex;align-items:center;gap:8px}
.doc .pendiente::before{content:"";width:8px;height:8px;border-radius:50%;background:#E0A23B}

.legal{max-width:780px;margin:0 auto;background:var(--crema-claro);border-radius:var(--radio);box-shadow:var(--sombra);
  border:1px solid rgba(255,255,255,.85);padding:clamp(26px,3.4vw,40px)}
.legal dl{margin:0;display:grid;grid-template-columns:minmax(180px,auto) 1fr;font-size:1rem}
.legal dt,.legal dd{padding:13px 0;border-bottom:1px dashed rgba(83,61,127,.18)}
.legal dt:last-of-type,.legal dd:last-of-type{border-bottom:0}
.legal dt{font-family:"Baloo 2",sans-serif;font-weight:700;color:var(--morado);padding-right:24px}
.legal dd{margin:0;color:var(--texto-suave)}

/* --- aviso de privacidad --- */
.texto-legal{max-width:820px;margin:0 auto;background:var(--crema-claro);border-radius:var(--radio);box-shadow:var(--sombra);
  border:1px solid rgba(255,255,255,.85);padding:clamp(26px,4vw,52px)}
.texto-legal h2{font-size:clamp(1.3rem,2vw,1.55rem);margin:1.6em 0 .5em}
.texto-legal h2:first-child{margin-top:0}
.texto-legal p,.texto-legal li{font-size:1rem}
.texto-legal ul{padding-left:1.2em;margin:0 0 1em}
.texto-legal li{margin-bottom:.4em}
.texto-legal .actualizado{font-size:.9rem;color:var(--texto-suave);margin-top:2em}

/* ---------- 19 · PERROS CALADOS ----------
   PNG con fondo transparente que cruzan el borde entre secciones.
   Viven dentro de la sección que los contiene (.rel) y se anclan en
   porcentaje a la orilla; el valor negativo de bottom/top es el que
   los hace sobresalir. Solo escritorio: abajo de 1180 px se ocultan. */
.cal{position:absolute;z-index:5;pointer-events:none;width:auto;height:auto;
  filter:drop-shadow(0 16px 18px rgba(30,20,48,.30))}
.piso{position:absolute;z-index:4;pointer-events:none;border-radius:50%;
  background:radial-gradient(ellipse,rgba(30,20,48,.38) 0%,rgba(30,20,48,0) 70%)}
.calado{position:absolute;z-index:5;pointer-events:none;bottom:0;right:5%;height:116%;max-height:340px;width:auto;
  filter:drop-shadow(0 16px 20px rgba(30,20,48,.42))}
.calado-piso{position:absolute;z-index:4;pointer-events:none;bottom:-10px;right:calc(5% + 40px);width:240px;height:26px;border-radius:50%;
  background:radial-gradient(ellipse,rgba(30,20,48,.45) 0%,rgba(30,20,48,0) 70%)}
.banda .banda-rej{padding-right:min(340px,26%)}

/* 1 · cachorro sentado sobre la tira morada, delante de la esquina de la foto */
.cal-1{right:1.5%;bottom:100%;margin-bottom:-22px;height:190px}
.piso-1{right:calc(1.5% + 6px);bottom:100%;margin-bottom:-30px;width:150px;height:20px}
/* 2 · perro echado sobre el borde Misión → Lo que hacemos */
.cal-2{right:3%;bottom:-62px;height:210px}
.piso-2{right:calc(3% + 20px);bottom:-72px;width:240px;height:24px}
/* 3 · cachorro sentado en el borde Cómo ayudar → Perros */
.cal-3{left:2.5%;bottom:-70px;height:250px}
.piso-3{left:calc(2.5% + 18px);bottom:-78px;width:170px;height:22px}
/* entre 1180 y 1380 px no hay margen a los lados: el sabueso baja para no tocar las tarjetas */
@media (max-width:1380px){
  .cal-3{height:200px;bottom:-100px}
  .piso-3{bottom:-108px;width:140px}
}
/* 5 · cachorro golden caminando en el borde Programas → Historia */
.cal-5{right:3%;bottom:-64px;height:250px}
.piso-5{right:calc(3% + 14px);bottom:-74px;width:190px;height:22px}
/* 6 · golden sentado sobre la banda de cifras */
.cal-6{right:6%;bottom:100%;margin-bottom:-20px;height:200px}
.piso-6{right:calc(6% + 4px);bottom:100%;margin-bottom:-28px;width:130px;height:18px}

/* A1 · Adopta: cachorro golden que baja de la ola morada al catálogo */
.cal-a1{right:5%;top:-120px;height:210px}
.piso-a1{right:calc(5% + 10px);top:76px;width:170px;height:20px}
/* T1 · Transparencia: pastor parado entre Misión/Visión y Valores */
.cal-t1{left:4%;top:-60px;height:220px}
.piso-t1{left:calc(4% + 10px);top:150px;width:150px;height:20px}

/* ---------- 20 · RESPONSIVO ---------- */
@media (max-width:1180px){
  .cal,.piso,.calado,.calado-piso{display:none}
  .banda .banda-rej{padding-right:var(--orilla)}
}
@media (max-width:1100px){
  .hacemos{grid-template-columns:repeat(6,minmax(0,1fr))}
  .hacemos-t{grid-column:span 2}
  .hacemos-t:nth-child(4){grid-column:2 / span 2}
  .foot-rej{grid-template-columns:1fr 1fr 1fr}
  .foot-marca{grid-column:1 / -1}
}
@media (max-width:960px){
  :root{--nav-alto:68px}
  .nav-boton{display:grid}
  .nav-lig{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;
    padding:8px var(--orilla) 22px;background:rgba(255,252,246,.98);box-shadow:0 18px 30px -18px rgba(64,48,95,.45);
    border-bottom:1px solid rgba(83,61,127,.10);display:none}
  .nav.abierta .nav-lig{display:flex}
  .nav-lig a:not(.hueso){padding:14px 2px;font-size:1.1rem;border-bottom:1px solid rgba(83,61,127,.08)}
  .nav-lig a:not(.hueso)::after{display:none}
  .nav-lig .hueso{margin:18px auto 0;align-self:center}
  .hero-rej,.mision-rej,.hist-rej,.cont-rej{grid-template-columns:1fr}
  .hero-rej{align-items:start}
  .hero-txt{padding-bottom:0}
  .hero-foto{max-width:520px;justify-self:center;aspect-ratio:5/4;border-radius:180px 180px 22px 22px}
  .tira-int{grid-template-columns:1fr 1fr 1fr;gap:16px}
  .tira-it{flex-direction:column;text-align:center;gap:8px;font-size:.96rem}
  .mision-foto{max-width:560px;width:100%;margin:0 auto}
  .hist-foto{max-width:520px;width:100%;margin:0 auto}
  .ayudar-rej{grid-template-columns:1fr 1fr}
  .perros,.catalogo,.prog,.progs,.valores,.docs{grid-template-columns:1fr 1fr}
  .mv,.testis{grid-template-columns:1fr}
  /* tarjeta huérfana en la última fila: centrada y del ancho de una columna */
  :is(.perros,.catalogo,.prog,.progs,.valores,.docs)>:last-child:nth-child(odd){grid-column:1 / -1;justify-self:center;
    width:calc(50% - 14px)}
  .par,.par:nth-of-type(even){grid-template-columns:1fr}
  .par:nth-of-type(even) .par-fotos{order:0}
  .par-foto{aspect-ratio:1/1}
  .banda-rej{flex-direction:column;text-align:center}
  .banda-txt .hueso{margin-left:.55em}
}
@media (max-width:700px){
  body{font-size:16px}
  footer{padding-bottom:calc(96px + env(safe-area-inset-bottom))}   /* aire para la barra fija de donar */
  .cta-fija{display:flex}
  .nav-int{gap:12px}
  .logo-marca{width:44px;height:44px}
  .logo-marca svg{width:24px;height:24px}
  .logo-txt b{font-size:1.02rem}
  .seccion{padding:56px 0}
  .cabeza{margin-bottom:30px}
  .hero-rej{padding-top:30px;gap:28px}
  .hero .entrada{font-size:1.04rem}
  .hero .botones{flex-direction:column;align-items:stretch;gap:14px}
  .hero .botones .hueso{margin:0 .55em}
  .hero-foto{aspect-ratio:4/3;border-width:6px;border-radius:140px 140px 18px 18px}
  .tira-int{padding:18px var(--orilla)}
  .tira-it{font-size:.86rem}
  .globo{width:40px;height:40px}
  .globo svg{width:19px;height:19px}

  /* Lo que hacemos: de tarjetas con foto cuadrada a renglones compactos */
  .hacemos{grid-template-columns:1fr;gap:12px}
  .hacemos-t,.hacemos-t:nth-child(4){grid-column:auto;flex-direction:row;align-items:center}
  .hacemos-t figure{width:92px;flex:0 0 92px;align-self:stretch;aspect-ratio:auto;min-height:92px}
  .hacemos-t div{padding:12px 16px}
  .hacemos-t .num{margin-bottom:2px}
  .hacemos-t h3{margin:0;font-size:1.04rem}
  .hacemos-t p{display:none}

  .ayudar-rej{grid-template-columns:1fr 1fr;gap:12px}
  .ayudar-t{padding:22px 12px 20px}
  .ayudar-ic{width:58px;height:58px;margin-bottom:12px}
  .ayudar-ic svg{width:26px;height:26px}
  .ayudar-t h3{font-size:1.02rem}
  .ayudar-t p{font-size:.86rem;margin-bottom:16px}
  .ayudar-t .hueso{font-size:.74rem;padding:.7em 1.2em;margin:auto .5em 0}

  .perros,.catalogo,.prog,.progs,.valores,.docs{grid-template-columns:1fr}
  :is(.perros,.catalogo,.prog,.progs,.valores,.docs)>:last-child:nth-child(odd){width:auto;justify-self:stretch}
  /* en el celular, en Inicio, solo un perro y un programa; el resto vive en la página 2 */
  .perros .ficha:nth-of-type(n+2),.prog .prog-t:nth-of-type(n+2){display:none}
  .historia{display:none}

  /* Adopta: el catálogo queda completo; se compactan programas e historias */
  .progs{grid-template-columns:1fr 1fr;gap:12px}
  .progs .prog-t figure{aspect-ratio:1/1}
  .progs .prog-t>div{padding:12px 14px 16px}
  .progs .prog-t h3{font-size:.98rem;margin-bottom:.15em}
  .progs .prog-t p{display:none}
  .progs .num{font-size:.66rem;letter-spacing:.1em}
  .progs .prog-t .estado{font-size:.6rem;top:8px;right:8px;padding:4px 9px 3px}
  .par-foto{aspect-ratio:4/5}
  .par:nth-of-type(n+2){display:none}
  .testis{gap:16px}
  .testi{grid-template-columns:1fr;justify-items:center;text-align:center;padding:26px 22px}
  .testi img{grid-row:auto;margin-bottom:14px}
  .filtros{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;margin:0 calc(var(--orilla) * -1) 28px;
    padding:2px var(--orilla) 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .filtros::-webkit-scrollbar{display:none}
  .filtro{flex:0 0 auto}
  .filtros{-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
  .progs .prog-t:last-child:nth-child(odd){grid-column:1 / -1}
  .progs .prog-t:last-child:nth-child(odd) figure{aspect-ratio:2/1}

  /* Transparencia */
  .valores{grid-template-columns:1fr 1fr;gap:12px}
  .valor{padding:22px 14px}
  .valor img{width:72px;height:72px;margin-bottom:12px}
  .valor h3{font-size:1rem}
  .valor p{display:none}
  .mv-t figure{aspect-ratio:2/1}
  .legal dl{grid-template-columns:1fr}
  .legal dt{padding:12px 0 2px;border-bottom:0}
  .legal dd{padding:0 0 12px}

  .banda-foto{width:140px;height:140px}
  .banda-rej{padding:44px var(--orilla)}
  .cifras{grid-template-columns:repeat(3,1fr);gap:16px}
  .cifra b{font-size:2.1rem}
  .cifra span{font-size:.82rem}
  .foot-rej{grid-template-columns:1fr 1fr;gap:28px}
  .foot-nota{justify-content:center;text-align:center}
  .encabezado{padding-top:52px}
  .migas{display:none}
}
@media (max-width:380px){
  .logo-txt small{display:none}
  .hueso{font-size:.98rem;padding:.8em 1.7em}
  .tira-it{font-size:.8rem}
}

/* ---------- 21 · MOVIMIENTO REDUCIDO ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}