@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-BoldItalic.ttf') format("truetype"), url('../fonts/GeistMono-ExtraBoldItalic.ttf') format("truetype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-Italic.ttf') format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-BlackItalic.ttf') format("truetype");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-Black.ttf') format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-Bold.ttf') format("truetype"), url('../fonts/GeistMono-ExtraBold.ttf') format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-ExtraLight.ttf') format("truetype");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-LightItalic.ttf') format("truetype");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-Medium.ttf') format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-Light.ttf') format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-Regular.ttf') format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-SemiBoldItalic.ttf') format("truetype");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-ThinItalic.ttf') format("truetype");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-SemiBold.ttf') format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-Thin.ttf') format("truetype");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-MediumItalic.ttf') format("truetype");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Geistmono;
  src: url('../fonts/GeistMono-ExtraLightItalic.ttf') format("truetype");
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-Thin.otf') format("opentype");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-Extralight.otf') format("opentype");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-BoldItalic.otf') format("opentype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-Regular.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-LightItalic.otf') format("opentype");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial Book;
  src: url('../fonts/MesoTRIAL-Book.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-BlackItalic.otf') format("opentype");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-Light.otf') format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-Medium.otf') format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-ExtralightItalic.otf') format("opentype");
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-BookItalic.otf') format("opentype"), url('../fonts/MesoTRIAL-RegularItalic.otf') format("opentype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-Bold.otf') format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-Black.otf') format("opentype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-MediumItalic.otf') format("opentype");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Mesotrial;
  src: url('../fonts/MesoTRIAL-ThinItalic.otf') format("opentype");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Laygrotesk;
  src: url('../fonts/LayGrotesk-Black.otf') format("opentype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Laygrotesk;
  src: url('../fonts/LayGrotesk-Bold.otf') format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Laygrotesk;
  src: url('../fonts/LayGrotesk-Semibold.otf') format("opentype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Laygrotesk;
  src: url('../fonts/LayGrotesk-Regular.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Laygrotesk;
  src: url('../fonts/LayGrotesk-Medium.otf') format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  --_site-variables---primary-family: Laygrotesk, Georgia, sans-serif;
  --site--margin-clamp\<deleted\|variable-ececf7df-7e76-f4c1-78ff-9947ba0b30ab\>: clamp(1.11vw, var(--site--margin-calc\<deleted\|variable-079909d7-9f30-905f-0abc-cd968a12a94b\>), 100vw);
  --site--margin-2\<deleted\|variable-06c56dcb-6f8d-2408-2a44-a0d75478a54c\>: 80px;
  --_site-variables---design-gap: 16px;
  --_site-variables---design-gap-tablet: 8px;
  --_site-variables---design-gap-mobile: 8px;
  --_site-variables---container-max: 1840px;
  --_site-variables---margin: 40px;
  --_site-variables---margin-tablet: 20px;
  --_site-variables---margin-mobile: 20px;
  --_mobile-text---normal\<deleted\|variable-111c9139-cf64-304f-8a6a-532305ef941c\>: 16px;
  --_desktop-text---normal1\<deleted\|variable-f6cf99c3-8fd7-8ce6-20dc-fb258a1cdadd\>: 16px;
  --_mobile-text---small\<deleted\|variable-a206a2dc-ba14-db48-ac5b-2ce26260d965\>: 16px;
  --_desktop-text---small1\<deleted\|variable-158def58-9ddf-ae04-e3fa-8027b6aaf98d\>: calc(16 / var(--_site-variables---design-width) * 100vw);
  --text--normal\<deleted\|variable-40bf5af2-ab12-9dec-eec5-3eea506b7fb7\>: 1vw;
  --_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>: 1rem;
  --_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>: var(--_line-height---normal\<deleted\|variable-c9aadd2c-63fe-5c48-b565-1e7fe9eb9df4\>);
  --_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>: var(--_letter-spacing---normal\<deleted\|variable-09aa6f3d-0d8b-585a-71f5-a9cd6ca76fea\>);
  --_site-variables---columns: 12;
  --_site-variables---columns-tablet: 8;
  --_site-variables---columns-mobile: 6;
  --_radios---btn-y-padding: 0px;
  --_radios---btn-x-padding: 0px;
  --_radios---border: white;
  --_radios---btn-radius: 0px;
  --_radios---bg: #fff;
  --_radios---text: white;
  --_mobile-text---h1: 46;
  --_desktop-text---h1: 160;
  --_site-variables---design-width: 1920;
  --_colors---1: #d37dc8;
  --_colors---2: darkgrey;
  --_colors---3: white;
  --_colors---4: black;
  --_colors---8: #dafa9c;
  --_site-variables---desktop-radius: .25rem;
  --_form---field-border-width: 2px;
  --_form---field-border-color: #2a00ff;
  --_form---field-border-radius: .5rem;
  --_form---focus-border: #dee434;
  --_form---focus-border-width: 0px;
  --_site-variables---margin-clamp: 40px;
  --_site-variables---margin-value: 40;
  --_site-variables---margin-tablet-value: 20;
  --_site-variables---margin-mobile-value: 20;
  --_site-variables---design-gap-value: 16;
  --_site-variables---design-gap-tablet-value: 8;
  --_site-variables---design-gap-mobile-value: 8;
  --_site-variables---column-width: calc((100% - (var(--_site-variables---design-gap) * (var(--_site-variables---columns)  - 1))) / var(--_site-variables---columns));
  --_site-variables---secondary-family: Mesotrial, Verdana, sans-serif;
  --_site-variables---tertiary-family: Geistmono, Arial, sans-serif;
  --_site-variables---selection-bg: var(--_colors---1);
  --_site-variables---selection-text: var(--_colors---3);
  --_site-variables---grid-width: calc(100vw - (var(--_site-variables---margin-calc\<deleted\|variable-3c20873c-b49c-fadb-ff47-2611d6b1ded5\>) * 2));
  --_colors---5: #f7f7f7;
  --_mobile-text---h2: 48;
  --_colors---6: #111;
  --_mobile-text---h3: 40;
  --_colors---7: #737776;
  --_mobile-text---h4: 32;
  --_mobile-text---h5: 28;
  --_mobile-text---h6: 28;
  --_mobile-text---h7: 22;
  --_site-variables---margin-calc: calc(var(--_site-variables---margin-value) / var(--_site-variables---design-width) * 100vw);
  --_mobile-text---h8: 20;
  --_mobile-text---h9: 22;
  --_mobile-text---h10: 18;
  --_mobile-text---xlarge: 16;
  --_mobile-text---large: 18;
  --_mobile-text---normal: 16;
  --_site-variables---mobile-radius: .75rem;
  --_mobile-text---small: 12;
  --_mobile-text---xsmall: 12;
  --_mobile-text---eyebrow: 14;
  --_mobile-text---button: 16;
  --_desktop-text---h2: 120;
  --_desktop-text---h3: 96;
  --_desktop-text---h4: 72;
  --_desktop-text---h5: 40;
  --_desktop-text---h6: 56;
  --_desktop-text---h7: 30;
  --_desktop-text---h8: 25;
  --_desktop-text---h9: 32;
  --_desktop-text---h10: 24;
  --_desktop-text---xlarge: 20;
  --_desktop-text---large: 18;
  --_desktop-text---normal: 16;
  --_desktop-text---small: 14;
  --_desktop-text---xsmall: 12;
  --_desktop-text---eyebrow: 14;
  --_desktop-text---button: 16;
  --site--margin-calc\<deleted\|variable-079909d7-9f30-905f-0abc-cd968a12a94b\>: calc(var(--site--margin\<deleted\|variable-fe9c9eb0-4c9d-648e-6f26-7c7941b95b5e\>) / 1440 * 100vw);
  --text--h1\<deleted\|variable-c0b499c6-4f19-9cd1-9334-bdaf748d8a55\>: 12vw;
  --text--h2\<deleted\|variable-74a869e5-a3ee-acba-b789-2688a16fa686\>: 10vw;
  --text--h3\<deleted\|variable-211224de-90b3-0f0c-b160-bc0e783fd0bd\>: 8vw;
  --text--h4\<deleted\|variable-68be3d39-4097-a75e-09d4-8f6aec933214\>: 6vw;
  --text--h5\<deleted\|variable-d0be7f7d-cea3-4b7f-4757-50c566182bba\>: 4vw;
  --text--h6\<deleted\|variable-37cad83d-2206-f769-bfc3-b56dc16c2930\>: 3vw;
  --text--h7\<deleted\|variable-1a8811e2-c23a-49b3-58eb-d0e5db6454c9\>: 2vw;
  --_line-height---normal\<deleted\|variable-c9aadd2c-63fe-5c48-b565-1e7fe9eb9df4\>: 1;
  --_letter-spacing---normal\<deleted\|variable-09aa6f3d-0d8b-585a-71f5-a9cd6ca76fea\>: 0em;
  --_colors---off-white\<deleted\|variable-26c7a79c-12c4-eb97-61ad-f1c6fbe3eb76\>: #f4f3ef;
  --_site-variables---margin-calc\<deleted\|variable-3c20873c-b49c-fadb-ff47-2611d6b1ded5\>: 0px;
  --site--margin\<deleted\|variable-fe9c9eb0-4c9d-648e-6f26-7c7941b95b5e\>: 50;
}

body {
  font-family: var(--_site-variables---primary-family);
  color: #000;
  font-size: 16px;
  line-height: 1;
}

h1 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 38px;
  font-weight: 700;
  line-height: 1;
}

a {
  color: #000;
  -webkit-text-decoration: none;
  text-decoration: none;
}

a:lang(en) {
  color: #fff;
}

label {
  font-weight: 700;
  display: block;
}

.layout {
  border: 1px solid #4f6ef7;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  position: relative;
}

.guide-wrap {
  z-index: 2000;
  pointer-events: none;
  display: block;
  position: fixed;
  inset: 0% 0% auto;
  overflow: hidden;
}

.guide-contain {
  margin-left: auto;
  margin-right: auto;
}

.guide-contain.container {
  width: calc(100% - var(--site--margin-clamp\<deleted\|variable-ececf7df-7e76-f4c1-78ff-9947ba0b30ab\>) * 2);
}

.guide-layout.u-grid-custom {
  z-index: 999;
  grid-column-gap: var(--_site-variables---design-gap);
  grid-row-gap: var(--_site-variables---design-gap);
  grid-template-rows: auto;
  grid-auto-columns: minmax(0, 1fr);
  grid-template-columns: var(--grid-main);
  display: grid;
  position: relative;
}

.guide-column {
  z-index: 9999;
  color: #8a8a8a;
  background-color: #9292920f;
  justify-content: center;
  align-items: flex-end;
  height: 100vh;
  padding-top: .6rem;
  padding-bottom: .6rem;
  display: flex;
  position: relative;
}

.container {
  z-index: 1;
  max-width: var(--_site-variables---container-max);
  width: calc(100% - var(--_site-variables---margin) * 2);
  margin-left: auto;
  margin-right: auto;
  position: relative;
  container-type: inline-size;
}

.heading.radio-text {
  z-index: 6;
  text-transform: uppercase;
  font-weight: 700;
  font-size: clamp(var(--_mobile-text---normal\<deleted\|variable-111c9139-cf64-304f-8a6a-532305ef941c\>), var(--_desktop-text---normal1\<deleted\|variable-f6cf99c3-8fd7-8ce6-20dc-fb258a1cdadd\>), var(--_desktop-text---normal1\<deleted\|variable-f6cf99c3-8fd7-8ce6-20dc-fb258a1cdadd\>));
}

.heading.eyebrow-3 {
  text-transform: uppercase;
  font-weight: 700;
  font-size: clamp(var(--_mobile-text---normal\<deleted\|variable-111c9139-cf64-304f-8a6a-532305ef941c\>), var(--_desktop-text---normal1\<deleted\|variable-f6cf99c3-8fd7-8ce6-20dc-fb258a1cdadd\>), var(--_desktop-text---normal1\<deleted\|variable-f6cf99c3-8fd7-8ce6-20dc-fb258a1cdadd\>));
}

.heading.text-small {
  font-size: clamp(var(--_mobile-text---small\<deleted\|variable-a206a2dc-ba14-db48-ac5b-2ce26260d965\>), var(--_desktop-text---small1\<deleted\|variable-158def58-9ddf-ae04-e3fa-8027b6aaf98d\>), var(--_desktop-text---small1\<deleted\|variable-158def58-9ddf-ae04-e3fa-8027b6aaf98d\>));
}

.rich-text {
  color: #363534;
  font-size: clamp(1rem, var(--text--normal\<deleted\|variable-40bf5af2-ab12-9dec-eec5-3eea506b7fb7\>), 100vw);
}

.rich-text h1 {
  font-size: var(--_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>);
  line-height: var(--_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>);
  letter-spacing: var(--_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>);
  --_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>: var(--text--h1\<deleted\|variable-c0b499c6-4f19-9cd1-9334-bdaf748d8a55\>);
  --_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>: var(--_line-height---normal\<deleted\|variable-c9aadd2c-63fe-5c48-b565-1e7fe9eb9df4\>);
  --_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>: var(--_letter-spacing---normal\<deleted\|variable-09aa6f3d-0d8b-585a-71f5-a9cd6ca76fea\>);
  font-weight: 400;
}

.rich-text h2 {
  font-size: var(--_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>);
  line-height: var(--_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>);
  letter-spacing: var(--_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>);
  --_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>: var(--text--h2\<deleted\|variable-74a869e5-a3ee-acba-b789-2688a16fa686\>);
  --_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>: var(--_line-height---normal\<deleted\|variable-c9aadd2c-63fe-5c48-b565-1e7fe9eb9df4\>);
  --_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>: var(--_letter-spacing---normal\<deleted\|variable-09aa6f3d-0d8b-585a-71f5-a9cd6ca76fea\>);
}

.rich-text h3 {
  font-size: var(--_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>);
  line-height: var(--_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>);
  letter-spacing: var(--_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>);
  --_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>: var(--text--h3\<deleted\|variable-211224de-90b3-0f0c-b160-bc0e783fd0bd\>);
  --_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>: var(--_line-height---normal\<deleted\|variable-c9aadd2c-63fe-5c48-b565-1e7fe9eb9df4\>);
  --_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>: var(--_letter-spacing---normal\<deleted\|variable-09aa6f3d-0d8b-585a-71f5-a9cd6ca76fea\>);
}

.rich-text h4 {
  font-size: var(--_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>);
  line-height: var(--_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>);
  letter-spacing: var(--_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>);
  --_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>: var(--text--h4\<deleted\|variable-68be3d39-4097-a75e-09d4-8f6aec933214\>);
  --_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>: var(--_line-height---normal\<deleted\|variable-c9aadd2c-63fe-5c48-b565-1e7fe9eb9df4\>);
  --_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>: var(--_letter-spacing---normal\<deleted\|variable-09aa6f3d-0d8b-585a-71f5-a9cd6ca76fea\>);
}

.rich-text h5 {
  font-size: var(--_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>);
  line-height: var(--_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>);
  letter-spacing: var(--_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>);
  --_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>: var(--text--h5\<deleted\|variable-d0be7f7d-cea3-4b7f-4757-50c566182bba\>);
  --_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>: var(--_line-height---normal\<deleted\|variable-c9aadd2c-63fe-5c48-b565-1e7fe9eb9df4\>);
  --_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>: var(--_letter-spacing---normal\<deleted\|variable-09aa6f3d-0d8b-585a-71f5-a9cd6ca76fea\>);
}

.rich-text h6 {
  font-size: var(--_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>);
  line-height: var(--_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>);
  letter-spacing: var(--_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>);
  --_headings---size\<deleted\|variable-f524dc3e-8761-f457-d2ff-338fce20e165\>: var(--text--h6\<deleted\|variable-37cad83d-2206-f769-bfc3-b56dc16c2930\>);
  --_headings---line-height\<deleted\|variable-8495ed87-1838-24f5-f771-c6de00d78090\>: var(--_line-height---normal\<deleted\|variable-c9aadd2c-63fe-5c48-b565-1e7fe9eb9df4\>);
  --_headings---letter-spacing\<deleted\|variable-c6f0387f-41e1-3c3b-7c18-694ba75993eb\>: var(--_letter-spacing---normal\<deleted\|variable-09aa6f3d-0d8b-585a-71f5-a9cd6ca76fea\>);
}

.display-none, .global-combo {
  display: none;
}

.display-desktop {
  display: block;
}

.display-tablet, .display-mobile {
  display: none;
}

.absolute-cover {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.absolute-cover.align-center {
  justify-content: center;
  align-items: center;
  display: flex;
}

.paragraph {
  font-size: clamp(1rem, var(--text--normal\<deleted\|variable-40bf5af2-ab12-9dec-eec5-3eea506b7fb7\>), 100vw);
}

.page-wrap {
  flex-flow: column;
  min-height: 100svh;
  display: flex;
  overflow: clip;
}

.page-main {
  flex-flow: column;
  flex: 1;
  display: flex;
  position: relative;
}

.section {
  z-index: 2;
  border: 1px solid #f59e0b;
  position: relative;
}

.grid {
  grid-column-gap: var(--_site-variables---design-gap);
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-auto-columns: minmax(0, 1fr);
  grid-template-columns: repeat(var(--_site-variables---columns), minmax(0px, 1fr));
  border: 1px solid #8b5cf6;
  display: grid;
}

.full-screen {
  width: 100vw;
  height: 100vh;
}

.full-cover {
  width: 100%;
  height: 100%;
}

.flex {
  border: 1px solid #34d399;
}

.spacer {
  height: 100vh;
}

.full-height {
  height: 100%;
}

.ratio {
  z-index: 1;
  background-color: #eee;
  width: 100%;
  padding-left: 1em;
  padding-right: 1em;
  position: relative;
}

.gap-none {
  gap: 0;
}

.full-width {
  width: 100%;
}

.size-shrink {
  flex-shrink: 0;
}

.position-relative {
  position: relative;
}

.box-sizing {
  box-sizing: content-box;
}

.position-fixed {
  position: fixed;
  inset: 0%;
}

.pointer-events-none {
  pointer-events: none;
}

.radio_label {
  grid-column-gap: .7vw;
  grid-row-gap: .7vw;
  --_radios---btn-y-padding: 0px;
  --_radios---btn-x-padding: 0px;
  --_radios---border: #3d3219;
  --_radios---btn-radius: 0px;
  --_radios---bg: #f5bc01;
  --_radios---text: #775506;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  position: relative;
}

.radio_label:where(.w-variant-524bd629-f679-2787-d954-2bbb5e0d47a8) {
  --_radios---btn-y-padding: 0px;
  --_radios---btn-x-padding: 0px;
  --_radios---border: #531111;
  --_radios---btn-radius: 0px;
  --_radios---bg: #ac4f4f;
  --_radios---text: #531111;
  transform: translate(0);
}

.radio_label:where(.w-variant-56ad8fb4-103a-edb5-907e-c2eca24e0aae) {
  padding: var(--_radios---btn-y-padding) var(--_radios---btn-x-padding);
  border: 1px solid var(--_radios---border);
  border-radius: var(--_radios---btn-radius);
  background-color: var(--_radios---bg);
  --_radios---btn-y-padding: clamp(calc(24 / var(--_site-variables---design-width) * 100vw), calc(24 / var(--_site-variables---design-width) * 100vw), calc(20 / var(--_site-variables---design-width) * 100vw));
  --_radios---btn-x-padding: clamp(calc(24 / var(--_site-variables---design-width) * 100vw), calc(24 / var(--_site-variables---design-width) * 100vw), calc(20 / var(--_site-variables---design-width) * 100vw));
  --_radios---border: #0000000d;
  --_radios---btn-radius: .5rem;
  --_radios---bg: #53505005;
  --_radios---text: var(--_colors---2);
  justify-content: space-between;
  align-items: flex-start;
}

.radio_label:where(.w-variant-ee6b99cb-9e59-90d9-160d-f0fbd64ac09d) {
  --_radios---btn-y-padding: 0px;
  --_radios---btn-x-padding: 0px;
  --_radios---border: #d2f040;
  --_radios---btn-radius: 0px;
  --_radios---bg: #1b1b1b;
  --_radios---text: #fff;
}

.radio_label:where(.w-variant-e3dd562d-ebef-cb96-a6aa-78fc6997a1f8) {
  --_radios---btn-y-padding: 0px;
  --_radios---btn-x-padding: 0px;
  --_radios---border: var(--_colors---off-white\<deleted\|variable-26c7a79c-12c4-eb97-61ad-f1c6fbe3eb76\>);
  --_radios---btn-radius: 0px;
  --_radios---bg: var(--_colors---off-white\<deleted\|variable-26c7a79c-12c4-eb97-61ad-f1c6fbe3eb76\>);
  --_radios---text: black;
  border-radius: .5rem;
  justify-content: center;
  align-items: center;
  padding: 1.25rem 1.5rem;
  overflow: hidden;
}

.radio_label.checkbox {
  --_radios---btn-y-padding: 0px;
  --_radios---btn-x-padding: 0px;
  --_radios---border: #d2f040;
  --_radios---btn-radius: 0px;
  --_radios---bg: #1b1b1b;
  --_radios---text: #fff;
  justify-content: flex-start;
  align-items: flex-start;
}

.radio_input {
  z-index: 2;
  cursor: pointer;
  appearance: none;
  position: absolute;
  inset: 0%;
}

.radio_circle_wrap {
  aspect-ratio: 1;
  border: .125rem solid var(--_radios---border);
  background-color: var(--_radios---bg);
  width: 1.5vw;
  color: var(--_radios---text);
  border-radius: 100vw;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: flex;
}

.radio_circle_wrap:where(.w-variant-524bd629-f679-2787-d954-2bbb5e0d47a8) {
  aspect-ratio: 7 / 4;
  width: 3vw;
  padding: .1vw;
}

.radio_circle_wrap:where(.w-variant-ee6b99cb-9e59-90d9-160d-f0fbd64ac09d) {
  border-radius: .5vw;
}

.radio_circle_wrap:where(.w-variant-56ad8fb4-103a-edb5-907e-c2eca24e0aae) {
  background-color: var(--_radios---bg);
  border-width: 1px;
  border-radius: 2px;
  width: .75rem;
  transition: all .2s;
}

.radio_circle_wrap:where(.w-variant-e3dd562d-ebef-cb96-a6aa-78fc6997a1f8) {
  aspect-ratio: auto;
  --_radios---btn-y-padding: 0px;
  --_radios---btn-x-padding: 0px;
  --_radios---border: var(--_colors---off-white\<deleted\|variable-26c7a79c-12c4-eb97-61ad-f1c6fbe3eb76\>);
  --_radios---btn-radius: 0px;
  --_radios---bg: var(--_colors---off-white\<deleted\|variable-26c7a79c-12c4-eb97-61ad-f1c6fbe3eb76\>);
  --_radios---text: black;
  border-style: none;
  border-radius: 0;
  width: 100%;
  position: absolute;
  inset: 0%;
}

.radio_circle_wrap.checkbox-3 {
  border-radius: 4px;
  width: 1.3rem;
  margin-top: .2rem;
}

.radio_circle_inner {
  opacity: 0;
  background-color: currentColor;
  border-radius: 100vw;
  width: 70%;
  height: 70%;
  padding: 0;
  transition-property: all;
  transition-duration: .2s;
  transition-timing-function: ease;
}

.radio_circle_inner:where(.w-variant-524bd629-f679-2787-d954-2bbb5e0d47a8) {
  width: 65%;
  height: 100%;
  transform: translate(-22%);
}

.radio_circle_inner:where(.w-variant-ee6b99cb-9e59-90d9-160d-f0fbd64ac09d) {
  background-color: #0000;
}

.radio_circle_inner:where(.w-variant-56ad8fb4-103a-edb5-907e-c2eca24e0aae) {
  color: var(--_radios---bg);
  background-color: #0000;
}

.radio_circle_inner:where(.w-variant-e3dd562d-ebef-cb96-a6aa-78fc6997a1f8) {
  background-color: var(--_radios---bg);
  border-radius: 0;
  width: 100%;
  height: 100%;
}

.radio_circle_inner.checkbox-4 {
  background-color: #0000;
}

.radio_text:where(.w-variant-e3dd562d-ebef-cb96-a6aa-78fc6997a1f8) {
  z-index: 10;
  color: currentColor;
  position: relative;
}

.radio_check {
  display: none;
}

.radio_check:where(.w-variant-ee6b99cb-9e59-90d9-160d-f0fbd64ac09d) {
  transition: all .2s;
  display: block;
}

.radio_check:where(.w-variant-56ad8fb4-103a-edb5-907e-c2eca24e0aae) {
  display: block;
}

.radio_check.checkbox-5 {
  transition: all .2s;
  display: block;
}

.overflow-hidden {
  overflow: clip;
}

.h-line {
  background-color: #fff;
  width: 100%;
  padding-top: 1px;
}

.link {
  cursor: pointer;
  color: inherit;
  text-decoration: none;
}

.cursor-pointer {
  cursor: pointer;
}

.no-shrink {
  flex: none;
}

.dev-flex {
  display: flex;
}

.auto-width {
  width: auto;
}

.pointer-events {
  pointer-events: auto;
}

.absolute-contain {
  object-fit: contain;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.trackinner {
  z-index: 1;
  background-color: #827127;
  border-radius: 40px;
  width: 0%;
  height: 100%;
  position: relative;
}

.fullscreen {
  display: flex;
}

.button_close_wrap {
  cursor: pointer;
  border-radius: 100vw;
  display: inline-block;
  position: relative;
}

.overflow-visible {
  overflow: visible;
}

.text:where(.w-variant-91ae0d4b-c22a-9c24-e714-15c703231902) {
  font-size: clamp(calc(var(--_mobile-text---h1) * 1rem / 16), calc(var(--_mobile-text---h1) * 1rem / 16 + (var(--_desktop-text---h1)  - var(--_mobile-text---h1)) * ((100vw - 767px) / (var(--_site-variables---design-width)  - 767))), calc(var(--_desktop-text---h1) * 1rem / 16));
}

.logo {
  position: relative;
}

.button1 {
  cursor: pointer;
  border-style: solid;
  border-width: 1px;
  border-radius: .25rem;
  transition: all .3s;
  display: inline-block;
  position: relative;
}

.button1._1 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---1);
  background-color: #0f003a;
}

.button1._1:hover {
  background-color: #cbf;
}

.button1._2 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---2);
}

