/**
 * customizer.css — Site-wide Overrides & Custom Styles
 * TradeUp BC Theme
 *
 * Previously stored in WordPress Customizer > Additional CSS.
 * Moved here to keep all CSS in version-controlled files.
 *
 * Contents:
 *  0.  Layout — Container Width Override
 *  1.  Global / Body
 *  2.  Header Layout
 *  3.  Navigation
 *  4.  Forms (Contact Form 7 + Gravity Forms)
 *  5.  Footer
 *  6.  Homepage Sections
 *  7.  Banner / Slider (Mobile)
 *  8.  Success Stories
 *  9.  Blog / News / Media Pages
 *  10. Single Blog Post
 *  11. Single Success Story
 *  12. How It Works
 *  13. Funding & Support
 *  14. Media Assets Page
 *  15. Signup Page
 *  16. Course Offerings & Filters
 *  17. Admin Bar Overrides
 *  18. Responsive Adjustments
 */

/* =============================================================================
   0. Layout — Container Width Override
   Overrides Bootstrap's default .container max-width to the site's content area.
   ============================================================================= */

@media (min-width: 1200px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        max-width: 1362px;
    }
}


/* =============================================================================
   1. GLOBAL / BODY
   ============================================================================= */

/* Slider arrow icon buttons — suppress Slick's default ::before glyph and
   show the RemixIcon <i> chevron instead */
.banner_wrap .banner_inner .slick-prev::before,
.banner_wrap .banner_inner .slick-next::before,
.banner_wrap .nt-banner-inner .slick-prev::before,
.banner_wrap .nt-banner-inner .slick-next::before {
    content: none;
}

.banner_wrap .slick-prev i,
.banner_wrap .slick-next i {
    font-size: 28px;
    line-height: 1;
    color: #ffffff;
    display: block;
}

body {
    overflow-x: hidden;
}

/* Underline all inline paragraph links */
p a {
    text-decoration: underline;
}

.screen-reader-response {
    display: none;
}

/* CF7 Turnstile captcha alignment */
.cf-turnstile iframe {
    float: left;
}


/* =============================================================================
   2. HEADER LAYOUT
   ============================================================================= */

/* Outer header — exact padding creates the 44 + 79 + 37 = 160px white area */
header {
    padding-top: 44px;
    padding-bottom: 37px;
}

/* Container becomes a flex row: logo pinned left, search-group pinned right */
header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Logo — 535 × 79 px as specified */
header .logo {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    max-width: 535px;
    height: 79px;
    width: auto;
}

header .logo img {
    max-width: 535px;
    height: 79px;
    width: auto;
    object-fit: contain;
    object-position: left center;
}

/* Social icons — not part of the new header design */
header .header_social {
    display: none !important;
}

/* Wrap-search: right-side flex group */
.wrap-search {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
}

/* header_search: links row + search icon */
header .header_search {
    display: flex;
    align-items: center;
    width: auto;
    float: none;
    text-align: left;
    position: static;
}

/* FAQ / NEWS & MEDIA / CONTACT US links */
header .header_search .connect_btn {
    font: normal normal 600 18px/22px "Barlow Semi Condensed", sans-serif;
    letter-spacing: 0;
    color: #962D00;
    text-transform: uppercase;
    margin: 0;
    float: none;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    white-space: nowrap;
}

header .header_search .connect_btn:hover {
    color: var(--green1);
    text-decoration: none;
}

/* Pipe dividers between links — green matching the navbar bar */
span.dividor {
    font: normal normal 600 18px/22px "Barlow Semi Condensed", sans-serif;
    color: #004b37;
    margin: 0 12px;
    position: static;
    top: unset;
    font-weight: bold;
}

/* 46 px gap between the last link and the search icon */
header .header_search .dropdown {
    display: inline-flex;
    align-items: center;
    margin-left: 46px;
}

/* Search icon button */
header .header_search button {
    margin-left: 0;
    top: 0;
    position: static;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
}

header .header_search button .fa-search {
    font: normal normal normal 20px/25px "Font Awesome\ 5 Free", "FontAwesome";
    font-weight: 900; /* forces solid (thick) weight in FA5; FA4 ignores this */
    letter-spacing: 0;
    color: #962D00;
    display: block;
}

/* Remove legacy margin-top on the navbar */
nav.navbar.navbar-expand-lg.navbar_main {
    width: 100%;
    margin-top: 0;
}


/* =============================================================================
   3. NAVIGATION
   ============================================================================= */

/* Main menu nav-link: 20px Barlow Semi Condensed Bold, 13px padding top/bottom
   → total link height = 13 + 20 + 13 = 46 px (fits within 50 px max-height) */
.navbar_main .navbar-nav .nav-link {
    font: normal normal 600 20px/20px "Barlow Semi Condensed", sans-serif;
    letter-spacing: 0;
    color: #FFFFFF;
    text-transform: uppercase;
    padding-top: 13px;
    padding-bottom: 13px;
}

.navbar_main .navbar-nav .dropdown-item.active {
    background-color: var(--white);
    color: var(--green1);
    filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.21));
}

.navbar_main .navbar-nav .dropdown.active .cou {
    background-color: var(--white);
    color: var(--green1);
}

.navbar_main .navbar-nav .dropdown.active .cou {
    filter: none !important;
}

.navbar_main .dropdown-menu .dropdown-item {
    padding: 8px 7px;
    padding-top: 6px;
    font-size: 17px;
}

