/* supervision2 — generated by tools/generate-tokens.mjs from
   clients/supervision2/contract.tokens.json. DO NOT EDIT: change the contract
   and regenerate. `node tools/generate-tokens.mjs supervision2 --check` fails
   when this file and the contract disagree. */

:root {
  /* Brand palette: private. Only the roles below may use these. */
  --_ink:                   #0F172A;
  --_slate-800:             #1E293B;
  --_slate-700:             #334155;
  --_slate-600:             #475569;
  --_slate-500:             #64748B;
  --_slate-400:             #94A3B8;
  --_slate-300:             #CBD5E1;
  --_slate-200:             #E2E8F0;
  --_slate-100:             #F1F5F9;
  --_slate-50:              #F8FAFC;
  --_white:                 #FFFFFF;
  --_blue:                  #2563EB;
  --_blue-dark:             #1D4ED8;
  --_blue-light:            #93C5FD;
  --_blue-pale:             #EFF6FF;
  --_blue-wash:             #F5FAFF;
  --_green:                 #047857;
  --_green-pale:            #D1FAE5;
  --_red:                   #B91C1C;
  --_red-pale:              #FEE2E2;
  --_amber:                 #92400E;
  --_amber-pale:            #FEF3C7;

  /* fg */
  --fg-strong:              var(--_ink);
  --fg-medium:              var(--_slate-700);
  --fg-secondary:           var(--_slate-600);
  --fg-muted:               var(--_slate-600);
  --fg-on-dark:             var(--_white);
  --fg-on-dark-soft:        var(--_slate-400);
  --fg-on-accent:           var(--_white);
  --fg-on-accent-soft:      var(--_blue-pale);
  --fg-eyebrow:             var(--_blue);
  --fg-emphasis-on-dark:    var(--_white);
  --fg-link:                var(--_blue);
  --fg-link-on-dark:        var(--_blue-light);
  --fg-on-badge:            var(--_ink);
  --fg-link-hover:          var(--_blue-dark);
  --fg-caption:             var(--_slate-500);
  --fg-phrase-accent:       var(--_blue);
  --fg-phrase-soft:         var(--_slate-500);
  --fg-cite:                var(--_slate-500);
  --fg-quote:               var(--_slate-600);
  --fg-nav-current:         var(--_ink);
  --fg-nav-ancestor:        var(--_ink);
  --fg-label:               var(--_slate-700);
  --fg-placeholder:         var(--_slate-500);

  /* field */
  --field-bg:               var(--_white);
  --field-fg:               var(--_ink);
  --field-border:           var(--_slate-500);
  --field-border-focus:     var(--_blue);
  --field-radius:           var(--radius-md);
  --field-height:           2.75rem;

  /* status */
  --status-error-bg:        var(--_red-pale);
  --status-error-fg:        var(--_red);
  --status-warning-bg:      var(--_amber-pale);
  --status-warning-fg:      var(--_amber);
  --status-success-bg:      var(--_green-pale);
  --status-success-fg:      var(--_green);

  /* link */
  --link-rule:              var(--_blue);
  --link-rule-thickness:    1px;
  --link-rule-offset:       3px;

  /* surface */
  --surface-page:           var(--_white);
  --surface-raised:         var(--_white);
  --surface-sunken:         var(--_slate-50);
  --surface-inverse:        var(--_ink);
  --surface-inverse-raised: var(--_slate-800);
  --surface-accent:         var(--_blue);
  --surface-marker:         var(--_blue-pale);
  --surface-badge:          var(--_blue-pale);
  --surface-table-header:   var(--_slate-50);
  --surface-selected:       var(--_blue-pale);
  --surface-code:           var(--_slate-100);
  --surface-tint:           var(--_blue-wash);

  /* ground */
  --ground-text:            var(--fg-medium);

  /* action */
  --action-primary-bg:      var(--_ink);
  --action-primary-fg:      var(--_white);
  --action-on-dark-bg:      var(--_white);
  --action-on-dark-fg:      var(--_ink);
  --action-on-accent-bg:    var(--_white);
  --action-on-accent-fg:    var(--_ink);
  --action-ghost-border:    var(--_slate-400);
  --action-ghost-fg:        var(--_white);
  --action-ghost-light-border: var(--_slate-200);
  --action-ghost-light-fg:  var(--_ink);
  --action-primary-bg-hover: var(--_slate-800);
  --action-primary-fg-hover: var(--_white);
  --action-on-dark-bg-hover: var(--_slate-100);
  --action-on-accent-bg-hover: var(--_slate-100);
  --action-radius:          var(--radius-pill);
  --action-border-width:    1px;

  /* border */
  --border-faint:           var(--_slate-100);
  --border-card:            var(--_slate-200);
  --border-soft:            var(--_slate-200);
  --border-on-dark:         var(--_slate-800);
  --border-accent:          var(--_blue);
  --border-accent-on-dark:  var(--_blue-light);
  --border-quote:           var(--_blue-light);
  --border-table:           var(--_slate-500);
  --border-selected:        var(--_blue);

  /* focus */
  --focus-ring:             var(--_blue);
  --focus-ring-width:       2px;
  --focus-ring-offset:      2px;

  /* motion */
  --motion-base:            150ms;
  --motion-carousel-interval: 8s;

  /* ease */
  --ease-standard:          cubic-bezier(0.4, 0, 0.2, 1);

  /* tracking */
  --tracking-tight:         -0.015em;
  --tracking-wide:          0.2em;
  --tracking-title:         var(--tracking-tight);
  --tracking-prose-title:   -0.01em;

  /* font */
  --font-body:              Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-heading:           Outfit, Montserrat, sans-serif;
  --font-mono:              ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  /* hairline */
  --hairline:               1px;

  /* radius */
  --radius-sm:              8px;
  --radius-md:              12px;
  --radius-lg:              16px;
  --radius-pill:            9999px;
  --radius-xs:              6px;

  /* shadow */
  --shadow-card-tinted:     var(--shadow-card-md);
  --shadow-card-sm:         0 1px 2px rgba(15, 23, 42, 0.05);
  --shadow-card-md:         0 4px 6px -1px rgba(15, 23, 42, 0.1), 0 2px 4px -2px rgba(15, 23, 42, 0.1);
  --shadow-card-lg:         0 10px 15px -3px rgba(15, 23, 42, 0.1), 0 4px 6px -4px rgba(15, 23, 42, 0.1);
  --shadow-image:           none;

  /* t */
  --t-hero:                 clamp(2.25rem, 1.2rem + 3.6vw, 3.75rem);
  --t-section:              clamp(1.875rem, 1.2rem + 2.5vw, 3rem);
  --t-h3:                   1.35rem;
  --t-title:                1.75rem;
  --t-statement:            clamp(1.6rem, 0.95rem + 2.19vw, 2.35rem);
  --t-price:                3rem;
  --t-fact-title:           1.5rem;
  --t-card-body:            0.9375rem;
  --t-card-title:           1.125rem;
  --t-lead:                 1.125rem;
  --t-body:                 1.0625rem;
  --t-small:                0.875rem;
  --t-eyebrow:              0.75rem;
  --t-stat:                 2.25rem;
  --t-label:                0.875rem;
  --t-tag:                  0.75rem;
  --t-band-title:           2rem;

  /* lh */
  --lh-tight:               1;
  --lh-snug:                1.25;
  --lh-normal:              1.5;
  --lh-relaxed:             1.75;
  --lh-flush:               1;
  --lh-title:               1;
  --lh-band-title:          1.125;
  --lh-prose-title:         1.75;

  /* fw */
  --fw-regular:             400;
  --fw-semi:                600;
  --fw-bold:                600;
  --fw-medium:              500;

  /* space */
  --space-0:                0;
  --space-1:                0.25rem;
  --space-2:                0.5rem;
  --space-3:                0.75rem;
  --space-4:                1rem;
  --space-5:                1.25rem;
  --space-6:                1.5rem;
  --space-7:                2rem;
  --space-8:                2.5rem;
  --space-9:                3rem;
  --space-10:               4rem;
  --space-11:               5rem;
  --space-12:               6rem;

  /* measure */
  --measure-site:           76rem;
  --measure-banner:         76rem;
  --measure-content:        calc(var(--measure-banner) - var(--gutter) - var(--sidebar-width) - var(--sidebar-gap));
  --measure-prose:          44rem;
  --measure-statement:      52rem;
  --measure-band:           60rem;
  --measure-head:           42rem;

  /* gutter */
  --gutter:                 2rem;
  --gutter-page-edge:       1.5rem;

  /* breakpoint */
  --breakpoint-mobile:      48em;
  --breakpoint-sidebar:     64em;

  /* sidebar */
  --sidebar-width:          18rem;
  --sidebar-gap:            3rem;

  /* banner */
  --banner-home-padding-start: 5rem;
  --banner-home-padding-end: 3rem;
  --banner-text-max:        56rem;
  --banner-lead-max:        42rem;
  --banner-padding-end:     4rem;
  --banner-home-heading-size: clamp(3rem, 1.5rem + 4.69vw, 4.5rem);

  /* section */
  --section-inline-padding: 4rem;

  /* card */
  --card-radius:            var(--radius-lg);
  --card-raised-radius:     16px;
  --card-icon-size:         3.5rem;
  --card-border-width:      1px;

  /* content */
  --content-quote-rule:     3px;

  /* inset-cta */
  --inset-cta-radius:       var(--radius-lg);
  --inset-cta-padding:      2rem;
  --inset-cta-padding-phone: 1.5rem;

  /* image */
  --image-radius:           var(--radius-lg);

  /* header */
  --header-height:          80px;

  /* layer */
  --layer-base:             0;
  --layer-raised:           10;
  --layer-sticky:           40;
  --layer-header:           50;
  --layer-overlay:          60;
}

