/* ============================================================
   bimobil header — transparent over a hero, cream-solid on scroll,
   with a meganav. Behaviour adapted from the Gerhardt shell:
   • .scrolled (past 40px) -> solid + 84% height compress
   • .is-mega-open -> forces the solid look (mega + strip = one surface)
   • logo white via filter:invert at rest, dark when solid
   • a dark top-fade in the transparent state (legible over any hero)
   Static Kontakt CTA (no dynamic swap).
   ============================================================ */
:root{ --bmb-hdr-h:84px; }

.bmb-header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  height:var(--bmb-hdr-h);
  display:flex; align-items:center;
  padding:0 clamp(1.2rem,4vw,3rem);
  color:var(--navy);
  background:rgba(240,236,231,0.94);
  -webkit-backdrop-filter:saturate(160%) blur(14px); backdrop-filter:saturate(160%) blur(14px);
  box-shadow:0 1px 0 rgba(0,0,0,.05),0 8px 20px -14px rgba(0,0,0,.15);
  transition:height .35s cubic-bezier(.4,0,.2,1),background .35s cubic-bezier(.4,0,.2,1),color .35s cubic-bezier(.4,0,.2,1),box-shadow .35s cubic-bezier(.4,0,.2,1);
}
/* transparent over hero — NO blur/bar, just a soft dark fade (Porsche style, bimobil navy) */
body.has-transparent-header .bmb-header{ background:transparent; -webkit-backdrop-filter:none; backdrop-filter:none; box-shadow:none; color:#fff; }
.bmb-header::before{
  content:''; position:absolute; top:0; left:0; right:0; height:240px; z-index:-1; pointer-events:none;
  background:linear-gradient(to bottom, rgba(26,31,54,.72) 0%, rgba(26,31,54,.30) 48%, rgba(26,31,54,0) 100%);
  opacity:0; transition:opacity .35s;
}
body.has-transparent-header .bmb-header::before{ opacity:1; }
body.has-transparent-header .bmb-header.scrolled::before,
body.has-transparent-header .bmb-header.is-mega-open::before{ opacity:0; }
/* solid on scroll OR mega open */
body.has-transparent-header .bmb-header.scrolled,
body.has-transparent-header .bmb-header.is-mega-open{
  background:rgba(240,236,231,0.96);
  -webkit-backdrop-filter:saturate(160%) blur(14px); backdrop-filter:saturate(160%) blur(14px);
  box-shadow:0 1px 0 rgba(0,0,0,.05),0 8px 20px -14px rgba(0,0,0,.15);
  color:var(--navy);
}
.bmb-header.is-mega-open{ background:rgba(240,236,231,0.98); }
.bmb-header.scrolled{ height:calc(var(--bmb-hdr-h)*0.84); }

.bmb-logo{ display:flex; align-items:center; text-decoration:none; }
.bmb-logo img{ display:block; height:32px; width:auto; transition:filter .35s; }
body.has-transparent-header .bmb-logo img{ filter:brightness(0) invert(1); }
body.has-transparent-header .bmb-header.scrolled .bmb-logo img,
body.has-transparent-header .bmb-header.is-mega-open .bmb-logo img{ filter:none; }

.bmb-nav{ margin-left:auto; display:flex; align-items:center; gap:2.4rem; height:100%; }
.bmb-nav__item{ display:flex; align-items:center; height:100%; }
.bmb-nav__item > a{
  font-family:var(--font-sans); font-size:1rem; font-weight:600; letter-spacing:.09em; text-transform:uppercase;
  color:inherit; text-decoration:none; position:relative; padding:.5rem 0; opacity:.85; transition:opacity .2s; cursor:pointer; white-space:nowrap;
}
.bmb-nav__item > a:hover{ opacity:1; }
.bmb-nav__item > a::after{
  content:''; position:absolute; left:0; right:0; bottom:-3px; height:2px; background:var(--copper);
  transform:scaleX(0); transform-origin:left; transition:transform .25s;
}
body.has-transparent-header .bmb-nav__item > a::after{ background:#fff; }
body.has-transparent-header .bmb-header.scrolled .bmb-nav__item > a::after,
body.has-transparent-header .bmb-header.is-mega-open .bmb-nav__item > a::after{ background:var(--copper); }
.bmb-nav__item.is-open > a::after{ transform:scaleX(1); }

.bmb-cta{
  margin-left:1.4rem; font-family:var(--font-sans); font-size:.82rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:#fff; background:var(--copper); border:1.5px solid var(--copper); padding:.6rem 1.25rem; text-decoration:none; white-space:nowrap;
  transition:background .2s,border-color .2s,color .2s;
}
.bmb-cta:hover{ background:#a5622e; border-color:#a5622e; }
body.has-transparent-header .bmb-header .bmb-cta{ background:transparent; border-color:rgba(255,255,255,.6); color:#fff; }
body.has-transparent-header .bmb-header.scrolled .bmb-cta,
body.has-transparent-header .bmb-header.is-mega-open .bmb-cta{ background:var(--copper); border-color:var(--copper); color:#fff; }

/* ---- mega ---- */
.bmb-mega{
  position:absolute; top:100%; left:0; right:0; z-index:99;
  background:rgba(240,236,231,0.98);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:0 14px 28px -14px rgba(0,0,0,.22); border-top:1px solid rgba(0,0,0,.06);
  opacity:0; visibility:hidden; transform:translateY(-6px);
  transition:opacity .3s,transform .3s,visibility .3s;
}
.bmb-header.is-mega-open .bmb-mega{ opacity:1; visibility:visible; transform:translateY(0); }
.bmb-mega__panel{
  position:absolute; top:0; left:0; right:0; opacity:0; visibility:hidden;
  display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; align-items:start;
  max-width:1180px; margin:0 auto; padding:2.4rem clamp(1.5rem,4vw,3rem) 2.8rem;
  transition:opacity .25s;
}
.bmb-mega__panel.is-active{ position:relative; opacity:1; visibility:visible; }
.bmb-mega__eyebrow{ font-family:var(--font-sans); font-size:.84rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--copper); margin-bottom:.55rem; }
.bmb-mega__links{ list-style:none; margin:0; padding:0; }
.bmb-mega__links a{
  display:block; text-decoration:none; color:var(--navy); font-family:var(--font-sans);
  font-size:1.25rem; font-weight:600; padding:.55rem 0; border-bottom:1px solid rgba(0,0,0,.07); transition:color .15s;
}
.bmb-mega__links a:hover{ color:#a5622e; }
.bmb-mega__links a span{ display:block; font-size:.82rem; font-weight:400; color:var(--text-light); margin-top:.15rem; letter-spacing:0; text-transform:none; }
.bmb-mega__image-wrap{ aspect-ratio:3/2; overflow:hidden; }
.bmb-mega__image{ width:100%; height:100%; object-fit:cover; display:block; }

/* ============================================================
   MOBILE — burger + full-screen accordion (<=1100px)
   Adapted from the Gerhardt shell, bimobil palette.
   ============================================================ */
.bmb-burger{
  display:none; align-items:center; justify-content:center;
  width:44px; height:44px; margin-left:auto;
  background:none; border:none; padding:0; cursor:pointer;
  color:var(--navy); position:relative; z-index:110;
  transition:color .35s cubic-bezier(.4,0,.2,1);
}
.bmb-burger__icon{ position:relative; width:24px; height:18px; display:block; }
.bmb-burger__icon::before,
.bmb-burger__icon > span,
.bmb-burger__icon::after{
  content:''; position:absolute; left:0; right:0; height:2px; background:currentColor;
  transition:transform .3s ease, top .3s ease, opacity .2s ease;
}
.bmb-burger__icon::before{ top:2px; }
.bmb-burger__icon > span{ top:8px; }
.bmb-burger__icon::after{ top:14px; }
body.is-menu-open .bmb-burger__icon::before{ top:8px; transform:rotate(45deg); }
body.is-menu-open .bmb-burger__icon > span{ opacity:0; transform:scaleX(0); }
body.is-menu-open .bmb-burger__icon::after{ top:8px; transform:rotate(-45deg); }
/* transparent page: burger white at rest, navy once the menu opens over the cream overlay */
body.has-transparent-header .bmb-burger{ color:#fff; }
body.has-transparent-header .bmb-header.scrolled .bmb-burger,
body.is-menu-open .bmb-burger{ color:var(--navy); }
body.has-transparent-header.is-menu-open .bmb-logo img{ filter:none; }

.bmb-mobile{
  position:fixed; inset:0; background:rgba(240,236,231,0.98);
  -webkit-backdrop-filter:saturate(180%) blur(14px); backdrop-filter:saturate(180%) blur(14px);
  z-index:80; opacity:0; visibility:hidden;
  transition:opacity .3s ease, visibility .3s ease; overflow-y:auto;
  padding:var(--bmb-hdr-h) 0 clamp(2rem,5vh,3rem);
}
.bmb-mobile.is-open{ opacity:1; visibility:visible; }
.bmb-mobile__inner{ max-width:640px; margin:0 auto; padding:clamp(1.5rem,4vw,2.5rem) clamp(1.5rem,4vw,3rem); }
.bmb-mobile__section{ border-bottom:1px solid rgba(0,0,0,.08); }
.bmb-mobile__toggle{
  display:flex; align-items:center; justify-content:space-between; width:100%;
  padding:1.35rem .25rem; background:none; border:none;
  font-family:var(--font-sans); font-size:1.3rem; font-weight:600; color:var(--navy);
  letter-spacing:.02em; text-transform:uppercase; cursor:pointer; text-align:left;
}
.bmb-mobile__icon{
  width:10px; height:10px; border-right:2px solid var(--copper); border-bottom:2px solid var(--copper);
  transform:rotate(45deg); transition:transform .3s ease; margin-right:.35rem; margin-bottom:4px; flex-shrink:0;
}
.bmb-mobile__section.is-open .bmb-mobile__icon{ transform:rotate(-135deg); margin-bottom:-4px; }
.bmb-mobile__sublist{
  list-style:none; padding:0; margin:0; max-height:0; overflow:hidden;
  transition:max-height .4s cubic-bezier(.4,0,.2,1), padding-bottom .4s cubic-bezier(.4,0,.2,1);
}
.bmb-mobile__section.is-open .bmb-mobile__sublist{ max-height:400px; padding-bottom:.75rem; }
.bmb-mobile__sublist li{ padding:.65rem .25rem; }
.bmb-mobile__sublist a{ color:var(--text-light); text-decoration:none; font-size:1.05rem; display:block; }
.bmb-mobile__sublist a:active,
.bmb-mobile__sublist a:hover{ color:var(--copper); }
body.is-menu-open{ overflow:hidden; }

@media (max-width:1100px){
  .bmb-nav{ display:none; }
  .bmb-mega{ display:none; }
  .bmb-burger{ display:flex; }
}
