/* r114-neutralized */
/* ============================================================
   buttons-final.css
   
   GLOBAL fix for .dag-btn--primary appearing as dark plates 
   without visible text. Forces white text on red bg site-wide.
   
   Loaded LAST in cascade — wins over any legacy rule.
   ============================================================ */

/* === GLOBAL PRIMARY — solid red + white text everywhere === */
html body a.dag-btn--primary,
html body button.dag-btn--primary,
html body .dag-btn--primary,
html body a.btn--primary,
html body button.btn--primary,
html body .btn--primary,
html body .dag-btn--solid,
html body input.dag-btn--primary,
html body input[type="submit"].dag-btn--primary {
    background-color: #b0122a !important;
    background-image: none !important;
    color: #ffffff !important;
    border: 1px solid #b0122a !important;
    text-decoration: none !important;
    text-shadow: none !important;
    opacity: 1 !important;
}

html body a.dag-btn--primary:hover,
html body button.dag-btn--primary:hover,
html body .dag-btn--primary:hover,
html body a.btn--primary:hover,
html body button.btn--primary:hover {
    background-color: #8f0f22 !important;
    color: #ffffff !important;
    border-color: #8f0f22 !important;
}

html body a.dag-btn--primary:visited,
html body .dag-btn--primary:visited {
    color: #ffffff !important;
}

/* === Make primary button text/spans inherit white === */
html body .dag-btn--primary *,
html body .btn--primary *,
html body a.dag-btn--primary > *,
html body button.dag-btn--primary > * {
    color: #ffffff !important;
}

/* === GLOBAL GHOST — white bg, ink text === */
html body a.dag-btn--ghost,
html body button.dag-btn--ghost,
html body .dag-btn--ghost,
html body a.btn--ghost,
html body button.btn--ghost,
html body .btn--ghost,
html body a.dag-btn--secondary,
html body .dag-btn--secondary {
    background-color: #ffffff !important;
    background-image: none !important;
    color: #0f0f10 !important;
    border: 1px solid #d4d4d8 !important;
    text-decoration: none !important;
}

html body a.dag-btn--ghost:hover,
html body button.dag-btn--ghost:hover,
html body .dag-btn--ghost:hover,
html body a.btn--ghost:hover {
    background-color: #0f0f10 !important;
    color: #ffffff !important;
    border-color: #0f0f10 !important;
}

html body .dag-btn--ghost *,
html body .btn--ghost *,
html body a.dag-btn--ghost > * {
    color: inherit !important;
}

/* === FALLBACK base .dag-btn (no modifier) — make red so always visible === */
/* Header inventory btn etc. */
html body a.dag-btn:not(.dag-btn--primary):not(.dag-btn--ghost):not(.dag-btn--secondary):not(.dag-btn--accent):not(.dag-btn--outline),
html body button.dag-btn:not(.dag-btn--primary):not(.dag-btn--ghost):not(.dag-btn--secondary):not(.dag-btn--accent):not(.dag-btn--outline) {
    background-color: #b0122a !important;
    color: #ffffff !important;
    border: 1px solid #b0122a !important;
}

/* === REMOVE shipping-hero overlay/gradient (per user request) === */
html body .shipping-hero,
html body .privacy-hero,
html body .terms-hero,
html body .refund-hero,
html body .consign-hero,
html body .contact-hero,
html body .thankyou-hero,
html body .about-hero,
html body section.shipping-hero,
html body section.privacy-hero,
html body section.terms-hero,
html body section.refund-hero {
    background-image: none !important;
    background-color: #fafafa !important;
}

html body .shipping-hero::before,
html body .shipping-hero::after,
html body .privacy-hero::before,
html body .privacy-hero::after,
html body .terms-hero::before,
html body .terms-hero::after,
html body .refund-hero::before,
html body .refund-hero::after {
    background: none !important;
    background-image: none !important;
    content: none !important;
    display: none !important;
}

/* === Submit-style buttons (forms) — also red === */
html body form button[type="submit"],
html body form input[type="submit"],
html body .request-quote-btn,
html body .submit-btn,
html body .send-btn,
html body .send-message-btn,
html body .submit-application,
html body .submit-request-btn {
    background-color: #b0122a !important;
    color: #ffffff !important;
    border: 1px solid #b0122a !important;
}

html body form button[type="submit"]:hover,
html body form input[type="submit"]:hover {
    background-color: #8f0f22 !important;
    color: #ffffff !important;
    border-color: #8f0f22 !important;
}

/* ============================================================
   R50 — Top Deals dots + Contact broken image fix
   ============================================================ */

/* === Top Deals dots — hide text content if it's "0", show as proper dots === */
html body .home-deals__dots {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 16px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
    counter-reset: none !important;
}

html body .home-deals__dots button,
html body .home-deals__dot,
html body button.home-deals__dot {
    width: 10px !important;
    height: 10px !important;
    min-width: 10px !important;
    padding: 0 !important;
    background: #d4d4d8 !important;
    border: none !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    transition: all 160ms ease !important;
    font-size: 0 !important;
    color: transparent !important;
    line-height: 0 !important;
    text-indent: -9999px !important;
    overflow: hidden !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}

html body .home-deals__dots button::before,
html body .home-deals__dot::before,
html body .home-deals__dots button::after,
html body .home-deals__dot::after {
    content: none !important;
    display: none !important;
}

html body .home-deals__dot.is-active,
html body .home-deals__dot[aria-current="true"],
html body button.home-deals__dot.is-active,
html body .home-deals__dots button.is-active {
    background: var(--color-primary, #b0122a) !important;
    width: 24px !important;
    border-radius: 6px !important;
}

html body .home-deals__dot:hover {
    background: #71717a !important;
}

/* === Contact page — hide broken image (no src or src=#) === */
html body .page-template-page-contact img:not([src]),
html body .page-template-page-contact img[src=""],
html body .page-template-page-contact img[src="#"],
html body .page-id-* .contact-hero__media img:not([src]),
html body .contact-hero__image:not([src]),
html body .contact-hero__media:has(img:not([src])),
html body .contact-hero__media:empty,
html body .dag-page--contact .contact-hero__image,
html body .contact-hero__image {
    display: none !important;
}

/* If image wrapper has no src image inside, hide wrapper */
html body .contact-hero figure:not(:has(img[src*="://"])),
html body .contact-hero__media:not(:has(img[src*="://"])) {
    display: none !important;
}

/* ============================================================
   R51 — Top Deals dots: kill counter content + Contact featured image
   ============================================================ */

/* Kill counter ::before content on dots — show only round shape */
html body .home-deals__dots button::before,
html body .home-deals__dots button::after,
html body .home-deals__dots li::before,
html body .home-deals__dots li::after,
html body .home-deals__dot::before,
html body .home-deals__dot::after {
    content: none !important;
    display: none !important;
}

/* Force pure round dot — no text rendering at all */
html body .home-deals__dots button,
html body .home-deals__dot {
    width: 10px !important;
    height: 10px !important;
    min-width: 10px !important;
    min-height: 10px !important;
    padding: 0 !important;
    background: #d4d4d8 !important;
    border: 0 !important;
    border-radius: 50% !important;
    font-size: 0 !important;
    color: transparent !important;
    text-indent: -9999px !important;
    line-height: 0 !important;
    overflow: hidden !important;
    cursor: pointer !important;
}

html body .home-deals__dot.is-active,
html body .home-deals__dot[aria-current="true"],
html body .home-deals__dots button.is-active,
html body .home-deals__dots button[aria-current="true"] {
    background: #b0122a !important;
    width: 24px !important;
    border-radius: 6px !important;
}

/* === Contact page — hide featured image (post thumbnail) === */
html body.page-template-page-contact .wp-post-image,
html body.page-template-page-contact .attachment-post-thumbnail,
html body.page-template-default.page .wp-post-image:not(.car-photo):not(.inv-card__img):not(.car-card__img),
html body .dag-page--contact .wp-post-image,
html body .contact-hero .wp-post-image,
html body .contact-hero img.attachment-full,
html body .contact-hero img.size-full {
    display: none !important;
}

/* ============================================================
   R52 — Pagination redesign (inventory + any paginated page)
   Style: brand-consistent (red active, ink hover), clean borders.
   ============================================================ */

/* Container */
html body .page-numbers,
html body .pagination,
html body .nav-links,
html body .inventory-pagination,
html body nav.pagination {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 32px 0 !important;
    padding: 0 !important;
    list-style: none !important;
    flex-wrap: wrap !important;
}

html body .page-numbers li,
html body .pagination li,
html body .nav-links li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* Individual page number / link */
html body a.page-numbers,
html body span.page-numbers,
html body .pagination a,
html body .pagination span,
html body .nav-links a,
html body .nav-links span,
html body .page-numbers li a,
html body .page-numbers li span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 40px !important;
    height: 40px !important;
    padding: 0 12px !important;
    background: #ffffff !important;
    color: #0f0f10 !important;
    border: 1px solid #e4e4e7 !important;
    border-radius: 0 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    transition: all 160ms ease !important;
    cursor: pointer !important;
}

