/* ==========================================================================
   CathBright — Main Stylesheet
   All frontend CSS lives in this single file, sectioned with comment headers.
   ========================================================================== */


/* ---------- CUSTOM PROPERTIES ---------- */
:root {
    /* Brand colours */
    --navy:        #2D3447;
    --green:       #ABB443;

    /* Derived colours */
    --navy-light:  #3d4560;
    --navy-dark:   #1e2330;
    --green-light: #c4ca6e;
    --green-dark:  #616626;  /* accessible on white — 6.11:1 AA+AAA */

    /* Neutrals */
    --white:       #FFFFFF;
    --off-white:   #F5F5F3;
    --grey-100:    #EBEBEB;
    --grey-200:    #D1D1D1;
    --grey-400:    #888888;
    --grey-600:    #555555;
    --grey-800:    #333333;
    --black:       #1A1A1A;

    /* Typography */
    --font-primary:   "helvetica-neue-lt-pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font-condensed: "helvetica-neue-lt-pro-cond", "Helvetica Neue", Helvetica, Arial, sans-serif;

    /* Spacing scale */
    --space-xs:  0.25rem;
    --space-sm:  0.5rem;
    --space-md:  1rem;
    --space-lg:  1.5rem;
    --space-xl:  2rem;
    --space-2xl: 3rem;
    --space-3xl: 4rem;
    --space-4xl: 5rem;

    /* Layout */
    --container-max: 1140px;
    --nav-height: 72px;

    /* Border radius */
    --radius-sm: 3px;
    --radius-md: 6px;
    --radius-lg: 12px;

    /* Transitions */
    --transition: 0.2s ease;
}


/* ---------- RESET ---------- */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    font-family: var(--font-primary);
    font-weight: 400;
    line-height: 1.6;
    color: var(--grey-800);
    background-color: var(--white);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

h1, h2, h3, h4, h5, h6 {
    color: inherit;
    line-height: 1.2;
}

a {
    color: var(--green-dark);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
    transition: color var(--transition);
}

a:hover {
    color: var(--navy);
}

ul, ol {
    list-style: none;
}


/* ---------- ACCESSIBILITY ---------- */

/* Visible focus rings for keyboard users — scoped to :focus-visible so mouse clicks don't trigger */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--green-dark);
    outline-offset: 2px;
    border-radius: 2px;
}

/* On dark backgrounds, use the lighter green for contrast */
.scheme-dark a:focus-visible,
.scheme-dark button:focus-visible,
.dark-bg a:focus-visible,
.dark-bg button:focus-visible,
.site-footer a:focus-visible,
.block-hero-banner a:focus-visible,
.block-hero-banner button:focus-visible {
    outline-color: var(--green);
}

/* Skip-link visible state */

.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

.skip-link {
    background: var(--navy);
    color: var(--white);
    padding: var(--space-sm) var(--space-md);
    position: absolute;
    top: -100px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10000;
    text-decoration: none;
    font-weight: 700;
    border-radius: 0 0 var(--radius-sm) var(--radius-sm);
}

.skip-link:focus {
    top: 0;
}


/* ---------- TYPOGRAPHY ---------- */
h1, .h1 {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 2.75rem;
    line-height: 1.15;
}

h2, .h2 {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.2;
}

h3, .h3 {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.3;
}

h4, .h4 {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 1.125rem;
    line-height: 1.4;
    margin-bottom: var(--space-md);
}

h5, .h5 {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

p {
    margin-bottom: var(--space-md);
}

p:last-child {
    margin-bottom: 0;
}

.text-large  { font-size: 1.25rem; line-height: 1.6; }
.text-small  { font-size: 0.875rem; line-height: 1.5; }
.text-caption { font-size: 0.75rem; line-height: 1.4; color: var(--grey-600); }

blockquote {
    border-left: 4px solid var(--green);
    padding: var(--space-md) var(--space-lg);
    margin: var(--space-lg) 0;
    font-size: 1.125rem;
    font-style: italic;
    color: var(--grey-600);
    background-color: var(--off-white);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}

blockquote cite {
    display: block;
    margin-top: var(--space-sm);
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 700;
    color: var(--navy);
}


/* ---------- BUTTONS ---------- */
.btn {
    display: inline-flex;
    align-items: center;
    gap: var(--space-sm);
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.9375rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.75em 1.75em;
    border: 2px solid transparent;
    border-radius: var(--radius-sm);
    cursor: pointer;
    text-decoration: none;
    transition: all var(--transition);
    line-height: 1;
}

.btn-primary {
    background-color: var(--green);
    border-color: var(--green);
    color: var(--navy);
}

.btn-primary:hover {
    background-color: var(--green-dark);
    border-color: var(--green-dark);
    color: var(--white);
}

.btn-secondary {
    background-color: var(--navy);
    border-color: var(--navy);
    color: var(--white);
}

.btn-secondary:hover {
    background-color: var(--navy-light);
    border-color: var(--navy-light);
    color: var(--white);
}

.btn-outline {
    background-color: transparent;
    border-color: var(--navy);
    color: var(--navy);
}

.btn-outline:hover {
    background-color: var(--navy);
    color: var(--white);
}

.btn-outline-light {
    background-color: transparent;
    border-color: var(--white);
    color: var(--white);
}

.btn-outline-light:hover {
    background-color: var(--white);
    color: var(--navy);
}

.btn-outline-navy {
    background-color: transparent;
    border-color: var(--navy);
    color: var(--navy);
}

.btn-outline-navy:hover {
    background-color: var(--navy);
    color: var(--white);
}

.btn-sm {
    font-size: 0.8125rem;
    padding: 0.5em 1.25em;
}

.btn-lg {
    font-size: 1.0625rem;
    padding: 0.875em 2.25em;
}


/* ---------- FORMS ---------- */
.form-group {
    margin-bottom: var(--space-lg);
}

.form-label {
    display: block;
    font-weight: 700;
    font-size: 0.875rem;
    color: var(--navy);
    margin-bottom: var(--space-xs);
}

.form-hint {
    display: block;
    font-size: 0.8125rem;
    color: var(--grey-400);
    margin-bottom: var(--space-xs);
}

.form-input,
.form-textarea,
.form-select {
    width: 100%;
    font-family: var(--font-primary);
    font-size: 1rem;
    font-weight: 400;
    padding: 0.625em 0.875em;
    border: 1px solid var(--grey-200);
    border-radius: var(--radius-sm);
    background-color: var(--white);
    color: var(--grey-800);
    transition: border-color var(--transition), box-shadow var(--transition);
}

.form-input:focus,
.form-textarea:focus,
.form-select:focus {
    outline: none;
    border-color: var(--green);
    box-shadow: 0 0 0 3px rgba(171, 180, 67, 0.2);
}

.form-input::placeholder,
.form-textarea::placeholder {
    color: var(--grey-400);
}

.form-textarea {
    min-height: 120px;
    resize: vertical;
}

.form-select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.875em center;
    padding-right: 2.5em;
}

