@font-face{font-family:'Kerbi Sans';src:url('assets/dm-sans-regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Kerbi Sans';src:url('assets/dm-sans-medium.ttf') format('truetype');font-style:normal;font-weight:500;font-display:swap}
[hidden]{display:none!important}
.kinetic-hero{--accent:#9274bd;max-width:1440px;margin:auto;padding:67px 40px 43px;text-align:center;overflow:clip;background:#fff;font-family:'Kerbi Sans',Arial,sans-serif}
.kinetic-top{display:flex;justify-content:center;align-items:center;gap:14px;font-size:11px;letter-spacing:.09em;line-height:1.5;color:#686860;margin-bottom:35px}
.kinetic-top>span:first-child{display:none}
.chapter-window{position:relative;display:block;overflow:clip;padding:5px 0 7px}
.kinetic-chapter{display:block;font-weight:500;font-variant-numeric:tabular-nums;min-height:17px;white-space:nowrap;will-change:transform,opacity}
body.studio.kerbi-studied .kinetic-hero h1{font-family:'Switzer','Kerbi Sans',Arial,sans-serif;font-size:clamp(65px,7.7vw,108px);font-weight:600;line-height:1.07;letter-spacing:-.035em;margin:0;padding:0;color:#171716;font-synthesis:none}
.kinetic-line{position:relative;white-space:nowrap}
.first-line{display:flex;align-items:center;justify-content:center;column-gap:.13em;width:max-content;margin:0 auto;min-height:1.16em}
.verb-slot{position:relative;display:block;flex:none;line-height:1.1;height:1.14em;text-align:right;overflow:clip;padding-bottom:.04em}
.kinetic-verb{position:relative;display:block;white-space:nowrap;transform-origin:50% 75%;will-change:transform,opacity}
.verb-slot.is-measured .kinetic-verb{position:absolute;right:0;top:0}
.kinetic-char{display:inline-block;white-space:pre;transform-origin:50% 85%}
.art-slot{display:block;position:relative;flex:none;width:1.02em;height:1.09em;align-self:center;isolation:isolate;transform:translateY(-.015em);transition:width .36s cubic-bezier(.22,1,.36,1),height .36s cubic-bezier(.22,1,.36,1),transform .36s cubic-bezier(.22,1,.36,1)}
.art-slot.is-pointing{width:1.1em;height:1.14em;transform:translateY(-.03em)}
.headline-art{position:absolute;inset:0;background-image:url('assets/headline-objects.png');background-size:300% 200%;background-repeat:no-repeat;transform-origin:50% 65%;mix-blend-mode:multiply;will-change:transform,opacity}
.art-0{background-position:0 0}.art-1{background-position:50% 0}.art-2{background-position:100% 0;transform-origin:50% 20%}.art-3{background-position:0 100%}.art-4{background-position:50% 100%}
.art-work-point{background-image:url('assets/kerbi-work-points.png');background-size:auto 90%;background-position:50% 50%;background-repeat:no-repeat;mix-blend-mode:normal;transform-origin:50% 70%}
.art-details{position:absolute;inset:0;width:100%;height:100%;overflow:visible;color:var(--accent);pointer-events:none}
.art-details>*{opacity:0;transform-box:fill-box;transform-origin:center}
.fixed-ending{display:block;letter-spacing:inherit;line-height:1.1;transform:translateY(-.005em)}
.companion-line{display:block;font:inherit;line-height:1.07;letter-spacing:inherit;margin-top:.025em}
.self-dot{color:#9171b9}
.kinetic-bottom{margin:30px auto 0;display:flex;flex-direction:column;align-items:center;gap:24px}
.kinetic-bottom p{font:400 16px/1.65 'Kerbi Sans',Arial,sans-serif;color:#6b6b64;letter-spacing:-.012em;max-width:520px}
.kinetic-actions{display:flex;align-items:center;gap:25px}
.kinetic-actions .button{font:400 14px 'Kerbi Sans',Arial,sans-serif;min-height:50px;padding:0 24px;gap:30px;border-radius:8px;background:#171716}
.kinetic-actions .button>span{font-size:20px}
.kinetic-actions .button{position:relative;overflow:hidden;isolation:isolate;transition:background .25s,box-shadow .25s}
.kinetic-actions .button::before{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 25%,#ffffff24 50%,transparent 75%);transform:translateX(-120%);transition:transform .65s;pointer-events:none}
.kinetic-actions .button:hover::before,.kinetic-actions .button:focus-visible::before{transform:translateX(120%)}
.kinetic-actions .button:hover{background:#30243f;box-shadow:0 5px 15px #32203e12}
.kinetic-actions .button>span{transition:transform .3s}.kinetic-actions .button:hover>span{transform:translate(2px,-2px)}
.kinetic-watch{font:400 14px 'Kerbi Sans',Arial,sans-serif;min-height:48px;display:flex;align-items:center;gap:9px}
.kinetic-watch>span{width:25px;height:25px;border-radius:50%;border:1px solid #dcdcd6;display:grid;place-items:center;padding-left:1px;font-size:9px;transition:background .2s}
.kinetic-watch:hover>span{background:#ede7f5}
body.studio.kerbi-studied .site-header{height:96px}
body.studio.kerbi-studied .site-header nav a{font-size:13px}
body.studio.kerbi-studied .site-header>.button{font-size:12px}
@media(min-width:1550px){.kinetic-hero{padding-top:80px;padding-bottom:54px}}
@media(max-width:1100px) and (min-width:741px){.kinetic-hero{padding-top:60px;padding-inline:24px}.kinetic-hero h1{font-size:7.65vw!important}.kinetic-top{margin-bottom:28px}}
@media(max-width:740px){
 body.studio.kerbi-studied .site-header{height:80px}
 .kinetic-hero{padding:44px 24px 30px}
 .kinetic-top{margin-bottom:24px;font-size:10px;letter-spacing:.08em}
 body.studio.kerbi-studied .kinetic-hero h1{font-size:clamp(43px,10.5vw,70px);line-height:1.06;letter-spacing:-.035em}
 .first-line{flex-wrap:wrap;column-gap:.16em;row-gap:.08em;justify-content:center;width:100%}
 .fixed-ending{flex-basis:100%;width:100%;text-align:center;line-height:1.05;font-size:1.13em;transform:none}
 .companion-line{font-size:.89em;margin-top:.2em;line-height:1.12}
 .kinetic-bottom{margin-top:25px;gap:23px}.kinetic-bottom p{font-size:15px;line-height:1.65;max-width:330px}.kinetic-bottom p br{display:none}
 .kinetic-actions{gap:19px}.kinetic-actions .button{font-size:13px;min-height:48px;padding-inline:20px;gap:23px}.kinetic-watch{font-size:13px;gap:8px}
}
@media(max-width:370px){.kinetic-hero{padding-inline:19px}.kinetic-actions{gap:14px}.kinetic-actions .button{font-size:12px;padding-inline:17px;gap:20px}.kinetic-watch{font-size:12px}}
@media(prefers-reduced-motion:reduce){.kinetic-hero *,.kinetic-hero *::before{animation:none!important;transition:none!important}.art-details,.kinetic-actions .button::before{display:none!important}}
