/*
Theme Name: Zeus Gear Premium E-Commerce
Theme URI: https://zeusgear.com
Author: iStudios Media
Author URI: https://istudiosmedia.com/
Description: Premium dark luxury black-and-gold WooCommerce theme for Zeus Gear physical wellness and family gaming equipment. Compatible with Elementor (free).
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: zeus-gear
Tags: two-columns, dark, custom-colors, custom-menu, featured-images, translation-ready, woocommerce
*/

/* ========================================
   ZEUS GEAR LLC — PREMIUM BLACK & GOLD
   Complete Design System v2.0
   ======================================== */

/* ── GOOGLE FONTS ── */

/* ── TOKENS ── */
:root {
  --black:      #080808;
  --dark-1:     #111111;
  --dark-2:     #181818;
  --dark-3:     #222222;
  --dark-4:     #2c2c2c;
  --dark-5:     #383838;

  --gold:       #C9A227;
  --gold-bright:#E8BE3A;
  --gold-pale:  #F5D580;
  --gold-dim:   rgba(201,162,39,0.12);
  --gold-glow:  rgba(201,162,39,0.3);
  --gold-line:  rgba(201,162,39,0.2);

  --white:      #FFFFFF;
  --off-white:  #F0EDE6;
  --gray-100:   rgba(255,255,255,0.88);
  --gray-300:   rgba(255,255,255,0.55);
  --gray-500:   rgba(255,255,255,0.32);
  --gray-700:   rgba(255,255,255,0.12);
  --gray-900:   rgba(255,255,255,0.05);

  --shadow-gold: 0 8px 40px rgba(201,162,39,0.22);
  --shadow-dark: 0 20px 60px rgba(0,0,0,0.6);
  --shadow-card: 0 4px 24px rgba(0,0,0,0.4);

  --r-xs: 3px;
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 24px;
  --r-full: 9999px;

  --ease:      cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out:  cubic-bezier(0, 0, 0.2, 1);
  --t:         0.3s var(--ease);
  --t-slow:    0.6s var(--ease);
}

/* ── RESET & WORDPRESS CORE WRAPS ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  font-family: 'Space Grotesk', sans-serif;
  background: var(--black);
  color: var(--white);
  overflow-x: hidden;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
a  { text-decoration: none; color: inherit; }
ul { list-style: none; }
img { display: block; max-width: 100%; height: auto; }
button { font-family: inherit; }
input, textarea, select { font-family: inherit; }

/* WordPress align classes support */
.aligncenter { display: block; margin: 20px auto; }
.alignleft { float: left; margin: 0 20px 20px 0; }
.alignright { float: right; margin: 0 0 20px 20px; }
.wp-caption { background: var(--dark-1); border: 1px solid var(--dark-3); max-width: 100%; padding: 8px; text-align: center; border-radius: var(--r-sm); }
.wp-caption-text { font-size: 13px; color: var(--gray-300); margin: 6px 0 0 0; }

/* ── LAYOUT ── */
.container {
  width: 100%;
  max-width: 1220px;
  margin: 0 auto;
  padding: 0 28px;
}
.container--wide   { max-width: 1440px; }
.container--narrow { max-width: 860px; }

/* ── TYPOGRAPHY ── */
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 18px;
}
.eyebrow::before, .eyebrow::after {
  content: '';
  display: block;
  width: 28px;
  height: 1px;
  background: var(--gold);
}
.eyebrow--center {
  width: max-content;
  margin-left: auto;
  margin-right: auto;
}

.section-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(42px, 6vw, 72px);
  font-weight: 400;
  color: var(--white);
  line-height: 1.0;
  letter-spacing: 2px;
  margin-bottom: 20px;
}
.section-title .gold {
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-bright) 50%, var(--gold-pale) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.section-title--dark { color: var(--black); }

.section-sub {
  font-size: 16px;
  color: var(--gray-300);
  line-height: 1.8;
  max-width: 560px;
}
.section-sub--center { margin: 0 auto; text-align: center; }
.section-sub--dark { color: rgba(0,0,0,0.6); }

.section-header { text-align: center; margin-bottom: 64px; }
.section-header .section-sub { margin: 0 auto; }

.gold-line {
  display: block;
  width: 60px;
  height: 2px;
  background: linear-gradient(90deg, var(--gold), var(--gold-bright));
  margin: 18px 0;
  border-radius: 1px;
}
.gold-line--center { margin: 18px auto; }

/* ── BUTTONS ── */
.btn, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 14px 30px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  cursor: pointer;
  border: 2px solid transparent;
  border-radius: var(--r-xs);
  transition: var(--t);
  line-height: 1;
  white-space: nowrap;
  position: relative;
  overflow: hidden;
  text-decoration: none;
}

.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit {
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-bright) 100%) !important;
  color: var(--black) !important;
  border: none !important;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce #respond input#submit:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-gold);
  background: linear-gradient(135deg, var(--gold-bright) 0%, var(--gold-pale) 100%) !important;
}

.btn--gold {
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-bright) 100%);
  color: var(--white);
  border-color: transparent;
  font-weight: 700;
}
.btn--gold:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-gold);
}

.btn--outline-gold {
  background: transparent;
  color: var(--gold);
  border-color: var(--gold);
}
.btn--outline-gold:hover {
  background: var(--gold-dim);
  transform: translateY(-2px);
  box-shadow: 0 4px 20px var(--gold-glow);
}

.btn--sm  { padding: 10px 22px; font-size: 11px; letter-spacing: 1px; }
.btn--lg  { padding: 17px 40px; font-size: 14px; }
.btn--xl  { padding: 20px 52px; font-size: 15px; }

/* Fluent Forms follows the primary action treatment; Elementor buttons keep
   their individual editor-controlled primary/outline variants. */
.fluentform .ff-btn-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 13px 28px;
  border: 1px solid var(--gold);
  border-radius: var(--r-xs);
  background: linear-gradient(135deg, var(--gold), var(--gold-bright));
  color: var(--black);
  font-family: 'Space Grotesk', sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.35px;
  line-height: 1;
  text-transform: uppercase;
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.fluentform .ff-btn-submit:hover { transform: translateY(-2px); box-shadow: var(--shadow-gold); filter: brightness(1.06); }
.elementor-widget-button .elementor-button-content-wrapper { gap: 8px; align-items: center; }
.elementor-widget-button .elementor-button-icon svg,
.elementor-widget-button .elementor-button-icon i { width: .95em; height: .95em; font-size: .95em; }

/* ── NOISE TEXTURE OVERLAY ── */
.noise {
  position: relative;
}
.noise::after {
  content: '';
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events: none;
  opacity: 0.35;
  z-index: 0;
}

/* ================================================
   HEADER
   ================================================ */
#site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(8,8,8,0.92);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--dark-3);
  transition: border-color var(--t), box-shadow var(--t);
}
#site-header.scrolled {
  border-bottom-color: var(--gold-line);
  box-shadow: 0 4px 40px rgba(0,0,0,0.5);
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 76px;
  gap: 32px;
}

.site-logo {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}
.site-logo img {
  height: 48px;
  width: auto;
  transition: opacity var(--t);
}
.site-logo:hover img { opacity: 0.9; }
.site-logo__text {
  display: flex;
  flex-direction: column;
  line-height: 1;
}
.site-logo__name {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 22px;
  letter-spacing: 3px;
  color: var(--white);
}
.site-logo__tagline {
  font-size: 9px;
  letter-spacing: 2.5px;
  color: var(--gold);
  text-transform: uppercase;
  font-weight: 600;
}

.site-nav { display: flex; align-items: center; gap: 0; }
.site-nav a, .site-nav ul li a {
  display: block;
  padding: 8px 16px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--gray-300);
  position: relative;
  transition: color var(--t);
}
.site-nav a::after, .site-nav ul li a::after {
  content: '';
  position: absolute;
  bottom: 0; left: 16px; right: 16px;
  height: 1px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform var(--t);
}
.site-nav a:hover, .site-nav a.active, .site-nav ul li.current-menu-item a { color: var(--gold); }
.site-nav a:hover::after, .site-nav a.active::after, .site-nav ul li.current-menu-item a::after { transform: scaleX(1); }

/* WordPress Native Menu Enqueueing Wraps */
.site-nav ul { display: flex; align-items: center; }
.site-nav li { position: relative; }
.site-nav .sub-menu {
  position: absolute;
  top: calc(100% + 12px);
  left: 0;
  z-index: 120;
  display: grid;
  min-width: 220px;
  padding: 10px;
  border: 1px solid rgba(191, 148, 55, 0.28);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 40px rgba(24, 19, 12, 0.14);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity var(--t), transform var(--t), visibility var(--t);
}
.site-nav .menu-item-has-children:hover > .sub-menu,
.site-nav .menu-item-has-children:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.site-nav .sub-menu a,
.site-nav ul li .sub-menu a {
  padding: 10px 12px;
  border-radius: 6px;
  color: var(--black);
  white-space: nowrap;
}
.site-nav .sub-menu a::after { display: none; }
.site-nav .sub-menu a:hover {
  color: var(--black);
  background: rgba(191, 148, 55, 0.13);
}

.mobile-toggle {
  display: none;
  flex-direction: column;
  gap: 6px;
  cursor: pointer;
  padding: 6px;
  border: none;
  background: transparent;
  flex-shrink: 0;
}
.mobile-toggle span {
  display: block;
  width: 26px; height: 1.5px;
  background: var(--gold);
  border-radius: 1px;
  transition: var(--t);
}

/* Mobile Nav Overlay */
.mobile-nav {
  display: none;
  position: fixed; inset: 0;
  background: var(--black);
  z-index: 9999;
  flex-direction: column;
  padding: 0 32px 40px;
  overflow-y: auto;
}
.mobile-nav.open { display: flex; }
.mobile-nav__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 76px;
  border-bottom: 1px solid var(--dark-3);
  margin-bottom: 48px;
}
.mobile-nav__logo {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 24px;
  letter-spacing: 4px;
  color: var(--gold);
}
.mobile-close {
  background: none; border: none;
  color: var(--gray-300); font-size: 28px;
  cursor: pointer; line-height: 1;
}
.mobile-nav__links { flex: 1; }
.mobile-nav__links a, .mobile-nav__links ul li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 0;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 36px;
  letter-spacing: 3px;
  color: var(--gray-300);
  border-bottom: 1px solid var(--dark-3);
  transition: color var(--t), padding var(--t);
}
.mobile-nav__links a:hover, .mobile-nav__links ul li a:hover { color: var(--gold); padding-left: 8px; }
.mobile-nav__links .sub-menu {
  display: grid;
  gap: 4px;
  padding: 4px 0 12px 18px;
}
.mobile-nav__links .sub-menu a,
.mobile-nav__links ul li .sub-menu a {
  padding: 10px 0;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--black);
  border-bottom: 0;
}
.mobile-nav__links .sub-menu a:hover {
  color: var(--gold);
  padding-left: 0;
}

/* ================================================
   PAGE HERO
   ================================================ */
.page-hero {
  background: var(--dark-1);
  padding: 88px 0 80px;
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--dark-3);
}
.page-hero__bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 700px 400px at 80% 50%, rgba(201,162,39,0.07) 0%, transparent 70%),
    radial-gradient(ellipse 500px 600px at 0% 100%, rgba(201,162,39,0.04) 0%, transparent 60%);
  pointer-events: none;
}
.page-hero__inner {
  position: relative; z-index: 1;
}
.page-hero__title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(52px, 8vw, 88px);
  letter-spacing: 3px;
  color: var(--white);
  line-height: 1;
  margin-bottom: 18px;
}
.page-hero__title .gold {
  background: linear-gradient(135deg, var(--gold), var(--gold-bright));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.page-hero__sub {
  font-size: 17px;
  color: var(--gray-300);
  max-width: 560px;
  line-height: 1.75;
}

/* ================================================
   FOOTER
   ================================================ */
#site-footer {
  background: var(--dark-1);
  border-top: 1px solid var(--dark-3);
  padding-top: 40px;
}
.footer-top {
  display: grid;
  grid-template-columns: 1.8fr 1fr 1fr 1fr;
  gap: 56px;
  padding: 32px 0 56px;
  border-bottom: 1px solid var(--dark-3);
}
.footer-brand__logo {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 32px;
  letter-spacing: 4px;
  color: var(--white);
  display: block;
  margin-bottom: 6px;
}
.footer-brand__sub {
  font-size: 10px;
  color: var(--gold);
  letter-spacing: 3px;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 20px;
}
.footer-brand__desc { font-size: 14px; color: var(--gray-300); line-height: 1.75; max-width: 280px; }

.footer-col__title {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 22px;
  display: block;
}
.footer-links { display: flex; flex-direction: column; gap: 12px; }
.footer-links a, .footer-links ul li a {
  font-size: 14px;
  color: var(--gray-300);
  transition: color var(--t), padding var(--t);
  text-decoration: none;
}
.footer-links a:hover, .footer-links ul li a:hover { color: var(--gold); padding-left: 6px; }

.footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 22px 0;
  flex-wrap: wrap;
  gap: 12px;
}
.footer-bottom p { font-size: 12px; color: var(--gray-500); }
.footer-bottom__links { display: flex; gap: 24px; }
.footer-bottom__links a, .footer-bottom__links ul li a { font-size: 12px; color: var(--gray-500); transition: color var(--t); }
.footer-bottom__links a:hover, .footer-bottom__links ul li a:hover { color: var(--gold); }

/* ================================================
   WOOCOMMERCE PREMIUM LUXURY GOLD OVERRIDES
   ================================================ */

/* Page wrappers */
.woocommerce-page {
  background-color: var(--wc-page-bg, var(--black));
  color: var(--white);
}

.woocommerce-page #main {
  background-color: var(--wc-page-bg, var(--black));
}

.woocommerce-page .woocommerce-cart-form__contents,
.woocommerce-page .cart_totals,
.woocommerce-page .woocommerce-checkout-payment,
.woocommerce-page .woocommerce-MyAccount-content,
.woocommerce-page .woocommerce-MyAccount-navigation,
.woocommerce-page .woocommerce-tabs .panel {
  background-color: var(--wc-surface-bg, var(--dark-1));
  border-color: var(--wc-border, var(--dark-3));
}

/* Shop Page Hero */
.shop-hero {
  background: var(--dark-1);
  padding: 88px 0 80px;
  border-bottom: 1px solid var(--dark-3);
  position: relative;
  overflow: hidden;
}

.shop-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 700px 400px at 80% 50%, rgba(201,162,39,0.07) 0%, transparent 70%);
  pointer-events: none;
}

.shop-filter a {
  color: var(--gray-300);
  transition: color var(--t);
  font-size: 14px;
  text-decoration: none;
}

.shop-filter a:hover {
  color: var(--gold-bright);
}

.shop-filter input[type="checkbox"] {
  cursor: pointer;
  accent-color: var(--gold);
}

/* Product Grid */
ul.products {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}

ul.products.columns-4 {
  grid-template-columns: repeat(4, 1fr);
}

ul.products.columns-2 {
  grid-template-columns: repeat(2, 1fr);
}

@media (max-width: 900px) {
  ul.products.columns-4,
  ul.products.columns-2 {
    grid-template-columns: repeat(2, 1fr);
  }
}

.product-grid-item {
  list-style: none;
}

/* Message bars and alerts */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
  background: var(--dark-1) !important;
  border-top: 3px solid var(--gold-bright) !important;
  color: var(--white) !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
  border-radius: var(--r-sm) !important;
  padding: 18px 24px !important;
  font-size: 14px !important;
  box-shadow: var(--shadow-card) !important;
}

.woocommerce-error {
  border-top-color: #f44336 !important;
  color: #f44336 !important;
}

.woocommerce-message a.button, .woocommerce-info a.button {
  background: var(--dark-3) !important;
  color: var(--gold-bright) !important;
  border: 1px solid var(--gold-line) !important;
  font-size: 11px !important;
  padding: 6px 14px !important;
}

/* Compact catalog feedback: keep a cart confirmation out of the product grid. */
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error {
  display: flex !important;
  align-items: center;
  gap: 14px;
  margin: 0 0 28px !important;
  border: 1px solid rgba(232,190,58,.62) !important;
  border-top: 3px solid var(--gold-bright) !important;
  line-height: 1.5;
}
.woocommerce .woocommerce-message a.button,
.woocommerce .woocommerce-info a.button {
  float: none !important;
  order: 2;
  flex: 0 0 auto;
  margin: 0 0 0 auto !important;
}

.ajax_add_to_cart.is-loading {
  opacity: .72;
  pointer-events: none;
  position: relative;
}

.ajax_add_to_cart.is-loading::after {
  animation: zg-spin .8s linear infinite;
  border: 2px solid rgba(255,255,255,.42);
  border-top-color: #fff;
  border-radius: 50%;
  content: '';
  height: 14px;
  margin-left: 8px;
  width: 14px;
}

.ajax_add_to_cart.added {
  filter: brightness(1.03);
}

@keyframes zg-spin {
  to { transform: rotate(360deg); }
}

.woocommerce-cart .woocommerce-message a.button.wc-forward,
.woocommerce-cart .woocommerce-message a.button[href*="/cart"] {
  display: none !important;
}

/* WooCommerce's default magnifier character can render as an emoji. */
.zg-product .woocommerce-product-gallery__trigger {
  display: grid !important;
  place-items: center;
  width: 42px !important;
  height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(184,148,69,.44) !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.92) !important;
  box-shadow: 0 10px 26px rgba(40,34,24,.14), 0 0 0 5px rgba(255,255,255,.55);
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: 0;
  overflow: hidden;
  position: absolute !important;
  right: 28px !important;
  top: 28px !important;
  z-index: 12;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.zg-product .woocommerce-product-gallery__trigger:hover,
.zg-product .woocommerce-product-gallery__trigger:focus {
  background: #fff !important;
  border-color: var(--zg-gold, #b89445) !important;
  box-shadow: 0 14px 30px rgba(40,34,24,.18);
  transform: translateY(-1px);
}
.zg-product .woocommerce-product-gallery__trigger::before {
  content: '';
  display: block;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 17px;
  height: 17px;
  background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B89445' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m16 16 4.2 4.2'/%3E%3C/svg%3E");
}
@media (max-width: 640px) { .woocommerce .woocommerce-message,.woocommerce .woocommerce-info,.woocommerce .woocommerce-error { align-items:flex-start; flex-direction:column; } .woocommerce .woocommerce-message a.button,.woocommerce .woocommerce-info a.button { margin:0 !important; } }

/* Products Catalog (Shop Page)
   Visual card styling (background/border/radius/shadow/hover-lift) lives on
   the inner .product-card div. The <li> stays unstyled so the two boxes
   don't both transform on hover and reveal a seam at the shared edge. */
.woocommerce ul.products li.product {
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

.woocommerce ul.products li.product img {
  background: #141414 !important;
  padding: 24px !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--dark-3) !important;
  height: auto !important;
  max-height: 300px !important;
  object-fit: contain !important;
  width: 100% !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 18px !important;
  letter-spacing: 1px !important;
  color: var(--white) !important;
  padding: 16px 20px 8px !important;
  margin: 0 !important;
}

.woocommerce ul.products li.product .price {
  color: var(--gold-bright) !important;
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 20px !important;
  padding: 0 20px 12px !important;
  margin: 0 !important;
  font-weight: 700 !important;
}

.woocommerce ul.products li.product .price del {
  color: var(--gray-500) !important;
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 14px !important;
  text-decoration: line-through !important;
  margin-right: 8px !important;
}

.woocommerce ul.products li.product .price ins {
  background: none !important;
  text-decoration: none !important;
}

.woocommerce span.onsale {
  position: absolute !important;
  z-index: 2 !important;
  background: var(--gold) !important;
  color: var(--black) !important;
  font-family: 'Space Grotesk', sans-serif !important;
  font-weight: 700 !important;
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  border-radius: var(--r-full) !important;
  top: 14px !important;
  right: 14px !important;
  left: auto !important;
  padding: 4px 10px !important;
  min-height: auto !important;
  min-width: auto !important;
  line-height: 1.2 !important;
}

/* Single Product Page details */
.woocommerce div.product {
  padding: 40px 0 100px !important;
}

.woocommerce div.product .images {
  margin-bottom: 40px !important;
}

.woocommerce div.product .woocommerce-product-gallery__wrapper {
  background: var(--dark-1) !important;
  border: 1px solid var(--dark-3) !important;
  border-radius: var(--r-xl) !important;
  overflow: hidden !important;
  padding: 30px !important;
  border-top: 3px solid var(--gold) !important;
}

.woocommerce div.product .summary {
  margin-bottom: 40px !important;
}

.woocommerce div.product .product_title {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: clamp(36px, 5vw, 56px) !important;
  letter-spacing: 1.5px !important;
  color: var(--white) !important;
  line-height: 1.1 !important;
  margin-bottom: 12px !important;
}

.woocommerce div.product p.price, .woocommerce div.product span.price {
  color: var(--gold-bright) !important;
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 38px !important;
  margin-bottom: 20px !important;
  border-bottom: 1px solid var(--dark-3) !important;
  padding-bottom: 16px !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 12px !important;
}

.woocommerce div.product p.price del, .woocommerce div.product span.price del {
  color: var(--gray-500) !important;
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 16px !important;
  text-decoration: line-through !important;
}

.woocommerce div.product p.price ins, .woocommerce div.product span.price ins {
  background: none !important;
  text-decoration: none !important;
}

.woocommerce-product-details__short-description {
  font-size: 15px !important;
  color: var(--gray-300) !important;
  line-height: 1.7 !important;
  margin-bottom: 24px !important;
}

.woocommerce div.product form.cart {
  display: flex !important;
  gap: 16px !important;
  align-items: center !important;
  margin: 30px 0 !important;
}

.woocommerce div.product form.cart .quantity {
  background: var(--dark-2) !important;
  border: 1px solid var(--dark-3) !important;
  border-radius: var(--r-xs) !important;
  padding: 4px 10px !important;
}

.woocommerce div.product form.cart .quantity input {
  background: transparent !important;
  color: var(--white) !important;
  border: none !important;
  outline: none !important;
  font-size: 15px !important;
  font-weight: 600 !important;
}

.woocommerce div.product form.cart .button {
  flex: 1 !important;
  padding: 16px 36px !important;
  font-size: 13px !important;
}

/* Tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  border-bottom: 1px solid var(--dark-3) !important;
  background: none !important;
  padding: 0 !important;
  margin-bottom: 24px !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 20px 0 0 !important;
  padding: 0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  color: var(--gray-500) !important;
  padding: 14px 4px !important;
  border-bottom: 2px solid transparent !important;
  display: block !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--gold-bright) !important;
  border-bottom-color: var(--gold-bright) !important;
}

.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel {
  padding: 20px 0 !important;
  font-size: 15px !important;
  color: var(--gray-300) !important;
  line-height: 1.8 !important;
}

.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel h2 {
  display: none !important;
}

.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel ul {
  padding-left: 20px !important;
  list-style: square !important;
  margin-top: 16px !important;
}

.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel li {
  margin-bottom: 8px !important;
}

/* Stars rating */
.star-rating span {
  color: var(--gold-bright) !important;
}

.woocommerce p.stars a {
  color: var(--gold-bright) !important;
}

/* Review form: comment-form-rating star picker (woocommerce-general.css,
   which provides the default star icon font, is dequeued for this theme). */
.comment-form-rating label {
  display: block;
  font-size: 13px;
  color: var(--gray-300);
  font-weight: 500;
  margin-bottom: 10px;
}

.comment-form-rating p.stars span {
  display: flex;
  gap: 6px;
}

.comment-form-rating p.stars a {
  position: relative;
  width: 26px;
  height: 26px;
  font-size: 0;
  line-height: 0;
  color: transparent !important;
}

.comment-form-rating p.stars a::before {
  content: '★';
  position: absolute;
  inset: 0;
  font-size: 22px;
  line-height: 26px;
  text-align: center;
  color: var(--dark-4);
}

.comment-form-rating p.stars a:hover::before,
.comment-form-rating p.stars a.active::before {
  color: var(--gold-bright);
}

/* Review form: text fields */
#commentform textarea,
#commentform input[type="text"],
#commentform input[type="email"] {
  background: var(--dark-2);
  border: 1px solid var(--dark-3);
  color: var(--white);
  padding: 12px 16px;
  border-radius: var(--r-xs);
  width: 100%;
  font-family: inherit;
  transition: var(--t);
}

#commentform textarea:focus,
#commentform input[type="text"]:focus,
#commentform input[type="email"]:focus {
  border-color: var(--gold-bright);
  outline: none;
}

#commentform label {
  display: block;
  font-size: 13px;
  color: var(--gray-300);
  font-weight: 500;
  margin-bottom: 8px;
}

#commentform .comment-form-comment,
#commentform .comment-form-author,
#commentform .comment-form-email {
  margin-bottom: 20px;
}

#commentform .comment-form-cookies-consent {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 20px;
  font-size: 13px;
  color: var(--gray-300);
}

#commentform .comment-form-cookies-consent label {
  margin-bottom: 0;
}

