:root {
  --ciruela: #78013A;
  --ciruela-profunda: #5F3747;
  --cacao: #2B2226;
  --crema: #F7F1EA;
  --beige: #DBC5AA;
  --blanco: #FFFFFF;
  --energia: #F3C545;
  --energia-deep: #F19A00;
  --placer: #C48ECA;
  --placer-deep: #A17EB4;
  --balance: #9BBE63;
  --balance-deep: #6E9E2A;
  --naranja: #FE7404;
  --shadow: 0 22px 60px rgba(43,34,38,.11);
  --radius-lg: 32px;
  --radius-md: 22px;
  --container: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "Nunito Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--cacao);
  background: var(--crema);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
.container { width: min(var(--container), calc(100% - 40px)); margin: 0 auto; }
.section-shell { padding: 104px 0; }
.skip-link {
  position: fixed;
  left: 16px;
  top: -80px;
  z-index: 9999;
  padding: 10px 14px;
  background: var(--cacao);
  color: white;
  border-radius: 10px;
}
.skip-link:focus { top: 16px; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(247,241,234,.88);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(95,55,71,.08);
}
.nav-wrap {
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.brand img { width: 144px; height: auto; }
.site-nav { display: flex; align-items: center; gap: 28px; font-size: .95rem; font-weight: 700; }
.site-nav > a:not(.nav-cta) { position: relative; }
.site-nav > a:not(.nav-cta)::after {
  content: "";
  position: absolute;
  left: 0; right: 100%; bottom: -5px;
  height: 2px;
  background: var(--ciruela);
  transition: right .22s ease;
}
.site-nav > a:not(.nav-cta):hover::after { right: 0; }
.nav-cta {
  background: var(--ciruela);
  color: white;
  padding: 11px 18px;
  border-radius: 999px;
}
.menu-toggle { display: none; border: 0; background: transparent; padding: 8px; }
.menu-toggle span { display:block; width:24px; height:2px; background: var(--cacao); margin:5px 0; }

.hero { padding-top: 86px; overflow: hidden; }
.hero-grid {
  min-height: 650px;
  display: grid;
  grid-template-columns: 0.92fr 1.08fr;
  align-items: center;
  gap: 48px;
}
.eyebrow {
  margin: 0 0 14px;
  color: var(--ciruela);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 900;
  font-size: .76rem;
}
.hero h1, .section-heading h2, .difference h2, .ideas h2, .closing h2 {
  margin: 0;
  color: var(--ciruela);
  font-weight: 900;
  line-height: 1.03;
  letter-spacing: -.035em;
}
.hero h1 { font-size: clamp(3rem, 6vw, 5.75rem); max-width: 720px; }
.hero-lead {
  max-width: 670px;
  margin: 26px 0 0;
  font-size: clamp(1.03rem, 1.5vw, 1.22rem);
  color: rgba(43,34,38,.82);
}
.hero-lead strong { color: var(--ciruela); }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 32px; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  border-radius: 999px;
  font-weight: 800;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--ciruela); color: white; box-shadow: 0 12px 26px rgba(120,1,58,.16); }
.button-ghost { border: 1px solid rgba(95,55,71,.25); background: rgba(255,255,255,.48); }
.microcopy { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top: 28px; color: rgba(43,34,38,.65); font-size:.9rem; font-weight:700; }
.microcopy i { width:4px; height:4px; background:var(--naranja); border-radius:50%; }

.hero-products {
  position: relative;
  height: 650px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero-pack { position:absolute; filter: drop-shadow(0 25px 26px rgba(43,34,38,.13)); }
.pack-center { width: 46%; z-index: 3; transform: translateY(12px); }
.pack-left { width: 37%; left: 2%; top: 26%; z-index: 2; transform: rotate(-5deg); }
.future-pack { position:absolute; right:0; top: 27%; width:37%; z-index:2; transform: rotate(5deg); }
.future-pack .pack-right { position:relative; width:100%; opacity:.82; }
.future-badge {
  position:absolute;
  right: 10%;
  top: 4%;
  z-index:5;
  padding: 7px 11px;
  border-radius:999px;
  background: var(--ciruela);
  color:white;
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.04em;
  box-shadow: 0 8px 20px rgba(43,34,38,.14);
}
.hero-blob { position:absolute; border-radius:50%; filter: blur(1px); opacity:.38; }
.blob-energy { width:420px; height:420px; background:var(--energia); left:21%; top:14%; }
.blob-pleasure { width:260px; height:260px; background:var(--placer); left:0; bottom:12%; }
.blob-balance { width:240px; height:240px; background:var(--balance); right:0; top:16%; }

.intro-strip {
  background: var(--ciruela);
  color: white;
  padding: 34px 0;
}
.intro-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; }
.intro-grid p { margin:0; padding:0 26px; border-right:1px solid rgba(255,255,255,.18); color:rgba(255,255,255,.82); }
.intro-grid p:last-child { border-right:0; }
.intro-grid strong { color:white; font-size:1.1rem; }

