/* ============================================
   EXECUTIVE CHAUFFEUR SERVICE
   Mobile-First Responsive CSS
   ============================================ */

/* ============================================
   BASE MOBILE STYLES (320px - 575px)
   Mobile First Approach
   ============================================ */

/* --- Reset & Base --- */
html, body {
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
}

/* --- Typography Mobile Base --- */
h1 {
    font-size: 1.75rem !important;
    line-height: 1.3 !important;
    letter-spacing: 1px !important;
}

h2 {
    font-size: 1.5rem !important;
    line-height: 1.3 !important;
    letter-spacing: 1px !important;
}

h3 {
    font-size: 1.25rem !important;
    line-height: 1.4 !important;
}

h4 {
    font-size: 1.1rem !important;
}

h5, h6 {
    font-size: 1rem !important;
}

p {
    font-size: 0.95rem;
    line-height: 1.7;
}

/* --- Navbar Mobile --- */
.navbar {
    padding: 0.5rem 0 !important;
}

.navbar .container {
    padding-left: 15px;
    padding-right: 15px;
}

.navbar-brand img {
    width: 50px !important;
    height: auto !important;
}

.navbar-toggler {
    padding: 0.25rem 0.5rem;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.navbar-toggler:focus {
    box-shadow: none !important;
}

.navbar-collapse {
    background: rgba(18, 38, 32, 0.98);
    margin: 0 -15px;
    padding: 1rem 15px;
    border-top: 1px solid rgba(214, 173, 96, 0.1);
    margin-top: 0.5rem;
}

.navbar .nav-link {
    padding: 0.75rem 0 !important;
    font-size: 0.85rem !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.navbar .dropdown-menu {
    background: rgba(18, 38, 32, 0.95) !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    position: static !important;
    width: 100% !important;
    padding-left: 1rem !important;
}

.navbar .dropdown-item {
    padding: 0.6rem 0 !important;
    font-size: 0.8rem !important;
    color: rgba(255, 255, 255, 0.6) !important;
}

.navbar .nav-cta {
    width: 100%;
    text-align: center;
    margin-top: 1rem !important;
    margin-left: 0 !important;
    padding: 0.75rem 1.5rem !important;
}

/* --- Hero Section Mobile --- */
.hero-modern,
.hero-subpage,
section[id*="hero"] {
    min-height: 100vh;
    min-height: 100svh; /* Safe viewport height for mobile browsers */
    padding-top: 80px !important;
}

.hero-modern .container,
.hero-subpage .container {
    padding-left: 20px;
    padding-right: 20px;
}

.hero-content {
    text-align: center;
    padding: 2rem 0;
}

.hero-content h1,
.hero-modern h1,
.hero-subpage h1 {
    font-size: 1.6rem !important;
    line-height: 1.4 !important;
    margin-bottom: 1rem !important;
}

.hero-content h2,
.hero-modern h2,
.hero-subpage h2 {
    font-size: 1.3rem !important;
    line-height: 1.4 !important;
}

.hero-content p {
    font-size: 0.9rem !important;
    line-height: 1.7 !important;
}

/* Hero Background Video Mobile */
.hero-bg-video {
    object-position: center center;
}

/* Badge Mobile */
.badge-glass {
    font-size: 0.6rem !important;
    padding: 6px 14px !important;
    letter-spacing: 2px !important;
    margin-bottom: 1rem !important;
}

/* --- Buttons Mobile --- */
.btn-glow,
.btn-outline-glass {
    width: 100%;
    padding: 14px 24px !important;
    font-size: 0.8rem !important;
    letter-spacing: 1px !important;
    display: block;
    text-align: center;
    margin-bottom: 0.75rem;
}

.btn-group-mobile {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    width: 100%;
}

/* --- Feature Cards Mobile --- */
.feature-glass {
    padding: 24px 20px !important;
    margin-bottom: 1rem;
    border-radius: 12px !important;
}

.feature-icon {
    width: 50px !important;
    height: 50px !important;
    margin-bottom: 16px !important;
    border-radius: 10px !important;
}

.feature-icon svg,
.feature-icon i {
    width: 22px !important;
    height: 22px !important;
    font-size: 1.2rem !important;
}

/* --- Glass Cards Mobile --- */
.glass-card {
    padding: 20px !important;
    border-radius: 12px !important;
    margin-bottom: 1rem;
}

.glass-card-light {
    padding: 16px !important;
}

/* --- Stats Mobile --- */
.stats-glass {
    padding: 20px 15px !important;
    margin-bottom: 1rem;
    border-radius: 12px !important;
}

.stats-number {
    font-size: 2rem !important;
}

.stats-glass p,
.stats-glass span {
    font-size: 0.8rem !important;
}

/* --- Service Cards Mobile --- */
.service-card {
    height: 300px !important;
    margin-bottom: 1rem;
    border-radius: 8px !important;
}

.service-card-overlay {
    padding: 20px !important;
}

.service-card h3 {
    font-size: 1.1rem !important;
}

/* --- Testimonials Mobile --- */
.testimonial-glass {
    padding: 24px 20px !important;
    margin-bottom: 1rem;
}

.testimonial-glass::before {
    font-size: 2.5rem !important;
    top: 10px !important;
    left: 15px !important;
}

.testimonial-glass p {
    font-size: 0.9rem !important;
}

/* --- Forms Mobile --- */
.form-glass {
    padding: 12px 14px !important;
    font-size: 0.9rem !important;
    margin-bottom: 0.75rem !important;
}

select.form-glass {
    padding-right: 40px !important;
}

.form-control,
.form-select {
    font-size: 16px !important; /* Prevents iOS zoom on focus */
    padding: 12px 14px !important;
}

textarea.form-glass,
textarea.form-control {
    min-height: 100px;
}

/* --- Contact Section Mobile --- */
#Kontakt .row > [class*="col"] {
    margin-bottom: 0.5rem;
}

#Kontakt .d-flex.align-items-center {
    padding: 0.75rem !important;
}

