/* =========================================================
   RemoKey – Main CSS (cleaned)
   Struktur
   1) Variablen & Resets
   2) Global (Typo/Links/Media/Header/Buttons)
   3) Footer
   4) Hero (Titel, Textbox, Button)
   5) Event-Kacheln (Startseite)
   6) Termine – The Events Calendar (Skeleton List View)
   ========================================================= */

/* -------------------------------
   1) Variablen & Resets
---------------------------------*/
:root{
  --rk-font: 'Open Sans Condensed', Arial, sans-serif;
  --rk-body: 'Open Sans', Arial, sans-serif;

  --rk-bg: #111;
  --rk-bg-2: #141414;
  --rk-panel: #1a1a1a;

  --rk-text: #e6e6e6;
  --rk-text-soft: #d6d6d6;
  --rk-muted: #b9b9b9;
  --rk-white: #fff;

  --rk-gold: #f5c542;
  --rk-gold-2: #ffde6b;

  --rk-line: rgba(255,255,255,0.14);
  --rk-line-soft: rgba(255,255,255,0.10);
}

html, body { max-width: 100%; overflow-x: hidden; background: var(--rk-bg); }

/* Starttitel ausblenden */
.home h1.entry-title,
.home .entry-header,
.home .nv-title-meta-wrap { display: none !important; }

/* Gutenberg-Container neutral halten */
.wp-block-group, .wp-block-column { background: transparent; padding: 0; border-radius: 0; box-shadow: none; }

/* -------------------------------
   2) Global (Typo/Links/Media/HEADER/Buttons)
---------------------------------*/
body{
  font-family: var(--rk-body);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.7;
  color: var(--rk-text);
}
h1,h2,h3,h4,h5,h6{
  font-family: var(--rk-font);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--rk-white);
}
a{ color: var(--rk-gold); text-decoration: none; }
a:hover{ color: var(--rk-gold-2); text-decoration: underline; }

/* Bilder */
.wp-block-image img{
  display: block; margin: 0 auto;
  max-width: 980px; width: 100%; height: auto;
  border-radius: 14px; box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

/* Content-Padding auf Mobil */
@media (max-width: 782px){ .nv-content-wrap{ padding: 0 16px; } }

/* HEADER (Neve) – dunkel + Linkfarben */
.site-header,
.site-header .hfg_header,
.site-header .header--row,
.site-header .header--row .container,
.site-header .hfg-container,
.site-header .nv-navbar,
.site-header .nv-header,
.is-stuck .site-header,
.is-stuck .hfg_header,
.is-stuck .header--row,
.is-stuck .header--row .container,
.is-stuck .nv-navbar,
.is-stuck .nv-header{
  background:#000 !important;
  box-shadow:none !important;
}
.site-header .nv-nav-ul > li > a,
.site-header a,
.is-stuck .nv-nav-ul > li > a{
  color:#fff !important;
  transition:color .25s ease;
}
.site-header .nv-nav-ul > li > a:hover,
.site-header a:hover,
.is-stuck .nv-nav-ul > li > a:hover{
  color:var(--rk-gold) !important;
}
/* Hamburger / Toggler */
.site-header .menu-mobile-toggle,
.site-header .nv-navbar-toggle{
  color:#fff !important;
  fill:#fff !important;
}

/* OFF-CANVAS MOBILE MENU (Neve) */
@media (max-width: 1024px){
  .header-menu-sidebar,
  .header-menu-sidebar .drawer,
  .header-menu-sidebar .drawer-inner,
  .header-menu-sidebar .drawer-content,
  .header-menu-sidebar .off-canvas-content,
  .header-menu-sidebar .container{
    background-color:rgba(28,28,28,.96) !important;
  }
  .header-menu-sidebar,
  .header-menu-sidebar *{ color:#eaeaea !important; }
  .header-menu-sidebar .nav-ul li > .wrap > a{
    color:#f0f0f0 !important;
    font-size:18px; font-weight:500; line-height:1.3;
    transition:color .25s ease;
  }
  .header-menu-sidebar .nav-ul li > .wrap > a:hover,
  .header-menu-sidebar .nav-ul li.current-menu-item > .wrap > a,
  .header-menu-sidebar .nav-ul li.current_page_item > .wrap > a{
    color:var(--rk-gold) !important;
  }
  .header-menu-sidebar .close-sidebar-panel,
  .header-menu-sidebar .close-sidebar-panel svg{
    color:#fff !important; fill:#fff !important;
  }
  .header-menu-sidebar .mfp-bg,
  .header-menu-sidebar .hfg-mobile-menu-overlay{
    background:rgba(0,0,0,.6) !important;
  }
}

/* GLOBALE OUTLINE-BUTTONS – Gold Glow */
:root{
  /* falls noch nicht vorhanden */
  --rk-gold: #f5c542;
  --rk-gold-2: #ffd76a;
}

.wp-block-button .wp-block-button__link,
.wp-element-button,                       /* Gutenberg 6.5+ */
button, .button,
input[type="submit"], input[type="button"], input[type="reset"],
.nv-button, .nv-btn, a.button{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.28)) !important;
  border: 1px solid rgba(245,197,66,.55) !important;
  color: var(--rk-gold) !important;
  border-radius: 12px !important;
  padding: 10px 22px !important;
  line-height: 1.2;
  box-shadow: 0 0 8px rgba(245,197,66,.12), inset 0 1px 0 rgba(255,255,255,.05) !important;
  transition: transform .2s, box-shadow .25s ease, border-color .25s ease, color .2s ease;
  text-decoration: none !important;
}

