/* CHAMOÏ — estilos compartidos del sitio (nav, footer, base, botones) */
:root{
  --navy:#262262; --navy-2:#1b1750; --navy-deep:#120e34; --navy-ink:#0a0820;
  --oro:#bb9b48; --oro-claro:#d9bd6e; --oro-tenue:#8c7536;
  --crema:#f3ecdb; --beige:#cbbf9f; --tinta:#e7dfcc;
  --maxw:1180px;
  --z-nav:60; --z-menu:80; --z-modal:120;
}
*{box-sizing:border-box; margin:0; padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--navy-ink); color:var(--beige);
  font-family:'Mulish',system-ui,sans-serif; font-weight:300;
  line-height:1.7; font-size:17px; letter-spacing:.2px;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
h1,h2,h3{font-family:'Cinzel',serif; color:var(--oro-claro); font-weight:600; line-height:1.16; letter-spacing:.5px; text-wrap:balance}
a{color:var(--oro-claro); text-decoration:none}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 26px}
em{color:var(--oro-claro); font-style:italic}
strong{color:var(--crema); font-weight:600}
:focus-visible{outline:2px solid var(--oro-claro); outline-offset:3px; border-radius:2px}

/* idioma */
[data-lang="es"] .en{display:none}
[data-lang="en"] .es{display:none}

/* ===== NAV compartida ===== */
header.nav{position:fixed; top:0; left:0; right:0; z-index:var(--z-nav);
  transition:background .4s ease, border-color .4s ease;
  border-bottom:1px solid transparent; padding:6px 0}
header.nav.solid{background:rgba(10,8,32,.85); backdrop-filter:blur(10px); border-bottom-color:rgba(187,155,72,.2)}
.nav .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:12px; padding-bottom:12px}
.brand{display:flex; align-items:center; gap:11px; font-family:'Cinzel',serif; color:var(--oro-claro); font-weight:700; letter-spacing:3px; font-size:1rem}
.brand img{width:30px; height:30px}
nav.links{display:flex; gap:24px; align-items:center}
nav.links a{font-family:'Mulish',sans-serif; font-size:.78rem; letter-spacing:1.6px; text-transform:uppercase; color:var(--beige); opacity:.82; transition:opacity .25s, color .25s; padding:4px 0; border-bottom:1px solid transparent}
nav.links a:hover{opacity:1; color:var(--oro-claro)}
nav.links a[aria-current="page"]{opacity:1; color:var(--oro-claro); border-bottom-color:var(--oro)}
.nav-actions{display:flex; align-items:center; gap:12px}
.langbtn{font-family:'Mulish',sans-serif; font-size:.74rem; letter-spacing:1px; border:1px solid var(--oro);
  background:transparent; color:var(--oro-claro); padding:6px 13px; border-radius:30px; cursor:pointer; text-transform:uppercase; transition:background .25s}
.langbtn:hover{background:rgba(187,155,72,.16)}

/* hamburguesa */
.menubtn{display:none; background:transparent; border:1px solid rgba(187,155,72,.5); border-radius:8px;
  width:42px; height:38px; cursor:pointer; padding:0; align-items:center; justify-content:center; flex-direction:column; gap:5px}
.menubtn span{display:block; width:18px; height:1.6px; background:var(--oro-claro); transition:transform .3s ease, opacity .3s ease}
.menubtn[aria-expanded="true"] span:nth-child(1){transform:translateY(6.6px) rotate(45deg)}
.menubtn[aria-expanded="true"] span:nth-child(2){opacity:0}
.menubtn[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.6px) rotate(-45deg)}
@media(max-width:900px){
  nav.links{display:none}
  .menubtn{display:flex}
}

/* panel movil */
.mobilemenu{position:fixed; inset:0; z-index:var(--z-menu); display:none; flex-direction:column;
  background:linear-gradient(180deg, rgba(18,14,52,.98), rgba(10,8,32,.99)); backdrop-filter:blur(8px);
  padding:96px 30px 40px; overflow-y:auto}
.mobilemenu.open{display:flex}
.mobilemenu a{font-family:'Cinzel',serif; font-size:1.5rem; color:var(--crema); letter-spacing:1.5px;
  padding:16px 0; border-bottom:1px solid rgba(187,155,72,.16)}
