<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">.motion-slider {
    position: relative;
    width: 100%;
    height: var(--height-mobile, 400px);
    overflow: hidden;
    background: #000;
}

/* Responsive heights */
@media (min-width: 768px) {
    .motion-slider {
        height: var(--height-tablet, 500px);
    }
}

@media (min-width: 1024px) {
    .motion-slider {
        height: var(--height-desktop, 600px);
    }
}

.motion-slider-track {
    position: relative;
    height: 100%;
    width: 100%;
}

.motion-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background-image removed, handled by ::after */
    opacity: 0;
    transition: opacity 0.5s linear;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden; /* Contain the ::after pseudo-element */
    pointer-events: none; /* Make non-current slides non-interactive */
}

.motion-slide::after { /* Pseudo-element for background image */
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: var(--bg-image);
    background-size: cover;
    background-position: center;
    z-index: 0; /* Behind content and overlay */
}

/* Slide Transitions */
.motion-slide.current { /* Use .current for visibility */
    opacity: 1;
    z-index: 2; /* Ensure current slide is above others and potentially the overlay initially */
    pointer-events: auto; /* Make current slide interactive */
}

.motion-slider[data-transition="slide"] .motion-slide {
    /* transform: translateX(100%); */ /* Rely on JS to set initial/reset positions */
    opacity: 1; /* Slides should be opaque during transition */
    transition: transform 0.5s ease-in-out;
}

.motion-slider[data-transition="slide"] .motion-slide.current { /* Use .current */
    transform: translateX(0);
}

/* Ken Burns Effect (Animation Definition) */
@keyframes kenburns-dynamic {
    0% {
        transform: scale(var(--kb-start-scale, 1)) translate(var(--kb-start-tx, 0), var(--kb-start-ty, 0));
    }
    100% {
        transform: scale(var(--kb-end-scale, 1.1)) translate(var(--kb-end-tx, 0), var(--kb-end-ty, 0));
    }
}

/* Apply Ken Burns Animation - Use .kb-animate class */
.motion-slider[data-transition="kenburns"] .motion-slide.kb-animate::after { 
    transform: scale(var(--kb-start-scale, 1)) translate(var(--kb-start-tx, 0px), var(--kb-start-ty, 0px));
    animation-name: kenburns-dynamic;
    animation-duration: var(--kb-duration, 5000ms);
    animation-timing-function: linear;
    animation-fill-mode: forwards;
    will-change: transform;
}

/* Ensure default opacity transition isn't overridden for Ken Burns */
.motion-slider[data-transition="kenburns"] .motion-slide {
     /* No transition: none; here */
     /* Ensure base opacity transition applies */
}

/* Slide content */
.motion-slide-content {
    position: relative;
    width: 100%; /* Allow it to take full width of parent initially */
    max-width: min(800px, calc(100% - 132px)); /* Primary width constraint */
    padding: 2rem;
    margin-left: auto; /* Center the block */
    margin-right: auto; /* Center the block */
    text-align: center;
    color: #fff;
    z-index: 2; /* Ensure content is above slide overlay */
    background-color: rgba(0, 0, 0, 0.2);  /* #00000033 */
    border-radius: 10px;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

/* Show content only when slide is current */
.motion-slider .motion-slide.current .motion-slide-content {
    opacity: 1;
    /* transition: none; */ /* Let transition apply */
}

.motion-slide::before { /* Dark overlay */
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1; /* Ensure overlay is above background pseudo-element */
}

h2.motion-slide-title {
    font-size: 2.5rem;
    margin: 0 0 1rem;
    line-height: 1.2;
    color: #fff !important;  /* Ensure title is white */
}

.motion-slide-text {
    font-size: 1.125rem;
    margin-bottom: 1.5rem;
    line-height: 1.6;
}

.motion-slide-button {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    background: #fff;
    color: #000;
    text-decoration: none;
    border-radius: 4px;
    transition: background-color 0.3s, color 0.3s;
}

.motion-slide-button:hover {
    background: #000;
    color: #fff;
}

/* Button Styling */
.motion-slide-buttons-wrap {
    display: flex;
    flex-wrap: wrap; /* Allow buttons to wrap on smaller screens */
    gap: 1rem; /* Space between buttons */
    justify-content: center; /* Default alignment */
    margin-top: 1.5rem; /* Space above the button group */
}

/* Content Alignment adjustments */
.motion-slide.content-align-left .motion-slide-content {
    text-align: left;
}
.motion-slide.content-align-left .motion-slide-buttons-wrap {
    justify-content: flex-start;
}

.motion-slide.content-align-right .motion-slide-content {
    text-align: right;
}
.motion-slide.content-align-right .motion-slide-buttons-wrap {
    justify-content: flex-end;
}

/* Navigation arrows - Base styles */
.motion-slider-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border: none;
    cursor: pointer;
    z-index: 11; /* Increased to be above global content */
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #333;
}

