/* Block: Voting */
.sb-voting-title {
    font-size:var(--fs-h2);
    margin-bottom:36px;
}
.sb-voting-intro {
    font-size:var(--fs-body);
    line-height:var(--lh-body);
    max-width:820px;
    margin-bottom:56px;
}

/* Countdown (Sammelphase) */
.sb-voting-countdown {
    margin-top:24px;
}
.sb-voting-countdown-grid {
    display:flex;
    gap:44px;
}
.sb-voting-countdown-grid div {
    text-align:center;
    min-width:96px;
}
.sb-voting-countdown-grid span {
    display:block;
    font-family:var(--f-display);
    font-weight:500;
    font-size:var(--fs-h2);
    line-height:1;
}
.sb-voting-countdown-grid small {
    display:block;
    margin-top:10px;
    font-size:var(--fs-small);
}
.sb-voting-countdown-label {
    margin-top:28px;
    font-size:var(--fs-small);
}

/* Grid */
.sb-voting-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:90px 110px;
}
.sb-voting-card-media {
    position:relative;
    display:block;
    overflow:hidden;
}
.sb-voting-card-media img,
.sb-voting-card-media video {
    width:100%;
    aspect-ratio:4 / 3;
    object-fit:cover;
}
.sb-voting-card-placeholder {
    display:block;
    width:100%;
    aspect-ratio:4 / 3;
    background:var(--c-gray);
}
.sb-voting-card-overlay {
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    background:var(--c-yellow);
    color:var(--c-black);
    padding:20px 22px 24px;
    font-size:17px;
    line-height:1.4;
    opacity:0;
    transform:translateY(18px);
    transition:opacity .35s ease, transform .35s ease;
}
.sb-voting-card-overlay strong {
    display:block;
    font-weight:500;
    margin-bottom:6px;
}
/* Overlay slidet mit Opacity von unten rein */
.sb-voting-card-media:hover .sb-voting-card-overlay,
.sb-voting-card-media:focus-visible .sb-voting-card-overlay {
    opacity:1;
    transform:translateY(0);
}
.sb-voting-card-title {
    font-weight:500;
    font-size:20px;
    margin:16px 0 10px;
}

/* Sterne */
.sarasin-stars {
    display:inline-flex;
    gap:9px;
    color:var(--c-gray);
}
.sarasin-stars .sarasin-star {
    width:40px;
    height:40px;
    color:var(--c-gray);
    transition:color .15s ease;
    padding:0;
}
.sarasin-stars .sarasin-star svg {
    width:100%;
    height:100%;
    display:block;
}
.sarasin-stars .sarasin-star.is-active,
.sarasin-stars .sarasin-star.is-hover {
    color:var(--c-green);
}

/* Eingefrorene Durchschnitts-Sterne: graue Basis, gruene Teilfuellung */
.sarasin-stars.is-frozen {
    position:relative;
    display:inline-block;
}
.sarasin-stars.is-frozen .sarasin-stars-base,
.sarasin-stars.is-frozen .sarasin-stars-fill {
    display:inline-flex;
    gap:9px;
    white-space:nowrap;
}
.sarasin-stars.is-frozen .sarasin-star {
    display:inline-block;
    width:40px;
    height:40px;
}
.sarasin-stars.is-frozen .sarasin-stars-base {
    color:var(--c-gray);
}
.sarasin-stars.is-frozen .sarasin-stars-fill {
    position:absolute;
    top:0;
    left:0;
    overflow:hidden;
    color:var(--c-green);
}

/* Senden + Feedback */
.sb-voting-actions {
    margin-top:72px;
    text-align:center;
}
.sarasin-vote-feedback {
    margin-top:18px;
    font-size:var(--fs-small);
    font-weight:500;
}

/* Rating auf der Objekt-Einzelseite */
.sarasin-rating-single {
    text-align:center;
    margin-top:var(--section-gap);
}
.sarasin-rating-single .sarasin-rating-title {
    font-family:var(--f-sans);
    font-weight:500;
    font-size:var(--fs-h3);
    margin-bottom:26px;
}
.sarasin-rating-single .sarasin-stars .sarasin-star {
    width:48px;
    height:48px;
}

@media only screen and (max-width:1023px) {
    .sb-voting-grid {
        gap:64px 48px;
    }
    .sarasin-stars .sarasin-star {
        width:32px;
        height:32px;
    }
}
@media only screen and (max-width:767px) {
    .sb-voting-grid {
        grid-template-columns:1fr;
        gap:48px;
    }
    .sb-voting-intro {
        margin-bottom:32px;
    }
    .sb-voting-countdown-grid {
        gap:20px;
    }
    .sb-voting-countdown-grid div {
        min-width:64px;
    }
    .sb-voting-card-overlay {
        display:none;
    }
    .sarasin-stars .sarasin-star,
    .sarasin-stars.is-frozen .sarasin-star {
        width:28px;
        height:28px;
    }
    .sb-voting-actions {
        margin-top:44px;
    }
}
