/** Shopify CDN: Minification failed

Line 282:0 Unexpected "{"
Line 282:1 Expected identifier but found "%"
Line 282:28 Expected identifier but found "%"

**/
/* Global Variables */

:root {
  font-size: 1rem;

  --md: 1em;

  --scaleFactor: 1.618;

  --sm: calc(var(--md) / var(--scaleFactor));
  --xs: calc(var(--sm) / var(--scaleFactor));
  --2xs: calc(var(--xs) / var(--scaleFactor));

  --lg: calc(var(--md) * var(--scaleFactor));
  --xl: calc(var(--lg) * var(--scaleFactor));
  --2xl: calc(var(--xl) * var(--scaleFactor));
  
  
  /* JP Fonts (!important) */

  --playfair: 'GF Playfair Display', 'Times New Roman', 'Times', serif !important;
  --times: 'Times New Roman', 'Times', serif !important;
  --lora: 'Lora', 'Georgia', serif !important;
  --inter: 'Inter', 'Arial', sans-serif !important;
  
  .font-playfair, .playfair {
    font-family: var(--playfair);
  }
  
  .font-times, .times {
    font-family: var(--times);
  }
  
  .font-lora, .lora {
    font-family: var(--lora);
  }
  
  .font-inter, .inter {
    font-family: var(--inter);
  }
  
  /* JP colors */

  --gold: #c8ad82;
  --ongold: #4a3420;

  --navy: #202b43;
  --onnavy: #a6abbd;
  --undernavy: #182032;

  --beige: #f4f1eb;
  --onbeige: #a8a29e;

  --grey: #767676;
  --lightgrey: #dedfe3;
  --stonegrey: #f5f5f4;

  --greyonwhite45: #767676;
  --greyonbeige45: #6d6d6d;
  --greyonwhite30: #959595;
  --greyonbeige30: #8b8b8b; 

  .gold {
    color: var(--gold);
  }
  .bg-gold {
    background-color: var(--gold);
  }
  .ongold {
    color: var(--ongold);
  }
  
  .navy {
    color: var(--navy);
  }
  .bg-navy {
    background-color: var(--navy);
  }
  
  .onnavy {
    color: var(--onnavy);
  }
  
  .beige {
    color: var(--beige);
  }
  
  .onbeige {
    color: var(--onbeige);
  }
  
  .grey {
    color: var(--grey);
  }
  
  .lightgrey {
    color: var(--lightgrey);
  }
  .bg-lightgrey {
    background-color: var(--lightgrey);
  }

  .stonegrey {
    color: var(--stonegrey)
  }
  .bg-stonegrey {
    background-color: var(--stonegrey);
  }
  
  .greyonwhite45 {
    color: var(--greyonwhite45);
  }
  
  .greyonbeige45 {
    color: var(--greyonbeige45);
  }
  
  .greyonwhite30 {
    color: var(--greyonwhite30);
  }
  
  .greyonbeige30 {
    color: var(--greyonbeige30);
  }

  hl {
    color: var(--navy);
  }

  /* Increments */

  --wholestep: 1.618;
  --halfstep: 1.272;
  --quarterstep: 1.128;
  --eighthstep: 1.061;

  --wholestep-dec: 0.618;
  --halfstep-dec: 0.272;
  --quarterstep-dec: 0.128;
  --eighthstep-dec: 0.061;

  /* Colors */

  --dark__outline_lkv: #90909a;
  --dark__error_lkv: #ffb4ab;
  --dark__primary_lkv: #b9c3ff;

  --light__background_lkv: #fbf8fb;
  --light__onsurface_lkv: #1b1b1d;
  --light__primary_lkv: #0e1930;
  --light__surfacecontainerlowest_lkv: #ffffff;
  --light__onsurfacevariant_lkv: #45464d;
  --light__onprimary_lkv: #ffffff;
  --light__outlinevariant_lkv: #c5c6ce;
  --light__shadow_lkv: #000000;
  --light__info_lkv: #1758c7;
  --light__secondary_lkv: #5a5e6a;
  --light__outline_lkv: #75777e;
  --light__inverseprimary_lkv: #bbc6e5;
  --light__surfacecontainerlow_lkv: #f5f3f5;
  --light__successcontainer_lkv: #92f8b4;
  --light__onsuccesscontainer_lkv: #00210f;
  --light__infocontainer_lkv: #dae2ff;
  --light__oninfocontainer_lkv: #001946;
  --light__warningcontainer_lkv: #ffdea7;
  --light__onwarningcontainer_lkv: #271900;
  --light__errorcontainer_lkv: #ffdad6;
  --light__onerrorcontainer_lkv: #410002;
  --light__onsecondarycontainer_lkv: #464a55;
  --light__primarycontainer_lkv: #2e3952;
  --light__onprimarycontainer_lkv: #c0cbea;
  --light__onsecondary_lkv: #ffffff;
  --light__secondarycontainer_lkv: #e3e6f4;
  --light__tertiary_lkv: #705b37;
  --light__ontertiary_lkv: #ffffff;
  --light__tertiarycontainer_lkv: #d2b78b;
  --light__ontertiarycontainer_lkv: #3c2b0b;
  --light__error_lkv: #ba1a1a;
  --light__onerror_lkv: #ffffff;
  --light__onbackground_lkv: #1b1b1d;
  --light__surface_lkv: #fbf8fb;
  --light__surfacevariant_lkv: #e2e2ea;
  --light__scrim_lkv: #000000;
  --light__inversesurface_lkv: #303032;
  --light__inverseonsurface_lkv: #f3f0f2;
  --light__success_lkv: #006d3d;
  --light__onsuccess_lkv: #ffffff;
  --light__warning_lkv: #7c5800;
  --light__onwarning_lkv: #ffffff;
  --light__oninfo_lkv: #ffffff;
  --light__primaryfixed_lkv: #d8e2ff;
  --light__onprimaryfixed_lkv: #101b32;
  --light__primaryfixeddim_lkv: #bbc6e5;
  --light__onprimaryfixedvariant_lkv: #3c4760;
  --light__secondaryfixed_lkv: #dfe2f0;
  --light__onsecondaryfixed_lkv: #171b25;
  --light__secondaryfixeddim_lkv: #c3c6d4;
  --light__onsecondaryfixedvariant_lkv: #434752;
  --light__tertiaryfixed_lkv: #fcdeb0;
  --light__ontertiaryfixed_lkv: #271900;
  --light__tertiaryfixeddim_lkv: #dfc396;
  --light__ontertiaryfixedvariant_lkv: #574421;
  --light__surfacedim_lkv: #dcd9dc;
  --light__surfacebright_lkv: #fbf8fb;
  --light__surfacecontainer_lkv: #f0edef;
  --light__surfacecontainerhigh_lkv: #eae7ea;
  --light__surfacecontainerhighest_lkv: #e4e2e4;

  --dark__onprimary_lkv: #11277c;
  --dark__primarycontainer_lkv: #2d3f93;
  --dark__onprimarycontainer_lkv: #dee1ff;
  --dark__secondary_lkv: #c3c5dd;
  --dark__onsecondary_lkv: #2c2f42;
  --dark__secondarycontainer_lkv: #434659;
  --dark__onsecondarycontainer_lkv: #dfe1f9;
  --dark__tertiary_lkv: #e5bad8;
  --dark__ontertiary_lkv: #44263e;
  --dark__tertiarycontainer_lkv: #5c3c55;
  --dark__ontertiarycontainer_lkv: #ffd7f2;
  --dark__onerror_lkv: #690005;
  --dark__errorcontainer_lkv: #93000a;
  --dark__onerrorcontainer_lkv: #ffb4ab;
  --dark__background_lkv: #1b1b1f;
  --dark__onbackground_lkv: #e4e1e6;
  --dark__surface_lkv: #131316;
  --dark__onsurface_lkv: #e4e1e6;
  --dark__onsurfacevariant_lkv: #c6c5d0;
  --dark__surfacevariant_lkv: #45464f;
  --dark__shadow_lkv: #000;
  --dark__inversesurface_lkv: #e4e1e6;
  --dark__scrim_lkv: #000;
  --dark__inverseonsurface_lkv: #303034;
  --dark__inverseprimary_lkv: #4658ac;
  --dark__success_lkv: #76db9a;
  --dark__onsuccess_lkv: #00391d;
  --dark__successcontainer_lkv: #00522c;
  --dark__onsuccesscontainer_lkv: #92f8b4;
  --dark__warning_lkv: #f7bd48;
  --dark__onwarning_lkv: #412d00;
  --dark__warningcontainer_lkv: #5e4200;
  --dark__onwarningcontainer_lkv: #ffdea7;
  --dark__info_lkv: #b1c5ff;
  --dark__oninfo_lkv: #002c71;
  --dark__infocontainer_lkv: #00419e;
  --dark__oninfocontainer_lkv: #dae2ff;
  --dark__primaryfixed_lkv: #dee1ff;
  --dark__onprimaryfixed_lkv: #001258;
  --dark__primaryfixeddim_lkv: #b9c3ff;
  --dark__onprimaryfixedvariant_lkv: #2d3f93;
  --dark__secondaryfixed_lkv: #dfe1f9;
  --dark__secondaryfixeddim_lkv: #c3c5dd;
  --dark__onsecondaryfixed_lkv: #171b2c;
  --dark__onsecondaryfixedvariant_lkv: #434659;
  --dark__tertiaryfixed_lkv: #ffd7f2;
  --dark__ontertiaryfixed_lkv: #2d1228;
  --dark__tertiaryfixeddim_lkv: #e5bad8;
  --dark__ontertiaryfixedvariant_lkv: #5c3c55;
  --dark__surfacedim_lkv: #131316;
  --dark__surfacebright_lkv: #39393c;
  --dark__surfacecontainerlowest_lkv: #0e0e11;
  --dark__surfacecontainer_lkv: #1f1f23;
  --dark__surfacecontainerhigh_lkv: #2a2a2d;
  --dark__surfacecontainerhighest_lkv: #353438;
  --dark__surfacecontainerlow_lkv: #1b1b1f;
  --dark__outlinevariant_lkv: #45464f;

  /* Make text look sharper */

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smooth: never;
}


{%- comment -%} TYPOGRAPHY {%- endcomment -%}

 


/* JP-Typo Variable */
.variable-section {
  container-type: inline-size;
}

/* Defaults */
:root {
  --heading-min: 1.125rem;
  --heading-max: 2.5rem;
  --heading-slope: 3.5cqi;
  
  --subheading-min: 1rem;
  --subheading-max: 1.5rem;
  --subheading-slope: 2.2cqi;

  --dpi-mod: 1;
}

@media (max-resolution: 1.25dppx) { :root { --dpi-mod: .92; } }
@media (min-resolution: 2dppx)   { :root { --dpi-mod: 1.04; } }

/* Safari-Fallback */
@media (-webkit-max-device-pixel-ratio: 1.25) { :root { --dpi-mod: .92; } }
@media (-webkit-min-device-pixel-ratio: 2)    { :root { --dpi-mod: 1.04; } }

.section-heading_variable {
    font-size: calc(clamp(var(--heading-min), calc(var(--heading-min) + var(--heading-slope)), var(--heading-max))* var(--dpi-mod));
    line-height: var(--halfstep);
    font-weight: 600;
}
.section-heading_variable[data-variant="long"] { --heading-max: 48px; }
.section-heading_variable[data-variant="short"]{ --heading-min: 26px; --heading-max: 72px; }


.section-subheading_variable  {
    font-size: calc(clamp(var(--subheading-min), calc(var(--subheading-min) + var(--subheading-slope)), var(--subheading-max))* var(--dpi-mod));
    line-height: var(--halfstep);
    font-weight: 600;  
}
.section-subheading_variable[data-variant="long"] { --subheading-max: 20px; }


/* JP-Typo */
.section-heading {
  font-size: 2.5rem;
  font-size: clamp(1rem, 5vw, 2.5rem);
  line-height: 1.0714285714;
  font-weight: 600;
  letter-spacing: -0.03em;
  font-family: var(--inter);
}

@media (max-width: 999px) {
  .section-heading {
    font-size: 2.25rem;
    font-size: clamp(1rem, 5vw, 2.5rem);
    line-height: 1.0834933333;
    font-weight: 600;
    letter-spacing: -0.012em;
    font-family: var(--inter);
  }
}

@media (max-width: 699px) {
  .section-heading {
    font-size: 2rem;
    font-size: clamp(1rem, 5vw, 2.5rem);
    line-height: 1.125;
    font-weight: 600;
    letter-spacing: -0.0015em;
    font-family: var(--inter);
  }
}

@media (max-width: 480px) {
  .section-heading {
    font-size: 1.5rem;
    font-size: clamp(1rem, 5vw, 2.5rem);
    line-height: 1.1428571429;
    font-weight: 600;
    letter-spacing: 0.007em;
    font-family: var(--inter);
  }
}

.body-heading {
  font-size:4rem;
  font-size: clamp(2rem, 5.5vw, 4rem);
  line-height:1.05;
  font-weight:600;
  letter-spacing:-0.015em;
  font-family: var(--inter);
}
@media(max-width:999px) {
  .body-heading {
    font-size:3rem;
    font-size: clamp(2rem, 5.5vw, 4rem);
    line-height:1.0625;
    font-weight:600;
    letter-spacing:-0.009em;
    font-family: var(--inter);
  }
}
@media(max-width:699px) {
  .body-heading {
    font-size:2rem;
    line-height:1.1;
    font-weight:600;
    letter-spacing:0em;
    font-family: var(--inter);
  }
}
.body-copy__bold {
  font-size:1.25rem;
  font-size: clamp(.875rem, 3.5vw, 1.25rem);
  line-height:1.381002381;
  font-weight:600;
  letter-spacing:-.015em;
  font-family: var(--inter);
}
@media(max-width:699px) {
  .body-copy__bold {
    font-size:0.875rem;
    font-size: clamp(.875rem, 3.5vw, 1.25rem);
    line-height:1.2353641176;
    font-weight:600;
    letter-spacing: -0.0275em;
    font-family: var(--inter);
  }
}
.body-copy {
  font-size:1rem;
  font-size: clamp(.875rem, 3.5vw, 1rem);
  line-height:1.2353641176;
  font-weight:400;
  letter-spacing:-0.022em;
  font-family: var(--inter);
}
@media(max-width:699px) {
  .body-copy {
    font-size:0.875rem;
    font-size: clamp(.875rem, 3.5vw, 1rem);
    line-height:1.2857742857;
    font-weight:400;
    letter-spacing:-0.016em;
    font-family: var(--inter);
  }
}

.card-heading {
  font-size:1.5rem;
  font-size:clamp(1rem, 5vw, 1.5rem);
  line-height:1.1428571429;
  font-weight:600;
  letter-spacing:.007em;
  font-family: var(--inter);
}
@media(max-width:999px) {
  .card-heading {
    font-size:1.5rem;
    font-size:clamp(1rem, 5vw, 1.5rem);
    line-height:1.1666666667;
    font-weight:600;
    letter-spacing:.009em;
    font-family: var(--inter);
  }
}
@media(max-width:699px) {
  .card-heading {
    font-size:1rem;
    font-size:clamp(1rem, 5vw, 1.5rem);
    line-height:1.1904761905;
    font-weight:600;
    letter-spacing:.011em;
    font-family: var(--inter);
  }
}

.card-subheading {
  font-size:1.25rem;
  font-size: clamp(1.25rem, 2.25vw, 1.5rem);
  line-height:1.381002381;
  font-weight:600;
  letter-spacing:-.015em;
  font-family: var(--inter);
}
@media(max-width:699px) {
  .card-subheading {
    font-size:1rem;
    font-size: clamp(1rem, 4.5vw, 1.25rem);
    line-height:1.2353641176;
    font-weight:600;
    letter-spacing: -0.0275em;
    font-family: var(--inter);
  }
}

.hero-heading {
  font-size: 2rem;
  font-size: clamp(1.5rem, 1.1253rem + 2.9979vw, 2.375rem); /* clamp generated for 200 to 667px */
  line-height: 1.125;
  font-weight: 600;
  letter-spacing: 0.004em;
  font-family: var(--inter);
}

