/* VVI-Scoreseite — Statisches Template */
*{box-sizing:border-box;margin:0;padding:0}
:root{--text:#1a1a1a;--muted:#6b7280;--subtle:#9ca3af;--border:#e5e7eb;--bg:#fff;--bg2:#f9fafb;--accent:#1a5632;--r:10px;
--font-heading:'Poppins',sans-serif;--font-body:'Work Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
body{font-family:var(--font-body);font-size:16px;line-height:1.6;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}

/* Header */
.sh{border-bottom:1px solid var(--border);padding:14px 0}
.sh-inner{max-width:900px;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between}
.sh-logo{font-weight:700;font-size:.9rem;color:var(--text);text-decoration:none}
.sh-nav a{font-size:.82rem;color:var(--muted);text-decoration:none}

/* VVI Header */
.vvi-header{background:var(--accent);color:#fff;padding:48px 24px}
.vvi-header-inner{max-width:900px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px}
.vvi-header h1{font-family:var(--font-heading);font-size:clamp(1.4rem,3vw,2rem);font-weight:700;letter-spacing:-0.02em}
.vvi-meta{font-size:.9rem;opacity:.8;margin-top:4px}
.vvi-score-big{text-align:center;flex-shrink:0}
.vvi-score-number{font-size:3.5rem;font-weight:800;line-height:1;letter-spacing:-0.03em}
.vvi-score-label{font-size:.75rem;opacity:.7;margin-top:4px}
.vvi-score-label span{font-size:.65rem}

/* Body */
.vvi-body{max-width:900px;margin:0 auto;padding:32px 24px 80px}
.vvi-section{margin-bottom:40px}
.vvi-section h2{font-size:1.1rem;font-weight:700;margin-bottom:16px;padding-bottom:8px;border-bottom:1px solid var(--border)}

/* VVI Balken (Fallback) */
.vvi-dims{display:flex;flex-direction:column;gap:12px}
.vvi-dim{display:grid;grid-template-columns:140px 1fr 50px;gap:12px;align-items:center}
.vvi-dim-label{font-size:.82rem;color:var(--muted)}
.vvi-dim-bar{height:8px;background:var(--bg2);border-radius:4px;overflow:hidden}
.vvi-dim-fill{height:100%;border-radius:4px;transition:width .3s}
.vvi-dim-val{font-size:.75rem;color:var(--subtle);text-align:right}

/* VVI-Karten — Filmfestival-Stil */
.vvi-cards{display:flex;justify-content:center;padding:var(--space-l,2rem) 0;gap:0;flex-wrap:wrap}
.vvi-card{position:relative;width:180px;aspect-ratio:2/3;border-radius:16px;overflow:hidden;flex-shrink:0;
margin-left:-20px;transition:transform .2s ease,box-shadow .2s ease;cursor:default;
box-shadow:0 2px 4px rgba(0,0,0,0.08),0 8px 16px rgba(0,0,0,0.12),0 20px 40px rgba(0,0,0,0.16);border:none}
.vvi-card:first-child{margin-left:0}
.vvi-card:nth-child(1){--rot:-1.5deg}.vvi-card:nth-child(2){--rot:0.8deg}.vvi-card:nth-child(3){--rot:-0.5deg}
.vvi-card:nth-child(4){--rot:1.2deg}.vvi-card:nth-child(5){--rot:-1.0deg}.vvi-card:nth-child(6){--rot:0.3deg}
.vvi-card{transform:rotate(var(--rot,0deg))}
.vvi-card:hover{transform:rotate(0deg) translateY(-8px) scale(1.02);
box-shadow:0 4px 8px rgba(0,0,0,0.10),0 16px 32px rgba(0,0,0,0.16),0 40px 80px rgba(0,0,0,0.20);z-index:2}
.vvi-cards:hover .vvi-card:not(:hover){transform:rotate(var(--rot,0deg)) scale(0.96);opacity:0.85}
.vvi-card__score{position:absolute;top:14px;left:14px;width:40px;height:40px;background:rgba(255,255,255,0.95);
border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-heading,'Poppins',sans-serif);
font-weight:700;font-size:16px;box-shadow:0 2px 8px rgba(0,0,0,0.2)}
.vvi-card__value{font-family:var(--font-heading,'Poppins',sans-serif);font-weight:700;font-size:56px;
color:rgba(255,255,255,0.2);position:absolute;bottom:56px;right:12px;line-height:1}
.vvi-card__footer{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,0.3);
padding:10px 12px;backdrop-filter:blur(4px)}
.vvi-card__title{font-family:var(--font-heading,'Poppins',sans-serif);font-weight:700;font-size:11px;
color:#fff;letter-spacing:.1em;text-transform:uppercase;margin:0 0 2px}
.vvi-card__sub{font-family:var(--font-body,'Work Sans',sans-serif);font-weight:400;font-size:10px;
color:rgba(255,255,255,0.75);margin:0;line-height:1.3}
@media(max-width:768px){
.vvi-cards{overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start;padding-left:16px;-webkit-overflow-scrolling:touch}
.vvi-card{margin-left:-12px;min-width:160px}
.vvi-card:first-child{margin-left:0}
}

/* Facts */
.vvi-facts{display:flex;gap:24px;flex-wrap:wrap}
.vvi-fact{text-align:center;padding:16px 24px;background:var(--bg2);border-radius:var(--r);min-width:120px}
.vvi-fact-num{display:block;font-size:1.5rem;font-weight:700;color:var(--accent);letter-spacing:-0.02em}
.vvi-fact-label{display:block;font-size:.75rem;color:var(--muted);margin-top:4px}

/* Details */
.vvi-details{list-style:none;padding:0}
.vvi-details li{padding:8px 0;border-bottom:1px solid var(--border);font-size:.9rem;color:var(--muted)}
.vvi-details li:last-child{border-bottom:none}
.vvi-details a{color:var(--accent)}

/* CTA */
.vvi-cta{background:var(--bg2);padding:32px;border-radius:var(--r);border:1px solid var(--border);text-align:center}
.vvi-cta h2{border-bottom:none;padding-bottom:0}
.vvi-cta p{font-size:.9rem;color:var(--muted);margin-bottom:20px}
.vvi-cta-form{display:flex;gap:8px;max-width:440px;margin:0 auto}
.vvi-cta-form input{flex:1;padding:10px 14px;border:1px solid var(--border);border-radius:8px;font-size:.9rem;font-family:inherit}
.vvi-cta-form button{padding:10px 24px;background:var(--accent);color:#fff;border:none;border-radius:8px;font-size:.9rem;font-weight:600;cursor:pointer;font-family:inherit}
.vvi-cta-form button:hover{background:#14472a}
.vvi-cta-status{margin-top:12px;font-size:.85rem;color:var(--muted)}

/* Footer */
.sf{border-top:1px solid var(--border);padding:28px 24px;text-align:center;font-size:.8rem;color:var(--subtle)}
.sf-inner{max-width:900px;margin:0 auto}
.sf-links{margin-top:6px}
.sf-links a{color:var(--muted);text-decoration:none;margin:0 10px}
.sf-updated{margin-top:6px;font-size:.7rem}

@media(max-width:600px){
.vvi-header-inner{flex-direction:column;text-align:center}
.vvi-dim{grid-template-columns:100px 1fr 40px}
.vvi-cta-form{flex-direction:column}
.vvi-facts{flex-direction:column;align-items:center}
}