.motion-slider-nav.prev {
    left: 20px;
}

.motion-slider-nav.next {
    right: 20px;
}

/* Arrow Style: White Circle */
.motion-slider-nav.arrow-style-white-circle {
    background: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    color: #333;
}

.motion-slider-nav.arrow-style-white-circle:hover {
    background: rgba(255, 255, 255, 1);
}

.motion-slider-nav.arrow-style-white-circle .motion-arrow-icon {
    width: 16px;
    height: 16px;
}

/* Arrow Style: Dark Circle */
.motion-slider-nav.arrow-style-dark-circle {
    background: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    color: #fff;
}

.motion-slider-nav.arrow-style-dark-circle:hover {
    background: rgba(0, 0, 0, 0.8);
}

.motion-slider-nav.arrow-style-dark-circle .motion-arrow-icon {
    width: 16px;
    height: 16px;
}

/* Arrow Style: Arrow Only */
.motion-slider-nav.arrow-style-arrow-only {
    background: transparent;
    border-radius: 0;
    width: 100px;
    height: 100px;
    color: rgba(255, 255, 255, 0.7);
}

.motion-slider-nav.arrow-style-arrow-only:hover {
    color: rgba(255, 255, 255, 0.9);
}

.motion-slider-nav.arrow-style-arrow-only .motion-arrow-icon {
    width: 64px;
    height: 64px;
}

/* Hide until hover functionality */
.motion-slider-nav.hide-until-hover {
    opacity: 0;
    visibility: hidden;
}

.motion-slider:hover .motion-slider-nav.hide-until-hover {
    opacity: 1;
    visibility: visible;
}

/* Navigation dots */
.motion-slider-dots {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 2;
}

.motion-slider-dot {
    width: 12px;
    height: 12px;
    border: 2px solid #fff;
    border-radius: 50%;
    padding: 0;
    background: transparent;
    cursor: pointer;
    transition: background-color 0.3s;
}

.motion-slider-dot:hover {
    background: rgba(255, 255, 255, 0.5);
}

.motion-slider-dot.active {
    background: #fff;
}

/* Tablet Overrides */
@media (min-width: 768px) { /* Was Tablet Overrides, now primarily for responsive height and other general tablet+ styles */
    .motion-slider {
        height: var(--height-tablet, 500px);
    }

    /* REMOVED: max-width rule for .motion-slide-content and .motion-global-content
       as it's now part of the base style. 
       Other tablet-specific rules can remain if needed. 
    */
    /* 
    .motion-slide-content,
    .motion-global-content {
        max-width: min(800px, calc(100% - 132px)); 
    }
    */
}

@media (min-width: 1024px) {
    .motion-slider {
        height: var(--height-desktop, 600px);
    }
    /* Desktop arrow offsets are 20px, covered by the 132px calc in min-width: 768px rule */
}

