/**
 * SnowShades.fr — Premium CSS Overhaul
 * Maine Coon Cattery — Luxury Dark Theme
 *
 * Complete replacement for mobile-optimizations.css
 * Color palette: #070705 (darkest), #1a1a17 (sections), #b8964e (gold),
 *                #d4ad5e (gold hover), #ffffff (text)
 *
 * Sections:
 *   0. CSS Custom Properties
 *   1. Global Base Styles
 *   2. Typography Refinements
 *   3. Header & Navigation
 *   4. Footer Fix
 *   5. Scroll-to-Top Button
 *   6. Social Media Icons
 *   7. CTA Buttons
 *   8. Contact Form
 *   9. Hero Sections
 *  10. Testimonials & Quotes
 *  11. Blog Cards
 *  12. Image Hover Effects
 *  13. Dividers & Decorative Elements
 *  14. Mobile Header Fix (Critical)
 *  15. Mobile Refinements
 *  16. Tablet Adjustments
 *  17. Smooth Scrolling & Performance
 *  18. Accessibility — Reduced Motion
 *  19. Print Styles
 *  20. Additional Polish
 */

/* ==========================================================================
   0. CSS Custom Properties (Design Tokens)
   ========================================================================== */

:root {
    --snow-darkest: #070705;
    --snow-dark: #0d0d0b;
    --snow-section: #1a1a17;
    --snow-card: #141412;
    --snow-gold: #b8964e;
    --snow-gold-hover: #d4ad5e;
    --snow-gold-light: #c9a85e;
    --snow-gold-muted: rgba(184, 150, 78, 0.5);
    --snow-gold-subtle: rgba(184, 150, 78, 0.15);
    --snow-gold-faint: rgba(184, 150, 78, 0.08);
    --snow-white: #ffffff;
    --snow-white-soft: rgba(255, 255, 255, 0.85);
    --snow-white-muted: rgba(255, 255, 255, 0.6);
    --snow-white-faint: rgba(255, 255, 255, 0.35);
    --snow-white-ghost: rgba(255, 255, 255, 0.1);
    --snow-transition: cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --snow-transition-fast: cubic-bezier(0.4, 0, 0.2, 1);
    --snow-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
    --snow-shadow-md: 0 6px 20px rgba(0, 0, 0, 0.4);
    --snow-shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.5);
    --snow-shadow-gold: 0 4px 15px rgba(184, 150, 78, 0.2);
    --snow-radius-sm: 2px;
    --snow-radius-md: 4px;
    --snow-radius-lg: 8px;
    --snow-radius-round: 50%;
}


/* ==========================================================================
   1. Global Base Styles
   ========================================================================== */

html {
    scroll-behavior: smooth;
}

body {
    font-size: 16px;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
    background-color: var(--snow-darkest);
}

/* Prevent horizontal overflow on all containers */
.site,
.ast-container,
#page {
    overflow-x: hidden;
}

/* Global link transition */
a {
    transition: color 0.3s var(--snow-transition-fast),
                border-color 0.3s var(--snow-transition-fast);
}

/* Selection styling */
::selection {
    background-color: rgba(184, 150, 78, 0.3);
    color: var(--snow-white);
}

::-moz-selection {
    background-color: rgba(184, 150, 78, 0.3);
    color: var(--snow-white);
}


/* ==========================================================================
   2. Typography Refinements
   ========================================================================== */

/* Headings — prevent aggressive hyphenation */
h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
    hyphens: none !important;
    -webkit-hyphens: none !important;
    -ms-hyphens: none !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    line-height: 1.3;
}

/* Heading letter-spacing refinements */
h1, .elementor-size-xxl {
    letter-spacing: 3px;
}

h2, .elementor-size-xl {
    letter-spacing: 2.5px;
}

h3, .elementor-size-lg {
    letter-spacing: 2px;
}

h4, h5, h6 {
    letter-spacing: 1.5px;
}