@media (min-width: 48em) {
  :root {
    --banner-padding-end:   5rem;
  }
}

body:not(.has-sidebar) { --measure-content: 44rem; }

.c-ground--sunken { background: var(--surface-sunken); }

.c-ground--raised {
  background: var(--surface-raised);
  --ground-text:        var(--fg-medium);
  color: var(--ground-text);
}

.c-ground--inverse {
  background: var(--surface-inverse);
  --ground-text:        var(--_slate-400);
  --fg-strong:          var(--_white);
  --fg-medium:          var(--_slate-400);
  --fg-secondary:       var(--_slate-400);
  --fg-muted:           var(--_slate-400);
  --fg-eyebrow:         var(--_blue-light);
  --fg-link:            var(--_blue-light);
  --border-faint:       var(--_slate-800);
  --border-card:        var(--_slate-800);
  --surface-raised:     var(--surface-inverse-raised);
  --focus-ring:         var(--_blue-light);
  --shadow-card-tinted: none;
  color: var(--ground-text);
}

.c-ground--accent {
  background: var(--surface-accent);
  --ground-text:        var(--_white);
  --fg-strong:          var(--_white);
  --fg-medium:          var(--_white);
  --fg-secondary:       var(--_white);
  --fg-muted:           var(--_white);
  --fg-eyebrow:         var(--_white);
  --fg-link:            var(--_white);
  --border-faint:       rgba(255, 255, 255, 0.3);
  --border-card:        rgba(255, 255, 255, 0.3);
  --focus-ring:         var(--_white);
  --shadow-card-tinted: none;
  color: var(--ground-text);
}

