/* ==========================================================================
   Enviar paquete a Dinamarca · hoja de estilo
   Paleta «Verde huerta y oro viejo» · Playfair Display + Source Sans 3
   Maqueta editorial: titular a todo el ancho, entradilla, ficha de datos,
   secciones numeradas, columnas de texto con capitular y fotos con pie.

   Regla de la casa: ningún selector entra en el cotizador. Las reglas base
   van envueltas en :where(:not(.w-cotizador *)) y el resto usa clases propias.
   Los @media de ajuste están todos al final del fichero.
   ========================================================================== */

:root {
  --papel: #F3F5EE;
  --superficie: #FFFFFF;
  --tinta: #17241C;
  --tinta-suave: #46564B;
  --verde: #2F5D3A;
  --verde-hondo: #234A2D;
  --verde-papel: #E2EADB;
  --oro: #C9A227;
  --oro-claro: #EBCF6E;
  --oro-tinta: #7A5E10;
  --oro-papel: #F6EDCC;
  --filete: #CDD5C6;
  --claro-sobre-verde: #DCE5D6;

  --t-titulo: "Playfair Display", Georgia, "Times New Roman", serif;
  --t-texto: "Source Sans 3", "Segoe UI", system-ui, -apple-system, sans-serif;

  --margen: clamp(1rem, 4vw, 3rem);
  --ancho: 87rem; /* 1392 px: el mismo en cabecera, héroe, cuerpo y pie */
  --radio: 3px;
  --cabecera-alto: 4.5rem;
  --curva: cubic-bezier(.2, .7, .2, 1);
  --flecha: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 8h10.5M9 4l4 4-4 4'/%3E%3C/svg%3E");
  --flecha-verde: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%232F5D3A' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 8h10.5M9 4l4 4-4 4'/%3E%3C/svg%3E");
  --flecha-blanca: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 8h10.5M9 4l4 4-4 4'/%3E%3C/svg%3E");
}

/* --------------------------------------------------------------------------
   1. Base
   -------------------------------------------------------------------------- */
*:where(:not(.w-cotizador *)),
*:where(:not(.w-cotizador *))::before,
*:where(:not(.w-cotizador *))::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: calc(var(--cabecera-alto) + 1rem);
}

body {
  margin: 0;
  background: var(--papel);
  color: var(--tinta);
  font-family: var(--t-texto);
  font-size: 1.0625rem;
  line-height: 1.62;
  font-kerning: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

:where(img, svg):where(:not(.w-cotizador *)) {
  display: block;
  max-width: 100%;
}

:where(img):where(:not(.w-cotizador *)) {
  height: auto;
}

:where(h1, h2, h3, h4):where(:not(.w-cotizador *)) {
  margin: 0;
  font-family: var(--t-titulo);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -.012em;
  color: inherit;
  hyphens: none;
  -webkit-hyphens: none;
  text-wrap: balance;
  overflow-wrap: normal;
}

:where(p, ul, ol, dl, dd, figure, blockquote):where(:not(.w-cotizador *)) {
  margin: 0;
}

:where(p):where(:not(.w-cotizador *)) {
  text-wrap: pretty;
}

:where(a):where(:not(.w-cotizador *)) {
  color: var(--verde);
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
  transition: color .2s, background-color .2s, text-decoration-color .2s;
}

:where(a:hover):where(:not(.w-cotizador *)) {
  color: var(--verde-hondo);
}

:where(a, summary, .menu-conmutador):where(:not(.w-cotizador *)):focus-visible {
  outline: 3px solid var(--oro);
  outline-offset: 3px;
  border-radius: 2px;
}

:where(strong):where(:not(.w-cotizador *)) {
  font-weight: 700;
}

.salto {
  position: absolute;
  left: 1rem;
  top: -4rem;
  z-index: 100;
  padding: .7rem 1.1rem;
  background: var(--tinta);
  color: var(--superficie);
  font-weight: 700;
  text-decoration: none;
  border-radius: var(--radio);
}

.salto:focus {
  top: 1rem;
  color: var(--superficie);
}

.contenedor {
  width: min(100% - 2 * var(--margen), var(--ancho));
  margin-inline: auto;
}

.icono {
  width: 1.5rem;
  height: 1.5rem;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Mapa de Dinamarca: un solo símbolo (#dk-mapa) y cada uso marca su región
   con las variables --r-cap, --r-sel, --r-mer, --r-cen y --r-sep */
.sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.mapa-dk {
  --dk-tierra: #CDD5C6;
  --dk-borde: var(--papel);
  --dk-marco: #8A9786;
  --dk-marca: var(--oro);
  width: 100%;
  height: auto;
  aspect-ratio: 290 / 336;
}

/* En región y ciudad, el mapa de la página resalta su región: lo lee del
   canonical (región) o de las migas (ciudad), sin JavaScript */
:root:has(link[rel="canonical"][href*="/region-capital/"]) .mapa-dk--lugar,
body:has(.w-migas a[href$="/region-capital/"]) .mapa-dk--lugar,
.region--cap .mapa-dk { --r-cap: var(--dk-marca); }

:root:has(link[rel="canonical"][href*="/selandia/"]) .mapa-dk--lugar,
body:has(.w-migas a[href$="/selandia/"]) .mapa-dk--lugar,
.region--sel .mapa-dk { --r-sel: var(--dk-marca); }

:root:has(link[rel="canonical"][href*="/dinamarca-meridional/"]) .mapa-dk--lugar,
body:has(.w-migas a[href$="/dinamarca-meridional/"]) .mapa-dk--lugar,
.region--mer .mapa-dk { --r-mer: var(--dk-marca); }

:root:has(link[rel="canonical"][href*="/jutlandia-central/"]) .mapa-dk--lugar,
body:has(.w-migas a[href$="/jutlandia-central/"]) .mapa-dk--lugar,
.region--cen .mapa-dk { --r-cen: var(--dk-marca); }

:root:has(link[rel="canonical"][href*="/jutlandia-septentrional/"]) .mapa-dk--lugar,
body:has(.w-migas a[href$="/jutlandia-septentrional/"]) .mapa-dk--lugar,
.region--sep .mapa-dk { --r-sep: var(--dk-marca); }

/* --------------------------------------------------------------------------
   2. Botones y llamadas
   -------------------------------------------------------------------------- */
.boton,
.w-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  min-height: 2.9rem;
  padding: .75rem 1.35rem;
  border: 1px solid transparent;
  border-radius: var(--radio);
  font-family: var(--t-texto);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: .01em;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: background-color .2s, color .2s, border-color .2s, transform .25s var(--curva), box-shadow .25s;
}

.boton::after,
.w-cta::after {
  content: "";
  width: 1rem;
  height: 1rem;
  flex: none;
  background: currentColor;
  -webkit-mask: var(--flecha) center / contain no-repeat;
  mask: var(--flecha) center / contain no-repeat;
  transition: transform .25s var(--curva);
}

.boton:hover,
.w-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px -16px rgba(23, 36, 28, .7);
}

.boton:hover::after,
.w-cta:hover::after {
  transform: translateX(3px);
}

.w-cta {
  background: var(--verde);
  color: var(--superficie);
}

.w-cta:hover {
  background: var(--verde-hondo);
  color: var(--superficie);
}

.boton--oro {
  background: var(--oro);
  color: var(--tinta);
}

.boton--oro:hover {
  background: var(--oro-claro);
  color: var(--tinta);
}

.boton--papel {
  background: var(--oro-papel);
  border-color: var(--oro);
  color: var(--tinta);
}

.boton--papel:hover {
  background: var(--oro);
  color: var(--tinta);
}

.w-cta-linea {
  margin: 1.75rem 0;
  column-span: all;
}

/* --------------------------------------------------------------------------
   3. Cabecera y menú
   -------------------------------------------------------------------------- */
.cabecera {
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--papel);
  background: color-mix(in srgb, var(--papel) 93%, transparent);
  -webkit-backdrop-filter: saturate(1.4) blur(10px);
  backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid var(--filete);
  transition: box-shadow .3s;
}

.cabecera--sombra {
  box-shadow: 0 10px 28px -22px rgba(23, 36, 28, .55);
}

.cabecera__barra {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: var(--cabecera-alto);
}

.marca {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  min-width: 0;
  color: var(--tinta);
  text-decoration: none;
}

.marca:hover {
  color: var(--tinta);
}

.marca__signo {
  width: 2.4rem;
  height: 2.4rem;
  flex: none;
  transition: transform .45s var(--curva);
}

