/* =========================================================
   zodiakohz · hoja de estilo única
   Tokens de 06 (Creative Director). No editar a mano fuera
   del bloque :root salvo que cambie el sistema visual.
   ========================================================= */

:root{
  /* Neutros · papel de almanaque */
  --paper:#F5F2EA; --surface:#FFFDF7; --sunk:#EBE7DC;
  --ink:#221F2B; --ink-2:#57536A; --ink-3:#6A657B;
  --rule:#DDD8C9; --rule-soft:#ECE8DD;
  /* Acento único · latón */
  --brass:#7F641F; --brass-soft:#EFE7CE; --brass-ink:#F1EFE8;
  /* Etiqueta de motor · añil (solo «Curso») */
  --indigo:#2F4E8C; --indigo-soft:#DEE4F1;
  /* Semánticos */
  --crit:#9C3826; --crit-soft:#F4DFD9;
  --warn:#8A5A16; --warn-soft:#F3E8D3;
  --ok:#2E6650; --ok-soft:#DCEBE3;
  /* Tipografía */
  --serif:"Literata",Georgia,"Times New Roman",serif;
  --sans:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  /* Medidas */
  --measure:34rem; --tap:44px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#1A1724; --surface:#241F31; --sunk:#151221;
    --ink:#F0ECE3; --ink-2:#B3ADC0; --ink-3:#847E96;
    --rule:#332C44; --rule-soft:#282235;
    --brass:#D4AE63; --brass-soft:#332A17; --brass-ink:#1A1724;
    --indigo:#9DB2E4; --indigo-soft:#1F2740;
    --crit:#E59180; --crit-soft:#3A211D;
    --warn:#D6A455; --warn-soft:#312619;
    --ok:#6FBC9C; --ok-soft:#17332C;
  }
}
:root[data-theme="dark"]{
  --paper:#1A1724; --surface:#241F31; --sunk:#151221;
  --ink:#F0ECE3; --ink-2:#B3ADC0; --ink-3:#847E96;
  --rule:#332C44; --rule-soft:#282235;
  --brass:#D4AE63; --brass-soft:#332A17; --brass-ink:#1A1724;
  --indigo:#9DB2E4; --indigo-soft:#1F2740;
  --crit:#E59180; --crit-soft:#3A211D;
  --warn:#D6A455; --warn-soft:#312619;
  --ok:#6FBC9C; --ok-soft:#17332C;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--serif); font-size:17px; line-height:1.68;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--brass);text-underline-offset:3px;text-decoration-thickness:1px}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px;border-radius:2px}
h1,h2,h3{font-family:var(--serif);margin:0;font-weight:600;line-height:1.16;
 letter-spacing:-.016em;text-wrap:balance}
p{margin:0}
code{font-family:var(--mono);font-size:.86em}

.skip{position:absolute;left:-9999px;top:0;background:var(--brass);color:var(--brass-ink);
 padding:12px 18px;z-index:100;font-family:var(--sans);font-weight:600}
.skip:focus{left:8px;top:8px}

/* ---------- cabecera ---------- */
.bar{border-bottom:1px solid var(--rule);background:var(--paper);position:relative;z-index:10}
.bar-in{max-width:62rem;margin-inline:auto;padding:12px 20px;display:flex;align-items:center;gap:14px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);
 min-height:var(--tap)}
.brand svg{width:26px;height:26px;flex:none;color:var(--brass)}
.brand span{font-family:var(--serif);font-size:1.14rem;font-weight:600;letter-spacing:-.012em}
.brand span i{color:var(--brass);font-style:normal}
.bar nav{margin-left:auto;display:flex;gap:2px;align-items:center}
.bar nav a{font-family:var(--sans);font-size:.85rem;font-weight:500;color:var(--ink-2);
 text-decoration:none;padding:11px 12px;min-height:var(--tap);display:flex;align-items:center;
 border-radius:2px}
.bar nav a:hover{color:var(--ink);background:var(--sunk)}
.tgl{background:none;border:1px solid var(--rule);border-radius:2px;color:var(--ink-2);
 width:var(--tap);height:var(--tap);cursor:pointer;display:flex;align-items:center;
 justify-content:center;flex:none;margin-left:4px}
.tgl:hover{border-color:var(--brass);color:var(--brass)}
.tgl svg{width:17px;height:17px}
/* En móvil el menú NO se oculta: pasa a una tira que se desliza con el dedo.
   Ocultarlo dejaba a la mitad del tráfico —búsquedas de regalo desde el sofá—
   sin forma de llegar a ningún silo salvo volviendo a la portada. */
