:root {
  --sc-bg: #f5f6fb;
  --sc-surface: #ffffff;
  --sc-surface-soft: #fbfbfe;
  --sc-ink: #162033;
  --sc-ink-soft: #5b667b;
  --sc-line: #e7eaf3;
  --sc-brand: #b00061;
  --sc-brand-deep: #7f2455;
  --sc-brand-soft: #f8d7e9;
  --sc-accent: #2451ff;
  --sc-accent-soft: #dbe6ff;
  --sc-success-soft: #dcf5e8;
  --sc-gold-soft: #fff1bf;
  --sc-shadow-sm: 0 6px 18px rgba(22, 32, 51, 0.06);
  --sc-shadow-md: 0 16px 36px rgba(22, 32, 51, 0.1);
  --sc-shadow-lg: 0 26px 60px rgba(22, 32, 51, 0.14);
  --sc-radius-sm: 12px;
  --sc-radius-md: 18px;
  --sc-radius-lg: 24px;
  --sc-content-width: 1280px;
}

html {
  background: var(--sc-bg);
}

body {
  color: var(--sc-ink);
  background:
    radial-gradient(circle at top left, rgba(36, 81, 255, 0.06), transparent 28%),
    radial-gradient(circle at top right, rgba(176, 0, 97, 0.05), transparent 24%),
    var(--sc-bg);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

main {
  color: var(--sc-ink);
}

main p {
  color: var(--sc-ink-soft);
}

main section {
  position: relative;
}

main h1,
main h2,
main h3 {
  color: var(--sc-ink);
  letter-spacing: -0.018em;
}

#header .wsmainfull {
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: blur(10px);
  box-shadow: 0 10px 28px rgba(22, 32, 51, 0.08);
  border-bottom: 1px solid rgba(231, 234, 243, 0.88);
}

#header .wsmainwp {
  max-width: var(--sc-content-width);
  margin: 0 auto;
  padding-inline: 16px;
}

#header .menu-link {
  color: var(--sc-ink) !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em;
}

#header .menu-link:hover,
#header .menu-link:focus-visible {
  color: var(--sc-brand) !important;
}

#hero-1 {
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 255, 255, 0.34), transparent 24%),
    radial-gradient(circle at 88% 6%, rgba(136, 184, 255, 0.2), transparent 26%),
    linear-gradient(135deg, #fff8fd 0%, #f7f2ff 46%, #eef3ff 100%) !important;
}

#hero-1 #left,
#hero-1 #right > div,
.bonus-card,
#reviews-4 .viewport,
#faqs-1 .card,
#cta101 > div {
  border-radius: var(--sc-radius-md) !important;
}

#hero-1 #left {
  border: 1px solid rgba(207, 214, 230, 0.9) !important;
  box-shadow: var(--sc-shadow-lg) !important;
}

#hero-brand-logo {
  margin-bottom: 0.9rem !important;
}

#hero-brand-logo img {
  max-width: 184px !important;
}

#hero-1 [role="note"] {
  box-shadow: none !important;
  background: linear-gradient(135deg, #ff7b5a, var(--sc-brand)) !important;
}

#hero-h1 {
  color: var(--sc-ink) !important;
}

#hero-h1 .highlight {
  background: linear-gradient(135deg, var(--sc-brand), #7e45ff) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.hero-bubble {
  box-shadow: none !important;
  border: 1px solid rgba(255, 255, 255, 0.16);
}

.hero-bubble-cash {
  background: linear-gradient(135deg, #16a34a, #0f8a4b) !important;
}

.hero-bubble-ps5 {
  background: linear-gradient(135deg, #5b44f5, #9f3fbf) !important;
}

#hero-1 #left > div[style*="background:#fff8f2"] {
  background: linear-gradient(180deg, #fff8fb 0%, #fffdfd 100%) !important;
  border: 1px solid var(--sc-brand-soft) !important;
  border-radius: var(--sc-radius-sm) !important;
}

#hero-1 [role="group"] {
  border: 1px solid var(--sc-line);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), var(--sc-shadow-sm) !important;
}

#hero-1 #left a[aria-label*="Aktionsangebot"] {
  background: linear-gradient(135deg, var(--sc-brand), #8d2b83) !important;
  box-shadow: 0 16px 34px rgba(176, 0, 97, 0.24) !important;
}

