.ad-portrait-bg {
    object-fit: cover !important;
    /* Blur removed — expensive during sticky scroll; brightness-only fallback for legacy dual-img markup */
    filter: brightness(0.4) !important;
}

/* Scroll progress while pinning bottom ads into fullscreen reels */
.scroll-progress-bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: rgba(255, 255, 255, 0.1);
    z-index: 5;
    overflow: hidden;
    pointer-events: none;
}

.scroll-progress-fill {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, #ff6b6b, #ea580c, #45b7d1);
    transition: width 0.1s ease-out;
    box-shadow: 0 0 10px rgba(234, 88, 12, 0.45);
}

.adbottomspacer{
}
.content-panel{
    height: -webkit-fill-available !important;
    width: -webkit-fill-available !important;
    position: relative;
    display: block;
    isolation: isolate;
    overflow: hidden;
}

/* Single-image panels: dimmed cover via pseudo (one decode, no img blur filter) */
#homepage-ads-container .content-panel::before,
#client-ads-container .content-panel::before,
.menu-ad .content-panel::before {
    content: '';
    position: absolute;
    inset: -10%;
    z-index: 0;
    background-image: var(--ad-image);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    filter: brightness(0.4);
    pointer-events: none;
}

#homepage-ads-container .content-panel[style*="--ad-image"] .ad-portrait-bg,
#client-ads-container .content-panel[style*="--ad-image"] .ad-portrait-bg,
.menu-ad .content-panel[style*="--ad-image"] .ad-portrait-bg {
    display: none !important;
}

#homepage-ads-container .content-panel .ad-portrait,
#client-ads-container .content-panel .ad-portrait,
.menu-ad .content-panel .ad-portrait {
    z-index: 1;
}
#pageadscontainer,
#homepage-ads-container,
#client-ads-container,
#frontpage-ads-container{
    height: 100%;
    margin: 0;
    overflow: visible;  /* Changed to visible for sticky to work */
    position: relative;
    pointer-events: none;
}
#pageadscontainer span,
#homepage-ads-container span,
#client-ads-container span,
#frontpage-ads-container span,
.menu-ad-promo-label{
    right: .8em;
    position: absolute;
    top: 1.2em;
    background: linear-gradient(#000000, #222222aa);
    border: .2em solid #fefefe55;
    color: #fff;
    padding-inline:.4em;
    padding-block-end: .2em;
    border-radius: 3em;
    font-size: xx-small;
    font-weight: 700;
    z-index: 2;
}
#pageadscontainer h1,
#homepage-ads-container h1,
#client-ads-container h1,
#frontpage-ads-container h1 {
    margin: 0;
    text-align: center;
    position: relative;
    text-shadow: 1px 1px 2px #000000, -1px -1px 1px #ffffff;
}

#pageadscontainer p,
#homepage-ads-container p,
#client-ads-container p,
#frontpage-ads-container p {
    text-align: center;
    color: rgba(255, 255, 255, 0.5); /* transparentize($white, 0.5) */
    text-shadow: 1px 1px 1px #000000;
}

#pageadscontainer strong,
#homepage-ads-container strong,
#client-ads-container strong,
#frontpage-ads-container strong {
    color: #ffffff;
}

/* All ad containers - simplified without ScrollMagic */
#pageadscontainer,
#homepage-ads-container,
#client-ads-container,
#frontpage-ads-container {
    position: relative;
    width: 100%;
    overflow: visible;
    z-index: 11;
}

/* All ad sections - stack vertically */
#pageadscontainer section,
#homepage-ads-container section,
#client-ads-container section,
#frontpage-ads-container section,
.menu-ad {
    position: relative;
    min-height: calc(100vh);
    height: auto;
    color: white;
    text-align: center;
    text-shadow: 1px 1px 1px #00000055;
    background: #000000;
    width: 100%;
    border: 1px solid var(--main-bg);
    margin-bottom: 0;
}

/* Sticky sections override */
#pageadscontainer section.sticky,
#homepage-ads-container section.sticky,
#client-ads-container section.sticky,
#frontpage-ads-container section.sticky,
.menu-ad.sticky {
    position: -webkit-sticky !important;
    position: sticky !important;
    z-index: 2;
    top: 0;
    contain: layout style;
}

/* Scroll runway after last ad (sticky stack release) */
.menu-ad-scroll-end {
    height: 100vh;
    min-height: 0;
    background: none !important;
    border: none !important;
    pointer-events: none;
}

/* Remove sticky from inner when parent section is sticky */
#pageadscontainer section.sticky .inner,
#homepage-ads-container section.sticky .inner,
#client-ads-container section.sticky .inner,
#frontpage-ads-container section.sticky .inner,
.menu-ad.sticky .inner {
    position: relative !important;
}

