/**
 * Bergmann Shop Theme - Divi Custom CSS
 * ======================================
 * Based on BER_Shop_06 Adobe XD Design
 * 
 * Usage in Divi:
 * 1. Go to Divi > Theme Options > Custom CSS
 * 2. Or add to child theme's style.css
 * 3. Or use Divi > Theme Builder for specific templates
 * 
 * @version 1.0.0
 * @author Bergmann
 */

/* ===========================================
   CSS CUSTOM PROPERTIES (Variables)
   =========================================== */

:root {
    /* ─────────────────────────────────────────
       COLOR PALETTE
       ───────────────────────────────────────── */
    
    /* Primary Brand Colors */
    --berg-primary: #616D63;              /* Sage green - primary buttons, CTAs */
    --berg-primary-hover: #4d5750;        /* Darker sage for hover states */
    --berg-primary-light: #C0C9B8;        /* Light sage - secondary elements */
    
    /* Background Colors */
    --berg-bg-light: #F9F9F8;             /* Off-white - main background */
    --berg-bg-sage: #C0C9B880;              /* Light sage - section backgrounds */
    --berg-bg-warm: #F9F5F2;              /* Warm cream - testimonials, highlights */
    --berg-bg-white: #FFFFFF;             /* Pure white - cards, modals */
    
    /* Border & Divider Colors */
    --berg-border: #DFE4DB;               /* Muted sage - borders, dividers */
    --berg-border-light: #EFF1ED;         /* Light border */
    
    /* Text Colors */
    --berg-text-primary: #000000;         /* Black - headings, body text */
    --berg-text-secondary: #7C7C7C;       /* Gray - prices, meta text */
    --berg-text-muted: #616D63;           /* Sage - subtle text */
    --berg-text-white: #FFFFFF;           /* White - on dark backgrounds */
    
    /* Accent Colors */
    --berg-accent-new: #616D63;           /* "NEW" badge color */
    --berg-accent-sale: #C0C9B8;          /* Sale/discount badge */
    
    /* ─────────────────────────────────────────
       TYPOGRAPHY
       ───────────────────────────────────────── */
    
    /* Font Family */
    --berg-font-primary: 'Montserrat', sans-serif;
    
    /* Font Weights */
    --berg-weight-light: 300;
    --berg-weight-normal: 400;
    --berg-weight-medium: 500;
    --berg-weight-semibold: 600;
    --berg-weight-bold: 700;
    
    /* Font Sizes */
    --berg-text-xs: 12px;
    --berg-text-sm: 14px;
    --berg-text-base: 16px;
    --berg-text-md: 18px;
    --berg-text-lg: 20px;
    --berg-text-xl: 24px;
    --berg-text-2xl: 35px;
    --berg-text-3xl: 50px;
    
    /* Line Heights */
    --berg-leading-tight: 1.2;
    --berg-leading-snug: 1.35;
    --berg-leading-normal: 1.5;
    --berg-leading-relaxed: 1.625;
    
    /* Letter Spacing */
    --berg-tracking-normal: 0;
    --berg-tracking-wide: 0.05em;
    --berg-tracking-wider: 0.1em;
    --berg-tracking-widest: 0.2em;         /* For uppercase subheads */
    
    /* ─────────────────────────────────────────
       SPACING
       ───────────────────────────────────────── */
    
    --berg-space-xs: 8px;
    --berg-space-sm: 16px;
    --berg-space-md: 24px;
    --berg-space-lg: 32px;
    --berg-space-xl: 48px;
    --berg-space-2xl: 64px;
    --berg-space-3xl: 96px;
    --berg-space-4xl: 128px;
    
    /* ─────────────────────────────────────────
       LAYOUT
       ───────────────────────────────────────── */
    
    --berg-container-max: 1440px;
    --berg-content-max: 1200px;
    --berg-sidebar-width: 300px;
    
    /* ─────────────────────────────────────────
       BORDERS & RADIUS
       ───────────────────────────────────────── */
    
    --berg-radius-sm: 4px;
    --berg-radius-md: 8px;
    --berg-radius-lg: 12px;
    --berg-radius-xl: 20px;
    --berg-radius-full: 9999px;
    
    --berg-border-width: 1px;
    --berg-border-width-thick: 2px;
    
    /* ─────────────────────────────────────────
       SHADOWS
       ───────────────────────────────────────── */
    
    --berg-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --berg-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
    --berg-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
    --berg-shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.1);
    
    /* ─────────────────────────────────────────
       TRANSITIONS
       ───────────────────────────────────────── */
    
    --berg-transition-fast: 150ms ease;
    --berg-transition-normal: 300ms ease;
    --berg-transition-slow: 500ms ease;
}