/* Outline-Stil explizit transparent lassen */
.wp-block-button.is-style-outline .wp-block-button__link{
  background: transparent !important;
}

/* Hover/Fokus */
.wp-block-button .wp-block-button__link:hover,
.wp-element-button:hover,
button:hover, .button:hover,
input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover,
.nv-button:hover, .nv-btn:hover, a.button:hover{
  border-color: rgba(245,197,66,.75) !important;
  box-shadow: 0 0 18px rgba(245,197,66,.30), inset 0 1px 0 rgba(255,255,255,.08) !important;
  color: var(--rk-gold-2) !important;
  transform: translateY(-1px);
}

/* -------------------------------
   3) Footer
---------------------------------*/
.site-footer,
.site-footer .hfg-footer,
.site-footer .footer-top,
.site-footer .footer-main,
.site-footer .footer-bottom,
.site-footer .container,
.site-footer .row,
.site-footer .hfg-slot,
.site-footer .footer--row-inner{
  background:#000 !important;
  border:none !important;
  box-shadow:none !important;
}
.site-footer,
.site-footer a,
.site-footer .rk-copy{
  color:#ccc !important;
  font-size:14px;
  text-align:center;
}
.site-footer a:hover{ color:#fff !important; }
.rk-copy{ opacity:1 !important; }
.site-footer .menu, .site-footer .menu a{ font-size: 15px; }
.site-footer .menu li{ display:inline-block; margin-right:16px; }
.site-footer .menu li:last-child{ margin-right:0; }
.rk-socials{ text-align:right; white-space:nowrap; }
.rk-socials a{ margin-left:14px; transition:color .2s ease; }
.rk-socials .sep{ opacity:.35; margin:0 8px; }

/* Footer Social Icons (eigener Container optional .rk-footer-social) */
.rk-footer-social{ display:flex; justify-content:center; gap:18px; margin-top:8px; }
.rk-footer-social a svg{ width:22px; height:22px; transition:transform .25s, fill .25s; }
.rk-footer-social .rk-ig svg{ fill:#E1306C; }  /* Instagram */
.rk-footer-social .rk-yt svg{ fill:#FF0000; }  /* YouTube */
.rk-footer-social .rk-fb svg{ fill:#1877F2; }  /* Facebook */
.rk-footer-social a:hover svg{ fill:#fff; transform:scale(1.15); }

@media (max-width: 768px){
  .rk-copy, .rk-socials, .site-footer .menu{ text-align: center; }
  .rk-socials a{ margin: 6px 10px 0; }
  .rk-socials .sep{ display:none; }
  .site-footer .menu li{ margin: 0 10px 6px; }
  .site-footer, .site-footer .footer-bottom, .site-footer .row{
    flex-direction:column !important;
    text-align:center !important;
  }
}

/* -------------------------------
   4) Hero
---------------------------------*/
.hero-section{ max-width: 1120px; margin: 0 auto; padding: 0 0 1rem; }
.hero-media{ margin: 0 auto 1.2rem; max-width: 980px; }
.hero-media .wp-block-image{ margin: 0; }

.hero-title, .wp-block-heading.hero-title{
  font-family: var(--rk-font) !important;
  font-weight: 700 !important;
  font-size: clamp(28px,3vw,35px) !important;
  line-height: 40px !important;
  text-transform: uppercase !important;
  color: var(--rk-white) !important;
  text-align: center !important;
  margin: 2rem 0 1.2rem !important;
}

.hero-textbox{
  max-width: 980px; margin: 0 auto 1.25rem;
  background: var(--rk-panel); color: var(--rk-text);
  border-radius: 14px; padding: 22px 28px;
  box-shadow: 0 12px 32px rgba(0,0,0,.22);
}
.hero-textbox p{ margin: 0 0 .9rem; line-height: 1.7; }

.hero-lead{
  font-family: var(--rk-font) !important;
  font-weight: 400 !important;
  font-size: 18px !important;
  line-height: 1.6 !important;
  color: #e8e8e8 !important;
  max-width: 900px; margin: 20px auto !important; text-align:left !important;
}

.hero-button{ text-align:center; margin: 1.25rem auto 0; max-width:980px; }
.hero-button .wp-block-button__link{
  background: transparent; color: var(--rk-white);
  border: 1px solid var(--rk-white); border-radius: 999px;
  padding: .85rem 1.4rem; font-weight: 600;
  transition: background .2s, color .2s, border-color .2s;
}
.hero-button .wp-block-button__link:hover{ background: var(--rk-white); color:#111; }
@media (max-width:600px){ .hero-textbox{ padding: 1.5rem 1rem; border-radius: 12px; } }

/* -------------------------------
   5) Event-Kacheln (Startseite)
---------------------------------*/
.events-section{ position:relative; padding:48px 0; isolation:isolate; }
.events-section::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(transparent 0%, rgba(0,0,0,.55) 65%),
    var(--events-bg, none) center/cover no-repeat fixed;
  opacity:.6; filter:saturate(.95) brightness(.8);
}
.events-wrapper{ max-width:1100px; margin:0 auto; padding:0 16px; }
.events-title{ margin:0 0 18px; font-size:clamp(1.4rem,2.6vw,2rem); letter-spacing:.05em; }
.events-grid{ display:flex; flex-wrap:wrap; gap:clamp(14px,2vw,22px); justify-content:center; }

.event-box{
  flex:0 1 clamp(280px,31%,360px);
  display:flex; flex-direction:column;
  background:#0f0f0f; color:#eaeaea;
  border-radius:14px; padding:clamp(14px,2.4vw,20px);
  box-shadow:0 12px 28px rgba(0,0,0,.35);
  transition: transform .18s, box-shadow .18s;
}
.event-box:hover{ transform: translateY(-2px); box-shadow:0 16px 34px rgba(0,0,0,.42); }

.event-date{ font-size:clamp(1.1rem,2.2vw,1.4rem); font-weight:800; margin:2px 0 8px; text-transform:uppercase; color:#fff; }
.event-title{ font-size:clamp(1.02rem,1.9vw,1.2rem); font-weight:700; margin:0 0 6px; color:#fff; }
.event-band{ font-style:italic; margin:0 0 8px; color:var(--rk-gold); opacity:.95; }
.event-location,.event-meta{ font-size:.98rem; line-height:1.55; }
.events-grid a{ color:var(--rk-gold); }
.events-grid a:hover{ color:var(--rk-gold-2); }

/* === Startseite: NÄCHSTE KONZERTE – Grid + Rahmen wiederherstellen === */
#artm-event-boxes{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px 32px;
  justify-items: center;
}

#artm-event-boxes .event-box{
  width: 100%;
  max-width: 520px;                    /* verhindert ultrabreit */
  background: rgba(0,0,0,.30);
  color: #fff;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 14px;
  padding: 18px 20px;
  box-shadow:
    0 18px 40px -10px rgba(0,0,0,.5),
    inset 0 0 0 2px rgba(245,197,66,.10); /* dezente Gold-Kontur */
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
#artm-event-boxes .event-box:hover{
  transform: translateY(-2px);
  box-shadow:
    0 24px 46px -12px rgba(0,0,0,.6),
    inset 0 0 0 2px rgba(245,197,66,.18);
  border-color: rgba(255,255,255,.28);
}

/* Typo-Finetuning in den Kacheln */
#artm-event-boxes .event-date{ color:#fff; font-weight:800; }
#artm-event-boxes .event-title{ color:#fff; font-weight:700; }
#artm-event-boxes .event-band{ color: var(--rk-gold); }

/* Mobile: einspaltig */
@media (max-width: 900px){
  #artm-event-boxes{
    grid-template-columns: 1fr !important;
  }
  #artm-event-boxes .event-box{
    max-width: 640px;
  }
}

/* -------------------------------
   6) Termine – The Events Calendar (Skeleton List)
---------------------------------*/

/* sanfter Seitenverlauf */
body.tribe-events{
  background: linear-gradient(180deg, var(--rk-bg) 0%, var(--rk-bg-2) 100%) !important;
}

/* ===== Events Bar (Suchleiste + Tabs) ===== */
.tribe-events .tribe-events-c-events-bar{
  background:transparent !important; border:none !important; box-shadow:none !important;
  margin-bottom:1.4rem !important;
}

/* Eingabefeld */
.tribe-events .tribe-events-c-search__input{
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid var(--rk-line) !important;
  color: #f1f1f1 !important;
  border-radius: 12px !important;
  height: 52px !important;
  padding: 0 1rem 0 2.6rem !important;
  transition: background .2s, border-color .2s, box-shadow .2s !important;
}
.tribe-events .tribe-events-c-search__input::placeholder{ color:#cfcfcf !important; opacity:.75; }
.tribe-events .tribe-events-c-search__input:focus{
  background: rgba(255,255,255,0.14) !important;
  border-color: var(--rk-gold) !important;
  box-shadow: 0 0 8px rgba(245,197,66,.35);
  outline:none !important;
}
/* Icon im Feld */
.tribe-events .tribe-events-c-search__input-control-icon-svg{
  color: var(--rk-gold); fill: var(--rk-gold);
  left: 12px; top: 50%; transform: translateY(-50%);
  opacity:.9;
}

/* „Suche Veranstaltungen“-Button */
.tribe-events .tribe-common-c-btn{
  background: transparent !important;
  color: var(--rk-gold) !important;
  border: 1px solid var(--rk-gold) !important;
  border-radius: 12px !important;
  padding: .7rem 1.2rem !important;
  transition: background .2s, color .2s, box-shadow .2s;
}
.tribe-events .tribe-common-c-btn:hover{
  background: var(--rk-gold) !important;
  color:#000 !important;
  box-shadow: 0 0 10px rgba(245,197,66,.4);
}

/* Ansichts-Tabs (Liste/Monat/Tag) */
.tribe-events .tribe-events-c-view-selector__tabs-button{
  background: rgba(255,255,255,.06) !important;
  color: #dcdcdc !important;
  border: 1px solid var(--rk-line) !important;
  border-radius: 10px !important;
  transition: all .2s;
}
.tribe-events .tribe-events-c-view-selector__tabs-button[aria-selected="true"]{
  background: rgba(245,197,66,.18) !important;
  color:#fff !important; border-color: var(--rk-gold) !important;
}
.tribe-events .tribe-events-c-view-selector__tabs-button:hover{
  color: var(--rk-gold-2) !important; border-color: var(--rk-gold-2) !important;
}

/* ===== List View ===== */

/* Monatstrenner */
.tribe-events .tribe-events-calendar-list__month-separator{
  border-bottom: 1px solid var(--rk-line) !important;
  color: var(--rk-gold) !important;
  font-weight: 600; letter-spacing:.05em; text-transform: uppercase;
  margin-top: 2rem;
}
.tribe-events .tribe-events-calendar-list__month-separator *{
  color: var(--rk-gold) !important; opacity:1 !important;
}

/* Event-Karte */
.tribe-events .tribe-events-calendar-list__event{
  background: linear-gradient(180deg, #151515 0%, #0e0e0e 100%);
  border: 1px solid var(--rk-line-soft);
  border-radius: 18px;
  padding: 18px 22px;
  box-shadow: 0 6px 18px rgba(0,0,0,.4);
  transition: transform .2s, box-shadow .2s, border-color .2s;
  margin-bottom: 24px;
}
.tribe-events .tribe-events-calendar-list__event:hover{
  transform: translateY(-3px);
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 10px 28px rgba(245,197,66,.15);
}

/* Datum-Kachel links */
.tribe-events .tribe-events-calendar-list__event-date-tag{
  background: linear-gradient(180deg, #1a1a1a 0%, #0f0f0f 100%);
  border: 2px solid rgba(245,197,66,.55) !important;
  border-radius: 12px !important;
  color:#fff !important; padding:8px 12px; text-align:center;
  box-shadow: 0 0 8px rgba(245,197,66,.25), inset 0 0 6px rgba(255,255,255,.05);
  transition: all .25s ease;
}
.tribe-events .tribe-events-calendar-list__event-date-tag:hover{
  border-color: var(--rk-gold) !important;
  box-shadow: 0 0 12px rgba(245,197,66,.5), 0 0 4px rgba(245,197,66,.3);
  transform: scale(1.03);
}
.tribe-events .tribe-events-calendar-list__event-date-tag,
.tribe-events .tribe-events-calendar-list__event-date-tag *,
.tribe-events .tribe-events-calendar-list__event-date-tag time{
  color:#fff !important; opacity:1 !important; text-shadow:0 1px 2px rgba(0,0,0,.65);
}
.tribe-events .tribe-events-calendar-list__event-date-tag abbr{ font-size:.75rem; opacity:.9; text-transform:uppercase; }

/* Titel & Meta */
.tribe-events .tribe-events-calendar-list__event-title a{
  color:#fff !important; font-weight:800 !important; text-decoration:none;
}
.tribe-events .tribe-events-calendar-list__event-title a:hover{ text-decoration:underline; }
.tribe-events .tribe-events-calendar-list__event-venue,
.tribe-events .tribe-events-calendar-list__event-datetime{ color:#ccc !important; opacity:1 !important; }

/* Beschreibung gut lesbar */
.tribe-events .tribe-events-calendar-list__event-description,
.tribe-events .tribe-events-calendar-list__event-description *,
.tribe-events .tribe-common-b2,
.tribe-events .tribe-common-b2--muted,
.tribe-events .tribe-common-b3{
  color:#ddd !important; opacity:1 !important; line-height:1.6;
}

/* Band-Zeile aus PHP-Hook */
.tribe-events .rk-event-band{ margin-top:4px; font-style:italic; color:var(--rk-gold); opacity:.95; }

/* Pagination */
.tribe-events .tribe-events-c-nav__next,
.tribe-events .tribe-events-c-nav__prev{
  border: 1px solid var(--rk-text); border-radius: 12px; color: var(--rk-text);
}
.tribe-events .tribe-events-c-nav__next:hover,
.tribe-events .tribe-events-c-nav__prev:hover{ background: var(--rk-text); color:#000; }

/* Heute-Button aus */
.tribe-events .tribe-events-c-top-bar__today-button{ display:none; }

/* ROBUSTES 2-SPALTEN-LAYOUT: Datum links | Inhalt rechts */
body.tribe-events .tribe-events-calendar-list__event{
  display:grid !important;
  grid-template-columns:140px 1fr !important;   /* Datum | Inhalt */
  column-gap:28px !important;
  align-items:start !important;
}
body.tribe-events .tribe-events-calendar-list__event-date-tag{
  grid-column:1 / 2 !important;
  margin:0 !important;
}
body.tribe-events .tribe-events-calendar-list__event > *:not(.tribe-events-calendar-list__event-date-tag){
  grid-column:2 / 3 !important;
  min-width:0 !important; /* verhindert zu frühes Umbrechen */
}
/* Titel normal umbrechen (keine „Säule“) */
body.tribe-events .tribe-events-calendar-list__event-title,
body.tribe-events .tribe-events-calendar-list__event-title a{
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:anywhere;
}
/* schmale Screens: Datum etwas schmaler */
@media (max-width:560px){
  body.tribe-events .tribe-events-calendar-list__event{
    grid-template-columns:120px 1fr !important;
    column-gap:22px !important;
  }
}

/* Events-Hintergrund wirklich auf dem Pseudo-Element steuern */
.events-section::before{
  /* Desktop: wie gehabt, aber ohne "fixed" (mobile-sicherer) */
	background-size: cover !important;
  background-position: center center !important;
  background-attachment: scroll !important; /* überschreibt das frühere 'fixed' */
}

/* Mobil: Bild "verkleinern"/ruhiger machen */
@media (max-width: 900px){
  .events-section::before{
    background-size: cover !important;        /* wieder "füllt", aber ohne abgeschnittenen Eindruck */
    background-position: center 25% !important; /* leicht nach oben geschoben */
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
    opacity: .45 !important;                   /* etwas dezenter als Desktop */
    filter: brightness(0.9) contrast(1.05);    /* leicht abgedunkelt für Lesbarkeit */
  }

  .events-section{
    padding-top: 56px;                         /* oben etwas mehr Abstand */
    padding-bottom: 40px;
  }
}

/* =========================================================
   TEC List View – Datumskachel (RemoKey Clean Final)
   - EIN subtiler Gold-Glow außen
   - Kachel-Stil auf dem time-Element
   - Keine doppelten Rahmen/Glows
   ========================================================= */

/* 0) Grundlayout: Abstand zwischen Datumsbox und Eventkarte */
.tribe-events-calendar-list__event-row {
  align-items: flex-start !important;
  gap: 24px !important; /* Desktop */
}
@media (max-width: 768px){
  .tribe-events-calendar-list__event-row {
    gap: 36px !important; /* Mobile etwas größer */
    align-items: flex-start !important;
  }
}

/* 1) Datumsblock-Hülle (div): neutral, aber Basis für Glow */
.tribe-events-calendar-list__event-date-tag {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important; /* Glow darf außerhalb leuchten */
}

/* 1a Sicherheit: keine versteckten Standardränder */
.tribe-events-calendar-list__event-date-tag::before {
  content: none !important;
}
.tribe-events-calendar-list__event-date-tag .tribe-events-calendar-list__event-date-tag-datetime {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* 1b Subtiler, edler Gold-Glow außen */
.tribe-events-calendar-list__event-date-tag::after {
  content: "" !important;
  position: absolute !important;
  inset: -4px !important; /* wie weit der Schein herausragt */
  border-radius: 14px !important;
  pointer-events: none !important;
  z-index: 0 !important;
  box-shadow:
    0 0 6px  rgba(245,197,66,.16),
    0 0 16px rgba(245,197,66,.10),
    0 4px 22px rgba(245,197,66,.08) !important;
}
@media (max-width: 768px){
  .tribe-events-calendar-list__event-date-tag::after {
    inset: -6px !important;
    box-shadow:
      0 0 6px  rgba(245,197,66,.14),
      0 0 18px rgba(245,197,66,.10),
      0 6px 24px rgba(245,197,66,.08) !important;
  }
}

/* 2 Eigentliche Kachel (time-Element) */
.tribe-events-calendar-list__event-date-tag time {
  position: relative !important; /* liegt über dem Halo */
  z-index: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  /* feiner Rand + dezenter Verlauf */
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.24)) !important;
  border: 1px solid rgba(245,197,66,.38) !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;

  padding: 10px 12px !important;
  line-height: 1.1 !important;
}

/* 3 Typografie in der Kachel (golden, kompakt) */
.tribe-events-calendar-list__event-date-tag,
.tribe-events-calendar-list__event-date-tag *,
.tribe-events-calendar-list__event-date-tag time {
  color: #f5c542 !important;
  -webkit-text-fill-color: #f5c542 !important;
  text-shadow: none !important;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
}

/* Wochentag klein + zarte Linie darunter */
.tribe-events-calendar-list__event-date-tag-weekday {
  font-size: .8rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  opacity: .9 !important;
  margin: 0 !important;
  position: relative !important;
}
.tribe-events-calendar-list__event-date-tag-weekday::after {
  content: "" !important;
  display: block !important;
  width: 70% !important;
  height: 1px !important;
  margin: 6px auto 4px !important;
  background: rgba(245,197,66,.55) !important;
  box-shadow: 0 0 6px rgba(245,197,66,.25) !important;
  border-radius: 1px !important;
}

/* Tagzahl prominent */
.tribe-events-calendar-list__event-date-tag-daynum {
  font-size: 1.8rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  margin: 0 !important;
}

/* 4 Mikro-Tuning für sehr schmale Screens */
@media (max-width: 420px){
  .tribe-events-calendar-list__event-date-tag-daynum {
    font-size: 1.6rem !important;
  }
  .tribe-events-calendar-list__event-date-tag time {
    padding: 8px 10px !important;
  }
}

/* -----------------------------------------------------------------
   RemoKey – Events Styling
   Datum: 2025-10-04
   Zweck: Einheitliches TEC-Design (Suchfeld + Buttons + Top-Bar)
------------------------------------------------------------------- */

/* === Header-Leiste – Search + Nav + Datepicker im RemoKey-Kachel-Look === */

/* 1 – Suchfeld im Kachel-Look */
.tribe-events .tribe-events-c-search__input {
  height: 48px !important;
  padding: 0 16px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(245,197,66,.38) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.24)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
  color: #f5f5f5 !important;
}
.tribe-events .tribe-events-c-search__input::placeholder {
  color: rgba(255,255,255,.65) !important;
}
.tribe-events .tribe-events-c-search__input:focus {
  outline: none !important;
  border-color: rgba(245,197,66,.55) !important;
  box-shadow: 0 0 0 3px rgba(245,197,66,.12),
               inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* 2 – Suchbutton in Gold mit gleicher Kante */
.tribe-events .tribe-events-c-search__button {
  height: 48px !important;
  padding: 0 18px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(245,197,66,.55) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.28)) !important;
  color: #f5c542 !important;
  font-weight: 600 !important;
  letter-spacing: .2px !important;
  box-shadow: 0 0 10px rgba(245,197,66,.12),
               inset 0 1px 0 rgba(255,255,255,.06) !important;
}
.tribe-events .tribe-events-c-search__button:hover {
  border-color: rgba(245,197,66,.75) !important;
  box-shadow: 0 0 14px rgba(245,197,66,.18),
               inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* === Top-Bar: Pfeile, Heute, Anstehend – gleiche Höhe & Optik === */

/* Container */
.tribe-events .tribe-events-c-top-bar {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap;
}

/* UL/LI für Pfeile neutralisieren */
.tribe-events .tribe-events-c-top-bar__nav-list,
.tribe-events .tribe-events-c-top-bar__nav-list-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* Gemeinsame Basis für alle Buttons */
.tribe-events .tribe-events-c-top-bar__nav-link,
.tribe-events .tribe-events-c-top-bar__today-button,
.tribe-events .tribe-events-c-top-bar__datepicker-button {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 44px !important;
  line-height: 1 !important;
  border-radius: 12px !important;
  vertical-align: middle !important;
  margin: 0 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .2px !important;
  border: 1px solid rgba(245,197,66,.55) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.28)) !important;
  color: #f5c542 !important;
  box-shadow: 0 0 10px rgba(245,197,66,.10),
               inset 0 1px 0 rgba(255,255,255,.06) !important;
  transition: box-shadow .18s ease, border-color .18s ease, background .18s ease !important;
}

/* Hover-Effekt identisch für alle */
.tribe-events .tribe-events-c-top-bar__nav-link:hover,
.tribe-events .tribe-events-c-top-bar__today-button:hover,
.tribe-events .tribe-events-c-top-bar__datepicker-button:hover {
  border-color: rgba(245,197,66,.75) !important;
  box-shadow: 0 0 14px rgba(245,197,66,.16),
               inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* Pfeilbuttons: quadratisch und kompakt */
.tribe-events .tribe-events-c-top-bar__nav-link {
  width: 44px !important;
  padding: 0 !important;
}

/* SVG Icons (Pfeile & allgemein) */
.tribe-events .tribe-events-c-top-bar__nav-link svg,
.tribe-events .tribe-events-c-top-bar__nav-link svg path,
.tribe-events .tribe-events-c-top-bar__datepicker-button svg {
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* Heute & Anstehend gleich breit, mittig */
.tribe-events .tribe-events-c-top-bar__today-button,
.tribe-events .tribe-events-c-top-bar__datepicker-button {
  padding: 0 14px !important;
  line-height: 1 !important;
}

/* Binnen-Typo für Anstehend */
.tribe-events .tribe-events-c-top-bar__datepicker-time,
.tribe-events .tribe-events-c-top-bar__datepicker-mobile,
.tribe-events .tribe-events-c-top-bar__datepicker-desktop {
  color: #f5c542 !important;
  font-weight: 600 !important;
  letter-spacing: .2px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* Deaktivierte Pfeile */
.tribe-events .tribe-events-c-top-bar__nav-link[disabled] {
  opacity: .8 !important;
  cursor: not-allowed !important;
  color: #f5c542 !important;
  border-color: rgba(245,197,66,.45) !important;
}

/* Vertikale Feinkorrektur */
@supports (transform: translateY(1px)) {
  .tribe-events .tribe-events-c-top-bar__today-button {
    transform: translateY(0);
  }
}

/* Tabs Liste, Monat, Tag */
.tribe-events .tribe-events-c-view-selector__list-item-link {
  font-weight: 600 !important;
  letter-spacing: .2px !important;
  color: rgba(245,197,66,.9) !important;
}
.tribe-events .tribe-events-c-view-selector__list-item--active
  .tribe-events-c-view-selector__list-item-link {
  color: #f5c542 !important;
}

/* Mobile kompakter */
@media (max-width:768px) {
  .tribe-events .tribe-events-c-search__input,
  .tribe-events .tribe-events-c-search__button {
    height: 44px !important;
  }
  .tribe-events .tribe-events-c-top-bar__datepicker-button {
    height: 44px !important;
  }
}

/* === Suchfeld: Lupe rechts im Feld – RemoKey Style === */
.tribe-events .tribe-events-c-search__input-control {
  position: relative !important;
}
.tribe-events .tribe-events-c-search__input {
  padding-right: 44px !important;
}
.tribe-events .tribe-events-c-search__input-control .tribe-events-c-search__input-control-icon-svg {
  position: absolute !important;
  right: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  color: #f5c542 !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  pointer-events: none !important;
  opacity: .9 !important;
  left: auto !important;
}

/* === Hotfix: Einheitliche Button-Optik – Überschreibt Theme === */
.tribe-events .tribe-events-c-top-bar__nav-link,
.tribe-events .tribe-events-c-top-bar__today-button,
.tribe-events .tribe-events-c-top-bar__datepicker-button,
.tribe-events .tribe-events-c-top-bar .tribe-events-c-top-bar__today-button.tribe-common-c-btn-border-small {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 44px !important;
  line-height: 1 !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(245,197,66,.55) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.28)) !important;
  color: #f5c542 !important;
  font-weight: 600 !important;
  letter-spacing: .2px !important;
  box-shadow: 0 0 10px rgba(245,197,66,.10),
               inset 0 1px 0 rgba(255,255,255,.06) !important;
  text-decoration: none !important;
}

/* Pfeile quadratisch */
.tribe-events .tribe-events-c-top-bar__nav-link {
  width: 44px !important;
  padding: 0 !important;
}

/* Hover vereinheitlicht */
.tribe-events .tribe-events-c-top-bar__nav-link:hover,
.tribe-events .tribe-events-c-top-bar__today-button:hover,
.tribe-events .tribe-events-c-top-bar__datepicker-button:hover,
.tribe-events .tribe-events-c-top-bar .tribe-events-c-top-bar__today-button.tribe-common-c-btn-border-small:hover {
  border-color: rgba(245,197,66,.75) !important;
  box-shadow: 0 0 14px rgba(245,197,66,.16),
               inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* SVGs – Gold und einheitlich */
.tribe-events .tribe-events-c-top-bar__nav-link svg,
.tribe-events .tribe-events-c-top-bar__nav-link svg path,
.tribe-events .tribe-events-c-top-bar__datepicker-button svg {
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* Deaktivierte Pfeile */
.tribe-events .tribe-events-c-top-bar__nav-link[disabled] {
  opacity: .8 !important;
  cursor: not-allowed !important;
  color: #f5c542 !important;
  border-color: rgba(245,197,66,.45) !important;
}

/* ---------------------------------
   4) Hero
----------------------------------*/
.hero-section{
  max-width:1120px; margin:0 auto; padding:0 0 1rem;
}
.hero-media{ margin:0 auto 1.2rem; max-width:980px; }
.hero-media .wp-block-image{ margin:0; }

.hero-title, .wp-block-heading.hero-title{
  font-family: var(--rk-font);
  font-weight:700;
  font-size:clamp(28px,3vw,35px);
  line-height:40px;
  text-transform:uppercase;
  color:var(--rk-white);
  text-align:center;
  margin:2rem 0 1.2rem;
}

.hero-textbox{
  max-width:980px; margin:0 auto 1.25rem;
  background:var(--rk-panel); color:var(--rk-text);
  border-radius:14px; padding:22px 28px;
  box-shadow:0 12px 32px rgba(0,0,0,.22);
}
.hero-textbox p{ margin:0 0 .9rem; line-height:1.7; }

/* Einheitlicher Kachel-Look für alle hero-lead */
.neve-main .hero-lead{
  font-family:var(--rk-font);
  font-weight:400;
  font-size:18px;
  line-height:1.6;
  color:#f5f5f5;
  max-width:900px;
  margin:20px auto;
  text-align:left;
  display:block;

  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.06);
  border-radius:16px;
  padding:18px 22px;
  box-shadow:0 8px 24px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);
}

/* Bio: Spalten transparent halten (keine Flächen einfärben) */
.bio-cols .wp-block-column{
  background:transparent !important;
  box-shadow:none !important;
  border:0 !important;
}
.bio-cols .hero-title{ margin-bottom:14px; }

.hero-button{ text-align:center; margin:1.25rem auto 0; max-width:980px; }
.hero-button .wp-block-button__link{
  background:transparent; color:var(--rk-white);
  border:1px solid var(--rk-white); border-radius:999px;
  padding:.85rem 1.4rem; font-weight:600;
  transition:background .2s, color .2s, border-color .2s;
}
.hero-button .wp-block-button__link:hover{
  background:var(--rk-white); color:#111;
}

@media (max-width:600px){
  .hero-textbox{ padding:1.5rem 1rem; border-radius:12px; }
}

/* ---------------------------------
   Kontaktformular #3 kompakt
----------------------------------*/

/* Breite & Zentrierung */
#frm_form_3_container{
  max-width:920px;
  margin:0 auto 64px;
  opacity:0; transform:translateY(12px);
  transition:opacity .6s ease-out, transform .6s ease-out;
  will-change:opacity, transform;
  pointer-events:none;
}
#frm_form_3_container.is-visible{
  opacity:1; transform:none; pointer-events:auto;
}

/* Zweispaltig ab Tablet */
#frm_form_3_container .frm_fields_container{
  display:flex; flex-wrap:wrap; gap:16px;
}
@media (min-width:768px){
  #frm_form_3_container .frm_half{ flex:1 1 calc(50% - 8px); min-width:280px; }
}
@media (max-width:767px){
  #frm_form_3_container .frm_half{ flex-basis:100%; }
}

/* Inputs – RemoKey Look */
#frm_form_3_container input[type="text"],
#frm_form_3_container input[type="email"],
#frm_form_3_container select,
#frm_form_3_container textarea{
  width:100%; height:44px; padding:0 14px; border-radius:12px;
  border:1px solid rgba(245,197,66,.38);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.24));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  color:#f5f5f5;
}
#frm_form_3_container textarea{
  height:auto; min-height:180px; padding:14px; resize:vertical;
}