.marca:hover .marca__signo {
  transform: rotate(-8deg);
}

.marca__nombre {
  font-family: var(--t-titulo);
  font-size: 1.08rem;
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -.01em;
}

.marca__nombre em {
  display: block;
  font-style: italic;
  font-weight: 500;
  color: var(--verde);
}

.menu-conmutador {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  height: 2.75rem;
  padding: 0 1rem;
  border: 1px solid var(--tinta);
  border-radius: 999px;
  background: transparent;
  color: var(--tinta);
  font-family: var(--t-texto);
  font-size: .95rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: background-color .2s, color .2s;
}

.menu-conmutador:hover {
  background: var(--tinta);
  color: var(--papel);
}

.menu-conmutador__icono {
  width: 1.15rem;
  height: .85rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
}

.menu-conmutador__icono path {
  transition: transform .3s var(--curva), opacity .2s;
}

.menu-conmutador__icono .l1 { transform-origin: 10px 2px; }
.menu-conmutador__icono .l3 { transform-origin: 10px 12px; }

.menu-conmutador[aria-expanded="true"] .l1 { transform: translateY(5px) rotate(45deg); }
.menu-conmutador[aria-expanded="true"] .l2 { opacity: 0; }
.menu-conmutador[aria-expanded="true"] .l3 { transform: translateY(-5px) rotate(-45deg); }

.menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  max-height: calc(100vh - var(--cabecera-alto));
  overflow-y: auto;
  padding: .5rem var(--margen) 1.75rem;
  background: var(--papel);
  border-bottom: 1px solid var(--filete);
  box-shadow: 0 24px 40px -30px rgba(23, 36, 28, .6);
}

.cabecera--abierta .menu {
  display: block;
}

.menu__lista {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.menu__enlace {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .95rem 0;
  border-bottom: 1px solid var(--filete);
  color: var(--tinta);
  font-family: var(--t-titulo);
  font-size: 1.35rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
}

.menu__enlace:hover {
  color: var(--verde);
}

.menu__accion {
  padding-top: 1.25rem;
}

.menu__accion .boton {
  width: 100%;
}

/* --------------------------------------------------------------------------
   4. Cabeza de página (héroe editorial)
   -------------------------------------------------------------------------- */
.cabeza-marco {
  padding-block: clamp(1.5rem, 4vw, 3.25rem) clamp(2.5rem, 6vw, 4.5rem);
  border-bottom: 1px solid var(--filete);
}

.cabeza {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

.cabeza__cinta { grid-area: cinta; min-width: 0; }
.cabeza__titulo { grid-area: titulo; min-width: 0; }
.cabeza__entrada { grid-area: entrada; min-width: 0; }
.cabeza__ficha { grid-area: ficha; min-width: 0; }
.cabeza__cotizar { grid-area: cotizar; min-width: 0; }
.cabeza__foto { grid-area: foto; min-width: 0; }

/* En móvil el cotizador (o su llamada) sube justo después de la entradilla */
.cabeza__cotizar { order: 1; }
.cabeza__ficha { order: 2; }
.cabeza__foto { order: 3; }

.cabeza__cotizar .w-cta-linea {
  margin: 0;
}

.cabeza__cinta:not(:has(*)),
.cabeza__ficha:not(:has(.w-datos)),
.cabeza__cotizar:not(:has(*)),
.cabeza__foto:not(:has(*)) {
  display: none;
}

.cabeza__titulo {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-top: 1.1rem;
  border-top: 5px double var(--tinta);
}

.cabeza h1 {
  font-size: clamp(2.15rem, .9rem + 5.4vw, 6rem);
  font-weight: 700;
  line-height: 1.03;
  letter-spacing: -.024em;
}

.cabeza h1 em {
  font-style: italic;
  font-weight: 500;
  color: var(--verde);
}

/* En móvil, una sola cinta sobre el H1: el antetítulo baja bajo el titular */
.cabeza__titulo:has(.w-migas) .w-antetitulo,
.cabeza:has(.cabeza__cinta .w-migas) .w-antetitulo {
  order: 2;
}

.ficha__rotulo {
  margin-bottom: .6rem;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tinta-suave);
}

/* Migas */
.w-migas {
  font-size: .92rem;
  line-height: 1.4;
  color: var(--tinta-suave);
}

.w-migas ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  row-gap: .25rem;
}

.w-migas li {
  display: inline-flex;
  align-items: baseline;
  min-width: 0;
}

.w-migas li + li::before {
  content: "";
  width: .4rem;
  height: .4rem;
  margin-inline: .65rem;
  border-top: 1.5px solid var(--oro-tinta);
  border-right: 1.5px solid var(--oro-tinta);
  transform: translateY(-.1em) rotate(45deg);
  flex: none;
}

.w-migas a {
  color: var(--tinta-suave);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}

.w-migas a:hover {
  color: var(--verde);
  border-bottom-color: currentColor;
}

.w-migas [aria-current] {
  color: var(--tinta);
  font-weight: 600;
}

/* Antetítulo */
.w-antetitulo {
  display: flex;
  align-items: center;
  gap: .8rem;
  font-family: var(--t-texto);
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-wrap: balance;
  color: var(--oro-tinta);
}

.w-antetitulo::before {
  content: "";
  width: 2.25rem;
  height: 2px;
  flex: none;
  background: var(--oro);
}

/* Entradilla */
.w-entradilla {
  max-width: 40rem;
}

.w-entradilla p {
  font-size: clamp(1.125rem, 1.02rem + .4vw, 1.25rem);
  line-height: 1.52;
  color: var(--tinta);
}

.w-entradilla p + p {
  margin-top: .8em;
}

.w-entradilla p:first-child::first-line {
  font-weight: 600;
}

/* Ficha de datos */
.w-datos {
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border-top: 2px solid var(--tinta);
}

.w-datos__fila {
  display: grid;
  grid-template-columns: minmax(6.5rem, 38%) minmax(0, 1fr);
  gap: .25rem 1rem;
  align-items: baseline;
  padding: .72rem 0;
  border-bottom: 1px solid var(--filete);
}

.w-datos dt {
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--tinta-suave);
}

.w-datos dd {
  margin: 0;
  font-family: var(--t-titulo);
  font-size: 1.08rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--tinta);
  hyphens: none;
  text-wrap: balance;
}

.w-datos dt {
  text-wrap: balance;
}

.w-datos dd a {
  color: var(--verde);
  text-decoration: none;
  border-bottom: 1px solid var(--oro);
}

/* Cotizador: solo su caja, nunca su interior */
.w-cotizador {
  width: 100%;
  max-width: 47.5rem;
  margin-inline: auto;
  padding-top: 1rem;
  border-top: 3px solid var(--oro);
  scroll-margin-top: calc(var(--cabecera-alto) + 1rem);
}

.w-cotizador__titulo,
.w-cotizador__rotulo {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin: 0 0 1rem;
  font-family: var(--t-texto);
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--oro-tinta);
}

.w-cotizador__titulo::before,
.w-cotizador__rotulo::before {
  content: "";
  width: .55rem;
  height: .55rem;
  flex: none;
  background: var(--oro);
  transform: rotate(45deg);
}

/* Foto con pie */
.w-foto {
  margin: 0;
}

.w-foto img {
  width: 100%;
  height: auto;
  object-fit: cover;
  background: var(--verde-papel);
}

.w-foto figcaption {
  display: flex;
  gap: .75rem;
  padding-top: .75rem;
  font-size: .92rem;
  line-height: 1.45;
  color: var(--tinta-suave);
}

.w-foto figcaption::before {
  content: "";
  width: 1.75rem;
  height: 2px;
  margin-top: .65em;
  flex: none;
  background: var(--oro);
}

.cabeza__foto .w-foto img {
  aspect-ratio: 16 / 10;
}

/* Sistema de cabeceras por tipo de página:
   país (portada) y servicio · papel con doble filete y cotizador a la derecha
   región · franja verde con el mapa de Dinamarca y su región en oro
   ciudad · franja verde claro con la foto a la derecha
   El mapa de cabecera solo sale en región; en las demás se queda fuera. */
.cabeza__mapa {
  grid-area: mapa;
  display: none;
  min-width: 0;
}

/* Variante región: la cabeza va en franja verde */
.pag-division .cabeza-marco {
  background: var(--verde);
  color: var(--superficie);
  border-bottom: 0;
}

.pag-division .cabeza-marco .cabeza__titulo {
  border-top-color: var(--oro-claro);
}