.section-heading { max-width: 780px; margin-bottom: 52px; }
.section-heading.narrow { max-width: 660px; }
.section-heading h2, .difference h2, .ideas h2, .closing h2 { font-size: clamp(2.35rem, 4.4vw, 4.25rem); }
.section-heading > p:last-child, .difference-title > p:last-child { margin-top:18px; max-width:700px; color:rgba(43,34,38,.72); font-size:1.05rem; }

.products { background:white; }
.product-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; align-items:stretch; }
.product-card {
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid rgba(43,34,38,.08);
  background: var(--crema);
  display:flex;
  flex-direction:column;
  min-width:0;
}
.product-visual {
  position:relative;
  height: 425px;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:26px 20px 0;
}
.product-card.energy .product-visual { background: linear-gradient(180deg, rgba(243,197,69,.34), rgba(255,255,255,.5)); }
.product-card.pleasure .product-visual { background: linear-gradient(180deg, rgba(196,142,202,.34), rgba(255,255,255,.5)); }
.product-card.balance .product-visual { background: linear-gradient(180deg, rgba(155,190,99,.32), rgba(255,255,255,.5)); }
.product-visual img { height: 94%; width:auto; object-fit:contain; filter: drop-shadow(0 18px 24px rgba(43,34,38,.13)); }
.product-number {
  position:absolute; left:22px; top:18px;
  color:rgba(43,34,38,.38); font-size:.78rem; font-weight:900; letter-spacing:.12em;
}
.product-status {
  position:absolute; right:18px; top:15px; z-index:4;
  background: var(--ciruela); color:white; border-radius:999px; padding:6px 10px;
  font-size:.68rem; font-weight:900;
}
.product-copy { padding:28px 28px 30px; }
.product-kicker { margin:0 0 5px; color:rgba(43,34,38,.58); font-size:.82rem; font-weight:800; }
.product-copy h3 { margin:0; font-size:2rem; line-height:1; letter-spacing:.01em; }
.energy h3 { color: var(--energia-deep); }
.pleasure h3 { color: var(--placer-deep); }
.balance h3 { color: var(--balance-deep); }
.product-role { margin:15px 0 0; font-weight:800; }
.ingredients { margin:7px 0 0; color:rgba(43,34,38,.72); }
.product-format { display:inline-block; margin-top:18px; padding-top:14px; border-top:1px solid rgba(43,34,38,.1); font-size:.82rem; font-weight:800; color:rgba(43,34,38,.58); }

.difference { background:var(--crema); }
.difference-grid { display:grid; grid-template-columns:.78fr 1.22fr; gap:70px; align-items:start; }
.difference-title { position:sticky; top:130px; }
.pillars { display:grid; gap:16px; }
.pillar {
  background:white;
  border:1px solid rgba(43,34,38,.07);
  border-radius:var(--radius-md);
  padding:30px;
  display:grid;
  grid-template-columns:54px 1fr;
  column-gap:18px;
}
.pillar span { grid-row:1 / span 2; width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:var(--ciruela); color:white; font-size:.72rem; font-weight:900; }
.pillar h3 { margin:3px 0 7px; font-size:1.25rem; color:var(--ciruela); }
.pillar p { margin:0; color:rgba(43,34,38,.7); }

