/* Páginas de scroll largo (M.A.F., Libro, Contacto). Comparten tokens con noche.css. */
html, body { overflow: auto; height: auto; }
.pagina { position: relative; z-index: 2; }
.bloque { position: relative; padding: clamp(80px, 12vh, 140px) clamp(20px, 5vw, 72px); }
.bloque-dentro { width: min(100%, 1180px); margin: 0 auto; }
.heroe { min-height: 100svh; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center; padding-top: 110px; }
.heroe-foto { position: absolute; inset: 0 0 0 46%; z-index: 0; }
.heroe-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; filter: grayscale(1) contrast(1.35) brightness(.7); -webkit-mask-image: linear-gradient(to right, transparent 0, #000 30%), linear-gradient(to bottom, #000 70%, transparent 100%), radial-gradient(ellipse 80% 95% at 45% 35%, #000 42%, transparent 100%); -webkit-mask-composite: source-in, source-in; mask-image: linear-gradient(to right, transparent 0, #000 30%), linear-gradient(to bottom, #000 70%, transparent 100%), radial-gradient(ellipse 80% 95% at 45% 35%, #000 42%, transparent 100%); mask-composite: intersect; }
.heroe-texto { position: relative; z-index: 2; padding-left: clamp(36px, 4vw, 60px); }
.heroe .titular { font-size: clamp(44px, 6.4vw, 104px); max-width: 11ch; }
.dos { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 72px); align-items: center; }
.cuatro { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.cuatro li { padding: 22px 20px 24px; border: 1px solid rgba(201, 165, 90, .35); border-radius: 10px; background: rgba(255, 255, 255, .02); }
.cuatro .ico { display: block; width: 54px; height: 54px; border-radius: 50%; border: 1.5px solid var(--oro-linea); margin-bottom: 14px; background-size: 26px 26px; background-position: center; background-repeat: no-repeat; }
.cuatro b { display: block; font-family: var(--rotulo); font-weight: 500; font-size: 15px; letter-spacing: .2em; text-transform: uppercase; color: var(--oro); margin-bottom: 6px; }
.cuatro span { font-size: 15px; color: var(--gris); }
.pasos { counter-reset: paso; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.pasos li { position: relative; padding: 26px 22px 24px 22px; border-top: 2px solid var(--oro); }
.pasos li::before { counter-increment: paso; content: "0" counter(paso); font-family: var(--cartel); font-size: 54px; line-height: 1; background: var(--metal); -webkit-background-clip: text; background-clip: text; color: transparent; display: block; margin-bottom: 10px; }
.pasos b { display: block; font-family: var(--rotulo); font-weight: 500; font-size: 15px; letter-spacing: .2em; text-transform: uppercase; color: var(--blanco); margin-bottom: 8px; }
.pasos span { font-size: 15px; color: var(--gris); }
.precio { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(28px, 5vw, 64px); align-items: center; padding: clamp(28px, 4vw, 48px); border: 1px solid var(--oro-linea); border-radius: 12px; background: linear-gradient(135deg, rgba(230, 180, 90, .08), rgba(5, 3, 1, 0) 60%); }
.precio-cifra { font-family: var(--cartel); font-size: clamp(64px, 9vw, 140px); line-height: .9; background: var(--metal); -webkit-background-clip: text; background-clip: text; color: transparent; }
.precio-cifra small { display: block; font-family: var(--rotulo); font-weight: 400; font-size: 13px; letter-spacing: .26em; text-transform: uppercase; color: var(--gris); -webkit-text-fill-color: var(--gris); margin-top: 10px; }
.faq { list-style: none; margin: 0; padding: 0; max-width: 820px; }
.faq li { padding: 18px 0; border-bottom: 1px solid rgba(201, 165, 90, .25); }
.faq b { display: block; font-family: var(--cartel); text-transform: uppercase; font-size: 22px; line-height: 1.1; color: var(--blanco); margin-bottom: 6px; }
.faq span { color: var(--gris); font-size: 16px; }
.cierre { text-align: center; }
.cierre .acciones { justify-content: center; }
.pie-pagina { padding: 40px clamp(20px, 5vw, 72px) 60px; border-top: 1px solid rgba(201, 165, 90, .25); text-align: center; font-size: 13px; color: var(--gris); }
.pie-pagina img { width: 170px; margin: 0 auto 12px; }
.pie-pagina p { max-width: 72ch; margin: 0 auto 8px; }
.libro-arriba { padding-top: 70px; }
.titulo-libro { font-family: var(--marca); letter-spacing: .06em; line-height: 1.05; }
.heroe-contacto { min-height: 80svh; }
/* Registro Luz (libro) */
body.luz { background: #F6F1E6; color: #2a2316; color-scheme: light; }
body.luz .cabecera { background: linear-gradient(to bottom, rgba(246, 241, 230, .9), transparent); }
body.luz .marca, body.luz .menu a:hover { color: #8A6528; }
body.luz .menu a { color: #6b5f4a; }
body.luz .titular { color: #2a2316; }
body.luz .titular .oro, body.luz .pincel, body.luz .precio-cifra, body.luz .pasos li::before { background: linear-gradient(180deg, #C9A55A 0%, #9C7429 50%, #D4B46A 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
body.luz .rotulo, body.luz .cuatro b, body.luz .faq b, body.luz .texto b, body.luz .script, body.luz .datos, body.luz .pasos b { color: #8A6528; }
body.luz .texto, body.luz .nota, body.luz .cuatro span, body.luz .faq span, body.luz .pie-pagina { color: #4a3f2c; }
body.luz .cuatro li, body.luz .faq li, body.luz .pie-pagina { border-color: rgba(154, 118, 46, .35); }
body.luz .cuatro li { background: rgba(255, 255, 255, .55); }
body.luz .boton { color: #130d03; }
body.luz .chispas { opacity: .45; }
body.luz .marca-luz { font-family: var(--marca); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #8A6528; }
.libro-portada { width: min(100%, 400px); margin: 0 auto; filter: drop-shadow(0 40px 50px rgba(80, 55, 15, .35)); transform: rotate(-3deg); }
.ficha { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 28px; margin: 24px 0 0; font-size: 15px; }
.ficha b { display: block; font-family: var(--rotulo); font-weight: 500; font-size: 12px; letter-spacing: .24em; text-transform: uppercase; color: #8A6528; }
@media (max-width: 860px) {
  .heroe { grid-template-columns: 1fr; align-items: end; padding-top: 0; }
  .heroe-foto { inset: 0 0 45% 0; }
  .heroe-foto img { -webkit-mask-image: linear-gradient(to bottom, #000 55%, transparent 100%); mask-image: linear-gradient(to bottom, #000 55%, transparent 100%); }
  .heroe-texto { padding: 48vh 0 40px; }
  .dos, .cuatro, .pasos, .precio, .ficha { grid-template-columns: 1fr; }
  .libro-portada { width: min(70%, 300px); }
}
