/* ════════════════════════════════════════════════════════════
   codigo-etico.css · TIGRE NINJA · Código del Tigre Ninja
   Ética bushido + bienestar moderno. Reutiliza base.css + main.css + main.js.
   ════════════════════════════════════════════════════════════ */

/* ── Ticker de sabiduría diaria ── */
.wisdom-bar{position:relative;z-index:1;max-width:780px;margin:0 auto;padding:1.6rem 1.8rem;text-align:center;border:1px solid var(--border-g);border-radius:12px;background:var(--ink2)}
.wisdom-bar .w-kj{font-family:var(--fj);font-size:1.4rem;color:var(--gold);display:block;margin-bottom:.5rem;text-shadow:0 0 18px rgba(200,162,39,.35)}
.wisdom-bar .w-text{font-family:var(--fj);font-weight:300;font-size:1.1rem;color:var(--parchment);line-height:1.6;white-space:pre-line}
.wisdom-bar .w-src{font-family:var(--fm);font-size:.6rem;letter-spacing:.14em;color:var(--pdim);margin-top:.6rem;text-transform:uppercase}

/* ── Bloque editorial (compartido entre las dos grandes secciones) ── */
.code-section{max-width:840px;margin:0 auto;padding:4rem 1.6rem 2rem;position:relative;z-index:1}
.code-section .kj-watermark{font-size:clamp(200px,28vw,400px);top:-1rem;right:-1rem}
.code-section>h2{font-family:var(--fd);font-weight:900;font-size:clamp(1.8rem,4.2vw,2.8rem);letter-spacing:.03em;margin-bottom:.5rem}
.code-section>.sub{font-family:var(--fb);font-weight:300;font-size:1.05rem;color:var(--pdim);margin-bottom:2.2rem;max-width:700px}
.code-section p{font-family:var(--fb);font-weight:300;font-size:1.02rem;color:rgba(237,230,214,.78);line-height:1.8;margin-bottom:1.2rem}
.code-section p strong{color:var(--parchment);font-weight:600}
.code-section p em{color:var(--cyan);font-style:italic}
.code-section .pull{font-family:var(--fj);font-weight:300;font-size:clamp(1.1rem,2.2vw,1.5rem);color:var(--gold);text-align:center;margin:2rem 0;padding:1.3rem 0;border-top:1px solid var(--border-g);border-bottom:1px solid var(--border-g);letter-spacing:.06em}

/* ── Principio (tarjeta de virtud) ── */
.principle{position:relative;margin-bottom:2.2rem;padding:1.8rem 1.8rem 1.5rem;border:1px solid var(--border);border-radius:14px;background:var(--ink2);overflow:hidden}
.principle::before{content:attr(data-kj);position:absolute;right:-.3rem;bottom:-.8rem;font-family:var(--fj);font-weight:700;font-size:7rem;color:rgba(200,162,39,.06);line-height:1;pointer-events:none}
.principle h3{font-family:var(--fd);font-weight:700;font-size:1.2rem;color:var(--gold);margin-bottom:.15rem;display:flex;align-items:center;gap:.5rem}
.principle h3 .p-kj{font-family:var(--fj);font-size:1.4rem;text-shadow:0 0 14px rgba(200,162,39,.35)}
.principle .p-sub{font-family:var(--fm);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin-bottom:.9rem}
.principle p{position:relative;z-index:1}

/* ── Wellness subsecciones ── */
.well-block{margin-bottom:2rem;padding:1.6rem 1.6rem 1.2rem;border-left:3px solid var(--cyan);border-radius:0 12px 12px 0;background:rgba(0,207,224,.03)}
.well-block h3{font-family:var(--fm);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--cyan);margin-bottom:.7rem;display:flex;align-items:center;gap:.6rem}
.well-block h3::before{content:'';width:16px;height:1px;background:var(--cyan)}
.well-block p{font-family:var(--fb);font-weight:300;font-size:.98rem;color:rgba(237,230,214,.74);line-height:1.8;margin-bottom:.9rem}
.well-block p strong{color:var(--parchment)}

/* Disclaimer */
.disclaimer{max-width:840px;margin:0 auto 3rem;padding:1.2rem 1.6rem;border:1px dashed var(--border-g);border-radius:10px;background:rgba(19,19,38,.45);text-align:center;font-family:var(--fb);font-weight:300;font-size:.92rem;color:var(--pdim);position:relative;z-index:1}
.disclaimer b{color:var(--red);font-weight:600}

/* ── Bloque de recursos externos ── */
.code-resources{max-width:840px;margin:0 auto;padding:1rem 1.6rem 4rem;position:relative;z-index:1}
.code-resources h3{font-family:var(--fm);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;display:flex;align-items:center;gap:.6rem}
.code-resources h3::before{content:'';width:22px;height:1px;background:var(--gold)}
.res-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.7rem}
.res-grid a{display:flex;align-items:center;justify-content:space-between;padding:.65rem .9rem;border:1px solid var(--border);border-radius:8px;background:rgba(255,255,255,.015);font-family:var(--fb);font-size:.88rem;color:var(--parchment);transition:border-color .2s,background .2s}
.res-grid a:hover{border-color:var(--gold);background:var(--goldd)}
.res-grid a .ext{font-family:var(--fm);font-size:.6rem;color:var(--cyan);flex-shrink:0}

/* ── Separador visual entre ética y wellness ── */
.code-divider{max-width:840px;margin:0 auto;padding:0 1.6rem;position:relative;z-index:1}
.code-divider hr{border:none;height:1px;background:linear-gradient(90deg,transparent,var(--gold),var(--cyan),transparent)}
