.sb-phone-body {
  position: relative;
}

.pv-wallpaper {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

#publicScreen .pv-wallpaper {
  position: fixed;
}

.pv-scroll.pv-has-wallpaper {
  position: relative;
  z-index: 1;
}

.pv-wallpaper-media,
.pv-wallpaper-overlay,
.pv-wallpaper-pattern {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.pv-wallpaper-media {
  object-fit: cover;
  display: block;
}

.pv-wallpaper-pattern--dots {
  background-image: radial-gradient(var(--pv-wall-ink) 1.3px, transparent 1.9px);
  background-size: 18px 18px;
}

.pv-wallpaper-pattern--grid {
  background-image:
    linear-gradient(var(--pv-wall-ink) 1px, transparent 1px),
    linear-gradient(90deg, var(--pv-wall-ink) 1px, transparent 1px);
  background-size: 26px 26px;
}

.pv-wallpaper-pattern--stripes {
  background-image: repeating-linear-gradient(135deg, var(--pv-wall-ink) 0 2px, transparent 2px 16px);
}

.pv-wallpaper-pattern--waves {
  background-image: radial-gradient(circle at 50% 100%, transparent 9px, var(--pv-wall-ink) 10px, var(--pv-wall-ink) 11.5px, transparent 12.5px);
  background-size: 28px 14px;
}

.pv-wallpaper-pattern--aurora {
  background:
    radial-gradient(62% 42% at 8% 6%, var(--pv-wall-a), transparent 72%),
    radial-gradient(55% 40% at 96% 32%, var(--pv-wall-b), transparent 72%),
    radial-gradient(70% 48% at 30% 100%, var(--pv-wall-c), transparent 72%);
}

.pv-wallpaper-pattern--blobs {
  background:
    radial-gradient(38% 24% at 16% 18%, var(--pv-wall-b), transparent 72%),
    radial-gradient(34% 22% at 88% 46%, var(--pv-wall-c), transparent 72%),
    radial-gradient(42% 26% at 24% 90%, var(--pv-wall-a), transparent 72%);
}

/* ── Animowane tło (Plus): wolno, bez migania, tylko transform ───────────── */
.pv-wallpaper-motion {
  position: absolute;
  inset: 0;
  overflow: hidden;
  container-type: size;
}

.pv-wallpaper-motion > i {
  position: absolute;
  display: block;
  pointer-events: none;
  will-change: transform;
  backface-visibility: hidden;
}

/* Płynące kolory: trzy miękkie plamy krążą po dużych elipsach. */
.pv-wallpaper-motion--flow > i {
  width: 95cqmax;
  height: 95cqmax;
  border-radius: 50%;
  animation: pv-flow-a 48s ease-in-out infinite alternate;
}
.pv-wallpaper-motion--flow > i:nth-child(1) {
  top: -42cqmax;
  left: -38cqmax;
  background: radial-gradient(closest-side, var(--pv-wall-m1), transparent);
}
.pv-wallpaper-motion--flow > i:nth-child(2) {
  top: 18cqh;
  right: -48cqmax;
  background: radial-gradient(closest-side, var(--pv-wall-m2), transparent);
  animation-name: pv-flow-b;
  animation-duration: 61s;
  animation-delay: -18s;
}
.pv-wallpaper-motion--flow > i:nth-child(3) {
  bottom: -52cqmax;
  left: -10cqmax;
  background: radial-gradient(closest-side, var(--pv-wall-m3), transparent);
  animation-name: pv-flow-c;
  animation-duration: 55s;
  animation-delay: -31s;
}
@keyframes pv-flow-a {
  0% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(22%, 14%) scale(1.12); }
  100% { transform: translate(8%, 30%) scale(0.96); }
}
@keyframes pv-flow-b {
  0% { transform: translate(0, 0) scale(1.05); }
  50% { transform: translate(-24%, -10%) scale(0.95); }
  100% { transform: translate(-10%, 18%) scale(1.1); }
}
@keyframes pv-flow-c {
  0% { transform: translate(0, 0) scale(0.98); }
  50% { transform: translate(18%, -16%) scale(1.1); }
  100% { transform: translate(-12%, -26%) scale(1); }
}