.button1._2:hover {
  border-color: var(--_colors---3);
  color: var(--_colors---1);
}

.button1._3 {
  background-color: var(--_colors---1);
  color: #fff;
  border: 1px solid #fff;
}

.button1._3:hover {
  border-color: var(--_colors---1);
  color: var(--_colors---1);
  background-color: #fff;
}

.margin-auto {
  margin-left: auto;
  margin-right: auto;
}

.border-text {
  position: absolute;
  inset: 0% 0% auto;
  transform: translate(0, -6px);
}

.inline-block {
  display: inline-block;
}

.form-field {
  background-color: #f7f7f7;
  border-radius: 4px;
  font-weight: 400;
}

.form-field.normal {
  display: block;
}

.form-field.normal:where(.w-variant-140caf3f-bbea-145a-341d-2f9fe112045d), .form-field.message {
  display: none;
}

.form-field.message:where(.w-variant-140caf3f-bbea-145a-341d-2f9fe112045d) {
  display: block;
}

.inline-flex {
  display: inline-flex;
}

.height-screen {
  height: 100vh;
}

.cart-wrap {
  -webkit-backdrop-filter: blur(40px);
  backdrop-filter: blur(40px);
  background-color: #ffffff03;
}

.path:where(.w-variant-56ad8fb4-103a-edb5-907e-c2eca24e0aae) {
  color: var(--_colors---4);
}