#hero-1 #left a[aria-label*="Aktionsangebot"]:hover,
#hero-1 #left a[aria-label*="Aktionsangebot"]:focus-visible {
  background: linear-gradient(135deg, #921454, #6d1d69) !important;
}

#right > div {
  border: 1px solid var(--sc-line) !important;
  box-shadow: var(--sc-shadow-md) !important;
}

#right > div[style*="#4facfe"] {
  background:
    radial-gradient(circle at top right, rgba(255, 255, 255, 0.18), transparent 28%),
    linear-gradient(160deg, #ebf3ff 0%, #dfe8ff 100%) !important;
}

#right > div[style*="#4facfe"] > div[style*="position:absolute"] {
  background: linear-gradient(135deg, var(--sc-accent), #5092ff) !important;
  box-shadow: none !important;
}

@media (min-width: 980px) {
  #right > div[style*="#4facfe"] > div[style*="position:absolute"] {
    top: -14px !important;
  }
}

#right .trust-strip a span,
#right .trust-strip > span {
  box-shadow: none !important;
  background: #fff !important;
  border-color: rgba(22, 32, 51, 0.08) !important;
}

#right > div[style*="background:#e5f8e5"] {
  background: linear-gradient(180deg, #edfdf4 0%, #e2f6ec 100%) !important;
  box-shadow: none !important;
  border: 1px solid rgba(22, 163, 74, 0.12);
}

.bonus-card {
  margin-top: 0 !important;
  border: 1px solid rgba(255, 140, 0, 0.12);
  background: #fff;
  box-shadow: var(--sc-shadow-md);
  overflow: hidden;
}

.bonus-card__cta {
  background: linear-gradient(135deg, #ff9a1f, #ff6b1f) !important;
  box-shadow: none !important;
  padding: 1.1rem 1.05rem 1rem !important;
  position: relative;
  z-index: 1;
}

.bonus-card__badge {
  box-shadow: none !important;
  background: linear-gradient(135deg, #8d2b83, var(--sc-brand)) !important;
  position: relative;
  z-index: 2;
}

.bonus-card__details {
  background: var(--sc-surface-soft) !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 140, 0, 0.14) !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0.7rem 0.95rem !important;
}

.bonus-card__details-summary {
  color: var(--sc-ink) !important;
}

section[aria-labelledby="exklusiv-h2"] {
  background: transparent !important;
  padding: clamp(2.4rem, 4vw, 4.2rem) 1rem !important;
}

section[aria-labelledby="exklusiv-h2"] > div {
  max-width: 860px !important;
}

#exklusiv-h2 {
  font-size: clamp(1.8rem, 3vw, 2.7rem) !important;
  line-height: 1.1 !important;
  max-width: 17ch;
  margin-inline: auto !important;
}

section[aria-labelledby="exklusiv-h2"] p {
  max-width: 60ch;
  margin-inline: auto !important;
  font-size: clamp(1rem, 1.5vw, 1.14rem) !important;
}

#content-4 {
  padding: clamp(2.1rem, 4vw, 3.6rem) 1rem !important;
  background:
    radial-gradient(circle at top left, rgba(255, 255, 255, 0.18), transparent 24%),
    linear-gradient(135deg, #5f3de4 0%, #4d7eff 100%) !important;
}

#content-4 .bg-inner {
  max-width: var(--sc-content-width) !important;
}

#content-4 .row {
  align-items: stretch !important;
}

#content-4 figure {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

#content-4 figcaption {
  width: 100%;
  text-align: center !important;
}

#content-4 .txt-block {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--sc-radius-md);
  padding: 1.35rem 1.25rem;
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.12);
}

#content-4 .cta-btn,
#cta101 .cta-btn {
  background: linear-gradient(135deg, #ffffff, #f4f7ff) !important;
  color: var(--sc-ink) !important;
  box-shadow: 0 12px 28px rgba(10, 24, 60, 0.16) !important;
}

#content-4 .cta-btn:hover,
#cta101 .cta-btn:hover,
#content-4 .cta-btn:focus-visible,
#cta101 .cta-btn:focus-visible {
  background: linear-gradient(135deg, #ffffff, #e8efff) !important;
}

#content-4 .cta-arrow,
#cta101 .cta-arrow {
  color: var(--sc-brand);
}

