
/* NOIRÉ studio and reader refinements — shared proportional layout, 2026-11-03. */
.luxe-hero{isolation:isolate;max-width:100%;}
.luxe-hero__image{background-size:cover;background-repeat:no-repeat;inset:0;will-change:opacity;}
.luxe-hero__image--incoming{opacity:0;pointer-events:none;z-index:0;}
.luxe-hero__shade{z-index:1;pointer-events:none;}
.luxe-hero__content{z-index:2;}
.luxe-hero .luxe-arrow,.luxe-hero .luxe-dots,.luxe-hero .luxe-actions{display:none!important;}
.luxe-hero__content h1{max-width:100%;text-wrap:balance;overflow-wrap:anywhere;}
.luxe-beforeafter{touch-action:pan-y;isolation:isolate;}
.luxe-beforeafter img{object-fit:cover;object-position:50% 23%;aspect-ratio:auto;max-width:none;}
.luxe-beforeafter .luxe-before{filter:grayscale(.7) brightness(.83) contrast(.96)}
.luxe-beforeafter .luxe-after{filter:saturate(1.12) contrast(1.04);will-change:clip-path;}
.luxe-beforeafter .luxe-slider-line,.luxe-beforeafter .luxe-slider-knob,.luxe-beforeafter .luxe-badge{pointer-events:none;}
.luxe-beforeafter .luxe-slider-line{z-index:3;box-shadow:0 0 14px #0006;}
.luxe-beforeafter .luxe-slider-knob{z-index:4;box-shadow:0 5px 18px #0006;}
.luxe-beforeafter .luxe-badge{z-index:3;}
.luxe-beforeafter input[type=range]{z-index:5;touch-action:none;}
.luxe-beforeafter:focus-within{outline:1px solid #d3ad6e;outline-offset:-1px;}
.luxe-simulator{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);min-height:0;}
.luxe-beforeafter{min-height:clamp(300px,35vw,440px)}
.luxe-sim-content{min-width:0;padding:clamp(21px,2.2vw,35px);}
.luxe-sim-content h2{font-size:clamp(2.2rem,3.3vw,4.2rem);line-height:.97;overflow-wrap:anywhere;}
.luxe-mini-models{gap:7px;}
.luxe-lower>section{min-width:0;}
.luxe-hero__shade{background:linear-gradient(90deg,#080708ec 0%,#0b0909c9 31%,#0b090957 60%,#09080618 100%)}
@media(min-width:901px){
 .luxe-hero{height:clamp(420px,calc(100svh - 200px),580px)}
 .luxe-hero__content{top:16%;width:min(520px,47%)}
}
@media(max-width:900px){
 .luxe-hero{min-height:480px;height:clamp(480px,75svh,650px)}
 .luxe-hero__content{top:auto;bottom:clamp(25px,4vw,55px);left:clamp(24px,5vw,50px);width:min(68%,500px)}
 .luxe-hero__shade{background:linear-gradient(90deg,#090806dd,#0908068a 57%,#09080612)}
 .luxe-simulator{grid-template-columns:minmax(0,1fr);gap:0}
 .luxe-beforeafter{min-height:clamp(285px,55vw,420px)}
 .luxe-lower{gap:0}
}
@media(max-width:620px){
 .luxe-topline{padding:8px 12px;min-height:30px;}
 .luxe-hero{height:clamp(440px,78svh,590px);min-height:0;max-height:690px;}
 .luxe-hero__image{background-size:cover!important;background-position:65% 25%!important;}
 .luxe-hero__shade{background:linear-gradient(90deg,#080708c4 0%,#08070890 55%,#08070820 100%),linear-gradient(0deg,#070606ed 0%,transparent 62%)}
 .luxe-hero__content{top:auto;bottom:22px;left:clamp(12px,4vw,22px);width:min(90%,370px);}
 .luxe-hero__content h1{font-size:clamp(2.55rem,10.2vw,3.7rem);line-height:.98;max-width:10ch;}
 .luxe-hero__content>p:not(.eyebrow){max-width:33ch;font-size:clamp(11px,3.1vw,13px);line-height:1.48;}
 .luxe-hero .eyebrow{font-size:9px;letter-spacing:.12em;}
 .luxe-beforeafter{min-height:clamp(245px,85vw,370px);}
 .luxe-beforeafter img{object-position:center 26%;}
 .luxe-badge{bottom:8px!important;padding:5px 8px;font-size:9px!important;}
 .luxe-sim-content{padding:clamp(14px,4vw,23px)!important;}
 .luxe-sim-content h2{font-size:clamp(2.3rem,10vw,3.7rem);}
 .luxe-sim-content>p:not(.eyebrow){line-height:1.55;}
 .luxe-mini-models{margin:8px 0;max-height:78px;}
 .luxe-mini-models img{height:69px;width:57px;object-fit:cover;}
 .luxe-lower>section{padding:clamp(16px,4vw,25px)!important;}
 .luxe-lower .luxe-heading{gap:8px;align-items:start;}
 .luxe-lower .luxe-heading h2{font-size:clamp(1.7rem,7.8vw,2.6rem);}
}
/* Mobile magazine: swipe/tap to turn pages. Keep text and links above page folios. */
.n-mag__paper__text{min-width:0;}
.n-mag__paper__cta{z-index:4;}
@media(max-width:620px){
 .n-mag__tools,.n-mag__edge{display:none!important;}
 .n-mag__controls #nm-prev,.n-mag__controls #nm-next,.n-mag__controls #nm-first,.n-mag__controls #nm-last{display:none!important;}
 .n-mag__controls{justify-content:center;min-height:47px;padding:9px 12px;}
 .n-mag__range{flex:1;max-width:100%;width:100%;}
 .n-mag__range span{font-size:11px;}
 .n-mag__viewer{padding:8px!important;touch-action:pan-y;}
 .n-mag__spread{width:min(100%,calc((100dvh - 208px)*.7071))!important;}
 .n-mag__paper__text{padding:7cqw 6.5cqw 18cqw!important;justify-content:flex-end;}
 .n-mag__paper__title{font-size:clamp(19px,9.5cqw,47px);line-height:.95;max-height:50%;margin:3cqw 0 2.2cqw;}
 .n-mag__paper__intro{font-size:clamp(10px,3.0cqw,13px);line-height:1.32;-webkit-line-clamp:3;}
 .n-mag__paper__kicker{font-size:clamp(8px,2.4cqw,11px);}
 .n-mag__paper__cta{background:transparent!important;box-shadow:none!important;border:0!important;padding:1cqw 0!important;text-decoration:underline;text-underline-offset:4px;text-decoration-color:currentColor;color:inherit!important;max-width:calc(100% - 6px);font-size:clamp(9px,2.9cqw,12px);line-height:1.3;margin-top:4cqw!important;}
 .n-mag__paper__folio{bottom:2.5cqw!important;left:6.5cqw!important;font-size:clamp(8px,2.2cqw,10px);}
 .n-mag__paper--file .n-mag__paper__cta{bottom:10%!important;right:7%;padding:6px 8px!important;background:#000a!important;color:#fff!important;}
 .n-mag__flip-layer{inset:8px!important;}
 .n-mag__flip-leaf{width:100%!important;height:100%!important;left:0!important;right:auto!important;top:0!important;transform-origin:left center;}
 .n-mag__flip-leaf--backward{transform-origin:right center;}
 .n-mag__hint{gap:10px;flex-wrap:wrap;font-size:9px;}
}
@media(max-width:370px){
 .n-mag__paper__text{padding-bottom:20cqw!important;}
 .n-mag__paper__title{font-size:clamp(18px,9cqw,38px);}
}
@media (prefers-reduced-motion:reduce){
 .luxe-hero__image{transition:none!important;}
}

@media(max-width:620px){
  .n-mag__flip-leaf--forward{animation:noire-mobile-page-next .82s cubic-bezier(.22,.6,.22,1) both!important;}
  .n-mag__flip-leaf--backward{animation:noire-mobile-page-prev .82s cubic-bezier(.22,.6,.22,1) both!important;}
}
@keyframes noire-mobile-page-next{0%{transform:rotateY(0deg);filter:brightness(1);box-shadow:0 8px 36px #0007}49%{filter:brightness(.62)}100%{transform:rotateY(-178deg);filter:brightness(.95);box-shadow:-12px 12px 40px #0007}}
@keyframes noire-mobile-page-prev{0%{transform:rotateY(0deg);filter:brightness(1)}49%{filter:brightness(.64)}100%{transform:rotateY(178deg);filter:brightness(.95)}}
@media(prefers-reduced-motion:reduce){.n-mag__flip-leaf--forward,.n-mag__flip-leaf--backward{animation:none!important}}

/* 2026-11-04: final comparison alignment: before on the left, distinct after image on the right. */
#luxe-before-after .luxe-after{clip-path:inset(0 0 0 var(--split))!important;}
#luxe-before-after .luxe-slider-line{left:var(--split);}
/* Avoid stretched imagery; keep proportions in every editorial panel. */
.luxe-beforeafter img{object-fit:cover;object-position:center center;}
@media(min-width:621px) and (max-width:1180px){
 .luxe-hero{min-height:440px;max-height:600px;height:clamp(440px,64svh,600px);}
 .luxe-hero__content{width:min(53%,480px);left:clamp(27px,5vw,60px);bottom:auto;top:17%;}
 .luxe-hero__content h1{font-size:clamp(3rem,6vw,5rem);}
 .luxe-hero__image{background-size:cover;}
 .luxe-simulator{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)}
 .luxe-beforeafter{min-height:390px;}
}
@media(max-width:620px){
 .luxe-hero{height:clamp(425px,82svh,580px)!important;min-height:425px!important;}
 .luxe-hero__content{width:calc(100% - 26px)!important;max-width:unset;}
 .luxe-hero__content h1{font-size:clamp(2.45rem,10.6vw,3.6rem)!important;max-width:12ch;}
 .luxe-beforeafter{min-height:clamp(260px,85vw,400px)!important;}
 .luxe-sim-content{padding:22px 14px!important;}
}
/* Button text must be readable against any light gold gradient. */
.luxe-gold-btn,.btn:not(.ghost),.quickadd-button,.cart-checkout,.picker-add,.magazine-quick-book button{color:#15100b!important;}
@media(max-width:1180px){
 :is(.btn,.luxe-gold-btn,.luxe-outline-btn,.quickadd-button,.cart-checkout,.picker-add,.video-channel__filters button,.video-channel__links a,.video-channel__more a,.luxe-sim-tabs button,.luxe-topline a){font-size:15px!important;line-height:1.35;}
 .luxe-topline{font-size:clamp(12px,1.3vw,15px)!important;gap:14px;}
 .luxe-topline span{font-size:inherit;}
 .luxe-topline a{color:#11100e!important;background:linear-gradient(95deg,#f7dfaf,#d8ac65);padding:9px 12px;white-space:nowrap;}
 .video-channel__hero h1,.media-hub__hero h1{font-size:clamp(2.5rem,5.6vw,5.6rem)!important;}
 .video-channel__hero{align-items:center;gap:18px;}
 .video-channel__hero>div{min-width:0;}
 .video-channel__caption h2{font-size:clamp(2rem,3.5vw,3rem);}
 .video-channel__filters button{min-height:42px;}
}
@media(max-width:767px){
 :is(.video-channel__hero,.media-hub__hero){padding:clamp(22px,4.8vw,40px) clamp(13px,4vw,24px)!important;}
 .video-channel__hero h1,.media-hub__hero h1{font-size:clamp(2.45rem,8.5vw,3.9rem)!important;line-height:1.02;margin:8px 0 14px;}
 .video-channel__hero p:not(.eyebrow),.media-hub__hero p:not(.eyebrow){font-size:clamp(13px,3.7vw,15px);}
 .video-channel__layout{margin:14px clamp(10px,3vw,20px);gap:12px;}
 .video-channel__aside,.video-channel__caption{padding:clamp(12px,3vw,18px);}
 .video-channel__caption h2{font-size:clamp(1.9rem,7vw,2.8rem);line-height:1.08;}
 .video-channel__caption p{font-size:14px;}
 .video-channel__tile img{aspect-ratio:16/9;object-fit:cover;}
 .video-channel__more{padding:24px 14px;}
 .video-channel__more h2{font-size:clamp(2.15rem,7vw,3rem);line-height:1.03;}
 .video-channel__links a{min-height:42px;display:flex;align-items:center;}
 .media-hub__tiles{margin:0 12px 20px;gap:12px;}
 .media-hub__tile{height:clamp(260px,78vw,390px);}
 .media-hub__tile>div{padding:18px;}
 .media-hub__tile h2{font-size:clamp(2rem,8vw,3rem);}
 .media-hub__cross{padding:18px 12px 28px;gap:12px;}
 .media-hub__cross a{font-size:15px!important;line-height:1.4;min-height:46px;display:grid;place-items:center;}
}
@media(min-width:768px) and (max-width:1180px){
 .video-channel__layout{grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);gap:14px;margin:20px 3%;}
 .video-channel__playlist{display:grid;grid-template-columns:1fr;max-height:420px;}
 .video-channel__tile img{width:80px;}
 .media-hub__tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:0 2% 22px;}
 .media-hub__tile{height:420px;}
 .media-hub__tile>div{padding:18px 11px;}
 .media-hub__tile h2{font-size:clamp(2rem,3vw,3rem);}
 .media-hub__tile p{font-size:13px;}
}

/* Professional page-curl engine proportions: same 1:√2 portrait page geometry everywhere. */
.n-mag__viewer.nm-real-pageflip{perspective:none;}
.n-mag__spread.nm-book-mode{position:relative;display:block!important;aspect-ratio:auto!important;width:min(100%,calc((100dvh - 250px)*1.414))!important;height:clamp(330px,calc(100dvh - 248px),780px)!important;max-height:calc(100dvh - 210px)!important;overflow:visible!important;filter:drop-shadow(0 12px 22px #0009);}
.n-mag__spread.nm-book-mode .n-mag__paper{flex:none!important;aspect-ratio:auto!important;position:absolute!important;width:100%;height:100%;box-shadow:inset 0 0 16px #0001;}
.n-mag__spread.nm-book-mode .stf__parent,.n-mag__spread.nm-book-mode .stf__wrapper{max-width:100%;}
.n-mag__viewer.nm-real-pageflip .n-mag__flip-layer{display:none!important;}
.n-mag__paper__text{padding-bottom:max(32px,13cqw)!important;}
.n-mag__paper__folio{bottom:max(8px,2.3cqw)!important;pointer-events:none;}
.n-mag__paper__cta{position:relative;z-index:7;margin-bottom:clamp(4px,1.4cqw,10px);background:transparent!important;box-shadow:none!important;border:0!important;padding:4px 0!important;color:inherit!important;font-weight:800;text-decoration:underline;text-decoration-color:currentColor;text-underline-offset:4px;line-height:1.35;}
.n-mag__paper--product .n-mag__paper__cta{color:#362515!important;background:transparent!important;}
.n-mag__paper--file .n-mag__paper__cta{position:absolute;bottom:10%;right:6%;background:#111b!important;color:#fff!important;padding:8px 12px!important;}
@media(min-width:901px){
 .n-mag__shell{min-height:0!important;max-width:1500px!important;}
 .n-mag__viewer{padding:10px 30px!important;min-height:min(560px,calc(100dvh - 250px))!important;}
 .n-mag__spread.nm-book-mode{height:min(630px,calc(100dvh - 245px))!important;max-height:unset!important;width:min(100%,calc((100dvh - 240px)*1.414))!important;}
 .n-mag__edge{width:29px!important;height:45px!important;font-size:17px!important;}
 .n-mag__edge--prev{left:10px!important}.n-mag__edge--next{right:10px!important}
}
@media(max-width:900px){
 .n-mag__spread.nm-book-mode{width:min(100%,calc((100dvh - 240px)*.7071))!important;height:min(700px,calc(100dvh - 235px))!important;max-height:none!important;}
}
@media(max-width:620px){
 .n-mag__viewer{min-height:0!important;padding:9px!important;}
 .n-mag__spread.nm-book-mode{width:min(100%,calc((100dvh - 215px)*.7071))!important;height:clamp(280px,calc(100dvh - 230px),640px)!important;max-height:calc(100dvh - 208px)!important;}
 .n-mag__paper__text{padding:7cqw 6cqw 21cqw!important;}
 .n-mag__paper__title{max-height:40%;font-size:clamp(16px,9cqw,40px)!important;line-height:.95;}
 .n-mag__paper__intro{font-size:clamp(10px,3cqw,14px)!important;-webkit-line-clamp:3;}
 .n-mag__paper__cta{font-size:clamp(10px,3.2cqw,15px)!important;margin-top:3cqw!important;}
 .n-mag__paper__folio{bottom:2.2cqw!important;left:6cqw!important;}
 .n-mag__controls{min-height:44px;}
 .n-mag__topbar{min-height:34px;}
}
@media(orientation:landscape) and (max-width:1000px) and (max-height:660px){
 .n-mag__spread.nm-book-mode{height:min(470px,calc(100dvh - 142px))!important;width:min(100%,calc((100dvh - 145px)*1.414))!important;max-height:unset!important;}
 .n-mag__shell{margin-top:5px;min-height:0!important;}
}

/* Fix: StPageFlip drawSoft sets top/left/transform but does not set position:absolute. Never let active pages participate in vertical flow. */
.n-mag__spread.nm-book-mode .stf__block>.n-mag__paper.stf__item{position:absolute!important;box-sizing:border-box!important;}

/* Distinct editorial 2026: preserve source page aspect ratio on every breakpoint. */
#noire-magazine-app .n-mag__spread.nm-book-mode .n-mag__paper--file > img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
}
#noire-magazine-app .n-mag__spread.nm-book-mode .n-mag__paper--file {
  background: #f7f2eb !important;
  overflow: hidden !important;
}
