/* ==========================================================
   Design tokens
   ========================================================== */
:root {
  --ge-bg: #f4f1e9;
  --ge-surface: #ffffff;
  --ge-surface-soft: #eeece5;
  --ge-olive: #486831;
  --ge-olive-dark: #30491f;
  --ge-olive-soft: #dfe7d4;
  --ge-text: #20271f;
  --ge-text-soft: #4f584c;
  --ge-border: rgba(32, 39, 31, .12);
  --ge-radius: 22px;
  --ge-radius-sm: 14px;
  --ge-shell: 1260px;
  --ge-shadow: 0 18px 35px rgba(39, 54, 28, .08);
}

/* ==========================================================
   Reset & base
   ========================================================== */
* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

html,
body {
  background: #eef4e9;
}

body {
  margin: 0;
  font-family: Inter, Arial, sans-serif;
  color: var(--ge-text);
  line-height: 1.45;
}

body.menu-open,
body.search-open {
  overflow: hidden;
}

/* WordPress' Custom Background feature must not override the exterior canvas. */
body.custom-background {
  background: #eef4e9 !important;
}

a {
  text-decoration: none;
  color: inherit;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}

.ge-shell,
.container {
  width: min(calc(100% - 32px), var(--ge-shell));
  margin: 0 auto;
}

.site-main {
  overflow: hidden;
}

/* ==========================================================
   Buttons & typography utilities
   ========================================================== */
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 45px;
  padding: 0 18px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  border: 1px solid transparent;
  transition: .2s ease;
  background: #fff;
}

.button:hover {
  transform: translateY(-1px);
}

.button--primary {
  background: var(--ge-olive);
  color: #fff;
}

.button--primary:hover {
  background: var(--ge-olive-dark);
}

.button--secondary,
.button--ghost {
  background: #fff;
  border-color: #b9c5aa;
  color: var(--ge-text);
}

.button--secondary:hover,
.button--ghost:hover {
  background: #f8f8f5;
}

.button--small {
  min-height: 36px;
  padding: 0 14px;
  font-size: 12px;
  border-radius: 8px;
}

.ge-kicker {
  margin: 0 0 12px;
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 800;
  color: var(--ge-olive);
}

.ge-section-heading {
  margin-bottom: 24px;
}

.ge-section-heading--center {
  text-align: center;
}

.ge-section-heading h2 {
  margin: 0 0 8px;
  font-size: 44px;
  line-height: 1.05;
}

.ge-section-heading p {
  margin: 0;
  color: var(--ge-text-soft);
}

.ge-section-actions {
  text-align: center;
  margin-top: 18px;
}

@media (max-width: 640px) {
  .ge-shell,
  .container {
    width: min(calc(100% - 20px), var(--ge-shell));
  }

  .ge-section-heading h2 {
    font-size: 30px;
  }
}

/* ==========================================================
   Site frame
   The frame is the visible rounded card that contains the whole
   page (topbar + header + main + footer). It has been rebuilt
   several times; this is the current, single definition.
   ========================================================== */
.ge-site-frame {
  position: relative;
  width: min(calc(100% - 32px), var(--ge-shell));
  margin: 14px auto;
  background: #fff;
  border: 0 !important;
  border-radius: 18px;
  overflow: visible;
  box-shadow:
    0 20px 55px rgba(43, 67, 37, .13),
    0 3px 12px rgba(43, 67, 37, .06);
}

/* The main content keeps the pale canvas; the frame itself is white. */
.ge-site-frame .site-main {
  background: var(--ge-bg);
}

/* Nested shells fill the frame's own width instead of the page width. */
.ge-site-frame .ge-shell,
.ge-site-frame .container {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

.ge-site-frame .ge-header,
.ge-site-frame .site-main,
.ge-site-frame .ge-site-footer {
  position: relative;
  z-index: 1;
}

/* .ge-header and .site-main are siblings tied at z-index:1 above — at an
   equal value, the later one in the DOM (.site-main) wins the stacking
   order and paints over the earlier one, burying the header's own
   z-index:40 nav dropdown (see ".ge-nav .greenergy-nav__list .sub-menu")
   behind whatever .site-main renders, e.g. a page's full-bleed hero.
   z-index only ever competes within its own stacking context, so no
   z-index on the dropdown itself can fix this — .ge-header needs to
   outrank .site-main directly. */
.ge-site-frame .ge-header {
  z-index: 50;
}

/* Fixed UI stays viewport-relative and above the page frame. */
.ge-site-frame .site-overlay,
.ge-site-frame .ge-search-panel,
.ge-site-frame .ge-mobile-panel {
  position: fixed;
}

@media (max-width: 640px) {
  .ge-site-frame {
    width: calc(100% - 10px);
    margin: 5px auto;
    border-radius: 13px;
    box-shadow: 0 10px 30px rgba(43, 67, 37, .12);
  }
}

/* ==========================================================
   Top bar
   ========================================================== */
.ge-topbar {
  padding: 0;
  background: transparent;
}

.ge-topbar__inner {
  min-height: 38px;
  padding: 7px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  background: var(--ge-olive);
  color: #fff;
  border-radius: 17px 17px 0 0;
  font-size: 10px;
  line-height: 1.2;
}

.ge-topbar__messages,
.ge-topbar__utility,
.ge-topbar__socials,
.ge-topbar__contacts,
.ge-language-switcher {
  display: flex;
  align-items: center;
}

.ge-topbar__messages {
  flex: 1 1 auto;
  justify-content: flex-start;
  gap: 18px;
  min-width: 0;
}

.ge-topbar__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  font-weight: 600;
}

.ge-topbar__item i,
.ge-topbar__contact i {
  width: 13px;
  text-align: center;
  font-size: 11px;
  opacity: .95;
}

.ge-topbar__item i,
.ge-topbar__contact i,
.ge-topbar__socials i {
  display: inline-block;
  flex: 0 0 auto;
  color: currentColor;
  line-height: 1;
}

.ge-topbar__utility {
  flex: 0 0 auto;
  gap: 12px;
  white-space: nowrap;
}

.ge-topbar__socials {
  gap: 7px;
  padding: 0 15px 0 0;
  margin: 0;
  border-right: 1px solid rgba(255, 255, 255, .25);
}

.ge-topbar__contacts {
  gap: 16px;
  padding: 0 16px;
  border-right: 1px solid rgba(255, 255, 255, .25);
}

.ge-topbar__socials a,
.ge-language-switcher__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  transition: opacity .18s ease, transform .18s ease;
}

.ge-topbar__socials a {
  width: 18px;
  height: 18px;
  font-size: 12px;
}

.ge-topbar__socials a:hover,
.ge-topbar__contact:hover,
.ge-language-switcher__item:hover {
  opacity: .78;
}

.ge-topbar__contact {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #fff;
  font-weight: 600;
}

.ge-topbar__email {
  padding-right: 0;
  border-right: 0;
}

.ge-language-switcher {
  gap: 8px;
  padding-left: 2px;
}

.ge-language-switcher__item {
  min-height: 23px;
  gap: 5px;
  padding: 3px 4px;
  border-radius: 5px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.ge-language-switcher__item span {
  white-space: nowrap;
}

.ge-language-switcher__item img {
  width: 18px;
  height: 12px;
  object-fit: cover;
  border-radius: 1px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .25);
}

@media (max-width: 1180px) {
  .ge-topbar__messages {
    gap: 11px;
  }

  .ge-topbar__item {
    font-size: 9px;
  }

  .ge-topbar__email span {
    display: none;
  }

  .ge-topbar__contacts {
    gap: 10px;
    padding-inline: 11px;
  }

  .ge-language-switcher__item {
    font-size: 8px;
  }
}

@media (max-width: 991px) {
  .ge-topbar__inner {
    justify-content: space-between;
    gap: 10px;
  }

  .ge-topbar__messages {
    justify-content: flex-start;
  }

  .ge-topbar__messages .ge-topbar__item:not(:first-child) {
    display: none;
  }

  .ge-topbar__socials,
  .ge-topbar__email {
    display: none;
  }

  .ge-topbar__contacts {
    padding-inline: 9px;
  }
}

@media (max-width: 640px) {
  .ge-topbar__inner {
    min-height: 34px;
    padding: 6px 10px;
    border-radius: 12px 12px 0 0;
  }

  .ge-topbar__item {
    font-size: 9px;
  }

  .ge-topbar__whatsapp span {
    display: none;
  }

  .ge-topbar__utility {
    gap: 7px;
  }

  .ge-topbar__contacts {
    padding-inline: 7px;
    gap: 7px;
  }

  .ge-language-switcher {
    gap: 4px;
  }

  .ge-language-switcher__item {
    padding-inline: 2px;
    font-size: 0;
  }

  .ge-language-switcher__item img {
    width: 20px;
    height: 13px;
  }
}

/* ==========================================================
   Header
   ========================================================== */
.ge-header {
  background: transparent;
  border-bottom: 0;
}

.ge-header__inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 22px;
  min-height: 76px;
  padding: 0 18px;
  background: #fff;
  border-bottom: 1px solid var(--ge-border);
}

.ge-mobile-toggle {
  display: none;
  background: none;
  border: 0;
  padding: 0;
  width: 32px;
  height: 32px;
  color: var(--ge-text);
  cursor: pointer;
}

.ge-mobile-toggle span {
  display: block;
  width: 20px;
  height: 2px;
  background: currentColor;
  margin: 4px auto;
  border-radius: 2px;
}

.ge-header__brand {
  display: flex;
  align-items: center;
  min-width: var(--ge-logo-width, 150px);
}

.ge-header__brand .custom-logo-link {
  display: inline-flex;
  align-items: center;
  line-height: 0;
}

.ge-header__brand .custom-logo {
  width: var(--ge-logo-width, 150px) !important;
  max-width: var(--ge-logo-width, 150px) !important;
  max-height: none !important;
  height: auto !important;
  object-fit: contain;
}

.greenergy-text-logo {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1;
}

.greenergy-text-logo__top {
  font-weight: 800;
  letter-spacing: .15em;
  font-size: 26px;
}

.greenergy-text-logo__bottom {
  font-size: 12px;
  letter-spacing: .38em;
  color: #6a7564;
}

.ge-nav {
  justify-self: center;
}

.ge-nav .greenergy-nav__list {
  display: flex;
  align-items: center;
  gap: 26px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.ge-nav .greenergy-nav__list a {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: #232a22;
}

/* Desktop dropdown — WordPress already outputs a nested `.sub-menu` for
   any menu item with children (see wp_nav_menu's default walker); this
   theme just never had CSS to show it as a dropdown instead of an
   inline nested list. Hover-driven, with :focus-within as the keyboard
   equivalent. */
.ge-nav .greenergy-nav__list li {
  position: relative;
}

.ge-nav .greenergy-nav__list .menu-item-has-children > a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.ge-nav .greenergy-nav__list .menu-item-has-children > a::after {
  content: "";
  width: 6px;
  height: 6px;
  margin-top: -3px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
}

.ge-nav .greenergy-nav__list .sub-menu {
  position: absolute;
  /* No gap between here and the trigger link — a CSS margin here would
     be dead space the mouse has to cross that's outside both the <li>
     (which :hover depends on) and this menu (which is display:none
     until hovered), closing the dropdown before the pointer ever
     reaches it. padding-top fakes the same visual breathing room from
     the INSIDE, where it still counts as "still hovering". */
  top: 100%;
  left: 0;
  z-index: 40;
  display: none;
  flex-direction: column;
  min-width: 200px;
  margin: 0;
  padding: 14px 8px 8px;
  list-style: none;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 12px;
  box-shadow: var(--ge-shadow);
}

.ge-nav .greenergy-nav__list li:hover > .sub-menu,
.ge-nav .greenergy-nav__list li:focus-within > .sub-menu {
  display: flex;
}

.ge-nav .greenergy-nav__list .sub-menu a {
  display: block;
  padding: 9px 10px;
  border-radius: 8px;
  white-space: nowrap;
}

.ge-nav .greenergy-nav__list .sub-menu a:hover,
.ge-nav .greenergy-nav__list .sub-menu a:focus {
  background: var(--ge-surface-soft);
}

/* A sub-menu nested inside another sub-menu opens to the side instead
   of stacking underneath, in case a deeper level ever gets used. */
.ge-nav .greenergy-nav__list .sub-menu .sub-menu {
  top: 0;
  left: 100%;
  margin: 0;
  padding-left: 14px;
}

.ge-header__actions {
  display: flex;
  align-items: center;
  gap: 14px;
}

.ge-icon-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: #243022;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

.ge-icon-button svg {
  width: 22px;
  height: 22px;
  display: block;
}

.ge-header__cart .cart-count {
  position: absolute;
  top: -4px;
  right: -6px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--ge-olive);
  color: #fff;
  font-size: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
}

@media (max-width: 991px) {
  .ge-header__inner {
    grid-template-columns: 32px 1fr auto;
    gap: 12px;
    min-height: 72px;
    padding: 0 14px;
  }

  .ge-mobile-toggle {
    display: block;
  }

  .ge-nav {
    display: none;
  }

  .ge-header__brand {
    justify-self: start;
    min-width: var(--ge-logo-width, 150px);
  }

  .ge-header__brand .custom-logo {
    width: var(--ge-logo-width, 150px) !important;
    max-width: var(--ge-logo-width, 150px) !important;
    max-height: none !important;
    height: auto !important;
  }

  .greenergy-text-logo__top {
    font-size: 20px;
  }

  .greenergy-text-logo__bottom {
    font-size: 10px;
    letter-spacing: .28em;
  }
}

@media (max-width: 640px) {
  .ge-header__inner {
    min-height: 66px;
    padding: 0 12px;
  }

  .ge-header__actions {
    gap: 10px;
  }

  .ge-icon-button {
    width: 22px;
    height: 22px;
  }

  .ge-icon-button svg {
    width: 20px;
    height: 20px;
  }

  .ge-header__brand .custom-logo {
    width: var(--ge-logo-width, 150px) !important;
    max-width: var(--ge-logo-width, 150px) !important;
    max-height: none !important;
    height: auto !important;
  }
}

/* ==========================================================
   Search panel (modal)
   ========================================================== */
.ge-search-panel[hidden],
.site-overlay[hidden] {
  display: none !important;
}

.ge-search-panel {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: start center;
  padding: clamp(94px, 13vh, 150px) 16px 30px;
  background: transparent;
  border: 0;
}

.ge-search-panel__dialog {
  width: min(680px, 100%);
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 24px 70px rgba(23, 31, 20, .24);
  overflow: hidden;
}

.ge-search-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 22px 14px;
  border-bottom: 1px solid var(--ge-border);
}

.ge-search-panel__header h2 {
  margin: 0;
  font-size: 20px;
  line-height: 1.2;
}

.ge-search-panel__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--ge-surface-soft);
  color: var(--ge-text);
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

.ge-search-panel__body {
  padding: 22px;
}

.ge-search-panel .search-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}

.ge-search-panel .search-field {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--ge-border);
  border-radius: 9px;
  padding: 0 14px;
  font: inherit;
}

.ge-search-panel .search-submit {
  min-height: 48px;
  padding: 0 22px;
  border: 0;
  border-radius: 9px;
  background: var(--ge-olive);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}

.site-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 20, 13, .42);
  z-index: 70;
  opacity: 0;
  transition: .2s;
}

.site-overlay.is-visible {
  opacity: 1;
}

@media (max-width: 640px) {
  .ge-search-panel {
    align-items: start;
    padding-top: 82px;
  }

  .ge-search-panel__header,
  .ge-search-panel__body {
    padding-left: 16px;
    padding-right: 16px;
  }

  .ge-search-panel .search-form {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================
   Mobile menu panel
   ========================================================== */
.ge-mobile-panel {
  position: fixed;
  top: 0;
  left: 0;
  width: min(86vw, 360px);
  height: 100vh;
  background: #fff;
  z-index: 80;
  padding: 24px 20px;
  transform: translateX(-100%);
  transition: .25s ease;
  overflow: auto;
  box-shadow: var(--ge-shadow);
}

.ge-mobile-panel.is-open {
  transform: translateX(0);
}

.ge-mobile-panel__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ge-olive);
  margin-bottom: 20px;
}

.ge-mobile-panel__close {
  background: none;
  border: 0;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

.ge-mobile-panel .search-form {
  display: flex;
  gap: 10px;
  margin-bottom: 18px;
}

.ge-mobile-panel .search-field {
  flex: 1;
  min-height: 44px;
  border: 1px solid var(--ge-border);
  border-radius: 10px;
  padding: 0 12px;
}

.ge-mobile-panel .search-submit {
  min-height: 44px;
  border: 0;
  border-radius: 10px;
  background: var(--ge-olive);
  color: #fff;
  padding: 0 16px;
  font-weight: 700;
}

.ge-mobile-panel__nav .greenergy-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 14px;
}

.ge-mobile-panel__nav a {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
}

/* Mobile accordion for items with a sub-menu — hover has no equivalent
   on touch, so theme.js injects a separate toggle button (not the link
   itself, which should still just navigate) that flips this same
   li.is-open class the desktop version doesn't need. */
.ge-mobile-panel__nav .menu-item-has-children {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.ge-mobile-submenu-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 50%;
  background: var(--ge-surface-soft);
  color: var(--ge-text);
  transition: transform .2s ease;
}

.ge-mobile-submenu-toggle svg {
  width: 12px;
  height: 12px;
}

.menu-item-has-children.is-open .ge-mobile-submenu-toggle {
  transform: rotate(180deg);
}

.ge-mobile-panel__nav .sub-menu {
  display: none;
  flex-basis: 100%;
  margin: 4px 0 0;
  padding: 0 0 0 16px;
  list-style: none;
  gap: 12px;
}

.menu-item-has-children.is-open > .sub-menu {
  display: grid;
}

.ge-mobile-panel__nav .sub-menu a {
  font-size: 13px;
}

.ge-mobile-panel__links {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--ge-border);
}

/* ==========================================================
   Home · Hero slider
   ========================================================== */
.ge-hero.ge-hero-slider {
  position: relative;
  padding: 0;
  background: #f7f4ec;
  border-bottom: 1px solid rgba(32, 39, 31, .08);
  overflow: hidden;
}

.ge-hero-slider__noscript {
  margin: 0;
  padding: 8px 16px;
  background: #fff4d6;
  color: #5c4814;
  font-size: 12px;
  text-align: center;
}

.ge-hero-slider__viewport {
  display: grid;
  position: relative;
  width: 100%;
  overflow: hidden;
}

.ge-hero-slide {
  grid-area: 1 / 1;
  display: grid;
  grid-template-columns: minmax(0, 46%) minmax(0, 54%);
  width: 100%;
  background: #f7f4ec;
  transform: translate3d(100%, 0, 0);
  visibility: hidden;
  pointer-events: none;
  z-index: 1;
  will-change: transform;
}

.ge-hero-slide.is-active {
  z-index: 2;
  transform: translate3d(0, 0, 0);
  visibility: visible;
  pointer-events: auto;
}

/* The incoming slide starts outside the right edge and covers the current one. */
.ge-hero-slide.is-entering {
  z-index: 3;
  transform: translate3d(100%, 0, 0);
  visibility: visible;
  pointer-events: none;
}

.ge-hero-slide.is-entering.is-entering-active {
  transform: translate3d(0, 0, 0);
  transition: transform 680ms cubic-bezier(.22, .61, .36, 1);
}

.ge-hero-slide__content {
  display: flex;
  min-width: 0;
  min-height: 500px;
  flex-direction: column;
  justify-content: center;
  padding: 38px 38px 30px 44px;
  background: #f7f4ec;
}

.ge-hero-slider.has-multiple-slides .ge-hero-slide__content {
  padding-bottom: 58px;
}