/* Body text — improved readability */
p,
.elementor-text-editor p,
.elementor-widget-text-editor {
    line-height: 1.75;
    letter-spacing: 0.3px;
}

/* Small text utility */
.elementor-widget-text-editor small,
.ast-small-footer {
    letter-spacing: 0.5px;
}


/* ==========================================================================
   3. Header & Navigation
   ========================================================================== */

/* Main navigation links */
.main-header-menu .menu-link,
.ast-header-stacked .main-header-menu .menu-link {
    letter-spacing: 2px !important;
    font-size: 12px !important;
    text-transform: uppercase;
    transition: color 0.3s var(--snow-transition-fast) !important;
}

.main-header-menu .menu-link:hover,
.main-header-menu .current-menu-item > .menu-link {
    color: var(--snow-gold) !important;
}

/* Sticky header refinement */
.ast-sticky-active .site-header,
#masthead.ast-sticky-active {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* Header separator */
.ast-header-stacked .site-header,
.site-header {
    border-bottom: 1px solid rgba(184, 150, 78, 0.1);
}


/* ==========================================================================
   4. Footer Fix (Critical)
   ========================================================================== */

/* Force dark background on ALL footer areas */
.site-below-footer-wrap,
.ast-small-footer,
.site-footer,
.site-below-footer-wrap .ast-row,
footer.site-footer,
.ast-footer-overlay,
.site-footer .ast-container,
.ast-above-footer-wrap,
.ast-footer-copyright,
footer,
.site-below-footer-wrap .ast-builder-layout-element,
.ast-builder-footer-grid-columns {
    background-color: var(--snow-darkest) !important;
    border-top: 1px solid rgba(184, 150, 78, 0.2);
}

/* Footer text — muted */
.ast-footer-copyright,
.ast-small-footer .ast-footer-site-title,
.site-below-footer-wrap .ast-builder-grid-row,
.site-footer .ast-builder-grid-row {
    color: rgba(255, 255, 255, 0.3) !important;
}

/* Hide "Powered by" / Astra credit links */
.ast-footer-copyright a,
.site-below-footer-wrap a,
.ast-small-footer a[href*="developer.wordpress.org"],
.ast-small-footer a[href*="developer.wordpress"],
.ast-small-footer a[href*="developer"],
.site-below-footer-wrap a[href*="developer"],
.site-below-footer-wrap a[href*="developer.wordpress"],
.ast-small-footer a[href*="developer.wordpress.org"],
a[href*="developer.wordpress"],
.ast-footer-copyright a[href*="developer"] {
    display: none !important;
}

/* Footer section text colors */
.ast-small-footer .ast-small-footer-section-1,
.ast-small-footer .ast-small-footer-section-2,
.site-below-footer-wrap .site-below-footer-section-1,
.site-below-footer-wrap .site-below-footer-section-2 {
    color: rgba(255, 255, 255, 0.3) !important;
}

/* Footer widget text */
.site-footer .widget,
.site-footer .widget p,
.site-footer .widget li,
.site-footer .widget a {
    color: var(--snow-white-muted) !important;
}

.site-footer .widget a:hover {
    color: var(--snow-gold) !important;
}

/* Footer headings */
.site-footer .widget-title,
.site-footer h4 {
    color: var(--snow-gold) !important;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: 12px !important;
}


/* ==========================================================================
   5. Scroll-to-Top Button (blue -> gold)
   ========================================================================== */

#ast-scroll-top,
.ast-scroll-top-icon,
a.ast-scroll-top-icon,
.elementor-widget-back-to-top a,
[class*="scroll-top"],
.scroll-to-top {
    background-color: rgba(184, 150, 78, 0.8) !important;
    color: var(--snow-darkest) !important;
    border: 1px solid rgba(184, 150, 78, 0.5) !important;
    border-radius: var(--snow-radius-round) !important;
    width: 44px !important;
    height: 44px !important;
    line-height: 44px !important;
    text-align: center;
    transition: all 0.3s var(--snow-transition) !important;
    box-shadow: var(--snow-shadow-sm);
    z-index: 9999;
}

