@font-face { font-family:'Inter'; font-style:normal; font-weight:400 800; font-display:swap; src:url(/assets/fonts/inter-latin.woff2) format('woff2'); }
@font-face { font-family:'Source Serif 4'; font-style:normal; font-weight:500 700; font-display:swap; src:url(/assets/fonts/source-serif-4-latin.woff2) format('woff2'); }
:root {
  --vb-navy:#0d2b49; --vb-navy-2:#16406a; --vb-navy-3:#1f5a8c;
  --vb-sage:#5f8e7f; --vb-sage-2:#a3c4b8; --vb-mint:#ebf3f0; --vb-mint-2:#f5f9f7;
  --vb-sky:#f3f6fa; --vb-sky-2:#e3e9f1;
  --vb-ink:#0f1c2b; --vb-ink-2:#364354; --vb-muted:#667283; --vb-line:#e2e8ef; --vb-line-2:#d2dae4;
  --vb-white:#fff;
  --vb-serif:'Source Serif 4', Georgia, 'Times New Roman', serif;
  --vb-sans:'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --vb-radius:14px; --vb-radius-lg:20px;
  --vb-shadow:0 1px 2px rgba(13,43,73,.04), 0 12px 32px -18px rgba(13,43,73,.30);
}
*, *::before, *::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body { margin:0; font-family:var(--vb-sans); font-size:16px; color:var(--vb-ink-2); background:var(--vb-white); line-height:1.65; min-height:100vh; display:flex; flex-direction:column; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
a { color:var(--vb-navy-3); text-decoration:none; }
a:hover { text-decoration:underline; text-underline-offset:3px; }
img { max-width:100%; height:auto; display:block; }
h1, h2, h3, h4 { font-family:var(--vb-serif); color:var(--vb-ink); line-height:1.2; margin:0 0 14px; font-weight:600; letter-spacing:-.012em; }
h1 { font-size:40px; }
h2 { font-size:28px; margin-top:36px; }
h3 { font-size:20px; margin-top:26px; font-family:var(--vb-sans); font-weight:700; letter-spacing:-.005em; }
p { margin:0 0 16px; }
ul, ol { padding-left:22px; margin:0 0 18px; }
li { margin-bottom:6px; }
address { font-style:normal; }
:focus-visible { outline:3px solid var(--vb-sage-2); outline-offset:2px; border-radius:4px; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--vb-sage); margin-bottom:14px; }
.eyebrow::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--vb-sage); box-shadow:0 0 0 4px var(--vb-mint); }

.site-header { background:rgba(255,255,255,.92); -webkit-backdrop-filter:saturate(1.4) blur(10px); backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid var(--vb-line); position:sticky; top:0; z-index:50; }
.site-header-inner { max-width:1140px; margin:0 auto; padding:14px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.site-logo { display:block; line-height:0; }
.site-logo img { height:34px; width:auto; }
.site-nav { display:flex; align-items:center; gap:6px; font-size:14.5px; font-weight:600; }
.site-nav a { color:var(--vb-ink-2); padding:8px 12px; border-radius:999px; transition:background .15s, color .15s; }
.site-nav a:hover { background:var(--vb-mint); color:var(--vb-navy); text-decoration:none; }

main { flex:1; }
.container { max-width:1140px; margin:0 auto; padding:0 24px; }
.container-narrow { max-width:740px; margin:0 auto; padding:0 24px; }
.section { padding:56px 0; }

.hero { position:relative; overflow:hidden; background:linear-gradient(180deg, var(--vb-sky) 0%, var(--vb-white) 100%); border-bottom:1px solid var(--vb-line); padding:64px 0 56px; }
.hero::after { content:""; position:absolute; right:-140px; top:-160px; width:460px; height:460px; border-radius:50%; background:radial-gradient(circle, rgba(113,159,144,.28) 0%, rgba(113,159,144,0) 70%); pointer-events:none; }
.hero-inner { position:relative; max-width:1140px; margin:0 auto; padding:0 24px; }
.hero h1 { font-size:48px; color:var(--vb-navy); max-width:760px; margin-bottom:16px; }
.hero .lead { font-size:19px; color:var(--vb-ink-2); max-width:640px; margin:0; }
.trust-row { display:flex; flex-wrap:wrap; gap:10px 26px; margin-top:30px; font-size:13.5px; color:var(--vb-muted); }
.trust-row span { display:inline-flex; align-items:center; gap:8px; }
.trust-row span::before { content:"✓"; display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:50%; background:var(--vb-mint); color:var(--vb-sage); font-size:11px; font-weight:800; }
.section-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:22px; }
.section-title { font-family:var(--vb-sans); font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--vb-muted); margin:0; }
.article-grid { display:grid; gap:26px; grid-template-columns:1fr; }
@media (min-width:760px) { .article-grid { grid-template-columns:1fr 1fr; } }
.card { display:flex; flex-direction:column; background:var(--vb-white); border:1px solid var(--vb-line); border-radius:var(--vb-radius-lg); overflow:hidden; color:inherit; box-shadow:var(--vb-shadow); transition:transform .2s, box-shadow .2s; }
.card:hover { text-decoration:none; transform:translateY(-3px); box-shadow:0 1px 2px rgba(13,43,73,.05), 0 22px 44px -22px rgba(13,43,73,.38); }
.card img { width:100%; aspect-ratio:16/10; object-fit:cover; }
.card-body { padding:20px 22px 24px; display:flex; flex-direction:column; flex:1; }
.card-label { display:flex; gap:8px; align-items:center; font-size:12px; color:var(--vb-muted); margin-bottom:10px; }
.card-label b { font-weight:700; color:var(--vb-sage); letter-spacing:.08em; text-transform:uppercase; font-size:11px; }
.card h2 { font-size:21px; line-height:1.28; margin:0 0 10px; }
.card p { font-size:15px; margin:0; color:var(--vb-ink-2); }
.card-more { margin-top:auto; padding-top:16px; font-size:14px; font-weight:700; color:var(--vb-navy-3); }
.card-more::after { content:" →"; }
.about { background:var(--vb-sky); border-top:1px solid var(--vb-line); }
.about-grid { display:grid; gap:20px; grid-template-columns:1fr; }
@media (min-width:760px) { .about-grid { grid-template-columns:repeat(3, 1fr); } }
.about-item { background:var(--vb-white); border:1px solid var(--vb-sky-2); border-radius:var(--vb-radius); padding:20px 22px; }
.about-item h3 { margin:0 0 6px; font-size:16px; color:var(--vb-navy); }
.about-item p { margin:0; font-size:14.5px; }

