/*
Theme Name:   Astra Child BLM
Theme URI:    https://blm-media.de/
Description:  Child-Theme für BLM Media & Eventtechnik. Eigene Anpassungen gehören
              hierher, damit sie ein Astra-Update überleben.
Author:       besser brinkmann
Author URI:   https://besser-brinkmann.de/
Template:     astra
Version:      1.0.0
Text Domain:  astra-child-blm
*/

/* ==========================================================================
   Eigene Anpassungen ab hier.
   Nichts an Astra selbst ändern, das wird beim nächsten Update überschrieben.
   ========================================================================== */

/* ==========================================================================
   KOPF
   Logo links, Menü, Telefon und Anfrage-Knopf rechts. Eine Schrift (Karla),
   Türkis aus dem Logo nur für Linie, Knopf und aktiven Zustand.
   ========================================================================== */
:root {
  --blm-ink: #15181a;
  --blm-mute: #5b6266;
  --blm-line: #e2e6e8;
  --blm-prim: #52bfd3;
  --blm-prim-dd: #1b6e80;
}
.ast-primary-header-bar { border-bottom-width: 3px !important; }

/* Hauptpunkte */
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) > .menu-item > .menu-link {
  font: 500 13.5px/1 Karla, "Segoe UI", Arial, sans-serif;
  text-transform: uppercase; letter-spacing: .14em; color: var(--blm-ink);
  padding: 0 16px; position: relative;
  /* volle Leistenhöhe, damit Untermenüs an der Unterkante der Kopfleiste ansetzen */
  min-height: 95px; display: flex; align-items: center;
}
.ast-desktop #ast-hf-menu-1-sticky > .menu-item > .menu-link { min-height: 78px; }
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) > .menu-item > .menu-link::after {
  content: ""; position: absolute; left: 16px; right: 16px; bottom: calc(50% - 16px); height: 2px;
  background: var(--blm-prim); transform: scaleX(0); transform-origin: left; transition: transform .3s cubic-bezier(.22,.9,.3,1);
}
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) > .menu-item:hover > .menu-link,
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) > .menu-item.current-menu-item > .menu-link,
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) > .menu-item.current-menu-ancestor > .menu-link { color: var(--blm-ink); }
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) > .menu-item:hover > .menu-link::after,
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) > .menu-item.current-menu-item > .menu-link::after,
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) > .menu-item.current-menu-ancestor > .menu-link::after { transform: scaleX(1); }
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) .dropdown-menu-toggle { display: none; }
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) > .menu-item-has-children > .menu-link { padding-right: 16px; }

/* Untermenüs: weiße Fläche, feine Linie, türkise Oberkante */
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) .sub-menu {
  background: #fff; border: 1px solid var(--blm-line) !important; border-top: 3px solid var(--blm-prim) !important;
  box-shadow: none !important; border-radius: 0; padding: 18px 0; min-width: 290px; margin-top: 0;
}
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) .sub-menu .menu-link {
  font: 400 16px/1.3 Karla, "Segoe UI", Arial, sans-serif; text-transform: none; letter-spacing: 0;
  color: var(--blm-ink); padding: 9px 28px; border: 0 !important; background: transparent !important;
  transition: color .2s, padding .3s cubic-bezier(.22,.9,.3,1);
}
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) .sub-menu .menu-item:hover > .menu-link { color: var(--blm-prim-dd); padding-left: 34px; }
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) .sub-menu .current-menu-item > .menu-link { color: var(--blm-prim-dd); }
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) .sub-menu .menu-item { border: 0 !important; }