.pag-division .cabeza-marco :is(.w-migas, .w-migas a, .ficha__rotulo, .w-datos dt, .w-foto figcaption) {
  color: var(--claro-sobre-verde);
}

.pag-division .cabeza-marco .w-migas [aria-current] {
  color: var(--superficie);
}

.pag-division .cabeza-marco .w-migas li + li::before {
  border-color: var(--oro-claro);
}

.pag-division .cabeza-marco .w-antetitulo {
  color: var(--oro-claro);
}

.pag-division .cabeza-marco :is(h1, h1 em, .w-entradilla p, .w-datos dd) {
  color: var(--superficie);
}

.pag-division .cabeza-marco .w-datos dd a {
  color: var(--oro-claro);
}

.pag-division .cabeza-marco .w-datos {
  border-top-color: var(--oro-claro);
}

.pag-division .cabeza-marco .w-datos__fila {
  border-bottom-color: rgba(255, 255, 255, .22);
}

/* Región: titular, llamada y datos clave arriba; la entradilla baja a una
   franja de lectura en Source Sans 3 (dos columnas en escritorio) para que
   la ficha y el CTA queden por encima del pliegue */
.pag-division .cabeza h1 {
  font-size: clamp(2.15rem, .9rem + 4.2vw, 4.5rem);
}

.pag-division .cabeza__cotizar { order: 1; }
.pag-division .cabeza__ficha { order: 2; }
.pag-division .cabeza__entrada { order: 3; }

/* Región: la foto va en la cabecera, junto a la entradilla (escritorio) o
   tras ella (móvil), y el mapa sale también en móvil, pequeño, tras los datos */
.pag-division .cabeza__foto { order: 3; }

.pag-division .cabeza__foto .w-foto img {
  aspect-ratio: 3 / 2;
  border-radius: var(--radio);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .18);
}

.pag-division .cabeza__mapa {
  display: block;
  order: 2;
  align-self: flex-start;
  width: 7.5rem;
}

.pag-division .cabeza__mapa .mapa-dk {
  --dk-tierra: #4E7A58;
  --dk-borde: var(--verde);
  --dk-marco: #9DB8A2;
  --dk-marca: var(--oro-claro);
}

.pag-division .w-entradilla {
  max-width: 44rem;
  padding-top: 1.1rem;
  border-top: 1px solid rgba(255, 255, 255, .22);
}

.pag-division .w-entradilla p {
  font-family: var(--t-texto);
  font-size: clamp(1.125rem, 1.08rem + .2vw, 1.2rem);
  font-style: normal;
  line-height: 1.55;
}

.pag-division .cabeza-marco .w-cta {
  background: var(--oro);
  color: var(--tinta);
}

.pag-division .cabeza-marco .w-cta:hover {
  background: var(--oro-claro);
  color: var(--tinta);
}

.pag-division .cabeza-marco .w-datos__fila:first-child dd {
  font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.25rem);
  line-height: 1.1;
  color: var(--oro-claro);
}

/* Ciudad: franja verde claro y filete verde, para distinguirla de servicio y región */
.pag-ciudad .cabeza-marco {
  background: var(--verde-papel);
  border-bottom: 1px solid var(--filete);
}

.pag-ciudad .cabeza__titulo {
  border-top: 5px solid var(--verde);
}

/* Ciudad: ficha en celdas de dos columnas */
.pag-ciudad .w-datos {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1.5rem;
}

.pag-ciudad .w-datos__fila {
  grid-template-columns: minmax(0, 1fr);
  gap: .2rem;
  padding: .85rem 0;
}

.pag-ciudad .w-datos__fila:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

/* La ficha de datos cambia de recurso según el tipo de página:
   servicio · tabla con rótulos en versalitas (la base)
   portada · cifras: el valor en grande y el rótulo debajo, en frase
   región · franja horizontal con rótulos en cursiva
   ciudad · fichas blancas sueltas con filete verde
   contacto · tarjeta de atención */
.portada .w-datos {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1.5rem;
  border-top: 0;
}

.portada .w-datos__fila {
  display: flex;
  flex-direction: column;
  gap: .3rem;
  padding: .85rem 0 1rem;
  border-bottom: 0;
  border-top: 2px solid var(--oro);
}

.portada .w-datos dd {
  order: -1;
  font-size: clamp(1.15rem, 1rem + .5vw, 1.45rem);
  font-weight: 700;
  line-height: 1.15;
  color: var(--verde);
}

.portada .w-datos dd a {
  color: var(--verde);
}

.portada .w-datos dt {
  font-size: .92rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--tinta-suave);
}

.pag-division .cabeza-marco .w-datos dt {
  font-family: var(--t-titulo);
  font-size: .95rem;
  font-style: italic;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

.pag-ciudad .w-datos {
  row-gap: .75rem;
  column-gap: .75rem;
  border-top: 0;
}

.pag-ciudad .w-datos__fila,
.pag-ciudad .w-datos__fila:last-child {
  padding: .8rem 1rem .9rem;
  background: var(--superficie);
  border: 0;
  border-left: 3px solid var(--verde);
  border-radius: var(--radio);
}

.pag-ciudad .w-datos dt {
  font-size: .9rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

/* Contacto: la ficha es la tarjeta de atención y no lleva foto de relleno */
.pag-contacto .cabeza__foto {
  display: none;
}

.pag-contacto .cabeza__ficha {
  padding: 1.5rem clamp(1.25rem, 3vw, 2rem) 1rem;
  background: var(--superficie);
  border: 1px solid var(--filete);
  border-top: 4px solid var(--oro);
  border-radius: var(--radio);
}

.pag-contacto .w-datos {
  border-top: 0;
}

.pag-contacto .w-datos__fila:last-child {
  border-bottom: 0;
}

.pag-contacto .w-datos__fila:first-child dd {
  font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
  color: var(--verde);
}

/* --------------------------------------------------------------------------
   5. Cuerpo del documento: secciones numeradas, columnas y capitular
   -------------------------------------------------------------------------- */
.cuerpo {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "texto" "pausa" "hijas" "lateral";
  gap: clamp(2.5rem, 5vw, 4rem);
  padding-block: clamp(3rem, 7vw, 6rem) clamp(1rem, 3vw, 2rem);
  counter-reset: seccion;
}

.cuerpo__texto { grid-area: texto; min-width: 0; }
.cuerpo__hijas { grid-area: hijas; min-width: 0; }
.cuerpo__lateral { grid-area: lateral; min-width: 0; }

.cuerpo__texto:not(:has(> *)),
.cuerpo__hijas:not(:has(.w-hijas)),
.lateral__hermanas:not(:has(.w-hermanas)) {
  display: none;
}

/* Columna lateral: llamada a cotizar y destinos hermanos */
.cuerpo__lateral {
  display: grid;
  gap: 2rem;
  align-content: start;
}

.lateral__cotizar {
  display: grid;
  justify-items: start;
  gap: .9rem;
  padding: 1.5rem 1.5rem 1.35rem;
  background: var(--superficie);
  border: 1px solid var(--filete);
  border-top: 4px solid var(--oro);
  border-radius: var(--radio);
}

.lateral__rotulo {
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--oro-tinta);
}

.lateral__texto {
  font-family: var(--t-titulo);
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.35;
  color: var(--tinta);
}

.lateral__cotizar .boton {
  width: 100%;
}

.lateral__telefono {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-family: var(--t-titulo);
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--verde);
  text-decoration: none;
}

.lateral__telefono .icono {
  width: 1.15rem;
  height: 1.15rem;
  color: var(--oro-tinta);
}

.lateral__nota {
  margin-top: -.6rem;
  font-size: .92rem;
  color: var(--tinta-suave);
}

/* Pausa a mitad de página: mapa con la región resaltada, cita y cifras */
.cuerpo__pausa { grid-area: pausa; min-width: 0; }

.pag-contacto .cuerpo__pausa {
  display: none;
}

.pausa {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.75rem;
  align-items: center;
  padding: clamp(1.5rem, 4vw, 2.75rem);
  background: var(--oro-papel);
  border-top: 4px solid var(--oro);
  border-radius: var(--radio);
}

.pausa__mapa {
  --dk-tierra: #D5CDA8;
  --dk-borde: var(--oro-papel);
  --dk-marco: #A08A4A;
  --dk-marca: var(--verde);
  width: min(100%, 13rem);
  justify-self: center;
}

.pausa__rotulo {
  margin-bottom: .75rem;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--oro-tinta);
}