#ast-scroll-top:hover,
.ast-scroll-top-icon:hover,
a.ast-scroll-top-icon:hover {
    background-color: rgba(184, 150, 78, 1) !important;
    transform: translateY(-3px);
    box-shadow: 0 4px 15px rgba(184, 150, 78, 0.3);
}

#ast-scroll-top svg,
.ast-scroll-top-icon svg {
    fill: var(--snow-darkest) !important;
    color: var(--snow-darkest) !important;
}


/* ==========================================================================
   6. Social Media Icons (blue -> gold)
   ========================================================================== */

.elementor-social-icons-wrapper .elementor-icon,
.elementor-widget-social-icons .elementor-icon,
.elementor-social-icon {
    background-color: transparent !important;
    border: 1.5px solid rgba(184, 150, 78, 0.6) !important;
    color: var(--snow-gold) !important;
    transition: all 0.3s var(--snow-transition) !important;
}

.elementor-social-icons-wrapper .elementor-icon:hover,
.elementor-social-icon:hover {
    background-color: var(--snow-gold-subtle) !important;
    border-color: var(--snow-gold) !important;
    transform: translateY(-2px);
    box-shadow: var(--snow-shadow-gold);
}

.elementor-social-icon i,
.elementor-social-icon svg {
    color: var(--snow-gold) !important;
    fill: var(--snow-gold) !important;
}

.elementor-social-icon:hover i,
.elementor-social-icon:hover svg {
    color: var(--snow-gold-hover) !important;
    fill: var(--snow-gold-hover) !important;
}


/* ==========================================================================
   7. CTA Buttons — Premium Feel
   ========================================================================== */

/* All Elementor buttons */
.elementor-button-wrapper .elementor-button,
.elementor-widget-button .elementor-button {
    padding: 14px 36px !important;
    font-size: 12px !important;
    letter-spacing: 3px !important;
    text-transform: uppercase;
    border: 1.5px solid rgba(184, 150, 78, 0.7) !important;
    transition: all 0.4s var(--snow-transition) !important;
    position: relative;
    overflow: hidden;
}

.elementor-button-wrapper .elementor-button:hover,
.elementor-widget-button .elementor-button:hover {
    background-color: var(--snow-gold-subtle) !important;
    border-color: var(--snow-gold) !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(184, 150, 78, 0.15);
}

/* Button shimmer effect on hover */
.elementor-button-wrapper .elementor-button::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(184, 150, 78, 0.08),
        transparent
    );
    transition: left 0.6s var(--snow-transition);
}

.elementor-button-wrapper .elementor-button:hover::after {
    left: 100%;
}

/* Gold filled button variant — for primary CTAs */
.elementor-button.elementor-button-link[style*="background-color"],
.elementor-widget-button .elementor-button[style*="background"] {
    font-weight: 600 !important;
}


/* ==========================================================================
   8. Contact Form — Dark Inputs, Gold Accents
   ========================================================================== */

/* Input fields */
.wpforms-form input[type="text"],
.wpforms-form input[type="email"],
.wpforms-form input[type="tel"],
.wpforms-form input[type="url"],
.wpforms-form input[type="number"],
.wpforms-form textarea,
.wpforms-form select,
.elementor-form-fields-wrapper input,
.elementor-form-fields-wrapper textarea,
.elementor-form-fields-wrapper select,
.elementor-field-textual {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(184, 150, 78, 0.3) !important;
    color: var(--snow-white) !important;
    padding: 14px 18px !important;
    font-size: 15px !important;
    border-radius: var(--snow-radius-sm) !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
    -webkit-appearance: none;
}

/* Focus state */
.wpforms-form input:focus,
.wpforms-form textarea:focus,
.wpforms-form select:focus,
.elementor-field-textual:focus,
.elementor-form-fields-wrapper input:focus,
.elementor-form-fields-wrapper textarea:focus {
    border-color: var(--snow-gold) !important;
    outline: none !important;
    box-shadow: 0 0 0 1px rgba(184, 150, 78, 0.3) !important;
    background-color: rgba(255, 255, 255, 0.07) !important;
}