#reviews-4 {
  padding: clamp(2.25rem, 4vw, 3.4rem) 1rem !important;
  background: transparent !important;
}

#reviews-4 .container {
  max-width: 1040px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.92));
  border: 1px solid rgba(231, 234, 243, 0.88);
  border-radius: var(--sc-radius-lg);
  box-shadow: var(--sc-shadow-md);
  padding: clamp(1rem, 2.5vw, 1.35rem) !important;
}

#reviews-4 .viewport {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#reviews-4 .card {
  border: 1px solid var(--sc-line) !important;
  box-shadow: none !important;
  min-height: 146px !important;
  background: linear-gradient(180deg, #fff 0%, #fbfcff 100%) !important;
}

#reviews-4 blockquote {
  color: var(--sc-ink) !important;
}

#reviews-4 .meta,
#reviews-4 .summary,
#reviews-4 .contact {
  color: var(--sc-ink-soft) !important;
}

#reviews-4 .dot.is-active {
  background: var(--sc-brand) !important;
}

#cta101 {
  background:
    radial-gradient(circle at top left, rgba(255, 255, 255, 0.16), transparent 20%),
    linear-gradient(135deg, #5b2ac8 0%, #8f2d8d 100%) !important;
  padding: clamp(2.3rem, 4vw, 3.3rem) 1rem !important;
}

#cta101 > div {
  max-width: 820px !important;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: var(--sc-shadow-lg);
  padding: 1.55rem 1.25rem !important;
}

#cta11-h22 {
  max-width: 14ch;
  margin-inline: auto !important;
}

#cta101 ul[role="list"] span {
  box-shadow: none !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
}

#faqs-1 {
  padding: clamp(2.25rem, 4vw, 3.5rem) 1rem !important;
  background: transparent !important;
}

#faqs-1 .container {
  max-width: var(--sc-content-width);
}

#faqs-1 .faqs-1-title {
  text-align: left !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.98));
  border: 1px solid rgba(231, 234, 243, 0.92);
  border-radius: var(--sc-radius-md);
  box-shadow: var(--sc-shadow-md);
  padding: 1.15rem 1.05rem !important;
}

#faqs-1 .faq-intro-image {
  border-radius: var(--sc-radius-sm) !important;
  box-shadow: none !important;
}

#faqs-1 .card {
  border: 1px solid rgba(231, 234, 243, 0.92) !important;
  box-shadow: var(--sc-shadow-sm) !important;
  overflow: hidden;
}

#faqs-1 .card-header {
  border-bottom: 1px solid rgba(231, 234, 243, 0.88) !important;
}

#faqs-1 .card-header a {
  color: var(--sc-ink) !important;
  padding: 15px 16px 8px !important;
}

#faqs-1 .card-header a:hover,
#faqs-1 .card-header a:focus-visible {
  color: var(--sc-brand) !important;
}

#faqs-1 .faq-kurz {
  color: var(--sc-ink-soft) !important;
  margin: 0 16px 14px !important;
  padding: 0.52rem 0.7rem !important;
  border-radius: 10px;
  background: linear-gradient(180deg, #f7f9fd 0%, #f1f4fb 100%);
  border: 1px solid rgba(231, 234, 243, 0.96);
}

#faqs-1 .card-body {
  color: var(--sc-ink-soft) !important;
  background: #fff !important;
}

#faqs-1 .card-body a {
  color: var(--sc-brand-deep) !important;
}

#footer-3 {
  background: linear-gradient(180deg, #ffffff 0%, #f7f8fc 100%) !important;
}

#footer-3 .container {
  max-width: var(--sc-content-width);
}

#footer-3 [aria-labelledby="trust-h2"] figure {
  transition: transform 0.18s ease;
}

#footer-3 [aria-labelledby="trust-h2"] figure:hover {
  transform: translateY(-2px);
}

#footer-3 a {
  text-underline-offset: 0.15em;
}

#footer-3 .bottom-footer {
  border-top: 1px solid rgba(231, 234, 243, 0.95);
  padding-top: 1rem;
}