#Kontakt .bs-icon {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
}

#Kontakt h6 {
    font-size: 0.75rem !important;
}

#Kontakt p {
    font-size: 0.85rem !important;
    margin-bottom: 0 !important;
}

/* --- Sections Spacing Mobile --- */
section {
    padding: 3rem 0 !important;
}

section .container {
    padding-left: 15px;
    padding-right: 15px;
}

.section-divider {
    max-width: 200px;
    margin: 2rem auto;
}

/* --- Grid Layouts Mobile --- */
.row {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 1rem;
}

[class*="col-md-6"],
[class*="col-lg-4"],
[class*="col-xl-3"],
[class*="col-xxl-"] {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

/* Split Hero Sections Mobile */
.row > [class*="col-md-6"][style*="height"] {
    height: 300px !important;
    min-height: 300px !important;
}

/* --- Tables Mobile --- */
.table-responsive {
    font-size: 0.8rem;
}

table {
    min-width: 100%;
}

/* --- Footer Mobile --- */
footer,
.modern-footer {
    padding: 2.5rem 0 1.5rem !important;
}

.footer-logo img, .footer-logo-img {
    height: 64px !important;
    max-width: 220px !important;
    width: auto !important;
    display: inline-block !important;
    vertical-align: middle !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    opacity: 0.95 !important;
    transition: opacity 0.2s ease, transform 0.2s ease !important;
}

.footer-logo img:hover, .footer-logo-img:hover {
    opacity: 1 !important;
    transform: translateY(-2px) !important;
}

.footer-tagline {
    font-size: 0.7rem !important;
    letter-spacing: 2px !important;
}

.footer-heading {
    font-size: 0.75rem !important;
    margin-top: 1.5rem !important;
    margin-bottom: 1rem !important;
}

.footer-links li {
    margin-bottom: 0.5rem;
}

.footer-links a {
    font-size: 0.85rem !important;
}

.footer-social {
    gap: 0.75rem !important;
}

.footer-social a {
    width: 40px !important;
    height: 40px !important;
    font-size: 1rem !important;
}

.footer-divider {
    margin: 1.5rem 0 !important;
}

.footer-bottom {
    flex-direction: column !important;
    text-align: center !important;
    gap: 0.5rem;
}

.footer-copyright {
    font-size: 0.75rem !important;
}

/* --- Floating Buttons Mobile --- */
.floating-buttons {
    right: 10px !important;
    bottom: 15px !important;
    gap: 8px !important;
}

.float-btn {
    width: 48px !important;
    height: 48px !important;
    font-size: 1.1rem !important;
}

/* --- Vehicle/Price Cards Mobile --- */
.card {
    margin-bottom: 1rem;
}

.card-body {
    padding: 1rem !important;
}

.card-title {
    font-size: 1.1rem !important;
}

.card-subtitle {
    font-size: 0.8rem !important;
}

.card-text {
    font-size: 0.85rem !important;
}

/* Price Icons Grid Mobile */
.card .row > [class*="col-xl"] {
    padding: 0.5rem;
}

.card .row > [class*="col-xl"] svg {
    font-size: 20px !important;
}

.card .row > [class*="col-xl"] p {
    font-size: 0.8rem !important;
    margin-bottom: 0;
}

/* --- Photos Gallery Mobile --- */
.photos .col.item {
    padding: 0.25rem;
}

.photos img {
    border-radius: 4px;
}

/* --- Blog Cards Mobile --- */
.blog-card {
    margin-bottom: 1.5rem;
}

.blog-card h3 {
    font-size: 1rem !important;
}

.blog-card p {
    font-size: 0.85rem !important;
}

.blog-meta {
    font-size: 0.75rem !important;
}

/* Filter Pills Mobile */
.filter-pills {
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem !important;
}

.filter-pill {
    padding: 8px 16px !important;
    font-size: 0.7rem !important;
}

/* --- Swiper/Carousel Mobile --- */
.swiper {
    padding: 0 10px;
}

.swiper-slide {
    padding: 0 5px;
}

.swiper-button-prev,
.swiper-button-next {
    display: none !important;
}

.swiper-pagination {
    position: relative !important;
    margin-top: 1rem;
}

/* --- AOS Animations Mobile - Reduce Motion --- */
@media (prefers-reduced-motion: reduce) {
    [data-aos] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* Disable some heavy animations on mobile */
[data-aos] {
    transition-duration: 400ms !important;
}

/* --- Utility Overrides Mobile --- */
.py-5 {
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
}

.my-5 {
    margin-top: 2rem !important;
    margin-bottom: 2rem !important;
}

.mb-5 {
    margin-bottom: 2rem !important;
}

.mt-5 {
    margin-top: 2rem !important;
}

.px-5 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}

.gap-4, .gap-5 {
    gap: 1rem !important;
}

.display-1 {
    font-size: 2rem !important;
}

.display-2 {
    font-size: 1.8rem !important;
}

.display-3 {
    font-size: 1.6rem !important;
}

.display-4 {
    font-size: 1.4rem !important;
}

.display-5 {
    font-size: 1.3rem !important;
}

.display-6 {
    font-size: 1.2rem !important;
}

.fs-1 {
    font-size: 1.5rem !important;
}

.fs-2 {
    font-size: 1.3rem !important;
}

.fs-3 {
    font-size: 1.2rem !important;
}

.fs-4 {
    font-size: 1.1rem !important;
}

.fs-5 {
    font-size: 1rem !important;
}

.lead {
    font-size: 1rem !important;
}


/* ============================================
   SMALL TABLETS (576px - 767px)
   ============================================ */
@media (min-width: 576px) {
    
    h1 {
        font-size: 2rem !important;
    }
    
    h2 {
        font-size: 1.75rem !important;
    }
    
    h3 {
        font-size: 1.4rem !important;
    }
    
    .hero-content h1 {
        font-size: 1.9rem !important;
    }
    
    .hero-content h2 {
        font-size: 1.5rem !important;
    }
    
    .btn-glow,
    .btn-outline-glass {
        width: auto;
        display: inline-block;
    }
    
    .feature-glass {
        padding: 28px 24px !important;
    }
    
    .stats-number {
        font-size: 2.25rem !important;
    }
    
    .service-card {
        height: 350px !important;
    }
    
    section {
        padding: 3.5rem 0 !important;
    }
    
    /* Two columns for some cards */
    .row-cols-md-2 > * {
        flex: 0 0 auto;
        width: 50%;
    }
}


/* ============================================
   TABLETS (768px - 991px)
   ============================================ */
@media (min-width: 768px) {
    
    h1 {
        font-size: 2.25rem !important;
        letter-spacing: 1.5px !important;
    }
    
    h2 {
        font-size: 2rem !important;
    }
    
    h3 {
        font-size: 1.5rem !important;
    }
    
    p {
        font-size: 1rem;
    }
    
    .navbar-brand img {
        width: 55px !important;
    }
    
    .hero-modern,
    .hero-subpage {
        min-height: 80vh;
        padding-top: 100px !important;
    }
    
    .hero-content h1 {
        font-size: 2.2rem !important;
    }
    
    .hero-content h2 {
        font-size: 1.7rem !important;
    }
    
    .badge-glass {
        font-size: 0.65rem !important;
        padding: 8px 18px !important;
    }
    
    .btn-glow {
        padding: 14px 32px !important;
        font-size: 0.85rem !important;
    }
    
    .btn-outline-glass {
        padding: 13px 28px !important;
    }
    
    .feature-glass {
        padding: 35px 28px !important;
    }
    
    .feature-icon {
        width: 55px !important;
        height: 55px !important;
    }
    
    .glass-card {
        padding: 28px !important;
        border-radius: 14px !important;
    }
    
    .stats-glass {
        padding: 25px !important;
    }
    
    .stats-number {
        font-size: 2.5rem !important;
    }
    
    .service-card {
        height: 380px !important;
    }
    
    .service-card-overlay {
        padding: 28px !important;
    }
    
    .testimonial-glass {
        padding: 32px 28px !important;
    }
    
    section {
        padding: 4rem 0 !important;
    }
    
    .section-divider {
        max-width: 400px;
    }
    
    footer,
    .modern-footer {
        padding: 3rem 0 2rem !important;
    }
    
    .footer-heading {
        margin-top: 0 !important;
    }
    
    .footer-social a {
        width: 44px !important;
        height: 44px !important;
    }
    
    .floating-buttons {
        right: 15px !important;
        bottom: 20px !important;
    }
    
    .float-btn {
        width: 52px !important;
        height: 52px !important;
    }
    
    /* Split Hero adjustment */
    .row > [class*="col-md-6"][style*="height"] {
        height: 500px !important;
    }
    
    .display-4 {
        font-size: 1.8rem !important;
    }
    
    .display-5 {
        font-size: 1.5rem !important;
    }
    
    .fs-1 {
        font-size: 1.75rem !important;
    }
    
    .fs-2 {
        font-size: 1.5rem !important;
    }
    
    .py-5 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }
}


