/* CRM-driven video backgrounds for category, project and navigated pages.
   Shared proportions, muted playback, centered L loading and overlapping
   card rows mirror the Home Hero without touching global card styling. */
.interior-page-hero {
    position: relative;
    isolation: isolate;
    min-height: 720px;
    overflow: hidden;
    background: #080a0d;
}
.interior-page-hero .luxury-hero__poster {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    opacity: 1;
    transition: opacity .5s ease;
}
.interior-page-hero .luxury-hero__poster img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.interior-page-hero .luxury-hero__video {
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0;
    object-fit: cover;
    pointer-events: none;
}
.luxury-hero--video::after,
.page-about .atelier-profile__hero-media::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    backdrop-filter: saturate(.84) brightness(.82);
    -webkit-backdrop-filter: saturate(.84) brightness(.82);
    background:
        linear-gradient(180deg, rgba(5, 8, 12, .68) 0%, rgba(8, 12, 18, .42) 24%, rgba(11, 16, 22, .34) 52%, rgba(6, 9, 14, .62) 100%),
        radial-gradient(circle at 50% 45%, rgba(12, 17, 24, .08), rgba(8, 12, 18, .28) 58%, rgba(4, 7, 11, .48) 100%),
        radial-gradient(circle at 20% 18%, rgba(207, 166, 91, .10), transparent 34%),
        radial-gradient(circle at 82% 24%, rgba(255, 255, 255, .05), transparent 24%);
}
.interior-page-hero.has-hero-video.is-video-loading .luxury-hero__poster,
.interior-page-hero.has-hero-video:not(.is-video-ready):not(.is-video-fallback):not(.is-youtube-fallback-video) .luxury-hero__poster {
    opacity: .34;
    filter: brightness(.7) saturate(.7);
}
.interior-page-hero.has-hero-video.is-video-ready .luxury-hero__poster,
.interior-page-hero.has-hero-video.is-youtube-fallback-video .luxury-hero__poster {
    opacity: 0!important;
}
.interior-page-hero.has-hero-video.is-video-fallback .luxury-hero__poster {
    opacity: 1!important;
    filter: none;
}
.interior-page-hero.is-video-ready .luxury-hero__video { opacity: 1; }
.interior-page-hero__youtube-layer {
    z-index: 2;
    position: absolute;
    inset: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity .55s ease;
}
.interior-page-hero.is-video-ready .interior-page-hero__youtube-layer,
.page-home .luxury-hero.is-video-ready .interior-page-hero__youtube-layer {
    opacity: 1;
}
.interior-page-hero__youtube-player,
.interior-page-hero__youtube-layer iframe {
    position: absolute!important;
    left: 50%!important;
    top: 50%!important;
    width: var(--interior-yt-width, 100%)!important;
    height: var(--interior-yt-height, 100%)!important;
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    border: 0;
    pointer-events: none;
}
/* The fallback film must never flash ahead of a working YouTube stream. */
.interior-page-hero__fallback-video {display:none!important;}
.interior-page-hero.is-youtube-fallback-video .interior-page-hero__fallback-video,
.page-home .luxury-hero.is-youtube-fallback-video .interior-page-hero__fallback-video {
    display:block!important;
    opacity: 1!important;
}
/* Home's YouTube override reuses the same layer, loader and crops. */
.page-home .luxury-hero[data-interior-hero-youtube] .interior-page-hero__youtube-layer {
    position:absolute;
    z-index:2;
    inset:0;
}
.page-home .luxury-hero[data-interior-hero-youtube].is-video-ready .luxury-hero__poster {
    opacity:0!important;
}
.page-home .luxury-hero[data-interior-hero-youtube] .luxury-hero__poster {
    display:block!important;
}
.page-home .luxury-hero[data-interior-hero-youtube].is-video-fallback .luxury-hero__poster {
    opacity:1!important;
    filter:none;
}
.page-home .luxury-hero[data-interior-hero-youtube].is-youtube-fallback-video .luxury-hero__poster {
    opacity:0!important;
}
.interior-page-hero.is-video-ready .hero-l-loader,
.interior-page-hero.is-video-fallback .hero-l-loader,
.interior-page-hero.is-youtube-fallback-video .hero-l-loader,
.page-home .luxury-hero.is-youtube-fallback-video .hero-l-loader {
    opacity:0;
    visibility:hidden;
    transform:translate(-50%,-50%) scale(.86);
}
/* Rows overlap the moving background by the same amount as Home tiles. */
.page-brands .brand-rail.interior-hero-follow {
    position:relative;
    z-index:5;
    margin-top:-450px;
    padding-top:0;
    padding-bottom:54px;
    background:transparent;
}
.page-brands .interior-hero-follow .brand-grid {
    margin-bottom:0;
}
.interior-hero-follow--catalog {
    position:relative;
    z-index:5;
    margin-top:-450px;
    padding-top:0;
    background:transparent;
}
.interior-hero-follow--catalog .product-grid {
    position:relative;
    z-index:2;
}
.interior-hero-follow--intro {
    position:relative;
    z-index:5;
    margin-top:-110px;
    padding-top:42px;
    padding-bottom:32px;
    background:#f8f5ef;
    box-shadow:0 -18px 44px rgb(0 0 0 / 11%);
}
@media (max-width:980px) {
    .interior-page-hero {min-height:610px;}
}
@media (max-width:760px) {
    .interior-page-hero {min-height:470px;}
    .interior-page-hero .luxury-hero__video {display:block;}
    .page-brands .brand-rail.interior-hero-follow {
        margin-top:-120px;
        padding-top:0;
        padding-bottom:24px;
    }
    .page-brands .interior-hero-follow .brand-grid {margin-bottom:0;}
    .interior-hero-follow--catalog {margin-top:-175px;padding-top:0;}
    .interior-hero-follow--intro {margin-top:-175px;padding-top:25px;}
}
@media (max-width:420px) {
    .interior-page-hero {min-height:440px;}
}
@media (prefers-reduced-motion:reduce) {
    .interior-page-hero .luxury-hero__video,
    .interior-page-hero__youtube-layer {display:none!important;}
    .interior-page-hero .hero-l-loader {display:none!important;}
    .interior-page-hero .luxury-hero__poster {opacity:1!important;filter:none!important;}
}