@media screen and (min-width: 700px) {
  .hero-heading {
    font-size: 3rem;
    font-size: clamp(2.5rem, 5vw, 3rem);
    line-height: 1.08349;
    letter-spacing: -0.002em;
  }
}

@media screen and (min-width: 1000px) and (orientation: portrait) {
  .hero-heading {
    font-size: 3.5rem;
    font-size: clamp(3rem, 4vw, 3rem);
    line-height: 1.07143;
    letter-spacing: -0.005em;
  }
}
@media screen and (min-width: 1000px) and (orientation: landscape) {
  .hero-heading {
    font-size: 3rem;
    font-size: clamp(3rem, 3.5vw, 3rem);
  }
}

.hero-subheading {
  font-size: 1.125rem;
  font-size: clamp(0.875rem, 0.6609rem + 1.7131vw, 1.375rem); /* clamp generated for 200 to 667px */
  line-height: 1.21053;
  font-weight: 400;
  font-family: var(--inter);
}

@media screen and (min-width: 700px) {
  .hero-subheading {
    font-size: 1.5rem;
    font-size: clamp(1.625rem, 3vw, 1.75rem);
    line-height: 1.16667;
    letter-spacing: 0.009em;
  }
}

@media screen and (min-width: 1000px) {
  .hero-subheading {
    font-size: 1.75rem;
    font-size: clamp(1.1875rem, 2.5vw, 1.75rem);
    line-height: 1.14286;
    letter-spacing: 0.007em;
  }
}


/* Regular families */
.display1 {
  --lineHeightInEms: calc(1em * var(--quarterstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --sm: calc(var(--lineHeightInEms) * calc(1 / var(--halfstep)));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.022em;
  font-size: calc(1em * var(--wholestep) * var(--wholestep) * var(--wholestep));
  font-weight: 400;
  line-height: var(--quarterstep);
  font-family: 'GF Playfair Display', 'Times New Roman', 'Times', serif;
}

.display2 {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.022em;
  font-size: calc(1em * var(--wholestep) * var(--wholestep));
  font-weight: 400;
  line-height: var(--halfstep);
  font-family: 'GF Playfair Display', 'Times New Roman', 'Times', serif;
}

.title1 {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.022em;
  font-size: calc(1em * var(--wholestep) * var(--halfstep));
  font-weight: 400;
  line-height: var(--halfstep);
  font-family: 'GF Playfair Display', 'Times New Roman', 'Times', serif;
}

.title2 {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.02em;
  font-size: calc(1em * var(--wholestep));
  font-weight: 400;
  line-height: var(--halfstep);
  font-family: 'GF Playfair Display', 'Times New Roman', 'Times', serif;
}

.title3 {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.017em;
  font-size: calc(1em * var(--halfstep));
  font-weight: 400;
  line-height: var(--halfstep);
  font-family: 'GF Playfair Display', 'Times New Roman', 'Times', serif;
}

.heading {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.014em;
  font-size: calc(1em * var(--quarterstep));
  font-weight: 600;
  line-height: var(--halfstep);
  font-family: 'Inter', 'Arial';
}

.subheading {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.007em;
  font-size: calc(1em / var(--quarterstep));
  font-weight: 400;
  line-height: var(--halfstep);
  font-family: 'Inter', 'Arial';
}

.body {
  --lineHeightInEms: calc(1em * var(--wholestep));
  --md: calc(var(--base) / var(--wholestep));
  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--base) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.011em;
  cursor: default;
  font-size: 1em;
  font-weight: 400;
  line-height: var(--wholestep);
  font-family: 'Inter', 'Arial';
}

.callout {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.009em;
  font-size: calc(1em / var(--eighthstep));
  font-weight: 400;
  line-height: var(--halfstep);
  font-family: 'Inter', 'Arial';
}

.label {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.004em;
  font-size: calc((1em / var(--quarterstep)) / var(--eighthstep));
  font-weight: 500;
  line-height: var(--halfstep);
  position: static;
  top: 6.235em;
  font-family: 'Inter', 'Arial';
}

.caption {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.007em;
  font-size: calc(1em / var(--halfstep));
  font-weight: 400;
  line-height: var(--halfstep);
  font-family: 'Inter', 'Arial';
}

.overline {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: 0.0618em;
  text-transform: uppercase;
  font-size: calc(1em / var(--halfstep));
  font-weight: 400;
  line-height: var(--halfstep);
  font-family: 'Inter', 'Arial';
}

/* Bold Families */

.display1__bold {
  --lineHeightInEms: calc(1em * var(--quarterstep));
  --md: calc(var(--base) / var(--wholestep));
  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--base) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.022em;
  font-size: calc(1em * var(--wholestep) * var(--wholestep) * var(--wholestep));
  font-weight: 700;
  line-height: var(--quarterstep);
  font-family: 'GF Playfair Display', 'Times New Roman', 'Times', serif;
}

.display2__bold {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.022em;
  font-size: calc(1em * var(--wholestep) * var(--wholestep));
  font-weight: 700;
  line-height: var(--halfstep);
  font-family: 'GF Playfair Display', 'Times New Roman', 'Times', serif;
}

.title1__bold {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.022em;
  font-size: calc(1em * var(--wholestep) * var(--halfstep));
  font-weight: 600;
  line-height: var(--halfstep);
  font-family: 'GF Playfair Display', 'Times New Roman', 'Times', serif;
}

.title2__bold {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.02em;
  font-size: calc(1em * var(--wholestep));
  font-weight: 600;
  line-height: var(--halfstep);
  font-family: 'GF Playfair Display', 'Times New Roman', 'Times', serif;
}

.title3__bold {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.017em;
  font-size: calc(1em * var(--halfstep));
  font-weight: 600;
  line-height: var(--halfstep);
  font-family: 'GF Playfair Display', 'Times New Roman', 'Times', serif;
}

.heading__bold {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.014em;
  font-size: calc(1em * var(--quarterstep));
  font-weight: 700;
  line-height: var(--halfstep);
  font-family: 'Inter', 'Arial';
}

.subheading__bold {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.007em;
  font-size: calc(1em / var(--quarterstep));
  font-weight: 600;
  line-height: var(--halfstep);
  font-family: 'Inter', 'Arial';
}

.body__bold {
  --lineHeightInEms: calc(1em * var(--wholestep));
  --md: calc(var(--base) / var(--wholestep));
  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--base) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.011em;
  padding: 0;
  font-size: 1em;
  font-weight: 600;
  line-height: var(--wholestep);
  position: relative;
  font-family: 'Inter', 'Arial';
}

.callout__bold {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.009em;
  font-size: calc(1em / var(--eighthstep));
  font-weight: 600;
  line-height: var(--halfstep);
  text-decoration: none;
  font-family: 'Inter', 'Arial';
}

.label__bold {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.004em;
  font-size: calc((1em / var(--quarterstep)) / var(--eighthstep));
  font-weight: 700;
  line-height: var(--halfstep);
  font-family: 'Inter', 'Arial';
}

.caption__bold {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: -0.007em;
  font-size: calc(1em / var(--halfstep));
  font-weight: 600;
  line-height: var(--halfstep);
  font-family: 'Inter', 'Arial';
}

.overline__bold {
  --lineHeightInEms: calc(1em * var(--halfstep));
  --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));

  --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
  --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
  --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));

  --lg: calc(var(--lineHeightInEms) * var(--wholestep));
  --xl: calc(var(--lg) * var(--wholestep));
  --2xl: calc(var(--xl) * var(--wholestep));

  letter-spacing: 0.0618em;
  text-transform: uppercase;
  font-size: calc(1em / var(--halfstep));
  font-weight: 600;
  line-height: var(--halfstep);
  font-family: 'Inter', 'Arial';
}
/* JP: Bugs
@media screen and (max-width: 991px) {
  body {
    font-size: 1vw;
  }
}
*/
@media screen and (max-width: 767px) {
  .display1__bold,
  .display1 {
    font-size: 3.3301em;
  }
}

@media screen and (max-width: 479px) {
  .display1 {
    font-size: 2.61743em;
  }

  .display1__bold {
    font-size: 2.61743em;
  }

  .display2 {
    font-size: 2.05818em;
  }

  .display2__bold {
    font-size: 2.05818em;
  }

  .title1__bold,
  .title1 {
    font-size: 1.82285em;
  }
}

.rich-text {
  color: var(--light__onsurface_lkv);
}

.rich-text h1 {
  color: var(--light__onsurface_lkv);
  letter-spacing: -0.035em;
  margin-top: 0;
  margin-bottom: 1.129em;
  font-size: calc(1em * var(--wholestep) * var(--wholestep) * var(--wholestep));
  font-weight: 700;
  line-height: 1.129;
}

.rich-text h2 {
  letter-spacing: -0.022em;
  margin-top: 0.786096em;
  margin-bottom: 0.345984em;
  font-size: calc(1em * var(--wholestep) * var(--wholestep));
  font-weight: 700;
  line-height: var(--halfstep);
}

.rich-text h3 {
  letter-spacing: -0.022em;
  margin-top: 0.786096em;
  margin-bottom: 0.345984em;
  font-size: 2.058em;
  font-weight: 600;
  line-height: var(--halfstep);
}

.rich-text h4 {
  letter-spacing: -0.02em;
  margin-top: 0.786096em;
  margin-bottom: 0.345984em;
  font-size: 1.618em;
  font-weight: 600;
  line-height: var(--halfstep);
}

.rich-text h5 {
  letter-spacing: -0.017em;
  margin-top: 0.786096em;
  margin-bottom: 0.345984em;
  font-size: 1.272em;
  font-weight: 600;
  line-height: var(--halfstep);
}

.rich-text h6 {
  letter-spacing: -0.014em;
  margin-top: 0.786096em;
  margin-bottom: 0.345984em;
  font-size: 1.129em;
  font-weight: 600;
  line-height: var(--halfstep);
}

.rich-text ol {
  margin-top: 1em;
  margin-bottom: 1em;
}

.rich-text ul {
  margin-top: 1em;
  margin-bottom: 1em;
  padding-left: 2.618em;
  line-height: var(--wholestep);
}

.rich-text blockquote {
  margin-top: 1em;
  margin-bottom: 1em;
  padding: 0 1.618em;
  font-size: 1em;
  line-height: var(--wholestep);
}

.rich-text p {
  color: var(--light__onsurfacevariant_lkv);
  margin-top: 1em;
  margin-bottom: 1em;
}

.rich-text a {
  color: var(--light__primary_lkv);
  font-weight: 700;
}

.rich-text figcaption {
  color: var(--light__onsurfacevariant_lkv);
  margin-top: 1em;
  margin-bottom: 1em;
  font-size: calc(1em / var(--halfstep));
  line-height: var(--wholestep);
}

.rich-text img {
  margin-top: 1em;
  margin-bottom: 11em;
}


/* State Layers */
.state-layer {
  z-index: 0;
  opacity: 0;
  pointer-events: none;
  background-color: #000;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;

  transition: opacity 0.2s ease;
}

*:hover > .state-layer{
  opacity: 0.08;
}

*:active > .state-layer{
  opacity: 0.14;
}

*:focus > .state-layer{
  opacity: 0.14;
}

/* Normalization */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/**
 * Remove default margin.
 */
body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */
a:active,
a:hover {
  outline: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
  font-style: italic;
}

/***JP: Bugged; makes header on home bigger
/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 *//*
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
****/

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}



/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
  overflow: visible;
}

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 * 4. CUSTOM FOR WEBFLOW: Removed the input[type="submit"] selector to reduce
 *    specificity and defer to the .w-button selector
 */
button,
html input[type="button"],
input[type="reset"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: po'Inter', 'Arial';
  /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type='checkbox'],
input[type='radio'] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. CUSTOM FOR WEBFLOW: changed from `textfield` to `none` to normalize iOS rounded input
 * 2. CUSTOM FOR WEBFLOW: box-sizing: content-box rule removed
 *    (similar to normalize.css >=4.0.0)
 */
