@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--blue:#2352df;--ink:#102348;--paper:#f4f1e8;--green:#c4f466}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}header{height:94px;border-bottom:1px solid #10234830;display:flex;align-items:center;gap:40px;margin:0 4%;font-size:11px;font-weight:700;letter-spacing:1px}.wordmark{font-size:65px;letter-spacing:-8px;line-height:1;margin-right:auto}.wordmark span{font-size:34px;display:inline-block;transform:translateY(-15px)}.edition{margin-left:auto}.hero{position:relative;padding:48px 5% 30px;min-height:790px;overflow:hidden}.eyebrow,.tiny,.section-label{font-size:11px;letter-spacing:1.8px;font-weight:700}.dot{display:inline-block;width:8px;height:8px;background:var(--blue);border-radius:50%;margin-right:8px}h1,h2{font-family:'Space Grotesk',Arial,sans-serif;font-weight:600;letter-spacing:-6px;margin:0}h1{font-size:clamp(76px,8.5vw,145px);line-height:.95;margin-top:34px;position:relative;z-index:2;width:60%}em{font-family:Georgia,serif;font-weight:400}h1 em{color:var(--blue)}.asterisk{color:var(--blue);display:inline-block;font-size:.65em;vertical-align:top;position:absolute;left:74%;top:6%}.cover{position:absolute;right:5%;top:56px;width:39%;max-width:540px;margin:0;transform:rotate(4deg);background:var(--blue);padding:12px;box-shadow:16px 20px 0 #1023480d}.cover img{width:100%;display:block;aspect-ratio:1;object-fit:cover}.cover figcaption{color:white;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:17px 4px 5px;font-size:10px}.cover figcaption b{font-size:24px;letter-spacing:-1px}.cover figcaption span{max-width:90px}.sticker{position:absolute;right:-17px;top:-20px;background:var(--green);border:1px solid var(--ink);border-radius:50%;height:100px;width:100px;display:grid;place-content:center;text-align:center;font-size:12px;font-weight:700;transform:rotate(13deg)}.intro{margin:30px 0 25px;display:flex;gap:28px;align-items:start}.tiny{padding-top:6px;font-size:9px}.intro p{margin:0;font-size:20px;line-height:1.45}.contract{display:flex;position:relative;align-items:stretch;width:66%;margin-top:32px;z-index:3;gap:8px}.ca{padding:13px 18px;background:var(--ink);color:white;flex:1;min-width:0}.ca>span{font-size:8px;letter-spacing:2px;color:#b0bcd5}.ca button{border:0;padding:8px 0 0;display:flex;gap:15px;justify-content:space-between;width:100%;text-align:left;background:none;color:inherit;font-size:12px;overflow-wrap:anywhere}.ca i{font-style:normal;color:var(--green)}.xbutton{background:var(--green);display:flex;align-items:center;justify-content:center;gap:10px;font-size:26px;width:85px}.xbutton span{font-size:16px;animation:arrow 1.7s infinite}.pump{background:var(--blue);color:white;display:flex;align-items:center;padding:0 20px;font-weight:700;font-size:12px}.edge{margin-top:27px;font-size:9px;letter-spacing:2px}.contract #status{position:absolute;bottom:-23px;font-size:11px}.ticker{background:var(--green);overflow:hidden;padding:19px 0;border-block:1px solid var(--ink);font-family:'Space Grotesk',sans-serif;font-size:27px;font-weight:600;white-space:nowrap}.ticker span{display:block;width:max-content;animation:marquee 24s linear infinite}.story{display:grid;grid-template-columns:1fr 2.4fr 1.8fr;gap:40px;padding:105px 5%;align-items:start}.section-label{line-height:1.6;font-size:9px;max-width:140px}h2{font-size:clamp(44px,5vw,77px);line-height:1;letter-spacing:-3.5px}.story p{font-size:18px;line-height:1.6;margin-top:27px}.story .small{font-size:13px;line-height:1.7;color:#59647b}.receipt{border:1px solid #10234840;transform:rotate(3deg);padding:27px 24px;background:#fffdf6}.receipt>span:first-child{font-size:10px;letter-spacing:2px}.receipt>div{border-bottom:1px dashed #10234840;padding:25px 0}.receipt small{font-size:9px;display:block;margin-bottom:9px}.receipt b{font-size:17px}.receipt p{font-size:10px;letter-spacing:1px}.receipt .signature{display:block;text-align:right;font-family:Georgia,serif;font-style:italic;font-size:29px}.tracks{background:var(--blue);color:var(--paper);padding:65px 5% 80px}.tracks>.section-label{max-width:none}.chart-heading{display:flex;align-items:end;justify-content:space-between;margin:32px 0 50px}.chart-heading p{font-size:15px;line-height:1.5}.player{display:grid;grid-template-columns:1fr 1.5fr;gap:8%}.record{padding:25px;background:#1945c6;display:flex;flex-direction:column;align-items:center}.vinyl{width:min(100%,350px);aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,#111b2f 0 3px,#253249 4px 5px);display:grid;place-items:center;box-shadow:0 15px 30px #00175b66;animation:spin 18s linear infinite}.vinyl span{border-radius:50%;height:110px;width:110px;background:var(--green);color:var(--ink);display:grid;place-content:center;text-align:center;font-size:30px;line-height:.8;letter-spacing:-3px;font-weight:bold}.record-caption{font-size:9px;letter-spacing:2px;margin-top:22px}.track{display:flex;width:100%;align-items:center;gap:25px;text-align:left;color:inherit;background:transparent;border:0;border-bottom:1px solid #ffffff40;padding:27px 12px}.track>span{font-size:12px;opacity:.7}.track b{font-size:29px;letter-spacing:-1px;font-weight:500}.track small{display:block;font-size:8px;letter-spacing:2px;margin-top:10px}.track i{margin-left:auto;font-size:15px;font-style:normal}.track.selected{background:var(--green);color:var(--ink)}.mood{display:flex;justify-content:space-between;align-items:center;margin-top:27px;font-size:9px;letter-spacing:1px}.bars{height:20px;display:flex;gap:4px;align-items:center}.bars i{width:4px;height:20px;background:var(--green);animation:pulse .8s infinite alternate}.bars i:nth-child(2n){animation-delay:.3s;height:10px}.bars i:nth-child(3n){animation-delay:.5s;height:14px}.demo{display:block;margin-top:18px;font-size:10px;opacity:.65}.closing{padding:80px 5%;position:relative}.closing>span{font-size:9px;letter-spacing:2px}.closing h2{margin:30px 0 40px;font-size:clamp(57px,7.5vw,113px)}.closing h2 span{color:var(--blue);margin-left:30px}.closing a{font-size:11px;border-bottom:1px solid;padding-bottom:8px}footer{border-top:1px solid #10234840;padding:28px 5%;display:flex;gap:25px;justify-content:space-between;font-size:10px}footer span{font-size:9px;line-height:1.5;color:#59647b}button:focus-visible,a:focus-visible{outline:3px solid #e79251;outline-offset:5px}@keyframes marquee{to{transform:translateX(-35%)}}@keyframes arrow{50%{transform:translate(4px,-4px)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{to{transform:scaleY(.3)}}@media(min-width:1500px){.hero{min-height:870px}}@media(max-width:760px){header{height:72px;gap:20px}header>a:not(.wordmark){font-size:8px}.edition{display:none}.wordmark{font-size:50px}.hero{padding:30px 6%;min-height:0}.eyebrow{font-size:8px}h1{font-size:72px;width:100%;letter-spacing:-4px;margin-top:24px}.asterisk{left:auto;right:0}.cover{position:relative;right:auto;top:auto;width:85%;margin:38px auto 35px;transform:rotate(3deg)}.sticker{width:75px;height:75px;font-size:9px}.intro{gap:22px}.intro p{font-size:18px}.contract{width:100%;flex-wrap:wrap}.ca{flex-basis:calc(100% - 78px)}.xbutton{width:68px}.pump{height:48px;width:100%;justify-content:center}.edge{margin-top:32px;font-size:8px}.ticker{font-size:20px;padding:14px 0}.story{grid-template-columns:1fr;padding:60px 6%;gap:30px}.section-label{max-width:none}.story h2{font-size:58px}.receipt{max-width:90%;margin:0 auto;width:100%}.tracks{padding:50px 6%}.chart-heading{align-items:start;gap:15px}.chart-heading h2{font-size:48px}.chart-heading p{font-size:12px}.player{grid-template-columns:1fr;gap:25px}.record{padding:25px}.vinyl{width:220px}.track{padding:24px 12px}.track b{font-size:25px}.closing{padding:55px 6%}.closing h2{font-size:57px}.closing h2 span{margin-left:5px}footer{flex-wrap:wrap;gap:18px}footer span{width:100%;order:3}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important}}
@media(min-width:761px){.contract{width:54%}.ca{padding-inline:14px}.pump{padding-inline:13px}.xbutton{width:65px;flex-shrink:0}.cover{width:37%;right:4%}}
@media(max-width:760px){.hero{display:flex;flex-direction:column}.eyebrow{order:0}h1{order:1}.contract{order:2;margin-top:26px}.cover{order:3}.intro{order:4;margin-top:5px}.edge{order:5;margin-top:0}}
