/* ================================================
   ZeaGrove Brand Styles
   Standalone brand stylesheet for ZeaGrove Child Theme
   ================================================ */

/* ----- Custom Properties ----- */
:root {
    --zg-primary: #2D8A4E;
    --zg-primary-dark: #1E6B37;
    --zg-primary-light: #E8F5EC;
    --zg-accent: #C8A45C;
    --zg-accent-dark: #A8883E;
    --zg-accent-light: #F5EDD6;
    --zg-gray-100: #F8F9FA;
    --zg-gray-200: #E9ECEF;
    --zg-gray-300: #DEE2E6;
    --zg-gray-400: #ADB5BD;
    --zg-gray-500: #6C757D;
    --zg-gray-600: #495057;
    --zg-gray-700: #343A40;
    --zg-gray-800: #212529;

    /* Radius */
    --zg-radius-sm: 6px;
    --zg-radius-md: 8px;
    --zg-radius-lg: 12px;
    --zg-radius-xl: 16px;
    --zg-radius-full: 9999px;

    /* Shadows */
    --zg-shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
    --zg-shadow-md: 0 4px 12px rgba(0,0,0,0.08);
    --zg-shadow-lg: 0 8px 30px rgba(0,0,0,0.10);
    --zg-shadow-xl: 0 20px 50px rgba(0,0,0,0.12);

    /* Transitions */
    --zg-transition-fast: 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --zg-transition-base: 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --zg-transition-slow: 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Global base improvements */
html {
    scroll-behavior: smooth;
}

::selection {
    background: var(--zg-primary);
    color: #fff;
}

/* Better focus states for accessibility */
:focus-visible {
    outline: 2px solid var(--zg-primary);
    outline-offset: 2px;
    border-radius: var(--zg-radius-sm);
}

/* Remove default focus for mouse users */
:focus:not(:focus-visible) {
    outline: none;
}

/* ----- Container ----- */
.zg-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* ==========================================
   Typography
   ========================================== */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--zg-gray-800);
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6,
.site-title,
.page-title,
.entry-title,
.widget-title {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    color: var(--zg-gray-800);
}

/* ==========================================
   Color Overrides
   ========================================== */
a {
    color: var(--zg-primary);
}
a:hover {
    color: var(--zg-primary-dark);
}

#primary,
#secondary,
.page-title,
.entry-title a,
.site-title a,
.widget-title {
    color: var(--zg-gray-800);
}

.wp-block-heading,
h1, h2, h3, h4, h5, h6,
.page-title,
.entry-title,
.comment-author .fn,
.comment-author .url,
.related-post-title a,
.nav-links a,
.post-navigation a {
    color: var(--zg-gray-800);
}

/* ==========================================
   Header & Navigation — ZeaGrove
   ========================================== */

/* --- Site Wrapper --- */
.zg-site-wrapper {
    display: flex;
    flex-direction: column;
}

/* --- Utility --- */
.zg-hide-mobile {
    display: none;
}
@media (min-width: 768px) {
    .zg-hide-mobile { display: block; }
}

/* --- Top Bar --- */
.zg-topbar {
    background: #1e3a2a;
    color: rgba(255,255,255,0.7);
    font-size: 0.8125rem;
    line-height: 1;
    display: none;
}
.zg-topbar-inner {
    display: flex;
    align-items: center;
    min-height: 36px;
}
.zg-topbar-info {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-left: auto;
}
.zg-topbar-item {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}
.zg-topbar-item svg {
    opacity: 0.6;
    flex-shrink: 0;
}
.zg-topbar-item a {
    color: inherit;
    text-decoration: none;
}
.zg-topbar-item a:hover {
    color: #ffffff;
}

/* Topbar left area */
.zg-topbar-left {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}
.zg-topbar-left span {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}
.zg-topbar-left svg {
    opacity: 0.6;
    flex-shrink: 0;
}

/* Topbar right area */
.zg-topbar-right {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-left: auto;
}
.zg-topbar-social {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.zg-topbar-social a {
    color: rgba(255,255,255,0.5);
    transition: color 0.2s ease;
    display: inline-flex;
}
.zg-topbar-social a:hover {
    color: #fff;
}

/* Language switcher */
.zg-lang-switcher {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
}
.zg-lang-current {
    font-weight: 600;
    font-size: 0.8125rem;
    text-transform: uppercase;
}
.zg-lang-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 8px;
    min-width: 140px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.12);
    padding: 0.5rem;
    z-index: 99;
}
.zg-lang-dropdown a {
    display: block;
    padding: 0.5rem 0.75rem;
    color: var(--zg-gray-600);
    text-decoration: none;
    font-size: 0.875rem;
    border-radius: 6px;
    transition: background 0.2s ease;
}
.zg-lang-dropdown a:hover {
    background: var(--zg-gray-100);
    color: var(--zg-primary);
}

@media (min-width: 768px) {
    .zg-topbar { display: block; }
}

/* --- Navbar --- */
.zg-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #ffffff;
    border-bottom: 1px solid var(--zg-gray-200);
    transition: box-shadow 0.3s ease;
}
.zg-header.scrolled {
    box-shadow: 0 2px 20px rgba(0,0,0,0.08);
}

.zg-navbar-inner,
.zg-header-inner {
    display: flex;
    align-items: center;
    min-height: 68px;
    gap: 1.5rem;
}

/* Header CTA area */
.zg-header-cta {
    display: none;
    flex-shrink: 0;
    align-items: center;
    gap: 0.75rem;
    margin-left: auto;
}
@media (min-width: 1024px) {
    .zg-header-cta { display: flex; }
}

.zg-btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--zg-gray-600);
    border-radius: 8px;
    transition: background 0.2s ease;
}
.zg-btn-icon:hover {
    background: var(--zg-gray-100);
}

/* Logo area */
.zg-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
.zg-logo .custom-logo-link {
    display: inline-block;
    line-height: 0;
}
.zg-logo .custom-logo {
    max-height: 38px;
    width: auto;
}
.zg-logo-link {
    display: inline-block;
    line-height: 0;
}
.zg-logo-img {
    max-height: 38px;
    width: auto;
}
.zg-logo-text {
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--zg-gray-800);
    line-height: 1.3;
}

