/* Compact opening and motion inspired by the Manon reference. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.site-header{height:88px}
.hero{padding-top:16px;min-height:0}
.home-header{gap:28px}
.header-kicker{display:flex;align-items:center;gap:10px;flex-shrink:0;width:248px;font-size:11px;font-weight:600;line-height:22px;letter-spacing:.055em}
.short-rule{width:28px}
.kicker-window{display:block}
.kicker-track>span{display:block}
.kicker-track>span+span:before{content:' '}
.kicker-track .kicker-repeat{display:none}
.kicker-ready .kicker-window{height:22px;overflow:hidden}
.kicker-ready .kicker-track,.kicker-ready .kicker-track>span{display:block}
.kicker-ready .kicker-track>span{height:22px;white-space:nowrap}
.kicker-ready .kicker-track>span:before{content:none}
.kicker-toggle{display:grid;place-items:center;flex-shrink:0;width:24px;height:24px;padding:0;border:0;background:transparent;color:var(--ink);border-radius:50%}
.kicker-toggle[hidden]{display:none}
.kicker-toggle:hover{background:var(--accent);color:var(--accent-ink)}
.kicker-toggle-icon{width:7px;height:9px;border-inline:2px solid currentColor}
.kicker-toggle[aria-pressed="true"] .kicker-toggle-icon{width:0;height:0;border:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid currentColor;margin-left:2px}
.kicker-ready .kicker-track{animation:kicker-roll 8s cubic-bezier(.76,0,.24,1) infinite}
.header-kicker.is-paused .kicker-track{animation-play-state:paused}
.hero h1{font-size:clamp(92px,12.1vw,210px);line-height:1;margin-top:14px}
.hero-line{overflow:hidden;padding-top:.08em;margin-top:-.08em}
.hero-word{display:block;transform-origin:0 100%}
.hero-art{width:54%;right:0;top:38px;transition:transform 1.1s cubic-bezier(.16,.7,.25,1);mask-image:linear-gradient(to bottom,transparent,#000 4%,#000 96%,transparent)}
.hero-bottom{max-width:62%;gap:32px;margin-top:16px}
.hero-bottom p{max-width:450px}
.round-link{width:118px;height:118px;transform:translate3d(var(--magnet-x,0px),var(--magnet-y,0px),0) rotate(var(--button-tilt,0deg));transition:transform .35s cubic-bezier(.18,.8,.3,1),background .3s}
.round-link:hover{--button-tilt:-6deg;transform:translate3d(var(--magnet-x,0px),var(--magnet-y,0px),0) rotate(var(--button-tilt))}
.hero-foot{margin-top:28px;padding:18px 0}
.intro-ready .hero-word{animation:hero-word-in 1s cubic-bezier(.16,.8,.25,1) both}
.intro-ready .hero-line:nth-child(2) .hero-word{animation-delay:.12s}
.intro-ready .hero-line:nth-child(3) .hero-word{animation-delay:.24s}
.intro-ready .hero-art img{animation:hero-system-in 1.35s .2s cubic-bezier(.16,.8,.25,1) both}
.intro-ready .hero-bottom{animation:hero-copy-in .85s .5s ease both}
@keyframes hero-word-in{from{transform:translateY(110%) skewY(3deg)}to{transform:translateY(0) skewY(0)}}
@keyframes hero-system-in{from{opacity:0;transform:translateY(30px) scale(.94)}to{opacity:1;transform:none}}
@keyframes hero-copy-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes kicker-roll{0%,42%{transform:translateY(0)}50%,92%{transform:translateY(-22px)}100%{transform:translateY(-44px)}}
.js-motion .reveal{opacity:0;transform:translateY(32px);transition:opacity .85s,transform 1s cubic-bezier(.16,.8,.25,1)}
.js-motion .reveal.is-visible{opacity:1;transform:none;animation:section-heading-in 1s cubic-bezier(.16,.8,.25,1) both}
@keyframes section-heading-in{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(-8% -2% -8% -2%)}}
.js-motion .motion-item{opacity:0;transform:translateY(30px);transition:opacity .75s var(--reveal-delay,0s),transform .9s cubic-bezier(.16,.8,.25,1) var(--reveal-delay,0s)}
.js-motion .motion-item.is-visible{opacity:1;transform:none}
.case-visual{transition:transform .65s cubic-bezier(.16,.8,.25,1)}
.js-motion .case-visual.motion-item{transition:opacity .85s,transform .9s cubic-bezier(.16,.8,.25,1)}
.nav-contact>span,.footer-bottom a>span{display:inline-block;transition:transform .3s}
.nav-contact:hover>span{transform:translate(4px,-4px)}
.footer-bottom a:hover>span{transform:translateY(-5px)}
/* Difference blending is black on white and remains visible on dark sections. */
.cursor-dot{display:none;position:fixed;left:0;top:0;width:0;height:0;pointer-events:none;z-index:1000;mix-blend-mode:difference}
.cursor-dot:before{content:'';position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:#fff;transition:transform .22s cubic-bezier(.16,.8,.25,1);transform:scale(1)}
.cursor-dot.is-interactive:before{transform:scale(2.8)}
.cursor-dot.is-pressed:before{transform:scale(.65)}
@media(hover:hover) and (pointer:fine){
 .has-dot-cursor,.has-dot-cursor *{cursor:none!important}
 .has-dot-cursor .cursor-dot{display:block}
 .case:hover .case-visual.is-visible{transform:translateY(-7px)}
}
@media(min-width:1700px){.hero{padding-top:22px}.hero-art{width:53%;top:36px}.hero-bottom{max-width:60%}}
@media(max-width:1150px){.hero-bottom{max-width:70%}.hero-art{top:34px;width:55%}}
@media(max-width:850px){
 .site-header{height:80px}
 .hero{display:flex;flex-direction:column;padding-top:12px}
 .hero h1{order:1;font-size:18vw;margin-top:14px}
 .hero-art{order:2;position:relative;top:auto;right:auto;width:83%;max-width:620px;align-self:center;margin:4px 0 -8px;transform:none;will-change:auto}
 .hero-bottom{order:3;max-width:100%;margin-top:10px;gap:25px}
 .hero-foot{order:4;margin-top:26px}
}
@media(max-width:640px){
 .site-header{height:76px}
 .short-rule{width:22px}
 .hero h1{font-size:20vw;line-height:1;margin-top:12px}
 .hero-art{width:106%;max-width:none;margin:0 -3% -5px}
 .hero-bottom{margin-top:8px;gap:15px}
 .round-link{width:95px;height:95px}
 .hero-foot{margin-top:24px}
}
@media(prefers-reduced-motion:reduce){
 .intro-ready .hero-word,.intro-ready .hero-art img,.intro-ready .kicker-track,.intro-ready .hero-bottom{animation:none}
 .js-motion .reveal,.js-motion .motion-item{opacity:1;transform:none;clip-path:none;transition:none;animation:none}
 .kicker-ready .kicker-window{height:auto;overflow:visible}.kicker-ready .kicker-track{animation:none;transform:none}.kicker-ready .kicker-track>span{display:block;height:auto;white-space:normal}.kicker-ready .kicker-track>span+span:before{content:' '}
 .kicker-ready .kicker-track .kicker-repeat,.kicker-toggle{display:none}
 .header-kicker{height:auto;align-items:center}
 .has-dot-cursor,.has-dot-cursor *{cursor:revert!important}
 .has-dot-cursor .cursor-dot{display:none}
 .round-link,.round-link:hover,.case:hover .case-visual.is-visible{transform:none}
}
@media print{.cursor-dot{display:none!important}.js-motion .reveal,.js-motion .motion-item{opacity:1;transform:none;clip-path:none}}

@media print{.kicker-ready .kicker-window{height:auto}.kicker-ready .kicker-track{animation:none;transform:none}.kicker-ready .kicker-track>span{display:inline;white-space:normal}.kicker-ready .kicker-track>span+span:before{content:" "}.kicker-ready .kicker-track .kicker-repeat,.kicker-toggle{display:none}}

/* Keep the alternating claim beside the logo; give it one compact header row on phones. */
@media(max-width:1150px){.home-header{gap:20px}.home-header .desktop-nav{display:none}.home-header .menu-toggle{display:flex}}
@media(max-width:760px){
 .home-header{height:auto;min-height:100px;display:grid;grid-template-columns:1fr auto auto;gap:0 14px;padding-top:12px;padding-bottom:8px}
 .home-header .brand{grid-column:1;grid-row:1}.home-header .menu-toggle{grid-column:2;grid-row:1;margin-left:0}.home-header .theme-toggle{grid-column:3;grid-row:1}
 .home-header .header-kicker{grid-column:1/-1;grid-row:2;width:auto;margin-top:4px;justify-self:start}
 .home-header .theme-panel{top:102px}
 .hero{padding-top:4px}
}