/* Product-detail redesign: live WooCommerce data in the static prototype layout. */
.zg-product-page { background:var(--black); min-height:100vh; padding:60px 0 120px; }
.woocommerce-breadcrumb { margin:0 0 32px; font-size:12px; color:var(--gray-500); }
.woocommerce-breadcrumb a { color:var(--gold); }
.zg-product { margin-bottom:0; }
.zg-product__grid { display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:start; margin-bottom:80px; }
.zg-product__gallery { position:sticky; top:106px; min-width:0; background:var(--dark-1); border:1px solid var(--dark-3); border-top:3px solid var(--gold); border-radius:var(--r-xl); padding:44px; box-shadow:var(--shadow-dark); }
.zg-product__gallery .woocommerce-product-gallery { margin:0 !important; width:100% !important; }
.zg-product__gallery .woocommerce-product-gallery__image img { width:100%; max-height:560px; object-fit:contain; }
.zg-product__summary { display:flex; flex-direction:column; gap:18px; }
.zg-product__brand { color:var(--gold-bright); font:700 11px/1.2 'Space Grotesk',sans-serif; letter-spacing:2px; text-transform:uppercase; }
.zg-product__summary .product_title { font-family:'Bebas Neue',sans-serif !important; font-size:clamp(38px,5vw,56px) !important; letter-spacing:1.5px; line-height:1.08; margin:0 !important; color:var(--white); }
.zg-product--sales-page .zg-product__grid { grid-template-columns:minmax(0,1.05fr) minmax(460px,.95fr); gap:72px; margin-bottom:34px; align-items:center; }
.zg-product--sales-page .zg-product__gallery { padding:52px; background:#fff; border-color:rgba(190,147,54,.28); box-shadow:0 28px 76px rgba(21,21,21,.1); }
.zg-product--sales-page .zg-product__gallery .flex-viewport { background:#fff; }
.zg-product--sales-page .zg-product__summary { gap:20px; }
.zg-product--sales-page .zg-product__summary .product_title { font-size:clamp(32px,3.5vw,48px) !important; color:var(--ink); opacity:.96; }
.zg-product__meta-row { display:flex; align-items:center; flex-wrap:wrap; gap:14px; }
.zg-product__rating .woocommerce-product-rating { margin:0 !important; display:flex; align-items:center; gap:10px; }
.zg-product__rating .woocommerce-review-link { color:var(--gray-300); font-size:13px; }
.zg-product__sku { background:var(--dark-3); border:1px solid var(--dark-4); border-radius:4px; color:var(--gray-100); font:600 12px/1 'Space Grotesk',sans-serif; padding:7px 10px; }
.zg-product__summary .price { margin:0 !important; }
.zg-product__description .woocommerce-product-details__short-description { margin:0 !important; }
.zg-product-sales-intro {
  display: grid;
  gap: 18px;
  padding: 32px;
  border: 1px solid rgba(190, 147, 54, .34);
  border-radius: 8px;
  background: linear-gradient(135deg, #fff, #fbf7ec);
  box-shadow: 0 22px 56px rgba(21, 21, 21, .08);
}
.zg-product-sales-intro h2 {
  margin: 0;
  color: var(--ink);
  font: 400 clamp(46px, 5.2vw, 72px)/.92 'Bebas Neue', sans-serif;
  letter-spacing: .04em;
}
.zg-product-sales-intro p {
  margin: 0;
  color: rgba(21, 21, 21, .76);
  font: 500 17px/1.85 'Space Grotesk', sans-serif;
}
.zg-product-sales-intro__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 2px;
}
.zg-product__trust { display:flex; flex-wrap:wrap; gap:10px; padding:2px 0; }
.zg-product__trust span { background:var(--dark-2); border:1px solid var(--dark-3); border-radius:999px; color:var(--gray-100); font:600 11px/1 'Space Grotesk',sans-serif; padding:8px 12px; }
.zg-product__purchase { border-top:1px solid var(--dark-3); padding-top:22px; }
.zg-product__purchase form.cart { margin:0 !important; padding:0 !important; }
.zg-product__purchase .quantity { height:54px; display:flex; align-items:center; }
.zg-product__purchase .quantity input.qty { height:42px; min-width:54px; }
.zg-product__purchase .single_add_to_cart_button { min-height:54px; }
.zg-product__summary .product_meta { display:none; }
.zg-product__retailers { display:flex; flex-wrap:wrap; gap:16px; margin-top:4px; }
.zg-product__retailers .btn { min-width:210px; text-align:center; justify-content:center; }
.zg-product__details { background:var(--dark-1); border:1px solid var(--dark-3); border-radius:var(--r-lg); padding:40px; margin-bottom:80px; }
.zg-product__details .related { margin-top:70px; padding-top:48px; border-top:1px solid var(--dark-3); }
.zg-product__details .related > h2 { font-family:'Bebas Neue',sans-serif; font-size:34px; letter-spacing:1.5px; color:var(--white); }
@media (max-width:1024px) { .zg-product__grid { grid-template-columns:1fr; gap:40px; } .zg-product__gallery { position:static; max-width:680px; margin:0 auto; } }
@media (max-width:640px) { .zg-product-page { padding:36px 0 72px; } .zg-product__gallery,.zg-product__details { padding:22px; } .zg-product__summary .product_title { font-size:42px !important; } .zg-product__retailers .btn { width:100%; min-width:0; } }

/* Product detail tabs: clean horizontal navigation with a readable content panel. */
.zg-product__details .woocommerce-tabs ul.tabs { display:flex !important; flex-wrap:wrap; gap:8px; border:0 !important; margin:0 0 30px !important; padding:0 !important; }
.zg-product__details .woocommerce-tabs ul.tabs::before,.zg-product__details .woocommerce-tabs ul.tabs::after { display:none !important; }
.zg-product__details .woocommerce-tabs ul.tabs li { display:block !important; float:none !important; margin:0 !important; padding:0 !important; border:1px solid var(--dark-3) !important; border-radius:6px !important; background:var(--dark-2) !important; }
.zg-product__details .woocommerce-tabs ul.tabs li::before,.zg-product__details .woocommerce-tabs ul.tabs li::after { display:none !important; }
.zg-product__details .woocommerce-tabs ul.tabs li a { display:block !important; padding:12px 18px !important; border:0 !important; color:var(--gray-300) !important; font:700 12px/1 'Space Grotesk',sans-serif !important; letter-spacing:1px !important; }
.zg-product__details .woocommerce-tabs ul.tabs li.active { background:var(--gold) !important; border-color:var(--gold) !important; }
.zg-product__details .woocommerce-tabs ul.tabs li.active a { color:var(--black) !important; }
.zg-product__details .woocommerce-Tabs-panel { max-width:920px; padding:0 !important; font:400 16px/1.8 'Space Grotesk',sans-serif !important; color:var(--gray-100) !important; }
.zg-product__details .woocommerce-Tabs-panel h2 { display:block !important; margin:0 0 18px !important; color:var(--white) !important; font:400 30px/1 'Bebas Neue',sans-serif !important; letter-spacing:1px; }
.zg-product__details .woocommerce-Tabs-panel p { margin:0 0 16px !important; }
.zg-product__details .woocommerce-Tabs-panel ul { list-style:none !important; padding:0 !important; margin:20px 0 0 !important; }
.zg-product__details .woocommerce-Tabs-panel ul li { position:relative; margin:0 0 12px !important; padding:0 0 0 20px !important; }
.zg-product__details .woocommerce-Tabs-panel ul li::before { content:'✓'; position:absolute; left:0; color:var(--gold-bright); font-weight:700; }
@media (max-width:640px) { .zg-product__details .woocommerce-tabs ul.tabs { display:grid !important; grid-template-columns:1fr; } .zg-product__details .woocommerce-tabs ul.tabs li a { padding:14px 16px !important; } }

/* Final layout guardrails: neutralize WooCommerce's float template rules. */
.zg-product .zg-product__grid > .product-gallery,
.zg-product .zg-product__grid > .product-summary,
.woocommerce div.product.zg-product .zg-product__gallery,
.woocommerce div.product.zg-product .zg-product__summary { float:none !important; width:auto !important; margin:0 !important; clear:none !important; }
.zg-product .zg-product__gallery .images,
.woocommerce div.product.zg-product .zg-product__gallery .images { float:none !important; width:100% !important; margin:0 !important; }
.zg-product .zg-product__gallery .woocommerce-product-gallery__wrapper { background:transparent !important; border:0 !important; border-radius:0 !important; padding:0 !important; }
.zg-product .zg-product__gallery .flex-viewport { border-radius:12px; overflow:hidden; background:#0b0b0b; }
.zg-product .zg-product__gallery .flex-control-thumbs { display:flex; flex-wrap:wrap; gap:10px; margin:18px 0 0 !important; }
.zg-product .zg-product__gallery .flex-control-thumbs li { float:none !important; width:72px !important; border:1px solid var(--dark-3); border-radius:6px; overflow:hidden; }
.zg-product .zg-product__gallery .flex-control-thumbs img { opacity:.6; margin:0 !important; }
.zg-product .zg-product__gallery .flex-control-thumbs img.flex-active { opacity:1; border:1px solid var(--gold); }
.zg-product-feature-icons {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  margin: -18px 0 58px;
  padding: 18px;
  border: 1px solid rgba(190, 147, 54, .24);
  border-radius: 8px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 20px 54px rgba(21,21,21,.06);
}
.zg-product-feature-icons__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 10px;
  min-height: 116px;
  padding: 16px 12px;
  border: 1px solid rgba(190, 147, 54, .24);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font: 800 12px/1.35 'Space Grotesk', sans-serif;
  letter-spacing: .02em;
}
.zg-product-feature-icons__mark {
  display: inline-grid;
  place-items: center;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: var(--gold);
  color: #fff;
  font-size: 13px;
  line-height: 1;
}
@media (max-width: 1024px) {
  .zg-product--sales-page .zg-product__grid { grid-template-columns:1fr; gap:36px; }
  .zg-product-feature-icons { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .zg-product-feature-icons { grid-template-columns: repeat(2, minmax(0, 1fr)); padding:12px; margin:0 0 36px; }
  .zg-product-feature-icons__item { min-height:104px; font-size:11px; }
  .zg-product-sales-intro { padding:24px; }
  .zg-product-sales-intro h2 { font-size:44px; }
  .zg-product-sales-intro__actions .btn { width:100%; justify-content:center; }
}

.zg-sales-page {
  display: grid;
  gap: 48px;
}
.zg-sales-page h2,
.zg-sales-page h3 {
  color: var(--ink) !important;
}
.zg-sales-page p {
  color: rgba(21, 21, 21, .72) !important;
  font-size: 17px !important;
  line-height: 1.85 !important;
}
.zg-sales-lead {
  max-width: 760px;
  padding: 28px;
  border: 1px solid rgba(190, 147, 54, .24);
  border-radius: 8px;
  background: #fff;
}
.zg-sales-eyebrow {
  margin: 0 0 10px;
  color: var(--gold) !important;
  font: 800 11px/1 'Space Grotesk', sans-serif !important;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.zg-sales-split {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(260px, .95fr);
  gap: 44px;
  align-items: center;
  padding: 42px;
  border: 1px solid rgba(190, 147, 54, .22);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 46px rgba(21, 21, 21, .05);
}
.zg-sales-split:first-of-type {
  border-top: 4px solid var(--gold);
  background: linear-gradient(135deg, #fff, #fbf4df);
}
.zg-sales-split:nth-of-type(2) {
  border-color: rgba(190, 147, 54, .38);
}
.zg-sales-split:nth-of-type(even) {
  background: #fbfaf6;
}
.zg-sales-split__media img,
.zg-sales-image-card img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  border: 1px solid rgba(190, 147, 54, .24);
}
.zg-sales-benefit {
  margin-top: 18px !important;
  padding: 18px 20px;
  border-left: 3px solid var(--gold);
  background: rgba(190, 147, 54, .08);
  border-radius: 6px;
}
.zg-sales-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.zg-sales-card {
  padding: 28px;
  border: 1px solid rgba(190, 147, 54, .24);
  border-radius: 8px;
  background: #fff;
}
.zg-sales-card h3 {
  margin-bottom: 10px !important;
}
.zg-sales-compare {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.zg-sales-compare__col {
  padding: 32px;
  border: 1px solid rgba(190, 147, 54, .22);
  border-radius: 8px;
  background: #fff;
}
.zg-sales-compare__col--earthsport {
  border-color: rgba(190, 147, 54, .52);
  background: linear-gradient(180deg, #fffaf0, #f5ead0);
  box-shadow: 0 18px 48px rgba(190,147,54,.12);
}
.zg-sales-compare__col h3 {
  margin-bottom: 16px !important;
}
.zg-sales-compare__col ul {
  margin: 0 !important;
}
.zg-sales-compare__col li {
  padding-left: 0 !important;
  color: rgba(21, 21, 21, .7);
}
.zg-sales-compare__col li::before {
  display: none;
}
.zg-sales-compare__col--earthsport li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--ink);
  font-weight: 700;
}
.zg-sales-compare__col--earthsport li span {
  display: inline-grid;
  place-items: center;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: var(--gold);
  color: #fff;
  font-size: 12px;
}
.zg-sales-closing {
  display: grid;
  gap: 18px;
  justify-items: start;
  padding: 48px;
  border-radius: 8px;
  border: 1px solid rgba(190, 147, 54, .34);
  background: linear-gradient(135deg, #fff, #f8f3e6);
}
@media (max-width: 900px) {
  .zg-sales-split,
  .zg-sales-compare,
  .zg-sales-card-grid { grid-template-columns: 1fr; }
  .zg-sales-split { padding:28px; gap:24px; }
}
.zg-product .zg-product__summary .price { border-bottom:1px solid var(--dark-3) !important; padding:0 0 18px !important; font-size:42px !important; }
.zg-product .zg-product__summary .stock { color:var(--gold-bright); font-size:12px; margin:0; }
.zg-product .zg-product__purchase form.cart { display:grid !important; grid-template-columns:86px 1fr; align-items:center; gap:12px; }
.zg-product .zg-product__purchase form.cart .quantity { width:86px; box-sizing:border-box; justify-content:center; }
.zg-product .zg-product__purchase form.cart .single_add_to_cart_button { width:100%; margin:0 !important; }
.zg-product .zg-product__purchase form.cart .quantity,
.zg-product .zg-product__purchase form.cart .quantity input.qty { background:var(--dark-2) !important; color:var(--white) !important; border:0 !important; box-shadow:none !important; }
.zg-product .zg-product__purchase form.cart .quantity { border:1px solid var(--dark-3) !important; border-radius:6px; padding:0 !important; overflow:hidden; }
.zg-product .zg-product__purchase form.cart .quantity input.qty { width:100% !important; height:52px !important; min-height:52px; padding:0 10px !important; font:700 15px/52px 'Space Grotesk',sans-serif !important; text-align:center; -moz-appearance:textfield; }
.zg-product .zg-product__purchase form.cart .quantity input.qty::-webkit-inner-spin-button,
.zg-product .zg-product__purchase form.cart .quantity input.qty::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.zg-product .zg-product__purchase form.cart .single_add_to_cart_button { background:linear-gradient(135deg,var(--gold),var(--gold-bright)) !important; color:var(--black) !important; border:0 !important; border-radius:6px !important; font:700 13px/1 'Space Grotesk',sans-serif !important; letter-spacing:1.5px; text-transform:uppercase; transition:transform .2s ease,filter .2s ease; }
.zg-product .zg-product__purchase form.cart .single_add_to_cart_button:hover { filter:brightness(1.08); transform:translateY(-1px); }
.zg-product .zeus-product-specs { border-top:1px solid var(--dark-3); padding-top:24px; }
.zg-product .zeus-product-specs dl { background:var(--dark-2); border:1px solid var(--dark-3); border-radius:8px; padding:18px; }
.zg-product__details .woocommerce-tabs { margin:0 !important; }
.zg-product__details .upsells,.zg-product__details .related { width:100% !important; float:none !important; }
@media (max-width:640px) { .zg-product .zg-product__purchase form.cart { grid-template-columns:1fr; } .zg-product .zg-product__purchase form.cart .quantity { width:100%; } }

/* Cart Table and page */
.woocommerce-cart-form {
  background: var(--dark-1) !important;
  border: 1px solid var(--dark-3) !important;
  border-radius: var(--r-lg) !important;
  padding: 32px !important;
  margin-bottom: 40px !important;
  overflow-x: auto;
}

.woocommerce-cart table.shop_table {
  border: none !important;
  background: transparent !important;
  width: 100%;
}

.woocommerce-cart table.shop_table th {
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--gold) !important;
  border-bottom: 1px solid var(--dark-3) !important;
  padding: 12px 10px !important;
}

.woocommerce-cart table.shop_table td {
  border-bottom: 1px solid var(--dark-3) !important;
  padding: 24px 10px !important;
  color: var(--white) !important;
}

.woocommerce-cart table.shop_table td.product-name a {
  font-weight: 600 !important;
  color: var(--white) !important;
  transition: color var(--t) !important;
}

.woocommerce-cart table.shop_table td.product-name a:hover {
  color: var(--gold-bright) !important;
}

.woocommerce-cart table.shop_table td.product-remove a {
  color: var(--gold-bright) !important;
}

.woocommerce-cart table.shop_table td.product-quantity input {
  background: var(--dark-2) !important;
  border: 1px solid var(--dark-3) !important;
  color: var(--white) !important;
  border-radius: var(--r-xs) !important;
  padding: 6px !important;
}

.woocommerce-cart table.shop_table td.actions {
  padding-top: 32px !important;
  border-bottom: none !important;
}

.woocommerce-cart table.shop_table td.actions .coupon input.input-text {
  background: var(--dark-2) !important;
  border: 1px solid var(--dark-3) !important;
  color: var(--white) !important;
  border-radius: var(--r-xs) !important;
  padding: 12px 16px !important;
  font-size: 13px !important;
}

.woocommerce-cart table.shop_table td.actions .coupon .button {
  background: var(--dark-3) !important;
  color: var(--white) !important;
  border: 1px solid var(--dark-4) !important;
  font-size: 11px !important;
  padding: 12px 24px !important;
  font-weight: 600 !important;
}

/* Cart Totals section */
.cart-collaterals {
  margin-top: 40px !important;
}

.cart-collaterals .cart_totals {
  background: var(--dark-1) !important;
  border: 1px solid var(--dark-3) !important;
  border-radius: var(--r-lg) !important;
  padding: 40px !important;
  float: none !important;
  width: 100% !important;
  max-width: 600px !important;
  margin-left: auto !important;
}

.cart-collaterals .cart_totals h2 {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 28px !important;
  letter-spacing: 1.5px !important;
  color: var(--white) !important;
  margin-bottom: 24px !important;
}

.cart-collaterals .cart_totals table.shop_table_responsive {
  border: none !important;
  width: 100% !important;
  margin-bottom: 28px !important;
}

.cart-collaterals .cart_totals table td, .cart-collaterals .cart_totals table th {
  border-bottom: 1px solid var(--dark-3) !important;
  padding: 16px 0 !important;
  color: var(--white) !important;
}

.cart-collaterals .cart_totals table th {
  color: var(--gray-300) !important;
  font-weight: 500 !important;
}

.cart-collaterals .cart_totals table .order-total th, .cart-collaterals .cart_totals table .order-total td {
  border-bottom: none !important;
  font-family: 'Space Grotesk', sans-serif !important;
  font-weight: 700 !important;
  font-size: 18px !important;
}

.cart-collaterals .cart_totals table .order-total td .amount {
  color: var(--gold-bright) !important;
}

.cart-collaterals .cart_totals .checkout-button {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  padding: 16px !important;
}

/* Checkout Form styling */
.woocommerce-checkout form.checkout {
  display: grid !important;
  grid-template-columns: 1.1fr 0.9fr !important;
  gap: 40px !important;
  margin-top: 40px !important;
}

@media (max-width: 900px) {
  .woocommerce-checkout form.checkout {
    grid-template-columns: 1fr !important;
  }
}

.woocommerce-checkout h3 {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 24px !important;
  letter-spacing: 1px !important;
  color: var(--white) !important;
  margin-bottom: 20px !important;
  text-transform: uppercase !important;
}

.woocommerce-checkout .col2-set {
  background: var(--dark-1) !important;
  border: 1px solid var(--dark-3) !important;
  border-radius: var(--r-lg) !important;
  padding: 40px !important;
}

.woocommerce-checkout #order_review_heading {
  display: none !important;
}

.woocommerce-checkout #order_review {
  background: var(--dark-1) !important;
  border: 1px solid var(--dark-3) !important;
  border-radius: var(--r-lg) !important;
  padding: 40px !important;
  height: fit-content !important;
  position: sticky;
  top: 100px;
}

.woocommerce-checkout input.input-text, .woocommerce-checkout select, .woocommerce-checkout textarea {
  background: var(--dark-2) !important;
  border: 1px solid var(--dark-3) !important;
  color: var(--white) !important;
  padding: 12px 16px !important;
  border-radius: var(--r-xs) !important;
  width: 100% !important;
  transition: var(--t) !important;
}

.woocommerce-checkout input.input-text:focus, .woocommerce-checkout select:focus, .woocommerce-checkout textarea:focus {
  border-color: var(--gold-bright) !important;
  outline: none !important;
}

.woocommerce-checkout label {
  font-size: 13px !important;
  color: var(--gray-300) !important;
  font-weight: 500 !important;
  margin-bottom: 6px !important;
  display: block !important;
}

.woocommerce-checkout .form-row {
  margin-bottom: 20px !important;
}

/* Order review items */
.woocommerce-checkout table.shop_table {
  width: 100% !important;
  border: none !important;
  margin-bottom: 24px !important;
}

.woocommerce-checkout table.shop_table td, .woocommerce-checkout table.shop_table th {
  border-bottom: 1px solid var(--dark-3) !important;
  padding: 14px 0 !important;
  color: var(--white) !important;
}

.woocommerce-checkout table.shop_table th {
  color: var(--gray-300) !important;
  font-weight: 500 !important;
}

.woocommerce-checkout table.shop_table td.product-total .amount {
  color: var(--white) !important;
}

.woocommerce-checkout table.shop_table .order-total td .amount {
  color: var(--gold-bright) !important;
  font-weight: 700 !important;
}

/* Payment panel */
.woocommerce-checkout #payment {
  background: var(--dark-2) !important;
  border: 1px solid var(--dark-3) !important;
  border-radius: var(--r-md) !important;
  padding: 24px !important;
}

.woocommerce-checkout #payment ul.payment_methods {
  border-bottom: 1px solid var(--dark-3) !important;
  padding-bottom: 16px !important;
  margin-bottom: 16px !important;
}

.woocommerce-checkout #payment div.payment_box {
  background: var(--dark-3) !important;
  color: var(--gray-300) !important;
  font-size: 13px !important;
  border-radius: var(--r-xs) !important;
}

.woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color: var(--dark-3) !important;
}

.woocommerce-checkout #place_order {
  display: block !important;
  width: 100% !important;
  padding: 18px !important;
  font-size: 14px !important;
  margin-top: 20px !important;
}

/* ================================================
   HEADER ENHANCEMENTS
   ================================================ */

/* Compact account/cart actions are grouped beside Shop Now. */
.header-actions { display:flex; align-items:center; gap:8px; margin-left:16px; }
.header-account,
.header-cart {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 30px;
  height: 30px;
  color: var(--gold);
  transition: var(--t);
  border-radius: 4px;
}
.header-account:hover,
.header-cart:hover {
  color: var(--gold-bright);
  background: var(--gold-dim);
}
.header-account svg,
.header-cart svg {
  width: 17px;
  height: 17px;
  stroke: currentColor;
}
.header-actions .nav-shop-btn { margin-left:4px; }
.cart-count {
  position: absolute;
  top: -8px;
  right: -8px;
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-bright) 100%);
  color: var(--black);
  font-size: 10px;
  font-weight: 700;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--r-full);
  box-shadow: 0 2px 8px rgba(201, 162, 39, 0.4);
}

/* ================================================
   RESPONSIVE DESIGN
   ================================================ */

/* Tablet Breakpoint (768px and below) */
@media (max-width: 768px) {
  .container {
    padding: 0 20px;
  }

  .header-inner {
    height: 64px;
    gap: 16px;
  }

  .site-logo__name {
    font-size: 18px;
  }

  .site-logo__tagline {
    font-size: 8px;
  }

  .site-nav {
    display: none;
  }

  .nav-shop-btn {
    display: none;
  }

  .header-actions { margin-left:auto; gap:4px; }
  .header-account { display:none; }

  .mobile-toggle {
    display: flex;
  }

  .header-cart {
    width: 32px;
    height: 32px;
  }

  .section-title {
    font-size: clamp(32px, 8vw, 52px);
  }

  .page-hero {
    padding: 60px 0 50px;
  }

  .page-hero__title {
    font-size: clamp(36px, 8vw, 56px);
  }

  .page-hero__sub {
    font-size: 15px;
  }

  .footer-top {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }

  .footer-bottom__links {
    flex-wrap: wrap;
    gap: 16px;
  }

  .woocommerce ul.products {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .woocommerce div.product {
    padding: 24px 0 60px !important;
  }

  .woocommerce-checkout form.checkout {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  /* Product gallery responsive */
  div[style*="grid-template-columns: 1fr 1.2fr"] {
    grid-template-columns: 1fr !important;
    gap: 30px !important;
  }
}

/* Mobile Breakpoint (480px and below) */
@media (max-width: 480px) {
  :root {
    font-size: 15px;
  }

  .container {
    padding: 0 16px;
  }

  .header-inner {
    height: 56px;
  }

  .site-logo__name {
    font-size: 14px;
  }

  .site-logo {
    gap: 8px;
  }

  .site-logo img {
    height: 36px;
  }

  .section-title {
    font-size: clamp(24px, 7vw, 36px);
    margin-bottom: 16px;
  }

  .section-header {
    margin-bottom: 40px;
  }

  .eyebrow {
    font-size: 10px;
    margin-bottom: 12px;
  }

  .eyebrow::before, .eyebrow::after {
    width: 16px;
  }

  .page-hero {
    padding: 48px 0 40px;
  }

  .page-hero__title {
    font-size: clamp(28px, 6vw, 40px);
    margin-bottom: 12px;
  }

  .page-hero__sub {
    font-size: 14px;
    line-height: 1.6;
  }

  .btn, .woocommerce a.button, .woocommerce button.button {
    padding: 12px 20px;
    font-size: 11px;
  }

  .btn--sm {
    padding: 8px 16px;
  }

  .footer-brand__logo {
    font-size: 20px;
  }

  .footer-col__title {
    font-size: 9px;
  }

  .footer-links a, .footer-links ul li a {
    font-size: 13px;
  }

  .footer-bottom p, .footer-bottom__links a {
    font-size: 11px;
  }

  .mobile-nav__links a, .mobile-nav__links ul li a {
    font-size: 24px;
    padding: 16px 0;
  }

  .woocommerce ul.products {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 16px;
    padding: 12px 16px 6px;
  }

  .woocommerce ul.products li.product .price {
    font-size: 18px;
    padding: 0 16px 12px;
  }

  .woocommerce div.product .product_title {
    font-size: clamp(24px, 5vw, 36px);
  }

  .woocommerce div.product p.price, .woocommerce div.product span.price {
    font-size: 28px;
  }

  .woocommerce-checkout .col2-set,
  .woocommerce-checkout #order_review {
    padding: 24px !important;
  }

  .woocommerce-checkout h3 {
    font-size: 18px;
  }

  .woocommerce-checkout form.checkout {
    margin-top: 24px !important;
  }

  /* Mobile cart table */
  .woocommerce-cart-form {
    padding: 16px !important;
    overflow-x: auto;
  }

  .woocommerce-cart table.shop_table th,
  .woocommerce-cart table.shop_table td {
    padding: 12px 8px !important;
    font-size: 12px;
  }

  .woocommerce-cart table.shop_table td.product-remove,
  .woocommerce-cart table.shop_table td.product-thumbnail {
    display: none;
  }

  /* Mobile checkout */
  .woocommerce-checkout #order_review {
    position: static;
    top: auto;
  }

}