.form-sticky {
  position: sticky;
  top: 0;
}

.field-wrap-name-height {
  height: 1.5rem;
}

.button-text {
  z-index: 1;
  white-space: nowrap;
  position: relative;
}

.button-submit {
  cursor: pointer;
  border-style: solid;
  border-width: 1px;
  border-radius: .25rem;
  transition: all .3s;
  display: inline-block;
  position: relative;
}

.button-submit._1 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---1);
  background-color: #0f003a;
}

.button-submit._1:hover {
  background-color: #cbf;
}

.button-submit._2 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---2);
}

.button-submit._2:hover {
  border-color: var(--_colors---3);
  color: var(--_colors---1);
}

.button-submit._3 {
  background-color: var(--_colors---1);
  color: #fff;
  border: 1px solid #fff;
}

.button-submit._3:hover {
  border-color: var(--_colors---1);
  color: var(--_colors---1);
  background-color: #fff;
}

.button3 {
  cursor: pointer;
  border-style: solid;
  border-width: 1px;
  border-radius: .25rem;
  transition: all .3s;
  display: inline-block;
  position: relative;
}

.button3._1 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---1);
  background-color: #0f003a;
}

.button3._1:hover {
  background-color: #cbf;
}

.button3._2 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---2);
}

.button3._2:hover {
  border-color: var(--_colors---3);
  color: var(--_colors---1);
}

