/* stylelint-disable media-feature-range-notation */
/* stylelint-disable declaration-block-no-redundant-longhand-properties */

/*
 * Copyright 2020 Adobe. All rights reserved.
 * This file is licensed to you under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License. You may obtain a copy
 * of the License at http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
 * OF ANY KIND, either express or implied. See the License for the specific language
 * governing permissions and limitations under the License.
 */
/* stylelint-disable no-descending-specificity */

/* fallback fonts */

@font-face {
  font-family: livvic-normal-fallback;
  size-adjust: 113%;
  ascent-override: 93%;
  descent-override: 12%;
  line-gap-override: normal;
  font-display: swap;
  src: local("Arial");
}


:root {
  /* colors */
  --white: #FFF;
  --very-light-gray: #f8f8f8; /* subnav */
  --light-gray: #CBCBCB;
  --gray: #eee; /* columns bg */
  --medium-light-gray: #757575; /* 777 doesn't pass contrast */
  --dark-gray: #56524e; /* various text */
  --charcoal-gray: #45423f; /* head + foot text */
  --link-color: var(--true-black); /* laz-blue repeat */
  --link-hover-color: var(--true-black);
  --bright-green: #C1D52F;
  --bright-yellow: #FDDC3F; /* button bg */
  --gold: #F8BE15;
  --sky-blue: #A2DAE8;
  --turquoise: #3FC1C0;
  --light-red: #ed7790;
  --text-color: #131313;
  --black: #000;
  --laz-black: #35302C;
  --bright-blue: #00B3E2;
  --faz-light-blue: #00C0F3;
  --laz-logo-blue: #31409A; /* h2, a */
  --waz-blue: var(--product-dark-blue);
  --navy-blue: var(--product-navy-blue);
  --faz-pink: #C83493;
  --waz-yellow: #F3A814;
  --rpe-dark-blue: #1A1831;
  --rpe-dark-purple: #5E2967;
  --rpe-magenta: #942A6A;
  --rpe-salmon: #C24A48;
  --dark-olive-green: #3E3F30;
  --charcoal-blue: #263238;
  --maroon: #77001a;

  /* Rebrand colors */
  --sunny-yellow: #FFC600;
  --optimistic-orange: #FF8F1C;
  --true-black: #000;
  --joyful-aqua: #64D4DE;
  --positive-periwinkle: #789BED;
  --enthusiastic-purple: #C680FF;
  --radiant-red: #FF6352;
  --happy-pink: #FFCFC1;
  --warm-white: #FFF9E0;
  --light-orange: #FFDEBD;

    /* product colors */
    --vaz-blue-pastel: #ECEFF4; /* top text area bg, other sections */

  /* BRANDS */

  /* Raz-plus berry */
  --product-berry: #c83192;
  --light-pink: #F1CBE4;
  --gradient-rad-berry: radial-gradient(ellipse at center bottom, var(--product-berry), var(--product-berry), var(--product-purple));
  --gradient-lin-berry: linear-gradient(var(--product-berry), var(--product-purple), var(--product-berry));
  --gradient-sticky-berry: linear-gradient(110deg, var(--gold) 0%, var(--gold) 49%, var(--product-berry) 49%, var(--product-berry) 100%);


  /* Raz-kids product dark-blue */
  --product-dark-blue: #005cb9;
  --rk-blue: #D9E7F5; /* section bg */
  --cta-thin: #ECEFF4; /* cta bg */
  --rk-blue-dark: #1E7DDD; /* cta button bg, white btn txt, hover transp. */
  --faq-blue: #093567; /* FAQ */
  --dark-blue: #005CB9; /* headlines, top btn bg */
  --gradient-rad-dark-blue: radial-gradient(ellipse at center bottom, var(--rk-blue-dark), var(--product-dark-blue), var(--product-dark-blue));
  --gradient-lin-dark-blue: linear-gradient(var(--rk-blue-dark), var(--product-dark-blue), var(--product-dark-blue));
  --gradient-sticky-dark-blue: linear-gradient(110deg, var(--gold) 0%, var(--gold) 49%, var(--product-dark-blue) 49%, var(--product-dark-blue) 100%);

  /* Science a-z green */
  --product-green: #128641; /* repeated */
  --b-green: #419e66;
  --gradient-rad-green: radial-gradient(ellipse at center bottom, var(--b-green), var(--b-green), var(--product-green));
  --gradient-lin-green: linear-gradient(var(--b-green), var(--product-green), var(--b-green));
  --gradient-sticky-green: linear-gradient(110deg, var(--gold) 0%, var(--gold) 49%, var(--product-green) 49%, var(--product-green) 100%);

  /* Foundations a-z navy */
  --product-navy-blue: #0E4482;
  --gradient-rad-navy: radial-gradient(ellipse at center bottom, var(--product-berry), var(--product-purple), var(--product-navy-blue));
  --gradient-lin-navy: linear-gradient(var(--product-navy-blue), var(--product-purple), var(--product-berry));
  --gradient-sticky-navy: linear-gradient(110deg, var(--gold) 0%, var(--gold) 49%, var(--product-navy-blue) 49%, var(--product-navy-blue) 100%);

  /* writing a-z orange */
  --product-orange: #f05b32;
  --gradient-rad-orange: radial-gradient(ellipse at center bottom, var(--orange), var(--orange), var(--product-orange));
  --gradient-lin-orange: linear-gradient(var(--orange), var(--orange), var(--product-orange));
  --orange: #F48C21;
  --gradient-sticky-orange: linear-gradient(110deg, var(--gold) 0%, var(--gold) 49%, var(--product-orange) 49%, var(--product-orange) 100%);

  /* vocabulary a-z purple */
  --product-purple: #904799;
  --faz-purple: #5D2C8A; /* cta button */
  --gradient-rad-purple: radial-gradient(ellipse at center bottom, var(--faz-purple), var(--product-purple), var(--faz-purple));
  --gradient-lin-purple: linear-gradient(var(--faz-purple), var(--product-purple), var(--faz-purple));
  --gradient-sticky-purple: linear-gradient(110deg, var(--gold) 0%, var(--gold) 49%, var(--faz-purple) 49%, var(--faz-purple) 100%);

  /* Reading a-z red, Resources */
  --product-red: #E21D46;
  --vaz-red-pastel: #FFCECB; /* section bg */
  --gradient-rad-red: radial-gradient(ellipse at center, var(--white) 0%, var(--light-red) 0%, #e21f48 60%, var(--product-red) 100%);
  --gradient-lin-red: linear-gradient(var(--light-red), var(--product-red), var(--dark-blue));
  --gradient-sticky-red: linear-gradient(110deg, var(--gold) 0%, var(--gold) 49%, var(--product-red) 49%, var(--product-red) 100%);

/* yellow for what we do */
  --rpe-gold: #D5A13D; /* use for What We Do pages still only 2.3 contrast */

  /* laz-blue for blog */
  --laz-blue: #00B3E2; /* mostly blog */
  --blog-blue: #18a4ce; /* blog buttons contrast 2.9 */
  --dark-purple: #613aaf; /* blog H3 color */

  /* don't override user accessibility settings */
  forced-color-adjust: none;

  /* fonts */
  --body-font-family: livvic, livvic-normal-fallback;
  --heading-font-family: livvic, livvic-normal-fallback;

  /* font weight */
  --font-weight-light: 300;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-bold: 600;
  --font-weight-extra-bold: 700;


  /* body sizes */
  --body-font-size-l: 1.4rem; /* 22px */
  --body-font-size-m: 1.25rem; /* 20px */
  --body-font-size-s: 16px; /* default body font size */
  --body-font-size-xs: .875rem; /* 14px */
  --body-font-size-xxs: .813rem; /* 13px */

/* heading sizes — evenly scaled from h1 (50px) to p (18px) */
--heading-font-size-5xl: 80px;
--heading-font-size-4xl: 3.125rem;    /* 50px */
--heading-font-size-3xl: 2.792rem;    /* 44.67px */
--heading-font-size-xxl: 2.458rem;    /* 39.33px */
--heading-font-size-xl: 2.125rem;     /* 34px */
--heading-font-size-l: 1.792rem;      /* 28.67px */
--heading-font-size-m: 1.458rem;      /* 23.33px */
--heading-font-size-s: 1.125rem;      /* 18px */


/* Responsive mobile overrides */
@media (width <= 767px) {
  :root {
    --heading-font-size-3xl: 2.25rem;  /* 36px */
    --heading-font-size-xxl: 1.875rem; /* 30px */
    --heading-font-size-xl: 1.5rem;    /* 24px */
    --heading-font-size-l: 1.375rem;   /* 22px */
    --heading-font-size-s: 1.25rem;    /* 20px */
    --body-font-size-l: 1.125rem;      /* 18px */
    --body-font-size-m: 1rem;          /* 16px */
    --body-font-size-s: 0.875rem;      /* 14px */
    --body-font-size-xs: 0.813rem;     /* 13px */
    --body-font-size-xxs: 0.75rem;     /* 12px */
  }
}



  /* nav height */
  --nav-height: 90px;

  /* default button color theme is red */
  --theme-btn-primary-border: var(--product-red);
  --theme-btn-primary-bg: var(--product-red);
  --theme-btn-primary-txt: var(--true-black);
  --theme-btn-primary-border-hov: var(--product-red);
  --theme-btn-primary-bg-hov: transparent;
  --theme-btn-primary-txt-hov: var(--product-red);
  --theme-btn-secondary-border: var(--product-red);
  --theme-btn-secondary-bg: transparent;
  --theme-btn-secondary-txt: var(--product-red);
  --theme-btn-secondary-border-hov: var(--product-red);
  --theme-btn-secondary-bg-hov: var(--product-red);
  --theme-btn-secondary-txt-hov: var(--white);
  --theme-table-head-bg: var(--laz-logo-blue);
  --theme-table-head-txt: var(--white);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--true-black);
  --theme-breadcrumbs-bg: var(--white);
  --theme-carousel-arrow: var(--light-gray);


} /* end root */