/* ================================================
   UTILITY CLASSES
   ================================================ */

/* Spacing Utilities */
.mt-0  { margin-top: 0 !important; }
.mt-1  { margin-top: 8px !important; }
.mt-2  { margin-top: 16px !important; }
.mt-3  { margin-top: 24px !important; }
.mt-4  { margin-top: 32px !important; }
.mt-5  { margin-top: 48px !important; }
.mt-6  { margin-top: 64px !important; }

.mb-0  { margin-bottom: 0 !important; }
.mb-1  { margin-bottom: 8px !important; }
.mb-2  { margin-bottom: 16px !important; }
.mb-3  { margin-bottom: 24px !important; }
.mb-4  { margin-bottom: 32px !important; }
.mb-5  { margin-bottom: 48px !important; }
.mb-6  { margin-bottom: 64px !important; }

/* Fluent Forms — Contact page treatment matched to contact.html. */
.fluentform .ff-el-group { margin-bottom: 24px !important; }
.fluentform .ff-el-input--label label {
  color: var(--white) !important;
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .5px;
}
.fluentform .ff-el-form-control {
  width: 100% !important;
  padding: 14px 18px !important;
  border: 1px solid var(--dark-4) !important;
  border-radius: var(--r-sm) !important;
  background: var(--dark-2) !important;
  color: var(--white) !important;
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 14px !important;
  box-shadow: none !important;
}
.fluentform textarea.ff-el-form-control { min-height: 140px !important; }
.fluentform .ff-el-form-control:focus {
  border-color: var(--gold-bright) !important;
  box-shadow: 0 0 10px var(--gold-glow) !important;
}
.fluentform .ff-btn-submit {
  width: 100% !important;
  min-height: 52px;
  border: 0 !important;
  border-radius: var(--r-sm) !important;
  background: linear-gradient(135deg, var(--gold), var(--gold-bright)) !important;
  color: var(--black) !important;
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}
.fluentform .ff-message-success { border-color: var(--gold) !important; color: var(--gray-300) !important; }

.py-0  { padding: 0 !important; }
.py-1  { padding: 8px 0 !important; }
.py-2  { padding: 16px 0 !important; }
.py-3  { padding: 24px 0 !important; }
.py-4  { padding: 32px 0 !important; }
.py-5  { padding: 48px 0 !important; }
.py-6  { padding: 64px 0 !important; }

.px-0  { padding: 0 !important; }
.px-1  { padding: 0 8px !important; }
.px-2  { padding: 0 16px !important; }
.px-3  { padding: 0 24px !important; }
.px-4  { padding: 0 32px !important; }

/* Text Utilities */
.text-center { text-align: center !important; }
.text-left   { text-align: left !important; }
.text-right  { text-align: right !important; }

.text-white { color: var(--white) !important; }
.text-gold  { color: var(--gold) !important; }
.text-gold-bright { color: var(--gold-bright) !important; }
.text-gray  { color: var(--gray-300) !important; }

.text-sm  { font-size: 13px !important; }
.text-md  { font-size: 16px !important; }
.text-lg  { font-size: 20px !important; }
.text-xl  { font-size: 24px !important; }

/* Display Utilities */
.d-none { display: none !important; }
.d-block { display: block !important; }
.d-flex { display: flex !important; }
.d-grid { display: grid !important; }

.flex-center { display: flex; align-items: center; justify-content: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
.flex-col { display: flex; flex-direction: column; }

.gap-1 { gap: 8px !important; }
.gap-2 { gap: 16px !important; }
.gap-3 { gap: 24px !important; }
.gap-4 { gap: 32px !important; }

/* Background Colors */
.bg-black { background: var(--black) !important; }
.bg-dark-1 { background: var(--dark-1) !important; }
.bg-dark-2 { background: var(--dark-2) !important; }
.bg-dark-3 { background: var(--dark-3) !important; }

/* Borders */
.border-top { border-top: 1px solid var(--dark-3) !important; }
.border-bottom { border-bottom: 1px solid var(--dark-3) !important; }
.border-gold { border-color: var(--gold) !important; }

/* Opacity */
.opacity-50 { opacity: 0.5 !important; }
.opacity-75 { opacity: 0.75 !important; }

/* ================================================
   COMPONENT STYLES
   ================================================ */

/* Card Component */
.card {
  background: var(--dark-2);
  border: 1px solid var(--dark-3);
  border-radius: var(--r-lg);
  padding: 28px;
  transition: var(--t);
}
.card:hover {
  border-color: var(--gold-line);
  transform: translateY(-4px);
  box-shadow: var(--shadow-card);
}
.card-header { margin-bottom: 20px; }
.card-body { font-size: 15px; color: var(--gray-300); line-height: 1.7; }
.card-footer { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--dark-3); }

/* Product Card Component */
.product-card {
  background: var(--dark-2);
  border: 1px solid var(--dark-3);
  border-radius: var(--r-lg);
  overflow: hidden;
  transition: var(--t);
  display: flex;
  flex-direction: column;
  height: 100%;
}

.product-card:hover {
  border-color: var(--gold-line);
  transform: translateY(-6px);
  box-shadow: var(--shadow-dark);
}

.product-card__image {
  position: relative;
  background: #141414;
  padding: 20px;
  overflow: hidden;
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-card__image img {
  width: 80%;
  height: 80%;
  object-fit: contain;
}
/* WooCommerce's generic loop image rule sets height:auto and padding, which
   can override the card frame and crop portrait uploads. Keep a fixed media
   frame, but always show the entire image inside it. Capping at 80% (instead
   of 100%) guarantees the same visible margin on every card regardless of
   how tightly each source photo was originally shot/cropped. */
.woocommerce ul.products li.product .product-card__image img {
  width: 80% !important;
  height: 80% !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  object-fit: contain !important;
  object-position: center center;
}

.product-card__badge {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
}

.product-card__info {
  padding: 24px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.product-card__brand {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--gold-pale);
  margin-bottom: 6px;
}

.product-card__title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 18px;
  letter-spacing: 0.5px;
  color: var(--white);
  margin-bottom: 12px;
  line-height: 1.2;
}

.product-card__title a {
  color: inherit;
  transition: color var(--t);
}

.product-card__title a:hover {
  color: var(--gold-bright);
}

.product-card__rating {
  margin-bottom: 12px;
  font-size: 13px;
}

.product-card__specs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}

.product-card__spec {
  font-size: 10px;
  background: var(--dark-3);
  color: var(--gray-100);
  padding: 3px 8px;
  border-radius: var(--r-xs);
  border: 1px solid var(--dark-4);
}

.product-card__price {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 20px;
  color: var(--gold-bright);
  margin-bottom: 12px;
  font-weight: 700;
}

.product-card__price del {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: var(--gray-500);
  margin-right: 8px;
}

.product-card__price ins {
  text-decoration: none;
}

.product-card__actions {
  display: flex;
  gap: 8px;
  margin-top: auto;
}

.product-card__actions .btn,
.product-card__actions .button {
  flex: 1;
  font-size: 11px !important;
  padding: 10px 12px !important;
  letter-spacing: 1px;
  text-align: center;
}

/* Pagination Component */
.pagination-nav {
  margin: 56px 0;
  padding: 0;
}

.pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  list-style: none;
}

.pagination li {
  display: inline-block;
}

.pagination .btn {
  padding: 10px 14px;
  font-size: 11px;
  min-width: 40px;
  text-align: center;
}

.page-num--active {
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-bright) 100%) !important;
  color: var(--black) !important;
  cursor: default;
}

/* Shop Sidebar Filters */
.shop-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 40px;
  align-items: start;
  position: relative;
  z-index: 2;
}

.shop-sidebar {
  position: sticky;
  top: 106px;
}

@media (max-width: 1024px) {
  .shop-layout { grid-template-columns: 1fr; }
  .shop-sidebar { position: static; display: flex; gap: 16px; flex-wrap: wrap; }
  .shop-sidebar .filter-card { flex: 1; min-width: 240px; margin-bottom: 0; }
}

.filter-card {
  background: var(--dark-1);
  border: 1px solid var(--dark-3);
  border-radius: var(--r-md);
  padding: 28px;
  margin-bottom: 24px;
  box-shadow: var(--shadow-card);
}

.filter-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: var(--white);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--dark-3);
}

.filter-option {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  cursor: pointer;
  color: var(--gray-300);
  transition: var(--t);
}

.filter-option:hover {
  color: var(--gold-bright);
}

.filter-option input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--gold-bright);
  cursor: pointer;
  background: var(--dark-3);
  border: 1px solid var(--dark-4);
}

.filter-option label {
  font-size: 14px;
  cursor: pointer;
}

.filter-option.active label {
  color: var(--gold-bright);
  font-weight: 600;
}

.filter-btn {
  width: 100%;
  justify-content: center;
  margin-top: 12px;
}

.page-num--ellipsis {
  display: flex;
  align-items: center;
  padding: 0 4px;
  color: var(--gray-500);
}

/* Breadcrumb Component */
.breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
  font-size: 12px;
  flex-wrap: wrap;
}

.breadcrumb ul {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.breadcrumb li {
  display: flex;
  align-items: center;
}

.breadcrumb a {
  color: var(--gold);
  transition: color var(--t);
}

.breadcrumb a:hover {
  color: var(--gold-bright);
}

.breadcrumb .separator {
  color: var(--gray-500);
}

.breadcrumb .active {
  color: var(--gray-300);
}

/* Alert Component */
.alert {
  padding: 16px 20px;
  border-radius: var(--r-md);
  border-left: 4px solid transparent;
  font-size: 14px;
  margin-bottom: 16px;
}
.alert-success {
  background: rgba(76, 175, 80, 0.1);
  border-left-color: #4caf50;
  color: #4caf50;
}
.alert-error {
  background: rgba(244, 67, 54, 0.1);
  border-left-color: #f44336;
  color: #f44336;
}
.alert-info {
  background: var(--gold-dim);
  border-left-color: var(--gold);
  color: var(--gold-bright);
}

/* Badge Component */
.badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: var(--r-full);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.badge-gold {
  background: var(--gold-dim);
  color: var(--gold-bright);
}
.badge-dark {
  background: var(--dark-3);
  color: var(--gray-300);
}

/* ================================================
   REVEAL ANIMATIONS
   ================================================ */

.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s cubic-bezier(0.34, 1.56, 0.64, 1), transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal--fade {
  transform: none;
}

.reveal--slide-left {
  transform: translateX(-30px);
}

.reveal--slide-right {
  transform: translateX(30px);
}

/* ================================================
   LOADING & STATES
   ================================================ */

.loading {
  opacity: 0.6;
  pointer-events: none;
  cursor: not-allowed;
}

.spinner {
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 2px solid var(--dark-3);
  border-top-color: var(--gold);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/* ================================================
   ACCESSIBILITY
   ================================================ */

/* Skip Link */
.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: var(--gold);
  color: var(--black);
  padding: 8px;
  text-decoration: none;
  z-index: 100;
  font-weight: 700;
}

.skip-link:focus {
  top: 0;
}

/* Focus Visible */
*:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ================================================
   TOAST NOTIFICATIONS
   ================================================ */

.toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  background: rgba(255, 255, 255, .96);
  border: 1px solid rgba(184, 148, 69, .28);
  border-radius: 8px;
  padding: 12px;
  box-shadow: 0 18px 48px rgba(40, 34, 24, .16);
  z-index: 10000;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .24s ease, transform .24s ease;
  width: min(340px, calc(100vw - 32px));
  backdrop-filter: blur(14px);
}

.toast.visible {
  opacity: 1;
  transform: translateX(0);
}

.toast__content {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 30px;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  color: var(--zg-ink, #151515);
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .2px;
}

.toast__icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: rgba(184, 148, 69, .14);
  color: var(--zg-gold, #b89445);
  font-size: 16px;
  line-height: 1;
}

.toast__message {
  min-width: 0;
}

.toast__close {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 999px;
  color: rgba(21, 21, 21, .46);
  font-size: 18px;
  cursor: pointer;
  line-height: 1;
  transition: background .2s ease, color .2s ease;
}

.toast__close:hover {
  background: rgba(184, 148, 69, .10);
  color: var(--zg-ink, #151515);
}

.toast--success {
  border-color: rgba(184, 148, 69, .34);
}

.toast--success .toast__content {
  color: var(--zg-ink, #151515);
}

.toast--error {
  border-color: rgba(180, 54, 54, .34);
}

.toast--error .toast__icon {
  background: rgba(180, 54, 54, .12);
  color: #b43636;
}

.toast--info {
  border-color: rgba(184, 148, 69, .28);
}

.toast--info .toast__icon {
  background: rgba(184, 148, 69, .14);
  color: var(--zg-gold, #b89445);
}

@media (max-width: 480px) {
  .toast {
    bottom: 16px;
    right: 16px;
    left: 16px;
    width: auto;
    transform: translateY(18px);
  }

  .toast.visible {
    transform: translateY(0);
  }
}

/* ── LEARN ARTICLE CARD ── */
.zg-article-card {
  background: var(--dark-1);
  border: 1px solid var(--dark-3);
  border-radius: var(--r-xl);
  padding: 56px;
  box-shadow: var(--shadow-dark);
}

.zg-article-h2 .elementor-heading-title {
  text-transform: uppercase;
}

.zg-heading-line {
  flex: 0 0 54px;
  height: 3px;
  background: var(--zg-gold);
  align-self: center;
  border-radius: 999px;
}

.zg-article-card ul li {
  margin-bottom: 12px;
}

.zg-article-card ul li:last-child {
  margin-bottom: 0;
}

.zg-callout--card,
.zg-callout--tip,
.zg-callout--alert {
  padding: 28px;
  margin: 32px 0;
}

.zg-callout--card h4,
.zg-callout--tip h4,
.zg-callout--alert h4 {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 8px;
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 1px;
}

.zg-callout--card p,
.zg-callout--tip p,
.zg-callout--alert p {
  margin-bottom: 0;
  font-size: 14px;
  color: var(--gray-300);
}

.zg-callout--card {
  background: var(--dark-2);
  border: 1px solid var(--dark-3);
  border-left: 3px solid var(--gold);
  border-radius: var(--r-md);
}

.zg-callout--tip {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--dark-3);
  border-radius: var(--r-md);
}

.zg-callout--alert {
  background: rgba(201, 162, 39, 0.06);
  border: 1px solid var(--gold-bright);
  border-left: 4px solid var(--gold-bright);
  border-radius: var(--r-xs);
}

.zg-article-footer-btns {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

@media (max-width: 768px) {
  .zg-article-card {
    padding: 36px 24px;
  }
}

/* ── LEARN HUB PAGE ── */
#learn-main {
  padding: 80px 0 100px;
  background: var(--black);
  position: relative;
}
#learn-main::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(circle 800px at 0% 10%, rgba(201,162,39,0.04) 0%, transparent 70%);
  pointer-events: none;
}

.articles-grid--full {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  margin-bottom: 80px;
  position: relative;
  z-index: 2;
}
.article-full {
  background: var(--dark-2);
  border: 1px solid var(--dark-3);
  border-radius: var(--r-lg);
  overflow: hidden;
  transition: var(--t);
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-card);
}
.article-full:hover {
  transform: translateY(-5px);
  border-color: var(--gold-line);
  box-shadow: var(--shadow-dark);
}

.article-full__image {
  height: 180px;
  background: linear-gradient(135deg, var(--dark-1) 0%, var(--dark-3) 100%);
  border-bottom: 1px solid var(--dark-3);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: var(--t);
}
.article-full:hover .article-full__image {
  background: linear-gradient(135deg, var(--dark-3) 0%, var(--dark-4) 100%);
}
.article-full__image svg {
  width: 72px;
  height: 72px;
  color: var(--gold);
  opacity: 0.65;
  transition: var(--t);
}
.article-full:hover .article-full__image svg {
  transform: scale(1.08);
  opacity: 0.95;
  color: var(--gold-bright);
}

.article-full__header {
  background: var(--dark-1);
  padding: 30px 40px;
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--dark-3);
}
.article-full__num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 72px;
  font-weight: 400;
  color: var(--dark-4);
  line-height: 1;
  position: absolute;
  top: 10px; right: 28px;
  letter-spacing: 2px;
  transition: var(--t);
}
.article-full:hover .article-full__num {
  color: var(--gold-bright);
}
.article-full__label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.5px;
  color: var(--gold-bright);
  text-transform: uppercase;
  margin-bottom: 12px;
  display: block;
  position: relative;
  z-index: 2;
}
.article-full__title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 32px;
  letter-spacing: 1.5px;
  color: var(--white);
  line-height: 1.2;
  position: relative;
  z-index: 2;
}

.article-full__body {
  padding: 28px 32px 32px;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.article-full__desc {
  font-size: 15px;
  color: var(--gray-300);
  line-height: 1.65;
  margin-bottom: 22px;
  flex: 0 1 auto;
}

.article-full__points {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 24px;
}
.article-full__point {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 14px;
  color: var(--gray-300);
  line-height: 1.5;
}
.article-full__point::before {
  content: '◆';
  color: var(--gold-bright);
  font-size: 10px;
  flex-shrink: 0;
  margin-top: 4px;
}

.article-full__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--gold-bright);
  transition: var(--t);
}
.article-full__link svg {
  width: 12px; height: 12px;
  fill: currentColor;
  transition: transform var(--t);
}
.article-full__link:hover {
  color: var(--gold-pale);
}
.article-full__link:hover svg {
  transform: translateX(4px);
}

.safety-banner {
  background: var(--dark-1);
  border: 1px solid var(--gold-bright);
  border-radius: var(--r-lg);
  padding: 40px;
  margin: 80px 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 32px;
  align-items: start;
  position: relative;
  z-index: 2;
  box-shadow: 0 0 30px rgba(201,162,39,0.05);
}
.safety-banner__icon {
  font-size: 42px;
  color: var(--gold-bright);
}
.safety-banner__title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 26px;
  letter-spacing: 1px;
  color: var(--white);
  margin-bottom: 10px;
}
.safety-banner__text {
  font-size: 14px;
  color: var(--gray-300);
  line-height: 1.7;
}
.safety-banner__list {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.safety-banner__tag {
  font-size: 11px;
  background: var(--gold-dim);
  color: var(--gold-bright);
  border: 1px solid var(--gold-line);
  padding: 5px 14px;
  border-radius: var(--r-full);
  font-weight: 600;
  letter-spacing: 0.5px;
}

.steps-section {
  padding: 120px 0;
  background: var(--dark-1);
  border-top: 1px solid var(--dark-3);
  border-bottom: 1px solid var(--dark-3);
}
.steps-section h3.brand-header {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 28px;
  color: var(--gold-bright);
  margin-bottom: 30px;
  letter-spacing: 1px;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 12px;
}
.steps-section h3.brand-header::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--gold-line);
}
.steps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--dark-3);
  border-radius: var(--r-lg);
  overflow: hidden;
  margin-bottom: 60px;
}
.steps-grid:last-of-type {
  margin-bottom: 0;
}
.step {
  background: var(--dark-2);
  padding: 44px 32px;
  text-align: center;
  transition: var(--t);
}
.step:hover {
  background: var(--dark-1);
}
.step__num {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 52px;
  font-weight: 400;
  color: var(--dark-5);
  line-height: 1;
  margin-bottom: 12px;
  letter-spacing: 1px;
}
.step:hover .step__num {
  color: var(--gold-bright);
}
.step__icon {
  font-size: 32px;
  margin-bottom: 16px;
  color: var(--gold-bright);
}
.step__title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 20px;
  letter-spacing: 1px;
  color: var(--white);
  margin-bottom: 12px;
}
.step__desc {
  font-size: 13px;
  color: var(--gray-300);
  line-height: 1.7;
}

#faq {
  padding: 120px 0;
  background: var(--black);
}
.faq-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.faq-item {
  background: var(--dark-2);
  border: 1px solid var(--dark-3);
  border-radius: var(--r-md);
  overflow: hidden;
  transition: var(--t);
}
.faq-item:hover {
  border-color: var(--gold-line);
}
.faq-question {
  padding: 22px 28px;
  font-weight: 600;
  font-size: 15px;
  color: var(--white);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  user-select: none;
}
.faq-arrow {
  font-size: 20px;
  transition: transform var(--t);
  flex-shrink: 0;
  color: var(--gold-bright);
}
.faq-item.open .faq-arrow {
  transform: rotate(90deg);
}
.faq-answer {
  padding: 0 28px;
  font-size: 14px;
  color: var(--gray-300);
  line-height: 1.75;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease, padding 0.3s ease;
}
.faq-item.open .faq-answer {
  max-height: 300px;
  padding: 0 28px 24px;
}

.learn-cta {
  background: var(--dark-1);
  border: 1px solid var(--dark-3);
  border-radius: var(--r-xl);
  padding: 72px 48px;
  text-align: center;
  margin-top: 80px;
  position: relative;
  overflow: hidden;
}
.learn-cta::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(circle 600px at 50% 50%, rgba(201,162,39,0.05) 0%, transparent 70%);
  pointer-events: none;
}
.learn-cta__inner {
  position: relative;
  z-index: 2;
}
.learn-cta h2 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 38px;
  letter-spacing: 2px;
  color: var(--white);
  margin-bottom: 18px;
}
.learn-cta p {
  font-size: 16px;
  color: var(--gray-300);
  margin-bottom: 36px;
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.7;
}
.learn-cta .btns {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

@media (max-width: 900px) {
  .articles-grid--full, .faq-grid, .steps-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .safety-banner { grid-template-columns: 1fr; gap: 16px; }
  .learn-cta { padding: 48px 24px; }
}

/* ── CONTACT PAGE SPECIFIC STYLES ── */
#contact-main {
  padding: 80px 0 120px;
  background: var(--black);
  position: relative;
}
#contact-main::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(circle 800px at 0% 10%, rgba(201,162,39,0.04) 0%, transparent 70%);
  pointer-events: none;
}

.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 48px;
  align-items: start;
  position: relative;
  z-index: 2;
}

/* Left Info */
.info-card {
  background: var(--dark-2);
  border: 1px solid var(--dark-3);
  border-radius: var(--r-md);
  padding: 32px;
  margin-bottom: 20px;
  transition: var(--t);
  box-shadow: var(--shadow-card);
}
.info-card:hover {
  border-color: var(--gold-line);
  box-shadow: var(--shadow-dark);
}

.info-card__head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
}
.info-card__icon {
  width: 24px; height: 24px;
  border-radius: 0;
  background: transparent;
  border: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
  color: var(--gold-bright);
}
.info-card__icon .elementor-icon-wrapper,
.info-card__icon .elementor-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.info-card__title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 22px;
  letter-spacing: 1px;
  color: var(--white);
}
.info-card__body {
  font-size: 14px;
  color: var(--gray-300);
  line-height: 1.75;
}
.info-card__body a {
  color: var(--gold-bright);
  font-weight: 600;
}
.info-card__body a:hover {
  color: var(--gold-pale);
  text-decoration: underline;
}

/* Retailers */
.retailer-cards {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 18px;
}
.retailer-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 20px;
  border: 1px solid var(--dark-3);
  border-radius: var(--r-sm);
  background: var(--dark-1);
  transition: var(--t);
  font-weight: 600;
  color: var(--white);
  font-size: 15px;
}
.retailer-card:hover {
  border-color: var(--gold-line);
  color: var(--gold-bright);
  transform: translateX(4px);
}
.retailer-card svg {
  width: 20px; height: 20px;
  flex-shrink: 0;
}
.retailer-card span {
  margin-left: auto;
  font-size: 11px;
  color: var(--gray-500);
  font-weight: 500;
}