.btn_primary::before {
    z-index: 1;
}

.btn_primary span {
    z-index: 2;
}

.dp_right a.btn_primary::before {
    z-index: -1;
}

.blog-btn-return {
    z-index: 1;
}

.blog-btn-return:hover {
    color: #fff;
}

.blog-btn-return:hover::before {
    z-index: -1;
}

.agile-span {
    text-decoration: none !important;
    color: var(--black1) !important;
}


/* =============================================================================
   4. FORMS — CONTACT FORM 7 & GRAVITY FORMS
   ============================================================================= */

/* ---- CF7 submit button ---- */
.f_widget form .wpcf7-submit {
    position: relative;
    font-family: "Barlow Semi Condensed";
    font-size: 18px;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 20px;
    background-color: #E8C650;
    color: var(--green1);
    border: none;
    padding: 13px 38px;
    padding-top: 12px;
    transition: all 250ms ease-in-out;
    margin: 0;
    display: inline-block;
    width: auto;
}

.f_widget form .wpcf7-submit span {
    position: relative;
    display: block;
}

.f_widget form .wpcf7-submit::before {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    height: 100%;
    width: 0;
    background: var(--green3);
    transition: 0.5s;
}

.f_widget form .wpcf7-submit:hover {
    color: var(--white);
}

.f_widget form .wpcf7-submit:hover::before {
    width: 100%;
    left: 0;
}

/* CF7 submit button variant (class-based) */
input.wpcf7-form-control.wpcf7-submit.has-spinner.btn_primary {
    background: #E8C650;
    color: #004b37;
}

input.wpcf7-form-control.wpcf7-submit.has-spinner:hover {
    background: #32a07d !important;
    color: #fff !important;
    transition: 0.5s !important;
}

/* ---- Gravity Forms submit buttons ---- */
#gform_submit_button_4 {
    position: relative;
    font-family: "Barlow Semi Condensed";
    font-size: 18px;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 20px;
    background-color: #E8C650;
    color: var(--green1);
    border: none;
    border-radius: 0;
    padding: 13px 38px;
    padding-top: 12px;
    transition: all 250ms ease-in-out;
    margin: 0;
    display: inline-block;
    width: auto;
}

#gform_submit_button_4:hover {
    background: #32a07d !important;
    color: #fff !important;
    transition: 0.5s !important;
}

#gform_submit_button_1 {
    position: relative;
    font-family: "Barlow Semi Condensed";
    font-size: 18px;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 20px;
    background-color: #E8C650;
    color: var(--green1);
    border: none;
    padding: 13px 38px;
    padding-top: 12px;
    transition: all 250ms ease-in-out;
    margin: 0;
    display: inline-block;
    width: auto;
}

input#gform_submit_button_1:hover {
    background: #32a07d !important;
    color: #fff !important;
    transition: 0.5s !important;
}

/* Gravity Forms field layout in footer newsletter (GF form #4) */
div#gform_fields_4 {
    display: flex;
    flex-flow: column;
    gap: 16px;
}

#gform_fields_4 label {
    display: none;
}

#gform_fields_4 input {
    background: rgba(0, 0, 0, 0.30);
    color: #fff;
}

div#gfield_description_4_5 {
    text-align: left;
    color: #fff;
    display: none;
}

.gform-footer.gform_footer.top_label {
    float: right;
}

.gform-body.gform_body input {
    text-align: left;
}

.gform-body.gform_body label.gform-field-label.gform-field-label--type-sub {
    color: #fff;
    text-align: left;
}


/* =============================================================================
   5. FOOTER
   ============================================================================= */

/* ── Partner logos bar (white section above the red footer) ──────────────── */

.partner-bar {
    background-color: #ffffff;
    padding: 35px 0;
}

/* Remove Bootstrap's default container padding so all 1362px are usable */
.partner-bar .container {
    padding-left: 0;
    padding-right: 0;
}

/*
 * Desktop layout maths:
 *   9 logos × 128px + 8 gaps × 26px = 1360px  ≤  1362px container  → Row 1 = 9
 *   8 logos × 128px + 7 gaps × 26px = 1206px  ≤  1362px container  → Row 2 = 8
 */
.partner-bar__logos {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: 26px;
    row-gap: 30px;
    align-items: center;
}

