/* MotoMax 7 — approved B monogram. Color roles shared by public pages and CMS. */
:root {
  --racing-red: #b51f32;
  --carbon: #1c232b;
  --steel-blue: #354757;
  --warm-white: #f2eee8;
  --silver: #d0d3d4;
  --paper: var(--warm-white);
  --ink: var(--carbon);
  --muted: var(--steel-blue);
  --line: var(--silver);
  --steel: var(--steel-blue);
  --accent: var(--racing-red);
  --dark: var(--carbon);
}
body, body.catalog-in-view { background: var(--paper); color: var(--ink); }
::selection { background: var(--racing-red); color: white; }
:focus-visible { outline: 2px solid var(--racing-red); outline-offset: 5px; }
#header, body:has(.everyday) #header, body:has(.cinematic) #header::before {
  background: var(--paper); color: var(--ink); border-color: var(--line);
}
#header .top-note, body:has(.everyday) #header .top-note,
body:has(.cinematic) #header.is-scrolled .top-note {
  background: var(--silver); color: var(--carbon);
}
#header .brand img, body:has(.cinematic) #header .brand img { filter: none; }
.brand { position: relative; gap: 8px; }
.brand img { width: 216px; height: auto; }
.brand-compact img { width: 48px; height: 48px; }
.brand-tagline { color: var(--steel-blue); letter-spacing: .1em; }
.footer .brand-tagline { color: var(--silver); }
.nav-links > a.active, .nav-links > a:hover { color: var(--racing-red); }
.nav-links > a::after, body:has(.cinematic) #header .nav-links > a::after {
  background: var(--racing-red); height: 2px;
}
.nav .contact-link, body:has(.everyday) #header .contact-link {
  border-color: var(--silver); color: var(--carbon);
}
.nav .contact-link:hover, body:has(.everyday) #header .contact-link:hover,
body:has(.cinematic) #header.is-scrolled .contact-link:hover {
  background: var(--carbon); border-color: var(--carbon); color: var(--warm-white);
}
.btn:not(.outline):not(.light), .everyday .btn:not(.outline):not(.light) {
  background: var(--racing-red); border-color: var(--racing-red); color: white;
}
.btn:not(.outline):not(.light):hover { background: var(--carbon); border-color: var(--carbon); }
.btn.outline { color: var(--carbon); border-color: var(--steel-blue); background: transparent; }
.btn.outline:hover { color: white; background: var(--carbon); border-color: var(--carbon); }
.text-link::after { background: var(--racing-red); }
.text-link:hover, .text-link:focus-visible { color: var(--racing-red); }
.hero.cinematic.everyday { background: var(--paper); }
.hero.cinematic.everyday .hero-copy > .eyebrow { color: var(--steel-blue); }
.hero.cinematic.everyday h1 .hero-line:last-child { color: var(--racing-red); }
.everyday .intro, .everyday .hero-caption { color: var(--steel-blue); }
.everyday .hero-visual { background: var(--silver); }
@media(min-width:1101px) and (prefers-reduced-motion:no-preference) {
  .everyday .hero-visual img {
    scale: 1.025;
    translate: var(--hero-drift-x, 0px) calc(var(--hero-drift-y, 0px) + var(--hero-scroll-y, 0px));
  }
}
.everyday .hero-visual::after {
  content: ''; position: absolute; width: 54px; height: 3px;
  bottom: 0; left: 0; background: var(--racing-red); pointer-events: none;
}
.car-photo, .model-frame > img, .showroom-gallery { background: var(--silver); }
.car-photo .demo, .car-photo .badge { background: var(--warm-white); color: var(--steel-blue); }
.car:hover .price-row strong, .car:focus-within .price-row strong { color: var(--racing-red); }
.car .car-heading h3 { background-image: linear-gradient(var(--racing-red),var(--racing-red)); }
.car .price-row .text-link { color: var(--steel-blue); }
.car:hover .price-row .text-link { color: var(--racing-red); }
.model-story { background: var(--paper); --scene-tone: var(--paper); }
.story-heading > .eyebrow, .story-heading > p,
.model-frame figcaption > span, .model-frame figcaption > p,
.model-controls button, .story-arrows [data-model-counter] { color: var(--steel-blue); }
.model-controls button[aria-pressed="true"] { color: var(--racing-red); border-color: var(--racing-red); }
.story-arrows [data-model-counter] { border-top: 2px solid var(--racing-red); padding-top: 5px; }
.editorial { background: var(--silver); }
.editorial .editorial-copy p, .editorial .editorial-copy .eyebrow,
.editorial .editorial-caption { color: var(--steel-blue); }
.footer { background: var(--carbon); color: var(--warm-white); }
.footer-brand p, .footer-contact, .footer-bottom, .footer-nav a { color: var(--silver); }
.footer a:hover { color: var(--warm-white); }
.inquiry-box, .empty { background: var(--paper); border-color: var(--silver); }
.inquiry-box { border-top: 2px solid var(--racing-red); }
input, select, textarea { accent-color: var(--racing-red); color: var(--carbon); }
input:focus, select:focus, textarea:focus {
  border-color: var(--racing-red); box-shadow: 0 0 0 2px #b51f3214;
}
.pagination button.active, .pagination button[aria-current="page"] {
  background: var(--carbon); border-color: var(--carbon); color: var(--warm-white);
}
#lightbox .gallery-thumbs button[aria-current="true"],
.gallery-thumbs button[aria-current="true"] { border-color: var(--racing-red); }
progress { accent-color: var(--racing-red); }
.upload progress { accent-color: var(--racing-red); }
.success { background: var(--silver); color: var(--carbon); border-color: var(--steel-blue); }
.contact-form .error:not(:empty) { border-left-color: var(--racing-red); }
.admin-content [data-save-state="saved"] { outline-color: var(--steel-blue); }
.photo-editor.drop-target, .upload:has(input:disabled) { background: var(--silver); }
#lightbox { background: var(--carbon); }
.admin-side button.active { color: var(--racing-red); border-bottom-color: var(--racing-red); }
.performance-report { color: var(--carbon); background: var(--paper); border-color: var(--silver); }
/* One entrance per document. Content stays clickable throughout the mask reveal. */
.brand-ignition img { animation: monogram-reveal 620ms 90ms var(--mm-ease) both; }
.brand-ignition::after {
  content: ''; position: absolute; top: -6px; left: 0; width: 20px; height: 2px;
  background: var(--racing-red); pointer-events: none;
  animation: monogram-ignition 780ms var(--mm-ease) both;
}
@keyframes monogram-reveal { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0); } }
@keyframes monogram-ignition {
  0% { opacity: 0; transform: translateX(0); }
  18% { opacity: 1; transform: translateX(0); }
  70% { opacity: 1; transform: translateX(38px); }
  100% { opacity: 0; transform: translateX(75px); }
}
@media(max-width:900px) {
  .nav-links, body:has(.cinematic) #header .nav-links { background: var(--paper); color: var(--carbon); }
  .nav-links > a.active { color: var(--racing-red); }
}
@media(max-width:600px) { #header .brand img { width: 178px; } .brand-tagline { font-size: 9px; } }
@media(prefers-reduced-motion:reduce) {
  .brand-ignition img { animation: none; clip-path: none; }
  .brand-ignition::after { display: none; animation: none; }
}

/* Redline 7.1 — stronger color blocks, with light reading surfaces between them. */
.hero.cinematic.everyday { background: var(--carbon); color: var(--warm-white); }
.hero.cinematic.everyday .hero-copy > .eyebrow,
.everyday .intro, .everyday .hero-caption { color: var(--silver); }
.hero.cinematic.everyday h1 .hero-line:last-child { color: #e84850; }
.everyday .hero-copy > .eyebrow {
  border-left: 3px solid var(--racing-red); padding-left: 12px;
}
.everyday .btn:not(.outline):not(.light):hover {
  background: var(--warm-white); color: var(--carbon); border-color: var(--warm-white);
}
.everyday .hero-visual::after { width: 24%; height: 4px; }
.discovery-bar.wrap {
  width: 100%; max-width: none; margin: 0;
  padding: 20px max(28px, calc((100vw - 1328px) / 2));
  background: var(--racing-red); color: white; border: 0;
}
.discovery-bar p, .discovery-bar .text-link, .discovery-bar .count { color: white; }
.discovery-bar .text-link::after { background: white; }
.section { padding-top: 48px; padding-bottom: 48px; }
.section-head { margin-bottom: 26px; }
.selected-cars .eyebrow, .car .price-row strong { color: var(--racing-red); }
.car-data { padding-top: 16px; padding-bottom: 16px; }
.catalog .cards { gap: 30px 28px; }
.filters { border-top-color: var(--racing-red); }
.model-story .model-stage { padding-top: 0; padding-bottom: 28px; }
.story-heading.wrap {
  width: 100%; max-width: none; padding: 30px max(28px, calc((100vw - 1328px) / 2));
  background: var(--carbon); color: var(--warm-white); align-items: center;
}
.story-heading > .eyebrow, .story-heading > p { color: var(--silver); }
.story-heading h2 { color: var(--warm-white); }
.story-controlled .model-frames { margin-top: 24px; margin-bottom: 14px; }
.editorial { padding-top: 52px; padding-bottom: 52px; }
.contact-strip {
  background: var(--racing-red); color: white;
  padding: 36px 40px; margin: 36px 0;
}
.contact-strip .eyebrow, .contact-strip-aside p { color: white; }
.contact-strip .btn.outline { color: white; border-color: #ffffffaa; }
.contact-strip .btn.outline:hover { background: var(--carbon); border-color: var(--carbon); }
.page-head {
  padding: 30px 28px; margin-top: 26px; margin-bottom: 28px;
  background: var(--carbon); color: var(--warm-white); border-left: 4px solid var(--racing-red);
}
.page-head .eyebrow, .page-head p { color: var(--silver); }
.page-head .breadcrumbs { color: var(--silver); }
.page-head .notice { color: var(--carbon); background: var(--silver); }
.page-head h1 { margin-bottom: 14px; }
@media(max-width:760px) {
  .section { padding-top: 36px; padding-bottom: 36px; }
  .discovery-bar.wrap { padding: 17px 24px; gap: 18px; }
  .story-heading.wrap { padding: 24px; }
  .story-heading h2 { margin: 14px 0; }
  .model-story .model-stage { padding-top: 0; }
  .editorial { padding-top: 36px; padding-bottom: 36px; }
  .contact-strip { padding: 28px 24px; margin: 24px 0; }
  .page-head { padding: 24px 20px; margin-top: 18px; margin-bottom: 24px; }
}

/* Redline 7.2 — racing-red lead panel, carbon counterweight, light catalog. */
.hero.cinematic.everyday { background: var(--racing-red); }
.hero.cinematic.everyday h1 .hero-line:last-child { color: var(--warm-white); }
.hero.cinematic.everyday .hero-copy > .eyebrow,
.everyday .intro, .everyday .hero-caption { color: var(--warm-white); }
.everyday .hero-copy > .eyebrow { border-left-color: var(--warm-white); }
.everyday .btn:not(.outline):not(.light) {
  background: var(--carbon); border-color: var(--carbon); color: white;
}
.everyday .btn:not(.outline):not(.light):hover {
  background: var(--warm-white); border-color: var(--warm-white); color: var(--carbon);
}
.discovery-bar.wrap { background: var(--carbon); border-top: 4px solid var(--racing-red); }
#header .top-note, body:has(.everyday) #header .top-note,
body:has(.cinematic) #header.is-scrolled .top-note { background: var(--carbon); color: var(--silver); }
.nav .contact-link, body:has(.everyday) #header .contact-link {
  background: var(--racing-red); border-color: var(--racing-red); color: white;
}
.selected-cars .car-data { background: var(--carbon); padding: 20px 22px; border-bottom: 4px solid var(--racing-red); }
.selected-cars .car-heading h3, .selected-cars .price-row strong { color: var(--warm-white); }
.selected-cars .car-brand, .selected-cars .car-year, .selected-cars .variant,
.selected-cars .spec-line, .selected-cars .price-row .text-link { color: var(--silver); }
.selected-cars .car:hover .price-row strong { color: white; }
.selected-cars .price-row { border-color: #ffffff30; }
.selected-cars .car:focus-within .price-row strong { color: white; }
.selected-cars .car:hover .price-row .text-link { color: white; }
.story-heading.wrap { background: var(--racing-red); }
.story-heading > .eyebrow, .story-heading > p { color: var(--warm-white); }
.page-head { border-left-width: 8px; }
.catalog .car .price-row { border-top: 2px solid var(--racing-red); }
.footer { border-top: 5px solid var(--racing-red); }
@media(max-width:760px) {
  .selected-cars .car-data { padding: 18px; }
}

/* Matte carbon weave: a local, static material, with an opaque reading layer. */
.car .car-data {
  position: relative;
  padding: 20px 22px;
  background-color: var(--carbon);
  background-image: linear-gradient(110deg, #10182077, #10182022), url('/assets/carbon-real.webp');
  background-size: auto, cover;
  border-bottom: 4px solid var(--racing-red);
  box-shadow: inset 0 1px 0 #ffffff15;
}
.car .car-heading h3, .car .price-row strong,
.car:hover .price-row strong, .car:focus-within .price-row strong { color: var(--warm-white); }
.car .car-brand, .car .car-year, .car .variant, .car .spec-line,
.car .price-row .text-link { color: var(--silver); }
.car .price-row, .catalog .car .price-row { border-color: #ffffff30; border-top-width: 1px; }
.car:hover .price-row .text-link { color: white; }
.selected-cars .car-data {
  background-image: linear-gradient(110deg, #10182077, #10182022), url('/assets/carbon-real.webp');
  background-size: auto, cover;
}
@media(max-width:760px) { .car .car-data { padding: 18px; } }

/* Everyday Redline — useful choices first, material accents second. */
.hero.cinematic.everyday {
  grid-template-columns: 45% 55%; height: clamp(600px, 43vw, 750px);
}
.everyday .hero-content { padding: 38px 38px 38px max(28px, calc((100vw - 1360px) / 2)); }
.hero.cinematic.everyday .hero-copy h1 { font-size: clamp(46px, 4.3vw, 78px); margin-bottom: 22px; }
.hero.cinematic.everyday .hero-copy > .eyebrow { margin-bottom: 25px; }
.everyday .intro { font-size: 15px; line-height: 1.7; margin-bottom: 22px; }
.everyday .hero-visual { background: #d6d8d6; }
.everyday .hero-visual img { object-fit: contain; object-position: center; }
.budget-search { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: end; max-width: 470px; }
.budget-search label { font-size: 12px; color: var(--warm-white); margin: 0; min-width: 0; }
.budget-search select { background: var(--warm-white); color: var(--carbon); margin: 8px 0 0; width: 100%; min-height: 49px; border: 1px solid var(--warm-white); font-size: 13px; }
.budget-search .btn { padding: 13px 17px; min-height: 49px; white-space: nowrap; }
.budget-search :focus-visible { outline-color: white; outline-offset: 4px; }

.daily-proposals { background: #e4e2dd; padding: 48px 0; border-top: 4px solid var(--racing-red); }
.daily-proposals .eyebrow { color: var(--racing-red); }
.daily-proposals h2 { font-size: clamp(32px,3.4vw,50px); }
@media(max-width:760px) { .daily-proposals { padding: 36px 0; } }
.hero-all-offers { display: inline-block; color: var(--warm-white); font-size: 12px; margin-top: 18px; padding-bottom: 3px; border-bottom: 1px solid #ffffff80; }
.hero-all-offers:hover { border-bottom-color: white; }
.discovery-bar p { display: flex; gap: 25px; align-items: center; margin: 0; }
.discovery-bar p strong { font-weight: 600; }
.discovery-bar p > span { font-size: 12px; color: var(--silver); }
.budget-paths { display: grid; grid-template-columns: .8fr 2fr; gap: 40px; padding-top: 40px; padding-bottom: 40px; border-bottom: 1px solid var(--silver); }
.budget-paths .eyebrow { color: var(--racing-red); font-size: 10px; }
.budget-paths h2 { font-size: 32px; line-height: 1.16; letter-spacing: -.045em; margin: 12px 0 0; }
.budget-paths nav { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
.budget-paths nav a { display: flex; flex-direction: column; justify-content: center; gap: 9px; border-left: 1px solid var(--silver); padding: 16px 22px; transition: background-color 200ms; }
.budget-paths nav a:hover { background: #e6e2dc; }
.budget-paths nav span { font-size: 11px; color: var(--steel-blue); }
.budget-paths nav strong { font-size: clamp(23px,2.1vw,34px); font-weight: 500; letter-spacing: -.04em; }
.budget-paths nav small { color: var(--racing-red); font-size: 11px; }
.selected-cars .section-head h2 { font-size: clamp(31px,3.1vw,47px); }
.car .car-data, .selected-cars .car-data { background: var(--warm-white); padding: 20px 22px; border: 1px solid var(--silver); border-bottom: 3px solid var(--racing-red); box-shadow: none; }
.car .car-heading h3 { color: var(--carbon); }
.car .car-brand, .car .car-year, .car .variant, .car .spec-line { color: var(--steel-blue); }
.car .price-row, .catalog .car .price-row {
  background: linear-gradient(110deg,#101820cc,#10182099),url('/assets/carbon-real.webp') center/cover;
  border: 0; margin: 18px -22px -20px; padding: 16px 22px;
}
.car .price-row strong, .car .price-row .text-link { color: var(--warm-white); }
.car-photo .photo-cta { display: none; }
.story-heading.wrap { background: var(--carbon); border-top: 4px solid var(--racing-red); }
.story-heading h2 { font-size: clamp(30px,3vw,44px); }
.editorial { grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: clamp(30px,5vw,75px); background: #e4e2dd; }
.editorial .editorial-photo { max-width: 310px; }
.editorial .editorial-copy { max-width: 580px; }
.editorial .editorial-copy h2 { font-size: clamp(29px,3vw,44px); }
.buying-steps { margin: 22px 0; padding-left: 22px; font-size: 13px; }
.buying-steps li { padding: 10px 0 12px 8px; border-bottom: 1px solid #bfc3c2; }
.buying-steps li::marker { color: var(--racing-red); font-weight: 600; }
.buying-steps strong { display: inline-block; min-width: 78px; font-weight: 600; }
.buying-steps span { color: var(--steel-blue); }
.contact-strip h2 { font-size: clamp(30px,3.1vw,46px); }
@media(max-width:1100px) {
  .hero.cinematic.everyday { height: auto; }
  .everyday .hero-content { padding: 35px 36px 48px; }
  .everyday .hero-visual { aspect-ratio: 1280/740; }
  .everyday .hero-copy { max-width: 700px; }
  .hero.cinematic.everyday .hero-copy h1 { font-size: 54px; }
  .budget-paths { grid-template-columns: 1fr; gap: 24px; }
}
@media(max-width:760px) {
  .hero.cinematic.everyday .hero-copy h1 { font-size: clamp(43px,9vw,60px); }
  .everyday .hero-content { padding: 30px 24px 42px; }
  .everyday .intro { font-size: 14px; }
  .everyday .hero-visual { aspect-ratio: 1280/740; }
  .budget-search { gap: 10px; }
  .budget-search .btn { padding: 13px 12px; font-size: 11px; }
  .budget-search select { font-size: 12px; padding-left: 10px; }
  .discovery-bar p { display: block; max-width: none; }
  .discovery-bar p > span { display: block; margin-top: 5px; }
  .budget-paths { padding-top: 30px; padding-bottom: 30px; }
  .budget-paths nav { grid-template-columns: 1fr; }
  .budget-paths nav a { padding: 16px 0; border-left: 0; border-bottom: 1px solid var(--silver); display: grid; grid-template-columns: 1fr auto; gap: 6px 16px; }
  .budget-paths nav a:last-child { border-bottom: 0; }
  .budget-paths nav strong { grid-column: 1; grid-row: 1; font-size: 29px; }
  .budget-paths nav span { grid-column: 1; grid-row: 2; }
  .budget-paths nav small { grid-column: 2; grid-row: 1/3; align-self: center; }
  .car .car-data, .selected-cars .car-data { padding: 18px; }
  .car .price-row, .catalog .car .price-row { margin: 18px -18px -18px; padding: 16px 18px; }
  .editorial { grid-template-columns: minmax(0,1fr); }
  .editorial .editorial-photo { max-width: 290px; }
  .buying-steps strong, .buying-steps span { display: block; }
  .buying-steps span { margin-top: 3px; }
}