/*
 * Metropool Studio — publieke artikelblokken.
 *
 * De selectors zijn bewust begrensd tot artikel- en Elementor-inhoud. Zo
 * blijft deze stylesheet een aanvulling op het thema, in plaats van een
 * globale reset voor de rest van de website.
 */

@font-face { font-family:"Metropool Lemon"; src:url("fonts/lemon-milk-light.woff2") format("woff2"); font-style:normal; font-weight:300; font-display:swap; }
@font-face { font-family:"Metropool Lemon"; src:url("fonts/lemon-milk-light-italic.woff2") format("woff2"); font-style:italic; font-weight:300; font-display:swap; }
@font-face { font-family:"Metropool Lemon"; src:url("fonts/lemon-milk-regular.woff2") format("woff2"); font-style:normal; font-weight:400; font-display:swap; }
@font-face { font-family:"Metropool Lemon"; src:url("fonts/lemon-milk-bold.woff2") format("woff2"); font-style:normal; font-weight:700; font-display:swap; }
@font-face { font-family:"Metropool Vogue"; src:url("fonts/vogue.woff2") format("woff2"); font-style:normal; font-weight:400; font-display:swap; }

:root { --font-display:"Metropool Vogue",Newsreader,Georgia,serif; --font-caps:"Metropool Lemon",Archivo,Arial,sans-serif; --font-impact:"Metropool Lemon",Archivo,Arial,sans-serif; }

:is(.entry-content, .elementor-page-content) .mp-story-paragraph {
  margin: 0 0 1.52em;
  color: var(--ink);
  font: 400 1em/1.68 var(--font-lees);
  text-wrap: pretty;
}

:is(.entry-content, .elementor-page-content) .mp-story-heading {
  max-width: 20ch;
  margin: 2.05em 0 .58em;
  color: var(--ink);
  font-family: var(--font-display);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -.026em;
  text-wrap: balance;
}

:is(.entry-content, .elementor-page-content) h2.mp-story-heading {
  font-size: clamp(2rem, 4.2vw, 3.15rem);
}

:is(.entry-content, .elementor-page-content) h3.mp-story-heading {
  font-size: clamp(1.55rem, 3vw, 2.16rem);
}

:is(.entry-content, .elementor-page-content) h4.mp-story-heading {
  font-size: clamp(1.25rem, 2.3vw, 1.6rem);
}

:is(.entry-content, .elementor-page-content) .mp-story-image {
  margin: clamp(2rem, 5vw, 3.65rem) 0;
}

:is(.entry-content, .elementor-page-content) .mp-story-image img {
  width: 100%;
  min-height: 0;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  background: var(--vlak);
}

:is(.entry-content, .elementor-page-content) .mp-story-image--single img {
  aspect-ratio: 16 / 9;
}

:is(.entry-content, .elementor-page-content) .mp-story-image figcaption {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 11px 0 0;
  color: var(--ink-dim);
  font: 700 10px/1.45 var(--font-caps);
  letter-spacing: .11em;
  text-transform: uppercase;
}

:is(.entry-content, .elementor-page-content) .mp-story-image figcaption span {
  white-space: nowrap;
  color: var(--ink-soft);
}

:is(.entry-content, .elementor-page-content) .mp-story-gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px;
  margin: clamp(2rem, 5vw, 3.65rem) 0;
  overflow: hidden;
  background: var(--rule);
}

:is(.entry-content, .elementor-page-content) .mp-story-gallery .mp-story-image {
  margin: 0;
  background: var(--nacht);
}

:is(.entry-content, .elementor-page-content) .mp-story-gallery .mp-story-image:first-child:nth-last-child(1),
:is(.entry-content, .elementor-page-content) .mp-story-gallery .mp-story-image:first-child:nth-last-child(3) {
  grid-column: 1 / -1;
}

:is(.entry-content, .elementor-page-content) .mp-story-gallery .mp-story-image img {
  height: 100%;
  min-height: 250px;
  aspect-ratio: 4 / 3;
}

:is(.entry-content, .elementor-page-content) .mp-story-gallery .mp-story-image:first-child:nth-last-child(1) img,
:is(.entry-content, .elementor-page-content) .mp-story-gallery .mp-story-image:first-child:nth-last-child(3) img {
  aspect-ratio: 16 / 9;
}

