/* Exhibition atmospheres. All decorative layers are local, inert and behind content. */
.hero,.project-chapter,.contact{position:relative;isolation:isolate;--atmo-line:75,105,116}
.scene-atmosphere{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;contain:paint;user-select:none}
.scene-atmosphere::after{content:"";position:absolute;inset:0;opacity:.19;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23727e7b' opacity='.25' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E");mix-blend-mode:multiply}
.atmosphere-light,.atmosphere-geometry{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.atmosphere-geometry{opacity:.65;object-position:center;transform-origin:70% 50%}
.atmosphere-light{inset:-8%;width:116%;height:116%;transform:translate3d(0,0,0)}
/* 00 / an airy gallery entrance, engraved orbits beneath the project fan. */
#home{background:#eef1eb}
#home .atmosphere-light{background:radial-gradient(ellipse at 79% 45%,#d5dfdc 0,transparent 51%),radial-gradient(ellipse at 16% 12%,#fffcf2 0,transparent 53%),linear-gradient(125deg,#f8f8ef,#e7eeea 66%,#d8e3e2)}
#home .atmosphere-geometry{opacity:.42;mask-image:linear-gradient(90deg,transparent 27%,#000 70%)}
/* 01 / a research studio: calibrated grid, cyan daylight and precise drafting arcs. */
.theme-company{--chapter-bg:#edf3f2;--accent:#315e73;background:var(--chapter-bg)}
.theme-company .atmosphere-light{background:radial-gradient(ellipse at 85% 22%,#b9d2da 0,transparent 48%),radial-gradient(ellipse at 6% 73%,#fbfcf5 0,transparent 57%),linear-gradient(125deg,#f6f8f2,#dfeaec)}
.theme-company .atmosphere-geometry{opacity:.8;mask-image:linear-gradient(90deg,rgba(0,0,0,.2),#000 78%)}
/* 02 / a creative studio: warm paper, refracted light and flowing score-like contours. */
.theme-workbenches{--chapter-bg:#f1edf0;--accent:#6c5572;background:var(--chapter-bg)}
.theme-workbenches .atmosphere-light{background:radial-gradient(ellipse at 20% 17%,#d5d5e9 0,transparent 49%),radial-gradient(ellipse at 60% 94%,#e9caba 0,transparent 53%),radial-gradient(ellipse at 95% 18%,#fcfaf3 0,transparent 47%),linear-gradient(125deg,#e7e6ee,#f4eee7)}
.theme-workbenches .atmosphere-geometry{opacity:.62;mask-image:linear-gradient(90deg,#000 20%,rgba(0,0,0,.15) 82%);object-position:45% center}
/* 03 / a product photography cyclorama. The long shadow belongs to the backdrop. */
.theme-commerce{--chapter-bg:#f2eadd;--accent:#805438;background:var(--chapter-bg)}
.theme-commerce .atmosphere-light{background:linear-gradient(117deg,transparent 52%,rgba(132,103,71,.10) 52.3%,transparent 64%),radial-gradient(ellipse at 81% 28%,#fffdf2 0,transparent 40%),radial-gradient(ellipse at 88% 89%,#d1b895 0,transparent 48%),linear-gradient(125deg,#faf5eb,#e6d9c3)}
.theme-commerce .atmosphere-geometry{opacity:.72;mask-image:linear-gradient(90deg,transparent 18%,#000 85%)}
/* 04 / an architectural workspace. Traces connect, but the reading field stays calm. */
.theme-harness{--chapter-bg:#e5eee8;--accent:#365f50;background:var(--chapter-bg)}
.theme-harness .atmosphere-light{background:radial-gradient(ellipse at 21% 75%,#b9d2c7 0,transparent 52%),radial-gradient(ellipse at 84% 20%,#f9fbef 0,transparent 49%),linear-gradient(135deg,#d9e6de,#eef2e8)}
.theme-harness .atmosphere-geometry{opacity:.65;mask-image:linear-gradient(90deg,#000 10%,rgba(0,0,0,.13) 85%)}
/* 05 / night cartography: stars, topographic lines, and a distant amber horizon. */
.theme-games{--chapter-bg:#12252c;--line:#48616a;--muted:#bfd0d4;background:var(--chapter-bg)}
.theme-games .atmosphere-light{background:radial-gradient(ellipse at 85% 5%,rgba(151,119,69,.23) 0,transparent 47%),radial-gradient(ellipse at 82% 90%,#264c54 0,transparent 58%),linear-gradient(125deg,#112029,#152e35)}
.theme-games .atmosphere-geometry{opacity:.85;mask-image:linear-gradient(90deg,rgba(0,0,0,.15),#000 75%)}
.theme-games .scene-atmosphere::after{mix-blend-mode:soft-light;opacity:.25}
/* Closing frame echoes the entrance. */
#contact{background:#e9ede4}
#contact .atmosphere-light{background:radial-gradient(ellipse at 83% 60%,#c8d7ca 0,transparent 54%),linear-gradient(120deg,#f8f6eb,#dfe8df)}
#contact .atmosphere-geometry{opacity:.38;mask-image:linear-gradient(90deg,transparent 38%,#000)}
/* One small frame line anchors the exhibition; text remains directly on the quiet ground. */
.project-chapter .scene-atmosphere::before{content:"";position:absolute;z-index:1;inset:22px 2vw;border:1px solid rgba(var(--atmo-line),.12);border-radius:2px}
.scene-mode .chapter-intro{background:transparent}
.scene-mode .product-stage,.scene-mode .workflow-evidence,.scene-mode .prototype-preview{box-shadow:0 22px 65px -38px rgba(25,45,49,.35)}
/* Animate only the visible light layer. No per-frame JS, no movement of reading content. */
@keyframes light-breath{from{transform:translate3d(-1%,0,0) scale(1)}to{transform:translate3d(1.5%,1%,0) scale(1.035)}}
.scene-active .atmosphere-light{animation:light-breath 22s ease-in-out infinite alternate}
.scene-active .atmosphere-geometry{animation:atmosphere-arrive 1100ms cubic-bezier(.16,1,.3,1) both}
@keyframes atmosphere-arrive{from{transform:scale(1.035) translate3d(12px,0,0)}to{transform:scale(1) translate3d(0,0,0)}}
/* Dark mode is separately art-directed, retaining five distinct atmospheres. */
.dark #home,.dark #contact{background:#17282c}
.dark #home .atmosphere-light,.dark #contact .atmosphere-light{background:radial-gradient(ellipse at 78% 38%,#294d50,transparent 55%),linear-gradient(125deg,#172327,#1e343a)}
.dark #home .atmosphere-geometry,.dark #contact .atmosphere-geometry{filter:brightness(2);opacity:.45}
.dark .theme-company{--chapter-bg:#162b34;--accent:#acd3e2}
.dark .theme-company .atmosphere-light{background:radial-gradient(ellipse at 86% 20%,#254d60,transparent 53%),linear-gradient(125deg,#17272c,#193640)}
.dark .theme-workbenches{--chapter-bg:#302a37;--accent:#d3bfdc}
.dark .theme-workbenches .atmosphere-light{background:radial-gradient(ellipse at 15% 20%,#423c5c,transparent 50%),radial-gradient(ellipse at 60% 90%,#59413e,transparent 52%),linear-gradient(130deg,#282938,#35303b)}
.dark .theme-commerce{--chapter-bg:#332b24;--accent:#e5c7a5}
.dark .theme-commerce .atmosphere-light{background:linear-gradient(117deg,transparent 52%,rgba(9,7,5,.22) 52.3%,transparent 68%),radial-gradient(ellipse at 82% 22%,#605442,transparent 46%),linear-gradient(125deg,#2c2926,#473a2d)}
.dark .theme-harness{--chapter-bg:#1c302a;--accent:#bad7c7}
.dark .theme-harness .atmosphere-light{background:radial-gradient(ellipse at 18% 78%,#2e574b,transparent 52%),radial-gradient(ellipse at 90% 12%,#3c473a,transparent 43%),linear-gradient(125deg,#1a2f2b,#243d33)}
.dark .project-chapter:not(.theme-games) .atmosphere-geometry{filter:brightness(1.8) saturate(.7);opacity:.5}
.dark .scene-atmosphere::after{mix-blend-mode:soft-light}
.dark .project-chapter{--atmo-line:158,188,192}
/* Small screens keep the background out of the already dense reading area. */
@media(max-width:760px){.project-chapter .scene-atmosphere::before{inset:9px 2vw}.atmosphere-geometry{object-position:65% center;opacity:.35!important;mask-image:linear-gradient(180deg,transparent 0,#000 70%)!important}.scene-active .atmosphere-light{animation:none}.scene-atmosphere::after{opacity:.12}.scene-mode .chapter-intro{border-bottom-color:rgba(var(--atmo-line),.25)}}
@media(prefers-reduced-motion:reduce){.scene-active .atmosphere-light,.scene-active .atmosphere-geometry{animation:none}}
@media(prefers-contrast:more){.atmosphere-geometry,.scene-atmosphere::after{display:none}.atmosphere-light{opacity:.35}}
@media print{.scene-atmosphere{display:none}}