/* ==========================================================================
   SOLO VUELA — Sistema de diseño
   ========================================================================== */
:root{
  --sage:#B8D1BC;
  --sage-soft:#CFE0D2;
  --sage-deep:#9CBBA1;
  --deep:#6C7864;
  --deep-txt:#55604E;
  --deep-ink:#414A3B;
  --beige:#F4F0E9;
  --beige-deep:#ECE6DB;
  --beige-warm:#EFE7D7;
  --gray:#78746B;
  --ink:#3A3A36;
  --white:#FDFCF9;
  --shadow:rgba(85,96,78,0.10);
  --shadow-strong:rgba(85,96,78,0.22);
  --display:'Marcellus', 'Cormorant Garamond', 'Playfair Display', Georgia, 'Times New Roman', serif;
  --serif:'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --hand:'Caveat', 'Brush Script MT', cursive;
  --sans:'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--sans);color:var(--ink);background:var(--beige);
  font-weight:300;line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
::selection{background:var(--sage);color:var(--deep-txt);}
h1,h2,h3,h4{font-weight:400;line-height:1.15;color:var(--deep-txt);}
.serif{font-family:var(--serif);}
.display{font-family:var(--display);}
.hand{font-family:var(--hand);color:var(--deep);}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}

.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
.wrap-narrow{max-width:820px;margin:0 auto;padding:0 32px;}
.eyebrow{
  font-family:var(--sans);font-weight:500;letter-spacing:.32em;
  text-transform:uppercase;font-size:.72rem;color:var(--deep);
}

/* ============================== NAV ============================== */
nav.site-nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 40px;transition:all .5s ease;
}
nav.site-nav.scrolled{
  background:rgba(244,240,233,0.94);backdrop-filter:blur(14px);
  padding:14px 40px;box-shadow:0 1px 0 rgba(108,120,100,.12);
}
.brand-logo{display:flex;align-items:center;}
.brand-wordmark{height:54px;width:auto;display:block;transition:height .4s ease;}
nav.site-nav.scrolled .brand-wordmark{height:42px;}
.nav-links{display:flex;gap:34px;align-items:center;}
.nav-links a{
  font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink);font-weight:400;position:relative;transition:color .3s;
}
.nav-links a:not(.nav-cta)::after{
  content:'';position:absolute;left:0;bottom:-6px;width:0;height:1px;
  background:var(--deep);transition:width .35s ease;
}
.nav-links a:not(.nav-cta):hover::after{width:100%;}
.nav-cta{
  border:1px solid var(--deep);border-radius:40px;padding:11px 24px;
  color:var(--deep-txt);font-weight:500;transition:all .4s ease;
}
.nav-cta:hover{background:var(--deep);color:var(--white);transform:translateY(-1px);}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;z-index:120;}
.burger span{width:24px;height:2px;background:var(--ink);transition:.3s;}

/* sections under fixed nav shouldn't be hidden */
section[id],header[id]{scroll-margin-top:120px;}

/* ============================== BUTTONS ============================== */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-weight:500;letter-spacing:.1em;
  text-transform:uppercase;font-size:.82rem;cursor:pointer;
  padding:18px 36px;border-radius:46px;
  transition:all .45s cubic-bezier(.2,.7,.3,1);
  border:1px solid transparent;text-align:center;
}
.btn-primary{background:var(--deep);color:var(--white);box-shadow:0 14px 32px -10px rgba(85,96,78,.55);}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 20px 42px -12px rgba(85,96,78,.7);background:var(--deep-txt);}
.btn-ghost{border-color:var(--deep);color:var(--deep-txt);}
.btn-ghost:hover{background:rgba(108,120,100,.08);}
.btn-light{background:var(--beige);color:var(--deep-txt);box-shadow:0 14px 34px -12px rgba(0,0,0,.4);}
.btn-light:hover{background:var(--white);transform:translateY(-3px);}
.btn .arrow{transition:transform .4s;display:inline-block;}
.btn:hover .arrow{transform:translateX(6px);}
.btn-xl{padding:22px 44px;font-size:.88rem;}

/* ============================== REVEAL ============================== */
.reveal{opacity:0;transform:translateY(38px);transition:opacity 1s cubic-bezier(.2,.7,.3,1),transform 1s cubic-bezier(.2,.7,.3,1);}
.reveal.in{opacity:1;transform:none;}
.reveal.d1{transition-delay:.12s;}
.reveal.d2{transition-delay:.24s;}
.reveal.d3{transition-delay:.36s;}
.reveal.d4{transition-delay:.48s;}

