/* =========================================================
   SEGOE PRO (assets/segoe-pro) — fonte de texto do projeto
========================================================= */
@font-face {
  font-family: "Segoe Pro";
  src: url("../segoe-pro/SegoePro-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Segoe Pro";
  src: url("../segoe-pro/SegoePro-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Segoe Pro";
  src: url("../segoe-pro/SegoePro-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Segoe Pro";
  src: url("../segoe-pro/SegoePro-Italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Segoe Pro";
  src: url("../segoe-pro/SegoePro-Semibold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Segoe Pro";
  src: url("../segoe-pro/SegoePro-SemiboldItalic.ttf") format("truetype");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Segoe Pro";
  src: url("../segoe-pro/SegoePro-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Segoe Pro";
  src: url("../segoe-pro/SegoePro-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Segoe Pro";
  src: url("../segoe-pro/SegoePro-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* =========================================================
   DON LAURINDO — DESIGN TOKENS
   (extraídos do design system do Figma — Cormorant Garamond +
   Source Sans 3, paleta creme/verde/terracota)
========================================================= */
:root {
  --color-cream: #f8efe8;
  --color-green: #253830;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-terracotta: #cd8a59;
  --color-placeholder: #d9d9d9;

  /* Cor de destaque no hover. Vira verde nas faixas terracota, senão o link
     desapareceria contra o próprio fundo. */
  --dl-hover: var(--color-terracotta);

  --font-serif: "Cormorant Garamond", Georgia, serif;
  --font-sans: "Source Sans 3", Arial, sans-serif;
  --font-body: "Segoe Pro", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;

  --fs-hero: 50px;
  --fs-h2: 50px;
  --fs-h3: 26px;
  --fs-h4: 26px;
  --fs-eyebrow: 14px;
  --fs-nav: 18px;
  --fs-body: 16px;
  --fs-caption: 16px;

  --lh-heading: 55px;
  --lh-body: 1.3;

  --space-3xs: 10px;
  --space-2xs: 20px;
  --space-xs: 40px;
  --space-sm: 60px;
  --space-md: 80px;
  --space-lg: 100px;
  --space-xl: 120px;

  --container-max: 1500px;
  --header-height: 90px;

  /* Bootstrap overrides */
  --bs-body-font-family: var(--font-body);
  --bs-body-color: var(--color-black);
  --bs-body-bg: var(--color-cream);
  --bs-link-color: var(--color-green);
  --bs-link-hover-color: var(--color-terracotta);
}

/* =========================================================
   RESET / BASE
========================================================= */
html {
  scroll-behavior: smooth;
}
body {
  background: var(--color-cream);
  color: var(--color-black);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
}
img {
  max-width: 100%;
}
a {
  color: inherit;
  text-decoration: none;
}
a:hover,
a:focus {
  color: inherit;
}
h1,
h2,
h3,
h4,
h5,
p {
  margin: 0;
}

.container-dl {
  max-width: var(--container-max);
  margin: 0 auto;
  padding-left: var(--space-lg);
  padding-right: var(--space-lg);
}

.underline {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.eyebrow {
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  font-weight: 400;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  color: var(--color-green);
  display: block;
}

.section-heading {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h2);
  line-height: var(--lh-heading);
  text-transform: uppercase;
  color: var(--color-green);
  text-align: center;
}

.dl-link-text {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  letter-spacing: -0.48px;
  color: var(--color-green);
}

.btn-dl {
  display: inline-block;
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: var(--fs-body);
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: var(--color-white);
  background: var(--color-green);
  padding: 14px 32px;
  border-radius: 2px;
  transition: background 0.2s ease;
}
.btn-dl:hover {
  background: var(--color-terracotta);
  color: var(--color-white);
}

.btn-dl-outline {
  display: inline-block;
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: var(--fs-body);
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: var(--color-green);
  background: transparent;
  border: 1px solid var(--color-green);
  padding: 13px 32px;
  border-radius: 2px;
  transition:
    background 0.2s ease,
    color 0.2s ease;
}
.btn-dl-outline:hover {
  background: var(--color-green);
  color: var(--color-white);
}

/* =========================================================
   HEADER / NAV
========================================================= */
.site-header {
  position: sticky;
  top: 0;
  width: 100%;
  background: var(--color-cream);
  z-index: 1040;
  transition:
    transform 0.7s cubic-bezier(0.16, 1, 0.3, 1),
    opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.4s ease;
  will-change: transform, opacity;
}
/* Esconde ao descer, reaparece ao subir (controlado pelo theme.js). */
.site-header.is-hidden {
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none;
}
/* Quando o GSAP assume a animação, o CSS não pode competir com ele. */
.site-header.is-gsap {
  transition: box-shadow 0.5s ease;
}
.site-header.is-scrolled {
  box-shadow: 0 6px 24px -18px rgba(37, 56, 48, 0.55);
}
.site-header.is-menu-open {
  box-shadow: none;
}

.site-header .navbar {
  padding: 20px 0;
  position: relative;
  z-index: 3;
}
.site-header .navbar-brand img {
  width: 160px;
  height: 50px;
  object-fit: contain;
}

/* Faixa creme que se abre atrás do submenu, na largura total da página. */
.dl-nav-backdrop {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 0;
  background: var(--color-cream);
  overflow: hidden;
  pointer-events: none;
  z-index: 1;
  transition: height 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.dl-nav-link {
  font-family: var(--font-serif);
  font-size: var(--fs-nav);
  font-weight: 600;
  color: var(--color-green) !important;
  text-transform: uppercase;
  letter-spacing: -0.54px;
  white-space: nowrap;
  background: none;
  border: none;
  padding: 0;
  opacity: 1;
  position: relative;
  transition: opacity 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.dl-nav-link--static {
  cursor: default;
}
.dl-nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -5px;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Ao passar o mouse no menu, os demais itens recuam e o ativo ganha o traço. */
.navbar-nav.is-dimmed .dl-nav-link,
.navbar-nav:hover .dl-nav-link {
  opacity: 0.45;
}
.navbar-nav .nav-item:hover > .dl-nav-link,
.navbar-nav .nav-item.is-open > .dl-nav-link,
.navbar-nav .nav-item.is-current > .dl-nav-link {
  opacity: 1;
}
.navbar-nav .nav-item:hover > .dl-nav-link::after,
.navbar-nav .nav-item.is-open > .dl-nav-link::after {
  transform: scaleX(1);
  transform-origin: left center;
}

.site-header .navbar-toggler {
  border: none;
  padding: 0;
  box-shadow: none !important;
}
.site-header .navbar-toggler .navbar-toggler-icon {
  background-image: none;
  position: relative;
  width: 26px;
  height: 18px;
}
.site-header .navbar-toggler .navbar-toggler-icon span {
  display: block;
  width: 26px;
  height: 2px;
  background: var(--color-green);
  margin: 6px 0;
  transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---------- Menu mobile (offcanvas) ---------- */
.dl-offcanvas {
  background: var(--color-cream);
  width: min(88vw, 420px);
}
.dl-offcanvas .offcanvas-header {
  padding: 26px var(--space-2xs) 10px;
  align-items: center;
  justify-content: space-between;
}
.dl-offcanvas .offcanvas-title {
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-green);
}
.dl-offcanvas-close {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(37, 56, 48, 0.25);
  border-radius: 50%;
  background: transparent;
  position: relative;
  padding: 0;
  cursor: pointer;
  transition:
    background 0.35s ease,
    border-color 0.35s ease,
    transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.dl-offcanvas-close span {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 16px;
  height: 1.5px;
  background: var(--color-green);
  transition: background 0.35s ease;
}
.dl-offcanvas-close span:first-child {
  transform: translate(-50%, -50%) rotate(45deg);
}
.dl-offcanvas-close span:last-child {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.dl-offcanvas-close:hover {
  background: var(--color-green);
  border-color: var(--color-green);
  transform: rotate(90deg);
}
.dl-offcanvas-close:hover span {
  background: var(--color-white);
}

.dl-offcanvas .offcanvas-body {
  padding: 10px var(--space-2xs) 40px;
}
.dl-offcanvas .nav-link {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 20px;
  color: var(--color-green);
  text-transform: uppercase;
  padding: 10px 0;
  transition:
    color 0.35s ease,
    padding-left 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.dl-offcanvas .nav-link:hover {
  color: var(--dl-hover);
  padding-left: 6px;
}
.dl-offcanvas .dl-submenu {
  padding-left: 16px;
  border-left: 1px solid rgba(37, 56, 48, 0.15);
  margin: 4px 0 14px;
}
.dl-offcanvas .dl-submenu .nav-link {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 400;
  text-transform: none;
  padding: 7px 0;
}

/* ---------- Submenu desktop ---------- */
.dl-dropdown {
  position: relative;
}

/* Painel de submenu: sem cartão/sombra — é uma extensão do header, como no layout. */
.dl-dropdown-panel {
  display: none;
  gap: 60px;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 13px 0 40px;
  margin: 0 !important;
  position: absolute;
  top: calc(100% + 20px);
  left: 0;
  min-width: 220px;
  z-index: 2;
}
.dl-dropdown.is-open > .dl-dropdown-panel {
  display: flex;
}
.dl-dropdown-col {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 17px;
  min-width: 150px;
}
.dl-dropdown-link {
  display: inline-block;
  position: relative;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 21px;
  color: var(--color-green);
  white-space: nowrap;
  transition: color 0.4s ease;
}
.dl-dropdown-link::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -3px;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.dl-dropdown-link:hover {
  color: var(--dl-hover);
}
.dl-dropdown-link:hover::after {
  transform: scaleX(1);
  transform-origin: left center;
}
.dl-dropdown-link--static {
  opacity: 0.55;
  cursor: default;
}
.dl-dropdown-link--static::after {
  display: none;
}

/* =========================================================
   HERO
========================================================= */
.hero {
  position: relative;
  width: 100%;
  height: 720px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero__title {
  position: relative;
  z-index: 1;
  width: 90%;
  max-width: 860px;
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-align: center;
  text-transform: uppercase;
  color: var(--color-white);
}

/* =========================================================
   LEGACY
========================================================= */
.legacy {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 240px var(--space-lg) 0;
  text-align: center;
}
/* No layout o título do legado é menor que os demais títulos de seção. */
.legacy .section-heading {
  font-size: var(--fs-h3);
  line-height: 1.25;
}
.legacy__text {
  max-width: 706px;
  margin: 0 auto;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

/* =========================================================
   WINES / LINHAS
========================================================= */
.wines {
  width: 100%;
  padding: 220px 0 var(--space-lg);
}
.wines__header {
  max-width: var(--container-max);
  margin: 0 auto var(--space-md);
  padding: 0 var(--space-lg);
}

/* Carrossel de linhas: largura total da página, sem setas/dots — navega só arrastando. */
.wines .owl-carousel {
  cursor: grab;
}
.wines .owl-carousel:active {
  cursor: grabbing;
}
.wines .owl-carousel .owl-stage {
  display: flex;
}
/* O recuo lateral é calculado pelo theme.js: os cards ficam sempre centrados
   no eixo horizontal, então não sobra espaço vazio de um lado só quando há
   poucas linhas cadastradas. A seção recorta o excesso. */
.wines,
.other-lines {
  overflow: hidden;
}
.wine-card {
  text-decoration: none;
  display: block;
  width: 250px;
}
.wine-card__image {
  width: 100%;
  height: 445px;
  background: var(--color-placeholder);
  overflow: hidden;
}
.wine-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.wine-card__title {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-h4);
  color: var(--color-green);
  text-transform: uppercase;
  margin-top: var(--space-xs);
}

/* =========================================================
   EXPERIENCES
========================================================= */
.experiences {
  width: 100%;
  min-height: 800px;
  background: var(--color-terracotta);
}
.experiences__image {
  position: relative;
  overflow: hidden;
  flex: 1 1 0;
  min-height: 380px;
}
.experiences__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  inset: 0;
}
.experiences__content {
  flex: 0 0 750px;
  padding: var(--space-lg);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-xs);
}
@media (max-width: 1024px) {
  .experiences__content {
    flex: none;
    padding: 50px 40px;
  }
  .experiences__image {
    flex: none;
    height: 380px;
  }
}
.experiences__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-xs);
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  color: var(--color-green);
}
.experiences__links a {
  color: var(--color-green);
}

/* =========================================================
   EXPLORE GALLERY
========================================================= */
.explore {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-lg) 0;
}
.explore__header {
  padding: 0 var(--space-lg);
  color: var(--color-green);
}
.explore__header .section-heading,
.explore__header .eyebrow {
  text-align: left;
}
.explore__gallery {
  padding: 0 calc(var(--space-lg) - 12px);
  margin-left: 0;
  margin-right: 0;
  margin-top: 20px;
}
.explore__item-frame {
  width: 100%;
  overflow: hidden;
}
.explore__item-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.explore__item--large .explore__item-frame {
  height: 520px;
}
.explore__item--square .explore__item-frame {
  height: 300px;
}
.explore__item--medium .explore__item-frame {
  height: 420px;
}
.explore__item figcaption {
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  line-height: var(--lh-body);
  text-align: left;
  margin-top: var(--space-2xs);
}
.explore h2 {
  margin: 20px 0px;
}
/* =========================================================
   PAGE HEAD (genérico: eyebrow + título, topo das páginas internas)
========================================================= */
.page-head {
  max-width: var(--container-max);
  margin: 0 auto;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 150px var(--space-lg) 0;
  color: var(--color-green);
  text-transform: uppercase;
}
.page-head__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h2);
  line-height: var(--lh-heading);
}

/* =========================================================
   LINHA (single-linha.php)
========================================================= */
.line-head {
  max-width: var(--container-max);
  margin: 0 auto;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 150px var(--space-lg) 0;
  color: var(--color-green);
}
.line-head__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
}
.line-hero {
  width: 100%;
  height: 600px;
  overflow: hidden;
  margin-top: 60px;
}
.line-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.line-intro {
  max-width: 900px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  padding: var(--space-lg);
  text-align: center;
}
.line-intro__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h4);
  text-transform: uppercase;
  color: var(--color-green);
}
.line-intro__text {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.products {
  max-width: var(--container-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-lg);
  padding: 0 var(--space-lg) var(--space-lg);
  justify-items: center;
}
.product-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  text-align: center;
}
.product-card__image {
  /* width: 104px; */
  height: 360px;
  background: var(--color-cream);
}
.product-card__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.product-card__name {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 20px;
  line-height: 26px;
  color: var(--color-green);
}
.product-card__link {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  color: var(--color-green);
}

.other-lines {
  width: 100%;
  padding: var(--space-lg) 0;
}
.other-lines__header {
  max-width: var(--container-max);
  margin: 0 auto var(--space-md);
  padding: 0 var(--space-lg);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  text-align: center;
}
.other-lines .owl-carousel {
  cursor: grab;
}
.other-lines .owl-carousel:active {
  cursor: grabbing;
}
.other-lines .owl-carousel .owl-stage {
  display: flex;
}

@media (max-width: 1024px) {
  .line-head,
  .page-head {
    padding-left: 40px;
    padding-right: 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .line-hero {
    height: 380px;
    margin-top: 40px;
  }
  .products {
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
  }
}
@media (max-width: 768px) {
  .line-head,
  .page-head {
    padding-left: 20px;
    padding-right: 20px;
  }
  .line-hero {
    height: 260px;
    margin-top: 24px;
  }
  .products {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  .product-card__image {
    width: 80px;
    height: 280px;
  }
}

/* =========================================================
   PRODUTO (single-produto.php)
========================================================= */
.prod-intro {
  max-width: var(--container-max);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  padding-top: 90px;
  padding-bottom: var(--space-lg);
  text-align: center;
}
.prod-intro__bottle {
  /* width: 170px; */
  height: 520px;
  margin-top: var(--space-xs);
  background: var(--color-cream);
}
.prod-intro__bottle img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.prod-intro__text {
  max-width: 1000px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  color: var(--color-green);
}
.prod-intro__title,
.prod-intro__subtitle {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h4);
  text-transform: uppercase;
}
.prod-intro__desc {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-black);
}
.prod-intro__buy {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  color: var(--color-green);
}

.tasting {
  width: 100%;
  min-height: 800px;
  background: var(--color-terracotta);
}
.tasting__content {
  flex: 0 0 750px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--space-xs);
  padding: var(--space-lg);
  color: var(--color-black);
}
.tasting__title {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fs-h3);
}
.tasting__notes {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
}
.tasting__note-title {
  font-family: var(--font-body);
  font-weight: 600;
}
.tasting__note-text {
  font-family: var(--font-body);
  font-weight: 400;
}
.tasting__image {
  flex: 1 1 0;
  min-width: 0;
  position: relative;
  overflow: hidden;
  min-height: 320px;
}
.tasting__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  inset: 0;
}

.spec-block {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}
.spec-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}
.spec-row__title {
  flex: 0 0 610px;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fs-h3);
  color: var(--color-black);
}
.spec-row__body {
  flex: 1 1 400px;
  max-width: 650px;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
  color: var(--color-black);
}
.spec-item__label {
  font-family: var(--font-body);
  font-weight: 600;
}
.spec-item__value {
  font-family: var(--font-body);
  font-weight: 400;
}

