/* ============================================
   CHROMSTAHL MODERNISIERUNG 2026
   Moderne Effekte, Animationen & Design
   ============================================ */

/* --- Google Fonts Import --- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900');
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700;800;900');

/* --- CSS Custom Properties --- */
:root {
  --cs-primary: #c0392b;
  --cs-primary-dark: #96281b;
  --cs-accent: #e74c3c;
  --cs-dark: #0a0f1a;
  --cs-darker: #060a12;
  --cs-gray: #1a1f2e;
  --cs-light: #f0f2f5;
  --cs-text: #2c3e50;
  --cs-text-light: #7f8c8d;
  --cs-white: #ffffff;
  --cs-gradient: linear-gradient(135deg, var(--cs-primary) 0%, var(--cs-accent) 100%);
  --cs-shadow-sm: 0 2px 8px rgba(0,0,0,0.08);
  --cs-shadow-md: 0 8px 30px rgba(0,0,0,0.12);
  --cs-shadow-lg: 0 20px 60px rgba(0,0,0,0.15);
  --cs-shadow-glow: 0 0 40px rgba(192,57,43,0.2);
  --cs-radius: 16px;
  --cs-transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* --- Global Reset & Base --- */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  color: var(--cs-text) !important;
  overflow-x: hidden !important;
}

/* Smooth Scrolling */
html {
  scroll-behavior: smooth !important;
}

/* --- SCROLL ANIMATIONS --- */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(40px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInLeft {
  from { opacity: 0; transform: translateX(-40px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes fadeInRight {
  from { opacity: 0; transform: translateX(40px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.9); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

@keyframes pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}

@keyframes gradientShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
}

@keyframes slideInFromBottom {
  0% { opacity: 0; transform: translateY(60px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Animate sections on load */
.vc_row.wpb_row.section {
  animation: fadeInUp 0.8s ease-out both;
}

.vc_row.wpb_row.section:nth-child(2) { animation-delay: 0.15s; }
.vc_row.wpb_row.section:nth-child(3) { animation-delay: 0.3s; }
.vc_row.wpb_row.section:nth-child(4) { animation-delay: 0.45s; }

/* --- HEADER / NAVIGATION --- */
header.page_header {
  background: rgba(10, 15, 26, 0.85) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  transition: var(--cs-transition) !important;
}

header.page_header .header_bottom {
  background: transparent !important;
}

header.page_header:hover {
  background: rgba(10, 15, 26, 0.95) !important;
}

/* Nav Links */
nav.main_menu ul > li > a {
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  transition: var(--cs-transition) !important;
  position: relative !important;
  padding: 10px 18px !important;
}

nav.main_menu ul > li > a span {
  position: relative !important;
}

nav.main_menu ul > li > a span::after {
  content: '' !important;
  position: absolute !important;
  bottom: -4px !important;
  left: 0 !important;
  width: 0 !important;
  height: 2px !important;
  background: var(--cs-gradient) !important;
  transition: width 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  border-radius: 2px !important;
}

nav.main_menu ul > li > a:hover span::after,
nav.main_menu ul > li.active > a span::after {
  width: 100% !important;
}

nav.main_menu ul > li > a:hover span,
nav.main_menu ul > li.active > a span {
  color: var(--cs-white) !important;
}

/* Logo Glow */
.q_logo a {
  transition: var(--cs-transition) !important;
}

.q_logo a:hover {
  filter: drop-shadow(0 0 12px rgba(192,57,43,0.5)) !important;
}

/* --- HERO SLIDER --- */
#qode-home-slider {
  position: relative !important;
}

#qode-home-slider .item .image::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: linear-gradient(
    135deg,
    rgba(10, 15, 26, 0.75) 0%,
    rgba(10, 15, 26, 0.4) 40%,
    rgba(192, 57, 43, 0.15) 100%
  ) !important;
  z-index: 1 !important;
}

#qode-home-slider .slider_content {
  z-index: 2 !important;
  position: relative !important;
}

/* Hero Titles */
#qode-home-slider .q_slide_title {
  font-family: 'Barlow', sans-serif !important;
  color: var(--cs-white) !important;
  font-weight: 900 !important;
  text-shadow: 0 4px 30px rgba(0,0,0,0.4) !important;
  letter-spacing: -1px !important;
  animation: slideInFromBottom 1s ease-out both !important;
}

#qode-home-slider .q_slide_title span {
  background: var(--cs-gradient) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

#qode-home-slider .q_slide_subtitle {
  font-family: 'Inter', sans-serif !important;
  font-weight: 400 !important;
  color: rgba(255,255,255,0.85) !important;
  text-shadow: 0 2px 15px rgba(0,0,0,0.3) !important;
  animation: slideInFromBottom 1s ease-out 0.2s both !important;
}

/* Hero Separator Line */
#qode-home-slider .separator {
  background: var(--cs-gradient) !important;
  height: 3px !important;
  border-radius: 3px !important;
  animation: slideInFromBottom 1s ease-out 0.4s both !important;
}