#pageadscontainer section .inner, .menu-ad .inner,#four .inner,
#homepage-ads-container section .inner,
#client-ads-container section .inner,
#frontpage-ads-container section .inner{
    margin: 0 auto;
    width: -webkit-fill-available !important;
    min-width: -webkit-fill-available !important;
    max-width: -webkit-fill-available !important;
    min-height: calc(100dvh);
    transition: opacity 0.25s ease;
    background-repeat: no-repeat !important;
    background-position: top center !important;
    background-size: cover!important;
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    flex-direction: row;
    flex-wrap: nowrap;
    position: relative;
    top: auto;
}
#four .inner{
    min-height: 100% !important;
    transition: none;
    left: 0;
    position: relative;
}
#pageadscontainer ul,
.menu-ad ul,
#homepage-ads-container ul,
#client-ads-container ul,
#frontpage-ads-container ul{
    list-style: none;
    font-variant-caps: petite-caps;
}
#pageadscontainer .taxonomy-links li a,
.menu-ad .taxonomy-links li a,
#homepage-ads-container .taxonomy-links li a,
#client-ads-container .taxonomy-links li a,
#frontpage-ads-container .taxonomy-links li a{
    padding-block: .1em .5em;
    padding-inline: .8em;
    background: linear-gradient(#fefefe, #aeaeae);
    border-radius: 3em;
    display: flex;
    color: #000000;
    border: 1px solid #000000aa;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
    text-wrap-mode: nowrap;
    font-weight: 500;
    text-shadow: 1px 0px 1px #ffffff55, 0px -1px 1px #ffffff55, 1px 0px 1px #ffffff55, -1px 0px 1px #ffffff55;
}

#pageadscontainer section .inner .ad-panel, .menu-ad .inner .ad-panel ,#four .ad-panel,
#homepage-ads-container section .inner .ad-panel,
#client-ads-container section .inner .ad-panel,
#frontpage-ads-container section .inner .ad-panel{
    width: 100dvw;
    height: calc(100vh - 5em);
    left: 0px;
    position: relative;
    top: 0;
    flex: 0 0 auto;
    display: flex;
    scroll-snap-align: start;
    text-decoration: none;
    flex-direction: column;
    justify-content: flex-end;
    transition: none;
    pointer-events: all;
}
#pageadscontainer section .inner .ad-panel img,
.menu-ad .inner .ad-panel img,
#pageadscontainer section .inner .ad-panel video,
.menu-ad .inner .ad-panel video,
#homepage-ads-container section .inner .ad-panel img,
#client-ads-container section .inner .ad-panel img,
#frontpage-ads-container section .inner .ad-panel img,
#homepage-ads-container section .inner .ad-panel video,
#client-ads-container section .inner .ad-panel video,
#frontpage-ads-container section .inner .ad-panel video{
    width: 100dvw;
    max-width: -webkit-fill-available;
    margin-inline:  auto !important;
    object-fit: contain;
    z-index: 1;
    left: 0;
    top: 0;
    transition: none;
}
#pageadscontainer section .inner .ad-panel video,
.menu-ad .inner .ad-panel video,
#homepage-ads-container section .inner .ad-panel video,
#client-ads-container section .inner .ad-panel video,
#frontpage-ads-container section .inner .ad-panel video{
    width: auto;
    max-width: -webkit-fill-available;
    margin-inline:  auto !important;
    position: relative;
}
#pageadscontainer section .inner .ad-panel h1 , 
#pageadscontainer section .inner .ad-panel p,
.menu-ad .inner .ad-panel h1,
.menu-ad .inner .ad-panel p,
#pageadscontainer .inner .ad-panel button,
.menu-ad .inner .ad-panel button,
#homepage-ads-container section .inner .ad-panel h1,
#homepage-ads-container section .inner .ad-panel p,
#client-ads-container section .inner .ad-panel h1,
#client-ads-container section .inner .ad-panel p,
#frontpage-ads-container section .inner .ad-panel h1,
#frontpage-ads-container section .inner .ad-panel p,
#homepage-ads-container .inner .ad-panel button,
#client-ads-container .inner .ad-panel button,
#frontpage-ads-container .inner .ad-panel button{
    position: relative;
    z-index: 1;
    top: 0;
    left: 0;
    color: #fefefe;
    border: none;
    width: -webkit-fill-available;
    text-align: center;
}
#pageadscontainer .inner .ad-panel button,
.menu-ad .inner .ad-panel button,
#homepage-ads-container .inner .ad-panel button,
#client-ads-container .inner .ad-panel button,
#frontpage-ads-container .inner .ad-panel button{
    position: relative;
    z-index: 1;
    padding: 2em;
    top: 0;
    left: 0;
    margin: .4em;
    color: #fefefe;
    border: none;
    background: #aa1;
    width: calc(100dvw - 4em);
    max-width: 366px;
    margin-inline: auto;
}

