/* /company/<slug> (SER-596, boards/Company.html + Mobile.html). Page-only rules on the base.css
   tokens; the shared classes (.wrap, .disp, .btn, .chip, .car, .badge, .mrow, .lbl, .inp…) come
   from base.css under .crl. One gold accent per block: the Call (or first) button in the contact
   bar, the lowest price in "At a glance", the offer frame. */

.co-page { position: relative; }
.co-page .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; }
.co-page :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.co-page [id] { scroll-margin-top: 96px; }
.co-page h1, .co-page h2, .co-page h3, .co-page p { margin: 0; }

/* ---- cover: owner photo (Pro/Premium) → city photo → plain band */
.co-cover { position: relative; overflow: hidden; min-height: 360px; display: flex; align-items: flex-end; background: var(--s1); border-bottom: 1px solid var(--line); }
.co-cover.has-img { min-height: 520px; }
.co-cover-img { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 60%; }
.co-cover.has-img::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(0deg, var(--bg) 4%, rgba(10, 10, 11, .62) 45%, rgba(10, 10, 11, .3) 100%); }
.co-cover-in { position: relative; z-index: 2; width: 100%; padding-top: 48px; padding-bottom: 40px; }
.co-crumbs { font-size: 14px; color: var(--mu); margin-bottom: 24px; }
.co-crumbs a { color: var(--mu); }
.co-crumbs a:hover { color: var(--tx); }
.co-head { display: flex; gap: 28px; align-items: center; flex-wrap: wrap; }
.co-logo-box { width: 112px; height: 112px; justify-content: center; background: var(--bg); border: 1px solid var(--accent); padding: 12px; box-sizing: border-box; }
.co-logo-box img { width: 88px; height: 88px; object-fit: contain; }
.co-logo-word .co-word { text-align: center; overflow-wrap: normal; hyphens: auto; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.co-title { flex: 1 1 420px; min-width: 0; }
.co-name { display: flex; align-items: center; gap: 12px 18px; flex-wrap: wrap; }
/* SER-641: neither item shrinks, so a name that does not fit beside the badge pushes the badge onto its own line
   instead of squeezing into a narrow column; max-width lets a single very long word still wrap inside the h1. */
.co-name > h1 { flex: 0 0 auto; max-width: 100%; }
.co-name > .co-badges { flex: 0 0 auto; }
.co-badges { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 0; }
.co-badges .badge { cursor: help; }
.co-title h1 { font-size: clamp(36px, 6vw, 80px); overflow-wrap: anywhere; }
.co-meta { display: flex; gap: 8px 24px; flex-wrap: wrap; margin-top: 14px; font-size: 16px; color: var(--tx-2); }
.co-meta .price { color: var(--tx); }
.co-updated { margin-top: 10px; font-size: 14px; color: var(--mu); }

/* ---- contact bar (sticky at the top above 600 px) */
.co-bar { position: sticky; top: 0; z-index: 5; background: rgba(10, 10, 11, .94); border-bottom: 1px solid var(--line); }
.co-bar-in { display: flex; gap: 12px 24px; align-items: center; justify-content: space-between; flex-wrap: wrap; padding-top: 14px; padding-bottom: 14px; }
.co-bar-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.co-bar-nav { display: flex; gap: 22px; flex-wrap: wrap; }
.co-bar-nav a { display: inline-flex; align-items: center; min-height: var(--tap); color: var(--tx); font-weight: 700; text-decoration: none; }
.co-bar-nav a:hover { color: var(--accent); }

/* ---- terms at a glance (SER-662, render/rental-terms.js): a row under the contact bar, only
   when the company publishes at least one term; unknown ones read "Ask the company" */
.co-terms { padding-top: 32px; }
.co-terms-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1px; margin: 12px 0 0; background: var(--line); border: 1px solid var(--line); }
.co-term { background: var(--bg); padding: 14px 16px; min-width: 0; }
.co-term dt { font-size: 13px; }
.co-term dd { margin: 4px 0 0; font-weight: 700; color: var(--tx); overflow-wrap: anywhere; }
.co-term.unknown dd { font-weight: 400; color: var(--mu); }
.co-terms-src { margin-top: 10px; font-size: 13px; }
.co-terms-src a { color: inherit; }

/* ---- sections */
.co-sec { padding-top: 72px; }
.co-sec-head { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 20px; margin-bottom: 24px; }
.co-h2 { font-size: clamp(28px, 4vw, 44px); }
.co-h3 { font-size: 24px; margin-bottom: 16px; }

