/* EK Construction: Universal Heading Styles (Modular) */

/* Imports for fonts */
/* @import url("https://fonts.googleapis.com/css?family=Barlow:700,400&display=swap"); */
/* @import url("https://fonts.googleapis.com/css?family=Lato:700,400&display=swap"); */
/* @import url("https://fonts.googleapis.com/css?family=Playfair+Display:700,400&display=swap"); */

/* Headings (h1, h2, h3) */
h1,
h2,
h3,
h4 {
    font-family: "Barlow", "Lato", "Playfair Display", Arial, sans-serif;
    color: #31445b;
    letter-spacing: 1px;
    font-weight: 700;
    margin-bottom: 0.45em;
}

/* Responsive font sizes for headings */
h1 {
    font-size: 3.1rem;
    line-height: 1.14;
}

h2 {
    font-size: 2.1rem;
    line-height: 1.18;
}

h3 {
    font-size: 1.55rem;
    line-height: 1.23;
}

h4 {
    font-size: 1.25rem;
    line-height: 1.33;
}

@media (max-width: 1024px) {
    h1 {
        font-size: 2.3rem;
    }

    h2 {
        font-size: 1.52rem;
    }

    h3 {
        font-size: 1.16rem;
    }
}

@media (max-width: 767px) {
    h1 {
        font-size: 1.7rem;
    }

    h2 {
        font-size: 1.13rem;
    }

    h3 {
        font-size: 1.05rem;
    }
}

/* Section Headings Class (optional usage) */
.section-title {
    color: #31445b;
    font-family: "Barlow", "Lato", "Playfair Display", Arial, sans-serif;
    font-weight: 700;
    letter-spacing: 1px;
    text-align: center;
    margin-bottom: 0.45em;
}

/* responsive titles on home page. */
/* 1024 to 768 and lower shrink logo text and main h2 */
/* 767 and lower shrink logo text and main h2 */

/* Tablet and down (<= 1024px) */
@media (max-width: 1024px) {
    /* Big hero heading */
    .hero-title {
        font-size: 38px !important;
        line-height: 1.1 !important;
        letter-spacing: 0 !important;
    }

    /* "Free Consultation" button (wrap the block with class="hero-cta") */
    .hero-cta .wp-block-button__link,
    .hero-cta .wp-element-button,
    .hero-cta a {
        font-size: 14px !important;
        padding: 14px 24px !important;
    }

    /* Header site title */
    .site-title {
        font-size: 30px !important;
        line-height: 1.15 !important;
    }
}

/* Phones (<= 667px) */
@media (max-width: 667px) {
    .hero-title {
        font-size: 20px !important;
        line-height: 1.1 !important;
    }

    .hero-cta .wp-block-button__link,
    .hero-cta .wp-element-button,
    .hero-cta a {
        font-size: 10px !important;
        padding: 10px 16px !important;
    }

    .site-title {
        font-size: 14px !important;
        line-height: 1 !important;
    }
}

@media (max-width: 600px) {
    /* remove the container cap on the hero area */
    .hero-wrap .wp-block-cover__inner-container,
    .hero-wrap .kt-inside-inner-col {
        max-width: none !important;
        width: 100% !important;
        padding-left: 4vw; /* optional breathing room */
        padding-right: 4vw;
    }

    /* make the paragraph use most of the viewport */
    .hero-lede {
        max-width: none !important;
        width: 92vw !important;
        margin-left: auto !important;
        margin-right: auto !important;
        line-height: 1.3; /* readability tweak */
    }

    .hero-bar {
        font-size: 0.8em !important;
    }
    /* Remove underline from homepage hero section links */
}

.home .hero-bar a {
    text-decoration: none !important;
}

/* Mobile tweaks: below 782px */
/* @media (max-width: 782px) { */
/*   .site-title { */
/*     font-size: 0.8rem!important;   [> adjust as needed <] */
/*     line-height: 1.4;    [> optional: tighten a bit <] */
/*   } */
/* } */