@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Unbounded:wght@500;700;800;900&display=swap');

:root{color-scheme:dark;font-family:Manrope,Arial,sans-serif;background:#080808;color:#f5f5f5}
*{box-sizing:border-box}
html{min-height:100%}
body{margin:0;min-height:100vh;background:radial-gradient(ellipse 65% 45% at 50% 66%,#1b1b1b 0%,#080808 70%)}
a{color:inherit;text-decoration:none}
.page-shell{width:min(1220px,100%);min-height:100vh;margin:auto;padding:0 clamp(22px,5vw,62px);display:flex;flex-direction:column}
.site-header{height:92px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #272727}
.wordmark{display:inline-flex;align-items:center;font-size:16px;letter-spacing:.1em;font-weight:800}.wordmark span{font-weight:500;color:#999}.wordmark i{width:6px;height:6px;border-radius:50%;background:#fff;margin-left:5px;align-self:flex-start}
.header-note{font-size:11px;color:#757575;font-weight:700;letter-spacing:.04em}
main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:58px 0 70px}
.intro{text-align:center;margin-bottom:42px}.eyebrow{display:inline-flex;align-items:center;gap:10px;border:1px solid #313131;border-radius:999px;padding:8px 13px;color:#a4a4a4;font-size:10px;font-weight:800;letter-spacing:.13em}.eyebrow-dot{width:6px;height:6px;background:#fff;border-radius:50%;box-shadow:0 0 10px #fff7}
h1{font-size:clamp(43px,6.6vw,82px);line-height:1.07;letter-spacing:-.085em;font-weight:800;margin:25px 0 18px}h1 em{font-style:normal;color:#8b8b8b}.intro p{font-size:clamp(13px,1.5vw,16px);color:#999;margin:0}
.app-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.app-card{min-height:390px;position:relative;overflow:hidden;display:flex;flex-direction:column;border:1px solid #333;border-radius:22px;padding:26px;background:#111;isolation:isolate;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}
.app-card::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.5;transition:opacity .3s ease}.sleepy-card::before{background:radial-gradient(circle at 76% 49%,#303030 0%,transparent 50%)}.dizzy-card::before{background:radial-gradient(circle at 75% 45%,#292929 0%,transparent 53%)}
.app-card:hover,.app-card:focus-visible{transform:translateY(-6px);border-color:#777;box-shadow:0 24px 70px #0009;outline:none}.app-card:hover::before,.app-card:focus-visible::before{opacity:1}
.card-top{display:flex;justify-content:space-between;align-items:flex-start}.card-index{font-size:10px;font-weight:800;letter-spacing:.14em;color:#939393}.card-arrow{display:grid;place-items:center;width:32px;height:32px;border:1px solid #3c3c3c;border-radius:50%;font-size:17px;line-height:1;transition:background .25s,color .25s,transform .25s}.app-card:hover .card-arrow,.app-card:focus-visible .card-arrow{background:#fff;color:#111;transform:rotate(45deg)}
.card-symbol{position:absolute;right:clamp(28px,6vw,85px);top:84px;display:grid;place-items:center;width:148px;height:148px;border:1px solid #424242;border-radius:32px;background:#1a1a1a;transform:rotate(-12deg);box-shadow:16px 18px 0 #ffffff08;transition:transform .32s ease,border-color .32s ease}.card-symbol svg{width:76px;height:76px;color:#f2f2f2}.dizzy-symbol{transform:rotate(10deg);border-radius:50%}.app-card:hover .sleepy-symbol,.app-card:focus-visible .sleepy-symbol{transform:rotate(-4deg) scale(1.05);border-color:#888}.app-card:hover .dizzy-symbol,.app-card:focus-visible .dizzy-symbol{transform:rotate(3deg) scale(1.05);border-color:#888}
.card-copy{margin-top:auto;display:flex;flex-direction:column;gap:8px}.card-copy strong{font-size:clamp(34px,4vw,53px);line-height:1;letter-spacing:-.06em}.card-copy>span{color:#aaa;font-size:14px;line-height:1.5;font-weight:600}.card-cta{margin-top:24px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #3a3a3a;padding-top:17px;font-size:12px;font-weight:800}.card-cta span{font-size:20px;line-height:1;transition:transform .25s ease}.app-card:hover .card-cta span,.app-card:focus-visible .card-cta span{transform:translateX(5px)}
footer{min-height:61px;border-top:1px solid #272727;display:flex;align-items:center;justify-content:space-between;color:#6d6d6d;font-size:11px;font-weight:700}
@media(max-width:720px){.site-header{height:76px}.header-note{display:none}main{padding:45px 0 55px;justify-content:flex-start}.intro{margin-bottom:32px}h1{font-size:42px;letter-spacing:-.075em}.heading-subject{display:block}h1 br{display:none}.intro p{max-width:420px;margin:auto;line-height:1.5}.app-grid{grid-template-columns:1fr}.app-card{min-height:285px}.card-symbol{top:72px;right:45px;width:108px;height:108px;border-radius:24px}.dizzy-symbol{border-radius:50%}.card-symbol svg{width:58px;height:58px}.card-copy strong{font-size:39px}.card-copy>span{font-size:12px}}
@media(max-width:440px){.page-shell,main,.intro,.app-grid{min-width:0;max-width:100%}.app-card{min-width:0}h1{font-size:38px;letter-spacing:-.075em;overflow-wrap:anywhere}.heading-subject{display:block}.intro p{max-width:300px;margin:auto;line-height:1.5}.app-card{min-height:275px;padding:20px}.card-symbol{right:28px;top:69px;width:92px;height:92px}.card-symbol svg{width:47px;height:47px}footer span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
.wordmark{font-family:Unbounded,Manrope,Arial,sans-serif;font-size:15px;font-weight:900;letter-spacing:-.055em;gap:5px}.wordmark span{font-weight:900;letter-spacing:-.06em;background:#f5f5f5;color:#080808;border-radius:3px;padding:4px 5px}.wordmark i{margin-left:0}
h1{font-family:Unbounded,Manrope,Arial,sans-serif;text-transform:uppercase;font-size:clamp(38px,5.1vw,67px);line-height:1.16;letter-spacing:-.085em}
.card-cta{position:relative;justify-content:center;text-align:center;font-size:12px;text-transform:uppercase;letter-spacing:.07em}.card-cta span{position:absolute;right:0}
footer{font-weight:800;letter-spacing:.035em}
@media(max-width:720px){h1{font-size:clamp(29px,6.4vw,42px);line-height:1.22}}
@media(max-width:440px){h1{font-size:clamp(25px,7vw,31px);letter-spacing:-.075em}footer{font-size:10px}}