/* Mobile optimizations */
@media (max-width: 767px) {
    /* Adjust slide layout to push content up */
    .motion-slide {
        align-items: flex-start; /* Align content to top */
        padding-top: 1rem; /* Add some space from top */
        padding-bottom: 70px; /* Create space at bottom for nav */
    }

    .motion-slide-title,
    h2.motion-global-title { /* Target both titles */
        font-size: 1.5rem; /* Reduce further */
    }

    .motion-slide-text {
        font-size: 1rem;
    }

    .motion-slider-nav {
        width: 36px;
        height: 36px;
        /* Reposition arrows to bottom corners */
        top: auto;
        bottom: 15px; 
        transform: none;
        font-size: 14px;
    }
    
    .motion-slider-nav.arrow-style-arrow-only {
        width: 80px;
        height: 80px;
    }
    
    .motion-slider-nav.arrow-style-arrow-only .motion-arrow-icon {
        width: 48px;
        height: 48px;
    }
    
    .motion-slider-nav.arrow-style-white-circle .motion-arrow-icon,
    .motion-slider-nav.arrow-style-dark-circle .motion-arrow-icon {
        width: 14px;
        height: 14px;
    }
    
    .motion-slider-nav.prev {
        left: 15px; 
    }
    .motion-slider-nav.next {
        right: 15px; 
    }

    .motion-slider-dots {
        /* Keep dots centered at bottom */
        bottom: 15px; 
        /* Adjust gap if needed */
         gap: 8px; 
    }

    /* Reduce button size on mobile */
    .motion-slide-button,
    .motion-global-button { /* Target both buttons */
        padding: 0.5rem 1.25rem; /* Reduce padding */
        font-size: 0.9rem; /* Optionally reduce font size slightly */
    }

    /* Remove padding from slider bottom */
    .motion-slider {
        /* padding-bottom: 60px; */ /* REMOVED */
        height: var(--height-mobile, 400px); /* Slightly increase height? Optional */
    }

    /* Reset content width and ensure it respects padding */
    .motion-slide-content,
    .motion-global-content {
         /* max-width: calc(100% - 2rem); */ /* This is covered by base style width + max-width */
         /* margin-bottom: 0; */ /* Base style has auto margins for centering, mb 0 might be okay if not centered */
    }

    .motion-slide-content {
        padding: 1em;
        max-height: 100%; /* Limit height to available space */
        overflow-y: auto; /* Add scrollbar if needed */
        /* Scrollbar Styling (Firefox) */
        scrollbar-width: thin;
        scrollbar-color: rgba(255, 255, 255, 0.5) rgba(0, 0, 0, 0.2); /* thumb track */
        /* border-bottom: 2px solid rgba(255, 255, 255, 0.5); */ /* REMOVED direct border */
    }
    /* Apply border only when scrollable */
    .motion-slide-content.is-scrollable {
         border-bottom: 2px solid rgba(255, 255, 255, 0.5);
    }

    /* Scrollbar Styling (Webkit) - Moved outside */
    .motion-slide-content::-webkit-scrollbar {
        width: 8px;
    }
    .motion-slide-content::-webkit-scrollbar-track {
        background: rgba(0, 0, 0, 0.2); 
        border-radius: 4px;
    }
    .motion-slide-content::-webkit-scrollbar-thumb {
        background-color: rgba(255, 255, 255, 0.5);
        border-radius: 4px;
        border: 2px solid transparent; /* Optional padding around thumb */
        background-clip: content-box; /* Ensure border doesn't make thumb thicker */
    }

    .motion-slide-content h2.motion-slide-title {
        font-size: 2rem;
        margin-bottom: 1rem;
    }

    /* Adjust global content positioning */
    .motion-global-content {
        top: 2rem; /* Position from top */
        transform: translateX(-50%); /* Only horizontal centering */
    }

    /* REMOVE commented out gradient block */
    /* 
    .motion-slide.has-scroll-hint::after { ... } 
    */
}

/* Global Content Layer Styling */
.motion-global-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%; /* Allow it to take full width of parent initially */
    max-width: min(800px, calc(100% - 172px)); /* Primary width constraint */
    padding: 2rem;
    /* Centering is handled by transform */
    color: #fff;
    background-color: rgba(0, 0, 0, 0.2); /* Same as slide content */
    border-radius: 10px; /* Same as slide content */
    z-index: 10;
    text-align: center;
}

.motion-global-content::before { /* Optional overlay, if needed */
    /* Similar to .motion-slide::before if desired */
}

/* Alignment for Global Content */
.motion-global-content.content-align-left {
    text-align: left;
}
.motion-global-content.content-align-left .motion-global-buttons-wrap {
    justify-content: flex-start;
}
.motion-global-content.content-align-right {
    text-align: right;
}
.motion-global-content.content-align-right .motion-global-buttons-wrap {
    justify-content: flex-end;
}

