/*
Theme Name: Dejana 2026
Author: FirstTracks Marketing
Author URI: https://firsttracksmarketing.com
Description: FirstTracks site theme generated from the firsttracks-theme seed. Brand it via theme.json and the brand CSS layer.
Requires at least: 6.5
Requires PHP: 8.2
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dejana-2026
Requires Plugins: ftm-blocks
FTM Blocks API: 1
Tags: 2026 dejana
*/

/* ==============================
   BEGIN - Global styles
   =========================== */
:root {

   /* Base */
   --color-black: #111827;
   --color-white: #FFF;

   /* Color / Primary */
   --color-primary-50: #C8DCEE;
   --color-primary-100: #9BC2E4;
   --color-primary-200: #6FA7DA;
   --color-primary-300: #448BCE;
   --color-primary-400: #3170AB;
   --color-primary-500: #105395;
   --color-primary-600: #0E4682;
   --color-primary-700: #0C3A71;
   --color-primary-800: #0A2F5D;
   --color-primary-900: #07244C;

   /* Color / Secondary */
   --color-secondary-50: #B3ECFF;
   --color-secondary-100: #80E0FF;
   --color-secondary-200: #4DD5FF;
   --color-secondary-300: #1ACAFF;
   --color-secondary-400: #00ABE6;
   --color-secondary-500: #0082B3;
   --color-secondary-600: #13627F;
   --color-secondary-700: #114D60;
   --color-secondary-800: #083749;
   --color-secondary-900: #002730;

   /* Color / Tertiary */
   --color-tertiary-50: #FBFDFE;
   --color-tertiary-100: #C9E6EF;
   --color-tertiary-200: #95CFE1;
   --color-tertiary-300: #62B8D3;
   --color-tertiary-400: #28A1CC;
   --color-tertiary-500: #0082B3;
   --color-tertiary-600: #006990;
   --color-tertiary-700: #00506E;
   --color-tertiary-800: #00364B;
   --color-tertiary-900: #001F29;

   /* Color / Error */
   --color-error-50: #FEF2F2;
   --color-error-100: #FEE2E2;
   --color-error-200: #FECACA;
   --color-error-300: #FCA5A5;
   --color-error-400: #F87171;
   --color-error-500: #EF4444;
   --color-error-600: #DC2626;
   --color-error-700: #B91C1C;
   --color-error-800: #991B1B;
   --color-error-900: #7F1D1D;

   /* Color / Warning */
   --color-warning-50: #FFF7E9;
}

/* ==============================
   END - Global styles
   =========================== */

h1,
h2,
h3,
h4,
h5,
h1.wp-block-heading,
h2.wp-block-heading,
h3.wp-block-heading,
h4.wp-block-heading,
h5.wp-block-heading {
    font-family: var(--wp--preset--font-family--display, 'Saira SemiCondensed'), sans-serif;
    font-weight: 700;
}

/* Global Spacer styles - based on design */
@media (max-width: 767px) {

  .dj-spacer {
    height: 53px !important;
  }
}


/*************************************************
 * Header / Navigation - Dejana (v1)
 *************************************************/

header .is-header-top > .wp-block-group,
header .is-header-navigation > .wp-block-group {
    margin-inline: auto;
    max-width: 1680px;
    padding: 0 2.5rem;
}

header .is-header-top > .wp-block-group {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
    padding: 0.5rem 2.5rem;
}

header .is-header-navigation > .wp-block-group {
    padding: 1rem;
}

/* ---------- Header Top (Utility Bar) ---------- */

.is-header-top {
    background-color: var(--color-black);
    padding: 0.5rem 0;
}

.is-header-top-inner {
    padding: 0 2.5rem;
}

.is-header-phone a,
.is-header-top-links a {
    color: var(--color-white);
    display: flex;
    gap: 0.5rem;
    font-size: 0.875rem;
    /* stylelint-disable-next-line declaration-property-unit-allowed-list -- existing rem line-height; a unitless value would change rendering. */
    line-height: 1.25rem;
    text-decoration: none;
}

.is-header-phone a:hover,
.is-header-top-links a:hover {
    color: var(--color-secondary-200);
}

.is-header-top-links {
    gap: 1.5rem;
}

.is-header-top-links p {
    margin: 0;
}

.is-header-phone {
    margin: 0;
}

/* ---------- Primary Navigation Row ---------- */

.is-header-navigation {
    background-color: var(--color-white);
    border-bottom: 1px solid #e5e7eb;
    box-shadow: 0 0 1px 0 rgb(48 49 51 / 5%), 0 2px 4px 0 rgb(48 49 51 / 10%);
    position: relative;
    z-index: 9500;
}

.is-header-navigation-inner {
    gap: 1.5rem;
    padding: 0 2.5rem;
}

header.wp-block-template-part {
    position: relative;
    z-index: 9500;
}

/* The single, search, 404 and index templates wrap their content in a main group
   (templates/*.html). It used to be a template part, which has no .wp-block-group
   text colour, so it keeps inheriting the page colour. */
main.dj-main-content {
    color: inherit;
}

/* ---------- Logo ---------- */

.is-header-brand {
    flex: 0 0 auto;
}

.is-header-brand .wp-block-site-logo img {
    display: block;
    height: auto;
    max-width: 160px;
}

/* ---------- Center Menu (Desktop) ---------- */

.is-header-primary-menu {
    flex: 1 1 auto;
    justify-content: center;
}

.is-header-primary-menu .wp-block-navigation__container {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    gap: 1.5rem;
    margin: 0;
    padding: 0;
}

.is-header-primary-menu .wp-block-navigation-item__content {
    text-decoration: none;
    color: var(--color-black);
    font-size: 0.9375rem;
    /* stylelint-disable-next-line declaration-property-unit-allowed-list -- existing rem line-height; a unitless value would change rendering. */
    line-height: 1.5rem;
    font-weight: 500;
}

.is-header-primary-menu .wp-block-navigation-item__content:hover,
.is-header-primary-menu .wp-block-navigation-item.is-active > .wp-block-navigation-item__content,
.is-header-primary-menu .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.is-header-primary-menu .wp-block-navigation-item.open-on-click > .wp-block-navigation-item__content {
    color: var(--color-primary-500);
}

/* .is-header-primary-menu .wp-block-navigation__container > li.wp-block-navigation-item {

    padding: 1.25rem 0;
} */

/* ---------- Dropdown Menus ---------- */

.is-header-primary-menu .wp-block-navigation__submenu-container {
    background: var(--color-white);
    border: none;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgb(0 0 0 / 12%);
    min-width: 225px !important;
    padding: 1rem 0.5rem;
}

.is-header-primary-menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    padding: 0.5rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 400;
    color: var(--color-black);
    white-space: nowrap;
}

.is-header-primary-menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
    color: var(--color-primary-500);
    background: transparent;
}

/* ---------- Utilities (Desktop Right) ---------- */

.is-header-utilities {
    flex: 0 0 auto;
    gap: 1rem;
    align-items: center;
}

.is-header-icons {
    gap: 1rem;
    align-items: center;

    /*border-right: 1px solid #e5e7eb;
    padding-right: 1rem;*/
    margin-right: 0.5rem;
}

.is-header-account-icon,
.is-header-search-icon {
    margin: 0;
    line-height: 1;
}

.is-header-account-icon a,
.is-header-search-icon a {
    display: flex;
    align-items: center;
    color: var(--color-black);
    text-decoration: none;
}

.is-header-account-icon a:hover,
.is-header-search-icon a:hover {
    color: var(--color-primary-500);
}

/* ---------- Get Quote Button ---------- */

.is-header-cta .wp-block-button__link {
    background-color: var(--color-white);
    border: 2px solid var(--color-primary-500);
    border-radius: 0;
    color: var(--color-primary-500);
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 0.9375rem;
    font-weight: 400;
    padding: 0.5rem 1rem;
}

.is-header-cta .wp-block-button__link:hover {
    background-color: var(--color-primary-600);
    color: var(--color-white);
}

/* ---------- Mobile Panel ---------- */

.is-header-mobile-panel {
    display: none !important;
}

/* Dedicated mobile-nav region (hamburger block). Hidden on desktop;
   shown at <= 1099px by the tablet/mobile media query below. */
.is-header-mobile-nav {
    display: none;
    flex: 0 0 auto;
    align-items: center;
}

/* ---------- Navigation Overlay ---------- */

body.navigation-open {
    overflow: hidden;
}

.wp-block-navigation__responsive-container.is-menu-open {

    /* position: fixed; */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9000;
    background: var(--color-white);
    overflow-y: auto;
}

.wp-block-navigation__responsive-container-close {
    position: fixed;
    right: 1rem;
    top: 0;
    height: 176px;
    z-index: 10000;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--color-black);
    padding: 0.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.wp-block-navigation__responsive-container-close {
    display: none !important;
}

.wp-block-navigation__responsive-container-close:hover {
    color: var(--color-primary-500);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
    width: 100%;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
    padding: 0.875rem 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-black);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover {
    color: var(--color-primary-500);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
    display: none;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-icon[aria-expanded="true"] + .wp-block-navigation__submenu-container {
    display: flex;
    flex-direction: column;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
    box-shadow: none;
    border: none;
    padding: 0 0 0.5rem 1rem;
    background: transparent;
    position: static;
    width: 100%;
    visibility: visible;
    opacity: 1;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    font-size: 0.9375rem;
    font-weight: 400;
    padding: 0.4rem 0;
    border: none;
    color: #374151;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon {
    display: flex !important;
    margin-left: auto;
}

/* ---------- Injected Mobile Panel ---------- */

.dejana-nav-injected {
    width: 100%;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.dejana-nav-injected .is-header-mobile-links {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 1rem;
}

.dejana-nav-injected .is-header-mobile-links p {
    margin: 0 !important;
    padding: 0.875rem 0;
    font-size: 1rem;
    font-weight: 700;
    /* stylelint-disable-next-line declaration-property-unit-allowed-list -- existing rem line-height; a unitless value would change rendering. */
    line-height: 1.5rem;
}

.dejana-nav-injected .is-header-mobile-links a {
    color: var(--color-black);
    text-decoration: none;
}

.dejana-nav-injected .is-header-mobile-links a:hover {
    color: var(--color-primary-500);
}

/* ---------- Responsive ---------- */

/* Tablet and down */
@media (width <= 1099px) {

    header .is-header-top {
        display: none;
    }

    .is-header-top-inner {
        padding: 0 1rem;
    }

    .is-header-top-links {
        display: none;
    }

    .is-header-navigation-inner {
        gap: 1rem;
        padding: 1rem 2.5rem;
    }

    .is-header-primary-menu.wp-block-group {
        order: 3;
        flex: 0 0 auto;
    }

    /* Desktop inline menu is hidden on tablet/mobile; the dedicated
       .is-header-mobile-nav region (hamburger block) takes over. */
    /* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
    .is-header-primary-menu.wp-block-group {
        display: none !important;
    }

    .is-header-mobile-nav {
        display: flex !important;
    }

    .is-header-icons {
        border-right: none;
        padding-right: 0;
        margin-right: 0;
    }

    .wp-block-navigation__responsive-container-close {
        height: 110px;
    }

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-icon[aria-expanded="true"] + .wp-block-navigation__submenu-container {
        gap: 1rem;
        padding: 1rem 0;
    }

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-icon[aria-expanded="true"] + .wp-block-navigation__submenu-container a.wp-block-navigation-item__content {
        padding: 0;
    }

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
        display: inline;
    }

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon {
        display: inline-flex !important;
        margin-left: 0.5rem;
    }

    .is-header-primary-menu .wp-block-navigation-item__label {
        font-weight: 700;
    }

    .is-header-primary-menu ul li ul li span.wp-block-navigation-item__label {
        font-size: 0.875rem;
        font-weight: 500;
        /* stylelint-disable-next-line declaration-property-unit-allowed-list -- existing rem line-height; a unitless value would change rendering. */
        line-height: 1.25rem;
    }

    .wp-block-navigation__responsive-container-content {
        padding: 2rem 2.5rem;
    }
}

/* Mobile */
@media (width <= 767px) {

    .is-header-navigation-inner {
        padding: 0.625rem 1rem;
    }

    .is-header-navigation-inner .is-header-brand {
        margin-right: auto;
        max-width: 112px;
    }

    .is-header-primary-menu.wp-block-group {
        margin-left: 1rem;
    }

    .wp-block-navigation__responsive-container-close {
        height: 80px;
    }

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
        padding: 0 !important;
        align-items: flex-start;
    }

    .is-header-cta-wrapper {
        display: none !important;
    }
}

