@marioschmidt/design-system-tokens 1.0.58 → 1.0.59

package/dist/{bundles → css/bundles}/quick-start/advertorial-all.css

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * ADVERTORIAL Design System Tokens v1.0.58
+ * ADVERTORIAL Design System Tokens v1.0.59
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Advertorial | Bundle: Quick Start Bundle (All semantic + component tokens)
@@ -96,17 +96,17 @@
   --font-family-antenna-extra-cond: AntennaExtraCond;
   --font-family-antenna-cond: AntennaCond;
   --font-family-inter: Inter;
-  --font-weight-700-black-font-weight: 700;
-  --font-weight-900-extra-black-font-weight: 900;
-  --font-weight-400-book-font-weight: 400;
-  --font-weight-1000-ultra-font-weight: 1000;
-  --font-weight-800-black-font-weight: 800;
-  --font-weight-350-book-font-weight: 350;
-  --font-weight-600-bold-font-weight: 600;
-  --font-weight-100-thin-font-weight: 100;
+  --700-black-font-weight: 700;
+  --900-extra-black-font-weight: 900;
+  --400-book-font-weight: 400;
+  --1000-ultra-font-weight: 1000;
+  --800-black-font-weight: 800;
+  --350-book-font-weight: 350;
+  --600-bold-font-weight: 600;
+  --100-thin-font-weight: 100;
   --300-light-font-weight: 300;
-  --font-weight-200-extra-light-font-weight: 200;
-  --font-weight-500-medium-font-weight: 500;
+  --200-extra-light-font-weight: 200;
+  --500-medium-font-weight: 500;
   --bold-italic-font-weight-st: Bold Italic;
   --black-font-weight-st: Black;
   --letter-space-neg0-25: -0.25px;
@@ -120,18 +120,18 @@
   --letter-space-neg2: -2px;
   --letter-space3: 3px;
   --letter-space-neg3: -3px;
-  --font-weight-string-1000-ultra-font-weight: 1000;
-  --font-weight-string-900-extra-black-font-weight: 900;
-  --font-weight-string-800-black-font-weight: 800;
-  --font-weight-string-700-black-font-weight: 700;
-  --font-weight-string-600-bold-font-weight: 600;
-  --font-weight-string-500-medium-font-weight: 500;
-  --font-weight-string-400-book-font-weight: 400;
-  --font-weight-string-350-book-font-weight: 350;
-  --font-weight-string-200-extra-light-font-weight: 200;
-  --font-weight-string-100-thin-font-weight: 100;
-  --600-bold-italic-font-weight: Bold Italic;
-  --700-black-italic-font-weight: Black Italic;
+  --1000-ultra-font-weight-st: 1000;
+  --900-extra-black-font-weight-st: 900;
+  --800-black-font-weight-st: 800;
+  --700-black-font-weight-st: 700;
+  --600-bold-font-weight-st: 600;
+  --500-medium-font-weight-st: 500;
+  --400-book-font-weight-st: 400;
+  --350-book-font-weight-st: 350;
+  --200-extra-light-font-weight-st: 200;
+  --100-thin-font-weight-st: 100;
+  --600-bold-italic-font-weight-st: Bold Italic;
+  --700-black-italic-font-weight-st: Black Italic;
   --bildred: #DD0000;
   --bildred035: #AF0002;
   --bildred053: #F52D2D;
@@ -208,331 +208,60 @@
   --opacity50: 0.5;
   --opacity00: 0;
   --opacity70: 0.7;