/* Labels */
.wpforms-form .wpforms-field-label,
.elementor-field-label {
    color: var(--snow-white-soft) !important;
    letter-spacing: 1px;
    font-size: 12px !important;
    text-transform: uppercase;
    margin-bottom: 8px !important;
}

/* Placeholder text */
::placeholder {
    color: var(--snow-white-faint) !important;
    font-style: italic;
}

::-webkit-input-placeholder {
    color: var(--snow-white-faint) !important;
    font-style: italic;
}

::-moz-placeholder {
    color: var(--snow-white-faint) !important;
    font-style: italic;
}

:-ms-input-placeholder {
    color: var(--snow-white-faint) !important;
    font-style: italic;
}

/* Submit button */
.wpforms-submit,
.elementor-button[type="submit"],
.e-form__buttons__wrapper button,
button.wpforms-submit {
    background-color: var(--snow-gold) !important;
    color: var(--snow-darkest) !important;
    border: none !important;
    padding: 16px 40px !important;
    font-size: 12px !important;
    letter-spacing: 4px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s var(--snow-transition) !important;
    border-radius: var(--snow-radius-sm) !important;
}

.wpforms-submit:hover,
.elementor-button[type="submit"]:hover,
.e-form__buttons__wrapper button:hover {
    background-color: var(--snow-gold-hover) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(184, 150, 78, 0.3);
}

/* Form validation */
.wpforms-error,
.elementor-message-danger {
    color: #e74c3c !important;
    font-size: 13px;
}

.wpforms-confirmation-container-full,
.elementor-message-success {
    background-color: rgba(184, 150, 78, 0.1) !important;
    border: 1px solid rgba(184, 150, 78, 0.3) !important;
    color: var(--snow-gold) !important;
    padding: 20px !important;
    border-radius: var(--snow-radius-md);
}


/* ==========================================================================
   9. Hero Sections — Better Contrast
   ========================================================================== */

/* Hero text shadow for readability */
.elementor-top-section .elementor-heading-title {
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);
}

/* Decorative dividers in hero — slightly transparent */
.elementor-top-section .elementor-divider {
    opacity: 0.7;
}

/* Hero section overlay enhancement */
.elementor-section[data-element_type="section"] > .elementor-background-overlay {
    transition: opacity 0.5s var(--snow-transition);
}

/* Hero subtitle text */
.elementor-top-section .elementor-widget-text-editor {
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.3);
}


/* ==========================================================================
   10. Testimonials & Quotation Marks
   ========================================================================== */

/* Quotation marks — smaller, gold */
.elementor-testimonial-wrapper .elementor-testimonial-content::before,
.elementor-widget-testimonial .elementor-testimonial-content::before {
    color: rgba(184, 150, 78, 0.3) !important;
    font-size: 60px !important;
}

/* Testimonial text */
.elementor-testimonial-content {
    font-style: italic;
    line-height: 1.8 !important;
    color: var(--snow-white-soft) !important;
}

/* Testimonial author name */
.elementor-testimonial-name {
    color: var(--snow-gold) !important;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-size: 12px !important;
}

/* Testimonial job title */
.elementor-testimonial-job {
    color: var(--snow-white-muted) !important;
    font-size: 11px;
    letter-spacing: 1px;
}


/* ==========================================================================
   11. Blog Cards — Premium Styling
   ========================================================================== */

/* Blog post cards */
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single {
    background-color: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(184, 150, 78, 0.1) !important;
    border-radius: var(--snow-radius-md);
    transition: all 0.3s var(--snow-transition);
    padding: 24px !important;
}

.ast-separate-container .ast-article-post:hover {
    border-color: rgba(184, 150, 78, 0.3) !important;
    transform: translateY(-3px);
    box-shadow: var(--snow-shadow-lg);
}

