/*
Theme Name: Mobilim
Theme URI: https://mobilim.eu
Author: Mobilim GmbH
Description: Block-Theme fuer mobilim.eu. Gastgeberberatung im Spreewald.
Version: 1.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mobilim
*/


/* ---- Selbst gehostete Schriften (kein Aufruf an Google) ---- */
@font-face{font-family:"Figtree";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("/wp-content/uploads/2026/09/figtree-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Figtree";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("/wp-content/uploads/2026/09/figtree-latin.woff2") format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:600 700;font-display:swap;
  src:url("/wp-content/uploads/2026/09/sourceserif4-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:600 700;font-display:swap;
  src:url("/wp-content/uploads/2026/09/sourceserif4-latin.woff2") format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

:root{
  color-scheme:light;
  --logo-png:url("assets/logo.png");  /* liegt im Theme-Ordner */
  --navy:#2D4B5D; --navy-d:#22313A; --navy-l:#4F6F82;
  --steel:#C8D5DC; --steel-l:#E3EAEE;
  --copper:#8A5541; --copper-m:#A66A50; --copper-l:#CB8D70; --copper-t:#96603F;
  --bg:#F7F8F9; --surface:#FFFFFF; --surface-2:#EFF3F5;
  --ink:#22313A; --ink-2:#4A5C66; --muted:#76888F;
  --line:#DFE6EA; --line-2:#C9D4DA;
  --ok:#2F6B52; --ok-soft:#E4F0EA;
  --accent:var(--copper); --on-accent:#FFFFFF;
  --r:12px; --r-sm:8px;
  --shadow:0 1px 2px rgba(34,49,58,.05), 0 12px 32px -20px rgba(34,49,58,.35);
}

*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Figtree", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size:16.5px; line-height:1.62; -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:"Source Serif 4", Georgia, serif; margin:0; line-height:1.16; text-wrap:balance; letter-spacing:-.012em; font-weight:600}
h1{font-size:clamp(2.1rem,5.4vw,3.5rem)}
h2{font-size:clamp(1.55rem,3.4vw,2.25rem)}
h3{font-size:1.14rem; font-family:"Figtree",sans-serif; font-weight:600; letter-spacing:-.005em; line-height:1.35}
p{margin:0}
a{color:var(--copper-t); text-underline-offset:3px}
.wrap{max-width:1140px; margin:0 auto; padding-inline:20px}
.prose{max-width:66ch}

.label{font-size:.7rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.lede{font-size:1.14rem; line-height:1.58; color:var(--ink-2)}

/* buttons: exactly one filled style on the whole site */
.btn{
  display:inline-flex; align-items:center; gap:9px; background:var(--accent); color:var(--on-accent);
  font:inherit; font-weight:600; font-size:1rem; border:0; border-radius:var(--r-sm);
  padding:14px 24px; cursor:pointer; text-decoration:none; box-shadow:var(--shadow);
  transition:transform .12s ease, filter .12s ease;
}
.btn:hover{filter:brightness(1.08); transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn.sm{padding:10px 18px; font-size:.92rem}
.tlink{
  color:var(--ink-2); font-weight:500; text-decoration:none; border-bottom:1.5px solid var(--line-2);
  padding:0 0 2px; font-size:.97rem; background:none; border-left:0; border-right:0; border-top:0;
  font-family:inherit; cursor:pointer;
}
.tlink:hover{color:var(--copper-t); border-color:var(--copper-t)}
:focus-visible{outline:2.5px solid var(--copper-m); outline-offset:3px; border-radius:4px}

/* header */
header.site{position:sticky; top:env(safe-area-inset-top,0px); z-index:40; background:color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter:blur(12px); border-bottom:1px solid var(--line)}
.hd{display:flex; align-items:center; gap:24px; padding-block:14px}
.logo{display:block; width:150px; height:34px; flex:none;
  background:var(--logo-png) left center/contain no-repeat}
.logo .sr{position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap}
header.site nav{display:flex; gap:22px; margin-left:auto; flex-wrap:wrap}
header.site nav a{color:var(--ink-2); text-decoration:none; font-size:.94rem; font-weight:500}
header.site nav a:hover{color:var(--copper-t)}
header.site nav a[aria-current="page"]{color:var(--copper-t); font-weight:600}
.hd .btn{margin-left:6px}
@media (max-width:900px){
  /* Eine Zeile: Logo links, Aktion und Hamburger rechts */
  .hd{flex-wrap:nowrap; gap:12px}
  header.site .wp-block-site-logo{order:1; flex:none}
  header.site .wp-block-buttons.hd-cta{order:2; margin-left:auto}
  header.site .wp-block-navigation{order:3; margin-left:0; width:auto; flex:none}
  /* Einklappen schon ab 900px statt erst ab 600px */
  header.site .wp-block-navigation__responsive-container:not(.is-menu-open){display:none}
  header.site .wp-block-navigation__responsive-container-open:not(.always-shown){display:flex}
  .hd .btn{margin-left:auto}
}

@media (max-width:600px){
  .hd{padding-block:11px}
  header.site .wp-block-site-logo img{width:112px !important; height:auto}
  header.site .wp-block-button.is-style-mobilim .wp-block-button__link{padding:10px 15px; font-size:.87rem}
}

/* hero */
.hero{padding-block:clamp(48px,7vw,92px) clamp(36px,5vw,64px)}
.hero-grid{display:grid; gap:44px; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); align-items:center}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr; gap:32px}}
.hero h1{margin-block:14px 18px}
.hero .actions{display:flex; gap:20px; align-items:center; flex-wrap:wrap; margin-top:28px}
.hero .micro{font-size:.85rem; color:var(--muted); margin-top:14px}
.hero-photo{margin:0; aspect-ratio:4/3.2; max-width:100%; border-radius:var(--r); overflow:hidden; background:var(--surface-2)}
.hero-photo img{width:100%; height:100%; object-fit:cover; display:block}

/* bilder */
.card-img{width:calc(100% + 52px); margin:-26px -26px 4px; aspect-ratio:3/2; object-fit:cover; display:block;
  border-radius:var(--r) var(--r) 0 0}
.band{position:relative; aspect-ratio:16/5; max-height:340px; overflow:hidden}
.band img{width:100%; height:100%; object-fit:cover; display:block}
.band figcaption{position:absolute; left:0; right:0; bottom:0; padding:18px 20px;
  background:linear-gradient(transparent, rgba(34,49,58,.72)); color:#fff; font-size:.88rem}
.band{margin:0}
.portrait{aspect-ratio:1; border-radius:var(--r); overflow:hidden; border:0; padding:0; display:block}
.portrait img{width:100%; height:100%; object-fit:cover; display:block}

.pricehint{
  margin-top:20px; padding-top:16px; border-top:1px solid var(--line);
  font-size:.92rem; color:var(--muted);
}
.pricehint b{color:var(--ink); font-weight:600; font-variant-numeric:tabular-nums}

/* irrtum */
.myth{margin-top:26px; background:var(--navy-d); border-radius:var(--r); padding:clamp(26px,4vw,40px)}
.myth .label{color:#8FA9B7}
.myth h3{font-family:"Source Serif 4",serif; font-size:clamp(1.35rem,3vw,1.95rem); font-weight:600;
  color:#fff; margin-block:12px 16px; max-width:22ch; line-height:1.22; letter-spacing:-.012em}
.myth p{max-width:62ch; color:#C6D6DE; font-size:1rem}
.myth .conc{margin-top:16px; color:var(--copper-l); font-weight:600}

/* aufgabenteilung */
.split{display:grid; gap:18px; grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr); align-items:start}
@media (max-width:820px){.split{grid-template-columns:1fr}}
.col-box{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:26px}
.col-box.mine{border-color:var(--copper-m); box-shadow:var(--shadow)}
.col-box h3{margin-bottom:16px; font-size:1.1rem}
.col-box ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px}
.col-box li{display:flex; gap:12px; font-size:.94rem; color:var(--ink-2); line-height:1.52}
.col-box li::before{content:"\2713"; color:var(--copper-t); font-weight:700; flex:none; line-height:1.5}
.col-box.yours li::before{content:"\2022"; color:var(--muted)}
.col-box li b{color:var(--ink); font-weight:600}
.split-note{margin-top:16px; font-size:.92rem; color:var(--muted); max-width:62ch}

/* nicht-liste */
.nots{display:grid; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.not-i{background:var(--surface); padding:22px 24px; display:flex; flex-direction:column; gap:7px}
.not-i h4{margin:0; font-size:1rem; font-weight:600; display:flex; gap:10px; align-items:baseline}
.not-i h4::before{content:"—"; color:var(--copper-m); font-weight:700; flex:none}
.not-i p{font-size:.9rem; color:var(--ink-2); padding-left:22px}

/* faq */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line); padding:4px 0}
.faq summary{
  cursor:pointer; list-style:none; padding:18px 40px 18px 0; position:relative;
  font-size:1.04rem; font-weight:600; color:var(--ink); line-height:1.4;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+"; position:absolute; right:6px; top:50%; transform:translateY(-50%);
  font-size:1.4rem; font-weight:400; color:var(--copper-m); line-height:1;
}
.faq details[open] summary::after{content:"–"}
.faq .ans{padding:0 40px 20px 0; color:var(--ink-2); font-size:.96rem; max-width:64ch}
.faq .ans p + p{margin-top:10px}

/* trust */
.trust{border-block:1px solid var(--line); background:var(--surface)}
.trust ul{list-style:none; margin:0; padding:20px 0; display:grid; gap:16px 30px; grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.trust li{display:flex; gap:10px; font-size:.9rem; color:var(--ink-2); line-height:1.4; align-items:flex-start}
.trust .dot{width:7px; height:7px; border-radius:50%; background:var(--copper-m); flex:none; margin-top:.5em}
.trust strong{display:block; color:var(--ink); font-weight:600}

section{padding-block:clamp(48px,6.5vw,84px)}
section.alt{background:var(--surface); border-block:1px solid var(--line)}
.sec-top{margin-bottom:34px}
.sec-top .label{margin-bottom:12px; display:block}

/* problems */
.probs{display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(255px,1fr)); align-items:start}
.prob{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:24px; display:flex; flex-direction:column; gap:9px}
.prob .q{font-family:"Source Serif 4",serif; font-size:1.18rem; font-weight:600; line-height:1.3; color:var(--ink)}
.prob p{font-size:.93rem; color:var(--ink-2)}

/* ladder */
.ladder{display:flex; flex-direction:column; gap:30px}
.rung-head{display:flex; gap:13px; align-items:baseline; margin-bottom:14px}
.rung-n{
  font-family:"Source Serif 4",serif; font-size:.95rem; font-weight:700; color:var(--copper-t);
  width:26px; height:26px; border-radius:50%; border:1.5px solid var(--copper-m);
  display:grid; place-items:center; flex:none; font-variant-numeric:tabular-nums;
}
.rung-head h3{font-size:1.24rem; font-family:"Source Serif 4",serif; font-weight:600}
.rung-head .sub{font-size:.9rem; color:var(--muted)}
.offers{display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(272px,1fr))}
.offer{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  padding:24px; display:flex; flex-direction:column; gap:10px;
}
.offer.feature{border-color:var(--copper-m); box-shadow:var(--shadow)}
.offer h4{margin:0; font-size:1.05rem; font-weight:600; font-family:"Figtree",sans-serif}
.offer .p{font-family:"Source Serif 4",serif; font-size:1.85rem; font-weight:700; line-height:1.05; color:var(--ink); font-variant-numeric:tabular-nums}
.offer .p small{font-size:.86rem; font-weight:400; color:var(--muted); font-family:"Figtree",sans-serif; display:block; margin-top:3px}
.offer p{font-size:.92rem; color:var(--ink-2)}
.offer .who{font-size:.86rem; color:var(--muted); border-top:1px dashed var(--line-2); padding-top:10px; margin-top:auto}
.offer .badge{
  align-self:flex-start; font-size:.68rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  background:var(--copper); color:#fff; padding:3px 9px; border-radius:99px;
}
.own-share{
  background:color-mix(in srgb,var(--copper-l) 15%, var(--surface)); border:1px solid var(--copper-m);
  border-radius:var(--r-sm); padding:12px 14px; font-size:.9rem; color:var(--ink);
}
.own-share b{font-family:"Source Serif 4",serif; font-size:1.25rem; color:var(--copper-t)}

/* measure */
.measure{display:grid; gap:34px; grid-template-columns:minmax(0,1fr) minmax(0,.8fr); align-items:center}
@media (max-width:820px){.measure{grid-template-columns:1fr}}
.factors{display:flex; flex-wrap:wrap; gap:8px}
.factors span{font-size:.86rem; padding:7px 13px; border-radius:99px; border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2)}
.factors span.hot{border-color:var(--copper-m); color:var(--copper); background:color-mix(in srgb,var(--copper-l) 16%, transparent); font-weight:600}

/* funding block */
.funding{background:var(--navy-d); color:#EAF1F4}
.funding h2{color:#fff}
.funding .label{color:#93AEBC}
.fund-grid{display:grid; gap:40px; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); align-items:center}
@media (max-width:860px){.fund-grid{grid-template-columns:1fr; gap:28px}}
.funding p{color:#C6D6DE}
.fund-card{background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14); border-radius:var(--r); padding:26px}
.fund-row{display:flex; justify-content:space-between; gap:16px; padding:11px 0; border-top:1px solid rgba(255,255,255,.12); font-size:.93rem}
.fund-row:first-of-type{border-top:0}
.fund-row b{font-weight:600; color:#fff; font-variant-numeric:tabular-nums}
.fund-row.big{font-size:1.02rem}
.fund-row.big b{color:var(--copper-l); font-size:1.3rem}
.fund-note{font-size:.79rem; color:#93AEBC; margin-top:16px; line-height:1.5}

/* proof */
.proof{display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); align-items:start}
.pcard{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:26px; display:flex; flex-direction:column; gap:12px}
.pcard .tagline{font-size:.7rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--copper-t)}
.pcard p{font-size:.93rem; color:var(--ink-2)}
.barchart{display:flex; align-items:flex-end; gap:20px; height:132px; margin-block:6px 2px}
.bcol{flex:1; display:flex; flex-direction:column; justify-content:flex-end; gap:8px; height:100%}
.bcol .fill{border-radius:6px 6px 0 0; width:100%}
.bcol .cap{font-size:.78rem; color:var(--muted); text-align:center}
.bcol .num{font-family:"Source Serif 4",serif; font-size:1.5rem; font-weight:700; text-align:center; font-variant-numeric:tabular-nums; line-height:1}
.pending{font-size:.78rem; color:var(--muted); border-top:1px dashed var(--line-2); padding-top:10px; margin-top:auto}

/* events */
.events{display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.ev{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:22px; display:flex; flex-direction:column; gap:8px}
.ev .when{font-family:"Source Serif 4",serif; font-size:1.3rem; font-weight:600; color:var(--ink)}
.ev .where{font-size:.86rem; color:var(--muted)}
.ev p{font-size:.9rem; color:var(--ink-2)}
.ev .status{align-self:flex-start; font-size:.7rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; padding:3px 9px; border-radius:99px; background:var(--surface-2); color:var(--muted); border:1px solid var(--line-2)}
.ev .status.soon{background:color-mix(in srgb,var(--copper-l) 18%,transparent); color:var(--copper); border-color:var(--copper-m)}
.ev a{margin-top:auto; padding-top:6px}

/* about */
.about{display:grid; gap:36px; grid-template-columns:minmax(0,220px) minmax(0,1fr); align-items:start}
@media (max-width:720px){.about{grid-template-columns:1fr}}
.portrait{aspect-ratio:1; border-radius:var(--r); background:var(--surface-2); border:1px dashed var(--line-2); display:flex; align-items:center; justify-content:center; text-align:center; padding:18px; font-size:.8rem; color:var(--muted)}
.quote{font-family:"Source Serif 4",serif; font-size:1.45rem; line-height:1.34; font-weight:600; color:var(--ink); border-left:3px solid var(--copper-m); padding-left:20px; margin-block:6px 18px}

/* final */
.final{background:var(--surface-2); border-top:1px solid var(--line)}
.final .inner{display:flex; flex-direction:column; align-items:center; text-align:center; gap:18px; max-width:640px; margin:0 auto}
.final .actions{display:flex; gap:20px; align-items:center; flex-wrap:wrap; justify-content:center; margin-top:8px}

footer.site{background:var(--navy-d); color:#A9BFC9; padding-block:44px 32px; font-size:.88rem}
footer.site .cols{display:grid; gap:28px; grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
footer.site strong{color:#fff; display:block; margin-bottom:9px; font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600}
footer.site a{color:#A9BFC9; text-decoration:none; display:block; padding:3px 0}
footer.site a:hover{color:#fff}
footer.site .fine{margin-top:32px; padding-top:18px; border-top:1px solid rgba(255,255,255,.12); font-size:.8rem}

/* ---- Seiten ---- */
.phero{padding-block:clamp(38px,5vw,64px) clamp(26px,3.5vw,40px)}
.phero .label{display:block; margin-bottom:12px}
.phero h1{font-size:clamp(1.9rem,4.6vw,3rem); margin-bottom:16px}
.phero .lede{max-width:62ch}
.pband{aspect-ratio:16/5; max-height:340px; overflow:hidden; margin:0}
.pband img{width:100%; height:100%; object-fit:cover; display:block}

/* ---- Detailblock je Leistung ---- */
.detail{display:grid; gap:28px; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start;
  padding-block:34px; border-top:1px solid var(--line)}
@media (max-width:820px){.detail{grid-template-columns:1fr; gap:20px}}
.detail:first-of-type{border-top:0}
.detail h3{font-family:"Source Serif 4",serif; font-size:1.45rem; font-weight:600; margin-bottom:6px}
.detail .tag{font-size:.8rem; font-weight:600; color:var(--copper-t); letter-spacing:.08em; text-transform:uppercase}
.detail .pr{font-family:"Source Serif 4",serif; font-size:1.7rem; font-weight:700; margin-block:10px 4px; font-variant-numeric:tabular-nums}
.detail .pr small{display:block; font-family:"Figtree",sans-serif; font-size:.85rem; font-weight:400; color:var(--muted); margin-top:3px}
.detail p{color:var(--ink-2); font-size:.96rem}
.detail ul{list-style:none; margin:14px 0 0; padding:0; display:flex; flex-direction:column; gap:9px}
.detail ul li{display:flex; gap:11px; font-size:.93rem; color:var(--ink-2); line-height:1.5}
.detail ul li::before{content:"\2713"; color:var(--copper-t); font-weight:700; flex:none}
.detail figure{margin:0; border-radius:var(--r); overflow:hidden; aspect-ratio:3/2}
.detail figure img{width:100%; height:100%; object-fit:cover; display:block}

.compare{background:var(--surface-2); border-radius:var(--r); padding:22px 24px; margin-block:6px 10px}
.compare h4{margin:0 0 8px; font-size:.78rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--muted)}
.compare p{font-size:.98rem; color:var(--ink-2); max-width:78ch}
.compare b{color:var(--ink)}

/* ---- Ablauf ---- */
.flow{list-style:none; margin:0; padding:0; counter-reset:fl; position:relative}
.flow li{counter-increment:fl; display:grid; grid-template-columns:auto 1fr; gap:20px; padding-bottom:26px; position:relative}
.flow li::before{content:counter(fl); width:36px; height:36px; border-radius:50%; background:var(--copper);
  color:#fff; display:grid; place-items:center; font-weight:700; font-size:.95rem; flex:none; z-index:1;
  font-family:"Source Serif 4",serif}
.flow li::after{content:""; position:absolute; left:17px; top:36px; bottom:0; width:2px; background:var(--line-2)}
.flow li:last-child{padding-bottom:0}
.flow li:last-child::after{display:none}
.flow h4{margin:0 0 4px; font-size:1.02rem; font-weight:600; padding-top:6px}
.flow p{font-size:.93rem; color:var(--ink-2)}
.flow .warn{color:var(--copper-t); font-weight:600}

/* ---- Kostenliste ---- */
.costs{border:1px solid var(--line); border-radius:var(--r); background:var(--surface); overflow:hidden}
.costs div{display:flex; gap:16px; justify-content:space-between; padding:13px 18px; border-top:1px solid var(--line); font-size:.93rem}
.costs div:first-child{border-top:0}
.costs span:first-child{color:var(--ink)}
.costs span:last-child{color:var(--muted); text-align:right; flex:none; max-width:55%}

/* ---- Galerie ---- */
.gal{display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.gal figure{margin:0; border-radius:var(--r); overflow:hidden; background:var(--surface-2)}
.gal img{width:100%; aspect-ratio:3/2; object-fit:cover; display:block}
.gal figcaption{font-size:.84rem; color:var(--muted); padding:9px 2px 0}

/* ---- Newsletter ---- */
.news{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:clamp(22px,3vw,32px)}
.news .row{display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end}
.news .row .field{flex:1; min-width:180px; margin-bottom:0}

/* ---- Kontaktzeile ---- */
.contact{display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.contact div{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:20px}
.contact b{display:block; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:7px}
.contact p{font-size:.98rem; color:var(--ink); line-height:1.5}

@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important}}

.rung-lead{color:var(--muted); max-width:62ch; line-height:1.62}
.rung-lead b{color:var(--ink); font-weight:600}
.sec-more{margin-top:30px; padding-top:22px; border-top:1px solid var(--line)}
.sec-more a{color:var(--copper-t); font-weight:600; text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:2px}
@media(max-width:640px){
  .rung-head{flex-wrap:wrap; gap:8px 11px}
  .rung-head .sub{flex-basis:100%; margin-left:31px}
}
.nextdate{display:flex; gap:22px; align-items:center; justify-content:space-between; flex-wrap:wrap;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:clamp(20px,2.6vw,28px)}
.nextdate p{margin-top:8px; color:var(--muted); max-width:64ch; line-height:1.6}
.nextdate b{color:var(--ink)}
.nextdate > a{white-space:nowrap; color:var(--copper-t); font-weight:600; text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:2px}
@media(max-width:640px){ .nextdate{flex-direction:column; align-items:flex-start} }


/* ================= WordPress-Anpassungen ================= */
.wp-site-blocks{margin-block:0}
body{margin:0}
.alignfull{margin-inline:calc(50% - 50vw); max-width:100vw; width:100vw}
.alignwide{margin-inline:auto; max-width:1140px}
img{max-width:100%; height:auto}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap}

/* Navigation als Block */
header.site .wp-block-navigation{margin-left:auto}
header.site .wp-block-navigation a{color:var(--ink-2); text-decoration:none; font-size:.94rem; font-weight:500}
header.site .wp-block-navigation a:hover{color:var(--copper-t)}
header.site .wp-block-navigation__container{gap:22px}
@media (max-width:900px){header.site .wp-block-navigation{margin-left:auto}}

/* Buttons als Block */
.wp-block-button.is-style-mobilim .wp-block-button__link{
  background:var(--accent); color:var(--on-accent); font-weight:600; font-size:1rem;
  border-radius:var(--r-sm); padding:14px 24px; box-shadow:var(--shadow); text-decoration:none;
}
.wp-block-button.is-style-mobilim .wp-block-button__link:hover{filter:brightness(1.08)}
.wp-block-button.is-style-textlink .wp-block-button__link{
  background:none; color:var(--ink-2); font-weight:500; font-size:.97rem; padding:0 0 2px;
  border-bottom:1.5px solid var(--line-2); border-radius:0;
}
.wp-block-button.is-style-textlink .wp-block-button__link:hover{color:var(--copper-t); border-color:var(--copper-t)}

/* Der Editor soll die Abschnitte nicht zerquetschen */
.editor-styles-wrapper section{padding-block:clamp(48px,6.5vw,84px)}


/* ---- Navigationsblock: Mobilmenue ---- */
/* backdrop-filter erzeugt einen Bezugsrahmen, in dem position:fixed gefangen bleibt.
   Ohne ihn kann sich das Mobilmenue ueber den ganzen Bildschirm legen. */
@media (max-width:900px){
  header.site{backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--surface)}
}

header.site .wp-block-navigation__responsive-container-open{color:var(--ink-2)}

header.site .wp-block-navigation__responsive-container.is-menu-open{
  position:fixed; inset:0; z-index:200;
  display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start;
  background:var(--surface); padding:clamp(64px,12vw,96px) 20px 36px;
  overflow-y:auto;
}
header.site .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content{
  width:100%; max-width:640px; margin:0 auto;
  display:flex; flex-direction:column; align-items:flex-start;
}
header.site .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container{
  flex-direction:column; align-items:flex-start; gap:2px; width:100%;
}
header.site .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item{width:100%}
header.site .wp-block-navigation__responsive-container.is-menu-open a{
  font-family:"Source Serif 4",Georgia,serif; font-size:1.35rem; font-weight:600;
  color:var(--ink); text-decoration:none;
  display:block; width:100%; padding:14px 0; border-bottom:1px solid var(--line);
}
header.site .wp-block-navigation__responsive-container.is-menu-open a:hover{color:var(--copper-t)}
header.site .wp-block-navigation__responsive-container-close{
  position:absolute; top:16px; right:16px; z-index:2; color:var(--ink-2);
}
body.has-modal-open{overflow:hidden}


/* ---- HubSpot-Formular ----
   Das Formular rendert seit 2025 in einem iframe auf hsforms.com. Eigenes CSS
   kommt dort nicht hinein - Farben und Feldform werden in HubSpot eingestellt
   (Formular > Stil & Vorschau). Von aussen steuerbar ist nur der Rahmen. */
#mobilim-potenzialanalyse{max-width:640px}
.hs-form-iframe{display:block}


/* ---- Rechtstexte: Impressum, Datenschutz, AGB ---- */
.legal h2{margin:46px 0 8px; font-size:1.32rem; line-height:1.3}
.legal h2:first-child{margin-top:4px}
.legal h3{margin:28px 0 6px; font-size:1.02rem; line-height:1.4}
.legal p{margin:0 0 14px; max-width:78ch; line-height:1.68}
.legal ul{margin:0 0 18px; padding-left:22px; max-width:78ch}
.legal li{margin-bottom:7px; line-height:1.62}
.legal a{text-decoration:underline; text-underline-offset:2px}