.connection-diagram.atelier{display:grid;grid-template-columns: .8fr 1.2fr;align-items:center;gap:3%;padding:60px 40px;min-height:640px;border:0;border-radius:0;background:radial-gradient(ellipse at 20% 50%,#23476b33,transparent 60%);overflow:hidden;isolation:isolate;margin:0 0 70px;border-block:1px solid #b9d6ff28}
.atelier-copy{position:relative;z-index:2;min-width:0}.atelier .atelier-intro{margin:0 0 35px;text-align:right}.atelier-intro>span{display:block;font-size:11px;letter-spacing:.05em;color:#9aacc4;margin-bottom:20px}.atelier-intro strong{display:block;font-size:clamp(36px,4.3vw,64px);font-weight:900;line-height:1.06;letter-spacing:-.045em;color:#f6f4f0}
.atelier .connection-sources{display:flex;flex-direction:column;gap:0;margin:0}.atelier .connection-sources button{display:flex;align-items:center;gap:18px;text-align:right;padding:18px 0;min-height:78px;border:0;border-radius:0;border-bottom:1px solid #91b5df33;background:transparent;color:#8394a9;box-shadow:none;transform:none;transition:color 200ms}.atelier .connection-sources button[aria-pressed=true]{color:#f5f7fa;background:transparent;border-color:#8cacd8;box-shadow:none;transform:none}.atelier-index{font:10px monospace;direction:ltr;color:#7195ba}.atelier-option{display:flex;flex-direction:column;gap:5px;flex:1}.atelier-option b{font-size:23px;font-weight:500}.atelier-option small{font-size:11px;color:#9dacbf}.atelier-arrow{font-size:24px;opacity:.3;transform:rotate(-45deg);transition:opacity 240ms,transform 240ms}.atelier [aria-pressed=true] .atelier-arrow{opacity:1;transform:rotate(0)}.atelier .connection-explanation{font-size:13px;line-height:1.9;min-height:5.7em;margin:25px 0 0;color:#a9bbd0}
.atelier-stage{position:relative;min-width:0;height:540px;perspective:1200px;direction:ltr}.atelier-grid{position:absolute;inset:3% -20%;background-image:linear-gradient(#7aa2cc12 1px,transparent 1px),linear-gradient(90deg,#7aa2cc12 1px,transparent 1px);background-size:44px 44px;transform:rotate(-18deg);mask-image:radial-gradient(ellipse,#000,transparent 65%)}.atelier-aura{position:absolute;inset:18% 0;background:radial-gradient(ellipse,#5582bf35,transparent 65%);filter:blur(25px)}.atelier-object{position:absolute;left:13%;top:22%;width:77%;height:60%;transform-style:preserve-3d;transform:rotateX(30deg) rotateY(22deg) rotateZ(-18deg);animation:atelier-breathe 8s ease-in-out infinite alternate;animation-play-state:paused}.atelier.in-view:not(.page-hidden) .atelier-object{animation-play-state:running}.atelier-layer{position:absolute;inset:0;border:1px solid #a4c5ee77;border-radius:9px;transform-style:preserve-3d;transition:transform 900ms cubic-bezier(.22,1,.36,1),opacity 500ms;direction:rtl}.layer-tag{position:absolute;top:-25px;right:0;font-size:9px;letter-spacing:.07em;color:#b3c9e8;transition:opacity 240ms}.layer-base{background:#0a1424;transform:translateZ(-55px) translateY(70px)}.blueprint-grid{position:absolute;inset:15px;background:linear-gradient(#7da8da35 1px,transparent 1px),linear-gradient(90deg,#7da8da35 1px,transparent 1px);background-size:25% 25%;border:1px solid #7da8da55}.blueprint-cross{position:absolute;font:20px monospace;color:#bedafa}.cross-a{left:8px;top:8px}.cross-b{right:8px;bottom:8px}.blueprint-copy{position:absolute;inset:0;display:grid;place-items:center;font-size:22px;font-weight:900;background:#07142144}
.layer-design{background:linear-gradient(135deg,#182b48,#090f1c 65%);transform:translateZ(30px);padding:7%;box-shadow:0 25px 50px #0005;overflow:visible;display:flex;flex-direction:column}.surface-top{display:flex;align-items:center;justify-content:space-between;color:#91a6c0;font-size:7px}.surface-top b{font:900 14px Arial;color:#edf5ff;letter-spacing:-.5px}.surface-title{font-size:clamp(20px,2.6vw,37px);font-weight:900;letter-spacing:-.04em;line-height:1.1;margin-top:10%}.surface-title em{font-style:normal;color:#88a8d5}.surface-sculpture{position:relative;flex:1;min-height:35px;overflow:hidden;margin-top:6%;background:radial-gradient(ellipse at bottom,#3b6091,#12223a 65%);border-radius:3px}.surface-sculpture i{position:absolute;width:30%;height:210%;top:-25%;left:20%;border-radius:50%;border:1px solid #b9d9ff88;transform:rotate(48deg);background:linear-gradient(90deg,#6a96c522,transparent)}.surface-sculpture i:nth-child(2){left:28%}.surface-sculpture i:nth-child(3){left:36%}.surface-sculpture i:nth-child(4){left:44%}.surface-sculpture i:nth-child(5){left:52%}.surface-sculpture i:nth-child(6){left:60%}.surface-foot{display:flex;justify-content:space-between;align-items:center;padding-top:6%;font-size:8px;color:#adbed4}.surface-foot b{font-size:20px;font-weight:400}
.layer-experience{background:linear-gradient(145deg,#99c6ff0c,transparent);transform:translateZ(105px) translateY(-60px);border-style:dashed;pointer-events:none}.experience-route{position:absolute;top:13%;right:8%;left:8%;display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:9px;color:#d2e7ff}.experience-route i{width:5px;height:5px;border-radius:50%;background:#cceaff;box-shadow:0 0 14px #a8d6ff}.experience-route b{font-weight:400}.experience-action{position:absolute;bottom:8%;left:8%;right:8%;display:flex;justify-content:space-between;padding:12px;background:#88aeda;color:#071423;border-radius:3px;font-size:10px}.experience-cursor{position:absolute;bottom:32%;left:25%;font-size:33px;color:#dceeff;animation:atelier-cursor 4s ease-in-out infinite alternate;animation-play-state:paused;opacity:0}.atelier[data-active="2"].in-view:not(.page-hidden) .experience-cursor{animation-play-state:running;opacity:1}
.atelier[data-active="0"] .layer-design{transform:translateZ(15px) translateY(-25px);opacity:.17}.atelier[data-active="0"] .layer-experience{transform:translateZ(70px) translateY(-100px);opacity:.12}.atelier[data-active="0"] .layer-base{transform:translateZ(0);opacity:1}.atelier[data-active="1"] .layer-base{opacity:.45}.atelier[data-active="1"] .layer-experience{opacity:.45}.atelier[data-active="2"] .layer-base{transform:translateZ(-3px);opacity:.3}.atelier[data-active="2"] .layer-design{transform:translateZ(0)}.atelier[data-active="2"] .layer-experience{transform:translateZ(3px);border-color:transparent}.atelier[data-active="2"] .layer-tag{opacity:0}.atelier[data-active="2"] .experience-route{opacity:0}.atelier[data-active="2"] .surface-foot{opacity:0}.atelier-coordinate,.atelier-illustration{position:absolute;bottom:0;color:#778fae;font-size:9px;letter-spacing:.08em}.atelier-coordinate{left:4%}.atelier-illustration{right:0}
@keyframes atelier-breathe{to{transform:translateY(-8px) rotateX(33deg) rotateY(19deg) rotateZ(-16deg)}}@keyframes atelier-cursor{to{transform:translate(22px,20px)}}
@media(max-width:767px){.connection-diagram.atelier{display:flex;flex-direction:column;min-height:0;gap:10px;padding:35px 0;margin-bottom:40px;overflow:hidden}.atelier-copy{width:100%}.atelier .atelier-intro{margin-bottom:22px}.atelier-intro strong{font-size:40px}.atelier-intro>span{font-size:10px;margin-bottom:14px}.atelier .connection-sources{flex-direction:row;gap:14px}.atelier .connection-sources button{flex:1;min-width:0;gap:7px;min-height:64px;padding:10px 0}.atelier-option b{font-size:18px}.atelier-option small{display:none}.atelier-arrow{display:none}.atelier-index{font-size:9px}.atelier .connection-explanation{font-size:13px;min-height:3.8em;margin-top:18px}.atelier-stage{width:100%;height:370px}.atelier-object{left:10%;width:78%;height:58%;top:25%}.surface-title{font-size:23px}.surface-top{font-size:6px}.surface-top b{font-size:11px}.layer-design{padding:6%}.surface-foot{font-size:6px}.surface-sculpture{min-height:40px}.experience-action{padding:9px;font-size:8px}.experience-route{font-size:8px}.atelier-coordinate,.atelier-illustration{font-size:8px}.layer-tag{font-size:8px}.blueprint-copy{font-size:18px}}
.living-paused .atelier-object,.living-paused .experience-cursor{animation-play-state:paused!important}.reduced .atelier-layer,.reduced .atelier-arrow,.reduced .layer-tag{transition:none}.reduced .atelier-object,.reduced .experience-cursor{animation:none}@media(prefers-reduced-motion:reduce){.atelier-layer,.atelier-arrow,.layer-tag{transition:none!important}.atelier-object,.experience-cursor{animation:none!important}}
.atelier .connection-sources button>span{background:none;border:0;border-radius:0;padding:0;box-shadow:none}.atelier .connection-sources .atelier-index{font-size:10px}.atelier .connection-sources .atelier-arrow{font-size:24px}.atelier[data-active="1"] .blueprint-copy,.atelier[data-active="2"] .blueprint-copy{opacity:0}.atelier:not([data-active="2"]) .experience-action{opacity:0}.atelier[data-active="0"] .layer-experience{opacity:0}.atelier[data-active="0"] .layer-design{opacity:.08}
@media(max-width:767px){.atelier-option small{display:block;font-size:8px;line-height:1.5}.atelier .connection-sources button{align-items:flex-start}.atelier .connection-sources .atelier-index{padding-top:4px;font-size:8px}.atelier .connection-explanation{min-height:5.7em}.atelier-stage{height:390px}}

.atelier-journey{position:relative;margin-bottom:70px}.atelier-journey>.atelier{position:sticky;top:85px;margin-bottom:0;min-height:calc(100svh - 100px);padding-block:25px}.atelier-journey .atelier-stage{height: min(540px,70svh)}
@media(max-width:767px){.atelier-journey{margin-bottom:40px}.atelier-journey>.atelier{min-height:0;padding-block:18px;gap:0}.atelier-journey .atelier-intro{margin-bottom:12px}.atelier-journey .atelier-intro>span{margin-bottom:8px}.atelier-journey .atelier-intro strong{font-size:32px}.atelier-journey .connection-explanation{margin-top:12px;min-height:3.8em;font-size:12px}.atelier-journey .atelier-stage{height:clamp(240px,37svh,330px)}.atelier-journey .atelier-object{height:62%;top:24%}.atelier-journey .surface-title{font-size:21px}}
.reduced .atelier-journey{height:auto!important}.reduced .atelier-journey>.atelier{position:relative;top:auto;min-height:0}@media(prefers-reduced-motion:reduce){.atelier-journey{height:auto!important}.atelier-journey>.atelier{position:relative;top:auto;min-height:0}}