/* Slider Navigation Arrows */
#qode-home-slider .carousel-control .prev_nav,
#qode-home-slider .carousel-control .next_nav {
  background: rgba(255,255,255,0.1) !important;
  backdrop-filter: blur(10px) !important;
  border-radius: 50% !important;
  width: 56px !important;
  height: 56px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  transition: var(--cs-transition) !important;
}

#qode-home-slider .carousel-control .prev_nav:hover,
#qode-home-slider .carousel-control .next_nav:hover {
  background: var(--cs-primary) !important;
  border-color: var(--cs-primary) !important;
  transform: scale(1.1) !important;
}

/* Slider Indicators */
#qode-home-slider .carousel-indicators li {
  width: 32px !important;
  height: 4px !important;
  border-radius: 4px !important;
  background: rgba(255,255,255,0.3) !important;
  border: none !important;
  margin: 0 4px !important;
  transition: var(--cs-transition) !important;
}

#qode-home-slider .carousel-indicators li.active {
  width: 48px !important;
  background: var(--cs-gradient) !important;
}

/* --- TYPOGRAPHY --- */
h1, h2, h3, h4, h5, h6,
.wpb_text_column h2 {
  font-family: 'Barlow', sans-serif !important;
  font-weight: 700 !important;
  color: var(--cs-dark) !important;
  letter-spacing: -0.5px !important;
}

p, .wpb_text_column p {
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
  color: var(--cs-text-light) !important;
}

/* --- SECTION BACKGROUNDS --- */
.vc_row.wpb_row.section[style*="background-color:#ffffff"],
.vc_row.wpb_row.section[style*="background-color: #ffffff"] {
  background-color: var(--cs-white) !important;
}

/* --- "Nr. 1" HEADLINE SECTION --- */
.custom_font_holder {
  font-family: 'Barlow', sans-serif !important;
  transition: var(--cs-transition) !important;
}

/* Large stat numbers */
.custom_font_holder[style*="font-size: 120px"] {
  background: var(--cs-gradient) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  font-family: 'Barlow', sans-serif !important;
  position: relative !important;
}

/* "Nr. 1" / "Edelstahl" highlight */
.custom_font_holder span[style*="color: #ff0000"] {
  color: transparent !important;
  background: var(--cs-gradient) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* --- PRODUCT CARDS (Gebürstet, Geprägt, Dessiniert) --- */
.vc_col-sm-4 .vc_column-inner {
  transition: var(--cs-transition) !important;
  border-radius: var(--cs-radius) !important;
  padding: 20px !important;
}

.vc_col-sm-4 .vc_column-inner:hover {
  transform: translateY(-8px) !important;
  box-shadow: var(--cs-shadow-lg) !important;
  background: var(--cs-white) !important;
}

/* Product Images */
.wpb_single_image .vc_single_image-wrapper {
  border-radius: var(--cs-radius) !important;
  overflow: hidden !important;
  box-shadow: var(--cs-shadow-md) !important;
  transition: var(--cs-transition) !important;
  position: relative !important;
}

.wpb_single_image .vc_single_image-wrapper::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: linear-gradient(
    to bottom,
    transparent 50%,
    rgba(10, 15, 26, 0.5) 100%
  ) !important;
  opacity: 0 !important;
  transition: var(--cs-transition) !important;
  border-radius: var(--cs-radius) !important;
  pointer-events: none !important;
}

