/**
 * Zaoui Dot Com — Logo animé
 *
 * Sizing responsive et hover desktop.
 * L'animation .is-active est définie dans le SVG inline (transitions, état ouvert).
 * Le hover desktop est géré ici via breakpoint (min-width: 769px).
 *
 * @package ZaouiDotCom
 * @since   2.5.0
 */

/* =========================================================================
   WRAPPER LOGO
   ========================================================================= */

.site-logo.zaoui-logo {
    display: block;
    width: clamp(260px, 28vw, 500px);
    max-width: 100%;
    line-height: 0;
    text-decoration: none;
    flex-shrink: 0;
}

.site-logo.zaoui-logo .zaoui-logo-svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}

/* =========================================================================
   DESKTOP >= 769px — hover souris
   !important pour gagner sur le <style> interne du SVG
   ========================================================================= */

@media (min-width: 769px) {
    .site-logo.zaoui-logo {
        width: clamp(320px, 30vw, 520px);
    }

    .site-logo.zaoui-logo:hover .zaoui-logo-svg .zaoui-reveal-mask {
        width: 760px !important;
    }

    .site-logo.zaoui-logo:hover .zaoui-logo-svg .zaoui-dot-mover {
        transform: translate(1150px, 234.8px) !important;
    }

    .site-logo.zaoui-logo:hover .zaoui-logo-svg .zaoui-dot-spinner {
        transform: rotate(720deg) !important;
    }
}

/* Réduit le padding-bottom du header pour compenser la hauteur du SVG */
.zdot-header__inner {
    padding-bottom: 0.25rem;
}

/* =========================================================================
   MOBILE <= 768px — sizing contraint, tap UX
   ========================================================================= */

@media (max-width: 768px) {
    .site-logo.zaoui-logo {
        width: min(230px, 62vw);
        max-width: 100%;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
    }

    .site-logo.zaoui-logo .zaoui-logo-svg {
        max-width: 100%;
    }
}

/* =========================================================================
   ACCESSIBILITÉ — mouvement réduit
   ========================================================================= */

@media (prefers-reduced-motion: reduce) {
    .site-logo.zaoui-logo .zaoui-reveal-mask,
    .site-logo.zaoui-logo .zaoui-dot-mover,
    .site-logo.zaoui-logo .zaoui-dot-spinner {
        transition: none !important;
    }
}