.c-ground--tint {
  background: var(--surface-tint);
  --ground-text:        var(--fg-medium);
  --fg-strong:          var(--_ink);
  --fg-medium:          var(--_slate-700);
  --fg-muted:           var(--_slate-600);
  --fg-eyebrow:         var(--_blue);
  --fg-link:            var(--_blue);
  --border-faint:       var(--_slate-200);
  color: var(--ground-text);
}

.c-ground--page {
  background: var(--surface-page);
  --ground-text:        var(--_slate-700);
  --fg-strong:          var(--_ink);
  --fg-medium:          var(--_slate-700);
  --fg-secondary:       var(--_slate-600);
  --fg-muted:           var(--_slate-600);
  --fg-eyebrow:         var(--_blue);
  --fg-link:            var(--_blue);
  --border-faint:       var(--_slate-100);
  --border-card:        var(--_slate-200);
  --surface-raised:     var(--_white);
  --focus-ring:         var(--_blue);
  --shadow-card-tinted: 0 4px 6px -1px rgba(15, 23, 42, 0.1), 0 2px 4px -2px rgba(15, 23, 42, 0.1);
  color: var(--ground-text);
}

/* The sidebar beside the content, from the site's own breakpoint.

   Source for tools/generate-tokens.mjs, which writes this into each client's
   tokens.css with 64em replaced by the contract's
   breakpoint.sidebar (1025px, Kadence's own, when the contract leaves it
   empty). A media query cannot read a custom property, so the value is
   written in. Moved here from components/_frame.scss and _banner.scss on
   30 October 2026, where 1025px was fixed.

   Below the breakpoint the sidebar drops under the content and the banner's
   quick menu takes its place; on a phone the quick menu is all there is
   (Matt, 6 October 2026). Kadence makes the content and sidebar a grid from
   its own 1025px, so the grid is switched on and off here at the site's
   value instead. Plain CSS: no Sass reaches this file. */

