/* New Horizons: requested refinements on the original Renovast foundation.
   Original theme files remain unchanged; requested adjustments are defined below. */


/* Logo palette. Match the theme's element-level variables so every component inherits the brand. */
* {
    --primary-color: #1c4d7f;
    --primary-color-rgb: 28, 77, 127;
    --secondary-color: #e49b2a;
    --secondary-color-rgb: 228, 155, 42;
    --nh-navy: #102b46;
    --body-font-color: #465665;
    --body-font-color-bg-dark: #e1ebf5;
    --heading-font-color: #1c4d7f;
    --bg-light: #f2f6fa;
    --bg-dark-1: #1c4d7f;
    --bg-dark-1-rgb: 28, 77, 127;
    --bg-dark-2: #163e66;
    --bg-dark-3: #102b46;
    --bg-grey: #eef2f6;
    --footer-background-color: #102b46;
    --btn-hover-bg: #e49b2a;
    --btn-hover-color: #102b46;
    --breadcrumb-separator-color: #e49b2a;
}

/* Larger eyebrow text throughout the shared theme components. */
.subtitle { font-size: 14px; }

/* Hero photographs crossfade independently of the stationary content. */
.nh-hero {
    min-height: 980px;
    padding: 180px 0 78px;
    display: flex;
    align-items: center;
    background: var(--bg-dark-1);
}
.nh-hero-backgrounds, .nh-hero-shade, .nh-hero-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.nh-hero-backgrounds { overflow: hidden; }
.nh-hero-slide {
    object-fit: cover;
    object-position: center;
    opacity: 0;
    transform: scale(1.02);
    transition: opacity 1.6s ease-in-out;
    animation: nh-hero-drift 18s ease-in-out infinite alternate;
}
.nh-hero-slide:nth-child(2) { animation-direction: alternate-reverse; }
.nh-hero-slide:nth-child(3) { animation-delay: -9s; }
.nh-hero-slide.is-active { opacity: 1; }
.nh-hero-shade {
    background: linear-gradient(90deg, rgba(16,43,70,.78), rgba(16,43,70,.47) 58%, rgba(16,43,70,.22)), linear-gradient(0deg, rgba(28,77,127,.9), transparent 70%);
}
.nh-hero.is-motion-paused .nh-hero-slide { animation-play-state: paused; }
.nh-hero-copy > p { max-width: 560px; }
.nh-hero-highlights {
    display: flex;
    justify-content: space-between;
    gap: 22px;
    margin-top: 48px;
    padding-top: 28px;
    border-top: 1px solid rgba(255,255,255,.22);
}
@keyframes nh-hero-drift {
    from { transform: scale(1.02); }
    to { transform: scale(1.085); }
}

