/* ==========================================================================
   ZVG Frontend – Stylesheet
   ========================================================================== */

/* ---- Reset / Variables --------------------------------------------------- */
.zvg-app {
    --zvg-primary:     #1a56db;
    --zvg-primary-dk:  #1241b3;
    --zvg-secondary:   #6b7280;
    --zvg-success:     #0e9f6e;
    --zvg-warning:     #ff5a1f;
    --zvg-danger:      #e02424;
    --zvg-bg:          #f9fafb;
    --zvg-card-bg:     #ffffff;
    --zvg-border:      #e5e7eb;
    --zvg-text:        #111827;
    --zvg-text-muted:  #6b7280;
    --zvg-radius:      0.5rem;
    --zvg-shadow:      0 1px 3px rgba(0,0,0,.12);
    --zvg-shadow-lg:   0 4px 12px rgba(0,0,0,.15);

    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: var(--zvg-text);
    line-height: 1.5;
}

.zvg-app *, .zvg-app *::before, .zvg-app *::after {
    box-sizing: inherit;
}

/* ---- Utilities ------------------------------------------------------------ */
.zvg-sr-only {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

.zvg-loading {
    text-align: center;
    padding: 2rem;
    color: var(--zvg-text-muted);
    font-style: italic;
}

.zvg-notice {
    padding: 1rem;
    background: #eff6ff;
    border-left: 4px solid var(--zvg-primary);
    border-radius: var(--zvg-radius);
    margin-bottom: 1rem;
}
.zvg-notice-error {
    background: #fef2f2;
    border-left-color: #ef4444;
    color: #7f1d1d;
}

/* ---- Buttons ------------------------------------------------------------- */
.zvg-btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .5rem 1rem;
    border: 1px solid transparent;
    border-radius: var(--zvg-radius);
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    text-decoration: none;
}

.zvg-btn-primary {
    background: var(--zvg-primary);
    color: #fff;
}
.zvg-btn-primary:hover {
    background: var(--zvg-primary-dk);
}

.zvg-btn-secondary {
    background: #fff;
    color: var(--zvg-secondary);
    border-color: var(--zvg-border);
}
.zvg-btn-secondary:hover {
    background: var(--zvg-bg);
}

.zvg-btn-outline {
    background: transparent;
    color: var(--zvg-primary);
    border-color: var(--zvg-primary);
}
.zvg-btn-outline:hover {
    background: #eff6ff;
}

.zvg-btn-sm {
    padding: .3rem .7rem;
    font-size: .8rem;
}

/* ---- Form controls ------------------------------------------------------- */
.zvg-select,
.zvg-input {
    padding: .45rem .75rem;
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    font-size: .875rem;
    background: #fff;
    color: var(--zvg-text);
    width: 100%;
}
.zvg-select:focus,
.zvg-input:focus {
    outline: 2px solid var(--zvg-primary);
    outline-offset: 1px;
}

/* ---- Filter Bar ---------------------------------------------------------- */
.zvg-filter-bar {
    background: var(--zvg-card-bg);
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    padding: 1rem;
    margin-bottom: 1.25rem;
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    align-items: flex-end;
}

.zvg-search-wrap {
    flex: 1 1 220px;
}

.zvg-search {
    padding: .5rem .75rem;
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    font-size: .875rem;
    width: 100%;
}
.zvg-search:focus {
    outline: 2px solid var(--zvg-primary);
    outline-offset: 1px;
}

.zvg-filters {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    flex: 2 1 auto;
}

.zvg-filters .zvg-select {
    flex: 1 1 160px;
    max-width: 200px;
}

.zvg-value-range {
    display: flex;
    align-items: center;
    gap: .3rem;
    flex: 1 1 260px;
}
.zvg-value-range .zvg-input {
    flex: 1;
}
.zvg-range-sep {
    color: var(--zvg-text-muted);
    white-space: nowrap;
}

.zvg-sort-wrap {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex: 1 1 auto;
}
.zvg-sort-label {
    white-space: nowrap;
    font-size: .875rem;
    color: var(--zvg-text-muted);
}
.zvg-sort-wrap .zvg-select {
    flex: 1 1 180px;
}

.zvg-per-page-wrap {
    display: flex;
    align-items: center;
    gap: .5rem;
}
.zvg-per-page-wrap .zvg-select {
    flex: 0 0 auto;
    min-width: 70px;
}

/* ---- Result count -------------------------------------------------------- */
.zvg-result-count {
    font-size: .875rem;
    color: var(--zvg-text-muted);
    margin: 0 0 .75rem;
}

.zvg-active-filters {
    margin: -.5rem 0 1rem;
}

.zvg-filter-badges-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.zvg-filter-badge {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    border: 1px solid #bfdbfe;
    background: #eff6ff;
    color: #1e3a8a;
    border-radius: 999px;
    padding: .25rem .6rem;
    font-size: .8rem;
    cursor: pointer;
}

.zvg-filter-badge:hover {
    background: #dbeafe;
}

.zvg-filter-badge-remove {
    font-size: .95rem;
    line-height: 1;
}

/* ---- Object grid --------------------------------------------------------- */
.zvg-object-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

/* ---- Object card --------------------------------------------------------- */
.zvg-card {
    background: var(--zvg-card-bg);
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    box-shadow: var(--zvg-shadow);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow .2s;
}
.zvg-card:hover {
    box-shadow: var(--zvg-shadow-lg);
}

.zvg-card-header {
    padding: .75rem 1rem .5rem;
    border-bottom: 1px solid var(--zvg-border);
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: .5rem;
}

/*mit maximale zeichenanzahl, damit die karten nicht zu groß werden*/
.zvg-card-title {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
    line-height: 1.3;
    color: var(--zvg-text);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.zvg-badge {
    display: inline-block;
    padding: .15rem .55rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
}
.zvg-badge-active  { background: #d1fae5; color: #065f46; }
.zvg-badge-expired { background: #fee2e2; color: #991b1b; }
.zvg-badge-pending { background: #fef3c7; color: #92400e; }
.zvg-badge-created { background: #e0e7ff; color: #3730a3; }
.zvg-payment-refresh {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 14px;
    padding: 0 2px;
    vertical-align: middle;
    opacity: .7;
    transition: opacity .15s;
}
.zvg-payment-refresh:hover { opacity: 1; }
.zvg-payment-refresh:disabled { cursor: default; opacity: .4; }

.zvg-card-body {
    padding: .75rem 1rem;
    flex: 1;
}

/*mit maximale zeichenanzahl, damit die karten nicht zu groß werden*/
.zvg-card-meta {
    font-size: .8125rem;
    color: var(--zvg-text-muted);
    margin: 0 0 .4rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.zvg-card-meta strong {
    color: var(--zvg-text);
}

.zvg-card-value {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--zvg-primary);
    margin: .5rem 0;
}

.zvg-card-scores {
    display: flex;
    gap: .75rem;
    margin-top: .5rem;
    flex-wrap: wrap;
}

.zvg-score-badge {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .75rem;
    font-weight: 600;
    padding: .15rem .5rem;
    border-radius: var(--zvg-radius);
    border: 1px solid var(--zvg-border);
    color: var(--zvg-text);
    background: var(--zvg-bg);
}

.zvg-card-footer {
    padding: .6rem 1rem;
    border-top: 1px solid var(--zvg-border);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .5rem;
}

.zvg-fav-btn {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: .3rem;
    border-radius: var(--zvg-radius);
    color: var(--zvg-text-muted);
    font-size: 1.2rem;
    line-height: 1;
    transition: color .15s;
}
.zvg-fav-btn:hover,
.zvg-fav-btn.is-favorited {
    color: #ef4444;
}

/* ---- Pagination ---------------------------------------------------------- */
.zvg-pagination {
    display: flex;
    justify-content: center;
    gap: .4rem;
    margin-top: .5rem;
    flex-wrap: wrap;
}
.zvg-page-btn {
    padding: .4rem .8rem;
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    background: #fff;
    cursor: pointer;
    font-size: .875rem;
    transition: background .15s, color .15s;
}
.zvg-page-btn:hover,
.zvg-page-btn.active {
    background: var(--zvg-primary);
    color: #fff;
    border-color: var(--zvg-primary);
}

/* ---- Object Detail ------------------------------------------------------- */
.zvg-detail-wrap {
    background: var(--zvg-card-bg);
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    box-shadow: var(--zvg-shadow);
    overflow: hidden;
}

.zvg-detail-header {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--zvg-border);
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
}

.zvg-detail-title {
    font-size: 1.375rem;
    font-weight: 700;
    margin: 0 0 .25rem;
}

.zvg-detail-location {
    color: var(--zvg-text-muted);
    font-size: .9375rem;
}

.zvg-detail-header-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .4rem;
}

.zvg-detail-value {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--zvg-primary);
}

.zvg-detail-body {
    padding: 1.25rem 1.5rem;
}

.zvg-detail-section {
    margin-bottom: 1.5rem;
}
.zvg-detail-section:last-child {
    margin-bottom: 0;
}
#zvg-zwangsversteigerung-detail{
    max-width: var(--zvg-detail-max-width);
}
.zvg-detail-section h3 {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 .75rem;
    padding-bottom: .4rem;
    border-bottom: 2px solid var(--zvg-border);
    color: var(--zvg-text);
}

.zvg-detail-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-auto-flow: column;
    gap: .75rem;
}

.zvg-detail-item {
    display: flex;
    flex-direction: column;
   
        align-items: flex-start;
}

.zvg-detail-label {
    font-size: .75rem;
    color: var(--zvg-text-muted);
    text-transform: uppercase;
    letter-spacing: .03em;
        align-items: flex-end;
}

.zvg-detail-value-sm {
    font-size: .9375rem;
    font-weight: 500;
    padding-bottom: 15px;
}

