/* ==========================================================================
   Pasigo – Nachbau des Designs von www.pasigo.de (WordPress-Theme "Inovado")
   Werte (Abstände, Farben, Schriftgrößen) wurden vom Original vermessen.
   ========================================================================== */

@font-face { font-family: "Quicksand"; src: url("../fonts/quicksand.woff2") format("woff2"); font-weight: 400; font-display: swap; }

:root {
    --text: #444;
    --muted: #666;
    --light: #999;
    --link: #4390DF;          /* Primärfarbe (Links, aktive Tabs) */
    --accent: #289DCC;        /* Unterstrich des aktiven Menüpunkts */
    --gold: #B0922E;          /* Sekundärfarbe (hervorgehobene Menüpunkte) */
    --green: #60A917;         /* Logo-Grün (Formular-Buttons) */
    --orange: #FF6600;        /* Rechner-Buttons */
    --line: #DDD;
    --line-soft: #F1F1F1;
}

/* ---------- Grundlagen ---------- */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; border-top: 3px solid #333; background: #fff; color: var(--text); font: 13px/1.7 Arial, Helvetica, sans-serif; }
img { max-width: 100%; height: auto; border: 0; }
a { color: var(--link); text-decoration: none; transition: color 0.07s ease-in; }
a:hover { color: #333; }
p { margin: 0 0 20px; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 10px; font-weight: 400; color: var(--text); line-height: 1.4; }
h2, h3 { font-size: 18px; } /* Inhalt beginnt mit H2 (Original: H3), gleiche Optik */
strong, b { font-weight: 700; }
hr { margin: 10px 0 30px; border: 0; border-top: 1px solid var(--line); }
ul, ol { margin: 0 0 20px 30px; padding: 0; }
table { width: 100%; margin: 0 0 20px; border-collapse: collapse; }
address { font-style: normal; }
:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }

