/* Estudio 27´10 — hoja de estilos única. Sistema A (tipográfico, aprobado por Nicolás el 30-09-2026):
   negro, blanco y caqui del logo; Barlow Condensed para rótulos y Public Sans para el texto. Móvil primero. */
:root {
  --tinta: #0b0b0b;
  --texto: #1d1d1d;
  --suave: #555;
  --caqui: #d7d18c;        /* caqui del logo: fondos, filetes y rótulos; nunca texto sobre blanco */
  --oliva: #6f6a2a;        /* acento de texto (contraste 5,9:1 sobre blanco) */
  --papel: #f4f3ea;
  --linea: #cfcfcf;
  --blanco: #fff;
  --g: 16px;               /* margen lateral único de toda la web */
  --lectura: 68ch;
  --texto-f: "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --rotulo-f: "Barlow Condensed", "Arial Narrow", "Roboto Condensed", "Helvetica Neue", Arial, sans-serif;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; } }
body {
  margin: 0;
  font: 400 1.0625rem/1.6 var(--texto-f);
  color: var(--texto);
  background: var(--blanco);
  padding-bottom: 56px; /* barra de contacto fija en móvil */
}
img { max-width: 100%; height: auto; display: block; }
picture { display: block; }
a { color: var(--tinta); text-decoration-color: var(--caqui); text-decoration-thickness: 2px; text-underline-offset: 3px; }
a:hover { color: var(--oliva); }
:focus-visible { outline: 3px solid var(--tinta); outline-offset: 2px; box-shadow: 0 0 0 6px var(--caqui); }
h1, h2, h3, h4 { font-family: var(--rotulo-f); color: var(--tinta); line-height: .95; font-weight: 700; text-transform: uppercase; letter-spacing: 0; margin: 0 0 .6em; text-wrap: balance; }
h1 { font-size: clamp(2.6rem, 8vw, 6rem); line-height: .9; }
h2 { font-size: clamp(1.8rem, 4vw, 2.9rem); }
h3 { font-size: 1.375rem; line-height: 1; }
p { margin: 0 0 1em; }
ul, ol { padding-left: 1.3em; margin: 0 0 1.2em; }
li { margin-bottom: .4em; }
strong { color: var(--tinta); font-weight: 600; }

.salto { position: absolute; left: -9999px; top: 0; background: var(--tinta); color: #fff; padding: .7rem 1rem; z-index: 100; }
.salto:focus { left: 1rem; top: 1rem; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.contenedor { width: 100%; padding: 0 var(--g); }
.lectura { max-width: calc(var(--lectura) + 2 * var(--g)); }
.seccion { padding: 44px 0; border-top: 2px solid var(--tinta); }
.seccion--papel { background: var(--papel); }
.seccion--oscura { background: var(--tinta); color: #e9e9e9; }
.seccion--oscura h2, .seccion--oscura h3, .seccion--oscura strong { color: #fff; }
.seccion--oscura a { color: #fff; }
.antetitulo {
  display: inline-block; margin: 0 0 1rem; padding: 1px 8px;
  font: 700 .875rem/1.4 var(--rotulo-f); letter-spacing: .14em; text-transform: uppercase;
  background: var(--caqui); color: var(--tinta);
}
.entradilla { font-size: clamp(1.125rem, 2vw, 1.375rem); line-height: 1.4; color: var(--texto); max-width: 40ch; }

/* Botones: rótulo en mayúsculas, sin radios ni sombras */
.boton {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 46px; padding: .55rem 1.1rem;
  font: 600 .95rem/1.1 var(--rotulo-f); letter-spacing: .12em; text-transform: uppercase; text-decoration: none;
  background: var(--tinta); color: #fff; border: 2px solid var(--tinta); border-radius: 0; cursor: pointer;
}
.boton:hover { background: #fff; color: var(--tinta); }
.boton--oro { background: var(--caqui); border-color: var(--caqui); color: var(--tinta); }
.boton--oro:hover { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.boton--linea { background: transparent; color: var(--tinta); }
.boton--linea:hover { background: var(--tinta); color: #fff; }
.seccion--oscura .boton--linea { color: #fff; border-color: #fff; }
.seccion--oscura .boton--linea:hover { background: #fff; color: var(--tinta); }
.botones { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.5rem; }

/* Cabecera: rótulo del estudio y navegación en una línea con filete negro */
.cabecera { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50; background: #fff; border-bottom: 2px solid var(--tinta); }
.cabecera__fila { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 0 var(--g); }
.marca { font: 600 15px/1.2 var(--rotulo-f); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; color: var(--tinta); }
.marca:hover { color: var(--oliva); }
.menu-boton {
  display: inline-flex; align-items: center; gap: .55rem; min-height: 44px; padding: .3rem 0;
  background: none; border: 0; font: 600 15px var(--rotulo-f); letter-spacing: .1em; text-transform: uppercase; color: var(--tinta); cursor: pointer;
}
.menu-boton__icono, .menu-boton__icono::before, .menu-boton__icono::after { display: block; width: 20px; height: 2px; background: var(--tinta); position: relative; }
.menu-boton__icono::before, .menu-boton__icono::after { content: ""; position: absolute; left: 0; }
.menu-boton__icono::before { top: -6px; } .menu-boton__icono::after { top: 6px; }
.menu-boton[aria-expanded="true"] .menu-boton__icono { background: transparent; }
.menu-boton[aria-expanded="true"] .menu-boton__icono::before { top: 0; transform: rotate(45deg); }
.menu-boton[aria-expanded="true"] .menu-boton__icono::after { top: 0; transform: rotate(-45deg); }
.nav { display: none; }
.nav.abierta { display: block; position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-bottom: 2px solid var(--tinta); max-height: calc(100vh - 58px); overflow-y: auto; }
.nav ul { list-style: none; margin: 0; padding: 0 var(--g) 1.25rem; }
.nav li { margin: 0; }
.nav a { display: block; padding: .7rem 0; color: var(--tinta); text-decoration: none; border-bottom: 1px solid var(--linea); font: 600 1.35rem/1.1 var(--rotulo-f); text-transform: uppercase; letter-spacing: .02em; }
.nav a[aria-current="page"] { color: var(--oliva); }
.nav .sub { padding: 0 0 0 1rem; }
.nav .sub a { font: 400 1rem/1.3 var(--texto-f); text-transform: none; letter-spacing: 0; padding: .6rem 0; }
.nav__grupo > span { display: block; padding: 1rem 0 .3rem; font: 700 .8rem var(--rotulo-f); letter-spacing: .14em; text-transform: uppercase; color: var(--suave); }
.nav .nav__tel a { border: 0; margin-top: .75rem; }
.nav__desplegar { display: none; }
.cabecera__tel { display: none; }

/* Barra fija de contacto en móvil */
.barra-contacto { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: grid; grid-template-columns: 1fr 1fr 1fr; background: var(--tinta); border-top: 2px solid var(--tinta); padding-bottom: env(safe-area-inset-bottom, 0px); }
.barra-contacto a { display: flex; align-items: center; justify-content: center; min-height: 54px; color: #fff; text-decoration: none; font: 600 15px var(--rotulo-f); letter-spacing: .12em; text-transform: uppercase; }
.barra-contacto a + a { border-left: 1px solid #333; }
.barra-contacto a:nth-child(2) { background: var(--caqui); color: var(--tinta); border: 0; }

/* Portada: la marca como título, lema, imagen a toda anchura e índice */
.portada__marca { font: 700 clamp(96px, 26vw, 380px)/.8 var(--rotulo-f); letter-spacing: -.02em; text-transform: none; padding: 28px var(--g) 12px; margin: 0; color: var(--caqui); }
.portada__marca .t { font-weight: 200; color: var(--tinta); }
.portada__marca i { font-style: normal; font-weight: 700; color: var(--tinta); }
.portada__marca small { font: 300 clamp(16px, 3vw, 34px)/1 var(--rotulo-f); letter-spacing: .5em; color: var(--suave); margin-left: .6em; border-right: 3px solid var(--tinta); padding-right: .5em; vertical-align: top; }
.lema { display: grid; grid-template-columns: 1fr; gap: 16px; padding: 0 var(--g) 28px; border-bottom: 1px solid var(--tinta); }
.lema p { margin: 0; font: 400 clamp(17px, 2vw, 22px)/1.35 var(--texto-f); max-width: 34ch; color: var(--tinta); }
.lema p.s { font-size: 13px; color: var(--suave); }
.lema p.s a { color: inherit; text-decoration: none; }

/* Imágenes con pie rotulado en caqui */
.pan { margin: 0; position: relative; }
.pan + .pan, .par, .fil { margin-top: 2px; }
.pan img { width: 100%; }
.pan > a { display: block; cursor: zoom-in; }
.pan figcaption, .cap { display: block; margin: 0; background: var(--caqui); color: var(--tinta); padding: 5px 10px; font: 500 12px/1.3 var(--rotulo-f); letter-spacing: .1em; text-transform: uppercase; }
.par { display: grid; grid-template-columns: 1fr; gap: 2px; }
.fil { display: grid; grid-template-columns: 1fr; gap: 2px; }
.fil img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; }
.separa { margin-top: 26px; }

/* Rótulo de bloque: «PROYECTOS 04» */
.rotulo { font: 700 14px/1.2 var(--rotulo-f); letter-spacing: .14em; text-transform: uppercase; margin: 0; padding: 34px var(--g) 10px; display: flex; justify-content: space-between; gap: 12px; }
.rotulo span { background: var(--caqui); color: var(--tinta); padding: 0 8px; }

/* Índice de proyectos */
.idx { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--tinta); }
.idx li { margin: 0; border-bottom: 1px solid var(--linea); }
.idx a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; padding: 15px var(--g); align-items: baseline; text-decoration: none; color: var(--tinta); }
.idx a:hover, .idx a:focus-visible { background: var(--tinta); color: #fff; }
.idx a:hover em, .idx a:focus-visible em { color: var(--caqui); }
.idx b { font: 600 clamp(22px, 3vw, 34px)/1 var(--rotulo-f); text-transform: uppercase; }
.idx span { font-size: 14px; line-height: 1.4; }
.idx .d { display: none; }
.idx em { font: 500 13px var(--rotulo-f); letter-spacing: .1em; text-transform: uppercase; font-style: normal; }
.idx .v { display: none; }

/* Servicios de la portada */
.serv { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-top: 2px solid var(--tinta); }
.serv > div { padding: 16px; border-right: 1px solid var(--linea); border-bottom: 1px solid var(--linea); min-width: 0; }
.serv > div:nth-child(2n) { border-right: 0; }
.serv h3 { font: 700 22px/1 var(--rotulo-f); text-transform: uppercase; margin: 0 0 10px; }
.serv p { font-size: 13.5px; line-height: 1.45; margin: 0 0 12px; color: #333; }
.serv a, .ver { font: 600 12px var(--rotulo-f); letter-spacing: .12em; text-transform: uppercase; color: var(--tinta); text-decoration: none; border-bottom: 3px solid var(--caqui); }
.serv a:hover, .ver:hover { border-color: var(--tinta); color: var(--tinta); }

/* Bloque «Estudio» */
.est { display: grid; grid-template-columns: 1fr; gap: 16px; padding: 40px var(--g); border-top: 2px solid var(--tinta); }
.est h2 { font: 700 14px/1.2 var(--rotulo-f); letter-spacing: .14em; margin: 0; }
.est p { margin: 0; font: 400 clamp(18px, 2.4vw, 28px)/1.3 var(--texto-f); max-width: 40ch; color: var(--tinta); }
.est p + p { margin-top: 1rem; font-size: 1rem; }

/* Cabecera de página interior */
.cabeza { padding: 28px 0 32px; border-bottom: 2px solid var(--tinta); }
.cabeza h1 { max-width: 16em; margin-bottom: .35em; }
.cabeza .entradilla { margin-bottom: 0; }
.migas { font: 500 13px/1.4 var(--rotulo-f); letter-spacing: .1em; text-transform: uppercase; color: var(--suave); margin-bottom: 1.4rem; }
.migas a { color: var(--suave); text-decoration: none; }
.migas a:hover { color: var(--tinta); }
.cabeza + .seccion, .cabeza + section { border-top: 0; }
.imagen-ancha { margin: 0; }
.imagen-ancha img { width: 100%; max-height: 78vh; object-fit: cover; }
.recorte-bajo { aspect-ratio: 8 / 3; object-fit: cover; object-position: 50% 100%; width: 100%; }
figcaption, .pie { font: 500 12px/1.4 var(--rotulo-f); letter-spacing: .1em; text-transform: uppercase; color: var(--suave); margin-top: .5rem; }

/* Rejillas y tarjetas */
.rejilla { display: grid; gap: 28px 16px; }
.tarjeta { border-top: 2px solid var(--tinta); padding: 14px 0 0; min-width: 0; }
.tarjeta h3 a { color: var(--tinta); text-decoration: none; }
.tarjeta h3 a:hover { color: var(--oliva); }
.tarjeta p { color: #333; font-size: .95rem; line-height: 1.5; }
.mas { font: 600 .85rem var(--rotulo-f); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; color: var(--tinta); border-bottom: 3px solid var(--caqui); }
.mas::after { content: " →"; }
.mas:hover { border-color: var(--tinta); color: var(--tinta); }

.proyecto-tarjeta { display: block; text-decoration: none; color: var(--texto); min-width: 0; }
.proyecto-tarjeta img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.proyecto-tarjeta h2, .proyecto-tarjeta h3 { margin: .55rem 0 .2rem; font-size: 1.5rem; }
.proyecto-tarjeta:hover h2, .proyecto-tarjeta:hover h3 { color: var(--oliva); }
.proyecto-tarjeta p { margin: 0; font-size: .92rem; color: var(--suave); }
.etiqueta { display: inline-block; font: 600 .78rem var(--rotulo-f); letter-spacing: .12em; text-transform: uppercase; color: var(--tinta); margin-top: .7rem; }
.etiqueta--estado { background: var(--caqui); padding: 0 .45rem; margin-right: .5rem; }
.proyecto-tarjeta--plano img, .miniatura-plano img { border: 1px solid var(--linea); background: var(--blanco); object-fit: contain; }
.miniatura-plano { margin: 0; }
.ejemplo-real { margin: 0 0 3rem; padding-bottom: 3rem; border-bottom: 1px solid var(--linea); }
.ejemplo-real h3 { font-size: 1.6rem; }
.mosaico { display: grid; grid-template-columns: 1fr; gap: 28px 2px; margin-top: 2px; }
.mosaico .proyecto-tarjeta h2, .mosaico .proyecto-tarjeta p, .mosaico .etiqueta { padding: 0 var(--g); }
.mosaico .etiqueta--estado { padding: 0 .45rem; margin-left: var(--g); }

/* Pasos: numeración en rótulo */
.pasos { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; counter-reset: paso; border-top: 2px solid var(--tinta); }
.pasos li { counter-increment: paso; position: relative; padding: 16px 0 18px 64px; margin: 0; border-bottom: 1px solid var(--linea); }
.pasos li::before { content: counter(paso, decimal-leading-zero); position: absolute; left: 0; top: 12px; font: 700 2.4rem/1 var(--rotulo-f); color: var(--tinta); background: var(--caqui); padding: 2px 6px; }
.pasos h3 { margin-bottom: .35rem; font-size: 1.3rem; }
.pasos p { margin: 0; color: #333; font-size: .97rem; }
.seccion--oscura .pasos p { color: #cfcfcf; }

.lista-check { list-style: none; padding: 0; }
.lista-check li { position: relative; padding-left: 1.6rem; }
.lista-check li::before { content: ""; position: absolute; left: 0; top: .7em; width: .9rem; height: 3px; background: var(--tinta); }

.dos-col { display: grid; gap: 1.5rem; }
.dos-col > * { min-width: 0; }
.dos-col > h2 { margin-bottom: 0; }  /* solo el título suelto de columna; dentro de un bloque conserva su margen */
.nota { border-left: 6px solid var(--caqui); background: var(--papel); padding: 1rem 1.25rem; font-size: .95rem; color: #333; margin: 1.5rem 0; }
.nota p:last-child, .nota ul:last-child { margin-bottom: 0; }
.datos { list-style: none; padding: 0; margin: 0 0 1.5rem; display: grid; gap: 0 1.5rem; border-top: 2px solid var(--tinta); }
.datos li { margin: 0; padding: .65rem 0; border-bottom: 1px solid var(--linea); }
.datos b { display: block; font: 700 .8rem var(--rotulo-f); letter-spacing: .12em; text-transform: uppercase; color: var(--suave); }
/* Cifras tipográficas (página de trasteros): solo tipografía y filete */
.cifras .cifra { display: block; font: 700 clamp(1.8rem, 4vw, 2.6rem)/1 var(--rotulo-f); color: var(--tinta); margin-top: .2rem; }
.nota--destacada { background: var(--blanco); border: 2px solid var(--tinta); border-left: 6px solid var(--caqui); }
.nota--destacada a { color: var(--tinta); }
.nw { white-space: nowrap; }

/* Galería y visor */
.galeria { display: grid; gap: 2px; grid-template-columns: 1fr; margin-top: 2px; }
.galeria figure { margin: 0; min-width: 0; position: relative; }
.galeria a { display: block; cursor: zoom-in; }
.galeria img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--papel); }
.galeria figcaption { margin: 0; padding: 6px var(--g) 12px; }
.galeria .plano img { object-fit: contain; background: #fff; border: 1px solid var(--linea); }
.galeria figure.plano.ancha img { aspect-ratio: auto; max-height: 80vh; }
.visor { border: 0; padding: 0; margin: 0; width: 100vw; height: 100vh; max-width: 100vw; max-height: 100vh; background: rgba(11,11,11,.97); color: #fff; }
.visor::backdrop { background: rgba(11,11,11,.97); }
.visor__marco { position: absolute; inset: 3.5rem .5rem 5rem; display: flex; align-items: center; justify-content: center; }
.visor__marco img { max-width: 100%; max-height: 100%; object-fit: contain; background: #fff; }
.visor__pie { position: absolute; left: 1rem; right: 1rem; bottom: 1rem; text-align: center; font: 500 13px/1.4 var(--rotulo-f); letter-spacing: .1em; text-transform: uppercase; color: #ddd; margin: 0; min-height: 3rem; }
.visor button { position: absolute; background: var(--tinta); color: #fff; border: 2px solid #fff; width: 46px; height: 46px; font: 400 1.5rem/1 var(--rotulo-f); cursor: pointer; border-radius: 0; }
.visor button:hover { background: var(--caqui); color: var(--tinta); border-color: var(--caqui); }
.visor__cerrar { top: .5rem; right: .5rem; }
.visor__ant { left: .5rem; top: 50%; transform: translateY(-50%); }
.visor__sig { right: .5rem; top: 50%; transform: translateY(-50%); }

/* Blog y guías */
.entradas { display: grid; gap: 0; list-style: none; padding: 0; margin: 0; border-top: 2px solid var(--tinta); }
.entradas li { margin: 0; border-bottom: 1px solid var(--linea); padding: 1.25rem 0; }
.entradas h2 { font-size: clamp(1.4rem, 2.6vw, 1.9rem); margin-bottom: .35rem; }
.entradas h2 a { color: var(--tinta); text-decoration: none; }
.entradas h2 a:hover { color: var(--oliva); }
.entradas p { margin: 0; color: #333; max-width: var(--lectura); }
.fecha { font: 500 .8rem var(--rotulo-f); letter-spacing: .1em; text-transform: uppercase; color: var(--suave); display: block; margin-bottom: .35rem; }
.articulo { max-width: var(--lectura); }
.articulo h2 { font-size: clamp(1.5rem, 3vw, 2rem); margin-top: 2.2rem; }
.articulo h3 { margin-top: 1.6rem; font-size: 1.3rem; }
.articulo p, .articulo li { line-height: 1.65; }

/* Preguntas frecuentes y fuentes */
.faq { margin: 2.5rem 0 0; }
.faq__item { border-top: 1px solid var(--linea); padding: 1.1rem 0 .4rem; }
.faq__item:last-child { border-bottom: 1px solid var(--linea); }
.faq__item h3 { font: 600 1.1rem/1.35 var(--texto-f); text-transform: none; margin: 0 0 .5rem; }
.faq__item p { margin: 0 0 .7rem; }
.fuentes { margin-top: 2.5rem; font-size: .9rem; color: var(--suave); }
.fuentes h2 { font-size: 1.3rem; }
.fuentes ul { padding-left: 1.2rem; }
.fuentes li { margin-bottom: .35rem; overflow-wrap: anywhere; }
.articulo table, .seccion table { border-collapse: collapse; width: 100%; font-size: .95rem; margin: 1rem 0 1.5rem; }
.articulo th, .articulo td { border: 1px solid var(--linea); padding: .5rem .6rem; text-align: left; vertical-align: top; }
.articulo th { background: var(--tinta); color: #fff; font: 600 .85rem var(--rotulo-f); letter-spacing: .08em; text-transform: uppercase; }
.tabla { overflow-x: auto; }

/* Contacto */
.formulario { display: grid; gap: 1rem; }
.formulario label { display: block; font: 700 .85rem var(--rotulo-f); letter-spacing: .12em; text-transform: uppercase; color: var(--tinta); margin-bottom: .3rem; }
.formulario input, .formulario select, .formulario textarea {
  width: 100%; font: inherit; color: var(--tinta); padding: .65rem .8rem; border: 1px solid var(--tinta); border-radius: 0; background: #fff; min-height: 48px;
}
.formulario input:focus, .formulario select:focus, .formulario textarea:focus { outline: 3px solid var(--caqui); outline-offset: 0; }
.formulario textarea { min-height: 9rem; resize: vertical; }
.formulario .ayuda { font-size: .85rem; color: var(--suave); margin: 0; }
.contacto-directo { font: 600 clamp(1.5rem, 3vw, 2.2rem)/1.15 var(--rotulo-f); text-transform: uppercase; }
.contacto-directo a { color: var(--tinta); text-decoration: none; border-bottom: 3px solid var(--caqui); }

/* Llamada final de las páginas interiores */
.llamada { background: var(--blanco); color: var(--texto); }
.llamada .contenedor { display: grid; gap: .5rem 16px; }
.llamada h2 { color: var(--tinta); }
.llamada p { max-width: 40ch; font-size: clamp(1.05rem, 1.8vw, 1.3rem); line-height: 1.4; color: var(--tinta); }
.llamada .botones { margin-top: .5rem; }
.llamada .antetitulo { justify-self: start; }

/* Pie: negro, tres columnas, rótulos en caqui */
.pie-web { background: var(--tinta); color: #fff; padding: 26px var(--g) 40px; font-size: 14px; line-height: 1.5; }
.pie-web a { color: #fff; text-decoration-color: #666; }
.pie-web a:hover { color: var(--caqui); }
.pie-web b { font: 600 13px var(--rotulo-f); letter-spacing: .14em; text-transform: uppercase; color: var(--caqui); display: block; margin-bottom: 6px; }
.pie-web ul { list-style: none; padding: 0; margin: 0; }
.pie-web li { margin: 0; }
.pie-web__rejilla { display: grid; grid-template-columns: 1fr; gap: 20px; }
.pie-web__legal { border-top: 1px solid #333; margin-top: 26px; padding-top: 14px; font-size: 12.5px; color: #aaa; display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; }
.pie-web__legal a { color: #aaa; }

/* Añadidos de plantilla: enlaces que envuelven imágenes y héroe de plano */
.fil a, .fil picture { display: block; height: 100%; }
.pan > a picture, .par .cv a, .par .cv picture { display: block; }
.plano-heroe img { background: #fff; border-bottom: 1px solid var(--linea); max-height: 80vh; object-fit: contain; }

/* ≥ 640 px */
@media (min-width: 640px) {
  .rejilla--2, .rejilla--3, .rejilla--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .galeria figure.ancha { grid-column: 1 / -1; }
  .galeria figure.ancha img { aspect-ratio: auto; }
  .datos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .formulario .fila { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
  .mosaico { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ≥ 761 px: rejillas del sistema A */
@media (min-width: 761px) {
  .lema { grid-template-columns: 1fr 1fr; }
  .lema p.s { align-self: end; justify-self: end; text-align: right; }
  .pan figcaption, .pan .cap { position: absolute; left: var(--g); bottom: 12px; }
  .par { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .par .cv { overflow: hidden; }
  .par .cv img { position: absolute; inset: 0; height: 100%; object-fit: cover; }
  .fil { grid-template-columns: 3fr 2fr; }
  .idx a { grid-template-columns: minmax(0, 3fr) minmax(0, 6fr) 110px 60px; }
  .idx .d, .idx .v { display: block; }
  .serv { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .serv > div { border-bottom: 0; }
  .serv > div:nth-child(2n) { border-right: 1px solid var(--linea); }
  .serv > div:last-child { border-right: 0; }
  .est { grid-template-columns: 1fr 2fr; }
  .pie-web__rejilla { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .llamada .contenedor { grid-template-columns: 1fr 2fr; align-items: start; }
  .llamada .antetitulo { grid-column: 1; }
  .llamada h2 { grid-column: 1; grid-row: 2; }
  .llamada p, .llamada .botones { grid-column: 2; }
  .llamada p { grid-row: 1 / span 2; margin: 0; }
  .llamada .botones { grid-row: 3; }
}

/* ≥ 960 px: escritorio */
@media (min-width: 960px) {
  body { padding-bottom: 0; }
  .barra-contacto { display: none; }
  .seccion { padding: 56px 0; }
  .cabecera__fila { min-height: 0; padding: 18px var(--g); align-items: baseline; }
  .menu-boton { display: none; }
  .nav, .nav.abierta { display: block; position: static; border: 0; background: none; max-height: none; overflow: visible; }
  .nav > ul { display: flex; align-items: baseline; gap: 22px; padding: 0; }
  .nav a { border: 0; padding: 0; font: 500 14px/1.2 var(--texto-f); text-transform: none; letter-spacing: 0; }
  .nav a:hover { color: var(--oliva); }
  .nav > ul > li > a[aria-current="page"] { box-shadow: inset 0 -3px var(--caqui); color: var(--tinta); }
  .nav__grupo { position: relative; }
  .nav__grupo > span { display: none; }
  .nav__desplegar { display: inline-flex; align-items: baseline; gap: .4rem; background: none; border: 0; padding: 0; font: 500 14px/1.2 var(--texto-f); color: var(--tinta); cursor: pointer; }
  .nav__desplegar::after { content: ""; width: .4rem; height: .4rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); }
  .nav__desplegar:hover { color: var(--oliva); }
  .nav .sub { display: none; position: absolute; top: 100%; left: -16px; min-width: 320px; background: #fff; border: 2px solid var(--tinta); padding: 6px 16px; margin-top: 12px; }
  .nav .sub::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
  .nav__grupo:hover .sub, .nav__grupo:focus-within .sub, .nav__grupo.abierto .sub { display: block; }
  .nav .sub a { padding: .6rem 0; border-bottom: 1px solid var(--linea); font-size: 14px; }
  .nav .sub li:last-child a { border: 0; }
  .nav .nav__tel { display: none; }
  .cabeza { padding: 40px 0 44px; }
  .rejilla--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rejilla--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .dos-col { grid-template-columns: 1fr 2fr; gap: 16px; align-items: start; }
  .dos-col--texto { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 48px; }
  .dos-col--foto { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 0 48px; align-items: start; }
  .dos-col--foto > .pan { grid-column: 1; grid-row: 1 / span 2; }
  .dos-col--foto > .articulo { grid-column: 2; grid-row: 1; }
  .dos-col--foto > .datos { grid-column: 2; grid-row: 2; margin-top: 24px; }
  .dos-col--foto > .pan figcaption { left: 0; }
  .pasos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 16px; border-top: 0; }
  .pasos li { border-top: 2px solid var(--tinta); border-bottom: 0; padding: 72px 0 24px; }
  .pasos li::before { top: 16px; }
  .galeria { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* con 2 o 4 imágenes, dos columnas: ninguna queda sola en su fila */
  .galeria:has(> figure:nth-child(2):last-child), .galeria:has(> figure:nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .visor__marco { inset: 4rem 5rem 5rem; }
  .visor__ant { left: 1rem; } .visor__sig { right: 1rem; }
}

@media print {
  .cabecera, .barra-contacto, .pie-web, .llamada, .visor { display: none !important; }
  body { padding: 0; }
  .seccion { border-top-width: 1px; }
}