/*
Copyright © Wild Rose Devs. & Alberta Lynx 2025. All rights reserved.

This software and its source code are proprietary and confidential.
Unauthorized copying, distribution, modification, or use in whole or in part
is strictly prohibited and may result in civil and/or criminal penalties.

No license or rights are granted by implication or otherwise under any
intellectual property rights.

For licensing inquiries, contact: https://wildrosedevs.ca
*/

/*********************************
  HERO SECTION
**********************************/
.hero {
    background:
        linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),
        url("../images/enquiries-hero.png") no-repeat center center / cover !important;
    height: 40vh;
    position: relative;
    display: flex;
    align-items: flex-end;
    padding: 3rem;
    z-index: 1;
}

.hero-content {
    width: 100%;
    position: relative;
    max-width: 1280px;
    margin-top: 40px;
    padding-left: 60px;
    padding-right: 60px;
    text-align: left;
}

.hero-label {
    font-size: 3.2rem;
    font-weight: 900;
    color: #0c81f7;
    margin: 0 0 20px;
    margin-bottom: 0;
}

.hero-subtext {
    display: flex;
    font-size: 1.1rem;
    color: #ffffff;
    font-weight: 500;
    gap: 20px;
    margin-top: 0;
}

@media (max-width: 768px) {
    .hero {
        padding: 0;
        display: flex;
        align-items: flex-end;
    }

    .hero-content {
        width: 100%;
        padding: 1rem 1.25rem;
        margin: 0;
        position: relative;
        bottom: 0;
        text-align: left;
    }

    .hero-label {
        font-size: 2rem;
        margin-bottom: 0.25rem;
        color: #0c81f7;
    }

    .hero-subtext {
        font-size: 1rem;
        color: white;
        line-height: 1.4;
        margin: 0;
    }
}

/*********************************
  PROJECTS SECTION
**********************************/
.projects-section {
    position: relative;
    background-color: #f5f5f5;
    padding-top: 50vh;
    padding: 3rem 3rem 5rem;
    z-index: 2;
}

.project-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 3fr));
    gap: 2rem;
    max-width: 1200px;
    margin: 0 auto 3rem auto;
}

.project-card {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 12px;
    overflow: hidden;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.project-card:hover {
    transform: translateY(-6px);
}

.project-card img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
}

.hover-content {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 1.2rem;
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    transform: translateY(100%);
    transition: transform 0.3s ease;
    text-align: center;
}

.project-card:hover .hover-content {
    transform: translateY(0%);
}

.hover-content h3 {
    font-size: 1.25rem;
    margin-bottom: 0.4rem;
}

.hover-content p {
    font-size: 0.95rem;
    opacity: 0.85;
    margin: 0;
}

.see-more {
    text-align: center;
}

.see-more p {
    font-size: 1.3rem;
    color: #0071e2;
    font-weight: bold;
    margin-bottom: 0.8rem;
}

.see-more-button {
    display: inline-block;
    background-color: #0071e2;
    color: #fff;
    padding: 0.8rem 1.6rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 1rem;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

.see-more-button:hover {
    background-color: #bd1e48;
}

/* Tagline above the blue block */
.bluerose-line {
    text-align: center;
    /* center on the page */
    font-weight: 700;
    /* bold */
    margin: 2rem 0 1rem;
    /* space above & below */
    color: #333;
    /* dark grey */
}

/* --------------------------------------------------
   Next‑Steps Section — full blue‑gradient background
   -------------------------------------------------- */
.next-steps-section {
    background-color: #f5f5f5;
    text-align: center;
    object-fit: center;
}

/* Container for all text */
.ns-content {
    text-align: left;
    object-position: left;
    margin: 0 auto 2rem;
    padding: 2rem 4rem 4rem 4rem;
    background: linear-gradient(to bottom, #d0e8ff, #c0e8ff);
}

/* Tagline */
.ns-tagline {
    font-size: 2rem;
    font-weight: 700;
    padding-bottom: 1rem;
    color: #111;
    margin: 0 0 0.5rem;
}

/* Main title */
.ns-title {
    font-size: 2.8rem;
    font-weight: 800;
    color: #111;
    margin: 0 0 1rem;
}

/* Supporting copy */
.ns-copy {
    font-size: 1rem;
    line-height: 1.6;
    max-width: 680px;
    color: #111;
    margin: 0;
    padding: 0 1rem;
}

/* Main horizontal line, right‑aligned and 60% wide */
.ns-line {
    position: relative;
    display: block;
    width: 60%;
    height: 4px;
    /* line thickness */
    background-color: #111;
    /* line color */
    margin: 2rem 2rem 0 auto;
    /* 2rem top, 2rem right, auto left to push it over */
}

/* Arrowhead at the right end */
.ns-line::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(50%, -50%);
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 12px solid #111;
    /* arrowhead color */
}