:is(.entry-content, .elementor-page-content) .mp-story-gallery .mp-story-image figcaption {
  padding: 10px 12px 12px;
  background: var(--vlak);
}

:is(.entry-content, .elementor-page-content) .mp-story-quote {
  position: relative;
  margin: clamp(2.7rem, 7vw, 5.2rem) 0;
  padding: 0 0 0 clamp(1.55rem, 4vw, 3.25rem);
  border: 0;
  color: var(--ink);
}

:is(.entry-content, .elementor-page-content) .mp-story-quote::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  border-radius: 5px;
  background: var(--goud);
  content: "";
}

:is(.entry-content, .elementor-page-content) .mp-story-quote > span {
  position: absolute;
  top: -.17em;
  left: clamp(1.55rem, 4vw, 3.25rem);
  color: var(--goud);
  font: 900 clamp(4rem, 9vw, 6.5rem)/.7 var(--font-display);
  pointer-events: none;
}

:is(.entry-content, .elementor-page-content) .mp-story-quote p {
  max-width: 22ch;
  margin: 0;
  padding-top: .55em;
  font: 800 clamp(1.75rem, 4.2vw, 2.7rem)/1.12 var(--font-display);
  letter-spacing: -.025em;
  text-wrap: balance;
}

:is(.entry-content, .elementor-page-content) .mp-story-quote cite {
  display: block;
  margin-top: 18px;
  color: var(--ink-dim);
  font: 700 10px/1.3 var(--font-caps);
  font-style: normal;
  letter-spacing: .14em;
  text-transform: uppercase;
}

:is(.entry-content, .elementor-page-content) .mp-story-card {
  position: relative;
  margin: clamp(2rem, 5vw, 3.5rem) 0;
  padding: clamp(1.35rem, 4vw, 2.35rem);
  border: 1px solid var(--rule);
  border-top: 5px solid var(--goud);
  background: var(--vlak);
  color: var(--ink);
}

:is(.entry-content, .elementor-page-content) .mp-story-card .mp-story-kicker,
:is(.entry-content, .elementor-page-content) .mp-story-social .mp-story-kicker {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 20px;
  color: var(--ink-dim);
  font: 800 10px/1 var(--font-caps);
  letter-spacing: .16em;
  text-transform: uppercase;
}

:is(.entry-content, .elementor-page-content) .mp-story-card .mp-story-kicker::before,
:is(.entry-content, .elementor-page-content) .mp-story-social .mp-story-kicker::before {
  width: 25px;
  height: 5px;
  border-radius: 4px;
  background: var(--goud);
  content: "";
}

:is(.entry-content, .elementor-page-content) .mp-story-card h3 {
  max-width: 22ch;
  margin: 0 0 12px;
  color: var(--ink);
  font: 800 clamp(1.65rem, 3.2vw, 2.25rem)/1.08 var(--font-display);
  letter-spacing: -.02em;
  text-wrap: balance;
}

:is(.entry-content, .elementor-page-content) .mp-story-card-copy {
  max-width: 65ch;
  color: var(--ink-soft);
  font-size: .98em;
  line-height: 1.62;
}

:is(.entry-content, .elementor-page-content) .mp-story-card-copy > :first-child {
  margin-top: 0;
}

:is(.entry-content, .elementor-page-content) .mp-story-card-copy > :last-child {
  margin-bottom: 0;
}

:is(.entry-content, .elementor-page-content) .mp-story-card-link {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  margin-top: 22px;
  padding: 0 13px;
  border: 1px solid currentColor;
  color: var(--ink);
  font: 800 10px/1 var(--font-caps);
  letter-spacing: .13em;
  text-decoration: none;
  text-transform: uppercase;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease;
}

:is(.entry-content, .elementor-page-content) .mp-story-card-link:hover {
  border-color: var(--goud);
  background: var(--goud);
  color: #101114;
  opacity: 1;
}

/* Elk journalistiek kadertype behoudt dezelfde basis, met een subtiel eigen signaal. */
:is(.entry-content, .elementor-page-content) .mp-story-response,
:is(.entry-content, .elementor-page-content) .mp-story-document,
:is(.entry-content, .elementor-page-content) .mp-story-map,
:is(.entry-content, .elementor-page-content) .mp-story-chart,
:is(.entry-content, .elementor-page-content) .mp-story-table {
  border-top-color: var(--lijn-2);
}

