/* Ad placements.
   Every slot reserves its height before the ad loads, the way large news
   sites do it, so a slow ad network never pushes the story down the page
   (layout shift hurts both readers and Core Web Vitals). */

.ad-placement { margin: 28px 0; text-align: center; }
.ad-placement .ad-caption {
  font-size: 0.6rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--slate-light); margin: 0 0 6px;
}
.ad-placement .ad-body { display: flex; justify-content: center; align-items: center; min-height: 90px; }
/* Slots placed straight into the page keep to the content width. */
main > .ad-placement { max-width: var(--wrap); margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; }
@media (max-width: 640px) { main > .ad-placement { padding-left: 16px; padding-right: 16px; } }
.ad-placement .ad-body > * { max-width: 100%; }
.ad-inline { margin: 26px 0; min-height: 250px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.ad-inline > * { max-width: 100%; }
/* AdSense responsive units size themselves from their own width, which a
   centring flex box would shrink to zero. */
.ad-placement .ad-body > ins.adsbygoogle, .ad-inline > ins.adsbygoogle { width: 100%; align-self: stretch; }

/* Full-width bands: above the header and under the header/ticker. */
.ad-band { background: #F1F1F1; border-bottom: 1px solid var(--line); }
.ad-band .ad-placement { margin: 0; padding: 8px 0 10px; }
.ad-band .ad-body { background: transparent; min-height: 90px; }
.ad-band-header { background: var(--white); border-bottom: 0; }
.ad-band-header .ad-placement { padding-top: 16px; }
@media (max-width: 760px) { .ad-band .ad-body { min-height: 50px; } }

/* Sidebar units */
aside .ad-placement { margin: 0 0 28px; }
aside .ad-placement .ad-body { min-height: 250px; }
.sticky-ad { position: sticky; top: calc(var(--header-h) + 16px); }
.sticky-ad .ad-placement .ad-body { min-height: 600px; }
@media (max-width: 1024px) { .sticky-ad { position: static; } .sticky-ad .ad-placement .ad-body { min-height: 250px; } }

/* Between section blocks on the front page */
.fp-body .ad-placement { margin: 4px 0 36px; }

/* Side rails: fixed in the margins on very wide screens only. */
.ad-rail { display: none; }
@media (min-width: 1600px) {
  .ad-rail { display: block; position: fixed; top: 210px; width: 160px; z-index: 5; }
  .ad-rail .ad-placement { margin: 0; }
  .ad-rail .ad-body { min-height: 600px; }
  .ad-rail-left { left: calc(50% - var(--wrap) / 2 - 184px); }
  .ad-rail-right { right: calc(50% - var(--wrap) / 2 - 184px); }
}

/* Sticky bottom bar on phones */
.ad-anchor { display: none; }
@media (max-width: 760px) {
  .ad-anchor { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; background: var(--white);
    box-shadow: 0 -4px 16px rgba(0, 0, 0, .12); padding: 4px 0 calc(4px + env(safe-area-inset-bottom)); }
  .ad-anchor .ad-placement { margin: 0; }
  .ad-anchor .ad-caption { display: none; }
  .ad-anchor .ad-body { min-height: 50px; background: transparent; }
  .ad-anchor.closed { display: none; }
  body.has-anchor { padding-bottom: 64px; }
  body.has-anchor .to-top { bottom: 100px; }
}
.ad-anchor-close { position: absolute; right: 6px; top: -26px; width: 26px; height: 26px; border-radius: 50% 50% 0 0;
  background: var(--white); color: var(--slate); font-size: 18px; line-height: 1; box-shadow: 0 -2px 6px rgba(0,0,0,.1); }

/* Admin-only position preview (?ad_preview=1) */
.ad-preview { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  min-height: 90px; margin: 20px 0; padding: 10px; text-align: center;
  border: 2px dashed #E3A008; background: repeating-linear-gradient(45deg, #FFF8E1, #FFF8E1 10px, #FFF3CD 10px, #FFF3CD 20px);
  color: #7A5300; font-family: var(--body); font-size: 0.8rem; font-style: normal; }
.ad-preview strong { font-size: 0.85rem; }
.ad-preview.is-live { border-color: var(--ok); background: #E8F6EF; color: var(--ok); }
aside .ad-preview { min-height: 250px; margin: 0 0 24px; }
.sticky-ad .ad-preview { min-height: 600px; }
.ad-rail .ad-preview { min-height: 600px; margin: 0; }
.ad-band .ad-preview { margin: 8px 0; }
.ad-anchor .ad-preview { min-height: 50px; margin: 0; }

/* Ads dropped between paragraphs or list items carry the same label. */
.ad-inline::before { content: 'Advertisement'; display: block; margin-bottom: 6px; font-family: var(--body); font-size: 0.6rem; font-weight: 700;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--slate-light); }
.ad-inline:has(> .ad-preview)::before { display: none; }

/* Your own banner (media library + click-through link) */
.own-ad { display: inline-block; max-width: 100%; line-height: 0; border-radius: var(--radius-sm); overflow: hidden; transition: opacity .15s; }
.own-ad:hover { opacity: .92; }
.own-ad img, .own-ad video { display: block; max-width: 100%; height: auto; }