@media screen and (width < 64em) {
	/* Below the site's breakpoint the sidebar stacks, even where Kadence
	   would still put it beside the content. */
	:root .cw-frame.has-sidebar .content-container {
		display: block;
	}
}

@media screen and (min-width: 64em) {
	/* From the site's breakpoint the sidebar sits beside the content, even
	   where Kadence would not yet. */
	:root .cw-frame.has-sidebar .content-container {
		display: grid;
	}

	:root .cw-frame.has-sidebar .content-container {
		column-gap: var(--sidebar-gap);
		grid-template-columns: minmax(0, 1fr) var(--sidebar-width);
	}

	:root .cw-frame.has-left-sidebar .content-container {
		grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
	}

	/* sidebar.divider: rule. A hairline in border.soft down the sidebar's
	   content-side edge, then the gap (Thain Wildbur's service pages, whose
	   sidebar is on the left). A right sidebar's text keeps a little room
	   from its rule. */
	:root .cw-sidebar-divider--rule.has-sidebar #secondary {
		border-inline-start: var(--hairline) solid var(--border-soft);
		padding-inline-start: var(--space-6);
	}

	:root .cw-sidebar-divider--rule.has-left-sidebar #secondary {
		border-inline-start: 0;
		border-inline-end: var(--hairline) solid var(--border-soft);
		padding-inline: 0 var(--space-6);
	}

	:root .cw-frame.has-sidebar .entry-content > :is(.c-stack-prose, .c-inset-quotes) {
		padding-inline: var(--page-edge) max(var(--page-edge), 100% - var(--page-edge) - var(--measure-prose));
	}

	/* One left edge beside a sidebar. Grounds, a full-width band or a panel's
	   own box, fill the content column; everything printed on the page or on
	   a ground starts at the page edge inside it, where the reading panels'
	   text starts. Text stops at the measure; grids and cards run on to the
	   same edge on the right. */
	:root .cw-frame.has-sidebar .entry-content > :is(.c-grid-facts, .c-cards-guides, .c-cards-hubs, .c-cards-cases, .c-split-cases, .c-rows-stories, .c-cards-people, .c-strip-facts:not(.c-strip-facts--inverse)) {
		padding-inline: var(--page-edge);
	}

	:root .cw-frame.has-sidebar .entry-content :is(.c-inset-facts__ground, .c-rows-quotes__ground, .c-strip-facts__ground) {
		padding-inline: var(--page-edge);
	}

	:root .cw-frame.has-sidebar .entry-content > * {
		--reading-measure: var(--measure-prose);
	}

	/* The figure's frame fills the content column like a ground; its caption
	   is text, so it starts on the page edge with the rest. */
	:root .cw-frame.has-sidebar .entry-content .c-inset-figure__caption {
		padding-inline: var(--page-edge);
		max-width: calc(var(--reading-measure) + 2 * var(--page-edge));
	}

	/* The panel's own lines of text, not those in its cards or grid: straight
	   in the panel or its ground, or in the inner container a classic theme
	   wraps round each Group's content (panels/_classic-groups.scss). */
	:root .cw-frame.has-sidebar .entry-content :is(.c-grid-facts, .c-cards-guides, .c-cards-hubs, .c-cards-cases, .c-split-cases, .c-rows-stories, .c-cards-people, .c-strip-facts, .c-inset-facts__ground, .c-rows-quotes__ground, .c-strip-facts__ground) > :is(.c-head, .c-eyebrow, .c-title, .c-lead, .c-sub, .c-body),
	:root .cw-frame.has-sidebar .entry-content :is(.c-grid-facts, .c-cards-guides, .c-cards-hubs, .c-cards-cases, .c-split-cases, .c-rows-stories, .c-cards-people, .c-strip-facts, .c-inset-facts__ground, .c-rows-quotes__ground, .c-strip-facts__ground) > :is(.c-measure, .wp-block-group__inner-container) > :is(.c-head, .c-eyebrow, .c-title, .c-lead, .c-sub, .c-body),
	:root .cw-frame.has-sidebar .entry-content .c-strip-facts > .wp-block-group__inner-container > .c-measure > .wp-block-group__inner-container > .c-head {
		max-width: var(--reading-measure);
	}

	.c-banner-menu {
		display: none;
	}

	/* panels/_article.scss: the reading panels beside a sidebar */
	:root:root .has-sidebar :is(.c-stack-prose, .c-inset-quotes) {
		padding-inline: var(--gutter) max(var(--gutter), 100% - var(--gutter) - var(--measure-prose));
	}

	/* panels/_split-prose.scss: its reading column at the measure beside a sidebar */
	@container c-split-prose (max-width: 863.98px) {
		:root:root .cw-frame.has-sidebar :is(.c-split-prose__grid, .c-split-prose__grid > .wp-block-group__inner-container) > :is(.c-head, .c-split-prose__body) {
			max-width: var(--reading-measure);
		}
	}

	/* panels/_inset-quotes.scss: a pair of quotes beside a sidebar (after article, so it wins) */
	:root:root .has-sidebar .c-inset-quotes--2 {
		padding-inline: var(--gutter);
	}

	:root .cw-frame.has-sidebar .entry-content > .c-inset-quotes--2 {
		padding-inline: var(--page-edge);
	}

	/* panels/_inset-video.scss: its text on the page edge beside a sidebar */
	:root .cw-frame.has-sidebar .entry-content .c-inset-video > :is(.c-title, .c-lead, .c-inset-video__caption),
	:root .cw-frame.has-sidebar .entry-content .c-inset-video > .wp-block-group__inner-container > :is(.c-title, .c-lead, .c-inset-video__caption) {
		padding-inline: var(--page-edge);
		max-width: calc(var(--reading-measure) + 2 * var(--page-edge));
	}

	/* panels/_section-menu.scss: the menu level with the content (sidebar.top) */
	body:not(.cw-sidebar-top--align-top) #secondary .c-context-menu:has(> .c-context-menu__heading) {
		padding-block-start: 45px;
	}

	body:not(.cw-sidebar-top--align-top).has-sidebar:has(.single-content > :is(.c-cards-cases, .c-rows-quotes, .c-rows-stories, .c-inset-facts, .c-grid-facts, .c-cards-guides):first-child) #secondary .c-context-menu:has(> .c-context-menu__heading) {
		padding-block-start: calc(var(--space-7) + 45px);
	}

	/* Content that opens with the dark facts strip: level with the strip's box,
	   which sits the Panel's wide-screen top padding down. */
	body:not(.cw-sidebar-top--align-top).has-sidebar:has(.single-content > .c-strip-facts--inverse:first-child) #secondary .c-context-menu:has(> .c-context-menu__heading) {
		padding-block-start: calc(var(--space-11) + 45px);
	}

	.cw-sidebar-top--align-top.has-sidebar :is(.entry-content, .single-content) > :first-child {
		margin-block-start: 0;
	}

	.cw-sidebar-top--align-top.has-sidebar :is(.entry-content, .single-content) > :first-child:not([class*="c-ground--"]) {
		padding-block-start: 0;
	}

	/* A Panel on its own ground keeps a box around its text: as much space
	   above as at its sides, not a full section's worth. */
	.cw-sidebar-top--align-top.has-sidebar :is(.entry-content, .single-content) > :first-child[class*="c-ground--"] {
		padding-block-start: var(--space-9);
	}
}