/* ===========================================
   BASE TYPOGRAPHY STYLES
   =========================================== */

body,
.et_pb_module {
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-normal);
    font-size: var(--berg-text-base);
    line-height: var(--berg-leading-normal);
    color: var(--berg-text-primary);
}

/* Headings */
h1, .et_pb_module h1,
.berg-h1 {
    font-family: var(--berg-font-primary) ;
    font-weight: var(--berg-weight-semibold) ;
    font-size: var(--berg-text-3xl) ;
    line-height: var(--berg-leading-tight) ;
    letter-spacing: var(--berg-tracking-normal) ;
    color: var(--berg-text-muted);
    margin-bottom: var(--berg-space-md);
}

h2, .et_pb_module h2,
.berg-h2 {
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-normal);
    font-size: var(--berg-text-2xl);
    line-height: var(--berg-leading-snug);
    letter-spacing: var(--berg-tracking-normal);
    color: var(--berg-text-primary);
    margin-bottom: var(--berg-space-md);
}

h3, .et_pb_module h3,
.berg-h3 {
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-lg);
    line-height: var(--berg-leading-snug);
    letter-spacing: var(--berg-tracking-normal);
    color: var(--berg-text-primary);
    margin-bottom: var(--berg-space-sm);
}

h4, .et_pb_module h4,
.berg-h4 {
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-md);
    line-height: var(--berg-leading-snug);
    color: var(--berg-text-primary);
}

/* Body Text */
p, .et_pb_module p,
.berg-copy {
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-normal);
    font-size: var(--berg-text-md);
    line-height: var(--berg-leading-relaxed);
    color: var(--berg-text-primary);
    margin-bottom: var(--berg-space-sm);
}

/* Small Text */
.berg-text-small,
.et_pb_module .berg-text-small {
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-medium);
    font-size: var(--berg-text-sm);
    line-height: var(--berg-leading-normal);
    color: var(--berg-text-primary);
}

/* Subheadline / Category Labels */
.berg-subhead,
.et_pb_module .berg-subhead {
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-sm);
    line-height: var(--berg-leading-tight);
    letter-spacing: var(--berg-tracking-widest);
    text-transform: uppercase;
    color: var(--berg-text-white);
}

/* Small Links / Navigation */
.berg-link-small,
.et_pb_module .berg-link-small {
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-sm);
    line-height: var(--berg-leading-tight);
    letter-spacing: var(--berg-tracking-normal);
    text-transform: uppercase;
    color: var(--berg-text-primary);
    text-decoration: none;
    transition: color var(--berg-transition-fast);
}

.berg-link-small:hover {
    color: var(--berg-primary);
}

/* Price Text */
.berg-price,
.et_pb_module .berg-price,
.woocommerce .price {
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-medium);
    font-size: var(--berg-text-md);
    line-height: var(--berg-leading-snug);
    color: var(--berg-text-secondary);
    text-transform: uppercase;
}


/* ===========================================
   BUTTONS
   =========================================== */

/* Primary Button (Sage Green) */
.berg-btn-primary,
.et_pb_button.berg-btn-primary,
.et_pb_module .et_pb_button.berg-btn-primary {
    background-color: var(--berg-primary) !important;
    color: var(--berg-text-white) !important;
    border: 2px solid var(--berg-primary) !important;
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-sm);
    letter-spacing: var(--berg-tracking-wide);
    text-transform: uppercase;
    padding: 14px 28px !important;
    border-radius: var(--berg-radius-full);
    /* transition: all var(--berg-transition-normal); */
    cursor: pointer;
}

.berg-btn-primary:hover,
.et_pb_button.berg-btn-primary:hover {
    background-color: var(--berg-primary-hover) !important;
    border-color: var(--berg-primary-hover) !important;
    border-radius: var(--berg-radius-full) !important;
}


/* Tetiary Button (Warm Beige) */
.berg-btn-tertiary,
.et_pb_button.berg-btn-tertiary,
.et_pb_module .et_pb_button.berg-btn-tertiary{
    background-color: var(--berg-bg-warm) !important;
    color: var(--berg-text-muted) !important;
    border: 2px solid var(--berg-bg-warm) !important;
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-sm);
    text-transform: uppercase;
    padding: 24px 60px !important;
    border-radius: var(--berg-radius-full);
    /* transition: all var(--berg-transition-normal); */
    cursor: pointer;
}

