/* ============================================================
   GOETIA · Oráculo Digital de Sabiduría Ancestral
   Hoja de estilos unificada · v.MMXXVI
   ============================================================ */

:root{
  --bg:#07060c;
  --bg-2:#0d0b18;
  --ink:#f4ecdc;
  --ink-dim:#9590a8;
  --gold:#d4a64a;
  --gold-bright:#f0c870;
  --accent:#d4a64a;       /* override por página */
  --accent-2:#3a2363;     /* override por página */
  --line:rgba(244,236,220,.12);
  --ink-muted:#6f6785;
  --gold-light:var(--gold-bright);
  /* Accent tokens mapped to the gold theme (legacy names kept for ported rules) */
  --violet:var(--gold);
  --violet-light:var(--gold-bright);
  --serif:'Cormorant Garamond',serif;
  --sans:'Space Grotesk',sans-serif;
  --mono:'JetBrains Mono',monospace;
  --display:var(--serif);
  --body:var(--sans);
  --radius-card:4px;
  --radius-input:10px;
  --radius-pill:999px;
  color-scheme: dark;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;cursor:none}
@media(hover:none){body{cursor:auto}}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,textarea,select{font:inherit;color:inherit}

/* ─── Cursor ─────────────────────────────── */
.cursor{position:fixed;width:10px;height:10px;border-radius:50%;background:var(--gold);pointer-events:none;z-index:100001;mix-blend-mode:difference;transform:translate(-50%,-50%)}
.cursor-ring{position:fixed;width:42px;height:42px;border:1px solid var(--gold);border-radius:50%;pointer-events:none;z-index:100000;transform:translate(-50%,-50%);transition:width .25s,height .25s;mix-blend-mode:difference}
.cursor-ring.hover{width:70px;height:70px}
@media(hover:none){.cursor,.cursor-ring{display:none}}

/* ─── Background FX ──────────────────────── */
#stars{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.6}
/* Static ambient glow — cheap, painted once, no blend-mode (avoids per-frame repaint freeze) */
body::before{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse 80% 55% at 50% -8%,color-mix(in srgb,var(--accent) 8%,transparent),transparent 70%)}

main,header,footer{position:relative;z-index:2}
.wrap{max-width:1440px;margin:0 auto;padding:0 48px}
@media(max-width:720px){.wrap{padding:0 24px}}

/* ─── Header ─────────────────────────────── */
.hdr{position:fixed;top:0;left:0;right:0;z-index:100;padding:24px 0;background:linear-gradient(180deg,rgba(7,6,12,.94),rgba(7,6,12,.6) 55%,rgba(7,6,12,0));transition:padding .3s,background .3s}
.hdr.scrolled{padding:14px 0;background:rgba(7,6,12,.96);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:14px}
.brand img{height:38px;filter:drop-shadow(0 0 12px rgba(212,166,74,.4))}
.brand-tag{font-family:var(--mono);font-size:.68rem;color:var(--ink-dim);letter-spacing:.2em;text-transform:uppercase;border-left:1px solid var(--line);padding-left:14px}
.menu{display:flex;gap:38px;list-style:none}
.menu a{font-family:var(--mono);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-dim);transition:color .2s}
.menu a:hover{color:var(--gold)}
.menu a::before{content:"§ ";color:var(--gold);opacity:.5}
.invoke{border:1px solid var(--gold);color:var(--gold);padding:12px 24px;font-family:var(--mono);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;background:transparent;transition:all .3s}
.invoke:hover{background:var(--gold);color:var(--bg)}
@media(max-width:900px){.menu{display:none}}

/* ─── Crumbs ─────────────────────────────── */
.crumbs{padding:140px 0 0;font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-dim)}
.crumbs a{color:var(--ink-dim);transition:color .2s}
.crumbs a:hover{color:var(--gold)}
.crumbs span{color:var(--gold);margin:0 10px}

/* ─── Hero ───────────────────────────────── */
.hero{padding:50px 0 120px;position:relative}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:24px;display:flex;align-items:center;gap:14px}
.eyebrow::before{content:"";width:50px;height:1px;background:var(--gold)}
.hero h1{font-family:var(--serif);font-size:clamp(3.4rem,7.5vw,7.4rem);font-weight:400;line-height:.95;letter-spacing:-.025em;margin-bottom:30px}
.hero h1 em{color:var(--gold);font-style:italic;display:block}
.hero-lead{font-family:var(--serif);font-style:italic;font-size:1.35rem;line-height:1.55;color:var(--ink);margin-bottom:30px;max-width:520px}
.hero-lead::before{content:"";display:block;width:40px;height:1px;background:var(--gold);margin-bottom:20px}
.hero-desc{color:var(--ink-dim);font-size:1rem;line-height:1.85;max-width:520px;margin-bottom:36px}
.hero-cta{display:inline-flex;align-items:center;gap:14px;background:var(--gold);color:var(--bg);padding:20px 40px;font-family:var(--mono);font-size:.74rem;letter-spacing:.24em;text-transform:uppercase;font-weight:500;box-shadow:0 0 60px rgba(212,166,74,.35);transition:all .3s}
.hero-cta:hover{box-shadow:0 0 100px rgba(212,166,74,.6);transform:translateY(-2px)}

