/* Shared type and section rhythm for every page.
   Page stylesheets keep layout, colour and motion. Spacing and type come from these tokens. */

:root {
  --section-pad-inline: 80px;
  --section-pad-block: 96px;
  --page-padding: var(--section-pad-inline);
  --copy-gap: 32px;

  --type-hero: clamp(3rem, 6.2vw, 5rem);
  --type-section: clamp(2.25rem, 4.2vw, 4rem);
  --type-title: clamp(1.375rem, 1.6vw, 1.75rem);
  --type-lead: clamp(1.25rem, 1.5vw, 1.5rem);
  --type-body: 1.125rem;
  --type-eyebrow: 0.75rem;

  --type-hero-lh: 1.06;
  --type-section-lh: 1.08;
  --type-body-lh: 1.7;
  --type-track: -0.022em;
}

@media (max-width: 980px) {
  :root {
    --section-pad-inline: 28px;
    --section-pad-block: 72px;
  }
}

@media (max-width: 620px) {
  :root {
    --section-pad-inline: 20px;
    --section-pad-block: 56px;
    --type-hero: clamp(2.375rem, 11.5vw, 3rem);
    --type-section: clamp(2rem, 9vw, 2.75rem);
    --type-lead: 1.25rem;
    --type-body: 1.0625rem;
    --copy-gap: 24px;
  }
}

/* Header, footer and flexible canvases share the same side gutter as sections. */
.site-header.exact-header,
.exact-mega-panel,
.exact-header .primary-nav.is-open,
.exact-footer {
  padding-inline: var(--section-pad-inline);
}

.exact-footer {
  padding-block: var(--section-pad-block);
}

.block-canvas.section-shell {
  --flexible-page-gutter: var(--section-pad-inline);
}

/* Every top-level section, including heroes, uses the same padding. */
:is(
  .exact-home,
  .about-exact,
  .careers-exact,
  .legal-exact,
  .cto-exact,
  .blog-exact,
  .contact-exact,
  .configurable-page
) > section:not(.custom-flexible-sections):not(.block-canvas):not(.exact-flexible),
.blog-exact__list-scope > .blog-exact__controls,
.template-section,
.template-hero {
  margin: 0;
  padding: var(--section-pad-block) var(--section-pad-inline);
}

.configurable-page > section.inner-hero--with-media {
  padding: var(--section-pad-block) 0 var(--section-pad-block) var(--section-pad-inline);
}

.configurable-page > section.inner-hero--with-media > .inner-hero__copy {
  padding: 0 var(--section-pad-inline) 0 0;
}

.exact-home > .exact-careers {
  margin-inline: 0;
}

/* Content and landing pages. The hero, feature, child list and CTA are sections.
   The flexible area is a canvas of blocks, so those blocks have to use the same
   padding or the page still looks uneven. */
.configurable-page > :is(.inner-hero, .landing-hero, .inner-feature, .page-cta, .child-page-grid) {
  max-width: none;
  margin: 0;
  padding: var(--section-pad-block) var(--section-pad-inline);
}

.configurable-page > .inner-hero > .inner-hero__copy,
.configurable-page > .landing-hero > .landing-hero__copy {
  max-width: none;
  padding: 0;
}

.configurable-page > .block-canvas.section-shell {
  max-width: none;
  padding: 0 var(--section-pad-inline);
}

.configurable-page > .block-canvas.section-shell > .umb-block-grid {
  max-width: none;
}

.configurable-page > .block-canvas.section-shell > .umb-block-grid > .umb-block-grid__layout-container > .umb-block-grid__layout-item:not(:has(> .reusable-template-module)) {
  margin: 0;
  padding: var(--section-pad-block) 0;
}

.configurable-page > .block-canvas.section-shell > .umb-block-grid > .umb-block-grid__layout-container > .umb-block-grid__layout-item > :is(.block-headline, .block-richtext, .abstract-grid-layout) {
  max-width: none;
  margin: 0;
  padding: 0;
}

/* A headline block is the title of the next block, so the pair shares one section. */
.configurable-page > .block-canvas.section-shell > .umb-block-grid > .umb-block-grid__layout-container > .umb-block-grid__layout-item:has(> .block-headline):has(+ .umb-block-grid__layout-item) {
  padding-bottom: 0;
}

.configurable-page > .block-canvas.section-shell > .umb-block-grid > .umb-block-grid__layout-container > .umb-block-grid__layout-item:has(> .block-headline) + .umb-block-grid__layout-item:not(:has(> .reusable-template-module)) {
  padding-top: var(--copy-gap);
  padding-bottom: var(--section-pad-block);
}

.configurable-page > .block-canvas.section-shell > .umb-block-grid > .umb-block-grid__layout-container > .umb-block-grid__layout-item:has(> .block-headline) + .umb-block-grid__layout-item:has(> .reusable-template-module) > .reusable-template-module > section {
  padding-top: var(--copy-gap);
}

/* Nested blog bands already sit in a padded section. Separate them by one step. */
.blog-exact__controls :is(.blog-exact__featured, .blog-exact__library) {
  margin: 0;
  padding: var(--section-pad-block) 0 0;
}

.blog-exact__controls-bar {
  margin-inline: calc(-1 * var(--section-pad-inline));
  padding-inline: var(--section-pad-inline);
}

/* Tracks that used to own the page gutter now align to the section padding. */
:is(
  .about-exact__leadership > h2,
  .about-exact__leader-strip,
  .careers-exact__life > header,
  .careers-exact__band-wrap > [data-band],
  .legal-exact__cases > h2,
  .legal-exact__case-track,
  .cto-exact__capabilities-head,
  .cto-exact__cap-track,
  .cto-exact__cap-progress,
  .exact-proof__stats,
  .exact-accreditations
) {
  padding-inline: 0;
}

