/* ============================================================
   KAZENTRO — Single Casino Review CSS
   Adauga la sfarsitul kazentro-complete.css in WP Header & Footer
   ============================================================ */

/* ── HERO REVIEW ─────────────────────────────────────────── */
.kz-review-hero {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: var(--s8);
    align-items: start;
    padding: var(--s10) 0 var(--s8);
    border-bottom: 1px solid var(--kz-border);
    margin-bottom: var(--s8);
}
.kz-review-title {
    font-family: var(--kz-head);
    font-size: clamp(24px, 4vw, 36px);
    font-weight: 900;
    color: var(--kz-text-1);
    letter-spacing: -.025em;
    line-height: 1.15;
    margin-bottom: var(--s3);
}
.kz-review-verdict {
    font-size: 17px;
    color: var(--kz-text-3);
    line-height: 1.6;
    margin-bottom: var(--s5);
    max-width: 55ch;
}
.kz-hero-bonus {
    display: flex;
    align-items: center;
    gap: var(--s2);
    font-family: var(--kz-head);
    font-size: 18px;
    font-weight: 700;
    color: var(--kz-gold);
    margin-bottom: var(--s5);
    background: var(--kz-gold-dim);
    border: 1px solid var(--kz-gold-border);
    border-radius: var(--r-md);
    padding: var(--s3) var(--s4);
    width: fit-content;
}
.kz-hero-actions { display: flex; gap: var(--s3); flex-wrap: wrap; }
.kz-review-hero__right { position: relative; }
.kz-review-screenshot {
    width: 100%;
    border-radius: var(--r-lg);
    border: 1px solid var(--kz-border);
    overflow: hidden;
}
.kz-review-screenshot img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
}
.kz-review-logo-wrap {
    position: absolute;
    bottom: -20px;
    left: 20px;
    background: var(--kz-bg-card);
    border: 2px solid var(--kz-border-md);
    border-radius: var(--r-md);
    padding: var(--s2) var(--s3);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90px;
    height: 54px;
}
.kz-review-logo { max-width: 76px; max-height: 44px; object-fit: contain; }

/* ── LAYOUT 2 COLOANE ────────────────────────────────────── */
.kz-review-layout {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: var(--s8);
    align-items: start;
    margin-top: var(--s8);
}
.kz-review-content { min-width: 0; }
.kz-review-sidebar { position: sticky; top: 80px; }

/* ── SIDEBAR CARDS ───────────────────────────────────────── */
.kz-sidebar-card {
    background: var(--kz-bg-card);
    border: 1px solid var(--kz-border);
    border-radius: var(--r-lg);
    padding: var(--s5);
}
.kz-sidebar-score {
    display: flex;
    align-items: center;
    gap: var(--s4);
}
.kz-sidebar-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--s3);
    padding: var(--s3) 0;
    border-bottom: 1px solid var(--kz-border);
    font-size: 16px;
}
.kz-sidebar-row:last-child { border-bottom: none; }
.kz-sidebar-row-label {
    display: flex;
    align-items: center;
    gap: var(--s2);
    color: var(--kz-text-3);
    font-weight: 500;
    flex-shrink: 0;
}
.kz-sidebar-row-val {
    color: var(--kz-text-1);
    font-weight: 600;
    text-align: right;
    font-size: 16px;
}

/* ── SECTIUNI REVIEW ─────────────────────────────────────── */
.kz-section-block {
    margin-bottom: var(--s10);
    padding-bottom: var(--s8);
    border-bottom: 1px solid var(--kz-border);
}
.kz-section-block:last-child { border-bottom: none; }

/* Review body — stiluri pentru continut editorial generat */
.kz-review-body h2 { font-size: 20px; margin: var(--s8) 0 var(--s3); }
.kz-review-body h3 { font-size: 18px; margin: var(--s6) 0 var(--s2); }
.kz-review-body p  { font-size: 16px; color: var(--kz-text-2); line-height: 1.8; }
.kz-review-body ul,
.kz-review-body ol {
    padding-left: var(--s6);
    margin-bottom: var(--s4);
}
.kz-review-body li { font-size: 16px; color: var(--kz-text-2); margin-bottom: var(--s2); line-height: 1.7; }
.kz-review-body strong { color: var(--kz-text-1); }
.kz-review-body a { color: var(--kz-gold); }

/* Review intro */
.kz-review-intro {
    font-size: 17px;
    color: var(--kz-text-2);
    line-height: 1.8;
    margin-bottom: var(--s8);
    padding: var(--s5);
    background: var(--kz-bg-card);
    border-left: 3px solid var(--kz-gold);
    border-radius: 0 var(--r-md) var(--r-md) 0;
}
.kz-review-intro p { font-size: 17px; margin-bottom: 0; }

/* ── RESPONSIVE SINGLE CASINO ────────────────────────────── */
@media (max-width: 1024px) {
    .kz-review-hero {
        grid-template-columns: 1fr 280px;
        gap: var(--s6);
    }
    .kz-review-layout {
        grid-template-columns: 1fr 260px;
        gap: var(--s6);
    }
}

@media (max-width: 768px) {
    .kz-review-hero {
        grid-template-columns: 1fr;
        padding: var(--s6) 0;
    }
    .kz-review-hero__right { display: none; } /* ascunde screenshot pe mobile */
    .kz-review-layout {
        grid-template-columns: 1fr;
    }
    /* Sidebar se muta inainte de continut pe mobile */
    .kz-review-sidebar {
        position: static;
        order: -1;
    }
    .kz-review-title { font-size: 24px; }
    .kz-hero-bonus { font-size: 16px; }
}

@media (max-width: 480px) {
    .kz-review-title { font-size: 22px; }
    .kz-hero-bonus { font-size: 16px; }
    .kz-review-intro { padding: var(--s4); font-size: 16px; }
    .kz-review-intro p { font-size: 16px; }
    .kz-sidebar-card { padding: var(--s4); }
    .kz-section-block { margin-bottom: var(--s8); }
}

@media (max-width: 380px) {
    .kz-hero-actions { flex-direction: column; }
    .kz-hero-actions .kz-btn { width: 100%; justify-content: center; }
    .kz-review-title { font-size: 20px; }
    .kz-sidebar-row { flex-wrap: wrap; }
    .kz-sidebar-row-val { text-align: left; }
}