/* BandFactory — theme-wide brand CSS.
   Loaded on EVERY page/post (front-end + editor). Only put rules here that
   should apply site-wide. Design tokens come from theme.json and are consumed
   via the --wp--preset--* variables WordPress generates from it.
   Section-specific styling (e.g. the hero) stays in its own scoped file. */

/* ---------- Buttons: upgrade theme.json's solid orange to the brand gradient ---------- */
.wp-block-button__link,
.wp-element-button{
  background:var(--wp--preset--gradient--orange-cta);
  box-shadow:0 14px 32px rgba(255,122,0,.5), inset 0 1px 0 rgba(255,255,255,.45);
  transition:transform .16s ease, box-shadow .16s ease;
}
.wp-block-button__link:hover,
.wp-element-button:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 44px rgba(255,122,0,.66);
}
.wp-block-button__link:focus-visible,
.wp-element-button:focus-visible{
  outline:3px solid var(--wp--preset--color--white);
  outline-offset:3px;
}

/* ---------- Links: smooth brand colour transition (colours set in theme.json) ---------- */
a{ transition:color .15s ease; }

/* ---------- Branded site header (applies on all pages) ---------- */
.bf-site-header{
  background:rgba(5,10,31,.72);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  position:sticky;top:0;z-index:100;border-bottom:1px solid rgba(255,255,255,.1);
}
.bf-site-header .wp-block-group{padding:14px 28px}
.bf-site-header .wp-block-site-title a,
.bf-site-header .wp-block-site-title{
  font-family:var(--wp--preset--font-family--display);
  font-weight:900;font-size:22px;letter-spacing:-.01em;
  color:var(--wp--preset--color--white);text-decoration:none;
}
/* Header right cluster: Konfigurator link + WhatsApp button + flag dropdown */
.bf-header-actions{display:flex;align-items:center;gap:16px;font-family:var(--wp--preset--font-family--body)}
.bf-header-actions .bf-nav-link{color:rgba(255,255,255,.86);font-weight:600;font-size:15px;text-decoration:none;white-space:nowrap}
.bf-header-actions .bf-nav-link:hover{color:var(--wp--preset--color--white)}

/* "WhatsApp Beratung" button — green outline (ghost), so it reads as a strong
   secondary CTA without competing with the solid orange "Jetzt gestalten". */
.bf-wa-btn{display:inline-flex;align-items:center;gap:8px;
  background:transparent;color:#25d366;font-weight:800;font-size:14px;text-decoration:none;
  padding:8px 15px;border:1.5px solid #25d366;border-radius:999px;white-space:nowrap;
  transition:background .15s ease,color .15s ease,border-color .15s ease}
.bf-wa-btn:hover{background:rgba(37,211,102,.12);color:#2ee06f;border-color:#2ee06f}
.bf-wa-btn .bf-wa-ico{flex:none}

/* Flag-only language dropdown (native <details>, no JS) */
.bf-lang{position:relative}
.bf-lang summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;
  padding:6px 9px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06)}
.bf-lang summary::-webkit-details-marker{display:none}
.bf-lang .bf-flag{display:block;width:22px;height:15px;border-radius:2px;object-fit:cover;box-shadow:0 0 0 1px rgba(0,0,0,.18)}
.bf-lang .bf-caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid rgba(255,255,255,.7);transition:transform .15s}
.bf-lang[open] .bf-caret{transform:rotate(180deg)}
.bf-lang ul{position:absolute;right:0;top:calc(100% + 8px);z-index:120;margin:0;padding:6px;list-style:none;
  background:rgba(8,13,38,.96);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.14);border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.5);
  display:grid;gap:2px;min-width:max-content}
.bf-lang ul a{display:flex;align-items:center;padding:7px 10px;border-radius:8px}
.bf-lang ul a:hover{background:rgba(255,255,255,.10)}

.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media (max-width:600px){
  .bf-header-actions{gap:10px}
  .bf-wa-btn{padding:9px 11px}
  .bf-wa-btn span{display:none}            /* nur das WhatsApp-Icon auf kleinen Screens */
}

/* Kein horizontales Scrollen (fixed width): clippt seitliche Ueberbreite von
   100vw-/alignfull-Elementen inkl. Scrollbar-Breite. clip (nicht hidden!)
   erzeugt keinen Scroll-Container -> position:sticky (Header) bleibt intakt. */
html{overflow-x:clip}