input[type="checkbox"] {
    accent-color: var(--green);
}

.form-input-error {
    border-color: #c0392b;
}

.form-error-message {
    font-size: 0.8125rem;
    color: #c0392b;
    margin-top: var(--space-xs);
}


/* ---------- UTILITY CLASSES ---------- */

/* Gutenberg core alignment classes (we dequeue wp-block-library so we redefine here) */
.has-text-align-left   { text-align: left; }
.has-text-align-center { text-align: center; }
.has-text-align-right  { text-align: right; }
.has-text-align-justify { text-align: justify; }

.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignleft   { float: left; margin-right: var(--space-md); }
.alignright  { float: right; margin-left: var(--space-md); }
.alignwide   { max-width: var(--container-max); }
.alignfull   { width: 100%; max-width: none; }


/* Condensed bold label — for section labels, card categories */
.label-condensed {
    font-family: var(--font-condensed);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* Brand chevron bullet list */
.brand-list {
    list-style: none;
    padding-left: 0;
}

.brand-list li {
    position: relative;
    padding-left: 1.75em;
    margin-bottom: var(--space-sm);
}

.brand-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.3em;
    width: 0.85em;
    height: 0.7em;
    background: url('../images/arrow-green.svg') no-repeat center / contain;
}

.brand-list-navy li::before {
    background-image: url('../images/arrow-navy.svg');
}

/* Standard list with green markers */
.standard-list {
    padding-left: 1.25em;
    margin-bottom: var(--space-md);
}

.standard-list li {
    margin-bottom: var(--space-xs);
    list-style: disc;
}

.standard-list li::marker {
    color: var(--green);
}

/* Spacing utilities — used by ACF blocks */
.pt-none { padding-top: 0; }
.pt-sm   { padding-top: var(--space-lg); }
.pt-md   { padding-top: var(--space-2xl); }
.pt-lg   { padding-top: var(--space-3xl); }
.pt-xl   { padding-top: var(--space-4xl); }

.pb-none { padding-bottom: 0; }
.pb-sm   { padding-bottom: var(--space-lg); }
.pb-md   { padding-bottom: var(--space-2xl); }
.pb-lg   { padding-bottom: var(--space-3xl); }
.pb-xl   { padding-bottom: var(--space-4xl); }

.mt-none { margin-top: 0; }
.mt-sm   { margin-top: var(--space-lg); }
.mt-md   { margin-top: var(--space-2xl); }
.mt-lg   { margin-top: var(--space-3xl); }

.mb-none { margin-bottom: 0; }
.mb-sm   { margin-bottom: var(--space-lg); }
.mb-md   { margin-bottom: var(--space-2xl); }
.mb-lg   { margin-bottom: var(--space-3xl); }

/* Colour scheme modifiers for ACF blocks */
.scheme-light {
    background-color: var(--white);
    color: var(--grey-800);
}

.scheme-dark {
    background-color: var(--navy);
    color: var(--white);
}

.scheme-dark a:not(.btn) {
    color: var(--green-light);
}

.scheme-dark a:not(.btn):hover {
    color: var(--white);
}

.scheme-dark .brand-list li::before {
    filter: brightness(1.3);
}

.scheme-brand {
    background-color: var(--green);
    color: var(--navy);
}

.scheme-off-white {
    background-color: var(--off-white);
    color: var(--grey-800);
}


/* ---------- LAYOUT UTILITIES ---------- */
.container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 var(--space-xl);
}

.section {
    padding: var(--space-4xl) 0;
}


/* ---------- SITE HEADER ---------- */
.site-header {
    background-color: var(--white);
    border-bottom: 1px solid var(--grey-100);
    padding: var(--space-md) 0;
    position: sticky;
    top: 0;
    z-index: 1000;
    transition: background-color var(--transition), box-shadow var(--transition);
}

.site-header.is-scrolled {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.site-header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.site-header .custom-logo {
    max-height: 56px;
    width: auto;
}

.header__nav {
    margin-left: auto;
    margin-right: var(--space-lg);
}

.header__nav .nav-links {
    list-style: none;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
}

.header__nav .nav-links li {
    list-style: none;
    margin: 0 var(--space-sm);
    padding: 0;
}

.header__nav .nav-links .nav-link {
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 1rem;
    color: var(--navy);
    text-decoration: none;
    padding: var(--space-xs) var(--space-md);
    border-radius: var(--radius-sm);
    transition: all var(--transition);
}

.header__nav .nav-links .nav-link:hover,
.header__nav .nav-links .nav-item--active .nav-link {
    color: var(--green-dark);
    background-color: var(--off-white);
}

.header__nav .nav-links .nav-item--active.nav-dropdown {
    background-color: var(--off-white);
    padding-right: 8px;
    border-radius: var(--radius-sm);
}

/* Dropdown parent item */
.header__nav .nav-dropdown {
    position: relative;
    display: flex;
    align-items: center;
    border-radius: var(--radius-sm);
    transition: background-color var(--transition);
}

.header__nav .nav-dropdown:hover,
.header__nav .nav-dropdown:focus-within,
.header__nav .nav-dropdown.is-open {
    background-color: var(--off-white);
}

.header__nav .nav-dropdown:hover > .nav-link,
.header__nav .nav-dropdown:focus-within > .nav-link,
.header__nav .nav-dropdown.is-open > .nav-link {
    background-color: transparent;
}

.header__nav .nav-dropdown {
    padding-right: var(--space-sm);
}

.header__nav .nav-dropdown > .nav-link {
    padding-right: var(--space-xs);
}

.header__nav .nav-dropdown-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    color: var(--navy);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 1em;
    transition: transform 0.2s ease, color var(--transition);
}

.header__nav .nav-dropdown-toggle svg {
    width: 10px;
    height: 6px;
}

.header__nav .nav-dropdown-toggle:hover {
    color: var(--green-dark);
}

.header__nav .nav-dropdown.is-open > .nav-dropdown-toggle,
.header__nav .nav-dropdown:hover > .nav-dropdown-toggle {
    transform: rotate(180deg);
}

/* Dropdown menu */
.header__nav .nav-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--white);
    border: 1px solid var(--grey-100);
    border-radius: var(--radius-md);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    padding: 0;
    min-width: 240px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
    z-index: 200;
    list-style: none;
    margin-top: 6px;
}

