/* WPFlow Base - home page slideshow. Colours come from the site theme (--accent / --amber), with fallbacks.
   The banners are never cropped: every slide is shown at the full width with its own height (slides stacked in one grid cell). */
.wpf-slides { --wpf-sl-accent: var(--wpf-slide-accent, var(--amber, var(--accent, #d40e14))); --wpf-sl-ink: var(--wpf-slide-ink, #fff);
  position: relative; display: grid; overflow: hidden; background: #1d2227; width: 100%; }
.wpf-slide { grid-area: 1 / 1; position: relative; visibility: hidden; align-self: center; overflow: hidden; }
.wpf-slide.on { visibility: visible; z-index: 2; }
.wpf-slide.prev { visibility: visible; z-index: 1; }
/* the new banner sweeps in from the left behind a wavy edge; the picture breathes slowly while it is shown */
.wpf-slide.on.go { animation: wpfWave 1.25s cubic-bezier(.45,.05,.25,1) both; }
.wpf-slide.on.go .wpf-slide-cap { animation: wpfCap .7s ease .55s both; }
.wpf-slide img { display: block; width: 100%; height: auto; max-height: 80vh; object-fit: contain; margin: 0 auto; }
.wpf-slide.on img { animation: wpfBreathe 9s ease-out both; }
@keyframes wpfCap { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes wpfBreathe { from { transform: scale(1.035); } to { transform: scale(1); } }
@keyframes wpfWave { from { clip-path: polygon(0% 0%, -12.00% 0.00%, -10.00% 4.17%, -8.54% 8.33%, -8.00% 12.50%, -8.54% 16.67%, -10.00% 20.83%, -12.00% 25.00%, -14.00% 29.17%, -15.46% 33.33%, -16.00% 37.50%, -15.46% 41.67%, -14.00% 45.83%, -12.00% 50.00%, -10.00% 54.17%, -8.54% 58.33%, -8.00% 62.50%, -8.54% 66.67%, -10.00% 70.83%, -12.00% 75.00%, -14.00% 79.17%, -15.46% 83.33%, -16.00% 87.50%, -15.46% 91.67%, -14.00% 95.83%, -12.00% 100.00%, 0% 100%); } to { clip-path: polygon(0% 0%, 112.00% 0.00%, 114.00% 4.17%, 115.46% 8.33%, 116.00% 12.50%, 115.46% 16.67%, 114.00% 20.83%, 112.00% 25.00%, 110.00% 29.17%, 108.54% 33.33%, 108.00% 37.50%, 108.54% 41.67%, 110.00% 45.83%, 112.00% 50.00%, 114.00% 54.17%, 115.46% 58.33%, 116.00% 62.50%, 115.46% 66.67%, 114.00% 70.83%, 112.00% 75.00%, 110.00% 79.17%, 108.54% 83.33%, 108.00% 87.50%, 108.54% 91.67%, 110.00% 95.83%, 112.00% 100.00%, 0% 100%); } }
.wpf-slide-link { position: absolute; inset: 0; z-index: 2; }
.wpf-slide-cap { position: absolute; z-index: 3; left: 0; right: 0; bottom: 0; padding: 28px max(20px, calc((100% - 1200px) / 2)) 52px;
  background: linear-gradient(to top, rgba(0,0,0,.62), rgba(0,0,0,0)); color: #fff; }
.wpf-slide-cap h2 { margin: 0 0 6px; font-size: clamp(22px, 3.2vw, 44px); line-height: 1.1; color: #fff; max-width: 820px; }
.wpf-slide-cap p { margin: 0 0 14px; font-size: clamp(14px, 1.4vw, 19px); max-width: 680px; color: rgba(255,255,255,.92); }
.wpf-slide-btn { display: inline-block; background: var(--wpf-sl-accent); color: var(--wpf-sl-ink) !important; font-weight: 700; padding: 11px 22px; border-radius: 2px; text-decoration: none !important; }
.wpf-slide-btn:hover { filter: brightness(1.08); }
.wpf-slides-dots { position: absolute; z-index: 4; left: 0; right: 0; bottom: 14px; display: flex; justify-content: center; gap: 10px; }
.wpf-slides-dots button { width: 12px; height: 12px; border-radius: 50%; border: 2px solid rgba(0,0,0,.25); padding: 0; background: rgba(255,255,255,.85); cursor: pointer; background-clip: padding-box; }
.wpf-slides-dots button.on { background: var(--wpf-sl-accent); }
.wpf-slides-prev, .wpf-slides-next { position: absolute; z-index: 4; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border: 0; border-radius: 50%;
  background: rgba(0,0,0,.45); color: #fff; font-size: 26px; line-height: 42px; cursor: pointer; padding: 0; }
.wpf-slides-prev { left: 14px; } .wpf-slides-next { right: 14px; }
.wpf-slides-prev:hover, .wpf-slides-next:hover { background: rgba(0,0,0,.7); }
.wpf-slides button:focus-visible, .wpf-slide-btn:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
@media (max-width: 700px) {
  .wpf-slides-prev, .wpf-slides-next { display: none; }
  /* phones: the text goes under the picture, the banner itself stays whole */
  .wpf-slide-cap { position: static; background: #1d2227; padding: 14px 20px 40px; }
  .wpf-slides-dots { bottom: 12px; }
}
@media (prefers-reduced-motion: reduce) { .wpf-slide.on.go, .wpf-slide.on.go .wpf-slide-cap, .wpf-slide.on img { animation: none; } }