/* special offer (Pro/Premium, SER-528): the block's one accent is its frame */
.co-offer-wrap { padding-top: 40px; }
.co-offer { border: 1px solid var(--accent); padding: 20px 24px; display: flex; gap: 10px 20px; align-items: baseline; flex-wrap: wrap; }
.co-offer p { font-size: 17px; color: var(--tx); flex: 1 1 320px; overflow-wrap: anywhere; }

/* fleet */
.co-makes { display: flex; gap: 8px; flex-wrap: wrap; }
.co-makes .chip { gap: 8px; min-height: var(--tap); }
.co-makes .chip:hover { color: var(--accent); }
.co-fleet { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }
.co-car:hover { border-color: var(--accent); color: var(--tx); }
.co-car-ph { position: relative; aspect-ratio: 4 / 3; background: var(--s2); display: flex; align-items: center; justify-content: center; color: var(--mu); }
.co-car-ph img { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; }
.co-car-body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 4px; }
.co-car-name { font-weight: 700; font-size: 17px; }
.co-car-sub { font-size: 14px; }
.co-car-price { margin-top: 8px; font-size: 14px; }
.co-car-price .price { font-size: 22px; }
/* SER-615: identical listings shown once, with their number */
.co-car-count { align-self: flex-start; margin-top: 6px; font-size: 12px; font-weight: 700; padding: 2px 8px; border: 1px solid var(--ghost-border); color: var(--mu); }
/* SER-619: profile summary built from the listing data when the company has no description */
.co-auto-note { font-size: 13px; margin-top: 6px; }
.co-auto .claim-cta { margin-top: 12px; }
.co-more { margin-top: 24px; text-align: center; }

/* about, rental terms, at a glance + inquiry form */
.co-info { display: flex; flex-wrap: wrap; gap: 56px; align-items: flex-start; }
.co-info-main { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 48px; }
.co-lead { margin-top: 16px; font-size: 18px; color: var(--tx-2); max-width: 720px; overflow-wrap: anywhere; }
.co-spec { margin-top: 20px; }
.co-tags { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.co-tags li { border: 1px solid var(--line); border-radius: var(--radius-pill); padding: 6px 14px; font-size: 14px; }
.co-kv { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 16px; padding: 16px 0; border-top: 1px solid var(--line); }
.co-glance .co-h2 { margin-bottom: 16px; }
.co-glance .co-kv:last-child { border-bottom: 1px solid var(--line); }
.co-glance .price { color: var(--accent); }

/* explore more, other rentals */
.co-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 40px 56px; }
.co-links .mrow { min-height: var(--tap); align-items: center; gap: 16px; }
.co-links .mrow:last-child { border-bottom: 1px solid var(--line); }

/* source + last checked (SER-505), claim link */
.co-source { margin-top: 72px; padding-top: 28px; padding-bottom: 72px; display: flex; justify-content: space-between; gap: 16px 32px; flex-wrap: wrap; border-top: 1px solid var(--line); font-size: 14px; }
.co-source .claim-cta, .co-auto .claim-cta { color: var(--mu); max-width: 620px; }
.co-source .claim-cta a, .co-auto .claim-cta a { font-weight: 700; }

/* ---- mobile Call + Request bar (motion kit 10: .sticky-cta) */
.co-mbar { display: none; }

@media (max-width: 900px) {
  .co-kv { grid-template-columns: 1fr; gap: 4px; }
}
@media (max-width: 600px) {
  .co-cover { min-height: 300px; }
  .co-cover.has-img { min-height: 340px; }
  .co-cover-in { padding-top: 28px; padding-bottom: 20px; }
  .co-crumbs { margin-bottom: 16px; }
  .co-head { gap: 16px; align-items: center; }
  .co-logo-box { width: 72px; height: 72px; padding: 8px; }
  .co-logo-box img { width: 56px; height: 56px; }
  .co-logo-word { display: none; }
  .co-call-num { display: none; }
  .co-title { flex-basis: 100%; }
  .co-meta { font-size: 14px; gap: 4px 14px; }
  .co-bar { position: static; }
  .co-page [id] { scroll-margin-top: 16px; }
  .co-bar-in { padding-top: 16px; padding-bottom: 16px; }
  .co-bar-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px; width: 100%; }
  .co-bar-actions .btn { padding: 0 12px; white-space: normal; text-align: center; }
  .co-bar-nav { display: none; }
  .co-sec { padding-top: 48px; }
  .co-info { gap: 48px; }
  .co-source { margin-top: 48px; padding-bottom: 32px; }
  .co-mbar { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; z-index: 6; padding: 12px var(--gutter) calc(12px + env(safe-area-inset-bottom, 0px)); background: rgba(10, 10, 11, .96); border-top: 1px solid var(--line); }
  .co-mbar-1 { grid-template-columns: 1fr; }
  .co-mbar .btn { padding: 0 12px; }
}