/* 30.10.2026 Startseite ab 1024 px.
   Wege: Sandbühne, Foto 16:10, Text auf dem Sand.
   Projekte: gerahmtes Foto, 75svh, Creme links und rechts, Karte 96 % innen. */
@media (min-width:1024px){
  html body main section#wege{
    background:#EADFCC!important;
    padding-top:40px!important;
    padding-bottom:72px!important;
  }
  html body #wege .tafeln{
    height:auto!important;min-height:0!important;max-height:none!important;
    margin-top:28px!important;align-items:stretch!important;
  }
  html body #wege .weg-tafel{
    display:flex!important;flex-direction:column!important;height:auto!important;min-height:0!important;
    background:transparent!important;color:#122E4D!important;border-radius:0!important;overflow:visible!important;
    box-shadow:none!important;
  }
  html body #wege .tafel-verlauf,
  html body #wege .tafel-verlauf::after{display:none!important;background:none!important}
  html body #wege .weg-tafel .tafel-bild{
    position:relative!important;inset:auto!important;flex:none!important;min-height:0!important;
    width:100%!important;height:auto!important;aspect-ratio:16/10!important;overflow:hidden!important;border-radius:8px!important;
  }
  html body #wege .weg-tafel .tafel-bild picture,
  html body #wege .weg-tafel .tafel-bild img{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;
  }
  html body #wege .tafel-bild img.bild-service{object-position:50% 8%!important}
  html body #wege .tafel-inhalt{
    position:static!important;left:auto!important;right:auto!important;bottom:auto!important;
    display:flex!important;flex:0 0 auto!important;flex-direction:column;box-sizing:border-box;
    min-height:156px!important;height:auto!important;
    padding:16px 2px 0!important;
    background:transparent!important;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    border-radius:0!important;
  }
  html body #wege .tafel-inhalt .t3{color:#122E4D!important;text-shadow:none!important;white-space:normal!important}
  html body #wege .tafel-satz{
    position:static!important;opacity:1!important;width:auto!important;max-width:none!important;
    margin:6px 0 0!important;color:#2B3642!important;font-size:15px!important;line-height:1.4!important;text-shadow:none!important;
  }
  html body #wege .tafel-link{color:#A3421D!important;margin-top:auto!important;padding-top:10px!important;border-bottom-color:transparent!important}
  html body #wege .weg-tafel:is(:hover,:focus-visible) .tafel-link{border-bottom-color:#A3421D!important}

  html body #projekte{background:#F6F1E8!important}
  html body #projekte .folge-panel{
    height:calc(100svh - var(--menue-h, 64px))!important;min-height:0!important;
    background:#F6F1E8!important;
  }
  html body #projekte .folge-panel .folge-bild{
    position:absolute!important;inset:auto!important;
    top:calc((100% - 75svh) / 2)!important;bottom:auto!important;
    height:75svh!important;
    left:max(var(--rand,64px),calc((100% - 1280px) / 2 + var(--rand,64px)))!important;
    right:max(var(--rand,64px),calc((100% - 1280px) / 2 + var(--rand,64px)))!important;
    width:auto!important;
    border-radius:16px!important;overflow:hidden!important;
  }
  html body #projekte .folge-panel .folge-bild picture,
  html body #projekte .folge-panel .folge-bild img{
    position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
    object-fit:cover!important;
  }
  html body #projekte .folge-verlauf,
  html body #projekte .folge-inhalt::before{display:none!important;background:none!important}
  html body #projekte .folge-inhalt{
    position:absolute!important;z-index:2;
    left:calc(max(var(--rand,64px),calc((100% - 1280px) / 2 + var(--rand,64px))) + 28px)!important;
    right:auto!important;top:auto!important;
    bottom:calc((100% - 75svh) / 2 + 28px)!important;
    height:auto!important;width:min(460px,calc(100% - 64px))!important;max-width:460px!important;
    margin:0!important;padding:18px 22px 16px!important;
    background:rgba(246,241,232,.96)!important;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    border-radius:8px;
    justify-content:flex-start!important;
  }
  html body #projekte .folge-nr,
  html body #projekte .folge-kz,
  html body #projekte .folge-text{display:none!important}
  html body #projekte .folge-fortschritt{display:flex!important;margin:0 0 8px!important}
  html body #projekte .folge-fortschritt span{background:rgba(18,46,77,.28)!important}
  html body #projekte .folge-fortschritt span.an{background:#A3421D!important}
  html body #projekte .folge-ort{color:#122E4D!important;font-size:40px!important;line-height:1.05!important;margin:0!important;text-shadow:none!important}
  html body #projekte .folge-meta{display:block!important;color:#2B3642!important;text-shadow:none!important;opacity:1!important;margin-top:6px!important}
  html body #projekte .folge-inhalt .tl{color:#A3421D!important;margin-top:12px!important;text-shadow:none!important}
}
/* Zahlen direkt auf dem Sand, ohne Karte. Der Sand geht vom Hero bis «Was hast du vor?». */
html body #zahlenband.zahlenband{
  position:relative!important;z-index:5!important;
  background:#EADFCC!important;color:#122E4D!important;border:0!important;
  margin-top:0!important;padding:52px 0 8px!important;
}
html body #zahlenband .zb-liste{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:stretch!important;gap:0!important;
  width:100%!important;box-sizing:border-box!important;
  margin-top:0!important;padding:0 0 20px!important;
  background:transparent!important;border-radius:0!important;
  box-shadow:none!important;
}
html body #zahlenband .zb-liste li{
  display:flex!important;flex-direction:column!important;align-items:center!important;
  text-align:center!important;gap:0!important;min-width:0!important;
  margin:0!important;padding:6px 28px!important;
  border:0!important;border-left:1px solid rgba(18,46,77,.12)!important;
  background:transparent!important;box-shadow:none!important;border-radius:0!important;
}
html body #zahlenband .zb-liste li:first-child{border-left:0!important}
html body #zahlenband .zb-kicker{
  display:block!important;min-height:2.8em!important;max-width:28ch!important;
  color:#A3421D!important;font-family:"Satoshi",sans-serif!important;font-weight:600!important;
  font-size:15px!important;line-height:1.35!important;letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
