
.bellis-sticky-header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9998;
    width: 100%;
    min-height: var(--bellis-sticky-height, 70px);
    padding: 8px 18px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
    box-sizing: border-box;
    background: var(--bellis-sticky-bg, #F2D9B4);
    border-bottom: 1px solid rgba(116, 66, 51, 0.12);
    box-shadow: 0 8px 24px rgba(74, 46, 35, 0.12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-100%);
    transition: opacity .22s ease, transform .22s ease, visibility .22s ease;
}

.bellis-sticky-header.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.bellis-sticky-header.is-hidden-by-scroll {
    transform: translateY(-110%);
}


.bellis-sticky-title {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 2;
    max-width: 42vw;
    overflow: hidden;
    color: var(--bellis-sticky-title-color, #744233);
    font-family: var(--bellis-sticky-title-font, "Rastanty Cortez"), cursive;
    font-size: var(--bellis-sticky-title-size, 34px);
    font-weight: var(--bellis-sticky-title-weight, 700);
    line-height: 1;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    transform: translate(-50%, -50%);
}

.bellis-sticky-title:hover,
.bellis-sticky-title:focus {
    color: var(--bellis-sticky-title-color, #744233);
    text-decoration: none;
}

.bellis-sticky-zone {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.bellis-sticky-zone--left {
    justify-content: flex-start;
}

.bellis-sticky-zone--center {
    justify-content: center;
}

.bellis-sticky-zone--right {
    justify-content: flex-end;
}

.bellis-sticky-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    min-height: 44px;
    padding: 5px 9px;
    background: #045C74;
    border-radius: 9px;
    text-decoration: none;
    box-sizing: border-box;
}

.bellis-sticky-logo__image {
    display: block;
    width: auto;
    max-width: 90px;
    max-height: 46px;
    object-fit: contain;
}

.bellis-sticky-logo__text {
    color: #F2D9B4;
    font-family: "Rastanty Cortez", cursive;
    font-size: 1.35rem;
    font-weight: 700;
    white-space: nowrap;
}

.bellis-sticky-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    max-width: 220px;
    padding: 8px 14px;
    color: var(--bellis-action-text, #F2D9B4);
    background: var(--bellis-action-bg, #045C74);
    border: 1px solid var(--bellis-action-border, #045C74);
    border-radius: 8px;
    font-family: "Poppins", sans-serif;
    font-size: .92rem;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    box-sizing: border-box;
    transition: filter .18s ease, box-shadow .18s ease;
}

.bellis-sticky-actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
}

.bellis-sticky-actions .bellis-sticky-action {
    width: 100%;
}

.bellis-sticky-action--outline {
    color: var(--bellis-action-text, #045C74);
    background: transparent;
    border-color: var(--bellis-action-border, #045C74);
}

.bellis-sticky-action--text {
    min-height: 0;
    padding: 6px 8px;
    color: var(--bellis-action-text, #045C74);
    background: transparent;
    border-color: transparent;
}

.bellis-sticky-action:hover,
.bellis-sticky-action:focus {
    color: var(--bellis-action-text, #F2D9B4);
    filter: brightness(1.06);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--bellis-action-border, #045C74) 16%, transparent);
}

.bellis-sticky-action--outline:hover,
.bellis-sticky-action--outline:focus,
.bellis-sticky-action--text:hover,
.bellis-sticky-action--text:focus {
    color: var(--bellis-action-text, #045C74);
}

.bellis-burger {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.bellis-navigation-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.bellis-navigation-action {
    width: var(--bellis-burger-width, 48px);
    height: var(--bellis-burger-height, 44px);
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #744233;
    background: #F2D9B4;
    border: 1px solid color-mix(in srgb, #744233 42%, transparent);
    border-radius: 8px;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
}

.bellis-navigation-icon {
    width: 58%;
    height: 58%;
    fill: none;
    stroke: currentColor;
    stroke-width: var(--bellis-burger-line-height, 3px);
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bellis-navigation-action:hover,
.bellis-navigation-action:focus {
    color: #F2D9B4;
    background: #045C74;
    border-color: #045C74;
}

.bellis-burger__toggle {
    width: var(--bellis-burger-width, 48px);
    height: var(--bellis-burger-height, 44px);
    padding: max(7px, calc(var(--bellis-burger-width, 48px) * .18));
    display: inline-flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: var(--bellis-burger-line-gap, 6px);
    background: var(--bellis-burger-bg, #F2D9B4);
    border: 1px solid color-mix(in srgb, var(--bellis-burger-lines, #744233) 42%, transparent);
    border-radius: var(--bellis-burger-radius, 8px);
    cursor: pointer;
    box-sizing: border-box;
    appearance: none;
    box-shadow: none;
}

.bellis-burger__toggle span {
    display: block;
    width: 100%;
    height: var(--bellis-burger-line-height, 3px);
    flex: 0 0 var(--bellis-burger-line-height, 3px);
    background: var(--bellis-burger-lines, #744233);
    border-radius: 999px;
    transform-origin: center;
    transition: transform .2s ease, opacity .2s ease;
}

.bellis-burger.is-open .bellis-burger__toggle span:nth-child(1) {
    transform: translateY(calc(var(--bellis-burger-line-gap, 6px) + var(--bellis-burger-line-height, 3px))) rotate(45deg);
}

.bellis-burger.is-open .bellis-burger__toggle span:nth-child(2) {
    opacity: 0;
}

.bellis-burger.is-open .bellis-burger__toggle span:nth-child(3) {
    transform: translateY(calc((var(--bellis-burger-line-gap, 6px) + var(--bellis-burger-line-height, 3px)) * -1)) rotate(-45deg);
}

.bellis-burger__panel {
    position: absolute;
    top: calc(100% + 12px);
    left: 0;
    width: max-content;
    min-width: 260px;
    max-width: min(340px, 85vw);
    padding: 10px;
    background: #F2D9B4;
    border: 1px solid rgba(116, 66, 51, 0.2);
    border-radius: 10px;
    box-shadow: 0 12px 28px rgba(74, 46, 35, 0.16);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
    text-align: left;
}

.bellis-sticky-zone--right .bellis-burger__panel {
    left: auto;
    right: 0;
}

.bellis-sticky-zone--center .bellis-burger__panel {
    left: 50%;
    transform: translate(-50%, -6px);
}

.bellis-sticky-zone--center .bellis-burger.is-open .bellis-burger__panel {
    transform: translate(-50%, 0);
}

.bellis-burger.is-open .bellis-burger__panel {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.bellis-burger__panel ul {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
}

.bellis-burger__panel li + li {
    border-top: 1px solid rgba(116, 66, 51, 0.12);
}

.bellis-burger__panel a {
    display: block;
    width: 100%;
    padding: 12px 14px;
    color: #744233;
    font-family: "Poppins", sans-serif;
    font-size: .98rem;
    font-weight: 500;
    line-height: 1.35;
    text-align: left;
    text-decoration: none;
    border-radius: 7px;
    box-sizing: border-box;
}

.bellis-burger__panel a:hover,
.bellis-burger__panel a:focus {
    color: #045C74;
    background: rgba(4, 92, 116, 0.09);
}

@media (max-width: 620px) {
    .bellis-sticky-title {
        max-width: 46vw;
        font-size: min(var(--bellis-sticky-title-size, 34px), 27px);
    }

    .bellis-sticky-action {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bellis-sticky-header,
    .bellis-burger__panel,
    .bellis-burger__toggle span {
        transition: none;
    }
}


/* Menu burger placé dans le header WordPress classique via shortcode */
.bellis-burger-standalone {
    position: relative;
    z-index: 9999;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.bellis-burger-standalone .bellis-navigation-actions {
    margin-left: 8px;
}

.bellis-burger-standalone p {
    margin: 0 !important;
}

.bellis-burger-standalone .bellis-burger__panel {
    z-index: 10000;
}


/* v3.8 — animation discrète et perpétuelle du burger */
@keyframes bellisBurgerInviteTop {
    0%, 100% {
        transform: translateX(0);
        opacity: 1;
    }
    25% {
        transform: translateX(3px);
        opacity: .82;
    }
    50% {
        transform: translateX(-2px);
        opacity: 1;
    }
    75% {
        transform: translateX(2px);
        opacity: .9;
    }
}

@keyframes bellisBurgerInviteMiddle {
    0%, 100% {
        transform: scaleX(1);
        opacity: 1;
    }
    50% {
        transform: scaleX(.72);
        opacity: .78;
    }
}

@keyframes bellisBurgerInviteBottom {
    0%, 100% {
        transform: translateX(0);
        opacity: 1;
    }
    25% {
        transform: translateX(-3px);
        opacity: .82;
    }
    50% {
        transform: translateX(2px);
        opacity: 1;
    }
    75% {
        transform: translateX(-2px);
        opacity: .9;
    }
}

.bellis-burger:not(.is-open) .bellis-burger__toggle span:nth-child(1) {
    animation: bellisBurgerInviteTop 2.8s ease-in-out infinite;
}

.bellis-burger:not(.is-open) .bellis-burger__toggle span:nth-child(2) {
    animation: bellisBurgerInviteMiddle 2.8s ease-in-out infinite;
}

.bellis-burger:not(.is-open) .bellis-burger__toggle span:nth-child(3) {
    animation: bellisBurgerInviteBottom 2.8s ease-in-out infinite;
}

/* L’animation s’arrête à l’ouverture afin de laisser place à la croix. */
.bellis-burger.is-open .bellis-burger__toggle span {
    animation: none !important;
}

@media (prefers-reduced-motion: reduce) {
    .bellis-burger__toggle span {
        animation: none !important;
    }
}
