:root { --ink:#07051a; --indigo:#130b35; --violet:#6f47bd; --gold:#d9b56f; --cream:#f7f2e8; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--cream); font-family:Arial, Helvetica, sans-serif; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.nav-wrap { height:84px; padding:0 5.5vw; display:flex; align-items:center; justify-content:space-between; position:absolute; inset:0 0 auto; z-index:10; border-bottom:1px solid #ffffff18; }
.brand { display:flex; gap:12px; align-items:center; font-size:13px; letter-spacing:.2em; font-weight:700; }
.brand em { display:block; color:var(--gold); font-size:8px; font-style:normal; letter-spacing:.42em; margin-top:3px; }
.brand-mark { width:34px; height:34px; display:grid; place-items:center; border:1px solid #d9b56f66; border-radius:50%; color:var(--gold); }
nav { display:flex; gap:38px; font-size:12px; color:#ded8ee; }
nav a:hover { color:var(--gold); }
.nav-cta { font-size:11px; text-transform:uppercase; letter-spacing:.13em; border-bottom:1px solid var(--gold); padding:9px 0; }
.nav-cta span,.button span { color:var(--gold); margin-left:10px; }
.hero { min-height:760px; height:100vh; position:relative; overflow:hidden; display:grid; grid-template-columns:54% 46%; background:radial-gradient(circle at 65% 22%,#342066 0,transparent 32%), linear-gradient(105deg,#09051b 15%,#140c35 66%,#0c0824); }
.hero:after { content:""; position:absolute; inset:0; background-image:radial-gradient(#fff 1px,transparent 1px); background-size:85px 85px; opacity:.12; pointer-events:none; }
.hero-glow { position:absolute; width:500px; height:500px; left:-260px; top:25%; border:1px solid #d9b56f1f; border-radius:50%; box-shadow:0 0 120px #703ed526; }
.hero-content { z-index:2; align-self:center; padding:95px 4vw 50px 10vw; }
.eyebrow { color:var(--gold); text-transform:uppercase; font-size:10px; letter-spacing:.28em; font-weight:700; display:flex; align-items:center; gap:12px; }
.eyebrow span { display:inline-block; width:28px; height:1px; background:var(--gold); }
h1,h2 { font-family:Georgia, 'Times New Roman', serif; font-weight:400; margin:22px 0; line-height:.98; letter-spacing:-.035em; }
h1 { font-size:clamp(58px,6.2vw,98px); }
h1 i,h2 i { color:#cfb0ff; font-weight:400; }
.hero-copy { max-width:535px; color:#bcb5d0; font-family:Georgia,serif; font-size:18px; line-height:1.75; }
.hero-actions { margin-top:36px; display:flex; align-items:center; gap:34px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:54px; padding:0 25px; text-transform:uppercase; letter-spacing:.15em; font-size:10px; font-weight:700; border:1px solid #d9b56f66; transition:.25s ease; }
.button.primary { background:linear-gradient(90deg,#7e4db7,#563092); box-shadow:0 8px 30px #7e4db73b; }
.button:hover { transform:translateY(-2px); border-color:var(--gold); }
.text-link { font-size:11px; text-transform:uppercase; letter-spacing:.12em; }
.text-link span { color:var(--gold); margin-left:8px; }
.trust { margin-top:45px; display:flex; align-items:center; gap:14px; color:#8f86aa; font-size:10px; letter-spacing:.04em; }
.trust strong { color:#d8d2e5; text-transform:uppercase; letter-spacing:.12em; font-size:9px; }
.avatars { display:flex; }.avatars b { width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#302050;border:1px solid #d9b56f55;margin-left:-6px;color:var(--gold); }
.hero-art { z-index:1; background-image:linear-gradient(90deg,#110a2b 0%,transparent 35%), url('/images/hero-angelical.png'); background-size:cover; background-position:center; position:relative; }
.hero-art:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#09051b 0,transparent 32%); }
.scroll-cue { position:absolute; right:4.5vw; bottom:30px; z-index:3; writing-mode:vertical-rl; text-transform:uppercase; letter-spacing:.3em; font-size:8px; color:#948aa8; display:flex; gap:14px; align-items:center; }
.scroll-cue i { color:var(--gold); font-style:normal; }
.intro { background:var(--cream); color:#211836; padding:110px 8vw 100px; text-align:center; }
.constellation { color:#ac8cce; letter-spacing:.6em; margin-bottom:28px; }
.centered { justify-content:center; }.intro h2,.card-reading h2,.universe h2,.community h2 { font-size:clamp(46px,5vw,72px); }
.intro h2 i { color:#7350a1; }
.intro>p:not(.eyebrow) { max-width:650px; margin:0 auto; color:#746d7f; font-family:Georgia,serif; font-size:17px; line-height:1.8; }
.pillars { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; max-width:1050px; margin:70px auto 0; }
.pillars article { padding:10px 35px; border-right:1px solid #d9cfbd; }.pillars article:last-child { border:0; }
.icon { margin:auto; width:58px;height:58px;border:1px solid #b99bd0;border-radius:50%;display:grid;place-items:center;color:#75509e;font-size:22px;box-shadow:0 0 0 7px #ede5f0; }
.pillars h3 { font-family:Georgia,serif;font-size:21px;font-weight:400;margin:22px 0 12px; }.pillars p { color:#81798a;font-size:13px;line-height:1.65; }
.card-reading { padding:110px 8vw; min-height:780px; background:radial-gradient(circle at 70% 50%,#281651 0,transparent 40%),#0b071f; display:grid;grid-template-columns:35% 65%;gap:4vw;align-items:center; }
.reading-copy>p { color:#a79fb9; font-family:Georgia,serif; line-height:1.8; max-width:370px; }.reading-copy small { color:var(--gold);font-style:italic;font-family:Georgia,serif; }
.cards-row { display:flex;justify-content:center;align-items:center;gap:18px;perspective:1000px; }
.oracle-card { width:190px;height:330px;border:0;background:transparent;color:white;padding:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;transition:.35s ease; }
.oracle-card:nth-child(2) { transform:translateY(-28px); }.oracle-card:hover,.oracle-card.chosen { transform:translateY(-42px); }.oracle-card:nth-child(2):hover,.oracle-card:nth-child(2).chosen { transform:translateY(-60px); }
.card-number { color:#ab9ebf;font-size:9px;letter-spacing:.2em;margin-bottom:9px; }
.card-frame { width:100%;height:270px;border:1px solid #c69ae0;box-shadow:0 12px 34px #0009,inset 0 0 0 6px #120a31,inset 0 0 0 7px #a77dc4;background-image:linear-gradient(#12092d26,#12092d38),url('/images/carta-angel.png');background-position:center;background-size:cover;position:relative;display:grid;place-items:center;overflow:hidden; }
.card-frame:before,.card-frame:after { content:"";position:absolute;width:125px;height:125px;border:1px solid #d3aa6f55;transform:rotate(45deg); }.card-frame:after { width:70px;height:70px; }
.card-symbol { color:var(--gold);font-size:30px;text-shadow:0 0 18px #e0bc7c;background:#100829bb;border:1px solid #d9b56f99;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;z-index:1; }
.card-label { margin-top:14px;text-transform:uppercase;letter-spacing:.16em;font-size:8px;color:#a99fba; }
.reveal { max-width:610px;min-height:0;margin:35px auto 0;text-align:center;opacity:0;transform:translateY(10px);transition:.35s; }.reveal.visible { opacity:1;transform:none; }.reveal span { color:var(--gold);text-transform:uppercase;letter-spacing:.2em;font-size:9px; }.reveal h3 { font-family:Georgia,serif;font-weight:400;font-size:21px;margin:8px; }.reveal p { margin:0;color:#bbb2ca;font-family:Georgia,serif;line-height:1.6; }
.universe { background:#f3eee5;color:#1c1430;display:grid;grid-template-columns:50% 50%;min-height:650px; }.universe-image { background:url('/images/mensaje-universo.png') center/cover;min-height:560px; }.universe-copy { padding:90px 9vw 80px 7vw;display:flex;flex-direction:column;justify-content:center;align-items:flex-start; }.universe-copy h2 i { color:#75509e; }.universe blockquote { margin:8px 0 32px;padding-left:22px;border-left:1px solid var(--gold);font-family:Georgia,serif;color:#625970;font-size:18px;line-height:1.7; }.universe .button { color:white; }
.community { padding:90px 9vw;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8vw;background:linear-gradient(110deg,#29174d,#100a29); }.community h2 { margin-bottom:0; }.community>div:last-child p { color:#bfb7ce;font-family:Georgia,serif;font-size:17px;line-height:1.7;max-width:470px; }.button.light { margin-top:15px;background:#f2eadf;color:#1a112d;border-color:#f2eadf; }
footer { min-height:150px;padding:40px 6vw;display:flex;align-items:center;justify-content:space-between;color:#716985;font-size:10px;border-top:1px solid #ffffff12; } footer .brand { color:white; }
@media(max-width:900px){ nav{display:none}.hero{grid-template-columns:1fr}.hero-content{padding:130px 8vw 70px}.hero-art{position:absolute;inset:0;opacity:.4}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#09051bf2,#09051b55);z-index:1}.nav-cta{display:none}.pillars{grid-template-columns:1fr}.pillars article{border-right:0;border-bottom:1px solid #d9cfbd;padding-bottom:35px}.card-reading{grid-template-columns:1fr}.reading-copy{text-align:center}.reading-copy .eyebrow{justify-content:center}.reading-copy>p{margin-left:auto;margin-right:auto}.cards-row{margin-top:45px}.oracle-card{width:29vw;max-width:170px;height:290px}.card-frame{height:230px}.universe{grid-template-columns:1fr}.universe-image{min-height:430px}.community{grid-template-columns:1fr} }
@media(max-width:560px){.nav-wrap{height:72px;padding:0 6vw}.hero{min-height:720px}.hero-content{padding-left:7vw;padding-right:7vw}.hero-copy{font-size:16px}.hero-actions{align-items:flex-start;flex-direction:column;gap:20px}.trust{margin-top:30px}.intro,.card-reading{padding:80px 6vw}.cards-row{gap:7px}.oracle-card{height:245px}.card-frame{height:190px}.card-label{display:none}.community{padding:75px 7vw}.universe-copy{padding:70px 7vw}footer{flex-direction:column;text-align:center;gap:18px}.scroll-cue{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.oracle-card,.reveal{transition:none}}