.berg-btn-tertiary:hover,
.et_pb_button.berg-btn-tertiary:hover {
    background-color: var(--berg-primary-light) !important;
    border-color: var(--berg-primary-light) !important;
    border-radius: var(--berg-radius-full);
}


/* Secondary Button (Outline) */
.berg-btn-secondary,
.et_pb_button.berg-btn-secondary {
    background-color: transparent !important;
    color: var(--berg-primary) !important;
    border: 2px solid var(--berg-primary) !important;
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-sm);
    letter-spacing: var(--berg-tracking-wide);
    text-transform: uppercase;
    padding: 14px 28px !important;
    border-radius: var(--berg-radius-full);
    transition: all var(--berg-transition-normal);
}

.berg-btn-secondary:hover,
.et_pb_button.berg-btn-secondary:hover {
    background-color: var(--berg-primary) !important;
    color: var(--berg-text-white) !important;
}

/* Ghost Button (White outline - for dark backgrounds) */
.berg-btn-ghost,
.et_pb_button.berg-btn-ghost {
    background-color: transparent !important;
    color: var(--berg-text-white) !important;
    border: 2px solid var(--berg-text-white) !important;
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-sm);
    letter-spacing: var(--berg-tracking-wide);
    text-transform: uppercase;
    padding: 14px 28px !important;
    border-radius: var(--berg-radius-full);
    transition: all var(--berg-transition-normal);
}

.berg-btn-ghost:hover,
.et_pb_button.berg-btn-ghost:hover {
    background-color: var(--berg-text-white) !important;
    color: var(--berg-primary) !important;
}

/* Small Button */
.berg-btn-small,
.et_pb_button.berg-btn-small {
    padding: 10px 20px !important;
    font-size: var(--berg-text-xs);
}


/* ===========================================
   SECTION BACKGROUNDS
   =========================================== */

/* Light Background (Default) */
.berg-section-light,
.et_pb_section.berg-section-light {
    background-color: var(--berg-bg-light);
}

/* White Background */
.berg-section-white,
.et_pb_section.berg-section-white {
    background-color: var(--berg-bg-white);
}

/* Sage Background */
.berg-section-sage,
.et_pb_section.berg-section-sage {
    background-color: var(--berg-bg-sage);
}

/* Warm Background (Testimonials) */
.berg-section-warm,
.et_pb_section.berg-section-warm {
    background-color: var(--berg-bg-warm);
}

/* Dark/Primary Background */
.berg-section-dark,
.et_pb_section.berg-section-dark {
    background-color: var(--berg-primary);
    color: var(--berg-text-white);
}


/* ===========================================
   HEADER / NAVIGATION
   =========================================== */

/* Top Bar (Announcement) */
.berg-top-bar {
    background-color: var(--berg-primary);
    color: var(--berg-text-white);
    padding: var(--berg-space-xs) 0;
    text-align: center;
    font-size: var(--berg-text-sm);
}

/* Main Header */
.berg-header,
#main-header {
    background-color: var(--berg-bg-white);
    border-bottom: var(--berg-border-width) solid var(--berg-border);
}

/* Navigation Links */
.berg-nav-link,
#et-top-navigation .et-menu > li > a {
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-medium);
    font-size: var(--berg-text-sm);
    color: var(--berg-text-primary);
    text-transform: uppercase;
    letter-spacing: var(--berg-tracking-wide);
    transition: color var(--berg-transition-fast);
}

.berg-nav-link:hover,
#et-top-navigation .et-menu > li > a:hover {
    color: var(--berg-primary);
}


/* ===========================================
   HERO SECTION
   =========================================== */

.berg-hero {
    position: relative;
    min-height: 600px;
    display: flex;
    align-items: center;
}

.berg-hero-content {
    max-width: 600px;
}

.berg-hero h1 {
    font-size: var(--berg-text-3xl);
    font-weight: var(--berg-weight-normal);
    line-height: var(--berg-leading-tight);
    margin-bottom: var(--berg-space-lg);
}


/* ===========================================
   CATEGORY GRID (Hair Types)
   =========================================== */

.berg-category-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--berg-space-sm);
}

.berg-category-card {
    position: relative;
    overflow: hidden;
    aspect-ratio: 3/4;
}