.ge-hero-slide .ge-kicker {
  margin-bottom: 14px;
  font-size: 12px;
  line-height: 1.4;
}

.ge-hero-slide h1,
.ge-hero-slide h2 {
  max-width: 520px;
  margin: 0 0 18px;
  color: var(--ge-text);
  font-size: clamp(42px, 4vw, 58px);
  font-weight: 750;
  line-height: 1.03;
  letter-spacing: -.04em;
}

.ge-hero-slide__lead {
  max-width: 500px;
  color: var(--ge-text-soft);
  font-size: 17px;
  line-height: 1.55;
}

.ge-hero-slide__lead p {
  margin: 0;
}

.ge-hero-slide__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}

.ge-hero-slide__actions .button {
  min-height: 44px;
  padding-inline: 20px;
  border-radius: 5px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .02em;
}

.ge-hero-highlights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  max-width: 540px;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}

.ge-hero-highlight {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: #344032;
}

.ge-hero-highlight__icon {
  display: inline-flex;
  width: 26px;
  height: 26px;
  align-items: center;
  justify-content: center;
  color: var(--ge-olive-dark);
  font-size: 20px;
  line-height: 1;
}

.ge-hero-highlight__icon i,
.ge-hero-highlight__icon svg {
  display: block;
  width: 22px;
  height: 22px;
  font-size: 20px;
  fill: currentColor;
}

.ge-hero-highlight__text {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.25;
}

.ge-hero-slide__media {
  position: relative;
  min-width: 0;
  min-height: 500px;
  overflow: hidden;
  background: #dfe4dc;
}

.ge-hero-slide__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  -webkit-mask-image: none;
  mask-image: none;
}

.ge-hero-slide__media .ge-hero__mock-image {
  position: absolute;
  inset: 0;
  -webkit-mask-image: none;
  mask-image: none;
}

/* CSS-only placeholder artwork shown when a slide has no configured image. */
.ge-hero__mock-image {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 65% 28%, rgba(178, 199, 152, .95) 0 18%, rgba(123, 147, 92, .72) 19% 27%, rgba(233, 228, 216, .96) 28% 40%, rgba(209, 201, 185, .95) 41% 47%, transparent 48%),
    radial-gradient(circle at 18% 82%, #7da15b 0 10px, transparent 11px),
    radial-gradient(circle at 24% 74%, #89af61 0 16px, transparent 17px),
    linear-gradient(120deg, #ebe3d5 0%, #d8ccb6 40%, #b5ac95 100%);
}

.ge-bowl {
  position: absolute;
  inset: auto 19% 16% auto;
  width: 64%;
  height: 64%;
  border-radius: 50%;
  background: radial-gradient(circle at 46% 44%, #7ba457 0 24%, #6b8d49 25% 34%, #f0ede3 35% 43%, #ccc3b2 44% 52%, transparent 53%);
  transform: rotate(-6deg);
}

.ge-whisk {
  position: absolute;
  right: 22%;
  top: 8%;
  width: 18%;
  height: 48%;
  transform: rotate(24deg);
  background: linear-gradient(180deg, #b78c4b 0 26%, #cfaa6e 26% 40%, transparent 40%);
  border-radius: 44px;
}

.ge-whisk::before {
  content: "";
  position: absolute;
  left: 20%;
  right: 20%;
  top: 40%;
  bottom: 0;
  background: repeating-linear-gradient(90deg, #be9a5b 0 2px, transparent 2px 8px);
}

.ge-leaf {
  position: absolute;
  display: block;
  background: #7da95a;
  border-radius: 100% 0 100% 0;
  transform: rotate(25deg);
}

.ge-leaf--1 {
  left: 7%;
  bottom: 16%;
  width: 64px;
  height: 28px;
}

.ge-leaf--2 {
  left: 10%;
  bottom: 11%;
  width: 44px;
  height: 18px;
}

.ge-hero-slider__dots {
  position: absolute;
  z-index: 9;
  left: 50%;
  bottom: 18px;
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  transform: translateX(-50%);
}

.ge-hero-slider__dot {
  width: 9px;
  height: 9px;
  padding: 0;
  border: 1px solid rgba(48, 73, 31, .55);
  border-radius: 999px;
  background: rgba(255, 255, 255, .84);
  cursor: pointer;
  transition: width 180ms ease, background 180ms ease, border-color 180ms ease;
}

.ge-hero-slider__dot:hover,
.ge-hero-slider__dot:focus-visible {
  border-color: var(--ge-olive-dark);
}

.ge-hero-slider__dot.is-active {
  width: 26px;
  background: var(--ge-olive);
  border-color: var(--ge-olive);
}

@media (prefers-reduced-motion: reduce) {
  .ge-hero-slide.is-entering.is-entering-active,
  .ge-hero-slider__dot {
    transition: none;
  }
}

@media (max-width: 991px) {
  .ge-hero-slide {
    grid-template-columns: 1fr;
  }

  .ge-hero-slide__media {
    order: -1;
    min-height: clamp(260px, 54vw, 410px);
  }

  .ge-hero-slide__content {
    min-height: 0;
    padding: 26px 22px 28px;
    text-align: center;
  }

  .ge-hero-slider.has-multiple-slides .ge-hero-slide__content {
    padding-bottom: 55px;
  }

  .ge-hero-slide h1,
  .ge-hero-slide h2,
  .ge-hero-slide__lead,
  .ge-hero-highlights {
    max-width: 680px;
    margin-right: auto;
    margin-left: auto;
  }

  .ge-hero-slide h1,
  .ge-hero-slide h2 {
    font-size: clamp(34px, 6vw, 48px);
  }

  .ge-hero-slide__actions {
    justify-content: center;
  }

  .ge-hero-slider__dots {
    bottom: 16px;
  }
}

@media (max-width: 640px) {
  .ge-hero-slide__media {
    min-height: 245px;
  }

  .ge-hero-slide__content {
    padding: 22px 16px 25px;
  }

  .ge-hero-slider.has-multiple-slides .ge-hero-slide__content {
    padding-bottom: 52px;
  }

  .ge-hero-slide .ge-kicker {
    margin-bottom: 10px;
    font-size: 10px;
  }

  .ge-hero-slide h1,
  .ge-hero-slide h2 {
    margin-bottom: 14px;
    font-size: 30px;
    line-height: 1.08;
  }

  .ge-hero-slide__lead {
    font-size: 14px;
    line-height: 1.5;
  }

  .ge-hero-slide__actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    margin-top: 18px;
  }

  .ge-hero-slide__actions .button {
    width: 100%;
  }

  .ge-hero-highlights {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
    margin-top: 22px;
  }

  .ge-hero-highlight {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 5px;
    text-align: center;
  }

  .ge-hero-highlight__text {
    font-size: 10px;
  }

  .ge-hero-slider__dots {
    bottom: 13px;
  }
}

/* ==========================================================
   Home · Reason Why strip
   ========================================================== */
.ge-reason-why {
  padding: 0 0 34px;
  background: #fff;
}

.ge-reason-why__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  background: var(--ge-surface-soft);
  border-top: 1px solid rgba(32, 39, 31, .07);
}

.ge-reason-why__item {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 116px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
  padding: 20px 16px;
  text-align: center;
}

.ge-reason-why__item:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 25%;
  right: 0;
  bottom: 25%;
  width: 1px;
  background: rgba(32, 39, 31, .09);
}

.ge-reason-why__media {
  display: inline-flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.ge-reason-why__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ge-reason-why__media.is-placeholder {
  border: 1.5px solid rgba(54, 72, 42, .55);
  border-radius: 12px;
}

.ge-reason-why__placeholder-mark {
  width: 14px;
  height: 14px;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  color: var(--ge-olive-dark);
}

.ge-reason-why__item p {
  max-width: 190px;
  margin: 0;
  color: var(--ge-text);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.3;
}

@media (max-width: 991px) {
  .ge-reason-why__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ge-reason-why__item:nth-child(2)::after {
    display: none;
  }

  .ge-reason-why__item:nth-child(-n+2) {
    border-bottom: 1px solid rgba(32, 39, 31, .08);
  }
}

@media (max-width: 640px) {
  .ge-reason-why {
    padding-bottom: 22px;
  }

  .ge-reason-why__item {
    min-height: 104px;
    gap: 7px;
    padding: 15px 10px;
  }

  .ge-reason-why__media {
    width: 34px;
    height: 34px;
  }

  .ge-reason-why__item p {
    font-size: 11px;
  }
}

/* ==========================================================
   Home · "¿Qué matcha es para vos?" (Ceremonial / Culinario)
   Each card is a single background-image surface: Ceremonial
   anchors its artwork left with copy on the right, Culinario
   anchors right with copy on the left.
   ========================================================== */
.ge-choice {
  padding: 30px 0 34px;
  background: #fff;
}

.ge-choice > .ge-shell {
  padding-inline: 34px;
}

.ge-choice .ge-section-heading {
  margin-bottom: 20px;
}

.ge-choice .ge-section-heading h2 {
  font-size: clamp(28px, 2.6vw, 38px);
  line-height: 1.08;
}

.ge-choice__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.ge-choice-card,
.ge-choice-card--culinary {
  position: relative;
  display: flex;
  min-height: 300px;
  overflow: hidden;
  border: 1px solid rgba(48, 67, 37, .12);
  border-radius: 9px;
  box-shadow: 0 6px 18px rgba(39, 54, 31, .035);
  background-repeat: no-repeat;
  background-size: cover;
}

.ge-choice-card--ceremonial {
  justify-content: flex-end;
  background-color: #edf2dd;
  background-position: left center;
}

.ge-choice-card--culinary {
  justify-content: flex-start;
  background-color: #f4f1e8;
  background-position: right center;
}

.ge-choice-card.is-placeholder {
  background-image: linear-gradient(135deg, rgba(237, 242, 221, .96), rgba(217, 227, 200, .88));
}

.ge-choice-card--culinary.is-placeholder {
  background-image: linear-gradient(225deg, rgba(244, 241, 232, .96), rgba(229, 221, 202, .88));
}

.ge-choice-card__body {
  position: relative;
  z-index: 1;
  display: flex;
  width: 52%;
  min-height: 300px;
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
  padding: 28px 30px;
}

.ge-choice-card--ceremonial .ge-choice-card__body {
  margin-left: auto;
}

.ge-choice-card--culinary .ge-choice-card__body {
  margin-right: auto;
}

.ge-choice-card__body h3 {
  margin: 0 0 10px;
  font-size: clamp(27px, 2.1vw, 34px);
}

.ge-choice-card__body p {
  margin: 0 0 14px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--ge-text-soft);
}

.ge-choice-card__body ul {
  margin: 0 0 18px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 7px;
  font-size: 13px;
}

.ge-choice-card__body li {
  position: relative;
  padding-left: 22px;
}

.ge-choice-card__body li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--ge-olive);
  font-weight: 700;
}

.ge-choice-card__body .button {
  margin-top: auto;
  min-width: 136px;
}

@media (max-width: 991px) {
  .ge-choice > .ge-shell {
    padding-inline: 24px;
  }

  .ge-choice__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1100px) {
  .ge-choice-card,
  .ge-choice-card--culinary {
    min-height: 290px;
  }

  .ge-choice-card__body {
    width: 56%;
    min-height: 290px;
    padding: 26px 24px;
  }
}

@media (max-width: 760px) {
  .ge-choice-card,
  .ge-choice-card--culinary {
    min-height: 300px;
    background-size: cover;
  }

  .ge-choice-card__body {
    width: 62%;
    min-height: 300px;
    padding: 24px 20px;
  }

  .ge-choice-card__body h3 {
    font-size: 28px;
  }
}

@media (max-width: 640px) {
  .ge-choice {
    padding: 24px 0 28px;
  }

  .ge-choice > .ge-shell {
    padding-inline: 14px;
  }

  .ge-choice__grid {
    gap: 12px;
  }
}

@media (max-width: 480px) {
  .ge-choice-card,
  .ge-choice-card--culinary {
    min-height: 320px;
  }

  .ge-choice-card__body {
    width: 66%;
    min-height: 320px;
    padding: 22px 17px;
  }

  .ge-choice-card__body p,
  .ge-choice-card__body ul {
    font-size: 12px;
  }
}

/* ==========================================================
   Home · Featured products
   ========================================================== */
.ge-featured-products {
  padding: 30px 0;
}

.ge-featured-products__inner {
  padding-inline: 34px;
}

.ge-product-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.ge-product-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 10px;
  overflow: hidden;
  text-align: center;
}

.ge-product-card__thumb {
  display: block;
  width: 100%;
  height: 190px;
  background: #fff;
  overflow: hidden;
  margin: 0;
  border-bottom: 1px solid rgba(0, 0, 0, .035);
}

.ge-product-card__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 0;
}

.ge-product-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 14px 16px 16px;
}

.ge-placeholder-pack {
  position: relative;
  background: linear-gradient(180deg, #f7f7f3, #ecece6);
}

.ge-placeholder-pack::before {
  content: "";
  position: absolute;
  left: 35%;
  top: 16%;
  width: 30%;
  height: 64%;
  border-radius: 8px;
  background: linear-gradient(180deg, #101712, #596e40);
  box-shadow: 0 10px 18px rgba(0, 0, 0, .12);
}

.ge-placeholder-pack::after {
  content: "";
  position: absolute;
  left: 43%;
  top: 30%;
  width: 14%;
  height: 14%;
  border-radius: 50%;
  background: #93b965;
}

.ge-product-card h3 {
  font-size: 18px;
  line-height: 1.25;
  margin: 0 0 8px;
}

.ge-product-card h3 a {
  color: inherit;
  text-decoration: none;
}

.ge-product-card__price {
  font-size: 20px;
  font-weight: 800;
  color: var(--ge-olive);
  margin: auto 0 0;
  text-align: left;
}

.ge-product-card__button {
  width: 100%;
  margin-top: 10px;
}

.ge-product-card .button.is-disabled {
  pointer-events: none;
  opacity: .55;
}

.ge-product-card .added_to_cart {
  margin-top: 9px;
  font-size: 13px;
  font-weight: 700;
  color: var(--ge-olive);
}

@media (max-width: 991px) {
  .ge-featured-products__inner {
    padding-inline: 24px;
  }

  .ge-product-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .ge-featured-products__inner {
    padding-inline: 14px;
  }

  .ge-product-grid {
    grid-template-columns: 1fr;
  }

  .ge-product-card__thumb {
    height: 175px;
  }
}

/* ==========================================================
   Home · Verdades
   ========================================================== */
.ge-truths {
  padding: 30px 0;
}

.ge-truths__inner {
  margin-inline: 34px;
  padding: 14px 0 20px;
  background: #efede5;
  border: 1px solid rgba(54, 73, 45, .08);
  border-radius: 12px;
  overflow: hidden;
}

.ge-truths__title {
  margin: 0;
  padding: 0 22px 12px;
  text-align: center;
  font-size: clamp(20px, 2vw, 26px);
  line-height: 1.2;
  color: var(--ge-text);
}

.ge-truths__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ge-truth-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  padding: 12px 24px 4px;
  text-align: center;
}

.ge-truth-card:not(:first-child) {
  border-left: 1px solid rgba(54, 73, 45, .11);
}

.ge-truth-card__icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin: 0 0 9px;
}

.ge-truth-card__image {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

.ge-truth-card__icon.is-placeholder {
  border: 1px solid rgba(66, 115, 41, .25);
  border-radius: 50%;
  color: var(--ge-olive-dark);
  font-size: 18px;
}

.ge-truth-card__placeholder {
  line-height: 1;
}

.ge-truth-card h3 {
  margin: 0 0 7px;
  font-size: 17px;
  line-height: 1.25;
}

.ge-truth-card p {
  margin: 0;
  max-width: 235px;
  font-size: 13px;
  line-height: 1.5;
  color: #3e473b;
}

@media (max-width: 900px) {
  .ge-truths__inner {
    margin-inline: 24px;
  }

  .ge-truths__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ge-truth-card {
    padding: 16px 22px;
  }

  .ge-truth-card:nth-child(odd) {
    border-left: 0;
  }

  .ge-truth-card:nth-child(n+3) {
    border-top: 1px solid rgba(54, 73, 45, .11);
  }
}

@media (max-width: 600px) {
  .ge-truths {
    padding: 24px 0;
  }

  .ge-truths__inner {
    margin-inline: 14px;
    padding-top: 16px;
  }

  .ge-truths__title {
    padding-inline: 18px;
  }

  .ge-truths__grid {
    grid-template-columns: 1fr;
  }

  .ge-truth-card,
  .ge-truth-card:nth-child(n) {
    border-left: 0;
    border-top: 1px solid rgba(54, 73, 45, .11);
    padding: 18px 22px;
  }

  .ge-truth-card:first-child {
    border-top: 0;
  }

  .ge-truth-card p {
    max-width: 320px;
  }
}

/* ==========================================================
   Home · Preparación (1 a 5 pasos configurables)
   ========================================================== */
.ge-steps,
.ge-preparation {
  padding: 30px 0;
}

.ge-preparation__inner {
  margin-inline: 34px;
}

.ge-preparation .ge-section-heading {
  margin-bottom: 18px;
}

.ge-steps__grid,
.ge-preparation__grid {
  display: grid;
  grid-template-columns: repeat(var(--ge-preparation-count), minmax(0, 1fr));
  gap: 14px;
}

.ge-step-card,
.ge-preparation-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 10px;
  overflow: hidden;
}