.pausa__cita {
  max-width: 30ch;
  font-family: var(--t-titulo);
  font-size: clamp(1.4rem, 1.1rem + 1.1vw, 2.05rem);
  font-style: italic;
  font-weight: 500;
  line-height: 1.25;
  text-wrap: balance;
  hyphens: none;
  color: var(--tinta);
}

.pausa__cifras {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
  padding-top: 1.1rem;
  border-top: 1px solid rgba(122, 94, 16, .28);
}

.pausa__cifras div {
  display: flex;
  flex-direction: column;
  gap: .3rem;
}

.pausa__cifras dd {
  order: -1;
  margin: 0;
  font-family: var(--t-titulo);
  font-size: clamp(2rem, 1.6rem + 1.4vw, 2.8rem);
  font-weight: 800;
  line-height: 1;
  color: var(--verde);
}

.pausa__cifras dt {
  font-size: .92rem;
  line-height: 1.35;
  color: var(--tinta);
  text-wrap: balance;
}

.w-seccion,
.cuerpo .w-faq {
  counter-increment: seccion;
  padding-bottom: clamp(2.5rem, 5vw, 4rem);
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
  border-bottom: 1px solid var(--filete);
}

.w-seccion:last-child,
.cuerpo .w-faq:last-child {
  border-bottom: 0;
  margin-bottom: 0;
}

.w-seccion > h2,
.cuerpo .w-faq > h2 {
  column-span: all;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
  margin-bottom: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--tinta);
  font-size: clamp(1.75rem, 1.2rem + 2.1vw, 3rem);
}

.w-seccion > h2::before,
.cuerpo .w-faq > h2::before {
  content: counter(seccion, decimal-leading-zero);
  min-width: 2.2ch;
  padding-top: .35em;
  font-size: .5em;
  font-style: italic;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0;
  color: var(--oro-tinta);
}

.w-seccion h3 {
  margin: 1.5em 0 .5em;
  font-size: clamp(1.2rem, 1.1rem + .4vw, 1.45rem);
  break-after: avoid;
}

.w-seccion p {
  margin-bottom: 1em;
}

.w-seccion p:last-child {
  margin-bottom: 0;
}

.w-seccion ul,
.w-seccion ol {
  margin: 0 0 1em;
  padding-left: 1.25rem;
}

.w-seccion li {
  margin-bottom: .35em;
}

.w-seccion li::marker {
  color: var(--oro-tinta);
}

.w-seccion a,
.w-faq__resp a,
.prosa a {
  color: var(--verde);
  text-decoration-color: var(--oro);
  text-decoration-thickness: 2px;
}

.w-seccion a:hover,
.w-faq__resp a:hover,
.prosa a:hover {
  background: var(--oro-papel);
  color: var(--verde-hondo);
}

.w-seccion .w-foto,
.w-seccion figure {
  column-span: all;
  margin-block: 1.75rem;
}

/* Capitular en la primera sección (no en Contacto: sus párrafos son cortos
   y la letra suelta se lee como texto roto) */
body:not(.pag-contacto) .cuerpo__texto > .w-seccion:first-child > h2 + p::first-letter,
.capitular::first-letter {
  float: left;
  margin: .07em .12em 0 0;
  font-family: var(--t-titulo);
  font-size: 4.4em;
  font-weight: 700;
  line-height: .8;
  color: var(--verde);
}

/* Tablas */
.w-tabla {
  column-span: all;
  max-width: 100%;
  margin: 1.75rem 0 2rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-top: 2px solid var(--tinta);
  background: var(--superficie);
}

.w-tabla table {
  width: 100%;
  border-collapse: collapse;
  font-size: .98rem;
  line-height: 1.4;
  font-variant-numeric: tabular-nums;
}

.w-tabla table:has(th:nth-child(4)) {
  min-width: 36rem;
}

.w-tabla th {
  padding: .8rem 1rem;
  background: var(--verde-papel);
  color: var(--tinta);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-align: left;
  text-transform: uppercase;
  vertical-align: bottom;
  border-bottom: 1px solid var(--tinta);
}

.w-tabla td {
  padding: .85rem 1rem;
  color: var(--tinta);
  vertical-align: top;
  border-bottom: 1px solid var(--filete);
}

.w-tabla td:first-child {
  font-weight: 700;
}

.w-tabla tbody tr {
  transition: background-color .2s;
}

.w-tabla tbody tr:hover {
  background: var(--oro-papel);
}

/* Preguntas frecuentes */
.w-faq__item {
  border-bottom: 1px solid var(--filete);
}

.w-faq > h2 + .w-faq__item,
.w-faq__lista > .w-faq__item:first-child {
  border-top: 2px solid var(--tinta);
}

.w-faq__item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  padding: 1.15rem 0;
  list-style: none;
  cursor: pointer;
  font-family: var(--t-titulo);
  font-size: clamp(1.1rem, 1rem + .4vw, 1.3rem);
  font-weight: 600;
  line-height: 1.3;
  color: var(--tinta);
  transition: color .2s;
}

.w-faq__item summary::-webkit-details-marker {
  display: none;
}

.w-faq__item summary::after {
  content: "";
  width: 1.9rem;
  height: 1.9rem;
  flex: none;
  border: 1px solid var(--verde);
  border-radius: 50%;
  background:
    linear-gradient(var(--verde), var(--verde)) center / .75rem 1.5px no-repeat,
    linear-gradient(var(--verde), var(--verde)) center / 1.5px .75rem no-repeat;
  transition: transform .3s var(--curva), background-color .2s;
}

.w-faq__item summary:hover {
  color: var(--verde);
}

.w-faq__item[open] summary::after {
  transform: rotate(45deg);
  background-color: var(--oro);
  border-color: var(--oro);
}

.w-faq__resp {
  max-width: 64ch;
  padding: 0 0 1.4rem;
  color: var(--tinta);
}

.w-faq__resp p + p {
  margin-top: .8em;
}

/* --------------------------------------------------------------------------
   6. Piezas finales: hijas, hermanas y cierre
   -------------------------------------------------------------------------- */
.cuerpo__hijas {
  padding: clamp(1.5rem, 4vw, 2.75rem);
  background: var(--superficie);
  border: 1px solid var(--filete);
  border-radius: var(--radio);
}

.w-hijas__titulo,
.w-hermanas__titulo {
  display: flex;
  align-items: center;
  gap: .9rem;
  margin-bottom: 1.5rem;
  font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem);
}

.w-hijas__titulo::before,
.w-hermanas__titulo::before {
  content: "";
  width: .7rem;
  height: .7rem;
  flex: none;
  background: var(--oro);
  transform: rotate(45deg);
}

.w-hijas__rejilla {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
  column-gap: 2.5rem;
  counter-reset: hija;
  border-bottom: 1px solid var(--filete);
}

.w-tarjeta {
  counter-increment: hija;
  display: grid;
  grid-template-columns: 2.1rem minmax(0, 1fr) auto;
  grid-template-areas:
    "num nombre flecha"
    "num texto flecha";
  column-gap: .9rem;
  align-content: start;
  padding: 1.05rem 0;
  border-top: 1px solid var(--filete);
  color: var(--tinta);
  text-decoration: none;
}

.w-tarjeta::before {
  content: counter(hija, decimal-leading-zero);
  grid-area: num;
  padding-top: .2rem;
  font-family: var(--t-titulo);
  font-size: .95rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.2;
  color: var(--oro-tinta);
}

.w-tarjeta::after {
  content: "";
  grid-area: flecha;
  align-self: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--filete);
  border-radius: 50%;
  background: transparent var(--flecha-verde) center / .9rem no-repeat;
  transition: background-color .2s, border-color .2s, transform .3s var(--curva);
}

.w-tarjeta__nombre {
  grid-area: nombre;
  font-family: var(--t-titulo);
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.22;
  transition: color .2s;
}

.w-tarjeta__texto {
  grid-area: texto;
  margin-top: .25rem;
  font-size: .97rem;
  line-height: 1.45;
  color: var(--tinta-suave);
}

.w-tarjeta:hover {
  color: var(--tinta);
}

.w-tarjeta:hover .w-tarjeta__nombre {
  color: var(--verde);
}

.w-tarjeta:hover::after {
  border-color: var(--verde);
  background: var(--verde) var(--flecha-blanca) center / .9rem no-repeat;
  transform: translateX(3px);
}

.w-hermanas__titulo {
  margin-bottom: 1rem;
  font-size: clamp(1.2rem, 1.1rem + .4vw, 1.4rem);
}

/* Hermanas: índice numerado en Playfair, una columna de lectura (dos solo
   cuando hay sitio y muchas hermanas) */
