.navbar {
    padding-right: 1vw;
    padding-left: 1vw;
}

.hero-section {
    background: url('/assets/images/home_page_hero_background.png') no-repeat center center;
    background-size: cover;
    height: 500px;
    width: 100%;
}

/* Service Card Styles */
.service-card {
    border: none;
    border-radius: 10px;
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.service-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}

/* === Mobile-specific styling === */
@media (max-width: 768px) {
    /* Increase general text size */
    body {
        font-size: 1.1rem;
        line-height: 1.6;
    }

    /* Hero Section */
    .hero-section h1 {
        font-size: 2rem;
    }
    .hero-section p {
        font-size: 1.1rem;
    }

    /* About Section */
    .container .lead {
        font-size: 1.05rem;
    }

    /* Cards (Services and Portfolio) */
    .card h4.card-title,
    .card h5.card-title {
        font-size: 1.2rem;
    }
    .card p {
        font-size: 1rem;
    }
    .card-body {
        font-size: 0.95rem;
    }

    /* Buttons */
    .btn {
        font-size: 1rem;
        padding: 0.75rem 1.25rem;
    }

    /* Featured Portfolio images */
    .ratio img {
        max-height: 50vh; /* Give images more room on mobile */
    }

    /* Spacing adjustments */
    .container, .container-fluid {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

/* Force single-column layout on phones up to 820px wide */
@media (max-width: 820px) {
    .service-card,
    .portfolio-item {
        flex: 0 0 100%;
        max-width: 100%;
    }
}