/*
 * Pattern UK version split — V1 compatibility
 * Classification: v1
 * Phase 4 pilot asset. Active only when explicitly referenced by pilot code.
 * Provenance: version-specific active Custom Code 02 rules with explicit marker scoping and shared unsuffixed utility foundation extracted
 */

/* Pattern site-wide custom CSS — V3 transition build
   Load after Lumos CSS v2.2.0 and before NEW Custom CSS — V2 Overrides.
   UK post-detach build: legacy V1 layout and type aliases stay on the original
   collections; localized V2 color, theme, and text-style tokens use -2. */
/* ==========================================================================
   Pattern legacy V1 compatibility layer
   Only V1 declarations not owned by Lumos, Marketo, the V1 Grid System,
   or Specter/V2 are retained here.
   Legacy aliases stay global because detached UK pages still use unprefixed V1
   utility classes. Page-specific production-fidelity overrides remain scoped
   to .page_main.cc-v1.
   ========================================================================== */
/* ========================================================================== */
/* V1 Custom Code / Base */
/* ========================================================================== */

/* ========================================================================== */
/* V1 Custom Code / Color */
/* ========================================================================== */
/* Legacy theme aliases backed by the detached V2 swatches. */
:root:has([data-pattern-version="v1"]),
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) [data-theme="light"],
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) [data-theme="dark"] [data-theme="invert"] {
  --theme--background: var(--_default-2---swatch--neutral-50-2);
  --theme--text: var(--_default-2---swatch--neutral-900);
  --theme--border: var(--_default-2---swatch--neutral-900);
  --theme--n1: var(--_default-2---swatch--neutral-900);
  --theme--n2: var(--_default-2---swatch--neutral-500);
  --theme--n3: var(--_default-2---swatch--neutral-50-2);
  --theme--t1: var(--_default-2---swatch--gray-1-o05);
  --theme--t2: color-mix(in srgb, var(--_default-2---swatch--neutral-900) 12%, var(--_default-2---swatch--transparent));
  --theme--t3: color-mix(in srgb, var(--_default-2---swatch--neutral-900) 40%, var(--_default-2---swatch--transparent));
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) [data-theme="dark"],
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) [data-theme="invert"],
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) [data-theme="light"] [data-theme="invert"] {
  --theme--background: var(--_default-2---swatch--neutral-900);
  --theme--text: var(--_default-2---swatch--neutral-50-2);
  --theme--border: var(--_default-2---swatch--neutral-50-2);
  --theme--n1: var(--_default-2---swatch--neutral-50-2);
  --theme--n2: var(--_default-2---swatch--neutral-300);
  --theme--n3: var(--_default-2---swatch--neutral-900);
  --theme--t1: color-mix(in srgb, var(--_default-2---swatch--white) 5%, var(--_default-2---swatch--transparent));
  --theme--t2: color-mix(in srgb, var(--_default-2---swatch--white) 12%, var(--_default-2---swatch--transparent));
  --theme--t3: color-mix(in srgb, var(--_default-2---swatch--white) 40%, var(--_default-2---swatch--transparent));
}

/* apply colors */
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) :is(c, :where([data-theme]:not([data-theme="inherit"]))) {
	background-color: var(--theme--background);
	color: var(--theme--text);
}

