.elemento{--ocre:#B8863B;--ocre2:#E0B04E;--verde:#8AA85A}
    .elemento.agua{--ocre:#3E7F8A;--ocre2:#7FC4CF}.elemento.fuego{--ocre:#B5502A;--ocre2:#E8834A}
    .elemento .page-head .kicker{color:var(--ocre2)}
    .elemento .elemento{font-size:44px;line-height:1;color:var(--ocre2);margin-bottom:6px}
    .elemento section.bloque{padding:26px 0;border-top:1px solid var(--gold-subtle)}
    .elemento h2{font-family:var(--font-title);font-weight:500;font-size:clamp(20px,4.5vw,28px);letter-spacing:.04em;color:var(--gold);margin:0 0 10px}
    .elemento p{color:var(--cream-dim);line-height:1.65;max-width:62ch}
    .elemento p.lead{font-family:var(--font-dish);font-style:italic;font-size:clamp(18px,3.6vw,23px);color:var(--cream);line-height:1.5}
    .elemento figure{margin:16px 0}.elemento figcaption{color:var(--cream-dim);font-size:12.5px;margin-top:6px}
    .elemento svg{display:block;width:100%;height:auto;overflow:visible}
    .elemento .ladder{display:grid;gap:8px;margin:14px 0}.elemento .rung{display:grid;grid-template-columns:3.4rem 1fr;gap:10px;align-items:center}
    .elemento .rung > span{font-family:var(--font-title);font-size:15px;color:var(--gold)}.elemento .bar{height:10px;background:var(--ocre);border-radius:2px}.elemento .bar.mark{background:#D9795F}
    .elemento .rung small{display:block;font-size:12.5px;color:var(--cream-dim);margin-top:3px}
    .elemento .year{display:grid;grid-template-columns:5.5rem 1fr;gap:10px;align-items:center;margin:6px 0}.elemento .year b{font-weight:500;font-size:13px;color:var(--cream)}
    .elemento blockquote{margin:16px 0;padding-left:14px;border-left:2px solid var(--ocre2);font-family:var(--font-dish);font-style:italic;font-size:19px;color:var(--cream);line-height:1.5}
    .elemento .tabla{width:100%;border-collapse:collapse;font-size:13.5px;color:var(--cream-dim)}.elemento .tabla th{font-family:var(--font-title);font-weight:500;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);text-align:left;padding:8px 8px;border-bottom:1px solid var(--gold-subtle)}.elemento .tabla td{padding:8px;border-bottom:1px solid rgba(201,168,76,.15);vertical-align:top}.elemento .tabla td:first-child{color:var(--cream);font-family:var(--font-title)}.elemento .wrapx{overflow-x:auto}
    .elemento ul{padding-left:18px;color:var(--cream-dim);line-height:1.6}.elemento li{margin:6px 0}
    .elemento .big{font-family:var(--font-title);font-size:clamp(44px,12vw,72px);line-height:1;color:var(--gold);font-weight:500}
    .elemento .stat{display:flex;gap:14px;align-items:baseline;margin:14px 0}.elemento .stat p{margin:0;font-size:14px}
    .elemento .aviso{border:1px solid rgba(224,176,78,.5);padding:14px 16px;margin:26px 0 0;font-size:13.5px;line-height:1.55;color:var(--cream-dim)}.elemento .aviso b{color:var(--cream)}.elemento .aviso a{color:var(--gold)}
    .elemento .fuente{font-size:12.5px;color:var(--cream-dim);border-top:1px solid var(--gold-subtle);padding-top:14px;margin-top:20px}
    .elemento .compartir{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
    .elemento .compartir a{padding:10px 18px;border:1px solid var(--gold-subtle);border-radius:999px;color:var(--gold);text-decoration:none;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
    .elemento .cierre{margin-top:26px;padding:22px;border:1px solid var(--gold-subtle);text-align:center}
    .elemento .cierre p{margin:6px auto;color:var(--cream)}
    .elemento .subnav{position:sticky;top:var(--nav-h,0px);z-index:5;margin:10px calc(50% - 50vw) 14px;padding:10px 18px;background:linear-gradient(180deg,rgba(10,9,0,.92),rgba(10,9,0,.55) 65%,rgba(10,9,0,0));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
    .elemento .subnav-in{max-width:860px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:0 6px;flex-wrap:nowrap}
    .elemento .subnav .linea{flex:1 1 30px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-subtle));min-width:20px}.elemento .subnav .linea:last-child{background:linear-gradient(90deg,var(--gold-subtle),transparent)}
    .elemento .subnav a,.elemento nav.subnav a{border:0 !important;border-radius:0 !important;background:none !important;box-shadow:none;margin:0;position:relative;padding:10px 12px 12px;color:var(--cream-dim);text-decoration:none;font-family:var(--font-dish);font-style:italic;font-size:19px;letter-spacing:.02em;text-transform:none;white-space:nowrap;transition:color .25s}
    .elemento .subnav a:hover{color:var(--gold)}.elemento .subnav a.on{color:var(--gold)}
    .elemento .subnav a::after{content:"";position:absolute;left:12px;right:12px;bottom:6px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:center;transition:transform .35s ease}.elemento .subnav a.on::after{transform:scaleX(1)}
    .elemento .subnav .sep{color:var(--gold);opacity:.55;font-size:7px;padding:0 2px;line-height:1}
    @media (max-width:560px){.elemento .subnav{padding:6px 10px}.elemento .subnav-in{flex-wrap:wrap}.elemento .subnav .linea{display:none}.elemento .subnav a{font-size:16.5px;padding:8px 8px 11px}.elemento .subnav a::after{left:8px;right:8px}}
    .elemento section.bloque{scroll-margin-top:calc(var(--nav-h,0px) + 64px)}
    html{scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
    html.js .elemento .bloque{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}html.js .elemento .bloque.vis{opacity:1;transform:none}
    .elemento .bloque.flash h2{animation:brilla 1.4s ease}@keyframes brilla{0%{text-shadow:0 0 0 rgba(226,196,106,0)}35%{text-shadow:0 0 24px rgba(226,196,106,.75)}100%{text-shadow:0 0 0 rgba(226,196,106,0)}}
    @media (prefers-reduced-motion:no-preference){.draw{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);animation:d 2.6s ease-out .35s forwards}@keyframes d{to{stroke-dashoffset:0}}}

    /* logo con la textura viva del elemento dentro de los tres círculos */
    .logo-el{position:relative;width:min(230px,62vw);aspect-ratio:1125/337;margin:0 auto 12px}
    .logo-el .orb{position:absolute;top:2.3%;width:28.6%;height:95.5%;border-radius:50%;overflow:hidden;opacity:.62;background:radial-gradient(circle at 50% 40%,#171208,#070500 70%)}
    .logo-el .orb:nth-child(1){left:1.9%}.logo-el .orb:nth-child(2){left:19%}.logo-el .orb:nth-child(3){left:35.6%}
    .logo-el .fx-canvas{position:absolute;inset:0;width:100%;height:100%;border-radius:50%;filter:blur(.6px)}
    .logo-el svg{position:relative;display:block;width:100%;height:auto;color:var(--gold)}
    .elemento .page-head .elemento-sym{font-size:44px;line-height:1;color:var(--ocre2);margin-bottom:6px}
    .elemento .volver{display:inline-block;margin:0 0 10px;font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);text-decoration:none}
    .capitulos{display:grid;gap:14px;margin:18px 0}
    .cap{position:relative;display:block;padding:20px 18px 18px 20px;border:1px solid var(--gold-subtle);text-decoration:none;color:var(--cream);overflow:hidden;transition:border-color .25s,transform .25s}.cap:hover{border-color:var(--gold);transform:translateY(-2px)}
    .cap .sym{font-size:34px;line-height:1;color:var(--ocre2)}.cap b{display:block;font-family:var(--font-title);font-weight:500;font-size:19px;letter-spacing:.04em;margin:8px 0 4px}.cap span{display:block;color:var(--cream-dim);font-size:14px;line-height:1.5}.cap small{display:block;margin-top:10px;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
    .cap.pronto{opacity:.55}.cap.tierra{--ocre2:#E0B04E}.cap.agua{--ocre2:#7FC4CF}.cap.fuego{--ocre2:#E8834A}
    @media (min-width:700px){.capitulos{grid-template-columns:1fr 1fr 1fr}}

/* eje Consciencia: logo con la quintaesencia (oro vivo) y un halo que respira */
.logo-el.quinta{width:min(250px,64vw);margin-top:6px}
.logo-el.quinta::before{content:"";position:absolute;left:50%;top:50%;width:150%;height:260%;transform:translate(-50%,-50%);background:radial-gradient(ellipse at center,rgba(226,196,106,.22) 0%,rgba(201,168,76,.08) 35%,transparent 65%);pointer-events:none;z-index:-1;animation:respira-halo 6s ease-in-out infinite}
.logo-el.quinta .orb{opacity:.75;background:radial-gradient(circle at 50% 40%,#2a2008,#070500 70%)}
.logo-el.quinta .fx-canvas{filter:blur(.4px) saturate(1.1)}
@keyframes respira-halo{0%,100%{opacity:.7;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.06)}}
@media (prefers-reduced-motion:reduce){.logo-el.quinta::before{animation:none}}