@media (max-width:640px){
  .bar-in{flex-wrap:wrap;position:relative;gap:0;padding:11px 20px 4px}
  .brand{max-width:calc(100% - 58px)}
  .bar nav{width:100%;order:2;margin:5px -20px 0;padding:0 20px 6px;
   overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
  /* El degradado que insinúa que hay más menú a la derecha va aquí y no sobre
     el propio nav: una máscara en nav recorta también al botón de tema, que
     está posicionado dentro de él. */
  .bar-in::after{content:"";position:absolute;right:0;bottom:6px;width:30px;height:38px;
   pointer-events:none;background:linear-gradient(90deg,transparent,var(--paper))}
  .bar nav::-webkit-scrollbar{display:none}
  .bar nav a{white-space:nowrap;padding:9px 11px;font-size:.83rem;min-height:0}
  .bar nav .tgl{position:absolute;top:9px;right:20px;margin:0}
}

/* ---------- cabecera con imagen ---------- */
.banner{display:grid;margin:0 -20px;border-bottom:1px solid var(--rule);
 background:var(--sunk);overflow:hidden}
/* imagen y velo comparten celda: si el texto crece, el contenedor crece con él */
.banner img,.banner .veil{grid-area:1/1}
.banner img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/1}
.banner.tall img{aspect-ratio:16/9}
.banner .veil{display:flex;align-items:flex-end;
 background:linear-gradient(90deg,rgba(22,24,34,.93) 0%,rgba(22,24,34,.82) 44%,rgba(22,24,34,.10) 82%)}
