/* ============================================
   SITE-HERO.CSS (fully %‑based responsive spacing)
   ============================================ */

/* Vertical Spacing */
.ns-hero {
    width: 100%;
    min-height: 420px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    justify-content: flex-start;   /* FIXED */
    align-items: center;

    position: relative;
    z-index: 1;
}

/* Horizontal Spacing */
.ns-hero-inner { 
    max-width: 1200px;
    width: 100%;
    padding-left: 5%;
    padding-right: 5%;
    text-align: left;
}

/* ============================================
   EMPTY HERO (no text, no CTA)
   ============================================ */
.ns-hero-empty .hero-spacer {
    height: 240px;
}

/* ============================================
   FULL HERO TEXT
   ============================================ */

.hero-line1 {
    font-family: calibri;
    font-size: 33.6px;
    font-weight: 300;
    line-height: 33.6px;
    color: #333333;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.hero-line2 {
    font-family: calibri;
    font-size: 64px;
    font-weight: 700;
    line-height: 64px;
    color: #333333;
    margin-bottom: 1rem;
    text-transform: uppercase;
}

.hero-line3 {
    padding-top: 15px;      /* FIXED typo: 15x → 15px */
    padding-bottom: 20px;
    font-family: calibri;
    font-size: 32px;
    font-weight: 200;
    line-height: 32px;      /* FIXED typo: 32x → 32px */
    color: #333333;
    margin-bottom: 0.5rem;
}



/* ============================================
   MOBILE
   ============================================ */
@media (max-width: 600px) {

    .ns-hero {
        min-height: 200px;
        padding: 10px;
    }

    .ns-hero-inner {
        padding-left: 1%;
        padding-right: 1%;
    }

    .hero-line1 { 
        font-size: 30px; 
        line-height: 30px;
    }

    .hero-line2 { 
        font-size: 30px; 
        line-height: 30px;
    }

    .hero-line3 { 
        font-size: 20px; 
        line-height: 20px;
    }

    .ns-hero-empty .hero-spacer {
        height: 180px;
    }
}