.header__nav .nav-dropdown:hover > .nav-dropdown-menu,
.header__nav .nav-dropdown:focus-within > .nav-dropdown-menu,
.header__nav .nav-dropdown.is-open > .nav-dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.header__nav .nav-dropdown-menu .nav-subitem {
    list-style: none;
    margin: 0;
    padding: 0;
    display: block;
}

.header__nav .nav-dropdown-menu .nav-link {
    display: block;
    padding: var(--space-sm) var(--space-lg);
    font-size: 0.8125rem;
    color: var(--navy);
    border-radius: 0;
    white-space: nowrap;
}

.header__nav .nav-dropdown-menu .nav-link:hover,
.header__nav .nav-dropdown-menu .nav-item--active .nav-link {
    background: var(--off-white);
    color: var(--green-dark);
}

/* Mobile menu — flatten dropdowns into vertical list */
.mobile-menu-overlay .nav-dropdown-toggle {
    display: none;
}

.mobile-menu-overlay .nav-dropdown-menu {
    position: static;
    transform: none;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    margin: 0 0 var(--space-sm) 0;
    min-width: 0;
    opacity: 0;
    visibility: hidden;
}

.mobile-menu-overlay.is-open .nav-dropdown-menu {
    opacity: 1;
    visibility: visible;
}

.mobile-menu-overlay .nav-dropdown-menu .nav-subitem .nav-link {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.7);
    padding: var(--space-sm) var(--space-xl);
    white-space: normal;
}

.mobile-menu-overlay .nav-dropdown-menu .nav-subitem .nav-link:hover,
.mobile-menu-overlay .nav-dropdown-menu .nav-item--active .nav-link {
    color: var(--green);
    background: transparent;
}

.header__actions {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.header__cta {
    font-size: 0.875rem;
    padding: var(--space-sm) var(--space-lg);
}

/* Search toggle */
.header__search-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--space-xs);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--navy);
    transition: color var(--transition);
}

.header__search-toggle:hover {
    color: var(--green-dark);
}

.header__search-toggle svg {
    width: 18px;
    height: 18px;
}

/* Search overlay */
.search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(45, 52, 71, 0.95);
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.search-overlay.is-open {
    opacity: 1;
    visibility: visible;
}

.search-overlay__inner {
    width: 100%;
    max-width: 600px;
    padding: 0 var(--space-xl);
}

.search-overlay__close {
    position: absolute;
    top: var(--space-xl);
    right: var(--space-xl);
    background: none;
    border: none;
    color: var(--white);
    font-size: 2rem;
    cursor: pointer;
    padding: var(--space-sm);
    line-height: 1;
    transition: color var(--transition);
}

.search-overlay__close:hover {
    color: var(--green);
}

.search-overlay .search-form {
    max-width: 100%;
}

.search-overlay .search-field {
    background: transparent;
    border: none;
    border-bottom: 2px solid rgba(255, 255, 255, 0.3);
    color: var(--white);
    font-size: 1.5rem;
    font-family: var(--font-primary);
    padding: var(--space-md) 0;
    width: 100%;
    transition: border-color var(--transition);
}

.search-overlay .search-field:focus {
    outline: none;
    border-bottom-color: var(--green);
    box-shadow: none;
}

.search-overlay .search-field::placeholder {
    color: rgba(255, 255, 255, 0.4);
}

.search-overlay .search-submit {
    background: var(--green);
    color: var(--navy);
    border: none;
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.75em 2em;
    border-radius: var(--radius-sm);
    cursor: pointer;
    margin-top: var(--space-lg);
    transition: background var(--transition);
}

.search-overlay .search-submit:hover {
    background: var(--green-dark);
    color: var(--white);
}

/* Mobile header state — transparent when menu is open */
.site-header.menu-open {
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-bottom-color: transparent;
    box-shadow: none;
}


/* ---------- HAMBURGER & MOBILE MENU ---------- */
.nav-hamburger {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--space-sm);
    z-index: 1010;
}

.nav-hamburger-lines {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 24px;
}

.nav-hamburger-lines span {
    display: block;
    height: 2px;
    background-color: var(--navy);
    border-radius: 1px;
    transition: all 0.3s ease;
}

/* Hamburger → X animation */
.nav-hamburger.is-active .nav-hamburger-lines span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.nav-hamburger.is-active .nav-hamburger-lines span:nth-child(2) {
    opacity: 0;
}

.nav-hamburger.is-active .nav-hamburger-lines span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.menu-open .nav-hamburger-lines span {
    background-color: var(--white);
}

/* Mobile menu overlay */
.mobile-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--navy);
    z-index: 1500;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    overflow-y: auto;
}

.mobile-menu-overlay.is-open {
    pointer-events: auto;
}

.mobile-menu-overlay__inner {
    width: 100%;
    max-width: 480px;
    padding: var(--space-4xl) var(--space-xl);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-lg);
}

.mobile-menu-close {
    position: absolute;
    top: var(--space-lg);
    right: var(--space-lg);
    background: none;
    border: none;
    color: var(--white);
    font-size: 2.5rem;
    line-height: 1;
    cursor: pointer;
    padding: var(--space-sm);
    transition: color var(--transition);
    z-index: 10;
}

.mobile-menu-close:hover {
    color: var(--green);
}

.mobile-menu-search {
    width: 100%;
    margin-top: var(--space-xl);
    padding-top: var(--space-xl);
    border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.mobile-menu-search .search-form {
    width: 100%;
    max-width: none;
    display: flex;
    gap: var(--space-sm);
}

.mobile-menu-search .search-field {
    flex: 1;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: var(--white);
    font-size: 1rem;
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-sm);
}

.mobile-menu-search .search-field:focus {
    outline: none;
    border-color: var(--green);
    box-shadow: 0 0 0 3px rgba(171, 180, 67, 0.2);
}

.mobile-menu-search .search-field::placeholder {
    color: rgba(255, 255, 255, 0.4);
}

.mobile-menu-search .search-submit {
    background: var(--green);
    color: var(--navy);
    border: none;
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: var(--space-sm) var(--space-lg);
    border-radius: var(--radius-sm);
    cursor: pointer;
}

.mobile-menu-search .search-submit:hover {
    background: var(--green-dark);
    color: var(--white);
}

.mobile-menu-overlay.is-open {
    opacity: 1;
    visibility: visible;
}

.mobile-menu-overlay .nav-links {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;
}

.mobile-menu-overlay .nav-links li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mobile-menu-overlay .nav-links .nav-link {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 1.5rem;
    color: var(--white);
    text-decoration: none;
    display: block;
    padding: var(--space-md) var(--space-xl);
    transition: color var(--transition);
}

.mobile-menu-overlay .nav-links .nav-link:hover,
.mobile-menu-overlay .nav-links .nav-item--active .nav-link {
    color: var(--green);
}

