@font-face {
font-family: "SG Inter";
src: url("inter-variable.woff2") format("woff2");
font-weight: 100 900;
font-style: normal;
font-display: swap;
}
:root {
--ink: #111a14;
--ink-2: #3b4640;
--ink-3: #5b6660;
--green: #004b18;
--green-700: #003611;
--green-50: #edf4ef;
--gold: #ddab3e;
--gold-hover: #e8bb55;
--gold-soft: #fdf3dc;
--band: #f2f3f5;
--line: #d9dde0;
--line-2: #e8ebed;
--edge: #8f9a95;
--paper: #ffffff;
--error: #a13f35;
--error-on-green: #ffd6cf;
--land: #e3e6e8;
--water: #c6dbe2;
--radius: 5px;
--shadow-card: 0 2px 6px rgba(10, 30, 16, .12), 0 24px 56px -20px rgba(10, 30, 16, .45);
--shadow-pop: 0 12px 32px -8px rgba(0, 0, 0, .35);
--ease-out: cubic-bezier(.16, 1, .3, 1);
--wrap: 1160px;
--gutter: clamp(16px, 4vw, 40px);
color-scheme: light;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 20px; }
body {
margin: 0;
background: var(--paper);
color: var(--ink);
font-family: "SG Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
font-optical-sizing: auto;
font-size: 17px;
line-height: 1.6;
-webkit-font-smoothing: antialiased;
}
::selection { background: var(--green); color: #fff; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: var(--green); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }
button, input, select, textarea { font: inherit; color: inherit; }
input, textarea { caret-color: var(--green); }
h1, h2, h3 { margin: 0; text-wrap: balance; font-weight: 450; }
p { margin: 0; text-wrap: pretty; }
ul, ol, dl, dd { margin: 0; padding: 0; list-style: none; }
.vh { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.icon { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.num { font-variant-numeric: tabular-nums; }
.wrap { max-width: var(--wrap); margin: 0 auto; }
[hidden] { display: none !important; }
.btn {
display: inline-flex; align-items: center; justify-content: center; gap: 10px;
min-height: 52px; padding: 0 28px; border: 0; border-radius: 0;
font-size: 17px; font-weight: 600; letter-spacing: -.01em; line-height: 1.2; text-decoration: none; cursor: pointer;
transition: background .2s, color .2s;
}
.btn .icon { width: 18px; height: 18px; transition: transform .25s var(--ease-out); }
.btn:hover .icon--arrow { transform: translateX(3px); }
.btn--green { background: var(--green); color: #fff; }
.btn--green:hover { background: var(--green-700); text-decoration: none; }
.btn--gold { background: var(--gold); color: var(--ink); font-weight: 700; }
.btn--gold:hover { background: var(--gold-hover); text-decoration: none; }
.btn--gold:focus-visible { outline-color: #fff; }
.btn--sm { min-height: 44px; padding: 0 20px; gap: 8px; font-size: 15.5px; }
.btn--sm .icon { width: 16px; height: 16px; }
.btn--block { width: 100%; }
.more { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; text-decoration: none; }
.more .icon { width: 17px; height: 17px; transition: transform .25s var(--ease-out); }
.more:hover { text-decoration: underline; text-decoration-thickness: 1px; }
.more:hover .icon { transform: translateX(3px); }
.top { position: relative; z-index: 30; display: flex; align-items: center; gap: 28px; height: 76px; padding: 0 var(--gutter); background: var(--paper); }
.top__logo { flex: 0 1 auto; min-width: 0; }
.top__logo img { width: 257px; height: auto; }
.nav { flex: none; display: flex; align-items: center; gap: 2px; margin-left: auto; }
.top__cta, .menu-btn { flex: none; }
.nav a {
display: inline-flex; align-items: center; height: 44px; padding: 0 14px;
color: var(--ink); font-size: 15.5px; font-weight: 560; text-decoration: none;
box-shadow: inset 0 -2px 0 transparent; transition: color .2s, box-shadow .2s;
}
.nav a:hover { color: var(--green); }
.nav a[aria-current="page"] { color: var(--green); box-shadow: inset 0 -2px 0 var(--green); }
.top__cta .sm { display: none; }
.menu-btn { display: none; width: 44px; height: 44px; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 0; background: #fff; color: var(--ink); cursor: pointer; }
.menu-btn .icon { width: 22px; height: 22px; }
.menu-btn .icon--close, .menu-btn[aria-expanded="true"] .icon--menu { display: none; }
.menu-btn[aria-expanded="true"] .icon--close { display: block; }
.intro { position: relative; padding: 40px var(--gutter) 46px; background: var(--band); text-align: center; }
.intro::after { content: ""; position: absolute; left: 50%; bottom: -18px; width: 0; height: 0; transform: translateX(-50%); border: 18px solid transparent; border-bottom: 0; border-top-color: var(--band); z-index: 2; }
.intro h1 { font-size: clamp(1.9rem, 1.3rem + 1.4vw, 2.4rem); line-height: 1.12; letter-spacing: -.04em; }
.intro h1 span { color: var(--green); }
.intro__lede { max-width: 36em; margin: 14px auto 0; font-size: 18px; line-height: 1.5; color: var(--ink-2); }
.promises { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 26px; margin-top: 18px; font-size: 15.5px; font-weight: 520; }
.promises li { display: inline-flex; align-items: center; gap: 8px; }
.promises .icon { width: 18px; height: 18px; color: var(--green); stroke-width: 2.2; }
.pagehead { position: relative; padding: 20px var(--gutter) 40px; background: var(--band); }
.pagehead::after {
content: ""; position: absolute; bottom: -18px; width: 0; height: 0; z-index: 2;
left: calc(var(--gutter) + max(0px, (100% - 2 * var(--gutter) - var(--wrap)) / 2) + 26px);
border: 18px solid transparent; border-bottom: 0; border-top-color: var(--band);
}
.pagehead h1 { max-width: 21em; font-size: clamp(1.9rem, 1.3rem + 1.4vw, 2.4rem); line-height: 1.12; letter-spacing: -.04em; }
.pagehead__lede { max-width: 40em; margin-top: 12px; font-size: 18px; line-height: 1.5; color: var(--ink-2); }
.pagehead .tags { margin-top: 16px; }
.crumbs { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 20px; font-size: 13.5px; color: var(--ink-3); }
.crumbs a { color: var(--ink-2); text-decoration: none; }
.crumbs a:hover { color: var(--green); text-decoration: underline; }
.crumbs li + li::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 11px 1px 8px; border-top: 1.5px solid var(--edge); border-right: 1.5px solid var(--edge); transform: rotate(45deg); }
.meta { display: flex; flex-wrap: wrap; gap: 2px 22px; margin-top: 16px; font-size: 14px; color: var(--ink-3); }
.meta b { font-weight: 600; color: var(--ink-2); }
.stage { position: relative; isolation: isolate; overflow: hidden; overflow: clip; padding: 56px var(--gutter) 40px; background-color: #c5ced3; }
.stage::before {
content: ""; position: absolute; inset: -40px; z-index: -1; clip-path: inset(40px);
background-image: linear-gradient(180deg, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, .06) 100%), var(--stage-img, url("/wp-content/uploads/2023/08/pv-constuction-1536x1024.webp"));
background-size: cover; background-position: center 38%;
filter: blur(14px);
}
.card { position: relative; max-width: 640px; margin: 0 auto; padding: 26px 32px 30px; border-radius: var(--radius); background: var(--green); color: #fff; box-shadow: var(--shadow-card); scroll-margin-top: 24px; }
.card ::selection { background: var(--gold); color: var(--ink); }
.card__title { font-size: 26px; line-height: 1.2; letter-spacing: -.025em; color: #fff; }
.card__sub { margin-top: 6px; font-size: 15.5px; line-height: 1.45; color: rgba(255, 255, 255, .8); }
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 20px 0 4px; }
.steps li { position: relative; padding-top: 12px; font-size: 13.5px; font-weight: 600; color: rgba(255, 255, 255, .66); }
.steps li::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: rgba(255, 255, 255, .22); }
.steps li::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--gold); transform: scaleX(var(--fill, 0)); transform-origin: 0 50%; transition: transform .5s var(--ease-out); }
.steps li span { margin-right: 6px; font-variant-numeric: tabular-nums; }
.steps li.is-current { color: #fff; }
.steps li.is-done { color: rgba(255, 255, 255, .88); --fill: 1; }
.card fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.card fieldset:focus { outline: none; }
.card legend { padding: 0; margin: 18px 0 12px; font-size: 18px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; color: #fff; }
.q.is-in { animation: q-in .4s var(--ease-out) both; }
@keyframes q-in { from { opacity: 0; transform: translateX(14px); } to { opacity: 1; transform: none; } }
.q__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 40px; margin-top: 6px; font-size: 13.5px; font-weight: 600; color: rgba(255, 255, 255, .74); }
.q__foot .count { margin-left: auto; font-variant-numeric: tabular-nums; }
.choices { display: grid; gap: 8px; }
.choices--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.choices--grid .choice { min-height: 91px; }
.qs { display: grid; }
.qs > .q { grid-area: 1 / 1; }
.qs > .q[hidden] { display: block !important; visibility: hidden; pointer-events: none; }
.choice {
position: relative; display: flex; align-items: center; gap: 14px; min-height: 58px; padding: 9px 16px 9px 14px;
border-radius: var(--radius); background: #fff; color: var(--ink); cursor: pointer;
transition: background .2s, box-shadow .2s; -webkit-tap-highlight-color: transparent;
}
.choice input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.choice__icon { width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 3px; background: var(--green-50); color: var(--green); }
.choice__icon .icon { width: 27px; height: 27px; stroke-width: 1.9; }
.choice__text { flex: 1; font-size: 16px; font-weight: 600; line-height: 1.3; }
.choice__go { width: 26px; height: 26px; flex: none; display: grid; place-items: center; border-radius: 3px; color: var(--ink-3); transition: background .2s, color .2s, transform .25s var(--ease-out); }
.choice__go .icon { grid-area: 1 / 1; width: 18px; height: 18px; transition: opacity .2s, transform .3s var(--ease-out); }
.choice__go .icon--ok { width: 16px; height: 16px; stroke-width: 2.6; opacity: 0; transform: scale(.6); }
@media (hover: hover) {
.choice:hover { background: #f1f5f2; }
.choice:hover .choice__go { color: var(--green); transform: translateX(3px); }
}
.choice:has(input:focus-visible) { outline: 2px solid #fff; outline-offset: 2px; }
.choice:has(input:checked) { background: var(--gold-soft); box-shadow: inset 0 0 0 2px var(--gold); }
.choice:has(input:checked) .choice__go { background: var(--gold); color: var(--ink); transform: none; }
.choice:has(input:checked) .icon--go { opacity: 0; }
.choice:has(input:checked) .icon--ok { opacity: 1; transform: none; }
.actions { display: flex; align-items: center; gap: 18px; margin-top: 18px; }
.actions .btn { flex: 1; }
.back { flex: none; border: 0; padding: 8px 2px; background: none; color: #fff; font-size: 15px; font-weight: 600; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.back:hover { text-decoration-thickness: 2px; }
.back--next { display: inline-flex; align-items: center; gap: 6px; }
.back--next .icon { width: 16px; height: 16px; stroke-width: 2.2; }
.back:focus-visible, .card a:focus-visible { outline-color: #fff; }
.err { display: none; margin-top: 8px; align-items: flex-start; gap: 6px; font-size: 14px; font-weight: 560; color: var(--error-on-green); }
.err.is-shown { display: flex; }
.err .icon { width: 16px; height: 16px; margin-top: 2px; }
.picked { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 2px 0 2px; }
.picked li { display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px; border-radius: 3px; background: rgba(255, 255, 255, .14); color: #fff; font-size: 13.5px; font-weight: 600; }
.fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 10px; }
.field { display: grid; grid-column: span 2; }
.field--half { grid-column: span 1; }
.fields--addr { grid-template-columns: 150px minmax(0, 1fr); }
.field--plz, .field--city { grid-column: span 1; }
.hint { margin: 8px 0 2px; font-size: 14.5px; line-height: 1.45; color: rgba(255, 255, 255, .8); }
.lbl { display: block; margin-bottom: 6px; font-size: 14.5px; font-weight: 600; color: #fff; }
.lbl .opt { font-weight: 450; color: rgba(255, 255, 255, .74); }
.card input[type="text"], .card input[type="tel"], .card input[type="email"], .card textarea, .card select {
width: 100%; height: 50px; padding: 0 14px; border: 2px solid transparent; border-radius: var(--radius);
background: #fff; color: var(--ink); font: 500 16px/1.4 "SG Inter", system-ui, sans-serif;
transition: border-color .2s, box-shadow .2s;
}
.card textarea { height: auto; min-height: 84px; padding: 12px 14px; resize: vertical; }
.card input::placeholder, .card textarea::placeholder { color: #66716b; font-weight: 420; }
.card input:focus, .card textarea:focus, .card select:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(221, 171, 62, .35); }
.card [aria-invalid="true"] { border-color: #ff9b8f; }
select {
-webkit-appearance: none; appearance: none; padding-right: 40px !important; cursor: pointer;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111a14' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important; background-position: right 12px center !important; background-size: 18px !important;
}
.privacy { margin-top: 12px; text-align: center; font-size: 13px; line-height: 1.5; color: rgba(255, 255, 255, .76); }
.privacy a { color: #fff; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.done { padding: 18px 0 4px; }
.done__mark { width: 52px; height: 52px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 50%; background: var(--gold); color: var(--ink); animation: pop .6s var(--ease-out) both; }
.done__mark .icon { width: 26px; height: 26px; stroke-width: 2.6; }
.done h3 { font-size: 26px; letter-spacing: -.025em; color: #fff; }
.done p { margin-top: 10px; color: rgba(255, 255, 255, .88); }
.done .proto { margin-top: 16px; padding: 10px 12px; border-radius: 3px; background: rgba(255, 255, 255, .12); font-size: 13.5px; color: #fff; }
@keyframes pop { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
.proof { max-width: 760px; margin: 16px auto 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 22px; padding: 12px 16px; border-radius: var(--radius); background: rgba(255, 255, 255, .95); font-size: 14.5px; color: var(--ink-2); }
.proof b { color: var(--ink); font-weight: 650; font-variant-numeric: tabular-nums; }
.proof__item { display: inline-flex; align-items: center; gap: 8px; }
.stars { position: relative; display: inline-block; width: 80px; height: 15px; flex: none; }
.stars svg { position: absolute; inset: 0; width: 80px; height: 15px; }
.stars__base { fill: var(--line); }
.stars__fill { position: absolute; inset: 0; overflow: hidden; }
.stars__fill svg { max-width: none; fill: var(--gold); }
.sec { padding: clamp(64px, 8vw, 112px) var(--gutter); }
.sec--band { background: var(--band); }
.sec h2 { font-size: clamp(1.75rem, 1.2rem + 1.5vw, 2.4rem); line-height: 1.15; letter-spacing: -.03em; }
.sec__lede { margin-top: 14px; max-width: 34em; font-size: 18px; line-height: 1.5; color: var(--ink-2); }
.how { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr); gap: clamp(40px, 6vw, 88px); align-items: start; }
.how__steps { counter-reset: how; border-top: 1px solid var(--line); }
.how__steps li { counter-increment: how; display: grid; grid-template-columns: 44px 1fr; gap: 4px 18px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.how__steps li::before { content: counter(how); grid-row: span 2; width: 34px; height: 34px; display: grid; place-items: center; border: 1.5px solid var(--green); color: var(--green); font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; }
.how__steps h3 { font-size: 17.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35; }
.how__steps p { font-size: 16px; line-height: 1.55; color: var(--ink-2); max-width: 36em; }
.input, .select {
width: 100%; height: 50px; padding: 0 14px; border: 1.5px solid var(--edge); border-radius: var(--radius);
background-color: #fff; color: var(--ink); font: 500 16px/1.4 "SG Inter", system-ui, sans-serif; transition: border-color .2s, box-shadow .2s;
}
.input::placeholder { color: #66716b; font-weight: 420; }
.input:focus, .select:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(0, 75, 24, .18); }
.chmap { width: 100%; height: auto; overflow: visible; }
.chmap--zoom { overflow: hidden; }
.chmap .ct, .chmap .cap circle, .chmap .pin path { vector-effect: non-scaling-stroke; }
.chmap .ct { fill: var(--land); stroke: #4c585f; stroke-width: 1; stroke-linejoin: round; transition: fill .2s; }
.chmap a { cursor: pointer; }
.chmap a:hover .ct, .chmap a.is-hot .ct { fill: #c3d4c8; }
.chmap a:focus { outline: none; }
.chmap a:focus-visible .ct { fill: #c3d4c8; stroke: var(--green); stroke-width: 2.4; }
.chmap a.is-current .ct { fill: #c3d4c8; stroke: var(--green); stroke-width: 2.4; }
.chmap .lake { fill: var(--water); pointer-events: none; }
.chmap text { font-family: "SG Inter", system-ui, sans-serif; paint-order: stroke; stroke: rgba(255, 255, 255, .95); stroke-linejoin: round; pointer-events: none; }
.chmap .cap circle { fill: #26323a; stroke: #fff; stroke-width: 1.6; pointer-events: none; }
.chmap .cap text { font-size: calc(13px / var(--z, 1)); font-weight: 600; fill: #26323a; stroke-width: calc(3.2px / var(--z, 1)); }
.chmap .code { font-size: calc(11px / var(--z, 1)); font-weight: 720; letter-spacing: .14em; fill: #5d686f; stroke-width: calc(3px / var(--z, 1)); }
.chmap .pin path { fill: var(--green); stroke: #fff; stroke-width: 1.5; }
.chmap .pin__mark { transform-box: fill-box; transform-origin: 50% 100%; }
.chmap .pin text { font-size: calc(14.5px / var(--z, 1)); font-weight: 700; fill: var(--green); stroke-width: calc(4px / var(--z, 1)); }
.guide__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 14px 32px; }
.guide { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 56px); margin-top: 40px; align-items: start; }
.lead-story a { display: block; color: var(--ink); text-decoration: none; }
.lead-story img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius); background: var(--band); }
.lead-story h3 { margin-top: 18px; font-size: 26px; line-height: 1.2; letter-spacing: -.025em; }
.lead-story p { margin-top: 8px; font-size: 16.5px; line-height: 1.55; color: var(--ink-2); max-width: 34em; }
.lead-story a:hover h3 { color: var(--green); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.stories { border-top: 1px solid var(--line); }
.stories li { border-bottom: 1px solid var(--line); }
.stories a { display: grid; grid-template-columns: 112px 1fr; gap: 16px; align-items: center; padding: 14px 0; color: var(--ink); text-decoration: none; }
.stories img { width: 112px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 3px; background: var(--band); }
.stories b { font-size: 16.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35; }
.stories a:hover b { color: var(--green); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.voices__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 12px 32px; }
.voices__rate { display: inline-flex; align-items: center; gap: 10px; font-size: 15.5px; color: var(--ink-2); }
.voices__rate b { color: var(--ink); font-weight: 650; }
.quotes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 36px; }
.quote { margin: 0; padding: 4px 28px 4px; border-left: 1px solid var(--line); }
.quote:first-child { border-left: 0; padding-left: 0; }
.quote:last-child { padding-right: 0; }
.quote blockquote { margin: 0; font-size: 17.5px; line-height: 1.55; color: var(--ink); }
.quote figcaption { margin-top: 14px; font-size: 14.5px; color: var(--ink-3); }
.quote figcaption b { color: var(--ink); font-weight: 600; }
.quote__q { margin: 0 0 12px; font-size: 17.5px; font-weight: 600; line-height: 1.35; letter-spacing: 0; color: var(--ink); text-wrap: balance; }
.quote time { font-variant-numeric: tabular-nums; white-space: nowrap; }
.voices__more { margin-top: 32px; }
.faq { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: clamp(40px, 6vw, 88px); align-items: start; }
.faq__head p { margin-top: 14px; color: var(--ink-2); }
.faq__list { border-top: 1px solid var(--line); }
.faq__list details { border-bottom: 1px solid var(--line); }
.faq__list summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 19px 0; list-style: none; cursor: pointer; font-size: 17.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35; }
.faq__list summary::-webkit-details-marker { display: none; }
.faq__list summary .icon { color: var(--green); transition: transform .3s var(--ease-out); }
.faq__list details[open] summary .icon { transform: rotate(180deg); }
.faq__list summary:hover { color: var(--green); }
.faq__list details p { padding: 0 44px 20px 0; color: var(--ink-2); font-size: 16.5px; max-width: 40em; }
.faq__list details p + p { margin-top: -8px; }
.close { background: var(--green); color: #fff; text-align: center; }
.close h2 { color: #fff; }
.close .sec__lede { margin-left: auto; margin-right: auto; color: rgba(255, 255, 255, .84); }
.close .btn { margin-top: 32px; }
.close ::selection { background: var(--gold); color: var(--ink); }
.page { padding: clamp(46px, 6vw, 72px) var(--gutter) clamp(64px, 8vw, 104px); }
.cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: clamp(36px, 5vw, 76px); align-items: start; }
.aside { align-self: stretch; display: flex; flex-direction: column; gap: 18px; }
.aside > .toc { position: sticky; top: 24px; }
.cols--profile .aside { align-self: start; position: sticky; top: 24px; }
.prose { max-width: 44em; font-size: 17px; line-height: 1.65; }
.prose > * + * { margin-top: 1em; }
.prose h2 { margin-top: 2.2em; font-size: clamp(1.45rem, 1.2rem + .9vw, 1.85rem); line-height: 1.2; letter-spacing: -.028em; scroll-margin-top: 24px; }
.prose h2:first-child { margin-top: 0; }
.prose h2 + * { margin-top: .65em; }
.prose h3 { margin-top: 1.7em; font-size: 19px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35; }
.prose h3 + * { margin-top: .4em; }
.prose p, .prose li { color: var(--ink-2); }
.prose strong { font-weight: 600; color: var(--ink); }
.prose .answer { font-size: 19.5px; line-height: 1.55; color: var(--ink); }
.prose figure { margin: 1.6em 0 0; }
.prose figure img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius); background: var(--band); }
.list { display: grid; gap: 8px; }
.list li { position: relative; padding-left: 24px; }
.list li::before { content: ""; position: absolute; left: 3px; top: .66em; width: 7px; height: 7px; background: var(--green); }
.facts { margin-top: 1.6em; padding: 22px 24px 24px; border-radius: var(--radius); background: var(--green-50); }
.prose .facts h2 { margin: 0; font-size: 17.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35; }
.facts ul { margin-top: 12px; display: grid; gap: 9px; }
.facts li { display: grid; grid-template-columns: 20px 1fr; gap: 11px; font-size: 16.5px; line-height: 1.5; color: var(--ink); }
.facts .icon { width: 20px; height: 20px; margin-top: 2px; color: var(--green); stroke-width: 2.2; }
.stand { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 20px; margin-top: 14px; font-size: 13.5px; line-height: 1.5; color: var(--ink-3); }
.stand b { font-weight: 600; color: var(--ink-2); }
.stand a { color: var(--ink-2); }
.tablewrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); scrollbar-color: #a3ada7 transparent; }
.table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.45; }
.table th { padding: 12px 16px; text-align: left; font-size: 14.5px; font-weight: 600; color: var(--ink-2); background: var(--band); }
.table td { padding: 12px 16px; border-top: 1px solid var(--line-2); vertical-align: top; color: var(--ink-2); }
.table td:first-child { font-weight: 560; color: var(--ink); }
.table--dicht { font-size: 15px; }
.table--dicht th { font-size: 14px; }
.table--dicht th, .table--dicht td { padding: 11px 9px; }
.table--dicht th:first-child, .table--dicht td:first-child { padding-left: 16px; }
.table--dicht th:last-child, .table--dicht td:last-child { padding-right: 16px; }
.tip { padding: 18px 22px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.prose .tip p { color: var(--ink); }
.cta-inline { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 28px; margin-top: 2.2em !important; padding: 24px 26px; border-radius: var(--radius); background: var(--green); }
.prose .cta-inline p { flex: 1 1 260px; font-size: 16px; line-height: 1.45; color: rgba(255, 255, 255, .86); }
.cta-inline b { display: block; margin-bottom: 3px; font-size: 21px; font-weight: 450; letter-spacing: -.02em; line-height: 1.25; color: #fff; }
.cta-inline ::selection { background: var(--gold); color: var(--ink); }
.sources { margin-top: 2.4em; padding-top: 22px; border-top: 1px solid var(--line); }
.prose .sources h2 { margin: 0; font-size: 17.5px; font-weight: 600; letter-spacing: -.01em; }
.sources li { font-size: 15px; }
.rate { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; margin-top: 2.2em; font-size: 15.5px; }
.rate__avg { flex-basis: 100%; margin: 0; font-size: 14.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.rate__avg b { color: var(--ink); font-weight: 600; }
.rate__stars { display: flex; }
.rate__stars button { width: 34px; height: 34px; display: grid; place-items: center; padding: 0; border: 0; background: none; color: var(--line); cursor: pointer; }
.rate__stars svg { width: 22px; height: 22px; fill: currentColor; }
.rate__stars button.is-on { color: var(--gold); }
.rate small { font-size: 13.5px; color: var(--ink-3); }
.ask { padding: 22px 22px 24px; border-radius: var(--radius); background: var(--green); color: #fff; }
.ask h2 { font-size: 22px; line-height: 1.2; letter-spacing: -.025em; color: #fff; }
.ask p { margin-top: 8px; font-size: 15.5px; line-height: 1.5; color: rgba(255, 255, 255, .86); }
.ask ul { margin-top: 14px; display: grid; gap: 7px; font-size: 15px; font-weight: 520; }
.ask li { display: flex; align-items: flex-start; gap: 9px; }
.ask .icon { width: 18px; height: 18px; margin-top: 2px; color: var(--gold); stroke-width: 2.4; }
.ask .btn { width: 100%; margin-top: 18px; }
.ask ::selection { background: var(--gold); color: var(--ink); }
.toc { padding: 18px 20px 14px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.toc__title { font-size: 14.5px; font-weight: 600; color: var(--ink-3); }
.toc ol { margin-top: 8px; }
.toc a { display: block; padding: 6px 0; font-size: 15px; line-height: 1.35; color: var(--ink-2); text-decoration: none; }
.toc a:hover { color: var(--green); text-decoration: underline; }
.toc a.is-active { color: var(--green); font-weight: 600; }
.box { padding: 22px 22px 20px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.box h2 { font-size: 19px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.box p { margin-top: 8px; font-size: 15.5px; line-height: 1.5; color: var(--ink-2); }
.box .more { margin-top: 12px; font-size: 15.5px; }
.kv { margin-top: 10px; }
.kv div { display: grid; grid-template-columns: 22px 1fr; gap: 12px; padding: 11px 0; border-top: 1px solid var(--line-2); font-size: 15.5px; line-height: 1.45; }
.kv div:first-child { border-top: 0; }
.kv dt .icon { width: 20px; height: 20px; margin-top: 1px; color: var(--green); }
.kv dd { min-width: 0; overflow-wrap: anywhere; }
.box__note { margin-top: 10px; font-size: 13px; color: var(--ink-3); }
.related { margin-top: clamp(48px, 6vw, 72px); padding-top: 34px; border-top: 1px solid var(--line); }
.related h2 { font-size: clamp(1.45rem, 1.2rem + .9vw, 1.85rem); letter-spacing: -.028em; }
.related ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin-top: 24px; }
.related a { display: block; color: var(--ink); text-decoration: none; }
.related img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius); background: var(--band); }
.related b { display: block; margin-top: 12px; font-size: 17.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35; }
.related a:hover b { color: var(--green); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.filters { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 14px 16px; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.filters label, .filters legend { display: block; margin-bottom: 6px; padding: 0; font-size: 14.5px; font-weight: 600; }
.searchfield { position: relative; }
.searchfield .icon { position: absolute; left: 14px; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); color: var(--ink-3); pointer-events: none; }
.searchfield .input { padding-left: 42px; }
.chips { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; border: 0; margin: 0; padding: 0; min-width: 0; }
.chips legend { float: left; margin: 0 6px 0 0; line-height: 38px; }
.chip { min-height: 38px; padding: 0 14px; border: 1.5px solid var(--edge); border-radius: 3px; background: #fff; color: var(--ink); font-size: 14.5px; font-weight: 600; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.chip:hover { border-color: var(--green); color: var(--green); }
.chip[aria-pressed="true"] { border-color: var(--green); background: var(--green); color: #fff; }
.resultbar { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 20px; margin: 26px 0 12px; font-size: 15px; color: var(--ink-2); }
.resultbar b { font-weight: 650; color: var(--ink); font-variant-numeric: tabular-nums; }
.resultbar button { border: 0; padding: 0; background: none; color: var(--green); font-size: 15px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.firms { border-top: 1px solid var(--line); }
.firm { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto; gap: 8px 24px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--line); }
.firm h3 { font-size: 17.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.firm h3 a { color: var(--ink); text-decoration: none; }
.firm h3 a:hover { color: var(--green); text-decoration: underline; text-decoration-thickness: 1px; }
.firm__place { margin-top: 2px; font-size: 14.5px; color: var(--ink-3); }
.firm__go { display: inline-flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.firm__go .icon { width: 16px; height: 16px; transition: transform .25s var(--ease-out); }
.firm__go:hover { text-decoration: underline; }
.firm__go:hover .icon { transform: translateX(3px); }
.tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tags li { padding: 3px 8px; border-radius: 3px; background: var(--green-50); color: var(--green); font-size: 13px; font-weight: 600; line-height: 1.35; }
.pagehead .tags li { background: #fff; }
.empty { padding: 28px 0; border-bottom: 1px solid var(--line); color: var(--ink-2); }
.empty b { display: block; font-size: 17.5px; font-weight: 600; color: var(--ink); }
.pager { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 28px; }
.pager a, .pager span { min-width: 44px; height: 44px; display: grid; place-items: center; padding: 0 12px; border: 1px solid var(--line); background: #fff; color: var(--ink); font-size: 15px; font-weight: 600; text-decoration: none; font-variant-numeric: tabular-nums; }
.pager a:hover { border-color: var(--green); color: var(--green); }
.pager [aria-current] { border-color: var(--green); background: var(--green); color: #fff; }
.pager .gap { min-width: 24px; border: 0; background: none; color: var(--ink-3); }
.pager .next { grid-auto-flow: column; gap: 8px; padding: 0 16px; }
.pager .icon { width: 16px; height: 16px; }
.pager__note { margin-top: 10px; font-size: 13px; color: var(--ink-3); }
.about { max-width: 44em; margin-top: clamp(48px, 6vw, 72px); padding-top: 34px; border-top: 1px solid var(--line); }
.about h2 { font-size: clamp(1.45rem, 1.2rem + .9vw, 1.85rem); letter-spacing: -.028em; }
.about p { margin-top: 14px; font-size: 16.5px; line-height: 1.7; color: var(--ink-2); }
.neighbors { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.neighbors a { display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px; border: 1.5px solid var(--edge); border-radius: 3px; color: var(--ink); font-size: 14.5px; font-weight: 600; text-decoration: none; }
.neighbors a:hover { border-color: var(--green); color: var(--green); }
.foot { padding: clamp(44px, 6vw, 64px) var(--gutter) calc(clamp(28px, 4vw, 40px) + env(safe-area-inset-bottom)); background: var(--band); font-size: 15px; }
.foot__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .8fr) minmax(0, 1.5fr) minmax(0, 1.1fr); gap: 32px clamp(24px, 4vw, 56px); }
.foot__brand img { height: 34px; width: auto; }
@media (min-width: 1081px) { .foot__brand img { width: 100%; height: auto; } }
.foot__brand p { margin-top: 14px; max-width: 22em; line-height: 1.5; color: var(--ink-2); }
.foot__title { font-size: 14.5px; font-weight: 600; color: var(--ink); }
.foot ul { margin-top: 10px; display: grid; gap: 7px; }
.foot__cantons ul { display: block; columns: 2; column-gap: 20px; }
.foot__cantons li { margin-bottom: 7px; break-inside: avoid; }
.foot a { color: var(--ink-2); text-decoration: none; }
.foot a:hover { color: var(--green); text-decoration: underline; }
.foot__bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 32px; margin-top: 36px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 14px; color: var(--ink-3); }
.foot__bar nav { display: flex; flex-wrap: wrap; gap: 0 22px; }
.foot__bar nav a { display: inline-flex; align-items: center; min-height: 36px; }
.dock {
position: fixed; z-index: 60; left: 50%; bottom: 16px; width: min(1100px, calc(100% - 32px));
display: flex; align-items: center; gap: 18px; padding: 12px 12px 12px 22px;
border-radius: var(--radius); background: #fff; box-shadow: 0 4px 14px rgba(10, 30, 16, .14), 0 16px 40px -12px rgba(10, 30, 16, .3);
transform: translate(-50%, 140%); visibility: hidden; transition: transform .45s var(--ease-out), visibility 0s .45s;
}
.dock.is-shown { transform: translate(-50%, 0); visibility: visible; transition: transform .45s var(--ease-out), visibility 0s; }
.dock p { flex: 1; font-size: 14px; line-height: 1.35; color: var(--ink-3); }
.dock p b { display: block; font-size: 16px; font-weight: 600; color: var(--ink); }
.dock .btn { min-height: 48px; }
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
*, *::before, *::after { transition: none !important; animation: none !important; }
}
@media (min-width: 961px) {
.stage::before { background-size: auto, calc(100% + 480px) auto; background-position: 0 0, 0 38%; }
}
@media (max-width: 1080px) {
.foot__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
@media (max-width: 960px) {
.top { gap: 14px; }
.nav a { padding: 0 10px; }
.how, .guide, .faq, .cols, .quick, .news__grid { grid-template-columns: minmax(0, 1fr); }
.cols--profile .aside { display: contents; }
.cols--profile .box--contact { order: -1; }
.cols--profile .aside > :not(.box--contact) { order: 1; }
.aside, .cols--profile .aside { position: static; }
.quotes { grid-template-columns: minmax(0, 1fr); }
.quote, .quote:first-child, .quote:last-child { padding: 26px 0 22px; border-left: 0; border-bottom: 1px solid var(--line); }
.related ul { grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 16px; border-top: 1px solid var(--line); }
.related li { border-bottom: 1px solid var(--line); }
.related a { display: grid; grid-template-columns: 112px 1fr; gap: 16px; align-items: center; padding: 14px 0; }
.related img { border-radius: 3px; }
.related b { margin-top: 0; font-size: 16.5px; }
.toc { display: none; }
}
@media (max-width: 639px) {
body { font-size: 16px; }
.top { height: 64px; }
.top__logo img { width: 214px; }
.btn--sm { padding: 0 14px; font-size: 15px; }
.top__cta .lg { display: none; }
.top__cta .sm { display: inline; }
.intro { padding: 18px var(--gutter) 26px; }
.intro__lede { display: none; }
.promises { display: grid; justify-content: center; gap: 6px; margin-top: 14px; text-align: left; font-size: 15px; }
.promises li { align-items: flex-start; }
.promises .icon { margin-top: 3px; }
.pagehead { padding: 16px var(--gutter) 30px; }
.pagehead__lede { font-size: 16.5px; }
.crumbs { margin-bottom: 14px; }
.stage { padding: 28px 12px 28px; }
.stage::before { background-position: 60% 30%; }
.card { padding: 22px 18px 24px; }
.card__title { font-size: 23px; }
.card__sub { display: none; }
.steps li { font-size: 12.5px; }
.choices--grid { grid-template-columns: minmax(0, 1fr); }
.choice, .choices--grid .choice { min-height: 54px; }
.choices:not(.choices--grid) .choice { min-height: 74px; }
.fields { grid-template-columns: minmax(0, 1fr); }
.fields--addr { grid-template-columns: 112px minmax(0, 1fr); }
.field, .field--half { grid-column: span 1; }
.fields--addr .field { grid-column: 1 / -1; }
.fields--addr .field--plz { grid-column: 1; }
.fields--addr .field--city { grid-column: 2; }
.proof { gap: 6px 16px; font-size: 13.5px; }
.how__steps li { grid-template-columns: 38px 1fr; gap: 4px 14px; }
.crumbs li { display: none; }
.crumbs li:nth-last-child(2) { display: block; }
.crumbs li:nth-last-child(2)::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 9px 1px 2px; border: 0; border-left: 1.5px solid var(--edge); border-bottom: 1.5px solid var(--edge); transform: rotate(45deg); }
.chmap .code, .chmap .cap, .chmap .pin text { display: none; }
.chmap--zoom .pin__mark { transform: scale(1.9); }
.stories a { grid-template-columns: 96px 1fr; gap: 14px; }
.stories img { width: 96px; }
.lead-story h3 { font-size: 22px; }
.faq__list summary { font-size: 16.5px; padding: 17px 0; }
.faq__list details p { padding-right: 0; font-size: 16px; }
.close .btn { width: 100%; }
.prose { font-size: 16.5px; }
.prose .answer { font-size: 18px; }
.facts { padding: 18px 16px 20px; }
.table { font-size: 15px; }
.table th, .table td { padding: 10px 12px; }
.table--stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.table--stack tr { display: block; padding: 12px 14px; border-top: 1px solid var(--line-2); }
.table--stack tr:first-child { border-top: 0; }
.table--stack td { display: block; padding: 0; border: 0; }
.table--stack td + td { margin-top: 3px; }
.cta-inline { padding: 20px 18px; }
.cta-inline .btn { width: 100%; }
.filters { grid-template-columns: minmax(0, 1fr); padding: 14px; }
.chips legend { float: none; width: 100%; line-height: 1.3; margin-bottom: 2px; }
.firm { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 14px 0; }
.firm__go { display: none; }
.foot__grid { grid-template-columns: minmax(0, 1fr); }
.dock { bottom: 0; width: 100%; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); border-radius: 0; gap: 12px; }
.dock p { font-size: 12.5px; }
.dock p span { display: none; }
.dock p b { font-size: 14.5px; }
.dock .btn { min-height: 46px; padding: 0 16px; font-size: 15.5px; }
}
@media (max-width: 420px) {
.actions { flex-direction: column-reverse; align-items: stretch; gap: 8px; }
.back { align-self: center; }
}
.skip { position: absolute; left: 16px; top: -64px; z-index: 100; padding: 10px 14px; background: var(--green); color: #fff; font-size: 15px; font-weight: 600; text-decoration: none; }
.skip:focus { top: 12px; outline-color: #fff; outline-offset: -4px; }
.prose .firms { margin-top: .9em; }
.prose .firms h3 { margin: 0; font-size: 17.5px; }
.prose .firms li { color: inherit; }
.prose .firms .firm__place { color: var(--ink-3); }
.prose .tags li { color: var(--green); }
.prose .faq__list { margin-top: .9em; }
.prose .faq__list details p { padding-right: 0; max-width: none; }
.prose figure .chmap { border-radius: var(--radius); background: #eef0f1; }
.prose figure.foerderkarte { margin: 1.4em 0 .6em; }
.prose figure.foerderkarte .chmap { border-radius: 0; background: none; }
.chmap--mini .cap circle { r: 5px; stroke-width: 2; }
.chmap--mini .ct { stroke-width: 1.4; }
.stage { padding-top: 40px; }
.ej {
--ej-ink: #16342f; --ej-accent: #07633f; --ej-soft: #f2f8f4; --ej-border: #8c9e96; --ej-muted: #4a625c;
position: relative; max-width: 760px; margin: 0 auto; padding: 28px 40px 26px; border-radius: var(--radius);
background: #fff; color: var(--ej-ink); box-shadow: var(--shadow-card); scroll-margin-top: 24px;
}
.ej__bar { display: flex; align-items: center; gap: 24px; font-size: 12px; font-weight: 600; color: var(--ej-muted); }
.ej__track { flex: 1; height: 6px; border-radius: 3px; background: #e8efec; overflow: hidden; }
.ej__track i { display: block; width: 7.7%; height: 100%; background: var(--ej-accent); }
.ej h2 { margin-top: 20px; font-size: 28px; font-weight: 700; line-height: 1.2; letter-spacing: -.025em; color: var(--ej-ink); }
.ej__sub { margin-top: 12px; font-size: 14px; line-height: 1.5; color: var(--ej-ink); }
.ej__opts { display: grid; gap: 12px; margin-top: 20px; }
.ej__opt { display: grid; grid-template-columns: 28px 1fr auto 24px; gap: 0 20px; align-items: center; min-height: 82px; padding: 14px 16px 14px 20px; border: 1px solid var(--ej-border); border-radius: 6px; background: #fff; }
.ej__icon { width: 28px; height: 28px; fill: none; stroke: var(--ej-accent); stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.ej__opt b { display: block; font-size: 14px; font-weight: 600; line-height: 1.4; }
.ej__opt small { display: block; margin-top: 3px; font-size: 13px; line-height: 1.4; color: var(--ej-muted); }
.ej__info { margin-right: -8px; color: var(--ej-accent); }
.ej__info .icon { width: 19px; height: 19px; stroke-width: 1.5; }
.ej__mark { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--ej-border); color: #fff; }
.ej__mark .icon { width: 15px; height: 15px; stroke-width: 2.6; opacity: 0; }
.ej__opt.is-on { border-color: var(--ej-accent); background: var(--ej-soft); box-shadow: inset 0 0 0 1px var(--ej-accent); }
.ej__opt.is-on b { color: var(--ej-accent); }
.ej__opt.is-on .ej__mark { border-color: var(--ej-accent); background: var(--ej-accent); }
.ej__opt.is-on .ej__mark .icon { opacity: 1; }
.ej__next { display: flex; align-items: center; justify-content: center; gap: 10px; height: 52px; margin-top: 30px; border-radius: 6px; background: var(--ej-accent); color: #fff; font-size: 16px; font-weight: 700; text-decoration: none; transition: background .2s; }
.ej__next::after { content: ""; position: absolute; inset: 0; border-radius: var(--radius); }
.ej__next:hover { background: #055233; }
.ej__next:focus-visible { outline: 2px solid var(--ej-accent); outline-offset: 3px; }
.ej__next .icon { width: 18px; height: 18px; stroke-width: 2.2; }
.ej__note { margin-top: 12px; font-size: 12.5px; line-height: 1.5; color: var(--ink-3); text-align: center; }
.proof__alt { flex-basis: 100%; justify-content: center; margin-top: 2px; padding-top: 8px; border-top: 1px solid var(--line-2); }
.proof__alt a { font-weight: 600; }
.quick { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.25fr); gap: clamp(36px, 5vw, 80px); align-items: start; }
.quick .card { width: 100%; margin: 0 0 0 auto; }
.card--flat { box-shadow: none; }
.card--flat .steps { margin-top: 0; }
.news { padding: clamp(48px, 6vw, 80px) var(--gutter); border-top: 1px solid var(--line); background: var(--paper); }
.news__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.news h2 { font-size: clamp(1.45rem, 1.2rem + .9vw, 1.85rem); line-height: 1.2; letter-spacing: -.028em; }
.news__grid > div > p { margin-top: 10px; max-width: 26em; color: var(--ink-2); }
.news__fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.news label { display: block; margin-bottom: 6px; font-size: 14.5px; font-weight: 600; }
.news .opt { font-weight: 450; color: var(--ink-3); }
.check { position: relative; display: flex !important; align-items: flex-start; gap: 11px; margin: 16px 0 0 !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.45; color: var(--ink-2); cursor: pointer; }
.check input { position: absolute; left: 0; top: 0; width: 22px; height: 22px; margin: 0; opacity: 0; cursor: pointer; }
.check__box { width: 22px; height: 22px; flex: none; display: grid; place-items: center; border: 1.5px solid var(--edge); border-radius: 3px; background: #fff; color: #fff; }
.check__box .icon { width: 15px; height: 15px; stroke-width: 2.6; opacity: 0; }
.check input:checked + .check__box { border-color: var(--green); background: var(--green); }
.check input:checked + .check__box .icon { opacity: 1; }
.check input:focus-visible + .check__box { outline: 2px solid var(--green); outline-offset: 2px; }
.news .btn { margin-top: 18px; }
.news__err { margin-top: 12px; font-size: 14.5px; font-weight: 560; color: var(--error); }
.news__done { margin-top: 14px; padding: 12px 14px; border-radius: 3px; background: var(--green-50); font-size: 14.5px; color: var(--ink); }
.news [aria-invalid="true"] { border-color: var(--error); }
@media (max-width: 960px) {
.quick, .news__grid { grid-template-columns: minmax(0, 1fr); }
.quick .card { margin: 0; max-width: 640px; }
}
@media (max-width: 639px) {
.stage { padding-top: 24px; }
.ej { padding: 20px 16px 20px; }
.ej h2 { margin-top: 16px; font-size: 24px; }
.ej__opt { gap: 0 14px; min-height: 74px; padding: 12px 14px; }
.ej__next { margin-top: 22px; }
.news__fields { grid-template-columns: minmax(0, 1fr); }
.news .btn { width: 100%; }
}
@media (max-height: 700px) { .cols--profile .aside { position: static; } }
@media (min-width: 640px) and (max-height: 820px) {
.intro { padding: 22px var(--gutter) 28px; }
.promises { margin-top: 12px; }
.stage { padding-top: 26px; }
.ej { padding-top: 22px; }
}
@media (min-width: 640px) and (max-height: 760px) {
.intro { padding: 18px var(--gutter) 24px; }
.promises { display: none; }
}
@media (max-width: 720px) {
.top { gap: 10px; }
.nav { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: 4px var(--gutter) 12px; background: #fff; box-shadow: var(--shadow-pop); }
.nav.is-open { display: flex; }
.nav a { height: 52px; padding: 0 2px; border-top: 1px solid var(--line-2); box-shadow: none; font-size: 17px; }
.nav a:first-child { border-top: 0; }
.nav a[aria-current="page"] { box-shadow: none; }
.top__cta { margin-left: auto; }
.menu-btn { display: grid; margin-left: auto; }
.top__cta + .menu-btn { margin-left: 0; }
}
.foot__col .foot__title:not(:first-child) { margin-top: 26px; }
.pro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.checks { display: grid; gap: 10px; font-size: 16.5px; font-weight: 520; }
.checks li { display: flex; align-items: flex-start; gap: 10px; }
.checks .icon { width: 20px; height: 20px; margin-top: 3px; color: var(--green); stroke-width: 2.2; }
.pro__side .btn { margin-top: 26px; }
@media (max-width: 960px) {
.pro { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 639px) {
.pro__side .btn { width: 100%; }
}
.foot__end { display: flex; flex-wrap: wrap; align-items: center; gap: 0 26px; }
.lang { position: relative; }
.lang__btn { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0; border: 0; border-radius: 0; background: none; color: var(--ink-3); font-size: 14px; cursor: pointer; transition: color .2s; }
.lang__btn:hover, .lang.is-open .lang__btn { color: var(--ink); }
.lang__btn .icon { width: 16px; height: 16px; stroke-width: 1.6; }
.lang__btn .icon--chev { width: 13px; height: 13px; stroke-width: 2.2; transition: transform .25s var(--ease-out); }
.lang.is-open .icon--chev { transform: rotate(180deg); }
.foot .lang__list {
position: absolute; z-index: 5; right: 0; bottom: calc(100% + 6px); display: block; min-width: 172px; margin: 0; padding: 5px;
border: 1px solid var(--line); background: #fff; box-shadow: var(--shadow-pop);
visibility: hidden; opacity: 0; transform: translateY(4px); transition: opacity .18s, transform .25s var(--ease-out), visibility 0s .25s;
}
.foot .lang.is-left .lang__list { right: auto; left: 0; }
.foot .lang.is-open .lang__list { visibility: visible; opacity: 1; transform: none; transition: opacity .18s, transform .25s var(--ease-out), visibility 0s; }
.lang__list li { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 36px; padding: 0 10px; font-size: 14.5px; color: var(--ink-3); }
.lang__list [aria-current] { color: var(--ink); font-weight: 600; }
.lang__list a { flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 36px; margin: 0 -10px; padding: 0 10px; }
.lang__list small { font-size: 12.5px; }
.lang__list .icon { width: 15px; height: 15px; color: var(--green); stroke-width: 2.4; }
.top--min .top__logo { display: block; }
.foot--min { padding-top: 0; }
.foot--min .foot__bar { margin-top: 0; border-top: 0; padding-top: 22px; }
.pagehead--offer { padding-top: 30px; }
.pagehead--offer .wrap { max-width: 760px; }
.pagehead--offer::after { left: calc(var(--gutter) + max(0px, (100% - 2 * var(--gutter) - 760px) / 2) + 26px); }
.portal { padding-top: clamp(32px, 5vw, 56px); padding-bottom: clamp(40px, 5vw, 60px); }
.portal__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.portal h1 { font-size: clamp(2rem, 1.3rem + 2vw, 2.9rem); line-height: 1.08; max-width: 14em; }
.portal__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-top: 28px; }
.portal__lead { display: block; color: var(--ink); text-decoration: none; }
.portal__lead img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius); background: #fff; }
.portal__lead b { display: block; margin-top: 14px; font-size: 19px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.portal__lead span { display: block; margin-top: 4px; font-size: 15.5px; line-height: 1.5; color: var(--ink-2); }
.portal__lead:hover b { color: var(--green); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.topics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 36px clamp(20px, 3vw, 40px); margin-top: 36px; }
.topic h3 { font-size: 17.5px; font-weight: 600; letter-spacing: -.01em; }
.topic ul { margin-top: 10px; display: grid; gap: 8px; }
.topic a { color: var(--ink-2); font-size: 15.5px; line-height: 1.35; text-decoration: none; }
.topic a:hover { color: var(--green); text-decoration: underline; }
.teasers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin-top: 36px; }
.teasers a { display: block; color: var(--ink); text-decoration: none; }
.teasers img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius); background: #fff; }
.teasers b { display: block; margin-top: 12px; font-size: 17.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35; }
.teasers a:hover b { color: var(--green); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.stories--plain { margin-top: 30px; }
.stories--plain a { display: block; padding: 14px 0; }
.close__alt { margin-top: 18px; font-size: 15.5px; }
.close__alt a { color: #fff; }
.close__alt a:focus-visible { outline-color: #fff; }
@media (max-width: 1100px) { .topics { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 960px) {
.portal__grid { grid-template-columns: minmax(0, 1fr); }
.teasers { grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 20px; border-top: 1px solid var(--line); }
.teasers li { border-bottom: 1px solid var(--line); }
.teasers a { display: grid; grid-template-columns: 112px 1fr; gap: 16px; align-items: center; padding: 14px 0; }
.teasers img { border-radius: 3px; }
.teasers b { margin-top: 0; font-size: 16.5px; }
.stories--plain { margin-top: 0; border-top: 0; }
}
@media (max-width: 639px) {
.topics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; }
.portal__actions .btn { width: 100%; }
}
.nav__group { position: relative; }
.nav__toggle {
display: inline-flex; align-items: center; gap: 7px; height: 44px; padding: 0 14px; border: 0; border-radius: 0; background: none;
color: var(--ink); font-size: 15.5px; font-weight: 560; cursor: pointer; transition: color .2s;
}
.nav__toggle:hover, .nav__group.is-open .nav__toggle { color: var(--green); }
.nav__toggle .icon { width: 15px; height: 15px; stroke-width: 2.2; transition: transform .25s var(--ease-out); }
.nav__group.is-open .nav__toggle .icon { transform: rotate(180deg); }
.nav__menu {
position: absolute; left: 0; top: calc(100% + 16px); min-width: 268px; padding: 6px;
border: 1px solid var(--line); border-top: 2px solid var(--green); background: #fff; box-shadow: var(--shadow-pop);
visibility: hidden; opacity: 0; transform: translateY(-6px);
transition: opacity .18s, transform .25s var(--ease-out), visibility 0s .25s;
}
.nav__menu::before { content: ""; position: absolute; left: 0; right: 0; top: -18px; height: 18px; }
.nav__group.is-open .nav__menu { visibility: visible; opacity: 1; transform: none; transition: opacity .18s, transform .25s var(--ease-out), visibility 0s; }
.nav .nav__menu a { display: flex; gap: 14px; height: 50px; padding: 0 14px 0 12px; font-size: 16px; box-shadow: none; transition: background .2s, color .2s; }
.nav .nav__menu a:hover { background: var(--green-50); }
.nav__menu .icon { width: 24px; height: 24px; color: var(--green); stroke-width: 1.7; }
@media (max-width: 960px) { .nav__toggle { padding: 0 10px; } }
@media (max-width: 720px) {
.nav__group { border-top: 1px solid var(--line-2); }
.nav__toggle { width: 100%; justify-content: space-between; height: 52px; padding: 0 2px; font-size: 17px; }
.nav__toggle .icon { width: 18px; height: 18px; }
.nav__menu { position: static; display: none; min-width: 0; padding: 0 0 6px; border: 0; box-shadow: none; visibility: visible; opacity: 1; transform: none; transition: none; }
.nav__menu::before { display: none; }
.nav__group.is-open .nav__menu { display: block; transition: none; }
.nav .nav__menu a { height: 48px; padding: 0 2px; border-top: 0; font-size: 16.5px; }
}
.targets { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 36px; }
.targets a { display: block; color: var(--ink); text-decoration: none; }
.targets img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); background: var(--band); }
.targets b { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; font-size: 19px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.targets b .icon { width: 18px; height: 18px; color: var(--green); transition: transform .25s var(--ease-out); }
.targets span { display: block; margin-top: 3px; font-size: 15px; line-height: 1.45; color: var(--ink-2); }
.targets a:hover b { color: var(--green); }
.targets a:hover b .icon { transform: translateX(3px); }
@media (max-width: 960px) { .targets { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 20px; } }
@media (max-width: 639px) {
.targets { gap: 22px 14px; margin-top: 26px; }
.targets b { margin-top: 10px; font-size: 16.5px; }
.targets span { font-size: 14px; }
}
.stage--cover::before { background-size: cover; background-position: var(--stage-pos, center); }
@media (min-width: 961px) { .stage--cover::before { background-size: cover; background-position: var(--stage-pos, center); } }
@media (max-width: 639px) { .stage--cover::before { background-position: var(--stage-pos, center); } }
.tglist { margin-top: 8px; }
.tglist li + li { border-top: 1px solid var(--line-2); }
.tglist a, .tglist span { display: flex; align-items: center; gap: 12px; padding: 11px 0; font-size: 15.5px; font-weight: 560; line-height: 1.3; color: var(--ink); text-decoration: none; }
.tglist .icon { width: 22px; height: 22px; color: var(--green); stroke-width: 1.7; }
.tglist a:hover { color: var(--green); text-decoration: underline; text-decoration-thickness: 1px; }
.tglist [aria-current] { color: var(--green); font-weight: 650; }
.foot__end { width: 100%; justify-content: space-between; }
.foot__fine { display: flex; flex-wrap: wrap; align-items: center; }
.foot__fine p { margin: 0; }
.foot__fine p + p::before { content: "·"; margin: 0 9px; color: var(--edge); }
.foot .lang__btn { height: 36px; }
@media (max-width: 639px) {
.foot__bar { padding-top: 8px; gap: 0; }
.foot__bar nav { gap: 0 24px; }
.foot__bar nav a, .foot .lang__btn { min-height: 44px; height: auto; }
.foot__end { display: block; }
.foot__fine { display: block; margin-top: 10px; line-height: 1.6; }
.foot__fine p + p::before { content: none; }
}
@media (pointer: coarse) {
.foot__bar nav a, .foot .lang__btn { min-height: 44px; height: auto; }
}
@media (max-width: 1119px) {
.top--anchors .nav { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: 4px var(--gutter) 12px; background: #fff; box-shadow: var(--shadow-pop); }
.top--anchors .nav.is-open { display: flex; }
.top--anchors .nav a { height: 52px; padding: 0 2px; border-top: 1px solid var(--line-2); box-shadow: none; font-size: 17px; }
.top--anchors .nav a:first-child { border-top: 0; }
.top--anchors .menu-btn { display: grid; margin-left: auto; }
}
@media (min-width: 1120px) and (max-width: 1259px) {
.top--viele .nav { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: 4px var(--gutter) 12px; background: #fff; box-shadow: var(--shadow-pop); }
.top--viele .nav.is-open { display: flex; }
.top--viele .nav a { height: 52px; padding: 0 2px; border-top: 1px solid var(--line-2); box-shadow: none; font-size: 17px; }
.top--viele .nav a:first-child { border-top: 0; }
.top--viele .menu-btn { display: grid; margin-left: auto; }
}
@media (max-width: 420px) {
.targets b { display: block; font-size: 15.5px; hyphens: auto; overflow-wrap: anywhere; }
.targets b .icon { display: none; }
}
@media (max-width: 389px) { .top__cta .icon { display: none; } }
.proof__checks { flex-basis: 100%; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 28px; margin-bottom: 4px; padding: 2px 0 10px; border-bottom: 1px solid var(--line-2); font-size: 15.5px; font-weight: 560; color: var(--ink); }
.proof__checks span { display: inline-flex; align-items: center; gap: 8px; }
.proof__checks .icon { width: 18px; height: 18px; color: var(--green); stroke-width: 2.4; }
.sec__wide { max-width: 20em; }
.service { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 76px); align-items: start; margin-top: 40px; }
.points { border-top: 1px solid var(--line); }
.points li { display: grid; grid-template-columns: 24px 1fr; gap: 0 16px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.points .icon { width: 22px; height: 22px; margin-top: 2px; color: var(--green); stroke-width: 2.2; }
.points h3 { font-size: 17.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35; }
.points p { margin-top: 2px; font-size: 16px; line-height: 1.55; color: var(--ink-2); max-width: 38em; }
.box--privacy { padding: 24px 24px 26px; background: var(--green-50); border-color: transparent; }
.sec--band .box--privacy { background: #fff; }
.box--privacy h3 { font-size: 19px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.box--privacy .checks { margin-top: 14px; font-size: 15.5px; font-weight: 450; line-height: 1.5; }
.box__siegel { margin-top: 15px; }
.box__siegel:empty { display: none; }
.box__siegel[data-siegel] { display: block; min-height: 44px; }
.net { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.net img { width: 100%; max-width: 560px; justify-self: end; }
.benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px clamp(24px, 4vw, 56px); margin-top: 36px; }
.benefits li { padding-top: 18px; border-top: 1px solid var(--line); }
.benefits h3 { font-size: 19px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.benefits p { margin-top: 6px; font-size: 16.5px; line-height: 1.55; color: var(--ink-2); }
.benefits__cta { margin-top: 36px; }
.benefits--zeichen li { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; align-content: start; gap: 14px; padding-top: 0; border-top: 0; }
.benefits__zeichen { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 3px; background: var(--green-50); color: var(--green); }
.benefits__zeichen .icon { width: 24px; height: 24px; stroke-width: 1.8; }
.benefits--zeichen p { grid-column: 1 / -1; margin-top: 0; }
@media (min-width: 961px) {
.quotes--six { row-gap: 44px; }
.quotes--six .quote:nth-child(3n+1) { border-left: 0; padding-left: 0; }
.quotes--six .quote:nth-child(3n) { padding-right: 0; }
}
@media (max-width: 960px) {
.service, .net, .benefits { grid-template-columns: minmax(0, 1fr); }
.net img { justify-self: start; max-width: 460px; }
.benefits { gap: 0; margin-top: 24px; }
.benefits li { padding: 18px 0 20px; }
.benefits--zeichen { gap: 26px; }
.benefits--zeichen li { align-items: start; gap: 2px 16px; padding: 0; border-top: 0; }
.benefits--zeichen .benefits__zeichen { grid-row: span 2; }
.benefits--zeichen h3 { padding-top: 1px; }
.benefits--zeichen p { grid-column: 2; }
.benefits li:last-child { border-bottom: 1px solid var(--line); }
}
@media (max-width: 639px) {
.proof__checks { display: grid; justify-content: center; gap: 5px; font-size: 15px; }
.service { margin-top: 28px; }
.benefits__cta .btn { width: 100%; }
}
.nw { white-space: nowrap; }
@media (max-width: 639px) { .proof__alt { text-align: center; } }
.proof { align-items: flex-start; }
.proof__item--rate { align-items: flex-start; }
.proof__item--rate .stars { margin-top: 4px; }
.proof small, .voices__rate small { display: block; font-size: 12px; line-height: 1.4; color: var(--ink-3); }
.voices__rate { align-items: flex-start; }
.voices__rate .stars { margin-top: 5px; }
.pulse { display: flex; align-items: flex-start; gap: 10px; margin-top: 18px; font-size: 15px; line-height: 1.45; color: var(--ink-2); }
.pulse__dot { align-self: center; width: 8px; height: 8px; flex: none; border-radius: 50%; background: var(--green); }
.pulse > .pulse__dot { align-self: flex-start; margin-top: calc(.725em - 4px); }
.pulse b { color: var(--ink); font-weight: 650; font-variant-numeric: tabular-nums; }
.pulse small { font-size: 12px; color: var(--ink-3); }
.dock .sm { display: none; }
@media (max-width: 639px) { .dock .lg { display: none; } .dock .sm { display: inline; } }
.t { display: block; min-width: 0; }
.list--num { counter-reset: nr; }
.list--num li { counter-increment: nr; padding-left: 30px; }
.list--num li::before { content: counter(nr) "."; top: 0; left: 0; width: auto; height: auto; background: none; color: var(--green); font-weight: 650; font-variant-numeric: tabular-nums; }
.prose h4 { margin-top: 1.5em; font-size: 17px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35; }
.prose h4 + * { margin-top: .35em; }
.facts > p { margin-top: 10px; font-size: 16px; line-height: 1.55; color: var(--ink-2); }
.facts > p:last-child { margin-top: 14px; }
.prose .quote { margin: 1.4em 0 0; padding: 2px 0 2px 20px; border-left: 1px solid var(--green); color: var(--ink); font-size: 1.04em; }
.prose .cta-btn { margin-top: 1.6em; }
.prose .tip > * + * { margin-top: .7em; }
.sources .list a { color: var(--ink-2); }
.prose .faq__list .list { padding: 0 0 20px; font-size: 16.5px; }
.prose > figure:first-of-type { margin-top: 1.4em; }
@media (max-width: 639px) { .prose .cta-btn .btn { width: 100%; } }
.jump { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.jump a { display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px; border: 1.5px solid var(--edge); border-radius: 3px; background: #fff; color: var(--ink); font-size: 14.5px; font-weight: 600; text-decoration: none; transition: border-color .2s, color .2s; }
.jump a:hover { border-color: var(--green); color: var(--green); }
.rg + .rg { margin-top: clamp(48px, 6vw, 76px); }
.rg { scroll-margin-top: 24px; }
.rg h2 { font-size: clamp(1.45rem, 1.2rem + .9vw, 1.85rem); line-height: 1.2; letter-spacing: -.028em; }
.rg__lede { margin-top: 8px; color: var(--ink-2); }
.rg__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(28px, 4vw, 56px); margin-top: 20px; border-top: 1px solid var(--line); }
.rg__list li { border-bottom: 1px solid var(--line); }
.rg__list a { display: grid; grid-template-columns: 144px 1fr; gap: 18px; align-items: start; padding: 18px 0; color: var(--ink); text-decoration: none; }
.rg__list img { width: 144px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 3px; background: var(--band); }
.rg__list b { display: block; font-size: 17px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35; }
.rg__list .t > span { display: block; margin-top: 4px; font-size: 14.5px; line-height: 1.5; color: var(--ink-2); }
.rg__list a:hover b { color: var(--green); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.rg__kantone { columns: 4; column-gap: 28px; margin-top: 18px; }
.rg__kantone li { margin-bottom: 9px; break-inside: avoid; }
.rg__kantone a { color: var(--ink); font-size: 16px; text-decoration: none; }
.rg__kantone a:hover { color: var(--green); text-decoration: underline; }
.rg__mehr { margin-top: 14px; }
.jump--az { gap: 6px; }
.jump--az a, .jump--az span { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; min-height: 38px; padding: 0; border-radius: 3px; font-size: 14.5px; font-weight: 600; }
.jump--az span { border: 1.5px solid var(--line); color: var(--ink-3); }
.gl { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 0 clamp(16px, 3vw, 40px); scroll-margin-top: 24px; }
.gl + .gl { margin-top: clamp(36px, 5vw, 56px); }
.gl h2 { font-size: clamp(1.9rem, 1.5rem + 1.2vw, 2.4rem); line-height: 1; letter-spacing: -.03em; }
.gl__list { max-width: 46em; }
.gl__item { padding: 18px 0; scroll-margin-top: 24px; }
.gl__item:first-child { padding-top: 4px; }
.gl__item:last-child { padding-bottom: 0; }
.gl__item + .gl__item { border-top: 1px solid var(--line); }
.gl__item dt { font-size: 18px; font-weight: 600; letter-spacing: -.01em; line-height: 1.35; }
.gl__item dd { margin: 6px 0 0; font-size: 17px; line-height: 1.6; color: var(--ink-2); }
.gl__item:target dt { color: var(--green); }
.gl__zu { margin-top: 6px; font-size: 15px; line-height: 1.55; color: var(--ink-3); }
.gl__stand { max-width: 60em; margin-top: clamp(36px, 5vw, 56px); }
@media (max-width: 639px) {
.gl { grid-template-columns: 1fr; }
.gl h2 { margin-bottom: 6px; }
}
@media (max-width: 960px) { .rg__list { grid-template-columns: minmax(0, 1fr); } .rg__kantone { columns: 3; } }
@media (max-width: 639px) {
.rg__list a { grid-template-columns: 96px 1fr; gap: 14px; padding: 14px 0; }
.rg__list img { width: 96px; }
.rg__list b { font-size: 16px; }
.rg__list .t > span { display: none; }
.rg__kantone { columns: 2; }
}
.ask .btn .icon { margin-top: 0; color: inherit; stroke-width: 1.75; }
.nav__group--end .nav__menu { left: auto; right: 0; min-width: 236px; }
.nav__group.is-current .nav__toggle { color: var(--green); box-shadow: inset 0 -2px 0 var(--green); }
@media (max-width: 1139px) {
.top:not(.top--anchors) .nav { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: 4px var(--gutter) 12px; background: #fff; box-shadow: var(--shadow-pop); }
.top:not(.top--anchors) .nav.is-open { display: flex; }
.top:not(.top--anchors) .nav > a { height: 52px; padding: 0 2px; border-top: 1px solid var(--line-2); box-shadow: none; font-size: 17px; }
.top:not(.top--anchors) .top__cta { margin-left: auto; }
.top:not(.top--anchors) .menu-btn { display: grid; margin-left: auto; }
.top:not(.top--anchors) .top__cta + .menu-btn { margin-left: 0; }
.nav__group { border-top: 0; }
.nav__toggle { width: 100%; justify-content: space-between; height: 52px; padding: 0 2px; font-size: 17px; }
.nav__toggle .icon { width: 18px; height: 18px; }
.nav__menu { position: static; display: none; min-width: 0; padding: 0 0 6px; border: 0; box-shadow: none; visibility: visible; opacity: 1; transform: none; transition: none; }
.nav__menu::before { display: none; }
.nav__group.is-open .nav__menu { display: block; transition: none; }
.nav .nav__menu a { height: 48px; padding: 0 2px; border-top: 0; font-size: 16.5px; }
.nav__group--end { border-top: 1px solid var(--line-2); }
.nav__group.is-current .nav__toggle { box-shadow: none; }
.nav__group--end .nav__menu a { padding-left: 16px; }
}
@media (max-width: 639px) {
.top .top__cta { display: none; }
.top:not(.top--anchors) .top__cta + .menu-btn { margin-left: auto; }
}
@media (min-width: 1140px) and (max-width: 1239px) {
.top:lang(fr):not(.top--anchors) .nav { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: 4px var(--gutter) 12px; background: #fff; box-shadow: var(--shadow-pop); }
.top:lang(fr):not(.top--anchors) .nav.is-open { display: flex; }
.top:lang(fr):not(.top--anchors) .nav > a { height: 52px; padding: 0 2px; border-top: 1px solid var(--line-2); box-shadow: none; font-size: 17px; }
.top:lang(fr):not(.top--anchors) .top__cta { margin-left: auto; }
.top:lang(fr):not(.top--anchors) .menu-btn { display: grid; margin-left: auto; }
.top:lang(fr):not(.top--anchors) .top__cta + .menu-btn { margin-left: 0; }
.nav__group:lang(fr) { border-top: 0; }
.nav__toggle:lang(fr) { width: 100%; justify-content: space-between; height: 52px; padding: 0 2px; font-size: 17px; }
.nav__toggle:lang(fr) .icon { width: 18px; height: 18px; }
.nav__menu:lang(fr) { position: static; display: none; min-width: 0; padding: 0 0 6px; border: 0; box-shadow: none; visibility: visible; opacity: 1; transform: none; transition: none; }
.nav__menu:lang(fr)::before { display: none; }
.nav__group:lang(fr).is-open .nav__menu { display: block; transition: none; }
.nav:lang(fr) .nav__menu a { height: 48px; padding: 0 2px; border-top: 0; font-size: 16.5px; }
.nav__group--end:lang(fr) { border-top: 1px solid var(--line-2); }
.nav__group:lang(fr).is-current .nav__toggle { box-shadow: none; }
.nav__group--end:lang(fr) .nav__menu a { padding-left: 16px; }
}
.net__hint { margin-top: 12px; font-size: 15.5px; color: var(--ink-2); }
.net__map { width: 100%; max-width: 680px; justify-self: end; }
.net__list { display: none; margin: 0; padding: 0; list-style: none; }
@media (max-width: 720px) {
.net__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; border-top: 1px solid var(--line); }
.net__list a { display: flex; align-items: center; min-height: 46px; border-bottom: 1px solid var(--line); color: var(--ink); font-size: 16px; text-decoration: none; }
.net__list a:hover { color: var(--green); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
}
.chmap--netz .ct { fill: #e9eeeb; stroke: #fff; stroke-width: 1.6; }
.chmap--netz a:hover .ct, .chmap--netz a.is-hot .ct, .chmap--netz a:focus-visible .ct { fill: #cfe0d4; stroke: #fff; stroke-width: 1.6; }
.chmap--netz a:focus-visible .ct { stroke: var(--green); stroke-width: 2.4; }
.chmap--netz .lake { fill: #dfe9ee; }
.sec--band .chmap--netz .ct { fill: #fff; stroke: #cdd4d8; stroke-width: 1.1; }
.sec--band .chmap--netz a:hover .ct, .sec--band .chmap--netz a.is-hot .ct, .sec--band .chmap--netz a:focus-visible .ct { fill: #cfe0d4; stroke: #cdd4d8; stroke-width: 1.1; }
.sec--band .chmap--netz a:focus-visible .ct { stroke: var(--green); }
.sec--band .chmap--netz .lake { fill: #d6e2e8; }
.chmap--netz .cap { pointer-events: auto; cursor: pointer; }
.chmap--netz .cap circle { fill: var(--green); stroke: #fff; stroke-width: 2; pointer-events: auto; transition: fill .2s; }
.chmap--netz .cap text { font-size: 15px; font-weight: 650; fill: var(--green); stroke-width: 3.6px; pointer-events: auto; }
.chmap--netz .cap:hover circle, .chmap--netz .cap.is-hot circle { fill: var(--gold); }
.chmap--netz .cap:hover text { text-decoration: underline; }
.chmap--fest .land:hover .ct, .chmap--fest .land.is-hot .ct { fill: #cfe0d4; }
.chmap--fest .cap { cursor: default; }
.chmap--fest .cap:hover text { text-decoration: none; }
@media (max-width: 960px) { .net__map { justify-self: start; max-width: 560px; } }
@media (max-width: 720px) {
.chmap--netz .cap { display: block; }
.chmap--netz .cap text { display: none; }
.chmap--netz .cap circle { r: 11px; stroke-width: 2.4; }
}
.uu { --uu-pad: clamp(40px, 6vw, 76px); --uu-gap: clamp(32px, 5.4vw, 72px); }
.uu .uu-sec { padding-top: var(--uu-pad); padding-bottom: var(--uu-pad); }
.uu .uu-lede { margin-top: 14px; max-width: 34em; font-size: 18px; line-height: 1.5; color: var(--ink-2); }
.uu .uu-text { margin-top: 12px; max-width: 36em; font-size: 17px; line-height: 1.6; color: var(--ink-2); }
.uu .uu-foto { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border: 1px solid var(--line); border-radius: var(--radius); background: var(--line-2); }
.uu .quote blockquote { overflow-wrap: break-word; text-wrap: pretty; }
.uu .uu-zeilen { border-top: 1px solid var(--line); }
.uu .uu-zeilen .quote { padding: 20px 0 18px; border-left: 0; border-bottom: 1px solid var(--line); }
.uu .uu-zeilen .quote blockquote { max-width: 36em; font-size: 17px; line-height: 1.5; }
.uu .uu-zeilen .quote figcaption { margin-top: 8px; }
.uu .uu-kopf { padding-bottom: clamp(30px, 3.4vw, 42px); }
.uu .uu-kopf .uu-foto { aspect-ratio: 8 / 5; }
.uu .uu-kopf__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: var(--uu-gap); align-items: center; }
.uu .uu-kopf h1 { max-width: 13em; }
.uu .uu-kopf .pagehead__lede { max-width: 31em; }
.uu .uu-zahlen { padding: clamp(30px, 4.2vw, 52px) var(--gutter) 0; }
.uu .uu-zahlen__liste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.uu .uu-zahlen__liste li { padding: 22px 24px 20px; border-radius: var(--radius); background: var(--green-50); }
.uu .uu-zahlen__liste b { display: block; font-size: clamp(1.7rem, 1.25rem + 1.3vw, 2.25rem); font-weight: 450; letter-spacing: -.035em; line-height: 1.05; color: var(--green); font-variant-numeric: tabular-nums; white-space: nowrap; }
.uu .uu-zahlen__liste span { display: block; margin-top: 10px; font-size: 15.5px; font-weight: 600; line-height: 1.35; color: var(--ink); }
.uu .uu-zahlen__liste small { display: block; margin-top: 1px; font-size: 13.5px; font-weight: 400; color: var(--ink-2); }
.uu .uu-zahlen__liste b.wort { white-space: normal; overflow-wrap: break-word; hyphens: auto; text-wrap: balance; }
@media (min-width: 640px) and (max-width: 899px) { .uu .uu-zahlen__liste b { font-size: 1.5rem; } }
.uu .uu-nutzen { padding-top: clamp(36px, 4.4vw, 56px); }
.uu .uu-mitte { max-width: 44em; margin: 0 auto; text-align: center; }
.uu .uu-karten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: clamp(24px, 2.8vw, 32px); }
.uu .uu-karte { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; align-content: start; gap: 14px; padding: 22px 24px 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }
.uu .uu-karte__zeichen { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 3px; background: var(--green-50); color: var(--green); }
.uu .uu-karte__zeichen .icon { width: 24px; height: 24px; stroke-width: 1.8; }
.uu .uu-karte h3 { font-size: 19px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.uu .uu-karte p { grid-column: 1 / -1; font-size: 16px; line-height: 1.55; color: var(--ink-2); }
.uu .uu-stimmen .quotes { align-items: start; margin-top: clamp(26px, 3vw, 36px); }
.uu .uu-stimmen .quote { padding-bottom: 0; }
.uu .sec--band .uu-hinweis { border-color: var(--line); background: #fff; }
.uu .uu-fach__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(32px, 4vw, 48px) var(--uu-gap); align-items: center; }
.uu .uu-fach__grid > .uu-zeilen { align-self: start; }
@media (min-width: 761px) {
.uu .uu-fach__grid > .uu-zeilen .quote:last-child { padding-bottom: 0; border-bottom: 0; }
}
.uu .uu-ruhe__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.uu .uu-ruhe__grid > section:first-child { padding-right: calc(var(--uu-gap) / 2); }
.uu .uu-ruhe__grid > section + section { padding-left: calc(var(--uu-gap) / 2); border-left: 1px solid var(--line); }
.uu .uu-ruhe h2 { max-width: 15em; font-size: clamp(1.45rem, 1.2rem + .9vw, 1.85rem); line-height: 1.2; letter-spacing: -.028em; }
.uu .uu-haken { gap: 12px; max-width: 32em; margin-top: 20px; font-size: 16.5px; font-weight: 450; line-height: 1.5; }
.uu .uu-haken .icon { margin-top: 2px; }
.uu .uu-ruhe .uu-text { margin-top: 14px; }
.uu .uu-gruender { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 10px 24px; margin: 28px 0 0; }
.uu .uu-gruender__foto { grid-row: 1 / span 2; width: 140px; aspect-ratio: 1; object-fit: cover; border: 1px solid var(--line); border-radius: var(--radius); background: var(--line-2); }
.uu .uu-gruender blockquote { align-self: end; margin: 0; max-width: 30em; font-size: 18px; line-height: 1.5; color: var(--ink); text-wrap: pretty; }
.uu .uu-gruender figcaption { align-self: start; font-size: 14.5px; line-height: 1.4; color: var(--ink-3); }
.uu .uu-gruender figcaption b { display: block; font-size: 16px; font-weight: 600; line-height: 1.4; color: var(--ink); }
.uu .uu-hinweis { margin-top: 22px; padding: 20px 22px 22px; border-color: transparent; background: var(--green-50); }
.uu .uu-hinweis h3 { font-size: 18px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
.uu .uu-hinweis p { margin-top: 6px; font-size: 16px; line-height: 1.55; color: var(--ink-2); }
@media (min-width: 961px) {
.uu .uu-hinweis { grid-column: 1 / -1; display: grid; grid-template-columns: calc(40% + var(--uu-gap) / 2 - 4px) minmax(0, 1fr); align-items: baseline; margin-top: clamp(30px, 3.2vw, 40px); padding: 22px 24px 24px; }
.uu .uu-hinweis h3 { padding-right: 24px; }
.uu .uu-hinweis p { max-width: 38.25em; margin-top: 0; }
}
.uu .uu-ablauf__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.5fr); grid-template-rows: auto 1fr; gap: clamp(28px, 3.4vw, 40px) var(--uu-gap); align-items: start; }
.uu .uu-ablauf .how__steps { grid-column: 2; grid-row: 1 / span 2; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(24px, 3vw, 36px); border-top: 0; }
.uu .uu-ablauf .how__steps li { grid-template-columns: 34px minmax(0, 1fr); gap: 2px 16px; align-content: start; padding: 20px 0 22px; border-top: 1px solid var(--line); border-bottom: 0; }
.uu .uu-ablauf .how__steps li:nth-last-child(-n+2) { border-bottom: 1px solid var(--line); }
.uu .uu-ablauf__stimmen { grid-column: 1; grid-row: 2; }
@media (min-width: 961px) {
.uu .uu-ablauf__stimmen .quote:last-child { padding-bottom: 0; border-bottom: 0; }
}
@media (max-width: 960px) {
.uu .uu-ruhe__grid { grid-template-columns: minmax(0, 1fr); }
.uu .uu-ruhe__grid > section:first-child { padding-right: 0; }
.uu .uu-ruhe__grid > section + section { margin-top: 32px; padding: 32px 0 0; border-left: 0; border-top: 1px solid var(--line); }
.uu .uu-ruhe h2 { max-width: 20em; }
.uu .uu-ablauf__grid { display: block; }
.uu .uu-ablauf .how__steps { margin-top: 26px; }
.uu .uu-ablauf__stimmen { border-top: 0; }
}
@media (max-width: 860px) {
.uu .uu-karten { grid-template-columns: minmax(0, 1fr); gap: 10px; }
.uu .uu-karte { align-items: start; gap: 2px 16px; padding: 18px 20px 20px; }
.uu .uu-karte__zeichen { grid-row: span 2; }
.uu .uu-karte h3 { padding-top: 1px; }
.uu .uu-karte p { grid-column: 2; }
}
@media (max-width: 760px) {
.uu .uu-kopf__grid { grid-template-columns: minmax(0, 1fr); gap: 22px; }
.uu .uu-foto, .uu .uu-kopf .uu-foto { aspect-ratio: 16 / 9; }
.uu .uu-fach__grid { display: block; }
.uu .uu-fach__grid > div:not(.uu-zeilen) { margin-top: 24px; }
.uu .uu-fach__grid > .uu-zeilen { margin-top: 26px; }
.uu .uu-fach__grid > .uu-zeilen + .uu-zeilen { margin-top: 0; border-top: 0; }
}
@media (max-width: 640px) {
.uu { --uu-pad: 32px; }
.uu .uu-kopf__grid { gap: 18px; }
.uu .uu-kopf .uu-foto { aspect-ratio: 21 / 9; }
.uu .uu-nutzen { padding-top: 30px; }
.uu .uu-fach .uu-foto { display: none; }
.uu .uu-fach__grid > div:not(.uu-zeilen) { margin-top: 0; }
.uu .uu-fach__grid > .uu-zeilen { margin-top: 22px; }
.uu .uu-lede { margin-top: 12px; font-size: 16.5px; }
.uu .uu-text { font-size: 16px; line-height: 1.55; }
.uu .crumbs a { margin: -14px -12px; padding: 14px 12px; }
.uu .uu-zahlen__liste { grid-template-columns: minmax(0, 1fr); gap: 0; border-radius: var(--radius); background: var(--green-50); }
.uu .uu-zahlen__liste li { display: grid; grid-template-columns: 124px minmax(0, 1fr); align-items: center; gap: 0 14px; padding: 12px 16px; border-radius: 0; background: none; }
.uu .uu-zahlen__liste li + li { border-top: 1px solid rgba(0, 75, 24, .14); }
.uu .uu-zahlen__liste b { font-size: 1.25rem; }
.uu .uu-zahlen__liste span { margin-top: 0; font-size: 15px; }
.uu .uu-zahlen__liste small { font-size: 13px; }
.uu .uu-karten { margin-top: 24px; }
.uu .uu-karte { grid-template-columns: 36px minmax(0, 1fr); gap: 2px 14px; padding: 14px 16px 16px; }
.uu .uu-karten { gap: 8px; }
.uu .uu-karte__zeichen { width: 36px; height: 36px; }
.uu .uu-karte__zeichen .icon { width: 22px; height: 22px; }
.uu .uu-karte h3 { font-size: 17.5px; }
.uu .uu-karte p { font-size: 15.5px; line-height: 1.5; }
.uu .quote blockquote, .uu .uu-zeilen .quote blockquote { font-size: 16.5px; line-height: 1.5; }
.uu .quote figcaption { margin-top: 8px; font-size: 14px; }
.uu .uu-zeilen .quote { padding: 15px 0 14px; }
.uu .uu-haken { margin-top: 16px; gap: 10px; font-size: 16px; }
.uu .uu-ruhe__grid > section + section { margin-top: 24px; padding-top: 24px; }
.uu .uu-gruender { grid-template-columns: 120px minmax(0, 1fr); gap: 14px 16px; margin-top: 18px; }
.uu .uu-gruender blockquote { grid-column: 1 / -1; grid-row: 1; font-size: 16.5px; }
.uu .uu-gruender__foto { grid-row: 2; width: 120px; }
.uu .uu-gruender figcaption { grid-row: 2; grid-column: 2; align-self: center; }
.uu .uu-hinweis { margin-top: 18px; padding: 16px 16px 18px; }
.uu .uu-hinweis h3 { font-size: 17.5px; }
.uu .uu-hinweis p { font-size: 15.5px; line-height: 1.5; }
.uu .uu-ablauf .how__steps { grid-template-columns: minmax(0, 1fr); margin-top: 20px; }
.uu .uu-ablauf .how__steps li { gap: 1px 14px; padding: 14px 0 15px; }
.uu .uu-ablauf .how__steps li:nth-last-child(2) { border-bottom: 0; }
.uu .uu-ablauf .how__steps p { font-size: 15.5px; line-height: 1.5; }
}
.ueber__cta { margin-top: 30px; }
.ueber__hurdle { margin-top: 12px; font-size: 15px; color: var(--ink-3); }
.close .ueber__cta { margin-top: 0; }
.close .ueber__hurdle { color: rgba(255, 255, 255, .84); }
.contact { padding-top: clamp(48px, 6vw, 80px); padding-bottom: clamp(48px, 6vw, 80px); }
.contact__box { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; padding: 30px 34px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.contact__box h2 { font-size: clamp(1.4rem, 1.15rem + .9vw, 1.8rem); letter-spacing: -.028em; }
.contact__box p { margin-top: 8px; max-width: 34em; font-size: 17px; line-height: 1.5; color: var(--ink-2); }
.contact__mail { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; font-size: clamp(1.05rem, .95rem + .5vw, 1.3rem); font-weight: 600; letter-spacing: -.01em; color: var(--green); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 5px; }
.contact__mail:hover { color: var(--ink); }
.contact__mail .icon { width: 22px; height: 22px; stroke-width: 1.8; }
@media (max-width: 640px) { .contact__box { padding: 24px 20px; } }
.close__checks { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 32px; margin-top: 26px; font-size: 16.5px; font-weight: 560; color: #fff; }
.close__checks li { display: inline-flex; align-items: center; gap: 9px; }
.close__checks .icon { width: 20px; height: 20px; color: var(--gold); stroke-width: 2.4; }
.close .close__checks + .ueber__cta { margin-top: 30px; }
.close .ueber__cta .btn { margin-top: 0; }
@media (max-width: 640px) { .close__checks { flex-direction: column; align-items: center; gap: 8px; } }
.addr { position: relative; }
.addr__list { position: absolute; left: 0; right: 0; top: calc(100% + 5px); z-index: 20; margin: 0; padding: 5px; list-style: none; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-pop); }
.addr__list[hidden] { display: none; }
.addr__list button { display: block; width: 100%; min-height: 42px; padding: 9px 10px; border: 0; border-radius: 3px; background: none; color: var(--ink); font: inherit; font-size: 15.5px; line-height: 1.35; text-align: left; cursor: pointer; }
.addr__list button:hover, .addr__list button.active { background: var(--green-50); }
.addr__list button:focus-visible { outline: 2px solid var(--green); outline-offset: -2px; }
.addr__note { margin-top: 6px; font-size: 13.5px; line-height: 1.4; color: rgba(255, 255, 255, .82); }
.addr__note[hidden] { display: none; }
@media (max-width: 640px) { .addr__list { position: static; margin-top: 5px; } }
.pagehead .voices__rate { margin-top: 18px; }
.refs { padding-top: clamp(40px, 5vw, 64px); }
.refs__list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); columns: 2; column-gap: clamp(40px, 6vw, 88px); }
.ref { break-inside: avoid; padding: 24px 0 22px; border-bottom: 1px solid var(--line); }
.ref figure { margin: 0; }
.ref blockquote { margin: 0; font-size: 17.5px; line-height: 1.55; color: var(--ink); overflow-wrap: break-word; text-wrap: pretty; }
.ref figcaption { margin-top: 10px; font-size: 14.5px; line-height: 1.45; color: var(--ink-3); }
.ref figcaption b { color: var(--ink); font-weight: 600; }
.ref time { font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 960px) {
.refs__list { columns: 1; }
.ref { padding: 22px 0 20px; }
}
@media (max-width: 639px) {
.ref blockquote { font-size: 17px; }
}
.preise__liste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: clamp(28px, 3vw, 36px) 0 0; padding: 0; list-style: none; }
.preis { display: flex; flex-direction: column; padding: 24px 24px 26px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.preis h3 { font-size: 19px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; text-wrap: balance; }
@media (min-width: 961px) { .preis h3 { min-height: 2.6em; } }
.preis__groesse { margin-top: 4px; font-size: 15px; color: var(--ink-3); }
.preis__betrag { margin-top: 18px; font-size: clamp(1.7rem, 1.3rem + 1.1vw, 2.1rem); font-weight: 450; letter-spacing: -.035em; line-height: 1.05; color: var(--green); font-variant-numeric: tabular-nums; white-space: nowrap; }
.preis__betrag span { margin-right: 2px; font-size: 15px; font-weight: 600; letter-spacing: 0; color: var(--ink-2); }
.preis__abzug { margin-top: 8px; font-size: 15px; line-height: 1.45; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.preis__mehr { margin-top: 3px; font-size: 14.5px; color: var(--ink-3); }
.preis__text { margin: 12px 0 22px; font-size: 16px; line-height: 1.5; color: var(--ink-2); }
.preis .btn { margin-top: auto; align-self: flex-start; }
.preise__hinweis { margin-top: 22px; max-width: 62em; font-size: 15px; line-height: 1.55; color: var(--ink-2); }
.preise .stand { margin-top: 10px; }
.prose .preise__liste { margin-top: 1.2em; padding: 0; }
.preise__liste--spalte { grid-template-columns: minmax(0, 1fr); gap: 10px; }
.preise__liste--spalte .preis { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 24px; align-items: start; padding: 20px 22px 22px; }
.preise__liste--spalte .preis h3 { min-height: 0; margin: 0; }
.preise__liste--spalte .preis h3, .preise__liste--spalte .preis__groesse, .preise__liste--spalte .preis__text { grid-column: 1; }
.preise__liste--spalte .preis__betrag { grid-column: 2; grid-row: 1 / span 2; margin-top: 0; text-align: right; font-size: clamp(1.5rem, 1.2rem + .9vw, 1.85rem); }
.preise__liste--spalte .preis__groesse { margin-top: 4px; }
.preise__liste--spalte .preis__abzug { grid-column: 2; grid-row: 3; max-width: 16em; margin: 10px 0 16px; justify-self: end; text-align: right; }
.preise__liste--spalte .preis__text { margin: 10px 0 16px; }
.preise__liste--spalte .preis .btn { grid-column: 1 / -1; justify-self: start; color: #fff; text-decoration: none; }
.prose .preise__hinweis { margin-top: 1em; font-size: 15px; line-height: 1.55; }
.prose .preise__hinweis + .stand { margin-top: 10px; }
@media (max-width: 960px) {
.preise__liste { grid-template-columns: minmax(0, 1fr); gap: 10px; }
.preis { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 24px; align-items: start; padding: 20px 22px 22px; }
.preis h3, .preis__groesse, .preis__text { grid-column: 1; }
.preis__betrag { grid-column: 2; grid-row: 1 / span 2; margin-top: 0; text-align: right; }
.preis__abzug { grid-column: 2; grid-row: 3; max-width: 16em; margin: 10px 0 16px; justify-self: end; text-align: right; }
.preis__text { margin-bottom: 16px; }
.preis .btn { grid-column: 1 / -1; }
}
@media (max-width: 639px) {
.preis, .preise__liste--spalte .preis { display: flex; padding: 18px 18px 20px; }
.preis__betrag, .preise__liste--spalte .preis__betrag { margin-top: 12px; text-align: left; }
.preis__abzug, .preise__liste--spalte .preis__abzug { max-width: none; margin: 6px 0 0; text-align: left; }
.preise__liste--spalte .preis .btn { justify-self: stretch; }
.preis__text { margin: 8px 0 16px; font-size: 15.5px; }
.preis .btn { align-self: stretch; }
}
.points, .how__steps, .stories, .faq__list, .rg__list, .refs__list { border-top: 0; }
.points li:first-child, .how__steps li:first-child { padding-top: 0; }
.points li:last-child, .how__steps li:last-child { padding-bottom: 0; border-bottom: 0; }
.stories li:first-child a { padding-top: 0; }
.stories li:last-child { border-bottom: 0; }
.stories li:last-child a { padding-bottom: 0; }
.faq__list details:first-child summary { padding-top: 0; }
.faq__list details:last-child { border-bottom: 0; }
.rg__list li:last-child, .refs__list .ref:last-child { border-bottom: 0; }
@media (min-width: 961px) { .rg__list li:nth-last-child(2):nth-child(odd) { border-bottom: 0; } }
@media (max-width: 960px) {
.quotes { border-top: 0; }
.quotes .quote:first-child { padding-top: 0; }
.quotes .quote:last-child { padding-bottom: 0; border-bottom: 0; }
.related ul, .teasers { border-top: 0; }
.related li:last-child, .teasers li:last-child { border-bottom: 0; }
.benefits li:first-child { padding-top: 0; border-top: 0; }
.benefits li:last-child { padding-bottom: 0; border-bottom: 0; }
}
@media (max-width: 720px) {
.net__list { border-top: 0; }
.net__list li:last-child a, .net__list li:nth-last-child(2):nth-child(odd) a { border-bottom: 0; }
}
.ej--echt { max-width: 1044px; min-height: 420px; padding: 28px 32px 30px; }
@media (max-width: 639px) { .ej--echt { min-height: 360px; padding: 18px 14px 20px; } }
.ej--laedt { min-height: 441px; }
@media (max-width: 1040px) { .ej--laedt { min-height: calc(215px + 63vw); } }
@media (max-width: 639px) { .ej--laedt { min-height: min(613px, calc(185px + 104vw)); } }
.ej--detail.ej--laedt { min-height: 680px; }
@media (max-width: 639px) { .ej--detail.ej--laedt { min-height: 647px; } }
@media (max-width: 380px) { .ej--detail.ej--laedt { min-height: 750px; } }
@media (max-width: 960px) {
.quotes.quotes--fragen { row-gap: 30px; }
.quotes.quotes--fragen .quote, .quotes.quotes--fragen .quote:first-child, .quotes.quotes--fragen .quote:last-child { padding: 0; border-bottom: 0; }
}
.zusagen__kopf .more { margin-top: 24px; }
.zusagen li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 6px clamp(20px, 3vw, 44px); align-items: baseline; padding: 26px 0; }
.zusagen li + li { border-top: 1px solid var(--line); }
.zusagen li:first-child { padding-top: 0; }
.zusagen li:last-child { padding-bottom: 0; }
.zusagen h3 { font-size: clamp(1.2rem, 1.06rem + .45vw, 1.42rem); font-weight: 600; line-height: 1.25; letter-spacing: -.022em; text-wrap: balance; }
.zusagen p { font-size: 16.5px; line-height: 1.55; color: var(--ink-2); }
@media (max-width: 720px) {
.zusagen li { grid-template-columns: minmax(0, 1fr); padding: 20px 0; }
.zusagen h3 { font-size: 1.16rem; }
}
.sec__mehr { margin-top: 22px; }
.schieber__punkte { display: none; }
@media (max-width: 639px) {
.schieber, .prose .schieber { display: flex; gap: 10px; margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter); overflow-x: auto;
overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); scrollbar-width: none; }
.schieber::-webkit-scrollbar { display: none; }
.schieber > * { flex: 0 0 84%; min-width: 0; scroll-snap-align: start; }
.schieber:focus-visible { outline: 2px solid var(--green); outline-offset: 4px; }
.schieber__punkte { display: flex; justify-content: center; gap: 2px; margin-top: 8px; }
.schieber__punkte button { display: grid; place-items: center; width: 24px; height: 24px; padding: 0; border: 0; background: none; cursor: pointer; }
.schieber__punkte button::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #c3c9cd; transition: background .2s; }
.schieber__punkte button[aria-current="true"]::before { background: var(--green); }
.preise__liste.schieber .preis { display: flex; flex-direction: column; padding: 20px 20px 22px; }
.preise__liste.schieber .preis__betrag { margin-top: 16px; text-align: left; }
.preise__liste.schieber .preis__abzug { max-width: none; margin: 8px 0 0; text-align: left; }
.preise__liste.schieber .preis__text { margin: 12px 0 20px; }
.preise__liste.schieber .preis .btn { margin-top: auto; align-self: flex-start; }
.quotes.schieber, .uu .uu-stimmen .quotes.schieber { align-items: stretch; margin-top: 24px; }
.quotes.schieber .quote, .quotes.schieber .quote:first-child, .quotes.schieber .quote:last-child {
display: flex; flex-direction: column; padding: 20px 20px 22px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.quotes.schieber .quote blockquote { font-size: 16.5px; line-height: 1.55; }
.quotes.schieber .quote figcaption { margin-top: auto; padding-top: 14px; }
}
.nur-inhalt .skip, .nur-inhalt .top, .nur-inhalt .news, .nur-inhalt .foot, .nur-inhalt .dock, .nur-inhalt .crumbs, .nur-inhalt .sprachzeile { display: none !important; }
.nur-inhalt .pagehead { padding-top: 24px; }