.w-hermanas__enlaces {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  column-gap: 1.75rem;
  counter-reset: hermana;
  border-top: 2px solid var(--tinta);
}

.w-hermanas__enlaces a {
  counter-increment: hermana;
  display: flex;
  align-items: baseline;
  gap: .85rem;
  min-width: 0;
  padding: .8rem 0;
  border-bottom: 1px solid var(--filete);
  color: var(--tinta);
  font-family: var(--t-titulo);
  font-size: 1.12rem;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
  transition: color .2s, padding-left .25s var(--curva);
}

.w-hermanas__enlaces a::before {
  content: counter(hermana, decimal-leading-zero);
  min-width: 1.6rem;
  flex: none;
  font-size: .85rem;
  font-style: italic;
  font-weight: 500;
  color: var(--oro-tinta);
}

.w-hermanas__enlaces a:hover {
  color: var(--verde);
  padding-left: .3rem;
}

/* Muchas hermanas: el índice va en su propia caja con scroll */
.w-hermanas__enlaces:has(> a:nth-child(13)) {
  max-height: 22rem;
  overflow-y: auto;
  overscroll-behavior: contain;
  border-bottom: 2px solid var(--tinta);
}

.pieza--cierre {
  padding-block: clamp(2.5rem, 6vw, 5rem);
}

.remate {
  display: grid;
  gap: 1.75rem;
  padding: clamp(1.75rem, 5vw, 3.5rem);
  background: var(--verde);
  color: var(--superficie);
  border-radius: 6px;
  box-shadow: inset 0 5px 0 var(--oro);
}

.w-cierre p,
.remate__texto {
  max-width: 36ch;
  font-family: var(--t-titulo);
  font-size: clamp(1.35rem, 1.05rem + 1.2vw, 2rem);
  font-weight: 500;
  line-height: 1.28;
  text-wrap: balance;
}

.w-cierre p + p {
  margin-top: .6em;
}

.remate :is(.w-cierre p, .remate__texto, h2) {
  color: var(--superficie);
}

.remate a:not(.boton) {
  color: var(--oro-claro);
  text-decoration-color: currentColor;
}

.remate a:not(.boton):hover {
  color: var(--superficie);
}

.remate__acciones {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .9rem 1.5rem;
}

.remate__telefono {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-weight: 700;
  text-decoration: none;
}

.remate__telefono .icono {
  width: 1.2rem;
  height: 1.2rem;
}

/* --------------------------------------------------------------------------
   7. Pie
   -------------------------------------------------------------------------- */
.pie {
  padding-block: clamp(3rem, 6vw, 4.5rem) 2rem;
  background: var(--tinta);
  color: #C9D3C5;
  font-size: .97rem;
}

.pie__rejilla {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 2.25rem;
  padding-bottom: 2.5rem;
}

.pie .marca,
.pie .marca:hover {
  color: var(--superficie);
}

.pie .marca__nombre em {
  color: var(--oro-claro);
}

.pie__lema {
  max-width: 34ch;
  margin-top: 1rem;
  line-height: 1.55;
}

.pie__titulo {
  margin-bottom: .8rem;
  font-family: var(--t-titulo);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--superficie);
}

.pie__lista {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}

.pie a {
  color: #E3EADD;
  text-decoration: none;
}

.pie a:hover {
  color: var(--oro);
  text-decoration: underline;
}

.pie__telefono {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-family: var(--t-titulo);
  font-size: 1.2rem;
  font-weight: 700;
}

.pie__telefono .icono {
  width: 1.2rem;
  height: 1.2rem;
  color: var(--oro);
}

.pie__legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255, 255, 255, .16);
  font-size: .9rem;
}

.pie__legal ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .4rem 1.25rem;
}

/* --------------------------------------------------------------------------
   8. Recorrido del cotizador (_plantilla.html)
   -------------------------------------------------------------------------- */
.recorrido {
  padding-block: clamp(1.75rem, 4vw, 3rem) clamp(3rem, 7vw, 5.5rem);
}

.recorrido__marco {
  width: min(100% - 2 * var(--margen), 51.25rem);
  margin-inline: auto;
}

.recorrido__rotulo {
  display: flex;
  align-items: center;
  gap: .8rem;
  margin: 1.25rem 0 1.75rem;
  padding-top: 1rem;
  border-top: 5px double var(--tinta);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--oro-tinta);
}

.recorrido__rotulo::before {
  content: "";
  width: 2.25rem;
  height: 2px;
  flex: none;
  background: var(--oro);
}

.recorrido .w-cotizador {
  max-width: none;
  padding-top: 0;
  border-top: 0;
}

/* --------------------------------------------------------------------------
   9. Portada
   -------------------------------------------------------------------------- */
.p-seccion {
  padding-block: clamp(3.5rem, 8vw, 7rem);
  scroll-margin-top: var(--cabecera-alto);
}

.p-seccion__cabeza {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem 1.25rem;
  align-items: start;
  margin-bottom: clamp(1.75rem, 4vw, 3rem);
  padding-top: 1rem;
  border-top: 1px solid var(--tinta);
}

.p-num {
  min-width: 2.2ch;
  padding-top: .5em;
  font-family: var(--t-titulo);
  font-size: clamp(1.05rem, .95rem + .6vw, 1.5rem);
  font-style: italic;
  font-weight: 500;
  line-height: 1;
  color: var(--oro-tinta);
}

.p-seccion__cabeza h2 {
  max-width: 24ch;
  font-size: clamp(1.85rem, 1.2rem + 2.6vw, 3.4rem);
  line-height: 1.08;
}

.p-seccion--filete {
  border-top: 1px solid var(--filete);
}

.p-faq {
  padding-top: 0;
}

.p-cierre {
  padding-top: 0;
}

.remate__titulo {
  margin-bottom: .9rem;
  font-size: clamp(1.6rem, 1.15rem + 1.8vw, 2.6rem);
  line-height: 1.1;
  color: var(--superficie);
}

.prosa p + p {
  margin-top: 1em;
}

.dos-columnas {
  column-gap: 3.5rem;
  column-rule: 1px solid var(--filete);
}

/* Pasos */
.pasos {
  list-style: none;
  margin: clamp(2.25rem, 5vw, 3.5rem) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border-top: 2px solid var(--tinta);
}

.paso {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .3rem 1.1rem;
  padding: 1.35rem 0;
  border-bottom: 1px solid var(--filete);
}

.paso__icono {
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 3.1rem;
  height: 3.1rem;
  border-radius: 50%;
  background: var(--verde-papel);
  color: var(--verde);
  transition: background-color .25s, color .25s, transform .35s var(--curva);
}

.paso:hover .paso__icono {
  background: var(--oro);
  color: var(--tinta);
  transform: rotate(-6deg);
}

.paso__titulo {
  font-size: 1.22rem;
  line-height: 1.25;
}

.paso__num {
  margin-right: .45rem;
  font-style: italic;
  font-weight: 500;
  color: var(--oro-tinta);
}

.paso p {
  font-size: 1rem;
  line-height: 1.5;
  color: var(--tinta-suave);
}

/* Límites */
.limites {
  display: grid;
  gap: 2.5rem;
}

.limites .w-tabla {
  margin-bottom: 1.25rem;
}

.cifras {
  padding: 1.5rem 1.75rem;
  background: var(--oro-papel);
  border-top: 4px solid var(--oro);
}

.cifras__rotulo {
  margin-bottom: .5rem;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--oro-tinta);
}

.cifra {
  display: grid;
  grid-template-columns: minmax(6.5rem, auto) minmax(0, 1fr);
  align-items: baseline;
  gap: 1.1rem;
  padding: 1rem 0;
  border-bottom: 1px solid rgba(122, 94, 16, .28);
}

.cifra:last-of-type {
  border-bottom: 0;
}

.cifra dd {
  order: -1;
  margin: 0;
  font-family: var(--t-titulo);
  font-size: clamp(2.6rem, 2rem + 2vw, 3.75rem);
  font-weight: 800;
  line-height: .9;
  color: var(--verde);
  font-variant-numeric: lining-nums;
}

.cifra__unidad {
  margin-left: .12em;
  font-size: .42em;
  font-weight: 600;
}

.cifra dt {
  font-weight: 600;
  line-height: 1.35;
  color: var(--tinta);
}

.cifras__nota {
  margin-top: .75rem;
  padding-top: .9rem;
  border-top: 1px solid rgba(122, 94, 16, .28);
  font-size: .97rem;
  line-height: 1.5;
  color: var(--tinta-suave);
}

.cifras__boton {
  margin-top: 1rem;
  background: var(--superficie);
}