.ge-preparation-card__media {
  position: relative;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  min-height: 0;
  background: linear-gradient(135deg, #eee9dc, #ddd2bf);
  overflow: hidden;
}

.ge-preparation-card__media::before,
.ge-preparation-card__media::after {
  content: none !important;
  display: none !important;
}

.ge-preparation-card__media.has-image {
  background: #f5f4ef;
}

.ge-preparation-card__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ge-preparation-card__placeholder {
  position: absolute;
  inset: 18px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: radial-gradient(circle at 50% 50%, #86ab5f 0 16%, #eff1e8 17% 27%, transparent 28%);
  color: transparent;
}

.ge-preparation-card__body {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  padding: 14px 14px 17px;
}

.ge-step-card__number {
  display: block;
  margin: 0;
  font-size: 34px;
  font-weight: 800;
  color: var(--ge-olive);
  line-height: 1;
}

.ge-preparation-card__body p {
  margin: 2px 0 0;
  font-size: 13px;
  line-height: 1.42;
  color: #353d34;
}

.ge-preparation__grid--1 {
  max-width: 310px;
  margin-inline: auto;
}

.ge-preparation__grid--2 {
  max-width: 650px;
  margin-inline: auto;
}

.ge-preparation__grid--3 {
  max-width: 920px;
  margin-inline: auto;
}

@media (max-width: 1050px) {
  .ge-preparation__grid--1 {
    grid-template-columns: 1fr;
  }

  .ge-preparation__grid--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ge-preparation__grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ge-preparation__grid--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ge-preparation__grid--5 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .ge-preparation__inner {
    margin-inline: 24px;
  }

  .ge-preparation__grid,
  .ge-preparation__grid--1,
  .ge-preparation__grid--2,
  .ge-preparation__grid--3,
  .ge-preparation__grid--4,
  .ge-preparation__grid--5 {
    max-width: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ge-preparation-card__body {
    gap: 9px;
    padding: 12px;
  }

  .ge-preparation-card__body .ge-step-card__number {
    font-size: 30px;
  }
}

@media (max-width: 520px) {
  .ge-preparation {
    padding: 24px 0;
  }

  .ge-preparation__inner {
    margin-inline: 14px;
  }

  .ge-preparation__grid,
  .ge-preparation__grid--1,
  .ge-preparation__grid--2,
  .ge-preparation__grid--3,
  .ge-preparation__grid--4,
  .ge-preparation__grid--5 {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .ge-preparation-card {
    display: grid;
    grid-template-columns: 42% minmax(0, 1fr);
  }

  .ge-preparation-card__media {
    height: 100%;
    aspect-ratio: auto;
    min-height: 150px;
  }

  .ge-preparation-card__body {
    align-content: center;
    padding: 15px;
  }

  .ge-preparation-card__body p {
    font-size: 14px;
  }
}

/* ==========================================================
   Home · Artículos de interés
   Static bento layout (1 featured + 4 small notes) — replaced the old
   auto-rotating carousel. mobile-first: base rules below are the
   stacked mobile layout, min-width queries build up to the desktop
   1-featured + 2x2 grid.
   ========================================================== */
.ge-interest-articles {
  padding: 30px 0;
  background: #fff;
}

.ge-interest-articles__inner {
  padding-inline: 20px;
}

.ge-interest-articles__divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 12px;
}

.ge-interest-articles__divider::before,
.ge-interest-articles__divider::after {
  content: "";
  width: 40px;
  height: 1px;
  background: var(--ge-border);
}

.ge-interest-articles__divider i {
  color: var(--ge-olive);
  font-size: 15px;
}

.ge-interest-grid {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* ---- Featured card ---- */
.ge-interest-featured {
  display: block;
  overflow: hidden;
  border: 1px solid var(--ge-border);
  border-radius: 16px;
  background: #fff;
  color: var(--ge-text);
  transition: box-shadow .2s ease, transform .2s ease;
}

.ge-interest-featured:hover {
  transform: translateY(-2px);
  box-shadow: var(--ge-shadow);
}

.ge-interest-featured__media {
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #e9ece4;
}

.ge-interest-featured__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.ge-interest-featured:hover .ge-interest-featured__media img {
  transform: scale(1.025);
}

.ge-interest-featured__placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #e2e8da, #f4f1e9 55%, #ccd8c2);
}

.ge-interest-featured__category {
  position: absolute;
  left: 14px;
  bottom: 14px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 3px 12px rgba(0, 0, 0, .08);
  color: var(--ge-olive-dark);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  line-height: 1;
  text-transform: uppercase;
}

.ge-interest-featured__body {
  padding: 20px;
}

.ge-interest-featured__body h3 {
  margin: 0 0 10px;
  font-size: clamp(19px, 3vw, 22px);
  line-height: 1.25;
}

.ge-interest-featured__body p {
  margin: 0 0 14px;
  color: var(--ge-text-soft);
  font-size: 14px;
  line-height: 1.55;
}

.ge-interest-featured__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ge-olive-dark);
  font-size: 13px;
  font-weight: 700;
}

.ge-interest-featured__link i {
  font-size: 11px;
  transition: transform .2s ease;
}

.ge-interest-featured:hover .ge-interest-featured__link i {
  transform: translateX(3px);
}

/* ---- Small cards (row layout on mobile, card layout on desktop —
   see the shared-markup note in the desktop block below) ---- */
.ge-interest-small-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ge-interest-small-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px;
  border: 1px solid var(--ge-border);
  border-radius: 14px;
  background: #fff;
  color: var(--ge-text);
  transition: box-shadow .2s ease, transform .2s ease;
}

.ge-interest-small-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--ge-shadow);
}

.ge-interest-small-card__media {
  flex: 0 0 auto;
  width: 64px;
  height: 64px;
  overflow: hidden;
  border-radius: 10px;
  background: #e9ece4;
}

.ge-interest-small-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ge-interest-small-card__placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #e2e8da, #f4f1e9 55%, #ccd8c2);
}

.ge-interest-small-card__footer {
  display: flex;
  flex: 1;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.ge-interest-small-card__body {
  flex: 1;
  min-width: 0;
}

.ge-interest-small-card__category {
  display: block;
  margin-bottom: 3px;
  color: var(--ge-olive-dark);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.ge-interest-small-card__body h3 {
  margin: 0;
  font-size: 13px;
  line-height: 1.3;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.ge-interest-small-card__arrow {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--ge-surface-soft);
  color: var(--ge-olive-dark);
  font-size: 11px;
}

.ge-interest-articles__actions {
  margin-top: 22px;
}

.ge-interest-articles__button {
  min-width: 230px;
  min-height: 44px;
}

@media (max-width: 480px) {
  .ge-interest-articles__button {
    width: 100%;
  }
}

@media (min-width: 640px) {
  .ge-interest-articles__inner {
    padding-inline: 24px;
  }
}

@media (min-width: 900px) {
  .ge-interest-articles__inner {
    padding-inline: 34px;
  }

  .ge-interest-grid {
    flex-direction: row;
    align-items: stretch;
    gap: 24px;
  }

  .ge-interest-featured {
    display: flex;
    flex-direction: column;
    flex: 0 0 42%;
  }

  .ge-interest-featured__media {
    flex: 1;
    aspect-ratio: auto;
  }

  .ge-interest-small-grid {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }

  /* Same markup as mobile (media, then a footer row with body+arrow) —
     flipping the outer card from a row to a column, with the footer
     row unchanged, turns the mobile list-row layout into the desktop
     "image on top, category/title/button footer" card automatically. */
  .ge-interest-small-card {
    flex-direction: column;
    align-items: stretch;
    padding: 0;
    overflow: hidden;
  }

  .ge-interest-small-card__media {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 10;
    border-radius: 0;
  }

  .ge-interest-small-card__footer {
    padding: 14px;
  }

  .ge-interest-small-card__body h3 {
    font-size: 14px;
  }
}

/* ==========================================================
   Home · Nosotros
   ========================================================== */
.ge-story {
  padding: 30px 0;
  display: block;
}

.ge-story__inner {
  padding-inline: 34px;
}

.ge-story__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  width: 100%;
  min-height: 380px;
  align-items: stretch;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 12px;
  overflow: hidden;
}

.ge-story__image,
.ge-story__content {
  width: 100%;
  min-width: 0;
}

.ge-story__image {
  min-height: 380px;
  border-radius: 0;
  overflow: hidden;
  background: linear-gradient(140deg, #62894a, #dfe8d5);
}

.ge-story__image img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 380px;
  object-fit: cover;
}

.ge-story__placeholder {
  min-height: 380px;
  height: 100%;
}

.ge-story__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  border: 0;
  border-radius: 0;
  padding: 42px;
  background: #fff;
}

.ge-story__content h2 {
  margin: 0 0 16px;
  font-size: 42px;
  line-height: 1.08;
}

.ge-story__text {
  margin: 0 0 22px;
  color: var(--ge-text-soft);
  font-size: 17px;
  line-height: 1.65;
}

.ge-story__text p {
  margin: 0 0 12px;
}

.ge-story__text p:last-child {
  margin-bottom: 0;
}

@media (max-width: 991px) {
  .ge-story__inner {
    padding-inline: 24px;
  }

  .ge-story__grid {
    grid-template-columns: 1fr;
  }

  .ge-story__image,
  .ge-story__image img,
  .ge-story__placeholder {
    min-height: 300px;
  }

  .ge-story__content {
    padding: 32px;
  }
}

@media (max-width: 640px) {
  .ge-story__inner {
    padding-inline: 14px;
  }

  .ge-story__image,
  .ge-story__image img,
  .ge-story__placeholder {
    min-height: 220px;
  }

  .ge-story__content {
    padding: 24px;
  }

  .ge-story__content h2 {
    font-size: 30px;
  }

  .ge-story__text {
    font-size: 16px;
  }
}

/* ==========================================================
   Home · Testimonios
   ========================================================== */
.ge-testimonials {
  padding: 30px 0;
}

.ge-testimonials__inner {
  padding-inline: 34px;
}

.ge-testimonials-carousel {
  --ge-testimonials-visible: 4;
  overflow: hidden;
}

.ge-testimonials-carousel--count-1 {
  --ge-testimonials-visible: 1;
}

.ge-testimonials-carousel--count-2 {
  --ge-testimonials-visible: 2;
}

.ge-testimonials-carousel--count-3 {
  --ge-testimonials-visible: 3;
}

.ge-testimonials-carousel__track {
  display: flex;
  align-items: stretch;
  gap: 16px;
  will-change: transform;
}

.ge-testimonial-card {
  flex: 0 0 calc((100% - (var(--ge-testimonials-visible) - 1) * 16px) / var(--ge-testimonials-visible));
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 14px;
  padding: 22px;
  box-shadow: 0 8px 24px rgba(31, 42, 31, .045);
}

.ge-testimonial-card__person {
  display: flex;
  align-items: center;
  gap: 13px;
}

.ge-testimonial-card__avatar {
  flex: 0 0 58px;
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  background: #dfe9da;
  color: #315d20;
  font-size: 21px;
  font-weight: 700;
  text-transform: uppercase;
}

.ge-testimonial-card__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ge-testimonial-card__identity {
  min-width: 0;
}

.ge-testimonial-card__identity strong {
  display: block;
  color: var(--ge-text);
  font-size: 15px;
  line-height: 1.3;
}

.ge-testimonial-card__identity span {
  display: block;
  margin-top: 3px;
  color: #52763e;
  font-size: 12px;
  line-height: 1.35;
}

.ge-testimonial-card blockquote {
  margin: 0;
}

.ge-testimonial-card blockquote p {
  margin: 0;
  color: #2d342c;
  font-size: 15px;
  line-height: 1.65;
}

.ge-testimonial-card blockquote p::before {
  content: "“";
}

.ge-testimonial-card blockquote p::after {
  content: "”";
}

@media (max-width: 1100px) {
  .ge-testimonials-carousel {
    --ge-testimonials-visible: 3;
  }

  .ge-testimonials-carousel--count-1 {
    --ge-testimonials-visible: 1;
  }

  .ge-testimonials-carousel--count-2 {
    --ge-testimonials-visible: 2;
  }
}

@media (max-width: 991px) {
  .ge-testimonials__inner {
    padding-inline: 24px;
  }
}

@media (max-width: 820px) {
  .ge-testimonials-carousel {
    --ge-testimonials-visible: 2;
  }

  .ge-testimonials-carousel--count-1 {
    --ge-testimonials-visible: 1;
  }
}

@media (max-width: 640px) {
  .ge-testimonials__inner {
    padding-inline: 14px;
  }
}

@media (max-width: 560px) {
  .ge-testimonials-carousel {
    --ge-testimonials-visible: 1;
  }

  .ge-testimonial-card {
    padding: 19px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ge-testimonials-carousel__track {
    transition: none !important;
  }
}

/* ==========================================================
   Home · Puntos de venta
   ========================================================== */
.ge-store-locator {
  padding: 30px 0;
}

.ge-store-locator__grid {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: 16px;
  align-items: stretch;
  padding-inline: 34px;
}

.ge-store-locator__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-left: 22px;
}

.ge-store-locator__copy h2 {
  margin: 0 0 10px;
  font-size: 40px;
  line-height: 1.05;
}

.ge-store-locator__copy p {
  margin: 0 0 18px;
}

.ge-store-filters {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
  margin: 2px 0 10px;
}

.ge-store-filter {
  display: grid;
  gap: 5px;
  width: 100%;
}

.ge-store-filter:first-child {
  grid-column: 1 / -1;
}

.ge-store-filter > span {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #53604d;
}

.ge-store-filter select {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(36, 52, 28, .16);
  border-radius: 8px;
  background: #fff;
  color: var(--ge-text);
  padding: 0 38px 0 12px;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}

.ge-store-filter select:focus {
  outline: 2px solid rgba(72, 104, 49, .22);
  outline-offset: 1px;
  border-color: var(--ge-olive);
}

.ge-store-filter-status {
  min-height: 18px;
  margin: 0 0 13px;
  color: #596253;
  font-size: 12px;
  font-weight: 600;
}

.ge-store-filter-status.is-empty {
  color: #8b4f43;
}

.ge-store-map-wrap {
  position: relative;
  min-width: 0;
  min-height: 300px;
  border-radius: 12px;
  overflow: hidden;
  background: #e9ece3;
  border: 1px solid rgba(36, 52, 28, .12);
}

.ge-store-map {
  width: 100%;
  height: 100%;
  min-height: 300px;
}

.ge-store-map__message {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  text-align: center;
  color: #53604d;
  background: #eef1e8;
  font-weight: 600;
}

.ge-map-info {
  min-width: 190px;
  max-width: 260px;
  font-family: inherit;
  color: #1e2a19;
  line-height: 1.4;
}

.ge-map-info strong {
  display: block;
  font-size: 15px;
  margin-bottom: 4px;
}

.ge-map-info__category {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #567243;
  margin-bottom: 4px;
}

.ge-map-info__phone {
  margin-top: 4px;
}

.ge-map-info a {
  display: inline-block;
  margin-top: 8px;
  color: #3f6b2d;
  font-weight: 700;
  text-decoration: none;
}

@media (max-width: 991px) {
  .ge-store-locator__grid {
    grid-template-columns: 1fr;
    padding-inline: 24px;
  }

  .ge-store-locator__copy,
  .ge-store-map-wrap {
    grid-column: 1 / -1;
  }

  .ge-store-locator__copy {
    padding-left: 22px;
  }

  .ge-store-filters {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .ge-store-filter:first-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 767px) {
  .ge-store-locator__grid {
    padding-inline: 14px;
  }

  .ge-store-locator__copy {
    padding-left: 22px;
  }

  .ge-store-filters {
    grid-template-columns: 1fr;
  }

  .ge-store-filter:first-child {
    grid-column: auto;
  }

  .ge-store-filter-status {
    margin-bottom: 12px;
  }

  .ge-store-map-wrap,
  .ge-store-map {
    min-height: 340px;
  }
}

/* ==========================================================
   Home · Preguntas frecuentes
   ========================================================== */
.ge-faqs {
  padding: 30px 0;
}

.ge-faqs__inner {
  padding-inline: 34px;
}

.ge-faqs__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: start;
}

.faq-item {
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 10px;
  overflow: hidden;
}

.faq-item__button {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: none;
  border: 0;
  padding: 18px 18px;
  text-align: left;
  font-weight: 700;
  font-size: 15px;
  cursor: pointer;
}

.faq-item__plus {
  font-size: 24px;
  line-height: 1;
  color: var(--ge-olive);
}

.faq-item__content {
  max-height: 0;
  overflow: hidden;
  transition: max-height .22s ease, padding .22s ease;
  padding: 0 18px;
}

.faq-item.is-open .faq-item__content {
  max-height: 180px;
  padding: 0 18px 18px;
}

.faq-item__content p {
  margin: 0 0 10px;
  color: var(--ge-text-soft);
  line-height: 1.6;
}

.faq-item__content p:last-child {
  margin-bottom: 0;
}

.faq-item__content ul,
.faq-item__content ol {
  margin: 8px 0 8px 20px;
  padding: 0;
  color: var(--ge-text-soft);
  line-height: 1.6;
}

.faq-item__content li + li {
  margin-top: 4px;
}

.faq-item__content a {
  color: var(--ge-olive);
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 991px) {
  .ge-faqs__inner {
    padding-inline: 24px;
  }
}

@media (max-width: 767px) {
  .ge-faqs__inner {
    padding-inline: 14px;
  }

  .ge-faqs__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .ge-faqs__grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================
   Home · CTA final + footer global de Elementor
   ========================================================== */
.ge-final-cta {
  padding: 0 34px 34px;
  background: var(--ge-bg);
}

.ge-final-cta__outer {
  overflow: hidden;
  border-radius: 12px;
  background: #2a261d;
  color: #fff;
}

.ge-final-cta__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 28px 30px;
}

.ge-final-cta__copy {
  min-width: 0;
}

.ge-final-cta__copy h2 {
  margin: 0 0 7px;
  color: #fff;
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.05;
}

.ge-final-cta__copy p {
  margin: 0;
  color: rgba(255, 255, 255, .82);
  font-size: 16px;
}

.ge-final-cta__actions {
  flex: 0 0 auto;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.ge-final-cta__secondary {
  background: #fff;
  border-color: #fff;
  color: #1f2a1f;
}

.ge-final-cta__secondary:hover {
  background: #f3f0e7;
  border-color: #f3f0e7;
  color: #1f2a1f;
}

/* Elementor's footer location remains inside the site frame. */
.ge-site-frame > .elementor-location-footer {
  width: 100%;
  margin: 0;
}

@media (max-width: 900px) {
  .ge-final-cta {
    padding-left: 24px;
    padding-right: 24px;
  }

  .ge-final-cta__inner {
    align-items: flex-start;
    flex-direction: column;
  }

  .ge-final-cta__actions {
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  .ge-final-cta {
    padding: 0 14px 20px;
  }

  .ge-final-cta__inner {
    padding: 24px 20px;
  }

  .ge-final-cta__actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
  }

  .ge-final-cta__actions .button {
    width: 100%;
    text-align: center;
  }
}

/* ==========================================================
   Global · Site footer
   Rendered on every page via footer.php, not only Inicio.
   ========================================================== */
.ge-site-footer {
  background: #1f1b14;
  color: rgba(245, 241, 232, .82);
  /* Rounded to match .ge-site-frame's rounded top corners (17px is the
     same radius the Top Bar uses against the frame's own 18px). */
  border-radius: 0 0 17px 17px;
  overflow: hidden;
}

/* grid-template-columns is set inline per-request (Greenergy →
   Configuración → Footer → "Ancho de las columnas"), built from only the
   columns actually present — this is just the fallback for the rare case
   the inline style is missing for some reason. */
.ge-site-footer__grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1fr;
  gap: 32px;
  padding: 40px 34px 28px;
}

.ge-site-footer__brand {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}

.ge-site-footer__brand .custom-logo,
.ge-site-footer__logo-image {
  width: var(--ge-footer-logo-width, 150px);
  height: auto;
}

.ge-site-footer .greenergy-text-logo__top {
  color: #fff;
  font-size: 22px;
}

.ge-site-footer .greenergy-text-logo__bottom {
  color: rgba(255, 255, 255, .72);
}

.ge-site-footer__brand p {
  margin: 0;
  max-width: 320px;
  font-size: 14px;
  line-height: 1.6;
}

.ge-site-footer__nav h3,
.ge-site-footer__contact h3 {
  margin: 0 0 14px;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.ge-site-footer__nav-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.ge-site-footer__nav-list a {
  font-size: 14px;
  color: rgba(245, 241, 232, .82);
  transition: color .18s ease;
}

.ge-site-footer__nav-list a:hover {
  color: #fff;
}

.ge-site-footer__contact-list {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
  display: grid;
  gap: 10px;
}

.ge-site-footer__contact-list a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: rgba(245, 241, 232, .82);
  transition: color .18s ease;
}

.ge-site-footer__contact-list a:hover {
  color: #fff;
}

.ge-site-footer__contact-list i {
  width: 15px;
  text-align: center;
  font-size: 13px;
}

.ge-site-footer__socials {
  display: flex;
  gap: 10px;
}

.ge-site-footer__socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  color: #fff;
  font-size: 13px;
  transition: background .18s ease, transform .18s ease;
}

.ge-site-footer__socials a:hover {
  background: var(--ge-olive);
  transform: translateY(-1px);
}

.ge-site-footer__qr {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
}

/* No heading, no background, no card styling here on purpose — this column
   only renders whatever HTML the admin pasted. The only thing enforced is a
   max size so a full-resolution image/SVG doesn't blow out the footer
   layout; anything else about its appearance is up to the pasted HTML. */
.ge-site-footer__qr img,
.ge-site-footer__qr svg,
.ge-site-footer__qr canvas {
  max-width: 110px;
  max-height: 110px;
}

.ge-site-footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 18px 34px;
  border-top: 1px solid rgba(255, 255, 255, .1);
}

.ge-site-footer__copyright {
  margin: 0;
  font-size: 12px;
  color: rgba(245, 241, 232, .6);
}

