/* ============================================================================
   Fundació Pere Mata · full d'estil de la proposta

   D'on surt el disseny:
   · Els colors són els del logotip. El blau #013D6F i el taronja #F17E01 estan
     mostrejats del seu propi fitxer, no triats a ull.
   · La tipografia de titulars és una serif humanista, que és la que fa servir
     el logotip a «Fundació». La del cos és una sans de pal sec llegible a 18 px,
     perquè bona part de les persones que llegiran aquesta web tenen més de 65
     anys i la lletra petita no és una opció.
   · Res no depèn de JavaScript per a llegir-se: el menú, els desplegables i la
     paginació funcionen amb HTML i CSS. El JavaScript només hi és per al menú
     del mòbil i per a l'avís de cookies.

   Índex:
     1. Tipografia i variables
     2. Base i accessibilitat
     3. Capçalera i menú
     4. Peu
     5. Blocs i reixetes
     6. Targetes i notícies
     7. Contingut migrat (prosa, figures, taules, documents)
     8. Pàgines concretes (portada, secció, contacte, galeria, legal)
     9. Avisos, paginació i estats
    10. Moviment reduït i impressió
   ========================================================================== */

/* --- 1. Tipografia ------------------------------------------------------- */
/* Els fitxers estan autoallotjats i retallats als caràcters que la web fa
   servir de veritat. Carregar la font sencera serien 700 KB per ensenyar
   quatre accents; així són 88 KB i el navegador només se'n baixa el que usa. */
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400;font-display:swap;
  src:url('assets/fuentes/source-sans-3-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:600;font-display:swap;
  src:url('assets/fuentes/source-sans-3-600-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:700;font-display:swap;
  src:url('assets/fuentes/source-sans-3-700-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400;font-display:swap;
  src:url('assets/fuentes/source-sans-3-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+2113,U+A720-A7FF}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:600;font-display:swap;
  src:url('assets/fuentes/source-sans-3-600-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+2113,U+A720-A7FF}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:700;font-display:swap;
  src:url('assets/fuentes/source-sans-3-700-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+2113,U+A720-A7FF}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:400;font-display:swap;
  src:url('assets/fuentes/source-serif-4-400-latin.woff2') format('woff2')}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:600;font-display:swap;
  src:url('assets/fuentes/source-serif-4-600-latin.woff2') format('woff2')}

:root{
  /* Colors de marca, mostrejats del logotip */
  --azul:#013D6F;
  --azul-fosc:#012B4E;
  --azul-nit:#0B1F31;
  --azul-clar:#E9F1F8;
  --naranja:#F17E01;
  --naranja-fosc:#A05200;   /* el to que sí que es pot fer servir com a text */

  /* Neutres */
  --tinta:#17222E;
  --tinta-suau:#4E5D6C;
  --sorra:#F7F5F1;
  --blanco:#FFFFFF;
  --vora:#DFE4E9;
  --vora-fuerte:#C3CDD6;

  --fuente-texto:'Source Sans 3',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --fuente-titulo:'Source Serif 4',Georgia,'Times New Roman',serif;

  --ancho:74rem;
  --radio:14px;
  --radio-pequeno:8px;
  --sombra:0 1px 2px rgba(11,31,49,.06),0 8px 24px rgba(11,31,49,.06);
  --sombra-alta:0 2px 4px rgba(11,31,49,.08),0 18px 40px rgba(11,31,49,.12);
  --transicion:160ms ease;
}

/* --- 2. Base i accessibilitat ------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
/* `overflow-x: clip` y no `hidden`: el menú del mòbil viu fora de la pantalla
   esperant que el cridin, i un element fix desplaçat amplia l'àrea de
   desplaçament del document. Amb `hidden` el menú es veu igual, però
   `position: sticky` de la capçalera deixa de funcionar perquè `hidden` converteix
   l'element en contenidor de desplaçament; `clip` no. */
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:clip}
body{
  margin:0;
  font-family:var(--fuente-texto);
  font-size:1.125rem;          /* 18 px: la lletra petita no és una opció */
  line-height:1.65;
  color:var(--tinta);
  background:var(--blanco);
  -webkit-font-smoothing:antialiased;
}
img,svg,iframe{max-width:100%;display:block}
img{height:auto}
a{color:var(--azul);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--naranja-fosc)}
h1,h2,h3,h4{font-family:var(--fuente-titulo);font-weight:600;line-height:1.15;
  color:var(--azul-fosc);margin:0 0 .6em;letter-spacing:-.01em}
p{margin:0 0 1.1em}
ul,ol{margin:0 0 1.1em;padding-left:1.4em}
li{margin-bottom:.4em}
strong{font-weight:600}
:focus-visible{outline:3px solid var(--naranja);outline-offset:3px;border-radius:4px}
::selection{background:#FDE3C4;color:var(--azul-nit)}

.contenedor{width:min(100% - 2.5rem,var(--ancho));margin-inline:auto}
.oculto{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
.saltar{position:absolute;left:-9999px;top:0;z-index:100;background:var(--azul);
  color:#fff;padding:.75rem 1.25rem;border-radius:0 0 var(--radio-pequeno) 0;font-weight:600}
.saltar:focus{left:0;color:#fff}

.etiqueta{display:inline-block;font-size:.8rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:var(--naranja-fosc);margin-bottom:.6rem}
.etiqueta--clara{color:#FFCF9A}

.boton{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.4rem;
  border-radius:999px;font-weight:600;font-size:1rem;line-height:1.2;
  text-decoration:none;border:2px solid transparent;cursor:pointer;
  transition:background var(--transicion),color var(--transicion),border-color var(--transicion)}
.boton--principal{background:var(--azul);color:#fff;border-color:var(--azul)}
.boton--principal:hover{background:var(--azul-fosc);border-color:var(--azul-fosc);color:#fff}
.boton--linea{background:transparent;color:var(--azul);border-color:var(--vora-fuerte)}
.boton--linea:hover{border-color:var(--azul);background:var(--azul-clar);color:var(--azul-fosc)}
.boton--claro{background:#fff;color:var(--azul);border-color:#fff}
.boton--claro:hover{background:var(--azul-clar);color:var(--azul-fosc);border-color:var(--azul-clar)}

/* --- 3. Capçalera i menú ------------------------------------------------ */
.cabecera{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);
  backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--vora)}
.cabecera__interior{display:flex;align-items:center;gap:1.5rem;padding:.7rem 0}
.marca{display:flex;align-items:center;flex:0 0 auto;text-decoration:none}
.marca__logo{width:auto;height:3.1rem}

.nav{margin-left:auto}
.nav__lista{display:flex;gap:.15rem;list-style:none;margin:0;padding:0;align-items:center}
.nav__item{position:relative;margin:0}
.nav__enlace{display:block;padding:.55rem .7rem;border-radius:var(--radio-pequeno);
  font-size:.98rem;font-weight:600;color:var(--tinta);text-decoration:none;white-space:nowrap;
  transition:background var(--transicion),color var(--transicion)}
.nav__enlace:hover{background:var(--azul-clar);color:var(--azul-fosc)}
.nav__enlace--activo{color:var(--azul);box-shadow:inset 0 -3px 0 var(--naranja)}
.nav__submenu{position:absolute;left:0;top:calc(100% + .4rem);min-width:15rem;margin:0;
  padding:.45rem;list-style:none;background:#fff;border:1px solid var(--vora);
  border-radius:var(--radio);box-shadow:var(--sombra-alta);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity var(--transicion),transform var(--transicion),visibility var(--transicion)}
.nav__item--con-hijos:hover>.nav__submenu,
.nav__item--con-hijos:focus-within>.nav__submenu{opacity:1;visibility:visible;transform:none}
.nav__subenlace{display:block;padding:.5rem .7rem;border-radius:var(--radio-pequeno);
  font-size:.95rem;color:var(--tinta);text-decoration:none}
.nav__subenlace:hover{background:var(--azul-clar);color:var(--azul-fosc)}
.nav__subenlace--activo{font-weight:700;color:var(--azul)}

.cabecera__acciones{display:flex;align-items:center;gap:.85rem;margin-left:.5rem}
.idiomas{display:flex;border:1px solid var(--vora-fuerte);border-radius:999px;overflow:hidden}
.idiomas__opcion{padding:.3rem .7rem;font-size:.85rem;font-weight:700;color:var(--tinta-suau);
  text-decoration:none;letter-spacing:.03em}
.idiomas__opcion:hover{background:var(--azul-clar);color:var(--azul-fosc)}
.idiomas__opcion--activa{background:var(--azul);color:#fff}
.idiomas__opcion--activa:hover{background:var(--azul-fosc);color:#fff}
.cabecera__contacto{padding:.55rem 1.1rem;font-size:.95rem}

.menu-boton{display:none;width:2.9rem;height:2.9rem;border:1px solid var(--vora-fuerte);
  border-radius:var(--radio-pequeno);background:#fff;cursor:pointer;padding:0;
  align-items:center;justify-content:center}
.menu-boton__barras,.menu-boton__barras::before,.menu-boton__barras::after{
  display:block;width:1.25rem;height:2px;background:var(--azul);border-radius:2px;content:''}
.menu-boton__barras{position:relative}
.menu-boton__barras::before{position:absolute;top:-6px}
.menu-boton__barras::after{position:absolute;top:6px}

/* --- 4. Peu ------------------------------------------------------------- */
.pie{background:var(--azul-nit);color:#C9D6E2;margin-top:4rem;padding:3.5rem 0 2rem;
  font-size:.98rem}
.pie a{color:#fff;text-decoration-color:rgba(255,255,255,.35)}
.pie a:hover{color:#FFCF9A}
.pie__rejilla{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem}
.pie__titulo{display:block;font-family:var(--fuente-titulo);font-size:1.25rem;color:#fff;
  margin-bottom:.7rem}
.pie__direccion{font-style:normal;line-height:1.7}
.pie__lista{list-style:none;margin:0;padding:0}
.pie__lista li{margin-bottom:.45rem}
.pie__nota{display:flex;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;
  margin-top:3rem;padding-top:1.4rem;border-top:1px solid rgba(255,255,255,.15);
  font-size:.85rem;color:#93A7B9}

/* --- 5. Blocs i reixetes ------------------------------------------------ */
.bloque{padding:4rem 0}
.bloque--sora{background:var(--sora)}
.bloque--azul{background:var(--azul);color:#DCE7F1}
.bloque--azul .bloque__titulo,.bloque--azul .bloque__entradilla{color:#fff}
.bloque--cabecera{padding-bottom:1rem}
.bloque__cabecera{max-width:44rem;margin-bottom:2.5rem}
.bloque__cabecera--fila{display:flex;align-items:flex-end;justify-content:space-between;
  gap:2rem;max-width:none;flex-wrap:wrap}
.bloque__titulo{font-size:clamp(1.7rem,1.35rem + 1.3vw,2.4rem);margin-bottom:.5rem}
.bloque__titulo--pequeno{font-size:clamp(1.4rem,1.2rem + .8vw,1.8rem)}
.bloque__entradilla{font-size:1.1rem;color:var(--tinta-suau);max-width:40rem;margin:0}

.rejilla{display:grid;gap:1.75rem}
.rejilla--dos{grid-template-columns:repeat(auto-fit,minmax(min(100%,24rem),1fr))}
.rejilla--tres{grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr))}
.rejilla--cuatro{grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr))}
.rejilla--tarjetas{grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));
  margin:2rem 0 2.5rem}

/* --- 6. Targetes i notícies -------------------------------------------- */
.tarjeta{background:#fff;border:1px solid var(--vora);border-radius:var(--radio);
  overflow:hidden;box-shadow:var(--sombra);display:flex;flex-direction:column}
.tarjeta__figura{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--azul-clar)}
.tarjeta__figura img{width:100%;height:100%;object-fit:cover;
  transition:transform 400ms ease}
.tarjeta:hover .tarjeta__figura img{transform:scale(1.03)}
.tarjeta__cuerpo{padding:1.5rem;display:flex;flex-direction:column;flex:1}
.tarjeta__titulo{font-size:1.3rem;margin-bottom:.5rem}
.tarjeta__titulo a{text-decoration:none;color:inherit}
.tarjeta__titulo a:hover{color:var(--azul);text-decoration:underline}
.tarjeta__texto{color:var(--tinta-suau);font-size:1rem}
.tarjeta__mas{margin-top:auto;font-weight:600;color:var(--naranja-fosc);font-size:.95rem}

.noticia-tarjeta{display:flex;flex-direction:column;background:#fff;border:1px solid var(--vora);
  border-radius:var(--radio);overflow:hidden;transition:box-shadow var(--transicion),transform var(--transicion)}
.noticia-tarjeta:hover{box-shadow:var(--sombra-alta);transform:translateY(-2px)}
.noticia-tarjeta__figura{display:block;aspect-ratio:3/2;overflow:hidden;background:var(--azul-clar)}
.noticia-tarjeta__figura img{width:100%;height:100%;object-fit:cover;transition:transform 400ms ease}
.noticia-tarjeta:hover .noticia-tarjeta__figura img{transform:scale(1.03)}
.noticia-tarjeta__cuerpo{padding:1.25rem 1.25rem 1.4rem;display:flex;flex-direction:column;flex:1}
.noticia-tarjeta__fecha{font-size:.85rem;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--naranja-fosc);margin-bottom:.45rem}
.noticia-tarjeta__titulo{font-size:1.16rem;line-height:1.25;margin-bottom:.5rem}
.noticia-tarjeta__titulo a{text-decoration:none;color:inherit}
.noticia-tarjeta__titulo a:hover{color:var(--azul);text-decoration:underline}
.noticia-tarjeta__resumen{font-size:.98rem;color:var(--tinta-suau);margin:0}

.tarjeta-mini{background:#fff;border:1px solid var(--vora);border-radius:var(--radio);
  overflow:hidden;display:flex;flex-direction:column}
.tarjeta-mini__figura{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--azul-clar)}
.tarjeta-mini__figura img{width:100%;height:100%;object-fit:cover}
.tarjeta-mini__titulo{font-size:1.1rem;padding:1rem 1.1rem .35rem;margin:0}
.tarjeta-mini__titulo a{text-decoration:none;color:inherit}
.tarjeta-mini__titulo a:hover{color:var(--azul);text-decoration:underline}
.tarjeta-mini__texto{padding:0 1.1rem 1.1rem;margin:0;font-size:.95rem;color:var(--tinta-suau)}

.acceso{display:block;padding:1.5rem;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.22);border-radius:var(--radio);
  text-decoration:none;color:#fff;transition:background var(--transicion),transform var(--transicion)}
.acceso:hover{background:rgba(255,255,255,.16);transform:translateY(-2px);color:#fff}
.acceso__titulo{display:block;font-family:var(--fuente-titulo);font-size:1.2rem;margin-bottom:.4rem}
.acceso__texto{font-size:.95rem;color:#C9D6E2}

.enlace-tarjeta{display:block;padding:1.4rem 1.5rem;background:#fff;border:1px solid var(--vora);
  border-left:4px solid var(--naranja);border-radius:var(--radio-pequeno);
  text-decoration:none;color:inherit;transition:box-shadow var(--transicion),transform var(--transicion)}
.enlace-tarjeta:hover{box-shadow:var(--sombra);transform:translateX(2px)}
.enlace-tarjeta strong{display:block;font-family:var(--fuente-titulo);font-size:1.15rem;
  color:var(--azul-fosc);margin-bottom:.3rem}
.enlace-tarjeta span{font-size:.96rem;color:var(--tinta-suau)}

/* --- 7. Contingut migrat ------------------------------------------------ */
.seccion__cuerpo{max-width:52rem}
.seccion__cuerpo--estrecho{max-width:44rem}
.prosa{font-size:1.1rem;margin:0 0 1.15em}
.prosa a{color:var(--azul);font-weight:600}
/* Aquí había un `.prosa br+br{display:none}` para comerse el segundo salto de
   los párrafos separados con `<br><br>`. Estaba mal y hacía un daño silencioso:
   en CSS el combinador de hermanos IGNORA los nodos de texto, así que `br+br`
   casaba con cualquier `<br>` que tuviera otro `<br>` antes, aunque hubiera
   texto en medio. Ocultaba todos los saltos de línea menos el primero, y las
   direcciones y los teléfonos salían en una sola línea corrida. Ya no hace
   falta: los párrafos se separan en bloques distintos antes de llegar aquí. */
.prosa:last-child{margin-bottom:0}
.apartado{font-size:clamp(1.35rem,1.15rem + .7vw,1.75rem);margin:2.5rem 0 .8rem;
  padding-bottom:.4rem;border-bottom:2px solid var(--azul-clar)}
.apartado:first-child{margin-top:0}
.lista{list-style:none;padding:0;margin:0 0 1.75rem}
.lista li{position:relative;padding-left:1.6rem;margin-bottom:.55rem}
.lista li::before{content:'';position:absolute;left:0;top:.65em;width:.5rem;height:.5rem;
  border-radius:50%;background:var(--naranja)}
.figura{margin:2rem 0}
.figura img{width:100%;border-radius:var(--radio);box-shadow:var(--sombra)}
.cita{margin:2rem 0;padding:1.25rem 1.5rem;border-left:4px solid var(--naranja);
  background:var(--sora);border-radius:0 var(--radio-pequeno) var(--radio-pequeno) 0;
  font-family:var(--fuente-titulo);font-size:1.15rem}

.tabla-envoltorio{overflow-x:auto;margin:2rem 0}
.tabla{width:100%;border-collapse:collapse;font-size:1rem}
.tabla td,.tabla th{padding:.75rem 1rem;border:1px solid var(--vora);vertical-align:top;text-align:left}
.tabla tr:nth-child(even) td{background:var(--sora)}

/* Els PDF i documents enllaçats des del contingut antic: el text de l'enllaç
   sol ser «En format PDF», que no diu res. Es marca amb una icona perquè es
   vegi que és una descàrrega abans de prémer. */
.prosa a[href$=".pdf"]::after,.lista a[href$=".pdf"]::after{
  content:' (PDF)';font-size:.8em;font-weight:700;color:var(--naranja-fosc)}

/* --- 8. Pàgines concretes ----------------------------------------------- */
.heroe{background:linear-gradient(180deg,var(--azul-clar) 0%,#fff 100%);
  padding:3.5rem 0 3rem;overflow:hidden}
.heroe__interior{display:grid;grid-template-columns:1.05fr .95fr;gap:3.5rem;align-items:center}
.heroe__titulo{font-size:clamp(2.1rem,1.55rem + 2.4vw,3.3rem);margin-bottom:.7rem}
.heroe__entradilla{font-size:1.15rem;color:var(--tinta-suau);max-width:36rem}
.heroe__acciones{display:flex;gap:.85rem;flex-wrap:wrap;margin-top:1.75rem}
.heroe__figura{margin:0;position:relative}
.heroe__figura img{width:100%;border-radius:var(--radio);box-shadow:var(--sombra-alta);
  aspect-ratio:4/3;object-fit:cover}

.cifras{background:var(--azul);color:#fff;padding:2.5rem 0}
.cifras__rejilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));
  gap:2rem}
.cifra{display:flex;flex-direction:column;gap:.35rem}
.cifra__dato{font-family:var(--fuente-titulo);font-size:2.6rem;font-weight:600;line-height:1;
  color:#FFCF9A}
.cifra__texto{font-size:.98rem;color:#DCE7F1}

.migas{padding-top:1.75rem}
.migas__lista{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0;
  font-size:.9rem;color:var(--tinta-suau)}
.migas__lista li{margin:0;display:flex;align-items:center;gap:.5rem}
.migas__lista li+li::before{content:'›';color:var(--vora-fuerte)}
.migas__lista a{color:var(--tinta-suau);text-decoration:none}
.migas__lista a:hover{color:var(--azul);text-decoration:underline}

.seccion{padding:1.75rem 0 3rem}
.seccion__titulo{font-size:clamp(1.9rem,1.5rem + 1.8vw,2.8rem);max-width:44rem}

.noticia{padding:1.75rem 0 2rem}
.noticia__interior{max-width:44rem}
.noticia__fecha{display:inline-block;font-size:.88rem;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--naranja-fosc);margin-bottom:.7rem}
.noticia__titulo{font-size:clamp(1.8rem,1.45rem + 1.6vw,2.6rem)}
.noticia__aviso-lengua{background:var(--sorra);border-left:4px solid var(--naranja);
  padding:.9rem 1.1rem;border-radius:0 var(--radio-pequeno) var(--radio-pequeno) 0;
  font-size:.95rem;color:var(--tinta-suau)}
.noticia__pie{margin-top:3rem;padding-top:1.75rem;border-top:1px solid var(--vora);
  display:flex;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;align-items:center}
.compartir{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:.92rem}
.compartir__titulo{color:var(--tinta-suau)}
.compartir__enlace{padding:.35rem .8rem;border:1px solid var(--vora-fuerte);
  border-radius:999px;text-decoration:none;font-size:.88rem;color:var(--azul)}
.compartir__enlace:hover{background:var(--azul-clar)}

.contacto-banda{background:var(--azul);color:#DCE7F1;border-radius:var(--radio);
  padding:2.5rem 2rem;margin:0 auto}
.contacto-banda .bloque__titulo{color:#fff}
.contacto-banda .bloque__entradilla{color:#DCE7F1}
.contacto-banda__datos{line-height:1.8}
.contacto-banda__datos a{color:#fff}
.contacto-banda--claro{background:transparent;padding:0}

.contacto{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start}
.contacto__nombre{font-size:1.35rem;margin-bottom:1rem}
.ficha{display:grid;grid-template-columns:auto 1fr;gap:.4rem 1.5rem;margin:0 0 2rem}
.ficha dt{font-weight:700;color:var(--azul-fosc)}
.ficha dd{margin:0}
.mapa{border-radius:var(--radio);overflow:hidden;border:1px solid var(--vora);box-shadow:var(--sombra)}
.mapa iframe{width:100%;height:22rem;border:0}
.mapa__enlace{margin-top:1rem}
.aviso-caja{background:var(--sorra);border-left:4px solid var(--naranja);
  border-radius:0 var(--radio-pequeno) var(--radio-pequeno) 0;padding:1.1rem 1.25rem;
  font-size:.98rem}
.aviso-caja strong{display:block;color:var(--azul-fosc);margin-bottom:.3rem}
.aviso-caja p{margin:0;color:var(--tinta-suau)}

.galeria{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,16rem),1fr));
  gap:1.25rem;list-style:none;margin:0;padding:0}
.galeria__pieza{margin:0}
.galeria figure{margin:0;background:#fff;border:1px solid var(--vora);
  border-radius:var(--radio);overflow:hidden}
.galeria img{width:100%;aspect-ratio:4/3;object-fit:cover}
.galeria figcaption{padding:.85rem 1rem;font-size:.92rem;color:var(--tinta-suau)}
.galeria__nota{margin-top:2rem;font-size:.92rem;color:var(--tinta-suau)}

.legal{padding:1.75rem 0 3rem}
.legal__interior{max-width:46rem}
.legal__nota{font-size:.95rem;color:var(--tinta-suau);background:var(--sorra);
  padding:.9rem 1.1rem;border-radius:var(--radio-pequeno)}
.legal__volver{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:3rem}
.recuento{font-weight:700;color:var(--azul)}

.agenda__lista{list-style:none;margin:0;padding:0}
.agenda__acto{display:grid;grid-template-columns:9rem 1fr;gap:1.5rem;padding:1.25rem 0;
  border-bottom:1px solid var(--vora)}
.agenda__fecha{font-weight:700;color:var(--naranja-fosc)}
.agenda__titulo{font-size:1.15rem;margin:0 0 .3rem}
.agenda__resumen{margin:0;color:var(--tinta-suau);font-size:.98rem}

.vacio{background:var(--sora);border-radius:var(--radio);padding:3rem 2rem;text-align:center;
  max-width:44rem}
.vacio__titulo{font-family:var(--fuente-titulo);font-size:1.4rem;color:var(--azul-fosc);margin-bottom:.5rem}
.vacio__texto{color:var(--tinta-suau)}

/* --- 9. Avisos, paginació i estats -------------------------------------- */
.cookies{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--azul-nit);
  color:#DCE7F1;padding:1rem 0;box-shadow:0 -8px 30px rgba(11,31,49,.25)}
.cookies[hidden]{display:none}
.cookies__interior{display:flex;align-items:center;justify-content:space-between;
  gap:1.5rem;flex-wrap:wrap}
.cookies__texto{margin:0;font-size:.95rem;max-width:60rem}
.cookies__texto a{color:#fff}

.paginacion{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
  flex-wrap:wrap;margin-top:3.5rem;padding-top:2rem;border-top:1px solid var(--vora)}
.paginacion__lista{display:flex;gap:.35rem;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.paginacion__numero{display:flex;align-items:center;justify-content:center;
  min-width:2.5rem;height:2.5rem;padding:0 .5rem;border:1px solid var(--vora-fuerte);
  border-radius:var(--radio-pequeno);text-decoration:none;font-weight:600;color:var(--azul)}
.paginacion__numero:hover{background:var(--azul-clar)}
.paginacion__numero--activo{background:var(--azul);border-color:var(--azul);color:#fff}
.paginacion__salto{font-weight:600;text-decoration:none}
.paginacion__salto--apagado{color:var(--vora-fuerte);font-weight:600}
.paginacion__cuenta{text-align:center;color:var(--tinta-suau);font-size:.92rem;margin-top:1.25rem}

/* --- 10. Moviment reduït i impressió ------------------------------------ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;
    scroll-behavior:auto !important}
}
@media print{
  .cabecera,.pie,.cookies,.compartir,.paginacion,.menu-boton{display:none !important}
  body{font-size:11pt}
  a[href^="http"]::after{content:' (' attr(href) ')';font-size:.8em;color:#555}
}

/* --- Pantalles estretes -------------------------------------------------- */
@media (max-width:1100px){
  .nav__enlace{padding:.5rem .5rem;font-size:.92rem}
  .cabecera__contacto{display:none}
}
@media (max-width:900px){
  /* `backdrop-filter` convierte la cabecera en el bloque contenedor de sus
     descendientes fijos, y el menú del móvil —que es fijo— se quedaba con la
     altura de la cabecera, 104 px, en vez de la de la pantalla. En escritorio
     no pasa nada porque el menú no es un calaij; aquí se quita el desenfoque. */
  .cabecera{backdrop-filter:none;background:#fff}
  .heroe__interior{grid-template-columns:1fr;gap:2rem}
  .heroe__figura{order:-1}
  .contacto{grid-template-columns:1fr}
  .pie__rejilla{grid-template-columns:1fr 1fr}
  /* El calaix del menú NO es deixa fora de la pantalla esperant: un element
     fix desplaçat cap a un costat amplia l'àrea de desplaçament del document, i
     la pàgina agafava 343 px d'amplada de més. S'amaga del tot i, en obrir-se,
     entra lliscant. */
  .nav{display:none;position:fixed;inset:0 0 0 auto;width:min(22rem,88vw);background:#fff;
    padding:4.5rem 1.5rem 2rem;box-shadow:-10px 0 40px rgba(11,31,49,.18);
    overflow-y:auto;z-index:55;margin:0}
  .nav[data-abierto="si"]{display:block;animation:entrar-menu 200ms ease both}
  @keyframes entrar-menu{from{transform:translateX(100%)}to{transform:none}}
  .nav__lista{flex-direction:column;align-items:stretch;gap:.1rem}
  .nav__item--con-hijos>.nav__submenu{position:static;opacity:1;visibility:visible;
    transform:none;box-shadow:none;border:0;border-left:2px solid var(--vora);
    border-radius:0;margin:.2rem 0 .4rem .6rem;padding:0 0 0 .5rem;min-width:0}
  .nav__enlace{padding:.7rem .6rem;font-size:1.05rem}
  .menu-boton{display:flex;position:relative;z-index:60}
  body[data-menu="abierto"]{overflow:hidden}
}
@media (max-width:620px){
  body{font-size:1.05rem}
  .bloque{padding:2.75rem 0}
  .cifra__dato{font-size:2.1rem}
  .pie__rejilla{grid-template-columns:1fr;gap:2rem}
  .paginacion{justify-content:center}
  .agenda__acto{grid-template-columns:1fr;gap:.3rem}
  .ficha{grid-template-columns:1fr;gap:.1rem 0}
  .ficha dt{margin-top:.6rem}
}