/* Hover state */
html body a.page-numbers:hover,
html body .pagination a:hover,
html body .nav-links a:hover,
html body .page-numbers li a:hover {
    background: #0f0f10 !important;
    color: #ffffff !important;
    border-color: #0f0f10 !important;
}

/* Active / current page */
html body .page-numbers.current,
html body span.page-numbers.current,
html body .pagination .current,
html body .nav-links .current,
html body .page-numbers li.active a,
html body .page-numbers li .current,
html body li.page-numbers.active a {
    background: #b0122a !important;
    color: #ffffff !important;
    border-color: #b0122a !important;
    pointer-events: none !important;
}

/* Prev / Next arrows */
html body .page-numbers.prev,
html body .page-numbers.next,
html body a.next.page-numbers,
html body a.prev.page-numbers,
html body .pagination .prev,
html body .pagination .next,
html body .nav-links .prev,
html body .nav-links .next {
    font-size: 16px !important;
    font-weight: 400 !important;
    background: #ffffff !important;
    color: #71717a !important;
}

html body .page-numbers.prev:hover,
html body .page-numbers.next:hover,
html body a.next.page-numbers:hover,
html body a.prev.page-numbers:hover {
    background: #b0122a !important;
    color: #ffffff !important;
    border-color: #b0122a !important;
}

/* Dots (...) */
html body .page-numbers.dots,
html body span.page-numbers.dots,
html body .pagination .dots {
    background: transparent !important;
    border: none !important;
    color: #a1a1aa !important;
    cursor: default !important;
}

html body .page-numbers.dots:hover {
    background: transparent !important;
    color: #a1a1aa !important;
    border: none !important;
}

/* Mobile */
@media (max-width: 600px) {
    html body a.page-numbers,
    html body span.page-numbers,
    html body .pagination a,
    html body .pagination span {
        min-width: 36px !important;
        height: 36px !important;
        padding: 0 10px !important;
        font-size: 13px !important;
    }
}

/* ============================================================
   R53 — hide empty block / featured image / placeholder at bottom of /contact/
   ============================================================ */

/* Hide ALL post thumbnails / featured images on contact page (broad targeting) */
html body.page-template-page-contact .wp-post-image,
html body.page-id-* .wp-post-image:not(.car-photo):not(.inv-card__img):not(.car-card__img):not(.site-branding__logo-img):not(.team-card__photo),
html body[class*="contact"] .wp-post-image,
html body[class*="contact"] .post-thumbnail,
html body[class*="contact"] .entry-thumbnail,
html body[class*="contact"] figure.post-thumbnail,
html body[class*="contact"] .featured-image,
html body[class*="contact"] .attachment-post-thumbnail,
html body[class*="contact"] img.attachment-full,
html body[class*="contact"] img.size-full {
    display: none !important;
}

/* Hide WP block-level featured image / cover on contact */
html body[class*="contact"] .wp-block-post-featured-image,
html body[class*="contact"] .wp-block-cover {
    display: none !important;
}

/* Empty placeholder containers — broken image wrappers with no real content */
html body[class*="contact"] figure:has(img.wp-post-image),
html body[class*="contact"] .dag-page--contact > figure,
html body[class*="contact"] .dag-page--contact > div:empty,
html body[class*="contact"] main > figure:not(.contact-hero figure):not(.car-figure),
html body[class*="contact"] .contact-extra,
html body[class*="contact"] .contact-content > figure {
    display: none !important;
}

/* Hide any broken image (404 src or no naturalWidth) — handled by browser
   But CSS-side hide imgs whose src points to non-existent paths */
html body[class*="contact"] img[src*="2026/01/2.jpg"] {
    display: none !important;
}

/* Last-element fallback: if the final element before footer is empty image wrapper, hide */
html body[class*="contact"] main > *:last-child:has(img.wp-post-image:only-child),
html body[class*="contact"] .site-content > *:last-child:has(img.wp-post-image:only-child) {
    display: none !important;
}

/* ============================================================
   R55 — kill mobile sticky on inventory filter/sidebar/topbar
   ============================================================ */

@media (max-width: 980px) {
    html body .inventory-sidebar,
    html body aside.inventory-sidebar,
    html body .inventory-filters,
    html body .inventory-topbar,
    html body .inventory-toolbar,
    html body .archive-sidebar,
    html body .archive-filters,
    html body .filters-bar,
    html body .filter-bar,
    html body .inv-filters,
    html body .inv-toolbar,
    html body .dag-inventory__sidebar,
    html body .dag-inventory__filters,
    html body .dag-inventory__topbar,
    html body .inventory-content > aside,
    html body .inventory-content > .sidebar,
    html body main .filters,
    html body .car-archive .filters {
        position: static !important;
        position: relative !important;
        top: auto !important;
        bottom: auto !important;
        max-height: none !important;
        overflow: visible !important;
        z-index: auto !important;
    }
}

/* Also at smaller breakpoint as safety */
@media (max-width: 768px) {
    html body [class*="filter"][class*="sticky"],
    html body [class*="sidebar"][class*="sticky"],
    html body .inventory-sidebar,
    html body .inventory-filters {
        position: static !important;
        top: auto !important;
    }
}

/* ============================================================
   R55 — refund container wider (overrides if needed)
   ============================================================ */

html body .dag-refund > .dag-container,
html body .refund-layout,
html body .refund-policy-grid,
html body .refund-main {
    max-width: 1440px !important;
}

@media (min-width: 901px) {
    html body .refund-layout,
    html body .refund-policy-grid {
        grid-template-columns: 280px 1fr !important;
        gap: 48px !important;
    }
}

/* ============================================================
   R60 — visual alignment with target design (2026-05-05)
   Scope: hero overlay+text, topbar color, footer 2-col,
          about square buttons, top deals wider, brand pills square
   ============================================================ */

/* --- HERO: white overlay, dark text --- */
.home-page .hero__overlay,
.home-page .hero__overlay--dark {
  background: linear-gradient(180deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.82) 100%) !important;
}
.home-page .hero--main .hero__overlay {
  background: linear-gradient(180deg, rgba(255,255,255,.50) 0%, rgba(255,255,255,.78) 100%) !important;
}
.home-page .hero--main .hero__title,
.home-page .hero__title {
  color: var(--color-ink) !important;
  text-shadow: none !important;
  -webkit-text-fill-color: var(--color-ink);
}
.home-page .hero--main .hero__eyebrow,
.home-page .hero__eyebrow {
  color: var(--color-muted) !important;
}
.home-page .hero__scroll {
  color: var(--color-muted) !important;
}
.home-page .hero__scroll-line {
  background: var(--color-border-2) !important;
}
.home-page .hero__btn {
  color: var(--color-paper) !important;
}

/* --- TOPBAR: light bg, brand-red text --- */
.site-topbar {
  background: linear-gradient(135deg, rgba(var(--color-primary-rgb),0.06) 0%, rgba(255,255,255,1) 100%) !important;
  color: var(--color-primary) !important;
  border-bottom: 1px solid rgba(var(--color-primary-rgb),.15) !important;
}
.site-topbar__item,
.site-topbar a {
  color: var(--color-primary) !important;
}
.site-topbar__item:hover,
.site-topbar__item:focus-visible,
.site-topbar a:hover {
  color: var(--color-primary-hover) !important;
  text-decoration: underline !important;
  text-underline-offset: 4px;
}
.site-topbar__address {
  color: var(--color-primary) !important;
  opacity: .85;
}

/* --- ABOUT CTA: round → square --- */
.about-btn,
.about-btn--primary,
.about-btn--ghost {
  border-radius: 0 !important;
}

/* --- BRAND PILLS: round → square --- */
.home-brands__item,
.home-page .home-brands__item {
  border-radius: 0 !important;
}

/* --- TOP DEALS: wider container on desktop --- */
@media (min-width: 1100px){
  .home-deals > .container,
  section.home-deals > .container {
    max-width: 1440px !important;
    width: min(100% - 32px, 1440px) !important;
  }
}
@media (min-width: 1440px){
  .home-deals > .container,
  section.home-deals > .container {
    max-width: 1600px !important;
    width: min(100% - 48px, 1600px) !important;
  }
}

