/* V2 type system: keep the established faces, with the same readable roles at every width. */
:root {
  --type-tag: .8125rem;
  --type-meta: .875rem;
  --type-action: .9375rem;
  --type-body: 1rem;
  --type-lead: clamp(1.125rem, 1rem + .3vw, 1.25rem);
  --type-card-title: 1.25rem;
  --type-section-title: clamp(1.875rem, 1.375rem + 1.25vw, 2.5rem);
  --type-display: clamp(2.5rem, .875rem + 3.5vw, 4rem);
}

body {
  font-size: var(--type-body);
  font-weight: 400;
  line-height: 1.6;
}

button, input, select, textarea { font-family: 'DM Sans', sans-serif; }
button { font-weight: 700; line-height: 1.4; }
input, select, textarea { font-size: var(--type-body); font-weight: 400; line-height: 1.5; }
p { font-size: var(--type-body); font-weight: 400; line-height: 1.65; }
small { font-size: var(--type-meta); }
strong, b { font-weight: 700; }

h1, h2, h3 {
  font-family: Manrope, sans-serif;
  font-weight: 800;
  overflow-wrap: break-word;
}
h1 { font-size: var(--type-display); line-height: 1.12; letter-spacing: -.04em; }
h2 { font-size: var(--type-section-title); line-height: 1.2; letter-spacing: -.035em; }
h3 { font-size: var(--type-card-title); line-height: 1.3; letter-spacing: -.02em; }
h4 { font-size: var(--type-body); font-weight: 700; line-height: 1.4; }

.section-heading p {
  font-size: var(--type-body);
  line-height: 1.65;
  max-width: 65ch;
}
.button, .button-small, .header-cta, .quick-form > .button,
.supplier-copy .button, .final-cta .button,
.form-actions > .button, .form-actions > .text-link,
.text-link, .catalogue .section-heading > .text-link, .cities-intro .text-link {
  font-size: var(--type-action);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0;
}
.button { white-space: normal; text-align: center; }
.desktop-nav, .mobile-nav > a { font-size: var(--type-action); font-weight: 700; line-height: 1.5; }
.brand, .dialog-brand { font-size: 1.5rem; font-weight: 800; }
.brand-domain { font-size: 1.125rem; }

.hero h1 { font-size: var(--type-display); line-height: 1.12; letter-spacing: -.04em; }
.hero-copy > p { font-size: var(--type-lead); line-height: 1.6; max-width: 48ch; }
.hero-checks { font-size: var(--type-meta); font-weight: 700; line-height: 1.5; }
.photo-caption { font-size: var(--type-action); font-weight: 400; line-height: 1.5; }
.quick-field label { font-size: var(--type-meta); font-weight: 700; line-height: 1.4; }
.input-wrap input { font-size: var(--type-body); font-weight: 400; line-height: 1.5; }
.hero-footnote { font-size: var(--type-meta); font-weight: 400; line-height: 1.6; }
.benefit-grid p, .benefit-grid span { font-size: var(--type-body); line-height: 1.5; }
.benefit-grid strong { font-size: 1.125rem; font-weight: 700; line-height: 1.4; }

.filter-chip { font-size: var(--type-action); font-weight: 700; line-height: 1.4; }
.city-filter { font-size: var(--type-meta); font-weight: 400; line-height: 1.5; }
.city-filter select { font-size: var(--type-body); font-weight: 400; line-height: 1.5; }
.demo-note { font-size: var(--type-meta); font-weight: 400; line-height: 1.6; max-width: 75ch; }
.truck-type { font-size: var(--type-meta); font-weight: 700; line-height: 1.4; }
.truck-title-row h3 { font-size: var(--type-card-title); line-height: 1.3; letter-spacing: -.02em; }
.truck-location, .profile-content > .truck-location { font-size: var(--type-meta); font-weight: 400; line-height: 1.5; }
.truck-description { font-size: var(--type-body); font-weight: 400; line-height: 1.6; max-width: 65ch; }
.tag { font-size: var(--type-tag); font-weight: 400; line-height: 1.35; }
.empty-state h3 { font-size: var(--type-card-title); line-height: 1.3; }
.empty-state p { font-size: var(--type-body); line-height: 1.65; max-width: 55ch; }