/* Fokus */
#frm_form_3_container input:focus,
#frm_form_3_container select:focus,
#frm_form_3_container textarea:focus{
  outline:none;
  border-color:rgba(245,197,66,.55);
  box-shadow:0 0 0 3px rgba(245,197,66,.12), inset 0 1px 0 rgba(255,255,255,.08);
}

/* Labels */
#frm_form_3_container .frm_primary_label{
  font-weight:600; color:rgba(245,197,66,.85); letter-spacing:.2px; margin-bottom:4px;
}

/* Dropdown */
#frm_form_3_container select{ appearance:none; padding-right:36px; background-image:none; }

/* Turnstile Box */
#frm_form_3_container .cf-turnstile,
#frm_form_3_container .cf-turnstile iframe{ max-width:100%; }
#frm_form_3_container .cf-turnstile{ display:inline-block; margin:6px 0 8px; }

/* Submit-Button */
#frm_form_3_container .frm_submit{ margin-top:10px; }
#frm_form_3_container .frm_submit input[type="submit"]{
  height:44px; padding:0 18px; border-radius:12px;
  border:1px solid rgba(245,197,66,.55);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.28));
  color:#f5c542; font-weight:600; letter-spacing:.2px;
  box-shadow:0 0 10px rgba(245,197,66,.10), inset 0 1px 0 rgba(255,255,255,.06);
}
#frm_form_3_container .frm_submit input[type="submit"]:hover{
  border-color:rgba(245,197,66,.75);
  box-shadow:0 0 14px rgba(245,197,66,.16), inset 0 1px 0 rgba(255,255,255,.08);
}

