/* Serra Honda research pages. Scoped under .shr so nothing leaks into the
   Dealer.com header, nav or footer, and every rule declares its own type,
   colour and spacing rather than inheriting the host theme. Weight is bought
   with specificity, never !important, because the layout carries detail in
   inline style="" and a stylesheet !important would override it. */
.shr, .shr * { box-sizing: border-box; }
.shr { --shr-accent: #3375bb; }
.shr { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 16px; line-height: 1.5; background: #F4F4F2; color: #101314; -webkit-font-smoothing: antialiased; text-wrap: pretty; }
.shr.shr h1, .shr.shr h2, .shr.shr h3, .shr.shr h4 { margin: 0; letter-spacing: -.02em; font-family: inherit; color: inherit; line-height: 1.15; }
.shr.shr p { margin: 0; }
.shr ul, .shr ol { margin: 0; padding-left: 1.2em; }
.shr img { max-width: 100%; vertical-align: middle; border-style: none; }
.shr sup { font-size: 10px; color: #255a92; font-weight: 700; }
.shr a:link, .shr a:visited { color: #255a92; background-color: transparent; text-decoration: none; }
.shr a:link:hover, .shr a:visited:hover { color: #1a4470; text-decoration: underline; }
.shr .wrap { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
.shr .kicker { display: flex; align-items: center; gap: 10px; font: 700 11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .14em; color: #3375bb; }
.shr .kicker span:first-child { display: inline-block; width: 26px; height: 2px; background: #3375bb; }

/* pills */
.shr a.pill, .shr a.pill:link, .shr a.pill:visited { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 52px; padding: 0 26px; border-radius: 999px; font-weight: 700; font-size: 14px; letter-spacing: .01em; text-decoration: none; border: 2px solid transparent; transition: background .15s, color .15s; white-space: nowrap; }
.shr a.pill-blue, .shr a.pill-blue:link, .shr a.pill-blue:visited { background: #3375bb; color: #fff; border-color: #3375bb; }
.shr a.pill-blue:hover { background: #255a92; border-color: #255a92; color: #fff; text-decoration: none; }
.shr a.pill-ghost-dark, .shr a.pill-ghost-dark:link, .shr a.pill-ghost-dark:visited { background: transparent; color: #fff; border-color: rgba(255,255,255,.55); }
.shr a.pill-ghost-dark:hover { background: rgba(255,255,255,.12); color: #fff; text-decoration: none; }
.shr a.pill-ghost, .shr a.pill-ghost:link, .shr a.pill-ghost:visited { background: transparent; color: #101314; border-color: rgba(16,19,20,.35); }
.shr a.pill-ghost:hover { background: rgba(16,19,20,.06); color: #101314; text-decoration: none; }

/* hero */
.shr .hero { position: relative; color: #fff; background: #0D0F10; }
.shr .hero-inner { position: relative; max-width: 1280px; margin: 0 auto; padding: 56px 24px 60px; display: grid; grid-template-columns: minmax(0,1.15fr) minmax(300px,392px); gap: 52px; align-items: end; }
.shr .crumbs { font-size: 11.5px; letter-spacing: .14em; color: rgba(255,255,255,.55); display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.shr .crumbs a:link, .shr .crumbs a:visited { color: rgba(255,255,255,.75); }
.shr .crumbs span.cur { color: #fff; }
.shr .hero h1 { margin-top: 20px; font-size: 52px; line-height: 1.04; font-weight: 500; letter-spacing: -.03em; max-width: 20ch; color: #fff; }
.shr .answer-first p { margin-top: 18px; font-size: 19px; line-height: 1.5; color: rgba(255,255,255,.84); max-width: 60ch; }
.shr .content-meta { margin-top: 18px; font-size: 14px; color: rgba(255,255,255,.72); }
.shr .content-meta b { color: #fff; font-weight: 700; }
.shr .hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.shr .stat-rail { display: grid; gap: 1px; background: rgba(255,255,255,.2); border: 1px solid rgba(255,255,255,.2); border-radius: 6px; overflow: hidden; }
.shr .stat { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 18px; background: rgba(13,15,16,.74); color: #fff; }
.shr .stat:link, .shr .stat:visited { color: #fff; }
.shr .stat:hover { background: rgba(13,15,16,.9); text-decoration: none; }
.shr .stat-label { display: block; font-size: 11px; font-weight: 700; letter-spacing: .14em; opacity: .78; }
.shr .stat-sub { display: block; font-size: 13px; opacity: .68; margin-top: 4px; }
.shr .stat-value { font-size: 27px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* sections */
.shr section.block { padding: 56px 24px 60px; border-top: 1px solid rgba(16,19,20,.12); }
.shr section.block.alt { background: #fff; }
.shr .block-inner { max-width: 1280px; margin: 0 auto; }
.shr .block h2 { font-size: 34px; font-weight: 400; line-height: 1.14; max-width: 30em; }
.shr .block h3 { font-size: 19px; font-weight: 700; margin-top: 20px; }
.shr .lede { margin-top: 14px; font-size: 18px; line-height: 1.55; color: #101314; max-width: 72ch; }
.shr .prose { margin-top: 16px; max-width: 72ch; }
.shr .prose p { margin-top: 12px; font-size: 16.5px; line-height: 1.6; color: #2a2f33; }
.shr .prose p:first-child { margin-top: 0; }
.shr .prose ul { margin-top: 12px; }
.shr .prose li { margin-top: 6px; line-height: 1.55; }
.shr .split { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 48px; align-items: start; }
.shr .split .prose { max-width: none; }
.shr figure.photo { margin: 0; position: relative; aspect-ratio: 16/9; overflow: hidden; border-radius: 4px; background: #d9dbd6; }
.shr figure.photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.shr figure.photo figcaption { position: absolute; left: 12px; bottom: 12px; font: 600 10.5px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .09em; background: rgba(13,15,16,.78); color: #fff; padding: 4px 9px; border-radius: 3px; }
.shr .fact { margin-top: 18px; padding: 18px 20px; border-left: 3px solid #3375bb; background: rgba(51,117,187,.07); font-size: 15px; line-height: 1.55; max-width: 72ch; }
.shr .fact b { color: #255a92; }
.shr .source { font-size: 12.5px; color: #5A6474; margin-top: 8px; }

/* tables */
.shr .tablewrap { margin-top: 20px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.shr table.spec { border-collapse: collapse; width: 100%; min-width: 560px; font-size: 14.5px; background: #fff; }
.shr table.spec th, .shr table.spec td { text-align: left; padding: 11px 12px; border-bottom: 1px solid rgba(16,19,20,.12); vertical-align: top; }
.shr table.spec th { font-size: 11px; letter-spacing: .12em; color: #5A6474; background: #F4F4F2; }
.shr table.spec td:first-child { font-weight: 700; }
.shr table.spec tr:last-child td { border-bottom: 0; }

/* offers */
.shr .offer-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; margin-top: 24px; }
.shr .offer { background: #fff; border: 1px solid rgba(16,19,20,.12); border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; }
.shr .offer-art { background: linear-gradient(180deg,#e9ebe8,#f7f7f5); aspect-ratio: 4/3; display: flex; align-items: flex-end; justify-content: center; padding: 12px; position: relative; }
.shr .offer-art img { max-height: 100%; max-width: 92%; object-fit: contain; }
.shr .offer-type { position: absolute; top: 10px; left: 10px; font: 700 10.5px/1 ui-monospace, Menlo, monospace; letter-spacing: .12em; text-transform: uppercase; background: #3375bb; color: #fff; padding: 6px 9px; border-radius: 3px; }
.shr .offer-body { padding: 18px 18px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.shr .offer-title { font-size: 17px; font-weight: 700; }
.shr .offer-sub { font-size: 13px; color: #5A6474; }
.shr .offer-big { font-size: 30px; font-weight: 700; letter-spacing: -.02em; line-height: 1.05; margin-top: 6px; font-variant-numeric: tabular-nums; }
.shr .offer-big small { font-size: 14px; font-weight: 500; color: #5A6474; letter-spacing: 0; }
.shr .offer-terms { font-size: 13.5px; color: #2a2f33; }
.shr .offer-exp { font-size: 12.5px; color: #5A6474; }
.shr .offer-disc { font-size: 11.5px; line-height: 1.45; color: #5A6474; border-top: 1px solid rgba(16,19,20,.1); padding-top: 8px; margin-top: 4px; }
.shr .offer-actions { display: flex; gap: 8px; margin-top: auto; padding-top: 10px; }
.shr .offer-actions a.pill { height: 42px; padding: 0 16px; font-size: 13px; flex: 1; }
.shr .offer[data-offer-expired="1"] { display: none; }
.shr .offer-glance { margin-top: 20px; padding: 18px 20px; background: #fff; border: 1px solid rgba(16,19,20,.12); border-radius: 8px; font-size: 14.5px; line-height: 1.55; }
.shr .offer-glance b { display: block; font-size: 12px; letter-spacing: .12em; color: #5A6474; margin-bottom: 8px; }
.shr .offer-glance li { margin-top: 4px; }
.shr .offer-empty { margin-top: 20px; padding: 22px; background: #fff; border: 1px dashed rgba(16,19,20,.3); border-radius: 8px; font-size: 15px; }

/* inventory */
.shr .inv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; margin-top: 20px; }
.shr .inv { background: #fff; border: 1px solid rgba(16,19,20,.12); border-radius: 8px; overflow: hidden; }
.shr .inv img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; background: #e9ebe8; }
.shr .inv-body { padding: 12px 14px 14px; font-size: 13.5px; }
.shr .inv-title { font-weight: 700; font-size: 15px; }
.shr .inv-price { font-weight: 700; margin-top: 4px; font-size: 16px; }
.shr .inv-meta { color: #5A6474; margin-top: 2px; font-size: 12.5px; }

/* FAQ */
.shr .faq-split { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.15fr); gap: 48px; align-items: start; }
.shr .sticky { position: sticky; top: 88px; }
.shr .callout { margin-top: 20px; background: #0D0F10; color: #fff; border-radius: 8px; padding: 22px; }
.shr .callout h3 { font-size: 19px; font-weight: 700; margin: 0; color: #fff; }
.shr .callout p { margin-top: 8px; font-size: 14px; line-height: 1.55; color: rgba(255,255,255,.78); }
.shr .callout a.pill { margin-top: 16px; height: 46px; font-size: 13px; }
.shr .faqlist { border-top: 1px solid rgba(16,19,20,.14); }
.shr .faqlist details { border-bottom: 1px solid rgba(16,19,20,.14); }
.shr .faqlist summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; cursor: pointer; padding: 18px 0; font-size: 17px; font-weight: 700; line-height: 1.35; }
.shr .faqlist summary::-webkit-details-marker { display: none; }
.shr .faqlist summary .plus { flex: none; width: 26px; height: 26px; border-radius: 50%; border: 1.5px solid #3375bb; color: #3375bb; display: inline-flex; align-items: center; justify-content: center; font-weight: 500; font-size: 18px; line-height: 1; }
.shr .faqlist details[open] summary .plus { transform: rotate(45deg); }
.shr .faqlist details p { padding: 0 0 18px; font-size: 15.5px; line-height: 1.6; color: #2a2f33; max-width: 66ch; }

/* related + NAP + disclaimers */
.shr .related { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px,1fr)); gap: 12px; margin-top: 20px; }
.shr .related a { display: block; padding: 16px 18px; background: #fff; border: 1px solid rgba(16,19,20,.12); border-radius: 8px; font-weight: 700; font-size: 15px; }
.shr .related a:hover { border-color: #3375bb; text-decoration: none; }
.shr .related small { display: block; font-weight: 400; color: #5A6474; margin-top: 4px; font-size: 13px; }
.shr .nap { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 24px; margin-top: 20px; font-size: 15px; line-height: 1.6; }
.shr .nap b { display: block; font-size: 12px; letter-spacing: .12em; color: #5A6474; margin-bottom: 6px; }
.shr .disclaimers { font-size: 12px; line-height: 1.55; color: #5A6474; max-width: none; }
.shr .disclaimers p { margin-top: 10px; }
.shr .disclaimers p:first-child { margin-top: 0; }

/* photo band */
.shr .band { position: relative; min-height: 340px; display: flex; align-items: center; color: #fff; background-color: #0D0F10; background-size: cover; background-position: center right; }
.shr .band-inner { position: relative; max-width: 1280px; margin: 0 auto; padding: 48px 24px; width: 100%; }
.shr .band h2 { font-size: 32px; font-weight: 400; max-width: 22ch; color: #fff; }
.shr .band p { margin-top: 12px; font-size: 17px; max-width: 56ch; color: rgba(255,255,255,.85); }

@media (max-width: 860px) {
  .shr .hero-inner, .shr .split, .shr .faq-split { grid-template-columns: 1fr; gap: 28px; }
  .shr .hero { background-image: none; }
  .shr .hero h1 { font-size: 36px; }
  .shr .block h2 { font-size: 27px; }
  .shr .sticky { position: static; }
  .shr .hero-inner { padding: 40px 20px 44px; }
  .shr section.block { padding: 40px 20px 44px; }
}

/* ---- v2: icons, asides, cards, key facts, collapsible disclosures, CTA band ---- */
.shr .ico { display: inline-flex; width: 34px; height: 34px; flex: none; color: #101314; }
.shr .ico svg { overflow: visible; display: block; }
/* A 24-unit viewBox drawn at 34px scales the stroke to ~2.5px while a 22px icon lands near
   1.6px. non-scaling-stroke pins the line to an absolute width so every icon on the page
   carries the same weight regardless of the size it is drawn at. */
.shr .ico svg * { vector-effect: non-scaling-stroke; stroke-width: 1.5px; }
.shr .ico svg { width: 34px; height: 34px; }
.shr .measure { max-width: 72ch; margin-top: 8px; }
.shr .split-aside { grid-template-columns: minmax(0, 1.25fr) minmax(280px, 380px); align-items: start; }
.shr aside.facts, .shr aside.hours, .shr aside.facttile { background: #fff; border: 1px solid rgba(16,19,20,.12); border-radius: 8px; padding: 22px 22px 20px; }
.shr .facts-head { display: flex; align-items: center; gap: 10px; font: 700 11.5px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .14em; color: #5A6474; }
.shr .facts-head .ico, .shr .facts-head .ico svg { width: 22px; height: 22px; }
.shr aside.facts dl { margin: 14px 0 0; display: grid; gap: 0; }
.shr aside.facts dl > div { display: flex; gap: 12px; align-items: flex-start; padding: 11px 0; border-top: 1px solid rgba(16,19,20,.1); }
.shr aside.facts dl > div .ico, .shr aside.facts dl > div .ico svg { width: 24px; height: 24px; margin-top: 1px; }
.shr aside.facts dt { font-size: 11.5px; letter-spacing: .08em; color: #5A6474; font-weight: 700; }
.shr aside.facts dd { margin: 3px 0 0; font-size: 15px; line-height: 1.45; font-weight: 600; color: #101314; }
.shr .hours-rows { margin-top: 14px; border-top: 1px solid rgba(16,19,20,.1); }
.shr .hours-rows > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(16,19,20,.1); font-size: 14.5px; }
.shr .hours-rows > div span:first-child { font-weight: 700; }
.shr .hours-rows > div span:last-child { color: #5A6474; }
.shr aside.hours a.pill { margin-top: 16px; width: 100%; height: 46px; font-size: 13px; }
.shr aside.hours a.tel, .shr aside.hours a.tel:link, .shr aside.hours a.tel:visited { display: flex; align-items: center; gap: 10px; margin-top: 12px; font-weight: 700; font-size: 15px; color: #101314; }
.shr aside.hours a.tel.big { font-size: 24px; letter-spacing: -.01em; margin-top: 14px; }
.shr aside.hours a.tel .ico, .shr aside.hours a.tel .ico svg { width: 22px; height: 22px; }
.shr .aside-p { margin-top: 12px; font-size: 14.5px; line-height: 1.55; color: #2a2f33; }
.shr .aside-p.small { font-size: 12.5px; color: #5A6474; margin-top: 10px; }
.shr aside.facttile { background: #0D0F10; color: #fff; border-color: #0D0F10; }
.shr aside.facttile .ico { color: #fff; }
.shr aside.facttile { --shr-accent: #8ec1f2; }
.shr aside.facttile .facttile-text { margin-top: 14px; font-size: 18px; line-height: 1.45; }
.shr aside.facttile .facttile-text b { color: #8ec1f2; display: block; font-size: 22px; line-height: 1.25; margin-bottom: 8px; }
.shr aside.facttile .source { color: rgba(255,255,255,.6); margin-top: 14px; }
.shr ul.iconlist { list-style: none; padding: 0; margin-top: 16px; display: grid; gap: 10px; }
.shr ul.iconlist li { display: flex; gap: 12px; align-items: flex-start; line-height: 1.5; margin: 0; }
.shr ul.iconlist .ico, .shr ul.iconlist .ico svg { width: 26px; height: 26px; margin-top: 1px; }
.shr ol.steps { list-style: none; padding: 0; margin-top: 16px; display: grid; gap: 14px; counter-reset: none; }
.shr ol.steps li { display: flex; gap: 14px; align-items: flex-start; line-height: 1.55; margin: 0; }
.shr ol.steps .num { flex: none; width: 30px; height: 30px; border-radius: 50%; background: #3375bb; color: #fff; font-weight: 700; font-size: 14px; display: inline-flex; align-items: center; justify-content: center; }
.shr .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1px; background: rgba(16,19,20,.12); border: 1px solid rgba(16,19,20,.12); margin-top: 24px; }
.shr .card { background: #fff; padding: 24px 22px 26px; }
.shr .card .ico { margin-bottom: 12px; }
.shr .card-kicker { font-size: 11px; font-weight: 800; letter-spacing: .14em; color: #3375bb; }
.shr .card h3 { margin-top: 8px; font-size: 18px; font-weight: 700; }
.shr .card p { margin-top: 8px; font-size: 14px; line-height: 1.55; color: #5A6474; }
.shr .card a { display: inline-block; margin-top: 10px; font-size: 13px; font-weight: 700; }
.shr .actions { background: #fff; border-bottom: 1px solid rgba(16,19,20,.1); padding: 0 24px; }
.shr dl.kf { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 28px; }
.shr dl.kf > div { padding: 10px 0; border-bottom: 1px solid rgba(16,19,20,.08); }
.shr dl.kf dt { font-size: 11.5px; letter-spacing: .08em; color: #5A6474; font-weight: 700; }
.shr dl.kf dd { margin: 4px 0 0; font-size: 15px; font-weight: 600; line-height: 1.4; }
.shr .offer-glance { display: flex; gap: 16px; align-items: flex-start; }
.shr .offer-glance > .ico { flex: none; margin-top: 2px; }
.shr .offer-glance li { font-size: 14px; }
.shr details.offer-more { border-top: 1px solid rgba(16,19,20,.1); margin-top: 4px; }
.shr details.offer-more summary { list-style: none; cursor: pointer; font-size: 12.5px; font-weight: 700; color: #255a92; padding: 8px 0 2px; display: flex; align-items: center; gap: 6px; }
.shr details.offer-more summary::-webkit-details-marker { display: none; }
.shr details.offer-more summary::after { content: "+"; font-size: 15px; line-height: 1; }
.shr details.offer-more[open] summary::after { content: "–"; }
.shr details.offer-more .offer-disc { border-top: 0; padding-top: 4px; margin-top: 0; }
.shr details.disc-more { margin-top: 12px; }
.shr details.disc-more summary { list-style: none; cursor: pointer; font-weight: 700; color: #255a92; font-size: 13px; padding: 6px 0; }
.shr details.disc-more summary::-webkit-details-marker { display: none; }
.shr details.disc-more summary::before { content: "+ "; }
.shr details.disc-more[open] summary::before { content: "– "; }
.shr .ctaband { background: #3375bb; color: #fff; padding: 56px 24px; }
.shr .ctaband-inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; flex-wrap: wrap; }
.shr .ctaband h2 { font-size: 34px; font-weight: 400; line-height: 1.14; max-width: 26ch; color: #fff; }
.shr .ctaband p { margin-top: 10px; font-size: 16.5px; color: rgba(255,255,255,.88); }
.shr .ctaband-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.shr a.pill-white, .shr a.pill-white:link, .shr a.pill-white:visited { background: #fff; color: #255a92; border-color: #fff; height: 56px; padding: 0 30px; }
.shr a.pill-white:hover { background: #eef4fb; color: #255a92; text-decoration: none; }
.shr a.pill-white-ghost, .shr a.pill-white-ghost:link, .shr a.pill-white-ghost:visited { background: transparent; color: #fff; border-color: rgba(255,255,255,.65); height: 56px; padding: 0 26px; }
.shr a.pill-white-ghost:hover { background: rgba(255,255,255,.12); color: #fff; text-decoration: none; }
.shr .nap > div { display: flex; gap: 14px; align-items: flex-start; }
@media (max-width: 860px) {
  .shr .split-aside { grid-template-columns: 1fr; }
  .shr .ctaband h2 { font-size: 27px; }
}

/* ---- v2.1: column wrappers, photo stretch, grid fills ---- */
.shr .split-photo { align-items: stretch; }
.shr .split-photo figure.photo { aspect-ratio: auto; min-height: 340px; height: 100%; }
.shr .split-photo .col { display: flex; flex-direction: column; gap: 18px; }
.shr .split-photo .col .fact { margin-top: 0; }
.shr .col .prose { max-width: none; }
.shr .col > p { margin-top: 0; }
.shr .cards { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.shr dl.kf { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
@media (max-width: 860px) { .shr .split-photo figure.photo { aspect-ratio: 16/9; min-height: 0; height: auto; } }

/* ---- v3 ---- */
.shr .inv-noimg { aspect-ratio: 4/3; background: #e9ebe8; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: #5A6474; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.shr .offer-more-card, .shr a.offer-more-card:link, .shr a.offer-more-card:visited { background: #0D0F10; color: #fff; padding: 26px 22px; display: flex; flex-direction: column; gap: 10px; justify-content: center; text-decoration: none; }
.shr .offer-more-card .ico { color: #fff; }
.shr .offer-more-card { --shr-accent: #8ec1f2; }
.shr .offer-more-title { font-size: 22px; font-weight: 700; line-height: 1.2; margin-top: 8px; }
.shr .offer-more-sub { font-size: 14px; color: rgba(255,255,255,.72); line-height: 1.5; }
.shr .offer-more-card .pill { margin-top: 12px; align-self: flex-start; height: 44px; padding: 0 20px; font-size: 13px; }
.shr aside.facttile .facttile-text b { display: inline; font-size: inherit; color: #8ec1f2; }

/* ---- v4 ---- */
.shr .related { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.shr .offer-more-card span.pill { display: inline-flex; align-items: center; height: 44px; padding: 0 20px; border-radius: 999px; background: #fff; color: #255a92; font-weight: 700; font-size: 13px; }
.shr .prose p + p { margin-top: 12px; }

.shr .cards.cards-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 860px) { .shr .cards.cards-3 { grid-template-columns: 1fr; } }

.shr .split-short { align-items: center; }
.shr .split-short .col .prose p { font-size: 17.5px; line-height: 1.6; }

/* ---- lineup grid: the transactional core of a dealer page ---- */
.shr .lineup { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1px; background: rgba(16,19,20,.12); border: 1px solid rgba(16,19,20,.12); margin-top: 24px; }
.shr .lu { background: #fff; display: flex; flex-direction: column; }
.shr .lu-art { aspect-ratio: 16/10; background: linear-gradient(180deg,#eef1f4,#fff); display: flex; align-items: center; justify-content: center; padding: 10px 14px; }
.shr .lu-art img { max-height: 100%; max-width: 100%; object-fit: contain; }
.shr .lu-art-empty { color: #9aa3ad; }
.shr .lu-body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.shr .lu-body h3 { font-size: 18px; font-weight: 700; }
.shr .lu-meta { font-size: 13px; color: #5A6474; line-height: 1.45; }
.shr .lu-price { font-size: 15px; font-weight: 700; margin-top: 4px; }
.shr .lu-stock { display: flex; align-items: center; gap: 7px; font-size: 13px; color: #255a92; font-weight: 600; margin-top: 2px; }
.shr .lu-stock .ico, .shr .lu-stock .ico svg { width: 18px; height: 18px; }
.shr .lu-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: auto; padding-top: 12px; }
.shr .lu-links a { font-size: 12.5px; font-weight: 700; }

.shr .block h2 { max-width: 30em; }
.shr .band h2 { max-width: 24ch; }
.shr .ctaband h2 { max-width: 26ch; }

/* Compliance: brand names must render as written ("Honda", never "HONDA"), so labels use
   size, weight and letter-spacing for the eyebrow rhythm instead of text-transform. */
.shr .kicker span:last-child, .shr .facts-head span, .shr .stat-label, .shr .card-kicker,
.shr dl.kf dt, .shr aside.facts dt, .shr .crumbs, .shr table.spec th, .shr .nap b,
.shr .offer-glance b, .shr figure.photo figcaption { letter-spacing: .1em; }

/* ---- map ---- */
.shr .mapwrap { position: relative; }
.shr .mapwrap { height: 100%; min-height: 300px; }
.shr .mapframe { width: 100%; height: 100%; min-height: 300px; border: 0; display: block; background: #e9ebe8; border-radius: 6px; }
.shr .split-map { grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: stretch; }
.shr .getting { margin-top: 22px; background: #fff; border: 1px solid rgba(16,19,20,.12); border-radius: 8px; padding: 22px 24px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 28px; align-items: center; }
.shr .mapcard .facts-head { margin-bottom: 14px; }
.shr .mapsteps { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px 28px; }
.shr .mapsteps > div { display: flex; gap: 12px; align-items: flex-start; font-size: 14.5px; line-height: 1.5; }
.shr .mapsteps .ico, .shr .mapsteps .ico svg { width: 22px; height: 22px; flex: none; margin-top: 1px; }
.shr .mapsteps b { display: block; font-size: 11.5px; letter-spacing: .1em; color: #5A6474; font-weight: 700; }
.shr .getting-cta { display: flex; flex-direction: column; gap: 10px; }
.shr .getting-cta a.pill { height: 48px; font-size: 13.5px; white-space: nowrap; }
@media (max-width: 860px) { .shr .split-map { grid-template-columns: 1fr; } .shr .mapframe, .shr .mapwrap { min-height: 260px; } .shr .getting { grid-template-columns: 1fr; } }

/* ---- action tiles under the hero ---- */
.shr .actiontiles { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); }
.shr a.at, .shr a.at:link, .shr a.at:visited { display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
  padding: 26px 22px 28px; border-left: 1px solid rgba(16,19,20,.1); color: #101314; text-decoration: none; transition: background .15s; }
.shr .actiontiles a.at:first-child { border-left: 0; }
.shr a.at:hover { background: #f4f7fb; text-decoration: none; }
.shr a.at .ico { margin-bottom: 12px; }
.shr .at-title { font-size: 17.5px; font-weight: 700; letter-spacing: -.01em; }
.shr .at-sub { font-size: 13.5px; line-height: 1.45; color: #5A6474; margin-top: 4px; }
@media (max-width: 1100px) { .shr .actiontiles { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .shr .actiontiles a.at:nth-child(3n+1) { border-left: 0; }
  .shr .actiontiles a.at:nth-child(n+4) { border-top: 1px solid rgba(16,19,20,.1); } }
@media (max-width: 640px) { .shr .actiontiles { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .shr .actiontiles a.at:nth-child(odd) { border-left: 0; }
  .shr .actiontiles a.at:nth-child(n+3) { border-top: 1px solid rgba(16,19,20,.1); } }

/* ---- mobile: keep the long grids scannable rather than a column of full-width cards ---- */
@media (max-width: 700px) {
  .shr .lu { flex-direction: row; align-items: stretch; }
  .shr .lu-art { width: 122px; flex: none; aspect-ratio: auto; padding: 10px; }
  .shr .lu-body { padding: 14px 14px 16px; }
  .shr .lu-body h3 { font-size: 16px; }
  .shr .lu-meta, .shr .lu-price, .shr .lu-stock { font-size: 12.5px; }
  .shr .lu-links { gap: 10px; padding-top: 10px; }
  .shr .lu-links a { font-size: 11.5px; }
  .shr .inv-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
  .shr .inv-body { padding: 10px 11px 12px; }
  .shr .inv-title { font-size: 13.5px; }
  .shr .inv-price { font-size: 14.5px; }
  .shr .inv-meta { font-size: 11.5px; }
  .shr .offer-grid { grid-template-columns: 1fr; }
}