.how-section h2, .cities-intro h2, .faq-intro h2,
.supplier-copy h2, .final-cta h2 {
  font-size: var(--type-section-title);
  line-height: 1.2;
  letter-spacing: -.035em;
}
.handwritten { font-size: 1.375rem; font-weight: 400; line-height: 1.4; }
.step-number { font-size: var(--type-meta); font-weight: 700; line-height: 1; }
.steps h3 { font-size: var(--type-card-title); line-height: 1.3; letter-spacing: -.02em; }
.steps p { font-size: var(--type-body); line-height: 1.65; max-width: 40ch; }
.event-label { font-size: var(--type-card-title); font-weight: 800; line-height: 1.3; letter-spacing: -.02em; }
.event-label small { font-size: var(--type-meta); font-weight: 400; line-height: 1.5; letter-spacing: 0; max-width: 28ch; }
.cities-intro p, .faq-intro > p, .faq-intro p, .supplier-copy > p, .final-cta p {
  font-size: var(--type-body);
  line-height: 1.65;
  max-width: 65ch;
}
.city-link { font-size: 1.125rem; font-weight: 800; line-height: 1.4; letter-spacing: -.015em; }
.city-link small { font-size: var(--type-meta); font-weight: 400; line-height: 1.5; letter-spacing: 0; }
.faq-list summary { font-size: var(--type-body); font-weight: 700; line-height: 1.5; }
.faq-list summary::after { font-size: 1.5rem; font-weight: 400; line-height: 1.5; }
.faq-list details p { font-size: var(--type-body); line-height: 1.7; max-width: 65ch; }
.supplier-note { font-size: var(--type-meta); font-weight: 400; line-height: 1.6; }

.footer-brand p, .footer-about p { font-size: var(--type-body); line-height: 1.65; max-width: 55ch; }
.footer-main h3 { font-family: 'DM Sans', sans-serif; font-size: var(--type-body); font-weight: 700; line-height: 1.4; letter-spacing: 0; }
.footer-main > div:not(:first-child) > a, .footer-link,
.preview-badge, .footer-bottom, .footer-bottom button {
  font-size: var(--type-meta);
  font-weight: 400;
  line-height: 1.6;
}

.dialog-inner h2, .profile-content h2 { font-size: clamp(1.75rem, 1.5rem + .75vw, 2.125rem); line-height: 1.2; letter-spacing: -.03em; }
.form-step-label { font-size: var(--type-meta); font-weight: 700; line-height: 1.5; }
.form-description { font-size: var(--type-body); line-height: 1.65; max-width: 65ch; }
.form-notice, .field-hint, .consent-row, .selected-truck { font-size: var(--type-meta); font-weight: 400; line-height: 1.6; }
.form-group label, .form-group legend { font-size: var(--type-meta); font-weight: 700; line-height: 1.5; }
.form-group input, .form-group select, .form-group textarea { font-size: var(--type-body); font-weight: 400; line-height: 1.5; }
.form-group textarea { line-height: 1.65; }
.form-group .check-choice { font-size: var(--type-body); font-weight: 400 !important; line-height: 1.5; }
.form-error { font-size: var(--type-body); font-weight: 700; line-height: 1.5; }
.review-list { font-size: var(--type-body); line-height: 1.6; }
.review-list dt { font-weight: 400; }
.review-list dd { font-weight: 700; }
.profile-content > p, .profile-capacity, .menu-list, #info-content > p { font-size: var(--type-body); line-height: 1.7; max-width: 65ch; }
.profile-content h3, #info-content h3 { font-size: var(--type-card-title); line-height: 1.3; letter-spacing: -.02em; }

@media (max-width: 640px) {
  .hero h1 { line-height: 1.15; }
  .hero-copy > p { line-height: 1.6; }
  .steps h3 { line-height: 1.3; }
}