/* ============================================================
   SANTUARIO SOL Y LUNA — Hoja de estilo mística premium
   Paleta: noche profunda + oro solar + plata lunar
   ============================================================ */

:root{
    --noche:#0b0a1f;
    --noche-2:#131033;
    --violeta:#2a1b54;
    --violeta-claro:#3d2a73;
    --oro:#e8c569;
    --oro-claro:#f6e4a8;
    --oro-oscuro:#b8912f;
    --plata:#cdd6f4;
    --texto:#e9e6ff;
    --texto-suave:#b7b2d8;
    --blanco:#ffffff;
    --sombra:0 20px 60px rgba(0,0,0,.45);
    --radio:18px;
    --serif:'Cormorant Garamond',Georgia,serif;
    --display:'Cinzel',serif;
    --sans:'Jost',system-ui,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
    font-family:var(--sans);
    background:var(--noche);
    color:var(--texto);
    line-height:1.7;
    overflow-x:hidden;
    position:relative;
}

/* Fondo nocturno con nebulosa */
body::before{
    content:"";
    position:fixed;inset:0;z-index:-2;
    background:
        radial-gradient(ellipse 80% 60% at 15% 0%, rgba(232,197,105,.10), transparent 55%),
        radial-gradient(ellipse 70% 60% at 85% 15%, rgba(120,90,220,.18), transparent 55%),
        radial-gradient(ellipse 90% 80% at 50% 110%, rgba(61,42,115,.35), transparent 60%),
        linear-gradient(180deg,var(--noche),var(--noche-2) 60%,var(--noche));
}