.pairing-image {
  background: var(--color-terracotta);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 650px;
  height: 500px;
}
.pairing-image img {
  width: 400px;
  max-width: 80%;
  height: 300px;
  object-fit: cover;
}
.pairing-text {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
  color: var(--color-black);
  max-width: 525px;
}

.highlights {
  max-width: var(--container-max);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-lg);
  padding: var(--space-lg);
}
.highlights__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  text-align: center;
}
.highlights__grid {
  width: 100%;
}
.highlights__grid.owl-carousel {
  cursor: grab;
}
.highlights__grid.owl-carousel:active {
  cursor: grabbing;
}
.highlights__grid .owl-item {
  display: flex;
  justify-content: center;
}
.highlight-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  width: 165px;
  max-width: 100%;
  text-align: center;
}
.highlight-card__image {
  width: 104px;
  height: 360px;
  background: var(--color-cream);
}
.highlight-card__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.highlight-card__name {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 20px;
  color: var(--color-green);
}
.highlight-card__link {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  color: var(--color-green);
}

@media (max-width: 1024px) {
  .prod-intro {
    padding-top: 120px;
    padding-bottom: var(--space-md);
    gap: var(--space-md);
  }
  .tasting__content {
    padding: 50px 40px;
  }
  .spec-block {
    padding: var(--space-md) 40px;
  }
  .spec-row__title {
    flex: 0 0 100%;
  }
  .highlights {
    padding: var(--space-md) 40px;
  }
}
@media (max-width: 768px) {
  .prod-intro {
    padding-top: 100px;
  }
  .tasting__content {
    padding: 40px 20px;
  }
  .spec-block {
    padding: var(--space-md) 20px;
  }
  .highlights {
    padding: var(--space-md) 20px;
  }
  .highlights__grid {
    gap: 30px;
  }
}

