/* Stream RV — inventory archive (.srv-inventory, /rvs) + sold (.srv-sold,
   /sold-units), ported verbatim from the signed-off design (Inventory +
   Sold.html). Review chrome not shipped; save-state selectors extended for
   the save engine's .is-saved; sticky offset set to clear the 78px header.
   Engine's appended count badge is hidden (archive.js mirrors it into the
   design's own counter). */

.srv-inventory{--srv-sticky-offset:88px;}
.srv-inventory .bar__saved .srv-saved-link-n{display:none;}

.srv-inventory,.srv-sold{
  --primary:#0d1919; --primary-container:#222e2e; --on-primary:#ffffff;
  --secondary:#81550c; --brass-mid:#96682a; --secondary-container:#fdc171;
  --secondary-fixed:#ffddb5;
  --background:#fbf9f8; --surface:#f5f3f3; --on-surface-variant:#424848;
  --body-text:#1b1c1c; --outline:#c2c7c7;
  --line:rgba(34,46,46,.13); --line-2:rgba(34,46,46,.08);
  --maxw:1220px; --pad:26px;

  font-family:'Libre Franklin',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  color:var(--body-text);background:var(--background);line-height:1.62;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
:is(.srv-inventory,.srv-sold) *{box-sizing:border-box;}
.srv-inventory [hidden]{display:none!important;}
.srv-sold [hidden]{display:none!important;}
:is(.srv-inventory,.srv-sold) img{display:block;max-width:100%;}
:is(.srv-inventory,.srv-sold) :is(h1,h2,h3){
  font-family:'Vollkorn','Iowan Old Style','Palatino Linotype',Palatino,Georgia,serif;font-weight:600;margin:0;color:var(--primary-container);
  letter-spacing:-.02em;line-height:1.1;text-wrap:balance;}
:is(.srv-inventory,.srv-sold) p{margin:0;}
:is(.srv-inventory,.srv-sold) a{color:inherit;}
:is(.srv-inventory,.srv-sold) a[href^="tel:"]{white-space:nowrap;}
:is(.srv-inventory,.srv-sold) :is(button,select){font:inherit;}
:is(.srv-inventory,.srv-sold) :focus-visible{outline:2px solid var(--brass-mid);outline-offset:2px;border-radius:2px;}
:is(.srv-inventory,.srv-sold) .cw{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad);}
:is(.srv-inventory,.srv-sold) .eyebrow{font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--secondary);margin:0 0 14px;display:flex;align-items:center;gap:11px;}
:is(.srv-inventory,.srv-sold) .eyebrow::before{content:"";width:24px;height:1.5px;background:var(--brass-mid);flex:none;}
:is(.srv-inventory,.srv-sold) .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* buttons — strict pair rule: solid #222e2e primary + #81550c outline secondary */
:is(.srv-inventory,.srv-sold) .btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;font-weight:600;
  font-size:15.5px;font-family:'Libre Franklin',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;padding:14px 24px;min-height:52px;border-radius:4px;text-decoration:none;
  cursor:pointer;border:1.5px solid transparent;white-space:nowrap;}
