/* ── ADS.CSS — TripCurator Ad Slot Styles ──
   Centralised ad placement styles for all page types.
   Include after main stylesheet, before closing </head>.
   ─────────────────────────────────────────── */

/* ── Base Slot ── */
.ad-slot {
  background: var(--bg-soft);
  border: 1px dashed var(--border);
  border-radius: var(--radius-s);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 4px;
  color: var(--ink-soft);
  font-size: 11px; font-weight: 500;
  letter-spacing: .06em; text-transform: uppercase;
}

/* ── Top Banner — 728×90 (desktop) / 320×50 (mobile) ── */
.ad-bar { padding: 10px 0; background: var(--bg-soft); border-bottom: 1px solid var(--border); }
.ad-slot-top { width: 100%; max-width: 728px; height: 90px; margin: 0 auto; }

/* ── Sidebar Rectangle — 300×250 ── */
.ad-slot-rect { width: 100%; height: 250px; flex-shrink: 0; }

/* ── Mid-Content — 468×60 (shorter paragraph breaks) ── */
.ad-slot-mid { width: 100%; max-width: 468px; height: 60px; margin: 0 auto; }

/* ── Inline Article — 336×280 (deeper content breaks) ── */
.ad-slot-inline { width: 100%; max-width: 336px; height: 280px; margin: 36px auto; }

/* ── Grid List Pages — spans full card grid ── */
.ad-grid-slot {
  grid-column: 1 / -1;
  padding: 20px 0;
  display: flex; flex-direction: column;
  align-items: center; gap: 6px;
}

/* ── Labels & Wrappers ── */
.ad-lbl { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-soft); }
.ad-inline-wrap { margin: 36px 0; text-align: center; }

/* ── Responsive ── */
@media (max-width: 600px) {
  .ad-slot-top { max-width: 320px; height: 50px; }
}
