/* FICS Company · interior.css — el diseño de la portada en las páginas interiores (pedido de Javi, 03-11-2026).
   Se carga después de styles.css y portada.css, con <body class="pagina-portada pagina-interior">:
   el encabezado y el pie salen de portada.css. Aquí solo se visten las piezas que ya usan las páginas
   (héroe, secciones, precio, tarjetas, pasos, preguntas, contacto, tarifario, páginas legales y pago).
   No cambia ningún texto. */

body.pagina-interior { background: #fff; }
/* El fondo con degradé fijo de la versión anterior se ve detrás de las zonas sin color propio (cuerpo de cada respuesta, pago) */
.pagina-interior .malla { display: none; }

/* ---------- Héroe: banda marina con trama de puntos, como la portada ---------- */
.pagina-interior .hero {
  position: relative; isolation: isolate; overflow: hidden;
  background: #0c1830;
  color: rgba(238, 244, 252, .86);
  padding-block: clamp(3rem, 6vw, 5.4rem) clamp(3.2rem, 6.5vw, 5.8rem);
}
.pagina-interior .hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background-image: radial-gradient(rgba(125, 180, 255, .13) 1px, transparent 1.2px);
  background-size: 24px 24px;
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .9), rgba(0, 0, 0, .25));
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, .9), rgba(0, 0, 0, .25));
}
.pagina-interior .hero :focus-visible { outline-color: var(--p-celeste); }
@media (min-width: 960px) {
  .pagina-interior .hero-grid { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 4rem; }
}
/* El rótulo de arriba, como la insignia de la portada */
.pagina-interior .hero .kicker {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .45rem 1rem; border-radius: 99px;
  border: 1px solid rgba(125, 180, 255, .35); background: rgba(255, 255, 255, .03);
  font-size: .8rem; font-weight: 600; letter-spacing: .01em; text-transform: none; color: #e6eefb;
}
.pagina-interior .hero .kicker::before {
  content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--p-celeste);
}
.pagina-interior .hero h1 {
  margin-top: 1.4rem; max-width: 18ch; color: #fff;
  font-size: clamp(2.1rem, 4.4vw, 3.3rem); line-height: 1.08; font-weight: 700; letter-spacing: -.025em;
}
.pagina-interior .hero h1 em { color: var(--p-celeste); font-size: 1.05em; }
.pagina-interior .hero-sub {
  margin-top: 1.3rem; max-width: 56ch;
  font-size: clamp(1.02rem, 1.5vw, 1.18rem); line-height: 1.6; color: rgba(238, 244, 252, .82);
}
.pagina-interior .hero-sub a { color: #fff; text-decoration: underline; text-decoration-color: rgba(125, 180, 255, .7); text-underline-offset: 4px; }
.pagina-interior .hero-sub strong { color: #fff; }
/* Precio del héroe: grande y en blanco, como «desde $200.000» de la portada */
.pagina-interior .hero-pildora {
  display: block; max-width: 40rem;
  margin-top: 1.6rem; padding: 0;
  background: none; border: 0; border-radius: 0; box-shadow: none;
  font-size: .92rem; font-weight: 500; line-height: 1.5; color: rgba(238, 244, 252, .72);
}
.pagina-interior .hero-pildora strong {
  margin-right: .15rem;
  font-family: var(--display); font-size: clamp(1.8rem, 3vw, 2.2rem); font-weight: 700;
  line-height: 1.1; letter-spacing: -.02em; color: #fff;
}
.pagina-interior .hero-acciones { margin-top: 1.8rem; gap: 1rem 1.6rem; align-items: center; }
.pagina-interior .hero .btn-ghost {
  padding: .6rem 0; background: none; border: 0; border-radius: 0; box-shadow: none;
  color: #fff; font-weight: 600; font-size: .95rem;
  text-decoration: underline; text-decoration-color: rgba(125, 180, 255, .7);
  text-underline-offset: 5px; text-decoration-thickness: 1.5px;
}
.pagina-interior .hero .btn-ghost:hover { color: var(--p-celeste); transform: none; }
.pagina-interior .hero .foto-marco {
  margin: 0; border-radius: 22px;
  border: 1px solid rgba(125, 180, 255, .2);
  background: var(--p-marino-2);
  box-shadow: 0 30px 70px rgba(0, 0, 0, .45);
}

/* ---------- Botones ---------- */
.pagina-interior .btn { padding: .9rem 1.7rem; font-size: .95rem; }
.pagina-interior .btn-primary {
  background: var(--accent); color: #fff;
  box-shadow: 0 12px 28px rgba(26, 99, 216, .32);
}
.pagina-interior .btn-primary:hover { background: var(--accent-2); transform: translateY(-1px); box-shadow: 0 14px 32px rgba(26, 99, 216, .38); }
.pagina-interior .btn-ghost { background: #fff; color: var(--ink); border: 1px solid #c9d5e6; }
.pagina-interior .btn-ghost:hover { border-color: var(--accent); color: var(--accent); transform: translateY(-1px); }
.pagina-interior .btn-wa {
  gap: .65rem; padding: .95rem 1.8rem;
  background: var(--p-verde); color: #fff; font-size: 1rem;
  box-shadow: 0 12px 30px rgba(19, 138, 67, .35);
}
.pagina-interior .btn-wa:hover { background: var(--p-verde-2); }

/* ---------- Secciones: blanco y gris alternados, títulos como la portada ---------- */
.pagina-interior main > .section { background: #fff; padding-block: clamp(3.6rem, 8vw, 6.2rem); }
.pagina-interior main > .section:nth-of-type(even) { background: var(--p-gris); }
/* El tarifario y las páginas legales traen un padding-top mínimo en línea (su héroe era del mismo color): con el héroe
   marino necesitan aire arriba */
.pagina-interior .hero + .section[style] { padding-top: clamp(2.8rem, 6vw, 4.4rem) !important; }
.pagina-interior .section-head { max-width: 760px; margin-bottom: clamp(1.8rem, 4vw, 2.6rem); }
.pagina-interior .section-head h2 {
  max-width: 660px; margin-top: .6rem;
  font-size: clamp(1.85rem, 3.6vw, 2.8rem); font-weight: 700; line-height: 1.12; letter-spacing: -.025em;
}
.pagina-interior .section-head h2 em { font-size: 1.04em; }
.pagina-interior .section-head .lead { margin-top: .9rem; max-width: 60ch; font-size: 1rem; line-height: 1.6; color: var(--ink-soft); }

/* ---------- Precio: recuadro blanco con borde superior azul ---------- */
.pagina-interior .precio-card {
  max-width: 900px; margin-top: 0;
  gap: .5rem 1.4rem;
  background: #fff;
  border: 1px solid var(--p-borde); border-top: 5px solid var(--accent); border-radius: 18px;
  box-shadow: 0 22px 50px rgba(24, 48, 96, .1);
  padding: clamp(1.6rem, 3vw, 2.3rem) clamp(1.4rem, 3vw, 2.3rem);
}
.pagina-interior .precio-card .valor {
  font-size: clamp(2.3rem, 5vw, 3.3rem); line-height: 1; letter-spacing: -.03em; color: var(--ink); text-shadow: none;
}
.pagina-interior .precio-card .meta { font-size: .9rem; font-weight: 600; color: var(--mute); }
.pagina-interior .precio-card--ficha .condiciones-ficha {
  margin-top: 1rem; padding-top: 0; gap: 0 1.8rem; font-size: .95rem;
  border-top: 1px solid var(--p-borde);
}
.pagina-interior .condiciones-ficha dt,
.pagina-interior .condiciones-ficha dd { padding-block: .9rem; border-top: 1px solid var(--p-borde); }
.pagina-interior .condiciones-ficha dt:first-of-type,
.pagina-interior .condiciones-ficha dt:first-of-type + dd { border-top: 0; }
.pagina-interior .condiciones-ficha dt { padding-top: 1.02rem; color: var(--accent); }
.pagina-interior .condiciones-ficha dd { line-height: 1.6; color: var(--ink-soft); }
@media (max-width: 560px) {
  .pagina-interior .condiciones-ficha dt { padding-bottom: .2rem; }
  .pagina-interior .condiciones-ficha dd { padding-top: 0; margin-bottom: 0; border-top: 0; }
}

/* ---------- Tarjetas: como «Por qué confiar» ---------- */
.pagina-interior .tarjetas { gap: 1.1rem; margin-top: 0; }
@media (min-width: 900px) { .pagina-interior .tarjetas--3 { grid-template-columns: repeat(3, 1fr); gap: 1.2rem; } }
.pagina-interior .tarjeta {
  background: var(--p-gris); border: 1px solid var(--p-borde); border-radius: 18px;
  box-shadow: none; padding: 1.5rem 1.5rem 1.4rem;
}
.pagina-interior .tarjeta:hover { transform: none; box-shadow: none; border-color: var(--p-borde); }
.pagina-interior main > .section:nth-of-type(even) .tarjeta { background: #fff; box-shadow: 0 10px 30px rgba(24, 48, 96, .06); }
.pagina-interior .tarjeta-ico {
  width: 40px; height: 40px; margin-bottom: 1.1rem; border-radius: 10px;
  background: #e9f0fc; border: 0; color: var(--accent);
}
.pagina-interior .tarjeta-ico svg { width: 19px; height: 19px; }
.pagina-interior .tarjeta h3 { font-size: 1.18rem; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; }
.pagina-interior .tarjeta p { margin-top: .7rem; font-size: .9rem; line-height: 1.6; color: var(--ink-soft); }
.pagina-interior .tarjeta ul { color: var(--ink-soft); }

/* ---------- Cómo funciona: pasos numerados en círculos, unidos por una línea ---------- */
.pagina-interior .ruta {
  margin-top: clamp(2.8rem, 6vw, 4rem); padding: 0;
  background: none; border: 0; border-radius: 0; box-shadow: none;
}
.pagina-interior .ruta-titulo { font-size: .78rem; letter-spacing: .12em; }
.pagina-interior .ruta-pasos { margin-top: 1.6rem; gap: 2rem; }
.pagina-interior .ruta-pasos li {
  position: relative;
  display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 1.1rem; align-items: start;
}
.pagina-interior .ruta-pasos .n {
  position: relative; z-index: 1;
  width: 56px; height: 56px;
  background: #fff; border: 2px solid var(--accent); color: var(--accent);
  font-size: 1.5rem; line-height: 1;
}
.pagina-interior .ruta-pasos strong { margin-top: .35rem; font-family: var(--display); font-size: 1.12rem; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; }
.pagina-interior .ruta-pasos p { margin-top: .3rem; font-size: .93rem; line-height: 1.55; color: var(--ink-soft); }
.pagina-interior .ruta-pasos li:not(:last-child)::after {
  content: ""; position: absolute;
  left: 27px; top: 62px; bottom: calc(-2rem + 6px);
  border-left: 2px solid rgba(26, 99, 216, .22);
}
@media (min-width: 900px) {
  .pagina-interior .ruta-pasos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.4rem; }
  .pagina-interior .ruta-pasos li { display: block; }
  .pagina-interior .ruta-pasos .n { width: 64px; height: 64px; font-size: 1.7rem; }
  .pagina-interior .ruta-pasos strong { margin-top: 1.3rem; }
  .pagina-interior .ruta-pasos p { max-width: 32ch; }
  .pagina-interior .ruta-pasos li:not(:last-child)::after {
    left: calc(64px + 12px); right: calc(-2.4rem + 12px); top: 31px; bottom: auto;
    border-left: 0; border-top: 2px solid rgba(26, 99, 216, .22);
  }
}

/* ---------- Preguntas: como las de la portada ---------- */
.pagina-interior .faq-lista { margin-top: 0; gap: .9rem; }
@media (min-width: 960px) { .pagina-interior .faq-lista--2col { gap: 1.1rem; } }
.pagina-interior .faq-item {
  padding: 0 1.6rem;
  background: var(--p-gris); border: 1px solid var(--p-borde); border-radius: 14px; box-shadow: none;
}
.pagina-interior main > .section:nth-of-type(even) .faq-item { background: #fff; }
.pagina-interior .faq-item summary { padding-block: 1.4rem; font-size: 1.02rem; line-height: 1.4; }
.pagina-interior .faq-item p,
.pagina-interior .faq-item li { font-size: .92rem; line-height: 1.65; color: var(--ink-soft); }
.pagina-interior .faq-item > :last-child:not(summary) { padding-bottom: 1.5rem; }
.pagina-interior .faq-item a { color: var(--accent); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
/* «Lo que no hacemos»: siempre en contraste con el recuadro que la contiene */
.pagina-interior .limites-lista li { background: #fff; border-color: var(--p-borde); }
.pagina-interior main > .section:nth-of-type(even) .limites-lista li { background: var(--p-gris); }

/* ---------- Contacto: banda marina con el formulario blanco, como la portada ---------- */
.pagina-interior #contacto {
  position: relative; isolation: isolate;
  background: linear-gradient(170deg, #0d1d3a, var(--p-marino) 60%);
  color: rgba(238, 244, 252, .82);
  padding-block: clamp(3.8rem, 8vw, 6.4rem);
}
.pagina-interior #contacto :focus-visible { outline-color: var(--p-celeste); }
.pagina-interior #contacto .form :focus-visible { outline-color: var(--accent); }
@media (min-width: 960px) { .pagina-interior .cierre-grid { align-items: center; gap: 4rem; } }
.pagina-interior #contacto .cierre .kicker { color: var(--p-celeste); }
.pagina-interior #contacto .cierre h2 {
  margin-top: .7rem; color: #fff;
  font-size: clamp(1.9rem, 3.6vw, 2.8rem); font-weight: 700; letter-spacing: -.025em;
}
.pagina-interior #contacto .cierre h2 em { color: var(--p-celeste); }
.pagina-interior .cierre-parrafo { margin-top: 1.1rem; font-size: 1rem; line-height: 1.65; color: rgba(238, 244, 252, .82); }
.pagina-interior .cierre-acciones { margin-top: 1.6rem; gap: 1rem; align-items: center; }
.pagina-interior #contacto .btn-agenda {
  color: #fff; background: rgba(255, 255, 255, .06); border: 1.5px solid rgba(125, 180, 255, .35);
}
.pagina-interior #contacto .btn-agenda:hover { background: rgba(255, 255, 255, .1); border-color: var(--p-celeste); }
.pagina-interior .cierre-condiciones { margin-top: 1.3rem; font-size: .84rem; color: rgba(238, 244, 252, .62); }
.pagina-interior .cierre-contacto a { color: rgba(238, 244, 252, .86); }
.pagina-interior .cierre-contacto a:hover { color: #fff; border-bottom-color: var(--p-celeste); }
.pagina-interior .cierre-contacto .ico { color: var(--p-celeste); }

/* Formulario blanco */
.pagina-interior .form {
  background: #fff; color: var(--ink-soft);
  border: 0; border-radius: 22px;
  box-shadow: 0 30px 70px rgba(0, 0, 0, .35);
  padding: clamp(1.5rem, 3vw, 2.2rem);
}
.pagina-interior .form-titulo {
  display: block;
  font-family: var(--display); font-size: 1.35rem; font-weight: 700; letter-spacing: -.015em;
  text-transform: none; color: var(--ink);
}
.pagina-interior .form label:not(.hp) { font-size: .84rem; font-weight: 600; color: var(--ink); }
.pagina-interior .form input,
.pagina-interior .form select,
.pagina-interior .form textarea {
  background-color: #fff; border: 1px solid #8190a7; border-radius: 10px;
  transition: border-color .2s var(--ease-out), box-shadow .2s var(--ease-out);
}
.pagina-interior .form input:focus,
.pagina-interior .form select:focus,
.pagina-interior .form textarea:focus {
  background-color: #fff; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(26, 99, 216, .15);
}
.pagina-interior .form select { padding-right: 2.4rem; }
.pagina-interior .form input::placeholder,
.pagina-interior .form textarea::placeholder { color: var(--mute); }
.pagina-interior .form button.btn { justify-self: stretch; width: 100%; margin-top: .2rem; }
.pagina-interior .form-nota { font-size: .76rem; line-height: 1.5; color: var(--mute); }

/* ---------- Tarifario: tabla con encabezado marino ---------- */
.pagina-interior .tabla-scroll {
  margin-top: 0;
  background: #fff; border: 1px solid var(--p-borde); border-radius: 18px;
  box-shadow: 0 10px 30px rgba(24, 48, 96, .06);
}
.pagina-interior .tabla th { background: var(--p-marino); color: rgba(238, 244, 252, .86); border-bottom: 0; }
.pagina-interior .tabla td { border-bottom-color: var(--p-borde); }
.pagina-interior .tabla tr.grupo td { background: #e9f0fc; }
.pagina-interior .tabla .precio { font-family: var(--display); }
.pagina-interior .condiciones { font-size: .9rem; line-height: 1.6; color: var(--ink-soft); }
.pagina-interior .condiciones a { color: var(--accent); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.pagina-interior main > .section .hero-acciones { margin-top: 1.8rem; }

/* ---------- Páginas legales ---------- */
.pagina-interior .terminos-grupo { font-family: var(--display); }

/* ---------- Celular ---------- */
@media (max-width: 559px) {
  .pagina-interior .hero h1 { font-size: 2.05rem; }
  .pagina-interior .hero-acciones { flex-direction: column; align-items: flex-start; }
  .pagina-interior .hero .btn-primary,
  .pagina-interior .cierre-acciones .btn-wa { width: 100%; }
  .pagina-interior .faq-item { padding: 0 1.1rem; }
  .pagina-interior .faq-item summary { padding-block: 1.05rem; font-size: .92rem; }
  .pagina-interior .faq-item > :last-child:not(summary) { padding-bottom: 1.1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pagina-interior .btn-primary, .pagina-interior .btn-ghost { transition: none; }
}
@media (max-width: 400px) {
  .pagina-interior .precio-card .valor { font-size: 1.95rem; }
}

/* ---------- Ajustes de la revisión (03-11-2026) ---------- */
/* Precio del héroe en una línea cuando cabe; si no, cortes parejos */
.pagina-interior .hero-pildora { text-wrap: balance; }
.pagina-interior .hero-pildora strong { font-size: clamp(1.8rem, 2.8vw, 2.05rem); }
/* Filas de condiciones: la raya separadora de cada fila va de lado a lado, sin hueco entre rótulo y texto */
.pagina-interior .precio-card--ficha .condiciones-ficha { column-gap: 0; }
.pagina-interior .condiciones-ficha dt { padding-right: 1.8rem; }
/* «Agendar 15 minutos» fuera del contacto (tarifario): botón blanco como los secundarios */
.pagina-interior .btn-agenda {
  background: #fff; color: var(--ink); border: 1px solid #c9d5e6; padding: .9rem 1.6rem; font-size: .95rem;
}
.pagina-interior .btn-agenda svg { color: var(--accent); }
.pagina-interior .btn-agenda:hover { background: #fff; color: var(--accent); border-color: var(--accent); }
/* Contacto: los dos botones del mismo alto; «Agendar» sobre el marino */
.pagina-interior .cierre-acciones { align-items: stretch; }
.pagina-interior #contacto .btn-agenda { padding: .95rem 1.5rem; font-size: 1rem; }
.pagina-interior #contacto .btn-agenda svg { color: var(--p-celeste); }
/* El botón de WhatsApp con su ícono, como en la portada */
.pagina-interior .btn-wa::before {
  content: ""; flex: none; width: 20px; height: 20px; background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C9.4 3 4 8.4 4 15c0 2.1.6 4.2 1.7 6L4 29l8.2-1.6c1.2.6 2.5.9 3.8.9 6.6 0 12-5.4 12-12S22.6 3 16 3zm0 21.8c-1.2 0-2.4-.3-3.5-.8l-.6-.3-4.9 1 1-4.7-.3-.6c-1-1.7-1.5-3.6-1.5-5.4 0-5.4 4.4-9.8 9.8-9.8s9.8 4.4 9.8 9.8-4.4 9.8-9.8 9.8zm5.4-7.3c-.3-.1-1.8-.9-2-1-.3-.1-.5-.1-.7.1-.2.3-.8 1-1 1.2-.2.2-.4.2-.7.1-.3-.1-1.3-.5-2.4-1.5-.9-.8-1.5-1.8-1.7-2.1-.2-.3 0-.5.1-.6.1-.1.3-.3.4-.5.1-.2.2-.3.3-.5.1-.2 0-.4 0-.5-.1-.1-.7-1.6-.9-2.2-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.5s1.1 2.9 1.2 3.1c.1.2 2.1 3.2 5.1 4.5.7.3 1.3.5 1.7.6.7.2 1.4.2 1.9.1.6-.1 1.8-.7 2-1.4.3-.7.3-1.3.2-1.4-.1-.1-.3-.2-.6-.3z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C9.4 3 4 8.4 4 15c0 2.1.6 4.2 1.7 6L4 29l8.2-1.6c1.2.6 2.5.9 3.8.9 6.6 0 12-5.4 12-12S22.6 3 16 3zm0 21.8c-1.2 0-2.4-.3-3.5-.8l-.6-.3-4.9 1 1-4.7-.3-.6c-1-1.7-1.5-3.6-1.5-5.4 0-5.4 4.4-9.8 9.8-9.8s9.8 4.4 9.8 9.8-4.4 9.8-9.8 9.8zm5.4-7.3c-.3-.1-1.8-.9-2-1-.3-.1-.5-.1-.7.1-.2.3-.8 1-1 1.2-.2.2-.4.2-.7.1-.3-.1-1.3-.5-2.4-1.5-.9-.8-1.5-1.8-1.7-2.1-.2-.3 0-.5.1-.6.1-.1.3-.3.4-.5.1-.2.2-.3.3-.5.1-.2 0-.4 0-.5-.1-.1-.7-1.6-.9-2.2-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.5s1.1 2.9 1.2 3.1c.1.2 2.1 3.2 5.1 4.5.7.3 1.3.5 1.7.6.7.2 1.4.2 1.9.1.6-.1 1.8-.7 2-1.4.3-.7.3-1.3.2-1.4-.1-.1-.3-.2-.6-.3z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- Segunda revisión (03-11-2026) ---------- */
/* Precio del héroe en celular: el monto en su línea y la nota debajo, sin cortes a mitad de frase */
@media (max-width: 559px) {
  .pagina-interior .hero-pildora strong { display: block; margin: 0 0 .25rem; }
}
/* Tarifario en celular y tableta: sombra en el borde mientras queda tabla por deslizar */
@media (max-width: 1023px) {
  .pagina-interior .tabla-scroll {
    background:
      linear-gradient(90deg, #fff 30%, rgba(255, 255, 255, 0)) left center / 40px 100% no-repeat local,
      linear-gradient(270deg, #fff 30%, rgba(255, 255, 255, 0)) right center / 40px 100% no-repeat local,
      radial-gradient(farthest-side at 0 50%, rgba(12, 26, 51, .2), transparent) left center / 14px 100% no-repeat scroll,
      radial-gradient(farthest-side at 100% 50%, rgba(12, 26, 51, .2), transparent) right center / 14px 100% no-repeat scroll,
      #fff;
  }
}
/* Formularios: letra de 16 px en celular (iPhone) */
@media (max-width: 767px) {
  .pagina-interior .form input, .pagina-interior .form select, .pagina-interior .form textarea { font-size: 16px; }
}
/* Tableta vertical: 3 tarjetas sin hueco (la tercera ocupa la fila) y foto del héroe más contenida */
@media (min-width: 720px) and (max-width: 899px) {
  .pagina-interior .tarjetas--3 > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 959px) {
  .pagina-interior .hero .foto-marco { width: min(100%, 520px); justify-self: center; }
}
/* Páginas legales: el héroe alineado con la columna de 820 px del contenido */
.pagina-interior main:has(> .section > .wrap[style*="820px"]) > .hero > .wrap { max-width: 820px; }
/* Pie: los botones flotantes no tapan la última línea en celular y tableta */
@media (max-width: 1279px) { body.pagina-interior .footer.p-pie { padding-bottom: 5.6rem; } }