/* SCALING FIXES FOR 150% ON 1200px WIDTH - OPTIMIZED */
/* This CSS makes everything scale appropriately at 150% zoom */

/* Base scaling adjustments - Slightly reduced */
body {
    font-size: 1.25rem !important; /* Reduced from 1.5rem to 1.25rem */
}

/* Container scaling - Increased max-width */
.container {
    max-width: 2000px !important; /* Increased from 1800px to 2000px */
    padding-left: 3rem !important; /* Increased padding */
    padding-right: 3rem !important;
}

/* Font scaling - Reduced multipliers */
h1 {
    font-size: 5.5rem !important; /* Reduced from 7.5rem */
    line-height: 1.1 !important;
}

h2 {
    font-size: 3.25rem !important; /* Reduced from 4.5rem */
}

h3 {
    font-size: 1.875rem !important; /* Reduced from 2.25rem */
}

/* Text size scaling - Reduced */
.text-5xl {
    font-size: 3.5rem !important;
}

/* Reduced from 4.5rem */
.text-4xl {
    font-size: 2.75rem !important;
}

/* Reduced from 3.75rem */
.text-3xl {
    font-size: 2.25rem !important;
}

/* Reduced from 3rem */
.text-2xl {
    font-size: 1.75rem !important;
}

/* Reduced from 2.25rem */
.text-xl {
    font-size: 1.5rem !important;
}

/* Reduced from 1.875rem */
.text-lg {
    font-size: 1.25rem !important;
}

/* Reduced from 1.5rem */
.text-base {
    font-size: 1.25rem !important;
}

/* Reduced from 1.5rem */
.text-sm {
    font-size: 1rem !important;
}

/* Reduced from 1.125rem */
.text-xs {
    font-size: 0.875rem !important;
}

/* Reduced from 0.9375rem */

/* Spacing scaling - Increased */
.p-8 {
    padding: 3.5rem !important;
}

/* Increased from 3rem */
.p-6 {
    padding: 2.5rem !important;
}

/* Increased from 2.25rem */
.p-4 {
    padding: 1.75rem !important;
}

/* Increased from 1.5rem */
.p-3 {
    padding: 1.25rem !important;
}

/* Increased from 1.125rem */
.p-2 {
    padding: 0.875rem !important;
}

/* Increased from 0.75rem */

.py-16 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
}

/* Increased */
.py-12 {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
}

/* Increased */
.py-8 {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
}

/* Increased */
.py-6 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
}

/* Increased */
.py-4 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
}

/* Increased */
.py-3 {
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
}

/* Increased */
.py-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

/* Increased */

.px-8 {
    padding-left: 3.5rem !important;
    padding-right: 3.5rem !important;
}

/* Increased */
.px-6 {
    padding-left: 2.5rem !important;
    padding-right: 2.5rem !important;
}

/* Increased */
.px-4 {
    padding-left: 1.75rem !important;
    padding-right: 1.75rem !important;
}

/* Increased */
.px-3 {
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
}

/* Increased */
.px-2 {
    padding-left: 0.875rem !important;
    padding-right: 0.875rem !important;
}

/* Increased */

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

/* Increased */
.mb-10 {
    margin-bottom: 1.5rem !important;
}

/* Increased */
.mb-8 {
    margin-bottom: 1.25rem !important;
}

/* Increased */
.mb-6 {
    margin-bottom: 1rem !important;
}

/* Increased */
.mb-4 {
    margin-bottom: 0.666rem !important;
}

/* Increased */
.mb-3 {
    margin-bottom: 0.5rem !important;
}

/* Increased */
.mb-2 {
    margin-bottom: 0.333rem !important;
}

/* Increased */

/* Gap scaling - Increased */
.gap-8 {
    gap: 3.5rem !important;
}

/* Increased */
.gap-6 {
    gap: 2.5rem !important;
}

/* Increased */
.gap-4 {
    gap: 1.75rem !important;
}

/* Increased */
.gap-3 {
    gap: 1.25rem !important;
}

/* Increased */
.gap-2 {
    gap: 0.875rem !important;
}

/* Increased */

.space-y-6 > * + * {
    margin-top: 1.75rem !important;
}

/* Increased */
.space-y-4 > * + * {
    margin-top: 1.25rem !important;
}

/* Increased */
.space-y-3 > * + * {
    margin-top: 0.875rem !important;
}

/* Increased */
.space-y-2 > * + * {
    margin-top: 0.583rem !important;
}

/* Increased */

