/*
 * CCU design system
 * Tokens and components are deliberately centralized here. Pages only compose
 * components and choose documented ACF variants.
 */
:root {
  --ccu-green: #034e31;
  --ccu-green-bright: #57b847;
  --ccu-green-deep: #004d32;
  --ccu-yellow: #fab700;
  --ccu-blue: #0085c9;
  --ccu-burgundy: #ae0a3b;
  --ccu-white: #fff;
  --ccu-surface: #f8f8f8;
  --ccu-ink: #333;
  --ccu-muted: #a0a0a0;
  --ccu-line: #e5e5e5;
  --ccu-content: 1200px;
  --ccu-gutter: clamp(20px, 4vw, 48px);
  --font-display: "Montserrat", Arial, sans-serif;
  --font-copy: "Open Sans", Arial, sans-serif;
  --font-condensed: "Barlow Condensed", "Arial Narrow", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ccu-ink); background: var(--ccu-white); font-family: var(--font-copy); font-size: 16px; line-height: 1.6; }
img { max-width: 100%; }
a { color: inherit; }
.container { width: min(calc(100% - (var(--ccu-gutter) * 2)), var(--ccu-content)); margin-inline: auto; }
.site-main { min-height: 60vh; overflow-x: clip; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.screen-reader-text:focus { width: auto; height: auto; clip: auto; padding: 1rem; top: 1rem; left: 1rem; z-index: 100; color: #fff; background: var(--ccu-green); }

/* Typography primitives */
.eyebrow {
  margin: 0 0 15px;
  color: var(--ccu-green-bright);
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2.88px;
  line-height: 1.2;
  text-transform: uppercase;
}
.display-title {
  margin: 0;
  color: var(--ccu-green);
  font-family: var(--font-display);
  font-size: clamp(32px, 3.34vw, 40px);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
}
.text-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ccu-green-bright);
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2.88px;
  text-decoration: none;
  text-transform: uppercase;
}
.text-link:hover { text-decoration: none; }
.text-link__arrow {
  display: inline-flex;
  flex: none;
  width: 14px;
  height: 14px;
  color: var(--ccu-green);
  transition: transform 180ms ease;
}
.text-link__arrow svg { display: block; width: 100%; height: 100%; fill: currentColor; }
.text-link:hover .text-link__arrow, .text-link:focus-visible .text-link__arrow { transform: translateX(4px); }

/* Motion is additive: no JavaScript and reduced-motion users see all content normally. */
.ccu-motion-ready:not(.ccu-motion-enabled) [data-reveal] { opacity: 1; transform: none; }
.ccu-motion-enabled [data-reveal] { opacity: 0; transform: translateY(20px); transition: opacity 560ms cubic-bezier(.22, 1, .36, 1) var(--reveal-delay, 0ms), transform 560ms cubic-bezier(.22, 1, .36, 1) var(--reveal-delay, 0ms); }
.ccu-motion-enabled [data-reveal].is-revealed { opacity: 1; transform: translateY(0); }

