html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--paper)}
a{color:inherit}
main :focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:4px}
main .dunkel :focus-visible{outline-color:var(--teal)}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:24px;padding-right:24px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
main h1,main h2,main h3{font-family:var(--font);font-weight:800;letter-spacing:-.025em;margin:0;text-wrap:balance}
main h1{font-size:clamp(42px,6.2vw,78px);line-height:1;letter-spacing:-.03em}
main h1 em,main h2 em{font-style:normal;color:var(--teal-text)}
main h2{font-size:clamp(32px,4.2vw,52px);line-height:1.02}
main h3{font-size:21px;font-weight:700;line-height:1.2;letter-spacing:-.01em}
main p{margin:0}
.ueber{display:inline-block;font-size:30px;color:var(--teal-text);transform:rotate(-3deg);margin:0 0 10px}
.lead{font-size:clamp(18px,2vw,22px);font-weight:300;max-width:60ch;margin-top:20px}
.lead.ohne-abstand{margin-top:0}
.knopf,.knopf-linie{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:14px;font:600 17px/1 var(--font);color:var(--ink);text-decoration:none;transition:transform .15s,box-shadow .15s}
.knopf{background:var(--teal);box-shadow:0 6px 0 -1px #0096B0}
.knopf-linie{background:var(--white);box-shadow:inset 0 0 0 1.5px var(--ink)}
.dunkel .knopf-linie{background:transparent;color:var(--on-dark);box-shadow:inset 0 0 0 1.5px var(--on-dark-muted)}
@media (hover:hover) and (pointer:fine){ .knopf:hover,.knopf-linie:hover{transform:translateY(-3px) rotate(-1deg)} .knopf:hover{box-shadow:0 12px 24px -12px rgba(38,52,56,.5)} }
.knopf:active,.knopf-linie:active{transform:scale(.97)}
.knoepfe{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
main section{padding:clamp(56px,8vw,88px) 0}
main section.ohne-oben{padding-top:0}

.sprung{background:var(--white);border-bottom:1px solid var(--mist)}
.sprung .wrap{display:flex;gap:8px 24px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px;font-weight:600;font-size:15px}
.sprung a{text-decoration:none;color:var(--teal-text);padding:6px 0}
.sprung a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}

.held{padding-top:clamp(40px,7vw,72px)}
.held-raster{display:grid;gap:40px;align-items:end}
@media (min-width:920px){ .held-raster{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)} }
.uhrkarte{background:var(--teal-10);border-radius:var(--radius);padding:26px 28px}
.uhrkarte .zeit{font:800 clamp(48px,7vw,72px)/1 var(--font);letter-spacing:-.03em}
.uhrkarte .zeit small{font-size:.45em;font-weight:400;letter-spacing:0}
.uhrkarte p{color:var(--muted);margin-top:10px}
.leiste{height:10px;border-radius:5px;background:var(--white);margin-top:18px;position:relative;overflow:hidden}
.leiste i{position:absolute;left:0;top:0;bottom:0;width:62%;background:var(--teal);border-radius:5px}

.nutzen{display:grid;gap:16px;margin-top:36px}
@media (min-width:720px){ .nutzen{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (min-width:1040px){ .nutzen{grid-template-columns:repeat(3,minmax(0,1fr))} }
.nk{background:var(--white);border:1px solid var(--mist);border-radius:var(--radius);padding:26px 26px 28px}
.nk .nr{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--teal);color:var(--ink);font:800 17px var(--font);margin-bottom:16px;transform:rotate(-6deg)}
.nk p{color:var(--muted);margin-top:10px}
.nk .geplant{display:inline-block;margin-top:12px;font-size:14px;font-weight:600;color:var(--ink);background:var(--red-10);border-radius:999px;padding:4px 10px}

.dunkel{background:var(--ink);color:var(--on-dark)}
.dunkel .ueber{color:var(--teal)}
.dunkel h2 em{color:var(--teal)}
.dunkel .lead,.dunkel .gedimmt{color:var(--on-dark-muted)}
.schritte{display:grid;gap:20px;margin:40px 0 0;padding:0;list-style:none;counter-reset:s}
@media (min-width:820px){ .schritte{grid-template-columns:repeat(3,minmax(0,1fr))} }
.schritte li{counter-increment:s;border-top:3px solid var(--teal);padding-top:18px}
.schritte li::before{content:counter(s);display:block;font:800 44px/1 var(--font);color:var(--teal);margin-bottom:10px}
.schritte p{color:var(--on-dark-muted);margin-top:8px}

.tab-rahmen{overflow-x:auto;margin-top:32px;background:var(--white);border:1px solid var(--mist);border-radius:var(--radius);-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;min-width:640px}
caption{text-align:left;padding:20px 24px 0;font-weight:700;color:var(--muted)}
th,td{padding:14px 18px;text-align:center;border-bottom:1px solid var(--mist);vertical-align:middle}
th:first-child,td:first-child{text-align:left}
thead th{font:800 22px/1.1 var(--font);letter-spacing:-.01em;padding-top:22px;padding-bottom:16px}
thead th small{display:block;font:400 14px/1.3 var(--font);letter-spacing:0;color:var(--muted);margin-top:4px}
thead th.hervor{background:var(--teal-10);box-shadow:inset 0 4px 0 var(--teal)}
td.hervor{background:var(--teal-10)}
tbody th{font-weight:600;font-size:16px}
tbody th small{display:block;font-weight:400;color:var(--muted);font-size:14px}
.ja{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--teal);color:var(--ink)}
.ja svg{width:15px;height:15px}
.nein{color:var(--muted)}
.teils{font-size:14px;font-weight:600;color:var(--ink)}
tr.preis td,tr.preis th{font-weight:700;border-bottom:0;padding-top:18px;padding-bottom:22px}
.bald{font-size:14px;font-weight:600;color:var(--ink);background:var(--mist);border-radius:999px;padding:4px 10px;white-space:nowrap}
td.links,th.links{text-align:left}
.hinweis{font-size:15px;color:var(--muted);margin-top:14px;max-width:70ch}

.ehrlich{display:grid;gap:28px;align-items:center}
@media (min-width:880px){ .ehrlich{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)} }
.zitat{font:800 clamp(28px,3.6vw,44px)/1.1 var(--font);letter-spacing:-.02em}
.zitat::before{content:"";display:block;width:56px;height:5px;border-radius:3px;background:var(--teal);margin-bottom:20px}

.fragen{margin-top:28px;display:grid;gap:10px}
details{background:var(--white);border:1px solid var(--mist);border-radius:14px;padding:0 22px}
summary{cursor:pointer;list-style:none;font:700 19px/1.3 var(--font);padding:18px 30px 18px 0;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:0;top:14px;font:700 24px var(--font);color:var(--teal-text)}
details[open] summary::after{content:"–"}
details p{padding:0 0 20px;color:var(--muted);max-width:70ch}

.kontakt{display:grid;gap:24px}
@media (min-width:880px){ .kontakt{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:end} }
.visitenkarte{background:var(--white);color:var(--ink);border-radius:var(--radius);padding:26px 28px}
.visitenkarte b{display:block;font:800 24px/1.2 var(--font);letter-spacing:-.01em}
.visitenkarte p{margin-top:6px}
.visitenkarte a{font-weight:700;color:var(--teal-text)}
@media (max-width:640px){ .wrap{padding-left:16px;padding-right:16px} .sprung .nur-breit{display:none} .ueber{font-size:26px} }
@media (prefers-reduced-motion:reduce){*{transition:none !important;scroll-behavior:auto !important}}