section{position:relative;}
.pad{padding:130px 0;}
.pad-sm{padding:80px 0;}
.center{text-align:center;}
.section-head{max-width:46rem;margin:0 auto 70px;text-align:center;}
.section-head h2{font-family:var(--display);font-size:clamp(2.1rem,4.4vw,3.4rem);margin-top:16px;}
.section-head p{font-family:var(--serif);font-size:1.32rem;color:var(--gray);margin-top:18px;}

/* ============================== FOOTER ============================== */
footer.site-foot{background:linear-gradient(180deg,var(--deep-txt),var(--deep-ink));color:var(--sage-soft);padding:80px 0 38px;}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:60px;padding-bottom:50px;border-bottom:1px solid rgba(184,209,188,.18);align-items:start;}
.foot-brand .foot-wordmark{height:78px;width:auto;display:block;}
.foot-brand p{font-family:var(--serif);font-style:italic;font-size:1.15rem;margin-top:20px;max-width:22rem;color:var(--sage-soft);}
.foot-col h5{font-family:var(--sans);font-weight:500;letter-spacing:.18em;text-transform:uppercase;font-size:.74rem;color:var(--sage);margin-bottom:20px;}
.foot-col a{display:block;font-family:var(--serif);font-size:1.06rem;margin-bottom:10px;color:#E6E8DD;transition:color .3s;}
.foot-col a:hover{color:var(--sage);}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:30px;font-size:.78rem;letter-spacing:.05em;color:rgba(207,224,210,.6);}
.foot-bottom a{color:rgba(207,224,210,.78);}
.foot-bottom a:hover{color:var(--sage);}
.foot-legal{display:flex;gap:18px;flex-wrap:wrap;}

/* ============================== LEGAL PAGES ============================== */
.legal-hero{padding:160px 0 60px;background:linear-gradient(180deg,var(--beige) 0%,var(--beige-warm) 100%);text-align:center;border-bottom:1px solid rgba(108,120,100,.1);}
.legal-hero .eyebrow{color:var(--deep);}
.legal-hero h1{font-family:var(--display);font-size:clamp(2.4rem,5vw,3.6rem);margin:18px 0 12px;}
.legal-hero p{font-family:var(--serif);font-size:1.2rem;color:var(--gray);font-style:italic;}
.legal-body{padding:80px 0 120px;}
.legal-body h2{font-family:var(--display);font-size:1.7rem;margin:46px 0 14px;color:var(--deep-txt);border-bottom:1px solid var(--sage);padding-bottom:12px;}
.legal-body h2:first-of-type{margin-top:0;}
.legal-body h3{font-family:var(--serif);font-size:1.3rem;font-weight:500;margin:28px 0 8px;color:var(--deep-txt);}
.legal-body p{font-family:var(--serif);font-size:1.12rem;color:var(--ink);margin-bottom:14px;}
.legal-body ul{margin:10px 0 18px 26px;font-family:var(--serif);font-size:1.1rem;color:var(--ink);}
.legal-body li{margin-bottom:8px;}
.legal-body table{width:100%;border-collapse:collapse;margin:18px 0;font-family:var(--serif);font-size:1.05rem;}
.legal-body table th,.legal-body table td{padding:14px 16px;text-align:left;border-bottom:1px solid rgba(108,120,100,.18);vertical-align:top;}
.legal-body table th{background:var(--beige-warm);color:var(--deep-txt);font-weight:500;letter-spacing:.04em;}
.legal-body a{color:var(--deep);text-decoration:underline;text-underline-offset:3px;}
.legal-body a:hover{color:var(--deep-txt);}
.legal-card{background:var(--white);border-radius:18px;padding:36px 38px;margin:20px 0;border:1px solid rgba(108,120,100,.08);box-shadow:0 18px 40px -28px var(--shadow);}
.legal-card p:last-child{margin-bottom:0;}
.legal-meta{font-family:var(--sans);font-size:.86rem;color:var(--gray);text-align:center;margin-top:60px;letter-spacing:.04em;}

/* ============================== COOKIE BANNER ============================== */
.cookie-banner{
  position:fixed;bottom:24px;left:24px;right:24px;max-width:540px;
  background:var(--white);border-radius:18px;padding:24px 28px;
  box-shadow:0 30px 70px -20px rgba(58,58,54,.32);z-index:200;
  display:none;border:1px solid rgba(108,120,100,.12);
}
.cookie-banner.show{display:block;animation:slideUp .6s cubic-bezier(.2,.7,.3,1);}
@keyframes slideUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:none;}}
.cookie-banner h4{font-family:var(--display);font-size:1.15rem;color:var(--deep-txt);margin-bottom:8px;}
.cookie-banner p{font-family:var(--serif);font-size:.98rem;color:var(--ink);margin-bottom:14px;line-height:1.55;}
.cookie-banner p a{color:var(--deep);text-decoration:underline;}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap;}
.cookie-actions .btn{padding:12px 22px;font-size:.74rem;letter-spacing:.08em;}