/* Kompaktere Abstände / Farben */
#frm_form_3_container .frm_form_field{ margin-bottom:12px; }
#frm_form_3_container ::placeholder{ color:rgba(245,245,245,.6); }
#frm_form_3_container .frm_description,
#frm_form_3_container .frm_help{ color:rgba(245,245,245,.7); }
#frm_form_3_container .frm_error{ color:#ffb4b4; }
#frm_form_3_container .frm_error_style{
  border-color:rgba(255,120,120,.6);
  box-shadow:0 0 0 3px rgba(255,120,120,.12), inset 0 1px 0 rgba(255,255,255,.08);
}

/* Autofill Fix */
#frm_form_3_container input:-webkit-autofill{
  -webkit-text-fill-color:#f5f5f5;
  transition:background-color 9999s ease-out 0s;
}
#frm_form_3_container input:-webkit-autofill,
#frm_form_3_container input:-webkit-autofill:focus{
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 0 0 1000px transparent inset !important;
}

/* Kontaktseite – Layout-Kompression, wenn Formular sichtbar */
body.contact-form-visible .remokey-section{ padding-top:12px; padding-bottom:4px; }
body.contact-form-visible .remokey-section > p{ margin-bottom:12px; color:rgba(245,245,245,.7); }
body.contact-form-visible .remokey-section .wp-block-columns{ gap:18px !important; margin-bottom:6px; }
body.contact-form-visible .remokey-section .wp-block-column h2{ margin-bottom:6px; }
body.contact-form-visible .remokey-section .wp-block-column p{ margin-bottom:10px; }
body.contact-form-visible .remokey-section .wp-block-button{ margin-top:4px; }
body.contact-form-visible .remokey-section .wp-block-button .wp-block-button__link{ height:40px; padding:0 14px; }

