.elementor-kit-6{--e-global-color-primary:#161B29;--e-global-color-secondary:#5B6476;--e-global-color-text:#3E4454;--e-global-color-accent:#E4E8F0;--e-global-color-1331621:#F3F2EF;--e-global-color-fe86ce8:#E9E8E6;--e-global-color-e326b05:#0D101A;--e-global-color-236224b:#AEB8CC;--e-global-color-5a758db:#C3CAD6;--e-global-color-b39a2b1:#939DB1;--e-global-color-a3da796:#F7F8FB;--e-global-color-6c14954:#C9D3E6;--e-global-color-3936946:#AEB8CC40;--e-global-color-96c839a:#161B2933;--e-global-typography-primary-font-family:"Federo";--e-global-typography-primary-font-size:42px;--e-global-typography-primary-font-weight:400;--e-global-typography-primary-text-transform:uppercase;--e-global-typography-primary-line-height:1.18em;--e-global-typography-primary-letter-spacing:3.4px;--e-global-typography-secondary-font-family:"Federo";--e-global-typography-secondary-font-size:22px;--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-text-transform:uppercase;--e-global-typography-secondary-letter-spacing:2.6px;--e-global-typography-text-font-family:"Josefin Sans";--e-global-typography-text-font-size:17px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Josefin Sans";--e-global-typography-accent-font-size:13px;--e-global-typography-accent-font-weight:600;--e-global-typography-accent-text-transform:uppercase;--e-global-typography-accent-line-height:1em;--e-global-typography-accent-letter-spacing:2.9px;--e-global-typography-0ad5435-font-family:"Josefin Sans";--e-global-typography-0ad5435-font-size:13px;--e-global-typography-0ad5435-font-weight:600;--e-global-typography-0ad5435-text-transform:uppercase;--e-global-typography-0ad5435-line-height:1.4em;--e-global-typography-0ad5435-letter-spacing:4.2px;--e-global-typography-a138f8b-font-family:"Josefin Sans";--e-global-typography-a138f8b-font-size:20px;--e-global-typography-a138f8b-font-weight:400;--e-global-typography-c3c1995-font-family:"Federo";--e-global-typography-c3c1995-font-size:36px;--e-global-typography-c3c1995-font-weight:400;--e-global-typography-c3c1995-text-transform:uppercase;--e-global-typography-c3c1995-letter-spacing:5px;--e-global-typography-8f82c37-font-family:"Josefin Sans";--e-global-typography-8f82c37-font-size:11px;--e-global-typography-8f82c37-font-weight:600;--e-global-typography-8f82c37-text-transform:uppercase;--e-global-typography-8f82c37-letter-spacing:2.6px;--e-global-typography-b3001e9-font-family:"Josefin Sans";--e-global-typography-b3001e9-font-size:30px;--e-global-typography-b3001e9-font-weight:300;--e-global-typography-b3001e9-font-style:italic;background-color:var( --e-global-color-1331621 );}.elementor-kit-6 button,.elementor-kit-6 input[type="button"],.elementor-kit-6 input[type="submit"],.elementor-kit-6 .elementor-button{background-color:var( --e-global-color-primary );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-size:var( --e-global-typography-accent-font-size );font-weight:var( --e-global-typography-accent-font-weight );text-transform:var( --e-global-typography-accent-text-transform );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );color:var( --e-global-color-1331621 );border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-primary );border-radius:0px 0px 0px 0px;padding:18px 34px 18px 34px;}.elementor-kit-6 button:hover,.elementor-kit-6 button:focus,.elementor-kit-6 input[type="button"]:hover,.elementor-kit-6 input[type="button"]:focus,.elementor-kit-6 input[type="submit"]:hover,.elementor-kit-6 input[type="submit"]:focus,.elementor-kit-6 .elementor-button:hover,.elementor-kit-6 .elementor-button:focus{background-color:var( --e-global-color-e326b05 );}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 label{color:var( --e-global-color-236224b );font-family:var( --e-global-typography-0ad5435-font-family ), Sans-serif;font-size:var( --e-global-typography-0ad5435-font-size );font-weight:var( --e-global-typography-0ad5435-font-weight );text-transform:var( --e-global-typography-0ad5435-text-transform );line-height:var( --e-global-typography-0ad5435-line-height );letter-spacing:var( --e-global-typography-0ad5435-letter-spacing );}.elementor-kit-6 input:not([type="button"]):not([type="submit"]),.elementor-kit-6 textarea,.elementor-kit-6 .elementor-field-textual{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );color:var( --e-global-color-accent );background-color:#AEB8CC4D;border-radius:0px 0px 0px 0px;padding:14px 16px 14px 16px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1200px;}.e-con{--container-max-width:1200px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-lightbox{background-color:#06070AF2;--lightbox-ui-color:var( --e-global-color-accent );}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-6{--e-global-typography-primary-font-size:34px;--e-global-typography-secondary-font-size:22px;--e-global-typography-text-font-size:17px;--e-global-typography-0ad5435-font-size:13px;--e-global-typography-a138f8b-font-size:20px;--e-global-typography-c3c1995-font-size:30px;--e-global-typography-b3001e9-font-size:26px;}.elementor-kit-6 button,.elementor-kit-6 input[type="button"],.elementor-kit-6 input[type="submit"],.elementor-kit-6 .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );}.elementor-kit-6 label{font-size:var( --e-global-typography-0ad5435-font-size );line-height:var( --e-global-typography-0ad5435-line-height );letter-spacing:var( --e-global-typography-0ad5435-letter-spacing );}.elementor-kit-6 input:not([type="button"]):not([type="submit"]),.elementor-kit-6 textarea,.elementor-kit-6 .elementor-field-textual{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-6{--e-global-typography-primary-font-size:26px;--e-global-typography-primary-letter-spacing:2.1px;--e-global-typography-secondary-font-size:20px;--e-global-typography-text-font-size:16px;--e-global-typography-0ad5435-font-size:11px;--e-global-typography-0ad5435-letter-spacing:3.2px;--e-global-typography-a138f8b-font-size:18px;--e-global-typography-c3c1995-font-size:23px;--e-global-typography-c3c1995-letter-spacing:3px;--e-global-typography-b3001e9-font-size:22px;}.elementor-kit-6 button,.elementor-kit-6 input[type="button"],.elementor-kit-6 input[type="submit"],.elementor-kit-6 .elementor-button{font-size:var( --e-global-typography-accent-font-size );line-height:var( --e-global-typography-accent-line-height );letter-spacing:var( --e-global-typography-accent-letter-spacing );}.elementor-kit-6 label{font-size:var( --e-global-typography-0ad5435-font-size );line-height:var( --e-global-typography-0ad5435-line-height );letter-spacing:var( --e-global-typography-0ad5435-letter-spacing );}.elementor-kit-6 input:not([type="button"]):not([type="submit"]),.elementor-kit-6 textarea,.elementor-kit-6 .elementor-field-textual{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* =====================================================================
   MOONSHINE ACOUSTIC – Website-CSS für Elementor
   Stand: 3. Nov. 2026 abends · passt zu Canvas „Website · Konzept A2 Mondlicht“

   EINFÃœGEN
   · Mit Elementor Pro: Elementor → Website-Einstellungen → Benutzerdefiniertes CSS
   · Ohne Pro:          Design → Customizer → Zusätzliches CSS

   KLASSEN (Elementor → Element → Erweitert → CSS-Klassen)
   ms-header      Header-Container (Theme Builder)          → 00
   ms-hero        Hero-Container (Z-Index 2)                → 01
   ms-hero-text   Container mit Anlässe-Zeile, Claim, Buttons → 01.3–01.6
   ms-logo        Container um Logo + Mondstaub             → 01.1 / 01.2
   ms-logo-img    Bild-Widget Logo (dunkel)                 → 01.1
   ms-dust        Bild-Widget Mondstaub (beide)             → 01.2
   ms-dust--quer  Mondstaub Desktop/Tablet                  → 01.2
   ms-dust--hoch  Mondstaub Mobil                           → 01.2
   ms-btn-ghost   Zweiter Button (Rahmen statt Fläche)      → 00 / 01.6
   ms-anlaesse    Anlässe-Sektion (Inhalt liegt über dem Staub) → 02
   ms-bildband    Bildband-Container                        → 02B
   ms-textlink    Text-Widget mit Link als Versal-Link      → 03.7
   ms-card        Klangfarben-Karte (Mond-Play-Button)      → 03.4–03.6
   ms-swipe-m     Container um die 3 Karten (Mobil: wischen) → 03
   ms-quote       Testimonial-Karussell                     → 04
   ms-arch        Container um das Porträt (Mondbogen)      → 05.1
   ms-form        Formular-Widget                           → 06.6
   Grundsatz: Sektionen wechseln mit harter Kante – keine Verläufe dazwischen.
   ===================================================================== */

:root{
  --ms-mondlicht:#F3F2EF;
  --ms-tinte:#161B29;
  --ms-schiefer:#5B6476;
  --ms-text-hell:#3E4454;
  --ms-nacht:#0D101A;
  --ms-silber:#E4E8F0;
  --ms-silber-2:#AEB8CC;
  --ms-text-nacht:#C3CAD6;
  --ms-mond:#F7F8FB;
  --ms-glow:#C9D3E6;
  --ms-header-h:84px;
}

/* ---------- 0 · Basis ---------- */
html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
[id]{scroll-margin-top:var(--ms-header-h)}            /* Anker landen unter dem Sticky-Header */
::selection{background:var(--ms-glow);color:var(--ms-nacht)}
.elementor-heading-title{text-wrap:balance}
.elementor-widget-text-editor p{text-wrap:pretty}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
[role="button"]:focus-visible{outline:2px solid var(--ms-schiefer);outline-offset:3px}

/* ---------- 00 · Header (transparent → Mondlicht beim Scrollen) ----------
   Header-Container: Bewegungseffekte → Sticky „Oben“, Effekte-Offset 120.
   Erweitert → Rand unten −84 px und Z-Index 99, damit der Hero darunter liegt. */
.ms-header{transition:background-color .35s ease,backdrop-filter .35s ease,border-color .35s ease;
  border-bottom:1px solid transparent}
.ms-header.elementor-sticky--effects{
  background-color:rgba(243,242,239,.88)!important;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom-color:rgba(22,27,41,.1)}
@media (max-width:767px){
  .ms-header .ms-btn-ghost .elementor-button{min-height:40px;padding:0 14px;font-size:11px;letter-spacing:.2em}
}

/* ---------- 01 · Hero: Höhe ----------
   Abstände wachsen mit der Bildschirmhöhe – so bleiben die Buttons auch auf
   Laptops mit 768 px Höhe sichtbar. Auf dem Handy zählt die sichtbare Höhe (svh). */
.ms-hero{padding-top:clamp(96px,14vh,150px)!important}
.ms-hero-text{margin-top:clamp(48px,9vh,120px)!important}
@supports (height:100svh){.ms-hero{min-height:100svh!important}}
@media (max-width:767px){
  .ms-hero{padding-top:110px!important}
  .ms-hero-text{margin-top:clamp(56px,10svh,90px)!important}
}
/* „Wedding | Corporate | Hotel“: Trennstriche leiser */
.ms-trenner{display:inline-block;margin:0 .55em;letter-spacing:0;opacity:.45}
/* Claim: auf dem Handy nach „Dein Event.“ umbrechen */
.ms-br-m{display:none}
@media (max-width:767px){.ms-br-m{display:inline}}

/* ---------- 01 · Hero: Mondstaub rieselt bis in die Anlässe ----------
   Der Hero liegt eine Ebene über den Anlässen (Z-Index 2) und schneidet nur
   seitlich ab – nach unten darf der Staub über die Kante in die Nacht rieseln. */
.ms-hero{position:relative;overflow-x:clip!important;overflow-y:visible!important}
@supports not (overflow:clip){.ms-hero{overflow:hidden!important}}   /* ältere Browser: Staub endet am Hero */
.ms-anlaesse>.e-con-inner{position:relative;z-index:3}              /* Texte der Anlässe liegen über dem Staub */

/* Der Mondstaub hängt am Logo und skaliert mit ihm – deshalb Prozentwerte.
   Werte gelten für moonshine-acoustic-logo-dunkel-web (viewBox 731,2 × 269). */
.ms-logo{position:relative}
.ms-logo .ms-logo-img{position:relative;z-index:1}
.ms-logo .ms-dust{position:absolute!important;left:20.514%;top:31.97%;
  width:177.79%!important;max-width:none!important;z-index:0;pointer-events:none;margin:0!important}
.ms-logo .ms-dust img{width:100%!important;max-width:none!important;height:auto!important;
  -webkit-mask-image:linear-gradient(135deg,#000 0%,#000 38%,transparent 62%);
          mask-image:linear-gradient(135deg,#000 0%,#000 38%,transparent 62%);
  -webkit-mask-size:300% 300%;mask-size:300% 300%;
  -webkit-mask-position:100% 100%;mask-position:100% 100%;
  animation:ms-staub 3.2s cubic-bezier(.35,.1,.25,1) .4s forwards}
.ms-logo .ms-dust--hoch{display:none}
@media (max-width:767px){
  .ms-logo .ms-dust--quer{display:none}
  .ms-logo .ms-dust--hoch{display:block;width:88.9%!important}
  .ms-logo .ms-dust--hoch img{-webkit-mask-image:linear-gradient(160deg,#000 0%,#000 38%,transparent 62%);
                                      mask-image:linear-gradient(160deg,#000 0%,#000 38%,transparent 62%)}
}
@keyframes ms-staub{to{-webkit-mask-position:0% 0%;mask-position:0% 0%}}

/* ---------- Buttons ----------
   Grundstil (Tinte auf Mondlicht) kommt aus Website-Einstellungen → Buttons. */
.elementor-button{transition:background-color .25s ease,color .25s ease,border-color .25s ease,box-shadow .25s ease}
.ms-btn-ghost .elementor-button{background-color:transparent!important;color:var(--ms-tinte)!important;
  border:1px solid rgba(22,27,41,.45)!important}
.ms-btn-ghost .elementor-button:hover{background-color:rgba(22,27,41,.04)!important;
  border-color:var(--ms-tinte)!important;color:var(--ms-tinte)!important;box-shadow:none}

/* Textlink in Versalien mit feiner Unterlinie (03.7, auf Nacht) */
.ms-textlink p{margin:0}
.ms-textlink a{font-weight:600;font-size:12px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--ms-silber);border-bottom:1px solid rgba(174,184,204,.45);padding-bottom:4px;text-decoration:none}
.ms-textlink a:hover{color:#fff;border-bottom-color:var(--ms-silber)}

/* ---------- 02B · Bildband ---------- */
.ms-bildband{min-height:560px}
@media (max-width:767px){.ms-bildband{min-height:280px}}

/* ---------- 03 · Klangfarben-Karten mit Mond-Play-Button ---------- */
.ms-card{transition:border-color .3s ease}
.ms-card:hover{border-color:rgba(174,184,204,.38)!important}
.ms-card .elementor-custom-embed-image-overlay{position:relative;overflow:hidden}
.ms-card .elementor-custom-embed-image-overlay img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;
  transition:transform .8s ease}
.ms-card:hover .elementor-custom-embed-image-overlay img{transform:scale(1.03)}
.ms-card .elementor-custom-embed-image-overlay::after{content:"";position:absolute;left:0;right:0;bottom:0;height:42%;
  background:linear-gradient(180deg,rgba(6,7,10,0),rgba(6,7,10,.82));pointer-events:none}
.ms-card .elementor-custom-embed-play{top:auto!important;bottom:24px;left:24px!important;transform:none!important;
  z-index:2;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg,var(--ms-mond) 0%,#E1E5ED 100%);
  box-shadow:0 0 0 7px rgba(201,211,230,.12),0 0 30px rgba(201,211,230,.55);transition:box-shadow .3s ease}
.ms-card .elementor-custom-embed-play i{font-size:20px!important;color:var(--ms-tinte)!important;
  text-shadow:none!important;opacity:1!important;margin-left:3px}
.ms-card .elementor-custom-embed-play svg{width:20px!important;height:20px!important;fill:var(--ms-tinte)!important;
  filter:none!important;opacity:1!important;margin-left:3px}
.ms-card .elementor-custom-embed-play::after{content:"Hörprobe";position:absolute;left:calc(100% + 16px);
  white-space:nowrap;font:600 11px/1 'Josefin Sans',sans-serif;letter-spacing:.24em;text-transform:uppercase;
  color:var(--ms-silber)}
.ms-card .elementor-custom-embed-image-overlay:hover .elementor-custom-embed-play{
  box-shadow:0 0 0 9px rgba(201,211,230,.16),0 0 40px rgba(201,211,230,.75)}
@media (max-width:767px){
  .ms-card .elementor-custom-embed-play{width:48px;height:48px;left:18px!important;bottom:18px}
}

/* Mobil: Karten nebeneinander zum Wischen (statt 3 Karten untereinander) */
@media (max-width:767px){
  .ms-swipe-m,.ms-swipe-m>.e-con-inner{flex-wrap:nowrap!important;overflow-x:auto;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;
    padding-bottom:4px}
  .ms-swipe-m::-webkit-scrollbar,.ms-swipe-m>.e-con-inner::-webkit-scrollbar{display:none}
  .ms-swipe-m>.e-con,.ms-swipe-m>.e-con-inner>.e-con{flex:0 0 80%!important;max-width:80%!important;
    scroll-snap-align:center}
}

/* ---------- 04 · Stimmen (auf Mondlicht) ---------- */
.ms-quote .swiper-pagination-bullet{width:10px;height:2px;border-radius:0;background:var(--ms-tinte);opacity:.3}
.ms-quote .swiper-pagination-bullet-active{width:22px;opacity:1}

/* ---------- 05 · Über uns: Mondbogen ---------- */
.ms-arch{position:relative}
.ms-arch::before{content:"";position:absolute;inset:-16px;border:1px solid rgba(22,27,41,.22);
  border-radius:260px 260px 0 0;pointer-events:none}
.ms-arch img{border-radius:230px 230px 0 0;aspect-ratio:4/5;object-fit:cover;width:100%}
@media (max-width:767px){.ms-arch::before{inset:-12px;border-radius:170px 170px 0 0}
  .ms-arch img{border-radius:150px 150px 0 0}}

/* ---------- 06 · Formular (auf Nacht) ---------- */
.ms-form .elementor-field-group .elementor-field{border-radius:0}
.ms-form .elementor-field-group .elementor-field:focus{border-color:var(--ms-silber)!important;box-shadow:none}
.ms-form .elementor-field::placeholder{color:#7D879B}
.ms-form select.elementor-field{color:var(--ms-silber)}
.ms-form .elementor-field-type-acceptance label{font-size:14px;line-height:1.55;color:var(--ms-silber-2)}
.ms-form .elementor-field-type-acceptance a{color:var(--ms-silber)}
.ms-form .elementor-message{font-size:16px;color:var(--ms-silber)}
.ms-form .elementor-button:hover{box-shadow:0 0 28px rgba(201,211,230,.35)}

/* ---------- Ruhe für alle, die weniger Bewegung wollen ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ms-logo .ms-dust img{animation:none;-webkit-mask-image:none;mask-image:none}
  .elementor-invisible{visibility:visible!important}
  .animated{animation:none!important}
}/* End custom CSS */