.banner .veil > div{max-width:62rem;width:100%;margin-inline:auto;padding:56px 20px 26px}
.banner h1{color:#EDEAE2;max-width:20ch}
.banner .lede{color:#CFCDD9;max-width:44ch;margin-top:12px}
@media (max-width:640px){
  .banner img,.banner.tall img{aspect-ratio:1/1}
  .banner .veil{background:linear-gradient(0deg,rgba(22,24,34,.96) 0%,rgba(22,24,34,.86) 48%,rgba(22,24,34,.42) 100%)}
  .banner .veil > div{padding:80px 20px 24px}
}

/* ---------- estructura ---------- */
main{max-width:62rem;margin-inline:auto;padding:0 20px 80px}
.crumb{font-family:var(--mono);font-size:.66rem;letter-spacing:.09em;text-transform:uppercase;
 color:var(--ink-3);padding:20px 0 0}
.crumb a{color:var(--ink-3);text-decoration:none}
.crumb a:hover{color:var(--brass)}
.crumb span{margin:0 7px;opacity:.5}

.head{padding:22px 0 6px;max-width:var(--measure)}
h1{font-size:clamp(1.95rem,5.4vw,2.85rem);font-weight:700;line-height:1.1;letter-spacing:-.026em}
.lede{font-family:var(--serif);font-size:1.12rem;color:var(--ink-2);margin-top:15px;line-height:1.58}

.prose{max-width:var(--measure)}
.prose h2{font-size:1.42rem;margin:38px 0 0}
.prose h3{font-family:var(--sans);font-size:1.02rem;font-weight:600;margin:28px 0 0;
 letter-spacing:0;line-height:1.4}
.prose p{margin-top:14px;color:var(--ink-2)}
.prose p strong,.prose li strong{color:var(--ink);font-weight:600}
.prose ul,.prose ol{margin:14px 0 0;padding-left:21px;color:var(--ink-2)}
.prose li{margin-top:8px}

/* ---------- aviso de afiliación ---------- */
.disclosure{border:1px dashed var(--rule);border-radius:3px;background:var(--surface);
 padding:14px 16px;margin-top:24px;font-family:var(--sans);font-size:.88rem;color:var(--ink-2);
 line-height:1.58;max-width:var(--measure)}
.disclosure b{display:block;font-family:var(--mono);font-size:.58rem;letter-spacing:.13em;
 text-transform:uppercase;color:var(--ink-3);margin-bottom:6px;font-weight:500}

/* ---------- aviso honesto ---------- */
.honest{border-left:3px solid var(--crit);background:var(--crit-soft);border-radius:0 3px 3px 0;
 padding:15px 17px;margin-top:22px;font-family:var(--sans);font-size:.92rem;color:var(--ink-2);
 line-height:1.6;max-width:var(--measure);display:flex;gap:12px}
.honest svg{width:19px;height:19px;flex:none;color:var(--crit);margin-top:2px}
.honest strong{color:var(--ink);font-weight:600}

/* ---------- índice de opciones (bloque 04 de 07) ---------- */
.jump{border:1px solid var(--rule);border-radius:3px;background:var(--surface);margin-top:26px;
 max-width:var(--measure);overflow:hidden}
.jump-h{background:var(--sunk);padding:11px 16px;font-family:var(--mono);font-size:.6rem;
 letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.jump ol{margin:0;padding:0;list-style:none;counter-reset:j}
.jump li{counter-increment:j;border-top:1px solid var(--rule-soft)}
.jump a{display:flex;gap:12px;align-items:baseline;padding:13px 16px;min-height:var(--tap);
 text-decoration:none;color:var(--ink);font-family:var(--sans);font-size:.9rem;font-weight:500}
.jump a::before{content:counter(j);font-family:var(--mono);font-size:.7rem;color:var(--brass);
 flex:none;font-weight:600}
.jump a em{font-style:normal;color:var(--ink-3);font-weight:400;font-size:.84rem}
.jump a:hover{background:var(--sunk)}

/* ---------- ficha de producto · lámina enmarcada ---------- */
.item{border:1px solid var(--rule);background:var(--surface);margin-top:30px;
 max-width:var(--measure);scroll-margin-top:20px;position:relative;
 box-shadow:0 1px 0 rgba(22,24,34,.04)}
:root[data-theme="dark"] .item,
:root:not([data-theme="light"]) .item{box-shadow:none}

/* filete interior: el marco de una lámina impresa */
.item::after{content:"";position:absolute;inset:7px;border:1px solid var(--rule-soft);
 pointer-events:none}

/* cartela superior · número de lámina */
.plate{display:flex;align-items:center;gap:10px;padding:14px 20px 0;position:relative;z-index:1}
.plate .num{font-family:var(--mono);font-size:.6rem;font-weight:600;letter-spacing:.16em;
 text-transform:uppercase;color:var(--brass)}
.plate .line{flex:1;height:1px;background:var(--rule)}

/* zona de imagen enmarcada, con marcas de esquina */
.item-media{margin:12px 20px 0;position:relative;background:var(--sunk);
 aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;
 text-align:center;padding:22px;border:1px solid var(--rule-soft);z-index:1}
.item-media::before,.item-media::after{content:"";position:absolute;width:13px;height:13px;
 border:0 solid var(--brass);opacity:.75;pointer-events:none}
.item-media::before{top:-1px;left:-1px;border-top-width:1.5px;border-left-width:1.5px}
.item-media::after{bottom:-1px;right:-1px;border-bottom-width:1.5px;border-right-width:1.5px}
.item-media .ph{font-family:var(--mono);font-size:.57rem;letter-spacing:.12em;
 text-transform:uppercase;color:var(--ink-3);line-height:1.75;display:flex;
 flex-direction:column;align-items:center;gap:13px}
.item-media .ph .mark{width:44px;height:44px;opacity:.5}
.item-media > img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:12px}
/* dos imágenes: producto sobre blanco + ambiente */
.item-media.doble{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--rule-soft);padding:0}
.item-media.doble > img{position:static;inset:auto;width:100%;height:100%;object-fit:cover;padding:0;
 background:var(--surface)}
.item-media.doble > img:first-child{object-fit:contain;padding:14px}

.item-b{padding:20px 20px 22px;position:relative;z-index:1}
.item h3{font-family:var(--sans);font-size:1.08rem;font-weight:600;margin:0;
 letter-spacing:-.005em;line-height:1.36}
.item h3::after{content:"";display:block;width:34px;height:2px;background:var(--brass);
 margin-top:11px}
.item .facts{font-family:var(--mono);font-size:.71rem;color:var(--ink-3);margin-top:11px;
 font-variant-numeric:tabular-nums;line-height:1.65}
.item .badge{display:inline-block;background:transparent;color:var(--brass);
 box-shadow:inset 0 0 0 1px var(--brass);font-family:var(--mono);font-size:.55rem;
 font-weight:600;letter-spacing:.11em;text-transform:uppercase;padding:3px 7px;
 margin-left:7px;vertical-align:1px}
.item p{margin-top:14px;color:var(--ink-2);font-family:var(--sans);font-size:.93rem;
 line-height:1.64}
.item p strong{color:var(--ink);font-weight:600}
.say{border-left:2px solid var(--brass);padding:3px 0 3px 14px;margin-top:16px}
.say b{display:block;font-family:var(--mono);font-size:.55rem;letter-spacing:.12em;
 text-transform:uppercase;color:var(--ink-3);margin-bottom:5px;font-weight:500}
.say p{margin-top:0;font-family:var(--serif);font-size:1.02rem;color:var(--ink);line-height:1.5}

/* especificaciones */
.spec{margin-top:18px;border:1px solid var(--rule-soft);overflow:hidden}
.spec-h{background:var(--sunk);padding:8px 13px;font-family:var(--mono);font-size:.57rem;
 letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3)}