/* Navigation */
.zg-nav {
    margin-left: auto;
    display: none;
}
.zg-nav ul {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0.25rem;
}
.zg-nav li {
    position: relative;
    margin: 0;
}
.zg-nav a {
    display: block;
    padding: 0.5rem 0.9rem;
    color: var(--zg-gray-600);
    font-weight: 500;
    font-size: 0.9375rem;
    text-decoration: none;
    transition: color 0.2s ease;
    white-space: nowrap;
}
.zg-nav a:hover,
.zg-nav .current-menu-item > a,
.zg-nav .current_page_item > a {
    color: var(--zg-primary);
}
.zg-nav .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background: #ffffff;
    border-top: 3px solid var(--zg-primary);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    padding: 0.5rem 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: all 0.25s ease;
    z-index: 99;
}
.zg-nav li:hover > .sub-menu,
.zg-nav li:focus-within > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.zg-nav .sub-menu a {
    padding: 0.5rem 1.25rem;
    font-size: 0.875rem;
}
.zg-nav .sub-menu a:hover {
    background: var(--zg-gray-100);
}

/* Mega Menu */
.zg-nav-item-has-mega {
    position: relative;
}
.zg-megamenu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(8px);
    min-width: 680px;
    background: #fff;
    border-top: 3px solid var(--zg-primary);
    box-shadow: 0 20px 50px rgba(0,0,0,0.12);
    border-radius: 0 0 12px 12px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.25s ease;
    z-index: 99;
    padding: 0;
}
.zg-nav-item-has-mega:hover .zg-megamenu,
.zg-nav-item-has-mega:focus-within .zg-megamenu {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}
.zg-megamenu-inner {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr 1fr;
    gap: 1px;
    background: var(--zg-gray-200);
}
.zg-megamenu-featured {
    padding: 1.5rem;
    background: #fff;
    display: flex;
    flex-direction: column;
}
.zg-megamenu-featured h4 {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--zg-gray-800);
    margin: 0 0 0.75rem;
}
.zg-megamenu-featured p {
    font-size: 0.875rem;
    color: var(--zg-gray-500);
    line-height: 1.6;
    margin: 0;
}
.zg-megamenu-col {
    padding: 1.5rem;
    background: #fff;
}
.zg-megamenu-col h4 {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--zg-gray-500);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: 0 0 1rem;
}
.zg-megamenu-col a {
    display: block;
    padding: 0.4rem 0;
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--zg-gray-600);
    white-space: nowrap;
}
.zg-megamenu-col a:hover {
    color: var(--zg-primary);
    background: none;
}

/* Nav CTA button */
.zg-nav-cta {
    display: none;
    flex-shrink: 0;
}
@media (min-width: 1024px) {
    .zg-nav { display: flex; }
    .zg-nav-cta { display: inline-block; }
}

/* --- Mobile toggle --- */
.zg-mobile-toggle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    width: 36px;
    height: 36px;
    margin-left: auto;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}
.zg-mtoggle-bar {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--zg-gray-800);
    border-radius: 2px;
    transition: none;
}
@media (min-width: 1024px) {
    .zg-mobile-toggle { display: none; }
}

/* --- Mobile panel --- */
.zg-mobile-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    z-index: 200;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}
.zg-mobile-overlay.open {
    opacity: 1;
    visibility: visible;
}

.zg-mobile-panel {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 300px;
    max-width: 85vw;
    background: #ffffff;
    z-index: 201;
    transform: translateX(100%);
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
    box-shadow: -4px 0 20px rgba(0,0,0,0.1);
}
.zg-mobile-panel.open {
    transform: translateX(0);
}

.zg-mpanel-header,
.zg-mobile-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--zg-gray-200);
}
.zg-mpanel-header .zg-logo-text,
.zg-mobile-panel-header .zg-logo-text {
    font-size: 1rem;
}

.zg-mobile-close,
.zg-mobile-panel-close {
    background: none;
    border: none;
    font-size: 1.25rem;
    cursor: pointer;
    color: var(--zg-gray-600);
    padding: 4px;
    line-height: 1;
}
.zg-mobile-panel-close:hover {
    color: var(--zg-gray-800);
}

.zg-mobile-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: 1px solid var(--zg-gray-200);
    border-radius: 8px;
    width: 36px;
    height: 36px;
    cursor: pointer;
    color: var(--zg-gray-600);
    transition: all 0.2s ease;
}
.zg-mobile-back:hover {
    background: var(--zg-gray-100);
    color: var(--zg-gray-800);
}

.zg-mobile-nav {
    flex: 1;
    overflow-y: auto;
    padding: 0.5rem 0;
}
.zg-mobile-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.zg-mobile-nav a {
    display: block;
    padding: 0.75rem 1.5rem;
    color: var(--zg-gray-600);
    font-weight: 500;
    font-size: 0.9375rem;
    text-decoration: none;
    border-bottom: 1px solid var(--zg-gray-100);
}
.zg-mobile-nav a:hover,
.zg-mobile-nav .current-menu-item > a {
    color: var(--zg-primary);
    background: var(--zg-gray-100);
}
.zg-mobile-nav .sub-menu a {
    padding-left: 2.5rem;
    font-size: 0.875rem;
}

.zg-mpanel-cta {
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--zg-gray-200);
}
.zg-mpanel-cta .zg-btn {
    display: block;
    text-align: center;
}

/* Mobile slider submenu */
.zg-mobile-slider {
    flex: 1;
    overflow: hidden;
    position: relative;
}
.zg-mobile-main,
.zg-mobile-sub-panel {
    transition: transform 0.3s ease;
}
.zg-mobile-sub-panel {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    transform: translateX(100%);
}
.zg-mobile-main {
    padding: 0.5rem 0;
}
.zg-mobile-slider a,
.zg-mobile-submenu-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.75rem 1.5rem;
    color: var(--zg-gray-600);
    font-weight: 500;
    font-size: 0.9375rem;
    text-decoration: none;
    border: none;
    background: none;
    cursor: pointer;
    border-bottom: 1px solid var(--zg-gray-100);
    text-align: left;
    font-family: inherit;
    box-sizing: border-box;
}
.zg-mobile-slider a:hover,
.zg-mobile-submenu-trigger:hover {
    color: var(--zg-primary);
    background: var(--zg-gray-100);
}
.zg-mobile-sub-panel-links {
    padding: 0.5rem 0;
}
.zg-mobile-sub-panel-links a {
    padding-left: 2.5rem;
    font-size: 0.875rem;
}
.zg-mobile-lang-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--zg-gray-100);
}
.zg-mobile-lang-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    color: var(--zg-gray-500);
    font-weight: 500;
    flex-shrink: 0;
}
.zg-mobile-lang-options {
    display: flex;
    gap: 4px;
}
.zg-lang-option {
    padding: 4px 10px;
    border: 1px solid var(--zg-gray-200);
    border-radius: 6px;
    background: none;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--zg-gray-600);
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s ease;
}
.zg-lang-option.active {
    background: var(--zg-primary);
    border-color: var(--zg-primary);
    color: #fff;
}
.zg-lang-option:hover:not(.active) {
    background: var(--zg-gray-100);
}

