/* wp-legacy — component overrides: soft/airy WP-flavoured treatment on .c-* classes.
 * Visibly distinct from dieselpunk on every component used by the 3 templates.
 * Load after core.css + tokens.css. */

/* ---- typography: normal-case, system sans headlines ---- */
.c-h1{
  font-family:var(--ds-f-display);
  font-weight:700;
  text-transform:none;       /* dieselpunk: uppercase */
  letter-spacing:-.01em;     /* dieselpunk: .005em */
  line-height:1.15;          /* dieselpunk: .9 */
  color:var(--ds-ink);
}

.c-h1 .em{ color:var(--ds-accent); }

/* breadcrumb: plain sans, no small-caps mono ---- */
.c-crumb{
  font-family:var(--ds-f-label);
  text-transform:none;        /* dieselpunk: uppercase */
  letter-spacing:normal;      /* dieselpunk: .18em */
  font-size:var(--ds-small);
  color:var(--ds-muted);
}

/* ---- buttons: rounded, normal-case ---- */
.c-btn{
  font-family:var(--ds-f-label);
  font-weight:600;
  font-size:15px;             /* dieselpunk: 12px */
  letter-spacing:normal;      /* dieselpunk: .12em */
  text-transform:none;        /* dieselpunk: uppercase */
  padding:10px 20px;          /* dieselpunk: 14px 22px */
  border-radius:var(--ds-radius);  /* dieselpunk: 0 (--ds-radius:0) */
}

.c-btn--solid{
  background:var(--ds-accent);
  color:var(--ds-btn-ink);
}

.c-btn--accent{
  background:var(--ds-accent);
  color:var(--ds-btn-ink);
}

.c-btn--ghost{
  background:transparent;
  color:var(--ds-accent);
  border:1px solid var(--ds-accent);  /* dieselpunk: 2px solid ink */
}

/* ---- CTA: light panel with soft border (vs dieselpunk hard 3px frame + hard shadow) ---- */
.c-cta{
  background:var(--ds-surface);
  border:1px solid var(--ds-line);         /* dieselpunk: 3px solid ink */
  box-shadow:0 2px 8px rgba(0,0,0,.08);    /* dieselpunk: 9px 9px 0 rgba(0,0,0,.22) */
  border-radius:var(--ds-radius);
  overflow:hidden;
}

/* ---- card: soft rounded card ---- */
.c-card{
  background:var(--ds-surface);
  border:1px solid var(--ds-line);         /* dieselpunk: 3px solid ink */
  box-shadow:0 2px 8px rgba(0,0,0,.08);    /* dieselpunk: 9px 9px 0 rgba(0,0,0,.22) */
  border-radius:var(--ds-radius);
}

/* ---- comparison table: blue header, no monospace ---- */
.c-cmp th{
  background:var(--ds-accent);            /* dieselpunk: ink (near-black) */
  color:#fff;
  font-family:var(--ds-f-label);
  font-size:var(--ds-small);
  letter-spacing:normal;                  /* dieselpunk: .12em uppercase mono */
  text-transform:none;
}

/* zebra-stripe: muted blue tint */
.c-cmp tr:nth-child(even) td{
  background:color-mix(in srgb, var(--ds-accent) 6%, transparent);
}

/* ---- hero: light bg with blue accent tint (vs dieselpunk oil-black) ---- */
.c-hero{
  background:color-mix(in srgb, var(--ds-accent) 8%, #fff);
  color:var(--ds-ink);
  position:relative;
  overflow:hidden;
  border-radius:var(--ds-radius);
}

/* no grayscale image filter (dieselpunk applies grayscale + halftone) */
.c-hero__img > img{
  width:100%;height:100%;object-fit:cover;display:block;
  filter:none;   /* dieselpunk: grayscale(1) contrast(1.14) */
  border-radius:var(--ds-radius) var(--ds-radius) 0 0;
}

/* ---- proof / testimonial: soft card ---- */
.c-proof{
  background:var(--ds-surface);
  border:1px solid var(--ds-line);
  border-radius:var(--ds-radius);
  box-shadow:0 1px 4px rgba(0,0,0,.06);
}

/* ---- FAQ: soft bordered sections ---- */
.c-faq details{
  border:1px solid var(--ds-line);
  border-radius:var(--ds-radius);
  margin-bottom:.5rem;
  padding:.5rem 1rem;
  background:var(--ds-surface);
}

/* ---- chips: soft pill shape ---- */
.c-chip{
  background:var(--ds-surface);
  border:1px solid var(--ds-line);
  border-radius:20px;       /* dieselpunk: square/0 */
  padding:4px 12px;
  font-size:var(--ds-small);
  color:var(--ds-ink);
}

.c-chip.active,
.c-chip:hover{
  background:var(--ds-accent);
  color:#fff;
  border-color:var(--ds-accent);
}

/* ---- grid: standard gap (no visual treatment changes) ---- */
.c-grid{
  /* inherits core.css grid; no dieselpunk-specific overrides to contrast */
}

/* ---- horizontal rule: thin, muted ---- */
.c-rule{
  border:none;
  border-top:1px solid var(--ds-line);  /* dieselpunk: 3px solid ink */
  margin:1.5rem 0;
}

/* ---- label / kick line: blue accent, normal weight ---- */
.c-label{
  font-family:var(--ds-f-label);
  font-weight:600;               /* dieselpunk: 700 */
  font-size:var(--ds-small);
  letter-spacing:normal;         /* dieselpunk: .2em uppercase */
  text-transform:none;
  color:var(--ds-accent);
}

/* ---- links: blue (WP default) ---- */
a{
  color:var(--ds-link);
}
a:hover{
  color:var(--ds-accent-press);
}