.ge-site-footer__legal {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
}

.ge-site-footer__legal a {
  font-size: 12px;
  color: rgba(245, 241, 232, .6);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.ge-site-footer__legal a:hover {
  color: #fff;
}

@media (max-width: 900px) {
  /* !important: grid-template-columns is otherwise set inline (higher
     specificity than any non-important stylesheet rule), so these two
     breakpoints need it to still win and stack the columns on mobile. */
  .ge-site-footer__grid {
    grid-template-columns: 1fr 1fr !important;
    padding: 32px 24px 24px;
  }

  .ge-site-footer__brand {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .ge-site-footer {
    /* Matches .ge-site-frame's mobile radius (13px). */
    border-radius: 0 0 12px 12px;
  }

  .ge-site-footer__grid {
    grid-template-columns: 1fr !important;
    gap: 24px;
    padding: 28px 14px 20px;
  }

  .ge-site-footer__brand {
    grid-column: auto;
  }

  .ge-site-footer__qr img,
  .ge-site-footer__qr svg,
  .ge-site-footer__qr canvas {
    max-width: 90px;
    max-height: 90px;
  }

  .ge-site-footer__bottom {
    flex-direction: column;
    align-items: flex-start;
    padding: 16px 14px;
  }
}

/* ==========================================================
   Generic search form (used inside default WP search forms
   that aren't the header/mobile-panel modal versions above)
   ========================================================== */
.search-form {
  display: flex;
}

.search-form label {
  flex: 1;
}

.search-field {
  width: 100%;
}

/* ==========================================================
   WooCommerce · Shop archive shell & header
   ========================================================== */
.woocommerce-archive-shell {
  padding: 34px 0 56px;
}

/* WooCommerce's own default archive layout has no side gutter; give the
   grid the same lateral breathing room every other section on the site
   uses (padding-inline: 34px, stepping down on smaller screens). */
.woocommerce-archive-shell .container {
  padding-inline: 34px;
}

.woocommerce-archive-shell .archive-breadcrumbs {
  margin: 0 0 16px;
  color: #70786c;
  font-size: 12px;
}

.woocommerce-archive-shell .archive-breadcrumbs a {
  color: #596451;
}

.woocommerce-archive-shell .archive-breadcrumbs a:hover {
  color: var(--ge-olive);
}

.woocommerce-archive-header {
  max-width: 720px;
  margin: 0 auto 30px;
  text-align: center;
}

.woocommerce-archive-header .section-kicker {
  display: block;
  margin: 0 0 10px;
  color: var(--ge-olive);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.woocommerce-archive-header .page-title {
  margin: 0 0 10px;
  font-size: clamp(30px, 3.4vw, 44px);
  line-height: 1.08;
}

.woocommerce-archive-header .archive-header__intro {
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.6;
}

.woocommerce-archive-header .archive-header__intro p {
  margin: 0 0 8px;
}

.woocommerce-archive-header .archive-header__intro p:last-child {
  margin-bottom: 0;
}

.woocommerce-result-count {
  margin: 0 0 20px !important;
  color: var(--ge-text-soft) !important;
  font-size: 13px !important;
}

.woocommerce-ordering {
  margin: 0 0 20px !important;
}

.woocommerce-ordering select.orderby {
  min-height: 40px !important;
  padding: 0 14px !important;
  border: 1px solid var(--ge-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--ge-text) !important;
  font: inherit !important;
  font-size: 13px !important;
  cursor: pointer;
}

.woocommerce-ordering select.orderby:focus {
  outline: 2px solid rgba(72, 104, 49, .22);
  outline-offset: 1px;
  border-color: var(--ge-olive) !important;
}

/* ==========================================================
   WooCommerce · Product cards (shop grid, related & upsell)
   ========================================================== */
/* Scoped to the `ul` tag specifically — WooCommerce also puts a "products"
   class on the *wrapping section* of the related/upsell blocks
   (`<section class="related products">`), which isn't the element that
   should ever become a grid: without the `ul` qualifier here, that section
   itself turned into a 4-column grid with the heading and the real product
   list as its only two items, squeezing the list into one 25%-wide track
   instead of the full row. */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

/* WooCommerce's default float-based grid clears itself with a classic
   ::before/::after clearfix. Under display:grid those pseudo-elements
   still generate real boxes and silently steal a grid cell (pushing the
   4th product onto its own row) unless they're suppressed here. */
.woocommerce .products::before,
.woocommerce .products::after {
  content: none !important;
  display: none !important;
}

.woocommerce ul.products li.product {
  display: flex !important;
  flex-direction: column;
  width: auto !important;
  margin: 0 !important;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 12px;
  padding: 16px;
}

.woocommerce span.onsale {
  background: var(--ge-olive) !important;
}

.product-card__image {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  background: #fff;
  overflow: hidden;
}

.product-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 10px;
}

.product-card__image--placeholder {
  background: linear-gradient(180deg, #f7f7f3, #ecece6);
}

.product-card__content {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 6px;
  padding-top: 14px;
}

.product-card__badge {
  align-self: flex-start;
  margin-bottom: 4px;
  padding: 5px 10px;
  border-radius: 999px;
  background: #edf2e7;
  color: var(--ge-olive-dark);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.product-card .woocommerce-loop-product__title {
  /* WooCommerce's own `.woocommerce ul.products li.product .woocommerce-loop-product__title`
     rule outranks a plain 2-class selector, so these need !important. */
  margin: 0 !important;
  padding: 0 !important;
  font-size: 17px !important;
  line-height: 1.28;
}

.product-card .woocommerce-loop-product__title a {
  color: inherit;
  text-decoration: none;
}

.product-card__content > p {
  margin: 0;
  color: var(--ge-text-soft);
  font-size: 13px;
  line-height: 1.5;
}

.product-card .price {
  display: block;
  margin: auto 0 0 !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  color: var(--ge-olive) !important;
  text-align: left;
}

.product-card .price del {
  margin-right: 6px;
  font-size: .6em;
  font-weight: 600;
  color: #8a9085;
  opacity: .8;
}

.product-card .price ins {
  text-decoration: none;
  color: var(--ge-olive) !important;
}

.product-card__footer {
  display: flex;
  gap: 8px;
  /* .product-card__content (the flex column this sits in) already has its
     own `gap: 6px` between every child, so this only needs to add 4px to
     land on an exact 10px gap after the price — not 10px on top of that. */
  margin-top: 4px;
}

/* WooCommerce's default theme sets its own background/color/padding/
   font-size on every `.button` inside `.woocommerce ul.products li.product`
   with higher specificity than a plain class selector, so these need
   !important to win. Both buttons use the site's matcha green with white
   text; the cart button is a shade darker to tell them apart at a glance. */
.woocommerce .product-card__footer .button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-width: 0;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 8px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-align: center;
  white-space: normal;
  box-shadow: none !important;
  text-shadow: none !important;
}

.woocommerce .product-card__footer .product-card__view-button {
  background: var(--ge-olive) !important;
  color: #fff !important;
}

.woocommerce .product-card__footer .product-card__view-button:hover {
  background: var(--ge-olive-dark) !important;
}

.woocommerce .product-card__footer .product-card__cart-button {
  background: var(--ge-olive-dark) !important;
  color: #fff !important;
}

.woocommerce .product-card__footer .product-card__cart-button:hover {
  background: var(--ge-olive) !important;
}

/* This rule's selector needs to be MORE specific than the green
   .product-card__cart-button rule above (both use !important, so
   specificity — not source order — decides the winner), otherwise the
   "already in cart" black state never shows on the shop grid. */
.woocommerce .product-card__footer .product-card__cart-button.is-in-cart {
  background: #111 !important;
  border-color: #111 !important;
  color: #fff !important;
}

.woocommerce .product-card__footer .product-card__cart-button.is-in-cart:hover {
  background: #000 !important;
}

.product-card .button.is-disabled {
  pointer-events: none;
  opacity: .55;
}

/* Once an item is actually in the cart, the button becomes "Ver carrito"
   (see theme.js's `added_to_cart` handler) — black instead of green so it
   reads as a different, confirmed state. Works for both the shop-grid and
   home-featured-products buttons; !important guarantees it wins regardless
   of which button/context it lands on. */
.button.is-in-cart {
  background: #111 !important;
  border-color: #111 !important;
  color: #fff !important;
}

.button.is-in-cart:hover {
  background: #000 !important;
  border-color: #000 !important;
}

/* WooCommerce inserts its own "View cart" link next to the button on a
   successful AJAX add. theme.js removes it and turns the button itself
   into "Ver carrito" instead — this hides it as a safety net for the
   moment before that JS runs (or if it fails to load for any reason),
   since the button already carries the same "already in cart" state on
   the next page load via greenergy_product_is_in_cart(). */
.product-card .added_to_cart,
.ge-product-card .added_to_cart {
  display: none !important;
}

.woocommerce-pagination {
  margin-top: 34px;
}

.woocommerce-pagination ul.page-numbers {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  border: 0 !important;
}

.woocommerce-pagination ul.page-numbers li {
  margin: 0;
}

.woocommerce-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid var(--ge-border);
  border-radius: 8px;
  background: #fff;
  color: var(--ge-text);
  font-size: 13px;
  font-weight: 700;
}

.woocommerce-pagination .page-numbers.current {
  background: var(--ge-olive);
  border-color: var(--ge-olive);
  color: #fff;
}

.woocommerce-pagination a.page-numbers:hover {
  border-color: var(--ge-olive);
  color: var(--ge-olive);
}

@media (max-width: 991px) {
  .woocommerce-archive-shell .container {
    padding-inline: 24px;
  }

  .woocommerce ul.products {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .woocommerce-archive-shell {
    padding: 24px 0 40px;
  }

  .woocommerce-archive-shell .container {
    padding-inline: 14px;
  }

  .woocommerce ul.products {
    grid-template-columns: 1fr;
  }

  .product-card__footer {
    flex-direction: column;
  }
}

/* ==========================================================
   WooCommerce · Empty cart
   ========================================================== */
.ge-cart-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  max-width: 420px;
  margin: 20px auto 40px;
  padding: 48px 24px;
  text-align: center;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 16px;
}

.ge-cart-empty__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin-bottom: 10px;
  border-radius: 50%;
  background: var(--ge-surface-soft);
  color: var(--ge-olive);
}

.ge-cart-empty__icon svg {
  width: 28px;
  height: 28px;
}

.ge-cart-empty__message {
  margin: 0;
  font-size: 20px;
  font-weight: 800;
  color: var(--ge-text);
}

.ge-cart-empty__hint {
  margin: 0 0 14px;
  color: var(--ge-text-soft);
  font-size: 14px;
}

.ge-cart-empty__button {
  min-width: 200px;
}

/* ==========================================================
   WooCommerce · Cart page
   The cart page has no dedicated theme template — it renders through
   page.php's generic .container, so these rules key off the .woocommerce-cart
   body class WooCommerce adds automatically.
   ========================================================== */
.woocommerce-cart .container {
  padding-inline: 34px;
}

.woocommerce-cart .entry-title {
  margin-bottom: 24px;
}

.woocommerce-cart-form {
  margin-bottom: 24px;
}

.woocommerce-cart table.shop_table {
  width: 100%;
  border-collapse: collapse;
  margin: 0;
}

.woocommerce-cart table.shop_table thead th {
  padding: 0 10px 12px;
  border-bottom: 1px solid var(--ge-border);
  text-align: left;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ge-text-soft);
}

.woocommerce-cart table.shop_table td {
  padding: 18px 10px;
  border-bottom: 1px solid var(--ge-border);
  vertical-align: middle;
  font-size: 14px;
}

.woocommerce-cart .product-remove {
  width: 32px;
}

.woocommerce-cart .product-remove a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--ge-surface-soft);
  color: var(--ge-text);
  font-size: 15px;
  line-height: 1;
  text-decoration: none;
}

.woocommerce-cart .product-remove a:hover {
  background: #f1d9d5;
  color: #a63a2a;
}

.woocommerce-cart .product-thumbnail img {
  display: block;
  width: 72px;
  height: 72px;
  object-fit: contain;
  border: 1px solid var(--ge-border);
  border-radius: 8px;
  background: #fff;
}

.woocommerce-cart .product-name a {
  font-weight: 700;
  color: var(--ge-text);
  text-decoration: none;
}

.woocommerce-cart .product-name a:hover {
  color: var(--ge-olive);
}

.woocommerce-cart .product-price,
.woocommerce-cart .product-subtotal {
  font-weight: 700;
  color: var(--ge-text);
  white-space: nowrap;
}

.woocommerce-cart .quantity .qty {
  width: 64px;
  min-height: 40px;
  padding: 0 8px;
  border: 1px solid var(--ge-border);
  border-radius: 8px;
  background: #fff;
  color: var(--ge-text);
  font: inherit;
  font-weight: 700;
  text-align: center;
}

.woocommerce-cart .actions {
  padding-top: 20px !important;
  border-bottom: 0 !important;
}

.woocommerce-cart .actions .coupon {
  display: flex;
  gap: 10px;
  align-items: center;
}

.woocommerce-cart .actions .coupon .input-text {
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--ge-border);
  border-radius: 8px;
  font: inherit;
  font-size: 13px;
}

.woocommerce-cart .actions .coupon button,
.woocommerce-cart .actions > button[name="update_cart"] {
  min-height: 42px;
  padding: 0 18px;
  border: 1px solid var(--ge-olive);
  border-radius: 8px;
  background: #fff;
  color: var(--ge-olive);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.woocommerce-cart .cart-collaterals {
  display: flex;
  justify-content: flex-end;
}

.woocommerce-cart .cart_totals {
  width: 100%;
  max-width: 380px;
  padding: 26px;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 14px;
}

.woocommerce-cart .cart_totals h2 {
  margin: 0 0 16px;
  font-size: 19px;
  line-height: 1.2;
}

.woocommerce-cart .cart_totals table.shop_table {
  margin-bottom: 6px;
}

.woocommerce-cart .cart_totals table.shop_table th,
.woocommerce-cart .cart_totals table.shop_table td {
  padding: 12px 0;
  border-bottom: 1px solid var(--ge-border);
  font-size: 13px;
}

.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td {
  border-bottom: 0;
  font-size: 16px;
  font-weight: 800;
  color: var(--ge-text);
}

.woocommerce-cart .wc-proceed-to-checkout {
  padding-top: 8px;
}

.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  border-radius: 9px;
  background: var(--ge-olive);
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
  transition: .2s ease;
}

.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover {
  background: var(--ge-olive-dark);
}

@media (max-width: 991px) {
  .woocommerce-cart .container {
    padding-inline: 24px;
  }

  .woocommerce-cart .cart-collaterals {
    justify-content: stretch;
  }

  .woocommerce-cart .cart_totals {
    max-width: none;
  }
}

@media (max-width: 782px) {
  .woocommerce-cart table.shop_table thead {
    display: none;
  }

  .woocommerce-cart table.shop_table,
  .woocommerce-cart table.shop_table tbody,
  .woocommerce-cart table.shop_table tr,
  .woocommerce-cart table.shop_table td {
    display: block;
    width: 100%;
  }

  .woocommerce-cart table.shop_table tr {
    position: relative;
    padding: 14px 0;
  }

  .woocommerce-cart table.shop_table td {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 0;
  }

  .woocommerce-cart table.shop_table td.product-remove {
    position: absolute;
    top: 14px;
    right: 0;
    width: auto;
    padding: 0;
  }

  .woocommerce-cart table.shop_table td::before {
    content: attr(data-title);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ge-text-soft);
  }

  .woocommerce-cart table.shop_table td.product-remove::before,
  .woocommerce-cart table.shop_table td.product-thumbnail::before {
    content: none;
  }

  .woocommerce-cart table.shop_table td.product-thumbnail {
    justify-content: flex-start;
    padding-right: 40px;
  }
}

@media (max-width: 640px) {
  .woocommerce-cart .container {
    padding-inline: 14px;
  }
}

/* ==========================================================
   WooCommerce · Single product — Greenergy layout
   ========================================================== */
.woocommerce-single-shell {
  padding: 30px 0 56px;
  background: var(--ge-bg);
}

.ge-single-product-container {
  padding-inline: 34px;
}

.greenergy-single-product {
  display: block;
  min-width: 0;
}

.ge-product-breadcrumbs {
  margin: 0 0 16px;
  color: #70786c;
  font-size: 12px;
}

.ge-product-breadcrumbs a {
  color: #596451;
}

.ge-product-breadcrumbs a:hover {
  color: var(--ge-olive);
}

.ge-product-breadcrumbs .woocommerce-breadcrumb {
  margin: 0;
  padding: 0;
}

.greenergy-product-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  gap: 42px;
  align-items: start;
  padding: 26px;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 16px;
  box-shadow: 0 12px 30px rgba(39, 54, 28, .045);
}

.greenergy-product-hero__gallery {
  min-width: 0;
  position: relative;
}

.greenergy-product-hero__gallery .onsale {
  position: absolute !important;
  z-index: 4;
  top: 14px !important;
  left: 14px !important;
  right: auto !important;
  margin: 0 !important;
  min-width: auto !important;
  min-height: auto !important;
  line-height: 1 !important;
  padding: 8px 11px !important;
  border-radius: 999px !important;
  background: var(--ge-olive) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

.woocommerce div.product .greenergy-product-hero__gallery div.images {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
}

.woocommerce div.product .greenergy-product-hero__gallery .woocommerce-product-gallery__wrapper {
  margin: 0 !important;
}

.woocommerce div.product .greenergy-product-hero__gallery .woocommerce-product-gallery__image {
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-height: 510px;
  background: #f5f5f0;
  border-radius: 12px;
  overflow: hidden;
}

.woocommerce div.product .greenergy-product-hero__gallery .woocommerce-product-gallery__image > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 510px;
}

.woocommerce div.product .greenergy-product-hero__gallery .woocommerce-product-gallery__image img {
  width: 100% !important;
  height: 510px !important;
  object-fit: contain !important;
  padding: 18px;
}

.woocommerce div.product .greenergy-product-hero__gallery .flex-control-thumbs {
  display: flex;
  gap: 10px;
  margin: 12px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
  overflow: auto;
}

.woocommerce div.product .greenergy-product-hero__gallery .flex-control-thumbs li {
  float: none !important;
  width: 76px !important;
  flex: 0 0 76px !important;
  margin: 0 !important;
  border: 1px solid var(--ge-border);
  border-radius: 9px;
  overflow: hidden;
  background: #fff;
}

.woocommerce div.product .greenergy-product-hero__gallery .flex-control-thumbs img {
  width: 100% !important;
  height: 76px !important;
  object-fit: contain !important;
  padding: 5px;
  opacity: .62;
  transition: .2s ease;
}

.woocommerce div.product .greenergy-product-hero__gallery .flex-control-thumbs img.flex-active,
.woocommerce div.product .greenergy-product-hero__gallery .flex-control-thumbs img:hover {
  opacity: 1;
}

.woocommerce div.product .woocommerce-product-gallery__trigger {
  top: 14px !important;
  right: 14px !important;
  width: 42px !important;
  height: 42px !important;
  background: #fff !important;
  border: 1px solid var(--ge-border) !important;
  border-radius: 50% !important;
  box-shadow: 0 5px 18px rgba(0, 0, 0, .06);
}

.greenergy-product-hero__summary {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  min-width: 0;
  padding: 8px 10px 8px 0;
}

.ge-product-eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  margin: 0 0 13px;
  padding: 0 11px;
  border-radius: 999px;
  background: #edf2e7;
  color: var(--ge-olive-dark);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .075em;
  text-transform: uppercase;
}

.greenergy-product-hero__summary .product_title {
  margin: 0 0 12px;
  font-size: clamp(34px, 3.5vw, 52px);
  line-height: 1.03;
  letter-spacing: -.035em;
  color: var(--ge-text);
}