/* Button and element size scaling */
.logo-image-picture {
    height: 5rem !important; /* Slightly increased */
    width: auto !important;
}

.menu-toggle-btn {
    width: 55px !important; /* Reduced from 66px */
    height: 55px !important;
}

.menu-toggle-btn i {
    font-size: 1.5rem !important; /* Reduced from 1.875rem */
}

/* Hero section scaling */
.h-\[88\.5vh\] {
    height: 85vh !important; /* Reduced height slightly */
}

/* Card scaling - Reduced */
.h-64 {
    height: 320px !important; /* Reduced from 384px */
}

/* Map container scaling - Reduced */
.h-96 {
    height: 480px !important; /* Reduced from 576px */
}

/* Icon scaling in info boxes - Reduced */
.w-12 {
    width: 60px !important; /* Reduced from 72px */
    height: 60px !important;
}

.w-12 i {
    font-size: 1.5rem !important; /* Reduced from 1.875rem */
}

/* Footer logo scaling - Reduced */
.w-14 {
    width: 70px !important; /* Reduced from 84px */
    height: 70px !important;
}

.w-10 {
    width: 50px !important; /* Reduced from 60px */
    height: 50px !important;
}

/* SPECIAL FIX: TRUSTED INDUSTRY LEADER GRID */
/* Make stats grid more compact and better spaced */
#stats .grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 2rem !important; /* Increased gap */
    margin-top: 3rem !important;
}

#stats .text-center {
    padding: 0 1rem !important;
}

#stats .card-hover {
    padding: 2rem 1.5rem !important; /* Reduced padding */
    min-height: 180px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
}

#stats .text-5xl {
    font-size: 2.75rem !important; /* Much smaller for stats */
    line-height: 1 !important;
    margin-bottom: 0.5rem !important;
}

#stats .text-blue-200 {
    font-size: 1rem !important; /* Smaller text */
    line-height: 1.3 !important;
}

#stats .h-1 {
    margin-top: 1rem !important;
    width: 60px !important; /* Reduced width */
    height: 2px !important;
}

#stats h2 {
    font-size: 2.5rem !important; /* Smaller heading */
    margin-bottom: 1rem !important;
}

#stats p {
    font-size: 1.125rem !important;
    max-width: 900px !important; /* Wider paragraph */
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Process Segments improvements */
.process-card {
    min-height: 500px !important; /* Ensure consistent height */
}

.process-card .p-8 {
    padding: 2rem !important; /* Reduced padding */
}

.process-card h3 {
    font-size: 1.5rem !important; /* Smaller headings */
    margin-bottom: 0.75rem !important;
}

.process-card p {
    font-size: 1.125rem !important; /* Slightly smaller */
    line-height: 1.5 !important;
}

/* Border radius scaling */
.rounded-lg {
    border-radius: 0.625rem !important; /* Slightly reduced */
}

.rounded-xl {
    border-radius: 0.9375rem !important; /* Slightly reduced */
}

.rounded-full {
    border-radius: 9999px !important;
}

/* Line height adjustments */
.leading-tight {
    line-height: 1.1 !important;
}

.leading-relaxed {
    line-height: 1.6 !important; /* Reduced from 1.8 */
}

/* Grid column adjustments for better fit */
.grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 2rem !important; /* Increased gap */
}

.md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(300px, 1fr)) !important; /* Minimum width */
    gap: 2rem !important; /* Increased gap */
}

.md\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 0.5rem !important; /* Increased gap */
}

.lg\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 3rem !important; /* Increased gap */
}

.lg\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 2rem !important; /* Increased gap */
}

/* Make sure content doesn't overflow */
.max-w-3xl {
    max-width: 60rem !important; /* Reduced from 72rem */
}

.max-w-2xl {
    max-width: 50rem !important; /* Reduced from 60rem */
}

.max-w-lg {
    max-width: 40rem !important; /* Reduced from 45rem */
}

/* Hero section improvements */
.hero-content h1 {
    font-size: 4rem !important; /* Much smaller hero text */
    line-height: 1.1 !important;
}

.hero-content h1 span.block {
    font-size: 3.5rem !important; /* Slightly smaller */
}

.hero-content p {
    font-size: 1.25rem !important; /* Reduced */
    line-height: 1.6 !important;
    max-width: 800px !important;
}

.hero-buttons a {
    padding: 1rem 2rem !important; /* Reduced button padding */
    font-size: 1.125rem !important;
}