/* Base skew and padding */
.highlight,
[class^="highlight-"] {
  position: relative;
  display: inline-block;
  font-weight: 700;
  line-height: 1.2;
  color: var(--true-black);
  background: none;
  z-index: 1;
}

/* Rotated angled background highlight */
.highlight::before,
[class^="highlight-"]::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 110%;
  height: 100%;
  transform: translate(-50%, -50%) rotate(var(--highlight-rotate, -2deg));
  background-color: var(--highlight-color, yellow);
  z-index: -1;
  border-radius: 13px;
}


/* apply background color per class */
.highlight-sunny-yellow::before         { background-color: var(--sunny-yellow); }
.highlight-optimistic-orange::before   { background-color: var(--optimistic-orange); }
.highlight-true-black::before          { background-color: var(--true-black); }
.highlight-joyful-aqua::before         { background-color: var(--joyful-aqua); }
.highlight-positive-periwinkle::before { background-color: var(--positive-periwinkle); }
.highlight-enthusiastic-purple::before { background-color: var(--enthusiastic-purple); }
.highlight-radiant-red::before         { background-color: var(--radiant-red); }
.highlight-happy-pink::before          { background-color: var(--happy-pink); }
.highlight-warm-white::before          { background-color: var(--warm-white); }
.highlight-light-orange::before          { background-color: var(--light-orange); }


/* h1 .highlight::before, [class^="highlight-"]::before {
  content: '';
  position: absolute;
  top: 6px;
  bottom: 0;
  left: -6px;
  right: -4px;
  z-index: -1;
  transform: skew(6deg);
  border-radius: 6px;
} */

/* Helper classes to add to markdown */

/* Button alignment helpers */

.section-outer.pad-104 { padding: 104px 0 !important; }
.section-outer.pad-92  { padding: 92px 0 !important; }
.section-outer.pad-80  { padding: 80px 0 !important; }
.section-outer.pad-68  { padding: 68px 0 !important; }
.section-outer.pad-56  { padding: 56px 0 !important; }
.section-outer.pad-44  { padding: 44px 0 !important; }
.section-outer.pad-35  { padding: 35px 0 !important; }
.section-outer.pad-24  { padding: 24px 0 !important; }
.section-outer.pad-12  { padding: 12px 0 !important; }
.section-outer.pad-0   { padding: 0 !important; }

.section.center .buttons-container {
  text-align: center;
  display: block;
}

.section.center .button-container {
  display: inline-block;
  margin: 0 0.5rem;
}



.counter {
  font-size: 90px;
  line-height: 1.1;
}

.left {
  text-align: left;
}

.center {
  text-align: center;
}

.right {
  text-align: right;
}

.align-left {
  text-align: left;
}

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

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

.justify-left {
  justify-items: left;
}

.justify-center {
  justify-items: center;
}

.justify-right {
  justify-items: right;
}

.col-has-content p.text-center {
  text-align: center;
}

.col-has-content p.text-left {
  text-align: left;
}

.col-has-content p.text-right {
  text-align: right;
}


*, ::before, ::after {
  box-sizing: border-box;
}

picture {
  line-height: 0;
  display: block;
}

img {
  width: auto;
  height: auto;
  max-width: 100%;
  border-style: none;
}

body {
  display: none;
  margin: 0;
  background-color: var(--white);
  color: var(--text-color);
  font-family: var(--body-font-family);
  font-size: var(--body-font-size-s);
  line-height: 140%;
}

body.appear {
  display: block;
}

header {
  height: calc(var(--nav-height) + 40px); /* 40px is the announcement bar */
}

header .header,
footer .footer {
  visibility: hidden;
}

header .header[data-block-status="loaded"],
footer .footer[data-block-status="loaded"] {
  visibility: visible;
}

h1 {
  font-size: var(--heading-font-size-3xl);
  font-family: var(--heading-font-family);
  font-weight: var(--font-weight-extra-bold);
  margin: 20px 0 1em;
  line-height: 1.2;
}

h2 {
  font-size: var(--heading-font-size-xl);  /* was xxl, now using h3's */
  font-family: var(--heading-font-family);
  font-weight: var(--font-weight-bold);
  margin: 20px 0 1em;
  line-height: 1.35;
}