/* Copied modules use the same section rhythm. Columns already sit inside the canvas gutter. */
.block-canvas > .umb-block-grid > .umb-block-grid__layout-container > [data-col-span="12"] > .reusable-template-module > section,
.reusable-template-module > section.abstract-video-module,
.reusable-template-module > section.abstract-download-module,
:is(.about-exact, .careers-exact, .legal-exact, .cto-exact, .blog-exact, .contact-exact).configurable-page .block-canvas.section-shell > .umb-block-grid > .umb-block-grid__layout-container > [data-col-span="12"] > .reusable-template-module > section:not(.custom-flexible-sections) {
  margin: 0;
  padding: var(--section-pad-block) var(--section-pad-inline);
}

.reusable-template-module:not(:where(.block-canvas > .umb-block-grid > .umb-block-grid__layout-container > [data-col-span="12"] > .reusable-template-module)) > section {
  margin: 0;
  padding-block: var(--section-pad-block);
  padding-inline: 0;
}

.block-canvas > .umb-block-grid > .umb-block-grid__layout-container > .umb-block-grid__layout-item:not(:has(> .reusable-template-module)) {
  padding-block: var(--section-pad-block);
}

.block-canvas > .umb-block-grid > .umb-block-grid__layout-container > .umb-block-grid__layout-item:has(> .enquiry-module) {
  padding-block: 0;
}

.block-canvas.section-shell .enquiry-module,
.enquiry-module {
  padding: var(--section-pad-block) var(--section-pad-inline);
}

.block-canvas.section-shell .enquiry-module {
  padding-inline: 0;
}

/* Heroes */
:is(.exact-home, .about-exact, .careers-exact, .legal-exact, .cto-exact, .blog-exact, .contact-exact, .configurable-page) > section h1,
.reusable-template-module > section h1,
.template-hero h1 {
  font-size: var(--type-hero);
  font-weight: 400;
  line-height: var(--type-hero-lh);
  letter-spacing: -0.03em;
}

/* Section headings. Panel and card titles stay on the smaller title step. */
:is(.exact-home, .about-exact, .careers-exact, .legal-exact, .cto-exact, .blog-exact, .contact-exact, .configurable-page) > section h2,
.blog-exact__list-scope h2,
.reusable-template-module > section h2,
.block-canvas .block-headline h2,
.template-section h2,
:is(.abstract-video-module, .abstract-download-module, .enquiry-module) h2,
.enquiry-module__heading {
  font-size: var(--type-section);
  font-weight: 400;
  line-height: var(--type-section-lh);
  letter-spacing: var(--type-track);
}

:is(.exact-ai, .exact-community) > h2 {
  width: auto;
  max-width: 100%;
  margin: 0;
  padding-bottom: 0;
}

.exact-ai h2 span + span {
  padding-left: 1.6em;
}

.exact-ai__copy {
  margin-top: var(--copy-gap);
}

:is(.exact-home, .about-exact, .careers-exact, .legal-exact, .cto-exact, .blog-exact, .contact-exact, .configurable-page, .reusable-template-module) h3 {
  font-size: var(--type-title);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: -0.01em;
}

/* Body copy */
:is(.exact-home, .about-exact, .careers-exact, .legal-exact, .cto-exact, .blog-exact, .contact-exact) section p,
.configurable-page > section p,
.reusable-template-module section p,
.block-canvas .block-richtext :where(p, li),
.content-carousel .content-carousel__introduction,
.content-carousel .content-carousel__body > :is(.content-carousel__plain, .content-carousel__richtext),
.content-carousel .content-carousel__body :is(.content-carousel__richtext, .content-carousel__quote) :where(p, li),
:is(.cto-exact__benefit, .legal-exact__case) [data-case-copy] p,
:is(.abstract-video-module__description, .abstract-download-module__description, .enquiry-module__introduction, .inner-hero__summary) {
  font-size: var(--type-body);
  line-height: var(--type-body-lh);
}

/* Pasted point sizes and font families must not split one paragraph into
   different type scales. Keep authored emphasis, links and colours intact. */
:is(.block-richtext, .content-carousel__richtext) :is(p, li)[style] {
  font-size: var(--type-body) !important;
  line-height: var(--type-body-lh) !important;
  font-family: inherit !important;
}

:is(.block-richtext, .content-carousel__richtext) :is(p, li) [style]:not(:where(sub, sup)) {
  font-size: inherit !important;
  line-height: inherit !important;
  font-family: inherit !important;
}

:is(.about-exact, .careers-exact, .legal-exact, .cto-exact, .reusable-template-module) :is(
  .about-exact__lead,
  .about-exact__presence-copy,
  .about-exact__vision p,
  .legal-exact__challenge-lead,
  .legal-exact__quote > p,
  .careers-exact__quote > p,
  .cto-exact__statement p
),
.cto-exact__challenge [data-word-stagger] {
  font-size: var(--type-lead);
  font-weight: 300;
  line-height: 1.4;
}

:is(.exact-home, .about-exact, .careers-exact, .legal-exact, .cto-exact, .blog-exact, .contact-exact) > section > small,
:is(.exact-home, .about-exact, .careers-exact, .legal-exact, .cto-exact, .blog-exact, .contact-exact) > section > header > small,
.reusable-template-module > section > small,
.reusable-template-module > section > header > small,
.block-headline .eyebrow,
:is(.abstract-video-module__eyebrow, .abstract-download-module__eyebrow),
.configurable-page .eyebrow {
  font-size: var(--type-eyebrow);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.06em;
}
