/* Ábrelo · las páginas de ocasión para Google (cumpleanos.html, para-el.html; 2-nov). Los mismos colores y letras de la página
   de ventas (marca/GUIA.md): noche, crema, un solo acento amarillo y Jost. */
:root{--bg:#0E0D0B;--tinta:#F3EAD3;--suave:#BDB3A1;--apagado:#9C9384;--linea:#2A251D;--acento:#F2B834;--boton:#F3EAD3;--boton-t:#141210;
  --sans:"Jost",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-family:var(--sans);font-size:17px;line-height:1.55;color:var(--tinta);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
.cabeza{display:flex;justify-content:center;padding:14px 16px 0}
main{max-width:640px;margin:0 auto;padding:0 20px}
section{padding:40px 0;border-top:1px solid var(--linea)}
section.hero{border-top:0;padding-top:12px;text-align:center}
.ramo{position:relative;width:min(230px,62vw);aspect-ratio:1;margin:0 auto 34px}
.ramo img{position:absolute;object-fit:contain}
.que-es{font-size:14px;color:var(--acento);font-weight:500;margin-top:6px}
h1{font-size:34px;line-height:1.08;font-weight:600;letter-spacing:-.025em;text-wrap:balance;margin-top:8px}
h2{font-size:24px;line-height:1.15;font-weight:600;letter-spacing:-.02em;text-wrap:balance}
.sub{color:var(--suave);margin-top:14px;text-wrap:pretty}
.ctas{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:24px}
.cta{display:flex;align-items:center;justify-content:center;width:100%;max-width:360px;min-height:56px;padding:0 24px;border-radius:999px;text-decoration:none;
  font-weight:600;font-size:17px;color:var(--boton-t);background:var(--boton);text-align:center;transition:background .3s}
.cta:hover{background:#fff}
.cta.claro{background:none;color:var(--tinta);border:1px solid #4A4235}
.cta.claro:hover{border-color:var(--tinta)}
.chico{font-size:14px;color:var(--apagado);margin-top:14px;text-align:center}
.chico b{color:var(--tinta)}
.lista{list-style:none;margin-top:16px;display:grid;gap:14px}
.lista li{color:var(--suave);padding-left:18px;position:relative}
.lista li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--acento)}
.lista b{color:var(--tinta);font-weight:500}
.legal{margin:24px auto 30px;padding:0 20px;font-size:12px;line-height:1.7;color:var(--apagado);text-align:center}
@media (min-width:900px){h1{font-size:44px}main{padding-top:20px}}