h3 {
  font-size: var(--heading-font-size-l);  /* was xl, now using h4's */
  font-family: var(--heading-font-family);
  font-weight: var(--font-weight-bold);
}

h4 {
  font-size: var(--heading-font-size-m);  /* was l, now using h5's */
  font-family: var(--heading-font-family);
  font-weight: var(--font-weight-medium);
}

h5 {
  font-size: var(--heading-font-size-m);  /* unchanged */
  font-family: var(--heading-font-family);
  font-weight: var(--font-weight-medium);
}

h6 {
  font-size: var(--heading-font-size-s);
  font-family: var(--heading-font-family);
  font-weight: var(--font-weight-medium);
}

p {
  font-size: var(--body-font-size-m); /* P2 */
  font-family: var(--body-font-family);
  font-weight: var(--font-weight-normal);
  margin:37px 0;
}

.footer {
  font-size: var(--body-font-size-xs);
  font-family: var(--body-font-family);
  font-weight: var(--font-weight-normal);
  max-width: 1312px;
  margin: 0 auto;
}

nav, nav a, nav li {
  font-size: var(--body-font-size-s); /* P2 */
  font-family: var(--body-font-family);
  font-weight: var(--font-weight-extra-bold);
}

.button.primary,
.button.secondary {
  font-size: var(--body-font-size-m); /* P3 - 18px */
  font-family: var(--body-font-family);
  font-weight: var(--font-weight-bold);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: .5em;
  margin-bottom: .5em;
  font-weight: var(--font-weight-normal);
  line-height: 1.2;
  scroll-margin: 40px;
  color: var(--true-black);
}

h1, h2 {
  font-family: var(--heading-font-family);
  color: var(--true-black);
}

h3, h4, h5, h6 {
  font-family: var(--body-font-family);
}

/* don't put in Accordion.css, so heading override colors will work */
.faq h4, .faq h3 {
  color: var(--faq-blue)
}

/* .center {
  text-align: center;

  li {
    text-align: left;
  }
} */

p,
dl,
ol,
ul,
pre,
blockquote {
  margin-top: 0;
  margin-bottom: 1em;
}

.footnote {
  font-size: var(--body-font-size-xs);
}

code,
pre {
  font-size: var(--body-font-size-s);
}

pre {
  padding: 16px;
  border-radius: 8px;
  background-color: var(--very-light-gray);
  overflow-x: auto;
  white-space: pre;
}

input, textarea, select, button {
  font: inherit;
}

/* links */
a:any-link, a {
  color: var(--link-color);
  text-decoration: none;
  word-break: break-word;
}

a:not(.button) {
    text-decoration: underline;
  }

  .megamenu a {
  text-decoration: none;
}

a:hover {
  color: var(--link-hover-color);
  text-decoration: underline;
}

/* buttons */
.button.primary {
  display: inline-block;
  padding: 14px 32px;
  border: 4px solid var(--true-black);
  border-radius: 999px;
  font-family: var(--body-font-family);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.01em;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.2s ease-in-out;
}

.button.primary:hover {
  transform: scale(1.05);
}

/* Radiant Red Button (white text) */
.button.primary.bgcolor-radiant-red {
  background-color: var(--radiant-red);
  color: var(--true-black);
}

/* Light Orange Button (black text) */
.button.primary.bgcolor-light-orange {
  background-color: var(--light-orange);
  color: var(--true-black);
}

/* Positive Periwinkle Button (black text) */
.button.primary.bgcolor-positive-periwinkle {
  background-color: var(--positive-periwinkle);
  color: var(--true-black);
}

/* Sunny Yellow Button (black text) */
.button.primary.bgcolor-sunny-yellow {
  background-color: var(--sunny-yellow);
  color: var(--true-black);
}

/* Joyful Aqua Button (black text) */
.button.primary.bgcolor-joyful-aqua {
  background-color: var(--joyful-aqua);
  color: var(--true-black);
}

/* Enthusiastic Purple Button (white text) */
.button.primary.bgcolor-enthusiastic-purple {
  background-color: var(--enthusiastic-purple);
  color: var(--white);
}

/* Happy Pink Button (black text) */
.button.primary.bgcolor-happy-pink {
  background-color: var(--happy-pink);
  color: var(--true-black);
}

/* Warm White Button (black text) */
.button.primary.bgcolor-warm-white {
  background-color: var(--warm-white);
  color: var(--true-black);
}

/* Optimistic Orange Button (white text) */
.button.primary.bgcolor-optimistic-orange {
  background-color: var(--optimistic-orange);
  color: var(--white);
}

/* True Black Button (white text) */
.button.primary.bgcolor-true-black {
  background-color: var(--true-black);
  color: var(--white);
}

/* Radiant Red */
.button.primary.bgcolor-radiant-red:hover {
  background-color: var(--radiant-red);
  color: var(--true-black);
  transform: scale(1.05);
}

/* Light Orange */
.button.primary.bgcolor-light-orange:hover {
  background-color: var(--light-orange);
  color: var(--true-black);
  transform: scale(1.05);
}

/* Positive Periwinkle */
.button.primary.bgcolor-positive-periwinkle:hover {
  background-color: var(--positive-periwinkle);
  color: var(--true-black);
  transform: scale(1.05);
}

/* Sunny Yellow */
.button.primary.bgcolor-sunny-yellow:hover {
  background-color: var(--sunny-yellow);
  color: var(--true-black);
  transform: scale(1.05);
}

/* Joyful Aqua */
.button.primary.bgcolor-joyful-aqua:hover {
  background-color: var(--joyful-aqua);
  color: var(--true-black);
  transform: scale(1.05);
}

/* Enthusiastic Purple */
.button.primary.bgcolor-enthusiastic-purple:hover {
  background-color: var(--enthusiastic-purple);
  color: var(--white);
  transform: scale(1.05);
}

/* Happy Pink */
.button.primary.bgcolor-happy-pink:hover {
  background-color: var(--happy-pink);
  color: var(--true-black);
  transform: scale(1.05);
}

/* Warm White */
.button.primary.bgcolor-warm-white:hover {
  background-color: var(--warm-white);
  color: var(--true-black);
  transform: scale(1.05);
}

/* Optimistic Orange */
.button.primary.bgcolor-optimistic-orange:hover {
  background-color: var(--optimistic-orange);
  color: var(--white);
  transform: scale(1.05);
}

/* True Black */
.button.primary.bgcolor-true-black:hover {
  background-color: var(--true-black);
  color: var(--white);
  transform: scale(1.05);
}

/* Container for two buttons side-by-side */
.buttons-container {
  display: flex;
  gap: 16px;
  flex-wrap: nowrap;
  justify-content: flex-start;
}

.button-container {
  margin: 0;
}

/* Ensure <a class="button primary"> inside <p> renders correctly */
p.button-container {
  display: inline-block;
  margin: 0;
}

p.button-container strong {
  all: unset; /* Remove unwanted bold or inline-block effects */
}

p.button-container .button.primary {
  display: inline-block;
  padding: 14px 32px;
  border: 4px solid var(--true-black);
  border-radius: 12px;
  font-family: var(--body-font-family);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.01em;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.2s ease-in-out;
}


