/* RESUMA – Stile der Relaunch-Seiten (erzeugt, nicht von Hand ändern) */
/* Schriften liegen auf dem eigenen Webspace (Backlog 11).
   Vorher wurden Sora, Inter und Space Grotesk bei jedem Seitenaufruf von
   fonts.googleapis.com geholt - dabei erfuhr Google die IP-Adresse jedes
   Besuchers, noch bevor er dem Tracking zustimmen konnte. Jetzt kommen sie
   aus /assets/schriften/. Beide Schriften stehen unter der SIL Open Font
   License, die das ausdruecklich erlaubt.

   Geladen sind nur die lateinischen Zeichensaetze (latin und latin-ext);
   Kyrillisch, Griechisch und Vietnamesisch braucht die Seite nicht.
   font-display:swap zeigt den Text sofort in der Ersatzschrift an. */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/schriften/inter-400-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:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/schriften/inter-400-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:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/schriften/inter-500-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:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/schriften/inter-500-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:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/schriften/inter-600-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:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/schriften/inter-600-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:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/schriften/inter-700-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:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/schriften/inter-700-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:'Sora';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/schriften/sora-600-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:'Sora';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/schriften/sora-600-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:'Sora';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/schriften/sora-700-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:'Sora';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/schriften/sora-700-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:'Sora';font-style:normal;font-weight:800;font-display:swap;src:url('/assets/schriften/sora-800-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:'Sora';font-style:normal;font-weight:800;font-display:swap;src:url('/assets/schriften/sora-800-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:'Space Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/schriften/space-grotesk-500-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:'Space Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/schriften/space-grotesk-500-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:'Space Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/schriften/space-grotesk-600-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:'Space Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/schriften/space-grotesk-600-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:'Space Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/schriften/space-grotesk-700-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:'Space Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/schriften/space-grotesk-700-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{--navy:#00406F;--navy-dark:#062b47;--gold:#A58B3F;--gold-dark:#8a7434;--gruen:#2E6B3F;--gruen-dark:#245231;
--ink:#1c2b3a;--muted:#5a6b7a;--line:#e3e8ee;--soft:#f4f6f9;--cream:#faf7f1;--radius:14px;
--shadow:0 6px 24px rgba(6,43,71,.08)}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Inter','Segoe UI',system-ui,sans-serif;color:var(--ink);background:#fff;line-height:1.6;font-size:16.5px}
h1,h2,h3,h4,.knopf{font-family:'Sora','Segoe UI',sans-serif}
img{max-width:100%;display:block}
a{color:var(--navy);text-decoration:none}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
/* Entwurfs-Leiste */
.entwurf{position:sticky;top:0;z-index:99;background:#FFF3CD;border-bottom:2px solid #E4C766;padding:8px 0;font-size:13px}
.entwurf .wrap{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center}
.entwurf b{color:#7a5c00}
.entwurf a{font-weight:600;color:#7a5c00;text-decoration:underline}
.entwurf a.hier{background:#7a5c00;color:#fff;text-decoration:none;padding:1px 8px;border-radius:99px}
/* ===== Kopf und Fuß 1:1 von der Live-Website ===== */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:'Sora';font-weight:700;font-size:15.5px;padding:16px 30px;border-radius:8px;transition:background .15s,transform .15s;cursor:pointer;}
.btn-gold{background:var(--gold);color:#fff;}
.btn-gold:hover{background:var(--gold-dark);transform:translateY(-1px);}
.ar{display:inline-block;width:1.2em;height:.74em;margin-left:.45em;vertical-align:middle;flex:none;transition:transform .15s ease;}
.btn:hover .ar,.tlink:hover .ar{transform:translateX(3px);}
.nav{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:78px;}
.brand img{height:72px;display:block;}
.navlinks{display:flex;gap:28px;align-items:center;}
.navlinks a.l{font-size:15px;font-weight:600;color:var(--ink);}
.navlinks a.l:hover{color:var(--navy);}
.navlinks .btn{padding:11px 20px;font-size:14.5px;}
.navcta{display:none;}
.navtoggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:11px;background:none;border:none;cursor:pointer;flex:none;}
.navtoggle span{display:block;height:2.5px;width:100%;background:var(--navy);border-radius:2px;transition:transform .25s,opacity .2s;}
.navtoggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.navtoggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.navtoggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.sitefoot{border-top:1px solid var(--line);padding:54px 0 30px;}
.fgrid{display:flex;justify-content:space-between;flex-wrap:wrap;gap:28px;}
.fcol h4{font-family:'Sora';color:var(--navy);font-size:14px;margin:0 0 10px;}
.fcol h4 a{color:inherit;font:inherit;line-height:inherit;display:inline;}
.fcol h4 a:hover{color:var(--gold);}
.fcol p,.fcol a{font-size:14px;line-height:2;color:#7d8893;display:block;}
.fcol a:hover{color:var(--navy);}
.fbot{margin-top:34px;padding-top:18px;border-top:1px solid var(--line);font-size:12.5px;color:#9aa6b1;text-align:center;}
.cta-card .btn{margin-top:auto;align-self:center;}
@media(max-width:900px){.nav .wrap{justify-content:flex-start;gap:10px;}.navtoggle{display:flex;order:-1;}.navcta{display:inline-flex;order:1;margin-left:auto;padding:9px 13px;font-size:12.5px;white-space:nowrap;}.navlinks{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:#fff;border-top:1px solid var(--line);box-shadow:0 16px 30px rgba(0,40,80,.13);padding:4px 0 14px;max-height:0;overflow:hidden;opacity:0;visibility:hidden;transition:max-height .3s ease,opacity .22s,visibility .3s;}.navlinks.open{max-height:84vh;overflow:auto;opacity:1;visibility:visible;}.navlinks a.l{display:block;padding:15px 26px;font-size:16px;border-top:1px solid var(--line);}.navlinks .btn{display:none;}}
@media(max-width:600px){
  .nav .wrap{height:60px;padding:0 16px;}
  .brand img{height:44px;}
  .fgrid{flex-direction:column;gap:24px;}
}
.nav{position:sticky;top:0;z-index:60}
/* ===== Reifegrad-Pyramide 1:1 von der Live-Startseite ===== */
.pyr{max-width:920px;margin:0 auto;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;padding:26px 18px;}
.rsm-pyr .apex{width:40%;height:42px;margin:0 auto 4px;background:#A58B3F;clip-path:polygon(50% 0,100% 100%,0 100%);}
.rsm-pyr .band{position:relative;min-height:118px;margin-bottom:4px;display:flex;align-items:center;color:#fff;}
.rsm-pyr .b5{background:#A58B3F;color:#002B4D;clip-path:polygon(30% 0,70% 0,76% 100%,24% 100%);padding:0 31%;}
.rsm-pyr .b4{background:#00406F;clip-path:polygon(24% 0,76% 0,82% 100%,18% 100%);padding:0 25%;}
.rsm-pyr .b3{background:#154E76;clip-path:polygon(18% 0,82% 0,88% 100%,12% 100%);padding:0 19%;}
.rsm-pyr .b2{background:#2C597C;clip-path:polygon(12% 0,88% 0,94% 100%,6% 100%);padding:0 13%;}
.rsm-pyr .b1{background:#3E607D;clip-path:polygon(6% 0,94% 0,100% 100%,0 100%);padding:0 7%;}
.rsm-pyr .c{display:flex;align-items:center;gap:14px;width:100%;text-align:left;}
.rsm-pyr .n{font-weight:800;font-size:clamp(30px,4.5vw,48px);line-height:1;color:#C9AE63;flex:0 0 auto;min-width:36px;}
.rsm-pyr .b5 .n{color:#002B4D;}
.rsm-pyr .t{font-family:'Sora';font-weight:800;font-size:clamp(14px,2vw,20px);letter-spacing:.06em;text-transform:uppercase;margin:0 0 3px;color:inherit;}
.rsm-pyr .d{font-weight:400;font-size:clamp(11px,1.5vw,14px);line-height:1.4;opacity:.92;margin:0;}
.pyr.go .b1{animation:pyr-build 1.2s 0s backwards;}
.pyr.go .b2{animation:pyr-build 1.2s .6s backwards;}
.pyr.go .b3{animation:pyr-build 1.2s 1.2s backwards;}
.pyr.go .b4{animation:pyr-build 1.2s 1.8s backwards;}
.pyr.go .b5{animation:pyr-build 1.2s 2.4s backwards;}
.pyr.go .apex{animation:pyr-build 1.2s 3s backwards;}
.pyr.safe .band,.pyr.safe .apex{opacity:1!important;transform:none!important;animation:none!important;}
.pyr');if(!p)return;function go(){p.classList.add('go');setTimeout(function(){p.classList.add('safe');}
@keyframes rsm-marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes pyr-build{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
@media(max-width:680px){.rsm-pyr .b5{padding:0 24%}.rsm-pyr .b4{padding:0 19%}.rsm-pyr .b3{padding:0 14%}.rsm-pyr .b2{padding:0 10%}.rsm-pyr .b1{padding:0 6%}}
@media(max-width:680px){.rsm-pyr .apex{display:none;}.rsm-pyr .band{min-height:auto;margin-bottom:8px;}.rsm-pyr .b1,.rsm-pyr .b2,.rsm-pyr .b3,.rsm-pyr .b4,.rsm-pyr .b5{clip-path:none;border-radius:10px;padding:15px 18px;}.rsm-pyr .n{font-size:30px;min-width:30px;}}
@media(prefers-reduced-motion:reduce){.marquee .track{animation:none;}}
@media(max-width:600px){.marquee .logo{width:150px;height:80px;margin-right:14px;padding:13px 16px;}.marquee .logo .wm{font-size:14px;}}
/* Knopf */
.knopf{display:inline-flex;align-items:center;gap:9px;background:var(--gold);color:#fff!important;font-weight:700;
padding:12px 22px;border-radius:10px;font-size:15px;transition:.15s}
.knopf:hover{background:var(--gold-dark)}
.knopf.gold{background:var(--gold)}.knopf.gold:hover{background:var(--gold-dark)}
.knopf .pf{font-size:17px;line-height:1}
.knopf svg{width:22px;height:22px;flex:none;--ak:#fff}
.gruenbox svg{--ak:#fff}
.schritt svg{--ak:currentColor}
.g.schimmer,.gsch{background-image:linear-gradient(105deg,var(--gold-dark) 0 38%,#C7A64A 45%,#FBF2D6 50%,#C7A64A 55%,var(--gold-dark) 62% 100%);background-size:250% 100%;background-repeat:no-repeat;background-position:0% 0;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:gold-shine 5s linear infinite}
.band .gsch{background-image:linear-gradient(105deg,#e8c96a 0 38%,#f3dc96 45%,#fffbe9 50%,#f3dc96 55%,#e8c96a 62% 100%)}
.ic-riesig{width:130px;height:130px;flex:none;color:var(--navy)}
.bildfuellend{height:100%;display:flex}
.bildfuellend img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow);background:#fff}
.auslauf-links{-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,.12) 10%,rgba(0,0,0,.62) 26%,rgba(0,0,0,.92) 38%,#000 48%);mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,.12) 10%,rgba(0,0,0,.62) 26%,rgba(0,0,0,.92) 38%,#000 48%);box-shadow:none}
.foto-auslauf{-webkit-mask-image:linear-gradient(to left,rgba(0,0,0,0) 0%,rgba(0,0,0,.12) 10%,rgba(0,0,0,.62) 26%,rgba(0,0,0,.92) 38%,#000 48%);mask-image:linear-gradient(to left,rgba(0,0,0,0) 0%,rgba(0,0,0,.12) 10%,rgba(0,0,0,.62) 26%,rgba(0,0,0,.92) 38%,#000 48%);box-shadow:none}
.schritt{display:flex;flex-direction:column}
.schritt .kopf{display:flex;align-items:center;gap:12px}
.schritt .kopf b{margin:0}
.schritt .sk{display:flex;gap:12px;align-items:center;margin-top:10px;flex:1}
.schritt .sk svg{flex:none}
.schritt .sk p{margin:0}
.gold3 svg{color:var(--gold)}
.fussband .p svg{--ak:#e8c96a}
.knopf small{display:block;font-family:Inter;font-weight:400;font-size:12.5px;opacity:.92}
/* Bausteine */
section{padding:56px 0}
.oben{color:var(--gold);font-weight:700;letter-spacing:2px;font-size:13px;text-transform:uppercase;margin-bottom:10px}
h1{color:var(--navy);font-size:clamp(30px,4.6vw,46px);line-height:1.14;margin-bottom:14px}
h1 .g,h2 .g{color:var(--gold)}
h2{color:var(--navy);font-size:clamp(24px,3.2vw,32px);line-height:1.2;margin-bottom:12px}
h3{color:var(--navy);font-size:19px;margin-bottom:10px}
p{margin-bottom:13px}
.blass{color:var(--muted)}
.mittig{text-align:center}
.mittig h2{margin-left:auto;margin-right:auto}
.linie{width:64px;height:3px;background:var(--gold);border-radius:2px;margin:0 auto 30px}
.zweispaltig{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
.foto{border-radius:var(--radius);box-shadow:var(--shadow);width:100%;object-fit:cover}
.soft{background:var(--soft)}
.cream{background:linear-gradient(105deg,var(--cream) 0%,#fff 62%)}
/* ===== 1:1 von der Live-Startseite übernommen (Hero + Laufband) ===== */
.hero{padding:130px 0 90px;position:relative;}
.hero>.wrap{position:relative;z-index:1;}
.hero-photo{position:absolute;inset:0;z-index:0;pointer-events:none;background:url(/wp-content/uploads/2026/06/resuma-hero-duotone.webp) center 22%/cover no-repeat;opacity:.22;-webkit-mask-image:radial-gradient(150% 140% at 50% 6%,#000 60%,transparent 96%);mask-image:radial-gradient(150% 140% at 50% 6%,#000 60%,transparent 96%);}
.hero .narrow{text-align:center;}
.hero h1 .g{color:var(--gold-dark);}
.hero .sub{max-width:640px;margin:26px auto 0;}
.hero .ctas{margin-top:38px;display:flex;gap:22px;justify-content:center;align-items:center;flex-wrap:wrap;}
.hero .small{margin-top:20px;font-size:14px;color:#7d8893;}
.hero{padding:80px 0 60px;}
.marquee{margin:0 0 44px;}
.marquee .cap{text-align:center;font-family:'Sora';font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-dark);margin:0 0 22px;}
.marquee .viewport{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);}
.marquee .track{display:flex;width:max-content;animation:rsm-marq 60s linear infinite;will-change:transform;}
.marquee:hover .track{animation-play-state:paused;}
.marquee .logo{flex:0 0 auto;width:188px;height:94px;margin-right:18px;background:#fff;border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;justify-content:center;padding:16px 22px;box-shadow:0 2px 12px rgba(0,40,80,.05);}
.marquee a.logo{text-decoration:none;color:inherit;transition:box-shadow .16s,transform .16s,border-color .16s;}
.marquee a.logo:hover{box-shadow:0 8px 20px rgba(0,40,80,.13);transform:translateY(-2px);border-color:#d7dde3;}
.marquee .logo img{max-width:100%;max-height:100%;object-fit:contain;display:block;}
.marquee .dimlogo img{filter:brightness(.42) contrast(1.05);}
.marquee .onblack{background:#0E1117;border-color:#0E1117;}
.marquee .logo .wm{font-family:'Sora';font-weight:800;font-size:16px;line-height:1.1;color:var(--navy);text-align:center;letter-spacing:-.01em;}
.marquee .logo .wm small{display:block;font-family:'Inter';font-weight:600;font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:#9aa6b1;margin-top:4px;}
.hero h1 .g{background-image:linear-gradient(105deg,var(--gold-dark) 0 38%,#C7A64A 45%,#FBF2D6 50%,#C7A64A 55%,var(--gold-dark) 62% 100%);background-size:250% 100%;background-repeat:no-repeat;background-position:0% 0;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;}
.hero h1 .g{animation:gold-shine 5s linear infinite;}
@keyframes rsm-marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes gold-shine{0%{background-position:0% 0;}30%{background-position:100% 0;}100%{background-position:100% 0;}}
.hero .oben{margin-bottom:14px}
.hero h1 .g.schimmer{color:var(--gold)}
.karte{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.ic{width:46px;height:46px;padding:9px;border:2px solid var(--line);border-radius:12px;color:var(--navy);flex:none;background:#fff}
.ic.gold{color:var(--gold)}.ic.gruen{color:var(--gruen)}
.ic.rund{border-radius:50%}
.ic.gross{width:74px;height:74px;padding:11px}
.hakenliste{list-style:none}
.hakenliste li{padding-left:30px;position:relative;margin-bottom:10px}
.hakenliste li::before{content:"✓";position:absolute;left:0;top:0;width:21px;height:21px;border-radius:50%;
background:var(--gold);color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}
.hakenliste.gruen li::before{background:var(--gruen)}
.xliste{list-style:none}
.xliste li{padding-left:30px;position:relative;margin-bottom:12px}
.xliste li::before{content:"✕";position:absolute;left:0;top:0;color:#C0392B;font-weight:800}
.kacheln{display:grid;gap:16px}
.kacheln.s6{grid-template-columns:repeat(6,1fr)}
.kacheln.s5{grid-template-columns:repeat(5,1fr)}
.kacheln.s4{grid-template-columns:repeat(4,1fr)}
.kacheln.s3{grid-template-columns:repeat(3,1fr)}
.kacheln.s2{grid-template-columns:repeat(2,1fr)}
.kachel{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px 14px;text-align:center;box-shadow:0 3px 10px rgba(6,43,71,.05)}
.kachel svg{width:44px;height:44px;color:var(--navy);margin:0 auto 10px;display:block}
.kachel b{color:var(--navy);font-size:14.5px;line-height:1.3;display:block}
.kachel p{font-size:13.5px;color:var(--muted);margin:6px 0 0}
.band{background:linear-gradient(100deg,var(--navy-dark),var(--navy));color:#fff}
.band h2,.band h3{color:#fff}
.band .g{color:#e8c96a}
.fussband{background:var(--navy-dark);color:#fff;padding:26px 0}
.fussband .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.fussband .p{display:flex;gap:12px;align-items:flex-start;font-size:13.5px;color:#c9d6e2}
.fussband .p svg{width:34px;height:34px;color:#e8c96a;flex:none}
.fussband .p b{color:#fff;display:block;font-size:14.5px}
/* Video + Logo-Laufband (wie auf der Live-Website) */
.video-wrap{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);cursor:pointer;aspect-ratio:16/9;background:#000}
.video-wrap img{width:100%;height:100%;object-fit:cover;opacity:.92}
.video-wrap .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.video-wrap .play i{width:78px;height:78px;border-radius:50%;background:rgba(0,64,111,.92);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(0,0,0,.35);transition:.15s}
.video-wrap .play i::after{content:"";border-style:solid;border-width:14px 0 14px 24px;border-color:transparent transparent transparent #fff;margin-left:6px}
.video-wrap:hover .play i{transform:scale(1.07);background:var(--gold)}
.video-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-note{font-size:12.5px;color:var(--muted);margin-top:8px}
.marq{overflow:hidden;margin:18px 0 24px;position:relative}
.marq::before,.marq::after{content:"";position:absolute;top:0;bottom:0;width:70px;z-index:2;pointer-events:none}
.marq::before{left:0;background:linear-gradient(90deg,#fff,transparent)}
.marq::after{right:0;background:linear-gradient(270deg,#fff,transparent)}
.marq .track{display:flex;gap:64px;align-items:center;width:max-content;animation:marq 32s linear infinite}
.marq img{height:40px;width:auto;object-fit:contain}
@keyframes marq{to{transform:translateX(-50%)}}
/* FAQ */
.faq .item{background:#fff;border:1px solid var(--line);border-radius:10px;margin-bottom:12px;box-shadow:0 3px 10px rgba(6,43,71,.04)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:20px 24px;font-family:'Sora';font-weight:700;font-size:16.5px;color:var(--navy)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .x{font-size:22px;color:var(--gold);flex:0 0 auto;transition:transform .2s;line-height:1}
.faq details[open] summary .x{transform:rotate(45deg)}
.faq .a{padding:0 24px 22px;font-size:15.5px;color:var(--ink)}
.faq .a p{margin:0}
/* Spezielles */
.chip{position:absolute;background:#fff;border-radius:12px;box-shadow:0 10px 26px rgba(6,43,71,.18);padding:10px 14px;display:flex;gap:10px;align-items:center;font-size:13px}
.chip svg{width:30px;height:30px;color:var(--gruen)}
.chip b{display:block;font-size:13px;color:var(--navy)}
.chip span{color:var(--muted);font-size:12px}
.platzhalter{background:repeating-linear-gradient(45deg,#eef2f6,#eef2f6 12px,#e6ebf1 12px,#e6ebf1 24px);border:1px dashed #b9c6d2;
border-radius:var(--radius);display:flex;align-items:center;justify-content:center;color:#6b7c8c;font-size:14px;font-weight:600;text-align:center;padding:20px}
.vorher{border:1.5px solid #d9a0a0;border-radius:var(--radius);padding:24px;background:#fff}
.nachher{border:1.5px solid #9ec9a5;border-radius:var(--radius);padding:24px;background:#fff}
.vorher h3{color:#C0392B}.nachher h3{color:var(--gruen)}
.schritte{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.schritte.zwei{grid-template-columns:repeat(2,1fr);margin-top:14px}
.schritt{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.schritt .nr{width:30px;height:30px;border-radius:50%;background:var(--navy);color:#fff;font-weight:800;font-family:'Sora';
display:inline-flex;align-items:center;justify-content:center;font-size:15px;margin-right:9px}
.schritt b{color:var(--navy);font-family:'Sora';font-size:16.5px}
.schritt p{font-size:14px;color:var(--muted);margin:10px 0 0}
.schritt svg{width:44px;height:44px;color:var(--navy);margin-top:14px}
.treppe .stufe{display:flex;align-items:stretch;margin-bottom:10px}
.treppe.go .stufe{animation:stufe-build .9s backwards}
.treppe.go .stufe:nth-child(1){animation-delay:1.8s}
.treppe.go .stufe:nth-child(2){animation-delay:1.35s}
.treppe.go .stufe:nth-child(3){animation-delay:.9s}
.treppe.go .stufe:nth-child(4){animation-delay:.45s}
.treppe.go .stufe:nth-child(5){animation-delay:0s}
.treppe.safe .stufe{opacity:1!important;transform:none!important;animation:none!important}
@keyframes stufe-build{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.treppe.go .stufe{animation:none}}
.treppe .nr{flex:none;width:74px;border-radius:10px 0 0 10px;display:flex;align-items:center;justify-content:center;
font-family:'Sora';font-weight:800;font-size:30px;color:#fff}
.treppe .inhalt{flex:1;background:var(--soft);border-radius:0 10px 10px 0;padding:14px 18px;display:flex;gap:16px;align-items:center;justify-content:space-between}
.treppe .inhalt b{font-family:'Sora';color:var(--navy);font-size:17px;display:block}
.treppe .inhalt p{font-size:14px;color:var(--muted);margin:2px 0 0}
.treppe .inhalt svg{width:40px;height:40px;color:var(--navy);flex:none}
.zitatkarte{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);display:flex;flex-direction:column}
.zitatkarte .kopfz{display:flex;gap:14px;align-items:center;margin-bottom:12px}
.zitatkarte .kopfz svg{width:42px;height:42px;color:var(--gold)}
.zitatkarte .kopfz b{font-family:'Sora';color:var(--gold);font-size:19px}
.zitatkarte blockquote{font-size:14.5px;color:var(--ink);flex:1}
.zitatkarte .wer{display:flex;gap:12px;align-items:center;margin-top:16px;border-top:1px solid var(--line);padding-top:14px}
.zitatkarte .wer .avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 2px var(--line)}
.zitatkarte .wer b{display:block;color:var(--navy);font-size:14.5px}
.zitatkarte .wer span{font-size:13px;color:var(--muted)}
.badges{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:var(--shadow)}
.badges .b{padding:20px;display:flex;gap:13px;align-items:flex-start;border-left:1px solid var(--line)}
.badges .b:first-child{border-left:none}
.badges .b svg{width:40px;height:40px;flex:none;color:var(--navy)}
.badges .b:first-child svg{color:var(--gold)}
.badges .b b{color:var(--navy);display:block;font-size:15px;font-family:'Sora'}
.badges .b p{font-size:13px;color:var(--muted);margin:3px 0 0}
.gruenbox{background:var(--gold);border-radius:12px;color:#fff;padding:18px 24px;display:flex;gap:14px;align-items:center;font-family:'Sora';font-weight:700;font-size:17px}
.gruenbox:hover{background:var(--gold-dark)}
.gruenbox svg{width:30px;height:30px;flex:none}
.gruenbox .pf{margin-left:auto;font-size:22px}
.gruenbox small{display:block;font-family:'Inter';font-weight:400;font-size:13.5px;opacity:.9}
.merkbox{border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:12px;padding:18px 22px;background:#fff}
@media(max-width:1000px){.kacheln.s6{grid-template-columns:repeat(3,1fr)}.kacheln.s5{grid-template-columns:repeat(3,1fr)}
.kacheln.s4{grid-template-columns:repeat(2,1fr)}.schritte{grid-template-columns:repeat(2,1fr)}
.fussband .wrap{grid-template-columns:repeat(2,1fr)}.badges{grid-template-columns:repeat(2,1fr)}
.badges .b:nth-child(3){border-left:none}.zweispaltig{grid-template-columns:1fr}}
@media(max-width:560px){.kacheln.s6,.kacheln.s5,.kacheln.s3,.kacheln.s2{grid-template-columns:repeat(2,1fr)}
.schritte{grid-template-columns:1fr}.kopf nav{display:none}}

/* ===== Handy-Feinschliff =====
   Am Handy liefen mehrere Seiten über den Bildschirmrand hinaus. Zwei Ursachen:

   1) Raster-Spalten mit "1fr" können nicht schmaler werden als das längste Wort
      darin. Aus "Digitalisierungsstrategie" wurde so eine 210 px breite Spalte,
      die das ganze Raster über den Rand schob. minmax(0,1fr) hebt diese
      Mindestbreite auf, die Spalte darf dann wirklich schrumpfen.
   2) Lange Wörter brachen nirgends um.

   Die Rasterleiter steht hier vollständig, damit die Abstufung an einer Stelle
   nachvollziehbar ist — nicht über die Datei verteilt.                         */

/* --- Spalten dürfen schrumpfen --- */
.kacheln.s2{grid-template-columns:repeat(2,minmax(0,1fr))}
.kacheln.s3{grid-template-columns:repeat(3,minmax(0,1fr))}
.kacheln.s4{grid-template-columns:repeat(4,minmax(0,1fr))}
.kacheln.s5{grid-template-columns:repeat(5,minmax(0,1fr))}
.kacheln.s6{grid-template-columns:repeat(6,minmax(0,1fr))}
.badges{grid-template-columns:repeat(4,minmax(0,1fr))}
.schritte{grid-template-columns:repeat(4,minmax(0,1fr))}
.schritte.zwei{grid-template-columns:repeat(2,minmax(0,1fr))}
.zweispaltig{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
.kachel,.schritt,.karte,.badges .b,.nachher,.vorher{min-width:0}

/* --- lange Wörter dürfen umbrechen --- */
h1,h2,h3,.kachel b,.kachel p,.schritt b,.schritt p,
.badges .b b,.badges .b p,.karte h3,.karte p,.faq summary{overflow-wrap:break-word}

/* --- Tablet --- */
@media(max-width:1000px){
  .kacheln.s6,.kacheln.s5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .kacheln.s4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .schritte{grid-template-columns:repeat(2,minmax(0,1fr))}
  .badges{grid-template-columns:repeat(2,minmax(0,1fr))}
  .zweispaltig{grid-template-columns:minmax(0,1fr)}
}

/* --- kleines Tablet / großes Handy --- */
@media(max-width:560px){
  .kacheln.s6,.kacheln.s5,.kacheln.s3,.kacheln.s2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .schritte,.schritte.zwei{grid-template-columns:minmax(0,1fr)}
}

/* --- Handy: eine Spalte, engere Ränder --- */
@media(max-width:520px){
  .kacheln.s2,.kacheln.s3,.kacheln.s4,.kacheln.s5,.kacheln.s6,
  .schritte,.schritte.zwei{grid-template-columns:minmax(0,1fr)}
  .badges{grid-template-columns:minmax(0,1fr)}
  .badges .b{border-left:none;border-top:1px solid var(--line)}
  .badges .b:first-child{border-top:none}
  .wrap{padding:0 16px}
  .karte,.nachher,.vorher{padding:20px}
  .ic-riesig{width:88px;height:88px}
}

/* Gewerke-Aufzählung auf der Aufmaß-Seite: war als festes Drei-Spalten-Raster
   im Markup verdrahtet und lief am Handy über den Rand. Jetzt als Klasse mit
   schrumpffähigen Spalten und Abstufung. */
.gewerkespalten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 18px}
@media(max-width:700px){.gewerkespalten{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){.gewerkespalten{grid-template-columns:minmax(0,1fr)}}

/* ===== Farbwelt je Gewerk (Werbe-Landingpages) =====
   Die Branchen-Unterseiten steuern ihre Farbe über --accent; hier übernimmt
   --gold dieselbe Rolle, weil im Relaunch-Stil alle Akzente daran hängen:
   Knöpfe, Dachzeile, Trennlinie, FAQ-Zeichen, Merkbox-Kante, Symbole.
   Die Töne sind Zeichen für Zeichen dieselben wie in branchen.css.

   Bewusste Ausnahme: Der Gold-Schimmer der Überschrift bleibt golden. Er ist
   das Markenzeichen ("goldene Handwerksbetriebe") und muss auf jeder Seite
   gleich aussehen - ein grüner Schimmer wäre kein Gewerk-Akzent mehr,
   sondern eine andere Marke.                                                */
body.t-bau, body.t-technik { --gold:#00406F; --gold-dark:#062b47 }
body.t-ausbau              { --gold:#A58B3F; --gold-dark:#8a7434 }
body.t-garten              { --gold:#2F6B3C; --gold-dark:#245231 }
body.t-wartung             { --gold:#1E7A5A; --gold-dark:#245231 }

/* Schimmer und Gold-Text im Fließtext bleiben Marken-Gold */
body[class^="t-"] .schimmer, body[class^="t-"] .gsch{
  background-image:linear-gradient(105deg,#8a7434 0 38%,#C7A64A 45%,#FBF2D6 50%,#C7A64A 55%,#8a7434 62% 100%)}
body[class^="t-"] .schimmer{color:#A58B3F}

/* Bau und Technik tragen Navy als Akzent - dort würde ein navyfarbener Knopf
   im navyfarbenen Umfeld verschwinden. Der Haupt-Aufruf bleibt deshalb golden. */
body.t-bau .knopf, body.t-technik .knopf{background:#A58B3F}
body.t-bau .knopf:hover, body.t-technik .knopf:hover{background:#8a7434}

/* ===== Hinweisband „Jetzt Neu" über der Startseiten-Überschrift =====
   Führt auf die Aufmaß-Seite. Eckig und an beiden Enden auslaufend, wie in
   Christians Skizze: der Farbverlauf geht links und rechts auf durchsichtig,
   deshalb kein Rahmen und keine runden Ecken.

   Rot #DC1E26: kräftig genug für einen Neu-Hinweis und mit weißer Schrift bei
   4,6 Kontrast auch für normalen Text ausreichend - bei 21 px fett wäre schon
   3,0 gefordert. Rot kommt sonst nirgends auf der Website vor; das ist hier
   Absicht, ein Neu-Hinweis soll aus dem Markenbild herausstechen.            */
.neuband{display:block;text-align:center;
  width:100%;max-width:820px;margin:0 auto 26px;
  background:linear-gradient(90deg,rgba(220,30,38,0) 0%,#DC1E26 16%,#DC1E26 84%,rgba(220,30,38,0) 100%);
  color:#fff!important;border-radius:0;padding:14px 30px;
  font-family:'Sora';font-weight:700;font-size:clamp(16px,1.9vw,21px);line-height:1.3;
  text-shadow:0 1px 2px rgba(0,0,0,.20);
  transition:filter .15s,transform .15s}
.neuband:hover{filter:brightness(.92);transform:translateY(-1px)}
.neuband .pf{display:inline-block;margin-left:.45em;font-size:1.05em;transition:transform .15s}
.neuband:hover .pf{transform:translateX(3px)}
@media(max-width:700px){
  /* Schmaler Bildschirm: Der Verlauf muss enger auslaufen, sonst frisst er
     sich in den Text hinein. */
  .neuband{background:linear-gradient(90deg,rgba(220,30,38,0) 0%,#DC1E26 9%,#DC1E26 91%,rgba(220,30,38,0) 100%);
    padding:12px 18px;margin-bottom:20px}
}

/* RESUMA 3 - gemeinsame Bausteine der Relaunch- und Branchenseiten
   Erzeugt von _entwurf/r3/werkzeug/_r3_alle_bauen.js --src - nicht von Hand ändern. */
/* ===== RESUMA 3 - Bausteine, auf allen Seiten gleich ===== */
.r3-name{font-family:'Sora',sans-serif;font-weight:800;color:#00406F;white-space:nowrap}
.r3-name i,.r3-gw{font-style:normal;color:#A58B3F}
h1 .r3-gw,h2 .r3-gw{color:#A58B3F!important}
.r3-neu{display:inline-block;background:#DC1E26;color:#fff!important;font:700 10px/1 'Sora',sans-serif;font-style:normal;letter-spacing:.07em;text-transform:uppercase;padding:4px 6px 3px;border-radius:3px;vertical-align:2px;margin-left:8px;white-space:nowrap}
.r3-ic{flex:none;width:42px;height:42px;border-radius:50%;background:#f5ecd6;color:#8a7434;display:flex;align-items:center;justify-content:center}
.r3-ic svg{width:21px;height:21px;display:block}
.r3-oben{color:#A58B3F;font-weight:700;letter-spacing:2px;font-size:13px;text-transform:uppercase;margin:0 0 10px}
.r3-titel{font-family:'Sora',sans-serif;font-weight:700;color:#00406F;font-size:clamp(26px,3vw,32px);line-height:1.2;margin:0}
.r3-claim{font-family:'Sora',sans-serif;font-weight:700;color:#00406F;font-size:clamp(18px,1.8vw,21px);line-height:1.35;margin:6px 0 0}
.r3-h1{font-size:clamp(28px,3.6vw,40px)}
.r3-spruch-h2{font-family:'Sora',sans-serif;font-weight:700;color:#00406F;font-size:clamp(24px,2.8vw,32px);line-height:1.25;margin:0 auto;max-width:1000px}
.r3-spruch{font-family:'Sora',sans-serif;font-weight:700;color:#00406F;font-size:clamp(18px,1.8vw,21px);line-height:1.35;margin:22px auto 0;max-width:640px}
.r3-vorspann{margin:18px 0 10px}
.r3-kopf-mittig{text-align:center}
.r3-kopf-mittig + .linie,.r3-kopf-mittig + .title-line{margin-top:20px}
.r3-trio{margin:0 0 18px;background:#fff;border:1px solid #e3e8ee;border-radius:14px;box-shadow:0 6px 24px rgba(6,43,71,.08);overflow:hidden}
.r3-trio a{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:14px;align-items:center;padding:11px 16px;color:inherit;text-decoration:none;transition:background .15s}
.r3-trio a+a{border-top:1px solid #e3e8ee}
.r3-trio a:hover{background:#fbf8f1}
.r3-trio b{display:block;font-size:16px;line-height:1.25}
.r3-trio small{display:block;font-size:14px;color:#5a6b7a;line-height:1.4;margin-top:2px}
.r3-pf{color:#A58B3F;font:700 22px/1 'Sora',sans-serif}
.r3-karten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:34px}
.r3-karte{display:flex;flex-direction:column;align-items:flex-start;gap:12px;background:#fff;border:1px solid #e3e8ee;border-radius:14px;box-shadow:0 6px 24px rgba(6,43,71,.08);padding:24px 24px 22px;color:#1c2b3a;text-decoration:none;transition:transform .15s,box-shadow .15s}
.r3-karte:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(6,43,71,.12);text-decoration:none}
.r3-karte b{display:block;font-size:18px;line-height:1.25}
.r3-karte p{font-size:15px;color:#5a6b7a;line-height:1.55;margin:0}
.r3-mehr{margin-top:auto;padding-top:4px;font-family:'Sora',sans-serif;font-weight:700;font-size:15px;color:#00406F}
.r3-mehr span{color:#A58B3F}
@media(max-width:900px){.r3-karten{grid-template-columns:minmax(0,1fr)}}
/* Karten mit kleinem Bild: Bühne wie bei den DOKU-Schritten, Rahmen wie das
   Handy bei RESUMA MOBIL - nur kleiner und unten angeschnitten */
.r3-mit-bild .r3-karte{padding:0;gap:0;overflow:hidden}
.r3-buehne{position:relative;display:block;align-self:stretch;flex:none;height:200px;overflow:hidden;border-bottom:1px solid #e3e8ee;background:linear-gradient(165deg,#f8fafc 0%,#e8eef5 100%)}
.r3-geraet{position:absolute;top:24px;left:50%;display:block;background:#002B4D;box-shadow:0 14px 32px rgba(6,43,71,.28);transform:translateX(-50%);transition:transform .2s}
.r3-karte:hover .r3-geraet{transform:translate(-50%,-4px)}
.r3-geraet img{display:block;width:100%;max-width:none}
.r3-handy{width:156px;padding:6px 6px 0;border-radius:24px 24px 0 0}
.r3-handy img{aspect-ratio:296/401;border-radius:18px 18px 0 0}
.r3-hinten{top:40px;margin-left:-48px;box-shadow:0 10px 24px rgba(6,43,71,.22)}
.r3-vorne{margin-left:48px}
.r3-browser{width:min(86%,300px);padding:0 4px;border-radius:9px 9px 0 0}
.r3-leiste{display:flex;gap:5px;align-items:center;height:18px;padding:0 5px}
.r3-leiste i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.38)}
.r3-browser img{aspect-ratio:596/400;border-radius:2px 2px 0 0;background:#fff}
.r3-karte-text{display:flex;flex-direction:column;align-items:flex-start;gap:12px;align-self:stretch;flex:1;padding:22px 24px}
/* Tablet: Bild links, Text rechts - sonst stünde ein kleines Handy auf einer 700 px breiten Bühne */
@media(min-width:600px) and (max-width:900px){
  .r3-mit-bild .r3-karte{flex-direction:row;align-items:stretch}
  .r3-mit-bild .r3-buehne{flex:0 0 42%;height:auto;min-height:214px;border-bottom:0;border-right:1px solid #e3e8ee}
}
.r3-quellen{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:18px auto 22px}
.r3-quellen span{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;background:#fff;border:1px solid #e3e8ee;border-radius:999px;box-shadow:0 3px 10px rgba(6,43,71,.06);font-family:'Sora',sans-serif;font-weight:700;font-size:14px;color:#00406F;white-space:nowrap}
.r3-quellen svg{width:18px;height:18px;color:#A58B3F;flex:none}
.r3-angebot{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid #e3e8ee;border-left:4px solid #A58B3F;border-radius:12px;padding:16px 18px;margin-top:18px;box-shadow:0 3px 10px rgba(6,43,71,.05)}
.r3-angebot b{display:block;font-family:'Sora',sans-serif;color:#00406F;font-size:16px;margin:0 0 4px}
.r3-angebot p{margin:0;font-size:15px;line-height:1.55;color:#1c2b3a}

/* ===== RESUMA DOKU (Relaunch-Seiten) ===== */
.dk-intro{margin:16px 0 0}
.dk-drei{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:26px 0 0;padding-top:22px;border-top:1px solid #e3e8ee}
.dk-m{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.dk-m b{font-family:'Sora',sans-serif;color:#00406F;font-size:14.5px;line-height:1.3}
.dk-knoepfe{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:28px}
.dk-link{display:inline-flex;align-items:center;gap:8px;padding:12px 2px;font-family:'Sora',sans-serif;font-weight:700;font-size:15px;color:#00406F!important}
.dk-link span{border-bottom:2px solid #A58B3F;padding-bottom:2px}
.dk-foto{display:flex;justify-content:flex-end}
.dk-foto img{max-width:560px;aspect-ratio:628/438}
/* Echtes App-Bild im Handy-Rahmen - gleicher Rahmen wie bei RESUMA MOBIL */
.dk-handy{display:flex;flex-direction:column;align-items:center;gap:14px;margin:0}
.dk-handy img{width:100%;max-width:300px;aspect-ratio:738/1600;border-radius:36px;border:9px solid #002B4D;box-shadow:0 24px 54px rgba(6,43,71,.30);display:block;background:#000}
.dk-handy figcaption{max-width:340px;text-align:center;font-size:13.5px;line-height:1.5;color:#5a6b7a}
/* Schritt 4/5: breitere Bildchen für die echten Bezeichnungen */
.dk-panel.dk-breit{width:236px}
.dk-breit .dk-zeile{grid-template-columns:56px 1fr;font-size:12px;padding:0 8px}
.dk-breit .dk-zeile b{font-size:12px}
.dk-aktiv{display:flex;align-items:center;gap:8px;background:#00406F;color:#fff;border-radius:8px;padding:6px 10px;margin-bottom:4px}
.dk-aktiv span:nth-child(2){flex:1;font:700 12.5px/1.15 'Sora',sans-serif}
.dk-aktiv small{display:block;font:600 9.5px/1.3 'Inter',sans-serif;opacity:.85}
.dk-aktiv em{font-style:normal;font:700 12px/1 'Sora',sans-serif;color:#e8c96a}
.dk-ring{flex:none;width:16px;height:16px;border-radius:50%;border:2px solid #e8c96a;box-shadow:inset 0 0 0 2px #00406F,inset 0 0 0 5px #e8c96a}
.dk-breit .dk-plabel{font:600 10px/1.2 'Inter',sans-serif;color:#5a6b7a;letter-spacing:0;padding:2px 3px 4px}
.dk-raster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:36px}
.dk-k{position:relative;background:#fff;border:1px solid #e3e8ee;border-radius:14px;box-shadow:0 6px 24px rgba(6,43,71,.08);display:flex;flex-direction:column}
.dk-k:not(:nth-child(3n))::after{content:"\2192";position:absolute;z-index:2;top:73px;right:-28px;width:32px;height:32px;border-radius:50%;
  background:#fff;border:1px solid #e3e8ee;box-shadow:0 3px 8px rgba(6,43,71,.10);color:#A58B3F;font:700 16px/1 'Sora',sans-serif;display:flex;align-items:center;justify-content:center}
.dk-buehne{position:relative;isolation:isolate;height:178px;border-radius:13px 13px 0 0;overflow:hidden;border-bottom:1px solid #e3e8ee;
  background:linear-gradient(165deg,#f8fafc 0%,#e8eef5 100%);display:flex;align-items:center;justify-content:center}
.dk-text{padding:20px 22px 24px}
.dk-kopf{display:flex;align-items:center;gap:12px}
.dk-kopf h3{margin:0;font-size:17px;line-height:1.3}
.dk-nr{flex:none;width:30px;height:30px;border-radius:50%;background:#00406F;color:#fff;font:800 14px/1 'Sora',sans-serif;display:flex;align-items:center;justify-content:center}
.dk-text p{margin:10px 0 0;font-size:15px;line-height:1.55;color:#5a6b7a}
.dk-svg,.dk-panel{width:188px;border-radius:10px;background:#fff;box-shadow:0 8px 22px rgba(6,43,71,.12),0 0 0 1px rgba(6,43,71,.05)}
.dk-svg{height:128px;display:block;overflow:hidden}
.dk-panel{padding:8px;display:flex;flex-direction:column;gap:2px}
.dk-zeile{display:grid;grid-template-columns:34px 1fr;align-items:center;height:27px;padding:0 9px;border-radius:6px;font-size:12.5px;color:#1c2b3a}
.dk-zeile b{font-family:'Sora',sans-serif;color:#00406F;font-size:12.5px}
.dk-zeile.an{background:#f7efd9}
.dk-zeile.an b{color:#8a7434}
.dk-plabel{font:700 11px/1 'Sora',sans-serif;color:#00406F;letter-spacing:.02em;padding:3px 2px 6px}
.dk-wahl{display:flex;justify-content:space-between;align-items:center;gap:6px;height:26px;border:1px solid #d6dde5;border-radius:6px;padding:0 8px;font-size:11.5px;color:#1c2b3a;white-space:nowrap;margin-bottom:4px}
.dk-wahl i{flex:none;width:6px;height:6px;border-right:1.6px solid #00406F;border-bottom:1.6px solid #00406F;transform:translateY(-2px) rotate(45deg)}
.dk-haken{display:flex;align-items:center;gap:8px;height:22px;padding:0 3px;font-size:12px;color:#1c2b3a;white-space:nowrap}
.dk-box{flex:none;width:14px;height:14px;border-radius:3px;border:1.5px solid #a7b5c3;display:flex;align-items:center;justify-content:center}
.dk-haken.an .dk-box{background:#00406F;border-color:#00406F}
.dk-haken.an .dk-box::after{content:"";width:6px;height:3px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:translateY(-1px) rotate(-45deg)}
.dk-doc{position:relative;width:104px;height:134px;background:#fff;border-radius:6px;padding:13px 12px;display:flex;flex-direction:column;gap:6px;box-shadow:0 8px 22px rgba(6,43,71,.14),0 0 0 1px rgba(6,43,71,.06)}
.dk-doc::before{content:"";position:absolute;inset:0;z-index:-1;background:#fff;border-radius:6px;transform:translate(12px,-7px) rotate(5deg);box-shadow:0 4px 14px rgba(6,43,71,.10),0 0 0 1px rgba(6,43,71,.06)}
.dk-doc i{display:block;flex:none}
.dk-doc-kopf{width:48%;height:8px;border-radius:2px;background:#00406F;margin-bottom:3px}
.dk-l{height:5px;border-radius:3px;background:#dfe5ec}
.dk-doc-plan{height:40px;border:1.5px solid #00406F;border-radius:2px;margin:3px 0;
  background:linear-gradient(90deg,transparent 56%,#00406F 56%,#00406F calc(56% + 1.5px),transparent 0),linear-gradient(180deg,transparent 48%,#00406F 48%,#00406F calc(48% + 1.5px),transparent 0) 0 0/56% 100% no-repeat}
.dk-tag{position:absolute;left:-13px;bottom:18px;background:#A58B3F;color:#fff;font:800 12.5px/1 'Sora',sans-serif;letter-spacing:.03em;padding:6px 8px;border-radius:4px;box-shadow:0 4px 10px rgba(165,139,63,.35)}
.dk-band{position:relative;overflow:hidden;background:#062b47;padding:58px 0}
.dk-band .wrap{position:relative;z-index:1}
.dk-band-text{max-width:560px}
.dk-band h2{color:#fff;font-size:clamp(26px,3vw,36px);line-height:1.15;margin:0}
.dk-band h2 .g{color:#e8c96a!important}
.dk-band .knopf{margin-top:26px}
.dk-band-bild{position:absolute;top:0;right:0;width:min(56%,720px);height:100%;object-fit:cover;object-position:right center;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 30%);mask-image:linear-gradient(to right,transparent 0,#000 30%)}
@media(max-width:1000px){ .dk-raster{grid-template-columns:repeat(2,minmax(0,1fr))} .dk-k::after{display:none!important} }
@media(max-width:900px){
  .dk-foto{justify-content:center}
  .dk-band{padding:52px 0 0}
  .dk-band-text{max-width:none}
  .dk-band-bild{position:static;display:block;width:100%;height:auto;aspect-ratio:648/268;margin-top:30px;
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 24%);mask-image:linear-gradient(to bottom,transparent 0,#000 24%)}
}
@media(max-width:640px){
  .dk-raster{grid-template-columns:minmax(0,1fr);gap:18px}
  .dk-drei{grid-template-columns:minmax(0,1fr);gap:12px}
  .dk-m{flex-direction:row;align-items:center;gap:14px}
}

/* RESUMA 3 - Relaunch-Seiten: nur Blau/Gold, Handy-Überschriften (15.09.2026)
   Erzeugt von _entwurf/r3/werkzeug/_r3_alle_bauen.js --src - nicht von Hand ändern. */
/* Landingpages ohne Gewerkefarben: Dachzeile, Häkchen, Linien und Knöpfe
   überall in Gold, Überschriften Navy mit goldener Pointe - wie die Hauptseiten.
   Vorher: Bau/Technik Navy, Ausbau Gold, Garten Grün, Wartung Türkis. */
body.t-bau,body.t-technik,body.t-ausbau,body.t-garten,body.t-wartung{--gold:#A58B3F;--gold-dark:#8a7434}
/* "So läuft es heute" / "Der klassische Zeitfresser": statt Rot neutral in
   Navy; "Mit RESUMA 3": statt Grün mit goldenem Rahmen, Symbol und Häkchen */
.vorher{border-color:#d6dde5}
.vorher h3{color:#00406F}
.xliste li::before{color:#00406F}
.nachher{border-color:#A58B3F;box-shadow:0 6px 24px rgba(165,139,63,.12)}
.nachher h3{color:#00406F}
.nachher h3 svg{color:#A58B3F}
/* Landingpages, Kopfzeile am Handy: Knopf so kompakt wie "Erstgespräch" auf
   den übrigen Seiten (war 16 × 30 px Innenabstand und nahm die halbe Zeile ein) */
@media(max-width:600px){.nav.lp .btn{padding:10px 16px;font-size:13.5px}}
/* Handy: Überschriften etwas kleiner - weniger Zeilenumbrüche */
@media(max-width:520px){
  h1{font-size:26px}
  h2{font-size:22px}
  h3{font-size:17.5px}
  .r3-h1{font-size:25px}
  .r3-titel{font-size:24px}
  .r3-claim,.r3-spruch{font-size:17px}
  .dk-band h2{font-size:23px}
}
/* Startseite: die grünen Haken und Symbole ebenfalls in Gold */
.hakenliste.gruen li::before{background:#A58B3F}
.ic.gruen{color:#A58B3F}
/* Lösungen, Handy: Symbol über den Text - Titel und Text bekommen die volle
   Kartenbreite (vorher stand der Titel in einer 230 px schmalen Spalte) */
@media(max-width:520px){.kacheln.s2>a.karte{grid-template-columns:minmax(0,1fr)!important;gap:12px!important}.kacheln.s2>a.karte .ic{width:40px;height:40px;padding:7px}}

/* RESUMA - Google-Rezensionen
   Erzeugt von _entwurf/bewertungen/_einbauen.js - nicht von Hand ändern. */
/* ===== Google-Rezensionen (05.10.2026) =====
   Farben wie überall: Navy #00406F, Gold #A58B3F. Die Karten laufen in zwei
   Spalten ohne Löcher (columns statt Raster), am Handy in einer. */
.gb-leiste{display:inline-flex;align-items:center;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid #e3e8ee;border-radius:999px;
  box-shadow:0 4px 14px rgba(6,43,71,.08);padding:9px 18px;font-family:'Sora','Segoe UI',sans-serif;font-size:15px;color:#00406F;text-decoration:none}
.gb-leiste b{font-size:17px}
.gb-sterne{color:#A58B3F;letter-spacing:1px;font-size:15px;line-height:1}
.gb-leiste .gb-quelle{color:#5a6b7a;font-weight:400;font-family:'Inter','Segoe UI',sans-serif;font-size:14px}
.gb-leiste .gb-pf{color:#A58B3F;font-weight:700}
a.gb-leiste:hover{border-color:#A58B3F}
.gb-karten{columns:2;column-gap:20px;max-width:980px;margin:26px auto 0;text-align:left}
.gb-karte{break-inside:avoid;margin:0 0 20px;background:#fff;border:1px solid #e3e8ee;border-radius:14px;box-shadow:0 6px 24px rgba(6,43,71,.08);padding:22px 24px;display:flex;flex-direction:column}
.gb-kopf{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.gb-kreis{flex:none;width:42px;height:42px;border-radius:50%;background:#f5ecd6;color:#8a7434;font-family:'Sora',sans-serif;font-weight:800;font-size:15px;
  display:flex;align-items:center;justify-content:center}
.gb-kopf b{display:block;font-family:'Sora',sans-serif;color:#00406F;font-size:15.5px;line-height:1.25}
.gb-kopf small{display:block;color:#5a6b7a;font-size:13px}
.gb-marke{margin-left:auto;font-family:'Sora',sans-serif;font-weight:700;font-size:12.5px;color:#5a6b7a;letter-spacing:.04em;white-space:nowrap}
.gb-karte p{margin:0;font-size:15px;line-height:1.6;color:#1c2b3a;
  display:-webkit-box;-webkit-line-clamp:7;-webkit-box-orient:vertical;overflow:hidden}
.gb-mehr{margin-top:14px;padding-top:12px;border-top:1px solid #e3e8ee;font-family:'Sora',sans-serif;font-weight:700;font-size:14px;color:#00406F!important;text-decoration:none}
.gb-mehr span{color:#A58B3F}
.gb-hinweis{margin:18px auto 0;max-width:820px;font-size:13.5px;line-height:1.55;color:#5a6b7a}
.gb-hinweis a{color:#00406F;font-weight:600;border-bottom:1px solid #A58B3F;text-decoration:none}
@media(max-width:860px){.gb-karten{columns:1}}
/* Handy: die Leiste wird zum flachen Kasten, der Zusatztext entfällt */
@media(max-width:560px){
  .gb-leiste{display:flex;justify-content:center;border-radius:14px;padding:11px 16px;gap:4px 10px;font-size:14.5px}
  .gb-leiste .gb-lang,.gb-leiste .gb-pf{display:none}
  .gb-karte{padding:20px}
}

/* Sprungmarken: Abstand = Höhe der mitlaufenden Kopfleiste (79 px). Damit sitzt die
   erste Zeile nach dem Sprung genau so hoch wie beim normalen Aufruf einer Seite. */
section[id]{scroll-margin-top:79px}

/* Mausglow — der weiche goldene Lichtschein, der dem Zeiger folgt.
   Beim Umstieg von WordPress auf statische Seiten ist die Regel verloren gegangen:
   Der Baustein <div id="mglow"> und das Skript waren noch da, aber ohne Stil blieb
   der Schein unsichtbar. Hier neu angelegt — etwas kleiner als früher (320 statt
   420 px), damit er dezenter wirkt. Das Skript versetzt um die halbe Kantenlänge,
   also 160 px; wer die Größe ändert, muss dort mitziehen.                          */
#mglow {
  position: fixed;
  top: 0;
  left: 0;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 4;
  opacity: 0;
  transition: opacity .35s ease;
  background: radial-gradient(circle closest-side,
    rgba(165, 139, 63, .16) 0%,
    rgba(165, 139, 63, .09) 42%,
    rgba(165, 139, 63, 0) 72%);
}

/* Auf Fingergeräten gibt es keinen Zeiger — dort bleibt der Schein aus. */
@media (hover: none) {
  #mglow { display: none; }
}

/* Wer weniger Bewegung eingestellt hat, bekommt keinen mitlaufenden Schein. */
@media (prefers-reduced-motion: reduce) {
  #mglow { display: none; }
}