/* A continuous, light-filled 3D workshop. All overrides are scoped to the new hero. */
.loading-screen { display:none; }
.atelier-in-view .command-dock,.atelier-in-view .cursor-orb { opacity:0;pointer-events:none; }
.atelier-in-view .header-cta i { color:white;background:#234cbb; }
.atelier { position:relative; z-index:4; height:610svh; min-height:3300px; background:#f5f5ee; color:#16334a; }
/* Clip the decorative backdrop without creating an inner scroll container:
   focusing a control must not shift the hero underneath the fixed header. */
.atelier-sticky { position:sticky; top:0; height:100svh; min-height:620px; overflow:hidden; overflow:clip; isolation:isolate; }
.atelier-backdrop { position:absolute; inset:0; z-index:-1; background:radial-gradient(ellipse at 77% 38%,#fff 0%,#edf1ed 36%,#f5f5ee 69%); }
.atelier-backdrop::after { content:""; position:absolute; width:62%; height:105%; right:-16%; top:1%; border-radius:50%; border:1px solid rgba(56,78,94,.065); box-shadow:0 0 0 70px rgba(255,255,255,.17),0 0 0 140px rgba(255,255,255,.12); transform:rotate(-23deg); }
.atelier-copy { position:absolute; z-index:3; left:clamp(28px,5.8vw,112px); top:49%; transform:translateY(-50%); width:43%; pointer-events:none; }
.atelier-copy > * { pointer-events:auto; }
.atelier-eyebrow { display:flex; align-items:center; gap:12px; margin:0 0 28px; color:#526d7b; font-size:13px; font-weight:600; letter-spacing:.13em; }
.atelier-eyebrow > span { width:24px; height:2px; background:#2451c5; }
.atelier-copy h1 { margin:0; color:#183449; font-size:clamp(40px,4.6vw,79px); line-height:1.43; letter-spacing:-.065em; font-weight:800; }
.atelier-copy h1 > span { display:block; white-space:nowrap; padding-right:.15em; }
.atelier-blue { color:#2559bf; }
.atelier-lead { margin:26px 0 13px; font-size:clamp(15px,1.2vw,20px); line-height:1.9; font-weight:500; letter-spacing:.03em; }
.atelier-detail { margin:0; color:#6a7c84; font-size:14px; line-height:1.95; }
.atelier-cta { display:inline-flex; align-items:center; justify-content:space-between; gap:38px; margin-top:25px; padding:13px 17px 13px 22px; border-radius:4px; color:white; background:#234cbb; font-size:14px; font-weight:600; box-shadow:0 6px 18px #214cbb16; transition:background .2s,transform .2s; }
.atelier-cta:hover { background:#183b95;transform:translateY(-2px); }
.atelier-cta i { display:grid; place-items:center; width:27px; height:27px; border-left:1px solid #ffffff36; padding-left:14px; font-style:normal; font-size:20px; }
.atelier-signature { display:flex; align-items:center; gap:12px; margin-top:30px; color:#7f8b91; font:500 10px/1.5 "IBM Plex Mono",monospace; letter-spacing:.1em; }
.atelier-signature i { display:block; width:24px; height:1px; background:#a6b2b5; }
.atelier-visual { position:absolute; z-index:2; top:clamp(86px,12vh,135px); left:37%; right:-4%; bottom:162px; touch-action:pan-y; }
.atelier-visual canvas { display:block; width:100%; height:100%; outline:none; }
.atelier-scene-label { position:absolute; top:122px; right:5.2%; z-index:2; display:flex; align-items:center; flex-wrap:wrap; gap:10px; width:260px; color:#455e70; font:500 11px/1.6 "IBM Plex Mono",monospace; letter-spacing:.08em; }
.atelier-scene-label > i { width:6px; height:6px; border-radius:50%; background:#2864c5; }
.atelier-scene-label small { margin-left:16px; color:#8e9ca4; font-size:9px; }
.atelier-caption { position:absolute; z-index:3; bottom:116px; left:62%; display:flex; align-items:flex-start; gap:14px; width:34%; pointer-events:none; }
.atelier-caption-mark { display:grid; place-items:center; flex:0 0 29px; height:29px; border:1px solid #b8c6d0; border-radius:50%; color:#234cbb; font-size:17px; }
.atelier-caption strong { display:block; color:#27435c; font-size:14px; font-weight:600; }
.atelier-caption p { margin:5px 0 0; color:#798b96; font-size:12px; line-height:1.7; }
.atelier-bottom { position:absolute; z-index:4; left:5.8%; right:5.8%; bottom:0; height:89px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-top:1px solid #203e541c; }
.atelier-scroll { display:flex; align-items:center; gap:13px; }
.atelier-scroll > span { color:#2859bd; font-size:20px; }
.atelier-scroll p { font-size:12px; color:#758994; letter-spacing:.025em; }
.atelier-steps { list-style:none; display:flex; gap:clamp(18px,3vw,50px); padding:0; margin:0; font:500 12px/1.5 "IBM Plex Mono",monospace; letter-spacing:.06em; }
.atelier-steps li { color:#99a6ad; display:flex; align-items:center; gap:10px; transition:color .3s; }
.atelier-steps li span { font-size:10px; }
.atelier-steps li[aria-current="step"] { color:#254cae; }
.atelier-motion { display:flex; align-items:center; gap:8px; color:#7b8d97; background:none; padding:10px 0 10px 10px; border:0; cursor:pointer; font-size:11px; }
.atelier-motion i { font-style:normal; font-size:12px; }
.atelier-motion:hover { color:#254cae; }
.atelier-motion:focus-visible,.atelier-cta:focus-visible { outline:3px solid #6c91d7;outline-offset:5px; }
.atelier-track { position:absolute; left:0; bottom:0; width:100%; height:2px; background:#dfe5e7; }
.atelier-track i { display:block; width:100%; height:100%; background:#2859bd; transform-origin:left; transform:scaleX(0); }
.atelier-fallback { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; width:90%; opacity:1; transition:opacity .4s; }
.atelier-fallback > span { font:500 11px monospace; letter-spacing:.15em; color:#8e9ca4; }
.atelier-fallback strong { display:block; margin-top:15px; color:#2859bd; font:600 clamp(21px,3vw,38px)/1.3 "Syne",sans-serif; }
.atelier-fallback strong i { font-style:normal; color:#93aab9; }
.atelier-fallback p { color:#7d929e;font-size:13px; }
.atelier[data-scene="ready"] .atelier-fallback { opacity:0; visibility:hidden; }
.atelier[data-scene="fallback"] .atelier-visual canvas { display:none; }
.atelier[data-scene="fallback"] .atelier-fallback { opacity:1;visibility:visible; }
.atelier[data-scene="fallback"] { height:100svh; min-height:620px; }
.atelier[data-scene="fallback"] .atelier-scroll,.atelier[data-scene="fallback"] .atelier-motion { visibility:hidden; }

@media(min-width:1800px) {
  .atelier-copy { left:max(6vw,calc((100vw - 1640px)/2)); }
  .atelier-visual { right:1%;left:40%; }
}
@media(max-width:1100px) and (min-width:821px) {
  .atelier-copy { left:4%;width:45%; }
  .atelier-copy h1 { font-size:clamp(35px,4.6vw,50px); }
  .atelier-eyebrow { font-size:12px;letter-spacing:.06em; }
  .atelier-visual { left:35%;right:-7%;top:135px;bottom:137px; }
  .atelier-scene-label { top:111px;right:2%;width:238px; }
  .atelier-detail { font-size:12px; }
  .atelier-caption { left:54%;width:42%;bottom:118px; }
  .atelier-scroll p { max-width:135px; }
  .atelier-signature { margin-top:21px; }
}
@media(max-width:820px) {
  .atelier { height:560svh;min-height:3000px; }
  .atelier-sticky { height:100svh;min-height:0; }
  .atelier-copy { left:24px;right:24px;top:93px;transform:none;width:auto; }
  .atelier-eyebrow { margin-bottom:13px;gap:9px;font-size:11px;letter-spacing:.07em; }
  .atelier-eyebrow > span { width:16px; }
  .atelier-copy h1 { font-size:clamp(34px,8.6vw,50px);line-height:1.39;letter-spacing:-.055em; }
  .atelier-lead { margin:13px 0 0;font-size:13px;line-height:1.8; }
  .atelier-detail,.atelier-signature { display:none; }
  .atelier-cta { display:none; }
  .atelier-cta i { width:18px;height:23px;padding-left:8px;font-size:17px; }
  .atelier-visual { top:290px;left:-5%;right:-5%;bottom:130px; }
  .atelier-scene-label { top:298px;right:21px;width:auto;font-size:9px;gap:7px; }
  .atelier-scene-label small { display:none; }
  .atelier-scene-label > i { width:4px;height:4px; }
  .atelier-caption { bottom:85px;left:24px;width:calc(100% - 48px);gap:11px; }
  .atelier-caption-mark { flex-basis:24px;height:24px;font-size:15px; }
  .atelier-caption strong { font-size:13px; }
  .atelier-caption p { margin-top:3px;font-size:11px; }
  .atelier-bottom { left:24px;right:24px;height:70px;gap:6px;align-items:flex-start;padding-top:13px; }
  .atelier-scroll { position:absolute;bottom:5px;left:0;gap:7px; }
  .atelier-scroll > span { font-size:12px; }
  .atelier-scroll p { margin:0;font-size:10px; }
  .atelier-steps { gap:22px;font-size:10px; }
  .atelier-steps li { gap:5px; }
  .atelier-steps li span { font-size:9px; }
  .atelier-motion { padding:0;font-size:10px;gap:3px; }
}
@media(max-width:375px) {
  .atelier-copy { left:20px;right:20px;top:86px; }
  .atelier-copy h1 { font-size:32px; }
  .atelier-cta { bottom:0;gap:7px;font-size:10px;padding:8px; }
  .atelier-lead { font-size:12px; }
  .atelier-visual { top:267px;bottom:125px;left:-6%;right:-6%; }
  .atelier-scene-label { top:276px; }
  .atelier-steps { gap:14px; }
}
@media(max-height:720px) and (min-width:821px) {
  .atelier-copy { top:51%; }
  .atelier-copy h1 { font-size:clamp(36px,4.3vw,65px); }
  .atelier-eyebrow { margin-bottom:17px; }
  .atelier-lead { margin-top:16px; }
  .atelier-signature { margin-top:18px; }
  .atelier-cta { margin-top:18px; }
  .atelier-visual { top:100px;bottom:144px; }
  .atelier-scene-label { top:107px; }
  .atelier-caption { bottom:95px; }
  .atelier-bottom { height:68px; }
}
@media(max-height:550px) and (orientation:landscape) {
  .atelier-sticky { min-height:0; }
  .atelier { height:3000px; }
  .atelier-copy { top:93px;transform:none;left:4%;width:44%; }
  .atelier-copy h1 { font-size:clamp(25px,3.4vw,38px);line-height:1.25; }
  .atelier-eyebrow { margin-bottom:11px;font-size:10px; }
  .atelier-lead { margin-top:12px;font-size:12px;line-height:1.6; }
  .atelier-detail,.atelier-signature { display:none; }
  .atelier-cta { display:inline-flex;margin-top:13px;padding:8px 12px;font-size:11px; }
  .atelier-visual { left:38%;right:-4%;top:73px;bottom:90px; }
  .atelier-scene-label { display:none; }
  .atelier-caption { left:57%;bottom:55px; }
  .atelier-caption strong { font-size:11px; }
  .atelier-caption p { font-size:10px; }
  .atelier-bottom { height:44px; }
  .atelier-scroll p,.atelier-motion { font-size:10px; }
}
@media(prefers-reduced-motion:reduce) {
  .atelier-motion { display:none; }
  .atelier-fallback,.atelier-steps li,.atelier-cta { transition:none; }
}