/* Fale: trzy pasma przy dole przesuwają się w bok, każde w swoim tempie. */
.pv-wallpaper-motion--waves > i {
  left: 0;
  bottom: 0;
  width: 200%;
  height: 34cqh;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 60C150 20 350 20 600 60S1050 100 1200 60V120H0Z'/%3E%3C/svg%3E") 0 0 / 50% 20cqmin repeat-x, linear-gradient(#000, #000) 0 calc(20cqmin - 2px) / 100% 100% no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 60C150 20 350 20 600 60S1050 100 1200 60V120H0Z'/%3E%3C/svg%3E") 0 0 / 50% 20cqmin repeat-x, linear-gradient(#000, #000) 0 calc(20cqmin - 2px) / 100% 100% no-repeat;
  animation: pv-wave-x 70s linear infinite, pv-wave-y 14s ease-in-out infinite alternate;
}
.pv-wallpaper-motion--waves > i:nth-child(1) {
  height: 44cqh;
  background: linear-gradient(to bottom, var(--pv-wall-m3), var(--pv-wall-m3));
  opacity: 1;
}
.pv-wallpaper-motion--waves > i:nth-child(2) {
  height: 34cqh;
  background: linear-gradient(to bottom, var(--pv-wall-m2), var(--pv-wall-m2));
  opacity: 1;
  animation-duration: 95s, 17s;
  animation-direction: reverse, alternate;
  animation-delay: -40s, -6s;
}
.pv-wallpaper-motion--waves > i:nth-child(3) {
  height: 24cqh;
  background: linear-gradient(to bottom, var(--pv-wall-m1), var(--pv-wall-m1));
  opacity: 1;
  animation-duration: 58s, 12s;
  animation-delay: -21s, -3s;
}
@keyframes pv-wave-x {
  from { translate: 0 0; }
  to { translate: -50% 0; }
}
@keyframes pv-wave-y {
  from { transform: translateY(0); }
  to { transform: translateY(5cqh); }
}

/* Światła: miękkie kule unoszą się i opadają, jak kurz w słońcu. */
.pv-wallpaper-motion--glow > i {
  --c: var(--pv-wall-m1);
  width: var(--s, 60cqmin);
  height: var(--s, 60cqmin);
  border-radius: 50%;
  background: radial-gradient(closest-side, var(--c), color-mix(in srgb, var(--c) 45%, transparent) 50%, transparent);
  opacity: 0.7;
  animation: pv-glow-float 40s ease-in-out infinite alternate;
}
.pv-wallpaper-motion--glow > i:nth-child(1) { --s: 82cqmin; left: -30cqmin; top: -6cqh; animation-duration: 44s; }
.pv-wallpaper-motion--glow > i:nth-child(2) { --s: 62cqmin; --c: var(--pv-wall-m2); left: 55%; top: -2cqh; animation-duration: 38s; animation-delay: -12s; }
.pv-wallpaper-motion--glow > i:nth-child(3) { --s: 72cqmin; --c: var(--pv-wall-m3); left: 12%; top: 30cqh; animation-duration: 52s; animation-delay: -27s; }
.pv-wallpaper-motion--glow > i:nth-child(4) { --s: 56cqmin; left: 68%; top: 44cqh; animation-duration: 36s; animation-delay: -8s; }
.pv-wallpaper-motion--glow > i:nth-child(5) { --s: 86cqmin; --c: var(--pv-wall-m2); left: -26cqmin; top: 62cqh; animation-duration: 48s; animation-delay: -33s; }
.pv-wallpaper-motion--glow > i:nth-child(6) { --s: 52cqmin; --c: var(--pv-wall-m3); left: 44%; top: 78cqh; animation-duration: 34s; animation-delay: -19s; }
.pv-wallpaper-motion--glow > i:nth-child(7) { --s: 66cqmin; left: 70%; top: 86cqh; animation-duration: 46s; animation-delay: -4s; }
@keyframes pv-glow-float {
  0% { transform: translate(0, 0); }
  33% { transform: translate(6cqw, -9cqh); }
  66% { transform: translate(-4cqw, -15cqh); }
  100% { transform: translate(3cqw, -22cqh); }
}

@media (prefers-reduced-motion: reduce) {
  .pv-wallpaper-motion > i { animation-play-state: paused !important; }
}

.pv-has-wallpaper .pv-section,
.pv-has-wallpaper .pv-hero {
  background-color: transparent;
}