.partner-bar__logo {
    flex: 0 0 128px;
    width: 128px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.partner-bar__logo img {
    max-width: 128px;
    max-height: 60px;
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* Mobile < 600px: 3 per row
   3 × 128 + 2 × 20 = 424px, fits in 540px (600px − 60px padding) */
@media (max-width: 600px) {
    .partner-bar {
        padding: 25px 0;
    }

    .partner-bar .container {
        padding-left: 15px;
        padding-right: 15px;
    }

    .partner-bar__logos {
        column-gap: 20px;
        row-gap: 20px;
    }
}

/* ── Red footer outer wrapper ────────────────────────────────────────────── */

footer {
    padding-bottom: 0;
}

footer .bg_img {
    bottom: -130px;
    right: 180px;
    width: 1080px;
}

/* Footer top: 58px top / 88px bottom */
.footer_top {
    padding-top: 58px;
    padding-bottom: 88px;
}

/* 54px gap between the three footer columns */
.footer_top .container > .row {
    --bs-gutter-x: 54px;
}

/* ── Footer logo ─────────────────────────────────────────────────────────── */

.f_widget .f_logo {
    max-width: 420px;
    margin-bottom: 28px;
}

.f_widget .f_logo img {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: left center;
}

/* ── Social icons — Font Awesome 5 Brands, 26px, colour #E8C650 ─────────── */

.f_widget .f_social {
    margin-top: 28px;
    margin-bottom: 0;
}

.f_widget .f_social li a {
    font-size: 26px;
    line-height: 30px;
    font-family: "Font Awesome 5 Brands", "FontAwesome";
    color: #E8C650;
    width: auto;
    height: auto;
}

.f_widget .f_social li a:hover {
    color: #ffffff;
}

/* ── Footer navigation menu ─────────────────────────────────────────────── */

.f_widget .f_link li a {
    font: normal normal 600 16px/20px "Barlow Semi Condensed", sans-serif;
    letter-spacing: 0;
    color: #ffffff;
    text-transform: uppercase;
}

/* ── Contact info text (address, phone, email) ───────────────────────────── */

.f_widget .f_contact li span,
.f_widget .f_contact li span a {
    font: normal normal normal 16px/22px "Barlow Semi Condensed", sans-serif;
    letter-spacing: 0.08px;
}

/* ── Footer newsletter — Gravity Forms inputs ────────────────────────────── */

.f_widget form input,
.f_widget .gform-body input[type="text"],
.f_widget .gform-body input[type="email"],
.f_widget .gform_body input[type="text"],
.f_widget .gform_body input[type="email"],
#gform_fields_4 input[type="text"],
#gform_fields_4 input[type="email"] {
    background: rgba(0, 0, 0, 0.302) no-repeat padding-box;
    border-radius: 8px;
}

/* ── Copyright bar ───────────────────────────────────────────────────────── */

/* Semi-transparent dark bar as per design spec */
.f_copyright {
    background: #000000;
    border-top: 1px solid #707070;
    opacity: 0.4;
    padding-top: 0;
    padding-bottom: 0;
}

/* Inner content padding */
.f_copyright .container {
    padding-top: 54px;
    padding-bottom: 58px;
}

/* All text in copyright bar — unified colour (opacity comes from parent) */
.f_copyright ul li,
.f_copyright ul li a,
.f_copyright ul li span {
    font: normal normal normal 14px/21px "Soleil", "Barlow Semi Condensed", sans-serif;
    letter-spacing: 0;
    color: #ffffff;
}

.f_copyright a {
    text-decoration: underline;
    color: #ffffff;
}

.f_copyright a:hover {
    color: #E8C650;
}


/* =============================================================================
   6. HOMEPAGE SECTIONS
   ============================================================================= */

.whys_wrap {
    padding-top: 34px;
}

.ad_wrap .ad_block:hover figure img {
    filter: none;
}

/* Demand blocks responsive width */
.demand-blocks {
    width: 13.3%;
}

/* Success stories column */
.nt-success-stories > .btn_group {
    gap: 0;
}

.nt-success-stories h2 {
    font-size: 40px;
    line-height: 45px;
    color: #962D00;
    margin: 0;
    margin-bottom: 20px;
    margin-top: 27px;
}

.nt-success-stories h3 {
    margin-bottom: 0;
    font-size: 32px;
    font-weight: 500;
    line-height: 28px;
    color: #004b37;
    visibility: hidden;
}

.nt-success-stories .btn_group p {
    margin-bottom: 107px;
    visibility: hidden;
    display: none;
}

.nt-success-stories .btn_group .btn_primary {
    margin-bottom: 27px;
}


/* =============================================================================
   7. BANNER / SLIDER (MOBILE OVERRIDES)
   ============================================================================= */

@media only screen and (max-width: 845px) {
    .banner_wrap .banner_inner .banner_item,
    .banner_wrap .banner_inner .slick-slide {
        height: 700px;
    }

    .banner_wrap .banner_inner .banner_item img {
        height: 51.7%;
    }

    .banner_wrap .banner_inner .banner_item .banner_con {
        margin: 0 !important;
        width: 100%;
        top: 38%;
        background: #004B37;
        padding-top: 80px;
        transform: translate(-50%, 96px);
        max-width: 992px !important;
    }

    .slick-dots {
        display: none !important;
    }

    .banner_wrap .banner_inner .slick-prev,
    .banner_wrap .banner_inner .slick-next {
        display: block !important;
    }

    .banner_wrap .banner_inner .slick-next {
        top: 58%;
        left: 60%;
    }

    .banner_wrap .banner_inner .slick-prev {
        top: 58%;
        left: 35%;
    }

    .slick-prev::before,
    .slick-next::before {
        font-size: 14px !important;
        padding: 0 11px !important;
        width: 37px !important;
        height: 37px !important;
        line-height: 34px !important;
    }

    .nt-success-stories .btn_group p {
        margin-bottom: 37px;
    }
}


/* =============================================================================
   8. SUCCESS STORIES
   ============================================================================= */

.suc_story_block {
    position: relative;
}

.suc_story_block .block_inner figure {
    width: 100%;
    height: auto;
    margin: 0;
    margin-bottom: 15px;
    overflow: hidden;
}

.suc_story_block .test_cap {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    left: inherit;
    transform: none;
    color: var(--green1);
    background-color: var(--white);
    filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.20));
    min-width: 289px;
    text-align: center;
    padding: 24px 20px;
    padding-top: 18px;
    font-size: 26px;
    font-weight: 500;
    line-height: 28px;
    z-index: 1;
    transition: all 250ms ease-in-out;
}

