/* INK-MKT-ENGINE Ф3 (T3.3) — banner slots P1 (under hero) / P2 (after article body).
   Reserved box via aspect-ratio + width/height attrs -> CLS = 0. Campaign and house unit
   share the same box, so an unsold slot never collapses. Dark theme default. */
.ad-slot {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: var(--article-body-width, 780px);
  margin: 32px auto;
  padding: 0 16px;
}
.article-body .ad-slot { padding: 0; margin: 40px 0 0; }
.ad-slot__box {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 12px;
  background: var(--surface-2, #1a1a1a);
  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
}
.ad-slot--p1 .ad-slot__box { aspect-ratio: 16 / 5; }
.ad-slot--p2 .ad-slot__box { aspect-ratio: 4 / 3; max-width: 480px; margin: 0 auto; }
@media (max-width: 640px) { .ad-slot--has-mobile .ad-slot__box { aspect-ratio: 2 / 1; } }
.ad-slot__link, .ad-slot__link picture { display: block; width: 100%; height: 100%; }
.ad-slot__img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* P2 sits inside .article-body, whose generic img/a rules add margins, radius and underline */
.article-body .ad-slot__img { margin: 0; height: 100%; border-radius: 0; }
.article-body .ad-slot__link, .article-body .ad-slot__house { text-decoration: none; }
.ad-slot__label {
  /* above the creative, never on top of the advertiser's text */
  display: block;
  margin: 0 0 6px;
  font: 600 10px/1.4 var(--article-font-ui, system-ui, sans-serif);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: right;
  color: var(--text-tertiary, rgba(255, 255, 255, 0.45));
}
.ad-slot--p2 .ad-slot__label { max-width: 480px; margin-left: auto; margin-right: auto; }
.ad-slot__house {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  width: 100%;
  height: 100%;
  padding: 12px 20px;
  box-sizing: border-box;
  text-decoration: none;
  color: var(--text-primary, #f2f2f2);
  background: linear-gradient(135deg, var(--surface-2, #1a1a1a), var(--surface-3, #262626));
}
.ad-slot__house-brand { font: 700 12px/1 var(--article-font-ui, system-ui, sans-serif); letter-spacing: 0.12em; opacity: 0.7; }
.ad-slot__house-text { font: 600 clamp(14px, 3.6vw, 20px)/1.25 var(--article-font-display, serif); }
.ad-slot__house-cta { font: 600 13px/1 var(--article-font-ui, system-ui, sans-serif); color: var(--accent, #e94560); }
[data-theme="light"] .ad-slot__label { color: rgba(0, 0, 0, 0.45); }
[data-theme="light"] .ad-slot__box { background: #f2f2f2; border-color: rgba(0, 0, 0, 0.08); }
[data-theme="light"] .ad-slot__house { color: #111; background: linear-gradient(135deg, #f4f4f4, #e8e8e8); }
/* Network fallback (AdSense / РСЯ): the ad fills the reserved box, never resizes it (CLS = 0). */
.ad-slot__box > .ad-slot__net { position: absolute; inset: 0; display: block; width: 100%; height: 100%; overflow: hidden; }

/* Ф3 B4 — "Section supported by [Brand]" partner plate above the article text.
   Not a reserved slot: absent when unsold. Logo height fixed by attr + CSS (no CLS on load). */
.ad-plate { margin: 0 0 24px; }
.ad-plate__link {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  max-width: 100%;
  padding: 8px 12px;
  box-sizing: border-box;
  border-radius: 10px;
  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
  background: var(--surface-2, #1a1a1a);
  color: var(--text-secondary, rgba(255, 255, 255, 0.7));
  font: 500 13px/1.3 var(--article-font-ui, system-ui, sans-serif);
  text-decoration: none;
}
.article-body .ad-plate__link { text-decoration: none; }
.ad-plate__label {
  font: 600 10px/1.4 var(--article-font-ui, system-ui, sans-serif);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-tertiary, rgba(255, 255, 255, 0.45));
}
.ad-plate__logo-wrap { display: inline-flex; align-items: center; height: 28px; }
.ad-plate__logo, .article-body .ad-plate__logo {
  display: block;
  height: 28px;
  width: auto;
  max-width: 140px;
  margin: 0;
  border-radius: 4px;
  object-fit: contain;
}
.ad-plate__brand { font-weight: 700; color: var(--text-primary, #f2f2f2); }
.ad-plate__link:hover .ad-plate__brand { color: var(--accent, #e94560); }
[data-theme="light"] .ad-plate__link { background: #f2f2f2; border-color: rgba(0, 0, 0, 0.08); color: rgba(0, 0, 0, 0.7); }
[data-theme="light"] .ad-plate__label { color: rgba(0, 0, 0, 0.45); }
[data-theme="light"] .ad-plate__brand { color: #111; }
