/* Телефон с кабинетом внутри — общая рамка для demo.html и лендинга.
   Внутри iframe должен быть demo.html: он сам понимает, что открыт
   в рамке, и добавляет запас под островок. */
/* Телефон: PNG-рамка iPhone 17 Pro Max поверх экрана. Натуральный размер
   490×1000 CSS px (3× от исходника), экран в нём — 440×956 со сдвигом
   25/22. Масштаб под высоту окна ставит demo.js. */
.phone-wrap { position: relative; flex: none; }
.phone { position: relative; width: 490px; height: 1000px; transform-origin: top left; }
.phone-frame {
  position: absolute; inset: 0; width: 490px; height: 1000px; z-index: 2;
  pointer-events: none; filter: drop-shadow(0 40px 90px rgba(0,0,0,.6));
}
.phone-screen {
  position: absolute; left: 25px; top: 22px; width: 440px; height: 956px;
  border-radius: 62px; overflow: hidden; background: #0B1017;
}
.phone-screen iframe { width: 100%; height: 100%; border: 0; display: block; }
.phone-status {
  position: absolute; top: 0; left: 0; right: 0; height: 54px; z-index: 1; pointer-events: none;
  display: flex; align-items: center; justify-content: space-between;
  padding: 6px 34px 0 52px; color: #fff;
  font-family: "Onest", -apple-system, BlinkMacSystemFont, sans-serif; font-weight: 600; font-size: 17px;
  font-variant-numeric: tabular-nums;
}
.phone-icons { display: inline-flex; align-items: center; gap: 6px; }
.phone-home {
  position: absolute; bottom: 8px; left: 50%; width: 134px; height: 5px; margin-left: -67px; z-index: 1;
  border-radius: 3px; background: rgba(255,255,255,.92); pointer-events: none;
}