/* ============================================
   SMALL DESKTOPS (992px - 1199px)
   ============================================ */
@media (min-width: 992px) {
    
    h1 {
        font-size: 2.75rem !important;
        letter-spacing: 2px !important;
    }
    
    h2 {
        font-size: 2.25rem !important;
    }
    
    h3 {
        font-size: 1.75rem !important;
    }
    
    /* Navbar Desktop */
    .navbar {
        padding: 0.75rem 0 !important;
    }
    
    .navbar-brand img {
        width: 60px !important;
    }
    
    .navbar-collapse {
        background: transparent;
        margin: 0;
        padding: 0;
        border-top: none;
        margin-top: 0;
    }
    
    .navbar .nav-link {
        padding: 0.5rem 0.8rem !important;
        font-size: 0.75rem !important;
        border-bottom: none;
    }
    
    .navbar .dropdown-menu {
        position: absolute !important;
        padding: 0.5rem 0 !important;
        padding-left: 0 !important;
        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3) !important;
        border: 1px solid rgba(214, 173, 96, 0.15) !important;
    }
    
    .navbar .dropdown-item {
        padding: 0.6rem 1.25rem !important;
    }
    
    .navbar .nav-cta {
        width: auto;
        margin-left: 1rem !important;
        padding: 0.5rem 1.25rem !important;
    }
    
    .hero-modern,
    .hero-subpage {
        min-height: 100vh;
    }
    
    .hero-content {
        text-align: left;
    }
    
    .hero-content h1 {
        font-size: 2.5rem !important;
    }
    
    .feature-glass {
        padding: 40px 30px !important;
    }
    
    .feature-icon {
        width: 60px !important;
        height: 60px !important;
    }
    
    .glass-card {
        padding: 32px !important;
    }
    
    .stats-number {
        font-size: 2.75rem !important;
    }
    
    .service-card {
        height: 400px !important;
    }
    
    section {
        padding: 5rem 0 !important;
    }
    
    footer,
    .modern-footer {
        padding: 4rem 0 2rem !important;
    }
    
    .footer-bottom {
        flex-direction: row !important;
        text-align: left !important;
    }
    
    /* Split Hero full height */
    .row > [class*="col-md-6"][style*="height"] {
        height: 700px !important;
    }
    
    .display-4 {
        font-size: 2.25rem !important;
    }
    
    .fs-1 {
        font-size: 2rem !important;
    }
}