/* --- FOOTER: 2-column on desktop (left=contacts, right=legal) --- */
@media (min-width: 769px){
  .site-footer__inner.dag-container,
  .site-footer__inner {
    grid-template-columns: 1fr auto !important;
    max-width: var(--container-base, 1280px) !important;
    gap: var(--space-6) var(--space-12) !important;
    align-items: start !important;
  }
  .site-footer__contacts {
    grid-column: 1;
    grid-row: 1;
  }
  .site-footer__legal {
    grid-column: 2;
    grid-row: 1;
    margin: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
    order: 0 !important;
    width: auto !important;
    min-width: 220px;
  }
  .site-footer .footer-legal {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: var(--space-3) !important;
    justify-content: flex-start !important;
  }
  .site-footer__copyright {
    grid-column: 1 / -1;
    border-top: 1px solid var(--footer-border);
    padding-top: var(--space-4);
    margin-top: var(--space-2);
  }
}
/* === R60 end === */

/* ============================================================
   R61 — yellow lines, ABOUT/NEWS sections, footer cleanup
   (2026-05-05)
   ============================================================ */

/* --- YELLOW EYEBROW UNDERLINES → BRAND RED --- */
.home-page .hero__eyebrow::after,
.home-page .hero__eyebrow::before,
.hero__eyebrow::after,
.hero__eyebrow::before {
  background: var(--color-primary) !important;
  background-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}
.hero__eyebrow {
  border-color: var(--color-primary) !important;
}

/* --- ABOUT SECTION → WHITE BG + DARK TEXT --- */
.home-page .home-about,
.home-page .home-about.section-dark-alt,
.home-page section.home-about {
  background: var(--color-paper) !important;
  background-color: var(--color-paper) !important;
  color: var(--color-ink) !important;
}
.home-page .home-about .section-title,
.home-page .home-about .section-lead,
.home-page .home-about .section-col p,
.home-page .home-about .section-col h2 {
  color: var(--color-ink) !important;
}
.home-page .home-about .hero__eyebrow,
.home-page .home-about .hero__eyebrow--small {
  color: var(--color-muted) !important;
}

/* --- NEWS SECTION → WHITE OVERLAY + DARK TEXT --- */
.home-page .home-news::before {
  background: linear-gradient(135deg, rgba(255,255,255,0.88) 0%, rgba(255,255,255,0.72) 100%) !important;
}
.home-page .home-news,
.home-page .home-news .section-title,
.home-page .home-news p,
.home-page .home-news .home-news__text,
.home-page .home-news .hero__eyebrow,
.home-page .home-news .hero__eyebrow--small {
  color: var(--color-ink) !important;
}
.home-page .home-news .home-news__text {
  color: var(--color-muted) !important;
}
.home-page .home-news .hero__eyebrow,
.home-page .home-news .hero__eyebrow--small {
  color: var(--color-muted) !important;
}

/* === R61 end === */

/* ============================================================
   R62 — footer Variant A: 3-column grid (Contact / Hours / Legal)
   (2026-05-05) — supersedes R61 footer block
   ============================================================ */

.site-footer {
  padding: var(--space-12) 0 var(--space-5) !important;
  background: var(--footer-bg) !important;
}

.site-footer .footer-brand {
  text-align: center !important;
  margin: 0 0 var(--space-10) !important;
  font-size: var(--fs-2xl) !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

.site-footer__inner.dag-container,
.site-footer__inner {
  display: grid !important;
  grid-template-columns: 1fr !important;
  max-width: 1200px !important;
  margin-inline: auto !important;
  padding-inline: var(--container-padding-x, 24px) !important;
  gap: var(--space-6) !important;
}

.site-footer .footer-contact-list,
.site-footer .footer-contact-list--hours {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: var(--space-3) !important;
}

.site-footer .footer-contact-list li {
  display: grid !important;
  grid-template-columns: 84px minmax(0, 1fr) !important;
  align-items: baseline !important;
  gap: var(--space-3) !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.site-footer .footer-label {
  color: rgba(255, 255, 255, .55) !important;
  font-size: 11px !important;
  letter-spacing: 0.1em !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}

.site-footer .footer-contact-list a,
.site-footer .footer-contact-list li > span:not(.footer-label),
.site-footer .footer-contact-list strong,
.site-footer .footer-hours {
  color: var(--footer-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.6 !important;
  text-decoration: none !important;
}

.site-footer .footer-contact-list a:hover {
  color: var(--color-primary) !important;
}

/* Brand row spans full width */
.site-footer .footer-brand {
  grid-column: 1 / -1 !important;
}

/* Section column wrappers */
.site-footer__contacts {
  display: contents;
}

.site-footer__legal {
  margin: 0 !important;
  padding: 0 !important;
  border-top: 0 !important;
  width: auto !important;
  align-self: start !important;
}

.site-footer .footer-legal {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: var(--space-3) !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
}

.site-footer .footer-legal li {
  display: list-item !important;
  border: 0 !important;
  background: transparent !important;
}

.site-footer .footer-legal a {
  color: rgba(255, 255, 255, .85) !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  text-decoration: none !important;
  line-height: 1.5 !important;
}

.site-footer .footer-legal a:hover {
  color: var(--color-primary) !important;
}

.site-footer__copyright {
  text-align: center !important;
  color: rgba(255, 255, 255, .55) !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  margin: 0 !important;
  padding-top: var(--space-4) !important;
  border-top: 1px solid rgba(255, 255, 255, .08) !important;
}

/* DESKTOP — 3 columns: Contact / Hours / Legal */
@media (min-width: 769px){
  .site-footer__inner.dag-container,
  .site-footer__inner {
    grid-template-columns: 1.4fr 1fr 1fr !important;
    grid-template-areas:
      "brand brand brand"
      "contact hours legal"
      "copy   copy  copy" !important;
    column-gap: var(--space-12) !important;
    row-gap: var(--space-8) !important;
    align-items: start !important;
  }
  .site-footer .footer-brand {
    grid-area: brand !important;
  }
  .site-footer__contacts {
    display: contents;
  }
  .site-footer .footer-contact-list:not(.footer-contact-list--hours) {
    grid-area: contact !important;
  }
  .site-footer .footer-contact-list--hours {
    grid-area: hours !important;
  }
  .site-footer__legal {
    grid-area: legal !important;
  }
  .site-footer__copyright {
    grid-area: copy !important;
  }
  .site-footer .footer-contact-list--hours li {
    grid-template-columns: 1fr !important;
  }
  .site-footer .footer-contact-list--hours .footer-label {
    margin-bottom: 4px;
  }
}

/* MOBILE */
@media (max-width: 768px){
  .site-footer__inner.dag-container,
  .site-footer__inner {
    grid-template-columns: 1fr !important;
    gap: var(--space-6) !important;
  }
  .site-footer .footer-contact-list li {
    grid-template-columns: 1fr !important;
    gap: 2px !important;
  }
  .site-footer .footer-legal {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: var(--space-4) !important;
    justify-content: flex-start !important;
  }
}
/* === R62 end === */

/* ============================================================
   R66 — about-hero layout + white background (2026-05-05)
   Overrides legal-hero-redesign.css and about.css ::before tints
   ============================================================ */

/* 1. Section background — kill rose/red gradients */
section.about-hero,
.about-hero {
  background: var(--color-paper) !important;
  background-image: none !important;
  padding-block: var(--space-12) var(--space-10) !important;
  border-bottom: 1px solid var(--color-border) !important;
}
.about-hero::before,
.about-hero::after {
  display: none !important;
  background: none !important;
  content: none !important;
}

/* 2. Container width */
.about-hero .dag-container {
  max-width: 1280px !important;
  margin-inline: auto !important;
  padding-inline: var(--container-padding-x, 24px) !important;
  position: relative !important;
}

/* 3. Grid — 2 columns on desktop */
@media (min-width: 901px){
  .about-hero .about-hero__grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) !important;
    gap: var(--space-12) !important;
    align-items: center !important;
    max-width: none !important;
  }
  .about-hero__content {
    grid-column: 1 !important;
    max-width: none !important;
    width: auto !important;
  }
  .about-hero__media {
    grid-column: 2 !important;
    display: block !important;
    width: 100% !important;
  }
}

/* 4. Mobile — single column, image below, shorter */
@media (max-width: 900px){
  .about-hero .about-hero__grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: var(--space-6) !important;
  }
  .about-hero__media {
    display: block !important;
  }
}

/* 5. Frame — kill rose overlay, constrain proportions */
.about-hero__frame {
  position: relative !important;
  overflow: hidden !important;
  aspect-ratio: 4 / 3 !important;
  max-height: 520px !important;
  border-radius: 0 !important;
  background: var(--color-surface-2) !important;
  border: 1px solid var(--color-border) !important;
  transform: none !important;
}
.about-hero__frame::before,
.about-hero__frame::after {
  display: none !important;
  background: none !important;
  content: none !important;
}
.about-hero__shade {
  display: none !important;
}