sup, sub{
  font-size: var(--body-font-size-xxs);
  line-height: 0;
}

.button-container.has-subtext{
  text-align: center;

  .button-subtext {
    display: block;
    font-size: var(--body-font-size-xxs);

    br {
      display: none;
    }

    & a {
      color: var(--product-dark-blue);
    }
  }

  a {
    margin: 0;
  }
}

/* List */
main ul {
  margin-bottom: 30px;
}

nav ul {
  list-style: none;
  margin: 10px;
}

nav ul, ol, ul ul, ol ol {
  margin-top: 0;
  margin-bottom: 30px;
}

main li {
  margin-bottom: 10px;
  font-size: 20px;
}

nav li {
  cursor: default;
  text-transform: uppercase;
}

.breadcrumbs-outer {
  grid-area: breadcrumb;
  background-color: var(--white);

  .breadcrumbs-container {
    margin: 0 auto;
      padding-right: 15px;
      padding-left: 15px;
  }

  nav.breadcrumbs {
    color: var(--true-black);
    font-size: var(--body-font-size-xxs);
    display: flex;
    flex-wrap: wrap;
    column-gap: 6px;
    justify-content: left;
    height: 85px;
    align-items: center;
    padding-top: 35px;

    a {
      color: var(--true-black);
      font-weight: var(--font-weight-extra-bold);
    }
  }
}

.divider {
  display: block;
  width: 100%;
  height: 1px;
  background-color: var(--gray);
}

main {
  margin-bottom: 50px;

  .breadcrumbs-outer {
    background-color: var(--theme-breadcrumbs-bg);
  }

  a, a:any-link {
    color: var(--true-black);
    font-weight: 600;
  }

  .cards.circle-image .card picture {
    background-color: var(--theme-cards-circle-bg);
  }
}

main > div > div:not(.bg-image-container) {
  margin: 40px 16px;
}

/************
 SECTIONS
**************/

main > .section-outer {
  margin: auto;
  background-size: cover;
  width: 100%;
  padding:104px 0;

  > .section, > .bg-image-container > .section {
    margin: 0 auto;
    max-width: 750px;
    background-size: cover;
  }

  > .section:has(.bg-image-container) {
    padding: 0;
  }

  .section.short {
    padding: 10px 15px;

    .columns {
      h1, h2, h3, h4, p {
        margin: .5em auto;
      }

      > div {
        gap: 8px;
      }

      &:last-child > div {
        padding-bottom: 0;
      }
    }
  }
}

.section.benefits {
  :has(:not(.columns)) {
  p, h1, h2, h3 {
    text-align: center;
    }

    .col-has-content p, .col-has-content h1, .col-has-content h2, .col-has-content h3 {
      text-align: unset;
    }
  }

 img {
   border-radius: 20px;
   margin-bottom: 16px;
 }
}

.section.sitemap {
  ul {
    margin-bottom: 15px;
    border-left: 3px solid var(--sky-blue);
    margin-left: 0;
    padding-left: 25px;
  }

  li {
    width: 100%;
    float: none;
    display: inline-block;
  }

  h3 {
    margin-bottom: 50px;
  }
}

main > .section:first-of-type {
  margin-top: 0;
}

/* Pricing API specific styling: Hide content for blocked locations by default */
.block-location {
  display: none;
}

/*********
THEMES
*********/

/* default theme */

/* default button colors inherit the theme */
.button.primary, .button.primary.bg-theme {
  color: var(--white);
  background-color: var(--theme-btn-primary-bg);
  border-color: var(--theme-btn-primary-border);
}

/* .button.secondary, .button.primary.bg-theme {
  color: var(--theme-btn-secondary-txt);
  border-color: var(--theme-btn-secondary-border);
  background-color: var(--theme-btn-secondary-bg);

  &:hover {
    color: var(--theme-btn-secondary-txt-hov);
    border-color: var(--theme-btn-secondary-border-hov);
    background-color: var(--theme-btn-secondary-bg-hov);
  }
} */

[data-theme] { /* section bg colors all have these items white */
  --theme-heading-color: var(--white);
  --theme-link-color: var(--white);
  --theme-txt: var(--true-black);
  --theme-btn-primary-border: var(--white);
  --theme-btn-primary-bg: var(--white);
  --theme-btn-primary-border-hov: var(--white);
  --theme-btn-primary-bg-hov: transparent;
  --theme-btn-primary-txt-hov: var(--white);
  --theme-btn-secondary-border: var(--white);
  --theme-btn-secondary-bg: transparent;
  --theme-btn-secondary-txt: var(--white);
  --theme-btn-secondary-bg-hov: var(--white);
  --theme-btn-secondary-border-hov: var(--white);
  --theme-carousel-h3: var(--theme-heading-color);

  background-color: var(--theme-bg);
    color: var(--theme-txt);

  a:not(.button) {
    text-decoration: underline;
  }

  

    /* .button.secondary {
        color: var(--white);
        border-color: var(--white);
        background-color: var(--theme-btn-secondary-bg);

        &:hover {
            background-color: var(--theme-btn-secondary-bg-hov);
            color: var(--theme-btn-secondary-txt-hov);
          border-color: var(--theme-btn-secondary-bg-hov);
        }
    } */
  }

  .carousel-navigation-buttons button {
    background-color: var(--theme-carousel-arrow);
  }

  &:has(.inner) {
    background-color: unset;
    padding: 0;

    .section.inner {
      background-color: var(--theme-bg);
      border-radius: 30px;
      margin: 50px auto;
    }

    @media (width >= 1024px) {
        .section.inner {
          border-radius: 50px;
          margin: 50px auto;


          &.short {
            border-radius: 30px;
          }
        }
    }
  }

.dark-blue main, .blue main {
  --theme-breadcrumbs-bg: var(--product-dark-blue);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--product-dark-blue);
  --theme-btn-primary-border: var(--product-dark-blue);
  --theme-btn-primary-bg: var(--product-dark-blue);
  --theme-btn-primary-border-hov: var(--product-dark-blue);
  --theme-btn-primary-txt-hov: var(--product-dark-blue);
  --theme-btn-secondary-border: var(--product-dark-blue);
  --theme-btn-secondary-txt: var(--product-dark-blue);
  --theme-btn-secondary-border-hov: var(--product-dark-blue);
  --theme-btn-secondary-bg-hov: var(--product-dark-blue);
  --theme-table-head-bg: var(--product-dark-blue);
  --theme-accordion-border: var(--product-dark-blue);
  --theme-accordion-txt: var(--product-dark-blue);
  --theme-cards-circle-bg: var(--product-dark-blue);
  --theme-checkmark-circle: url('/icons/checkmark-circle-dark-blue.svg');
}

