/* Scroll direction controls visibility; no compact dock remains on screen. */
body.berta-collection-flow .site-header{left:50%!important;right:auto!important;transform:translateX(-50%)!important;width:100%;box-sizing:border-box;transform-origin:50% 0;opacity:1;visibility:visible;clip-path:inset(0 0 0 0);transition:transform 3.64s cubic-bezier(.22,.62,.28,1),opacity 3.64s ease,clip-path 3.64s cubic-bezier(.22,.62,.28,1),visibility 0s}
body.berta-collection-flow .col-bar{width:100%;box-sizing:border-box;transform-origin:50% 0;opacity:1;visibility:visible;clip-path:inset(-100vh -100vw -100vh -100vw);transition:transform 3.64s cubic-bezier(.22,.62,.28,1),opacity 3.64s ease,clip-path 3.64s cubic-bezier(.22,.62,.28,1),visibility 0s;overflow:visible}
body.berta-flow-pinned .col-bar{position:fixed!important;top:var(--header-h,64px)!important;left:0!important;right:0!important;z-index:10000;width:100%!important;transform:translateY(0) scale(1)}
body.berta-flow-hidden .site-header{transform:translate(-50%,-100%) scale(.65,.06)!important;opacity:0;clip-path:inset(0 30% 100% 30%);pointer-events:none;visibility:hidden;transition:transform 3.64s cubic-bezier(.22,.62,.28,1),opacity 3.64s ease,clip-path 3.64s cubic-bezier(.22,.62,.28,1),visibility 0s 3.64s}
body.berta-flow-hidden .site-header__brand{opacity:0}
body.berta-flow-hidden .col-bar{transform:translateY(-90px) scale(.65,.06)!important;opacity:0;clip-path:inset(0 30% 100% 30%);pointer-events:none;visibility:hidden;transition:transform 3.64s cubic-bezier(.22,.62,.28,1),opacity 3.64s ease,clip-path 3.64s cubic-bezier(.22,.62,.28,1),visibility 0s 3.64s}
body.berta-flow-pinned:not(.berta-flow-hidden) .site-header,body.berta-flow-pinned:not(.berta-flow-hidden) .col-bar{transition-duration:2.8s,2.8s,2.8s,0s}
.berta-flow-placeholder{height:0;pointer-events:none}
.berta-brand-fall{position:fixed;inset:0;z-index:10050;pointer-events:none;overflow:hidden}
.berta-brand-fall span{position:absolute;display:block;will-change:transform,opacity;text-align:center;filter:drop-shadow(0 1px 5px #c7aa8377)}
.berta-progressive-image{transition:filter .45s ease;image-rendering:auto}
img.berta-progressive-image[data-berta-level=low]{filter:blur(.5px)}
img.berta-progressive-image[data-berta-level=mid],img.berta-progressive-image[data-berta-level=high]{filter:none}
@media(max-width:700px){body.berta-flow-pinned .col-bar__inner{display:flex!important;flex-wrap:wrap;gap:8px;padding:10px 18px!important}body.berta-flow-pinned .col-field--search{flex-basis:100%;min-width:0}body.berta-flow-pinned .col-field--select{flex:1;min-width:0}body.berta-flow-pinned .col-field--toggle{flex:1;min-width:0}body.berta-flow-pinned .col-drop__panel{max-width:calc(100vw - 36px);min-width:160px}}
@media(prefers-reduced-motion:reduce){body.berta-collection-flow .site-header,body.berta-collection-flow .col-bar,.berta-progressive-image{transition:none!important}.berta-brand-fall{display:none}}
/* Keep scroll effects on compositor-friendly transform/opacity properties. */
body.berta-collection-flow .site-header,body.berta-collection-flow .col-bar{clip-path:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;will-change:transform,opacity;transition:transform 3.64s cubic-bezier(.22,.62,.28,1),opacity 3.64s ease,visibility 0s}
body.berta-flow-hidden .site-header,body.berta-flow-hidden .col-bar{clip-path:none!important;transition:transform 3.64s cubic-bezier(.22,.62,.28,1),opacity 3.64s ease,visibility 0s 3.64s}
body.berta-flow-pinned:not(.berta-flow-hidden) .site-header,body.berta-flow-pinned:not(.berta-flow-hidden) .col-bar{transition:transform 1s cubic-bezier(.16,1,.3,1),opacity .65s ease,visibility 0s}
.berta-brand-fall span{filter:none;text-shadow:0 1px 3px #a98a4e55}
.berta-progressive-image{filter:none!important;transition:none!important}
body.berta-user-scrolling .col-amb__veins,body.berta-user-scrolling .col-amb__glow i,body.berta-motion-busy .col-amb__veins,body.berta-motion-busy .col-amb__glow i{animation-play-state:paused!important}
.col-card__media,.berta-product-detail .woocommerce-product-gallery{contain:paint}
body.berta-flow-pinned .col-bar{background:#11100ff5!important}
@media(prefers-reduced-motion:reduce){body.berta-collection-flow .site-header,body.berta-collection-flow .col-bar{transition:none!important;will-change:auto}}
/* Preserve the mineral artwork as a static layer. Continuous masked, blended
   full-viewport animation competes with scroll and intentional UI motion. */
.col-shop .col-amb__veins,.col-shop .col-amb__glow i,.col-shop .col-head::after{animation:none!important;will-change:auto!important}
/* One composited group: title, price, purchase and details stream together. */
.berta-product-detail>.product>.summary{view-transition-name:berta-product-summary}

/* Device-aware interaction CFG: capability classes come from berta-device-cfg.js. */
:root{--berta-cfg-target:44px;--berta-bar-stream:1.6s}
.berta-input-touch :is(button,.button,a.col-drop__option,.col-field--toggle){min-height:var(--berta-cfg-target)}
.berta-cfg-low .col-shop :is(.col-bar,.col-drop__panel),.berta-cfg-low .berta-product-detail :is(.berta-gallery-caption,.flex-control-thumbs){backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important}
.berta-cfg-low .col-shop .col-amb__glow,.berta-cfg-low .col-shop .col-amb__veins{display:none!important}
.berta-product-detail :is(.related,.upsells),.berta-product-detail~.site-footer{content-visibility:auto;contain-intrinsic-size:800px}

/* Product-first layout: the gallery owns a 16:9 Full-HD stage and every
   purchase/detail control follows beneath it instead of competing beside it. */
body.single-product .berta-product-detail{padding-inline:0!important;overflow:clip}
body.single-product .berta-product-detail>.product{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:0!important;width:min(100%,1920px)!important;max-width:1920px!important;margin-inline:auto!important}
body.single-product .berta-product-detail>.product>.woocommerce-product-gallery{grid-column:1!important;grid-row:1!important;width:100%!important;max-width:none!important;margin:0!important;border-inline:0!important;border-radius:0!important;background:#0d0c0a!important}
body.single-product .berta-product-detail .woocommerce-product-gallery .flex-viewport{width:100%!important;aspect-ratio:16/9;max-height:1080px!important;border-radius:0!important;background:#0d0c0a!important}
body.single-product .berta-product-detail .woocommerce-product-gallery .flex-viewport .woocommerce-product-gallery__wrapper,
body.single-product .berta-product-detail .woocommerce-product-gallery .flex-viewport .woocommerce-product-gallery__image,
body.single-product .berta-product-detail .woocommerce-product-gallery .flex-viewport .woocommerce-product-gallery__image>a{height:100%!important}
body.single-product .berta-product-detail .woocommerce-product-gallery__image>a{display:grid!important;place-items:center}
body.single-product .berta-product-detail .woocommerce-product-gallery__image>a>img{width:100%!important;height:100%!important;max-height:1080px!important;padding:clamp(18px,2.4vw,46px) clamp(18px,3vw,58px) clamp(86px,8vw,126px)!important;object-fit:contain!important}
body.single-product .berta-product-detail>.product>.summary{grid-column:1!important;grid-row:2!important;width:min(calc(100% - 48px),900px)!important;max-width:900px!important;margin:0 auto!important;padding:clamp(46px,6vw,92px) 0!important}
body.single-product .berta-product-detail :is(.related,.upsells){grid-column:1!important;width:min(calc(100% - 48px),1540px);margin-inline:auto!important}

/* The returning collection controls unfold from the centre of their own
   strip. The bar stays under the header; only its contents stream quickly. */
body.berta-flow-pinned .col-bar{top:calc(var(--header-h,64px) + clamp(10px,1vw,16px))!important}
body.berta-collection-flow .col-bar{transform-origin:50% 50%!important}
body.berta-flow-revealing .col-bar__inner{transform-origin:50% 50%;animation:berta-bar-centre-unfold var(--berta-bar-stream) cubic-bezier(.16,.72,.2,1) both}
@keyframes berta-bar-centre-unfold{
 0%{transform:translateY(26px) scaleX(.06) scaleY(.52);opacity:.08}
 18%{transform:translateY(18px) scaleX(.24) scaleY(.72);opacity:.48}
 56%{transform:translateY(7px) scaleX(.72) scaleY(.92);opacity:.9}
 100%{transform:translateY(0) scale(1);opacity:1}
}

/* Mobile CFG trades the cinematic 16:9 crop for a taller, thumb-friendly
   product stage while preserving the same source images and controls. */
.berta-device-mobile body.single-product .berta-product-detail .woocommerce-product-gallery .flex-viewport{aspect-ratio:4/5;max-height:78svh!important}
.berta-device-mobile body.single-product .berta-product-detail .woocommerce-product-gallery__image>a>img{max-height:78svh!important;padding:16px 12px 82px!important}
.berta-device-mobile body.single-product .berta-product-detail>.product>.summary{width:min(calc(100% - 32px),900px)!important;padding:38px 0 62px!important}
.berta-device-mobile body.single-product .berta-product-detail .summary form.cart{display:grid!important;grid-template-columns:64px minmax(0,1fr)!important;gap:10px!important}
.berta-device-mobile body.single-product .berta-fitting-actions{grid-template-columns:1fr!important}
.berta-device-mobile .col-shop .col-bar__inner{padding-inline:16px!important}
.berta-device-mobile .col-shop .col-field--search{min-height:52px}

@media(prefers-reduced-motion:reduce){body.berta-flow-revealing .col-bar__inner{animation:none!important}}
html.berta-profile-motion body.berta-flow-revealing .col-bar__inner{animation:berta-bar-centre-unfold var(--berta-bar-stream) cubic-bezier(.16,.72,.2,1) both!important}

/* Keep the filter rail physically inside its two rules. The rail itself is
   the fixed frame; only its controls fold/unfold from the frame centre. */
body.berta-collection-flow.berta-flow-hidden .col-bar,
body.berta-collection-flow.berta-flow-revealing .col-bar{
 transform:none!important;
 opacity:1!important;
 visibility:visible!important;
 clip-path:none!important;
 transition:none!important;
}
body.berta-collection-flow.berta-flow-hidden .col-bar{pointer-events:none}
body.berta-collection-flow.berta-flow-hidden .col-bar__inner{
 transform:scaleX(.035) scaleY(.72)!important;
 transform-origin:50% 50%!important;
 opacity:0!important;
}
body.berta-collection-flow.berta-flow-revealing .col-bar__inner{pointer-events:none}
@keyframes berta-bar-centre-unfold{
 0%{transform:scaleX(.035) scaleY(.72);opacity:0}
 20%{transform:scaleX(.2) scaleY(.82);opacity:.38}
 58%{transform:scaleX(.7) scaleY(.96);opacity:.88}
 100%{transform:scale(1);opacity:1}
}

/* Final interaction: no unfolding or scaling. Scroll direction only fades
   the complete rail out and back in at the exact same position. */
html body.berta-collection-flow .col-bar{
 transform:none!important;
 transition:opacity .28s ease,visibility 0s!important;
}
html body.berta-collection-flow .col-bar__inner{
 transform:none!important;
 animation:none!important;
 transition:none!important;
}
html body.berta-collection-flow.berta-flow-hidden .col-bar{
 transform:none!important;
 opacity:0!important;
 visibility:hidden!important;
 pointer-events:none!important;
 transition:opacity .28s ease,visibility 0s .28s!important;
}
html body.berta-collection-flow.berta-flow-hidden .col-bar__inner{
 transform:none!important;
 opacity:1!important;
}
html body.berta-collection-flow.berta-flow-revealing .col-bar__inner{
 transform:none!important;
 animation:none!important;
 opacity:1!important;
 pointer-events:auto!important;
}