/* Polish v2 main page only: stronger hero + CTA + FAQ surface treatment */
#hero-1 {
  background:
    radial-gradient(circle at 10% 4%, rgba(255, 255, 255, 0.68), transparent 24%),
    radial-gradient(circle at 86% 8%, rgba(123, 97, 255, 0.18), transparent 28%),
    radial-gradient(circle at 52% 100%, rgba(0, 184, 255, 0.08), transparent 34%),
    linear-gradient(135deg, #fff8fd 0%, #f6efff 44%, #edf4ff 100%) !important;
}

#hero-1 #left {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.94)) !important;
  border: 1px solid rgba(228, 212, 245, 0.98) !important;
  box-shadow:
    0 28px 68px -22px rgba(119, 44, 123, 0.24),
    0 16px 34px -18px rgba(22, 32, 51, 0.16) !important;
}

#hero-1 #left > div[style*="background:#fff8f2"] {
  background:
    linear-gradient(180deg, #fffafc 0%, #fffdfd 100%) !important;
  border: 1px solid rgba(237, 196, 223, 0.9) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
}

#hero-1 [role="note"] {
  background: linear-gradient(135deg, #ff7a5c, #d91e8c 58%, #9244ff 100%) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(176, 0, 97, 0.2) !important;
}

#hero-h1 {
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.78);
}

.hero-bubble {
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.14),
    0 12px 22px rgba(22, 32, 51, 0.16) !important;
}

.hero-bubble-cash {
  background: linear-gradient(135deg, #1bb45f, #0c8a57 100%) !important;
}

.hero-bubble-ps5 {
  background: linear-gradient(135deg, #5d3ff0, #8d35c9 52%, #d91e8c 100%) !important;
}

#hero-1 [role="group"] {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 255, 0.92)) !important;
  border: 1px solid rgba(223, 229, 241, 0.95) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.85),
    0 12px 24px rgba(22, 32, 51, 0.08) !important;
}

#right > div {
  background-clip: padding-box !important;
  border: 1px solid rgba(225, 231, 243, 0.95) !important;
  box-shadow:
    0 18px 36px -20px rgba(22, 32, 51, 0.18),
    0 8px 18px rgba(22, 32, 51, 0.06) !important;
}

#right .trust-strip a span,
#right .trust-strip > span {
  border: 1px solid rgba(223, 229, 241, 0.95) !important;
  box-shadow: 0 8px 16px rgba(22, 32, 51, 0.05) !important;
}

#hero-1 #left a[aria-label*="Aktionsangebot"],
.bonus-card__cta,
#content-4 .cta-btn,
#cta101 .cta-btn {
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  font-weight: 800 !important;
  letter-spacing: 0.01em !important;
  box-shadow:
    0 18px 34px rgba(176, 0, 97, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

#hero-1 #left a[aria-label*="Aktionsangebot"] {
  background: linear-gradient(135deg, #d91e8c 0%, #972f9a 52%, #6839d4 100%) !important;
  border-radius: 999px !important;
}

#hero-1 #left a[aria-label*="Aktionsangebot"]:hover,
#hero-1 #left a[aria-label*="Aktionsangebot"]:focus-visible,
.bonus-card__cta:hover,
.bonus-card__cta:focus-visible,
#content-4 .cta-btn:hover,
#content-4 .cta-btn:focus-visible,
#cta101 .cta-btn:hover,
#cta101 .cta-btn:focus-visible {
  transform: translateY(-2px) !important;
}