/* Cita */
.destacado {
  padding-block: clamp(1.75rem, 3.5vw, 2.75rem);
  background: var(--superficie);
  border-block: 1px solid var(--filete);
}

.destacado__signo {
  width: 2.25rem;
  height: 2.25rem;
  margin: 0 auto .9rem;
}

.destacado__texto {
  max-width: 38ch;
  margin-inline: auto;
  font-family: var(--t-titulo);
  font-size: clamp(1.55rem, 1.05rem + 2.2vw, 2.9rem);
  font-style: italic;
  font-weight: 500;
  line-height: 1.24;
  text-align: center;
  text-wrap: balance;
  hyphens: none;
}

.destacado__texto strong {
  font-style: normal;
  font-weight: 700;
  color: var(--verde);
}

/* Precio */
.precio {
  display: grid;
  gap: 2.5rem;
  align-items: start;
}

.precio .w-foto img {
  aspect-ratio: 4 / 3;
}

.factores {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  column-gap: 2rem;
  border-top: 2px solid var(--tinta);
}

.factor {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .2rem .9rem;
  padding: 1.1rem 0;
  border-bottom: 1px solid var(--filete);
}

.factor .icono {
  grid-row: span 2;
  width: 1.9rem;
  height: 1.9rem;
  color: var(--oro-tinta);
}

.factor dt {
  font-family: var(--t-titulo);
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.25;
}

.factor dd {
  margin: 0;
  font-size: .98rem;
  line-height: 1.5;
  color: var(--tinta-suave);
}

.consejo {
  margin-top: 1.75rem;
  padding: .2rem 0 .2rem 1.1rem;
  border-left: 3px solid var(--oro);
  font-size: 1.02rem;
}

/* Bandas de foto a todo ancho */
.banda-foto {
  margin: 0;
}

.banda-foto img {
  width: 100%;
  height: clamp(15rem, 45vw, 40rem);
  object-fit: cover;
}

.banda-foto figcaption {
  width: min(100% - 2 * var(--margen), var(--ancho));
  margin-inline: auto;
}

/* Índice de destinos */
.destinos {
  background: var(--superficie);
  border-block: 1px solid var(--filete);
}

.destinos .prosa {
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

/* Tarjetas editoriales por región: mapa con la región en oro, código y
   capital, nombre grande, una frase y las ciudades en texto corrido */
.regiones {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
}

.region {
  display: grid;
  grid-template-columns: 5.5rem minmax(0, 1fr);
  gap: 1.1rem;
  align-items: start;
  padding: 1.25rem 1.15rem 1.35rem;
  background: var(--papel);
  border: 1px solid var(--filete);
  border-top: 4px solid var(--verde);
  border-radius: var(--radio);
  transition: border-color .25s, box-shadow .3s;
}

.region:hover {
  border-top-color: var(--oro);
  box-shadow: 0 18px 34px -28px rgba(23, 36, 28, .65);
}

.region__mapa {
  --dk-borde: var(--papel);
  --dk-marca: var(--verde);
}

.region:hover .region__mapa {
  --dk-marca: var(--oro);
}

.region__codigo {
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--oro-tinta);
}

.region__nombre {
  margin: .35rem 0 .55rem;
  font-size: clamp(1.45rem, 1.2rem + 1vw, 2.1rem);
  line-height: 1.08;
}

.region__nombre a {
  color: var(--tinta);
  text-decoration: none;
  background: linear-gradient(var(--oro), var(--oro)) 0 100% / 0 2px no-repeat;
  transition: background-size .35s var(--curva), color .2s;
}

.region__nombre a:hover {
  color: var(--verde);
  background-size: 100% 2px;
}

.region__frase {
  font-size: 1rem;
  line-height: 1.5;
  color: var(--tinta-suave);
}

.region__ciudades {
  margin-top: .9rem;
  padding-top: .75rem;
  border-top: 1px solid var(--filete);
  font-size: .98rem;
  line-height: 1.7;
  color: var(--tinta-suave);
}

.region__rotulo {
  margin-bottom: .35rem;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--tinta-suave);
}

/* Ciudades de cada región: índice en columnas ordenadas, no texto corrido */
.region__ciudades ul {
  list-style: none;
  margin: 0;
  padding: 0;
  columns: 2 8rem;
  column-gap: 1.25rem;
}

.region__ciudades li {
  break-inside: avoid;
}

.region__ciudades a {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .2rem 0;
  color: var(--verde);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.region__ciudades a::before {
  content: "";
  width: .9rem;
  height: .9rem;
  flex: none;
  background: var(--oro-tinta);
  -webkit-mask: var(--flecha) center / contain no-repeat;
  mask: var(--flecha) center / contain no-repeat;
  transition: transform .25s var(--curva);
}

.region__ciudades a:hover {
  color: var(--verde-hondo);
  text-decoration: underline;
  text-decoration-color: var(--oro);
}

.region__ciudades a:hover::before {
  transform: translateX(2px);
}

/* Seguro */
.bloque-verde {
  display: grid;
  gap: 2rem;
  padding: clamp(1.75rem, 5vw, 4rem);
  background: var(--verde);
  color: var(--superficie);
  border-radius: 6px;
  box-shadow: inset 0 5px 0 var(--oro);
}

.bloque-verde .p-seccion__cabeza {
  margin-bottom: 1.5rem;
  border-top-color: rgba(255, 255, 255, .45);
}

.bloque-verde .p-num {
  color: var(--oro-claro);
}

.bloque-verde p {
  color: #EEF2EA;
}

.bloque-verde a {
  color: var(--oro-claro);
}

.bloque-verde a:hover {
  color: var(--superficie);
}

.garantias {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  border-top: 1px solid rgba(255, 255, 255, .3);
}

.garantia {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .2rem 1rem;
  padding: 1.2rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, .2);
}

.garantia .icono {
  grid-row: span 2;
  width: 1.9rem;
  height: 1.9rem;
  color: var(--oro-claro);
}

.garantia strong {
  font-family: var(--t-titulo);
  font-size: 1.2rem;
  color: var(--superficie);
}

.garantia span {
  color: var(--claro-sobre-verde);
  line-height: 1.5;
}

.no-viaja {
  display: flex;
  gap: .8rem;
  margin-top: 1.5rem;
  font-weight: 600;
}

.no-viaja .icono {
  width: 1.4rem;
  height: 1.4rem;
  color: var(--oro-claro);
}

/* Preguntas de portada */
.p-faq__cuerpo {
  display: grid;
  gap: 2rem;
}

/* Columna izquierda de las FAQ: foto con la tarjeta de atención encima */
.p-faq__aparte {
  display: grid;
  align-content: start;
  background: var(--verde);
  color: var(--superficie);
  border-radius: 6px;
  overflow: hidden;
  box-shadow: inset 0 -5px 0 var(--oro);
}

.p-faq__aparte .w-foto img {
  aspect-ratio: 3 / 2;
}

.p-faq__atencion {
  display: grid;
  justify-items: start;
  gap: .7rem;
  padding: 1.5rem 1.5rem 1.85rem;
}

.p-faq__rotulo {
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--oro-claro);
}

.p-faq__texto {
  font-size: 1.05rem;
  line-height: 1.5;
  color: #EEF2EA;
}

.p-faq__telefono {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  font-family: var(--t-titulo);
  font-size: clamp(1.5rem, 1.2rem + 1vw, 1.9rem);
  font-weight: 700;
  line-height: 1.1;
  text-decoration: none;
}

.p-faq__aparte .p-faq__telefono,
.p-faq__aparte .p-faq__telefono:hover {
  color: var(--superficie);
}

.p-faq__telefono .icono {
  width: 1.4rem;
  height: 1.4rem;
  color: var(--oro-claro);
}

.p-faq__aparte .boton {
  margin-top: .4rem;
}