/* Mobile submenu slide states */
.slide-products {
    transform: translateX(-100%);
}
.slide-products ~ .zg-mobile-sub-panel {
    transform: translateX(0);
}

/* Header transparent overlay (when over hero) */
.zg-header.is-overlay,
.zg-header-transparent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background: rgba(30, 58, 42, 0.92);
    border-bottom-color: rgba(255,255,255,0.08);
}
.zg-header.is-overlay .zg-logo-text,
.zg-header-transparent .zg-logo-text {
    color: #ffffff;
    text-shadow: 0 1px 6px rgba(0,0,0,0.25);
}
.zg-header.is-overlay .zg-nav a,
.zg-header-transparent .zg-nav a {
    color: rgba(255,255,255,0.85);
}
.zg-header.is-overlay .zg-nav a:hover,
.zg-header-transparent .zg-nav a:hover {
    color: #ffffff;
}
.zg-header.is-overlay .zg-mtoggle-bar,
.zg-header-transparent .zg-mtoggle-bar {
    background: #ffffff;
}
.zg-header.is-overlay .zg-btn-icon,
.zg-header-transparent .zg-btn-icon {
    color: rgba(255,255,255,0.8);
}
.zg-header.is-overlay .zg-btn-icon:hover,
.zg-header-transparent .zg-btn-icon:hover {
    background: rgba(255,255,255,0.1);
    color: #fff;
}
.zg-header.is-overlay .zg-btn-primary,
.zg-header-transparent .zg-btn-primary {
    background: rgba(255,255,255,0.15);
    border-color: rgba(255,255,255,0.3);
    color: #fff;
}
.zg-header.is-overlay .zg-btn-primary:hover,
.zg-header-transparent .zg-btn-primary:hover {
    background: rgba(255,255,255,0.25);
    border-color: rgba(255,255,255,0.5);
    transform: translateY(-1px);
    box-shadow: none;
}
.zg-header.is-overlay.scrolled,
.zg-header-transparent.scrolled {
    background: #1a3326;
    box-shadow: 0 2px 20px rgba(0,0,0,0.15);
}
.zg-header.is-overlay.scrolled .zg-logo-text,
.zg-header-transparent.scrolled .zg-logo-text {
    color: #ffffff;
    text-shadow: none;
}
.zg-header.is-overlay.scrolled .zg-nav a,
.zg-header-transparent.scrolled .zg-nav a {
    color: rgba(255,255,255,0.8);
}
.zg-header.is-overlay.scrolled .zg-nav a:hover,
.zg-header-transparent.scrolled .zg-nav a:hover {
    color: #c8a45c;
}
.zg-header.is-overlay.scrolled .zg-mtoggle-bar,
.zg-header-transparent.scrolled .zg-mtoggle-bar {
    background: #ffffff;
}

/* ==========================================
   ZeaGrove Full‑Width Video Hero
   ========================================== */

.zeagrove-hero-fullwidth {
    position: relative;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    height: 100vh;
    min-height: 600px;
    overflow: hidden;
    background: var(--zg-gray-800);
}

.zeagrove-hero-bg-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.zeagrove-hero-overlay-dark {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        135deg,
        rgba(0,0,0,0.70) 0%,
        rgba(0,0,0,0.35) 50%,
        rgba(0,0,0,0.15) 100%
    );
    z-index: 1;
}

.zeagrove-hero-content-wrap {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
}

.zeagrove-hero-content-left {
    max-width: 620px;
    margin-left: 8%;
    padding: 2rem 0;

    /* Animation: fade in + slide up after video starts */
    opacity: 0;
    transform: translateY(30px);
    animation: zgHeroFadeIn 0.8s ease 0.5s forwards;
}

@keyframes zgHeroFadeIn {
    to { opacity: 1; transform: translateY(0); }
}

.zeagrove-hero-heading {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: 3.25rem;
    font-weight: 700;
    line-height: 1.2;
    color: #ffffff;
    margin: 0 0 1.25rem;
}

.zeagrove-hero-desc {
    font-size: 1.05rem;
    line-height: 1.7;
    color: rgba(255,255,255,0.75);
    margin-bottom: 2rem;
}
.zeagrove-hero-desc p { margin: 0; }

.zeagrove-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
}

/* ZeaGrove custom buttons */
.zg-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 2.25rem;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    border-radius: var(--zg-radius-md, 8px);
    transition: transform var(--zg-transition-fast, 0.2s ease),
                box-shadow var(--zg-transition-fast, 0.2s ease),
                background var(--zg-transition-fast, 0.2s ease),
                border-color var(--zg-transition-fast, 0.2s ease);
    border: 2px solid transparent;
    cursor: pointer;
    line-height: 1.4;
    text-align: center;
    will-change: transform;
    min-height: 48px;
}
.zg-btn-lg {
    padding: 1rem 2.5rem;
    font-size: 1rem;
    min-height: 54px;
}
.zg-btn-sm {
    padding: 0.5rem 1.25rem;
    font-size: 0.8125rem;
    min-height: 40px;
}
.zg-btn-primary {
    background: var(--zg-primary);
    color: #ffffff;
    border-color: var(--zg-primary);
}
.zg-btn-primary:hover {
    background: var(--zg-primary-dark);
    border-color: var(--zg-primary-dark);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(45, 138, 78, 0.35);
}
.zg-btn-primary:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(45, 138, 78, 0.3);
}
.zg-btn-outline {
    background: transparent;
    color: rgba(255,255,255,0.85);
    border-color: rgba(255,255,255,0.3);
}
.zg-btn-outline:hover {
    background: rgba(255,255,255,0.08);
    color: #ffffff;
    border-color: rgba(255,255,255,0.6);
    transform: translateY(-2px);
}
.zg-btn-white {
    background: #ffffff;
    color: var(--zg-gray-800);
    border-color: #ffffff;
}
.zg-btn-white:hover {
    background: var(--zg-gray-100);
    color: var(--zg-gray-800);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.12);
}
.zg-btn-white:active {
    transform: translateY(0);
}
.zg-btn-outline-white {
    background: transparent;
    color: #ffffff;
    border-color: rgba(255,255,255,0.4);
}
.zg-btn-outline-white:hover {
    background: rgba(255,255,255,0.1);
    color: #ffffff;
    border-color: rgba(255,255,255,0.7);
    transform: translateY(-2px);
}