/* ============================================
   LARGE DESKTOPS (1200px - 1399px)
   ============================================ */
@media (min-width: 1200px) {
    
    h1 {
        font-size: 3rem !important;
    }
    
    h2 {
        font-size: 2.5rem !important;
    }
    
    h3 {
        font-size: 2rem !important;
    }
    
    .navbar .nav-link {
        padding: 0.5rem 1rem !important;
        font-size: 0.8rem !important;
    }
    
    .hero-content h1 {
        font-size: 3rem !important;
    }
    
    .hero-content h2 {
        font-size: 2rem !important;
    }
    
    .btn-glow {
        padding: 14px 36px !important;
    }
    
    .stats-number {
        font-size: 3rem !important;
    }
    
    .section-divider {
        max-width: 600px;
    }
    
    /* Split Hero original height */
    .row > [class*="col-md-6"][style*="height"] {
        height: 900px !important;
    }
    
    .display-1 {
        font-size: 3.5rem !important;
    }
    
    .display-2 {
        font-size: 3rem !important;
    }
    
    .display-3 {
        font-size: 2.75rem !important;
    }
    
    .display-4 {
        font-size: 2.5rem !important;
    }
}


/* ============================================
   EXTRA LARGE DESKTOPS (1400px+)
   ============================================ */