input[type='search'] {
  -webkit-appearance: none;
  /* 1 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type='search']::-webkit-search-cancel-button,
input[type='search']::-webkit-search-decoration {
  -webkit-appearance: none;
}


/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold;
}

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}


/* Sections */
.section__leastPadding {
  padding: 1.618em 4.235em;
}

.section__lessPadding {
  padding: 2.618em 4.235em;
}

.section__default {
  padding: 4.235em;
}

.section__morePadding {
  padding: 6.852em 4.235em;
}

.section__mostPadding {
  padding: 11.087em 4.235em;
}

@media screen and (max-width: 991px) {
  .section__lessPadding {
    padding: 2.618em 1.618em;
  }

  .section__default {
    padding: 1.618em;
  }

  .section__morePadding {
    padding: 4.235em 1.618em;
  }

  .section__mostPadding {
    padding: 6.852em 1.618em;
  }

}


/* Containers */
.container__xs {
  margin-left: auto;
  margin-right: auto;
  max-width: 988.875px;
}

.container__sm {
  margin-left: auto;
  margin-right: auto;
  max-width: 1257px;
}

.container__md {
  margin-left: auto;
  margin-right: auto;
  max-width: 1600px;
}

.container__lg {
  margin-left: auto;
  margin-right: auto;
  max-width: 1806.4px;
}

.container__xl {
  margin-left: auto;
  margin-right: auto;
  max-width: none;
}

.max-w-container-80ch {
  margin-left: auto;
  margin-right: auto;
  max-width: 80ch;
}

/* Flex Boxes */
/* Set display to flex */

.display__flex-h {
  display: flex;
}

.display__flex-v {
  display: flex;
  flex-direction: column;
}


/* Grid */
.grid {
  display: grid;
  grid-template-rows: auto;
}

.grid.col__2 {
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: auto;
}

.grid.col__3 {
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto;
}

.grid.col__4 {
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: auto;
}

.grid.col__5 {
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: auto;
}

.grid.col__6 {
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: auto;
}

.grid.col__7 {
  grid-template-columns: repeat(7, 1fr);
  grid-template-rows: auto;
}

.grid.col__8 {
  grid-template-columns: repeat(8, 1fr);
  grid-template-rows: auto;
}

.grid.col__9 {
  grid-template-columns: repeat(9, 1fr);
  grid-template-rows: auto;
}

.grid.col__10 {
  grid-template-columns: repeat(10, 1fr);
  grid-template-rows: auto;
}


.grid.col__11 {
  grid-template-columns: repeat(11, 1fr);
  grid-template-rows: auto;
}

.grid.col__12 {
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: auto;
}

/* Aligning Children */
/* Item Alignment */

.align-items__stretch {
  align-items: stretch;
}

.align-items__center {
  align-items: center;
}

.align-items__top {
  align-items: flex-start;
}

.align-items__start {
  align-items: flex-start;
}


/* Gaps */
/* Gaps */
 


.gap__2xs {
  gap: var(--2xs);
}

.gap__xs {
  gap: var(--xs);
}

.gap__sm {
  gap: var(--sm);
}

.gap__md {
  gap: var(--md);
}

.gap__lg {
  gap: var(--lg);
}

.gap__xl {
  gap: var(--xl);
}

.gap__2xl {
  gap: var(--2xl);
}


/* Justifying Content */
.justify-content__start {
    justify-content: flex-start;
}

.justify-content__center {
    justify-content: center;
}

.justify-content__end {
    justify-content: end;
}

.justify-content__space-between {
    justify-content: space-between;
}

.justify-content__space-around {
    justify-content: space-between;
}


/* Margins */
 

.m-top__2xs {
  margin-top: var(--2xs);
}
.m-top__xs {
  margin-top: var(--xs);
}
.m-top__sm {
  margin-top: var(--sm);
}
.m-top__md {
  margin-top: var(--md);
}
.m-top__lg {
  margin-top: var(--lg);
}
.m-top__xl {
  margin-top: var(--xl);
}
.m-top__2xl {
  margin-top: var(--2xl);
}

.m-right__2xs {
  margin-right: var(--2xs);
}
.m-right__xs {
  margin-right: var(--xs);
}
.m-right__sm {
  margin-right: var(--sm);
}
.m-right__md {
  margin-right: var(--md);
}
.m-right__lg {
  margin-right: var(--lg);
}
.m-right__xl {
  margin-right: var(--xl);
}
.m-right__2xl {
  margin-right: var(--2xl);
}

.m-bottom__2xs {
  margin-bottom: var(--2xs);
}
.m-bottom__xs {
  margin-bottom: var(--xs);
}
.m-bottom__sm {
  margin-bottom: var(--sm);
}
.m-bottom__md {
  margin-bottom: var(--md);
}
.m-bottom__lg {
  margin-bottom: var(--lg);
}
.m-bottom__xl {
  margin-bottom: var(--xl);
}
.m-bottom__2xl {
  margin-bottom: var(--2xl);
}

.m-left__2xs {
  margin-left: var(--2xs);
}
.m-left__xs {
  margin-left: var(--xs);
}
.m-left__sm {
  margin-left: var(--sm);
}
.m-left__md {
  margin-left: var(--md);
}
.m-left__lg {
  margin-left: var(--lg);
}
.m-left__xl {
  margin-left: var(--xl);
}
.m-left__2xl {
  margin-left: var(--2xl);
}

.display1.m-top__2xs,
.display2.m-top__2xs,
.title1.m-top__2xs,
.title2.m-top__2xs,
.title3.m-top__2xs,
.heading.m-top__2xs,
.subheading.m-top__2xs,
.body.m-top__2xs,
.callout.m-top__2xs,
.label.m-top__2xs,
.caption.m-top__2xs,
.overline.m-top__2xs,
.display1__bold.m-top__2xs,
.display2__bold.m-top__2xs,
.title1__bold.m-top__2xs,
.title2__bold.m-top__2xs,
.title3__bold.m-top__2xs,
.heading__bold.m-top__2xs,
.subheading__bold.m-top__2xs,
.body__bold.m-top__2xs,
.callout__bold.m-top__2xs,
.label__bold.m-top__2xs,
.caption__bold.m-top__2xs,
.overline__bold.m-top__2xs {
  margin-top: var(--2xs);
}

.display1.m-top__xs,
.display2.m-top__xs,
.title1.m-top__xs,
.title2.m-top__xs,
.title3.m-top__xs,
.heading.m-top__xs,
.subheading.m-top__xs,
.body.m-top__xs,
.callout.m-top__xs,
.label.m-top__xs,
.caption.m-top__xs,
.overline.m-top__xs,
.display1__bold.m-top__xs,
.display2__bold.m-top__xs,
.title1__bold.m-top__xs,
.title2__bold.m-top__xs,
.title3__bold.m-top__xs,
.heading__bold.m-top__xs,
.subheading__bold.m-top__xs,
.body__bold.m-top__xs,
.callout__bold.m-top__xs,
.label__bold.m-top__xs,
.caption__bold.m-top__xs,
.overline__bold.m-top__xs {
  margin-top: var(--xs);
}

.display1.m-top__sm,
.display2.m-top__sm,
.title1.m-top__sm,
.title2.m-top__sm,
.title3.m-top__sm,
.heading.m-top__sm,
.subheading.m-top__sm,
.body.m-top__sm,
.callout.m-top__sm,
.label.m-top__sm,
.caption.m-top__sm,
.overline.m-top__sm,
.display1__bold.m-top__sm,
.display2__bold.m-top__sm,
.title1__bold.m-top__sm,
.title2__bold.m-top__sm,
.title3__bold.m-top__sm,
.heading__bold.m-top__sm,
.subheading__bold.m-top__sm,
.body__bold.m-top__sm,
.callout__bold.m-top__sm,
.label__bold.m-top__sm,
.caption__bold.m-top__sm,
.overline__bold.m-top__sm {
  margin-top: var(--sm);
}
/* Repeat for other margin directions and sizes */

.display1.m-top__md,
.display2.m-top__md,
.title1.m-top__md,
.title2.m-top__md,
.title3.m-top__md,
.heading.m-top__md,
.subheading.m-top__md,
.body.m-top__md,
.callout.m-top__md,
.label.m-top__md,
.caption.m-top__md,
.overline.m-top__md,
.display1__bold.m-top__md,
.display2__bold.m-top__md,
.title1__bold.m-top__md,
.title2__bold.m-top__md,
.title3__bold.m-top__md,
.heading__bold.m-top__md,
.subheading__bold.m-top__md,
.body__bold.m-top__md,
.callout__bold.m-top__md,
.label__bold.m-top__md,
.caption__bold.m-top__md,
.overline__bold.m-top__md {
  margin-top: var(--md);
}

.display1.m-top__lg,
.display2.m-top__lg,
.title1.m-top__lg,
.title2.m-top__lg,
.title3.m-top__lg,
.heading.m-top__lg,
.subheading.m-top__lg,
.body.m-top__lg,
.callout.m-top__lg,
.label.m-top__lg,
.caption.m-top__lg,
.overline.m-top__lg,
.display1__bold.m-top__lg,
.display2__bold.m-top__lg,
.title1__bold.m-top__lg,
.title2__bold.m-top__lg,
.title3__bold.m-top__lg,
.heading__bold.m-top__lg,
.subheading__bold.m-top__lg,
.body__bold.m-top__lg,
.callout__bold.m-top__lg,
.label__bold.m-top__lg,
.caption__bold.m-top__lg,
.overline__bold.m-top__lg {
  margin-top: var(--lg);
}

.display1.m-top__xl,
.display2.m-top__xl,
.title1.m-top__xl,
.title2.m-top__xl,
.title3.m-top__xl,
.heading.m-top__xl,
.subheading.m-top__xl,
.body.m-top__xl,
.callout.m-top__xl,
.label.m-top__xl,
.caption.m-top__xl,
.overline.m-top__xl,
.display1__bold.m-top__xl,
.display2__bold.m-top__xl,
.title1__bold.m-top__xl,
.title2__bold.m-top__xl,
.title3__bold.m-top__xl,
.heading__bold.m-top__xl,
.subheading__bold.m-top__xl,
.body__bold.m-top__xl,
.callout__bold.m-top__xl,
.label__bold.m-top__xl,
.caption__bold.m-top__xl,
.overline__bold.m-top__xl {
  margin-top: var(--xl);
}

.display1.m-top__2xl,
.display2.m-top__2xl,
.title1.m-top__2xl,
.title2.m-top__2xl,
.title3.m-top__2xl,
.heading.m-top__2xl,
.subheading.m-top__2xl,
.body.m-top__2xl,
.callout.m-top__2xl,
.label.m-top__2xl,
.caption.m-top__2xl,
.overline.m-top__2xl,
.display1__bold.m-top__2xl,
.display2__bold.m-top__2xl,
.title1__bold.m-top__2xl,
.title2__bold.m-top__2xl,
.title3__bold.m-top__2xl,
.heading__bold.m-top__2xl,
.subheading__bold.m-top__2xl,
.body__bold.m-top__2xl,
.callout__bold.m-top__2xl,
.label__bold.m-top__2xl,
.caption__bold.m-top__2xl,
.overline__bold.m-top__2xl {
  margin-top: var(--2xl);
}

.display1.m-right__2xs,
.display2.m-right__2xs,
.title1.m-right__2xs,
.title2.m-right__2xs,
.title3.m-right__2xs,
.heading.m-right__2xs,
.subheading.m-right__2xs,
.body.m-right__2xs,
.callout.m-right__2xs,
.label.m-right__2xs,
.caption.m-right__2xs,
.overline.m-right__2xs,
.display1__bold.m-right__2xs,
.display2__bold.m-right__2xs,
.title1__bold.m-right__2xs,
.title2__bold.m-right__2xs,
.title3__bold.m-right__2xs,
.heading__bold.m-right__2xs,
.subheading__bold.m-right__2xs,
.body__bold.m-right__2xs,
.callout__bold.m-right__2xs,
.label__bold.m-right__2xs,
.caption__bold.m-right__2xs,
.overline__bold.m-right__2xs {
  margin-right: var(--2xs);
}

.display1.m-right__xs,
.display2.m-right__xs,
.title1.m-right__xs,
.title2.m-right__xs,
.title3.m-right__xs,
.heading.m-right__xs,
.subheading.m-right__xs,
.body.m-right__xs,
.callout.m-right__xs,
.label.m-right__xs,
.caption.m-right__xs,
.overline.m-right__xs,
.display1__bold.m-right__xs,
.display2__bold.m-right__xs,
.title1__bold.m-right__xs,
.title2__bold.m-right__xs,
.title3__bold.m-right__xs,
.heading__bold.m-right__xs,
.subheading__bold.m-right__xs,
.body__bold.m-right__xs,
.callout__bold.m-right__xs,
.label__bold.m-right__xs,
.caption__bold.m-right__xs,
.overline__bold.m-right__xs {
  margin-right: var(--xs);
}

.display1.m-right__sm,
.display2.m-right__sm,
.title1.m-right__sm,
.title2.m-right__sm,
.title3.m-right__sm,
.heading.m-right__sm,
.subheading.m-right__sm,
.body.m-right__sm,
.callout.m-right__sm,
.label.m-right__sm,
.caption.m-right__sm,
.overline.m-right__sm,
.display1__bold.m-right__sm,
.display2__bold.m-right__sm,
.title1__bold.m-right__sm,
.title2__bold.m-right__sm,
.title3__bold.m-right__sm,
.heading__bold.m-right__sm,
.subheading__bold.m-right__sm,
.body__bold.m-right__sm,
.callout__bold.m-right__sm,
.label__bold.m-right__sm,
.caption__bold.m-right__sm,
.overline__bold.m-right__sm {
  margin-right: var(--sm);
}
/* Repeat for other margin directions and sizes */

.display1.m-right__md,
.display2.m-right__md,
.title1.m-right__md,
.title2.m-right__md,
.title3.m-right__md,
.heading.m-right__md,
.subheading.m-right__md,
.body.m-right__md,
.callout.m-right__md,
.label.m-right__md,
.caption.m-right__md,
.overline.m-right__md,
.display1__bold.m-right__md,
.display2__bold.m-right__md,
.title1__bold.m-right__md,
.title2__bold.m-right__md,
.title3__bold.m-right__md,
.heading__bold.m-right__md,
.subheading__bold.m-right__md,
.body__bold.m-right__md,
.callout__bold.m-right__md,
.label__bold.m-right__md,
.caption__bold.m-right__md,
.overline__bold.m-right__md {
  margin-right: var(--md);
}

.display1.m-right__lg,
.display2.m-right__lg,
.title1.m-right__lg,
.title2.m-right__lg,
.title3.m-right__lg,
.heading.m-right__lg,
.subheading.m-right__lg,
.body.m-right__lg,
.callout.m-right__lg,
.label.m-right__lg,
.caption.m-right__lg,
.overline.m-right__lg,
.display1__bold.m-right__lg,
.display2__bold.m-right__lg,
.title1__bold.m-right__lg,
.title2__bold.m-right__lg,
.title3__bold.m-right__lg,
.heading__bold.m-right__lg,
.subheading__bold.m-right__lg,
.body__bold.m-right__lg,
.callout__bold.m-right__lg,
.label__bold.m-right__lg,
.caption__bold.m-right__lg,
.overline__bold.m-right__lg {
  margin-right: var(--lg);
}

.display1.m-right__xl,
.display2.m-right__xl,
.title1.m-right__xl,
.title2.m-right__xl,
.title3.m-right__xl,
.heading.m-right__xl,
.subheading.m-right__xl,
.body.m-right__xl,
.callout.m-right__xl,
.label.m-right__xl,
.caption.m-right__xl,
.overline.m-right__xl,
.display1__bold.m-right__xl,
.display2__bold.m-right__xl,
.title1__bold.m-right__xl,
.title2__bold.m-right__xl,
.title3__bold.m-right__xl,
.heading__bold.m-right__xl,
.subheading__bold.m-right__xl,
.body__bold.m-right__xl,
.callout__bold.m-right__xl,
.label__bold.m-right__xl,
.caption__bold.m-right__xl,
.overline__bold.m-right__xl {
  margin-right: var(--xl);
}

.display1.m-right__2xl,
.display2.m-right__2xl,
.title1.m-right__2xl,
.title2.m-right__2xl,
.title3.m-right__2xl,
.heading.m-right__2xl,
.subheading.m-right__2xl,
.body.m-right__2xl,
.callout.m-right__2xl,
.label.m-right__2xl,
.caption.m-right__2xl,
.overline.m-right__2xl,
.display1__bold.m-right__2xl,
.display2__bold.m-right__2xl,
.title1__bold.m-right__2xl,
.title2__bold.m-right__2xl,
.title3__bold.m-right__2xl,
.heading__bold.m-right__2xl,
.subheading__bold.m-right__2xl,
.body__bold.m-right__2xl,
.callout__bold.m-right__2xl,
.label__bold.m-right__2xl,
.caption__bold.m-right__2xl,
.overline__bold.m-right__2xl {
  margin-right: var(--2xl);
}

.display1.m-bottom__2xs,
.display2.m-bottom__2xs,
.title1.m-bottom__2xs,
.title2.m-bottom__2xs,
.title3.m-bottom__2xs,
.heading.m-bottom__2xs,
.subheading.m-bottom__2xs,
.body.m-bottom__2xs,
.callout.m-bottom__2xs,
.label.m-bottom__2xs,
.caption.m-bottom__2xs,
.overline.m-bottom__2xs,
.display1__bold.m-bottom__2xs,
.display2__bold.m-bottom__2xs,
.title1__bold.m-bottom__2xs,
.title2__bold.m-bottom__2xs,
.title3__bold.m-bottom__2xs,
.heading__bold.m-bottom__2xs,
.subheading__bold.m-bottom__2xs,
.body__bold.m-bottom__2xs,
.callout__bold.m-bottom__2xs,
.label__bold.m-bottom__2xs,
.caption__bold.m-bottom__2xs,
.overline__bold.m-bottom__2xs {
  margin-bottom: var(--2xs);
}

.display1.m-bottom__xs,
.display2.m-bottom__xs,
.title1.m-bottom__xs,
.title2.m-bottom__xs,
.title3.m-bottom__xs,
.heading.m-bottom__xs,
.subheading.m-bottom__xs,
.body.m-bottom__xs,
.callout.m-bottom__xs,
.label.m-bottom__xs,
.caption.m-bottom__xs,
.overline.m-bottom__xs,
.display1__bold.m-bottom__xs,
.display2__bold.m-bottom__xs,
.title1__bold.m-bottom__xs,
.title2__bold.m-bottom__xs,
.title3__bold.m-bottom__xs,
.heading__bold.m-bottom__xs,
.subheading__bold.m-bottom__xs,
.body__bold.m-bottom__xs,
.callout__bold.m-bottom__xs,
.label__bold.m-bottom__xs,
.caption__bold.m-bottom__xs,
.overline__bold.m-bottom__xs {
  margin-bottom: var(--xs);
}

.display1.m-bottom__sm,
.display2.m-bottom__sm,
.title1.m-bottom__sm,
.title2.m-bottom__sm,
.title3.m-bottom__sm,
.heading.m-bottom__sm,
.subheading.m-bottom__sm,
.body.m-bottom__sm,
.callout.m-bottom__sm,
.label.m-bottom__sm,
.caption.m-bottom__sm,
.overline.m-bottom__sm,
.display1__bold.m-bottom__sm,
.display2__bold.m-bottom__sm,
.title1__bold.m-bottom__sm,
.title2__bold.m-bottom__sm,
.title3__bold.m-bottom__sm,
.heading__bold.m-bottom__sm,
.subheading__bold.m-bottom__sm,
.body__bold.m-bottom__sm,
.callout__bold.m-bottom__sm,
.label__bold.m-bottom__sm,
.caption__bold.m-bottom__sm,
.overline__bold.m-bottom__sm {
  margin-bottom: var(--sm);
}
/* Repeat for other margin directions and sizes */

.display1.m-bottom__md,
.display2.m-bottom__md,
.title1.m-bottom__md,
.title2.m-bottom__md,
.title3.m-bottom__md,
.heading.m-bottom__md,
.subheading.m-bottom__md,
.body.m-bottom__md,
.callout.m-bottom__md,
.label.m-bottom__md,
.caption.m-bottom__md,
.overline.m-bottom__md,
.display1__bold.m-bottom__md,
.display2__bold.m-bottom__md,
.title1__bold.m-bottom__md,
.title2__bold.m-bottom__md,
.title3__bold.m-bottom__md,
.heading__bold.m-bottom__md,
.subheading__bold.m-bottom__md,
.body__bold.m-bottom__md,
.callout__bold.m-bottom__md,
.label__bold.m-bottom__md,
.caption__bold.m-bottom__md,
.overline__bold.m-bottom__md {
  margin-bottom: var(--md);
}

.display1.m-bottom__lg,
.display2.m-bottom__lg,
.title1.m-bottom__lg,
.title2.m-bottom__lg,
.title3.m-bottom__lg,
.heading.m-bottom__lg,
.subheading.m-bottom__lg,
.body.m-bottom__lg,
.callout.m-bottom__lg,
.label.m-bottom__lg,
.caption.m-bottom__lg,
.overline.m-bottom__lg,
.display1__bold.m-bottom__lg,
.display2__bold.m-bottom__lg,
.title1__bold.m-bottom__lg,
.title2__bold.m-bottom__lg,
.title3__bold.m-bottom__lg,
.heading__bold.m-bottom__lg,
.subheading__bold.m-bottom__lg,
.body__bold.m-bottom__lg,
.callout__bold.m-bottom__lg,
.label__bold.m-bottom__lg,
.caption__bold.m-bottom__lg,
.overline__bold.m-bottom__lg {
  margin-bottom: var(--lg);
}

.display1.m-bottom__xl,
.display2.m-bottom__xl,
.title1.m-bottom__xl,
.title2.m-bottom__xl,
.title3.m-bottom__xl,
.heading.m-bottom__xl,
.subheading.m-bottom__xl,
.body.m-bottom__xl,
.callout.m-bottom__xl,
.label.m-bottom__xl,
.caption.m-bottom__xl,
.overline.m-bottom__xl,
.display1__bold.m-bottom__xl,
.display2__bold.m-bottom__xl,
.title1__bold.m-bottom__xl,
.title2__bold.m-bottom__xl,
.title3__bold.m-bottom__xl,
.heading__bold.m-bottom__xl,
.subheading__bold.m-bottom__xl,
.body__bold.m-bottom__xl,
.callout__bold.m-bottom__xl,
.label__bold.m-bottom__xl,
.caption__bold.m-bottom__xl,
.overline__bold.m-bottom__xl {
  margin-bottom: var(--xl);
}

.display1.m-bottom__2xl,
.display2.m-bottom__2xl,
.title1.m-bottom__2xl,
.title2.m-bottom__2xl,
.title3.m-bottom__2xl,
.heading.m-bottom__2xl,
.subheading.m-bottom__2xl,
.body.m-bottom__2xl,
.callout.m-bottom__2xl,
.label.m-bottom__2xl,
.caption.m-bottom__2xl,
.overline.m-bottom__2xl,
.display1__bold.m-bottom__2xl,
.display2__bold.m-bottom__2xl,
.title1__bold.m-bottom__2xl,
.title2__bold.m-bottom__2xl,
.title3__bold.m-bottom__2xl,
.heading__bold.m-bottom__2xl,
.subheading__bold.m-bottom__2xl,
.body__bold.m-bottom__2xl,
.callout__bold.m-bottom__2xl,
.label__bold.m-bottom__2xl,
.caption__bold.m-bottom__2xl,
.overline__bold.m-bottom__2xl {
  margin-bottom: var(--2xl);
}

.display1.m-left__2xs,
.display2.m-left__2xs,
.title1.m-left__2xs,
.title2.m-left__2xs,
.title3.m-left__2xs,
.heading.m-left__2xs,
.subheading.m-left__2xs,
.body.m-left__2xs,
.callout.m-left__2xs,
.label.m-left__2xs,
.caption.m-left__2xs,
.overline.m-left__2xs,
.display1__bold.m-left__2xs,
.display2__bold.m-left__2xs,
.title1__bold.m-left__2xs,
.title2__bold.m-left__2xs,
.title3__bold.m-left__2xs,
.heading__bold.m-left__2xs,
.subheading__bold.m-left__2xs,
.body__bold.m-left__2xs,
.callout__bold.m-left__2xs,
.label__bold.m-left__2xs,
.caption__bold.m-left__2xs,
.overline__bold.m-left__2xs {
  margin-left: var(--2xs);
}

.display1.m-left__xs,
.display2.m-left__xs,
.title1.m-left__xs,
.title2.m-left__xs,
.title3.m-left__xs,
.heading.m-left__xs,
.subheading.m-left__xs,
.body.m-left__xs,
.callout.m-left__xs,
.label.m-left__xs,
.caption.m-left__xs,
.overline.m-left__xs,
.display1__bold.m-left__xs,
.display2__bold.m-left__xs,
.title1__bold.m-left__xs,
.title2__bold.m-left__xs,
.title3__bold.m-left__xs,
.heading__bold.m-left__xs,
.subheading__bold.m-left__xs,
.body__bold.m-left__xs,
.callout__bold.m-left__xs,
.label__bold.m-left__xs,
.caption__bold.m-left__xs,
.overline__bold.m-left__xs {
  margin-left: var(--xs);
}

.display1.m-left__sm,
.display2.m-left__sm,
.title1.m-left__sm,
.title2.m-left__sm,
.title3.m-left__sm,
.heading.m-left__sm,
.subheading.m-left__sm,
.body.m-left__sm,
.callout.m-left__sm,
.label.m-left__sm,
.caption.m-left__sm,
.overline.m-left__sm,
.display1__bold.m-left__sm,
.display2__bold.m-left__sm,
.title1__bold.m-left__sm,
.title2__bold.m-left__sm,
.title3__bold.m-left__sm,
.heading__bold.m-left__sm,
.subheading__bold.m-left__sm,
.body__bold.m-left__sm,
.callout__bold.m-left__sm,
.label__bold.m-left__sm,
.caption__bold.m-left__sm,
.overline__bold.m-left__sm {
  margin-left: var(--sm);
}
/* Repeat for other margin directions and sizes */

.display1.m-left__md,
.display2.m-left__md,
.title1.m-left__md,
.title2.m-left__md,
.title3.m-left__md,
.heading.m-left__md,
.subheading.m-left__md,
.body.m-left__md,
.callout.m-left__md,
.label.m-left__md,
.caption.m-left__md,
.overline.m-left__md,
.display1__bold.m-left__md,
.display2__bold.m-left__md,
.title1__bold.m-left__md,
.title2__bold.m-left__md,
.title3__bold.m-left__md,
.heading__bold.m-left__md,
.subheading__bold.m-left__md,
.body__bold.m-left__md,
.callout__bold.m-left__md,
.label__bold.m-left__md,
.caption__bold.m-left__md,
.overline__bold.m-left__md {
  margin-left: var(--md);
}

.display1.m-left__lg,
.display2.m-left__lg,
.title1.m-left__lg,
.title2.m-left__lg,
.title3.m-left__lg,
.heading.m-left__lg,
.subheading.m-left__lg,
.body.m-left__lg,
.callout.m-left__lg,
.label.m-left__lg,
.caption.m-left__lg,
.overline.m-left__lg,
.display1__bold.m-left__lg,
.display2__bold.m-left__lg,
.title1__bold.m-left__lg,
.title2__bold.m-left__lg,
.title3__bold.m-left__lg,
.heading__bold.m-left__lg,
.subheading__bold.m-left__lg,
.body__bold.m-left__lg,
.callout__bold.m-left__lg,
.label__bold.m-left__lg,
.caption__bold.m-left__lg,
.overline__bold.m-left__lg {
  margin-left: var(--lg);
}

.display1.m-left__xl,
.display2.m-left__xl,
.title1.m-left__xl,
.title2.m-left__xl,
.title3.m-left__xl,
.heading.m-left__xl,
.subheading.m-left__xl,
.body.m-left__xl,
.callout.m-left__xl,
.label.m-left__xl,
.caption.m-left__xl,
.overline.m-left__xl,
.display1__bold.m-left__xl,
.display2__bold.m-left__xl,
.title1__bold.m-left__xl,
.title2__bold.m-left__xl,
.title3__bold.m-left__xl,
.heading__bold.m-left__xl,
.subheading__bold.m-left__xl,
.body__bold.m-left__xl,
.callout__bold.m-left__xl,
.label__bold.m-left__xl,
.caption__bold.m-left__xl,
.overline__bold.m-left__xl {
  margin-left: var(--xl);
}

.display1.m-left__2xl,
.display2.m-left__2xl,
.title1.m-left__2xl,
.title2.m-left__2xl,
.title3.m-left__2xl,
.heading.m-left__2xl,
.subheading.m-left__2xl,
.body.m-left__2xl,
.callout.m-left__2xl,
.label.m-left__2xl,
.caption.m-left__2xl,
.overline.m-left__2xl,
.display1__bold.m-left__2xl,
.display2__bold.m-left__2xl,
.title1__bold.m-left__2xl,
.title2__bold.m-left__2xl,
.title3__bold.m-left__2xl,
.heading__bold.m-left__2xl,
.subheading__bold.m-left__2xl,
.body__bold.m-left__2xl,
.callout__bold.m-left__2xl,
.label__bold.m-left__2xl,
.caption__bold.m-left__2xl,
.overline__bold.m-left__2xl {
  margin-left: var(--2xl);
}


/* Overflow */
.overflow__hidden {
  overflow: hidden;
}

.overflow__visible {
  overflow: visible;
}

.overflow__scroll {
  overflow: scroll;
}

.overflow__auto {
  overflow: auto;
}


/* Padding */
 

.p-top__2xs {
  padding-top: var(--2xs);
}
.p-top__xs {
  padding-top: var(--xs);
}
.p-top__sm {
  padding-top: var(--sm);
}
.p-top__md {
  padding-top: var(--md);
}
.p-top__lg {
  padding-top: var(--lg);
}
.p-top__xl {
  padding-top: var(--xl);
}
.p-top__2xl {
  padding-top: var(--2xl);
}

.p-right__2xs {
  padding-right: var(--2xs);
}
.p-right__xs {
  padding-right: var(--xs);
}
.p-right__sm {
  padding-right: var(--sm);
}
.p-right__md {
  padding-right: var(--md);
}
.p-right__lg {
  padding-right: var(--lg);
}
.p-right__xl {
  padding-right: var(--xl);
}
.p-right__2xl {
  padding-right: var(--2xl);
}

.p-bottom__2xs {
  padding-bottom: var(--2xs);
}
.p-bottom__xs {
  padding-bottom: var(--xs);
}
.p-bottom__sm {
  padding-bottom: var(--sm);
}
.p-bottom__md {
  padding-bottom: var(--md);
}
.p-bottom__lg {
  padding-bottom: var(--lg);
}
.p-bottom__xl {
  padding-bottom: var(--xl);
}
.p-bottom__2xl {
  padding-bottom: var(--2xl);
}

.p-left__2xs {
  padding-left: var(--2xs);
}
.p-left__xs {
  padding-left: var(--xs);
}
.p-left__sm {
  padding-left: var(--sm);
}
.p-left__md {
  padding-left: var(--md);
}
.p-left__lg {
  padding-left: var(--lg);
}
.p-left__xl {
  padding-left: var(--xl);
}
.p-left__2xl {
  padding-left: var(--2xl);
}

.display1.p-top__2xs,
.display2.p-top__2xs,
.title1.p-top__2xs,
.title2.p-top__2xs,
.title3.p-top__2xs,
.heading.p-top__2xs,
.subheading.p-top__2xs,
.body.p-top__2xs,
.callout.p-top__2xs,
.label.p-top__2xs,
.caption.p-top__2xs,
.overline.p-top__2xs,
.display1__bold.p-top__2xs,
.display2__bold.p-top__2xs,
.title1__bold.p-top__2xs,
.title2__bold.p-top__2xs,
.title3__bold.p-top__2xs,
.heading__bold.p-top__2xs,
.subheading__bold.p-top__2xs,
.body__bold.p-top__2xs,
.callout__bold.p-top__2xs,
.label__bold.p-top__2xs,
.caption__bold.p-top__2xs,
.overline__bold.p-top__2xs {
  padding-top: var(--2xs);
}

.display1.p-top__xs,
.display2.p-top__xs,
.title1.p-top__xs,
.title2.p-top__xs,
.title3.p-top__xs,
.heading.p-top__xs,
.subheading.p-top__xs,
.body.p-top__xs,
.callout.p-top__xs,
.label.p-top__xs,
.caption.p-top__xs,
.overline.p-top__xs,
.display1__bold.p-top__xs,
.display2__bold.p-top__xs,
.title1__bold.p-top__xs,
.title2__bold.p-top__xs,
.title3__bold.p-top__xs,
.heading__bold.p-top__xs,
.subheading__bold.p-top__xs,
.body__bold.p-top__xs,
.callout__bold.p-top__xs,
.label__bold.p-top__xs,
.caption__bold.p-top__xs,
.overline__bold.p-top__xs {
  padding-top: var(--xs);
}

.display1.p-top__sm,
.display2.p-top__sm,
.title1.p-top__sm,
.title2.p-top__sm,
.title3.p-top__sm,
.heading.p-top__sm,
.subheading.p-top__sm,
.body.p-top__sm,
.callout.p-top__sm,
.label.p-top__sm,
.caption.p-top__sm,
.overline.p-top__sm,
.display1__bold.p-top__sm,
.display2__bold.p-top__sm,
.title1__bold.p-top__sm,
.title2__bold.p-top__sm,
.title3__bold.p-top__sm,
.heading__bold.p-top__sm,
.subheading__bold.p-top__sm,
.body__bold.p-top__sm,
.callout__bold.p-top__sm,
.label__bold.p-top__sm,
.caption__bold.p-top__sm,
.overline__bold.p-top__sm {
  padding-top: var(--sm);
}
/* Repeat for other margin directions and sizes */

.display1.p-top__md,
.display2.p-top__md,
.title1.p-top__md,
.title2.p-top__md,
.title3.p-top__md,
.heading.p-top__md,
.subheading.p-top__md,
.body.p-top__md,
.callout.p-top__md,
.label.p-top__md,
.caption.p-top__md,
.overline.p-top__md,
.display1__bold.p-top__md,
.display2__bold.p-top__md,
.title1__bold.p-top__md,
.title2__bold.p-top__md,
.title3__bold.p-top__md,
.heading__bold.p-top__md,
.subheading__bold.p-top__md,
.body__bold.p-top__md,
.callout__bold.p-top__md,
.label__bold.p-top__md,
.caption__bold.p-top__md,
.overline__bold.p-top__md {
  padding-top: var(--md);
}

.display1.p-top__lg,
.display2.p-top__lg,
.title1.p-top__lg,
.title2.p-top__lg,
.title3.p-top__lg,
.heading.p-top__lg,
.subheading.p-top__lg,
.body.p-top__lg,
.callout.p-top__lg,
.label.p-top__lg,
.caption.p-top__lg,
.overline.p-top__lg,
.display1__bold.p-top__lg,
.display2__bold.p-top__lg,
.title1__bold.p-top__lg,
.title2__bold.p-top__lg,
.title3__bold.p-top__lg,
.heading__bold.p-top__lg,
.subheading__bold.p-top__lg,
.body__bold.p-top__lg,
.callout__bold.p-top__lg,
.label__bold.p-top__lg,
.caption__bold.p-top__lg,
.overline__bold.p-top__lg {
  padding-top: var(--lg);
}

.display1.p-top__xl,
.display2.p-top__xl,
.title1.p-top__xl,
.title2.p-top__xl,
.title3.p-top__xl,
.heading.p-top__xl,
.subheading.p-top__xl,
.body.p-top__xl,
.callout.p-top__xl,
.label.p-top__xl,
.caption.p-top__xl,
.overline.p-top__xl,
.display1__bold.p-top__xl,
.display2__bold.p-top__xl,
.title1__bold.p-top__xl,
.title2__bold.p-top__xl,
.title3__bold.p-top__xl,
.heading__bold.p-top__xl,
.subheading__bold.p-top__xl,
.body__bold.p-top__xl,
.callout__bold.p-top__xl,
.label__bold.p-top__xl,
.caption__bold.p-top__xl,
.overline__bold.p-top__xl {
  padding-top: var(--xl);
}

.display1.p-top__2xl,
.display2.p-top__2xl,
.title1.p-top__2xl,
.title2.p-top__2xl,
.title3.p-top__2xl,
.heading.p-top__2xl,
.subheading.p-top__2xl,
.body.p-top__2xl,
.callout.p-top__2xl,
.label.p-top__2xl,
.caption.p-top__2xl,
.overline.p-top__2xl,
.display1__bold.p-top__2xl,
.display2__bold.p-top__2xl,
.title1__bold.p-top__2xl,
.title2__bold.p-top__2xl,
.title3__bold.p-top__2xl,
.heading__bold.p-top__2xl,
.subheading__bold.p-top__2xl,
.body__bold.p-top__2xl,
.callout__bold.p-top__2xl,
.label__bold.p-top__2xl,
.caption__bold.p-top__2xl,
.overline__bold.p-top__2xl {
  padding-top: var(--2xl);
}

.display1.p-right__2xs,
.display2.p-right__2xs,
.title1.p-right__2xs,
.title2.p-right__2xs,
.title3.p-right__2xs,
.heading.p-right__2xs,
.subheading.p-right__2xs,
.body.p-right__2xs,
.callout.p-right__2xs,
.label.p-right__2xs,
.caption.p-right__2xs,
.overline.p-right__2xs,
.display1__bold.p-right__2xs,
.display2__bold.p-right__2xs,
.title1__bold.p-right__2xs,
.title2__bold.p-right__2xs,
.title3__bold.p-right__2xs,
.heading__bold.p-right__2xs,
.subheading__bold.p-right__2xs,
.body__bold.p-right__2xs,
.callout__bold.p-right__2xs,
.label__bold.p-right__2xs,
.caption__bold.p-right__2xs,
.overline__bold.p-right__2xs {
  padding-right: var(--2xs);
}

.display1.p-right__xs,
.display2.p-right__xs,
.title1.p-right__xs,
.title2.p-right__xs,
.title3.p-right__xs,
.heading.p-right__xs,
.subheading.p-right__xs,
.body.p-right__xs,
.callout.p-right__xs,
.label.p-right__xs,
.caption.p-right__xs,
.overline.p-right__xs,
.display1__bold.p-right__xs,
.display2__bold.p-right__xs,
.title1__bold.p-right__xs,
.title2__bold.p-right__xs,
.title3__bold.p-right__xs,
.heading__bold.p-right__xs,
.subheading__bold.p-right__xs,
.body__bold.p-right__xs,
.callout__bold.p-right__xs,
.label__bold.p-right__xs,
.caption__bold.p-right__xs,
.overline__bold.p-right__xs {
  padding-right: var(--xs);
}

.display1.p-right__sm,
.display2.p-right__sm,
.title1.p-right__sm,
.title2.p-right__sm,
.title3.p-right__sm,
.heading.p-right__sm,
.subheading.p-right__sm,
.body.p-right__sm,
.callout.p-right__sm,
.label.p-right__sm,
.caption.p-right__sm,
.overline.p-right__sm,
.display1__bold.p-right__sm,
.display2__bold.p-right__sm,
.title1__bold.p-right__sm,
.title2__bold.p-right__sm,
.title3__bold.p-right__sm,
.heading__bold.p-right__sm,
.subheading__bold.p-right__sm,
.body__bold.p-right__sm,
.callout__bold.p-right__sm,
.label__bold.p-right__sm,
.caption__bold.p-right__sm,
.overline__bold.p-right__sm {
  padding-right: var(--sm);
}
/* Repeat for other margin directions and sizes */

.display1.p-right__md,
.display2.p-right__md,
.title1.p-right__md,
.title2.p-right__md,
.title3.p-right__md,
.heading.p-right__md,
.subheading.p-right__md,
.body.p-right__md,
.callout.p-right__md,
.label.p-right__md,
.caption.p-right__md,
.overline.p-right__md,
.display1__bold.p-right__md,
.display2__bold.p-right__md,
.title1__bold.p-right__md,
.title2__bold.p-right__md,
.title3__bold.p-right__md,
.heading__bold.p-right__md,
.subheading__bold.p-right__md,
.body__bold.p-right__md,
.callout__bold.p-right__md,
.label__bold.p-right__md,
.caption__bold.p-right__md,
.overline__bold.p-right__md {
  padding-right: var(--md);
}

.display1.p-right__lg,
.display2.p-right__lg,
.title1.p-right__lg,
.title2.p-right__lg,
.title3.p-right__lg,
.heading.p-right__lg,
.subheading.p-right__lg,
.body.p-right__lg,
.callout.p-right__lg,
.label.p-right__lg,
.caption.p-right__lg,
.overline.p-right__lg,
.display1__bold.p-right__lg,
.display2__bold.p-right__lg,
.title1__bold.p-right__lg,
.title2__bold.p-right__lg,
.title3__bold.p-right__lg,
.heading__bold.p-right__lg,
.subheading__bold.p-right__lg,
.body__bold.p-right__lg,
.callout__bold.p-right__lg,
.label__bold.p-right__lg,
.caption__bold.p-right__lg,
.overline__bold.p-right__lg {
  padding-right: var(--lg);
}

.display1.p-right__xl,
.display2.p-right__xl,
.title1.p-right__xl,
.title2.p-right__xl,
.title3.p-right__xl,
.heading.p-right__xl,
.subheading.p-right__xl,
.body.p-right__xl,
.callout.p-right__xl,
.label.p-right__xl,
.caption.p-right__xl,
.overline.p-right__xl,
.display1__bold.p-right__xl,
.display2__bold.p-right__xl,
.title1__bold.p-right__xl,
.title2__bold.p-right__xl,
.title3__bold.p-right__xl,
.heading__bold.p-right__xl,
.subheading__bold.p-right__xl,
.body__bold.p-right__xl,
.callout__bold.p-right__xl,
.label__bold.p-right__xl,
.caption__bold.p-right__xl,
.overline__bold.p-right__xl {
  padding-right: var(--xl);
}

.display1.p-right__2xl,
.display2.p-right__2xl,
.title1.p-right__2xl,
.title2.p-right__2xl,
.title3.p-right__2xl,
.heading.p-right__2xl,
.subheading.p-right__2xl,
.body.p-right__2xl,
.callout.p-right__2xl,
.label.p-right__2xl,
.caption.p-right__2xl,
.overline.p-right__2xl,
.display1__bold.p-right__2xl,
.display2__bold.p-right__2xl,
.title1__bold.p-right__2xl,
.title2__bold.p-right__2xl,
.title3__bold.p-right__2xl,
.heading__bold.p-right__2xl,
.subheading__bold.p-right__2xl,
.body__bold.p-right__2xl,
.callout__bold.p-right__2xl,
.label__bold.p-right__2xl,
.caption__bold.p-right__2xl,
.overline__bold.p-right__2xl {
  padding-right: var(--2xl);
}

.display1.p-bottom__2xs,
.display2.p-bottom__2xs,
.title1.p-bottom__2xs,
.title2.p-bottom__2xs,
.title3.p-bottom__2xs,
.heading.p-bottom__2xs,
.subheading.p-bottom__2xs,
.body.p-bottom__2xs,
.callout.p-bottom__2xs,
.label.p-bottom__2xs,
.caption.p-bottom__2xs,
.overline.p-bottom__2xs,
.display1__bold.p-bottom__2xs,
.display2__bold.p-bottom__2xs,
.title1__bold.p-bottom__2xs,
.title2__bold.p-bottom__2xs,
.title3__bold.p-bottom__2xs,
.heading__bold.p-bottom__2xs,
.subheading__bold.p-bottom__2xs,
.body__bold.p-bottom__2xs,
.callout__bold.p-bottom__2xs,
.label__bold.p-bottom__2xs,
.caption__bold.p-bottom__2xs,
.overline__bold.p-bottom__2xs {
  padding-bottom: var(--2xs);
}

.display1.p-bottom__xs,
.display2.p-bottom__xs,
.title1.p-bottom__xs,
.title2.p-bottom__xs,
.title3.p-bottom__xs,
.heading.p-bottom__xs,
.subheading.p-bottom__xs,
.body.p-bottom__xs,
.callout.p-bottom__xs,
.label.p-bottom__xs,
.caption.p-bottom__xs,
.overline.p-bottom__xs,
.display1__bold.p-bottom__xs,
.display2__bold.p-bottom__xs,
.title1__bold.p-bottom__xs,
.title2__bold.p-bottom__xs,
.title3__bold.p-bottom__xs,
.heading__bold.p-bottom__xs,
.subheading__bold.p-bottom__xs,
.body__bold.p-bottom__xs,
.callout__bold.p-bottom__xs,
.label__bold.p-bottom__xs,
.caption__bold.p-bottom__xs,
.overline__bold.p-bottom__xs {
  padding-bottom: var(--xs);
}

.display1.p-bottom__sm,
.display2.p-bottom__sm,
.title1.p-bottom__sm,
.title2.p-bottom__sm,
.title3.p-bottom__sm,
.heading.p-bottom__sm,
.subheading.p-bottom__sm,
.body.p-bottom__sm,
.callout.p-bottom__sm,
.label.p-bottom__sm,
.caption.p-bottom__sm,
.overline.p-bottom__sm,
.display1__bold.p-bottom__sm,
.display2__bold.p-bottom__sm,
.title1__bold.p-bottom__sm,
.title2__bold.p-bottom__sm,
.title3__bold.p-bottom__sm,
.heading__bold.p-bottom__sm,
.subheading__bold.p-bottom__sm,
.body__bold.p-bottom__sm,
.callout__bold.p-bottom__sm,
.label__bold.p-bottom__sm,
.caption__bold.p-bottom__sm,
.overline__bold.p-bottom__sm {
  padding-bottom: var(--sm);
}
/* Repeat for other margin directions and sizes */

.display1.p-bottom__md,
.display2.p-bottom__md,
.title1.p-bottom__md,
.title2.p-bottom__md,
.title3.p-bottom__md,
.heading.p-bottom__md,
.subheading.p-bottom__md,
.body.p-bottom__md,
.callout.p-bottom__md,
.label.p-bottom__md,
.caption.p-bottom__md,
.overline.p-bottom__md,
.display1__bold.p-bottom__md,
.display2__bold.p-bottom__md,
.title1__bold.p-bottom__md,
.title2__bold.p-bottom__md,
.title3__bold.p-bottom__md,
.heading__bold.p-bottom__md,
.subheading__bold.p-bottom__md,
.body__bold.p-bottom__md,
.callout__bold.p-bottom__md,
.label__bold.p-bottom__md,
.caption__bold.p-bottom__md,
.overline__bold.p-bottom__md {
  padding-bottom: var(--md);
}

.display1.p-bottom__lg,
.display2.p-bottom__lg,
.title1.p-bottom__lg,
.title2.p-bottom__lg,
.title3.p-bottom__lg,
.heading.p-bottom__lg,
.subheading.p-bottom__lg,
.body.p-bottom__lg,
.callout.p-bottom__lg,
.label.p-bottom__lg,
.caption.p-bottom__lg,
.overline.p-bottom__lg,
.display1__bold.p-bottom__lg,
.display2__bold.p-bottom__lg,
.title1__bold.p-bottom__lg,
.title2__bold.p-bottom__lg,
.title3__bold.p-bottom__lg,
.heading__bold.p-bottom__lg,
.subheading__bold.p-bottom__lg,
.body__bold.p-bottom__lg,
.callout__bold.p-bottom__lg,
.label__bold.p-bottom__lg,
.caption__bold.p-bottom__lg,
.overline__bold.p-bottom__lg {
  padding-bottom: var(--lg);
}

.display1.p-bottom__xl,
.display2.p-bottom__xl,
.title1.p-bottom__xl,
.title2.p-bottom__xl,
.title3.p-bottom__xl,
.heading.p-bottom__xl,
.subheading.p-bottom__xl,
.body.p-bottom__xl,
.callout.p-bottom__xl,
.label.p-bottom__xl,
.caption.p-bottom__xl,
.overline.p-bottom__xl,
.display1__bold.p-bottom__xl,
.display2__bold.p-bottom__xl,
.title1__bold.p-bottom__xl,
.title2__bold.p-bottom__xl,
.title3__bold.p-bottom__xl,
.heading__bold.p-bottom__xl,
.subheading__bold.p-bottom__xl,
.body__bold.p-bottom__xl,
.callout__bold.p-bottom__xl,
.label__bold.p-bottom__xl,
.caption__bold.p-bottom__xl,
.overline__bold.p-bottom__xl {
  padding-bottom: var(--xl);
}

.display1.p-bottom__2xl,
.display2.p-bottom__2xl,
.title1.p-bottom__2xl,
.title2.p-bottom__2xl,
.title3.p-bottom__2xl,
.heading.p-bottom__2xl,
.subheading.p-bottom__2xl,
.body.p-bottom__2xl,
.callout.p-bottom__2xl,
.label.p-bottom__2xl,
.caption.p-bottom__2xl,
.overline.p-bottom__2xl,
.display1__bold.p-bottom__2xl,
.display2__bold.p-bottom__2xl,
.title1__bold.p-bottom__2xl,
.title2__bold.p-bottom__2xl,
.title3__bold.p-bottom__2xl,
.heading__bold.p-bottom__2xl,
.subheading__bold.p-bottom__2xl,
.body__bold.p-bottom__2xl,
.callout__bold.p-bottom__2xl,
.label__bold.p-bottom__2xl,
.caption__bold.p-bottom__2xl,
.overline__bold.p-bottom__2xl {
  padding-bottom: var(--2xl);
}

.display1.p-left__2xs,
.display2.p-left__2xs,
.title1.p-left__2xs,
.title2.p-left__2xs,
.title3.p-left__2xs,
.heading.p-left__2xs,
.subheading.p-left__2xs,
.body.p-left__2xs,
.callout.p-left__2xs,
.label.p-left__2xs,
.caption.p-left__2xs,
.overline.p-left__2xs,
.display1__bold.p-left__2xs,
.display2__bold.p-left__2xs,
.title1__bold.p-left__2xs,
.title2__bold.p-left__2xs,
.title3__bold.p-left__2xs,
.heading__bold.p-left__2xs,
.subheading__bold.p-left__2xs,
.body__bold.p-left__2xs,
.callout__bold.p-left__2xs,
.label__bold.p-left__2xs,
.caption__bold.p-left__2xs,
.overline__bold.p-left__2xs {
  padding-left: var(--2xs);
}

.display1.p-left__xs,
.display2.p-left__xs,
.title1.p-left__xs,
.title2.p-left__xs,
.title3.p-left__xs,
.heading.p-left__xs,
.subheading.p-left__xs,
.body.p-left__xs,
.callout.p-left__xs,
.label.p-left__xs,
.caption.p-left__xs,
.overline.p-left__xs,
.display1__bold.p-left__xs,
.display2__bold.p-left__xs,
.title1__bold.p-left__xs,
.title2__bold.p-left__xs,
.title3__bold.p-left__xs,
.heading__bold.p-left__xs,
.subheading__bold.p-left__xs,
.body__bold.p-left__xs,
.callout__bold.p-left__xs,
.label__bold.p-left__xs,
.caption__bold.p-left__xs,
.overline__bold.p-left__xs {
  padding-left: var(--xs);
}

.display1.p-left__sm,
.display2.p-left__sm,
.title1.p-left__sm,
.title2.p-left__sm,
.title3.p-left__sm,
.heading.p-left__sm,
.subheading.p-left__sm,
.body.p-left__sm,
.callout.p-left__sm,
.label.p-left__sm,
.caption.p-left__sm,
.overline.p-left__sm,
.display1__bold.p-left__sm,
.display2__bold.p-left__sm,
.title1__bold.p-left__sm,
.title2__bold.p-left__sm,
.title3__bold.p-left__sm,
.heading__bold.p-left__sm,
.subheading__bold.p-left__sm,
.body__bold.p-left__sm,
.callout__bold.p-left__sm,
.label__bold.p-left__sm,
.caption__bold.p-left__sm,
.overline__bold.p-left__sm {
  padding-left: var(--sm);
}
/* Repeat for other margin directions and sizes */

.display1.p-left__md,
.display2.p-left__md,
.title1.p-left__md,
.title2.p-left__md,
.title3.p-left__md,
.heading.p-left__md,
.subheading.p-left__md,
.body.p-left__md,
.callout.p-left__md,
.label.p-left__md,
.caption.p-left__md,
.overline.p-left__md,
.display1__bold.p-left__md,
.display2__bold.p-left__md,
.title1__bold.p-left__md,
.title2__bold.p-left__md,
.title3__bold.p-left__md,
.heading__bold.p-left__md,
.subheading__bold.p-left__md,
.body__bold.p-left__md,
.callout__bold.p-left__md,
.label__bold.p-left__md,
.caption__bold.p-left__md,
.overline__bold.p-left__md {
  padding-left: var(--md);
}

.display1.p-left__lg,
.display2.p-left__lg,
.title1.p-left__lg,
.title2.p-left__lg,
.title3.p-left__lg,
.heading.p-left__lg,
.subheading.p-left__lg,
.body.p-left__lg,
.callout.p-left__lg,
.label.p-left__lg,
.caption.p-left__lg,
.overline.p-left__lg,
.display1__bold.p-left__lg,
.display2__bold.p-left__lg,
.title1__bold.p-left__lg,
.title2__bold.p-left__lg,
.title3__bold.p-left__lg,
.heading__bold.p-left__lg,
.subheading__bold.p-left__lg,
.body__bold.p-left__lg,
.callout__bold.p-left__lg,
.label__bold.p-left__lg,
.caption__bold.p-left__lg,
.overline__bold.p-left__lg {
  padding-left: var(--lg);
}

.display1.p-left__xl,
.display2.p-left__xl,
.title1.p-left__xl,
.title2.p-left__xl,
.title3.p-left__xl,
.heading.p-left__xl,
.subheading.p-left__xl,
.body.p-left__xl,
.callout.p-left__xl,
.label.p-left__xl,
.caption.p-left__xl,
.overline.p-left__xl,
.display1__bold.p-left__xl,
.display2__bold.p-left__xl,
.title1__bold.p-left__xl,
.title2__bold.p-left__xl,
.title3__bold.p-left__xl,
.heading__bold.p-left__xl,
.subheading__bold.p-left__xl,
.body__bold.p-left__xl,
.callout__bold.p-left__xl,
.label__bold.p-left__xl,
.caption__bold.p-left__xl,
.overline__bold.p-left__xl {
  padding-left: var(--xl);
}

.display1.p-left__2xl,
.display2.p-left__2xl,
.title1.p-left__2xl,
.title2.p-left__2xl,
.title3.p-left__2xl,
.heading.p-left__2xl,
.subheading.p-left__2xl,
.body.p-left__2xl,
.callout.p-left__2xl,
.label.p-left__2xl,
.caption.p-left__2xl,
.overline.p-left__2xl,
.display1__bold.p-left__2xl,
.display2__bold.p-left__2xl,
.title1__bold.p-left__2xl,
.title2__bold.p-left__2xl,
.title3__bold.p-left__2xl,
.heading__bold.p-left__2xl,
.subheading__bold.p-left__2xl,
.body__bold.p-left__2xl,
.callout__bold.p-left__2xl,
.label__bold.p-left__2xl,
.caption__bold.p-left__2xl,
.overline__bold.p-left__2xl {
  padding-left: var(--2xl);
}


/* Position */
.position__static {
  position: static;
}

.position__relative {
  position: relative;
}

.position__absolute {
  position: absolute;
}

.position__fixed {
  position: fixed;
}

.position__sticky {
  position: sticky;
  top: 0;
}


/* Align-Self */
.align-self__start {
  align-self: start;
}

.align-self__end {
  align-self: end;
}

.align-self__center {
  align-self: center;
}

.align-self__stretch {
  align-self: stretch;
}

.align-self__baseline {
  align-self: baseline;
}

.align-self__auto {
  align-self: auto;
}


/* Aspect Ratios */
.aspect__16x9 {
  aspect-ratio: 16 / 9;
}

.aspect__4x3 {
  aspect-ratio: 4 / 3;

}

.aspect__3x2 {
  aspect-ratio: 3 / 2;
}

.aspect__9x16 {
  aspect-ratio: 9 / 16;
}

.aspect__1x1 {
  aspect-ratio: 1;
}


/* Background Colors */
.bg-light__primary {
  background-color: var(--light__primary_lkv);
  color: var(--light__onprimary_lkv);
}

.bg-light__onprimary {
  background-color: var(--light__onprimary_lkv);
  color: var(--light__primary_lkv);
}

.bg-light__primarycontainer {
  background-color: var(--light__primarycontainer_lkv);
  color: var(--light__onprimarycontainer_lkv);
}

.bg-light__onprimarycontainer {
  background-color: var(--light__onprimarycontainer_lkv);
  color: var(--light__primarycontainer_lkv);
}

.bg-light__secondary {
  background-color: var(--light__secondary_lkv);
  color: var(--light__onsecondary_lkv);
}

.bg-light__onsecondary {
  background-color: var(--light__onsecondary_lkv);
  color: var(--light__secondary_lkv);
}

.bg-light__secondarycontainer {
  background-color: var(--light__secondarycontainer_lkv);
  color: var(--light__onsecondarycontainer_lkv);
}

.bg-light__onsecondarycontainer {
  background-color: var(--light__onsecondarycontainer_lkv);
  color: var(--light__secondarycontainer_lkv);
}

.bg-light__tertiary {
  background-color: var(--light__tertiary_lkv);
  color: var(--light__ontertiary_lkv);
}

.bg-light__ontertiary {
  background-color: var(--light__ontertiary_lkv);
  color: var(--light__tertiary_lkv);
}

.bg-light__tertiarycontainer {
  background-color: var(--light__tertiarycontainer_lkv);
  color: var(--light__ontertiarycontainer_lkv);
}

.bg-light__ontertiarycontainer {
  background-color: var(--light__ontertiarycontainer_lkv);
  color: var(--light__tertiarycontainer_lkv);
}

.bg-light__error {
  background-color: var(--light__error_lkv);
  color: var(--light__onerror_lkv);
}

.bg-light__onerror {
  background-color: var(--light__onerror_lkv);
  color: var(--light__error_lkv);
}

.bg-light__errorcontainer {
  background-color: var(--light__errorcontainer_lkv);
  color: var(--light__onerrorcontainer_lkv);
}

.bg-light__onerrorcontainer {
  background-color: var(--light__onerrorcontainer_lkv);
  color: var(--light__errorcontainer_lkv);
}

.bg-light__background {
  background-color: var(--light__background_lkv);
  color: var(--light__onbackground_lkv);
}

.bg-light__onbackground {
  background-color: var(--light__onbackground_lkv);
  color: var(--light__background_lkv);
}

.bg-light__surface {
  background-color: var(--light__surface_lkv);
  color: var(--light__onsurface_lkv);
}

.bg-light__onsurface {
  background-color: var(--light__onsurface_lkv);
  color: var(--light__surface_lkv);
}

.bg-light__surfacevariant {
  background-color: var(--light__surfacevariant_lkv);
  color: var(--light__onsurfacevariant_lkv);
}

.bg-light__onsurfacevariant {
  background-color: var(--light__onsurfacevariant_lkv);
  color: var(--light__surfacevariant_lkv);
}

.bg-light__outline {
  background-color: var(--light__outline_lkv);
  color: var(--light__surface_lkv);
}

.bg-light__outlinevariant {
  background-color: var(--light__outlinevariant_lkv);
  color: var(--light__onsurface_lkv);
}

.bg-light__shadow {
  background-color: var(--light__shadow_lkv);
  color: var(--light__surface_lkv);
}

.bg-light__scrim {
  background-color: var(--light__scrim_lkv);
  color: var(--light__surface_lkv);
}

.bg-light__inversesurface {
  background-color: var(--light__inversesurface_lkv);
  color: var(--light__inverseonsurface_lkv);
}

.bg-light__inverseonsurface {
  background-color: var(--light__inverseonsurface_lkv);
  color: var(--light__inversesurface_lkv);
}

.bg-light__inverseprimary {
  background-color: var(--light__inverseprimary_lkv);
  color: var(--light__onprimarycontainer_lkv);
}

.bg-light__success {
  background-color: var(--light__success_lkv);
  color: var(--light__onsuccess_lkv);
}

.bg-light__successcontainer {
  background-color: var(--light__successcontainer_lkv);
  color: var(--light__onsuccesscontainer_lkv);
}

.bg-light__onsuccess {
  background-color: var(--light__onsuccess_lkv);
  color: var(--light__success_lkv);
}

.bg-light__onsuccesscontainer {
  background-color: var(--light__onsuccesscontainer_lkv);
  color: var(--light__successcontainer_lkv);
}

.bg-light__warning {
  background-color: var(--light__warning_lkv);
  color: var(--light__onwarning_lkv);
}

.bg-light__warningcontainer {
  background-color: var(--light__warningcontainer_lkv);
  color: var(--light__onwarningcontainer_lkv);
}

.bg-light__onwarning {
  background-color: var(--light__onwarning_lkv);
  color: var(--light__warning_lkv);
}

.bg-light__onwarningcontainer {
  background-color: var(--light__onwarningcontainer_lkv);
  color: var(--light__warningcontainer_lkv);
}

.bg-light__info {
  background-color: var(--light__info_lkv);
  color: var(--light__oninfo_lkv);
}

.bg-light__infocontainer {
  background-color: var(--light__infocontainer_lkv);
  color: var(--light__oninfocontainer_lkv);
}

.bg-light__oninfo {
  background-color: var(--light__oninfo_lkv);
  color: var(--light__info_lkv);
}

.bg-light__oninfocontainer {
  background-color: var(--light__oninfocontainer_lkv);
  color: var(--light__infocontainer_lkv);
}

.bg-light__primaryfixed {
  background-color: var(--light__primaryfixed_lkv);
  color: var(--light__onprimaryfixed_lkv);
}

.bg-light__primaryfixeddim {
  background-color: var(--light__primaryfixeddim_lkv);
  color: var(--light__onprimaryfixedvariant_lkv);
}

.bg-light__onprimaryfixed {
  background-color: var(--light__onprimaryfixed_lkv);
  color: var(--light__primaryfixed_lkv);
}

.bg-light__onprimaryfixedvariant {
  background-color: var(--light__onprimaryfixedvariant_lkv);
  color: var(--light__primaryfixed_lkv);
}

.bg-light__secondaryfixed {
  background-color: var(--light__secondaryfixed_lkv);
  color: var(--light__onsecondaryfixed_lkv);
}

.bg-light__secondaryfixeddim {
  background-color: var(--light__secondaryfixeddim_lkv);
  color: var(--light__onsecondaryfixedvariant_lkv);
}

.bg-light__onsecondaryfixed {
  background-color: var(--light__onsecondaryfixed_lkv);
  color: var(--light__secondaryfixed_lkv);
}

.bg-light__onsecondaryfixedvariant {
  background-color: var(--light__onsecondaryfixedvariant_lkv);
  color: var(--light__secondaryfixed_lkv);
}

.bg-light__tertiaryfixed {
  background-color: var(--light__tertiaryfixed_lkv);
  color: var(--light__ontertiaryfixed_lkv);
}

.bg-light__tertiaryfixeddim {
  background-color: var(--light__tertiaryfixeddim_lkv);
  color: var(--light__ontertiaryfixedvariant_lkv);
}

.bg-light__ontertiaryfixed {
  background-color: var(--light__ontertiaryfixed_lkv);
  color: var(--light__tertiaryfixed_lkv);
}

.bg-light__ontertiaryfixedvariant {
  background-color: var(--light__ontertiaryfixedvariant_lkv);
  color: var(--light__tertiaryfixed_lkv);
}

.bg-light__surfacedim {
  background-color: var(--light__surfacedim_lkv);
  color: var(--light__onsurface_lkv);
}

.bg-light__surfacebright {
  background-color: var(--light__surfacebright_lkv);
  color: var(--light__onsurface_lkv);
}

.bg-light__surfacecontainerlowest {
  background-color: var(--light__surfacecontainerlowest_lkv);
  color: var(--light__onsurface_lkv);
}

.bg-light__surfacecontainerlow {
  background-color: var(--light__surfacecontainerlow_lkv);
  color: var(--light__onsurface_lkv);
}

.bg-light__surfacecontainer {
  background-color: var(--light__surfacecontainer_lkv);
  color: var(--light__onsurface_lkv);
}

.bg-light__surfacecontainerhigh {
  background-color: var(--light__surfacecontainerhigh_lkv);
  color: var(--light__onsurface_lkv);
}

.bg-light__surfacecontainerhighest {
  background-color: var(--light__surfacecontainerhighest_lkv);
  color: var(--light__onsurface_lkv);
}

.bg-dark__primary {
  background-color: var(--dark__primary_lkv);
  color: var(--dark__onprimary_lkv);
}

.bg-dark__onprimary {
  background-color: var(--dark__onprimary_lkv);
  color: var(--dark__primary_lkv);
}

.bg-dark__primarycontainer {
  background-color: var(--dark__primarycontainer_lkv);
  color: var(--dark__onprimarycontainer_lkv);
}

.bg-dark__onprimarycontainer {
  background-color: var(--dark__onprimarycontainer_lkv);
  color: var(--dark__primarycontainer_lkv);
}

.bg-dark__secondary {
  background-color: var(--dark__secondary_lkv);
  color: var(--dark__onsecondary_lkv);
}

.bg-dark__onsecondary {
  background-color: var(--dark__onsecondary_lkv);
  color: var(--dark__secondary_lkv);
}

.bg-dark__secondarycontainer {
  background-color: var(--dark__secondarycontainer_lkv);
  color: var(--dark__onsecondarycontainer_lkv);
}

.bg-dark__onsecondarycontainer {
  background-color: var(--dark__onsecondarycontainer_lkv);
  color: var(--dark__secondarycontainer_lkv);
}

.bg-dark__tertiary {
  background-color: var(--dark__tertiary_lkv);
  color: var(--dark__ontertiary_lkv);
}

.bg-dark__ontertiary {
  background-color: var(--dark__ontertiary_lkv);
  color: var(--dark__tertiary_lkv);
}

.bg-dark__tertiarycontainer {
  background-color: var(--dark__tertiarycontainer_lkv);
  color: var(--dark__ontertiarycontainer_lkv);
}

.bg-dark__ontertiarycontainer {
  background-color: var(--dark__ontertiarycontainer_lkv);
  color: var(--dark__tertiarycontainer_lkv);
}

.bg-dark__error {
  background-color: var(--dark__error_lkv);
  color: var(--dark__onerror_lkv);
}

.bg-dark__onerror {
  background-color: var(--dark__onerror_lkv);
  color: var(--dark__error_lkv);
}

.bg-dark__errorcontainer {
  background-color: var(--dark__errorcontainer_lkv);
  color: var(--dark__onerrorcontainer_lkv);
}

.bg-dark__onerrorcontainer {
  background-color: var(--dark__onerrorcontainer_lkv);
  color: var(--dark__errorcontainer_lkv);
}

.bg-dark__background {
  background-color: var(--dark__background_lkv);
  color: var(--dark__onbackground_lkv);
}

.bg-dark__onbackground {
  background-color: var(--dark__onbackground_lkv);
  color: var(--dark__background_lkv);
}

.bg-dark__surface {
  background-color: var(--dark__surface_lkv);
  color: var(--dark__onsurface_lkv);
}

.bg-dark__onsurface {
  background-color: var(--dark__onsurface_lkv);
  color: var(--dark__surface_lkv);
}

.bg-dark__surfacevariant {
  background-color: var(--dark__surfacevariant_lkv);
  color: var(--dark__onsurfacevariant_lkv);
}

.bg-dark__onsurfacevariant {
  background-color: var(--dark__onsurfacevariant_lkv);
  color: var(--dark__surfacevariant_lkv);
}

.bg-dark__outline {
  background-color: var(--dark__outline_lkv);
  color: var(--dark__onsurface_lkv);
}

.bg-dark__outlinevariant {
  background-color: var(--dark__outlinevariant_lkv);
  color: var(--dark__onsurface_lkv);
}

.bg-dark__shadow {
  background-color: var(--dark__shadow_lkv);
  color: var(--dark__inversesurface_lkv);
}

.bg-dark__scrim {
  background-color: var(--dark__scrim_lkv);
  color: var(--dark__inversesurface_lkv);
}

.bg-dark__inversesurface {
  background-color: var(--dark__inversesurface_lkv);
  color: var(--dark__inverseonsurface_lkv);
}

.bg-dark__inverseonsurface {
  background-color: var(--dark__inverseonsurface_lkv);
  color: var(--dark__inversesurface_lkv);
}

.bg-dark__inverseprimary {
  background-color: var(--dark__inverseprimary_lkv);
  color: var(--dark__onprimarycontainer_lkv);
}

.bg-dark__success {
  background-color: var(--dark__success_lkv);
  color: var(--dark__onsuccess_lkv);
}

.bg-dark__successcontainer {
  background-color: var(--dark__successcontainer_lkv);
  color: var(--dark__onsuccesscontainer_lkv);
}

.bg-dark__onsuccess {
  background-color: var(--dark__onsuccess_lkv);
  color: var(--dark__success_lkv);
}

.bg-dark__onsuccesscontainer {
  background-color: var(--dark__onsuccesscontainer_lkv);
  color: var(--dark__successcontainer_lkv);
}

.bg-dark__warning {
  background-color: var(--dark__warning_lkv);
  color: var(--dark__onwarning_lkv);
}

.bg-dark__warningcontainer {
  background-color: var(--dark__warningcontainer_lkv);
  color: var(--dark__onwarningcontainer_lkv);
}

.bg-dark__onwarning {
  background-color: var(--dark__onwarning_lkv);
  color: var(--dark__warning_lkv);
}

.bg-dark__onwarningcontainer {
  background-color: var(--dark__onwarningcontainer_lkv);
  color: var(--dark__warningcontainer_lkv);
}

.bg-dark__info {
  background-color: var(--dark__info_lkv);
  color: var(--dark__oninfo_lkv);
}

.bg-dark__infocontainer {
  background-color: var(--dark__infocontainer_lkv);
  color: var(--dark__oninfocontainer_lkv);
}

.bg-dark__oninfo {
  background-color: var(--dark__oninfo_lkv);
  color: var(--dark__info_lkv);
}

.bg-dark__oninfocontainer {
  background-color: var(--dark__oninfocontainer_lkv);
  color: var(--dark__infocontainer_lkv);
}

.util-grid-filler.for-display {
  flex: 1;
  margin-bottom: 1em;
  padding: 1em;
}

.bg-dark__primaryfixed {
  background-color: var(--dark__primaryfixed_lkv);
  color: var(--dark__onprimaryfixed_lkv);
}

.bg-dark__primaryfixeddim {
  background-color: var(--dark__primaryfixeddim_lkv);
  color: var(--dark__onprimaryfixedvariant_lkv);
}

.bg-dark__onprimaryfixed {
  background-color: var(--dark__onprimaryfixed_lkv);
  color: var(--dark__primaryfixed_lkv);
}

.bg-dark__onprimaryfixedvariant {
  background-color: var(--dark__onprimaryfixedvariant_lkv);
  color: var(--dark__primaryfixed_lkv);
}

.bg-dark__secondaryfixed {
  background-color: var(--dark__secondaryfixed_lkv);
  color: var(--dark__onsecondary_lkv);
}

.bg-dark__secondaryfixeddim {
  background-color: var(--dark__secondaryfixeddim_lkv);
  color: var(--dark__onsecondaryfixed_lkv);
}

.bg-dark__onsecondaryfixed {
  background-color: var(--dark__onsecondaryfixed_lkv);
  color: var(--dark__secondaryfixed_lkv);
}

.bg-dark__onsecondaryfixedvariant {
  background-color: var(--dark__onsecondaryfixedvariant_lkv);
  color: var(--dark__secondaryfixed_lkv);
}

.bg-dark__tertiaryfixed {
  background-color: var(--dark__tertiaryfixed_lkv);
  color: var(--dark__ontertiaryfixed_lkv);
}

.bg-dark__tertiaryfixeddim {
  background-color: var(--dark__tertiaryfixeddim_lkv);
  color: var(--dark__ontertiaryfixedvariant_lkv);
}

.bg-dark__ontertiaryfixed {
  background-color: var(--dark__ontertiaryfixed_lkv);
  color: var(--dark__tertiaryfixed_lkv);
}

.bg-dark__ontertiaryfixedvariant {
  background-color: var(--dark__ontertiaryfixedvariant_lkv);
  color: var(--dark__tertiaryfixed_lkv);
}

.bg-dark__surfacedim {
  background-color: var(--dark__surfacedim_lkv);
  color: var(--dark__onsurface_lkv);
}

.bg-dark__surfacebright {
  background-color: var(--dark__surfacebright_lkv);
  color: var(--dark__onsurface_lkv);
}

.bg-dark__surfacecontainerlowest,
.bg-dark__surfacecontainerlow {
  background-color: var(--dark__surfacecontainerlowest_lkv);
  color: var(--dark__onsurface_lkv);
}

.bg-dark__surfacecontainer {
  background-color: var(--dark__surfacecontainer_lkv);
  color: var(--dark__onsurface_lkv);
}

.bg-dark__surfacecontainerhigh {
  background-color: var(--dark__surfacecontainerhigh_lkv);
  color: var(--dark__onsurface_lkv);
}

.bg-dark__surfacecontainerhighest {
  background-color: var(--dark__surfacecontainerhighest_lkv);
  color: var(--dark__onsurface_lkv);
}

.bg__transparent {
  background-color: rgba(0, 0, 0, 0);
}


/* Border Radius */
.border-radius__2xs {
  border-radius: var(--2xs);
}

.border-radius__xs {
  border-radius: var(--xs);
}

.border-radius__sm {
  border-radius: var(--sm);
}

.border-radius__md {
  border-radius: var(--md);
}

.border-radius__lg {
  border-radius: var(--lg);
}

.border-radius__xl {
  border-radius: var(--xl);
}

.border-radius__2xl {
  border-radius: var(--2xl);
}

.border-radius__circle {
  border-radius: 100em;
}


/* Display */
.display__block {
  display: block;
}

.display__flex-h {
  display: flex;
}

.display__flex-v {
  display: flex;
  flex-direction: column;
}

.display__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, auto);
}