.hero-img-wrap{position:relative;display:flex;justify-content:center;align-items:center;min-height:520px}
.hero-img-wrap::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,color-mix(in srgb,var(--accent) 30%,transparent),transparent 60%);filter:blur(50px)}
.hero-img-wrap svg.aura{position:absolute;width:120%;height:120%;animation:rotate 90s linear infinite;opacity:.35}
@keyframes rotate{to{transform:rotate(360deg)}}
.hero-img-wrap img{position:relative;z-index:2;max-width:90%;filter:drop-shadow(0 30px 80px rgba(0,0,0,.7)) drop-shadow(0 0 60px color-mix(in srgb,var(--accent) 45%,transparent));animation:float 6s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@media(max-width:1024px){.hero-grid{grid-template-columns:1fr;gap:60px}.hero-img-wrap{min-height:400px}}

/* ─── Ticker ─────────────────────────────── */
.ticker{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0;overflow:hidden;white-space:nowrap;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 6%,transparent),transparent)}
.ticker-track{display:inline-block;animation:tick 55s linear infinite;font-family:var(--serif);font-size:1.7rem;font-style:italic}
.ticker-track span{margin:0 30px}
.ticker-track i{color:var(--gold);font-style:normal;margin:0 6px;font-size:.8em}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ─── Sections ───────────────────────────── */
.section, .arcana, .suits, .structure, .layers, .shapes, .mounts, .lines, .orders, .symptoms, .excluded, .zodiac, .elements, .styles, .vars, .units, .stats, .engines, .manifesto, .cats-section, .voices, .summon {
  padding: 140px 0;
  position: relative;
}
.section-num{font-family:var(--mono);font-size:.72rem;color:var(--gold);letter-spacing:.3em;text-transform:uppercase;display:inline-flex;align-items:center;gap:12px;margin-bottom:18px}
.section-num::before{content:"";width:40px;height:1px;background:var(--gold)}
.section h2,.dominions h2,.lineage h2,.big3 h2,.houses h2,.planets h2,.cores h2,.table h2,.masters h2,.reviews h2,.contact h2,
.arcana h2,.suits h2,.structure h2,.layers h2,.shapes h2,.mounts h2,.lines h2,.orders h2,.symptoms h2,.excluded h2,.zodiac h2,
.elements h2,.styles h2,.vars h2,.units h2,.stats h2,.engines h2,.manifesto h2,.cats-section h2,.voices h2,.summon h2 {
  font-family:var(--serif);font-size:clamp(2.4rem,5vw,4.4rem);font-weight:400;line-height:1.05;letter-spacing:-.02em;margin-bottom:30px;
}
.section h2 em,.dominions h2 em,.lineage h2 em,.big3 h2 em,.houses h2 em,.planets h2 em,.cores h2 em,.table h2 em,.masters h2 em,.reviews h2 em,.contact h2 em{color:var(--gold);font-style:italic}

.split{display:grid;grid-template-columns:1fr 1.6fr;gap:100px;align-items:start}
.split-text p{font-size:1.05rem;line-height:1.85;color:var(--ink-dim);margin-bottom:22px;max-width:640px}
.split-text p strong{color:var(--ink);font-weight:500}
.drop::first-letter{font-family:var(--serif);float:left;font-size:5rem;line-height:.85;padding:8px 14px 0 0;color:var(--gold);font-style:italic}
@media(max-width:1024px){.split{grid-template-columns:1fr;gap:40px}}

/* ─── Process ────────────────────────────── */
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:60px}
.step{padding:36px 26px;border-top:2px solid var(--gold);background:rgba(13,11,24,.4)}
.step .n{font-family:var(--mono);font-size:.7rem;color:var(--gold);letter-spacing:.2em;margin-bottom:16px}
.step h4{font-family:var(--serif);font-size:1.5rem;font-weight:500;margin-bottom:12px;line-height:1.2}
.step p{font-size:.92rem;color:var(--ink-dim);line-height:1.7}
@media(max-width:900px){.process-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.process-grid{grid-template-columns:1fr}}