.mobile-menu-overlay .mobile-cta {
    margin-top: var(--space-xl);
}


/* ---------- SITE MAIN ---------- */
.site-main {
    padding-top: 0;
}


/* ---------- BLOCK: HERO SPLIT ---------- */
.block-hero-split {
    position: relative;
}

.block-hero-split__green {
    background-color: var(--green);
    position: relative;
    overflow: hidden;
    padding: var(--space-2xl) 0;
}

.block-hero-split__green::before {
    content: "";
    position: absolute;
    top: 0;
    left: 40px;
    width: 400px;
    height: 100%;
    background: url('../images/chevron-deco-green.svg') no-repeat center / contain;
    pointer-events: none;
}

.block-hero-split__green .container {
    position: relative;
    z-index: 1;
}

.block-hero-split__green h1 {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 2.5rem;
    color: var(--navy);
    max-width: 650px;
}

.block-hero-split__navy {
    background-color: var(--navy);
    position: relative;
    overflow: hidden;
    padding: var(--space-2xl) 0;
}

.block-hero-split__navy .container {
    position: relative;
    z-index: 1;
}

.block-hero-split__label {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--green);
    margin-bottom: var(--space-md);
}

.block-hero-split__navy p {
    font-size: 0.9375rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.85);
    max-width: 650px;
    margin-bottom: var(--space-md);
}

.block-hero-split__image {
    position: absolute;
    top: 50%;
    right: 8%;
    transform: translateY(-50%);
    width: 280px;
    height: 280px;
    border-radius: 50%;
    overflow: hidden;
    z-index: 10;
    border: 5px solid var(--white);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.block-hero-split__image::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(45, 52, 71, 0.4);
    border-radius: 50%;
}

.block-hero-split__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* ---------- BLOCK: PAGE BANNER ---------- */
.block-page-banner {
    position: relative;
    overflow: hidden;
    padding: var(--space-3xl) 0;
}

.block-page-banner.scheme-dark {
    background-color: var(--navy);
    color: var(--white);
}

.block-page-banner.scheme-dark::before {
    content: "";
    position: absolute;
    top: 0;
    left: 40px;
    width: 400px;
    height: 100%;
    background: url('../images/chevron-deco-navy.svg') no-repeat center / contain;
    pointer-events: none;
}

.block-page-banner.scheme-brand {
    background-color: var(--green);
    color: var(--navy);
}

.block-page-banner.scheme-brand::before {
    content: "";
    position: absolute;
    top: 0;
    left: 40px;
    width: 400px;
    height: 100%;
    background: url('../images/chevron-deco-green.svg') no-repeat center / contain;
    pointer-events: none;
}

.block-page-banner .container {
    position: relative;
    z-index: 1;
}

.block-page-banner__label {
    font-size: 0.875rem;
    margin-bottom: var(--space-sm);
}

.block-page-banner h1 {
    max-width: 800px;
}

.block-page-banner p {
    max-width: 700px;
    margin-top: var(--space-md);
}


/* ---------- BLOCK: SERVICE CARDS GRID ---------- */
.block-service-cards {
    padding: var(--space-4xl) 0;
}

.block-service-cards__grid {
    display: grid;
    gap: var(--space-xl);
    grid-template-columns: repeat(3, 1fr);
}

.block-service-cards__grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.block-service-cards__grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
.block-service-cards__grid--cols-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 1024px) {
    .block-service-cards__grid--cols-3,
    .block-service-cards__grid--cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 700px) {
    .block-service-cards__grid,
    .block-service-cards__grid--cols-2,
    .block-service-cards__grid--cols-3,
    .block-service-cards__grid--cols-4 {
        grid-template-columns: 1fr;
        gap: var(--space-2xl);
    }
}

.service-card h3 {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 1.125rem;
    color: var(--green);
    margin-bottom: var(--space-xs);
}

.service-card h4 {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 1rem;
    color: var(--navy);
    margin-bottom: var(--space-md);
}

/* When the navy subheading is absent, give the green heading more breathing room */
.service-card h3 + .brand-list {
    margin-top: var(--space-md);
}

.service-card .brand-list li {
    font-size: 0.9375rem;
    line-height: 1.5;
}

.service-card .brand-list li strong {
    color: var(--navy);
}

/* Optional CTA link/button below the bullets */
.service-card__link-wrap {
    margin-top: var(--space-md);
}

.service-card__chevron-link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-sm);
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--green-dark);
    text-decoration: none;
    transition: color var(--transition);
}

.service-card__chevron-link:hover {
    color: var(--navy);
}

.service-card__chevron-icon {
    display: inline-block;
    width: 0.85em;
    height: 0.7em;
    background: url('../images/arrow-green.svg') no-repeat center / contain;
}

.service-card__chevron-link:hover .service-card__chevron-icon {
    background-image: url('../images/arrow-navy.svg');
}


/* ---------- BLOCK: SPLIT SECTION ---------- */
.block-split {
    padding: var(--space-4xl) 0;
}

.block-split__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-3xl);
    align-items: start;
}

/* Image-right variant: swap visual order, image becomes second column */
.block-split--image-right .block-split__image {
    order: 2;
}

.block-split__image img {
    width: 100%;
    height: auto;
    border-radius: var(--radius-md);
}

.block-split__image--circle img {
    border-radius: 50%;
}

.block-split__content h2 {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 2rem;
    color: var(--green);
    margin-bottom: var(--space-lg);
}

.block-split__content p {
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: var(--space-md);
}

.block-split__content .you-get-label {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.9375rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--navy);
    margin-bottom: var(--space-md);
    margin-top: var(--space-xl);
}

.block-split__content .brand-list li {
    font-size: 0.9375rem;
    line-height: 1.6;
    margin-bottom: var(--space-md);
}

.block-split__content .brand-list li strong {
    color: var(--navy);
}


/* ---------- BLOCK: CTA BANNER ---------- */
.block-cta-banner {
    position: relative;
    overflow: hidden;
    padding: var(--space-3xl) 0;
}

.block-cta-banner.scheme-brand {
    background-color: var(--green);
    color: var(--navy);
}

.block-cta-banner.scheme-brand::before {
    content: "";
    position: absolute;
    top: 0;
    right: 60px;
    width: 450px;
    height: 100%;
    background: url('../images/chevron-deco-green.svg') no-repeat center / contain;
    pointer-events: none;
}

.block-cta-banner.scheme-dark {
    background-color: var(--navy);
    color: var(--white);
}

.block-cta-banner.scheme-dark::before {
    content: "";
    position: absolute;
    top: 0;
    right: 60px;
    width: 450px;
    height: 100%;
    background: url('../images/chevron-deco-navy.svg') no-repeat center / contain;
    pointer-events: none;
}

