/*
Theme Name: MeinDienst24 Breit
Theme URI: https://meindienst24.de/
Description: Child-Theme für MeinDienst24 auf Basis von Twenty Twenty-Five. Breite Seiten-Templates, grüner MD24-Headerbereich, editierbare Gutenberg-Seiten und globale Breitenkorrekturen.
Author: Hermes für Daniel Kessler
Template: twentytwentyfive
Version: 0.2.2
Text Domain: md24-breit
*/

:root{
  --md24-brand: rgba(65,189,61,.89);
  --md24-brand-solid: #41bd3d;
  --md24-brand-dark: #2f9f35;
  --md24-ink: #111214;
  --md24-muted: #334139;
  --md24-line: #dbe8dd;
  --md24-soft: #f2fbf2;
  --md24-shell: min(1260px, calc(100vw - 38px));
  --md24-wide: min(1460px, calc(100vw - 38px));
}

body{
  color: var(--md24-ink);
}

/* MD24 system rule: WordPress template titles are hidden; each page controls its own calm H1 in the content/hero. */
body.wp-child-theme-md24-breit .wp-block-post-title{
  display:none !important;
}

/* Global width fix for normal Gutenberg pages. */
.wp-site-blocks main,
.wp-site-blocks .wp-block-post-content{
  width: 100%;
}

.wp-block-post-content > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.entry-content > :where(:not(.alignleft):not(.alignright):not(.alignfull)){
  max-width: var(--md24-shell) !important;
}

.wp-block-post-content > .alignwide,
.entry-content > .alignwide{
  max-width: var(--md24-wide) !important;
}