/* Right Form Card */
.contact-form-card {
  background: var(--dark-1);
  border: 1px solid var(--dark-3);
  border-radius: var(--r-lg);
  padding: 48px;
  box-shadow: var(--shadow-dark);
}
.form-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 36px;
  letter-spacing: 1.5px;
  color: var(--white);
  margin-bottom: 8px;
}
.form-subtitle {
  font-size: 14px;
  color: var(--gray-300);
  margin-bottom: 36px;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.form-group {
  margin-bottom: 24px;
}
.form-group--full {
  grid-column: 1 / -1;
}

.form-label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 8px;
  letter-spacing: 0.5px;
}
.form-label span {
  color: var(--gold-bright);
  margin-left: 2px;
}

.form-input,
.form-select,
.form-textarea {
  width: 100%;
  padding: 14px 18px;
  border: 1.5px solid var(--dark-4);
  border-radius: var(--r-sm);
  font-size: 14px;
  color: var(--white);
  background: var(--dark-2);
  transition: var(--t);
  outline: none;
  font-family: inherit;
}
.form-input:focus,
.form-select:focus,
.form-textarea:focus {
  border-color: var(--gold-bright);
  box-shadow: 0 0 10px var(--gold-glow);
}
.form-input::placeholder,
.form-textarea::placeholder {
  color: var(--gray-500);
}
.form-textarea {
  resize: vertical;
  min-height: 140px;
}
.form-select {
  cursor: pointer;
}

.form-submit {
  width: 100%;
  padding: 16px;
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-bright) 100%);
  color: var(--black);
  border: none;
  border-radius: var(--r-sm);
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: var(--t);
  letter-spacing: 1px;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 10px;
}
.form-submit:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-gold);
}
.form-submit svg {
  width: 16px; height: 16px;
  fill: currentColor;
}

.form-note {
  font-size: 12px;
  color: var(--gray-500);
  text-align: center;
  margin-top: 18px;
  line-height: 1.6;
}
.form-note a {
  color: var(--gold-bright);
}

/* Success State */
.form-success {
  display: none;
  text-align: center;
  padding: 48px 24px;
}
.form-success__icon {
  font-size: 64px;
  margin-bottom: 20px;
  color: var(--gold-bright);
}
.form-success__title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 32px;
  letter-spacing: 1.5px;
  color: var(--white);
  margin-bottom: 12px;
}
.form-success__desc {
  font-size: 15px;
  color: var(--gray-300);
  line-height: 1.7;
}

/* Quick FAQ Section */
#contact-faq {
  padding: 120px 0;
  background: var(--black);
  border-top: 1px solid var(--dark-3);
  border-bottom: 1px solid var(--dark-3);
}
.quick-faq-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.quick-faq-card {
  background: var(--dark-2);
  border: 1px solid var(--dark-3);
  border-radius: var(--r-md);
  padding: 32px;
  transition: var(--t);
}
.quick-faq-card:hover {
  border-color: var(--gold-line);
  background: var(--dark-1);
}
.quick-faq-q {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 20px;
  letter-spacing: 1px;
  color: var(--white);
  margin-bottom: 12px;
}
.quick-faq-a {
  font-size: 14px;
  color: var(--gray-300);
  line-height: 1.65;
}
.quick-faq-a a {
  color: var(--gold-bright);
  font-weight: 600;
}

/* Address Row */
#contact-address {
  background: var(--dark-1);
  padding: 64px 0;
}
.address-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
}
.address-item {
  display: flex;
  align-items: center;
  gap: 16px;
}
.address-item__icon {
  width: 48px; height: 48px;
  background: var(--gold-dim);
  border: 1px solid var(--gold-line);
  border-radius: var(--r-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: var(--gold-bright);
  flex-shrink: 0;
}
.address-item__label {
  font-size: 10px;
  color: var(--gray-500);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.address-item__val {
  font-size: 15px;
  color: var(--white);
  font-weight: 500;
}

@media (max-width: 900px) {
  .contact-grid { grid-template-columns: 1fr; }
  .quick-faq-grid { grid-template-columns: 1fr 1fr; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width: 600px) {
  .quick-faq-grid { grid-template-columns: 1fr; }
  .contact-form-card { padding: 32px 24px; }
  .address-row { flex-direction: column; align-items: flex-start; }
}

/* ── FLUENT FORMS DARK LUXURY SKIN ── */
.fluentform, 
.fluentform .ff-form-container,
.fluent_form_wrapper {
  color: var(--white);
}

.fluentform input[type="text"],
.fluentform input[type="email"],
.fluentform input[type="tel"],
.fluentform select,
.fluentform textarea,
.fluentform .ff-el-form-control {
  width: 100% !important;
  padding: 14px 18px !important;
  border: 1.5px solid var(--dark-4) !important;
  border-radius: var(--r-sm) !important;
  font-size: 14px !important;
  color: var(--white) !important;
  background: var(--dark-2) !important;
  transition: var(--t) !important;
  outline: none !important;
  font-family: inherit !important;
  box-shadow: none !important;
}

.fluentform input[type="text"]:focus,
.fluentform input[type="email"]:focus,
.fluentform input[type="tel"]:focus,
.fluentform select:focus,
.fluentform textarea:focus,
.fluentform .ff-el-form-control:focus {
  border-color: var(--gold-bright) !important;
  box-shadow: 0 0 10px var(--gold-glow) !important;
  background: var(--dark-2) !important;
}

.fluentform input::placeholder,
.fluentform textarea::placeholder,
.fluentform .ff-el-form-control::placeholder {
  color: var(--gray-500) !important;
}

.fluentform select option {
  background: var(--dark-1) !important;
  color: var(--white) !important;
}

.fluentform .ff-el-form-label,
.fluentform label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--white) !important;
  margin-bottom: 8px !important;
  letter-spacing: 0.5px !important;
}

.fluentform .ff-el-form-label span.ff-el-required,
.fluentform label span {
  color: var(--gold-bright) !important;
  margin-left: 2px !important;
}

/* Submit Button skinning */
.fluentform button.ff-btn-submit,
.fluentform .ff_submit_btn_wrapper button,
.fluentform button[type="submit"] {
  width: 100% !important;
  padding: 16px !important;
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-bright) 100%) !important;
  color: var(--black) !important;
  border: none !important;
  border-radius: var(--r-sm) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: var(--t) !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin-top: 10px !important;
  height: auto !important;
  line-height: 1 !important;
}

.fluentform button.ff-btn-submit:hover,
.fluentform .ff_submit_btn_wrapper button:hover,
.fluentform button[type="submit"]:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--shadow-gold) !important;
  background: linear-gradient(135deg, var(--gold-bright) 0%, var(--gold-pale) 100%) !important;
}

/* Form Row column formatting in Fluent Forms */
.fluentform .ff-t-container {
  width: 100% !important;
  margin: 0 !important;
}

.fluentform .ff-t-row {
  display: flex !important;
  flex-wrap: wrap !important;
  margin-right: -10px !important;
  margin-left: -10px !important;
}

