/* Actual Mexemai product designs, presented above the cinematic environments. */
.mex-redesign .mex-product-hero-row { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); align-items:center; gap:48px; flex:1; min-height:0; padding-bottom:22px; }
.mex-redesign .mex-product-hero-row .mex-slider-copy { max-width:none; margin:0; padding:0; }
.mex-redesign .mex-product-hero-row .mex-slider-copy h1 { font-size:clamp(42px,4.2vw,64px); }
.mex-redesign .mex-hero-slider:has([data-product-showcase]) { min-height:810px; height:calc(100svh - 84px); max-height:1020px; }
.mex-redesign .mex-slider-layout:has([data-product-showcase]) { padding-top:46px; }
.mex-hero-slider:has([data-product-showcase]) .mex-slide-image { filter:saturate(.7) brightness(.72); }
.mex-hero-slider:has([data-product-showcase]) .mex-slide-shade { background:linear-gradient(90deg,#030e18e8,#030e1840 47%,#030e18c9 83%,#030e18de),linear-gradient(0deg,#050d17,transparent 70%); }
.mex-product-showcase { position:relative; min-width:0; padding:0 0 8px; isolation:isolate; color:#eaf1f6; }
.mex-showcase-topline { display:flex; align-items:center; justify-content:space-between; gap:12px; color:#a9bfcc; font:500 8px/1.5 Arial,sans-serif; letter-spacing:.16em; padding-bottom:4px; }
.mex-showcase-topline > span:first-child:before { content:''; display:inline-block; width:5px; height:5px; margin-inline-end:8px; background:#81c8e3; border-radius:50%; box-shadow:0 0 14px #81c8e360; }
.mex-product-stage { height:350px; position:relative; perspective:1000px; --tilt-x:0deg; --tilt-y:0deg; touch-action:pan-y; }
.mex-product-rig { position:absolute; inset:0; transform:rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); transform-style:preserve-3d; transition:transform .2s ease-out; }
.mex-product-stage:before { content:''; position:absolute; inset:14% -12% 0; z-index:-1; background:radial-gradient(ellipse,#2379a12c,transparent 65%); pointer-events:none; }
.mex-product-floor { position:absolute; left:5%; right:0; bottom:8px; height:40px; border-radius:50%; background:radial-gradient(ellipse,#8cdbf838,transparent 65%); border:1px solid #72cce126; transform:rotateX(60deg); pointer-events:none; }
.mex-product-object { appearance:none; display:block; position:absolute; padding:0; border:0; background:transparent; color:#edf6fb; transition:transform .55s ease,opacity .55s ease,filter .55s ease; cursor:pointer; }
.mex-product-object img { width:100%; height:100%; object-fit:contain; display:block; pointer-events:none; filter:drop-shadow(0 20px 18px #00000080); }
.mex-product-object:focus-visible { outline:2px solid #dfc298 !important; outline-offset:8px; border-radius:8px; }
.mex-product-hub { width:240px; height:240px; left:0; bottom:33px; z-index:1; transform:rotate(-7deg) scale(.85); }
.mex-product-camera { width:188px; height:305px; right:26px; top:10px; z-index:2; transform:rotate(5deg); }
.mex-product-object-label { position:absolute; left:50%; bottom:-11px; display:inline-flex; justify-content:center; align-items:center; gap:10px; transform:translateX(-50%); border:1px solid #a9d3e02b; background:#081723df; border-radius:3px; color:#e7f1f5; padding:6px 10px; white-space:nowrap; font:500 9px/1.4 Arial,sans-serif; backdrop-filter:blur(12px); }
.mex-product-object-label span { color:#a5d5e4; }
.mex-product-camera .mex-product-object-label { top:0; bottom:auto; }
.mex-product-showcase[data-focus="hub"] .mex-product-hub { z-index:3; transform:translate(60px,-3px) rotate(-5deg) scale(1.12); }
.mex-product-showcase[data-focus="hub"] .mex-product-camera { z-index:1; transform:translate(28px,-9px) rotate(8deg) scale(.8); filter:brightness(.84); }
.mex-product-showcase[data-focus="camera"] .mex-product-camera { filter:drop-shadow(0 0 24px #7bc7f00d); }
.mex-product-showcase[data-focus="camera"] .mex-product-hub { filter:brightness(.9); }
.mex-product-showcase[data-finish="black"] .mex-product-hub img { filter:drop-shadow(0 0 1px #9cd9f0) drop-shadow(0 16px 20px #00000085); }
.mex-product-meta { display:flex; justify-content:space-between; align-items:start; gap:14px; padding-top:16px; border-top:1px solid #ffffff26; }
.mex-redesign .mex-product-meta [data-product-name] { color:#fff; font:500 18px/1.2 Arial,sans-serif; letter-spacing:-.03em; margin:0 0 7px; }
.mex-redesign .mex-product-meta [data-product-description] { font:400 10px/1.5 Arial,sans-serif; color:#aec1ca; margin:0; }
.mex-product-meta a { display:inline-flex; align-items:center; justify-content:center; width:35px; height:35px; flex-shrink:0; border:1px solid #ffffff35; border-radius:50%; color:#eaf3f7; font:400 21px/1 Arial,sans-serif; }
.mex-product-meta a:hover { color:#0b1720; background:#dfc298; }
.mex-product-finishes { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding-top:17px; }
.mex-product-finishes > span { font:400 9px/1.5 Arial,sans-serif; color:#b7c8d1; margin-inline-end:auto; }
.mex-product-finishes button { display:flex; align-items:center; gap:7px; min-height:38px; padding:6px 10px; border:1px solid #ffffff26; border-radius:3px; background:#ffffff06; color:#c9d9e1; font:400 10px/1.5 Arial,sans-serif; }
.mex-product-finishes button[aria-pressed="true"] { border-color:#a3cbdc; background:#ffffff10; color:#fff; }
.mex-product-finishes i { display:inline-block; width:12px; height:12px; border:1px solid #ffffff50; border-radius:50%; }
.mex-product-finishes [data-hub-finish="white"] i { background:#f0f0ef; }
.mex-product-finishes [data-hub-finish="black"] i { background:#1b2025; }
.mex-redesign .mex-product-finish-note { font:400 8px/1.5 Arial,sans-serif; color:#8ea8b7; margin:10px 0 0; letter-spacing:.03em; }
html:not(.js-products-enabled) .mex-product-finishes { display:none; }
.mex-redesign.mex-cinematic .mex-product-hero-row .mex-slider-copy h1 { font-size:clamp(44px,4.5vw,69px); }
.mex-redesign.mex-cinematic .mex-hero-slider:has([data-product-showcase]) { min-height:810px; height:calc(100svh - 116px); }
.mex-cinematic .mex-showcase-topline > span:first-child:before { background:#dfc298; box-shadow:0 0 14px #dfc29850; }
.mex-cinematic .mex-product-finishes button[aria-pressed="true"] { border-color:#dfc298; }
.mex-cinematic .mex-product-stage:before { background:radial-gradient(ellipse,#c49e6d12,transparent 64%); }
@media(min-width:1500px) { .mex-product-stage{height:400px}.mex-product-camera{width:210px;height:350px}.mex-product-hub{width:270px;height:270px}.mex-product-showcase[data-focus="hub"] .mex-product-hub{transform:translate(70px,-3px) rotate(-5deg) scale(1.12)} }
@media(min-width:768px) { .mex-hero-slider:has([data-product-showcase]) .mex-slide-image:first-child { width:150%; max-width:none; object-position:left center; } }
@media(max-width:1199px) {
    .mex-redesign .mex-product-hero-row { gap:20px; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); }
    .mex-redesign .mex-product-hero-row .mex-slider-copy h1,.mex-redesign.mex-cinematic .mex-product-hero-row .mex-slider-copy h1 { font-size:48px; }
    .mex-product-stage { height:310px; }
    .mex-product-camera { width:150px; height:255px; right:0; top:20px; }
    .mex-product-hub { width:205px; height:205px; left:-12px; bottom:37px; }
    .mex-product-showcase[data-focus="hub"] .mex-product-hub { transform:translate(35px,0) rotate(-5deg) scale(1.05); }
    .mex-product-showcase[data-focus="hub"] .mex-product-camera { transform:translate(5px,-10px) rotate(8deg) scale(.75); }
}
@media(max-width:767px) {
    .mex-redesign .mex-hero-slider:has([data-product-showcase]),.mex-redesign.mex-cinematic .mex-hero-slider:has([data-product-showcase]) { height:auto; min-height:0; max-height:none; }
    .mex-redesign .mex-slider-layout:has([data-product-showcase]) { min-height:0; padding-top:45px; }
    .mex-redesign .mex-product-hero-row { grid-template-columns:minmax(0,1fr); gap:32px; padding-bottom:30px; }
    .mex-redesign .mex-product-hero-row .mex-slider-copy h1,.mex-redesign.mex-cinematic .mex-product-hero-row .mex-slider-copy h1 { font-size:clamp(35px,9.4vw,50px); }
    .mex-product-showcase { max-width:420px; width:100%; margin-inline:auto; }
    .mex-product-stage { height:285px; }
    .mex-product-camera { width:150px; height:252px; right:25px; top:2px; }
    .mex-product-hub { width:200px; height:200px; bottom:28px; left:5px; }
    .mex-product-showcase[data-focus="hub"] .mex-product-hub { transform:translate(35px,3px) rotate(-5deg) scale(1.06); }
    .mex-product-showcase[data-focus="hub"] .mex-product-camera { transform:translate(20px,-9px) rotate(8deg) scale(.77); }
    .mex-showcase-topline { font-size:7px; }
    .mex-product-meta { padding-top:14px; }
    .mex-redesign .mex-product-meta [data-product-name] { font-size:17px; }
    .mex-product-finishes { padding-top:14px; }
    .mex-product-finishes button { min-height:44px; padding-inline:14px; }
    .mex-hero-slider:has([data-product-showcase]) .mex-slide-image { object-position:62% top; }
    .mex-hero-slider:has([data-product-showcase]) .mex-slide-image:first-child { object-position:30% top; }
    .mex-hero-slider:has([data-product-showcase]) .mex-slide-shade { background:linear-gradient(0deg,#050d17 26%,#050d1780 65%,#050d17c9),linear-gradient(90deg,#050d17d9,#050d1740); }
}
@media(max-width:359px) { .mex-product-camera{right:5px;width:140px;height:235px}.mex-product-hub{left:-4px;width:185px;height:185px}.mex-product-showcase[data-focus="hub"] .mex-product-hub{transform:translate(27px,0) rotate(-5deg) scale(1.05)}.mex-product-showcase[data-focus="hub"] .mex-product-camera{transform:translate(7px,-9px) rotate(8deg) scale(.74)}.mex-product-stage{height:270px} }
@media(prefers-reduced-motion:reduce) { .mex-product-rig,.mex-product-object{transition:none;transform:none !important}.mex-product-showcase[data-focus="hub"] .mex-product-hub{z-index:3} }
