@font-face{font-family:Manrope;font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/manrope-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:Manrope;font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/manrope-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Noto Sans';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/noto-sans-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Noto Sans';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/noto-sans-latin-500-normal.woff2') format('woff2')}
*{box-sizing:border-box}
html,body{margin:0;min-width:280px;color:var(--ojojo-color-on-surface)}
/* The document background also paints browser safe areas and overscroll. */
html{background:var(--ojojo-color-info-container);animation:glowro-background 30s ease-in-out infinite}
body{font-family:'Noto Sans',sans-serif;background-color:inherit}
.coming-soon{position:relative;height:100vh;height:100svh;min-height:0;overflow:hidden;isolation:isolate;background-color:inherit}
@keyframes glowro-background{0%,100%{background-color:var(--ojojo-color-info-container)}33.333%{background-color:var(--ojojo-color-secondary-container)}66.667%{background-color:var(--ojojo-color-surface-container)}}
.site-header{display:flex;justify-content:center;padding:32px 24px 16px}
.brand-logo.ojojo-mark{height:28px;width:84px}
.intro{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:60px;height:668px;padding:60px 32px;text-align:center}
.intro>*{flex-shrink:0}
.content-spacer{height:152px;width:100%}
.eyebrow{--ojojo-typography-headline--overline-font-family:var(--ojojo-typography-headline-overline-font-name);--ojojo-typography-headline--overline-font-size:var(--ojojo-typography-headline-overline-font-size);--ojojo-typography-headline--overline-line-height:var(--ojojo-typography-headline-overline-line-height);--ojojo-typography-headline--overline-tracking:var(--ojojo-typography-headline-overline-font-tracking);--ojojo-typography-headline--overline-font-weight:500}
.title-group{display:flex;flex-direction:column;align-items:center;gap:24px;max-width:1100px}
/* Figma's Display/L regular override, composed with the existing Heading API. */
.page-title{--ojojo-typography-display--m-font-family:var(--ojojo-typography-display-font-name);--ojojo-typography-display--m-font-size:var(--ojojo-typography-display-l-font-size);--ojojo-typography-display--m-line-height:var(--ojojo-typography-display-l-line-height);--ojojo-typography-display--m-tracking:var(--ojojo-typography-display-l-font-tracking);--ojojo-typography-display--m-font-weight:400}
.page-description{--ojojo-typography-display--s-font-family:var(--ojojo-typography-display-font-name);--ojojo-typography-display--s-font-size:var(--ojojo-typography-display-s-font-size);--ojojo-typography-display--s-line-height:var(--ojojo-typography-display-s-line-height);--ojojo-typography-display--s-tracking:var(--ojojo-typography-display-s-font-tracking);--ojojo-typography-display--s-font-weight:500}
.contact-links{display:flex;justify-content:center;gap:16px}
.contact-links .ojojo-link{position:relative}
.contact-links .ojojo-link::after{content:'';position:absolute;inset:-12px -5px}
.artwork{--art-height:400px;position:absolute;left:50%;bottom:calc(var(--art-height) * -.135);width:calc(var(--art-height) * 1.14695343);height:var(--art-height);transform:translateX(-50%);pointer-events:none}
.artwork img,.artwork video,.artwork canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block}
.artwork video,.artwork canvas{opacity:0}
.artwork[data-renderer='native'] video,.artwork[data-renderer='packed'] canvas{opacity:1}
.artwork[data-renderer] img{visibility:hidden}
.artwork[data-renderer='packed'] video{opacity:0}
@media(max-height:839px) and (min-width:768px){.intro{height:auto;padding:0 32px;margin-top:clamp(24px,calc(100svh - 740px),100px)}}
@media(max-width:1100px){.intro{gap:44px}.title-group{max-width:900px}.page-description{max-width:800px}}
@media(max-width:767px){
 .site-header{padding-top:max(24px,env(safe-area-inset-top))}
 .intro{height:auto;margin-top:clamp(28px,calc(100svh - 680px),72px);padding:0 24px;gap:32px}
 .content-spacer{display:none}
 .page-title .ojojo-heading{white-space:pre-line}
 .title-group{gap:20px;max-width:520px}
 .page-title{--ojojo-typography-display--m-font-size:34px;--ojojo-typography-display--m-line-height:38px;--ojojo-typography-display--m-tracking:-.8px}
 .page-description{--ojojo-typography-display--s-font-size:22px;--ojojo-typography-display--s-line-height:28px;--ojojo-typography-display--s-tracking:-.6px;max-width:430px}
 .artwork{--art-height:min(400px,78vw,max(200px,calc(100svh - 430px)))}
}
@media(max-width:380px){.intro{padding:0 20px;gap:24px}.title-group{gap:16px}.page-title{--ojojo-typography-display--m-font-size:30px;--ojojo-typography-display--m-line-height:34px}.page-description{--ojojo-typography-display--s-font-size:20px;--ojojo-typography-display--s-line-height:26px}}
@media(max-width:340px){.page-title{--ojojo-typography-display--m-font-size:clamp(24px,calc(10vw - 3px),30px)}}
@media(max-height:650px) and (min-width:768px){.intro{height:auto;gap:24px;margin-top:20px;padding:0 32px}.content-spacer{display:none}.title-group{gap:16px}.artwork{--art-height:260px}.page-title{--ojojo-typography-display--m-font-size:36px;--ojojo-typography-display--m-line-height:40px}.page-description{--ojojo-typography-display--s-font-size:24px;--ojojo-typography-display--s-line-height:28px}}
@media(prefers-reduced-motion:reduce){html{animation:none}}

@media(max-height:500px) and (min-width:600px){.site-header{padding-top:16px}.intro{position:absolute;top:80px;left:24px;width:56%;margin:0;padding:0;gap:20px}.title-group{gap:16px}.page-title{--ojojo-typography-display--m-font-size:30px;--ojojo-typography-display--m-line-height:34px}.page-description{--ojojo-typography-display--s-font-size:18px;--ojojo-typography-display--s-line-height:24px}.artwork{left:82%;--art-height:min(300px,78svh)}}