/* 6. Image fills frame, no transform */
.about-hero__img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  transform: none !important;
  border-radius: 0 !important;
  max-height: none !important;
}

/* 7. Mobile frame — wider but shorter */
@media (max-width: 900px){
  .about-hero__frame {
    aspect-ratio: 16 / 10 !important;
    max-height: 280px !important;
  }
}

/* 8. Text colors clean on white */
.about-hero__title {
  color: var(--color-ink) !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
  -webkit-text-fill-color: var(--color-ink) !important;
}
.about-hero__lead {
  color: var(--color-muted) !important;
}
.about-kicker {
  color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}

/* 9. Pills (contact rows) — light surface, dark text */
.about-pill {
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border) !important;
}
.about-pill__label {
  color: var(--color-muted) !important;
}
.about-pill__value,
.about-pill__valueLink {
  color: var(--color-ink) !important;
}
.about-pill__valueLink:hover {
  color: var(--color-primary) !important;
}

/* 10. Chips (highlights) — square, light */
.about-chip {
  background: var(--color-surface-2) !important;
  border: 1px solid var(--color-border) !important;
  color: var(--color-ink) !important;
  border-radius: 0 !important;
}
/* === R66 end === */

/* ============================================================
   R68 — contact-hero white tint, dark text, square chips
   (2026-05-05) — keeps photo visible, layers white veil
   Scoped to .contact-hero only — does not affect legal pages
   ============================================================ */

section.contact-hero,
.contact-hero {
  position: relative !important;
  isolation: isolate;
  border-bottom: 1px solid var(--color-border) !important;
  background-color: var(--color-paper) !important;
}

/* Kill prior dymka overlays (site-ui ::before, legal-hero ::after) */
.contact-hero::before,
.contact-hero::after,
section.contact-hero::before,
section.contact-hero::after {
  background: none !important;
  background-image: none !important;
  display: none !important;
  content: none !important;
}

/* Re-introduce ONE owned overlay — white veil over the photo */
.contact-hero {
  background-blend-mode: lighten;
}
.contact-hero::before {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(255,255,255,.78) 0%, rgba(255,255,255,.88) 100%) !important;
}

/* Inner content sits above the veil */
.contact-hero .contact-hero__inner,
.contact-hero .dag-contact-hero__inner {
  position: relative !important;
  z-index: 1 !important;
  max-width: 1100px !important;
  margin-inline: auto !important;
  padding-block: var(--space-12) var(--space-10) !important;
}

/* Text colors on white tint */
.contact-hero .contact-hero__kicker {
  color: var(--color-primary) !important;
  text-shadow: none !important;
}
.contact-hero .contact-hero__title,
.contact-hero .dag-contact-hero__title,
.contact-hero h1 {
  color: var(--color-ink) !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
  -webkit-text-fill-color: var(--color-ink) !important;
  background: none !important;
}
.contact-hero .contact-hero__subtitle,
.contact-hero .dag-contact-hero__lead,
.contact-hero p {
  color: var(--color-muted) !important;
  text-shadow: none !important;
}

/* Chips — square, light surface, dark text */
.contact-hero .contact-hero__chips {
  list-style: none !important;
  padding: 0 !important;
  margin-top: var(--space-5) !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: var(--space-3) !important;
}
.contact-hero .contact-hero__chips .contact-chip,
.contact-hero .contact-chip {
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border) !important;
  color: var(--color-ink) !important;
  border-radius: 0 !important;
  padding: 8px 14px !important;
  font-size: var(--fs-sm) !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  list-style: none !important;
}

/* Action buttons — square, brand */
.contact-hero .contact-hero__actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: var(--space-3) !important;
  margin-top: var(--space-5) !important;
}
.contact-hero .dag-btn--primary {
  border-radius: 0 !important;
}
.contact-hero .dag-btn--ghost {
  background: transparent !important;
  border: 1px solid var(--color-border) !important;
  color: var(--color-ink) !important;
  border-radius: 0 !important;
}
.contact-hero .dag-btn--ghost:hover {
  background: var(--color-surface) !important;
  border-color: var(--color-ink) !important;
  color: var(--color-ink) !important;
}
/* === R68 end === */

/* ============================================================
   R71 — phone-wrap prefix polish (2026-05-05)
   Override forms.css:335 generic absolute prefix; render prefix
   as left-cap with proper separator and clear visual hierarchy
   ============================================================ */

.dag-phone-wrap {
  position: relative !important;
  display: flex !important;
  align-items: stretch !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  background: var(--color-surface) !important;
  box-shadow: none !important;
  min-height: 48px !important;
}

.dag-phone-wrap .dag-phone-prefix {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 16px !important;
  background: var(--color-surface-2) !important;
  color: var(--color-ink) !important;
  font-weight: 700 !important;
  font-size: var(--fs-base) !important;
  letter-spacing: 0.02em !important;
  border-right: 1px solid var(--color-border) !important;
  border-radius: 0 !important;
  flex-shrink: 0 !important;
  flex-grow: 0 !important;
  white-space: nowrap !important;
  user-select: none !important;
  pointer-events: none !important;
  transform: none !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  z-index: auto !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
}

.dag-phone-wrap input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  padding: 0 14px !important;
  font-size: var(--fs-base) !important;
  color: var(--color-ink) !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  height: auto !important;
}

.dag-phone-wrap:focus-within {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 2px rgba(var(--color-primary-rgb), 0.15) !important;
}

.dag-phone-wrap input::placeholder {
  color: var(--color-muted) !important;
  opacity: 0.7 !important;
}

/* Char counter sizing — keep readable next to phone */
.dag-phone-wrap + .char-counter,
.home-contact__field .char-counter,
.dag-field .char-counter {
  display: inline-block !important;
  margin-top: 4px !important;
  font-size: var(--fs-xs) !important;
  color: var(--color-muted) !important;
  letter-spacing: 0.02em !important;
}
/* === R71 end === */

/* ============================================================
   R72 — mobile form layout (≤768px) (2026-05-05)
   Fixes: email/phone squeezed, label letter-wrap, narrow inputs
   ============================================================ */

@media (max-width: 768px) {
  .home-contact__row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    width: 100% !important;
  }

  .home-contact__field {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    flex: none !important;
  }

  .home-contact__field > input,
  .home-contact__field > select,
  .home-contact__field > textarea,
  .home-contact__field .dag-phone-wrap {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    min-height: 48px !important;
    font-size: 16px !important;
  }

  .home-contact__field > textarea {
    min-height: 140px !important;
    resize: vertical !important;
  }

  .home-contact__field label {
    display: block !important;
    margin-bottom: 8px !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    line-height: 1.35 !important;
    font-size: 13px !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    color: var(--color-ink) !important;
  }

  .home-contact__field .dag-phone-wrap {
    flex-direction: row !important;
  }

  .home-contact__field .char-counter {
    display: block !important;
    text-align: right !important;
    margin-top: 4px !important;
    font-size: 12px !important;
    color: var(--color-muted, #888) !important;
    letter-spacing: 0.02em !important;
  }

  .home-contact__field .dag-required-asterisk {
    color: var(--color-primary) !important;
    margin-left: 2px !important;
  }
}

/* Tablet — keep 2-column layout for compact rows */
@media (min-width: 769px) and (max-width: 1024px) {
  .home-contact__row {
    grid-template-columns: 1fr 1fr !important;
  }
}
/* === R72 end === */

/* ============================================================
   R74 — hide +1 badge when 11-digit leading-1 entered
   forms.js toggles .dag-field--phone-prefix-hidden on wrap
   Higher specificity to beat R71's display:inline-flex !important
   ============================================================ */