/* ==========================================
   Homepage Sections — Shared
   ========================================== */

.zg-section {
    padding: 6rem 0;
}

.zg-section-header {
    text-align: center;
    margin-bottom: 4rem;
}

.zg-section-tag {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--zg-primary);
    margin-bottom: 1rem;
    padding: 4px 14px;
    border: 1px solid var(--zg-primary-light);
    border-radius: var(--zg-radius-full);
    background: var(--zg-primary-light);
}

.zg-section-title {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: clamp(1.75rem, 3.5vw, 2.5rem);
    font-weight: 700;
    color: var(--zg-gray-800);
    margin: 0 0 1.25rem;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

.zg-section-desc {
    font-size: 1.05rem;
    color: var(--zg-gray-500);
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.7;
}


/* Ensure content after full-width hero sits within normal flow */
.zeagrove-content-area {
    padding: 4rem 1.5rem;
    max-width: 1200px;
    margin: 0 auto;
}

/* ==========================================
   1. Trust Badges
   ========================================== */

.zg-section--badges {
    background: var(--zg-gray-100);
    padding: 2.5rem 0;
}

.zg-badges-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2rem 3rem;
}

.zg-badge-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.zg-badge-icon {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
}
.zg-badge-icon svg {
    width: 100%;
    height: 100%;
}

.zg-badge-label {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--zg-gray-700);
    white-space: nowrap;
}


/* ==========================================
   2. Product Categories
   ========================================== */

.zg-section--categories {
    background: #ffffff;
}

.zg-category-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.zg-category-card {
    display: block;
    background: #ffffff;
    border: 1px solid var(--zg-gray-200);
    border-radius: var(--zg-radius-lg, 12px);
    overflow: hidden;
    text-decoration: none;
    transition: transform var(--zg-transition-base, 0.3s ease),
                box-shadow var(--zg-transition-base, 0.3s ease);
    will-change: transform;
}
.zg-category-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--zg-shadow-lg, 0 8px 30px rgba(0,0,0,0.10));
    text-decoration: none;
}

.zg-category-placeholder {
    aspect-ratio: 16 / 9;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
}

.zg-category-name {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--zg-gray-800);
    margin: 0;
    padding: 1rem 1.25rem 0.25rem;
}

.zg-category-count {
    display: block;
    font-size: 0.8125rem;
    color: var(--zg-gray-500);
    padding: 0 1.25rem 1.25rem;
}


/* ==========================================
   3. About Us Preview
   ========================================== */

.zg-section--about {
    background: var(--zg-gray-100);
}

.zg-about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
}

.zg-about-img-placeholder {
    position: relative;
    background: linear-gradient(135deg, #1a3a2a 0%, var(--zg-primary) 40%, var(--zg-primary-dark) 100%);
    border-radius: 16px;
    aspect-ratio: 4 / 3;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.zg-about-img-overlay {
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M50 50v-8h-4v8h-8v4h8v8h4v-8h8v-4h-8z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    z-index: 1;
}
.zg-about-img-icon {
    position: relative;
    z-index: 2;
    color: rgba(255,255,255,0.08);
    animation: zgSlowSpin 30s linear infinite;
}
.zg-about-img-icon svg {
    width: 120px;
    height: 120px;
}
@keyframes zgSlowSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
.zg-about-img-badge {
    position: absolute;
    bottom: 2rem;
    left: 2rem;
    z-index: 3;
    background: rgba(255,255,255,0.12);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 12px;
    padding: 1rem 1.5rem;
}
.zg-about-img-badge strong {
    display: block;
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: 1.25rem;
    font-weight: 700;
    color: #ffffff;
    line-height: 1.3;
}
.zg-about-img-badge span {
    font-size: 0.8125rem;
    color: rgba(255,255,255,0.6);
}

.zg-about-text .zg-section-title {
    font-size: 2rem;
}
.zg-about-text p {
    font-size: 1rem;
    line-height: 1.7;
    color: var(--zg-gray-600);
    margin-bottom: 2rem;
}

.zg-stats-row {
    display: flex;
    gap: 2.5rem;
    margin-bottom: 2rem;
}

.zg-stat {
    text-align: center;
}
.zg-stat-number {
    display: block;
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--zg-primary);
}
.zg-stat-label {
    font-size: 0.8125rem;
    color: var(--zg-gray-500);
}


/* ==========================================
   4. Testimonials
   ========================================== */

.zg-testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.zg-testimonial-card {
    background: #ffffff;
    border: 1px solid var(--zg-gray-200);
    border-radius: var(--zg-radius-lg, 12px);
    padding: 1.5rem;
    transition: transform var(--zg-transition-base, 0.3s ease),
                box-shadow var(--zg-transition-base, 0.3s ease);
    will-change: transform;
}
.zg-testimonial-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--zg-shadow-lg, 0 8px 30px rgba(0,0,0,0.10));
}

.zg-testimonial-stars {
    display: flex;
    gap: 2px;
    margin-bottom: 1rem;
    color: var(--zg-accent);
}

.zg-testimonial-text {
    font-size: 0.9375rem;
    line-height: 1.7;
    color: var(--zg-gray-600);
    margin-bottom: 1.25rem;
    font-style: italic;
}

.zg-testimonial-author {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.zg-testimonial-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--zg-gray-200);
    flex-shrink: 0;
    overflow: hidden;
}

.zg-testimonial-name {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--zg-gray-800);
}

.zg-testimonial-role {
    font-size: 0.75rem;
    color: var(--zg-gray-500);
}

/* ==========================================
   5. Featured Products
   ========================================== */

.zg-products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

.zg-product-card {
    background: #ffffff;
    border: 1px solid var(--zg-gray-200);
    border-radius: var(--zg-radius-lg, 12px);
    overflow: hidden;
    text-decoration: none;
    transition: transform var(--zg-transition-base, 0.3s ease),
                box-shadow var(--zg-transition-base, 0.3s ease);
    will-change: transform;
}
.zg-product-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--zg-shadow-lg, 0 8px 30px rgba(0,0,0,0.10));
}

.zg-product-image {
    aspect-ratio: 1;
    overflow: hidden;
    background: var(--zg-gray-100);
}
.zg-product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.zg-product-card:hover .zg-product-image img {
    transform: scale(1.08);
}