:is(.entry-content, .elementor-page-content) .mp-story-response .mp-story-kicker::before,
:is(.entry-content, .elementor-page-content) .mp-story-document .mp-story-kicker::before,
:is(.entry-content, .elementor-page-content) .mp-story-map .mp-story-kicker::before,
:is(.entry-content, .elementor-page-content) .mp-story-chart .mp-story-kicker::before,
:is(.entry-content, .elementor-page-content) .mp-story-table .mp-story-kicker::before {
  background: var(--lijn-2);
}

:is(.entry-content, .elementor-page-content) .mp-story-profile,
:is(.entry-content, .elementor-page-content) .mp-story-related {
  border-top-color: var(--lijn-3);
}

:is(.entry-content, .elementor-page-content) .mp-story-profile .mp-story-kicker::before,
:is(.entry-content, .elementor-page-content) .mp-story-related .mp-story-kicker::before {
  background: var(--lijn-3);
}

:is(.entry-content, .elementor-page-content) .mp-story-newsletter,
:is(.entry-content, .elementor-page-content) .mp-story-cta {
  border-top-color: var(--goud);
  background: color-mix(in srgb, var(--goud) 12%, var(--vlak));
}

:is(.entry-content, .elementor-page-content) .mp-story-video,
:is(.entry-content, .elementor-page-content) .mp-story-audio {
  border-top-color: var(--lijn-4);
}

:is(.entry-content, .elementor-page-content) .mp-story-video .mp-story-kicker::before,
:is(.entry-content, .elementor-page-content) .mp-story-audio .mp-story-kicker::before {
  background: var(--lijn-4);
}

:is(.entry-content, .elementor-page-content) .mp-story-embed {
  display: grid;
  min-height: 150px;
  margin: 20px 0;
  padding: 20px;
  place-items: center;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--lijn-4) 20%, transparent), transparent 58%),
    var(--nacht);
}

:is(.entry-content, .elementor-page-content) .mp-story-embed a {
  color: var(--ink);
  font: 800 11px/1 var(--font-caps);
  letter-spacing: .12em;
  text-decoration: none;
  text-transform: uppercase;
}

:is(.entry-content, .elementor-page-content) .mp-story-embed iframe {
  display: block;
  width: 100%;
  min-height: min(62vw, 520px);
  border: 0;
  background: #fff;
}

:is(.entry-content, .elementor-page-content) .mp-story-flourish {
  display: block;
  min-height: 260px;
  padding: 0;
}

:is(.entry-content, .elementor-page-content) .mp-story-flourish .flourish-embed {
  width: 100%;
  min-height: 260px;
}

:is(.entry-content, .elementor-page-content) .mp-story-table-wrap {
  max-width: 100%;
  margin: 20px 0;
  overflow-x: auto;
  border: 1px solid var(--rule);
}

:is(.entry-content, .elementor-page-content) .mp-story-data-table {
  width: 100%;
  min-width: 440px;
  border-collapse: collapse;
  color: var(--ink);
  font: 500 .92rem/1.45 var(--font-lees);
}

:is(.entry-content, .elementor-page-content) .mp-story-data-table th,
:is(.entry-content, .elementor-page-content) .mp-story-data-table td {
  padding: .78rem .92rem;
  border-right: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  text-align: left;
  vertical-align: top;
}

:is(.entry-content, .elementor-page-content) .mp-story-data-table th {
  color: var(--ink);
  background: color-mix(in srgb, var(--lijn-2) 12%, var(--vlak));
  font: 800 10px/1.2 var(--font-caps);
  letter-spacing: .1em;
  text-transform: uppercase;
}

:is(.entry-content, .elementor-page-content) .mp-story-data-table tr:last-child td { border-bottom: 0; }
:is(.entry-content, .elementor-page-content) .mp-story-data-table th:last-child,
:is(.entry-content, .elementor-page-content) .mp-story-data-table td:last-child { border-right: 0; }