.test_wrap .btn_group.story_group a {
    min-width: 198px;
    padding: 9px;
}

.custom_story_btn {
    min-width: 198px;
    padding: 9px;
}

.custom_story_btn a {
    min-width: 193px;
    padding: 9px !important;
}

.suc_story_block .det a {
    cursor: default;
    pointer-events: none;
    text-decoration: none;
    color: #000;
}

.suc_story_block .block_inner .det span {
    text-decoration: none;
}

.cl_wrap .cl_inner .cl_item:hover figure img {
    transform: none !important;
}

/* Custom success story layout (success story single & listing) */
.custom-success-story h2 {
    color: #962C08;
    font: normal normal bold 40px/47px Rubik;
    letter-spacing: 0;
}

.custom-success-story h3 {
    color: #034B39;
    font: normal normal 600 32px/34px Barlow Semi Condensed;
    letter-spacing: 0;
}

.custom-success-story p {
    font: normal normal normal 18px/28px Barlow Semi Condensed;
    letter-spacing: 0.09px;
    color: #3C413F;
}

.custom-success-story h5 {
    font: normal normal 22px/30px Barlow Semi Condensed;
    letter-spacing: 0.11px;
    color: #000;
    margin-bottom: 17px;
}

.whys_wrap .custom-return {
    margin-top: 45px;
    width: 304px;
    background: #E8C650;
    font: normal normal 600 20px/20px Barlow Semi Condensed;
    letter-spacing: 0;
    color: #004B37;
    text-transform: uppercase;
    text-align: center;
    padding: 20px;
    display: inline-block;
}

.whys_wrap .custom-return:hover {
    color: #fff;
}

/* Firefox-specific fix for success story caption positioning */
@-moz-document url-prefix() {
    .suc_story_block .block_inner {
        position: relative;
    }

    .link_home_sucessstory_custom {
        position: absolute;
        right: 0;
        top: 10px;
    }
}


/* =============================================================================
   9. BLOG / NEWS / MEDIA PAGES
   ============================================================================= */

.nt-media {
    border: none;
}

.nt-media h3.active {
    border: none;
    position: relative;
}

.nt-media h3.non-active {
    border: none;
    position: relative;
}

.nt-media h3::after {
    content: "";
    display: block;
    width: 100%;
    height: 10px;
    background: #C2CAC7;
    top: 100%;
    position: absolute;
    float: left;
}

.nt-media h3.active,
.nt-media h3.non-active a {
    font-size: 34px !important;
    font-weight: 500;
    font-family: "Barlow Semi Condensed";
}

.nt-desc {
    text-transform: uppercase;
}

.nt-date {
    font-family: "Barlow Semi Condensed";
    font-size: 22px;
    font-weight: 500;
    line-height: 30px;
    color: #32a07d;
}

p.nt-date.internal-date {
    margin-bottom: 15px;
}

.active-bar {
    background: #843412;
    height: 10px;
    display: block;
    position: absolute;
    z-index: 1;
    width: 94%;
}

.bar-left {
    border-right: 5px solid #fff;
}

.bar-middle {
    width: 95%;
    border-right: 5px solid #fff;
    border-left: 5px solid #fff;
    left: 8px;
}

.bar-right {
    width: 100%;
    border-left: 5px solid #fff;
}

/* Media content boxes */
.media-content-box {
    padding: 0 !important;
    margin-right: 2.65%;
}

.media-content-box img {
    width: 100%;
}

.media-content-box .col-xl-4 {
    flex: 0 0 auto;
    width: 31.333333%;
}

.media-content-box:last-child,
.media-content-box:nth-child(3n+3) {
    margin-right: 0;
}

.col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.media-content-box {
    width: 31%;
}

.col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.nt-col-left {
    padding: 20px 0;
}

.nt-media .nt-col-left {
    padding-right: 0 !important;
}

.col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.nt-col-right {
    padding-right: 0;
}

.media-content-box .nt-date {
    font-size: 20px;
}

.media-content-box .nt-para {
    font-family: "Barlow Semi Condensed";
    font-size: 18px;
    font-weight: normal;
    color: #3C413F;
}

.media-content-row h2 {
    text-align: left;
    font: normal normal normal 18px/28px Barlow Semi Condensed;
    letter-spacing: 0.09px;
}

.media-content-row h2 a {
    text-decoration: underline;
    font: normal normal normal 18px/28px Barlow Semi Condensed;
    letter-spacing: 0.09px;
    color: #005C99;
}

.custo-media-content-box h3,
.custom-media-content h3 {
    font: normal normal normal 18px/28px Barlow Semi Condensed;
    letter-spacing: 0.09px;
}

a.blog-btn.btn-small.call-to-action {
    padding: 22px 20px;
    padding-top: 18px;
    background: #E8C650;
    font-size: 20px;
    font-weight: 600;
    line-height: 20px;
    text-transform: uppercase;
    min-width: 325px;
    display: inline-block;
    text-align: center;
    transition: all 250ms ease-in-out;
    position: relative;
    color: #004b37;
}

a.blog-btn.btn-small.call-to-action:hover {
    color: #E8C650;
    background: #32A07D;
}


/* =============================================================================
   10. SINGLE BLOG POST
   ============================================================================= */

