/* Obsidian: one continuous Atlas sculpture behind the complete storefront. */
body.immersive { background: #050b16; isolation: isolate; }
.immersive #atlas-world { position: fixed; inset: 0; z-index: -2; height: 100svh; }
.world-shade { position: fixed; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(90deg, #030911c4 0%, #03091180 35%, transparent 72%); }
.immersive .cinema-lens { background: linear-gradient(0deg, #020812b3, transparent 23%, transparent 82%, #02081266); box-shadow: inset 0 0 100px #01040a50; }
.immersive .conceptbar { background: #06101b85; border-bottom: 1px solid #b3d4eb16; }
.immersive .mainnav { background: #06101b4d; border-bottom-color: #b3d4eb20; }
.immersive .obsidian-hero { background: transparent; height: max(700px, calc(100svh - 121px)); }
.immersive .obsidian-hero h1 { font-size: clamp(76px, 8vw, 128px); line-height: .95; padding-top: clamp(120px, 18vh, 190px); letter-spacing: -.065em; }
.immersive .obsidian-hero h1 span { color: #bdcedc; }
.immersive .hero-topline { top: 35px; }
.immersive .hero-description { bottom: 130px; }
.immersive .hero-description p { font-size: 20px; line-height: 1.5; color: #c0cdda; }
.hero-shop { display: inline-flex; align-items: center; gap: 40px; background: #dcedf5; color: #102330; padding: 17px 20px; font-size: 12px; margin-top: 16px; transition: background .2s, gap .2s; }
.hero-shop:hover { background: white; gap: 48px; }
.hero-shop span { font-size: 18px; }
.immersive .hero-pin { right: 5%; bottom: 125px; color: #c4d9e8; line-height: 1.8; }
.immersive .hero-bottom { bottom: 30px; }
.immersive .hero-bottom > span:last-child { margin-right: 135px; color: #8ba5b8; }
.immersive .sectionnav { background: #06101bc9; border-color: #8eaec330; }
.immersive .section-pad { background: linear-gradient(90deg, #050c167d, #050c1620 65%, transparent); padding-top: 110px; padding-bottom: 110px; }
.immersive .section-heading { align-items: flex-end; margin-bottom: 45px; }
.immersive .section-intro { background: #06101b80; padding: 20px 25px; border-left: 1px solid #a1c2d245; color: #aebfcf; font-size: 12px; }
.immersive .eyebrow { color: #afc4d5; }
.immersive .section-heading h2 span, .immersive .philosophy h2 em { color: #afc4d5; }
.immersive .filters button { background: #081422ad; color: #c0d0de; border-color: #829fb442; }
.immersive .filters button.active { background: #e1edf4; color: #102330; }
.collection-stage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(200px, .42fr); gap: 5vw; align-items: start; }
.immersive .obsidian-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.immersive .equipment-card { grid-column: auto; height: 420px; background: #0a1421d6; border-color: #9fc3da30; box-shadow: 0 20px 50px #02081245; }
.immersive .equipment-wide { grid-column: 1/-1; height: 480px; }
.immersive .objects-card { grid-column: 1/-1; height: 320px; background: linear-gradient(120deg, #0a182ac9, #0a142150); }
.immersive .equipment-card img { opacity: .94; }
.immersive .equipment-card:after { background: linear-gradient(180deg, #07111b55, transparent 35%, #06101bfa); }
.immersive .power-card img { width: 215%; transform: translateX(-48%); }
.immersive .product-bottom strong { font-size: clamp(20px, 1.65vw, 26px); }
.immersive .product-top { font-size: 7px; }
.world-caption { position: sticky; top: 66vh; padding: 10px 0 30px; color: #d5e6ef; text-shadow: 0 2px 15px #020812; }
.world-caption > .mono { font-size: 8px; color: #a9c2d2; }
.world-caption p { margin: 23px 0; font-size: clamp(44px, 4.8vw, 76px); letter-spacing: -3px; line-height: 1; }
.caption-line { width: 45px; height: 1px; display: block; background: #a9c2d270; margin: 25px 0 18px; }
.world-caption small { font-size: 12px; line-height: 1.7; color: #bacbd8; }
.immersive .collection-note { color: #b0c4d4; margin-right: 34%; font-size: 7px; }
.immersive .environment { margin: 0 4%; border: 1px solid #a2c4d329; height: 670px; background: #0a1421; }
.immersive .environment > img { opacity: .86; }
.immersive .environment-copy { left: 5%; }
.immersive .environment-copy h2 { font-size: clamp(46px, 6vw, 86px); }
.immersive .philosophy { padding-top: 150px; }
.immersive .philosophy-grid { gap: 24px; }
.immersive .philosophy-grid > div { padding: 30px; background: #071321cc; border: 1px solid #9fc3da30; }
.immersive .philosophy-grid p { color: #b5c5d3; }
.immersive .philosophy-grid .mono { color: #a5c0d3; }
.immersive .dark-footer { background: #06101bd9; padding-bottom: 85px; }
.motion-control { position: fixed; z-index: 25; bottom: 22px; right: 4%; display: inline-flex; align-items: center; gap: 10px; padding: 12px 15px; border: 1px solid #b8d5e34d; background: #081320e8; color: #d9e8f0; font-size: 10px; letter-spacing: .3px; backdrop-filter: blur(12px); }
.motion-control:hover { background: #162b3d; border-color: #c3e1ef8c; }
.motion-control:disabled { opacity: .7; cursor: default; }
.motion-icon { font-size: 13px; width: 12px; text-align: center; }
@media (min-width: 1800px) { .immersive .obsidian-hero h1 { padding-top: 21vh; } }
@media (max-width: 1000px) {
  .collection-stage { grid-template-columns: minmax(0, 1fr) 190px; gap: 30px; }
  .immersive .equipment-card { height: 360px; }
  .immersive .equipment-wide { height: 390px; }
  .immersive .obsidian-grid { gap: 15px; }
  .immersive .philosophy-grid > div { padding: 22px; }
  .immersive .section-intro { margin-right: 0; }
  .immersive .hero-pin { display: none; }
  .immersive .hero-bottom > span:last-child { display: none; }
}
@media (max-width: 760px) {
  .immersive .obsidian-hero { height: max(760px, calc(100svh - 105px)); }
  .immersive .obsidian-hero h1 { padding: 66px 5% 0; font-size: clamp(60px, 13vw, 94px); }
  .immersive .hero-topline { top: 22px; left: 5%; font-size: 6px; }
  .immersive .hero-topline > span:last-child { display: none; }
  .immersive .hero-description { bottom: 83px; left: 5%; }
  .immersive .hero-description p { font-size: 17px; margin: 0; }
  .hero-shop { margin-top: 20px; padding: 14px 18px; gap: 36px; font-size: 11px; }
  .immersive .hero-bottom { bottom: 25px; left: 5%; right: 5%; font-size: 6px; }
  .immersive .hero-bottom a { margin-right: 0; }
  .world-shade { background: linear-gradient(180deg, #03091125, transparent 34%, #03091130 80%); }
  .immersive .cinema-lens { background: linear-gradient(0deg, #020812c9, transparent 43%, transparent 74%, #02081280); box-shadow: none; }
  .immersive .section-pad { padding: 70px 5%; background: #030c1659; }
  .immersive .section-heading { display: block; }
  .immersive .section-heading h2 { font-size: 44px; }
  .immersive .section-intro { display: none; }
  .collection-stage { display: block; }
  .immersive .obsidian-grid { grid-template-columns: 1fr; gap: 45px; }
  .immersive .equipment-card, .immersive .equipment-wide, .immersive .objects-card { grid-column: auto; height: 365px; }
  .immersive .equipment-wide { height: 390px; }
  .immersive .product-bottom strong { font-size: 24px; }
  .immersive .filters { margin-bottom: 30px; }
  .world-caption { position: static; padding: 60px 0 30px; }
  .world-caption p { font-size: 64px; }
  .immersive .collection-note { margin-right: 0; gap: 20px; font-size: 6px; }
  .immersive .environment { margin: 0 5%; height: 580px; }
  .immersive .environment-copy { top: 130px; }
  .immersive .environment-copy h2 { font-size: 50px; }
  .immersive .philosophy-grid { grid-template-columns: 1fr; gap: 16px; }
  .motion-control { bottom: 16px; right: 5%; padding: 11px 13px; }
  .immersive .dark-footer { padding-bottom: 100px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-shop { transition: none; }
  .immersive #atlas-world { height: 100svh; }
}

/* Readable type for this direction, including the shared stylesheet's mobile rules.
   Keep these minimums at every viewport; reflow the layout instead of shrinking text. */
body.immersive { --text-small: .875rem; --text-body: 1rem; }
html:has(> body.immersive) { scroll-padding-top: 100px; }
body.immersive :is(.mono, .eyebrow, .conceptbar, .equipment-card small, .modal-no-image) {
  font-size: var(--text-small);
  line-height: 1.5;
  letter-spacing: .06em;
}
body.immersive :is(.brand-plus, .filters sup) { font-size: var(--text-small); }
body.immersive :is(.mainnav nav, .nav-cta, .hero-shop, .section-intro, .filters button, .world-caption small, .solid-link, .philosophy-grid p, .dark-footer p, .footer-links, .modal-done, .motion-control, .motion-icon),
body.immersive .environment-copy p:not(.eyebrow),
body.immersive .modal-body p:not(.eyebrow) { font-size: var(--text-body); line-height: 1.6; }
body.immersive .modal-body p.modal-note { font-size: var(--text-small); color: #aab8c9; }
body.immersive .brand { font-size: 18px; }
body.immersive .conceptbar { flex-wrap: wrap; align-items: center; gap: 8px 24px; color: #b7c5d4; }
body.immersive .mainnav { gap: 24px; }
body.immersive .mainnav nav { gap: 24px; }
body.immersive .nav-cta { flex-shrink: 0; }
body.immersive :is(.hero-topline, .hero-bottom, .collection-note, .product-top, .footer-bottom) { flex-wrap: wrap; gap: 12px 24px; }
body.immersive .hero-bottom { right: 4%; }
body.immersive .hero-bottom > span:last-child { margin-right: 180px; }
body.immersive .sectionnav { flex-wrap: wrap; gap: 4px 28px; padding-block: 10px; }
body.immersive .sectionnav a { display: flex; align-items: center; min-height: 44px; }
body.immersive .sectionnav > span { align-self: center; color: #acbdce; }
body.immersive .filters button { min-height: 48px; }
body.immersive .product-top span { color: #b8c9da; }
body.immersive .product-bottom { gap: 12px; }
body.immersive .product-bottom > span:first-child { min-width: 0; }
body.immersive .product-bottom small { color: #b6c7da; }
body.immersive .collection-note { margin-right: 0; max-width: 64%; }
body.immersive .environment-copy { right: 5%; }
body.immersive .environment-caption { left: 5%; right: 5%; }
body.immersive .dark-footer p { color: #b2c2d4; }
body.immersive .footer-links { flex-wrap: wrap; gap: 12px 24px; }
body.immersive .footer-bottom { color: #acbdce; }
body.immersive .footer-bottom > span:nth-child(2) { max-width: 40%; }
body.immersive .modal-no-image { text-align: center; padding: 24px; }
body.immersive .modal-close { width: 44px; height: 44px; }
body.immersive .motion-icon { width: 1.1em; flex-shrink: 0; }

@media (max-width: 1200px) {
  body.immersive .nav-cta { display: none; }
  body.immersive .hero-bottom > span:last-child { display: none; }
  body.immersive .hero-bottom { padding-right: 190px; }
  body.immersive .obsidian-grid { grid-template-columns: 1fr; }
  body.immersive .collection-note { max-width: none; }
}
@media (max-width: 900px) {
  body.immersive .mainnav { height: 76px; }
  body.immersive .menu-button { display: block; min-width: 44px; min-height: 44px; }
  body.immersive .mainnav nav {
    display: none; position: absolute; top: 76px; left: 0; right: 0;
    padding: 20px 5%; flex-direction: column; gap: 8px;
    background: #101720; border-bottom: 1px solid #3b4858;
  }
  body.immersive .mainnav nav.open { display: flex; }
  body.immersive .mainnav nav a { padding-block: 10px; }
  body.immersive .sectionnav > span { display: none; }
}
@media (max-width: 760px) {
  html:has(> body.immersive) { scroll-padding-top: 140px; }
  body.immersive .conceptbar { flex-direction: column; align-items: flex-start; gap: 4px; }
  body.immersive .hero-topline { right: 5%; }
  body.immersive .obsidian-hero h1 { padding-top: 100px; }
  body.immersive .hero-description { bottom: 170px; }
  body.immersive .hero-bottom { bottom: 35px; right: 5%; padding-right: 0; flex-direction: column; gap: 8px; }
  body.immersive .sectionnav { gap: 0 16px; }
  body.immersive .product-top { left: 20px; right: 20px; gap: 8px 16px; }
  body.immersive .product-bottom { left: 20px; right: 20px; }
  body.immersive .solid-link { gap: 20px; max-width: 100%; }
  body.immersive .environment-copy p:not(.eyebrow) br { display: none; }
  body.immersive .footer-bottom > span:nth-child(2) { max-width: none; }
  body.immersive .modal-body { padding: 25px 20px; }
}
@media (max-width: 380px) {
  html:has(> body.immersive) { scroll-padding-top: 180px; }
}