/* Blog entry titles */
.entry-title a {
    color: var(--snow-gold) !important;
    transition: color 0.3s ease;
    text-decoration: none;
}

.entry-title a:hover {
    color: var(--snow-gold-hover) !important;
}

/* Blog meta — date, author, categories */
.entry-meta,
.entry-meta a,
.ast-blog-meta-separator,
.posted-on,
.byline,
.cat-links {
    color: var(--snow-white-muted) !important;
    font-size: 11px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.entry-meta a:hover {
    color: var(--snow-gold) !important;
}

/* Blog read more links */
.ast-read-more-container a,
a.more-link {
    color: var(--snow-gold) !important;
    letter-spacing: 2px;
    font-size: 11px;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(184, 150, 78, 0.3);
    padding-bottom: 2px;
    transition: all 0.3s ease;
    text-decoration: none;
}

.ast-read-more-container a:hover,
a.more-link:hover {
    color: var(--snow-gold-hover) !important;
    border-bottom-color: var(--snow-gold) !important;
}

/* Blog pagination */
.ast-pagination .page-numbers {
    border: 1px solid rgba(184, 150, 78, 0.3) !important;
    color: var(--snow-white-muted) !important;
    transition: all 0.3s ease;
}

.ast-pagination .page-numbers:hover,
.ast-pagination .page-numbers.current {
    background-color: var(--snow-gold) !important;
    color: var(--snow-darkest) !important;
    border-color: var(--snow-gold) !important;
}


/* ==========================================================================
   12. Image Hover Effects — Subtle Luxury Animations
   ========================================================================== */

/* Cat photos hover */
.elementor-widget-image img,
.elementor-widget-image-box img {
    transition: all 0.5s var(--snow-transition) !important;
}

.elementor-widget-image:hover img,
.elementor-widget-image-box:hover img {
    transform: scale(1.03);
    filter: brightness(1.05);
}

/* Gallery images */
.elementor-image-gallery img {
    transition: all 0.4s var(--snow-transition) !important;
    border-radius: var(--snow-radius-sm);
}

.elementor-image-gallery img:hover {
    transform: scale(1.05);
    box-shadow: var(--snow-shadow-md);
}

/* Image boxes — card style */
.elementor-widget-image-box .elementor-image-box-wrapper {
    transition: transform 0.4s var(--snow-transition);
}

.elementor-widget-image-box:hover .elementor-image-box-wrapper {
    transform: translateY(-4px);
}

/* Image box titles */
.elementor-image-box-title {
    color: var(--snow-gold) !important;
    letter-spacing: 1.5px;
}

/* Image box description */
.elementor-image-box-description {
    color: var(--snow-white-muted) !important;
    line-height: 1.7;
}


/* ==========================================================================
   13. Dividers & Decorative Elements
   ========================================================================== */

/* Gold dividers */
.elementor-divider-separator {
    border-color: rgba(184, 150, 78, 0.5) !important;
}

/* Thin gold line separator */
.elementor-widget-divider .elementor-divider-separator {
    border-top-style: solid !important;
}

/* Star / icon dividers */
.elementor-divider__element {
    color: var(--snow-gold) !important;
}

/* Section borders */
.elementor-section {
    border-color: transparent;
}

/* Horizontal rules in content */
hr,
.wp-block-separator {
    border-color: rgba(184, 150, 78, 0.2) !important;
    opacity: 1;
}


/* ==========================================================================
   14. Mobile Header Fix (Critical)
   ========================================================================== */

@media (max-width: 921px) {
    /* Prevent giant vertical gold text */
    .ast-site-identity .site-title,
    .ast-site-identity .site-description,
    .ast-header-stacked .site-header .ast-site-identity {
        text-align: center;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .site-title {
        font-size: 13px !important;
        letter-spacing: 2px !important;
        line-height: 1.4 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 100% !important;
        display: block !important;
        word-break: normal !important;
    }

    .site-title a {
        font-size: 13px !important;
        letter-spacing: 2px !important;
        white-space: nowrap !important;
    }

    /* Hide the tagline on mobile — redundant with header */
    .site-description {
        display: none !important;
    }

    /* Compact header on mobile */
    .ast-site-identity {
        padding: 8px 0 !important;
    }

    /* Mobile menu styling */
    .ast-mobile-popup-drawer .ast-mobile-popup-inner,
    .ast-mobile-header-wrap .ast-mobile-header-content {
        background-color: var(--snow-darkest) !important;
    }

    .ast-mobile-popup-drawer .menu-link,
    .ast-mobile-header-content .menu-link {
        color: var(--snow-white-soft) !important;
        letter-spacing: 2px;
        font-size: 13px !important;
        text-transform: uppercase;
        padding: 12px 20px !important;
        border-bottom: 1px solid rgba(184, 150, 78, 0.1);
    }

    .ast-mobile-popup-drawer .menu-link:hover,
    .ast-mobile-popup-drawer .current-menu-item > .menu-link {
        color: var(--snow-gold) !important;
    }

    /* Mobile menu toggle (hamburger) */
    .ast-mobile-menu-trigger-minimal,
    .ast-button-wrap .ast-mobile-menu-trigger-minimal {
        color: var(--snow-gold) !important;
    }
}


/* ==========================================================================
   15. Mobile Refinements (max-width: 767px)
   ========================================================================== */

@media (max-width: 767px) {
    /* Better section spacing on mobile */
    .elementor-section {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    /* Prevent text overflow */
    .elementor-widget-container {
        overflow-wrap: break-word;
        word-wrap: break-word;
    }

    /* Touch-friendly links and buttons */
    a, button, [role="button"],
    .menu-link,
    input[type="submit"] {
        min-height: 44px;
        min-width: 44px;
    }

    /* Better card text on mobile */
    .elementor-image-box-title {
        letter-spacing: 1px !important;
        font-size: 14px !important;
    }

    /* iOS font size fix — prevent zoom on focus */
    input, textarea, select {
        font-size: 16px !important;
    }

    /* Full width buttons on mobile */
    .elementor-button-wrapper .elementor-button {
        padding: 16px 24px !important;
        width: 100%;
        text-align: center;
        min-height: 52px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Reduce heading sizes on mobile */
    h1, .elementor-size-xxl {
        font-size: 28px !important;
        letter-spacing: 2px !important;
    }

    h2, .elementor-size-xl {
        font-size: 22px !important;
        letter-spacing: 1.5px !important;
    }

    h3, .elementor-size-lg {
        font-size: 18px !important;
    }

    /* Image gallery — single column on small screens */
    .elementor-image-gallery .gallery-item {
        width: 100% !important;
        margin-bottom: 15px;
    }

    /* Blog cards — full width */
    .ast-separate-container .ast-article-post {
        padding: 16px !important;
        margin-bottom: 20px;
    }

    /* Footer mobile spacing */
    .site-footer .widget {
        margin-bottom: 30px !important;
    }

    /* Mobile testimonials */
    .elementor-testimonial-content {
        font-size: 14px !important;
        padding: 0 10px;
    }

    /* Reduce hero text shadow on mobile (performance) */
    .elementor-top-section .elementor-heading-title {
        text-shadow: 0 1px 10px rgba(0, 0, 0, 0.5);
    }

    /* Scroll-to-top — slightly smaller on mobile */
    #ast-scroll-top,
    .ast-scroll-top-icon {
        width: 40px !important;
        height: 40px !important;
        line-height: 40px !important;
        right: 15px !important;
        bottom: 15px !important;
    }
}


/* ==========================================================================
   16. Tablet Adjustments (768px — 1024px)
   ========================================================================== */

@media (min-width: 768px) and (max-width: 1024px) {
    /* Tablet section padding */
    .elementor-section {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }

    /* Tablet heading refinements */
    h1, .elementor-size-xxl {
        font-size: 36px !important;
    }

    h2, .elementor-size-xl {
        font-size: 28px !important;
    }

    /* Gallery — 2 columns on tablet */
    .elementor-image-gallery .gallery-item {
        width: 50% !important;
    }

    /* Buttons — not full width on tablet */
    .elementor-button-wrapper .elementor-button {
        width: auto;
    }
}


/* ==========================================================================
   17. Smooth Scrolling & Performance
   ========================================================================== */

/* GPU-accelerated transforms */
.elementor-widget-image img,
.elementor-widget-image-box img,
.elementor-image-gallery img,
.elementor-button-wrapper .elementor-button,
.elementor-social-icon,
#ast-scroll-top {
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* Lazy loading placeholder */
img[loading="lazy"] {
    background-color: rgba(184, 150, 78, 0.05);
}

/* Smooth section transitions on scroll */
.elementor-section,
.elementor-widget {
    animation-fill-mode: both;
}


/* ==========================================================================
   18. Accessibility — Reduced Motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .elementor-widget-image:hover img,
    .elementor-widget-image-box:hover img,
    .elementor-image-gallery img:hover {
        transform: none !important;
    }

    .elementor-button-wrapper .elementor-button:hover,
    .elementor-social-icon:hover,
    #ast-scroll-top:hover {
        transform: none !important;
    }
}

/* Focus visible — keyboard navigation */
*:focus-visible {
    outline: 2px solid var(--snow-gold) !important;
    outline-offset: 2px !important;
}

/* High contrast mode support */
@media (forced-colors: active) {
    .elementor-button-wrapper .elementor-button {
        border: 2px solid ButtonText !important;
    }
}


/* ==========================================================================
   19. Print Styles
   ========================================================================== */

@media print {
    /* Hide non-essential elements */
    header,
    footer,
    nav,
    .ast-scroll-top-icon,
    #ast-scroll-top,
    .elementor-button-wrapper,
    .wpforms-form,
    .elementor-social-icons-wrapper,
    .ast-mobile-menu-trigger-minimal,
    .ast-mobile-popup-drawer,
    .elementor-background-overlay,
    .site-below-footer-wrap {
        display: none !important;
    }

    /* Clean print layout */
    body {
        background: white !important;
        color: black !important;
        font-size: 12pt;
        line-height: 1.5;
    }

    /* Show URLs after links */
    a[href]::after {
        content: " (" attr(href) ")";
        font-size: 0.8em;
        color: #666;
    }

    /* Don't show URL for internal links */
    a[href^="#"]::after,
    a[href^="javascript"]::after {
        content: "";
    }

    /* Clean headings */
    h1, h2, h3, h4, h5, h6 {
        color: black !important;
        page-break-after: avoid;
    }

    /* Keep images together */
    img {
        max-width: 100% !important;
        page-break-inside: avoid;
    }

    /* Avoid page breaks inside cards */
    .ast-article-post,
    .elementor-widget {
        page-break-inside: avoid;
    }
}


/* ==========================================================================
   20. Additional Polish — Luxury Finishing Touches
   ========================================================================== */

/* Elementor section padding — default generous spacing */
.elementor-section > .elementor-container {
    max-width: 1200px;
}

/* Icon list items — gold bullets */
.elementor-icon-list-icon i,
.elementor-icon-list-icon svg {
    color: var(--snow-gold) !important;
    fill: var(--snow-gold) !important;
    transition: color 0.3s ease;
}

.elementor-icon-list-item:hover .elementor-icon-list-icon i,
.elementor-icon-list-item:hover .elementor-icon-list-icon svg {
    color: var(--snow-gold-hover) !important;
    fill: var(--snow-gold-hover) !important;
}

/* Icon list text */
.elementor-icon-list-text {
    transition: color 0.3s ease;
}

.elementor-icon-list-item:hover .elementor-icon-list-text {
    color: var(--snow-gold) !important;
}

/* Counter / stats widgets */
.elementor-counter-number-wrapper {
    color: var(--snow-gold) !important;
    font-weight: 300 !important;
}

.elementor-counter-title {
    color: var(--snow-white-soft) !important;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: 12px !important;
}

/* Progress bar */
.elementor-progress-bar {
    background-color: var(--snow-gold) !important;
}

.elementor-progress-wrapper {
    background-color: rgba(184, 150, 78, 0.15) !important;
    border-radius: var(--snow-radius-sm) !important;
    overflow: hidden;
}

/* Tabs widget */
.elementor-tab-title {
    color: var(--snow-white-muted) !important;
    letter-spacing: 1.5px;
    transition: color 0.3s ease !important;
}

.elementor-tab-title.elementor-active,
.elementor-tab-title:hover {
    color: var(--snow-gold) !important;
}

.elementor-tab-title.elementor-active::after {
    background-color: var(--snow-gold) !important;
}

/* Accordion widget */
.elementor-accordion .elementor-tab-title {
    border-color: rgba(184, 150, 78, 0.2) !important;
    background-color: transparent !important;
}

.elementor-accordion .elementor-tab-title a {
    color: var(--snow-white-soft) !important;
}

.elementor-accordion .elementor-tab-title.elementor-active a,
.elementor-accordion .elementor-tab-title:hover a {
    color: var(--snow-gold) !important;
}

.elementor-accordion .elementor-tab-content {
    border-color: rgba(184, 150, 78, 0.1) !important;
    color: var(--snow-white-muted) !important;
}

/* Toggle icon */
.elementor-accordion-icon,
.elementor-toggle-icon {
    color: var(--snow-gold) !important;
}

/* WooCommerce integration (if present) */
.woocommerce .price,
.woocommerce-Price-amount {
    color: var(--snow-gold) !important;
}

.woocommerce .button,
.woocommerce a.button {
    background-color: var(--snow-gold) !important;
    color: var(--snow-darkest) !important;
    border: none !important;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: 12px !important;
    transition: all 0.3s var(--snow-transition) !important;
}

.woocommerce .button:hover,
.woocommerce a.button:hover {
    background-color: var(--snow-gold-hover) !important;
    transform: translateY(-2px);
}

/* Breadcrumbs */
.ast-breadcrumbs,
.ast-breadcrumbs a {
    color: var(--snow-white-muted) !important;
    font-size: 11px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.ast-breadcrumbs a:hover {
    color: var(--snow-gold) !important;
}

.ast-breadcrumbs .separator {
    color: rgba(184, 150, 78, 0.4) !important;
}

/* Sidebar widgets */
.widget-area .widget {
    background-color: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(184, 150, 78, 0.1);
    border-radius: var(--snow-radius-md);
    padding: 20px;
    margin-bottom: 20px;
}

.widget-area .widget-title {
    color: var(--snow-gold) !important;
    font-size: 12px !important;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(184, 150, 78, 0.2);
    padding-bottom: 10px;
    margin-bottom: 15px;
}

/* Comments section */
.comments-area {
    border-top: 1px solid rgba(184, 150, 78, 0.2);
    padding-top: 30px;
}

.comment-reply-title,
.comments-title {
    color: var(--snow-gold) !important;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: 14px !important;
}

.comment-body {
    border-bottom: 1px solid rgba(184, 150, 78, 0.1);
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.comment-author .fn {
    color: var(--snow-gold) !important;
}

.comment-metadata a {
    color: var(--snow-white-muted) !important;
    font-size: 11px;
}

/* 404 page */
.error-404 {
    text-align: center;
    padding: 60px 20px;
}

.error-404 .page-title {
    color: var(--snow-gold) !important;
    font-size: 72px !important;
}

/* Scrollbar styling (WebKit) */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: var(--snow-darkest);
}

::-webkit-scrollbar-thumb {
    background: rgba(184, 150, 78, 0.3);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(184, 150, 78, 0.5);
}

/* Firefox scrollbar */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(184, 150, 78, 0.3) var(--snow-darkest);
}
