:root { --app-accent: #00c7e6; --app-dark: #0c0c0c; --app-card: #171717; }
.application-page { background: var(--app-dark); color: #fff; }
.application-page #header { top: 40px; }
.application-main { min-height: 100vh; padding: 150px 0 70px; background: #0c0c0c; }
.application-hero { display: grid; grid-template: "copy device" auto "install device" auto / minmax(420px, 590px) 295px; justify-content: center; column-gap: clamp(28px, 3vw, 44px); row-gap: 0; align-items: center; max-width: 1040px; }
.application-copy { text-align: left; }
.application-copy { grid-area: copy; }
.application-install { grid-area: install; }
.app-device-wrap { grid-area: device; }
.application-copy .eyebrow { color: var(--app-accent); font: 700 13px/1 "Poppins", sans-serif; letter-spacing: .13em; text-transform: uppercase; }
.application-copy h1 { max-width: 680px; margin: 12px 0 16px; font: 700 clamp(30px, 3.5vw, 50px)/1.1 "Poppins", sans-serif; }
.application-copy .lead { max-width: 590px; margin-inline: 0; color: #d7d7d7; font-size: clamp(15px, 1.35vw, 18px); line-height: 1.6; }
@media (min-width: 992px) {
  .application-copy {
    transform: translateX(-34px);
  }
  .application-copy .lead {
    max-width: 620px;
    text-align: justify;
    text-justify: inter-word;
    text-wrap: pretty;
  }
  .application-install {
    margin-top: -74px;
    transform: translateX(-34px);
  }
}
.application-actions { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 9px; margin: 24px 0 18px; }
.app-action { display: inline-flex; align-items: center; gap: 7px; min-height: 42px; padding: 9px 15px; border: 1px solid #3d3d3d; border-radius: 999px; background: #1b1b1b; color: #fff; font-size: 13px; font-weight: 700; text-decoration: none; }
.app-label-mobile { display: none; }
.app-action:hover, .app-action:focus-visible, .app-action.primary { background: var(--app-accent); border-color: var(--app-accent); color: #071419; }
.ios-install, .install-status { max-width: 650px; color: #bdbdbd; font-size: 14px; }
.app-device-wrap { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.app-device-wrap::before { display: none; }
.app-device { position: relative; z-index: 1; overflow: hidden; width: min(76vw, 285px); aspect-ratio: 9 / 18.2; padding: 7px; border: 2px solid #666; border-radius: 38px; background: #050505; box-shadow: 0 34px 68px rgba(0,0,0,.6), inset 0 0 0 1px #111; }
.device-status { display: flex; justify-content: space-between; height: 32px; padding: 6px 20px 0; color: #fff; font-size: 11px; font-weight: 700; }
.device-header { display: flex; align-items: center; gap: 10px; height: 60px; padding: 8px 14px; border-bottom: 1px solid #242424; background: #0d0d0d; }
.device-header img { width: 40px; height: 40px; border-radius: 10px; }
.device-header div { flex: 1; }
.device-header strong, .device-header span { display: block; }
.device-header strong { color: #fff; font: 700 14px/1.25 "Poppins", sans-serif; }
.device-header span { margin-top: 2px; color: #929292; font-size: 10px; }
.device-header > i { color: var(--app-accent); font-size: 24px; }
.device-map { position: relative; height: calc(100% - 152px); overflow: hidden; background: #cde6ee; }
.device-map iframe { width: 100%; height: 100%; border: 0; }
.device-search { position: absolute; z-index: 3; top: 14px; right: 12px; left: 12px; display: flex; align-items: center; gap: 9px; height: 42px; padding: 0 14px; border-radius: 14px; background: rgba(255,255,255,.96); color: #555; box-shadow: 0 5px 20px rgba(0,0,0,.25); font-size: 12px; }
.device-search i { color: #111; }
.device-weather { position: absolute; z-index: 3; right: 12px; bottom: 14px; left: 12px; display: grid; grid-template-columns: 36px 1fr; padding: 12px; border: 1px solid rgba(255,255,255,.13); border-radius: 15px; background: rgba(12,12,12,.94); box-shadow: 0 8px 25px rgba(0,0,0,.35); }
.device-weather i { grid-row: 1 / 3; align-self: center; color: #ffd43b; font-size: 24px; }
.device-weather strong { color: #fff; font-size: 12px; }
.device-weather span { color: #aaa; font-size: 10px; }
.device-nav { display: grid; grid-template-columns: repeat(4, 1fr); height: 60px; padding: 7px 4px 5px; border-top: 1px solid #242424; background: #0d0d0d; }
.device-nav a { display: flex; flex-direction: column; align-items: center; gap: 2px; color: #888; font-size: 9px; text-decoration: none; }
.device-nav i { font-size: 17px; }
.device-nav .active { color: var(--app-accent); }
.platform-logos { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 24px; max-width: 430px; margin: 46px auto 0; }
.platform-button { display: flex; align-items: center; justify-content: center; gap: 12px; min-width: 160px; min-height: 62px; padding: 9px 16px; border: 1px solid #424242; border-radius: 13px; background: #151515; box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
.platform-button img { display: block; width: auto; height: 41px; object-fit: contain; }
.platform-button .apple-logo { height: 39px; filter: invert(1); }
.platform-button strong { color: #fff; font: 600 13px/1.2 "Poppins", sans-serif; }
.application-benefits { padding: 30px 0 70px; }
.benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.benefit { padding: 24px; border: 1px solid #2d2d2d; border-radius: 18px; background: var(--app-card); }
.benefit i { color: var(--app-accent); font-size: 28px; }
.benefit h2 { margin: 13px 0 8px; font: 600 19px/1.3 "Poppins", sans-serif; }
.benefit p { margin: 0; color: #bdbdbd; line-height: 1.6; }
@media (max-width: 1199.98px) {
  .application-page #topbar { display: none; }
  .application-page #header { top: 0; }
}
@media (max-width: 991px) {
  .desktop-copy-extra { display: none; }
  .application-main { padding-top: 110px; }
  .application-hero { grid-template: "copy" auto "install" auto "device" auto / 1fr; text-align: left; }
  .application-copy .lead, .ios-install, .install-status { margin-inline: 0; }
  .application-actions { justify-content: flex-start; }
  .platform-logos { justify-content: center; }
  .benefit-grid { grid-template-columns: 1fr; }
}
@media (max-width: 575.98px) {
  .application-page { background: var(--app-dark); color: #fff; }
  .application-page #header { min-height: 62px; padding: 6px 0; border-bottom: 1px solid #242424; background: #0b0b0b; box-shadow: none; }
  .application-page #header .logo img { max-height: 36px; filter: none; }
  .application-page .mobile-nav-toggle { color: #fff; }
  .application-main { min-height: 0; padding: 76px 0 38px; background: var(--app-dark); }
  .application-hero { grid-template: "copy" auto "device" auto "install" auto / 1fr; row-gap: 0; }
  .application-copy .eyebrow { margin-bottom: 16px; color: var(--app-accent); font-size: 11px; }
  .application-copy h1 {
    max-width: none;
    margin: 0 0 20px;
    color: #fff;
    font-size: clamp(14px, 4.1vw, 18px);
    line-height: 1.2;
    letter-spacing: -.025em;
    white-space: nowrap;
  }
  .application-copy .lead { margin-bottom: 24px; color: #d0d0d0; font-size: 15px; line-height: 1.55; }
  .app-device-wrap { margin-bottom: 32px; }
  .app-device { width: min(72vw, 265px); }
  .application-install { padding-top: 0; }
  .application-actions { display: flex; flex-wrap: nowrap; gap: 7px; margin: 0 0 24px; }
  .app-action { flex: 1 1 0; justify-content: center; min-width: 0; width: auto; min-height: 42px; padding: 7px 6px; gap: 5px; border-color: #3d3d3d; background: #1b1b1b; color: #fff; box-shadow: none; font-size: 11px; white-space: nowrap; }
  .app-label-desktop { display: none; }
  .app-label-mobile { display: inline; }
  .app-action:hover, .app-action:focus-visible, .app-action.primary { border-color: var(--app-accent); background: var(--app-accent); color: #071419; }
  .install-status, .ios-install { margin: 0; color: #bdbdbd; font-size: 13px; line-height: 1.55; }
  .platform-logos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 34px; }
  .platform-button { min-width: 0; min-height: 58px; padding: 8px 10px; gap: 8px; border-color: #424242; background: #151515; box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
  .platform-button img { height: 34px; }
  .platform-button .apple-logo { height: 32px; filter: invert(1); }
  .platform-button strong { color: #fff; font-size: 11px; white-space: nowrap; }
  .app-device-wrap::before { display: none; }
  .application-benefits { background: var(--app-dark); border-top: 1px solid #242424; }
  .benefit { border-color: #2d2d2d; background: var(--app-card); }
  .benefit h2 { color: #fff; }
  .benefit p { color: #bdbdbd; }
}