/* Tablet & Up */
@media (width >= 768px) {

    header .is-header-navigation > .wp-block-group {
        padding: 1.5rem 2.5rem;
    }
}

/* Tablet only */
@media (768px <= width <= 1099px) {

    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
        padding: 0.5rem 1.5rem !important;
    }

    .is-header-navigation-inner .is-header-brand {
        margin-right: auto;
        max-width: 160px;
    }

    .is-header-navigation-inner .is-header-primary-menu.wp-block-group {
        margin-left: 1.5rem;
    }
}

/* Desktop */
@media (width > 1100px) {

    header .is-header-top > .wp-block-group {
        gap: 2rem;
        justify-content: flex-end;
    }

    .is-header-top-inner > div.wp-block-group {
        gap: 2rem;
    }

    .wp-block-navigation__responsive-container {
        display: block;
        position: inherit;
    }

    .is-header-mobile-panel {
        display: none !important;
    }

    .dejana-nav-injected {
        display: none !important;
    }

    .wp-block-navigation__responsive-container-open {
        display: none !important;
    }
}

/* Phone */
@media (width <= 600px) {

    .is-header-brand .wp-block-site-logo img {
        max-width: 120px;
        height: auto;
    }

    .is-header-cta .wp-block-button__link {
        padding: 0.45rem 0.85rem;
        font-size: 0.875rem;
    }
}


/* =========================================================
   BREAKPOINT FIX
   The hamburger block style.css uses 1024/1025px but the
   header CSS uses 1099/1100px as the desktop breakpoint.
   These overrides align the hamburger to the correct value
   so there is no gap between 1025px–1099px where both
   the desktop nav and hamburger could appear simultaneously.
   ========================================================= */

@media (width >= 1100px) {

    .firsttracks-hamburger-menu {
        display: none !important;
    }
}

@media (width > 1099px) {

    /* Ensure desktop nav is always visible at 1100px+ */
    .is-header-primary-menu .wp-block-navigation__responsive-container {
        display: block !important;
        position: static !important;
    }

    .is-header-primary-menu .wp-block-navigation__responsive-container-open {
        display: none !important;
    }
}


/* =========================================================
   1. MEGA-MENU PANEL — Desktop only (> 1099px)
   =========================================================
   How it works:
   - <div id="mega-{slug}" class="dejana-mega-panel"> elements sit as
     direct children of .is-header-navigation in the FSE template,
     added as Custom HTML blocks after the .is-header-navigation-inner group.
   - JS adds .is-mega-open to the matching panel when a mapped nav item
     is hovered/clicked, and .mega-active to the nav item itself.
   - body.mega-menu-open triggers the dim overlay via body::after.
   ========================================================= */

.dejana-mega-panel {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 9400;
    background: var(--color-white);
    border-top: 1px solid #e5e7eb;
    box-shadow: 0 8px 32px rgb(0 0 0 / 14%);
    padding: 2.5rem 0;

    /* Hidden state */
    visibility: hidden;
    opacity: 0;
    transform: translateY(-6px);
    transition:
        opacity 0.18s ease,
        transform 0.18s ease,
        visibility 0s linear 0.18s;
    pointer-events: none;
}

.dejana-mega-panel.is-mega-open {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    transition:
        opacity 0.18s ease,
        transform 0.18s ease,
        visibility 0s linear 0s;
    pointer-events: auto;
}

/* Constrained inner width matches the rest of the header */
.dejana-mega-panel__inner {
    margin-inline: auto;
    max-width: 1680px;
    padding: 0 2.5rem;
}

/* Image grid — column count set via modifier class */
.dejana-mega-panel__grid {
    display: grid;
    gap: 1.5rem 1.25rem;
    grid-template-columns: repeat(5, 1fr); /* default */
}

.dejana-mega-panel__grid.is-4-col { grid-template-columns: repeat(4, 1fr); }

.dejana-mega-panel__grid.is-5-col { grid-template-columns: repeat(5, 1fr); }

.dejana-mega-panel__grid.is-6-col { grid-template-columns: repeat(6, 1fr); }

/* Individual item */
.dejana-mega-item {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    text-decoration: none;
    color: var(--color-black);
}

.dejana-mega-item:hover .dejana-mega-item__label {
    color: var(--color-primary-500);
}

/* Fixed 4:3 image thumbnail */
.dejana-mega-item__img-wrap {
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.dejana-mega-item__img-wrap img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.dejana-mega-item:hover .dejana-mega-item__img-wrap img {
    transform: scale(1.04);
}

.dejana-mega-item__label {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.35;
    transition: color 0.15s ease;
}

/* "View All" footer row */
.dejana-mega-panel__footer {
    margin-top: 2rem;
}

.dejana-mega-panel__view-all {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--color-primary-500);
    text-decoration: none;
}

.dejana-mega-panel__view-all:hover {
    color: var(--color-primary-700);
    text-decoration: underline;
}

.dejana-mega-panel__view-all svg {
    flex-shrink: 0;
    transition: transform 0.15s ease;
}

.dejana-mega-panel__view-all:hover svg {
    transform: translate(2px, -2px);
}

/* Page dim overlay — shown when any mega panel is open */
body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 9300;
    background: rgb(0 0 0 / 45%);
    opacity: 0;
    visibility: hidden;
    transition:
        opacity 0.2s ease,
        visibility 0s linear 0.2s;
    pointer-events: none;
}

body.mega-menu-open::after {
    opacity: 1;
    visibility: visible;
    transition:
        opacity 0.2s ease,
        visibility 0s linear 0s;
    pointer-events: auto;
}

/* Highlight the active top-level nav item */
.is-header-primary-menu .wp-block-navigation-item.mega-active
> .wp-block-navigation-item__content {
    color: var(--color-primary-500);
}

/* Suppress WP's built-in dropdown arrow + submenu for mega items */
.is-header-primary-menu .wp-block-navigation-item.has-mega-menu
> .wp-block-navigation__submenu-container {
    display: none !important;
}

.is-header-primary-menu .wp-block-navigation-item.has-mega-menu
> .wp-block-navigation-item__content
.wp-block-navigation__submenu-icon {
    display: none !important;
}

/* Clickable chevron toggle for mega-menu nav items (desktop).
   header-navigation.js injects a real <button class="dejana-mega-toggle"> after
   the label link. It must be a real element (not a ::after pseudo-element) so it
   can receive its own click, separate from the label link, which still navigates
   to its category page. The chevron rotates when the panel is open (.mega-active). */
@media (width > 1099px) {

    .is-header-primary-menu .wp-block-navigation-item.has-mega-menu {
        display: flex;
        align-items: center;
    }

    .is-header-primary-menu .wp-block-navigation-item.has-mega-menu
    > .wp-block-navigation-item__content {
        padding-right: 0.15rem;
    }

    .dejana-mega-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0.125rem;
        margin: 0;
        background: none;
        border: none;
        cursor: pointer;
        color: var(--color-black);
        line-height: 0;
        transition: color 0.15s ease;
    }

    .dejana-mega-toggle svg {
        display: block;
        width: 1em;
        height: 1em;
        transition: transform 0.2s ease;
    }

    .dejana-mega-toggle:hover,
    .is-header-primary-menu .wp-block-navigation-item.has-mega-menu.mega-active
    .dejana-mega-toggle {
        color: var(--color-primary-500);
    }

    .is-header-primary-menu .wp-block-navigation-item.has-mega-menu.mega-active
    .dejana-mega-toggle svg {
        transform: rotate(180deg);
    }
}

/* Hide mega panels entirely on tablet/mobile — overlay handles navigation there */
@media (width <= 1099px) {

    .dejana-mega-panel {
        display: none !important;
    }
}


/* =========================================================
   Header - Extended Styles
   ====================================================== */
 @media (min-width: 1201px) {

    .is-header-utilities > :last-child {
        margin-inline-start: -24px !important;
    }
}



/* =========================================================
   2. SEARCH EXPAND BAR
   =========================================================
   JS builds and appends .dejana-search-bar as a sibling after
   .is-header-navigation. Toggling .is-search-open shows it.

   Desktop: slides down from under the nav bar (absolute).
   Tablet/mobile: drops from top of viewport (fixed).
   ========================================================= */

.dejana-search-bar {
    background: var(--color-white);
    border-top: 1px solid #D9DEE6;
    padding: 1rem 0;

    /* Hidden state — desktop: slide down from nav bar */
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 9400;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-8px);
    transition:
        opacity 0.18s ease,
        transform 0.18s ease,
        visibility 0s linear 0.18s;
    pointer-events: none;
}

.dejana-search-bar.is-search-open {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    transition:
        opacity 0.18s ease,
        transform 0.18s ease,
        visibility 0s linear 0s;
    pointer-events: auto;
}