/* =========================================================
   VISITAÇÃO E DEGUSTAÇÃO (hub)
========================================================= */
.exp-head {
  max-width: var(--container-max);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  padding: 150px var(--space-lg) 0;
  text-align: center;
  color: var(--color-green);
}
.exp-head__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
}
.exp-head__desc {
  max-width: 980px;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-black);
}
.exp-head__sub {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h4);
  text-transform: uppercase;
  margin-top: var(--space-2xs);
}

.exp-grid {
  max-width: var(--container-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-lg) var(--space-2xs);
  padding: 75px var(--space-lg) var(--space-lg);
}
.exp-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
}
.exp-card__link {
  margin-top: var(--space-2xs);
}
.exp-card__image {
  width: 100%;
  height: 600px;
  overflow: hidden;
  background: #4a362d;
}
.exp-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.exp-card__title {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-h4);
  text-transform: uppercase;
  color: var(--color-green);
}
.exp-card__link {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  color: var(--color-green);
  margin-top: 0;
  width: max-content;
}

@media (max-width: 1024px) {
  .exp-head {
    padding: 80px 40px 0;
  }
  .exp-grid {
    grid-template-columns: repeat(2, 1fr);
    padding: var(--space-md) 40px;
    gap: var(--space-md) 24px;
  }
  .exp-card__image {
    height: 320px;
  }
}
@media (max-width: 768px) {
  .exp-head {
    padding: 60px 20px 0;
  }
  .exp-grid {
    grid-template-columns: 1fr;
    padding: var(--space-md) 20px;
    gap: var(--space-md);
  }
  .exp-card__image {
    height: 280px;
  }
}

/* =========================================================
   DEGUSTAÇÃO
========================================================= */
.deg-hero-wrap {
  max-width: var(--container-max);
  margin: 0 auto;
  padding-top: 150px;
}
.deg-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 0 var(--space-lg);
  color: var(--color-green);
  text-transform: uppercase;
}
.deg-head__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
}
.deg-hero {
  width: 100%;
  height: 600px;
  overflow: hidden;
  margin-top: 60px;
}
.deg-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.deg-intro {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.deg-intro__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h4);
  text-transform: uppercase;
  color: var(--color-green);
}
.deg-intro__text {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.tasting-package {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-lg);
  border-bottom: 1px solid var(--color-black);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}
.tasting-package:last-of-type {
  border-bottom: none;
}
.tasting-package__top {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--space-md);
}
.tasting-package__info {
  flex: 1 1 400px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: var(--space-md);
}
.tasting-package__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: 40px;
  line-height: 44px;
  text-transform: uppercase;
  color: var(--color-green);
}
.tasting-package__desc {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
  margin-top: var(--space-xs);
}
.tasting-package__cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.tasting-package__book {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  color: var(--color-green);
}
.tasting-package__price {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.tasting-package__price-value {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: 30px;
  color: var(--color-green);
}
.tasting-package__price-unit {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
}
.tasting-package__image {
  flex: 0 0 650px;
  max-width: 100%;
  height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.tasting-package__image--terracotta {
  background: var(--color-terracotta);
}
.tasting-package__image--green {
  background: var(--color-green);
}
.tasting-package__image img {
  width: 400px;
  height: 300px;
  object-fit: cover;
  max-width: 80%;
}
.tasting-package__labels-title {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fs-h3);
  color: var(--color-black);
  margin-bottom: var(--space-xs);
}
.tasting-package__labels-grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}
.tasting-package__label-group {
  flex: 1 1 200px;
  display: flex;
  flex-direction: column;
  gap: var(--space-3xs);
}
.tasting-package__label-cat {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-body-lg, 20px);
}
.tasting-package__label-item {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
}
.tasting-package__label-item p {
  margin: 0;
}

.deg-cta {
  position: relative;
  display: block;
  width: 100%;
  height: 545px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: var(--space-lg);
  overflow: hidden;
}
.deg-cta img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.deg-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1;
}
.deg-cta__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: var(--space-3xs);
  color: var(--color-white);
}
.deg-cta__eyebrow {
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  text-transform: uppercase;
  color: var(--color-white);
}
.deg-cta__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
}
.deg-cta__link {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  color: var(--color-white);
  width: fit-content;
}

@media (max-width: 1024px) {
  .deg-hero-wrap {
    padding-top: 80px;
  }
  .deg-head {
    padding: 0 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .deg-hero {
    height: 320px;
  }
  .deg-intro {
    padding: var(--space-md) 40px;
  }
  .tasting-package {
    padding: var(--space-md) 40px;
  }
  .tasting-package__image {
    flex: none;
    width: 100%;
    height: 300px;
  }
  .deg-cta {
    padding: var(--space-md) 40px;
    height: 400px;
  }
}
@media (max-width: 768px) {
  .deg-head {
    padding: 0 20px;
  }
  .deg-hero {
    height: 220px;
  }
  .deg-intro {
    padding: var(--space-md) 20px;
  }
  .tasting-package {
    padding: var(--space-md) 20px;
  }
  .deg-cta {
    padding: var(--space-md) 20px;
    height: 320px;
  }
}

/* =========================================================
   WINE BAR / LOJA DE VINHO (páginas institucionais split)
========================================================= */
.wb-head-wrap {
  max-width: var(--container-max);
  margin: 0 auto;
  padding-top: 150px;
}
.wb-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 0 var(--space-lg);
  color: var(--color-green);
  text-transform: uppercase;
}
.wb-head__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
}
.wb-hero {
  width: 100%;
  height: 600px;
  overflow: hidden;
  margin-top: 60px;
}
.wb-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.wb-intro {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
}
.wb-intro__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h4);
  text-transform: uppercase;
  color: var(--color-green);
}
.wb-intro__text {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.wb-split {
  max-width: var(--container-max);
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-lg);
  padding: var(--space-lg);
}
.wb-split__text {
  flex: 1 1 400px;
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  color: var(--color-black);
}
.wb-split__title {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fs-h3);
}
.wb-split__body {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.wb-split__image {
  flex: 0 0 650px;
  max-width: 100%;
  height: 600px;
  overflow: hidden;
}
.wb-split__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.wb-split--reverse {
  flex-direction: row-reverse;
}

.wb-visit {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-lg);
  border-top: 1px solid var(--color-black);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--space-lg);
}
.wb-visit__left {
  flex: 1 1 480px;
  max-width: 610px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--space-xs);
}
.wb-visit__title {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fs-h3);
  color: var(--color-black);
}
.wb-visit__desc {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
  color: var(--color-black);
  margin-top: var(--space-xs);
}
.wb-visit__cta {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  color: var(--color-green);
  width: max-content;
}
.wb-visit__right {
  flex: 1 1 400px;
  max-width: 650px;
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
  color: var(--color-black);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.wb-cta {
  position: relative;
  display: block;
  width: 100%;
  height: 545px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: var(--space-lg);
  overflow: hidden;
}
.wb-cta img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.wb-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1;
}
.wb-cta__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: var(--space-3xs);
  color: var(--color-white);
}
.wb-cta__eyebrow {
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  text-transform: uppercase;
  color: var(--color-white);
}
.wb-cta__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
}
.wb-cta__link {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  color: var(--color-white);
  width: fit-content;
}