.zg-product-info {
    padding: 1rem 1.25rem 1.25rem;
}

.zg-product-name {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--zg-gray-800);
    margin: 0 0 0.25rem;
}

.zg-product-desc {
    font-size: 0.8125rem;
    color: var(--zg-gray-500);
    line-height: 1.5;
    margin: 0 0 0.75rem;
}

.zg-product-meta {
    font-size: 0.75rem;
    color: var(--zg-accent);
    font-weight: 600;
}

/* ============================================
   6. OEM/ODM Service
   ========================================== */

.zg-section--service {
    background: var(--zg-gray-800);
    color: #ffffff;
}
.zg-section--service .zg-section-title {
    color: #ffffff;
}
.zg-section--service .zg-section-desc {
    color: rgba(255,255,255,0.65);
}

.zg-steps-row {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 1rem;
}

.zg-step {
    text-align: center;
    flex: 1;
    max-width: 220px;
}

.zg-step-number {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--zg-accent);
    line-height: 1;
    margin-bottom: 0.75rem;
}

.zg-step-title {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: 1.125rem;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 0.5rem;
}

.zg-step p {
    font-size: 0.875rem;
    color: rgba(255,255,255,0.65);
    margin: 0;
    line-height: 1.5;
}

.zg-step-arrow {
    font-size: 1.5rem;
    color: var(--zg-accent);
    padding-top: 0.75rem;
    flex-shrink: 0;
}


/* ==========================================
   5. Blog / News
   ========================================== */

.zg-section--blog {
    background: #ffffff;
}

.zg-blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.zg-blog-card {
    background: #ffffff;
    border: 1px solid var(--zg-gray-200);
    border-radius: var(--zg-radius-lg, 12px);
    overflow: hidden;
    transition: transform var(--zg-transition-base, 0.3s ease),
                box-shadow var(--zg-transition-base, 0.3s ease);
    will-change: transform;
}
.zg-blog-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--zg-shadow-lg, 0 8px 30px rgba(0,0,0,0.10));
}

.zg-blog-card-img {
    aspect-ratio: 16 / 10;
    overflow: hidden;
}
.zg-blog-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.zg-blog-img-placeholder {
    width: 100%;
    height: 100%;
    background: var(--zg-gray-100);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
}

.zg-blog-card-body {
    padding: 1.25rem;
}

.zg-blog-date {
    display: block;
    font-size: 0.75rem;
    color: var(--zg-gray-500);
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.zg-blog-card-title {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
    line-height: 1.35;
}
.zg-blog-card-title a {
    color: var(--zg-gray-800);
    text-decoration: none;
}
.zg-blog-card-title a:hover {
    color: var(--zg-primary);
}

.zg-blog-card-excerpt {
    font-size: 0.875rem;
    color: var(--zg-gray-500);
    line-height: 1.6;
    margin: 0 0 1rem;
}

/* ==========================================
   6. Newsletter / CTA
   ========================================== */

.zg-section--newsletter {
    background: linear-gradient(135deg, var(--zg-primary) 0%, var(--zg-primary-dark) 100%);
    padding: 6rem 0;
    position: relative;
    isolation: isolate;
}
.zg-section--newsletter::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    z-index: 0;
}
.zg-newsletter-box {
    position: relative;
    z-index: 1;
}

.zg-newsletter-box {
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
}

.zg-newsletter-title {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    font-size: 2.25rem;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 1rem;
}

.zg-newsletter-desc {
    font-size: 1.05rem;
    color: rgba(255,255,255,0.85);
    line-height: 1.7;
    margin-bottom: 2rem;
}

.zg-newsletter-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: center;
}


/* ==========================================
   Content Area
   ========================================== */

#content a:not(.wp-block-button__link):not(.button) {
    color: var(--zg-primary);
    text-decoration: none;
}
#content a:not(.wp-block-button__link):not(.button):hover {
    color: var(--zg-primary-dark);
    text-decoration: underline;
}

/* ==========================================
   Footer
   ========================================== */

.zg-footer {
    background: var(--zg-gray-800);
    color: var(--zg-gray-400);
}

.zg-footer .zg-container {
    padding: 0 1.5rem;
    max-width: 1200px;
    margin: 0 auto;
}

.zg-footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 2.5rem;
    padding: 4rem 0 3rem;
}

/* Footer brand area */
.zg-footer-brand .zg-logo {
    display: flex;
    align-items: center;
    gap: 10px;
}
.zg-footer-brand .zg-logo-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.zg-footer-brand .zg-logo-text small {
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: 0.04em;
}

/* Footer heading alias */
.zg-footer-title {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    color: #ffffff;
    font-size: 1.125rem;
    font-weight: 700;
    margin: 0 0 1.25rem;
}

.zg-footer-heading {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
    color: #ffffff;
    font-size: 1.125rem;
    font-weight: 700;
    margin: 0 0 1.25rem;
}

.zg-footer-about {
    font-size: 0.875rem;
    line-height: 1.7;
    margin: 0 0 1.25rem;
}

.zg-footer-social {
    display: flex;
    gap: 0.75rem;
}
.zg-footer-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: rgba(255,255,255,0.06);
    color: var(--zg-gray-400);
    border-radius: 50%;
    text-decoration: none;
    transition: background var(--zg-transition-fast, 0.2s ease),
                color var(--zg-transition-fast, 0.2s ease),
                transform var(--zg-transition-fast, 0.2s ease);
}
.zg-footer-social a:hover {
    background: var(--zg-primary);
    color: #ffffff;
    transform: translateY(-2px);
}
.zg-footer-social svg {
    width: 16px;
    height: 16px;
}

.zg-social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: rgba(255,255,255,0.08);
    color: var(--zg-gray-400);
    border-radius: 50%;
    text-decoration: none;
    transition: all 0.3s ease;
}
.zg-social-icon:hover {
    background: var(--zg-primary);
    color: #ffffff;
}

.zg-footer-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}
.zg-footer-menu li {
    margin-bottom: 0.5rem;
}
.zg-footer-menu a {
    color: var(--zg-gray-400);
    text-decoration: none;
    font-size: 0.875rem;
    transition: color 0.2s ease;
}
.zg-footer-menu a:hover {
    color: var(--zg-primary-light);
}

.zg-footer-contact {
    list-style: none;
    margin: 0;
    padding: 0;
}
.zg-footer-contact li {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    font-size: 0.875rem;
    line-height: 1.5;
}
.zg-footer-contact svg {
    flex-shrink: 0;
    margin-top: 3px;
    opacity: 0.6;
}
.zg-footer-contact a {
    color: var(--zg-gray-400);
    text-decoration: none;
}
.zg-footer-contact a:hover {
    color: var(--zg-primary-light);
}