.block-cta-banner .container {
    position: relative;
    z-index: 1;
}

.block-cta-banner h2 {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 2rem;
    margin-bottom: var(--space-sm);
}

.block-cta-banner p {
    font-size: 1rem;
    margin-bottom: var(--space-lg);
    max-width: 500px;
}


/* ---------- BLOCK: ACCORDION / FAQ ---------- */
.block-accordion {
    padding: var(--space-4xl) 0;
}

.accordion-item {
    border-bottom: 1px solid var(--grey-100);
}

.accordion-item:first-child {
    border-top: 1px solid var(--grey-100);
}

.accordion-trigger {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: var(--space-lg) 0;
    background: none;
    border: none;
    cursor: pointer;
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 1.125rem;
    color: var(--navy);
    text-align: left;
    transition: color var(--transition);
}

.accordion-trigger:hover {
    color: var(--green-dark);
}

.accordion-trigger::after {
    content: "+";
    font-family: var(--font-condensed);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--green);
    transition: transform 0.3s ease;
    flex-shrink: 0;
    margin-left: var(--space-md);
}

.accordion-item.is-open .accordion-trigger::after {
    content: "−";
}

.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.accordion-content__inner {
    padding: 0 0 var(--space-lg) 0;
    font-size: 1rem;
    line-height: 1.7;
    color: var(--grey-800);
}

.accordion-content__inner p {
    margin-bottom: var(--space-md);
}

/* Chevron-styled lists inside accordion answers */
.accordion-content--chevrons ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: var(--space-md);
}

.accordion-content--chevrons ul li {
    position: relative;
    padding-left: 1.75em;
    margin-bottom: var(--space-sm);
    list-style: none;
}

.accordion-content--chevrons ul li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.35em;
    width: 0.85em;
    height: 0.7em;
    background: no-repeat center / contain;
}

.accordion-content--chevrons-green ul li::before {
    background-image: url('../images/arrow-green.svg');
}

.accordion-content--chevrons-navy ul li::before {
    background-image: url('../images/arrow-navy.svg');
}


/* ---------- BLOCK: HERO BANNER ---------- */
.block-hero-banner {
    position: relative;
    background-color: var(--navy);
    color: var(--white);
    --hero-overlay-alpha: 0.78;
}

.block-hero-banner__image {
    position: relative;
    min-height: 600px;
    background-color: var(--navy);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
}

.block-hero-banner__overlay {
    position: absolute;
    inset: 0;
    background-color: var(--navy);
    opacity: var(--hero-overlay-alpha);
}

.block-hero-banner__decoration {
    position: absolute;
    top: 0;
    right: 0;
    width: 500px;
    height: 100%;
    background: url('../images/chevron-deco-green.svg') no-repeat center / contain;
    opacity: 0.12;
    pointer-events: none;
}

.block-hero-banner__content {
    position: relative;
    z-index: 2;
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-4xl) var(--space-xl);
    text-align: center;
}

.block-hero-banner__title {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: clamp(2.25rem, 5vw, 3.75rem);
    line-height: 1.1;
    color: var(--white);
    margin-bottom: var(--space-xl);
}

.block-hero-banner__title span {
    display: block;
}

.block-hero-banner__title .accent {
    color: var(--green);
    display: inline;
}

.block-hero-banner__subtitle {
    font-size: 1.1875rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    margin: 0 auto var(--space-xl);
    max-width: 720px;
}

.block-hero-banner__cta {
    display: flex;
    gap: var(--space-md);
    justify-content: center;
    flex-wrap: wrap;
}

.block-hero-banner__body {
    background: var(--navy);
    color: var(--white);
    padding: var(--space-3xl) 0 var(--space-4xl);
}

.block-hero-banner__body-inner {
    max-width: 760px;
    margin: 0 auto;
    padding: 0 var(--space-xl);
}

.block-hero-banner__body p {
    font-size: 1rem;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: var(--space-lg);
}

.block-hero-banner__body p:last-child {
    margin-bottom: 0;
}


/* ---------- BLOCK: LATEST POSTS ---------- */
.block-latest-posts {
    padding: var(--space-4xl) 0;
}

.block-latest-posts .section-heading {
    text-align: center;
    margin-bottom: var(--space-2xl);
}

.block-latest-posts .section-heading__label {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--green-dark);
    margin-bottom: var(--space-sm);
}

.block-latest-posts .section-heading__title {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 2rem;
    color: var(--navy);
    margin-bottom: var(--space-md);
}

.block-latest-posts .section-heading__intro {
    max-width: 600px;
    margin: 0 auto;
    color: var(--grey-600);
}

.block-latest-posts .post-cards-grid {
    display: grid;
    gap: var(--space-xl);
}

.block-latest-posts__cta {
    text-align: center;
    margin-top: var(--space-2xl);
}


/* ---------- BLOCK: TESTIMONIALS CAROUSEL ---------- */
.block-testimonials {
    padding: var(--space-4xl) 0;
}

.block-testimonials__heading {
    text-align: center;
    margin-bottom: var(--space-2xl);
    color: var(--navy);
}

.testimonial-carousel {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
    padding: 0 var(--space-2xl);
}

.testimonial-carousel__icon {
    width: 64px;
    height: 64px;
    margin: 0 auto var(--space-lg);
    color: var(--navy);
    display: flex;
    align-items: center;
    justify-content: center;
}

.testimonial-carousel__icon svg {
    width: 100%;
    height: 100%;
}

.testimonial-carousel__track {
    position: relative;
    min-height: 180px;
}

.testimonial-carousel__slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease, visibility 0.5s ease;
    text-align: center;
}

.testimonial-carousel__slide.is-active {
    position: relative;
    opacity: 1;
    visibility: visible;
}

.testimonial-carousel__quote {
    font-size: 1.125rem;
    line-height: 1.7;
    font-style: italic;
    border: none;
    background: none;
    padding: 0;
    margin: 0 0 var(--space-xl);
    border-radius: 0;
}

/* Quote colour variants */
.testimonial-carousel__quote--navy  { color: var(--navy); }
.testimonial-carousel__quote--grey  { color: var(--grey-600); }
.testimonial-carousel__quote--green { color: var(--green-dark); }
.testimonial-carousel__quote--white { color: var(--white); }

.testimonial-carousel__attribution {
    font-size: 0.9375rem;
    line-height: 1.5;
}

.testimonial-carousel__author {
    font-weight: 700;
}

/* Author / position colour variants */
.testimonial-carousel__author--green,
.testimonial-carousel__position--green {
    color: var(--green-dark);
}