@media (max-width: 1024px) {
  .wb-head-wrap {
    padding-top: 80px;
  }
  .wb-head {
    padding: 0 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .wb-hero {
    height: 320px;
  }
  .wb-intro {
    padding: var(--space-md) 40px;
  }
  .wb-split {
    padding: var(--space-md) 40px;
    gap: var(--space-md);
  }
  .wb-split__image {
    height: 320px;
  }
  .wb-visit {
    padding: var(--space-md) 40px;
    gap: var(--space-md);
  }
  .wb-cta {
    padding: var(--space-md) 40px;
    height: 400px;
  }
}
@media (max-width: 768px) {
  .wb-head {
    padding: 0 20px;
  }
  .wb-hero {
    height: 220px;
  }
  .wb-intro {
    padding: var(--space-md) 20px;
  }
  .wb-split {
    padding: var(--space-md) 20px;
  }
  .wb-visit {
    padding: var(--space-md) 20px;
  }
  .wb-cta {
    padding: var(--space-md) 20px;
    height: 320px;
  }
}

/* =========================================================
   INSTITUCIONAL (Flexible Content — Terroir / Generazioni / Explore)
========================================================= */
.inst-head-wrap {
  max-width: var(--container-max);
  margin: 0 auto;
  padding-top: 150px;
}
.inst-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 0 var(--space-lg);
  color: var(--color-green);
  text-transform: uppercase;
}
.inst-head__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
}

.inst-banner {
  width: 100%;
  height: 600px;
  margin-top: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-terracotta);
  background-size: cover;
  background-position: center;
}
/* Sem imagem, o banner é um painel de cor com padrão gráfico (como no layout). */
.inst-banner--terracotta {
  background-color: var(--color-terracotta);
  background-image: repeating-linear-gradient(
    135deg,
    rgba(0, 0, 0, 0.06) 0 6px,
    transparent 6px 16px
  );
}
.inst-banner--terracotta .inst-banner__inner {
  color: var(--color-green);
  text-shadow: none;
}
.inst-banner--green {
  background-color: var(--color-green);
  background-image:
    radial-gradient(
      circle at 0 0,
      rgba(255, 255, 255, 0.05) 8px,
      transparent 9px
    ),
    radial-gradient(
      circle at 30px 30px,
      rgba(255, 255, 255, 0.05) 8px,
      transparent 9px
    );
  background-size: 60px 60px;
}
.inst-banner--green .inst-banner__inner {
  color: var(--color-white);
  text-shadow: none;
}
.inst-banner--foto {
  background-color: var(--color-green);
}
.inst-banner__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2xs);
  text-align: center;
  color: var(--color-white);
  text-transform: uppercase;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}
.inst-banner__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
}
.inst-banner__sub {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h4);
}

.inst-centered {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
}
.inst-centered__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
  color: var(--color-green);
}
.inst-centered__sub {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 30px;
  line-height: 1.1;
  letter-spacing: -0.6px;
  color: var(--color-green);
}
.inst-centered__text {
  max-width: 800px;
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
}
.inst-centered__text p {
  margin: 0 0 16px;
}
.inst-centered__text p:last-child {
  margin-bottom: 0;
}

.inst-split {
  max-width: 1440px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-lg);
  padding: var(--space-lg);
}
.inst-split__text {
  flex: 1 1 400px;
  align-self: center;
}
.inst-split__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
  color: var(--color-green);
  margin-bottom: var(--space-xs);
}
.inst-split__body {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
  color: var(--color-black);
  max-width: 500px;
}
.inst-split__body p {
  margin: 0 0 16px;
}
.inst-split__body p:last-child {
  margin-bottom: 0;
}
.inst-split__image {
  flex: 0 0 650px;
  max-width: 100%;
  height: 650px;
  overflow: hidden;
}
.inst-split__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* Moldura: a imagem fica menor e centralizada sobre um painel de cor. */
.inst-split__image--moldura {
  background: var(--color-green);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 50px;
}
.inst-split__image--moldura.inst-split__image--terracotta {
  background: var(--color-terracotta);
}
.inst-split__image--moldura img {
  width: 400px;
  height: 300px;
  max-width: 100%;
}
.inst-split--reverse {
  flex-direction: row-reverse;
}
.inst-split--reverse .inst-split__text {
  align-items: flex-end;
  text-align: right;
}
.inst-split--reverse .inst-split__body {
  margin-left: auto;
}
/* Bloco sem imagem: título à esquerda e texto à direita, como no layout. */
.inst-split--cols .inst-split__text {
  flex: 1 1 100%;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs) var(--space-sm);
  align-self: stretch;
}
.inst-split--cols .inst-split__title {
  flex: 1 1 420px;
  max-width: 610px;
  margin-bottom: 0;
  font-size: var(--fs-h4);
  text-transform: uppercase;
  color: var(--color-green);
}
.inst-split--cols .inst-split__body {
  flex: 1 1 400px;
  max-width: 650px;
}

.inst-wide-image {
  max-width: 1300px;
  margin: 0 auto;
  height: 500px;
  overflow: hidden;
}
.inst-wide-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.inst-photos {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--space-lg);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-lg);
}
.inst-photos__small {
  width: 356px;
  height: 383px;
  max-width: 100%;
  object-fit: cover;
}
.inst-photos__large {
  width: 650px;
  height: 700px;
  max-width: 100%;
  object-fit: cover;
}

.inst-destaque {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  min-height: 800px;
}
.inst-destaque--terracotta {
  background: var(--color-terracotta);
}
.inst-destaque--green {
  background: var(--color-green);
}
.inst-destaque--green .inst-destaque__title,
.inst-destaque--green .inst-destaque__sub,
.inst-destaque--green .inst-destaque__text {
  color: var(--color-white);
}
.inst-destaque__content {
  flex: 1 1 500px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-xs);
  padding: var(--space-lg);
  text-align: center;
}
.inst-destaque__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
  color: var(--color-green);
}
.inst-destaque__sub {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 30px;
  line-height: 1.1;
  letter-spacing: -0.6px;
  color: var(--color-green);
  margin-top: -20px;
}
.inst-destaque__text {
  max-width: 500px;
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
  color: var(--color-black);
}
.inst-destaque__image {
  flex: 1 1 400px;
  min-width: 0;
  overflow: hidden;
}
.inst-destaque__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.inst-cta {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100%;
  height: 532px;
  padding: 100px 100px 320px;
  overflow: hidden;
}
.inst-cta img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.inst-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1;
}
.inst-cta__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: var(--space-3xs);
  color: var(--color-white);
}
.inst-cta__eyebrow {
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  text-transform: uppercase;
  color: var(--color-white);
}
.inst-cta__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
}
.inst-cta__link {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  color: var(--color-white);
  width: fit-content;
}

