/*
 * Mono Typography System — v1.2.0.18
 * Single source of truth for semantic headings, paragraphs, text colours and
 * compact UI text roles. Page-specific styles must not redefine H1–H6/P type.
 */
:root{
  --mono-type-font:var(--mono-font,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);

  --mono-type-h1:clamp(2.625rem,5vw,4.5rem);
  --mono-type-h2:clamp(2rem,3.4vw,2.75rem);
  --mono-type-h3:clamp(1.375rem,1.8vw,1.625rem);
  --mono-type-h4:1.25rem;
  --mono-type-h5:1.125rem;
  --mono-type-h6:1rem;
  --mono-type-body:1rem;
  --mono-type-lead:clamp(1.0625rem,1.35vw,1.25rem);
  --mono-type-ui-md:.9375rem;
  --mono-type-ui-sm:.875rem;
  --mono-type-ui-xs:.8125rem;

  --mono-leading-h1:1.04;
  --mono-leading-h2:1.1;
  --mono-leading-h3:1.18;
  --mono-leading-h4:1.28;
  --mono-leading-h5:1.35;
  --mono-leading-h6:1.4;
  --mono-leading-body:1.7;
  --mono-leading-lead:1.62;
  --mono-leading-ui:1.5;

  --mono-tracking-h1:-.05em;
  --mono-tracking-h2:-.04em;
  --mono-tracking-h3:-.025em;
  --mono-tracking-heading:-.015em;

  --mono-type-color-heading:var(--mono-text,#E6F7FF);
  --mono-type-color-body:#B8D9E6;
  --mono-type-color-lead:#CDEFFF;
  --mono-type-color-muted:#91B9CC;
  --mono-type-color-accent:var(--mono-accent,#00BFFF);
  --mono-type-color-danger:#FFE4E7;
  --mono-type-color-info:#A9EAFA;
  --mono-type-color-warning:#F3DEB3;
  --mono-type-color-on-light:#071D36;
  --mono-type-color-on-light-body:#526B7B;
  --mono-type-color-preview:#294455;
  --mono-type-color-preview-muted:#718796;
}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  color:var(--mono-type-color-body);
  font-family:var(--mono-type-font);
  font-size:var(--mono-type-body);
  line-height:var(--mono-leading-body);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

:is(h1,h2,h3,h4,h5,h6){
  margin:0 0 18px;
  color:var(--mono-type-color-heading);
  font-family:var(--mono-type-font);
  font-weight:800;
  text-wrap:balance;
}
h1{font-size:var(--mono-type-h1);line-height:var(--mono-leading-h1);letter-spacing:var(--mono-tracking-h1)}
h2{font-size:var(--mono-type-h2);line-height:var(--mono-leading-h2);letter-spacing:var(--mono-tracking-h2)}
h3{font-size:var(--mono-type-h3);line-height:var(--mono-leading-h3);letter-spacing:var(--mono-tracking-h3)}
h4{font-size:var(--mono-type-h4);line-height:var(--mono-leading-h4);letter-spacing:var(--mono-tracking-heading)}
h5{font-size:var(--mono-type-h5);line-height:var(--mono-leading-h5);letter-spacing:var(--mono-tracking-heading)}
h6{font-size:var(--mono-type-h6);line-height:var(--mono-leading-h6);letter-spacing:var(--mono-tracking-heading)}
:is(h1,h2,h3,h4,h5,h6) a{color:inherit}

p{
  margin:0 0 1.1rem;
  color:var(--mono-type-color-body);
  font-family:var(--mono-type-font);
  font-size:var(--mono-type-body);
  font-weight:400;
  line-height:var(--mono-leading-body);
  letter-spacing:0;
}

/* Editorial hierarchy: one shared reading rhythm across pages and posts. */
body[class] .mono-content :is(p,li),
body[class] .mono-legal-copy :is(p,li){line-height:1.75}
body[class] .mono-content :is(h2,h3,h4),
body[class] .mono-legal-copy :is(h2,h3,h4){color:var(--mono-type-color-heading)}

/* Lead and supporting copy are semantic roles, not page-specific overrides. */
body[class] .mono-lead{
  color:var(--mono-type-color-lead);
  font-size:var(--mono-type-lead);
  font-weight:400;
  line-height:var(--mono-leading-lead);
  letter-spacing:0;
}
body[class] .mono-hero-note{
  color:var(--mono-type-color-muted);
  font-size:var(--mono-type-ui-sm);
  line-height:1.6;
}
body[class] .mono-card-excerpt{
  color:var(--mono-type-color-body);
  font-size:var(--mono-type-body);
  line-height:var(--mono-leading-body);
}
/* Review cards use a light surface. Keep quote copy on the light-surface
   palette instead of inheriting the global blue-on-dark paragraph colour. */
body[class] .mono-testimonial-card p{
  color:var(--mono-type-color-on-light-body);
}
body[class] .mono-archive-status{
  color:var(--mono-type-color-lead);
  font-size:var(--mono-type-ui-md);
  font-weight:700;
  line-height:1.45;
}

/* Sidebar/table-of-contents title is a compact UI heading. */
body[class] .mono-insight-toc h2{
  color:var(--mono-type-color-heading);
  font-size:var(--mono-type-h5);
  line-height:1.3;
  letter-spacing:-.02em;
}

/* Footer typography remains hierarchical without inventing a page-local scale. */
body[class] .mono-footer-brand h2{
  color:var(--mono-type-color-heading);
  font-size:var(--mono-type-h3);
  line-height:1.16;
  letter-spacing:var(--mono-tracking-h3);
}
body[class] .mono-footer-brand > p{
  color:var(--mono-type-color-body);
  font-size:var(--mono-type-body);
  line-height:var(--mono-leading-body);
}
body[class] .mono-footer-nav h3{
  color:var(--mono-type-color-heading);
  font-size:var(--mono-type-ui-xs);
  font-weight:800;
  line-height:1.3;
  letter-spacing:.1em;
}

/* Form/error copy uses the same body scale with semantic state colour. */
body[class] :is(.mono-form-notice,.mono-archive-error) p{color:var(--mono-type-color-danger)}

/* Hero app previews are interface mockups, so they use compact UI tokens. */
body[class] .mono-request-summary h3{
  color:var(--mono-type-color-heading);
  font-size:var(--mono-type-h5);
  line-height:1.28;
  letter-spacing:-.02em;
}
body[class] .mono-request-summary p{
  color:var(--mono-type-color-body);
  font-size:var(--mono-type-ui-sm);
  line-height:1.5;
}
body[class] .mono-message p{
  font-size:var(--mono-type-ui-sm);
  line-height:1.5;
}
body[class] .mono-handoff-summary p{
  color:var(--mono-type-color-muted);
  font-size:var(--mono-type-ui-xs);
  line-height:1.5;
}
body[class] .mono-handoff-summary p strong{color:var(--mono-type-color-lead)}

/* Light app-preview variants keep the same scale and switch semantic colour set. */
body.mono-page-slug-booking-inquiry-system .mono-request-summary h3{color:var(--mono-preview-ink,var(--mono-type-color-on-light))}
body.mono-page-slug-booking-inquiry-system .mono-request-summary p{color:var(--mono-preview-muted,var(--mono-type-color-preview-muted))}
body.mono-page-slug-ai-customer-response-system .mono-conversation-preview .mono-message p{
  color:var(--mono-type-color-preview);
  font-size:var(--mono-type-ui-xs);
  line-height:1.5;
}
body.mono-page-slug-ai-customer-response-system .mono-handoff-summary p{
  color:var(--mono-type-color-preview-muted);
  font-size:.75rem;
  line-height:1.48;
}
body.mono-page-slug-ai-customer-response-system .mono-handoff-summary p strong{color:var(--mono-type-color-on-light)}

/* Cookie consent is a light UI surface; typography still comes from this system. */
body[class] :is(.mono-cookie-banner,.mono-cookie-preferences-panel) h2{
  color:var(--mono-type-color-on-light);
  font-size:var(--mono-type-h4);
  line-height:1.2;
  letter-spacing:-.025em;
}
body[class] .mono-cookie-category h3{
  color:var(--mono-type-color-on-light);
  font-size:var(--mono-type-body);
  line-height:1.35;
  letter-spacing:-.01em;
}
body[class] :is(.mono-cookie-banner p,.mono-cookie-preferences-intro,.mono-cookie-category p){
  color:var(--mono-type-color-on-light-body);
  font-size:var(--mono-type-ui-sm);
  line-height:1.58;
}

@media(max-width:640px){
  :root{
    --mono-type-h1:clamp(2.5rem,11vw,3.25rem);
    --mono-type-h2:clamp(1.875rem,8vw,2.375rem);
    --mono-type-h3:clamp(1.3125rem,5.2vw,1.5rem);
    --mono-type-h4:1.1875rem;
  }
  body[class] .mono-footer-brand h2{font-size:1.5rem}
  body[class] :is(.mono-cookie-banner,.mono-cookie-preferences-panel) h2{font-size:1.1875rem}
  body[class] :is(.mono-cookie-banner p,.mono-cookie-preferences-intro,.mono-cookie-category p){font-size:.875rem;line-height:1.52}
}

/* Shared paragraph-role typography formerly duplicated in page-family CSS. */
body[class] .mono-hero-microcopy{
  color:var(--mono-type-color-lead);
  font-size:var(--mono-type-ui-md);
  line-height:1.6;
}
body[class] .mono-section-note{
  color:var(--mono-type-color-body);
  font-size:var(--mono-type-ui-sm);
  line-height:1.6;
}
body[class] .mono-connected-type{
  color:var(--mono-ui-accent,var(--mono-type-color-accent));
  font-size:.75rem;
  font-weight:800;
  line-height:1.3;
  letter-spacing:.09em;
}
body[class] .mono-best-for{color:var(--mono-type-color-lead)!important}
body[class] .mono-review-selection-status{
  color:var(--mono-type-color-info);
  font-size:var(--mono-type-body);
  font-weight:700;
  line-height:1.55;
}
body[class] .mono-review-privacy-note{
  color:var(--mono-type-color-muted);
  font-size:var(--mono-type-ui-xs);
  line-height:1.55;
}
body[class] .mono-thank-you-browser-note{
  color:var(--mono-type-color-warning);
  font-size:var(--mono-type-ui-sm);
  line-height:1.55;
}
body[class] .mono-thank-you-contact-note{
  color:var(--mono-type-color-body);
  font-size:var(--mono-type-ui-sm);
  line-height:1.55;
}
body[class] .mono-work-result{
  color:var(--mono-type-color-lead);
  font-size:var(--mono-type-ui-md);
  font-weight:700;
  line-height:1.45;
}
body[class] .mono-work-result span{
  color:var(--mono-type-color-accent);
  font-size:.72rem;
  font-weight:800;
  line-height:1.3;
  letter-spacing:.08em;
}

@media(max-width:640px){
  body[class] .mono-hero-microcopy{font-size:var(--mono-type-ui-sm)}
}