.moments { background:white; }
.moments-line { display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:1px solid rgba(43,34,38,.08); border-radius:var(--radius-lg); overflow:hidden; }
.moment-card { padding:42px 34px; border-right:1px solid rgba(43,34,38,.08); background:linear-gradient(180deg,#fff,var(--crema)); }
.moment-card:last-child { border-right:0; }
.moment-time { width:58px; height:58px; border-radius:50%; display:grid; place-items:center; margin-bottom:28px; background:var(--ciruela); color:white; font-size:.76rem; font-weight:900; }
.moment-card:nth-child(2) .moment-time { background:var(--energia-deep); }
.moment-card:nth-child(3) .moment-time { background:var(--placer-deep); }
.moment-card h3 { margin:0 0 9px; color:var(--ciruela); font-size:1.25rem; }
.moment-card p { margin:0; color:rgba(43,34,38,.68); }

.ideas { background: var(--ciruela); }
.ideas-card {
  color:white;
  border-radius:var(--radius-lg);
  padding:62px;
  display:grid;
  grid-template-columns:1fr .8fr;
  gap:60px;
  background:
    radial-gradient(circle at 86% 10%, rgba(254,116,4,.28), transparent 27%),
    radial-gradient(circle at 72% 85%, rgba(196,142,202,.26), transparent 28%),
    #5e0c36;
}
.ideas .eyebrow { color:var(--energia); }
.ideas h2 { color:white; }
.ideas p { color:rgba(255,255,255,.75); max-width:620px; }
.ideas-list { display:grid; gap:12px; align-content:center; }
.ideas-list span {
  display:flex; align-items:center; gap:12px;
  padding:16px 18px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  font-weight:800;
}
.ideas-list span::before { content:""; width:10px; height:10px; border-radius:50%; background:var(--energia); flex:0 0 auto; }

.closing { background:var(--crema); }
.closing-inner { max-width:830px; text-align:center; display:flex; flex-direction:column; align-items:center; }
.closing-inner > img { width:170px; margin-bottom:28px; }
.closing-inner h2 { max-width:800px; }
.closing-inner > p:not(.eyebrow) { max-width:690px; margin:22px 0 28px; color:rgba(43,34,38,.7); }

.site-footer { background:var(--cacao); color:white; padding:36px 0; }
.footer-grid { display:grid; grid-template-columns:auto 1fr auto; gap:28px; align-items:center; }
.footer-grid img { width:120px; filter: brightness(0) invert(1); opacity:.9; }
.footer-grid p { margin:0; color:rgba(255,255,255,.68); font-size:.86rem; }
.copyright { text-align:right; }

.reveal {
  opacity:0;
  transform:translateY(18px);
  transition:opacity .65s ease, transform .65s ease;
}
.reveal.is-visible { opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior:auto !important; }
  .reveal { opacity:1; transform:none; transition:none; }
  .button { transition:none; }
}

@media (max-width: 980px) {
  .section-shell { padding:82px 0; }
  .hero-grid { grid-template-columns:1fr; min-height:unset; }
  .hero-products { height:540px; order:-1; }
  .hero-copy { text-align:center; }
  .hero-lead { margin-left:auto; margin-right:auto; }
  .hero-actions, .microcopy { justify-content:center; }
  .product-grid { grid-template-columns:1fr; }
  .product-card { display:grid; grid-template-columns: .92fr 1.08fr; }
  .product-visual { height:430px; }
  .product-copy { display:flex; flex-direction:column; justify-content:center; }
  .difference-grid { grid-template-columns:1fr; gap:42px; }
  .difference-title { position:static; }
  .ideas-card { grid-template-columns:1fr; gap:30px; }
}

@media (max-width: 780px) {
  .container { width:min(100% - 28px, var(--container)); }
  .nav-wrap { min-height:68px; }
  .brand img { width:124px; }
  .menu-toggle { display:block; }
  .site-nav {
    position:absolute;
    top:68px; left:14px; right:14px;
    display:none; flex-direction:column; align-items:stretch; gap:0;
    padding:12px;
    border-radius:20px;
    background:white;
    box-shadow:var(--shadow);
    border:1px solid rgba(43,34,38,.08);
  }
  .site-nav.open { display:flex; }
  .site-nav a { padding:13px 12px; }
  .site-nav > a:not(.nav-cta)::after { display:none; }
  .nav-cta { margin-top:6px; text-align:center; }

  .hero { padding-top:46px; }
  .hero-products { height:430px; }
  .pack-center { width:54%; }
  .pack-left { width:40%; top:28%; }
  .future-pack { width:40%; top:29%; }
  .blob-energy { width:290px; height:290px; }
  .blob-pleasure,.blob-balance { width:170px; height:170px; }
  .hero h1 { font-size:clamp(2.7rem, 12vw, 4.4rem); }
  .intro-grid { grid-template-columns:1fr; }
  .intro-grid p { border-right:0; border-bottom:1px solid rgba(255,255,255,.16); padding:12px 0 20px; }
  .intro-grid p:last-child { border-bottom:0; padding-bottom:12px; }
  .product-card { display:flex; }
  .product-visual { height:440px; }
  .moments-line { grid-template-columns:1fr; }
  .moment-card { border-right:0; border-bottom:1px solid rgba(43,34,38,.08); }
  .moment-card:last-child { border-bottom:0; }
  .ideas-card { padding:38px 24px; }
  .footer-grid { grid-template-columns:1fr; text-align:center; justify-items:center; }
  .copyright { text-align:center; }
}

@media (max-width: 520px) {
  .section-shell { padding:66px 0; }
  .hero-products { height:350px; margin-bottom:8px; }
  .pack-center { width:58%; }
  .pack-left { width:42%; left:-2%; top:29%; }
  .future-pack { width:42%; right:-2%; top:30%; }
  .future-badge { font-size:.56rem; padding:5px 8px; right:4%; }
  .hero-actions { flex-direction:column; }
  .button { width:100%; }
  .product-visual { height:380px; }
  .product-copy { padding:24px; }
  .pillar { grid-template-columns:46px 1fr; padding:24px 20px; }
  .ideas-card { border-radius:24px; }
}