.dag-field.dag-field--phone-prefix-hidden .dag-phone-prefix,
.dag-phone-wrap.dag-field--phone-prefix-hidden .dag-phone-prefix,
.home-contact__field.dag-field--phone-prefix-hidden .dag-phone-prefix,
.dag-field--phone-prefix-hidden .dag-phone-wrap > .dag-phone-prefix {
  display: none !important;
  width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* === R74 end === */

/* ============================================================
   R75 — single-column form below 1024px (2026-05-05)
   Overrides any prior grid/flex rules; stacks every field.
   Drops the R72 tablet 2-col rule which was forcing side-by-side
   ============================================================ */

@media (max-width: 1024px) {
  body .home-contact__row,
  html body .home-contact__row,
  .home-page .home-contact__row,
  .dag-page .home-contact__row,
  .dag-page--home .home-contact__row,
  form .home-contact__row,
  .home-contact .home-contact__row {
    display: block !important;
    grid-template-columns: 1fr !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100% !important;
  }

  body .home-contact__row > .home-contact__field,
  html body .home-contact__row > .home-contact__field,
  .home-page .home-contact__row > .home-contact__field,
  .dag-page .home-contact__row > .home-contact__field,
  .home-contact__row > .home-contact__field {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    grid-column: auto !important;
    margin: 0 0 18px 0 !important;
    box-sizing: border-box !important;
  }

  .home-contact__row > .home-contact__field:last-child {
    margin-bottom: 0 !important;
  }

  .home-contact__row > .home-contact__field > input,
  .home-contact__row > .home-contact__field > select,
  .home-contact__row > .home-contact__field > textarea,
  .home-contact__row > .home-contact__field .dag-phone-wrap {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .home-contact__row > .home-contact__field .dag-phone-wrap {
    display: flex !important;
  }

  .home-contact__row > .home-contact__field label {
    display: block !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    line-height: 1.35 !important;
    margin-bottom: 8px !important;
  }
}
/* === R75 end === */

/* ============================================================
   R76 — mobile inventory single-column + pagination centering
   (2026-05-05) — placeholder selectors; refined in R77 after audit
   ============================================================ */

@media (max-width: 768px) {
  .inv-grid,
  .inventory-grid,
  .dag-inventory-grid,
  .cars-grid,
  .inventory-layout > .inv-grid,
  .dag-inventory > .inv-grid,
  div[class*="inventory-grid"],
  ul.page-numbers ~ * .inv-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    width: 100% !important;
  }

  .inv-grid > *,
  .inventory-grid > *,
  .cars-grid > *,
  .inv-card {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  /* Pagination — center, wrap, equal-sized buttons */
  .page-numbers,
  ul.page-numbers,
  .inventory-pagination .page-numbers,
  nav.inventory-pagination ul.page-numbers {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin: 24px 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .page-numbers li,
  ul.page-numbers li {
    margin: 0 !important;
  }

  .page-numbers .page-numbers,
  ul.page-numbers a.page-numbers,
  ul.page-numbers span.page-numbers {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 0 10px !important;
    font-size: 14px !important;
    border-radius: 0 !important;
  }
}
/* === R76 end === */

/* ============================================================
   R77 — comprehensive mobile polish (2026-05-05)
   Big card image fit / lightbox / subscribe / sort / single-car phone
   ============================================================ */

/* 1. Big inventory cards — show full image, letterbox */
.inv-card,
.inv-card__media,
.inv-card__image,
.inv-card .image-frame,
.car-card__image,
.dag-inv-card__media,
.inventory-card__image {
  background-color: var(--color-surface-2, #f4f4f5) !important;
}
.inv-card img,
.inv-card__media img,
.inv-card__image img,
.inv-card .image-frame img,
.car-card img,
.dag-inv-card__media img,
.inventory-card img,
.inv-card__photo img {
  object-fit: contain !important;
  object-position: center !important;
  width: 100% !important;
  height: 100% !important;
  background-color: var(--color-surface-2, #f4f4f5) !important;
}

/* 2. Mobile lightbox — counter visible, Zoom/Fullscreen accessible */
@media (max-width: 768px) {
  .dag-lightbox__counter,
  .lb-counter,
  .lightbox__counter,
  [class*="lightbox"][class*="counter"] {
    position: absolute !important;
    top: 16px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 10000 !important;
    background: rgba(0, 0, 0, 0.75) !important;
    color: #fff !important;
    padding: 6px 14px !important;
    border-radius: 0 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em !important;
    display: inline-flex !important;
    align-items: center !important;
    pointer-events: none !important;
  }

  .dag-lightbox__zoom,
  .dag-lightbox__fullscreen,
  .lb-zoom,
  .lb-fullscreen,
  .lightbox__zoom,
  .lightbox__fullscreen,
  [class*="lightbox"] button[aria-label*="oom"],
  [class*="lightbox"] button[aria-label*="ullscreen"] {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 10001 !important;
    min-width: 44px !important;
    min-height: 44px !important;
    background: rgba(0, 0, 0, 0.75) !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 8px !important;
    cursor: pointer !important;
  }

  .dag-lightbox__controls,
  .lb-controls,
  .lightbox__controls,
  [class*="lightbox"] [class*="control"] {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    display: flex !important;
    gap: 8px !important;
    z-index: 10001 !important;
  }

  .dag-lightbox__nav,
  .lb-prev,
  .lb-next,
  [class*="lightbox"] [class*="prev"],
  [class*="lightbox"] [class*="next"] {
    z-index: 10000 !important;
    min-width: 48px !important;
    min-height: 48px !important;
  }
}

/* 3. Subscribe to updates checkbox — mobile layout */
@media (max-width: 768px) {
  .car-form__newsletter,
  .form-newsletter,
  .dag-form .newsletter-row,
  .dag-form-row--newsletter,
  .single-car-form .newsletter,
  .car-inquiry__newsletter,
  label.subscribe-updates,
  .subscribe-updates {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 12px !important;
    margin: 16px 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  .car-form__newsletter input[type="checkbox"],
  .form-newsletter input[type="checkbox"],
  .dag-form input[name*="newsletter"],
  .dag-form input[name*="subscribe"],
  .car-inquiry__newsletter input[type="checkbox"],
  label.subscribe-updates input[type="checkbox"] {
    flex: 0 0 auto !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    accent-color: var(--color-primary) !important;
    cursor: pointer !important;
  }

  .car-form__newsletter span,
  .form-newsletter span,
  .car-inquiry__newsletter span,
  label.subscribe-updates span,
  .subscribe-updates label,
  .dag-form input[type="checkbox"] + label,
  .dag-form input[type="checkbox"] + span {
    flex: 1 1 auto !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    cursor: pointer !important;
    margin: 0 !important;
    color: var(--color-ink) !important;
    font-weight: 600 !important;
  }
}

/* 4. Sticky sort widget — keep within bounds on mobile */
@media (max-width: 768px) {
  .inventory-sort,
  .inv-sort,
  .inventory-toolbar,
  .dag-inventory__toolbar,
  .inventory-controls,
  div[class*="inventory-sort"],
  div[class*="sort-bar"] {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    z-index: 1 !important;
    width: 100% !important;
  }

  .inventory-sort__overlay,
  .inv-sort__panel,
  .sort-overlay,
  .filter-popover,
  .per-page-popover,
  div[class*="sort"][class*="overlay"],
  div[class*="sort"][class*="popover"] {
    position: relative !important;
    transform: none !important;
    width: 100% !important;
    box-shadow: none !important;
  }
}

/* 5. Single-car form phone prefix — match home form +1 cap style */
.phone-wrap,
.lead-form .phone-wrap,
.car-form .phone-wrap,
.single-car-form .phone-wrap,
form .phone-wrap {
  position: relative !important;
  display: flex !important;
  align-items: stretch !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  background: var(--color-surface) !important;
  min-height: 48px !important;
  box-shadow: none !important;
}

.phone-wrap .phone-prefix,
.lead-form .phone-wrap .phone-prefix,
form .phone-wrap .phone-prefix {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 16px !important;
  background: var(--color-surface-2) !important;
  color: var(--color-ink) !important;
  font-weight: 700 !important;
  font-size: var(--fs-base) !important;
  letter-spacing: 0.02em !important;
  border-right: 1px solid var(--color-border) !important;
  flex-shrink: 0 !important;
  white-space: nowrap !important;
  pointer-events: none !important;
  user-select: none !important;
  transform: none !important;
  margin: 0 !important;
  width: auto !important;
  height: auto !important;
  left: auto !important;
  top: auto !important;
}

.phone-wrap input,
.lead-form .phone-wrap input,
form .phone-wrap input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  padding: 0 14px !important;
  font-size: var(--fs-base) !important;
  color: var(--color-ink) !important;
  height: auto !important;
}

/* Hide prefix when JS toggles --phone-prefix-hidden class on wrap */
.phone-wrap.dag-field--phone-prefix-hidden .phone-prefix,
.dag-field--phone-prefix-hidden .phone-wrap > .phone-prefix,
.phone-wrap.phone-prefix-hidden .phone-prefix {
  display: none !important;
  width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* 6. Marquee styling (HTML inserted in R78) — brand red, white text */
.OLD-dag-marquee {
  background: var(--color-primary) !important;
  color: #fff !important;
  overflow: hidden !important;
  position: relative !important;
  height: 38px !important;
  display: flex !important;
  align-items: center !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  z-index: 50 !important;
}

.OLD-dag-marquee__track {
  display: flex !important;
  gap: 60px !important;
  white-space: nowrap !important;
  animation: OLD-dag-marquee-scroll 35s linear infinite !important;
  padding-left: 60px !important;
}

.OLD-dag-marquee__item {
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  display: inline-block !important;
  flex-shrink: 0 !important;
}

.OLD-dag-marquee__item::after {
  content: " • ";
  margin: 0 30px;
  opacity: 0.5;
}

@keyframes OLD-dag-marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .OLD-dag-marquee__track { animation: none !important; }
}
/* === R77 end === */

/* ============================================================
   R78 — lightbox mobile + CTA vertical stack (2026-05-05)
   Fix: counter+Zoom+Fullscreen invisible on mobile lightbox
   Fix: Send Inquiry needs to stack BELOW Call on mobile
   ============================================================ */

@media (max-width: 768px) {
  /* Lightbox: ensure full-screen modal */
  .dag-car-single .car-lightbox.is-open,
  .car-lightbox.is-open {
    position: fixed !important;
    inset: 0 !important;
    z-index: 9999 !important;
  }

  /* Tools group (Zoom + Fullscreen) — top right */
  .dag-car-single .car-lightbox__tools,
  .car-lightbox__tools {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 10001 !important;
    gap: 6px !important;
    pointer-events: auto !important;
  }

  /* Individual tool button */
  .dag-car-single .car-lightbox__tool,
  .car-lightbox__tool {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 8px !important;
    background: rgba(0, 0, 0, 0.7) !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    pointer-events: auto !important;
  }

  /* Hide tool text labels on mobile (icon only) */
  .dag-car-single .car-lightbox__tool-label,
  .car-lightbox__tool-label {
    display: none !important;
  }

  /* Caption / counter — visible bottom-center */
  .dag-car-single .car-lightbox__cap,
  .car-lightbox__cap {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 10000 !important;
    color: #fff !important;
    background: rgba(0, 0, 0, 0.6) !important;
    padding: 6px 14px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    pointer-events: none !important;
  }

  /* Mobile CTA bar — vertical stack (Call on top, Send Inquiry below) */
  .mobile-cta-bar {
    flex-direction: column !important;
    height: auto !important;
    min-height: 0 !important;
    --mobile-cta-height: auto !important;
  }
  .mobile-cta-bar__btn {
    width: 100% !important;
    flex: 1 0 auto !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    min-height: 54px !important;
  }
  .mobile-cta-bar__btn:last-child {
    border-bottom: 0 !important;
  }
}
/* === R78 end === */

/* ============================================================
   R79 — inv-card 4:3 + photo marquee + force lightbox/CTA/offcanvas
   (2026-05-05)
   ============================================================ */

/* 1. Inventory cards — 4:3 with full photo (contain) */
.inv-card .inv-card__media,
.inv-card__media,
.car-card__media {
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  background: var(--color-surface-2) !important;
  position: relative !important;
}

.inv-card .inv-card__img,
.inv-card__img,
.car-card__img,
.inv-card__media img,
.car-card__media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  background: var(--color-surface-2) !important;
}

/* 2. Photo marquee — image-based variant */
.OLD-dag-marquee.OLD-dag-marquee--images {
  background: var(--color-paper) !important;
  border-top: 1px solid var(--color-border) !important;
  border-bottom: 1px solid var(--color-border) !important;
  height: auto !important;
  padding: 12px 0 !important;
  overflow: hidden !important;
  position: relative !important;
  z-index: 50 !important;
  display: block !important;
}

.OLD-dag-marquee--images .OLD-dag-marquee__track {
  display: flex !important;
  gap: 40px !important;
  align-items: center !important;
  white-space: nowrap !important;
  width: max-content !important;
  animation: OLD-dag-marquee-scroll var(--marquee-speed, 35s) linear infinite !important;
  padding-left: 40px !important;
}

.OLD-dag-marquee--images .OLD-dag-marquee__slide {
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  height: var(--marquee-height, 64px) !important;
}

.OLD-dag-marquee--images .OLD-dag-marquee__slide img {
  height: 100% !important;
  width: auto !important;
  max-width: 240px !important;
  object-fit: contain !important;
  display: block !important;
  filter: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .OLD-dag-marquee--images .OLD-dag-marquee__track {
    animation: none !important;
  }
}

/* 3. Lightbox mobile — high-specificity force */
@media (max-width: 768px) {
  html body .dag-car-single .car-lightbox.is-open,
  html body .car-lightbox.is-open {
    z-index: 99999 !important;
  }

  html body .dag-car-single .car-lightbox__tools,
  html body .car-lightbox__tools {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    left: auto !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 100002 !important;
    max-width: none !important;
  }

  html body .dag-car-single .car-lightbox__tool,
  html body .car-lightbox__tool {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 10px !important;
    background: rgba(0, 0, 0, 0.78) !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 0 !important;
    font-size: 11px !important;
  }

  html body .dag-car-single .car-lightbox__tool-label,
  html body .car-lightbox__tool-label {
    display: none !important;
  }

  html body .dag-car-single .car-lightbox__cap,
  html body .car-lightbox__cap {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #fff !important;
    background: rgba(0, 0, 0, 0.7) !important;
    text-align: center !important;
    padding: 6px 14px !important;
    margin: 8px auto 0 !important;
    align-self: center !important;
    border-radius: 0 !important;
  }

  html body .dag-car-single .car-lightbox__close,
  html body .car-lightbox__close {
    z-index: 100002 !important;
  }
}

/* 4. Mobile CTA — vertical stack with maximum specificity */
@media (max-width: 768px) {
  html body aside.mobile-cta-bar,
  html body .mobile-cta-bar {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 0 !important;
    --mobile-cta-height: auto !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  html body aside.mobile-cta-bar .mobile-cta-bar__btn,
  html body .mobile-cta-bar .mobile-cta-bar__btn {
    width: 100% !important;
    flex: 1 0 auto !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    min-height: 56px !important;
    padding: 10px 16px !important;
  }
  html body .mobile-cta-bar .mobile-cta-bar__btn:last-child {
    border-bottom: 0 !important;
  }
}

/* 5. Offcanvas panel — defensive force visible when .is-open */
.site-offcanvas.is-open {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.site-offcanvas.is-open .site-offcanvas__panel {
  transform: translateX(0) !important;
  visibility: visible !important;
  opacity: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  background: var(--color-paper, #fff) !important;
  color: var(--color-ink, #000) !important;
  pointer-events: auto !important;
}

.site-offcanvas.is-open .site-offcanvas__nav,
.site-offcanvas.is-open .site-offcanvas__nav a,
.site-offcanvas.is-open .site-offcanvas__nav li,
.site-offcanvas.is-open .site-offcanvas__pills,
.site-offcanvas.is-open .site-offcanvas__pills a,
.site-offcanvas.is-open .site-offcanvas__contact,
.site-offcanvas.is-open .site-offcanvas__top {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: var(--color-ink, #000) !important;
}

.site-offcanvas.is-open .site-offcanvas__nav {
  list-style: none !important;
  padding: 0 !important;
  margin-top: 24px !important;
}

.site-offcanvas.is-open .site-offcanvas__nav a {
  display: block !important;
  padding: 12px 0 !important;
  color: var(--color-ink, #000) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  border-bottom: 1px solid var(--color-border, #e5e5e5) !important;
}
/* === R79 end === */

/* ============================================================
   R80 — text marquee variant (mode 2) (2026-05-05)
   Brand red bg, white uppercase items, infinite scroll
   ============================================================ */

.OLD-dag-marquee.OLD-dag-marquee--text {
  background: var(--color-primary) !important;
  color: #fff !important;
  height: 38px !important;
  padding: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden !important;
  position: relative !important;
  z-index: 50 !important;
}

.OLD-dag-marquee--text .OLD-dag-marquee__track {
  display: flex !important;
  gap: 0 !important;
  align-items: center !important;
  white-space: nowrap !important;
  width: max-content !important;
  animation: OLD-dag-marquee-scroll var(--marquee-speed, 35s) linear infinite !important;
  padding-left: 60px !important;
}

.OLD-dag-marquee--text .OLD-dag-marquee__item {
  display: inline-block !important;
  flex-shrink: 0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.OLD-dag-marquee--text .OLD-dag-marquee__item::after {
  content: "•";
  margin: 0 30px;
  opacity: 0.5;
  font-size: 14px;
}

@media (prefers-reduced-motion: reduce) {
  .OLD-dag-marquee--text .OLD-dag-marquee__track {
    animation: none !important;
  }
}
/* === R80 end === */

/* ============================================================
   R81 — sticky kill + dag-lightbox modal + CTA narrow + financing
   (2026-05-05)
   ============================================================ */

/* 1. Inventory sort bar — NOT sticky on mobile/tablet */
@media (max-width: 1024px) {
  html body .inventory-bar,
  html body .inventory-topbar,
  html body .dag-inventory .inventory-bar {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    z-index: 1 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
  }
}

/* 2. dag-lightbox — full modal styling (separate from car-lightbox) */
.dag-lightbox {
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
  background: rgba(0, 0, 0, 0.92) !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 60px 40px !important;
}

.dag-lightbox.is-open {
  display: flex !important;
}

.dag-lightbox__stage {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
}

.dag-lightbox__img {
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
  background: transparent !important;
}

.dag-lightbox__close {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  width: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  border-radius: 0 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  z-index: 100002 !important;
  padding: 0 !important;
}

.dag-lightbox__close:hover {
  background: rgba(255, 255, 255, 0.22) !important;
}

.dag-lightbox__nav {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 48px !important;
  height: 48px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  border-radius: 0 !important;
  font-size: 28px !important;
  line-height: 1 !important;
  cursor: pointer !important;
  z-index: 100001 !important;
  padding: 0 !important;
}

.dag-lightbox__nav:hover {
  background: rgba(255, 255, 255, 0.22) !important;
}

.dag-lightbox__nav--prev { left: 12px !important; }
.dag-lightbox__nav--next { right: 12px !important; }

.dag-lightbox__counter {
  position: absolute !important;
  bottom: 16px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  color: #fff !important;
  background: rgba(0, 0, 0, 0.65) !important;
  padding: 6px 14px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  z-index: 100000 !important;
  pointer-events: none !important;
}

@media (max-width: 768px) {
  .dag-lightbox {
    padding: 50px 12px !important;
  }
  .dag-lightbox__nav {
    width: 40px !important;
    height: 40px !important;
    font-size: 24px !important;
  }
  .dag-lightbox__nav--prev { left: 6px !important; }
  .dag-lightbox__nav--next { right: 6px !important; }
}

body.dag-lightbox-open,
body:has(.dag-lightbox.is-open) {
  overflow: hidden !important;
}

/* 3. Mobile CTA bar — narrow, bottom-LEFT corner */
@media (max-width: 768px) {
  html body aside.mobile-cta-bar,
  html body .mobile-cta-bar {
    position: fixed !important;
    left: 12px !important;
    right: auto !important;
    bottom: 12px !important;
    width: auto !important;
    max-width: 180px !important;
    min-width: 0 !important;
    height: auto !important;
    flex-direction: column !important;
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.35) !important;
    background: var(--p-gray-900, #18181b) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 0 !important;
    overflow: hidden !important;
  }

  html body aside.mobile-cta-bar .mobile-cta-bar__btn,
  html body .mobile-cta-bar .mobile-cta-bar__btn {
    width: 100% !important;
    min-height: 46px !important;
    padding: 8px 14px !important;
    border-right: 0 !important;
    border-left: 0 !important;
    border-top: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    text-align: left !important;
  }

  html body .mobile-cta-bar .mobile-cta-bar__btn:last-child {
    border-bottom: 0 !important;
  }

  html body .mobile-cta-bar .mobile-cta-bar__label {
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    opacity: 0.7 !important;
    line-height: 1 !important;
  }

  html body .mobile-cta-bar .mobile-cta-bar__value {
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
  }
}

/* 4. Financing hero — readable contact line (white text + brand bg) */
.dag-financing-hero,
.financing-hero,
.page-financing .dag-hero,
.page-financing .legal-hero,
.dag-financing-hero p,
.financing-hero p,
.page-financing .dag-hero p {
  color: var(--color-paper, #fff) !important;
}

.dag-financing-hero a,
.financing-hero a,
.page-financing .dag-hero a,
.page-financing .legal-hero a {
  color: var(--color-paper, #fff) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
  font-weight: 700 !important;
  opacity: 0.95 !important;
}

.dag-financing-hero a:hover,
.financing-hero a:hover,
.page-financing .dag-hero a:hover,
.page-financing .legal-hero a:hover {
  opacity: 1 !important;
  text-decoration-thickness: 2px !important;
}
/* === R81 end === */

/* ============================================================
   R82 — kill dag-lightbox (defensive) + pagination + offcanvas
   (2026-05-05) — dag-lightbox to be properly removed in R83 via JS
   ============================================================ */

/* 1. Defensive: hide stray .dag-lightbox that car-gallery.js doesn't manage.
      Safe because actual single-car lightbox uses .car-lightbox. */
body .dag-lightbox,
body .dag-lightbox.is-open {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* 2. Pagination — better mobile layout */
@media (max-width: 768px) {
  html body .inventory-pagination {
    margin: 20px 0 !important;
    width: 100% !important;
  }
  html body .inventory-pagination .page-numbers,
  html body ul.page-numbers {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    width: 100% !important;
  }
  html body .inventory-pagination .page-numbers li,
  html body ul.page-numbers li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }
  html body .inventory-pagination .page-numbers a,
  html body .inventory-pagination .page-numbers span,
  html body ul.page-numbers a,
  html body ul.page-numbers span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 36px !important;
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 0 !important;
    background: var(--color-paper) !important;
    color: var(--color-ink) !important;
    text-decoration: none !important;
    line-height: 1 !important;
  }
  html body .inventory-pagination .page-numbers .current,
  html body ul.page-numbers .current {
    background: var(--color-primary) !important;
    color: #fff !important;
    border-color: var(--color-primary) !important;
  }
  html body .inventory-pagination .page-numbers a:hover,
  html body ul.page-numbers a:hover {
    background: var(--color-surface-2) !important;
  }
}

/* 3. Offcanvas — force panel visible + scrollable when open (burger menu fix) */
html body .site-offcanvas[hidden] {
  display: block !important;
}

html body .site-offcanvas.is-open {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html body .site-offcanvas.is-open .site-offcanvas__panel {
  transform: translateX(0) !important;
  visibility: visible !important;
  opacity: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  background: var(--color-paper, #fff) !important;
  color: var(--color-ink, #000) !important;
  z-index: 9501 !important;
  pointer-events: auto !important;
  overflow-y: auto !important;
  padding: 60px 24px 32px !important;
}

html body .site-offcanvas.is-open .site-offcanvas__nav,
html body .site-offcanvas.is-open .site-offcanvas__cta,
html body .site-offcanvas.is-open .site-offcanvas__contact,
html body .site-offcanvas.is-open .site-offcanvas__pills,
html body .site-offcanvas.is-open .site-offcanvas__top {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: inherit !important;
}

html body .site-offcanvas.is-open .site-offcanvas__nav {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 24px !important;
}

html body .site-offcanvas.is-open .site-offcanvas__nav li {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body .site-offcanvas.is-open .site-offcanvas__nav a,
html body .site-offcanvas.is-open .site-offcanvas__cta a,
html body .site-offcanvas.is-open .site-offcanvas__pills a {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  padding: 12px 0 !important;
  color: var(--color-ink, #000) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  border-bottom: 1px solid var(--color-border, #e5e5e5) !important;
}

html body .site-offcanvas.is-open .site-offcanvas__cta {
  margin-bottom: 20px !important;
}

html body .site-offcanvas.is-open .site-offcanvas__cta a {
  background: var(--color-primary) !important;
  color: #fff !important;
  text-align: center !important;
  padding: 12px 16px !important;
  border-bottom: 0 !important;
}

html body .site-offcanvas.is-open .site-offcanvas__pills {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-top: 20px !important;
}

html body .site-offcanvas.is-open .site-offcanvas__pills a {
  border: 1px solid var(--color-border, #e5e5e5) !important;
  padding: 10px 14px !important;
  border-bottom: 1px solid var(--color-border, #e5e5e5) !important;
}

/* When offcanvas open, lock body scroll */
body.site-offcanvas-open,
body:has(.site-offcanvas.is-open) {
  overflow: hidden !important;
}
/* === R82 end === */

/* ============================================================
   R83 — mobile CTA bottom override (beat r34-overrides bottom:80px)
   (2026-05-05)
   ============================================================ */

@media (max-width: 980px) {
  html body aside.mobile-cta-bar,
  html body .mobile-cta-bar {
    bottom: 12px !important;
    left: 12px !important;
    right: auto !important;
    width: auto !important;
    max-width: 180px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
  }
}

/* Make sure padding-bottom on body.single-car doesn't overcompensate */
@media (max-width: 980px) {
  body.single-car {
    padding-bottom: 24px !important;
  }
}
/* === R83 end === */

/* ============================================================
   R88 — marquee single long image (no max-width clip)
   (2026-05-05)
   ============================================================ */

.OLD-dag-marquee--images .OLD-dag-marquee__slide {
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  height: var(--marquee-height, 64px) !important;
}

.OLD-dag-marquee--images .OLD-dag-marquee__slide img {
  height: 100% !important;
  width: auto !important;
  max-width: none !important;
  object-fit: contain !important;
  display: block !important;
  flex-shrink: 0 !important;
}

.OLD-dag-marquee--images .OLD-dag-marquee__track {
  gap: 0 !important;
  padding-left: 0 !important;
}
/* === R88 end === */

/* ============================================================
   R89 — burger menu full-width on mobile
   (2026-05-05)
   ============================================================ */

@media (max-width: 1100px) {
  html body .site-offcanvas__panel {
    width: 100vw !important;
    max-width: 100vw !important;
    right: 0 !important;
    left: 0 !important;
  }
}

@media (min-width: 1101px) {
  html body .site-offcanvas__panel {
    width: 100vw !important;
    max-width: 100vw !important;
  }
}
/* === R89 end === */

/* ============================================================
   R90 — marquee zero padding (image edge-to-edge, no gap)
   (2026-05-05)
   ============================================================ */

html body .OLD-dag-marquee.OLD-dag-marquee--images {
  padding: 0 !important;
  margin: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  background: transparent !important;
  height: var(--marquee-height, 64px) !important;
  line-height: 0 !important;
  overflow: hidden !important;
  display: block !important;
}

html body .OLD-dag-marquee--images .OLD-dag-marquee__track {
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  height: 100% !important;
  align-items: stretch !important;
  line-height: 0 !important;
}

html body .OLD-dag-marquee--images .OLD-dag-marquee__slide {
  flex-shrink: 0 !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  display: flex !important;
  align-items: center !important;
}

html body .OLD-dag-marquee--images .OLD-dag-marquee__slide img {
  height: 100% !important;
  width: auto !important;
  max-width: none !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  vertical-align: top !important;
  flex-shrink: 0 !important;
}
/* === R90 end === */

/* ============================================================
   R91 — phone prefix hidden state (markup-agnostic)
   (2026-05-05) — supports .phone-wrap / .dag-phone-wrap
   ============================================================ */

.phone-wrap.dag-field--phone-prefix-hidden .phone-prefix,
.dag-phone-wrap.dag-field--phone-prefix-hidden .dag-phone-prefix,
.dag-field--phone-prefix-hidden .phone-prefix,
.dag-field--phone-prefix-hidden .dag-phone-prefix {
  display: none !important;
  width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Visual state when field is invalid */
.dag-form .dag-field.is-invalid input,
.dag-form .dag-field.is-invalid select,
.dag-form .dag-field.is-invalid textarea {
  border-color: var(--color-danger) !important;
  outline: 0 !important;
  box-shadow: 0 0 0 2px rgba(var(--color-danger-rgb), 0.18) !important;
}

.dag-form .dag-field__error {
  display: block !important;
  color: var(--color-danger) !important;
  font-size: 13px !important;
  margin: 4px 0 0 !important;
}

.dag-form .dag-field__error[hidden] {
  display: none !important;
}

/* Submit button blocked state */
.dag-form button[type="submit"]:disabled,
.dag-form button[type="submit"].is-blocked,
.dag-form input[type="submit"]:disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}
/* === R91 end === */

/* ============================================================
   R110 — fix marquee cutoff: dynamic height + slide width
   (2026-05-05) — overrides R77 height:38px for image variant
   ============================================================ */

.OLD-dag-marquee.OLD-dag-marquee--images {
  height: var(--marquee-height, 64px) !important;
  padding: 0 !important;
  background: var(--color-paper) !important;
}

.OLD-dag-marquee.OLD-dag-marquee--images .OLD-dag-marquee__track {
  height: 100% !important;
  align-items: center !important;
  gap: 40px !important;
  padding-left: 0 !important;
  animation: OLD-dag-marquee-scroll var(--marquee-speed, 35s) linear infinite !important;
  will-change: transform !important;
}

.OLD-dag-marquee.OLD-dag-marquee--images .OLD-dag-marquee__slide {
  flex-shrink: 0 !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
}

.OLD-dag-marquee.OLD-dag-marquee--images .OLD-dag-marquee__slide img {
  height: 100% !important;
  width: auto !important;
  display: block !important;
  object-fit: contain !important;
  max-height: var(--marquee-height, 64px) !important;
}

@media (prefers-reduced-motion: no-preference) {
  .OLD-dag-marquee.OLD-dag-marquee--images .OLD-dag-marquee__track {
    animation-play-state: running !important;
  }
}
/* === R110 end === */

/* ============================================================
   R111 — marquee seamless loop fix: zero gap, zero padding
   (2026-05-06) — overrides R77/R110 padding-left and gap
   ============================================================ */

.OLD-dag-marquee.OLD-dag-marquee--images,
.OLD-dag-marquee.OLD-dag-marquee--text {
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

.OLD-dag-marquee.OLD-dag-marquee--images .OLD-dag-marquee__track,
.OLD-dag-marquee.OLD-dag-marquee--text .OLD-dag-marquee__track {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  width: max-content !important;
  animation: OLD-dag-marquee-scroll var(--marquee-speed, 35s) linear infinite !important;
  will-change: transform !important;
  transform: translateZ(0) !important;
  backface-visibility: hidden !important;
}

.OLD-dag-marquee.OLD-dag-marquee--images .OLD-dag-marquee__slide {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
}

.OLD-dag-marquee.OLD-dag-marquee--images .OLD-dag-marquee__slide img {
  display: block !important;
  height: var(--marquee-height, 64px) !important;
  max-height: var(--marquee-height, 64px) !important;
  width: auto !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.OLD-dag-marquee.OLD-dag-marquee--text .OLD-dag-marquee__item {
  flex: 0 0 auto !important;
  padding: 0 30px !important;
}

.OLD-dag-marquee.OLD-dag-marquee--text .OLD-dag-marquee__item::after {
  content: none !important;
  margin: 0 !important;
}

@keyframes OLD-dag-marquee-scroll {
  0%   { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}

.OLD-dag-marquee .OLD-dag-marquee__track {
  animation-fill-mode: both !important;
}

.OLD-dag-marquee.OLD-dag-marquee--images:not(.is-ready) .OLD-dag-marquee__track {
  animation-play-state: running !important;
}
/* === R111 end === */

/* ============================================================
   R112 — restore marquee animation, kill R111 max-content trap
   (2026-05-06) — final marquee fix
   ============================================================ */

@keyframes OLD-dag-marquee-r112 {
  0%   { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}

html body .OLD-dag-marquee.OLD-dag-marquee--images,
html body .OLD-dag-marquee.OLD-dag-marquee--text {
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

html body .OLD-dag-marquee.OLD-dag-marquee--images .OLD-dag-marquee__track,
html body .OLD-dag-marquee.OLD-dag-marquee--text .OLD-dag-marquee__track {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  width: auto !important;
  min-width: 200% !important;
  max-width: none !important;
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  height: 100% !important;
  animation: OLD-dag-marquee-r112 var(--marquee-speed, 35s) linear infinite !important;
  animation-play-state: running !important;
  will-change: transform !important;
  transform: translateZ(0);
  backface-visibility: hidden !important;
}

html body .OLD-dag-marquee.OLD-dag-marquee--images .OLD-dag-marquee__slide {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
}

html body .dag-marquee.dag-marquee--images .dag-marquee__slide img {
  display: block !important;
  height: var(--marquee-height, 64px) !important;
  max-height: var(--marquee-height, 64px) !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

html body .dag-marquee.dag-marquee--text .dag-marquee__item {
  flex: 0 0 auto !important;
  padding: 0 30px !important;
  white-space: nowrap !important;
}

html body .dag-marquee.dag-marquee--text .dag-marquee__item::after {
  content: none !important;
}

@media (prefers-reduced-motion: reduce) {
  html body .dag-marquee .dag-marquee__track {
    animation: none !important;
  }
}
/* === R112 end === */

/* ============================================================
   R114 — clean marquee rebuild (single source of truth)
   (2026-05-06) — old blocks neutralized to .OLD-dag-marquee
   ============================================================ */

@keyframes dag-marquee-r114 {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-50%, 0, 0); }
}

.dag-marquee {
  width: 100%;
  overflow: hidden;
  position: relative;
  background: var(--color-paper);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  z-index: 50;
}

.dag-marquee.dag-marquee--images {
  height: var(--marquee-height, 64px);
}

.dag-marquee__track {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  width: max-content;
  height: 100%;
  gap: 0;
  padding: 0;
  margin: 0;
  animation: dag-marquee-r114 var(--marquee-speed, 35s) linear infinite;
  will-change: transform;
}

.dag-marquee__slide {
  flex: 0 0 auto;
  height: 100%;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
}

.dag-marquee--images .dag-marquee__slide img {
  display: block;
  height: var(--marquee-height, 64px);
  width: auto;
  margin: 0;
  padding: 0;
  border: 0;
  max-width: none;
}

.dag-marquee--text {
  height: 38px;
  background: var(--color-primary);
  color: #fff;
}

.dag-marquee--text .dag-marquee__item {
  flex: 0 0 auto;
  padding: 0 30px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  color: #fff;
}

@media (prefers-reduced-motion: reduce) {
  .dag-marquee__track {
    animation: none;
  }
}
/* === R114 end === */