/* ─── Reviews ────────────────────────────── */
.reviews{padding:140px 0;border-top:1px solid var(--line)}
.reviews-head{display:flex;justify-content:space-between;align-items:end;flex-wrap:wrap;gap:30px;margin-bottom:70px}
.reviews-rating{font-family:var(--mono);font-size:.78rem;letter-spacing:.18em;color:var(--ink-dim);text-transform:uppercase}
.reviews-rating b{font-family:var(--serif);font-size:3rem;color:var(--gold);display:block;font-style:italic;line-height:1}
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.rev{padding:40px 32px;border:1px solid var(--line);background:rgba(13,11,24,.4);transition:all .4s}
.rev:hover{border-color:var(--gold);transform:translateY(-4px)}
.rev .stars{color:var(--gold);font-size:.85rem;letter-spacing:.3em;margin-bottom:18px}
.rev p{font-family:var(--serif);font-style:italic;font-size:1.12rem;line-height:1.6;margin-bottom:30px}
.rev .who{font-family:var(--mono);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.rev .where{font-family:var(--mono);font-size:.66rem;color:var(--ink-dim);margin-top:6px;letter-spacing:.12em}
@media(max-width:900px){.reviews-grid{grid-template-columns:1fr}}

/* ─── Contact form ───────────────────────── */
.contact{padding:160px 0;border-top:1px solid var(--line);background:radial-gradient(ellipse at center,color-mix(in srgb,var(--accent) 12%,transparent),transparent 70%)}
.contact-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:80px;align-items:start}
.contact-info p{color:var(--ink-dim);font-size:1.05rem;line-height:1.85;margin-bottom:24px;max-width:380px}
.contact-info ul{list-style:none;margin-top:40px}
.contact-info li{font-family:var(--mono);font-size:.78rem;letter-spacing:.16em;color:var(--ink-dim);margin-bottom:14px;text-transform:uppercase}
.contact-info li b{color:var(--gold);font-weight:400;display:inline-block;width:110px}
.form{display:grid;gap:22px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.form-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:22px}
/* ── .row: Country + Phone strip (no .field wrapper) ── */
.row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
@media(max-width:600px){.row{grid-template-columns:1fr}}
.row>label{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;color:var(--gold);text-transform:uppercase;display:block;margin-bottom:10px}
.row>label>select,.row>label>input{display:block;width:100%;background:transparent;border:none;border-bottom:1px solid var(--line);padding:14px 0;color:var(--ink);font-size:1rem;font-family:var(--sans);transition:border-color .3s;outline:none;color-scheme:dark;margin-top:10px}
.row>label>select:focus,.row>label>input:focus{border-bottom-color:var(--gold)}
.row>label>select{-webkit-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 16px) 22px,calc(100% - 10px) 22px;background-size:6px 6px;background-repeat:no-repeat}
.row>label>select option{background:var(--bg);color:var(--ink)}
/* ── .field styles ── */
.field label{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;color:var(--gold);text-transform:uppercase;display:block;margin-bottom:10px}
.field input,.field select,.field textarea{width:100%;background:transparent;border:none;border-bottom:1px solid var(--line);padding:14px 0;color:var(--ink);font-size:1rem;font-family:var(--sans);transition:border-color .3s;outline:none;color-scheme:dark}
.field input:focus,.field select:focus,.field textarea:focus{border-bottom-color:var(--gold)}
.field textarea{resize:vertical;min-height:120px}
.field select{cursor:none;-webkit-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 16px) 22px,calc(100% - 10px) 22px;background-size:6px 6px;background-repeat:no-repeat}
.field select option{background:var(--bg);color:var(--ink)}
.field .hint{font-family:var(--mono);font-size:.58rem;color:var(--ink-dim);margin-top:6px;letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.checkbox{display:flex;align-items:flex-start;gap:12px;font-size:.84rem;color:var(--ink-dim)}
.checkbox input{width:auto;accent-color:var(--gold);margin-top:4px}
.checkbox a{color:var(--gold);text-decoration:underline}
.submit-btn{margin-top:14px;background:var(--gold);color:var(--bg);padding:22px 50px;font-family:var(--mono);font-size:.76rem;letter-spacing:.26em;text-transform:uppercase;font-weight:500;border:none;cursor:none;justify-self:start;transition:all .3s;box-shadow:0 0 60px rgba(212,166,74,.35)}
.submit-btn:hover{box-shadow:0 0 100px rgba(212,166,74,.6);transform:translateY(-2px)}
.submit-btn:disabled{opacity:.5;cursor:not-allowed}
.form-msg{font-family:var(--mono);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;padding:18px 22px;border:1px solid var(--line);margin-top:8px;display:none}
.form-msg.ok{display:block;color:var(--gold);border-color:var(--gold)}
.form-msg.err{display:block;color:#ff7676;border-color:#ff7676}
@media(max-width:1024px){.contact-grid{grid-template-columns:1fr;gap:50px}}
@media(max-width:600px){.form-row,.form-row-3{grid-template-columns:1fr}}

/* ─── Footer ─────────────────────────────── */
.foot{padding:120px 0 40px;background:#040308}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:60px;margin-bottom:80px}
.foot-brand img{height:54px;margin-bottom:24px;filter:drop-shadow(0 0 20px rgba(212,166,74,.4))}
.foot-brand p{color:var(--ink-dim);max-width:340px;font-family:var(--serif);font-style:italic;font-size:1rem;line-height:1.7}
.foot h4{font-family:var(--mono);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:24px}
.foot ul{list-style:none}
.foot li{margin-bottom:12px}
.foot li a{font-size:.92rem;color:var(--ink-dim);transition:color .2s}
.foot li a:hover{color:var(--gold)}
.foot-bot{border-top:1px solid var(--line);padding-top:30px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;color:var(--ink-dim);text-transform:uppercase}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr;gap:40px}}
@media(max-width:560px){.foot-grid{grid-template-columns:1fr}}

/* ─── Reveal ─────────────────────────────── */
/* Content is visible by default; only hidden (for the fade-in) when JS is active.
   This guarantees the page is never blank if JS fails, is disabled, or is slow. */
.reveal{opacity:1;transform:none}
html.js .reveal{opacity:0;transform:translateY(40px);transition:opacity 1s,transform 1s}
html.js .reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html.js .reveal{opacity:1;transform:none;transition:none}}