.vc_col-sm-4:hover .wpb_single_image .vc_single_image-wrapper::after {
  opacity: 1 !important;
}

.wpb_single_image .vc_single_image-wrapper img {
  transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  border-radius: var(--cs-radius) !important;
}

.vc_col-sm-4:hover .wpb_single_image .vc_single_image-wrapper img {
  transform: scale(1.08) !important;
}

/* 3D Shadow Override */
.vc_box_shadow_3d {
  box-shadow: var(--cs-shadow-md) !important;
  border-radius: var(--cs-radius) !important;
}

.vc_col-sm-4:hover .vc_box_shadow_3d {
  box-shadow: var(--cs-shadow-lg), var(--cs-shadow-glow) !important;
}

/* Product Titles */
.vc_col-sm-4 .wpb_text_column h2 {
  font-size: 20px !important;
  font-weight: 700 !important;
  transition: var(--cs-transition) !important;
  position: relative !important;
}

.vc_col-sm-4:hover .wpb_text_column h2 {
  color: var(--cs-primary) !important;
}

/* --- IMAGE GALLERY / FLEXSLIDER --- */
.wpb_gallery .flexslider {
  border-radius: var(--cs-radius) !important;
  overflow: hidden !important;
  box-shadow: var(--cs-shadow-lg) !important;
  border: none !important;
  margin: 40px 0 !important;
}

.wpb_gallery .flexslider .slides img {
  border-radius: 0 !important;
  transition: transform 0.8s ease !important;
}

.wpb_gallery .flexslider:hover .slides img {
  transform: scale(1.02) !important;
}

.wpb_gallery .flexslider .flex-direction-nav a {
  background: rgba(10, 15, 26, 0.6) !important;
  backdrop-filter: blur(10px) !important;
  border-radius: 50% !important;
  width: 48px !important;
  height: 48px !important;
  transition: var(--cs-transition) !important;
}

.wpb_gallery .flexslider .flex-direction-nav a:hover {
  background: var(--cs-primary) !important;
}

/* --- STATS SECTION (60, 5500, 100) --- */
.vc_row[style*="padding-bottom:100px"] .vc_col-sm-4 .vc_column-inner {
  background: var(--cs-white) !important;
  border-radius: var(--cs-radius) !important;
  padding: 40px 30px !important;
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(0,0,0,0.04) !important;
}

.vc_row[style*="padding-bottom:100px"] .vc_col-sm-4 .vc_column-inner::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 4px !important;
  background: var(--cs-gradient) !important;
  border-radius: 4px 4px 0 0 !important;
  transform: scaleX(0) !important;
  transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  transform-origin: left !important;
}

.vc_row[style*="padding-bottom:100px"] .vc_col-sm-4 .vc_column-inner:hover::before {
  transform: scaleX(1) !important;
}

.vc_row[style*="padding-bottom:100px"] .vc_col-sm-4 .vc_column-inner:hover {
  box-shadow: var(--cs-shadow-lg) !important;
  transform: translateY(-8px) !important;
  border-color: transparent !important;
}

/* --- PARALLAX COUNTER SECTION --- */
.parallax_section_holder {
  position: relative !important;
}

.parallax_section_holder::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: linear-gradient(
    135deg,
    rgba(10, 15, 26, 0.8) 0%,
    rgba(192, 57, 43, 0.4) 100%
  ) !important;
  z-index: 1 !important;
}

.parallax_section_holder .parallax_content {
  position: relative !important;
  z-index: 2 !important;
}

.q_counter_holder .counter {
  font-family: 'Barlow', sans-serif !important;
  font-weight: 900 !important;
  color: var(--cs-white) !important;
  text-shadow: 0 4px 30px rgba(192,57,43,0.3) !important;
}

/* --- SEPARATORS --- */
.separator.small {
  background: var(--cs-gradient) !important;
  height: 3px !important;
  border-radius: 3px !important;
  transition: width 0.6s ease !important;
}

/* --- CTA (Call to Action) BAR --- */
.call_to_action {
  background: var(--cs-gradient) !important;
  background-size: 200% 200% !important;
  animation: gradientShift 4s ease infinite !important;
  position: relative !important;
  overflow: hidden !important;
}

