/* Plot single — "Back to {Development}" bar (Liam live review 2026-07-28,
   Renmore house-type-page parity: rh-back-bar). No Figma frame exists for
   this bar — a behaviour port like the lightbox; chrome derived from
   Vivly's own conventions, flagged for Liam's live judgement:
     - cornflower band (designer notes: cornflower marks non-body chrome;
       it pairs with the same-coloured anchor bar this page already has)
     - black 18px Omnes regular link + chevron, brick underline hover —
       the anchor bar's exact link treatment (dev-anchor.css)
     - slim 48px (subordinate to the 82px anchor bar), 40px mobile.
   Placement: first element inside <main>, ABOVE the hero fold — normal
   flow, so it scrolls away with the static header exactly as Renmore's
   does. Its scroll-up twin is the anchor bar's collapsed Back link
   (dev-anchor.css .vl-dev-anchor__back, shown while pinned + scrolling
   up), so a back affordance exists at both ends of the scroll. */

/* Header-width, not container-width (Liam live review 2026-07-28): the bar
   is chrome, so it follows the HEADER's box principle — full-bleed band,
   content padded by var(--vl-edge) only (header.css .vl-nav__inner), NOT
   the 1600px .vl-container the page sections use. The link therefore
   left-aligns with the header logo above it, and the earlier shrink-fit
   container-centring bug can't recur (there's no container). */
.vl-back-bar {
    display: flex;
    align-items: center;
    height: 48px;
    padding-inline: var(--vl-edge);
    background: var(--vl-cornflower);
}

.vl-back-bar__link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--vl-black);
    font-size: var(--vl-text-nav); /* 18px — anchor-bar link parity */
    font-weight: var(--vl-weight-regular);
    text-decoration: none;
    white-space: nowrap;
    transition: transform 0.2s ease;
}

/* Hover/press nudge, -10px along x — "back" direction (Liam live review
   2026-07-28, all three back affordances move the same way; :active covers
   the touch press on tablet/mobile). */
.vl-back-bar__link:hover,
.vl-back-bar__link:active {
    transform: translateX(-10px);
}

/* Brick underline — the sitewide nav-link hover convention
   (header.css .vl-nav__link, dev-anchor.css links). */
.vl-back-bar__link:hover {
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 6px;
    text-decoration-color: var(--vl-brick);
}

.vl-back-bar__link:focus-visible {
    outline: 2px solid var(--vl-ink); /* cornflower ring would vanish on this cornflower band */
    outline-offset: 2px;
}

.vl-back-bar__chevron {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

@media (max-width: 767px) {
    .vl-back-bar {
        height: 40px; /* derived scale-down, no frame — responsive pass judges */
    }
}