@media (min-width: 1200px) {
    section.single-post-bg.pt_wrap {
        height: 280px;
    }
}

.single-post-bg .bg_img {
    max-height: 280px;
}

.single-post-bg .btn_primary.blog-btn.blog-btn-return.btn-small {
    float: right;
    min-width: 220px;
    font-family: "Barlow Semi Condensed";
    font-size: 16px;
    line-height: 20px;
    padding: 10px 20px;
    text-align: right;
}

a.btn_primary.blog-btn.blog-btn-return.btn-small svg {
    width: 20px;
    position: relative;
    left: -20px;
}

a.btn_primary.blog-btn.blog-btn-return.btn-small:hover svg path {
    fill: #fff;
}

.single-post-bg.pt_wrap h2 {
    position: relative;
    top: 91px;
}

.thumb-post img {
    width: 100%;
    max-height: 253px;
}

.custom-paragraph p {
    font: normal normal normal 18px/28px Barlow Semi Condensed;
    letter-spacing: 0.09px;
    color: #3C413F;
}

.return-btn-container {
    display: flex;
    justify-content: flex-end;
}

span.return-btn-container.btn-programs {
    justify-content: flex-start;
}

.btn-programs .return-media {
    width: auto;
    text-align: center;
    font: normal normal 600 20px/20px Barlow Semi Condensed;
    letter-spacing: 0;
    color: #004B37;
    padding: 30px 20px;
}

.btn-programs .return-media:hover {
    color: #fff;
}


/* =============================================================================
   11. SINGLE SUCCESS STORY
   ============================================================================= */

.whys_wrap.custom-single-post h1 {
    font: normal normal bold 40px/47px Rubik;
    letter-spacing: 0;
    color: #962C08;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.whys_wrap.custom-single-post h3 {
    font: normal normal 600 32px/34px Barlow Semi Condensed;
    letter-spacing: 0;
    color: #034B39;
}

.whys_wrap.custom-single-post {
    padding-top: 10px;
}

.custom-single-post .nt-date {
    font: normal normal medium 22px/30px Barlow Semi Condensed;
    letter-spacing: 0.11px;
    color: #32A07D;
}

.custom-single-post-bg .bg_img {
    max-height: 250px;
}

.custom-single-post .return-media {
    min-width: 220px;
    float: right;
    font-family: "Barlow Semi Condensed";
    font-size: 16px;
    line-height: 20px;
    padding: 10px 20px;
    padding-top: 13px;
    text-align: right;
}

@media only screen and (max-width: 1000px) {
    section.single-story-bg.pt_wrap.pt_wrap-story {
        display: block;
        max-height: 270px !important;
    }
}


/* =============================================================================
   12. HOW IT WORKS
   ============================================================================= */

.hiw_wrap h2 {
    font: normal normal bold 40px/45px Rubik;
    letter-spacing: 0;
    color: #962D00;
    text-transform: uppercase;
}

.howitworks-steps {
    width: 100%;
}


/* =============================================================================
   13. FUNDING & SUPPORT
   ============================================================================= */

.funding_wrap {
    padding: 38px 0;
}

.funding_wrap h3 {
    font: normal normal 600 32px/34px Barlow Semi Condensed;
    letter-spacing: 0;
    color: #034B39;
}

.funding_wrap .resources-container {
    display: flex;
    flex-flow: wrap;
    margin-top: 40px;
}

.funding_wrap .resources-container .resources-item-box {
    display: flex;
    flex-direction: column;
    flex-basis: 50%;
    margin-bottom: 32px;
}

.resources-item-box p {
    font: normal normal normal 18px/28px Barlow Semi Condensed;
    letter-spacing: 0.09px;
    color: #3C413F;
}

.resources-item-box h3 {
    margin-top: 32px !important;
}

.resources-item-box h3:first-child {
    margin-top: 0 !important;
}

.resources-item-box:nth-child(odd) {
    padding-right: 40px;
}

.resources-images-container {
    margin-top: 58px;
    margin-bottom: 127px;
}

.images-container-box {
    display: flex;
    flex-flow: wrap;
    justify-content: flex-start;
    gap: 15px;
    z-index: 1;
    position: relative;
}

img.resources-images-item {
    max-width: 354px;
    height: auto;
    margin: 0;
}

img.page-watermark-resources {
    position: absolute;
    margin: 0;
    bottom: -119px;
    left: -750px;
    max-width: 90%;
}


/* =============================================================================
   14. MEDIA ASSETS PAGE
   ============================================================================= */

.brandguideline-container {
    display: flex;
    flex-flow: column;
    margin-top: 35px;
}

.brandguideline-container h3 {
    font: normal normal 600 32px/34px Barlow Semi Condensed;
    letter-spacing: 0;
    color: #034B39;
}

.brandguideline-container a {
    text-decoration: underline;
    font: normal normal normal 18px/28px Barlow Semi Condensed;
    letter-spacing: 0.09px;
    color: #005C99;
}

.brandguideline-box {
    display: flex;
    gap: 40px;
    margin-bottom: 40px;
}

.brandguideline-box-text p,
.bwoodmark-box-text p {
    font: normal normal normal 18px/28px Barlow Semi Condensed;
    letter-spacing: 0.09px;
    color: #3C413F;
}

.brandguideline-box-text a {
    text-decoration: underline;
    font: normal normal normal 18px/28px Barlow Semi Condensed;
    letter-spacing: 0.09px;
    color: #005C99;
}

