/* montserrat-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/montserrat-v31-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/montserrat-v31-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/montserrat-v31-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* montserrat-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/montserrat-v31-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


      /* Verhindert das seitliche Wackeln global */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}

/* Fix für zu große Überschriften auf kleinen Handys */
h1.display-1 {
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
}

/* Sicherstellen, dass Reihen (Rows) nicht negativ ausbrechen */
.row {
    margin-right: 0;
    margin-left: 0;
}

/* Mobile Optimierung für das ausgeklappte Menü */
@media (max-width: 991px) {
    .navbar-collapse {
        background: rgba(26, 26, 26, 0.98); /* Dunkler Hintergrund für mobile Links */
        padding: 20px;
        border-radius: 15px;
        margin-top: 15px;
        border: 1px solid var(--mc-yellow);
    }
    
    .nav-link {
        padding: 10px 0;
        text-align: center;
        border-bottom: 1px solid rgba(255,255,255,0.1);
    }
}

        :root {
            --mc-yellow: #FFC72C;
            --mc-red: #BD0017;
            --mc-dark-bg: #1a1a1a;
            --mc-light-bg: #f4f4f4;
            --mc-card-bg: #2a2a2a;
            --transition: all 0.3s ease-in-out;
        }

        body {
            font-family: 'Montserrat', sans-serif;
            background-color: var(--mc-light-bg);
            color: #333;
            overflow-x: hidden;
        }

        /* Navigation */
        .navbar {
            background-color: rgba(26, 26, 26, 0.95) !important;
            backdrop-filter: blur(10px);
            border-bottom: 3px solid var(--mc-yellow);
            padding: 1rem 0;
        }
        .navbar-brand { font-weight: 900; color: white !important; font-size: 1.8rem; }
        .nav-link { color: white !important; font-weight: 600; margin: 0 10px; }
        .nav-link:hover { color: var(--mc-yellow) !important; }

        /* NEU: Hero Section mit Parallax & Clip-Path */
        .hero {
            height: 100vh;
            background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), 
                        url('.../images/photo-1550547660-d9450f859349.jpeg') no-repeat center center fixed;
            background-size: cover;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            color: white;
            clip-path: ellipse(150% 100% at 50% 0%);
            margin-bottom: -50px;
        }
        .hero h1 { 
            font-size: clamp(2.5rem, 8vw, 5rem); 
            font-weight: 900; 
            text-transform: uppercase; 
        }

        /* Top Section (Dunkler Bereich aus dem Bild) */
        .top-section {
            background: var(--mc-dark-bg);
            padding: 120px 0 100px 0;
            color: white;
            position: relative;
        }
        
        .section-title {
            font-weight: 900;
            font-size: clamp(2rem, 5vw, 3rem);
            margin-bottom: 50px;
        }

        /* Cards Style (An das Bild angepasst) */
        .feature-card {
            background: var(--mc-card-bg);
            border: none;
            border-radius: 20px;
            overflow: hidden;
            height: 100%;
            transition: var(--transition);
        }
        .feature-card:hover { transform: translateY(-10px); }
        .feature-card.highlight { border: 3px solid var(--mc-yellow); }
        .feature-card img { height: 220px; object-fit: cover; }
        .feature-card .card-body { padding: 30px; }
        
        .btn-mcd {
            background: var(--mc-yellow);
            color: black;
            font-weight: 700;
            border-radius: 50px;
            padding: 12px 30px;
            border: none;
            transition: var(--transition);
            text-decoration: none;
            display: inline-block;
        }
        .btn-mcd:hover { background: white; transform: scale(1.05); color: black; }

        /* Franchise Section (Heller Bereich aus dem Bild) */
        .franchise-section {
            padding: 100px 0;
            background: white;
        }
        .franchise-card {
            background: #fff;
            border-radius: 20px;
            box-shadow: 0 15px 35px rgba(0,0,0,0.1);
            padding: 25px;
            height: 100%;
            transition: var(--transition);
        }
        .price-tag { font-size: 2.5rem; font-weight: 900; color: var(--mc-red); margin: 10px 0; }

        /* Über uns */
        .about-section { padding: 100px 0; background: var(--mc-light-bg); }
        .about-img { border-radius: 30px; box-shadow: 0 20px 40px rgba(0,0,0,0.1); }

        /* Kontakt */
        .contact-section {
            background: var(--mc-red);
            color: white;
            padding: 100px 0;
        }
        .contact-card {
            background: white;
            border-radius: 20px;
            padding: 40px;
            color: black;
        }

        /* Footer */
        footer { background: var(--mc-dark-bg); color: white; padding: 60px 0; }

        @media (max-width: 991px) {
            .hero { clip-path: none; }
            .navbar-collapse { background: var(--mc-dark-bg); padding: 20px; border-radius: 10px; }
        }
        /* Anpassung für Mobilgeräte (max. Breite 768px oder 991px) */
@media (max-width: 768px) {
    .navbar-brand {
        font-size: 1.2rem; /* Etwas kleiner für Handys */
    }
}