@charset "UTF-8";
/*=========================
:=          Main           =
=========================*/
/*=========================
=          Core           =
=========================*/
/*=================================
=            Helpers              =
=================================*/
/*=================================
=        SASS map helpers         =
=================================*/
/*======================================
=                Math                  =
======================================*/
/**
 * Remove units from the given number
 * @param  {number} $number The number with units
 * @return {number}
 */
/**
 * Division helper
 * @param  {number} $den    Denominator
 * @param  {number} $num    Numerator
 * @return {number}
 */
/**
 * Calculate vh percentage from number
 * @param  {number} $number The percentage number
 * @return {number} in vh
 */
/*=================================
=           Shortcuts             =
=================================*/
/**
 * Shortcut to avoid having to type a css variable and its default with the same name everytime
 *
 * @param  {string} $var     The name of the css variable
 * @param  {string} $default The default value to use if the variable is not set
 * @return {string}          A css variable with a default var() of the same name
 *
 * @example 
 *     font-size: dvar(--heading-font-size); ↴
 *     font-size: var(--heading-font-size, var(--heading-font-size-default));
 *
 * @example 
 *     font-size: dvar(--button-color, red); ↴
 *     font-size: var(--button-color, var(--button-color-default, red));
 */
/**
 * Shortcut for multiplications based on a factor and a variable.
 * 
 * @param  {string} $factor Multiplier to adjust the value (default: 1)
 * @param  {string} $var    Customizable variable representing the base value (default: var(--spacer))
 * @return {string}         The multiplied value using the formula: calc($var * $factor)
 * 
 * @example
 *      margin: multiply(2); // Calculates 2 times the default value
 *      padding: multiply(0.5, var(--custom)); // Calculates half of a custom variable
 */
/**
 * A function helper to avoid having to type `map-get($directories, ...)` to output a given font-size
 * @param  {string} $dir The name of the directory
 * @return {string}      The corresponding directory path
 */
/*=====================================
=            Accessibility            =
=====================================*/
/**
 * A class to hide labels and stuff
 * for accessibility
 * @author Facebook Accessibility Team
 * @source https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */
/*=======================================
=             Breakpoints               =
=======================================*/
/*=======================================
=          Custom breakpoints           =
=======================================*/
/*======================================
=             Containers               =
======================================*/
/**
 * Container(s) styles generator
 *
 * @param  {string} $variant     What size variant to generate.
 *                               Use 'all' to generate default base styles and all other keys as modifier classes
 * @return {void}
 */
/*=======================================
=                 Grid                  =
=======================================*/
/*=================================
=         Heading styles          =
=================================*/
/**
 * Print typographic styles of an element from a map
 * @param  {string}   $t            The name of the element
 * @param  {sass-map} $titles       The map to loop through
 * @return {void}
 *
 * @format {sass-map}
 *      $titles: (
 *          shared: (
 *              <property>: <value>,
 *              ...
 *          ),
 *          <element>: (
 *              font-size: (
 *                  <breakpoint>: <font-size-w/o-unit> <fluid-or-not>,
 *                  ...
 *              )
 *          ),
 *          <element>: (
 *              font-size: <size-w/o-unit>,
 *              <property>: <value>,
 *              ...
 *          )
 *      )
 */
/**
 * Responsive typography
 * @param  {sass-map} $sizes      The map containing the breakpoint, font-size and if fluid or not.
 *                                (For sass map format, view mixin h() documentation above)
 * @return {void}
 */
/**
 * Generate calculation for a responsive size based on viewport width
 * All sizes must be in pixels
 * @author Based on Mike Riethmuller http://codepen.io/MadeByMike/pen/YPJJYv
 * @param  {integer} $min-size        The minimum size for the element
 * @param  {integer} $max-size        The maximum size for the element
 * @param  {integer} $min-width       The breakpoint minimum to activate the responsive typography
 * @param  {integer} $max-width       The breakpoint maximum to activate th responsive typography
 * @return {string}  $ratio           The calculation
 */
