.project-atlas{--atlas-accent:#b6d6c6;position:relative;background:#0b1112;color:#f1f1eb;margin:0;isolation:isolate}
.atlas-stage{position:relative;min-height:740px;overflow:hidden;padding:64px 6vw;box-sizing:border-box}
.atlas-backgrounds,.atlas-flow,.atlas-path{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.atlas-backgrounds{z-index:-2;background:#0b1112}
.atlas-backgrounds img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;filter:blur(3px);transform:scale(1.07)}
.atlas-backgrounds:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,12,13,.7),rgba(5,12,13,.92) 75%),linear-gradient(0deg,#0b1112,transparent 30%,transparent 80%,#0b1112)}
.atlas-flow{z-index:-1;opacity:.8}
.atlas-path{opacity:.2;fill:none;stroke:#c3ded3;stroke-width:1;stroke-dasharray:3 9 30 12}
.atlas-top{display:flex;justify-content:space-between;gap:24px;font-size:14px;position:relative;z-index:2}
.atlas-top a,.atlas-foot a{color:inherit;text-underline-offset:5px}
.atlas-layout{min-height:520px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:5vw}
.atlas-perspective{perspective:1100px;display:none;justify-content:center;align-items:center;min-height:400px}
.atlas-cube{--cube-side:min(29vw,39vh,360px);width:var(--cube-side);height:var(--cube-side);position:relative;transform-style:preserve-3d}
.atlas-face{position:absolute;inset:0;backface-visibility:hidden;border:1px solid #8cbab666;background:#172323;overflow:hidden}
.atlas-face img{width:100%;height:100%;object-fit:cover;display:block}
.atlas-face:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#ffffff18,transparent 60%,#0005);box-shadow:inset 0 0 35px #02080733;pointer-events:none}
.atlas-face:nth-child(1){transform:translateZ(calc(var(--cube-side)/2))}
.atlas-face:nth-child(2){transform:rotateY(90deg) translateZ(calc(var(--cube-side)/2))}
.atlas-face:nth-child(3){transform:rotateY(180deg) translateZ(calc(var(--cube-side)/2))}
.atlas-face:nth-child(4){transform:rotateY(-90deg) translateZ(calc(var(--cube-side)/2))}
.atlas-face:nth-child(5){transform:rotateX(90deg) translateZ(calc(var(--cube-side)/2))}
.atlas-face:nth-child(6){transform:rotateX(-90deg) translateZ(calc(var(--cube-side)/2))}
.atlas-copy{position:relative;width:100%;grid-column:1/-1}
.atlas-entry{padding:28px 0;border-bottom:1px solid #d7e8de26}
.atlas-entry h3{font-size:clamp(36px,5.2vw,84px);line-height:1.07;letter-spacing:-.05em;margin:20px 0 22px;font-weight:500}
.atlas-entry p{font-size:clamp(17px,1.5vw,22px);line-height:1.65;max-width:28em;color:#cad3cd;margin:0 0 28px}
.atlas-entry .atlas-category{font-size:14px;color:var(--atlas-accent);margin:0;letter-spacing:.02em}
.atlas-entry a{display:inline-flex;align-items:center;gap:40px;color:#f1f1eb;padding:12px 0;border-bottom:1px solid #a9c4b9;text-decoration:none;font-size:16px}
.atlas-entry a span:last-child{font-size:26px}
.atlas-word{display:inline-block;vertical-align:top}
.atlas-foot{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid #d1e4db33;padding-top:22px}
.atlas-steps{display:flex;gap:9px;flex-wrap:wrap;direction:ltr}
.atlas-steps button{border:1px solid #c7dfd042;background:none;color:#c7d3cd;border-radius:50%;width:38px;height:38px;font:inherit;font-size:13px;cursor:pointer;transition:background .2s}
.atlas-steps button[aria-current="true"]{background:#d5e7de;color:#0c1716;border-color:#d5e7de}
.atlas-position{font-size:14px;color:#b6c9bf;min-width:60px;direction:ltr}
.project-atlas.is-motion .atlas-scroll{height:460vh;height:460svh}
.project-atlas.is-motion .atlas-stage{position:sticky;top:0;height:100vh;height:100svh;min-height:620px;display:flex;flex-direction:column;justify-content:space-between}
.project-atlas.is-motion .atlas-layout{min-height:0;flex:1}
.project-atlas.is-motion .atlas-perspective{display:flex}
.project-atlas.is-motion .atlas-copy{grid-column:2;height:360px;display:flex;align-items:center}
.project-atlas.is-motion .atlas-entry{position:absolute;inset:auto 0;opacity:0;visibility:hidden;border:0;padding:0}
.atlas-beam{position:relative;background:#0b1112;overflow:hidden;padding:40px 0 65px}
.atlas-beam-heading{display:flex;justify-content:space-between;align-items:end;padding:0 6vw 30px;gap:25px}
.atlas-beam-heading h3{font-size:clamp(28px,3vw,46px);letter-spacing:-.04em;font-weight:500;margin:0}
.atlas-beam-heading p{font-size:14px;color:#bdd0c5;max-width:28em;margin:0;line-height:1.6}
.atlas-beam-window{position:relative;overflow-x:auto;padding:30px 6vw;scrollbar-width:thin}
.atlas-beam-track{display:flex;gap:28px;width:max-content;direction:ltr}
.atlas-card{flex:none;width:clamp(250px,32vw,460px);text-decoration:none;color:#f1f1eb;display:block;position:relative}
.atlas-card-media{position:relative;aspect-ratio:1.5;border-radius:9px;overflow:hidden;border:1px solid #c8e8d526;background:#080e10}
.atlas-card-image,.atlas-card-code{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.atlas-card-code{display:none;overflow:hidden;color:#a5f2d6;background:#081116;font:7px/1.15 monospace;white-space:pre;margin:0;padding:10px;box-sizing:border-box;text-shadow:0 0 5px #8bd5d755}
.atlas-card-label{display:flex;justify-content:space-between;gap:20px;font-size:16px;padding:18px 2px}
.atlas-card-label span:last-child{color:#a5c6b5}
.atlas-scanner{display:none;position:absolute;top:14px;bottom:70px;left:50%;width:2px;background:#e8fff8;box-shadow:0 0 8px 2px #afffea,0 0 24px 6px #7ee6e080,0 0 65px 12px #9581f555;pointer-events:none;z-index:3}
.project-atlas.is-motion .atlas-beam-window{overflow:hidden}
.project-atlas.is-motion .atlas-card-code,.project-atlas.is-motion .atlas-scanner{display:block}
.atlas-card:focus-visible,.atlas-steps button:focus-visible{outline:3px solid #cce8ab;outline-offset:5px}
html[dir="rtl"] .atlas-entry h3{letter-spacing:0;font-size:clamp(34px,4.6vw,74px);line-height:1.3}
html[dir="rtl"] .atlas-layout{direction:ltr}html[dir="rtl"] .atlas-copy,html[dir="rtl"] .atlas-card-label{direction:rtl}
@media(max-width:700px){.project-atlas{margin-inline:0}.atlas-stage{padding:35px 7vw;min-height:0}.atlas-top{font-size:12px;gap:14px}.project-atlas.is-motion .atlas-scroll{height:390svh}.project-atlas.is-motion .atlas-stage{min-height:620px;padding-top:30px;padding-bottom:24px}.atlas-layout{grid-template-columns:1fr;gap:0}.project-atlas.is-motion .atlas-perspective{min-height:0;height:43%;padding-top:15px}.atlas-cube{--cube-side:min(45vw,24svh)}.project-atlas.is-motion .atlas-copy{grid-column:1;height:44%;align-self:start}.atlas-entry h3{font-size:39px;margin:12px 0}.atlas-entry p{font-size:16px;line-height:1.5;margin-bottom:12px}.atlas-entry .atlas-category{font-size:12px}.atlas-entry a{font-size:14px;padding:7px 0}.atlas-foot{padding-top:14px;gap:10px}.atlas-steps{gap:6px}.atlas-steps button{width:32px;height:32px;font-size:12px}.atlas-position{display:none}.atlas-foot>a{font-size:12px}.atlas-beam-heading{display:block}.atlas-beam-heading p{margin-top:15px}.atlas-card{width:78vw}.atlas-beam-track{gap:20px}html[dir="rtl"] .atlas-entry h3{font-size:34px}}
@media(max-height:650px) and (min-width:701px){.project-atlas.is-motion .atlas-stage{min-height:500px;padding-block:28px}.atlas-entry h3{font-size:48px}.atlas-copy{height:300px!important}.atlas-entry p{font-size:16px}.atlas-cube{--cube-side:35vh}}

/* Keep controls above the roaming avatar and fixed wayfinder. */
.project-atlas.is-motion .atlas-stage{padding-bottom:94px}
.atlas-top{padding-right:48px}
.atlas-entry h3{overflow:hidden;padding-bottom:.12em}
.atlas-pause{background:none;border:0;padding:10px 0;color:#d1e3d9;font:inherit;font-size:14px;text-decoration:underline;text-underline-offset:5px;cursor:pointer}
@media(max-width:700px){.project-atlas.is-motion .atlas-stage{padding-bottom:95px}.atlas-top{padding-right:38px;font-size:12px}.atlas-top>a{max-width:82px;flex:none}.atlas-foot{flex-wrap:wrap;gap:8px 16px}.atlas-steps{width:100%;justify-content:space-between}.atlas-pause{font-size:12px;padding:0}.atlas-foot>a{margin-inline-start:auto}.project-atlas.is-motion .atlas-perspective{height:40%}.project-atlas.is-motion .atlas-copy{height:50%}.atlas-entry h3{margin-bottom:12px}}
@media(max-width:700px){
 .project-atlas.is-motion .atlas-stage{justify-content:flex-start}
 .project-atlas.is-motion .atlas-layout{display:block;flex:none;margin-top:100px}
 .project-atlas.is-motion .atlas-perspective{height:25svh;min-height:150px;max-height:210px;padding:0}
 .project-atlas.is-motion .atlas-copy{height:31svh;min-height:230px}
 .project-atlas.is-motion .atlas-foot{position:absolute;top:85px;left:7vw;right:7vw;border-top:0;padding-top:0}
 .atlas-cube{--cube-side:min(43vw,23svh)}
}