/* ─── reCAPTCHA + legal ─── */
.grecaptcha-badge{visibility:hidden!important}
.recaptcha-notice{font-size:.72rem;color:#8a8270;margin:.6rem 0 1rem;font-family:'JetBrains Mono',monospace;line-height:1.6}
.recaptcha-notice a{color:var(--accent);text-decoration:underline}
.chk.legal{display:flex;gap:.6rem;align-items:flex-start;font-size:.85rem;color:#bcb3a0;margin:.8rem 0;line-height:1.5}
.chk.legal a{color:var(--accent);text-decoration:underline}
.chk.legal--spaced{margin-bottom:.6rem}

/* ─── Obfuscated email text ──────────────── */
.eml{color:var(--ink-dim)}

/* ─── Layout utilities ───────────────────── */
.section-num--center{justify-content:center}
.reveal--center{text-align:center;margin-bottom:30px}
.section--bordered{border-top:1px solid var(--line)}

/* ─── Age-gate modal (18+ sections) ──────── */
#age-gate{position:fixed;inset:0;background:rgba(7,6,12,.95);backdrop-filter:blur(8px);z-index:99999;display:flex;align-items:center;justify-content:center;padding:20px;text-align:center}
#age-gate .age-gate-box{border:1px solid var(--gold);padding:40px 30px;max-width:540px;background:rgba(13,11,24,.9)}
#age-gate h2{font-family:var(--serif);font-size:2.5rem;color:var(--gold);margin-bottom:15px;font-style:italic}
#age-gate p{color:var(--ink-dim);font-size:1rem;line-height:1.6;margin-bottom:15px}
#age-gate p.age-gate-legal{font-size:.9rem;margin-bottom:25px}
#age-gate button{background:var(--gold);color:var(--bg);border:none;padding:12px 30px;font-family:var(--sans);font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;font-weight:600}

/* ─── Warn / disclaimer block (18+) ──────── */
.warn{border:1px solid rgba(182,99,58,.4);padding:1.1rem 1.3rem;margin:1.4rem 0 1.8rem;background:rgba(30,14,6,.55);font-family:var(--serif);font-style:italic;color:#d8c3ae;font-size:1rem;line-height:1.65}
.warn strong{font-style:normal;color:#b6633a;letter-spacing:.1em;font-family:var(--mono);font-size:.72rem}

/* ─── Misc section utilities ─────────────── */
.lineage-desc{color:var(--ink-dim);font-size:1.05rem;line-height:1.85;margin-top:20px;max-width:680px}
.field textarea.textarea--tall{min-height:180px}

/* ─── Grimorio & Codex Callouts ─────────────── */
.warn-codex {
  border: 1px solid rgba(212, 166, 74, 0.3);
  padding: 1.5rem 1.8rem;
  margin: 2rem 0;
  background: rgba(20, 16, 42, 0.4);
  border-radius: var(--radius-card);
  font-family: var(--serif);
  font-style: italic;
  color: var(--ink);
  font-size: 1.1rem;
  line-height: 1.75;
  box-shadow: inset 0 0 30px rgba(212, 166, 74, 0.03);
}
.warn-codex em {
  color: var(--gold);
  font-style: normal;
}

ul.salms {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
  margin-top: 30px;
}
ul.salms li {
  background: rgba(20, 16, 42, 0.4);
  border: 1px solid var(--line);
  padding: 20px 24px;
  border-radius: var(--radius-card);
  font-size: 0.95rem;
  color: var(--ink-dim);
  transition: all 0.3s;
  display: flex;
  align-items: center;
  gap: 16px;
}
ul.salms li:hover {
  background: rgba(212, 166, 74, 0.05);
  border-color: rgba(212, 166, 74, 0.3);
  color: var(--ink);
}
ul.salms li span {
  font-family: var(--serif);
  font-size: 1.3rem;
  color: var(--gold);
  font-style: italic;
  min-width: 32px;
  text-align: center;
}

.section-head, .arcana-head, .suits-head, .layers-head, .big3-head, .houses-head,
.planets-head, .dom-head, .cores-head, .masters-head, .table-head, .elements-head,
.zodiac-head, .shapes-head, .lines-head, .mounts-head, .orders-head, .excluded-head,
.symptoms-head, .units-head, .vars-head, .stats-head, .styles-head, .lineage-head {
  margin-bottom: 40px;
}
.kicker {
  font-size: 1.1rem;
  line-height: 1.8;
  color: var(--ink-dim);
  max-width: 780px;
  margin-top: 14px;
}
.kicker strong {
  color: var(--ink);
  font-weight: 500;
}

/* ─── Unified Discipline Grids ───────────────── */
.vars-grid, .orders-grid, .excluded-grid, .symptoms-grid, .symbols-grid,
.layers-grid, .units-grid, .big3-grid, .houses-grid, .planets-grid,
.dom-grid, .table-grid, .shapes-grid, .lines-grid, .mounts-grid,
.masters-grid, .cores-grid, .elements-grid, .lineage-grid, .structure-grid,
.styles-grid, .zodiac-grid, .arcana-grid, .suits-grid, .sigils-grid, .stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
  margin-top: 40px;
}

.var, .order, .exc, article.sym, .layer, .unit, .pillar, .house, .planet, article.dom,
.cell, .shape, .line-c, .mount, .master, .core, article.elt, .lin,
.suit-big, .rank, .sign, .sty, .arc, .suit, .sigil-card, article.sigil, .sigil, .symptom, .style, .stat,
.amor, .dinero, .salud {
  background: rgba(20, 16, 42, 0.4);
  border: 1px solid var(--line);
  padding: 36px 28px;
  border-radius: var(--radius-card);
  transition: border-color 0.3s, background 0.3s;
  display: flex;
  flex-direction: column;
}

.var:hover, .order:hover, .exc:hover, article.sym:hover, .layer:hover, .unit:hover,
.pillar:hover, .house:hover, .planet:hover, article.dom:hover, .cell:hover,
.shape:hover, .line-c:hover, .mount:hover, .master:hover, .core:hover,
article.elt:hover, .lin:hover, .suit-big:hover, .rank:hover, .sign:hover, .sty:hover,
.arc:hover, .suit:hover, .sigil-card:hover, article.sigil:hover, .sigil:hover, .symptom:hover, .style:hover, .stat:hover,
.amor:hover, .dinero:hover, .salud:hover {
  background: rgba(212, 166, 74, 0.05);
  border-color: rgba(212, 166, 74, 0.3);
}

.glyph, .g, .big, .num, .r, .code, .sym {
  font-family: var(--display);
  font-size: 2.2rem;
  color: var(--gold);
  margin-bottom: 16px;
  font-style: italic;
  line-height: 1;
}

.tag, .lbl, .keys span, .name, .nm, .elt, .dom, .sign .d, .sign .el {
  font-family: var(--body);
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 12px;
  display: inline-block;
  font-weight: 600;
}

.keys { margin-top: auto; padding-top: 16px; display: flex; gap: 8px; flex-wrap: wrap; }
.keys span { background: rgba(212,166,74,.1); padding: 4px 8px; border-radius: 4px; margin-bottom: 0; }

.var h3, .order h3, .exc h3, article.sym h3, .layer h3, .unit h3, .pillar h3, .house h3, .planet h3, article.dom h3,
.cell h3, .shape h3, .line-c h3, .mount h3, .master h3, .core h3, article.elt h3, .lin h3,
.suit-big h3, .rank h3, .sign h3, .sty h3, .arc h3, .suit h3, .sigil-card h3, article.sigil h3, .sigil h3, .symptom h3, .style h3, .stat h3,
.amor h3, .dinero h3, .salud h3,
.var h4, .order h4, .exc h4, article.sym h4, .layer h4, .unit h4, .pillar h4, .house h4, .planet h4, article.dom h4,
.cell h4, .shape h4, .line-c h4, .mount h4, .master h4, .core h4, article.elt h4, .lin h4,
.suit-big h4, .rank h4, .sign h4, .sty h4, .arc h4, .suit h4, .sigil-card h4, article.sigil h4, .sigil h4, .symptom h4, .style h4, .stat h4,
.amor h4, .dinero h4, .salud h4,
.var h5, .order h5, .exc h5, article.sym h5, .layer h5, .unit h5, .pillar h5, .house h5, .planet h5, article.dom h5,
.cell h5, .shape h5, .line-c h5, .mount h5, .master h5, .core h5, article.elt h5, .lin h5,
.suit-big h5, .rank h5, .sign h5, .sty h5, .arc h5, .suit h5, .sigil-card h5, article.sigil h5, .sigil h5, .symptom h5, .style h5, .stat h5,
.amor h5, .dinero h5, .salud h5 {
  font-family: var(--display);
  font-size: 1.4rem;
  font-weight: 500;
  color: var(--ink);
  margin-bottom: 14px;
}

.var p, .order p, .exc p, article.sym p, .layer p, .unit p, .pillar p, .house p, .planet p, article.dom p,
.cell p, .shape p, .line-c p, .mount p, .master p, .core p, article.elt p, .lin p,
.suit-big p, .rank p, .sign p, .sty p, .arc p, .suit p, .sigil-card p, article.sigil p, .sigil p, .symptom p, .style p, .stat p,
.amor p, .dinero p, .salud p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--ink-dim);
  margin-bottom: 0;
}

/* ─── Legal & Content Layouts ─────────────── */
.page-content, .page-legal {
  max-width: 860px;
  margin: 0 auto;
  padding: 140px 0 90px;   /* top clears the fixed header (~92px) */
  font-size: 1.05rem;
  line-height: 1.85;
  color: var(--ink-dim);
}
.page-content h1, .page-legal h1 {
  font-family: var(--serif);
  font-size: clamp(2.4rem, 5vw, 3.4rem);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: .01em;
  color: var(--ink);
  margin-bottom: 14px;
}
.page-content > .wrap > p:first-of-type,
.page-legal > .wrap > p:first-of-type { margin-top: 10px; }
.page-content h2, .page-legal h2 {
  font-family: var(--serif);
  font-size: 2.2rem;
  color: var(--gold);
  margin: 40px 0 20px;
}
.page-content p, .page-legal p {
  margin-bottom: 20px;
}
.quote {
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.3rem;
  color: var(--gold);
  border-left: 2px solid var(--gold);
  padding-left: 24px;
  margin: 30px 0;
}
.formula {
  font-family: var(--mono);
  font-size: 0.85rem;
  color: var(--gold);
  background: rgba(20, 16, 42, 0.6);
  border: 1px solid var(--line);
  padding: 16px 20px;
  border-radius: var(--radius-card);
  margin: 20px 0;
}


/* ─── Categories / Bento (portada · sección Disciplinas) ─────────── */
.cats-head{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-bottom:80px;align-items:end}
.cats-head h2{font-family:var(--display);font-size:clamp(2.6rem,5.5vw,5rem);font-weight:500;line-height:1;letter-spacing:.02em;text-transform:uppercase;margin-top:14px}
.cats-head p{color:var(--ink-dim);font-size:1.05rem;max-width:480px;line-height:1.7;justify-self:end}
@media(max-width:900px){.cats-head{grid-template-columns:1fr}.cats-head p{justify-self:start}}

.bento{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:240px;gap:14px}
.tile{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-card);background:linear-gradient(180deg,rgba(20,16,42,.6),rgba(13,10,26,.9));padding:28px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .5s cubic-bezier(.2,.8,.2,1),border-color .5s,background .5s;text-decoration:none;color:var(--ink)}
.tile::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 100%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 60%);opacity:0;transition:opacity .5s}
.tile::after{content:"";position:absolute;top:0;left:0;width:100%;height:2px;background:linear-gradient(90deg,transparent,var(--gold-bright),transparent);transform:scaleX(0);transition:transform .5s}
.tile:hover{border-color:var(--gold);transform:translateY(-4px);background:linear-gradient(180deg,rgba(27,21,54,.8),rgba(20,16,42,.95))}
.tile:hover::before{opacity:1}
.tile:hover::after{transform:scaleX(1)}
.tile-top{display:flex;justify-content:space-between;align-items:flex-start;position:relative;z-index:2}
.tile-idx{font-family:var(--body);font-size:.68rem;font-weight:600;letter-spacing:.18em;color:var(--gold);opacity:.7}
.tile-icon{width:78px;height:78px;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 6px 24px rgba(212,166,74,.25));transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.tile:hover .tile-icon{transform:rotate(8deg) scale(1.08)}
.tile-icon img{max-width:100%;max-height:100%;object-fit:contain}
.tile-body{position:relative;z-index:2}
.tile h3{font-family:var(--display);font-size:1.6rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;margin-bottom:8px;line-height:1.1}
.tile p{font-size:.86rem;color:var(--ink-dim);line-height:1.55;margin-bottom:14px}
.tile-arrow{font-family:var(--body);font-size:.66rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-bright);display:inline-flex;align-items:center;gap:8px}
.tile-arrow::after{content:"→";transition:transform .3s}
.tile:hover .tile-arrow::after{transform:translateX(6px)}

