\
.fpc-badge{
    --fpc-bg:#eef1f5;
    --fpc-color:#0f172a;
    --fpc-border-color:transparent;
    --fpc-border-width:0px;
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:8px 14px;
    border-radius:999px;
    background:var(--fpc-bg);
    color:var(--fpc-color);
    border:var(--fpc-border-width) solid var(--fpc-border-color);
    font-size:18px;
    font-weight:700;
    line-height:1;
    white-space:nowrap;
}

.fpc-badge__label{
    font-size:18px;
    font-weight:700;
    line-height:1;
}

.fpt-grid{
    --fpt-gap:10px;
    --fpt-radius:16px;
    --fpt-hover-bg:rgba(15,23,42,0.82);
    --fpt-hover-color:#ffffff;
    --fpt-border-color:transparent;
    --fpt-border-width:0px;
    gap:var(--fpt-gap);
}

.fpt-grid--grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
}

.fpt-grid--stacked{
    display:grid;
    grid-template-columns:1.35fr 1fr;
    grid-template-rows:repeat(2, minmax(0, 1fr));
}

.fpt-grid--stacked[data-count="1"]{
    grid-template-columns:1fr;
    grid-template-rows:1fr;
}

.fpt-grid--stacked[data-count="2"]{
    grid-template-columns:1fr 1fr;
    grid-template-rows:1fr;
}

.fpt-grid--stacked .fpt-item--1{
    grid-column:1;
    grid-row:1 / span 2;
}

.fpt-grid--stacked .fpt-item--2{
    grid-column:2;
    grid-row:1;
}

.fpt-grid--stacked .fpt-item--3{
    grid-column:2;
    grid-row:2;
}

.fpt-grid--stacked[data-count="1"] .fpt-item--1{
    grid-column:1;
    grid-row:1;
}

.fpt-grid--stacked[data-count="2"] .fpt-item--1{
    grid-column:1;
    grid-row:1;
}

.fpt-grid--stacked[data-count="2"] .fpt-item--2{
    grid-column:2;
    grid-row:1;
}

.fpt-item{
    position:relative;
    display:block;
    width:100%;
    min-width:0;
    text-decoration:none;
    overflow:hidden;
    border-radius:var(--fpt-radius);
    background:#eef1f5;
    border:var(--fpt-border-width) solid var(--fpt-border-color);
    aspect-ratio:1 / 1;
    min-height:0;
}

.fpt-item__image,
.fpt-item__placeholder{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    background:#dfe5ec;
}

.fpt-item__overlay{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:12px;
    background:var(--fpt-hover-bg);
    color:var(--fpt-hover-color);
    opacity:0;
    transition:opacity .2s ease;
    text-align:center;
}

.fpt-item:hover .fpt-item__overlay,
.fpt-item:focus .fpt-item__overlay,
.fpt-item:focus-visible .fpt-item__overlay{
    opacity:1;
}

.fpt-item__title{
    font-size:13px;
    font-weight:700;
    line-height:1.35;
    color:var(--fpt-hover-color);
}

.fpt-empty{
    font-size:14px;
    color:#475569;
}

@media (max-width: 480px){
    .fpt-grid--grid{
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }

    .fpt-grid--stacked,
    .fpt-grid--stacked[data-count="2"]{
        grid-template-columns:1fr 1fr;
        grid-template-rows:1fr 1fr;
    }

    .fpt-item__title{
        font-size:12px;
    }
}