/* --------------------------------------------------------------------------
   10. Ajustes por tamaño (siempre al final)
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

@media (prefers-reduced-motion: reduce) {
  *:where(:not(.w-cotizador *)),
  *:where(:not(.w-cotizador *))::before,
  *:where(:not(.w-cotizador *))::after {
    transition: none !important;
  }
}

@media (min-width: 40rem) {
  .factores {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cabeza__foto .w-foto img {
    aspect-ratio: 16 / 8;
  }

  .w-hermanas__enlaces:has(> a:nth-child(9)) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .regiones {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
  }

  .region:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }

  .region {
    grid-template-columns: 6.5rem minmax(0, 1fr);
    padding: 1.5rem 1.5rem 1.6rem;
  }
}

@media (min-width: 48rem) {
  .marca__nombre {
    font-size: 1.15rem;
  }

  .cabeza {
    display: grid;
    column-gap: 3rem;
    row-gap: 2rem;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
    grid-template-areas:
      "cinta cinta"
      "titulo titulo"
      "entrada ficha"
      "cotizar cotizar"
      "foto foto";
  }

  /* Sin widget, el hueco del cotizador trae una llamada: va bajo la entradilla.
     Toda área usada tiene que estar en la plantilla (si no, la rejilla crea
     columnas implícitas y el contenido se queda encajonado a la izquierda). */
  .cabeza:not(:has(.w-cotizador)) {
    grid-template-rows: auto auto auto 1fr auto;
    grid-template-areas:
      "cinta cinta"
      "titulo titulo"
      "entrada ficha"
      "cotizar ficha"
      "foto foto";
  }

  .cabeza__cotizar:has(.w-cta-linea) {
    align-self: start;
  }

  .portada .cabeza {
    grid-template-rows: none;
    grid-template-areas:
      "titulo titulo"
      "entrada ficha"
      "cotizar cotizar";
  }

  .cabeza:not(:has(.w-datos)) :is(.cabeza__entrada, .cabeza__cotizar) {
    grid-column: 1 / -1;
  }
  .cabeza__titulo:has(.w-migas) .w-antetitulo,
  .cabeza:has(.cabeza__cinta .w-migas) .w-antetitulo {
    order: 0;
  }

  /* Lateral en tablet: llamada y hermanas lado a lado */
  .cuerpo__lateral:has(.w-hermanas) {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    align-items: start;
  }

  /* Región en tablet: mapa pequeño junto al titular; ficha, entradilla y
     banda de foto a todo el ancho */
  .pag-division .cabeza,
  .pag-division .cabeza:not(:has(.w-cotizador)) {
    grid-template-columns: minmax(0, 1fr) 9rem;
    grid-template-rows: none;
    grid-template-areas:
      "cinta cinta"
      "titulo mapa"
      "cotizar mapa"
      "ficha ficha"
      "entrada entrada"
      "foto foto";
  }

  .pag-division .cabeza__mapa {
    width: 100%;
    align-self: center;
  }

  .pag-division .cabeza__foto .w-foto img {
    aspect-ratio: 21 / 9;
  }

  .pausa {
    grid-template-columns: 10rem minmax(0, 1fr);
    gap: 2.25rem;
  }

  .pausa__mapa {
    width: 100%;
  }

  .pasos {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 2.5rem;
  }

  .pie__rejilla {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 56rem) {
  .dos-columnas {
    columns: 2;
  }

  .remate {
    grid-template-columns: minmax(0, 1.5fr) auto;
    align-items: end;
  }

  .remate:not(:has(.w-cierre, .remate__texto)) {
    grid-template-columns: minmax(0, 1fr);
  }

  .remate__acciones {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (min-width: 64rem) {
  .cuerpo .w-seccion {
    columns: 2;
    column-gap: 3.5rem;
    column-rule: 1px solid var(--filete);
  }

  /* Regiones de la portada: las dos más grandes arriba, las otras tres debajo */
  .regiones {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .region {
    grid-column: span 2;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
  }

  .region:nth-child(-n + 2) {
    grid-column: span 3;
    grid-template-columns: 8.5rem minmax(0, 1fr);
    column-gap: 1.75rem;
    padding: 1.9rem 2rem 2rem;
  }

  .region:last-child:nth-child(odd) {
    grid-column: span 2;
  }

  .region:nth-child(n + 3) .region__mapa {
    width: 6rem;
  }

  .region:nth-child(-n + 2) .region__nombre {
    font-size: clamp(1.9rem, 1.3rem + 1.4vw, 2.6rem);
  }

  /* Ciudad: titular a todo el ancho, foto a la derecha de entradilla y ficha */
  .pag-ciudad .cabeza:not(:has(.w-cotizador)):has(.w-foto) {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto auto auto auto 1fr;
    grid-template-areas:
      "cinta cinta"
      "titulo titulo"
      "entrada foto"
      "cotizar foto"
      "ficha foto";
  }

  .pag-ciudad .cabeza:has(.w-foto) .cabeza__foto .w-foto img {
    aspect-ratio: 4 / 3;
  }

  /* Región: titular y llamada a la izquierda, mapa a la derecha, ficha en
     franja y, debajo, la entradilla en una columna de lectura (~70
     caracteres) frente a la foto de la región */
  .pag-division .cabeza,
  .pag-division .cabeza:not(:has(.w-cotizador)) {
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
    grid-template-rows: auto auto 1fr auto auto;
    column-gap: 4rem;
    grid-template-areas:
      "cinta cinta"
      "titulo mapa"
      "cotizar mapa"
      "ficha ficha"
      "entrada foto";
  }

  .pag-division .cabeza:not(:has(.w-foto)),
  .pag-division .cabeza:not(:has(.w-cotizador)):not(:has(.w-foto)) {
    grid-template-areas:
      "cinta cinta"
      "titulo mapa"
      "cotizar mapa"
      "ficha ficha"
      "entrada entrada";
  }

  .pag-division .cabeza__mapa {
    align-self: center;
    justify-self: center;
    width: min(100%, 17rem);
  }

  .pag-division .cabeza__cotizar,
  .pag-division .cabeza__entrada,
  .pag-division .cabeza__foto {
    align-self: start;
  }

  .pag-division .cabeza__foto .w-foto img {
    aspect-ratio: 3 / 2;
  }

  .pag-division .cabeza-marco .w-datos {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    border-bottom: 1px solid rgba(255, 255, 255, .22);
  }

  .pag-division .cabeza-marco .w-datos__fila {
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    gap: .35rem;
    padding: 1rem 1.25rem 1.1rem;
    border-bottom: 0;
    border-left: 1px solid rgba(255, 255, 255, .22);
  }

  .pag-division .cabeza-marco .w-datos__fila:first-child {
    padding-left: 0;
    border-left: 0;
  }

  /* Valores de la fila: más pequeños y equilibrados para que no queden
     palabras o números sueltos en una línea */
  .pag-division .cabeza-marco .w-datos__fila:not(:first-child) dd {
    font-size: 1rem;
    line-height: 1.32;
  }

  /* Contacto: titular a todo el ancho; debajo, entradilla y llamada frente a
     la tarjeta de atención, que se estira hasta el final de la columna
     izquierda para que las dos acaben a la par (sin hueco bajo la tarjeta) */
  .pag-contacto .cabeza,
  .pag-contacto .cabeza:not(:has(.w-cotizador)) {
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
    grid-template-rows: auto auto auto 1fr;
    column-gap: 4rem;
    grid-template-areas:
      "cinta cinta"
      "titulo titulo"
      "entrada ficha"
      "cotizar ficha";
  }

  .pag-contacto .cabeza__ficha {
    align-self: stretch;
    display: flex;
    flex-direction: column;
  }

  .pag-contacto .cabeza__ficha .w-datos {
    flex: 1;
    align-content: space-between;
  }

  /* Contacto: una sola columna de lectura, apartados en filas con su
     número y el título en una línea */
  .pag-contacto .cuerpo .w-seccion {
    columns: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    max-width: 46rem;
    margin-bottom: 2rem;
    padding-bottom: 2rem;
  }

  .pag-contacto .w-seccion > h2 {
    font-size: clamp(1.4rem, 1.15rem + .7vw, 1.75rem);
    margin-bottom: 1rem;
  }

  .pasos {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 0;
  }

  .paso {
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    gap: .75rem;
    padding: 1.6rem 1.6rem 1.6rem 0;
    border-bottom: 0;
  }

  .paso + .paso {
    padding-left: 1.6rem;
    border-left: 1px solid var(--filete);
  }

  .paso__icono {
    grid-row: auto;
    margin-bottom: .4rem;
  }

  .limites {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
    gap: 3.5rem;
    align-items: start;
  }

  .precio {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    gap: 4rem;
  }

  .precio .w-foto img {
    aspect-ratio: 4 / 5;
  }

  .bloque-verde {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    column-gap: 4rem;
    align-items: start;
  }

  .bloque-verde .p-seccion__cabeza {
    grid-column: 1 / -1;
  }

  .p-faq__cuerpo {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.9fr);
    gap: 4rem;
    align-items: start;
  }

  .p-faq__aparte {
    position: sticky;
    top: calc(var(--cabecera-alto) + 2rem);
  }

  .pie__rejilla {
    grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
    gap: 3rem;
  }
}

@media (min-width: 66rem) {
  .menu-conmutador {
    display: none;
  }

  .menu {
    display: block;
    position: static;
    max-height: none;
    overflow: visible;
    padding: 0;
    background: none;
    border: 0;
    box-shadow: none;
  }

  .menu__lista {
    flex-direction: row;
    align-items: center;
    gap: 1.6rem;
  }

  .menu__enlace {
    padding: .4rem 0;
    border-bottom: 0;
    font-size: 1.02rem;
  }

  .menu__enlace::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: var(--oro);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .3s var(--curva);
  }

  .menu__enlace:hover::after {
    transform: scaleX(1);
  }

  .menu__accion {
    padding-top: 0;
    margin-left: .4rem;
  }

  .menu__accion .boton {
    width: auto;
    min-height: 2.6rem;
    padding: .6rem 1.1rem;
    font-size: .95rem;
  }
}

@media (min-width: 75rem) {
  /* Servicio y portada: cotizador en su caja a la derecha del primer bloque */
  .cabeza:has(.w-cotizador) {
    grid-template-columns: minmax(0, 1fr) minmax(37.5rem, 1.35fr);
    grid-template-rows: auto auto auto 1fr auto;
    column-gap: 3.5rem;
    grid-template-areas:
      "cinta cinta"
      "titulo titulo"
      "entrada cotizar"
      "ficha cotizar"
      "foto foto";
  }

  .cabeza:has(.w-cotizador) .cabeza__entrada,
  .cabeza:has(.w-cotizador) .cabeza__ficha {
    grid-column: 1;
    align-self: start;
  }

  .cabeza:has(.w-cotizador) .cabeza__foto .w-foto img {
    aspect-ratio: 21 / 8;
  }

  .portada .cabeza {
    grid-template-areas:
      "titulo titulo"
      "entrada cotizar"
      "ficha cotizar";
    grid-template-rows: auto auto 1fr;
  }

  /* Rejilla editorial de las interiores: texto e hijas a la izquierda,
     columna lateral real (llamada y hermanas) a la derecha, en los 1392 px */
  .cuerpo {
    grid-template-columns: minmax(0, 1fr) 20rem;
    grid-template-rows: auto auto 1fr;
    grid-template-areas:
      "texto lateral"
      "pausa lateral"
      "hijas lateral";
    column-gap: 4.5rem;
  }

  .cuerpo:not(:has(.w-hijas)) {
    grid-template-rows: auto 1fr;
    grid-template-areas:
      "texto lateral"
      "pausa lateral";
  }

  .pag-contacto .cuerpo {
    grid-template-rows: auto;
    grid-template-areas: "texto lateral";
  }

  .pausa {
    grid-template-columns: 12rem minmax(0, 1fr);
    gap: 2.75rem;
  }

  .pausa__mapa {
    width: 100%;
  }

  .cuerpo__hijas {
    align-self: start;
  }

  .cuerpo__lateral,
  .cuerpo__lateral:has(.w-hermanas) {
    grid-template-columns: minmax(0, 1fr);
    align-self: start;
  }

  .cuerpo__lateral .w-hermanas__enlaces {
    grid-template-columns: minmax(0, 1fr);
  }

  .cuerpo .w-seccion {
    column-gap: 3rem;
  }
}

@media (min-width: 75rem) and (min-height: 50rem) {
  .cuerpo__lateral {
    position: sticky;
    top: calc(var(--cabecera-alto) + 1.5rem);
  }
}

/* Móvil: ficha compacta, índice de pie en dos columnas */
@media (max-width: 47.99rem) {
  .w-datos {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1rem;
  }

  .w-datos__fila {
    grid-template-columns: minmax(0, 1fr);
    gap: .15rem;
    padding: .6rem 0;
  }

  .w-datos__fila:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }

  .w-datos dd {
    font-size: 1rem;
  }

  /* Portada: tres datos en 390 px; recogida, pago y teléfono salen más abajo */
  .portada .w-datos__fila:nth-child(n + 4) {
    display: none;
  }

  .portada .w-datos__fila:nth-child(3) {
    grid-column: 1 / -1;
  }

  /* Antetítulo: menos espaciado para que no se parta ni deje la flecha sola */
  .w-antetitulo {
    gap: .6rem;
    font-size: .76rem;
    letter-spacing: .06em;
  }

  .w-antetitulo::before {
    width: 1.25rem;
  }

  /* Pausa: cifras en filas (número a la izquierda, texto a la derecha) */
  .pausa__cifras {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .pausa__cifras div {
    flex-direction: row;
    align-items: baseline;
    gap: 1rem;
    padding: .55rem 0;
    border-bottom: 1px solid rgba(122, 94, 16, .2);
  }

  .pausa__cifras div:last-child {
    border-bottom: 0;
  }

  .pausa__cifras dd {
    min-width: 3.2rem;
    font-size: 1.9rem;
  }

  /* Pie: marca y atención a todo el ancho; servicios y destinos, uno junto
     a otro en dos columnas */
  .pie__rejilla {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1.25rem;
    row-gap: 0;
    padding-bottom: 1.5rem;
  }

  .pie__rejilla > * {
    min-width: 0;
    padding-block: 1.35rem;
    border-top: 1px solid rgba(255, 255, 255, .14);
  }

  /* Orden: marca, atención (teléfono), servicios y destinos */
  .pie__rejilla > :first-child {
    grid-column: 1 / -1;
    order: -2;
    padding-top: 0;
    border-top: 0;
  }

  .pie__rejilla > :last-child {
    grid-column: 1 / -1;
    order: -1;
  }

  .pie__rejilla > :last-child .pie__lista {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1.25rem;
  }

  .pie__rejilla > :last-child .pie__lista > :first-child {
    grid-column: 1 / -1;
  }

  /* Hermanas en móvil: índice en dos columnas compactas */
  .w-hermanas__enlaces:has(> a:nth-child(3)) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1rem;
  }

  .w-hermanas__enlaces:has(> a:nth-child(3)) a {
    gap: .5rem;
    padding: .65rem 0;
    font-size: 1rem;
  }

  .w-hermanas__enlaces:has(> a:nth-child(3)) a::before {
    min-width: 1.3rem;
    font-size: .78rem;
  }

  .pie__titulo {
    margin-bottom: .6rem;
    font-family: var(--t-texto);
    font-size: .78rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--oro-claro);
  }

  .pie__lista {
    gap: .2rem;
    font-size: 1rem;
  }

  .pie nav .pie__lista a {
    display: block;
    padding: .3rem 0;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
  }

  .pie__telefono {
    font-size: 1.5rem;
  }
}