/*=======================================
=              Reset list               =
=======================================*/
/*=================================
=           Shorthands            =
=================================*/
/*======================================
=            Viewport width            =
======================================*/
/*======================================
=              Overflow                =
======================================*/
/*======================================
=                Stack                 =
======================================*/
/**
 * Align and space elements in a container
 * @param  {string} $orientation     Orientation. Values: 'horizontal' or 'vertical'
 * @param  {string} $alignX          Alignment of each element on X axis. Values: 'left', 'right', 'center' or adaptative according to orientation.
 * @param  {string} $alignY          Alignment of each element on Y axis. Values: 'top', 'bottom', 'center' or adaptative according to orientation.
 * @param  {number} $gap             Width of the gap between elements.
 * @param  {boolean} $wrap           If element can go onto multiple lines. Values: true or false
 * @param  {string} $var-prefix      If needed, change prefix of all var(). Default: 'stack'
 * @return {void}
 */
/*=================================
=         Size variations         =
=================================*/
/**
 * Generate variants of a size in a root css variables format
 * @param  {string}  $name           The name of the variable
 * @param  {number}  $size           The size to decline
 * @param  {boolean} $advanced       If true, generate more precise variants
 * @param  {boolean} $minus          If true, generate negative variants
 * @return {void}
 */
/**
   * Minimum aspect-ratio hack
   * @param {number} $min
   */
/**
   * Add inner shadows on element to make overflow more obvious.
   * 
   * @param {string} $color         Color of shadow
   * @param {string} $orientation   Position of gradients in parent top/bottom or left/right. Values: vertical | horizontal
   * @param {string} $size          Size of the shadow. Applied on width or height according to orientation.
   * 
   */
/*=================================
=           Font-faces            =
=================================*/
/*=================================
=         Selected Text           =
=================================*/
/*=================================
=              Misc               =
=================================*/
/*=============================
=          Visuals            =
=============================*/
/**
   * Mixin printing a linear-gradient
   * as well as a plain color fallback
   * and the `-webkit-` prefixed declaration
   * @param {String | List | Angle} $direction - Linear gradient direction
   * @param {Arglist} $color-stops - List of color-stops composing the gradient
   */
