/* Medyfe — sitio público.
   Paleta y letras de la marca (las mismas de RAG-Clinica, src/estilos/app.css).
   La maqueta sigue a fountainlife.com: cabecera oscura, héroe en tarjeta,
   titulares en sans con una palabra en itálica de acento. */

@font-face { font-family: 'Marcellus'; font-weight: 400; font-display: swap;
  src: url(fuentes/Marcellus-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+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Marcellus'; font-weight: 400; font-display: swap;
  src: url(fuentes/Marcellus-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Sans'; font-weight: 400; font-display: swap; src: url(fuentes/IBMPlexSans-400-latin.woff2) format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-weight: 500; font-display: swap; src: url(fuentes/IBMPlexSans-500-latin.woff2) format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-weight: 600; font-display: swap; src: url(fuentes/IBMPlexSans-600-latin.woff2) format('woff2'); }

:root {
  /* Marca */
  --oro: #c08a2a;
  --oro-luz: #e8c063;
  --oro-velo: #f6edd8;
  --bronce: #7a5a17;
  --crema: #f1ddc9;
  --verde: #8fcf5a;
  --cafe: #331c0b;
  --cafe-hondo: #1c0f06;
  --noche: #0d0703;

  /* Superficies */
  --fondo: #fbf7f0;
  --tinta: #1f1a12;
  --piedra: #6e6555;
  --borde: #e6dccb;

  --letra-titulo: 'Marcellus', 'Iowan Old Style', Georgia, serif;
  --letra: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --letra-acento: 'Cormorant Garamond', 'Iowan Old Style', Georgia, serif;

  --ancho: 1120px;
  --radio: 22px;
  --cabecera: 72px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--cabecera); }
body {
  margin: 0;
  background: var(--fondo);
  color: var(--tinta);
  font-family: var(--letra);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3 { margin: 0; font-weight: 400; }
h1, h2 { font-family: var(--letra-titulo); letter-spacing: -0.01em; line-height: 1.05; }
h2 { font-size: clamp(2.3rem, 5.2vw, 4rem); }
h1 em, h2 em {
  font-family: var(--letra-acento);
  font-style: italic;
  font-weight: 500;
  color: var(--oro);
  letter-spacing: 0;
}
svg { width: 1.2em; height: 1.2em; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
:focus-visible { outline: 2px solid var(--oro-luz); outline-offset: 3px; }

.saltar { position: absolute; left: -9999px; top: 0; z-index: 100; background: var(--crema); padding: .6rem 1rem; }
.saltar:focus { left: 1rem; top: 1rem; }

/* --- Botones -------------------------------------------------------- */
.boton {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: .55rem 1.6rem;
  border-radius: 999px; border: 1px solid transparent;
  font: 500 1rem/1.2 var(--letra); text-decoration: none; white-space: nowrap;
  cursor: pointer; transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.boton:hover { transform: translateY(-1px); }
.boton-grande { min-height: 48px; padding: .7rem 2rem; font-size: 1.08rem; }
.boton-claro { background: var(--crema); color: var(--cafe-hondo); }
.boton-claro:hover { background: #fff3e4; }
.boton-contorno { border-color: rgba(241, 221, 201, .7); color: var(--crema); background: transparent; }
.boton-contorno:hover { background: rgba(241, 221, 201, .1); }
.boton-vidrio { background: rgba(241, 221, 201, .12); border-color: rgba(241, 221, 201, .35); color: var(--crema); backdrop-filter: blur(8px); }
.boton-vidrio:hover { background: rgba(241, 221, 201, .2); }
.boton-oscuro { background: var(--cafe); color: var(--crema); }
.boton-oscuro:hover { background: var(--cafe-hondo); }
.boton-contorno-oscuro { border-color: var(--borde); color: var(--cafe); background: transparent; }
.boton-contorno-oscuro:hover { border-color: var(--cafe); }
.botones { display: flex; flex-wrap: wrap; gap: .9rem; }
.botones.centrado { justify-content: center; }

/* --- Cabecera ---------------------------------------------- */

.cabecera {
  position: sticky; top: 0; z-index: 50;
  height: var(--cabecera);
  display: flex; align-items: center; gap: 1.5rem;
  padding: 0 40px;
  background: var(--cafe-hondo);
  color: var(--crema);
  transition: box-shadow .3s;
}
.cabecera.con-sombra { box-shadow: 0 6px 24px rgba(0, 0, 0, .25); }
.marca img { height: 54px; width: auto; }
.menu { display: flex; gap: 2rem; margin: 0 auto; }
.menu a { text-decoration: none; font-size: .98rem; opacity: .85; transition: opacity .2s; }
.menu a:hover { opacity: 1; }
.menu .solo-movil { display: none; }
.acciones { display: flex; gap: .75rem; }
.hamburguesa { display: none; }

/* --- Héroe ---------------------------------------------------------- */
/* La portada ocupa justo la pantalla: cabecera + tarjeta + su margen inferior. */
.heroe { --margen-heroe: 20px; background: var(--cafe-hondo); padding: 0 40px var(--margen-heroe); }
.heroe-tarjeta {
  position: relative; overflow: hidden;
  min-height: calc(100vh - var(--cabecera) - var(--margen-heroe));
  min-height: calc(100svh - var(--cabecera) - var(--margen-heroe));
  border-radius: var(--radio);
  border: 1px solid rgba(241, 221, 201, .14);
  display: flex; align-items: center;
  color: #fff;
}
.heroe-fondo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% center; animation: respirar 18s ease-in-out infinite alternate; }
@keyframes respirar { from { transform: scale(1); } to { transform: scale(1.05); } }
.heroe-velo { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20, 11, 4, .94) 0%, rgba(20, 11, 4, .82) 32%, rgba(20, 11, 4, .25) 58%, transparent 75%); }
.heroe-contenido { position: relative; width: min(100%, 780px); padding: 72px 0 64px 68px; }
.heroe-texto, .heroe h1 { max-width: 600px; }
.circulo {
  flex-shrink: 0; display: grid; place-items: center;
  width: 52px; height: 52px; border-radius: 50%;
  border: 1px solid rgba(232, 192, 99, .7);
  background: rgba(232, 192, 99, .08);
  color: var(--oro-luz);
  box-shadow: 0 0 18px rgba(232, 192, 99, .18);
}
.circulo svg { width: 24px; height: 24px; }
.heroe h1 { font-size: clamp(3rem, 6.2vw, 5.6rem); line-height: 1.02; margin-bottom: 1.6rem; }
.heroe h1 em { color: #f0c977; }
.heroe-texto { max-width: 34rem; margin: 0 0 2.2rem; font-size: 1.18rem; line-height: 1.55; color: #efe6d8; }
.heroe .botones { margin-bottom: 3.2rem; }
.heroe .boton { gap: .75rem; }
.heroe .boton svg { width: 20px; height: 20px; }
.heroe .boton-contorno svg { width: 24px; height: 24px; }
.heroe-datos { display: flex; list-style: none; margin: 0; padding: 0; }
.heroe-datos li { display: flex; align-items: center; gap: .9rem; padding: 0 1.6rem; border-left: 1px solid rgba(232, 192, 99, .35); }
.heroe-datos li:first-child { padding-left: 0; border-left: 0; }
.heroe-datos div { display: flex; flex-direction: column; font-size: .9rem; line-height: 1.35; white-space: nowrap; }
.heroe-datos strong { font-weight: 600; }
.heroe-datos span:not(.circulo) { color: #e2d6c3; font-size: .85rem; margin-top: .15rem; }

/* --- Secciones ------------------------------------------------------ */
.seccion { padding: 120px 40px; }
.encabezado { max-width: 780px; margin: 0 auto 64px; }
.encabezado.centrado { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 1.6rem; }
.encabezado p { margin: 0; font-size: 1.15rem; color: var(--piedra); max-width: 34rem; }

/* Tonos de las imágenes de tarjeta */
.tono-oro { background: radial-gradient(circle at 50% 40%, #3a2a08, #0d0703); }
.tono-marron { background: radial-gradient(circle at 50% 40%, #5a3418, #1c0f06); }
.tono-noche { background: radial-gradient(circle at 70% 20%, #2b1b0b, #0d0703 70%); }

/* Cristal sobre imagen */
.vidrio {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 66%; padding: 1.6rem;
  border-radius: 14px;
  background: rgba(28, 15, 6, .5);
  border: 1px solid rgba(241, 221, 201, .22);
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  color: var(--crema); font-size: .9rem; line-height: 1.45;
}
.vidrio p { margin: 0; }
.vidrio-titulo { font-size: 1.1rem; margin-bottom: .7rem !important; }
.vidrio-icono svg { width: 30px; height: 30px; margin-bottom: .8rem; color: var(--oro-luz); }
/* Pie de imagen: el texto va abajo, dentro, sin tapar el centro. */
.vidrio-lateral {
  left: 0; right: 0; top: auto; bottom: 0; transform: none; width: auto;
  display: flex; align-items: baseline; flex-wrap: wrap; gap: .2rem .8rem;
  padding: 2.6rem 1.4rem 1rem;
  border: 0; border-radius: 0;
  background: linear-gradient(180deg, transparent, rgba(13, 7, 3, .88) 55%);
  backdrop-filter: none; -webkit-backdrop-filter: none;
  color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .8);
}
.vidrio-lateral .vidrio-titulo { margin: 0 !important; font-weight: 600; }

/* Pasos */
.seccion-proceso {
  background:
    radial-gradient(ellipse 30% 40% at 4% 22%, rgba(232, 192, 99, .16), transparent 70%),
    radial-gradient(ellipse 30% 40% at 96% 18%, rgba(232, 192, 99, .14), transparent 70%),
    linear-gradient(180deg, #fbf6ec, #f6efe2);
}
.antetitulo {
  display: flex; align-items: center; justify-content: center; gap: 1.6rem;
  margin: 0 !important; font-size: .82rem !important; letter-spacing: .38em; color: var(--piedra) !important;
}
.antetitulo::before, .antetitulo::after { content: ''; width: 72px; height: 1px; background: rgba(122, 90, 23, .35); }
.seccion-proceso .encabezado { gap: 1.2rem; }
/* En escritorio la sección ocupa justo la pantalla bajo la cabecera; la imagen
   de cada tarjeta se estira o encoge para rellenar lo que sobre. */
@media (min-width: 901px) {
  .seccion-proceso {
    height: calc(100vh - var(--cabecera));
    height: calc(100svh - var(--cabecera));
    min-height: 560px;
    display: flex; flex-direction: column;
    padding-top: clamp(20px, 4vh, 48px); padding-bottom: clamp(20px, 4vh, 48px);
  }
  .seccion-proceso .encabezado { flex-shrink: 0; margin-bottom: clamp(18px, 3.5vh, 44px); gap: clamp(.35rem, 1.3vh, 1.2rem); }
  .seccion-proceso h2 { font-size: clamp(2.3rem, 7vh, 4.8rem); }
  .seccion-proceso .encabezado p:not(.antetitulo) { font-size: clamp(.92rem, 1.9vh, 1.15rem); line-height: 1.5; }
  .seccion-proceso .pasos { flex: 1; min-height: 0; margin-bottom: 0; width: 100%; }
  .seccion-proceso .paso { min-height: 0; display: grid; grid-template-rows: 1fr auto; }
  .seccion-proceso .pasos { grid-template-rows: 1fr; }
  .seccion-proceso .paso-imagen { aspect-ratio: auto; min-height: 110px; }
  .seccion-proceso .paso-cuerpo { min-height: 13.5em; }
  .seccion-proceso .paso-cuerpo { flex: 0 0 auto; padding: 2.8rem 1.6rem 1.4rem; }
  .seccion-proceso .paso h3 { font-size: clamp(1.35rem, 3.3vh, 2rem); margin-bottom: .5rem; }
  .seccion-proceso .paso p { font-size: clamp(.9rem, 1.8vh, 1.02rem); }
  .seccion-proceso .paso-flecha { align-self: center; margin-top: 0; transform: translateY(var(--sube-flecha, -90px)); }
}
.seccion-proceso h2 { font-size: clamp(2.8rem, 6vw, 4.8rem); }
.seccion-proceso h2 em { color: #b17f24; }
.seccion-proceso .encabezado p:not(.antetitulo) { color: #4f463a; max-width: 38rem; }
.pasos { max-width: 1320px; margin: 0 auto 56px; display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: stretch; }
.paso {
  display: flex; flex-direction: column;
  border-radius: 22px; overflow: hidden;
  background: #fffaf2;
  box-shadow: 0 18px 44px rgba(90, 62, 20, .12), 0 2px 6px rgba(90, 62, 20, .06);
}
.paso-imagen { aspect-ratio: 1.15; overflow: hidden; }
.paso-imagen > img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s; }
.paso:hover .paso-imagen > img { transform: scale(1.04); }
.paso-cuerpo { position: relative; flex: 1; padding: 3.4rem 2rem 2.4rem; text-align: center; }
.paso-num {
  position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%);
  display: grid; place-items: center; width: 72px; height: 72px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fff6dd, #f1d48f 70%, #e2b866);
  box-shadow: 0 0 0 5px rgba(255, 250, 242, .9), 0 8px 22px rgba(176, 127, 36, .35);
  font-family: var(--letra-titulo); font-size: 1.7rem; color: #8a5f12;
}
.paso h3 { font-family: var(--letra-titulo); font-weight: 400; font-size: clamp(1.6rem, 2.3vw, 2rem); line-height: 1.15; margin-bottom: 1rem; color: var(--tinta); }
.paso p { margin: 0 auto; max-width: 22rem; color: #5f5547; font-size: 1.02rem; }
.paso-flecha {
  align-self: start; margin-top: calc((min(1320px, 100vw - 80px) - 120px) / 3 / 1.15 / 2 - 28px);
  position: relative; z-index: 2; width: 56px; height: 56px; margin-inline: -18px;
  display: grid; place-items: center; border-radius: 50%;
  background: #fffaf2; color: #8a5f12;
  box-shadow: 0 6px 20px rgba(90, 62, 20, .18);
}
.paso-flecha svg { width: 24px; height: 24px; stroke-width: 2; }

/* Carrusel */
.seccion-carrusel { padding-left: 0; padding-right: 0; }
.carrusel {
  display: flex; gap: 48px; overflow-x: auto; scroll-snap-type: x mandatory;
  padding: 0 calc((100vw - min(960px, 84vw)) / 2);
  scrollbar-width: none;
}
.carrusel::-webkit-scrollbar { display: none; }
.lamina {
  flex: 0 0 min(960px, 84vw); aspect-ratio: 16 / 9; scroll-snap-align: center;
  position: relative; border-radius: var(--radio); overflow: hidden;
  background: var(--cafe-hondo) var(--img) center / cover no-repeat;
  display: flex; padding: 4.5%;
  transition: opacity .4s;
}
.lamina::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(13, 7, 3, .25), rgba(13, 7, 3, .6)); }
.lamina-vidrio {
  position: relative; z-index: 1; flex: 1;
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 1.4rem 1.6rem; border-radius: 16px;
  border: 1px solid rgba(241, 221, 201, .18);
  background: rgba(241, 221, 201, .05);
  color: var(--crema);
}
.lamina-cabeza { display: flex; flex-direction: column; }
.lamina-vidrio { color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .9), 0 0 14px rgba(0, 0, 0, .75); }
.lamina h3 { font-size: 1.45rem; font-weight: 600; }
.lamina-sub { margin: .2rem 0 0; font-size: .92rem; font-weight: 500; }
.lamina-cita { margin: 0; font-size: clamp(1.05rem, 2vw, 1.35rem); font-weight: 500; max-width: 34rem; }
.carrusel-flechas { display: flex; justify-content: center; gap: .6rem; margin-top: 1.6rem; }
.flecha { width: 44px; height: 44px; border: 0; background: none; cursor: pointer; color: var(--tinta); border-radius: 50%; }
.flecha:hover { background: var(--oro-velo); }

/* Cinta */
.seccion-banda { padding-top: 0; padding-bottom: 40px; }
.cinta { overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.cinta-pista { display: flex; width: max-content; animation: desliza 40s linear infinite; }
.cinta-pista span { padding: 0 2.4rem; font-family: var(--letra-titulo); font-size: clamp(1.4rem, 2.6vw, 2.1rem); color: var(--bronce); white-space: nowrap; }
.cinta-pista span::after { content: '✦'; margin-left: 4.8rem; font-size: .7em; color: var(--oro); }
@keyframes desliza { to { transform: translateX(-50%); } }

/* Bloques alternos */
.bloque { max-width: var(--ancho); margin: 0 auto 96px; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.bloque:last-child { margin-bottom: 0; }
.bloque-imagen { position: relative; aspect-ratio: 8 / 8.5; border-radius: 18px; overflow: hidden; }
.bloque-imagen > img { width: 100%; height: 100%; object-fit: cover; }
.bloque-texto { padding-top: .5rem; }
.bloque-texto h3 { font-family: var(--letra-titulo); font-size: clamp(2rem, 3.6vw, 2.8rem); line-height: 1.1; margin-bottom: 1.4rem; }
.bloque-texto p { margin: 0 0 1rem; font-size: 1.12rem; }
.bloque-invertido .bloque-imagen { order: 2; }
.acento { margin-top: 2rem !important; color: var(--oro); font-size: 1.15rem !important; }
.acento em { font-family: var(--letra-acento); font-size: 1.25em; }

/* Servicios */
.seccion-servicios {
  background:
    radial-gradient(ellipse 30% 40% at 0% 10%, rgba(143, 207, 90, .12), transparent 70%),
    radial-gradient(ellipse 30% 40% at 100% 90%, rgba(232, 192, 99, .14), transparent 70%),
    #fbf6ec;
}
.seccion-servicios .encabezado { gap: 1rem; margin-bottom: 48px; max-width: 820px; }
.programa-adorno { display: flex; align-items: center; gap: 1.2rem; margin: 0 !important; color: #8a9a3a; }
.programa-adorno::before, .programa-adorno::after { content: ''; width: 130px; height: 1px; background: rgba(176, 127, 36, .45); }
.programa-adorno svg { width: 30px; height: 30px; }
.seccion-servicios h2 { font-size: clamp(2.4rem, 5.4vw, 4.4rem); letter-spacing: .01em; color: #1f1a12; }
.seccion-servicios h2 em { font-family: var(--letra-titulo); font-style: normal; color: #c99a34; }
.seccion-servicios .encabezado p:not(.programa-adorno) { color: #4f463a; font-size: 1.2rem; max-width: 40rem; }
.servicios { max-width: 1320px; margin: 0 auto; display: grid; grid-template-columns: 1.25fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 28px; }
.servicio {
  position: relative; overflow: hidden; display: flex; flex-direction: column;
  border-radius: 22px; background: #fffaf1;
  border: 1px solid rgba(232, 192, 99, .45);
  box-shadow: 0 16px 40px rgba(90, 62, 20, .1), 0 0 24px rgba(232, 192, 99, .12);
  transition: transform .3s, box-shadow .3s;
}
.servicio:hover { transform: translateY(-4px); box-shadow: 0 22px 50px rgba(90, 62, 20, .16), 0 0 30px rgba(232, 192, 99, .22); }
.servicio-imagen { height: 190px; overflow: hidden; }
.servicio-imagen img { width: 100%; height: 100%; object-fit: cover; }
.servicio-cuerpo { position: relative; flex: 1; display: flex; flex-direction: column; align-items: flex-start; padding: 0 2rem 1.8rem; }
.servicio:not(.servicio-grande) .servicio-cuerpo::before {
  content: ''; position: absolute; left: 0; right: 0; top: -46px; height: 70px;
  background: #fffaf1; border-radius: 0 60% 0 0 / 0 100% 0 0;
}
.servicio-icono {
  position: relative; display: grid; place-items: center; width: 70px; height: 70px; margin-top: -40px; margin-bottom: .9rem;
  border-radius: 50%; border: 1.5px solid rgba(201, 154, 52, .8); background: #fffaf1; color: #a8761c;
  box-shadow: 0 6px 18px rgba(176, 127, 36, .18);
}
.servicio-icono svg { width: 34px; height: 34px; stroke-width: 1.4; }
.servicio h3 { position: relative; font-family: var(--letra-titulo); font-size: clamp(1.6rem, 2.3vw, 2.1rem); line-height: 1.05; color: #1f1a12; }
.servicio h3::after { content: ''; display: block; width: 34px; height: 1.5px; margin-top: .55rem; background: #c99a34; }
.servicio p { position: relative; margin: .8rem 0 1.3rem; font-size: 1rem; line-height: 1.5; color: #4f463a; }
.servicio-boton {
  position: relative; margin-top: auto; display: inline-flex; align-items: center; gap: 1.6rem;
  padding: .6rem 1.3rem .6rem 1.5rem; border-radius: 999px;
  border: 1px solid rgba(201, 154, 52, .7); background: linear-gradient(180deg, #fff7e4, #f7e6bf);
  color: #2b1d0c; font-weight: 500; font-size: .98rem; text-decoration: none;
  transition: background .2s;
}
.servicio-boton:hover { background: linear-gradient(180deg, #fff1d2, #f2d99c); }
.servicio-boton svg { width: 18px; height: 18px; stroke-width: 2; }
/* Tarjeta grande: foto a sangre con velo verde abajo */
.servicio-grande { grid-row: span 2; justify-content: flex-end; background: #1f2a14; min-height: 640px; }
.servicio-fondo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 40% top; }
.servicio-grande::before {
  content: ''; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(180deg, transparent 22%, rgba(31, 42, 20, .55) 42%, rgba(31, 42, 20, .94) 58%, #1f2a14 75%);
}
.servicio-grande .servicio-cuerpo { z-index: 2; flex: 0 0 auto; padding: 0 3rem 3rem; }
.servicio-grande .servicio-icono { margin-top: 0; margin-bottom: 1.4rem; width: 92px; height: 92px; background: rgba(255, 246, 225, .92); }
.servicio-grande .servicio-icono svg { width: 46px; height: 46px; }
.servicio-grande h3 { font-size: clamp(2.6rem, 4vw, 3.6rem); color: #fbf3e2; }
.servicio-grande h3::after { display: none; }
.servicio-raya { position: relative; width: 46px; height: 1.5px; margin: 1.1rem 0 .3rem; background: #e2b866; }
.servicio-grande p { color: #eee6d4; font-size: 1.18rem; margin-bottom: 2rem; }
.servicio-boton-oro { margin-top: 0; padding: .9rem 1.6rem .9rem 2.2rem; font-size: 1.12rem; border: 0; background: linear-gradient(180deg, #fbe7b4, #ecc77c); box-shadow: 0 8px 26px rgba(232, 192, 99, .35); }

/* Sede */
.seccion-sedes {
  background:
    radial-gradient(ellipse 25% 45% at 0% 60%, rgba(143, 207, 90, .1), transparent 70%),
    radial-gradient(ellipse 25% 45% at 100% 40%, rgba(232, 192, 99, .12), transparent 70%),
    #fbf7ef;
}
.antetitulo-izq { justify-content: flex-start; margin-bottom: 1rem !important; }
.antetitulo-izq::after { display: none; }
.antetitulo-izq::before { width: 60px; background: var(--oro); }
.sede-cabeza { max-width: 1320px; margin: 0 auto 56px; display: grid; grid-template-columns: 1.15fr 1fr; gap: 64px; align-items: center; }
.sede-cabeza h2 { font-size: clamp(2.8rem, 6vw, 5rem); }
.sede-cabeza h2 em { color: #b17f24; }
.sede-cabeza > p { margin: 0; font-size: 1.15rem; color: #6e6555; max-width: 32rem; }
.sedes { max-width: 1320px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.sede {
  position: relative; overflow: hidden; min-height: 460px;
  border-radius: 24px; background: #1c0f06;
  box-shadow: 0 24px 50px rgba(90, 62, 20, .18), 0 0 0 1px rgba(232, 192, 99, .25);
  display: flex; align-items: center;
}
.sede-fondo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 75% center; transition: transform 1s; }
.sede:hover .sede-fondo { transform: scale(1.04); }
.sede::before { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(28, 15, 6, .96) 0%, rgba(28, 15, 6, .85) 34%, rgba(28, 15, 6, .2) 64%, transparent 80%); }
.sede-verde { background: #0d1408; }
.sede-verde::before { background: linear-gradient(90deg, rgba(10, 16, 6, .96) 0%, rgba(10, 16, 6, .85) 34%, rgba(10, 16, 6, .2) 64%, transparent 80%); }
.sede-texto { position: relative; z-index: 2; padding: 3rem 3.4rem; color: #fff; max-width: 400px; }
.sede-icono {
  display: grid; place-items: center; width: 64px; height: 64px; margin-bottom: 1.6rem;
  border-radius: 14px; border: 1px solid rgba(232, 192, 99, .45);
  background: rgba(232, 192, 99, .14); color: #f0c977;
}
.sede-icono svg { width: 30px; height: 30px; }
.sede h3 { font-family: var(--letra-titulo); font-size: clamp(2.4rem, 3.6vw, 3.2rem); line-height: 1; white-space: nowrap; }
.sede-sub { margin: .5rem 0 0; font-size: 1.2rem; color: #efe3cf; }
.sede-sub::after { content: ''; display: block; width: 46px; height: 2px; margin: 1.3rem 0; background: var(--oro); }
.sede-desc { margin: 0 0 2.2rem; font-size: 1.08rem; line-height: 1.55; color: #e9dfcf; }
.sede-boton {
  display: inline-flex; align-items: center; gap: 1.6rem;
  padding: .5rem .5rem .5rem 1.8rem; border-radius: 999px;
  border: 1px solid rgba(232, 192, 99, .7);
  color: #fff; text-decoration: none; font-weight: 500; font-size: 1.08rem;
  transition: background .2s;
}
.sede-boton:hover { background: rgba(232, 192, 99, .12); }
.sede-flecha { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(180deg, #f6dc9c, #e2b866); color: #1c0f06; }
.sede-flecha svg { width: 20px; height: 20px; stroke-width: 2; }

/* Preguntas */
.preguntas { max-width: 960px; margin: 0 auto; border-top: 1px solid var(--borde); }
.preguntas details { border-bottom: 1px solid var(--borde); }
.preguntas summary {
  list-style: none; cursor: pointer;
  display: flex; justify-content: space-between; align-items: center; gap: 1.5rem;
  padding: 2rem 0; font-size: clamp(1.25rem, 2.4vw, 1.9rem); line-height: 1.25;
}
.preguntas summary::-webkit-details-marker { display: none; }
.preguntas summary::after {
  content: ''; flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%;
  border: 1.5px solid var(--tinta);
  background:
    linear-gradient(var(--tinta), var(--tinta)) center / 12px 1.5px no-repeat,
    linear-gradient(var(--tinta), var(--tinta)) center / 1.5px 12px no-repeat;
  transition: transform .3s;
}
.preguntas details[open] summary::after { transform: rotate(45deg); }
.preguntas details p { margin: -0.6rem 0 2rem; max-width: 52rem; color: var(--piedra); }

/* Llamado final: fondo a todo el ancho, formulario de cristal encima. */
.seccion-final { padding: 0; }
.final {
  padding: 120px 16px 110px; text-align: center; color: #fff;
  background:
    radial-gradient(ellipse 48% 62% at 50% 52%, rgba(8, 10, 4, .78), rgba(8, 10, 4, .35) 70%, transparent),
    url(img/final.webp) center / cover;
}
.final h2 { font-size: clamp(2.6rem, 6vw, 4.6rem); line-height: 1.08; text-shadow: 0 2px 18px rgba(0, 0, 0, .55); }
.final-oro { color: #f1d9a4; }
.final h2 em { color: var(--oro-luz); }
.final > p { margin: 1.2rem auto 2.4rem; max-width: 34rem; font-size: 1.15rem; text-shadow: 0 1px 8px rgba(0, 0, 0, .8); }
.formulario { max-width: 720px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem 1.2rem; text-align: left; }
.formulario label { display: flex; flex-direction: column; gap: .45rem; font-size: .92rem; font-weight: 500; text-shadow: 0 1px 6px rgba(0, 0, 0, .8); }
.formulario .ancho { grid-column: 1 / -1; }
.campo {
  display: flex; align-items: center; gap: .7rem;
  padding: 0 1rem; border-radius: 12px;
  border: 1px solid rgba(232, 192, 99, .55);
  background: rgba(13, 9, 4, .62);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  transition: border-color .2s;
}
.campo:focus-within { border-color: var(--oro-luz); }
.campo svg { flex-shrink: 0; width: 22px; height: 22px; color: #f1d9a4; }
.campo-area { align-items: flex-start; padding-top: .85rem; }
.formulario input, .formulario textarea {
  flex: 1; min-width: 0; font: inherit; font-size: 1rem; color: #fff;
  padding: .95rem 0; border: 0; background: none; text-shadow: none;
}
.campo-area textarea { padding-top: 0; }
.formulario input::placeholder, .formulario textarea::placeholder { color: rgba(241, 221, 201, .55); }
.formulario input:focus, .formulario textarea:focus { outline: none; }
.formulario textarea { resize: vertical; }
.boton-oro {
  justify-self: center; width: min(100%, 560px); gap: .7rem; margin-top: .4rem;
  background: linear-gradient(180deg, #fbeccb, #e9c98a); color: var(--cafe-hondo);
  box-shadow: 0 8px 28px rgba(232, 192, 99, .3);
}
.boton-oro:hover { background: linear-gradient(180deg, #fff3da, #efd398); }
.icono-wa { width: 24px; height: 24px; }
.formulario-aviso { grid-column: 1 / -1; margin: 0; min-height: 1.4em; text-align: center; font-size: .95rem; color: var(--oro-luz); text-shadow: 0 1px 6px rgba(0, 0, 0, .8); }

/* Pie */
.pie { background: #120a04; color: #f3eadb; }
.pie-cuerpo {
  padding: 64px 40px 72px;
  background:
    linear-gradient(180deg, #120a04 0%, rgba(18, 10, 4, .92) 45%, rgba(18, 10, 4, .55) 80%, rgba(18, 10, 4, .35) 100%),
    url(img/pie.webp) center bottom / cover no-repeat;
}
.pie-rejilla { max-width: 1320px; margin: 0 auto; display: grid; grid-template-columns: 1.35fr 1fr 1fr 1.1fr; }
.pie-rejilla > * { padding: 0 2.6rem; border-left: 1px solid rgba(232, 192, 99, .14); }
.pie-rejilla > :first-child { padding-left: 0; border-left: 0; }
.pie-marca img { width: 230px; height: auto; margin: -10px 0 1rem -14px; }
.pie-lema { margin: 0 0 .7rem; font-size: 1.6rem; font-weight: 500; line-height: 1.2; }
.pie-lema em { font-family: var(--letra-acento); font-size: 1.12em; color: #f0c977; }
.pie-desc { margin: 0 0 1.4rem; max-width: 22rem; font-size: 1.08rem; line-height: 1.5; color: #e3d8c6; }
.pie-confianza { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.pie-confianza li { display: flex; align-items: center; gap: .9rem; font-size: 1.08rem; font-weight: 500; color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, .9), 0 0 12px rgba(0, 0, 0, .8); }
.pie-confianza .circulo { width: 40px; height: 40px; background: rgba(18, 10, 4, .75); }
.pie-confianza .circulo svg { width: 20px; height: 20px; }
.pie-columna { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; padding-top: .4rem; }
.pie-columna a, .pie-columna p { margin: 0; text-decoration: none; font-size: 1.1rem; color: #f3eadb; white-space: nowrap; }
.pie-columna .pie-boton { color: var(--cafe-hondo); }
.pie-columna a:not(.boton):hover { color: #f0c977; }
.pie-titulo { font-size: .88rem !important; font-weight: 600; letter-spacing: .12em; color: #f0c977 !important; margin-bottom: .3rem !important; }
.pie-agenda { display: inline-flex; align-items: center; gap: .9rem; }
.pie-agenda svg { width: 30px; height: 30px; color: #f0c977; }
.pie-boton { min-width: 240px; min-height: 54px; font-size: 1.05rem; }
.pie-boton svg { width: 22px; height: 22px; }
.pie-legal {
  max-width: 1600px; margin: 0 auto; padding: 18px 40px 22px;
  border-top: 1px solid rgba(232, 192, 99, .3);
  display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem;
  font-size: .98rem;
}
.pie-legal p { margin: 0; }
.pie-copy { padding-right: 2rem; border-right: 1px solid rgba(232, 192, 99, .3); }
.pie-aviso { color: #c9bca7; }
.pie-redes { display: flex; gap: 1.2rem; margin-left: auto; }
.pie-redes a { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(232, 192, 99, .7); color: #f3eadb; }
.pie-redes a:hover { background: rgba(232, 192, 99, .12); }
.pie-redes svg { width: 22px; height: 22px; }
[hidden] { display: none !important; }

/* Aparición al desplazarse */
.js .revela { opacity: 0; transform: translateY(28px); transition: opacity .9s ease, transform .9s ease; }
.js .revela.visible { opacity: 1; transform: none; }

/* Pantallas bajas de escritorio: el contenido se compacta para caber en la portada. */
@media (min-width: 901px) and (max-height: 820px) {
  .heroe-contenido { padding-top: 40px; padding-bottom: 36px; }
  .heroe h1 { font-size: clamp(2.6rem, 10vh, 4.6rem); margin-bottom: 1rem; }
  .heroe-texto { margin-bottom: 1.4rem; font-size: 1.08rem; }
  .heroe .botones { margin-bottom: 1.8rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .heroe-fondo, .cinta-pista { animation: none; }
  .js .revela { opacity: 1; transform: none; transition: none; }
}

/* --- Tableta -------------------------------------------------------- */
@media (max-width: 1100px) {
  .acciones .boton-contorno { display: none; }
  .menu { gap: 1.4rem; }
  .heroe { padding: 0 24px var(--margen-heroe); }
  .heroe-contenido { padding: 64px 0 56px 48px; }
  .pie-rejilla { grid-template-columns: 1fr 1fr; row-gap: 56px; }
  .pie-rejilla > :nth-child(3) { padding-left: 0; border-left: 0; }
}

@media (max-width: 900px) {
  :root { --cabecera: 64px; }
  .cabecera { padding: 0 16px; }
  .marca img { height: 36px; }
  .acciones { margin-left: auto; }
  .hamburguesa {
    display: grid; place-content: center; gap: 7px;
    width: 44px; height: 44px; border: 0; background: none; cursor: pointer;
  }
  .hamburguesa span { display: block; width: 24px; height: 1.5px; background: var(--crema); transition: transform .3s; }
  .hamburguesa[aria-expanded="true"] span:first-child { transform: translateY(4.25px) rotate(45deg); }
  .hamburguesa[aria-expanded="true"] span:last-child { transform: translateY(-4.25px) rotate(-45deg); }
  .menu {
    position: fixed; inset: var(--cabecera) 0 auto 0; margin: 0;
    flex-direction: column; gap: 0; padding: 1rem 16px 2rem;
    background: var(--cafe-hondo); border-top: 1px solid rgba(241, 221, 201, .12);
    transform: translateY(-110%); visibility: hidden; transition: transform .35s, visibility .35s;
  }
  .menu.abierto { transform: none; visibility: visible; }
  .menu a { padding: .95rem 0; font-size: 1.15rem; border-bottom: 1px solid rgba(241, 221, 201, .1); }
  .menu .solo-movil { display: inline-flex; margin-top: 1.4rem; border: 0; }

  .heroe { --margen-heroe: 16px; padding: 0 16px var(--margen-heroe); }
  .heroe-tarjeta { align-items: flex-end; background: #140b04; }
  .heroe-fondo { height: 34svh; object-position: 66% center; animation: none; }
  .heroe-velo { height: 34svh; background: linear-gradient(180deg, transparent 45%, #140b04); }
  .heroe-contenido { padding: calc(34svh - 70px) 22px 24px; }
  .heroe h1 { font-size: clamp(2.4rem, 11vw, 3rem); margin-bottom: 1rem; }
  .heroe-texto { font-size: 1.02rem; margin-bottom: 1.4rem; }
  .heroe .botones { margin-bottom: 1.6rem; gap: .6rem; }
  .heroe-datos .circulo { width: 38px; height: 38px; }
  .heroe-datos .circulo svg { width: 19px; height: 19px; }
  .heroe-datos div { white-space: normal; }
  .heroe-datos { flex-direction: row; gap: 0; }
  .heroe-datos li { flex: 1; flex-direction: column; align-items: flex-start; gap: .5rem; padding: 0 .7rem; }
  .heroe-datos li:first-child { padding-left: 0; }
  .heroe-datos li:first-child { flex: 1.3; }
  .heroe-datos div { font-size: .8rem; }
  .heroe-datos span:not(.circulo) { display: none; }

  .seccion { padding: 80px 16px; }
  .encabezado { margin-bottom: 44px; }
  .pasos { grid-template-columns: 1fr; gap: 20px; max-width: 520px; }
  .paso-flecha { margin: 0 auto; transform: rotate(90deg); }
  .bloque, .sede-cabeza { grid-template-columns: 1fr; gap: 32px; }
  .sede { min-height: 0; align-items: flex-end; }
  .sede-fondo { height: 240px; bottom: auto; object-position: 70% center; }
  .sede::before, .sede-verde::before { background: linear-gradient(180deg, transparent 0, transparent 140px, currentColor 240px); color: #1c0f06; }
  .sede-verde::before { color: #0d1408; }
  .sede-texto { padding: 180px 1.6rem 2rem; max-width: none; }
  .bloque { margin-bottom: 72px; }
  .bloque-invertido .bloque-imagen { order: 0; }
  .servicios { grid-template-columns: 1fr; grid-template-rows: none; max-width: 520px; gap: 22px; }
  .servicio-grande { grid-row: auto; min-height: 560px; }
  .servicio-grande .servicio-cuerpo { padding: 0 1.6rem 2rem; }
  .servicio-cuerpo { padding: 0 1.4rem 1.6rem; }
  .programa-adorno::before, .programa-adorno::after { width: 60px; }
  .sedes { grid-template-columns: 1fr; }
    .carrusel { gap: 16px; padding: 0 8vw; }
  .lamina { aspect-ratio: 4 / 5; }
  .seccion-final { padding: 0; }
  .final { padding: 80px 16px; }
  .formulario { grid-template-columns: 1fr; }
  .pie-cuerpo { padding: 56px 16px 64px; }
  .pie-columna a, .pie-columna p { white-space: normal; }
  .pie-rejilla { grid-template-columns: 1fr; row-gap: 44px; }
  .pie-rejilla > * { padding: 0; border-left: 0; }
  .pie-legal { padding: 24px 16px 32px; }
  .pie-copy { padding-right: 0; border-right: 0; }
  .pie-redes { margin-left: 0; }
  .pie-boton { min-width: 0; width: 100%; }
}

@media (max-width: 520px) {
  .acciones { display: none; }
  .hamburguesa { margin-left: auto; }
  .heroe .botones { width: 100%; }
  .heroe .boton { flex: 1 1 100%; padding-inline: 1rem; }
  .vidrio { width: 78%; padding: 1.2rem; }
}

/* Móviles bajos: menos imagen arriba para que el texto quepa. */
@media (max-width: 900px) and (max-height: 760px) {
  .heroe-fondo, .heroe-velo { height: 26svh; }
  .heroe-contenido { padding-top: calc(26svh - 60px); padding-bottom: 18px; }
  .heroe h1 { font-size: 2.3rem; margin-bottom: .7rem; }
  .heroe-texto { font-size: .95rem; line-height: 1.45; margin-bottom: 1rem; }
  .heroe .boton-grande { min-height: 44px; padding-block: .5rem; }
  .heroe .botones { margin-bottom: 1.1rem; }
  .heroe .boton-contorno { display: none; }
}

/* Tabletas: la tarjeta grande arriba, las cuatro pequeñas en dos columnas. */
@media (min-width: 901px) and (max-width: 1180px) {
  .servicios { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .servicio-grande { grid-column: span 2; grid-row: auto; min-height: 520px; }
}

/* En escritorio «Nuestros servicios» ocupa justo la pantalla bajo la cabecera;
   las imágenes de las tarjetas absorben el espacio que sobre o falte. */
@media (min-width: 1181px) {
  .seccion-servicios {
    height: calc(100vh - var(--cabecera));
    height: calc(100svh - var(--cabecera));
    min-height: 520px;
    display: flex; flex-direction: column;
    padding-top: clamp(18px, 3.5vh, 44px); padding-bottom: clamp(18px, 3.5vh, 44px);
  }
  .seccion-servicios .encabezado { flex-shrink: 0; margin-bottom: clamp(16px, 3vh, 40px); gap: clamp(.3rem, 1.1vh, 1rem); }
  .seccion-servicios h2 { font-size: clamp(2.2rem, 6.4vh, 4.4rem); }
  .seccion-servicios .encabezado p:not(.programa-adorno) { font-size: clamp(.92rem, 1.9vh, 1.15rem); line-height: 1.4; max-width: 46rem; }
  .seccion-servicios .programa-adorno svg { width: clamp(20px, 3vh, 30px); height: clamp(20px, 3vh, 30px); }
  .servicios { flex: 1; min-height: 0; width: 100%; max-width: min(1640px, 100%); grid-template-columns: 1.1fr 1fr 1fr; gap: clamp(14px, 2.4vh, 28px); grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); }
  .servicio { min-height: 0; }
  .servicio:not(.servicio-grande) { display: grid; grid-template-rows: minmax(0, 1fr) auto; }
  .servicio-imagen { height: auto; min-height: 60px; }
  .servicio-grande { min-height: 0; }
  .servicio-cuerpo { padding-bottom: clamp(.8rem, 1.8vh, 1.6rem); padding-inline: 1.6rem; }
  .servicio:not(.servicio-grande) .servicio-cuerpo { padding-top: .2rem; }
  .servicio:not(.servicio-grande) .servicio-cuerpo::before { top: -30px; height: 46px; }
  .servicio:not(.servicio-grande) .servicio-icono { position: absolute; left: 1.6rem; top: calc(-1 * clamp(44px, 6vh, 62px) - 18px); margin: 0; width: clamp(44px, 6vh, 62px); height: clamp(44px, 6vh, 62px); z-index: 2; }
  .servicio-icono svg { width: 50%; height: 50%; }
  .servicio h3 { font-size: clamp(1.25rem, 2.9vh, 2rem); }
  .servicio h3::after { margin-top: .35rem; }
  .servicio p { font-size: clamp(.82rem, 1.6vh, .96rem); line-height: 1.4; margin: clamp(.3rem, .8vh, .7rem) 0 clamp(.5rem, 1.3vh, 1.1rem); }
  .servicio-boton { padding-block: clamp(.35rem, .8vh, .6rem); font-size: clamp(.86rem, 1.7vh, .98rem); }
  .servicio-grande .servicio-cuerpo { padding: 0 clamp(1.8rem, 3vw, 3rem) clamp(1.4rem, 4vh, 3rem); }
  .servicio-grande .servicio-icono { width: clamp(60px, 9vh, 92px); height: clamp(60px, 9vh, 92px); margin-top: 0; margin-bottom: clamp(.6rem, 2vh, 1.4rem); }
  .servicio-grande h3 { font-size: clamp(2rem, 6vh, 3.6rem); }
  .servicio-grande p { font-size: clamp(.95rem, 2.1vh, 1.18rem); margin-bottom: clamp(.9rem, 3vh, 2rem); }
  .servicio-boton-oro { padding-block: clamp(.55rem, 1.4vh, .9rem); }
}

/* En escritorio «Lo que evaluamos» ocupa justo la pantalla bajo la cabecera:
   el ancho de la lámina sale del alto disponible (16:9) para que quepa entera. */
@media (min-width: 901px) {
  .seccion-carrusel {
    --reserva: 250px;
    --ancho-lamina: min(1100px, 84vw, (100svh - var(--cabecera) - var(--reserva)) * 16 / 9);
    height: calc(100vh - var(--cabecera));
    height: calc(100svh - var(--cabecera));
    min-height: 480px;
    display: flex; flex-direction: column; justify-content: center;
    padding-top: clamp(16px, 3.5vh, 44px); padding-bottom: clamp(16px, 3.5vh, 44px);
  }
  .seccion-carrusel .encabezado { margin-bottom: clamp(16px, 3.5vh, 44px); }
  .seccion-carrusel h2 { font-size: clamp(2.3rem, 7vh, 4rem); }
  .seccion-carrusel .carrusel { padding: 0 calc((100vw - var(--ancho-lamina)) / 2); }
  .seccion-carrusel .lamina { flex-basis: var(--ancho-lamina); }
  .seccion-carrusel .carrusel-flechas { margin-top: clamp(10px, 2vh, 26px); }
}

/* En escritorio el formulario de contacto ocupa justo la pantalla bajo la cabecera. */
@media (min-width: 901px) {
  .seccion-final .final {
    height: calc(100vh - var(--cabecera));
    height: calc(100svh - var(--cabecera));
    min-height: 520px;
    display: flex; flex-direction: column; justify-content: center;
    padding-top: clamp(20px, 4vh, 60px); padding-bottom: clamp(20px, 4vh, 60px);
  }
  .seccion-final .final h2 { font-size: clamp(2.3rem, 7.5vh, 4.6rem); }
  .seccion-final .final > p { margin: clamp(.6rem, 1.8vh, 1.2rem) auto clamp(1rem, 3.2vh, 2.4rem); }
  .seccion-final .formulario { gap: clamp(.6rem, 1.8vh, 1.2rem) 1.2rem; }
  .seccion-final .formulario input, .seccion-final .formulario textarea { padding-block: clamp(.55rem, 1.4vh, .95rem); }
  .seccion-final .formulario textarea { height: clamp(52px, 10vh, 96px); }
}

/* En escritorio «Preguntas frecuentes» ocupa justo la pantalla bajo la cabecera.
   Solo hay una pregunta abierta a la vez (details name), así la altura no crece. */
@media (min-width: 901px) {
  #preguntas {
    height: calc(100vh - var(--cabecera));
    height: calc(100svh - var(--cabecera));
    min-height: 520px;
    display: flex; flex-direction: column; justify-content: center;
    padding-top: clamp(16px, 3.5vh, 44px); padding-bottom: clamp(16px, 3.5vh, 44px);
  }
  #preguntas .encabezado { margin-bottom: clamp(14px, 3.5vh, 44px); }
  #preguntas h2 { font-size: clamp(2.2rem, 7vh, 4rem); }
  .preguntas { width: 100%; }
  .preguntas summary { padding: clamp(.75rem, 2.6vh, 2rem) 0; font-size: clamp(1.1rem, 3.1vh, 1.9rem); }
  .preguntas details p { margin: clamp(-.5rem, -.6vh, -.2rem) 0 clamp(.8rem, 2.4vh, 2rem); font-size: clamp(.95rem, 2vh, 1.06rem); }
}