/* About keeps its editorial hero layout; only the newly configurable video
   and Home's signature L loader are shared, not its headings or buttons. */
.page-about .atelier-profile__hero-media .hero-l-loader {
    z-index:3;
}
.page-about .atelier-profile__hero-media.is-video-ready .hero-l-loader,
.page-about .atelier-profile__hero-media.is-video-fallback .hero-l-loader {
    opacity:0;
    visibility:hidden;
    transform:translate(-50%,-50%) scale(.86);
}
@media (prefers-reduced-motion:reduce) {
    .page-about .atelier-profile__hero-media .hero-l-loader {display:none!important;}
}

/* Background films are decorative. Never expose browser-native controls on
   Home, category, project or About heroes (particularly iOS WebKit). */
.luxury-hero--video .luxury-hero__video,
.page-about .atelier-profile__hero-player video {
    pointer-events: none !important;
    -webkit-appearance: none;
}
.luxury-hero--video .luxury-hero__video::-webkit-media-controls,
.luxury-hero--video .luxury-hero__video::-webkit-media-controls-enclosure,
.luxury-hero--video .luxury-hero__video::-webkit-media-controls-panel,
.luxury-hero--video .luxury-hero__video::-webkit-media-controls-overlay-play-button,
.page-about .atelier-profile__hero-player video::-webkit-media-controls,
.page-about .atelier-profile__hero-player video::-webkit-media-controls-enclosure,
.page-about .atelier-profile__hero-player video::-webkit-media-controls-panel,
.page-about .atelier-profile__hero-player video::-webkit-media-controls-overlay-play-button {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* Contact does not use a video hero. Show its original introduction
   directly below the navigation, without the video overlap offset. */
.contact-page-head {
    padding-top: 44px;
    padding-bottom: 48px;
}
.simple-page-head.contact-page-head h1,
.simple-page-head.contact-page-head > .container > p {
    display: block;
}
.simple-page-head.contact-page-head h1 {
    margin: 12px 0 12px;
    font-size: clamp(20px, 3.8vw, 30px);
    line-height: 1.2;
}
.contact-page-head + .contact-section.section { padding-top: 70px; }
@media (max-width: 760px) {
    .contact-page-head { padding-top: 30px; padding-bottom: 32px; }
    .simple-page-head.contact-page-head h1 { font-size: clamp(18px, 3vw, 25px); }
.simple-page-head.contact-page-head > .container > p {
    font-size: 12.8px;
    text-align: justify;
    margin: 0px 10px;
}
    .contact-page-head + .contact-section.section { padding-top: 42px; }
}