/* =========================================
   YourMariage — BOUTONS GLOBAUX
   Une seule classe pour tous les CTA principaux
   ========================================= */

:root {
    --ym-btn-bg: #f3ddbd;
    --ym-btn-bg-hover: #efd4ad;
    --ym-btn-text: #141414;
    --ym-btn-border: #c8a15f;
    --ym-btn-border-hover: #b88d49;
    --ym-btn-arrow: #a77c39;
}

.ym-btn-primary {
    min-height: 52px;
    padding: 0 30px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 22px;

    color: var(--ym-btn-text);
    background: var(--ym-btn-bg);
    border: 1.5px solid var(--ym-btn-border);
    border-radius: 999px;

    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.01em;
    text-decoration: none;

    cursor: pointer;

    transition:
        background .25s ease,
        border-color .25s ease,
        transform .25s ease,
        box-shadow .25s ease;
}

.ym-btn-primary:hover {
    color: var(--ym-btn-text);
    background: var(--ym-btn-bg-hover);
    border-color: var(--ym-btn-border-hover);
    transform: translateY(-1px);
    box-shadow: 0 9px 22px rgba(160, 117, 52, .14);
}

.ym-btn-primary span:last-child {
    display: inline-block;
    color: var(--ym-btn-arrow);
    font-size: 22px;
    line-height: 1;
    font-weight: 400;
    transition: transform .25s ease;
}

.ym-btn-primary:hover span:last-child {
    transform: translateX(3px);
}

.ym-btn-primary:focus-visible {
    outline: 2px solid var(--ym-btn-text);
    outline-offset: 3px;
}

@media (max-width: 1320px) {
    .ym-btn-primary {
        min-height: 48px;
        padding-inline: 25px;
        gap: 19px;
        font-size: 17.5px;
    }

    .ym-btn-primary span:last-child {
        font-size: 19px;
    }
}