.button3._3 {
  background-color: var(--_colors---1);
  color: #fff;
  border: 1px solid #fff;
}

.button3._3:hover {
  border-color: var(--_colors---1);
  color: var(--_colors---1);
  background-color: #fff;
}

.button-bg {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.success-message {
  background-color: #fff;
  padding: 0;
}

.button2 {
  cursor: pointer;
  border-style: solid;
  border-width: 1px;
  border-radius: .25rem;
  transition: all .3s;
  display: inline-block;
  position: relative;
}

.button2._1 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---1);
  background-color: #0f003a;
}

.button2._1:hover {
  background-color: #cbf;
}

.button2._2 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---2);
}

.button2._2:hover {
  border-color: var(--_colors---3);
  color: var(--_colors---1);
}

.button2._3 {
  background-color: var(--_colors---1);
  color: #fff;
  border: 1px solid #fff;
}

.button2._3:hover {
  border-color: var(--_colors---1);
  color: var(--_colors---1);
  background-color: #fff;
}

.button-nav {
  cursor: pointer;
  border-style: solid;
  border-width: 1px;
  border-radius: .25rem;
  transition: all .3s;
  display: inline-block;
  position: relative;
}

.button-nav._1 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---1);
  background-color: #0f003a;
}

.button-nav._1:hover {
  background-color: #cbf;
}

.button-nav._2 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---2);
}

.button-nav._2:hover {
  border-color: var(--_colors---3);
  color: var(--_colors---1);
}

.button-nav._3 {
  background-color: var(--_colors---1);
  color: #fff;
  border: 1px solid #fff;
}

.button-nav._3:hover {
  border-color: var(--_colors---1);
  color: var(--_colors---1);
  background-color: #fff;
}

.icon {
  margin-bottom: -2px;
  transition: color .4s;
}

.button-nav2 {
  cursor: pointer;
  border-style: solid;
  border-width: 1px;
  border-radius: .25rem;
  transition: all .3s;
  display: inline-block;
  position: relative;
}

.button-nav2._1 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---1);
  background-color: #0f003a;
}

.button-nav2._1:hover {
  background-color: #cbf;
}

.button-nav2._2 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---2);
}

.button-nav2._2:hover {
  border-color: var(--_colors---3);
  color: var(--_colors---1);
}

.button-nav2._3 {
  background-color: var(--_colors---1);
  color: #fff;
  border: 1px solid #fff;
}

.button-nav2._3:hover {
  border-color: var(--_colors---1);
  color: var(--_colors---1);
  background-color: #fff;
}

.dots {
  z-index: -1;
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.progress-wrap {
  width: 100%;
  height: 1px;
}

.progress {
  height: 100%;
}

.hover-wrap {
  flex-flow: column;
  width: 30%;
  display: flex;
  position: absolute;
  inset: 0% auto auto 36%;
}

.hover-wrap.mobile {
  display: none;
}

.hover-item {
  width: 100%;
  height: 100%;
  position: relative;
}

.button4 {
  cursor: pointer;
  border-style: solid;
  border-width: 1px;
  border-radius: .25rem;
  justify-content: center;
  align-items: center;
  width: 100%;
  transition: all .3s;
  display: flex;
  position: relative;
}

.button4._1 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---1);
  background-color: #0f003a;
}

.button4._1:hover {
  background-color: #cbf;
}

.button4._2 {
  border: 1px solid var(--_colors---1);
  color: var(--_colors---2);
}

.button4._2:hover {
  border-color: var(--_colors---3);
  color: var(--_colors---1);
}

.button4._3 {
  background-color: var(--_colors---1);
  color: #fff;
  border: 1px solid #fff;
}

.button4._3:hover {
  border-color: var(--_colors---1);
  color: var(--_colors---1);
  background-color: #fff;
}

.card {
  height: 50vh;
}

._3 {
  color: #fff;
  background-color: #4000ff;
  border: 1px solid #fff;
}

._3:hover {
  color: #4000ff;
  background-color: #fff;
  border-color: #4000ff;
}

.prefooter {
  min-height: 80vh;
}

.footer-link {
  color: #ffffffb3;
}

.footer-link:lang(en) {
  color: #fff;
}

.underlay-nav__link-small {
  font-size: 1em;
  line-height: 1.1;
}

.underlay-nav__link-small.is--faded {
  opacity: .5;
}

.underlay-nav__logo {
  mix-blend-mode: multiply;
}