@media (max-width: 1024px) {
  .inst-head-wrap {
    padding-top: 80px;
  }
  .inst-head {
    padding: 0 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .inst-banner {
    height: 320px;
  }
  .inst-split,
  .inst-destaque__content {
    padding: var(--space-md) 40px;
  }
  .inst-split__image,
  .inst-destaque__image {
    height: 320px;
  }
  .inst-split--reverse .inst-split__text {
    align-items: flex-start;
    text-align: left;
  }
  .inst-split--reverse .inst-split__body {
    margin-left: 0;
  }
  .inst-wide-image {
    height: 320px;
  }
  .inst-photos {
    flex-direction: column;
    padding: 0 40px;
    gap: 20px;
    align-items: center;
  }
  .inst-photos__small,
  .inst-photos__large {
    width: 100%;
    height: 280px;
  }
  .inst-destaque {
    min-height: auto;
  }
  .inst-cta {
    padding: var(--space-md) 40px 220px;
    height: 400px;
  }
}
@media (max-width: 768px) {
  .inst-head {
    padding: 0 20px;
  }
  .inst-banner {
    height: 240px;
  }
  .inst-split,
  .inst-destaque__content {
    padding: var(--space-md) 20px;
  }
  .inst-wide-image {
    height: 240px;
  }
  .inst-photos {
    padding: 0 20px;
  }
  .inst-cta {
    padding: var(--space-md) 20px 180px;
    height: 340px;
  }
}

/* =========================================================
   CONTATO
========================================================= */
.ct-hero {
  max-width: 1150px;
  margin: 0 auto;
  padding: 110px var(--space-lg) 0;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
}
.ct-hero__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
  color: var(--color-green);
}
.ct-hero__body {
  max-width: 1000px;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.ct-image {
  max-width: var(--container-max);
  margin: var(--space-lg) auto 0;
  padding: 0 var(--space-lg);
  height: 508px;
  overflow: hidden;
}
.ct-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ct-visit {
  max-width: 880px;
  margin: 0 auto;
  padding: var(--space-xl) var(--space-lg);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
}
.ct-visit__title {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 30px;
  letter-spacing: -0.6px;
  color: var(--color-black);
}
.ct-visit__body {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
}
.ct-visit__block {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-top: var(--space-2xs);
}
.ct-visit__label {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-body-lg, 20px);
}
.ct-visit__value {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
}

.ct-visit__map-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2xs);
  margin-top: 10px;
}
.ct-visit__map-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: var(--color-black);
  transition: color 0.3s ease;
}
.ct-visit__map-link:hover {
  color: var(--color-terracotta);
}
.ct-visit__map-link svg {
  width: 100%;
  height: 100%;
}

.ct-cards {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-lg);
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  gap: var(--space-2xs);
}
.ct-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  flex: 0 0 410px;
  max-width: 100%;
}
.ct-card__image {
  width: 100%;
  height: 366px;
  overflow: hidden;
  background: #4a362d;
}
.ct-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ct-card__title {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-h4);
  text-transform: uppercase;
  color: var(--color-green);
}
.ct-card__desc {
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  text-transform: uppercase;
  line-height: 1.5;
  color: var(--color-green);
  margin-top: 12px;
}
.ct-card__link {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  color: var(--color-green);
  width: max-content;
}

@media (max-width: 1024px) {
  .ct-hero {
    padding: 120px 40px 0;
  }
  .ct-image {
    height: 320px;
  }
  .ct-visit {
    padding: var(--space-md) 40px;
  }
  .ct-cards {
    padding: var(--space-md) 40px;
    gap: var(--space-md);
  }
}
@media (max-width: 768px) {
  .ct-hero {
    padding: 100px 20px 0;
  }
  .ct-image {
    height: 240px;
  }
  .ct-visit {
    padding: var(--space-md) 20px;
  }
  .ct-cards {
    padding: var(--space-md) 20px;
  }
}

/* =========================================================
   BLOG (home.php / single.php)
========================================================= */
.blog-latest,
.blog-others,
.related {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: 75px;
}
.blog-others {
  padding-top: var(--space-md);
}
.blog-latest__header,
.related__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  color: var(--color-green);
  text-transform: uppercase;
}
.blog-latest__title,
.blog-others__title,
.related__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
  color: var(--color-green);
}
.blog-latest__grid,
.related__grid {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-sm);
}
.blog-latest__item,
.related__item {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  flex: 1 1 280px;
  text-decoration: none;
}
.blog-latest__item--1,
.related__item--1 {
  flex: 1 1 340px;
  max-width: 410px;
  margin-top: 37px;
}
.blog-latest__item--2,
.related__item--2 {
  flex: 1 1 240px;
  max-width: 289px;
  margin-top: 88px;
}
.blog-latest__item--3,
.related__item--3 {
  flex: 1 1 380px;
  max-width: 463px;
}
.blog-latest__image,
.related__image {
  width: 100%;
  height: 340px;
  overflow: hidden;
  background: #4a362d;
}
/* No layout os três cards têm alturas diferentes e ficam escalonados. */
.blog-latest__item--1 .blog-latest__image,
.related__item--1 .related__image {
  height: 366px;
}
.blog-latest__item--2 .blog-latest__image,
.related__item--2 .related__image {
  height: 271px;
}
.blog-latest__item--3 .blog-latest__image,
.related__item--3 .related__image {
  height: 446px;
}
.blog-latest__image img,
.related__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.blog-post-title {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-h4);
  text-transform: uppercase;
  color: var(--color-green);
}
.blog-post-date {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}

.blog-others__list {
  display: flex;
  flex-direction: column;
}
.blog-others__item {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-xs) 0;
  text-decoration: none;
}

.blog-others__image {
  flex: 0 0 624px;
  max-width: 50%;
  height: 440px;
  overflow: hidden;
}
.blog-others__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.blog-others__content {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.post-header {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 110px var(--space-lg) 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-md);
  text-align: center;
}
.post-header__date {
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  text-transform: uppercase;
  color: var(--color-green);
}
.post-header__title {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 55px;
  line-height: 1.25;
  max-width: 880px;
}
.post-header__author {
  font-family: var(--font-body);
  font-size: var(--fs-body);
}
.post-hero {
  max-width: 1005px;
  margin: var(--space-lg) auto 0;
  height: 505px;
  overflow: hidden;
}
.post-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.post-body {
  max-width: 810px;
  margin: var(--space-md) auto 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 0 20px;
}
.post-body p {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg, 20px);
  line-height: var(--lh-body-lg, 26px);
  margin: 0;
}

@media (max-width: 1024px) {
  .blog-latest,
  .related {
    padding: var(--space-md) 40px;
  }
  .blog-others {
    padding: 0 40px var(--space-md);
  }
  .post-header {
    padding: 120px 40px 0;
  }
  .post-header__title {
    font-size: 40px;
  }
  .post-hero {
    height: 320px;
  }
}
@media (max-width: 768px) {
  .blog-latest,
  .related {
    padding: var(--space-md) 20px;
  }
  .blog-others {
    padding: 0 20px var(--space-md);
  }
  .post-header {
    padding: 100px 20px 0;
  }
  .post-header__title {
    font-size: 28px;
  }
  .post-hero {
    height: 220px;
  }
}

/* =========================================================
   PÁGINAS DE TEXTO / LEGAL (page.php)
========================================================= */
.legal {
  max-width: 900px;
  margin: 0 auto;
  padding: 170px var(--space-lg) var(--space-xl);
}
.legal__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2xs);
  text-align: center;
  margin-bottom: var(--space-md);
}
.legal__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
  color: var(--color-green);
}
.legal__body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: 1.7;
  color: var(--color-black);
}
.legal__body p {
  margin: 0 0 20px;
}
.legal__body h2 {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h3);
  text-transform: uppercase;
  color: var(--color-green);
  margin: var(--space-xs) 0 var(--space-2xs);
}
.legal__body h3 {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 18px;
  color: var(--color-green);
  margin: var(--space-2xs) 0 12px;
}
.legal__body ul {
  margin: 0 0 20px;
  padding-left: 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.legal__body a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.legal__body a:hover {
  color: var(--dl-hover);
}
.legal__meta {
  margin-top: var(--space-md) !important;
  padding-top: var(--space-2xs);
  border-top: 1px solid rgba(37, 56, 48, 0.2);
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-green);
}
@media (max-width: 768px) {
  .legal {
    padding: 100px 20px var(--space-md);
  }
}

/* =========================================================
   ERRO 404
========================================================= */
.error-404 {
  position: relative;
  width: 100%;
  min-height: 700px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.error-404__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.error-404::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(37, 56, 48, 0.72);
  z-index: 1;
}
.error-404__content {
  position: relative;
  z-index: 2;
  max-width: 760px;
  padding: var(--space-lg) var(--space-lg);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2xs);
  text-align: center;
  color: var(--color-white);
}
.error-404__code {
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--color-white);
}
.error-404__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-hero);
  line-height: var(--lh-heading);
  text-transform: uppercase;
}
.error-404__text {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
}
.error-404__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-xs);
  margin-top: var(--space-2xs);
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
}
.error-404__links a {
  color: var(--color-white);
}
.error-404__links a:hover {
  color: var(--dl-hover);
}
@media (max-width: 768px) {
  .error-404 {
    min-height: 480px;
  }
  .error-404__links {
    gap: var(--space-2xs);
  }
}

/* =========================================================
   FOOTER
========================================================= */
.site-footer {
  width: 100%;
}