/* Styling for elements inside global content */
h2.motion-global-title {
    font-size: 2.5rem; /* Match slide title */
    margin: 0 0 1rem;
    line-height: 1.2;
    color: #fff !important; 
}

.motion-global-text {
    font-size: 1.125rem; /* Match slide text */
    margin-bottom: 0; /* Removed bottom margin */
    line-height: 1.6;
}

.motion-global-buttons-wrap {
    display: flex;
    flex-wrap: wrap; 
    gap: 1rem; 
    justify-content: center; /* Default */
    margin-top: 1.5rem; 
}

.motion-global-button {
    /* Inherit from .motion-slide-button or define separately */
    display: inline-block;
    padding: 0.75rem 1.5rem;
    background: #fff;
    color: #000;
    text-decoration: none;
    border-radius: 4px;
    transition: background-color 0.3s, color 0.3s;
}

.motion-global-button:hover {
    background: #000;
    color: #fff;
}

/* Video Background Styling */
.motion-video-bg-wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0; /* Behind slides/content */
    background: #000; /* Fallback */
}

.motion-video-bg-wrap iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 100%;
    min-height: 100%;
    /* For 16:9 aspect ratio, make width 177.77% of viewport height */
    /* and height 56.25% of viewport width. This forces the iframe to be large enough. */
    /* The min-width/min-height ensure it's at least the container size, */
    /* and the overflow:hidden on the parent clips the excess. */
    width: 177.77vh; /* 100vh * 16/9 */
    height: 56.25vw; /* 100vw * 9/16 */
}
.elementor iframe {
    max-width: none;
}

/* Ensure slides have no background when video is active */
.motion-slider.has-video-bg .motion-slide {
    background: transparent;
}
.motion-slider.has-video-bg .motion-slide::after {
    background-image: none !important; /* Override --bg-image if set */
    background: transparent;
}

/* Hide the ::before overlay when video is active */
.motion-slider.has-video-bg .motion-slide::before {
    display: none;
}

/* Video fallback for iOS devices when autoplay fails */
.motion-video-fallback {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    z-index: 1;
}

/* Add a subtle play button overlay for video fallback */
.motion-video-fallback::after {
    content: 'â–¶';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 4rem;
    color: rgba(255, 255, 255, 0.8);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    pointer-events: none;
}