.testimonial-carousel__author--navy,
.testimonial-carousel__position--navy {
    color: var(--navy);
}

.testimonial-carousel__author--white,
.testimonial-carousel__position--white {
    color: var(--white);
}

.testimonial-carousel__position--grey {
    color: var(--grey-600);
}

/* Arrows */
.testimonial-carousel__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--space-sm);
    color: var(--navy);
    opacity: 0.5;
    transition: opacity var(--transition), color var(--transition);
    z-index: 2;
}

.testimonial-carousel__arrow:hover {
    opacity: 1;
    color: var(--green-dark);
}

.testimonial-carousel__arrow svg {
    width: 24px;
    height: 24px;
}

.testimonial-carousel__arrow--prev {
    left: 0;
}

.testimonial-carousel__arrow--next {
    right: 0;
}

.scheme-dark .testimonial-carousel__arrow {
    color: var(--white);
}

.scheme-dark .testimonial-carousel__arrow:hover {
    color: var(--green-light);
}

/* Dots */
.testimonial-carousel__dots {
    display: flex;
    justify-content: center;
    gap: var(--space-sm);
    margin-top: var(--space-xl);
}

.testimonial-carousel__dot {
    width: 12px;
    height: 12px;
    padding: 0;
    border-radius: 50%;
    background: transparent;
    border: 1.5px solid var(--grey-400);
    cursor: pointer;
    transition: all var(--transition);
}

.testimonial-carousel__dot:hover {
    border-color: var(--navy);
}

.testimonial-carousel__dot.is-active {
    background: var(--navy);
    border-color: var(--navy);
}

.scheme-dark .testimonial-carousel__dot {
    border-color: rgba(255, 255, 255, 0.4);
}

.scheme-dark .testimonial-carousel__dot.is-active {
    background: var(--green);
    border-color: var(--green);
}

/* Mobile */
@media (max-width: 768px) {
    .testimonial-carousel {
        padding: 0 var(--space-xl);
    }

    .testimonial-carousel__arrow {
        opacity: 0.8;
    }

    .testimonial-carousel__arrow svg {
        width: 20px;
        height: 20px;
    }

    .testimonial-carousel__quote {
        font-size: 1rem;
    }

    .testimonial-carousel__icon {
        width: 48px;
        height: 48px;
    }
}


/* ---------- BLOCK: SERVICE LINK CARDS ---------- */
.block-service-link-cards {
    padding: var(--space-4xl) 0;
}

.service-link-cards__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-xl);
}

.service-link-card {
    background: var(--white);
    border: 1px solid var(--grey-100);
    border-radius: var(--radius-md);
    overflow: hidden;
    transition: box-shadow var(--transition), transform var(--transition);
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
}

.service-link-card:hover {
    box-shadow: 0 8px 30px rgba(45, 52, 71, 0.1);
    transform: translateY(-4px);
    color: inherit;
}

.service-link-card__image {
    height: 220px;
    overflow: hidden;
    position: relative;
}

.service-link-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.service-link-card:hover .service-link-card__image img {
    transform: scale(1.05);
}

.service-link-card__image::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 80px;
    background: linear-gradient(transparent, rgba(45, 52, 71, 0.4));
}

.service-link-card__number {
    position: absolute;
    top: var(--space-md);
    left: var(--space-md);
    background: var(--green);
    color: var(--navy);
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.875rem;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.service-link-card__content {
    padding: var(--space-xl);
    flex: 1;
    display: flex;
    flex-direction: column;
}

.service-link-card__category {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--green);
    margin-bottom: var(--space-xs);
}

.service-link-card__title {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 1.375rem;
    color: var(--navy);
    margin-bottom: var(--space-md);
    line-height: 1.25;
}

.service-link-card__desc {
    font-size: 0.9375rem;
    line-height: 1.6;
    color: var(--grey-600);
    margin-bottom: var(--space-lg);
    flex: 1;
}

.service-link-card__cta {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--green-dark);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: var(--space-sm);
    transition: color var(--transition);
}

.service-link-card:hover .service-link-card__cta {
    color: var(--navy);
}

.service-link-card__cta svg {
    width: 14px;
    height: 12px;
}


/* ---------- BLOCK: CONTACT ---------- */
.block-contact {
    padding: var(--space-4xl) 0;
}

.block-contact__grid {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: var(--space-3xl);
    align-items: start;
}

/* Form on left = swap order via grid */
.block-contact--form-left .block-contact__grid {
    grid-template-columns: 1.4fr 1fr;
}

.block-contact--form-left .block-contact__form {
    order: -1;
}

.block-contact__heading {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 1.5rem;
    color: var(--navy);
    margin-bottom: var(--space-md);
}

.block-contact__intro {
    font-size: 1rem;
    line-height: 1.7;
    color: var(--grey-800);
    margin-bottom: var(--space-lg);
}

.block-contact__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.block-contact__item {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    padding: var(--space-sm) 0;
    font-size: 0.9375rem;
    color: var(--grey-800);
    list-style: none;
}

.block-contact__item a {
    color: var(--navy);
    text-decoration: none;
    transition: color var(--transition);
}

.block-contact__item a:hover {
    color: var(--green-dark);
}

.block-contact__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background-color: var(--green);
    color: var(--navy);
    border-radius: 50%;
    flex-shrink: 0;
}

.block-contact__icon svg {
    width: 18px;
    height: 18px;
}

/* Dark scheme adjustments */
.block-contact.scheme-dark .block-contact__heading,
.block-contact.scheme-dark .block-contact__intro,
.block-contact.scheme-dark .block-contact__item {
    color: var(--white);
}

.block-contact.scheme-dark .block-contact__item a {
    color: var(--white);
}

.block-contact.scheme-dark .block-contact__item a:hover {
    color: var(--green-light);
}

/* Mobile */
@media (max-width: 768px) {
    .block-contact__grid,
    .block-contact--form-left .block-contact__grid {
        grid-template-columns: 1fr;
        gap: var(--space-xl);
    }

    .block-contact--form-left .block-contact__form {
        order: 0;
    }
}


/* ---------- BLOCK: CONTAINER ---------- */
.block-container {
    position: relative;
}

.block-container__inner {
    margin: 0 auto;
    padding: 0 var(--space-xl);
    width: 100%;
}

.block-container__inner--narrow  { max-width: 800px; }
.block-container__inner--default { max-width: var(--container-max); }
.block-container__inner--wide    { max-width: 1280px; }
.block-container__inner--full    { max-width: none; padding: 0; }