/* Fix for small screens at 150% */
@media (max-width: 900px) {
    .container {
        max-width: 100% !important;
        padding-left: 2rem !important; /* Increased */
        padding-right: 2rem !important;
    }

    h1 {
        font-size: 3.25rem !important;
    }

    h2 {
        font-size: 2.25rem !important;
    }

    /* Stack stats grid on medium screens */
    #stats .grid,
    .md\:grid-cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 1.5rem !important;
    }

    /* Stack process cards */
    .md\:grid-cols-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 1.5rem !important;
    }

    /* Stack footer columns */
    .lg\:grid-cols-5 {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 1.5rem !important;
    }

    .md\:flex-row {
        flex-direction: column !important;
        gap: 1.25rem !important;
    }

    /* Reduce hero height on mobile */
    .h-\[88\.5vh\] {
        height: 70vh !important;
        min-height: 500px !important;
    }

    .hero-content h1 {
        font-size: 2.75rem !important;
    }

    .hero-content h1 span.block {
        font-size: 2.5rem !important;
    }
}

@media (max-width: 600px) {
    .container {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }

    h1 {
        font-size: 2.5rem !important;
    }

    h2 {
        font-size: 1.75rem !important;
    }

    /* Single column for small screens */
    #stats .grid,
    .md\:grid-cols-4,
    .md\:grid-cols-3,
    .grid-cols-2,
    .lg\:grid-cols-5 {
        grid-template-columns: 1fr !important;
        gap: 1.25rem !important;
    }

    .flex-wrap {
        flex-wrap: wrap !important;
    }

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

    /* Even smaller stats on mobile */
    #stats .text-5xl {
        font-size: 2.25rem !important;
    }

    #stats .card-hover {
        padding: 1.5rem !important;
        min-height: 150px !important;
    }

    /* Smaller hero on mobile */
    .hero-content h1 {
        font-size: 2rem !important;
    }

    .hero-content h1 span.block {
        font-size: 1.75rem !important;
    }
}

/* Ensure all interactive elements are properly sized */
a, button, input, select {
    font-size: 1rem !important; /* Normal size */
}

/* Fix for font awesome icons */
.fas, .fab {
    font-size: 1em !important; /* Normal size */
}

/* Make sure shadows and borders are visible at scale */
.shadow-lg {
    box-shadow: 0 15px 20px -5px rgba(0, 0, 0, 0.15), 0 8px 8px -5px rgba(0, 0, 0, 0.08) !important;
}

.shadow-md {
    box-shadow: 0 6px 10px -3px rgba(0, 0, 0, 0.15), 0 3px 5px -2px rgba(0, 0, 0, 0.08) !important;
}

.border-2 {
    border-width: 2px !important; /* Normal 2px */
}

.border {
    border-width: 1px !important; /* Normal 1px */
}

/* Scale line decorations */
.h-1 {
    height: 1px !important; /* Normal 1px */
}

.w-16 {
    width: 80px !important; /* Increased from 64px */
}

/* Scale the scroll indicator */
.text-2xl {
    font-size: 1.75rem !important; /* Reduced */
}

/* Make sure the mobile menu has enough space */
.mobile-menu {
    max-height: 600px !important; /* Reduced from 750px */
}

/* Ensure proper word breaking for long text */
.break-words {
    word-break: break-word !important;
    overflow-wrap: break-word !important;
}

/* Navigation improvements */
.nav-links {
    gap: 1.5rem !important; /* Increased gap */
}

.nav-links a {
    font-size: 1rem !important; /* Normal size */
    padding: 0.5rem 0.75rem !important; /* Reduced padding */
}

/* Footer improvements */
footer .container {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
}

footer .grid {
    gap: 2.5rem !important; /* Increased gap */
}

footer h4 {
    font-size: 1.25rem !important;
    margin-bottom: 1.25rem !important;
}

footer ul.space-y-3 {
    gap: 0.75rem !important; /* Increased gap between links */
}

/* Map section improvements */
#contact .grid {
    gap: 3rem !important; /* Increased gap */
}

#contact p.text-lg {
    font-size: 1.125rem !important; /* Slightly smaller */
    line-height: 1.6 !important;
}

@media (max-width: 1024px) {
    .logo-image-text-name {
        font-size: 1rem !important;
    }

    .menu-general-enquiries {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }
}

@media (max-width: 1280px) {
    .text-2xl {
        font-size: 1.3rem !important;
    }
}

@media (min-width: 1280px) and (min-height: 640px) {
    .banner-scroll-indicator {
        display: none !important;
    }
}