.berg-category-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--berg-transition-slow);
}

.berg-category-card:hover img {
    transform: scale(1.05);
}

.berg-category-label {
    position: absolute;
    bottom: var(--berg-space-md);
    left: 50%;
    transform: translateX(-50%);
    background-color: var(--berg-bg-white);
    padding: var(--berg-space-xs) var(--berg-space-md);
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-sm);
    text-transform: uppercase;
    white-space: nowrap;
}


/* ===========================================
   PRODUCT CARDS
   =========================================== */

.berg-product-card,
.woocommerce ul.products li.product {
    background-color: var(--berg-bg-white);
    border: var(--berg-border-width) solid var(--berg-border);
    padding: var(--berg-space-md);
    text-align: center;
    transition: box-shadow var(--berg-transition-normal);
}

.berg-product-card:hover,
.woocommerce ul.products li.product:hover {
    box-shadow: var(--berg-shadow-lg);
}

.berg-product-image {
    position: relative;
    margin-bottom: var(--berg-space-md);
    overflow: hidden;
}

.berg-product-image img {
    width: 100%;
    height: auto;
    transition: transform var(--berg-transition-slow);
}

.berg-product-card:hover .berg-product-image img {
    transform: scale(1.05);
}

/* Product Badge (NEW, SALE) */
.berg-product-badge,
.woocommerce span.onsale {
    position: absolute;
    top: var(--berg-space-sm);
    left: var(--berg-space-sm);
    background-color: var(--berg-primary);
    color: var(--berg-text-white);
    font-size: var(--berg-text-xs);
    font-weight: var(--berg-weight-semibold);
    padding: 4px 12px;
    text-transform: uppercase;
    letter-spacing: var(--berg-tracking-wide);
}

/* Product Title */
.berg-product-title,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-base);
    color: var(--berg-text-primary);
    margin-bottom: var(--berg-space-xs);
}

/* Product Subtitle / Description */
.berg-product-subtitle {
    font-size: var(--berg-text-sm);
    color: var(--berg-text-secondary);
    margin-bottom: var(--berg-space-sm);
}

/* Product Price */
.berg-product-price,
.woocommerce ul.products li.product .price {
    font-weight: var(--berg-weight-medium);
    font-size: var(--berg-text-md);
    color: var(--berg-text-secondary);
}

/* Product Actions (Wishlist, Quick View) */
.berg-product-actions {
    display: flex;
    justify-content: center;
    gap: var(--berg-space-sm);
    margin-top: var(--berg-space-sm);
}

.berg-product-action-btn {
    width: 40px;
    height: 40px;
    border: var(--berg-border-width) solid var(--berg-border);
    background-color: var(--berg-bg-white);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all var(--berg-transition-fast);
}

.berg-product-action-btn:hover {
    background-color: var(--berg-primary);
    border-color: var(--berg-primary);
    color: var(--berg-text-white);
}


/* ===========================================
   PRODUCT CAROUSEL / SLIDER
   =========================================== */

.berg-carousel {
    position: relative;
}

.berg-carousel-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    background-color: var(--berg-bg-white);
    border: var(--berg-border-width) solid var(--berg-border);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition: all var(--berg-transition-fast);
}

.berg-carousel-nav:hover {
    background-color: var(--berg-primary);
    border-color: var(--berg-primary);
    color: var(--berg-text-white);
}

.berg-carousel-nav.prev {
    left: -24px;
}

.berg-carousel-nav.next {
    right: -24px;
}


/* ===========================================
   FEATURED SECTION (Luxury Line)
   =========================================== */

.berg-featured-section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    align-items: stretch;
}