/* Backgrounds */
.block-container--bg-transparent  { background-color: transparent; }
.block-container--bg-white        { background-color: var(--white); }
.block-container--bg-off-white    { background-color: var(--off-white); }
.block-container--bg-navy         { background-color: var(--navy); color: var(--white); }
.block-container--bg-navy-light   { background-color: var(--navy-light); color: var(--white); }
.block-container--bg-green        { background-color: var(--green); color: var(--navy); }
.block-container--bg-green-light  { background-color: var(--green-light); color: var(--navy); }

/* Text colour overrides */
.block-container--fg-navy       { color: var(--navy); }
.block-container--fg-white      { color: var(--white); }
.block-container--fg-grey       { color: var(--grey-800); }
.block-container--fg-green-dark { color: var(--green-dark); }

/* Dark backgrounds — invert link + heading colours automatically */
.block-container--bg-navy a:not(.btn),
.block-container--bg-navy-light a:not(.btn) {
    color: var(--green-light);
}

.block-container--bg-navy a:not(.btn):hover,
.block-container--bg-navy-light a:not(.btn):hover {
    color: var(--white);
}

/* Text alignment */
.block-container--align-left   { text-align: left; }
.block-container--align-center { text-align: center; }
.block-container--align-right  { text-align: right; }


/* ---------- CARDS (generic) ---------- */
.card {
    background: var(--white);
    border: 1px solid var(--grey-100);
    border-radius: var(--radius-md);
    padding: var(--space-xl);
    transition: box-shadow var(--transition);
}

.card:hover {
    box-shadow: 0 4px 20px rgba(45, 52, 71, 0.08);
}

.card-accent {
    border-top: 3px solid var(--green);
}


/* ---------- TABLES ---------- */
table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: var(--space-lg);
    font-size: 0.9375rem;
}

th {
    font-family: var(--font-condensed);
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.8125rem;
    padding: var(--space-sm) var(--space-md);
    background-color: var(--navy);
    color: var(--white);
}

td {
    padding: var(--space-sm) var(--space-md);
    border-bottom: 1px solid var(--grey-100);
}

tr:hover td {
    background-color: var(--off-white);
}


/* ---------- DIVIDERS ---------- */
hr {
    border: none;
    height: 1px;
    background-color: var(--grey-100);
    margin: var(--space-xl) 0;
}

hr.accent {
    height: 3px;
    background-color: var(--green);
    max-width: 60px;
}


/* ---------- FOOTER ---------- */
.site-footer {
    background-color: var(--navy);
    color: var(--white);
    padding: var(--space-3xl) 0 var(--space-xl);
}

.footer__grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: var(--space-xl);
    margin-bottom: var(--space-2xl);
}

.footer__column .custom-logo {
    max-height: 40px;
    width: auto;
    margin-bottom: var(--space-md);
}

.footer-widget {
    margin-bottom: var(--space-lg);
}

.footer__heading {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--white);
    margin-bottom: var(--space-md);
}

.site-footer .widget_nav_menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.site-footer .widget_nav_menu ul li {
    list-style: none;
    margin: 0 0 var(--space-sm) 0;
    padding: 0;
}

.site-footer .widget_nav_menu a,
.site-footer a {
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    transition: color var(--transition);
}

.site-footer a:hover {
    color: var(--green-light);
}

.site-footer p {
    font-size: 0.875rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.7);
}

.footer__bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: var(--space-lg);
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.8125rem;
    color: rgba(255, 255, 255, 0.5);
}

.footer__bottom a {
    color: rgba(255, 255, 255, 0.5);
}

.footer__bottom a:hover {
    color: var(--green-light);
}

/* Powered by Zonkey */
.powered-by-zonkey {
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.4);
    text-decoration: none;
}

.powered-by-zonkey:hover {
    color: rgba(255, 255, 255, 0.6);
}

.powered-by-zonkey__logo {
    height: 16px;
    width: auto;
}


/* ---------- BLOG / ARCHIVE ---------- */
.blog-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-xl);
    padding: var(--space-4xl) 0;
}

.blog-layout--with-sidebar {
    grid-template-columns: 1fr 300px;
}

.post-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: var(--space-xl);
}

/* Latest Posts block uses explicit column count via modifier */
.post-cards-grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.post-cards-grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
.post-cards-grid--cols-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 1024px) {
    .post-cards-grid--cols-3,
    .post-cards-grid--cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 700px) {
    .post-cards-grid,
    .post-cards-grid--cols-2,
    .post-cards-grid--cols-3,
    .post-cards-grid--cols-4 {
        grid-template-columns: 1fr;
    }
}

.post-card {
    background: var(--white);
    border: 1px solid var(--grey-100);
    border-radius: var(--radius-md);
    overflow: hidden;
    transition: box-shadow var(--transition);
}

.post-card:hover {
    box-shadow: 0 4px 20px rgba(45, 52, 71, 0.08);
}

.post-card__image {
    aspect-ratio: 16 / 10;
    overflow: hidden;
}

.post-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.post-card:hover .post-card__image img {
    transform: scale(1.03);
}

.post-card__content {
    padding: var(--space-lg);
}

.post-card__meta {
    font-size: 0.75rem;
    color: var(--grey-400);
    margin-bottom: var(--space-sm);
}

.post-card__title {
    font-family: var(--font-primary);
    font-weight: 700;
    font-size: 1.125rem;
    color: var(--navy);
    margin-bottom: var(--space-sm);
}

.post-card__title a {
    color: var(--navy);
    text-decoration: none;
}

.post-card__title a:hover {
    color: var(--green-dark);
}

.post-card__excerpt {
    font-size: 0.9375rem;
    line-height: 1.6;
    color: var(--grey-600);
    margin-bottom: var(--space-md);
}

.post-card__link {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--green-dark);
    text-decoration: none;
}

.post-card__link:hover {
    color: var(--navy);
}


/* ---------- SINGLE POST ---------- */
.single-post {
    min-width: 0; /* allow grid item to shrink */
}

.single-post__header {
    padding: 0 0 var(--space-lg);
}

.single-post__meta {
    font-size: 0.8125rem;
    color: var(--grey-400);
    margin-bottom: var(--space-sm);
}

.single-post__title {
    font-size: 2.25rem;
    color: var(--navy);
    margin-bottom: var(--space-md);
}

.single-post__featured {
    margin-bottom: var(--space-xl);
}

.single-post__featured img {
    width: 100%;
    height: auto;
    border-radius: var(--radius-md);
}

.single-post__content {
    margin-bottom: var(--space-xl);
}

.single-post__content p {
    font-size: 1.0625rem;
    line-height: 1.8;
    margin-bottom: var(--space-lg);
}

.single-post__content h2 {
    color: var(--navy);
    margin-top: var(--space-2xl);
    margin-bottom: var(--space-md);
}

