:root {
  --night: #220b05;
  --night-soft: #3f160a;
  --paper: #fbf4ed;
  --ink: #3a160b;
  --muted: #806c62;
  --line: #e2d2c6;
  --teal: #bd6227;
  --teal-bright: #f3bd74;
  --yellow: #f2c06b;
  --coral: #d46a3b;
}

.variant .hero h1 {
  font-size: clamp(3.15rem, 7.2vw, 6.8rem);
  line-height: .88;
}

.variant .hero h1 em {
  display: block;
  margin-top: .18em;
  color: #f3bd74;
  font-size: .52em;
  font-style: normal;
  letter-spacing: -.045em;
}

.variant .release-status {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  padding: 10px 18px;
  border: 1px solid rgba(243, 189, 116, .5);
  border-radius: 5px;
  color: #ffe1b6;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .04em;
}

.variant .device-shell img { object-fit: cover; object-position: top; }
.variant .floating-label { background: #f3bd74; color: #351006; }
.variant .label-b { background: #d8753a; color: #2a0b04; }
.variant .floating-score { background: #f2c06b; }
.variant .plans-section { background: #2a0d05; }
.variant .plan-premium {
  background: #64240d;
  color: #fff8ed;
}
.variant .plan-premium header,
.variant .plan-premium li { border-color: rgba(255, 238, 215, .22); }
.variant .plan-premium header div > span,
.variant .plan-premium li span { color: #f3bd74; }
.variant .plan-premium header > strong { color: #ffe0a6; }
.variant .plan-premium h3,
.variant .plan-premium li strong { color: #ffffff; }
.variant .plan-premium > p { color: #efc89d; }
.variant .contact-section { background: #7a2e12; }
.variant .contact-panel { background: #fbf4ed; }

.variant .single-screen::before { inset: 10% 5% 2%; background: #efd7c2; }
.variant .single-screen .phone-shot-front { right: 50%; width: min(62%, 360px); transform: translateX(50%) rotate(2deg); }
.variant .single-screen .phone-shot-front:hover { transform: translateX(50%) rotate(0deg) translateY(-8px); }

@media (max-width: 860px) {
  .variant .hero h1 { font-size: clamp(3rem, 14vw, 5rem); }
}

@media (max-width: 620px) {
  .variant .release-status { min-height: 44px; padding: 8px 13px; font-size: .73rem; }
  .variant .single-screen .phone-shot-front { width: min(72%, 320px); }
}