.bottom a,.top a{text-decoration:none}.bg,body{min-height:100svh;z-index:0}.top,body{background:0 0;display:flex}.container,.top,body{display:flex}.top,h1{text-align:left}.bottom,.js.ready .bottom{opacity:1}.bg,.col-image{overflow:hidden}.bg div,.bg::after,.bottom::before{position:absolute}.bg,.bg::after,.bottom::before{inset:0;pointer-events:none}*{margin:0;padding:0;box-sizing:border-box}html{font-size:clamp(1rem, 1.2vw, 1.2vw)}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;justify-content:center;align-items:center;padding:2vw;position:relative;overflow-x:hidden}.top a{color:#fff;margin-right:1rem;border-bottom:2px solid #fff;transition:border-bottom .2s}.col h2,h1,p{margin:0}.top a:hover{border-bottom:2px solid transparent}.bottom a{color:#111;padding-bottom:2px;border-bottom:2px solid #ccc}.bottom a:hover{background:linear-gradient(90deg,#fde149,#009c59,#00addd,#4c45a8,#ab364f,#de5d39,#fde149);background-size:200% auto;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:3s linear infinite gradientMove}@keyframes gradientMove{0%{background-position:0 center}100%{background-position:200% center}}.bg{position:fixed}.bottom,.col-image,.container{position:relative}.bg div{border-radius:3rem;animation:6s ease-in-out infinite alternate gradient;will-change:transform;filter:saturate(110%) contrast(105%);opacity:.9;transform-origin:center}.bg::after{content:'';height:100%;width:100%;backdrop-filter:blur(200px)}@keyframes gradient{0%{transform:scale(1) translate(0,0)}50%{transform:scale(1.7) translate(100px,0)}100%{transform:scale(1.1) translate(30px,-30px)}}.bg div:first-child{width:110%;height:100%;background-color:#fde149;animation-delay:0s;opacity:.8;left:-12%}.bg div:nth-child(2){width:45%;height:70%;background-color:#009c59;top:-10%;left:0;animation-delay:0s}.bg div:nth-child(3){width:25%;height:85%;background-color:#00addd;top:-20%;left:0;animation-delay:0s}.bg div:nth-child(4){width:65%;height:50%;background-color:#4c45a8;bottom:-15%;left:-20%;animation-delay:0s}.bg div:nth-child(5){width:80%;height:50%;background-color:#ab364f;bottom:-10%;right:-10%;animation-delay:2s}.bg div:nth-child(6){width:50%;height:35%;background-color:#de5d39;bottom:-10%;right:-10%;animation-delay:1s}.container{width:80vw;height:fit-content;flex-direction:column;z-index:1;margin:1rem 0}h1{font-size:clamp(36px, 12vw, 120px);line-height:1;text-transform:uppercase}p{line-height:1.6}.top{flex:0 0 20%;color:#fff;align-items:center;justify-content:flex-start;padding:clamp(1.5rem,2.6vw,3rem);font-family:Lekton,monospace;margin:0 0 .5vw}.top p{font-size:clamp(20px, 3vw, 36px)}.bottom{flex:1 1 auto;background:#fdfaeb;color:#111;border-radius:20px;box-shadow:0 8px 24px rgba(0,0,0,.15);padding:clamp(1.5rem,3vw,3rem);display:grid;grid-template-columns:1fr;align-items:stretch;font-family:Lato,sans-serif;max-height:fit-content;gap:clamp(1.5rem,5vw,2.25rem);transition:opacity .12s}.js .bottom{opacity:0}@media (min-width:800px){.bottom{grid-template-columns:repeat(3,minmax(0,1fr));gap:2.5vw}}.col{display:flex;flex-direction:column;gap:.8em}.col h2{font-size:clamp(18px, 2.4vw, 32px)}.col-1 .col-inner,.col-2 .col-inner{transform:translateY(0);will-change:transform}.col-image{align-self:start;width:100%;max-width:600px;border-radius:50%;justify-self:center}.col-image::before{content:"";display:block;padding-top:100%}.col-image img,.col-image picture{position:absolute;inset:0;width:100%;height:100%}.col-image img{object-fit:cover;display:block;-webkit-transition:-webkit-transform .4s,filter .4s;-moz-transition:-moz-transform .4s,filter .4s;-o-transition:-o-transform .4s,filter .4s;transition:transform .4s,filter .4s;filter:brightness(1.05)}.col-image:hover img{-webkit-transform:scale(1.05);-moz-transform:scale(1.05);-ms-transform:scale(1.05);-o-transform:scale(1.05);transform:scale(1.05)}@media (min-width:1000px){.col-image{max-width:600px}}.bottom::before{content:"";background:rgba(0,0,0,.08);border-radius:inherit}@media (max-width:800px){.top p{display:flex;flex-direction:column;gap:.4rem;font-size:clamp(20px, 4vw, 36px)}.top a{margin-right:0}.top a:last-child{margin-bottom:1rem}h1{font-size:clamp(36px, 27vw, 160px)}}.col-inner p::selection{background:#fde149}noscript .col-1 .col-inner,noscript .col-2 .col-inner{transform:none!important}