.underlay-nav__container {
  justify-content: space-between;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.underlay-nav__link-large {
  border-radius: .25em;
  width: 100%;
  padding: .75em 1em;
}

.underlay-nav__link-large.w--current {
  color: #ededed;
  background-color: #f85931;
}

.underlay-nav__overlay {
  z-index: 100;
  pointer-events: none;
  cursor: pointer;
  visibility: hidden;
  position: fixed;
  inset: 0% -1px 0% 0%;
  overflow: clip;
}

.underlay-nav__corner {
  transform-origin: 100% 0;
  color: #fff;
  background-image: radial-gradient(circle farthest-side at 0 100%, #fff0 99%, #fff);
  width: 2em;
  height: 2em;
}

.underlay-nav__corner.is--bottom {
  transform-origin: 100% 100%;
  background-image: radial-gradient(circle farthest-side at 0 0, #fff0 99%, #fff);
}

.underlay-nav__toggle-bar {
  background-color: currentColor;
  flex: none;
  width: 100%;
  height: .0625rem;
  padding: 0;
}

.underlay-nav__borders {
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  display: flex;
  position: absolute;
  inset: 0;
}

.underlay-nav__toggle-icon {
  grid-column-gap: .375em;
  grid-row-gap: .375em;
  flex-flow: column;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 3rem;
  margin-bottom: -.3em;
  display: flex;
}

.underlay-nav__list {
  flex-flow: column;
  width: 100%;
  margin-bottom: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.underlay-nav__list.is--small {
  grid-column-gap: .75em;
  grid-row-gap: .75em;
}

.underlay-nav__inner {
  grid-column-gap: 2em;
  grid-row-gap: 2em;
  flex-flow: column;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
  height: 100%;
  padding: 7.5em 2em 2em;
  display: flex;
  overflow: auto;
}

.underlay-nav__bottom-border {
  opacity: .15;
  transform-origin: 0%;
  background-color: currentColor;
  width: 100%;
  height: 1px;
  position: absolute;
  inset: 0% 0% auto;
}

.underlay-nav__toggle-label {
  font-size: 1.25em;
}

.underlay-nav__dark {
  opacity: 0;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  background-color: #0000004d;
  position: absolute;
  inset: 0%;
}

.underlay-nav__bar {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.underlay-nav__menu {
  z-index: 1;
  width: var(--menu-width);
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
}
/* Desktop: inset the sheet 8px from top, right, and bottom.
   Mobile keeps the original full-height, flush-right layout.
   Extra selector prefix bumps specificity above the inline <style>
   at the bottom of index.html which sets top:0, right:0, height:100%. */
@media (min-width: 992px) {
  html [data-underlay-nav-menu] {
    top: 8px;
    right: 8px;
    height: calc(100vh - 16px);
    border-radius: 4px;
    overflow: hidden;
  }
}

.underlay-nav__logo-svg {
  width: 100%;
}

.underlay-nav__header {
  z-index: 100;
  color: #fff;
  position: fixed;
  inset: 0% 0% auto;
}
/* Duplicate-layer nav so blend mode applies only to logo/date/hamburger
   without inverting the green button + bullet. Layout in the two layers is
   identical (the --solid layer is a runtime clone of the --blend layer),
   so positions can't drift. */
.underlay-nav__header--blend {
  mix-blend-mode: difference;
}
.underlay-nav__header--blend .button-nav2,
.underlay-nav__header--blend .block-bullet {
  visibility: hidden;
}
.underlay-nav__header--solid {
  z-index: 101;
  pointer-events: none;
}
.underlay-nav__header--solid .button-nav2,
.underlay-nav__header--solid .block-bullet {
  pointer-events: auto;
}
.underlay-nav__header--solid .underlay-nav__logo,
.underlay-nav__header--solid .nav-right p,
.underlay-nav__header--solid .underlay-nav__toggle {
  visibility: hidden;
}

.underlay-nav__toggle {
  grid-column-gap: .75em;
  grid-row-gap: .75em;
  background-color: #0000;
  justify-content: center;
  align-items: center;
  padding-top: 1em;
  padding-bottom: 1em;
  display: flex;
}

.underlay-nav__toggle-text {
  flex-flow: column;
  flex: none;
  justify-content: flex-start;
  align-items: flex-end;
  height: 1.5em;
  display: flex;
  overflow: hidden;
}

.underlay-nav__border-row {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-end;
  display: flex;
}

.underlay-nav__bottom-col {
  grid-column-gap: 1em;
  grid-row-gap: 1em;
  flex-flow: column;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.underlay-nav__link-label {
  letter-spacing: -.04em;
  font-size: 3.25em;
  line-height: .9;
}

.underlay-nav__bottom {
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  padding-top: 1.5em;
  display: flex;
  position: relative;
}

.underlay-nav__border {
  background-color: #fff;
  width: 100%;
  height: 1em;
}

.nav-right {
  width: 43vw;
}

.display-desktop-flex {
  display: flex;
}

.rounded-top {
  border-top-left-radius: .75rem;
  border-top-right-radius: .75rem;
  overflow: hidden;
}

.block-bullet {
  margin-top: 3%;
}

.progress-img {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  inset: 0%;
}

.loading__numbers {
  flex-flow: row;
  justify-content: flex-end;
  align-items: flex-end;
  display: flex;
  position: absolute;
  inset: auto 3% 3% auto;
}

.loading__progress {
  width: 100%;
  height: .5rem;
  position: absolute;
  bottom: 0;
  left: 0;
}

.loading-screen {
  width: 100%;
  height: 100%;
  display: none;
  position: absolute;
  top: 0;
  left: 0;
}

.loading__number {
  color: #fff;
  text-transform: uppercase;
  font-size: 7vw;
  position: relative;
}

.loading__number-group {
  flex-flow: column;
  height: 8vw;
  display: flex;
  position: relative;
  overflow: hidden;
}

.loading__number-wrap {
  will-change: transform;
  flex-flow: column;
  display: flex;
  position: relative;
}

.loading__percentage {
  color: #fff;
  text-transform: uppercase;
  will-change: transform;
  margin-bottom: -.4vw;
  font-size: 7vw;
  line-height: 1;
  position: relative;
}

.loading__percentage-wrap {
  flex-flow: column;
  justify-content: flex-end;
  align-items: center;
  display: flex;
  overflow: hidden;
}

.loading__progress-inner {
  background-color: var(--_colors---8);
  perspective-origin: 0%;
  transform-origin: 0%;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.loading-container {
  z-index: 200;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  inset: 0;
  overflow: hidden;
}

.loading-img-wrap {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.loading-img-holder.is-1 {
  width: 10%;
  position: absolute;
  top: 37%;
  left: 29%;
}

.loading-img-holder.is-2 {
  width: 10%;
  position: absolute;
  top: 22%;
  left: 35%;
}

.loading-img-holder.is-3 {
  width: 10%;
  position: absolute;
  top: 29%;
  left: 45%;
}

.loading-img-holder.is-4 {
  width: 10%;
  position: absolute;
  top: 44%;
  left: 41%;
}

.loading-img-holder.is-5 {
  width: 10%;
  position: absolute;
  top: 40%;
  left: 52%;
}

.hero-img-wrap {
  width: 15%;
  position: absolute;
}

.hero-img-wrap.is-1 {
  top: 62%;
  left: 3%;
}

.hero-img-wrap.is-3 {
  top: 53%;
  left: 42%;
}

.hero-img-wrap.is-2 {
  top: 69%;
  left: 21%;
}

.hero-img-wrap.is-4 {
  top: 40%;
  left: 67%;
}

.hero-img-wrap.is-5 {
  top: 13%;
  left: 66%;
}

.form-back {
  position: absolute;
  inset: 0% auto auto 0%;
}

.form-modal-wrap {
  border-top-left-radius: var(--_site-variables---desktop-radius);
  border-top-right-radius: var(--_site-variables---desktop-radius);
  pointer-events: auto;
  width: 100%;
  height: 95vh;
  /* Was a bare `transform .5s` (browser default ease). This is a sheet sliding
     up from the bottom, so it wants a decisive start and a long settle —
     expo-out. */
  transition: transform 620ms cubic-bezier(0.16, 1, 0.3, 1);
  overflow: scroll;
  transform: translate(0, 100%);
}

.form-modal {
  /* Must clear the nav: .underlay-nav__header--solid (the layer holding the
     green Apply button) is z-index 101, so at 100 that button rendered on top
     of the open modal. 200 matches .spk-modal — the "above the nav" tier. */
  z-index: 200;
  pointer-events: none;
  justify-content: space-between;
  align-items: flex-end;
  height: 100vh;
  display: flex;
  position: fixed;
  inset: 0% 0% auto;
}

.form-overlay {
  opacity: 0;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  background-color: #0003;
  /* Matches the sheet's slide so the backdrop doesn't finish early. */
  transition: opacity 620ms cubic-bezier(0.16, 1, 0.3, 1);
  position: absolute;
  inset: 0%;
}

.overflow-scroll {
  overflow: scroll;
}

.status {
  z-index: 100;
  width: 100%;
  height: 100vh;
  position: fixed;
  inset: 0% 0% auto;
  overflow: scroll;
}

.status-block {
  background-color: #e5e7eb;
  border: 1px solid #d8d8d8;
}

.status-live {
  color: #03543f;
  white-space: nowrap;
  background-color: #def7ec;
  border-radius: .125rem;
  justify-content: center;
  align-items: center;
  padding: .375rem .625rem;
  display: flex;
}

.status-live:where(.w-variant-e8e6bc40-375b-58c6-e556-c3ad8a338c96) {
  color: #000;
  background-color: #fff;
}

.status-live:where(.w-variant-7196ef0f-f220-7c2a-280a-ca76e2d1a6b4) {
  color: #723b13;
  background-color: #fef08a;
}

.status-live:where(.w-variant-0b50b558-2a52-cd28-a717-20954800c77e) {
  color: #e1effe;
  background-color: #1e429f;
}

.status-live:where(.w-variant-4f2ab076-4801-02de-500d-ae9bc770115a) {
  color: #9b1c1c;
  background-color: #fde8e8;
}

.email-modal {
  z-index: 101;
  opacity: 0;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  pointer-events: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  transition: opacity .4s;
  display: flex;
  position: fixed;
  inset: 0%;
}

.email-modal.open {
  opacity: 1;
  pointer-events: auto;
}

.manual-modal {
  z-index: 101;
  opacity: 0;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  pointer-events: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
  transition: opacity .4s;
  display: flex;
  position: fixed;
  inset: 0%;
  overflow: scroll;
}

.manual-modal.open {
  opacity: 1;
  pointer-events: auto;
  justify-content: center;
  align-items: flex-start;
  padding-top: 27vh;
  padding-bottom: 27vh;
}

.form-modal-toggle {
  z-index: 2;
  position: absolute;
  inset: 2rem 2rem auto auto;
}

.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  max-height: 100%;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  width: 260px;
  display: flex;
}

.hero-img-temp {
  width: 100%;
  position: absolute;
  inset: auto 0% 0%;
}

.hero-wrap {
  height: 150vh;
}

@media screen and (max-width: 991px) {
  .guide-contain {
    z-index: 1;
    position: relative;
    container-type: inline-size;
  }

  .guide-layout.u-grid-custom {
    grid-column-gap: var(--_site-variables---design-gap-tablet);
    grid-row-gap: var(--_site-variables---design-gap-tablet);
    grid-template-columns: var(--grid-tablet);
  }

  .container {
    width: calc(100% - var(--_site-variables---margin-tablet) * 2);
  }

  .heading, .heading.radio-text, .heading.eyebrow-3 {
    font-size: calc(var(--_mobile-text---normal\<deleted\|variable-111c9139-cf64-304f-8a6a-532305ef941c\>) / 16px * 1rem);
  }

  .heading.text-small {
    font-size: calc(var(--_mobile-text---small\<deleted\|variable-a206a2dc-ba14-db48-ac5b-2ce26260d965\>) / 16px * 1rem);
  }

  .display-desktop {
    display: none;
  }

  .display-tablet, .display-mobile {
    display: block;
  }

  .grid {
    grid-column-gap: var(--_site-variables---design-gap-tablet);
    grid-row-gap: var(--_site-variables---design-gap-tablet);
    grid-template-columns: repeat(var(--_site-variables---columns-tablet), minmax(0px, 1fr));
  }

  .flex {
    display: block;
  }

  .text:where(.w-variant-91ae0d4b-c22a-9c24-e714-15c703231902) {
    font-size: clamp(calc(var(--_mobile-text---h1) * 1rem / 16), calc(var(--_mobile-text---h1) * 1rem / 16 + (var(--_desktop-text---h1)  - var(--_mobile-text---h1)) * ((100vw - 767px) / (var(--_site-variables---design-width)  - 767))), calc(var(--_desktop-text---h1) * 1rem / 16));
  }

  .underlay-nav__header {
    margin-left: auto;
    margin-right: auto;
  }

  .display-desktop-flex {
    display: none;
  }

  .nav-trigger {
    position: absolute;
    inset: 100vh 0% auto;
  }
}

@media screen and (max-width: 767px) {
  .guide-contain.container {
    width: calc(100% - var(--site--margin-2\<deleted\|variable-06c56dcb-6f8d-2408-2a44-a0d75478a54c\>) * 2);
  }

  .guide-layout.u-grid-custom {
    grid-column-gap: var(--_site-variables---design-gap-mobile);
    grid-row-gap: var(--_site-variables---design-gap-mobile);
    grid-template-columns: var(--grid-mobile);
  }

  .container {
    width: calc(100% - var(--_site-variables---margin-mobile) * 2);
  }

  .grid {
    grid-column-gap: var(--_site-variables---design-gap-mobile);
    grid-row-gap: var(--_site-variables---design-gap-mobile);
    grid-template-columns: repeat(var(--_site-variables---columns-mobile), minmax(0px, 1fr));
  }

  .full-screen {
    height: 100svh;
  }

  .button-nav2:where(.w-variant-23831f2c-aafd-8731-5a99-1888e3df7f1a) {
    width: 100%;
    display: flex;
    justify-content: center;
  }

  .hover-wrap.mobile {
    width: 100%;
    display: block;
    position: relative;
    top: 0%;
    left: 0%;
  }

  .hover-item.mobile {
    position: absolute;
    inset: 0%;
  }

  .underlay-nav__inner {
    padding: 5em 1.25em 1.25em;
  }

  .underlay-nav__toggle-label {
    font-size: 1em;
  }

  .underlay-nav__toggle-text {
    height: 1.25em;
  }

  .underlay-nav__link-label {
    font-size: 2em;
  }

  .underlay-nav__bottom {
    grid-column-gap: 2em;
    grid-row-gap: 2em;
    flex-flow: column;
    padding-left: 1em;
    padding-right: 1em;
  }

  .nav-right {
    width: 60vw;
  }

  .hero-img-wrap.is-2 {
    top: 74%;
    left: 41%;
  }

  .hero-img-wrap.is-4 {
    top: 52%;
  }

  .hero-img-wrap.is-5 {
    top: 46%;
    left: 11%;
  }
}

#w-node-b9b8d888-e977-0f04-343b-7c31a5dc1cb9-30e76e68 {
  align-self: center;
}


@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-BoldItalic.ttf') format('truetype'), url('../fonts/GeistMono-ExtraBoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-BlackItalic.ttf') format('truetype');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-Bold.ttf') format('truetype'), url('../fonts/GeistMono-ExtraBold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-ExtraLight.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-SemiBoldItalic.ttf') format('truetype');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-ThinItalic.ttf') format('truetype');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-Thin.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Geistmono';
  src: url('../fonts/GeistMono-ExtraLightItalic.ttf') format('truetype');
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-Thin.otf') format('opentype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-Extralight.otf') format('opentype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-BoldItalic.otf') format('opentype');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-LightItalic.otf') format('opentype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial Book';
  src: url('../fonts/MesoTRIAL-Book.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-BlackItalic.otf') format('opentype');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-ExtralightItalic.otf') format('opentype');
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-BookItalic.otf') format('opentype'), url('../fonts/MesoTRIAL-RegularItalic.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-Black.otf') format('opentype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-MediumItalic.otf') format('opentype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Mesotrial';
  src: url('../fonts/MesoTRIAL-ThinItalic.otf') format('opentype');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Laygrotesk';
  src: url('../fonts/LayGrotesk-Black.otf') format('opentype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Laygrotesk';
  src: url('../fonts/LayGrotesk-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Laygrotesk';
  src: url('../fonts/LayGrotesk-Semibold.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Laygrotesk';
  src: url('../fonts/LayGrotesk-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Laygrotesk';
  src: url('../fonts/LayGrotesk-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* ===== Speakers — drag-to-scroll carousel ===== */
.spk-carousel {
  /* Match the spacing used between elements in the "How to get Involved" grid. */
  --spk-gap: var(--_site-variables---design-gap);
  /* Break out of the page container to the true viewport edges so dragging
     doesn't clip early against the container margin; re-add that margin as
     padding so the first card still lines up with the heading above. */
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: var(--_site-variables---margin);
  padding-right: var(--_site-variables---margin);
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
  cursor: grab;
  padding-top: 8px;
  padding-bottom: 8px;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}
@media (max-width: 991px) {
  .spk-carousel {
    padding-left: var(--_site-variables---margin-mobile);
    padding-right: var(--_site-variables---margin-mobile);
  }
}
.spk-carousel::-webkit-scrollbar {
  display: none;
}
.spk-carousel.is-dragging {
  cursor: grabbing;
}
.spk-track {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--spk-gap);
  width: max-content;
}
.spk-card {
  flex: 0 0 auto;
  /* Show 4 full cards + a peek of the next: 4 cards, 4 gaps, ~0.3-card peek. */
  width: 300px;
  width: calc((100cqw - 4 * var(--spk-gap)) / 4.3);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  user-select: none;
  -webkit-user-select: none;
}
.spk-card__photo {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
}
/* Pixel-dissolve hover: canvas over the sharp image shows a pixelated
   version. Pixel size animates smaller on hover (chunky → sharp) and
   back to chunky on leave. JS handles the re-rendering per frame. */
.spk-card__pixel {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  z-index: 1;
}
.spk-card__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  -webkit-user-drag: none;
  user-drag: none;
}
.spk-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1rem 0;
}
.spk-card__name {
  margin: 0;
}
.spk-card__role {
  margin: 0;
  opacity: 0.8;
}
@media (max-width: 991px) {
  .spk-card {
    width: 78vw;
    width: calc((100cqw - var(--spk-gap)) / 1.2);
  }
}

/* ===== Custom cursor: green square that follows the mouse ===== */
.bt-cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 12px;
  height: 12px;
  padding: 0;
  translate: calc(-100% - 8px) calc(-100% - 8px);
  background: var(--_colors---8, #dafa9c);
  color: #111;
  font-family: var(--_site-variables---tertiary-family);
  font-weight: 400;
  font-size: 0;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  pointer-events: none;
  z-index: 9999;
  opacity: 0;
  will-change: transform;
  transition:
    opacity 200ms ease,
    width 260ms cubic-bezier(0.76, 0, 0.24, 1),
    height 260ms cubic-bezier(0.76, 0, 0.24, 1),
    padding 260ms cubic-bezier(0.76, 0, 0.24, 1),
    font-size 260ms cubic-bezier(0.76, 0, 0.24, 1);
}
.bt-cursor.is-ready { opacity: 1; }
.bt-cursor__label { display: block; }
.bt-cursor.is-label {
  width: auto;
  height: auto;
  padding: 4px;
  font-size: 14px;
}
@media (hover: none), (pointer: coarse), (max-width: 991px) {
  .bt-cursor { display: none !important; }
}

/* ===== Masked hover: button colour stays, text flips in and out ===== */
.button-nav2 {
  overflow: hidden;
}
.button-nav2 .btn-mask,
.button1 .btn-mask,
.button2 .btn-mask,
.button3 .btn-mask,
.button4 .btn-mask,
.button-submit .btn-mask {
  position: relative;
  display: inline-block;
  overflow: hidden;
  vertical-align: middle;
}
.button-nav2 .btn-mask__inner,
.button1 .btn-mask__inner,
.button2 .btn-mask__inner,
.button3 .btn-mask__inner,
.button4 .btn-mask__inner,
.button-submit .btn-mask__inner {
  display: inline-block;
  transition: transform 280ms cubic-bezier(0.76, 0, 0.24, 1);
}
.button-nav2 .btn-mask__inner--hover,
.button1 .btn-mask__inner--hover,
.button2 .btn-mask__inner--hover,
.button3 .btn-mask__inner--hover,
.button4 .btn-mask__inner--hover,
.button-submit .btn-mask__inner--hover {
  position: absolute;
  left: 0;
  top: 0;
  transform: translateY(100%);
}
.button-nav2:hover .btn-mask__inner,
.button1:hover .btn-mask__inner,
.button2:hover .btn-mask__inner,
.button3:hover .btn-mask__inner,
.button4:hover .btn-mask__inner,
.button-submit:hover .btn-mask__inner {
  transform: translateY(-100%);
}
.button-nav2:hover .btn-mask__inner--hover,
.button1:hover .btn-mask__inner--hover,
.button2:hover .btn-mask__inner--hover,
.button3:hover .btn-mask__inner--hover,
.button4:hover .btn-mask__inner--hover,
.button-submit:hover .btn-mask__inner--hover {
  transform: translateY(0);
}

/* ===== Bar-reveal text animation =====
   Colored bar sweeps in covering the heading, then sweeps out revealing it.
   JS wraps the text in .br-content and appends .br-bar, then drives a two-
   phase GSAP timeline. Text is visibility:hidden until the bar covers it. */
[data-bar-reveal] {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
[data-bar-reveal] .br-content {
  visibility: hidden;
  display: inline-block;
  position: relative;
  z-index: 1;
}
[data-bar-reveal].br-visible .br-content {
  visibility: visible;
}
[data-bar-reveal] .br-bar {
  position: absolute;
  inset: 0;
  background: var(--_colors---8, #dafa9c);
  transform: scaleX(0);
  transform-origin: 0% 0%;
  z-index: 2;
  pointer-events: none;
}

/* ===== Speaker bio modal =====
   Right-side dark sheet, ~half-width on desktop, full-width on mobile.
   Big first name in brand green + white surname on top, eyebrow role,
   body bio underneath. Slim X close in the top-right. */
.spk-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  pointer-events: none;
}
.spk-modal.is-open { pointer-events: auto; }

.spk-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  opacity: 0;
  transition: opacity 420ms cubic-bezier(0.32, 0.72, 0, 1);
  cursor: pointer;
}
.spk-modal.is-open .spk-modal__overlay { opacity: 1; }

.spk-modal__sheet {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(720px, 100vw);
  color: #fff;
  transform: translateX(100%);
  transition: transform 520ms cubic-bezier(0.7, 0, 0.3, 1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.spk-modal.is-open .spk-modal__sheet { transform: translateX(0); }

@media (min-width: 992px) {
  .spk-modal__sheet {
    top: 8px;
    right: 8px;
    bottom: 8px;
    width: min(50vw, 900px);
    border-radius: 4px;
  }
}

.spk-modal__close {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 2;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  line-height: 0;
  transition: transform 200ms ease;
}
.spk-modal__close:hover { transform: scale(0.94); }
.spk-modal__close svg { display: block; }

.spk-modal__scroll {
  flex: 1;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 88px 56px 56px;
}
@media (max-width: 991px) {
  .spk-modal__scroll {
    padding: 80px 32px 40px;
  }
}

.spk-modal__name {
  margin: 0 0 32px;
  line-height: 0.9;
  letter-spacing: -0.02em;
}
.spk-modal__first { color: var(--_colors---8, #dafa9c); }
.spk-modal__last { color: #fff; }

.spk-modal__role {
  margin: 0 0 32px;
  opacity: 0.9;
}

.spk-modal__bio {
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.85);
  white-space: pre-line;
}
.spk-modal__bio p { margin: 0 0 1em; }
.spk-modal__bio p:last-child { margin-bottom: 0; }

/* Speaker card is clickable */
.spk-card { cursor: pointer; }

/* ===== Application Process — scrollytelling ===== */
.ap-scroll {
  position: relative;
  /* Each step's hover target extends beyond the grid to span the page width
     (see .ap-step-block::before); clip it so it can't create a horizontal scrollbar. */
  overflow-x: clip;
}

/* Cross-fade stacks (used on desktop; on mobile only the active one shows) */
.ap-visual {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  margin-bottom: 32px;
}
.ap-visual__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 500ms ease;
}
.ap-visual__img.is-active { opacity: 1; }

.ap-eyebrow {
  text-transform: uppercase;
  margin-bottom: 16px;
}

.ap-copy {
  position: relative;
  display: grid;
  margin-bottom: 32px;
}
.ap-copy__text {
  grid-area: 1 / 1;
  opacity: 0;
  transition: opacity 500ms ease;
  margin: 0;
}
.ap-copy__text.is-active { opacity: 1; }

.ap-cta { margin-top: 8px; }

/* Right column: heading + step list */
.ap-scroll__right {
  display: flex;
  flex-direction: column;
  gap: 48px;
}
.ap-scroll__heading {
  display: flex;
  flex-direction: column;
}
.ap-steps {
  display: flex;
  flex-direction: column;
}
.ap-step-block {
  position: relative; /* anchors the full-width hover target (::before) */
  display: flex;
  flex-direction: column;
  gap: 16px;
}
/* Plain text, not a control: no pointer cursor, nothing clickable. */
.ap-step {
  display: flex;
  align-items: center;
  gap: 24px;
  transition: opacity 300ms ease;
  opacity: 1;
  width: 100%;
}
.ap-step__dot { display: none; }
.ap-step__title { margin: 0; }
html .ap-step__title { text-transform: none; }
.ap-step__copy { margin: 0; }
.ap-step__divider {
  height: 1px;
  background: currentColor;
  opacity: 0.15;
}

/* Desktop: dim inactive step titles; each step gets a hover target spanning
   the full page width. */
@media (min-width: 992px) {
  .ap-scroll__inner { align-items: start; }
  .ap-step-block { padding: 40px 0; }
  /* Left visual + copy lock below the fixed nav while the steps scroll;
     the whole section releases together once its bottom passes. */
  .ap-scroll__left {
    position: sticky;
    top: 120px;
    /* position:sticky creates a stacking context, which trapped .ap-cta's
       z-index inside this column and left the whole thing under the step
       hover targets — the Apply button became unclickable. Lift the column
       above them, but stay transparent to the pointer so hovering the left
       side still switches steps; only the button takes clicks back. */
    z-index: 2;
    pointer-events: none;
  }
  .ap-scroll__left a,
  .ap-scroll__left button,
  .ap-cta {
    pointer-events: auto;
  }
  .ap-step { opacity: 0.45; }
  .ap-step.is-active { opacity: 1; }

  /* The titles live in the right-hand grid columns, but hovering anywhere
     across the page at a step's height should activate it. This invisible
     pseudo-element widens the hit area leftwards; it sits on the BLOCK (not
     the title) so the block's 48px padding is part of the target too, leaving
     no dead gaps between steps. Being a pseudo-element, it triggers the
     block's own pointer events. */
  .ap-step-block::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: -100vw;
  }
  /* Keep the "Apply to Build" button above those hit areas so it stays
     clickable (the visual + copy below them are not interactive). */
  .ap-cta {
    position: relative;
    z-index: 2;
  }

  .ap-mobile-only { display: none !important; }
}

/* Mobile: hide the desktop copy stack + button (they render inline under each
   step). The image stack stays stacked and cross-fades on scroll — see
   initApScroll in site.js. */
@media (max-width: 991px) {
  .ap-desktop-only { display: none !important; }
  .ap-visual { margin-bottom: 24px; }
  .ap-step-block { padding: 12px 0; }
  .ap-step__divider { margin: 12px 0; }

  /* Reorder: the "APPLICATION PROCESS" heading comes first, then the visual,
     then the steps, then the button. The heading lives inside .ap-scroll__right
     in the markup (it belongs to the right column on desktop), so that column
     is dissolved with display:contents and its children are ordered directly
     against .ap-scroll__left. display:contents drops the column's own 48px
     gap, so the spacing is restored with margins below. */
  .ap-scroll__inner {
    display: flex;
    flex-direction: column;
  }
  .ap-scroll__right { display: contents; }
  .ap-scroll__heading { order: 1; margin-bottom: 32px; }
  .ap-scroll__left { order: 2; }
  .ap-steps { order: 3; }
  .ap-cta { order: 4; margin-top: 32px; }

  /* Extend the mobile-full button variant up to the site-wide mobile
     breakpoint (was only ≤ 767px in the original CSS). */
  .button-nav2.w-variant-23831f2c-aafd-8731-5a99-1888e3df7f1a {
    width: 100%;
    display: flex;
    justify-content: center;
    align-self: stretch;
  }
  /* If the button sits inside a wrapping div (e.g. sponsor block), the
     parent flex has align-items: flex-start, so the wrapper shrinks to
     content. Stretch the wrapper so the 100%-wide button fills the row. */
  *:has(> .button-nav2.w-variant-23831f2c-aafd-8731-5a99-1888e3df7f1a) {
    align-self: stretch;
    width: 100%;
  }
}
/* ===== Status page ===== */

/* Footer "hosted by" mark: the SVG is inline, so it sat on the text baseline
   and rode ~3px above the label's optical centre. Centre it in its box. */
.hosted-by__logo {
  display: flex;
  align-items: center;
}
.hosted-by__logo svg {
  display: block;
}

@media (max-width: 991px) {
  /* Stack the "Team Members" label above the actions, and stack the two
     actions themselves rather than squeezing them side by side. Vertical
     spacing around this row comes from the mmt/mmb attributes on the element,
     because the dmt/dmb rules are inlined in status.html and would otherwise
     win over this stylesheet. */
  /* Both selectors are doubled up (.flex.x) on purpose: status.html inlines
     [desktop-x="center"] { flex-direction: row } with no media query, and
     being inline it beats this stylesheet at equal specificity. */
  .flex.status-members-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .flex.status-actions {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    gap: 12px;
  }
  .status-actions .button1,
  .status-actions .button2 {
    width: 100%;
  }
}

@media (max-width: 991px) {
  /* Nav: the two columns are placed with desktop-only d-start/d-end, so on
     phones each .layout took the full grid width and the logo stacked above
     the button. Lay them out as one row instead. */
  .grid.status-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
  }
  .grid.status-nav > .layout {
    width: auto;
    flex: 0 0 auto;
  }
}

/* Footer "hosted by <MakeReign mark>" sits at the right edge of its column.
   margin-left:auto handles a row-direction parent, align-self a column one,
   which covers the differing footer markup across pages. */
.footer-hosted-by {
  margin-left: auto;
  align-self: flex-end;
}

/* Close control on the application form modal. */
.form-modal-toggle {
  cursor: pointer;
}

/* Stat numbers slide down out of this clipped box as they count up
   (see initCountUp in animations.js, which inserts the wrapper). */
.stat-mask {
  overflow: hidden;
}

/* Animated underline: drawn as a pseudo-element so it can sweep in and out
   rather than just switching text-decoration on and off.

   `bottom` sits the rule just under the glyphs rather than at the bottom of
   the line box. 100% is the link's line height, ~1.3em approximates the
   text's own box, so half the leading is subtracted and the rule lands 1px
   below the text. Adapts if this is reused at another size or line-height —
   and it's the offset .nav-link_text below matches. */
[init-underline] {
  position: relative;
}
[init-underline]:after {
  content: "";
  position: absolute;
  height: 1px;
  width: 100%;
  background: currentColor;
  bottom: calc((100% - 1.3em) / 2 - 1px);
  left: 0;
  /* Hidden until hover. This used to be the other way round — drawn by
     default and retracting on hover — but the legal links read as permanently
     underlined, so the rule now sweeps in from the left on hover instead. */
  transform: scaleX(0);
  transition: transform 0.4s ease-out;
  transform-origin: right;
}
[init-underline]:hover:after {
  transform: scaleX(1);
  transform-origin: left;
}

/* Same underline for the nav links, which wrap their label in .nav-link_text
   so the rule tracks the text rather than the whole hit area. `bottom` is the
   shared offset above — as authored it was `0`, which dropped the rule to the
   floor of the line box instead of sitting under the glyphs. */
.nav-link_text {
  position: relative;
}
.nav-link_text:after {
  content: "";
  position: absolute;
  height: 1px;
  width: 100%;
  background: currentColor;
  bottom: calc((100% - 1.3em) / 2 - 1px);
  left: 0;
  transition: transform 0.4s ease-out;
  transform: scaleX(0);
  transform-origin: right;
}
.nav-link:hover .nav-link_text:after {
  transform: scaleX(1);
  transform-origin: left;
}

@media (max-width: 991px) {
  /* Hamburger reads oversized next to the mobile nav; 3rem -> 2rem. */
  .underlay-nav__toggle-icon {
    width: 2rem;
  }
}

/* Stage tap targets sit over the segmented progress bar. Hidden by default —
   only the mobile bar is segmented, and on desktop the stage labels below the
   bar already do this job. */
.progress-layout {
  position: relative;
}
.progress-hits {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 32px;
  gap: 6px; /* matches --seg-gap on .progress-wrap */
}
.progress-hit {
  flex: 1;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.progress-hit:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* Terms checkbox: white with a light grey border until it's ticked, then
   solid black with the white check showing. Driven through the Scaffold radio
   custom properties, which .radio_circle_wrap already reads for its border
   and background, so both states stay in one place. */
.hackathon-form .radio_label.checkbox {
  --_radios---border: #d9d9d9;
  --_radios---bg: #fff;
  --_radios---text: #fff;
}
.hackathon-form .radio_label.checkbox:has(.radio_input:checked) {
  --_radios---border: #111;
  --_radios---bg: #111;
}

/* ===== Mobile refinements ===== */
@media (max-width: 991px) {
  /* FAQ rows are space-between, so a question that wraps to the full column
     width ends up touching the +/- toggle. Guarantee a gap between them. */
  #faqs [toggle] {
    gap: 24px;
  }

  /* "How to get involved" cards become a horizontal snap slider: each card is
     90% of the container so the next one peeks in and reads as swipeable.
     .layout's grid-column attributes are inert once the parent is a flex row. */
  /* Scaffold ships `.grid.container { overflow: visible !important }` in the
     page's inline styles, which loads AFTER this file — so matching its
     !important isn't enough, the id is needed to outrank it. */
  #get-involved .grid.gi-cards {
    display: flex;
    flex-wrap: nowrap;
    gap: 16px;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    /* Break out of .container to the full viewport so the next card bleeds off
       the screen edge instead of being clipped at the container's. The padding
       puts the first card back on the container's own left edge, and
       scroll-padding keeps every snapped card there too. margin-tablet and
       margin-mobile are both 20px, so one value covers the whole range. */
    /* !important because Scaffold's inline styles set `.container { width:
       calc(100% - margin*2) !important }` at every breakpoint. */
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-left: var(--_site-variables---margin-mobile);
    padding-right: var(--_site-variables---margin-mobile);
    scroll-padding-left: var(--_site-variables---margin-mobile);
  }
  #get-involved .grid.gi-cards::-webkit-scrollbar {
    display: none;
  }
  #get-involved .grid.gi-cards > .card.layout {
    flex: 0 0 90%;
    max-width: 90%;
    scroll-snap-align: start;
  }

  /* "What to expect" progress bar reads as four discrete segments, one per
     stage. A repeating mask punches the gaps out of the track AND the fill in
     one go, so the GSAP scaleX sweep still drives it untouched. */
  .progress-wrap {
    --seg-gap: 6px;
    height: 2px;
    -webkit-mask-image: repeating-linear-gradient(
      to right,
      #000 0 calc(25% - var(--seg-gap)),
      transparent calc(25% - var(--seg-gap)) 25%
    );
    mask-image: repeating-linear-gradient(
      to right,
      #000 0 calc(25% - var(--seg-gap)),
      transparent calc(25% - var(--seg-gap)) 25%
    );
  }

  /* One tap target per segment, laid over the bar by initProgressShowcase.
     The bar itself is 2px, far too thin to hit, so the strip is 32px tall and
     centred on it. Desktop keeps using the stage labels instead. */
  .progress-hits {
    display: flex;
  }

  /* ---- Application form modal ---- */

  /* The radio "button" cards use a clamp that scales their padding off the
     1920px design width, which collapses to ~5px on a phone. Pin a real value. */
  .hackathon-form .radio_label[data-wf--input---radio--variant="button"] {
    --_radios---btn-y-padding: 1.25rem;
    --_radios---btn-x-padding: 1.25rem;
  }

  /* Fields are authored in pairs (Name/Surname, Email/Phone …) on one row.
     At 375px that leaves each about 134px, so real values and the longer
     placeholders get cut off mid-word. Stack them. DOM order is untouched —
     form.js identifies profile fields by their order within the step. */
  .hackathon-form .flex:has(> .field-wrap) {
    flex-direction: column;
    align-items: stretch;
  }

  /* Every field label carries dmb="8", which is a clamp off the 1920px design
     width and lands at ~1.5px on a phone — the label ends up sitting on top of
     its own input. */
  .hackathon-form .field-wrap-name {
    margin-bottom: 8px;
  }

  /* "← Back" is absolutely positioned top-left, which on a phone lands it on
     top of the step heading. Put it back in flow above the heading instead.
     max-content keeps the button hugging its label — left in flow at full
     width it would run under the close icon in the top-right corner. */
  .hackathon-form .form-back {
    position: relative;
    inset: auto;
    width: max-content;
    margin-top: 0;
    margin-bottom: 24px;
  }
}