:root{
  --bg:#FFF8FB; --paper:#FFFFFF; --ink:#03571C; --ink-2:#2C6A3F; --muted:#6F8A7B; --line:#F7D9E7;
  --terra:#E8140F; --terra-2:#F2433C; --terra-soft:#FFE0E3;
  --gold:#FF7EB3; --gold-soft:#FFE3F1; --mint:#FFD3E8; --mint-soft:#E2F4E7;
  --azul:#1E9A48; --azul-osc:#147A37; --azul-soft:#DFF3E5; --sand:#FFEAF3; --bub:#FF7EB3;
  --rosa:#FF7EB3; --rosa-soft:#FFE3F1;
  --radius:22px;
  --display:"Inter Tight", system-ui, sans-serif; --texto:"Outfit", system-ui, sans-serif; --serif:"Instrument Serif", Georgia, serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--texto);font-weight:300;font-size:17px;line-height:1.6}
a{color:var(--terra)}
b,strong{font-weight:600}
img,svg{max-width:100%}
.contenedor{max-width:1120px;margin:0 auto;padding:0 22px}
h1,h2,h3,h4{font-family:var(--display);font-weight:800;letter-spacing:-.03em;line-height:1.02;color:var(--ink)}
.serif-i{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}

/* ---------- Barra superior + cabecera ---------- */
.aviso-top{background:var(--ink);color:var(--bg);font-size:.82rem;text-align:center;padding:9px 16px}
.aviso-top a{color:var(--bub)}
.cabecera{position:sticky;top:0;z-index:20;background:rgba(255,248,251,.88);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px)}
.cabecera .contenedor{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:12px;padding-bottom:12px}
.marca{display:flex;align-items:center;gap:8px;color:var(--ink);text-decoration:none;font-family:var(--display);font-weight:700;font-size:1.45rem;letter-spacing:-.03em}
.marca .serif-i{color:var(--terra);font-size:1.6rem}
.marca svg{width:30px;height:30px}
.menu{display:flex;gap:4px;align-items:center}
.menu a{color:var(--ink);text-decoration:none;font-weight:500;font-size:.9rem;padding:9px 14px;border-radius:999px}
.menu a:hover{background:var(--paper)}
.menu a[aria-current="page"]{background:var(--ink);color:#fff}
.tabbar{display:none}

/* ---------- Portada ---------- */
.portada{padding:34px 0 30px;position:relative;overflow:hidden}
.portada .contenedor{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}
.pill{display:inline-flex;align-items:center;gap:6px;background:var(--rosa-soft);color:var(--terra);font-weight:600;font-size:.8rem;padding:6px 14px;border-radius:999px;margin-bottom:18px}
.pill::before{content:"✦";color:var(--rosa)}
.portada h1{font-size:clamp(3.4rem,10.5vw,6.6rem);line-height:.95;letter-spacing:-.045em;margin:0 0 22px}
.portada h1 > span{display:block}
.portada h1 .l1{color:var(--ink)} .portada h1 .l2{color:var(--azul)} .portada h1 .l3{color:var(--terra)}
.portada h1 i{font-style:normal;color:var(--gold)}
.portada p.lead{font-size:1.12rem;color:var(--ink-2);max-width:40ch;margin:0 0 26px}
.ilustracion{position:relative;display:flex;justify-content:center;align-items:center;min-height:380px}
.ilustracion .circulo{position:absolute;width:min(400px,94%);aspect-ratio:1;border-radius:50%;background:url(/patron.svg) center/76px;box-shadow:0 0 0 10px #fff,0 0 0 13px var(--rosa)}
.ilustracion svg{position:relative;width:min(300px,72%);height:auto;animation:flotar 5s ease-in-out infinite}
.lamina{position:relative;background:#fff;border-radius:20px;padding:14px;width:min(270px,64%);transform:rotate(-4deg);box-shadow:0 30px 50px -22px rgba(3,87,28,.55);animation:flotarL 6s ease-in-out infinite}
.lamina img{display:block;width:100%;height:auto}
.lamina::after{content:"";position:absolute;top:-12px;left:50%;width:70px;height:24px;margin-left:-35px;background:rgba(255,141,199,.75);transform:rotate(3deg);border-radius:3px}
@keyframes flotarL{0%,100%{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(-2deg) translateY(-10px)}}
.chip-float{position:absolute;z-index:2;background:var(--paper);color:var(--ink);border-radius:24px;padding:12px 18px;font-weight:500;font-size:.92rem;line-height:1.3;
  box-shadow:0 22px 40px -16px rgba(3,87,28,.45);animation:flotar 6s ease-in-out infinite}
.chip-float b{display:block;font-family:var(--display);font-weight:800;font-size:1.5rem;letter-spacing:-.03em}
.chip-float.c1{top:6%;left:0;background:var(--rosa);animation-delay:-1s}
.chip-float.c2{bottom:10%;right:0;animation-delay:-3s}
.chip-float.c3{bottom:2%;left:6%;background:var(--terra);color:#fff;font-size:.85rem;padding:9px 14px}
@keyframes flotar{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* ---------- Botones ---------- */
.botones{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;font-family:var(--texto);font-weight:500;font-size:1rem;
  padding:14px 24px;border-radius:999px;text-decoration:none;border:0;transition:transform .15s, background .15s;color:var(--ink)}
.btn:active{transform:scale(.97)}
.btn-rojo{background:var(--ink);color:#fff}
.btn-rojo:hover{background:#02421A}
.btn-claro,.btn-linea{background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn-claro:hover,.btn-linea:hover{box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn-coral{background:var(--terra);color:#fff}
.btn-grande{font-size:1.08rem;padding:17px 30px}
.flecha{transition:transform .15s}.btn:hover .flecha{transform:translateX(3px)}

/* ---------- Cinta ---------- */
.marquee{background:var(--terra);color:var(--bg);overflow:hidden;padding:16px 0;box-shadow:0 14px 30px -18px rgba(3,87,28,.5);margin:10px 0}
.marquee.rev{background:var(--terra);transform:rotate(-1.2deg);margin-top:-6px}
.track{display:flex;gap:28px;width:max-content;font-family:var(--display);font-weight:700;font-size:1.5rem;letter-spacing:-.02em;white-space:nowrap;animation:cinta 28s linear infinite}
.marquee.rev .track{animation-direction:reverse}
.track i{font-style:normal;color:var(--rosa)}
@keyframes cinta{to{transform:translateX(-50%)}}

/* ---------- Secciones ---------- */
section{padding:56px 0}
h2{font-size:clamp(2rem,5.2vw,3rem);margin:0 0 12px}
h2 .serif-i{color:var(--terra)}
h3{font-size:1.3rem;margin:0 0 6px;letter-spacing:-.02em}
.sub{color:var(--muted);max-width:56ch;margin:0 0 28px;font-size:1.05rem}
.titulo-pag{font-size:clamp(2.4rem,7vw,4rem);margin:0 0 12px;letter-spacing:-.04em}
.titulo-pag .serif-i{color:var(--terra)}

.tarjetas{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.tarjeta{border-radius:var(--radius);padding:26px;text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:transform .2s;min-height:230px}
.tarjeta:nth-child(1){background:var(--terra-soft)} .tarjeta:nth-child(2){background:var(--azul-soft)}
.tarjeta:nth-child(3){background:var(--gold-soft)} .tarjeta:nth-child(4){background:var(--mint-soft)}
a.tarjeta:hover{transform:translateY(-4px)}
.tarjeta .icono{font-size:2.2rem;line-height:1;margin-bottom:auto;padding-bottom:22px}
.tarjeta h3{font-size:1.45rem}
.tarjeta p{margin:0;color:var(--ink-2);font-size:.97rem}
.tarjeta .ir{margin-top:14px;font-weight:600;color:var(--ink)}

/* ---------- Libro ---------- */
.libro{background:var(--rosa);border-radius:36px;padding:44px;display:grid;grid-template-columns:230px 1fr;gap:44px;align-items:center;color:var(--bg);position:relative;overflow:hidden}
.libro::after{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:url(/patron.svg) center/60px;opacity:.3;right:-110px;bottom:-130px}
.libro h2{color:var(--ink)}
.libro h2 .serif-i{color:var(--terra)}
.libro .sub{color:var(--ink)}
.libro .btn-rojo{background:var(--terra)}
.libro .btn-rojo:hover{background:var(--terra-2)}
.portada-libro{aspect-ratio:8.5/11;border-radius:6px 16px 16px 6px;background:#fff;color:var(--terra);display:flex;flex-direction:column;justify-content:space-between;padding:18px;
  box-shadow:inset 9px 0 0 rgba(0,0,0,.14),0 30px 50px -20px rgba(0,0,0,.6);transform:rotate(-4deg);position:relative;z-index:1}
.portada-libro img{width:100%;height:100%;object-fit:cover;border-radius:4px}
.portada-libro .franja{height:22%;margin:-18px -18px 0;border-radius:6px 16px 0 0;background:url(/patron.svg) center/38px}
.portada-libro .elfo-mini{flex:1;min-height:0;background:url(/elfo-lamina.webp) center bottom/contain no-repeat;margin-top:6px}
.portada-libro strong{font-family:var(--display);font-weight:800;font-size:1.9rem;line-height:.95;letter-spacing:-.04em}
.portada-libro span{font-size:.72rem;font-weight:600;color:var(--azul)}
.etiqueta{display:inline-block;background:#fff;color:var(--terra);font-weight:600;font-size:.78rem;padding:5px 12px;border-radius:999px;margin-bottom:14px}

/* ---------- Generadores ---------- */
.generador{background:var(--paper);border-radius:36px;padding:34px;text-align:center;box-shadow:0 30px 60px -40px rgba(3,87,28,.35)}
.filtros{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 0 22px}
.chip{border:0;box-shadow:inset 0 0 0 1.5px var(--line);background:var(--paper);color:var(--azul-osc);font-family:var(--texto);font-weight:500;font-size:.95rem;padding:11px 18px;border-radius:999px;cursor:pointer;transition:all .15s}
.chip:active{transform:scale(.96)}
.chip[aria-pressed="true"]{background:var(--azul);color:#fff;box-shadow:none}
.resultado{min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 22px;margin:0 auto 24px;max-width:640px;border-radius:30px;background:var(--bg)}
.resultado .num{font-weight:600;background:var(--terra-soft);color:var(--terra);padding:5px 14px;border-radius:999px;font-size:.82rem}
.resultado .emoji{font-size:2.8rem;line-height:1;margin:14px 0 2px}
.resultado h3{font-size:clamp(1.8rem,6vw,2.6rem);line-height:1;margin:10px 0 12px;letter-spacing:-.04em}
.resultado p{margin:0;font-size:1.1rem;color:var(--ink-2);max-width:44ch}
.pastillas{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-top:16px}
.pastilla{font-size:.78rem;font-weight:600;padding:4px 12px;border-radius:999px;background:var(--mint-soft);color:var(--ink-2)}
.aparece{animation:aparece .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes aparece{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
.contador{color:var(--muted);font-size:.9rem;margin-top:14px}
.confeti{position:fixed;top:-40px;font-size:1.5rem;pointer-events:none;z-index:50;animation:confeti 1.7s ease-in forwards}
@keyframes confeti{to{transform:translateY(105vh) rotate(540deg)}}

.nombres{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px;margin:0 auto 24px;max-width:760px}
.nombre{border:0;border-radius:var(--radius);padding:20px 16px;font-family:var(--display);font-size:1.45rem;font-weight:800;letter-spacing:-.03em;color:var(--ink);cursor:pointer;transition:transform .15s}
.nombre:nth-child(4n+1){background:var(--terra-soft)}.nombre:nth-child(4n+2){background:var(--azul-soft)}.nombre:nth-child(4n+3){background:var(--gold-soft)}.nombre:nth-child(4n){background:var(--mint-soft)}
.nombre:hover{transform:translateY(-2px)}.nombre:active{transform:scale(.97)}
.nombre small{display:block;font-family:var(--texto);font-size:.75rem;color:var(--muted);font-weight:400;letter-spacing:0;margin-top:4px}
.modos{display:inline-flex;background:var(--bg);border-radius:999px;padding:5px;margin-bottom:22px;gap:2px;flex-wrap:wrap;justify-content:center}
.modos button{border:0;background:transparent;font-family:var(--texto);font-weight:500;font-size:.92rem;padding:10px 16px;border-radius:999px;cursor:pointer;color:var(--muted)}
.modos button[aria-pressed="true"]{background:var(--ink);color:#fff}

/* ---------- Listas ---------- */
.lista-ideas{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:10px}
.lista-ideas li{background:var(--paper);border-radius:18px;padding:16px 18px}
.lista-ideas strong{display:block;font-family:var(--display);font-weight:700;letter-spacing:-.02em;font-size:1.08rem}
.lista-ideas span{color:var(--muted);font-size:.95rem}
.lista-nombres{display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0;list-style:none}
.lista-nombres li{background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--line);border-radius:999px;padding:6px 15px;font-weight:500}
.articulo{max-width:760px}
.articulo p{margin:0 0 16px}
.articulo ol{padding-left:0;list-style:none;counter-reset:n}
.articulo ol li{counter-increment:n;background:var(--paper);border-radius:18px;padding:16px 18px 16px 66px;margin-bottom:10px;position:relative}
.articulo ol li::before{content:counter(n);position:absolute;left:16px;top:14px;width:36px;height:36px;border-radius:50%;background:var(--gold-soft);color:var(--ink);
  display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:800}
.articulo ol li strong{font-family:var(--display);font-weight:700}
.migas{font-size:.88rem;color:var(--muted);margin-bottom:12px}
.migas a{color:var(--muted)}
.aviso{background:var(--azul-soft);color:var(--azul-osc);border-radius:18px;padding:16px 20px}
.aviso a{color:var(--azul-osc);font-weight:600}
.faq details{background:var(--paper);border-radius:18px;padding:18px 22px;margin-bottom:10px}
.faq summary{font-family:var(--display);font-weight:700;letter-spacing:-.02em;font-size:1.12rem;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--terra);font-size:1.4rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq p{margin:10px 0 0;color:var(--ink-2)}

/* ---------- Calendario ---------- */
.cal{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.dia{border-radius:18px;padding:14px;min-height:124px;position:relative}
.dia:nth-child(4n+1){background:var(--terra-soft)}.dia:nth-child(4n+2){background:var(--azul-soft)}.dia:nth-child(4n+3){background:var(--gold-soft)}.dia:nth-child(4n){background:var(--mint-soft)}
.dia b{font-family:var(--display);font-weight:800;font-size:2rem;color:var(--ink);line-height:1;letter-spacing:-.04em}
.dia h4{margin:6px 0 4px;font-size:.98rem;line-height:1.1;letter-spacing:-.02em}
.dia p{margin:0;font-size:.76rem;color:var(--ink-2);line-height:1.35}
.dia .check{position:absolute;top:12px;right:12px;width:20px;height:20px;border:1.5px solid var(--ink);border-radius:50%;background:rgba(255,255,255,.7)}
.hoja{background:var(--paper);border-radius:32px;padding:26px}
.hoja-titulo{text-align:center;margin-bottom:18px}
.hoja-titulo h2{margin:0}
.hoja-titulo p{margin:2px 0 0;color:var(--muted)}

/* ---------- Pie ---------- */
.banda-patron{height:90px;background:url(/patron.svg) center/90px;margin-top:30px}
.pie{color:var(--muted);padding:44px 0 50px;font-size:.9rem}
.pie a{color:var(--ink)}
.pie .contenedor{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}
.pie nav{display:flex;gap:16px;flex-wrap:wrap}

.copiado{position:fixed;left:50%;bottom:100px;transform:translateX(-50%) translateY(170px);background:var(--ink);color:#fff;padding:12px 22px;border-radius:999px;font-weight:500;transition:transform .35s cubic-bezier(.34,1.56,.64,1);z-index:60;white-space:nowrap}
.copiado.ver{transform:translateX(-50%) translateY(0)}

/* ---------- Móvil ---------- */
@media (max-width:760px){
  body{font-size:16.5px;padding-bottom:84px}
  .menu{display:none}
  .aviso-top{font-size:.76rem}
  .tabbar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:12px;right:12px;bottom:12px;z-index:40;background:rgba(255,255,255,.94);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:999px;box-shadow:0 18px 40px -14px rgba(3,87,28,.45),inset 0 0 0 1.5px var(--line);padding:6px;margin-bottom:env(safe-area-inset-bottom)}
  .tabbar a{display:flex;flex-direction:column;align-items:center;gap:1px;text-decoration:none;color:var(--muted);font-weight:500;font-size:.68rem;padding:7px 2px;border-radius:999px}
  .tabbar a span{font-size:1.3rem;line-height:1.1}
  .tabbar a[aria-current="page"]{background:var(--ink);color:#fff}
  .portada{padding:22px 0 16px}
  .portada .contenedor{grid-template-columns:1fr;gap:0}
  .portada h1{font-size:clamp(3.2rem,17vw,5rem)}
  .ilustracion{min-height:300px;margin-top:6px}
  .ilustracion svg{width:190px}
  .ilustracion .circulo{width:280px}
  .lamina{width:180px;padding:10px}
  .chip-float{font-size:.8rem;padding:9px 13px}
  .chip-float b{font-size:1.2rem}
  .botones .btn{flex:1 1 auto}
  .track{font-size:1.2rem}
  section{padding:40px 0}
  .tarjetas{grid-template-columns:1fr 1fr;gap:10px}
  .tarjeta{padding:18px;min-height:190px;border-radius:20px}
  .tarjeta .icono{font-size:1.8rem;padding-bottom:14px}
  .tarjeta h3{font-size:1.12rem}
  .tarjeta p{font-size:.84rem}
  .libro{grid-template-columns:1fr;text-align:center;padding:34px 22px;border-radius:30px;gap:28px}
  .portada-libro{max-width:170px;margin:0 auto}
  .cal{grid-template-columns:repeat(2,1fr)}
  .generador{padding:22px 14px;border-radius:30px}
  .resultado{min-height:260px;border-radius:24px}
  .btn-grande{width:100%}
  .nombres{grid-template-columns:1fr}
}

@media print{
  @page{size:A4;margin:10mm}
  body{background:#fff;font-size:12px;padding:0}
  .cabecera,.aviso-top,.pie,.no-print,.migas,.tabbar{display:none!important}
  section{padding:0}
  .hoja{padding:0}
  .cal{gap:6px}
  .dia{min-height:0;height:38mm;break-inside:avoid;padding:9px;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .dia h4{font-size:11px}.dia p{font-size:8.5px}.dia b{font-size:20px}
  .hoja-titulo{margin-bottom:8px}.hoja-titulo h2{font-size:24px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important}}

/* destellos decorativos */
.destello{position:absolute;pointer-events:none;font-size:2rem;line-height:1;animation:titilar 3s ease-in-out infinite}
.destello.r{color:var(--terra)}.destello.v{color:var(--azul)}.destello.p{color:var(--rosa)}
@keyframes titilar{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(.6) rotate(45deg)}}
.portada{background:radial-gradient(circle at 85% 20%,var(--rosa-soft),transparent 45%)}
.tarjeta:nth-child(3){background:var(--rosa-soft)}
.dia:nth-child(4n+3){background:var(--rosa-soft)}
.nombre:nth-child(4n+3){background:var(--rosa-soft)}
@media print{.banda-patron{display:none}}
@media (max-width:760px){.destello{display:none}}

/* ---------- Generador: extras ---------- */
.resultado.girando h3{animation:rodar .12s linear infinite;opacity:.75}
.resultado.girando .emoji{animation:rodar .12s linear infinite}
@keyframes rodar{0%{transform:translateY(-8px);filter:blur(1.5px)}100%{transform:translateY(8px);filter:blur(1.5px)}}
.btn .dado{display:inline-block;transition:transform .3s}
.btn.rodando .dado{animation:dado .5s linear infinite}
@keyframes dado{to{transform:rotate(360deg)}}
.btn:disabled{opacity:.5;cursor:not-allowed}
.acciones{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:-8px 0 20px}
.acciones[hidden]{display:none}
.accion{display:inline-flex;align-items:center;gap:6px;border:0;background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--line);color:var(--ink);font-family:var(--texto);font-weight:500;font-size:.95rem;padding:10px 16px;border-radius:999px;cursor:pointer;text-decoration:none;transition:transform .12s}
.accion:active{transform:scale(.95)}
.accion .ico{font-size:1.05rem}
.accion[aria-pressed="true"]{background:var(--rosa-soft);box-shadow:inset 0 0 0 1.5px var(--rosa);color:var(--terra)}
.accion.wa{background:#25D366;color:#fff;box-shadow:none}
.accion.latido .ico{animation:latido .5s ease}
@keyframes latido{30%{transform:scale(1.6)}60%{transform:scale(.9)}}
.favoritas{margin:34px auto 0;max-width:640px;text-align:left;border-top:1.5px dashed var(--line);padding-top:26px}
.favoritas[hidden]{display:none}
.favoritas h3{font-size:1.6rem;text-align:center;margin-bottom:2px}
.favoritas h3 .serif-i{color:var(--terra)}
.favoritas .nota{text-align:center;color:var(--muted);font-size:.9rem;margin:0 0 16px}
.favoritas ol{list-style:none;margin:0;padding:0;counter-reset:f}
.favoritas li{display:flex;align-items:stretch;gap:6px;margin-bottom:8px;counter-increment:f}
.fav-ver{flex:1;text-align:left;border:0;background:var(--rosa-soft);border-radius:16px;padding:12px 16px 12px 52px;cursor:pointer;font-family:var(--texto);color:var(--ink);position:relative}
.fav-ver::before{content:"♥";position:absolute;left:16px;top:12px;color:var(--terra);font-size:1.2rem}
.fav-ver strong{display:block;font-family:var(--display);font-weight:700;letter-spacing:-.02em}
.fav-ver span{font-size:.88rem;color:var(--ink-2);font-weight:300}
.fav-quitar{border:0;background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--line);border-radius:14px;width:44px;cursor:pointer;color:var(--muted);font-size:1rem}
@media (max-width:760px){.acciones{flex-wrap:nowrap;gap:6px}.acciones .accion{flex:1 1 0;justify-content:center;padding:11px 4px;font-size:.84rem;gap:4px;white-space:nowrap}}

/* ---------- Páginas interiores con estética de portada ---------- */
.portada-int{padding:24px 0 26px}
.portada-int h1{font-size:clamp(2.8rem,7.4vw,5.2rem);margin-bottom:18px}
.portada-int .migas{margin-bottom:14px}
.portada-int .ilustracion{min-height:330px}
.portada-int .circulo{width:min(330px,90%)}
.sello{position:relative;width:150px;height:150px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:4.6rem;
  box-shadow:0 30px 50px -22px rgba(3,87,28,.55);animation:flotarL 6s ease-in-out infinite}
.portada-int .chip-float.c1{top:10%;left:2%}
.portada-int .chip-float.c3{bottom:10%;right:6%;left:auto}
.sec-gen{padding-top:34px}
.generador,.hoja{position:relative;overflow:hidden;box-shadow:0 30px 60px -40px rgba(3,87,28,.4),inset 0 0 0 1.5px var(--line)}
.franja-gen{height:46px;margin:-34px -34px 26px;background:url(/patron.svg) center/46px}
.hoja .franja-gen{margin:-26px -26px 20px}
.resultado{background:var(--rosa-soft)}
.chip[aria-pressed="true"]{background:var(--terra);color:#fff}
.chip{color:var(--ink)}
.modos{background:var(--rosa-soft)}
.lista-ideas li:nth-child(4n+1){background:var(--terra-soft)}.lista-ideas li:nth-child(4n+2){background:var(--azul-soft)}
.lista-ideas li:nth-child(4n+3){background:var(--rosa-soft)}.lista-ideas li:nth-child(4n){background:var(--mint-soft)}
.lista-ideas span{color:var(--ink-2)}
h3+.lista-ideas,section h3{margin-top:28px}
.lista-nombres li:nth-child(3n+1){background:var(--rosa-soft);box-shadow:none}.lista-nombres li:nth-child(3n+2){background:var(--azul-soft);box-shadow:none}.lista-nombres li:nth-child(3n){background:var(--terra-soft);box-shadow:none}
.articulo ol li:nth-child(odd){background:var(--rosa-soft)}
.articulo ol li::before{background:#fff;color:var(--terra)}
.aviso{background:var(--azul-soft)}
@media (max-width:760px){
  .portada-int{padding:16px 0 18px}
  .portada-int h1{font-size:clamp(2.5rem,13vw,3.6rem);margin-bottom:12px}
  .portada-int .lado{display:none}
  .portada-int .lead{font-size:1rem;margin-bottom:6px}
  .portada-int .botones{margin-top:16px}
  .franja-gen{margin:-22px -14px 20px;height:38px;background-size:38px}
  .hoja .franja-gen{margin:-26px -26px 18px}
  .sec-gen{padding-top:22px}
}
@media print{.franja-gen{display:none}}
@media (max-width:760px){.modos{display:flex;flex-wrap:nowrap}.modos button{flex:1;padding:10px 6px;font-size:.82rem;white-space:nowrap}}

/* ---------- Cintas cruzadas ---------- */
.cintas{position:relative;height:170px;overflow:hidden;margin:6px 0}
.cintas .marquee{position:absolute;left:-6%;right:-6%;top:50%;margin:0;padding:14px 0}
.cintas .m1{transform:translateY(-50%) rotate(-3.5deg);background:var(--terra);z-index:2}
.cintas .m2{transform:translateY(-50%) rotate(3deg);background:var(--azul)}
.cintas .m2 .track{animation-direction:reverse;animation-duration:34s}
.cintas .m2 .track i{color:#fff}
@media (max-width:760px){
  .cintas{height:150px}
  .cintas .marquee{padding:11px 0}
  .cintas .m1{transform:translateY(-50%) rotate(-9deg)}
  .cintas .m2{transform:translateY(-50%) rotate(8deg)}
  .cintas .track{font-size:1.05rem}
}
@media print{.cintas{display:none}}

/* ---------- Marca ---------- */
.marca img{width:44px;height:auto;display:block;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.marca:hover img{transform:rotate(-10deg) scale(1.08)}
.sello img{width:72%;height:auto}
.sello .mini{position:absolute;right:-6px;bottom:4px;background:#fff;border-radius:50%;width:54px;height:54px;display:flex;align-items:center;justify-content:center;font-size:1.8rem;box-shadow:0 10px 20px -10px rgba(3,87,28,.5)}
.pie .marca-pie{display:flex;align-items:center;gap:10px}
.pie .marca-pie img{width:58px;height:auto;flex-shrink:0;display:block}
.marca img{flex-shrink:0}
@media (max-width:760px){.marca img{width:38px}}