.berg-featured-content {
    background-color: var(--berg-bg-sage);
    padding: var(--berg-space-3xl);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.berg-featured-image {
    position: relative;
    overflow: hidden;
}

.berg-featured-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* ===========================================
   SEMINARS SECTION
   =========================================== */

.berg-seminars-section {
    background-color: var(--berg-primary);
    color: var(--berg-text-white);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

.berg-seminars-content {
    padding: var(--berg-space-3xl);
}

.berg-seminars-content h2 {
    color: var(--berg-text-white);
}

.berg-seminars-content p {
    color: rgba(255, 255, 255, 0.9);
}


/* ===========================================
   TESTIMONIALS SECTION
   =========================================== */

.berg-testimonials {
    background-color: var(--berg-bg-warm);
    padding: var(--berg-space-3xl) 0;
}

.berg-testimonial-card {
    background-color: var(--berg-bg-white);
    padding: var(--berg-space-xl);
    text-align: center;
}

.berg-testimonial-stars {
    color: var(--berg-primary);
    margin-bottom: var(--berg-space-md);
}

.berg-testimonial-title {
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-lg);
    margin-bottom: var(--berg-space-md);
}

.berg-testimonial-text {
    font-style: italic;
    color: var(--berg-text-secondary);
    margin-bottom: var(--berg-space-md);
}

.berg-testimonial-author {
    font-size: var(--berg-text-sm);
    color: var(--berg-text-secondary);
}


/* ===========================================
   EXPERIENCE REPORTS (Before/After)
   =========================================== */

.berg-experience-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--berg-space-md);
}

.berg-experience-card {
    position: relative;
}

.berg-experience-card img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
}

.berg-experience-badges {
    position: absolute;
    bottom: var(--berg-space-sm);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: var(--berg-space-xs);
}

.berg-experience-badge {
    background-color: var(--berg-primary);
    color: var(--berg-text-white);
    padding: 4px 12px;
    font-size: var(--berg-text-xs);
    font-weight: var(--berg-weight-semibold);
    text-transform: uppercase;
}


/* ===========================================
   NEWSLETTER SECTION
   =========================================== */

.berg-newsletter {
    background-color: var(--berg-primary);
    color: var(--berg-text-white);
    padding: var(--berg-space-xl) 0;
    text-align: center;
}

.berg-newsletter h3 {
    color: var(--berg-text-white);
    margin-bottom: var(--berg-space-md);
}

.berg-newsletter-form {
    display: flex;
    max-width: 500px;
    margin: 0 auto;
    gap: var(--berg-space-sm);
}

.berg-newsletter-input {
    flex: 1;
    padding: 14px var(--berg-space-md);
    border: 2px solid var(--berg-text-white);
    background-color: transparent;
    color: var(--berg-text-white);
    font-family: var(--berg-font-primary);
}

.berg-newsletter-input::placeholder {
    color: rgba(255, 255, 255, 0.7);
}


/* ===========================================
   FOOTER
   =========================================== */

.berg-footer,
#main-footer {
    background-color: var(--berg-bg-light);
    border-top: var(--berg-border-width) solid var(--berg-border);
    padding: var(--berg-space-3xl) 0 var(--berg-space-xl);
}

.berg-footer-columns {
    display: grid;
    grid-template-columns: 1.5fr repeat(4, 1fr);
    gap: var(--berg-space-xl);
}

.berg-footer-heading {
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-sm);
    text-transform: uppercase;
    margin-bottom: var(--berg-space-md);
    color: var(--berg-text-primary);
}

.berg-footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.berg-footer-links li {
    margin-bottom: var(--berg-space-xs);
}

.berg-footer-links a {
    font-size: var(--berg-text-sm);
    color: var(--berg-text-secondary);
    text-decoration: none;
    transition: color var(--berg-transition-fast);
}

.berg-footer-links a:hover {
    color: var(--berg-primary);
}

/* Payment Icons */
.berg-payment-icons {
    display: flex;
    gap: var(--berg-space-sm);
    flex-wrap: wrap;
}

.berg-payment-icon {
    height: 24px;
    width: auto;
}

/* Social Icons */
.berg-social-icons {
    display: flex;
    gap: var(--berg-space-sm);
}

.berg-social-icon {
    width: 36px;
    height: 36px;
    border: var(--berg-border-width) solid var(--berg-border);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--berg-text-primary);
    transition: all var(--berg-transition-fast);
}

.berg-social-icon:hover {
    background-color: var(--berg-primary);
    border-color: var(--berg-primary);
    color: var(--berg-text-white);
}


/* ===========================================
   WOOCOMMERCE OVERRIDES
   =========================================== */

/* Add to Cart Button */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    background-color: var(--berg-primary) !important;
    color: var(--berg-text-white) !important;
    font-family: var(--berg-font-primary);
    font-weight: var(--berg-weight-semibold);
    font-size: var(--berg-text-sm);
    text-transform: uppercase;
    letter-spacing: var(--berg-tracking-wide);
    padding: 14px 28px;
    border-radius: var(--berg-radius-sm);
    transition: all var(--berg-transition-normal);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    background-color: var(--berg-primary-hover) !important;
}

