/* ================================================================
 * Takdane Mirror — Flavors / Product Showcase (#6) v1.6.0
 * Clean three-column mirror layout, no orbit/circle borders.
 * ================================================================ */
.elementor-widget-tkm_flavors_showcase,
.elementor-widget-tkm_flavors_showcase > .elementor-widget-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.tkm-flavors,
.tkm-flavors * { box-sizing: border-box; }

.tkm-flavors {
    --tf-bg-default: #f3e8d3;
    --tf-ink-default: #321e16;
    --tf-bg: var(--tf-bg-default);
    --tf-ink: var(--tf-ink-default);
    --tf-accent: #e6ba2a;
    --tf-muted: rgba(50,30,22,.64);
    --tf-line: rgba(50,30,22,.20);
    --tf-pad-x: 5.2vw;
    --tf-gap: 2.2vw;
    --tf-stage-h: 100vh;
    --tf-scroll-h: 264vh;
    --tf-image-w: 88%;
    --tf-visual-h: 70vh;
    --tf-halo-opacity: .16;

    position: relative;
    isolation: isolate;
    width: 100vw;
    max-width: none !important;
    min-height: var(--tf-scroll-h);
    margin-inline: calc(50% - 50vw);
    background: var(--tf-bg);
    color: var(--tf-ink);
    direction: rtl;
    overflow: clip;
    transition: background-color .7s cubic-bezier(.22,1,.36,1), color .5s ease;
    -webkit-font-smoothing: antialiased;
    text-rendering: geometricPrecision;
}

.tkm-flavors a { color: inherit; text-decoration: none !important; }
.tkm-flavors button { appearance: none; border: 0 !important; outline: 0; background: transparent !important; color: inherit; font: inherit; }

.tkm-flavors .tf-stage {
    position: sticky;
    z-index: 1;
    top: 0;
    width: 100%;
    height: var(--tf-stage-h);
    min-height: 690px;
    overflow: hidden;
    background: var(--tf-bg);
    transition: background-color .7s cubic-bezier(.22,1,.36,1);
}

/* Reference look is intentionally clean: no circular outlines or orbit borders. */
.tkm-flavors .tf-stage::before,
.tkm-flavors .tf-stage::after { content: none !important; }

.tkm-flavors .tf-stage-inner {
    position: absolute;
    z-index: 2;
    inset: 0 var(--tf-pad-x);
    display: grid;
    grid-template-columns: minmax(260px, 29fr) minmax(380px, 42fr) minmax(270px, 29fr);
    grid-template-areas: "detail visual intro";
    align-items: center;
    gap: var(--tf-gap);
    direction: ltr;
}

.tkm-flavors .tf-intro-stack,
.tkm-flavors .tf-detail-stack,
.tkm-flavors .tf-visual-shell {
    position: relative;
    min-width: 0;
}

.tkm-flavors .tf-intro-stack {
    grid-area: intro;
    height: min(65vh, 640px);
    direction: rtl;
}

.tkm-flavors .tf-detail-stack {
    grid-area: detail;
    height: min(62vh, 610px);
    direction: rtl;
}

.tkm-flavors .tf-intro-slide,
.tkm-flavors .tf-detail-slide {
    position: absolute;
    inset-inline: 0;
    top: 50%;
    margin: 0;
    padding: 0;
    transform: translate3d(0,-50%,0);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    will-change: transform, opacity;
}

.tkm-flavors .tf-intro-slide.is-active,
.tkm-flavors .tf-detail-slide.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.tkm-flavors .tf-kicker {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 18px;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.5;
    letter-spacing: -.015em;
    color: var(--tf-ink);
}

.tkm-flavors .tf-kicker i {
    display: block;
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    border-radius: 50%;
    background: var(--tf-accent);
    box-shadow: none !important;
}

.tkm-flavors .tf-title {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--tf-ink);
    font-size: clamp(72px, 7.55vw, 145px);
    font-weight: 900;
    line-height: .82;
    letter-spacing: -.065em;
    text-align: right;
}

.tkm-flavors .tf-subtitle {
    margin: 20px 0 0 !important;
    padding: 0 !important;
    color: var(--tf-muted);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.7;
}