.call_to_action::before {
  content: '' !important;
  position: absolute !important;
  top: -50% !important;
  left: -50% !important;
  width: 200% !important;
  height: 200% !important;
  background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 60%) !important;
  animation: float 6s ease-in-out infinite !important;
  pointer-events: none !important;
}

.call_to_action_text {
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  font-size: 18px !important;
  letter-spacing: 0.3px !important;
}

/* CTA Button */
.call_to_action .qbutton {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  font-size: 13px !important;
  padding: 16px 40px !important;
  border-radius: 50px !important;
  transition: var(--cs-transition) !important;
  position: relative !important;
  overflow: hidden !important;
  border: 2px solid var(--cs-white) !important;
}

.call_to_action .qbutton:hover {
  background: var(--cs-white) !important;
  color: var(--cs-primary) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.2) !important;
}

/* --- ALL BUTTONS (Global) --- */
.qbutton,
a.qbutton {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  border-radius: 50px !important;
  transition: var(--cs-transition) !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  position: relative !important;
  overflow: hidden !important;
}

.qbutton:hover,
a.qbutton:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--cs-shadow-md) !important;
}

/* --- FOOTER --- */
footer {
  background: var(--cs-dark) !important;
  position: relative !important;
}

footer::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: var(--cs-gradient) !important;
}

.footer_top {
  background: var(--cs-dark) !important;
  padding: 60px 0 40px !important;
}

.footer_top_border {
  display: none !important;
}

footer h5 {
  font-family: 'Barlow', sans-serif !important;
  font-weight: 700 !important;
  color: var(--cs-white) !important;
  font-size: 18px !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  margin-bottom: 20px !important;
  position: relative !important;
  padding-bottom: 12px !important;
}

footer h5::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 30px !important;
  height: 2px !important;
  background: var(--cs-gradient) !important;
  border-radius: 2px !important;
}

footer .textwidget,
footer .textwidget p,
footer .widget_nav_menu a,
footer .column_inner {
  color: rgba(255,255,255,0.6) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
}

footer .widget_nav_menu a {
  transition: var(--cs-transition) !important;
  display: inline-block !important;
  padding: 4px 0 !important;
}

footer .widget_nav_menu a:hover {
  color: var(--cs-white) !important;
  transform: translateX(4px) !important;
}

footer .textwidget a {
  color: var(--cs-accent) !important;
  transition: var(--cs-transition) !important;
}

footer .textwidget a:hover {
  color: var(--cs-white) !important;
}

footer .qode_icon_element {
  color: var(--cs-accent) !important;
  transition: var(--cs-transition) !important;
}

/* --- BACK TO TOP BUTTON --- */
#back_to_top {
  background: var(--cs-gradient) !important;
  border-radius: 50% !important;
  width: 48px !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: var(--cs-shadow-md), var(--cs-shadow-glow) !important;
  transition: var(--cs-transition) !important;
  border: none !important;
}

#back_to_top:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 30px rgba(192,57,43,0.4) !important;
}

#back_to_top .fa-stack {
  color: var(--cs-white) !important;
}

#back_to_top i {
  color: var(--cs-white) !important;
}

/* --- LOADER ANIMATION --- */
.ajax_loader .two_rotating_circles .dot1,
.ajax_loader .two_rotating_circles .dot2 {
  background: var(--cs-primary) !important;
}

/* --- SELECTION COLOR --- */
::selection {
  background: var(--cs-primary) !important;
  color: var(--cs-white) !important;
}

::-moz-selection {
  background: var(--cs-primary) !important;
  color: var(--cs-white) !important;
}

/* --- SCROLLBAR --- */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--cs-dark);
}

::-webkit-scrollbar-thumb {
  background: var(--cs-gradient);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--cs-accent);
}

/* --- LINKS --- */
a {
  transition: var(--cs-transition) !important;
}

/* --- MOBILE MENU --- */
nav.mobile_menu {
  background: var(--cs-dark) !important;
  backdrop-filter: blur(20px) !important;
}

nav.mobile_menu ul li a {
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0.5px !important;
  border-color: rgba(255,255,255,0.06) !important;
}

.mobile_menu_button span i {
  color: var(--cs-white) !important;
  transition: var(--cs-transition) !important;
}

.mobile_menu_button:hover span i {
  color: var(--cs-accent) !important;
}