.berry main {
  --theme-breadcrumbs-bg: var(--product-berry);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--laz-logo-blue);
  --theme-btn-primary-border: var(--product-berry);
  --theme-btn-primary-bg: var(--product-berry);
  --theme-btn-primary-border-hov: var(--product-berry);
  --theme-btn-primary-txt-hov: var(--product-berry);
  --theme-btn-secondary-border: var(--product-berry);
  --theme-btn-secondary-txt: var(--product-berry);
  --theme-btn-secondary-border-hov: var(--product-berry);
  --theme-btn-secondary-bg-hov: var(--product-berry);
  --theme-table-head-bg: var(--product-berry);
  --theme-accordion-border: var(--product-berry);
  --theme-accordion-txt: var(--product-berry);
  --theme-cards-circle-bg: var(--product-berry);
  --theme-checkmark-circle: url('/icons/checkmark-circle-berry.svg');
}

[data-theme="berry"],[data-theme="gradient-sticky-berry"],
[data-theme="gradient-rad-berry"], [data-theme="gradient-lin-berry"] {
  --theme-bg: var(--product-berry);
  --theme-btn-primary-txt: var(--product-berry);
  --theme-btn-secondary-txt-hov: var(--product-berry);
  --theme-gradient-linear: var(--gradient-lin-berry);
  --theme-gradient-radial: var(--gradient-rad-berry);
  --theme-gradient-sticky: var(--gradient-sticky-berry);
}

[data-theme="dark-blue"], [data-theme="blue"], [data-theme="gradient-dark-blue"], [data-theme="gradient-sticky-dark-blue"],
[data-theme="gradient-rad-dark-blue"], [data-theme="gradient-lin-dark-blue"]{
  --theme-bg: var(--product-dark-blue);
  --theme-btn-primary-txt: var(--product-dark-blue);
  --theme-btn-secondary-txt-hov: var(--product-dark-blue);
  --theme-gradient-radial: var(--gradient-rad-dark-blue);
  --theme-gradient-linear: var(--gradient-lin-dark-blue);
  --theme-gradient-sticky: var(--gradient-sticky-dark-blue);
  --theme-carousel-arrow: var(--product-navy-blue);
}

.green main {
  --theme-breadcrumbs-bg: var(--product-green);
  --theme-heading-color: var(--product-green);
  --theme-link-color: var(--product-green);
  --theme-btn-primary-border: var(--product-green);
  --theme-btn-primary-bg: var(--product-green);
  --theme-btn-primary-border-hov: var(--product-green);
  --theme-btn-primary-txt-hov: var(--product-green);
  --theme-btn-secondary-border: var(--product-green);
  --theme-btn-secondary-txt: var(--product-green);
  --theme-btn-secondary-border-hov: var(--product-green);
  --theme-btn-secondary-bg-hov: var(--product-green);
  --theme-table-head-bg: var(--product-green);
  --theme-accordion-border: var(--product-green);
  --theme-accordion-txt: var(--product-green);
  --theme-cards-circle-bg: var(--product-green);
  --theme-checkmark-circle: url('/icons/checkmark-circle-green.svg');
}

[data-theme="green"], [data-theme="gradient-sticky-green"],
[data-theme="gradient-rad-green"], [data-theme="gradient-lin-green"]  {
  --theme-bg: var(--product-green);
  --theme-btn-primary-txt: var(--product-green);
  --theme-btn-secondary-txt-hov: var(--product-green);
  --theme-gradient-linear: var(--gradient-lin-green);
  --theme-gradient-radial: var(--gradient-rad-green);
  --theme-gradient-sticky: var(--gradient-sticky-green);
}

.navy main {
  --theme-breadcrumbs-bg: var(--product-navy-blue);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--product-navy-blue);
  --theme-btn-primary-border: var(--product-navy-blue);
  --theme-btn-primary-bg: var(--product-navy-blue);
  --theme-btn-primary-border-hov: var(--product-navy-blue);
  --theme-btn-primary-txt-hov: var(--product-navy-blue);
  --theme-btn-secondary-border: var(--product-navy-blue);
  --theme-btn-secondary-txt: var(--product-navy-blue);
  --theme-btn-secondary-border-hov: var(--product-navy-blue);
  --theme-btn-secondary-bg-hov: var(--product-navy-blue);
  --theme-table-head-bg: var(--product-navy-blue);
  --theme-accordion-border: var(--product-navy-blue);
  --theme-accordion-txt: var(--product-navy-blue);
  --theme-cards-circle-bg: var(--product-navy-blue);
  --theme-checkmark-circle: url('/icons/checkmark-circle-navy.svg');
}

[data-theme="navy"], [data-theme="gradient-sticky-navy"],
[data-theme="gradient-rad-navy"], [data-theme="gradient-lin-navy"]  {
  --theme-bg: var(--product-navy-blue);
  --theme-btn-primary-txt: var(--product-navy-blue);
  --theme-btn-secondary-txt-hov: var(--product-navy-blue);
  --theme-gradient-linear: var(--gradient-lin-navy);
  --theme-gradient-radial: var(--gradient-rad-navy);
  --theme-gradient-sticky: var(--gradient-sticky-navy);
}

[data-theme="logo-blue"] {
  --theme-bg: var(--laz-logo-blue);
  --theme-btn-primary-txt: var(--laz-logo-blue);
  --theme-btn-secondary-txt-hov: var(--laz-logo-blue);
}

[data-theme="black"] {
  --theme-bg: var(--laz-black);
  --theme-btn-primary-txt: var(--laz-black);
}

.orange main {
  --theme-breadcrumbs-bg: var(--product-orange);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--product-orange);
  --theme-btn-primary-border: var(--product-orange);
  --theme-btn-primary-bg: var(--product-orange);
  --theme-btn-primary-border-hov: var(--product-orange);
  --theme-btn-primary-txt-hov: var(--product-orange);
  --theme-btn-secondary-border: var(--product-orange);
  --theme-btn-secondary-txt: var(--product-orange);
  --theme-btn-secondary-border-hov: var(--product-orange);
  --theme-btn-secondary-bg-hov: var(--product-orange);
  --theme-table-head-bg: var(--product-orange);
  --theme-accordion-border: var(--product-orange);
  --theme-accordion-txt: var(--product-orange);
  --theme-cards-circle-bg: var(--product-orange);
  --theme-checkmark-circle: url('/icons/checkmark-circle-orange.svg');
}

[data-theme="orange"], [data-theme="gradient-sticky-orange"],
[data-theme="gradient-rad-orange"], [data-theme="gradient-lin-orange"]  {
  --theme-bg: var(--product-orange);
  --theme-btn-primary-txt: var(--product-orange);
  --theme-btn-secondary-txt-hov: var(--product-orange);
  --theme-gradient-linear: var(--gradient-lin-orange);
  --theme-gradient-radial: var(--gradient-rad-orange);
  --theme-gradient-sticky: var(--gradient-sticky-orange);
}

.purple main {
  --theme-breadcrumbs-bg: var(--product-purple);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--product-purple);
  --theme-btn-primary-border: var(--product-purple);
  --theme-btn-primary-bg: var(--product-purple);
  --theme-btn-primary-border-hov: var(--product-purple);
  --theme-btn-primary-txt-hov: var(--product-purple);
  --theme-btn-secondary-border: var(--product-purple);
  --theme-btn-secondary-txt: var(--product-purple);
  --theme-btn-secondary-border-hov: var(--product-purple);
  --theme-btn-secondary-bg-hov: var(--product-purple);
  --theme-table-head-bg: var(--product-purple);
  --theme-accordion-border: var(--product-purple);
  --theme-accordion-txt: var(--product-purple);
  --theme-cards-circle-bg: var(--product-purple);
  --theme-checkmark-circle: url('/icons/checkmark-circle-purple.svg');

  .news-filter-container, .reviews-filter-container {
    h3, a, p>strong, strong>p {
      color: var(--product-purple);
      margin: 0;
    }
  }
}