/* Header */
.site-colorbar { position: relative; display: grid; grid-template-columns: 15fr 35fr 20fr 10fr 20fr; height: 10px; overflow: hidden; }
.site-colorbar::after { position: absolute; inset: 0; background: linear-gradient(90deg, var(--ccu-green) 0 15%, var(--ccu-green-bright) 15% 50%, var(--ccu-yellow) 50% 70%, var(--ccu-blue) 70% 80%, var(--ccu-burgundy) 80%); content: ''; opacity: .75; transform: translateX(-105%); }
.site-colorbar span:nth-child(1) { background: var(--ccu-green); }
.site-colorbar span:nth-child(2) { background: var(--ccu-green-bright); }
.site-colorbar span:nth-child(3) { background: var(--ccu-yellow); }
.site-colorbar span:nth-child(4) { background: var(--ccu-blue); }
.site-colorbar span:nth-child(5) { background: var(--ccu-burgundy); }
.utility-navigation { display: block; height: 50px; background: var(--ccu-surface); font-family: var(--font-display); font-size: 10px; font-weight: 500; letter-spacing: 2.4px; line-height: 30px; text-transform: none; }
.utility-navigation__inner { display: flex; min-height: 50px; align-items: center; justify-content: flex-end; gap: 2rem; }
.utility-navigation ul { display: flex; gap: 1.15rem; margin: 0; padding: 0; list-style: none; }
.utility-navigation a { color: var(--ccu-muted); text-decoration: none; }
.utility-navigation a:hover { text-decoration: underline; text-underline-offset: .25rem; }
.utility-navigation__login { margin-left: .5rem; font-weight: 600; letter-spacing: 2.4px; }
.site-header { position: sticky; z-index: 40; top: 0; background: #fff; border-bottom: 0; transition: border-color 220ms ease, box-shadow 220ms ease; }
.site-header::after { position: absolute; right: 0; bottom: -3px; left: 0; height: 3px; background: linear-gradient(90deg, var(--ccu-green), var(--ccu-green-bright), var(--ccu-yellow), var(--ccu-blue), var(--ccu-burgundy)); content: ''; opacity: 0; transform: scaleX(0); transform-origin: left; }
.site-header__inner { display: flex; min-height: 102px; align-items: center; justify-content: space-between; gap: 2rem; padding: 0; transition: min-height 220ms ease, padding 220ms ease; }
.custom-logo { display: block; width: 120px; height: auto; }
.site-branding__fallback { display: block; }
.site-branding__fallback img { display: block; width: 120px; height: auto; }
.site-branding__text { color: var(--ccu-green); font-family: var(--font-display); font-size: 1.8rem; font-weight: 800; text-decoration: none; }
.primary-navigation { font-family: var(--font-display); font-size: 12px; font-weight: 500; letter-spacing: 2.88px; text-transform: uppercase; }
.primary-navigation ul, .footer-navigation ul { display: flex; gap: 0; padding: 0; margin: 0; list-style: none; }
.primary-navigation li { position: relative; }
.primary-navigation a { display: block; padding: 10px 15px; color: var(--ccu-green); text-decoration: none; }
.primary-navigation > ul > li > a { position: relative; }
.primary-navigation > ul > li > a::before { position: absolute; right: 15px; bottom: 3px; left: 15px; height: 1px; background: var(--ccu-green-bright); content: ''; transform: scaleX(0); transform-origin: left; transition: transform 180ms ease; }
.primary-navigation > ul > li > a:hover::before, .primary-navigation > ul > li > a:focus-visible::before, .primary-navigation > ul > li.current-menu-item > a::before, .primary-navigation > ul > li.current-menu-ancestor > a::before { transform: scaleX(1); }
.primary-navigation .sub-menu { position: absolute; z-index: 20; top: 100%; left: 0; display: grid; min-width: 14rem; gap: .75rem; padding: 1rem; background: #fff; box-shadow: 0 .75rem 2rem rgb(0 0 0 / 12%); opacity: 0; pointer-events: none; transform: translateY(-4px); transition: opacity 160ms ease, transform 160ms ease, visibility 0s linear 160ms; visibility: hidden; }
.primary-navigation li:hover > .sub-menu, .primary-navigation li:focus-within > .sub-menu { opacity: 1; pointer-events: auto; transform: translateY(0); transition-delay: 0s; visibility: visible; }
.primary-navigation .sub-menu a { padding: 0; }
.primary-navigation .menu-item-has-children > a::after { display: inline-block; width: 5px; height: 5px; margin: 0 0 .2em .55rem; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; content: ''; transform: rotate(45deg); vertical-align: middle; }
.primary-navigation .nav-accordion { display: none; }
.site-menu-toggle { display: none; border: 0; background: transparent; }
body.has-scrolled .site-header { border-bottom: 1px solid var(--ccu-line); box-shadow: 0 6px 20px rgb(3 78 49 / 8%); }
body.has-scrolled .site-header__inner { min-height: 76px; padding-block: 0; }
body.has-scrolled .site-branding__fallback img, body.has-scrolled .custom-logo { width: 108px; }

/* Footer */
.site-colorbar--footer { height: 11px; }
.site-footer { padding: 0; background: transparent; color: #707070; }
.site-footer__content { background: var(--ccu-surface); padding: 50px 0 30px; }
.site-footer__head, .site-footer__grid { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 2rem; }
.site-footer__head { align-items: center; }
.site-footer__logo { display: block; width: 77px; height: auto; }
.site-footer h2 { margin: 0; color: #707070; font-family: var(--font-display); font-size: 12px; font-weight: 400; letter-spacing: 2.88px; line-height: 1.2; text-transform: uppercase; }
.site-footer__grid { padding-top: 30px; }
.site-footer__text { color: var(--ccu-muted); font-family: var(--font-copy); font-size: 13px; line-height: 27px; }
.site-footer__text p { margin: 0 0 1rem; }
.site-footer__text a { color: inherit; text-decoration: none; }
.site-footer__text a:hover { text-decoration: underline; }
.site-footer__socials { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.site-footer__socials a { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #ccc; color: rgb(102 102 102 / 80%); font-family: var(--font-display); font-size: 9px; font-weight: 700; text-decoration: none; text-transform: uppercase; }
.site-footer__socials a svg { width: 14px; height: 14px; fill: currentColor; }
.site-footer__socials a:hover { background: #f0f0f0; color: var(--ccu-green); }

/* Age gate */
.age-gate { position: fixed; z-index: 9999; inset: 0; display: grid; place-items: center; padding: 1.25rem; }
.age-gate__backdrop { position: absolute; inset: 0; background: linear-gradient(rgb(17 17 17 / 72%), rgb(17 17 17 / 72%)), url('../images/age-gate-water.webp') center / cover no-repeat; }
.age-gate__panel { position: relative; width: min(100%, 25.5rem); padding: 2rem 1.1rem 2.25rem; border-radius: 1rem; background: #fff; text-align: center; box-shadow: 0 1.25rem 3.75rem rgb(0 0 0 / 25%); }
.age-gate__logo { display: block; width: 8.5rem; height: auto; margin: 0 auto 1.75rem; }
.age-gate h1 { margin: 0 auto .75rem; max-width: 20rem; color: #333; font-family: var(--font-display); font-size: 1.3rem; line-height: 1.2; }
.age-gate p { margin: .25rem auto 1.25rem; color: #656565; font-size: .9rem; }
.age-gate__fields { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.age-gate input { width: 100%; min-width: 0; border: 1px solid #bbb; border-radius: .2rem; padding: .7rem .55rem; color: #333; font: inherit; }
.age-gate input:focus { outline: 3px solid rgb(87 184 71 / 30%); border-color: var(--ccu-green-bright); }
.age-gate button { width: 100%; margin-top: 1.1rem; border: 0; border-radius: .2rem; background: var(--ccu-green-bright); color: #fff; padding: .75rem 1rem; font-family: var(--font-display); font-size: .85rem; font-weight: 700; text-transform: uppercase; cursor: pointer; }
.age-gate button:hover, .age-gate button:focus { background: #469e3b; }
.age-gate__error { min-height: 1.25rem; margin: .5rem 0 0 !important; color: var(--ccu-burgundy) !important; font-size: .78rem !important; }
.age-gate__underage p { margin: 0; color: #333; font-weight: 700; }
.age-gate[hidden] { display: none; }

/* Home: reusable editorial modules */
.home-hero { position: relative; display: grid; min-height: clamp(460px, 48vw, 680px); place-items: center; overflow: hidden; background: var(--ccu-green); color: #f3ecec; }
.home-hero__video, .home-hero__poster, .home-hero__overlay { position: absolute; inset: 0; width: 100%; height: 100%; }
.home-hero__video { object-fit: cover; }
.home-hero__poster { background-position: center; background-size: cover; }
.home-hero__overlay { background: rgb(0 0 0 / 42%); }
.home-hero__content { position: relative; text-align: center; }
.home-hero__content .eyebrow { margin-bottom: 20px; color: #f3ecec; }
.home-hero h1 { margin: 0 auto; max-width: 60rem; color: #f3ecec; font-family: var(--font-display); font-size: clamp(40px, 5vw, 60px); font-weight: 400; letter-spacing: 2.88px; line-height: 1.2; }
.home-hero__cta { display: inline-flex; align-items: center; gap: 9px; margin-top: 30px; color: #fff; font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: 2.4px; text-decoration: none; text-transform: uppercase; }
.home-hero__cta:hover { text-decoration: underline; text-underline-offset: 4px; }
/* Reference: the current Home uses #F8F8F8 behind independent white news cards.
 * `.content-section` would flatten this padding; keep the extra bottom so the
 * Somos photo (and its quote) can overlap the band without covering the cards. */
.home-news { padding: 72px 0 80px; background: var(--ccu-surface); }
.home-news.content-section { padding: 30px 0 120px; }
@media (min-width: 1025px) {
  .home-news.content-section { padding-bottom: 200px; }
}
.section-heading { margin-bottom: 50px; }
.section-heading h2 { margin: 0; color: var(--ccu-green); font-family: var(--font-display); font-size: 40px; font-weight: 400; line-height: 1.2; }
.news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }
.news-card { background: var(--ccu-white); }
.news-card__link { display: flex; min-height: 100%; flex-direction: column; color: inherit; text-decoration: none; }
.news-card { overflow: hidden; transition: transform 220ms ease, box-shadow 220ms ease; }
.news-card img { display: block; width: 100%; height: 225px; object-fit: cover; transition: transform 500ms cubic-bezier(.22, 1, .36, 1); }
.news-card__body { display: flex; min-height: 177px; flex: 1; flex-direction: column; padding: 22px; }
.news-card h3 { margin: 0; color: var(--ccu-green); font-family: var(--font-display); font-size: 19px; font-weight: 600; line-height: 30px; }
.news-card__date { display: inline-flex; align-items: center; gap: 5px; margin: auto 0 0; color: var(--ccu-muted); font-family: var(--font-copy); font-size: 13px; font-weight: 400; line-height: 1.2; }
.news-card__date svg { width: 12px; height: 12px; fill: none; stroke: currentcolor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.news-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgb(3 78 49 / 10%); }
.news-card:hover img { transform: scale(1.025); }
/* Editorial: one reusable component for Home and internal pages.
 * Variants are intentionally limited to orientation, density and surface.
 * No page receives a bespoke section class. */
.ccu-editorial { padding: 60px 0; background: #fff; }
.ccu-editorial--theme-soft { background: var(--ccu-surface); }
.ccu-editorial__grid { display: grid; align-items: center; gap: clamp(2.5rem, 6vw, 7rem); }
.ccu-editorial--image-right .ccu-editorial__grid { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
.ccu-editorial--image-left .ccu-editorial__grid { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.ccu-editorial__content { max-width: 25rem; }
.ccu-editorial--image-right .ccu-editorial__content { grid-column: 1; }
.ccu-editorial--image-right .ccu-editorial__image { grid-column: 2; grid-row: 1; }
.ccu-editorial--image-left .ccu-editorial__image { grid-column: 1; }
.ccu-editorial--image-left .ccu-editorial__content { grid-column: 2; grid-row: 1; }
.ccu-editorial h2 { margin: 0; color: var(--ccu-green); font-family: var(--font-display); font-size: 40px; font-weight: 400; line-height: 1.2; }
.ccu-editorial h2 a { text-decoration: none; }
.ccu-editorial__text, .ccu-editorial__richtext { margin: 25px 0 0; color: var(--ccu-muted); font-size: 16px; line-height: 1.7; }
.ccu-editorial__richtext > :first-child { margin-top: 0; }
.ccu-editorial__richtext > :last-child { margin-bottom: 0; }
.ccu-editorial__richtext h3 { margin: 28px 0 8px; color: var(--ccu-muted); font-family: var(--font-copy); font-size: 17px; font-weight: 700; line-height: 1.3; }
.ccu-editorial__richtext h3:first-child { margin-top: 0; }
.ccu-editorial .text-link { margin-top: 35px; }
.ccu-editorial__stat { display: flex; align-items: baseline; gap: 10px; margin-top: 26px; color: var(--ccu-green); font-family: var(--font-display); }
.ccu-editorial__stat strong { font-size: clamp(38px, 4vw, 56px); font-weight: 400; line-height: 1; }
.ccu-editorial__stat span { max-width: 12rem; font-size: 12px; font-weight: 600; letter-spacing: 1.5px; line-height: 1.35; text-transform: uppercase; }
.ccu-editorial__image { overflow: hidden; }
.ccu-editorial__image img { display: block; width: 100%; height: auto; transition: transform 600ms cubic-bezier(.22, 1, .36, 1); }
.ccu-editorial:hover .ccu-editorial__image img { transform: scale(1.015); }
/* Roomy is the Home scale; internal pages use the compact default. */
.ccu-editorial--density-roomy { display: flex; align-items: center; min-height: 560px; padding: 80px 0; }
.ccu-editorial--density-roomy.ccu-editorial--theme-soft { min-height: 640px; }
/* Editorial green-gradient is a surface, not the Home map overflow. */
.ccu-editorial--theme-green-gradient { position: relative; min-height: 560px; overflow: visible; background: linear-gradient(180deg, #57b847 0%, #004d32 100%); color: #fff; }
.ccu-editorial--theme-green-gradient::before { position: absolute; z-index: 0; inset: -25% 0; background: radial-gradient(circle at 20% 25%, rgb(255 255 255 / 16%), transparent 25%), radial-gradient(circle at 75% 65%, rgb(250 183 0 / 12%), transparent 28%); content: ''; opacity: .7; pointer-events: none; }
.ccu-motion-enabled .ccu-editorial--theme-green-gradient::before { animation: ccu-gradient-drift 18s ease-in-out infinite alternate; }
.ccu-editorial--theme-green-gradient .ccu-editorial__grid, .ccu-editorial--theme-green-gradient .ccu-editorial__content, .ccu-editorial--theme-green-gradient .ccu-editorial__image { position: relative; z-index: 1; }
.ccu-editorial--theme-green-gradient h2, .ccu-editorial--theme-green-gradient .ccu-editorial__text, .ccu-editorial--theme-green-gradient .ccu-editorial__richtext { color: #fff; }
.ccu-editorial--theme-green-gradient .ccu-editorial__stat { color: #fff; }
.ccu-editorial--theme-green-gradient .text-link { color: var(--ccu-green-bright); }
.ccu-editorial--theme-green-gradient .text-link__arrow { color: #fff; }
.ccu-editorial--theme-green-gradient .eyebrow { color: #fff; }

/* Home editorial features: Home has four deliberate media compositions.
 * Each section remains independent, but shares the same container midpoint. */
.home-feature { position: relative; background: #fff; }
.home-feature__grid { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; column-gap: 30px; row-gap: 0; }
.home-feature__content { max-width: none; }
.home-feature--image-right .home-feature__content { grid-column: 1; }
.home-feature--image-right .home-feature__image { grid-column: 2; grid-row: 1; }
.home-feature--image-left .home-feature__image { grid-column: 1; }
.home-feature--image-left .home-feature__content { grid-column: 2; grid-row: 1; }
.home-feature h2 { max-width: 400px; margin: 0; }
.home-feature h2 a { text-decoration: none; }
.home-feature__text { margin: 25px 0 0; color: var(--ccu-muted); font-size: 16px; line-height: 1.7; }
.home-feature .text-link { margin-top: 35px; }
.home-feature__stat { display: flex; align-items: baseline; gap: 10px; margin-top: 26px; color: var(--ccu-green); font-family: var(--font-display); }
.home-feature__stat strong { font-size: clamp(38px, 4vw, 56px); font-weight: 400; line-height: 1; }
.home-feature__stat span { max-width: 12rem; font-size: 12px; font-weight: 600; letter-spacing: 1.5px; line-height: 1.35; text-transform: uppercase; }
.home-feature__image { position: relative; overflow: visible; }
.home-feature__image img { display: block; width: 100%; height: auto; transition: transform 600ms cubic-bezier(.22, 1, .36, 1); }
.home-feature:hover .home-feature__image img { transform: scale(1.015); }
.home-feature__media { position: relative; display: block; width: 100%; padding: 0; border: 0; background: transparent; cursor: pointer; }
.home-feature__media:focus-visible { outline: 3px solid var(--ccu-green-bright); outline-offset: 4px; }
.home-feature__play {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: grid;
  width: 100px;
  height: 100px;
  place-items: center;
  color: #fff;
  pointer-events: none;
  transform: translate(-50%, -50%);
  filter: drop-shadow(1px 0 6px rgb(0 0 0 / 30%));
}
.home-feature__play svg { display: block; overflow: visible; width: 100px; height: 100px; opacity: .8; transition: opacity 500ms ease; }
.home-feature__media:hover .home-feature__play svg, .home-feature__media:focus-visible .home-feature__play svg { opacity: 1; }
.home-feature__quote {
  position: absolute;
  z-index: 3;
  top: -70px;
  right: -10px;
  display: flex;
  width: 325px;
  min-height: 141px;
  margin: 0;
  padding: 30px;
  align-items: center;
  justify-content: center;
  background: var(--ccu-green-bright);
  color: #fff;
  font-family: var(--font-copy);
  font-size: 18px;
  font-style: italic;
  font-weight: 400;
  line-height: 27px;
  text-align: center;
}
/* 1. Somos: video-like media protrudes above and below its own section. */
.home-feature--media-overflow { min-height: 470px; padding: 60px 0 0; }
.home-feature--media-overflow .home-feature__image { z-index: 1; margin: -110px 0 -80px; }
/* 2. Marcas: product still starts outside the left edge; the section keeps air below. */
.home-feature--media-offset-left { padding: 0 0 80px; background: var(--ccu-surface); }
.home-feature--media-offset-left .home-feature__grid { min-height: 640px; }
.home-feature--media-offset-left .home-feature__image { position: absolute; z-index: 1; top: -9px; left: max(-140px, calc((100% - 100vw) / 2)); width: 660px; }
/* 3. Región: the map has priority over the following white section. */
.home-feature--theme-green-gradient { z-index: 3; min-height: 560px; padding: 0; overflow: visible; background: linear-gradient(180deg, #57b847 0%, #004d32 100%); color: #fff; isolation: isolate; }
.home-feature--theme-green-gradient::before { position: absolute; z-index: -1; inset: -25% 0; background: radial-gradient(circle at 20% 25%, rgb(255 255 255 / 16%), transparent 25%), radial-gradient(circle at 75% 65%, rgb(250 183 0 / 12%), transparent 28%); content: ''; opacity: .7; }
.ccu-motion-enabled .home-feature--theme-green-gradient::before { animation: ccu-gradient-drift 18s ease-in-out infinite alternate; }
.home-feature--theme-green-gradient .home-feature__grid { min-height: 560px; }
.home-feature--theme-green-gradient .home-feature__content { position: relative; z-index: 1; }
.home-feature--theme-green-gradient .home-feature__image { position: absolute; z-index: 1; top: -55px; right: clamp(10px, 6vw, 100px); left: auto; width: auto; height: 670px; margin: 0; overflow: visible; }
.home-feature--theme-green-gradient .home-feature__image img { width: auto; height: 670px; max-width: none; filter: drop-shadow(0 18px 24px rgb(0 50 33 / 18%)); }
.home-feature--theme-green-gradient h2, .home-feature--theme-green-gradient .home-feature__text { color: #fff; }
.home-feature--theme-green-gradient .home-feature__stat { color: #fff; }
.home-feature--theme-green-gradient .text-link { color: var(--ccu-green-bright); }
.home-feature--theme-green-gradient .text-link__arrow { color: #fff; }
.home-feature--theme-green-gradient .eyebrow { color: #fff; }
/* 4. Sustentabilidad: contained circular visual, right column, generous white space. */
.home-feature--media-contained { min-height: 640px; padding: 90px 0; }
.home-feature--media-contained .home-feature__grid { min-height: 460px; }
.home-feature--media-contained .home-feature__image { width: min(100%, 410px); margin-inline: auto; }
/* The regional module uses the same content data shape, but never the contained-media geometry. */
.home-feature--theme-green-gradient.home-feature--media-contained { min-height: 560px; padding: 0; }
.home-feature--theme-green-gradient.home-feature--media-contained .home-feature__grid { min-height: 560px; }
.home-feature--theme-green-gradient.home-feature--media-contained .home-feature__image { width: auto; margin: 0; }

/* Brand archive and single */
.content-section { padding: clamp(3rem, 8vw, 7rem) 0; }
.ccu-placeholder-hero { background: var(--ccu-green); color: #fff; padding: clamp(5rem, 12vw, 10rem) 0; }
.ccu-placeholder-hero h1, .brand-single__hero h1, .archive-header h1 { font-family: var(--font-condensed); font-weight: 600; text-transform: uppercase; }
.ccu-placeholder-hero h1 { margin: .5rem 0; font-size: clamp(2.8rem, 7vw, 6rem); line-height: 1; }
.brand-filters { display: flex; flex-wrap: wrap; gap: .75rem; margin: 2rem 0; }
.brand-filters a, .button { display: inline-block; border: 1px solid var(--ccu-green); border-radius: 99rem; padding: .6rem 1rem; color: var(--ccu-green); font-weight: 700; text-decoration: none; }
.button { background: var(--ccu-green); color: #fff; }
.brand-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 1.25rem; }
.brand-card { overflow: hidden; border: 1px solid var(--ccu-line); background: #fff; transition: transform .2s ease, box-shadow .2s ease; }
.brand-card:hover { transform: translateY(-.25rem); box-shadow: 0 .75rem 2rem rgb(16 24 40 / 12%); }
.brand-card__link { display: block; height: 100%; color: inherit; text-decoration: none; }
.brand-card__media { display: grid; place-items: center; min-height: 13rem; padding: 1.5rem; background: var(--ccu-surface); }
.brand-card__media img { display: block; width: 100%; height: 10rem; object-fit: contain; }
.brand-card__category { margin: 1.25rem 1.25rem 0; color: var(--ccu-green-bright); font-family: var(--font-display); font-weight: 700; font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; }
.brand-card__title { margin: .4rem 1.25rem 1.4rem; font-size: 1.15rem; }
.brand-single { --brand-accent: var(--ccu-green-bright); }
.brand-single .eyebrow { color: var(--brand-accent); }
.brand-single__hero { padding: clamp(4rem, 10vw, 8rem) 0; background: var(--ccu-surface); }
.brand-single__hero-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, .75fr); align-items: center; gap: clamp(2rem, 7vw, 7rem); }
.brand-single__hero h1 { margin: .5rem 0 1.5rem; font-size: clamp(2.5rem, 6vw, 5rem); line-height: 1; }
.brand-single__logo img { width: auto; max-width: 15rem; max-height: 6rem; object-fit: contain; }
.brand-single__description { max-width: 48rem; font-size: 1.15rem; }
.brand-single__description p { margin-block: 0 1rem; }
.brand-single__featured img { display: block; width: 100%; max-height: 38rem; object-fit: contain; }
.brand-single__details { background: var(--ccu-ink); color: #fff; }
.brand-single__details-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.brand-single__details h2 { margin: 0 0 .75rem; font-size: 1rem; text-transform: uppercase; letter-spacing: .06em; }
.brand-single__details p { margin: 0; }
.brand-socials { display: flex; flex-wrap: wrap; gap: .75rem; margin: 0; padding: 0; list-style: none; }
.brand-socials a { color: #fff; text-underline-offset: .25em; }

@keyframes ccu-nav-item-in {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: none; }
}
@media (max-width: 1024px) {
  .utility-navigation { display: none; }
  .site-header { z-index: 50; }
  .site-header__inner { min-height: 72px; padding: 0; }
  .site-branding__fallback img, .custom-logo { width: 105px; }
  .site-menu-toggle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    padding: 0;
  }
  .site-menu-toggle span[aria-hidden] {
    display: block;
    width: 22px;
    height: 2px;
    background: #232323;
    transform-origin: center;
    transition: transform 280ms cubic-bezier(.22, 1, .36, 1), opacity 180ms ease;
  }
  .site-menu-toggle[aria-expanded="true"] span[aria-hidden]:nth-child(2) { transform: translateY(7px) rotate(45deg); }
  .site-menu-toggle[aria-expanded="true"] span[aria-hidden]:nth-child(3) { opacity: 0; }
  .site-menu-toggle[aria-expanded="true"] span[aria-hidden]:nth-child(4) { transform: translateY(-7px) rotate(-45deg); }
  .primary-navigation {
    position: absolute;
    z-index: 50;
    top: 100%;
    right: 0;
    left: 0;
    display: block;
    max-height: calc(100dvh - 72px);
    overflow-x: hidden;
    overflow-y: auto;
    background: #232323;
    visibility: hidden;
    pointer-events: none;
    clip-path: inset(0 0 100% 0);
    transition: clip-path 320ms cubic-bezier(.22, 1, .36, 1), visibility 0s linear 320ms;
  }
  .primary-navigation.is-open {
    visibility: visible;
    pointer-events: auto;
    clip-path: inset(0);
    transition: clip-path 320ms cubic-bezier(.22, 1, .36, 1);
  }
  .primary-navigation ul, .footer-navigation ul { flex-direction: column; gap: 0; }
  .primary-navigation > ul { padding: 0; }
  .primary-navigation > ul > li { border-bottom: 1px solid #444; }
  .primary-navigation.is-open > ul > li {
    animation: ccu-nav-item-in 340ms cubic-bezier(.22, 1, .36, 1) both;
  }
  .primary-navigation.is-open > ul > li:nth-child(1) { animation-delay: 40ms; }
  .primary-navigation.is-open > ul > li:nth-child(2) { animation-delay: 70ms; }
  .primary-navigation.is-open > ul > li:nth-child(3) { animation-delay: 100ms; }
  .primary-navigation.is-open > ul > li:nth-child(4) { animation-delay: 130ms; }
  .primary-navigation.is-open > ul > li:nth-child(5) { animation-delay: 160ms; }
  .primary-navigation.is-open > ul > li:nth-child(6) { animation-delay: 190ms; }
  .primary-navigation > ul > li.menu-item-has-children {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
  }
  .primary-navigation > ul > li.menu-item-has-children > a {
    grid-column: 1;
    grid-row: 1;
  }
  .primary-navigation a {
    display: flex;
    min-height: 40px;
    align-items: center;
    padding: 0 16px;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 2.88px;
    transition: color 180ms ease;
  }
  .primary-navigation a:hover,
  .primary-navigation a:focus-visible { color: #57b847; }
  .primary-navigation > ul > li > a::before,
  .primary-navigation .menu-item-has-children > a::after { display: none; }
  .primary-navigation .is-expanded > a { color: #57b847; }
  .primary-navigation .nav-accordion {
    display: grid;
    grid-column: 2;
    grid-row: 1;
    width: 40px;
    min-height: 40px;
    place-items: center;
    padding: 0;
    border: 0;
    border-left: 1px solid #444;
    background: transparent;
    color: #fff;
    cursor: pointer;
  }
  .primary-navigation .nav-accordion::before {
    display: block;
    width: 7px;
    height: 7px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    content: '';
    transform: rotate(45deg);
    transition: transform 240ms cubic-bezier(.22, 1, .36, 1);
  }
  .primary-navigation .is-expanded > .nav-accordion { color: #57b847; }
  .primary-navigation .is-expanded > .nav-accordion::before { transform: rotate(225deg); }
  .primary-navigation li:hover > .sub-menu,
  .primary-navigation li:focus-within > .sub-menu {
    opacity: 0;
    pointer-events: none;
    transform: none;
    visibility: visible;
  }
  .primary-navigation .sub-menu {
    position: static;
    display: grid;
    grid-column: 1 / -1;
    min-width: 0;
    max-height: 0;
    gap: 0;
    padding: 0;
    overflow: hidden;
    background: #fff;
    box-shadow: none;
    opacity: 0;
    pointer-events: none;
    transform: none;
    transition: max-height 320ms cubic-bezier(.22, 1, .36, 1), opacity 220ms ease;
    visibility: visible;
  }
  .primary-navigation li.is-expanded > .sub-menu,
  .primary-navigation li.is-expanded:hover > .sub-menu,
  .primary-navigation li.is-expanded:focus-within > .sub-menu {
    max-height: 16rem;
    opacity: 1;
    pointer-events: auto;
  }
  .primary-navigation .sub-menu a {
    min-height: 40px;
    padding-left: 26px;
    color: var(--ccu-green);
    font-size: 13px;
    letter-spacing: 2.88px;
  }
  .primary-navigation .sub-menu a:hover,
  .primary-navigation .sub-menu a:focus-visible { color: var(--ccu-green-bright); }
  .primary-navigation .sub-menu li { border-top: 1px solid var(--ccu-line); }
  .site-footer__content { padding: 30px 0; }
  .site-footer__head, .site-footer__grid { grid-template-columns: 1fr; gap: 1.5rem; }
  .site-footer__head h2 { display: none; }
  .site-footer__grid { padding-top: 1.5rem; }
  .site-footer__grid > div:nth-child(2)::before,
  .site-footer__grid > div:last-child::before {
    display: block;
    margin-bottom: .75rem;
    color: #707070;
    font-family: var(--font-display);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 2.88px;
    text-transform: uppercase;
    content: 'Seguinos';
  }
  .site-footer__grid > div:nth-child(2)::before { content: 'Contactanos'; }
  .home-hero { min-height: min(72svh, 520px); padding: 28px 0; }
  .home-hero h1 { max-width: 16ch; font-size: clamp(28px, 8vw, 36px); letter-spacing: .4px; line-height: 1.18; }
  .home-hero__cta { margin-top: 22px; }
  .home-news { padding: 56px 0 64px; }
  .home-news.content-section { padding: 48px 0; }
  .section-heading { margin-bottom: 28px; }
  .section-heading h2, .ccu-editorial h2, .home-feature h2 { max-width: none; font-size: 30px; }
  .news-grid, .ccu-editorial__grid, .brand-single__hero-inner, .brand-single__details-grid { grid-template-columns: 1fr; }
  .news-grid { gap: 22px; }
  .news-card img { height: 190px; }
  .text-link { max-width: 100%; flex-wrap: wrap; letter-spacing: 1.5px; line-height: 1.45; }
  .ccu-editorial, .ccu-editorial--density-roomy { min-height: auto; padding: 55px 0; }
  .ccu-editorial--image-right .ccu-editorial__grid, .ccu-editorial--image-left .ccu-editorial__grid { grid-template-columns: 1fr; }
  .ccu-editorial--image-right .ccu-editorial__content, .ccu-editorial--image-left .ccu-editorial__content, .ccu-editorial--image-right .ccu-editorial__image, .ccu-editorial--image-left .ccu-editorial__image { grid-column: auto; grid-row: auto; }
  .ccu-editorial__content { max-width: none; }
  .ccu-editorial__image { order: -1; }
  .ccu-editorial--theme-green-gradient { min-height: auto; padding: 55px 0; overflow: hidden; }
  .ccu-editorial--theme-green-gradient .ccu-editorial__grid { min-height: auto; }
  .ccu-editorial--theme-green-gradient .ccu-editorial__image { position: static; width: 100%; height: auto; overflow: hidden; }
  .ccu-editorial--theme-green-gradient .ccu-editorial__image img { width: 100%; height: auto; max-width: 100%; }
  .home-feature, .home-feature--media-overflow, .home-feature--media-offset-left, .home-feature--media-contained { min-height: auto; padding: 48px 0; }
  .home-feature__grid, .home-feature--media-offset-left .home-feature__grid, .home-feature--media-contained .home-feature__grid { min-height: auto; grid-template-columns: 1fr; row-gap: 28px; }
  .home-feature--image-right .home-feature__content, .home-feature--image-left .home-feature__content, .home-feature--image-right .home-feature__image, .home-feature--image-left .home-feature__image { position: static; grid-column: auto; grid-row: auto; width: auto; margin: 0; }
  .home-feature__content { max-width: none; }
  .home-feature__image { order: -1; overflow: hidden; }
  .home-feature__image img, .home-feature__media img { width: 100%; height: auto; max-height: 280px; object-fit: cover; }
  .home-feature--theme-green-gradient { min-height: auto; padding: 48px 0; overflow: hidden; }
  .home-feature--theme-green-gradient .home-feature__grid { min-height: auto; }
  .home-feature--theme-green-gradient .home-feature__content { order: -1; }
  .home-feature--theme-green-gradient .home-feature__image { order: 0; width: 100%; height: auto; overflow: hidden; }
  .home-feature--theme-green-gradient .home-feature__image img { width: 100%; height: auto; max-width: 100%; max-height: 240px; object-fit: contain; object-position: center; }
  .home-feature__quote { display: none; }
  .home-feature__play, .home-feature__play svg { width: 64px; height: 64px; }
  .brand-single__featured { order: -1; }
  .brand-single__featured img { max-height: 24rem; }
}
@keyframes ccu-gradient-drift { from { transform: translate3d(0, -2%, 0); } to { transform: translate3d(0, 3%, 0); } }
@keyframes ccu-colorbar-sweep { from { transform: translateX(-105%); } to { transform: translateX(105%); } }
@keyframes ccu-navigation-line { 0% { opacity: 1; transform: scaleX(0); } 75%, 100% { opacity: 1; transform: scaleX(1); } }
html.ccu-is-leaving .site-colorbar::after { animation: ccu-colorbar-sweep 260ms linear both; }
html.ccu-is-leaving .site-header::after { animation: ccu-navigation-line 260ms cubic-bezier(.22, 1, .36, 1) both; }

@media (max-width: 420px) {
  .age-gate__panel { padding: 1.75rem 1rem; }
  .age-gate h1 { font-size: 1.15rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .ccu-motion-ready [data-reveal] { opacity: 1; transform: none; }
  .ccu-location-card__image img { transform: none !important; }
  [data-parallax] .page-statement__media::before { transform: translate3d(0, -126px, 0); transition: none; }
  .primary-navigation, .primary-navigation .sub-menu, .site-menu-toggle span[aria-hidden], .primary-navigation .nav-accordion::before { transition: none !important; }
  .primary-navigation.is-open > ul > li { animation: none; }
}

/* Flexible internal-page modules */
.page-heading { padding: 54px 0 21px; background: #fff; }
.page-heading__breadcrumb { display: flex; gap: 8px; margin: 0 0 16px; color: var(--ccu-green); font-family: var(--font-display); font-size: 10px; font-weight: 600; letter-spacing: 2.4px; line-height: 1.2; text-transform: uppercase; }
.page-heading__breadcrumb a { color: inherit; text-decoration: none; }
.page-heading__breadcrumb a:hover { text-decoration: underline; text-underline-offset: 3px; }
.page-heading h1 { font-size: 40px; }
.page-statement { padding: 48px 0; background: #fff; }
.page-statement__inner { display: flex; min-height: 375px; align-items: flex-end; }
.page-statement blockquote { max-width: 510px; margin: 0; padding: 32px 36px; background: linear-gradient(135deg, var(--ccu-green-bright), var(--ccu-green)); color: #fff; font-family: var(--font-display); font-size: clamp(25px, 2.6vw, 38px); font-weight: 400; line-height: 1.25; }
.page-statement--image { padding: 0; }
.page-statement--image .page-statement__inner { position: relative; display: block; min-height: 375px; isolation: isolate; }
.page-statement__media { position: absolute; z-index: -1; inset: 0; overflow: hidden; background: #fff; }
.page-statement__media::before { position: absolute; top: 0; width: 100%; height: 171%; background-image: var(--ccu-statement-image); background-position: center center; background-repeat: no-repeat; background-size: auto; content: ''; transform: translate3d(0, var(--ccu-parallax-y, -126px), 0); will-change: transform; }
.page-statement--image blockquote { position: absolute; z-index: 1; top: 130px; right: max(-80px, calc((100% - 100vw) / 2)); display: flex; width: min(325px, 32vw); min-height: 140px; max-width: none; align-items: center; justify-content: center; margin: 0; padding: 28px 30px; background: var(--ccu-green-bright); color: #fff; font-family: var(--font-copy); font-size: 18px; font-style: oblique; font-weight: 400; line-height: 27px; text-align: center; }
.page-statement-caption { padding: 20px 0; background: #fff; }
.page-statement-caption p { margin: 0; color: var(--ccu-muted); font-family: var(--font-copy); font-size: 17px; font-weight: 400; line-height: 27px; }
.page-copy { padding: 90px 0 100px; background: #fff; }
.page-copy__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(2rem, 8vw, 9rem); }
.page-copy--wide .page-copy__grid { grid-template-columns: minmax(0, 1fr); }
.page-copy__lead { max-width: 26rem; margin: 0; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(25px, 2.6vw, 38px); font-weight: 400; line-height: 1.25; }
.page-copy__content { max-width: 42rem; color: var(--ccu-muted); }
.page-copy--wide { padding: 0 0 60px; }
.page-copy--wide .page-copy__content { width: 75%; max-width: 75%; padding: 10px 0; font-family: var(--font-copy); font-size: 17px; font-weight: 400; line-height: 27.2px; }
.page-copy__content > :first-child { margin-top: 0; }
.page-copy__content > :last-child { margin-bottom: 0; }
.ccu-graphic { padding: 70px 0; background: var(--ccu-surface); }
.ccu-graphic__inner { width: min(100%, 1080px); margin: 0 auto; }
.ccu-graphic__inner img { display: block; width: 100%; height: auto; }
.ccu-timeline { padding: 80px 0; background: #fff; }
.ccu-timeline__track { position: relative; display: grid; gap: 0; }
.ccu-timeline__track::before { position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; background: var(--ccu-line); content: ''; }
.ccu-timeline__item { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 7vw, 8rem); min-height: 340px; padding: 45px 0; }
.ccu-timeline__item--reverse .ccu-timeline__image { grid-column: 2; }
.ccu-timeline__item--reverse .ccu-timeline__content { grid-column: 1; grid-row: 1; text-align: right; }
.ccu-timeline__image { display: flex; align-items: center; justify-content: center; }
.ccu-timeline__image img { display: block; max-width: min(100%, 460px); max-height: 300px; object-fit: contain; }
.ccu-timeline__content { align-self: center; max-width: 28rem; color: var(--ccu-muted); }
.ccu-timeline__item--reverse .ccu-timeline__content { justify-self: end; }
.ccu-timeline__year { margin: 0 0 8px; color: var(--ccu-green-bright); font-family: var(--font-display); font-size: 16px; font-weight: 700; letter-spacing: 1.5px; }
.ccu-timeline h2 { margin: 0 0 18px; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(28px, 2.7vw, 40px); font-weight: 400; line-height: 1.15; }
.ccu-timeline__content > p:last-child { margin: 0; font-size: 16px; line-height: 1.7; }
@media (max-width: 760px) {
  .page-heading { padding: 42px 0 34px; }
  .page-heading h1 { font-size: 32px; line-height: 1.12; }
  .page-heading__breadcrumb { flex-wrap: wrap; letter-spacing: 1.6px; }
  .page-statement { padding: 36px 0; }
  .page-statement__inner { min-height: 260px; }
  .page-statement blockquote { padding: 25px; font-size: 22px; line-height: 1.3; }
  .page-statement--image { padding: 0 0 56px; }
  .page-statement--image .page-statement__inner { min-height: 300px; background-size: cover; }
  .page-statement--image blockquote { top: auto; right: 20px; bottom: -36px; left: 20px; width: auto; padding: 22px 20px; font-size: 16px; line-height: 1.45; }
  .page-statement-caption { padding: 36px 0 0; }
  .page-statement-caption + .page-copy { padding-top: 16px; }
  .page-copy { padding: 55px 0; }
  .page-copy--wide { padding: 16px 0 55px; }
  .page-copy__grid { grid-template-columns: 1fr; gap: 26px; }
  .page-copy__lead { max-width: none; font-size: 24px; }
  .page-copy--wide .page-copy__content { width: 100%; max-width: none; padding: 0; }
  .ccu-timeline { padding: 48px 0; }
  .ccu-timeline__track::before { left: 16px; }
  .ccu-timeline__item,
  .ccu-timeline__item--reverse { grid-template-columns: 1fr; min-height: 0; gap: 18px; padding: 28px 0 28px 36px; }
  .ccu-timeline__item--reverse .ccu-timeline__image,
  .ccu-timeline__item--reverse .ccu-timeline__content { grid-column: auto; grid-row: auto; text-align: left; justify-self: start; }
  .ccu-timeline h2 { font-size: 26px; }
  .ccu-404 { padding: 72px 0; }
  .ccu-404 h1 { font-size: 32px; }
}
/* Reusable location grid: plants, offices and distribution points. */
.ccu-locations { padding: 80px 0 100px; background: var(--ccu-surface); }
.ccu-locations__header { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(2rem, 8vw, 9rem); align-items: end; margin: 0 0 42px; }
.ccu-locations h2 { margin: 0; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(30px, 3vw, 42px); font-weight: 400; line-height: 1.15; }
.ccu-locations__intro { max-width: 42rem; color: var(--ccu-muted); }
.ccu-locations__intro > :first-child { margin-top: 0; }
.ccu-locations__intro > :last-child { margin-bottom: 0; }
.ccu-locations__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.ccu-location-card { background: #fff; overflow: hidden; }
.ccu-location-card__image { aspect-ratio: 1.5 / 1; overflow: hidden; background: #e9ecea; }
.ccu-location-card__image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 600ms cubic-bezier(.22,1,.36,1); }
.ccu-location-card:hover img { transform: scale(1.025); }
.ccu-location-card__body { min-height: 88px; padding: 22px 24px; }
.ccu-location-card h3 { margin: 0; color: var(--ccu-green); font-family: var(--font-display); font-size: 24px; font-weight: 400; line-height: 1.2; }
.ccu-location-card p { margin: 8px 0 0; color: var(--ccu-muted); font-size: 14px; line-height: 1.45; }
.ccu-motion-enabled .ccu-location-card[data-reveal] {
  opacity: 0;
  transform: translateY(64px) scale(.88);
  transition: opacity 780ms cubic-bezier(.22, 1, .36, 1) var(--reveal-delay, 0ms), transform 880ms cubic-bezier(.16, 1, .3, 1) var(--reveal-delay, 0ms);
}
.ccu-motion-enabled .ccu-location-card[data-reveal].is-revealed { opacity: 1; transform: none; }
.ccu-motion-enabled .ccu-location-card[data-reveal] .ccu-location-card__image img {
  transform: scale(1.18);
  transition: transform 1100ms cubic-bezier(.22, 1, .36, 1) var(--reveal-delay, 0ms);
}
.ccu-motion-enabled .ccu-location-card[data-reveal].is-revealed .ccu-location-card__image img { transform: none; }
.ccu-motion-enabled .ccu-location-card[data-reveal].is-revealed:hover .ccu-location-card__image img { transform: scale(1.04); }
.ccu-motion-enabled .ccu-locations__grid .ccu-location-card[data-reveal]:nth-child(1) { --reveal-delay: 0ms; }
.ccu-motion-enabled .ccu-locations__grid .ccu-location-card[data-reveal]:nth-child(2) { --reveal-delay: 200ms; }
.ccu-motion-enabled .ccu-locations__grid .ccu-location-card[data-reveal]:nth-child(3) { --reveal-delay: 400ms; }
.ccu-motion-enabled .ccu-locations__grid .ccu-location-card[data-reveal]:nth-child(4) { --reveal-delay: 600ms; }
.ccu-motion-enabled .ccu-locations__grid .ccu-location-card[data-reveal]:nth-child(5) { --reveal-delay: 800ms; }
.ccu-motion-enabled .ccu-locations__grid .ccu-location-card[data-reveal]:nth-child(6) { --reveal-delay: 1000ms; }
.ccu-motion-enabled .ccu-locations__grid .ccu-location-card[data-reveal]:nth-child(7) { --reveal-delay: 1200ms; }
.ccu-motion-enabled .ccu-locations__grid .ccu-location-card[data-reveal]:nth-child(8) { --reveal-delay: 1400ms; }
.ccu-motion-enabled .ccu-locations__grid .ccu-location-card[data-reveal]:nth-child(9) { --reveal-delay: 1600ms; }
@media (max-width: 760px) {
  .ccu-locations { padding: 55px 0; }
  .ccu-locations__header { grid-template-columns: 1fr; gap: 20px; margin-bottom: 30px; }
  .ccu-locations h2 { font-size: 28px; }
  .ccu-locations__grid { grid-template-columns: 1fr; gap: 18px; }
  .ccu-location-card h3 { font-size: 22px; }
  .ccu-motion-enabled .ccu-locations__grid .ccu-location-card[data-reveal] { --reveal-delay: 0ms; }
}
/* Reusable data and editorial-card modules. */
.ccu-metrics { padding: 80px 0; background: var(--ccu-green); color: #fff; }
.ccu-metrics .eyebrow { color: var(--ccu-green-bright); }
.ccu-metrics h2 { margin: 0 0 38px; color: #fff; font-family: var(--font-display); font-size: clamp(30px, 3vw, 42px); font-weight: 400; line-height: 1.15; }
.ccu-metrics__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid rgb(255 255 255 / 28%); }
.ccu-metric { min-height: 180px; padding: 34px clamp(20px,4vw,48px); border-right: 1px solid rgb(255 255 255 / 28%); }
.ccu-metric:first-child { padding-left: 0; } .ccu-metric:last-child { border-right: 0; }
.ccu-metric strong { display: block; font-family: var(--font-display); font-size: clamp(46px,5vw,72px); font-weight: 400; line-height: 1; }
.ccu-metric p { max-width: 19rem; margin: 14px 0 0; font-size: 13px; font-weight: 600; letter-spacing: .8px; line-height: 1.5; text-transform: uppercase; }
.ccu-cards { padding: 90px 0 110px; background: #fff; }
.ccu-cards h2 { margin: 0 0 42px; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(30px,3vw,42px); font-weight: 400; line-height: 1.15; }
.ccu-cards__grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 40px; }
.ccu-content-card { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: center; gap: 30px; }
.ccu-content-card__image { overflow: hidden; } .ccu-content-card__image img { display:block; width:100%; height:auto; transition:transform 600ms cubic-bezier(.22,1,.36,1); } .ccu-content-card:hover img { transform:scale(1.02); }
.ccu-content-card h3 { margin: 0 0 14px; color:var(--ccu-green); font-family:var(--font-display); font-size:28px; font-weight:400; line-height:1.15; }
.ccu-content-card__copy { color:var(--ccu-muted); font-size:15px; line-height:1.65; } .ccu-content-card__copy > :first-child { margin-top:0; } .ccu-content-card__copy > :last-child { margin-bottom:0; }
@media (max-width:760px) { .ccu-metrics,.ccu-cards { padding:55px 0; } .ccu-metrics h2, .ccu-cards h2 { font-size:28px; margin-bottom:28px; } .ccu-metrics__grid,.ccu-cards__grid,.ccu-content-card { grid-template-columns:1fr; } .ccu-metric { min-height:0; padding:26px 0; border-right:0; border-bottom:1px solid rgb(255 255 255 / 28%); } .ccu-metric strong { font-size:40px; } .ccu-content-card { gap:18px; } .ccu-content-card h3 { font-size:22px; } }
/* Standard corporate-green editorial treatment, distinct from the map-overflow module. */
.ccu-editorial--theme-green { background: linear-gradient(180deg, #57b847 0%, #004d32 100%); color: #fff; }
.ccu-editorial--theme-green h2, .ccu-editorial--theme-green .ccu-editorial__text, .ccu-editorial--theme-green .ccu-editorial__richtext { color: #fff; }
.ccu-editorial--theme-green .eyebrow, .ccu-editorial--theme-green .text-link { color: #fff; }
.ccu-editorial--theme-green .text-link__arrow { color: #fff; }
.ccu-editorial--theme-green .ccu-editorial__image img { filter: drop-shadow(0 18px 24px rgb(0 50 33 / 18%)); }
.ccu-graphic--contained { padding: 95px 0; }
.ccu-graphic--contained .ccu-graphic__inner { width: min(100%, 440px); }
/* Interactive model: SVG is semantic UI, not a decorative image. */
.ccu-sustainability-model { padding: 84px 0 96px; background: #fff; text-align: center; }
.ccu-sustainability-model__header h2 { margin: 0; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(30px, 3vw, 42px); font-weight: 400; }
.ccu-sustainability-model__wheel { width: min(100%, 575px); aspect-ratio: 1; margin: 32px auto 0; }
.ccu-sustainability-model__wheel svg { display: block; width: 100%; height: auto; overflow: visible; }
.ccu-model__target { cursor: pointer; outline: none; transition: opacity 180ms ease, filter 180ms ease; }
.ccu-model__target:hover, .ccu-model__target:focus { opacity: .82; filter: brightness(1.08); }
.ccu-sustainability-model__hint { margin: 12px 0 0; color: var(--ccu-muted); font-size: 14px; }
@media (max-width:760px) { .ccu-sustainability-model { padding: 55px 0; } }
/* Outset: the photo may sit above its own band. The section still owns
 * the bottom of the image, so the next module does not start underneath it. */
.ccu-editorial--media-outset { position: relative; min-height: 560px; padding: 0 0 70px; }
.ccu-editorial--media-outset .ccu-editorial__grid { min-height: 560px; }
.ccu-editorial--media-outset .ccu-editorial__image { position: relative; z-index: 2; margin: -90px 0 0; overflow: visible; }
.ccu-editorial--media-outset .ccu-editorial__image img { box-shadow: 0 20px 42px rgb(0 38 25 / 14%); }
.ccu-editorial:has(+ .ccu-editorial--media-outset) { padding-bottom: 170px; }
.ccu-editorial--theme-green.ccu-editorial--media-outset,
.ccu-editorial--theme-green-gradient.ccu-editorial--media-outset { min-height: 560px; }
.ccu-editorial--theme-green.ccu-editorial--media-outset .ccu-editorial__grid,
.ccu-editorial--theme-green-gradient.ccu-editorial--media-outset .ccu-editorial__grid { min-height: 560px; }
@media (max-width:760px) {
	.ccu-editorial--media-outset { padding: 55px 0; min-height: auto; }
	.ccu-editorial--media-outset .ccu-editorial__grid { min-height: auto; }
	.ccu-editorial--media-outset .ccu-editorial__image { margin: 0; overflow: hidden; }
	.ccu-editorial:has(+ .ccu-editorial--media-outset) { padding-bottom: 55px; }
}

/* Sustainability model dialogs — compact Elementor popup scale, not full-bleed. */
.ccu-model-dialog {
	width: min(1020px, calc(100vw - 72px));
	max-height: min(660px, calc(100dvh - 56px));
	margin: auto;
	padding: 22px 0 0;
	overflow: visible;
	border: 0;
	background: transparent;
	color: #fff;
	box-shadow: none;
}
.ccu-model-dialog::backdrop {
	background: rgb(0 0 0 / 72%);
	backdrop-filter: blur(4px);
}
.ccu-model-dialog__inner {
	position: relative;
	display: grid;
	grid-template-columns: minmax(220px, 34%) minmax(0, 1fr);
	gap: 36px;
	align-items: stretch;
	max-height: min(618px, calc(100dvh - 78px));
	padding: 40px;
	overflow: visible;
	border-radius: 32px;
	background: #0086d1;
	box-shadow: 0 24px 64px rgb(0 0 0 / 36%);
	text-align: left;
}
.ccu-model-dialog:not(.ccu-model-dialog--with-media) .ccu-model-dialog__inner {
	display: block;
	max-width: none;
	padding: 48px 52px;
}
.ccu-model-dialog__media {
	min-width: 0;
	overflow: hidden;
	border-radius: 14px;
}
.ccu-model-dialog__media img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 0;
	max-height: 520px;
	object-fit: cover;
	border-radius: 14px;
}
.ccu-model-dialog__body { min-width: 0; }
.ccu-model-dialog .eyebrow { margin: 0 0 10px; color: #d7eef8; letter-spacing: 1.6px; }
.ccu-model-dialog h2 {
	margin: 0 0 14px;
	color: #fff;
	font-family: var(--font-display);
	font-size: clamp(28px, 3.1vw, 40px);
	font-weight: 400;
	line-height: 1.08;
}
.ccu-model-dialog__content {
	max-width: none;
	color: #fff;
	font-family: var(--font-copy);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.45;
}
.ccu-model-dialog__content p { margin: 0; }
.ccu-model-dialog__content strong { font-weight: 700; }
.ccu-model-dialog__metrics {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	margin-top: 28px;
}
.ccu-model-dialog__metric {
	display: flex;
	min-height: 118px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 16px 14px;
	border-radius: 10px;
	background: #006ba8;
	color: #fff;
	text-align: center;
}
.ccu-model-dialog__metric strong {
	display: block;
	margin: 0 0 8px;
	color: #fff;
	font-family: var(--font-display);
	font-size: clamp(26px, 2.3vw, 34px);
	font-weight: 400;
	line-height: .95;
}
.ccu-model-dialog__metric span {
	max-width: 18em;
	color: #fff;
	font-family: var(--font-copy);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.25;
}
.ccu-model-dialog__close {
	position: absolute;
	z-index: 2;
	top: -18px;
	right: 18px;
	display: grid;
	width: 36px;
	height: 36px;
	padding: 0;
	place-items: center;
	border: 0;
	border-radius: 4px;
	background: #fff;
	color: #0086d1;
	font-family: Arial, sans-serif;
	font-size: 28px;
	font-weight: 400;
	line-height: 1;
	cursor: pointer;
}
.ccu-model-dialog__close span { display: block; transform: translateY(-1px); }
.ccu-model-dialog__close:hover,
.ccu-model-dialog__close:focus-visible { background: #e6f5fc; outline: 2px solid #fff; outline-offset: 2px; }
@media (max-width: 960px) {
	.ccu-model-dialog { width: calc(100vw - 36px); max-height: calc(100dvh - 56px); overflow: auto; border-radius: 24px; }
	.ccu-model-dialog__inner { grid-template-columns: 1fr; gap: 22px; max-height: none; padding: 28px 24px 24px; }
	.ccu-model-dialog__media img { max-height: 220px; }
	.ccu-model-dialog h2 { margin-bottom: 10px; }
	.ccu-model-dialog__metrics { gap: 10px; margin-top: 20px; }
	.ccu-model-dialog__metric { min-height: 96px; padding: 14px 12px; }
	.ccu-model-dialog__close { top: 10px; right: 10px; }
}
@media (max-width: 560px) {
	.ccu-model-dialog { width: calc(100vw - 20px); border-radius: 18px; }
	.ccu-model-dialog__inner { padding: 24px 18px 20px; }
	.ccu-model-dialog h2 { font-size: 26px; }
	.ccu-model-dialog__content { font-size: 15px; }
	.ccu-model-dialog__metrics { grid-template-columns: 1fr; }
	.ccu-model-dialog__metric strong { font-size: 28px; }
	.ccu-model-dialog__metric span { font-size: 13px; }
}

/* Nuestras Marcas */
.brands-archive { background: #fff; }
.brands-archive__heading { padding: 42px 0 28px; }
.brands-archive__heading h1 { margin: 0; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(40px, 4.4vw, 64px); font-weight: 400; line-height: 1.05; }
.brands-archive__intro { padding: 0 0 28px; }
.brands-archive__hero { position: relative; overflow: hidden; }
.brands-archive__hero img { display: block; width: 100%; height: clamp(280px, 42vw, 520px); object-fit: cover; transform: scale(1.04); transition: transform 1.4s cubic-bezier(.22,1,.36,1); }
.ccu-motion-enabled .brands-archive__hero.is-revealed img { transform: none; }
.brands-archive__hero blockquote { position: absolute; right: 0; top: 50%; width: min(42%, 460px); margin: 0; padding: clamp(28px, 4vw, 56px) clamp(22px, 3vw, 42px); transform: translateY(-50%); background: rgb(87 184 71 / 82%); color: #fff; font-family: var(--font-copy); font-size: clamp(18px, 1.7vw, 26px); font-style: italic; font-weight: 400; line-height: 1.38; }
.brands-archive__copy { max-width: 46rem; padding: 36px 0 12px; }
.brands-archive__copy p { margin: 0 0 18px; color: var(--ccu-muted); font-family: var(--font-copy); font-size: 17px; line-height: 1.62; }
.brands-archive__copy p:first-child { color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(22px, 2.2vw, 32px); line-height: 1.2; }
.brands-portfolio { padding: 28px 0 118px; }
.brands-filter { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 0 8px; }
.brands-filter button { padding: 12px 20px; border: 0; background: var(--ccu-green); color: #fff; font-family: var(--font-display); font-size: 12px; font-weight: 600; letter-spacing: 1.6px; line-height: 1.2; text-transform: uppercase; cursor: pointer; transition: background 280ms ease, transform 280ms cubic-bezier(.22,1,.36,1); }
.brands-filter button:hover { background: #04633e; }
.brands-filter button.is-active { background: var(--ccu-green-bright); }
.brands-filter button:focus-visible { outline: 3px solid var(--ccu-green-bright); outline-offset: 3px; }
.brands-group { padding: 48px 0 0; transition: opacity 320ms ease, transform 420ms cubic-bezier(.22,1,.36,1); }
.brands-group.is-filtered-out { opacity: 0; transform: translateY(10px); pointer-events: none; }
.brands-group[hidden] { display: none; }
.brands-group h2 { margin: 0 0 28px; color: #46a53a; font-family: var(--font-display); font-size: clamp(28px, 3vw, 42px); font-weight: 400; line-height: 1.1; }
.brands-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 22px; }
.brands-card { min-width: 0; }
.brands-card[hidden] { display: none; }
.brands-card button { display: grid; width: 100%; padding: 0; border: 0; background: transparent; color: var(--ccu-green); font: inherit; text-align: left; cursor: pointer; }
.brands-card button:focus-visible { outline: 3px solid var(--ccu-green-bright); outline-offset: 4px; }
.brands-card__media { display: grid; overflow: hidden; background: #f3f3f3; place-items: center; }
.brands-card img { display: block; width: 100%; object-fit: contain; transition: transform 640ms cubic-bezier(.22,1,.36,1), filter 320ms ease; }
.brands-card button:hover img, .brands-card button:focus-visible img { filter: saturate(1.06); transform: scale(1.06); }
.brands-card__name { padding: 12px 4px 0; font-family: var(--font-display); font-size: 15px; font-weight: 500; line-height: 1.25; }
@media (max-width: 900px) {
  .brands-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .brands-archive__hero blockquote { width: min(56%, 380px); }
}
@media (max-width: 640px) {
  .brands-archive__heading { padding: 32px 0 22px; }
  .brands-archive__heading h1 { font-size: 32px; }
  .brands-archive__hero img { height: 240px; }
  .brands-archive__hero blockquote { position: static; width: auto; padding: 22px 20px; transform: none; font-size: 16px; }
  .brands-archive__copy { padding-top: 22px; }
  .brands-archive__copy p:first-child { font-size: 20px; }
  .brands-portfolio { padding: 12px 0 68px; }
  .brands-filter button { padding: 10px 14px; font-size: 11px; letter-spacing: 1.1px; }
  .brands-group { padding-top: 36px; }
  .brands-group h2 { font-size: 26px; }
  .brands-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 12px; }
}

.brand-modal { width: min(1120px, calc(100vw - 48px)); max-height: calc(100dvh - 48px); margin: auto; padding: 0; overflow: visible; border: 0; background: transparent; color: var(--ccu-green); opacity: 0; transform: translateY(22px) scale(.975); transition: opacity 420ms cubic-bezier(.22,1,.36,1), transform 480ms cubic-bezier(.22,1,.36,1); }
.brand-modal.is-open { opacity: 1; transform: none; }
.brand-modal.is-closing { opacity: 0; transform: translateY(14px) scale(.985); }
.brand-modal::backdrop { background: rgb(8 18 14 / 0); transition: background 420ms ease; }
.brand-modal.is-open::backdrop { background: rgb(8 18 14 / 62%); }
.brand-modal__panel { position: relative; display: grid; grid-template-columns: minmax(320px, .92fr) minmax(320px, 1.08fr); max-height: calc(100dvh - 48px); overflow: auto; border-radius: 18px; background: #fff; box-shadow: 0 28px 80px rgb(0 0 0 / 28%); }
.brand-modal__close { position: absolute; z-index: 4; top: 14px; right: 16px; display: grid; width: 36px; height: 36px; padding: 0; place-items: center; border: 0; background: transparent; color: #8a8a8a; font-family: Arial, sans-serif; font-size: 28px; font-weight: 300; line-height: 1; cursor: pointer; transition: color 200ms ease, transform 200ms ease; }
.brand-modal__close span { transform: translateY(-1px); }
.brand-modal__close:hover, .brand-modal__close:focus-visible { color: var(--ccu-green); transform: rotate(90deg); }
.brand-modal__media { position: relative; display: grid; min-width: 0; align-items: center; padding: 36px 28px 48px; }
.brand-modal__slides { position: relative; min-height: 420px; }
.brand-modal__slide { position: absolute; inset: 0; display: grid; margin: 0; place-items: center; opacity: 0; visibility: hidden; transition: opacity 480ms cubic-bezier(.22,1,.36,1), visibility 480ms; }
.brand-modal__slide.is-active { position: relative; opacity: 1; visibility: visible; }
.brand-modal__slide img { display: block; width: min(100%, 360px); height: min(52vh, 480px); object-fit: contain; }
.brand-modal__nav { position: absolute; top: 50%; z-index: 2; display: grid; width: 42px; height: 42px; place-items: center; border: 2px solid var(--ccu-green-bright); border-radius: 50%; background: #fff; color: var(--ccu-green-bright); font-size: 28px; line-height: 1; cursor: pointer; transform: translateY(-50%); transition: background 200ms ease, color 200ms ease, transform 200ms ease; }
.brand-modal__nav:hover, .brand-modal__nav:focus-visible { background: var(--ccu-green-bright); color: #fff; }
.brand-modal__nav--prev { left: 8px; }
.brand-modal__nav--next { right: 8px; }
.brand-modal__dots { position: absolute; right: 0; bottom: 14px; left: 0; display: flex; justify-content: center; gap: 8px; }
.brand-modal__dots button { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: #d5d5d5; cursor: pointer; transition: background 220ms ease, transform 220ms ease; }
.brand-modal__dots button.is-active { background: var(--ccu-blue); transform: scale(1.15); }
.brand-modal__content { padding: clamp(40px, 5vw, 72px) clamp(32px, 5vw, 64px) clamp(40px, 5vw, 72px) clamp(12px, 3vw, 36px); }
.brand-modal.is-open .brand-modal__content { animation: ccu-brand-copy-in 560ms cubic-bezier(.22,1,.36,1) both; }
.brand-modal__content .eyebrow { margin: 0 0 14px; }
.brand-modal__content h2 { max-width: 12ch; margin: 0 0 22px; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(36px, 4.2vw, 58px); font-weight: 400; line-height: .98; }
.brand-modal__description { max-width: 34rem; color: var(--ccu-ink); font-family: var(--font-copy); font-size: 16px; line-height: 1.6; }
.brand-modal__description p:first-child { margin-top: 0; }
.brand-modal__description p:last-child { margin-bottom: 0; }
.brand-modal__content .text-link { margin-top: 22px; }
.brand-modal__details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 28px; margin-top: 36px; padding-top: 22px; border-top: 1px solid #ececec; }
.brand-modal__details h3 { margin: 0 0 8px; color: var(--ccu-green-bright); font-family: var(--font-display); font-size: 12px; font-weight: 600; letter-spacing: 1.8px; text-transform: uppercase; }
.brand-modal__details p { margin: 0; color: var(--ccu-green); font-family: var(--font-copy); font-size: 14px; line-height: 1.55; }
.brand-modal__social ul { display: flex; flex-wrap: wrap; gap: 8px 12px; margin: 0; padding: 0; list-style: none; }
.brand-modal__social a { color: var(--ccu-green); font-size: 14px; text-underline-offset: 3px; }
@keyframes ccu-brand-copy-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@media (max-width: 860px) {
  .brand-modal { width: calc(100vw - 24px); max-height: calc(100dvh - 24px); }
  .brand-modal__panel { grid-template-columns: 1fr; }
  .brand-modal__slides { min-height: 280px; }
  .brand-modal__slide img { height: min(42vh, 340px); }
  .brand-modal__content { padding: 8px 28px 42px; }
  .brand-modal__content h2 { max-width: none; }
  .brand-modal__details { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .brand-modal__details { grid-template-columns: 1fr; }
  .brand-modal__content { padding: 4px 20px 32px; }
  .brand-modal__content h2 { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .brand-modal, .brand-modal::backdrop, .brands-card img, .brands-group, .brands-filter button, .brands-archive__hero img { transition: none !important; }
  .brand-modal.is-open .brand-modal__content { animation: none; }
}

.video-modal {
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
}
.video-modal[open] { display: grid; place-items: center; }
.video-modal::backdrop { background: rgb(0 0 0 / 82%); }
.video-modal__close {
  position: absolute;
  z-index: 2;
  top: 18px;
  right: 22px;
  display: grid;
  width: 44px;
  height: 44px;
  padding: 0;
  place-items: center;
  border: 0;
  background: transparent;
  color: #ededed;
  font-family: Arial, sans-serif;
  font-size: 32px;
  font-weight: 300;
  line-height: 1;
  cursor: pointer;
  transition: color 200ms ease, transform 200ms ease;
}
.video-modal__close:hover, .video-modal__close:focus-visible { color: #fff; transform: rotate(90deg); }
.video-modal__frame {
  width: min(960px, calc(100vw - 48px), calc((100dvh - 96px) * 16 / 9));
  aspect-ratio: 16 / 9;
  background: #000;
}
.video-modal__frame iframe { display: block; width: 100%; height: 100%; border: 0; }
@media (max-width: 560px) {
  .video-modal__close { top: 10px; right: 10px; }
}

/* Noticias: native posts, one quiet archive and one focused reading experience. */
.news-archive { padding: 72px 0 110px; background: #fff; }
.news-archive__heading { margin-bottom: 56px; }
.news-archive__heading .eyebrow { margin: 22px 0 12px; }
.news-archive__heading h1 { margin: 0; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(42px, 4.4vw, 64px); font-weight: 400; line-height: 1.04; }
.news-archive__layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(260px, .55fr); gap: clamp(54px, 9vw, 150px); align-items: start; }
.news-archive__list { min-width: 0; }
.news-listing { display: grid; grid-template-columns: minmax(210px, .72fr) minmax(0, 1fr); gap: clamp(25px, 3vw, 42px); align-items: start; padding: 0 0 38px; margin: 0 0 38px; border-bottom: 1px solid #e5e9e7; }
.news-listing__image { display: block; overflow: hidden; background: #eef1ef; }
.news-listing__image img, .news-listing__placeholder { display: block; width: 100%; aspect-ratio: 1.5 / 1; object-fit: cover; transition: transform 520ms cubic-bezier(.22,1,.36,1); }
.news-listing:hover .news-listing__image img { transform: scale(1.025); }
.news-listing__date, .news-single__date { margin: 0 0 10px; color: #9d9d9d; font-family: var(--font-copy); font-size: 13px; line-height: 1.4; }
.news-listing h2 { margin: 0 0 13px; font-family: var(--font-display); font-size: clamp(22px, 2vw, 29px); font-weight: 500; line-height: 1.16; }
.news-listing h2 a { color: var(--ccu-green); text-decoration: none; }
.news-listing h2 a:hover { color: var(--ccu-green-bright); }
.news-listing__excerpt { max-width: 39rem; margin-bottom: 16px; color: var(--ccu-muted); font-family: var(--font-copy); font-size: 16px; line-height: 1.58; }
.news-listing .text-link { color: var(--ccu-green-bright); font-size: 12px; }
.news-popular { padding-top: 2px; }
.news-popular h2 { margin: 0 0 28px; color: var(--ccu-muted); font-family: var(--font-display); font-size: clamp(27px, 2.5vw, 37px); font-weight: 400; line-height: 1.1; }
.news-popular ol { margin: 0; padding: 0; list-style: none; counter-reset: popular; }
.news-popular li { display: grid; grid-template-columns: 34px 1fr; gap: 13px; padding: 18px 0; border-top: 1px solid #e3e8e5; }
.news-popular li:last-child { border-bottom: 1px solid #e3e8e5; }
.news-popular li > span { color: var(--ccu-green-bright); font-family: var(--font-display); font-size: 12px; font-weight: 600; letter-spacing: 1.4px; }
.news-popular a { color: var(--ccu-green); font-family: var(--font-display); font-size: 17px; font-weight: 500; line-height: 1.3; text-decoration: none; }
.news-popular a:hover { color: var(--ccu-green-bright); }
.news-pagination { margin-top: 10px; }
.news-pagination ul { display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.news-pagination a, .news-pagination span { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid #dbe4de; color: var(--ccu-green); font-family: var(--font-display); font-size: 14px; text-decoration: none; }
.news-pagination .current { border-color: var(--ccu-green); background: var(--ccu-green); color: #fff; }
.news-archive__empty { color: var(--ccu-muted); font-family: var(--font-copy); }
.news-single { padding: 70px 0 110px; background: #fff; }
.news-single__header { max-width: 1030px; }
.news-single__header .eyebrow { margin: 24px 0 13px; }
.news-single h1 { max-width: 960px; margin: 0 0 15px; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(42px, 5.1vw, 74px); font-weight: 400; line-height: 1.04; }
.news-single__featured { max-width: 1030px; margin-top: 42px; margin-bottom: 46px; }
.news-single__featured img { display: block; width: 100%; height: auto; max-height: 650px; object-fit: cover; }
.news-single__content { max-width: 860px; color: var(--ccu-muted); font-family: var(--font-copy); font-size: 18px; line-height: 1.65; }
.news-single__content > :first-child { margin-top: 0; }
.news-single__content p, .news-single__content ul, .news-single__content ol { margin: 0 0 1.1em; }
.news-single__content ul, .news-single__content ol { padding-left: 1.2em; }
.news-single__content h2, .news-single__content h3 { color: var(--ccu-green); font-family: var(--font-display); font-weight: 400; line-height: 1.18; }
.news-single__content h2 { margin-top: 2em; font-size: 34px; }
.news-single__content h3 { margin-top: 1.7em; font-size: 25px; }
.news-single__content a { color: var(--ccu-green-bright); text-underline-offset: 3px; }
.news-single__content img, .news-single__content video { display: block; max-width: 100%; height: auto; margin: 1.4em 0; }
.news-single__content figure { margin: 1.4em 0; }
.news-single__footer { max-width: 860px; margin-top: 48px; padding-top: 28px; border-top: 1px solid #dfe6e1; }
@media (max-width: 760px) {
  .news-archive, .news-single { padding: 48px 0 68px; }
  .news-archive__heading { margin-bottom: 28px; }
  .news-archive__heading .eyebrow { margin: 8px 0 10px; }
  .news-archive__heading h1, .news-single h1 { font-size: 32px; line-height: 1.12; }
  .news-archive__layout { grid-template-columns: 1fr; gap: 50px; }
  .news-listing { grid-template-columns: 1fr; gap: 18px; padding-bottom: 28px; margin-bottom: 28px; }
  .news-listing__image { max-width: none; }
  .news-single__header .eyebrow { margin: 10px 0 10px; }
  .news-single__featured { margin-top: 22px; margin-bottom: 24px; }
  .news-single__content { font-size: 17px; }
  .news-single__content h2 { font-size: 26px; }
  .news-single__content h3 { font-size: 21px; }
  .news-popular h2 { font-size: 26px; }
  .news-popular a { font-size: 16px; }
  .news-pagination ul { flex-wrap: wrap; }
  .news-pagination a, .news-pagination span { width: auto; min-width: 34px; padding: 0 10px; }
}

/* Useful error state: visually consistent while retaining a real HTTP 404. */
.ccu-404 { display: grid; min-height: 55vh; padding: clamp(90px, 13vw, 180px) 0; place-items: center; background: linear-gradient(135deg, #f8faf8, #fff); }
.ccu-404 .container { max-width: 880px; }
.ccu-404 h1 { max-width: 14ch; margin: 0 0 24px; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(42px, 5vw, 72px); font-weight: 400; line-height: 1.02; }
.ccu-404 p:not(.eyebrow) { max-width: 38rem; color: var(--ccu-muted); font-family: var(--font-copy); font-size: 18px; }
.ccu-404 div { display: flex; flex-wrap: wrap; gap: 22px 32px; margin-top: 36px; }

/* Contacto: native, legible and intentionally quiet; no third-party form UI. */
.contact-page { padding: 58px 0 110px; background: #fff; }
.contact-page__title { margin-top: 14px; font-size: clamp(42px, 4.4vw, 64px); }
.contact-page__phone { max-width: 920px; margin: 58px 0 34px; padding: 36px 42px; background: var(--ccu-green-bright); color: #fff; font-family: var(--font-copy); font-size: clamp(20px, 2.1vw, 29px); font-style: oblique; font-weight: 400; line-height: 1.38; text-align: center; }
.contact-page__phone p { margin: 0; }
.contact-page__phone strong { font-style: normal; font-weight: 700; white-space: nowrap; }
.contact-page__intro { max-width: 840px; margin: 0 0 66px; color: var(--ccu-muted); font-family: var(--font-copy); font-size: 18px; line-height: 1.7; }
.contact-page__intro p { margin: 0; }
.contact-page__form-wrap { max-width: 960px; padding-top: 6px; }
.contact-page__form-wrap h2 { margin: 0 0 34px; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(32px, 3vw, 42px); font-weight: 400; line-height: 1.15; }
.contact-notice { margin: 0 0 28px; padding: 15px 18px; font-family: var(--font-copy); font-size: 15px; line-height: 1.5; }
.contact-notice--success { border-left: 4px solid var(--ccu-green-bright); background: #eff8ed; color: #14532d; }
.contact-notice--error { border-left: 4px solid var(--ccu-burgundy); background: #fff3f5; color: #7d1837; }
.ccu-contact-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 25px 30px; }
.ccu-contact-form__field { margin: 0; }
.ccu-contact-form__field--full { grid-column: 1 / -1; }
.ccu-contact-form label { display: block; margin: 0 0 9px; color: var(--ccu-green); font-family: var(--font-display); font-size: 13px; font-weight: 600; letter-spacing: 1.35px; line-height: 1.25; text-transform: uppercase; }
.ccu-contact-form label span[aria-hidden] { color: var(--ccu-green-bright); }
.ccu-contact-form input, .ccu-contact-form textarea { display: block; width: 100%; border: 1px solid #ccd7d0; border-radius: 0; background: #fff; color: var(--ccu-ink); font: 400 16px/1.45 var(--font-copy); transition: border-color 160ms ease, box-shadow 160ms ease; }
.ccu-contact-form input { min-height: 48px; padding: 10px 13px; }
.ccu-contact-form textarea { min-height: 170px; padding: 13px; resize: vertical; }
.ccu-contact-form input:hover, .ccu-contact-form textarea:hover { border-color: #93ad9f; }
.ccu-contact-form input:focus, .ccu-contact-form textarea:focus { border-color: var(--ccu-green-bright); outline: 0; box-shadow: 0 0 0 3px rgb(87 184 71 / 18%); }
.ccu-contact-form__submit { display: inline-flex; align-items: center; gap: 12px; margin-top: 36px; padding: 14px 22px; border: 0; background: var(--ccu-green); color: #fff; font-family: var(--font-display); font-size: 12px; font-weight: 700; letter-spacing: 2.2px; text-transform: uppercase; cursor: pointer; transition: background 160ms ease, transform 160ms ease; }
.ccu-contact-form__submit:hover, .ccu-contact-form__submit:focus-visible { background: var(--ccu-green-bright); transform: translateY(-1px); }
.ccu-contact-form__submit span { font-size: 17px; line-height: 1; }
.ccu-contact-form__footnote { margin: 17px 0 0; color: var(--ccu-muted); font-size: 13px; }
.ccu-contact-form__honeypot { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
@media (max-width: 640px) {
  .contact-page { padding: 42px 0 66px; }
  .contact-page__title { font-size: 32px; }
  .contact-page__phone { margin: 28px 0 24px; padding: 22px 18px; font-size: 17px; text-align: left; }
  .contact-page__phone strong { white-space: normal; }
  .contact-page__intro { margin-bottom: 44px; font-size: 17px; }
  .contact-page__form-wrap h2 { font-size: 28px; }
  .ccu-contact-form__grid { grid-template-columns: 1fr; gap: 21px; }
  .ccu-contact-form__field--full { grid-column: auto; }
}

/* Legal pages: long-form content remains editable in the native editor. */
.ccu-legal { padding: 58px 0 110px; background: #fff; }
.ccu-legal__inner { max-width: 970px; }
.ccu-legal h1 { margin: 14px 0 58px; font-size: clamp(42px, 4.4vw, 64px); }
.ccu-legal__content { max-width: 860px; color: var(--ccu-muted); font-family: var(--font-copy); font-size: 16px; line-height: 1.72; }
.ccu-legal__content > :first-child { margin-top: 0; }
.ccu-legal__content h2 { margin: 54px 0 16px; color: var(--ccu-green); font-family: var(--font-display); font-size: clamp(25px, 2.4vw, 34px); font-weight: 400; line-height: 1.18; }
.ccu-legal__content h2:first-child { margin-top: 0; }
.ccu-legal__content p { margin: 0 0 20px; }
.ccu-legal__content ul { margin: 0 0 24px; padding-left: 1.3em; }
.ccu-legal__content li { margin: 0 0 10px; padding-left: 4px; }
.ccu-legal__content a { color: var(--ccu-green-bright); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.ccu-legal__content strong { color: var(--ccu-green); font-weight: 700; }
@media (max-width: 640px) { .ccu-legal { padding: 42px 0 68px; } .ccu-legal h1 { margin-bottom: 32px; font-size: 32px; } .ccu-legal__content { font-size: 16px; } .ccu-legal__content h2 { margin-top: 42px; font-size: 24px; } }