.dejana-search-bar__inner {
    margin-inline: auto;
    max-width: 860px;
    padding: 0 2.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Input row with border */
.dejana-search-bar__form {
    background: var(--color-white);
    border: 1.5px solid #D9DEE6;
    display: flex;
    flex: 1;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    transition: border-color 0.15s ease;
}

.dejana-search-bar__form:focus-within {
    border-color: var(--color-primary-500);
}

.dejana-search-bar__form svg {
    flex-shrink: 0;
    color: var(--black);
}

.dejana-search-bar__input {
    background: transparent;
    border: none;
    color: var(--black);
    flex: 1;
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
    outline: none;
}

.dejana-search-bar__input::placeholder {
    color: #9ca3af;
}

/* ✕ close button */
.dejana-search-bar__close {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--black);
    border-radius: 4px;
    transition: color 0.15s ease, background 0.15s ease;
    padding: 0;
}

.dejana-search-bar__close:hover {
    color: var(--color-black);
    background: #f3f4f6;
}

/* Search icon active state */
.is-header-search-icon a.search-is-active {
    color: var(--color-primary-500);
}

/* Tablet/mobile: slides down from behind the header nav.
   Anchored to the header (absolute, like desktop) rather than the
   viewport — the header isn't sticky, so the bar must scroll with it.
   translateY(-100%) tucks it fully behind the nav bar when closed;
   opening slides it to rest flush against the header's bottom edge. */
@media (width <= 1099px) {

    .dejana-search-bar {
        top: 100%;
        z-index: 1;
        transform: translateY(-100%);
        opacity: 1;      /* opacity already handled by transform on mobile */
        visibility: visible;
        transition: transform 0.22s ease;
        pointer-events: none;
    }

    .dejana-search-bar.is-search-open {
        transform: translateY(0);
        pointer-events: auto;
    }

    .dejana-search-bar__inner {
        padding: 0 1rem;
    }
}


/* =========================================================
   3. MOBILE / TABLET OVERLAY ENHANCEMENTS
   =========================================================
   All scoped to .firsttracks-hamburger-menu, which is the
   wrapper rendered by blocks/firsttracks/hamburger-menu/render.php.
   The hamburger block forces overlayMenu:"always", so
   .wp-block-navigation__responsive-container is always present
   inside this wrapper and gets .is-menu-open when open.
   ========================================================= */

/* ----- Overlay container ----- */

/* Closed state — mirrors .dejana-search-bar's hidden state so open/close
   feels identical to the search slide-down. `display allow-discrete`
   keeps the container rendered for the 0.18s fade-out before core's
   display:none takes effect; unsupporting browsers drop the whole
   transition declaration and simply get an instant toggle (current
   behavior). Must precede the .is-menu-open rule below — equal
   specificity, source order lets the open state win. */
.firsttracks-hamburger-menu
.wp-block-navigation__responsive-container {
    opacity: 0;
    transform: translateY(-8px);
    transition:
        opacity 0.18s ease,
        transform 0.18s ease,
        display 0.18s allow-discrete;
}

.firsttracks-hamburger-menu
.wp-block-navigation__responsive-container.is-menu-open {
    display: flex;
    flex-direction: column;
    padding-bottom: 80px; /* clear the sticky CTA bar */
    overflow-y: auto;
    top: 75px;
    border-top: 1px solid #D9DEE6;
    opacity: 1;
    transform: translateY(0);
}

@media (width <= 767px) {

    .firsttracks-hamburger-menu
    .wp-block-navigation__responsive-container.is-menu-open {
        top: 64px;
    }
}

/* Entry keyframe origin: first frame after display flips to flex. */
@starting-style {

    .firsttracks-hamburger-menu
    .wp-block-navigation__responsive-container.is-menu-open {
        opacity: 0;
        transform: translateY(-8px);
    }
}

/* ----- Close (✕) button — visually hidden -----
   The header hamburger button doubles as Close when the overlay
   is open (header-navigation.js delegates its click here, and the
   Interactivity API still focuses this on open), so keep it in the
   render path — display:flex beats the global display:none — but
   clip it out of view. Screen readers still announce it. */

.firsttracks-hamburger-menu
.wp-block-navigation__responsive-container-close {
    display: flex !important;
    position: fixed;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* ----- Top-level nav items: divider lines + spacing ----- */

.firsttracks-hamburger-menu
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__container > li.wp-block-navigation-item {
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 1rem;
    width: 100%;
}

/* ----- Nav item link text ----- */

.firsttracks-hamburger-menu
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item__content {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-black);
    padding: 0;
    text-decoration: none;
}

.firsttracks-hamburger-menu
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item__content:hover {
    color: var(--color-primary-500);
}

/* ----- Sub-items ----- */

.firsttracks-hamburger-menu
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__submenu-container
.wp-block-navigation-item__content {
    font-size: 0.9375rem;
    padding: 0.5rem 0;
    color: #374151;
}

/* ----- Chevron (submenu toggle button) ----- */

/* The per-item toggle uses .wp-block-navigation-submenu__toggle (aria-expanded) */
.firsttracks-hamburger-menu
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-submenu__toggle {
    transition: transform 0.2s ease;
}

.firsttracks-hamburger-menu
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-submenu__toggle[aria-expanded="true"] svg {
    transform: rotate(180deg);
}

/* ----- Injected utility links block ----- */

/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.dejana-nav-injected {
    width: 100%;
    margin-top: 0.5rem;
    padding-top: 0;
    border-top: none;
}

/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.dejana-nav-injected .is-header-mobile-links {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.dejana-nav-injected .is-header-mobile-links p {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 1rem;
    font-weight: 500;
    /* stylelint-disable-next-line declaration-property-unit-allowed-list -- existing rem line-height; a unitless value would change rendering. */
    line-height: 1.5rem;
    margin: 0 !important;
    padding: 0.75rem 0;
}

.dejana-nav-injected .is-header-mobile-links p:last-child {
    border-bottom: none;
}

/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.dejana-nav-injected .is-header-mobile-links a {
    color: var(--color-black);
    text-decoration: none;
}

/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.dejana-nav-injected .is-header-mobile-links a:hover {
    color: var(--color-primary-500);
}

/* ----- Get Quote CTA button (above the utility links) ----- */

.dejana-nav-injected .is-header-mobile-cta {
    margin: 0 0 1.25rem !important;
}

.dejana-nav-injected .is-header-mobile-cta a {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-primary-500);
    color: var(--color-white);
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 1rem;
    /* stylelint-disable-next-line declaration-property-unit-allowed-list -- existing rem line-height; a unitless value would change rendering. */
    line-height: 1.5rem;
    padding: 0.5rem 1rem;
    text-decoration: none;
    width: 100%;
}

.dejana-nav-injected .is-header-mobile-cta a:hover {
    background: var(--color-primary-600);
    color: var(--color-white);
}

/* ----- Icon rows (My Account, phone) ----- */

.dejana-nav-injected .is-header-mobile-links p.is-header-mobile-link-icon {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.dejana-nav-injected .is-header-mobile-links p.is-header-mobile-link-icon svg {
    flex-shrink: 0;
}

/* ----- Sticky CTA bar at bottom of overlay ----- */

.dejana-nav-sticky-cta {
    display: grid; /* was: none */
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10001;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid #e5e7eb;
    background: var(--color-white);
    box-shadow: 0 0 1px 0 rgba(48, 49, 51, 0.05), 0 -4px 8px 0 rgba(48, 49, 51, 0.10);
    padding: 1rem;
    gap: 1.5rem;
}

.dejana-nav-sticky-cta.is-visible {
    display: grid;
}

.dejana-nav-sticky-cta__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 0.825rem;
    font-weight: 600;
    text-decoration: none;
    line-height: 1.42857;
    text-align: center;
}

.dejana-nav-sticky-cta__btn--primary {
    background: var(--color-primary-500);
    color: var(--color-white);
}

.dejana-nav-sticky-cta__btn--primary:hover {
    background: var(--color-primary-600);
    color: var(--color-white);
}

.dejana-nav-sticky-cta__btn--outline {
    background: var(--color-white);
    color: var(--color-primary-500);
    border: 2px solid var(--color-primary-500);
}

.dejana-nav-sticky-cta__btn--outline:hover {
    background: #f0f6ff;
    color: var(--color-primary-600);
}

/* Only render on tablet/mobile */
@media (width > 1199px) {

    .dejana-nav-sticky-cta {
        display: none !important;
    }
}

/* =========================================================
   Site Footer
   ========================================================= */

footer.wp-block-template-part {
    background-color: var(--color-black);
}

footer.wp-block-template-part h3,
footer.wp-block-template-part p,
footer.wp-block-template-part a,
footer.wp-block-template-part li {
    color: var(--color-white);
}

footer.wp-block-template-part p,
footer.wp-block-template-part a,
footer.wp-block-template-part li {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
}

.site-footer > * {
    margin-inline: auto;
    max-width: 1680px !important;
    padding: 0 2.5rem !important;
}

footer .gfield_label {
    display: none;
}

.site-footer {
	font-size: var(--wp--preset--font-size--body-small);
	position: relative;
}

/* Diamond-plate top border
   Swap the background-image URL for your asset (SVG recommended) */
.site-footer.has-diamond-plate-top::before {
	content: "";
	position: absolute;
	top: 0;
	left: -28px;
	right: 0;
	height: 28px;
	background-image: url(/wp-content/uploads/2026/06/diamond-trim.png);
	background-repeat: repeat-x;
	background-size: auto 75%;
	pointer-events: none;
}

/* Reserve space for the diamond-plate strip on top of existing padding */
.site-footer.has-diamond-plate-top {
	padding-top: calc(var(--wp--preset--spacing--80, 5rem) + 28px);
}

/* ---------- Headings ---------- */

.site-footer__heading {
	text-transform: uppercase;
	letter-spacing: 0.02em;
	margin-bottom: 1rem;
}

/* ---------- Navigation lists ---------- */

.site-footer__nav .wp-block-navigation__container {
	gap: 0.5rem;
}

.site-footer__nav .wp-block-navigation-item__content {
	padding: 0;
}

/* ---------- Signup column ---------- */

.site-footer__signup p {
	margin-bottom: 1.25rem;
}

footer .gform_wrapper > form {
    display: flex;
    align-items: center;
}

footer .gform-footer {
    display: contents;
}

footer input.gform_button {
    background-color: var(--color-primary-500);
    border: none;
    color: var(--color-white);
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 0.875rem;
    /* stylelint-disable-next-line declaration-property-unit-allowed-list -- existing rem line-height; a unitless value would change rendering. */
    line-height: 1.25rem;
    padding: 1rem;
    text-transform: uppercase;
}

footer .gform-footer > p,
footer .gform_wrapper > form > p {
    display: none;
}

/* ---------- Contact info ---------- */

.site-footer__contact-info p {
	margin: 0 0 0.5rem;
}

.site-footer__contact-info a {
	color: inherit;
	text-decoration: none;
}

