.apps-page { font-family: var(--brand-font); }
.apps-page main { max-width: 1440px; margin: 0 auto; padding: 0 48px; }
.apps-hero { display: grid; grid-template-columns: 1.15fr 1fr; gap: 50px; align-items: center; padding: 65px 0 76px; }
.apps-kicker { color: #8ce6ed; font-size: 11px; font-weight: 600; margin: 0 0 24px; }
.apps-page h1 { font-family: var(--display-font) !important; font-size: clamp(55px,7vw,108px); line-height: 1.07; font-weight: 600; letter-spacing: -.055em; margin: 0 0 25px; }
.apps-page h1 span { color: #a5f4f2; }
.apps-lead { font-size: clamp(27px,3vw,42px); line-height: 1.22; margin: 0 0 20px; }
.apps-intro { color: var(--muted); font-size: 16px; line-height: 1.6; max-width: 370px; margin: 0 0 27px; }
.apps-primary { display: inline-flex; align-items: center; gap: 45px; background: #a5f4f2; color: #04212b; font-size: 14px; font-weight: 600; min-height: 50px; padding: 14px 22px; text-decoration: none; }
.apps-primary:hover { background: #ddffff; }
.apps-art { position: relative; aspect-ratio: 1.12; display: grid; place-items: center; overflow: hidden; border: 1px solid #31525c; background: radial-gradient(ellipse at 50% 45%, #126171 0, #082c37 42%, #061b24 73%); }
.apps-art::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(#8ce6ed09 1px,transparent 1px),linear-gradient(90deg,#8ce6ed09 1px,transparent 1px); background-size: 32px 32px; }
.apps-orbit { position: absolute; width: 78%; aspect-ratio: 1; border: 1px solid #8ce6ed45; border-radius: 50%; transform: rotate(-30deg) scaleY(.55); }
.orbit-two { transform: rotate(40deg) scaleY(.7); width: 98%; }
.apps-monogram { display: flex; align-items: center; gap: 0; transform: rotate(-9deg); font-family: var(--display-font); font-size: clamp(90px,12vw,175px); line-height: 1; letter-spacing: -.15em; color: #b5fff6; text-shadow: 0 0 70px #8ce6ed40; }
.apps-monogram span:last-child { -webkit-text-stroke: 1px #b5fff6; color: transparent; margin-left: -.04em; }
.apps-art-label { position: absolute; bottom: 22px; left: 22px; right: 22px; display: flex; justify-content: space-between; font-size: 10px; color: #b6d5da; }
.apps-platforms { padding: 40px 0 52px; border-top: 1px solid var(--line); scroll-margin-top: 90px; }
.apps-section-head { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; margin-bottom: 28px; }
.apps-section-head .apps-kicker { margin: 0; }
.apps-page h2 { font-family: var(--brand-font) !important; font-size: 30px; margin: 0; letter-spacing: -.04em; }
.apps-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.apps-card { background: #08242e; border: 1px solid var(--line); padding: 28px; }
.apps-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; }
.apps-platform-icon { font-size: 34px; color: #a5f4f2; line-height: 1; }
.apps-chip { border: 1px solid #3a606a; padding: 6px 10px; color: #a5f4f2; font-size: 10px; }
.apps-page h3 { font-family: var(--brand-font) !important; font-size: 24px; font-weight: 500; margin: 0 0 10px; letter-spacing: -.03em; }
.apps-card p { color: var(--muted); font-size: 14px; margin: 0 0 28px; }
.apps-download { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 50px; padding: 14px 18px; background: #a5f4f2; color: #04212b; font-size: 14px; font-weight: 600; text-decoration: none; }
.apps-download:hover { background: #ddffff; }
.apps-card .apps-install { margin: 16px 0 0; font-size: 13px; line-height: 1.6; }
.apps-download-info { margin-top: 24px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.apps-download-info p { margin: 0 0 12px; }
.apps-download-info p:last-child { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-bottom: 0; }
.apps-download-info a { color: #a5f4f2; text-underline-offset: 3px; }
.apps-end { display: flex; align-items: baseline; gap: 24px; padding: 28px 0 45px; border-top: 1px solid var(--line); }
.apps-end > span { font-family: var(--display-font); font-size: 30px; color: #a5f4f2; }
.apps-end p { font-size: 14px; color: var(--muted); }
.apps-end a { margin-left: auto; color: #a5f4f2; font-size: 13px; }
.apps-skip { position: fixed; top: -100px; left: 16px; z-index: 1000; padding: 12px; background: #a5f4f2; color: #04212b; }
.apps-skip:focus { top: 10px; }
.apps-page a:focus-visible, .apps-page button:focus-visible { outline: 2px solid #b5fff6; outline-offset: 5px; }
@media(max-width: 850px) {
.apps-page main { padding: 0 24px; }
.apps-hero { gap: 24px; padding: 45px 0; }
.apps-page h1 { font-size: 56px; }
.apps-monogram { font-size: 100px; }
.apps-page h3 { font-size: 21px; }
.apps-end { flex-wrap: wrap; gap: 12px 20px; }
.apps-end a { margin-left: 0; width: 100%; }
}
@media(max-width: 600px) {
.apps-page main { padding: 0 20px; }
.apps-hero { grid-template-columns: 1fr; gap: 30px; padding: 38px 0; }
.apps-page h1 { font-size: clamp(48px,12vw,70px); }
.apps-lead { font-size: 29px; }
.apps-art { aspect-ratio: 1.6; }
.apps-monogram { font-size: 110px; }
.apps-section-head { display: block; }
.apps-section-head .apps-kicker { margin-bottom: 12px; }
.apps-grid { grid-template-columns: 1fr; gap: 15px; }
.apps-card { padding: 24px; }
.apps-page h2 { font-size: 28px; }
}
