/* Shared reading hierarchy for the homepage, tools hub and service pages.
   Supporting text is distinct without making long paragraphs heavy. */
@font-face {
  font-family: Manrope;
  src: url('/assets/fonts/manrope-600.ttf') format('truetype');
  font-weight: 600;
  font-display: swap;
}
.legible-site {
  --support-ink: #29455f;
  --support-on-dark: #e0edf6;
  font-size: 17px;
  line-height: 1.8;
}
/* Body and card summaries retain a regular reading weight. */
.legible-site :is(
  .section-heading > div > p, .pillar-summary, .pillar-deliverables,
  .pillar-impact, .process-grid p, .project > p:not(.eyebrow),
  .about-layout p:not(.eyebrow):not(.career-note), .resource-strip p:not(.eyebrow),
  .hub-tool p, .diagnosis-panel > p, .check-list, .first-move p,
  .lab-intro p, .lab-panel > p, .workshop-offer p, .service-card > p,
  .client-tech-card-copy p, .client-tech-note, .proof-body p, .proof-text-link p,
  .locations-intro > p, #map-detail-description, .faq-layout details p,
  .moment-body p, .format-grid article p, .format-footer p,
  .portfolio-copy > p:not(.portfolio-kind), .bodycopy
) {
  font-size: 17px !important;
  font-weight: 400;
  line-height: 1.8;
  letter-spacing: 0;
}
/* Labels, attribution, metadata, helper copy and compact controls. */
.legible-site :is(
  .eyebrow, .deliverable-label, .hero-experience > span,
  .hero-portrait figcaption small, .hero-portrait figcaption a,
  .process-grid li > span, .quote-grid figcaption, .quote-grid figcaption span,
  .quote-grid figcaption strong, .source-note, .career-note,
  .hub-index, .hub-breadcrumb, .hub-note, .hub-wayfinding,
  .form-grid label, .form-grid label > span, .form-note, .form-status,
  .visitor-form-guide, .visitor-required, .visitor-error-summary,
  .visitor-error-summary .visitor-error-title, .visitor-error-link,
  .footer-top > p, .footer-bottom, .footer-bottom span, .footer-bottom a,
  .foot, .foot > span, .foot a, .hero-note > p, .hero-note > span,
  .sales-portrait-caption > span, .steps li > span,
  .moment-grid summary > span, .moment-note, .format-grid article > span,
  .format-grid article > strong, .portfolio-address, .portfolio-kind,
  .portfolio-scope li, .input-intro, .microcopy, .calc-field label,
  .calc-field small, .number-wrap > span, .compact-number > span,
  .range-ends > span, .advanced-settings > summary, .period-switch button,
  .presets button, .result-label, .result-subtitle, .result-caveat,
  .chart-row, .chart-row span, .chart-row strong, .result-breakdown,
  .result-breakdown small, .net-result > span, .net-result small,
  .method-note, .method-note summary, .friction-progress-label,
  .friction-progress-label span, .friction-detail, .friction-privacy,
  .friction-map-row > span, .friction-map-row > strong,
  .friction-ring-copy > p, .friction-empty, .friction-empty small,
  .friction-method, .friction-method summary, .friction-day,
  .friction-plan small, .lab-panel-meta, .lab-panel-meta > span,
  .lab-move > span, .lab-foot > span, .training-outcomes > span,
  .workshop-offer .workshop-meta, .client-tech-capabilities > span,
  .client-site-url, .client-tech-kicker, .client-tech-meta,
  .service-number, .proof-live, .proof-note a,
  .service-map-toolbar > span, .map-status-card > span, .map-status-card > small,
  .map-remote-button > span, .map-remote-button > small,
  .service-map-legend > span, .location-list button > span,
  .location-list button > small, #map-detail-kicker
) {
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.65 !important;
  letter-spacing: .01em;
  opacity: 1;
}
.legible-site :is(.eyebrow, .deliverable-label, .hub-index, .service-number,
  .hero-note > span, .sales-portrait-caption > span, .format-grid article > span,
  .client-tech-kicker, #map-detail-kicker) {
  letter-spacing: .065em !important;
}
/* Comfortable actions and section links; no condensed all-caps controls. */
.legible-site :is(.button, .text-link, .service-card-link, .secondary,
  .nav-cta, .home-tool-links a, .portfolio-links a, .format-footer a,
  .quiet-button, .calculator-actions button, .lab-tab, .map-mode-button,
  .hub-wayfinding a, .visitor-return) {
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.55;
  letter-spacing: 0;
  text-transform: none;
}
.legible-site :is(.desktop-nav a, .nav nav a, .menu-button, .header-cta) {
  font-size: 15px !important;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
}
.legible-site .text-link, .legible-site .service-card-link,
.legible-site .secondary { text-underline-offset: 5px; }
/* Light surfaces use a deeper navy for supporting copy. */
.legible-site :is(.location-line, .hero-experience > span,
  .hero-portrait figcaption small, .hero-portrait figcaption a,
  .source-note, .career-note, .quote-grid figcaption span,
  .project > p, .process-grid p, .about-layout p,
  .footer-top > p, .footer-bottom, .footer-bottom span, .footer-bottom a,
  .foot, .foot > span, .foot a, .hero-note p, .portfolio-address,
  .portfolio-kind, .portfolio-scope li, .moment-body p, .format-footer p) {
  color: var(--support-ink) !important;
}
.legible-site .location-line .shell {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: .01em;
  padding-block: 22px;
  color: #152e4c;
}
.legible-site .location-line { background: #e4f0f7; border-color: #bfd0de; }
.legible-site .location-line .shell > span { color: #152e4c; }
.legible-site :is(.form-note a, .footer-bottom a, .foot a,
  .hub-wayfinding a, .home-tool-links a) { font-weight: 600; }
.legible-site .form-grid :is(input, select, textarea) { font-size: 17px; line-height: 1.6; }
.legible-site .form-note, .legible-site .form-status { line-height: 1.8 !important; }
.legible-site .career-note { font-size: 16px !important; }
.legible-site .hero-portrait figcaption strong { font-size: 16px; }
.legible-site .footer-bottom, .legible-site .foot { row-gap: 18px; }
/* Tool input panels and the deeper resource cards. */
.legible-site.tools-hub :is(.input-intro, .microcopy, .calc-field small,
  .number-wrap > span, .range-ends > span, .friction-detail,
  .friction-privacy, .friction-progress-label span, #map-detail-description,
  #map-detail-kicker, .service-card > p, .service-number,
  .service-card-link, .proof-body p, .proof-text-link p, .locations-intro > p,
  .service-map-legend > span, .location-list button > span,
  .location-list button > small, #friction-status) {
  color: var(--support-ink) !important;
}
.legible-site.tools-hub :is(.contact-section .form-note,
  .contact-section .form-status, .contact-section .visitor-form-guide) {
  color: #29455f !important;
}
.legible-site.tools-hub .hub-tool p { color: #29455f; }
.legible-site.tools-hub .lab-foot { flex-wrap: wrap; }
.legible-site.tools-hub .client-tech-capabilities { flex-wrap: wrap; }
.legible-site.tools-hub :is(.client-tech-showcase, .calculator-section,
  .training-lab, .resource-intro) :is(.hub-note, .hub-breadcrumb,
  .result-label, .result-subtitle, .result-caveat, .chart-row span,
  .result-breakdown small, .friction-ring-copy > p,
  .lab-panel-meta > span, .lab-move > span, .lab-foot > span,
  .training-outcomes > span, .client-tech-capabilities > span,
  .client-site-url, .client-tech-kicker, .client-tech-meta,
  .client-tech-card-copy p, .client-tech-note, .client-tech-note > span) {
  color: var(--support-on-dark) !important;
}
.legible-site.tools-hub :is(.calculator-results, .friction-results) :is(
  p, small, .friction-map-row > span, .friction-map-row > strong,
  .friction-empty small, .friction-day) { color: var(--support-on-dark) !important; }
.legible-site.tools-hub :is(.calculator-inputs, .friction-inputs) p {
  color: var(--support-ink);
}
.legible-site.tools-hub :is(.map-status-card, .map-remote-button) :is(span, small) {
  color: #e0edf6 !important;
}
.legible-site .contact-section :is(.form-grid label > span, .form-note, .form-status) {
  color: #e0edf6;
}
/* Keep ample space as metadata wraps rather than shrinking it. */
.legible-site .service-map-legend { flex-wrap: wrap; }
.legible-site .map-status-card, .legible-site .map-remote-button { max-width: 100%; }
.legible-site .hub-tool .button { gap: 12px; }
.legible-site .format-grid article > strong { margin-top: auto; }
@media (max-width: 1100px) and (min-width: 801px) {
  .legible-site .site-header .desktop-nav { gap: 16px; }
  .legible-site .header-inner { gap: 20px; }
}
@media (max-width: 800px) {
  .legible-site { font-size: 16px; }
  .legible-site :is(.section-heading > div > p, .pillar-summary,
    .pillar-deliverables, .pillar-impact, .process-grid p, .project > p:not(.eyebrow),
    .about-layout p:not(.eyebrow):not(.career-note), .resource-strip p:not(.eyebrow),
    .hub-tool p, .diagnosis-panel > p, .check-list, .first-move p,
    .lab-intro p, .lab-panel > p, .workshop-offer p, .service-card > p,
    .client-tech-card-copy p, .client-tech-note, .proof-body p, .proof-text-link p,
    .locations-intro > p, #map-detail-description, .faq-layout details p,
    .moment-body p, .format-grid article p, .format-footer p,
    .portfolio-copy > p:not(.portfolio-kind), .bodycopy) { font-size: 16px !important; }
  .legible-site .form-grid :is(input, select, textarea) { font-size: 16px; }
  .legible-site .location-line .shell { flex-direction: column; gap: 8px; }
  .legible-site .nav nav { flex-wrap: wrap; overflow: visible; white-space: normal; gap: 12px 22px; }
}
@media (max-width: 560px) {
  .legible-site .header-cta, .legible-site .menu-button { font-size: 14px !important; }
  .legible-site .header-cta { padding-inline: 10px; gap: 6px; }
  .legible-site .header-inner { gap: 10px; }
  .legible-site .header-cta > span[aria-hidden] { display: none; }
  .legible-site .hero-portrait figcaption { align-items: flex-start; }
}
/* Explicit descendants also cover the older resource tool styles. */
.legible-site :is(.booking-card p, .contact-copy > p:not(.eyebrow),
  .check-list li, .friction-plan p, #friction-plan-intro) {
  font-size: 17px !important;
  line-height: 1.8;
}
.legible-site :is(.booking-card p, .hub-wayfinding .shell > span,
  .calculator-inputs label, .comparison > div > span,
  .comparison > div > strong, .friction-crosslink strong,
  .friction-crosslink span, .friction-readout p, .workshop-agenda > small,
  .service-card summary, .map-status-card > strong, .map-remote-button > strong) {
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.65;
  letter-spacing: .01em;
}
.legible-site.tools-hub .comparison :is(span, strong),
.legible-site.tools-hub .friction-readout p { color: #e0edf6 !important; }
.legible-site .footer-bottom #year { font: inherit; color: inherit; }
@media (max-width: 800px) {
  .legible-site :is(.booking-card p, .contact-copy > p:not(.eyebrow),
    .check-list li, .friction-plan p, #friction-plan-intro) { font-size: 16px !important; }
}
.legible-site :is(.pale, .light, .sales-formats) .eyebrow,
.legible-site .moment-grid summary > span { color: #29455f !important; }
/* Allow the larger map notes to breathe without obscuring the map controls. */
.legible-site .map-support {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding: 20px;
  background: #152e4c;
}
.legible-site .map-support :is(.map-status-card, .map-remote-button) {
  position: static;
  width: 100%;
  min-width: 0;
  transform: none;
  margin: 0;
  padding: 16px;
  opacity: 1;
  background: #213d5b;
  color: #f8fafb;
  border: 1px solid #72899f;
  text-align: left;
}
.legible-site .map-support .map-status-card small { display: block; }
.legible-site .map-pin small { font-size: 15px; font-weight: 600; }
.legible-site .map-pin strong { font-size: 16px; }
@media (max-width: 560px) {
  .legible-site .map-support { grid-template-columns: 1fr; padding: 16px; }
}