@media (min-width: 1400px) {
    
    h1 {
        font-size: 3.5rem !important;
    }
    
    h2 {
        font-size: 2.75rem !important;
    }
    
    .hero-content h1 {
        font-size: 3.5rem !important;
    }
    
    .container {
        max-width: 1320px;
    }
}


/* ============================================
   LANDSCAPE MOBILE ADJUSTMENTS
   ============================================ */
@media (max-width: 991px) and (orientation: landscape) {
    
    .hero-modern,
    .hero-subpage {
        min-height: auto;
        padding: 100px 0 60px !important;
    }
    
    .hero-content h1 {
        font-size: 1.5rem !important;
    }
    
    .hero-content h2 {
        font-size: 1.2rem !important;
    }
    
    section {
        padding: 2.5rem 0 !important;
    }
}


/* ============================================
   SPECIAL HEIGHT ADJUSTMENTS
   For short devices (e.g., iPhone SE)
   ============================================ */
@media (max-height: 600px) and (max-width: 767px) {
    
    .hero-modern,
    .hero-subpage {
        min-height: auto;
        padding: 80px 0 40px !important;
    }
    
    .hero-content h1 {
        font-size: 1.4rem !important;
        margin-bottom: 0.75rem !important;
    }
    
    .btn-glow,
    .btn-outline-glass {
        padding: 12px 20px !important;
    }
    
    section {
        padding: 2rem 0 !important;
    }
}


/* ============================================
   TOUCH DEVICE OPTIMIZATIONS
   ============================================ */
@media (hover: none) and (pointer: coarse) {
    
    /* Larger tap targets */
    .btn-glow,
    .btn-outline-glass,
    .nav-link,
    .dropdown-item,
    .footer-links a,
    .float-btn {
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Disable hover effects that don't work on touch */
    .feature-glass:hover,
    .glass-card:hover,
    .stats-glass:hover,
    .service-card:hover {
        transform: none;
    }
    
    /* Active states instead */
    .feature-glass:active,
    .glass-card:active,
    .stats-glass:active {
        transform: scale(0.98);
    }
    
    .btn-glow:active,
    .btn-outline-glass:active {
        transform: scale(0.97);
    }
}


/* ============================================
   PRINT STYLES
   ============================================ */
@media print {
    
    .navbar,
    .floating-buttons,
    footer,
    .modern-footer {
        display: none !important;
    }
    
    .hero-modern,
    .hero-subpage {
        min-height: auto !important;
        padding: 20px !important;
        background: white !important;
    }
    
    * {
        background: white !important;
        color: black !important;
    }
    
    section {
        padding: 20px 0 !important;
        page-break-inside: avoid;
    }
}


/* ============================================
   HIGH CONTRAST MODE
   ============================================ */
@media (prefers-contrast: high) {
    
    .glass-card,
    .feature-glass,
    .stats-glass,
    .testimonial-glass {
        border-width: 2px !important;
    }
    
    .navbar .nav-link {
        color: white !important;
    }
    
    .btn-glow {
        border: 2px solid #000 !important;
    }
}


/* ============================================
   DARK MODE SUPPORT (if needed)
   ============================================ */
@media (prefers-color-scheme: dark) {
    /* Site is already dark, but this is here for reference */
}


/* ============================================
   SPECIFIC PAGE FIXES
   ============================================ */

/* --- Vehicle Pages Hero Fix --- */
#herobusiness .row > [class*="col-md-6"],
#herovan .row > [class*="col-md-6"],
#herofirst .row > [class*="col-md-6"],
#heroelectric .row > [class*="col-md-6"],
#herosuv .row > [class*="col-md-6"],
#herosprinter .row > [class*="col-md-6"] {
    min-height: 350px !important;
}