#hero-1 #left a[aria-label*="Aktionsangebot"]:focus-visible,
.bonus-card__cta:focus-visible,
#content-4 .cta-btn:focus-visible,
#cta101 .cta-btn:focus-visible {
  box-shadow:
    0 0 0 4px rgba(217, 30, 140, 0.18),
    0 20px 36px rgba(176, 0, 97, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

.bonus-card {
  border: 1px solid rgba(255, 177, 98, 0.24) !important;
  box-shadow:
    0 22px 40px -24px rgba(255, 120, 31, 0.34),
    0 14px 28px rgba(22, 32, 51, 0.08) !important;
  background: linear-gradient(180deg, #fffefd 0%, #fffaf5 100%) !important;
}

.bonus-card__cta {
  background: linear-gradient(135deg, #ff9b23 0%, #ff7d20 54%, #ff5f36 100%) !important;
  border-radius: .9rem !important;
  box-shadow:
    0 18px 34px rgba(255, 125, 32, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

.bonus-card__badge {
  background: linear-gradient(135deg, #7a2d9d 0%, #b00061 62%, #e33789 100%) !important;
  box-shadow: 0 12px 20px rgba(176, 0, 97, 0.18) !important;
}

.bonus-card__details {
  background: linear-gradient(180deg, #fffdfb 0%, #fff8f1 100%) !important;
  border-top: 1px solid rgba(255, 160, 84, 0.22) !important;
}

#content-4 .cta-btn,
#cta101 .cta-btn {
  background: linear-gradient(135deg, #ffffff 0%, #f6f4ff 54%, #eef4ff 100%) !important;
  color: #162033 !important;
  border-radius: 999px !important;
  box-shadow:
    0 18px 30px rgba(10, 24, 60, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
}

#cta101 > div {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.06)) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
}

#cta101 ul[role="list"] span {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

#faqs-1 .faqs-1-title {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(249, 248, 255, 0.95)) !important;
  border: 1px solid rgba(229, 217, 245, 0.96) !important;
  box-shadow:
    0 22px 44px -28px rgba(119, 44, 123, 0.28),
    0 14px 28px rgba(22, 32, 51, 0.08) !important;
}

#faqs-1 .card {
  background: linear-gradient(180deg, #ffffff 0%, #fcfbff 100%) !important;
  border: 1px solid rgba(231, 220, 244, 0.96) !important;
  box-shadow:
    0 12px 24px rgba(22, 32, 51, 0.05),
    0 4px 10px rgba(22, 32, 51, 0.03) !important;
}

#faqs-1 .card-header {
  background: linear-gradient(180deg, #ffffff 0%, #fcfbff 100%) !important;
  border-bottom: 1px solid rgba(234, 224, 246, 0.92) !important;
}

#faqs-1 .card-header a {
  color: #1b2437 !important;
  font-weight: 700 !important;
}

#faqs-1 .card-header a::after {
  color: #9346c6 !important;
  font-weight: 800 !important;
}

#faqs-1 .card-header a:hover,
#faqs-1 .card-header a:focus-visible {
  color: #b00061 !important;
}

#faqs-1 .faq-kurz {
  background: linear-gradient(135deg, rgba(149, 76, 196, 0.11), rgba(0, 184, 255, 0.08)) !important;
  border: 1px solid rgba(195, 171, 226, 0.82) !important;
  color: #58647c !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

#faqs-1 .card-body {
  background: linear-gradient(180deg, #ffffff 0%, #fcfdff 100%) !important;
  color: #667085 !important;
}

#faqs-1 .card-body a {
  color: #7f2455 !important;
  text-decoration: underline dotted !important;
  text-underline-offset: 2px !important;
}

@media (max-width: 991px) {
  #hero-grid {
    gap: 1rem !important;
  }

  #hero-1 #left,
  #content-4 .txt-block,
  #cta101 > div,
  #faqs-1 .faqs-1-title {
    padding: 1rem !important;
  }

  #hero-h1,
  #exklusiv-h2,
  #cta11-h22 {
    max-width: none;
  }
}

@media (max-width: 767px) {
  #header .wsmainfull {
    backdrop-filter: none;
  }

  #hero-1 {
    padding-top: 1rem !important;
  }

  #hero-1 #left a[aria-label*="Aktionsangebot"],
  #content-4 .cta-btn,
  #cta101 .cta-btn {
    width: 100%;
    max-width: 340px;
  }

  #content-4 .row {
    gap: 1rem !important;
  }

  #faqs-1 .faqs-1-title {
    margin-bottom: 1rem;
  }

  .bonus-card {
    overflow: visible !important;
    position: relative;
    z-index: 1;
  }

  .bonus-card__cta {
    padding-top: 2rem !important;
    overflow: visible !important;
    position: relative;
    z-index: 2;
  }

  .bonus-card__badge {
    position: absolute;
    top: -0.78rem;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    z-index: 5;
  }
}

@media (min-width: 980px) {
  #content-4 .row {
    align-items: center !important;
  }

  #content-4 .col-md-5.col-lg-6,
  #content-4 .col-md-7.col-lg-6 {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #content-4 .col-md-5.col-lg-6 {
    text-align: center !important;
  }

  #content-4 .txt-block {
    width: min(100%, 620px);
    margin-inline: 0 !important;
  }
}