.tkm-flavors .tf-ingredients {
    width: min(100%, 390px);
    margin-top: 36px;
    padding-top: 15px;
    border-top: 1px solid var(--tf-line);
}

.tkm-flavors .tf-ingredients span {
    display: block;
    margin-bottom: 7px;
    color: var(--tf-muted);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.4;
}

.tkm-flavors .tf-ingredients p,
.tkm-flavors .tf-description {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--tf-ink);
    font-size: 13px;
    font-weight: 450;
    line-height: 1.95;
}

.tkm-flavors .tf-number {
    display: flex;
    align-items: baseline;
    gap: 8px;
    width: max-content;
    margin-top: 26px;
    direction: ltr;
}

.tkm-flavors .tf-number b {
    font-size: clamp(27px, 2.2vw, 42px);
    font-weight: 750;
    line-height: 1;
}

.tkm-flavors .tf-number span {
    color: var(--tf-muted);
    font-size: 10px;
    font-weight: 650;
}

.tkm-flavors .tf-detail-slide > h3 {
    margin: 0 0 17px !important;
    padding: 0 !important;
    color: var(--tf-ink);
    font-size: clamp(20px, 1.5vw, 27px);
    font-weight: 750;
    line-height: 1.35;
}

.tkm-flavors .tf-description {
    width: min(100%, 420px);
    color: var(--tf-muted);
}

.tkm-flavors .tf-specs {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    margin-top: 28px;
    border-top: 1px solid var(--tf-line);
    border-right: 1px solid var(--tf-line);
}

.tkm-flavors .tf-specs > div {
    min-height: 72px;
    padding: 13px 14px;
    border-left: 1px solid var(--tf-line);
    border-bottom: 1px solid var(--tf-line);
}

.tkm-flavors .tf-specs span,
.tkm-flavors .tf-specs b { display: block; }

.tkm-flavors .tf-specs span {
    margin-bottom: 6px;
    color: var(--tf-muted);
    font-size: 9px;
    font-weight: 650;
}

.tkm-flavors .tf-specs b {
    color: var(--tf-ink);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
}

.tkm-flavors .tf-badge {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    margin-top: 20px;
    padding: 6px 12px;
    border: 1px solid color-mix(in srgb, var(--tf-ink) 34%, transparent);
    border-radius: 999px;
    background: transparent;
    color: var(--tf-ink);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}

.tkm-flavors .tf-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 22px;
    padding: 0 0 6px;
    border-bottom: 1px solid currentColor;
    color: var(--tf-ink);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    transition: gap .25s ease, opacity .25s ease;
}

.tkm-flavors .tf-cta:hover,
.tkm-flavors .tf-cta:focus-visible { gap: 15px; opacity: .72; }

.tkm-flavors .tf-visual-shell {
    grid-area: visual;
    z-index: 8;
    width: 100%;
    height: var(--tf-visual-h);
    min-height: 450px;
    align-self: center;
    direction: rtl;
    pointer-events: auto;
    touch-action: pan-y;
}

/* Soft depth only; deliberately not a bordered circle. */
.tkm-flavors .tf-halo {
    position: absolute;
    z-index: 0;
    inset: 12% 2% 8%;
    border: 0 !important;
    border-radius: 0 !important;
    background: radial-gradient(ellipse at center, color-mix(in srgb,var(--tf-accent) 34%,transparent) 0%, color-mix(in srgb,var(--tf-accent) 16%,transparent) 37%, transparent 72%);
    opacity: var(--tf-halo-opacity);
    filter: blur(8px);
    pointer-events: none;
}

.tkm-flavors .tf-orbit { display: none !important; }

.tkm-flavors .tf-media-stack,
.tkm-flavors .tf-media-item { position: absolute; inset: 0; }

.tkm-flavors .tf-media-item {
    z-index: 2;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform-origin: 50% 58%;
    will-change: transform, opacity;
}

.tkm-flavors .tf-media-item.is-active { opacity: 1; visibility: visible; }

.tkm-flavors.tkm-awaiting-bridge .tf-media-item[data-index="0"] {
    opacity: 0;
    visibility: hidden;
}

