.vl-page { --vl-ink:#094f79; --vl-blue:#008fb7; --vl-line:#d9e5ed; color:var(--vl-ink); width:100%; min-width:0; }

.vl-page *, .vl-page *::before, .vl-page *::after { box-sizing:border-box; }

.vl-page [hidden] { display:none !important; }

.vl-page .vl-shell { width:calc(100% - 64px); max-width:1400px; margin-inline:auto; }

.vl-page h1, .vl-page h2, .vl-page h3, .vl-page p { margin-top:0; }

.vl-page h2 { font-size:clamp(1.6rem,2.1vw,2rem); font-weight:400; line-height:1.25; margin-bottom:.9rem; }

.vl-page p { line-height:1.7; }

.vl-page a { color:var(--vl-ink); }

.vl-page :is(a,button,input,select,summary):focus-visible { outline:3px solid #0589b9; outline-offset:4px; }

.vl-page .vl-eyebrow { color:#087da1; text-transform:uppercase; letter-spacing:.1em; font-weight:600; font-size:.74rem; margin:0 0 1rem; }

.vl-hero { background:radial-gradient(ellipse at 90% 20%,#d5f0f1 0,transparent 48%),linear-gradient(110deg,#f8fbfd,#eaf3f9); border-bottom:1px solid var(--vl-line); }

.vl-page .vl-hero-grid { display:grid; grid-template-columns:1.12fr 1fr; align-items:center; gap:5rem; padding-block:3.4rem; }

.vl-page .vl-hero h1 { font-size:clamp(2rem,3vw,3rem); font-weight:400; line-height:1.15; letter-spacing:-.025em; margin-bottom:1.2rem; }

.vl-page .vl-hero h1 strong { display:block; color:var(--vl-blue); font-weight:600; margin:0; padding:0; }

.vl-page .vl-hero h1 strong::before { content:none; }

.vl-page .vl-lead { max-width:53ch; font-size:1.02rem; color:#456579; margin:0 0 1.4rem; }

.vl-page a.vl-primary { display:inline-flex; align-items:center; justify-content:center; gap:1.5rem; min-height:48px; padding:.75rem 1.2rem; background:linear-gradient(120deg,#ff7820,#fa5106); color:white; border:1px solid #f65f15; border-radius:7px; font-size:.93rem; font-weight:600; text-decoration:none; box-shadow:0 4px 9px #ec63171c; }

.vl-page a.vl-primary:hover { background:#ed540b; }

.vl-page .vl-hero-note { font-size:.78rem; color:#506f82; margin:.8rem 0 0; }

.vl-example { background:#fff; border:1px solid #d2e4ed; border-radius:16px; box-shadow:0 15px 40px #1b557a0e; overflow:hidden; }

.vl-example-top { display:flex; align-items:center; gap:.6rem; padding:1rem 1.5rem; border-bottom:1px solid #e5eef3; font-size:.78rem; color:#527386; background:#ffffffb3; }

.vl-example-dot { width:8px; height:8px; background:#12b78d; border-radius:50%; }

.vl-page .vl-example-label { margin:1.5rem 1.7rem .8rem; font-size:.76rem; color:#59798b; }

.vl-page .vl-example blockquote { padding:0; margin:0 1.7rem 1.6rem; font-size:clamp(1.1rem,1.4vw,1.35rem); font-weight:400; line-height:1.6; border:0; color:var(--vl-ink); }

.vl-example mark { color:inherit; background:#dff6ed; padding:.04em .15em; border-radius:3px; }

.vl-example-bottom { padding:1.15rem 1.7rem; border-top:1px solid #e5eef3; display:flex; justify-content:space-between; align-items:center; gap:.6rem 1.2rem; flex-wrap:wrap; }

.vl-example-bottom > span { font-size:.76rem; color:#587488; }

.vl-example-bottom a { display:inline-flex; align-items:center; min-height:44px; gap:.7rem; font-size:.85rem; font-weight:600; text-decoration:none; }

.vl-step-strip { border-bottom:1px solid var(--vl-line); }

.vl-page .vl-steps { padding-block:1.3rem; padding-inline:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; list-style:none; }

.vl-steps li { display:flex; align-items:center; gap:1rem; }

.vl-steps li > span { font-size:1.3rem; font-weight:400; color:#79a5ba; }

.vl-steps strong { font-size:.88rem; font-weight:600; }

.vl-steps small { display:block; color:#597285; font-size:.76rem; margin-top:.15rem; }

.vl-page .vl-catalog { padding-block:3rem; scroll-margin-top:140px; }

.vl-page #vorlagentexte { padding-top:3rem !important; }

.vl-catalog-top { display:flex; align-items:end; justify-content:space-between; gap:2rem; margin-bottom:1.7rem; }

.vl-catalog-top .vl-eyebrow { margin-bottom:.55rem; }

.vl-catalog-top h2 { margin:0; }

.vl-search { width:380px; flex-shrink:0; }

.vl-search > span, .vl-mobile-topic label { display:block; margin-bottom:.45rem; font-size:.8rem; font-weight:500; }

.vl-search input, .vl-mobile-topic select { width:100%; min-width:0; min-height:46px; padding:.65rem .9rem; font:inherit; font-size:.93rem; color:var(--vl-ink); background:#fff; border:1px solid #b4cddb; border-radius:7px; margin:0; }

.vl-page .vl-search input[type="search"], .vl-page .vl-mobile-topic select { box-sizing:border-box; width:100%; padding:.65rem .9rem; margin:0; }

.vl-page .vl-layout { display:block; }

.vl-page.vl-ready .vl-layout { display:grid; grid-template-columns:270px minmax(0,1fr); gap:2rem; align-items:start; }

.vl-topics { background:#f5f8fb; border:1px solid var(--vl-line); border-radius:10px; padding:.65rem; }

:is(.vl-topics,.vl-quick-links) a { display:flex; justify-content:space-between; align-items:center; gap:.6rem; min-height:44px; padding:.6rem .7rem; border-radius:6px; line-height:1.35; font-size:.84rem; text-decoration:none; border:1px solid transparent; }

:is(.vl-topics,.vl-quick-links) a:hover { background:#e8f1f7; }

:is(.vl-topics,.vl-quick-links) a[aria-current="true"] { color:#fff; background:#0b537f; border-color:#0b537f; }

.vl-topic-count { font-size:.73rem; opacity:.8; }

.vl-page .vl-topics p { font-size:.65rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:#638092; margin:1.1rem .7rem .4rem; }

.vl-results { min-width:0; }

.vl-results-head { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:.4rem 1rem; }

.vl-page #vl-results-title { font-size:1.3rem; font-weight:500; margin:0; line-height:1.4; }

.vl-page #vl-result-count { color:#5c7688; font-size:.8rem; margin:0; }

.vl-page .vl-customize { font-size:.8rem; color:#5c7688; margin:.45rem 0 1.1rem; }

.vl-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }

.vl-page .vorlage-card { min-width:0; display:flex; flex-direction:column; padding:1.25rem; border-radius:10px; border:1px solid var(--vl-line); background:#fff; box-shadow:none; margin:0; }

.vl-page .vorlage-card-head { margin:0 0 .8rem; }

.vl-page .vorlage-card-eyebrow { font-size:.83rem; font-weight:600; text-transform:none; letter-spacing:0; line-height:1.5; color:#087da1; }

.vl-page .vorlage-card-text { font-size:.92rem; line-height:1.75; font-weight:400; color:#3c5e74; margin:0 0 1.1rem; flex:1; max-width:none; }

.vl-page .vorlage-card-actions { display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; margin-top:auto; padding-top:.7rem; border-top:1px solid #edf1f5; }

.vl-page .vorlage-card-btn { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:.5rem .8rem; border-radius:6px; font:inherit; font-size:.8rem; font-weight:500; text-decoration:none; cursor:pointer; }

.vl-page .vorlage-card-btn--ghost { color:#0b537f; border:1px solid #c7dbe7; background:#fff; }

.vl-page .vorlage-card-btn--solid { color:#fff; border:1px solid #0b537f; background:#0b537f; }

.vl-page .vorlage-card-btn--solid:hover { background:#063d60; }

.vl-page .vorlage-card-btn--ghost:hover { background:#f1f7fa; }

.vl-page .vorlage-card-btn.is-copied { background:#e1f5eb; color:#116542; }

.vl-card-topic { display:none; font-size:.68rem; color:#638092; margin-bottom:.3rem; }

.vl-page.vl-all .vl-card-topic { display:block; }

.vl-empty { padding:2rem; border:1px dashed #b9cedc; border-radius:10px; background:#f8fbfd; }

.vl-more { text-align:center; margin-top:1.3rem; }

.vl-page :is(#vl-more,#vl-reset) { min-height:44px; padding:.6rem 1.2rem; border:1px solid #b5ccda; border-radius:6px; background:white; color:var(--vl-ink); font:inherit; font-size:.9rem; cursor:pointer; }

.vl-listen { background:#f0f7fa; border-block:1px solid var(--vl-line); }

.vl-page .vl-listen-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; padding-block:2.5rem; }

.vl-page .vl-listen p { font-size:.92rem; max-width:52ch; margin-bottom:0; color:#506e81; }

.vl-page .grid-hero-audio { display:grid; grid-template-columns:minmax(0,1fr); gap:.8rem; width:100%; margin:0; }

.vl-page .contentbox_hero_audioplayer { width:100%; max-width:none; min-width:0; min-height:60px; margin:0; background:#fff; box-shadow:none; border:1px solid #d1e1eb; border-radius:9px; padding:.8rem 1rem; cursor:pointer; }

.vl-page .contentbox_hero_audioplayer p.inhalt { margin:0; font-size:.85rem; }

.vl-page .vl-faq-section { display:grid; grid-template-columns:1fr 1.5fr; gap:4rem; padding-block:3rem; }

.vl-faq-section > div > p:not(.vl-eyebrow) { max-width:40ch; color:#597285; font-size:.92rem; }

.vl-faq details { border-bottom:1px solid var(--vl-line); }

.vl-faq details:first-child { border-top:1px solid var(--vl-line); }

.vl-faq summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:64px; padding:1rem 0; cursor:pointer; list-style:none; font-size:.94rem; font-weight:500; }

.vl-faq summary::-webkit-details-marker { display:none; }

.vl-faq summary::after { content:'+'; font-size:1.3rem; font-weight:400; color:#078ab2; flex-shrink:0; }

.vl-faq details[open] summary::after { content:'−'; }

.vl-faq details > div { color:#526f82; padding:0 1.5rem 1.25rem 0; line-height:1.75; font-size:.9rem; }

.vl-finish { background:#0a507b; }

.vl-page .vl-finish-inner { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding-block:2.5rem; }

.vl-page .vl-finish h2 { color:#fff; margin-bottom:.5rem; }

.vl-page .vl-finish p { color:#d3e9f4; margin:0; font-size:.92rem; }

.vl-finish .vl-primary { flex-shrink:0; }

@media(max-width:1100px) {

 .vl-page .vl-hero-grid { gap:2rem; }

 .vl-page.vl-ready .vl-layout { grid-template-columns:225px minmax(0,1fr); gap:1.2rem; }

 .vl-cards { grid-template-columns:minmax(0,1fr); }

 .vl-search { width:310px; }

}

@media(max-width:760px) {

 .vl-page .vl-shell { width:calc(100% - 40px); }

 .vl-page .vl-hero-grid { grid-template-columns:minmax(0,1fr); padding-block:2rem; gap:1.5rem; }

 .vl-page .vl-hero h1 { font-size:2.15rem; }

 .vl-page .vl-example blockquote { font-size:1.1rem; }

 .vl-page .vl-steps { gap:1rem; padding-block:1.1rem; }

 .vl-steps li { gap:.5rem; align-items:flex-start; }

 .vl-steps li > span { font-size:.9rem; }

 .vl-steps strong { font-size:.76rem; line-height:1.3; display:block; }

 .vl-steps small { display:none; }

 .vl-catalog-top { flex-direction:column; align-items:stretch; gap:1rem; }

 .vl-search { width:100%; }

 .vl-page.vl-ready .vl-layout { display:block; }

 .vl-page .vl-topics { display:none; }

 .vl-mobile-topic { margin-bottom:1.25rem; }

 .vl-page .vl-listen-grid, .vl-page .vl-faq-section { grid-template-columns:minmax(0,1fr); gap:1.5rem; padding-block:2rem; }

 .vl-page .vl-finish-inner { flex-direction:column; align-items:flex-start; padding-block:2rem; gap:1.5rem; }

 .vl-page .vl-catalog { padding-block:2rem; }

 .vl-page #vorlagentexte { padding-top:2rem !important; }

}

@media(min-width:761px) { .vl-page .vl-mobile-topic { display:none; } }



/* Compact template browser: previews first, full text on demand. */

.vl-page .vl-hero-grid{padding-block:2.3rem;gap:3.5rem}

.vl-page .vl-hero h1{font-size:clamp(1.9rem,2.6vw,2.7rem)}

.vl-page .vl-example blockquote{font-size:1.13rem;line-height:1.65}

.vl-page .vl-example-top{padding-block:.8rem}

.vl-page .vl-example-label{margin-top:1.1rem}

.vl-page .vl-example-bottom{padding-block:.8rem}

.vl-page .vl-steps{padding-block:1rem}

.vl-page.vl-ready .vl-cards{grid-template-columns:minmax(0,1fr);gap:.65rem}

.vl-page.vl-ready .vorlage-card{padding:0;overflow:hidden;transition:border-color .18s,box-shadow .18s}

.vl-page.vl-ready .vorlage-card:has(details[open]){border-color:#a8c6d7;box-shadow:0 5px 18px #16435b08}

.vl-page .vl-detail summary{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.25rem 1rem;list-style:none;cursor:pointer;padding:1rem 1.25rem;min-height:76px}

.vl-page .vl-detail summary::-webkit-details-marker{display:none}

.vl-page .vl-detail summary:hover{background:#f6fafc}

.vl-page .vl-detail summary:focus-visible{outline:3px solid #0589b9;outline-offset:-3px}

.vl-page .vl-detail .vorlage-card-head{margin:0;grid-column:1;line-height:1.4}

.vl-page .vl-detail .vorlage-card-eyebrow{font-size:.94rem;font-weight:500;color:#175575}

.vl-page .vl-preview{grid-column:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.82rem;color:#637b8b;line-height:1.55;min-width:0}

.vl-page .vl-open-label{grid-column:2;grid-row:1 / 3;align-self:center;color:#087da1;font-size:.76rem;display:flex;align-items:center;gap:.8rem}

.vl-page .vl-open-label::after{content:'+';font-size:1.25rem;font-weight:400}

.vl-page details[open] .vl-open-label::after{content:'−'}

.vl-page details[open] .vl-preview{display:none}

.vl-page details[open] summary{min-height:64px;background:#f6fafc;border-bottom:1px solid #e5edf2}

.vl-page .vl-detail-body{padding:1.2rem 1.25rem}

.vl-page .vl-detail-body .vorlage-card-text{font-size:.95rem;line-height:1.8;max-width:85ch}

.vl-page .vl-detail-body .vorlage-card-actions{justify-content:flex-end}

.vl-page .vl-topics{background:#fafcfd;padding:.5rem;border-color:#e0e9ef}

.vl-page .vl-topics a{font-size:.81rem}

.vl-page .vl-topics p{margin-top:.9rem}

@media(min-width:1101px){.vl-page .vl-topics{position:sticky;top:100px}}

@media(max-width:760px){

 .vl-page .vl-hero-grid{padding-block:1.7rem;gap:1.3rem}

 .vl-page .vl-example blockquote{font-size:1rem}

 .vl-page .vl-detail summary{padding:.95rem 1rem;gap:.3rem .6rem}

 .vl-page .vl-open-label{font-size:0;gap:0}

 .vl-page .vl-open-label::after{font-size:1.3rem}

 .vl-page .vl-detail-body{padding:1rem}

 .vl-page .vl-detail-body .vorlage-card-actions{justify-content:flex-start}

}



/* Compact introduction: search and frequent topics directly within reach. */

.vl-page .vl-hero-grid { display:block; padding-block:3.5rem; }

.vl-page .vl-hero-copy { max-width:1100px; }

.vl-page .vl-hero h1 { margin-bottom:1.1rem; }

.vl-page .vl-hero h1 strong { display:inline; }

.vl-page .vl-lead { max-width:none; margin-bottom:1.8rem; }

.vl-page .vl-hero .vl-search { display:block; width:100%; max-width:640px; }

.vl-page .vl-quick-links { display:flex; flex-wrap:wrap; gap:.35rem .65rem; margin-top:1rem; }

.vl-page .vl-quick-links a { border-color:var(--vl-line); background:#fff; }

.vl-page .vl-quick-links a:hover { background:#e8f1f7; }

.vl-page .vl-quick-links a[aria-current="true"] { background:#0b537f; border-color:#0b537f; color:#fff; }

.vl-page #vorlagentexte { padding-top:2rem !important; }

.vl-page .vl-catalog-top { margin-bottom:1.25rem; }

@media(max-width:760px) {

 .vl-page .vl-hero-grid { padding-block:2rem; }

 .vl-page .vl-hero h1 { font-size:1.9rem; }

 .vl-page .vl-lead { font-size:.95rem; }

 .vl-page .vl-quick-links { gap:.4rem; }

 .vl-page #vorlagentexte { padding-top:1.5rem !important; }

}


/* Choose the occasion first; all template content remains in the server HTML. */
.vl-page .vl-layout,.vl-page.vl-ready .vl-layout{display:block}
.vl-page .vl-topics,.vl-page .vl-topic-grid{position:static;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;background:none;border:0;padding:0}
.vl-page :is(.vl-topics,.vl-topic-grid) a{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;min-height:100px;padding:18px 30px 18px 18px;border:1px solid var(--vl-line);border-radius:10px;background:#fff;font-size:15px;line-height:1.4;text-decoration:none;color:var(--vl-ink)}
.vl-page :is(.vl-topics,.vl-topic-grid) a:hover{background:#f1f8fb;border-color:#8eb9ce}
.vl-page :is(.vl-topics,.vl-topic-grid) small{font-size:12px;font-weight:400;color:#5c7688}
.vl-page .vl-choice-arrow{position:absolute;right:12px;top:50%;translate:0 -50%;color:#087da1}
.vl-page .vl-industries{margin-top:22px;border-top:1px solid var(--vl-line);padding-top:14px}
.vl-page .vl-industries>summary{width:max-content;max-width:100%;cursor:pointer;font-size:15px;line-height:1.5;padding:8px 0}
.vl-page .vl-industries .vl-topic-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:10px}
.vl-page .vl-show-all{display:inline-block;margin-top:18px;font-size:14px;text-underline-offset:4px}
.vl-page .vl-results{max-width:1000px}
.vl-page:not(.vl-ready) .vl-results{margin-top:32px}
.vl-page .vl-back{display:inline-flex;align-items:center;min-height:40px;padding:8px 0;margin:0 0 16px;background:none;border:0;color:var(--vl-ink);font:inherit;font-size:14px;font-weight:500;cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.vl-page .vl-detail summary{min-height:60px;gap:8px 16px;align-items:center}
.vl-page .vl-open-label{grid-row:1}
.vl-page .vl-detail .vorlage-card-eyebrow{font-size:16px}
.vl-page .vl-detail summary .vorlage-card-head{align-self:center}
.vl-page .vl-detail-body .vorlage-card-actions{justify-content:flex-start}
@media(max-width:1100px){.vl-page .vl-topics{grid-template-columns:repeat(3,minmax(0,1fr))}.vl-page .vl-industries .vl-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.vl-page .vl-topics,.vl-page .vl-industries .vl-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.vl-page :is(.vl-topics,.vl-topic-grid) a{font-size:14px;min-height:96px;padding:14px 24px 14px 14px}.vl-page .vl-choice-arrow{right:8px}.vl-page .vl-detail summary{min-height:58px}.vl-page .vl-detail .vorlage-card-eyebrow{font-size:15px}}
@media(max-width:360px){.vl-page .vl-topics,.vl-page .vl-industries .vl-topic-grid{grid-template-columns:1fr}.vl-page :is(.vl-topics,.vl-topic-grid) a{min-height:72px}}