[data-theme="purple"], [data-theme="gradient-sticky-purple"],
[data-theme="gradient-rad-purple"], [data-theme="gradient-lin-purple"] {
  --theme-bg: var(--product-purple);
  --theme-btn-primary-txt: var(--product-purple);
  --theme-btn-secondary-txt-hov: var(--product-purple);
  --theme-gradient-linear: var(--gradient-lin-purple);
  --theme-gradient-radial: var(--gradient-rad-purple);
  --theme-gradient-sticky: var(--gradient-sticky-purple);
  --theme-carousel-arrow: var(--rpe-dark-purple);
  --theme-carousel-h3: var(--rpe-dark-purple);
}

.red main {
  --theme-breadcrumbs-bg: var(--product-red);
  --theme-heading-color: var(--product-red);
  --theme-link-color: var(--product-red);
  --theme-table-head-bg: var(--product-red);
  --theme-accordion-border: var(--product-red);
  --theme-accordion-txt: var(--product-red);
  --theme-cards-circle-bg: var(--product-red);
  --theme-btn-secondary-txt-hov: var(--product-red);
  --theme-checkmark-circle: url('/icons/checkmark-circle-red.svg');

  .subnav-wrapper {
    ul li a {
      &:hover, &:focus {
        text-decoration: none;
        border-bottom: 6px solid var(--product-red);
      }
    }

    .subnav {
      margin-bottom: -26px;

      .active {
        border-bottom: 6px solid var(--product-red);
      }
    }
  }
}

[data-theme="red"], [data-theme="gradient-sticky-red"],
[data-theme="gradient-rad-red"], [data-theme="gradient-lin-red"] {
  --theme-bg: var(--product-red);
  --theme-btn-primary-txt: var(--product-red);
  --theme-btn-secondary-txt-hov: var(--product-red);
  --theme-gradient-linear: var(--gradient-lin-red);
  --theme-gradient-radial: var(--gradient-rad-red);
  --theme-gradient-sticky: var(--gradient-sticky-red);
}

.gold main {
  --theme-breadcrumbs-bg: var(--gold);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--laz-logo-blue);
  --theme-btn-primary-border: var(--gold);
  --theme-btn-primary-bg: var(--gold);
  --theme-btn-primary-border-hov: var(--gold);
  --theme-btn-primary-txt: var(--laz-logo-blue);
  --theme-btn-primary-txt-hov: var(--gold);
  --theme-btn-secondary-border: var(--gold);
  --theme-btn-secondary-txt: var(--gold);
  --theme-btn-secondary-border-hov: var(--gold);
  --theme-btn-secondary-bg-hov: var(--gold);
  --theme-table-head-bg: var(--gold);
  --theme-table-head-txt: var(--laz-logo-blue);
  --theme-accordion-border: var(--gold);
  --theme-accordion-txt: var(--laz-logo-blue);
  --theme-cards-circle-bg: var(--gold);
  --theme-checkmark-circle: url('/icons/checkmark-circle-logo-blue.svg');
}

[data-theme="gold"] {
  --theme-bg: var(--gold);
  --theme-txt: var(--text-color);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-btn-primary-txt: var(--text-color);
  --theme-btn-primary-txt-hov: var(--text-color);
  --theme-btn-secondary-txt-hov: var(--text-color);
  --theme-btn-primary-border-hov: var(--text-color);
  --theme-link-color: var(--text-color);
  --theme-btn-secondary-txt: var(--text-color);

  h1, h2 {
    color: var(--text-color);
  }
}

.rpe-gold main {
  --theme-breadcrumbs-bg: var(--rpe-gold);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--laz-logo-blue);
  --theme-btn-primary-border: var(--rpe-gold);
  --theme-btn-primary-bg: var(--rpe-gold);
  --theme-btn-primary-border-hov: var(--rpe-gold);
  --theme-btn-primary-txt: var(--laz-logo-blue);
  --theme-btn-primary-txt-hov: var(--rpe-gold);
  --theme-btn-secondary-border: var(--rpe-gold);
  --theme-btn-secondary-txt: var(--rpe-gold);
  --theme-btn-secondary-border-hov: var(--rpe-gold);
  --theme-btn-secondary-bg-hov: var(--rpe-gold);
  --theme-table-head-bg: var(--rpe-gold);
  --theme-table-head-txt: var(--laz-logo-blue);
  --theme-accordion-border: var(--rpe-gold);
  --theme-accordion-txt: var(--laz-logo-blue);
  --theme-cards-circle-bg: var(--rpe-gold);
  --theme-checkmark-circle: url('/icons/checkmark-circle-logo-blue.svg');
}

[data-theme="rpe-gold"] {
  --theme-bg: var(--rpe-gold);
  --theme-txt: var(--text-color);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-btn-primary-txt: var(--rpe-gold);
  --theme-btn-secondary-txt-hov: var(--rpe-gold);
}

.laz-blue main {
  --theme-breadcrumbs-bg: var(--laz-blue);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--laz-logo-blue);
  --theme-btn-primary-border: var(--blog-blue);
  --theme-btn-primary-bg: var(--blog-blue);
  --theme-btn-primary-border-hov: var(--blog-blue);
  --theme-btn-primary-txt-hov: var(--blog-blue);
  --theme-btn-secondary-border: var(--blog-blue);
  --theme-btn-secondary-txt: var(--blog-blue);
  --theme-btn-secondary-border-hov: var(--blog-blue);
  --theme-btn-secondary-bg-hov: var(--blog-blue);
  --theme-table-head-bg: var(--blog-blue);
  --theme-accordion-border: var(--laz-blue);
  --theme-accordion-txt: var(--laz-logo-blue);
  --theme-cards-circle-bg: var(--laz-blue);
  --theme-checkmark-circle: url('/icons/checkmark-circle-blog-blue.svg');
}

.white main {
  --theme-breadcrumbs-bg: var(--white);
}

[data-theme="laz-blue"] {
  --theme-bg: var(--laz-blue);
  --theme-btn-primary-txt: var(--laz-blue);
  --theme-btn-secondary-txt-hov: var(--laz-blue);
  --theme-carousel-arrow: var(--product-dark-blue);
}

[data-theme="turquoise"] {
  --theme-bg: var(--turquoise);
  --theme-txt: var(--text-color);
  --theme-heading-color: var(--text-color);
  --theme-link-color: var(--text-color);
  --theme-btn-primary-txt: var(--text-color);
  --theme-btn-primary-txt-hov: var(--text-color);
  --theme-btn-secondary-txt-hov: var(--text-color);
  --theme-btn-primary-border-hov: var(--text-color);
  --theme-btn-secondary-txt: var(--text-color);
  --theme-carousel-arrow: var(--turquoise);

  h1, h2 {
    color: var(--text-color);
  }
}