/* --- RESPONSIVE --- */
@media screen and (max-width: 1024px) {
  #qode-home-slider .q_slide_title {
    font-size: 60px !important;
    line-height: 65px !important;
  }

  #qode-home-slider .q_slide_subtitle {
    font-size: 24px !important;
  }

  .custom_font_holder[style*="font-size: 64px"] {
    font-size: 40px !important;
    line-height: 45px !important;
  }
}

@media screen and (max-width: 768px) {
  #qode-home-slider .q_slide_title {
    font-size: 36px !important;
    line-height: 42px !important;
  }

  #qode-home-slider .q_slide_subtitle {
    font-size: 18px !important;
  }

  .custom_font_holder[style*="font-size: 64px"] {
    font-size: 28px !important;
    line-height: 34px !important;
  }

  .custom_font_holder[style*="font-size: 120px"] {
    font-size: 72px !important;
    line-height: 72px !important;
  }

  .vc_col-sm-4 .vc_column-inner {
    margin-bottom: 20px !important;
  }

  .call_to_action_text {
    font-size: 15px !important;
    text-align: center !important;
  }

  .call_to_action .qbutton {
    margin-top: 20px !important;
  }

  footer .column1,
  footer .column2,
  footer .column3 {
    padding: 20px 0 !important;
  }

  .vc_row[style*="padding-top:90px"] {
    padding-top: 50px !important;
  }

  .vc_row[style*="padding-bottom:100px"] {
    padding-bottom: 50px !important;
  }
}

@media screen and (max-width: 480px) {
  #qode-home-slider .q_slide_title {
    font-size: 28px !important;
    line-height: 34px !important;
  }

  #qode-home-slider .q_slide_subtitle {
    font-size: 15px !important;
  }

  .custom_font_holder[style*="font-size: 120px"] {
    font-size: 56px !important;
    line-height: 56px !important;
  }
}

/* --- COOKIE BOX MODERNIZATION --- */
#BorlabsCookieBox ._brlbs-box {
  border-radius: var(--cs-radius) !important;
  backdrop-filter: blur(20px) !important;
  box-shadow: var(--cs-shadow-lg) !important;
}

/* --- LANGUAGE SELECTOR --- */
#lang_sel_click {
  position: relative !important;
  z-index: 99999 !important;
}

#lang_sel_click ul {
  z-index: 99999 !important;
}

#lang_sel_click ul ul {
  display: none;
  position: absolute !important;
  z-index: 99999 !important;
  background: var(--cs-white) !important;
  border-radius: 10px !important;
  box-shadow: var(--cs-shadow-lg) !important;
  overflow: visible !important;
  min-width: 160px !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
}

#lang_sel_click ul li:hover ul {
  display: block !important;
}

#lang_sel_click a {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  border-radius: 8px !important;
  transition: var(--cs-transition) !important;
}

#lang_sel_click ul ul a {
  padding: 10px 16px !important;
  color: var(--cs-text) !important;
  display: block !important;
}

#lang_sel_click ul ul a:hover {
  background: var(--cs-light) !important;
  color: var(--cs-primary) !important;
}

.header_bottom_right_widget_holder {
  position: relative !important;
  z-index: 99999 !important;
  overflow: visible !important;
}

.side_menu_button_wrapper {
  overflow: visible !important;
}

.header_inner_right {
  overflow: visible !important;
}

header .header_inner,
header .header_bottom,
header .container,
header .container_inner {
  overflow: visible !important;
}

/* --- SUBTLE PAGE BACKGROUND PATTERN --- */
.full_width_inner {
  position: relative !important;
}

/* --- IMAGE HOVER ZOOM ENHANCEMENT --- */
.qode_image_hover_zoom_in .vc_single_image-wrapper {
  overflow: hidden !important;
  border-radius: var(--cs-radius) !important;
}

.qode_image_hover_zoom_in .vc_single_image-wrapper img {
  transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.qode_image_hover_zoom_in:hover .vc_single_image-wrapper img {
  transform: scale(1.1) !important;
}

/* ============================================
   EXTRA EFFEKTE - ERWEITERTE MODERNISIERUNG
   ============================================ */

/* --- BUTTON RIPPLE / SHINE EFFECT --- */
.qbutton::before,
a.qbutton::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(255,255,255,0.3) 50%,
    transparent 100%
  ) !important;
  transition: left 0.6s ease !important;
}

