/* Custom styles to complement Tailwind CSS */
body > * {
    font-family: 'Montserrat' !important;
}

h1, h2, h3, h4, h5, h6 {
font-family: 'Montserrat' !important;
font-weight: 900 !important; /* bold */
}

p {
font-family: 'Montserrat' !important;
font-weight: 500 !important; /* light */
}

/* Custom styles for the timeline on about.php */
@media (min-width: 768px) {
    .timeline-item:nth-child(even) {
        flex-direction: row-reverse;
    }

    .timeline-item:nth-child(even) .order-1 {
        text-align: right;
    }
}

@media (max-width: 767px) {
    .hero-section {
        /* Custom styles for the hero section */
        padding: 20px;
        height: 592px !important;
    }
    .cta-contact-button, .cta-quote-button {
        /* Custom styles for the CTA contact button */
        font-size: 13px;
        display: flex;
        align-items: center;
        font-weight: 900 !important;
    }
    .footer-bottom {padding: 20px !important;font-size: 14px;}
    .header-title {
        text-wrap: balance;
    }

    .hero-image {
        height: 350px !important;
    }

    .hero-title {
        font-size: 2.1rem !important;
    }
}

/*
==============================================
Custom Styles for Home Page
==============================================
*/

/* Hero Section */
.hero-section {
    /* Custom styles for the hero section */
    height: 350px !important;
    position: relative;
}
.hero-content {
    /* Custom styles for the hero content */
}
.hero-title {
    /* Custom styles for the hero title */
}
.hero-tagline {
    /* Custom styles for the hero tagline */
}
.hero-cta-button {
    /* Custom styles for the hero CTA button */
}

/* Company Overview Section */
.company-overview-section {
    /* Custom styles for the company overview section */
}
.overview-container {
    /* Custom styles for the overview container */
}
.section-header {
    /* Custom styles for section headers */
}
.section-title {
    /* Custom styles for section titles */
}
.title-underline {
    /* Custom styles for the title underline */
}
.overview-text-content {
    /* Custom styles for the overview text content */
}
.overview-paragraph {
    /* Custom styles for the overview paragraph */
}

/* Core Services Section */
.core-services-section {
    /* Custom styles for the core services section */
}
.services-container {
    /* Custom styles for the services container */
}
.services-grid {
    /* Custom styles for the services grid */
}
.service-card {
    /* Custom styles for service cards */
}
.service-icon {
    /* Custom styles for service icons */
}
.service-title {
    /* Custom styles for service titles */
}
.service-description {
    /* Custom styles for service descriptions */
}

/* Compliance Badges Section */
.compliance-section {
    /* Custom styles for the compliance section */
}
.compliance-container {
    /* Custom styles for the compliance container */
}
.badges-grid {
    /* Custom styles for the badges grid */
}
.badge-item {
    /* Custom styles for badge items */
}
.badge-icon {
    /* Custom styles for badge icons */
}
.badge-title {
    /* Custom styles for badge titles */
}
.badge-description {
    /* Custom styles for badge descriptions */
}

/* CTA Banner Section */
.cta-banner-section {
    /* Custom styles for the CTA banner section */
}
.cta-container {
    /* Custom styles for the CTA container */
}
.cta-title {
    /* Custom styles for the CTA title */
}
.cta-tagline {
    /* Custom styles for the CTA tagline */
}
.cta-buttons-container {
    /* Custom styles for the CTA buttons container */
}
.cta-contact-button, .cta-quote-button {
    /* Custom styles for the CTA contact button */
}
.cta-quote-button {
    /* Custom styles for the CTA quote button */
}

/*
==============================================
Custom Styles for About Page
==============================================
*/
.about-page { }
.about-header { }
.header-container { }
.header-title { }
.header-tagline { }
.company-overview-section { }
.overview-container { }
.overview-grid { }
.overview-image-container { }
.image-placeholder { }
.overview-text-container { }
.overview-title { }
.overview-paragraph { }
.mission-values-section { }
.values-container { }
.values-grid { }
.value-card { }
.value-icon { }
.value-title { }
.value-description { }
.timeline-section { }
.timeline-container { }
.timeline-wrapper { }
.timeline-line { }
.timeline-item-container { }
.timeline-spacer { }
.timeline-dot { }
.timeline-content { }
.timeline-title { }
.timeline-description { }

/*
==============================================
Custom Styles for Services Page
==============================================
*/
.services-page { }
.services-header { }
/* .service-card is already defined in home page styles */

/*
==============================================
Custom Styles for Industries Page
==============================================
*/
.industries-page { }
.industries-header { }
.industries-container { }
.industries-grid { }
.industry-card { }
.industry-icon { }
.industry-title { }

/*
==============================================
Custom Styles for Why Choose Us Page
==============================================
*/
.why-choose-us-page { }
.why-choose-us-header { }
.key-benefits-section { }
.benefits-container { }
.benefits-grid { }
.benefit-card { }
.benefit-icon { }
.benefit-title { }
.benefit-description { }
.delivery-process-section { }
.process-container { }
.process-flow { }
.process-step { }
.step-number { }
.step-icon { }
.step-title { }
.step-description { }
.process-arrow { }

/*
==============================================
Custom Styles for Contact Page
==============================================
*/
.contact-page { }
.contact-header { }
.contact-section { }
.contact-container { }
.contact-grid { }
.contact-form-container { }
.form-title { }
#contact-form { }
.form-group { }
.form-label { }
.form-input { }
.form-textarea { }
.form-submit-button { }
.contact-info-container { }
.info-title { }
.info-text { }
.contact-details-list { }
.contact-detail-item { }
.contact-link { }
.google-map-container { }
.google-map { }

/*
==============================================
Custom Styles for Request a Quote Page
==============================================
*/
.request-a-quote-page { }
.request-a-quote-header { }
.quote-form-section { }
.form-container-wrapper { }
.form-container { }
/* .form-title is already defined */
#quote-form { }
.form-grid { }
/* .form-group is already defined */
/* .form-label is already defined */
/* .form-input is already defined */
.form-select { }
.form-submit-container { }
/* .form-submit-button is already defined */


/*
==============================================
Custom Styles for Shared Components
==============================================
*/

/* Header */
.site-header { }
.main-nav { }
.logo { }
.desktop-nav { }
.nav-link { }
.quote-button { }
.burger-menu { }
.burger-line { }
.mobile-nav { }
.mobile-nav-link { }

/* Footer */
.site-footer { }
.footer-container { }
.footer-grid { }
.footer-about-section { }
.footer-heading { }
.footer-text { }
.social-links { }
.social-link {
    display: flex;
    align-items: center;
    font-weight: 900 !important;
}
.footer-links-section { }
.quick-links-list { }
.quick-link { }
.footer-contact-section { }
.contact-info-list { }
.contact-info-item { }
.contact-info-link { }
.footer-bottom {}
.copyright-text { }


.form-input, textarea, select {
    padding: 20px !important;
    background: #cad5e1 !important;
}

/*.h-screen {
    height: 50vh;
}*/

.hero-image {
    width: 100% !important;
    height: 350px !important;
    object-fit: cover !important;
    z-index: -1 !important;
}