.display__inlineBlock{
  display: inline-block;
}

.display__none {
  display: none;
}


/* Front Color */
.color-light__primary_lkv {
  color: var(--light__primary_lkv);
}

.color-light__onprimary_lkv {
  color: var(--light__onprimary_lkv);
}

.color-light__primarycontainer_lkv {
  color: var(--light__primarycontainer_lkv);
}

.color-light__onprimarycontainer_lkv {
  color: var(--light__onprimarycontainer_lkv);
}

.color-light__secondary_lkv {
  color: var(--light__secondary_lkv);
}

.color-light__onsecondary_lkv {
  color: var(--light__onsecondary_lkv);
}

.color-light__secondarycontainer_lkv {
  color: var(--light__secondarycontainer_lkv);
}

.color-light__onsecondarycontainer_lkv {
  color: var(--light__onsecondarycontainer_lkv);
}

.color-light__tertiary_lkv {
  color: var(--light__tertiary_lkv);
}

.color-light__ontertiary_lkv {
  color: var(--light__ontertiary_lkv);
}

.color-light__tertiarycontainer_lkv {
  color: var(--light__tertiarycontainer_lkv);
}

.color-light__ontertiarycontainer_lkv {
  color: var(--light__ontertiarycontainer_lkv);
}

.color-light__error_lkv {
  color: var(--light__error_lkv);
}