/* ========================================================================== */
/* V1 Custom Code / Text Style */
/* ========================================================================== */
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .section_hero_h1 em { 
	color: var(--_default-2---swatch--white);
	background-clip: none;
  -webkit-text-fill-color: var(--_default-2---swatch--white);
  -webkit-background-clip: none;
  vertical-align: baseline;
  line-height: 0.875em;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) h1 em,
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) h2 em,
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) h3 em,
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) h4 em,
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) h5 em,
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) h6 em,
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .s_video_heading_rt em {
  background-image: linear-gradient(94deg, var(--_default-2---swatch--secondary-500) 46%, var(--_default-2---swatch--primary-500) 72%);
  color: var(--_default-2---swatch--transparent);
  background-clip: text;
  -webkit-text-fill-color: var(--_default-2---swatch--transparent);
  -webkit-background-clip: text;
  font-family: StixTwoTextItalic;
  font-weight: 600;
  letter-spacing: -0.05em;
  vertical-align: baseline;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) em::after {
  content: '';
  padding: 0.05ch;
  overflow: visible;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .s_video_heading sup {
 font-size: 2vw !important;
 top: -2.5vw;
}

/* ========================================================================== */
/* V1 Custom Code / Responsive */
/* ========================================================================== */
html:has([data-pattern-version="v1"]) { font-size: 1rem; }

:root:has([data-pattern-version="v1"]) {
  /* Original V1 aliases retained for existing unprefixed utility classes. */
  --d1--font-size: clamp(3.25rem, 3.25rem + ((1vw - 0.48rem) * 3.7109), 7.25rem);
  --d2--font-size: clamp(2.9375rem, 2.9375rem + ((1vw - 0.48rem) * 3.7109), 6.125rem);
  --d3--font-size: clamp(2.6875rem, 2.6875rem + ((1vw - 0.48rem) * 3.7109), 5.25rem);
  --h1--font-size: clamp(2.4375rem, 2.4375rem + ((1vw - 0.48rem) * 3.2812), 4.46875rem);
  --h2--font-size: clamp(2.1875rem, 2.1875rem + ((1vw - 0.48rem) * 2.4805), 3.8125rem);
  --h3--font-size: clamp(2rem, 2rem + ((1vw - 0.48rem) * 0.9912), 3.25rem);
  --h4--font-size: clamp(1.8125rem, 1.8125rem + ((1vw - 0.48rem) * 0.4956), 2.75rem);
  --h5--font-size: clamp(1.65rem, 1.65rem + ((1vw - 0.48rem) * 0.2478), 2.375rem);
  --h6--font-size: clamp(1.5rem, 1.5rem + ((1vw - 0.48rem) * 0.2478), 2rem);
  --text-xxlarge--font-size: clamp(1.5rem, 1.5rem + ((1vw - 0.48rem) * 0.4956), 1.6875rem);
  --text-xlarge--font-size: clamp(1.25rem, 1.25rem + ((1vw - 0.48rem) * 0.4956), 1.375rem);
  --text-large--font-size: clamp(1.1rem, 1.1rem + ((1vw - 0.48rem) * 0.2478), 1.125rem);
  --text-main--font-size: 1rem;
  --text-small--font-size: 0.875rem;
}

/* ========================================================================== */
/* V1 Custom Code / Forms */
/* ========================================================================== */

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) form#mktoForm_510 .mktoForm {
  padding: 0 !important;
  background-color: var(--_default-2---swatch--transparent) !important;
  box-shadow: none !important;
  width: 100% !important;
  max-width: 100% !important;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) form#mktoForm_510 .mktoFormRow {
  display: flex;
  flex-flow: row;
  justify-content: space-between;
  align-items: stretch;
  column-gap: 1rem;
  row-gap: 1rem;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=text] {
  display: flex;
  width: 100% !important;
  min-height: 2.75rem;
  align-items: center;
  border-radius: var(--_default-2---radius--md);
  background-color: var(--_default-2---swatch--gray-1-o05);
  color: var(--theme--text);
  padding: 0rem 1rem !important;
  border: none !important;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=url] {
  display: flex;
  width: 100% !important;
  min-height: 2.75rem;
  align-items: center;
  border-radius: var(--_default-2---radius--md);
  background-color: var(--_default-2---swatch--gray-1-o05);
  color: var(--theme--text);
  padding: 0rem 1rem !important;
  border: none !important;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=email] {
  display: flex;
  width: 100% !important;
  min-height: 2.75rem;
  align-items: center;
  border-radius: var(--_default-2---radius--md);
  background-color: var(--_default-2---swatch--gray-1-o05);
  color: var(--theme--text);
  padding: 0rem 1rem !important;
  border: none !important;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=tel] {
  display: flex;
  width: 100% !important;
  min-height: 2.75rem;
  align-items: center;
  border-radius: var(--_default-2---radius--md);
  background-color: var(--_default-2---swatch--gray-1-o05);
  color: var(--theme--text);
  padding: 0rem 1rem !important;
  border: none !important;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=number] {
  display: flex;
  width: 100% !important;
  min-height: 2.75rem;
  align-items: center;
  border-radius: var(--_default-2---radius--md);
  background-color: var(--_default-2---swatch--gray-1-o05);
  color: var(--theme--text);
  padding: 0rem 1rem !important;
  border: none !important;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=date] {
  display: flex;
  width: 100% !important;
  min-height: 2.75rem;
  align-items: center;
  border-radius: var(--_default-2---radius--md);
  background-color: var(--_default-2---swatch--gray-1-o05);
  color: var(--theme--text);
  padding: 0rem 1rem !important;
  border: none !important;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoField {
  display: flex;
  width: 100% !important;
  min-height: 2.75rem;
  align-items: center;
  border-radius: var(--_default-2---radius--md);
  background-color: var(--_default-2---swatch--gray-1-o05);
  color: var(--theme--text);
  padding: 0rem 1rem !important;
  border: none !important;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm textarea.mktoField {
  align-items: center;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=text]::placeholder {
  color: var(--_default-2---swatch--neutral-400);
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=url]::placeholder {
  color: var(--_default-2---swatch--neutral-400);
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=email]::placeholder {
  color: var(--_default-2---swatch--neutral-400);
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=tel]::placeholder {
  color: var(--_default-2---swatch--neutral-400);
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=number]::placeholder {
  color: var(--_default-2---swatch--neutral-400);
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm input[type=date::placeholder] {
  color: var(--_default-2---swatch--neutral-400);
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoForm select.mktoField::placeholder {
  color: var(--_default-2---swatch--neutral-400);
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoField::placeholder {
  color: var(--_default-2---swatch--neutral-400);
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoFormRow input:not(.footer_wrap *),
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .mktoFormRow select:not(.footer_wrap *) {
  margin-bottom: 1rem !important;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) form#mktoForm_232 .mktoButton {
  position: relative !important;
  display: flex !important;
  padding: 0.6875rem 1.25rem !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0.5rem !important;
  border: none !important;
  border-radius: var(--_default-2---radius--round) !important;
  background-image: linear-gradient(95deg, var(--_default-2---swatch--secondary-500), var(--_default-2---swatch--primary-500)) !important;
  color: var(--_default-2---swatch--white) !important;
  font-weight: var(--_typography---font--primary-medium) !important;
  text-transform: uppercase !important;
  transition: border-color 200ms ease,
    color 200ms ease,
    background-color 200ms ease !important;
}

/* ========================================================================== */
/* V1 Custom Code / Custom */
/* ========================================================================== */
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .jetboost-hidden {
display: inline-block;
opacity: 0.25;
visibility: visible !important;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) #toc li {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}

/* ========================================================================== */
/* V1 Custom Code / Navigation */
/* ========================================================================== */
:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .navbar_sub_item {
  opacity: 0.85;
  transition: opacity 0.3s ease;
}

:where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .navbar_sub_item:hover {
  opacity: 1;
}

@media screen and (min-width: 992px) {
  :where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .navbar_sub_name::after {
    content: '';
    display: inline-block;
    width: 12.357px;
    height: 15.717px;
    margin-left: 8px;
    background-image: url("https://assets.pattern.com/KUXxoJrlY8Qc6WvLikoOB");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    transition: background-image 0.3s ease;
  }
  
  :where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .navbar_sub_item:hover .navbar_sub_name::after {
    background-image: url("https://assets.pattern.com/ZLBslvLJTu4S5aZhEB43L");
  }
}

@media screen and (max-width: 991px) {
  :where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .navbar_sub_name::after {
    content: '';
    display: inline-block;
    width: 12.357px;
    height: 15.717px;
    margin-left: 8px;
    margin-bottom: 4px;
    background-image: url("https://assets.pattern.com/KUXxoJrlY8Qc6WvLikoOB");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    transition: background-image 0.3s ease;
  }
  
  :where(body:is([data-pattern-version="v1"], :has([data-pattern-version="v1"]))) .navbar_sub_item:hover .navbar_sub_name::after {
    background-image: url("https://assets.pattern.com/ZLBslvLJTu4S5aZhEB43L");
  }
}

/* ==========================================================================
   V1 production-fidelity boundary
   Keeps V1 page geometry and tokens stable while V2/V3 use the -2 defaults.
   Apply the cc-v1 combo class to the V1 page's .page_main element.
   ========================================================================== */
.page_main.cc-v1 {
  --site--column-count: 12;
  --site--width: 111rem;
  --site--margin: clamp(1.5rem, 0.3857142857rem + 4.5714285714vw, 4.5rem);
  --site--gutter: 1.5rem;
  --site--width-inner: calc(var(--site--width) - (var(--site--margin) * 2));
  --site--gutter-total: calc(var(--site--gutter) * (var(--site--column-count) - 1));
  --site--grid-width: min(var(--site--width-inner), calc(100vw - (var(--site--margin) * 2)));
  --column-width: calc((var(--site--grid-width) - var(--site--gutter-total)) / var(--site--column-count) + var(--site--gutter));
  --container--full: calc(100vw - (var(--site--margin) * 2));
  --container--small: calc(var(--column-width) * (var(--site--column-count) - 2) - var(--site--gutter));
  --container--main: calc(var(--column-width) * var(--site--column-count) - var(--site--gutter));
  --container--main-old: var(--container--main);

  --column-width--1: calc(var(--column-width) * 1 - var(--site--gutter));
  --column-width--2: calc(var(--column-width) * 2 - var(--site--gutter));
  --column-width--3: calc(var(--column-width) * 3 - var(--site--gutter));
  --column-width--4: calc(var(--column-width) * 4 - var(--site--gutter));
  --column-width--5: calc(var(--column-width) * 5 - var(--site--gutter));
  --column-width--6: calc(var(--column-width) * 6 - var(--site--gutter));
  --column-width--7: calc(var(--column-width) * 7 - var(--site--gutter));
  --column-width--8: calc(var(--column-width) * 8 - var(--site--gutter));
  --column-width--9: calc(var(--column-width) * 9 - var(--site--gutter));
  --column-width--10: calc(var(--column-width) * 10 - var(--site--gutter));
  --column-width--11: calc(var(--column-width) * 11 - var(--site--gutter));
  --column-width--12: calc(var(--column-width) * 12 - var(--site--gutter));
  --column-margin--1: calc(var(--column-width) * 1);
  --column-margin--2: calc(var(--column-width) * 2);
  --column-margin--3: calc(var(--column-width) * 3);
  --column-margin--4: calc(var(--column-width) * 4);
  --column-margin--5: calc(var(--column-width) * 5);
  --column-margin--6: calc(var(--column-width) * 6);
  --column-margin--7: calc(var(--column-width) * 7);
  --column-margin--8: calc(var(--column-width) * 8);
  --column-margin--9: calc(var(--column-width) * 9);
  --column-margin--10: calc(var(--column-width) * 10);
  --column-margin--11: calc(var(--column-width) * 11);
  --column-margin--12: calc(var(--column-width) * 12);

  --breakout-start: [full-start] minmax(0, 1fr) [content-start];
  --breakout-end: [content-end] minmax(0, 1fr) [full-end];
  --grid-breakout: var(--breakout-start) repeat(var(--site--column-count), minmax(0, calc((var(--site--grid-width) - var(--site--gutter-total)) / var(--site--column-count)))) var(--breakout-end);
  --grid-main: repeat(var(--site--column-count), minmax(0, 1fr));

  --d1--font-size: clamp(3.25rem, 1.7642857143rem + 6.0952380952vw, 7.25rem);
  --d2--font-size: clamp(2.9375rem, 1.7535714286rem + 4.8571428571vw, 6.125rem);
  --d3--font-size: clamp(2.6875rem, 1.7357142857rem + 3.9047619048vw, 5.25rem);
  --h1--font-size: clamp(2.4375rem, 1.6830357143rem + 3.0952380952vw, 4.46875rem);
  --h2--font-size: clamp(2.1875rem, 1.5839285714rem + 2.4761904762vw, 3.8125rem);
  --h3--font-size: clamp(2rem, 1.5357142857rem + 1.9047619048vw, 3.25rem);
  --h4--font-size: clamp(1.8125rem, 1.4642857143rem + 1.4285714286vw, 2.75rem);
  --h5--font-size: clamp(1.65rem, 1.3807142857rem + 1.1047619048vw, 2.375rem);
  --h6--font-size: clamp(1.5rem, 1.3142857143rem + 0.7619047619vw, 2rem);
  --text-xxlarge--font-size: clamp(1.5rem, 1.4303571429rem + 0.2857142857vw, 1.6875rem);
  --text-xlarge--font-size: clamp(1.25rem, 1.2035714286rem + 0.1904761905vw, 1.375rem);
  --text-large--font-size: clamp(1.1rem, 1.0907142857rem + 0.0380952381vw, 1.125rem);
  --text-main--font-size: 1rem;
  --text-small--font-size: 0.875rem;

  --type-size--d1: var(--d1--font-size);
  --type-size--d2: var(--d2--font-size);
  --type-size--d3: var(--d3--font-size);
  --type-size--h1: var(--h1--font-size);
  --type-size--h2: var(--h2--font-size);
  --type-size--h3: var(--h3--font-size);
  --type-size--h4: var(--h4--font-size);
  --type-size--h5: var(--h5--font-size);
  --type-size--h6: var(--h6--font-size);
  --type-size--text-xxlarge: var(--text-xxlarge--font-size);
  --type-size--text-xlarge: var(--text-xlarge--font-size);
  --type-size--text-large: var(--text-large--font-size);
  --type-size--text-main: var(--text-main--font-size);
  --type-size--text-small: var(--text-small--font-size);
  --type-size--overline-large: 1rem;
  --type-size--oevrline-main: 0.875rem;
  --type-size--overline-small: 0.75rem;
  --_buttons---button--font-size: clamp(0.8125rem, 0.7892857143rem + 0.0952380952vw, 0.875rem);

}

.page_main.cc-v1 :is(h1, h2, h3, h4, h5, h6, p, [class*="u-text-style-"])::before,
.page_main.cc-v1 :is(h1, h2, h3, h4, h5, h6, p, [class*="u-text-style-"])::after {
  content: none !important;
  display: none !important;
  margin: 0 !important;
}

.page_main.cc-v1,
.page_main.cc-v1 [data-theme="light"],
.page_main.cc-v1 [data-theme="dark"] [data-theme="invert"] {
  --theme--background: color-mix(in srgb, var(--_default-2---swatch--white) 96%, var(--_default-2---swatch--neutral-900));
  --theme--text: var(--_default-2---swatch--neutral-900);
  --theme--border: var(--_default-2---swatch--neutral-900);
  --theme--n1: var(--_default-2---swatch--neutral-900);
  --theme--n2: var(--_default-2---swatch--neutral-500);
  --theme--n3: color-mix(in srgb, var(--_default-2---swatch--white) 96%, var(--_default-2---swatch--neutral-900));
  --theme--t1: var(--_default-2---swatch--gray-1-o05);
  --theme--t2: color-mix(in srgb, var(--_default-2---swatch--neutral-900) 12%, var(--_default-2---swatch--transparent));
  --theme--t3: color-mix(in srgb, var(--_default-2---swatch--neutral-900) 40%, var(--_default-2---swatch--transparent));
}

.page_main.cc-v1 [data-theme="dark"],
.page_main.cc-v1 [data-theme="invert"],
.page_main.cc-v1 [data-theme="light"] [data-theme="invert"] {
  --theme--background: var(--_default-2---swatch--neutral-900);
  --theme--text: color-mix(in srgb, var(--_default-2---swatch--white) 96%, var(--_default-2---swatch--neutral-900));
  --theme--border: color-mix(in srgb, var(--_default-2---swatch--white) 96%, var(--_default-2---swatch--neutral-900));
  --theme--n1: color-mix(in srgb, var(--_default-2---swatch--white) 96%, var(--_default-2---swatch--neutral-900));
  --theme--n2: color-mix(in srgb, var(--_default-2---swatch--neutral-700) 35%, var(--_default-2---swatch--white));
  --theme--n3: var(--_default-2---swatch--neutral-900);
  --theme--t1: color-mix(in srgb, var(--_default-2---swatch--white) 5%, var(--_default-2---swatch--transparent));
  --theme--t2: color-mix(in srgb, var(--_default-2---swatch--white) 12%, var(--_default-2---swatch--transparent));
  --theme--t3: color-mix(in srgb, var(--_default-2---swatch--white) 40%, var(--_default-2---swatch--transparent));
}