:is(.srv-inventory,.srv-sold) .btn:active{transform:translateY(1px);}
:is(.srv-inventory,.srv-sold) .btn--primary{background:var(--primary-container);color:#fff;}
:is(.srv-inventory,.srv-sold) .btn--primary:hover{background:var(--primary);}
:is(.srv-inventory,.srv-sold) .btn--secondary{background:transparent;color:var(--secondary);border-color:var(--secondary);}
:is(.srv-inventory,.srv-sold) .btn--secondary:hover{background:var(--secondary);color:#fff;}

/* ==========================================================================
   THE CARD — shared by both surfaces (.rvcard)
   ========================================================================== */
:is(.srv-inventory,.srv-sold) .rvcard{position:relative;display:flex;flex-direction:column;
  background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;}
:is(.srv-inventory,.srv-sold) .rvcard:hover{border-color:var(--brass-mid);
  box-shadow:0 24px 50px -30px rgba(13,25,25,.45);}
:is(.srv-inventory,.srv-sold) .rvcard:focus-within{border-color:var(--brass-mid);}
/* media */
:is(.srv-inventory,.srv-sold) .rvcard__media{position:relative;aspect-ratio:16/9;background:var(--surface);overflow:hidden;}
:is(.srv-inventory,.srv-sold) .rvcard__media img{width:100%;height:100%;object-fit:cover;}
:is(.srv-inventory,.srv-sold) .rvcard:hover .rvcard__media img{transform:scale(1.03);}
/* hover photo-peek — DEV: second img = unit's best interior shot; omit when only one photo */
:is(.srv-inventory,.srv-sold) .rvcard__peek{position:absolute;inset:0;opacity:0;}
:is(.srv-inventory,.srv-sold) .rvcard:hover .rvcard__peek{opacity:1;}
/* photo-count chip — DEV: bind [data-photo-count]; omit chip when 0 photos */
:is(.srv-inventory,.srv-sold) .rvcard__photos{position:absolute;left:12px;bottom:11px;display:inline-flex;align-items:center;gap:7px;
  background:rgba(13,25,25,.66);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.16);color:#fff;
  font-size:11.5px;font-weight:600;letter-spacing:.03em;padding:5px 11px;border-radius:999px;pointer-events:none;}
:is(.srv-inventory,.srv-sold) .rvcard__photos svg{width:13px;height:13px;flex:none;}
/* label badge slot — DEV: data-driven; omit the span entirely when no label */
:is(.srv-inventory,.srv-sold) .rvcard__flag{position:absolute;top:12px;left:12px;
  font-size:10.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  background:var(--secondary-container);color:var(--body-text);padding:6px 11px;border-radius:6px;pointer-events:none;}
/* featured flag — paired with .rvcard--featured on the card */
.srv-inventory .rvcard__flag--featured{background:var(--primary-container);color:var(--secondary-fixed);
  border:1px solid var(--brass-mid);letter-spacing:.18em;}
/* body */
:is(.srv-inventory,.srv-sold) .rvcard__body{display:flex;flex-direction:column;gap:7px;padding:18px 20px 20px;flex:1;}
:is(.srv-inventory,.srv-sold) .rvcard__class{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--secondary);}
:is(.srv-inventory,.srv-sold) .rvcard__title{font-size:20px;line-height:1.2;letter-spacing:-.015em;}
:is(.srv-inventory,.srv-sold) .rvcard:hover .rvcard__title{color:var(--secondary);}
:is(.srv-inventory,.srv-sold) .rvcard__meta{font-size:13.5px;color:var(--on-surface-variant);}
/* price row — DEV: when price is null render .rvcard__price--ask variant instead
   (doc-fee wording lives on the single page only, never on the card) */
:is(.srv-inventory,.srv-sold) .rvcard__price{margin-top:auto;padding-top:12px;border-top:1px solid var(--line-2);
  font-family:'Vollkorn','Iowan Old Style','Palatino Linotype',Palatino,Georgia,serif;font-weight:600;font-size:23px;color:var(--secondary);letter-spacing:-.01em;line-height:1;}