.color-light__onerror_lkv {
  color: var(--light__onerror_lkv);
}

.color-light__errorcontainer_lkv {
  color: var(--light__errorcontainer_lkv);
}

.color-light__onerrorcontainer_lkv {
  color: var(--light__onerrorcontainer_lkv);
}

.color-light__background_lkv {
  color: var(--light__background_lkv);
}

.color-light__onbackground_lkv {
  color: var(--light__onbackground_lkv);
}

.color-light__surface_lkv {
  color: var(--light__surface_lkv);
}

.color-light__onsurface_lkv {
  color: var(--light__onsurface_lkv);
}

.color-light__surfacevariant_lkv {
  color: var(--light__surfacevariant_lkv);
}

.color-light__onsurfacevariant_lkv {
  color: var(--light__onsurfacevariant_lkv);
}

.color-light__outline_lkv {
  color: var(--light__outline_lkv);
}

.color-light__outlinevariant_lkv {
  color: var(--light__outlinevariant_lkv);
}

.color-light__shadow_lkv {
  color: var(--light__shadow_lkv);
}

.color-light__scrim_lkv {
  color: var(--light__scrim_lkv);
}

.color-light__inversesurface_lkv {
  color: var(--light__inversesurface_lkv);
}

.color-light__inverseonsurface_lkv {
  color: var(--light__inverseonsurface_lkv);
}