/* Campo de estrellas animado */
.cielo-estrellas{
    position:fixed;inset:0;z-index:-1;pointer-events:none;
    background-image:
        radial-gradient(1px 1px at 20% 30%, #fff, transparent),
        radial-gradient(1px 1px at 60% 70%, #fff, transparent),
        radial-gradient(1.5px 1.5px at 80% 20%, var(--oro-claro), transparent),
        radial-gradient(1px 1px at 35% 85%, #fff, transparent),
        radial-gradient(1px 1px at 90% 55%, #fff, transparent),
        radial-gradient(1.5px 1.5px at 10% 60%, var(--oro-claro), transparent),
        radial-gradient(1px 1px at 50% 15%, #fff, transparent),
        radial-gradient(1px 1px at 70% 40%, #fff, transparent);
    background-size:cover;
    animation:parpadeo 6s ease-in-out infinite alternate;
    opacity:.7;
}
@keyframes parpadeo{from{opacity:.35}to{opacity:.8}}

.contenedor{width:min(1180px,92%);margin-inline:auto}

a{color:inherit;text-decoration:none;transition:.25s}

/* ---------- Navegación ---------- */
.nav{
    position:sticky;top:0;z-index:50;
    backdrop-filter:blur(12px);
    background:rgba(11,10,31,.72);
    border-bottom:1px solid rgba(232,197,105,.18);
}
.nav__inner{display:flex;align-items:center;justify-content:space-between;padding:.85rem 0}
.marca{display:flex;align-items:center;gap:.7rem}
.marca__astros{font-size:1.5rem;color:var(--oro);letter-spacing:-2px;filter:drop-shadow(0 0 8px rgba(232,197,105,.5))}
.marca__texto{display:flex;flex-direction:column;line-height:1.1}
.marca__texto strong{font-family:var(--display);font-size:1.05rem;color:var(--oro-claro);letter-spacing:1px}
.marca__texto em{font-family:var(--serif);font-style:italic;font-size:.85rem;color:var(--texto-suave)}
.nav__links{display:flex;align-items:center;gap:1.6rem}
.nav__links a{font-size:.95rem;letter-spacing:.5px;color:var(--texto-suave)}
.nav__links a:hover{color:var(--oro-claro)}
.nav__cta{
    padding:.55rem 1.2rem;border-radius:999px;
    border:1px solid var(--oro);color:var(--oro-claro)!important;
    background:linear-gradient(180deg,rgba(232,197,105,.15),transparent);
}
.nav__cta:hover{background:var(--oro);color:var(--noche)!important;box-shadow:0 0 22px rgba(232,197,105,.5)}
.nav__toggle{display:none;background:none;border:none;color:var(--oro);font-size:1.6rem;cursor:pointer}

/* ---------- Botones ---------- */
.btn{
    display:inline-flex;align-items:center;gap:.5rem;
    padding:.9rem 1.8rem;border-radius:999px;
    font-family:var(--sans);font-size:1rem;font-weight:500;letter-spacing:.5px;
    cursor:pointer;border:none;transition:.3s;
}
.btn--oro{
    background:linear-gradient(135deg,var(--oro-claro),var(--oro),var(--oro-oscuro));
    color:var(--noche);box-shadow:0 10px 30px rgba(232,197,105,.35);
}
.btn--oro:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(232,197,105,.55)}
.btn--fantasma{border:1px solid rgba(232,197,105,.5);color:var(--oro-claro)}
.btn--fantasma:hover{background:rgba(232,197,105,.12);border-color:var(--oro)}

/* ---------- Títulos ---------- */
.seccion{padding:5.5rem 0}
.seccion__cab{text-align:center;max-width:720px;margin:0 auto 3.5rem}
.eyebrow{
    font-family:var(--sans);text-transform:uppercase;letter-spacing:4px;
    font-size:.8rem;color:var(--oro);margin-bottom:1rem;display:block;
}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.15;color:var(--blanco)}
.seccion__cab h2{font-size:clamp(2rem,4vw,2.9rem)}
.seccion__cab p{font-family:var(--serif);font-size:1.25rem;color:var(--texto-suave);margin-top:1rem}
.deco-linea{
    width:120px;height:1px;margin:1.5rem auto 0;
    background:linear-gradient(90deg,transparent,var(--oro),transparent);position:relative;
}
.deco-linea::after{content:"✦";position:absolute;top:-.75rem;left:50%;transform:translateX(-50%);color:var(--oro);font-size:.9rem}

/* ---------- HERO ---------- */
.hero{position:relative;text-align:center;padding:7rem 0 6rem;overflow:hidden}
.hero__astro{
    position:absolute;top:8%;left:50%;transform:translateX(-50%);
    width:230px;height:230px;border-radius:50%;
    background:radial-gradient(circle at 35% 35%,var(--oro-claro),var(--oro) 40%,transparent 72%);
    filter:blur(4px);opacity:.5;z-index:-1;
    animation:latido 7s ease-in-out infinite;
}
@keyframes latido{0%,100%{transform:translateX(-50%) scale(1);opacity:.45}50%{transform:translateX(-50%) scale(1.08);opacity:.65}}
.hero__eyebrow{font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--oro-claro);margin-bottom:1rem}
.hero h1{font-size:clamp(2.6rem,6vw,4.6rem);letter-spacing:2px;text-shadow:0 0 40px rgba(232,197,105,.25)}
.hero h1 span{
    display:block;font-family:var(--serif);font-style:italic;font-weight:400;
    font-size:.45em;letter-spacing:1px;color:var(--oro-claro);margin-top:.6rem;
}
.hero__sub{font-family:var(--serif);font-size:1.4rem;color:var(--texto-suave);max-width:680px;margin:1.8rem auto 2.5rem}
.hero__acciones{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.hero__pastillas{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin-top:2.8rem}
.pastilla{
    font-size:.82rem;letter-spacing:1px;text-transform:uppercase;
    padding:.45rem 1rem;border-radius:999px;
    border:1px solid rgba(232,197,105,.28);color:var(--texto-suave);
    background:rgba(255,255,255,.03);
}

/* ---------- Franja de confianza ---------- */
.confianza{border-block:1px solid rgba(232,197,105,.15);background:rgba(255,255,255,.02)}
.confianza__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:2.5rem 0;text-align:center}
.confianza__n{font-family:var(--display);font-size:2.4rem;color:var(--oro)}
.confianza__t{font-size:.9rem;color:var(--texto-suave);letter-spacing:.5px}

/* ---------- Servicios ---------- */
.rejilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.6rem}
.tarjeta{
    background:linear-gradient(160deg,rgba(61,42,115,.35),rgba(19,16,51,.55));
    border:1px solid rgba(232,197,105,.16);
    border-radius:var(--radio);padding:2.2rem;
    position:relative;overflow:hidden;transition:.35s;
}
.tarjeta::before{
    content:"";position:absolute;inset:0;
    background:radial-gradient(circle at 50% 0%,rgba(232,197,105,.12),transparent 60%);
    opacity:0;transition:.35s;
}
.tarjeta:hover{transform:translateY(-8px);border-color:rgba(232,197,105,.5);box-shadow:var(--sombra)}
.tarjeta:hover::before{opacity:1}
.tarjeta__icono{
    font-size:2.6rem;display:inline-grid;place-items:center;
    width:74px;height:74px;border-radius:50%;margin-bottom:1.3rem;
    background:radial-gradient(circle,rgba(232,197,105,.18),transparent 70%);
    border:1px solid rgba(232,197,105,.3);
}
.tarjeta h3{font-size:1.4rem;margin-bottom:.6rem;color:var(--oro-claro)}
.tarjeta p{color:var(--texto-suave);font-size:1rem}
.tarjeta__beneficios{list-style:none;margin-top:1.2rem;display:grid;gap:.5rem}
.tarjeta__beneficios li{position:relative;padding-left:1.6rem;font-size:.95rem;color:var(--texto)}
.tarjeta__beneficios li::before{content:"✦";position:absolute;left:0;color:var(--oro)}
.tarjeta__destacado{
    position:absolute;top:1.1rem;right:1.1rem;font-size:.7rem;letter-spacing:1px;
    text-transform:uppercase;color:var(--noche);background:var(--oro);
    padding:.25rem .7rem;border-radius:999px;font-weight:600;
}

/* ---------- Maestros ---------- */
.maestros{display:grid;grid-template-columns:1fr 1fr;gap:2rem}
.maestro{
    text-align:center;padding:2.8rem 2rem;border-radius:var(--radio);
    border:1px solid rgba(232,197,105,.18);
    background:linear-gradient(180deg,rgba(42,27,84,.4),rgba(11,10,31,.4));
    position:relative;
}
.maestro__aura{
    width:130px;height:130px;margin:0 auto 1.4rem;border-radius:50%;
    display:grid;place-items:center;font-size:3.4rem;
    background:radial-gradient(circle at 40% 35%,rgba(232,197,105,.3),rgba(120,90,220,.15) 60%,transparent);
    border:1px solid rgba(232,197,105,.35);
    box-shadow:0 0 40px rgba(232,197,105,.2),inset 0 0 30px rgba(232,197,105,.12);
    animation:latido 6s ease-in-out infinite;
}
.maestro h3{font-size:1.9rem;color:var(--oro-claro)}
.maestro__titulo{font-family:var(--serif);font-style:italic;font-size:1.2rem;color:var(--texto-suave);margin-bottom:1rem}
.maestro__bio{color:var(--texto-suave);font-size:1.02rem}
.maestro__esp{margin-top:1.2rem;font-size:.85rem;letter-spacing:1px;text-transform:uppercase;color:var(--oro)}

/* ---------- Pasos ---------- */
.pasos{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.4rem;counter-reset:paso}
.paso{padding:2rem;border-radius:var(--radio);background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);position:relative}
.paso::before{
    counter-increment:paso;content:counter(paso);
    font-family:var(--display);font-size:2.4rem;color:var(--oro);opacity:.5;display:block;margin-bottom:.6rem;
}
.paso h3{font-size:1.25rem;color:var(--oro-claro);margin-bottom:.4rem}
.paso p{color:var(--texto-suave);font-size:.98rem}

/* ---------- Testimonios ---------- */
.testi{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.6rem}
.testi__card{
    padding:2.2rem;border-radius:var(--radio);
    background:linear-gradient(160deg,rgba(61,42,115,.3),rgba(19,16,51,.5));
    border:1px solid rgba(232,197,105,.16);position:relative;
}
.testi__card::before{content:"“";position:absolute;top:.2rem;left:1.2rem;font-family:var(--serif);font-size:4rem;color:var(--oro);opacity:.35}
.testi__estrellas{color:var(--oro);letter-spacing:2px;margin-bottom:.8rem}
.testi__msg{font-family:var(--serif);font-size:1.15rem;color:var(--texto);font-style:italic;margin-bottom:1.2rem;position:relative;z-index:1}
.testi__autor{font-weight:500;color:var(--oro-claro)}
.testi__ciudad{font-size:.85rem;color:var(--texto-suave)}

/* ---------- CTA banda ---------- */
.cta{
    text-align:center;padding:4.5rem 2rem;border-radius:calc(var(--radio) + 6px);
    background:
        radial-gradient(circle at 50% 0%,rgba(232,197,105,.2),transparent 60%),
        linear-gradient(160deg,rgba(61,42,115,.6),rgba(11,10,31,.7));
    border:1px solid rgba(232,197,105,.3);
}
.cta h2{font-size:clamp(2rem,4vw,2.8rem)}
.cta p{font-family:var(--serif);font-size:1.3rem;color:var(--texto-suave);margin:1rem auto 2rem;max-width:600px}

/* ---------- Formulario ---------- */
.form-wrap{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}
.form{
    background:linear-gradient(160deg,rgba(61,42,115,.35),rgba(19,16,51,.55));
    border:1px solid rgba(232,197,105,.2);border-radius:var(--radio);padding:2.5rem;
}
.form label{display:block;font-size:.9rem;letter-spacing:.5px;color:var(--oro-claro);margin:1.1rem 0 .4rem}
.campo{
    width:100%;padding:.85rem 1rem;border-radius:12px;
    background:rgba(11,10,31,.6);border:1px solid rgba(232,197,105,.22);
    color:var(--texto);font-family:var(--sans);font-size:1rem;transition:.25s;
}
.campo:focus{outline:none;border-color:var(--oro);box-shadow:0 0 0 3px rgba(232,197,105,.15)}
.campo::placeholder{color:rgba(183,178,216,.6)}
select.campo option{background:var(--noche-2)}
.form .btn{width:100%;justify-content:center;margin-top:1.6rem}
.form__nota{font-size:.85rem;color:var(--texto-suave);margin-top:1rem;text-align:center}
.errorlist{list-style:none;color:#ff9d9d;font-size:.85rem;margin-top:.3rem}
.contacto-info h3{font-size:1.6rem;color:var(--oro-claro);margin-bottom:.5rem}
.contacto-info p{color:var(--texto-suave);margin-bottom:1.5rem}
.contacto-info .dato{display:flex;gap:1rem;align-items:center;padding:1rem 0;border-bottom:1px solid rgba(255,255,255,.07)}
.contacto-info .dato__ico{font-size:1.6rem;color:var(--oro)}
.contacto-info .dato strong{display:block;color:var(--texto)}
.contacto-info .dato span{font-size:.9rem;color:var(--texto-suave)}

/* ---------- Alertas ---------- */
.alerta{padding:1rem 1.4rem;border-radius:12px;margin:1.5rem auto;text-align:center;font-size:1.05rem}
.alerta--success{background:rgba(232,197,105,.14);border:1px solid var(--oro);color:var(--oro-claro)}

/* ---------- Página encabezado ---------- */
.pag-cab{text-align:center;padding:5rem 0 3rem}
.pag-cab h1{font-size:clamp(2.4rem,5vw,3.6rem);letter-spacing:2px}
.pag-cab p{font-family:var(--serif);font-size:1.3rem;color:var(--texto-suave);max-width:640px;margin:1rem auto 0}

/* ---------- WhatsApp flotante ---------- */
.wsp{
    position:fixed;bottom:1.5rem;right:1.5rem;z-index:60;
    display:flex;align-items:center;gap:.6rem;
    padding:.85rem 1.4rem;border-radius:999px;
    background:linear-gradient(135deg,var(--oro-claro),var(--oro));
    color:var(--noche);font-weight:600;box-shadow:0 10px 30px rgba(232,197,105,.4);
    animation:latido 4s ease-in-out infinite;
}
.wsp:hover{transform:translateY(-3px)}
.wsp__icono{font-size:1.3rem}

/* ---------- Pie ---------- */
.pie{margin-top:4rem;border-top:1px solid rgba(232,197,105,.18);background:rgba(11,10,31,.6);padding-top:3.5rem}
.pie__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:2.5rem;padding-bottom:2.5rem}
.pie h4{font-family:var(--display);color:var(--oro-claro);margin-bottom:1rem;font-size:1.1rem}
.pie a{display:block;color:var(--texto-suave);padding:.3rem 0}
.pie a:hover{color:var(--oro-claro)}
.marca--pie{margin-bottom:1rem}
.pie__lema,.pie__nota{color:var(--texto-suave);font-size:.95rem;margin-top:.5rem}
.pie__base{border-top:1px solid rgba(255,255,255,.07);padding:1.5rem 0;text-align:center}
.pie__base p{color:var(--texto-suave);font-size:.85rem}
.pie__legal{opacity:.7;margin-top:.4rem;font-size:.78rem!important}

/* ---------- Garantía / promesas ---------- */
.garantias{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.4rem}
.garantia{
    display:flex;gap:1rem;align-items:flex-start;padding:1.6rem;
    border-radius:var(--radio);background:rgba(255,255,255,.03);
    border:1px solid rgba(232,197,105,.14);
}
.garantia__ico{font-size:1.9rem;color:var(--oro);line-height:1}
.garantia h3{font-size:1.15rem;color:var(--oro-claro);margin-bottom:.3rem}
.garantia p{color:var(--texto-suave);font-size:.95rem}

/* ---------- Preguntas frecuentes ---------- */
.faq{max-width:820px;margin:0 auto;display:grid;gap:1rem}
.faq details{
    border:1px solid rgba(232,197,105,.18);border-radius:14px;
    background:linear-gradient(160deg,rgba(61,42,115,.28),rgba(19,16,51,.45));
    overflow:hidden;transition:.3s;
}
.faq details[open]{border-color:rgba(232,197,105,.45)}
.faq summary{
    cursor:pointer;padding:1.3rem 1.6rem;font-family:var(--serif);
    font-size:1.25rem;color:var(--oro-claro);list-style:none;
    display:flex;justify-content:space-between;align-items:center;gap:1rem;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--oro);font-size:1.6rem;transition:.3s;flex-shrink:0}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 1.6rem 1.4rem;color:var(--texto-suave);font-size:1.02rem}

/* ---------- Estrellas grandes (cabecera testimonios) ---------- */
.rating-grande{text-align:center;margin-bottom:2.5rem}
.rating-grande__estrellas{color:var(--oro);font-size:2rem;letter-spacing:6px}
.rating-grande__txt{font-family:var(--serif);font-size:1.2rem;color:var(--texto-suave);margin-top:.5rem}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(30px);transition:.8s cubic-bezier(.2,.7,.2,1)}
.reveal.visible{opacity:1;transform:none}

/* ---------- Responsive ---------- */
@media(max-width:820px){
    .nav__toggle{display:block}
    .nav__links{
        position:absolute;top:100%;left:0;right:0;flex-direction:column;
        background:rgba(11,10,31,.97);padding:1.5rem;gap:1.2rem;
        border-bottom:1px solid rgba(232,197,105,.2);
        transform:translateY(-120%);transition:.4s;
    }
    .nav__links.abierto{transform:none}
    .maestros,.form-wrap{grid-template-columns:1fr}
    .confianza__grid{grid-template-columns:1fr 1fr}
    .pie__grid{grid-template-columns:1fr}
    .wsp__txt{display:none}
}