.wpf-slider{
    position:relative;
    overflow:hidden
}

.wpf-track{
    display:flex;
    transition:transform .5s ease;
    position: relative;
    z-index: 2;
}

.wpf-slide{
    min-width:100%;
    flex:0 0 100%;
    position:relative
}

.wpf-slide img{
    display:block;
    width:100%;
    height:auto
}

.wpf-embed{
    position:relative;
    padding-top:56.25%
}

.wpf-embed iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    border:0
}

.wpf-video{
    width:100%;
    height:auto;
    display:block
}

.wpf-prev,.wpf-next{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    background:rgba(0,0,0,.4);
    color:#fff;
    border:0;
    padding:.5rem .75rem;
    cursor:pointer;
    z-index: 3;
}

.wpf-prev{
    left:.5rem
}

.wpf-next{
    right:.5rem
}

/* Pagination dots – hard reset so theme styles don't leak in */
.wpf-slider .wpf-dots{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    bottom:14px;
    display:flex;
    gap:10px;
    z-index:6;               /* above video & overlay */
}

.wpf-slider .wpf-dots button{
    all: unset;              /* nuke inherited button styles */
    width:12px;
    height:12px;
    border-radius:50%;
    background:rgba(255,255,255,.55);
    border:1px solid rgba(0,0,0,.25);
    display:block;
    cursor:pointer;
    box-shadow:none;
    line-height:0;
}

.wpf-slider .wpf-dots button[aria-selected="true"]{
    background:#fff;
    border-color:rgba(0,0,0,.35);
}

.wpf-slider .wpf-dots button:hover{
    background:rgba(255,255,255,.8);
}

.wpf-slider .wpf-dots button:focus-visible{
    outline:2px solid #fff;
    outline-offset:2px;
}

/* Slightly larger tap target on touch devices */
@media (pointer: coarse){
    .wpf-slider .wpf-dots button{ width:14px; height:14px; }
}

/* Slide as hero */
.wpf-slide{
    position:relative;
    min-height:420px;
    display:block
}
.wpf-bg,
.wpf-dark-overlay{
    position:absolute;
    inset:0;
}
.wpf-bg-image{
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat
}
.wpf-bg-video,
.wpf-bg-iframe{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    border:0;
}
.wpf-dark-overlay{
    background:rgba(0,0,0,.45);
    pointer-events:none
}

/* Overlay content block */
.wpf-content{position:absolute;inset:0;display:flex;flex-direction:column;gap:.75rem;padding:clamp(16px,4vw,48px)}
/* horizontal align */
.align-left  .wpf-content{align-items:flex-start; text-align:left}
.align-center.wpf-content, .align-center .wpf-content{align-items:center;text-align:center}
.align-right .wpf-content{align-items:flex-end;  text-align:right}
/* vertical align */
.valign-top .wpf-content{justify-content:flex-start}
.valign-middle .wpf-content{justify-content:center}
.valign-bottom .wpf-content{justify-content:flex-end}

/* Text theme */
.text-light .wpf-title, .text-light .wpf-text, .text-light .wpf-btn {
    color:#fff
}

.text-dark  .wpf-title, .text-dark  .wpf-text, .text-dark  .wpf-btn
{
    color: #d63494;
}

.wpf-slider { position: relative; }
.wpf-slide  { min-height: 460px; }

/* Title / text / button */
.wpf-title{
    font-size:clamp(28px,4.6vw,52px);
    line-height:1.1;
    margin:0;
    color: #d63494;
}

.wpf-text{
    max-width:68ch
}

.wpf-text{
    max-width:68ch
}

.wpf-btn{
    display:inline-block;
    padding:.7rem 1.1rem;
    border:2px solid #d63494;
    text-decoration:none;
    border-radius:999px;
    transition:.2s
}

.wpf-btn:hover{
    transform:translateY(-1px);
    background-color: #d63494;
}

/** text-expo-big-white **/
.text-expo-big-white .wpf-title {
    color: #fff;
    font-size: 3.2em;
}

.text-expo-big-white .wpf-text {
    margin-top: 20px;
    font-size: 23px;
    line-height: 32px;
    color: #fff;
}

.text-expo-big-white .wpf-text p {
    font-size: 23px;
    line-height: 32px;
    color: #fff;
}