/* ============================== RESPONSIVE ============================== */
@media(max-width:900px){
  .nav-links{position:fixed;top:0;right:0;height:100vh;width:78%;background:var(--beige);flex-direction:column;justify-content:center;gap:32px;transform:translateX(100%);transition:transform .5s;box-shadow:-10px 0 40px -20px var(--shadow);padding:0 30px;}
  .nav-links.open{transform:none;}
  .burger{display:flex;}
  nav.site-nav{padding:18px 24px;}
  .foot-grid{grid-template-columns:1fr;gap:40px;}
  .pad{padding:90px 0;}
}
@media(max-width:520px){
  .wrap,.wrap-narrow{padding:0 22px;}
  .legal-body{padding:60px 0 90px;}
  .legal-card{padding:26px 22px;}
  .cookie-banner{left:14px;right:14px;bottom:14px;padding:22px 22px;}
}


/* ============================== STRATEGIC CTAs ============================== */

/* Sticky WhatsApp (esquina inferior derecha) */
#sticky-wa{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:90;
  display:inline-flex;
  align-items:center;
  gap:0;
  background:#25D366;
  color:#FFFFFF;
  height:62px;
  padding:0 22px 0 18px;
  border-radius:40px;
  box-shadow:0 18px 40px -10px rgba(37,211,102,.45), 0 8px 24px -8px rgba(0,0,0,.18);
  font-family:var(--sans);
  font-weight:500;
  letter-spacing:.06em;
  font-size:.86rem;
  overflow:hidden;
  max-width:62px;
  transition:max-width .55s cubic-bezier(.2,.7,.3,1), transform .35s ease, box-shadow .35s ease;
  opacity:0;
  transform:translateY(20px) scale(.9);
  pointer-events:none;
}
#sticky-wa.visible{opacity:1;transform:none;pointer-events:auto;}
#sticky-wa svg{flex-shrink:0;}
#sticky-wa .sticky-wa-label{
  white-space:nowrap;
  overflow:hidden;
  opacity:0;
  max-width:0;
  margin-left:0;
  transition:opacity .35s ease .1s, max-width .55s cubic-bezier(.2,.7,.3,1), margin-left .35s ease;
}
#sticky-wa:hover{
  max-width:340px;
  transform:translateY(-3px);
  box-shadow:0 24px 50px -12px rgba(37,211,102,.55), 0 10px 28px -8px rgba(0,0,0,.22);
}
#sticky-wa:hover .sticky-wa-label{
  opacity:1;
  max-width:240px;
  margin-left:12px;
}
@media(min-width:900px){
  /* On desktop, after some seconds the label peeks out once to attract attention */
  #sticky-wa.pulse{max-width:280px;}
  #sticky-wa.pulse .sticky-wa-label{opacity:1;max-width:200px;margin-left:12px;}
}
@media(max-width:520px){
  #sticky-wa{right:14px;bottom:14px;height:56px;padding:0 18px 0 16px;}
}

/* CTA al final de "Lo que te llevas" */
.curio-cta{
  grid-column:1/-1;
  text-align:center;
  margin-top:54px;
  padding-top:46px;
  border-top:1px dashed rgba(108,120,100,.28);
}
.curio-cta-lead{
  font-family:var(--serif);
  font-style:italic;
  font-size:1.34rem;
  color:var(--deep-txt);
  margin-bottom:24px;
  max-width:34rem;
  margin-left:auto;
  margin-right:auto;
}
.curio-cta-lead em{font-style:normal;color:var(--deep);font-weight:500;}

/* CTA al final del "Ritual" (fondo verde oscuro) */
.ritual-cta{
  text-align:center;
  margin-top:80px;
  padding-top:50px;
  border-top:1px solid rgba(184,209,188,.18);
}
.ritual-cta-lead{
  font-family:var(--serif);
  font-style:italic;
  font-size:1.34rem;
  color:var(--sage-soft);
  margin-bottom:26px;
  max-width:34rem;
  margin-left:auto;
  margin-right:auto;
}

/* CTA al final de "Sobre mí" */
.about-cta{
  margin-top:34px;
  display:inline-flex;
}

/* Hide sticky WhatsApp when cookie banner is open (avoid overlap on mobile) */
@media(max-width:520px){
  .cookie-banner.show ~ #sticky-wa{transform:translateY(140px) scale(.85);opacity:0;pointer-events:none;}
}