.spec dl{margin:0;display:grid;grid-template-columns:9.5rem 1fr}
.spec dt,.spec dd{margin:0;padding:8px 13px;font-size:.85rem;border-top:1px solid var(--rule-soft);
 font-family:var(--sans)}
.spec dt{color:var(--ink-3);font-family:var(--mono);font-size:.7rem}
.spec dd{color:var(--ink)}
@media (max-width:520px){.spec dl{grid-template-columns:1fr}
 .spec dd{padding-top:0;border-top:none}}

/* ---------- CTA ---------- */
.cta{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
 min-height:var(--tap);margin-top:19px;letter-spacing:.01em;background:var(--brass);color:var(--brass-ink);
 font-family:var(--sans);font-size:.96rem;font-weight:600;text-decoration:none;
 border:none;border-radius:2px;padding:13px 18px;text-align:center;cursor:pointer}
.cta:hover{filter:brightness(1.09)}
.cta svg{width:15px;height:15px;flex:none}
.cta-note{font-family:var(--mono);font-size:.62rem;color:var(--ink-3);text-align:center;
 margin-top:8px;letter-spacing:.04em}
.cta.ghost{background:transparent;color:var(--brass);box-shadow:inset 0 0 0 1.5px var(--brass)}

/* ---------- FAQ ---------- */
.faq{margin-top:34px;max-width:var(--measure);border-top:1px solid var(--rule)}
.faq details{border-bottom:1px solid var(--rule-soft)}
.faq summary{padding:15px 0;cursor:pointer;font-family:var(--sans);font-size:.96rem;
 font-weight:600;color:var(--ink);list-style:none;display:flex;gap:12px;align-items:flex-start;
 min-height:var(--tap)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";margin-left:auto;color:var(--brass);font-family:var(--mono);
 font-size:1.1rem;line-height:1;flex:none}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 0 16px;color:var(--ink-2);font-family:var(--sans);font-size:.92rem;
 line-height:1.62;max-width:52ch}

/* ---------- hermanas ---------- */
.siblings{margin-top:40px;max-width:var(--measure);border-top:1px solid var(--rule);padding-top:20px}
.siblings b{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;
 color:var(--ink-3);font-weight:500}
.siblings ul{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:2px}
.siblings a{display:block;padding:12px 14px;min-height:var(--tap);background:var(--surface);
 border:1px solid var(--rule-soft);border-radius:2px;text-decoration:none;color:var(--ink);
 font-family:var(--sans);font-size:.9rem;font-weight:500}
.siblings a:hover{border-color:var(--brass)}
.siblings a em{display:block;font-style:normal;font-weight:400;font-size:.8rem;color:var(--ink-3);
 margin-top:3px}

/* ---------- pie ---------- */
footer{border-top:1px solid var(--rule);background:var(--surface);margin-top:60px}
.foot{max-width:62rem;margin-inline:auto;padding:32px 20px 44px;font-family:var(--sans);
 font-size:.83rem;color:var(--ink-3);line-height:1.65}
.foot nav{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:18px}
.foot nav a{color:var(--ink-2);text-decoration:none;font-weight:500;padding:6px 0}
.foot nav a:hover{color:var(--brass)}
.foot p{max-width:70ch;margin-top:10px}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media print{.bar,.cta,.tgl{display:none}}

/* --- cabeceras de silo generadas + glifo en cabecera + imagen de curso --- */
.head .glifo{width:44px;height:44px;opacity:.85;margin-bottom:12px;display:block}
.item-media.cuadrada{aspect-ratio:1/1;padding:0}
.item-media.cuadrada > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;padding:0}
.banner img{background:var(--sunk)}