.color-light__inverseprimary_lkv {
  color: var(--light__inverseprimary_lkv);
}

.color-light__success_lkv {
  color: var(--light__success_lkv);
}

.color-light__successcontainer_lkv {
  color: var(--light__successcontainer_lkv);
}

.color-light__onsuccess_lkv {
  color: var(--light__onsuccess_lkv);
}

.color-light__onsuccesscontainer_lkv {
  color: var(--light__onsuccesscontainer_lkv);
}

.color-light__warning_lkv {
  color: var(--light__warning_lkv);
}

.color-light__warningcontainer_lkv {
  color: var(--light__warningcontainer_lkv);
}

.color-light__onwarning_lkv {
  color: var(--light__onwarning_lkv);
}

.color-light__onwarningcontainer_lkv {
  color: var(--light__onwarningcontainer_lkv);
}

.color-light__info_lkv {
  color: var(--light__info_lkv);
}

.color-light__infocontainer_lkv {
  color: var(--light__infocontainer_lkv);
}

.color-light__oninfo_lkv {
  color: var(--light__oninfo_lkv);
}

.color-light__oninfocontainer_lkv {
  color: var(--light__oninfocontainer_lkv);
}

.color-light__primaryfixed_lkv {
  color: var(--light__primaryfixed_lkv);
}

