/* Gemeinsamer Header & Footer – Arends E-Bikes (geladen über /js/layout.js) */
.ah-header,.af-footer{
  --ae-red:#d83a39;
  --ae-blue:#38447c;
  --ae-navy:#141a33;
  --ae-ink:#1d1d1f;
  --ae-muted:#5f6478;
  --ae-line:rgba(0,0,0,.08);
  font-family:"Inter",-apple-system,BlinkMacSystemFont,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.ah-header *,.af-footer *{box-sizing:border-box}
.ah-header a,.af-footer a{text-decoration:none}

/* Header */
.ah-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,.97);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--ae-line);transition:box-shadow .3s}
.ah-header.is-scrolled{box-shadow:0 8px 30px -14px rgba(20,26,51,.3)}
.ah-inner{max-width:1360px;margin:0 auto;padding:0 clamp(16px,4vw,56px);height:84px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.ah-logo{display:block;flex:0 0 auto}
.ah-logo img{display:block;height:46px;width:auto}
.ah-nav{display:flex;align-items:center;gap:4px}
.ah-link,.ah-dd-toggle{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 12px;border-radius:8px;font:500 15px/1 "Inter",sans-serif;color:var(--ae-ink);background:none;border:0;cursor:pointer;transition:color .2s,background .2s;white-space:nowrap}
.ah-link:hover,.ah-dd-toggle:hover,.ah-dd:focus-within>.ah-dd-toggle{color:var(--ae-blue);background:rgba(56,68,124,.07)}
.ah-link[aria-current="page"]{color:var(--ae-red)}
.ah-dd-toggle::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .25s}
.ah-dd{position:relative}
.ah-dd-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:220px;background:#fff;border-radius:12px;padding:8px;box-shadow:0 24px 50px -18px rgba(20,26,51,.35),0 0 0 1px var(--ae-line);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s,transform .2s,visibility .2s}
.ah-dd-menu::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
.ah-dd-menu a{display:block;padding:10px 14px;border-radius:8px;font-size:15px;color:var(--ae-ink)}
.ah-dd-menu a:hover,.ah-dd-menu a[aria-current="page"]{background:rgba(56,68,124,.08);color:var(--ae-blue)}
@media (hover:hover) and (min-width:1181px){
  .ah-dd:hover .ah-dd-menu,.ah-dd:focus-within .ah-dd-menu{opacity:1;visibility:visible;transform:none}
  .ah-dd:hover .ah-dd-toggle::after{transform:translateY(1px) rotate(225deg)}
}
.ah-dd.is-open .ah-dd-menu{opacity:1;visibility:visible;transform:none}
.ah-login{margin-left:6px}
.ah-cta{margin-left:10px;height:44px;padding:0 22px;border-radius:999px;border:0;background:var(--ae-red);color:#fff;font:600 15px/1 "Inter",sans-serif;cursor:pointer;white-space:nowrap;transition:background .2s,transform .2s}
.ah-cta:hover{background:#bf2f2e}
.ah-burger{display:none;width:46px;height:46px;border:0;background:none;cursor:pointer;position:relative;flex:0 0 auto}
.ah-burger span{position:absolute;left:11px;right:11px;height:2px;border-radius:2px;background:var(--ae-ink);transition:transform .3s,opacity .2s}
.ah-burger span:nth-child(1){top:15px}.ah-burger span:nth-child(2){top:22px}.ah-burger span:nth-child(3){top:29px}
.ah-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.ah-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.ah-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:1180px){
  .ah-burger{display:block}
  .ah-nav{position:fixed;top:84px;left:0;right:0;max-height:calc(100vh - 84px);overflow-y:auto;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:8px clamp(16px,4vw,56px) 28px;border-bottom:1px solid var(--ae-line);box-shadow:0 30px 40px -30px rgba(20,26,51,.35);opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .25s,transform .25s,visibility .25s}
  .ah-nav.is-open{opacity:1;visibility:visible;transform:none}
  .ah-link,.ah-dd-toggle{width:100%;height:auto;padding:16px 0;border-radius:0;font-size:17px;justify-content:space-between;border-bottom:1px solid var(--ae-line)}
  .ah-link:hover,.ah-dd-toggle:hover,.ah-dd:focus-within>.ah-dd-toggle{background:none}
  .ah-dd-menu{position:static;min-width:0;box-shadow:none;padding:0 0 8px 12px;display:none;opacity:1;visibility:visible;transform:none;border-radius:0}
  .ah-dd.is-open .ah-dd-menu{display:block}
  .ah-dd.is-open .ah-dd-toggle::after{transform:translateY(1px) rotate(225deg)}
  .ah-login{margin-left:0}
  .ah-cta{margin:20px 0 0;height:52px;width:100%}
}
@media (max-width:560px){
  .ah-inner{height:72px}
  .ah-logo img{height:36px}
  .ah-nav{top:72px;max-height:calc(100vh - 72px)}
}

/* Footer */
.af-footer{background:#fff;color:var(--ae-ink);border-top:4px solid var(--ae-red);padding:80px 0 32px;font-size:15px;line-height:1.6}
.af-inner{max-width:1360px;margin:0 auto;padding:0 clamp(16px,4vw,56px)}
.af-grid{display:grid;grid-template-columns:1.5fr repeat(4,minmax(0,1fr));gap:40px}
.af-logo img{display:block;height:50px;width:auto}
.af-brand p{color:var(--ae-muted);margin:16px 0 20px;max-width:320px}
.af-footer h4{margin:0 0 16px;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ae-blue)}
.af-grid>div>a{display:block;padding:4px 0;color:var(--ae-ink);hyphens:auto;-webkit-hyphens:auto}
.af-footer a:hover{color:var(--ae-red)}
.af-contact{margin:0 0 8px;color:var(--ae-muted)}
.af-social{display:flex;gap:18px;flex-wrap:wrap}
.af-social a{color:var(--ae-ink);font-weight:500}
.af-cta{margin-top:16px;height:44px;padding:0 20px;border-radius:999px;border:0;background:var(--ae-red);color:#fff;font:600 14px/1 "Inter",sans-serif;cursor:pointer}
.af-cta:hover{background:#bf2f2e}
.af-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-top:64px;padding-top:24px;border-top:1px solid var(--ae-line);color:var(--ae-muted);font-size:13px}
.af-bottom nav{display:flex;gap:20px;flex-wrap:wrap}
.af-bottom a{color:var(--ae-muted)}
@media (max-width:1000px){
  .af-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .af-brand{grid-column:1 / -1}
}
@media (max-width:480px){
  .af-grid{grid-template-columns:1fr}
}

/* Abstandshalter für Seiten, deren Inhalt nicht selbst unter dem fixen Header beginnt */
.ah-spacer{height:84px}
@media (max-width:560px){.ah-spacer{height:72px}}
