/* Original artwork remains separate; all previews retain its full aspect ratio. */
.hero-art.photo-mockup{aspect-ratio:1/1.35;width:100%;margin-left:0;isolation:isolate}
.mockup-layer{position:absolute;box-shadow:0 18px 35px #0004;will-change:transform}
.mockup-layer img{display:block;width:100%;height:auto;filter:none}
.mockup-nordic{width:58%;left:0;top:1%;transform:rotate(-7deg);z-index:1;animation:mockup-float-left 9s ease-in-out infinite}
.mockup-santorini{width:43%;right:0;top:9%;transform:rotate(8deg);z-index:0;animation:mockup-float-right 10s ease-in-out infinite}
.mockup-phone{width:43%;left:40%;top:34%;z-index:2;border:1px solid #9d9c90;border-radius:25px;padding:5px;background:#151713;animation:mockup-float-phone 8s ease-in-out infinite}
.phone-screen{overflow:hidden;border-radius:20px}.phone-screen img{aspect-ratio:1536/2752;object-fit:contain}
@keyframes mockup-float-left{0%,100%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(-5px) rotate(-7deg)}}
@keyframes mockup-float-right{0%,100%{transform:translateY(0) rotate(8deg)}50%{transform:translateY(4px) rotate(8deg)}}
@keyframes mockup-float-phone{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.practice-columns.with-examples{grid-template-columns:1fr}
.with-examples>article{width:100%}
.with-examples>article ul{columns:2;column-gap:48px}
.with-examples>article li{break-inside:avoid}
.practice-columns.with-examples>article:last-child{background:#191c17!important;color:#e9e5da;border:1px solid #454533}
.examples-gallery{margin:32px 0 40px;min-width:0}
.examples-gallery figcaption{font-size:15px;line-height:1.7;color:#d7cfbc;max-width:65ch;margin-bottom:22px}
.examples-track{display:grid;grid-template-columns:1fr 1fr .7fr .7fr;gap:20px;align-items:center}
.example-piece{display:block;min-width:0;cursor:zoom-in;transition:transform .25s ease,opacity .25s ease;touch-action:pan-x pan-y}
.example-piece:hover{opacity:1;transform:translateY(-3px)}
.example-piece img{width:100%;height:auto;display:block}
.example-lightbox{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:64px 24px 24px;border:0;background:#0b0d0af5;color:#fff;overflow:hidden}
.example-lightbox::backdrop{background:#000b}
.example-lightbox[open]{display:flex;align-items:center;justify-content:center}
.example-lightbox>img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
.example-close{position:absolute;right:18px;top:12px;width:44px;height:44px;padding:0;border:1px solid #81734f;border-radius:50%;background:#171b14;color:#f7f5f0;cursor:pointer;font-size:30px;line-height:1;transition:background .2s ease}
.example-close:hover{background:#343526}.example-close:focus-visible{outline:3px solid #e2bd57;outline-offset:3px}
@media(max-width:1000px) and (min-width:761px){.hero-art.photo-mockup{width:100%;margin:0}.examples-track{gap:14px}}
@media(max-width:760px){
 .hero-copy{display:contents}.hero .logo{order:0}.hero-eyebrow{order:1}.hero h1{order:2}.hero-description{order:3}.hero-art.photo-mockup{order:4;width:min(310px,92%);margin:8px auto 28px;max-width:none}.event-info{order:5}.tool-signature{order:6}
 .mockup-phone{border-radius:20px;padding:4px}.phone-screen{border-radius:16px}
 .with-examples>article ul{columns:1}
 .examples-gallery{margin:27px 0 32px}
 .examples-track{display:flex;gap:16px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:0;align-items:center;padding:6px 3px 18px;scrollbar-width:thin;scrollbar-color:#9d8748 #27291f}
 .example-piece{flex:0 0 78%;scroll-snap-align:start}.example-piece:nth-child(n+3){flex-basis:55%}
 .example-lightbox{padding:66px 12px 18px}
}
@media(prefers-reduced-motion:reduce){.mockup-layer{animation:none!important;will-change:auto}.example-piece,.example-close{transition:none}.examples-track{scroll-behavior:auto}}