#client-ads-container,#homepage-ads-container  {
}

#pageadscontainer section#two,
#homepage-ads-container section#two,
#client-ads-container section#two,
#frontpage-ads-container section#two {
}

#pageadscontainer section#three,
#homepage-ads-container section#three,
#client-ads-container section#three,
#frontpage-ads-container section#three {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top right;
}

#four {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top right;
    background-color: #00000000;
    display: flex;
    padding-block-start: 100dvh;
    top: revert-layer;
    backdrop-filter: blur(0px);
    border: none;
    pointer-events: none;
}
#pageadscontainer section#four.is-active .inner,
#homepage-ads-container section#four.is-active .inner,
#client-ads-container section#four.is-active .inner,
#frontpage-ads-container section#four.is-active .inner {
    background-color: #222222dd;
}


.nav-btns {
    display: flex;
    position: absolute;
    z-index: 2;
    justify-content: space-between;
    width: 100vw;
    height: 66dvh;
    align-items: center;
    pointer-events: none;
}
.l-btn, .r-btn{
    pointer-events: all;
    height: -webkit-fill-available;
    background: none;
    margin-block-start: 5em;
    border: none;
    color: #fefefe;
}
.l-btn{
    /*background: linear-gradient(90deg, #000000, transparent);*/
}
 .r-btn{
    /*background: linear-gradient(-90deg, #000000, transparent);*/
}
.l-btn svg, .r-btn svg{
    width: 32px;
    height: 64px;
    fill:#ffffff;
}

/* Unmute button for video ads */
#pageadscontainer .inner .ad-panel .ad-unmute-btn,
#frontpage-ads-container .inner .ad-panel .ad-unmute-btn {
    position: absolute;
    bottom: 1em;
    left: 1em;
    z-index: 10;
    background: rgba(0, 0, 0, 0.6);
    border: 2px solid rgba(255, 250, 245, 0.9);
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #fff8f0;
    padding: 0;
    transition: all 0.3s ease;
    pointer-events: all;
}

#pageadscontainer .inner .ad-panel .ad-unmute-btn:hover,
#frontpage-ads-container .inner .ad-panel .ad-unmute-btn:hover {
    background: rgba(0, 0, 0, 0.8);
    transform: scale(1.1);
}

#pageadscontainer .inner .ad-panel .ad-unmute-btn.unmuted,
#frontpage-ads-container .inner .ad-panel .ad-unmute-btn.unmuted {
    background: rgba(234, 88, 12, 0.88);
    border-color: rgba(255, 200, 150, 0.95);
}

#pageadscontainer .inner .ad-panel .ad-unmute-btn svg,
#frontpage-ads-container .inner .ad-panel .ad-unmute-btn svg {
    width: 24px;
    height: 24px;
    fill: currentColor;
}

/* Reels preview mode (Instagram-style tap-to-open vertical feed) */
.bottomads #pageadscontainer.frontpageads section.menu-ad--reels-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    min-height: 100dvh;
    pointer-events: auto;
}

#pageadscontainer.frontpageads section.menu-ad--reels-preview .inner.ads-list--preview {
    pointer-events: auto;
    height: 100vh;
    min-height: auto !important;
    margin-inline: auto;
    overflow-x: auto;
    overflow-y: hidden;
    justify-content: center;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
    align-items: center;
    flex-wrap: nowrap;
    background: rgba(0, 0, 0, 0.92);
    width: calc(100% - 2rem);
    max-width: 420px;
    border-radius: 12px;
}

#pageadscontainer.frontpageads section.menu-ad--reels-preview .nav-btns {
    display: none !important;
}

#pageadscontainer.frontpageads section.menu-ad--reels-preview ul.inner.ads-list--preview li.ad-panel.ad-panel--preview {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    flex: auto !important;
    align-self: stretch !important;
}

#pageadscontainer.frontpageads section.menu-ad--reels-preview ul.inner.ads-list--preview li.ad-panel.ad-panel--preview > span:first-of-type {
    z-index: 4;
}

#pageadscontainer.frontpageads section.menu-ad--reels-preview ul.inner.ads-list--preview li.ad-panel.ad-panel--preview .ad-preview-media {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    overflow: hidden;
    background: #0a0a0a;
}

#pageadscontainer.frontpageads section.menu-ad--reels-preview ul.inner.ads-list--preview li.ad-panel.ad-panel--preview .ad-preview-media video.ad-video {
    position: absolute !important;
    inset: 0 !important;
    width: auto !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    min-height: 0 !important;
    left: 0 !important;
    top: 0 !important;
    object-fit: cover !important;
    display: block !important;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-touch-callout: none;
    touch-action: manipulation;
}