/* Tablas en móvil: filas apiladas con el rótulo de cada columna */
@media (max-width: 39.99rem) {
  .w-tabla:has(.tabla-apilable) {
    overflow: visible;
    background: none;
  }

  table.tabla-apilable,
  .w-tabla table.tabla-apilable:has(th:nth-child(4)) {
    min-width: 0;
  }

  table.tabla-apilable thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  table.tabla-apilable,
  table.tabla-apilable tbody,
  table.tabla-apilable td {
    display: block;
    width: 100%;
  }

  /* Cada fila, una tarjeta compacta: el nombre arriba y los demás datos en
     dos columnas */
  table.tabla-apilable tbody {
    display: grid;
    gap: .6rem;
  }

  table.tabla-apilable tr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem 1rem;
    padding: .85rem 1rem .95rem;
    background: var(--superficie);
    border: 1px solid var(--filete);
    border-left: 3px solid var(--oro);
    border-radius: var(--radio);
  }

  table.tabla-apilable td {
    min-width: 0;
    padding: 0;
    border: 0;
    font-size: .95rem;
    line-height: 1.35;
  }

  table.tabla-apilable td:first-child {
    grid-column: 1 / -1;
    padding: 0 0 .4rem;
    border-bottom: 1px solid var(--filete);
    font-family: var(--t-titulo);
    font-size: 1.08rem;
    color: var(--tinta);
  }

  table.tabla-apilable td:last-child:nth-child(even) {
    grid-column: 1 / -1;
  }

  .w-tabla:has(.tabla-apilable) {
    border-top: 0;
  }

  /* Tablas de dos columnas: siguen siendo tabla, más compacta */
  .w-tabla table:not(.tabla-apilable) :is(th, td) {
    padding: .65rem .75rem;
  }

  table.tabla-apilable td[data-label]::before {
    content: attr(data-label);
    display: block;
    font-size: .74rem;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--tinta-suave);
  }
}