.woodmark-box {
    display: flex;
}

.woodmark-box-image {
    padding-left: 40px;
}

.woodmark-container h2 {
    margin-bottom: 20px;
}

.bwoodmark-box-text {
    width: 50%;
}

.logovariations-container-upper {
    margin-top: 60px;
}

.logovariations-title-area {
    border-bottom: 2px solid #707070;
    margin-bottom: 20px;
}

.logovariations-content-bottom h3,
.logovariations-title-area h3 {
    font: normal normal 600 32px/34px Barlow Semi Condensed;
    letter-spacing: 0;
    color: #034B39;
}

.logovariations-content-bottom h3 {
    border-bottom: 2px solid #707070;
    padding-bottom: 10px;
}

.logovariations-content-area {
    display: flex;
    gap: 40px;
    justify-content: center;
    align-items: center;
}

.logovariations-box-area ul {
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 0;
}

.logovariations-box-area:first-child ul {
    position: relative;
    top: 20px;
}

.logovariations-box-area li {
    width: 250px;
    text-align: left;
}

.logovariations-content-bottom {
    display: flex;
    flex-flow: column;
    margin-top: 35px;
    width: 50%;
}

.logovariations-content-bottom p {
    margin-bottom: 5px;
    font: normal normal normal 18px/28px Barlow Semi Condensed;
    letter-spacing: 0.09px;
    color: #3C413F;
}

.logovariations-content-bottom-box {
    display: flex;
    gap: 30px;
    flex-flow: column;
}

.logovariations-content-bottom-right {
    display: flex;
    flex-flow: column;
    justify-content: flex-end;
    width: 38%;
    margin-left: 30px;
}

.logovariations-content-bottom-right-images {
    display: flex;
    gap: 10px;
}

.logovariations-resources-stacked {
    display: flex;
}

.logovariations-resources-stacked-links {
    display: flex;
    flex-flow: column;
    justify-content: center;
}

.last-links {
    justify-content: flex-start;
}

.logovariations-container-bottom {
    display: flex;
    justify-content: space-between;
    gap: 30px;
}


/* =============================================================================
   15. SIGNUP PAGE
   ============================================================================= */

.signup_wrap .signup_inner .signup_box {
    height: 690px;
}

section.signup_wrap .container {
    padding: 0;
}


/* =============================================================================
   16. COURSE OFFERINGS & FILTERS
   ============================================================================= */

/* 4-col grid layout for course overview */
@media (min-width: 1200px) {
    .grid.grid-4-cols {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 305px));
        column-gap: 40px;
        row-gap: 14px;
        margin-bottom: 20px;
        justify-content: space-between;
    }
}

@media (max-width: 1199px) {
    .grid-4-cols {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 5px;
        margin-bottom: 20px;
    }
}

@media (max-width: 767px) {
    .grid-4-cols {
        grid-template-columns: 1fr;
    }

    .grid-item a {
        display: block;
        width: 100%;
        text-align: center;
    }
}

.overview-nt .grid-4-cols1 {
    display: none !important;
}

.overview-nt .sec_title {
    max-width: 100%;
    margin-top: 30px;
}

/* Course trade buttons */
.selected a {
    background-color: #e8c650 !important;
    pointer-events: none;
}

.nt-trade-btn {
    background: white;
    line-height: 16px !important;
    border: 2px solid #e8c650;
    text-align: center !important;
    min-width: 100%;
    font-size: 20px;
    font-weight: 500;
    padding: 10px;
    margin-bottom: 10px;
    text-transform: none;
}

/* Course offerings mobile dropdown */
.course-offerings-dropdown {
    max-width: 470px;
    width: 100%;
    border: 2px solid #E8C650;
    text-align: left;
    padding: 12px 20px;
    position: relative;
}

.course-offerings-dropdown::after {
    content: "";
    position: absolute;
    right: 25px;
    top: 50%;
    width: 12px;
    height: 12px;
    border-right: 3px solid #962d00;
    border-bottom: 3px solid #962d00;
    transform: translateY(-60%) rotate(45deg);
    pointer-events: none;
}

select.nt-trade-dropdown-mobile {
    font-family: "Barlow Semi Condensed";
    letter-spacing: 0.1px;
    color: #006E51;
    font-size: 20px;
    font-weight: 500;
    width: 100%;
    background: transparent;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: none;
}

/* Course filter panel */
@media only screen and (max-width: 1200px) {
    .mobile_filter .custom_radio.btn_nt {
        display: flex;
        list-style: none;
    }

    .accordion-item:first-of-type .accordion-button {
        background-color: #fff;
    }

    .filter_wrap {
        margin-top: 30px;
    }

    section.signup_wrap .container {
        padding: 0 20px;
    }

    .signup_wrap .signup_inner {
        justify-content: center;
    }
}

@media only screen and (max-width: 936px) {
    .custom_radio {
        display: inline-flex;
        list-style: none;
        gap: 15px;
    }
}

@media only screen and (max-width: 920px) {
    .mobile_filter .custom_radio.btn_nt {
        gap: 20px;
        margin-bottom: 50px;
    }

    .mobile_filter .submit_btn {
        position: relative;
        top: 95px;
    }

    .mobile_filter {
        display: block;
        margin-top: -60px;
        margin-bottom: 60px;
    }

    .mobile_filter .submit_btn .reset_btn i {
        margin-right: 10px !important;
    }

    .filter_wrap {
        margin-top: 20px;
    }

    .course-offerings-dropdown {
        margin-bottom: 20px;
    }
}

