/* R58: scene-led discovery, calm side navigation and a full-width light study. */
html[data-theme] .home-page .site-header:not(.compact){background:transparent;border-color:transparent;box-shadow:none;--ui-fg:var(--sand);--ui-heading:var(--sand);--ui-border:color-mix(in srgb,var(--sand) 35%,transparent)}
html[data-theme] .home-page .site-header:not(.compact) :is(.header-logo-lettering,.header-logo-waves){fill:var(--sand)}
html[data-theme] .home-page .site-header:not(.compact) :is(.theme-toggle,.menu-trigger){background:color-mix(in srgb,var(--deep-brown) 55%,transparent)!important;color:var(--sand)!important;border-color:color-mix(in srgb,var(--sand) 30%,transparent)}
html[data-theme] .home-page .hero-media:before{background:linear-gradient(180deg,color-mix(in srgb,var(--deep-brown) 55%,transparent),transparent);height:160px}
html[data-theme] .site-header.compact{background:color-mix(in srgb,var(--ui-bg) 97%,transparent);border-color:var(--ui-border)}
/* No expanding circle or heavy blur: one panel and a soft scrim. */
html[data-theme] #menu.menu58{--ui-fg:var(--sand);--ui-heading:var(--sand);--ui-border:color-mix(in srgb,var(--sand) 22%,transparent);color:var(--sand);visibility:hidden;pointer-events:none;transition:visibility 0s .6s}
html[data-theme] #menu.menu58.open{visibility:visible;pointer-events:auto;transition:visibility 0s}
html[data-theme] #menu.menu58 .menu-scrim{background:color-mix(in srgb,var(--deep-brown) 48%,transparent);backdrop-filter:none;opacity:0;transition:opacity .6s ease}
html[data-theme] #menu.menu58.open .menu-scrim{opacity:1}
html[data-theme] #menu.menu58 .menu58-panel{--ui-bg:var(--deep-brown);--ui-soft:color-mix(in srgb,var(--deep-brown) 87%,var(--clay));--ui-hover:var(--peach);position:absolute;right:16px;left:auto;top:16px;width:min(480px,calc(100% - 32px));height:calc(100svh - 32px);max-height:none;border-radius:10px;padding:0 32px 26px;display:flex;flex-direction:column;background:var(--deep-brown);border:1px solid var(--ui-border);overflow:auto;opacity:0;transform:translate3d(36px,0,0);box-shadow:0 12px 50px color-mix(in srgb,var(--deep-brown) 25%,transparent);transition:transform .6s cubic-bezier(.22,.7,.2,1),opacity .5s ease}
html[data-theme] #menu.menu58.open .menu58-panel{opacity:1;transform:none}
html[data-theme] #menu.menu58 .menu-popover-top{min-height:86px;flex:none;gap:14px;border-color:var(--ui-border)}
.menu58-name{margin-right:auto;font:500 11px/1.6 Manrope,sans-serif;letter-spacing:.12em}.menu58-panel .brand-mark{width:25px;height:25px;flex:none}
html[data-theme] #menu.menu58 .menu-popover-close{flex:none;background:transparent;color:var(--sand);border-color:var(--ui-border)}
html[data-theme] #menu.menu58 .menu-popover-nav{padding:20px 0;margin-block:auto;gap:0}
html[data-theme] #menu.menu58 .menu-popover-link{display:flex;align-items:center;gap:20px;min-height:64px;padding:15px 2px;border-bottom:1px solid var(--ui-border);font:500 clamp(20px,2vw,26px)/1.35 Lora,serif!important;color:var(--sand)!important;letter-spacing:-.02em;text-decoration:none!important;background:transparent;transition:color .4s ease,padding .4s ease}
html[data-theme] #menu.menu58 .menu-popover-link::before{content:attr(data-nav-number);position:static;transform:none!important;display:block;background:none;border-radius:0;width:18px;height:auto;font:500 10px/1 Manrope,sans-serif;opacity:.6;flex:none}
html[data-theme] #menu.menu58 .menu-popover-link:is(:hover,:focus-visible){color:var(--peach)!important;padding-left:8px;background:transparent}
html[data-theme] #menu.menu58 .menu-popover-link[aria-current=page]{color:var(--button-sand)!important}
html[data-theme] #menu.menu58 .menu-collection-sub{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;padding:10px 0 16px 38px;background:none}
html[data-theme] #menu.menu58 .menu-sub-link{min-height:42px;font:500 13px/1.5 Manrope,sans-serif;padding:10px 0;color:var(--sand);text-decoration:none!important;border:0;background:transparent;transition:color .4s ease}
html[data-theme] #menu.menu58 .menu-sub-link:is(:hover,:focus-visible){color:var(--peach)}
html[data-theme] #menu.menu58 .menu-collection-overview{grid-column:1/-1;color:var(--button-sand);font-size:11px;border-bottom:1px solid var(--ui-border);margin-bottom:5px;text-transform:none}
.menu58-contact{display:flex;flex-direction:column;gap:10px;padding-top:24px;border-top:1px solid var(--ui-border);flex:none}.menu58-contact a{font:400 12px/1.6 Manrope,sans-serif;color:var(--sand)}
/* A framed scene, plus a separate reading surface. All text stays off the product. */
html[data-theme] .intro-section.atmosphere-slider{width:calc(100% - clamp(32px,6vw,96px));max-width:1600px;margin:clamp(40px,6vw,84px) auto;overflow:visible;grid-template-rows:auto auto;background:transparent;border-top:1px solid var(--line);padding-top:30px;touch-action:pan-y;cursor:grab}
html[data-theme] .atmosphere-slide{display:grid;grid-template-columns:.7fr 1.3fr;gap:5vw;align-items:center;min-height:0;transition:opacity .65s ease,visibility 0s .65s;grid-area:1/1}
html[data-theme] .atmosphere-slide.is-active{transition:opacity .65s ease;z-index:1}
html[data-theme] .atmosphere-media{position:relative;inset:auto;grid-column:2;grid-row:1;z-index:0;aspect-ratio:16/10;overflow:hidden;border-radius:8px;background:var(--deep-brown)}
html[data-theme] .atmosphere-media:after{display:none}
html[data-theme] .atmosphere-media img{object-position:center;object-fit:cover;transform:none;transition:opacity .65s ease}
html[data-theme] .atmosphere-copy{grid-column:1;grid-row:1;width:100%;max-width:none;margin:0;padding:30px 0;--text:var(--ui-fg);--heading:var(--ui-heading);opacity:0;transform:translateY(10px);transition:opacity .35s ease,transform .5s ease}
html[data-theme] .atmosphere-slide.is-active .atmosphere-copy{opacity:1;transform:none;transition:opacity .55s .12s,transform .6s .12s}
html[data-theme] .atmosphere-copy :is(h2,.eyebrow,p){color:var(--ui-heading)!important}
html[data-theme] .atmosphere-copy h2{font-size:clamp(30px,3.6vw,54px);margin:18px 0 24px;line-height:1.18;max-width:460px}
html[data-theme] .atmosphere-copy>p:not(.eyebrow){color:var(--ui-fg)!important;font-size:14px;line-height:1.85;margin-bottom:28px}
html[data-theme] .atmosphere-controls{position:relative;grid-area:2/1;left:auto;bottom:auto;transform:none;width:100%;max-width:none;margin:24px 0 0;padding:20px 0 0;border-top:1px solid var(--line);gap:24px;justify-content:space-between}
html[data-theme] .atmosphere-dots{background:none;padding:0;border-radius:0;gap:24px;align-items:center}
html[data-theme] .atmosphere-dots button{display:flex;align-items:center;gap:8px;width:auto;min-height:44px;padding:8px 0;color:var(--ui-fg);opacity:.55;border-bottom:2px solid transparent;transition:opacity .35s,border-color .35s}
html[data-theme] .atmosphere-dots button[aria-pressed=true]{opacity:1;border-color:var(--ui-heading)}
html[data-theme] .atmosphere-dots span{width:auto;height:auto;background:none;opacity:1;transform:none!important;font:500 12px/1.6 Manrope,sans-serif}
.atmosphere-dots small{font:500 9px/1.6 Manrope,sans-serif}
.atmosphere58-tools{display:flex;align-items:center;gap:24px}.atmosphere58-arrows{display:flex;gap:8px}
.atmosphere58-arrows button{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:var(--ui-bg);color:var(--ui-fg);transition:background .3s,color .3s}
.atmosphere58-arrows button:hover{background:var(--button-bg);color:var(--button-text)}.atmosphere58-arrows svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
/* Collection information and cutout share one base. */
html[data-theme] .showcase{padding-block:clamp(48px,6vw,88px);border:0}
html[data-theme] .showcase-cards{grid-auto-columns:calc((100% - 26px)/2.15);gap:26px;padding-bottom:20px}
html[data-theme] .home-card58 .collection-compare-visual{aspect-ratio:16/10;margin:0;flex:none}
html[data-theme] .home-card58>.home-card58-info{margin:0;display:grid;grid-template-columns:1fr 34%;align-items:center;gap:18px;padding:24px;min-height:185px}
.home-card58-text{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:9px}
html[data-theme] .home-card58 .collection-compare-number{font-size:9px;margin:0;letter-spacing:.06em}.home-card58 .card-description{font:400 12px/1.65 Manrope,sans-serif;margin:0!important}
html[data-theme] .home-card58 strong{font-size:clamp(24px,2.2vw,34px);margin:0}.home-card58 .collection-compare-action{font-size:9px!important;padding:10px 0 0!important;margin-top:4px;border:0}
html[data-theme] .showcase-cards .studio-window{position:relative;display:block;inset:auto;width:100%;aspect-ratio:1;border-radius:50%;border:0;padding:5px;background:var(--sand);box-shadow:none;overflow:hidden}
html[data-theme] .showcase-cards .studio-window .home-cutout{object-fit:contain;position:absolute;inset:0;width:100%;height:100%;padding:8px}
html[data-theme] .story-bridge{max-width:1600px;width:calc(100% - clamp(32px,6vw,96px));margin:clamp(40px,6vw,84px) auto;display:grid;grid-template-columns:1.2fr .8fr;gap:6vw;align-items:center;min-height:0;background:none;overflow:visible;padding:0}
html[data-theme] .story-bridge .bridge-image{position:relative;min-height:0;height:auto;aspect-ratio:3/2;overflow:hidden;border-radius:6px}
html[data-theme] .story-bridge .bridge-copy{padding:32px 0;background:none;min-height:0}
html[data-theme] .bridge-notes{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:26px}.bridge-image img{transform:scale(calc(1 + var(--bridge-progress,0)*.035))!important;transition:transform .1s linear}
/* The comparison is the section's main canvas. Scene pickers are below it. */
html[data-theme] .compare-section{padding-block:clamp(50px,7vw,96px);border:0}
html[data-theme] .compare-section>.container{width:100%;max-width:none}
html[data-theme] .compare-section .compare-heading{width:calc(100% - clamp(32px,6vw,96px));max-width:1600px;margin:0 auto 30px;grid-template-columns:1.2fr .8fr;gap:4vw;align-items:end}
html[data-theme] .compare-heading .scene-description{grid-column:auto;max-width:360px;font-size:14px;justify-self:end}
html[data-theme] .comparison{width:100%;max-width:none;aspect-ratio:16/9;max-height:78svh;border-radius:0;box-shadow:none;touch-action:pan-y;isolation:isolate;background:var(--deep-brown)}
html[data-theme] .comparison img{object-fit:cover!important;user-select:none;-webkit-user-drag:none}
html[data-theme] .compare-divider{width:1px;background:var(--sand)}
html[data-theme] .compare-divider>span{width:54px;height:54px;background:var(--sand);color:var(--deep-brown);border:0;box-shadow:0 3px 20px color-mix(in srgb,var(--deep-brown) 30%,transparent)}
html[data-theme] .compare-label{top:24px;padding:10px 14px;border-radius:999px;font-size:10px;background:color-mix(in srgb,var(--deep-brown) 86%,transparent);color:var(--sand)}
html[data-theme] .compare-label.day{left:24px}html[data-theme] .compare-label.night{right:24px}
html[data-theme] #compare-hint{display:block;width:calc(100% - clamp(32px,6vw,96px));max-width:1600px;margin:14px auto 0;text-align:left;font:400 11px/1.7 Manrope,sans-serif;color:var(--ui-fg)}
html[data-theme] .compare-section .collection-image-note{width:calc(100% - clamp(32px,6vw,96px));max-width:1600px;margin:4px auto 0;text-align:left}
html[data-theme] .compare-meta{width:calc(100% - clamp(32px,6vw,96px));max-width:1600px;margin:24px auto;display:flex;justify-content:space-between;align-items:center;gap:20px}
html[data-theme] .scene58-picker{display:grid;grid-template-columns:repeat(3,1fr);width:calc(100% - clamp(32px,6vw,96px));max-width:1600px;margin:0 auto;gap:16px}
html[data-theme] .scene58-picker button{border:1px solid var(--line);border-radius:6px;display:flex;align-items:center;gap:20px;text-align:left;background:var(--ui-bg);color:var(--ui-fg);padding:14px;min-width:0;transition:border-color .3s,background .3s}
html[data-theme] .scene58-picker button[aria-pressed=true]{border-color:var(--ui-heading);background:var(--ui-soft)}
.scene58-picker img{display:block;width:92px;height:68px;background:var(--sand);object-fit:contain;border-radius:4px;flex:none}
.scene58-picker span{display:flex;flex-direction:column;gap:7px}.scene58-picker small{font:500 10px/1.5 Manrope,sans-serif;letter-spacing:.06em}.scene58-picker strong{font:500 clamp(18px,2vw,26px)/1.3 Lora,serif}
/* Thumbnail navigation and enlarged-image browsing. */
html[data-theme] .gallery-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
html[data-theme] .gallery-tabs button{display:flex;flex-direction:column;gap:10px;align-items:center;padding:7px 7px 12px;background:var(--ui-bg);border:1px solid var(--line);border-radius:5px;min-width:0;font:500 11px/1.5 Manrope,sans-serif}
html[data-theme] .gallery-tabs button[aria-selected=true]{border-color:var(--ui-heading);background:var(--ui-soft);color:var(--ui-fg)}
.gallery58-thumb{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;background:var(--sand)}
.lightbox58-stage{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:16px;align-items:center;width:100%}
html[data-theme] .lightbox58-stage #lightbox-image{width:100%;height:auto;max-height:72svh;object-fit:contain;display:block}
html[data-theme] .lightbox58-stage button{position:static;padding:0;width:44px;height:44px;border-radius:50%;display:grid;place-items:center}
.lightbox58-stage svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5}.form-product58{display:flex;align-items:center;gap:16px;border:1px solid color-mix(in srgb,var(--sand) 25%,transparent);padding:12px;border-radius:5px;margin-bottom:24px;color:var(--sand)}
.form-product58[hidden]{display:none}.form-product58 img{width:86px;height:64px;object-fit:contain;background:var(--sand);border-radius:4px}.form-product58 span{font:500 17px/1.4 Lora,serif}
@media(max-width:1000px){
 html[data-theme] .atmosphere-slide{grid-template-columns:.8fr 1.2fr;gap:30px}.atmosphere58-tools{gap:12px}html[data-theme] .atmosphere-dots{gap:15px}
 html[data-theme] .showcase-cards{grid-auto-columns:70%}html[data-theme] .scene58-picker button{gap:12px;padding:10px}.scene58-picker img{width:65px;height:56px}
}
@media(max-width:720px){
 html[data-theme] .home-page .site-header:not(.compact){background:transparent;min-height:76px}
 html[data-theme] #menu.menu58 .menu58-panel{top:8px;right:8px;left:8px;width:auto;height:calc(100svh - 16px);padding:0 22px 20px;border-radius:8px}
 html[data-theme] #menu.menu58 .menu-popover-top{min-height:74px}html[data-theme] #menu.menu58 .menu-popover-link{min-height:58px;font-size:23px!important;padding-block:12px}.menu58-contact{padding-top:18px}
 html[data-theme] .intro-section.atmosphere-slider{margin-block:36px;padding-top:22px}html[data-theme] .atmosphere-slide{grid-template-columns:1fr;gap:0}
 html[data-theme] .atmosphere-media{grid-column:1;grid-row:1;aspect-ratio:16/10;border-radius:5px}
 html[data-theme] .atmosphere-copy{grid-column:1;grid-row:2;padding:24px 0 8px;max-width:none}
 html[data-theme] .atmosphere-copy h2{font-size:32px;margin:12px 0 15px;max-width:none}html[data-theme] .atmosphere-copy>p:not(.eyebrow){font-size:13px;margin-bottom:20px}
 html[data-theme] .atmosphere-controls{margin-top:20px;padding-top:16px;flex-direction:column;align-items:stretch;gap:16px}html[data-theme] .atmosphere-dots{justify-content:space-between;gap:8px}html[data-theme] .atmosphere-dots span{font-size:12px}
 .atmosphere58-tools{justify-content:space-between}.atmosphere58-arrows button{width:40px;height:40px}html[data-theme] .showcase-cards{grid-auto-columns:93%;gap:16px}
 html[data-theme] .home-card58>.home-card58-info{padding:18px;grid-template-columns:1fr 33%;gap:12px;min-height:170px}html[data-theme] .home-card58 .collection-compare-number{font-size:8px}.home-card58 .card-description{font-size:11px}html[data-theme] .home-card58 strong{font-size:27px}
 html[data-theme] .story-bridge{grid-template-columns:1fr;gap:0;margin-block:36px}html[data-theme] .story-bridge .bridge-copy{padding:26px 0 0}html[data-theme] .story-bridge .bridge-type{font-size:34px}html[data-theme] .bridge-notes{margin-top:20px;padding-top:18px}
 html[data-theme] .compare-section .compare-heading{grid-template-columns:1fr;gap:16px;margin-bottom:24px}html[data-theme] .compare-heading .scene-description{justify-self:start;font-size:13px;max-width:none}
 html[data-theme] .comparison{aspect-ratio:4/3;max-height:none}html[data-theme] .compare-label{top:12px;padding:8px 10px;font-size:9px}html[data-theme] .compare-label.day{left:12px}html[data-theme] .compare-label.night{right:12px}html[data-theme] .compare-divider>span{width:46px;height:46px}
 html[data-theme] .compare-meta{margin-block:20px;align-items:center}#compare-name{max-width:55%;font-size:11px}html[data-theme] .compare-meta .text-link{font-size:9px;padding:12px 16px;min-height:42px}
 html[data-theme] .scene58-picker{gap:8px}.scene58-picker img{width:100%;height:56px;flex:auto}html[data-theme] .scene58-picker button{flex-direction:column;align-items:stretch;gap:10px;padding:8px;text-align:center}.scene58-picker span{gap:4px}.scene58-picker strong{font-size:16px}.scene58-picker small{font-size:9px}
 html[data-theme] .gallery-tabs{gap:8px}html[data-theme] .gallery-tabs button{font-size:10px;padding:5px 5px 9px;gap:8px}.lightbox58-stage{grid-template-columns:34px minmax(0,1fr) 34px;gap:5px}html[data-theme] .lightbox58-stage button{min-width:34px;width:34px;height:34px;min-height:34px}
}
@media(prefers-reduced-motion:reduce){html[data-theme] #menu.menu58,html[data-theme] #menu.menu58 :is(.menu58-panel,.menu-scrim,.menu-popover-link),html[data-theme] :is(.atmosphere-slide,.atmosphere-copy,.atmosphere-media img,.bridge-image img){transition:none!important;animation:none!important;transform:none!important}}
html[data-theme] #menu.menu58 .menu-collection-group>summary{justify-content:flex-start}
html[data-theme] #menu.menu58 .menu-collection-chevron{margin-left:auto}
html[data-theme] #menu.menu58 .menu-collection-overview,html[data-theme] #menu.menu58 .menu-collection-overview:is(:hover,:focus-visible,[aria-current=page]){color:var(--button-sand)!important;background:transparent}
html[data-theme] #menu.menu58 .menu-popover-nav{margin-block:20px 24px;padding:0}
html[data-theme] #menu.menu58 .menu58-contact{margin-top:auto}
html[data-theme] #lightbox{box-sizing:border-box;width:100%;height:100svh;max-width:100%;max-height:100svh;inset:0;margin:0;padding:76px 24px 48px;overflow:hidden}
html[data-theme] #lightbox[open]{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}
html[data-theme] #lightbox .lightbox58-stage{max-width:1400px;min-width:0;flex:0 1 auto}
html[data-theme] #lightbox #lightbox-image{margin:0;min-width:0;max-height:calc(100svh - 160px)}
html[data-theme] #lightbox #lightbox-caption{position:static;margin:0;font-size:12px;text-align:center;color:var(--ui-fg)}
@media(max-width:720px){html[data-theme] #lightbox{padding:70px 12px 36px}html[data-theme] #lightbox #lightbox-image{max-height:calc(100svh - 150px)}}
html[data-theme] .compare-section .compare-label{bottom:auto;width:auto;height:auto;min-height:0;line-height:1.5}
html[data-theme] .compare-section .scene58-picker button[aria-pressed=true]{color:var(--ui-fg);background:var(--ui-soft);border-color:var(--ui-heading)}
html[data-theme] .compare-section .scene58-picker button:is(:hover,:focus-visible){color:var(--button-text);background:var(--button-hover);border-color:var(--button-hover)}
html[data-theme] .compare-section .scene58-picker button :is(span,small,strong){color:inherit!important}
html[data-theme] #comparison{scroll-margin-top:110px}
@media(max-width:720px){html[data-theme] #comparison{scroll-margin-top:86px}}