.site-footer__contact-info a:hover,
.site-footer__contact-info a:focus-visible {
	text-decoration: underline;
}

/* ---------- Divider ---------- */

.site-footer__divider {
	opacity: 0.15;
	border: 0;
	height: 1px;
}

/* ---------- Bottom row ---------- */

.site-footer__bottom {
	gap: 1.5rem;
}

.site-footer__social {
	gap: 0.75rem;
}

.site-footer__badges {
	gap: 1rem;
}

.site-footer__badge img {
	display: block;
	height: auto;
}

.site-footer__copyright {
	margin: 0;
	font-size: 0.875rem;
	opacity: 0.85;
}

.site-footer__attribution {
	margin-top: 1.5rem;
	opacity: 0.6;
}

.site-footer__attribution a {
	color: inherit;
}

/* =========================================================
   Tablet: ~600px – ~899px → 2 columns
   ========================================================= */

@media (width >= 600px) and (width <= 1199px) {

	.site-footer__main.wp-block-columns {
		flex-wrap: wrap;
		gap: 2.5rem 2rem;
	}

	.site-footer__main.wp-block-columns > .wp-block-column {
		flex-basis: calc(50% - 1.25rem) !important;
		flex-grow: 0;
	}

	/* Signup spans the full width on tablet, matching the design */
	.site-footer__main.wp-block-columns > .site-footer__signup {
		flex-basis: 100% !important;
	}
}

/* =========================================================
   Mobile: < 600px → single column (WP default, plus tweaks)
   ========================================================= */

@media (width <= 599px) {

	.site-footer__main.wp-block-columns {
		gap: 2rem;
	}

	.site-footer__bottom {
		flex-direction: column;
		align-items: flex-start;
	}

	.site-footer__badges {
		order: 2;
	}

	.site-footer__copyright {
		order: 3;
	}

	.site-footer__social {
		order: 1;
	}
}

/* =========================================================
   Desktop: 900px+ → 5-column row with signup wider
   ========================================================= */

@media (width >= 1200px) {

	.site-footer__main.wp-block-columns {
		gap: 2.5rem;
	}
}



/* =========================================================
   Footer - Extended Styles
   ========================================================= */
/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.site-footer {
    box-sizing: border-box;
}

.site-footer__main,
hr.dj-seperator,
.site-footer__bottom {
    width: 100%;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
}

/* Main footer columns - desktop */
.is-layout-flow > .site-footer__main.wp-block-columns {
    display: flex;
    gap: 2.5rem;
    flex-wrap: wrap !important;
}

.site-footer__main > .wp-block-column {

    /* flex-basis: auto !important; */
}

h3.wp-block-heading.site-footer__heading {
    margin: 0 0 8px;
    font-size: 20px;
    font-weight: 800;
    line-height: 28px;
    letter-spacing: -0.4px;
}

/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.site-footer__signup p {
    margin: 0 0 16px;
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 14px;
    line-height: 20px;
}

/* Separator */
hr.dj-seperator {
    border: 0;
    border-top: 1px solid rgba(255,255,255,.15);
    color: transparent;
    margin-top: 80px;
    margin-bottom: 28px;
}

/* Bottom row */
/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.site-footer__bottom {
    display: flex !important;
    align-items: center;
    justify-content: space-between !important;
    gap: 32px;
}

/* Social icons */
/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.site-footer__social {
    display: flex !important;
    align-items: center;
    justify-content: flex-start !important;
    gap: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 auto;
}

.site-footer__social .wp-social-link {
    margin: 0 !important;
}