.mobilemenu a[aria-current="page"]{color:var(--oro-claro)}
.mobilemenu a .hint{display:block; font-family:'Mulish',sans-serif; font-size:.78rem; color:var(--beige); letter-spacing:.4px; margin-top:2px; text-transform:none; opacity:.75}
.mobilemenu .menu-cta{margin-top:auto; padding-top:30px}
body.menu-open{overflow:hidden}

/* ===== botones ===== */
.btn{display:inline-block; font-family:'Mulish',sans-serif; letter-spacing:1.6px; text-transform:uppercase; font-size:.8rem;
  border:1px solid var(--oro); color:var(--navy-ink); background:linear-gradient(180deg,var(--oro-claro),var(--oro));
  padding:15px 30px; border-radius:40px; font-weight:700; cursor:pointer; transition:transform .25s, box-shadow .25s}
.btn:hover{transform:translateY(-2px); box-shadow:0 12px 30px rgba(0,0,0,.45)}
.btn.ghost{background:transparent; color:var(--oro-claro)}
.btn.ghost:hover{background:rgba(187,155,72,.12)}
.btn.wa{background:linear-gradient(180deg,#43c463,#2aa84d); border-color:#2aa84d; color:#0a2912}
.btn.wa:hover{color:#0a2912}
.btn.full{display:block; text-align:center; width:100%}
.cta-row{display:flex; gap:14px; justify-content:center; flex-wrap:wrap}

/* ===== seccion estandar ===== */
.section{padding:100px 0}
.section .head{text-align:center; margin-bottom:44px}
.eyebrow{font-family:'Mulish',sans-serif; text-transform:uppercase; letter-spacing:5px; font-size:.7rem; color:var(--oro-tenue); margin-bottom:16px}
.section h2.t{font-size:clamp(2rem,4.4vw,3rem); color:var(--crema); margin-bottom:10px}
.section .sub{font-family:'Cormorant Garamond',serif; font-style:italic; color:var(--oro-claro); font-size:1.3rem}
.section .body{max-width:720px; margin:0 auto; text-align:center; color:var(--tinta)}
.disc{max-width:780px; margin:14px auto 0; font-size:.8rem; color:var(--oro-tenue); text-align:center}

/* banda inmersiva */
.band{position:relative; min-height:70vh; display:flex; align-items:center; text-align:center; overflow:hidden; padding:80px 0}
.band .bg{position:absolute; inset:0; z-index:0; background-size:cover; background-position:center}
.band::after{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(10,8,32,.88), rgba(10,8,32,.62) 46%, rgba(10,8,32,.94))}
.band .wrap{position:relative; z-index:2}
.band h2{font-size:clamp(2rem,4.6vw,3.2rem); color:var(--crema); margin-bottom:18px; line-height:1.12}
.band p{font-family:'Cormorant Garamond',serif; font-style:italic; font-size:clamp(1.3rem,2.6vw,1.9rem); color:var(--oro-claro); max-width:720px; margin:0 auto}

/* reveal seguro: visible por defecto; oculta SOLO con JS y sin reduced-motion */
@media (prefers-reduced-motion: no-preference){
  html.js .reveal{opacity:0; transform:translateY(26px); transition:opacity .9s ease, transform .9s ease}
  html.js .reveal.in{opacity:1; transform:none}
  html.js .reveal.d1{transition-delay:.12s} html.js .reveal.d2{transition-delay:.24s} html.js .reveal.d3{transition-delay:.36s}
}
@media print{
  html.js .reveal{opacity:1 !important; transform:none !important}
  header.nav, .mobilemenu, .menubtn{display:none !important}
}

/* ===== contacto + footer ===== */
.contact{text-align:center; padding:90px 0 40px}
.social{margin-top:22px; display:flex; gap:18px; justify-content:center; flex-wrap:wrap; font-size:.85rem; letter-spacing:1px}
.social a{opacity:.85} .social a:hover{opacity:1}
footer{padding:50px 0 64px; font-size:.82rem; color:#8a80a6; text-align:center; border-top:1px solid rgba(187,155,72,.12)}
footer img{width:40px; opacity:.8; margin-bottom:12px}
footer p{margin:6px auto; max-width:720px}
footer .flinks{margin-top:16px; display:flex; gap:18px; justify-content:center; flex-wrap:wrap; font-size:.8rem; letter-spacing:1px}
