:root {
  --font-primary: acumin-pro, "Helvetica Neue", sans-serif;
  --font-condensed: acumin-pro, "Arial Narrow", sans-serif;
  --wine: #4c1818;
  --wine-deep: #2a0d0d;
  --cream: #eee5d3;
  --paper: #f7f1e5;
  --gold: #b98a43;
  --ink: #2c211a;
  --line: rgba(44, 33, 26, 0.18);
  --content-width: 1175px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-size: 16px;
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-primary);
  font-weight: 300;
}
body.menu-open { overflow: hidden; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }

.header {
  position: fixed;
  z-index: 20;
  top: 0;
  left: 0;
  width: 100%;
  height: 70px;
  padding: 0 24px;
  display: flex;
  align-items: center;
  color: white;
  border-bottom: 0;
  background:rgba(44,42,35,.5);
  backdrop-filter:blur(5px);
  transition: 1s;
}
.header__content {
  width:min(var(--content-width),100%);
  height:100%;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.header.scrolled { height: 60px; background:rgba(44,42,35,.5); backdrop-filter: blur(10px); }
.brand { font-family:var(--font-primary); font-weight:300; letter-spacing:.2em; font-size:1.25rem; }
.nav { display: flex; gap: 30px; }
.nav a { position: relative; text-transform: uppercase; font-size: .8rem; font-weight: 400; }
.nav a::after { content:""; position:absolute; left:0; bottom:-8px; width:0; height:1px; background:white; transition:width .25s; }
.nav a:hover::after { width:100%; }
.menu-button { display:none; border:0; padding:8px; background:none; }
.menu-button span { display:block; width:26px; height:1px; margin:7px; background:white; transition:.3s; }

.hero { position: relative; min-height: 100svh; height:742px; overflow: hidden; color:white; }
.hero > img { position:absolute; inset:0; width:100%; height:100%; display:block; object-fit:cover; object-position:center center; }
.placeholder { position:relative; overflow:hidden; display:grid; place-items:center; background-color:#b99563; }
.placeholder::before {
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(135deg, transparent 49.7%, rgba(255,255,255,.22) 50%, transparent 50.3%),
    linear-gradient(45deg, transparent 49.7%, rgba(255,255,255,.18) 50%, transparent 50.3%);
  background-size: 42px 42px;
}
.placeholder span { position:relative; z-index:1; padding:12px 18px; color:rgba(255,255,255,.78); border:1px solid rgba(255,255,255,.45); text-align:center; text-transform:uppercase; letter-spacing:.16em; font-size:.58rem; line-height:1.7; }
.placeholder--hero { position:absolute; inset:0; background:linear-gradient(120deg,#71673b,#b4854e 48%,#44261d); }
.placeholder--hero span { top:-25%; }
.hero__shade {
  position:absolute;
  inset:0;
  background:linear-gradient(
    180deg,
    rgba(20,5,5,.08) 25%,
    rgba(45,10,12,.38) 55%,
    rgba(76,24,24,.9) 88%,
    var(--wine) 100%
  );
}
.hero__content { position:absolute; z-index:2; left:50%; bottom:155px; width:min(850px,90%); transform:translateX(-50%); text-align:center; }
.hero__content.reveal { transform:translate(-50%,28px); }
.hero__content.reveal.visible { transform:translate(-50%,0); }
.eyebrow { margin:0 0 18px; text-transform:uppercase; font-size:.62rem; font-weight:500; letter-spacing:.22em; }
.hero h1 { margin:0; font-family:var(--font-primary); font-size:clamp(3.2rem,6vw,5rem); font-weight:300; line-height:1; letter-spacing:.18em; }
.hero__divider { display:block; width:108px; height:1px; margin:25px auto 11px; background:rgba(255,255,255,.75); }
.hero__content > p:last-child { margin:0; font-family:var(--font-primary); font-size:clamp(1.4rem,3vw,2.65rem); font-weight:300; letter-spacing:-.035em; }
.scroll-cue { position:absolute; z-index:2; left:50%; bottom:18px; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:5px; font-size:.52rem; letter-spacing:.02em; text-transform:lowercase; }
.scroll-cue i { position:relative; display:block; width:12px; height:18px; border:1px solid rgba(255,255,255,.9); border-radius:8px; animation:pulse 1.8s infinite; }
.scroll-cue i::after { content:""; position:absolute; left:50%; top:3px; width:2px; height:4px; border-radius:2px; background:white; transform:translateX(-50%); }
@keyframes pulse { 50% { transform:translateY(4px); opacity:.55; } }

.section-dark { background:var(--paper); color:white; }
.legacy {
  min-height:500px;
  position:relative;
  overflow:hidden;
  padding:78px 50% 125px max(24px, calc((100% - var(--content-width)) / 2));
  display:block;
}
.legacy::before {
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath fill='%234c1818' d='M0 0H100V55C82 57 69 68 58 80C46 93 36 99 25 99C15 99 7 92 0 82Z'/%3E%3C/svg%3E");
  background-position:center;
  background-repeat:no-repeat;
  background-size:100% 100%;
}
.legacy__copy { position:relative; z-index:4; max-width:390px; }
h2 { margin:0; font-family:var(--font-primary); font-weight:300; text-transform:uppercase; font-size:clamp(2.4rem,4.5vw,4.6rem); line-height:1.02; letter-spacing:.025em; }
.legacy__copy h2 { font-family:var(--font-primary); font-size:clamp(1.9rem,3.5vw,2.8rem); font-weight:300; line-height:1.12; letter-spacing:-.035em; }
.legacy__copy > p:not(.eyebrow) { margin:40px 0 0; font-size:.9rem; font-weight:400; line-height:1.75; color:rgba(255,255,255,.9); }
.text-link { display:inline-flex; gap:20px; align-items:center; text-transform:uppercase; font-size:.62rem; font-weight:500; letter-spacing:.16em; border-bottom:1px solid rgba(255,255,255,.45); padding-bottom:8px; }
.text-link span { transition:transform .25s; }
.text-link:hover span { transform:translateX(6px); }
.legacy__visual { position:absolute; z-index:2; top:62px; right:-4%; width:52%; height:365px; }
.legacy__visual img { width:100%; height:100%; display:block; object-fit:contain; object-position:right center; }
.placeholder--cane { width:100%; height:100%; min-height:0; background:linear-gradient(145deg,#c89758,#807945 46%,#b77450); clip-path:polygon(8% 0,100% 0,100% 100%,0 100%,0 15%); }
.botanical {
  position:absolute;
  z-index:1;
  left:max(-40px, calc((100% - var(--content-width)) / 2 - 120px));
  bottom:40px;
  width:300px;
  height:auto;
  display:block;
  pointer-events:none;
  user-select:none;
}

.product { padding:120px clamp(24px,5vw,76px) 95px; background:var(--paper); }
.product__showcase { max-width:1240px; margin:auto; display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:66px; }
.product__pack { position:relative; padding:1.5rem; border:1px solid rgba(76,24,24,.25); display:grid; place-items:center; }
.product__pack img { display:block; width:auto; height:auto; max-width:100%; max-height:510px; object-fit:contain; filter:drop-shadow(0 18px 18px rgba(58,38,19,.14)); }
.placeholder--pack { width:min(290px,72%); aspect-ratio:7/10; background:linear-gradient(145deg,#d8cfb7,#8b9a58 28%,#ba8a47 68%,#efe5cf); box-shadow:0 18px 36px rgba(58,38,19,.15); }
.pack-arrow { position:absolute; top:50%; width:30px; height:30px; display:grid; place-items:center; border:1px solid rgba(76,24,24,.3); border-radius:50%; color:var(--wine); background:transparent; font-size:1.2rem; cursor:pointer; }
.pack-arrow--prev { left:14px; }
.pack-arrow--next { right:14px; }
.product__details { text-align:center; color:var(--wine); font-family:var(--font-condensed); }
.product__details h2 { margin-bottom:30px; font-family:var(--font-condensed); font-size:clamp(1.6rem,2.5vw,2.15rem); font-weight:400; letter-spacing:.015em; }
.differences { padding:1.2rem; background:#e2d8ca; }
.differences > p { margin:0 0 22px; text-transform:uppercase; text-decoration:underline; text-underline-offset:6px; font-size: 1rem; font-weight:500; letter-spacing:.02em; }
.differences__grid { display:grid; grid-template-columns:1fr 1fr; gap:24px 40px; }
.differences__grid div { display:flex; flex-direction:column; gap:4px; font-size:.7rem; font-weight:300; line-height:1.35; color:#352821; }
.differences__grid strong { color:var(--wine); font-weight:400; font-size:.86rem; letter-spacing:.005em; }
.product__claims { margin:44px 0 22px; }
.product__claims p { margin:0; padding:12px 5px; border-bottom:1px solid rgba(76,24,24,.6); text-transform:uppercase; font-size:1rem; font-weight:300; letter-spacing:.015em; }
.product__details > small { display:block; font-size:.7rem; font-weight:300; line-height:1.3; color:#352821; }
.outline-button { margin-top:22px; border:1px solid var(--ink); background:transparent; padding:12px 18px; text-transform:uppercase; letter-spacing:.13em; font-size:.52rem; cursor:pointer; transition:.25s; }
.outline-button:hover { background:var(--ink); color:white; }

.newsletter { width:min(1240px,calc(100% - 36px)); min-height:315px; margin:0 auto 62px; background:var(--wine); color:white; display:grid; grid-template-columns:1.1fr .9fr; }
.newsletter__copy {
  min-width:0;
  padding:36px clamp(28px,4.6vw,60px) 34px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.newsletter__copy h2 { font-family:var(--font-primary); font-weight:300; font-size:clamp(1.8rem, 3.5vw, 2.55rem); line-height:1.12; letter-spacing:-.035em; }
.form { margin-top:24px; max-width:400px; }
.form label:not(.acceptpolicy) { display:block; border:1px solid rgba(255,255,255,.55); margin-bottom:10px; }
.form label:not(.acceptpolicy) > span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.form input:not([type=checkbox]) { width:100%; height:40px; border:0; outline:0; color:white; background:transparent; padding:6px 10px; font-size:.9rem; }
.form input::placeholder { color:rgba(255,255,255,.9); opacity:1; }
.acceptpolicy { display:flex; gap:6px; align-items:flex-start; margin:10px 0 17px; line-height:1.35; }
.acceptpolicy input { accent-color:var(--gold); }
.acceptpolicy span { font-size:.8rem; text-transform:none; letter-spacing:0; }
.form button { border:0; background:var(--paper); padding:10px 22px; color:var(--wine); text-transform:uppercase; font-size:.9rem; letter-spacing:.05em; cursor:pointer; transition:.25s; }
.form button:hover { background:var(--gold); color:white; }
.form button:disabled { cursor:wait; opacity:.68; }
.form input[aria-invalid="true"] { box-shadow:inset 0 0 0 2px #ffd0c7; }
.form__trap { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.form__message { min-height:1.25em; margin:8px 0 0; font-size:.7rem; line-height:1.4; color:#ffd0c7; }
.form__message[data-type="success"] { color:#e7d59e; }
.form.is-success > label,
.form.is-success > button,
.form.is-success > .form__trap { display:none; }
.form.is-success .form__message {
  position:relative;
  display:grid;
  gap:5px;
  min-height:0;
  margin:0;
  padding:22px 22px 22px 65px;
  border:1px solid rgba(231,213,158,.55);
  background:rgba(255,255,255,.08);
  color:white;
  font-size:.82rem;
  line-height:1.5;
  animation:form-success-in .45s ease both;
}
.form.is-success .form__message::before {
  content:"✓";
  position:absolute;
  left:20px;
  top:22px;
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border:1px solid var(--gold);
  border-radius:50%;
  color:var(--gold);
  font-size:.95rem;
}
.form.is-success .form__message strong { color:#e7d59e; font-size:1rem; font-weight:500; }
.form.is-success .form__message span { color:rgba(255,255,255,.84); }
@keyframes form-success-in {
  from { opacity:0; transform:translateY(8px); }
  to { opacity:1; transform:translateY(0); }
}
.form__message[data-type="pending"] { color:rgba(255,255,255,.8); }
.newsletter__image { min-width:0; min-height:315px; }
.newsletter__image img { width:100%; height:100%; min-height:315px; display:block; object-fit:cover; object-position:center 48%; }
.placeholder--coffee { width:100%; height:100%; background:linear-gradient(145deg,#6a401d,#c99343 45%,#351914); }
.footer { padding:52px 24px 18px; background:var(--cream); color:var(--wine); }
.footer__content { width:min(var(--content-width),100%); margin:auto; display:grid; grid-template-columns:1fr 1fr; align-items:center; row-gap:32px; }
.footer__social { display:flex; align-items:center; gap:18px; }
.footer__social a { display:grid; place-items:center; transition:transform .25s,opacity .25s; }
.footer__social a:hover { transform:translateY(-2px); opacity:.65; }
.footer__social svg { width:25px; height:25px; fill:currentColor; }
.footer__social svg rect,.footer__social svg circle:not(.fill) { fill:none; stroke:currentColor; stroke-width:1.8; }
.footer__links { display:flex; justify-content:flex-end; align-items:center; gap:12px; font-size:.9rem; color:var(--ink); }
.footer__links span { width:1px; height:15px; background:rgba(44,33,26,.45); }
.footer__links a,.footer__credit { transition:color .2s; }
.footer__links a:hover,.footer__credit:hover { color:var(--gold); }
.footer__content > p { margin:0; font-size:.9rem; color:var(--ink); }
.footer__credit { justify-self:end; font-size:.9rem; color:rgba(44,33,26,.42); }

.cookie-banner {
  position:fixed;
  z-index:50;
  left:50%;
  bottom:24px;
  width:min(var(--content-width),calc(100% - 48px));
  padding:22px 24px;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:28px;
  color:var(--ink);
  background:rgba(247,241,229,.98);
  border-top:3px solid var(--gold);
  box-shadow:0 18px 60px rgba(42,13,13,.28);
  opacity:0;
  transform:translate(-50%,calc(100% + 48px));
  transition:opacity .45s ease,transform .65s cubic-bezier(.2,.8,.2,1);
}
.cookie-banner[hidden] { display:none; }
.cookie-banner.is-visible { opacity:1; transform:translate(-50%,0); }
.cookie-banner__copy { display:flex; align-items:center; }

.cookie-banner h2 { margin:0 0 5px; font-size:1.15rem; line-height:1.2; letter-spacing:0; }
.cookie-banner__copy div > p { max-width:630px; margin:0; font-size:.76rem; line-height:1.5; }
.cookie-banner__actions { display:flex; gap:10px; }
.cookie-banner button {
  min-height:42px;
  padding:10px 18px;
  border:1px solid var(--wine);
  text-transform:uppercase;
  font-size:.58rem;
  font-weight:500;
  letter-spacing:.08em;
  cursor:pointer;
  transition:background .25s,color .25s;
}
.cookie-banner__reject { color:var(--wine); background:transparent; }
.cookie-banner__accept { color:white; background:var(--wine); }
.cookie-banner__reject:hover { color:white; background:var(--wine); }
.cookie-banner__accept:hover { background:var(--gold); border-color:var(--gold); }
.modal { width:min(500px,calc(100% - 32px)); color:var(--ink); background:var(--paper); border:0; padding:50px; box-shadow:0 30px 90px rgba(0,0,0,.4); }
.modal::backdrop { background:rgba(35,10,10,.82); backdrop-filter:blur(4px); }
.modal__close { position:absolute; right:20px; top:12px; border:0; background:none; font-size:2rem; cursor:pointer; }
.modal h2 { font-size:2.8rem; margin-bottom:30px; }
.nutrition { border-top:3px solid var(--ink); border-bottom:3px solid var(--ink); padding:12px 0; margin-bottom:18px; }
.nutrition div { display:flex; justify-content:space-between; padding:9px 0; border-top:1px solid var(--line); font-size:.78rem; }
.modal small { font-size:.6rem; }
.reveal { opacity:0; transform:translateY(28px); transition:opacity .8s ease,transform .8s ease; }
.reveal.visible { opacity:1; transform:none; }
.parallax-item {
  transform:translate3d(0, var(--parallax-y, 0px), 0);
  will-change:transform;
}
.parallax-media { transform:translate3d(0, var(--parallax-y, 0px), 0) scale(1.04); }
.newsletter__image { overflow:hidden; }
/* Desktop com pouca altura (ex.: notebooks 1366 x 768). */
@media (min-width: 781px) and (max-height: 800px) {
  .hero {
    height: 100svh;
    min-height: 620px;
  }

  .hero__content { bottom: clamp(104px, 15vh, 126px); }
  .hero h1 { font-size: clamp(3.2rem, 5.4vw, 4.35rem); }
  .hero__divider { margin-top: 20px; }
  .hero__content > p:last-child { font-size: clamp(1.4rem, 2.6vw, 2.2rem); }

  .legacy {
    min-height: 440px;
    padding-top: 62px;
    padding-bottom: 92px;
  }

  .legacy__copy > p:not(.eyebrow) { margin-top: 28px; }
  .legacy__visual {
    top: 44px;
    height: 330px;
  }

  .botanical {
    bottom: 4rem;
    width: 260px;
  }

  .product { padding-block: 68px 58px; }
  .product__showcase { gap: 54px; }
  .product__pack {
    min-height: 500px;
    padding: 38px;
  }

  .product__pack img { max-height: 420px; }
  .product__details h2 { margin-bottom: 22px; }
  .differences { padding-block: 20px 22px; }
  .differences > p { margin-bottom: 17px; }
  .differences__grid { gap: 18px 34px; }
  .product__claims { margin-block: 30px 16px; }
  .product__claims p { padding-block: 9px; }
  .outline-button { margin-top: 17px; }

  .newsletter {
    min-height: 290px;
    margin-bottom: 48px;
  }

  .newsletter__copy { padding-block: 30px 28px; }
  .newsletter__copy h2 { font-size: clamp(1.8rem, 2.4vw, 2.25rem); }
  .form { margin-top: 18px; }
  .newsletter__image,
  .newsletter__image img { min-height: 290px; }

  .footer { padding-top: 42px; }
}

@media (max-width: 780px) {
  .header,
  .header.scrolled { height:64px; padding-inline:18px; backdrop-filter:none; }
  .header__content { height:64px; }
  .brand,
  .menu-button { position:relative; z-index:22; }
  .menu-button {
    display:block;
    width:44px;
    height:44px;
    padding:0;
    border:1px solid rgba(255,255,255,.48);
    border-radius:50%;
    color:white;
    cursor:pointer;
  }
  .menu-button span {
    position:absolute;
    left:10px;
    width:22px;
    margin:0;
  }
  .menu-button span:first-child { top:17px; }
  .menu-button span:last-child { top:24px; }
  .nav {
    position:fixed;
    z-index:21;
    inset:0;
    min-height:100svh;
    padding:128px 24px 92px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:0;
    background:
      radial-gradient(circle at 86% 9%, rgba(185,138,67,.2), transparent 28%),
      url("assets/images/folhas.svg") left -145px bottom -190px / 390px auto no-repeat,
      var(--wine-deep);
    clip-path:circle(0 at calc(100% - 40px) 32px);
    visibility:hidden;
    transition:clip-path .72s cubic-bezier(.77,0,.18,1), visibility 0s .72s;
  }

  .nav a {
    width:min(100%,520px);
    padding:22px 0;
    display:grid;
    grid-template-columns:1fr;
    align-items:center;
    border-bottom:1px solid rgba(255,255,255,.16);
    font-family:var(--font-primary);
    font-size:clamp(2rem,9vw,3rem);
    font-weight:300;
    line-height:1;
    letter-spacing:-.025em;
    opacity:0;
    transform:translateY(24px);
    transition:opacity .45s ease, transform .55s cubic-bezier(.2,.8,.2,1);
  }
  .nav a:first-of-type { border-top:1px solid rgba(255,255,255,.16); }

  .nav a::after { display:none; }
  .menu-open .nav {
    clip-path:circle(150% at calc(100% - 40px) 32px);
    visibility:visible;
    transition:clip-path .72s cubic-bezier(.77,0,.18,1), visibility 0s;
  }
  .menu-open .nav a { opacity:1; transform:none; }
  .menu-open .nav a:nth-of-type(1) { transition-delay:.26s; }
  .menu-open .nav a:nth-of-type(2) { transition-delay:.34s; }
  .menu-open .nav a:nth-of-type(3) { transition-delay:.42s; }
  .menu-open .menu-button span:first-child { transform:translateY(4px) rotate(45deg); }
  .menu-open .menu-button span:last-child { transform:translateY(-4px) rotate(-45deg); }
  .hero { min-height:700px; height:100svh; }
  .hero > img { object-position:46% center; }
  .hero__content { bottom:135px; }
  .hero h1 { font-size:clamp(2.8rem,15vw,4.2rem); letter-spacing:.13em; }
  .hero__content > p:last-child { font-size:clamp(1.25rem,7vw,2rem); line-height:1.2; }
  .legacy { min-height:700px; padding:80px 24px 120px; }
  .legacy::before {
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath fill='%234c1818' d='M0 0H100V80C82 81 68 84 55 87C40 90 25 91 14 89C8 88 4 87 0 85Z'/%3E%3C/svg%3E");
  }
  .legacy__copy {
    max-width:470px;
    margin-inline:auto;
    text-align:center;
  }
  .legacy__visual { top:auto; right:-12%; bottom:0; width:92%; height:340px; }
  .legacy__visual img { object-position:center; }
  .botanical { bottom:110px; }
  .placeholder--cane { min-height:0; }
  .product { padding-block:90px 70px; }
  .product__showcase { grid-template-columns:1fr; }
  .product__pack { min-height:460px; }
  .product__pack img { max-width:72%; max-height:390px; }
  .product__details { min-height:auto; }
  .differences { padding-inline:20px; }
  .newsletter { grid-template-columns:1fr; }
  .newsletter__copy { padding-block:60px; }
  .newsletter__image { min-height:420px; }
  .newsletter__image img { min-height:420px; object-position:center; }
  .footer__content { row-gap:28px; }
}

@media (max-width: 500px) {
  .product__pack { min-height:410px; padding:34px; }
  .product__pack img { max-width:82%; max-height:350px; }
  .differences__grid { grid-template-columns:1fr; gap:20px; }
  .newsletter { width:100%; margin-bottom:0; }
  .newsletter__copy { padding:65px 24px; }
  .form { max-width:none; }
  .form button { width:100%; }
  .footer { padding-block:42px 28px; }
  .footer__content { grid-template-columns:1fr; justify-items:center; text-align:center; row-gap:24px; }
  .footer__links { justify-content:center; grid-row:2; }
  .footer__content > p { grid-row:3; }
  .footer__credit { grid-row:4; justify-self:center; }
  .cookie-banner {
    bottom:12px;
    width:calc(100% - 24px);
    padding:20px;
    grid-template-columns:1fr;
    gap:18px;
  }
  .cookie-banner__copy { align-items:flex-start; }
  .cookie-banner__actions { width:100%; }
  .cookie-banner button { flex:1; padding-inline:10px; }
}

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

}