@media (max-width:680px){
  body.contact-form-visible .remokey-section{ padding-top:8px; }
  body.contact-form-visible .remokey-section .wp-block-columns{ gap:14px !important; }
}

/* Kontaktseite – Formular standardmäßig verstecken & gezielt zeigen (Page-ID anpassen falls nötig) */
body.page-id-18 #frm_form_3_container{ display:none; }
body.page-id-18 #frm_form_3_container.rk-show{ display:block; }
@media (prefers-reduced-motion:reduce){
  #frm_form_3_container{ transition:none; transform:none; }
}

/* --- Events: 3 Spalten auf Desktop erzwingen --- */

/* Wrapper auf Desktop breiter machen */
.events-section .events-wrapper{
  max-width: 1280px !important;
  margin: 0 auto !important;
}

/* 3 gleich breite Spalten */
#artm-event-boxes{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 26px !important;
}

/* Boxen dürfen nicht ihre eigene max-width bremsen */
#artm-event-boxes .event-box{
  max-width: none !important;
  height: 100%;
}

/* Tablet: 2 Spalten */
@media (max-width: 1024px){
  #artm-event-boxes{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
}

/* Mobil: 1 Spalte */
@media (max-width: 680px){
  #artm-event-boxes{
    grid-template-columns: 1fr !important;
  }
}