/* Alta, entrada y recuperación (v3): formulario a la izquierda, escena de producto a la derecha. Se apoya en sitio.css. */
.a-v3 { --noche: #15130d; --crema: #f6f1df; --oro: #e6d271; background: var(--superficie-alta); }
.a-pantalla { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); min-height: 100vh; min-height: 100dvh; }

/* ——— Lado del formulario ——— */
.a-lado { display: grid; grid-template-rows: auto 1fr auto; min-width: 0; padding: 0 clamp(20px, 5vw, 72px); }
.a-cabeza { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 26px 0; }
.a-cabeza .s-marca { flex: none; }
.a-cambio { margin: 0; font-size: .9375rem; color: var(--tinta-2); text-align: right; }
.a-cambio a { color: var(--acento); font-weight: 600; text-decoration: none; white-space: nowrap; }
.a-cambio a:hover { text-decoration: underline; text-underline-offset: .2em; }
.a-main { display: grid; align-items: center; padding: clamp(12px, 4vh, 48px) 0; }
.a-forma { width: min(100%, 420px); margin-inline: auto; display: grid; gap: 18px; animation: a-sube .7s cubic-bezier(.2, .7, .2, 1) both; }
.a-antetitulo { margin: 0; font: 600 .75rem/1 var(--fuente-ui); letter-spacing: .16em; text-transform: uppercase; color: var(--acento); }
.a-forma h1 { margin: -4px 0 0; font-size: clamp(2.1rem, 1.5rem + 2.2vw, 3rem); line-height: 1.02; letter-spacing: -0.04em; }
.a-bajada { margin: -4px 0 0; color: var(--tinta-2); line-height: 1.55; font-size: 1.0625rem; }
.a-ventajas { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.a-ventajas li { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px 7px 10px; border-radius: 999px; background: color-mix(in oklab, var(--acento) 9%, transparent); color: var(--tinta); font-size: .875rem; font-weight: 600; }
.a-ventajas li::before { content: ""; width: 14px; height: 14px; background: var(--acento); mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.a-forma form { display: grid; gap: 16px; margin-top: 6px; }
.a-forma form[hidden] { display: none; }
.a-forma .s-input { height: 50px; font-size: 1rem; }
.a-etiquetas { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.a-etiquetas a { font-size: .875rem; color: var(--acento); text-decoration: none; font-weight: 600; }
.a-etiquetas a:hover { text-decoration: underline; text-underline-offset: .2em; }
.a-clave { position: relative; }
.a-clave .s-input { width: 100%; padding-right: 52px; }
.a-ver { position: absolute; top: 50%; right: 6px; translate: 0 -50%; width: 40px; height: 40px; display: grid; place-items: center; border: 0; border-radius: 8px; background: transparent; color: var(--tinta-3); cursor: pointer; }
.a-ver:hover, .a-ver[aria-pressed="true"] { color: var(--tinta); background: color-mix(in oklab, var(--tinta) 6%, transparent); }
.a-ver:focus-visible { outline: 2px solid var(--acento); outline-offset: 1px; }
.a-fuerza { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin-top: 2px; }
.a-fuerza i { height: 4px; border-radius: 4px; background: var(--borde-suave); transition: background .25s; }
.a-fuerza[data-nivel="1"] i:nth-child(-n+1) { background: #c2602f; }
.a-fuerza[data-nivel="2"] i:nth-child(-n+2) { background: #c99a2e; }
.a-fuerza[data-nivel="3"] i:nth-child(-n+3) { background: var(--acento); }
.a-fuerza[data-nivel="4"] i { background: var(--acento); }
.a-btn { width: 100%; height: 52px; font-size: 1rem; margin-top: 2px; }
.a-nota { margin: 0; font-size: .8125rem; line-height: 1.5; color: var(--tinta-3); text-align: center; }
.a-volver { margin: 4px 0 0; font-size: .9375rem; }
.a-volver a { color: var(--acento); font-weight: 600; text-decoration: none; }
.a-pie { padding-inline: 0; }

/* ——— Escena (derecha) ——— */
.a-escena { position: sticky; top: 0; height: 100vh; height: 100dvh; overflow: hidden; background: var(--noche); color: var(--crema); isolation: isolate; }
.a-escena__fondo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; z-index: -2; animation: a-respira 24s ease-in-out infinite alternate; }
.a-escena::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgb(21 19 13 / .78), rgb(21 19 13 / .2) 36%, rgb(21 19 13 / .1) 58%, rgb(21 19 13 / .7)); }
.a-escena__contenido { height: 100%; display: grid; grid-template-rows: auto auto 1fr; padding: clamp(40px, 7vh, 80px) clamp(32px, 5vw, 72px); }
.a-escena__antetitulo { margin: 0; font: 600 .75rem/1 var(--fuente-ui); letter-spacing: .16em; text-transform: uppercase; color: var(--oro); }
.a-escena__titular { margin: 14px 0 0; max-width: 12em; font: 600 clamp(2rem, 1.2rem + 2.4vw, 3.4rem)/1.02 var(--fuente-ui); letter-spacing: -0.04em; }
.a-escena__mesa { position: relative; align-self: end; height: min(52vh, 460px); }
.a-libro { position: absolute; left: 2%; bottom: 4%; width: clamp(150px, 15vw, 210px); transform: rotate(-4deg); animation: a-flota 9s ease-in-out infinite alternate; }
.a-musa { position: absolute; right: 0; top: 6%; width: min(78%, 330px); padding: 16px 18px; border-radius: 16px; color: var(--tinta); background: rgb(253 252 246 / .9); backdrop-filter: blur(14px) saturate(1.2); -webkit-backdrop-filter: blur(14px) saturate(1.2); box-shadow: 0 30px 60px -30px rgb(0 0 0 / .6); animation: a-flota 11s -3s ease-in-out infinite alternate; }
.a-musa__cabeza { display: flex; align-items: center; gap: 8px; font: 600 .75rem/1 var(--fuente-ui); letter-spacing: .04em; color: var(--acento); }
.a-musa__punto { width: 7px; height: 7px; border-radius: 50%; background: var(--acento); box-shadow: 0 0 0 4px color-mix(in oklab, var(--acento) 18%, transparent); }
.a-musa p { margin: 10px 0 0; font: 400 1rem/1.55 var(--fuente-lectura); }
.a-musa p span { color: #6c6861; background: linear-gradient(transparent 92%, rgb(108 104 97 / .35) 0); }
.a-musa__teclas { display: flex; gap: 14px; margin-top: 12px; padding-top: 10px; border-top: 1px solid #e3dfd1; font-size: 12px; color: #59554d; }
.a-musa__teclas kbd { font: 600 11px/1 var(--fuente-ui); padding: 3px 6px; margin-right: 4px; border: 1px solid #d5d1c3; border-bottom-width: 2px; border-radius: 5px; background: #fff; }
.a-kdp { position: absolute; right: 6%; bottom: 10%; display: grid; gap: 4px; padding: 14px 16px; border-radius: 14px; background: rgb(21 19 13 / .55); border: 1px solid rgb(246 241 223 / .16); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); animation: a-flota 10s -6s ease-in-out infinite alternate; }
.a-kdp b { display: flex; align-items: center; gap: 8px; font: 600 .9375rem/1.2 var(--fuente-ui); }
.a-kdp b::before { content: ""; width: 16px; height: 16px; border-radius: 50%; background: #8dca80 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4L18 8' fill='none' stroke='%2315130d' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px no-repeat; }
.a-kdp span { font-size: .8125rem; color: rgb(246 241 223 / .72); }

/* Mini portada (la misma de la web) */
.a-v3 .v-mini-portada { aspect-ratio: 2 / 3; border-radius: 3px 6px 6px 3px; padding: 12% 11%; display: grid; align-content: start; gap: 8px; color: #fbf6e6; text-shadow: 0 1px 10px rgb(14 28 27 / .5);
  background: #325654 url("/sitio/img/v3/portada-480.webp") center / cover no-repeat;
  background-image: linear-gradient(180deg, rgb(20 38 37 / .5), transparent 50%), image-set(url("/sitio/img/v3/portada-480.avif") type("image/avif"), url("/sitio/img/v3/portada-480.webp") type("image/webp"));
  box-shadow: inset 6px 0 8px -6px rgb(0 0 0 / .45), 0 40px 60px -24px rgb(0 0 0 / .7); }
.a-v3 .v-mini-portada__autora { font-size: 8px; letter-spacing: .28em; text-transform: uppercase; color: #f3dc8a; font-weight: 600; }
.a-v3 .v-mini-portada b { font: 500 clamp(21px, 2vw, 27px)/.96 var(--fuente-lectura); letter-spacing: -0.03em; }
.a-v3 .v-mini-portada em { display: block; font-style: italic; font-weight: 400; font-size: .62em; line-height: 1.25; color: #f3dc8a; }

@keyframes a-sube { from { opacity: 0; transform: translateY(14px); } }
@keyframes a-flota { to { translate: 0 -12px; } }
@keyframes a-respira { to { transform: scale(1.06); } }

@media (max-width: 960px) {
  .a-pantalla { grid-template-columns: 1fr; }
  .a-escena { display: none; }
  .a-lado { background: linear-gradient(180deg, color-mix(in oklab, var(--acento) 6%, var(--superficie-alta)), var(--superficie-alta) 260px); }
}
@media (max-width: 520px) {
  .a-cabeza { padding: 18px 0; }
  .a-cambio { font-size: .8125rem; }
  .a-forma h1 { font-size: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
  .a-forma, .a-libro, .a-musa, .a-kdp, .a-escena__fondo img { animation: none; }
}

/* Display y titulares en Plus Jakarta Sans. */
.a-forma h1, .a-escena__titular { font-family: var(--fuente-display); }