.greenergy-product-hero__subtitle {
  margin: 0 0 18px;
  color: var(--ge-text-soft);
  font-size: 18px;
  line-height: 1.5;
}

.greenergy-product-hero__purchase {
  margin-top: 2px;
}

.greenergy-product-hero__purchase .woocommerce-product-rating {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 13px !important;
  font-size: 12px;
}

.greenergy-product-hero__purchase .star-rating {
  color: #cda840;
}

.greenergy-product-hero__purchase .price {
  display: block;
  margin: 0 0 18px !important;
  color: var(--ge-text) !important;
  font-size: 30px !important;
  line-height: 1.15;
  font-weight: 800;
}

.greenergy-product-hero__purchase .price del {
  font-size: .62em;
  color: #8a9085;
  opacity: .75;
}

.greenergy-product-hero__purchase .price ins {
  text-decoration: none;
  color: var(--ge-olive-dark);
}

.greenergy-product-hero__purchase .woocommerce-product-details__short-description {
  margin: 0 0 20px;
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.65;
}

.greenergy-product-hero__purchase .woocommerce-product-details__short-description p {
  margin: 0 0 10px;
}

.greenergy-product-hero__purchase .woocommerce-product-details__short-description p:last-child {
  margin-bottom: 0;
}

.woocommerce div.product .greenergy-product-hero__purchase form.cart {
  display: flex;
  align-items: stretch;
  gap: 10px;
  margin: 0 0 16px !important;
  padding: 0 !important;
}

.woocommerce div.product .greenergy-product-hero__purchase form.cart .quantity {
  float: none !important;
  margin: 0 !important;
}

.woocommerce div.product .greenergy-product-hero__purchase .quantity .qty {
  width: 74px;
  height: 48px;
  border: 1px solid #cfd5ca;
  border-radius: 9px;
  background: #fff;
  color: var(--ge-text);
  font: inherit;
  font-weight: 700;
  text-align: center;
}

.woocommerce div.product .greenergy-product-hero__purchase .single_add_to_cart_button {
  float: none !important;
  flex: 1;
  min-height: 48px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: var(--ge-olive) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-transform: none !important;
  transition: .2s ease;
}

.woocommerce div.product .greenergy-product-hero__purchase .single_add_to_cart_button:hover {
  background: var(--ge-olive-dark) !important;
  transform: translateY(-1px);
}

.woocommerce div.product .greenergy-product-hero__purchase .single_add_to_cart_button.disabled {
  opacity: .55;
}

.woocommerce div.product .greenergy-product-hero__purchase form.variations_form {
  display: block;
  margin-bottom: 18px !important;
}

.woocommerce div.product .greenergy-product-hero__purchase table.variations {
  width: 100%;
  margin: 0 0 12px;
  border-collapse: separate;
  border-spacing: 0 8px;
}

.woocommerce div.product .greenergy-product-hero__purchase table.variations th,
.woocommerce div.product .greenergy-product-hero__purchase table.variations td {
  display: block;
  width: 100%;
  padding: 0;
  text-align: left;
}

.woocommerce div.product .greenergy-product-hero__purchase table.variations label {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #596451;
}

.woocommerce div.product .greenergy-product-hero__purchase table.variations select {
  width: 100%;
  min-height: 46px;
  margin-top: 6px;
  padding: 0 12px;
  border: 1px solid #cfd5ca;
  border-radius: 9px;
  background: #fff;
  font: inherit;
}

.woocommerce div.product .greenergy-product-hero__purchase .reset_variations {
  display: inline-block;
  margin-top: 6px;
  color: var(--ge-olive);
  font-size: 12px;
  font-weight: 700;
}

.woocommerce div.product .greenergy-product-hero__purchase .stock {
  margin: 0 0 12px;
  color: var(--ge-olive-dark);
  font-weight: 700;
}

.ge-product-confidence {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 4px 0 16px;
  padding: 13px;
  border-radius: 10px;
  background: #f4f5ef;
}

.ge-product-confidence__item {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  color: #53604d;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
}

.ge-product-confidence__icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #dbe7cf;
  color: var(--ge-olive-dark);
  font-size: 11px;
  font-weight: 900;
}

.greenergy-product-signals {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.greenergy-signal-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 13px 14px;
  border: 1px solid var(--ge-border);
  border-radius: 10px;
  background: #fff;
}

.greenergy-signal-card__label {
  color: #70786c;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.greenergy-signal-card strong {
  font-size: 14px;
  line-height: 1.25;
  color: var(--ge-text);
}

.greenergy-product-details {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 24px;
}

.greenergy-detail-card {
  position: relative;
  min-width: 0;
  padding: 24px;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 12px;
}

.ge-product-detail-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin: 0 0 14px;
  border-radius: 10px;
  background: #edf2e7;
  color: var(--ge-olive-dark);
  font-size: 17px;
  font-weight: 900;
}

.greenergy-detail-card .section-kicker {
  margin: 0 0 7px;
  color: var(--ge-olive);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.greenergy-detail-card h2 {
  margin: 0 0 14px;
  font-size: 20px;
  line-height: 1.15;
}

.greenergy-detail-card ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  color: var(--ge-text-soft);
}

.greenergy-detail-card li {
  position: relative;
  padding-left: 20px;
  font-size: 14px;
}

.greenergy-detail-card li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--ge-olive);
  font-weight: 900;
}

.greenergy-detail-card__text {
  color: var(--ge-text-soft);
  font-size: 14px;
  line-height: 1.6;
}

.greenergy-detail-card__text p {
  margin: 0 0 9px;
}

.greenergy-detail-card__text p:last-child {
  margin-bottom: 0;
}

.greenergy-product-faq {
  margin-top: 28px;
  padding: 26px;
  background: #eeece5;
  border-radius: 12px;
}

.ge-product-section-heading {
  text-align: center;
  margin: 0 auto 20px;
  max-width: 620px;
}

.ge-product-section-heading .section-kicker {
  margin: 0 0 6px;
  color: var(--ge-olive);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.ge-product-section-heading h2 {
  margin: 0;
  font-size: 32px;
  line-height: 1.08;
}

.ge-product-faq-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  align-items: start;
}

.greenergy-product-after-summary {
  margin-top: 28px;
}

.woocommerce div.product .woocommerce-tabs {
  margin: 0 0 30px;
  padding: 25px;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 12px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
  display: flex;
  gap: 22px;
  margin: 0 0 22px !important;
  padding: 0 !important;
  border-bottom: 1px solid var(--ge-border);
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
  display: none !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  border-radius: 0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  display: block !important;
  padding: 0 0 12px !important;
  color: #6b7466 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--ge-olive-dark) !important;
  border-bottom: 2px solid var(--ge-olive);
}

.woocommerce div.product .woocommerce-tabs .panel {
  margin: 0 !important;
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.7;
}

.woocommerce div.product .woocommerce-tabs .panel h2 {
  margin: 0 0 15px;
  color: var(--ge-text);
  font-size: 25px;
}

.woocommerce div.product .woocommerce-tabs .panel p {
  margin: 0 0 12px;
}

.greenergy-product-after-summary .related.products,
.greenergy-product-after-summary .upsells.products {
  margin-top: 34px;
}

.greenergy-product-after-summary .related.products > h2,
.greenergy-product-after-summary .upsells.products > h2 {
  margin: 0 0 20px;
  text-align: center;
  font-size: 34px;
  line-height: 1.08;
}

.greenergy-product-after-summary ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.greenergy-product-after-summary ul.products li.product {
  display: flex !important;
  flex-direction: column !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid var(--ge-border) !important;
  border-radius: 12px !important;
  background: #fff !important;
}

.greenergy-product-after-summary .product-card__image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 210px;
  background: #fff;
  overflow: hidden;
}

/* Related/upsell cards only show title, price and buttons — no description. */
.greenergy-product-after-summary .product-card__content > p {
  display: none;
}

.greenergy-product-after-summary .product-card__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 10px;
}

.greenergy-product-after-summary .product-card__content {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 16px;
}

.greenergy-product-after-summary .product-card__badge {
  align-self: flex-start;
  margin-bottom: 8px;
  padding: 5px 8px;
  border-radius: 999px;
  background: #edf2e7;
  color: var(--ge-olive-dark);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.greenergy-product-after-summary .woocommerce-loop-product__title {
  margin: 0 0 8px !important;
  padding: 0 !important;
  font-size: 17px !important;
  line-height: 1.25 !important;
}

.greenergy-product-after-summary .product-card__content > p {
  margin: 0 0 12px;
  color: var(--ge-text-soft);
  font-size: 12px;
  line-height: 1.45;
}

.greenergy-product-after-summary .product-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  /* Same 6px flex `gap` from .product-card__content applies here too (it's
     only set once, on the base rule, and this override doesn't touch that
     property) — 4px here lands on an exact 10px gap after the price. */
  margin-top: 4px;
}

.greenergy-product-after-summary .product-card__footer .price {
  font-size: 14px !important;
  font-weight: 800 !important;
  color: var(--ge-text) !important;
}

.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error {
  margin: 0 0 18px !important;
  padding: 14px 18px 14px 42px !important;
  border: 1px solid var(--ge-border) !important;
  border-top: 0 !important;
  border-radius: 10px !important;
  background: #fff !important;
  color: var(--ge-text) !important;
}

.woocommerce .woocommerce-message::before,
.woocommerce .woocommerce-info::before {
  color: var(--ge-olive) !important;
}

@media (max-width: 991px) {
  .ge-single-product-container {
    padding-inline: 24px;
  }

  .greenergy-product-hero {
    grid-template-columns: 1fr;
    gap: 26px;
    padding: 22px;
  }

  .woocommerce div.product .greenergy-product-hero__gallery .woocommerce-product-gallery__image,
  .woocommerce div.product .greenergy-product-hero__gallery .woocommerce-product-gallery__image > a {
    min-height: 420px;
  }

  .woocommerce div.product .greenergy-product-hero__gallery .woocommerce-product-gallery__image img {
    height: 420px !important;
  }

  .greenergy-product-hero__summary {
    padding: 0;
  }

  .greenergy-product-details {
    grid-template-columns: 1fr 1fr;
  }

  .greenergy-product-details .greenergy-detail-card:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }

  .greenergy-product-after-summary ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 640px) {
  .woocommerce-single-shell {
    padding: 18px 0 36px;
  }

  .ge-single-product-container {
    padding-inline: 14px;
  }

  .ge-product-breadcrumbs {
    margin-bottom: 10px;
  }

  .greenergy-product-hero {
    gap: 20px;
    padding: 14px;
    border-radius: 12px;
  }

  .woocommerce div.product .greenergy-product-hero__gallery .woocommerce-product-gallery__image,
  .woocommerce div.product .greenergy-product-hero__gallery .woocommerce-product-gallery__image > a {
    min-height: 310px;
  }

  .woocommerce div.product .greenergy-product-hero__gallery .woocommerce-product-gallery__image img {
    height: 310px !important;
    padding: 10px;
  }

  .woocommerce div.product .greenergy-product-hero__gallery .flex-control-thumbs li {
    width: 62px !important;
    flex-basis: 62px !important;
  }

  .woocommerce div.product .greenergy-product-hero__gallery .flex-control-thumbs img {
    height: 62px !important;
  }

  .greenergy-product-hero__summary .product_title {
    font-size: 32px;
  }

  .greenergy-product-hero__subtitle {
    font-size: 16px;
  }

  .greenergy-product-hero__purchase .price {
    font-size: 26px !important;
  }

  .woocommerce div.product .greenergy-product-hero__purchase form.cart {
    display: grid;
    grid-template-columns: 78px 1fr;
  }

  .ge-product-confidence {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .greenergy-product-signals {
    grid-template-columns: 1fr 1fr;
  }

  .greenergy-product-details {
    grid-template-columns: 1fr;
  }

  .greenergy-product-details .greenergy-detail-card:last-child:nth-child(odd) {
    grid-column: auto;
  }

  .greenergy-product-faq {
    padding: 20px 14px;
  }

  .ge-product-section-heading h2 {
    font-size: 27px;
  }

  .ge-product-faq-list {
    grid-template-columns: 1fr;
  }

  .woocommerce div.product .woocommerce-tabs {
    padding: 18px 14px;
  }

  .woocommerce div.product .woocommerce-tabs ul.tabs {
    gap: 14px;
    overflow: auto;
    white-space: nowrap;
  }

  .woocommerce div.product .woocommerce-tabs ul.tabs li a {
    font-size: 12px !important;
  }

  .greenergy-product-after-summary .related.products > h2,
  .greenergy-product-after-summary .upsells.products > h2 {
    font-size: 28px;
  }

  .greenergy-product-after-summary ul.products {
    grid-template-columns: 1fr !important;
  }

  .greenergy-product-after-summary .product-card__image {
    height: 190px;
  }
}

/* ==========================================================
   WooCommerce · Cart & Checkout blocks
   /carrito/ and /finalizar-compra/ both render the WooCommerce
   Cart/Checkout *blocks* (a React app talking to the Store API), not the
   classic shortcode templates — their markup uses the wc-block-* namespace
   instead of .woocommerce-cart-form / #order_review. Confirmed live by
   inspecting the actual DOM on both pages.
   ========================================================== */
.woocommerce-cart .container,
.woocommerce-checkout .container {
  padding-inline: 34px;
}

.wc-block-cart,
.wc-block-checkout {
  margin-top: 6px;
}

/* WooCommerce's own checkout.css sets `display:flex; flex-wrap:wrap` on this
   same selector with equal specificity, and it loads after main.css, so it
   wins the tie and the two columns wrap onto separate lines. !important
   forces the grid layout to actually win. */
.wc-block-components-sidebar-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr);
  gap: 32px;
  align-items: start;
}

.wc-block-components-main {
  /* checkout.css also leaves `width: 65%`/`35%` on these two (sized for its
     own flex layout), which — inside a grid item — resolves against the
     item's own track instead of the full row, shrinking each column to a
     fraction of the space the grid already gave it. !important restores
     the normal grid stretch-to-fill behavior. */
  width: auto !important;
  min-width: 0;
}

.wc-block-components-sidebar {
  width: auto !important;
  min-width: 0;
  padding: 22px;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 12px;
}

/* Step / section headings */
.wc-block-components-checkout-step {
  margin-bottom: 26px;
  padding-bottom: 26px;
  border-bottom: 1px solid var(--ge-border);
}

.wc-block-components-checkout-step:last-of-type {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

.wc-block-components-checkout-step__title,
.wc-block-components-title,
.wc-block-cart__totals-title,
.wc-block-components-checkout-order-summary__title-text {
  margin: 0 0 16px;
  font-size: 18px;
  font-weight: 800;
  color: var(--ge-text);
}

.wc-block-components-checkout-order-summary__title {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Text inputs & selects */
.wc-block-components-text-input input {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid var(--ge-border);
  border-radius: 9px;
  background: #fff;
  color: var(--ge-text);
  font: inherit;
  font-size: 14px;
}

.wc-block-components-text-input input:focus {
  outline: 2px solid rgba(72, 104, 49, .22);
  outline-offset: 1px;
  border-color: var(--ge-olive);
}

.wc-block-components-text-input label {
  color: var(--ge-text-soft);
}

.wc-block-components-text-input:focus-within label {
  color: var(--ge-olive-dark);
}

.wc-blocks-components-select__select {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid var(--ge-border);
  border-radius: 9px;
  background: #fff;
  color: var(--ge-text);
  font: inherit;
  font-size: 14px;
}

.wc-blocks-components-select__select:focus {
  outline: 2px solid rgba(72, 104, 49, .22);
  outline-offset: 1px;
  border-color: var(--ge-olive);
}

.wc-blocks-components-select__label {
  color: var(--ge-text-soft);
}

/* Checkboxes */
.wc-block-components-checkbox input[type="checkbox"] {
  accent-color: var(--ge-olive);
}

/* Buttons */
.wc-block-components-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  border-radius: 9px;
  border: 0;
  background: var(--ge-olive);
  color: #fff;
  font-weight: 700;
  font-size: 14px;
  transition: .2s ease;
}

.wc-block-components-button:hover {
  background: var(--ge-olive-dark);
  transform: translateY(-1px);
}

.wc-block-components-button.is-link {
  min-height: auto;
  padding: 0;
  background: transparent;
  color: var(--ge-olive);
  font-size: 13px;
  transform: none !important;
}

.wc-block-components-button.is-link:hover {
  background: transparent;
  color: var(--ge-olive-dark);
  text-decoration: underline;
}

.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
  width: 100%;
  min-height: 52px !important;
  font-size: 15px;
}

/* Order summary items (cart page rows + checkout sidebar list) */
.wc-block-components-order-summary-item {
  display: flex;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid var(--ge-border);
}

.wc-block-components-order-summary-item:last-child {
  border-bottom: 0;
}

.wc-block-components-order-summary-item__image {
  position: relative;
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  border-radius: 8px;
  overflow: hidden;
  background: #f5f5f0;
}

.wc-block-components-order-summary-item__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.wc-block-components-order-summary-item__quantity {
  position: absolute;
  top: -6px;
  right: -6px;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--ge-olive);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
}

.wc-block-components-product-name {
  font-weight: 700;
  color: var(--ge-text);
  font-size: 13px;
}

.wc-block-components-product-metadata__description,
.wc-block-components-order-summary-item__individual-price {
  color: var(--ge-text-soft);
  font-size: 12px;
}

.wc-block-components-order-summary-item__total-price {
  font-weight: 700;
  color: var(--ge-text);
  white-space: nowrap;
}

/* Totals rows */
.wc-block-components-totals-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
  font-size: 14px;
}

.wc-block-components-totals-item__label {
  color: var(--ge-text-soft);
}

.wc-block-components-totals-item__value {
  font-weight: 700;
  color: var(--ge-text);
}

.wc-block-components-totals-footer-item {
  margin-top: 6px;
  padding-top: 14px;
  border-top: 1px solid var(--ge-border);
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  font-size: 17px;
  font-weight: 800;
  color: var(--ge-text);
}

/* Coupon panel toggle */
.wc-block-components-panel {
  margin: 4px 0 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--ge-border);
}

.wc-block-components-panel__button {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--ge-olive);
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
}

.wc-block-components-panel__button-icon {
  fill: currentColor;
}

/* Notices */
.wc-block-components-notice-banner {
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid var(--ge-border);
  background: #fff;
  font-size: 13px;
  line-height: 1.5;
}

.wc-block-components-notice-banner.is-error {
  border-color: rgba(139, 79, 67, .3);
  background: #fdf2f0;
  color: #8b4f43;
}

.wc-block-components-notice-banner.is-info,
.wc-block-components-notice-banner.is-success {
  border-color: rgba(72, 104, 49, .25);
  background: #f3f6ee;
  color: var(--ge-olive-dark);
}

/* ==========================================================
   Cart block — items table
   ========================================================== */
.wc-block-cart-items {
  width: 100%;
  border-collapse: collapse;
}

.wc-block-cart-items__header th {
  padding: 0 0 12px;
  border-bottom: 1px solid var(--ge-border);
  text-align: left;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ge-text-soft);
}

.wc-block-cart-items__row td {
  padding: 20px 10px 20px 0;
  border-bottom: 1px solid var(--ge-border);
  vertical-align: top;
}

.wc-block-cart-item__image img {
  width: 76px;
  height: 76px;
  object-fit: contain;
  border: 1px solid var(--ge-border);
  border-radius: 8px;
  background: #fff;
}

.wc-block-cart-item__product .wc-block-components-product-name {
  font-size: 15px;
}

.wc-block-components-quantity-selector {
  display: inline-flex;
  align-items: stretch;
  border: 1px solid var(--ge-border);
  border-radius: 8px;
  overflow: hidden;
  margin-top: 10px;
}