.color-light__primaryfixeddim_lkv {
  color: var(--light__primaryfixeddim_lkv);
}

.color-light__onprimaryfixed_lkv {
  color: var(--light__onprimaryfixed_lkv);
}

.color-light__onprimaryfixedvariant_lkv {
  color: var(--light__onprimaryfixedvariant_lkv);
}

.color-light__secondaryfixed_lkv {
  color: var(--light__secondaryfixed_lkv);
}

.color-light__secondaryfixeddim_lkv {
  color: var(--light__secondaryfixeddim_lkv);
}

.color-light__onsecondaryfixed_lkv {
  color: var(--light__onsecondaryfixed_lkv);
}

.color-light__onsecondaryfixedvariant_lkv {
  color: var(--light__onsecondaryfixedvariant_lkv);
}

.color-light__tertiaryfixed_lkv {
  color: var(--light__tertiaryfixed_lkv);
}

.color-light__tertiaryfixeddim_lkv {
  color: var(--light__tertiaryfixeddim_lkv);
}

.color-light__ontertiaryfixed_lkv {
  color: var(--light__ontertiaryfixed_lkv);
}

.color-light__ontertiaryfixedvariant_lkv {
  color: var(--light__ontertiaryfixedvariant_lkv);
}

.color-light__surfacedim_lkv {
  color: var(--light__surfacedim_lkv);
}

.color-light__surfacebright_lkv {
  color: var(--light__surfacebright_lkv);
}

.color-light__surfacecontainerlowest_lkv {
  color: var(--light__surfacecontainerlowest_lkv);
}

.color-light__surfacecontainerlow_lkv {
  color: var(--light__surfacecontainerlow_lkv);
}

.color-light__surfacecontainer_lkv {
  color: var(--light__surfacecontainer_lkv);
}

.color-light__surfacecontainerhigh_lkv {
  color: var(--light__surfacecontainerhigh_lkv);
}

.color-light__surfacecontainerhighest_lkv {
  color: var(--light__surfacecontainerhighest_lkv);
}

.color-dark__primary_lkv {
  color: var(--dark__primary_lkv);
}

.color-dark__onprimary_lkv {
  color: var(--dark__onprimary_lkv);
}

.color-dark__primarycontainer_lkv {
  color: var(--dark__primarycontainer_lkv);
}

.color-dark__onprimarycontainer_lkv {
  color: var(--dark__onprimarycontainer_lkv);
}

.color-dark__secondary_lkv {
  color: var(--dark__secondary_lkv);
}

.color-dark__onsecondary_lkv {
  color: var(--dark__onsecondary_lkv);
}

.color-dark__secondarycontainer_lkv {
  color: var(--dark__secondarycontainer_lkv);
}

.color-dark__onsecondarycontainer_lkv {
  color: var(--dark__onsecondarycontainer_lkv);
}

.color-dark__tertiary_lkv {
  color: var(--dark__tertiary_lkv);
}

.color-dark__ontertiary_lkv {
  color: var(--dark__ontertiary_lkv);
}

.color-dark__tertiarycontainer_lkv {
  color: var(--dark__tertiarycontainer_lkv);
}

.color-dark__ontertiarycontainer_lkv {
  color: var(--dark__ontertiarycontainer_lkv);
}

.color-dark__error_lkv {
  color: var(--dark__error_lkv);
}

.color-dark__onerror_lkv {
  color: var(--dark__onerror_lkv);
}

.color-dark__errorcontainer_lkv {
  color: var(--dark__errorcontainer_lkv);
}

.color-dark__onerrorcontainer_lkv {
  color: var(--dark__onerrorcontainer_lkv);
}

.color-dark__background_lkv {
  color: var(--dark__background_lkv);
}

.color-dark__onbackground_lkv {
  color: var(--dark__onbackground_lkv);
}

.color-dark__surface_lkv {
  color: var(--dark__surface_lkv);
}

.color-dark__onsurface_lkv {
  color: var(--dark__onsurface_lkv);
}

.color-dark__surfacevariant_lkv {
  color: var(--dark__surfacevariant_lkv);
}

.color-dark__onsurfacevariant_lkv {
  color: var(--dark__onsurfacevariant_lkv);
}

.color-dark__outline_lkv {
  color: var(--dark__outline_lkv);
}

.color-dark__outlinevariant_lkv {
  color: var(--dark__outlinevariant_lkv);
}

.color-dark__shadow_lkv {
  color: var(--dark__shadow_lkv);
}

.color-dark__scrim_lkv {
  color: var(--dark__scrim_lkv);
}

.color-dark__inversesurface_lkv {
  color: var(--dark__inversesurface_lkv);
}

.color-dark__inverseonsurface_lkv {
  color: var(--dark__inverseonsurface_lkv);
}

.color-dark__inverseprimary_lkv {
  color: var(--dark__inverseprimary_lkv);
}

.color-dark__success_lkv {
  color: var(--dark__success_lkv);
}

.color-dark__successcontainer_lkv {
  color: var(--dark__successcontainer_lkv);
}

.color-dark__onsuccess_lkv {
  color: var(--dark__onsuccess_lkv);
}

.color-dark__onsuccesscontainer_lkv {
  color: var(--dark__onsuccesscontainer_lkv);
}

.color-dark__warning_lkv {
  color: var(--dark__warning_lkv);
}

.color-dark__warningcontainer_lkv {
  color: var(--dark__warningcontainer_lkv);
}

.color-dark__onwarning_lkv {
  color: var(--dark__onwarning_lkv);
}

.color-dark__onwarningcontainer_lkv {
  color: var(--dark__onwarningcontainer_lkv);
}

.color-dark__info_lkv {
  color: var(--dark__info_lkv);
}

.color-dark__infocontainer_lkv {
  color: var(--dark__infocontainer_lkv);
}