.zg-footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.08);
    padding: 1.25rem 0;
}
.zg-footer-bottom-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.8125rem;
}
.zg-footer-bottom-inner a {
    color: var(--zg-gray-400);
    text-decoration: none;
    transition: color 0.2s ease;
}
.zg-footer-bottom-inner a:hover {
    color: var(--zg-primary-light);
}
.zg-footer-bottom-links {
    display: flex;
    align-items: center;
    gap: 1rem;
}
.zg-footer-bottom-links a + a::before {
    content: '';
    display: inline-block;
    width: 1px;
    height: 12px;
    background: rgba(255,255,255,0.15);
    margin-right: 1rem;
    vertical-align: middle;
}


/* ==========================================
   Search Overlay
   ========================================== */
.zg-search-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.85);
    backdrop-filter: blur(8px);
    z-index: 300;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}
.zg-search-overlay.open {
    opacity: 1;
    visibility: visible;
}
.zg-search-overlay-inner {
    width: 100%;
    max-width: 600px;
    padding: 2rem;
    position: relative;
}
.zg-search-close {
    position: absolute;
    top: -60px;
    right: 0;
    background: none;
    border: none;
    color: #fff;
    cursor: pointer;
    padding: 8px;
    opacity: 0.7;
    transition: opacity 0.2s ease;
}
.zg-search-close:hover {
    opacity: 1;
}
.zg-search-form {
    display: flex;
    gap: 0.75rem;
}
.zg-search-input {
    flex: 1;
    padding: 1rem 1.25rem;
    font-size: 1.125rem;
    border: none;
    border-radius: 8px;
    background: rgba(255,255,255,0.12);
    color: #fff;
    outline: none;
    transition: background 0.2s ease;
}
.zg-search-input::placeholder {
    color: rgba(255,255,255,0.4);
}
.zg-search-input:focus {
    background: rgba(255,255,255,0.18);
}
.zg-search-form .zg-btn {
    flex-shrink: 0;
}
.zg-search-hints {
    margin-top: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: rgba(255,255,255,0.4);
}
.zg-search-hints a {
    color: rgba(255,255,255,0.6);
    text-decoration: none;
    padding: 4px 12px;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 20px;
    transition: all 0.2s ease;
}
.zg-search-hints a:hover {
    color: #fff;
    border-color: rgba(255,255,255,0.35);
    background: rgba(255,255,255,0.08);
}

/* Mobile Panel */
.zg-mobile-panel-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    z-index: 200;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}
.zg-mobile-panel-overlay.open {
    opacity: 1;
    visibility: visible;
}

/* ==========================================
   WordPress Blocks
   ========================================== */

.wp-block-separator {
    color: var(--zg-gray-200);
}
.wp-block-pullquote {
    border-top: 3px solid var(--zg-primary);
    border-bottom: 3px solid var(--zg-primary);
}
.wp-block-pullquote blockquote p {
    font-family: 'Noto Serif SC', Georgia, 'Times New Roman', serif;
}
.wp-block-quote {
    border-left: 3px solid var(--zg-primary);
}
.wp-block-latest-posts__post-title,
.wp-block-post-title a {
    color: var(--zg-gray-800);
}
.wp-block-latest-posts__post-title:hover,
.wp-block-post-title a:hover {
    color: var(--zg-primary);
}

/* Button block overrides */
.wp-block-button__link {
    border-radius: 8px;
    font-weight: 600;
}
.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link {
    border: 2px solid var(--zg-primary);
}


/* ==========================================
   WooCommerce
   ========================================== */

.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    background: var(--zg-primary);
    color: #ffffff;
    border-radius: 8px;
}
.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    background: var(--zg-primary-dark);
}
.woocommerce .star-rating span {
    color: var(--zg-accent);
}
.woocommerce .price {
    color: var(--zg-primary);
}
.woocommerce .widget_price_filter .ui-slider .ui-slider-range,
.woocommerce .widget_price_filter .ui-slider .ui-slider-handle {
    background: var(--zg-primary);
}


/* ==========================================
   Background Utilities
   ========================================== */

.has-primary-background-color { background: var(--zg-primary); }
.has-primary-color { color: var(--zg-primary); }
.has-accent-background-color { background: var(--zg-accent); }
.has-accent-color { color: var(--zg-accent); }


/* ==========================================
   Responsive
   ========================================== */

@media (max-width: 1024px) {
    .zeagrove-hero-heading { font-size: 2.5rem; }

    .zg-about-grid { gap: 2.5rem; }
    .zg-about-text .zg-section-title { font-size: 1.625rem; }

    .zg-steps-row { flex-wrap: wrap; justify-content: center; gap: 1.5rem; }
    .zg-step { flex: 0 0 calc(50% - 1rem); max-width: none; }
    .zg-step-arrow { display: none; }

    .zg-footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 2rem;
    }
}

@media (max-width: 768px) {
    /* Hero mobile */
    .zeagrove-hero-fullwidth { min-height: 100dvh; }
    .zeagrove-hero-content-left {
        margin-left: 5%;
        max-width: 90%;
    }
    .zeagrove-hero-heading { font-size: 2rem; }
    .zeagrove-hero-desc { font-size: 0.9375rem; }
    .zeagrove-hero-actions { flex-direction: column; align-items: stretch; }
    .zeagrove-hero-actions .zg-btn { text-align: center; min-height: 48px; justify-content: center; }

    /* Sections mobile — more breathing room */
    .zg-section { padding: 3.5rem 0; }
    .zg-section-header { margin-bottom: 2.5rem; }
    .zg-section-title { font-size: 1.625rem; }
    .zg-section-tag { font-size: 0.6875rem; padding: 3px 12px; }

    .zg-category-grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }

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

    .zg-testimonials-grid { grid-template-columns: 1fr; gap: 1.25rem; }

    .zg-about-grid { grid-template-columns: 1fr; gap: 2rem; }
    .zg-stats-row { gap: 1.5rem; justify-content: center; }

    .zg-blog-grid { grid-template-columns: 1fr; gap: 1.25rem; }

    .zg-badges-grid { gap: 1.25rem 1.5rem; }
    .zg-badge-label { font-size: 0.8125rem; }

    /* Footer mobile */
    .zg-footer-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    .zg-footer-bottom-inner {
        flex-direction: column;
        text-align: center;
    }
    .zg-footer-bottom-links {
        justify-content: center;
    }

    /* Mobile -- make header stickied */
    .zg-header:not(.is-overlay) {
        position: sticky;
    }
}

