@import "https://fonts.googleapis.com/css2?family=Outfit:wght@700&display=swap";:root{--orange:#ff6a1a;--orange-600:#e85a12;--orange-50:#fff3ea;--orange-100:#ffe6d4;--cream:#fbf7f2;--cream-2:#f7f1e9;--ink:#0e0b08;--ink-2:#1a140f;--grey-900:#2a231d;--grey-700:#4a413a;--grey-500:#7a6f66;--grey-400:#9c9189;--grey-300:#c9c0b8;--grey-200:#e6dfd8;--grey-100:#f1ece6;--grey-50:#f7f4f0;--white:#fff}*{box-sizing:border-box;margin:0;padding:0}body,html{background-color:var(--cream);width:100%;height:100%;font-family:Outfit,sans-serif;overflow:hidden}#root{width:100%;height:100%}.teaser-container{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.shader-background{z-index:0;width:100%;height:100%;position:absolute;top:0;left:0}.content{z-index:10;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.brand-text{pointer-events:auto;color:var(--white);letter-spacing:-.04em;text-shadow:0 4px 32px #fff6;align-items:baseline;margin:0;font-size:clamp(4rem,15vw,12rem);font-weight:700;display:flex}.dot-interactive{vertical-align:baseline;-webkit-backdrop-filter:blur();cursor:pointer;will-change:width, height, margin-left;background-color:#fff0;border:1px solid #fff0;border-radius:999px;width:.15em;height:.15em;margin-left:0;transition:width .7s,height .7s,background-color .7s,border-color .7s,box-shadow .7s,margin-left .7s,-webkit-backdrop-filter .7s,backdrop-filter .7s;display:inline-block;position:relative;overflow:hidden;transform:translateZ(0);box-shadow:0 8px 32px #ff6a1a00}.dot-interactive.expanded{-webkit-backdrop-filter:blur(12px);cursor:default;background-color:#ffffff0d;border-color:#ffffff1a;width:clamp(250px,35vw,500px);height:clamp(3.5rem,8vw,5rem);margin-left:1.5rem;box-shadow:0 8px 32px #ff6a1a26}.dot-btn{background-color:var(--orange);cursor:pointer;width:.15em;height:.15em;font-size:inherit;color:var(--white);will-change:width, height, right, box-shadow;border:none;border-radius:999px;justify-content:center;align-items:center;transition:all .7s;display:flex;position:absolute;top:50%;right:0;transform:translateY(-50%)translateZ(0);box-shadow:0 0 20px #ff6a1a,0 0 40px #e85a12}.dot-interactive.expanded .dot-btn{width:clamp(2.5rem,6vw,4.5rem);height:clamp(2.5rem,6vw,4.5rem);right:.5rem;box-shadow:0 0 #ff6a1a00}.dot-interactive.expanded .dot-btn:hover{background-color:var(--orange-600)}.dot-btn svg{opacity:0;will-change:opacity, transform;transition:all .2s;transform:scale(.5)translateZ(0)}.dot-interactive.expanded .dot-btn svg{opacity:1;transition:all .4s .4s;transform:scale(1)translateZ(0)}.input-wrapper{opacity:0;pointer-events:none;will-change:opacity;align-items:center;width:clamp(150px,20vw,300px);transition:opacity .3s;display:flex;position:absolute;top:0;bottom:0;left:1.5rem;transform:translateZ(0)}.dot-interactive.expanded .input-wrapper{opacity:1;pointer-events:auto;transition:opacity .4s .3s}.input-wrapper input{width:100%;color:var(--white);background:0 0;border:none;outline:none;padding:0;font-family:inherit;font-size:clamp(1rem,2vw,1.8rem);font-weight:500}.input-wrapper input::placeholder{color:#ffffff4d}@keyframes spin{to{transform:rotate(360deg)}}.spin-wrap{animation:.7s linear infinite spin;display:flex}@media (hover:none){.dot-interactive{min-width:1.2rem;min-height:1.2rem}.dot-interactive.is-mobile.expanded{border-radius:999px;width:90vw;height:3.5rem;margin-left:0;position:fixed;top:calc(50vh + 3.5rem);left:5vw}.dot-interactive.is-mobile.expanded .dot-btn{width:2.8rem;height:2.8rem}.dot-interactive.is-mobile.expanded .input-wrapper{opacity:1;pointer-events:auto;width:calc(100% - 4rem);transition:opacity .4s .3s}.input-wrapper input{font-size:1rem}}