.fluentform .ff-t-col-1,
.fluentform .ff-t-col-2,
.fluentform .ff-t-col-3,
.fluentform .ff-t-col-4,
.fluentform .ff-t-col-5,
.fluentform .ff-t-col-6 {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

@media (max-width: 768px) {
  .fluentform .ff-t-row {
    flex-direction: column !important;
  }
  .fluentform .ff-t-col-1,
  .fluentform .ff-t-col-2,
  .fluentform .ff-t-col-3,
  .fluentform .ff-t-col-4,
  .fluentform .ff-t-col-5,
  .fluentform .ff-t-col-6 {
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: 100% !important;
  }
}

.fluentform .ff-message-success {
  background: var(--gold-dim) !important;
  border: 1px solid var(--gold-line) !important;
  color: var(--gold-bright) !important;
  padding: 20px !important;
  border-radius: var(--r-sm) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 20px !important;
}
/* Dynamic post archives -------------------------------------------------- */
.zg-post-archive { background: var(--black); }
.zg-post-archive__hero { padding: 104px 0 82px; border-bottom: 1px solid var(--dark-3); background: radial-gradient(ellipse 760px 410px at 82% 48%, rgba(201,162,39,.1), transparent 72%), var(--dark-1); }
.zg-post-archive__hero .section-title { margin: 14px 0 18px; }
.zg-post-archive__intro { max-width: 630px; color: var(--gray-300); font-size: 17px; line-height: 1.75; }
.zg-post-archive__intro p { margin: 0; }
.zg-post-archive__content { padding: 72px 0 120px; }
.zg-post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.zg-post-card { overflow: hidden; background: var(--dark-1); border: 1px solid var(--dark-3); border-radius: var(--r-lg); transition: transform var(--t), border-color var(--t); }
.zg-post-card:hover { transform: translateY(-5px); border-color: var(--gold-line); }
.zg-post-card__image { display: grid; place-items: center; aspect-ratio: 16 / 9; overflow: hidden; background: linear-gradient(135deg, #24200e, #111); }
.zg-post-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.zg-post-card:hover .zg-post-card__image img { transform: scale(1.04); }
.zg-post-card__placeholder { font-family: 'Bebas Neue', sans-serif; color: var(--gold); font-size: 42px; letter-spacing: 3px; }
.zg-post-card__body { padding: 26px; }
.zg-post-card__meta { color: var(--gold-bright); font-size: 11px; letter-spacing: 1.2px; font-weight: 700; text-transform: uppercase; }
.zg-post-card__meta span { color: var(--gray-500); padding: 0 5px; }
.zg-post-card h2 { margin: 12px 0; font-family: 'Bebas Neue', sans-serif; font-size: clamp(25px, 2vw, 32px); line-height: 1; letter-spacing: .5px; }
.zg-post-card h2 a { color: var(--white); }
.zg-post-card h2 a:hover, .zg-post-card__link:hover { color: var(--gold-bright); }
.zg-post-card__excerpt { color: var(--gray-300); line-height: 1.7; font-size: 14px; min-height: 71px; }
.zg-post-card__link { display: inline-flex; gap: 8px; margin-top: 22px; color: var(--gold-bright); font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.zg-post-pagination { display: flex; justify-content: center; margin-top: 52px; }
.zg-post-pagination .page-numbers { display: flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; margin: 0 4px; padding: 0 11px; border: 1px solid var(--dark-3); border-radius: 4px; color: var(--gray-300); font-size: 13px; }
.zg-post-pagination .page-numbers.current, .zg-post-pagination .page-numbers:hover { border-color: var(--gold); background: var(--gold); color: #111; }
.zg-post-archive__empty { padding: 80px 0; text-align: center; color: var(--gray-300); }
@media (max-width: 900px) { .zg-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .zg-post-archive__hero { padding: 72px 0 58px; } .zg-post-archive__content { padding: 48px 0 80px; } .zg-post-grid { grid-template-columns: 1fr; } }

/* WooCommerce Cart + Checkout Blocks ------------------------------------- */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout { max-width: 1280px; margin: 0 auto; padding: 72px 28px 112px; color: var(--white); }
.wp-block-woocommerce-cart .wc-block-cart,
.wp-block-woocommerce-checkout .wc-block-checkout { margin: 0; }
.wc-block-cart__main,
.wc-block-checkout__main { background: var(--dark-1); border: 1px solid var(--dark-3); border-radius: 14px; padding: 32px; }
.wc-block-components-sidebar { background: var(--dark-1); border: 1px solid var(--dark-3); border-radius: 14px; padding: 28px; height: fit-content; position: sticky; top: 100px; }
.wc-block-components-sidebar-layout .wc-block-components-main { padding-right: 32px; }
.wc-block-components-title,
.wc-block-checkout__contact-fields h2,
.wc-block-checkout__shipping-address h2,
.wc-block-checkout__billing-address h2,
.wc-block-components-order-summary__title,
.wc-block-cart__totals-title { color: var(--white); font-family: 'Bebas Neue', sans-serif; font-size: 28px; letter-spacing: 1px; line-height: 1.1; text-transform: uppercase; }
.wc-block-components-order-summary,
.wc-block-cart__totals-wrap { border-color: var(--dark-3) !important; }
.wc-block-cart-items { border-top: 1px solid var(--dark-3) !important; }
.wc-block-cart-items th { color: var(--gold-bright) !important; font-size: 11px !important; letter-spacing: 1.2px; text-transform: uppercase; border-bottom-color: var(--dark-3) !important; }
.wc-block-cart-items td { border-bottom-color: var(--dark-3) !important; }
.wc-block-cart-item__image img,
.wc-block-components-order-summary-item__image img { border: 1px solid var(--dark-3); border-radius: 8px; background: #fff; object-fit: contain; }
.wc-block-components-product-name,
.wc-block-cart-item__product a { color: var(--white) !important; font-family: 'Space Grotesk', sans-serif; font-size: 15px; font-weight: 700; line-height: 1.45; }
.wc-block-components-product-name:hover,
.wc-block-cart-item__product a:hover { color: var(--gold-bright) !important; }
.wc-block-components-product-price,
.wc-block-cart-item__total-price-and-sale-price-wrapper,
.wc-block-components-totals-item__value { color: var(--white) !important; font-weight: 700; }
.wc-block-components-quantity-selector { border: 1px solid var(--dark-3) !important; border-radius: 6px; background: var(--black); }
.wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input { background: transparent !important; color: var(--white) !important; border: 0 !important; box-shadow: none !important; }
.wc-block-components-quantity-selector button { color: var(--gold-bright) !important; }
.wc-block-cart-item__remove-link { color: var(--gray-300) !important; font-size: 12px !important; }
.wc-block-cart-item__remove-link:hover { color: #f16464 !important; }
.wc-block-components-totals-item,
.wc-block-components-totals-footer-item { border-top-color: var(--dark-3) !important; color: var(--gray-300) !important; }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value { color: var(--gold-bright) !important; font-family: 'Bebas Neue', sans-serif; font-size: 28px; letter-spacing: 1px; }
.wc-block-components-button,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button { min-height: 52px !important; border: 1px solid var(--gold) !important; border-radius: 6px !important; background: linear-gradient(135deg, var(--gold), var(--gold-bright)) !important; color: var(--black) !important; font-family: 'Space Grotesk', sans-serif !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: 1.35px !important; text-transform: uppercase !important; box-shadow: none !important; }
.wc-block-components-button:hover,
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover { filter: brightness(1.08); transform: translateY(-2px); box-shadow: var(--shadow-gold) !important; }
.wc-block-components-text-input input,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-block-components-combobox .wc-block-components-combobox-control select,
.wc-block-components-select .wc-block-components-select__select { min-height: 50px; border: 1px solid var(--dark-3) !important; border-radius: 6px !important; background: var(--black) !important; color: var(--white) !important; box-shadow: none !important; }
.wc-block-components-text-input label,
.wc-block-components-combobox label,
.wc-block-components-select label { color: var(--gray-300) !important; font-size: 12px !important; }
.wc-block-components-text-input input:focus,
.wc-block-components-combobox .wc-block-components-combobox-control input:focus,
.wc-block-components-select .wc-block-components-select__select:focus { border-color: var(--gold) !important; outline: 0 !important; box-shadow: 0 0 0 2px rgba(201,162,39,.18) !important; }
.wc-block-checkout__contact-fields,
.wc-block-checkout__shipping-address,
.wc-block-checkout__billing-address,
.wc-block-components-checkout-step { border-color: var(--dark-3) !important; }
.wc-block-components-radio-control__option { border-color: var(--dark-3) !important; background: var(--black); }
.wc-block-components-radio-control__option--checked { border-color: var(--gold) !important; box-shadow: inset 3px 0 0 var(--gold); }
.wc-block-components-notice-banner { border-radius: 6px !important; }
.wc-block-components-notice-banner.is-error { border-color: #b94444 !important; background: rgba(185,68,68,.12) !important; color: #ffd7d7 !important; }
.wc-block-components-checkout-step__description,
.wc-block-components-totals-coupon__form,
.wc-block-components-order-summary-item__description { color: var(--gray-300) !important; }
@media (max-width: 782px) { .wp-block-woocommerce-cart,.wp-block-woocommerce-checkout { padding: 42px 18px 76px; } .wc-block-cart__main,.wc-block-checkout__main,.wc-block-components-sidebar { padding: 20px; } .wc-block-components-sidebar-layout .wc-block-components-main { padding-right: 0; } .wc-block-components-sidebar { position: static; margin-top: 24px; } }

/* WooCommerce creates pagination as a list; keep it as one compact row. */
.woocommerce-pagination ul.page-numbers { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.woocommerce-pagination ul.page-numbers li { display: block; margin: 0; padding: 0; }
.woocommerce-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 12px; border: 1px solid var(--dark-3); border-radius: 5px; color: var(--gray-300); font-weight: 700; text-decoration: none; }
.woocommerce-pagination .page-numbers.current,
.woocommerce-pagination a.page-numbers:hover { border-color: var(--gold); background: var(--gold); color: var(--black); }

/* Classic Cart + Checkout template layout -------------------------------- */
.zg-cart-layout { display: grid; grid-template-columns: minmax(0,1fr) 390px; gap: 38px; align-items: start; }
.zg-cart-layout .woocommerce-cart-form { margin: 0 !important; }
.zg-cart-summary { position: sticky; top: 100px; }
.zg-cart-summary .cart-collaterals { margin: 0 !important; }
.zg-cart-summary .cart-collaterals { overflow: hidden; background: var(--dark-1); border: 1px solid var(--dark-3); border-top: 3px solid var(--gold); border-radius: 12px; }
.zg-cart-summary .cart_totals { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 30px !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; }
.zg-cart-summary .cart_totals h2 { margin: 0 0 22px !important; font-size: 32px !important; }
.zg-cart-summary .checkout-button { margin: 22px 0 0 !important; min-height: 52px; }
.woocommerce-checkout form.checkout.zg-checkout-form { display: block !important; margin: 0 !important; max-width: none !important; }
.zg-checkout-layout { display: grid; grid-template-columns: minmax(0,1fr) 430px; gap: 38px; align-items: start; }
.zg-checkout-details .checkout-section { padding: 34px !important; margin: 0 0 24px !important; border-top: 3px solid var(--gold) !important; }
.zg-checkout-details .checkout-section .form-row { display: block !important; float: none !important; width: 100% !important; margin: 0 0 18px !important; }
.zg-checkout-details .checkout-section .form-row label { margin: 0 0 8px !important; color: var(--gray-300) !important; }
.zg-checkout-details .checkout-section .form-row input.input-text,
.zg-checkout-details .checkout-section .form-row select,
.zg-checkout-details .checkout-section .form-row textarea { min-height: 50px; box-sizing: border-box; }
.zg-checkout-summary { position: sticky; top: 100px; }
.zg-checkout-summary .checkout-review { padding: 30px !important; border-top: 3px solid var(--gold) !important; border-radius: 12px !important; }
.zg-checkout-summary .checkout-review > h2 { margin: 0 0 22px !important; font-size: 32px !important; }
.zg-checkout-summary #payment { margin-top: 24px; border-top: 1px solid var(--dark-3); padding-top: 22px; }
.zg-checkout-summary #place_order { min-height: 52px; margin-top: 18px; }
.zg-checkout-summary #payment .form-row,
.zg-checkout-summary #payment .form-row.place-order { display: flex !important; flex-direction: column; gap: 16px; float: none !important; width: 100% !important; margin: 0 !important; }
.zg-checkout-summary #payment .woocommerce-privacy-policy-text { width: 100%; margin: 0 !important; color: var(--gray-300) !important; font-size: 13px; line-height: 1.65; }
.zg-checkout-summary #payment #place_order { width: 100% !important; height: auto !important; min-height: 52px !important; margin: 0 !important; padding: 17px 20px !important; }

/* Cart columns: headings must follow the same left edge as their values. */
.woocommerce-cart table.shop_table th { text-align: left !important; }
.woocommerce-cart table.shop_table th.product-remove,
.woocommerce-cart table.shop_table td.product-remove { width: 34px; padding-left: 0 !important; padding-right: 8px !important; }
.woocommerce-cart table.shop_table th.product-thumbnail,
.woocommerce-cart table.shop_table td.product-thumbnail { width: 82px; }
.woocommerce-cart table.shop_table th.product-price,
.woocommerce-cart table.shop_table td.product-price { width: 120px; }
.woocommerce-cart table.shop_table th.product-quantity,
.woocommerce-cart table.shop_table td.product-quantity { width: 190px; }
.woocommerce-cart table.shop_table th.product-subtotal,
.woocommerce-cart table.shop_table td.product-subtotal { width: 110px; }
.zg-cart-summary .cart_totals table th { text-align: left !important; }
.zg-cart-summary .cart_totals table td { text-align: right !important; }

/* SelectWoo/Select2 country and state menus render outside the field itself. */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--single .select2-selection__rendered { background: var(--dark-2) !important; color: var(--white) !important; }
.select2-container--default .select2-selection--single { height: 50px !important; border: 1px solid var(--dark-3) !important; border-radius: 6px !important; }
.select2-container--default .select2-selection--single .select2-selection__rendered { padding: 13px 42px 13px 16px !important; line-height: 22px !important; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 48px !important; right: 10px !important; }
.select2-container--default .select2-selection--single .select2-selection__arrow b { border-top-color: var(--gold-bright) !important; }
.select2-dropdown { background: var(--dark-1) !important; border: 1px solid var(--gold) !important; border-radius: 6px !important; overflow: hidden; box-shadow: 0 16px 34px rgba(0,0,0,.45); }
.select2-container--default .select2-search--dropdown { padding: 10px !important; background: var(--dark-1) !important; }
.select2-container--default .select2-search--dropdown .select2-search__field { background: var(--black) !important; border: 1px solid var(--dark-3) !important; border-radius: 4px !important; color: var(--white) !important; padding: 9px 11px !important; }
.select2-container--default .select2-results__option { background: var(--dark-1) !important; color: var(--gray-300) !important; padding: 10px 14px !important; }
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] { background: var(--gold) !important; color: var(--black) !important; }
.select2-container--default .select2-results__option[aria-selected=true],
.select2-container--default .select2-results__option[data-selected=true] { background: var(--dark-3) !important; color: var(--gold-bright) !important; }

/* Cart quantity control: avoid the browser's dated number-spinner UI. */
.woocommerce-cart-form .zg-quantity-control { display: inline-flex !important; align-items: center; height: 42px; overflow: hidden; border: 1px solid var(--dark-3); border-radius: 6px; background: var(--black); }
.woocommerce-cart-form .zg-quantity-control input.qty { width: 44px !important; min-width: 44px !important; height: 40px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: var(--white) !important; font: 700 14px/40px 'Space Grotesk', sans-serif !important; text-align: center; -moz-appearance: textfield; }
.woocommerce-cart-form .zg-quantity-control input.qty::-webkit-outer-spin-button,
.woocommerce-cart-form .zg-quantity-control input.qty::-webkit-inner-spin-button { margin: 0; -webkit-appearance: none; }
.woocommerce-cart-form .zg-quantity-control__button { display: grid; place-items: center; width: 34px; height: 40px; padding: 0; border: 0; background: transparent; color: var(--gold-bright); font: 400 21px/1 Arial, sans-serif; cursor: pointer; }
.woocommerce-cart-form .zg-quantity-control__button:hover { background: rgba(201,162,39,.14); color: var(--white); }
.woocommerce-cart-form.is-auto-updating { opacity: .72; pointer-events: none; position: relative; }
.woocommerce-cart-form.is-auto-updating::after { content: 'Updating cart...'; position: absolute; right: 24px; bottom: 24px; z-index: 2; padding: 10px 14px; border: 1px solid var(--gold-line); border-radius: 6px; background: #fff; color: var(--white); font: 800 11px/1 var(--zg-body-font, 'Space Grotesk', sans-serif); letter-spacing: .8px; text-transform: uppercase; box-shadow: var(--shadow-card); }
@media (max-width: 960px) { .zg-cart-layout,.zg-checkout-layout { grid-template-columns: 1fr; } .zg-cart-summary,.zg-checkout-summary { position: static; } }
@media (max-width: 640px) { .woocommerce-cart-form { padding: 18px !important; } .zg-cart-summary .cart_totals,.zg-checkout-details .checkout-section,.zg-checkout-summary .checkout-review { padding: 22px !important; } }

/* Layout repair after live feedback pass -------------------------------- */
.zg-home-hero {
  background: #fff !important;
  padding: 72px 0 56px !important;
}
.zg-home-hero__media video,
.zg-home-hero__media img {
  object-fit: cover !important;
}
.zg-home-section {
  background: #f7f5ef !important;
  padding: 76px 0 !important;
}
.zg-home-section--alt {
  background: #fff !important;
}
.zg-home-section .section-title,
.zg-home-section h2,
.zg-home-section h3 {
  color: #151515 !important;
}
.zg-home-section .section-sub,
.zg-home-section p {
  color: rgba(21,21,21,.66) !important;
}
.zg-detail-shots {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
}
.zg-detail-shots figure {
  margin: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid #ded8ca !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 30px rgba(40,34,24,.09) !important;
}
.zg-detail-shots img,
.zg-earthsport-band > img {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  padding: 0 !important;
  background: #fff !important;
}
.zg-detail-shots figcaption {
  padding: 12px 14px !important;
  color: rgba(21,21,21,.62) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
}
.zg-earthsport-band {
  align-items: center !important;
}
.zg-earthsport-band > img {
  border: 1px solid #ded8ca !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 30px rgba(40,34,24,.09) !important;
}

.woocommerce ul.products,
.woocommerce ul.products.columns-4,
.woocommerce ul.products.columns-3,
.woocommerce ul.products.columns-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 24px !important;
}
.woocommerce ul.products li.product,
.woocommerce ul.products li.product .product-card {
  transform: none !important;
}
.product-card__image {
  min-height: 300px !important;
}
.product-card__image img,
.woocommerce ul.products li.product img {
  height: 280px !important;
  object-fit: contain !important;
}
.product-card__info {
  padding: 16px 18px 18px !important;
}
.product-card__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 18px !important;
}

@media (max-width: 900px) {
  .zg-home-hero__grid,
  .zg-feature-grid,
  .zg-earthsport-band {
    grid-template-columns: 1fr !important;
  }
  .woocommerce ul.products,
  .woocommerce ul.products.columns-4,
  .woocommerce ul.products.columns-3,
  .woocommerce ul.products.columns-2 {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 620px) {
  .zg-home-section {
    padding: 54px 0 !important;
  }
  .zg-detail-shots {
    grid-template-columns: 1fr !important;
  }
  .product-card__image {
    min-height: 230px !important;
  }
  .product-card__image img,
  .woocommerce ul.products li.product img {
    height: 220px !important;
  }
}

/* Client revision pass: lighter product-forward direction ---------------- */
:root {
  --black: #f7f5ef;
  --dark-1: #ffffff;
  --dark-2: #f0eee8;
  --dark-3: #ded8ca;
  --dark-4: #cfc6b4;
  --dark-5: #b7ad9a;
  --white: #151515;
  --off-white: #25221e;
  --gray-100: rgba(21,21,21,0.88);
  --gray-300: rgba(21,21,21,0.62);
  --gray-500: rgba(21,21,21,0.42);
  --gray-700: rgba(21,21,21,0.16);
  --gray-900: rgba(21,21,21,0.06);
  --gold: #b89445;
  --gold-bright: #caa65a;
  --gold-pale: #ead8b3;
  --gold-dim: rgba(184,148,69,0.13);
  --gold-glow: rgba(184,148,69,0.22);
  --gold-line: rgba(184,148,69,0.28);
  --shadow-card: 0 12px 30px rgba(40,34,24,0.09);
  --shadow-dark: 0 18px 50px rgba(40,34,24,0.12);
}

body,
.woocommerce-page,
#main-content,
.zg-home-section { background: var(--black); color: var(--white); }
#site-header,
#site-footer,
.mobile-nav { background: rgba(255,255,255,0.94); }

.zg-home-hero { background: #fff; padding: 76px 0 54px; border-bottom: 1px solid var(--dark-3); }
.zg-home-hero__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr); gap: 54px; align-items: center; }
.zg-home-hero .hero-title { color: var(--white); max-width: 690px; }
.zg-home-hero .hero-desc { color: var(--gray-300); max-width: 620px; }
.zg-home-hero__media { aspect-ratio: 4 / 3; background: #f1eee7; border: 1px solid var(--dark-3); border-radius: 8px; overflow: hidden; box-shadow: var(--shadow-dark); }
.zg-home-hero__media video,
.zg-home-hero__media img { width: 100%; height: 100%; object-fit: contain; background: #f7f5ef; }
.zg-home-hero__media video + img { display: none; }
.zg-proof-strip { background: #171717; color: #fff; padding: 28px 0; }
.zg-proof-strip__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.zg-proof-strip strong { display: block; color: var(--gold-pale); font-size: 24px; line-height: 1.1; }
.zg-proof-strip span { display: block; color: rgba(255,255,255,.72); font-size: 13px; margin-top: 4px; }
.zg-home-section { padding: 82px 0; }
.zg-home-section--alt { background: #fff; }
.zg-feature-grid,
.zg-earthsport-band { display: grid; grid-template-columns: .85fr 1.15fr; gap: 48px; align-items: center; }
.zg-detail-shots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.zg-detail-shots img,
.zg-earthsport-band img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: #fff; border: 1px solid var(--dark-3); border-radius: 8px; padding: 20px; box-shadow: var(--shadow-card); }
.zg-section-action { margin-top: 36px; text-align: center; }

.zg-portfolio-section { background: #fff; }
.zg-portfolio-grid {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(420px, 1.18fr);
  gap: 54px;
  align-items: center;
}
.zg-portfolio-copy .section-title { max-width: 520px; }
.zg-portfolio-copy .section-sub { max-width: 620px; }
.zg-portfolio-visual {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.zg-portfolio-card {
  min-height: 420px;
  padding: 18px;
  border: 1px solid rgba(184,148,69,.24);
  border-radius: 8px;
  background: #f7f5ef;
  box-shadow: var(--shadow-card);
}
.zg-portfolio-card img {
  width: 100%;
  height: 285px;
  object-fit: contain;
  display: block;
  margin-bottom: 18px;
  border: 1px solid rgba(184,148,69,.18);
  border-radius: 8px;
  background: #fff;
}
.zg-portfolio-card--earthsport img { object-fit: cover; }
.zg-portfolio-card strong {
  display: block;
  margin-bottom: 6px;
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif);
  font-size: 30px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1;
  color: #151515;
}
.zg-portfolio-card span {
  display: block;
  color: rgba(21,21,21,.66);
  font-size: 14px;
  line-height: 1.5;
}

.shop-layout--no-sidebar { display: block !important; }
.zg-brand-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 28px; }
.zg-brand-tabs a { border: 1px solid var(--dark-3); border-radius: 6px; background: #fff; color: var(--white); padding: 11px 16px; font-size: 12px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
.zg-brand-tabs a:hover { border-color: var(--gold); background: var(--gold-dim); color: var(--white); }

ul.products,
ul.products.columns-4,
ul.products.columns-3,
ul.products.columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 28px !important; }
.product-card { min-height: 100%; background: #fff !important; border: 1px solid var(--dark-3) !important; border-radius: 8px !important; overflow: hidden; box-shadow: var(--shadow-card); }
.product-card__image { display: grid; place-items: center; min-height: 360px; background: #f5f2eb !important; border-bottom: 1px solid var(--dark-3); }
.product-card__image img,
.woocommerce ul.products li.product img { width: 100% !important; height: 340px !important; max-height: none !important; object-fit: contain !important; padding: 18px !important; background: transparent !important; border: 0 !important; }
.product-card__info { padding: 20px 22px 22px !important; }
.product-card__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title { color: var(--white) !important; font-size: 22px !important; line-height: 1.12 !important; padding: 0 !important; margin: 0 0 12px !important; }
.product-card__price { color: var(--gold) !important; margin-bottom: 16px !important; }
.product-card__actions .btn { width: 100%; }

@media (max-width: 900px) {
  .zg-home-hero__grid,
  .zg-feature-grid,
  .zg-earthsport-band { grid-template-columns: 1fr; }
  .zg-home-hero__media { min-width: 0; }
  .zg-proof-strip__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  ul.products,
  ul.products.columns-4,
  ul.products.columns-3,
  ul.products.columns-2 { grid-template-columns: 1fr !important; }
}

@media (max-width: 620px) {
  .zg-home-hero { padding: 54px 0 36px; }
  .zg-proof-strip__grid,
  .zg-detail-shots { grid-template-columns: 1fr; }
  .product-card__image { min-height: 280px; }
  .product-card__image img,
  .woocommerce ul.products li.product img { height: 260px !important; }
}

/* Final layout repair override. Must remain at end of file. -------------- */
.zg-home-hero {
  background: #fff !important;
  padding: 72px 0 56px !important;
}
.zg-home-hero__media video,
.zg-home-hero__media img {
  object-fit: contain !important;
  padding: 18px !important;
  background: #f7f5ef !important;
}
.zg-home-video-section {
  background: #fff !important;
  padding: 68px 0 !important;
  border-bottom: 1px solid #ded8ca !important;
}
.zg-home-video-section__grid {
  display: grid !important;
  grid-template-columns: minmax(280px, .78fr) minmax(420px, 1.22fr) !important;
  gap: 42px !important;
  align-items: center !important;
}
.zg-home-video-frame {
  overflow: hidden !important;
  border: 1px solid #ded8ca !important;
  border-radius: 8px !important;
  background: #151515 !important;
  box-shadow: 0 12px 30px rgba(40,34,24,.09) !important;
}
.zg-home-video-frame video {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  object-fit: contain !important;
  background: #151515 !important;
}
.zg-home-section {
  background: #f7f5ef !important;
  padding: 76px 0 !important;
}
.zg-home-section--alt {
  background: #fff !important;
}
.zg-home-section .section-title,
.zg-home-section h2,
.zg-home-section h3 {
  color: #151515 !important;
}
.zg-home-section .section-sub,
.zg-home-section p {
  color: rgba(21,21,21,.66) !important;
}
.zg-detail-shots {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
}
.zg-detail-shots figure {
  margin: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid #ded8ca !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 30px rgba(40,34,24,.09) !important;
}
.zg-detail-shots img,
.zg-earthsport-band > img {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  padding: 0 !important;
  background: #fff !important;
}
.zg-detail-shots figcaption {
  padding: 12px 14px !important;
  color: rgba(21,21,21,.62) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
}
.zg-earthsport-band {
  align-items: center !important;
}
.zg-earthsport-band > img {
  border: 1px solid #ded8ca !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 30px rgba(40,34,24,.09) !important;
}

.woocommerce ul.products,
.woocommerce ul.products.columns-4,
.woocommerce ul.products.columns-3,
.woocommerce ul.products.columns-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 22px !important;
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.woocommerce ul.products li.product,
.woocommerce ul.products li.product .product-card {
  transform: none !important;
}
.product-card__image {
  min-height: 235px !important;
  aspect-ratio: 4 / 3 !important;
}
.product-card__image img,
.woocommerce ul.products li.product img {
  height: 215px !important;
  max-width: 76% !important;
  object-fit: contain !important;
}
.product-card__info {
  padding: 16px 18px 18px !important;
}
.product-card__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 18px !important;
}

@media (max-width: 900px) {
  .zg-home-hero__grid,
  .zg-feature-grid,
  .zg-earthsport-band,
  .zg-home-video-section__grid {
    grid-template-columns: 1fr !important;
  }
  .woocommerce ul.products,
  .woocommerce ul.products.columns-4,
  .woocommerce ul.products.columns-3,
  .woocommerce ul.products.columns-2 {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 620px) {
  .zg-home-section {
    padding: 54px 0 !important;
  }
  .zg-detail-shots {
    grid-template-columns: 1fr !important;
  }
  .product-card__image {
    min-height: 190px !important;
  }
  .product-card__image img,
  .woocommerce ul.products li.product img {
    height: 170px !important;
    max-width: 72% !important;
  }
}

/* Global premium design system repair. Keep this final. ------------------ */
:root {
  --zg-page-bg: #f7f5ef;
  --zg-surface: #ffffff;
  --zg-surface-alt: #f0eee8;
  --zg-border: #ded8ca;
  --zg-text: #151515;
  --zg-text-soft: rgba(21,21,21,.66);
  --zg-text-faint: rgba(21,21,21,.46);
  --zg-gold: #b89445;
  --zg-gold-bright: #caa65a;
  --zg-gold-soft: rgba(184,148,69,.13);
  --zg-shadow-card: 0 12px 30px rgba(40,34,24,.09);
  --zg-shadow-panel: 0 18px 50px rgba(40,34,24,.12);
  --black: var(--zg-page-bg);
  --dark-1: var(--zg-surface);
  --dark-2: var(--zg-surface-alt);
  --dark-3: var(--zg-border);
  --white: var(--zg-text);
  --off-white: #25221e;
  --gray-300: var(--zg-text-soft);
  --gray-500: var(--zg-text-faint);
  --gold: var(--zg-gold);
  --gold-bright: var(--zg-gold-bright);
  --wc-page-bg: var(--zg-page-bg);
  --wc-surface-bg: var(--zg-surface);
  --wc-border: var(--zg-border);
}

body,
#page,
#main-content,
.site-main,
.elementor-page #main-content,
.elementor-page .site-main,
.woocommerce-page #main-content {
  background: var(--zg-page-bg) !important;
  color: var(--zg-text) !important;
}

.elementor-section,
.elementor .e-con,
.elementor-widget-wrap {
  color: var(--zg-text);
}

.elementor-widget-heading .elementor-heading-title,
.elementor-widget-icon-box .elementor-icon-box-title,
.elementor-widget-counter .elementor-counter-number-wrapper,
.elementor-widget-counter .elementor-counter-title,
.woocommerce div.product .product_title,
.woocommerce div.product h2,
.woocommerce div.product h3 {
  color: var(--zg-text) !important;
}

.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-widget-icon-box .elementor-icon-box-description,
.woocommerce div.product,
.woocommerce div.product p,
.woocommerce div.product li {
  color: var(--zg-text-soft) !important;
}

.elementor-widget-text-editor a,
.woocommerce div.product a {
  color: var(--zg-gold) !important;
}

.elementor-widget-button .elementor-button,
.btn--gold,
.single_add_to_cart_button,
.woocommerce a.button,
.woocommerce button.button {
  background: var(--zg-gold) !important;
  border: 1px solid var(--zg-gold) !important;
  border-radius: 6px !important;
  color: #fff !important;
  box-shadow: none !important;
}

.elementor-widget-button .elementor-button:hover,
.btn--gold:hover,
.single_add_to_cart_button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
  background: var(--zg-gold-bright) !important;
  border-color: var(--zg-gold-bright) !important;
  color: #fff !important;
}

.elementor-widget-tabs .elementor-tabs,
.elementor-widget-accordion .elementor-accordion,
.woocommerce div.product .woocommerce-tabs {
  border-color: var(--zg-border) !important;
}

.elementor-widget-tabs .elementor-tab-title,
.elementor-widget-accordion .elementor-tab-title,
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: var(--zg-surface) !important;
  border-color: var(--zg-border) !important;
  color: var(--zg-text) !important;
}

.elementor-widget-tabs .elementor-tab-title.elementor-active,
.elementor-widget-accordion .elementor-tab-title.elementor-active,
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background: var(--zg-surface-alt) !important;
  color: var(--zg-gold) !important;
}

.elementor-widget-tabs .elementor-tab-content,
.elementor-widget-accordion .elementor-tab-content,
.woocommerce div.product .woocommerce-tabs .panel,
.woocommerce-Tabs-panel {
  background: var(--zg-surface) !important;
  border-color: var(--zg-border) !important;
  color: var(--zg-text-soft) !important;
}

.woocommerce div.product .woocommerce-tabs {
  background: var(--zg-surface) !important;
  border: 1px solid var(--zg-border) !important;
  border-radius: 8px !important;
  box-shadow: var(--zg-shadow-card) !important;
  margin-top: 48px !important;
  overflow: hidden !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
  background: var(--zg-surface-alt) !important;
  border-bottom: 1px solid var(--zg-border) !important;
  margin: 0 !important;
  padding: 0 24px !important;
}

.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 {
  border: 0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: var(--zg-text) !important;
  display: block !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  padding: 18px 6px !important;
  text-transform: uppercase !important;
}

.woocommerce div.product .woocommerce-tabs .panel {
  margin: 0 !important;
  padding: 28px 32px 34px !important;
}

.woocommerce-Tabs-panel h2,
.woocommerce-Tabs-panel h3,
.woocommerce-Tabs-panel strong {
  color: var(--zg-text) !important;
}

.elementor .info-card,
.elementor .step,
.elementor .article-full,
.elementor .faq-item,
.elementor .learn-cta__inner,
.elementor .safety-banner,
.zg-article-card,
.zg-callout--card,
.zg-callout--tip {
  background: var(--zg-surface) !important;
  border: 1px solid var(--zg-border) !important;
  border-radius: 8px !important;
  box-shadow: var(--zg-shadow-card) !important;
  color: var(--zg-text) !important;
}

.elementor .article-full__image,
.elementor .step__icon,
.elementor .safety-banner__tag {
  background: var(--zg-surface-alt) !important;
  border-color: var(--zg-border) !important;
}

.elementor .article-full__desc,
.elementor .article-full__point,
.elementor .step__desc,
.elementor .faq-answer,
.elementor .safety-banner__text,
.elementor .info-card__body {
  color: var(--zg-text-soft) !important;
}

.elementor .section-header {
  margin-bottom: 36px !important;
}

.elementor .zg-compare-table-scroll {
  background: var(--zg-surface) !important;
  border: 1px solid var(--zg-border) !important;
  border-radius: 8px !important;
  box-shadow: var(--zg-shadow-card) !important;
  overflow-x: auto !important;
  padding: 24px !important;
  width: 100% !important;
}

.elementor .zg-compare-row {
  border-bottom: 1px solid var(--zg-border) !important;
  padding: 8px 0 !important;
}

.elementor .zg-compare-row:last-child {
  border-bottom: 0 !important;
}

.elementor .zg-compare-table-scroll .pending {
  color: var(--zg-text-soft) !important;
  font-size: .86em !important;
  font-style: italic !important;
}

.elementor .steps-section,
.elementor #learn-main,
.elementor #faq {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}

.single-post.elementor-page .elementor > .e-con {
  background: var(--zg-bg) !important;
}

.single-post.elementor-page .elementor > .e-con:first-child {
  --padding-top: 72px !important;
  --padding-bottom: 44px !important;
}

.single-post.elementor-page .elementor > .e-con:nth-child(2) {
  --content-width: 1140px !important;
  --padding-top: 36px !important;
}

.single-post.elementor-page .zg-article-card {
  padding: 64px !important;
}

.single-post.elementor-page .elementor > .e-con:first-child .elementor-heading-title {
  color: var(--zg-text) !important;
}

.single-post.elementor-page .elementor > .e-con:first-child .elementor-widget-text-editor,
.single-post.elementor-page .elementor > .e-con:first-child .elementor-widget-text-editor p {
  color: var(--zg-text-soft) !important;
}

.single-post.elementor-page .elementor > .e-con:first-child .elementor-widget-heading:first-child .elementor-heading-title {
  color: var(--zg-gold-bright) !important;
}

.single-post.elementor-page .zg-heading-line {
  background: var(--zg-gold) !important;
  flex: 0 0 54px !important;
  height: 3px !important;
  max-width: 54px !important;
  border-radius: 999px !important;
}

.single-post.elementor-page .zg-article-h2,
.single-post.elementor-page .zg-article-h2 > .e-con-inner {
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
}

.elementor .article-full__desc {
  flex: 0 1 auto !important;
}

.elementor .article-full__body {
  padding: 28px 32px 32px !important;
}

.elementor .article-full,
.elementor .article-full > .e-con-inner,
.elementor .article-full__body,
.elementor .article-full__body > .e-con-inner {
  min-height: 0 !important;
}

.elementor .article-full__image {
  height: 112px !important;
}

.zg-learn-hero .elementor-widget-image img,
.zg-learn-feature .elementor-widget-image img {
  aspect-ratio: 1 / 1;
  object-fit: contain;
  width: 100%;
}

.zg-learn-feature-links .elementor-widget-icon-box {
  padding: 16px 0;
  border-bottom: 1px solid var(--zg-border);
}

.zg-learn-feature-links .elementor-widget-icon-box:last-child {
  border-bottom: 0;
}

.zg-product-sticky-cta {
  align-items: center;
  background:
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(248,246,240,.96));
  border: 1px solid rgba(184,148,69,.34);
  border-radius: 10px 10px 0 0;
  bottom: 0;
  box-shadow: 0 -18px 46px rgba(40,34,24,.16);
  display: flex;
  gap: 24px;
  justify-content: space-between;
  left: 50%;
  max-width: 1040px;
  min-height: 76px;
  padding: 12px 16px 12px 20px;
  position: fixed;
  transform: translateX(-50%);
  width: calc(100% - 32px);
  z-index: 999;
}

.zg-product--foosball-sales .zg-product-sticky-cta {
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 18px);
  transition: opacity .22s ease, transform .22s ease;
}

.zg-product--foosball-sales .zg-product-sticky-cta.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, 0);
}

.zg-product-sticky-cta__content {
  align-items: center;
  display: flex;
  gap: 22px;
  min-width: 0;
}

.zg-product-sticky-cta__title {
  color: var(--zg-text);
  display: block;
  font: 800 15px/1.2 'Space Grotesk', sans-serif;
  max-width: 420px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.zg-product-sticky-cta__note {
  color: var(--zg-text-soft);
  display: block;
  font: 600 12px/1.2 'Space Grotesk', sans-serif;
  margin-top: 4px;
}

.zg-product-sticky-cta__price {
  align-items: baseline;
  color: var(--zg-gold);
  display: inline-flex;
  flex: 0 0 auto;
  font: 800 20px/1 'Space Grotesk', sans-serif;
  white-space: nowrap;
}

.zg-product-sticky-cta__price .amount,
.zg-product-sticky-cta__price .woocommerce-Price-amount,
.zg-product-sticky-cta__price .woocommerce-Price-currencySymbol {
  display: inline !important;
  white-space: nowrap;
}

.zg-product-sticky-cta .btn {
  flex: 0 0 auto;
  min-height: 44px;
  padding: 13px 22px;
}

.zg-foosball-story,
.zg-foosball-compare,
.zg-foosball-practical,
.zg-foosball-pillars,
.zg-foosball-close,
.zg-foosball-specs,
.zg-foosball-positioning {
  margin: 58px 0 0;
}

.zg-kicker {
  color: var(--zg-gold) !important;
  font: 800 12px/1.2 'Space Grotesk', sans-serif;
  letter-spacing: .14em;
  margin: 0 0 12px !important;
  text-transform: uppercase;
}

.zg-section-heading {
  margin: 0 0 26px;
  max-width: 720px;
}

.zg-section-heading h2,
.zg-foosball-story h2,
.zg-foosball-close h2 {
  color: var(--zg-text) !important;
  font-size: clamp(34px, 4vw, 58px);
  line-height: .95;
  margin: 0 0 20px;
}

.zg-foosball-story {
  align-items: center;
  display: grid;
  gap: 42px;
  grid-template-columns: minmax(0, .95fr) minmax(320px, 1.05fr);
}

.zg-foosball-story--reverse {
  grid-template-columns: minmax(320px, 1.05fr) minmax(0, .95fr);
}

.zg-foosball-story__copy {
  min-width: 0;
}

.zg-foosball-story__copy p,
.zg-foosball-close p,
.zg-foosball-practical p,
.zg-foosball-pillars p,
.zg-foosball-specs p {
  color: var(--zg-text-soft) !important;
  font-size: 17px;
  line-height: 1.75;
  margin: 0 0 18px;
}

.zg-benefit {
  background: var(--zg-surface-alt);
  border: 1px solid var(--zg-border);
  border-left: 4px solid var(--zg-gold);
  border-radius: 8px;
  color: var(--zg-text) !important;
  font-weight: 800;
  line-height: 1.5;
  margin-top: 22px;
  padding: 18px 20px;
}

.zg-foosball-story__media {
  background: #fff;
  border: 1px solid var(--zg-border);
  border-radius: 8px;
  box-shadow: 0 22px 62px rgba(40,34,24,.10);
  margin: 0;
  overflow: hidden;
  padding: 18px;
}

.zg-foosball-story__media img {
  aspect-ratio: 4 / 3;
  display: block;
  height: auto;
  object-fit: cover;
  width: 100%;
}

.zg-product--foosball-sales .zg-product__grid {
  align-items: start;
  background:
    radial-gradient(circle at 18% 18%, rgba(184,148,69,.12), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(247,245,239,.88));
  border: 1px solid rgba(184,148,69,.24);
  border-radius: 10px;
  box-shadow: 0 26px 72px rgba(40,34,24,.11);
  gap: clamp(32px, 5vw, 72px);
  margin: 14px 0 26px;
  padding: clamp(24px, 4vw, 48px);
}

.zg-product--foosball-sales .zg-product__gallery {
  background: #fff;
  border: 1px solid rgba(184,148,69,.22);
  border-radius: 10px;
  box-shadow: 0 20px 54px rgba(40,34,24,.12);
  padding: clamp(14px, 2vw, 24px);
  position: relative;
  top: auto;
}

.zg-product--foosball-sales .woocommerce-product-gallery__image img {
  border-radius: 6px;
}

.zg-product--foosball-sales .flex-control-thumbs {
  display: grid !important;
  gap: 10px !important;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-top: 16px !important;
}

.zg-product--foosball-sales .flex-control-thumbs li {
  width: auto !important;
}

.zg-product--foosball-sales .flex-control-thumbs img {
  aspect-ratio: 1 / 1;
  border: 1px solid var(--zg-border);
  border-radius: 6px;
  object-fit: cover;
  padding: 2px;
}

.zg-product--foosball-sales .zg-product__summary {
  max-width: 560px;
}

.zg-product--foosball-sales .product_title {
  font-size: clamp(44px, 5vw, 72px) !important;
  line-height: .9 !important;
  margin-bottom: 14px !important;
}

.zg-product--foosball-sales .zg-product-sales-intro {
  background: #fff;
  border: 1px solid rgba(184,148,69,.24);
  border-radius: 10px;
  box-shadow: 0 20px 50px rgba(40,34,24,.10);
  margin: 20px 0 22px;
  padding: clamp(24px, 3vw, 34px);
}

.zg-product--foosball-sales .zg-product-sales-intro h2 {
  font-size: clamp(44px, 5vw, 76px) !important;
  line-height: .86 !important;
  margin-bottom: 18px !important;
}

.zg-product--foosball-sales .zg-product-sales-intro p {
  color: #4d4841 !important;
  font-size: 17px;
  line-height: 1.65;
}

.zg-product--foosball-sales .price {
  color: var(--zg-text) !important;
  font-size: 34px !important;
  font-weight: 800 !important;
  margin: 18px 0 !important;
}

.zg-product--foosball-sales .zg-product__description {
  color: #4b463f !important;
  font-size: 16px;
  line-height: 1.75;
  max-width: 620px;
}

.zg-product--foosball-sales .zg-product__trust {
  margin: 20px 0;
}

.zg-product--foosball-sales .zg-product-feature-icons {
  background: #fff;
  border: 1px solid rgba(184,148,69,.24);
  border-radius: 10px;
  box-shadow: 0 18px 48px rgba(40,34,24,.09);
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin: 0 0 60px;
  padding: 14px;
}

.zg-product--foosball-sales .zg-product-feature-icons__item {
  align-items: center;
  background: var(--zg-surface-alt);
  border: 1px solid var(--zg-border);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  justify-items: center;
  min-height: 92px;
  padding: 14px 10px;
  text-align: center;
}

.zg-product--foosball-sales .zg-product-feature-icons__mark {
  align-items: center;
  background: var(--zg-gold);
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  font-weight: 900;
  height: 28px;
  justify-content: center;
  width: 28px;
}

.zg-product--foosball-sales .zg-product-feature-icons__item span:last-child {
  color: var(--zg-text);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.zg-product--foosball-sales .zg-foosball-story {
  background: linear-gradient(135deg, rgba(255,255,255,.72), rgba(247,245,239,.48));
  border: 1px solid rgba(184,148,69,.18);
  border-radius: 10px;
  box-shadow: 0 18px 58px rgba(40,34,24,.08);
  padding: clamp(24px, 4vw, 46px);
}

.zg-product--foosball-sales .zg-foosball-story__media {
  padding: 10px;
}

.zg-product--foosball-sales .zg-foosball-story__media img {
  aspect-ratio: 1 / 1;
}

.zg-product--foosball-sales .zg-benefit {
  background: #fff;
  box-shadow: 0 10px 26px rgba(40,34,24,.07);
}

.zg-product--foosball-sales .zg-foosball-compare__table {
  background: #fff;
}

.zg-product--foosball-sales .zg-foosball-compare__table strong {
  background: linear-gradient(90deg, rgba(184,148,69,.13), rgba(184,148,69,.05));
}

.zg-product--foosball-sales .zg-foosball-pillars__grid > div {
  min-height: 220px;
}

.zg-product--foosball-sales .zg-foosball-close {
  background:
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(247,245,239,.92));
}

.zg-foosball-compare,
.zg-foosball-pillars,
.zg-foosball-close,
.zg-foosball-specs {
  background: var(--zg-surface);
  border: 1px solid var(--zg-border);
  border-radius: 8px;
  box-shadow: var(--zg-shadow-card);
  padding: clamp(28px, 5vw, 54px);
}

.zg-foosball-positioning {
  align-items: center;
  background:
    radial-gradient(circle at 100% 0%, rgba(184,148,69,.12), transparent 38%),
    #fff;
  border: 1px solid rgba(184,148,69,.22);
  border-radius: 10px;
  box-shadow: 0 18px 50px rgba(40,34,24,.09);
  display: grid;
  gap: 34px;
  grid-template-columns: minmax(260px, .9fr) minmax(0, 1.1fr);
  margin-top: 0;
  padding: clamp(24px, 4vw, 42px);
}

.zg-foosball-positioning h2 {
  color: var(--zg-text) !important;
  font-size: clamp(40px, 5vw, 70px);
  line-height: .88;
  margin: 0;
}

.zg-foosball-positioning p:last-child {
  color: #4d4841 !important;
  font-size: 18px;
  line-height: 1.75;
  margin: 0;
}

.zg-foosball-compare__table {
  border: 1px solid var(--zg-border);
  border-radius: 8px;
  margin-bottom: 28px;
  overflow: hidden;
}

.zg-foosball-compare__table > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.zg-foosball-compare__table span,
.zg-foosball-compare__table strong {
  border-bottom: 1px solid var(--zg-border);
  color: var(--zg-text-soft);
  display: block;
  padding: 18px 20px;
}

.zg-foosball-compare__table strong {
  background: rgba(184,148,69,.08);
  border-left: 1px solid var(--zg-border);
  color: var(--zg-text);
}

.zg-foosball-compare__head span {
  background: var(--zg-surface-alt);
  color: var(--zg-text) !important;
  font: 800 12px/1.2 'Space Grotesk', sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.zg-foosball-compare__table > div:last-child span,
.zg-foosball-compare__table > div:last-child strong {
  border-bottom: 0;
}

.zg-foosball-practical {
  display: grid;
  gap: 22px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.zg-foosball-practical > div,
.zg-foosball-pillars__grid > div {
  background: var(--zg-surface);
  border: 1px solid var(--zg-border);
  border-radius: 8px;
  box-shadow: var(--zg-shadow-card);
  padding: 28px;
}

.zg-foosball-practical h3,
.zg-foosball-pillars h3 {
  color: var(--zg-text) !important;
  font: 800 22px/1.15 'Bebas Neue', sans-serif;
  letter-spacing: .03em;
  margin: 0 0 14px;
  text-transform: uppercase;
}

.zg-foosball-practical strong {
  color: var(--zg-text);
  display: block;
}

.zg-foosball-pillars__grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.zg-foosball-pillars__grid span {
  align-items: center;
  background: var(--zg-gold);
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  font-weight: 900;
  height: 36px;
  justify-content: center;
  margin-bottom: 18px;
  width: 36px;
}

.zg-foosball-close {
  align-items: center;
  display: grid;
  gap: clamp(24px, 4vw, 54px);
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  overflow: hidden;
  position: relative;
  text-align: left;
}

.zg-foosball-close::before {
  background: rgba(184,148,69,.12);
  content: '';
  height: 100%;
  position: absolute;
  right: 34%;
  top: 0;
  width: 1px;
}

.zg-foosball-close h2 {
  max-width: 660px;
}

.zg-foosball-close p {
  margin-left: 0;
  margin-right: 0;
  max-width: 680px;
}

.zg-foosball-close .zg-product__trust {
  justify-content: flex-start;
  margin: 24px 0 0;
  max-width: 760px;
}

.zg-foosball-close__buy {
  background: #fff;
  border: 1px solid rgba(184,148,69,.28);
  border-radius: 8px;
  box-shadow: 0 18px 44px rgba(40,34,24,.10);
  display: grid;
  gap: 16px;
  padding: clamp(22px, 3vw, 32px);
}

.zg-foosball-close__buy span {
  color: var(--zg-text);
  font: 800 16px/1.35 'Space Grotesk', sans-serif;
}

.zg-foosball-close__buy strong {
  color: var(--zg-gold);
  font: 800 30px/1 'Space Grotesk', sans-serif;
}

.zg-foosball-close__buy strong .amount,
.zg-foosball-close__buy strong .woocommerce-Price-amount,
.zg-foosball-close__buy strong .woocommerce-Price-currencySymbol {
  display: inline !important;
  white-space: nowrap;
}

.zg-foosball-specs {
  padding: 0;
}

.zg-foosball-specs details {
  padding: 0;
}

.zg-foosball-specs summary {
  color: var(--zg-text);
  cursor: pointer;
  font: 800 16px/1.2 'Space Grotesk', sans-serif;
  list-style: none;
  padding: 24px 28px;
}

.zg-foosball-specs summary::-webkit-details-marker {
  display: none;
}

.zg-foosball-specs summary::after {
  color: var(--zg-gold);
  content: '+';
  float: right;
  font-size: 22px;
  line-height: 1;
}

.zg-foosball-specs details[open] summary::after {
  content: '-';
}

.zg-foosball-specs details > div {
  border-top: 1px solid var(--zg-border);
  padding: 24px 28px 30px;
}

.zg-learn-card,
.zg-learn-step {
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.zg-learn-card:hover,
.zg-learn-step:hover {
  border-color: rgba(184,148,69,.42) !important;
  box-shadow: 0 22px 54px rgba(40,34,24,.12) !important;
  transform: translateY(-3px);
}

.zg-learn-card .elementor-widget-button {
  margin-top: auto;
}

.zg-learn-card-badge {
  align-self: flex-start !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
  width: auto !important;
  max-width: max-content !important;
  --width: auto !important;
}

.zg-learn-card-badge .eyebrow,
.zg-learn-card-badge .elementor-heading-title {
  margin: 0 !important;
  color: var(--zg-ink, #151515) !important;
  letter-spacing: 1.8px !important;
}

.zg-learn-card .elementor-icon-list-items {
  display: grid !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.zg-learn-card .elementor-icon-list-item {
  align-items: flex-start !important;
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  gap: 10px !important;
}

.zg-learn-card .elementor-icon-list-icon {
  display: grid !important;
  place-items: center !important;
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  margin-top: 1px !important;
  border-radius: 999px !important;
  background: rgba(184,148,69,.13) !important;
  color: var(--zg-gold, #b89445) !important;
}

.zg-learn-card .elementor-icon-list-icon i {
  display: none !important;
  color: var(--zg-gold, #b89445) !important;
  font-size: 10px !important;
}

.zg-learn-card .elementor-icon-list-icon::before {
  content: '\2713';
  color: var(--zg-gold, #b89445);
  font: 900 12px/1 var(--zg-body-font, 'Space Grotesk', sans-serif);
}

.zg-learn-card .elementor-icon-list-text {
  color: rgba(21,21,21,.68) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

.zg-learn-safety .elementor-icon-list-items {
  column-count: 2;
  column-gap: 28px;
}

.zg-learn-step .elementor-widget-icon .elementor-icon {
  align-items: center !important;
  background: rgba(184,148,69,.13) !important;
  border: 1px solid rgba(184,148,69,.24) !important;
  border-radius: 999px !important;
  color: var(--zg-gold, #b89445) !important;
  display: inline-flex !important;
  height: 42px !important;
  justify-content: center !important;
  line-height: 1 !important;
  width: 42px !important;
}

.zg-learn-step .elementor-widget-icon svg {
  display: block !important;
  height: 18px !important;
  width: 18px !important;
}

.zg-learn-step .elementor-widget-icon i {
  color: var(--zg-gold, #b89445) !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

.zg-learn-safety .elementor-icon-list-item {
  break-inside: avoid !important;
  display: grid !important;
  gap: 12px !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  margin-bottom: 16px !important;
}

.zg-learn-safety .elementor-icon-list-icon {
  background: rgba(184,148,69,.13) !important;
  border-radius: 999px !important;
  color: var(--zg-gold, #b89445) !important;
  display: grid !important;
  height: 24px !important;
  margin-top: 2px !important;
  place-items: center !important;
  width: 24px !important;
}

.zg-learn-safety .elementor-icon-list-icon i {
  display: none !important;
}

.zg-learn-safety .elementor-icon-list-icon::before {
  content: '\2713';
  color: var(--zg-gold, #b89445);
  font: 900 12px/1 var(--zg-body-font, 'Space Grotesk', sans-serif);
}

.zg-learn-safety .elementor-icon-list-text {
  color: rgba(21,21,21,.70) !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

@media (max-width: 900px) {
  .elementor .e-con {
    max-width: 100% !important;
  }
  .elementor .steps-grid,
  .elementor .steps-grid > .e-con-inner {
    flex-wrap: wrap !important;
  }
  .elementor .steps-grid .step {
    flex-basis: calc(50% - 10px) !important;
    width: calc(50% - 10px) !important;
  }
  .zg-foosball-story,
  .zg-foosball-story--reverse,
  .zg-foosball-practical,
  .zg-foosball-pillars__grid {
    grid-template-columns: 1fr;
  }
  .zg-product--foosball-sales .zg-product-feature-icons {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .zg-foosball-story--reverse .zg-foosball-story__media {
    order: 2;
  }
}

@media (max-width: 620px) {
  .woocommerce div.product .woocommerce-tabs .panel {
    padding: 22px 18px 28px !important;
  }
  .woocommerce div.product .woocommerce-tabs ul.tabs {
    padding: 0 14px !important;
  }
  .elementor .steps-section,
  .elementor #learn-main,
  .elementor #faq {
    padding-top: 46px !important;
    padding-bottom: 46px !important;
  }
  .elementor .articles-grid--full {
    gap: 18px !important;
    margin-bottom: 28px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  .elementor .article-full {
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
  }
  .elementor .article-full__image {
    height: 86px !important;
    min-height: 0 !important;
    padding: 0 !important;
  }
  .zg-learn-feature {
    padding: 24px !important;
  }
  .zg-learn-safety .elementor-icon-list-items {
    column-count: 1;
  }
  .elementor .article-full__image svg {
    height: 42px !important;
    width: 42px !important;
  }
  .zg-product-sticky-cta {
    align-items: stretch;
    display: grid;
    gap: 10px;
    padding: 12px;
    width: calc(100% - 20px);
  }
  .zg-product-sticky-cta__content {
    align-items: flex-start;
    display: grid;
    gap: 8px;
  }
  .zg-product-sticky-cta__title {
    max-width: 100%;
    white-space: normal;
  }
  .zg-product-sticky-cta__note {
    display: none;
  }
  .zg-product-sticky-cta__price {
    font-size: 18px;
  }
  .zg-product-sticky-cta .btn {
    width: 100%;
  }
  .zg-product--foosball-sales .zg-product__grid {
    border-radius: 8px;
    padding: 18px;
  }
  .zg-product--foosball-sales .product_title {
    font-size: 40px !important;
  }
  .zg-product--foosball-sales .zg-product-sales-intro h2 {
    font-size: 44px !important;
  }
  .zg-foosball-positioning {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .zg-foosball-positioning h2 {
    font-size: 42px;
  }
  .zg-product--foosball-sales .zg-product-feature-icons {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 36px;
  }
  .zg-product--foosball-sales .zg-product-feature-icons__item {
    min-height: 86px;
  }
  .zg-foosball-story,
  .zg-foosball-compare,
  .zg-foosball-practical,
  .zg-foosball-pillars,
  .zg-foosball-close,
  .zg-foosball-specs {
    margin-top: 36px;
  }
  .zg-foosball-compare__table > div {
    grid-template-columns: 1fr;
  }
  .zg-foosball-compare__table strong {
    border-left: 0;
  }
  .zg-foosball-close {
    grid-template-columns: 1fr;
    text-align: left;
  }
  .zg-foosball-close::before {
    display: none;
  }
  .zg-foosball-close .zg-product__trust {
    justify-content: flex-start;
  }
  .zg-foosball-story__copy p,
  .zg-foosball-close p,
  .zg-foosball-practical p,
  .zg-foosball-pillars p,
  .zg-foosball-specs p {
    font-size: 15px;
  }
  .elementor .article-full .e-con-inner,
  .elementor .article-full__header > .e-con-inner,
  .elementor .article-full__body > .e-con-inner,
  .elementor .article-full__points > .e-con-inner {
    gap: 0 !important;
    padding: 0 !important;
  }
  .elementor .article-full__header {
    min-height: 0 !important;
    padding: 18px !important;
  }
  .elementor .article-full__num {
    font-size: 42px !important;
    right: 16px !important;
    top: 12px !important;
  }
  .elementor .article-full__label {
    font-size: 11px !important;
    margin-bottom: 8px !important;
  }
  .elementor .article-full__title {
    font-size: 25px !important;
    line-height: 1.05 !important;
  }
  .elementor .article-full__title .elementor-heading-title {
    font-size: 25px !important;
    line-height: 1.05 !important;
  }
  .elementor .article-full__body {
    min-height: 0 !important;
    padding: 18px !important;
  }
  .single-post.elementor-page .zg-article-h2,
  .single-post.elementor-page .zg-article-h2 > .e-con-inner {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 8px !important;
  }
  .single-post.elementor-page .elementor > .e-con:first-child {
    --padding-top: 50px !important;
    --padding-bottom: 30px !important;
  }
  .single-post.elementor-page .elementor > .e-con:nth-child(2) {
    --padding-top: 24px !important;
  }
  .single-post.elementor-page .zg-article-card {
    padding: 34px 24px !important;
  }
  .single-post.elementor-page .zg-heading-line {
    flex: 0 0 auto !important;
    max-width: 44px !important;
    width: 44px !important;
    height: 3px !important;
  }
  .elementor .article-full__desc {
    flex: 0 1 auto !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin-bottom: 16px !important;
  }
  .elementor .article-full__points {
    gap: 8px !important;
    margin-bottom: 18px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .elementor .article-full__point {
    font-size: 13px !important;
    line-height: 1.5 !important;
  }
  .elementor .safety-banner {
    box-sizing: border-box !important;
    margin: 28px 14px !important;
    padding: 22px !important;
    width: auto !important;
  }
  .elementor .learn-cta {
    margin-top: 28px !important;
    padding: 28px 18px !important;
  }
  .elementor .step {
    flex-basis: 100% !important;
    padding: 24px 18px !important;
    width: 100% !important;
  }
.elementor .step__num {
    font-size: 36px !important;
  }
  .elementor .zg-compare-table-scroll {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    overscroll-behavior-x: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .elementor .zg-compare-table-scroll > .e-con-inner {
    min-width: 760px !important;
  }
  .elementor .zg-compare-row {
    flex-wrap: nowrap !important;
    gap: 8px !important;
    min-width: 760px !important;
    width: auto !important;
  }
  .elementor .zg-compare-row > .e-con-inner {
    flex-wrap: nowrap !important;
  }
  .elementor .zg-compare-row > .e-con,
  .elementor .zg-compare-row > .e-con-inner > .e-con {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
  }
  .elementor .zg-compare-row > .e-con:first-child,
  .elementor .zg-compare-row > .e-con-inner > .e-con:first-child {
    flex: 0 0 170px !important;
    position: sticky !important;
    left: 0 !important;
    z-index: 3 !important;
    background: var(--zg-surface) !important;
  }
}

/* WooCommerce fallback product grid: Elementor Free has no Woo product grid
   widgets, so shop/product listing cards are standardized in the theme. */
.woocommerce ul.products,
.woocommerce ul.products.zg-product-grid,
.woocommerce ul.products.columns-4,
.woocommerce ul.products.columns-3,
.woocommerce ul.products.columns-2,
.home ul.products,
.home ul.products.columns-2 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
  list-style: none !important;
  margin: 0 auto !important;
  max-width: 1160px !important;
  padding: 0 !important;
}

.woocommerce ul.products li.product,
.home ul.products li.product {
  display: flex !important;
  flex-direction: column !important;
  float: none !important;
  list-style: none !important;
  margin: 0 !important;
  min-width: 0 !important;
  width: auto !important;
}

.product-card,
.woocommerce ul.products li.product .product-card,
.home ul.products li.product .product-card {
  background: linear-gradient(180deg, #fff 0%, #fbfaf7 100%) !important;
  border: 1px solid rgba(184, 148, 69, .24) !important;
  border-radius: 8px !important;
  box-shadow: 0 18px 44px rgba(40, 34, 24, .10) !important;
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  height: 100% !important;
  overflow: hidden !important;
  position: relative !important;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}

.product-card:hover,
.woocommerce ul.products li.product .product-card:hover,
.home ul.products li.product .product-card:hover {
  border-color: rgba(184, 148, 69, .46) !important;
  box-shadow: 0 24px 58px rgba(40, 34, 24, .16) !important;
  transform: translateY(-3px) !important;
}

.product-card__image,
.woocommerce ul.products li.product .product-card__image,
.home ul.products li.product .product-card__image {
  align-items: center !important;
  aspect-ratio: 1 / 1 !important;
  background:
    radial-gradient(circle at 50% 38%, #fff 0%, #fff 42%, #f2efe7 100%) !important;
  border-bottom: 1px solid rgba(184, 148, 69, .20) !important;
  display: flex !important;
  justify-content: center !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 8px !important;
  position: relative !important;
}

.product-card__image::after,
.woocommerce ul.products li.product .product-card__image::after,
.home ul.products li.product .product-card__image::after {
  background: linear-gradient(90deg, transparent, rgba(184, 148, 69, .34), transparent) !important;
  bottom: 0 !important;
  content: "" !important;
  height: 1px !important;
  left: 10px !important;
  position: absolute !important;
  right: 10px !important;
}

.product-card__image img,
.woocommerce ul.products li.product img,
.home ul.products li.product img {
  background: transparent !important;
  border: 0 !important;
  display: block !important;
  height: 112% !important;
  max-height: none !important;
  max-width: none !important;
  object-fit: contain !important;
  padding: 0 !important;
  transition: transform .22s ease !important;
  width: 112% !important;
}

.product-card:hover .product-card__image img,
.woocommerce ul.products li.product .product-card:hover img,
.home ul.products li.product .product-card:hover img {
  transform: scale(1.035) !important;
}

.product-card__info {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  gap: 10px !important;
  padding: 18px 20px 20px !important;
}

.product-card__brand {
  color: var(--zg-gold) !important;
  font-family: var(--zg-body-font) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 1.4px !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

.product-card__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 19px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.12 !important;
  margin: 0 !important;
  min-height: 43px !important;
  text-transform: uppercase !important;
}

.product-card__title a,
.woocommerce ul.products li.product .woocommerce-loop-product__title a {
  font: inherit !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
}

.product-card__description {
  -webkit-box-orient: vertical !important;
  color: rgba(21, 21, 21, .78) !important;
  display: -webkit-box !important;
  font-family: var(--zg-body-font) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  min-height: 39px !important;
  overflow: hidden !important;
  -webkit-line-clamp: 2 !important;
}

.product-card__specs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin: 0 !important;
}

.product-card__spec {
  background: rgba(184, 148, 69, .09) !important;
  border: 1px solid rgba(184, 148, 69, .20) !important;
  border-radius: 999px !important;
  color: rgba(21, 21, 21, .72) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .7px !important;
  line-height: 1 !important;
  padding: 7px 9px !important;
  text-transform: uppercase !important;
}

.product-card__price {
  color: var(--zg-gold) !important;
  font-family: var(--zg-body-font) !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  margin: 0 !important;
}

.product-card__actions {
  display: grid !important;
  gap: 10px !important;
  margin-top: auto !important;
}

.product-card__actions .btn,
.product-card__actions .button,
.product-card__actions .added_to_cart.wc-forward {
  align-items: center !important;
  background: var(--zg-gold) !important;
  border: 1px solid var(--zg-gold) !important;
  border-radius: 6px !important;
  color: #fff !important;
  display: inline-flex !important;
  font-family: var(--zg-body-font) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  justify-content: center !important;
  letter-spacing: .9px !important;
  min-height: 44px !important;
  text-transform: uppercase !important;
  width: 100% !important;
}

.product-card__actions .btn:hover,
.product-card__actions .button:hover {
  background: #a9822f !important;
  border-color: #a9822f !important;
  color: #fff !important;
}

.product-card__actions .added_to_cart.wc-forward {
  background: transparent !important;
  border-color: rgba(184, 148, 69, .42) !important;
  color: var(--zg-ink) !important;
  min-height: 38px !important;
}

.product-card__actions .added_to_cart.wc-forward:hover {
  background: rgba(184, 148, 69, .10) !important;
  border-color: var(--zg-gold) !important;
  color: var(--zg-ink) !important;
}

@media (max-width: 1024px) {
  .woocommerce ul.products,
  .woocommerce ul.products.zg-product-grid,
  .woocommerce ul.products.columns-4,
  .woocommerce ul.products.columns-3,
  .woocommerce ul.products.columns-2,
  .home ul.products,
  .home ul.products.columns-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    max-width: calc(100vw - 40px) !important;
  }
}

@media (max-width: 900px) {
  .zg-portfolio-grid,
  .zg-portfolio-visual {
    grid-template-columns: 1fr;
  }
  .zg-portfolio-card {
    min-height: 0;
  }
}

@media (max-width: 900px) {
  .header-actions .nav-shop-btn {
    display: none !important;
  }

  .header-actions {
    margin-left: auto !important;
    max-width: max-content !important;
  }
}

@media (max-width: 640px) {
  .woocommerce ul.products,
  .woocommerce ul.products.zg-product-grid,
  .woocommerce ul.products.columns-4,
  .woocommerce ul.products.columns-3,
  .woocommerce ul.products.columns-2,
  .home ul.products,
  .home ul.products.columns-2 {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .product-card__image img,
  .woocommerce ul.products li.product img,
  .home ul.products li.product img {
    max-height: 260px !important;
  }
}

.zg-product-shelf {
  position: relative !important;
}

.zg-product-shelf::before {
  background: linear-gradient(90deg, transparent, rgba(184, 148, 69, .22), transparent) !important;
  content: "" !important;
  display: block !important;
  height: 1px !important;
  left: 50% !important;
  max-width: 1160px !important;
  position: absolute !important;
  top: 0 !important;
  transform: translateX(-50%) !important;
  width: calc(100% - 40px) !important;
}

.zg-product-shelf__header {
  align-items: flex-end !important;
  display: flex !important;
  gap: 28px !important;
  justify-content: space-between !important;
  margin-bottom: 32px !important;
  text-align: left !important;
}

.zg-product-shelf__header .section-title {
  margin-bottom: 10px !important;
  max-width: 680px !important;
}

.zg-product-shelf__header .section-sub {
  margin: 0 !important;
  max-width: 700px !important;
}

.zg-product-shelf .zg-home-products {
  max-width: 1160px !important;
}

.zg-product-shelf--earthsport {
  background: #fff !important;
}

.zg-product-shelf--earthsport::after {
  background: rgba(184, 148, 69, .08) !important;
  border: 1px solid rgba(184, 148, 69, .16) !important;
  border-radius: 999px !important;
  content: "EarthSport" !important;
  color: var(--zg-gold) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 2px !important;
  padding: 9px 14px !important;
  position: absolute !important;
  right: max(24px, calc((100vw - 1160px) / 2)) !important;
  text-transform: uppercase !important;
  top: 26px !important;
}

@media (max-width: 760px) {
  .zg-product-shelf__header {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

  .zg-product-shelf__header .btn {
    width: 100% !important;
  }

  .zg-product-shelf--earthsport::after {
    display: none !important;
  }
}

.reveal,
.reveal--fade,
.reveal--slide-left,
.reveal--slide-right {
  opacity: 1 !important;
  transform: none !important;
}

/* Premium homepage hero: Elementor Free containers/widgets, theme-styled. */
.elementor .zg-premium-hero {
  background:
    linear-gradient(115deg, rgba(255,255,255,.96) 0%, rgba(247,245,239,.92) 46%, rgba(240,238,232,.96) 100%) !important;
  border-bottom: 1px solid var(--zg-border) !important;
  overflow: hidden !important;
  position: relative !important;
}

.elementor .zg-premium-hero::before {
  background: linear-gradient(90deg, rgba(184,148,69,.36), transparent 68%) !important;
  content: "" !important;
  height: 1px !important;
  left: max(24px, calc((100vw - 1160px) / 2)) !important;
  position: absolute !important;
  top: 44px !important;
  width: min(420px, calc(100vw - 48px)) !important;
}

.elementor .zg-premium-hero__grid {
  align-items: center !important;
  display: flex !important;
  gap: 54px !important;
  margin: 0 auto !important;
  max-width: 1160px !important;
}

.elementor .zg-premium-hero > .e-con-inner,
.elementor .zg-premium-hero__grid > .e-con-inner {
  max-width: 1160px !important;
  width: 100% !important;
}

.elementor .zg-premium-hero__grid > .e-con-inner {
  align-items: center !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 54px !important;
  justify-content: space-between !important;
}

.elementor .zg-premium-hero__copy {
  flex: 0 1 535px !important;
  max-width: 575px !important;
  width: 48% !important;
}

.elementor .zg-premium-hero__visual {
  flex: 0 1 570px !important;
  width: 48% !important;
}

.elementor .zg-premium-hero__eyebrow .elementor-heading-title {
  color: var(--zg-gold) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 1.8px !important;
}

.elementor .zg-premium-hero__copy h1,
.elementor .zg-premium-hero__copy .elementor-heading-title {
  letter-spacing: 0 !important;
}

.elementor .zg-premium-hero__copy .elementor-widget-text-editor {
  max-width: 560px !important;
}

.elementor .zg-premium-hero__copy .elementor-button {
  border-radius: 6px !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  min-height: 48px !important;
  padding: 15px 24px !important;
}

.elementor .zg-premium-hero__proof-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 14px !important;
  margin-top: 14px !important;
}

.elementor .zg-premium-hero__proof-row > .e-con-inner {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 14px !important;
  width: 100% !important;
}

.elementor .zg-premium-hero__proof-card {
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(184,148,69,.22) !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 30px rgba(40,34,24,.07) !important;
  flex: 1 1 0 !important;
  padding: 15px 16px !important;
}

.elementor .zg-premium-hero__proof-card .elementor-icon-box-title,
.elementor .zg-premium-hero__float-card .elementor-icon-box-title {
  color: var(--zg-text) !important;
  font-family: var(--zg-body-font) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: .8px !important;
}

.elementor .zg-premium-hero__proof-card .elementor-icon-box-description,
.elementor .zg-premium-hero__float-card .elementor-icon-box-description {
  color: var(--zg-text-soft) !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

.elementor .zg-premium-hero__visual {
  position: relative !important;
}

.elementor .zg-premium-hero__stage {
  background:
    radial-gradient(circle at 50% 35%, rgba(255,255,255,1), rgba(240,238,232,.74) 68%),
    #f7f5ef !important;
  border: 1px solid rgba(184,148,69,.24) !important;
  border-radius: 8px !important;
  box-shadow: 0 26px 70px rgba(40,34,24,.14) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 16px !important;
  position: relative !important;
}

.elementor .zg-premium-hero__stage > .e-con-inner {
  display: block !important;
  position: relative !important;
}

.elementor .zg-premium-hero__video,
.elementor .zg-premium-hero__video .elementor-widget-container,
.elementor .zg-premium-hero__video .elementor-wrapper {
  border-radius: 6px !important;
  height: 100% !important;
  overflow: hidden !important;
  width: 100% !important;
}

.elementor .zg-premium-hero__video .elementor-wrapper {
  aspect-ratio: 16 / 9 !important;
  background: #151515 !important;
}

.elementor .zg-premium-hero__video video,
.elementor .zg-premium-hero__main-image img {
  display: block !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  margin: 0 auto !important;
  object-fit: contain !important;
  width: 100% !important;
}

.elementor .zg-premium-hero__float-card,
.elementor .zg-premium-hero__detail-card {
  background: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(184,148,69,.26) !important;
  border-radius: 8px !important;
  box-shadow: 0 16px 38px rgba(40,34,24,.12) !important;
  position: absolute !important;
  z-index: 3 !important;
}

.elementor .zg-premium-hero__float-card {
  max-width: 235px !important;
  padding: 14px 16px !important;
  right: -18px !important;
  top: 34px !important;
}

.elementor .zg-premium-hero__detail-card {
  bottom: -24px !important;
  left: 28px !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 190px !important;
}

.elementor .zg-premium-hero__detail-image img {
  aspect-ratio: 4 / 3 !important;
  display: block !important;
  object-fit: cover !important;
  width: 100% !important;
}

@media (max-width: 1024px) {
  .elementor .zg-premium-hero__grid {
    flex-direction: column !important;
    gap: 42px !important;
  }

  .elementor .zg-premium-hero__grid > .e-con-inner {
    flex-direction: column !important;
    gap: 42px !important;
  }

  .elementor .zg-premium-hero__copy,
  .elementor .zg-premium-hero__visual {
    flex: 0 1 auto !important;
    width: 100% !important;
  }

  .elementor .zg-premium-hero__stage {
    min-height: 0 !important;
  }

  .elementor .zg-premium-hero__video video,
  .elementor .zg-premium-hero__main-image img {
    height: auto !important;
  }
}

@media (max-width: 640px) {
  .elementor .zg-premium-hero::before {
    top: 28px !important;
  }

  .elementor .zg-premium-hero__copy .elementor-button {
    width: 100% !important;
  }

  .elementor .zg-premium-hero__proof-row {
    display: none !important;
    flex-direction: column !important;
  }

  .elementor .zg-premium-hero__proof-row > .e-con-inner {
    flex-direction: column !important;
  }

  .elementor .zg-premium-hero__stage {
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 10px !important;
  }

  .elementor .zg-premium-hero__video video,
  .elementor .zg-premium-hero__main-image img {
    height: auto !important;
  }

  .elementor .zg-premium-hero__float-card {
    display: none !important;
  }

  .elementor .zg-premium-hero__detail-card {
    bottom: 14px !important;
    left: 14px !important;
    width: 132px !important;
  }
}

/* Final product-card image fit/readability tuning. Product thumbnails include
   white canvas, so scale the image inside the clipped stage instead of adding
   more custom crops per product. */
.woocommerce ul.products li.product .product-card .product-card__image img,
.home ul.products li.product .product-card .product-card__image img,
.product-card .product-card__image img {
  height: 114% !important;
  max-height: none !important;
  max-width: none !important;
  transform: none !important;
  width: 114% !important;
}

.woocommerce ul.products li.product .product-card:hover .product-card__image img,
.home ul.products li.product .product-card:hover .product-card__image img,
.product-card:hover .product-card__image img {
  transform: scale(1.03) !important;
  transform-origin: center center !important;
}

.woocommerce ul.products li.product .product-card .product-card__description,
.home ul.products li.product .product-card .product-card__description,
.product-card .product-card__description {
  color: rgba(21, 21, 21, .82) !important;
}

/* Final header dropdown readability fix. The header is theme-based because
   Elementor Pro Theme Builder is not installed. */
#site-header .site-nav .sub-menu a,
#site-header .site-nav ul li .sub-menu a {
  color: #151515 !important;
  opacity: 1 !important;
}

#site-header .site-nav .sub-menu a:hover,
#site-header .site-nav ul li .sub-menu a:hover,
#site-header .site-nav .sub-menu a:focus,
#site-header .site-nav ul li .sub-menu a:focus {
  color: #111111 !important;
  background: rgba(191, 148, 55, 0.16) !important;
}

/* Final button typography stability fix. Elementor loads its own default
   button font rules, so force all button text onto the site body font. */
.elementor .elementor-button,
.elementor .elementor-button .elementor-button-content-wrapper,
.elementor .elementor-button .elementor-button-text,
.elementor-widget-button .elementor-button,
.elementor-widget-button .elementor-button .elementor-button-content-wrapper,
.elementor-widget-button .elementor-button .elementor-button-text,
.btn,
.button,
button,
input[type="button"],
input[type="submit"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
}

/* Final product template typography alignment. The game-table and inversion
   product templates should share the same site typography as Elementor pages:
   Bebas Neue for headings at normal weight, Space Grotesk for body/UI, and no
   one-off letter-spacing drift. */
.woocommerce div.product.zg-product,
.zg-product--inversion-template,
.zg-product--game-table-sales {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
}

.woocommerce div.product.zg-product .product_title,
.zg-product--inversion-template .product_title,
.zg-product--game-table-sales .product_title,
.zg-product--game-table-sales .zg-foosball-positioning h2,
.zg-product--game-table-sales .zg-foosball-story h2,
.zg-product--game-table-sales .zg-foosball-compare h2,
.zg-product--game-table-sales .zg-foosball-pillars h2,
.zg-product--game-table-sales .zg-foosball-close h2,
.zg-product--game-table-sales .zg-section-heading h2,
.zg-product--game-table-sales .zg-foosball-practical h3,
.zg-product--game-table-sales .zg-foosball-pillars h3,
.zg-product--inversion-template .zg-product__details h2,
.zg-product--inversion-template .woocommerce-Tabs-panel h2,
.zg-product--inversion-template .related > h2 {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none;
}

.woocommerce div.product.zg-product .product_title,
.zg-product--inversion-template .product_title,
.zg-product--game-table-sales .product_title {
  font-size: clamp(42px, 4.4vw, 62px) !important;
  line-height: .98 !important;
}

.zg-product--game-table-sales .zg-foosball-positioning h2,
.zg-product--game-table-sales .zg-foosball-story h2,
.zg-product--game-table-sales .zg-foosball-compare h2,
.zg-product--game-table-sales .zg-foosball-pillars h2,
.zg-product--game-table-sales .zg-foosball-close h2,
.zg-product--game-table-sales .zg-section-heading h2 {
  font-size: clamp(34px, 3.3vw, 48px) !important;
  line-height: 1 !important;
}

.zg-product--game-table-sales .zg-foosball-practical h3,
.zg-product--game-table-sales .zg-foosball-pillars h3,
.zg-product--inversion-template .zg-product__details h2,
.zg-product--inversion-template .woocommerce-Tabs-panel h2,
.zg-product--inversion-template .related > h2 {
  font-size: clamp(24px, 2.1vw, 34px) !important;
  line-height: 1.08 !important;
}

.zg-product--game-table-sales .zg-foosball-pillars__grid h3 {
  font-size: clamp(22px, 1.65vw, 27px) !important;
  line-height: 1.14 !important;
}

.zg-product--game-table-sales p,
.zg-product--game-table-sales li,
.zg-product--game-table-sales .zg-foosball-positioning p:last-child,
.zg-product--game-table-sales .zg-foosball-story__copy p,
.zg-product--game-table-sales .zg-foosball-close p,
.zg-product--game-table-sales .zg-foosball-practical p,
.zg-product--game-table-sales .zg-foosball-pillars p,
.zg-product--inversion-template p,
.zg-product--inversion-template li,
.zg-product__description {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.7 !important;
}

.woocommerce div.product.zg-product p.price,
.woocommerce div.product.zg-product span.price,
.woocommerce div.product.zg-product .zg-product__summary .price,
.woocommerce div.product.zg-product .zg-product__summary p.price,
.woocommerce div.product.zg-product .zg-product__summary span.price,
.zg-product.zg-product--game-table-sales .zg-product__summary .price,
.zg-product.zg-product--inversion-template .zg-product__summary .price,
.zg-product .zg-product__summary p.price,
.zg-product .zg-product__summary span.price,
.zg-product--game-table-sales .price,
.zg-product--inversion-template .price {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: clamp(24px, 2.4vw, 32px) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}

.woocommerce div.product.zg-product .zeus-product-specs h2,
.zg-product--inversion-template .zeus-product-specs h2,
.zg-product--game-table-sales .zeus-product-specs h2 {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: clamp(24px, 2.1vw, 34px) !important;
  font-weight: 400 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

.woocommerce div.product.zg-product .zeus-product-specs dt,
.woocommerce div.product.zg-product .zeus-product-specs dd {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  letter-spacing: 0 !important;
}

/* =============================================================================
   MEDISONIC BRAND PAGE  (page 32)
   =============================================================================
   Presentation for inc/elementor-sections-medisonic.php.

   Why the layout lives here rather than in Elementor settings: Elementor writes
   per-element control values into wp-content/uploads/elementor/css/post-32.css,
   which loads AFTER this stylesheet, and those values are fixed pixels with no
   fluid scale. The Medisonic builders therefore emit classes and (almost) no
   typography or layout settings, and everything below owns the result. Two
   consequences to keep in mind when editing:

     1. `!important` is load-bearing, not sloppy. Elementor's own frontend.min.css
        also loads after this file, so container defaults such as
        `.e-con.e-flex { flex-direction: column }` outrank an equal-specificity
        theme selector. Layout properties on `.e-con` elements need it.
     2. Never key a rule to a generated Elementor element id
        (`.elementor-element-ae52d757`). zg_id() mints a fresh uuid on every page
        rebuild, so those selectors die silently. Section and block classes only.

   Structure: shared primitives, then one block per build-sheet section in page
   order, then the tablet and mobile collapses.
   ========================================================================== */

/* --- page shell + Elementor resets ---------------------------------------- */

body.page-id-32 .site-main {
  background: var(--zg-page-bg, #f7f5ef) !important;
}

body.page-id-32 .elementor > .e-con {
  min-height: 0 !important;
}

/* Spacing is expressed as container `gap` throughout, so the per-widget bottom
   margin Elementor adds by default would double every gap. */
body.page-id-32 .elementor-widget {
  margin-bottom: 0 !important;
}

body.page-id-32 .e-con {
  --gap: 0px;
}

body.page-id-32 .elementor-widget-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0;
}

body.page-id-32 .elementor-widget-heading .elementor-heading-title {
  margin: 0;
}

/* --- shared type primitives ----------------------------------------------- */

.zg-med-eyebrow .elementor-heading-title {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .2em !important;
  line-height: 1.4 !important;
  text-transform: uppercase !important;
  color: var(--zg-gold, #b89445) !important;
}

.zg-med-h2 .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: clamp(32px, 4.4vw, 54px) !important;
  font-weight: 400 !important;
  letter-spacing: .01em !important;
  line-height: .96 !important;
  color: var(--zg-text, #151515) !important;
}

.zg-med-h2 .elementor-heading-title span {
  color: var(--zg-gold, #b89445) !important;
}

.zg-med-lede,
.zg-med-lede p {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: clamp(15px, 1.15vw, 17px) !important;
  line-height: 1.72 !important;
  color: var(--zg-text-soft, rgba(21, 21, 21, .66)) !important;
}

.zg-med-lede p {
  margin: 0 !important;
}

.zg-med-head {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  max-width: 700px !important;
}

.zg-med-head--center {
  margin-inline: auto !important;
  align-items: center !important;
  text-align: center !important;
}

/* On this page the second button in a pair is the quieter of the two. The
   global button rule paints every Elementor button gold, which left the two
   hero CTAs visually identical. */
body.page-id-32 .zg-med-hero__actions .elementor-widget-button:nth-child(2) .elementor-button,
body.page-id-32 .zg-med-close__actions .elementor-widget-button:nth-child(2) .elementor-button {
  background: transparent !important;
  border-color: rgba(184, 148, 69, .55) !important;
  color: var(--zg-text, #151515) !important;
}

body.page-id-32 .zg-med-hero__actions .elementor-widget-button:nth-child(2) .elementor-button:hover,
body.page-id-32 .zg-med-close__actions .elementor-widget-button:nth-child(2) .elementor-button:hover {
  background: rgba(184, 148, 69, .1) !important;
  border-color: var(--zg-gold, #b89445) !important;
}

/* --- 01  hero - full-bleed lifestyle campaign ----------------------------- */

/* One visual treatment. The lifestyle frame IS the hero: no card, no border, no
   framed catalogue shot, no second product image. Every word is real HTML in
   .zg-med-hero__panel - nothing is composited into the picture.

   Geometry. The supplied frame is 3:2 and its subject fills nearly the whole
   height: the model's head sits near the top edge and the ankle system near the
   bottom. assets/medisonic/hero-lifestyle-wide-* is a 2:1 crop that removes only
   empty ceiling and rug, and the stage below is 21:10 - so `cover` still leaves
   roughly 4% of vertical margin around head and ankles at every width in range.
   Take the stage wider than 21:10 and the crop starts eating the model.
   max-width caps the bleed so ultra-wide monitors do not force that crop. */

.zg-med-hero {
  position: relative !important;
  max-width: 1920px !important;
  margin-inline: auto !important;
  overflow: hidden !important;
  isolation: isolate !important;
  background: var(--zg-page-bg, #f7f5ef) !important;
}

/* The picture is anchored to the right and stops short of the left edge. The
   scrim is already ~95% opaque out there, so the hero's own background colour
   fills that strip invisibly - and in exchange the media box becomes narrower
   than the asset, which is what lets object-position shift the model and the
   table clear of the copy. A full-width media layer cannot do that: at these
   proportions cover scales by width, so horizontal positioning has no overflow
   to work with and the ankle system lands under the buttons. */
.zg-med-hero__media {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  right: 0 !important;
  left: auto !important;
  width: 76% !important;
  padding: 0 !important;
  z-index: 0 !important;
  -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 16%) !important;
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 16%) !important;
}

.zg-med-hero__media .elementor-widget-image,
.zg-med-hero__media .elementor-widget-container,
.zg-med-hero__picture {
  display: block !important;
  height: 100% !important;
}

.zg-med-hero__media img {
  width: 100% !important;
  height: 100% !important;
  /* X 58% pushes the table and the model right, away from the panel;
     Y 44% keeps the head clear of the top edge and takes the crop off the rug. */
  object-fit: cover !important;
  object-position: 58% 44% !important;
}

/* Left-weighted scrim. It lifts the copy off the photograph and fades out well
   before the model, so the picture is never flattened under a full-width wash. */
.zg-med-hero::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(
    90deg,
    rgba(248, 246, 239, 1) 0%,
    rgba(248, 246, 239, .97) 28%,
    rgba(248, 246, 239, .78) 42%,
    rgba(248, 246, 239, .3) 56%,
    rgba(248, 246, 239, 0) 72%
  ) !important;
}

.zg-med-hero__inner {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: flex-start !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 1240px !important;
  margin-inline: auto !important;
  padding: 56px 24px !important;
  /* ~21:10 against the viewport. 44vw is the ratio; the floor and ceiling keep
     it a hero on a small laptop and stop it swallowing an ultra-wide screen. */
  min-height: clamp(560px, 44vw, 760px) !important;
}

.zg-med-hero__panel {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 16px !important;
  width: 40% !important;
  min-width: 340px !important;
  max-width: 520px !important;
}

.zg-med-hero__eyebrow .elementor-heading-title {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .22em !important;
  line-height: 1.4 !important;
  text-transform: uppercase !important;
  color: var(--zg-gold, #b89445) !important;
}

.zg-med-hero__kicker .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: clamp(19px, 1.7vw, 26px) !important;
  font-weight: 400 !important;
  letter-spacing: .08em !important;
  line-height: 1 !important;
  color: rgba(21, 21, 21, .78) !important;
}

/* "LESS TENSION. MORE LIFE." is a deliberate two-line lockup. The panel measure
   above is what holds the break there; do not widen one without the other. */
.zg-med-hero__title .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: clamp(52px, 4.6vw, 72px) !important;
  font-weight: 400 !important;
  letter-spacing: .005em !important;
  line-height: .92 !important;
  color: var(--zg-text, #151515) !important;
  /* Keeps 'LESS TENSION.' and 'MORE LIFE.' on their own lines instead of
     orphaning 'LIFE.'. The panel measure alone breaks after 'MORE'. Browsers
     without text-wrap: balance fall back to that - two lines either way, never
     three. */
  text-wrap: balance !important;
}

.zg-med-hero__copy,
.zg-med-hero__copy p {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: clamp(16px, 1.15vw, 17.5px) !important;
  line-height: 1.7 !important;
  color: rgba(21, 21, 21, .74) !important;
}

.zg-med-hero__copy p {
  margin: 0 !important;
  max-width: 34em !important;
}

.zg-med-hero__actions {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  margin-top: 8px !important;
}

/* The panel sits on the photograph, so the secondary button needs a solid fill
   rather than a transparent outline to stay legible over the scrim's tail. */
body.page-id-32 .zg-med-hero__actions .elementor-widget-button:nth-child(2) .elementor-button {
  background: rgba(255, 255, 255, .88) !important;
  border-color: rgba(184, 148, 69, .55) !important;
  color: var(--zg-text, #151515) !important;
  backdrop-filter: blur(3px) !important;
}

body.page-id-32 .zg-med-hero__actions .elementor-widget-button:nth-child(2) .elementor-button:hover {
  background: #fff !important;
  border-color: var(--zg-gold, #b89445) !important;
}


/* --- 02  why inversion ---------------------------------------------------- */

.zg-med-benefits__figure {
  overflow: hidden !important;
  border: 1px solid rgba(184, 148, 69, .22) !important;
  border-radius: 22px !important;
}

.zg-med-benefits__figure img {
  aspect-ratio: 15 / 7 !important;
  object-fit: cover !important;
  object-position: center 42% !important;
}

.zg-med-benefits__split {
  display: grid !important;
  grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr) !important;
  gap: 56px !important;
  align-items: start !important;
  margin-top: 52px !important;
}

.zg-med-benefits__grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-content: start !important;
  gap: 22px 30px !important;
}

.zg-med-benefit {
  display: grid !important;
  grid-template-columns: 62px minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: center !important;
}

.zg-med-benefit__icon {
  width: 62px !important;
}

.zg-med-benefit__icon img {
  width: 62px !important;
  height: 62px !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 0 0 1px rgba(184, 148, 69, .38), 0 6px 16px rgba(40, 34, 24, .08) !important;
}

.zg-med-benefit__label .elementor-heading-title {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  color: var(--zg-text, #151515) !important;
}

/* --- 03  a higher standard (trust band) ----------------------------------- */

/* The one dark band on the page. Contrast is the credibility device; there is
   deliberately no seal, badge or mark, and no wording beyond the client's. */
.zg-med-trust {
  background: linear-gradient(180deg, #1c1811 0%, #131009 100%) !important;
}

.zg-med-trust__inner {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 20px !important;
  max-width: 840px !important;
  margin-inline: auto !important;
  text-align: center !important;
}

.zg-med-trust__eyebrow {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  width: 100% !important;
}

.zg-med-trust__eyebrow::before,
.zg-med-trust__eyebrow::after {
  content: "" !important;
  width: clamp(24px, 6vw, 60px) !important;
  height: 1px !important;
  background: rgba(202, 166, 90, .45) !important;
}

.zg-med-trust__eyebrow .elementor-heading-title {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .24em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  color: var(--zg-gold-bright, #caa65a) !important;
}

.zg-med-trust__title .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: clamp(36px, 5.6vw, 70px) !important;
  font-weight: 400 !important;
  letter-spacing: .01em !important;
  line-height: .94 !important;
  color: #fbf8f1 !important;
}

.zg-med-trust__title .elementor-heading-title span {
  color: var(--zg-gold-bright, #caa65a) !important;
}

.zg-med-trust__body,
.zg-med-trust__body p {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: clamp(15px, 1.15vw, 17px) !important;
  line-height: 1.78 !important;
  color: rgba(251, 248, 241, .72) !important;
}

.zg-med-trust__body p {
  margin: 0 !important;
  max-width: 660px !important;
  margin-inline: auto !important;
}

.zg-med-trust__line {
  width: 100% !important;
  max-width: 520px !important;
  margin-top: 10px !important;
  padding-top: 26px !important;
  border-top: 1px solid rgba(202, 166, 90, .3) !important;
}

.zg-med-trust__line .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: clamp(21px, 2.6vw, 32px) !important;
  font-weight: 400 !important;
  letter-spacing: .05em !important;
  line-height: 1.1 !important;
  color: var(--zg-gold-bright, #caa65a) !important;
}

/* --- 04  spine-first design (product anatomy) ----------------------------- */

.zg-med-anatomy__stage {
  position: relative !important;
  max-width: 1000px !important;
  margin: 56px auto 0 !important;
}

.zg-med-anatomy__figure {
  width: 42% !important;
  margin-inline: auto !important;
  overflow: hidden !important;
  border: 1px solid rgba(184, 148, 69, .2) !important;
  border-radius: 20px !important;
  background: #fff !important;
}

.zg-med-anatomy__callout {
  position: absolute !important;
  width: 25% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}

/* Leader line + node, drawn toward the product so each label reads as pointing
   at the part it names. Both are dropped below 1024px, where the callouts
   unpin into a plain grid. */
.zg-med-anatomy__callout::after {
  content: "" !important;
  position: absolute !important;
  top: 11px !important;
  width: 34px !important;
  height: 1px !important;
  background: rgba(184, 148, 69, .5) !important;
}

.zg-med-anatomy__callout::before {
  content: "" !important;
  position: absolute !important;
  top: 8px !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: var(--zg-gold, #b89445) !important;
}

.zg-med-anatomy__callout--1,
.zg-med-anatomy__callout--3 {
  left: 0 !important;
  align-items: flex-end !important;
  text-align: right !important;
}

.zg-med-anatomy__callout--2,
.zg-med-anatomy__callout--4 {
  right: 0 !important;
  align-items: flex-start !important;
  text-align: left !important;
}

.zg-med-anatomy__callout--1::after,
.zg-med-anatomy__callout--3::after {
  right: -38px !important;
  left: auto !important;
}

.zg-med-anatomy__callout--1::before,
.zg-med-anatomy__callout--3::before {
  right: -46px !important;
  left: auto !important;
}

.zg-med-anatomy__callout--2::after,
.zg-med-anatomy__callout--4::after {
  left: -38px !important;
  right: auto !important;
}

.zg-med-anatomy__callout--2::before,
.zg-med-anatomy__callout--4::before {
  left: -46px !important;
  right: auto !important;
}

.zg-med-anatomy__callout--1 { top: 3% !important; }
.zg-med-anatomy__callout--2 { top: 25% !important; }
.zg-med-anatomy__callout--3 { top: 47% !important; }
.zg-med-anatomy__callout--4 { top: 69% !important; }

.zg-med-anatomy__index .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: 16px !important;
  letter-spacing: .18em !important;
  line-height: 1 !important;
  color: var(--zg-gold, #b89445) !important;
}

.zg-med-anatomy__label .elementor-heading-title {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  color: var(--zg-text, #151515) !important;
}

/* --- 05  heat, vibration, control (feature spotlight) --------------------- */

.zg-med-spotlight__stage {
  display: grid !important;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr) !important;
  gap: 56px !important;
  align-items: center !important;
}

.zg-med-spotlight__media {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(184, 148, 69, .22) !important;
  border-radius: 22px !important;
  background: #fff !important;
}

.zg-med-spotlight__photo img {
  aspect-ratio: 9 / 10 !important;
  object-fit: cover !important;
  object-position: center 38% !important;
}

.zg-med-spotlight__media::after {
  content: "" !important;
  position: absolute !important;
  z-index: 1 !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: radial-gradient(72% 52% at 50% 42%, rgba(184, 148, 69, .18), rgba(184, 148, 69, 0) 72%) !important;
}

.zg-med-spotlight__panel {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  align-items: flex-start !important;
}

/* The approved paragraph carries "(Available on select tables)" and sits
   directly above these markers so the qualifier governs them. Do not reorder. */
.zg-med-spotlight__chips {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 10px !important;
}

.zg-med-chip {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 11px !important;
  width: auto !important;
  padding: 12px 20px !important;
  border: 1px solid rgba(184, 148, 69, .38) !important;
  border-radius: 999px !important;
  background: #fff !important;
  box-shadow: 0 6px 18px rgba(40, 34, 24, .06) !important;
}

.zg-med-chip__icon,
.zg-med-badge__icon {
  line-height: 0 !important;
}

.zg-med-chip__icon .elementor-icon,
.zg-med-badge__icon .elementor-icon {
  font-size: 17px !important;
  color: var(--zg-gold, #b89445) !important;
}

.zg-med-chip__icon svg,
.zg-med-badge__icon svg {
  width: 17px !important;
  height: 17px !important;
  fill: var(--zg-gold, #b89445) !important;
}

.zg-med-chip__label .elementor-heading-title {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  color: var(--zg-text, #151515) !important;
}

/* --- 06  full range of motion (progression) ------------------------------- */

.zg-med-progression__rail {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 28px !important;
  margin-top: 52px !important;
}

.zg-med-step {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
}

.zg-med-step__figure {
  width: 100% !important;
  overflow: hidden !important;
  border: 1px solid rgba(184, 148, 69, .2) !important;
  border-radius: 16px !important;
  background: #fff !important;
}

.zg-med-step__figure img {
  aspect-ratio: 4 / 3 !important;
  object-fit: contain !important;
}

.zg-med-step__node {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 13px !important;
  margin: 20px 0 12px !important;
}

.zg-med-step__node::before {
  content: "" !important;
  position: relative !important;
  z-index: 1 !important;
  width: 11px !important;
  height: 11px !important;
  border: 2px solid var(--zg-gold, #b89445) !important;
  border-radius: 50% !important;
  background: var(--zg-page-bg, #f7f5ef) !important;
}

/* Connector to the next step. The last step has none, and every step is given
   the same weight - 90 degrees is never framed as the goal. */
.zg-med-step__node::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: calc(100% + 28px) !important;
  height: 1px !important;
  background: rgba(184, 148, 69, .38) !important;
}

.zg-med-step:last-child .zg-med-step__node::after {
  display: none !important;
}

.zg-med-step__value .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: clamp(30px, 3.4vw, 44px) !important;
  font-weight: 400 !important;
  letter-spacing: .02em !important;
  line-height: 1 !important;
  color: var(--zg-gold, #b89445) !important;
}

/* --- 07  built-in safety -------------------------------------------------- */

/* No weight capacity appears here or anywhere else on this page. The client's
   safety graphic asserts 300 LB; three live models are rated 250 LB and the
   conflict is unresolved, so the artwork is cropped to exclude the badge. */
.zg-med-safety__stage {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 52px !important;
  align-items: stretch !important;
  margin-top: 48px !important;
}

.zg-med-safety__figure {
  overflow: hidden !important;
  border: 1px solid rgba(184, 148, 69, .22) !important;
  border-radius: 22px !important;
}

.zg-med-safety__figure img {
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  object-position: center 58% !important;
}

.zg-med-safety__list {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 0 !important;
}

.zg-med-safety__item {
  display: grid !important;
  grid-template-columns: 118px minmax(0, 1fr) !important;
  gap: 22px !important;
  align-items: center !important;
  padding: 26px 0 !important;
  border-top: 1px solid #e2dcce !important;
}

.zg-med-safety__item:last-child {
  border-bottom: 1px solid #e2dcce !important;
}

.zg-med-safety__thumbwrap {
  overflow: hidden !important;
  border: 1px solid rgba(184, 148, 69, .2) !important;
  border-radius: 12px !important;
  background: #fff !important;
}

.zg-med-safety__thumb img {
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
}

.zg-med-safety__label .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: clamp(21px, 2.3vw, 29px) !important;
  font-weight: 400 !important;
  letter-spacing: .02em !important;
  line-height: 1.05 !important;
  color: var(--zg-text, #151515) !important;
}

/* --- 08  ready when you are (before / after) ------------------------------ */

.zg-med-storage__pair {
  display: grid !important;
  max-width: 940px !important;
  margin-inline: auto !important;
  grid-template-columns: minmax(0, 1fr) 84px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 0 !important;
  margin-top: 52px !important;
}

.zg-med-storage__panel {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 12px !important;
  text-align: center !important;
}

.zg-med-storage__figure {
  width: 100% !important;
  overflow: hidden !important;
  border: 1px solid rgba(184, 148, 69, .2) !important;
  border-radius: 20px !important;
  background: #fff !important;
}

.zg-med-storage__figure img {
  aspect-ratio: 4 / 5 !important;
  padding: 14px !important;
  object-fit: contain !important;
}

.zg-med-storage__state .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: clamp(27px, 3.1vw, 40px) !important;
  font-weight: 400 !important;
  letter-spacing: .03em !important;
  line-height: 1 !important;
  color: var(--zg-text, #151515) !important;
}

.zg-med-storage__caption .elementor-heading-title {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
  color: var(--zg-gold, #b89445) !important;
}

/* Connector: points right while the panels sit side by side, down once they
   stack, so the open -> folded sequence never depends on left/right position. */
.zg-med-storage__link {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  align-self: center !important;
}

.zg-med-storage__link::before {
  content: "" !important;
  width: 40px !important;
  height: 1px !important;
  background: rgba(184, 148, 69, .55) !important;
}

.zg-med-storage__link::after {
  content: "" !important;
  width: 9px !important;
  height: 9px !important;
  margin-left: -6px !important;
  border-top: 1px solid var(--zg-gold, #b89445) !important;
  border-right: 1px solid var(--zg-gold, #b89445) !important;
  transform: rotate(45deg) !important;
}

/* --- 09  choose your tier ------------------------------------------------- */

/* Column count follows the tier count, so the client's unresolved fifth tier
   drops in as one more array entry in zg_content_brands(). Cards carry a name
   and a photograph only: no price, capacity, specification or per-tier link,
   because none has been supplied and a per-tier link would itself assert a
   tier-to-product mapping the client has not confirmed. */
.zg-med-tiers__grid {
  display: grid !important;
  grid-template-columns: repeat(var(--zg-tier-cols, 4), minmax(0, 1fr)) !important;
  gap: 24px !important;
  margin-top: 52px !important;
}

.zg-med-tiers--4 .zg-med-tiers__grid { --zg-tier-cols: 4 !important; }
.zg-med-tiers--5 .zg-med-tiers__grid { --zg-tier-cols: 5 !important; }
.zg-med-tiers--6 .zg-med-tiers__grid { --zg-tier-cols: 3 !important; }

.zg-med-lineup__figure {
  width: min(100%, 1180px) !important;
  margin: 52px auto 0 !important;
  overflow: hidden !important;
  border: 1px solid #e2dcce !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 16px 38px rgba(40, 34, 24, .08) !important;
}

.zg-med-lineup__figure .elementor-widget-image,
.zg-med-lineup__figure .elementor-widget-container,
.zg-med-lineup__figure img {
  width: 100% !important;
}

.zg-med-lineup__figure img {
  display: block !important;
  height: auto !important;
}

.zg-med-tier {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 22px 18px 20px !important;
  border: 1px solid #e2dcce !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 10px 26px rgba(40, 34, 24, .06) !important;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease !important;
}

.zg-med-tier:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(184, 148, 69, .5) !important;
  box-shadow: 0 18px 36px rgba(40, 34, 24, .1) !important;
}

.zg-med-tier__figure {
  width: 100% !important;
}

.zg-med-tier__figure img {
  aspect-ratio: 17 / 30 !important;
  object-fit: contain !important;
}

.zg-med-tier__name {
  width: 100% !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(184, 148, 69, .3) !important;
  text-align: center !important;
}

.zg-med-tier__name .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: clamp(22px, 2.4vw, 30px) !important;
  font-weight: 400 !important;
  letter-spacing: .05em !important;
  line-height: 1 !important;
  color: var(--zg-text, #151515) !important;
}

/* --- 10  closing --------------------------------------------------------- */

.zg-med-close {
  position: relative !important;
}

.zg-med-close::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: min(1240px, calc(100% - 48px)) !important;
  height: 1px !important;
  background: #e2dcce !important;
}

.zg-med-close__inner {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 22px !important;
  max-width: 780px !important;
  margin-inline: auto !important;
  text-align: center !important;
}

.zg-med-close__title .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: clamp(40px, 5.8vw, 76px) !important;
  font-weight: 400 !important;
  letter-spacing: .01em !important;
  line-height: .94 !important;
  color: var(--zg-text, #151515) !important;
}

.zg-med-close__body,
.zg-med-close__body p {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: clamp(15px, 1.2vw, 17.5px) !important;
  line-height: 1.76 !important;
  color: var(--zg-text-soft, rgba(21, 21, 21, .66)) !important;
}

.zg-med-close__body p {
  margin: 0 !important;
}

/* The build sheet supplies the trust badges as one "·"-separated row, not as
   three cards. */
.zg-med-close__trust {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 0 !important;
  margin-top: 4px !important;
}

.zg-med-badge {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  width: auto !important;
  padding: 6px 26px !important;
  border-left: 1px solid #ded8ca !important;
}

.zg-med-badge:first-child {
  border-left: 0 !important;
}

.zg-med-badge__label .elementor-heading-title {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .03em !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
  color: var(--zg-text-soft, rgba(21, 21, 21, .66)) !important;
}

.zg-med-close__actions {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 14px !important;
  margin-top: 8px !important;
}

/* --- 11  disclaimer ------------------------------------------------------- */

.zg-med-disclaimer__box {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  max-width: 920px !important;
  margin-inline: auto !important;
  padding: 26px 30px !important;
  border: 1px solid rgba(184, 148, 69, .28) !important;
  border-radius: 14px !important;
  background: #fff7e4 !important;
}

.zg-med-disclaimer__title .elementor-heading-title {
  font-family: var(--zg-heading-font, 'Bebas Neue', sans-serif) !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: .04em !important;
  line-height: 1 !important;
  color: var(--zg-gold, #b89445) !important;
}

.zg-med-disclaimer__body,
.zg-med-disclaimer__body p {
  font-family: var(--zg-body-font, 'Space Grotesk', sans-serif) !important;
  font-size: 14.5px !important;
  line-height: 1.7 !important;
  color: rgba(21, 21, 21, .72) !important;
}

.zg-med-disclaimer__body p {
  margin: 0 !important;
}

/* Canonical disclaimer used by the shortcode and inversion product template. */
.zg-medical-disclaimer {
  margin: 18px 0 4px;
  padding: 18px 20px;
  border: 1px solid rgba(184, 148, 69, .45);
  border-radius: 8px;
  background: #f7f5ef;
  color: #151515;
  font-size: 14px;
  line-height: 1.65;
}

.zg-medical-disclaimer strong {
  display: block;
  margin-bottom: 5px;
  color: #151515;
}

.zg-medical-disclaimer p {
  margin: 0;
}

/* =============================================================================
   Tablet - complex compositions collapse cleanly.
   ========================================================================== */

@media (max-width: 1024px) {
  /* Stacked, not a squeezed overlay.
     Below 1025px an overlay cannot hold both halves: to fit five lines of copy
     the stage has to grow taller than the picture is wide, cover then scales by
     height, and the horizontal overflow crops the ankle system straight out of
     frame while the remaining copy still lands on the table. So the picture
     takes its own band and the copy sits beneath it on the page background,
     where contrast is unconditional and the type can stay full size.
     The <picture> also switches to the uncropped 3:2 frame here - see
     zeus_gear_medisonic_hero_set() - so head, ankle system and frame all
     survive. */
  .zg-med-hero {
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
  }

  .zg-med-hero__media {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    right: auto !important;
    left: auto !important;
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }

  .zg-med-hero__media img {
    object-position: 50% 45% !important;
  }

  .zg-med-hero::before {
    display: none !important;
  }

  .zg-med-hero__inner {
    min-height: 0 !important;
    padding: 40px 24px 52px !important;
  }

  .zg-med-hero__panel {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 640px !important;
  }

  .zg-med-hero__title .elementor-heading-title {
    font-size: clamp(46px, 6.4vw, 60px) !important;
  }

  body.page-id-32 .zg-med-hero__actions .elementor-widget-button:nth-child(2) .elementor-button {
    background: transparent !important;
    backdrop-filter: none !important;
  }

  .zg-med-benefits__split {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 32px !important;
    margin-top: 40px !important;
  }

  .zg-med-head {
    max-width: none !important;
  }

  .zg-med-benefits__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
  }

  .zg-med-benefit {
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    gap: 12px !important;
    text-align: center !important;
  }

  /* Callouts unpin: no absolute positioning, no leader lines, order preserved
     top to bottom so the reading sequence survives. */
  .zg-med-anatomy__stage {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px 28px !important;
    margin-top: 40px !important;
  }

  .zg-med-anatomy__figure {
    grid-column: 1 / -1 !important;
    width: min(320px, 78%) !important;
  }

  .zg-med-anatomy__callout {
    position: static !important;
    width: auto !important;
    align-items: flex-start !important;
    padding-left: 16px !important;
    border-left: 2px solid rgba(184, 148, 69, .35) !important;
    text-align: left !important;
  }

  .zg-med-anatomy__callout::before,
  .zg-med-anatomy__callout::after {
    display: none !important;
  }

  .zg-med-spotlight__stage {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 34px !important;
  }

  .zg-med-spotlight__media {
    max-width: 460px !important;
    margin-inline: auto !important;
  }

  .zg-med-progression__rail {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 26px !important;
    margin-top: 40px !important;
  }

  .zg-med-step:nth-child(2n) .zg-med-step__node::after {
    display: none !important;
  }

  .zg-med-safety__stage {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 34px !important;
    margin-top: 40px !important;
  }

  .zg-med-safety__figure {
    max-width: 460px !important;
    margin-inline: auto !important;
  }

  .zg-med-safety__figure img {
    aspect-ratio: 16 / 11 !important;
    object-position: center 32% !important;
  }

  .zg-med-tiers__grid {
    grid-template-columns: repeat(var(--zg-tier-cols-tablet, 4), minmax(0, 1fr)) !important;
    gap: 18px !important;
    margin-top: 40px !important;
  }

  .zg-med-tiers--5 .zg-med-tiers__grid,
  .zg-med-tiers--6 .zg-med-tiers__grid {
    --zg-tier-cols-tablet: 3 !important;
  }
}

/* =============================================================================
   Mobile - every section stays legible without relying on left/right position.
   ========================================================================== */

@media (max-width: 720px) {
  /* Phone deltas on top of the stacked treatment inherited from <=1024px.
     Match the full 3:2 phone source so the model's head, ankle system and
     complete frame remain visible without an object-fit crop. */
  .zg-med-hero__media {
    aspect-ratio: 3 / 2 !important;
  }

  .zg-med-hero__media img {
    object-position: 50% 50% !important;
  }

  .zg-med-hero__inner {
    padding: 30px 18px 40px !important;
  }

  .zg-med-hero__panel {
    max-width: none !important;
    gap: 14px !important;
  }

  .zg-med-hero__title .elementor-heading-title {
    font-size: clamp(38px, 11vw, 48px) !important;
  }

  .zg-med-hero__actions .elementor-widget-button,
  .zg-med-close__actions .elementor-widget-button {
    flex: 1 1 100% !important;
  }

  .zg-med-hero__actions .elementor-button,
  .zg-med-close__actions .elementor-button {
    width: 100% !important;
    justify-content: center !important;
  }

  .zg-med-benefits__figure img {
    aspect-ratio: 3 / 2 !important;
  }

  /* Thumbnail beside label: keeps the label at full reading size instead of
     shrinking it to fit under a circle. */
  .zg-med-benefits__grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
  }

  .zg-med-benefit {
    grid-template-columns: 54px minmax(0, 1fr) !important;
    justify-items: start !important;
    gap: 16px !important;
    padding: 14px 0 !important;
    border-top: 1px solid #e6e0d2 !important;
    text-align: left !important;
  }

  .zg-med-benefit:last-child {
    border-bottom: 1px solid #e6e0d2 !important;
  }

  .zg-med-benefit__icon,
  .zg-med-benefit__icon img {
    width: 54px !important;
    height: 54px !important;
  }

  .zg-med-benefit__label .elementor-heading-title {
    font-size: 15.5px !important;
  }

  .zg-med-anatomy__stage {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 18px !important;
  }

  .zg-med-anatomy__figure {
    width: min(260px, 72%) !important;
  }

  .zg-med-spotlight__chips {
    gap: 10px !important;
  }

  .zg-med-chip {
    padding: 10px 16px !important;
  }

  .zg-med-progression__rail {
    gap: 20px 16px !important;
  }

  .zg-med-step__node {
    margin: 14px 0 8px !important;
  }

  .zg-med-safety__item {
    grid-template-columns: 88px minmax(0, 1fr) !important;
    gap: 16px !important;
    padding: 16px 0 !important;
  }

  .zg-med-storage__pair {
    grid-template-columns: minmax(0, 1fr) !important;
    margin-top: 36px !important;
  }

  .zg-med-storage__link {
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    height: 66px !important;
  }

  .zg-med-storage__link::before {
    width: 1px !important;
    height: 38px !important;
  }

  .zg-med-storage__link::after {
    margin-left: 0 !important;
    margin-top: -6px !important;
    transform: rotate(135deg) !important;
  }

  .zg-med-tiers__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }

  .zg-med-tier {
    padding: 14px 12px 16px !important;
    border-radius: 14px !important;
  }

  .zg-med-badge {
    padding: 5px 16px !important;
  }

  .zg-med-badge__label .elementor-heading-title {
    font-size: 12.5px !important;
  }

  .zg-med-disclaimer__box {
    padding: 22px 20px !important;
  }
}

@media (max-width: 420px) {
  .zg-med-close__trust {
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
  }

  .zg-med-badge {
    padding: 0 !important;
    border-left: 0 !important;
  }
}


/* ---------------------------------------------------------------------------
   Compare page: shared-feature grid and equal-height product cards.
   The shared list replaces 9 identical table rows, so it must read as a
   scannable feature grid, not as a paragraph of stacked lines.
   --------------------------------------------------------------------------- */

.elementor ul.zg-shared-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px 36px !important;
  list-style: none !important;
  margin: 8px auto 0 !important;
  max-width: 960px !important;
  padding: 0 !important;
  text-align: left !important;
}

.elementor ul.zg-shared-list li {
  color: var(--zg-text) !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 0 0 28px !important;
  position: relative !important;
}

.elementor ul.zg-shared-list li::before {
  border-bottom: 2px solid var(--zg-gold) !important;
  border-left: 2px solid var(--zg-gold) !important;
  content: '' !important;
  display: block !important;
  height: 6px !important;
  left: 2px !important;
  position: absolute !important;
  top: 6px !important;
  transform: rotate(-45deg) !important;
  width: 12px !important;
}

@media (max-width: 900px) {
  .elementor ul.zg-shared-list { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 560px) {
  .elementor ul.zg-shared-list { grid-template-columns: 1fr !important; gap: 12px !important; }
}

/* Product cards: equal height with the CTA pinned to the bottom edge, so a
   card with one fewer spec line does not float its button up the row. */

body.page-id-33 .elementor .e-con-inner { align-items: stretch !important; }

body.page-id-33 .elementor .elementor-widget-button { margin-top: auto !important; }



/* zg-compare-spacing: the shared disclaimer section carries 96px of bottom
   padding for the Medisonic brand page; on Compare it sits directly above a
   CTA, which left a large empty band. */



/* ---------------------------------------------------------------------------
   zg-mobile-overflow-guards

   Three rules set widths larger than a 375px viewport can hold once the 18px
   side gutters are subtracted (339px of usable width). They were previously
   hidden by body{overflow-x:hidden} rather than fixed, which still allows
   sideways rubber-banding on iOS.
   --------------------------------------------------------------------------- */

@media (max-width: 600px) {

  /* Two retailer buttons at 210px each cannot sit in 339px. Stack them. */
  .zg-product__retailers { flex-wrap: wrap !important; }

  .zg-product__retailers .btn {
    min-width: 0 !important;
    width: 100% !important;
  }

  /* 340px minimum on a 339px canvas is a guaranteed one-pixel overflow. */
  .zg-med-hero__panel {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Long button labels cannot wrap while nowrap is set, so they push the
     layout wider instead of breaking onto a second line. */
  .btn,
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce input.button {
    white-space: normal !important;
    max-width: 100% !important;
  }

  /* Filter cards should fill the row rather than force a 240px column. */
  .shop-sidebar .filter-card { min-width: 0 !important; }

}


/* Where to Buy retailer picker */
.zg-wtb { position: relative; }
.zg-wtb__toggle { width: 100%; cursor: pointer; }
.zg-wtb__panel { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.zg-wtb__panel[hidden] { display: none; }
.zg-wtb__option { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 18px; border: 1px solid rgba(0,0,0,.14); border-radius: var(--r-sm, 6px); background: #fff; color: inherit; font-weight: 600; font-size: 15px; text-decoration: none; transition: var(--t, .2s ease); }
.zg-wtb__option::after { content: '\2197'; font-size: 14px; opacity: .55; }
.zg-wtb__option:hover, .zg-wtb__option:focus-visible { border-color: var(--gold-line, #c9a227); color: var(--gold-bright, #b8933f); }


/* MSRP qualifier shown beside every catalog price */
.zg-price-msrp { display: inline-block; margin-left: .45em; font-size: .5em; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; opacity: .55; vertical-align: middle; white-space: nowrap; }
.product-card__price .zg-price-msrp { font-size: .62em; letter-spacing: .1em; }

/* === Medisonic inversion product pages: lifestyle image slots + centered details === */
.zg-foosball-positioning--has-image {
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr);
}
.zg-foosball-positioning__copy {
  display: grid;
  gap: 22px;
}
.zg-foosball-positioning__media {
  background: #fff;
  border: 1px solid var(--zg-border);
  border-radius: 8px;
  box-shadow: 0 22px 62px rgba(40,34,24,.10);
  margin: 0;
  overflow: hidden;
  padding: 10px;
}
.zg-foosball-positioning__media img {
  aspect-ratio: 1 / 1;
  display: block;
  height: auto;
  object-fit: cover;
  width: 100%;
}
.zg-foosball-practical__media {
  border-radius: 6px;
  margin: 0 0 20px;
  overflow: hidden;
}
.zg-foosball-practical__media img {
  aspect-ratio: 1 / 1;
  display: block;
  height: auto;
  object-fit: cover;
  width: 100%;
}
.zg-game-table-description--centered {
  grid-template-columns: 1fr !important;
  text-align: center;
}
.zg-game-table-description--centered .zg-game-table-description__content {
  margin: 0 auto;
  max-width: 860px;
}
.zg-game-table-description--centered .zg-game-table-description__content figure {
  margin-left: auto;
  margin-right: auto;
}
.zg-game-table-description--centered .zg-game-table-description__content img {
  display: block;
  margin: 0 auto;
}
.zg-game-table-description--centered .zg-game-table-description__content ul,
.zg-game-table-description--centered .zg-game-table-description__content ol {
  list-style-position: inside;
  margin-left: 0;
  padding-left: 0;
}
@media (max-width: 620px) {
  .zg-foosball-positioning--has-image {
    grid-template-columns: 1fr;
  }
}