@media (max-width: 480px) {
    .zeagrove-hero-heading { font-size: 1.625rem; }
    .zg-section { padding: 2.5rem 0; }
    .zg-category-grid { grid-template-columns: 1fr; }
    .zg-stats-row { flex-direction: column; align-items: center; gap: 1rem; }
}

/* ================================================
   UI Design System — Enhanced
   Premium refinements for Elementor-built content
   ================================================ */

/* ── Section entrance animation for Elementor blocks ── */
.elementor-section {
    opacity: 0;
    transform: translateY(20px);
    animation: zgSectionIn 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.elementor-section:nth-child(1) { animation-delay: 0.1s; }
.elementor-section:nth-child(2) { animation-delay: 0.15s; }
.elementor-section:nth-child(3) { animation-delay: 0.2s; }
.elementor-section:nth-child(4) { animation-delay: 0.25s; }
.elementor-section:nth-child(5) { animation-delay: 0.3s; }
.elementor-section:nth-child(6) { animation-delay: 0.35s; }
.elementor-section:nth-child(7) { animation-delay: 0.4s; }
.elementor-section:nth-child(8) { animation-delay: 0.45s; }

@keyframes zgSectionIn {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Elementor widget refinements ── */
.elementor-widget-container {
    line-height: 1.7;
}

/* Heading widget polish */
.elementor-widget-heading .elementor-heading-title {
    letter-spacing: -0.02em;
}

/* Button widget polish */
.elementor-widget-button .elementor-button {
    font-weight: 600 !important;
    letter-spacing: 0.01em;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    position: relative;
    overflow: hidden;
}
.elementor-widget-button .elementor-button:hover {
    transform: translateY(-2px);
}
.elementor-widget-button .elementor-button:active {
    transform: translateY(0);
}

/* Text editor polish */
.elementor-widget-text-editor p:last-child {
    margin-bottom: 0;
}

/* ── Icon Box widget refinements ── */
.elementor-widget-icon-box .elementor-icon-box-icon {
    margin-bottom: 0.5rem !important;
}
.elementor-widget-icon-box .elementor-icon-box-title {
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    font-size: 0.9375rem !important;
    margin-bottom: 0.5rem !important;
}
.elementor-widget-icon-box .elementor-icon-box-description {
    font-size: 0.875rem !important;
    color: #6C757D !important;
    line-height: 1.6 !important;
}

/* ── Testimonial widget refinements ── */
.elementor-widget-testimonial .elementor-testimonial-wrapper {
    position: relative;
}
.elementor-widget-testimonial .elementor-testimonial-content {
    font-style: italic;
    line-height: 1.7 !important;
    color: #495057 !important;
    position: relative;
}
.elementor-widget-testimonial .elementor-testimonial-content::before {
    content: '\201C';
    font-family: 'Noto Serif SC', Georgia, serif;
    font-size: 3rem;
    color: #F5EDD6;
    position: absolute;
    top: -0.75rem;
    right: 0.5rem;
    line-height: 1;
    opacity: 0.6;
    pointer-events: none;
}
.elementor-widget-testimonial .elementor-testimonial-name {
    font-weight: 700 !important;
    color: #212529 !important;
}
.elementor-widget-testimonial .elementor-testimonial-job {
    font-size: 0.8125rem !important;
    color: #6C757D !important;
}

/* ── Divider widget refinements ── */
.elementor-widget-divider .elementor-divider-separator {
    border-color: #E9ECEF !important;
}

/* ── Spacer refinements ── */
.elementor-widget-spacer {
    pointer-events: none;
}

/* ── Image refinements ── */
.elementor-widget-image img {
    border-radius: 12px;
    transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.elementor-widget-image img:hover {
    transform: scale(1.02);
}

/* ── Section background alternatives ── */
.zg-section-bg-alt {
    background: linear-gradient(180deg, #F8F9FA 0%, #FFFFFF 100%);
}

/* ── Form input refinements ── */
.elementor-field-textual,
input[type="text"],
input[type="email"],
input[type="search"],
input[type="url"],
textarea {
    border-radius: 8px !important;
    border: 1.5px solid #DEE2E6 !important;
    padding: 0.75rem 1rem !important;
    font-size: 0.9375rem !important;
    transition: all 0.25s ease !important;
    background: #fff !important;
}
.elementor-field-textual:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
textarea:focus {
    border-color: #2D8A4E !important;
    box-shadow: 0 0 0 3px rgba(45,138,78,0.12) !important;
    outline: none !important;
}

/* ── Blockquote styling ── */
blockquote {
    border-left: 3px solid #C8A45C;
    padding: 1rem 1.5rem;
    margin: 1.5rem 0;
    background: #F8F9FA;
    border-radius: 0 8px 8px 0;
    font-style: italic;
    color: #495057;
}

/* ── Small decorative touches ── */
.zg-accent-border {
    height: 3px;
    width: 48px;
    background: linear-gradient(to right, #C8A45C, #F5EDD6);
    border-radius: 2px;
    margin: 1rem auto;
}
.zg-accent-border-left {
    height: 3px;
    width: 48px;
    background: linear-gradient(to right, #C8A45C, #F5EDD6);
    border-radius: 2px;
    margin: 1rem 0;
}

/* ── Smooth scrollbar (Webkit) ── */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #F8F9FA;
}
::-webkit-scrollbar-thumb {
    background: #DEE2E6;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #ADB5BD;
}

/* ── Card hover refinement for Elementor columns ── */
.elementor-column:hover .elementor-widget-image img {
    transform: scale(1.02);
}

/* ── Mobile touch refinements ── */
@media (hover: none) and (pointer: coarse) {
    .elementor-widget-button .elementor-button:hover {
        transform: none;
    }
    .zg-hero-actions .elementor-button-accent:hover,
    .zg-hero-actions .elementor-button-outline-white:hover {
        transform: none;
    }
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
    .elementor-section {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}

/* ================================================
   Elementor UI Component Classes
   Extended support for Elementor-optimized links
   ================================================ */

/* ── Elementor Button: Accent (gold) variant ── */
.elementor-button.elementor-button-accent {
    background: var(--zg-accent, #C8A45C);
    color: #ffffff;
    fill: #ffffff;
    box-shadow: 0 2px 10px rgba(200,164,92,0.2);
}
.elementor-button.elementor-button-accent:hover {
    background: var(--zg-accent-dark, #A8883E);
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(200,164,92,0.3);
}

/* ── Nav Item links (elementor-item) ── */
.zg-nav a.elementor-item {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.5rem 0.9rem;
    color: var(--zg-gray-600);
    font-weight: 500;
    font-size: 0.9375rem;
    text-decoration: none;
    transition: color 0.2s ease;
    white-space: nowrap;
    border: none;
    background: none;
    position: relative;
}
.zg-nav a.elementor-item:hover,
.zg-nav .current-menu-item > a.elementor-item {
    color: var(--zg-primary);
}
.zg-nav a.elementor-item::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 0.9rem;
    right: 0.9rem;
    height: 2px;
    background: #c8a45c;
    transform: scaleX(0);
    transition: transform 0.3s ease;
}
.zg-nav a.elementor-item:hover::after,
.zg-nav a.elementor-item.active::after {
    transform: scaleX(1);
}

/* ── Sub Item links (elementor-sub-item) ── */
.zg-megamenu-col a.elementor-sub-item,
.zg-mobile-sub-panel-links a.elementor-sub-item {
    display: block;
    padding: 0.4rem 0;
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--zg-gray-600);
    white-space: nowrap;
    text-decoration: none;
    transition: color 0.2s ease, padding-left 0.2s ease;
    border-bottom: none;
    background: none;
}
.zg-megamenu-col a.elementor-sub-item:hover,
.zg-mobile-sub-panel-links a.elementor-sub-item:hover {
    color: var(--zg-primary);
    padding-left: 4px;
    background: none;
}

/* Footer sub items */
.zg-footer-menu a.elementor-sub-item {
    display: inline-block;
    padding: 0;
    color: var(--zg-gray-400);
    font-size: 0.875rem;
    font-weight: 400;
    text-decoration: none;
    transition: color 0.2s ease;
    border: none;
    background: none;
}
.zg-footer-menu a.elementor-sub-item:hover {
    color: var(--zg-primary-light);
    padding-left: 0;
}

/* ── Social Icon sizing (topbar & footer) ── */
.zg-topbar-social a.elementor-social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    color: rgba(255,255,255,0.5);
    background: none !important;
    fill: rgba(255,255,255,0.5);
    padding: 0;
    transition: color 0.2s ease;
    border-radius: 0;
}
.zg-topbar-social a.elementor-social-icon:hover {
    color: #ffffff;
    fill: #ffffff;
    background: none !important;
}
.zg-topbar-social a.elementor-social-icon svg {
    width: 14px;
    height: 14px;
}

.zg-footer-social a.elementor-social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: rgba(255,255,255,0.06);
    color: var(--zg-gray-400);
    fill: var(--zg-gray-400);
    border-radius: 50%;
    text-decoration: none;
    transition: background var(--zg-transition-fast, 0.2s ease),
                color var(--zg-transition-fast, 0.2s ease),
                transform var(--zg-transition-fast, 0.2s ease);
    padding: 0;
    border: none;
}
.zg-footer-social a.elementor-social-icon:hover {
    background: var(--zg-primary);
    color: #ffffff;
    fill: #ffffff;
    transform: translateY(-2px);
}
.zg-footer-social a.elementor-social-icon svg {
    width: 16px;
    height: 16px;
}

/* ── Header transparent overlay nav items ── */
.zg-header-transparent .zg-nav a.elementor-item {
    color: rgba(255,255,255,0.85);
}
.zg-header-transparent .zg-nav a.elementor-item:hover {
    color: #ffffff;
}
.zg-header-transparent .zg-nav a.elementor-item::after {
    background: #c8a45c;
}

/* ── Mobile panel Elementor items ── */
.zg-mobile-main a.elementor-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.75rem 1.5rem;
    color: var(--zg-gray-600);
    font-weight: 500;
    font-size: 0.9375rem;
    text-decoration: none;
    border: none;
    background: none;
    cursor: pointer;
    border-bottom: 1px solid var(--zg-gray-100);
}
.zg-mobile-main a.elementor-item:hover {
    color: var(--zg-primary);
    background: var(--zg-gray-100);
}
.zg-mobile-sub-panel-links a.elementor-item {
    display: block;
    padding: 0.75rem 1.5rem 0.75rem 2.5rem;
    color: var(--zg-gray-600);
    font-size: 0.875rem;
    text-decoration: none;
    border-bottom: 1px solid var(--zg-gray-100);
}
.zg-mobile-sub-panel-links a.elementor-item:hover {
    color: var(--zg-primary);
}
.zg-mobile-sub-panel-links a.elementor-item:first-child {
    font-weight: 600;
    color: var(--zg-primary);
}

/* ── Language dropdown items ── */
.zg-lang-dropdown a.elementor-item {
    display: block;
    padding: 0.5rem 0.75rem;
    color: var(--zg-gray-600);
    text-decoration: none;
    font-size: 0.875rem;
    border-radius: 6px;
    transition: background 0.2s ease;
    border: none;
    background: none;
}
.zg-lang-dropdown a.elementor-item:hover {
    background: var(--zg-gray-100);
    color: var(--zg-primary);
}

/* ── Search hints items ── */
.zg-search-hints a.elementor-item {
    color: rgba(255,255,255,0.6);
    text-decoration: none;
    padding: 4px 12px;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 20px;
    transition: all 0.2s ease;
    background: none;
    font-size: 0.875rem;
    display: inline-block;
}
.zg-search-hints a.elementor-item:hover {
    color: #fff;
    border-color: rgba(255,255,255,0.35);
    background: rgba(255,255,255,0.08);
}

/* ── Footer bottom items ── */
.zg-footer-bottom-inner a.elementor-item {
    color: var(--zg-gray-400);
    text-decoration: none;
    transition: color 0.2s ease;
    background: none;
    border: none;
    padding: 0;
    font-size: 0.8125rem;
    display: inline;
}
.zg-footer-bottom-inner a.elementor-item:hover {
    color: var(--zg-primary-light);
}

/* ── Logo image link ── */
a.elementor-image-logo-link {
    display: inline-flex;
    text-decoration: none;
    line-height: 0;
}

/* ── Button size variant alignment ── */
.elementor-button.elementor-size-sm .elementor-button-content-wrapper {
    gap: 6px;
}
.elementor-button.elementor-size-md .elementor-button-content-wrapper {
    gap: 8px;
}
.elementor-button.elementor-size-lg .elementor-button-content-wrapper {
    gap: 10px;
}