@media (max-width: 767px) {
    #herobusiness .row > [class*="col-md-6"][style*="height"],
    #herovan .row > [class*="col-md-6"][style*="height"],
    #herofirst .row > [class*="col-md-6"][style*="height"],
    #heroelectric .row > [class*="col-md-6"][style*="height"],
    #herosuv .row > [class*="col-md-6"][style*="height"],
    #herosprinter .row > [class*="col-md-6"][style*="height"] {
        height: 300px !important;
        min-height: 300px !important;
    }
    
    #herobusiness .row,
    #herovan .row,
    #herofirst .row,
    #heroelectric .row,
    #herosuv .row,
    #herosprinter .row {
        flex-direction: column-reverse;
    }
    
    #herobusiness [style*="padding-right: 30px"],
    #herovan [style*="padding-right: 30px"],
    #herofirst [style*="padding-right: 30px"] {
        padding: 20px 15px !important;
    }
}

/* --- Price Cards Mobile Fix --- */
@media (max-width: 767px) {
    #preisebusiness .card,
    #preisevan .card,
    #preise7er .card,
    #preiseeqs .card,
    #preisex7 .card,
    #preisesprinter .card {
        margin-bottom: 1.5rem;
    }
    
    .card .row > [class*="col-xl"],
    .card .row > [class*="col-xxl"] {
        width: 50% !important;
        flex: 0 0 50% !important;
        margin-bottom: 1rem;
    }
    
    .card .row > [class*="col-xl"]:last-child {
        width: 100% !important;
        flex: 0 0 100% !important;
    }
    
    .card-body .row:last-child {
        flex-direction: column;
    }
    
    .card-body .row:last-child > [class*="col"] {
        width: 100% !important;
        margin-bottom: 0.5rem;
    }
    
    .card-body .btn {
        width: 100% !important;
        margin-bottom: 0.5rem !important;
    }
}

/* --- Photos Gallery Mobile --- */
@media (max-width: 575px) {
    .photos .row {
        margin: 0 -5px;
    }
    
    .photos .col.item {
        padding: 5px !important;
    }
    
    .photos .col.item img {
        height: 150px;
        object-fit: cover;
    }
}

/* --- Contact Section Mobile Fix --- */
@media (max-width: 767px) {
    #Kontakt .container > .row:first-child {
        margin-bottom: 1.5rem !important;
    }
    
    #Kontakt .row.d-flex > .col {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    #Kontakt .d-flex.align-items-center {
        flex-direction: row !important;
        padding: 0.5rem 0 !important;
    }
    
    #Kontakt .card {
        margin-top: 1.5rem;
    }
    
    #Kontakt .card-body {
        padding: 1.5rem !important;
    }
    
    #Kontakt form .mb-3 {
        margin-bottom: 0.75rem !important;
    }
    
    #Kontakt form input,
    #Kontakt form select,
    #Kontakt form textarea {
        font-size: 16px !important;
    }
}