/* Full width and wide alignment styling */
.motion-slider.alignfull {
    width: 100vw;
    max-width: 100vw; /* Ensure it overrides other max-widths */
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

/* For alignwide, themes usually handle this. If specific override is needed:
.motion-slider.alignwide {
    max-width: var(--wp--style--global--wide-size, 1000px); 
    margin-left: auto;
    margin-right: auto;
}
*/

/* Old caption styling removed - captions now appear below slider */

/* Mobile caption adjustments */
@media (max-width: 767px) {
    /* Old caption adjustments removed - captions now below slider */
}

/* Elementor Content Width Options */
.motion-slider-width-content .motion-slider {
    width: 100%;
    max-width: var(--wp--style--global--wide-size, 1200px);
    margin-left: auto;
    margin-right: auto;
}

.motion-slider-width-full .motion-slider {
    width: 100vw;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.motion-slider-width-full &gt; .elementor-widget-container {
    max-width: none; /* Override potential max-width from Elementor on the container */
}

/* Captions below slider */
.motion-slider-with-captions {
    /* Container for slider + caption area */
}

.motion-slider-captions {
    position: relative;
    min-height: 20px; /* Reserve space even when empty */
    padding: 10px 0;
    text-align: center;
}

.motion-slide-caption {
    display: none; /* Hide all captions by default */
    xcolor: #333;
    font-size: 0.95rem;
    line-height: 1.4;
    padding: 0 20px;
    margin: 0;
}

/* Show only the current slide's caption */
.motion-slide-caption.current {
    display: block;
    opacity: 1;
    animation: motion-caption-fade-in 0.3s ease-in-out;
}

/* Fade-in animation for captions */
@keyframes motion-caption-fade-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Mobile caption adjustments */
@media (max-width: 767px) {
    .motion-slide-caption {
        font-size: 0.85rem;
        padding: 0 15px;
    }
    
    .motion-slider-captions {
        padding: 8px 0;
    }
}

/* Container-width-based responsive styles (replaces viewport-based media queries) */
.motion-slider.motion-narrow {
    /* Narrow slider styles - equivalent to mobile layout */
}

.motion-slider.motion-narrow .motion-slide {
    align-items: flex-start; /* Align content to top */
    padding-top: 1rem; /* Add some space from top */
    padding-bottom: 70px; /* Create space at bottom for nav */
}

.motion-slider.motion-narrow .motion-slide-title,
.motion-slider.motion-narrow h2.motion-global-title {
    font-size: 1.5rem; /* Reduce further */
}

.motion-slider.motion-narrow .motion-slide-text {
    font-size: 1rem;
}

.motion-slider.motion-narrow .motion-slider-nav {
    width: 36px;
    height: 36px;
    /* Reposition arrows to bottom corners */
    top: auto;
    bottom: 15px; 
    transform: none;
    font-size: 14px;
}

.motion-slider.motion-narrow .motion-slider-nav.arrow-style-arrow-only {
    width: 80px;
    height: 80px;
}

.motion-slider.motion-narrow .motion-slider-nav.arrow-style-arrow-only .motion-arrow-icon {
    width: 48px;
    height: 48px;
}

.motion-slider.motion-narrow .motion-slider-nav.arrow-style-white-circle .motion-arrow-icon,
.motion-slider.motion-narrow .motion-slider-nav.arrow-style-dark-circle .motion-arrow-icon {
    width: 14px;
    height: 14px;
}

.motion-slider.motion-narrow .motion-slider-nav.prev {
    left: 15px; 
}

.motion-slider.motion-narrow .motion-slider-nav.next {
    right: 15px; 
}

.motion-slider.motion-narrow .motion-slider-dots {
    /* Keep dots centered at bottom */
    bottom: 15px; 
    /* Adjust gap if needed */
    gap: 8px; 
}

/* Reduce button size on narrow sliders */
.motion-slider.motion-narrow .motion-slide-button,
.motion-slider.motion-narrow .motion-global-button {
    padding: 0.5rem 1.25rem; /* Reduce padding */
    font-size: 0.9rem; /* Optionally reduce font size slightly */
}

.motion-slider.motion-narrow .motion-slide-content {
    padding: 1.5rem; /* Reduced from 2rem */
    max-width: 90%; /* Increased from default constraint */
    max-height: 100%; /* Limit height to available space */
    overflow-y: auto; /* Add scrollbar if needed */
    /* Scrollbar Styling (Firefox) */
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.5) rgba(0, 0, 0, 0.2); /* thumb track */
}

/* Apply border only when scrollable */
.motion-slider.motion-narrow .motion-slide-content.is-scrollable {
    border-bottom: 2px solid rgba(255, 255, 255, 0.5);
}

/* Scrollbar Styling (Webkit) */
.motion-slider.motion-narrow .motion-slide-content::-webkit-scrollbar {
    width: 8px;
}

.motion-slider.motion-narrow .motion-slide-content::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2); 
    border-radius: 4px;
}

.motion-slider.motion-narrow .motion-slide-content::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 4px;
    border: 2px solid transparent; /* Optional padding around thumb */
    background-clip: content-box; /* Ensure border doesn't make thumb thicker */
}

.motion-slider.motion-narrow .motion-slide-content h2.motion-slide-title {
    font-size: 2rem;
    margin-bottom: 1rem;
}

/* Adjust global content positioning for narrow sliders */
.motion-slider.motion-narrow .motion-global-content {
    top: 2rem; /* Position from top */
    transform: translateX(-50%); /* Only horizontal centering */
    padding: 1.5rem; /* Reduced from 2rem */
    max-width: 90%; /* Increased from default constraint */
}

/* Medium slider adjustments */
.motion-slider.motion-medium .motion-slide-title,
.motion-slider.motion-medium h2.motion-global-title {
    font-size: 2rem; /* Slightly smaller than wide */
}

.motion-slider.motion-medium .motion-slide-text {
    font-size: 1.05rem;
}

/* Wide slider styles (default/desktop) */
.motion-slider.motion-wide .motion-slide-title,
.motion-slider.motion-wide h2.motion-global-title {
    font-size: 2.5rem; /* Full size */
}

.motion-slider.motion-wide .motion-slide-text {
    font-size: 1.125rem;
} </pre></body></html>