/* Readability refinement, 2026-10-25.
   Remove this stylesheet's link from index.html to undo the entire pass.
   The original palette, fonts, display headlines and styles.css are preserved. */

:root {
  --reading-size: 17px;
  --reading-ink: #51584c;
  --reading-light: #cbd0c4;
  --heading-on-light: var(--orange-dark);
  --heading-on-dark: #ee9b80;
}

/* Practical information has a clearer hierarchy beneath the display type. */
.desktop-nav a,
.header-cta {
  font-size: 15px;
  font-weight: 600;
}
.mobile-nav a { font-weight: 600; letter-spacing: -.01em; }
.button, .text-link, .stage-link, .capture-expand { font-weight: 600; }
.hero-description {
  font-size: 18px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: -.01em;
}
.hero-detail,
.perspective-copy > div,
.section-intro,
.project-gallery .project-info p:not(.eyebrow),
.system-step > span > span,
.system-bottom p,
.primary-offer > p,
.primary-offer li,
.offer-row > p:not(.eyebrow):not(.confirm-note),
.google-offer p,
.local-layout > div:first-child > p:not(.eyebrow),
.faq-list details p,
.audit-copy > p:not(.eyebrow) {
  font-size: var(--reading-size);
  line-height: 1.75;
}
.hero-detail,
.perspective-copy > div,
.section-intro,
.project-gallery .project-info p:not(.eyebrow),
.offer-row > p:not(.eyebrow):not(.confirm-note),
.google-offer p,
.faq-list details p { color: var(--reading-ink); }
.system .section-intro,
.system-step > span > span,
.system-bottom p,
.audit-copy > p:not(.eyebrow) { color: var(--reading-light); }
.perspective-punch { font-weight: 600; }
.project-gallery .project-info h3,
.primary-offer h3,
.offer-row h3,
.google-offer h3 {
  font-weight: 600;
  letter-spacing: -.035em;
  line-height: 1.18;
}
.system-step strong {
  color: var(--heading-on-dark);
  font-size: 21px;
  font-weight: 600;
  letter-spacing: -.015em;
  line-height: 1.35;
}
.main-price, .row-price { font-weight: 550; }
.main-price span, .row-price span { font-weight: 400; }
.faq-list summary {
  color: var(--heading-on-light);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -.01em;
  line-height: 1.55;
}

/* Questions lead; answers, examples and optional notes remain subordinate. */
.audit-form .form-header .eyebrow {
  color: var(--heading-on-dark);
  font-size: 19px;
  font-weight: 650;
  letter-spacing: .035em;
  line-height: 1.4;
}
.audit-form .form-header > span:last-child {
  font-size: 14px;
  line-height: 1.6;
  color: var(--reading-light);
}
.audit-form .field label {
  color: var(--heading-on-dark);
  font-size: 18px;
  font-weight: 650;
  letter-spacing: -.01em;
  line-height: 1.5;
  margin-bottom: 10px;
}
.audit-form .field label > span {
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  color: var(--reading-light);
}
.audit-form .field input,
.audit-form .field select,
.audit-form .field textarea {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  min-height: 46px;
}
.audit-form .field textarea { min-height: 110px; }
.audit-form .field input::placeholder,
.audit-form .field textarea::placeholder {
  font-size: 16px;
  font-weight: 400;
  color: #b6bdad;
}
.audit-form .field select:has(option[value=""]:checked) {
  font-size: 16px;
  color: #b6bdad;
}
/* Error feedback has its own label and rose treatment, separate from headings. */
.audit-form .field-error:not(:empty) {
  padding: 8px 10px;
  margin-top: 10px;
  border-left: 2px solid #f3a5aa;
  border-radius: 2px;
  background: #412c2c;
  color: #ffd4d4;
  font-weight: 400;
  line-height: 1.55;
}
.audit-form .field-error:not(:empty)::before {
  content: 'Error: ';
  font-weight: 650;
}
.audit-form .form-error {
  border-color: #f3a5aa;
  background: #412c2c;
  color: #ffd4d4;
}
.audit-form .field [aria-invalid="true"] { border-bottom-color: #f5f3ec66; }
.audit-form .field label > span[aria-hidden="true"] { color: inherit; }
.audit-form .form-notice {
  font-size: 15px;
  line-height: 1.75;
  color: var(--reading-light);
}
.audit-form .form-small { color: var(--reading-light); }
.audit-form .form-result h3 { font-weight: 600; }
.audit-form .form-result .form-receipt > strong { font-weight: 600; }

/* Explanations outside the compact demonstration windows stay readable. */
.capture-description > p:not(.capture-label) {
  font-size: 16px;
  line-height: 1.75;
  color: var(--reading-ink);
}
.lead-example .capture-description h3 { font-weight: 600; }
.project-gallery .project-info h3,
.offer-row h3,
.google-offer h3,
.lead-example .capture-description h3 { color: var(--heading-on-light); }
.capture-description .capture-expand { font-size: 15px; }
.walkthrough-controls button { font-size: 14px; font-weight: 600; }
.whatsapp-panel > p { font-size: 16px; }
.whatsapp-continue { font-size: 15px; font-weight: 600; }

@media (min-width: 1051px) {
  :root { --reading-size: 18px; }
}
@media (max-width: 800px) {
  .system-step strong { font-size: 20px; }
}
@media (max-width: 600px) {
  .audit-form .field label { font-size: 17px; }
  .audit-form .form-header .eyebrow { font-size: 18px; }
  .walkthrough-controls button { font-size: 13px; }
}
@media (max-width: 450px) {
  .audit-form .form-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 380px) {
  .header-cta { font-size: 14px; gap: 8px; margin-right: 8px; }
}