/* ==========================================================================
   VALNUA — Editorial front page (post-loader)
   Design tokens, prefixed "ed-" to avoid colliding with the legacy
   design system still used by cuenta.html / the splash loader.
   ========================================================================== */
:root{
  --vw-cream:  #FAF7F2;
  --vw-cream2: #F0EBE3;
  --vw-gold:   #C9A96E;
  --vw-night:  #1A1208;
  --vw-brown:  #5B4636;
  --vw-border: rgba(26,18,8,0.12);
  --ed-ease: cubic-bezier(0.25,0.1,0.25,1);
}

body{ background:var(--vw-cream); }

/* ==========================================================================
   1. NAV
   ========================================================================== */
.ed-nav{
  position:sticky; top:0; z-index:100; height:56px; background:var(--vw-cream);
  transition:background .4s var(--ed-ease), backdrop-filter .4s var(--ed-ease);
}
.ed-nav.is-scrolled{
  background:rgba(250,245,238,0.9);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
}
.ed-nav-inner{ height:100%; display:flex; align-items:center; justify-content:space-between; padding:0 40px; }
.ed-logo{ font-family:'Cormorant Garamond',serif; font-size:27px; font-weight:700; letter-spacing:0.22em; color:var(--vw-night); text-decoration:none; }
.ed-nav-links{ display:flex; gap:32px; }
.ed-nav-links a{
  font-family:'Inter',sans-serif; font-size:9.5px; text-transform:uppercase; letter-spacing:0.12em;
  color:var(--vw-brown); text-decoration:none; transition:opacity .4s ease;
}
.ed-nav-links a:hover{ opacity:.6; }
.ed-nav-cta{
  font-family:'Inter',sans-serif; font-size:9.5px; text-transform:uppercase; letter-spacing:0.12em;
  border:0.5px solid var(--vw-gold); color:var(--vw-gold); padding:6px 16px;
  text-decoration:none; transition:opacity .4s ease;
}
.ed-nav-cta:hover{ opacity:.6; }