html body #zahlenband .zb-zahl{
  display:block!important;margin-top:8px!important;
  color:#122E4D!important;font-family:"Satoshi",sans-serif!important;font-weight:500!important;
  font-size:44px!important;line-height:1!important;letter-spacing:-.04em!important;white-space:nowrap!important;
}
html body #zahlenband .zb-text{
  display:block!important;margin-top:8px!important;
  color:#55606E!important;opacity:1!important;font-size:15px!important;line-height:1.35!important;
  letter-spacing:0!important;white-space:normal!important;text-align:center!important;
}
@media (min-width:1024px){
  html body:has(#leiste) #kopf.hero .hero-inhalt{
    top:auto!important;bottom:172px!important;right:auto!important;
    left:max(var(--rand,64px),calc((100% - 1280px) / 2 + var(--rand,64px)))!important;
    background:rgba(246,241,232,.38)!important;
    -webkit-backdrop-filter:blur(3px)!important;backdrop-filter:blur(3px)!important;
  }
  html body #kopf.hero .hero-inhalt::before{content:none!important;display:none!important}
}
/* «Wörtlich übernommen» ist eine Fussnote. Der Abstand danach ist derselbe wie zwischen den anderen Abschnitten. */
html body #google-stimmen .gs-fuss{margin-bottom:0!important}
@media (min-width:768px) and (max-width:1023px){
  html body main section#wege{padding-top:48px!important}
}
@media (min-width:1024px){
  html body main section#wege{
    background:#EADFCC!important;
    padding-top:40px!important;
    padding-bottom:72px!important;
  }
}
@media (min-width:768px){
  html body main section#ueber-uns,
  html body main section#google-stimmen,
  html body main section#projekte,
  html body main section#fragen-start{padding-top:72px!important}
  html body main section#google-stimmen{padding-bottom:0!important}
  html body main section#fragen-start{padding-bottom:72px!important}
}
@media (max-width:767px){
  html body main section#google-stimmen{padding-bottom:0!important}
  html body main section#fragen-start{padding-bottom:40px!important}
}
@media (max-width:767px){
  html body #zahlenband.zahlenband{margin-top:0!important;padding:32px 0 4px!important}
  html body #zahlenband .zb-liste{grid-template-columns:1fr!important;padding:0 0 12px!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
  html body #zahlenband .zb-liste li{
    align-items:flex-start!important;text-align:left!important;
    padding:16px 20px!important;border-left:0!important;border-top:1px solid rgba(18,46,77,.12)!important;
  }
  html body #zahlenband .zb-liste li:first-child{border-top:0!important}
  html body #zahlenband .zb-kicker{min-height:0!important;text-align:left!important}
  html body #zahlenband .zb-zahl{font-size:34px!important}
  html body #zahlenband .zb-text{text-align:left!important}
}
/* Über uns und Google-Stimmen, ein Abschnitt. Sechs Kacheln, Fotos 4:3. */
html body #ueber-uns .tb-text .t1{margin-top:16px;margin-bottom:24px;font-size:44px;line-height:1.05}
html body #ueber-uns .tb-text .t1 .akzent{color:#A3421D}
@media (max-width:767px){html body #ueber-uns .tb-text .t1{font-size:32px}}
html body #ueber-uns .tb-reihe{align-items:start!important}
html body #ueber-uns .team-mosaik{
  display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%;
}
html body #ueber-uns .tm-karte{
  position:relative;margin:0;border-radius:12px;overflow:hidden;
  aspect-ratio:4/3;background:#122E4D;
}
html body #ueber-uns .tm-karte picture{display:block;width:100%;height:100%}
html body #ueber-uns .tm-karte img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
html body #ueber-uns .tm-karte figcaption{
  position:absolute;left:8px;right:8px;bottom:8px;margin:0;
  padding:7px 8px;background:rgba(246,241,232,.96);border-radius:8px;
  display:flex;flex-direction:column;gap:1px;
}
html body #ueber-uns .tm-karte figcaption strong{
  font-family:"Satoshi",sans-serif;font-size:14px;font-weight:700;line-height:1.15;color:#122E4D;
}
html body #ueber-uns .tm-karte figcaption span{
  font-size:13px;line-height:1.3;color:#55606E;font-weight:500;
}
html body #ueber-uns .tm-karte figcaption span.tm-trenner{
  color:#A3421D;font-weight:700;padding:0 .32em;
}
html body #ueber-uns .team-versprechen{
  list-style:none;padding:0;margin:22px 0 8px;display:grid;gap:10px;
}
html body #ueber-uns .team-versprechen li{
  display:flex;align-items:center;gap:10px;
  font-family:"Satoshi",sans-serif;font-weight:600;font-size:16px;line-height:1.3;color:#122E4D;
}
html body #ueber-uns .team-versprechen li::before{
  content:"✓";display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;border-radius:50%;background:rgba(163,66,29,.12);
  color:#A3421D;font-size:13px;font-weight:700;flex:0 0 22px;
}
html body #ueber-uns #google-stimmen{
  margin-top:56px;padding:40px 0 0!important;
  background:transparent!important;border-top:1px solid rgba(18,46,77,.12);
}
html body #ueber-uns #google-stimmen .gs-fuss{margin-bottom:0!important}
@media (min-width:1024px){
  html body #ueber-uns .tb-reihe{align-items:stretch!important;grid-template-columns:minmax(320px,.7fr) minmax(0,1.3fr)!important;gap:40px!important}
  html body #ueber-uns .team-mosaik{height:100%;grid-template-columns:repeat(3,1fr);grid-template-rows:1fr 1fr;gap:14px;align-items:stretch}
  html body #ueber-uns .tm-karte{aspect-ratio:auto;height:100%;min-height:0}
  html body #ueber-uns .tm-karte figcaption span{white-space:nowrap}
}
@media (max-width:1023px){
  html body #ueber-uns .tb-text{display:block!important}
  html body #ueber-uns .tb-text>*{order:0!important}
  html body #ueber-uns .tb-bild{order:2!important;margin:20px 0 8px!important}
  html body #ueber-uns .tm-karte figcaption span{display:none}
  html body #ueber-uns #google-stimmen{margin-top:36px;padding-top:28px!important;padding-bottom:0!important}
}
/* Filmanfang ohne Ruck: kein Zoom auf dem Standbild, kein Abdunkeln vor dem Film. */
@media (min-width:1280px){
  html body #kopf.hero .hero-bild img,
  html body #kopf.hero.geladen .hero-bild img{transform:none!important;transition:none!important;object-position:50% 55%!important}
  html body #kopf.hero .hero-bild video.hero-video,
  html body #kopf.hero .hero-bild video.hero-video.an{object-position:50% 55%!important;transition:opacity 240ms linear!important;transition-delay:0s!important;background:transparent!important}
  html body #kopf.hero.hero-naht .hero-bild video.hero-video,
  html body #kopf.hero.hero-naht .hero-bild video.hero-video.an{transition:opacity 900ms ease!important;transition-delay:0s!important}
  html body #kopf.hero.video-zeigt .hero-bild picture.hero-slide-1.on{opacity:1!important;transition:none!important}
}
@media (min-width:900px){
  html body #fragen-start .wrap{
    display:grid!important;
    grid-template-columns:minmax(240px,4fr) minmax(0,8fr)!important;
    column-gap:64px!important;
    align-items:start!important;
  }
  html body #fragen-start .faq-liste{margin-top:0!important;max-width:none!important}
  html body #fragen-start .faq-kopf h2.t2{margin-top:12px!important}
  html body #fragen-start .start-schluss{margin-top:28px!important}
}
@media (max-width:899px){
  html body #fragen-start .faq-kopf{display:contents}
  html body #fragen-start .wrap{display:flex!important;flex-direction:column!important}
  html body #fragen-start .label{order:1}
  html body #fragen-start h2.t2{order:2}
  html body #fragen-start .faq-liste{order:3}
  html body #fragen-start .start-schluss{order:4}
}
html body #fragen-start .faq-e summary{padding:20px 0!important;font-size:18px!important}