#pageadscontainer.frontpageads section.menu-ad--reels-preview ul.inner.ads-list--preview li.ad-panel.ad-panel--preview .ad-preview-throbber {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    background: rgba(0, 0, 0, 0.25);
    transition: opacity 0.28s ease, visibility 0.28s ease;
}

#pageadscontainer.frontpageads section.menu-ad--reels-preview ul.inner.ads-list--preview li.ad-panel.ad-panel--preview .ad-preview-throbber::after {
    content: '';
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 3px solid rgba(255, 255, 255, 0.2);
    border-top-color: rgba(234, 88, 12, 0.95);
    animation: ad-preview-throbber-spin 0.75s linear infinite;
}

#pageadscontainer.frontpageads section.menu-ad--reels-preview ul.inner.ads-list--preview li.ad-panel.ad-panel--preview .ad-preview-throbber.ad-preview-throbber--hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

@keyframes ad-preview-throbber-spin {
    to { transform: rotate(360deg); }
}

#pageadscontainer.frontpageads section.menu-ad--reels-preview ul.inner.ads-list--preview li.ad-panel.ad-panel--preview .ad-unmute-btn {
    z-index: 4;
}

#pageadscontainer.frontpageads .ad-panel.ad-panel--preview {
    flex: 0 0 100%;
    width: 100%;
    max-width: none;
    height: 100%;
    min-height: 0;
    scroll-snap-align: start;
    border-radius: 12px;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
}

#pageadscontainer.frontpageads .ad-panel.ad-panel--preview:focus-visible {
    outline: 2px solid rgba(234, 88, 12, 0.95);
    outline-offset: 3px;
}

#pageadscontainer.frontpageads .ad-panel.ad-panel--preview .ad-portrait-bg {
    height: 100% !important;
    max-height: 100%;
    object-fit: cover;
}

#pageadscontainer.frontpageads .ad-panel.ad-panel--preview:not(:has(.ad-preview-media)) video.ad-video {
    height: 100% !important;
    max-height: 100%;
    object-fit: cover;
    -webkit-touch-callout: none;
    touch-action: manipulation;
}

/* Fullscreen reels overlay */
body.ads-reels-open {
    overflow: hidden;
}

.ads-reels-overlay {
    position: fixed;
    inset: 0;
    z-index: 10050;
    background: #000;
    display: flex;
    flex-direction: column;
}

.ads-reels-overlay[hidden] {
    display: none !important;
}

.ads-reels-close {
    position: absolute;
    top: max(0.75rem, env(safe-area-inset-top));
    right: max(0.75rem, env(safe-area-inset-right));
    z-index: 2;
    background: rgba(0, 0, 0, 0.5);
    border: none;
    border-radius: 50%;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
}

.ads-reels-close:hover {
    transform: translateY(-1px);
    background: rgba(0, 0, 0, 0.75);
}

.ads-reels-track {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-snap-type: y mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.ads-reels-track::-webkit-scrollbar {
    display: none;
}

.ads-reels-slide {
    position: relative;
    min-height: 100vh;
    min-height: 100dvh;
    height: 100vh;
    height: 100dvh;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    padding-bottom: max(1rem, env(safe-area-inset-bottom));
    background: #000;
}

.ads-reels-slide .ad-portrait-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.ads-reels-slide .ad-portrait {
    position: relative;
    z-index: 1;
    max-height: calc(100dvh - 5.5rem - env(safe-area-inset-bottom));
    width: auto;
    max-width: 100%;
    object-fit: contain;
}

.ads-reels-slide video.ad-video {
    position: relative;
    z-index: 1;
    max-height: 100dvh;
    width: auto;
    max-width: 100%;
    object-fit: contain;
}

.ads-reels-slide .ad-unmute-btn {
    position: absolute;
    left: max(0.75rem, env(safe-area-inset-left));
    z-index: 4;
    bottom: 1em;
    background: rgba(0, 0, 0, 0.6);
    border: 2px solid rgba(255, 250, 245, 0.9);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #fff8f0;
    padding: 0;
    pointer-events: auto;
    transition: transform 0.2s ease, background 0.2s ease;
}

.ads-reels-slide .ad-unmute-btn:hover {
    background: rgba(0, 0, 0, 0.82);
    transform: scale(1.06);
}

.ads-reels-slide .ad-unmute-btn.unmuted {
    background: rgba(234, 88, 12, 0.88);
    border-color: rgba(255, 200, 150, 0.95);
}

.ads-reels-slide .ad-unmute-btn svg {
    width: 22px;
    height: 22px;
}