/* AI Scores */
.zvg-scores-grid {
    display: grid;
    
  
        justify-content: center;
    justify-items: center;
}
.zvg-score-notice {
    font-size: .75rem;
    color: var(--zvg-text-muted);
    font-style: italic;
    margin-bottom: .25rem;
}

.zvg-score-item {
    display: flex;
    flex-direction: column;
    gap: .3rem;
}

.zvg-score-label {
    font-size: .75rem;
    color: var(--zvg-text-muted);
    text-transform: uppercase;
    letter-spacing: .03em;
}

.zvg-score-bar-wrap {
    height: 8px;
    border-radius: 999px;
    background: var(--zvg-border);
    overflow: hidden;
}
.zvg-score-bar {
    height: 100%;
    border-radius: 999px;
    background: var(--zvg-primary);
    transition: width .4s ease;
}
.zvg-score-bar.risk { background: #f59e0b; }
.zvg-score-bar.danger { background: var(--zvg-danger); }

.zvg-score-value {
    font-size: .9375rem;
    font-weight: 700;
}

/* Paywall teaser */
.zvg-paywall {
    background: linear-gradient(135deg, #eff6ff, #e0e7ff);
    border: 1px solid #bfdbfe;
    border-radius: var(--zvg-radius);
    padding: 1.5rem;
    text-align: center;
    margin-top: 1rem;
}
.zvg-paywall p {
    color: var(--zvg-text);
    margin: 0 0 1rem;
    font-size: .9375rem;
}
.zvg-paywall .zvg-teaser {
    color: var(--zvg-text-muted);
    font-style: italic;
    margin: 0 0 1rem;
}

/* ---- Favorites ----------------------------------------------------------- */
.zvg-favorites-wrap {}
.zvg-favorites-wrap .zvg-object-grid {}

/* ---- Dashboard ----------------------------------------------------------- */
.zvg-dashboard-card {
    background: var(--zvg-card-bg);
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    box-shadow: var(--zvg-shadow);
    padding: 1.5rem;
    max-width: 480px;
}

.zvg-dashboard-card h2 {
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0 0 1.25rem;
}

.zvg-dashboard-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .6rem 0;
    border-bottom: 1px solid var(--zvg-border);
    font-size: .9375rem;
}
.zvg-dashboard-row:last-of-type {
    border-bottom: none;
}
.zvg-dashboard-row .zvg-label {
    color: var(--zvg-text-muted);
}
.zvg-dashboard-row .zvg-value {
    font-weight: 600;
}

.zvg-countdown {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--zvg-primary);
}

.zvg-no-membership {
    padding: 1rem;
    background: #fff7ed;
    border-left: 4px solid var(--zvg-warning);
    border-radius: var(--zvg-radius);
    font-size: .9375rem;
}

.zvg-dashboard-actions {
    margin-top: 1.25rem;
    display: flex;
    gap: .75rem;
    flex-wrap: wrap;
}

/* ---- Back link ----------------------------------------------------------- */
.zvg-back-link {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .875rem;
    color: var(--zvg-primary);
    text-decoration: none;
    margin-bottom: 1rem;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}
.zvg-back-link:hover {
    text-decoration: underline;
}

/* ---- Object card image --------------------------------------------------- */
.zvg-card-image {
    width: 100%;
    overflow: hidden;
    background: var(--zvg-bg);
    max-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.zvg-card-image img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
}

/* ---- Object detail image ------------------------------------------------- */
.zvg-detail-image {
    width: 100%;
    max-height: 360px;
    overflow: hidden;
    background: var(--zvg-bg);
}

.zvg-detail-image img {
    width: 100%;
    height: 360px;
    object-fit: cover;
    display: block;
}

/* ---- Quick list ---------------------------------------------------------- */
.zvg-quick-list {}

.zvg-quick-title {
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0 0 1rem;
    color: var(--zvg-text);
}

.zvg-quick-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.25rem;
}

/* ---- Membership plans ---------------------------------------------------- */
.zvg-plans-header {
    text-align: center;
    margin-bottom: 2rem;
}

.zvg-plans-header h2 {
    font-size: 1.75rem;
    font-weight: 700;
    margin: 0;
}

.zvg-plans-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1.5rem;
    align-items: stretch;
}

.zvg-plan-card {
    background: var(--zvg-card-bg);
    border: 2px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    box-shadow: var(--zvg-shadow);
    padding: 1.75rem 1.5rem;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: box-shadow .2s, border-color .2s;
}

.zvg-plan-card:hover {
    box-shadow: var(--zvg-shadow-lg);
}

.zvg-plan-card.zvg-plan-best {
    border-color: var(--zvg-primary);
    box-shadow: 0 6px 20px rgba(26, 86, 219, .2);
}

.zvg-plan-badge {
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--zvg-primary);
    color: #fff;
    font-size: .75rem;
    font-weight: 700;
    padding: .25rem .9rem;
    border-radius: 999px;
    white-space: nowrap;
}

.zvg-plan-name {
    font-size: 1.125rem;
    font-weight: 700;
    margin: .5rem 0 1rem;
    text-align: center;
    color: var(--zvg-text);
}

.zvg-plan-price {
    text-align: center;
    margin-bottom: .25rem;
}

.zvg-plan-amount {
    font-size: 2rem;
    font-weight: 800;
    color: var(--zvg-primary);
}

.zvg-plan-duration {
    font-size: .875rem;
    color: var(--zvg-text-muted);
    margin-left: .25rem;
}

.zvg-plan-per-month {
    text-align: center;
    font-size: .8125rem;
    color: var(--zvg-text-muted);
    margin: 0 0 1.25rem;
}

.zvg-plan-features {
    list-style: none;
    margin: 0 0 1.5rem;
    padding: 0;
    flex: 1;
}

.zvg-plan-features li {
    padding: .35rem 0;
    font-size: .9rem;
    color: var(--zvg-text);
    border-bottom: 1px solid var(--zvg-border);
}

.zvg-plan-features li:last-child {
    border-bottom: none;
}

.zvg-plan-cta {
    width: 100%;
    justify-content: center;
    font-size: 1rem;
    padding: .65rem 1rem;
    margin-top: auto;
}

/* ---- Checkout ------------------------------------------------------------ */
.zvg-checkout-wrap {
    max-width: 480px;
    margin: 0 auto;
    background: var(--zvg-card-bg);
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    box-shadow: var(--zvg-shadow);
    padding: 2rem;
}

.zvg-checkout-wrap h2 {
    font-size: 1.375rem;
    font-weight: 700;
    margin: 0 0 1.5rem;
}

.zvg-checkout-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.zvg-checkout-label {
    font-size: .875rem;
    font-weight: 600;
    color: var(--zvg-text-muted);
    display: block;
    margin-bottom: .25rem;
}

.zvg-checkout-pay {
    font-size: 1rem;
    padding: .75rem 1.25rem;
    justify-content: center;
}

/* ---- Profile edit -------------------------------------------------------- */
.zvg-profile-wrap {
    background: var(--zvg-card-bg);
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    box-shadow: var(--zvg-shadow);
    padding: 2rem;
    /*max-width: 540px;*/
}

.zvg-profile-wrap h2 {
    font-size: 1.375rem;
    font-weight: 700;
    margin: 0 0 1.5rem;
}