/* ---------- Liquid glass + magic gold dust (hover) ---------- */
.ed-magic-btn{
  position:relative; overflow:visible; isolation:isolate;
  backdrop-filter:url(#ed-glass-distortion) blur(6px) saturate(160%);
  -webkit-backdrop-filter:blur(6px) saturate(160%);
  background:linear-gradient(135deg, rgba(255,255,255,.05), rgba(201,169,110,.05));
  transition:background .45s ease, box-shadow .45s ease, opacity .4s ease, transform .3s ease !important;
}
.ed-magic-btn::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%), rgba(255,255,255,.75), rgba(201,169,110,.25) 45%, transparent 68%);
  opacity:0; transition:opacity .3s ease; pointer-events:none;
}
.ed-magic-btn:hover{
  background:linear-gradient(135deg, rgba(255,255,255,.18), rgba(201,169,110,.22));
  box-shadow:0 6px 24px -8px rgba(201,169,110,.55);
}
.ed-magic-btn:hover::before{ opacity:1; transition:opacity .15s ease; }
.ed-dust{
  position:absolute; width:4px; height:4px; border-radius:50%;
  background:radial-gradient(circle, #FFF6DE 0%, var(--vw-gold) 55%, transparent 100%);
  box-shadow:0 0 6px 1px rgba(201,169,110,.85);
  pointer-events:none; z-index:6; opacity:0;
}
@media (prefers-reduced-motion: reduce){ .ed-dust{ display:none; } }

/* ==========================================================================
   2. HERO TRIPTYCH
   ========================================================================== */
.ed-hero-triptych{
  width:100%; min-height:100svh; display:grid; grid-template-columns:1fr 1fr 1fr;
  gap:0; background:var(--vw-cream2);
}
.ed-panel{
  position:relative; overflow:hidden;
  border-right:0.5px solid rgba(201,169,110,0.22);
  opacity:0;
}
.ed-panel:last-child{ border-right:none; }
.ed-panel-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ed-panel-overlay{ position:absolute; inset:0; background:linear-gradient(to top, rgba(26,18,8,0.72) 0%, transparent 55%); }
.ed-panel-overlay-dark{ background:linear-gradient(to top, rgba(26,18,8,0.85) 0%, transparent 55%); }
.ed-panel-text{ position:absolute; bottom:36px; left:32px; right:32px; }
.ed-panel-dot{ display:block; width:5px; height:5px; border-radius:50%; background:var(--vw-gold); opacity:.6; margin-bottom:10px; }
.ed-panel-tag{ display:block; font-family:'Inter',sans-serif; font-weight:700; font-size:16px; text-transform:uppercase; letter-spacing:0.1em; color:var(--vw-gold); }
.ed-panel-title{ font-family:'Cormorant Garamond',serif; font-size:clamp(26px,3vw,32px); font-weight:500; color:#FAF5EE; margin-top:10px; }
.ed-panel-body{ font-family:'Inter',sans-serif; font-size:15px; color:rgba(250,245,238,0.7); line-height:1.6; margin-top:10px; }
.ed-panel{ cursor:pointer; }
.ed-panel:hover{ opacity:.88 !important; transition:opacity .5s ease; }
@media (prefers-reduced-motion: reduce){ .ed-panel{ opacity:1 !important; } }

/* ==========================================================================
   3. BOTTOM BAR
   ========================================================================== */
.ed-bottombar{
  height:64px; background:var(--vw-cream); border-top:0.5px solid rgba(201,169,110,0.2);
  display:flex; align-items:center; justify-content:space-between; padding:0 40px;
}
.ed-bottombar-left{ font-family:'Inter',sans-serif; font-size:10px; text-transform:uppercase; color:var(--vw-gold); letter-spacing:0.18em; }
.ed-bottombar-cta{
  font-family:'Inter',sans-serif; font-size:9px; text-transform:uppercase; letter-spacing:0.15em;
  background:var(--vw-night); color:var(--vw-cream); padding:12px 28px; text-decoration:none;
  border-radius:0; transition:background .4s ease;
}
.ed-bottombar-cta:hover{ background:#2C3E2D; }
.ed-bottombar-right{ font-family:'Cormorant Garamond',serif; font-size:14px; font-style:italic; color:var(--vw-gold); }

/* ==========================================================================
   3b. SECCIÓN MISIÓN — visión de marca, por etapas
   ========================================================================== */
.ed-mission{ background:var(--vw-cream2); padding:110px 80px; position:relative; overflow:hidden; min-height:420px; }
.ed-mission-mark{
  position:absolute; bottom:-6%; right:-4%;
  font-family:'Cormorant Garamond',serif; font-weight:600;
  font-size:clamp(90px,15vw,220px); color:var(--vw-gold); opacity:.08; letter-spacing:0.03em;
  white-space:nowrap; pointer-events:none; z-index:0; line-height:1;
}
.ed-mission-copy{ max-width:640px; position:relative; z-index:1; }
.ed-mission-copy .ed-eyebrow{ margin-bottom:16px; }
.ed-mission-copy .ed-h2{ margin-bottom:20px; }
.ed-mission-copy .ed-body{ margin-bottom:0; max-width:560px; }

/* ==========================================================================
   3b-2. PRECIO DE LANZAMIENTO
   ========================================================================== */
.ed-launch{ display:flex; align-items:center; gap:72px; padding:110px 80px; background:var(--vw-cream); }
.ed-launch-visual{ width:38%; flex-shrink:0; }
.ed-launch-visual img{ width:100%; aspect-ratio:1/1; height:auto; object-fit:cover; display:block; opacity:0; }
.ed-launch-copy{ max-width:520px; }
.ed-launch-copy .ed-eyebrow{ margin-bottom:16px; }
.ed-launch-copy .ed-h2{ margin-bottom:20px; }
.ed-launch-copy .ed-body{ margin-bottom:28px; }
.ed-launch-price{ display:flex; align-items:baseline; gap:14px; margin-bottom:32px; opacity:0; }
.ed-launch-price-now{ font-family:'Cormorant Garamond',serif; font-weight:600; font-size:40px; color:var(--vw-night); }
.ed-launch-price-note{ font-family:'Inter',sans-serif; font-size:9px; text-transform:uppercase; letter-spacing:0.14em; color:var(--vw-gold); }
.ed-launch-cta{ padding:12px 30px; font-size:10px; }
@media (prefers-reduced-motion: reduce){ .ed-launch-visual img{ opacity:1 !important; } }

/* ==========================================================================
   3c. SECCIONES "COMING SOON" — próximas fórmulas por etapa
   ========================================================================== */
.ed-soon{ display:flex; align-items:center; gap:64px; padding:100px 80px; background:var(--vw-cream); }
.ed-soon.ed-soon-alt{ flex-direction:row-reverse; background:var(--vw-cream2); }
.ed-soon-visual{ width:46%; flex-shrink:0; position:relative; }
.ed-soon-visual img{ width:100%; height:auto; display:block; opacity:0; }
.ed-soon-badge{
  position:absolute; top:20px; right:20px; font-family:'Inter',sans-serif; font-size:9px;
  text-transform:uppercase; letter-spacing:0.16em; color:var(--vw-gold);
  border:0.5px solid var(--vw-gold); padding:6px 14px; background:rgba(250,247,242,0.85);
}
.ed-soon-copy{ max-width:520px; }
.ed-soon-copy .ed-eyebrow{ margin-bottom:16px; }
.ed-soon-copy .ed-h2{ font-size:36px; margin-bottom:20px; }
.ed-soon-copy .ed-body{ margin-bottom:28px; }
.ed-soon-cta{
  display:inline-block; font-family:'Inter',sans-serif; font-size:9.5px; text-transform:uppercase; letter-spacing:0.12em;
  border:0.5px solid var(--vw-gold); color:var(--vw-gold); padding:10px 24px;
  text-decoration:none; transition:opacity .4s ease; opacity:0;
}
.ed-soon-cta:hover{ opacity:.6; }
@media (prefers-reduced-motion: reduce){ .ed-soon-visual img{ opacity:1 !important; } }

/* ==========================================================================
   4. SECCIÓN PRODUCTO
   ========================================================================== */
.ed-product{ display:flex; padding:120px 80px; background:var(--vw-cream); }
.ed-product-image{ width:55%; }
.ed-product-image img{ width:100%; aspect-ratio:1920/1072; height:auto; object-fit:cover; display:block; }
.ed-product-copy{ width:45%; padding-left:64px; align-self:center; }
.ed-eyebrow{ display:block; font-family:'Inter',sans-serif; font-weight:600; font-size:11.5px; text-transform:uppercase; letter-spacing:0.18em; color:#B08A4E; margin-bottom:16px; opacity:0; }
.ed-h2{ font-family:'Cormorant Garamond',serif; font-size:44px; color:var(--vw-night); font-weight:400; line-height:1.18; margin-bottom:20px; opacity:0; }
.ed-body{ font-family:'Inter',sans-serif; font-size:15px; color:var(--vw-brown); line-height:1.8; margin-bottom:32px; opacity:0; }
.ed-badges{ display:flex; gap:12px; margin-bottom:32px; flex-wrap:wrap; opacity:0; }
.ed-badge{ font-family:'Inter',sans-serif; font-size:8px; text-transform:uppercase; letter-spacing:0.14em; border:0.5px solid var(--vw-border); padding:5px 14px; color:var(--vw-brown); }
.ed-textlink{ font-family:'Inter',sans-serif; font-size:9px; text-transform:uppercase; color:var(--vw-gold); text-decoration:underline; text-decoration-thickness:0.5px; transition:opacity .4s ease; opacity:0; }
.ed-textlink:hover{ opacity:.6; }
@media (prefers-reduced-motion: reduce){
  .ed-product-image,.ed-eyebrow,.ed-h2,.ed-body,.ed-badges,.ed-textlink{ opacity:1 !important; transform:none !important; }
}

/* ==========================================================================
   5. SECCIÓN INGREDIENTES
   ========================================================================== */
.ed-ingredients{ background:var(--vw-night); padding:100px 80px; display:grid; grid-template-columns:1fr 1fr; }
.ed-ing-col-bordered{ border-right:0.5px solid rgba(201,169,110,0.15); padding-right:60px; }
.ed-ing-col:last-child{ padding-left:60px; }
.ed-ing-number{ font-family:'Cormorant Garamond',serif; font-weight:400; font-size:96px; color:var(--vw-gold); line-height:1; }
.ed-ing-unit{ font-size:32px; margin-left:6px; }
.ed-ing-label{ display:block; font-family:'Inter',sans-serif; font-size:10px; text-transform:uppercase; letter-spacing:0.22em; color:rgba(250,245,238,0.5); margin-top:8px; margin-bottom:12px; }
.ed-ing-desc{ font-family:'Inter',sans-serif; font-size:13px; color:rgba(250,245,238,0.6); line-height:1.8; }

/* ==========================================================================
   6. SECCIÓN RITUAL
   ========================================================================== */
.ed-ritual{ background:var(--vw-cream2); }
.ed-ritual-img{ width:100%; max-width:2096px; margin-inline:auto; aspect-ratio:2096/704; height:auto; object-fit:cover; display:block; opacity:0; }
.ed-ritual-caption{ text-align:center; padding:28px 0; font-family:'Cormorant Garamond',serif; font-style:italic; font-size:18px; color:var(--vw-brown); letter-spacing:0.04em; }
@media (prefers-reduced-motion: reduce){ .ed-ritual-img{ opacity:1 !important; } }

/* ==========================================================================
   7. SECCIÓN LIFESTYLE
   ========================================================================== */
.ed-lifestyle{ display:flex; padding:80px; background:var(--vw-cream); }
.ed-lifestyle-image{ width:45%; }
.ed-lifestyle-image img{ width:100%; aspect-ratio:1920/1072; height:auto; object-fit:cover; object-position:left; display:block; }
.ed-lifestyle-copy{ width:55%; padding-left:80px; align-self:center; }
.ed-h2-lg{ font-family:'Cormorant Garamond',serif; font-size:40px; color:var(--vw-night); line-height:1.2; font-weight:400; opacity:0; }
.ed-body-lg{ font-family:'Inter',sans-serif; font-size:14px; color:var(--vw-brown); line-height:1.8; margin-top:20px; opacity:0; }
.ed-divider{ display:block; width:48px; height:0.5px; background:var(--vw-border); margin:24px 0; transform:scaleX(0); transform-origin:left; }
.ed-italic{ font-family:'Cormorant Garamond',serif; font-style:italic; font-size:18px; color:var(--vw-brown); opacity:0; }
@media (prefers-reduced-motion: reduce){
  .ed-lifestyle-image,.ed-h2-lg,.ed-body-lg,.ed-italic{ opacity:1 !important; transform:none !important; }
  .ed-divider{ transform:scaleX(1) !important; }
}

/* ==========================================================================
   8. SECCIÓN INGREDIENTES VISUAL
   ========================================================================== */
.ed-ing-visual{ background:var(--vw-cream2); }
.ed-ing-visual img{ width:100%; height:560px; object-fit:cover; object-position:center 38%; display:block; opacity:0; }
@media (prefers-reduced-motion: reduce){ .ed-ing-visual img{ opacity:1 !important; } }

/* ==========================================================================
   9. FOOTER
   ========================================================================== */
.ed-footer{ background:var(--vw-night); padding:64px 80px; }
.ed-footer-top{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; }
.ed-footer-logo{ font-family:'Cormorant Garamond',serif; font-size:12px; letter-spacing:0.26em; color:var(--vw-cream); opacity:.8; }
.ed-footer-links{ display:flex; gap:24px; flex-wrap:wrap; }
.ed-footer-links a{ font-family:'Inter',sans-serif; font-size:9px; text-transform:uppercase; color:var(--vw-cream); opacity:.4; text-decoration:none; transition:opacity .4s ease; }
.ed-footer-links a:hover{ opacity:.7; }
.ed-footer-divider{ display:block; height:0.5px; width:100%; background:rgba(201,169,110,0.2); margin:32px 0; transform:scaleX(0); transform-origin:left; }
.ed-footer-bottom{ text-align:center; font-family:'Inter',sans-serif; font-size:8px; color:var(--vw-cream); opacity:.3; }
@media (prefers-reduced-motion: reduce){ .ed-footer-divider{ transform:scaleX(1) !important; } }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:1024px){
  .ed-product{ padding:80px 40px; }
  .ed-lifestyle{ padding:60px 40px; }
  .ed-ingredients{ padding:70px 40px; }
  .ed-footer{ padding:48px 40px; }
}
@media (max-width:860px){
  .ed-nav-inner{ padding:0 20px; }
  .ed-nav-links{ display:none; }
  .ed-hero-triptych{ grid-template-columns:1fr; min-height:auto; }
  .ed-panel{ min-height:80svh; border-right:none; border-bottom:0.5px solid rgba(201,169,110,0.22); }
  .ed-panel:last-child{ border-bottom:none; }
  .ed-bottombar{ flex-direction:column; height:auto; gap:10px; padding:16px 20px; }
  .ed-mission{ padding:60px 24px; }
  .ed-mission-mark{ font-size:22vw; opacity:.1; }
  .ed-launch{ flex-direction:column; padding:60px 24px; gap:32px; }
  .ed-launch-visual{ width:100%; max-width:320px; }
  .ed-soon, .ed-soon.ed-soon-alt{ flex-direction:column; padding:60px 24px; gap:32px; text-align:left; }
  .ed-soon-visual{ width:100%; max-width:320px; }
  .ed-product{ flex-direction:column; padding:60px 24px; }
  .ed-product-image, .ed-product-copy{ width:100%; }
  .ed-product-copy{ padding-left:0; padding-top:32px; }
  .ed-ingredients{ grid-template-columns:1fr; padding:60px 24px; gap:48px; }
  .ed-ing-col-bordered{ border-right:none; border-bottom:0.5px solid rgba(201,169,110,0.15); padding-right:0; padding-bottom:40px; }
  .ed-ing-col:last-child{ padding-left:0; }
  .ed-ing-number{ font-size:64px; }
  .ed-lifestyle{ flex-direction:column; padding:60px 24px; }
  .ed-lifestyle-image, .ed-lifestyle-copy{ width:100%; }
  .ed-lifestyle-copy{ padding-left:0; padding-top:32px; }
  .ed-ing-visual img{ height:340px; }
  .ed-footer{ padding:40px 24px; }
  .ed-footer-top{ flex-direction:column; align-items:flex-start; }
}