/* Greens Genesis Block Theme Custom Styles - Typography with Variables */

/* =============================================================================
   CSS VARIABLES - TYPOGRAPHY DEFINITIONS
   ============================================================================= */

:root {
    /* Font Family Variables */
    --font-primary: 'interstate', sans-serif;
    --font-secondary: 'anton', sans-serif;
    --font-accent: 'worker', serif;
    
    /* H1 Variables - Desktop */
    --h1-font-family: var(--font-secondary);
    --h1-font-size: 3.5rem;
    --h1-font-weight: 400;
    --h1-font-style: normal;
    --h1-line-height: 4.2rem; /* 120% */
    --h1-letter-spacing: 0.035rem;
    --h1-text-transform: uppercase;
    
    /* H1 Variables - Mobile */
    --h1-mobile-font-size: 2.25rem;
    --h1-mobile-line-height: 2.7rem; /* 120% */
    --h1-mobile-letter-spacing: 0.0225rem;
    
    /* H2 Variables */
    --h2-font-family: var(--font-secondary);
    --h2-font-size: 2rem;
    --h2-font-weight: 400;
    --h2-font-style: normal;
    --h2-line-height: 2.7rem; /* 135% */
    --h2-letter-spacing: 0.028rem;
    --h2-text-transform: uppercase;
    
    /* H3 Variables */
    --h3-font-family: var(--font-primary);
    --h3-font-size: 1.375rem;
    --h3-font-weight: 800; /* Interstate Black */
    --h3-font-style: normal;
    --h3-line-height: 2rem; /* 145.455% */
    --h3-letter-spacing: 0.165rem;
    --h3-text-transform: uppercase;
    
    /* H4 Variables */
    --h4-font-family: var(--font-accent);
    --h4-font-size: 1.125rem;
    --h4-font-weight: 800; /* Worker Black */
    --h4-font-style: italic; /* Slanted */
    --h4-line-height: 1.875rem; /* 166.667% */
    --h4-letter-spacing: 0.045rem;
    --h4-text-transform: uppercase;
    
    /* H5 & H6 Variables */
    --h5-h6-font-family: var(--font-primary);
    --h5-h6-font-size: 1rem;
    --h5-h6-font-weight: 400;
    --h5-h6-font-style: normal;
    --h5-h6-line-height: 1.6875rem;
    --h5-h6-letter-spacing: 0.02rem;
    
    /* Body Text Variables */
    --body-font-family: var(--font-primary);
    --body-font-size: 1rem;
    --body-font-weight: 400; /* Interstate Regular */
    --body-font-style: normal;
    --body-line-height: 1.6875rem; /* 168.75% */
    --body-letter-spacing: 0.02rem;
    
    /* Body Italic Variables */
    --body-italic-font-weight: 400;
    --body-italic-font-style: italic;
    
    /* Body Bold Variables */
    --body-bold-font-weight: 800; /* Interstate Black */
    
    /* Blockquote Variables */
    --blockquote-font-family: var(--font-primary);
    --blockquote-font-size: 1.125rem;
    --blockquote-font-weight: 400;
    --blockquote-font-style: italic;
    --blockquote-line-height: 1.6875rem;
    --blockquote-letter-spacing: 0.04rem;
    
    /* Button & Label Variables */
    --button-font-family: var(--font-accent);
    --button-font-weight: 800; /* Worker Black */
    --button-font-style: normal;
    
    /* Legacy Color Variables (maintain backwards compatibility) */
    --custom-primary-color: var(--primary-green, #154734);
    --custom-secondary-color: var(--neutral-1, #595959);
    --custom-accent-color: var(--accent-1, #FF6700);
    --custom-border-radius: 8px;
    --custom-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    
    /* Extended Color System */
    --text-primary: var(--black, #000000);
    --text-secondary: var(--neutral-1, #595959);
    --text-light: var(--neutral-2, #D0D3D4);
    --background-primary: var(--white, #FFFFFF);
    --background-secondary: var(--neutral-2, #D0D3D4);
    --border-color: var(--neutral-2, #D0D3D4);
}

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

body {
    font-family: var(--body-font-family);
    font-size: var(--body-font-size);
    font-weight: var(--body-font-weight);
    font-style: var(--body-font-style);
    line-height: var(--body-line-height);
    letter-spacing: var(--body-letter-spacing);
}

/* =============================================================================
   HEADING STYLES
   ============================================================================= */

/* H1 - Desktop */
h1, 
.wp-block-heading h1,
h1.wp-block-heading {
    font-family: var(--h1-font-family) !important;
    font-size: var(--h1-font-size) !important;
    font-weight: var(--h1-font-weight) !important;
    font-style: var(--h1-font-style) !important;
    line-height: var(--h1-line-height) !important;
    letter-spacing: var(--h1-letter-spacing) !important;
    text-transform: var(--h1-text-transform);
}

/* H2 */
h2,
.wp-block-heading h2,
h2.wp-block-heading {
    font-family: var(--h2-font-family) !important;
    font-size: var(--h2-font-size) !important;
    font-weight: var(--h2-font-weight) !important;
    font-style: var(--h2-font-style) !important;
    line-height: var(--h2-line-height) !important;
    letter-spacing: var(--h2-letter-spacing) !important;
    text-transform: var(--h2-text-transform);
}

/* H3 */
h3,
.wp-block-heading h3,
h3.wp-block-heading {
    font-family: var(--h3-font-family) !important;
    font-size: var(--h3-font-size) !important;
    font-weight: var(--h3-font-weight) !important;
    font-style: var(--h3-font-style) !important;
    line-height: var(--h3-line-height) !important;
    letter-spacing: var(--h3-letter-spacing) !important;
    text-transform: var(--h3-text-transform);
}

/* H4 */
h4,
.wp-block-heading h4,
h4.wp-block-heading {
    font-family: var(--h4-font-family) !important;
    font-size: var(--h4-font-size) !important;
    font-weight: var(--h4-font-weight) !important;
    font-style: var(--h4-font-style) !important;
    line-height: var(--h4-line-height) !important;
    letter-spacing: var(--h4-letter-spacing) !important;
    text-transform: var(--h4-text-transform);
}

/* H5 & H6 */
h5, h6,
.wp-block-heading h5,
.wp-block-heading h6,
h5.wp-block-heading,
h6.wp-block-heading {
    font-family: var(--h5-h6-font-family) !important;
    font-size: var(--h5-h6-font-size) !important;
    font-weight: var(--h5-h6-font-weight) !important;
    font-style: var(--h5-h6-font-style) !important;
    line-height: var(--h5-h6-line-height) !important;
    letter-spacing: var(--h5-h6-letter-spacing) !important;
}

/* =============================================================================
   BODY TEXT AND PARAGRAPH STYLES
   ============================================================================= */

/* Paragraphs */
p, 
.wp-block-paragraph,
ul, ol, li {
    font-family: var(--body-font-family) !important;
    font-size: var(--body-font-size) !important;
    font-weight: var(--body-font-weight) !important;
    font-style: var(--body-font-style) !important;
    line-height: var(--body-line-height) !important;
    letter-spacing: var(--body-letter-spacing) !important;
    margin-bottom: 24px;
}

/* List specific styling */
.wp-block-list,
.wp-block-list li {
    font-family: var(--body-font-family) !important;
    font-size: var(--body-font-size) !important;
    font-weight: var(--body-font-weight) !important;
    line-height: var(--body-line-height) !important;
    letter-spacing: var(--body-letter-spacing) !important;
}

/* Bold text - Interstate Black */
strong, b,
.has-inline-bold {
    font-weight: var(--body-bold-font-weight) !important;
    font-style: normal !important;
}

/* Bold + Italic text - Interstate Black Italic */
strong em, b em,
em strong, em b,
.has-inline-bold.has-inline-italic {
    font-weight: var(--body-bold-font-weight) !important;
    font-style: italic !important;
}

/* Italic text - Interstate Regular Italic */
em, i,
.has-inline-italic {
    font-weight: var(--body-italic-font-weight) !important;
    font-style: var(--body-italic-font-style) !important;
}

/* =============================================================================
   BLOCKQUOTE STYLES
   ============================================================================= */

blockquote,
.wp-block-quote {
    font-family: var(--blockquote-font-family) !important;
    font-size: var(--blockquote-font-size) !important;
    font-weight: var(--blockquote-font-weight) !important;
    font-style: var(--blockquote-font-style) !important;
    line-height: var(--blockquote-line-height) !important;
    letter-spacing: var(--blockquote-letter-spacing) !important;
    margin-bottom: 24px;
    padding-left: 1.5rem;
    margin: 1.5rem 0;
    padding: 1rem 1rem 1rem 2rem;
}

blockquote cite {
    font-weight: 400;
    font-style: normal;
}

/* =============================================================================
   MOBILE RESPONSIVE STYLES
   ============================================================================= */

@media (max-width: 768px) {
    /* H1 Mobile */
    h1,
    .wp-block-heading h1,
    h1.wp-block-heading {
        font-size: var(--h1-mobile-font-size) !important;
        line-height: var(--h1-mobile-line-height) !important;
        letter-spacing: var(--h1-mobile-letter-spacing) !important;
    }

    /* Adjust other headings for mobile if needed */
    h2,
    .wp-block-heading h2,
    h2.wp-block-heading {
        font-size: 1.5rem !important;
        line-height: 2rem !important;
    }

    h3,
    .wp-block-heading h3,
    h3.wp-block-heading {
        font-size: 1.25rem !important;
        line-height: 1.75rem !important;
    }

    h4,
    .wp-block-heading h4,
    h4.wp-block-heading {
        font-size: 1rem !important;
        line-height: 1.5rem !important;
    }

    .header-logo-spacer {
        display: none;
    }
}

@media (max-width: 600px) {
    header .wp-block-group.is-content-justification-space-between.is-nowrap.is-layout-flex.wp-block-group-is-layout-flex .wp-block-group.is-content-justification-right.is-nowrap.is-layout-flex.wp-block-group-is-layout-flex {
        order: 3;
    }
}

/* =============================================================================
   WORDPRESS FONT SIZE CLASS OVERRIDES
   ============================================================================= */

/* H1 Overrides */
h1.has-small-font-size,
h1.has-medium-font-size,
h1.has-large-font-size,
h1.has-x-large-font-size,
h1.has-xx-large-font-size,
h1[class*="has-"][class*="-font-size"] {
    font-size: var(--h1-font-size) !important;
    font-weight: var(--h1-font-weight) !important;
    line-height: var(--h1-line-height) !important;
    font-family: var(--h1-font-family) !important;
    font-style: var(--h1-font-style) !important;
    letter-spacing: var(--h1-letter-spacing) !important;
    text-transform: var(--h1-text-transform);
}

/* H2 Overrides */
h2.has-small-font-size,
h2.has-medium-font-size,
h2.has-large-font-size,
h2.has-x-large-font-size,
h2.has-xx-large-font-size,
h2[class*="has-"][class*="-font-size"] {
    font-size: var(--h2-font-size) !important;
    font-weight: var(--h2-font-weight) !important;
    line-height: var(--h2-line-height) !important;
    font-family: var(--h2-font-family) !important;
    font-style: var(--h2-font-style) !important;
    letter-spacing: var(--h2-letter-spacing) !important;
    text-transform: var(--h2-text-transform);
}

/* H3 Overrides */
h3.has-small-font-size,
h3.has-medium-font-size,
h3.has-large-font-size,
h3.has-x-large-font-size,
h3.has-xx-large-font-size,
h3[class*="has-"][class*="-font-size"] {
    font-size: var(--h3-font-size) !important;
    font-weight: var(--h3-font-weight) !important;
    line-height: var(--h3-line-height) !important;
    font-family: var(--h3-font-family) !important;
    font-style: var(--h3-font-style) !important;
    letter-spacing: var(--h3-letter-spacing) !important;
    text-transform: var(--h3-text-transform);
}

/* H4 Overrides */
h4.has-small-font-size,
h4.has-medium-font-size,
h4.has-large-font-size,
h4.has-x-large-font-size,
h4.has-xx-large-font-size,
h4[class*="has-"][class*="-font-size"] {
    font-size: var(--h4-font-size) !important;
    font-weight: var(--h4-font-weight) !important;
    line-height: var(--h4-line-height) !important;
    font-family: var(--h4-font-family) !important;
    font-style: var(--h4-font-style) !important;
    letter-spacing: var(--h4-letter-spacing) !important;
    text-transform: var(--h4-text-transform);
}

/* H5 & H6 Overrides */
h5.has-small-font-size,
h5.has-medium-font-size,
h5.has-large-font-size,
h5.has-x-large-font-size,
h5.has-xx-large-font-size,
h5[class*="has-"][class*="-font-size"],
h6.has-small-font-size,
h6.has-medium-font-size,
h6.has-large-font-size,
h6.has-x-large-font-size,
h6.has-xx-large-font-size,
h6[class*="has-"][class*="-font-size"] {
    font-size: var(--h5-h6-font-size) !important;
    font-weight: var(--h5-h6-font-weight) !important;
    line-height: var(--h5-h6-line-height) !important;
    font-family: var(--h5-h6-font-family) !important;
    font-style: var(--h5-h6-font-style) !important;
    letter-spacing: var(--h5-h6-letter-spacing) !important;
}

/* Paragraph Overrides */
p.has-small-font-size,
p.has-medium-font-size,
p.has-large-font-size,
p.has-x-large-font-size,
p.has-xx-large-font-size,
p[class*="has-"][class*="-font-size"] {
    font-size: var(--body-font-size) !important;
    font-weight: var(--body-font-weight) !important;
    line-height: var(--body-line-height) !important;
    letter-spacing: var(--body-letter-spacing) !important;
    font-family: var(--body-font-family) !important;
    font-style: var(--body-font-style) !important;
}

/* List Overrides */
ul.has-small-font-size,
ul.has-medium-font-size,
ul.has-large-font-size,
ul.has-x-large-font-size,
ul.has-xx-large-font-size,
ul[class*="has-"][class*="-font-size"],
ol.has-small-font-size,
ol.has-medium-font-size,
ol.has-large-font-size,
ol.has-x-large-font-size,
ol.has-xx-large-font-size,
ol[class*="has-"][class*="-font-size"] {
    font-size: var(--body-font-size) !important;
    font-weight: var(--body-font-weight) !important;
    line-height: var(--body-line-height) !important;
    letter-spacing: var(--body-letter-spacing) !important;
    font-family: var(--body-font-family) !important;
    font-style: var(--body-font-style) !important;
}

/* Blockquote Overrides */
blockquote.has-small-font-size,
blockquote.has-medium-font-size,
blockquote.has-large-font-size,
blockquote.has-x-large-font-size,
blockquote.has-xx-large-font-size,
blockquote[class*="has-"][class*="-font-size"] {
    font-size: var(--blockquote-font-size) !important;
    font-weight: var(--blockquote-font-weight) !important;
    line-height: var(--blockquote-line-height) !important;
    letter-spacing: var(--blockquote-letter-spacing) !important;
    font-family: var(--blockquote-font-family) !important;
    font-style: var(--blockquote-font-style) !important;
}

/* =============================================================================
   MOBILE FONT SIZE OVERRIDES
   ============================================================================= */

@media (max-width: 768px) {
    h1.has-small-font-size,
    h1.has-medium-font-size,
    h1.has-large-font-size,
    h1.has-x-large-font-size,
    h1.has-xx-large-font-size,
    h1[class*="has-"][class*="-font-size"] {
        font-size: var(--h1-mobile-font-size) !important;
        line-height: var(--h1-mobile-line-height) !important;
        letter-spacing: var(--h1-mobile-letter-spacing) !important;
    }
    
    h2.has-small-font-size,
    h2.has-medium-font-size,
    h2.has-large-font-size,
    h2.has-x-large-font-size,
    h2.has-xx-large-font-size,
    h2[class*="has-"][class*="-font-size"] {
        font-size: 1.5rem !important;
        line-height: 2rem !important;
    }
    
    h3.has-small-font-size,
    h3.has-medium-font-size,
    h3.has-large-font-size,
    h3.has-x-large-font-size,
    h3.has-xx-large-font-size,
    h3[class*="has-"][class*="-font-size"] {
        font-size: 1.25rem !important;
        line-height: 1.75rem !important;
    }
    
    h4.has-small-font-size,
    h4.has-medium-font-size,
    h4.has-large-font-size,
    h4.has-x-large-font-size,
    h4.has-xx-large-font-size,
    h4[class*="has-"][class*="-font-size"] {
        font-size: 1rem !important;
        line-height: 1.5rem !important;
    }
}

/* =============================================================================
   BUTTON STYLES
   ============================================================================= */

/* Buttons use Worker Black */
.wp-block-button__link,
.wp-element-button,
button,
input[type="submit"],
input[type="button"] {
    font-family: var(--button-font-family) !important;
    font-weight: var(--button-font-weight) !important;
    font-style: var(--button-font-style) !important;
}

.wp-element-button img {
    margin-right: 8px;
}

.has-huge-icon-size li a svg {
    height: 72px !important;
    width: 72px !important;
}

/* =============================================================================
   FORM STYLES
   ============================================================================= */

/* Form labels use Worker Black */
label,
.wp-block-form label {
    font-family: var(--button-font-family) !important;
    font-weight: var(--button-font-weight) !important;
    font-style: var(--button-font-style) !important;
}

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

/* Links */
a {
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    text-decoration: underline;
}

/* Utility Classes for Different Font Weights */
.font-light { font-weight: 300; }
.font-normal { font-weight: 400; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }
.font-black { font-weight: 800; }

/* Responsive Design */
@media (max-width: 768px) {
    .wp-block-button__link.has-custom-primary-green-background-color,
    .wp-block-button__link.has-custom-accent-1-background-color,
    .wp-block-button__link.has-custom-mtn-white-background-color {
        padding: 8px !important;
    }
}

/* =============================================================================
   BUTTON STYLES - Custom Button Variants
   ============================================================================= */

/* Primary Button Styles - has-custom-mtn-steel-background-color */

/* Default State */
.wp-block-button__link.has-custom-mtn-steel-background-color {
    color: var(--mtn-white);
    border-radius: 0px;
    background: var(--mtn-steel);
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30);
    height: 46px;
    padding: 4px 8px;
    /* border: 6px solid transparent; */
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    text-transform: uppercase;
    margin: 0 3px !important;
    letter-spacing: 0.09rem;
}

/* Hover State */
.wp-block-button__link.has-custom-mtn-steel-background-color:hover {
    border: 3px solid var(--mtn-steel) !important;
    padding: 7px 5px !important;
    background-color: var(--mtn-white) !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
    color: var(--mtn-steel) !important;
}

/* Focus State */
.wp-block-button__link.has-custom-mtn-steel-background-color:focus {
    border: 6px solid var(--mtn-steel) !important;
    padding: 4px 8px !important;
    background: var(--mtn-white) !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
    outline: none !important;
}

/* Disabled State */
.wp-block-button__link.has-custom-mtn-steel-background-color:disabled,
.wp-block-button__link.has-custom-mtn-steel-background-color[disabled] {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 7px 11px !important;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Ensure disabled state takes precedence over hover/focus */
.wp-block-button__link.has-custom-mtn-steel-background-color:disabled:hover,
.wp-block-button__link.has-custom-mtn-steel-background-color[disabled]:hover,
.wp-block-button__link.has-custom-mtn-steel-background-color:disabled:focus,
.wp-block-button__link.has-custom-mtn-steel-background-color[disabled]:focus {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
}

/* Secondary Button Styles - has-custom-mtn-clearing-background-color AND has-accent-5-background-color */

/* Default State */
.wp-block-button__link.has-custom-mtn-clearing-background-color,
.wp-block-button__link.has-accent-5-background-color {
    color: #141414;
    border-radius: 0px !important;
    background: var(--mtn-clearing);
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30);
    height: 46px;
    padding: 4px 8px;
    margin: 0 10px !important;
    border: 6px solid transparent;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    text-transform: uppercase;
    letter-spacing: 0.09rem;
}

/* Hover State */
.wp-block-button__link.has-custom-mtn-clearing-background-color:hover,
.wp-block-button__link.has-accent-5-background-color:hover {
    border: 3px solid var(--mtn-clearing) !important;
    padding: 7px 11px !important;
    background-color: #F9F9FA !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
}

/* Focus State */
.wp-block-button__link.has-custom-mtn-clearing-background-color:focus,
.wp-block-button__link.has-accent-5-background-color:focus {
    border: 6px solid var(--mtn-clearing) !important;
    padding: 4px 8px !important;
    background: #F9F9FA !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
    outline: none !important;
}

/* Disabled State */
.wp-block-button__link.has-custom-mtn-clearing-background-color:disabled,
.wp-block-button__link.has-custom-mtn-clearing-background-color[disabled],
.wp-block-button__link.has-accent-5-background-color:disabled,
.wp-block-button__link.has-accent-5-background-color[disabled] {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Ensure disabled state takes precedence over hover/focus */
.wp-block-button__link.has-custom-mtn-clearing-background-color:disabled:hover,
.wp-block-button__link.has-custom-mtn-clearing-background-color[disabled]:hover,
.wp-block-button__link.has-custom-mtn-clearing-background-color:disabled:focus,
.wp-block-button__link.has-custom-mtn-clearing-background-color[disabled]:focus,
.wp-block-button__link.has-accent-5-background-color:disabled:hover,
.wp-block-button__link.has-accent-5-background-color[disabled]:hover,
.wp-block-button__link.has-accent-5-background-color:disabled:focus,
.wp-block-button__link.has-accent-5-background-color[disabled]:focus {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
}

/* Reverse Button Styles - has-custom-mtn-white-background-color */

/* Default State */
.wp-block-button__link.has-custom-mtn-white-background-color {
    color: #141414;
    border-radius: 0px !important;
    background: var(--mtn-white) !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    height: 46px !important;
    padding: 4px 8px !important;
    margin: 0 3px;
    border: 6px solid transparent !important;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    text-transform: uppercase;
    letter-spacing: 0.09rem;
}

/* Hover State */
.wp-block-button__link.has-custom-mtn-white-background-color:hover {
    border: 3px solid var(--mtn-white) !important;
    padding: 7px 11px !important;
    background-color: var(--mtn-clearing) !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
}

/* Focus State */
.wp-block-button__link.has-custom-mtn-white-background-color:focus {
    border: 6px solid var(--mtn-white) !important;
    padding: 4px 8px !important;
    background: var(--mtn-clearing) !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
    outline: none !important;
}

/* Disabled State */
.wp-block-button__link.has-custom-mtn-white-background-color:disabled,
.wp-block-button__link.has-custom-mtn-white-background-color[disabled] {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Ensure disabled state takes precedence over hover/focus */
.wp-block-button__link.has-custom-mtn-white-background-color:disabled:hover,
.wp-block-button__link.has-custom-mtn-white-background-color[disabled]:hover,
.wp-block-button__link.has-custom-mtn-white-background-color:disabled:focus,
.wp-block-button__link.has-custom-mtn-white-background-color[disabled]:focus {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
}

/* Secondary-2 Button Styles - has-accent-2-background-color */

/* Default State */
.wp-block-button__link.has-accent-2-background-color {
    color: #F9F9FA;
    /* border-radius: 120px !important; */
    background: #2b4558;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30);
    height: 46px;
    padding: 4px 8px;
    margin: 0 3px;
    border: 6px solid transparent;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    text-transform: uppercase;
    letter-spacing: 0.09rem;
}

/* Hover State */
.wp-block-button__link.has-accent-2-background-color:hover {
    color: #141414 !important;
    border: 3px solid #2b4558 !important;
    padding: 7px 11px !important;
    background-color: #F9F9FA !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
}

/* Focus State */
.wp-block-button__link.has-accent-2-background-color:focus {
    color: #141414 !important;
    border: 6px solid #2b4558 !important;
    padding: 4px 8px !important;
    background: #F9F9FA !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
    outline: none !important;
}

/* Disabled State */
.wp-block-button__link.has-accent-2-background-color:disabled,
.wp-block-button__link.has-accent-2-background-color[disabled] {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Ensure disabled state takes precedence over hover/focus */
.wp-block-button__link.has-accent-2-background-color:disabled:hover,
.wp-block-button__link.has-accent-2-background-color[disabled]:hover,
.wp-block-button__link.has-accent-2-background-color:disabled:focus,
.wp-block-button__link.has-accent-2-background-color[disabled]:focus {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
}

/* =============================================================================
   LAYOUT UTILITIES
   ============================================================================= */

.wp-block-buttons.is-content-justification-space-between {
    /* height: 100px; */
    /* width: 50%; */
}

.wp-block-button {
    white-space: nowrap;
}

.primary-cta-button {
    display: none !important;
}

@media (min-width: 600px) {
    .primary-cta-button {
        display: flex !important;
    }
}

.custom-footer-columns {
    flex-direction: column;
    align-items: center;
}

.custom-footer-text-columns {
    flex-direction: column;
    gap: 0;
}

/* Change footer to desktop layout */
@media (min-width: 782px) {
    .primary-cta-button {
        display: flex !important;
    }

    .custom-footer-columns {
        flex-direction: row;
        align-items: flex-start;
    }

    .custom-footer-text-columns {
        flex-direction: row;
        gap: var(--wp--preset--spacing--80);
    }
}


/* Greens Genesis Block Theme Custom Styles - Typography with Variables */

/* =============================================================================
   CSS VARIABLES - TYPOGRAPHY DEFINITIONS
   ============================================================================= */

:root {
    /* Font Family Variables */
    --font-primary: 'interstate', sans-serif;
    --font-secondary: 'anton', sans-serif;
    --font-accent: 'worker', serif;
    
    /* H1 Variables - Desktop */
    --h1-font-family: var(--font-secondary);
    --h1-font-size: 3.5rem;
    --h1-font-weight: 400;
    --h1-font-style: normal;
    --h1-line-height: 4.2rem; /* 120% */
    --h1-letter-spacing: 0.035rem;
    --h1-text-transform: uppercase;
    
    /* H1 Variables - Mobile */
    --h1-mobile-font-size: 2.25rem;
    --h1-mobile-line-height: 2.7rem; /* 120% */
    --h1-mobile-letter-spacing: 0.0225rem;
    
    /* H2 Variables */
    --h2-font-family: var(--font-secondary);
    --h2-font-size: 2rem;
    --h2-font-weight: 400;
    --h2-font-style: normal;
    --h2-line-height: 2.7rem; /* 135% */
    --h2-letter-spacing: 0.028rem;
    --h2-text-transform: uppercase;
    
    /* H3 Variables */
    --h3-font-family: var(--font-primary);
    --h3-font-size: 1.375rem;
    --h3-font-weight: 800; /* Interstate Black */
    --h3-font-style: normal;
    --h3-line-height: 2rem; /* 145.455% */
    --h3-letter-spacing: 0.165rem;
    --h3-text-transform: uppercase;
    
    /* H4 Variables */
    --h4-font-family: var(--font-accent);
    --h4-font-size: 1.125rem;
    --h4-font-weight: 800; /* Worker Black */
    --h4-font-style: italic; /* Slanted */
    --h4-line-height: 1.875rem; /* 166.667% */
    --h4-letter-spacing: 0.045rem;
    --h4-text-transform: uppercase;
    
    /* H5 & H6 Variables */
    --h5-h6-font-family: var(--font-primary);
    --h5-h6-font-size: 1rem;
    --h5-h6-font-weight: 400;
    --h5-h6-font-style: normal;
    --h5-h6-line-height: 1.6875rem;
    --h5-h6-letter-spacing: 0.02rem;
    
    /* Body Text Variables */
    --body-font-family: var(--font-primary);
    --body-font-size: 1rem;
    --body-font-weight: 400; /* Interstate Regular */
    --body-font-style: normal;
    --body-line-height: 1.6875rem; /* 168.75% */
    --body-letter-spacing: 0.02rem;
    
    /* Body Italic Variables */
    --body-italic-font-weight: 400;
    --body-italic-font-style: italic;
    
    /* Body Bold Variables */
    --body-bold-font-weight: 800; /* Interstate Black */
    
    /* Blockquote Variables */
    --blockquote-font-family: var(--font-primary);
    --blockquote-font-size: 1.125rem;
    --blockquote-font-weight: 400;
    --blockquote-font-style: italic;
    --blockquote-line-height: 1.6875rem;
    --blockquote-letter-spacing: 0.04rem;
    
    /* Button & Label Variables */
    --button-font-family: var(--font-accent);
    --button-font-weight: 800; /* Worker Black */
    --button-font-style: normal;
    
    /* Legacy Color Variables (maintain backwards compatibility) */
    --custom-primary-color: var(--primary-green, #154734);
    --custom-secondary-color: var(--neutral-1, #595959);
    --custom-accent-color: var(--accent-1, #FF6700);
    --custom-border-radius: 8px;
    --custom-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    
    /* Extended Color System */
    --text-primary: var(--black, #000000);
    --text-secondary: var(--neutral-1, #595959);
    --text-light: var(--neutral-2, #D0D3D4);
    --background-primary: var(--white, #FFFFFF);
    --background-secondary: var(--neutral-2, #D0D3D4);
    --border-color: var(--neutral-2, #D0D3D4);
}

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

body {
    font-family: var(--body-font-family);
    font-size: var(--body-font-size);
    font-weight: var(--body-font-weight);
    font-style: var(--body-font-style);
    line-height: var(--body-line-height);
    letter-spacing: var(--body-letter-spacing);
}

/* =============================================================================
   HEADING STYLES
   ============================================================================= */

/* H1 - Desktop */
h1, 
.wp-block-heading h1,
h1.wp-block-heading {
    font-family: var(--h1-font-family) !important;
    font-size: var(--h1-font-size) !important;
    font-weight: var(--h1-font-weight) !important;
    font-style: var(--h1-font-style) !important;
    line-height: var(--h1-line-height) !important;
    letter-spacing: var(--h1-letter-spacing) !important;
    text-transform: var(--h1-text-transform);
}

/* H2 */
h2,
.wp-block-heading h2,
h2.wp-block-heading {
    font-family: var(--h2-font-family) !important;
    font-size: var(--h2-font-size) !important;
    font-weight: var(--h2-font-weight) !important;
    font-style: var(--h2-font-style) !important;
    line-height: var(--h2-line-height) !important;
    letter-spacing: var(--h2-letter-spacing) !important;
    text-transform: var(--h2-text-transform);
}

/* H3 */
h3,
.wp-block-heading h3,
h3.wp-block-heading {
    font-family: var(--h3-font-family) !important;
    font-size: var(--h3-font-size) !important;
    font-weight: var(--h3-font-weight) !important;
    font-style: var(--h3-font-style) !important;
    line-height: var(--h3-line-height) !important;
    letter-spacing: var(--h3-letter-spacing) !important;
    text-transform: var(--h3-text-transform);
}

/* H4 */
h4,
.wp-block-heading h4,
h4.wp-block-heading {
    font-family: var(--h4-font-family) !important;
    font-size: var(--h4-font-size) !important;
    font-weight: var(--h4-font-weight) !important;
    font-style: var(--h4-font-style) !important;
    line-height: var(--h4-line-height) !important;
    letter-spacing: var(--h4-letter-spacing) !important;
    text-transform: var(--h4-text-transform);
}

/* H5 & H6 */
h5, h6,
.wp-block-heading h5,
.wp-block-heading h6,
h5.wp-block-heading,
h6.wp-block-heading {
    font-family: var(--h5-h6-font-family) !important;
    font-size: var(--h5-h6-font-size) !important;
    font-weight: var(--h5-h6-font-weight) !important;
    font-style: var(--h5-h6-font-style) !important;
    line-height: var(--h5-h6-line-height) !important;
    letter-spacing: var(--h5-h6-letter-spacing) !important;
}

/* =============================================================================
   BODY TEXT AND PARAGRAPH STYLES
   ============================================================================= */

/* Paragraphs */
p, 
.wp-block-paragraph,
ul, ol, li {
    font-family: var(--body-font-family) !important;
    font-size: var(--body-font-size) !important;
    font-weight: var(--body-font-weight) !important;
    font-style: var(--body-font-style) !important;
    line-height: var(--body-line-height) !important;
    letter-spacing: var(--body-letter-spacing) !important;
    margin-bottom: 24px;
}

/* List specific styling */
.wp-block-list,
.wp-block-list li {
    font-family: var(--body-font-family) !important;
    font-size: var(--body-font-size) !important;
    font-weight: var(--body-font-weight) !important;
    line-height: var(--body-line-height) !important;
    letter-spacing: var(--body-letter-spacing) !important;
}

/* Bold text - Interstate Black */
strong, b,
.has-inline-bold {
    font-weight: var(--body-bold-font-weight) !important;
    font-style: normal !important;
}

/* Bold + Italic text - Interstate Black Italic */
strong em, b em,
em strong, em b,
.has-inline-bold.has-inline-italic {
    font-weight: var(--body-bold-font-weight) !important;
    font-style: italic !important;
}

/* Italic text - Interstate Regular Italic */
em, i,
.has-inline-italic {
    font-weight: var(--body-italic-font-weight) !important;
    font-style: var(--body-italic-font-style) !important;
}

/* =============================================================================
   BLOCKQUOTE STYLES
   ============================================================================= */

blockquote,
.wp-block-quote {
    font-family: var(--blockquote-font-family) !important;
    font-size: var(--blockquote-font-size) !important;
    font-weight: var(--blockquote-font-weight) !important;
    font-style: var(--blockquote-font-style) !important;
    line-height: var(--blockquote-line-height) !important;
    letter-spacing: var(--blockquote-letter-spacing) !important;
    margin-bottom: 24px;
    padding-left: 1.5rem;
    margin: 1.5rem 0;
    padding: 1rem 1rem 1rem 2rem;
}

blockquote cite {
    font-weight: 400;
    font-style: normal;
}

/* =============================================================================
   MOBILE RESPONSIVE STYLES
   ============================================================================= */

@media (max-width: 768px) {
    /* H1 Mobile */
    h1,
    .wp-block-heading h1,
    h1.wp-block-heading {
        font-size: var(--h1-mobile-font-size) !important;
        line-height: var(--h1-mobile-line-height) !important;
        letter-spacing: var(--h1-mobile-letter-spacing) !important;
    }

    /* Adjust other headings for mobile if needed */
    h2,
    .wp-block-heading h2,
    h2.wp-block-heading {
        font-size: 1.5rem !important;
        line-height: 2rem !important;
    }

    h3,
    .wp-block-heading h3,
    h3.wp-block-heading {
        font-size: 1.25rem !important;
        line-height: 1.75rem !important;
    }

    h4,
    .wp-block-heading h4,
    h4.wp-block-heading {
        font-size: 1rem !important;
        line-height: 1.5rem !important;
    }

    .header-logo-spacer {
        display: none;
    }
}

@media (max-width: 600px) {
    header .wp-block-group.is-content-justification-space-between.is-nowrap.is-layout-flex.wp-block-group-is-layout-flex .wp-block-group.is-content-justification-right.is-nowrap.is-layout-flex.wp-block-group-is-layout-flex {
        order: 3;
    }
}

/* =============================================================================
   WORDPRESS FONT SIZE CLASS OVERRIDES
   ============================================================================= */

/* H1 Overrides */
h1.has-small-font-size,
h1.has-medium-font-size,
h1.has-large-font-size,
h1.has-x-large-font-size,
h1.has-xx-large-font-size,
h1[class*="has-"][class*="-font-size"] {
    font-size: var(--h1-font-size) !important;
    font-weight: var(--h1-font-weight) !important;
    line-height: var(--h1-line-height) !important;
    font-family: var(--h1-font-family) !important;
    font-style: var(--h1-font-style) !important;
    letter-spacing: var(--h1-letter-spacing) !important;
    text-transform: var(--h1-text-transform);
}

/* H2 Overrides */
h2.has-small-font-size,
h2.has-medium-font-size,
h2.has-large-font-size,
h2.has-x-large-font-size,
h2.has-xx-large-font-size,
h2[class*="has-"][class*="-font-size"] {
    font-size: var(--h2-font-size) !important;
    font-weight: var(--h2-font-weight) !important;
    line-height: var(--h2-line-height) !important;
    font-family: var(--h2-font-family) !important;
    font-style: var(--h2-font-style) !important;
    letter-spacing: var(--h2-letter-spacing) !important;
    text-transform: var(--h2-text-transform);
}

/* H3 Overrides */
h3.has-small-font-size,
h3.has-medium-font-size,
h3.has-large-font-size,
h3.has-x-large-font-size,
h3.has-xx-large-font-size,
h3[class*="has-"][class*="-font-size"] {
    font-size: var(--h3-font-size) !important;
    font-weight: var(--h3-font-weight) !important;
    line-height: var(--h3-line-height) !important;
    font-family: var(--h3-font-family) !important;
    font-style: var(--h3-font-style) !important;
    letter-spacing: var(--h3-letter-spacing) !important;
    text-transform: var(--h3-text-transform);
}

/* H4 Overrides */
h4.has-small-font-size,
h4.has-medium-font-size,
h4.has-large-font-size,
h4.has-x-large-font-size,
h4.has-xx-large-font-size,
h4[class*="has-"][class*="-font-size"] {
    font-size: var(--h4-font-size) !important;
    font-weight: var(--h4-font-weight) !important;
    line-height: var(--h4-line-height) !important;
    font-family: var(--h4-font-family) !important;
    font-style: var(--h4-font-style) !important;
    letter-spacing: var(--h4-letter-spacing) !important;
    text-transform: var(--h4-text-transform);
}

/* H5 & H6 Overrides */
h5.has-small-font-size,
h5.has-medium-font-size,
h5.has-large-font-size,
h5.has-x-large-font-size,
h5.has-xx-large-font-size,
h5[class*="has-"][class*="-font-size"],
h6.has-small-font-size,
h6.has-medium-font-size,
h6.has-large-font-size,
h6.has-x-large-font-size,
h6.has-xx-large-font-size,
h6[class*="has-"][class*="-font-size"] {
    font-size: var(--h5-h6-font-size) !important;
    font-weight: var(--h5-h6-font-weight) !important;
    line-height: var(--h5-h6-line-height) !important;
    font-family: var(--h5-h6-font-family) !important;
    font-style: var(--h5-h6-font-style) !important;
    letter-spacing: var(--h5-h6-letter-spacing) !important;
}

/* Paragraph Overrides */
p.has-small-font-size,
p.has-medium-font-size,
p.has-large-font-size,
p.has-x-large-font-size,
p.has-xx-large-font-size,
p[class*="has-"][class*="-font-size"] {
    font-size: var(--body-font-size) !important;
    font-weight: var(--body-font-weight) !important;
    line-height: var(--body-line-height) !important;
    letter-spacing: var(--body-letter-spacing) !important;
    font-family: var(--body-font-family) !important;
    font-style: var(--body-font-style) !important;
}

/* List Overrides */
ul.has-small-font-size,
ul.has-medium-font-size,
ul.has-large-font-size,
ul.has-x-large-font-size,
ul.has-xx-large-font-size,
ul[class*="has-"][class*="-font-size"],
ol.has-small-font-size,
ol.has-medium-font-size,
ol.has-large-font-size,
ol.has-x-large-font-size,
ol.has-xx-large-font-size,
ol[class*="has-"][class*="-font-size"] {
    font-size: var(--body-font-size) !important;
    font-weight: var(--body-font-weight) !important;
    line-height: var(--body-line-height) !important;
    letter-spacing: var(--body-letter-spacing) !important;
    font-family: var(--body-font-family) !important;
    font-style: var(--body-font-style) !important;
}

/* Blockquote Overrides */
blockquote.has-small-font-size,
blockquote.has-medium-font-size,
blockquote.has-large-font-size,
blockquote.has-x-large-font-size,
blockquote.has-xx-large-font-size,
blockquote[class*="has-"][class*="-font-size"] {
    font-size: var(--blockquote-font-size) !important;
    font-weight: var(--blockquote-font-weight) !important;
    line-height: var(--blockquote-line-height) !important;
    letter-spacing: var(--blockquote-letter-spacing) !important;
    font-family: var(--blockquote-font-family) !important;
    font-style: var(--blockquote-font-style) !important;
}

/* =============================================================================
   MOBILE FONT SIZE OVERRIDES
   ============================================================================= */

@media (max-width: 768px) {
    h1.has-small-font-size,
    h1.has-medium-font-size,
    h1.has-large-font-size,
    h1.has-x-large-font-size,
    h1.has-xx-large-font-size,
    h1[class*="has-"][class*="-font-size"] {
        font-size: var(--h1-mobile-font-size) !important;
        line-height: var(--h1-mobile-line-height) !important;
        letter-spacing: var(--h1-mobile-letter-spacing) !important;
    }
    
    h2.has-small-font-size,
    h2.has-medium-font-size,
    h2.has-large-font-size,
    h2.has-x-large-font-size,
    h2.has-xx-large-font-size,
    h2[class*="has-"][class*="-font-size"] {
        font-size: 1.5rem !important;
        line-height: 2rem !important;
    }
    
    h3.has-small-font-size,
    h3.has-medium-font-size,
    h3.has-large-font-size,
    h3.has-x-large-font-size,
    h3.has-xx-large-font-size,
    h3[class*="has-"][class*="-font-size"] {
        font-size: 1.25rem !important;
        line-height: 1.75rem !important;
    }
    
    h4.has-small-font-size,
    h4.has-medium-font-size,
    h4.has-large-font-size,
    h4.has-x-large-font-size,
    h4.has-xx-large-font-size,
    h4[class*="has-"][class*="-font-size"] {
        font-size: 1rem !important;
        line-height: 1.5rem !important;
    }
}

/* =============================================================================
   BUTTON STYLES
   ============================================================================= */

/* Buttons use Worker Black */
.wp-block-button__link,
.wp-element-button,
button,
input[type="submit"],
input[type="button"] {
    font-family: var(--button-font-family) !important;
    font-weight: var(--button-font-weight) !important;
    font-style: var(--button-font-style) !important;
}

.wp-element-button img {
    margin-right: 8px;
}

.has-huge-icon-size li a svg {
    height: 72px !important;
    width: 72px !important;
}

/* =============================================================================
   FORM STYLES
   ============================================================================= */

/* Form labels use Worker Black */
label,
.wp-block-form label {
    font-family: var(--button-font-family) !important;
    font-weight: var(--button-font-weight) !important;
    font-style: var(--button-font-style) !important;
}

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

/* Links */
a {
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    text-decoration: underline;
}

/* Utility Classes for Different Font Weights */
.font-light { font-weight: 300; }
.font-normal { font-weight: 400; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }
.font-black { font-weight: 800; }

/* Responsive Design */
@media (max-width: 768px) {
    .wp-block-button__link.has-custom-primary-green-background-color,
    .wp-block-button__link.has-custom-accent-1-background-color,
    .wp-block-button__link.has-custom-mtn-white-background-color {
        padding: 8px !important;
    }
}

/* =============================================================================
   BUTTON STYLES - Custom Button Variants
   ============================================================================= */

/* Primary Button Styles - has-custom-mtn-steel-background-color */

/* Default State */
.wp-block-button__link.has-custom-mtn-steel-background-color {
    color: var(--mtn-white);
    border-radius: 0px;
    background: var(--mtn-steel);
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30);
    height: 46px;
    padding: 4px 8px;
    /* border: 6px solid transparent; */
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    text-transform: uppercase;
    margin: 0 3px !important;
    letter-spacing: 0.09rem;
}

/* Hover State */
.wp-block-button__link.has-custom-mtn-steel-background-color:hover {
    border: 3px solid var(--mtn-steel) !important;
    padding: 7px 5px !important;
    background-color: var(--mtn-white) !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
    color: var(--mtn-steel) !important;
}

/* Focus State */
.wp-block-button__link.has-custom-mtn-steel-background-color:focus {
    border: 6px solid var(--mtn-steel) !important;
    padding: 4px 8px !important;
    background: var(--mtn-white) !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
    outline: none !important;
}

/* Disabled State */
.wp-block-button__link.has-custom-mtn-steel-background-color:disabled,
.wp-block-button__link.has-custom-mtn-steel-background-color[disabled] {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 7px 11px !important;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Ensure disabled state takes precedence over hover/focus */
.wp-block-button__link.has-custom-mtn-steel-background-color:disabled:hover,
.wp-block-button__link.has-custom-mtn-steel-background-color[disabled]:hover,
.wp-block-button__link.has-custom-mtn-steel-background-color:disabled:focus,
.wp-block-button__link.has-custom-mtn-steel-background-color[disabled]:focus {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
}

/* Secondary Button Styles - has-custom-mtn-clearing-background-color AND has-accent-5-background-color */

/* Default State */
.wp-block-button__link.has-custom-mtn-clearing-background-color,
.wp-block-button__link.has-accent-5-background-color {
    color: #141414;
    border-radius: 0px !important;
    background: var(--mtn-clearing);
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30);
    height: 46px;
    padding: 4px 8px;
    margin: 0 10px !important;
    border: 6px solid transparent;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    text-transform: uppercase;
    letter-spacing: 0.09rem;
}

/* Hover State */
.wp-block-button__link.has-custom-mtn-clearing-background-color:hover,
.wp-block-button__link.has-accent-5-background-color:hover {
    border: 3px solid var(--mtn-clearing) !important;
    padding: 7px 11px !important;
    background-color: #F9F9FA !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
}

/* Focus State */
.wp-block-button__link.has-custom-mtn-clearing-background-color:focus,
.wp-block-button__link.has-accent-5-background-color:focus {
    border: 6px solid var(--mtn-clearing) !important;
    padding: 4px 8px !important;
    background: #F9F9FA !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
    outline: none !important;
}

/* Disabled State */
.wp-block-button__link.has-custom-mtn-clearing-background-color:disabled,
.wp-block-button__link.has-custom-mtn-clearing-background-color[disabled],
.wp-block-button__link.has-accent-5-background-color:disabled,
.wp-block-button__link.has-accent-5-background-color[disabled] {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Ensure disabled state takes precedence over hover/focus */
.wp-block-button__link.has-custom-mtn-clearing-background-color:disabled:hover,
.wp-block-button__link.has-custom-mtn-clearing-background-color[disabled]:hover,
.wp-block-button__link.has-custom-mtn-clearing-background-color:disabled:focus,
.wp-block-button__link.has-custom-mtn-clearing-background-color[disabled]:focus,
.wp-block-button__link.has-accent-5-background-color:disabled:hover,
.wp-block-button__link.has-accent-5-background-color[disabled]:hover,
.wp-block-button__link.has-accent-5-background-color:disabled:focus,
.wp-block-button__link.has-accent-5-background-color[disabled]:focus {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
}

/* Reverse Button Styles - has-custom-mtn-white-background-color */

/* Default State */
.wp-block-button__link.has-custom-mtn-white-background-color {
    color: #141414;
    border-radius: 0px !important;
    background: var(--mtn-white) !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    height: 46px !important;
    padding: 4px 8px !important;
    margin: 0 3px;
    border: 6px solid transparent !important;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    text-transform: uppercase;
    letter-spacing: 0.09rem;
}

/* Hover State */
.wp-block-button__link.has-custom-mtn-white-background-color:hover {
    border: 3px solid var(--mtn-white) !important;
    padding: 7px 11px !important;
    background-color: var(--mtn-clearing) !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
}

/* Focus State */
.wp-block-button__link.has-custom-mtn-white-background-color:focus {
    border: 6px solid var(--mtn-white) !important;
    padding: 4px 8px !important;
    background: var(--mtn-clearing) !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
    outline: none !important;
}

/* Disabled State */
.wp-block-button__link.has-custom-mtn-white-background-color:disabled,
.wp-block-button__link.has-custom-mtn-white-background-color[disabled] {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Ensure disabled state takes precedence over hover/focus */
.wp-block-button__link.has-custom-mtn-white-background-color:disabled:hover,
.wp-block-button__link.has-custom-mtn-white-background-color[disabled]:hover,
.wp-block-button__link.has-custom-mtn-white-background-color:disabled:focus,
.wp-block-button__link.has-custom-mtn-white-background-color[disabled]:focus {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
}

/* Secondary-2 Button Styles - has-accent-2-background-color */

/* Default State */
.wp-block-button__link.has-accent-2-background-color {
    color: #F9F9FA;
    /* border-radius: 120px !important; */
    background: #2b4558;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30);
    height: 46px;
    padding: 4px 8px;
    margin: 0 3px;
    border: 6px solid transparent;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    text-transform: uppercase;
    letter-spacing: 0.09rem;
}

/* Hover State */
.wp-block-button__link.has-accent-2-background-color:hover {
    color: #141414 !important;
    border: 3px solid #2b4558 !important;
    padding: 7px 11px !important;
    background-color: #F9F9FA !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
}

/* Focus State */
.wp-block-button__link.has-accent-2-background-color:focus {
    color: #141414 !important;
    border: 6px solid #2b4558 !important;
    padding: 4px 8px !important;
    background: #F9F9FA !important;
    box-shadow: 3px 6px 6px 2px rgba(0, 0, 0, 0.15) !important;
    outline: none !important;
}

/* Disabled State */
.wp-block-button__link.has-accent-2-background-color:disabled,
.wp-block-button__link.has-accent-2-background-color[disabled] {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
    cursor: not-allowed;
    opacity: 0.6;
}

/* Ensure disabled state takes precedence over hover/focus */
.wp-block-button__link.has-accent-2-background-color:disabled:hover,
.wp-block-button__link.has-accent-2-background-color[disabled]:hover,
.wp-block-button__link.has-accent-2-background-color:disabled:focus,
.wp-block-button__link.has-accent-2-background-color[disabled]:focus {
    background: grey !important;
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, 0.30) !important;
    border: 6px solid transparent !important;
    padding: 4px 8px !important;
}

/* =============================================================================
   LAYOUT UTILITIES
   ============================================================================= */

.wp-block-buttons.is-content-justification-space-between {
    /* height: 100px; */
    /* width: 50%; */
}

.wp-block-button {
    white-space: nowrap;
}

.primary-cta-button {
    display: none !important;
}

@media (min-width: 600px) {
    .primary-cta-button {
        display: flex !important;
    }
}

.custom-footer-columns {
    flex-direction: column;
    align-items: center;
}

.custom-footer-text-columns {
    flex-direction: column;
    gap: 0;
}

/* Change footer to desktop layout */
@media (min-width: 782px) {
    .primary-cta-button {
        display: flex !important;
    }

    .custom-footer-columns {
        flex-direction: row;
        align-items: flex-start;
    }

    .custom-footer-text-columns {
        flex-direction: row;
        gap: var(--wp--preset--spacing--80);
    }
}


.wp-block-column:has(iframe[src*="trailforks.com"]){
	display: flex;
	flex-direction: column;
}

.gb-block-layout-column-inner:has(iframe[src*="trailforks.com"]){
	display: flex;
	flex-direction: column;
	height: 100%;
	.wp-block-group {
		flex: 1;
		display: flex;
		flex-direction: column;
	}

	/* Make the iframe fill the group */
	.wp-block-group > iframe {
		flex: 1;
		min-height: 400px;
	}
}

@media (min-width: 1800px) {
	.wp-block-column:has(iframe[src*="trailforks.com"]){
		iframe{
			min-height: 60vh;
		}
	}
}