.single-post__content h3 {
    color: var(--navy);
    margin-top: var(--space-xl);
    margin-bottom: var(--space-sm);
}

.single-post__content ul,
.single-post__content ol {
    padding-left: 1.5em;
    margin-bottom: var(--space-lg);
}

.single-post__content li {
    list-style: disc;
    margin-bottom: var(--space-xs);
    font-size: 1.0625rem;
    line-height: 1.7;
}

.single-post__content ol li {
    list-style: decimal;
}

.single-post__content img {
    border-radius: var(--radius-md);
    margin: var(--space-xl) 0;
}

.single-post__nav {
    display: flex;
    justify-content: space-between;
    gap: var(--space-md);
    padding: var(--space-xl) 0;
    border-top: 1px solid var(--grey-100);
}


/* ---------- SEARCH ---------- */
.search-header {
    padding: var(--space-3xl) 0;
    background-color: var(--off-white);
}

.search-header h1 {
    color: var(--navy);
    margin-bottom: var(--space-md);
}

.search-header__count {
    font-size: 0.9375rem;
    color: var(--grey-600);
    margin-bottom: var(--space-lg);
}

.search-results-list {
    padding: var(--space-2xl) 0 var(--space-4xl);
}

.search-no-results {
    padding: var(--space-3xl) 0;
    text-align: center;
    max-width: 560px;
    margin: 0 auto;
}

.search-no-results h2 {
    color: var(--navy);
    margin-bottom: var(--space-md);
}

.search-no-results p {
    color: var(--grey-600);
    margin-bottom: var(--space-xl);
}

.search-form {
    display: flex;
    gap: var(--space-sm);
    max-width: 500px;
}

.search-form .search-field {
    flex: 1;
    font-family: var(--font-primary);
    font-size: 1rem;
    padding: 0.625em 0.875em;
    border: 1px solid var(--grey-200);
    border-radius: var(--radius-sm);
}

.search-form .search-field:focus {
    outline: none;
    border-color: var(--green);
    box-shadow: 0 0 0 3px rgba(171, 180, 67, 0.2);
}

.search-form .search-submit {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.625em 1.5em;
    background-color: var(--navy);
    color: var(--white);
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: background-color var(--transition);
}

.search-form .search-submit:hover {
    background-color: var(--navy-light);
}


/* ---------- 404 ---------- */
.error-404 {
    text-align: center;
    padding: var(--space-4xl) 0;
}

.error-404 h1 {
    font-size: 6rem;
    color: var(--green);
    margin-bottom: var(--space-md);
}

.error-404 h2 {
    color: var(--navy);
    margin-bottom: var(--space-lg);
}

.error-404 p {
    max-width: 500px;
    margin: 0 auto var(--space-xl);
}


/* ---------- PAGINATION ---------- */
.pagination {
    display: flex;
    justify-content: center;
    gap: var(--space-xs);
    padding: var(--space-xl) 0;
}

.pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 var(--space-sm);
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--navy);
    text-decoration: none;
    border: 1px solid var(--grey-200);
    border-radius: var(--radius-sm);
    transition: all var(--transition);
}

.pagination .page-numbers:hover {
    background-color: var(--off-white);
    border-color: var(--navy);
}

.pagination .page-numbers.current {
    background-color: var(--navy);
    border-color: var(--navy);
    color: var(--white);
}


/* ---------- WIDGETS ---------- */
.widget {
    margin-bottom: var(--space-xl);
}

.widget__title {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--navy);
    margin-bottom: var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 2px solid var(--green);
}

.widget ul {
    list-style: none;
    padding: 0;
}

.widget ul li {
    margin-bottom: var(--space-sm);
    padding-bottom: var(--space-sm);
    border-bottom: 1px solid var(--grey-100);
}

.widget ul li a {
    color: var(--grey-800);
    text-decoration: none;
    font-size: 0.9375rem;
}

.widget ul li a:hover {
    color: var(--green-dark);
}


/* ---------- GRAVITY FORMS ---------- */
.gform_wrapper .gfield {
    margin-bottom: var(--space-md);
}

.gform_wrapper .gfield_label {
    font-weight: 700;
    font-size: 0.875rem;
    color: var(--navy);
    margin-bottom: var(--space-xs);
}

.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="url"],
.gform_wrapper textarea,
.gform_wrapper select {
    width: 100%;
    font-family: var(--font-primary);
    font-size: 1rem;
    padding: 0.625em 0.875em;
    border: 1px solid var(--grey-200);
    border-radius: var(--radius-sm);
    background-color: var(--white);
    color: var(--grey-800);
    transition: border-color var(--transition), box-shadow var(--transition);
}

.gform_wrapper input:focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus {
    outline: none;
    border-color: var(--green);
    box-shadow: 0 0 0 3px rgba(171, 180, 67, 0.2);
}

.gform_wrapper .gform_button {
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 0.9375rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.75em 1.75em;
    background-color: var(--green);
    color: var(--navy);
    border: 2px solid var(--green);
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: all var(--transition);
}

.gform_wrapper .gform_button:hover {
    background-color: var(--green-dark);
    border-color: var(--green-dark);
    color: var(--white);
}


/* ---------- RESPONSIVE ---------- */
@media (max-width: 1024px) {
    .nav-hamburger {
        display: block;
    }

    .header__nav {
        display: none;
    }

    /* Hide header search — moved into mobile menu */
    .header__search-toggle {
        display: none;
    }

    .service-link-cards__grid {
        grid-template-columns: 1fr 1fr;
    }

    .block-service-cards__grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 768px) {
    :root {
        --nav-height: 60px;
        --space-4xl: 3rem;
        --space-3xl: 2.5rem;
    }

    h1, .h1 { font-size: 2rem; }
    h2, .h2 { font-size: 1.5rem; }

    .block-hero-split__green h1 {
        font-size: 2rem;
    }

    .block-hero-split__green::before {
        width: 280px;
        left: -20px;
    }

    .block-hero-split__image {
        display: none;
    }

    .block-service-cards__grid {
        grid-template-columns: 1fr;
        gap: var(--space-2xl);
    }

    .service-link-cards__grid {
        grid-template-columns: 1fr;
    }

    .block-hero-banner__image {
        min-height: 460px;
    }

    .block-hero-banner__decoration {
        width: 280px;
        opacity: 0.1;
    }

    .block-split__grid {
        grid-template-columns: 1fr;
        gap: var(--space-xl);
    }

    .footer__grid {
        grid-template-columns: 1fr 1fr;
    }

    .footer__bottom {
        flex-direction: column;
        gap: var(--space-sm);
        text-align: center;
    }

    .blog-layout--with-sidebar {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .footer__grid {
        grid-template-columns: 1fr;
    }
}