.color-dark__oninfo_lkv {
  color: var(--dark__oninfo_lkv);
}

.color-dark__oninfocontainer_lkv {
  color: var(--dark__oninfocontainer_lkv);
}

.color-dark__primaryfixed_lkv {
  color: var(--dark__primaryfixed_lkv);
}

.color-dark__primaryfixeddim_lkv {
  color: var(--dark__primaryfixeddim_lkv);
}

.color-dark__onprimaryfixed_lkv {
  color: var(--dark__onprimaryfixed_lkv);
}

.color-dark__onprimaryfixedvariant_lkv {
  color: var(--dark__onprimaryfixedvariant_lkv);
}

.color-dark__secondaryfixed_lkv {
  color: var(--dark__secondaryfixed_lkv);
}

.color-dark__secondaryfixeddim_lkv {
  color: var(--dark__secondaryfixeddim_lkv);
}

.color-dark__onsecondaryfixed_lkv {
  color: var(--dark__onsecondaryfixed_lkv);
}

.color-dark__onsecondaryfixedvariant_lkv {
  color: var(--dark__onsecondaryfixedvariant_lkv);
}

.color-dark__tertiaryfixed_lkv {
  color: var(--dark__tertiaryfixed_lkv);
}

.color-dark__tertiaryfixeddim_lkv {
  color: var(--dark__tertiaryfixeddim_lkv);
}

.color-dark__ontertiaryfixed_lkv {
  color: var(--dark__ontertiaryfixed_lkv);
}

.color-dark__ontertiaryfixedvariant_lkv {
  color: var(--dark__ontertiaryfixedvariant_lkv);
}

.color-dark__surfacedim_lkv {
  color: var(--dark__surfacedim_lkv);
}

.color-dark__surfacebright_lkv {
  color: var(--dark__surfacebright_lkv);
}

.color-dark__surfacecontainerlowest_lkv {
  color: var(--dark__surfacecontainerlowest_lkv);
}

.color-dark__surfacecontainerlow_lkv {
  color: var(--dark__surfacecontainerlow_lkv);
}

.color-dark__surfacecontainer_lkv {
  color: var(--dark__surfacecontainer_lkv);
}

.color-dark__surfacecontainerhigh_lkv {
  color: var(--dark__surfacecontainerhigh_lkv);
}

.color-dark__surfacecontainerhighest_lkv {
  color: var(--dark__surfacecontainerhighest_lkv);
}


/* Opacity */
/* These are done in increments of 10, but you can create your own 
/* such as ".opacity__92 {opacity: 0.92}, etc. 
*/

.opacity__0 {
  opacity: 0.0;
}

.opacity__5 {
  opacity: 0.05;
}

.opacity__10 {
  opacity: 0.1;
}

.opacity__15 {
  opacity: 0.15;
}

.opacity__20 {
  opacity: 0.2;
}

.opacity__25 {
  opacity: 0.25;
}

.opacity__30 {
  opacity: 0.3;
}

.opacity__35 {
  opacity: 0.35;
}

.opacity__40 {
  opacity: 0.4;
}

.opacity__45 {
  opacity: 0.45;
}

.opacity__50 {
  opacity: 0.5;
}

.opacity__55 {
  opacity: 0.55;
}

.opacity__60 {
  opacity: 0.6;
}

.opacity__65 {
  opacity: 0.65;
}

.opacity__70 {
  opacity: 0.7;
}

.opacity__75 {
  opacity: 0.75;
}

.opacity__80 {
  opacity: 0.8;
}

.opacity__85 {
  opacity: 0.85;
}

.opacity__90 {
  opacity: 0.9;
}

.opacity__95 {
  opacity: 0.95;
}

.opacity__100 {
  opacity: 1.0;
}


/* Scale */
.scaleUp__wholestep {
    transform: scale(var(--wholestep));
}

.scaleUp__halfstep {
    transform: scale(var(--halfstep));
}

.scaleUp__quarterstep {
    transform: scale(var(--quarterstep));
}

.scaleDown__wholestep {
    transform: scale(calc(1 / var(--wholestep)));
}

.scaleDown__halfstep {
    transform: scale(calc(1 / var(--halfstep)));
}

.scaleDown__quarterstep {
    transform: scale(calc(1 / var(--quarterstep)));
}


/* Shadows */
.shadow-sm {
  align-items: flex-start;
  box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.5);
  flex: 0 auto;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  position: relative;
  z-index: 1;
}

.shadow-md {
  align-items: flex-start;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.08), 0 2px 4px rgba(0, 0, 0, 0.11),
    0 0 1px rgba(0, 0, 0, 0.5);
  flex: 0 auto;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  position: relative;
  z-index: 2;
}

.shadow-lg {
  align-items: flex-start;
  box-shadow: 0 11px 15px -3px rgba(0, 0, 0, 0.11),
    0 2px 6px rgba(0, 0, 0, 0.07), 0 0 1px rgba(0, 0, 0, 0.5);
  flex: 0 auto;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  position: relative;
  z-index: 3;
}

.shadow-xl {
  align-items: flex-start;
  box-shadow: 0 20px 25px rgba(0, 0, 0, 0.09), 0 5px 11px rgba(0, 0, 0, 0.12),
    0 0 1px rgba(0, 0, 0, 0.5);
  flex: 0 auto;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  position: relative;
  z-index: 4;
}

.shadow-2xl {
  align-items: flex-start;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.23), 0 9px 18px rgba(0, 0, 0, 0.1),
    0 0 1px rgba(0, 0, 0, 0.5);
  flex: 0 auto;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  position: relative;
  z-index: 5;
}


/* Text Alignment */
.text-align__left {
  text-align: left;
}

.text-align__center {
  text-align: center;
}

.text-align__right {
  text-align: right;
}


/* JP Cards */
.textandicon {
  display: flex;
  align-items: baseline;
  gap: var(--sm);
}
.textandicon svg {
  width: 5px;
  overflow: unset;
}

/* Cards */
.card.scalefactor__display1 {
    --padding-top: 3.3294em;
    --padding-horizontal: 4.235em;
    --padding-bottom: 4.235em;
    border-radius: 3.3294em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card.scalefactor__display2 {
    --padding-top: 2.05818em;
    --padding-horizontal: 2.618em;
    --padding-bottom: 2.618em;
    border-radius: 2.05818em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card.scalefactor__display2.bg-surface {
    background-color: var(--surface);
}
.card.scalefactor__title1 {
    --padding-top: 1.61792em;
    --padding-horizontal: 2.058em;
    --padding-bottom: 2.058em;
    border-radius: 1.61792em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card.scalefactor__title2 {
    --padding-top: 1.27201em;
    --padding-horizontal: 1.618em;
    --padding-bottom: 1.618em;
    border-radius: 1.27201em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card.scalefactor__title3 {
    --padding-top: 1em;
    --padding-horizontal: 1.272em;
    --padding-bottom: 1.272em;
    border-radius: 1em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card.scalefactor__heading {
    --padding-top: 0.887579em;
    --padding-horizontal: 1.129em;
    --padding-bottom: 1.129em;
    border-radius: 0.887579em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card.scalefactor__subheading {
    --padding-top: 0.695755em;
    --padding-horizontal: 0.885em;
    --padding-bottom: 0.885em;
    border-radius: 0.695755em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card.scalefactor__body {
    --padding-top: 0.786164em;
    --padding-horizontal: 1em;
    --padding-bottom: 1em;
    border-radius: 0.786164em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card.scalefactor__callout {
    --padding-top: 0.741352em;
    --padding-horizontal: 0.943em;
    --padding-bottom: 0.943em;
    border-radius: 0.741352em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card.scalefactor__caption {
    --padding-top: 0.617925em;
    --padding-horizontal: 0.786em;
    --padding-bottom: 0.786em;
    border-radius: 0.617925em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card.scalefactor__label {
    --padding-top: 0.656447em;
    --padding-horizontal: 0.835em;
    --padding-bottom: 0.835em;
    border-radius: 0.656447em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline {
    border: 1px solid var(--lightgrey);
}
.card__outline.scalefactor__heading {
    --padding-top: 0.887579em;
    --padding-horizontal: 1.129em;
    --padding-bottom: 1.129em;
    border-radius: 0.887579em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline.scalefactor__title3 {
    --padding-top: 1em;
    --padding-horizontal: 1.272em;
    --padding-bottom: 1.272em;
    border-radius: 1em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline.scalefactor__display1 {
    --padding-top: 3.3294em;
    --padding-horizontal: 4.235em;
    --padding-bottom: 4.235em;
    border-radius: 3.3294em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline.scalefactor__body {
    --padding-top: 0.786164em;
    --padding-horizontal: 1em;
    --padding-bottom: 1em;
    border-radius: 0.786164em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline.scalefactor__title1 {
    --padding-top: 1.61792em;
    --padding-horizontal: 2.058em;
    --padding-bottom: 2.058em;
    border-radius: 1.61792em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline.scalefactor__overline {
    --padding-top: 0.618em;
    --padding-horizontal: 0.786em;
    --padding-bottom: 0.786em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline.scalefactor__title2 {
    --padding-top: 1.27201em;
    --padding-horizontal: 1.618em;
    --padding-bottom: 1.618em;
    border-radius: 1.27201em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline.scalefactor__display2 {
    --padding-top: 2.05818em;
    --padding-horizontal: 2.618em;
    --padding-bottom: 2.618em;
    border-radius: 2.05818em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline.scalefactor__label {
    --padding-top: 0.656447em;
    --padding-horizontal: 0.835em;
    --padding-bottom: 0.835em;
    border-radius: 0.656447em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline.scalefactor__callout {
    --padding-top: 0.741352em;
    --padding-horizontal: 0.943em;
    --padding-bottom: 0.943em;
    border-radius: 0.741352em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline.scalefactor__caption {
    --padding-top: 0.617925em;
    --padding-horizontal: 0.786em;
    --padding-bottom: 0.786em;
    border-radius: 0.617925em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.card__outline.scalefactor__subheading {
    --padding-top: 0.695755em;
    --padding-horizontal: 0.885em;
    --padding-bottom: 0.885em;
    border-radius: 0.695755em;
    padding: var(--padding-top) var(--padding-horizontal) var(--padding-bottom);
}
.cardcenter {
    --padding-bottom: var(--padding-top) !important;
}

/* Buttons */
.kitbutton{
    grid-column-gap:.485867em;
    grid-row-gap:.485867em;
    background-color:var(--undernavy);
    color:var(--light__onprimary_lkv);
    letter-spacing:-.011em;
    text-shadow:none;
    border:1px solid #0000;
    border-radius:100em;
    justify-content:flex-start;
    align-items:center;
    padding:.485867em 1em;
    font-weight:400;
    text-decoration:none;
    display:inline-block;
    position:relative;
    overflow:hidden;
}
.kitbutton.endicon{
    padding-right:.618em;
}
.kitbutton.starticon{
    padding-left:.618047em;
}
.kitbutton.start-icon{
    padding-left:.618em;
    line-height:1.272;
}
.kitbutton.start-icon.end-icon{
    padding-left:.618em;
    padding-right:.618em;
}
.kitbutton__text{
    grid-column-gap:.485867em;
    grid-row-gap:.485867em;
    background-color:#0000;
    border:1px solid #0000;
    border-radius:100em;
    justify-content:flex-start;
    align-items:center;
    text-decoration:none;
    display:flex; /*display:inline-block;*/
    /*position:relative;*/
    overflow:hidden;
}
.kitbutton__textbody{
    grid-column-gap:.485867em;
    grid-row-gap:.485867em;
    background-color:#0000;
    border:1px solid #0000;
    border-radius:100em;
    justify-content:flex-start;
    align-items:center;
    padding:.485867em 1em;
    text-decoration:none;
    display:inline-block;
    position:relative;
    overflow:hidden;
}
.kitbutton__content{
    grid-column-gap:.485867em;
    grid-row-gap:.485867em;
    justify-content:center;
    align-items:center;
    display:flex;
}
.kitbutton__text.starticon{
    padding-left:.618em;
}
.kitbutton__text.endicon{
    padding-right:.618em;
}
.start-icon{
    padding-left:.786em;
    padding-right:1em;
}
.start-icon.end-icon{
    padding-left:.786em;
}
.end-icon{
    padding-left:1em;
    padding-right:.786em;
}
.kitbutton__outline{
    grid-column-gap:.485867em;
    grid-row-gap:.485867em;
    color:var(--undernavy);
    background-color:#0000;
    border:1px solid var(--lightgrey);
    border-radius:100em;
    justify-content:flex-start;
    align-items:center;
    padding:.485867em 1em;
    text-decoration:none;
    display:inline-block;
    position:relative;
    overflow:hidden;
}
.kitbutton__outline.start-icon,.button__outline.start-icon.end-icon{
    padding-left:.618em;
}
.kitbutton__outline.start-icon.m-bottom__xxl{
    flex:none;
}
.kitbutton__outline.start-icon.abs-left{
    position:absolute;
    inset:50% auto auto 0%;
    transform:translateY(-50%);
}
.kitbutton__outline.start-icon.abs-left.reset{
    z-index:3;
    cursor:po'Inter', 'Arial';
    inset:1.618em auto auto 1.618em;
    transform:none;
}
.kitbutton__outline.end-icon{
    padding-right:.618em;
}

/* Glass */
.glass{
    -webkit-backdrop-filter:brightness(107%)blur(30px);
    backdrop-filter:brightness(107%)blur(30px);
    border-style:none;
    box-shadow:0 0 2px #0003,0 20px 20px #0000000d;
    background: transparent;
}

/* Responsive Typo */
@media (min-width:1000px){
  .lg\:label {
      --lineHeightInEms: calc(1em * var(--halfstep));
    --md: calc(var(--lineHeightInEms) * var(--wholestep-dec));
  
    --sm: calc(var(--lineHeightInEms) * var(--halfstep-dec));
    --xs: calc(var(--lineHeightInEms) * var(--quarterstep-dec));
    --2xs: calc(var(--lineHeightInEms) * var(--eighthstep-dec));
  
    --lg: calc(var(--lineHeightInEms) * var(--wholestep));
    --xl: calc(var(--lg) * var(--wholestep));
    --2xl: calc(var(--xl) * var(--wholestep));
  
    letter-spacing: -0.004em;
    font-size: calc((1em / var(--quarterstep)) / var(--eighthstep));
    font-weight: 500;
    line-height: var(--halfstep);
    position: static;
    top: 6.235em;
    font-family: 'Inter', 'Arial';
  }
}

/* h-screen without header*/
.h-screen--header {
  height: calc(100vh - var(--header-height))
}
.h-dscreen--header {
  height: calc(100dvh - var(--header-height))
}
.h-sscreen--header {
  height: calc(100svh - var(--header-height))
}
.h-full--header {
  height: calc(100% - var(--header-height))
}


/* Icon Card */
.icon-card {
  flex: 1 1 calc(50% - 1rem);
}
@media (max-width: 699px) {
  .icon-card {
    flex: 1 1 calc(100% - 1rem);
    max-width: 540px;
  }
}
.icon-card .tile-content {
  pointer-events:none;
  padding-top:28px;
  padding-inline-end:76px;
  padding-bottom:52px;
  padding-inline-start:32px
}
@media(max-width:999px) {
  .icon-card .tile-content {
    padding-inline-end:72px;
    padding-inline-start:28px
  }
}
@media(max-width:699px) {
  .icon-card .tile-content {
    padding-top:24px;
    padding-bottom:48px;
    padding-inline-start:24px
  }
}
@media(max-width:480px) {
  .icon-card .tile-content {
    padding-inline-end:24px;
    padding-bottom:72px
  }
}
.icon-card .icon-card-content {
  position:relative;
  z-index:1
}

/* JP text shadows */

.text-shadow__sm {
  text-shadow: 0px 0px 12px rgba(0,0,0,0.5);
}
.text-shadow__md {
  text-shadow: 0px 0px 12px rgba(0,0,0,0.75);
}
.text-shadow__lg {
  text-shadow: 0px 0px 12px rgba(0,0,0,1);
}

/* Disabled button - grey */
button[disabled] {
  background: var(--lightgrey);
  border-color: var(--lightgrey);
  color: #202b4390;
}