/* SECTION-SNIPPETS — geteiltes Styling für einfügbare Content-Bausteine (Stats/Team/Preise/Portfolio/Menü).
   Nutzt ausschließlich die Theme-Variablen, die TemplateEngine::themeStyle() auf .vl-userpage setzt
   (--primary, --bg, --text, --secondary, --primary-rgb, --radius, --serif, --sans) — passt sich
   dadurch automatisch an jedes Template an, unabhängig davon wo das Snippet eingefügt wird. */

/* Stats-Leiste */
.vl-userpage .vl-snip-stats{display:flex;flex-wrap:wrap;gap:2.5rem;margin:2rem 0;padding:2rem 0;border-top:1px solid rgba(var(--primary-rgb),.2);border-bottom:1px solid rgba(var(--primary-rgb),.2)}
.vl-userpage .vl-snip-stats .vl-snip-stat-num{font-family:var(--serif);font-size:1.9rem;font-weight:700;line-height:1;color:var(--primary)}
.vl-userpage .vl-snip-stats .vl-snip-stat-label{font-size:.72rem;opacity:.6;margin-top:.3rem;letter-spacing:.05em;text-transform:uppercase}

/* Team-Teaser */
.vl-userpage .vl-snip-team{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;padding:3rem 0}
.vl-userpage .vl-snip-team-img{aspect-ratio:4/5;background:var(--secondary);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;color:rgba(var(--primary-rgb),.4);font-family:var(--serif)}
.vl-userpage .vl-snip-team-pills{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem}
.vl-userpage .vl-snip-team-pill{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--primary);border:1px solid rgba(var(--primary-rgb),.4);border-radius:var(--radius);padding:.5rem 1rem}
@media(max-width:900px){.vl-userpage .vl-snip-team{grid-template-columns:1fr}}

/* Preistabelle */
.vl-userpage .vl-snip-pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin:2rem 0}
.vl-userpage .vl-snip-price-card{background:var(--secondary);border:1px solid rgba(var(--primary-rgb),.2);border-radius:var(--radius);padding:2rem 1.6rem;position:relative}
.vl-userpage .vl-snip-price-card--featured{border-color:var(--primary);transform:scale(1.03)}
.vl-userpage .vl-snip-price-name{font-family:var(--serif);font-weight:700;font-size:1.1rem;margin-bottom:.5rem}
.vl-userpage .vl-snip-price-amount{font-family:var(--serif);font-size:1.8rem;font-weight:700;color:var(--primary);margin-bottom:.8rem}
.vl-userpage .vl-snip-price-desc{font-size:.85rem;opacity:.65;line-height:1.6}
@media(max-width:900px){.vl-userpage .vl-snip-pricing{grid-template-columns:1fr}.vl-userpage .vl-snip-price-card--featured{transform:none}}

/* Portfolio-/Vorher-Nachher-Grid */
.vl-userpage .vl-snip-portfolio{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin:2rem 0}
.vl-userpage .vl-snip-portfolio-tile{aspect-ratio:4/3;background:var(--secondary);border-radius:var(--radius);border:1px solid rgba(var(--primary-rgb),.16);display:flex;flex-direction:column;align-items:center;justify-content:center;color:rgba(var(--primary-rgb),.4);font-family:var(--serif);overflow:hidden}
.vl-userpage .vl-snip-portfolio-tile img{width:100%;height:100%;object-fit:cover}
.vl-userpage .vl-snip-portfolio-caption{font-size:.78rem;opacity:.65;margin-top:.5rem;text-align:center}
@media(max-width:900px){.vl-userpage .vl-snip-portfolio{grid-template-columns:1fr 1fr}}

/* Menükarte */
.vl-userpage .vl-snip-menu{margin:2rem 0}
.vl-userpage .vl-snip-menu-cat{font-family:var(--serif);font-size:1.3rem;font-weight:700;color:var(--primary);margin:1.6rem 0 .8rem;padding-bottom:.4rem;border-bottom:1px solid rgba(var(--primary-rgb),.25)}
.vl-userpage .vl-snip-menu-item{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px dashed rgba(var(--primary-rgb),.15)}
.vl-userpage .vl-snip-menu-item-name{font-weight:600}
.vl-userpage .vl-snip-menu-item-desc{font-size:.82rem;opacity:.6;margin-top:.2rem}
.vl-userpage .vl-snip-menu-item-price{font-family:var(--serif);font-weight:700;color:var(--primary);white-space:nowrap}