:is(.entry-content, .elementor-page-content) .mp-story-audio audio {
  display: block;
  width: 100%;
  margin: 20px 0 4px;
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline {
  position: relative;
  margin: clamp(2.2rem, 5vw, 4rem) 0;
  padding: clamp(1.25rem, 3vw, 2rem) 0 0;
  border-top: 1px solid var(--rule);
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline > h3 {
  margin: 0 0 1.5rem;
  color: var(--ink);
  font: 800 clamp(1.7rem, 3vw, 2.35rem)/1.05 var(--font-display);
  letter-spacing: -.025em;
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline > article {
  position: relative;
  display: grid;
  grid-template-columns: 106px minmax(0, 1fr);
  gap: 22px;
  padding: 0 0 1.6rem 27px;
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline > article::before {
  position: absolute;
  top: 4px;
  bottom: -4px;
  left: 4px;
  width: 2px;
  background: var(--rule);
  content: "";
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline > article::after {
  position: absolute;
  top: 2px;
  left: 0;
  width: 10px;
  height: 10px;
  border: 3px solid var(--nacht);
  border-radius: 50%;
  background: var(--lijn-2);
  box-shadow: 0 0 0 1px var(--lijn-2);
  content: "";
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline > article:last-child::before {
  bottom: calc(100% - 12px);
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline time {
  display: block;
  padding-top: 1px;
  color: var(--ink-dim);
  font: 800 10px/1.35 var(--font-caps);
  letter-spacing: .13em;
  text-transform: uppercase;
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline h4 {
  margin: 0 0 5px;
  color: var(--ink);
  font: 800 1.12rem/1.2 var(--font-display);
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline article p {
  margin: 0 0 .75em;
  color: var(--ink-soft);
  line-height: 1.58;
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline-source {
  display: inline-block;
  margin-top: 5px;
  color: var(--ink-dim);
  font: 800 9px/1.3 var(--font-caps);
  letter-spacing: .1em;
  text-decoration: underline;
  text-transform: uppercase;
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline.is-live {
  border-top-color: color-mix(in srgb, var(--live) 70%, var(--rule));
}

:is(.entry-content, .elementor-page-content) .mp-story-timeline.is-live > article:first-of-type::after {
  background: var(--live);
  box-shadow: 0 0 0 1px var(--live), 0 0 0 7px color-mix(in srgb, var(--live) 17%, transparent);
}

:is(.entry-content, .elementor-page-content) .mp-story-social {
  margin: clamp(2rem, 5vw, 3.3rem) 0;
  padding: clamp(1.15rem, 3vw, 1.75rem);
  border: 1px solid var(--rule);
  border-left: 4px solid var(--lijn-5);
  background: transparent;
  color: var(--ink-soft);
  font-size: .94em;
  line-height: 1.58;
}

:is(.entry-content, .elementor-page-content) .mp-story-social .mp-story-kicker::before {
  background: var(--lijn-5);
}

:is(.entry-content, .elementor-page-content) .mp-story-social > div > :first-child {
  margin-top: 0;
}

:is(.entry-content, .elementor-page-content) .mp-story-social > div > :last-child {
  margin-bottom: 0;
}

/* Volledig uitgewerkte onderzoeksblokken: elk blok heeft een vaste rol voor
   bewijs, wederhoor, vervolg of distributie en vraagt geen handmatige styling. */
:is(.entry-content, .elementor-page-content) .mp-story-fact-value {
  display: block;
  max-width: 18ch;
  margin: 18px 0;
  color: var(--ink);
  font: 900 clamp(2.1rem, 5.6vw, 4.2rem)/.94 var(--font-display);
  letter-spacing: -.045em;
  text-wrap: balance;
}

:is(.entry-content, .elementor-page-content) .mp-story-card-meta {
  margin: -2px 0 16px;
  color: var(--ink-dim);
  font: 800 10px/1.35 var(--font-caps);
  letter-spacing: .12em;
  text-transform: uppercase;
}

:is(.entry-content, .elementor-page-content) .mp-story-profile {
  display: flow-root;
}

:is(.entry-content, .elementor-page-content) .mp-story-profile-image {
  float: right;
  width: clamp(82px, 16vw, 132px);
  aspect-ratio: 1;
  margin: 0 0 18px 22px;
  border-radius: 50%;
  object-fit: cover;
}

:is(.entry-content, .elementor-page-content) .mp-story-related-image {
  width: 100%;
  max-height: 340px;
  margin: 4px 0 20px;
  object-fit: cover;
}

:is(.entry-content, .elementor-page-content) .mp-story-newsletter-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  margin-top: 22px;
}

:is(.entry-content, .elementor-page-content) .mp-story-newsletter-form input[type="email"] {
  min-width: 0;
  padding: 12px 13px;
  border: 1px solid var(--rule);
  border-radius: 0;
  color: var(--ink);
  background: var(--achtergrond, #fffdf8);
  font: 400 1rem/1.2 var(--font-lees);
}

:is(.entry-content, .elementor-page-content) .mp-story-newsletter-form button {
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid var(--goud);
  border-radius: 0;
  color: #111216;
  background: var(--goud);
  font: 800 10px/1 var(--font-caps);
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}

:is(.entry-content, .elementor-page-content) .mp-story-newsletter-form button:hover {
  border-color: var(--ink);
  color: var(--vlak);
  background: var(--ink);
}

:is(.entry-content, .elementor-page-content) .mp-honeypot {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
}

:is(.entry-content, .elementor-page-content) .mp-story-oembed {
  margin: 22px 0;
}

:is(.entry-content, .elementor-page-content) .mp-story-oembed iframe {
  display: block;
  width: 100%;
  min-height: min(54vw, 520px);
  border: 0;
}

@media (max-width: 640px) {
  :is(.entry-content, .elementor-page-content) .mp-story-gallery {
    grid-template-columns: 1fr;
  }

  :is(.entry-content, .elementor-page-content) .mp-story-gallery .mp-story-image:first-child:nth-last-child(3) {
    grid-column: auto;
  }

  :is(.entry-content, .elementor-page-content) .mp-story-gallery .mp-story-image img,
  :is(.entry-content, .elementor-page-content) .mp-story-gallery .mp-story-image:first-child:nth-last-child(3) img {
    min-height: 0;
    aspect-ratio: 16 / 10;
  }

  :is(.entry-content, .elementor-page-content) .mp-story-image figcaption {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  :is(.entry-content, .elementor-page-content) .mp-story-image figcaption span {
    white-space: normal;
  }

  :is(.entry-content, .elementor-page-content) .mp-story-quote {
    padding-left: 1.25rem;
  }

  :is(.entry-content, .elementor-page-content) .mp-story-quote > span {
    left: 1.25rem;
  }

  :is(.entry-content, .elementor-page-content) .mp-story-timeline > article {
    grid-template-columns: 1fr;
    gap: 8px;
    padding-left: 23px;
  }

  :is(.entry-content, .elementor-page-content) .mp-story-newsletter-form {
    grid-template-columns: 1fr;
  }

  :is(.entry-content, .elementor-page-content) .mp-story-profile-image {
    width: 76px;
    margin-left: 15px;
  }
}

@media (prefers-reduced-motion: reduce) {
  :is(.entry-content, .elementor-page-content) .mp-story-card-link {
    transition: none;
  }
}

/* Research-first companion blocks. The schema stays fixed in Studio; these
   styles let sources, corrections, comparisons and reader routes remain
   legible without turning a story into a generic page builder. */
:is(.entry-content, .elementor-page-content) .mp-story-lead-block { max-width:740px; margin:0 auto 38px; color:#172133; font:600 clamp(23px,2.7vw,33px)/1.28 Newsreader,Georgia,serif; }
:is(.entry-content, .elementor-page-content) .mp-story-research { max-width:820px; margin:38px auto; padding:26px 28px; border:1px solid rgba(16,18,22,.16); background:#f8f6f0; }:is(.entry-content, .elementor-page-content) .mp-story-research h3 { margin:7px 0 14px; color:#111216; font:800 clamp(26px,3.1vw,40px)/.98 var(--font-display); letter-spacing:-.04em; }:is(.entry-content, .elementor-page-content) .mp-story-research ul { display:grid; gap:13px; margin:20px 0 0; padding:0; list-style:none; }:is(.entry-content, .elementor-page-content) .mp-story-research li { display:grid; grid-template-columns:minmax(74px,.28fr) 1fr; gap:13px; padding-top:13px; border-top:1px solid rgba(17,18,22,.14); }:is(.entry-content, .elementor-page-content) .mp-story-research li>span { color:#526171; font:800 10px Archivo,Arial,sans-serif; letter-spacing:.08em; text-transform:uppercase; }:is(.entry-content, .elementor-page-content) .mp-story-research li b { display:block; color:#17181c; font:800 18px/1.08 var(--font-display); }:is(.entry-content, .elementor-page-content) .mp-story-research li p { margin:5px 0 0; color:#3d3e43; font:17px/1.4 Newsreader,Georgia,serif; }:is(.entry-content, .elementor-page-content) .mp-story-research li a,:is(.entry-content, .elementor-page-content) .mp-story-research details a { display:inline-block; margin-top:7px; color:#1c4e8a; font:800 10px Archivo,Arial,sans-serif; letter-spacing:.05em; text-decoration:none; text-transform:uppercase; }:is(.entry-content, .elementor-page-content) .mp-story-research details { padding:14px 0; border-top:1px solid rgba(17,18,22,.14); }:is(.entry-content, .elementor-page-content) .mp-story-research details summary { color:#17181c; font:800 19px/1.15 var(--font-display); cursor:pointer; }:is(.entry-content, .elementor-page-content) .mp-story-research details div { margin-top:10px; color:#3d3e43; font:17px/1.45 Newsreader,Georgia,serif; }:is(.entry-content, .elementor-page-content) .mp-story-research--sources { background:#eef3f9; }:is(.entry-content, .elementor-page-content) .mp-story-research--methodology,:is(.entry-content, .elementor-page-content) .mp-story-research--correction { border-left:5px solid #f6bc26; }:is(.entry-content, .elementor-page-content) .mp-story-research--factcheck { background:#fff6da; }:is(.entry-content, .elementor-page-content) .mp-story-research--network li { grid-template-columns:1fr; }:is(.entry-content, .elementor-page-content) .mp-story-research--network li>span { color:#b25922; }
:is(.entry-content, .elementor-page-content) .mp-story-before-after { max-width:1000px; margin:45px auto; }:is(.entry-content, .elementor-page-content) .mp-story-before-after>h3 { margin:8px 0 20px; color:#111216; font:800 clamp(29px,3.4vw,48px)/.98 var(--font-display); letter-spacing:-.04em; }:is(.entry-content, .elementor-page-content) .mp-story-before-after>div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }:is(.entry-content, .elementor-page-content) .mp-story-before-after figure { position:relative; margin:0; }:is(.entry-content, .elementor-page-content) .mp-story-before-after figure>span { position:absolute; z-index:2; top:12px; left:12px; padding:6px 8px; color:#111216; background:#f6bc26; font:800 9px Archivo,Arial,sans-serif; letter-spacing:.08em; text-transform:uppercase; }:is(.entry-content, .elementor-page-content) .mp-story-before-after .mp-story-image { margin:0; }:is(.entry-content, .elementor-page-content) .mp-story-before-after img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; }:is(.entry-content, .elementor-page-content) .mp-story-before-after>p { margin:12px 0 0; color:#4b4c51; font:18px/1.4 Newsreader,Georgia,serif; }:is(.entry-content, .elementor-page-content) .mp-story-before-after-stage{position:relative!important;display:block!important;isolation:isolate;overflow:hidden;aspect-ratio:16/9;background:#222}:is(.entry-content, .elementor-page-content) .mp-story-before-after-stage>img,:is(.entry-content, .elementor-page-content) .mp-story-before-after-before img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover}:is(.entry-content, .elementor-page-content) .mp-story-before-after-before{position:absolute;z-index:2;inset:0 auto 0 0;width:50%;overflow:hidden;border-right:3px solid #f6bc26}:is(.entry-content, .elementor-page-content) .mp-story-before-after-before img{width:auto;min-width:100%;max-width:none}:is(.entry-content, .elementor-page-content) .mp-story-before-after-label{position:absolute;z-index:4;top:12px;padding:6px 9px;color:#111216;background:#f6bc26;font:800 9px/1 Archivo,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase}:is(.entry-content, .elementor-page-content) .mp-story-before-after-label.is-before{left:12px}:is(.entry-content, .elementor-page-content) .mp-story-before-after-label.is-after{right:12px;background:#fff}:is(.entry-content, .elementor-page-content) .mp-story-before-after-range{position:absolute;z-index:5;right:18px;bottom:18px;left:18px;width:calc(100% - 36px);margin:0;accent-color:#f6bc26;cursor:ew-resize}:is(.entry-content, .elementor-page-content) .mp-story-before-after-caption{display:grid;gap:3px;margin-top:9px!important;color:#62645f!important;font-size:13px!important}:is(.entry-content, .elementor-page-content) .mp-story-before-after-caption span{font:700 9px/1.3 Archivo,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase}
@media (max-width:640px) { :is(.entry-content, .elementor-page-content) .mp-story-research { margin:28px auto; padding:20px; }:is(.entry-content, .elementor-page-content) .mp-story-research li { grid-template-columns:1fr; gap:5px; }:is(.entry-content, .elementor-page-content) .mp-story-before-after>div { grid-template-columns:1fr; } }

/* Public interaction for the fixed poll and transparent input × factor calculator. */
:is(.entry-content, .elementor-page-content) .mp-story-poll-form{margin-top:20px}:is(.entry-content, .elementor-page-content) .mp-story-poll-form fieldset{display:grid;gap:10px;margin:0;padding:0;border:0}:is(.entry-content, .elementor-page-content) .mp-story-poll-option{display:grid;gap:7px;padding:12px 13px;border:1px solid rgba(16,18,22,.2);border-radius:6px;cursor:pointer}:is(.entry-content, .elementor-page-content) .mp-story-poll-option>span{color:#121316;font:800 15px/1.3 Archivo,Arial,sans-serif}:is(.entry-content, .elementor-page-content) .mp-story-poll-option input{margin-right:8px;accent-color:#f6bc26}:is(.entry-content, .elementor-page-content) .mp-story-poll-option em{position:relative;display:block;height:21px;overflow:hidden;border-radius:3px;background:#e7e3da;font-style:normal}:is(.entry-content, .elementor-page-content) .mp-story-poll-option em b{display:block;height:100%;background:#f6bc26;transition:width .2s ease}:is(.entry-content, .elementor-page-content) .mp-story-poll-option em small{position:absolute;inset:0 7px;display:flex;align-items:center;color:#111216;font:800 10px/1 Archivo,Arial,sans-serif}:is(.entry-content, .elementor-page-content) .mp-story-poll-form button{margin-top:13px;padding:11px 17px;border:0;background:#f6bc26;color:#111216;font:800 11px/1 Archivo,Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}:is(.entry-content, .elementor-page-content) .mp-story-poll-total{margin:10px 0 0;color:#62645f;font:600 12px/1.4 Archivo,Arial,sans-serif}:is(.entry-content, .elementor-page-content) .mp-story-poll-status{margin:14px 0 0;padding:10px 12px;border-left:4px solid #009952;background:#e5f1e9;color:#143421;font:700 13px/1.4 Archivo,Arial,sans-serif}:is(.entry-content, .elementor-page-content) .mp-story-poll-status.is-error{border-color:#d82233;background:#f9e5e7;color:#65151d}:is(.entry-content, .elementor-page-content) .mp-story-calculator-input{display:flex;flex-direction:column;gap:6px;margin:18px 0}:is(.entry-content, .elementor-page-content) .mp-story-calculator-input span{font:800 10px/1 Archivo,Arial,sans-serif;letter-spacing:.07em;text-transform:uppercase}:is(.entry-content, .elementor-page-content) .mp-story-calculator-input input{max-width:240px;padding:11px;border:1px solid rgba(16,18,22,.35);border-radius:4px;background:#fff;color:#111216;font:700 17px/1.2 Archivo,Arial,sans-serif}:is(.entry-content, .elementor-page-content) .mp-story-calculator-result{display:flex;flex-direction:column;gap:4px;margin:18px 0}:is(.entry-content, .elementor-page-content) .mp-story-calculator-result strong{color:#111216;font:700 clamp(28px,4vw,45px)/1 var(--font-display)}:is(.entry-content, .elementor-page-content) .mp-story-calculator-result small{color:#62645f;font:600 12px/1.4 Archivo,Arial,sans-serif}