/* ---------- estrellas de valoración ---------- */
.stars{vertical-align:-2px;margin-right:7px}
.stars .s-off{fill:currentColor;opacity:.2}
.stars .s-on{fill:var(--brass)}
.item .facts .sn{color:var(--ink);font-weight:500;margin-right:7px}

/* ---------- fila de confianza bajo el CTA ---------- */
.trust{list-style:none;margin:14px 0 0;padding:13px 0 0;border-top:1px solid var(--rule-soft);
 display:flex;flex-wrap:wrap;gap:7px 18px}
.trust li{display:flex;align-items:center;gap:7px;font-family:var(--sans);font-size:.735rem;
 color:var(--ink-3);line-height:1.35}
.trust svg{width:14px;height:14px;flex:none;color:var(--brass);opacity:.9}
@media (max-width:560px){.trust{flex-direction:column;gap:8px}}

/* ---------- miniaturas del índice de saltos ---------- */
.jump li.con-mini > a{display:flex;align-items:center;gap:13px}
.jump .mini{width:52px;height:52px;flex:none;object-fit:contain;border-radius:2px;
 background:#fff;padding:3px;box-shadow:inset 0 0 0 1px var(--rule-soft)}
@media (max-width:520px){.jump .mini{width:44px;height:44px}}

/* ---------- runas ---------- */
.runa-inl,.runa-g{font-family:"Noto Sans Runic","Segoe UI Historic","Segoe UI Symbol",var(--serif)}
.runas{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1px;
 background:var(--rule-soft);border:1px solid var(--rule-soft);margin:22px 0 0;
 max-width:var(--wide,72rem)}
.runa{background:var(--surface);display:flex;gap:16px;padding:17px 18px}
.runa-g{font-size:2.5rem;line-height:1;color:var(--brass);flex:none;width:46px;text-align:center}
.runa-t{min-width:0}
.runa h3{font-family:var(--sans);font-size:1rem;font-weight:600;margin:0;letter-spacing:-.004em}
.runa-l{font-family:var(--mono);font-size:.72rem;font-weight:400;color:var(--ink-3);
 text-transform:none;margin-left:3px}
.runa-l::before{content:"/ "}
.runa-s{font-family:var(--mono);font-size:.62rem;letter-spacing:.11em;text-transform:uppercase;
 color:var(--ink-3);margin-top:6px}
.runa p{margin-top:9px;font-family:var(--sans);font-size:.87rem;line-height:1.6;color:var(--ink-2)}
.prose p.tenue{color:var(--ink-3);font-size:.9rem}
@media (max-width:420px){.runa{padding:15px 14px;gap:12px}.runa-g{font-size:2.1rem;width:36px}}

/* ---------- tirada de runas ---------- */
.tirada{max-width:var(--measure);margin:22px 0 0}
.tirada > .cta{max-width:22rem;margin-inline:auto}
.tirada-s{margin-top:26px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
 background:var(--rule-soft);border:1px solid var(--rule-soft)}
.tirada-s:focus{outline:none}
.tirada-c{background:var(--surface);padding:19px 18px 21px}
.tirada-p{font-family:var(--mono);font-size:.57rem;letter-spacing:.12em;text-transform:uppercase;
 color:var(--brass);line-height:1.5;min-height:2.55em}
.tirada-g{font-family:"Noto Sans Runic","Segoe UI Historic","Segoe UI Symbol",var(--serif);
 font-size:3.5rem;line-height:1;color:var(--brass);margin:15px 0 16px}
.tirada-c h3{font-family:var(--sans);font-size:1.05rem;font-weight:600;margin:0}
.tirada-c .runa-s{margin-top:6px}
.tirada-c p{margin-top:11px;font-family:var(--sans);font-size:.87rem;line-height:1.6;color:var(--ink-2)}
.tirada-c p.tirada-q{color:var(--ink-3);font-size:.8rem;font-style:italic;
 padding-bottom:11px;border-bottom:1px solid var(--rule-soft)}
@media (max-width:700px){.tirada-s{grid-template-columns:1fr}.tirada-g{font-size:3rem;margin:12px 0 13px}}

/* ---------- sello de página ---------- */
.head .sello{display:flex;align-items:center;gap:13px;margin-bottom:15px}
.head .sello img{width:34px;height:34px;flex:none;opacity:.9}
.head .sello span{height:1px;flex:1;max-width:190px;
 background:linear-gradient(90deg,var(--brass),transparent)}
@media (max-width:520px){.head .sello img{width:29px;height:29px}}

/* ---------- oráculo sí o no ---------- */
.oraculo{max-width:var(--measure);margin:22px 0 0}
.or-l{display:block;font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;
 text-transform:uppercase;color:var(--ink-3);margin-bottom:9px}
.or-l span{color:var(--ink-3);opacity:.75;letter-spacing:.08em}
.or-i{width:100%;font-family:var(--serif);font-size:1.1rem;color:var(--ink);
 background:var(--surface);border:1px solid var(--rule);border-radius:2px;
 padding:14px 15px;min-height:var(--tap)}
.or-i::placeholder{color:var(--ink-3);opacity:.7}
.or-i:focus{outline:2px solid var(--brass);outline-offset:2px;border-color:var(--brass)}
.oraculo .cta{margin-top:14px;max-width:20rem;margin-inline:auto}
.or-s{margin-top:30px;border:1px solid var(--rule);background:var(--surface);
 padding:26px 24px 24px;text-align:center}
.or-s:focus{outline:none}
.or-p{font-family:var(--serif);font-size:1.05rem;color:var(--ink-3);font-style:italic;
 padding-bottom:18px;border-bottom:1px solid var(--rule-soft);margin-bottom:22px}
.or-r{font-family:var(--serif);font-size:clamp(3.4rem,13vw,5.5rem);font-weight:700;
 line-height:1;letter-spacing:-.03em;color:var(--brass)}
.or-q{margin-top:26px;padding-top:20px;border-top:1px solid var(--rule-soft);
 text-align:left;max-width:46ch;margin-inline:auto}
.or-q b{display:block;font-family:var(--mono);font-size:.57rem;letter-spacing:.13em;
 text-transform:uppercase;color:var(--ink-3);margin-bottom:11px;font-weight:500}
.or-q p{font-family:var(--sans);font-size:.92rem;line-height:1.62;color:var(--ink-2)}
.or-q p+p{margin-top:11px}

/* ---------- sección actual en el menú ---------- */
.bar nav a[aria-current="page"]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--brass)}