.tkm-flavors .tf-product-image {
    position: absolute;
    z-index: 6;
    left: 50%;
    top: 50%;
    display: block;
    width: var(--tf-image-w);
    max-width: none !important;
    max-height: 100%;
    height: auto;
    margin: 0 !important;
    object-fit: contain;
    transform: translate3d(-50%,-50%,0);
    transform-origin: 50% 56%;
    user-select: none;
    pointer-events: none;
    backface-visibility: hidden;
    will-change: transform, opacity;
}

.tkm-flavors.has-image-shadow .tf-product-image {
    filter: drop-shadow(0 28px 26px rgba(37,22,14,.14));
}

.tkm-flavors .tf-decor {
    position: absolute;
    z-index: 3;
    display: block;
    width: clamp(64px, 7.5vw, 136px);
    max-width: none !important;
    height: auto;
    object-fit: contain;
    pointer-events: none;
    user-select: none;
    will-change: transform, opacity;
}

.tkm-flavors .tf-decor-1 { left: 5%; top: 17%; transform: rotate(-12deg); animation: tfFloatA 7s ease-in-out -1.2s infinite alternate; }
.tkm-flavors .tf-decor-2 { right: 2%; top: 31%; width: clamp(72px,8.3vw,150px); transform: rotate(10deg); animation: tfFloatB 7.6s ease-in-out -3s infinite alternate; }
.tkm-flavors .tf-decor-3 { left: 17%; bottom: 7%; width: clamp(60px,6.8vw,124px); transform: rotate(8deg); animation: tfFloatC 8.1s ease-in-out -4.2s infinite alternate; }

@keyframes tfFloatA { from { translate:-3px -7px; } to { translate:6px 8px; } }
@keyframes tfFloatB { from { translate:5px -5px; } to { translate:-5px 7px; } }
@keyframes tfFloatC { from { translate:-4px 5px; } to { translate:4px -8px; } }

.tkm-flavors .tf-switcher {
    position: absolute;
    z-index: 14;
    right: var(--tf-pad-x);
    left: var(--tf-pad-x);
    bottom: 24px;
    display: grid;
    grid-template-columns: auto minmax(280px,1fr) auto;
    grid-template-areas: "title list hint" "progress progress progress";
    align-items: center;
    gap: 11px 28px;
    direction: rtl;
}

.tkm-flavors.hide-switcher .tf-switcher { display:none !important; }

.tkm-flavors .tf-switcher-title {
    grid-area: title;
    display: block;
    margin: 0;
    color: var(--tf-ink);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}

.tkm-flavors .tf-switcher-list {
    grid-area: list;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    min-width: 0;
}

.tkm-flavors .tf-switch {
    position: relative;
    display: inline-flex;
    align-items: baseline;
    gap: 7px;
    min-height: 32px;
    margin: 0 !important;
    padding: 0 0 5px !important;
    border-radius: 0 !important;
    cursor: pointer;
    opacity: .38;
    transition: opacity .28s ease, transform .28s ease;
}

.tkm-flavors .tf-switch::after {
    content:"";
    position:absolute;
    right:0;
    bottom:0;
    width:0;
    height:1px;
    background:currentColor;
    transition:width .32s cubic-bezier(.22,1,.36,1);
}

.tkm-flavors .tf-switch:hover,
.tkm-flavors .tf-switch.is-active { opacity:1; }
.tkm-flavors .tf-switch.is-active { transform:translateY(-1px); }
.tkm-flavors .tf-switch.is-active::after { width:100%; }

.tkm-flavors .tf-switch span { font-size:9px; font-weight:650; direction:ltr; }
.tkm-flavors .tf-switch b { font-size:11px; font-weight:750; }

.tkm-flavors .tf-switcher small {
    grid-area: hint;
    display:block;
    margin:0;
    padding:0;
    color:var(--tf-muted);
    font-size:9px;
    line-height:1.45;
    white-space:nowrap;
}

.tkm-flavors .tf-progress {
    grid-area: progress;
    position:relative;
    width:100%;
    height:1px;
    overflow:hidden;
    background:var(--tf-line);
}
.tkm-flavors .tf-progress i { position:absolute; inset:0 auto 0 0; width:0%; background:var(--tf-ink); will-change:width; }