/* Sale Badge */
.woocommerce span.onsale {
    background-color: var(--berg-primary);
    border-radius: 0;
}

/* Star Ratings */
.woocommerce .star-rating span::before,
.woocommerce .star-rating::before {
    color: var(--berg-primary);
}

/* Breadcrumbs */
.woocommerce .woocommerce-breadcrumb {
    font-size: var(--berg-text-sm);
    color: var(--berg-text-secondary);
}

.woocommerce .woocommerce-breadcrumb a {
    color: var(--berg-text-secondary);
}

.woocommerce .woocommerce-breadcrumb a:hover {
    color: var(--berg-primary);
}


/* ===========================================
   DIVI SPECIFIC OVERRIDES
   =========================================== */

/* Reset Divi defaults to use our variables */
.et_pb_section {
    padding: var(--berg-space-3xl) 0;
}

.et_pb_row {
    max-width: var(--berg-content-max);
}

/* Divi Button Override */
.et_pb_button {
    font-family: var(--berg-font-primary) !important;
}

/* Divi Text Module */
.et_pb_text {
    font-family: var(--berg-font-primary);
}

/* Divi Blurb Module */
.et_pb_blurb_content {
    font-family: var(--berg-font-primary);
}


/* ===========================================
   RESPONSIVE BREAKPOINTS
   =========================================== */

/* Tablet */
@media (max-width: 980px) {
    :root {
        --berg-text-3xl: 40px;
        --berg-text-2xl: 28px;
        --berg-space-3xl: 64px;
    }
    
    .berg-category-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .berg-featured-section,
    .berg-seminars-section {
        grid-template-columns: 1fr;
    }
    
    .berg-experience-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .berg-footer-columns {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile */
@media (max-width: 767px) {
    :root {
        --berg-text-3xl: 32px;
        --berg-text-2xl: 24px;
        --berg-text-lg: 18px;
        --berg-space-3xl: 48px;
        --berg-space-2xl: 40px;
    }
    
    .berg-category-grid {
        grid-template-columns: 1fr;
    }
    
    .berg-experience-grid {
        grid-template-columns: 1fr 1fr;
    }
    
    .berg-footer-columns {
        grid-template-columns: 1fr;
        text-align: center;
    }
    
    .berg-newsletter-form {
        flex-direction: column;
    }
}


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

/* Text Alignment */
.berg-text-center { text-align: center; }
.berg-text-left { text-align: left; }
.berg-text-right { text-align: right; }

/* Text Colors */
.berg-text-primary { color: var(--berg-text-primary); }
.berg-text-secondary { color: var(--berg-text-secondary); }
.berg-text-white { color: var(--berg-text-white); }
.berg-text-muted { color: var(--berg-text-muted); }

/* Background Colors */
.berg-bg-primary { background-color: var(--berg-primary); }
.berg-bg-light { background-color: var(--berg-bg-light); }
.berg-bg-sage { background-color: var(--berg-bg-sage); }
.berg-bg-warm { background-color: var(--berg-bg-warm); }
.berg-bg-white { background-color: var(--berg-bg-white); }

/* Spacing */
.berg-mt-sm { margin-top: var(--berg-space-sm); }
.berg-mt-md { margin-top: var(--berg-space-md); }
.berg-mt-lg { margin-top: var(--berg-space-lg); }
.berg-mt-xl { margin-top: var(--berg-space-xl); }

.berg-mb-sm { margin-bottom: var(--berg-space-sm); }
.berg-mb-md { margin-bottom: var(--berg-space-md); }
.berg-mb-lg { margin-bottom: var(--berg-space-lg); }
.berg-mb-xl { margin-bottom: var(--berg-space-xl); }

.berg-py-sm { padding-top: var(--berg-space-sm); padding-bottom: var(--berg-space-sm); }
.berg-py-md { padding-top: var(--berg-space-md); padding-bottom: var(--berg-space-md); }
.berg-py-lg { padding-top: var(--berg-space-lg); padding-bottom: var(--berg-space-lg); }
.berg-py-xl { padding-top: var(--berg-space-xl); padding-bottom: var(--berg-space-xl); }

/* Display */
.berg-hidden { display: none; }
.berg-block { display: block; }
.berg-flex { display: flex; }
.berg-grid { display: grid; }

/* Flexbox */
.berg-flex-center { 
    display: flex; 
    align-items: center; 
    justify-content: center; 
}

.berg-flex-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}