/* Golvvisualisering CTA popup. Values verbatim from design/Golvvisualisering Popup.dc.html.
   Depends on the theme's ig-base cascade for .ig-eyebrow and .ig-btn--cta. */

.igv-popup { position: fixed; inset: 0; z-index: 85; display: flex; align-items: center; justify-content: center; padding: 40px 20px; }
.igv-popup[hidden] { display: none; }
.igv-popup__overlay { position: absolute; inset: 0; background: rgba(20, 33, 43, 0.6); }
.igv-popup__dialog { position: relative; background: #fff; max-width: 760px; width: 100%; border-top: 4px solid #F6C324; display: grid; grid-template-columns: 1fr 240px; gap: 32px; padding: 40px 44px; box-shadow: 0 18px 40px rgba(20, 33, 43, 0.14); }
.igv-popup__dialog--noimg { grid-template-columns: 1fr; }
.igv-popup__close { position: absolute; top: 10px; right: 10px; width: 44px; height: 44px; background: none; border: 0; cursor: pointer; font-size: 26px; line-height: 1; color: #5B6874; }
.igv-popup__close:hover { color: #14212B; background: #F2F0EB; }
.igv-popup__body { display: flex; flex-direction: column; gap: 16px; }
.igv-popup__title { font-size: clamp(24px, 2.6vw, 32px); line-height: 1.15; font-weight: 700; letter-spacing: -0.015em; margin: 0; }
.igv-popup__text { margin: 0; font-size: 17px; line-height: 1.6; color: #5B6874; }
.igv-popup__actions { display: flex; flex-wrap: wrap; gap: 12px 22px; align-items: center; margin-top: 6px; }
.igv-popup__cta { min-height: 52px; padding: 12px 26px; font-size: 16px; }
.igv-popup__dismiss { background: none; border: 0; cursor: pointer; min-height: 44px; padding: 0; font-family: 'Archivo', 'Archivo Fallback', system-ui, sans-serif; font-weight: 600; font-size: 15px; color: #5B6874; border-bottom: 1px solid #C6CBD1; }
.igv-popup__dismiss:hover { color: #14212B; }
.igv-popup__img { width: 100%; height: 100%; min-height: 220px; object-fit: cover; display: block; }

.igv-ba { position: relative; overflow: hidden; width: 100%; height: 100%; min-height: 220px; touch-action: pan-y; }
.igv-ba__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.igv-ba__after { position: absolute; inset: 0; clip-path: inset(0 0 0 var(--igv-ba-pos)); }
.igv-ba__line { position: absolute; top: 0; bottom: 0; left: var(--igv-ba-pos); width: 2px; margin-left: -1px; background: #fff; box-shadow: 0 0 0 1px rgba(20, 33, 43, 0.18);pointer-events: none; }
.igv-ba__line::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 40px; height: 40px; border-radius: 50%; background: #F6C324; box-shadow: 0 2px 8px rgba(20, 33, 43, 0.35); }
.igv-ba__line::after { content: '◀▶'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 11px; letter-spacing: 1px; color: #14212B; }
.igv-ba__tag { position: absolute; pointer-events: none; bottom: 8px; padding: 4px 8px; font-family: 'Archivo', 'Archivo Fallback', system-ui, sans-serif; font-size: 11px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: #fff; background: rgba(20, 33, 43, 0.72); }
.igv-ba__tag--before { left: 8px; }
.igv-ba__tag--after { right: 8px; }
.igv-ba__range { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; touch-action: pan-y; -webkit-appearance: none; appearance: none; }
.igv-ba__range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 44px; height: 100%; background: transparent; cursor: ew-resize; }
.igv-ba__range::-moz-range-thumb { width: 44px; height: 100%; background: transparent; border: 0; cursor: ew-resize; }
.igv-ba__range:focus-visible ~ .igv-ba__line { outline: 3px solid #0E3358; }

body.igv-popup-open { overflow: hidden; }

@media (max-width: 760px) {
  .igv-popup__dialog { grid-template-columns: 1fr; padding: 32px 22px 26px; max-height: calc(100dvh - 40px); overflow-y: auto; }
  /* the stacked slider sits under the close button, so only that variant needs the extra top room */
  .igv-popup__dialog--ba { padding-top: 60px; }
  .igv-popup__img { display: none; }
  .igv-ba { order: -1; height: auto; min-height: 0; aspect-ratio: 3 / 2; }
}