.t-lg{grid-column:span 6;grid-row:span 2}
.t-md{grid-column:span 4;grid-row:span 2}
.t-sm{grid-column:span 3;grid-row:span 1}
.t-rect{grid-column:span 6;grid-row:span 1}
.t-tall{grid-column:span 3;grid-row:span 2}
@media(max-width:1100px){.bento{grid-template-columns:repeat(6,1fr);grid-auto-rows:220px}.t-lg,.t-md,.t-rect{grid-column:span 6;grid-row:span 1}.t-sm,.t-tall{grid-column:span 3;grid-row:span 1}}
@media(max-width:600px){.bento{grid-template-columns:1fr;grid-auto-rows:auto}.t-lg,.t-md,.t-sm,.t-rect,.t-tall{grid-column:span 1;grid-row:auto;min-height:260px}}

/* ─── Header actions · lang toggle · hamburger ──────────────────── */
.hdr-actions{display:flex;align-items:center;gap:15px;margin-left:auto}
.lang-toggle{font-family:var(--body);font-size:.75rem;font-weight:600;letter-spacing:.1em;color:var(--gold);border:1px solid var(--line);border-radius:6px;padding:4px 10px;transition:all .3s;display:block}
.lang-toggle:hover{background:var(--gold);color:var(--bg);border-color:var(--gold)}
.hamburger{display:flex;background:transparent;border:none;cursor:pointer;padding:8px;flex-direction:column;gap:5px;z-index:10003;position:relative}
.hamburger span{display:block;width:24px;height:1px;background:var(--gold);transition:all .3s;transform-origin:center}
.hamburger.is-active span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.hamburger.is-active span:nth-child(2){opacity:0}
.hamburger.is-active span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ─── Mobile menu overlay ───────────────────────────────────────── */
.menu-overlay{position:fixed;inset:0;background:rgba(7,6,12,.97);backdrop-filter:blur(12px);z-index:10000;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .4s ease,visibility .4s ease;overflow-y:auto;padding:2vh 2vw}
.menu-overlay.is-active{opacity:1;visibility:visible}
.menu-overlay-content{width:100%;height:100%;max-width:1200px;display:grid;grid-template-columns:repeat(4,1fr);gap:2vh 2vw;padding:80px 0 40px;align-content:center;justify-content:center}
.menu-item{display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;transition:all .3s ease;border-radius:var(--radius-card);padding:1.5vh 0}
.menu-item:hover{background:rgba(212,166,74,.08);transform:translateY(-2px);box-shadow:0 8px 30px rgba(212,166,74,.12)}
.menu-item img{height:min(7vh,50px);width:auto;object-fit:contain;margin-bottom:1.5vh;filter:drop-shadow(0 0 10px rgba(212,166,74,.25));transition:all .3s}
.menu-item:hover img{filter:drop-shadow(0 0 15px rgba(212,166,74,.45));transform:scale(1.05)}
.menu-item span{font-family:var(--body);font-weight:600;font-size:clamp(.7rem,.8vh,.9rem);color:var(--ink);text-transform:uppercase;letter-spacing:.08em;text-align:center;line-height:1.2}
.menu-item:hover span{color:var(--gold-light)}
body:has(.menu-overlay.is-active) .hdr{background:transparent!important;backdrop-filter:none!important;border-bottom:0!important}
@media(max-width:900px){
  .menu-overlay-content{grid-template-columns:repeat(3,1fr);padding-top:70px;gap:1.5vh 1.5vw}
  .hamburger{display:flex}
  .invoke{display:none}
}
@media(max-width:600px){
  .menu-overlay-content{grid-template-columns:repeat(2,1fr);padding-top:60px;gap:1vh 2vw}
  .menu-item img{height:min(5.5vh,40px)}
}

