* {
margin: 0;padding: 0;box-sizing: border-box;
}

body {font-family: Verdana, Arial, sans-serif;font-weight: 300;line-height: 1.95;
margin: 0 auto;background-color: oklch(0.9777 0 326);
padding-top: 0; /* Kein Padding mehr nötig */
}

/* Fixe Navigation */
.main-nav {position: fixed;top: 0;left: 0;width: 100%;background-color: #000;z-index: 1000;box-shadow: 0 2px 5px rgba(0,0,0,0.3);}

.nav-container {max-width: 1200px;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;padding: 0 20px;height: 80px;}

/* Logo/Brand */
.brand {color: #fff;text-decoration: none;font-size: 1.45rem;font-weight: bold;line-height: 0.95em;transition: color 0.3s ease;}

.brand:hover,
.brand:focus {color: #776969;outline: 2px solid transparent;outline-offset: 2px;line-height: 0.9em ;}

.brand:hover,
.brand:focus .klein {color: #ff3300;}

.schrift { font-size: 0.9rem;color: #ff3300;}

/* Desktop Navigation */
.nav-menu {display: flex;list-style: none;margin: 0;padding: 0;}

.nav-item {position: relative;}

.nav-link {display: block;color: #fff;text-decoration: none;padding: 28px 20px;transition: all 0.3s ease;border-bottom: 3px solid transparent;}

.nav-link:hover,.nav-link:focus {color: #ff0000;border-bottom-color: #ff0000;outline: none;}

.nav-link.active {color: #ff0000;border-bottom-color: transparent;}

/* Dropdown Menü */
.dropdown {position: absolute;top: 100%;left: 0;background-color: #333;min-width: 250px;
opacity: 0;visibility: hidden;transform: translateY(-10px);transition: all 0.3s ease;box-shadow: 0 5px 15px rgba(0,0,0,0.3);}

.nav-item:hover .dropdown,
.nav-item:focus-within .dropdown {opacity: 1;visibility: visible;transform: translateY(0);}

.dropdown-link {
display: block;color: #fff;text-decoration: none;padding: 15px 20px;border-bottom: 1px solid #555;transition: all 0.3s ease;}

.dropdown-link:hover,
.dropdown-link:focus {background-color: #555;color: #ff0000;outline: none;}

.dropdown-link:last-child {border-bottom: none;}

/* Mobile Menu Toggle */
.mobile-toggle {display: none;background: none;border: none;color: #fff;font-size: 1.5rem;cursor: pointer;padding: 10px;transition: color 0.3s ease;}

.mobile-toggle:hover,
.mobile-toggle:focus {color: #ff0000;outline: 2px solid #ff0000;outline-offset: 2px;}

/* Hamburger Icon */
.hamburger {display: flex;flex-direction: column;width: 25px;height: 18px;justify-content: space-between;}

.hamburger span {display: block;height: 3px;background-color: currentColor;transition: all 0.3s ease;transform-origin: center;}

.mobile-toggle.active .hamburger span:nth-child(1) {transform: rotate(45deg) translate(6px, 6px);}

.mobile-toggle.active .hamburger span:nth-child(2) {opacity: 0;}
.mobile-toggle.active .hamburger span:nth-child(3) {transform: rotate(-45deg) translate(6px, -6px);}
/* Skip Link für Barrierefreiheit */
.skip-link {position: absolute;top: -40px;left: 6px;background: #000;color: #fff;padding: 8px;text-decoration: none;z-index: 100;
border-radius: 3px;transition: top 0.3s ease;}

.skip-link:focus {top: 6px;}
/* Hero Section */
.hero-section {position: relative;height: 100vh;background: linear-gradient(135deg, #000 0%, #333 100%);display: flex;align-items: center;justify-content: center;overflow: hidden;}
.hero-section img{opacity: 1;}
.hero-background {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-image: url("https://www.lamadera.de/img/slider_photo/lamadera-parkett-design.webp");
background-size: cover;background-position: center;background-repeat: no-repeat;opacity: 0.6;}
.hero-content {position: relative;z-index: 2;text-align: center;color: #fff;max-width: 850px;padding: 0 20px;}
.hero-title {font-size: 2.8rem;font-weight: bold;margin-bottom: 1rem;text-shadow: 1px 1px 2px rgba(0,0,0,0.5);animation: fadeInUp 1s ease-out;}
.hero-subtitle {font-size: 1.5rem;margin-bottom: 2rem;opacity: 0.9;animation: fadeInUp 1s ease-out 0.3s both;}
.hero-subtitle img {opacity: 0.90;}
.hero-cta {display: inline-block;background: linear-gradient(45deg, #ff0000, #cc0a20);color: #fff;padding: 15px 30px;text-decoration: none;border-radius: 5px;
font-size: 1.1rem;font-weight: bold;transition: all 0.3s ease;box-shadow: 0 4px 15px rgba(255,0,0,0.3);animation: fadeInUp 1s ease-out 0.6s both;}
.hero-cta:hover,
.hero-cta:focus {transform: translateY(-2px);box-shadow: 0 6px 20px rgba(255,0,0,0.4);background: linear-gradient(45deg, #cc0000, #990000);}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* Main Content */
.main-content {background-color: #fff;padding: 80px 0;position: relative;z-index: 1;}

/* Content Area */
.content {padding: 40px 20px;max-width: 1200px;margin: 0 auto;}

/* Mobile Responsive */
@media (max-width: 768px) {.mobile-toggle {display: block;}
.nav-menu {
position: absolute;top: 100%;left: 0;width: 100%;background-color: #000;
flex-direction: column;transform: translateY(-100%);opacity: 0;visibility: hidden;transition: all 0.3s ease;
max-height: 0;overflow: hidden;}

.nav-menu.active {transform: translateY(0);
opacity: 1;visibility: visible;max-height: 500px;}

.nav-item {width: 100%;border-bottom: 1px solid #333;}

.nav-link {padding: 15px 20px;border-bottom: none;}

.dropdown {
position: static;
opacity: 1;
visibility: visible;
transform: none;
background-color: #222;
box-shadow: none;
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease;}

.nav-item.active .dropdown {
max-height: 300px;}

.dropdown-link {padding-left: 40px;background-color: #222;}

.hero-title {font-size: 2.2rem;}
.hero-subtitle {font-size: 1.2rem;}
.hero-cta {padding: 12px 24px;font-size: 1rem;}
.main-content {padding: 40px 0;}
.nav-container {height: 60px;}

body {padding-top: 0;}}

/* Focus Styles für bessere Barrierefreiheit */
*:focus {outline: 2px solid #ff0000;outline-offset: 2px;}

/* Screen Reader Only Text */
.sr-only {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);white-space: nowrap;border: 0;}

.site-footer {
  background-color: #000;  color: #fff;  padding: 40px 20px;  font-size: 0.95rem;}

.footer-container {display: flex;  flex-wrap: wrap;  justify-content: space-between;  max-width: 1200px;  margin: 0 auto;  gap: 20px;}

.footer-logo img {display: block;  width: 140px;  height: 140px;  object-fit: cover;}

.footer-info,
.footer-links {flex: 1 1 250px;  min-width: 200px;}

.footer-info p,
.footer-links ul {  margin-bottom: 10px;}

.footer-links ul {
  list-style: none;  padding: 0;}

.footer-links a {color: #fff;  text-decoration: none;  transition: color 0.3s ease;}

.footer-links a:hover,
.footer-links a:focus {color: #ff0000;  outline: none;}

.footer-info a {color: #fff;  text-decoration: none;}

.footer-info a:hover,
.footer-info a:focus {color: #ff0000;outline: none;}

/* Responsive Footer */
@media (max-width: 768px) {
  .footer-container {
flex-direction: column;align-items: center;text-align: center;  }
.footer-info, .footer-links {flex: unset;}
}
.container-oben {padding-top: 3.0em; margin: 0 auto; margin-top:3.0em; color: #000000;line-height: 19px; text-align: center;}
.container-oben .hero-title {font-size: 1.95rem;color: #a20d0d;text-shadow: none;}
.container-fluid {padding: 1.5em; margin: 0 auto;color: #fff;}
.container-fluid  a{color: orangered;}

.clear::after, .container::after, .container-fluid::after {clear: both;}
.darkBg {background: #000; text-align: center;}
.darkBg h2,h3 {color: #ff3300;}

.img-fluid {max-width: 99%;height: auto; border: 1px solid transparent; border-radius: 14px;  padding: 5px;box-shadow: 0 28px 16px -26px rgb(228, 223, 223);}

.cta-button {
  display: inline-block;  padding: 16px 32px;  background-color: #9b111e; /* kräftige, kontrastreiche Farbe */
  color: #fff !important;  margin-top: 0.8em;  font-size: 1.2rem;  font-weight: bold;  border-radius: 6px;
  text-decoration: none;  box-shadow: 0 2px 8px rgba(0,0,0,0.15);  transition: background 0.2s, box-shadow 0.2s;
}
.cta-button:hover,.cta-button:focus {
  background-color: #711921;  box-shadow: 0 4px 16px rgba(0,0,0,0.25);  outline: 2px solid #ffffff; /* sichtbarer Fokus */}

.absatz {max-width: 700px;}

.produkt {background: #f8f8f8; padding: 30px; border-radius: 8px; border-left: 4px solid #ff0000;}

p {font-size: larger;}

.artikel-container-fluid {margin: 1.0em; background-color: whitesmoke;color: #000;}

.artikel-container {max-width: 1200px;  margin: 0 auto;  padding: 3.0em;color: #000;}
.artikel-container h3{color: #000 !important;}
.inhalt {padding: 40px 20px;  max-width: 1200px;  margin: 0 auto;}

.links {text-align: left;}

.mitte {text-align: center;}

.rechts {text-align: right; }

.block {text-align: justify; /* Blocksatz */}

.fett {font-weight: 600;}
  
.testimonials {
      text-align: center;font-style: italic;color: black;
    }
 .testimonial {
      margin-bottom: 2rem; transform: translateY(20px);
      animation: fadeInUp 0.6s ease forwards;
    }

.testimonial h2 {text-align: center; font-weight: 500;}
.contactForm p {position:absolute;bottom:-20px;font-size:1rem;opacity:.65;-webkit-transition:all .3s linear;transition:all .3s linear}
.uneditable-input,input[type=color],input[type=date],input[type=datetime-local],input[type=datetime],input[type=email],input[type=month],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=time],input[type=url],input[type=week],select,textarea{display:inline-block;padding:4px 6px;margin-bottom:9px;font-size:1.3rem;line-height:18px;color:#9e9e9e;vertical-align:middle;border:1px solid #e3e3e3}
#kontakt {line-height: 18px;z-index: 10004;}