/* ==========================================================================
   Ad slots — A-ADS units.
   One container per slot; the unit itself is injected by ads.js so the
   iframe always gets its exact pixel size (never scaled).

   Current usage: only the end-of-page block. Top banner and inline rectangle
   are out on purpose — the page keeps its flow.
   ========================================================================== */

.ad-slot {
  position: relative;
  z-index: 99998;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;          /* styles.css sets content-box globally */
  width: 100%;
  margin: 0;
  padding: 0;
}

.ad-slot__frame {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  overflow: hidden;
}

.ad-slot__frame iframe {
  display: block;
  margin: 0 auto;
  border: 0;
  padding: 0;
  overflow: hidden;
}

/* ------------------------------------ slot: end of page (adaptive unit) */
.ad-slot--footer {
  min-height: 110px;
  padding: 8px 12px 4px;
  margin: 24px auto 12px;
}

/* the adaptive unit is fluid — its height is decided by the network */
.ad-slot--footer .ad-slot__frame,
.ad-slot__frame--adaptive {
  width: 70%;
  max-width: 900px;
}

@media (max-width: 420px) {
  .ad-slot--footer .ad-slot__frame,
  .ad-slot__frame--adaptive {
    width: 94%;
  }
}

/* ------------------------------------- rail: 160x600 skyscraper, right side
   Fixed, so it never moves the page layout. Only shown when the content
   column still has room next to it:
     viewport >= content width + 2 x (160 rail + 28 margin)
   index 1240 | howitworks 1180 | risks 900  ->  1620 px covers all three.
   Below that the end-of-page banner is the fallback.                      */
.ad-rail {
  position: fixed;
  top: 92px;
  right: 14px;
  z-index: 40;
  display: none;
  box-sizing: border-box;
  width: 160px;
  margin: 0;
  padding: 0;
}

@media (min-width: 1620px) {
  .ad-rail {
    display: flex;
    align-items: flex-start;
    justify-content: center;
  }
}

/* nothing to show yet / blocked by an ad blocker */
.ad-slot:empty {
  display: none;
}