/* Fundo (foto dos vinhedos) com o conteúdo verde sobreposto na base — não empilhado. */
.footer-hero {
  position: relative;
  width: 100%;
  min-height: 760px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: var(--color-green);
}
.footer-hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.footer__inner {
  position: relative;
  z-index: 1;
  max-width: var(--container-max);
  width: 100%;
  margin: 0 auto 30px;
  background: var(--color-green);
  padding: var(--space-md) var(--space-lg) var(--space-sm);
  color: var(--color-white);
}
@media (max-width: 1024px) {
  .footer-hero {
    min-height: 560px;
  }
}
@media (max-width: 768px) {
  .footer-hero {
    min-height: 420px;
  }
  .footer__inner {
    margin-bottom: 0;
  }
}
.footer__group-title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h3);
  text-transform: uppercase;
  color: var(--color-white);
  text-align: left;
  margin-bottom: 6px;
}
.footer__group + .footer__group {
  margin-top: 32px;
}
.footer__group ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: var(--fs-body);
  line-height: 1.3;
}
.footer__group ul li a {
  color: var(--color-white);
}
.footer__group ul li a:hover {
  color: var(--dl-hover);
}
.footer__col--brand {
  text-align: center;
}
.footer__logo-mark {
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0 auto 14px;
  display: block;
}
/* Lockup "Desde · VINI DI GENERAZIONI · 1887" — as datas ladeiam a primeira linha. */
.footer__brand-lockup {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 10px;
}
.footer__brand-side {
  font-family: var(--font-serif);
  font-weight: 600;
  font-style: italic;
  font-size: 13px;
  color: var(--color-white);
  white-space: nowrap;
}
.footer__brand-name {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h3);
  line-height: 1.15;
  text-transform: uppercase;
  color: var(--color-white);
  text-align: center;
}
.footer__col--nav {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--space-md);
}
.footer__row--nav {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h3);
  text-transform: uppercase;
  color: var(--color-white);
}
.footer__row--nav a {
  color: var(--color-white);
}
.footer__row--nav a:hover {
  color: var(--dl-hover);
}
.footer__row--social {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: var(--color-white);
}
.footer__row--social a {
  color: var(--color-white);
}
.footer__legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2xs);
  margin-top: var(--space-xs);
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  color: rgba(255, 255, 255, 0.7);
}
.footer__legal a {
  color: rgba(255, 255, 255, 0.7);
}
.footer__legal a:hover {
  color: var(--dl-hover);
}

/* casos */
.page-template-template-terroir-vinificacao .footer-hero,
.page-template-template-generazioni .footer-hero,
.page-template-template-explore-vinicola .footer-hero,
.page-template-template-degustacao .footer-hero,
.page-template-template-wine-bar .footer-hero,
.page-template-template-institucional .footer-hero,
.page-template-template-loja-de-vinho .footer-hero {
  min-height: auto;
  background: transparent;
  padding-top: 25px;
}

.page-template-template-terroir-vinificacao .footer-hero__bg.dl-parallax,
.page-template-template-generazioni .footer-hero__bg.dl-parallax,
.page-template-template-explore-vinicola .footer-hero__bg.dl-parallax,
.page-template-template-degustacao .footer-hero__bg.dl-parallax,
.page-template-template-wine-bar .footer-hero__bg.dl-parallax,
.page-template-template-institucional .footer-hero__bg.dl-parallax,
.page-template-template-loja-de-vinho .footer-hero__bg.dl-parallax {
  display: none;
}

/* =========================================================
   OWL CAROUSEL — ajustes de tema
========================================================= */
.owl-carousel {
  position: relative;
}
.owl-carousel .owl-stage-outer {
  padding-top: 4px;
  padding-bottom: 4px;
}
.owl-carousel .owl-nav {
  position: absolute;
  top: 40%;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  pointer-events: none;
  margin: 0 !important;
}
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {
  pointer-events: auto;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--color-white) !important;
  color: var(--color-green) !important;
  font-size: 22px !important;
  line-height: 1 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 16px rgba(37, 56, 48, 0.18);
  transform: translateX(-50%);
}
.owl-carousel .owl-nav button.owl-next {
  transform: translateX(50%);
}
.owl-carousel .owl-nav button.disabled {
  opacity: 0.35;
}
.owl-carousel .owl-dots {
  text-align: center;
  margin-top: var(--space-2xs);
}
.owl-carousel .owl-dots .owl-dot span {
  background: var(--color-placeholder);
}
.owl-carousel .owl-dots .owl-dot.active span {
  background: var(--color-green);
}

/* =========================================================
   RESPONSIVE
========================================================= */
@media (max-width: 1024px) {
  :root {
    --fs-hero: 38px;
    --fs-h2: 38px;
    --lh-heading: 44px;
    --space-lg: 60px;
    --space-md: 50px;
  }
  .hero {
    height: 560px;
  }
  .wine-card__image {
    height: 360px;
  }
  .experiences {
    min-height: auto;
  }
  .experiences__image {
    height: 380px;
  }
  .explore__header,
  .explore__gallery {
    padding: 0 40px;
  }
}

@media (max-width: 768px) {
  :root {
    --fs-hero: 28px;
    --fs-h2: 26px;
    --fs-h3: 20px;
    --fs-h4: 20px;
    --lh-heading: 32px;
    --space-lg: 24px;
    --space-md: 36px;
    --space-xs: 24px;
  }
  .hero {
    height: 420px;
  }
  .hero__title {
    width: 92%;
  }
  .wine-card__image {
    height: 320px;
  }
  .explore__header {
    text-align: center;
  }
  .explore__header .section-heading,
  .explore__header .eyebrow {
    text-align: center;
  }
}

/* =========================================================
   AJUSTES RESPONSIVOS DAS SEÇÕES REVISADAS
========================================================= */
@media (max-width: 1200px) {
  .spec-row__title {
    flex: 1 1 320px;
  }
  .tasting-package__image {
    flex: 1 1 380px;
  }
  .wb-split__image,
  .inst-split__image {
    flex: 1 1 380px;
    height: 480px;
  }
  .blog-others__image {
    flex: 1 1 320px;
    max-width: 55%;
    height: 340px;
  }
}
@media (max-width: 992px) {
  .legacy {
    padding-top: 140px;
  }
  .wines {
    padding-top: 140px;
  }
  .line-head,
  .page-head {
    padding-top: 110px;
  }
  .wb-head-wrap,
  .inst-head-wrap,
  .deg-hero-wrap {
    padding-top: 110px;
  }
  .exp-head {
    padding-top: 110px;
  }
  .line-hero,
  .wb-hero,
  .deg-hero,
  .inst-banner {
    height: 380px;
  }
  .prod-intro__bottle {
    width: 140px;
    height: 420px;
  }
  .blog-latest__item--1,
  .blog-latest__item--2,
  .blog-latest__item--3,
  .related__item--1,
  .related__item--2,
  .related__item--3 {
    margin-top: 0;
    max-width: 100%;
  }
  .blog-latest__item--1 .blog-latest__image,
  .blog-latest__item--2 .blog-latest__image,
  .blog-latest__item--3 .blog-latest__image,
  .related__item--1 .related__image,
  .related__item--2 .related__image,
  .related__item--3 .related__image {
    height: 300px;
  }
  .ct-card {
    flex: 1 1 320px;
  }
  .ct-card__image {
    height: 280px;
  }
  .post-header__title {
    font-size: 38px;
  }
}
@media (max-width: 768px) {
  .legacy {
    padding-top: 90px;
  }
  .wines {
    padding-top: 90px;
  }
  .line-hero,
  .wb-hero,
  .deg-hero,
  .inst-banner {
    height: 280px;
  }
  .blog-others__item {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2xs);
  }
  .blog-others__image {
    flex: 1 1 auto;
    width: 100%;
    max-width: 100%;
    height: 240px;
  }
  .blog-others__content {
    width: 100%;
  }
  .tasting-package__image,
  .wb-split__image,
  .inst-split__image {
    flex: 1 1 100%;
    height: 320px;
  }
  .pairing-image {
    height: 320px;
  }
  .pairing-image img {
    height: 200px;
  }
  .ct-image {
    height: 260px;
  }
  .post-header__title {
    font-size: 28px;
  }
  .error-404__content {
    padding: var(--space-md) 20px;
  }
}

/* =========================================================
   EFEITOS — HOVER, PARALLAX E REVELAÇÃO DE TEXTO (GSAP)
========================================================= */

/* ---------- Hover de textos e links ----------
   Dois tratamentos, aplicados a TODOS os links do site pelo theme.js:
   (a) .dl-link         -> links que o layout já mostra sublinhados: o traço
       fica sempre visível e no hover "apaga" para a direita e volta a ser
       desenhado a partir da esquerda;
   (b) .dl-link--reveal -> links sem sublinhado (rodapé, submenu, cards):
       o traço cresce da esquerda apenas no hover. */

