:root{--header-height:80px;--cream:#FAFAF9;--burgundy:#800020;--ink:#17130f;--muted:#68615e;--line:#e7e3e0;font-family:'Spectral',Georgia,serif;font-weight:400;color:var(--ink);background:var(--cream);font-synthesis:none;color-scheme:light}
*{box-sizing:border-box}html{min-height:100%;scroll-padding-top:110px}body{margin:0;min-height:160svh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--burgundy);outline-offset:6px}.skip-link{position:fixed;top:-100px;left:20px;z-index:100;background:var(--cream);padding:10px}.skip-link:focus{top:12px}
.site-header{--nav-font-size:14px;--demo-height:32px;position:relative;z-index:20;height:var(--header-height);padding:0 38px;display:flex;align-items:center;gap:52px;background:var(--cream)}
.brand{--size:calc(var(--demo-height)*78/89.6*.9);transform:translateY(calc(var(--size)*8/78));display:flex;align-items:center;gap:calc(var(--size)*16/78);color:var(--burgundy);flex:none}.brand img{width:calc(var(--size)*49.6/78);height:calc(var(--size)*89.6/78);transform:translateY(calc(var(--size)*-8/78));object-fit:contain}.brand span{font-size:var(--size);font-weight:400;line-height:1;letter-spacing:-.035em;padding-bottom:calc(var(--size)*8/78)}
nav{display:flex;align-items:center;gap:34px;margin-left:auto;font-size:var(--nav-font-size)}nav a:hover,nav a[aria-current=page]{color:var(--burgundy)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:13px;border:1px solid transparent;border-radius:999px;font-size:inherit;line-height:1.3;height:var(--demo-height);padding:0 16px}.button-burgundy{color:var(--cream);background:var(--burgundy);border-color:var(--burgundy)}.button-burgundy:hover{background:#680019}.demo-button{margin-left:0;white-space:nowrap}
.hero{position:relative;min-height:calc(100svh - var(--header-height));display:flex;flex-direction:column;justify-content:center;text-align:center;padding:24px 24px calc(24px + var(--header-height))}.hero h1{margin:0 auto;max-width:1100px;font-size:clamp(46px,5.1vw,75px);font-weight:400;line-height:1.07;letter-spacing:-.055em;text-wrap:balance}.hero-description{white-space:nowrap;font-size:20px;line-height:1.6;letter-spacing:-.02em;margin:29px auto 0;color:#514944}.mobile-break{display:none}
h2{font-weight:400;line-height:1.18;letter-spacing:-.04em;margin:0}dialog{border:1px solid var(--line);border-radius:10px;padding:40px;background:var(--cream);color:var(--ink);max-width:440px}dialog::backdrop{background:rgb(24 15 15 / 20%)}dialog h2{font-size:30px}dialog p{font-size:18px;color:var(--muted);line-height:1.5;margin-bottom:0}.dialog-close{position:absolute;right:14px;top:8px;border:0;background:none;font-size:25px;color:var(--muted)}
@media(max-width:1000px){.site-header{gap:35px;padding-inline:26px}nav{gap:27px}.hero-description{font-size:18px}}
@media(max-width:640px){:root{--header-height:72px}.site-header{--nav-font-size:12px;--demo-height:26px;height:var(--header-height);padding:0 18px;gap:18px}nav{gap:15px}.button.demo-button{padding:0 12px;gap:0}.demo-button span{display:none}.hero{padding-inline:18px}.hero h1{font-size:clamp(36px,7.6vw,48px);line-height:1.12;letter-spacing:-.05em}.hero-description{font-size:clamp(9px,3vw,17px);line-height:1.6;margin-top:24px}.mobile-break{display:block}dialog{margin-inline:20px;padding:32px}}
@media(max-width:460px){.site-header{--nav-font-size:10.5px;--demo-height:22px;padding-inline:14px;gap:12px}nav{gap:11px}.button.demo-button{padding:0 10px}}
@media(max-width:380px){.hero h1{font-size:33px}}


.cursor-trail{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;background:transparent;z-index:2147483646}
@media(hover:hover) and (pointer:fine){.custom-cursor-active,.custom-cursor-active *{cursor:none!important}.custom-cursor-active dialog[open],.custom-cursor-active dialog[open] *{cursor:auto!important}}

/* Continue directly from the full-screen black ending without another lead-in. */
.welcome-track{position:relative;z-index:4;height:500svh;margin-top:-100svh;pointer-events:none}
.welcome-stage{position:sticky;top:0;height:100svh;visibility:hidden;background:#000;overflow:hidden}
.welcome-story{position:absolute;inset:0;display:grid;place-items:center;background:#000}
.welcome-story h2,.welcome-logo{position:relative;grid-area:1/1;opacity:0}
.welcome-story h2{margin:0;padding:24px;color:var(--cream);font-size:clamp(36px,6vw,80px);font-weight:400;letter-spacing:-.045em;text-align:center}
.welcome-mark{display:block;width:clamp(140px,21vw,300px);height:clamp(210px,31.5vw,450px);background:var(--cream);-webkit-mask:url('assets/brand/kamino-logo-mask.png') center/contain no-repeat;mask:url('assets/brand/kamino-logo-mask.png') center/contain no-repeat}
.logo-spread{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.blank-page{min-height:100svh;background:#000}

/* Keep sticky animation surfaces on stable, isolated compositor layers. */
.welcome-stage,#panel-one .stage{isolation:isolate}
.logo-spread,#panel-one .clip canvas{transform:translateZ(0);backface-visibility:hidden}
.welcome-story h2,.welcome-logo{will-change:opacity}

.site-footer{background:#000;color:var(--cream);padding:48px 3vw 30px}
.footer-top{display:grid;grid-template-columns:1fr minmax(250px,33%);gap:64px}
.footer-brand{--demo-height:28px;color:var(--cream);width:max-content}
.footer-motto{max-width:310px;font-size:clamp(16px,1.5vw,21px);line-height:1.4;letter-spacing:-.025em;margin:18px 0 0}
.footer-contact h2{font-size:clamp(18px,1.5vw,21px);margin:0 0 20px;letter-spacing:-.02em}
.footer-contact-link{display:flex;align-items:center;gap:14px;margin-top:14px;color:#aaa5a2;font-size:clamp(16px,1.4vw,20px);line-height:1.35}
.footer-contact-link svg{width:20px;height:20px;flex:none}.footer-contact-link[href]:hover{color:var(--cream)}
.footer-wordmark{display:flex;justify-content:center;height:clamp(110px,15vw,220px);overflow:hidden;text-align:center;margin-top:115px;border-bottom:1px solid #34302f}
.footer-wordmark span{display:block;flex:none;padding-right:.025em;font-size:clamp(140px,22vw,360px);line-height:.95;letter-spacing:-.025em;font-kerning:normal;background:linear-gradient(115deg,#7f7770,#f5f0e8 40%,#99918a 70%,#e0d6cc);background-clip:text;-webkit-background-clip:text;color:transparent;transform:translateY(.06em)}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:32px;padding-top:48px;color:#aaa5a2}
.footer-bottom small,.footer-bottom nav{font-size:clamp(14px,1.2vw,17px);line-height:1.4}.footer-bottom nav{gap:40px}
@media(max-width:720px){.site-footer{padding:40px 24px 28px}.footer-top{grid-template-columns:1fr;gap:48px}.footer-contact h2{margin-bottom:22px}.footer-wordmark{margin-top:70px;height:18vw}.footer-wordmark span{font-size:22vw}.footer-bottom{align-items:flex-start;flex-direction:column;gap:24px;padding-top:30px}.footer-bottom nav{margin-left:0;flex-wrap:wrap;gap:14px 24px}.footer-contact-link svg{width:18px;height:18px}}
