/* Compass Developments — brand overrides */

:root {
    --black2: #000000;
    --header: #000000;
    --bg: #000000;
}

/* Logo size constraint (original template used auto-scaling SVGs) */
.header-logo img {
    max-height: 55px;
    width: auto;
}

/* Preloader logo wrap */
.preloader img {
    width: auto;
}

/* Footer logo — constrain oversized PNG (SVG would auto-scale; PNG does not) */
.footer-newsletter .content img {
    max-width: 220px;
    height: auto;
}

/* Footer contact address text — plain h4 (not a link) must be white on dark footer */
.footer-wrapper .footer-contact h4,
.footer-wrapper .single-footer-widget .footer-contact h4 {
    color: var(--white);
}

/* CTA section overlays — override orange #F45B1E with Compass red */
.cta-bg-section::before,
.cta-bg-section-5::before {
    background: var(--theme);
}

/* Footer — clip decorative shape images to footer bounds */
.footer-section {
    overflow: hidden;
}

/* Preloader logo — fill the preloader-logo container, preserve aspect ratio */
.preloader-logo img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: none;
    margin: 0 auto;
}

/* Compass reveal preloader */
.preloader {
    --compass-loader-red: #ee2724;
    --compass-loader-size: clamp(176px, 24vw, 260px);
    background: #000;
    isolation: isolate;
    overflow: hidden;
    transition: opacity 0.45s ease, visibility 0.45s ease;
}

.preloader .spinner-wrap {
    z-index: 1;
    width: var(--compass-loader-size);
    height: var(--compass-loader-size);
    border-radius: 50%;
    background: var(--compass-loader-red);
    overflow: hidden;
    transform-origin: center;
    will-change: transform, opacity;
    backface-visibility: hidden;
}

.preloader .spinner-wrap .preloader-logo {
    position: absolute;
    inset: 0;
    transform: none;
    width: 100%;
    height: 100%;
    background: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.preloader .preloader-logo img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
    margin: 0 auto;
}

.preloader .spinner {
    border: 2px solid rgba(255, 255, 255, 0.28);
    border-top: 3px solid #fff;
    border-radius: 50%;
    animation: spin 1.15s infinite linear;
}

.preloader .preloader-reveal-svg {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 0;
    width: 110vmax;
    height: 110vmax;
    display: block;
    opacity: 0;
    overflow: visible;
    pointer-events: none;
    transform: scale(0.24);
    transform-origin: center center;
    shape-rendering: geometricPrecision;
    text-rendering: geometricPrecision;
    will-change: transform, opacity;
}

.preloader .preloader-reveal-shape {
    fill: var(--compass-loader-red);
}

.preloader.has-zoom-reveal.is-revealing {
    background: transparent;
    pointer-events: none;
}

.preloader.has-zoom-reveal.is-revealing .preloader-reveal-svg {
    opacity: 1;
}

.preloader.has-zoom-reveal.is-revealing.is-css-revealing .preloader-reveal-svg {
    animation: compass-inline-window-dive 2.05s cubic-bezier(0.22, 0.78, 0.18, 1) forwards;
}

.preloader.has-zoom-reveal.is-revealing .spinner {
    opacity: 0;
    transition: opacity 0.2s ease;
}

.preloader.has-zoom-reveal.is-revealing .spinner-wrap {
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(1.04);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.preloader.is-hidden {
    opacity: 0;
    visibility: hidden;
}

@keyframes compass-inline-window-dive {
    0% {
        opacity: 0;
        transform: translate3d(-50%, -50%, 0) scale(0.24);
    }
    18% {
        opacity: 1;
        transform: translate3d(-50%, -50%, 0) scale(1);
    }
    52% {
        opacity: 1;
        transform: translate3d(-50%, -50%, 0) scale(2.35);
    }
    100% {
        opacity: 0;
        transform: translate3d(-50%, -50%, 0) scale(5.2);
    }
}

@media (prefers-reduced-motion: reduce) {
    .preloader .spinner,
    .preloader.has-zoom-reveal.is-revealing .preloader-reveal-svg {
        animation: none;
    }
}

/* Marquee scroller — Compass icon must have explicit pixel size (SVG with only viewBox collapses inside flex) */
.scrolling-wrap .cmn-textslide img,
.scrolling-wrap-1 .cmn-textslide img {
    width: 74px;
    height: 74px;
    flex-shrink: 0;
}


/* Partner logos — match original template small partner-strip look + hover */
.brand-section .brand-image img {
    max-height: 70px;
    width: auto;
    max-width: 180px;
    object-fit: contain;
    opacity: 0.7;
    transition: opacity 0.3s ease, transform 0.3s ease;
}
.brand-section .brand-image:hover > img {
    opacity: 1;
    transform: scale(1.05);
}