/*
 * CarPoint Care Design System V2
 * Direction: Bright Automotive Editorial x Technical Precision
 * Scope: .cpc-v2 only. Safe to load beside V1 during rebuild.
 */
:root {
  --cpc2-ink: #11151b;
  --cpc2-ink-soft: #27313d;
  --cpc2-yellow: #ffd400;
  --cpc2-yellow-strong: #efc400;
  --cpc2-blue: #1268e8;
  --cpc2-blue-deep: #0b4db0;
  --cpc2-white: #ffffff;
  --cpc2-paper: #f7f5ed;
  --cpc2-paper-2: #fbfaf6;
  --cpc2-muted: #68717c;
  --cpc2-line: rgba(17,21,27,.12);
  --cpc2-line-strong: rgba(17,21,27,.20);
  --cpc2-shadow: 0 24px 70px rgba(24,38,58,.14);
  --cpc2-radius-sm: 7px;
  --cpc2-radius-md: 15px;
  --cpc2-max: 1280px;
  --cpc2-gutter: clamp(18px, 3vw, 42px);
  --cpc2-display: clamp(3rem, 6.5vw, 6.7rem);
  --cpc2-h2: clamp(2.2rem, 4.6vw, 4.8rem);
  --cpc2-h3: clamp(1.3rem, 2vw, 2rem);
  --cpc2-body: clamp(.98rem, 1.08vw, 1.08rem);
  --cpc2-ease: cubic-bezier(.2,.75,.2,1);
}

.cpc-v2,
.cpc-v2 * { box-sizing: border-box; }

.cpc-v2 {
  position: relative;
  overflow: clip;
  background: var(--cpc2-paper-2);
  color: var(--cpc2-ink);
  font-family: "Avenir Next", "Helvetica Neue", sans-serif;
  font-size: var(--cpc2-body);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.cpc-v2 ::selection { background: var(--cpc2-yellow); color: var(--cpc2-ink); }
.cpc-v2 a { color: inherit; }
.cpc-v2 img { max-width: 100%; height: auto; }

.cpc-v2__container {
  width: min(calc(100% - (2 * var(--cpc2-gutter))), var(--cpc2-max));
  margin-inline: auto;
}

.cpc-v2__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  margin: 0 0 .85rem;
  color: var(--cpc2-blue);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .15em;
  line-height: 1;
  text-transform: uppercase;
}
.cpc-v2__eyebrow::before { content:""; width:26px; height:2px; background:var(--cpc2-yellow); }

.cpc-v2__display,
.cpc-v2__h2,
.cpc-v2__h3 {
  margin: 0;
  font-family: "Avenir Next Condensed", "Avenir Next", "Helvetica Neue", sans-serif;
  font-weight: 900;
  letter-spacing: -.048em;
  text-wrap: balance;
}
.cpc-v2__display { max-width: 11ch; font-size: var(--cpc2-display); line-height: .88; text-transform: uppercase; }
.cpc-v2__h2 { max-width: 14ch; font-size: var(--cpc2-h2); line-height: .96; }
.cpc-v2__h3 { font-size: var(--cpc2-h3); line-height: 1.05; }

.cpc-v2__lede {
  max-width: 54ch;
  margin: 1rem 0 0;
  color: #4f5965;
  font-size: clamp(1rem, 1.35vw, 1.2rem);
  line-height: 1.62;
}

