/* ============ Galaxy S26 Ultra 목업 [G1] ============
   삼성 공식 사양: 본체 163.6 × 78.1mm, 6.9형 3120×1440 평면 디스플레이(둥근 모서리), 가운데 펀치홀 전면 카메라, 알루미늄 프레임.
   .phone 의 폭(--pw) 비례 계산을 그대로 쓰고, 갤럭시만 다른 값을 덮어쓴다.
   - 높이 = 폭 × 2.095 (163.6 / 78.1) · 베젤 = 폭 × 2.6% · 본체 모서리 = 폭 × 12% (아이폰보다 각진 인상)
   - 다이나믹 아일랜드 대신 지름 = 폭 × 4.5% 펀치홀, 화면 위에서 폭의 3%
   - 상태바: 안드로이드처럼 시간은 왼쪽 끝, 아이콘은 오른쪽 끝, 펀치홀 세로 중앙선에 맞춤
   - 같은 화면 폭 기준으로 실제 크기 비율(78.1 / 71.9 ≈ 1.086)을 살려 아이폰보다 조금 크게 둔다 */
.phone.galaxy {
  --bezel: calc(var(--pw) * 0.026);
  --hole: calc(var(--pw) * 0.045);
  --hole-top: calc(var(--pw) * 0.03);
  --sbar-h: calc((var(--pw) * 0.03 + var(--pw) * 0.0225) * 2);
  height: calc(var(--pw) * 2.095);
  border-radius: calc(var(--pw) * 0.12);
  background: linear-gradient(160deg, #3b3b46, #16161d);
  box-shadow:
    var(--shadow),
    0 0 0 1.5px rgba(255, 255, 255, 0.1) inset;
}
.phone.galaxy::before {
  /* 펀치홀 카메라 */
  top: calc(var(--bezel) + var(--hole-top));
  width: var(--hole);
  height: var(--hole);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #2a2a3a 0 30%, #030307 60%);
}
.phone.galaxy .screen {
  border-radius: calc(var(--pw) * 0.094);
}
.phone.galaxy .sbar {
  grid-template-columns: 1fr 1fr;
  padding: 0 calc(var(--pw) * 0.07);
}
.phone.galaxy .sbar .time {
  justify-self: start;
}
.phone.galaxy .sbar svg {
  grid-column: 2;
  justify-self: end;
}
/* 갤럭시 떠 있는 움직임 — 아이폰(-4°)과 반대로 살짝 기울임 */
.phone.galaxy.float {
  animation: float-g 6.4s ease-in-out infinite;
}
.phone.galaxy.tilt-r {
  transform: rotate(4deg);
}
@keyframes float-g {
  0%,
  100% {
    transform: translateY(0) rotate(4deg);
  }
  50% {
    transform: translateY(-14px) rotate(4deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .phone.float,
  .phone.galaxy.float {
    animation: none;
  }
}

/* ---- 기능 01·02·03: 아이폰 + 갤럭시 나란히 (겹치지 않게, 갤럭시는 조금 아래로 엇갈려 두 화면 모두 편히 보이게) ---- */
.device-pair {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 24px;
}
.fvisual .device-pair .phone {
  --pw: 240px;
}
.fvisual .device-pair .phone.galaxy {
  --pw: 261px; /* 240 × 78.1 / 71.9 — 실제 크기 비율 */
  margin-top: 48px;
}
