/* Only the two campaign surfaces and the contextual form selection. */
[data-monthly-promotion] .techcheck-offer__title,
[data-monthly-promotion] .fs-style-42 {
  overflow-wrap: anywhere;
  hyphens: auto;
}
[data-monthly-promotion] .techcheck-offer__checks li { align-items: flex-start; }
[data-contact-promotion] {
  margin: 0 0 24px;
  padding: 16px;
  border: 1px solid var(--border-subtle, #45464b);
  border-radius: 16px;
  background: linear-gradient(110deg, rgba(240,132,0,.09), transparent 75%);
}
[data-contact-promotion] label { display: flex; align-items: flex-start; gap: 10px; }
[data-contact-promotion] input[type="checkbox"] { flex: 0 0 auto; margin-top: 4px; accent-color: #f08400; }
[data-contact-promotion] p { margin: 10px 0; }
[data-contact-promotion] summary { cursor: pointer; font-weight: 600; }

#agency-megamenu [data-monthly-promotion="agency"]:not([data-promotion-id="2026-11"]) .techcheck-offer__score { top: 70px; }

/* Keep the menu's existing columns and outer card dimensions. Fit copy inside. */
#agency-megamenu [data-monthly-promotion="agency"] .techcheck-offer__title {
  max-width: 100%; min-height: 2.4em; font-size: 23px; line-height: 1.2;
}
#agency-megamenu [data-monthly-promotion="agency"] .techcheck-offer__copy p {
  font-size: 11px; white-space: nowrap; margin: 10px 0 8px;
}
#agency-megamenu [data-monthly-promotion="agency"] .techcheck-offer__checks li {
  font-size: 12px; line-height: 1.35; min-height: 22px; gap: 7px;
}
#agency-megamenu [data-monthly-promotion="agency"] .techcheck-offer__checks li > span {
  width: 18px; height: 18px; font-size: 13px;
}
@media (min-width: 1025px) {
  /* Existing November card measured at 444.36px; campaign copy cannot grow it. */
  #agency-megamenu [data-monthly-promotion="agency"] { height: 444.36px; box-sizing: border-box; }
}

/* Topic-specific line illustrations inside the existing circle. */
#agency-megamenu .techcheck-offer__score .monthly-promotion-icon { width: 29px; height: 29px; flex: none; transform: rotate(20deg); color: var(--orange-text); }
#agency-megamenu .techcheck-offer__score .monthly-promotion-icon-label { font-size: 7px; font-weight: 800; line-height: 1.3; letter-spacing: .02em; margin-top: 2px; white-space: nowrap; }

/* The header retains its 140px desktop footprint; each month has its own scene. */
#agency-megamenu [data-monthly-promotion="agency"]:not([data-promotion-id="2026-11"]) .techcheck-offer__visual {
 background: radial-gradient(ellipse at 25% 70%,rgba(240,132,0,.16),transparent 72%),var(--surface-1,#202124);
}
#agency-megamenu .monthly-scene { position:absolute; left:18px; right:82px; top:43px; height:88px; display:flex; flex-direction:column; align-items:flex-start; gap:3px; color:var(--text-secondary,#c4c5ca); }
#agency-megamenu .monthly-scene svg { display:block; height:65px; width:100%; max-width:150px; overflow:visible; }
#agency-megamenu .monthly-scene .scene-accent { stroke:var(--orange-text,#ff9913); }
#agency-megamenu .monthly-scene > span { font-size:9px; line-height:1.2; font-weight:600; max-width:100%; }
#agency-megamenu .techcheck-offer__score:has(.monthly-promotion-icon) { transform:none; display:grid; place-items:center; }
#agency-megamenu .techcheck-offer__score .monthly-promotion-icon { transform:none; width:30px; height:30px; }

/* ZIP reference 09.11.2026; isolated from regular pricing cards. */
/* ==========================================================================
   sjmedia – Monatsaktions-Karte (promo-card)
   Feste Größe 284 × 442 px. Nur der Kopf (Illustration + Akzent) wechselt je Monat.
   ========================================================================== */