/* Verleih: zwei Spalten, so breit wie nötig */
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) > .astra-megamenu-li { position: relative; }
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) > .astra-megamenu-li > .astra-megamenu {
  width: 600px !important; left: -12px !important; right: auto !important;
  display: grid; grid-template-columns: 1fr 1fr; padding: 26px 12px 22px;
}
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) .astra-megamenu > .menu-item { width: auto !important; padding: 0 !important; }
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) .astra-megamenu .sub-menu { border: 0 !important; padding: 0; min-width: 0; }
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) .astra-megamenu .menu-item-heading > .menu-link {
  font: 500 11.5px/1 Karla, "Segoe UI", Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .2em;
  color: var(--blm-prim-dd) !important; padding: 0 28px 12px !important; cursor: default;
}
.ast-desktop :is(#ast-hf-menu-1, #ast-hf-menu-1-sticky) .astra-megamenu .menu-item-heading:hover > .menu-link { padding-left: 28px !important; }

/* Telefon und Anfrage */
.ast-header-html-1 .ast-builder-html-element a {
  font: 500 15px/1 Karla, "Segoe UI", Arial, sans-serif; color: var(--blm-ink); text-decoration: none; letter-spacing: .02em;
  padding-left: 22px; border-left: 1px solid var(--blm-line); margin-left: 6px; white-space: nowrap;
}
.ast-header-html-1 .ast-builder-html-element a:hover { color: var(--blm-prim-dd); }
.ast-header-html-1 .ast-builder-html-element p { margin: 0; }
.ast-header-button-1 .ast-custom-button {
  background: var(--blm-prim) !important; color: #fff !important; border: 0 !important; border-radius: 2px !important;
  font: 500 13px/1 Karla, "Segoe UI", Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .16em !important;
  padding: 15px 24px !important; transition: background .25s, color .25s;
}
.ast-header-button-1 .ast-custom-button-link:hover .ast-custom-button,
.ast-header-button-1 .ast-custom-button-link:focus-visible .ast-custom-button { background: var(--blm-ink) !important; color: #fff !important; }

/* Handy: Menü als ruhige Liste, Knopf über die ganze Breite */
.ast-mobile-popup-drawer .ast-mobile-popup-inner { background: #fff; }
#ast-hf-mobile-menu { background: #fff !important; }
#ast-hf-mobile-menu .menu-item { border-color: var(--blm-line) !important; }
#ast-hf-mobile-menu > .menu-item > .menu-link {
  font: 700 21px/1.2 Rubik, "Segoe UI", Arial, sans-serif; text-transform: none; letter-spacing: -.01em;
  color: var(--blm-ink); background: #fff !important; padding-top: 18px; padding-bottom: 18px; border-color: var(--blm-line) !important;
}
#ast-hf-mobile-menu .sub-menu .menu-link {
  font: 400 17px/1.3 Karla, "Segoe UI", Arial, sans-serif; text-transform: none; letter-spacing: 0;
  color: var(--blm-ink); background: #fff !important; border-color: var(--blm-line) !important;
}
#ast-hf-mobile-menu .menu-item-heading > .menu-link {
  font: 500 12px/1 Karla, "Segoe UI", Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .2em; color: var(--blm-prim-dd) !important;
}
#ast-hf-mobile-menu .ast-menu-toggle { color: var(--blm-ink); }
/* Pfeile mittig zur Zeile, Astra schiebt sie mit top und margin nach unten */
#ast-hf-mobile-menu .ast-menu-toggle { top: 0 !important; display: flex; align-items: center; justify-content: center; line-height: 1; }
#ast-hf-mobile-menu > .menu-item > .ast-menu-toggle { height: 62px; }
#ast-hf-mobile-menu .menu-item-heading > .ast-menu-toggle { height: 43px; }
#ast-hf-mobile-menu .ast-menu-toggle .ast-icon { display: flex; }
#ast-hf-mobile-menu .ast-menu-toggle svg { margin: 0 !important; }
.ast-mobile-popup-content .ast-header-button-1 { width: 100%; padding: 0 20px; margin-top: 24px; }
.ast-mobile-popup-content .ast-header-button-1 .ast-custom-button-link, .ast-mobile-popup-content .ast-header-button-1 .ast-custom-button { display: block; width: 100%; text-align: center; }
.ast-mobile-popup-content .ast-header-html-1 { padding: 0 20px; margin-top: 18px; }
.ast-mobile-popup-content .ast-header-html-1 .ast-builder-html-element a { border: 0; padding: 0; margin: 0; font-size: 18px; }
.ast-mobile-popup-content .ast-header-button-1 .ast-builder-button-wrap,
.ast-mobile-popup-content .ast-header-button-1 .ast-custom-button-link { width: 100%; }
.ast-mobile-popup-content .ast-header-button-1 .ast-custom-button { padding: 19px 24px !important; }