.wc-block-components-quantity-selector__button {
  width: 34px;
  border: 0;
  background: #fff;
  color: var(--ge-text);
  font-size: 16px;
  cursor: pointer;
}

.wc-block-components-quantity-selector__button:hover {
  background: var(--ge-surface-soft);
}

.wc-block-components-quantity-selector__input {
  width: 40px;
  border: 0;
  border-left: 1px solid var(--ge-border);
  border-right: 1px solid var(--ge-border);
  text-align: center;
  font: inherit;
  font-weight: 700;
}

.wc-block-cart-item__remove-link {
  display: inline-block;
  margin-top: 8px;
  color: #8b4f43;
  font-size: 12px;
  font-weight: 700;
  background: none;
  border: 0;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ==========================================================
   Checkout block — address form & actions
   ========================================================== */
.wc-block-components-address-form .wc-block-components-text-input,
.wc-block-components-address-form .wc-blocks-components-select {
  margin-bottom: 14px;
}

.wc-block-checkout__terms {
  margin: 20px 0;
  font-size: 13px;
  color: var(--ge-text-soft);
}

.wc-block-checkout__actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 20px;
}

/* The real class WooCommerce renders is
   .wc-block-components-checkout-return-to-cart-button (confirmed live) —
   an outline/ghost style so it doesn't compete with the green "Realizar el
   pedido" button next to it. */
/* Setting min-height directly on this specific button proved unreliable
   (confirmed live: even an inline !important style was silently ignored on
   this exact element, for reasons that didn't reproduce on any other
   element tested — some quirk of this one React-rendered node). Matching
   it to the green button's height via flex stretch on their shared row
   sidesteps that entirely and is more robust anyway, since it always
   matches whatever height the other button ends up with. */
.wc-block-checkout__actions_row {
  align-items: stretch !important;
}

.wc-block-components-checkout-return-to-cart-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 28px !important;
  white-space: nowrap;
  border: 1px solid var(--ge-border);
  border-radius: 9px;
  background: transparent;
  color: var(--ge-text);
  font-weight: 700;
  font-size: 14px;
  transition: .2s ease;
}

.wc-block-components-checkout-return-to-cart-button svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

.wc-block-components-checkout-return-to-cart-button:hover {
  border-color: var(--ge-olive);
  color: var(--ge-olive-dark);
  background: var(--ge-surface-soft);
}

@media (max-width: 991px) {
  .woocommerce-cart .container,
  .woocommerce-checkout .container {
    padding-inline: 24px;
  }

  .wc-block-components-sidebar-layout {
    grid-template-columns: 1fr;
  }

  .wc-block-components-sidebar {
    order: -1;
  }
}

@media (max-width: 640px) {
  .woocommerce-cart .container,
  .woocommerce-checkout .container {
    padding-inline: 14px;
  }

  .wc-block-components-sidebar {
    padding: 18px;
  }

  .wc-block-cart-items__header {
    display: none;
  }

  .wc-block-cart-item__image img {
    width: 60px;
    height: 60px;
  }
}

/* ==========================================================
   Notas — masonry grid (page-templates/notas.php)
   ========================================================== */
.ge-notes-hero {
  padding: 44px 0 20px;
  text-align: center;
}

/* Same lateral breathing room every other content section on the site
   uses (padding-inline: 34px, stepping down on smaller screens) — the
   bare .ge-shell alone only gives a tight 16px edge inset. */
.ge-notes-hero .ge-shell,
.ge-notes .ge-shell {
  padding-inline: 34px;
}

.ge-notes-hero .ge-kicker {
  display: block;
}

.ge-notes-hero h1 {
  margin: 0 0 10px;
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.05;
}

.ge-notes-hero__intro {
  max-width: 620px;
  margin: 0 auto;
  color: var(--ge-text-soft);
  font-size: 16px;
  line-height: 1.6;
}

.ge-notes {
  padding: 10px 0 60px;
}

.ge-notes-toolbar {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 24px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--ge-border);
}

.ge-notes-toolbar__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.ge-notes-search {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1 1 260px;
  max-width: 380px;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid var(--ge-border);
  border-radius: 999px;
  background: #fff;
  color: var(--ge-text-soft);
  transition: border-color .18s ease;
}

.ge-notes-search:focus-within {
  border-color: var(--ge-olive);
  color: var(--ge-text);
}

.ge-notes-search svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

.ge-notes-search input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 14px;
  color: inherit;
}

.ge-notes-search input:focus {
  outline: none;
}

.ge-notes-sort-field select {
  min-height: 44px;
  padding: 0 36px 0 16px;
  border: 1px solid var(--ge-border);
  border-radius: 999px;
  background: #fff;
  color: var(--ge-text);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.ge-notes-sort-field select:focus {
  outline: 2px solid rgba(72, 104, 49, .22);
  outline-offset: 1px;
  border-color: var(--ge-olive);
}

.ge-notes-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ge-notes-pill {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 16px;
  border: 1px solid var(--ge-border);
  border-radius: 999px;
  background: #fff;
  color: var(--ge-text-soft);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: .18s ease;
  transition-property: background, border-color, color;
}

.ge-notes-pill:hover {
  border-color: var(--ge-olive);
  color: var(--ge-olive-dark);
}

.ge-notes-pill.is-active,
.ge-notes-pill[aria-pressed="true"] {
  background: var(--ge-olive);
  border-color: var(--ge-olive);
  color: #fff;
}

.ge-notes-pills--tags .ge-notes-pill {
  font-weight: 600;
  font-size: 12px;
  min-height: 32px;
}

.ge-notes-status {
  margin: 0 0 18px;
  color: var(--ge-text-soft);
  font-size: 13px;
  font-weight: 600;
}

/* True masonry: equal-width columns, natural variable height per card —
   no JS measurement needed. The "size" a note is given only changes its
   image aspect ratio and how much text shows, which is what creates the
   staggered look. */
.ge-notes-grid {
  column-count: 4;
  column-gap: 24px;
}

@media (max-width: 1180px) {
  .ge-notes-grid {
    column-count: 3;
  }
}

@media (max-width: 900px) {
  .ge-notes-grid {
    column-count: 2;
  }

  .ge-notes-hero .ge-shell,
  .ge-notes .ge-shell {
    padding-inline: 24px;
  }
}

@media (max-width: 767px) {
  .ge-notes-grid {
    column-count: 1;
  }
}

@media (max-width: 640px) {
  .ge-notes-hero .ge-shell,
  .ge-notes .ge-shell {
    padding-inline: 14px;
  }
}

.ge-note-card {
  display: block;
  break-inside: avoid;
  margin-bottom: 24px;
  background: #fff;
  border: 1px solid var(--ge-border);
  border-radius: 14px;
  overflow: hidden;
  transition: box-shadow .2s ease, transform .2s ease;
}

.ge-note-card:hover {
  box-shadow: var(--ge-shadow);
  transform: translateY(-2px);
}

.ge-note-card__media {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  background: #e9ece4;
}

.ge-note-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.ge-note-card:hover .ge-note-card__media img {
  transform: scale(1.03);
}

.ge-note-card__placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #e2e8da, #f4f1e9 55%, #ccd8c2);
}

.ge-note-card--small .ge-note-card__media {
  aspect-ratio: 1 / 1;
}

.ge-note-card--medium .ge-note-card__media {
  aspect-ratio: 4 / 3;
}

.ge-note-card--large .ge-note-card__media {
  aspect-ratio: 3 / 4;
}

.ge-note-card__category {
  position: absolute;
  left: 12px;
  bottom: 12px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 3px 12px rgba(0, 0, 0, .08);
  color: var(--ge-olive-dark);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  line-height: 1;
  text-transform: uppercase;
}

.ge-note-card__body {
  padding: 16px 16px 18px;
}

.ge-note-card__title {
  margin: 0 0 8px;
  font-size: 17px;
  line-height: 1.3;
}

.ge-note-card--large .ge-note-card__title {
  font-size: 22px;
}

.ge-note-card__title a {
  color: var(--ge-text);
  text-decoration: none;
}

.ge-note-card__title a:hover {
  color: var(--ge-olive-dark);
}

.ge-note-card__excerpt {
  margin: 0 0 12px;
  color: var(--ge-text-soft);
  font-size: 13px;
  line-height: 1.55;
}

.ge-note-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  color: #70786c;
  font-size: 11px;
  font-weight: 600;
}

.ge-note-card__views {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.ge-note-card__views svg {
  width: 13px;
  height: 13px;
}

.ge-notes-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  max-width: 360px;
  margin: 40px auto;
  padding: 40px 24px;
  text-align: center;
  color: var(--ge-text-soft);
}

.ge-notes-empty__icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--ge-surface-soft);
  color: var(--ge-olive);
}

.ge-notes-empty__icon svg {
  width: 26px;
  height: 26px;
}

.ge-notes-empty p {
  margin: 0;
}

.ge-notes-load-more-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 12px;
}

.ge-notes-load-more-wrap .button {
  min-width: 220px;
}

/* .button's own `display: inline-flex` (main.css line ~86) has no
   !important, but author CSS always wins over the UA stylesheet's
   `[hidden] { display: none }` regardless of specificity — so setting
   the button's `hidden` property in JS was silently doing nothing
   visually. Force it back to actually hiding. */
.ge-notes-load-more-wrap .button[hidden] {
  display: none !important;
}

.ge-notes-spinner {
  width: 20px;
  height: 20px;
  border: 2.5px solid var(--ge-border);
  border-top-color: var(--ge-olive);
  border-radius: 50%;
  animation: ge-notes-spin .7s linear infinite;
}

@keyframes ge-notes-spin {
  to {
    transform: rotate(360deg);
  }
}

.ge-notes-grid.is-loading {
  opacity: .5;
  pointer-events: none;
  transition: opacity .2s ease;
}

@media (prefers-reduced-motion: reduce) {
  .ge-note-card,
  .ge-note-card__media img,
  .ge-notes-grid,
  .ge-notes-spinner {
    transition: none !important;
    animation: none !important;
  }
}

/* ==========================================================
   Nota individual (single.php) — reading view: meta header, cover
   image, two-column body (article + "Más leídas" sidebar), share row.
   ========================================================== */

.ge-note-hero__shell,
.ge-note-cover__shell,
.ge-note-body__shell {
  padding-inline: 34px;
}

@media (max-width: 900px) {
  .ge-note-hero__shell,
  .ge-note-cover__shell,
  .ge-note-body__shell {
    padding-inline: 24px;
  }
}

@media (max-width: 640px) {
  .ge-note-hero__shell,
  .ge-note-cover__shell,
  .ge-note-body__shell {
    padding-inline: 14px;
  }
}

.ge-note-hero {
  padding: 32px 0 24px;
}

.ge-note-hero__back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 20px;
  color: var(--ge-text-soft);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: color .18s ease;
}

.ge-note-hero__back svg {
  width: 15px;
  height: 15px;
}

.ge-note-hero__back:hover {
  color: var(--ge-olive-dark);
}

.ge-note-hero__title {
  max-width: 900px;
  margin: 0 0 18px;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.12;
}

.ge-note-hero__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--ge-border);
  color: var(--ge-text-soft);
  font-size: 13px;
  font-weight: 600;
}

.ge-note-hero__author {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ge-text);
  font-weight: 700;
}

.ge-note-hero__avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
}

.ge-note-hero__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.ge-note-hero__meta-item svg {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  color: var(--ge-olive);
}

.ge-note-cover {
  padding-bottom: 8px;
}

.ge-note-cover__img {
  display: block;
  width: 100%;
  max-height: 520px;
  object-fit: cover;
  border-radius: var(--ge-radius);
}

.ge-note-body {
  padding: 28px 0 64px;
}

.ge-note-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 56px;
  align-items: start;
}

@media (max-width: 900px) {
  .ge-note-layout {
    grid-template-columns: 1fr;
    gap: 36px;
  }
}

/* Article typography */
.ge-note-content {
  color: var(--ge-text);
  font-size: 16.5px;
  line-height: 1.8;
}

.ge-note-content > *:first-child {
  margin-top: 0;
}

.ge-note-content p {
  margin: 0 0 20px;
}

.ge-note-content h2,
.ge-note-content h3,
.ge-note-content h4 {
  margin: 36px 0 14px;
  line-height: 1.25;
}

.ge-note-content h2 {
  font-size: 26px;
}

.ge-note-content h3 {
  font-size: 21px;
}

.ge-note-content h4 {
  font-size: 18px;
}

.ge-note-content ul,
.ge-note-content ol {
  margin: 0 0 20px;
  padding-left: 22px;
}

.ge-note-content li {
  margin-bottom: 8px;
}

.ge-note-content a {
  color: var(--ge-olive-dark);
  text-decoration: underline;
  text-decoration-color: rgba(72, 104, 49, .35);
  text-underline-offset: 2px;
}

.ge-note-content a:hover {
  text-decoration-color: currentColor;
}

.ge-note-content img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 8px 0 24px;
  border-radius: 14px;
}

.ge-note-content blockquote {
  margin: 24px 0;
  padding: 4px 0 4px 20px;
  border-left: 3px solid var(--ge-olive);
  color: var(--ge-text-soft);
  font-size: 17px;
  font-style: italic;
}

.ge-note-content figcaption {
  margin-top: -14px;
  margin-bottom: 24px;
  color: var(--ge-text-soft);
  font-size: 13px;
  text-align: center;
}

.ge-note-share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin-top: 40px;
  padding-top: 24px;
  border-top: 1px solid var(--ge-border);
}

.ge-note-share__label {
  color: var(--ge-text-soft);
  font-size: 13px;
  font-weight: 700;
}

.ge-note-share__list {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ge-note-share__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border: 1px solid var(--ge-border);
  border-radius: 50%;
  background: #fff;
  color: var(--ge-text-soft);
  font-size: 14px;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}

.ge-note-share__link:hover {
  background: var(--ge-olive);
  border-color: var(--ge-olive);
  color: #fff;
  transform: translateY(-1px);
}

.ge-note-share__copy-tip {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--ge-text);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}

.ge-note-share__copy.is-copied .ge-note-share__copy-tip {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* Sidebar */
.ge-note-sidebar {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.ge-note-widget {
  padding: 22px;
  border: 1px solid var(--ge-border);
  border-radius: var(--ge-radius-sm);
  background: #fff;
}

.ge-note-widget__title {
  margin: 0 0 16px;
  font-size: 16px;
}

.ge-note-widget__list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ge-note-widget__link {
  display: flex;
  align-items: center;
  gap: 12px;
  color: inherit;
  text-decoration: none;
}

.ge-note-widget__thumb {
  flex: 0 0 auto;
  display: block;
  width: 60px;
  height: 60px;
  overflow: hidden;
  border-radius: 10px;
  background: #e9ece4;
}

.ge-note-widget__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ge-note-widget__placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #e2e8da, #f4f1e9 55%, #ccd8c2);
}

.ge-note-widget__body {
  min-width: 0;
}

.ge-note-widget__item-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 6px;
  color: var(--ge-text);
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.35;
  transition: color .18s ease;
}

.ge-note-widget__link:hover .ge-note-widget__item-title {
  color: var(--ge-olive-dark);
}

.ge-note-widget__item-meta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #70786c;
  font-size: 11px;
  font-weight: 600;
}

.ge-note-widget__item-meta svg {
  width: 12px;
  height: 12px;
}

.ge-note-widget-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border: 1px solid var(--ge-border);
  border-radius: var(--ge-radius-sm);
  background: var(--ge-olive-soft);
  color: var(--ge-olive-dark);
  font-size: 13.5px;
  font-weight: 700;
  text-decoration: none;
  transition: background .18s ease;
}

.ge-note-widget-cta svg {
  width: 16px;
  height: 16px;
}

.ge-note-widget-cta:hover {
  background: var(--ge-olive);
  color: #fff;
}

@media (max-width: 900px) {
  .ge-note-sidebar {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .ge-note-widget {
    flex: 1 1 100%;
  }

  .ge-note-widget-cta {
    flex: 1 1 100%;
  }
}

/* ==========================================================
   Nosotros (page-templates/nosotros.php) — mobile-first: base rules
   below are the stacked mobile layout, min-width queries build up to
   the desktop two-column sections.
   ========================================================== */
.ge-nosotros section {
  padding: 40px 0;
}

.ge-nosotros section + section {
  border-top: 1px solid var(--ge-border);
}

/* `.ge-site-frame .ge-shell` (main.css ~L200) zeroes out .ge-shell's own
   margin/max-width so it fills the frame's width — meaning every .ge-shell
   in here needs its gutter added back explicitly, or it renders edge to
   edge with no breathing room at all. One rule, applied consistently to
   every section instead of patching each one individually. */
.ge-nosotros .ge-shell {
  padding-inline: 20px;
}

@media (min-width: 640px) {
  .ge-nosotros .ge-shell {
    padding-inline: 24px;
  }
}

@media (min-width: 900px) {
  .ge-nosotros .ge-shell {
    padding-inline: 34px;
  }
}

/* ---- Hero ---- */
/* Needs to outrank BOTH ".ge-nosotros section" (class+type) and its
   desktop media-query re-declaration further down the file (same
   specificity, but later — so it would win the tie at ≥900px if this
   selector only matched that specificity). Three selectors here beats
   both regardless of source order, or its top padding wins, leaving a
   band of bare page background above the image, between the header and
   photo. */
.ge-nosotros section.ge-nosotros-hero {
  padding-top: 0;
}

/* Full-bleed background photo behind the intro copy, fading out from
   right (image fully visible) to left (dissolved into the page
   background) so the text always sits on a clean, readable area. */
.ge-nosotros-hero__top {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 380px;
  overflow: hidden;
}

.ge-nosotros-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ge-nosotros-hero__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  /* Holds fully transparent a bit before it starts dissolving, so the
     fade kicks in further left instead of right at the photo's edge. */
  background: linear-gradient(to left, transparent 0%, transparent 20%, var(--ge-bg) 82%);
}

.ge-nosotros-hero__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 68% center;
  /* Slight zoom so the crop reads as a closer, more deliberate frame —
     part of the whisk runs off the top/right edge instead of the whole
     utensil sitting neatly inside the shot. */
  transform: scale(1.18);
  transform-origin: 80% center;
}

.ge-nosotros-hero__content {
  position: relative;
  z-index: 1;
  padding-block: 30px;
}

/* Two classes to match (and, being later in the file, win the tie against)
   `.ge-site-frame .ge-shell`'s own max-width:none/margin:0 — a lone-class
   `.ge-nosotros-hero__content` selector loses that fight on specificity
   and the text column silently stretches to the full frame width. */
.ge-nosotros-hero__top .ge-nosotros-hero__content {
  max-width: 560px;
  margin-inline: 0;
}

.ge-nosotros-hero__content h1 {
  margin: 0 0 18px;
  font-size: clamp(28px, 6vw, 40px);
  line-height: 1.15;
}

.ge-nosotros-hero__rule {
  display: block;
  width: 34px;
  height: 2px;
  margin-bottom: 14px;
  background: var(--ge-olive);
}

