.mobile-install-page {
  margin: 0;
  background: #f7f5f2;
  color: #191819;
  font: 16px/1.55 Manrope, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.mobile-install, .mobile-footer {
  max-width: 1220px;
  width: calc(100% - 40px);
  margin-inline: auto;
}
.mobile-install { padding-block: clamp(22px, 4vw, 55px) 46px; }
.mobile-install * { box-sizing: border-box; }
.mobile-hero {
  background: #191819;
  color: #fff;
  min-height: 410px;
  border-radius: 28px;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(270px, .8fr);
  align-items: center;
}
.mobile-hero-copy { padding: clamp(26px, 5vw, 66px); padding-right: 20px; }
.mobile-kicker {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
  color: #a90918;
  font-size: 12px;
  font-weight: 820;
  letter-spacing: .105em;
}
.mobile-hero .mobile-kicker { color: #ffb7bc; }
.mobile-kicker img { border-radius: 9px; }
.mobile-install h1,.mobile-install h2,.mobile-install h3 { line-height: 1.1; margin: 0; letter-spacing: -.035em; }
.mobile-install h1 { font-size: clamp(40px, 6.2vw, 82px); }
.mobile-install h1 em { color: #ff7982; font-style: normal; }
.mobile-hero-copy > p:not(.mobile-kicker) { max-width: 37rem; color: #f1e9ea; }
.mobile-hero-copy > p:not(.mobile-kicker,.mobile-status) { margin: 18px 0 25px; font-size: clamp(16px, 2.1vw, 20px); }
.mobile-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.mobile-primary,.mobile-secondary {
  display: inline-flex; align-items: center; gap: .55em; justify-content: center;
  min-height: 46px; padding: 9px 15px; border: 1px solid transparent;
  border-radius: 12px; font: inherit; font-weight: 750; text-decoration: none;
  text-align: center; cursor: pointer;
}
.mobile-primary { background: #db0715; color: #fff; }
.mobile-primary:hover { background: #b90613; }
.mobile-secondary { color: #22191a; background: #fff; border-color: #dfd6d4; }
.mobile-hero .mobile-secondary { color: #fff; background: #303030; border-color: #535052; }
.mobile-install [hidden], .mobile-status:empty { display: none; }
.mobile-install :is(a,button,summary):focus-visible { outline: 3px solid #e53442; outline-offset: 4px; }
.mobile-hero-art {
  min-height: 410px;
  background: radial-gradient(ellipse at 45% 65%, #651b2e, #191819 72%);
  display: grid;
  place-items: center;
  position: relative;
  padding: 32px 15px;
}
.mobile-phone {
  background: #fff9f4;
  color: #191819;
  width: min(220px, 75%);
  border: 6px solid #3f3438;
  border-radius: 30px;
  overflow: hidden;
  transform: rotate(9deg);
  box-shadow: 0 24px 48px #0006;
}
.mobile-phone-top { padding: 8px 13px; background: #fff; }
.mobile-phone-top img { display: block; object-fit: contain; width: 114px; height: 28px; }
.mobile-phone-content { padding: 13px; display: grid; gap: 7px; }
.mobile-phone-content span:first-child { color: #8d1520; font-size: 8px; letter-spacing: .1em; font-weight: 800; }
.mobile-phone-content strong { font-size: 29px; letter-spacing: -.06em; line-height: 1; }
.mobile-phone-product { border-radius: 12px; width: 100%; height: auto; }
.mobile-phone-button { border-radius: 8px; background: #df0715; color: #fff; padding: 7px; text-align: center; font-size: 10px; font-weight: 700; }
.mobile-art-label { position: absolute; bottom: 39px; right: 7%; padding: 10px 15px; border-radius: 10px; transform: rotate(-6deg); background: #ffd0b9; color: #25171b; font-size: 13px; line-height: 1.25; }
.mobile-install-section { padding-top: clamp(33px, 6vw, 72px); scroll-margin-top: calc(var(--mobile-header-height, 152px) + 14px); }
.mobile-install h2 { font-size: clamp(30px, 5vw, 50px); }
.mobile-option-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin-top: 22px; }
.mobile-option { display: flex; flex-direction: column; align-items: flex-start; padding: clamp(19px,3vw,28px); background: #fff; border: 1px solid #e7dedb; border-radius: 22px; scroll-margin-top: calc(var(--mobile-header-height, 152px) + 14px); }
.mobile-option-apk { background: #fff2ee; border-color: #f1d6ce; }
.mobile-chip { margin: 0 0 13px; padding: 3px 10px; background: #f7e9e8; color: #85141e; border-radius: 99px; font-size: 13px; font-weight: 800; }
.mobile-option h3 { font-size: clamp(22px,2.8vw,30px); }
.mobile-option ol { padding-inline-start: 22px; margin-block: 17px 22px; flex: 1; }
.mobile-option li + li,.mobile-how li + li { margin-top: 8px; }
.mobile-how { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.25fr); gap: 20px; margin-block: 38px 22px; padding: clamp(20px,4vw,34px); background: #f3e8e2; border-radius: 22px; }
.mobile-how ol { margin: 0; padding-inline-start: 22px; }
.mobile-faq { border-bottom: 1px solid #dfd6d2; padding-block: 12px; }
.mobile-faq summary { min-height: 40px; align-content: center; font-weight: 750; cursor: pointer; }
.mobile-faq p { margin: 0 0 12px; }
.mobile-faq a { color: #a90918; }
.mobile-footer { display: flex; flex-wrap: wrap; gap: 18px; padding-block: 0 30px; }
.mobile-footer a { color: #322b2c; }
@media (max-width: 730px) {
  .mobile-install, .mobile-footer { width: calc(100% - 24px); }
  .mobile-hero,.mobile-option-grid,.mobile-how { grid-template-columns: minmax(0,1fr); }
  .mobile-hero-art { min-height: 270px; padding: 10px 12px 24px; }
  .mobile-phone { width: 156px; border-radius: 24px; }
  .mobile-phone-content strong { font-size: 22px; }
  .mobile-hero-copy { padding: 23px; }
  .mobile-art-label { right: 10%; bottom: 29px; }
}
