/* Blueprint x Manuel de León · caja de suscripción (blog, recursos, portada) y páginas /blueprint/.
   Lectura del encargo: newsletter semanal para dueños de negocio de 35-60 años que leen en el teléfono.
   Idea visual: un plano. Papel cobalto (#0b3a8c, el azul de la columna) con retícula fina y tinta blanca; un solo
   acento, el blanco tiza del botón. Letras: Clean 700 (display de la marca) + Public Sans, las mismas del blog.
   Esquinas: 14px bloques, 999px píldoras. La caja vive dentro de páginas con otros estilos: todo va con prefijo
   .bp- y declara sus propios valores para no heredar los de la página anfitriona.
   Cambiar este archivo = subir VERSION_ACTIVOS en newsletter/caja.mjs (y la versión en blueprint/*.html). */
@font-face{font-family:'BP Clean';src:url('/assets/fonts/Clean-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'BP Public Sans';src:url('/assets/fonts/Public-Sans-Latin.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}

.bp-caja,.bp-pagina{
  --bp:#0b3a8c;--bp-hondo:#072a66;--tiza:#ffffff;--tiza-2:#dce6fb;--tiza-3:#adc1ec;
  --fino:rgba(255,255,255,.07);--grueso:rgba(255,255,255,.15);--aviso:#ffe1e1;
  --ease:cubic-bezier(.23,1,.32,1);
  --display:'BP Clean',system-ui,-apple-system,'Segoe UI',sans-serif;
  --texto:'BP Public Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  background-color:var(--bp);
  background-image:linear-gradient(var(--grueso) 1px,transparent 1px),linear-gradient(90deg,var(--grueso) 1px,transparent 1px),linear-gradient(var(--fino) 1px,transparent 1px),linear-gradient(90deg,var(--fino) 1px,transparent 1px);
  background-size:120px 120px,120px 120px,24px 24px,24px 24px;
  color:var(--tiza-2);font:400 18px/1.6 var(--texto);-webkit-font-smoothing:antialiased
}
.bp-caja *,.bp-pagina *{box-sizing:border-box}

/* ── Caja dentro de otras páginas ── */
.bp-caja{display:block;box-sizing:border-box;width:min(100% - 32px,880px);margin:56px auto;padding:clamp(24px,4vw,40px);border-radius:14px;text-align:left;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.bp-caja[data-zona="blog-articulo"]{width:100%;margin:48px 0}
:is(.bp-caja,.bp-pagina) .bp-caja-logo,:is(.bp-caja,.bp-pagina) .bp-logo{display:flex;flex-wrap:wrap;align-items:baseline;gap:.35em;margin:0 0 14px}
:is(.bp-caja,.bp-pagina) .bp-marca{font:700 26px/1 var(--display);letter-spacing:-.02em;color:var(--tiza)}
:is(.bp-caja,.bp-pagina) .bp-x{font:400 16px/1.2 var(--texto);color:var(--tiza-3)}
:is(.bp-caja,.bp-pagina) .bp-caja-titulo{margin:0 0 10px;font:700 clamp(24px,3vw,32px)/1.18 var(--display);letter-spacing:-.015em;text-transform:none;color:var(--tiza);text-wrap:balance}
:is(.bp-caja,.bp-pagina) .bp-caja-bajada{margin:0 0 22px;max-width:60ch;font:400 18px/1.6 var(--texto);color:var(--tiza-2)}

/* ── Formulario ── */
:is(.bp-caja,.bp-pagina) .bp-form{margin:0;max-width:640px}
:is(.bp-caja,.bp-pagina) .bp-label{display:block;margin:0 0 8px;font:600 16px/1.3 var(--texto);color:var(--tiza)}
:is(.bp-caja,.bp-pagina) .bp-fila{display:flex;flex-wrap:wrap;gap:10px}
:is(.bp-caja,.bp-pagina) .bp-input{flex:1 1 260px;min-width:0;min-height:56px;margin:0;padding:0 22px;border:2px solid transparent;border-radius:999px;background:#fff;color:#13213d;font:400 18px/1.2 var(--texto);box-shadow:none;outline:none}
:is(.bp-caja,.bp-pagina) .bp-input::placeholder{color:#6b7896;opacity:1}
:is(.bp-caja,.bp-pagina) .bp-input:focus-visible{border-color:var(--tiza-3);box-shadow:0 0 0 3px rgba(255,255,255,.35)}
:is(.bp-caja,.bp-pagina) .bp-boton{flex:0 0 auto;min-height:56px;margin:0;padding:0 28px;border:0;border-radius:999px;background:var(--tiza);background-image:none;box-shadow:none;color:var(--bp);font:700 18px/1.2 var(--texto);letter-spacing:0;text-transform:none;cursor:pointer;transition:transform .14s var(--ease),background-color .14s var(--ease)}
:is(.bp-caja,.bp-pagina) .bp-boton:active{transform:scale(.97)}
:is(.bp-caja,.bp-pagina) .bp-boton:disabled{cursor:progress;opacity:.75}
:is(.bp-caja,.bp-pagina) .bp-boton:focus-visible{outline:3px solid var(--tiza-3);outline-offset:3px}
@media (hover:hover) and (pointer:fine){:is(.bp-caja,.bp-pagina) .bp-boton:hover{background:#e7eeff}}
:is(.bp-caja,.bp-pagina) .bp-trampa{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
:is(.bp-caja,.bp-pagina) .bp-turnstile:not(:empty){margin-top:12px}
:is(.bp-caja,.bp-pagina) .bp-estado{margin:10px 0 0;font:500 17px/1.5 var(--texto);color:var(--tiza)}
:is(.bp-caja,.bp-pagina) .bp-estado:empty{margin:0}
:is(.bp-caja,.bp-pagina) .bp-estado[data-tipo="error"]{color:var(--aviso)}
:is(.bp-caja,.bp-pagina) .bp-legal{margin:12px 0 0;font:400 15px/1.5 var(--texto);color:var(--tiza-3)}
:is(.bp-caja,.bp-pagina) .bp-legal a,:is(.bp-caja,.bp-pagina) .bp-caja-bajada a{color:var(--tiza-2);text-decoration:underline;text-underline-offset:.2em}
:is(.bp-caja,.bp-pagina) .bp-listo{margin:0;padding:18px 0 4px;outline:none}
:is(.bp-caja,.bp-pagina) .bp-listo-titulo{margin:0 0 6px;font:700 24px/1.25 var(--display);color:var(--tiza)}
:is(.bp-caja,.bp-pagina) .bp-listo-texto{margin:0;font:400 18px/1.6 var(--texto);color:var(--tiza-2)}
@media (max-width:560px){:is(.bp-caja,.bp-pagina) .bp-fila{flex-direction:column}:is(.bp-caja,.bp-pagina) .bp-input,:is(.bp-caja,.bp-pagina) .bp-boton{flex:1 1 auto;width:100%}}

/* ── Páginas /blueprint/ ── */
body.bp-pagina{margin:0;min-height:100vh;display:flex;flex-direction:column}
.bp-pagina a{color:var(--tiza)}
.bp-pagina :is(a,button):focus-visible{outline:3px solid var(--tiza-3);outline-offset:3px;border-radius:6px}
.bp-saltar{position:absolute;left:-10000px;top:8px;padding:10px 16px;background:#fff;color:var(--bp)!important;border-radius:999px;z-index:5}
.bp-saltar:focus{left:16px}
.bp-cabecera{display:flex;justify-content:space-between;align-items:center;gap:16px;width:min(100% - 32px,1160px);margin:0 auto;padding:22px 0}
.bp-cabecera a{font:600 17px/1.2 var(--texto);text-decoration:none}
.bp-cabecera nav{display:flex;gap:20px}
.bp-main{flex:1;width:min(100% - 32px,1160px);margin:0 auto}
.bp-hero{display:grid;gap:48px;align-items:start;padding:32px 0 72px}
@media (min-width:980px){.bp-hero{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:72px;padding-top:56px}}
.bp-titulo{display:flex;flex-wrap:wrap;align-items:baseline;gap:.3em;margin:0 0 22px}
.bp-titulo .bp-marca{font-size:clamp(52px,8vw,92px);letter-spacing:-.035em}
.bp-titulo .bp-x{font-size:clamp(20px,2.4vw,26px)}
.bp-promesa{margin:0 0 16px;font:700 clamp(28px,3.6vw,40px)/1.15 var(--display);letter-spacing:-.015em;color:var(--tiza);text-wrap:balance}
.bp-bajada{margin:0 0 30px;max-width:56ch;font:400 19px/1.65 var(--texto)}
.bp-regalo{margin:22px 0 0;padding-top:18px;border-top:1px solid var(--grueso);font:400 17px/1.55 var(--texto)}
.bp-regalo strong{color:var(--tiza)}
.bp-plano{margin:0;display:grid;gap:24px;grid-template-columns:minmax(0,240px) minmax(0,1fr);align-items:start}
.bp-plano svg{width:100%;height:auto;display:block}
.bp-plano figcaption{grid-column:1/-1;font:700 21px/1.3 var(--display);color:var(--tiza);margin:0}
.bp-partes{margin:0;padding:0;list-style:none;counter-reset:parte;display:grid;gap:12px}
.bp-partes li{counter-increment:parte;display:grid;grid-template-columns:30px 1fr;gap:10px;font:400 17px/1.45 var(--texto)}
.bp-partes li::before{content:counter(parte);display:grid;place-items:center;width:30px;height:30px;border:1.5px solid var(--tiza-3);border-radius:999px;font:700 15px/1 var(--texto);color:var(--tiza)}
.bp-partes strong{color:var(--tiza);font-weight:650}
@media (max-width:560px){.bp-plano{grid-template-columns:1fr}.bp-plano svg{max-width:260px;margin:0 auto}}
.bp-autor{display:grid;grid-template-columns:88px 1fr;gap:20px;align-items:center;max-width:760px;padding:36px 0 64px;border-top:1px solid var(--grueso)}
.bp-autor img{width:88px;height:88px;border-radius:999px;display:block}
.bp-autor h2{margin:0 0 6px;font:700 22px/1.3 var(--display);color:var(--tiza)}
.bp-autor p{margin:0;font:400 18px/1.6 var(--texto)}
.bp-pie{width:min(100% - 32px,1160px);margin:0 auto;padding:24px 0 36px;border-top:1px solid var(--grueso);font:400 15px/1.6 var(--texto);color:var(--tiza-3)}
.bp-pie a{color:var(--tiza-2)}
.bp-aviso{max-width:640px;padding:56px 0 88px}
.bp-aviso h1{margin:0 0 14px;font:700 clamp(34px,5vw,52px)/1.1 var(--display);letter-spacing:-.02em;color:var(--tiza);outline:none}
.bp-aviso p{margin:0 0 18px;font:400 19px/1.6 var(--texto)}
.bp-aviso .bp-boton{display:inline-flex;align-items:center;text-decoration:none}
.bp-aviso [hidden]{display:none}
@media (prefers-reduced-motion:reduce){.bp-boton{transition:none}.bp-boton:active{transform:none}}