/* ---------- pie con secciones ---------- */
.foot-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
 gap:26px 32px;margin-bottom:26px;padding-bottom:24px;border-bottom:1px solid var(--rule)}
.foot-cols nav{display:flex;flex-direction:column;gap:2px;margin:0}
.foot-cols b{font-family:var(--mono);font-size:.58rem;font-weight:500;letter-spacing:.13em;
 text-transform:uppercase;color:var(--ink-3);margin-bottom:9px}
.foot-cols a{color:var(--ink-2);text-decoration:none;font-size:.88rem;padding:4px 0;
 font-family:var(--sans)}
.foot-cols a:hover{color:var(--brass);text-decoration:underline}

/* Banner de página interior: un punto por debajo del de silo. */
.banner.bajo{min-height:0}
.banner.bajo .veil{padding-block:34px}
.banner.bajo h1{font-size:clamp(1.8rem,4.4vw,2.5rem)}

/* ---------- buscador de regalo ---------- */
.busca,.signo-tool{max-width:var(--measure);margin:30px 0 0;border:1px solid var(--rule);
 background:var(--surface);padding:24px 24px 26px}
.busca h2,.signo-tool h2{font-size:1.32rem;margin:0}
.busca-i{font-family:var(--sans);font-size:.9rem;color:var(--ink-2);margin-top:9px}
.busca-p{font-family:var(--mono);font-size:.57rem;letter-spacing:.13em;text-transform:uppercase;
 color:var(--brass);margin-bottom:11px}
.busca #bq{margin-top:22px}
.busca #bq h3,.busca-s h3,.signo-r h3{font-family:var(--serif);font-size:1.3rem;font-weight:700;margin:0}
.busca-o{display:flex;flex-wrap:wrap;gap:9px;margin-top:15px}
.busca-o button{font-family:var(--sans);font-size:.9rem;font-weight:500;color:var(--ink);
 background:var(--paper);border:1px solid var(--rule);border-radius:2px;padding:10px 15px;
 min-height:var(--tap);cursor:pointer;text-align:left}
