/*
Theme Name: Energieagentur St.Gallen (m2)
Theme URI: https://www.energieagentur-sg.ch
Description: Custom port-1:1 theme of the polished "m2 / Variante B" concept (aurora hero, lifted service cards, animated gradient accents). Restyles the crawled energieagentur-sg content with the new design. Dependency-free CSS/JS, system-font stack.
Author: Energieagentur St.Gallen
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ena-sg
*/

/* ============================================================
   Design tokens — REALE Markenpalette (ported from concept m2)
   ============================================================ */
:root{
  --magenta:#e7004c; --magenta-dark:#c40043;
  --teal:#06384a; --teal-2:#0c4f63;
  --green:#6aa539; --green-dark:#4f8a25; --lime:#aecd60;
  --ink:#1f2a2e; --gray:#575757; --muted:#5d6b62;
  --bg:#ffffff; --bg-soft:#f5f6f2; --sand:#f3efe7; --line:#e2e6e0;
  --line-dark:rgba(255,255,255,.16);
  --maxw:1180px;
  --measure:68ch;              /* readable prose line-length; widened per viewport below */
  --ease:cubic-bezier(.2,.7,.2,1);
  --shadow-lift:0 16px 34px -22px rgba(6,56,74,.5);
  --shadow-pop:0 22px 44px -24px rgba(6,56,74,.7);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,"Helvetica Neue",Helvetica,system-ui,sans-serif;
  color:var(--ink);background:var(--bg);line-height:1.6;font-size:19px;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
.ic{width:1.6em;height:1.6em;stroke:currentColor;stroke-width:1.7;fill:none;
  stroke-linecap:round;stroke-linejoin:round;display:inline-block;vertical-align:middle}

/* ---- Accessible focus — visible on light & dark ---- */
a:focus-visible,.btn:focus-visible,input:focus-visible,.logo:focus-visible{
  outline:3px solid var(--magenta);outline-offset:3px;border-radius:6px}
.hero a:focus-visible,.kpis a:focus-visible,.partners a:focus-visible,
footer.site a:focus-visible,.newsletter input:focus-visible{outline-color:var(--lime)}

/* ---- Buttons — smooth lifts ---- */
.btn{display:inline-flex;align-items:center;gap:11px;padding:16px 30px;
  font-weight:700;font-size:1.02rem;border:1.5px solid transparent;cursor:pointer;
  transition:transform .5s var(--ease),background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),box-shadow .5s var(--ease);
  min-height:54px;line-height:1.1;border-radius:8px;letter-spacing:.01em}