-  --display1-font-size-xs: 39px;
-  --display1-font-size-sm: 39px;
-  --display1-font-size-md: 70px;
-  --display1-font-size-lg: 116px;
-  --display2-font-size-xs: 35px;
-  --display2-font-size-sm: 35px;
-  --display2-font-size-md: 41px;
-  --display2-font-size-lg: 62px;
-  --display3-font-size-sm: 27px;
-  --display3-font-size-md: 31px;
-  --display3-font-size-lg: 39px;
-  --display3-font-size-xs: 27px;
-  --headline1-font-size-xs: 36px;
-  --headline1-font-size-sm: 36px;
-  --headline1-font-size-md: 54px;
-  --headline1-font-size-lg: 70px;
-  --headline2-font-size-xs: 30px;
-  --headline2-font-size-sm: 30px;
-  --headline2-font-size-md: 36px;
-  --headline2-font-size-lg: 48px;
-  --headline3-font-size-xs: 24px;
-  --headline3-font-size-sm: 24px;
-  --headline3-font-size-md: 26px;
-  --headline3-font-size-lg: 32px;
-  --headline4-font-size-xs: 16px;
-  --headline4-font-size-sm: 16px;
-  --headline4-font-size-md: 20px;
-  --headline4-font-size-lg: 22px;
-  --headline-text-align: center;
-  --kicker1-font-size-xs: 16px;
-  --kicker1-font-size-sm: 16px;
-  --kicker1-font-size-md: 18px;
-  --kicker1-font-size-lg: 25px;
-  --kicker2-font-size-xs: 16px;
-  --kicker2-font-size-sm: 16px;
-  --kicker2-font-size-md: 18px;
-  --kicker2-font-size-lg: 21px;
-  --kicker3-font-size-xs: 14px;
-  --kicker3-font-size-sm: 14px;
-  --kicker3-font-size-md: 14px;
-  --kicker3-font-size-lg: 16px;
-  --kicker4-font-size-xs: 12px;
-  --kicker4-font-size-sm: 12px;
-  --kicker4-font-size-md: 14px;
-  --kicker4-font-size-lg: 14px;
-  --subheadline1-font-size-xs: 18px;
-  --subheadline1-font-size-sm: 18px;
-  --subheadline1-font-size-md: 18px;
-  --subheadline1-font-size-lg: 28px;
-  --title1-font-size-xs: 22px;
-  --title1-font-size-sm: 22px;
-  --title1-font-size-md: 22px;
-  --title1-font-size-lg: 28px;
-  --title2-font-size-xs: 14px;
-  --title2-font-size-sm: 14px;
-  --title2-font-size-md: 16px;
-  --title2-font-size-lg: 18px;
-  --callout1-font-size-xs: 16px;
-  --callout1-font-size-sm: 16px;
-  --callout1-font-size-md: 22px;
-  --callout1-font-size-lg: 22px;
-  --body-font-size-xs: 17px;
-  --body-font-size-sm: 17px;
-  --body-font-size-md: 17px;
-  --body-font-size-lg: 17px;
-  --footnote1-font-size-xs: 13px;
-  --footnote1-font-size-sm: 13px;
-  --footnote1-font-size-md: 13px;
-  --footnote1-font-size-lg: 15px;
-  --footnote2-font-size-xs: 10px;
-  --footnote2-font-size-sm: 10px;
-  --footnote2-font-size-md: 10px;
-  --footnote2-font-size-lg: 13px;
-  --quote-font-size-xs: 16px;
-  --quote-font-size-sm: 16px;
-  --quote-font-size-md: 16px;
-  --quote-font-size-lg: 18px;
-  --label1-font-size: 17px;
-  --label2-font-size: 15px;
-  --label3-font-size: 12px;
-  --label4-font-size: 8px;
-  --label1-resp-font-size-xs: 10px;
-  --label1-resp-font-size-sm: 10px;
-  --label1-resp-font-size-md: 15px;
-  --label1-resp-font-size-lg: 17px;
-  --display1-line-height-xs: 40px;
-  --display1-line-height-sm: 40px;
-  --display1-line-height-md: 72px;
-  --display1-line-height-lg: 120px;
-  --display2-line-height-xs: 36px;
-  --display2-line-height-sm: 36px;
-  --display2-line-height-md: 42px;
-  --display2-line-height-lg: 64px;
-  --display3-line-height-lg: 40px;
-  --display3-line-height-md: 32px;
-  --display3-line-height-sm: 28px;
-  --display3-line-height-xs: 28px;
-  --headline1-line-height-xs: 37.8px;
-  --headline1-line-height-sm: 37.8px;
-  --headline1-line-height-md: 56.7px;
-  --headline1-line-height-lg: 77px;
-  --headline2-line-height-xs: 33px;
-  --headline2-line-height-sm: 33px;
-  --headline2-line-height-md: 39.6px;
-  --headline2-line-height-lg: 52.8px;
-  --headline3-line-height-xs: 26.4px;
-  --headline3-line-height-sm: 26.4px;
-  --headline3-line-height-md: 28.6px;
-  --headline3-line-height-lg: 35.2px;
-  --headline4-line-height-xs: 18.4px;
-  --headline4-line-height-sm: 18.4px;
-  --headline4-line-height-md: 19.8px;
-  --headline4-line-height-lg: 27.5px;
-  --subheadline1-line-height-xs: 23.4px;
-  --subheadline1-line-height-sm: 23.4px;
-  --subheadline1-line-height-md: 23.4px;
-  --subheadline1-line-height-lg: 36.4px;
-  --kicker1-line-height-xs: 17.6px;
-  --kicker1-line-height-sm: 17.6px;
-  --kicker1-line-height-md: 19.8px;
-  --kicker1-line-height-lg: 27.5px;
-  --kicker2-line-height-xs: 17.6px;
-  --kicker2-line-height-sm: 17.6px;
-  --kicker2-line-height-md: 19.8px;
-  --kicker2-line-height-lg: 23.1px;
-  --kicker3-line-height-xs: 15.4px;
-  --kicker3-line-height-sm: 15.4px;
-  --kicker3-line-height-md: 15.4px;
-  --kicker3-line-height-lg: 17.6px;
-  --kicker4-line-height-xs: 13.2px;
-  --kicker4-line-height-sm: 13.2px;
-  --kicker4-line-height-md: 15.4px;
-  --kicker4-line-height-lg: 15.4px;
-  --title1-line-height-xs: 26.4px;
-  --title1-line-height-sm: 26.4px;
-  --title1-line-height-md: 26.4px;
-  --title1-line-height-lg: 33.6px;
-  --title2-line-height-xs: 16.8px;
-  --title2-line-height-sm: 16.8px;
-  --title2-line-height-md: 19.2px;
-  --title2-line-height-lg: 23.4px;
-  --callout1-line-height-xs: 20.8px;
-  --callout1-line-height-sm: 20.8px;
-  --callout1-line-height-md: 28.6px;
-  --callout1-line-height-lg: 28.6px;
-  --body-line-height-xs: 29.75px;
-  --body-line-height-sm: 29.75px;
-  --body-line-height-md: 29.75px;
-  --body-line-height-lg: 29.75px;
-  --footnote1-line-height-xs: 16.9px;
-  --footnote1-line-height-sm: 16.9px;
-  --footnote1-line-height-md: 16.9px;
-  --footnote1-line-height-lg: 19.5px;
-  --footnote2-line-height-xs: 13px;
-  --footnote2-line-height-sm: 13px;
-  --footnote2-line-height-md: 13px;
-  --footnote2-line-height-lg: 16.9px;
-  --label1-line-height: 20.4px;
-  --label1-resp-line-height-xs: 10px;
-  --label1-resp-line-height-sm: 10px;
-  --label1-resp-line-height-md: 15px;
-  --label1-resp-line-height-lg: 17px;
-  --label2-line-height: 16px;
-  --label3-line-height: 14.4px;
-  --label4-line-height: 10px;
-  --quote-line-height-xs: 20.8px;
-  --quote-line-height-sm: 20.8px;
-  --quote-line-height-md: 20.8px;
-  --quote-line-height-lg: 23.4px;
-  --body-font-weight-book: 400;
-  --body-font-weight-bold: 700;
-  --footnote-font-weight-book: 400;
-  --footnote-font-weight-bold: 700;
-  --label-font-weight-book: 400;
-  --label-font-weight-bold: 700;
-  --quote-font-weight: 800;
-  --display-font-weight: 800;
-  --headline1-font-weight-st: 700;
-  --headline1-font-weight: 700;
-  --headline2-font-weight: 700;
-  --headline3-font-weight: 700;
-  --headline4-font-weight: 600;
-  --headline2-font-weight-st: 700;
-  --headline3-font-weight-st: 700;
-  --headline4-font-weight-st: 600;
-  --subheadline-font-weight: 700;
-  --kicker-font-weight: 700;
-  --kicker-font-weight-st: 700;
-  --callout-font-weight: 800;
-  --title-font-weight: 800;
-  --kicker-font-family: Lucida Grande;
-  --display-font-family: Lucida Grande;
-  --headline-font-family: Lucida Grande;
-  --subheadline-font-family: Lucida Grande;
-  --body-font-family: Lucida Grande;
-  --footnote-font-family: Lucida Grande;
-  --label-font-family: Lucida Grande;
-  --quote-font-family: Lucida Grande;
-  --title-font-family: Lucida Grande;
-  --callout-font-family: Lucida Grande;
-  --hide-on-bild: true;
-  --hide-on-sport-bild: true;
-  --only-advertorial: true;
-  --hide-on-advertorial: false;
-  --only-bild: false;
-  --only-sport-bild: false;
-  --article-image-caption-font-size-xs: 13px;
-  --article-image-caption-font-size-md: 13px;
-  --article-image-caption-font-size-lg: 16px;
-  --article-image-caption-font-size-sm: 13px;
-  --article-image-source-font-size-xs: 13px;
-  --article-image-source-font-size-sm: 13px;
-  --article-image-source-font-size-md: 13px;
-  --article-image-source-font-size-lg: 16px;
-  --article-image-caption-line-height-xs: 19.5px;
-  --article-image-caption-line-height-md: 19.5px;
-  --article-image-caption-line-height-lg: 24px;
-  --article-image-caption-line-height-sm: 19.5px;
-  --article-image-source-line-height-md: 19px;
-  --article-image-source-line-height-lg: 24px;
-  --article-image-source-line-height-xs: 19px;
-  --article-image-source-line-height-sm: 19px;
-  --breadcrumb-font-size-xs: 15px;
-  --breadcrumb-font-size-sm: 15px;
-  --breadcrumb-font-size-md: 15px;
-  --breadcrumb-font-size-lg: 12px;
-  --breadcrumb-line-height-xs: 15px;
-  --breadcrumb-line-height-sm: 15px;
-  --breadcrumb-line-height-md: 15px;
-  --breadcrumb-line-height-lg: 12px;
-  --breadcrumb-font-family: Lucida Grande;
-  --breadcrumb-font-weight: 700;
-  --menu-item-font-size: 15px;
-  --app-top-bar-title-font-size-md: 14px;
-  --app-top-bar-title-font-size-lg: 14px;
-  --app-top-bar-title-font-size-xs: 12px;
-  --app-top-bar-title-font-size-sm: 12px;
-  --app-top-bar-title-line-height-md: 17px;
-  --app-top-bar-title-line-height-lg: 17px;
-  --app-top-bar-title-line-height-xs: 14px;
-  --app-top-bar-title-line-height-sm: 14px;
-  --menu-item-font-weight: 700;
-  --teaser-title-inline-space-lg: 12px;
-  --teaser-title-inline-space-md: 12px;
-  --teaser-title-inline-space-sm: 8px;
-  --teaser-title-inline-space-xs: 8px;
-  --q-teaser-title-inline-space-lg: 12px;
-  --q-teaser-title-inline-space-md: 16px;
-  --q-teaser-title-inline-space-sm: 8px;
-  --q-teaser-title-inline-space-xs: 8px;
-  --a-teaser-title-inline-space-lg: 12px;
-  --a-teaser-title-inline-space-md: 12px;
-  --a-teaser-title-inline-space-xs: 8px;
-  --a-teaser-title-inline-space-sm: 8px;
-  --b-teaser-title-inline-space: 8px;
-  --2xa-teaser-title-inline-space: 8px;
-  --mini-qteaser-title-inline-space-md: 8px;
-  --mini-qteaser-title-inline-space-lg: 8px;
-  --mini-qteaser-title-inline-space-sm: 8px;
-  --mini-qteaser-title-inline-space-xs: 8px;
-  --super-ateaser-title-inline-space: 16px;
-  --avatar-font-family: Lucida Grande;
-  --avatar-font-size-sm: 13px;
-  --avatar-font-size-lg: 15px;
-  --breaking-news-content-font-size: 21px;
-  --accordion-label-font-family: Lucida Grande;
-  --footer-link-font-family: Gotham XNarrow;
-  --video-time-badge-font-family: Lucida Grande;
-  --input-field-label-font-family: Lucida Grande;
-  --button-label-font-weight-st: 600;
-  --brand-name: Advertorial;
 }
 
 /* === COLOR TOKENS (LIGHT MODE) === */
 
 [data-brand="advertorial"][data-theme="light"] {
-  .shadowsoftsm {
+  .shadow-soft-sm {
     box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.04), 0px 2px 6px 0px rgba(0, 0, 0, 0.08);
   }
 
-  .shadowsoftmd {
+  .shadow-soft-md {
     box-shadow: 0px 2px 16px 0px rgba(0, 0, 0, 0.03), 0px 4px 12px 0px rgba(0, 0, 0, 0.07);
   }
 
-  .shadowsoftlg {
+  .shadow-soft-lg {
     box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.03), 0px 8px 16px 0px rgba(0, 0, 0, 0.07);
   }
 
-  .shadowsoftxl {
+  .shadow-soft-xl {
     box-shadow: 0px 0px 64px 0px rgba(0, 0, 0, 0.05), 0px 16px 32px 0px rgba(0, 0, 0, 0.1);
   }
 
-  .shadowhardsm {
+  .shadow-hard-sm {
     box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2), 0px 1px 3px 1px rgba(0, 0, 0, 0.1);
   }
 
-  .shadowhardmd {
+  .shadow-hard-md {
     box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.1), 0px 2px 4px 0px rgba(0, 0, 0, 0.16);
   }
 
-  .shadowhardlg {
+  .shadow-hard-lg {
     box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.2), 0px 6px 10px 4px rgba(0, 0, 0, 0.1);
   }
 
-  .shadowhardxl {
+  .shadow-hard-xl {
     box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2), 0px 8px 12px 6px rgba(0, 0, 0, 0.1);
   }
 
-  .teaserheadlinesshadow {
+  .teaser-headlines-shadow {
     box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.6);
   }
 
-  .menushadow {
+  .menu-shadow {
     box-shadow: 0px 8px 10px -8px rgba(0, 0, 0, 0.1);
   }
 
-  .heyinputshadow {
+  .hey-input-shadow {
     box-shadow: 0px 8px 10px -8px rgba(0, 0, 0, 0);
   }
 
-  .alertshadowdown {
+  .alert-shadow-down {
     box-shadow: 0px 6px 10px 0px rgba(0, 0, 0, 0.2);
   }
 
-  .alertshadowup {
+  .alert-shadow-up {
     box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.2);
   }
 }
@@ -540,55 +269,55 @@
 /* === COLOR TOKENS (DARK MODE) === */
 
 [data-brand="advertorial"][data-theme="dark"] {
-  .shadowsoftsm {
+  .shadow-soft-sm {
     box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.04), 0px 2px 6px 0px rgba(0, 0, 0, 0.08);
   }
 
-  .shadowsoftmd {
+  .shadow-soft-md {
     box-shadow: 0px 2px 16px 0px rgba(0, 0, 0, 0.03), 0px 4px 12px 0px rgba(0, 0, 0, 0.07);
   }
 
-  .shadowsoftlg {
+  .shadow-soft-lg {
     box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.03), 0px 8px 16px 0px rgba(0, 0, 0, 0.07);
   }
 
-  .shadowsoftxl {
+  .shadow-soft-xl {
     box-shadow: 0px 0px 64px 0px rgba(0, 0, 0, 0.05), 0px 16px 32px 0px rgba(0, 0, 0, 0.1);
   }
 
-  .shadowhardsm {
+  .shadow-hard-sm {
     box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2), 0px 1px 3px 1px rgba(0, 0, 0, 0.1);
   }
 
-  .shadowhardmd {
+  .shadow-hard-md {
     box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.1), 0px 2px 4px 0px rgba(0, 0, 0, 0.16);
   }
 
-  .shadowhardlg {
+  .shadow-hard-lg {
     box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.2), 0px 6px 10px 4px rgba(0, 0, 0, 0.1);
   }
 
-  .shadowhardxl {
+  .shadow-hard-xl {
     box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2), 0px 8px 12px 6px rgba(0, 0, 0, 0.1);
   }
 
-  .teaserheadlinesshadow {
+  .teaser-headlines-shadow {
     box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.6);
   }
 
-  .menushadow {
+  .menu-shadow {
     box-shadow: 0px 8px 10px -8px rgba(0, 0, 0, 0.1);
   }
 
-  .heyinputshadow {
+  .hey-input-shadow {
     box-shadow: 0px 8px 10px -8px rgba(0, 0, 0, 0);
   }
 
-  .alertshadowdown {
+  .alert-shadow-down {
     box-shadow: 0px 6px 10px 0px rgba(0, 0, 0, 0.2);
   }
 
-  .alertshadowup {
+  .alert-shadow-up {
     box-shadow: 0px -2px 10px 0px rgba(0, 0, 0, 0.2);
   }
 }
@@ -627,75 +356,6 @@
   --button-label-font-size: 15px;
   --button-inline-space: 16px;
 }
-
-/* === COMPONENT TOKENS & EFFECTS === */
-
-[data-brand="advertorial"] {
-  --teaser-title-inline-space-lg: 12px;
-  --teaser-title-inline-space-md: 12px;
-  --teaser-title-inline-space-sm: 8px;
-  --teaser-title-inline-space-xs: 8px;
-  --q-teaser-title-inline-space-lg: 12px;
-  --q-teaser-title-inline-space-md: 16px;
-  --q-teaser-title-inline-space-sm: 8px;
-  --q-teaser-title-inline-space-xs: 8px;
-  --a-teaser-title-inline-space-lg: 12px;
-  --a-teaser-title-inline-space-md: 12px;
-  --a-teaser-title-inline-space-xs: 8px;
-  --a-teaser-title-inline-space-sm: 8px;
-  --b-teaser-title-inline-space: 8px;
-  --2xa-teaser-title-inline-space: 8px;
-  --mini-qteaser-title-inline-space-md: 8px;
-  --mini-qteaser-title-inline-space-lg: 8px;
-  --mini-qteaser-title-inline-space-sm: 8px;
-  --mini-qteaser-title-inline-space-xs: 8px;
-  --super-ateaser-title-inline-space: 16px;
-  --menu-item-font-size: 15px;
-  --app-top-bar-title-font-size-md: 14px;
-  --app-top-bar-title-font-size-lg: 14px;
-  --app-top-bar-title-font-size-xs: 12px;
-  --app-top-bar-title-font-size-sm: 12px;
-  --app-top-bar-title-line-height-md: 17px;
-  --app-top-bar-title-line-height-lg: 17px;
-  --app-top-bar-title-line-height-xs: 14px;
-  --app-top-bar-title-line-height-sm: 14px;
-  --menu-item-font-weight: 700;
-  --video-time-badge-font-family: Lucida Grande;
-  --input-field-label-font-family: Lucida Grande;
-  --footer-link-font-family: Gotham XNarrow;
-  --button-label-font-weight-st: 600;
-  --breaking-news-content-font-size: 21px;
-  --breadcrumb-font-size-xs: 15px;
-  --breadcrumb-font-size-sm: 15px;
-  --breadcrumb-font-size-md: 15px;
-  --breadcrumb-font-size-lg: 12px;
-  --breadcrumb-line-height-xs: 15px;
-  --breadcrumb-line-height-sm: 15px;
-  --breadcrumb-line-height-md: 15px;
-  --breadcrumb-line-height-lg: 12px;
-  --breadcrumb-font-family: Lucida Grande;
-  --breadcrumb-font-weight: 700;
-  --avatar-font-family: Lucida Grande;
-  --avatar-font-size-sm: 13px;
-  --avatar-font-size-lg: 15px;
-  --article-image-caption-font-size-xs: 13px;
-  --article-image-caption-font-size-md: 13px;
-  --article-image-caption-font-size-lg: 16px;
-  --article-image-caption-font-size-sm: 13px;
-  --article-image-source-font-size-xs: 13px;
-  --article-image-source-font-size-sm: 13px;
-  --article-image-source-font-size-md: 13px;
-  --article-image-source-font-size-lg: 16px;
-  --article-image-caption-line-height-xs: 19.5px;
-  --article-image-caption-line-height-md: 19.5px;
-  --article-image-caption-line-height-lg: 24px;
-  --article-image-caption-line-height-sm: 19.5px;
-  --article-image-source-line-height-md: 19px;
-  --article-image-source-line-height-lg: 24px;
-  --article-image-source-line-height-xs: 19px;
-  --article-image-source-line-height-sm: 19px;
-  --accordion-label-font-family: Lucida Grande;
-}
 /* === RESPONSIVE TOKENS & TYPOGRAPHY === */
 
 [data-brand="advertorial"] {
@@ -725,30 +385,30 @@
 
   .headline1 {
     font-family: Lucida Grande;
+    font-weight: 900;
     font-size: 36px;
     line-height: 37.8px;
-    font-style: 700;
   }
 
   .headline2 {
     font-family: Lucida Grande;
+    font-weight: 900;
     font-size: 30px;
     line-height: 33px;
-    font-style: 700;
   }
 
   .headline3 {
     font-family: Lucida Grande;
+    font-weight: 900;
     font-size: 24px;
     line-height: 26.4px;
-    font-style: 700;
   }
 
   .headline4 {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 16px;
     line-height: 16px;
-    font-style: 600;
   }
 
   .subheadline1 {
@@ -760,30 +420,30 @@
 
   .kicker1 {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 16px;
     line-height: 17.6px;
-    font-style: 700;
   }
 
   .kicker2 {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 16px;
     line-height: 17.6px;
-    font-style: 700;
   }
 
   .kicker3 {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 14px;
     line-height: 15.4px;
-    font-style: 700;
   }
 
   .kicker4 {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 12px;
     line-height: 13.2px;
-    font-style: 700;
   }
 
   .title1 {
@@ -793,7 +453,7 @@
     line-height: 26.4px;
   }
 
-  .title1uppercase {
+  .title1-uppercase {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 22px;
@@ -808,7 +468,7 @@
     line-height: 16.8px;
   }
 
-  .title2uppercase {
+  .title2-uppercase {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 14px;
@@ -830,26 +490,30 @@
     line-height: 29.75px;
   }
 
-  .bodyitalic {
+  .body-italic {
     font-family: Lucida Grande;
+    font-weight: 400;
     font-size: 17px;
     line-height: 29.75px;
+    font-style: italic;
   }
 
-  .bodybold {
+  .body-bold {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 17px;
     line-height: 29.75px;
   }
 
-  .bodybolditalic {
+  .body-bold-italic {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 17px;
     line-height: 29.75px;
+    font-style: italic;
   }
 
-  .textlink {
+  .text-link {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 17px;
@@ -857,14 +521,16 @@
     text-decoration: underline;
   }
 
-  .textlinkitalic {
+  .text-link-italic {
     font-family: Lucida Grande;
+    font-weight: 400;
     font-size: 17px;
     line-height: 29.75px;
+    font-style: italic;
     text-decoration: underline;
   }
 
-  .textlinkbold {
+  .text-link-bold {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 17px;
@@ -872,7 +538,7 @@
     text-decoration: underline;
   }
 
-  .textlinkhover {
+  .text-link-hover {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 17px;
@@ -880,7 +546,7 @@
     text-decoration: underline;
   }
 
-  .textlinkboldhover {
+  .text-link-bold-hover {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 17px;
@@ -895,7 +561,7 @@
     line-height: 16.9px;
   }
 
-  .footnote1bold {
+  .footnote1-bold {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 13px;
@@ -909,7 +575,7 @@
     line-height: 13px;
   }
 
-  .footnote2bold {
+  .footnote2-bold {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 10px;
@@ -924,7 +590,7 @@
     letter-spacing: 0.25px;
   }
 
-  .label1bold {
+  .label1-bold {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 17px;
@@ -932,7 +598,7 @@
     letter-spacing: 0.25px;
   }
 
-  .label1boldresp {
+  .label1-bold-resp {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 10px;
@@ -940,7 +606,7 @@
     letter-spacing: 0.25px;
   }
 
-  .label1uppercasebold {
+  .label1-uppercase-bold {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 17px;
@@ -957,7 +623,7 @@
     letter-spacing: 0.25px;
   }
 
-  .label2uppercase {
+  .label2-uppercase {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 15px;
@@ -966,7 +632,7 @@
     text-transform: upper;
   }
 
-  .label2bold {
+  .label2-bold {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 15px;
@@ -974,7 +640,7 @@
     letter-spacing: 0.25px;
   }
 
-  .label2uppercasebold {
+  .label2-uppercase-bold {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 15px;
@@ -991,7 +657,7 @@
     letter-spacing: 0.25px;
   }
 
-  .label3uppercase {
+  .label3-uppercase {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 12px;
@@ -1000,7 +666,7 @@
     text-transform: upper;
   }
 
-  .label3bold {
+  .label3-bold {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 12px;
@@ -1008,7 +674,7 @@
     letter-spacing: 0.25px;
   }
 
-  .label3uppercasebold {
+  .label3-uppercase-bold {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 12px;
@@ -1058,30 +724,30 @@
 
     .headline1 {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 36px;
       line-height: 37.8px;
-      font-style: 700;
     }
 
     .headline2 {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 30px;
       line-height: 33px;
-      font-style: 700;
     }
 
     .headline3 {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 24px;
       line-height: 26.4px;
-      font-style: 700;
     }
 
     .headline4 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 16px;
       line-height: 16px;
-      font-style: 600;
     }
 
     .subheadline1 {
@@ -1093,30 +759,30 @@
 
     .kicker1 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 16px;
       line-height: 17.6px;
-      font-style: 700;
     }
 
     .kicker2 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 16px;
       line-height: 17.6px;
-      font-style: 700;
     }
 
     .kicker3 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 14px;
       line-height: 15.4px;
-      font-style: 700;
     }
 
     .kicker4 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 12px;
       line-height: 13.2px;
-      font-style: 700;
     }
 
     .title1 {
@@ -1126,7 +792,7 @@
       line-height: 26.4px;
     }
 
-    .title1uppercase {
+    .title1-uppercase {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 22px;
@@ -1141,7 +807,7 @@
       line-height: 16.8px;
     }
 
-    .title2uppercase {
+    .title2-uppercase {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 14px;
@@ -1163,26 +829,30 @@
       line-height: 29.75px;
     }
 
-    .bodyitalic {
+    .body-italic {
       font-family: Lucida Grande;
+      font-weight: 400;
       font-size: 17px;
       line-height: 29.75px;
+      font-style: italic;
     }
 
-    .bodybold {
+    .body-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
       line-height: 29.75px;
     }
 
-    .bodybolditalic {
+    .body-bold-italic {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 17px;
       line-height: 29.75px;
+      font-style: italic;
     }
 
-    .textlink {
+    .text-link {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 17px;
@@ -1190,14 +860,16 @@
       text-decoration: underline;
     }
 
-    .textlinkitalic {
+    .text-link-italic {
       font-family: Lucida Grande;
+      font-weight: 400;
       font-size: 17px;
       line-height: 29.75px;
+      font-style: italic;
       text-decoration: underline;
     }
 
-    .textlinkbold {
+    .text-link-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1205,7 +877,7 @@
       text-decoration: underline;
     }
 
-    .textlinkhover {
+    .text-link-hover {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 17px;
@@ -1213,7 +885,7 @@
       text-decoration: underline;
     }
 
-    .textlinkboldhover {
+    .text-link-bold-hover {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1228,7 +900,7 @@
       line-height: 16.9px;
     }
 
-    .footnote1bold {
+    .footnote1-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 13px;
@@ -1242,7 +914,7 @@
       line-height: 13px;
     }
 
-    .footnote2bold {
+    .footnote2-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 10px;
@@ -1257,7 +929,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label1bold {
+    .label1-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1265,7 +937,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label1boldresp {
+    .label1-bold-resp {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 10px;
@@ -1273,7 +945,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label1uppercasebold {
+    .label1-uppercase-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1290,7 +962,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label2uppercase {
+    .label2-uppercase {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 15px;
@@ -1299,7 +971,7 @@
       text-transform: upper;
     }
 
-    .label2bold {
+    .label2-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -1307,7 +979,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label2uppercasebold {
+    .label2-uppercase-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -1324,7 +996,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label3uppercase {
+    .label3-uppercase {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 12px;
@@ -1333,7 +1005,7 @@
       text-transform: upper;
     }
 
-    .label3bold {
+    .label3-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 12px;
@@ -1341,7 +1013,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label3uppercasebold {
+    .label3-uppercase-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 12px;
@@ -1393,30 +1065,30 @@
 
     .headline1 {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 54px;
       line-height: 56.7px;
-      font-style: 700;
     }
 
     .headline2 {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 36px;
       line-height: 39.6px;
-      font-style: 700;
     }
 
     .headline3 {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 26px;
       line-height: 28.6px;
-      font-style: 700;
     }
 
     .headline4 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 20px;
       line-height: 20px;
-      font-style: 600;
     }
 
     .subheadline1 {
@@ -1428,30 +1100,30 @@
 
     .kicker1 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 18px;
       line-height: 19.8px;
-      font-style: 700;
     }
 
     .kicker2 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 18px;
       line-height: 19.8px;
-      font-style: 700;
     }
 
     .kicker3 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 14px;
       line-height: 15.4px;
-      font-style: 700;
     }
 
     .kicker4 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 14px;
       line-height: 15.4px;
-      font-style: 700;
     }
 
     .title1 {
@@ -1461,7 +1133,7 @@
       line-height: 26.4px;
     }
 
-    .title1uppercase {
+    .title1-uppercase {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 22px;
@@ -1476,7 +1148,7 @@
       line-height: 19.2px;
     }
 
-    .title2uppercase {
+    .title2-uppercase {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 16px;
@@ -1498,26 +1170,30 @@
       line-height: 29.75px;
     }
 
-    .bodyitalic {
+    .body-italic {
       font-family: Lucida Grande;
+      font-weight: 400;
       font-size: 17px;
       line-height: 29.75px;
+      font-style: italic;
     }
 
-    .bodybold {
+    .body-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
       line-height: 29.75px;
     }
 
-    .bodybolditalic {
+    .body-bold-italic {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 17px;
       line-height: 29.75px;
+      font-style: italic;
     }
 
-    .textlink {
+    .text-link {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 17px;
@@ -1525,14 +1201,16 @@
       text-decoration: underline;
     }
 
-    .textlinkitalic {
+    .text-link-italic {
       font-family: Lucida Grande;
+      font-weight: 400;
       font-size: 17px;
       line-height: 29.75px;
+      font-style: italic;
       text-decoration: underline;
     }
 
-    .textlinkbold {
+    .text-link-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1540,7 +1218,7 @@
       text-decoration: underline;
     }
 
-    .textlinkhover {
+    .text-link-hover {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 17px;
@@ -1548,7 +1226,7 @@
       text-decoration: underline;
     }
 
-    .textlinkboldhover {
+    .text-link-bold-hover {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1563,7 +1241,7 @@
       line-height: 16.9px;
     }
 
-    .footnote1bold {
+    .footnote1-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 13px;
@@ -1577,7 +1255,7 @@
       line-height: 13px;
     }
 
-    .footnote2bold {
+    .footnote2-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 10px;
@@ -1592,7 +1270,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label1bold {
+    .label1-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1600,7 +1278,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label1boldresp {
+    .label1-bold-resp {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -1608,7 +1286,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label1uppercasebold {
+    .label1-uppercase-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1625,7 +1303,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label2uppercase {
+    .label2-uppercase {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 15px;
@@ -1634,7 +1312,7 @@
       text-transform: upper;
     }
 
-    .label2bold {
+    .label2-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -1642,7 +1320,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label2uppercasebold {
+    .label2-uppercase-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -1659,7 +1337,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label3uppercase {
+    .label3-uppercase {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 12px;
@@ -1668,7 +1346,7 @@
       text-transform: upper;
     }
 
-    .label3bold {
+    .label3-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 12px;
@@ -1676,7 +1354,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label3uppercasebold {
+    .label3-uppercase-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 12px;
@@ -1728,30 +1406,30 @@
 
     .headline1 {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 70px;
       line-height: 77px;
-      font-style: 700;
     }
 
     .headline2 {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 48px;
       line-height: 52.8px;
-      font-style: 700;
     }
 
     .headline3 {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 32px;
       line-height: 35.2px;
-      font-style: 700;
     }
 
     .headline4 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 22px;
       line-height: 22px;
-      font-style: 600;
     }
 
     .subheadline1 {
@@ -1763,30 +1441,30 @@
 
     .kicker1 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 25px;
       line-height: 27.5px;
-      font-style: 700;
     }
 
     .kicker2 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 21px;
       line-height: 23.1px;
-      font-style: 700;
     }
 
     .kicker3 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 16px;
       line-height: 17.6px;
-      font-style: 700;
     }
 
     .kicker4 {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 14px;
       line-height: 15.4px;
-      font-style: 700;
     }
 
     .title1 {
@@ -1796,7 +1474,7 @@
       line-height: 33.6px;
     }
 
-    .title1uppercase {
+    .title1-uppercase {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 28px;
@@ -1811,7 +1489,7 @@
       line-height: 23.4px;
     }
 
-    .title2uppercase {
+    .title2-uppercase {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 18px;
@@ -1833,26 +1511,30 @@
       line-height: 29.75px;
     }
 
-    .bodyitalic {
+    .body-italic {
       font-family: Lucida Grande;
+      font-weight: 400;
       font-size: 17px;
       line-height: 29.75px;
+      font-style: italic;
     }
 
-    .bodybold {
+    .body-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
       line-height: 29.75px;
     }
 
-    .bodybolditalic {
+    .body-bold-italic {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 17px;
       line-height: 29.75px;
+      font-style: italic;
     }
 
-    .textlink {
+    .text-link {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 17px;
@@ -1860,14 +1542,16 @@
       text-decoration: underline;
     }
 
-    .textlinkitalic {
+    .text-link-italic {
       font-family: Lucida Grande;
+      font-weight: 400;
       font-size: 17px;
       line-height: 29.75px;
+      font-style: italic;
       text-decoration: underline;
     }
 
-    .textlinkbold {
+    .text-link-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1875,7 +1559,7 @@
       text-decoration: underline;
     }
 
-    .textlinkhover {
+    .text-link-hover {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 17px;
@@ -1883,7 +1567,7 @@
       text-decoration: underline;
     }
 
-    .textlinkboldhover {
+    .text-link-bold-hover {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1898,7 +1582,7 @@
       line-height: 19.5px;
     }
 
-    .footnote1bold {
+    .footnote1-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -1912,7 +1596,7 @@
       line-height: 16.9px;
     }
 
-    .footnote2bold {
+    .footnote2-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 13px;
@@ -1927,7 +1611,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label1bold {
+    .label1-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1935,7 +1619,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label1boldresp {
+    .label1-bold-resp {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1943,7 +1627,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label1uppercasebold {
+    .label1-uppercase-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -1960,7 +1644,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label2uppercase {
+    .label2-uppercase {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 15px;
@@ -1969,7 +1653,7 @@
       text-transform: upper;
     }
 
-    .label2bold {
+    .label2-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -1977,7 +1661,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label2uppercasebold {
+    .label2-uppercase-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -1994,7 +1678,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label3uppercase {
+    .label3-uppercase {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 12px;
@@ -2003,7 +1687,7 @@
       text-transform: upper;
     }
 
-    .label3bold {
+    .label3-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 12px;
@@ -2011,7 +1695,7 @@
       letter-spacing: 0.25px;
     }
 
-    .label3uppercasebold {
+    .label3-uppercase-bold {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 12px;
@@ -2836,7 +2520,7 @@
 
 
 [data-brand="advertorial"] {
-  .apptoogleitemlabel {
+  .app-toogle-item-label {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 14px;
@@ -2845,7 +2529,7 @@
   }
 
   @media (min-width: 390px) {
-    .apptoogleitemlabel {
+    .app-toogle-item-label {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 14px;
@@ -2856,7 +2540,7 @@
   }
 
   @media (min-width: 600px) {
-    .apptoogleitemlabel {
+    .app-toogle-item-label {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 16px;
@@ -2867,7 +2551,7 @@
   }
 
   @media (min-width: 1024px) {
-    .apptoogleitemlabel {
+    .app-toogle-item-label {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 18px;
@@ -2881,179 +2565,179 @@
 
 
 [data-brand="advertorial"] {
-  .ateaser-ateaserkicker {
+  .a-teaser-a-teaser-kicker {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 14px;
     line-height: 14px;
-    font-style: 700;
   }
 
-  .ateaser-ateaserheadline {
+  .a-teaser-a-teaser-headline {
     font-family: Lucida Grande;
+    font-weight: 900;
     font-size: 24px;
     line-height: 24px;
-    font-style: 700;
   }
 
-  .mqteaser-mqteaserkicker {
+  .m-qteaser-m-qteaser-kicker {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 12px;
     line-height: 13.2px;
-    font-style: 700;
   }
 
-  .mqteaser-mqteaserheadline {
+  .m-qteaser-m-qteaser-headline {
     font-family: Lucida Grande;
+    font-weight: 900;
     font-size: 16px;
     line-height: 18.4px;
-    font-style: 700;
   }
 
-  .qteaser-qteaserheadline {
+  .q-teaser-q-teaser-headline {
     font-family: Lucida Grande;
+    font-weight: 900;
     font-size: 36px;
     line-height: 37.8px;
-    font-style: 700;
   }
 
-  .stdteaser-stdteaserheadline {
+  .std-teaser-std-teaser-headline {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 16px;
     line-height: 18.4px;
-    font-style: 600;
   }
 
   @media (min-width: 390px) {
-    .ateaser-ateaserkicker {
+    .a-teaser-a-teaser-kicker {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 14px;
       line-height: 14px;
-      font-style: 700;
     }
 
-    .ateaser-ateaserheadline {
+    .a-teaser-a-teaser-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 24px;
       line-height: 24px;
-      font-style: 700;
     }
 
-    .mqteaser-mqteaserkicker {
+    .m-qteaser-m-qteaser-kicker {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 12px;
       line-height: 13.2px;
-      font-style: 700;
     }
 
-    .mqteaser-mqteaserheadline {
+    .m-qteaser-m-qteaser-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 16px;
       line-height: 18.4px;
-      font-style: 700;
     }
 
-    .qteaser-qteaserheadline {
+    .q-teaser-q-teaser-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 36px;
       line-height: 37.8px;
-      font-style: 700;
     }
 
-    .stdteaser-stdteaserheadline {
+    .std-teaser-std-teaser-headline {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 16px;
       line-height: 18.4px;
-      font-style: 600;
     }
 
   }
 
   @media (min-width: 600px) {
-    .ateaser-ateaserkicker {
+    .a-teaser-a-teaser-kicker {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 18px;
       line-height: 18px;
-      font-style: 700;
     }
 
-    .ateaser-ateaserheadline {
+    .a-teaser-a-teaser-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 36px;
       line-height: 39.6px;
-      font-style: 700;
     }
 
-    .mqteaser-mqteaserkicker {
+    .m-qteaser-m-qteaser-kicker {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 14px;
       line-height: 15.4px;
-      font-style: 700;
     }
 
-    .mqteaser-mqteaserheadline {
+    .m-qteaser-m-qteaser-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 26px;
       line-height: 28.6px;
-      font-style: 700;
     }
 
-    .qteaser-qteaserheadline {
+    .q-teaser-q-teaser-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 54px;
       line-height: 56.7px;
-      font-style: 700;
     }
 
-    .stdteaser-stdteaserheadline {
+    .std-teaser-std-teaser-headline {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 20px;
       line-height: 19.8px;
-      font-style: 600;
     }
 
   }
 
   @media (min-width: 1024px) {
-    .ateaser-ateaserkicker {
+    .a-teaser-a-teaser-kicker {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 21px;
       line-height: 21px;
-      font-style: 700;
     }
 
-    .ateaser-ateaserheadline {
+    .a-teaser-a-teaser-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 48px;
       line-height: 52.8px;
-      font-style: 700;
     }
 
-    .mqteaser-mqteaserkicker {
+    .m-qteaser-m-qteaser-kicker {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 14px;
       line-height: 15.4px;
-      font-style: 700;
     }
 
-    .mqteaser-mqteaserheadline {
+    .m-qteaser-m-qteaser-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 32px;
       line-height: 35.2px;
-      font-style: 700;
     }
 
-    .qteaser-qteaserheadline {
+    .q-teaser-q-teaser-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 70px;
       line-height: 77px;
-      font-style: 700;
     }
 
-    .stdteaser-stdteaserheadline {
+    .std-teaser-std-teaser-headline {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 22px;
       line-height: 27.5px;
-      font-style: 600;
     }
 
   }
@@ -3062,21 +2746,21 @@
 
 
 [data-brand="advertorial"] {
-  .tablabel {
+  .tab-label {
     font-family: Gotham XNarrow;
     font-weight: 700;
     font-size: 16px;
     text-transform: upper;
   }
 
-  .appbottombarlabeldefault {
+  .app-bottom-bar-label-default {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 11px;
     line-height: 14.4px;
   }
 
-  .appbottombarlabelactive {
+  .app-bottom-bar-label-active {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 11px;
@@ -3084,21 +2768,21 @@
   }
 
   @media (min-width: 390px) {
-    .tablabel {
+    .tab-label {
       font-family: Gotham XNarrow;
       font-weight: 700;
       font-size: 16px;
       text-transform: upper;
     }
 
-    .appbottombarlabeldefault {
+    .app-bottom-bar-label-default {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 12px;
       line-height: 14.4px;
     }
 
-    .appbottombarlabelactive {
+    .app-bottom-bar-label-active {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 12px;
@@ -3108,21 +2792,21 @@
   }
 
   @media (min-width: 600px) {
-    .tablabel {
+    .tab-label {
       font-family: Gotham XNarrow;
       font-weight: 700;
       font-size: 16px;
       text-transform: upper;
     }
 
-    .appbottombarlabeldefault {
+    .app-bottom-bar-label-default {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 16px;
       line-height: 23.4px;
     }
 
-    .appbottombarlabelactive {
+    .app-bottom-bar-label-active {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 16px;
@@ -3132,21 +2816,21 @@
   }
 
   @media (min-width: 1024px) {
-    .tablabel {
+    .tab-label {
       font-family: Gotham XNarrow;
       font-weight: 700;
       font-size: 16px;
       text-transform: upper;
     }
 
-    .appbottombarlabeldefault {
+    .app-bottom-bar-label-default {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 16px;
       line-height: 23.4px;
     }
 
-    .appbottombarlabelactive {
+    .app-bottom-bar-label-active {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 16px;
@@ -3159,39 +2843,39 @@
 
 
 [data-brand="advertorial"] {
-  .specialnaviitemlabel {
+  .special-navi-item-label {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 15px;
     line-height: 15px;
-    font-style: 700;
   }
 
   @media (min-width: 390px) {
-    .specialnaviitemlabel {
+    .special-navi-item-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 15px;
       line-height: 15px;
-      font-style: 700;
     }
 
   }
 
   @media (min-width: 600px) {
-    .specialnaviitemlabel {
+    .special-navi-item-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 15px;
       line-height: 15px;
-      font-style: 700;
     }
 
   }
 
   @media (min-width: 1024px) {
-    .specialnaviitemlabel {
+    .special-navi-item-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 15px;
       line-height: 15px;
-      font-style: 700;
     }
 
   }
@@ -3200,7 +2884,7 @@
 
 
 [data-brand="advertorial"] {
-  .paywallcardpricetag {
+  .paywall-card-price-tag {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 64px;
@@ -3208,7 +2892,7 @@
     letter-spacing: -0.5px;
   }
 
-  .paywallcardnote {
+  .paywall-card-note {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 40px;
@@ -3217,7 +2901,7 @@
   }
 
   @media (min-width: 390px) {
-    .paywallcardpricetag {
+    .paywall-card-price-tag {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 64px;
@@ -3225,7 +2909,7 @@
       letter-spacing: -0.5px;
     }
 
-    .paywallcardnote {
+    .paywall-card-note {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 40px;
@@ -3236,7 +2920,7 @@
   }
 
   @media (min-width: 600px) {
-    .paywallcardpricetag {
+    .paywall-card-price-tag {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 64px;
@@ -3244,7 +2928,7 @@
       letter-spacing: -1px;
     }
 
-    .paywallcardnote {
+    .paywall-card-note {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 40px;
@@ -3255,7 +2939,7 @@
   }
 
   @media (min-width: 1024px) {
-    .paywallcardpricetag {
+    .paywall-card-price-tag {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 64px;
@@ -3263,7 +2947,7 @@
       letter-spacing: -1px;
     }
 
-    .paywallcardnote {
+    .paywall-card-note {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 40px;
@@ -3277,7 +2961,7 @@
 
 
 [data-brand="advertorial"] {
-  .numberedpaginationactive {
+  .numbered-pagination-active {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 17px;
@@ -3287,7 +2971,7 @@
   }
 
   @media (min-width: 390px) {
-    .numberedpaginationactive {
+    .numbered-pagination-active {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -3299,7 +2983,7 @@
   }
 
   @media (min-width: 600px) {
-    .numberedpaginationactive {
+    .numbered-pagination-active {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -3311,7 +2995,7 @@
   }
 
   @media (min-width: 1024px) {
-    .numberedpaginationactive {
+    .numbered-pagination-active {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -3326,95 +3010,95 @@
 
 
 [data-brand="advertorial"] {
-  .newstickertimestamp {
+  .news-ticker-time-stamp {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 16px;
     line-height: 20.8px;
   }
 
-  .newstickerkicker {
+  .news-ticker-kicker {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 14px;
     line-height: 15.4px;
   }
 
-  .newstickerheadline {
+  .news-ticker-headline {
     font-family: Lucida Grande;
+    font-weight: 900;
     font-size: 24px;
     line-height: 26.4px;
-    font-style: 700;
   }
 
   @media (min-width: 390px) {
-    .newstickertimestamp {
+    .news-ticker-time-stamp {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 16px;
       line-height: 20.8px;
     }
 
-    .newstickerkicker {
+    .news-ticker-kicker {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 14px;
       line-height: 15.4px;
     }
 
-    .newstickerheadline {
+    .news-ticker-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 24px;
       line-height: 26.4px;
-      font-style: 700;
     }
 
   }
 
   @media (min-width: 600px) {
-    .newstickertimestamp {
+    .news-ticker-time-stamp {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 16px;
       line-height: 20.8px;
     }
 
-    .newstickerkicker {
+    .news-ticker-kicker {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 14px;
       line-height: 15.4px;
     }
 
-    .newstickerheadline {
+    .news-ticker-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 26px;
       line-height: 28.6px;
-      font-style: 700;
     }
 
   }
 
   @media (min-width: 1024px) {
-    .newstickertimestamp {
+    .news-ticker-time-stamp {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 18px;
       line-height: 23.4px;
     }
 
-    .newstickerkicker {
+    .news-ticker-kicker {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 16px;
       line-height: 17.6px;
     }
 
-    .newstickerheadline {
+    .news-ticker-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 32px;
       line-height: 35.2px;
-      font-style: 700;
     }
 
   }
@@ -3423,14 +3107,14 @@
 
 
 [data-brand="advertorial"] {
-  .apptopbarstagetitle {
+  .app-topbar-stage-title {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 12px;
     line-height: 14px;
   }
 
-  .apptopbartabstitle {
+  .app-topbar-tabs-title {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 12px;
@@ -3438,31 +3122,31 @@
     text-transform: upper;
   }
 
-  .menuitemlabel {
+  .menu-item-label {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 15px;
     line-height: 15px;
-    font-style: 700;
     text-transform: upper;
   }
 
-  .menuitemutillabel {
+  .menu-item-util-label {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 12px;
     line-height: 12px;
-    font-style: 700;
     text-transform: upper;
   }
 
   @media (min-width: 390px) {
-    .apptopbarstagetitle {
+    .app-topbar-stage-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 12px;
       line-height: 14px;
     }
 
-    .apptopbartabstitle {
+    .app-topbar-tabs-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 12px;
@@ -3470,33 +3154,33 @@
       text-transform: upper;
     }
 
-    .menuitemlabel {
+    .menu-item-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 15px;
       line-height: 15px;
-      font-style: 700;
       text-transform: upper;
     }
 
-    .menuitemutillabel {
+    .menu-item-util-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 12px;
       line-height: 12px;
-      font-style: 700;
       text-transform: upper;
     }
 
   }
 
   @media (min-width: 600px) {
-    .apptopbarstagetitle {
+    .app-topbar-stage-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 14px;
       line-height: 17px;
     }
 
-    .apptopbartabstitle {
+    .app-topbar-tabs-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 14px;
@@ -3504,33 +3188,33 @@
       text-transform: upper;
     }
 
-    .menuitemlabel {
+    .menu-item-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 15px;
       line-height: 15px;
-      font-style: 700;
       text-transform: upper;
     }
 
-    .menuitemutillabel {
+    .menu-item-util-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 12px;
       line-height: 12px;
-      font-style: 700;
       text-transform: upper;
     }
 
   }
 
   @media (min-width: 1024px) {
-    .apptopbarstagetitle {
+    .app-topbar-stage-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 14px;
       line-height: 17px;
     }
 
-    .apptopbartabstitle {
+    .app-topbar-tabs-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 14px;
@@ -3538,19 +3222,19 @@
       text-transform: upper;
     }
 
-    .menuitemlabel {
+    .menu-item-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 15px;
       line-height: 15px;
-      font-style: 700;
       text-transform: upper;
     }
 
-    .menuitemutillabel {
+    .menu-item-util-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 12px;
       line-height: 12px;
-      font-style: 700;
       text-transform: upper;
     }
 
@@ -3560,21 +3244,21 @@
 
 
 [data-brand="advertorial"] {
-  .podcastplayerlabel {
+  .podcast-player-label {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 16px;
     line-height: 16px;
   }
 
-  .videoadtime {
+  .video-ad-time {
     font-family: Gotham;
     font-weight: 800;
     font-size: 14px;
     text-transform: upper;
   }
 
-  .videoplayertime {
+  .video-player-time {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 14px;
@@ -3582,21 +3266,21 @@
   }
 
   @media (min-width: 390px) {
-    .podcastplayerlabel {
+    .podcast-player-label {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 16px;
       line-height: 16px;
     }
 
-    .videoadtime {
+    .video-ad-time {
       font-family: Gotham;
       font-weight: 800;
       font-size: 14px;
       text-transform: upper;
     }
 
-    .videoplayertime {
+    .video-player-time {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 14px;
@@ -3606,21 +3290,21 @@
   }
 
   @media (min-width: 600px) {
-    .podcastplayerlabel {
+    .podcast-player-label {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 16px;
       line-height: 16px;
     }
 
-    .videoadtime {
+    .video-ad-time {
       font-family: Gotham;
       font-weight: 800;
       font-size: 16px;
       text-transform: upper;
     }
 
-    .videoplayertime {
+    .video-player-time {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 16px;
@@ -3630,21 +3314,21 @@
   }
 
   @media (min-width: 1024px) {
-    .podcastplayerlabel {
+    .podcast-player-label {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 18px;
       line-height: 18px;
     }
 
-    .videoadtime {
+    .video-ad-time {
       font-family: Gotham;
       font-weight: 800;
       font-size: 16px;
       text-transform: upper;
     }
 
-    .videoplayertime {
+    .video-player-time {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 18px;
@@ -3657,14 +3341,14 @@
 
 
 [data-brand="advertorial"] {
-  .livetickerheadline {
+  .live-ticker-headline {
     font-family: Lucida Grande;
     font-weight: 600;
     font-size: 22px;
     line-height: 22px;
   }
 
-  .livetickertimestamp {
+  .live-ticker-time-stamp {
     font-family: Gotham XNarrow;
     font-weight: 700;
     font-size: 14px;
@@ -3672,14 +3356,14 @@
   }
 
   @media (min-width: 390px) {
-    .livetickerheadline {
+    .live-ticker-headline {
       font-family: Lucida Grande;
       font-weight: 600;
       font-size: 22px;
       line-height: 22px;
     }
 
-    .livetickertimestamp {
+    .live-ticker-time-stamp {
       font-family: Gotham XNarrow;
       font-weight: 700;
       font-size: 14px;
@@ -3689,14 +3373,14 @@
   }
 
   @media (min-width: 600px) {
-    .livetickerheadline {
+    .live-ticker-headline {
       font-family: Lucida Grande;
       font-weight: 600;
       font-size: 32px;
       line-height: 32px;
     }
 
-    .livetickertimestamp {
+    .live-ticker-time-stamp {
       font-family: Gotham XNarrow;
       font-weight: 700;
       font-size: 16px;
@@ -3706,14 +3390,14 @@
   }
 
   @media (min-width: 1024px) {
-    .livetickerheadline {
+    .live-ticker-headline {
       font-family: Lucida Grande;
       font-weight: 600;
       font-size: 32px;
       line-height: 32px;
     }
 
-    .livetickertimestamp {
+    .live-ticker-time-stamp {
       font-family: Gotham XNarrow;
       font-weight: 700;
       font-size: 16px;
@@ -3726,7 +3410,7 @@
 
 
 [data-brand="advertorial"] {
-  .textinputfieldlabel {
+  .text-input-field-label {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 16px;
@@ -3734,7 +3418,7 @@
   }
 
   @media (min-width: 390px) {
-    .textinputfieldlabel {
+    .text-input-field-label {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 16px;
@@ -3744,7 +3428,7 @@
   }
 
   @media (min-width: 600px) {
-    .textinputfieldlabel {
+    .text-input-field-label {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 16px;
@@ -3754,7 +3438,7 @@
   }
 
   @media (min-width: 1024px) {
-    .textinputfieldlabel {
+    .text-input-field-label {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 16px;
@@ -3767,26 +3451,26 @@
 
 
 [data-brand="advertorial"] {
-  .footercardlink {
+  .footer-card-link {
     font-family: Gotham XNarrow;
     font-weight: 400;
     font-size: 15px;
     text-decoration: underline;
   }
 
-  .footerlinkseparator {
+  .footer-link-separator {
     font-family: Gotham XNarrow;
     font-weight: 400;
   }
 
-  .footerlinks {
+  .footer-links {
     font-family: Gotham XNarrow;
     font-weight: 700;
     font-size: 11px;
     line-height: 14px;
   }
 
-  .footerlinkuserofferpages {
+  .footer-link-user-offer-pages {
     font-family: Gotham XNarrow;
     font-weight: 400;
     font-size: 18px;
@@ -3794,26 +3478,26 @@
   }
 
   @media (min-width: 390px) {
-    .footercardlink {
+    .footer-card-link {
       font-family: Gotham XNarrow;
       font-weight: 400;
       font-size: 15px;
       text-decoration: underline;
     }
 
-    .footerlinkseparator {
+    .footer-link-separator {
       font-family: Gotham XNarrow;
       font-weight: 400;
     }
 
-    .footerlinks {
+    .footer-links {
       font-family: Gotham XNarrow;
       font-weight: 700;
       font-size: 11px;
       line-height: 14px;
     }
 
-    .footerlinkuserofferpages {
+    .footer-link-user-offer-pages {
       font-family: Gotham XNarrow;
       font-weight: 400;
       font-size: 18px;
@@ -3823,26 +3507,26 @@
   }
 
   @media (min-width: 600px) {
-    .footercardlink {
+    .footer-card-link {
       font-family: Gotham XNarrow;
       font-weight: 400;
       font-size: 15px;
       text-decoration: underline;
     }
 
-    .footerlinkseparator {
+    .footer-link-separator {
       font-family: Gotham XNarrow;
       font-weight: 400;
     }
 
-    .footerlinks {
+    .footer-links {
       font-family: Gotham XNarrow;
       font-weight: 700;
       font-size: 11px;
       line-height: 14px;
     }
 
-    .footerlinkuserofferpages {
+    .footer-link-user-offer-pages {
       font-family: Gotham XNarrow;
       font-weight: 400;
       font-size: 18px;
@@ -3852,26 +3536,26 @@
   }
 
   @media (min-width: 1024px) {
-    .footercardlink {
+    .footer-card-link {
       font-family: Gotham XNarrow;
       font-weight: 400;
       font-size: 15px;
       text-decoration: underline;
     }
 
-    .footerlinkseparator {
+    .footer-link-separator {
       font-family: Gotham XNarrow;
       font-weight: 400;
     }
 
-    .footerlinks {
+    .footer-links {
       font-family: Gotham XNarrow;
       font-weight: 700;
       font-size: 11px;
       line-height: 14px;
     }
 
-    .footerlinkuserofferpages {
+    .footer-link-user-offer-pages {
       font-family: Gotham XNarrow;
       font-weight: 400;
       font-size: 18px;
@@ -3884,14 +3568,14 @@
 
 
 [data-brand="advertorial"] {
-  .chiplabel {
+  .chip-label {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 16px;
   }
 
   @media (min-width: 390px) {
-    .chiplabel {
+    .chip-label {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 16px;
@@ -3900,7 +3584,7 @@
   }
 
   @media (min-width: 600px) {
-    .chiplabel {
+    .chip-label {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 16px;
@@ -3909,7 +3593,7 @@
   }
 
   @media (min-width: 1024px) {
-    .chiplabel {
+    .chip-label {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 18px;
@@ -3921,16 +3605,16 @@
 
 
 [data-brand="advertorial"] {
-  .buttonlabel {
+  .button-label {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 15px;
     line-height: 15px;
     letter-spacing: 0.5px;
-    font-style: 600;
     text-transform: upper;
   }
 
-  .partnerlinkbuttonlabel {
+  .partner-link-button-label {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 16px;
@@ -3938,16 +3622,16 @@
   }
 
   @media (min-width: 390px) {
-    .buttonlabel {
+    .button-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 15px;
       line-height: 15px;
       letter-spacing: 0.5px;
-      font-style: 600;
       text-transform: upper;
     }
 
-    .partnerlinkbuttonlabel {
+    .partner-link-button-label {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 16px;
@@ -3957,16 +3641,16 @@
   }
 
   @media (min-width: 600px) {
-    .buttonlabel {
+    .button-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 15px;
       line-height: 15px;
       letter-spacing: 0.5px;
-      font-style: 600;
       text-transform: upper;
     }
 
-    .partnerlinkbuttonlabel {
+    .partner-link-button-label {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 16px;
@@ -3976,16 +3660,16 @@
   }
 
   @media (min-width: 1024px) {
-    .buttonlabel {
+    .button-label {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 15px;
       line-height: 15px;
       letter-spacing: 0.5px;
-      font-style: 600;
       text-transform: upper;
     }
 
-    .partnerlinkbuttonlabel {
+    .partner-link-button-label {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 18px;
@@ -3998,7 +3682,7 @@
 
 
 [data-brand="advertorial"] {
-  .breakingnewstext {
+  .breaking-news-text {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 21px;
@@ -4006,14 +3690,14 @@
     text-transform: upper;
   }
 
-  .breakingnewsuppertitle {
+  .breaking-news-upper-title {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 13px;
     line-height: 13px;
   }
 
-  .breakingnewslowertitle {
+  .breaking-news-lower-title {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 23px;
@@ -4021,7 +3705,7 @@
   }
 
   @media (min-width: 390px) {
-    .breakingnewstext {
+    .breaking-news-text {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 21px;
@@ -4029,14 +3713,14 @@
       text-transform: upper;
     }
 
-    .breakingnewsuppertitle {
+    .breaking-news-upper-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 13px;
       line-height: 13px;
     }
 
-    .breakingnewslowertitle {
+    .breaking-news-lower-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 23px;
@@ -4046,7 +3730,7 @@
   }
 
   @media (min-width: 600px) {
-    .breakingnewstext {
+    .breaking-news-text {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 21px;
@@ -4054,14 +3738,14 @@
       text-transform: upper;
     }
 
-    .breakingnewsuppertitle {
+    .breaking-news-upper-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 17px;
       line-height: 12px;
     }
 
-    .breakingnewslowertitle {
+    .breaking-news-lower-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 30px;
@@ -4071,7 +3755,7 @@
   }
 
   @media (min-width: 1024px) {
-    .breakingnewstext {
+    .breaking-news-text {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 21px;
@@ -4079,14 +3763,14 @@
       text-transform: upper;
     }
 
-    .breakingnewsuppertitle {
+    .breaking-news-upper-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 17px;
       line-height: 12px;
     }
 
-    .breakingnewslowertitle {
+    .breaking-news-lower-title {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 30px;
@@ -4106,7 +3790,7 @@
     line-height: 15px;
   }
 
-  .breadcrumblink {
+  .breadcrumb-link {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 15px;
@@ -4114,7 +3798,7 @@
     text-decoration: underline;
   }
 
-  .breadcrumblinkhover {
+  .breadcrumb-link-hover {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 15px;
@@ -4130,7 +3814,7 @@
       line-height: 15px;
     }
 
-    .breadcrumblink {
+    .breadcrumb-link {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -4138,7 +3822,7 @@
       text-decoration: underline;
     }
 
-    .breadcrumblinkhover {
+    .breadcrumb-link-hover {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -4156,7 +3840,7 @@
       line-height: 15px;
     }
 
-    .breadcrumblink {
+    .breadcrumb-link {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -4164,7 +3848,7 @@
       text-decoration: underline;
     }
 
-    .breadcrumblinkhover {
+    .breadcrumb-link-hover {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -4182,7 +3866,7 @@
       line-height: 12px;
     }
 
-    .breadcrumblink {
+    .breadcrumb-link {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 12px;
@@ -4190,7 +3874,7 @@
       text-decoration: underline;
     }
 
-    .breadcrumblinkhover {
+    .breadcrumb-link-hover {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 12px;
@@ -4204,14 +3888,14 @@
 
 
 [data-brand="advertorial"] {
-  .videoadbadge {
+  .video-ad-badge {
     font-family: Gotham XNarrow;
     font-weight: 400;
     font-size: 14px;
     text-transform: upper;
   }
 
-  .videotimebadge {
+  .video-time-badge {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 16px;
@@ -4219,14 +3903,14 @@
   }
 
   @media (min-width: 390px) {
-    .videoadbadge {
+    .video-ad-badge {
       font-family: Gotham XNarrow;
       font-weight: 400;
       font-size: 14px;
       text-transform: upper;
     }
 
-    .videotimebadge {
+    .video-time-badge {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 16px;
@@ -4236,14 +3920,14 @@
   }
 
   @media (min-width: 600px) {
-    .videoadbadge {
+    .video-ad-badge {
       font-family: Gotham XNarrow;
       font-weight: 400;
       font-size: 16px;
       text-transform: upper;
     }
 
-    .videotimebadge {
+    .video-time-badge {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 18px;
@@ -4253,14 +3937,14 @@
   }
 
   @media (min-width: 1024px) {
-    .videoadbadge {
+    .video-ad-badge {
       font-family: Gotham XNarrow;
       font-weight: 400;
       font-size: 16px;
       text-transform: upper;
     }
 
-    .videotimebadge {
+    .video-time-badge {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 18px;
@@ -4273,21 +3957,21 @@
 
 
 [data-brand="advertorial"] {
-  .appavatar {
+  .app-avatar {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 12px;
     text-transform: upper;
   }
 
-  .avatardefault {
+  .avatar-default {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 13px;
     line-height: 21px;
   }
 
-  .avatarhover {
+  .avatar-hover {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 13px;
@@ -4295,14 +3979,14 @@
     text-decoration: underline;
   }
 
-  .avatarsecondaryinfo {
+  .avatar-secondary-info {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 13px;
     line-height: 21px;
   }
 
-  .avatarsecondaryinfohover {
+  .avatar-secondary-info-hover {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 13px;
@@ -4311,21 +3995,21 @@
   }
 
   @media (min-width: 390px) {
-    .appavatar {
+    .app-avatar {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 12px;
       text-transform: upper;
     }
 
-    .avatardefault {
+    .avatar-default {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 13px;
       line-height: 21px;
     }
 
-    .avatarhover {
+    .avatar-hover {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 13px;
@@ -4333,14 +4017,14 @@
       text-decoration: underline;
     }
 
-    .avatarsecondaryinfo {
+    .avatar-secondary-info {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 13px;
       line-height: 21px;
     }
 
-    .avatarsecondaryinfohover {
+    .avatar-secondary-info-hover {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 13px;
@@ -4351,21 +4035,21 @@
   }
 
   @media (min-width: 600px) {
-    .appavatar {
+    .app-avatar {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 14px;
       text-transform: upper;
     }
 
-    .avatardefault {
+    .avatar-default {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 13px;
       line-height: 21px;
     }
 
-    .avatarhover {
+    .avatar-hover {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 13px;
@@ -4373,14 +4057,14 @@
       text-decoration: underline;
     }
 
-    .avatarsecondaryinfo {
+    .avatar-secondary-info {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 13px;
       line-height: 21px;
     }
 
-    .avatarsecondaryinfohover {
+    .avatar-secondary-info-hover {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 13px;
@@ -4391,21 +4075,21 @@
   }
 
   @media (min-width: 1024px) {
-    .appavatar {
+    .app-avatar {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 16px;
       text-transform: upper;
     }
 
-    .avatardefault {
+    .avatar-default {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
       line-height: 23px;
     }
 
-    .avatarhover {
+    .avatar-hover {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 15px;
@@ -4413,14 +4097,14 @@
       text-decoration: underline;
     }
 
-    .avatarsecondaryinfo {
+    .avatar-secondary-info {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 15px;
       line-height: 23px;
     }
 
-    .avatarsecondaryinfohover {
+    .avatar-secondary-info-hover {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 15px;
@@ -4434,7 +4118,7 @@
 
 
 [data-brand="advertorial"] {
-  .audioplayerlabel {
+  .audio-player-label {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 16px;
@@ -4442,7 +4126,7 @@
   }
 
   @media (min-width: 390px) {
-    .audioplayerlabel {
+    .audio-player-label {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 16px;
@@ -4452,7 +4136,7 @@
   }
 
   @media (min-width: 600px) {
-    .audioplayerlabel {
+    .audio-player-label {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 16px;
@@ -4462,7 +4146,7 @@
   }
 
   @media (min-width: 1024px) {
-    .audioplayerlabel {
+    .audio-player-label {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 18px;
@@ -4475,70 +4159,70 @@
 
 
 [data-brand="advertorial"] {
-  .articlekicker {
+  .article-kicker {
     font-family: Lucida Grande;
+    font-weight: 700;
     font-size: 16px;
     line-height: 17.6px;
-    font-style: 700;
   }
 
-  .articleimagecaption {
+  .article-image-caption {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 13px;
     line-height: 19.5px;
   }
 
-  .articleheadline {
+  .article-headline {
     font-family: Lucida Grande;
+    font-weight: 900;
     font-size: 30px;
     line-height: 30px;
-    font-style: 700;
   }
 
-  .articlemetasource {
+  .article-meta-source {
     font-family: Lucida Grande;
     font-weight: 400;
     font-size: 13px;
     line-height: 19px;
   }
 
-  .articletimestamp {
+  .article-time-stamp {
     font-family: Lucida Grande;
     font-weight: 800;
     font-size: 12px;
   }
 
   @media (min-width: 390px) {
-    .articlekicker {
+    .article-kicker {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 16px;
       line-height: 17.6px;
-      font-style: 700;
     }
 
-    .articleimagecaption {
+    .article-image-caption {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 13px;
       line-height: 19.5px;
     }
 
-    .articleheadline {
+    .article-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 30px;
       line-height: 30px;
-      font-style: 700;
     }
 
-    .articlemetasource {
+    .article-meta-source {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 13px;
       line-height: 19px;
     }
 
-    .articletimestamp {
+    .article-time-stamp {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 12px;
@@ -4547,35 +4231,35 @@
   }
 
   @media (min-width: 600px) {
-    .articlekicker {
+    .article-kicker {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 18px;
       line-height: 19.8px;
-      font-style: 700;
     }
 
-    .articleimagecaption {
+    .article-image-caption {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 13px;
       line-height: 19.5px;
     }
 
-    .articleheadline {
+    .article-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 54px;
       line-height: 54px;
-      font-style: 700;
     }
 
-    .articlemetasource {
+    .article-meta-source {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 13px;
       line-height: 19px;
     }
 
-    .articletimestamp {
+    .article-time-stamp {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 14px;
@@ -4584,35 +4268,35 @@
   }
 
   @media (min-width: 1024px) {
-    .articlekicker {
+    .article-kicker {
       font-family: Lucida Grande;
+      font-weight: 700;
       font-size: 25px;
       line-height: 27.5px;
-      font-style: 700;
     }
 
-    .articleimagecaption {
+    .article-image-caption {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 16px;
       line-height: 24px;
     }
 
-    .articleheadline {
+    .article-headline {
       font-family: Lucida Grande;
+      font-weight: 900;
       font-size: 70px;
       line-height: 70px;
-      font-style: 700;
     }
 
-    .articlemetasource {
+    .article-meta-source {
       font-family: Lucida Grande;
       font-weight: 400;
       font-size: 16px;
       line-height: 24px;
     }
 
-    .articletimestamp {
+    .article-time-stamp {
       font-family: Lucida Grande;
       font-weight: 800;
       font-size: 16px;
@@ -4624,14 +4308,14 @@
 
 
 [data-brand="advertorial"] {
-  .accordionlabel {
+  .accordion-label {
     font-family: Lucida Grande;
     font-weight: 700;
     font-size: 17px;
   }
 
   @media (min-width: 390px) {
-    .accordionlabel {
+    .accordion-label {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -4640,7 +4324,7 @@
   }
 
   @media (min-width: 600px) {
-    .accordionlabel {
+    .accordion-label {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;
@@ -4649,7 +4333,7 @@
   }
 
   @media (min-width: 1024px) {
-    .accordionlabel {
+    .accordion-label {
       font-family: Lucida Grande;
       font-weight: 700;
       font-size: 17px;