a {
  transition: color 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  text-decoration-color: currentColor;
}

@keyframes dl-underline-wipe {
  0% {
    transform: scaleX(1);
    transform-origin: right center;
  }
  46% {
    transform: scaleX(0);
    transform-origin: right center;
  }
  54% {
    transform: scaleX(0);
    transform-origin: left center;
  }
  100% {
    transform: scaleX(1);
    transform-origin: left center;
  }
}

.dl-link,
.dl-link--reveal {
  position: relative;
  display: inline-block;
  text-decoration: none;
  transition: color 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.dl-link::after,
.dl-link--reveal::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -3px;
  height: 1px;
  background: currentColor;
  pointer-events: none;
}

.dl-link::after {
  transform: scaleX(1);
  transform-origin: left center;
}
.dl-link:hover::after,
a:hover .dl-link::after {
  animation: dl-underline-wipe 0.7s cubic-bezier(0.65, 0, 0.35, 1);
}

.dl-link--reveal::after {
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.dl-link--reveal:hover::after,
a:hover .dl-link--reveal::after {
  transform: scaleX(1);
  transform-origin: left center;
}

.dl-link:hover,
.dl-link--reveal:hover,
a:hover > .dl-link,
a:hover > .dl-link--reveal {
  color: var(--dl-hover);
}

/* "Conheça a nossa história" e similares: verde, igual ao traço. */
.dl-link-text {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  letter-spacing: -0.48px;
  color: var(--color-green);
}

/* Links dentro de texto corrido podem quebrar em duas linhas — nesses casos
   mantemos o sublinhado nativo e animamos cor e distância. */
.post-body a,
.legal__body a,
.inst-split__body a,
.wb-split__body a,
.wb-visit__right a {
  display: inline;
  text-decoration: underline;
  text-decoration-color: currentColor;
  text-underline-offset: 3px;
  transition:
    color 0.4s cubic-bezier(0.22, 1, 0.36, 1),
    text-underline-offset 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.post-body a::after,
.legal__body a::after,
.inst-split__body a::after,
.wb-split__body a::after,
.wb-visit__right a::after {
  display: none;
}
.post-body a:hover,
.legal__body a:hover,
.inst-split__body a:hover,
.wb-split__body a:hover,
.wb-visit__right a:hover {
  color: var(--dl-hover);
  text-underline-offset: 6px;
}

/* O sublinhado do layout passa a ser desenhado pelo pseudo-elemento. */
.underline.dl-link,
.underline.dl-link--reveal {
  text-decoration: none;
}

/* ---------- Cor de destaque por contexto ----------
   Nas faixas terracota o destaque vira verde; nas faixas verdes/escuras
   segue terracota. Assim nenhum link some contra o próprio fundo. */
.experiences,
.tasting,
.inst-destaque--terracotta,
.inst-banner--terracotta,
.tasting-package__image--terracotta,
.pairing-image {
  --dl-hover: var(--color-white);
}
.footer__inner,
.inst-destaque--green,
.deg-cta,
.wb-cta,
.inst-cta,
.error-404 {
  --dl-hover: var(--color-terracotta);
}

/* ---------- Hover dos cards: zoom lento e discreto na foto ---------- */
.wine-card__image,
.exp-card__image,
.ct-card__image,
.blog-latest__image,
.related__image,
.blog-others__image,
.explore__item-frame {
  overflow: hidden;
}

.wine-card__image img,
.exp-card__image img,
.ct-card__image img,
.blog-latest__image img,
.related__image img,
.blog-others__image img,
.explore__item-frame img {
  transition: transform 1.1s cubic-bezier(0.22, 1, 0.36, 1);
}
.wine-card:hover .wine-card__image img,
.exp-card:hover .exp-card__image img,
.ct-card:hover .ct-card__image img,
.blog-latest__item:hover .blog-latest__image img,
.related__item:hover .related__image img,
.blog-others__item:hover .blog-others__image img,
.explore__item:hover .explore__item-frame img {
  transform: scale(1.06);
}

.wine-card__title,
.exp-card__title,
.blog-post-title,
.ct-card__title {
  transition: color 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.wine-card:hover .wine-card__title,
.blog-latest__item:hover .blog-post-title,
.related__item:hover .blog-post-title,
.blog-others__item:hover .blog-post-title {
  color: var(--dl-hover);
}

/* Faixas de CTA em imagem: escurecem um pouco menos no hover. */
.deg-cta::before,
.wb-cta::before,
.inst-cta::before {
  transition: background 0.6s ease;
}
.deg-cta:hover::before,
.wb-cta:hover::before,
.inst-cta:hover::before {
  background: rgba(0, 0, 0, 0.45);
}

/* ---------- Parallax ---------- */
.dl-parallax {
  will-change: transform;
}

/* ---------- Revelação linha a linha ---------- */
.dl-line {
  display: block;
  overflow: hidden;
  padding-bottom: 0.08em;
  margin-bottom: -0.08em;
}
.dl-line__inner {
  display: block;
  will-change: transform;
}
/* Linha em branco entre parágrafos preservada na quebra por linhas. */
.dl-word--blank {
  width: 0;
  overflow: hidden;
}

/* Estado inicial só quando o JS está ativo, para não sumir conteúdo sem JS. */
.js-anim .hero__title,
.js-anim .section-heading,
.js-anim .legacy__text,
.js-anim .page-head__title,
.js-anim .line-head__title,
.js-anim .wb-head__title,
.js-anim .deg-head__title,
.js-anim .inst-head__title,
.js-anim .exp-head__title,
.js-anim .exp-head__desc,
.js-anim .exp-head__sub,
.js-anim .ct-hero__title,
.js-anim .ct-hero__body,
.js-anim .post-header__title,
.js-anim .prod-intro__title,
.js-anim .prod-intro__subtitle,
.js-anim .line-intro__title,
.js-anim .line-intro__text,
.js-anim .deg-intro__title,
.js-anim .deg-intro__text,
.js-anim .wb-intro__title,
.js-anim .wb-intro__text,
.js-anim .inst-centered__title,
.js-anim .inst-destaque__title,
.js-anim .inst-banner__title,
.js-anim .inst-banner__sub,
.js-anim .blog-latest__title,
.js-anim .blog-others__title,
.js-anim .related__title,
.js-anim .tasting-package__title,
.js-anim .legal__title,
.js-anim .error-404__title,
.js-anim [data-dl-fade] {
  opacity: 0;
}
.js-anim .dl-revealed {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .js-anim .hero__title,
  .js-anim .section-heading,
  .js-anim [data-dl-fade],
  .js-anim [class*="__title"],
  .js-anim [class*="__text"] {
    opacity: 1 !important;
  }
  .site-header {
    transition: none;
  }
  * {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
}

/* =========================================================
   GENERAZIONI (page-specific) — miolo específico (linha do tempo das gerações)
========================================================= */
.gen-block {
  max-width: 900px;
  margin: 0 auto;
  padding: var(--space-xl) var(--space-lg);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  text-align: center;
}
.gen-block--wide {
  padding-top: 200px;
  padding-bottom: 200px;
}
.gen-block__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h1);
  line-height: var(--lh-heading);
  text-transform: uppercase;
  color: var(--color-green);
}
.gen-name {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fs-h3);
  letter-spacing: -0.6px;
  color: var(--color-black);
}
.gen-block__body {
  max-width: 700px;
  font-family: var(--font-body);
  font-size: var(--fs-body-lg);
  line-height: var(--lh-body-lg);
  color: var(--color-black);
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.inst-split__text .gen-name {
  margin-top: -20px;
}
.inst-destaque--green .gen-name {
  color: var(--color-white);
}

@media (max-width: 1024px) {
  .gen-block {
    padding: var(--space-md) 40px;
  }
  .gen-block--wide {
    padding-top: var(--space-md);
    padding-bottom: var(--space-md);
  }
}
@media (max-width: 768px) {
  .gen-block {
    padding: var(--space-md) 20px;
  }
}

/* =========================================================
   TERROIR E VINIFICAÇÃO (page-specific) — miolo específico
   (denominação de origem, tempo do vinho, vinificação)
========================================================= */
.trr-content {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}
.trr-block {
  display: flex;
  flex-direction: column;
  gap: 60px;
  padding-bottom: var(--space-lg);
  border-bottom: 1px solid var(--color-black);
}
.trr-block:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.trr-block__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-lg);
}
.trr-block__title {
  flex: 0 0 650px;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fs-h3);
  line-height: 1.1;
  letter-spacing: -0.6px;
  color: var(--color-black);
}
.trr-block__body {
  /* flex: 0 0 650px; */
  max-width: 650px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  font-family: var(--font-body);
  font-size: var(--fs-body-lg);
  line-height: var(--lh-body-lg);
  color: var(--color-black);
}
.trr-photo {
  display: flex;
  justify-content: flex-end;
}
.trr-photo img {
  width: 650px;
  height: 650px;
  max-width: 100%;
  object-fit: cover;
}
.trr-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-lg);
}
.trr-row__title {
  flex: 0 0 400px;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fs-h3);
  line-height: 1.1;
  letter-spacing: -0.6px;
  color: var(--color-black);
}
.trr-row__lead {
  display: block;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  font-weight: 500;
  margin-top: 20px;
}
.trr-row__list {
  flex: 0 0 650px;
  max-width: 650px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  font-family: var(--font-body);
  font-size: var(--fs-body-lg);
  line-height: var(--lh-body-lg);
  color: var(--color-black);
}
.trr-row__list p.label {
  font-weight: 600;
  margin: 0 0 10px;
}
.trr-row__list p.value {
  margin: 0;
}
.trr-split {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* gap: var(--space-lg); */
}
.trr-split__text {
  /* flex: 0 0 650px; */
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fs-h3);
  line-height: 1.1;
  letter-spacing: -0.6px;
  color: var(--color-black);

  max-width: 500px;
}
.trr-split__lead {
  display: block;
  font-weight: 500;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  margin-top: 20px;
}
.trr-split__image {
  flex: 0 0 650px;
  height: 500px;
  background: var(--color-terracotta);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 50px;
  overflow: hidden;
}
.trr-split__image img {
  width: 400px;
  height: 300px;
  max-width: 100%;
  object-fit: cover;
}

