@import"https://fonts.googleapis.com/css2?family=Boldonse&family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Inter:wght@100..900&display=swap";:root{--hue: 223;--sat: 10%;--pixel-size: .5em;--control-width: 10.5em;--control-height: 22em;--transition-medium: .3s ease}[data-theme=light]{--bg: hsl(var(--hue), var(--sat), 95%);--fg: hsl(var(--hue), var(--sat), 15%);--accent: hsl(0, 80%, 55%);--dot-bg-color: #222;--dot-fg-color: #fff;--bg-pattern-color: rgba(0, 0, 0, .07)}[data-theme=dark]{--bg: #000000;--fg: #ffffff;--accent: hsl(0, 80%, 55%);--dot-bg-color: #333;--dot-fg-color: #ffffff;--bg-pattern-color: rgba(255, 255, 255, .15)}*{margin:0;padding:0;box-sizing:border-box;font-family:Garamond,sans-serif}body,html{overscroll-behavior:none;background-color:#000;width:100vw;height:100vh;color:#eee}main{position:fixed;width:100vw;height:100vh;left:0;top:0;overflow:hidden}.scrollable{position:absolute;top:55%;left:0;width:100%;will-change:transform}@media (min-width: 768px){.scrollable{top:15%}}.logo-container{position:relative;display:flex;justify-content:flex-end;flex-direction:row-reverse;align-items:flex-start;top:20px;left:20px}.image-container{position:relative;width:100%;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-direction:column-reverse;z-index:10}@media (min-width: 768px){.image-container{flex-direction:row}}.word-container{margin-left:10px}h1{font-family:Boldonse,sans-serif;letter-spacing:-.02em;color:#eee;mix-blend-mode:difference}.whosyourdaddy{position:absolute;width:fit-content;font-family:Boldonse,sans-serif;top:90px;left:-120px;color:#fff;font-size:4em;font-weight:900;transform:rotate(-90deg)}@media (min-width: 768px){.whosyourdaddy{transform:rotate(0);font-size:12em;top:20px;left:0}}.social-container{position:absolute;transform:rotate(-90deg);top:100px;right:-40px;display:flex;justify-content:center;flex-direction:column;align-items:flex-start;z-index:100}@media (min-width: 768px){.social-container{right:100px;transform:rotate(0)}}a{position:relative;cursor:pointer;font-family:Garamond,sans-serif;color:#00cadc;padding:0;display:inline-block;z-index:1;text-decoration:none;font-size:12px;opacity:1;transition:color .3s ease;font-weight:700}a:after{content:"";position:absolute;top:0;left:0;width:0;height:100%;background-color:#00cadc;z-index:-1;transition:width .3s cubic-bezier(.34,1.56,.64,1)}a:hover:after{width:100%}a:hover{color:#000;mix-blend-mode:difference;opacity:1}.image-container img{visibility:hidden}.grid{display:grid;gap:1.5em;grid-template-columns:repeat(2,1fr);margin:auto}.control{position:relative;width:var(--control-width);height:var(--control-height)}.controls{z-index:200}.control-container{display:flex;flex-direction:column;align-items:center}.dot-control{position:relative;width:var(--control-width);height:var(--control-height);margin:auto;left:100%;cursor:pointer}.control-label{text-transform:uppercase;letter-spacing:1px;margin-top:.8rem;color:var(--fg);transition:color .5s ease}.control-value{margin-top:.2rem;color:var(--accent);transition:color .5s ease}.three-blob-bg-canvas{position:fixed;z-index:0;top:0;left:0;width:100vw;height:100vh;pointer-events:none}.effect-canvas{position:fixed;z-index:1;top:0;left:0;width:100vw;height:100vh;pointer-events:none}@media (min-width: 768px){.effect-canvas{top:1%}}.audio-canvas{display:block;width:100%;height:100%;background:transparent;pointer-events:auto;position:static;right:0;z-index:1}