.ge-nosotros-hero__tagline {
  margin: 0;
  color: var(--ge-text-soft);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.ge-nosotros-features {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.ge-nosotros-features__item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 10px 10px;
  text-align: center;
}

.ge-nosotros-features__item:nth-child(-n+2) {
  border-bottom: 1px solid var(--ge-border);
}

.ge-nosotros-features__item:nth-child(odd)::after {
  content: "";
  position: absolute;
  top: 20%;
  bottom: 20%;
  right: 0;
  width: 1px;
  background: var(--ge-border);
}

.ge-nosotros-features__item i {
  font-size: 26px;
  color: var(--ge-olive);
}

.ge-nosotros-features__item p {
  max-width: 160px;
  margin: 0;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.3;
}

/* ---- Nuestra historia ---- */
.ge-nosotros-story__grid {
  display: grid;
  gap: 24px;
}

.ge-nosotros-story__text h2 {
  margin: 0 0 14px;
  font-size: clamp(24px, 5vw, 32px);
  line-height: 1.15;
}

.ge-nosotros-story__text p {
  margin: 0;
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.65;
}

.ge-nosotros-story__media {
  position: relative;
}

.ge-nosotros-story__image {
  width: 100%;
  aspect-ratio: 16 / 10;
  border-radius: var(--ge-radius);
  object-fit: cover;
}

.ge-nosotros-story__overlay {
  position: absolute;
  left: 20px;
  bottom: 20px;
  right: 20px;
  margin: 0;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .45);
}

.ge-nosotros-pillars {
  display: grid;
  gap: 0;
  margin: 36px 0 0;
  padding: 0;
  list-style: none;
}

.ge-nosotros-pillars__item {
  padding: 22px 0;
  text-align: center;
}

.ge-nosotros-pillars__item + .ge-nosotros-pillars__item {
  border-top: 1px solid var(--ge-border);
}

.ge-nosotros-pillars__item i {
  font-size: 26px;
  color: var(--ge-olive);
}

.ge-nosotros-pillars__item h3 {
  margin: 12px 0 8px;
  font-size: 17px;
}

.ge-nosotros-pillars__item p {
  max-width: 320px;
  margin: 0 auto;
  color: var(--ge-text-soft);
  font-size: 14px;
  line-height: 1.55;
}

/* ---- ¿Por qué elegirnos? ---- */
.ge-nosotros-why__intro {
  max-width: 640px;
  margin: 0 auto 8px;
  text-align: center;
}

.ge-nosotros-why__intro .ge-kicker {
  text-align: center;
}

.ge-nosotros-why__lead {
  margin: 0;
  font-size: clamp(18px, 3.6vw, 22px);
  font-weight: 650;
  line-height: 1.4;
}

.ge-nosotros-features--why {
  margin-top: 20px;
}

/* ---- Más que un té ---- */
.ge-nosotros-purpose__grid {
  display: grid;
  gap: 24px;
}

.ge-nosotros-purpose__image {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: var(--ge-radius);
  object-fit: cover;
}

.ge-nosotros-purpose__text h2 {
  margin: 0 0 14px;
  font-size: clamp(24px, 5vw, 32px);
  line-height: 1.15;
}

.ge-nosotros-purpose__text p {
  margin: 0;
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.65;
}

/* ---- CTA banner ---- */
.ge-nosotros-cta {
  background: var(--ge-olive);
}

.ge-nosotros-cta__shell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  text-align: center;
}

.ge-nosotros-cta h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(22px, 5vw, 30px);
}

.ge-nosotros-cta__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  width: 100%;
}

.ge-nosotros-cta__actions .button {
  min-width: 160px;
}

.ge-nosotros-cta .button--primary {
  background: var(--ge-olive-dark);
}

.ge-nosotros-cta .button--secondary {
  background: transparent;
  border-color: rgba(255, 255, 255, .55);
  color: #fff;
}

.ge-nosotros-cta .button--secondary:hover {
  background: rgba(255, 255, 255, .12);
}

@media (max-width: 480px) {
  .ge-nosotros-cta__actions .button {
    flex: 1 1 auto;
  }
}

/* ---- Desktop ---- */
@media (min-width: 900px) {
  .ge-nosotros section {
    padding: 64px 0;
  }

  .ge-nosotros-story__grid,
  .ge-nosotros-purpose__grid {
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 56px;
  }

  .ge-nosotros-purpose__grid {
    grid-template-columns: 1fr 1.1fr;
  }

  .ge-nosotros-hero__top {
    min-height: 440px;
  }

  .ge-nosotros-hero__bg::after {
    background: linear-gradient(to left, transparent 0%, transparent 25%, var(--ge-bg) 62%);
  }

  .ge-nosotros-features {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .ge-nosotros-features__item:nth-child(-n+2) {
    border-bottom: none;
  }

  .ge-nosotros-features__item::after {
    content: "";
    position: absolute;
    top: 20%;
    bottom: 20%;
    right: 0;
    width: 1px;
    background: var(--ge-border);
  }

  .ge-nosotros-features__item:nth-child(odd)::after {
    background: var(--ge-border);
  }

  .ge-nosotros-features__item:last-child::after {
    display: none;
  }

  .ge-nosotros-pillars {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ge-nosotros-pillars__item {
    position: relative;
    padding: 0 24px;
  }

  .ge-nosotros-pillars__item + .ge-nosotros-pillars__item {
    border-top: none;
  }

  .ge-nosotros-pillars__item::before {
    content: "";
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 0;
    width: 1px;
    background: var(--ge-border);
  }

  .ge-nosotros-pillars__item:first-child::before {
    display: none;
  }

  .ge-nosotros-cta__shell {
    flex-direction: row;
    justify-content: space-between;
    text-align: left;
  }

  .ge-nosotros-cta__actions {
    width: auto;
  }
}

/* ==========================================================
   Beneficios para la salud (page-templates/beneficios-salud.php)
   mobile-first: base rules below are the stacked mobile layout,
   min-width queries build up to the desktop layout.
   ========================================================== */
.ge-benefits section {
  padding: 40px 0;
}

.ge-benefits section + section {
  border-top: 1px solid var(--ge-border);
}

/* The hero already handles its own spacing entirely inside
   .ge-benefits-hero__top (the full-bleed photo) — leftover section
   padding just added a dead gap of blank background afterward, with a
   pointless divider line on top of it. */
.ge-benefits-hero + section {
  border-top: 0;
}

/* Same gutter approach as Nosotros — `.ge-site-frame .ge-shell` zeroes
   out .ge-shell's own margin/max-width, so every .ge-shell in here needs
   its gutter added back explicitly. */
.ge-benefits .ge-shell {
  padding-inline: 20px;
}

@media (min-width: 640px) {
  .ge-benefits .ge-shell {
    padding-inline: 24px;
  }
}

@media (min-width: 900px) {
  .ge-benefits .ge-shell {
    padding-inline: 34px;
  }
}

.ge-benefits .button i {
  margin-left: 8px;
  font-size: 12px;
}

/* ---- Hero (same full-bleed-photo treatment as Nosotros) ---- */
/* `.ge-benefits section` sets this section's padding (class+type); two
   classes here beats that regardless of source order — needed once
   already on Nosotros' equivalent rule, so starting with enough
   specificity this time instead of fixing it twice. */
.ge-benefits section.ge-benefits-hero {
  padding: 0;
}

.ge-benefits-hero__top {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 380px;
  overflow: hidden;
}

.ge-benefits-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ge-benefits-hero__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to left, transparent 0%, transparent 20%, var(--ge-bg) 82%);
}

.ge-benefits-hero__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 68% center;
  transform: scale(1.18);
  transform-origin: 80% center;
}

.ge-benefits-hero__content {
  position: relative;
  z-index: 1;
  padding-block: 30px;
}

.ge-benefits-hero__content h1 {
  margin: 0 0 14px;
  font-size: clamp(28px, 6vw, 40px);
  line-height: 1.15;
}

.ge-benefits-hero__intro {
  max-width: 480px;
  margin: 0 0 20px;
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.6;
}

.ge-benefits-hero__cta {
  margin-bottom: 22px;
}

.ge-benefits-hero__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ge-benefits-hero__badges li {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--ge-text-soft);
}

.ge-benefits-hero__badges i {
  color: var(--ge-olive);
  font-size: 13px;
}

/* ---- Principales beneficios del matcha ---- */
/* Mobile: compact icon + title rows, no description (matches the
   mockup's denser mobile list). Desktop below expands each item into a
   full icon/title/description card. */
.ge-benefits-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 14px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.ge-benefits-grid__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
}

.ge-benefits-grid__item i {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--ge-surface-soft);
  color: var(--ge-olive);
  font-size: 14px;
}

.ge-benefits-grid__item h3 {
  margin: 0;
  font-size: 13px;
  line-height: 1.3;
}

.ge-benefits-grid__item p {
  display: none;
}

/* ---- El poder del matcha en cifras ---- */
/* This whole band bleeds edge-to-edge (no section padding, no .ge-shell
   around the grid) so the photo can run flush against the left edge and
   full-height top-to-bottom — only the text column gets the shell's
   gutter, via its own nested .ge-shell. Needs the same specificity fix
   as the hero: two classes beat the generic ".ge-benefits section" rule
   (class+type) regardless of source order. */
.ge-benefits section.ge-benefits-stats {
  padding: 0;
}

.ge-benefits-stats {
  background: var(--ge-olive-dark);
  color: #fff;
}

.ge-benefits-stats .ge-kicker {
  color: #c9dab8;
}

.ge-benefits-stats__body {
  padding-block: 40px;
}

.ge-benefits-stats__body h2 {
  margin: 0 0 6px;
  color: #fff;
  font-size: clamp(24px, 5vw, 32px);
  line-height: 1.15;
}

/* The decorative photo is a desktop-only flourish — on mobile the card
   goes straight from heading to the stat list, same as the mockup. */
.ge-benefits-stats__media {
  display: none;
}

.ge-benefits-stats__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ge-benefits-stats__list {
  display: grid;
  gap: 18px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.ge-benefits-stats__list li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.ge-benefits-stats__list i {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  font-size: 15px;
}

.ge-benefits-stats__list h3 {
  margin: 0 0 4px;
  color: #fff;
  font-size: 15px;
  line-height: 1.3;
}

.ge-benefits-stats__list p {
  margin: 0;
  color: rgba(255, 255, 255, .72);
  font-size: 13px;
  line-height: 1.5;
}

/* ---- Comparación con otros alimentos saludables ---- */
.ge-benefits-compare__grid {
  margin-top: 24px;
}

.ge-benefits-chart {
  margin-bottom: 28px;
}

.ge-benefits-chart__caption {
  margin: 0 0 14px;
  color: var(--ge-text-soft);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.ge-benefits-chart__grid {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 8px;
  row-gap: 8px;
}

.ge-benefits-chart__axis {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 190px;
  padding-right: 2px;
  color: var(--ge-text-soft);
  font-size: 10px;
  text-align: right;
}

.ge-benefits-chart__bars {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  align-items: flex-end;
  gap: 6px;
  height: 190px;
  padding-left: 4px;
  border-bottom: 1px solid var(--ge-border);
  border-left: 1px solid var(--ge-border);
}

.ge-benefits-chart__bar {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
  gap: 6px;
}

.ge-benefits-chart__value {
  font-size: 10px;
  font-weight: 800;
  color: var(--ge-text);
}

.ge-benefits-chart__fill {
  display: block;
  width: 100%;
  max-width: 40px;
  border-radius: 5px 5px 0 0;
  background: var(--ge-olive);
}

.ge-benefits-chart__bar:nth-child(2) .ge-benefits-chart__fill {
  background: #6a5fae;
}

.ge-benefits-chart__bar:nth-child(3) .ge-benefits-chart__fill {
  background: #8a5a3b;
}

.ge-benefits-chart__bar:nth-child(4) .ge-benefits-chart__fill {
  background: #7fae5f;
}

.ge-benefits-chart__bar:nth-child(5) .ge-benefits-chart__fill {
  background: #bcd89e;
}

.ge-benefits-chart__labels {
  grid-column: 2;
  grid-row: 2;
  display: flex;
  gap: 6px;
  padding-left: 4px;
}

.ge-benefits-chart__labels span {
  flex: 1;
  color: var(--ge-text-soft);
  font-size: 10px;
  line-height: 1.3;
  text-align: center;
}

.ge-benefits-compare__text {
  margin: 0 0 18px;
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.65;
}

.ge-benefits-compare__note {
  padding: 20px;
  border-radius: var(--ge-radius-sm);
  background: var(--ge-olive-dark);
}

.ge-benefits-compare__note h3 {
  margin: 0 0 10px;
  color: #fff;
  font-size: 16px;
}

.ge-benefits-compare__note p {
  margin: 0;
  color: rgba(255, 255, 255, .78);
  font-size: 13px;
  line-height: 1.6;
}

/* ---- Haz del matcha parte de tu rutina ---- */
/* Same full-bleed band as the stats section (see above) — mirrored,
   photo flush against the right edge instead of the left. On mobile it
   just stacks normally with the photo kept as a boxed, rounded card;
   the edge-to-edge treatment only kicks in at desktop, further down. */
.ge-benefits section.ge-benefits-routine {
  padding: 0;
}

.ge-benefits-routine__grid {
  display: grid;
  gap: 24px;
}

.ge-benefits-routine__body {
  padding-block: 40px;
}

.ge-benefits-routine__body h2 {
  margin: 0 0 8px;
  font-size: clamp(24px, 5vw, 32px);
  line-height: 1.15;
}

.ge-benefits-routine__lead {
  margin: 0 0 20px;
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.5;
}

/* Not wrapped in .ge-shell (it's its own grid column at desktop, not
   page content), so it needs the same gutter added back by hand for the
   stacked mobile layout — removed again once the grid kicks in. */
.ge-benefits-routine__tips {
  display: grid;
  gap: 12px;
  margin: 0 0 24px;
  padding: 0 20px;
  list-style: none;
}

@media (min-width: 640px) {
  .ge-benefits-routine__tips {
    padding-inline: 24px;
  }
}

.ge-benefits-routine__tips li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 650;
  color: var(--ge-text);
}

.ge-benefits-routine__tips i {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--ge-surface-soft);
  color: var(--ge-olive);
  font-size: 13px;
}

.ge-benefits-routine__media {
  position: relative;
}

.ge-benefits-routine__image {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: var(--ge-radius);
  object-fit: cover;
}

.ge-benefits-routine__badge {
  position: absolute;
  left: 16px;
  bottom: 16px;
  right: 16px;
  margin: 0;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .45);
}

/* ---- Desktop ---- */
@media (min-width: 900px) {
  .ge-benefits section {
    padding: 64px 0;
  }

  .ge-benefits-hero__top {
    min-height: 440px;
  }

  .ge-benefits-hero__bg::after {
    background: linear-gradient(to left, transparent 0%, transparent 25%, var(--ge-bg) 62%);
  }

  /* `.ge-site-frame .ge-shell` (main.css ~L200) sets max-width:none at
     two-class specificity — a lone-class ".ge-benefits-hero__content"
     selector loses that fight and the max-width below gets silently
     ignored, same bug already fixed once on Nosotros' equivalent rule. */
  .ge-benefits-hero__top .ge-benefits-hero__content {
    max-width: 560px;
    margin-inline: 0;
  }

  .ge-benefits-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 28px;
    margin-top: 36px;
  }

  .ge-benefits-grid__item {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    padding: 0;
    text-align: left;
  }

  .ge-benefits-grid__item i {
    width: 48px;
    height: 48px;
    font-size: 19px;
  }

  .ge-benefits-grid__item h3 {
    font-size: 15px;
    line-height: 1.35;
  }

  .ge-benefits-grid__item p {
    display: block;
    margin: 6px 0 0;
    color: var(--ge-text-soft);
    font-size: 13px;
    line-height: 1.5;
  }

  /* Full-bleed band: photo stretches the whole row's height flush
     against the frame's left edge, text column keeps its own gutter via
     .ge-benefits-stats__body (a nested .ge-shell). */
  .ge-benefits-stats__grid {
    display: grid;
    grid-template-columns: minmax(280px, 38%) 1fr;
    align-items: stretch;
  }

  .ge-benefits-stats__media {
    display: block;
  }

  .ge-benefits-stats__body {
    padding-block: 64px;
  }

  .ge-benefits-stats__list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
  }

  .ge-benefits-compare__grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 48px;
    align-items: start;
  }

  .ge-benefits-chart {
    margin-bottom: 0;
  }

  /* Full-bleed band, mirrored from the stats section: photo flush
     against the frame's right edge. Capped at a slim 200px strip (the
     stats band is naturally short because it has far less copy — this
     one needs its own tight height plus compressed spacing so the text
     column actually fits without the band ballooning to match it).
     Three columns: heading/lead/button, then the 3 tips as their own
     compact stacked column, then the photo. */
  .ge-benefits-routine__grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr minmax(260px, 36%);
    grid-template-rows: 200px;
    align-items: stretch;
    gap: 32px;
    height: 200px;
    overflow: hidden;
  }

  .ge-benefits-routine__body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-block: 16px;
  }

  .ge-benefits-routine__body h2 {
    font-size: 21px;
    margin-bottom: 4px;
  }

  .ge-benefits-routine__lead {
    margin-bottom: 8px;
    font-size: 13px;
  }

  /* No longer a page-edge element once it's a grid column — the gap
     above provides its spacing instead of the mobile gutter padding. */
  .ge-benefits-routine__tips {
    align-self: center;
    padding-inline: 0;
    gap: 10px;
  }

  .ge-benefits-routine__tips li {
    font-size: 12px;
  }

  .ge-benefits-routine__tips i {
    width: 26px;
    height: 26px;
    font-size: 11px;
  }

  .ge-benefits-routine__image {
    height: 100%;
    aspect-ratio: auto;
    border-radius: 0;
  }

  /* The photo fades into the page background right at its own left
     edge — a short, late-onset fade, not a gradual one starting from
     the middle of the image. */
  .ge-benefits-routine__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, var(--ge-bg) 0%, transparent 12%);
  }
}

/* ==========================================================
   Nuestro Matcha (page-templates/nuestro-matcha.php)
   mobile-first: base rules below are the stacked mobile layout,
   min-width queries build up to the desktop layout.
   ========================================================== */
.ge-matcha section {
  padding: 40px 0;
}

.ge-matcha section + section {
  border-top: 1px solid var(--ge-border);
}

/* Same gutter approach as Nosotros/Beneficios — `.ge-site-frame .ge-shell`
   zeroes out .ge-shell's own margin/max-width, so every .ge-shell in here
   needs its gutter added back explicitly. */
.ge-matcha .ge-shell {
  padding-inline: 20px;
}

@media (min-width: 640px) {
  .ge-matcha .ge-shell {
    padding-inline: 24px;
  }
}

@media (min-width: 900px) {
  .ge-matcha .ge-shell {
    padding-inline: 34px;
  }
}

/* ---- Hero (same full-bleed-photo treatment as Nosotros/Beneficios) ---- */
.ge-matcha section.ge-matcha-hero {
  padding: 0;
}

.ge-matcha-hero__top {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 380px;
  overflow: hidden;
}

.ge-matcha-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ge-matcha-hero__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to left, transparent 0%, transparent 20%, var(--ge-bg) 82%);
}

.ge-matcha-hero__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 68% center;
  transform: scale(1.18);
  transform-origin: 80% center;
}

.ge-matcha-hero__content {
  position: relative;
  z-index: 1;
  padding-block: 30px;
}

.ge-matcha-hero__content h1 {
  margin: 0 0 14px;
  font-size: clamp(28px, 6vw, 40px);
  line-height: 1.15;
}

.ge-matcha-hero__intro {
  max-width: 480px;
  margin: 0 0 20px;
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.6;
}

.ge-matcha-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 22px;
}

.ge-matcha-hero__actions .button i {
  margin-left: 8px;
  font-size: 12px;
}

.ge-matcha-hero__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ge-matcha-hero__badges li {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--ge-text-soft);
}

.ge-matcha-hero__badges i {
  color: var(--ge-olive);
  font-size: 13px;
}

/* ---- Un proceso que hace la diferencia ---- */
.ge-matcha section.ge-matcha-process {
  padding: 0;
}

.ge-matcha-process__grid {
  display: grid;
}

.ge-matcha-process__body {
  padding-block: 40px;
}

