/* Atelier Sève — a material study, constructed as six-sided oak boards.
   The photograph leads; the cabinet explains the craft. No canvas or library. */
.seve-atelier-3d{--seve-motion-ease:cubic-bezier(.45,0,.55,1)}
.seve-atelier-3d .site-header{min-height:120px}
.seve-atelier-3d .hero{grid-template-columns:45% 55%;padding-top:26px;padding-bottom:76px;align-items:center}
.seve-atelier-3d .hero h1{font-size:clamp(60px,6.5vw,96px);line-height:1.01;letter-spacing:-.04em}
.seve-atelier-3d .hero h1 em{color:#8b6339}
.seve-atelier-3d .hero h1 em::after{bottom:-8px;height:1px;background:#b49262;transform:scaleX(.77)}
.seve-atelier-3d .hero-intro{font-size:16px;line-height:1.8;max-width:390px;margin-top:30px}
.seve-atelier-3d .hero-copy{padding-bottom:45px;padding-right:28px}
.seve-atelier-3d .hero-visual{min-height:650px;margin-left:20px;margin-bottom:52px;perspective:1400px;isolation:auto;overflow:visible}
.seve-atelier-3d .hero-visual::before{inset:30px -8px 122px 64px;transform:translateZ(-22px) rotate(2deg);border-radius:148px 14px 14px 14px;background:#b18b59;box-shadow:14px 22px 30px #4935201c}
.seve-atelier-3d .hero-photo{inset:0 0 146px 45px;border-radius:150px 12px 12px 12px;box-shadow:14px 26px 36px #49352020}
.seve-atelier-3d .hero-photo img{animation:none!important;object-position:58% center;transform:scale(1.015)}
.seve-atelier-3d .image-stamp{top:28px;right:-12px;transform:translateZ(50px) rotate(5deg);animation:none!important;padding:19px 21px;background:#faf5e8;box-shadow:6px 13px 22px #49352022}
.seve-atelier-3d .hero-visual figcaption{top:calc(100% + 6px);bottom:auto;left:45px;right:2px;padding-top:14px;border-top:1px solid #b4ab9166;font-size:10px;letter-spacing:.035em;transform:none}

/* The stages own different transforms: scene = pointer, stage = perspective,
   model = slow rotation, each board = assembly translation. */
.joinery-study{position:absolute;left:-24px;bottom:54px;width:360px;height:285px;z-index:4;pointer-events:none;transform-style:preserve-3d;transform:translateZ(90px)}
.joinery-stage{position:absolute;inset:0;perspective:1000px;transform-style:preserve-3d}
.joinery-model{position:absolute;left:52px;top:30px;width:260px;height:190px;transform:rotateX(-15deg) rotateY(-27deg) rotateZ(1deg);transform-style:preserve-3d;transform-origin:50% 60%}
.joinery-shadow{position:absolute;left:18px;right:1px;bottom:18px;height:56px;border-radius:50%;background:radial-gradient(ellipse,#58422940,transparent 70%);transform:rotate(-4deg);opacity:.9}
.joinery-caption{position:absolute;display:flex;align-items:center;gap:10px;left:61px;bottom:3px;padding:9px 12px;background:#fbf5e9;color:#604626;box-shadow:5px 8px 16px #4a351a15;font-size:7px;font-weight:600;letter-spacing:.15em;border-radius:2px;transform:rotate(-3deg) translateZ(20px)}
.joinery-caption>i{width:18px;height:1px;background:#af8c5d}
.wood-board{--w:260px;--h:18px;--d:118px;position:absolute;left:0;top:0;width:var(--w);height:var(--h);transform-style:preserve-3d;transform:translate3d(var(--bx,0px),var(--by,0px),var(--bz,0px))}
.wood-face{position:absolute;display:block;width:var(--w);height:var(--h);backface-visibility:hidden;border:1px solid #77512635;background:#c79c60 url('assets/detail-atelier-768.jpg') 45% 40%/700%;box-shadow:inset 0 0 0 1px #f8d5a42b}
.face-front{transform:translateZ(calc(var(--d)/2));background-color:#c29657;background-image:linear-gradient(90deg,#cb9e6766,#f5d4a02b),url('assets/detail-atelier-768.jpg');background-size:auto,700%}
.face-back{transform:rotateY(180deg) translateZ(calc(var(--d)/2));background-color:#936b3b;background-blend-mode:multiply}
.face-top{height:var(--d);top:calc((var(--h) - var(--d))/2);transform:rotateX(90deg) translateZ(calc(var(--h)/2));background-color:#e3be86;background-position:55% 40%;background-blend-mode:screen;border-color:#c8a26c}
.face-bottom{height:var(--d);top:calc((var(--h) - var(--d))/2);transform:rotateX(-90deg) translateZ(calc(var(--h)/2));background-color:#876337;background-blend-mode:multiply}
.face-left{width:var(--d);left:calc((var(--w) - var(--d))/2);transform:rotateY(-90deg) translateZ(calc(var(--w)/2));background-color:#b4864d;background-blend-mode:multiply}
.face-right{width:var(--d);left:calc((var(--w) - var(--d))/2);transform:rotateY(90deg) translateZ(calc(var(--w)/2));background-color:#a57b45;background-blend-mode:multiply}
.board-back{--w:224px;--h:154px;--d:10px;--bx:18px;--by:18px;--bz:-54px}
.board-back .face-front{background-color:#b48a55;background-blend-mode:multiply;box-shadow:inset 5px 7px 15px #3b231742}
.board-left{--w:18px;--h:154px;--d:118px;--bx:0px;--by:18px}
.board-right{--w:18px;--h:154px;--d:118px;--bx:242px;--by:18px}
.board-bottom{--by:172px}
.board-shelf{--w:224px;--h:14px;--d:108px;--bx:18px;--by:91px;--bz:5px}
.board-top{--by:0px}

/* A 12 second exploded-view cycle: release, pause, assemble, rest.
   All positions return to the same assembled geometry at the seam. */
@keyframes seve-joinery-orbit{0%,100%{transform:rotateX(-15deg) rotateY(-27deg) rotateZ(1deg)}50%{transform:rotateX(-19deg) rotateY(-18deg) rotateZ(-1deg)}}
@keyframes seve-board-top{0%,12%,78%,100%{transform:translate3d(0,0,0)}29%,49%{transform:translate3d(0,-46px,0)}}
@keyframes seve-board-bottom{0%,15%,80%,100%{transform:translate3d(0,172px,0)}31%,49%{transform:translate3d(0,199px,0)}}
@keyframes seve-board-left{0%,18%,75%,100%{transform:translate3d(0,18px,0)}34%,51%{transform:translate3d(-28px,18px,0)}}
@keyframes seve-board-right{0%,18%,75%,100%{transform:translate3d(242px,18px,0)}34%,51%{transform:translate3d(270px,18px,0)}}
@keyframes seve-board-back{0%,20%,70%,100%{transform:translate3d(18px,18px,-54px)}36%,53%{transform:translate3d(18px,18px,-92px)}}
@keyframes seve-board-shelf{0%,22%,73%,100%{transform:translate3d(18px,91px,5px)}38%,55%{transform:translate3d(18px,91px,72px)}}
@keyframes seve-joinery-shadow{0%,100%{transform:scale(1) rotate(-4deg);opacity:.9}35%,55%{transform:scale(1.12) rotate(-4deg);opacity:.65}}
.seve-motion .hero-visual.seve-visible .joinery-model{animation:seve-joinery-orbit 12s var(--seve-motion-ease) infinite}
.seve-motion .hero-visual.seve-visible .wood-board{animation-duration:12s;animation-timing-function:var(--seve-motion-ease);animation-iteration-count:infinite}
.seve-motion .hero-visual.seve-visible .board-top{animation-name:seve-board-top}
.seve-motion .hero-visual.seve-visible .board-bottom{animation-name:seve-board-bottom}
.seve-motion .hero-visual.seve-visible .board-left{animation-name:seve-board-left}
.seve-motion .hero-visual.seve-visible .board-right{animation-name:seve-board-right}
.seve-motion .hero-visual.seve-visible .board-back{animation-name:seve-board-back}
.seve-motion .hero-visual.seve-visible .board-shelf{animation-name:seve-board-shelf}
.seve-motion .hero-visual.seve-visible .joinery-shadow{animation:seve-joinery-shadow 12s var(--seve-motion-ease) infinite}
.hero-visual:not(.seve-visible) .joinery-model,.hero-visual:not(.seve-visible) .wood-board,.hero-visual:not(.seve-visible) .joinery-shadow{animation-play-state:paused}

/* Tactile controls and a quieter editorial rhythm around the focal scene. */
.seve-atelier-3d .button{min-height:56px;border:1px solid #496450;background:#294335;box-shadow:0 5px 0 #193327,0 11px 18px #243d3224,inset 0 1px 0 #ffffff20;touch-action:manipulation;transition:transform 180ms cubic-bezier(.22,1,.36,1),box-shadow 180ms cubic-bezier(.22,1,.36,1),background-color 150ms ease}
.seve-atelier-3d .button>span{background:#e6e7cf2e;box-shadow:inset 0 1px 0 #fff2}
.seve-atelier-3d .button-small{min-height:48px}
.seve-atelier-3d .button:active{transform:translateY(3px) scale(.985);transition-duration:0ms;box-shadow:0 2px 0 #193327,0 4px 8px #243d321c}
.seve-atelier-3d .button:focus-visible,.seve-atelier-3d .quiet-link:focus-visible{outline:3px solid #8b6339;outline-offset:6px}
.seve-atelier-3d .expertise{border-top:1px solid #9eaa914f}
.seve-atelier-3d .expertise-list article{padding-block:30px}
.seve-atelier-3d .expertise-list h3{font-size:30px;letter-spacing:-.02em}
.seve-atelier-3d .expertise-list p{font-size:15px;line-height:1.8}
.seve-atelier-3d .detail{font-size:9px;color:#6b755c;letter-spacing:.12em}
.seve-atelier-3d .project-open{box-shadow:6px 14px 20px #233b3210}
.seve-atelier-3d .project figcaption h3{font-size:27px}
.seve-atelier-3d .project figcaption p{font-size:12px;line-height:1.6}
.seve-atelier-3d .steps h3{font-size:28px}
.seve-atelier-3d .steps p{font-size:15px;line-height:1.8}
@media(hover:hover) and (pointer:fine){
 .seve-atelier-3d.seve-motion .button:hover{transform:perspective(600px) translateY(-3px) rotateX(5deg);box-shadow:0 8px 0 #193327,0 20px 25px #243d3227}
 .seve-atelier-3d.seve-motion .button:hover>span{transform:rotate(-12deg) translateZ(5px)}
 .seve-atelier-3d.seve-motion .quiet-link:hover::after{transform:scaleX(1)}
}
@media(max-width:1100px){
 .seve-atelier-3d .hero h1{font-size:clamp(55px,6.3vw,78px)}
 .seve-atelier-3d .hero-visual{min-height:590px;margin-left:14px}
 .seve-atelier-3d .hero-photo{inset:0 0 140px 28px;border-top-left-radius:120px}
 .seve-atelier-3d .hero-visual::before{inset:25px -6px 124px 41px;border-top-left-radius:120px}
 .joinery-study{left:-35px;bottom:45px;scale:.89;transform-origin:bottom left}
 .seve-atelier-3d .hero-visual figcaption{left:28px;font-size:9px}
 .seve-atelier-3d .image-stamp{right:-7px;font-size:8px;padding:15px}
}
@media(max-width:800px){
 .seve-atelier-3d .site-header{min-height:102px}
 .seve-atelier-3d .hero{grid-template-columns:1fr 1fr;padding-top:25px;padding-bottom:55px}
 .seve-atelier-3d .hero-copy{padding-right:16px;padding-bottom:30px}
 .seve-atelier-3d .hero h1{font-size:clamp(47px,7vw,62px)}
 .seve-atelier-3d .hero-intro{font-size:15px;line-height:1.75}
 .seve-atelier-3d .hero-visual{min-height:540px;margin-left:5px}
 .seve-atelier-3d .hero-photo{inset:0 0 128px 12px;border-top-left-radius:90px}
 .seve-atelier-3d .hero-visual::before{inset:24px -5px 114px 22px;border-top-left-radius:90px}
 .joinery-study{left:-34px;bottom:41px;scale:.76}
 .seve-atelier-3d .hero-visual figcaption{left:12px;gap:10px;font-size:8px}
 .seve-atelier-3d .image-stamp{font-size:7px;padding:13px;top:19px}
}
@media(max-width:560px){
 .seve-atelier-3d .site-header{min-height:90px}
 .seve-atelier-3d .hero{display:flex;flex-direction:column;padding-top:24px;padding-bottom:38px;gap:30px}
 .seve-atelier-3d .hero-copy{padding:0;width:100%}
 .seve-atelier-3d .hero h1{font-size:clamp(51px,12.4vw,67px);line-height:1.04}
 .seve-atelier-3d .hero-intro{font-size:15px;max-width:370px;margin-block:26px}
 .seve-atelier-3d .hero-actions .button{min-height:54px;font-size:12px;padding:13px 15px;gap:12px}
 .seve-atelier-3d .hero-actions .quiet-link{font-size:11px;gap:6px}
 .seve-atelier-3d .hero-visual{width:100%;min-height:0;aspect-ratio:.81;margin-left:0}
 .seve-atelier-3d .hero-photo{inset:0 1px 122px 24px;border-radius:84px 10px 10px 10px}
 .seve-atelier-3d .hero-visual::before{inset:19px -2px 109px 35px;border-radius:84px 10px 10px 10px}
 .seve-atelier-3d .hero-photo img{object-position:61% center}
 .joinery-study{left:16px;bottom:43px;scale:.68;transform-origin:bottom left}
 .seve-atelier-3d .image-stamp{right:0;top:15px;font-size:7px;padding:12px}
 .seve-atelier-3d .hero-visual figcaption{left:10px;right:3px;font-size:8px;line-height:1.7;gap:10px;bottom:auto;padding-top:13px}
 .seve-atelier-3d .expertise-list article{padding-block:26px}
 .seve-atelier-3d .expertise-list h3{font-size:28px}
 .seve-atelier-3d .expertise-list p{font-size:15px}
 .seve-atelier-3d .project figcaption h3{font-size:26px}
 .seve-atelier-3d .steps h3{font-size:27px}
}
@media(max-width:370px){
 .seve-atelier-3d .hero-visual{aspect-ratio:.75}
 .joinery-study{left:12px;scale:.6}
 .seve-atelier-3d .hero-photo{left:15px;bottom:118px}
 .seve-atelier-3d .hero-visual::before{left:27px;bottom:105px}
 .seve-atelier-3d .hero-visual figcaption{font-size:7px;left:4px}
 .seve-atelier-3d .hero h1{font-size:51px}
}
@media(prefers-reduced-motion:reduce){
 .seve-atelier-3d .joinery-model,.seve-atelier-3d .wood-board,.seve-atelier-3d .joinery-shadow{animation:none!important}
 .seve-atelier-3d .button:hover,.seve-atelier-3d .button:active{transform:none!important}
}