/* Review callouts: solid stars, restrained warm glow. */
.nh-google-review {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-top: 32px;
    color: #fff;
}
.nh-review-stars, .nh-reputation-stars {
    display: inline-flex;
    gap: 5px;
    align-items: center;
    color: var(--secondary-color);
}
.nh-review-stars i, .nh-reputation .nh-reputation-stars i {
    color: var(--secondary-color);
    text-shadow: 0 0 12px rgba(228,155,42,.4), 0 2px 3px rgba(0,0,0,.12);
    line-height: 1.25;
}
.nh-review-stars i { font-size: 32px; }
.nh-review-copy { display: flex; flex-direction: column; line-height: 1.5; }
.nh-review-copy strong { color: #fff; font-size: 26px; font-weight: 700; }
.nh-review-copy strong > span { color: #e1ebf5; font-size: 16px; font-weight: 400; }
.nh-review-copy > span { color: #eef4fa; font-size: 12px; }
.nh-reputation .nh-reputation-stars i { font-size: 44px; }
.nh-reputation .de-rating-ext { margin-top: 12px; }

/* Shared form styling, used only by the new hero and contact components. */
.nh-lead-card {
    padding: 30px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 14px 55px rgba(16,43,70,.14);
    color: var(--body-font-color);
}
.nh-lead-card h2 { color: var(--heading-font-color); }
.nh-form-eyebrow {
    color: var(--primary-color);
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.7;
    margin-bottom: 10px;
}
.nh-lead-card .nh-form-intro {
    color: #536477;
    font-size: 13px;
    line-height: 1.7;
    margin-bottom: 21px;
}
.nh-lead-form label {
    display: block;
    margin-bottom: 6px;
    color: #263e58;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.6;
}
.nh-field-optional { font-size: 10px; font-weight: 400; color: #536477; }
.nh-lead-form .form-control {
    width: 100%;
    min-height: 46px;
    padding: 11px 12px;
    border: 1px solid #ccd7e3;
    border-radius: 7px;
    color: #263e58;
    background-color: #fff;
    font-family: var(--body-font);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.6;
}
.nh-lead-form textarea.form-control { min-height: 78px; resize: vertical; }
.nh-lead-form select.form-control {
    appearance: auto;
    padding-right: 25px;
}
.nh-lead-form .form-control:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(28,77,127,.12);
}
.nh-lead-form .btn-main {
    border: 0;
    cursor: pointer;
    min-height: 44px;
}
.nh-lead-form .nh-form-note {
    font-size: 10px;
    line-height: 1.7;
    color: #536477;
}
.nh-lead-form .nh-form-note a, .nh-lead-form .nh-form-privacy a {
    color: var(--primary-color);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.nh-lead-form .nh-form-privacy { font-size: 10px; line-height: 1.7; color: #536477; }
.nh-lead-form .nh-form-status {
    padding: 13px 15px;
    margin: 15px 0 0;
    border: 1px solid #c6d6e7;
    border-radius: 7px;
    background: #edf4fb;
    color: #263e58;
    font-size: 12px;
    line-height: 1.75;
}
.nh-lead-form .nh-form-status[hidden] { display: none; }
.nh-lead-form .nh-form-status a { color: #263e58; text-decoration: underline; }
.nh-lead-form :focus-visible, .nh-google-review:focus-visible {
    outline: 3px solid var(--primary-color);
    outline-offset: 4px;
}
.nh-contact-info address { font-style: normal; }
.nh-contact-info h3 { margin-top: 23px; }
.nh-contact-info p { margin-bottom: 19px; }
.nh-contact-form-card > p { margin-bottom: 25px; }
.nh-contact-map iframe { display: block; width: 100%; }

/* Native marquee plugin still controls movement; data-duration slows it down. */
.de-marquee-list-1 .hs-2 { position: relative; }
.de-marquee-list-1 .hs-2::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -1.5rem;
    width: 1px;
    height: .65em;
    background: rgba(255,255,255,.42);
    transform: translateY(-50%);
}

/* Faint roofline geometry over the existing theme footer color. */
footer.nh-pattern-footer {
    background-image: url('../images/footer-pattern.svg');
    background-size: 160px 128px;
    background-position: center top;
}

@media (min-width: 1400px) {
    .nh-hero { min-height: 1000px; }
    .nh-lead-card { padding: 34px; }
}
@media (max-width: 1199px) {
    .nh-hero { min-height: 960px; padding-top: 170px; }
    .nh-lead-card { padding: 25px; }
    .nh-google-review { gap: 10px; }
    .nh-review-stars i { font-size: 29px; }
}
@media (max-width: 991px) {
    .nh-hero { min-height: 0; padding: 155px 0 76px; }
    .nh-hero-copy { max-width: 780px; }
    .nh-hero-copy > p { max-width: 620px; }
    .nh-lead-card { padding: 30px; max-width: 650px; }
    .nh-hero-content > .row { row-gap: 36px !important; }
    .nh-hero-highlights { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 36px; }
    .nh-reputation .nh-reputation-stars i { font-size: 40px; }
}
@media (max-width: 767px) {
    .nh-hero { padding: 135px 0 76px; }
    .nh-hero-shade { background: linear-gradient(0deg, rgba(16,43,70,.93), rgba(16,43,70,.66) 70%, rgba(16,43,70,.38)); }
    .nh-hero-slide { object-position: 46% center; }
    .nh-hero-copy > p { font-size: 14px; line-height: 1.9; }
    .nh-google-review { margin-top: 25px; gap: 10px; }
    .nh-review-stars i { font-size: 29px; }
    .nh-review-copy strong { font-size: 24px; }
    .nh-review-copy > span { font-size: 11px; }
    .nh-lead-card { padding: 24px; }
    .nh-hero-highlights.sm-hide { display: none; }
    .nh-contact-section { padding-top: 55px; padding-bottom: 60px; }
    .nh-contact-form-card h2 { font-size: 32px; }
}
@media (max-width: 374px) {
    .nh-lead-card { padding: 20px; }
    .nh-review-stars { gap: 3px; }
    .nh-review-stars i { font-size: 26px; }
    .nh-google-review { gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
    .nh-hero-slide { animation: none; transition: none; transform: none; }
}

/* Compact heading for the new form; site headings retain theme sizing. */
.nh-lead-card h2 { font-size: 26px; line-height: 1.25; }

/* Keep the designer credit together within the theme's footer layout. */
.subfooter .de-flex > .nh-copyright { display: block; }
.subfooter .nh-design-credit { display: block; }
.subfooter .nh-credit-link {
    display: inline;
    margin: 0;
    padding: 0;
    white-space: nowrap;
    transition: color .2s ease;
}
.subfooter .nh-credit-link:hover,
.subfooter .nh-credit-link:focus-visible { color: var(--secondary-color); }

/* Consolidated service cards and material section anchors. */
.nh-service-category > img { min-height: 400px; object-fit: cover; }
.nh-service-material { scroll-margin-top: 110px; }


/* Keep the same-property project comparison compact at every screen size. */
.nh-project-comparison img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.nh-project-comparison img:first-of-type { object-position: 50% 58%; }
.nh-project-comparison img:last-of-type { object-position: 50% 50%; }

/* Preserve photo proportions when theme width utilities resize inline images. */
.nh-owner-photo:not(.nh-hero-slide):not(.jarallax-img) { height: auto; }


/* Fit the supplied logo while preserving the theme's header and menu behavior. */
header #logo > a { display: block; padding: 12px; line-height: 0; }
header #logo img { width: 190px; max-width: 100%; height: auto; vertical-align: middle; }
footer .logo-footer { display: block; width: 240px; max-width: 100%; height: auto; }
@media (max-width: 992px) {
    header #logo > a { padding: 8px; }
    header.header-mobile .header-col-mid #mainmenu { top: 118px; }
    header #logo img { width: 160px; }
}


/* Brand colors for component states that the original theme sets separately. */
a.btn-main, a.btn-main:link, a.btn-main:visited,
a.btn-main:active, a.btn-main:focus,
a.btn-main:hover, a.btn-main:focus-visible,
.btn-main, .btn-main:hover, .btn-main:focus-visible {
    background: var(--secondary-color);
    color: var(--nh-navy);
}
header .menu_side_area a.btn-main { background: var(--secondary-color); color: var(--nh-navy); }
header .menu_side_area a.btn-main:hover,
header .menu_side_area a.btn-main:focus-visible { background: var(--secondary-color); color: var(--nh-navy); }
#mainmenu li li a:hover, #mainmenu ul li:hover > a,
#mainmenu li li a:focus-visible { background: var(--secondary-color); color: var(--nh-navy); }
header.header-mobile #mainmenu li a.menu-item:hover { color: var(--primary-color); }
.accordion-section-title.active, .accordion-section-title.active::before { color: var(--nh-navy); }
.de-rating-ext i { color: var(--secondary-color); }
footer a:hover, footer a:focus-visible { color: var(--secondary-color); }
.nh-lead-card { border-top: 3px solid var(--secondary-color); }
.nh-google-review:focus-visible { outline-color: var(--secondary-color); }
::selection { background: var(--secondary-color); color: var(--nh-navy); }
::-moz-selection { background: var(--secondary-color); color: var(--nh-navy); }
.bg-color-op-1 { background: rgba(var(--primary-color-rgb), .04) !important; }
.bg-color-op-2 { background: rgba(var(--primary-color-rgb), .08) !important; }
.bg-color-op-3 { background: rgba(var(--primary-color-rgb), .12) !important; }

/* Reuse the original check artwork as a mask, giving it the exact brand gold. */
.nh-feature-check > img { opacity: 0; }
.nh-feature-check::after {
    content: '';
    position: absolute;
    inset: 1.5rem;
    background: var(--secondary-color);
    -webkit-mask: url('../images/icons-color/check.png') center / contain no-repeat;
    mask: url('../images/icons-color/check.png') center / contain no-repeat;
}


/* Footer review: larger stars with the rating on its own line. */
footer .nh-footer-review { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
footer .nh-footer-review .d-stars { display: inline-flex; gap: 6px; }
footer .nh-footer-review .d-stars i { font-size: 30px; letter-spacing: 0; line-height: 1.2; }
footer .nh-footer-rating { display: inline-flex; align-items: center; gap: 10px; line-height: 1.5; }
footer .nh-footer-google-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    margin: 0;
    border: 0;
    border-radius: 0;
    color: #fff;
    text-decoration: none;
    transition: color .2s ease;
}
footer .nh-footer-google-link i { color: inherit; font-size: 20px; line-height: 1; }
footer .nh-footer-google-link:hover { color: var(--secondary-color); }
footer .nh-footer-google-link:focus-visible { color: var(--secondary-color); outline: 2px solid var(--secondary-color); outline-offset: 3px; }

/* Keep the longer hero headline within the smallest phone screens. */
@media (max-width: 374px) {
    .nh-hero h1 { font-size: clamp(32px, 12vw, 44px); }
}


/* Gold controls with readable navy labels, including the page-top arrow and FAQ tabs. */
#back-to-top { background: var(--secondary-color); --btn-color: var(--nh-navy); }
.de-tab .d-tab-nav .active-tab { background: var(--secondary-color); color: var(--nh-navy); }
a.btn-main:focus-visible, button.btn-main:focus-visible {
    outline: 3px solid var(--nh-navy);
    outline-offset: 3px;
    box-shadow: inset 0 0 0 2px var(--nh-navy);
}

/* Service selector buttons share the same gold treatment. */
a.nh-service-button, a.nh-service-button:visited,
a.nh-service-button:hover, a.nh-service-button:active, a.nh-service-button:focus {
    background: var(--secondary-color);
    color: var(--nh-navy);
}
a.nh-service-button[aria-current="page"] { box-shadow: inset 0 0 0 2px var(--nh-navy); }
a.nh-service-button:focus-visible { outline: 3px solid var(--nh-navy); outline-offset: 3px; }


/* Interior title bars: give the title breathing room and keep project photos clear. */
.nh-page-title {
    min-height: 430px;
    padding: 144px 0 100px;
    background: #fff;
    isolation: isolate;
}
.nh-page-title .nh-page-title-photo {
    position: absolute;
    top: 68px;
    right: 0;
    bottom: 0;
    width: 66%;
    max-width: 1152px;
    z-index: 0;
}
.nh-page-title::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg, #fff 0%, #fff 33%, rgba(255,255,255,.98) 39%, rgba(255,255,255,.72) 47%, rgba(255,255,255,.12) 60%, rgba(255,255,255,0) 71%);
}
.nh-page-title > .container { position: relative; z-index: 2; }
.nh-page-title h1 { max-width: 64%; }

@media (max-width: 991px) {
    .nh-page-title { min-height: 480px; padding: 100px 0 300px; }
    .nh-page-title .nh-page-title-photo { top: auto; width: 100%; height: 280px; }
    .nh-page-title::after {
        background: linear-gradient(180deg, #fff 0%, #fff calc(100% - 285px), rgba(255,255,255,0) calc(100% - 245px));
    }
    .nh-page-title h1 { max-width: none; }
}
@media (max-width: 575px) {
    .nh-page-title { min-height: 440px; padding: 88px 0 290px; }
    .nh-page-title .nh-page-title-photo { height: 265px; }
    .nh-page-title::after {
        background: linear-gradient(180deg, #fff 0%, #fff calc(100% - 270px), rgba(255,255,255,0) calc(100% - 235px));
    }
}
