/* Mobile-first layout tokens shared by every template. */
:root {
  --container:1280px; --layout-gutter:20px; --section-space:36px;
  --title-page:30px; --title-section:24px; --title-card:20px; --radius:8px;
}
body .container { width:calc(100% - var(--layout-gutter) * 2); max-width:var(--container); }
body :is(.wata-header__utility,.wata-header__main)>.container { max-width:1280px; }
/* Some full-bleed section renderers formerly overrode the common container. */
body .section--consultation-cta>.container { max-width:var(--container); width:calc(100% - var(--layout-gutter) * 2); padding-inline:0; }
body #main h1 { font-size:var(--title-page); line-height:1.28; letter-spacing:-.025em; text-wrap:balance; }
body #main h2:not(.post-card h2):not(.prose h2) { font-size:var(--title-section); line-height:1.4; letter-spacing:-.02em; white-space:normal; text-wrap:balance; }
body #main .post-card :is(h2,h3) { font-size:var(--title-card); }
body #main .section { padding-block:var(--section-space); }
body #main :is(.hero-grid,.service-hero-grid) { min-height:0; padding-block:var(--section-space); }
body #main .news-archive-header { padding-block:28px; background:#f7f9fc; }
body #main .post-card { border-radius:var(--radius); box-shadow:none; }
body #main :is(.hero-summary,.services-summary,.overview-summary) { font-size:16px; line-height:1.75; }
body #main .prose { max-width:70ch; }
body #main :is(.wata-lead-form,.wata-lead-field input,.wata-lead-field textarea) { scroll-margin-top:120px; }
body #main .wata-lead-field :is(input,textarea,select) { font-size:16px; min-height:48px; }
body #main .wata-lead-consent label { min-height:44px; }
body #main :is(.news-filter-chip,.page-numbers:not(.dots)) { min-height:44px; min-width:44px; }
body .button.button.button:is(:disabled,[aria-disabled="true"]):hover { transform:none; box-shadow:none; }
@media(max-width:374px) { :root { --layout-gutter:16px; } }
@media(min-width:640px) {
  :root { --layout-gutter:28px; --section-space:44px; --title-page:36px; --title-section:28px; }
}
@media(min-width:1024px) {
  :root { --layout-gutter:32px; --section-space:56px; --title-page:44px; --title-section:32px; --title-card:21px; }
}
@media(max-width:639px) {
  /* Long editorial headlines have a separate scale from short marketing titles. */
  body.single-post #main h1 { font-size:27px; }
  body #main .hero--text .hero-grid { padding-block:32px; }
}
