/* The city and vehicle landing pages are server-rendered outside base.html.
   Keep their shell, typography and controls on the same visual contract as
   the main marketplace without changing their route or booking behavior. */
body.standalone-page {
    --nr-font: 'Manrope', 'Segoe UI', system-ui, sans-serif;
    --nr-red: #cc0000;
    --nr-ink: #17202a;
    --nr-muted: #68717d;
    --nr-line: #e5e7eb;
    font-family: var(--nr-font) !important;
    color: var(--nr-ink) !important;
    background: #f4f6f9 !important;
}

body.standalone-page > header,
body.standalone-page > .bar {
    background: #20242c !important;
    border-bottom: 2px solid #cc0000;
    color: #fff;
}

body.standalone-page > header .bar,
body.standalone-page > header .bar-inner,
body.standalone-page > .bar-inner {
    max-width: 1265px;
    min-height: 58px;
    margin: 0 auto;
    padding: 8px clamp(16px, 3vw, 28px) !important;
    align-items: center;
}

body.standalone-page .logo,
body.standalone-page .brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    font-family: var(--nr-font);
    font-size: 19px !important;
    font-weight: 850 !important;
    letter-spacing: -.025em;
    text-decoration: none;
}

.standalone-brand-mark {
    display: inline-grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 9px;
    background: #d71924;
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: -.04em;
}

body.standalone-page .standalone-tools {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255, 255, 255, .76);
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap;
}

body.standalone-page .standalone-tools a {
    color: inherit;
    text-decoration: none;
}

body.standalone-page .standalone-tools a:hover,
body.standalone-page .standalone-tools a:focus-visible {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 3px;
}

body.standalone-page .standalone-tools .back {
    margin-left: 5px;
    padding-left: 12px;
    border-left: 1px solid rgba(255, 255, 255, .25);
    font-size: 12px !important;
}

body.standalone-page main,
body.standalone-page .wrap {
    max-width: 1265px;
    margin: 0 auto;
}

body.standalone-page .site-breadcrumbs {
    margin: 18px 0 20px;
}

body.standalone-page .page-context-hero {
    margin-top: 0;
}

body.standalone-page .lead h1,
body.standalone-page .title {
    font-family: var(--nr-font) !important;
    letter-spacing: -.04em;
}

body.standalone-page img {
    max-width: 100%;
}

@media (max-width: 640px) {
    body.standalone-page > header .bar,
    body.standalone-page > header .bar-inner,
    body.standalone-page > .bar-inner {
        min-height: 54px;
        padding: 8px 16px !important;
    }

    body.standalone-page .standalone-tools {
        gap: 7px;
        font-size: 11px;
    }

    body.standalone-page .standalone-tools .back {
        max-width: 116px;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}