/* --- Blog Page Specific Fixes --- */
@media (max-width: 767px) {
    .blog-hero {
        padding: 100px 15px 60px !important;
    }
    
    .blog-grid {
        padding: 0 10px;
    }
    
    .blog-card {
        margin-bottom: 1.25rem;
    }
    
    .blog-card .card-body {
        padding: 1.25rem !important;
    }
    
    .blog-tags {
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    
    .blog-tag {
        font-size: 0.65rem !important;
        padding: 4px 10px !important;
    }
    
    /* Blog Article Pages */
    article.blog-post {
        padding: 0 15px;
    }
    
    article.blog-post h1 {
        font-size: 1.5rem !important;
    }
    
    article.blog-post h2 {
        font-size: 1.25rem !important;
    }
    
    article.blog-post h3 {
        font-size: 1.1rem !important;
    }
    
    .blog-meta {
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    
    .reading-progress {
        height: 3px !important;
    }
}

/* --- Service Pages Fixes --- */
@media (max-width: 767px) {
    .hero-subpage {
        min-height: auto !important;
        padding: 100px 0 60px !important;
    }
    
    .hero-subpage .container {
        padding: 0 20px;
    }
    
    .hero-subpage h1,
    .hero-subpage h2 {
        font-size: 1.4rem !important;
        line-height: 1.4 !important;
    }
    
    .hero-subpage p {
        font-size: 0.9rem !important;
    }
}

/* --- Cooperation/Partnership Pages --- */
@media (max-width: 767px) {
    .partner-card,
    .cooperation-card {
        padding: 1.5rem !important;
        margin-bottom: 1rem;
    }
    
    .partner-logo {
        max-width: 120px;
        margin: 0 auto 1rem;
    }
}

/* --- Table Responsiveness --- */
@media (max-width: 575px) {
    .table-responsive {
        margin: 0 -15px;
        padding: 0 15px;
    }
    
    table th,
    table td {
        padding: 0.5rem !important;
        font-size: 0.8rem !important;
        white-space: nowrap;
    }
}

/* --- Swiper/Slider Fixes --- */
@media (max-width: 767px) {
    .swiper-container,
    .swiper {
        margin: 0 -15px;
        padding: 0 15px;
    }
    
    .swiper-slide {
        width: 280px !important;
    }
    
    #Angebote .swiper-slide {
        width: 260px !important;
    }
}

/* --- Icon Boxes Mobile --- */
@media (max-width: 767px) {
    .icon-box-glass {
        width: 40px !important;
        height: 40px !important;
    }
    
    .icon-box-glass i,
    .icon-box-glass svg {
        font-size: 1rem !important;
        width: 18px !important;
        height: 18px !important;
    }
    
    .bs-icon,
    .bs-icon-md {
        width: 45px !important;
        height: 45px !important;
        min-width: 45px !important;
    }
}

/* --- Feature List Items Mobile --- */
@media (max-width: 767px) {
    .feature-list li,
    .check-list li,
    ul.list-unstyled li {
        padding: 0.5rem 0;
        font-size: 0.9rem;
    }
    
    .feature-list li i,
    .check-list li i {
        margin-right: 0.5rem;
        font-size: 0.9rem;
    }
}

/* --- AOS Animation Adjustments Mobile --- */
@media (max-width: 767px) {
    [data-aos] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    [data-aos][data-aos-delay] {
        transition-delay: 0s !important;
    }
}

/* --- Modal/Dropdown Mobile Fixes --- */
@media (max-width: 991px) {
    .modal-dialog {
        margin: 10px;
        max-width: calc(100% - 20px);
    }
    
    .modal-body {
        padding: 1rem;
    }
    
    .dropdown-menu.show {
        position: static !important;
        float: none !important;
        width: 100% !important;
    }
}

/* --- Form Elements Mobile Accessibility --- */
@media (max-width: 767px) {
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="date"],
    input[type="time"],
    select,
    textarea {
        font-size: 16px !important; /* Prevent iOS zoom */
        padding: 12px 14px !important;
        border-radius: 4px !important;
    }
    
    input[type="date"],
    input[type="time"] {
        min-height: 48px;
    }
    
    button[type="submit"],
    input[type="submit"] {
        min-height: 50px;
        font-size: 0.9rem !important;
    }
}

/* --- Horizontal Scroll Prevention --- */
@media (max-width: 991px) {
    html, body {
        overflow-x: hidden !important;
        width: 100% !important;
    }
    
    .container,
    .container-fluid {
        padding-left: 15px !important;
        padding-right: 15px !important;
        overflow-x: hidden !important;
    }
    
    .row {
        margin-left: -7.5px !important;
        margin-right: -7.5px !important;
    }
    
    [class*="col-"] {
        padding-left: 7.5px !important;
        padding-right: 7.5px !important;
    }
}

/* --- Safe Area for Notched Devices --- */
@supports (padding: max(0px)) {
    .navbar {
        padding-left: max(15px, env(safe-area-inset-left)) !important;
        padding-right: max(15px, env(safe-area-inset-right)) !important;
    }
    
    .floating-buttons {
        bottom: max(15px, env(safe-area-inset-bottom)) !important;
        right: max(10px, env(safe-area-inset-right)) !important;
    }
    
    footer,
    .modern-footer {
        padding-bottom: max(1.5rem, env(safe-area-inset-bottom)) !important;
    }
}