/*=========================================
=            Outline debugger             =
=========================================*/
/*==============================
=            Easing            =
==============================*/
/*============================
=    Queso mixins' config     =
============================*/
/*=======================================
=         Document Typography           =
=======================================*/
/*=================================
=             Spacers             =
=================================*/
/*
Spacer migration
Old values:
- default: 3rem (no change)
- 2xs: 0.5rem (no occurrence in codebase)
- xs: 1rem
- sm: 2rem
- md: 3rem
- lg: 4rem
- xl: 6rem (no occurrence in codebase)
- grid-gap-half : 1rem, 1.5rem
- grid-gap-third : 0.66rem, 1rem
- grid-gap-quarter : 0.5rem, 0.75rem
- grid-gap-two-third : 1.33rem, 2rem
- grid-gap-three-quarter : 1.5rem, 2.25rem (no occurrence in codebase)
- grid-gap-fifth : 0.4rem, 0.6rem
- grid-gap-sixth : 0.33rem, 0.5rem (no occurrence in codebase)
- grid-gap-1-25X : 2.5rem, 3.75rem (no occurrence in codebase)
- grid-gap-1-5X : 3rem, 4.5rem
- grid-gap-1-75X : 3.5rem, 5.25rem (no occurrence in codebase)
- grid-gap-2X : 4rem, 6rem
- grid-gap-3X : 6rem, 9rem
- grid-gap-4X : 8rem, 12rem


New values:
- --spacer-2xs -> --spacer-1                                            (5px -> 4px)                 IMPACT: DIFFERENT (-1px)

- --spacer-xs -> 1rem                                                   (10px -> 10px)               IMPACT: SAME

- --spacer-sm -> --spacer-4                                             Mobile : (20px -> 16px)      IMPACT: DIFFERENT (-4px)
                                                                        Desktop : (20px -> 20px)     IMPACT: SAME

- --spacer-md -> --spacer                                               (30px -> 30px)               IMPACT: SAME

- --spacer-lg -> --spacer-7 and --spacer-6 (with media queries)         (40px -> 40px)               IMPACT: SAME

- --grid-gap-half -> --spacer-section-xs                                Mobile : (10px -> 10px)      IMPACT: SAME
                                                                        Desktop : (15px -> 15px)     IMPACT: SAME

- --grid-gap-third -> --spacer-2                                        Mobile : (6.6px -> 6px)      IMPACT: DIFFERENT (-0.6px)
                                                                        Desktop : (10px -> 8px)      IMPACT: DIFFERENT (-2px)

- --grid-gap-two-third -> --spacer-4                                    Mobile : (13.3px -> 16px)    IMPACT: DIFFERENT (+2.7px)
                                                                        Desktop : (20px -> 20px)     IMPACT: SAME

- --grid-gap-quarter -> --spacer-2                                      Mobile : (5px -> 6px)        IMPACT: DIFFERENT (+1px)
                                                                        Desktop : (7.5px -> 8px)     IMPACT: DIFFERENT (+0.5px)

- --grid-gap-fifth -> --spacer-1                                        Mobile : (4px -> 4px)        IMPACT: SAME
                                                                        Desktop : (6px -> 4px)       IMPACT: DIFFERENT (-2px)

- --grid-gap-1-5X -> --spacer-6                                         Mobile : (30px -> 30px)      IMPACT: SAME
                                                                        Desktop : (45px -> 40px)     IMPACT: DIFFERENT (-5px)

- --grid-gap-2X -> --spacer-7                                           Mobile : (40px -> 40px)      IMPACT: SAME
                                                                        Desktop : (60px -> 60px)     IMPACT: SAME

- --grid-gap-3X -> --spacer-8 and 9rem (with media queries)             Mobile : (60px -> 60px)      IMPACT: SAME
                                                                        Desktop : (90px -> 90px)     IMPACT: SAME

- --grid-gap-4X -> --spacer-section-lg                                  Mobile : (80px -> 80px)      IMPACT: SAME
                                                                        Desktop : (120px -> 120px)   IMPACT: SAME
*/
/*=================================
=         Border Radiuses         =
=================================*/
/*
Border radius migration
Old values:
- xs: 0.4rem  (4px)
- sm: 0.5rem  (5px)
- md: 0.8rem  (8px)
- lg: 1.2rem  (12px)
- xl: 2.2rem  (22px)

New values:
- old --radius-sm -> new --radius-xs                     (5px -> 4px)      IMPACT: DIFFERENT
- old --radius-md -> new --radius-sm                     (8px -> 8px)      IMPACT: SAME
- old --radius-lg -> calc(--radius-sm + --radius-xs)     (12px -> 12px)    IMPACT: SAME
- old --radius-xl -> new --radius-lg                     (22px -> 20px)    IMPACT: DIFFERENT (no usage in codebase)
*/
/*=================================
=            Z-indexes            =
=================================*/
/*=================================
=             Shadows             =
=================================*/
/*
Typography migration
Old values:
- h1: 40px, 110px (no change)
- h2: 25px, 40px (no change)
- h2-large: 40px, 60px (no change)
- h3: 20px, 30px (no change)
- h4: 22px, 25px
- h5: 20px, 25px
- h6: 16px, 25px

- p1: 22px
- p2: 18px (no occurrence in codebase)
- p3: 16px
- p4: 14px
- c1: 13px
- c2: 12px (no occurrence in codebase)


New values:
- h4 -> h4                                             Mobile : (22px -> 20px)      IMPACT: DIFFERENT (-2px)
                                                       Desktop : (25px -> 25px)     IMPACT: SAME

- h5 -> h4                                             Mobile : (20px -> 20px)      IMPACT: SAME
                                                       Desktop : (25px -> 25px)     IMPACT: SAME

- h6 -> h5 and h4 (with media queries)                 Mobile : (16px -> 18px)      IMPACT: DIFFERENT (+2px)
                                                       Desktop : (25px -> 25px)     IMPACT: SAME

- p1 -> p2                                             Mobile : (22px -> 20px)      IMPACT: DIFFERENT (-2px)
                                                       Desktop : (22px -> 25px)     IMPACT: DIFFERENT (+3px)

- p2 -> p3                                             Mobile : (18px -> 18px)      IMPACT: SAME
                                                       Desktop : (18px -> 20px)     IMPACT: DIFFERENT (+2px)

- p3 -> p4                                             (16px -> 16px)               IMPACT: SAME

- p4 -> p4                                             (14px -> 16px)               IMPACT: DIFFERENT (+2px)

*/
/*=================================
=           Font faces            =
=================================*/
/*=================================
=            DISPLAYS             =
=================================*/
/*=================================
=            Headings             =
=================================*/
/*=================================
=     Paragraphs & Captions       =
=================================*/
/*=================================
=            Typography           =
=================================*/
/*=================================
=        Rich text editor         =
=================================*/
/*=================================
=         Typography- styles          =
=================================*/
body .ck.ck-editor__main > .ck-editor__editable {
  --ff-heading: "Monderat", serif;
  --ff-paragraph: "Monderat", sans-serif;
}

