html { scroll-behavior: smooth; scroll-padding-top: 76px; }
body { margin: 0; }
.pagina { display: block; padding: 0; gap: 0; }
.pagina p { margin: 0; }

.pagina .fv-cabecera { position: sticky; top: 0; z-index: 20; flex-wrap: wrap; padding: 14px max(24px, calc((100% - var(--ancho-sitio)) / 2)); backdrop-filter: blur(8px); }
.menu-boton { display: none; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0; border: 1px solid var(--linea); border-radius: var(--radius-boton); background: transparent; color: var(--texto); cursor: pointer; }
.menu-boton svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; }

.seccion { padding: var(--space-16) 24px; }
.seccion-sup { background: var(--superficie); }
.contenedor { max-width: var(--ancho-sitio); margin: 0 auto; }
.pagina .fv-encabezado { margin-bottom: var(--space-12); }

.hero { padding: var(--space-24) 24px var(--space-16); }
.hero-texto p { margin-bottom: 16px; font-size: 16px; line-height: 1.7; color: var(--texto-2); }
.hero-texto .fv-hero-bajada { color: var(--texto-2); }
.hero-texto .fv-hero-acciones { margin-top: 28px; }

.pagina .fv-banda { padding: var(--space-16) 24px; }

.sobre-mi { max-width: var(--ancho-texto); margin: 0 auto; }
.sobre-mi p:not(.fv-cita) { margin-bottom: 20px; font-size: 16.5px; line-height: 1.75; color: var(--texto-2); }
.sobre-mi p:not(.fv-cita):first-of-type { font-size: 19px; color: var(--texto); }
.sobre-mi .fv-cita { margin: var(--space-12) 0; }

.grilla-servicios { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; align-items: start; }
.grilla-servicios .fv-servicio > p { color: var(--texto-2); }
.servicios-nota { margin-top: var(--space-8) !important; text-align: center; color: var(--texto-2); }
.servicios-nota a, .fv-faq-respuesta a { color: var(--marca); text-decoration: underline; text-underline-offset: 3px; }

.pagina .fv-destacado p { margin-bottom: 16px; }

.grilla-testimonios { columns: 3; column-gap: 24px; }
.grilla-testimonios .fv-testimonio { break-inside: avoid; margin-bottom: 24px; }

.faq { max-width: 760px; margin: 0 auto; }

.contacto { display: grid; grid-template-columns: .85fr 1.15fr; gap: var(--space-12); align-items: start; }
.contacto-texto { display: grid; gap: 14px; align-content: start; }
.contacto-texto .fv-volanta { margin: 0; }
.contacto-texto > p { color: var(--texto-2); font-size: 17px; line-height: 1.65; }
.contacto-texto a.fv-contacto-dato:hover .fv-contacto-valor { color: var(--marca); }
.campo-oculto { position: absolute; left: -9999px; }
.form-nota { font-size: 13px; color: var(--texto-3); }

.pie { padding: var(--space-8) 24px; border-top: 1px solid var(--linea); font-size: 14px; color: var(--texto-3); }
.pie .contenedor { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; }
.pie nav { display: flex; gap: 22px; }
.pie a:hover { color: var(--marca); }

@media (max-width: 980px) {
  .pagina .fv-hero, .pagina .fv-destacado, .contacto { grid-template-columns: 1fr; }
  .pagina .fv-hero-foto { max-width: 440px; }
  .grilla-servicios { grid-template-columns: 1fr; max-width: 640px; margin: 0 auto; }
  .grilla-testimonios { columns: 2; }
  .pagina .fv-destacado .fv-foto { max-width: 280px; }
}

@media (max-width: 860px) {
  .menu-boton { display: inline-flex; }
  .pagina .fv-menu { display: none; order: 3; width: 100%; flex-direction: column; align-items: stretch; gap: 4px; padding: 12px 0 6px; }
  .pagina .fv-cabecera.abierta .fv-menu { display: flex; }
  .pagina .fv-menu a { padding: 10px 0; font-size: 16px; }
  .pagina .fv-menu .fv-btn { justify-content: center; margin-top: 8px; }
}

@media (max-width: 640px) {
  .seccion, .pagina .fv-banda { padding: var(--space-12) 16px; }
  .hero { padding: var(--space-12) 16px; }
  .pagina .fv-cabecera { padding: 12px 16px; }
  .pagina .fv-hero h1 { font-size: 38px; }
  .pagina .fv-titulo-seccion { font-size: 29px; line-height: 1.2; }
  .pagina .fv-destacado { padding: 28px 22px; }
  .pagina .fv-destacado h2 { font-size: 29px; }
  .pagina .fv-cita { font-size: 25px; }
  .grilla-testimonios { columns: 1; }
  .pagina .fv-hero-acciones .fv-btn { flex: 1 1 100%; justify-content: center; }
}