[data-theme="gray"], [data-theme="white"] {
  --theme-bg: var(--gray);
  --theme-txt: var(--text-color);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--laz-logo-blue);
  --theme-btn-primary-bg: var(--laz-logo-blue);
  --theme-btn-primary-border: var(--laz-logo-blue);
  --theme-btn-primary-txt: var(--gray);
  --theme-btn-primary-border-hov: var(--laz-logo-blue);
  --theme-btn-primary-txt-hov: var(--laz-logo-blue);
  --theme-btn-secondary-border: var(--laz-logo-blue);
  --theme-btn-secondary-bg: var(--gray);
  --theme-btn-secondary-txt: var(--laz-logo-blue);
  --theme-btn-secondary-border-hov: var(--laz-logo-blue);
  --theme-btn-secondary-bg-hov: var(--laz-logo-blue);
  --theme-checkmark-circle: url('/icons/checkmark-circle-logo-blue.svg');

  h1,h2 {
    color: var(--true-black);
  }
}

/* Rebrand theme variable */

.section img {
  border-radius: 16px;
}

header img,
footer img {
  border-radius: 0 !important;
}


[data-theme="sunny-yellow"] {
  --theme-bg: var(--sunny-yellow);
  --theme-txt: var(--true-black);
}

[data-theme="optimistic-orange"] {
  --theme-bg: var(--optimistic-orange);
  --theme-txt: var(--true-black);
}

[data-theme="true-black"] {
  --theme-bg: var(--true-black);
  --theme-txt: var(--true-black);
}

[data-theme="joyful-aqua"] {
  --theme-bg: var(--joyful-aqua);
  --theme-txt: var(--true-black);
}

[data-theme="positive-periwinkle"] {
  --theme-bg: var(--positive-periwinkle);
  --theme-txt: var(--true-black);
}

[data-theme="enthusiastic-purple"] {
  --theme-bg: var(--enthusiastic-purple);
  --theme-txt: var(--true-black);
}

[data-theme="radiant-red"] {
  --theme-bg: var(--radiant-red);
  --theme-txt: var(--true-black);
}

[data-theme="light-orange"] {
  --theme-bg: var(--light-orange);
  --theme-txt: var(--true-black);
}

[data-theme="happy-pink"] {
  --theme-bg: var(--happy-pink);
  --theme-txt: var(--true-black);
}

[data-theme="warm-white"] {
  --theme-bg: var(--warm-white);
  --theme-txt: var(--true-black);
}

[data-theme="white"]  {
  --theme-bg: var(--white);
  --theme-txt: var(--true-black);
}

[data-theme="light-gray"] {
  --theme-bg: var(--very-light-gray);
  --theme-txt: var(--text-color);
  --theme-heading-color: var(--laz-logo-blue);
}

[data-theme="bright-yellow"]  {
  --theme-bg: var(--bright-yellow);
  --theme-txt: var(--text-color);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--text-color);
}

[data-theme="pink"] {
  --theme-bg: var(--light-pink);
  --theme-heading-color: var(--product-berry);
  --theme-link-color: var(--laz-logo-blue);
  --theme-btn-primary-txt: var(--white);
  --theme-btn-primary-border: var(--product-berry);
  --theme-btn-primary-bg: var(--product-berry);
  --theme-btn-primary-border-hov: var(--product-berry);
  --theme-btn-primary-txt-hov: var(--product-berry);
  --theme-btn-secondary-border: var(--product-berry);
  --theme-btn-secondary-bg: var(--light-pink);
  --theme-btn-secondary-txt: var(--product-berry);
  --theme-btn-secondary-border-hov: var(--product-berry);
  --theme-btn-secondary-bg-hov: var(--product-berry);
  --theme-checkmark-circle: url('/icons/checkmark-circle-berry.svg');
  --theme-carousel-arrow: var(--product-berry);

  h1,h2 {
    color: var(--laz-logo-blue);
  }

  color: var(--text-color);

  &:has(.inner) {
    .section.inner {
      background-color: var(--light-pink);
    }
  }
}

[data-theme="red-pastel"] {
  --theme-bg: var(--vaz-red-pastel);
  --theme-text: var(--text-color);
  --theme-heading-color: var(--laz-logo-blue);

  color: var(--text-color);

  h1,h2 {
    color: var(--laz-logo-blue);
  }
}

[data-theme="light-blue"] {
  --theme-bg: var(--rk-blue);
  --theme-txt: var(--text-color);
  --theme-heading-color: var(--laz-logo-blue);
  --theme-link-color: var(--laz-logo-blue);
  --theme-btn-primary-bg: var(--laz-logo-blue);
  --theme-btn-primary-border: var(--laz-logo-blue);
  --theme-btn-primary-txt: var(--gray);
  --theme-btn-primary-border-hov: var(--laz-logo-blue);
  --theme-btn-primary-txt-hov: var(--laz-logo-blue);
  --theme-btn-secondary-border: var(--laz-logo-blue);
  --theme-btn-secondary-bg: var(--rk-blue);
  --theme-btn-secondary-txt: var(--laz-logo-blue);
  --theme-btn-secondary-border-hov: var(--laz-logo-blue);
  --theme-btn-secondary-bg-hov: var(--laz-logo-blue);
  --theme-checkmark-circle: url('/icons/checkmark-circle-logo-blue.svg');

  h1,h2 {
    color: var(--laz-logo-blue);
  }
}

/* Gradient section themes */

:is([data-theme^="gradient-rad-"]) {
  &:has(+ :not(.section.inner)) {
    background: var(--theme-gradient-radial);
  }

  &:has(.section.inner) {
    background: none;

    .section.inner {
      background: var(--theme-gradient-radial);

      &:has(.bg-image-container) {
        padding: 0;

        h1 {
          margin-top: 0;
        }

        .bg-image-container {
          padding: 60px;
        }
      }
    }
  }

  @media (width >= 1024px) {
    &:has(.section.inner) {
      padding: 0;

      .section.inner {
        &:has(.bg-image-container) {
          .bg-image-container {
            padding: 60px;
          }
        }
      }
    }
  }
}

:is([data-theme^="gradient-lin-"]) {
  &:has(+ :not(.section.inner)) {
    background: var(--theme-gradient-linear);
  }

  &:has(.section.inner) {
    background: none;

    .section.inner {
      background: var(--theme-gradient-linear);

      &:has(.bg-image-container) {
        padding: 0;

        h1 {
          margin-top: 0;
        }

        .bg-image-container {
          padding: 30px;
        }
      }
    }
  }

  @media (width >= 1024px) {
    &:has(.section.inner) {
      padding: 0;

      .section.inner {
        &:has(.bg-image-container) {
          .bg-image-container {
            padding: 60px;
          }
        }
      }
    }
  }
}