.btn .ic{width:1.2em;height:1.2em;transition:transform .5s var(--ease)}
.btn:hover{transform:translateY(-3px)}
.btn:active{transform:translateY(-1px)}
.btn-solid{background:var(--teal);color:#fff;border-color:var(--teal)}
.btn-solid:hover{background:#0a4257;border-color:#0a4257;box-shadow:0 14px 30px -12px rgba(6,56,74,.6)}
.btn-solid:hover .ic{transform:translateX(5px)}
.btn-line{background:transparent;color:var(--teal);border-color:var(--teal)}
.btn-line:hover{background:var(--teal);color:#fff;box-shadow:0 14px 30px -12px rgba(6,56,74,.5)}
.btn-line:hover .ic{transform:translateX(5px)}
.btn-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn-light:hover{background:#fff;color:var(--teal);border-color:#fff;box-shadow:0 14px 30px -12px rgba(0,0,0,.4)}
.btn-white{background:#fff;color:var(--teal);border-color:#fff}
.btn-white:hover{box-shadow:0 16px 34px -12px rgba(0,0,0,.45)}
.btn-white:hover .ic{transform:translateX(5px)}

.eyebrow{text-transform:uppercase;letter-spacing:.22em;font-size:.74rem;font-weight:700;
  color:var(--muted);display:flex;align-items:center;gap:14px}
.eyebrow::before{content:"";width:30px;height:1px;background:var(--magenta);flex:none}
.eyebrow.on-dark{color:rgba(255,255,255,.62)}

h1,h2,h3,h4{line-height:1.14;font-weight:700;letter-spacing:-.01em}
h2.section-title{font-size:2.2rem;margin:.45em 0 .3em;max-width:20ch}
.section{padding:108px 0}
.lead{color:var(--muted);max-width:60ch;font-size:1.1rem}
.illus{font-size:.82rem;color:var(--muted);font-style:italic;margin-top:18px}

/* ---- Logo — official pixel mosaic (mark first) + single-line wordmark ----
   viewBox trimmed to the mosaic (≈square) so there is no dead space beside it;
   aspect-ratio + fixed height keeps the SVG from stretching inside the flex row. */
.logo{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);flex:none}
.logo .wm-mark{height:2.3em;width:auto;aspect-ratio:1/1;flex:none}
.logo .wm-inline{font-weight:800;font-size:1.06rem;letter-spacing:-.01em;color:inherit;white-space:nowrap;line-height:1}
.logo .wm-inline .thin{font-weight:400;color:var(--muted)}
.logo.on-dark{color:#eef5f5}                  /* DARK footer → light wordmark */
.logo.on-dark .wm-inline .thin{color:rgba(255,255,255,.66)}

/* ---- Header — sticky, frosted ---- */
header.site{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.86);
  backdrop-filter:saturate(160%) blur(10px);border-bottom:1px solid var(--line);
  transition:box-shadow .4s var(--ease)}
header.site.scrolled{box-shadow:0 10px 30px -18px rgba(6,56,74,.4)}
.nav{display:flex;align-items:center;gap:18px;padding:15px 32px}
nav.primary{display:flex;gap:16px;margin-left:4px;font-weight:700;font-size:.92rem}
.nav .btn-line{white-space:nowrap;padding:12px 18px}
.navitem{position:relative}
.navitem>a{display:inline-flex;align-items:center;gap:5px;padding:6px 0;position:relative;color:var(--ink);white-space:nowrap}
.navitem>a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;
  background:var(--magenta);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.navitem:hover>a::after,.navitem:focus-within>a::after{transform:scaleX(1)}
.navitem>a .caret{width:.62em;height:.62em;stroke:currentColor;stroke-width:2.4;fill:none;
  stroke-linecap:round;stroke-linejoin:round;opacity:.72;transition:transform .35s var(--ease)}
.navitem:hover>a .caret,.navitem:focus-within>a .caret{transform:rotate(180deg)}

/* ---- Nav dropdowns — clean white cards, magenta hover ---- */
.dropdown{position:absolute;top:calc(100% + 15px);left:0;
  transform:translateY(6px);min-width:296px;
  background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-pop);
  padding:10px;z-index:60;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .18s var(--ease),transform .18s var(--ease),visibility .18s var(--ease)}
.dropdown::before{content:"";position:absolute;left:0;right:0;top:-15px;height:15px}/* hover bridge */
.navitem:hover>.dropdown,.navitem:focus-within>.dropdown{
  opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.dropdown.wide{min-width:540px;display:grid;grid-template-columns:1fr 1fr;gap:2px}
.dropdown a{display:block;padding:11px 15px;border-radius:9px;color:var(--ink);
  transition:background .25s var(--ease),color .25s var(--ease)}
.dropdown a b{display:block;font-size:1rem;font-weight:700;line-height:1.25}
.dropdown a span{display:block;font-size:.95rem;color:var(--muted);font-weight:400;line-height:1.3;margin-top:2px;
  transition:color .25s var(--ease)}
.dropdown a:hover,.dropdown a:focus-visible{background:var(--bg-soft);color:var(--magenta)}
.dropdown a:hover span,.dropdown a:focus-visible span{color:var(--magenta)}
.nav .spacer{flex:1}
.navphone{display:inline-flex;align-items:center;gap:9px;font-weight:700;color:var(--teal);
  font-size:1rem;white-space:nowrap;transition:color .35s var(--ease)}
.navphone .ic{width:1.2em;height:1.2em}
.navphone:hover{color:var(--magenta)}

/* ---- Hero — animated aurora gradient (calmed) ---- */
.hero{position:relative;overflow:hidden;background:var(--teal);color:#fff;isolation:isolate}
.hero .aurora{position:absolute;inset:-20% -10%;z-index:0;pointer-events:none}
.hero .aurora span{position:absolute;display:block;border-radius:50%;filter:blur(72px);opacity:.55;
  will-change:transform}
.hero .aurora .b1{width:46vw;height:46vw;left:-6%;top:-12%;
  background:radial-gradient(circle at 30% 30%,#0c4f63,transparent 70%);
  animation:drift1 34s var(--ease) infinite alternate}
.hero .aurora .b2{width:42vw;height:42vw;right:-8%;top:8%;
  background:radial-gradient(circle at 50% 50%,#0e5e74,transparent 70%);
  animation:drift2 42s var(--ease) infinite alternate}
.hero .aurora .b3{width:34vw;height:34vw;left:34%;bottom:-18%;
  background:radial-gradient(circle at 50% 50%,rgba(231,0,76,.5),transparent 68%);
  opacity:.34;animation:drift3 50s var(--ease) infinite alternate}
/* readability scrim: strongest behind the (bottom-left) headline, edges stay luminous */
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(125% 120% at 14% 86%,rgba(4,40,53,.66),rgba(4,40,53,.16) 58%,transparent 80%),
    linear-gradient(180deg,rgba(6,56,74,.26),rgba(6,56,74,.5))}
@keyframes drift1{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(6%,5%,0) scale(1.1)}}
@keyframes drift2{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(-6%,7%,0) scale(1.06)}}
@keyframes drift3{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(-7%,-6%,0) scale(1.14)}}
.hero .wrap{padding:132px 32px 120px;position:relative;z-index:2}
.hero .eyebrow{opacity:0;transform:translateY(16px);animation:riseIn .7s var(--ease) .05s forwards}
.hero h1{font-size:3.5rem;margin:.5em 0 .1em;max-width:17ch;font-weight:700;letter-spacing:-.02em;line-height:1.08;
  opacity:0;transform:translateY(20px);animation:riseIn .8s var(--ease) .16s forwards}
.hero h1 .accent{position:relative;white-space:nowrap}
.hero h1 .accent::after{content:"";position:absolute;left:0;right:0;bottom:-.04em;height:4px;background:var(--magenta);
  transform:scaleX(0);transform-origin:left;animation:drawLine .7s var(--ease) .95s forwards}
.hero p.sub{font-size:1.3rem;max-width:54ch;color:rgba(255,255,255,.82);margin:1.3em 0 2.2em;line-height:1.5;
  opacity:0;transform:translateY(20px);animation:riseIn .8s var(--ease) .28s forwards}
.hero .cta{display:flex;gap:18px;flex-wrap:wrap;align-items:center;
  opacity:0;transform:translateY(20px);animation:riseIn .8s var(--ease) .4s forwards}
.hero .herotrust{list-style:none;display:flex;flex-wrap:wrap;gap:12px 26px;margin:30px 0 0;padding:0;
  opacity:0;transform:translateY(20px);animation:riseIn .8s var(--ease) .5s forwards}
.hero .herotrust li{display:inline-flex;align-items:center;gap:10px;
  font-size:.98rem;font-weight:700;color:rgba(255,255,255,.86)}
.hero .herotrust .ic{width:1.15em;height:1.15em;color:var(--lime);flex:none}
.hero .callline{margin-top:34px;display:inline-flex;align-items:center;gap:14px;
  font-size:1.12rem;color:rgba(255,255,255,.85);
  opacity:0;transform:translateY(20px);animation:riseIn .8s var(--ease) .6s forwards}
.hero .callline a{color:#fff;font-weight:700;border-bottom:1px solid rgba(255,255,255,.4);transition:border-color .35s var(--ease)}
.hero .callline a:hover{border-color:#fff}
@keyframes riseIn{to{opacity:1;transform:translateY(0)}}
@keyframes drawLine{to{transform:scaleX(1)}}

/* ---- Scroll reveal — refined stagger + gentle blur-in ---- */
.reveal{opacity:0;transform:translateY(18px);filter:blur(6px);
  transition:opacity .7s var(--ease),transform .7s var(--ease),filter .7s var(--ease)}
.reveal.in{opacity:1;transform:none;filter:none}
.reveal[data-delay="1"]{transition-delay:.07s}
.reveal[data-delay="2"]{transition-delay:.14s}
.reveal[data-delay="3"]{transition-delay:.21s}
.reveal[data-delay="4"]{transition-delay:.28s}
.reveal[data-delay="5"]{transition-delay:.35s}
.reveal[data-delay="6"]{transition-delay:.42s}

/* ---- KPI — oversized count-up numbers ---- */
.kpis{background:var(--teal);color:#fff;position:relative;overflow:hidden;isolation:isolate}
.kpis::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(60% 120% at 80% -10%,rgba(12,79,99,.9),transparent 70%),
             radial-gradient(40% 90% at 8% 120%,rgba(231,0,76,.16),transparent 70%)}
.kpis .wrap{padding:0 32px;position:relative;z-index:1}
.kpis .grid{display:grid;grid-template-columns:repeat(4,1fr)}
.kpi{padding:64px 36px 58px;border-right:1px solid var(--line-dark);position:relative;
  transition:background .4s var(--ease)}
.kpi:hover{background:rgba(255,255,255,.035)}
.kpi:first-child{padding-left:0}
.kpi:last-child{border-right:0;padding-right:0}
.kpi.accent::before{content:"";position:absolute;left:0;top:40px;width:36px;height:3px;
  background:var(--magenta);border-radius:2px}
.kpi .num{font-size:2.2rem;font-weight:700;line-height:1;letter-spacing:-.02em;color:#fff;
  font-variant-numeric:tabular-nums;min-height:2.2rem;white-space:nowrap}
.kpi.accent .num em{font-style:normal;color:var(--magenta)}
.kpi .lab{margin-top:18px;color:rgba(255,255,255,.66);font-size:.98rem;font-weight:400;
  padding-top:16px;border-top:1px solid var(--line-dark);max-width:22ch}
.kpis .foot{padding:20px 0 40px;color:rgba(255,255,255,.45);font-size:.8rem;font-style:italic}

/* ---- Audiences — list rows, hover lift ---- */
.audience .rows{margin-top:48px;border-top:1px solid var(--line)}
.arow{display:grid;grid-template-columns:64px 1fr auto;gap:30px;align-items:center;
  padding:34px 18px;border-bottom:1px solid var(--line);border-radius:10px;
  transition:transform .5s var(--ease),background .4s var(--ease),box-shadow .5s var(--ease)}
.arow:hover{background:var(--bg-soft);transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.arow .ico{color:var(--teal);display:flex;transition:transform .5s var(--ease)}
.arow:hover .ico{transform:scale(1.08)}
.arow .ico .ic{width:2.1em;height:2.1em;stroke-width:1.4}
.arow h3{margin:0 0 4px;font-size:1.28rem}
.arow p{margin:0;color:var(--muted);font-size:1rem}
.arow .go{color:var(--teal);font-weight:700;display:inline-flex;align-items:center;gap:10px;
  white-space:nowrap;font-size:1rem;transition:color .35s var(--ease)}
.arow .go .ic{width:1.2em;height:1.2em;transition:transform .5s var(--ease)}
.arow:hover .go{color:var(--magenta)}
.arow:hover .go .ic{transform:translateX(6px)}

/* ---- Förderung — chips with hover fill ---- */
.foerder{background:var(--bg-soft)}
.foerder h2.section-title{max-width:34ch}
.foerder .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:50px 0 40px}
.fchip{display:flex;flex-direction:column;gap:14px;padding:34px 30px;background:#fff;
  border:1px solid var(--line);border-radius:12px;
  transition:transform .5s var(--ease),background .4s var(--ease),box-shadow .5s var(--ease),border-color .4s var(--ease)}
.fchip:hover{transform:translateY(-5px);box-shadow:var(--shadow-pop);border-color:#d3dccd}
.fchip .ico{color:var(--teal);transition:transform .5s var(--ease),color .4s var(--ease)}
.fchip .ico .ic{width:2em;height:2em;stroke-width:1.4}
.fchip b{font-size:1.16rem}
.fchip span{color:var(--muted);font-size:.96rem}
.foerder .btn-solid{margin-top:6px}
.foerder .portalnote{margin-top:22px}
.foerder .portalnote a{color:var(--teal);text-decoration:underline;font-weight:700}

/* ---- Dienstleistungen — lifted cards, accent bar & gradient chip ---- */
.services .svc-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:50px}
.svc-card{position:relative;overflow:hidden;padding:38px 34px 32px;background:#fff;border:1px solid var(--line);border-radius:14px;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s var(--ease)}
.svc-card::before{content:"";position:absolute;left:0;top:0;height:4px;width:100%;
  background:linear-gradient(90deg,var(--magenta),#ff5c8a);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease)}
.svc-card:hover::before{transform:scaleX(1)}
.svc-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-pop);border-color:#d3dccd}
.svc-idx{position:absolute;top:20px;right:24px;font-size:1.05rem;font-weight:800;color:var(--muted);opacity:.5;pointer-events:none}
.svc-head{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.svc-head .ico{width:52px;height:52px;border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;
  color:#fff;background:linear-gradient(135deg,var(--teal),var(--teal-2));box-shadow:0 8px 18px -8px rgba(6,56,74,.7);
  transition:transform .5s var(--ease)}
.svc-card:hover .svc-head .ico{transform:scale(1.06) rotate(-3deg)}
.svc-head .ico .ic{width:1.6em;height:1.6em;stroke-width:1.5}
.svc-head h3{font-size:1.3rem;margin:0}
.svc-intro{margin:0 0 16px;color:var(--muted);font-size:1rem;line-height:1.5}
.svc-list{list-style:none;margin:0;padding:0}
.svc-list li{display:flex;gap:12px;align-items:flex-start;padding:11px 0;
  color:var(--muted);font-size:1rem;border-top:1px solid var(--line)}
.svc-list li:first-child{border-top:0}
.svc-list li .ic{width:1.1em;height:1.1em;color:var(--green);flex:none;margin-top:.3em;stroke-width:2.4}
.svc-more{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-weight:700;color:var(--teal);font-size:.95rem;
  text-decoration:none;opacity:0;transform:translateY(6px);transition:opacity .4s var(--ease),transform .4s var(--ease)}
.svc-card:hover .svc-more{opacity:1;transform:none}
.svc-more .ic{width:1.15em;height:1.15em;stroke-width:2;transition:transform .35s var(--ease)}
.svc-card:hover .svc-more .ic{transform:translateX(5px)}
@media(hover:none){.svc-more{opacity:1;transform:none}}
@media(max-width:760px){.services .svc-grid{grid-template-columns:1fr}}

/* ---- Testimonial — single magenta mark, vast whitespace ---- */
.quote{background:#fff}
.quote .wrap{padding:128px 32px;max-width:920px;text-align:center}
.quote .mark{font-size:4.25rem;line-height:.9;color:var(--magenta);font-weight:800;display:block;margin:0 0 .14em}
.quote blockquote{margin:.3em 0 0;font-size:2rem;line-height:1.34;color:var(--ink);
  font-weight:400;letter-spacing:-.01em}
.quote .who{margin-top:44px;color:var(--muted);font-size:1rem}
.quote .who b{color:var(--ink);display:block;font-size:1.05rem;margin-bottom:2px}

/* ---- Partners / trust — monochrome wordmarks ---- */
.partners{background:var(--teal);color:#fff;position:relative;overflow:hidden;isolation:isolate}
.partners::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(50% 100% at 100% 0,rgba(12,79,99,.8),transparent 70%)}
.partners .wrap{position:relative;z-index:1}
.logos{display:grid;grid-template-columns:repeat(4,1fr);margin-top:50px;
  border-top:1px solid var(--line-dark);border-left:1px solid var(--line-dark)}
.logos .lg{padding:34px 24px;border-right:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);
  color:rgba(255,255,255,.85);font-weight:700;font-size:1.02rem;min-height:96px;
  display:flex;align-items:center;justify-content:center;text-align:center;
  transition:background .4s var(--ease),color .4s var(--ease)}
.logos .lg:hover{background:rgba(255,255,255,.06);color:#fff}
.badges{display:flex;flex-wrap:wrap;gap:0;margin-top:54px;border:1px solid var(--line-dark);border-radius:10px;overflow:hidden}
.badge{flex:1;display:inline-flex;align-items:center;gap:14px;padding:24px 28px;
  font-weight:700;font-size:1rem;border-right:1px solid var(--line-dark);justify-content:center;
  transition:background .4s var(--ease)}
.badge:last-child{border-right:0}
.badge:hover{background:rgba(255,255,255,.05)}
.badge .ic{color:var(--magenta);width:1.6em;height:1.6em;flex:none}

/* ---- Kontakt — phone rows with hover slide ---- */
.contact .wrap{padding:108px 32px;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.contact h2{font-size:2.2rem;margin:.4em 0 .35em}
.contact .accent-word{color:var(--magenta)}
.contact p{color:var(--muted);max-width:46ch}
.phones{border-top:1px solid var(--line)}
.phonecard{display:flex;align-items:center;gap:22px;padding:26px 10px;
  border-bottom:1px solid var(--line);border-radius:10px;
  transition:transform .5s var(--ease),background .4s var(--ease)}
.phonecard:hover{transform:translateX(8px);background:var(--bg-soft)}
.phonecard .ic-wrap{color:var(--teal);flex:none;display:flex;transition:color .4s var(--ease)}
.phonecard .ic-wrap .ic{width:1.9em;height:1.9em;stroke-width:1.5}
.phonecard b{display:block;font-size:1.5rem;color:var(--ink);font-weight:700;letter-spacing:-.01em}
.phonecard span{font-size:.94rem;color:var(--muted)}
.phonecard:hover .ic-wrap{color:var(--magenta)}

/* ---- Footer ---- */
footer.site{background:#062a38;color:rgba(255,255,255,.62);font-size:.96rem}
footer.site .top{border-bottom:1px solid var(--line-dark)}
footer.site .top .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.2fr;gap:36px;padding:72px 32px 56px}
footer.site h5{color:#fff;font-size:.78rem;text-transform:uppercase;letter-spacing:.16em;margin:0 0 18px;font-weight:700}
footer.site a{display:block;padding:6px 0;color:rgba(255,255,255,.62);transition:color .35s var(--ease)}
footer.site a:hover{color:#fff}
footer .brandcol .logo{margin-bottom:16px;display:flex}
footer .brandcol p{margin:0;max-width:30ch;color:rgba(255,255,255,.5);font-size:.92rem}
.newsletter input{width:100%;padding:15px 16px;border:1px solid var(--line-dark);background:rgba(255,255,255,.05);
  color:#fff;margin:12px 0;font-size:1rem;border-radius:8px;transition:border-color .35s var(--ease)}
.newsletter input:focus{outline:none;border-color:var(--lime)}
.newsletter input::placeholder{color:rgba(255,255,255,.45)}
.newsletter .btn{width:100%;justify-content:center}
.legal .wrap{display:flex;justify-content:space-between;gap:16px;padding:24px 32px;font-size:.86rem;
  flex-wrap:wrap;color:rgba(255,255,255,.5)}
.legal a{display:inline;color:rgba(255,255,255,.5);transition:color .35s var(--ease)}
.legal a:hover{color:#fff}

/* ---- Tablet: keep nav from crowding before the mobile breakpoint ---- */
@media(max-width:1080px) and (min-width:901px){
  .nav{gap:18px}
  nav.primary{gap:20px}
  .navphone{display:none}
}

@media(max-width:900px){
  body{font-size:18px}
  .wrap{padding:0 22px}
  .section{padding:72px 0}
  nav.primary,.navphone{display:none}
  .nav{gap:14px;padding:14px 22px}
  .nav .btn{padding:14px 20px}
  .hero .wrap{padding:88px 22px 76px}
  .hero h1{font-size:2.3rem}
  .hero p.sub{font-size:1.15rem}
  .hero .herotrust{gap:10px 20px}
  .hero .aurora span{filter:blur(50px)}
  .kpis .grid{grid-template-columns:1fr 1fr}
  .kpi{border-right:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);padding:40px 24px}
  .kpi:first-child,.kpi:nth-child(2){padding-left:0}
  .kpi:nth-child(2n){border-right:0}
  .kpi .num{font-size:2rem;min-height:2rem}
  .kpi.accent::before{top:22px}
  .arow{grid-template-columns:48px 1fr;gap:18px}
  .arow .go{grid-column:1/-1;margin-top:6px}
  .foerder .grid{grid-template-columns:1fr 1fr}
  .quote blockquote{font-size:1.5rem}
  .logos{grid-template-columns:1fr 1fr}
  .badges{flex-direction:column}
  .badge{border-right:0;border-bottom:1px solid var(--line-dark);justify-content:flex-start}
  .badge:last-child{border-bottom:0}
  .contact .wrap{grid-template-columns:1fr;gap:40px}
  footer.site .top .wrap{grid-template-columns:1fr 1fr}
}

@media(max-width:430px){
  .nav .btn{padding:13px 16px;font-size:.96rem}
  .hero h1{font-size:2.05rem}
}

/* ---- MANDATORY: respect reduced motion ---- */
@media (prefers-reduced-motion: reduce){
  *{animation:none!important;transition:none!important}
  .reveal{opacity:1!important;transform:none!important;filter:none!important}
  .hero h1 .accent::after{transform:scaleX(1)!important}
  .hero .eyebrow,.hero h1,.hero p.sub,.hero .cta,.hero .herotrust,.hero .callline{opacity:1!important;transform:none!important}
}

/* ---- Mobile navigation (hamburger + accordion drawer) ---- */
.mobile-actions{display:none;align-items:center;gap:8px;flex:none}
.m-call,.navtoggle{display:inline-flex;align-items:center;justify-content:center;
  width:48px;height:48px;border:1.5px solid var(--line);background:#fff;border-radius:10px;
  color:var(--teal);cursor:pointer;transition:border-color .35s var(--ease),color .35s var(--ease)}
.m-call:hover,.navtoggle:hover{border-color:var(--teal)}
.m-call .ic,.navtoggle .ic{width:1.45em;height:1.45em}
.mobilemenu{position:fixed;inset:0;z-index:50;background:#fff;display:flex;flex-direction:column;
  padding:18px 22px 28px;overflow-y:auto;
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .26s var(--ease),transform .26s var(--ease),visibility .26s}
.mobilemenu.open{opacity:1;visibility:visible;transform:none}
body.menu-open{overflow:hidden}
.mm-top{display:flex;align-items:center;justify-content:space-between;
  padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:8px}
.mm-top .mm-brand{font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  font-size:.82rem;color:var(--muted)}
.mm-close{width:48px;height:48px;border:1.5px solid var(--line);background:#fff;border-radius:10px;
  color:var(--teal);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.mm-close .ic{width:1.45em;height:1.45em}
.mm-nav .m-group{border-bottom:1px solid var(--line)}
.m-group>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:16px 4px;font-weight:700;font-size:1.12rem;color:var(--ink);cursor:pointer;min-height:56px}
.m-group>summary::-webkit-details-marker{display:none}
.m-group>summary .chev{width:1.05em;height:1.05em;stroke:currentColor;stroke-width:2.2;fill:none;
  stroke-linecap:round;stroke-linejoin:round;color:var(--muted);transition:transform .22s var(--ease);flex:none}
.m-group[open]>summary{color:var(--magenta)}
.m-group[open]>summary .chev{transform:rotate(180deg);color:var(--magenta)}
.m-sub{padding:0 4px 14px}
.m-sub a{display:block;padding:11px 6px;color:var(--muted);font-size:1.02rem;border-radius:8px}
.m-sub a:hover{color:var(--magenta);background:var(--bg-soft)}
.m-foot{margin-top:22px;display:flex;flex-direction:column;gap:14px}
.m-foot .btn{justify-content:center}
.m-foot .callrow{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  color:var(--teal);font-weight:700;font-size:1.1rem;min-height:48px}
.m-foot .callrow .ic{width:1.2em;height:1.2em}
@media(max-width:900px){
  .mobile-actions{display:inline-flex}
  .nav>.btn-line{display:none}
}
@media(min-width:901px){
  .mobilemenu{display:none}
}

/* ============================================================
   WordPress integration — admin bar offset + inner pages
   ============================================================ */
/* keep the sticky header clear of the wp admin bar */
body.admin-bar header.site{top:32px}
@media screen and (max-width:782px){
  body.admin-bar header.site{top:46px}
  body.admin-bar .mobilemenu{top:46px}
}

/* ---- Inner page: title band ---- */
.page-hero{position:relative;overflow:hidden;background:var(--teal);color:#fff;isolation:isolate}
.page-hero::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(70% 130% at 82% -10%,rgba(12,79,99,.9),transparent 70%),
             radial-gradient(45% 90% at 4% 120%,rgba(231,0,76,.14),transparent 70%)}
.page-hero .wrap{position:relative;z-index:1;padding:82px 32px 66px}
.page-hero .crumbs{font-size:.9rem;color:rgba(255,255,255,.6);margin-bottom:14px;
  display:flex;flex-wrap:wrap;align-items:center;gap:2px 0}
.page-hero .crumbs a{color:rgba(255,255,255,.75);border-bottom:1px solid transparent;transition:border-color .3s var(--ease)}
.page-hero .crumbs a:hover{border-color:rgba(255,255,255,.6)}
.page-hero .crumbs .sep{margin:0 .55em;opacity:.55}
.page-hero .crumbs [aria-current="page"]{color:rgba(255,255,255,.9)}
.page-hero h1{font-size:2.7rem;margin:0;max-width:24ch;letter-spacing:-.02em;line-height:1.1}
@media(max-width:900px){.page-hero .wrap{padding:60px 22px 48px}.page-hero h1{font-size:2rem}}

/* ---- Inner page: content typography (crawled Gutenberg output) ---- */
.entry{padding:0 0 96px}                 /* hero sits flush under the site header */
.entry>.wrap{padding-top:60px}           /* breathing room BELOW the teal hero band */
.entry-content{max-width:76ch;margin:0 auto}
.entry-content>*{margin:0 0 1.15em}
.entry-content>*:first-child{margin-top:0}
.entry-content h2{font-size:1.9rem;margin:1.7em 0 .5em;letter-spacing:-.01em}
.entry-content h3{font-size:1.42rem;margin:1.5em 0 .45em}
.entry-content h4{font-size:1.16rem;margin:1.4em 0 .4em}
.entry-content h2:first-child,.entry-content h3:first-child{margin-top:0}
.entry-content p{color:var(--ink);line-height:1.72}
.entry-content a{color:var(--teal);font-weight:600;text-decoration:underline;text-underline-offset:2px;
  text-decoration-color:rgba(6,56,74,.35);transition:color .3s var(--ease),text-decoration-color .3s var(--ease)}
.entry-content a:hover{color:var(--magenta);text-decoration-color:var(--magenta)}
.entry-content ul,.entry-content ol{padding-left:1.3em}
.entry-content li{margin:.4em 0;line-height:1.65}
.entry-content ul li::marker{color:var(--magenta)}
.entry-content ol li::marker{color:var(--teal);font-weight:700}
.entry-content img{border-radius:12px;height:auto}
.entry-content figure{margin:1.6em 0}
.entry-content figcaption{font-size:.9rem;color:var(--muted);margin-top:.6em;text-align:center}
.entry-content blockquote{margin:1.6em 0;padding:6px 0 6px 26px;border-left:4px solid var(--magenta);
  font-size:1.2rem;line-height:1.5;color:var(--ink);font-style:italic}
.entry-content blockquote p:last-child{margin-bottom:0}
.entry-content hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}
.entry-content table{width:100%;border-collapse:collapse;font-size:1rem;display:block;overflow-x:auto}
.entry-content th,.entry-content td{border:1px solid var(--line);padding:12px 16px;text-align:left;vertical-align:top}
.entry-content th{background:var(--bg-soft);font-weight:700}
.entry-content code{background:var(--bg-soft);padding:.15em .4em;border-radius:5px;font-size:.92em}
.entry-content pre{background:var(--bg-soft);padding:18px 20px;border-radius:10px;overflow-x:auto}
.entry-content .wp-block-button__link{display:inline-flex;align-items:center;background:var(--teal);color:#fff;
  padding:14px 26px;border-radius:8px;font-weight:700;text-decoration:none;transition:background .3s var(--ease),transform .3s var(--ease)}
.entry-content .wp-block-button__link:hover{background:#0a4257;transform:translateY(-2px);color:#fff}
.wp-caption{max-width:100%}
.alignleft{float:left;margin:0 1.6em 1em 0}
.alignright{float:right;margin:0 0 1em 1.6em}
.aligncenter{margin-left:auto;margin-right:auto;display:block}

/* ---- Post/archive lists ---- */
.postcards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
@media(max-width:900px){.postcards{grid-template-columns:1fr}}
.postcard{display:flex;flex-direction:column;padding:28px 26px;background:#fff;border:1px solid var(--line);
  border-radius:14px;transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s var(--ease)}
.postcard:hover{transform:translateY(-5px);box-shadow:var(--shadow-pop);border-color:#d3dccd}
.postcard h3{margin:0 0 10px;font-size:1.25rem}
.postcard h3 a:hover{color:var(--magenta)}
.postcard .meta{font-size:.86rem;color:var(--muted);margin-bottom:8px}
.postcard p{color:var(--muted);font-size:1rem;margin:0 0 16px}
.postcard .go{margin-top:auto;color:var(--teal);font-weight:700;display:inline-flex;align-items:center;gap:8px}
.pagination{display:flex;gap:8px;flex-wrap:wrap;margin-top:46px}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:46px;height:46px;
  padding:0 12px;border:1px solid var(--line);border-radius:8px;font-weight:700;color:var(--teal);transition:background .3s var(--ease),color .3s var(--ease)}
.pagination .page-numbers.current,.pagination .page-numbers:hover{background:var(--teal);color:#fff;border-color:var(--teal)}

/* ---- Team grid (B1) — photo cards, reuses the lifted-card language ---- */
.team-grid{list-style:none;margin:8px 0 0;padding:0;display:grid;
  grid-template-columns:repeat(3,1fr);gap:24px}
.team-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-radius:14px;overflow:hidden;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s var(--ease)}
.team-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-pop);border-color:#d3dccd}
.team-card .tc-photo{aspect-ratio:5/6;background:var(--bg-soft);overflow:hidden}
.team-card .tc-photo img{width:100%;height:100%;object-fit:cover;object-position:center top;border-radius:0;display:block;
  transition:transform .6s var(--ease)}
.team-card:hover .tc-photo img{transform:scale(1.04)}
.team-card .tc-body{padding:22px 24px 24px;display:flex;flex-direction:column;flex:1}
.team-card h3{margin:0 0 4px;font-size:1.24rem;letter-spacing:-.01em}
.team-card .tc-role{margin:0 0 16px;color:var(--muted);font-size:.98rem;line-height:1.45}
.team-card .tc-contact{margin-top:auto;display:flex;flex-direction:column;gap:8px;
  padding-top:16px;border-top:1px solid var(--line)}
.team-card .tc-tel{font-weight:700;color:var(--teal);font-size:1.05rem;letter-spacing:-.01em;
  text-decoration:none;transition:color .3s var(--ease)}
.team-card .tc-tel:hover{color:var(--magenta)}
.team-card .tc-mail{color:var(--muted);font-weight:700;font-size:.94rem;text-decoration:underline;
  text-underline-offset:2px;text-decoration-color:rgba(6,56,74,.3);transition:color .3s var(--ease)}
.team-card .tc-mail:hover{color:var(--magenta)}
/* Exactly four members read best as a balanced 2×2 rather than 3 + 1 orphan */
.team-grid:has(li:nth-child(4):last-child){grid-template-columns:repeat(2,1fr)}
@media(max-width:900px){.team-grid{grid-template-columns:1fr 1fr;gap:18px}}
@media(max-width:560px){.team-grid{grid-template-columns:1fr}}

/* ---- Referenzobjekte grid (B2) — thumbnail + title + spec + link ---- */
.ref-grid{list-style:none;margin:8px 0 0;padding:0;display:grid;
  grid-template-columns:repeat(3,1fr);gap:24px}
.ref-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-radius:14px;overflow:hidden;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s var(--ease)}
.ref-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-pop);border-color:#d3dccd}
.ref-card .rc-media{display:block;aspect-ratio:16/10;background:var(--bg-soft);overflow:hidden}
.ref-card .rc-media img{width:100%;height:100%;object-fit:cover;border-radius:0;display:block;
  transition:transform .6s var(--ease)}
.ref-card:hover .rc-media img{transform:scale(1.04)}
.ref-card .rc-body{padding:22px 24px 24px;display:flex;flex-direction:column;flex:1}
.ref-card h3{margin:0 0 8px;font-size:1.2rem;line-height:1.25;letter-spacing:-.01em}
.ref-card h3 a{color:var(--ink);text-decoration:none;transition:color .3s var(--ease)}
.ref-card h3 a:hover{color:var(--magenta)}
.ref-card .rc-body p{margin:0 0 18px;color:var(--muted);font-size:.98rem;line-height:1.5}
.ref-card .rc-go{margin-top:auto;color:var(--teal);font-weight:700;font-size:.98rem;
  text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:color .3s var(--ease)}
.ref-card .rc-go:hover{color:var(--magenta)}
@media(max-width:900px){.ref-grid{grid-template-columns:1fr 1fr;gap:18px}}
@media(max-width:560px){.ref-grid{grid-template-columns:1fr}}

/* ---- Search form ---- */
.searchbox{display:flex;gap:10px;margin-top:34px;max-width:520px}
.searchbox input[type=search]{flex:1;padding:14px 16px;border:1.5px solid var(--line);border-radius:8px;font-size:1rem;color:var(--ink)}
.searchbox input[type=search]:focus{outline:none;border-color:var(--teal)}

/* ---- 404 ---- */
.notfound .wrap{padding:110px 32px;text-align:center}
.notfound h1{font-size:3rem;margin:0 0 .3em}
.notfound .searchbox{margin-left:auto;margin-right:auto}

/* ============================================================
   Curated inner-page components (build model A — authored content)
   Prose keeps a readable measure; grids/bands span the full wrap.
   ============================================================ */
/* Left-align content with the hero title; readable prose column, wider cards,
   full-width grids/bands. (margin-left:0 -> no floaty centered column.) */
.entry-content{max-width:none;margin:0}
.entry-content>*{margin-left:0;margin-right:0}
.entry-content>p,.entry-content>h2,.entry-content>h3,.entry-content>h4,
.entry-content>ul,.entry-content>ol,.entry-content>blockquote,.entry-content>hr,
.entry-content>.lead-p,.entry-content>.section-lead{max-width:var(--measure)}
.entry-content>.callout,.entry-content>.contact-person,.entry-content>.downloads,
.entry-content>figure,.entry-content>.table-wrap,.entry-content>table{max-width:860px}
.entry-content>.team-grid,.entry-content>.ref-grid,.entry-content>.event-list,
.entry-content>.cta-band,.entry-content>.postcards,.entry-content>.info-grid,
.entry-content>.logo-strip,.entry-content>.media-full{max-width:100%}
.entry-content>.section-lead{color:var(--muted)}

/* Lead paragraph — larger intro under the title */
.entry-content .lead-p{font-size:1.24rem;line-height:1.6;color:var(--muted)}

/* Callout / info box — "kurz erklärt", notes, highlighted asides */
.callout{background:var(--bg-soft);border:1px solid var(--line);border-left:4px solid var(--teal);
  border-radius:12px;padding:24px 28px}
.callout.accent{border-left-color:var(--magenta)}
.callout>*:first-child{margin-top:0}.callout>*:last-child{margin-bottom:0}
.callout h3,.callout h4{font-size:1.18rem;margin:0 0 .5em}

/* Contact-person card — recurring "Ihre Kontaktperson" block */
.contact-person{display:flex;flex-direction:row-reverse;gap:30px;align-items:center;background:#fff;border:1px solid var(--line);
  border-radius:16px;padding:32px 36px;box-shadow:var(--shadow-lift)}
.contact-person .cp-photo{width:148px;height:148px;border-radius:50%;object-fit:cover;flex:none;background:var(--bg-soft)}
.contact-person .cp-body{display:flex;flex-direction:column;gap:3px;min-width:0}
.contact-person .cp-name{font-weight:700;font-size:1.35rem;letter-spacing:-.01em}
.contact-person .cp-role{color:var(--muted);font-size:.98rem;margin-bottom:8px}
.contact-person .cp-links{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:2px}
.contact-person a{font-weight:700;color:var(--teal);text-decoration:none}
.contact-person a:hover{color:var(--magenta)}
.contact-person .cp-tel{font-size:1.12rem}
@media(max-width:560px){.contact-person{flex-direction:column;text-align:center;align-items:center}
  .contact-person .cp-links{justify-content:center}}

/* Downloads / external-link list */
.downloads{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.downloads li{margin:0}
.downloads a{display:flex;align-items:center;gap:16px;padding:15px 20px;background:#fff;border:1px solid var(--line);
  border-radius:10px;color:var(--ink);font-weight:600;text-decoration:none;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s var(--ease),color .3s var(--ease)}
.downloads a:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift);border-color:#d3dccd;color:var(--teal)}
.downloads a::before{content:"PDF";font-size:.68rem;font-weight:800;letter-spacing:.04em;color:#fff;background:var(--magenta);
  padding:6px 8px;border-radius:6px;flex:none;line-height:1}
.downloads a[data-type="link"]::before{content:"↗";background:var(--teal);font-size:.95rem;padding:5px 9px}
.downloads a[data-type="doc"]::before{content:"DOC";background:var(--teal-2)}
.downloads a .dl-arrow{margin-left:auto;color:var(--muted);flex:none}

/* CTA band — "Beratungstermin vereinbaren" etc. */
.cta-band{background:var(--teal);color:#fff;border-radius:16px;padding:44px 48px;position:relative;overflow:hidden;
  display:flex;flex-wrap:wrap;gap:26px;align-items:center;justify-content:space-between;isolation:isolate}
.cta-band::before{content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(60% 120% at 85% -10%,rgba(12,79,99,.9),transparent 70%),
             radial-gradient(45% 90% at 0 120%,rgba(231,0,76,.18),transparent 70%)}
.cta-band .cta-text{max-width:52ch}
.cta-band h2,.cta-band h3{color:#fff;margin:0 0 .3em;font-size:1.65rem;letter-spacing:-.01em}
.cta-band p{color:rgba(255,255,255,.82);margin:0;font-size:1.05rem}
.cta-band .btn{flex:none}
@media(max-width:560px){.cta-band{padding:32px 26px}}

/* Event list — date chip + title + teaser */
.event-list{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.event-list li{margin:0}
.event-card{display:grid;grid-template-columns:92px 1fr auto;gap:24px;align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 26px;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s var(--ease)}
.event-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift);border-color:#d3dccd}
.event-card .ev-date{display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:var(--bg-soft);border-radius:10px;padding:12px 4px;color:var(--teal);line-height:1;text-align:center}
.event-card .ev-date .d{font-size:1.7rem;font-weight:800}
.event-card .ev-date .m{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-top:5px}
.event-card .ev-date .y{font-size:.74rem;color:var(--muted);margin-top:3px}
.event-card .ev-body{min-width:0}
.event-card h3{margin:0 0 4px;font-size:1.18rem}
.event-card h3 a:hover{color:var(--magenta)}
.event-card p{margin:0;color:var(--muted);font-size:.97rem}
.event-card .ev-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.event-card .ev-tags span{font-size:.71rem;font-weight:700;color:var(--teal);background:var(--bg-soft);
  padding:3px 9px;border-radius:20px}
.event-card .ev-go{color:var(--teal);font-weight:700;white-space:nowrap}
.event-card .ev-go:hover{color:var(--magenta)}
@media(max-width:640px){.event-card{grid-template-columns:64px 1fr;gap:16px;padding:18px 20px}
  .event-card .ev-go{grid-column:2;justify-self:start}}

/* Info / feature card grid */
.info-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.info-grid.cols-2{grid-template-columns:repeat(2,1fr)}
.info-grid li{margin:0}
.info-card{height:100%;background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px 26px;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s var(--ease)}
.info-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-pop);border-color:#d3dccd}
.info-card h3{margin:0 0 8px;font-size:1.18rem}
.info-card p{margin:0;color:var(--muted);font-size:1rem}
.info-card p+p{margin-top:.7em}
@media(max-width:900px){.info-grid,.info-grid.cols-2{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.info-grid,.info-grid.cols-2{grid-template-columns:1fr}}

/* Partner / sponsor logo strip */
.logo-strip{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.logo-strip li{margin:0;background:#fff;min-height:112px;display:flex;align-items:center;justify-content:center;padding:22px}
.logo-strip img{max-height:60px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.75;
  transition:filter .4s var(--ease),opacity .4s var(--ease)}
.logo-strip li:hover img{filter:none;opacity:1}
/* A lone program logo (e.g. erneuerbar heizen) shouldn't stretch across an
   empty 4-up partner strip — show it compact and in full colour */
.logo-strip:has(li:only-child){display:inline-grid;grid-template-columns:auto;max-width:100%}
.logo-strip li:only-child{padding:26px 44px}
.logo-strip li:only-child img{filter:none;opacity:1;max-height:66px}
@media(max-width:700px){.logo-strip:not(:has(li:only-child)){grid-template-columns:1fr 1fr}}

/* Checklist — green ticks */
.entry-content ul.checklist{list-style:none;padding-left:0}
.entry-content ul.checklist li{position:relative;padding-left:32px;margin:.55em 0}
.entry-content ul.checklist li::marker{content:none}
.entry-content ul.checklist li::before{content:"✓";position:absolute;left:0;top:0;
  width:22px;height:22px;border-radius:50%;background:var(--green);color:#fff;
  font-size:.8rem;font-weight:800;display:flex;align-items:center;justify-content:center}

/* Buttons inside content: .entry-content a (0,1,1) would otherwise repaint the
   button label teal-on-teal — restore each variant's own colour + kill underline. */
.entry-content a.btn{text-decoration:none}
.entry-content a.btn-solid,.entry-content a.btn-solid:hover,
.entry-content a.btn-light,.entry-content a.btn-light:hover{color:#fff}
.entry-content a.btn-white,.entry-content a.btn-white:hover,
.entry-content a.btn-line{color:var(--teal)}
.entry-content a.btn-line:hover{color:#fff}
.cta-band a.btn-white,.entry-content .cta-band a.btn-white:hover{color:var(--teal)}

/* Full-width lead figure at the top of a content page */
.entry-content .media-full{margin:0 0 1.4em}
.entry-content .media-full img{width:100%;border-radius:14px;display:block}

/* Accessibility helpers */
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:100000;background:#fff;color:var(--teal);
  padding:12px 18px;border-radius:0 0 8px 0;font-weight:700}
.skip-link:focus{left:0}
main#content{display:block}

/* ============================================================
   Polish patch — logos, nav/footer icon, heading wrap, mobile footer
   ============================================================ */

/* Small external-link icon — replaces the ↗ emoji glyph in nav & footer */
.ic-ext{width:.72em;height:.72em;vertical-align:-.02em;opacity:.85;stroke-width:2.2;margin-left:.12em}

/* Standalone/link-wrapped logos & badges in content must NOT stretch to the
   full column. `.media-full` is meant for full-bleed lead photos; logos were
   wrongly placed there (Minergie-Member, WP-Cockpit) and the Klimawoche label
   is a self-linked image in a paragraph — all rendered column-wide. A linked
   standalone image is a reliable "this is a logo/badge" signal, so cap those. */
.entry-content .media-full>a>img,
.entry-content p>a:only-child>img{
  width:auto;max-width:min(100%,320px);height:auto;display:block;margin-inline:0}

/* Long German compound headings must wrap rather than overflow (mobile) */
.hero h1,.page-hero h1,.entry-content h2,.entry-content h3,.entry-content h4,
.event-card h3,.postcard h3,.info-card h3{overflow-wrap:break-word}
.page-hero h1,.entry-content h2,.entry-content h3,.entry-content h4{hyphens:auto}

/* Prose measure adapts to the viewport: comfortable ~68 chars on small/mid
   screens, widening on larger viewports so the text column fills more of the
   available width instead of leaving a large empty right gutter. */
@media(min-width:1024px){:root{--measure:76ch}}
@media(min-width:1280px){:root{--measure:84ch}}

/* Mobile: footer collapsed to a single column (2-col grid overflowed at phone
   width, clipping the right column). Also let long link words break. */
@media(max-width:560px){
  footer.site .top .wrap{grid-template-columns:1fr;gap:30px;padding:56px 22px 44px}
  footer.site a,footer .brandcol p,.legal a{overflow-wrap:break-word}
  .legal .wrap{padding:20px 22px}
}