[data-monthly-promotion="agency"].promo-card {
  /* Design-Tokens */
  --pc-width: 284px;
  --pc-height: 442px;
  --pc-head-height: 140px;
  --pc-radius: 18px;
  --pc-pad-x: 20px;

  --pc-bg-top: #1c1a1f;
  --pc-bg-bottom: #17151a;
  --pc-head-bg: #141216;
  --pc-border: rgba(255, 255, 255, 0.08);
  --pc-text: #ffffff;
  --pc-text-soft: #f4f2f5;
  --pc-text-muted: #a9a5ae;
  --pc-eyebrow: #ffb26b;
  --pc-price: #ff8f33;
  --pc-check: #ff9a3c;
  --pc-pill-bg: #ffc94a;
  --pc-pill-text: #241a00;
  --pc-ribbon-bg: linear-gradient(90deg, #ff6a13, #ffa53a);
  --pc-ribbon-text: #1b1003;
  --pc-cta-bg: linear-gradient(90deg, #f26a10 0%, #ff9a1f 100%);
  --pc-cta-text: #1b1003;          /* dunkle Schrift auf Gradient = freigegebener Primär-Button */

  --pc-font-display: "PSFigtree", "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --pc-font-body: "PSFigtree", "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  position: relative;
  box-sizing: border-box;
  width: var(--pc-width);
  height: var(--pc-height);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--pc-radius);
  border: 1px solid var(--pc-border);
  background: linear-gradient(180deg, var(--pc-bg-top) 0%, var(--pc-bg-bottom) 100%);
  box-shadow: 0 24px 48px -24px rgba(0, 0, 0, 0.7);
  font-family: var(--pc-font-body);
  color: var(--pc-text);
}
.promo-card *, .promo-card *::before, .promo-card *::after { box-sizing: border-box; }

.promo-card--gratis {
  --pc-ribbon-bg: linear-gradient(90deg, #16b67a, #4ade9b);
  --pc-ribbon-text: #04140c;
}

/* ---------- Kopf (wechselt je Monat) ---------- */
.promo-card__head {
  position: relative;
  flex: none;
  height: var(--pc-head-height);
  background: var(--pc-head-bg);
}
.promo-card__art,
.promo-card__art svg,
.promo-card__art img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}
/* weicher Übergang Kopf → Kartenkörper */
.promo-card__head::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 36px;
  background: linear-gradient(180deg, rgba(28, 26, 31, 0) 0%, var(--pc-bg-top) 100%);
  pointer-events: none;
}

/* Datums-Pill (fest) */
.promo-card__date {
  position: absolute;
  z-index: 2;
  left: 14px;
  top: 14px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--pc-pill-bg);
  color: var(--pc-pill-text);
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  box-shadow: 0 4px 14px -4px rgba(255, 201, 74, 0.6);
}

/* Eckband: Aktion / Reduziert / Gratis (fest) */
.promo-card__ribbon {
  position: absolute;
  z-index: 2;
  top: 18px;
  right: -38px;
  width: 136px;
  padding: 5px 0;
  transform: rotate(45deg);
  background: var(--pc-ribbon-bg);
  color: var(--pc-ribbon-text);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0.14em;
  text-align: center;
  text-transform: uppercase;
  box-shadow: 0 4px 12px -2px rgba(0, 0, 0, 0.5);
}

/* ---------- Körper (fest) ---------- */
.promo-card__body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 4px var(--pc-pad-x) 18px;
}

/* Titelzone: immer Platz für 2 Zeilen, Inhalt vertikal mittig
   → ein- und zweizeilige Titel wirken gleich ausgewogen, Preis steht überall auf gleicher Höhe */
.promo-card__titlezone {
  height: 70px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
}
.promo-card__eyebrow {
  margin: 0;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--pc-eyebrow);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.promo-card__title {
  margin: 0;
  font-family: var(--pc-font-display);
  font-size: 21px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--pc-text);
  /* max. 2 Zeilen */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Preiszeile */
.promo-card__price {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 44px;          /* feste Höhe: Preis steht auf allen Karten gleich, auch mit Streichpreis */
  margin: 12px 0 0;
}
.promo-card__amount {
  font-family: var(--pc-font-display);
  font-size: 32px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--pc-price);
  white-space: nowrap;
}
.promo-card__meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-left: 12px;
  border-left: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 11px;
  line-height: 1.2;
  color: var(--pc-text-muted);
}
.promo-card__meta s { text-decoration-thickness: 1px; }

/* Leistungen */
.promo-card__list {
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.promo-card__list li {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--pc-text-soft);
}
.promo-card__check { flex: none; }
.promo-card__check circle { fill: rgba(255, 138, 42, 0.16); }
.promo-card__check path {
  fill: none;
  stroke: var(--pc-check);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Button (fest, unten verankert) */
.promo-card__cta {
  margin-top: auto;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--pc-cta-bg);
  color: var(--pc-cta-text);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 10px 24px -10px rgba(255, 122, 24, 0.8);
  transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}
.promo-card__cta:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow: 0 14px 28px -10px rgba(255, 122, 24, 0.9);
}
.promo-card__cta:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 3px;
}
.promo-card__cta-icon { transition: transform 0.18s ease; }
.promo-card__cta:hover .promo-card__cta-icon { transform: translateX(2px); }

@media (prefers-reduced-motion: reduce) {
  .promo-card__cta, .promo-card__cta-icon { transition: none; }
  .promo-card__cta:hover, .promo-card__cta:hover .promo-card__cta-icon { transform: none; }
}

.promo-card__titlezone,.promo-card__price,.promo-card__list,.promo-card__cta { flex-shrink:0; }
#agency-megamenu .promo-card { align-self:start; justify-self:center; }