/* Getrennte Gestaltungsschicht – bestehende Styles und Skripte bleiben erhalten. */
:root{--app-blue:#0066c6;--app-ink:#536e7d;--app-bg:#f5f5f5}
body{background:var(--app-bg);color:var(--app-ink);padding-bottom:92px}
#mainmenue{margin:0;background:#fff;box-shadow:0 2px 10px #0001}
.nav-flex{max-width:1040px}.nav-flex img{max-width:54px}
.hero-header-section:has(.hero-logo){background:var(--app-blue);padding:32px 16px 46px}
.hero-logo img{width:240px;max-width:65%!important;height:auto}
.hero-title{color:white;font-size:20px}.hero-title-wrapper{height:65px}
.container{max-width:1040px}
.action-bar{position:relative;top:auto;margin:0 auto;padding:0;background:none;border:0;display:block;width:calc(100% - 36px);transform:translateY(-18px);z-index:2}
.contact-card{background:white;border-radius:6px;box-shadow:0 5px 8px #0002;overflow:hidden}
.contact-grid{display:flex;min-width:0;gap:0;padding:10px 8px;align-items:center}
.contact-grid .btn-action{background:transparent!important;color:var(--app-blue);flex:1;min-width:0;min-height:50px;border-radius:0;font-weight:400}
.contact-grid .btn-action svg{stroke:currentColor;width:27px;height:27px}.contact-grid .btn-action svg path[fill]{fill:currentColor}
.contact-grid .btn-action svg path[fill='#EA4335']{fill:white}
.contact-grid .btn-action.is-whatsapp{color:#25cb69}
.contact-grid .btn-action span{display:none}
.contact-toggle{border:0;background:transparent;color:var(--app-ink);width:46px;height:50px;cursor:pointer;font-size:25px;flex:none}
.contact-grid.expanded{display:grid;grid-template-columns:1fr 46px;padding:10px 12px;gap:0}
.contact-grid.expanded .btn-action{grid-column:1;display:flex;flex-direction:row;justify-content:flex-start;gap:24px;padding:12px 8px;min-height:62px;text-align:left;color:var(--app-ink)}
.contact-grid.expanded .btn-action svg{flex:none;color:var(--app-blue)}
.contact-grid.expanded .is-whatsapp svg{color:#25cb69}
.contact-grid.expanded .btn-action span{display:block;font-size:17px;overflow-wrap:anywhere}
.contact-grid.expanded .contact-toggle{grid-column:2;grid-row:1;align-self:center}
.function-side{min-width:0;display:block;margin-top:12px}
#status-box{background:transparent!important;color:var(--app-ink)!important;min-height:32px;font-size:14px;padding:6px 4px;border-radius:0;flex-direction:row;justify-content:flex-start;gap:9px;font-weight:400}
.app-status-dot{width:9px;height:9px;border-radius:50%;background:var(--status-color,#82919a);flex:none}
.contact-grid #status-box{flex:0 1 108px;min-width:82px;min-height:44px;justify-content:center;padding:8px 9px;text-align:center;font-size:14px;line-height:1.25;gap:0;background:var(--status-color,#82919a)!important;color:white!important;border-radius:6px;margin:0 4px}
.contact-grid #status-box .app-status-dot{display:none}
.contact-grid #shop-status{display:none}
.contact-grid #status-box .app-status-label{display:block;font-weight:800;overflow-wrap:normal;color:white!important}
.contact-grid .contact-toggle{width:32px}
.contact-grid .btn-action svg{width:24px;height:24px}
.contact-grid.expanded #status-box{grid-column:1;grid-row:6;justify-content:center;padding:12px 16px;font-size:16px;text-align:center;margin:8px;justify-self:start;min-width:125px}
.contact-grid.expanded .contact-toggle{grid-column:2;grid-row:1}
.hero-header-section:has(.hero-text){padding:0 18px}.hero-text{background:white;border-radius:6px;padding:22px;margin:0 auto 24px;box-shadow:0 3px 8px #0001}
.hero-text h2{color:var(--app-ink);text-align:left}.hero-text p{text-align:left;padding:0;line-height:1.65}.hero-text img{max-width:100%!important;width:100%;border-radius:6px}
.dapeci-footer{background:#fff;color:var(--app-ink);padding:24px 16px}.signature{color:var(--app-blue)}
.app-bottom{position:fixed;bottom:0;left:0;right:0;background:#fff;display:flex;justify-content:center;gap:20px;padding:9px 12px max(9px,env(safe-area-inset-bottom));box-shadow:0 -1px 5px #0001;z-index:1001}
.app-bottom a{color:var(--app-ink);font-size:12px;display:flex;flex-direction:column;align-items:center;text-decoration:none;min-width:75px;min-height:46px;gap:4px}.app-bottom svg{width:25px;height:25px;stroke:currentColor}.app-bottom a[aria-current]{color:var(--app-blue)}
.app-booking{position:fixed;bottom:86px;right:18px;border:0;border-radius:50px;background:#535353;color:white;padding:17px 23px;text-decoration:none;box-shadow:0 4px 10px #0002;z-index:1000;font-size:15px}
a:focus-visible,button:focus-visible{outline:3px solid #ff9800;outline-offset:3px}
@media(min-width:760px){.hero-logo{display:flex;align-items:center;justify-content:center;gap:60px}.hero-title-wrapper{width:340px}.contact-grid.expanded{grid-template-columns:1fr 46px}.contact-grid.expanded .btn-action{min-height:58px}.app-booking{right:max(24px,calc((100vw - 1040px)/2))}}
@media(prefers-reduced-motion:reduce){.hero-title,.signature{animation:none;position:static;opacity:1;transform:none}.hero-title-wrapper,.signature-wrapper{height:auto;display:grid;gap:8px}}

/* Service: Bildblau in den vier Karten, weißer Rahmen, helle Seitenstreifen. */
.service-page{background:#f5f5f5}
.service-page .app-image-wrapper{padding-top:24px}
.service-page .app-portal-style{width:85%;max-width:850px;background:#fff;color:var(--app-ink)!important;border:1px solid #d8e0e5;border-radius:12px;padding:32px;box-shadow:0 4px 16px #0001;margin:0 auto 28px}
.service-page .app-header h2{color:var(--app-ink)!important}
.service-page .app-subtitle{color:var(--app-ink)}
.service-page .app-divider{background:#0066c6}
.service-page .app-card{background:#0066cb;border-left:0;border-radius:6px;padding:24px;margin-bottom:18px;color:#fff;text-align:left}
.service-page .app-card:last-child{margin-bottom:0}
.service-page .app-card h2{color:#fff!important;text-align:left;margin-top:0}
.service-page .app-card p{color:#fff;line-height:1.65;margin-bottom:0}
@media(max-width:600px){.service-page .app-portal-style{width:85%;padding:22px 16px}.service-page .app-card{padding:20px}.service-page .app-small-img{width:85%}}