.wp-block-post-content > .alignfull,
.entry-content > .alignfull{
  max-width: 100vw !important;
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* Optional template class for pages that should feel like the MD24 hubs. */
.md24-page-canvas{
  width: 100%;
  color: var(--md24-ink);
}

.md24-shell{
  width: var(--md24-shell);
  margin-inline: auto;
}

.md24-wide-shell{
  width: var(--md24-wide);
  margin-inline: auto;
}

.md24-top-strip{
  background: var(--md24-brand);
  background-image: linear-gradient(90deg, rgba(65,189,61,.96) 0%, #2f9f35 100%);
  color: #071a0b;
  border-bottom: 1px solid rgba(7,26,11,.13);
  font-size: 13px;
  font-weight: 820;
}

.md24-top-strip__inner{
  width: var(--md24-shell);
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-block: 8px;
}

.md24-top-strip a{
  color: #071a0b;
  text-decoration: none;
}

.md24-top-strip a:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

.md24-site-header{
  background: #fff;
  border-bottom: 1px solid var(--md24-line);
}

.md24-site-header__inner{
  width: var(--md24-shell);
  margin-inline: auto;
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.md24-brand{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--md24-ink);
  text-decoration: none;
  font-weight: 900;
  letter-spacing: -.03em;
  font-size: 20px;
}

.md24-brand-mark{
  width: 38px;
  height: 38px;
  border-radius: 13px;
  background: linear-gradient(135deg, var(--md24-brand), #dff7df);
  display: grid;
  place-items: center;
  color: #0b2711;
  font-weight: 950;
  box-shadow: 0 10px 24px rgba(65,189,61,.18);
}

.md24-main-nav{
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.md24-main-nav a{
  font-size: 14px;
  font-weight: 760;
  text-decoration: none;
  border-radius: 999px;
  padding: 9px 12px;
  color: #24432b;
}

.md24-main-nav a:hover{
  background: var(--md24-soft);
}

.md24-main-nav .md24-nav-cta{
  background: var(--md24-brand);
  color: #071a0b;
  box-shadow: 0 10px 24px rgba(65,189,61,.18);
}

.md24-editor-note{
  border: 1px dashed var(--md24-brand-dark);
  background: var(--md24-soft);
  border-radius: 18px;
  padding: 16px 18px;
}

/* Gründerhelden-inspired header system, recolored to MeinDienst24 green. */
.md24-gh-container{
  width:min(calc(100% - 48px),1460px);
  margin-inline:auto;
}

.md24-gh-topbar{
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  background:rgba(65,189,61,.96);
  background-image:linear-gradient(90deg,#7de27a 0%,rgba(65,189,61,.96) 44%,#2f9f35 100%);
  color:#fff;
  font-size:.82rem;
}

.md24-gh-topbar__inner{
  min-height:36px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.md24-gh-topbar__contacts,
.md24-gh-topbar__right{
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
}

.md24-gh-topbar__contacts a{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#fff;
  font-weight:650;
  text-decoration:none;
}

.md24-gh-topbar__contacts a:hover{
  text-decoration:underline;
  text-underline-offset:3px;
}

.md24-gh-topbar__right{
  font-weight:650;
  opacity:.92;
}

.md24-gh-site-header{
  position:relative;
  z-index:1000;
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  background:#fff;
  background-image:none;
  border-bottom:1px solid rgba(65,189,61,.15);
  box-shadow:0 8px 26px rgba(47,159,53,.07);
}

/* When the shared header is rendered inside page content via [md24_header],
   make it fill the actual viewport instead of the content column. */
body.wp-child-theme-md24-breit .wp-block-post-content > .md24-gh-topbar,
body.wp-child-theme-md24-breit .wp-block-post-content > .md24-gh-site-header,
body.wp-child-theme-md24-breit .entry-content > .md24-gh-topbar,
body.wp-child-theme-md24-breit .entry-content > .md24-gh-site-header{
  width:auto !important;
  max-width:none !important;
  margin-left:calc((100vw - 100%) / -2) !important;
  margin-right:calc((100vw - 100%) / -2) !important;
}

body.wp-child-theme-md24-breit .md24-page > .md24-gh-topbar,
body.wp-child-theme-md24-breit .md24-page > .md24-gh-site-header{
  width:100vw !important;
  max-width:100vw !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

.md24-gh-header__inner{
  min-height:82px;
  display:grid;
  grid-template-columns:auto 1fr auto auto;
  align-items:center;
  gap:28px;
}

.md24-gh-brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  color:var(--md24-ink);
  text-decoration:none;
}

.md24-gh-brand__mark{
  width:46px;
  height:46px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(65,189,61,.96),#dff7df);
  border:0;
  display:grid;
  place-items:center;
  color:#0b2711;
  font-weight:950;
  letter-spacing:-.05em;
  box-shadow:0 10px 24px rgba(65,189,61,.22);
}

.md24-gh-brand__text{
  font-size:1.28rem;
  font-weight:900;
  letter-spacing:-.045em;
  color:var(--md24-ink);
}

.md24-gh-desktop-nav{
  justify-self:center;
}

.md24-gh-menu,
.md24-gh-menu ul{
  list-style:none;
  margin:0;
  padding:0;
}

.md24-gh-menu{
  display:flex;
  align-items:center;
  gap:5px;
}

.md24-gh-menu > li{
  position:relative;
}

.md24-gh-menu > li > a{
  min-height:44px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:0 12px;
  border-radius:10px;
  color:var(--md24-ink);
  font-size:.93rem;
  font-weight:760;
  text-decoration:none;
  white-space:nowrap;
}

.md24-gh-menu > li > a:hover,
.md24-gh-menu > li:focus-within > a{
  color:var(--md24-brand-dark);
  background:var(--md24-soft);
}

.md24-gh-menu .menu-item-has-children > a:after{
  content:"";
  width:7px;
  height:7px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px);
  margin-left:2px;
}

.md24-gh-menu .sub-menu{
  position:absolute;
  left:0;
  top:calc(100% + 8px);
  z-index:30;
  width:282px;
  padding:10px;
  border:1px solid var(--md24-line);
  border-radius:16px;
  background:#fff;
  box-shadow:0 18px 48px rgba(47,159,53,.16);
  opacity:0;
  visibility:hidden;
  transform:translateY(6px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}

.md24-gh-menu li:hover > .sub-menu,
.md24-gh-menu li:focus-within > .sub-menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

.md24-gh-menu .sub-menu a{
  display:block;
  padding:10px 12px;
  border-radius:10px;
  color:var(--md24-ink);
  font-size:.89rem;
  font-weight:680;
  text-decoration:none;
}

.md24-gh-menu .sub-menu a:hover{
  background:var(--md24-soft);
  color:var(--md24-brand-dark);
}

.md24-gh-header-contact{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 10px;
  color:var(--md24-ink);
  font-size:.93rem;
  font-weight:760;
  border-radius:10px;
  white-space:nowrap;
  text-decoration:none;
}

.md24-gh-header-contact:hover{
  background:var(--md24-soft);
  color:var(--md24-brand-dark);
}

.md24-gh-header-cta{
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  border-radius:13px;
  background:rgba(65,189,61,.96);
  border:0;
  color:#fff;
  font-size:.88rem;
  font-weight:880;
  box-shadow:0 10px 24px rgba(65,189,61,.22);
  white-space:nowrap;
  text-decoration:none;
}

.md24-gh-header-cta:hover{
  background:#2f9f35;
  color:#fff;
}

/* Stronger legacy-page width correction.
   Some old service pages were created before the new system and can still look narrow
   because their content lives inside several constrained Gutenberg wrappers. */
body.wp-child-theme-md24-breit .wp-site-blocks{
  width: 100%;
  max-width: none !important;
  overflow-x: clip;
}

body.wp-child-theme-md24-breit .wp-site-blocks > main.alignfull,
body.wp-child-theme-md24-breit main.md24-page-canvas{
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.wp-child-theme-md24-breit main.md24-page-canvas > .wp-block-post-title,
body.wp-child-theme-md24-breit main.md24-page-canvas > .entry-content,
body.wp-child-theme-md24-breit main.md24-page-canvas > .wp-block-post-content{
  width: min(1460px, calc(100vw - 32px)) !important;
  max-width: min(1460px, calc(100vw - 32px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body.wp-child-theme-md24-breit main.md24-page-canvas > .entry-content > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
body.wp-child-theme-md24-breit main.md24-page-canvas > .wp-block-post-content > :where(:not(.alignleft):not(.alignright):not(.alignfull)){
  max-width: min(1460px, calc(100vw - 32px)) !important;
}

body.wp-child-theme-md24-breit main.md24-page-canvas > .entry-content > .alignfull,
body.wp-child-theme-md24-breit main.md24-page-canvas > .wp-block-post-content > .alignfull{
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

@media (max-width: 1040px){
  .md24-gh-header__inner{
    grid-template-columns:auto 1fr;
    gap:14px;
    padding-block:14px;
  }
  .md24-gh-desktop-nav{
    grid-column:1 / -1;
    justify-self:start;
  }
  .md24-gh-header-contact,
  .md24-gh-header-cta{
    justify-self:end;
  }
}

@media (max-width: 760px){
  .md24-top-strip__inner,
  .md24-site-header__inner{
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    padding-block: 10px;
  }
  .md24-main-nav{
    justify-content: flex-start;
  }
  .md24-gh-topbar__inner{
    align-items:flex-start;
    flex-direction:column;
    gap:6px;
    padding-block:8px;
  }
  .md24-gh-header__inner{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    min-height:auto;
    padding:14px 0;
  }
  .md24-gh-menu{
    align-items:flex-start;
    flex-direction:column;
    width:100%;
  }
  .md24-gh-menu > li,
  .md24-gh-menu > li > a,
  .md24-gh-header-contact,
  .md24-gh-header-cta{
    width:100%;
  }
  .md24-gh-menu .sub-menu{
    display:none !important;
    position:static;
    width:100%;
    opacity:1;
    visibility:visible;
    transform:none;
    box-shadow:none;
    margin:4px 0 10px;
  }
  body.wp-child-theme-md24-breit main.md24-page-canvas > .wp-block-post-title,
  body.wp-child-theme-md24-breit main.md24-page-canvas > .entry-content,
  body.wp-child-theme-md24-breit main.md24-page-canvas > .wp-block-post-content{
    width: min(100% - 22px, 100vw - 22px) !important;
    max-width: min(100% - 22px, 100vw - 22px) !important;
  }
}


/* MD24 responsive hardening: prevent grid min-content overflow on service pages. */
.md24svc :where(.hero-grid,.grid2,.grid3,.steps,.cta-box,.section-head,.metric-row) > *,
.md24-page :where(.md24-hero-grid,.md24-split,.md24-choice-inner,.md24-spark,.md24-grid,.md24-section-grid,.md24-services-grid,.md24-cards,.md24-trust-grid) > *{
  min-width:0 !important;
}

@media (max-width: 760px){
  .md24-gh-container{width:min(calc(100% - 24px),1460px)!important;}
  .md24-gh-header__inner{align-items:stretch!important;}
  .md24-gh-desktop-nav{width:100%!important;}
  .md24-gh-menu{width:100%!important;}
  .md24-gh-menu > li > a,
  .md24-gh-header-contact,
  .md24-gh-header-cta{justify-content:center!important;text-align:center!important;white-space:normal!important;}

  .md24svc,
  .md24-page{max-width:100vw!important;overflow-x:clip!important;}
  .md24svc .shell,
  .md24-shell,
  .md24-wide-shell,
  .md24-head-inner,
  .md24-home-topbar-inner,
  .md24-topbar-inner,
  .md24-preheader-inner,
  .md24-choice-inner,
  .md24-filter,
  .md24-hero-grid,
  .md24-section-grid,
  .md24-services-grid,
  .md24-cards,
  .md24-trust-grid{
    width:min(calc(100% - 24px),100%)!important;
    max-width:calc(100vw - 24px)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .md24svc .hero-grid,
  .md24svc .grid2,
  .md24svc .grid3,
  .md24svc .steps,
  .md24svc .cta-box,
  .md24-page .md24-hero-grid,
  .md24-page .md24-split,
  .md24-page .md24-choice-inner,
  .md24-page .md24-spark,
  .md24-page .md24-grid.two,
  .md24-page .md24-grid.three,
  .md24-page .md24-grid.four{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:22px!important;
  }
  .md24svc :where(.hero-grid,.grid2,.grid3,.steps,.cta-box,.section-head,.metric-row) > *,
  .md24-page :where(.md24-hero-grid,.md24-split,.md24-choice-inner,.md24-spark,.md24-grid,.md24-section-grid,.md24-services-grid,.md24-cards,.md24-trust-grid) > *{
    min-width:0!important;
    max-width:100%!important;
  }
  .md24svc :where(h1,h2,h3,p,.lead,.ey),
  .md24-page :where(h1,h2,h3,p,.md24-lead,.md24-small,.md24-kicker,.md24-eyebrow){
    max-width:100%!important;
    overflow-wrap:break-word!important;
    word-break:normal!important;
  }
  .md24svc h1{font-size:clamp(2.15rem,10vw,3rem)!important;}
  .md24-page h1{font-size:clamp(2.1rem,9vw,2.8rem)!important;}
  .md24svc .actions,
  .md24-page .md24-actions{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    width:100%!important;
  }
  .md24svc .btn,
  .md24-page .md24-btn{
    width:100%!important;
    max-width:100%!important;
    white-space:normal!important;
    text-align:center!important;
  }
  .md24svc svg,
  .md24-page svg,
  .md24svc img,
  .md24-page img{max-width:100%!important;height:auto!important;}
  .md24-topbar-inner{align-items:flex-start!important;flex-direction:column!important;gap:10px!important;padding:14px 0!important;}
  .md24-topnav{width:100%!important;justify-content:flex-start!important;overflow-x:auto!important;flex-wrap:nowrap!important;padding-bottom:4px!important;}
  .md24-topnav a{flex:0 0 auto!important;white-space:nowrap!important;}
}


/* MD24 mobile header fit: no clipped CTA/nav at 390px. */
@media (max-width: 760px){
  .md24-gh-container{box-sizing:border-box!important;}
  .md24-gh-menu,
  .md24-gh-menu > li,
  .md24-gh-menu > li > a,
  .md24-gh-menu .sub-menu,
  .md24-gh-header-contact,
  .md24-gh-header-cta{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
  }
  .md24-gh-menu .sub-menu{display:none!important;}
  .md24-gh-topbar__contacts{gap:10px!important;}
  .md24-gh-topbar__contacts a{font-size:12px!important;}
  .md24-gh-topbar__right{font-size:12px!important;}
  body.wp-child-theme-md24-breit .md24-page > .md24-gh-topbar,
  body.wp-child-theme-md24-breit .md24-page > .md24-gh-site-header{
    width:100vw!important;
    max-width:100vw!important;
    margin-left:-11px!important;
    margin-right:-11px!important;
  }
  .md24-gh-menu > li > a,
  .md24-gh-header-contact,
  .md24-gh-header-cta{padding-left:12px!important;padding-right:12px!important;}
  .md24-topnav{overflow-x:visible!important;flex-wrap:wrap!important;}
  .md24-topnav a{white-space:normal!important;}
}