/* Motion layer. Everything animated is gated on .motion-ok (set in <head> unless the visitor prefers reduced motion). */

:root{--t0:0s;--base:0s}
.pt-arrive{--t0:.9s}
.intro-enabled{--base:2.1s}
.pt-arrive.intro-enabled{--base:3s}
.pt-arrive:not(.intro-enabled){--base:.6s}

/* ---- Shell elements: hidden unless motion is on ---- */
.scroll-progress,.cursor,.cursor-glow,.page-curtain{display:none}
.motion-ok .scroll-progress{display:block;position:fixed;top:0;left:0;right:0;height:2px;z-index:90;background:linear-gradient(90deg,#78434e,#af926a);transform-origin:left;transform:scaleX(var(--sp,0));pointer-events:none}

/* ---- Paper texture ---- */
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.4;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .4 0 0 0 0 .3 0 0 0 0 .25 .22 0 0 0 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---- Page transition curtain ---- */
.motion-ok .page-curtain{display:grid;place-items:center;position:fixed;inset:0;z-index:200;pointer-events:none;background:linear-gradient(125deg,#80515b,#6b3c47 65%,#75434d);transform:translateY(calc(100% + 14vh));visibility:hidden}
.page-curtain:before{content:'';position:absolute;left:0;right:0;bottom:calc(100% - 1px);height:14vh;background:#80515b;border-radius:50% 50% 0 0/100% 100% 0 0}
.curtain-mono{width:92px;height:92px;opacity:0;transition:opacity .3s .2s}
.curtain-mono *{stroke-dasharray:1;stroke-dashoffset:0}
.pt-leave .page-curtain{visibility:visible;animation:curtain-in .62s cubic-bezier(.7,0,.2,1) forwards}
.pt-leave .curtain-mono{opacity:1}
.pt-arrive .page-curtain{visibility:visible;transform:translateY(0);animation:curtain-out .85s .12s cubic-bezier(.7,0,.2,1) forwards}
.pt-arrive .curtain-mono{opacity:1}
@keyframes curtain-in{from{transform:translateY(calc(100% + 14vh))}to{transform:translateY(0)}}
@keyframes curtain-out{from{transform:translateY(0);visibility:visible}to{transform:translateY(-101%);visibility:hidden}}

.pt-fade body>*{transition:opacity .25s ease}
.pt-fade body>*:not(script){opacity:0}
.fly{position:fixed;z-index:210;margin:0;pointer-events:none;transform-origin:0 0;color:#dfc393}
.fly .art-halo{opacity:.35}

/* ---- Line-by-line headline rise ---- */
.motion-ok .ln{display:block;overflow:hidden;padding:.12em 0 .16em;margin:-.12em 0 -.16em}
.motion-ok .ln-in{display:block;animation:ln-rise 1.05s calc(var(--base) + var(--i,0)*.13s) cubic-bezier(.2,.7,.2,1) backwards}
@keyframes ln-rise{from{transform:translateY(112%) rotate(2deg);opacity:0}to{transform:none;opacity:1}}

/* ---- Intro: monogram drawn line by line ---- */
.opening-mono{margin-bottom:22px;overflow:visible}
.intro-enabled .opening-mono circle,.intro-enabled .opening-mono path{animation:draw 1.05s cubic-bezier(.5,0,.2,1) backwards}
.intro-enabled .opening-mono circle{animation-delay:calc(var(--t0) + .05s);animation-duration:1.1s}
.intro-enabled .opening-mono path:nth-of-type(1){animation-delay:calc(var(--t0) + .45s)}
.intro-enabled .opening-mono path:nth-of-type(2){animation-delay:calc(var(--t0) + .65s)}
.intro-enabled .opening-mono path:nth-of-type(3){animation-delay:calc(var(--t0) + .9s);animation-duration:.6s}
.intro-enabled .opening-name,.intro-enabled .opening-label{animation:brand-arrive .8s calc(var(--t0) + 1.05s) cubic-bezier(.2,.7,.2,1) backwards}
.intro-enabled .opening-label{animation-delay:calc(var(--t0) + 1.2s)}
@keyframes draw{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
@keyframes draw2{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
.pt-arrive.intro-enabled .opening-screen{animation-delay:.9s}
.pt-arrive.intro-enabled .opening-brand{animation-delay:.9s}
.pt-arrive.intro-enabled .opening-line{animation-delay:1.1s}
.pt-arrive.intro-enabled .header{animation-delay:2.85s}
.pt-arrive.intro-enabled .hero-copy{animation-delay:2.95s}
.pt-arrive.intro-enabled .portrait{animation-delay:3.07s}

/* ---- Hero: parallax portrait + drifting light ---- */
.motion-ok .hero .portrait{translate:0 calc(var(--py,0px)*-.5)}
.motion-ok .portrait-frame img{transform:translateY(calc(var(--py,0px)*.45)) scale(1.1)}
.motion-ok .portrait:before{animation:orb 9s ease-in-out infinite alternate}
@keyframes orb{from{transform:translate(-14px,10px) scale(.96)}to{transform:translate(16px,-12px) scale(1.06)}}
.motion-ok .area-detail .detail-art{translate:0 calc(var(--py,0px)*-.35)}

/* ---- Pointer light + custom cursor (fine pointers only) ---- */
.cursor-on .cursor-glow{display:block;position:fixed;left:0;top:0;width:560px;height:560px;margin:-280px 0 0 -280px;border-radius:50%;pointer-events:none;z-index:1;mix-blend-mode:multiply;background:radial-gradient(circle,#dfc39338,transparent 62%)}
.cursor-on .cursor{display:block;position:fixed;left:0;top:0;width:0;height:0;z-index:300;pointer-events:none}
.cursor-ring{position:absolute;left:-17px;top:-17px;width:34px;height:34px;border:1px solid #a88a54;border-radius:50%;transition:transform .4s cubic-bezier(.2,.7,.2,1),background .3s,border-color .3s,opacity .3s}
.cursor-label{position:absolute;left:-40px;top:-8px;width:80px;text-align:center;font:600 9px/16px Arial,sans-serif;letter-spacing:1.4px;color:#fff5e7;opacity:0;transition:opacity .25s;text-transform:uppercase}
.cursor.is-link .cursor-ring{transform:scale(1.6);background:#af926a22}
.cursor.is-card .cursor-ring{transform:scale(2.7);background:#78434ed9;border-color:transparent}
.cursor.is-card .cursor-label{opacity:1}
.cursor.is-down .cursor-ring{transform:scale(.8)}
.cursor.is-hidden{opacity:0}

/* ---- Cards: tilt, glare, drawn icons ---- */
.card-glare{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),#ffffff33,transparent 55%)}
.motion-ok .area-card.soft-enter{animation-delay:calc(var(--d,0)*.1s)}
.motion-ok .area-card.draw-in .art-lines>*{animation:draw 1.4s calc(.3s + var(--d,0)*.1s) cubic-bezier(.5,0,.2,1) backwards}
@media(hover:hover) and (pointer:fine){
.motion-ok .area-card:hover{transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-8px);transition:transform .15s ease-out,box-shadow .5s,border-color .5s,color .4s}
.motion-ok .area-card:hover .card-glare{opacity:1}
.motion-ok .area-card:hover .art-lines>*,.motion-ok .area-card.draw-in:hover .art-lines>*{animation:draw2 1s cubic-bezier(.5,0,.2,1) backwards}
}

/* ---- Detail page: list reveal, drawn + scroll-driven icon ---- */
.motion-ok .topic-list li{position:relative;border-bottom-color:transparent;opacity:0;transform:translateX(-14px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.motion-ok .topic-list li:after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.5,0,.2,1)}
.motion-ok .topic-list li.in{opacity:1;transform:none}
.motion-ok .topic-list li.in:after{transform:scaleX(1)}
.motion-ok .topic-list li:before{display:inline-block;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.motion-ok .topic-list li.in:before{transform:rotate(180deg)}
.detail-art{position:relative}
.motion-ok .detail-art:before{content:'';position:absolute;inset:5%;border:1px dashed #b3976c88;border-radius:50%;transform:rotate(calc(var(--sp,0)*260deg));pointer-events:none}
.motion-ok .detail-art .art-halo{stroke-dasharray:2 5;transform:rotate(calc(var(--sp,0)*-200deg));transition:none}
.motion-ok .detail-art .art-spark{transform:rotate(calc(var(--sp,0)*300deg));transition:none}
.motion-ok .detail-art.in:not(.shared) .art-lines>*{animation:draw 1.9s .2s cubic-bezier(.5,0,.2,1) backwards}
.motion-ok .detail-art.shared{animation:none!important}
.motion-ok .detail-art.shared:not(.shared-done) .legal-art{opacity:0}
.motion-ok .detail-art.shared-done .legal-art{animation:fade-in .35s ease both}
@keyframes fade-in{from{opacity:0}to{opacity:1}}

/* ---- Marquee ---- */
.marquee-set[aria-hidden]{display:none}
.marquee-set{display:flex;justify-content:space-between;align-items:center;width:100%}
.principles .marquee{display:block;padding:0;width:calc(100% - 112px)}
.principles .marquee-track{padding:22px 0}
.motion-ok .principles .marquee{width:100%;max-width:none;overflow:hidden;padding:0;display:block;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.motion-ok .principles .marquee-track{display:flex;width:max-content;animation:marquee 34s linear infinite;padding:22px 0}
.motion-ok .principles .marquee:hover .marquee-track{animation-play-state:paused}
.motion-ok .principles .marquee-set,.motion-ok .principles .marquee-set[aria-hidden]{display:flex;flex-shrink:0;width:auto;gap:60px;padding-right:60px;justify-content:flex-start;font:17px var(--serif)}
.motion-ok .principles i{display:inline}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.marquee-set i:last-child{display:none}
.motion-ok .principles .marquee-set i:last-child{display:inline}
@media(max-width:720px){.marquee-set{display:grid;grid-template-columns:1fr 1fr;gap:14px;text-align:center;font-size:15px}}

/* ---- Stats strip ---- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat{padding:46px 20px;text-align:center;display:flex;flex-direction:column;gap:12px;align-items:center}
.stat+.stat{border-left:1px solid var(--line)}
.stat-num{font:clamp(44px,5.4vw,76px)/1 var(--serif);letter-spacing:-2px;color:var(--wine);font-variant-numeric:tabular-nums}
.stat-text{letter-spacing:-1.5px}
.stat-label{font-size:9px;letter-spacing:2px;color:var(--muted)}
.motion-ok .stat{opacity:0;transform:translateY(18px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.motion-ok .stat.in{opacity:1;transform:none}

/* ---- Curved surfaces ---- */
.small-cta{position:relative;overflow:hidden;isolation:isolate;margin-top:30px;margin-bottom:70px;padding:64px;border-radius:44px;background:linear-gradient(125deg,#80515b,#6b3c47 65%,#75434d);color:#f7efe5}
.small-cta:before{content:'';position:absolute;z-index:-1;width:420px;height:420px;right:-130px;top:-150px;border:1px solid #dfc3932e;border-radius:50%}
.small-cta:after{content:'';position:absolute;z-index:-1;width:260px;height:260px;right:30px;bottom:-170px;border:1px solid #dfc39324;border-radius:50%}
.small-cta .eyebrow{color:#dbb2ab}
.small-cta em{color:#dfb6ad}
.small-cta .button{background:#f6f2ec;color:#6b3c47}
.small-cta .button:hover{background:#fff;color:#55202a}
.home-about{border:0;border-radius:48px;background:linear-gradient(180deg,#efe7dd,#f4eee6);padding:70px 30px;margin-bottom:30px}
.contact{border-radius:clamp(28px,5vw,64px) clamp(28px,5vw,64px) 0 0}

@media(max-width:720px){
.stats{grid-template-columns:1fr}
.stat{padding:30px 20px}
.stat+.stat{border-left:0;border-top:1px solid var(--line)}
.small-cta{padding:40px 28px;border-radius:30px;margin-bottom:45px}
.home-about{border-radius:32px;padding:48px 22px}
.motion-ok .principles .marquee-set{gap:36px;padding-right:36px;font-size:15px}
.fly{display:none}
}

@media(prefers-reduced-motion:reduce){
.page-curtain,.cursor,.cursor-glow,.scroll-progress{display:none!important}
.marquee-set[aria-hidden]{display:none!important}
}

/* iOS draws ↗ as a coloured emoji unless forced to text. */
body{font-variant-emoji:text}