.container { width: 100%; max-width: 960px; margin: 0 auto; padding: 0 10px; }
.clear { clear: both; }
.clearfix::after { content: ""; display: table; clear: both; }
.sr-only { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 1rem; top: -100px; z-index: 300; padding: 8px 12px; background: #333; color: #fff; }
.skip-link:focus { top: 1rem; color: #fff; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.icon { width: 14px; height: 14px; flex: none; vertical-align: -2px; }
.gap-10 { height: 10px; }
.gap-20 { height: 20px; }
.gap-30 { height: 30px; }
.gap-40 { height: 40px; }
.mt-30 { margin-top: 30px; }
.small { font-size: 80%; }
.underline { text-decoration: underline; }
.align-right { text-align: right; }
.align-center { text-align: center; }
.align-justify { text-align: justify; }
.float-left { float: left; }
.float-right { float: right; }

/* ---------- Spalten (wie Inovado-Shortcodes) ---------- */
.one_half, .one_third, .two_third, .one_sixth { position: relative; float: left; margin: 0 4% 20px 0; }
.one_half { width: 48%; }
.one_third { width: 30.66%; }
.two_third { width: 65.33%; }
.one_sixth { width: 15.33%; }
.last { margin-right: 0 !important; }

/* ---------- Topbar ---------- */
.topbar { height: 39px; background: #fff; border-bottom: 1px solid #EFEFEF; font-size: 10px; }
.topbar .callus { line-height: 39px; color: var(--light); }
.topbar .callus a { color: var(--light); }
.topbar .callus a:hover { color: var(--muted); }

/* ---------- Header & Navigation ---------- */
.site-header { position: sticky; top: 0; z-index: 100; height: 90px; background: #fff; transition: box-shadow 0.2s; }
.site-header.is-scrolled { box-shadow: 0 1px 0 #EFEFEF, 0 2px 4px rgba(0, 0, 0, 0.06); }
.site-header .container { display: flex; justify-content: space-between; align-items: flex-start; height: 90px; }
.brand { display: block; margin-top: 20px; }
.logo { display: block; width: 130px; height: 50px; }

.site-nav__list { display: flex; margin: 0; padding: 0; list-style: none; }
.site-nav__link {
    display: block; height: 87px; margin: 0 0 0 15px; padding: 0 5px;
    border-bottom: 3px solid transparent; color: var(--muted); font-size: 13px; line-height: 87px;
}
.site-nav__link:hover { color: #333; border-bottom-color: #333; }
.site-nav__link--gold, .site-nav__link--gold:hover { color: var(--gold); font-weight: 700; }
.site-nav__link[aria-current="page"], .site-nav__link.is-current { color: var(--link); font-weight: 600; border-bottom-color: var(--accent); }
.site-nav__link--gold[aria-current="page"], .site-nav__link--gold.is-current { color: var(--gold); font-weight: 700; }

.nav-toggle {
    display: none; align-items: center; gap: 8px; min-height: 44px; padding: 0 12px;
    color: #333; background: #F6F6F6; border: 0; border-radius: 3px; cursor: pointer;
    font: 600 14px/1 inherit; font-family: inherit; transition: background-color 0.2s, transform 0.1s;
}
.nav-toggle:hover { background: #EDEDED; }
.nav-toggle:active { transform: scale(0.97); }
.nav-toggle[aria-expanded="true"] { background: rgba(96, 169, 23, 0.12); color: #3F7410; }
.nav-toggle .icon { width: 20px; height: 20px; }
.site-nav__chevron, .site-nav__call { display: none; }
.nav-toggle__close { display: none; }
.nav-toggle[aria-expanded="true"] .nav-toggle__open { display: none; }
.nav-toggle[aria-expanded="true"] .nav-toggle__close { display: inline; }

/* ---------- Titelbalken ---------- */
.page-title {
    padding: 25px 0;
    background: linear-gradient(to top, #FAFAFA 0%, #FFF 100%) #F9F9F9;
    border-top: 1px solid #E4E4E4; border-bottom: 1px solid #E4E4E4;
    box-shadow: inset 0 3px 0 0 rgba(0, 0, 0, 0.02);
}
.page-title h1 { margin: 0; color: var(--muted); font-size: 18px; line-height: 28px; }
.page-title__sub { margin: 0; color: #AAA; font-size: 15px; font-weight: 300; line-height: 22px; }

/* ---------- Inhalt ---------- */
.page { padding: 40px 0 40px; }
.entry::after { content: ""; display: table; clear: both; }

.title { display: block; margin: 0 0 20px; border-bottom: 1px solid var(--line-soft); font-size: 18px; line-height: 1 !important; color: var(--text); }
.title span { display: inline-block; margin: 0 0 -1px; padding: 0 0 10px; border-bottom: 1px solid #CCC; line-height: 1.2; }
a .title, .title a { color: var(--text); }
a:hover .title span { color: #333; }

blockquote { margin: 0 0 20px; padding: 0 0 0 20px; border-left: 4px solid #EBEBEB; color: #888; }
blockquote p { margin: 0; }
blockquote strong { color: #555; }

.styled-list { margin: 0 0 20px; list-style: none; }
.styled-list li { margin: 0 0 2px; }
.styled-list li .icon { margin-right: 6px; color: #333; }
.styled-list--spaced li { margin-bottom: 12px; }

.button-blue, .button-green, .button-orange {
    display: inline-block; padding: 6px; border-radius: 3px; color: #fff !important; text-align: center;
    font-weight: 700; font-size: 13px; line-height: 13px; border: 0; cursor: pointer; font-family: inherit;
}
.button-blue { width: 50%; margin-top: 10px; background: var(--link); }
.button-green { background: var(--green); }
.button-orange { background: var(--orange); }
.button-blue:hover, .button-green:hover, .button-orange:hover { background: #333; color: #fff; }
.button-block { display: block; width: 100%; padding: 4%; }
.button-grey { display: inline-block; margin-top: 10px; padding: 6px; border-radius: 3px; background: #999; color: #fff !important; text-align: center; font-weight: 700; font-size: 13px; line-height: 13px; }
.button-grey:hover { background: #333; }
.button-half { width: 50%; }

/* Von pasigo.de importierte Seiten */
.custom-table-1 { width: 100%; margin: 0 0 20px; border-collapse: collapse; border-top: 1px solid #E6E6E6; }
.custom-table-1 th { padding: 15px 20px; background: #F9F9F9; border-bottom: 1px solid #DDD; color: #333; font-size: 14px; font-weight: 700; text-align: center; }
.custom-table-1 td { padding: 10px 20px; border-bottom: 1px solid #E6E6E6; text-align: center; }
.custom-table-1 tbody tr:nth-child(even) { background: #FAFAFA; }
.imported .styled-list li { list-style: none; }
.icon-ok::before { content: "\2713"; margin-right: 6px; color: #444; font-style: normal; }
.imported img { max-width: 100%; height: auto; }
.full-img { width: 100%; }
.cf-files { margin: 6px 0 10px; padding: 0; border: 0; }
.cf-files legend { margin-bottom: 4px; padding: 0; }
.cf-files input[type="file"] { display: block; margin: 0 0 6px; font-size: 13px; }

/* Info-Box mit Streifenmuster (Inovado "description style-2") */
.description {
    margin: 0 0 20px; padding: 30px; border-radius: 4px;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='5'%3E%3Cpath d='M0 5L5 0' stroke='rgba(0,0,0,0.11)' stroke-width='1'/%3E%3C/svg%3E");
}
.description--quicksand { font-family: "Quicksand", Arial, sans-serif; font-size: 16px; }
.description--quicksand .contact-line { margin: 15px; }

/* Bilder in Inhaltsseiten (rechte Spalte, untereinander) */
.side-images a, .side-images img { display: block; width: 100%; }
.side-images img { margin-bottom: 0; }

/* Tabellen */
.datatable { border: 1px solid var(--line); }
.datatable th, .datatable td { padding: 6px 10px; border-bottom: 1px solid #EEE; text-align: left; }
.datatable thead th { background: #F9F9F9; font-weight: 700; }
.datatable td { text-align: right; white-space: nowrap; }
.datatable thead th:last-child { text-align: right; }
.table-meta { margin-top: -15px; color: var(--light); font-size: 11px; }

.facts { margin: 0 0 20px; }
.facts dt { font-weight: 700; }
.facts dd { margin: 0 0 8px; }

.address-block { margin: 0 0 20px; }
.note { padding: 10px 15px; margin: 0 0 20px; background: #DBE9F3; background-image: linear-gradient(to top, #DBE9F3 0, #fff 100%); border: 1px solid #9FC2DD; border-radius: 3px; color: #468BBF; }

/* Beispielrechnung */
.example { margin: 0 0 20px; }
.example p { margin: 0 0 10px; }
.example .sum { font-weight: 700; }

/* ---------- Preis-Tabs (Seitenleiste) ---------- */
.price-date { margin: -10px 0 2px; }
.tabset::after { content: ""; display: table; clear: both; }
.tabs { position: relative; top: 1px; display: flex; margin: 0; padding: 0; list-style: none; }
.tabs__btn {
    display: block; margin: 0 -1px 0 0; padding: 5px 10px; font: 13px/22.1px Arial, Helvetica, sans-serif; color: var(--link);
    background: linear-gradient(to top, #D9D9D9 0, #FFF 100%) #D9D9D9; border: 1px solid #D3D3D3; border-radius: 3px 3px 0 0; cursor: pointer;
}
.tabs__btn:hover { color: #333; }
.tabs__btn[aria-selected="true"] { color: #000; background: #fff; border-bottom-color: #fff; }
.panel { clear: both; padding: 12px 3% 3%; background: #fff; border: 1px solid #D3D3D3; box-shadow: 0 1px 1px 0 rgba(180, 180, 180, 0.1); }
.produkt { display: flex; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 110%; line-height: 1.55; }
.produkt__note { font-size: 80%; }

/* ---------- Formulare (Stil "Contact Form 7") ---------- */
.cf input[type="text"], .cf input[type="email"], .cf input[type="tel"], .cf input[type="date"], .cf select, .cf textarea {
    display: block; width: 100%; margin: 5px 0 0; padding: 5px 10px;
    font: 700 14px Arial, Helvetica, sans-serif; color: var(--light);
    background: #fff; border: 1px solid #D4D4D4; border-radius: 0;
}
.cf input:focus, .cf select:focus, .cf textarea:focus { outline: none; border-color: #AAA; color: var(--text); }
.cf select { padding: 7px 8px; }
.cf textarea { height: 60px; resize: vertical; }
.cf--large textarea { height: 150px; }
.cf ::placeholder { color: var(--light); opacity: 1; }
.cf [aria-invalid="true"] { border-color: #9A1616 !important; }
.cf .field__label { display: block; margin: 10px 0 0; font-weight: 400; color: var(--text); }
.cf .field__req { color: #BF1515; }
.cf .field__help { margin: 2px 0 0; color: var(--light); font-size: 11px; }
.cf .field__error { margin: 2px 0 0; color: #BF1515; font-size: 12px; }
.cf .field--check { display: flex; gap: 8px; align-items: flex-start; margin: 10px 0 0; font-size: 12px; line-height: 1.5; }
.cf .field--check input { margin-top: 2px; }
.cf-submit {
    display: block; width: 100%; margin: 10px 0 0; padding: 5px 10px;
    font: 700 14px/18px Arial, Helvetica, sans-serif; color: #fff;
    background: var(--green); border: 1px solid var(--green); border-radius: 3px; cursor: pointer;
}
.cf-submit:hover { background: #333; border-color: #333; }
.cf-help { margin-top: 10px; }
.cf-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
.cf-grid .field--full { grid-column: 1 / -1; }

.alert { margin: 0 0 15px; padding: 5px; border-radius: 3px; color: #fff; font-weight: 600; text-align: center; box-shadow: 0 1px 1px 0 rgba(180, 180, 180, 0.1); }
.alert:focus { outline: none; }
.alert ul { margin: 5px 0 0; padding: 0; list-style: none; font-weight: 400; }
.alert a { color: #fff; text-decoration: underline; }
.alert--success { background: var(--green); }
.alert--error { background: #9A1616; }

/* ---------- Startseite: Kachel-Raster ---------- */
.frontpage .one_sixth { width: 16.666%; margin-right: 0; }
.teaser { padding: 15px 15px 10px; background: #fff; border: 1px solid var(--line); box-shadow: 0 1px 1px 0 rgba(180, 180, 180, 0.2); }
.teaser-img img { display: block; width: 100%; }
/* Wie im Original: Bildbereich reicht bis an den Kachelrand, Bild füllt die Breite mit 10 % Innenabstand */
.frontpage .teaser-img { margin: -16px -16px 15px; }
.frontpage .teaser-img img { width: 100%; padding: 10%; }
.teaser .h4 { min-height: 20px; margin: 0 -5px; text-align: center; font-size: 90%; font-weight: 700; }
.frontpage h2 a { color: var(--link); }
.frontpage h2 a:hover { color: #333; }

/* Schnell-Rechner */
.rechner { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: -15px; padding: 2%; }
.rechner input[type="text"] { width: 70px; height: 30px; padding: 4px; text-align: right; font: 13px Arial, sans-serif; border: 1px solid #D4D4D4; }
.rechner select { height: 30px; padding: 4px; font: 13px Arial, sans-serif; color: var(--light); border: 1px solid #D4D4D4; background: #fff; }
.rechner button { height: 30px; padding: 4px 10px; font: 700 13px Arial, sans-serif; color: #fff; background: var(--orange); border: 1px solid var(--orange); border-radius: 3px; cursor: pointer; }
.rechner button:hover { background: #333; border-color: #333; }
.rechner__result { font-weight: 700; color: var(--text); }

/* ---------- Kundenmeinungen ---------- */
.testimonial { position: relative; padding: 20px; background: #fff; border: 1px solid #D3D3D3; border-radius: 3px; box-shadow: 1px 1px 2px 0 rgba(180, 180, 180, 0.2); }
.testimonial p:last-child { margin-bottom: 0; }
.testimonial::before, .testimonial::after { content: ""; position: absolute; left: 30px; border-style: solid; }
.testimonial::before { bottom: -22px; border-width: 22px 22px 0 0; border-color: #D3D3D3 transparent transparent; }
.testimonial::after { bottom: -20px; left: 31px; border-width: 20px 20px 0 0; border-color: #fff transparent transparent; }
.testimonial-author { margin: 4px 0 20px 56px; color: #B2B2B2; min-height: 22px; }

/* ---------- Aufklapper (Goldrechner "Funktionsweise") ---------- */
.toggle { margin-bottom: 20px; }
.toggle-title {
    display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 10px 15px;
    font: 600 13px Arial, sans-serif; color: var(--light); text-align: left;
    background: linear-gradient(to top, #F7F7F7 0, #FFF 100%) #F9F9F9; border: 1px solid var(--line); border-radius: 3px; cursor: pointer;
}
.toggle-title[aria-expanded="true"] { color: var(--text); border-radius: 3px 3px 0 0; }
.toggle-title .icon { transition: transform 0.2s; }
.toggle-title[aria-expanded="true"] .icon { transform: rotate(180deg); }
.toggle-inner { padding: 20px 20px 0; background: #fff; border: 1px solid var(--line); border-top: 0; border-radius: 0 0 3px 3px; }

/* ---------- Goldrechner ---------- */
.calc-row { display: grid; grid-template-columns: 1fr 110px 90px; gap: 10px; align-items: center; margin: 2px 0; color: var(--muted); font-size: 110%; }
.calc-row input { width: 100%; height: 28px; margin-bottom: 8px; padding: 4px 6px; text-align: right; font: 13px Arial, sans-serif; border: 1px solid #D4D4D4; }
.calc-row__price { text-align: right; white-space: nowrap; }
.calc-sum { padding: 5%; }
.calc-sum__value { padding-right: 25px; margin-top: 5px; font-size: 220%; line-height: 1.2; text-align: right; }
.calc-sum__value sup { font-size: 40%; }
.calc-actions .button-orange, .calc-actions .button-blue { display: block; width: 100%; margin: 0 0 15px; padding: 4%; }
.footnotes { clear: both; color: var(--muted); font-size: 12px; }
.footnotes h3 { margin: 0 0 4px; font-size: 13px; font-weight: 700; color: var(--text); }

/* ---------- Verkauf starten / Versandtasche ---------- */
.newTeaser .teaser { padding: 15px; }
.newTeaser .teaser-img img { width: 98%; margin: 1%; }
.newTeaser h2 { margin-top: 15px; text-align: right; }
.subteaser { display: block; margin-top: -8px; text-align: right; color: var(--gold); font-weight: 700; }
/* Auswahl-Kästen auf "Verkauf jetzt starten" */
.choice .teaser { padding: 15px 15px 10px; }
.choice .teaser-img { margin: -16px -16px 15px; }
.choice .teaser-img img { width: calc(100% - 6px); height: auto; margin: 3px; }
.choice h2 { margin: 0 0 10px; font-size: 18px; font-weight: 400; color: #444; text-align: right; }
/* Beide Auswahl-Kästen gleich hoch, Buttons unten auf einer Linie (ab Tablet-Breite) */
@media (min-width: 768px) {
    .choice-row { display: flex; align-items: stretch; }
    .choice-row > .choice { display: flex; }
    .choice-row .teaser { display: flex; flex-direction: column; width: 100%; }
    .choice-row .teaser > p:last-child { margin-top: auto; margin-bottom: 0; }
}
.subteaser1 { float: right; display: block; margin: -12px 0 6px; padding: 1px 3px; background: #999; color: #fff; font-weight: 700; }
.full-img { display: block; width: 100%; height: auto; }
/* Nummern-Kästchen wie Inovado "dropcap-box" */
.dropcap {
    float: left; width: 50px; height: 50px; margin: 6px 12px 0 0;
    color: var(--text); background: #F9F9F9; border: 1px solid var(--line); border-radius: 3px;
    box-shadow: 0 1px 1px 0 rgba(180, 180, 180, 0.2);
    font-size: 28px; line-height: 48px; text-align: center;
}
.step { overflow: hidden; margin: 0 0 20px; }
.newTeaser .teaser .step:first-of-type { margin-top: 10px; }

/* ---------- Sitemap ---------- */
.sitemap-col ul { margin-left: 18px; }

/* ---------- Footer ---------- */
.site-footer { padding: 50px 0; background: #444; color: var(--light); border-top: 10px solid #333; }
.site-footer a { color: var(--light); }
.site-footer a:hover { color: #fff; }
.footer-cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.widget h2, .widget__spacer { min-height: 30px; margin: 0 0 20px; padding: 0 0 5px; color: #fff; font-size: 15px; line-height: 24px; border-bottom: 1px solid #555; }
.widget ul { margin: 0; list-style: none; }

/* Suche im Footer (wie pasigo.de: dunkles Feld mit Lupe, unter der ersten Spalte) */
.site-search { position: relative; max-width: 260px; }
.site-search__icon { position: absolute; left: 9px; top: 50%; width: 15px; height: 15px; margin-top: -7.5px; color: #AAA; pointer-events: none; }
.site-search__input {
    width: 100%; padding: 8px 8px 8px 30px; color: #DDD; background: #555; border: 1px solid #555; border-radius: 2px;
    font: 13px/1.2 Arial, Helvetica, sans-serif; -webkit-appearance: none; appearance: none;
}
.site-search__input::placeholder { color: #AAA; opacity: 1; }
.site-search__input:focus { background: #5E5E5E; border-color: #888; outline: none; box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.25); }
.site-search__input::-webkit-search-cancel-button { filter: invert(0.8); }
/* Vorschläge öffnen sich nach oben (Feld steht am Seitenende) */
.site-search__list {
    position: absolute; left: 0; right: 0; bottom: calc(100% + 6px); z-index: 20; margin: 0; padding: 4px 0;
    list-style: none; background: #fff; border-radius: 3px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
}
.widget .site-search__list li { margin: 0; padding: 0; border: 0; background: none; }
.site-search__list a { display: block; padding: 8px 12px; color: #444 !important; font-size: 13px; line-height: 1.35; }
.site-search__list a[aria-selected="true"], .site-search__list a:hover { background: #F1F1F1; color: #222 !important; }
.site-search__list .site-search__all a { color: var(--link) !important; font-weight: 700; border-top: 1px solid #EEE; }
.site-search__list .site-search__empty { padding: 8px 12px; color: #666; font-size: 13px; }

/* Hinweis auf die Webagentur am Ende des Impressums */
.site-credit { clear: both; margin-top: 40px; padding-top: 10px; }
.site-credit__link { display: inline-block; margin: 0 0 6px; }
.site-credit__link img { display: block; width: 180px; height: auto; }
.site-credit__url { margin: 0; font-size: 13px; }

/* Suchergebnisse */
.search-count { color: var(--muted); }
.search-results { margin: 0 0 30px; padding: 0; list-style: none; }
.search-result { padding: 0 0 18px; margin: 0 0 18px; border-bottom: 1px solid var(--line-soft); }
.search-result__title { margin: 0 0 6px; font-size: 16px; }
.search-result__excerpt { margin: 0; color: var(--muted); }
.search-result__excerpt mark { background: #FFF1B8; color: inherit; padding: 0 1px; border-radius: 2px; }
.search-pager { display: flex; flex-wrap: wrap; gap: 6px; }
.search-pager a, .search-pager span { min-width: 36px; padding: 6px 10px; text-align: center; border: 1px solid var(--line); border-radius: 3px; }
.search-pager .search-pager__gap { min-width: 0; border: 0; color: var(--light); }
.search-pager span[aria-current] { background: var(--link); border-color: var(--link); color: #fff; }
.widget li {
    padding: 1px 0 1px 12px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='5'%3E%3Cpath d='M1 0L3.5 2.5L1 5' fill='none' stroke='%23999' stroke-width='1'/%3E%3C/svg%3E") 0 9px no-repeat;
}

.copyright { padding: 5px 0; background: #222; color: #777; }
.copyright a { color: #888; }
.copyright a:hover { color: #fff; }
.copyright-text { padding-top: 10px; padding-bottom: 10px; }

/* ---------- Responsive (wie das Skeleton-Raster des Originals) ---------- */
@media (max-width: 959px) {
    .site-nav__link { margin-left: 8px; padding: 0 3px; font-size: 12px; }
}

@media (max-width: 767px) {
    .topbar .callus { background: #EFEFEF; text-align: center; }
    .site-header { height: auto; }
    .site-header .container { flex-wrap: wrap; height: auto; padding-bottom: 10px; }
    .brand { margin: 12px 0 0; }
    .nav-toggle { display: inline-flex; margin-top: 15px; }

    /* Mobiles Menü: klappt sanft auf (0fr -> 1fr), bleibt im Seitenfluss unter dem Logo */
    .site-nav {
        display: grid; grid-template-rows: 0fr; width: 100%;
        visibility: hidden; opacity: 0;
        transition: grid-template-rows 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease, visibility 0s linear 0.28s;
    }

    .site-nav.is-open {
        grid-template-rows: 1fr; visibility: visible; opacity: 1;
        transition: grid-template-rows 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease, visibility 0s;
    }
    .site-nav__inner { min-height: 0; overflow: hidden; }
    .site-nav__list { flex-direction: column; gap: 2px; margin: 14px 0 0; padding: 6px 0 0; border-top: 1px solid #EFEFEF; }
    .site-nav__link {
        display: flex; align-items: center; justify-content: space-between; gap: 12px;
        height: auto; min-height: 52px; margin: 0; padding: 0 12px 0 14px;
        font-size: 16px; line-height: 1.3; border-bottom: 0; border-radius: 3px;
        transition: background-color 0.15s;
    }
    .site-nav__link:hover { border-bottom: 0; background: #F6F6F6; }
    .site-nav__chevron { display: block; width: 18px; height: 18px; color: #BBB; transform: rotate(-90deg); }
    .site-nav__link[aria-current="page"], .site-nav__link.is-current {
        color: #2F5A0B; border-bottom: 0; background: rgba(96, 169, 23, 0.1); box-shadow: inset 3px 0 0 var(--green);
    }
    .site-nav__link--gold[aria-current="page"], .site-nav__link--gold.is-current { color: #7A641F; }
    .site-nav__link[aria-current="page"] .site-nav__chevron, .site-nav__link.is-current .site-nav__chevron { color: var(--green); }

    .site-nav__call { display: block; margin: 12px 0 6px; padding: 16px 14px; background: #F6F6F6; border-radius: 3px; }
    .site-nav__call p { margin: 0 0 10px; color: var(--muted); font-size: 14px; line-height: 1.4; }
    .site-nav__call-btn {
        display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 14px;
        background: #4A8512; color: #fff !important; border-radius: 3px; font-weight: 700; font-size: 15px;
        transition: background-color 0.15s, transform 0.1s;
    }
    .site-nav__call-btn:hover { background: #3F7410; }
    .site-nav__call-btn:active { transform: scale(0.98); }
    .site-nav__call-btn .icon { width: 18px; height: 18px; }
    .one_half, .one_third, .two_third { float: none; width: 100%; margin-right: 0; }
    .frontpage .one_sixth { width: 33.333%; }
    .footer-cols { grid-template-columns: 1fr 1fr; }
    .cf-grid { grid-template-columns: 1fr; }
    .button-blue { width: 100%; padding: 10px; }
    .calc-row { grid-template-columns: 1fr 90px 80px; }
}

@media (max-width: 479px) {
    .frontpage .one_sixth { width: 50%; }
    .footer-cols { grid-template-columns: 1fr; }
    .widget__spacer { display: none; }
    .rechner input[type="text"], .rechner select, .rechner button { width: 100%; }
}

@media print {
    .topbar, .site-header, .site-footer, .copyright, .sidebar { display: none !important; }
}

/* Mobiles Menü ohne Animation, wenn "Bewegung reduzieren" aktiv ist */
@media (prefers-reduced-motion: reduce) {
    .site-nav, .site-nav.is-open, .nav-toggle, .site-nav__link, .site-nav__call-btn { transition: none; }
}