.site-footer__social .wp-block-social-link-anchor {
    width: 32px;
    height: 32px;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.site-footer__social .wp-social-link-youtube svg,
.site-footer__social .wp-social-link-facebook svg {
    display: none;
}

.site-footer__social .wp-social-link-youtube .wp-block-social-link-anchor::before {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    background: #fff;
    -webkit-mask: url(/wp-content/uploads/2026/06/fi_1384028.svg) no-repeat center;
    -webkit-mask-size: contain;
    mask: url(/wp-content/uploads/2026/06/fi_1384028.svg) no-repeat center;
    mask-size: contain;
}

.site-footer__social .wp-social-link-facebook .wp-block-social-link-anchor::before {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    background: #fff;
    -webkit-mask: url(/wp-content/uploads/2026/06/fi_21155.svg) no-repeat center;
    -webkit-mask-size: contain;
    mask: url(/wp-content/uploads/2026/06/fi_21155.svg) no-repeat center;
    mask-size: contain;
}

/* Badges + copyright */
/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.site-footer__badges {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: 24px !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 auto !important;
}

.site-footer__badge,
.site-footer__badge--ford,
.site-footer__badge--mvp,
.wp-block-image.site-footer__badge,
figure.wp-block-image.site-footer__badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.site-footer__badge img {
    display: block !important;
    height: auto !important;
    max-width: none !important;
}

.site-footer__badge--ford img {
    width: 60px !important;
}

.site-footer__badge--mvp img {
    width: 90px !important;
}

.site-footer__copyright,
p.site-footer__copyright.wp-block-paragraph {
    flex: 0 0 auto !important;
    margin: 0 0 0 56px !important;
    color: var(--color-white-alpha-500);
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    white-space: nowrap;
    text-align: right;
}

/* Gravity Forms footer */
.dj-footer-newsletter_wrapper {
    width: 100%;
}

.dj-footer-newsletter_wrapper form.dj-footer-newsletter {
    display: flex;
    align-items: stretch;
    width: 100%;
    gap: 0;
}

.dj-footer-newsletter_wrapper .gform-body,
.dj-footer-newsletter_wrapper .gform_body,
.dj-footer-newsletter_wrapper .gform_fields,
.dj-footer-newsletter_wrapper .gfield,
.dj-footer-newsletter_wrapper .ginput_container {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

.dj-footer-newsletter_wrapper .gform-body {
    flex: 1 1 auto;
    min-width: 0;
}

.dj-footer-newsletter_wrapper .gform-footer,
.dj-footer-newsletter_wrapper .gform_footer {
    flex: 0 0 auto;
    margin: 0 !important;
    padding: 0 !important;
}

.dj-footer-newsletter_wrapper input[type="email"] {
    width: 100%;
    height: 48px;
    padding: 0 16px;
    font-size: 14px;
    border: 1px solid rgba(255,255,255,.2);
    background: rgba(255, 255, 255, 0.10);
    color: #fff;
    border-radius: 0;
    box-sizing: border-box;
}

.dj-footer-newsletter_wrapper input[type="email"]::placeholder {
    color: rgba(255,255,255,.75);
}

.dj-footer-newsletter_wrapper input[type="submit"],
.dj-footer-newsletter_wrapper button,
.dj-footer-newsletter_wrapper .gform_button {
    height: 48px;
    padding: 0 16px;
    border: 0;
    border-radius: 0;
    white-space: nowrap;
    background: var(--color-primary-500);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

/* -------------------------------
   Tablet - 768px - 1200px
   ---------------------------- */

/* Tablet */
@media (min-width: 768px) and (max-width: 1199) {

    .site-footer {
        padding: 64px 34px 30px !important;
    }

    .site-footer__main,
    hr.dj-seperator,
    .site-footer__bottom {
        max-width: 860px;
    }

    .is-layout-flow > .site-footer__main.wp-block-columns {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 56px 70px !important;
    }

    .wp-block-columns.site-footer__main, .wp-block-group.site-footer__bottom {
        padding: 0 !important;
    }

    .site-footer__signup {
        grid-column: 1 / -1;
    }

    .site-footer__signup .dj-footer-newsletter_wrapper {
        max-width: 100%;
    }

    .site-footer__contact-info {
        grid-column: 2;
        grid-row: 3;
    }

    .dj-footer-newsletter_wrapper input[type="email"] {
        max-width: none;
    }

    hr.dj-seperator {
        margin-top: 80px;
        margin-bottom: 24px;
    }

    .site-footer__bottom {
        display: grid !important;
        grid-template-columns: auto 1fr;
        grid-template-areas:
            "social badges"
            "copyright copyright";
        align-items: start;
        column-gap: 32px;
        row-gap: 28px;
    }

    .site-footer__social {
        grid-area: social;
        justify-self: start;
        align-self: start;
        margin: 0 !important;
    }

    .site-footer__badges {
        grid-area: badges;
        justify-self: end;
        align-self: start;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-wrap: wrap !important;
        width: fit-content !important;
        max-width: 100% !important;
        gap: 24px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .site-footer__badge,
    .site-footer__badge--ford,
    .site-footer__badge--mvp,
    .wp-block-image.site-footer__badge,
    figure.wp-block-image.site-footer__badge {
        display: inline-flex !important;
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .site-footer__copyright,
    p.site-footer__copyright.wp-block-paragraph {
        flex-basis: 100% !important;
        width: 100% !important;
        margin: 0 !important;
        text-align: right !important;
        white-space: nowrap;
    }
}

/* -------------------------------
   Desktop - 1200px
   ---------------------------- */
@media (min-width: 1200px) {

   .is-layout-flow > .site-footer__main.wp-block-columns {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 4rem;
    }

    .site-footer__main > .wp-block-column.site-footer__signup {
        margin-right: 1.75rem;
    }
}

/* -------------------------------
   Mobile - 767px
   ---------------------------- */
@media (max-width: 767px) {

    .site-footer {
        padding: 48px 10px 28px !important;
    }

    .site-footer__main,
    hr.dj-seperator,
    .site-footer__bottom {
        max-width: none;
    }

    .site-footer__main {

        /* grid-template-columns: 1fr !important;
        gap: 42px !important; */
    }

    .wp-block-columns.site-footer__main, .wp-block-group.site-footer__bottom {
        padding: 16px !important;
    }

    .site-footer__signup,
    .site-footer__contact-info {
        grid-column: auto;
        grid-row: auto;
    }

    .site-footer__signup p {
        margin-bottom: 16px !important;
    }

    .site-footer__signup .dj-footer-newsletter_wrapper {
        max-width: 100%;
    }

    .dj-footer-newsletter_wrapper input[type="email"] {
        max-width: none;
    }

    hr.dj-seperator {
        margin-top: 40px;
        margin-bottom: 24px;
        width: 95%;
    }

    .wp-block-group.site-footer__bottom {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .site-footer__bottom {
        display: block !important;
    }

    .site-footer__social {
        justify-content: flex-start !important;
        margin-bottom: 40px !important;
    }

    .site-footer__badges {
        width: 100% !important;
        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 16px 24px !important;
        margin: 0 !important;
    }

    .site-footer__copyright,
    p.site-footer__copyright.wp-block-paragraph {
        flex-basis: 100% !important;
        width: 100% !important;
        margin: 0 !important;
        white-space: normal;
        text-align: left;
        font-size: 14px;
        line-height: 20px;
    }
}



/* =========================================================
   Equipment Single
   ========================================================= */

.single-equipment main.alignwide,
.single-equipment .is-layout-constrained > .alignwide {
    max-width: 1680px;
}

.equipment-container__main {
	--equipment-specs-gap: var(--spacing-24-rem, 1.5rem);
	--equipment-specs-heading-font-family: var(--typeface-family-secondary, inherit);
	--equipment-specs-primary-heading-font-size: clamp(1.125rem, -8.5rem + 21.875vw, 2rem);
    --equipment-specs-heading-font-size: clamp(1.125rem, -0.25rem + 3.125vw, 1.25rem);
	--equipment-specs-media-bg: var(--color-bg-secondary, #f3f3f3);

	box-sizing: border-box;
	margin-block: var(--spacing-48-rem, 3rem);
}

.single-equipment main > .wp-block-post-title {
    display: none;
}

/* This theme's own hero-slider, page-hero-context and page-hero-title-image
   pattern stylesheets (enqueued on every front-end page) set
   overflow-x:hidden on html, body and .wp-site-blocks, which forces
   overflow-y to `auto` and makes them a scroll container — that's what's
   breaking position:sticky on the equipment CTA.
   `clip` prevents the same horizontal scroll WITHOUT creating a scroll
   container, so sticky works. Scoped to Equipment singles so that
   horizontal-overflow protection stays intact everywhere else. */
body.single-equipment,
.single-equipment .wp-site-blocks {
	overflow-x: clip;
	overflow-y: visible;
}

.wp-block-group.equipment-container, .wp-block-columns.equipment-container__columns {
    max-width: 1680px;
}

.gslide-description {
    display: none;
}

.single-equipment .equipment-container__main h2.wp-block-heading {
    color: var(--color-text, #111);
	font-family: var(--equipment-specs-heading-font-family);
	font-size: var(--equipment-specs-heading-font-size);
    font-weight: 800;
}

.single-equipment .equipment-container__main .equipment-gallery + h2.wp-block-heading {
    border-bottom: 4px solid var(--black);
	font-size: var(--equipment-specs-primary-heading-font-size);
    margin: 3rem 0 1.5rem;
    padding-bottom: 0.5rem;
    position: relative;
    text-transform: uppercase;
}

.single-equipment .equipment-container__main .equipment-gallery + h2.wp-block-heading::after {
    content: url(/wp-content/uploads/2026/06/Vector-4.svg);
    position: absolute;
    right: 0;
    bottom: -14px;
}


/* =========================================================
   Tablet: ~600px – ~899px → Applicable Explanation
   ========================================================= */

@media (width >= 600px) and (width <= 899px) {

	.single-equipment .equipment-container__main .equipment-gallery + h2.wp-block-heading::after {
        bottom: -9px;
    }

    .single-equipment .equipment-container__main .equipment-gallery + h2.wp-block-heading {
        margin: 5rem 0 1.5rem;
    }

	.equipment-container__columns .wp-block-column {
        padding: 0 2.5rem;
    }

    .equipment-gallery {
        margin-inline: -2.5rem;
    }
}

/* =========================================================
   Mobile: < 600px
   ========================================================= */

@media (width <= 599px) {

	.equipment-container__columns .wp-block-column {
        padding: 0 1rem;
    }

    .equipment-gallery {
        margin-inline: -1rem;
    }

    .single-equipment .is-layout-flow > .wp-block-columns {
        margin-bottom: 1.5rem;
        gap: 1.5rem;
    }
}

/* =========================================================
   Tablet and up: > 600px
   ========================================================= */

@media (width >= 600px) {

    .single-equipment .is-layout-flow > .wp-block-columns {
        margin-bottom: 3rem;
        gap: 3rem;
    }
}

/* =========================================================
   Desktop: Applicable Explanation
   ========================================================= */

@media (width >= 900px) {

    .single-equipment .equipment-container__main .equipment-gallery + h2.wp-block-heading::after {
        bottom: -9px;
    }

    .wp-block-group.equipment-container {
        padding: 2.5rem 2.5rem 0;
    }

    .wp-block-columns.equipment-container__columns {
        gap: 5rem;
    }

    .wp-block-column.equipment-container__main {
        flex-basis: 100% !important;
    }

    .wp-block-column.equipment-container__aside {
        flex-basis: 100% !important;
    }
}

@media (width >= 1200px) {

    .wp-block-column.equipment-container__main {
        flex-basis: 65% !important;
    }

    .wp-block-column.equipment-container__aside {
        flex-basis: 35% !important;
    }
}



/* =========================================================
   Blog
   ========================================================= */

/* ---------- Blog Archive ---------- */
.blog .wp-block-post-template .wp-block-post > .wp-block-group {

    /* display: flex;
    flex-direction: column; */
}

.blog .wp-block-post-template .wp-block-post > .wp-block-group > .wp-block-group,
.blog figure.wp-block-post-featured-image {
    display: none;
}

/* stylelint-disable-next-line no-duplicate-selectors -- existing split rule; merging it would reorder the cascade. */
.blog .wp-block-post-template .wp-block-post > .wp-block-group {
    border-bottom: 1px solid #111827;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
}

.blog .wp-block-post-template .wp-block-post > .wp-block-group h2 {
    font-family: var(--wp--preset--font-family--display, 'Saira SemiCondensed'), sans-serif;
    font-size: 1.25rem;
    line-height: 1.3333;
    font-weight: 800;
}

.blog .wp-block-post-template .wp-block-post > .wp-block-group .wp-block-post-excerpt {
    margin-top: 0.5rem;
}

.blog .wp-block-post-template .wp-block-post > .wp-block-group a.wp-block-post-excerpt__more-link {
    color: var(--color-primary-500);
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
    font-size: 1rem;
    line-height: 1.3333;
    font-weight: 600;
}


/* =========================================================
   Tablet: ~600px – ~899px → Applicable Explanation
   ========================================================= */

@media (width >= 600px) and (width <= 899px) {

	.blog main {
        padding: 0 2.5rem;
    }

}

/* =========================================================
   Mobile: < 600px
   ========================================================= */

@media (width <= 599px) {

	.blog main {
        padding: 0 1rem;
    }
}

/* =========================================================
   Tablet:
   ========================================================= */

@media (width >= 900px) {

    .blog main {
        margin-top: 2.5rem;
    }
}

/* =========================================================
   Tablet & Up:
   ========================================================= */

@media (width >= 600px) {

    .blog .wp-block-post-template .wp-block-post > .wp-block-group h2 {
        font-size: 1.75rem;
    }
}



/* =========================================================
   Blog Single
   ========================================================= */
.single-post .dj-page-hero-title {
    margin-bottom: 3rem !important;
}





/* stylelint-disable selector-id-pattern -- Gravity Forms generates these ids (#gform_wrapper_N, #field_N_N, #input_N_N_N_container). */

/* =========================================================
   Gravity Forms - shared base (all forms)

   Structural/type-class selectors only, scoped to .gform_wrapper,
   so every form gets the site treatment without per-form CSS.
   Values match the form 1 / form 5 blocks below. Those blocks are
   ID-scoped, so they still win on their own forms; this block is
   the fallback for everything else (intranet forms 19, 42, 49 and
   any form added later). Covers modern and legacy markup, and the
   multi-page pieces (page steps, progress bar, Next/Previous).
   ====================================================== */
.gform_wrapper {
	max-width: 1200px;
	margin: 0 auto;
	font-family: inherit;
}

.gform_wrapper .gform_required_legend,
.gform_wrapper .gfield--type-honeypot,
.gform_wrapper .gform_validation_container {
	display: none !important;
}

.gform_wrapper .gform_heading {
	display: block !important;
	margin: 0 0 24px !important;
}

.gform_wrapper .gform_title,
.gform_wrapper h2.gform_title {
	margin: 0 0 24px !important;
	padding: 0 !important;
	color: var(--color-black);
    font-family: var(--wp--preset--font-family--display, 'Saira SemiCondensed'), sans-serif !important;
	font-size: 20px !important;
	font-weight: 800 !important;
	line-height: 28px !important;
	letter-spacing: -0.4px !important;
	text-transform: capitalize !important;
}

.gform_wrapper .gform_description {
	display: block;
	margin: 0 0 24px !important;
	color: var(--color-black);
	font-size: 16px;
	line-height: 24px;
}

/* Grid - ul.gform_fields (legacy) or div.gform_fields (modern) */
.gform_wrapper .gform_fields {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 24px 16px !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.gform_wrapper .gfield {
	margin: 0 !important;
	padding: 0 !important;
	width: 100% !important;
	max-width: none !important;
	grid-column: auto !important;
	list-style: none !important;
}

.gform_wrapper .gfield::before,
.gform_wrapper .gfield::marker {
	content: none !important;
}

/* Full-width rows */
.gform_wrapper .gfield--type-textarea,
.gform_wrapper .gfield--type-section,
.gform_wrapper .gfield--type-checkbox,
.gform_wrapper .gfield--type-captcha,
.gform_wrapper .gfield--type-fileupload,
.gform_wrapper .gfield--type-list,
.gform_wrapper .gfield--type-html,
.gform_wrapper .gfield--type-consent,
.gform_wrapper .gfield--width-full,
.gform_wrapper .gsection,
.gform_wrapper .gf-message-heading {
	grid-column: 1 / -1 !important;
}

.gform_wrapper .gform_hidden,
.gform_wrapper .gfield--type-hidden,
.gform_wrapper .gf_clear {
	display: none !important;
}

/* Section breaks */
.gform_wrapper .gsection {
	margin: 24px 0 0 !important;
	padding: 24px 0 0 !important;
	border: 0 !important;
	border-top: 1px solid var(--color-neutral-200) !important;
}

.gform_wrapper .gform_fields > .gsection:first-child {
	margin-top: 0 !important;
	padding-top: 0 !important;
	border-top: 0 !important;
}

.gform_wrapper .gsection_title,
.gform_wrapper h2.gsection_title,
.gform_wrapper .gf-message-heading h2 {
	margin: 0 !important;
	padding: 0 !important;
	color: var(--color-black);
	font-size: 20px !important;
	font-weight: 800 !important;
	line-height: 28px !important;
	letter-spacing: -0.4px;
	text-transform: capitalize;
}

/* Fieldsets - GF wraps name/address/checkbox/radio/date in <fieldset>;
   strip the browser default border and box, and make <legend> read as a label */
.gform_wrapper fieldset,
.gform_wrapper fieldset.gfield,
.gform_wrapper .gfield fieldset {
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
}

.gform_wrapper legend,
.gform_wrapper legend.gfield_label {
	display: block !important;
	float: none !important;
	width: auto !important;
	margin: 0 0 10px !important;
	padding: 0 !important;
}

/* Labels */
.gform_wrapper .gfield_label,
.gform_wrapper .gform-field-label,
.gform_wrapper .gform-field-label--type-sub {
	display: block !important;
	margin: 0 0 10px !important;
	color: var(--color-black);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.3;
}

.gform_wrapper .gfield_required,
.gform_wrapper .gfield_required_asterisk,
.gform_wrapper .gfield_required_text {
	display: inline !important;
	margin-left: 4px;
	color: #c0392b;
	font-style: italic;
	font-weight: 400;
}

.gform_wrapper .hidden_label > .gfield_label,
.gform_wrapper .hidden_label > legend {
	display: none !important;
}

.gform_wrapper .gfield_description {
	margin: 8px 0 0 !important;
	color: var(--color-neutral-600, #4b5563);
	font-size: 14px;
	line-height: 20px;
}

/* Inputs - .medium/.large are GF sizing classes that must be neutralised */
.gform_wrapper .ginput_container input[type="text"],
.gform_wrapper .ginput_container input[type="email"],
.gform_wrapper .ginput_container input[type="tel"],
.gform_wrapper .ginput_container input[type="number"],
.gform_wrapper .ginput_container input[type="url"],
.gform_wrapper .ginput_container input[type="date"],
.gform_wrapper .ginput_container input[type="password"],
.gform_wrapper .ginput_container select,
.gform_wrapper .ginput_container textarea {
	width: 100% !important;
	max-width: 100% !important;
	min-height: 40px !important;
	padding: 16px !important;
	border: 1px solid var(--color-neutral-200) !important;
	border-radius: 0 !important;
	background: #fff !important;
	color: #111827 !important;
	font-family: inherit !important;
	font-size: 16px !important;
	line-height: 1.4 !important;
	box-shadow: none !important;
	box-sizing: border-box !important;
}

.gform_wrapper .ginput_container textarea {
	min-height: 200px !important;
	resize: vertical;
}

/* Selects - native control replaced with a consistent chevron */
.gform_wrapper .ginput_container select {
	padding-right: 44px !important;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23111827' stroke-width='2'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 16px center !important;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

.gform_wrapper .ginput_container input:focus,
.gform_wrapper .ginput_container select:focus,
.gform_wrapper .ginput_container textarea:focus {
	outline: 2px solid var(--color-primary-500);
	outline-offset: 0;
	border-color: var(--color-primary-500) !important;
}

/* Complex fields (name, address) - sub inputs side by side */
.gform_wrapper .ginput_complex {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 16px !important;
}

.gform_wrapper .ginput_complex > span,
.gform_wrapper .ginput_complex > div {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.gform_wrapper .ginput_complex .ginput_full,
.gform_wrapper .ginput_complex .address_line_1,
.gform_wrapper .ginput_complex .address_line_2 {
	grid-column: 1 / -1 !important;
}

/* Sublabels */
.gform_wrapper .gform-field-label--type-sub,
.gform_wrapper .ginput_complex label {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
	margin: 0 0 8px !important;
	color: var(--color-black);
	font-size: 16px;
	font-weight: 400;
	line-height: 28px;
}

/* Checkbox / radio */
.gform_wrapper .gfield_checkbox .gchoice,
.gform_wrapper .gfield_radio .gchoice {
	display: flex !important;
	align-items: flex-start;
	gap: 12px;
	margin: 0 0 8px !important;
}

.gform_wrapper .gfield_checkbox,
.gform_wrapper .gfield_radio {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.gform_wrapper input[type="checkbox"],
.gform_wrapper input[type="radio"] {
	width: 20px !important;
	height: 20px !important;
	min-height: 20px !important;
	margin: 3px 0 0 !important;
	padding: 0 !important;
	flex: 0 0 20px;
	border: 1px solid var(--color-neutral-300);
	accent-color: var(--color-primary-500);
}

.gform_wrapper .gfield_checkbox label,
.gform_wrapper .gfield_radio label {
	margin: 0 !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	line-height: 24px !important;
}

/* File upload */
.gform_wrapper .ginput_container_fileupload input[type="file"] {
	width: 100%;
	padding: 12px;
	border: 1px dashed var(--color-neutral-300);
	background: #fff;
	font-size: 14px;
}

/* Validation - GF ships no CSS here (disable_css) */
.gform_wrapper .gfield_error .ginput_container input,
.gform_wrapper .gfield_error .ginput_container select,
.gform_wrapper .gfield_error .ginput_container textarea {
	border-color: #c0392b !important;
}

.gform_wrapper .validation_message,
.gform_wrapper .gfield_validation_message {
	margin: 8px 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	color: #c0392b;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
}

.gform_wrapper .validation_error,
.gform_wrapper .gform_validation_errors {
	margin: 0 0 24px !important;
	padding: 16px !important;
	border: 1px solid #c0392b !important;
	background: none !important;
	color: #c0392b;
	font-size: 16px;
	line-height: 24px;
}

.gform_wrapper .gform_validation_errors > h2 {
	margin: 0 !important;
	font-size: 16px !important;
	font-weight: 600 !important;
}

/* Multi-page: steps + progress bar */
.gform_wrapper .gf_page_steps {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
	margin: 0 0 24px !important;
	padding: 0 0 16px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--color-neutral-200) !important;
}

.gform_wrapper .gf_step {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 !important;
	padding: 0 !important;
	color: var(--color-neutral-600, #4b5563);
	font-size: 15px;
	line-height: 24px;
}

.gform_wrapper .gf_step_number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border: 1px solid var(--color-neutral-300);
	border-radius: 0;
	font-size: 14px;
	font-weight: 600;
}

.gform_wrapper .gf_step_active {
	color: var(--color-black);
	font-weight: 600;
}

.gform_wrapper .gf_step_active .gf_step_number,
.gform_wrapper .gf_step_completed .gf_step_number {
	border-color: var(--color-primary-500);
	background: var(--color-primary-500);
	color: var(--color-white);
}

.gform_wrapper .gf_progressbar_wrapper {
	margin: 0 0 24px !important;
	padding: 0 !important;
}

.gform_wrapper .gf_progressbar_title {
	margin: 0 0 8px !important;
	color: var(--color-black);
	font-size: 16px;
	font-weight: 600;
	line-height: 24px;
}

.gform_wrapper .gf_progressbar {
	position: relative;
	height: 8px;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: var(--color-neutral-200) !important;
	overflow: hidden;
}

.gform_wrapper .gf_progressbar_percentage {
	height: 100%;
	border-radius: 0 !important;
	background: var(--color-primary-500) !important;
	color: transparent !important;
	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px;
}

.gform_wrapper .gform_page {
	display: block;
}

/* Footer / Submit / Next / Previous */
.gform_wrapper .gform_footer,
.gform_wrapper .gform_page_footer {
	display: flex !important;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 24px !important;
	padding: 0 !important;
	border: 0 !important;
}

.gform_wrapper .gform_button,
.gform_wrapper .gform_next_button,
.gform_wrapper .gform_previous_button,
.gform_wrapper .gform-button {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
	padding: 16px 24px !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: var(--color-primary-500) !important;
	color: var(--color-white) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 24px;
	letter-spacing: 0.03px;
	cursor: pointer;
}

.gform_wrapper .gform_button:hover,
.gform_wrapper .gform_next_button:hover,
.gform_wrapper .gform-button:hover {
	background: var(--color-primary-600) !important;
}

.gform_wrapper .gform_previous_button {
	background: var(--color-white) !important;
	color: var(--color-primary-500) !important;
	border: 1px solid var(--color-primary-500) !important;
}

.gform_wrapper .gform_previous_button:hover {
	background: var(--color-neutral-50) !important;
}

/* Datepicker (GF 3.x accessible datepicker). GF's icon CSS is disabled,
   so the toggle gets an inline SVG and the popup gets the site treatment. */
.gform_wrapper .ginput_container_date {
	position: relative;
	display: flex !important;
	align-items: stretch;
	gap: 0;
}

.gform_wrapper .ginput_container_date input[type="text"] {
	flex: 1 1 auto;
}

.gform_wrapper .gform-datepicker-toggle,
.gform_wrapper .gform-datepicker-toggle.gform-button,
.gform_wrapper .gform-datepicker-toggle.gform-theme-button {
	flex: 0 0 auto;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 52px !important;
	min-width: 52px !important;
	height: auto !important;
	margin: 0 0 0 -1px !important;
	padding: 0 !important;
	border: 1px solid var(--color-neutral-200) !important;
	border-radius: 0 !important;
	background-color: #fff !important;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23111827' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='0'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	color: transparent !important;
	font-size: 0 !important;
	line-height: 0 !important;
	cursor: pointer;
}

.gform_wrapper .gform-datepicker-toggle:hover,
.gform_wrapper .gform-datepicker-toggle:focus-visible {
	border-color: var(--color-primary-500) !important;
	background-color: var(--color-neutral-50) !important;
	outline: none;
}

.gform-datepicker-calendar {
	z-index: 9999 !important;
	padding: 12px;
	border: 1px solid var(--color-neutral-200);
	background: #fff;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
	color: var(--color-black);
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
	font-size: 14px;
	line-height: 20px;
}

.gform-datepicker-calendar table.calendar {
	width: auto;
	border-collapse: separate;
	border-spacing: 2px;
}

.gform-datepicker-calendar tr.yearSelector td,
.gform-datepicker-calendar tr.monthSelector td {
	padding: 2px;
}

.gform-datepicker-calendar select.nav {
	min-width: 110px;
	padding: 6px 28px 6px 8px !important;
	border: 1px solid var(--color-neutral-200) !important;
	border-radius: 0 !important;
	background-color: #fff !important;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23111827' stroke-width='2'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 8px center !important;
	color: var(--color-black);
	font-family: inherit;
	font-size: 14px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

.gform-datepicker-calendar td.nav.btn {
	width: 32px;
	color: var(--color-primary-500);
	font-weight: 700;
	text-align: center;
	cursor: pointer;
}

.gform-datepicker-calendar td.nav.btn:hover {
	background: var(--color-neutral-50);
}

.gform-datepicker-calendar th,
.gform-datepicker-calendar td.dayName,
.gform-datepicker-calendar td.weekday {
	padding: 6px 0;
	color: var(--color-neutral-600, #4b5563);
	font-size: 12px;
	font-weight: 600;
	text-align: center;
	text-transform: uppercase;
}

.gform-datepicker-calendar td.day {
	width: 36px;
	height: 36px;
	padding: 0;
	border: 1px solid transparent;
	color: var(--color-black);
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
}

.gform-datepicker-calendar td.day:not(.dayInMonth) {
	color: var(--color-neutral-300, #cbd5e1);
}

.gform-datepicker-calendar td.day.dayInMonth:hover {
	background: var(--color-neutral-50);
	border-color: var(--color-neutral-200);
}

.gform-datepicker-calendar td.day.dayToday {
	border-color: var(--color-primary-500);
	font-weight: 700;
}

.gform-datepicker-calendar td.day.selected {
	background: var(--color-primary-500);
	border-color: var(--color-primary-500);
	color: var(--color-white);
}

/* reCAPTCHA spacing */
.gform_wrapper .gfield--type-captcha {
	margin-top: 8px !important;
}

/* -------------------------------
   Mobile - 767px
   ---------------------------- */
@media (max-width: 767px) {

	.gform_wrapper .gform_title,
	.gform_wrapper h2.gform_title,
	.gform_wrapper .gsection_title,
	.gform_wrapper h2.gsection_title {
		font-size: 18px !important;
		line-height: 24px !important;
		letter-spacing: -0.36px !important;
	}

	.gform_wrapper .gform_fields,
	.gform_wrapper .ginput_complex {
		grid-template-columns: 1fr !important;
		gap: 24px !important;
	}

	.gform_wrapper .ginput_container textarea {
		min-height: 160px !important;
	}

	.gform_wrapper .gform_button,
	.gform_wrapper .gform_next_button,
	.gform_wrapper .gform_previous_button {
		min-height: 60px !important;
		font-size: 18px !important;
	}
}

/* =========================================================
   Gravity Forms - (ID:1)
   ====================================================== */
#gform_wrapper_1 {
	max-width: 1200px;
	margin: 0 auto;
	font-family: inherit;
}

#gform_wrapper_1 .gform_required_legend,
#gform_wrapper_1 .gfield--type-honeypot,
#gform_wrapper_1 .gform_validation_container {
	display: none !important;
}

#gform_wrapper_1 .gform_heading {
	display: block !important;
	margin: 0 0 24px !important;
}

#gform_wrapper_1 .gform_title,
#gform_wrapper_1 h2.gform_title {
	margin: 0 0 24px !important;
	padding: 0 !important;
	color: var(--color-black);
    font-family: var(--wp--preset--font-family--display, 'Saira SemiCondensed'), sans-serif !important;
	font-size: 20px !important;
	font-weight: 800 !important;
	line-height: 28px !important;
	letter-spacing: -0.4px !important;
	text-transform: capitalize !important;
}

/* Grid */
#gform_wrapper_1 .gform_fields {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 24px 16px !important;
}

#gform_wrapper_1 .gfield {
	margin: 0 !important;
	padding: 0 !important;
	width: 100% !important;
	max-width: none !important;
	grid-column: auto !important;
}

#gform_wrapper_1 #field_1_1 {
	display: contents !important;
}

#gform_wrapper_1 #field_1_1 > legend {
	display: none !important;
}

#gform_wrapper_1 #field_1_1 .ginput_container_name {
	display: contents !important;
}

#gform_wrapper_1 #input_1_1_3_container,
#gform_wrapper_1 #input_1_1_6_container {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
	grid-column: auto !important;
}

#gform_wrapper_1 #field_1_6 {
	display: contents !important;
}

#gform_wrapper_1 #field_1_6 > legend {
	display: none !important;
}

#gform_wrapper_1 #field_1_6 .ginput_container_address {
	display: contents !important;
}

#gform_wrapper_1 #input_1_6_1_container,
#gform_wrapper_1 #input_1_6_3_container,
#gform_wrapper_1 #input_1_6_4_container,
#gform_wrapper_1 #input_1_6_5_container {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
	grid-column: auto !important;
}

/* Full-width rows */
#gform_wrapper_1 .gfield--type-textarea,
#gform_wrapper_1 .gfield--type-checkbox,
#gform_wrapper_1 .gfield--type-captcha,
#gform_wrapper_1 .gf-message-heading {
	grid-column: 1 / -1 !important;
}