/*=========================
:=         Global          =
=========================*/
/*====================================
=              Colors               =
====================================*/
body .ck.ck-editor__main > .ck-editor__editable {
  --color-white: #FFFFFF;
  --color-white-50: rgba(255, 255, 255, 0.5019607843);
  --color-white-85: rgba(255, 255, 255, 0.8509803922);
  --color-black: #101820;
  --color-dark: #101820;
  --color-yellow: #FFD972;
  --color-blue: #3ECDFF;
  --color-grey: #E3E3E3;
  --color-green: #5DEAC2;
  --color-grey-dark: #7C8084;
  --color-orange: #F47F5B;
  --color-beige: #F2F2EC;
  --color-valid: #A6D3A0;
  --color-warning: #F7A6A6;
  --color-grey-light: #F4F4F4;
  --color-black-light: rgba(16, 24, 32, 0.5490196078);
  --color-black-200: #B8B8B8;
  --color-yellow-100: #FFEE63;
  --color-yellow-500: #443200;
  --color-yellow-50-dark: #A19032;
  --color-yellow-50-light: #807732;
  --color-blue-100: #3ECDFF;
  --color-blue-500: #003A44;
  --color-blue-50-dark: #1F83A1;
  --color-blue-50-light: #1F6780;
  --color-green-100: #00EEC0;
  --color-green-500: #183F31;
  --color-green-50-dark: #0C9679;
  --color-green-50-light: #007760;
  --color-red-100: #FF7654;
  --color-red-500: #68281F;
  --color-red-50-dark: #B34F3A;
  --color-red-50-light: #803B2A;
  --color-black-500: #000000;
  --color-black-400: #3D3D3D;
  --color-black-50: rgba(0, 0, 0, 0.5019607843);
}

/*====================================
=               Layers               =
====================================*/
body .ck.ck-editor__main > .ck-editor__editable {
  --z-default: 1;
  --z-loader: 500;
  --z-modal: 300;
  --z-header: 200;
  --z-dropdown: 100;
  --z-limbo: -100;
}

/*=================================
=         Border Radiuses         =
=================================*/
body .ck.ck-editor__main > .ck-editor__editable {
  --radius-xs: 0.25rem;
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.25rem;
  --radius-full: 624.375rem;
}

/*==============================
=            Spacer            =
==============================*/
body .ck.ck-editor__main > .ck-editor__editable {
  --spacer: 3rem;
  --spacer-1: 0.4rem;
  --spacer-2: 0.6rem;
  --spacer-3: 1.6rem;
  --spacer-4: 1.6rem;
  --spacer-5: 1.6rem;
  --spacer-6: 3rem;
  --spacer-7: 4rem;
  --spacer-8: 6rem;
  --spacer-small: 1rem;
  --spacer-section-xs: 1rem;
  --spacer-section-sm: 2rem;
  --spacer-section-main: 4rem;
  --spacer-section-lg: 8rem;
  --spacer-section-xl: 11rem;
}
@media (min-width: 1024px) {
  body .ck.ck-editor__main > .ck-editor__editable {
    --spacer-2: 0.8rem;
  }
}
@media (min-width: 1024px) {
  body .ck.ck-editor__main > .ck-editor__editable {
    --spacer-4: 2rem;
  }
}
@media (min-width: 1024px) {
  body .ck.ck-editor__main > .ck-editor__editable {
    --spacer-5: 3rem;
  }
}
@media (min-width: 1024px) {
  body .ck.ck-editor__main > .ck-editor__editable {
    --spacer-6: 4rem;
  }
}
@media (min-width: 1024px) {
  body .ck.ck-editor__main > .ck-editor__editable {
    --spacer-7: 6rem;
  }
}
@media (min-width: 1024px) {
  body .ck.ck-editor__main > .ck-editor__editable {
    --spacer-8: 12rem;
  }
}
@media (min-width: 1024px) {
  body .ck.ck-editor__main > .ck-editor__editable {
    --spacer-section-xs: 1.5rem;
  }
}
@media (min-width: 1024px) {
  body .ck.ck-editor__main > .ck-editor__editable {
    --spacer-section-sm: 4rem;
  }
}
@media (min-width: 1024px) {
  body .ck.ck-editor__main > .ck-editor__editable {
    --spacer-section-main: 8rem;
  }
}
@media (min-width: 1024px) {
  body .ck.ck-editor__main > .ck-editor__editable {
    --spacer-section-lg: 12rem;
  }
}
@media (min-width: 1024px) {
  body .ck.ck-editor__main > .ck-editor__editable {
    --spacer-section-xl: 20rem;
  }
}

