@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap');

.pk-wyg,
.pk-wyg *{
    box-sizing:border-box;
}

.pk-wyg{
    --pk-orange:#f47a18;
    --pk-text:#171717;
    --pk-muted:#6f6f74;
    width:100%;
    padding:70px 20px;
    background:#fff;
    font-family:"Outfit",sans-serif;
    color:var(--pk-text);
}

.pk-wyg__inner{
    width:min(1180px,100%);
    margin:0 auto;
}

.pk-wyg__top{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:30px;
    margin-bottom:34px;
}

.pk-wyg__heading-wrap{
    max-width:860px;
}

.pk-wyg__eyebrow{
    margin:0 0 4px;
    font-size:18px;
    line-height:1.2;
    font-weight:400;
    letter-spacing:.01em;
    color:#111;
}

.pk-wyg__heading{
    margin:0;
    font-size:50px;
    line-height:1;
    font-weight:600;
    letter-spacing:-.04em;
    color:#232329;
}

.pk-wyg__heading span{
    color:var(--pk-orange);
}

.pk-wyg__intro{
    margin:14px 0 0;
    font-size:18px;
    line-height:1.5;
    font-weight:400;
    color:#242429;
}

.pk-wyg__arrows{
    display:flex;
    align-items:center;
    gap:10px;
    flex:0 0 auto;
}

.pk-wyg__arrow{
    width:48px;
    height:48px;
    padding:0;
    border:1px solid #d9d9dc;
    border-radius:50%;
    background:#fff;
    display:grid;
    place-items:center;
    cursor:pointer;
    transition:transform .25s ease, background .25s ease, border-color .25s ease;
}

.pk-wyg__arrow:hover{
    transform:translateY(-2px);
    background:#f7f7f7;
    border-color:#bcbcc1;
}

.pk-wyg__arrow svg{
    width:20px;
    height:20px;
    fill:none;
    stroke:#1d1d20;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.pk-wyg__viewport{
    overflow:hidden;
    touch-action:pan-y;
}

.pk-wyg__track{
    display:flex;
    gap:18px;
    will-change:transform;
}

.pk-wyg__card{
    flex:0 0 calc((100% - 36px)/3);
    min-width:0;
}

.pk-wyg__image-wrap{
    overflow:hidden;
    border-radius:16px;
    background:#f0f0f0;
    aspect-ratio:1.62/1;
}

.pk-wyg__image-wrap img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .6s cubic-bezier(.2,.7,.2,1);
}

.pk-wyg__card:hover img{
    transform:scale(1.045);
}

.pk-wyg__card h3{
    margin:16px 0 7px;
    font-size:20px;
    line-height:1.3;
    font-weight:500;
    letter-spacing:-.015em;
    color:#18181b;
}

.pk-wyg__card p{
    margin:0;
    font-size:16px;
    line-height:1.48;
    font-weight:300;
    color:var(--pk-muted);
}

@media (max-width: 991px){
    .pk-wyg{
        padding:56px 20px;
    }

    .pk-wyg__heading{
        font-size:42px;
    }

    .pk-wyg__card{
        flex-basis:calc((100% - 18px)/2);
    }
}

@media (max-width: 640px){
    .pk-wyg{
        padding:44px 16px;
    }

    .pk-wyg__top{
        align-items:center;
        margin-bottom:26px;
    }

    .pk-wyg__eyebrow{
        font-size:15px;
    }

    .pk-wyg__heading{
        font-size:36px;
        line-height:1.04;
    }

    .pk-wyg__intro{
        font-size:16px;
    }

    .pk-wyg__arrow{
        width:42px;
        height:42px;
    }

    .pk-wyg__card{
        flex-basis:100%;
    }

    .pk-wyg__card h3{
        font-size:19px;
    }

    .pk-wyg__card p{
        font-size:15px;
    }
}

@media (prefers-reduced-motion:reduce){
    .pk-wyg__track,
    .pk-wyg__image-wrap img,
    .pk-wyg__arrow{
        transition:none !important;
    }
}
