/* =====================================================
   JERU – GREEN + OCHRE SUBSITE THEME
   Based on OTI / UK Hypersonics structure
===================================================== */

:root {

    /* ===== PRIMARY GREEN ===== */
    --color-primary: #426A5A;
    --color-primary-dark: #2F4F43;
    --color-primary-light: #5A8574;

    /* ===== ACCENT (replaces orange) ===== */
    --color-accent: #C88A2E;
    --color-accent-dark: #A96F1F;
    --color-accent-light: #E7C693;

    /* ===== TEXT ===== */
    --color-text-primary: #111515;
    --color-text-secondary: #ffffff;
}


/* =====================================================
   HEADINGS / TITLES
===================================================== */

.h1, .usercontent h1, .mce-content-body h1,
.h2, .usercontent h2, .mce-content-body h2,
.h3, .usercontent h3, .mce-content-body h3,
.tabblocks-title, .casestudyslider-title,
.imageblock-title, .videoblock-title,
.imagegallery-title, .imagetextblock-title,
.linkblocks-title, .resourcesblock-title,
.projectshowcase-title, .faqmodule-title,
.whitebanner-title, .post-title,
.studyitem-title {
    color: var(--color-primary);
}

.h4, .usercontent h4, .mce-content-body h4,
.teamlink-title,
.whitebanner-subtitle {
    color: var(--color-primary-dark);
}


/* =====================================================
   LINKS
===================================================== */

.a, .usercontent a, .mce-content-body a {
    color: var(--color-primary);
}

.a:hover, .usercontent a:hover,
.mce-content-body a:hover {
    color: var(--color-accent);
}


/* =====================================================
   NAVIGATION
===================================================== */

@media (min-width: 992px) {
    .nav ul > li.menu-item a::before {
        background-color: var(--color-accent);
    }
}


/* =====================================================
   BLOCKQUOTE
===================================================== */

.usercontent blockquote,
.mce-content-body blockquote {
    color: var(--color-primary-dark);
}

.usercontent blockquote::before,
.mce-content-body blockquote::before {
    background-color: var(--color-primary);
}


/* =====================================================
   ACCORDION
===================================================== */

.accordion-head::after {
    color: var(--color-primary);
}

.accordion-head:hover::after {
    color: var(--color-accent);
}

.accordion-head:hover,
.accordion-head:focus {
    border-color: var(--color-accent);
}

.accordion.__active .accordion-head {
    color: var(--color-primary);
    border-bottom-color: var(--color-primary);
}


/* =====================================================
   HIGHLIGHT STRIPS / UNDERLINES
===================================================== */

.teamlink-title::before,
.linkblock-date::before,
.linkblock-imgwrap::before,
.post-date::before {
    background-color: var(--color-accent-light);
}

.studyitem-title::before {
    background-color: var(--color-accent-light);
}


/* =====================================================
   BUTTONS (including animation layer)
===================================================== */

.button,
.submit_wrap button,
.form-submit button,
.sliderbutton,
.shareblock-trigger {
    background: var(--color-accent);
    color: var(--color-text-primary);
}

.button:hover,
.submit_wrap button:hover,
.form-submit button:hover,
.sliderbutton:hover,
.shareblock-trigger:hover {
    background: var(--color-accent-light);
    color: var(--color-text-secondary);
}

.button-hover {
    background-color: var(--color-accent-dark);
}


/* Ghost buttons */
.button.__ghost,
.submit_wrap button.__ghost,
.form-submit button.__ghost,
.sliderbutton.__ghost {
    color: var(--color-accent);
    border-color: var(--color-accent);
}

.button.__ghost:hover {
    background-color: var(--color-accent);
}


/* =====================================================
   PAGINATION
===================================================== */

.paging li.active a,
.paging li.paging-next a,
.paging li.paging-prev a {
    background: var(--color-primary-dark);
    color: #fff;
}

.paging li a {
    color: var(--color-primary-dark);
}

.paging li a:hover {
    border-color: var(--color-primary-dark);
}


/* =====================================================
   FOOTER
===================================================== */

.footer {
    background-color: var(--color-primary-dark);
}

.footer-aux ul li a::after {
    background-color: var(--color-accent);
}


/* =====================================================
   FORMS
===================================================== */

input:focus,
textarea:focus,
select:focus {
    border-color: var(--color-primary-dark);
}

.umbraco-forms-form .umbraco-forms-navigation input[type="submit"] {
    background-color: var(--color-primary-dark);
    border-color: var(--color-primary-dark);
    color: var(--color-text-secondary);
}

.umbraco-forms-form .umbraco-forms-navigation input[type="submit"]:hover {
    background-color: var(--color-accent);
}