/*====================================
=               Themes               =
====================================*/
body .ck.ck-editor__main > .ck-editor__editable {
  --theme-white: #FFFFFF;
  --theme-black: #101820;
  --theme-dark: #101820;
  --theme-yellow: #FFD972;
  --theme-blue: #3ECDFF;
  --theme-grey: #E3E3E3;
  --theme-green: #5DEAC2;
  --theme-grey-dark: #7C8084;
  --theme-orange: #F47F5B;
  --theme-beige: #F2F2EC;
  --theme-grey-light: #F4F4F4;
  --theme-black-light: rgba(16, 24, 32, 0.5490196078);
  --theme-surface-primary: #F2F2EC;
  --theme-surface-secondary: #FFFFFF;
  --theme-surface-primary-hover: #E3E3E3;
  --theme-surface-disabled: #F4F4F4;
  --theme-text-primary: #101820;
  --theme-text-invert: #FFFFFF;
  --theme-text-disabled: #7C8084;
  --theme-border-primary: #E3E3E3;
  --theme-border-secondary: #101820;
  --theme-tag-line-muted: #E3E3E3;
  --theme-icon-secondary: #E3E3E3;
  --theme-surface-yellow: #FFEE63;
  --theme-surface-yellow-dark: #443200;
  --theme-surface-blue: #3ECDFF;
  --theme-surface-blue-dark: #003A44;
  --theme-surface-green: #00EEC0;
  --theme-surface-green-dark: #183F31;
  --theme-surface-red: #FF7654;
  --theme-surface-red-dark: #68281F;
  --theme-surface-invert: #000000;
  --theme-surface-invert-hover: #3D3D3D;
  --theme-text-secondary: rgba(0, 0, 0, 0.5019607843);
  --theme-text-yellow: #FFEE63;
  --theme-text-yellow-secondary-dark: #A19032;
  --theme-text-yellow-secondary-light: #807732;
  --theme-text-blue: #3ECDFF;
  --theme-text-blue-secondary-dark: #1F83A1;
  --theme-text-blue-secondary-light: #1F6780;
  --theme-text-green: #00EEC0;
  --theme-text-green-secondary-dark: #0C9679;
  --theme-text-green-secondary-light: #007760;
  --theme-text-red: #FF7654;
  --theme-text-red-secondary-dark: #B34F3A;
  --theme-text-red-secondary-light: #803B2A;
  --theme-success-primary: #A6D3A0;
  --theme-success-secondary: #A6D3A0;
  --theme-success-tertiary: #A6D3A0;
  --theme-warning-primary: #F47F5B;
  --theme-warning-secondary: #F47F5B;
  --theme-warning-tertiary: #F47F5B;
  --theme-error-primary: #F7A6A6;
  --theme-error-secondary: #F7A6A6;
  --theme-error-tertiary: #F7A6A6;
}

/*=================================
=           Typography            =
=================================*/
body .ck.ck-editor__main > .ck-editor__editable {
  --ff-paragraph: "RethinkSans", sans-serif;
  --ff-body: var(--ff-paragraph);
  --ff-heading: "RethinkSans", sans-serif;
}