.prose h1 { margin-bottom:18px; }
.prose h2 { font-size:24px; }
.prose p, .prose li, .prose address { color:#2b3747; }
.prose .meta { color:var(--vb-muted); font-size:13px; margin-bottom:30px; }
.prose .box { background:var(--vb-sky); border:1px solid var(--vb-line); border-radius:var(--vb-radius); padding:16px 20px; margin:0 0 18px; }
.prose .box p:last-child { margin-bottom:0; }

.site-footer { margin-top:24px; background:var(--vb-navy); color:rgba(255,255,255,.78); font-size:14px; }
.footer-top { max-width:1140px; margin:0 auto; padding:52px 24px 36px; display:grid; gap:32px 40px; grid-template-columns:1.6fr 1fr 1fr 1.4fr; }
.footer-logo { display:inline-block; line-height:0; margin-bottom:16px; }
.footer-logo img { height:30px; width:auto; filter:brightness(0) invert(1); opacity:.96; }
.footer-about p, .footer-note p { margin:0; line-height:1.6; }
.footer-col { display:flex; flex-direction:column; gap:8px; }
.footer-h { margin:0 0 6px; font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--vb-sage-2); }
.footer-col a { color:#fff; width:max-content; }
.footer-col a:hover { color:var(--vb-sage-2); text-decoration:none; }
.footer-bottom { max-width:1140px; margin:0 auto; padding:22px 24px 30px; border-top:1px solid rgba(255,255,255,.14); display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 32px; }
.footer-disc { margin:0; max-width:760px; font-size:12.5px; line-height:1.6; color:rgba(255,255,255,.62); }
.footer-ai { flex-basis:100%; margin:0; font-size:11.5px; line-height:1.5; color:rgba(255,255,255,.5); }
.footer-copy { margin:0; font-size:12.5px; color:rgba(255,255,255,.62); white-space:nowrap; }
@media (max-width:860px) { .footer-top { grid-template-columns:1fr 1fr; } .footer-about { grid-column:1 / -1; } .footer-note { grid-column:1 / -1; } }

.err { max-width:560px; margin:0 auto; padding:90px 24px; text-align:center; }
.err .num { font-family:var(--vb-serif); font-size:104px; font-weight:600; line-height:1; color:var(--vb-sage-2); margin:0 0 12px; }

@media (max-width:600px) {
  body { font-size:15.5px; }
  h1 { font-size:30px; }
  h2 { font-size:24px; }
  .hero { padding:42px 0 38px; }
  .hero h1 { font-size:34px; }
  .hero .lead { font-size:17px; }
  .site-header-inner { padding:12px 16px; }
  .site-logo img { height:26px; }
  .site-nav { gap:2px; font-size:13.5px; }
  .site-nav a { padding:7px 9px; }
  .container, .container-narrow, .hero-inner { padding:0 16px; }
  .footer-top, .footer-bottom { padding-left:16px; padding-right:16px; }
  .footer-top { padding-top:40px; }
  .footer-copy { white-space:normal; }
}
@media (max-width:380px) { .site-nav a[href="/#artikel"] { display:none; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } .card, .site-nav a { transition:none; } }