.pv-fill-outline :is(.pv-svc-card, .pv-link-row, .pv-faq-item, .pv-testi-card, .pv-price-card, .pv-empty-card) {
  background: color-mix(in srgb, var(--pv-hero-text, #0f172a) 7%, transparent) !important;
  border: 1.5px solid color-mix(in srgb, var(--pv-hero-text, #0f172a) 55%, transparent) !important;
  box-shadow: none !important;
}

.pv-fill-outline :is(.pv-btn, .pv-svc-cta-btn) {
  background: transparent !important;
  color: var(--pv-accent-readable, var(--pv-accent)) !important;
  border: 1.5px solid var(--pv-accent-readable, var(--pv-accent)) !important;
  box-shadow: none !important;
}

.pv-fill-glass :is(.pv-svc-card, .pv-link-row, .pv-faq-item, .pv-testi-card, .pv-price-card, .pv-empty-card) {
  background: rgba(255, 255, 255, 0.55) !important;
  border: 1px solid rgba(255, 255, 255, 0.75) !important;
  box-shadow: 0 10px 30px -14px rgba(15, 23, 42, 0.25) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.3);
  backdrop-filter: blur(16px) saturate(1.3);
}

[data-surface="dark"] .pv-fill-glass :is(.pv-svc-card, .pv-link-row, .pv-faq-item, .pv-testi-card, .pv-price-card, .pv-empty-card) {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.26) !important;
  box-shadow: 0 12px 34px -16px rgba(0, 0, 0, 0.5) !important;
}

.pv-fill-glass :is(.pv-btn, .pv-svc-cta-btn) {
  background: rgba(255, 255, 255, 0.6) !important;
  color: var(--pv-hero-text, #0f172a) !important;
  border: 1px solid rgba(255, 255, 255, 0.85) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: none !important;
}

[data-surface="dark"] .pv-fill-glass :is(.pv-btn, .pv-svc-cta-btn) {
  background: rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.36) !important;
}

.pv-fill-soft :is(.pv-svc-card, .pv-link-row, .pv-faq-item, .pv-testi-card, .pv-price-card, .pv-empty-card) {
  border-color: transparent !important;
  box-shadow:
    0 18px 40px -18px color-mix(in srgb, var(--pv-accent, #6366f1) 55%, transparent),
    0 2px 6px rgba(15, 23, 42, 0.06) !important;
}

.pv-fill-soft :is(.pv-btn, .pv-svc-cta-btn) {
  box-shadow: 0 12px 26px -10px color-mix(in srgb, var(--pv-accent, #6366f1) 75%, transparent) !important;
}

.pv-fill-hard :is(.pv-svc-card, .pv-link-row, .pv-faq-item, .pv-testi-card, .pv-price-card, .pv-empty-card) {
  border: 2px solid #111114 !important;
  box-shadow: 5px 5px 0 #111114 !important;
}

.pv-fill-hard :is(.pv-btn, .pv-svc-cta-btn) {
  border: 2px solid #111114 !important;
  box-shadow: 3px 3px 0 #111114 !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pv-fill-hard :is(.pv-btn, .pv-svc-cta-btn):active {
  transform: translate(3px, 3px);
  box-shadow: 0 0 0 #111114 !important;
}

.pv-fill-hard .pv-shop-media {
  border: 2px solid #111114;
  box-shadow: 5px 5px 0 #111114 !important;
}

.pv-fill-outline .pv-shop-media {
  padding: 5px;
  background: transparent;
  border: 1.5px solid color-mix(in srgb, var(--pv-hero-text, #0f172a) 45%, transparent);
  box-shadow: none !important;
}

.pv-fill-outline .pv-shop-media .pv-shop-img {
  border-radius: calc(var(--pv-card-radius, 12px) + 4px);
}

.pv-fill-glass .pv-shop-media {
  padding: 5px;
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(255, 255, 255, 0.75);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

[data-surface="dark"] .pv-fill-glass .pv-shop-media {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.26);
}

.pv-fill-glass .pv-shop-media .pv-shop-img {
  border-radius: 15px;
}

.pv-fill-soft .pv-shop-media {
  box-shadow: 0 22px 40px -20px color-mix(in srgb, var(--pv-accent, #6366f1) 70%, transparent) !important;
}

.pv-buttons-square .pv-shop-media,
.pv-buttons-square .pv-shop-media .pv-shop-img {
  border-radius: 8px;
}

.pv-buttons-square :is(.pv-svc-card, .pv-link-row, .pv-faq-item, .pv-testi-card, .pv-price-card) {
  border-radius: 8px !important;
}

:is(.pv-has-wallpaper--image, .pv-has-wallpaper--video) :is(.pv-svc-card, .pv-link-row, .pv-faq-item, .pv-testi-card, .pv-price-card, .pv-empty-card, .pv-stat-item, .pv-avail-card) {
  background: color-mix(in srgb, var(--pv-page-bg, #111) 80%, transparent) !important;
  border-color: color-mix(in srgb, var(--pv-hero-text, #fff) 18%, transparent) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
  backdrop-filter: blur(18px) saturate(1.2);
}

:is(.pv-has-wallpaper--image, .pv-has-wallpaper--video) .pv-shop-info {
  padding: 0.55rem 0.65rem 0.6rem;
  border-radius: 14px;
  background: color-mix(in srgb, var(--pv-page-bg, #111) 80%, transparent);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

:is(.pv-has-wallpaper--image, .pv-has-wallpaper--video) .pv-shop-info :is(.pv-svc-price-main, .pv-shop-name) {
  color: var(--pv-hero-text, #fff) !important;
}

:is(.pv-has-wallpaper--image, .pv-has-wallpaper--video) :is(.pv-section-title, .pv-kicker, .pv-name, .pv-tagline, .pv-bio, .pv-section-sub, .pv-public-foot) {
  text-shadow: var(--pv-wall-text-shadow);
}

:is(.pv-has-wallpaper--image, .pv-has-wallpaper--video) :is(.pv-meta-item, .pv-trust-strip) {
  background: color-mix(in srgb, var(--pv-page-bg, #111) 75%, transparent);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

.sb-device-screen :is(.pv-cta--blocked, .pv-svc-cta-btn.pv-cta--blocked, .pv-detail-footer-cta.pv-cta--blocked, .pv-detail-action-cta.pv-cta--blocked) {
  opacity: 1 !important;
  filter: none !important;
  cursor: pointer !important;
}


.pv-name.pv-name--logo {
  line-height: 0;
  margin-top: 0.35rem;
  margin-bottom: 0.55rem;
}

.pv-name--logo img {
  display: inline-block;
  max-width: min(80%, 260px);
  max-height: 84px;
  object-fit: contain;
}


.pv-hero.pv-hero--plus {
  position: relative;
  text-align: center;
}

.pv-hero--plus .pv-social,
.pv-hero--plus .pv-meta {
  justify-content: center;
}

.pv-hero.pv-hero--banner {
  padding-top: 0;
  padding-left: 0;
  padding-right: 0;
}

.pv-hero--banner > :not(.pv-banner-strip):not(.pv-avatar):not(.pv-share-trigger) {
  padding-left: 1.35rem;
  padding-right: 1.35rem;
}

.pv-banner-strip {
  display: block;
  width: 100%;
  height: 170px;
  margin: -3.15rem 0 0;
  overflow: hidden;
  border-radius: 0;
  background: linear-gradient(135deg, var(--pv-accent, #6366f1), color-mix(in srgb, var(--pv-accent, #6366f1) 45%, #ec4899));
}

.pv-banner-strip img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pv-hero--banner .pv-avatar.pv-avatar--banner {
  position: relative;
  z-index: 1;
  display: block;
  width: 108px;
  height: 108px;
  margin: -56px auto 0.75rem;
  border-radius: 50%;
  object-fit: cover;
  border: 4px solid var(--pv-page-bg, #fff);
  box-shadow: 0 12px 30px -12px rgba(15, 23, 42, 0.45);
}

.pv-cutout {
  position: relative;
  width: 88%;
  max-width: 320px;
  aspect-ratio: 1 / 1.08;
  margin: -0.4rem auto 0;
}

.pv-cutout-glow {
  position: absolute;
  left: 50%;
  top: 46%;
  width: 92%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--pv-accent, #6366f1) 55%, transparent) 0%, transparent 68%);
  filter: blur(6px);
  opacity: 0.9;
}

.pv-cutout img {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  -webkit-mask-image: radial-gradient(closest-side ellipse at 50% 44%, #000 58%, rgba(0, 0, 0, 0.6) 76%, transparent 100%);
  mask-image: radial-gradient(closest-side ellipse at 50% 44%, #000 58%, rgba(0, 0, 0, 0.6) 76%, transparent 100%);
}

.pv-hero--cutout .pv-name {
  position: relative;
  margin-top: -1.6rem;
}

.pv-shape {
  position: relative;
  width: 196px;
  height: 196px;
  margin: 0.4rem auto 1.25rem;
}

.pv-shape-blob {
  position: absolute;
  inset: -7% -11% -5% -9%;
  background: var(--pv-accent, #6366f1);
  border-radius: 58% 42% 55% 45% / 45% 55% 45% 55%;
  transform: rotate(-9deg);
}

.pv-shape-img {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%;
}


.pv-scroll .pv-hero.pv-hero--left,
#publicScreen .pv-scroll .pv-hero.pv-hero--left {
  align-items: center;
}


@media (max-width: 1099px) {
  #publicScreen .pv-scroll .pv-hero.pv-hero--left {
    padding-top: 4.4rem;
  }

  #publicScreen .pv-hero--plus {
    padding-left: 0;
    padding-right: 0;
  }

  #publicScreen .pv-hero.pv-hero--banner {
    padding-top: 0;
  }

  #publicScreen .pv-banner-strip {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-top: 0;
    height: clamp(170px, 27vh, 230px);
  }

  #publicScreen .pv-hero--banner > :not(.pv-banner-strip):not(.pv-avatar):not(.pv-share-trigger),
  #publicScreen .pv-hero--cutout > :not(.pv-share-trigger):not(.pv-cutout),
  #publicScreen .pv-hero--shape > :not(.pv-share-trigger):not(.pv-shape) {
    padding-left: 1.35rem;
    padding-right: 1.35rem;
  }

  #publicScreen .pv-cutout {
    margin-top: 2.6rem;
  }

  #publicScreen .pv-hero--shape .pv-shape {
    margin-top: 3.6rem;
  }
}


@media (min-width: 1100px) {
  #publicScreen .pv-banner-strip {
    margin-top: 0;
    border-radius: 24px;
    height: 170px;
  }

  #publicScreen .pv-cutout {
    width: 100%;
    margin-top: 0;
  }
}


.pv-scroll .pv-stat-item .pv-stat-label,
[data-surface] .pv-scroll .pv-stat-item .pv-stat-label,
#publicScreen .pv-scroll .pv-stat-item .pv-stat-label {
  color: var(--pv-card-muted, #64748b) !important;
}

.pv-scroll .pv-price-card .pv-price-features li,
#publicScreen .pv-scroll .pv-price-card .pv-price-features li {
  color: var(--pv-card-text, #0f172a);
  opacity: 0.86;
}

.pv-scroll .pv-price-card .pv-price-name {
  color: var(--pv-card-text, #0f172a);
}

.pv-scroll .pv-price-type,
#publicScreen .pv-scroll .pv-price-type {
  align-self: flex-start;
  gap: 0.35rem;
  margin: 0 0 0.6rem;
  padding: 0.3rem 0.65rem 0.3rem 0.55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--pv-card-text, #0f172a) 8%, transparent);
  color: var(--pv-card-text, #0f172a);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

.pv-scroll .pv-price-type i {
  font-size: 0.68rem;
  opacity: 1;
  color: var(--pv-price-accent, var(--pv-accent));
}

.pv-profile-cover--banner:not(:has(img)) {
  background: linear-gradient(120deg, var(--pv-accent, #6366f1), color-mix(in srgb, var(--pv-accent, #6366f1) 45%, #ec4899)) !important;
}

@media (min-width: 1100px) {
  #publicScreen .pv-hero--banner .pv-banner-strip {
    display: none;
  }

  #publicScreen .pv-hero--banner .pv-avatar.pv-avatar--banner {
    margin: 0 0 0.85rem;
  }

  #publicScreen .pv-hero.pv-hero--banner {
    text-align: left;
  }

  #publicScreen .pv-hero--banner > :not(.pv-banner-strip):not(.pv-avatar):not(.pv-share-trigger) {
    padding-left: 0;
    padding-right: 0;
  }

  #publicScreen .pv-hero--banner .pv-social,
  #publicScreen .pv-hero--banner .pv-meta {
    justify-content: flex-start;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pv-wallpaper video {
    display: none;
  }
}