:is(.srv-inventory,.srv-sold) .rvcard__price--ask{font-size:16.5px;color:var(--primary-container);padding-top:14px;}
/* ⚠ stretched link — SIBLING of the save button, never its parent */
:is(.srv-inventory,.srv-sold) .rvcard__link{position:absolute;inset:0;z-index:1;border-radius:14px;text-decoration:none;}
/* save control — sits ABOVE the link; clicking it must not navigate */
.srv-inventory .rvcard__save{position:absolute;top:12px;right:12px;z-index:2;width:40px;height:40px;border-radius:50%;padding:0;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  background:rgba(251,249,248,.92);border:1px solid var(--line);color:var(--primary-container);}
.srv-inventory .rvcard__save svg{width:17px;height:17px;flex:0 0 auto;}
.srv-inventory .rvcard__save .i-on{display:none;}
.srv-inventory .rvcard__save:hover{background:#fff;color:var(--secondary);border-color:var(--brass-mid);}
.srv-inventory .rvcard__save[aria-pressed="true"],.srv-inventory .rvcard__save.is-saved{background:var(--secondary);border-color:var(--secondary);color:#fff;}
.srv-inventory .rvcard__save[aria-pressed="true"] .i-on,.srv-inventory .rvcard__save.is-saved .i-on{display:block;}
.srv-inventory .rvcard__save[aria-pressed="true"] .i-off,.srv-inventory .rvcard__save.is-saved .i-off{display:none;}
@media (prefers-reduced-motion: no-preference){
  :is(.srv-inventory,.srv-sold) .rvcard{transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;}
  :is(.srv-inventory,.srv-sold) .rvcard:hover{transform:translateY(-4px);}
  :is(.srv-inventory,.srv-sold) .rvcard__media img{transition:transform .35s ease;}
  :is(.srv-inventory,.srv-sold) .rvcard__title{transition:color .18s;}
  .srv-inventory .rvcard__save{transition:background .18s,color .18s,border-color .18s;}
  :is(.srv-inventory,.srv-sold) .btn{transition:background .18s,color .18s,border-color .18s;}
  :is(.srv-inventory,.srv-sold) .rvcard__media img.rvcard__peek{transition:opacity .4s ease,transform .35s ease;}
  /* entrance — cards rise in once, staggered; base style is the visible end-state */
  .srv-inventory .grid--live > *{animation:srv-rise .55s cubic-bezier(.22,.7,.3,1) backwards;}
  .srv-inventory .grid--live > *:nth-child(2){animation-delay:.06s;}
  .srv-inventory .grid--live > *:nth-child(3){animation-delay:.12s;}
  .srv-inventory .grid--live > *:nth-child(4){animation-delay:.18s;}
  .srv-inventory .grid--live > *:nth-child(5){animation-delay:.24s;}
  .srv-inventory .grid--live > *:nth-child(6){animation-delay:.3s;}
  .srv-inventory .grid--live > *:nth-child(7){animation-delay:.36s;}
  .srv-inventory .grid--live > *:nth-child(8){animation-delay:.42s;}
  @keyframes srv-rise{from{opacity:0;transform:translateY(16px);}}
}

/* ==========================================================================
   SURFACE 1 — INVENTORY ARCHIVE  ·  .srv-inventory
   ========================================================================== */
/* intro */
.srv-inventory .intro{padding-top:clamp(40px,5vw,68px);padding-bottom:clamp(24px,3vw,36px);}
.srv-inventory .intro h1{font-size:clamp(32px,4.4vw,52px);letter-spacing:-.025em;}
.srv-inventory .intro__lede{margin-top:14px;font-size:clamp(15.5px,1.5vw,17.5px);color:var(--on-surface-variant);max-width:58ch;}
.srv-inventory .intro__lede a{color:var(--secondary);font-weight:600;text-decoration:none;}
.srv-inventory .intro__lede a:hover{color:var(--brass-mid);}

/* toolbar — DEV: controls are styled shells; wire filtering/sort to live data */
/* sticky wrapper — DEV: set --srv-sticky-offset to clear the Vehica sticky menu */
.srv-inventory .barwrap{position:sticky;top:var(--srv-sticky-offset,10px);z-index:30;}
.srv-inventory .barwrap.is-stuck .bar{box-shadow:0 18px 36px -20px rgba(13,25,25,.45);}
.srv-inventory .bar{background:var(--surface);border:1px solid var(--line);border-radius:14px;
  padding:16px 18px;display:flex;align-items:flex-end;justify-content:space-between;gap:16px 22px;flex-wrap:wrap;}
.srv-inventory .bar__filters{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;}
.srv-inventory .bar__toggle{display:none;}
.srv-inventory .f{display:flex;flex-direction:column;gap:5px;}
.srv-inventory .f label{font-size:10.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--on-surface-variant);}
.srv-inventory .f select,.srv-inventory .bar__sort select{
  appearance:none;-webkit-appearance:none;font-size:14px;font-weight:500;color:var(--body-text);
  background:var(--background) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2381550c' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center;
  border:1px solid var(--outline);border-radius:6px;padding:10px 32px 10px 13px;min-height:42px;cursor:pointer;min-width:128px;}
.srv-inventory .f select:hover,.srv-inventory .bar__sort select:hover{border-color:var(--brass-mid);}
.srv-inventory .f select:focus,.srv-inventory .bar__sort select:focus{outline:2px solid var(--brass-mid);outline-offset:0;border-color:var(--brass-mid);}
.srv-inventory .bar__meta{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;}
.srv-inventory .bar__count{font-size:14px;color:var(--on-surface-variant);padding-bottom:11px;white-space:nowrap;}
.srv-inventory .bar__count b{font-family:'Vollkorn','Iowan Old Style','Palatino Linotype',Palatino,Georgia,serif;font-weight:600;font-size:19px;color:var(--primary-container);}
/* saved-units link — DEV: href → Vehica saved/favorites page; count from save engine */
.srv-inventory .bar__saved{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:600;
  color:var(--on-surface-variant);text-decoration:none;padding-bottom:11px;white-space:nowrap;}
.srv-inventory .bar__saved svg{width:15px;height:15px;color:var(--brass-mid);flex:none;}
.srv-inventory .bar__saved:hover{color:var(--secondary);}
.srv-inventory .bar__saved[data-has-saved="true"]{color:var(--secondary);}
.srv-inventory .bar__sort{display:flex;flex-direction:column;gap:5px;}
.srv-inventory .bar__sort label{font-size:10.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--on-surface-variant);}