.zvg-profile-form {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.zvg-profile-field {
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

.zvg-profile-label {
    font-size: .875rem;
    font-weight: 600;
    color: var(--zvg-text);
}

.zvg-profile-hint {
    font-size: .8125rem;
    color: var(--zvg-text-muted);
    margin-top: .15rem;
}

.zvg-profile-msg {
    font-size: .9rem;
    min-height: 1.4rem;
    border-radius: var(--zvg-radius);
    padding: .5rem .75rem;
}

.zvg-profile-msg:empty {
    display: none;
}

.zvg-profile-msg-success {
    background: #d1fae5;
    color: #065f46;
}

.zvg-profile-msg-error {
    background: #fee2e2;
    color: #991b1b;
}

/* ---- Dashboard extras ---------------------------------------------------- */
.zvg-dashboard-wrap {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.zvg-dashboard-section {
    background: var(--zvg-card-bg);
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    padding: 1.5rem;
}

.zvg-dashboard-section h3 {
    font-size: 1.0625rem;
    font-weight: 700;
    margin: 0 0 1rem;
    padding-bottom: .5rem;
    border-bottom: 2px solid var(--zvg-border);
}

.zvg-table-wrap {
    overflow-x: auto;
}

.zvg-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .875rem;
}

.zvg-table th,
.zvg-table td {
    padding: .6rem .75rem;
    text-align: left;
    border-bottom: 1px solid var(--zvg-border);
}

.zvg-table th {
    font-weight: 600;
    color: var(--zvg-text-muted);
    white-space: nowrap;
}

/* ---- User Dashboard Layout ----------------------------------------------- */
.zvg-user-dashboard {
    display: flex;
    gap: 0;
    min-height: 480px;
    align-items: flex-start;
}

/* Sidebar */
.zvg-user-dashboard__sidebar {
    width: 220px;
    flex-shrink: 0;
    background: var(--zvg-card-bg);
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    box-shadow: var(--zvg-shadow);
    padding: 1rem 0;
    margin-right: 1.5rem;
    position: sticky;
    top: 80px;
}

.zvg-dashboard-nav__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.zvg-dashboard-nav__item {
    margin: 0;
}

.zvg-dashboard-nav__link {
    display: flex;
    align-items: center;
    gap: .625rem;
    padding: .65rem 1.25rem;
    font-size: .9375rem;
    color: var(--zvg-text-muted);
    text-decoration: none;
    transition: background .15s, color .15s;
    border-left: 3px solid transparent;
}

.zvg-dashboard-nav__link:hover {
    background: var(--zvg-bg);
    color: var(--zvg-primary);
}

.zvg-dashboard-nav__item--active .zvg-dashboard-nav__link {
    border-left-color: var(--zvg-primary);
    color: var(--zvg-primary);
    font-weight: 600;
    background: rgba(26, 86, 219, .08);
}

.zvg-dashboard-nav__item--logout {
    margin-top: .5rem;
    border-top: 1px solid var(--zvg-border);
    padding-top: .5rem;
}

.zvg-dashboard-nav__link--logout {
    color: #ef4444;
}

.zvg-dashboard-nav__link--logout:hover {
    background: #fef2f2;
    color: #dc2626;
}

.zvg-dashboard-nav__link i {
    width: 1.125rem;
    text-align: center;
    font-size: 1rem;
    flex-shrink: 0;
}

/* Content area */
.zvg-user-dashboard__content {
    flex: 1 1 0;
    min-width: 0;
}

/* Dashboard overview grid */
.zvg-dashboard-welcome {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 1.25rem;
}

.zvg-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

.zvg-dashboard-overview {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* Override max-width so cards fill the grid cell */
.zvg-dashboard-grid .zvg-dashboard-card {
    max-width: none;
}

.zvg-dashboard-card--timeline {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

/* ZVG Timeline */
.zvg-timeline {
    display: flex;
    flex-direction: column;
    gap: .625rem;
}

.zvg-timeline-item {
    display: flex;
    align-items: flex-start;
    gap: .875rem;
    padding: .625rem;
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    background: var(--zvg-bg);
}

.zvg-timeline-badge {
    flex-shrink: 0;
    background: var(--zvg-primary);
    color: #fff;
    border-radius: .375rem;
    padding: .2rem .55rem;
    font-size: .8125rem;
    font-weight: 700;
    white-space: nowrap;
}

.zvg-timeline-body {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
}

.zvg-timeline-court {
    font-size: .8125rem;
    color: var(--zvg-text-muted);
}

.zvg-timeline-title {
    font-size: .9375rem;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zvg-timeline-date {
    font-size: .8125rem;
    color: var(--zvg-text-muted);
}

/* Empty state */
.zvg-empty-state {
    padding: 1rem;
    color: var(--zvg-text-muted);
    font-size: .9375rem;
    display: flex;
    align-items: center;
    gap: .5rem;
}

/* Followed courts tag list */
.zvg-dashboard-courts {
    border-top: 1px solid var(--zvg-border);
    padding-top: .75rem;
    margin-top: .25rem;
}

.zvg-dashboard-courts h4 {
    font-size: .8125rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--zvg-text-muted);
    margin: 0 0 .5rem;
}

.zvg-courts-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.zvg-court-tag {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    background: var(--zvg-bg);
    border: 1px solid var(--zvg-border);
    border-radius: 9999px;
    padding: .25rem .65rem;
    font-size: .875rem;
}

.zvg-court-unfollow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--zvg-text-muted);
    padding: 0;
    line-height: 1;
    font-size: .75rem;
}

.zvg-court-unfollow:hover {
    color: #ef4444;
}

/* Amtsgericht detail follow button */
.zvg-amtsgericht-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: .5rem;
}

.zvg-amtsgericht-header .zvg-amtsgericht-title {
    margin: 0;
    flex: 1 1 auto;
}

.zvg-court-follow-btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .45rem 1rem;
    border: 2px solid var(--zvg-primary);
    border-radius: var(--zvg-radius);
    background: transparent;
    color: var(--zvg-primary);
    font-size: .9375rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s, color .15s;
    white-space: nowrap;
    flex-shrink: 0;
}

.zvg-court-follow-btn:hover,
.zvg-court-follow-btn.is-followed {
    background: var(--zvg-primary);
    color: #fff;
}

.zvg-court-follow-btn:disabled {
    opacity: .6;
    cursor: default;
}

/* ---- Responsive ---------------------------------------------------------- */
@media (max-width: 640px) {
    .zvg-filter-bar {
        flex-direction: column;
    }
    .zvg-filters {
        flex-direction: column;
    }
    .zvg-filters .zvg-select {
        max-width: 100%;
    }
    .zvg-object-grid,
    .zvg-quick-grid {
        grid-template-columns: 1fr;
    }
    .zvg-detail-header {
        flex-direction: column;
    }
    .zvg-detail-header-right {
        align-items: flex-start;
    }
    .zvg-plans-grid {
        grid-template-columns: 1fr;
    }
    .zvg-checkout-wrap,
    .zvg-profile-wrap {
        padding: 1.25rem;
    }
    /* Dashboard: sidebar stacks on top on mobile */
    .zvg-user-dashboard {
        flex-direction: column;
    }
    .zvg-user-dashboard__sidebar {
        width: 100%;
        position: static;
        margin-right: 0;
        margin-bottom: 1rem;
    }
    .zvg-dashboard-nav__list {
        display: flex;
        flex-wrap: wrap;
        gap: .25rem;
        padding: .5rem;
    }
    .zvg-dashboard-nav__link {
        border-left: none;
        border-bottom: 3px solid transparent;
        border-radius: .375rem;
        padding: .5rem .875rem;
    }
    .zvg-dashboard-nav__item--active .zvg-dashboard-nav__link {
        border-left-color: transparent;
        border-bottom-color: var(--zvg-primary);
    }
    .zvg-dashboard-nav__item--logout {
        border-top: none;
        margin-left: auto;
    }
}

/* ---- Admin edit button --------------------------------------------------- */
.zvg-admin-edit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: rgba(0, 0, 0, .07);
    text-decoration: none;
    font-size: 1rem;
    line-height: 1;
    margin-left: .5rem;
    transition: background .15s;
}
.zvg-admin-edit-btn:hover {
    background: rgba(0, 0, 0, .15);
}

/* ---- Placeholder image --------------------------------------------------- */
.zvg-card-image img[src^="data:image/svg"],
.zvg-detail-image img[src^="data:image/svg"] {
    object-fit: contain;
    background: #f5f5f5;
}

/* ---- Detail description -------------------------------------------------- */
.zvg-detail-description {
    line-height: 1.6;
    color: var(--zvg-text, #333);
    white-space: pre-wrap;
}

/* ---- Image Gallery ------------------------------------------------------- */
.zvg-gallery {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    /*grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));*/
    gap: .75rem;
    margin-top: .5rem;
}
.zvg_gallery-thumbnails{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: .5rem;
}
.zvg_gallery-preview{
    margin: auto;
    text-align: center;
}


.zvg-gallery-item {
    border-radius: var(--zvg-radius);
    overflow: hidden;
    background: var(--zvg-bg);
    aspect-ratio: 4/3;
    position: relative;
}

.zvg-gallery-item a {
    display: block;
    width: 100%;
    height: 100%;
}

.zvg-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .2s ease;
}

.zvg-gallery-item:not(.zvg-gallery-locked):hover img {
    transform: scale(1.04);
}

/* Locked gallery item */
.zvg-gallery-locked {
    position: relative;
    cursor: default;
}

