@digital-b2c/coreui-kit 0.2.0 → 0.2.2

package/dist/index.css

@@ -1,23 +1,203 @@
+/* src/styles/index.scss */
+*,
+*::before,
+*::after {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+html {
+  font-size: 16px;
+  color-scheme: light dark;
+  -webkit-font-smoothing: antialiased;
+  -webkit-text-size-adjust: none;
+  text-size-adjust: none;
+}
+:root {
+  --color-white: #ffffff;
+  --color-black: #080808;
+  --color-gray: #4d4d4d;
+  --color-light-gray: #cec3c3;
+  --color-link: #0035ba;
+  --color-darkerbg: #f1f1f1;
+  --color-gradient-black:
+    radial-gradient(
+      98.36% 208.67% at 2.71% 100%,
+      #000000 0%,
+      #171717 57.8%,
+      #1a1a1a 99.99%);
+  --color-gradient-graytowhite:
+    linear-gradient(
+      360deg,
+      #ffffff 0%,
+      #f3f3f3 100%);
+  --color-gradient-white:
+    linear-gradient(
+      89.48deg,
+      rgba(255, 255, 255, 0.25) -2.75%,
+      rgba(153, 153, 153, 0) 187.82%),
+    linear-gradient(
+      0deg,
+      rgba(0, 0, 0, 0),
+      rgba(0, 0, 0, 0));
+  --color-lenscrafter-blue: #192c50;
+  --color-lenscrafter-desctext: #475673;
+  --color-foreyes-brown: #ad634a;
+  --color-foreyes-icontext: #a52e0d;
+  --color-foreyes-desctext: #884634;
+  --color-targetoptical-red: #d71b32;
+  --color-targetoptical-icontext: #65131d;
+  --color-targetoptical-desctext: #84424a;
+  --color-pearlevision-green: #5c9541;
+  --color-pearlevision-icontext: #19300e;
+  --color-pearlevision-desctext: #47593e;
+  --spacing-sm: 0.5rem;
+  --spacing-md: 1rem;
+  --spacing-lg: 1.5rem;
+  --spacing-xl: 2rem;
+  --spacing-2xl: 2.5rem;
+  --spacing-3xl: 3rem;
+  --spacing-4xl: 3.5rem;
+  --spacing-5xl: 4rem;
+  --spacing-6xl: 4.5rem;
+  --spacing-7xl: 5rem;
+  --font-family-primary: Instrument Sans, sans-serif;
+  --font-weight-regular: 400;
+  --font-weight-medium: 500;
+  --font-weight-bold: 600;
+  --font-size-xs: 0.75rem;
+  --font-size-sm: 0.875rem;
+  --font-size-md: 1rem;
+  --font-size-lg: 1.25rem;
+  --font-size-xl: 1.5rem;
+  --font-size-2xl: 2rem;
+  --font-size-3xl: 2.25rem;
+  --font-size-4xl: 2.5rem;
+  --line-height-normal: 1.5;
+  --line-height-tight-1: 1.4;
+  --line-height-tight-2: 1.33;
+  --line-height-tight-3: 1.25;
+  --line-height-tight-4: 1.2;
+  --line-height-tight-5: 1.17;
+}
+@font-face {
+  font-family: "Instrument Sans";
+  font-weight: 400 700;
+  font-style: normal;
+  font-display: swap;
+  src: url("./instrument-sans-VYC4K7BH.woff2") format("woff2");
+}
+html,
+body {
+  font-family: "Instrument Sans", sans-serif;
+  font-size: 1rem;
+  font-weight: 500;
+  line-height: 1.5;
+  color: #4d4d4d;
+}
+h1,
+.h1 {
+  font-size: 2.5rem;
+  font-weight: 600;
+  line-height: 1.17;
+}
+@media (max-width: 768px) {
+  h1,
+  .h1 {
+    font-size: 2rem;
+  }
+}
+h2,
+.h2 {
+  font-size: 2.25rem;
+  font-weight: 600;
+  line-height: 1.2;
+}
+@media (max-width: 768px) {
+  h2,
+  .h2 {
+    font-size: 1.5rem;
+  }
+}
+h3,
+.h3 {
+  font-size: 2rem;
+  font-weight: 600;
+  line-height: 1.25;
+}
+@media (max-width: 768px) {
+  h3,
+  .h3 {
+    font-size: 1.25rem;
+  }
+}
+h4,
+.h4 {
+  font-size: 1.5rem;
+  font-weight: 600;
+  line-height: 1.33;
+}
+@media (max-width: 768px) {
+  h4,
+  .h4 {
+    font-size: 18px;
+  }
+}
+.subheading {
+  font-size: 1.25rem;
+  font-weight: 500;
+  line-height: 1.4;
+}
+@media (max-width: 768px) {
+  .subheading {
+    font-size: 18px;
+  }
+}
+p,
+.body {
+  font-size: 1rem;
+  font-weight: 500;
+  line-height: 1.5;
+}
+small,
+.small {
+  font-size: 0.875rem;
+  font-weight: 500;
+  line-height: 1.5;
+}
+.smallest {
+  font-size: 0.75rem;
+  font-weight: 500;
+  line-height: 1.5;
+}
+a {
+  color: var(--color-link);
+  text-decoration: none;
+}
+a:hover {
+  text-decoration: underline;
+}
+
 /* src/components/Picture/Picture.module.scss */
-.image-desktop {
+.Picture_module_image-desktop {
   display: block;
 }
 @media (max-width: 768px) {
-  .image-desktop {
+  .Picture_module_image-desktop {
     display: none;
   }
 }
-.image-mobile {
+.Picture_module_image-mobile {
   display: none;
 }
 @media (max-width: 768px) {
-  .image-mobile {
+  .Picture_module_image-mobile {
     display: block;
   }
 }
 
 /* src/components/Button/Button.module.scss */
-.button {
+.Button_module_button {
   width: fit-content;
   overflow: hidden;
   cursor: pointer;
@@ -41,17 +221,17 @@
   position: relative;
   transition: all 0.2s ease-in-out;
 }
-.button:hover {
+.Button_module_button:hover {
   text-decoration: none;
   background: rgba(255, 255, 255, 0.2);
 }
-.button:active {
+.Button_module_button:active {
   background: rgba(255, 255, 255, 0.3019607843);
 }
-.button.fullWidth {
+.Button_module_button.Button_module_fullWidth {
   width: 100%;
 }
-.button.primary {
+.Button_module_button.Button_module_primary {
   color: var(--color-white);
   background:
     radial-gradient(
@@ -60,7 +240,7 @@
       #1b1b1b 100%);
   border: 1px solid #000000;
 }
-.button.primary:hover {
+.Button_module_button.Button_module_primary:hover {
   background:
     linear-gradient(
       0deg,
@@ -71,10 +251,10 @@
       #000000 0%,
       #1b1b1b 100%);
 }
-.button.primary:active {
+.Button_module_button.Button_module_primary:active {
   background: #0e0e0e;
 }
-.button.primary:focus {
+.Button_module_button.Button_module_primary:focus {
   background:
     linear-gradient(
       0deg,
@@ -86,87 +266,87 @@
       #1b1b1b 100%);
   outline: 4px solid var(--color-link);
 }
-.button.secondary {
+.Button_module_button.Button_module_secondary {
   color: var(--color-black);
   background: var(--color-white);
   border: 1px solid #c2c2c2;
 }
-.button.secondary:hover {
+.Button_module_button.Button_module_secondary:hover {
   background: #eeeeee;
 }
-.button.secondary:active {
+.Button_module_button.Button_module_secondary:active {
   background: #e3e3e3;
 }
-.button.secondary:focus {
+.Button_module_button.Button_module_secondary:focus {
   background: #eeeeee;
   outline: 4px solid var(--color-link);
 }
-.button.ghost {
+.Button_module_button.Button_module_ghost {
   color: var(--color-black);
   background: var(--color-white);
   border: none;
 }
-.button.ghost:hover {
+.Button_module_button.Button_module_ghost:hover {
   background: #eeeeee;
 }
-.button.ghost:active {
+.Button_module_button.Button_module_ghost:active {
   background: #c3c3c3;
 }
-.button.ghost:focus {
+.Button_module_button.Button_module_ghost:focus {
   background: #eeeeee;
   outline: 4px solid var(--color-link);
 }
-.button.nofill {
+.Button_module_button.Button_module_nofill {
   color: var(--color-white);
   background: transparent;
   border: none;
 }
-.button.nofill:hover {
+.Button_module_button.Button_module_nofill:hover {
   background: rgba(255, 255, 255, 0.2);
 }
-.button.nofill:active {
+.Button_module_button.Button_module_nofill:active {
   background: rgba(255, 255, 255, 0.3019607843);
 }
-.button.nofill:focus {
+.Button_module_button.Button_module_nofill:focus {
   background: rgba(255, 255, 255, 0.2);
   outline: 4px solid var(--color-link);
 }
-.button.nofillblack {
+.Button_module_button.Button_module_nofillblack {
   color: var(--color-black);
   background: transparent;
   border: none;
 }
-.button.nofillblack:hover {
+.Button_module_button.Button_module_nofillblack:hover {
   background: rgba(229, 229, 229, 0.5019607843);
 }
-.button.nofillblack:active {
+.Button_module_button.Button_module_nofillblack:active {
   background: rgba(203, 203, 203, 0.5019607843);
 }
-.button.nofillblack:focus {
+.Button_module_button.Button_module_nofillblack:focus {
   background: rgba(229, 229, 229, 0.5019607843);
   outline: 4px solid var(--color-link);
 }
-.button.grey {
+.Button_module_button.Button_module_grey {
   color: var(--color-white);
   background: transparent;
   border: 1px solid #949494;
 }
-.button.grey:hover {
+.Button_module_button.Button_module_grey:hover {
   background: rgba(255, 255, 255, 0.2);
 }
-.button.grey:active {
+.Button_module_button.Button_module_grey:active {
   background: rgba(93, 93, 93, 0.9019607843);
 }
-.button.grey:focus {
+.Button_module_button.Button_module_grey:focus {
   background: rgba(255, 255, 255, 0.2);
   outline: 4px solid var(--color-link);
 }
-.button.shiny {
+.Button_module_button.Button_module_shiny {
   color: var(--color-white);
   background: transparent;
   border: none;
 }
-.button.shiny::before {
+.Button_module_button.Button_module_shiny::before {
   content: "";
   position: absolute;
   inset: 0;
@@ -177,27 +357,27 @@
       #ffffff,
       rgba(153, 153, 153, 0.39));
   border-radius: inherit;
-  animation: rotateGradient 2s ease-in infinite;
+  animation: Button_module_rotateGradient 2s ease-in infinite;
   -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
   -webkit-mask-composite: xor;
   mask-composite: exclude;
   pointer-events: none;
 }
-.button.shiny:hover {
+.Button_module_button.Button_module_shiny:hover {
   background: rgba(255, 255, 255, 0.2);
 }
-.button.shiny:focus {
+.Button_module_button.Button_module_shiny:focus {
   background: transparent;
   outline: 4px solid var(--color-link);
 }
-.button .icon,
-.button .logo {
+.Button_module_button .Button_module_icon,
+.Button_module_button .Button_module_logo {
   width: 24px;
   height: 24px;
   object-fit: contain;
 }
 @property --angle { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
-@keyframes rotateGradient {
+@keyframes Button_module_rotateGradient {
   from {
     --angle: 0deg;
   }
@@ -207,14 +387,14 @@
 }
 
 /* src/components/BrandsStrip/BrandsStrip.module.scss */
-.brandsStrip {
+.BrandsStrip_module_brandsStrip {
   display: flex;
   height: 116px;
   padding: 16px;
   position: relative;
   overflow: hidden;
 }
-.brandsStrip.light {
+.BrandsStrip_module_brandsStrip.BrandsStrip_module_light {
   background:
     linear-gradient(
       89.48deg,
@@ -222,7 +402,7 @@
       rgba(153, 153, 153, 0) 187.82%);
   backdrop-filter: blur(7.45513px);
 }
-.brandsStrip.light::before {
+.BrandsStrip_module_brandsStrip.BrandsStrip_module_light::before {
   content: "";
   position: absolute;
   inset: 0;
@@ -238,17 +418,17 @@
   mask-composite: exclude;
   pointer-events: none;
 }
-.brandsStrip.dark {
+.BrandsStrip_module_brandsStrip.BrandsStrip_module_dark {
   background-color: var(--color-black);
 }
-.brandsStrip.small {
+.BrandsStrip_module_brandsStrip.BrandsStrip_module_small {
   height: 80px;
 }
-.brandsStrip.small .logoWrapper {
+.BrandsStrip_module_brandsStrip.BrandsStrip_module_small .BrandsStrip_module_logoWrapper {
   height: 49px;
   width: 183px;
 }
-.brandsStrip .container {
+.BrandsStrip_module_brandsStrip .BrandsStrip_module_container {
   position: relative;
   display: flex;
   justify-content: center;
@@ -258,25 +438,25 @@
   height: 100%;
   transition: filter 0.3s ease;
 }
-.brandsStrip .container .title {
+.BrandsStrip_module_brandsStrip .BrandsStrip_module_container .BrandsStrip_module_title {
   color: var(--color-white);
 }
-.brandsStrip .container.blurred {
+.BrandsStrip_module_brandsStrip .BrandsStrip_module_container.BrandsStrip_module_blurred {
   filter: blur(15px);
   cursor: pointer;
 }
-.brandsStrip .logos {
+.BrandsStrip_module_brandsStrip .BrandsStrip_module_logos {
   display: flex;
   gap: 120px;
 }
-.brandsStrip .logos.marquee {
+.BrandsStrip_module_brandsStrip .BrandsStrip_module_logos.BrandsStrip_module_marquee {
   position: relative;
   display: flex;
   align-items: center;
   width: 100%;
   height: 100%;
 }
-.brandsStrip .logos.marquee .logoWrapper {
+.BrandsStrip_module_brandsStrip .BrandsStrip_module_logos.BrandsStrip_module_marquee .BrandsStrip_module_logoWrapper {
   --marquee-duration: 8s;
   --marquee-item-width: 258px;
   --marquee-gap: 120px;
@@ -284,13 +464,13 @@
   position: absolute;
   inset-inline-start: 100%;
   width: var(--marquee-item-width);
-  animation: scrollIndividual var(--marquee-duration) linear infinite;
+  animation: BrandsStrip_module_scrollIndividual var(--marquee-duration) linear infinite;
   animation-delay: calc(var(--marquee-duration) / var(--total-items) * var(--item-index) * -1);
 }
-.brandsStrip .logos.marquee .logoWrapper.paused {
+.BrandsStrip_module_brandsStrip .BrandsStrip_module_logos.BrandsStrip_module_marquee .BrandsStrip_module_logoWrapper.BrandsStrip_module_paused {
   animation-play-state: paused;
 }
-.brandsStrip .logoWrapper {
+.BrandsStrip_module_brandsStrip .BrandsStrip_module_logoWrapper {
   flex-shrink: 0;
   height: 69px;
   width: 260px;
@@ -298,12 +478,12 @@
   align-items: center;
   justify-content: center;
 }
-.brandsStrip .logoWrapper .logo {
+.BrandsStrip_module_brandsStrip .BrandsStrip_module_logoWrapper .BrandsStrip_module_logo {
   width: 100%;
   height: auto;
   object-fit: contain;
 }
-.brandsStrip .cta {
+.BrandsStrip_module_brandsStrip .BrandsStrip_module_cta {
   position: absolute;
   top: 50%;
   left: 50%;
@@ -311,14 +491,14 @@
   z-index: 10;
   max-width: 295px;
 }
-@keyframes scrollIndividual {
+@keyframes BrandsStrip_module_scrollIndividual {
   to {
     transform: translateX(calc(var(--total-distance) * -1));
   }
 }
 
 /* src/components/Card/Card.module.scss */
-.card {
+.Card_module_card {
   display: flex;
   flex-direction: column;
   border-radius: 8px;
@@ -327,15 +507,15 @@
   background: var(--color-gradient-black);
   min-width: 308px;
 }
-.card h3 {
+.Card_module_card h3 {
   color: var(--color-white);
 }
-.card p {
+.Card_module_card p {
   color: #cecece;
 }
 
 /* src/components/CountingCard/CountingCard.module.scss */
-.counting-card {
+.CountingCard_module_counting-card {
   display: flex;
   flex-direction: column;
   border-radius: 16px;
@@ -345,29 +525,29 @@
   width: 314px;
   color: var(--color-white);
 }
-.counting-card .count::after {
+.CountingCard_module_counting-card .CountingCard_module_count::after {
   content: "+";
 }
-.counting-card .logo {
+.CountingCard_module_counting-card .CountingCard_module_logo {
   max-height: 67px;
   filter: brightness(0) invert(1);
 }
 
 /* src/components/InfoCard/InfoCard.module.scss */
-.info-card {
+.InfoCard_module_info-card {
   width: 100%;
   display: flex;
   flex-direction: column;
   padding: var(--spacing-lg);
   gap: var(--spacing-md);
 }
-.info-card .header {
+.InfoCard_module_info-card .InfoCard_module_header {
   display: flex;
   flex-direction: row;
   gap: var(--spacing-md);
   color: var(--color-black);
 }
-.info-card .badge {
+.InfoCard_module_info-card .InfoCard_module_badge {
   border-radius: 50%;
   color: var(--color-white);
   width: 40px;
@@ -377,20 +557,20 @@
   justify-content: center;
   background-color: #cecece;
 }
-.info-card.hasIcon .header {
+.InfoCard_module_info-card.InfoCard_module_hasIcon .InfoCard_module_header {
   color: var(--color-lenscrafter-blue);
 }
 
 /* src/components/Pagination/Pagination.module.scss */
-.pagination {
+.Pagination_module_pagination {
   display: flex;
   flex-direction: row;
   gap: 11px;
   padding: 5px;
   align-items: center;
 }
-.pagination .next,
-.pagination .prev {
+.Pagination_module_pagination .Pagination_module_next,
+.Pagination_module_pagination .Pagination_module_prev {
   padding: 0;
   border: none;
   border-radius: 50%;
@@ -400,17 +580,17 @@
   cursor: pointer;
   background: none;
 }
-.pagination .next path,
-.pagination .prev path {
+.Pagination_module_pagination .Pagination_module_next path,
+.Pagination_module_pagination .Pagination_module_prev path {
   fill: var(--color-black);
 }
-.pagination .pages {
+.Pagination_module_pagination .Pagination_module_pages {
   display: flex;
   justify-content: space-between;
   gap: 4px;
   width: max-content;
 }
-.pagination .page {
+.Pagination_module_pagination .Pagination_module_page {
   padding: 0;
   margin: 0;
   width: 20px;
@@ -421,18 +601,18 @@
   transition: width 0.3s;
   cursor: pointer;
 }
-.pagination .page.active {
+.Pagination_module_pagination .Pagination_module_page.Pagination_module_active {
   width: 40px;
   border: none;
   border-radius: 16px;
   background-color: var(--color-black);
 }
-.pagination .page.number.active {
+.Pagination_module_pagination .Pagination_module_page.Pagination_module_number.Pagination_module_active {
   width: 28px;
 }
 
 /* src/components/primitives/Container/Container.module.scss */
-.container {
+.Container_module_container {
   width: 100%;
   max-width: 1280px;
   overflow: visible;
@@ -441,7 +621,7 @@
 }
 
 /* src/components/PracticeCard/PracticeCard.module.scss */
-.practice-card {
+.PracticeCard_module_practice-card {
   color: var(--color-white);
   position: relative;
   max-width: 426px;
@@ -449,11 +629,11 @@
   overflow: hidden;
   cursor: pointer;
 }
-.practice-card .wrapper {
+.PracticeCard_module_practice-card .PracticeCard_module_wrapper {
   color: inherit;
   text-decoration: none;
 }
-.practice-card .background {
+.PracticeCard_module_practice-card .PracticeCard_module_background {
   object-fit: cover;
   position: absolute;
   z-index: 1;
@@ -463,7 +643,7 @@
   height: 100%;
   transition: transform 0.2s ease;
 }
-.practice-card .container {
+.PracticeCard_module_practice-card .PracticeCard_module_container {
   position: relative;
   z-index: 2;
   display: flex;
@@ -474,49 +654,49 @@
   padding: var(--spacing-lg);
 }
 @media (max-width: 768px) {
-  .practice-card .container {
+  .PracticeCard_module_practice-card .PracticeCard_module_container {
     flex-direction: row;
     align-items: center;
     justify-content: space-between;
     padding: var(--spacing-md);
   }
 }
-.practice-card .title {
+.PracticeCard_module_practice-card .PracticeCard_module_title {
   max-width: 196px;
 }
 @media (max-width: 768px) {
-  .practice-card .title {
+  .PracticeCard_module_practice-card .PracticeCard_module_title {
     max-width: 146px;
     font-size: var(--font-size-xl);
     line-height: var(--line-height-tight-4);
   }
 }
-.practice-card .cta {
+.PracticeCard_module_practice-card .PracticeCard_module_cta {
   display: flex;
   justify-content: flex-end;
 }
-.practice-card .ctaRest {
+.PracticeCard_module_practice-card .PracticeCard_module_ctaRest {
   position: absolute;
   opacity: 1;
   transition: opacity 0.2s ease, transform 0.2s ease;
 }
-.practice-card .ctaHover {
+.PracticeCard_module_practice-card .PracticeCard_module_ctaHover {
   opacity: 0;
   transition: opacity 0.2s ease;
 }
-.practice-card:hover .background {
+.PracticeCard_module_practice-card:hover .PracticeCard_module_background {
   transform: scale(1.08);
 }
-.practice-card:hover .ctaRest {
+.PracticeCard_module_practice-card:hover .PracticeCard_module_ctaRest {
   opacity: 0;
   transform: rotate(-45deg);
 }
-.practice-card:hover .ctaHover {
+.PracticeCard_module_practice-card:hover .PracticeCard_module_ctaHover {
   opacity: 1;
   transition-delay: 0.1s;
 }
 @media (max-width: 768px) {
-  .practice-card {
+  .PracticeCard_module_practice-card {
     width: 100%;
     max-width: unset;
     height: 140px;
@@ -524,114 +704,114 @@
 }
 
 /* src/widgets/CardCollection/CardCollection.module.scss */
-.card-collection {
+.CardCollection_module_card-collection {
   display: block;
   width: 100%;
   padding: var(--spacing-3xl) var(--spacing-7xl);
 }
-.card-collection h2 {
+.CardCollection_module_card-collection h2 {
   color: var(--color-black);
   margin-bottom: var(--spacing-sm);
 }
-.card-collection .content {
+.CardCollection_module_card-collection .CardCollection_module_content {
   margin-bottom: var(--spacing-xl);
 }
-.card-collection .wrapper {
+.CardCollection_module_card-collection .CardCollection_module_wrapper {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: var(--spacing-md);
 }
-.card-collection.threeCols .wrapper {
+.CardCollection_module_card-collection.CardCollection_module_threeCols .CardCollection_module_wrapper {
   grid-template-columns: repeat(3, 1fr);
 }
-.card-collection.examCard .wrapper {
+.CardCollection_module_card-collection.CardCollection_module_examCard .CardCollection_module_wrapper {
   grid-template-columns: repeat(auto-fit, minmax(314px, 1fr));
 }
 @media (max-width: 768px) {
-  .card-collection {
+  .CardCollection_module_card-collection {
     padding: var(--spacing-lg);
   }
-  .card-collection .wrapper {
+  .CardCollection_module_card-collection .CardCollection_module_wrapper {
     grid-template-columns: 1fr;
   }
-  .card-collection.threeCols .wrapper {
+  .CardCollection_module_card-collection.CardCollection_module_threeCols .CardCollection_module_wrapper {
     grid-template-columns: 1fr;
   }
 }
 
 /* src/widgets/ContactModule/ContactModule.module.scss */
-.contact-module {
+.ContactModule_module_contact-module {
   width: 100%;
   display: block;
   padding-top: 96px;
 }
-.contact-module .container,
-.contact-module .wrapper,
-.contact-module .content,
-.contact-module .cta-wrapper {
+.ContactModule_module_contact-module .ContactModule_module_container,
+.ContactModule_module_contact-module .ContactModule_module_wrapper,
+.ContactModule_module_contact-module .ContactModule_module_content,
+.ContactModule_module_contact-module .ContactModule_module_cta-wrapper {
   display: flex;
   flex-direction: column;
   align-items: center;
   width: 100%;
 }
-.contact-module .cta-wrapper {
+.ContactModule_module_contact-module .ContactModule_module_cta-wrapper {
   flex-direction: row;
   justify-content: center;
   gap: var(--spacing-sm);
 }
 @media (max-width: 768px) {
-  .contact-module .cta-wrapper {
+  .ContactModule_module_contact-module .ContactModule_module_cta-wrapper {
     flex-direction: column-reverse;
   }
-  .contact-module .cta-wrapper .cta {
+  .ContactModule_module_contact-module .ContactModule_module_cta-wrapper .ContactModule_module_cta {
     width: 100%;
   }
 }
-.contact-module .wrapper {
+.ContactModule_module_contact-module .ContactModule_module_wrapper {
   gap: var(--spacing-lg);
   padding: 0 var(--spacing-md);
 }
-.contact-module .content {
+.ContactModule_module_contact-module .ContactModule_module_content {
   gap: var(--spacing-sm);
   text-align: center;
 }
 @media (max-width: 768px) {
-  .contact-module .content {
+  .ContactModule_module_contact-module .ContactModule_module_content {
     max-width: 80%;
   }
 }
-.contact-module .title {
+.ContactModule_module_contact-module .ContactModule_module_title {
   color: var(--color-black);
 }
 @media (max-width: 768px) {
-  .contact-module .title {
+  .ContactModule_module_contact-module .ContactModule_module_title {
     max-width: 75%;
   }
 }
 @media (max-width: 768px) {
-  .contact-module .image {
+  .ContactModule_module_contact-module .ContactModule_module_image {
     max-width: 80%;
     margin-top: -14px;
   }
 }
 
 /* src/widgets/HeroBanner/HeroBanner.module.scss */
-.heroBanner {
+.HeroBanner_module_heroBanner {
   width: 100%;
   position: relative;
 }
-.heroBanner.mainHeroBanner {
+.HeroBanner_module_heroBanner.HeroBanner_module_mainHeroBanner {
   background-color: #f3f3f3;
   padding: 48px 80px 0 80px;
 }
-.heroBanner.mainHeroBanner .container {
+.HeroBanner_module_heroBanner.HeroBanner_module_mainHeroBanner .HeroBanner_module_container {
   max-width: 1280px;
   height: calc(100dvh - 112px);
   margin: 0 auto;
   border-radius: 16px;
   overflow: hidden;
 }
-.heroBanner.bannerPodcast .container {
+.HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container {
   flex-direction: row;
   align-items: center;
   justify-content: center;
@@ -639,47 +819,47 @@
   padding: var(--spacing-7xl);
   gap: 64px;
 }
-.heroBanner.bannerPodcast .container .banner {
+.HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_banner {
   padding: 0;
   justify-content: center;
 }
-.heroBanner.bannerPodcast .container .banner .text .title {
+.HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_banner .HeroBanner_module_text .HeroBanner_module_title {
   color: var(--color-black);
 }
-.heroBanner.bannerPodcast .container .banner .text .subtitle {
+.HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_banner .HeroBanner_module_text .HeroBanner_module_subtitle {
   color: var(--color-gray);
 }
-.heroBanner.bannerPodcast .container .logoWrapper {
+.HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_logoWrapper {
   z-index: 2;
 }
-.heroBanner.bannerPodcast .container .logoWrapper .logo {
+.HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_logoWrapper .HeroBanner_module_logo {
   object-fit: contain;
   max-width: 466px;
 }
-.heroBanner.bannerPodcast .container .horizontalGradient {
+.HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_horizontalGradient {
   display: flex;
   height: 8px;
 }
-.heroBanner.bannerPodcast .container .horizontalGradient .lensCrafters {
+.HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_horizontalGradient .HeroBanner_module_lensCrafters {
   background-color: var(--color-lenscrafter-blue);
 }
-.heroBanner.bannerPodcast .container .horizontalGradient .forEyes {
+.HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_horizontalGradient .HeroBanner_module_forEyes {
   background-color: var(--color-foreyes-brown);
 }
-.heroBanner.bannerPodcast .container .horizontalGradient .optical {
+.HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_horizontalGradient .HeroBanner_module_optical {
   background-color: var(--color-targetoptical-red);
 }
-.heroBanner.bannerPodcast .container .horizontalGradient .pearleVision {
+.HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_horizontalGradient .HeroBanner_module_pearleVision {
   background-color: var(--color-pearlevision-green);
 }
-.heroBanner .container {
+.HeroBanner_module_heroBanner .HeroBanner_module_container {
   position: relative;
   display: flex;
   flex-direction: column;
   justify-content: end;
   height: calc(100dvh - 64px);
 }
-.heroBanner .container .banner {
+.HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_banner {
   display: flex;
   flex-direction: column;
   justify-content: end;
@@ -690,20 +870,20 @@
   padding: var(--spacing-7xl);
   z-index: 2;
 }
-.heroBanner .container .banner .text {
+.HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_banner .HeroBanner_module_text {
   display: flex;
   flex-direction: column;
   gap: var(--spacing-sm);
   color: var(--color-white);
 }
-.heroBanner .container .banner .ctaContainer {
+.HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_banner .HeroBanner_module_ctaContainer {
   display: flex;
   gap: var(--spacing-sm);
 }
-.heroBanner .container .brandsStrip {
+.HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_brandsStrip {
   z-index: 3;
 }
-.heroBanner .container .backgroundImage {
+.HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_backgroundImage {
   position: absolute;
   top: 0;
   left: 0;
@@ -712,49 +892,49 @@
   object-fit: cover;
   z-index: 1;
 }
-.heroBanner .scrollDown {
+.HeroBanner_module_heroBanner .HeroBanner_module_scrollDown {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 100%;
   height: 64px;
 }
-.heroBanner .scrollDown .arrow {
+.HeroBanner_module_heroBanner .HeroBanner_module_scrollDown .HeroBanner_module_arrow {
   width: 32px;
   height: 32px;
 }
 @media (max-width: 768px) {
-  .heroBanner.mainHeroBanner {
+  .HeroBanner_module_heroBanner.HeroBanner_module_mainHeroBanner {
     padding: 24px 16px;
   }
-  .heroBanner.mainHeroBanner .container {
+  .HeroBanner_module_heroBanner.HeroBanner_module_mainHeroBanner .HeroBanner_module_container {
     height: calc(100dvh - 88px);
   }
-  .heroBanner.bannerPodcast .container {
+  .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container {
     flex-direction: column;
     padding: 24px 16px;
     gap: 32px;
   }
-  .heroBanner.bannerPodcast .container .banner {
+  .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_banner {
     order: 2;
     height: unset;
   }
-  .heroBanner.bannerPodcast .container .logoWrapper {
+  .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_logoWrapper {
     order: 1;
   }
-  .heroBanner.bannerPodcast .container .logoWrapper .logo {
+  .HeroBanner_module_heroBanner.HeroBanner_module_bannerPodcast .HeroBanner_module_container .HeroBanner_module_logoWrapper .HeroBanner_module_logo {
     width: 100%;
   }
-  .heroBanner .container .banner {
+  .HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_banner {
     padding: var(--spacing-lg) var(--spacing-md);
   }
-  .heroBanner .container .banner .ctaContainer {
+  .HeroBanner_module_heroBanner .HeroBanner_module_container .HeroBanner_module_banner .HeroBanner_module_ctaContainer {
     flex-direction: column;
   }
 }
 
 /* src/widgets/MiniBanner/MiniBanner.module.scss */
-.minibanner {
+.MiniBanner_module_minibanner {
   width: 100%;
   background-color: #f3f3f3;
   min-height: 192px;
@@ -762,10 +942,10 @@
   color: var(--color-white);
   text-align: center;
 }
-.minibanner :global(.h1) {
+.MiniBanner_module_minibanner .h1 {
   font-weight: 400;
 }
-.minibanner .background {
+.MiniBanner_module_minibanner .MiniBanner_module_background {
   position: absolute;
   left: 0;
   top: 0;
@@ -774,7 +954,7 @@
   object-fit: cover;
   z-index: 1;
 }
-.minibanner .container {
+.MiniBanner_module_minibanner .MiniBanner_module_container {
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -784,136 +964,136 @@
   z-index: 2;
 }
 @media (max-width: 768px) {
-  .minibanner .container {
+  .MiniBanner_module_minibanner .MiniBanner_module_container {
     padding: var(--spacing-3xl) var(--spacing-md);
   }
 }
-.minibanner.miniBannerNoBG {
+.MiniBanner_module_minibanner.MiniBanner_module_miniBannerNoBG {
   color: var(--color-black);
 }
-.minibanner.miniBannerNoBG .container {
+.MiniBanner_module_minibanner.MiniBanner_module_miniBannerNoBG .MiniBanner_module_container {
   gap: var(--spacing-lg);
   padding: var(--spacing-5xl) 0;
 }
 @media (max-width: 768px) {
-  .minibanner.miniBannerNoBG .container {
+  .MiniBanner_module_minibanner.MiniBanner_module_miniBannerNoBG .MiniBanner_module_container {
     padding: var(--spacing-5xl) var(--spacing-md);
   }
 }
 
 /* src/widgets/MiniSectionCta/MiniSectionCta.module.scss */
-.miniSectionCta {
+.MiniSectionCta_module_miniSectionCta {
   width: 100%;
 }
-.miniSectionCta .container {
+.MiniSectionCta_module_miniSectionCta .MiniSectionCta_module_container {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   gap: var(--spacing-md);
   padding: var(--spacing-3xl) var(--spacing-7xl);
 }
-.miniSectionCta .col {
+.MiniSectionCta_module_miniSectionCta .MiniSectionCta_module_col {
   display: flex;
   flex-direction: column;
   justify-content: center;
 }
-.miniSectionCta h2 {
+.MiniSectionCta_module_miniSectionCta h2 {
   color: var(--color-black);
 }
-.miniSectionCta.BgColorBlack {
+.MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_BgColorBlack {
   background: var(--color-black);
   color: var(--color-white);
 }
-.miniSectionCta.BgColorBlack h2 {
+.MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_BgColorBlack h2 {
   color: var(--color-white);
 }
-.miniSectionCta.BgColorBlack :global(.subheading) {
+.MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_BgColorBlack .subheading {
   color: #cecece;
 }
-.miniSectionCta.infoCallout .col {
+.MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_infoCallout .MiniSectionCta_module_col {
   flex-direction: row;
   gap: 112px;
   align-items: center;
 }
-.miniSectionCta.infoCallout h2 {
+.MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_infoCallout h2 {
   min-width: fit-content;
 }
-.miniSectionCta.miniTextCenterCta .container {
+.MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_miniTextCenterCta .MiniSectionCta_module_container {
   flex-direction: column;
   align-items: center;
 }
 @media (max-width: 768px) {
-  .miniSectionCta .container {
+  .MiniSectionCta_module_miniSectionCta .MiniSectionCta_module_container {
     flex-direction: column;
     padding: var(--spacing-lg) var(--spacing-md);
   }
-  .miniSectionCta .cta {
+  .MiniSectionCta_module_miniSectionCta .MiniSectionCta_module_cta {
     width: 100%;
   }
-  .miniSectionCta.BgColorBlack {
+  .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_BgColorBlack {
     text-align: center;
   }
-  .miniSectionCta.BgColorGrey {
+  .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_BgColorGrey {
     text-align: center;
   }
-  .miniSectionCta.infoCallout .col {
+  .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_infoCallout .MiniSectionCta_module_col {
     flex-direction: column;
     gap: var(--spacing-md);
     align-items: flex-start;
   }
-  .miniSectionCta.infoCallout .subtitle {
+  .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_infoCallout .MiniSectionCta_module_subtitle {
     font-size: var(--font-size-lg);
     font-weight: var(--font-weight-medium);
     line-height: var(--line-height-tight-1);
   }
-  .miniSectionCta.miniTextCenterCta .col {
+  .MiniSectionCta_module_miniSectionCta.MiniSectionCta_module_miniTextCenterCta .MiniSectionCta_module_col {
     width: 100%;
   }
 }
 
 /* src/widgets/PracticePathCards/PracticePathCards.module.scss */
-.practice-path-cards {
+.PracticePathCards_module_practice-path-cards {
   display: block;
   width: 100%;
   padding: var(--spacing-3xl) 0;
 }
 @media (max-width: 768px) {
-  .practice-path-cards {
+  .PracticePathCards_module_practice-path-cards {
     padding: var(--spacing-lg) var(--spacing-md);
   }
 }
-.practice-path-cards h2 {
+.PracticePathCards_module_practice-path-cards h2 {
   color: var(--color-black);
 }
-.practice-path-cards .container {
+.PracticePathCards_module_practice-path-cards .PracticePathCards_module_container {
   display: flex;
   flex-direction: column;
   gap: var(--spacing-xl);
 }
-.practice-path-cards .wrapper {
+.PracticePathCards_module_practice-path-cards .PracticePathCards_module_wrapper {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--spacing-xl);
 }
 @media (max-width: 768px) {
-  .practice-path-cards .wrapper {
+  .PracticePathCards_module_practice-path-cards .PracticePathCards_module_wrapper {
     flex-direction: column;
   }
-  .practice-path-cards .wrapper .ctaWrapper {
+  .PracticePathCards_module_practice-path-cards .PracticePathCards_module_wrapper .PracticePathCards_module_ctaWrapper {
     width: 100%;
     padding: 0 var(--spacing-lg);
   }
-  .practice-path-cards .wrapper .ctaWrapper .cta {
+  .PracticePathCards_module_practice-path-cards .PracticePathCards_module_wrapper .PracticePathCards_module_ctaWrapper .PracticePathCards_module_cta {
     width: 100%;
   }
 }
-.practice-path-cards .content {
+.PracticePathCards_module_practice-path-cards .PracticePathCards_module_content {
   display: flex;
   flex-direction: column;
   gap: var(--spacing-sm);
 }
-.practice-path-cards .cards {
+.PracticePathCards_module_practice-path-cards .PracticePathCards_module_cards {
   display: flex;
   flex-direction: row;
   overflow: hidden;
@@ -921,107 +1101,107 @@
   justify-content: center;
 }
 @media (max-width: 768px) {
-  .practice-path-cards .cards {
+  .PracticePathCards_module_practice-path-cards .PracticePathCards_module_cards {
     flex-direction: column;
   }
 }
-.practice-path-cards .card {
+.PracticePathCards_module_practice-path-cards .PracticePathCards_module_card {
   width: 33.333%;
 }
 @media (max-width: 768px) {
-  .practice-path-cards .card {
+  .PracticePathCards_module_practice-path-cards .PracticePathCards_module_card {
     width: 100%;
   }
 }
 
 /* src/widgets/Teaser5050With3Text/Teaser5050With3Text.module.scss */
-.teaser5050-3text {
+.Teaser5050With3Text_module_teaser5050-3text {
   width: 100%;
 }
-.teaser5050-3text .container {
+.Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_container {
   display: flex;
   flex-direction: column;
   gap: var(--spacing-xl);
 }
-.teaser5050-3text .content {
+.Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_content {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   gap: var(--spacing-xl);
 }
-.teaser5050-3text.right .content {
+.Teaser5050With3Text_module_teaser5050-3text.Teaser5050With3Text_module_right .Teaser5050With3Text_module_content {
   flex-direction: row-reverse;
 }
-.teaser5050-3text .title {
+.Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_title {
   color: var(--color-black);
 }
-.teaser5050-3text .image {
+.Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_image {
   width: 50%;
   border-radius: 16px;
 }
 @media (max-width: 768px) {
-  .teaser5050-3text .container {
+  .Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_container {
     padding: var(--spacing-lg) var(--spacing-md);
     gap: 0;
   }
-  .teaser5050-3text.right .container {
+  .Teaser5050With3Text_module_teaser5050-3text.Teaser5050With3Text_module_right .Teaser5050With3Text_module_container {
     gap: var(--spacing-xl);
   }
-  .teaser5050-3text .content {
+  .Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_content {
     flex-direction: column;
   }
-  .teaser5050-3text.right .content {
+  .Teaser5050With3Text_module_teaser5050-3text.Teaser5050With3Text_module_right .Teaser5050With3Text_module_content {
     flex-direction: column-reverse;
     gap: var(--spacing-xl);
   }
-  .teaser5050-3text .image {
+  .Teaser5050With3Text_module_teaser5050-3text .Teaser5050With3Text_module_image {
     width: 100%;
     padding: 0;
   }
 }
 
 /* src/widgets/Teaser5050WithCta/Teaser5050WithCta.module.scss */
-.teaser5050 {
+.Teaser5050WithCta_module_teaser5050 {
   width: 100%;
 }
-.teaser5050 .container {
+.Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_container {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
 }
-.teaser5050.right .container {
+.Teaser5050WithCta_module_teaser5050.Teaser5050WithCta_module_right .Teaser5050WithCta_module_container {
   flex-direction: row-reverse;
 }
-.teaser5050 .wrapper {
+.Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_wrapper {
   display: flex;
   flex-direction: column;
   gap: var(--spacing-md);
   padding: 0 var(--spacing-5xl);
   width: 50%;
 }
-.teaser5050 .title {
+.Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_title {
   color: var(--color-black);
 }
-.teaser5050 .image {
+.Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_image {
   width: 50%;
   border-radius: 16px;
 }
 @media (max-width: 768px) {
-  .teaser5050 .container {
+  .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_container {
     flex-direction: column-reverse;
     gap: var(--spacing-xl);
   }
-  .teaser5050.right .container {
+  .Teaser5050WithCta_module_teaser5050.Teaser5050WithCta_module_right .Teaser5050WithCta_module_container {
     flex-direction: column-reverse;
   }
-  .teaser5050 .wrapper,
-  .teaser5050 .image {
+  .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_wrapper,
+  .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_image {
     width: 100%;
     padding: 0;
   }
-  .teaser5050 .cta {
+  .Teaser5050WithCta_module_teaser5050 .Teaser5050WithCta_module_cta {
     width: 100%;
   }
 }