/* Bulb product cards: a quiet product front, a tangible information back. */
.bfl-flip-card {
    --bfl-card-ink: #3f3f3f;
    --bfl-card-slate: #45545f;
    --bfl-card-blue: #c2d0dd;
    --bfl-card-radius: 16px;
    --bfl-card-space: clamp(16px, 2vw, 24px);
    position: relative;
    min-width: 0;
    perspective: 1200px;
    isolation: isolate;
    container: bfl-product-card / inline-size;
    color: var(--bfl-card-ink);
    text-align: center;
    /* Keep the theme's fade-in, without animating responsive widths or heights. */
    transition-property: opacity !important;
}
.bfl-flip-card, .bfl-flip-card * { box-sizing: border-box; }
.bfl-flip-card .bfl-flip-card__stage {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    min-width: 0;
    transform-style: preserve-3d;
    transition: transform .7s ease-in-out;
}
.bfl-flip-card.is-flipped .bfl-flip-card__stage { transform: rotateY(-180deg); }
.bfl-flip-card.is-flipped { z-index: 20; }
.bfl-flip-card .bfl-flip-card__face {
    grid-area: 1 / 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    min-width: 0;
    min-height: 450px;
    padding: var(--bfl-card-space);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    overflow-wrap: anywhere;
}
.bfl-flip-card .bfl-flip-card__front {
    position: relative;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    transform: rotateY(0deg);
}
.bfl-flip-card .bfl-flip-card__back {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    background: var(--bfl-card-blue);
    border: 0;
    border-radius: var(--bfl-card-radius);
    box-shadow: none;
    color: var(--bfl-card-ink);
    transform: rotateY(180deg);
}
.bfl-flip-card .bfl-flip-card__media {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: clamp(180px, 22vw, 270px);
    margin: 0;
    flex: 0 0 auto;
    background: transparent;
    border: 0;
    box-shadow: none;
}
.bfl-flip-card .bfl-flip-card__media a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}
.bfl-flip-card .bfl-flip-card__image,
.bfl-flip-card .bfl-flip-card__media img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 280px;
    max-height: 270px;
    margin: 0 auto;
    object-fit: contain;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    transform: none;
}
.bfl-flip-card .bfl-flip-card__summary,
.bfl-flip-card .bfl-flip-card__header {
    position: relative;
    width: 100%;
    min-width: 0;
    text-align: center;
}
.bfl-flip-card .bfl-flip-card__summary {
    display: grid;
    grid-template-rows: minmax(min-content, var(--bfl-row-eyebrow, auto)) minmax(min-content, var(--bfl-row-title, auto)) minmax(min-content, var(--bfl-row-slogan, auto));
    row-gap: 8px;
    align-content: start;
}
.bfl-flip-card .bfl-flip-card__summary > * {
    align-self: start;
    width: 100%;
    margin: 0;
}
.bfl-flip-card .bfl-flip-card__summary > .bfl-flip-card__eyebrow { grid-row: 1; }
.bfl-flip-card .bfl-flip-card__summary > .bfl-flip-card__title { grid-row: 2; }
.bfl-flip-card .bfl-flip-card__summary > .bfl-flip-card__slogan { grid-row: 3; }
.bfl-flip-card .bfl-flip-card__header { padding-top: 18px; }
.bfl-flip-card .bfl-flip-card__eyebrow {
    display: block;
    margin: 0 0 8px;
    color: var(--bfl-card-slate);
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}
.bfl-flip-card .bfl-flip-card__title,
.bfl-flip-card .bfl-flip-card__title a {
    margin: 0;
    color: var(--bfl-card-ink);
    font-family: 'Montserrat', sans-serif;
    font-size: 22px;
    font-weight: 400;
    line-height: 1.35;
    letter-spacing: 1px;
    text-align: center;
    text-decoration: none;
    text-transform: none;
}
.bfl-flip-card .bfl-flip-card__title a:hover { color: var(--bfl-card-slate); }
.bfl-flip-card .bfl-flip-card__slogan,
.bfl-flip-card .bfl-flip-card__benefits,
.bfl-flip-card .bfl-flip-card__benefits p {
    margin: 9px 0 0;
    color: var(--bfl-card-slate);
    font-family: 'Lato', sans-serif;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.45;
    letter-spacing: normal;
    text-align: center;
}
.bfl-flip-card .bfl-flip-card__benefits {
    width: 100%;
    margin: auto 0;
    flex: 0 0 auto;
}
.bfl-flip-card .bfl-flip-card__benefit-list,
body #main .products .bfl-flip-card .bfl-flip-card__benefit-list {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}
.bfl-flip-card .bfl-flip-card__benefit-list > .bfl-flip-card__benefit,
body #main .products .bfl-flip-card .bfl-flip-card__benefit-list > .bfl-flip-card__benefit {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: start;
    gap: 11px;
    float: none;
    clear: none;
    width: 100% !important;
    min-width: 0;
    min-height: 0;
    height: auto;
    margin: 0 !important;
    padding: 14px 0 !important;
    border: 0;
    border-bottom: 1px solid rgb(69 84 95 / 24%);
    background: transparent;
    color: var(--bfl-card-ink);
    font-family: 'Lato', sans-serif;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.45;
    letter-spacing: normal;
    text-align: left;
    list-style: none;
}
.bfl-flip-card .bfl-flip-card__benefit-list > .bfl-flip-card__benefit:last-child,
body #main .products .bfl-flip-card .bfl-flip-card__benefit-list > .bfl-flip-card__benefit:last-child { border-bottom: 0; }
.bfl-flip-card .bfl-flip-card__benefit > svg {
    width: 24px;
    height: 24px;
    margin-top: 1px;
    color: var(--bfl-card-slate);
    flex: 0 0 auto;
}
.bfl-flip-card .bfl-flip-card__footer {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: 100%;
    min-height: 44px;
    margin-top: auto;
    flex: 0 0 auto;
}
.bfl-flip-card .bfl-flip-card__back .bfl-flip-card__footer {
    padding-top: 20px;
    border-top: 1px solid rgb(69 84 95 / 24%);
}
.bfl-flip-card .bfl-flip-card__price,
.bfl-flip-card .bfl-flip-card__price .amount,
.bfl-flip-card .bfl-flip-card__price bdi,
.bfl-flip-card .bfl-flip-card__price .woocommerce-Price-currencySymbol {
    display: inline;
    margin: 0;
    color: var(--bfl-card-slate);
    font-family: 'Lato', sans-serif;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: normal;
}
.bfl-flip-card .bfl-flip-card__price del { color: var(--bfl-card-slate); opacity: .65; }
.bfl-flip-card .bfl-flip-card__price ins { background: transparent; text-decoration: none; }
.bfl-flip-card .bfl-flip-card__price .amount { white-space: nowrap; }
.bfl-flip-card .bfl-flip-card__toggle,
.bfl-flip-card .bfl-flip-card__close {
    all: unset;
    box-sizing: border-box;
    position: absolute;
    display: none;
    align-items: center;
    justify-content: center;
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 10px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    box-shadow: none;
    color: var(--bfl-card-slate);
    cursor: pointer;
    line-height: 0;
    -webkit-tap-highlight-color: transparent;
}
.bfl-flip-card.is-enhanced .bfl-flip-card__toggle,
.bfl-flip-card.is-enhanced .bfl-flip-card__close { display: flex; }
.bfl-flip-card .bfl-flip-card__toggle {
    right: -6px;
    bottom: 0;
    width: auto;
    max-width: 100%;
    padding: 0 4px;
    border-radius: 3px;
    font-family: 'Lato', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: normal;
    text-align: center;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.bfl-flip-card .bfl-flip-card__close { top: -15px; right: -15px; }
.bfl-flip-card .bfl-flip-card__toggle svg,
.bfl-flip-card .bfl-flip-card__close svg { display: block; width: 24px; height: 24px; flex: 0 0 24px; stroke-width: 1.6; }
.bfl-flip-card .bfl-flip-card__toggle:hover,
.bfl-flip-card .bfl-flip-card__close:hover { background: rgb(69 84 95 / 8%); color: var(--bfl-card-ink); }
.bfl-flip-card .bfl-flip-card__link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    min-height: 48px;
    padding: 14px 16px;
    border: 1px solid #fff;
    border-radius: 35px;
    background: #fff;
    box-shadow: none;
    color: var(--bfl-card-slate);
    font-family: 'Montserrat', sans-serif;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 1px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.bfl-flip-card .bfl-flip-card__link svg { width: 20px; height: 20px; flex: 0 0 auto; }
.bfl-flip-card .bfl-flip-card__link:hover { border-color: var(--bfl-card-slate); background: var(--bfl-card-slate); color: #fff; }
.bfl-flip-card a:focus-visible,
.bfl-flip-card button:focus-visible { outline: 2px solid var(--bfl-card-slate); outline-offset: 4px; }
.bfl-flip-card .bfl-flip-card__media a:focus-visible { outline-offset: 0; }
.bestsellers-grid > .bfl-flip-card { width: 100% !important; margin: 0 !important; padding: 0; }
/* Old archive selectors match every nested li; only product cards retain gutters. */
body #main .cell li.bfl-flip-card { padding-top: 0 !important; }
@media (max-width: 900px) {
    .bfl-flip-card .bfl-flip-card__face { min-height: 410px; gap: 16px; }
    .bfl-flip-card .bfl-flip-card__title,
    .bfl-flip-card .bfl-flip-card__title a { font-size: 20px; }
}
@media (max-width: 767px) {
    .bfl-flip-card { --bfl-card-space: 14px; --bfl-card-radius: 14px; }
    .bfl-flip-card .bfl-flip-card__face { min-height: 370px; gap: 14px; }
    .bfl-flip-card .bfl-flip-card__media { height: clamp(140px, 38vw, 200px); }
    .bfl-flip-card .bfl-flip-card__image,
    .bfl-flip-card .bfl-flip-card__media img { max-height: 200px; }
    .bfl-flip-card .bfl-flip-card__eyebrow { margin-bottom: 6px; font-size: 9px; letter-spacing: 1px; }
    .bfl-flip-card .bfl-flip-card__title,
    .bfl-flip-card .bfl-flip-card__title a { font-size: 17px; letter-spacing: .5px; }
    .bfl-flip-card .bfl-flip-card__slogan,
    .bfl-flip-card .bfl-flip-card__benefits,
    .bfl-flip-card .bfl-flip-card__benefits p { font-size: 15px; }
    .bfl-flip-card .bfl-flip-card__benefit-list > .bfl-flip-card__benefit,
    body #main .products .bfl-flip-card .bfl-flip-card__benefit-list > .bfl-flip-card__benefit {
        grid-template-columns: 20px minmax(0, 1fr); gap: 8px; padding: 12px 0 !important; font-size: 15px;
    }
    .bfl-flip-card .bfl-flip-card__benefit > svg { width: 20px; height: 20px; }
    .bfl-flip-card .bfl-flip-card__price,
    .bfl-flip-card .bfl-flip-card__price .amount,
    .bfl-flip-card .bfl-flip-card__price bdi,
    .bfl-flip-card .bfl-flip-card__price .woocommerce-Price-currencySymbol { font-size: 19px; }
    .bfl-flip-card .bfl-flip-card__link { gap: 6px; padding: 12px 9px; font-size: 10px; letter-spacing: .5px; }
    .bfl-flip-card .bfl-flip-card__close { top: -12px; right: -12px; }
}
@media (max-width: 400px) {
    .bfl-flip-card { --bfl-card-space: 11px; }
    .bfl-flip-card .bfl-flip-card__title,
    .bfl-flip-card .bfl-flip-card__title a { font-size: 16px; }
    .bfl-flip-card .bfl-flip-card__slogan { font-size: 14px; }
    .bfl-flip-card .bfl-flip-card__link svg { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .bfl-flip-card .bfl-flip-card__stage,
    .bfl-flip-card .bfl-flip-card__link { transition: none; }
}
/* Editorial sections can use four columns inside a narrower content area. */
@media (min-width: 768px) {
    @container bfl-product-card (max-width: 270px) {
        .bfl-flip-card .bfl-flip-card__face { padding: 16px; min-height: 420px; gap: 16px; }
        .bfl-flip-card .bfl-flip-card__media { height: 200px; }
        .bfl-flip-card .bfl-flip-card__title,
        .bfl-flip-card .bfl-flip-card__title a { font-size: 18px; }
        .bfl-flip-card .bfl-flip-card__slogan,
        .bfl-flip-card .bfl-flip-card__benefits,
        .bfl-flip-card .bfl-flip-card__benefits p,
        .bfl-flip-card .bfl-flip-card__benefit-list > .bfl-flip-card__benefit,
        body #main .products .bfl-flip-card .bfl-flip-card__benefit-list > .bfl-flip-card__benefit { font-size: 16px; }
        .bfl-flip-card .bfl-flip-card__eyebrow { font-size: 10px; letter-spacing: 1px; }
        .bfl-flip-card .bfl-flip-card__link { font-size: 10px; padding: 12px; gap: 6px; letter-spacing: .5px; }
        .bfl-flip-card .bfl-flip-card__link svg { width: 16px; height: 16px; }
    }
}
/* The front determines the resting card height; long backs can extend on flip. */
.bfl-flip-card .bfl-flip-card__front { min-height: 0; }
.bfl-flip-card .bfl-flip-card__back { min-height: 100%; }
.bfl-flip-card .bfl-flip-card__front .bfl-flip-card__footer {
    margin-top: 0;
    min-height: 44px;
}
.bfl-flip-card .bfl-flip-card__summary > .bfl-flip-card__eyebrow,
.bfl-flip-card .bfl-flip-card__summary > .bfl-flip-card__slogan { margin-top: 0; margin-bottom: 0; }
@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
    .bfl-flip-card.is-enhanced .bfl-flip-card__toggle,
    .bfl-flip-card.is-enhanced .bfl-flip-card__close { opacity: 0; pointer-events: none; }
    .bfl-flip-card.is-enhanced .bfl-flip-card__toggle:focus-visible,
    .bfl-flip-card.is-enhanced .bfl-flip-card__close:focus-visible { opacity: 1; pointer-events: auto; }
    .bfl-flip-card .bfl-flip-card__front .bfl-flip-card__footer { min-height: 31px; }
    .bfl-flip-card .bfl-flip-card__front .bfl-flip-card__footer:has(> .bfl-flip-card__toggle:focus-visible) {
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 4px;
    }
    .bfl-flip-card .bfl-flip-card__front .bfl-flip-card__toggle:focus-visible {
        position: static;
        flex: 0 0 auto;
        width: auto;
        min-width: 44px;
        height: 44px;
        min-height: 44px;
        padding: 0 4px;
        margin: 0;
    }
}
@media (any-pointer: coarse) {
    .bfl-flip-card.is-enhanced .bfl-flip-card__toggle,
    .bfl-flip-card.is-enhanced .bfl-flip-card__close { opacity: 1; pointer-events: auto; }
}
/* A tapped card occupies its full back height instead of covering the next row. */
@media (max-width: 767px), (any-pointer: coarse), (hover: none) {
    .bfl-flip-card.is-flipped .bfl-flip-card__stage { display: grid; }
    .bfl-flip-card.is-flipped .bfl-flip-card__back {
        position: relative;
        top: auto;
        left: auto;
        min-height: 0;
    }
    .bfl-flip-card .bfl-flip-card__front .bfl-flip-card__footer {
        flex-direction: column;
        align-items: center;
        justify-content: flex-end;
        gap: 4px;
        min-height: 75px;
        padding-right: 0;
    }
    .bfl-flip-card .bfl-flip-card__front .bfl-flip-card__toggle {
        position: static;
        flex: 0 0 44px;
        margin: 0;
    }
}
/* Floating widgets must not cover product content on phones and tablets. */
@media (max-width: 1024px) {
    body.bfl-cards-in-view .agJsWidget,
    body.bfl-cards-in-view .progress-page { visibility: hidden !important; pointer-events: none; }
}
/* Fit columns to the space of each editorial block, not only the viewport. */
@media (max-width: 767px) {
    ul.products:has(> .bfl-flip-card),
    .bestsellers-grid:has(> .bfl-flip-card) {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, max(170px, 50%)), 1fr));
        align-items: start;
        gap: 24px 0;
    }
    ul.products:has(> .bfl-flip-card)::before,
    ul.products:has(> .bfl-flip-card)::after { display: none; }
    ul.products > .bfl-flip-card,
    .bestsellers-grid > .bfl-flip-card {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 6px !important;
    }
}