/* ==========================================================================
   FUSS
   ========================================================================== */
.blm-fuss { background: #f3f5f6; border-top: 1px solid var(--blm-line); color: #2a2f32; font: 400 15.5px/1.6 Karla, "Segoe UI", Arial, sans-serif; }
.blm-fuss-innen {
  max-width: calc(1296px + 2 * clamp(20px, 4vw, 48px)); margin: 0 auto;
  padding: clamp(56px, 7vw, 96px) clamp(20px, 4vw, 48px) clamp(40px, 5vw, 64px);
  display: grid; grid-template-columns: 1.35fr 1fr 1fr .9fr 1fr; gap: clamp(28px, 3.5vw, 56px);
}
.blm-fuss-logo img { width: 170px; height: auto; display: block; }
.blm-fuss-motto { font: 700 1.25rem/1.15 Rubik, "Segoe UI", Arial, sans-serif; text-transform: uppercase; letter-spacing: -.02em; color: var(--blm-ink); margin: 22px 0 10px !important; }
.blm-fuss p { margin: 0 0 14px; }
.blm-fuss-marke > p:not(.blm-fuss-motto) { color: var(--blm-mute); max-width: 30ch; }
.blm-fuss-knopf {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 8px; background: var(--blm-prim); color: #fff !important;
  text-decoration: none; padding: 14px 22px; border-radius: 2px; font: 500 13px/1 Karla, Arial, sans-serif; text-transform: uppercase; letter-spacing: .16em;
  transition: background .25s, color .25s;
}
.blm-fuss-knopf svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.blm-fuss-knopf:hover, .blm-fuss-knopf:focus-visible { background: var(--blm-ink); color: #fff !important; }
.blm-fuss-titel { font: 500 11.5px/1 Karla, Arial, sans-serif !important; text-transform: uppercase; letter-spacing: .2em; color: var(--blm-prim-dd); margin-bottom: 18px !important; }
.blm-fuss ul { list-style: none; margin: 0; padding: 0; }
.blm-fuss li { margin: 0 0 9px; }
.blm-fuss a { color: var(--blm-ink); text-decoration: none; transition: color .2s; }
.blm-fuss a:hover, .blm-fuss a:focus-visible { color: var(--blm-prim-dd); }
.blm-fuss address { font-style: normal; margin: 0 0 14px; }
.blm-fuss-sozial { display: flex; gap: 18px; }
.blm-fuss-sozial a { border-bottom: 1.5px solid var(--blm-prim); padding-bottom: 2px; }
/* Astras Zeile darunter: Copyright und Rechtliches */
.site-below-footer-wrap { background: #f3f5f6 !important; border-top: 1px solid var(--blm-line) !important; }
.site-below-footer-wrap, .site-below-footer-wrap a { font: 400 14px/1.5 Karla, Arial, sans-serif !important; color: var(--blm-mute) !important; }
.site-below-footer-wrap a:hover { color: var(--blm-prim-dd) !important; }
/* Gleiche Kante wie der Fuß darüber */
.site-below-footer-wrap .ast-builder-grid-row {
  max-width: min(1296px, calc(100vw - 2 * clamp(20px, 4vw, 48px))) !important; padding-left: 0 !important; padding-right: 0 !important;
}
@media (max-width: 1100px) { .blm-fuss-innen { grid-template-columns: 1fr 1fr 1fr; } .blm-fuss-marke { grid-column: 1 / -1; } }
@media (max-width: 640px) { .blm-fuss-innen { grid-template-columns: 1fr 1fr; } .blm-fuss-kontakt { grid-column: 1 / -1; } }
