
:root{--navy:#092b49;--navy2:#0075bb;--yellow:#009ee0;--ink:#132b3e;--muted:#607181;--pale:#f3f7fa;--line:#dce5eb;--white:#fff;--max:1160px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;color:var(--ink);font-family:Arial,sans-serif;line-height:1.65}a{color:inherit;text-decoration:none}.container{width:min(var(--max),calc(100% - 42px));margin-inline:auto}.skip-link{position:absolute;left:-9999px;top:0;background:#fff;padding:10px;z-index:100}.skip-link:focus{left:10px}.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.97);border-bottom:1px solid #e6edf1;backdrop-filter:blur(12px)}.nav-wrap{height:82px;display:flex;align-items:center;justify-content:space-between;gap:25px}.brand{display:flex;align-items:center;gap:12px;color:var(--navy)}.brand strong{display:block;font:800 29px/1 Arial,sans-serif;letter-spacing:.03em}.brand small{display:block;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#617487;margin-top:5px}.brand-mark{width:43px;height:36px;position:relative;display:block;border-bottom:4px solid var(--yellow);transform:skew(-16deg)}.brand-mark span{position:absolute;bottom:4px;left:4px;width:10px;height:24px;background:var(--navy);transform:skew(-10deg)}.brand-mark span:nth-child(2){left:17px;height:29px}.brand-mark span:nth-child(3){left:30px;height:19px}.navigation{display:flex;align-items:center;gap:30px;font-size:14px;font-weight:700}.navigation a:not(.nav-cta):hover{color:#0077b6}.nav-cta{background:var(--navy);color:white;padding:12px 18px;border-radius:7px}.menu-toggle{display:none;border:1px solid var(--line);background:white;border-radius:7px;padding:8px 12px;color:var(--navy);font-weight:700}.hero{min-height:590px;display:flex;align-items:center;position:relative;isolation:isolate;color:white;background:#193c52 url("assets/solar-roof.svg") center/cover no-repeat}.hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(4,26,44,.92) 0%,rgba(4,26,44,.79) 40%,rgba(4,26,44,.08) 100%)}.hero-content{padding-top:65px;padding-bottom:65px}.eyebrow{font-size:11px;letter-spacing:.19em;font-weight:800;color:var(--yellow);margin:0 0 18px}.eyebrow.dark{color:#0077b6}.hero h1,.section h2,.contact-section h2{font-family:Arial,sans-serif;line-height:1.08;letter-spacing:-.04em}.hero h1{font-size:clamp(43px,6vw,74px);margin:0 0 22px;max-width:720px}.hero h1 span{color:var(--yellow)}.hero-copy{max-width:565px;font-size:18px;color:#e6edf2;margin:0 0 29px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px}.button{display:inline-flex;align-items:center;justify-content:center;gap:13px;padding:14px 21px;border:0;border-radius:6px;font:700 14px Arial,sans-serif;cursor:pointer;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.button-primary{background:var(--yellow);color:#102b40}.button-primary:hover{background:#46baf0}.button-ghost{border:1px solid rgba(255,255,255,.65);color:white;background:rgba(255,255,255,.06)}.hero-note{margin-top:30px;color:#e8eef2;font-size:13px}.sun-dot{color:var(--yellow);font-size:19px;margin-right:8px}.section{padding:88px 0}.intro{background:#fff}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.section h2,.contact-section h2{font-size:clamp(32px,4vw,47px);margin:0 0 18px}.intro h2 span{color:#0077b6}.intro-grid>p{color:var(--muted);font-size:17px;margin:0}.services-section{background:var(--pale)}.section-heading{text-align:center;max-width:650px;margin:0 auto 38px}.section-heading .eyebrow{margin-bottom:10px}.section-heading p:last-child{color:var(--muted);margin:0}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.service-card{background:white;padding:29px;border:1px solid #e4ebef;border-radius:10px;min-height:260px;box-shadow:0 5px 20px rgba(8,43,73,.025);transition:transform .2s,box-shadow .2s}.service-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(8,43,73,.09)}.service-icon{width:46px;height:46px;display:grid;place-items:center;background:#e2f5ff;border-radius:9px;color:#0077b6;font-size:27px;font-weight:700}.service-card h3{font:800 20px Arial,sans-serif;margin:19px 0 9px}.service-card p{color:var(--muted);font-size:14px;margin:0 0 18px}.service-card>a{font-size:13px;font-weight:800;color:var(--navy)}.service-card>a span{color:#008fd0;margin-left:5px}.service-card-highlight{background:var(--navy);color:white}.service-card-highlight p{color:#d4e0e8}.service-card-highlight>a{color:var(--yellow)}.service-card-highlight .service-icon{background:rgba(255,201,40,.15);color:var(--yellow)}.benefits{background:var(--navy);color:white}.benefits-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}.benefits-copy h2{max-width:430px}.benefits-copy>p:not(.eyebrow){color:#cbd8e1;max-width:480px;margin-bottom:27px}.benefit-list{border-top:1px solid rgba(255,255,255,.2)}.benefit{display:flex;gap:22px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.2)}.benefit>span{font:800 20px Manrope;color:var(--yellow);padding-top:1px}.benefit h3{font:700 17px Manrope;margin:0 0 4px}.benefit p{margin:0;color:#cbd8e1;font-size:14px}.projects-section{background:#fff}.projects-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:90px;align-items:center}.projects-grid>div:first-child>p:last-child{color:var(--muted);max-width:590px}.project-steps{display:grid;gap:14px}.project-steps>div{display:flex;gap:17px;align-items:center;background:var(--pale);padding:16px;border-radius:8px}.project-steps span{flex:0 0 38px;height:38px;border-radius:50%;background:var(--yellow);display:grid;place-items:center;color:var(--navy);font-weight:800}.project-steps p{margin:0;color:var(--muted);font-size:13px}.project-steps strong{color:var(--ink);font-size:15px}.contact-section{background:#0c304d;color:white;padding:82px 0}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}.contact-section h2{font-size:clamp(35px,4vw,49px)}.contact-section>div>div>p:not(.eyebrow){color:#cbd8e1;max-width:460px}.contact-placeholder{display:flex;align-items:center;gap:15px;margin-top:22px}.contact-placeholder>span{width:43px;height:43px;display:grid;place-items:center;background:rgba(255,201,40,.15);color:var(--yellow);border-radius:7px;font-size:22px}.contact-placeholder small,.contact-placeholder strong{display:block}.contact-placeholder small{font-size:12px;color:#cbd8e1}.contact-placeholder strong{font-size:14px}.contact-form{background:white;color:var(--ink);border-radius:11px;padding:29px;box-shadow:0 20px 60px rgba(0,0,0,.15)}.contact-form h3{font:800 23px Manrope;margin:0 0 3px}.form-hint{font-size:12px;color:#6c7b87;margin:0 0 18px}.contact-form label{display:block;font-size:13px;font-weight:700;margin:13px 0 5px}.contact-form input,.contact-form select,.contact-form textarea{width:100%;font:14px Arial,sans-serif;border:1px solid #d5dfe6;border-radius:6px;padding:12px;color:var(--ink);background:#fff}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:2px solid #009ee0;outline-offset:1px}.contact-form textarea{resize:vertical}.contact-form button{margin-top:17px;width:100%}.form-message{font-size:13px;color:#526c7b}.site-footer{background:#061e32;color:white}.footer-top{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:30px 0}.brand-footer{color:white}.brand-footer small{color:#b9c9d5}.footer-top>p{color:#b9c9d5;font-size:13px}.footer-links{display:flex;gap:20px;font-size:13px}.footer-links a:hover{color:var(--yellow)}.footer-bottom{display:flex;justify-content:space-between;padding:15px 0;border-top:1px solid rgba(255,255,255,.15);font-size:12px;color:#9eb0be}
@media(max-width:850px){.navigation{gap:16px}.navigation a{font-size:12px}.nav-cta{padding:10px 12px}.hero{min-height:540px}.intro-grid,.benefits-grid,.projects-grid,.contact-grid{gap:40px}.service-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.container{width:min(var(--max),calc(100% - 32px))}.nav-wrap{height:72px}.brand strong{font-size:25px}.brand-mark{transform:scale(.9) skew(-16deg);transform-origin:left center;width:37px}.menu-toggle{display:block}.navigation{display:none;position:absolute;top:72px;left:0;right:0;padding:16px;background:white;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0}.navigation.open{display:flex}.navigation a{font-size:14px;padding:12px 10px}.navigation .nav-cta{text-align:center;margin-top:7px}.hero{min-height:590px;background-position:60% center}.hero-shade{background:linear-gradient(90deg,rgba(4,26,44,.93),rgba(4,26,44,.72))}.hero-content{padding-top:58px;padding-bottom:50px}.hero-copy{font-size:16px}.hero-actions{align-items:stretch;flex-direction:column;max-width:310px}.button{padding:14px 16px}.section{padding:64px 0}.intro-grid,.benefits-grid,.projects-grid,.contact-grid{grid-template-columns:1fr;gap:25px}.intro-grid>p{font-size:15px}.service-grid{grid-template-columns:1fr}.service-card{min-height:unset;padding:24px}.section-heading{text-align:left;margin-bottom:28px}.benefits-grid{gap:35px}.contact-section{padding:62px 0}.contact-form{padding:22px}.footer-top{align-items:flex-start;flex-direction:column;gap:14px}.footer-top>p{margin:0}.footer-links{flex-wrap:wrap;gap:16px}.footer-bottom{gap:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* BPA 2026: visual refinement */
:root{--navy:#005b9f;--navy2:#0075bb;--yellow:#009ee0;--ink:#102c42;--pale:#f4f7f8}
body{letter-spacing:-.005em}
.site-header{box-shadow:0 5px 24px rgba(7,37,57,.055)}
.brand strong{letter-spacing:.095em}
.hero{min-height:660px;background-position:center 49%}
.hero-shade{background:linear-gradient(90deg,rgba(4,27,44,.96) 0%,rgba(5,32,51,.85) 36%,rgba(5,32,51,.28) 75%,rgba(5,32,51,.12) 100%)}
.hero h1{font-size:clamp(44px,6vw,78px);max-width:850px}
.hero-copy{max-width:580px}
.hero-content{padding-top:85px;padding-bottom:90px}
.button{border-radius:8px}
.section-heading{margin-bottom:44px}
.service-card{border-radius:14px;box-shadow:0 12px 36px rgba(7,37,57,.045)}
.service-card h3{letter-spacing:-.025em}
.benefits{background:linear-gradient(120deg,#005b9f,#008bd0)}
.contact-section{background:linear-gradient(140deg,#005b9f,#0079bb)}
.contact-form{border-radius:16px}
.nav-cta{border-radius:8px}
@media(max-width:650px){.hero{min-height:590px}.hero-shade{background:linear-gradient(90deg,rgba(4,27,44,.94),rgba(5,32,51,.74))}.hero-content{padding-top:65px;padding-bottom:65px}}

/* BPA: kräftiges Hellblau und Dunkelblau */
.hero h1 span{color:#40bfff}.eyebrow{color:#55c8ff}.button-primary{color:#fff}.service-card-highlight{background:#005b9f}.service-card-highlight>a{color:#90dcff}.brand-mark{border-bottom-color:#009ee0}.hero-note .sun-dot{color:#55c8ff}

/* BPA Farbschema: Blau mit roten Akzenten */
:root { --accent-red:#e30613; }
.brand-mark { border-bottom-color:var(--accent-red); }
.navigation a:not(.nav-cta):hover { color:var(--accent-red); }
.hero h1 span { color:#ffffff; text-decoration:underline; text-decoration-color:var(--accent-red); text-decoration-thickness:5px; text-underline-offset:12px; }
.hero-note .sun-dot { color:var(--accent-red); }
.button-primary { background:#009ee0; color:white; }
.button-primary:hover { background:#007bb6; }
.service-card>a span { color:var(--accent-red); }
.service-icon { border-bottom:3px solid var(--accent-red); }
.benefit>span { color:#ff626b; }
.project-steps span { background:var(--accent-red); color:white; }
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { outline-color:#009ee0; }

/* BPA – Kontaktbereich komplett rot, Formular weiß */
.contact-section {
  background: #e30613;
  color: #fff;
}
.contact-section .eyebrow { color: #fff; }
.contact-section .contact-placeholder small { color: #ffe8ea; }
.contact-placeholder > span {
  background: rgba(255,255,255,.2);
  color: #fff;
}
.contact-form { background: #fff; color: #102c42; }
.contact-form .button-primary { background: #005b9f; color: #fff; }
.contact-form .button-primary:hover { background: #0077b6; }

/* BPA – Kontaktbereich: überwiegend Blau, dezente rote Akzente */
.contact-section {
  background: linear-gradient(140deg, #08283f 0%, #153e59 100%);
  color: #fff;
}
.contact-section .eyebrow {
  color: #fff;
  border-left: 4px solid #e30613;
  padding-left: 12px;
}
.contact-section .contact-placeholder small { color: #cbd8e1; }
.contact-placeholder > span {
  background: rgba(255,255,255,.12);
  color: #fff;
  border-left: 3px solid #e30613;
}
.contact-form {
  background: #fff;
  color: #102c42;
  border-top: 5px solid #e30613;
}
.contact-form .button-primary {
  background: #005b9f;
  color: #fff;
}
.contact-form .button-primary:hover { background: #0077b6; }

/* Dezenter Admin-Zugang in der Hauptnavigation */
.navigation .admin-link{font-size:12px;font-weight:700;color:#005b9f;border:1px solid #d6e2ea;border-radius:7px;padding:9px 13px;background:#f5f8fa;white-space:nowrap}
.navigation .admin-link:hover{background:#e9f2f8;color:#003e70}
@media(max-width:650px){.navigation .admin-link{text-align:center;margin-top:8px;padding:12px}}

/* BPA – Kontaktbereich: überwiegend Blau, dezente rote Akzente */
.contact-section {
  background: linear-gradient(140deg, #08283f 0%, #153e59 100%);
  color: #fff;
}
.contact-section .eyebrow {
  color: #fff;
  border-left: 4px solid #e30613;
  padding-left: 12px;
}
.contact-section .contact-placeholder small { color: #cbd8e1; }
.contact-placeholder > span {
  background: rgba(255,255,255,.12);
  color: #fff;
  border-left: 3px solid #e30613;
}
.contact-form {
  background: #fff;
  color: #102c42;
  border-top: 5px solid #e30613;
}
.contact-form .button-primary {
  background: #005b9f;
  color: #fff;
}
.contact-form .button-primary:hover { background: #0077b6; }

/* Neues BPA-Logo – responsive, dezente animierte Sonne im Kopfbereich */
.site-header .brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0}
.bpa-brand-word{display:inline-flex;align-items:center;white-space:nowrap;font-weight:900;font-size:clamp(24px,2.5vw,36px);letter-spacing:-.05em;line-height:1;color:#005b9f}
.bpa-brand-word .bpa-spinning-sun{display:inline-block;color:#e6aa00;font-size:.56em;letter-spacing:0;margin:0 .04em;animation:bpaSunSpin 16s linear infinite;transform-origin:center}
.bpa-brand-panel{font-size:.58em;color:#009ee0;margin:0 .03em;letter-spacing:0}
.bpa-brand-caption{display:block;max-width:155px;font-size:10px;font-weight:750;line-height:1.25;letter-spacing:.03em;color:#005b9f;text-transform:uppercase}
@keyframes bpaSunSpin{to{transform:rotate(360deg)}}
.bpa-logo-showcase{background:#fff;padding:32px 0 28px}
.bpa-logo-showcase .container{max-width:1080px}
.bpa-logo-showcase img{display:block;width:100%;height:auto;object-fit:contain}
@media(max-width:700px){.bpa-logo-showcase{padding:16px 0}.bpa-brand-caption{font-size:9px;max-width:105px}.bpa-brand-word{font-size:25px}}
@media(prefers-reduced-motion:reduce){.bpa-brand-word .bpa-spinning-sun{animation:none}}

/* BPA: sanft rotierende Sonnenstrahlen über die gesamte Menüleiste */
.site-header {
  position: sticky;
  isolation: isolate;
  overflow: clip;
  background: linear-gradient(100deg,#f2f8ff 0%,#ffffff 42%,#f1f8ff 100%);
}
.site-header::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  width: 210vw;
  height: 210vw;
  min-width: 1700px;
  min-height: 1700px;
  left: 50%;
  top: 50%;
  background: repeating-conic-gradient(from 0deg, rgba(255,189,44,.21) 0deg 3deg, rgba(255,189,44,0) 3deg 12deg, rgba(0,158,224,.065) 12deg 14deg, transparent 14deg 24deg);
  transform: translate(-50%,-50%) rotate(0deg);
  animation: bpaHeaderRays 70s linear infinite;
}
.site-header::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at 37% 50%, rgba(255,214,103,.26), transparent 55%);
}
.site-header .nav-wrap { position: relative; z-index: 1; }
@keyframes bpaHeaderRays {
  from { transform: translate(-50%,-50%) rotate(0deg); }
  to { transform: translate(-50%,-50%) rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  .site-header::before { animation: none; }
}