#gform_wrapper_1 .gform_hidden,
#gform_wrapper_1 .gf_clear {
	display: none !important;
}

/* Labels */
#gform_wrapper_1 .gfield_label,
#gform_wrapper_1 .gform-field-label,
#gform_wrapper_1 .gform-field-label--type-sub {
	display: block !important;
	margin: 0 0 10px !important;
	color: var(--color-black);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.3;
}

#gform_wrapper_1 .gfield_required,
#gform_wrapper_1 .gfield_required_text {
	display: inline !important;
	visibility: visible !important;
	opacity: 1 !important;
	color: var(--color-black) !important;
	font-style: italic;
	font-weight: 400 !important;
	margin-left: 4px;
}

#gform_wrapper_1 .ginput_container_name .name_first .gform-field-label--type-sub::after,
#gform_wrapper_1 .ginput_container_name .name_last .gform-field-label--type-sub::after {
	content: " *";
	color: var(--color-black);
	font-style: italic;
	font-weight: 400;
}

#gform_wrapper_1 .gfield_label .gfield_required,
#gform_wrapper_1 .gform-field-label .gfield_required {
	display: inline !important;
}

#gform_wrapper_1 .hidden_label > .gfield_label,
#gform_wrapper_1 .hidden_label > legend {
	display: none !important;
}