:is([data-theme^="gradient-sticky-"]) {
  &:has(+ :not(.section.inner)) {
    background: var(--theme-gradient-sticky);
  }

  &:has(.section.inner) {
    background: none;

    .section.inner {
      background: var(--theme-gradient-sticky);

      &:has(.bg-image-container) {
        padding: 0;

        h1 {
          margin-top: 0;
        }

        .bg-image-container {
          padding: 30px;
        }
      }
    }
  }

  @media (width >= 1024px) {
    &:has(.section.inner) {
      padding: 0;

      .section.inner {
        &:has(.bg-image-container) {
          .bg-image-container {
            padding: 60px;
          }
        }
      }
    }
  }
}

  /* end themes */

/* custom overrides for H1 - H3 text color */

/* custom backgound colors for when in a P tag by itself */
.bg-dark-blue, .bg-navy, .bg-red, .bg-berry, .bg-orange, .bg-purple,
.bg-green, .bg-laz-blue, .bg-black, .bg-gold, .bg-blue, .bg-orange-red {
  .columns {
    padding: 10px 10px 5px !important;
  }

  a,h1,h2,h3,h4,h5,h6,p,li {
    color: var(--white) !important;
  }
}

.bg-gray {
  background: var(--gray);
  color: var(--laz-black);
}

.bg-white {
  background: var(--white);
  color: var(--laz-black);
}

:is(h1, h2, h3, h4, h5, h6).white {
  color: var(--white) !important;
}

.bg-dark-blue, .bg-blue {
  background-color: var(--product-dark-blue);
}

:is(h1, h2, h3, h4, h5, h6).dark-blue, :is(h1, h2, h3, h4, h5, h6).blue {
  color: var(--product-dark-blue) !important;
}

:is(h1, h2, h3, h4, h5, h6).logo-blue {
  color: var(--laz-logo-blue) !important;
}

.bg-sky-blue {
  background-color: var(--sky-blue);
}

:is(h1, h2, h3, h4, h5, h6).sky-blue {
  color: var(--sky-blue)!important;
}

.bg-berry {
  background-color: var(--product-berry);
}

:is(h1, h2, h3, h4, h5, h6).berry {
  color: var(--product-berry) !important;
}

.bg-navy {
  background-color: var(--product-navy-blue);
}

:is(h1, h2, h3, h4, h5, h6).navy {
  color: var(--product-navy-blue) !important;
}

.bg-red {
  background-color: var(--product-red);
}

:is(h1, h2, h3, h4, h5, h6).red {
  color: var(--product-red) !important;
}

.bg-orange {
  background-color: var(--orange);
}

:is(h1, h2, h3, h4, h5, h6).orange {
  color: var(--orange) !important;
}

.bg-orange-red, .bg-red-orange {
  background-color: var(--product-orange);
}

:is(h1, h2, h3, h4, h5, h6).orange-red, :is(h1, h2, h3, h4, h5, h6).red-orange {
  color: var(--product-orange) !important;
}

.bg-purple {
  background-color: var(--product-purple);
}

:is(h1, h2, h3, h4, h5, h6).purple {
  color: var(--product-purple) !important;
}

.bg-dark-purple {
  background-color: var(--dark-purple);
}

:is(h1, h2, h3, h4, h5, h6).dark-purple {
  color: var(--dark-purple) !important;
}

.bg-green {
  background-color: var(--product-green);
}

:is(h1, h2, h3, h4, h5, h6).green {
  color: var(--product-green) !important;
}

.bg-black {
  background-color: var(--laz-black);
}

:is(h1, h2, h3, h4, h5, h6).black {
  color: var(--laz-black) !important;
}

.bg-gold {
  background-color: var(--gold);
}

:is(h1, h2, h3, h4, h5, h6).gold {
  color: var(--gold) !important;
}

.bg-rpe-gold {
  background-color: var(--rpe-gold);
}

:is(h1, h2, h3, h4, h5, h6).rpe-gold {
  color: var(--rpe-gold) !important;
}

.button.secondary.textcolor-sunny-yellow {
  color: var(--sunny-yellow);
  border-color: var(--sunny-yellow);
}

.button.secondary.textcolor-optimistic-orange {
  color: var(--optimistic-orange);
  border-color: var(--optimistic-orange);
}

.button.secondary.textcolor-true-black {
  color: var(--true-black);
  border-color: var(--true-black);
}

.button.secondary.textcolor-joyful-aqua {
  color: var(--joyful-aqua);
  border-color: var(--joyful-aqua);
}

.button.secondary.textcolor-positive-periwinkle {
  color: var(--positive-periwinkle);
  border-color: var(--positive-periwinkle);
}

.button.secondary.textcolor-enthusiastic-purple {
  color: var(--enthusiastic-purple);
  border-color: var(--enthusiastic-purple);
}

.button.secondary.textcolor-radiant-red {
  color: var(--radiant-red);
  border-color: var(--radiant-red);
}

.button.secondary.textcolor-light-orange {
  color: var(--light-orange);
  border-color: var(--light-orange);
}

.button.secondary.textcolor-happy-pink {
  color: var(--happy-pink);
  border-color: var(--happy-pink);
}

.button.secondary.textcolor-warm-white {
  color: var(--warm-white);
  border-color: var(--warm-white);
}

  .icon {
    display: inline-block;
    height: 24px;
    width: 24px;
  }

  .icon img {
    height: 100%;
    width: 100%;
  }

  .bg-image-container {
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
  }

  @media (max-width: 767px) {
    .buttons-container {
  flex-direction: column;
}

.section.center .button-container {
  display: inline-block;
  margin: 1.5rem 0 0.5rem;
}
    
  .section-outer {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .section-outer.pad-104 { 
    padding-left: 16px !important; 
    padding-right: 16px !important; 
  }

.section-outer.pad-92  { 
    padding-left: 16px !important; 
    padding-right: 16px !important; 
  }

.section-outer.pad-80  { 
    padding-left: 16px !important; 
    padding-right: 16px !important; 
  }

.section-outer.pad-68  { 
    padding-left: 16px !important; 
    padding-right: 16px !important; 
  }

.section-outer.pad-56  { 
    padding-left: 16px !important; 
    padding-right: 16px !important; 
  }

.section-outer.pad-44  { 
    padding-left: 16px !important; 
    padding-right: 16px !important; 
  }

.section-outer.pad-35  { 
    padding-left: 16px !important; 
    padding-right: 16px !important; 
  }

.section-outer.pad-24  { 
    padding-left: 16px !important; 
    padding-right: 16px !important; 
  }

.section-outer.pad-12  { 
    padding-left: 16px !important; 
    padding-right: 16px !important; 
  }

.section-outer.pad-0   { 
    padding-left: 16px !important; 
    padding-right: 16px !important; 
  }
}


  @media (width >= 1024px) {
    main > .section-outer > .section,
    main > .section-outer > .bg-image-container > .section,
    .breadcrumbs-container, .hero-content {
      max-width: 1002px;
    }
  }


  @media (width >= 1200px) {
    main > .section-outer > .section,
    main > .section-outer > .bg-image-container > .section,
    .breadcrumbs-container, .hero-content {
      max-width: 1312px;
    }

  }

@media (width >= 1660px) {
  .breadcrumbs-container {
    max-width: 1527px;
  }
}

  /* section metadata */
  main .section.light,
  main .section.highlight {
    background-color: var(--very-light-gray);
    margin: 0;
    padding: 40px 0;
  }