.qbutton:hover::before,
a.qbutton:hover::before {
  left: 100% !important;
}

/* --- GLOWING BORDER ON PRODUCT CARDS --- */
.vc_col-sm-4 .vc_column-inner::after {
  content: '' !important;
  position: absolute !important;
  top: -2px !important;
  left: -2px !important;
  right: -2px !important;
  bottom: -2px !important;
  background: linear-gradient(45deg, transparent, var(--cs-primary), transparent, var(--cs-accent), transparent) !important;
  background-size: 400% 400% !important;
  border-radius: calc(var(--cs-radius) + 2px) !important;
  z-index: -1 !important;
  opacity: 0 !important;
  transition: opacity 0.5s ease !important;
  animation: borderGlow 3s ease infinite !important;
}

.vc_col-sm-4 .vc_column-inner {
  position: relative !important;
  z-index: 1 !important;
}

.vc_col-sm-4 .vc_column-inner:hover::after {
  opacity: 1 !important;
}

@keyframes borderGlow {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* --- TEXT SHIMMER / METALLIC EFFECT on main headline --- */
.custom_font_holder[style*="font-size: 64px"] {
  background: linear-gradient(
    90deg,
    var(--cs-dark) 0%,
    var(--cs-dark) 40%,
    var(--cs-accent) 50%,
    var(--cs-dark) 60%,
    var(--cs-dark) 100%
  ) !important;
  background-size: 200% 100% !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  animation: textShimmer 4s ease-in-out infinite !important;
}

@keyframes textShimmer {
  0% { background-position: 100% 50%; }
  100% { background-position: -100% 50%; }
}

/* Keep the red words inside the shimmer headline */
.custom_font_holder[style*="font-size: 64px"] span[style*="color: #ff0000"] {
  -webkit-text-fill-color: transparent !important;
  background: var(--cs-gradient) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  animation: none !important;
  filter: brightness(1.2) !important;
}

/* --- FLOATING DECORATIVE ELEMENTS --- */
.full_width_inner::before {
  content: '' !important;
  position: absolute !important;
  top: 15% !important;
  right: -100px !important;
  width: 300px !important;
  height: 300px !important;
  background: radial-gradient(circle, rgba(192,57,43,0.06) 0%, transparent 70%) !important;
  border-radius: 50% !important;
  animation: floatBlob 8s ease-in-out infinite !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.full_width_inner::after {
  content: '' !important;
  position: absolute !important;
  bottom: 10% !important;
  left: -80px !important;
  width: 250px !important;
  height: 250px !important;
  background: radial-gradient(circle, rgba(231,76,60,0.05) 0%, transparent 70%) !important;
  border-radius: 50% !important;
  animation: floatBlob 10s ease-in-out infinite reverse !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

@keyframes floatBlob {
  0%, 100% { transform: translate(0, 0) scale(1); }
  25% { transform: translate(20px, -30px) scale(1.1); }
  50% { transform: translate(-10px, 20px) scale(0.95); }
  75% { transform: translate(15px, 10px) scale(1.05); }
}

/* --- 3D TILT PERSPECTIVE ON PRODUCT IMAGES --- */
.wpb_single_image {
  perspective: 800px !important;
}

.wpb_single_image .vc_single_image-wrapper {
  transform-style: preserve-3d !important;
  transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.vc_col-sm-4:nth-child(1):hover .wpb_single_image .vc_single_image-wrapper {
  transform: rotateY(-5deg) rotateX(3deg) scale(1.02) !important;
}

.vc_col-sm-4:nth-child(2):hover .wpb_single_image .vc_single_image-wrapper {
  transform: rotateY(0deg) rotateX(-4deg) scale(1.02) !important;
}

.vc_col-sm-4:nth-child(3):hover .wpb_single_image .vc_single_image-wrapper {
  transform: rotateY(5deg) rotateX(3deg) scale(1.02) !important;
}

/* --- COUNTER GLOW PULSE --- */
.q_counter_holder .counter {
  animation: counterPulse 3s ease-in-out infinite !important;
  position: relative !important;
}

@keyframes counterPulse {
  0%, 100% { text-shadow: 0 4px 30px rgba(192,57,43,0.3); }
  50% { text-shadow: 0 4px 60px rgba(192,57,43,0.6), 0 0 80px rgba(231,76,60,0.3); }
}

/* --- STAT NUMBER COUNTING ANIMATION (visual bounce) --- */
.custom_font_holder[style*="font-size: 120px"] {
  animation: statBounce 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55) both !important;
}

.vc_col-sm-4:nth-child(1) .custom_font_holder[style*="font-size: 120px"] {
  animation-delay: 0.1s !important;
}

.vc_col-sm-4:nth-child(2) .custom_font_holder[style*="font-size: 120px"] {
  animation-delay: 0.3s !important;
}

.vc_col-sm-4:nth-child(3) .custom_font_holder[style*="font-size: 120px"] {
  animation-delay: 0.5s !important;
}

@keyframes statBounce {
  0% { opacity: 0; transform: translateY(30px) scale(0.8); }
  60% { transform: translateY(-5px) scale(1.05); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* --- HERO SLIDE TEXT STAGGERED ANIMATION --- */
#qode-home-slider .item.active .q_slide_title {
  animation: heroTextIn 1s cubic-bezier(0.16, 1, 0.3, 1) both !important;
}

#qode-home-slider .item.active .q_slide_subtitle {
  animation: heroTextIn 1s cubic-bezier(0.16, 1, 0.3, 1) 0.15s both !important;
}

#qode-home-slider .item.active .separator {
  animation: separatorIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.3s both !important;
}

@keyframes heroTextIn {
  0% { opacity: 0; transform: translateY(50px) skewY(2deg); filter: blur(8px); }
  100% { opacity: 1; transform: translateY(0) skewY(0deg); filter: blur(0); }
}

@keyframes separatorIn {
  0% { width: 0; opacity: 0; }
  100% { width: 25%; opacity: 1; }
}

/* --- SECTION DIVIDER GRADIENT LINES --- */
.vc_row.wpb_row.section + .vc_row.wpb_row.section {
  position: relative !important;
}

.vc_row.wpb_row.section + .vc_row.wpb_row.section::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 80px !important;
  height: 3px !important;
  background: var(--cs-gradient) !important;
  border-radius: 3px !important;
  z-index: 10 !important;
}

/* --- PARALLAX SECTION ANIMATED GRADIENT OVERLAY --- */
.parallax_section_holder::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 200px !important;
  background: linear-gradient(to top, rgba(10,15,26,0.9), transparent) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

/* --- FOOTER LINKS ARROW ON HOVER --- */
footer .widget_nav_menu a::before {
  content: '' !important;
  display: inline-block !important;
  width: 0 !important;
  height: 0 !important;
  border-top: 4px solid transparent !important;
  border-bottom: 4px solid transparent !important;
  border-left: 6px solid var(--cs-accent) !important;
  margin-right: 0 !important;
  opacity: 0 !important;
  transition: all 0.3s ease !important;
  vertical-align: middle !important;
}

footer .widget_nav_menu a:hover::before {
  margin-right: 8px !important;
  opacity: 1 !important;
}

/* --- FOOTER ICON HOVER GLOW --- */
footer .qode_icon_element:hover {
  color: var(--cs-white) !important;
  text-shadow: 0 0 15px rgba(231,76,60,0.6) !important;
}

/* --- NAV LINK HOVER GLOW --- */
nav.main_menu ul > li > a:hover {
  text-shadow: 0 0 20px rgba(255,255,255,0.3) !important;
}

/* --- IMAGE REVEAL ANIMATION (Gallery Flexslider) --- */
.wpb_gallery .flexslider .slides li {
  position: relative !important;
  overflow: hidden !important;
}

.wpb_gallery .flexslider .slides li::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: linear-gradient(135deg, rgba(10,15,26,0.15), transparent 60%) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

/* --- CTA SECTION TEXT GLOW --- */
.call_to_action_text {
  text-shadow: 0 2px 20px rgba(0,0,0,0.2) !important;
}

/* --- HEADER LOGO SUBTLE ANIMATION --- */
.q_logo img {
  transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.q_logo a:hover img {
  transform: scale(1.05) !important;
  filter: drop-shadow(0 0 15px rgba(192,57,43,0.4)) brightness(1.1) !important;
}

/* --- SMOOTH PAGE LOAD FADE --- */
.wrapper {
  animation: pageLoad 0.6s ease-out both !important;
}

@keyframes pageLoad {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

/* --- PRODUCT TITLE UNDERLINE GROW ON HOVER --- */
.vc_col-sm-4 .wpb_text_column h2::after {
  content: '' !important;
  display: block !important;
  width: 0 !important;
  height: 2px !important;
  background: var(--cs-gradient) !important;
  margin: 8px auto 0 !important;
  transition: width 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  border-radius: 2px !important;
}

.vc_col-sm-4:hover .wpb_text_column h2::after {
  width: 50px !important;
}

/* --- HOVER SHADOW LIFT on general sections --- */
.section_inner {
  transition: var(--cs-transition) !important;
}

/* --- SMOOTH IMAGE GRAYSCALE TO COLOR --- */
.wpb_gallery .flexslider .slides img {
  filter: saturate(0.85) !important;
  transition: all 0.8s ease !important;
}

.wpb_gallery .flexslider:hover .slides img {
  filter: saturate(1.15) contrast(1.05) !important;
  transform: scale(1.02) !important;
}

/* --- STATS SECTION ICON-LIKE DECORATIVE CIRCLE --- */
.vc_row[style*="padding-bottom:100px"] .vc_col-sm-4 .vc_column-inner::after {
  content: '' !important;
  position: absolute !important;
  top: 20px !important;
  right: 20px !important;
  width: 60px !important;
  height: 60px !important;
  border: 2px solid rgba(192,57,43,0.08) !important;
  border-radius: 50% !important;
  transition: all 0.5s ease !important;
  pointer-events: none !important;
}

.vc_row[style*="padding-bottom:100px"] .vc_col-sm-4 .vc_column-inner:hover::after {
  border-color: rgba(192,57,43,0.2) !important;
  transform: scale(1.3) rotate(45deg) !important;
  border-width: 1px !important;
}

/* --- BACK TO TOP PULSE RING --- */
#back_to_top::after {
  content: '' !important;
  position: absolute !important;
  top: -4px !important;
  left: -4px !important;
  right: -4px !important;
  bottom: -4px !important;
  border: 2px solid var(--cs-primary) !important;
  border-radius: 50% !important;
  animation: pulseRing 2s ease-out infinite !important;
  pointer-events: none !important;
}

@keyframes pulseRing {
  0% { transform: scale(1); opacity: 0.6; }
  100% { transform: scale(1.5); opacity: 0; }
}

/* --- LANGUAGE SELECTOR HOVER (see main lang_sel section above) --- */

/* --- HEADER SCROLL SHRINK EFFECT --- */
header.page_header.scrolled {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

header.page_header .header_bottom {
  transition: all 0.4s ease !important;
}

/* --- STAGGER ANIMATION FOR PRODUCT COLUMNS --- */
.vc_col-sm-4:nth-child(1) .vc_column-inner {
  animation: fadeInUp 0.6s ease-out 0.1s both !important;
}

.vc_col-sm-4:nth-child(2) .vc_column-inner {
  animation: fadeInUp 0.6s ease-out 0.25s both !important;
}

.vc_col-sm-4:nth-child(3) .vc_column-inner {
  animation: fadeInUp 0.6s ease-out 0.4s both !important;
}

/* --- FOCUS STYLES (Accessibility + Modern) --- */
a:focus-visible,
button:focus-visible,
.qbutton:focus-visible {
  outline: 2px solid var(--cs-accent) !important;
  outline-offset: 3px !important;
  border-radius: 4px !important;
}

/* --- SMOOTH CURSOR CHANGE ON INTERACTIVE ELEMENTS --- */
.qbutton,
.wpb_single_image a,
.carousel-control,
#back_to_top,
nav.main_menu a {
  cursor: pointer !important;
}

/* --- SUBTLE NOISE TEXTURE ON DARK SECTIONS (via gradient) --- */
.parallax_section_holder .parallax_content,
footer .footer_top {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E") !important;
  background-repeat: repeat !important;
}