/* Gemeinsame Gestaltung von Privat- und Firmenkundenseite.
   Beide Seiten trugen bisher eine eigene, fast identische Kopie davon.
   Das Kopfbild ist der einzige echte Unterschied; jede Seite setzt es
   selbst ueber die Variable --hero-bild.
   Reihenfolge der Regeln bitte nicht umsortieren - sie entscheidet,
   welche Regel gewinnt. */

*{box-sizing:border-box;margin:0;padding:0;user-select:none}
html{scroll-behavior:smooth}
body{font-family:Arial,sans-serif;background:#fefefd;color:#1f2933;line-height:1.6;cursor:default}
h1,h2,h3,p,li{overflow-wrap:break-word;hyphens:auto}
span,a{overflow-wrap:break-word}
input,textarea,select{user-select:text;cursor:text}
a,button,summary{cursor:pointer}
:target{scroll-margin-top:112px}
.header{position:sticky;top:0;z-index:100; background:rgba(254,254,253,.94); backdrop-filter:blur(12px); border-bottom:1px solid rgba(14,78,45,.12); transition:.25s ease}
.header.scrolled{background:rgba(254,254,253,.84);box-shadow:0 8px 24px rgba(14,78,45,.08)}
.header-inner{max-width:1180px;margin:auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:14px;color:#0e4e2d;font-weight:900;font-size:23px;text-decoration:none;white-space:nowrap}
.brand img{width:64px;height:64px;border-radius:50%;object-fit:cover;box-shadow:0 6px 18px rgba(14,78,45,.18)}
.nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.nav a,.dropbtn{height:42px;display:inline-flex;align-items:center;justify-content:center; color:#0e4e2d;text-decoration:none;font-weight:800;padding:0 14px; border-radius:999px;background:transparent;border:0;font-size:14px;line-height:1;font-family:inherit;transition:.2s ease}
.nav a:hover,.dropdown:hover .dropbtn{background:#eef4ec}
.home-btn{background:#0e4e2d!important;color:#fefefd!important}
.home-btn:hover{background:#08391f!important}
.dropdown{position:relative}
.dropdown-content{display:none;position:absolute;top:48px;left:0;background:#fefefd; border:1px solid rgba(14,78,45,.14);border-radius:16px; box-shadow:0 12px 30px rgba(0,0,0,.12);min-width:245px;padding:8px}
.dropdown-content a{width:100%;justify-content:flex-start;border-radius:12px;white-space:nowrap}
.dropdown:hover .dropdown-content{display:block}
.wrap{max-width:1120px;margin:auto;padding:26px 24px 0}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}
.reveal.show{opacity:1;transform:translateY(0)}
.kicker{color:#548031;font-weight:900;text-transform:uppercase;font-size:13px;letter-spacing:.6px;margin-bottom:10px}
h1,h2,h3{color:#0e4e2d}
h1{font-size:43px;line-height:1.08;margin-bottom:18px}
h2{font-size:31px;margin:56px 0 20px}
h3{font-size:22px}
.lead{font-size:18px;color:#56645d;max-width:850px;margin-bottom:13px}
.hero{position:relative; width:100vw; min-height:390px; margin-top:-26px; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); margin-bottom:54px; padding:0; overflow:hidden; background: var(--hero-bild), linear-gradient(135deg,#f6f3ee 0%,#eef4ec 55%,#dfe9dc 100%); background-size:cover; background-position:center right; border:0; border-radius:0; box-shadow:none}
.hero::before{content:""; position:absolute; inset:0; background:linear-gradient( to right, rgba(254,254,253,1) 0%, rgba(254,254,253,.98) 24%, rgba(254,254,253,.90) 38%, rgba(254,254,253,.68) 52%, rgba(254,254,253,.30) 68%, rgba(254,254,253,0) 88% ); pointer-events:none}
.hero::after{content:""; position:absolute; inset:auto 0 0 0; height:80px; background:linear-gradient(to bottom,rgba(254,254,253,0),#fefefd); pointer-events:none}
.hero-content{position:relative; z-index:2; max-width:1120px; min-height:390px; margin:0 auto; padding:54px 24px; display:flex; flex-direction:column; justify-content:center}
.hero-content h1,.hero-content .lead,.hero-actions{max-width:590px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.hero-actions a{text-decoration:none;font-weight:900;border-radius:999px;padding:13px 18px;transition:.25s ease}
.primary-link{background:#0e4e2d;color:white}
.secondary-link{background:#f6f3ee;color:#0e4e2d;border:1px solid rgba(14,78,45,.16)}
.hero-actions a:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(14,78,45,.12)}
.about-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:24px;align-items:start}
.about-intro{background:#f6f3ee;border:1px solid rgba(14,78,45,.14);border-radius:26px;padding:26px}
.about-intro p{color:#3d4a43;margin-bottom:12px}
.about-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.about-card{background:white;border:1px solid rgba(14,78,45,.14);border-radius:22px;padding:20px;box-shadow:0 8px 20px rgba(14,78,45,.06);transition:.25s ease}
.about-card:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(14,78,45,.10)}
.about-card h3{font-size:18px;margin-bottom:8px}
.about-card p{color:#3d4a43;font-size:15px}
.service{display:grid;grid-template-columns:36% 64%; background:white;border:1px solid rgba(14,78,45,.14);border-radius:24px; overflow:hidden;margin:22px 0;box-shadow:0 8px 22px rgba(14,78,45,.07);transition:.25s ease}
.service.reverse{grid-template-columns:64% 36%}
.service.reverse img{order:2}
.service:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(14,78,45,.12)}
.service img{width:100%;height:100%;min-height:245px;object-fit:cover}
.service-content{padding:24px 26px;display:flex;flex-direction:column;justify-content:center}
.service h3{font-size:24px;margin-bottom:8px}
.short{color:#3d4a43;font-size:15.5px;margin-bottom:8px;max-width:730px}
details{margin-top:12px;border-top:1px solid rgba(14,78,45,.14);padding-top:14px}
summary{color:#0e4e2d;background:#eef4ec;border:1px solid rgba(14,78,45,.14); border-radius:999px;font-weight:900;list-style:none;width:fit-content; padding:9px 14px;transition:.25s ease}
summary:hover{background:#dfe9dc}
summary::-webkit-details-marker{display:none}
summary::after{content:" ▾";color:#0e4e2d}
details[open] summary::after{content:" ▴"}
.details-text{margin-top:14px;color:#3d4a43;font-size:15.5px;max-width:760px}
.info-box{background:#f6f3ee;border:1px solid rgba(14,78,45,.14);border-radius:26px;padding:26px;margin-top:20px}
.info-box p{color:#3d4a43;margin-bottom:12px}
.area-section{display:grid;grid-template-columns:.95fr 1.05fr;gap:26px;align-items:center; background:#f6f3ee;border:1px solid rgba(14,78,45,.14);border-radius:28px;padding:26px}
.area-visual{min-height:300px;border-radius:24px; background: linear-gradient(rgba(14,78,45,.04),rgba(14,78,45,.04)), url("../bilder/Einsatztgebiet.webp"), linear-gradient(135deg,#fefefd 0%,#eef4ec 50%,#dfe9dc 100%); background-size:cover;background-position:center; box-shadow:0 12px 28px rgba(14,78,45,.12); border:1px solid rgba(14,78,45,.12)}
.extra-area{margin-top:18px;color:#3d4a43}
.extra-area strong{color:#0e4e2d}
.begleitung-visual{min-height:300px;border-radius:24px; background: linear-gradient(rgba(14,78,45,.04),rgba(14,78,45,.04)), var(--img,linear-gradient(135deg,#fefefd 0%,#eef4ec 50%,#dfe9dc 100%)), linear-gradient(135deg,#fefefd 0%,#eef4ec 50%,#dfe9dc 100%); background-size:cover;background-position:center; box-shadow:0 12px 28px rgba(14,78,45,.12); border:1px solid rgba(14,78,45,.12)}
.service-visual{min-height:245px; background: linear-gradient(rgba(14,78,45,.04),rgba(14,78,45,.04)), var(--img,linear-gradient(135deg,#eef4ec 0%,#dfe9dc 55%,#cfe0cb 100%)), linear-gradient(135deg,#eef4ec 0%,#dfe9dc 55%,#cfe0cb 100%); background-size:cover;background-position:center}
.service.reverse .service-visual{order:2}
.begleitung-cards{margin-top:22px}
.notice-box strong{display:block;color:#0e4e2d;margin-bottom:8px;font-size:17px}
.contact{background:#f6f3ee;border:1px solid rgba(14,78,45,.14);border-radius:28px;padding:28px;margin-top:56px}
.contact-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:24px;margin-top:18px}
form{background:white;border:1px solid rgba(14,78,45,.12);border-radius:22px;padding:22px}
label{display:block;color:#0e4e2d;font-weight:900;font-size:14px;margin-bottom:6px}
button{font-family:inherit}
input,select,textarea{width:100%;padding:12px;border:1px solid #d8ded8;border-radius:12px;margin-bottom:13px;font-family:inherit;font-size:15px}
textarea{min-height:135px;max-height:135px;resize:none}
.field-hint{display:block;margin-top:-7px;margin-bottom:13px;color:#6d776f;font-size:12.5px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.btn{border:0;background:#0e4e2d;color:white;border-radius:999px;padding:14px 18px;font-weight:900;cursor:pointer;width:100%;transition:.25s ease}
.btn:hover{background:#08391f;transform:translateY(-2px)}
.side-contact{display:grid;gap:14px}
.contact-card{background:white;border:1px solid rgba(14,78,45,.13);border-radius:18px;padding:18px;text-decoration:none;color:#1f2933;transition:.25s ease}
.contact-card:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(14,78,45,.10)}
.contact-card strong{display:block;color:#0e4e2d;margin-bottom:5px}
.contact-card span{color:#56645d;font-size:15px}
.qr-box{background:white;border:1px solid rgba(14,78,45,.12);border-radius:18px;padding:18px;text-align:center}
.qr-box img{width:132px;height:132px;object-fit:cover;border-radius:14px;margin-bottom:10px}
.footer{margin-top:60px;background:#0e4e2d;color:white;border-radius:30px 30px 0 0;padding:30px 30px 18px}
.footer-main{display:grid;grid-template-columns:1.1fr .9fr .9fr .9fr;gap:24px;margin-bottom:24px}
.footer h3{color:white;font-size:17px;margin-bottom:8px}
.footer p,.footer li{color:#e7efe8;font-size:14px}
.footer ul{list-style:none}
.footer a{color:#fefefd;text-decoration:none}
.footer a:hover{text-decoration:underline}
.top-link{display:inline-block;border:1px solid rgba(255,255,255,.35);padding:10px 14px;border-radius:999px;font-weight:900;margin-top:8px;background:transparent;color:#fefefd;font-family:inherit}
.top-link:hover{background:rgba(255,255,255,.12)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.18);padding-top:16px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:#e7efe8}
.footer-bottom a{margin-left:14px}
.credit-link{margin-left:0!important;text-decoration:underline}
.error-message{display:none; color:#b42318; font-size:12.5px; margin-top:-8px; margin-bottom:12px; font-weight:700}
.form-field.invalid input, .form-field.invalid select, .form-field.invalid textarea{border-color:#b42318; background:#fff7f6}
.form-field.invalid .error-message{display:block}
.form-popup{position:fixed; inset:0; z-index:9999; display:none; align-items:center; justify-content:center; padding:20px; background:rgba(14,78,45,.34); backdrop-filter:blur(6px)}
.form-popup.show{display:flex}
.form-popup-box{width:100%; max-width:430px; background:#fefefd; border-radius:26px; padding:28px; box-shadow:0 24px 70px rgba(0,0,0,.24); border:1px solid rgba(14,78,45,.14); text-align:center}
.form-popup-icon{width:58px; height:58px; border-radius:50%; background:#0e4e2d; color:white; display:flex; align-items:center; justify-content:center; font-size:30px; margin:0 auto 14px; font-weight:900}
.form-popup-box h3{color:#0e4e2d; font-size:24px; margin-bottom:8px}
.form-popup-box p{color:#3d4a43; margin-bottom:18px}
.popup-btn{border:0; background:#0e4e2d; color:white; border-radius:999px; padding:12px 22px; font-weight:900; cursor:pointer}
.popup-btn:hover{background:#08391f}
#winterdienst{grid-template-columns:1fr}
.service-duo{display:grid;grid-template-columns:1fr 1fr;gap:3px;background:rgba(14,78,45,.14)}
.service-duo figure{position:relative;margin:0;line-height:0}
.service-duo img{width:100%;height:235px;object-fit:cover;display:block}
.service-duo figcaption{position:absolute;left:12px;bottom:12px; background:rgba(14,78,45,.88);color:#fefefd; font-size:12.5px;font-weight:900;line-height:1; padding:7px 11px;border-radius:999px;letter-spacing:.3px}

@media(max-width:900px){
  .service-duo{grid-template-columns:1fr}
  .service-duo img{height:190px}
}
.service-visual{min-height:245px; background: linear-gradient(rgba(14,78,45,.04),rgba(14,78,45,.04)), var(--img,none), linear-gradient(135deg,#fefefd 0%,#eef4ec 50%,#dfe9dc 100%); background-size:cover; background-position:center}
.service.reverse .service-visual{order:2}
.season-banner{display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; background:#f6f3ee; border:1px solid rgba(14,78,45,.14); border-radius:26px; padding:22px 26px; margin-bottom:36px}
.season-banner-text{max-width:640px}
.season-banner-text strong{display:block;color:#0e4e2d;font-size:19px;margin-bottom:4px}
.season-banner-text span{color:#3d4a43;font-size:15.5px}
.season-banner-btn{border:0; background:#0e4e2d; color:white; border-radius:999px; padding:13px 20px; font-weight:900; font-family:inherit; font-size:15px; white-space:nowrap; transition:.25s ease}
.season-banner-btn:hover{background:#08391f;transform:translateY(-2px)}
/* Auf den Unterseiten ist der Knopf ein Verweis zum Formular. */
a.season-banner-btn{display:inline-block;text-align:center;text-decoration:none;cursor:pointer}
.season-popup{position:fixed; inset:0; z-index:9000; display:none; align-items:center; justify-content:center; padding:20px; overflow-y:auto; background:rgba(14,78,45,.34); backdrop-filter:blur(6px)}
.season-popup.show{display:flex}
.season-box{width:100%; max-width:520px; margin:auto; position:relative; max-height:calc(100vh - 40px); overflow:hidden auto; background:#fefefd; border-radius:26px; padding:26px; box-shadow:0 24px 70px rgba(0,0,0,.24); border:1px solid rgba(14,78,45,.14)}
.season-visual{margin:-26px -26px 18px; line-height:0}
.season-visual svg,.season-visual img{display:block; width:100%; height:170px; object-fit:cover; object-position:center 68%}
.season-close{position:absolute; top:14px; right:14px; width:34px; height:34px; display:flex; align-items:center; justify-content:center; border:0; border-radius:50%; background:rgba(254,254,253,.92); color:#0e4e2d; font-size:22px; line-height:1; font-family:inherit; padding:0; box-shadow:0 3px 10px rgba(14,78,45,.22); transition:.2s ease}
.season-close:hover{background:#ffffff;transform:scale(1.06)}
.season-box h3{color:#0e4e2d;font-size:24px;margin-bottom:8px}
.season-box p{color:#3d4a43;font-size:15px;margin-bottom:12px}
.season-note{background:#eef4ec; border:1px solid rgba(14,78,45,.14); border-radius:16px; padding:12px 14px; color:#0e4e2d; font-size:14.5px; font-weight:700; margin-bottom:16px}
.season-box form{background:transparent; border:0; border-radius:0; padding:0}
.season-actions{position:sticky; bottom:-26px; display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:0 -26px -26px; padding:14px 26px 26px; background:linear-gradient(rgba(254,254,253,0),#fefefd 22%)}
.season-actions .submit-btn{width:auto;flex:1 1 200px}
.season-later{border:1px solid rgba(14,78,45,.18); background:transparent; color:#0e4e2d; border-radius:999px; padding:14px 18px; font-weight:900; font-family:inherit; transition:.25s ease}
.season-later:hover{background:#eef4ec}

@media(max-width:900px){
  .season-banner{padding:20px}
  .season-banner-btn{width:100%}
  .season-box{padding:22px}
  .season-visual{margin:-22px -22px 14px}
  .season-visual svg,.season-visual img{height:126px}
  .season-actions{bottom:-22px;margin:0 -22px -22px;padding:12px 22px 22px}
  .season-actions .submit-btn,.season-later{width:100%;flex:1 1 100%}
  .season-box .row{grid-template-columns:1fr 1fr}
  .season-visual svg,.season-visual img{height:112px}
}

@media(max-height:700px){
  .season-visual svg,.season-visual img{height:88px}
  .season-hint{display:none}
  .season-box h3{font-size:21px}
  .season-note{padding:10px 12px;font-size:14px;margin-bottom:12px}
}
.checkline{display:flex; align-items:flex-start; gap:10px; color:#3d4a43; font-weight:500; font-size:13.5px; line-height:1.45; margin:2px 0 16px}
.checkline input{width:auto; margin-top:3px; cursor:pointer}
.checkline a{color:#0e4e2d; font-weight:900}
.dropdown.force-close .dropdown-content{display:none!important}
.qr-link{display:block;text-decoration:none;color:#1f2933}
.qr-link:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(14,78,45,.10)}

@media(max-width:900px){
  .header-inner{display:block}
  .nav{margin-top:14px}
  .dropdown-content{position:static;box-shadow:none;margin-top:6px}
  .hero{min-height:auto;margin-top:-26px;background-position:center right}
  .hero::before{background:linear-gradient(to bottom,rgba(254,254,253,.98) 0%,rgba(254,254,253,.94) 52%,rgba(254,254,253,.76) 100%)}
  .hero-content{min-height:auto;padding:42px 24px}
  .hero-content h1,.hero-content .lead,.hero-actions{max-width:100%}
  .about-layout,.area-section,.contact-layout,.footer-main,.row{grid-template-columns:1fr}
  .about-cards{grid-template-columns:1fr}
  .service,.service.reverse{grid-template-columns:1fr}
  .service.reverse img{order:0}
  .service.reverse .service-visual{order:0}
  .service img,.service-visual{min-height:220px}
  h1{font-size:33px}
  h2{font-size:27px}
  .brand img{width:58px;height:58px}
}
.mobile-menu-toggle{display:none; border:1px solid rgba(14,78,45,.18); background:#0e4e2d; color:#fefefd; border-radius:999px; padding:10px 14px; font-family:inherit; font-weight:900; line-height:1}

@media(max-width:900px){
  .header{position:sticky; top:0; background:rgba(254,254,253,.90); backdrop-filter:blur(10px); box-shadow:0 8px 18px rgba(14,78,45,.08)}
  .header-inner{display:flex!important; align-items:center; justify-content:space-between; gap:10px; padding:8px 14px}
  .brand{font-size:17px; gap:9px}
  .brand img{width:44px!important; height:44px!important}
  .mobile-menu-toggle{display:inline-flex; align-items:center; justify-content:center}
  .nav{display:none; width:100%; flex-direction:column; align-items:stretch; gap:6px; margin-top:8px!important; padding:8px; max-height:68vh; overflow:auto; background:rgba(254,254,253,.98); border:1px solid rgba(14,78,45,.13); border-radius:18px; box-shadow:0 12px 28px rgba(14,78,45,.12)}
  .nav.open{display:flex}
  .nav a, .dropbtn{width:100%; height:auto; min-height:40px; justify-content:flex-start; padding:10px 12px; border-radius:14px}
  .dropdown{width:100%}
  .dropdown-content{display:none; position:static; top:auto; left:auto; width:100%; min-width:0; padding:6px; margin-top:4px; border:0; border-radius:14px; box-shadow:none; background:#eef4ec}
  .dropdown:hover .dropdown-content{display:none}
  .dropdown.open .dropdown-content{display:block}
  body{overflow-x:hidden}
  .header-inner{flex-wrap:wrap!important}
  .brand{flex:1 1 auto; min-width:0}
  .brand span{white-space:normal; line-height:1.15}
  .mobile-menu-toggle{flex:0 0 auto}
  .nav{flex:0 0 100%!important; width:100%!important; max-width:100%!important; margin-left:0!important; margin-right:0!important}
  .nav.open{display:flex!important}
  .dropdown-content{max-width:100%!important}
}
.intro-box{background:#f6f3ee;border:1px solid rgba(14,78,45,.14);border-radius:26px;padding:26px;margin-top:18px}
.intro-box p{color:#3d4a43;margin-bottom:12px}
.service.reverse .service-media{order:2}
.service-media{min-height:245px; background: linear-gradient(rgba(14,78,45,.13),rgba(14,78,45,.13)), var(--img), linear-gradient(135deg,#eef4ec 0%,#dfe9dc 100%); background-size:cover;background-position:center}
.target-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.target-card{background:#f6f3ee;border:1px solid rgba(14,78,45,.14);border-radius:22px;padding:20px;transition:.25s ease}
.target-card:hover{background:#eef4ec;transform:translateY(-3px)}
.target-card h3{font-size:18px;margin-bottom:8px}
.target-card p{color:#3d4a43;font-size:14.5px}
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.process-card{background:white;border:1px solid rgba(14,78,45,.14);border-radius:22px;padding:22px;box-shadow:0 8px 22px rgba(14,78,45,.06)}
.process-card span{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;background:#0e4e2d;color:white;border-radius:50%;font-weight:900;margin-bottom:12px}
.process-card h3{font-size:18px;margin-bottom:8px}
.process-card p{color:#3d4a43;font-size:14.5px}

@media(max-width:1050px){
  .target-grid{grid-template-columns:1fr 1fr}
  .process{grid-template-columns:1fr 1fr}
}

@media(max-width:900px){
  .area-section,.contact-layout,.footer-main,.row{grid-template-columns:1fr}
  .target-grid,.process{grid-template-columns:1fr}
  .service.reverse .service-media{order:0}
  .service-media{min-height:220px}
}

/* Unterseiten: Brotkrume und schlanker Seitenkopf ohne grosses Bild */
.nav .nav-zurueck{background:#eef4ec;border:1px solid rgba(14,78,45,.18)}
.nav .nav-zurueck:hover{background:#dfe9dc}

.brotkrume{font-size:13.5px;color:#56645d;margin:6px 0 22px;display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.brotkrume a{color:#0e4e2d;font-weight:800;text-decoration:none}
.brotkrume a:hover{text-decoration:underline}
.brotkrume span{color:#9aa79f}
.brotkrume strong{color:#3d4a43;font-weight:800}

.seiten-kopf{
  background:linear-gradient(135deg,#f6f3ee 0%,#eef4ec 55%,#dfe9dc 100%);
  border:1px solid rgba(14,78,45,.14);
  border-radius:28px;
  padding:30px;
  margin-bottom:26px;
  display:grid;grid-template-columns:1.15fr 1fr;gap:26px;align-items:center
}
.seiten-kopf-bild{margin:0;line-height:0}
.seiten-kopf-bild img{
  width:100%;height:100%;min-height:230px;max-height:280px;object-fit:cover;
  object-position:center 65%;display:block;border-radius:20px
}
.seiten-kopf h1{font-size:33px;margin-bottom:12px}
.seiten-kopf .lead{margin-bottom:0}
.seiten-kopf .hero-actions{margin-top:20px}

@media(max-width:900px){
  .seiten-kopf{padding:22px;grid-template-columns:1fr;gap:18px}
  .seiten-kopf-bild{order:-1}
  .seiten-kopf-bild img{min-height:0;height:170px}
  .seiten-kopf h1{font-size:26px}
}

/* Leistung ohne eigenes Foto laeuft ueber die volle Breite */
.service.breit{grid-template-columns:1fr}

/* Uebersichtsseiten: der Kernbereich laeuft als breite Karte oben, die drei
   uebrigen stehen kleiner darunter. Groesse und Platz zeigen den Schwerpunkt -
   er muss nirgends ausgeschrieben werden. Details gehoeren auf die Unterseite. */
.bereich-gitter{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.bereich-karte{
  display:flex;flex-direction:column;
  background:white;border:1px solid rgba(14,78,45,.14);border-radius:20px;
  padding:20px;text-decoration:none;color:#1f2933;
  box-shadow:0 6px 16px rgba(14,78,45,.06);transition:.25s ease
}
.bereich-karte:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(14,78,45,.11)}
.bereich-karte h3{font-size:20px;margin-bottom:6px}
.bereich-karte p{color:#3d4a43;font-size:15.5px;margin-bottom:12px}

/* Stichworte als ruhige Zeile statt als Kachelreihe - die Uebersicht soll
   Ordnung zeigen, nicht schon alles aufzaehlen. */
.bereich-stich{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;
  gap:0 6px;font-size:14px;color:#56645d;font-weight:700}
.bereich-stich li+li::before{content:"· ";color:#9aa79f}

/* Der Kernbereich laeuft als breite Karte oben, die drei uebrigen stehen
   kleiner darunter. Groesse und Platz zeigen den Schwerpunkt - er muss
   nirgends ausgeschrieben werden. Details gehoeren auf die Unterseite. */
.bereich-karte.kern{
  grid-column:1 / -1;padding:20px;
  background:linear-gradient(135deg,#f6f3ee 0%,#eef4ec 100%);border-color:rgba(14,78,45,.24)
}
.bereich-karte.kern h3{font-size:20px;margin-bottom:8px}
.bereich-karte.kern p{max-width:64ch;margin-bottom:14px}
.bereich-karte.kern .bereich-stich{font-size:14.5px;margin-bottom:12px}
/* Jede Karte fuehrt weiter - das muss man ihr ansehen. */
.bereich-mehr{
  margin-top:auto;padding-top:14px;
  display:inline-flex;align-items:center;gap:6px;
  color:#0e4e2d;font-weight:900;font-size:14.5px
}
.bereich-mehr::after{content:"›";font-size:18px;line-height:1}
.bereich-karte:hover .bereich-mehr{text-decoration:underline}

@media(max-width:1024px){
  .bereich-gitter{grid-template-columns:1fr 1fr}
}

@media(max-width:900px){
  .bereich-gitter{grid-template-columns:1fr}
  .bereich-karte.kern{padding:22px}
  .bereich-karte.kern h3{font-size:20px}
}

/* ---- Leistungsseiten -------------------------------------------------
   Auf einer eigenen Seite darf der Text offen dastehen. Statt der schmalen
   Kachel mit Aufklapper steht hier ein breiter Block: Bildstreifen oben,
   darunter Fliesstext und die Liste, was dazugehoert. */
details.lblock{
  background:white;border:1px solid rgba(14,78,45,.14);border-radius:24px;
  overflow:hidden;margin:0 0 14px;padding:0;border-top-width:1px;
  box-shadow:0 8px 22px rgba(14,78,45,.07)
}
/* Die Zeile zum Aufklappen ist die Ueberschrift der Leistung - kein
   kleiner Knopf, sondern die ganze Breite. */
.lblock > summary{
  display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;
  width:auto;background:transparent;border:0;border-radius:24px;
  padding:20px 26px;cursor:pointer;list-style:none
}
.lblock > summary:hover{background:#f6f3ee}
.lblock[open] > summary{padding-bottom:8px}
.lblock[open] > summary:hover{background:transparent}
.lblock > summary::after{
  content:"▾";margin-left:auto;font-size:15px;color:#0e4e2d;
  transition:transform .2s ease
}
.lblock[open] > summary::after{content:"▾";transform:rotate(180deg)}
.lblock-titel{font-size:22px;font-weight:700;color:#0e4e2d;line-height:1.25;margin:0}
.lblock-text{padding:0 26px 24px}
.lblock-text p{color:#3d4a43;font-size:16.5px;line-height:1.72;margin-bottom:12px}
.lblock-text p:last-of-type{margin-bottom:0}

.lblock-punkte{
  margin-top:20px;padding-top:18px;border-top:1px solid rgba(14,78,45,.12)
}
.lblock-punkte strong{
  display:block;font-size:13px;letter-spacing:.4px;text-transform:uppercase;
  color:#0e4e2d;margin-bottom:10px
}
.lblock-punkte ul{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:1fr 1fr;gap:7px 22px
}
.lblock-punkte li{position:relative;padding-left:20px;color:#3d4a43;font-size:15.5px}
.lblock-punkte li::before{
  content:"";position:absolute;left:0;top:8px;
  width:8px;height:8px;border-radius:50%;background:#0e4e2d;opacity:.55
}

/* Zurueck zur Uebersicht - oben unter der Brotkrume und am Seitenende. */
.zurueck{
  display:inline-flex;align-items:center;gap:8px;
  background:white;border:1px solid rgba(14,78,45,.2);border-radius:999px;
  padding:10px 18px;margin-bottom:18px;
  color:#0e4e2d;font-weight:900;font-size:15px;text-decoration:none;
  transition:.2s ease
}
.zurueck::before{content:"←";font-size:17px}
.zurueck:hover{background:#eef4ec;border-color:rgba(14,78,45,.35)}
.zurueck-fuss{margin:26px 0 10px;text-align:center}
.zurueck-fuss .zurueck{margin-bottom:0}

@media(max-width:900px){
  .lblock > summary{padding:17px 20px}
  .lblock-titel{font-size:20px}
  .lblock-text{padding:0 20px 20px}
  .lblock-punkte ul{grid-template-columns:1fr}
  .zurueck{width:100%;justify-content:center}
}

/* Jahresleiste auf den Aussen-Seiten: was faellt wann an. */
.jahr-leiste{
  background:white;border:1px solid rgba(14,78,45,.14);border-radius:20px;
  padding:18px 22px;margin:0 0 22px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px 22px;align-items:start
}
.jahr-titel{
  grid-column:1 / -1;margin:0;font-size:13px;letter-spacing:.4px;
  text-transform:uppercase;color:#0e4e2d;font-weight:900
}
.jahr-hinweis{grid-column:1 / -1;margin:-6px 0 2px;font-size:13.5px;color:#56645d}
.jahr-feld{display:flex;flex-direction:column;gap:3px;
  border-left:3px solid rgba(14,78,45,.22);padding-left:12px}
.jahr-feld strong{font-size:15px;color:#0e4e2d}
.jahr-feld span{font-size:14.5px;color:#56645d}

/* Zeitraum direkt neben der Ueberschrift der Leistung */
.lblock-saison{
  display:inline-block;
  background:#eef4ec;color:#0e4e2d;border:1px solid rgba(14,78,45,.15);
  border-radius:999px;padding:5px 13px;font-size:13.5px;font-weight:800
}

@media(max-width:900px){
  .jahr-leiste{grid-template-columns:1fr;padding:16px 18px}
}

/* Bewerbung: die Adresse steht lesbar da, damit sie auch abtippen kann,
   bei wem sich kein E-Mail-Programm oeffnet. */
.bewerbung-box{
  background:linear-gradient(135deg,#f6f3ee 0%,#eef4ec 100%);
  border:1px solid rgba(14,78,45,.2);border-radius:24px;
  padding:26px 28px;margin-top:20px;text-align:center
}
.bewerbung-hinweis{
  display:block;font-size:13px;letter-spacing:.4px;text-transform:uppercase;
  color:#0e4e2d;font-weight:900;margin-bottom:8px
}
.bewerbung-adresse{
  display:block;font-size:17px;font-weight:800;color:#0e4e2d;
  word-break:break-all;margin-bottom:16px
}
.bewerbung-box .hero-actions{justify-content:center}
.bewerbung-fussnote{margin-top:16px;font-size:14px;color:#56645d}

@media(max-width:900px){
  .bewerbung-box{padding:22px 18px}
  .bewerbung-adresse{font-size:16px}
  .bewerbung-box .hero-actions .primary-link{width:100%;text-align:center}
}

/* FAQ: Gruppenbeschriftung im vorhandenen Kicker-Stil, damit die Liste
   bei vielen Fragen lesbar bleibt. Keine neue Komponente. */
.faq-gruppe{margin:26px 0 10px}
.faq-gruppe:first-of-type{margin-top:18px}