.tkm-flavors.is-bridge-receiving .tf-media-item[data-index="0"] { will-change: opacity,transform; }

@media (max-width: 1180px) {
    .tkm-flavors { --tf-pad-x:32px; --tf-gap:20px; }
    .tkm-flavors .tf-stage-inner { grid-template-columns:minmax(220px,30fr) minmax(310px,40fr) minmax(230px,30fr); }
    .tkm-flavors .tf-title { font-size:clamp(58px,7.8vw,96px); }
    .tkm-flavors .tf-ingredients { margin-top:27px; }
    .tkm-flavors .tf-description,
    .tkm-flavors .tf-ingredients p { font-size:12px; }
    .tkm-flavors .tf-specs > div { min-height:66px; padding:11px 12px; }
    .tkm-flavors .tf-switcher { grid-template-columns:auto minmax(230px,1fr); grid-template-areas:"title list" "progress progress" "hint hint"; gap:8px 20px; }
    .tkm-flavors .tf-switcher small { text-align:left; }
}

@media (max-width: 767px) {
    .tkm-flavors { --tf-pad-x:18px; --tf-gap:0px; }

    .tkm-flavors:not(.mobile-pin) {
        min-height:auto !important;
        overflow:clip;
    }

    .tkm-flavors:not(.mobile-pin) .tf-stage {
        position:relative;
        top:auto;
        height:auto;
        min-height:0;
        padding:48px 0 28px;
        overflow:hidden;
    }

    .tkm-flavors:not(.mobile-pin) .tf-stage-inner {
        position:relative;
        inset:auto;
        display:grid;
        grid-template-columns:1fr;
        grid-template-areas:"intro" "visual" "detail";
        gap:0;
        padding:0 var(--tf-pad-x);
    }

    .tkm-flavors:not(.mobile-pin) .tf-intro-stack,
    .tkm-flavors:not(.mobile-pin) .tf-detail-stack {
        height:auto;
        min-height:0;
    }

    .tkm-flavors:not(.mobile-pin) .tf-intro-slide,
    .tkm-flavors:not(.mobile-pin) .tf-detail-slide {
        position:relative;
        inset:auto;
        top:auto;
        display:none;
        transform:none;
    }

    .tkm-flavors:not(.mobile-pin) .tf-intro-slide.is-active,
    .tkm-flavors:not(.mobile-pin) .tf-detail-slide.is-active { display:block; }

    .tkm-flavors .tf-kicker { margin-bottom:12px; font-size:10px; }
    .tkm-flavors .tf-title { font-size:clamp(54px,18vw,78px); line-height:.86; letter-spacing:-.045em; }
    .tkm-flavors .tf-subtitle { margin-top:13px !important; font-size:11px; }
    .tkm-flavors .tf-ingredients { width:100%; margin-top:20px; padding-top:12px; }
    .tkm-flavors .tf-ingredients p,
    .tkm-flavors .tf-description { font-size:11.5px; line-height:1.85; }
    .tkm-flavors .tf-number { margin-top:16px; }
    .tkm-flavors .tf-number b { font-size:27px; }

    .tkm-flavors .tf-visual-shell {
        min-height:300px;
        height:clamp(300px,var(--tf-visual-h),430px);
        margin:20px 0 26px;
    }

    .tkm-flavors .tf-halo { inset:8% -12% 4%; opacity:calc(var(--tf-halo-opacity) * .8); }
    .tkm-flavors .tf-product-image { max-height:94%; }
    .tkm-flavors .tf-decor { width:68px; }
    .tkm-flavors .tf-decor-1 { left:2%; top:12%; }
    .tkm-flavors .tf-decor-2 { right:0; top:28%; width:74px; }
    .tkm-flavors .tf-decor-3 { left:13%; bottom:2%; width:62px; }

    .tkm-flavors .tf-detail-slide > h3 { margin-bottom:12px !important; font-size:19px; }
    .tkm-flavors .tf-specs { margin-top:20px; }
    .tkm-flavors .tf-specs > div { min-height:62px; padding:10px; }
    .tkm-flavors .tf-badge,
    .tkm-flavors .tf-cta { margin-top:17px; }

    .tkm-flavors.mobile-hide-details .tf-detail-stack { display:none !important; }

    .tkm-flavors:not(.mobile-pin) .tf-switcher {
        position:relative;
        right:auto;
        left:auto;
        bottom:auto !important;
        grid-template-columns:1fr;
        grid-template-areas:"title" "list" "progress" "hint";
        gap:10px;
        margin:34px var(--tf-pad-x) 0;
    }

    .tkm-flavors .tf-switcher-title { font-size:14px; }
    .tkm-flavors .tf-switcher-list {
        justify-content:flex-start;
        width:100%;
        gap:22px;
        overflow-x:auto;
        overscroll-behavior-inline:contain;
        scrollbar-width:none;
        -webkit-overflow-scrolling:touch;
    }
    .tkm-flavors .tf-switcher-list::-webkit-scrollbar { display:none; }
    .tkm-flavors .tf-switch { flex:0 0 auto; min-height:30px; }
    .tkm-flavors .tf-switcher small { font-size:8.5px; white-space:normal; }

    /* Optional mobile pin remains available, but is composed for portrait. */
    .tkm-flavors.mobile-pin .tf-stage { min-height:100svh; }
    .tkm-flavors.mobile-pin .tf-stage-inner {
        inset:0 var(--tf-pad-x) 82px;
        grid-template-columns:1fr;
        grid-template-areas:"intro" "visual" "detail";
        align-content:center;
        gap:10px;
    }
    .tkm-flavors.mobile-pin .tf-intro-stack { height:190px; }
    .tkm-flavors.mobile-pin .tf-visual-shell { height:34svh; min-height:250px; margin:0; }
    .tkm-flavors.mobile-pin .tf-detail-stack { height:235px; overflow:hidden; }
    .tkm-flavors.mobile-pin .tf-description { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
    .tkm-flavors.mobile-pin .tf-switcher { right:var(--tf-pad-x); left:var(--tf-pad-x); bottom:14px; grid-template-columns:1fr; grid-template-areas:"list" "progress"; gap:7px; }
    .tkm-flavors.mobile-pin .tf-switcher-title,
    .tkm-flavors.mobile-pin .tf-switcher small { display:none; }
}

@media (max-width: 390px) {
    .tkm-flavors { --tf-pad-x:15px; }
    .tkm-flavors .tf-title { font-size:clamp(50px,17.4vw,68px); }
    .tkm-flavors .tf-visual-shell { min-height:280px; }
    .tkm-flavors .tf-specs b { font-size:11px; }
}

@media (prefers-reduced-motion: reduce) {
    .tkm-flavors,
    .tkm-flavors .tf-stage,
    .tkm-flavors .tf-media-item,
    .tkm-flavors .tf-intro-slide,
    .tkm-flavors .tf-detail-slide,
    .tkm-flavors .tf-decor,
    .tkm-flavors .tf-switch {
        animation:none !important;
        transition-duration:.01ms !important;
        scroll-behavior:auto !important;
    }
}

/* ================================================================
 * v1.7.0 — seamless incoming bridge from Hero
 * The section is pulled one stage upward, so it physically travels under the
 * sticky Hero instead of appearing after it in a single frame.
 * ================================================================ */
.tkm-flavors.tkm-bridge-target {
    --tkm-bridge-overlap: 100vh;
    position: relative;
    z-index: 1;
    margin-top: calc(-1 * var(--tkm-bridge-overlap)) !important;
}

.tkm-flavors.tkm-bridge-target .tf-stage {
    transform: translateZ(0);
}

.tkm-flavors.tkm-awaiting-bridge .tf-media-item[data-index="0"] {
    opacity: 0;
    visibility: hidden;
}

.tkm-flavors.tkm-bridge-live .tf-media-item[data-index="0"] {
    visibility: visible;
}

/* Reference product scene: intentionally no orbit/ring/border circles. */
.tkm-flavors .tf-halo,
.tkm-flavors .tf-orbit,
.tkm-flavors [class*="orbit"],
.tkm-flavors .tf-visual-shell::before,
.tkm-flavors .tf-visual-shell::after,
.tkm-flavors .tf-media-item::before,
.tkm-flavors .tf-media-item::after {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}

/* Desktop mirror proportions: copy right, hero product centered, detail left. */
@media (min-width: 768px) {
    .tkm-flavors .tf-stage-inner {
        grid-template-columns: minmax(250px, 28fr) minmax(420px, 44fr) minmax(260px, 28fr);
        grid-template-areas: "detail visual intro";
        gap: clamp(20px, 2.4vw, 46px);
    }

    .tkm-flavors .tf-visual-shell {
        height: min(76vh, 760px);
        min-height: 500px;
    }

    .tkm-flavors .tf-product-image {
        width: min(var(--tf-image-w), 94%);
        max-height: 95%;
    }

    .tkm-flavors .tf-intro-stack,
    .tkm-flavors .tf-detail-stack {
        height: min(66vh, 660px);
    }

    .tkm-flavors .tf-switcher {
        bottom: 24px;
    }
}

/* Mobile mirrors the reference order instead of squeezing the desktop grid. */
@media (max-width: 767px) {
    .tkm-flavors.tkm-bridge-target {
        --tkm-bridge-overlap: 100svh;
    }

    .tkm-flavors:not(.mobile-pin) .tf-stage {
        padding-top: clamp(44px, 8svh, 72px);
        padding-bottom: 26px;
    }

    .tkm-flavors:not(.mobile-pin) .tf-stage-inner {
        grid-template-areas: "intro" "visual" "detail";
        gap: 0;
    }

    .tkm-flavors .tf-intro-stack {
        z-index: 4;
    }

    .tkm-flavors .tf-title {
        font-size: clamp(52px, 17.5vw, 76px);
        line-height: .86;
    }

    .tkm-flavors .tf-visual-shell {
        width: 100%;
        height: min(48svh, 430px);
        min-height: 300px;
        margin: 12px 0 22px;
    }

    .tkm-flavors .tf-product-image {
        width: min(var(--tf-image-w), 82vw);
        max-height: 96%;
    }

    .tkm-flavors .tf-decor-1 { left: 0; top: 10%; }
    .tkm-flavors .tf-decor-2 { right: -2%; top: 28%; }
    .tkm-flavors .tf-decor-3 { left: 10%; bottom: 0; }

    .tkm-flavors .tf-detail-slide > h3 { font-size: 19px; }
    .tkm-flavors .tf-description { line-height: 1.9; }

    .tkm-flavors .tf-switcher {
        margin-top: 28px !important;
        padding-bottom: max(6px, env(safe-area-inset-bottom));
    }
}

.tkm-flavors .tf-halo { display:none !important; }
.elementor-widget-tkm_flavors_showcase,
.elementor-widget-tkm_flavors_showcase > .elementor-widget-container { overflow:visible !important; }


/* ================================================================
 * v1.7.1 — reversible bridge + deterministic flavor switching
 * ================================================================ */
.tkm-flavors.tkm-bridge-target .tf-stage.is-bridge-positioned {
    transform: translate3d(0,var(--tf-bridge-stage-y,0px),0) !important;
    will-change: transform;
}

.tkm-flavors.tkm-bridge-engaged .tf-stage {
    pointer-events: none;
}

.tkm-flavors.is-bridge-receiving .tf-intro-stack,
.tkm-flavors.is-bridge-receiving .tf-detail-stack,
.tkm-flavors.is-bridge-receiving .tf-switcher {
    will-change: opacity, transform;
}

/* Inactive copy must never be paintable, even while GSAP is interrupted by
 * a rapid click/scroll. This prevents duplicated titles/kickers. */
.tkm-flavors .tf-intro-slide[aria-hidden="true"],
.tkm-flavors .tf-detail-slide[aria-hidden="true"] {
    pointer-events: none !important;
}

@media (max-width: 767px) {
    .tkm-flavors.tkm-bridge-target .tf-stage.is-bridge-positioned {
        transform: translate3d(0,var(--tf-bridge-stage-y,0px),0) !important;
    }
}