/* grid */
.srv-inventory .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,28px);
  padding:clamp(26px,3vw,38px) 0 clamp(56px,6vw,90px);}
/* FEATURED card — one unit, larger. DEV: set via inventory manager's per-unit
   "featured" toggle; add .rvcard--featured + the Featured flag, sort it first. */
.srv-inventory .rvcard--featured{grid-column:span 2;}
.srv-inventory .rvcard--featured .rvcard__media{aspect-ratio:16/7.6;}
.srv-inventory .rvcard--featured .rvcard__body{padding:22px 24px 24px;gap:8px;}
.srv-inventory .rvcard--featured .rvcard__title{font-size:27px;}
.srv-inventory .rvcard--featured .rvcard__meta{font-size:14.5px;}
.srv-inventory .rvcard--featured .rvcard__price{font-size:29px;}
/* TEASER card — non-listing "coming soon" card, always last in the grid */
.srv-inventory .rvcard--teaser{border:1.5px dashed rgba(184,132,58,.55);background:transparent;
  justify-content:center;gap:0;padding:26px 28px;}
.srv-inventory .rvcard--teaser:hover{transform:none;box-shadow:none;border-color:var(--brass-mid);}
.srv-inventory .teaser__k{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--secondary);}
.srv-inventory .rvcard--teaser h3{font-size:22px;margin:11px 0 9px;}
.srv-inventory .rvcard--teaser p:not(.teaser__k){font-size:14.5px;line-height:1.6;color:var(--on-surface-variant);}
.srv-inventory .rvcard--teaser a{color:var(--secondary);font-weight:600;text-decoration:none;}
.srv-inventory .rvcard--teaser a:hover{color:var(--brass-mid);}

/* empty state */
.srv-inventory .empty{padding:clamp(56px,7vw,100px) 0 clamp(70px,8vw,110px);text-align:center;}
.srv-inventory .empty__inner{max-width:430px;margin:0 auto;}
.srv-inventory .empty svg{width:40px;height:40px;color:var(--brass-mid);margin:0 auto 18px;display:block;}
.srv-inventory .empty h2{font-size:clamp(24px,2.6vw,30px);margin-bottom:10px;}
.srv-inventory .empty p{font-size:15.5px;color:var(--on-surface-variant);margin-bottom:22px;}
.srv-inventory .empty__reset{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;
  color:var(--secondary);text-decoration:none;background:none;border:none;cursor:pointer;padding:4px 2px;}
.srv-inventory .empty__reset:hover{color:var(--brass-mid);}

/* loading skeleton */
.srv-inventory .skel{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;}
.srv-inventory .skel__media{aspect-ratio:16/9;background:var(--surface);}
.srv-inventory .skel__body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:11px;}
.srv-inventory .skel__line{height:13px;border-radius:6px;background:var(--surface);}
.srv-inventory .skel__line--sm{width:34%;}
.srv-inventory .skel__line--lg{height:19px;width:78%;}
.srv-inventory .skel__line--md{width:50%;}
.srv-inventory .skel__line--price{width:42%;height:17px;margin-top:10px;}
@media (prefers-reduced-motion: no-preference){
  .srv-inventory .skel{position:relative;}
  .srv-inventory .skel::after{content:"";position:absolute;inset:0;
    background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);
    background-size:220% 100%;animation:srv-shimmer 1.5s ease-in-out infinite;}
  @keyframes srv-shimmer{from{background-position:160% 0;}to{background-position:-60% 0;}}
}

/* ==========================================================================
   SURFACE 2 — SOLD INVENTORY  ·  .srv-sold
   ========================================================================== */