@media only screen and (min-width: 575px) and (max-width: 920px) {
    .custom-wrap-courses .sec_title {
        margin-bottom: -50px;
    }

    .mobile_filter .submit_btn {
        position: relative;
        top: 125px;
    }

    .mobile_filter {
        margin-bottom: 80px;
    }
}

@media (max-width: 768px) {
    #number_countt {
        position: inherit;
        top: 0;
    }
}

@media (max-width: 575px) {
    #number_countt {
        margin-left: 0;
        display: block;
        position: initial;
        margin-top: -31px;
    }
}


/* =============================================================================
   17. ADMIN BAR OVERRIDES
   ============================================================================= */

#wpadminbar .edit_course a {
    display: none !important;
}

.edit_course_btn {
    display: none;
}

#wp-admin-bar-top-secondary .edit_course {
    display: none !important;
}


/* =============================================================================
   18. RESPONSIVE ADJUSTMENTS
   ============================================================================= */

/* ---- min-width: 991px ---- */
@media only screen and (min-width: 991px) {
    .wrap-search {
        display: inline-flex;
    }

    .navbar_main .navbar-nav .nav-link.active {
        filter: drop-shadow(0px 11px 4px rgba(0, 0, 0, 0.21));
    }

    .media-content-box {
        padding: 0 !important;
        margin-right: 3.4%;
    }

    .demand-blocks {
        width: 13.3%;
    }
}

/* ---- min-width: 1200px ---- */
@media only screen and (min-width: 1200px) {
    .wrap-search {
        display: inline-flex;
    }

    section.custom-success-story .bg_img {
        display: block;
    }

    .whys_wrap .custom-return {
        height: auto;
    }
}

/* ---- max-width: 1400px ---- */
@media (max-width: 1400px) {
    .suc_story_block .test_cap {
        font-size: 22px;
        padding: 14px;
        padding-top: 10px;
        min-width: 220px;
    }

    .funding_wrap .row .col-12 {
        padding: 0;
    }
}

/* ---- min-width: 1400px ---- */
@media only screen and (min-width: 1400px) {
    /* header_social is hidden in new design; no width override needed */
}

/* ---- max-width: 1200px ---- */
@media only screen and (max-width: 1200px) {
    .bar-middle {
        width: 97%;
        left: -3px;
    }

    .suc_story_block .block_inner {
        position: relative;
    }

    .suc_story_block .test_cap {
        position: absolute;
        top: 60px;
        left: 120px;
        width: 80%;
        transform: translateY(-100%);
    }

    .suc_story_block .block_inner figure {
        height: 225px;
    }

    .cl_wrap .cl_inner .cl_item .btn_primary.btn_small {
        top: 0;
    }

    .logovariations-container-bottom {
        flex-flow: column;
    }

    .logovariations-content-bottom {
        width: 100%;
    }

    .whys_wrap.custom-single-post h1 {
        margin-top: 20px;
    }
}

/* ---- max-width: 1000px ---- */
@media only screen and (max-width: 1000px) {
    .test_wrap .row {
        flex-flow: column;
        justify-content: center;
        align-items: center;
    }
}

/* ---- min-width: 768px, max-width: 990px ---- */
@media only screen and (min-width: 768px) and (max-width: 990px) {
    .nt-col-left,
    .nt-col-middle,
    .nt-col-right {
        width: 33.3%;
    }

    .col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.nt-col-middle {
        padding: 20px 0;
    }

    .col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.nt-col-right {
        padding: 20px 0;
    }
}

/* ---- min-width: 768px, max-width: 1024px ---- */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .row.nt-media {
        margin-bottom: 40px;
    }

    .col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.nt-col-left.clean-tab {
        padding: 0 !important;
    }

    .col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.nt-col-middle,
    .col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.nt-col-right {
        padding: 0 !important;
    }

    .col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.nt-col-left.active-tab-left {
        padding: 0;
    }
}

/* ---- max-width: 992px ---- */
@media (max-width: 992px) {
    .images-container-box {
        justify-content: center;
    }
}

/* ---- min-width: 768px, max-width: 920px ---- */
@media (min-width: 768px) and (max-width: 920px) {
    .course-offerings-dropdown {
        display: block;
        margin: 0 auto;
        margin-bottom: 20px;
    }
}