#gform_wrapper_1 .gfield_required {
	color: #c0392b;
	font-style: italic;
	font-weight: 400;
}

/* Inputs */
#gform_wrapper_1 input[type="text"],
#gform_wrapper_1 input[type="email"],
#gform_wrapper_1 input[type="tel"],
#gform_wrapper_1 select,
#gform_wrapper_1 textarea {
	width: 100% !important;
	max-width: 100% !important;
	min-height: 40px !important;
	padding: 16px !important;
	border: 1px solid var(--color-neutral-200) !important;
	border-radius: 0 !important;
	background: #fff !important;
	color: #111827 !important;
	font-size: 16px !important;
	line-height: 1.4 !important;
	box-shadow: none !important;
	box-sizing: border-box !important;
}

#gform_wrapper_1 textarea {
	min-height: 360px !important;
	resize: vertical;
}

/* Sublabels */
#gform_wrapper_1 .gform-field-label--type-sub {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
	margin: 0 0 8px !important;
	color: var(--color-black);
	font-size: 16px;
	font-weight: 400;
	line-height: 28px;
}

/* Section heading */
#gform_wrapper_1 .gf-message-heading h2 {
	margin: 24px 0 0 !important;
	color: var(--color-black);
	font-size: 20px;
	font-weight: 800;
	line-height: 28px;
	letter-spacing: -0.4px;
	text-transform: capitalize;
}

/* Checkbox */
#gform_wrapper_1 .gfield_checkbox .gchoice {
	display: flex !important;
	align-items: flex-start;
	gap: 12px;
}

#gform_wrapper_1 input[type="checkbox"] {
	width: 20px !important;
	height: 20px !important;
	min-height: 20px !important;
	margin: 3px 0 0 !important;
	padding: 0 !important;
	flex: 0 0 20px;
	border: 1px solid var(--color-neutral-300);
}

#gform_wrapper_1 .gfield_checkbox label {
	margin: 0 !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	line-height: 20px !important;
}

/* Hide the field label + required asterisk */
#gform_wrapper_1 #field_1_10 .gfield_label,
#gform_wrapper_1 #field_1_10 .gfield_required,
#gform_wrapper_1 #field_1_10 .gfield_required_asterisk {
	display: none !important;
}

/* Remove the fieldset border */
#gform_wrapper_1 #field_1_10 {
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Remove default fieldset styling */
#gform_wrapper_1 #field_1_10 fieldset,
#gform_wrapper_1 fieldset#field_1_10 {
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Footer / Submit */
#gform_wrapper_1 .gform_footer {
	margin-top: 24px !important;
	padding: 0 !important;
}

#gform_wrapper_1 .gform_button {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
	padding: 16px 24px !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: var(--color-primary-500) !important;
	color: var(--color-white) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 24px;
	letter-spacing: 0.03px;
	cursor: pointer;
}

/* reCAPTCHA spacing */
#gform_wrapper_1 .gfield--type-captcha {
	margin-top: 8px !important;
}

/* -------------------------------
   Mobile - 767px
   ---------------------------- */
@media (max-width: 767px) {

	#gform_wrapper_1 .gform_title,
	#gform_wrapper_1 h2.gform_title {
		font-size: 18px !important;
		line-height: 24px !important;
		letter-spacing: -0.36px !important;
	}

	#gform_wrapper_1 .gf-message-heading h2 {
		margin: 0 !important;
	}

	#gform_wrapper_1 .gform_fields {
		grid-template-columns: 1fr !important;
		gap: 24px !important;
	}

	#gform_wrapper_1 textarea {
		min-height: 260px !important;
	}

	#gform_wrapper_1 .gform_button {
		max-width: 50%;
		min-height: 60px !important;
		font-size: 18px !important;
	}
}

/* =========================================================
   Gravity Forms - Parts & Service Request (ID:5)

   NOTE: form 5 renders in LEGACY markup
   (.gform_legacy_markup_wrapper / data-form-theme="legacy"),
   unlike form 1 which uses the modern markup. Practical
   differences handled below:
     - fields are <li> inside <ul.gform_fields>, so the list
       needs its bullets/indent stripped (GF CSS is disabled
       site-wide via rg_gforms_disable_css, so nothing else
       resets it)
     - section breaks render as li.gsection > h2.gsection_title,
       not form 1's .gf-message-heading
     - GF adds sizing classes (.medium/.large) to inputs that
       must be neutralised

   Scoped by #gform_wrapper_5 + structural/type classes only.
   Deliberately no per-field IDs (#field_5_24 etc.) so that
   reordering fields in the GF admin cannot break the layout.
   ====================================================== */
#gform_wrapper_5 {
	max-width: 1200px;
	margin: 0 auto;
	font-family: inherit;
}

/* Defensive: none of these render for form 5 today (no honeypot,
   no required legend, no validation container), but they appear
   the moment those options are toggled on in the form settings. */
#gform_wrapper_5 .gform_required_legend,
#gform_wrapper_5 .gfield--type-honeypot,
#gform_wrapper_5 .gform_validation_container {
	display: none !important;
}

#gform_wrapper_5 .gform_heading {
	display: block !important;
	margin: 0 0 24px !important;
}

#gform_wrapper_5 .gform_title,
#gform_wrapper_5 h2.gform_title {
	margin: 0 0 24px !important;
	padding: 0 !important;
	color: var(--color-black);
    font-family: var(--wp--preset--font-family--display, 'Saira SemiCondensed'), sans-serif !important;
	font-size: 20px !important;
	font-weight: 800 !important;
	line-height: 28px !important;
	letter-spacing: -0.4px !important;
	text-transform: capitalize !important;
}

/* Grid — ul.gform_fields in legacy markup */
#gform_wrapper_5 .gform_fields {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 24px 16px !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