.cpc-v2__button-row { display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.45rem; }
.cpc-v2__button {
  display:inline-flex;
  min-height:48px;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  padding:.82rem 1.2rem;
  border:1px solid transparent;
  border-radius:var(--cpc2-radius-sm);
  font-size:.77rem;
  font-weight:850;
  letter-spacing:.06em;
  line-height:1;
  text-decoration:none;
  text-transform:uppercase;
  transition:transform .25s var(--cpc2-ease), box-shadow .25s var(--cpc2-ease), background-color .25s var(--cpc2-ease), color .25s var(--cpc2-ease), border-color .25s var(--cpc2-ease);
}
.cpc-v2__button:hover,.cpc-v2__button:focus-visible { transform:translateY(-2px); }
.cpc-v2__button:focus-visible { outline:3px solid rgba(18,104,232,.22); outline-offset:3px; }
.cpc-v2__button--primary { background:var(--cpc2-yellow); color:var(--cpc2-ink); box-shadow:0 12px 26px rgba(255,212,0,.20); }
.cpc-v2__button--primary:hover { background:#ffe24d; box-shadow:0 15px 34px rgba(255,212,0,.26); }
.cpc-v2__button--secondary { border-color:var(--cpc2-line-strong); background:#fff; color:var(--cpc2-ink); }
.cpc-v2__button--secondary:hover { border-color:var(--cpc2-blue); color:var(--cpc2-blue-deep); }

.cpc-v2__rule { width:100%; height:1px; background:var(--cpc2-line); }

.cpc-v2__technical-label {
  display:flex;
  align-items:center;
  gap:.62rem;
  margin:0;
  color:#5f6974;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.12em;
  line-height:1.2;
  text-transform:uppercase;
}
.cpc-v2__technical-label::before {
  content:"";
  width:7px;
  height:7px;
  border:1px solid var(--cpc2-blue);
  background:var(--cpc2-blue);
  box-shadow:0 0 0 4px rgba(18,104,232,.09);
}

.cpc-v2__meta {
  margin:0;
  color:#6f7782;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.12em;
  line-height:1.2;
  text-transform:uppercase;
}

.cpc-v2__number {
  color:transparent;
  font-size:clamp(4.2rem,7vw,6.8rem);
  font-weight:900;
  line-height:.78;
  letter-spacing:-.07em;
  -webkit-text-stroke:1px rgba(17,21,27,.20);
  user-select:none;
}

.cpc-v2__surface {
  position:relative;
  overflow:hidden;
  border:1px solid rgba(17,21,27,.10);
  border-radius:var(--cpc2-radius-md);
  background:#fff;
  box-shadow:var(--cpc2-shadow);
}
.cpc-v2__surface::after {
  content:"";
  position:absolute;
  inset:auto 0 0 auto;
  width:34%;
  height:4px;
  background:linear-gradient(90deg,var(--cpc2-yellow),var(--cpc2-blue));
}

.cpc-v2__signal-line { position:relative; padding-left:1rem; }
.cpc-v2__signal-line::before {
  content:"";
  position:absolute;
  inset:.15rem auto .15rem 0;
  width:3px;
  border-radius:999px;
  background:linear-gradient(to bottom,var(--cpc2-yellow) 0 58%,var(--cpc2-blue) 58% 100%);
}

.cpc-v2__mesh {
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.52;
  background-image:
    linear-gradient(rgba(17,21,27,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(17,21,27,.035) 1px,transparent 1px);
  background-size:46px 46px;
  mask-image:linear-gradient(to bottom,black,transparent 88%);
}

.cpc-v2__glow {
  position:absolute;
  width:min(52vw,760px);
  aspect-ratio:1;
  border-radius:50%;
  background:
    radial-gradient(circle at 48% 48%,rgba(18,104,232,.16),rgba(18,104,232,0) 61%),
    radial-gradient(circle at 66% 63%,rgba(255,212,0,.18),rgba(255,212,0,0) 45%);
  filter:blur(14px);
  pointer-events:none;
}

.cpc-v2__image-meta {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-top:12px;
}
.cpc-v2__process {
  max-width:250px;
  margin:0 0 4px;
  color:#69727c;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.11em;
  line-height:1.45;
  text-align:right;
  text-transform:uppercase;
}

.cpc-v2__quickrail {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border:1px solid var(--cpc2-line);
  border-radius:12px;
  background:rgba(255,255,255,.78);
  box-shadow:0 10px 34px rgba(25,38,56,.06);
  overflow:hidden;
}
.cpc-v2__quick {
  min-width:0;
  padding:15px 17px 16px;
  border-right:1px solid var(--cpc2-line);
  transition:background-color .22s ease, transform .22s ease;
}
.cpc-v2__quick:last-child { border-right:0; }
.cpc-v2__quick:hover { background:#fff; }
.cpc-v2__quick-kicker {
  display:block;
  margin:0 0 5px;
  color:#7b838d;
  font-size:.61rem;
  font-weight:850;
  letter-spacing:.12em;
  line-height:1.25;
  text-transform:uppercase;
}
.cpc-v2__quick-title {
  margin:0;
  color:var(--cpc2-ink);
  font-size:.86rem;
  font-weight:800;
  line-height:1.35;
}

.cpc-v2__accent-yellow { color:#e5b900; }
.cpc-v2__accent-blue { color:var(--cpc2-blue); }

.cpc-v2__reveal { animation:cpc2-reveal .6s var(--cpc2-ease) both; }
@keyframes cpc2-reveal { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:translateY(0)} }

@media (max-width:991px) {
  .cpc-v2__quickrail { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cpc-v2__quick:nth-child(2) { border-right:0; }
  .cpc-v2__quick:nth-child(-n+2) { border-bottom:1px solid var(--cpc2-line); }
}

@media (max-width:767px) {
  :root { --cpc2-gutter:18px; --cpc2-display:clamp(3.1rem,17vw,5.2rem); }
  .cpc-v2__button-row { align-items:stretch; }
  .cpc-v2__button { width:100%; }
  .cpc-v2__display { max-width:10ch; }
  .cpc-v2__quickrail {
    display:flex;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
  }
  .cpc-v2__quick {
    min-width:78%;
    border-right:1px solid var(--cpc2-line) !important;
    border-bottom:0 !important;
    scroll-snap-align:start;
  }
}

@media (prefers-reduced-motion:reduce) {
  .cpc-v2 *, .cpc-v2 *::before, .cpc-v2 *::after {
    scroll-behavior:auto !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}