/* ─── Hero (portada: centro, meta, decoración) ──────────────────── */
.hero-center{text-align:center;position:relative;margin-top:100px}
.hero-eyebrow{font-family:var(--display);font-size:.72rem;font-weight:600;letter-spacing:.4em;color:var(--gold);text-transform:uppercase;margin-bottom:30px;display:flex;align-items:center;justify-content:center;gap:14px}
.hero-eyebrow::before,.hero-eyebrow::after{content:"";width:60px;height:1px;background:var(--gold);opacity:.5}
.hero h1 .ord{font-style:normal;font-weight:400}
.hero h1 .glow{background:linear-gradient(180deg,#fff 0%,var(--gold-light) 50%,var(--gold) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 80px rgba(240,200,112,.3)}
.hero-meta{font-family:var(--body);font-size:.72rem;font-weight:500;color:var(--ink-muted);letter-spacing:.18em;text-transform:uppercase;max-width:100%;word-break:break-word}
.hero-meta div{margin-bottom:14px;display:flex;gap:10px;align-items:flex-start}
.hero-meta b{color:var(--gold);font-weight:600;flex-shrink:0}
.scroll-hint{position:absolute;left:50%;bottom:40px;transform:translateX(-50%);font-family:var(--body);font-size:.66rem;font-weight:500;letter-spacing:.3em;color:var(--ink-muted);text-transform:uppercase;text-align:center}
.scroll-hint::after{content:"";display:block;width:1px;height:50px;background:linear-gradient(180deg,var(--gold),transparent);margin:14px auto 0;animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.3;height:30px}50%{opacity:1;height:60px}}
@media(max-width:600px){.hero-center{margin-top:60px}}

/* ─── Manifesto (§ Códex) ───────────────────────────────────────── */
.manifesto-grid{display:grid;grid-template-columns:1fr 1.6fr;gap:100px;align-items:start}
.manifesto-text p{font-size:1.05rem;line-height:1.7;color:var(--ink-dim);margin-bottom:22px;max-width:600px}
.manifesto-text p strong{color:var(--ink);font-weight:600}
@media(max-width:1024px){.manifesto-grid{grid-template-columns:1fr;gap:50px}}

/* ─── Engines (§ Motores) ───────────────────────────────────────── */
.engines{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:radial-gradient(ellipse at center,rgba(212,166,74,.06),transparent 70%)}
.engines-head{text-align:center;margin-bottom:80px}
.engines-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);border-radius:var(--radius-card);overflow:hidden}
.engine{padding:60px 50px;position:relative;transition:background .4s;background:rgba(20,16,42,.4)}
.engine:first-child{border-right:1px solid var(--line)}
.engine:hover{background:rgba(212,166,74,.05)}
.engine .num{font-family:var(--display);font-size:5rem;color:var(--gold);line-height:.8;font-style:italic;opacity:.4}
.engine h3{font-family:var(--display);font-size:2rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;margin:24px 0 22px;line-height:1.15}
.engine p{color:var(--ink-dim);font-size:1rem;line-height:1.7}
.engine .keys{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.engine .keys span{font-family:var(--body);font-size:.66rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:7px 14px;border:1px solid var(--line);color:var(--ink-dim);border-radius:var(--radius-pill)}
@media(max-width:1024px){.engines-grid{grid-template-columns:1fr}.engine:first-child{border-right:none;border-bottom:1px solid var(--line)}}

/* ─── Invocation quote ──────────────────────────────────────────── */
.invocation{padding:180px 0;text-align:center;position:relative;background:radial-gradient(ellipse at center,rgba(212,166,74,.07),transparent 60%)}
.invocation::before,.invocation::after{content:"✦";position:absolute;font-family:var(--display);font-size:6rem;color:var(--gold);opacity:.12;font-style:normal}
.invocation::before{top:60px;left:10%}
.invocation::after{bottom:60px;right:10%}
.invocation blockquote{font-family:var(--display);font-style:italic;font-size:clamp(2rem,4.4vw,3.6rem);line-height:1.25;font-weight:400;max-width:1100px;margin:0 auto}
.invocation blockquote em{color:var(--gold-light);font-style:italic}
.invocation cite{display:block;font-family:var(--body);font-size:.74rem;font-weight:600;letter-spacing:.3em;color:var(--ink-muted);text-transform:uppercase;margin-top:40px;font-style:normal}

/* ─── Voices / Reviews (§ Voces, portada) ───────────────────────── */
.voices{border-top:1px solid var(--line)}
.voices-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:70px;gap:40px;flex-wrap:wrap}
.voices-head h2{font-family:var(--display);font-size:clamp(2.4rem,5vw,4.4rem);font-weight:500;line-height:1;letter-spacing:.02em;text-transform:uppercase}
.voices-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.voice{padding:40px 32px;border:1px solid var(--line);border-radius:var(--radius-card);position:relative;background:rgba(20,16,42,.4);transition:all .4s}
.voice:hover{border-color:var(--gold);transform:translateY(-4px)}
.voice .stars{color:var(--gold);font-size:.8rem;letter-spacing:.3em;margin-bottom:18px}
.voice p{font-family:var(--display);font-style:italic;font-size:1.15rem;line-height:1.6;margin-bottom:30px}
.voice .who{font-family:var(--body);font-size:.74rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.voice .where{font-family:var(--body);font-size:.66rem;color:var(--ink-muted);margin-top:6px;letter-spacing:.12em}
@media(max-width:900px){.voices-grid{grid-template-columns:1fr}}

/* ─── Summon / CTA ──────────────────────────────────────────────── */
.summon{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.summon-bg{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(212,166,74,.08),transparent 50%);pointer-events:none}
.summon h2{position:relative}
.summon h2 em{color:var(--gold-light);font-style:italic;display:block;text-transform:none}
.summon-btn{display:inline-block;margin-top:50px;padding:22px 60px;background:linear-gradient(135deg,var(--gold-bright),var(--gold));color:var(--bg);font-family:var(--body);font-size:.78rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;position:relative;overflow:hidden;transition:all .3s;border-radius:var(--radius-input);box-shadow:0 4px 40px rgba(212,166,74,.3)}
.summon-btn:hover{filter:brightness(1.08);box-shadow:0 6px 60px rgba(212,166,74,.5);transform:translateY(-2px)}

/* ─── Footer: social + legal links ──────────────────────────────── */
.foot-social{display:flex;gap:18px;margin-top:28px;flex-wrap:wrap;align-items:center}
.foot-social a{color:var(--ink-muted);transition:color .2s,transform .2s;display:flex;align-items:center}
.foot-social a:hover{color:var(--gold);transform:translateY(-2px)}
.foot-social svg{width:20px;height:20px}
.foot-legal-links{margin-top:24px;font-family:var(--body);font-size:.65rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.foot-legal-links a{color:var(--ink-muted);transition:color .2s}
.foot-legal-links a:hover{color:var(--gold)}

/* ─── SEO-only visually-hidden service list ─────────────────────── */
.seo-services{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ─── Responsive: paddings de secciones de portada en móvil ─────── */
@media(max-width:600px){
  .manifesto,.engines,.cats-section,.voices,.invocation,.summon{padding:90px 0}
  .engine{padding:40px 24px}
  .voice{padding:32px 22px}
  .invocation::before,.invocation::after{font-size:4rem}
  .summon-btn{padding:18px 36px}
}

/* ─── Horóscopo: etiqueta de signos por elemento ────────────────── */
.signs{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;color:var(--gold);opacity:.85;margin:6px 0 14px}