.trr-sustain {
  display: flex;
  width: 100%;
  min-height: 800px;
  background: var(--color-terracotta);
}
.trr-sustain__content {
  flex: 0 0 750px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-xs);
  padding: var(--space-lg);
  text-align: center;
}
.trr-sustain__label {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fs-h3);
  letter-spacing: -0.6px;
  color: var(--color-black);
}
.trr-sustain__body-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  width: 100%;
}
.trr-sustain__statement {
  max-width: 500px;
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h4);
  line-height: normal;
  text-transform: uppercase;
  color: var(--color-green);
}
.trr-sustain__text {
  font-family: var(--font-body);
  font-size: var(--fs-body-lg);
  line-height: var(--lh-body-lg);
  color: var(--color-black);
}
.trr-sustain__image {
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
}
.trr-sustain__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.trr-phil {
  max-width: 900px;
  margin: 0 auto;
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-xs);
  text-align: center;
}
.trr-phil__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h1);
  line-height: var(--lh-heading);
  text-transform: uppercase;
  color: var(--color-green);
}
.trr-phil__sub {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: var(--fs-h4);
  text-transform: uppercase;
  color: var(--color-black);
}
.trr-phil__text {
  max-width: 706px;
  font-family: var(--font-body);
  font-size: var(--fs-body-lg);
  line-height: var(--lh-body-lg);
  color: var(--color-black);
  display: flex;
  flex-direction: column;
  gap: 20px;
}

@media (max-width: 1024px) {
  .trr-content {
    padding: var(--space-md) 40px;
  }
  .trr-block__header,
  .trr-row,
  .trr-split {
    flex-direction: column;
  }
  .trr-block__title,
  .trr-block__body,
  .trr-row__title,
  .trr-row__list,
  .trr-split__text {
    flex: none;
    width: 100%;
    max-width: 100%;
  }
  .trr-photo {
    justify-content: flex-start;
  }
  .trr-photo img {
    width: 100%;
    height: 320px;
  }
  .trr-split__image {
    width: 100%;
    height: 320px;
  }
  .trr-sustain {
    flex-direction: column;
    min-height: auto;
  }
  .trr-sustain__content {
    flex: none;
    width: 100%;
  }
  .trr-sustain__image {
    flex: none;
    height: 320px;
    width: 100%;
  }
  .trr-phil {
    padding: var(--space-md) 40px;
  }
}
@media (max-width: 768px) {
  .trr-content {
    padding: var(--space-md) 20px;
  }
  .trr-phil {
    padding: var(--space-md) 20px;
  }
}

/* =========================================================
   EXPLORE A VINÍCOLA (page-specific) — lede introdutório
   Faltava no bloco INSTITUCIONAL compartilhado; usado também
   por Terroir e Vinificação / Generazioni (mesma marcação).
========================================================= */
.inst-lede {
  max-width: 900px;
  margin: 0 auto;
  padding: var(--space-lg);
  text-align: center;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-black);
}

/* =========================================================
   AVISOS GLOBAIS — faixa etária (18+), cookies (LGPD) e o
   popup "Modal de Aviso" (gerenciável via ACF Options).
========================================================= */
html.dl-no-scroll,
html.dl-no-scroll body {
  overflow: hidden;
}

/* --- Faixa etária --- */
.dl-age-gate {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: var(--space-2xs);
  background: rgba(37, 56, 48, 0.94);
}
.dl-age-gate.is-visible {
  display: flex;
}
.dl-age-gate__box {
  max-width: 480px;
  width: 100%;
  background: var(--color-cream);
  padding: var(--space-md) var(--space-xs);
  text-align: center;
  border-radius: 4px;
}
.dl-age-gate__logo {
  display: block;
  width: 180px;
  height: auto;
  object-fit: contain;
  margin: 0 auto var(--space-2xs);
}
.dl-age-gate__eyebrow {
  display: block;
  font-family: var(--font-sans);
  font-size: var(--fs-eyebrow);
  font-weight: 400;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  color: var(--color-terracotta);
  margin-bottom: var(--space-3xs);
}
.dl-age-gate__title {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: 34px;
  line-height: 1.2;
  color: var(--color-green);
  margin-bottom: var(--space-3xs);
}
.dl-age-gate__text {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-black);
  margin-bottom: var(--space-2xs);
}
.dl-age-gate__actions {
  display: flex;
  gap: var(--space-3xs);
  justify-content: center;
  flex-wrap: wrap;
}
.dl-age-gate__actions button {
  border: none;
  cursor: pointer;
  font-family: var(--font-sans);
}
.dl-age-gate__actions .btn-dl-outline {
  border: 1px solid var(--color-green);
}

/* --- Barra de cookies (LGPD) --- */
.dl-cookie-bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2500;
  display: none;
  align-items: center;
  justify-content: center;
  gap: var(--space-2xs);
  flex-wrap: wrap;
  background: var(--color-green);
  padding: var(--space-3xs) var(--space-2xs);
  transform: translateY(100%);
  transition: transform 0.3s ease;
}
.dl-cookie-bar.is-visible {
  display: flex;
  transform: translateY(0);
}
.dl-cookie-bar__text {
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--color-white);
  margin: 0;
  max-width: 700px;
}
.dl-cookie-bar__text a {
  color: var(--color-white);
}
.dl-cookie-bar__btn {
  border: none;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}

/* --- Modal de aviso (popup promocional, ACF Options) --- */
.dl-modal-aviso {
  position: fixed;
  inset: 0;
  z-index: 2800;
  display: none;
  align-items: center;
  justify-content: center;
  padding: var(--space-2xs);
  background: rgba(0, 0, 0, 0.6);
}
.dl-modal-aviso.is-visible {
  display: flex;
}
.dl-modal-aviso__box {
  position: relative;
  max-width: 520px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  background: var(--color-cream);
  border-radius: 4px;
}
.dl-modal-aviso__close {
  position: absolute;
  top: var(--space-3xs);
  right: var(--space-3xs);
  width: 32px;
  height: 32px;
  border: none;
  background: rgba(255, 255, 255, 0.85);
  border-radius: 50%;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  color: var(--color-green);
  z-index: 1;
}
.dl-modal-aviso__image img {
  width: 100%;
  height: auto;
  display: block;
}
.dl-modal-aviso__content {
  padding: var(--space-xs);
  text-align: center;
}
.dl-modal-aviso__text {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-black);
  margin-bottom: var(--space-2xs);
}
.dl-modal-aviso__content .btn-dl {
  display: inline-block;
  border: none;
  cursor: pointer;
}

@media (max-width: 768px) {
  .dl-age-gate__box {
    padding: var(--space-sm) var(--space-2xs);
  }
  .dl-age-gate__title {
    font-size: 26px;
  }
  .dl-cookie-bar {
    flex-direction: column;
    text-align: center;
  }
}