#gform_wrapper_5 .gfield {
	margin: 0 !important;
	padding: 0 !important;
	width: 100% !important;
	max-width: none !important;
	grid-column: auto !important;
	list-style: none !important;
}

#gform_wrapper_5 .gfield::before,
#gform_wrapper_5 .gfield::marker {
	content: none !important;
}

/* Full-width rows */
#gform_wrapper_5 .gfield--type-textarea,
#gform_wrapper_5 .gfield--type-section,
#gform_wrapper_5 .gsection,
#gform_wrapper_5 .gfield--width-full {
	grid-column: 1 / -1 !important;
}

#gform_wrapper_5 .gform_hidden,
#gform_wrapper_5 .gfield--type-hidden,
#gform_wrapper_5 .gf_clear {
	display: none !important;
}

/* Section breaks — Contact / Vehicle / Equipment / Inquiry Details */
#gform_wrapper_5 .gsection {
	margin: 24px 0 0 !important;
	padding: 24px 0 0 !important;
	border: 0 !important;
	border-top: 1px solid var(--color-neutral-200) !important;
}

#gform_wrapper_5 .gform_fields > .gsection:first-child {
	margin-top: 0 !important;
	padding-top: 0 !important;
	border-top: 0 !important;
}

#gform_wrapper_5 .gsection_title,
#gform_wrapper_5 h2.gsection_title {
	margin: 0 !important;
	padding: 0 !important;
	color: var(--color-black);
	font-size: 20px !important;
	font-weight: 800 !important;
	line-height: 28px !important;
	letter-spacing: -0.4px;
	text-transform: capitalize;
}

/* Labels */
#gform_wrapper_5 .gfield_label,
#gform_wrapper_5 .gform-field-label,
#gform_wrapper_5 .gform-field-label--type-sub {
	display: block !important;
	margin: 0 0 10px !important;
	color: var(--color-black);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.3;
}

#gform_wrapper_5 .gfield_required,
#gform_wrapper_5 .gfield_required_asterisk {
	display: inline !important;
	margin-left: 4px;
	color: #c0392b;
	font-style: italic;
	font-weight: 400;
}

#gform_wrapper_5 .hidden_label > .gfield_label,
#gform_wrapper_5 .hidden_label > legend {
	display: none !important;
}

/* Inputs — .medium/.large are GF sizing classes that must be neutralised */
#gform_wrapper_5 .ginput_container input[type="text"],
#gform_wrapper_5 .ginput_container input[type="email"],
#gform_wrapper_5 .ginput_container input[type="tel"],
#gform_wrapper_5 .ginput_container select,
#gform_wrapper_5 .ginput_container textarea {
	width: 100% !important;
	max-width: 100% !important;
	min-height: 40px !important;
	padding: 16px !important;
	border: 1px solid var(--color-neutral-200) !important;
	border-radius: 0 !important;
	background: #fff !important;
	color: #111827 !important;
	font-family: inherit !important;
	font-size: 16px !important;
	line-height: 1.4 !important;
	box-shadow: none !important;
	box-sizing: border-box !important;
}

#gform_wrapper_5 .ginput_container textarea {
	min-height: 360px !important;
	resize: vertical;
}

/* Selects — 9 of form 5's fields are selects, so the native control
   is replaced with a consistent chevron. Data URI keeps this
   self-contained (no asset dependency). */
#gform_wrapper_5 .ginput_container select {
	padding-right: 44px !important;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23111827' stroke-width='2'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 16px center !important;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

#gform_wrapper_5 .ginput_container input:focus,
#gform_wrapper_5 .ginput_container select:focus,
#gform_wrapper_5 .ginput_container textarea:focus {
	outline: 2px solid var(--color-primary-500);
	outline-offset: 0;
	border-color: var(--color-primary-500) !important;
}

/* Sublabels */
#gform_wrapper_5 .gform-field-label--type-sub {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
	margin: 0 0 8px !important;
	color: var(--color-black);
	font-size: 16px;
	font-weight: 400;
	line-height: 28px;
}

/* Validation — GF ships no CSS here (disable_css), so errors would
   otherwise be invisible against the default input treatment. */
#gform_wrapper_5 .gfield_error .ginput_container input,
#gform_wrapper_5 .gfield_error .ginput_container select,
#gform_wrapper_5 .gfield_error .ginput_container textarea {
	border-color: #c0392b !important;
}

#gform_wrapper_5 .validation_message {
	margin: 8px 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	color: #c0392b;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
}

#gform_wrapper_5 .validation_error {
	margin: 0 0 24px !important;
	padding: 16px !important;
	border: 1px solid #c0392b !important;
	background: none !important;
	color: #c0392b;
	font-size: 16px;
	line-height: 24px;
}

/* Footer / Submit */
#gform_wrapper_5 .gform_footer {
	margin-top: 24px !important;
	padding: 0 !important;
}

#gform_wrapper_5 .gform_button {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif;
	padding: 16px 24px !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: var(--color-primary-500) !important;
	color: var(--color-white) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 24px;
	letter-spacing: 0.03px;
	cursor: pointer;
}

/* -------------------------------
   Mobile - 767px
   ---------------------------- */
@media (max-width: 767px) {

	#gform_wrapper_5 .gform_title,
	#gform_wrapper_5 h2.gform_title {
		font-size: 18px !important;
		line-height: 24px !important;
		letter-spacing: -0.36px !important;
	}

	#gform_wrapper_5 .gform_fields {
		grid-template-columns: 1fr !important;
		gap: 24px !important;
	}

	#gform_wrapper_5 .gsection_title,
	#gform_wrapper_5 h2.gsection_title {
		font-size: 18px !important;
		line-height: 24px !important;
		letter-spacing: -0.36px;
	}

	#gform_wrapper_5 .ginput_container textarea {
		min-height: 260px !important;
	}

	#gform_wrapper_5 .gform_button {
		max-width: 50%;
		min-height: 60px !important;
		font-size: 18px !important;
	}
}
/* stylelint-enable selector-id-pattern */

/* ================================
 * Showroom Extended Styles
 * ============================= */
.dj-solid-btn a {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif !important;
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: 0.03px;
    color: var(--color-white);
    background-color: var(--color-primary-500);
    padding: 16px 24px;
    border-radius:0;

}

.dj-solid-btn a:hover {
    color: var(--color-white);
    background-color: var(--color-primary-600);
}

@media (max-width: 767px) {

    .dj-solid-btn a {
        padding: 12px 16px;
    }
}


/* =========================================================
   Consent Mode Banner
   ====================================================== */
.consent-banner-modal-wrapper h2 {
    font-family: var(--wp--preset--font-family--display, 'Saira SemiCondensed'), sans-serif !important;
    text-transform: uppercase;
    font-size: 22px !important;
}

#consent-banner-modal .consent-banner-modal-wrapper p {
    font-family: var(--wp--preset--font-family--body, 'Figtree'), sans-serif !important;
    font-size: 18px !important;
}

.consent-banner-modal-wrapper a {
    color: var(--color-primary-500);
}

.consent-banner-modal-wrapper a:hover {
    color: var(--color-black) !important;
}

#consent-banner-modal .consent-banner-modal-buttons [href="#settings"] {
    color: var(--color-primary-500) !important;
    border-color: var(--color-primary-500) !important;
}

#consent-banner-modal .consent-banner-modal-buttons [href="#settings"]:hover {
    color: var(--color-black) !important;
    border-color: var(--color-black) !important;
}

.consent-banner-button[href="#accept"] {
    color: var(--color-white) !important;
    background-color: var(--color-primary-500) !important;
    border-color: var(--color-primary-500) !important;
}

.consent-banner-button[href="#accept"]:hover {
    color: var(--color-white) !important;
    background-color: var(--color-black) !important;
    border-color: var(--color-black) !important;
}

.consent-banner-settings-buttons a {
    color: var(--color-primary-500) !important;
    border-color: var(--color-primary-500) !important;
}

.consent-banner-settings-buttons a:hover {
    color: var(--color-primary-500) !important;
    border-color: var(--color-primary-500) !important;
}

#consent-banner-settings .consent-banner-button[href="#accept"] {
    color: var(--color-white) !important;
}

#consent-banner-settings .consent-banner-button[href="#accept"]:hover {
    color: var(--color-white) !important;
    border-color: var(--color-black) !important;
}


/* =========================================================
   Search Results - Extended Styles
   ====================================================== */
@media (min-width: 767px) {

	.wp-block-query article:has(figure) {
    justify-self: start;
  }

  p.wp-block-post-excerpt__excerpt {
    max-width: 800px;
  }
}

@media (max-width: 767px) {

	.wp-block-query .wp-block-post-template article.wp-block-group {
		display: block;
	}

	.wp-block-query .wp-block-post-featured-image {
		width: 100%;
		margin: 0 0 16px;
	}

	.wp-block-query .wp-block-post-featured-image img {
		width: 100%;
		height: auto;
		display: block;
	}

	.wp-block-query .wp-block-post-title {
		clear: both;
	}
}
/* Equipment sticky CTA: force readable button text.
   Added 2026-09-17 during launch, needs folding into the theme PR. */
.equipment-cta__btn--primary {
	background-color: #105395 !important;
	color: #ffffff !important;
}
.equipment-cta__btn--primary:hover,
.equipment-cta__btn--primary:focus-visible {
	background-color: #ffffff !important;
	color: #105395 !important;
}
.equipment-cta__btn--secondary {
	background-color: transparent !important;
	color: #105395 !important;
}
.equipment-cta__btn--secondary:hover,
.equipment-cta__btn--secondary:focus-visible {
	background-color: #105395 !important;
	color: #ffffff !important;
}

/* Focus ring in ftm-blocks design system is unscoped and shows at rest.
   Proper fix belongs in ftm-blocks/design-system elements.css line ~131.
   Overriding here to avoid a shared-plugin change on prod. RD 2026-09-17 */
[type="search"],
[type="tel"],
[type="number"],
[type="password"],
[type="date"],
textarea,
select {
	box-shadow: none;
}

[type="search"]:focus-visible,
[type="tel"]:focus-visible,
[type="number"]:focus-visible,
[type="password"]:focus-visible,
[type="date"]:focus-visible,
textarea:focus-visible,
select:focus-visible {
	box-shadow: var(--ftm-focus-ring);
}

/* Arrow icon on related equipment cards renders in link blue on its own blue
   circle (1.13:1). The block's own rule loses to .entry-content a:where(...)
   in ftm-blocks/design-system/build/elements.css line ~112 on specificity.
   RD 2026-09-17 */
.entry-content a.equipment-related__cta,
.ftps-page-section-inner a.equipment-related__cta,
a.equipment-related__cta,
.entry-content a.equipment-related__cta:visited,
.entry-content a.equipment-related__cta:hover,
.entry-content a.equipment-related__cta:focus-visible {
color: var(--color-text-inverse, #fff);
}
