/* iPhone 15 Pro réaliste : écran 393×852 pt (ratio 1179×2556), corps 70,6×146,6 mm.
   --s = échelle (1 = 1 px par point). Largeur totale = 425*s, hauteur = 884*s. */
.iphone {
  position: absolute;
  --s: 0.95;
  width: calc(425px * var(--s));
  height: calc(884px * var(--s));
  border-radius: calc(72px * var(--s));
  background: linear-gradient(
    140deg,
    #6f7377 0%,
    #d4d6d9 14%,
    #8c9094 30%,
    #5b5f63 52%,
    #b9bcc0 74%,
    #727579 100%
  );
  padding: calc(3.5px * var(--s));
  box-shadow:
    0 calc(40px * var(--s)) calc(80px * var(--s)) rgba(0, 0, 0, 0.38),
    0 calc(10px * var(--s)) calc(24px * var(--s)) rgba(0, 0, 0, 0.22);
}
.iphone .bezel {
  width: 100%;
  height: 100%;
  border-radius: calc(68.5px * var(--s));
  background: #050505;
  padding: calc(12.5px * var(--s));
  position: relative;
  box-shadow: inset 0 0 0 calc(1px * var(--s)) rgba(255, 255, 255, 0.08);
}
.iphone .scr {
  width: calc(393px * var(--s));
  height: calc(852px * var(--s));
  border-radius: calc(55px * var(--s));
  overflow: hidden;
  position: relative;
  background: #000;
}
.iphone .scr img {
  width: 100%;
  height: 100%;
  display: block;
}
.iphone .island {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: calc(11px * var(--s));
  width: calc(125px * var(--s));
  height: calc(37px * var(--s));
  border-radius: calc(20px * var(--s));
  background: #000;
  z-index: 3;
}
.iphone .island:after {
  content: "";
  position: absolute;
  right: calc(26px * var(--s));
  top: calc(12px * var(--s));
  width: calc(13px * var(--s));
  height: calc(13px * var(--s));
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #2a3348, #0b0d12 60%);
}
.iphone .glare {
  position: absolute;
  inset: 0;
  border-radius: calc(55px * var(--s));
  background: linear-gradient(115deg, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0) 38%);
  pointer-events: none;
  z-index: 4;
}
.iphone .btn {
  position: absolute;
  width: calc(4px * var(--s));
  background: linear-gradient(90deg, #5d6165, #b8bbbf, #6a6e72);
  border-radius: calc(2px * var(--s));
}
.iphone .btn.l {
  left: calc(-2.5px * var(--s));
}
.iphone .btn.r {
  right: calc(-2.5px * var(--s));
}