.busca-o button:hover{border-color:var(--brass);color:var(--brass)}
.busca-atras{margin-top:16px;background:none;border:none;cursor:pointer;padding:6px 0;
 font-family:var(--mono);font-size:.68rem;color:var(--ink-3);text-decoration:underline}
.busca-atras:hover{color:var(--brass)}
.busca-s,.signo-r{margin-top:22px;padding-top:20px;border-top:1px solid var(--rule-soft)}
.busca-s:focus,.signo-r:focus{outline:none}
.busca-s p,.signo-r p{font-family:var(--sans);font-size:.92rem;color:var(--ink-2);margin-top:10px}
.busca-alt{margin-top:18px;padding-top:15px;border-top:1px solid var(--rule-soft);
 display:flex;flex-wrap:wrap;gap:8px 18px;align-items:baseline}
.busca-alt b{font-family:var(--mono);font-size:.57rem;letter-spacing:.12em;text-transform:uppercase;
 color:var(--ink-3);font-weight:500;width:100%}
.busca-alt a{font-size:.9rem}
.busca-n{font-size:.85rem!important;color:var(--ink-3)!important;font-style:italic;margin-top:16px!important}

/* ---------- qué signo es ---------- */
.signo-campos{display:flex;gap:9px;flex-wrap:wrap;margin-top:4px}
.signo-campos .or-i{width:auto;flex:1 1 6rem;min-width:5.5rem}
.signo-campos .cta{margin-top:0;width:auto;flex:0 0 auto;padding-inline:22px}
@media (max-width:520px){.signo-campos .cta{flex:1 1 100%;margin-top:6px}}

/* ---------- cuenta atrás del eclipse ---------- */
.cuenta{max-width:var(--measure);margin:26px 0 0;border:1px solid var(--rule);
 background:var(--surface);padding:22px 24px 24px}
.cuenta-n{font-family:var(--serif);color:var(--brass);line-height:1;
 display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}
.cuenta-n b{font-size:clamp(2rem,6vw,2.9rem);font-weight:700;font-variant-numeric:tabular-nums}
.cuenta-n span{font-family:var(--mono);font-size:.66rem;letter-spacing:.11em;text-transform:uppercase;
 color:var(--ink-3);margin-right:9px}
.cuenta-p{font-family:var(--sans);font-size:.83rem;color:var(--ink-3);margin-top:14px}

/* ---------- estados vivos: hover, foco y seguimiento ---------- */
html{scroll-behavior:smooth}
.item{scroll-margin-top:20px;transition:box-shadow .18s ease,transform .18s ease}
.item:hover{transform:translateY(-2px);box-shadow:0 6px 22px -12px rgba(0,0,0,.45),
 inset 0 0 0 1px var(--brass-soft)}
.item-media img{transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.item:hover .item-media img{transform:scale(1.035)}

.cta{transition:filter .16s ease,box-shadow .16s ease}
.cta svg{transition:transform .18s ease}
.cta:hover svg{transform:translate(2px,-2px)}

.jump li a{transition:background .16s ease,color .16s ease}
.jump li a:hover{background:var(--sunk)}
/* La ficha que estás mirando, señalada en el índice. */
.jump li a.viendo{background:var(--sunk);color:var(--ink)}
.jump li a.viendo em{color:var(--brass)}
.jump .mini{transition:transform .3s ease}
.jump li a:hover .mini,.jump li a.viendo .mini{transform:scale(1.06)}

.siblings a{transition:border-color .16s ease,transform .16s ease}
.siblings a:hover{transform:translateX(2px)}
.busca-o button{transition:border-color .16s ease,color .16s ease,transform .12s ease}
.busca-o button:active{transform:scale(.98)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .item:hover{transform:none}
  .item:hover .item-media img{transform:none}
  .cta:hover svg{transform:none}
  .siblings a:hover{transform:none}
}

/* Resumen de respuestas: ocupa el sitio de las preguntas para que el
   resultado no salte hacia arriba al elegir la última opción. */
.busca-res{list-style:none;margin:15px 0 0;padding:0;display:grid;
 grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;
 background:var(--rule-soft);border:1px solid var(--rule-soft)}
.busca-res li{background:var(--surface);padding:12px 14px;font-family:var(--sans);
 font-size:.92rem;color:var(--ink)}
.busca-res b{display:block;font-family:var(--mono);font-size:.55rem;letter-spacing:.12em;
 text-transform:uppercase;color:var(--ink-3);font-weight:500;margin-bottom:6px}