@font-face {
  font-family: "Monderat";
  src: url("/static/fonts/moderat_bold.woff2") format("woff2"), url("/static/fonts/moderat_bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Monderat";
  src: url("/static/fonts/moderat_regular.woff2") format("woff2"), url("/static/fonts/moderat_regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "RethinkSans";
  src: url("/static/fonts/RethinkSans-Bold.woff2") format("woff2"), url("/static/fonts/RethinkSans-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "RethinkSans";
  src: url("/static/fonts/RethinkSans-Regular.woff2") format("woff2"), url("/static/fonts/RethinkSans-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
.t-p1 {
  font-size: calc(20px + (30 - 20) * (100vw - 420px) / (1536 - 420));
  line-height: 1.2;
  font-family: var(--ff-paragraph);
  font-weight: normal;
}
@media (min-width: 1536px) {
  .t-p1 {
    font-size: 3rem;
  }
}

.t-p2 {
  font-size: calc(18px + (25 - 18) * (100vw - 420px) / (1536 - 420));
  line-height: 1.4;
  font-family: var(--ff-paragraph);
  font-weight: normal;
}
@media (min-width: 1536px) {
  .t-p2 {
    font-size: 2.5rem;
  }
}

.t-p3 {
  font-size: calc(16px + (20 - 16) * (100vw - 420px) / (1536 - 420));
  line-height: 1.35;
  font-family: var(--ff-paragraph);
  font-weight: normal;
}
@media (min-width: 1536px) {
  .t-p3 {
    font-size: 2rem;
  }
}

.t-p4 {
  font-size: 1.6rem;
  line-height: 1.3;
  font-family: var(--ff-paragraph);
  font-weight: normal;
}

.t-p5 {
  font-size: 1.3rem;
  line-height: 1.3;
  font-family: var(--ff-paragraph);
  font-weight: normal;
}

.t-c1 {
  font-size: 1.3rem;
  font-family: var(--ff-paragraph);
  line-height: 1;
  font-weight: 400;
}

.t-h1 {
  font-size: calc(40px + (110 - 40) * (100vw - 420px) / (1536 - 420));
  font-family: var(--ff-heading);
  line-height: 1;
  font-weight: bold;
}
@media (min-width: 1536px) {
  .t-h1 {
    font-size: 11rem;
  }
}

.t-h2 {
  font-size: calc(25px + (40 - 25) * (100vw - 420px) / (1536 - 420));
  font-family: var(--ff-heading);
  line-height: 1;
  font-weight: bold;
}
@media (min-width: 1536px) {
  .t-h2 {
    font-size: 4rem;
  }
}

.t-h2-large {
  font-size: calc(40px + (60 - 40) * (100vw - 420px) / (1536 - 420));
  font-family: var(--ff-heading);
  line-height: 1;
  font-weight: bold;
}
@media (min-width: 1536px) {
  .t-h2-large {
    font-size: 6rem;
  }
}

.t-h3 {
  font-size: calc(20px + (30 - 20) * (100vw - 420px) / (1536 - 420));
  font-family: var(--ff-heading);
  line-height: 1;
  font-weight: bold;
}
@media (min-width: 1536px) {
  .t-h3 {
    font-size: 3rem;
  }
}

.t-h4 {
  font-size: calc(20px + (25 - 20) * (100vw - 420px) / (1536 - 420));
  line-height: 1.1;
  font-family: var(--ff-heading);
  font-weight: bold;
}
@media (min-width: 1536px) {
  .t-h4 {
    font-size: 2.5rem;
  }
}

.t-h5 {
  font-size: calc(18px + (20 - 18) * (100vw - 420px) / (1536 - 420));
  line-height: 1.25;
  font-weight: 400;
  font-family: var(--ff-heading);
}
@media (min-width: 1536px) {
  .t-h5 {
    font-size: 2rem;
  }
}

.t-display-lg {
  font-size: calc(50px + (160 - 50) * (100vw - 420px) / (1536 - 420));
  font-family: var(--ff-heading);
  line-height: 1;
  font-weight: bold;
}
@media (min-width: 1536px) {
  .t-display-lg {
    font-size: 16rem;
  }
}

.t-display-md {
  font-size: calc(40px + (94 - 40) * (100vw - 420px) / (1536 - 420));
  font-family: var(--ff-heading);
  line-height: 1;
  font-weight: bold;
}
@media (min-width: 1536px) {
  .t-display-md {
    font-size: 9.4rem;
  }
}

/*=================================
=        Rich text editor         =
=================================*/
body .ck.ck-editor__main > .ck-editor__editable {
  --rte-gap: 1.35em;
  --rte-gap-half: calc(var(--rte-gap) / 2);
  --rte-gap-third: calc(var(--rte-gap) / 3);
  --rte-gap-2X: calc(var(--rte-gap) * 2);
  --rte-gap-4X: calc(var(--rte-gap) * 4);
}

body .ck.ck-editor__main > .ck-editor__editable {
  max-width: var(--rte-width, 90rem);
}
body .ck.ck-editor__main > .ck-editor__editable p + p {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable p + ul {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable p + ol {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable p + blockquote {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable ul + p {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable ul + ul {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable ul + ol {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable ul + blockquote {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable ol + p {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable ol + ul {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable ol + ol {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable ol + blockquote {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable blockquote + p {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable blockquote + ul {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable blockquote + ol {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable blockquote + blockquote {
  margin-top: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable a:not(.c-raw-button) {
  color: var(--theme-black);
  font-weight: bold;
  text-decoration: underline;
  text-decoration-color: var(--theme-black);
  text-decoration-style: solid;
  text-decoration-thickness: 2px;
  text-underline-offset: 0.2em;
}
body .ck.ck-editor__main > .ck-editor__editable a:not(.c-raw-button):hover {
  color: var(--theme-orange);
  text-decoration-color: var(--theme-orange);
}
body .ck.ck-editor__main > .ck-editor__editable blockquote {
  max-width: 50ch;
  font-size: 1.5em;
  padding-left: 0.667em;
  border-left: 2px solid var(--theme-black, lightgrey);
}
body .ck.ck-editor__main > .ck-editor__editable hr {
  width: 100%;
  height: 1px;
  margin: var(--rte-gap-2X, 2em) auto;
  background-color: var(--theme-grey, lightgrey);
  border: none;
}
body .ck.ck-editor__main > .ck-editor__editable h1,
body .ck.ck-editor__main > .ck-editor__editable h2,
body .ck.ck-editor__main > .ck-editor__editable h3,
body .ck.ck-editor__main > .ck-editor__editable h4,
body .ck.ck-editor__main > .ck-editor__editable h5,
body .ck.ck-editor__main > .ck-editor__editable h6 {
  margin-top: var(--rte-gap, 1em);
  margin-bottom: var(--rte-gap-half, 1rem);
}
body .ck.ck-editor__main > .ck-editor__editable h1 {
  font-size: calc(40px + (110 - 40) * (100vw - 420px) / (1536 - 420));
  font-family: var(--ff-heading);
  line-height: 1;
  font-weight: bold;
}
@media (min-width: 1536px) {
  body .ck.ck-editor__main > .ck-editor__editable h1 {
    font-size: 11rem;
  }
}
body .ck.ck-editor__main > .ck-editor__editable h2 {
  font-size: calc(25px + (40 - 25) * (100vw - 420px) / (1536 - 420));
  font-family: var(--ff-heading);
  line-height: 1;
  font-weight: bold;
}
@media (min-width: 1536px) {
  body .ck.ck-editor__main > .ck-editor__editable h2 {
    font-size: 4rem;
  }
}
body .ck.ck-editor__main > .ck-editor__editable h2-large {
  font-size: calc(40px + (60 - 40) * (100vw - 420px) / (1536 - 420));
  font-family: var(--ff-heading);
  line-height: 1;
  font-weight: bold;
}
@media (min-width: 1536px) {
  body .ck.ck-editor__main > .ck-editor__editable h2-large {
    font-size: 6rem;
  }
}
body .ck.ck-editor__main > .ck-editor__editable h3 {
  font-size: calc(20px + (30 - 20) * (100vw - 420px) / (1536 - 420));
  font-family: var(--ff-heading);
  line-height: 1;
  font-weight: bold;
}
@media (min-width: 1536px) {
  body .ck.ck-editor__main > .ck-editor__editable h3 {
    font-size: 3rem;
  }
}
body .ck.ck-editor__main > .ck-editor__editable h4 {
  font-size: calc(20px + (25 - 20) * (100vw - 420px) / (1536 - 420));
  line-height: 1.1;
  font-family: var(--ff-heading);
  font-weight: bold;
}
@media (min-width: 1536px) {
  body .ck.ck-editor__main > .ck-editor__editable h4 {
    font-size: 2.5rem;
  }
}
body .ck.ck-editor__main > .ck-editor__editable h5 {
  font-size: calc(18px + (20 - 18) * (100vw - 420px) / (1536 - 420));
  line-height: 1.25;
  font-weight: 400;
  font-family: var(--ff-heading);
}
@media (min-width: 1536px) {
  body .ck.ck-editor__main > .ck-editor__editable h5 {
    font-size: 2rem;
  }
}
body .ck.ck-editor__main > .ck-editor__editable ul li:not(:first-child),
body .ck.ck-editor__main > .ck-editor__editable ol li:not(:first-child) {
  margin-top: calc(var(--rte-gap-third) * 2);
}
body .ck.ck-editor__main > .ck-editor__editable ul ul,
body .ck.ck-editor__main > .ck-editor__editable ul ol,
body .ck.ck-editor__main > .ck-editor__editable ol ul,
body .ck.ck-editor__main > .ck-editor__editable ol ol {
  margin-top: calc(var(--rte-gap-third) * 2);
  margin-bottom: 0;
}
body .ck.ck-editor__main > .ck-editor__editable ul {
  list-style: disc;
  margin-left: 1.7rem;
}
body .ck.ck-editor__main > .ck-editor__editable ul li {
  padding-left: 0.55em;
}
body .ck.ck-editor__main > .ck-editor__editable ol {
  counter-reset: rte-ol;
  list-style: none;
}
body .ck.ck-editor__main > .ck-editor__editable ol li {
  padding-left: 3rem;
  position: relative;
}
body .ck.ck-editor__main > .ck-editor__editable ol li::before {
  display: var(--stack-display, flex);
  align-items: var(--stack-align, center);
  justify-content: var(--stack-justify, flex-start);
  flex-direction: var(--stack-direction, row);
  column-gap: var(--stack-col-gap, var(--stack-gap, var(--grid-gap)));
  row-gap: var(--stack-row-gap, var(--stack-gap, var(--grid-gap)));
  flex-wrap: var(--stack-wrap, wrap);
  counter-increment: rte-ol;
  content: counters(rte-ol, ".") ".";
  min-width: 2em;
  position: absolute;
  top: 0.675em;
  left: 0;
  transform: translateY(-50%);
}
body .ck.ck-editor__main > .ck-editor__editable ol ol li {
  padding-left: 4rem;
}
body .ck.ck-editor__main > .ck-editor__editable figure {
  margin-top: var(--rte-gap, 1em);
  margin-bottom: var(--rte-gap, 1em);
}
body .ck.ck-editor__main > .ck-editor__editable figure img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}
body .ck.ck-editor__main > .ck-editor__editable figure iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
}
body .ck.ck-editor__main > .ck-editor__editable figure figcaption,
body .ck.ck-editor__main > .ck-editor__editable figure caption {
  font-size: 1.3rem;
  line-height: 1.3;
  font-family: var(--ff-paragraph);
  font-weight: normal;
  display: block;
  font-style: italic;
  margin-top: 0.5em;
}
body .ck.ck-editor__main > .ck-editor__editable > *:first-child {
  margin-top: 0;
}
body .ck.ck-editor__main > .ck-editor__editable > *:last-child {
  margin-bottom: 0;
}

body .ck.ck-editor__main > .ck-editor__editable {
  --rte-width: none;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -moz-osx-font-smoothing: antialiased;
  font-size: 1.6rem;
  line-height: 1.3;
  font-family: var(--ff-paragraph);
  font-weight: normal;
  color: var(--theme-text-primary);
  background-color: var(--theme-surface-primary);
}
body .ck.ck-editor__main > .ck-editor__editable ul,
body .ck.ck-editor__main > .ck-editor__editable ol {
  padding: 0 !important;
}
body .ck.ck-editor__main > .ck-editor__editable ul li,
body .ck.ck-editor__main > .ck-editor__editable ol li {
  list-style-type: none;
}
body .ck.ck-editor__main > .ck-editor__editable blockquote {
  border: none !important;
}
body .ck.ck-editor__main > .ck-editor__editable hr {
  margin: 90px auto !important;
}
body .ck.ck-editor__main > .ck-editor__editable h1,
body .ck.ck-editor__main > .ck-editor__editable h2,
body .ck.ck-editor__main > .ck-editor__editable h3,
body .ck.ck-editor__main > .ck-editor__editable h4,
body .ck.ck-editor__main > .ck-editor__editable h5,
body .ck.ck-editor__main > .ck-editor__editable h6 {
  color: var(--theme-text-primary);
}
body .ck.ck-editor__main > .ck-editor__editable a:not(.c-raw-button) {
  text-decoration: none;
}