/* ---- max-width: 768px ---- */
@media only screen and (max-width: 768px) {
    .wrap-search {
        display: block;
        margin: 20px auto 0;
        width: 370px;
    }

    .demand-blocks {
        width: 25%;
    }

    .nt-media .col-xl-4 {
        width: 33.3% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .nt-media h3.active,
    .nt-media h3.non-active a {
        font-size: 21px !important;
    }

    header .logo {
        max-width: 370px;
    }

    .media-content-box {
        width: 100%;
    }

    .bar-middle {
        width: 100%;
        left: 0;
        border: none;
    }

    .bar-right,
    .bar-left {
        width: 100%;
        border: none;
    }

    .row.nt-media {
        gap: 0;
        margin-bottom: 80px;
    }

    .col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.media-content-box {
        width: 100%;
    }

    .col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.nt-col-left.active-tab-left {
        margin-bottom: 20px;
        padding: 20px 0;
    }

    .col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.nt-col-middle.active-tab-center {
        padding: 35px 0;
    }

    .col-xl-4.col-lg-4.col-md-6.col-sm-12.col-12.nt-col-right.active-tab-right {
        padding-top: 35px;
    }

    .clean-tab {
        padding: 0 !important;
    }

    iframe {
        max-width: 350px;
        margin: 0 auto;
        display: block;
    }

    .howitworks-container {
        overflow-x: scroll;
    }

    .howitworks-steps {
        min-width: 600px;
    }

    .test_wrap .row {
        flex-flow: wrap-reverse;
    }

    .f_widget .f_contact {
        margin-top: -5px;
    }

    .f_widget .f_link {
        margin-top: 25px;
    }

    .funding_wrap .resources-container {
        flex-flow: column;
    }

    .whys_wrap a.btn_primary.blog-btn.blog-btn-return.btn-small {
        width: auto;
        margin-top: 0;
    }

    .story_wrap h1 {
        margin-top: 30px;
        text-align: center;
    }

    .brandguideline-box {
        flex-flow: wrap;
    }

    .brandguideline-box-image img {
        max-width: 400px !important;
    }

    .woodmark-box {
        flex-flow: wrap;
    }

    .bwoodmark-box-text {
        width: 100%;
        margin-bottom: 30px;
    }

    .logovariations-content-area {
        flex-flow: column;
    }

    .brandguideline-container h2 {
        text-align: center;
    }

    .brandguideline-box-image {
        margin: 0 auto;
    }
}

/* ---- max-width: 730px ---- */
@media screen and (max-width: 730px) {
    .woodmark-box-image {
        padding-left: 0;
    }

    .logovariations-resources-stacked {
        flex-flow: column;
        justify-content: center;
        align-items: center;
    }

    .logovariations-content-bottom-right {
        flex-flow: column;
        justify-content: space-around;
        width: 100%;
        margin-left: 0;
        text-align: center;
    }

    .logovariations-content-bottom-right-images {
        justify-content: center;
    }
}

/* ---- max-width: 587px ---- */
@media (max-width: 587px) {
    .suc_story_block .test_cap {
        left: 70px;
    }

    .whys_wrap .custom-return {
        height: auto;
        margin-top: 20px !important;
    }
}

/* ---- max-width: 500px ---- */
@media only screen and (max-width: 500px) {
    section.single-story-bg.pt_wrap.pt_wrap-story {
        max-height: 180px !important;
    }

    .whys_wrap .custom-success-story {
        padding-top: 0;
    }
}

/* ---- max-width: 450px ---- */
@media only screen and (max-width: 450px) {
    .suc_story_block .test_cap {
        left: 85px;
    }

    .nt-media h3.active,
    .nt-media h3.non-active a {
        font-size: 17px !important;
    }

    .demand-blocks {
        width: 30%;
    }
}

/* ---- min-width: 574px, max-width: 768px ---- */
@media only screen and (min-width: 574px) and (max-width: 768px) {
    .whys_wrap a.btn_primary.blog-btn.blog-btn-return.btn-small {
        width: 100%;
        margin-top: -64px !important;
    }
}

/* ---- max-width: 450px (single post) ---- */
@media only screen and (max-width: 450px) {
    .single-post-bg.pt_wrap h2 {
        position: relative;
        top: 35px;
    }
}


/* =============================================================================
   MOBILE — Global 30px side padding on all containers (whole site, < 991px)
   ============================================================================= */

@media (max-width: 991px) {
    .container,
    .container-sm,
    .container-md,
    .container-fluid {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
}


/* =============================================================================
   MOBILE HEADER — max-width: 991px
   Stack logo above the search links; search links stay visible on all widths.
   Font sizes remain identical to desktop (18px/22px Barlow Semi Condensed).
   ============================================================================= */

@media (max-width: 991px) {

    /* padding-top: 30px / padding-bottom: 20px creates the gap below
       header_search before the green navbar */
    header {
        padding-top: 30px;
        padding-bottom: 20px;
    }

    /* Stack logo and search-row vertically, centred.
       gap: 20px = space between logo and header_search row */
    header .container {
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }

    /* wrap-search centres the search row */
    .wrap-search {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    /* header_search: keep visible, centred, allow wrap on very narrow screens */
    header .header_search {
        display: flex !important;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 4px 0;
        width: auto;
        float: none;
    }
}

/* 650px – 991px: logo stays at full desktop size (535 × 79 px) */
@media (min-width: 650px) and (max-width: 991px) {
    header .logo {
        max-width: 535px;
        height: 79px;
        width: 100%;
        margin: 0 auto;
    }

    header .logo img {
        max-width: 535px;
        height: 79px;
        width: 100%;
        object-fit: contain;
        object-position: center center;
    }
}

/* Under 650px: logo scales down to 370px max */
@media (max-width: 649px) {
    header .logo {
        max-width: 370px;
        height: auto;
        width: 100%;
        margin: 0 auto;
    }

    header .logo img {
        max-width: 370px;
        height: auto;
        width: 100%;
        object-fit: contain;
        object-position: center center;
    }
}

/* On mobile reduce the gap between the last link and the search icon to 16px */
@media (max-width: 991px) {
    header .header_search .dropdown {
        margin-left: 16px;
    }
}

/* Override style.css display:none on header_search at max-width:500px */
@media (max-width: 500px) {
    header .header_search {
        display: flex !important;
    }
}