.zvg-gallery-blur-img img {
    filter: blur(8px) brightness(.8);
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.zvg-gallery-lock-badge {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.5rem;
    background: rgba(0,0,0,.55);
    border-radius: 50%;
    width: 2.75rem;
    height: 2.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.zvg-gallery-count {
    font-size: .8125rem;
    font-weight: 400;
    color: var(--zvg-text-muted);
    margin-left: .4rem;
}

.zvg-gallery-lock-notice {
    margin-top: .75rem;
}

/* ---- Premium Lock / Blur Overlay ---------------------------------------- */
.zvg-premium-lock {
    position: relative;
    display: inline-block;
    width: 100%;
}

.zvg-premium-blur {
    filter: blur(5px);
    user-select: none;
    pointer-events: none;
    opacity: .7;
}

.zvg-premium-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    background: rgba(255,255,255,.75);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    border-radius: var(--zvg-radius);
    text-align: center;
    padding: .75rem .5rem;
    z-index: 1;
}

.zvg-premium-icon {
    font-size: 1.4rem;
}

.zvg-premium-overlay p {
    font-size: .8125rem;
    color: var(--zvg-text);
    margin: 0;
    line-height: 1.35;
}

.zvg-premium-cta {
    font-size: .8125rem;
    padding: .3rem .75rem;
    white-space: nowrap;
}

/* In the detail grid, keep locked items inline */
.zvg-detail-item .zvg-premium-lock {
    margin-top: .1rem;
}

.zvg-detail-item .zvg-premium-overlay {
    position: static;
    background: #eff6ff;
    border: 1px dashed var(--zvg-primary);
    flex-direction: row;
    flex-wrap: wrap;
    gap: .4rem;
    padding: .4rem .6rem;
    border-radius: var(--zvg-radius);
}

.zvg-detail-item .zvg-premium-icon {
    font-size: 1rem;
}

.zvg-detail-item .zvg-premium-blur {
    display: none;
}

/* Header-level market value lock keeps the blur visible */
.zvg-detail-header-right .zvg-premium-lock {
    width: auto;
}

.zvg-detail-header-right .zvg-premium-overlay {
    position: static;
    background: #eff6ff;
    border: 1px dashed var(--zvg-primary);
    flex-direction: row;
    gap: .4rem;
    padding: .3rem .6rem;
    border-radius: var(--zvg-radius);
}

.zvg-detail-header-right .zvg-premium-blur {
    display: none;
}

/* ---- Locked hint in header location ------------------------------------- */
.zvg-locked-hint {
    color: var(--zvg-text-muted);
    font-size: .875rem;
    font-style: italic;
}

/* ---- Files list ---------------------------------------------------------- */
.zvg-files-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.zvg-file-item {
    display: flex;
    align-items: center;
}

.zvg-file-link {
    color: var(--zvg-primary);
    text-decoration: none;
    font-size: .9375rem;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .35rem .6rem;
    border: 1px solid var(--zvg-border);
    border-radius: var(--zvg-radius);
    transition: background .15s;
}

.zvg-file-link:hover {
    background: var(--zvg-bg);
    text-decoration: underline;
}

/* ---- Notice muted (no documents) ---------------------------------------- */
.zvg-notice-muted {
    color: var(--zvg-text-muted);
    font-size: .9375rem;
    font-style: italic;
    margin: 0;
}

/* ---- Disclaimer ---------------------------------------------------------- */
.zvg-disclaimer {
    background: #fefce8;
    border: 1px solid #fde68a;
    border-left: 4px solid #f59e0b;
    border-radius: var(--zvg-radius);
    padding: .875rem 1rem;
    font-size: .8125rem;
    line-height: 1.55;
    color: #78350f;
    margin-bottom: 1.5rem;
}

.zvg-disclaimer strong {
    display: block;
    margin-bottom: .3rem;
    font-size: .875rem;
}

/* ---- Extended status badges --------------------------------------------- */
.zvg-badge-new       { background: #dbeafe; color: #1e40af; }
.zvg-badge-confirmed { background: #d1fae5; color: #065f46; }
.zvg-badge-awarded   { background: #dcfce7; color: #14532d; }
.zvg-badge-cancelled { background: #fee2e2; color: #991b1b; }
.zvg-badge-adjourned { background: #fef3c7; color: #92400e; }

/* ==========================================================================
   Hero Search  [zvg_hero_search]
   ========================================================================== */

.zvg-hero-search {
    max-width: 720px;
    margin: 0 auto;
    padding: 1.5rem 1rem;
}

.zvg-hero-search-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.zvg-hero-search-bar {
    display: flex;
    border: 2px solid #1a56db;
    border-radius: 2rem;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
}

.zvg-hero-input {
    flex: 1;
    border: none;
    outline: none;
    padding: .8rem 1.25rem;
    font-size: 1rem;
    background: transparent;
    color: #111827;
}

.zvg-hero-input::placeholder { color: #9ca3af; }

.zvg-hero-search-btn {
    border: none;
    background: #1a56db;
    color: #fff;
    padding: .6rem 1.1rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: background .15s;
}

.zvg-hero-search-btn:hover { background: #1241b3; }

/* Type filter buttons */
.zvg-hero-type-filter {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    justify-content: center;
}

.zvg-type-btn {
    border: 1px solid #d1d5db;
    background: #fff;
    color: #374151;
    padding: .35rem .9rem;
    border-radius: 2rem;
    font-size: .875rem;
    cursor: pointer;
    transition: background .15s, border-color .15s, color .15s;
}

.zvg-type-btn:hover {
    background: #eff6ff;
    border-color: #1a56db;
    color: #1a56db;
}

.zvg-type-btn-active,
.zvg-type-btn:focus {
    background: #1a56db;
    border-color: #1a56db;
    color: #fff;
}

/* ==========================================================================
   Germany Map  [zvg_germany_map]
   ========================================================================== */

.zvg-germany-map-wrap {
    max-width: 960px;
    margin: 0 auto;
    padding: 1rem;
}

.zvg-germany-map-container {
    display: flex;
    gap: 2rem;
    align-items: flex-start;
    flex-wrap: wrap;
}

.zvg-map-svg-wrap {
    flex: 0 0 auto;
    width: min(380px, 100%);
}

.zvg-map-svg-wrap svg {
    width: 100%;
    height: auto;
    display: block;
    fill: #6966ff;
}

.zvg-map-svg-wrap path[id^="state"],
.zvg-map-svg-wrap a path[id^="state"] {
    fill: #bfdbfe;
    stroke: #fff;
    stroke-width: 1.5;
    transition: fill .2s;
    cursor: pointer;
}

.zvg-map-svg-wrap path[id^="state"]:hover,
.zvg-map-svg-wrap a:hover path[id^="state"] {
    fill: #60a5fa;
}

.zvg-map-svg-wrap path.zvg-map-active,
.zvg-map-svg-wrap .zvg-map-active path {
    fill: #1a56db;
}
.zvg-map-svg-wrap path.zvg-map-active,
.zvg-map-svg-wrap .zvg-map-active path:focus {
    border: none;
    outline: #1241b3  ;
}

.zvg-map-panel {
    flex: 1 1 260px;
    min-height: 200px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: .5rem;
    padding: 1.25rem;
}

.zvg-map-hint,
.zvg-map-loading,
.zvg-map-empty,
.zvg-map-error {
    color: #6b7280;
    font-style: italic;
    margin: 0;
}

.zvg-map-state-title {
    margin: 0 0 .75rem;
    font-size: 1.1rem;
    font-weight: 700;
    color: #111827;
}

.zvg-map-court-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .4rem;
    overflow: auto;
    height: 500px;
}

.zvg-map-court-item {
   /* display: flex;*/
   text-align: left;
    align-items: baseline;
    gap: .4rem;
    border-bottom: 1px dashed #7b7b7b;
}
.zvg-map-court-item:hover {
    background: #cedfff;
}

.zvg-map-court-link {
    color: #1a56db;
    text-decoration: none;
    font-size: .9375rem;
    display: block;
}

.zvg-map-court-link:hover { text-decoration: underline; }

.zvg-map-court-count {
    color: #6b7280;
    font-size: .8125rem;
}

/* ==========================================================================
   Contact Form  [zvg_contact]
   ========================================================================== */

.zvg-contact-wrap {
    max-width: 640px;
    margin: 0 auto;
    padding: 1rem;
}

.zvg-contact-notice {
    padding: .875rem 1rem;
    border-radius: .5rem;
    margin-bottom: 1.25rem;
    font-weight: 500;
}

.zvg-contact-success {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #6ee7b7;
}

.zvg-contact-error {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

.zvg-contact-form .zvg-form-row {
    margin-bottom: 1.1rem;
    display: flex;
    flex-direction: column;
    gap: .35rem;
}

.zvg-contact-form label {
    font-size: .9375rem;
    font-weight: 600;
    color: #374151;
}

.zvg-contact-form input[type="text"],
.zvg-contact-form input[type="email"],
.zvg-contact-form textarea {
    width: 100%;
    padding: .55rem .8rem;
    border: 1px solid #d1d5db;
    border-radius: .375rem;
    font-size: .9375rem;
    color: #111827;
    background: #fff;
    transition: border-color .15s;
}

.zvg-contact-form input:focus,
.zvg-contact-form textarea:focus {
    outline: none;
    border-color: #1a56db;
    box-shadow: 0 0 0 2px rgba(26,86,219,.15);
}

.zvg-contact-form textarea { resize: vertical; }

.zvg-form-submit { margin-top: .5rem; }

/* ==========================================================================
   Cookie Consent Banner
   ========================================================================== */

.zvg-cookie-banner {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.zvg-cookie-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
}

.zvg-cookie-modal {
    position: relative;
    background: #fff;
    color: #1a1a2e;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    padding: 2rem;
    max-width: 520px;
    width: 100%;
    z-index: 1;
}

.zvg-cookie-header {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin-bottom: .75rem;
}

.zvg-cookie-icon {
    font-size: 1.4rem;
    line-height: 1;
}

.zvg-cookie-title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 700;
    color: #111;
}

.zvg-cookie-text {
    margin: 0 0 1.25rem;
    font-size: .9rem;
    line-height: 1.6;
    color: #444;
}

.zvg-cookie-text a {
    color: #0073aa;
    text-decoration: underline;
}

.zvg-cookie-actions {
    display: flex;
    gap: .625rem;
    flex-wrap: wrap;
}

.zvg-cookie-btn {
    flex: 1 1 0;
    min-width: 0;
    padding: .6rem .9rem;
    border-radius: 6px;
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
    border: 2px solid transparent;
    text-align: center;
    transition: background .15s, border-color .15s, color .15s;
    white-space: nowrap;
}

.zvg-cookie-btn--primary {
    background: #0073aa;
    color: #fff;
    border-color: #0073aa;
}
.zvg-cookie-btn--primary:hover {
    background: #005a87;
    border-color: #005a87;
}

.zvg-cookie-btn--secondary {
    background: #fff;
    color: #0073aa;
    border-color: #0073aa;
}
.zvg-cookie-btn--secondary:hover {
    background: #f0f7fb;
}

.zvg-cookie-btn--outline {
    background: #fff;
    color: #555;
    border-color: #ccc;
}
.zvg-cookie-btn--outline:hover {
    background: #f5f5f5;
    border-color: #aaa;
}

/* Settings panel */
.zvg-cookie-settings-panel {
    margin: 1rem 0;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
}

.zvg-cookie-settings-intro {
    margin: 0;
    padding: .75rem 1rem;
    font-size: .85rem;
    color: #555;
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
}

.zvg-cookie-toggle-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 1rem;
    border-bottom: 1px solid #e5e7eb;
}
.zvg-cookie-toggle-row:last-child {
    border-bottom: none;
}

.zvg-cookie-toggle-info {
    flex: 1;
    min-width: 0;
}
.zvg-cookie-toggle-info strong {
    display: block;
    font-size: .875rem;
    color: #111;
    margin-bottom: .15rem;
}
.zvg-cookie-toggle-info span {
    font-size: .8rem;
    color: #666;
    line-height: 1.4;
}

/* Toggle switch */
.zvg-cookie-switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
    cursor: pointer;
}
.zvg-cookie-switch input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}
.zvg-cookie-slider {
    position: absolute;
    inset: 0;
    background: #d1d5db;
    border-radius: 24px;
    transition: background .2s;
}
.zvg-cookie-slider::before {
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    left: 3px;
    top: 3px;
    background: #fff;
    border-radius: 50%;
    transition: transform .2s;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.zvg-cookie-switch input:checked + .zvg-cookie-slider {
    background: #0073aa;
}
.zvg-cookie-switch input:checked + .zvg-cookie-slider::before {
    transform: translateX(20px);
}
.zvg-cookie-switch--disabled {
    opacity: .55;
    cursor: not-allowed;
}

.zvg-cookie-save-wrap {
    margin-top: .75rem;
}

@media (max-width: 480px) {
    .zvg-cookie-modal {
        padding: 1.25rem;
    }
    .zvg-cookie-actions {
        flex-direction: column;
    }
    .zvg-cookie-btn {
        flex: none;
        width: 100%;
    }
}

.zvg-btn-sm {
    padding: .35rem .85rem;
    font-size: .875rem;
}


/* ==========================================================================
   header-user-nav
   ========================================================================== */

.header-user-nav{
    display: flex;
    align-items: center;
    gap: .75rem;
    background-color: var(--zvg-card-bg);
}
.header-user-nav .nav-link {
    color: var(--zvg-text);
    text-decoration: none;
    font-size: .9375rem;
    padding: .35rem .6rem;
    border-radius: var(--zvg-radius);
    transition: background .15s;
}
.header-user-nav .nav-link:hover {
    background: var(--zvg-bg);
}
.header-user-nav .btn{
    padding: .35rem .75rem;
    font-size: .875rem;
}
.header-user-nav .btn-primary {
    
    color: #fff;
    border: none;
}
.header-user-nav .btn-primary:hover {
  background-color: #065f46;
}
.header-user-nav .btn-secondary {
    background: #2254c5;
    color: white;
    border: 1px solid var(--zvg-border);
}
.header-user-nav .btn-secondary:hover {
    background: #0a2970;
}

/*** ==========================================================================
   Court List Filters
   ========================================================================== */

   body{
font-family: Arial, sans-serif;
margin:0;
background:#f5f7fa;
color:#222;
}

.container{
max-width:1100px;
margin:auto;
padding:40px 20px;
}

.hero{
background:linear-gradient(135deg,#0f172a,#1e3a8a);
color:white;
text-align:center;
padding:90px 20px;
}

.hero h1{
font-size:42px;
margin-bottom:20px;
}

.hero p{
font-size:20px;
max-width:700px;
margin:auto;
margin-bottom:35px;
}

.btn{
background:#22c55e;
color:white;
padding:18px 35px;
text-decoration:none;
border-radius:8px;
font-weight:bold;
font-size:18px;
display:inline-block;
}

.section{
background:white;
margin-top:30px;
border-radius:10px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.section h2{
text-align:center;
margin-bottom:25px;
}

.features{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:25px;
}

.card{
background:#f8fafc;
padding:25px;
border-radius:8px;
}

.pricing{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:25px;
margin-top:30px;
}

.price-card{
background:#f8fafc;
padding:35px;
text-align:center;
border-radius:10px;
}

.price{
font-size:34px;
font-weight:bold;
margin:15px 0;
}

.cta{
text-align:center;
padding:60px 20px;
background:#1e293b;
color:white;
margin-top:40px;
}

.cta h2{
font-size:32px;
margin-bottom:20px;
}

/* ── Payment success screen ────────────────────────────────── */
.zvg-payment-success {
    text-align: center;
    padding: 48px 24px;
    max-width: 520px;
    margin: 0 auto;
}
.zvg-payment-success__icon {
    font-size: 56px;
    margin-bottom: 16px;
}
.zvg-payment-success h2 {
    font-size: 28px;
    font-weight: 700;
    color: #065f46;
    margin-bottom: 12px;
}
.zvg-payment-success p {
    color: #374151;
    margin-bottom: 8px;
    font-size: 16px;
}
.zvg-payment-success__detail {
    font-size: 15px;
    color: #6b7280;
    margin-bottom: 28px !important;
}
.zvg-payment-success .zvg-btn {
    margin-top: 16px;
}

/* ---- Map container ------------------------------------------------------- */
.zvg-map-container {
    width: 100%;
    min-height: 300px;
    border-radius: 8px;
    overflow: hidden;
    margin-top: 1rem;
}

.zvg-nearby-map-container {
    width: 100%;
    border: 1px solid var(--zvg-border);
    border-radius: 8px;
    overflow: hidden;
    margin-top: .5rem;
}

.zvg-detail-map-hint {
    margin: .55rem 0 0;
    color: var(--zvg-text-muted);
    font-size: .85rem;
}

/* ---- Amtsgericht detail – info block ------------------------------------ */
.zvg-amtsgericht-info {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1.25rem;
    align-items: start;
    margin: 1rem 0 1.5rem;
}

@media (max-width: 640px) {
    .zvg-amtsgericht-info {
        grid-template-columns: 1fr;
    }
}

.zvg-amtsgericht-image img {
    max-width: 220px;
    width: 100%;
    border-radius: 8px;
    object-fit: cover;
    border: 1px solid var(--zvg-border, #e5e7eb);
}

.zvg-amtsgericht-meta {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.zvg-amtsgericht-address,
.zvg-amtsgericht-contact {
    margin: 0;
    font-size: .9375rem;
    color: var(--zvg-text-muted, #6b7280);
}

.zvg-amtsgericht-address i,
.zvg-amtsgericht-contact i {
    margin-right: .35rem;
    color: var(--zvg-primary, #2563eb);
}

.zvg-amtsgericht-contact a {
    color: inherit;
    text-decoration: none;
}

.zvg-amtsgericht-contact a:hover {
    text-decoration: underline;
}

/* When map spans full width below the info block */
.zvg-amtsgericht-info .zvg-map-container {
    grid-column: 1 / -1;
}

/* ---- Gallery title above images ----------------------------------------- */
.zvg-gallery-section .zvg-gallery-object-title {
    font-size: 1.375rem;
    font-weight: 700;
    margin: 0 0 .25rem;
    color: var(--zvg-text, #333);
    line-height: 1.3;
}

.zvg-gallery-section .zvg-gallery-subtitle {
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 .75rem;
    color: var(--zvg-text-muted, #666);
}

/* ---- Lightbox / Fancybox overlay ---------------------------------------- */
.zvg-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .92);
    z-index: 99999;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 1rem;
    box-sizing: border-box;
}

.zvg-lightbox.is-open {
    display: flex;
}

.zvg-lightbox-stage {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 90vw;
    max-height: 82vh;
}

.zvg-lightbox-img {
    max-width: 90vw;
    max-height: 82vh;
    object-fit: contain;
    border-radius: 4px;
    box-shadow: 0 8px 48px rgba(0, 0, 0, .7);
    display: block;
}

.zvg-lightbox-close,
.zvg-lightbox-prev,
.zvg-lightbox-next {
    position: absolute;
    background: rgba(255, 255, 255, .18);
    border: none;
    color: #fff;
    cursor: pointer;
    border-radius: 50%;
    width: 2.75rem;
    height: 2.75rem;
    font-size: 1.5rem;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .2s ease, transform .15s ease;
    padding: 0;
}

.zvg-lightbox-close:hover,
.zvg-lightbox-prev:hover,
.zvg-lightbox-next:hover {
    background: rgba(255, 255, 255, .35);
    transform: scale(1.1);
}

.zvg-lightbox-close {
    top: 1rem;
    right: 1rem;
    font-size: 1.1rem;
}

.zvg-lightbox-prev {
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
}

.zvg-lightbox-prev:hover {
    transform: translateY(-50%) scale(1.1);
}

.zvg-lightbox-next {
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
}

.zvg-lightbox-next:hover {
    transform: translateY(-50%) scale(1.1);
}

.zvg-lightbox-counter {
    color: rgba(255, 255, 255, .85);
    margin-top: .875rem;
    font-size: .875rem;
    font-family: sans-serif;
    letter-spacing: .03em;
}

/* Cursor pointer on gallery items that open the lightbox */
.zvg-gallery-link {
    cursor: zoom-in;
}

/* ---- ZVG Gesamtkosten-Rechner -------------------------------------------- */
.zvg-rechner-wrap {
    max-width: 680px;
    margin: 0 auto;
    font-family: inherit;
}

.zvg-rechner-title {
    font-size: 1.5rem;
    margin-bottom: .5rem;
}

.zvg-rechner-intro {
    color: #555;
    margin-bottom: 1.5rem;
    line-height: 1.6;
}

.zvg-rechner-form {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.zvg-rechner-field {
    display: flex;
    flex-direction: column;
    flex: 1 1 240px;
    gap: .375rem;
}

.zvg-rechner-field label {
    font-weight: 600;
    font-size: .9rem;
}

.zvg-rechner-ergebnis {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
}

.zvg-rechner-ergebnis h3 {
    margin-top: 0;
    font-size: 1.1rem;
}

.zvg-rechner-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .95rem;
}

.zvg-rechner-table td {
    padding: .45rem .25rem;
    border-bottom: 1px solid #e9ecef;
}

.zvg-rechner-table .zvg-rechner-val {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.zvg-rechner-zero {
    color: #28a745;
    font-style: italic;
}

.zvg-rechner-highlight td {
    background: #fff3cd;
    font-weight: 600;
}

.zvg-rechner-total td {
    border-top: 2px solid #dee2e6;
    border-bottom: none;
    padding-top: .75rem;
    font-size: 1.05rem;
}

.zvg-rechner-sicherheit td {
    border-top: 2px solid #dee2e6;
    border-bottom: none;
    padding-top: .75rem;
    font-size: 1.05rem;
    background: #fff3cd;
    color: #856404;
}

.zvg-rechner-intro-box {
    background: #e8f4fd;
    border-left: 4px solid #0d6efd;
    border-radius: 4px;
    padding: .875rem 1.25rem;
    margin-bottom: 1.5rem;
    line-height: 1.6;
}

.zvg-rechner-intro-box p {
    margin: 0 0 .5rem;
}

.zvg-rechner-intro-box p:last-child {
    margin-bottom: 0;
}

.zvg-rechner-hinweis {
    margin-top: 1rem;
    font-size: .8rem;
    color: #6c757d;
}

/* ---- ZVG Taktik-Rechner (Grenzen & Sicherheit) --------------------------- */
.zvg-taktik-rechner-wrap {
    
    margin: 0 auto;
    font-family: inherit;
}

.zvg-taktik-rechner-title {
    font-size: 1.25rem;
    margin-bottom: .5rem;
}

.zvg-taktik-table thead th {
    text-align: left;
    font-weight: 600;
    font-size: .85rem;
    color: #495057;
    padding: .45rem .5rem;
    border-bottom: 2px solid #dee2e6;
}

.zvg-taktik-table tbody td {
    vertical-align: top;
}

.zvg-taktik-hint {
    font-size: .8rem;
    color: #6c757d;
    max-width: 420px;
}

.zvg-rechner-hint {
    font-size: .8rem;
    color: #6c757d;
}

.zvg-taktik-row-danger td {
    background: #fff5f5;
}

.zvg-taktik-row-danger .zvg-rechner-val {
    color: #c0392b;
    font-weight: 700;
    font-size: 1.05rem;
}

.zvg-taktik-row-warn td {
    background: #fffbf0;
}

.zvg-taktik-row-warn .zvg-rechner-val {
    color: #e67e22;
    font-weight: 700;
    font-size: 1.05rem;
}

.zvg-taktik-row-info td {
    background: #f0f7ff;
}

.zvg-taktik-row-info .zvg-rechner-val {
    color: #2980b9;
    font-weight: 700;
    font-size: 1.05rem;
}

.zvg-taktik-ergebnis {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
    margin-top: .5rem;
}

/* ---- ZVG Rendite-Rechner (Investoren-Rendite-Check) ----------------------- */
.zvg-rendite-rechner-wrap {
    max-width: 860px;
    margin: 0 auto;
    font-family: inherit;
}

.zvg-rendite-ergebnis {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
    margin-top: .5rem;
}

.zvg-rendite-ergebnis h3 {
    margin-top: 0;
    font-size: 1.1rem;
}

.zvg-rendite-cashflow-title {
    margin-top: 1.5rem;
}

.zvg-rendite-table .zvg-rechner-hint {
    display: block;
    margin-top: .2rem;
}

.zvg-rendite-row-brutto td {
    background: #f0fff4;
}

.zvg-rendite-row-brutto .zvg-rendite-pct {
    color: #1a7f46;
    font-weight: 700;
    font-size: 1.1rem;
}

.zvg-rendite-row-netto td {
    background: #e8f5e9;
}

.zvg-rendite-row-netto .zvg-rendite-pct {
    color: #2e7d32;
    font-weight: 700;
    font-size: 1.1rem;
}

.zvg-rendite-cashflow {
    font-size: 1.05rem;
}

.zvg-rendite-cashflow-pos strong {
    color: #0e9f6e;
}

.zvg-rendite-cashflow-neg strong {
    color: #e02424;
}

/* ---- ZVG Bieter-Checkliste (Die „Gerichts-Packliste") --------------------- */
.zvg-bc-wrap {
    max-width: 740px;
    margin: 0 auto;
    font-family: inherit;
}

.zvg-bc-quiz {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    margin-top: 1.25rem;
}

.zvg-bc-question {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 1.1rem 1.25rem;
}

.zvg-bc-question-label {
    margin: 0 0 .75rem 0;
    font-size: 1rem;
}

.zvg-bc-option {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    padding: .45rem .5rem;
    border-radius: 6px;
    cursor: pointer;
    transition: background .15s;
    font-size: .95rem;
    line-height: 1.4;
}

.zvg-bc-option:hover {
    background: #e9ecef;
}

.zvg-bc-option input[type="radio"] {
    margin-top: .15rem;
    flex-shrink: 0;
    accent-color: #1a56db;
}

.zvg-bc-result {
    margin-top: 1.75rem;
    background: #f0f7ff;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
}

.zvg-bc-result-title {
    margin: 0 0 1rem 0;
    font-size: 1.1rem;
    color: #1e3a5f;
}

.zvg-bc-list {
    list-style: none;
    padding: 0;
    margin: 0 0 1rem 0;
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.zvg-bc-list-item {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    font-size: .95rem;
    line-height: 1.5;
}

.zvg-bc-checkbox {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.2rem;
    height: 1.2rem;
    min-width: 1.2rem;
    border: 2px solid #1a56db;
    border-radius: 3px;
    background: #fff;
    margin-top: .15rem;
}

.zvg-bc-item-text {
    flex: 1;
}

/* =========================================================================
   Market-Radar Widget
   ========================================================================= */

.zvg-market-radar-section {
    padding: 1.25rem 0;
}

.zvg-radar-intro {
    color: var(--zvg-text-muted);
    font-size: .9rem;
    margin-bottom: 1.25rem;
}

/* ---- Bar ---------------------------------------------------------------- */

.zvg-radar-bar-wrap {
    max-width: 640px;
    margin-bottom: 1rem;
}

.zvg-radar-bar {
    position: relative;
    display: flex;
    height: 20px;
    border-radius: 10px;
    overflow: visible;
    box-shadow: 0 1px 3px rgba(0,0,0,.12);
}

.zvg-radar-zone {
    flex: 1;
    height: 100%;
}

.zvg-radar-zone-green {
    background: linear-gradient(to right, #22c55e, #86efac);
    border-radius: 10px 0 0 10px;
}

.zvg-radar-zone-neutral {
    background: #e5e7eb;
}

.zvg-radar-zone-red {
    background: linear-gradient(to left, #ef4444, #fca5a5);
    border-radius: 0 10px 10px 0;
}

/* ---- Indicator dot + label --------------------------------------------- */

.zvg-radar-indicator {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    pointer-events: none;
}

.zvg-radar-indicator::before {
    content: '';
    display: block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--zvg-primary, #1a56db);
    border: 3px solid #fff;
    box-shadow: 0 0 0 2px var(--zvg-primary, #1a56db), 0 2px 6px rgba(0,0,0,.25);
}

.zvg-radar-indicator-label {
    display: block;
    margin-top: 6px;
    font-size: .75rem;
    font-weight: 700;
    color: var(--zvg-text, #111827);
    white-space: nowrap;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 1px 5px;
    line-height: 1.4;
}

/* ---- Zone labels below the bar ---------------------------------------- */

.zvg-radar-bar-labels {
    display: flex;
    justify-content: space-between;
    margin-top: 28px;
    font-size: .78rem;
    color: var(--zvg-text-muted, #6b7280);
}

.zvg-radar-label-left  { text-align: left; }
.zvg-radar-label-center { text-align: center; flex: 1; }
.zvg-radar-label-right { text-align: right; }

/* ---- Assessment text badge -------------------------------------------- */

.zvg-radar-text {
    margin: 1rem 0 .75rem;
    padding: .75rem 1rem;
    border-radius: 6px;
    font-size: .9375rem;
    line-height: 1.55;
    border-left: 4px solid transparent;
    max-width: 640px;
}

.zvg-radar-badge-green {
    background: #f0fdf4;
    border-left-color: #22c55e;
    color: #14532d;
}

.zvg-radar-badge-neutral {
    background: #f9fafb;
    border-left-color: #9ca3af;
    color: var(--zvg-text, #111827);
}

.zvg-radar-badge-red {
    background: #fef2f2;
    border-left-color: #ef4444;
    color: #7f1d1d;
}

/* ---- Detail row (prices + deviation) ----------------------------------- */

.zvg-radar-details {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.5rem;
    font-size: .875rem;
    max-width: 640px;
}

.zvg-radar-detail-item {
    display: flex;
    gap: .3rem;
    align-items: center;
}

.zvg-radar-detail-label {
    color: var(--zvg-text-muted, #6b7280);
}

.zvg-radar-val-green { color: #16a34a; }
.zvg-radar-val-red   { color: #dc2626; }

/* ---- Responsive -------------------------------------------------------- */

@media (max-width: 480px) {
    .zvg-radar-bar-labels {
        font-size: .72rem;
    }

    .zvg-radar-details {
        flex-direction: column;
        gap: .35rem;
    }
}

/* ---- Gutachten upload ---------------------------------------------------- */

.zvg-gutachten-upload-wrap {
    margin-top: 1.25rem;
    border-top: 1px solid var(--zvg-border, #e5e7eb);
    padding-top: 1rem;
}

.zvg-gutachten-promo {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    background: linear-gradient(135deg, #fefce8 0%, #fff7ed 100%);
    border: 1px solid #fde68a;
    border-left: 4px solid #f59e0b;
    border-radius: var(--zvg-radius, 6px);
    padding: .875rem 1rem;
    margin-bottom: 1rem;
}

.zvg-promo-icon {
    font-size: 1.5rem;
    line-height: 1;
    flex-shrink: 0;
}

.zvg-promo-text {
    font-size: .9rem;
    color: #78350f;
}

.zvg-promo-text strong {
    display: block;
    font-size: 1rem;
    margin-bottom: .35rem;
    color: #92400e;
}

.zvg-promo-text p {
    margin: 0 0 .5rem;
    line-height: 1.5;
}

.zvg-upload-form {
    display: flex;
    flex-direction: column;
    gap: .65rem;
}

.zvg-upload-label {
    font-size: .9rem;
    font-weight: 500;
    color: var(--zvg-text, #111827);
}

.zvg-upload-input {
    font-size: .875rem;
    padding: .35rem 0;
}

.zvg-upload-btn {
    align-self: flex-start;
}

.zvg-upload-btn:disabled {
    opacity: .65;
    cursor: not-allowed;
}

.zvg-upload-status {
    font-size: .875rem;
    margin: 0;
    min-height: 1.25em;
}

.zvg-upload-success {
    color: #15803d;
}

.zvg-upload-error {
    color: #dc2626;
}

.zvg-upload-login-btn {
    display: inline-block;
    margin-top: .5rem;
}

/* ================================================================
   [immobilien_karte] – Interactive Immobilienkarte Deutschland
   ================================================================ */

/* Wrapper */
.zvg-immo-karte {
    position: relative;
    font-family: inherit;
}
.wp-block-post-content:has(.zvg-immo-karte) {
    padding: 0 !important;
}

/* ── Toolbar ────────────────────────────────────────────────── */
.zvg-ik-toolbar {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.zvg-ik-search-wrap {
    display: flex;
    gap: 8px;
}

.zvg-ik-search {
    flex: 1;
    min-width: 0;
}

.zvg-ik-search-label {
    display: inline;
}

.zvg-ik-filter-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}

.zvg-ik-filter {
    min-width: 150px;
}

.zvg-ik-price-wrap {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.zvg-ik-price-caption {
    font-size: .85rem;
    color: #6b7280;
    white-space: nowrap;
}

.zvg-ik-price-input {
    width: 100px;
}

.zvg-ik-price-sep {
    color: #6b7280;
}

/* ── Main layout ────────────────────────────────────────────── */
.zvg-ik-main {
    display: flex;
    height: 600px;
    border: 1px solid #e5e7eb;
    border-radius: 0 0 8px 8px;
    overflow: hidden;
}

/* ── Map ─────────────────────────────────────────────────────── */
.zvg-ik-map-container {
    flex: 1 1 auto;
    position: relative;
    min-width: 0;
}

.zvg-ik-map {
    width: 100%;
    height: 100%;
}

.zvg-ik-map-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(255, 255, 255, .9);
    padding: 8px 16px;
    border-radius: 4px;
    font-size: .9rem;
    color: #6b7280;
    pointer-events: none;
    z-index: 1000;
    display: none;
}

/* ── Side panel ─────────────────────────────────────────────── */
.zvg-ik-panel {
    width: 320px;
    flex: 0 0 320px;
    display: flex;
    flex-direction: column;
    border-left: 1px solid #e5e7eb;
    background: #fff;
    overflow: hidden;
}

.zvg-ik-tabs {
    display: flex;
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
    flex-shrink: 0;
}

.zvg-ik-tab {
    flex: 1;
    padding: 10px 8px;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    font-size: .85rem;
    font-weight: 500;
    color: #6b7280;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: color .15s, border-color .15s;
}

.zvg-ik-tab:hover {
    color: #1e40af;
}

.zvg-ik-tab--active {
    color: #1e40af;
    border-bottom-color: #2563eb;
    background: #fff;
}

.zvg-ik-count-badge {
    background: #2563eb;
    color: #fff;
    border-radius: 10px;
    padding: 1px 7px;
    font-size: .75rem;
    font-weight: 600;
    min-width: 20px;
    text-align: center;
}

.zvg-ik-pane {
    flex: 1;
    overflow-y: auto;
    padding: 0;
}

.zvg-ik-pane--hidden {
    display: none;
}

/* ── Object list ────────────────────────────────────────────── */
.zvg-ik-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.zvg-ik-list-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid #f3f4f6;
    cursor: pointer;
    transition: background .1s;
}

.zvg-ik-list-item:hover,
.zvg-ik-list-item--hl {
    background: #eff6ff;
}

.zvg-ik-list-type-dot {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-top: 5px;
}

.zvg-ik-list-body {
    flex: 1;
    min-width: 0;
}

.zvg-ik-list-title {
    display: block;
    font-weight: 500;
    font-size: .85rem;
    color: #111827;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zvg-ik-list-title:hover {
    color: #2563eb;
    text-decoration: underline;
}

.zvg-ik-list-meta {
    display: flex;
    gap: 4px;
    font-size: .75rem;
    color: #6b7280;
    margin-top: 2px;
    flex-wrap: wrap;
}

.zvg-ik-list-meta span + span::before {
    content: '\00b7';
    margin-right: 4px;
}

.zvg-ik-list-price {
    font-size: .8rem;
    font-weight: 600;
    color: #1e40af;
    margin-top: 3px;
}

.zvg-ik-fav-btn--list {
    flex-shrink: 0;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.1rem;
    color: #d97706;
    padding: 2px 4px;
    line-height: 1;
    align-self: center;
}

.zvg-ik-fav-btn--list:hover {
    color: #92400e;
}

.zvg-ik-list-loading,
.zvg-ik-list-empty,
.zvg-ik-list-error {
    padding: 16px 14px;
    font-size: .85rem;
    color: #6b7280;
    list-style: none;
}

/* ── Popup ───────────────────────────────────────────────────── */
.zvg-ik-popup {
    padding: 4px;
    min-width: 220px;
}

.zvg-ik-popup-title {
    display: block;
    font-size: .9rem;
    margin-bottom: 6px;
}

.zvg-ik-popup-meta {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    font-size: .78rem;
    color: #6b7280;
    margin-bottom: 6px;
}

.zvg-ik-popup-meta span + span::before {
    content: '\00b7';
    margin-right: 6px;
}

.zvg-ik-popup-price {
    font-size: .9rem;
    font-weight: 600;
    color: #1e40af;
    margin-bottom: 8px;
}

.zvg-ik-popup-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

/* ── Cluster icons ───────────────────────────────────────────── */
.zvg-ik-cluster {
    background: #2563eb;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: .8rem;
    border: 3px solid rgba(255, 255, 255, .8);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .2);
}

.zvg-ik-cluster--small  { width: 36px; height: 36px; }
.zvg-ik-cluster--medium { width: 44px; height: 44px; background: #d97706; }
.zvg-ik-cluster--large  { width: 52px; height: 52px; background: #dc2626; }

/* ── Mobile sheet toggle ─────────────────────────────────────── */
.zvg-ik-sheet-toggle {
    display: none;
    width: 100%;
    background: #2563eb;
    color: #fff;
    border: none;
    padding: 12px 16px;
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    border-radius: 0 0 8px 8px;
    gap: 8px;
    align-items: center;
    justify-content: center;
}

.zvg-ik-sheet-toggle:hover {
    background: #1d4ed8;
}

.zvg-ik-sheet-toggle .zvg-ik-count-badge {
    background: rgba(255, 255, 255, .3);
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 768px) {
    .zvg-ik-main {
        height: auto;
        flex-direction: column;
        border-radius: 0;
    }

    .zvg-ik-toolbar {
        border-radius: 8px 8px 0 0;
    }

    .zvg-ik-map-container {
        height: 55vw;
        min-height: 80vh;
    }

    .zvg-ik-panel {
        width: 100%;
        flex: 0 0 auto;
        max-height: 0;
        border-left: none;
        border-top: 1px solid #e5e7eb;
        overflow: hidden;
        transition: max-height .3s ease;
    }

    .zvg-ik-panel--open {
        max-height: 55vh;
        overflow: visible;
    }

    .zvg-ik-panel--open .zvg-ik-pane {
        overflow-y: auto;
    }

    .zvg-ik-sheet-toggle {
        display: flex;
        border-radius: 0 0 8px 8px;
    }

    .zvg-ik-filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .zvg-ik-filter {
        min-width: 0;
        width: 100%;
    }

    .zvg-ik-price-wrap {
        flex-wrap: wrap;
    }

    .zvg-ik-price-input {
        width: 90px;
    }

    .zvg-ik-search-label {
        display: none;
    }
}

@media (max-width: 480px) {
    .zvg-ik-map-container {
        height: 50vw;
        min-height: 80vh;
                width: 100vw;

    }
}

.zvg-score{
    width: 150px;
}
/* ==========================================================================
   Landing-page shortcode [zvg_landingpage]
   ========================================================================== */

/* ── Shared layout helpers ─────────────────────────────────────────────── */
.zvg-lp {
    font-family: inherit;
    color: #1f2937;
}

.zvg-lp-container {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 24px;
}

.zvg-lp-section {
    padding: 72px 0;
}

.zvg-lp-section--alt {
    background: #f8fafc;
}

.zvg-lp-section-title {
    font-size: 2rem;
    font-weight: 800;
    text-align: center;
    margin: 0 0 16px;
    line-height: 1.2;
    color: #111827;
}

.zvg-lp-section-intro {
    text-align: center;
    max-width: 680px;
    margin: 0 auto 48px;
    color: #4b5563;
    font-size: 1.05rem;
    line-height: 1.7;
}

.zvg-germany-section{
    background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 100%);
    color: #fff;
}
.zvg-germany-wrapper {
    max-width: 1120px;
    margin: 0 auto;
    padding: 72px 24px;
    text-align: center;
  
}
.zvg-germany-wrapper h2 {
    font-size: 2.5rem;
    font-weight: 900;
    line-height: 1.2;
      color:white;
    margin: 0 0 20px;
}

.zvg-lp-testimonials{
    background:none;
}
.zvg-lp-testi-cta{
    text-align: center;
     margin-top: 32px;
}
.zvg-lp-testimonials .zvg-lp-btn-primary{
    background: #f59e0b;
    color: #1a1a1a;
    font-size: .95rem;
    font-weight: 800;
    padding: 16px 24px;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background .2s;
    
}

p.zvg-lp-hero-hint{
    color:white;
}


/* ── Shared button ─────────────────────────────────────────────────────── */
.zvg-lp-btn-primary {
    display: inline-block;
    background: #2563eb;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    padding: 14px 28px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    text-decoration: none;
    transition: background .2s, transform .1s;
    line-height: 1.2;
}

.zvg-lp-btn-primary:hover {
    background: #1d4ed8;
    color: #fff;
    transform: translateY(-1px);
    text-decoration: none;
}

/* ── 1. Hero ───────────────────────────────────────────────────────────── */
.zvg-lp-hero {
    background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 60%, #3b82f6 100%);
    color: #fff;
    padding: 96px 0 80px;
    text-align: center;
}

.zvg-lp-hero-inner {
    max-width: 800px;
}

.zvg-lp-hero-h1 {
    font-size: clamp(1.75rem, 4vw, 2.75rem);
    font-weight: 900;
    line-height: 1.2;
    margin: 0 0 20px;
    color: #fff;
}

.zvg-lp-hero-sub {
    font-size: 1.1rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, .88);
    margin: 0 0 40px;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
}

.zvg-lp-hero-form {
    margin: 0 auto 24px;
    max-width: 640px;
}

.zvg-lp-hero-search-bar {
    display: flex;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, .3);
}

.zvg-lp-hero-input {
    flex: 1;
    padding: 16px 20px;
    font-size: 1rem;
    border: none;
    outline: none;
    color: #111827;
    background: #fff;
    min-width: 0;
}

.zvg-lp-hero-btn {
    background: #f59e0b;
    color: #1a1a1a;
    font-size: .95rem;
    font-weight: 800;
    padding: 16px 24px;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background .2s;
    flex-shrink: 0;
}

.zvg-lp-hero-btn:hover {
    background: #d97706;
}

.zvg-lp-hero-hint {
    color: rgba(255, 255, 255, .8);
    font-size: .88rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
    margin: 0;
}

.zvg-lp-icon-check {
    width: 14px;
    height: 14px;
    color: #4ade80;
    flex-shrink: 0;
}

/* ── 2. Pain–Agitate–Solve ─────────────────────────────────────────────── */
.zvg-lp-compare {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 24px;
    align-items: start;
    margin-bottom: 48px;
}

.zvg-lp-compare-before,
.zvg-lp-compare-after {
    background: #fff;
    border-radius: 12px;
    padding: 32px 28px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .08);
}

.zvg-lp-compare-before {
    border-top: 4px solid #ef4444;
}

.zvg-lp-compare-after {
    border-top: 4px solid #22c55e;
}

.zvg-lp-compare-icon {
    font-size: 2.5rem;
    margin-bottom: 12px;
}

.zvg-lp-compare-title {
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #6b7280;
    margin: 0 0 8px;
}

.zvg-lp-compare-label {
    font-size: 1.2rem;
    font-weight: 800;
    color: #111827;
    margin: 0 0 20px;
}

.zvg-lp-compare-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.zvg-lp-compare-list li {
    font-size: .95rem;
    padding-left: 24px;
    position: relative;
    line-height: 1.5;
    color: #374151;
}

.zvg-lp-compare-list--bad li::before {
    content: '✗';
    color: #ef4444;
    position: absolute;
    left: 0;
    font-weight: 700;
}

.zvg-lp-compare-list--good li::before {
    content: '✓';
    color: #22c55e;
    position: absolute;
    left: 0;
    font-weight: 700;
}

.zvg-lp-compare-arrow {
    font-size: 2rem;
    color: #9ca3af;
    align-self: center;
    padding-top: 32px;
    font-weight: 700;
}

.zvg-lp-pas-cta {
    text-align: center;
}

/* ── 4. Features ───────────────────────────────────────────────────────── */
.zvg-lp-features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.zvg-lp-feature-card {
    background: #fff;
    border-radius: 12px;
    padding: 36px 28px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .07);
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: box-shadow .2s, transform .2s;
}

.zvg-lp-feature-card:hover {
    box-shadow: 0 8px 28px rgba(0, 0, 0, .12);
    transform: translateY(-3px);
}

.zvg-lp-feature-card--highlight {
    background: #eff6ff;
    border: 2px solid #2563eb;
}

.zvg-lp-feature-icon {
    font-size: 2.4rem;
}

.zvg-lp-feature-badge {
    display: inline-block;
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: 3px 10px;
    border-radius: 20px;
    width: fit-content;
}

.zvg-lp-feature-badge--free {
    background: #dcfce7;
    color: #15803d;
}

.zvg-lp-feature-badge--premium {
    background: #dbeafe;
    color: #1d4ed8;
}

.zvg-lp-feature-title {
    font-size: 1.1rem;
    font-weight: 800;
    color: #111827;
    margin: 0;
    line-height: 1.3;
}

.zvg-lp-feature-desc {
    font-size: .93rem;
    color: #4b5563;
    line-height: 1.7;
    margin: 0;
    flex: 1;
}

.zvg-lp-feature-btn {
    margin-top: 8px;
    text-align: center;
}

/* ── 5. Testimonials ───────────────────────────────────────────────────── */
.zvg-lp-testi-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.zvg-lp-testi-card {
    background: #fff;
    border-radius: 12px;
    padding: 32px 28px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .07);
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.zvg-lp-testi-quote {
    margin: 0;
    flex: 1;
}

.zvg-lp-testi-quote p {
    font-size: .97rem;
    line-height: 1.75;
    color: #374151;
    font-style: italic;
    margin: 0;
    position: relative;
    padding-left: 24px;
}

.zvg-lp-testi-quote p::before {
    content: '\201C';
    font-size: 3rem;
    color: #2563eb;
    position: absolute;
    left: -4px;
    top: -12px;
    line-height: 1;
    font-style: normal;
}

.zvg-lp-testi-author {
    display: flex;
    flex-direction: column;
    gap: 2px;
    border-top: 1px solid #e5e7eb;
    padding-top: 16px;
}

.zvg-lp-testi-name {
    font-weight: 700;
    font-size: .95rem;
    color: #111827;
}

.zvg-lp-testi-role {
    font-size: .85rem;
    color: #6b7280;
}

/* ── 6. Blog teasers ───────────────────────────────────────────────────── */
.zvg-lp-blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.zvg-lp-blog-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .07);
    display: flex;
    flex-direction: column;
    transition: box-shadow .2s, transform .2s;
}

.zvg-lp-blog-card:hover {
    box-shadow: 0 8px 28px rgba(0, 0, 0, .12);
    transform: translateY(-3px);
}

.zvg-lp-blog-thumb-link {
    display: block;
}

.zvg-lp-blog-thumb {
    width: 100%;
    height: 180px;
    object-fit: cover;
    display: block;
}

.zvg-lp-blog-content {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}

.zvg-lp-blog-title {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
}

.zvg-lp-blog-title a {
    color: #111827;
    text-decoration: none;
}

.zvg-lp-blog-title a:hover {
    color: #2563eb;
}

.zvg-lp-blog-excerpt {
    font-size: .9rem;
    color: #6b7280;
    line-height: 1.6;
    margin: 0;
    flex: 1;
}

.zvg-lp-blog-read-more {
    font-size: .88rem;
    font-weight: 600;
    color: #2563eb;
    text-decoration: none;
}

.zvg-lp-blog-read-more:hover {
    text-decoration: underline;
}

/* ── 7. Newsletter / Lead Magnet ───────────────────────────────────────── */
.zvg-lp-newsletter {
    background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 100%);
    color: #fff;
}

.zvg-lp-nl-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: center;
}

.zvg-lp-nl-lead-magnet-badge {
    display: inline-block;
    background: rgba(255, 255, 255, .15);
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 20px;
    padding: 5px 14px;
    font-size: .82rem;
    font-weight: 600;
    margin-bottom: 16px;
    letter-spacing: .04em;
}

.zvg-lp-nl-title {
    font-size: 1.55rem;
    font-weight: 800;
    line-height: 1.35;
    color: #fff;
    text-align: left;
    margin: 0 0 20px;
}

.zvg-lp-nl-bullets {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.zvg-lp-nl-bullets li {
    font-size: .95rem;
    color: rgba(255, 255, 255, .9);
    line-height: 1.5;
}

.zvg-lp-nl-form-wrap {
    background: #fff;
    border-radius: 16px;
    padding: 40px 36px;
}

.zvg-lp-nl-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.zvg-lp-nl-label {
    font-size: .9rem;
    font-weight: 600;
    color: #374151;
}

.zvg-lp-nl-input {
    padding: 13px 16px;
    font-size: 1rem;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    outline: none;
    color: #111827;
    transition: border-color .2s;
}

.zvg-lp-nl-input:focus {
    border-color: #2563eb;
}

.zvg-lp-nl-submit {
    width: 100%;
    text-align: center;
    font-size: 1rem;
    padding: 15px 20px;
    border-radius: 8px;
}

.zvg-lp-nl-privacy {
    font-size: .8rem;
    color: #9ca3af;
    margin: 0;
    text-align: center;
}

.zvg-lp-nl-msg {
    font-size: .9rem;
    text-align: center;
    min-height: 1.4em;
}

.zvg-lp-nl-msg--success {
    color: #15803d;
    font-weight: 600;
}

.zvg-lp-nl-msg--error {
    color: #dc2626;
}

/* ── Responsive ────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .zvg-lp-features-grid,
    .zvg-lp-testi-grid,
    .zvg-lp-blog-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .zvg-lp-compare {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .zvg-lp-compare-arrow {
        display: none;
    }
}

@media (max-width: 768px) {
    .zvg-lp-section {
        padding: 48px 0;
    }

    .zvg-lp-section-title {
        font-size: 1.6rem;
    }

    .zvg-lp-hero {
        padding: 64px 0 56px;
    }

    .zvg-lp-hero-h1 {
        font-size: 1.75rem;
    }

    .zvg-lp-hero-search-bar {
        flex-direction: column;
        border-radius: 10px;
        overflow: visible;
    }

    .zvg-lp-hero-input {
        border-radius: 10px 10px 0 0;
    }

    .zvg-lp-hero-btn {
        border-radius: 0 0 10px 10px;
        padding: 14px 20px;
    }

    .zvg-lp-features-grid,
    .zvg-lp-testi-grid,
    .zvg-lp-blog-grid {
        grid-template-columns: 1fr;
    }

    .zvg-lp-nl-inner {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .zvg-lp-nl-form-wrap {
        padding: 28px 20px;
    }

    .zvg-lp-nl-title {
        font-size: 1.25rem;
    }
}

@media (max-width: 480px) {
    .zvg-lp-container {
        padding: 0 16px;
    }

    .zvg-lp-compare-before,
    .zvg-lp-compare-after {
        padding: 24px 20px;
    }
}



.leaflet-marker-icon.zvg-ik-cluster{
    display: flex;
}