.srv-sold .intro{padding-top:clamp(40px,5vw,68px);padding-bottom:clamp(26px,3vw,40px);}
.srv-sold .intro h1{font-size:clamp(32px,4.4vw,52px);letter-spacing:-.025em;}
.srv-sold .intro__lede{margin-top:14px;font-size:clamp(15.5px,1.5vw,17.5px);color:var(--on-surface-variant);max-width:58ch;}
.srv-sold .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,28px);
  padding:0 0 clamp(50px,5.5vw,80px);}
/* sold modifier — same card, derived: Sold badge, no price, no save (photos stay full color) */
.srv-sold .rvcard__flag--sold{background:var(--primary-container);color:var(--secondary-fixed);
  border:1px solid var(--brass-mid);letter-spacing:.2em;padding:6px 12px;}
.srv-sold .rvcard__body{padding-bottom:18px;}
/* closing CTA */
.srv-sold .hunt{background:var(--primary-container);}
.srv-sold .hunt__row{display:flex;align-items:center;justify-content:space-between;gap:22px 36px;flex-wrap:wrap;
  padding-top:clamp(34px,4vw,52px);padding-bottom:clamp(34px,4vw,52px);}
.srv-sold .hunt h2{color:var(--background);font-size:clamp(23px,2.6vw,31px);margin-bottom:8px;}
.srv-sold .hunt p{color:#CFC6B8;font-size:15.5px;max-width:52ch;}
.srv-sold .hunt p a{color:var(--secondary-fixed);font-weight:600;text-decoration:none;}
.srv-sold .hunt p a:hover{color:var(--secondary-container);}
.srv-sold .hunt__actions{display:flex;gap:12px;flex-wrap:wrap;}
.srv-sold .hunt .btn--brass{background:var(--secondary-container);color:var(--body-text);}
.srv-sold .hunt .btn--brass:hover{background:var(--secondary-fixed);}
.srv-sold .hunt .btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.7);}
.srv-sold .hunt .btn--ghost:hover{background:rgba(255,255,255,.1);border-color:#fff;}

/* ==========================================================================
   STATES — data-state on .srv-inventory (demo panel drives; dev drives live)
   ========================================================================== */
.srv-inventory[data-state="grid"] :is(.empty,.loading){display:none;}
.srv-inventory[data-state="empty"] :is(.grid--live,.loading){display:none;}
.srv-inventory[data-state="loading"] :is(.grid--live,.empty){display:none;}

/* ===== RESPONSIVE ===== */
@media (max-width:1020px){
  .srv-inventory .grid,.srv-sold .grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:760px){
  /* filters collapse into a drawer */
  .srv-inventory .bar{align-items:center;}
  .srv-inventory .bar__toggle{display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:600;
    color:var(--body-text);background:var(--background);border:1px solid var(--outline);border-radius:6px;
    padding:10px 16px;min-height:42px;cursor:pointer;}
  .srv-inventory .bar__toggle svg{width:15px;height:15px;color:var(--secondary);flex:none;}
  .srv-inventory .bar__toggle[aria-expanded="true"]{border-color:var(--brass-mid);color:var(--secondary);}
  .srv-inventory .bar__filters{display:none;}
  .srv-inventory .bar__filters.is-open{display:grid;grid-template-columns:1fr 1fr;gap:14px;width:100%;order:3;
    padding-top:16px;border-top:1px solid var(--line);margin-top:2px;}
  .srv-inventory .f select{width:100%;min-width:0;}
  .srv-inventory .bar__meta{margin-left:auto;}
  .srv-inventory .bar__count{padding-bottom:0;}
  .srv-inventory .bar__sort label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
  .srv-inventory .bar__sort select{min-width:0;}
  .srv-sold .hunt__row{flex-direction:column;align-items:flex-start;}
}
@media (max-width:600px){
  .srv-inventory .grid,.srv-sold .grid{grid-template-columns:1fr;}
  .srv-inventory .rvcard--featured{grid-column:auto;}
  .srv-inventory .rvcard--featured .rvcard__media{aspect-ratio:16/9;}
  .srv-inventory .rvcard--featured .rvcard__title{font-size:22px;}
  .srv-inventory .rvcard--featured .rvcard__price{font-size:25px;}
  .srv-inventory .bar{padding:14px;}
  .srv-inventory .bar__filters.is-open{grid-template-columns:1fr;}
}
@media (max-width:480px){
  .srv-inventory,.srv-sold{--pad:20px;}
}