/* Variables used by header divider */ :root
{
    --peak64-accent: var(--yellow, #f2df45);
} /* Turn off native borders/shadows so we fully control the line */ .main-header-bar,
.ast-primary-header
{
    border: none !important; box-shadow: none !important;
} /* Add "CAR MODEL" text after the logo image */ .custom-logo-link::after
{
    font-size: .8rem; font-weight: 600; display: inline-block; margin-left: .75rem; content: ' CAR MODELS'; vertical-align: middle; letter-spacing: .35em; color: #6ec17d;
} /* Header background + text colors */ .site-header,
.main-header-bar,
.main-header-menu,
.site-branding,
.ast-primary-header
{
    background-color: transparent !important;
} .site-header .site-title a,
.site-header .site-description
{
    color: #fff !important;
} /* Primary nav links */ .main-header-menu a
{
    text-decoration: none; color: #fff !important;
} .main-header-menu a:hover
{
    color: var(--pink) !important;
} /* Mobile header & off-canvas menu (Astra) */ .ast-mobile-popup-drawer,
.ast-mobile-popup-drawer.active,
.ast-mobile-popup-inner,
.ast-mobile-popup-content,
.ast-off-canvas-sidebar,
.ast-mobile-header-wrap,
.ast-main-header-wrap
{
    border: none !important; background: #0a0a0a !important; background-color: #0a0a0a !important; box-shadow: none !important;
} #ast-hf-mobile-menu
{
    border: none !important; background: #0a0a0a !important; background-color: #0a0a0a !important; box-shadow: none !important;
} /* Reset inner backgrounds */ #ast-hf-mobile-menu *,
.ast-mobile-popup-content *
{
    border: none !important; background: transparent !important; background-color: transparent !important; box-shadow: none !important;
} /* Mobile list containers */ #ast-hf-mobile-menu .main-header-menu,
#ast-hf-mobile-menu .main-header-menu > li,
#ast-hf-mobile-menu .menu,
#ast-hf-mobile-menu .menu > li
{
    background: #0a0a0a !important; background-color: #0a0a0a !important;
} /* Mobile link styling */ #ast-hf-mobile-menu .menu-item > a,
#ast-hf-mobile-menu .menu-link
{
    font-weight: 500; display: block; padding: 12px 16px; text-decoration: none !important; color: #fff !important; border-radius: 10px;
} #ast-hf-mobile-menu .menu-item > a:hover,
#ast-hf-mobile-menu .current-menu-item > a,
#ast-hf-mobile-menu .current_page_item > a
{
    color: #fff !important; background: rgba(255, 255, 255, .08) !important;
} /* Carets & toggles */ #ast-hf-mobile-menu .ast-menu-toggle,
#ast-hf-mobile-menu .ast-icon
{
    color: #fff !important; fill: #fff !important;
} /* Transparent header overrides on mobile */ .ast-transparent-header .ast-mobile-header-wrap,
.ast-transparent-header #ast-hf-mobile-menu
{
    background: #0a0a0a !important;
} /* Remove stray outlines/dividers */ .ast-mobile-popup-content,
#ast-hf-mobile-menu
{
    border: none !important; box-shadow: none !important;
} /* Close (X) button color */ .ast-mobile-popup-drawer .menu-toggle-close
{
    color: #fff !important;
} /* Mobile hamburger icon */ .ast-button-wrap .menu-toggle,
.ast-mobile-menu-trigger-minimal,
.ast-mobile-menu-buttons .menu-toggle,
.ast-mobile-header-wrap .ast-button-wrap .menu-toggle
{
    color: #fff !important; fill: #fff !important; stroke: #fff !important;
} .ast-button-wrap .menu-toggle svg,
.ast-button-wrap .menu-toggle svg path,
.ast-mobile-menu-buttons .menu-toggle svg,
.ast-mobile-menu-buttons .menu-toggle svg path
{
    stroke: #fff !important; fill: #fff !important;
} /* Header divider — matches footer gradient line */ .site-header .main-header-bar,
.ast-header-break-point .ast-mobile-header-wrap
{
    position: relative;
} .site-header .main-header-bar::after,
.ast-sticky-active .main-header-bar::after,
.ast-header-break-point .ast-mobile-header-wrap::after
{
    position: absolute; z-index: 2; bottom: 0; left: 50%; width: min(1200px,92%); /* aligns with .peak64-wrap width */ height: 1px; content: ''; transform: translateX(-50%); pointer-events: none; opacity: .95; background: linear-gradient(90deg, transparent, var(--peak64-accent), transparent);
}

/* Header divider — full-bleed across the whole screen */
.site-header .main-header-bar::after,
.ast-sticky-active .main-header-bar::after,
.ast-header-break-point .ast-mobile-header-wrap::after
{
    position: absolute;
    z-index: 2;
    right: 0;              /* full bleed */
    bottom: 0;
    left: 0;               /* full bleed */

    width: auto;           /* override previous min(1200px,92%) */
    height: 2px;           /* draw 2px then scale for crisp hairline */

    content: '';
    transform: none;       /* cancel previous translateX */
    /* optional: crisp 1px look on all DPIs */
    transform: scaleY(.5);
    transform-origin: bottom;
    pointer-events: none;

    opacity: .95;
    background: linear-gradient(90deg, transparent, var(--peak64-accent), transparent);
}

/* ===== Peak64 header icon buttons (updated) ===== */
:root
{
    --peak64-border: rgba(80,115,173,.35); /* subtle blue outline */
    --peak64-badge: #e64686;               /* pink badge */
    --peak64-text: #fff;
    /* Sizing tweaks */
    --peak64-btn-size: 40px;   /* was 44px */
    --peak64-icon-size: 26px;  /* was 22px */
}

/* Icon button shell */
.peak64-icon-btn
{
    position: relative;

    display: inline-grid;

    width: var(--peak64-btn-size);
    height: var(--peak64-btn-size);
    margin-left: .5rem;

    transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
    text-decoration: none;

    color: var(--peak64-text);
    /* Base look */
    border: 1px solid var(--peak64-border);
    /* Compact/glassy tweak */
    border-color: rgba(80,115,173,.18);
    border-radius: 12px;
    background: rgba(255,255,255,.03);
    background: rgba(7,20,40,.25);
    box-shadow: inset 0 0 0 1px rgba(80,115,173,.25);

    place-items: center;
}

.peak64-icon-btn:hover
{
    transform: translateY(-1px);

    border-color: color-mix(in oklab, var(--peak64-border), #fff 40%);
    box-shadow: 0 0 0 4px rgba(80,115,173,.08);
}

/* SVG size inside */
.peak64-icon
{
    display: block;

    width: var(--peak64-icon-size);
    height: var(--peak64-icon-size);
}

/* Keep strokes crisp when scaled */
.peak64-icon *,
.peak64-icon path,
.peak64-icon circle,
.peak64-icon rect
{
    vector-effect: non-scaling-stroke;
}

/* Badge for cart count (hidden when empty) */
.peak64-badge
{
    font-size: 11px;
    font-weight: 700;
    line-height: 1;

    position: absolute;
    top: -5px;
    right: -5px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 18px;
    height: 18px;
    padding: 0 6px;

    color: #fff;
    border: 2px solid #0a0a0a; /* cutout against dark header */
    border-radius: 999px;
    background: var(--peak64-badge);
}
.peak64-badge:empty
{
    display: none;
}

/* Keep alignment with your existing primary menu */
.main-header-menu
{
    display: flex;
    align-items: center;

    gap: 24px;
}

/* Accessibility helper */
.sr-only
{
    position: absolute !important;

    overflow: hidden;
    clip: rect(1px,1px,1px,1px);

    width: 1px; height: 1px;

    white-space: nowrap;
}

/* ===== Peak64 menu spacing overrides ===== */
:root
{
    --peak64-nav-gap: 16px;
    --peak64-nav-pad-x: .35rem;
    --peak64-icon-gap: .4rem;
    --peak64-mobile-item-py: 8px;
    --peak64-mobile-item-px: 12px;
    --peak64-mobile-li-gap: 2px;
}


.main-header-menu
{
    display: flex;
    align-items: center;

    gap: var(--peak64-nav-gap) !important;
}
.main-header-menu > li
{
    margin: 0 !important;
}
.main-header-menu > li > a
{
    padding-inline: var(--peak64-nav-pad-x) !important;
}


.peak64-icon-btn
{
    margin-left: var(--peak64-icon-gap);
}


.ast-header-break-point #ast-hf-mobile-menu .menu-item > a,
.ast-header-break-point #ast-hf-mobile-menu .menu-link
{
    line-height: 1.3 !important;

    padding: var(--peak64-mobile-item-py) var(--peak64-mobile-item-px) !important;
}


.ast-header-break-point #ast-hf-mobile-menu .menu > li,
.ast-header-break-point #ast-hf-mobile-menu .main-header-menu > li
{
    margin: var(--peak64-mobile-li-gap) 0 !important;
}


.ast-header-break-point #ast-hf-mobile-menu .sub-menu .menu-link
{
    padding: calc(var(--peak64-mobile-item-py) - 2px) var(--peak64-mobile-item-px) !important;
}


.ast-header-break-point #ast-hf-mobile-menu .menu-item > a,
.ast-header-break-point #ast-hf-mobile-menu .menu-link,
.main-header-menu > li > a
{
    border: none !important;
    background: transparent !important;
}

/* ===== Peak64: icons in mobile header bar ===== */
.peak64-mobile-icons
{
    display: none; align-items: center; gap: var(--peak64-icon-gap);
}

/* Astra toggles a body class at its mobile breakpoint */
.ast-header-break-point .ast-mobile-header-wrap .peak64-mobile-icons
{
    display: inline-flex;
}

.ast-header-break-point .ast-mobile-header-wrap .ast-mobile-menu-buttons
{
    display: flex; align-items: center; gap: .35rem;
}

/* Keep the mobile icons same size as desktop buttons */
.ast-header-break-point .peak64-mobile-icons .peak64-icon-btn
{
    width: var(--peak64-btn-size);
    height: var(--peak64-btn-size);
}

/* Force transparent desktop header wrapper so body gradient shows */
#masthead,
.site-header,
.main-header-bar-wrap,
.main-header-bar,
.ast-primary-header,
.ast-primary-header-bar,
.ast-sticky-active .main-header-bar,
.ast-sticky-active .main-header-bar-wrap
{
    background: transparent !important;
    background-color: transparent !important;
}