.ge-matcha-process__body h2 {
  margin: 0 0 10px;
  font-size: clamp(24px, 5vw, 32px);
  line-height: 1.15;
}

.ge-matcha-process__lead {
  margin: 0 0 24px;
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.6;
}

.ge-matcha-steps {
  display: grid;
  gap: 22px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: none;
}

.ge-matcha-steps li {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.ge-matcha-steps i {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--ge-surface-soft);
  color: var(--ge-olive);
  font-size: 17px;
}

.ge-matcha-steps h3 {
  margin: 0;
  font-size: 15px;
}

.ge-matcha-steps p {
  margin: 0;
  color: var(--ge-text-soft);
  font-size: 13px;
  line-height: 1.5;
}

.ge-matcha-process__media {
  position: relative;
  min-height: 200px;
}

.ge-matcha-process__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ---- El origen de su singularidad ---- */
.ge-matcha-origin {
  background: #fff;
}

.ge-matcha section.ge-matcha-origin {
  padding: 0;
}

.ge-matcha-origin__grid {
  display: grid;
}

.ge-matcha-origin__media {
  min-height: 220px;
}

.ge-matcha-origin__image {
  display: block;
  width: 100%;
  height: 100%;
  background: #fff;
  /* contain, not cover — the whole photo should show, never cropped,
     even if that leaves a little breathing room on one side. */
  object-fit: contain;
}

.ge-matcha-origin__body {
  padding-block: 32px;
}

.ge-matcha-origin__body h2 {
  margin: 0 0 12px;
  font-size: clamp(24px, 5vw, 32px);
  line-height: 1.15;
}

.ge-matcha-origin__body p {
  margin: 0;
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.65;
}

.ge-matcha-origin__side {
  padding: 0 20px 32px;
}

@media (min-width: 640px) {
  .ge-matcha-origin__side {
    padding-inline: 24px;
  }
}

.ge-matcha-origin__list {
  display: grid;
  gap: 14px;
  margin: 0 0 18px;
  padding: 0;
  list-style: none;
}

.ge-matcha-origin__list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 650;
}

.ge-matcha-origin__list i {
  color: var(--ge-olive);
  font-size: 15px;
}

.ge-matcha-origin__tagline {
  margin: 0;
  color: var(--ge-text-soft);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

/* ---- Ceremonial vs Culinario ---- */
.ge-matcha-types__heading {
  margin-bottom: 24px;
}

.ge-matcha-types__heading h2 {
  margin: 0 0 10px;
  font-size: clamp(24px, 5vw, 32px);
  line-height: 1.15;
}

.ge-matcha-types__lead {
  margin: 0;
  color: var(--ge-text-soft);
  font-size: 15px;
}

.ge-matcha-types__grid {
  display: grid;
  gap: 20px;
}

.ge-matcha-type-card {
  overflow: hidden;
  border: 1px solid var(--ge-border);
  border-radius: var(--ge-radius);
  background: #fff;
}

.ge-matcha-type-card__image {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.ge-matcha-type-card__body {
  padding: 22px;
}

.ge-matcha-type-card__body h3 {
  margin: 0 0 14px;
  font-size: 19px;
}

.ge-matcha-type-card__body ul {
  display: grid;
  gap: 9px;
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
}

.ge-matcha-type-card__body li {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 13px;
  color: var(--ge-text-soft);
}

.ge-matcha-type-card__body li i {
  color: var(--ge-olive);
  font-size: 12px;
}

.ge-matcha-type-card__body .button i {
  margin-left: 8px;
  font-size: 11px;
}

/* ---- Desktop ---- */
@media (min-width: 900px) {
  .ge-matcha section {
    padding: 64px 0;
  }

  .ge-matcha-hero__top {
    min-height: 440px;
  }

  .ge-matcha-hero__bg::after {
    background: linear-gradient(to left, transparent 0%, transparent 25%, var(--ge-bg) 62%);
  }

  .ge-matcha-hero__top .ge-matcha-hero__content {
    max-width: 560px;
    margin-inline: 0;
  }

  .ge-matcha-hero__kanji {
    display: block;
    position: absolute;
    top: 26px;
    right: 34px;
    z-index: 1;
    margin: 0;
    color: #fff;
    font-size: 26px;
    line-height: 1;
    text-shadow: 0 2px 10px rgba(0, 0, 0, .35);
  }

  .ge-matcha-hero__vertical {
    display: block;
    position: absolute;
    z-index: 1;
    margin: 0;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .35);
    writing-mode: vertical-rl;
  }

  .ge-matcha-hero__vertical--left {
    top: 30px;
    left: calc(50% - 40px);
  }

  .ge-matcha-hero__vertical--right {
    top: 30px;
    right: 34px;
    bottom: 70px;
  }

  /* Full-bleed band, same technique as the "Beneficios" stats/routine
     sections: photo flush against the frame's right edge, stretched to
     the full row height. */
  .ge-matcha-process__grid {
    grid-template-columns: 1fr minmax(260px, 30%);
    align-items: stretch;
  }

  .ge-matcha-process__body {
    padding-block: 64px;
  }

  .ge-matcha-steps {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
    position: relative;
  }

  .ge-matcha-steps::before {
    content: "";
    position: absolute;
    top: 22px;
    left: 44px;
    right: 44px;
    height: 1px;
    background: var(--ge-border);
    z-index: 0;
  }

  .ge-matcha-steps li {
    position: relative;
    z-index: 1;
  }

  .ge-matcha-process__media {
    min-height: 0;
  }

  /* Same left-edge fade as "Beneficios"' routine photo — the image sits
     on the right here too, so the fade belongs on its left edge, where
     it meets the text column, not the outer edge. */
  .ge-matcha-process__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, var(--ge-bg) 0%, transparent 40%);
  }

  /* Image flush against the frame's left edge, full row height. */
  .ge-matcha-origin__grid {
    grid-template-columns: minmax(360px, 42%) 1fr minmax(220px, 24%);
    align-items: stretch;
  }

  .ge-matcha-origin__media {
    min-height: 0;
  }

  .ge-matcha-origin__body {
    padding-block: 64px;
  }

  .ge-matcha-origin__side {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 34px 0 0;
  }

  .ge-matcha-types__heading {
    display: flex;
    align-items: flex-end;
    gap: 24px;
  }

  .ge-matcha-types__lead {
    max-width: 320px;
    text-align: left;
  }

  .ge-matcha-types__grid {
    grid-template-columns: 1fr 1fr;
    gap: 28px;
  }

  .ge-matcha-type-card {
    display: flex;
  }

  /* aspect-ratio: auto (rather than a real ratio like 4/3) made WordPress's
     lazy-loaded `sizes="auto"` images (WP 6.7+) render at a wildly
     inflated height here — the browser's placeholder guess before the
     real srcset candidate resolves, which this layout never corrected.
     A definite ratio sidesteps that negotiation entirely; align-self:
     stretch below still lets it grow taller to match a tall sibling. */
  .ge-matcha-type-card__image {
    width: 42%;
    height: auto;
    aspect-ratio: 4 / 3;
    align-self: stretch;
    flex: 0 0 auto;
    object-fit: cover;
  }

  .ge-matcha-type-card__body {
    flex: 1;
  }
}

/* ==========================================================
   Search results (search.php) — the scaffold's original classes
   (.section/.container/.archive-grid/.entry-card) were never actually
   styled, so results rendered as plain unstyled HTML. mobile-first: base
   rules below are the stacked mobile layout, min-width queries build up
   to the desktop grid.
   ========================================================== */
.ge-search-results {
  padding: 40px 0 64px;
}

.ge-search-results .ge-shell {
  padding-inline: 20px;
}

@media (min-width: 640px) {
  .ge-search-results .ge-shell {
    padding-inline: 24px;
  }
}

@media (min-width: 900px) {
  .ge-search-results .ge-shell {
    padding-inline: 34px;
  }
}

.ge-search-results__header {
  margin-bottom: 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--ge-border);
}

.ge-search-results__header h1 {
  margin: 0 0 8px;
  font-size: clamp(24px, 5vw, 34px);
  line-height: 1.15;
  word-break: break-word;
}

.ge-search-results__count {
  margin: 0;
  color: var(--ge-text-soft);
  font-size: 13px;
  font-weight: 650;
}

.ge-search-results__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}

.ge-search-result-card {
  display: block;
  overflow: hidden;
  border: 1px solid var(--ge-border);
  border-radius: 14px;
  background: #fff;
  transition: box-shadow .2s ease, transform .2s ease;
}

.ge-search-result-card:hover {
  box-shadow: var(--ge-shadow);
  transform: translateY(-2px);
}

.ge-search-result-card__media {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #e9ece4;
}

.ge-search-result-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ge-search-result-card__placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #e2e8da, #f4f1e9 55%, #ccd8c2);
}

.ge-search-result-card__type {
  position: absolute;
  left: 12px;
  bottom: 12px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 3px 12px rgba(0, 0, 0, .08);
  color: var(--ge-olive-dark);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  line-height: 1;
  text-transform: uppercase;
}

.ge-search-result-card__body {
  padding: 16px;
}

.ge-search-result-card__title {
  margin: 0 0 8px;
  font-size: 17px;
  line-height: 1.3;
}

.ge-search-result-card__title a {
  color: var(--ge-text);
  text-decoration: none;
}

.ge-search-result-card__title a:hover {
  color: var(--ge-olive-dark);
}

.ge-search-result-card__excerpt {
  margin: 0;
  color: var(--ge-text-soft);
  font-size: 13px;
  line-height: 1.55;
}

.ge-search-result-card__price {
  margin: 0;
  color: var(--ge-olive-dark);
  font-size: 15px;
  font-weight: 700;
}

.ge-search-result-card__price del {
  margin-right: 6px;
  color: var(--ge-text-soft);
  font-weight: 500;
  opacity: .7;
}

.ge-search-results__pagination {
  margin-top: 34px;
}

.ge-search-results__pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.ge-search-results__pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid var(--ge-border);
  border-radius: 8px;
  background: #fff;
  color: var(--ge-text);
  font-size: 13px;
  font-weight: 700;
}

.ge-search-results__pagination .page-numbers.current {
  background: var(--ge-olive);
  border-color: var(--ge-olive);
  color: #fff;
}

.ge-search-results__pagination a.page-numbers:hover {
  border-color: var(--ge-olive);
  color: var(--ge-olive);
}

.ge-search-results__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  max-width: 360px;
  margin: 20px auto;
  padding: 40px 24px;
  text-align: center;
  color: var(--ge-text-soft);
}

.ge-search-results__empty-icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--ge-surface-soft);
  color: var(--ge-olive);
}

.ge-search-results__empty-icon svg {
  width: 26px;
  height: 26px;
}

.ge-search-results__empty p {
  margin: 0;
}

.ge-search-results__empty-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

@media (min-width: 640px) {
  .ge-search-results__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1000px) {
  .ge-search-results__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* ==========================================================
   Home · Frase destacada ("No confundas Matcha...")
   ========================================================== */
.ge-statement {
  padding: 44px 0;
  background: var(--ge-olive-dark);
  color: #fff;
  text-align: center;
}

.ge-statement .ge-shell {
  padding-inline: 22px;
}

.ge-statement__lead {
  margin: 0 0 10px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .02em;
  opacity: .88;
}

.ge-statement__claim {
  margin: 0;
  font-size: clamp(25px, 6.4vw, 40px);
  font-weight: 800;
  line-height: 1.15;
}

/* ==========================================================
   Home · Ventas mayoristas
   ========================================================== */
.ge-wholesale {
  padding: 40px 0;
}

.ge-wholesale .ge-shell {
  padding-inline: 20px;
}

.ge-wholesale__inner {
  display: grid;
  gap: 24px;
  padding: 26px 20px;
  border: 1px solid var(--ge-border);
  border-radius: var(--ge-radius);
  background: #fff;
}

.ge-wholesale__intro h2 {
  margin: 0 0 10px;
  font-size: clamp(25px, 5.6vw, 34px);
  line-height: 1.15;
}

.ge-wholesale__intro p:last-child {
  margin: 0;
  color: var(--ge-text-soft);
  font-size: 15px;
  line-height: 1.6;
}

.ge-wholesale__cards {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ge-wholesale__card {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px;
  border-radius: 14px;
  background: var(--ge-bg);
}

.ge-wholesale__card i {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--ge-olive);
  color: #fff;
  font-size: 16px;
}

.ge-wholesale__card p {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
}

.ge-wholesale__cta p {
  margin: 0 0 14px;
  font-size: 15px;
  font-weight: 650;
  line-height: 1.5;
}

.ge-wholesale__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.ge-wholesale__actions .button {
  flex: 1 1 200px;
}

.ge-wholesale__actions .button i {
  margin-right: 8px;
}

@media (min-width: 900px) {
  .ge-wholesale {
    padding: 56px 0;
  }

  .ge-wholesale .ge-shell {
    padding-inline: 34px;
  }

  .ge-wholesale__inner {
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "intro cards"
      "cta   cards";
    grid-template-rows: auto 1fr;
    gap: 28px 44px;
    padding: 40px;
  }

  .ge-wholesale__intro { grid-area: intro; }
  .ge-wholesale__cards { grid-area: cards; align-content: center; }
  .ge-wholesale__cta { grid-area: cta; align-self: end; }
  .ge-wholesale__actions .button { flex: 0 1 auto; }
  .ge-statement { padding: 56px 0; }
}

/* ==========================================================
   Mobile fix · "¿Qué matcha es para vos?" cards
   The product photo is the card's background-image; the copy used to sit on
   top of it at 62-66% width, so text and tin/pouch overlapped on phones.
   Below 640px the photo gets its own band on top and the copy goes under it.
   ========================================================== */
@media (max-width: 640px) {
  .ge-choice-card,
  .ge-choice-card--ceremonial,
  .ge-choice-card--culinary {
    display: block;
    min-height: 0;
    padding-top: 236px;
    background-size: auto 216px;
    background-position: center 14px;
  }

  /* Each photo is composed with the product to one side (same as desktop). */
  .ge-choice-card--ceremonial {
    background-position: 6px 14px;
  }

  .ge-choice-card--culinary {
    background-position: calc(100% - 6px) 14px;
  }

  .ge-choice-card--ceremonial .ge-choice-card__body,
  .ge-choice-card--culinary .ge-choice-card__body {
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 6px 20px 24px;
  }

  .ge-choice-card__body .button {
    margin-top: 6px;
  }
}

/* ==========================================================
   Mobile fix · page heroes (Nosotros / Beneficios / Nuestro Matcha)
   On desktop the photo sits behind the copy and fades out towards the text;
   on a phone the copy spans the full width, so the photo ended up behind the
   kicker, headline and badges. Below 900px the photo becomes its own band on
   top (fading into the page background at its bottom edge) and the copy goes
   underneath on a plain background.
   ========================================================== */
@media (max-width: 899px) {
  .ge-nosotros-hero__top,
  .ge-benefits-hero__top,
  .ge-matcha-hero__top {
    display: block;
    min-height: 0;
  }

  .ge-nosotros-hero__bg,
  .ge-benefits-hero__bg,
  .ge-matcha-hero__bg {
    position: relative;
    inset: auto;
    height: 220px;
    overflow: hidden;
  }

  .ge-nosotros-hero__bg::after,
  .ge-benefits-hero__bg::after,
  .ge-matcha-hero__bg::after {
    background: linear-gradient(to top, var(--ge-bg) 0%, transparent 55%);
  }

  .ge-nosotros-hero__top .ge-nosotros-hero__content,
  .ge-benefits-hero__top .ge-benefits-hero__content,
  .ge-matcha-hero__top .ge-matcha-hero__content {
    margin-top: -26px;
    padding-top: 0;
    padding-bottom: 28px;
  }
}

/* Instagram carousel (Smash Balloon feed) */
.ge-instagram{padding:56px 0 24px}
.ge-instagram__head{text-align:center;margin-bottom:24px}
.ge-instagram__head h2{margin:6px 0 10px}
.ge-instagram__handle{display:inline-flex;gap:8px;align-items:center;font-weight:700;color:var(--ge-green,#4a6b2a);text-decoration:none}
.ge-instagram__feed #sb_instagram{padding:0!important;width:100%!important}
.ge-instagram__feed #sb_instagram #sbi_images{display:flex!important;flex-wrap:nowrap!important;gap:12px;padding:0!important;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.ge-instagram__feed #sb_instagram #sbi_images .sbi_item{flex:0 0 72%;max-width:72%;width:auto!important;padding:0!important;scroll-snap-align:start}
.ge-instagram__feed #sb_instagram .sbi_photo_wrap,.ge-instagram__feed #sb_instagram .sbi_photo{border-radius:14px;overflow:hidden}
.ge-instagram__feed #sb_instagram #sbi_load,.ge-instagram__feed #sb_instagram .sbi_follow_btn{display:none!important}
@media (min-width:640px){.ge-instagram__feed #sb_instagram #sbi_images .sbi_item{flex-basis:34%;max-width:34%}}
@media (min-width:900px){.ge-instagram__feed #sb_instagram #sbi_images .sbi_item{flex-basis:23.5%;max-width:23.5%}}
.ge-instagram__feed #sb_instagram .sb_instagram_header,.ge-instagram__feed #sb_instagram #sbi_mod_error{display:none!important}
.ge-instagram__feed #sb_instagram #sbi_images::-webkit-scrollbar{height:6px}
.ge-instagram__feed #sb_instagram #sbi_images::-webkit-scrollbar-thumb{background:rgba(74,107,42,.45);border-radius:6px}
.ge-instagram .ge-shell{padding-inline:20px}
@media (min-width:900px){.ge-instagram .ge-shell{padding-inline:34px}}

/* Floating back-to-top button */
.ge-back-to-top{position:fixed;right:18px;bottom:18px;z-index:60;width:52px;height:52px;border:2px solid #fff;border-radius:50%;background:#111;color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.35);transition:transform .2s,background .2s}
.ge-back-to-top[hidden]{display:none}
.ge-back-to-top:hover,.ge-back-to-top:focus-visible{background:var(--ge-green,#4a6b2a);transform:translateY(-3px)}
.ge-back-to-top svg{width:24px;height:24px}
@media (min-width:900px){.ge-back-to-top{right:28px;bottom:28px;width:56px;height:56px}}

/* English home: Amazon banner in place of the featured products */
.ge-amazon-banner{padding:40px 0}
.ge-amazon-banner .ge-shell{padding-inline:20px}
.ge-amazon-banner__inner{display:grid;gap:20px;justify-items:center;text-align:center;padding:34px 22px;border-radius:var(--ge-radius);background:#2c3a1f;color:#fff}
.ge-amazon-banner__logo{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:#fff;color:#111;font-size:46px}
.ge-amazon-banner__text .ge-kicker{color:#cfe3a8}
.ge-amazon-banner__text h2{margin:6px 0 10px;color:#fff;font-size:clamp(26px,6vw,38px);line-height:1.15}
.ge-amazon-banner__text p:last-child{margin:0;max-width:520px;color:rgba(255,255,255,.88);font-size:16px}
.ge-amazon-banner__button{display:inline-flex;gap:10px;align-items:center;justify-content:center;padding:15px 26px;border-radius:999px;background:#ff9900;color:#111;font-weight:800;text-decoration:none;transition:transform .2s,background .2s}
.ge-amazon-banner__button:hover,.ge-amazon-banner__button:focus-visible{background:#ffb340;transform:translateY(-2px)}
.ge-amazon-banner__button i{font-size:20px}
@media (min-width:900px){
  .ge-amazon-banner .ge-shell{padding-inline:34px}
  .ge-amazon-banner__inner{grid-template-columns:auto 1fr auto;justify-items:start;text-align:left;gap:32px;padding:40px 44px}
  .ge-amazon-banner__logo{width:112px;height:112px;font-size:62px}
}
