:root {
    --color-base-opaque-pure-white: #ffffff;
    --color-base-opaque-soft-white: #fafafa;
    --color-base-opaque-off-white: #f5f5f5;
    --color-base-opaque-pearl-gray: #efefef;
    --color-base-opaque-soft-gray: #e5e5e5;
    --color-base-opaque-light-gray: #d9d9d9;
    --color-base-opaque-neutral-gray: #cccccc;
    --color-base-opaque-medium-gray: #b3b3b3;
    --color-base-opaque-stone-gray: #999999;
    --color-base-opaque-carbon-gray: #7f7f7f;
    --color-base-opaque-deep-gray: #666666;
    --color-base-opaque-dark-gray: #4d4d4d;
    --color-base-opaque-soft-black: #323232;
    --color-base-opaque-dark-black: #191919;
    --color-base-opaque-pure-black: #000000;
    --color-base-transparent-black-opacity-02: rgba(0, 0, 0, 0.02);
    --color-base-transparent-black-opacity-04: rgba(0, 0, 0, 0.04);
    --color-base-transparent-black-opacity-06: rgba(0, 0, 0, 0.06);
    --color-base-transparent-black-opacity-10: rgba(0, 0, 0, 0.1);
    --color-base-transparent-black-opacity-15: rgba(0, 0, 0, 0.15);
    --color-base-transparent-black-opacity-20: rgba(0, 0, 0, 0.2);
    --color-base-transparent-black-opacity-30: rgba(0, 0, 0, 0.3);
    --color-base-transparent-black-opacity-40: rgba(0, 0, 0, 0.4);
    --color-base-transparent-black-opacity-50: rgba(0, 0, 0, 0.5);
    --color-base-transparent-black-opacity-60: rgba(0, 0, 0, 0.6);
    --color-base-transparent-black-opacity-70: rgba(0, 0, 0, 0.7);
    --color-base-transparent-black-opacity-80: rgba(0, 0, 0, 0.8);
    --color-base-transparent-black-opacity-90: rgba(0, 0, 0, 0.9);
    --color-base-transparent-black-opacity-100: #000000;
    --color-base-transparent-white-opacity-02: rgba(255, 255, 255, 0.02);
    --color-base-transparent-white-opacity-04: rgba(255, 255, 255, 0.04);
    --color-base-transparent-white-opacity-06: rgba(255, 255, 255, 0.06);
    --color-base-transparent-white-opacity-10: rgba(255, 255, 255, 0.1);
    --color-base-transparent-white-opacity-15: rgba(255, 255, 255, 0.15);
    --color-base-transparent-white-opacity-20: rgba(255, 255, 255, 0.2);
    --color-base-transparent-white-opacity-30: rgba(255, 255, 255, 0.3);
    --color-base-transparent-white-opacity-40: rgba(255, 255, 255, 0.4);
    --color-base-transparent-white-opacity-50: rgba(255, 255, 255, 0.5);
    --color-base-transparent-white-opacity-60: rgba(255, 255, 255, 0.6);
    --color-base-transparent-white-opacity-70: rgba(255, 255, 255, 0.7);
    --color-base-transparent-white-opacity-80: rgba(255, 255, 255, 0.8);
    --color-base-transparent-white-opacity-90: rgba(255, 255, 255, 0.9);
    --color-base-transparent-white-opacity-100: #ffffff;
    --color-base-bluish-cool-gray-light: #ececef;
    --color-base-bluish-cool-gray-dark: #e3e3e7;
    --color-base-bluish-midnight-gray-light: #3b3b3d;
    --color-base-bluish-midnight-gray-dark: #313133;
    --color-base-vibrant-bright-red-light: #f44336;
    --color-base-vibrant-bright-red-dark: #c72215;
    --color-base-vibrant-golden-orange-light: #f4b12c;
    --color-base-vibrant-golden-orange-dark: #da960f;
    --color-base-vibrant-fresh-green-light: #82d834;
    --color-base-vibrant-fresh-green-dark: #61bc0e;
    --color-base-vibrant-royal-blue-light: #007aff;
    --color-base-vibrant-royal-blue-dark: #176dcb;
    --color-page-background: var(--color-base-opaque-soft-white);
}
.theme-light {
    --color-base-vibrant-bright-red: var(--color-base-vibrant-bright-red-light);
    --color-base-vibrant-golden-orange: var(
        --color-base-vibrant-golden-orange-light
    );
    --color-base-vibrant-fresh-green: var(
        --color-base-vibrant-fresh-green-light
    );
    --color-base-vibrant-royal-blue: var(--color-base-vibrant-royal-blue-light);
}
.theme-dark {
    --color-base-vibrant-bright-red: var(--color-base-vibrant-bright-red-dark);
    --color-base-vibrant-golden-orange: var(
        --color-base-vibrant-golden-orange-dark
    );
    --color-base-vibrant-fresh-green: var(
        --color-base-vibrant-fresh-green-dark
    );
    --color-base-vibrant-royal-blue: var(--color-base-vibrant-royal-blue-dark);
}
@font-face {
    font-family: "playfair";
    src: url("../fonts/playfair-display/PlayfairDisplay-Regular.woff2")
        format("woff2");
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: "playfair";
    src: url("../fonts/playfair-display/PlayfairDisplay-Regular.woff2")
        format("woff2");
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: "playfair";
    src: url("../fonts/playfair-display/PlayfairDisplay-Regular.woff2")
        format("woff2");
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: "playfair";
    src: url("../fonts/playfair-display/PlayfairDisplay-Regular.woff2")
        format("woff2");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "playfair";
    src: url("../fonts/playfair-display/PlayfairDisplay-Medium.woff2")
        format("woff2");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: "playfair";
    src: url("../fonts/playfair-display/PlayfairDisplay-SemiBold.woff2")
        format("woff2");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: "playfair";
    src: url("../fonts/playfair-display/PlayfairDisplay-Bold.woff2")
        format("woff2");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "playfair";
    src: url("../fonts/playfair-display/PlayfairDisplay-ExtraBold.woff2")
        format("woff2");
    font-weight: 800;
    font-style: normal;
}
@font-face {
    font-family: "playfair";
    src: url("../fonts/playfair-display/PlayfairDisplay-Black.woff2")
        format("woff2");
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: "roboto";
    src: url("../fonts/roboto/Roboto-Thin.woff2") format("woff2");
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: "roboto";
    src: url("../fonts/roboto/Roboto-ExtraLight.woff2") format("woff2");
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: "roboto";
    src: url("../fonts/roboto/Roboto-Light.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: "roboto";
    src: url("../fonts/roboto/Roboto-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: "roboto";
    src: url("../fonts/roboto/Roboto-Regular.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: "roboto";
    src: url("../fonts/roboto/Roboto-Medium.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: "roboto";
    src: url("../fonts/roboto/Roboto-SemiBold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "roboto";
    src: url("../fonts/roboto/Roboto-ExtraBold.woff2") format("woff2");
    font-weight: 800;
    font-style: normal;
}
@font-face {
    font-family: "roboto";
    src: url("../fonts/roboto/Roboto-Black.woff2") format("woff2");
    font-weight: 900;
    font-style: normal;
}
.font-sans-weight-thin {
    font-family: "roboto";
    font-weight: 100;
}
.font-sans-weight-extra-light {
    font-family: "roboto";
    font-weight: 200;
}
.font-sans-weight-light {
    font-family: "roboto";
    font-weight: 300;
}
.font-sans-weight-regular {
    font-family: "roboto";
    font-weight: 400;
}
.font-sans-weight-medium {
    font-family: "roboto";
    font-weight: 500;
}
.font-sans-weight-semi-bold {
    font-family: "roboto";
    font-weight: 600;
}
.font-sans-weight-bold {
    font-family: "roboto";
    font-weight: 700;
}
.font-sans-weight-extra-bold {
    font-family: "roboto";
    font-weight: 800;
}
.font-sans-weight-black {
    font-family: "roboto";
    font-weight: 900;
}
.font-serif-weight-thin {
    font-family: "playfair";
    font-weight: 100;
}
.font-serif-weight-extra-light {
    font-family: "playfair";
    font-weight: 200;
}
.font-serif-weight-light {
    font-family: "playfair";
    font-weight: 300;
}
.font-serif-weight-regular {
    font-family: "playfair";
    font-weight: 400;
}
.font-serif-weight-medium {
    font-family: "playfair";
    font-weight: 500;
}
.font-serif-weight-semi-bold {
    font-family: "playfair";
    font-weight: 600;
}
.font-serif-weight-bold {
    font-family: "playfair";
    font-weight: 700;
}
.font-serif-weight-extra-bold {
    font-family: "playfair";
    font-weight: 800;
}
.font-serif-weight-black {
    font-family: "playfair";
    font-weight: 900;
}
:root {
    --font-size-pico: 1rem;
    --font-size-pico-plus: 1.1rem;
    --font-size-nano: 1.2rem;
    --font-size-micro: 1.3rem;
    --font-size-tiny: 1.4rem;
    --font-size-small: 1.5rem;
    --font-size-regular: 1.6rem;
    --font-size-regular-plus: 1.8rem;
    --font-size-medium: 2.1rem;
    --font-size-medium-plus: 2.4rem;
    --font-size-large: 2.6rem;
    --font-size-large-plus: 3rem;
    --font-size-big: 3.3rem;
    --font-size-big-plus: 3.6rem;
    --font-size-huge: 4.2rem;
    --font-size-huge-plus: 4.8rem;
    --font-size-giant: 7rem;
    --font-size-mega: 10rem;
}
.font-size-pico {
    font-size: var(--font-size-pico);
}
.font-size-pico-plus {
    font-size: var(--font-size-pico-plus);
}
.font-size-nano {
    font-size: var(--font-size-nano);
}
.font-size-micro {
    font-size: var(--font-size-micro);
}
.font-size-tiny {
    font-size: var(--font-size-tiny);
}
.font-size-small {
    font-size: var(--font-size-small);
}
.font-size-regular {
    font-size: var(--font-size-regular);
}
.font-size-regular-plus {
    font-size: var(--font-size-regular-plus);
}
.font-size-medium {
    font-size: var(--font-size-medium);
    -webkit-font-smoothing: antialiased;
}
.font-size-medium-plus {
    font-size: var(--font-size-medium-plus);
    -webkit-font-smoothing: antialiased;
}
.font-size-large {
    font-size: var(--font-size-large);
    -webkit-font-smoothing: antialiased;
}
.font-size-large-plus {
    font-size: var(--font-size-large-plus);
    -webkit-font-smoothing: antialiased;
}
.font-size-big {
    font-size: var(--font-size-big);
    -webkit-font-smoothing: antialiased;
}
.font-size-big-plus {
    font-size: var(--font-size-big-plus);
    -webkit-font-smoothing: antialiased;
}
.font-size-huge {
    font-size: var(--font-size-huge);
    -webkit-font-smoothing: antialiased;
}
.font-size-huge-plus {
    font-size: var(--font-size-huge-plus);
    -webkit-font-smoothing: antialiased;
}
.font-size-giant {
    font-size: var(--font-size-giant);
    -webkit-font-smoothing: antialiased;
}
.font-size-mega {
    font-size: var(--font-size-mega);
    -webkit-font-smoothing: antialiased;
}
html {
    font-size: 62.5%;
}
body {
    font-size: 1.6rem;
}
:root {
    --swiper-pagination-color: black;
    --swiper-pagination-left: auto;
    --swiper-pagination-right: 8px;
    --swiper-pagination-bottom: 8px;
    --swiper-pagination-top: auto;
    --swiper-pagination-fraction-color: inherit;
    --swiper-pagination-progressbar-bg-color: rgba(0, 0, 0, 0.25);
    --swiper-pagination-progressbar-size: 4px;
    --swiper-pagination-bullet-size: 8px;
    --swiper-pagination-bullet-width: 8px;
    --swiper-pagination-bullet-height: 8px;
    --swiper-pagination-bullet-border-radius: 50%;
    --swiper-pagination-bullet-inactive-color: #000;
    --swiper-pagination-bullet-inactive-opacity: 0.2;
    --swiper-pagination-bullet-opacity: 1;
    --swiper-pagination-bullet-horizontal-gap: 4px;
    --swiper-pagination-bullet-vertical-gap: 6px;
}
.swiper-pagination,
.custom-pagination {
    position: absolute;
    text-align: center;
    transition: 300ms opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden,
.custom-pagination.swiper-pagination-hidden {
    opacity: 0;
}
.swiper-pagination-disabled > .swiper-pagination,
.swiper-pagination-disabled > .custom-pagination,
.swiper-pagination.swiper-pagination-disabled,
.custom-pagination.swiper-pagination-disabled {
    display: none !important;
}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: var(--swiper-pagination-bottom, 8px);
    top: var(--swiper-pagination-top, auto);
    left: 0;
    width: 100%;
}
/* Bullets */
.swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transform: scale(0.33);
    position: relative;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
    transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    transform: scale(0.33);
}
.swiper-pagination-bullet {
    width: var(
        --swiper-pagination-bullet-width,
        var(--swiper-pagination-bullet-size, 8px)
    );
    height: var(
        --swiper-pagination-bullet-height,
        var(--swiper-pagination-bullet-size, 8px)
    );
    display: inline-block;
    border-radius: var(--swiper-pagination-bullet-border-radius, 50%);
    background: var(--swiper-pagination-bullet-inactive-color, #000);
    opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
}
button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer;
}
.swiper-pagination-bullet:only-child {
    display: none !important;
}
.swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
}
.swiper-vertical > .swiper-pagination-bullets,
.swiper-pagination-vertical.swiper-pagination-bullets {
    right: var(--swiper-pagination-right, 8px);
    left: var(--swiper-pagination-left, auto);
    top: 50%;
    transform: translate3d(0px, -50%, 0);
}
.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets
    .swiper-pagination-bullet {
    margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
    display: block;
}
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
}
.swiper-vertical
    > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic
    .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic
    .swiper-pagination-bullet {
    display: inline-block;
    transition:
        200ms transform,
        200ms top;
}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets
    .swiper-pagination-bullet {
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
}
.swiper-horizontal
    > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
}
.swiper-horizontal
    > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic
    .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic
    .swiper-pagination-bullet {
    transition:
        200ms transform,
        200ms left;
}
.swiper-horizontal.swiper-rtl
    > .swiper-pagination-bullets-dynamic
    .swiper-pagination-bullet {
    transition:
        200ms transform,
        200ms right;
}
/* Fraction */
.swiper-pagination-fraction {
    color: var(--swiper-pagination-fraction-color, inherit);
}
/* Progress */
.swiper-pagination-progressbar {
    background: var(
        --swiper-pagination-progressbar-bg-color,
        rgba(0, 0, 0, 0.25)
    );
    position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top;
}
.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    transform-origin: right top;
}
.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-vertical
    > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: var(--swiper-pagination-progressbar-size, 4px);
    left: 0;
    top: 0;
}
.swiper-vertical > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-horizontal
    > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {
    width: var(--swiper-pagination-progressbar-size, 4px);
    height: 100%;
    left: 0;
    top: 0;
}
.swiper-pagination-lock {
    display: none;
}
:root {
    --safe-area-top: env(safe-area-inset-top);
    --safe-area-right: env(safe-area-inset-right);
    --safe-area-bottom: env(safe-area-inset-bottom);
    --safe-area-left: env(safe-area-inset-left);
    --layout-breakpoint-narrow: 490px;
    --layout-breakpoint-medium: 977px;
    --layout-breakpoint-wide: 1599px;
    --layout-breakpoint-extra-wide: 1600px;
    --layout-format-square: 1/1;
    --layout-format-landscape: 16/9;
    --layout-format-portrait: 2/3;
    --layout-grid-gap: 1rem;
}
:root {
    --layout-format-square: 1/1;
    --layout-format-landscape: 16/9;
    --layout-format-portrait: 2/3;
    --layout-grid-gap: 1rem;
    --layout-margin-paragraph-regular: 1rem;
    --layout-margin-top-divider: 3rem;
    --layout-margin-bottom-divider: 4rem;
    --layout-margin-section: 6rem;
}
:root .theme-light {
    --color-page-background: var(--color-base-bluish-cool-gray-light);
    --color-editor-background: var(--color-base-opaque-soft-white);
    --color-editor-shadow:
        0 0 50px 1px rgba(0, 0, 0, 0.1), 0 1px 10px rgba(0, 0, 0, 0.1);
    --color-editor-font-regular: var(--color-base-transparent-black-opacity-90);
    --color-editor-font-soft: var(--color-base-transparent-black-opacity-50);
    --color-editor-font-soft-mobile: var(
        --color-base-transparent-black-opacity-60
    );
    --color-editor-font-light: var(--color-base-transparent-black-opacity-40);
    --color-editor-placeholder: var(--color-base-transparent-black-opacity-30);
    --color-editor-marker: #e6e7e8;
    --color-editor-stripe: var(--color-base-transparent-black-opacity-40);
    --color-editor-divider: var(--color-base-transparent-black-opacity-20);
    --color-editor-underline: var(--color-base-transparent-black-opacity-20);
    --color-editor-section-background: var(
        --color-base-transparent-black-opacity-04
    );
    --color-editor-aside-background: var(--color-base-opaque-soft-white);
    --color-editor-blockquote-background: var(
        --color-base-transparent-black-opacity-20
    );
    --color-editor-list-numbered-background: var(
        --color-base-transparent-black-opacity-10
    );
    --color-editor-medias-slider-navigation-element: var(
        --color-base-transparent-white-opacity-70
    );
    --color-editor-medias-slider-pagination-background: var(
        --color-base-transparent-black-opacity-30
    );
    --color-editor-medias-slider-pagination-bullet: var(
        --color-base-transparent-black-opacity-70
    );
    --color-editor-medias-slider-pagination-overprint-bullet: var(
        --color-base-opaque-pure-white
    );
    --color-editor-meta-tag-text: var(
        --color-base-transparent-black-opacity-40
    );
    --color-editor-meta-tag-background: var(
        --color-base-transparent-black-opacity-04
    );
    --color-editor-meta-tag-radius: 0.6rem;
    --color-collaboration-cursor-background: var(
        --color-base-transparent-white-opacity-10
    );
    --color-collaboration-cursor-text: var(
        --color-base-transparent-black-opacity-60
    );
}
:root .theme-dark {
    --color-page-background: var(--color-base-bluish-midnight-gray-dark);
    --color-editor-background: var(--color-base-opaque-dark-black);
    --color-editor-shadow:
        0 0 50px 1px rgba(0, 0, 0, 0.5), 0 1px 10px rgba(0, 0, 0, 0.1);
    --color-editor-font-regular: var(--color-base-transparent-white-opacity-80);
    --color-editor-font-soft: var(--color-base-transparent-white-opacity-50);
    --color-editor-font-soft-mobile: var(
        --color-base-transparent-white-opacity-50
    );
    --color-editor-font-light: var(--color-base-transparent-white-opacity-30);
    --color-editor-placeholder: var(--color-base-transparent-white-opacity-30);
    --color-editor-marker: #4a4f53;
    --color-editor-stripe: var(--color-base-transparent-white-opacity-40);
    --color-editor-divider: var(--color-base-transparent-white-opacity-20);
    --color-editor-underline: var(--color-base-transparent-white-opacity-20);
    --color-editor-section-background: var(
        --color-base-transparent-white-opacity-04
    );
    --color-editor-aside-background: var(--color-base-opaque-pure-black);
    --color-editor-blockquote-background: var(
        --color-base-transparent-white-opacity-20
    );
    --color-editor-list-numbered-background: var(
        --color-base-transparent-white-opacity-10
    );
    --color-editor-medias-slider-navigation-element: var(
        --color-base-transparent-white-opacity-70
    );
    --color-editor-medias-slider-pagination-background: var(
        --color-base-transparent-black-opacity-30
    );
    --color-editor-medias-slider-pagination-bullet: var(
        --color-base-transparent-white-opacity-70
    );
    --color-editor-medias-slider-pagination-overprint-bullet: var(
        --color-base-opaque-pure-white
    );
    --color-editor-meta-tag-text: var(
        --color-base-transparent-black-opacity-40
    );
    --color-editor-meta-tag-background: var(
        --color-base-transparent-white-opacity-04
    );
    --color-editor-meta-tag-radius: 0.6rem;
    --color-collaboration-cursor-background: var(
        --color-base-transparent-black-opacity-10
    );
    --color-collaboration-cursor-text: var(
        --color-base-transparent-white-opacity-60
    );
}
body,
#app {
    font-size: 1.6rem !important;
    line-height: 2.4rem !important;
}
.pt-28:has(.journal-editor) {
    padding-top: 0rem !important;
}
.pb-16:has(.journal-editor) {
    padding-bottom: 0rem !important;
}
.journal-editor .ProseMirror,
.ProseMirror {
    font-family: "roboto", Arial, Helvetica, sans-serif;
    /* Give a remote user a caret */
    /* Render the username above the caret */
}
.ProseMirror .collaboration-cursor__caret {
    border-left: 1px solid #0d0d0d;
    border-right: 1px solid #0d0d0d;
    margin-left: -1px;
    margin-right: -1px;
    pointer-events: none;
    position: relative;
    word-break: normal;
    border-color: var(--color-base-opaque-medium-gray) !important;
}
.ProseMirror .collaboration-cursor__label {
    height: 3rem;
    border-radius: 2rem 2rem 2rem 0;
    border-radius: 2rem;
    padding: 1rem 1.5rem 1rem 1rem;
    box-sizing: border-box;
    background-color: var(--color-collaboration-cursor-background) !important;
    background-color: rgba(0, 0, 0, 0.05) !important;
    color: var(--color-collaboration-cursor-text) !important;
    font-family: var(--font-sans);
    line-height: 0.8;
    color: #0d0d0d;
    font-size: var(--font-size-tiny);
    left: -2rem;
    position: absolute;
    top: -4rem;
    user-select: none;
    white-space: nowrap;
    backdrop-filter: blur(15px);
    padding-left: 5.5rem;
}
.ProseMirror .collaboration-cursor__label > img {
    position: absolute;
    top: -0.75rem;
    left: 0rem;
    height: 4.5rem;
    width: 4.5rem;
    pointer-events: none;
    background-color: #000000;
    border-radius: 50%;
    object-fit: cover;
    filter: grayscale(100%);
}
.tiptap.ProseMirror:focus-visible {
    outline: none;
}
.journal-editor,
.books-editor {
    container-type: inline-size;
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror {
        --content-width: 80cqw !important;
        --padding-left-right: 10cqw !important;
        width: calc(
            var(--content-width) + var(--padding-left-right) * 2
        ) !important;
    }
}
@container ((min-width: 491px) and (max-width: 977px)) {
    .tiptap.ProseMirror {
        --content-width: 70cqw !important;
        --padding-left-right: 15cqw !important;
        width: calc(
            var(--content-width) + var(--padding-left-right) * 2
        ) !important;
    }
}
@container ((min-width: 978px) and (max-width: 1599px)) {
    .tiptap.ProseMirror {
        --content-width: 60rem;
        --padding-left-right: calc(
            (100% - var(--content-width)) / 2
        ) !important;
        width: calc(
            var(--content-width) + var(--padding-left-right) * 2
        ) !important;
    }
}
@container ((min-width: 1600px)) {
    .tiptap.ProseMirror {
        --content-width: 80rem !important;
        --padding-left-right: calc(
            (100% - var(--content-width)) / 2
        ) !important;
        width: calc(
            var(--content-width) + var(--padding-left-right) * 2
        ) !important;
    }
}
.tiptap.ProseMirror {
    --padding-top: 7rem !important;
    --padding-bottom: 4rem !important;
}
.tiptap.ProseMirror,
.article {
    position: relative;
    margin: auto;
    margin-top: 0rem;
    --content-width: 60rem;
    --padding-left-right: calc((100% - var(--content-width)) / 2);
    --padding-top: 3rem;
    --padding-bottom: 4rem;
    width: calc(var(--content-width) + var(--padding-left-right) * 2);
    height: auto;
    /* padding: var(--padding-top) 0rem var(--padding-bottom) 0rem; */
    color: var(--color-editor-font-regular);
    background-color: var(--color-editor-background);
    /* Default Placeholder */
}
@media ((max-width: 490px)) {
    .tiptap.ProseMirror,
    .article {
        --content-width: 80vw;
        --padding-left-right: 10vw;
        width: calc(var(--content-width) + var(--padding-left-right) * 2);
    }
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror,
    .article {
        --content-width: 80cqw;
        --padding-left-right: 10cqw;
        width: calc(var(--content-width) + var(--padding-left-right) * 2);
    }
}
@media ((min-width: 491px) and (max-width: 977px)) {
    .tiptap.ProseMirror,
    .article {
        --content-width: 70vw;
        --padding-left-right: 15vw;
        width: calc(var(--content-width) + var(--padding-left-right) * 2);
    }
}
@container ((min-width: 491px) and (max-width: 977px)) {
    .tiptap.ProseMirror,
    .article {
        --content-width: 70cqw;
        --padding-left-right: 15cqw;
        width: calc(var(--content-width) + var(--padding-left-right) * 2);
    }
}
@media ((min-width: 1600px)) {
    .tiptap.ProseMirror,
    .article {
        --content-width: 80rem;
        --padding-left-right: calc((100% - var(--content-width)) / 2);
        width: calc(var(--content-width) + var(--padding-left-right) * 2);
    }
}
@container ((min-width: 1600px)) {
    .tiptap.ProseMirror,
    .article {
        --content-width: 80rem;
        --padding-left-right: calc((100% - var(--content-width)) / 2);
        width: calc(var(--content-width) + var(--padding-left-right) * 2);
    }
}
.tiptap.ProseMirror > *,
.article > * {
    margin: auto;
    width: var(--content-width);
}
.tiptap.ProseMirror .is-empty::before,
.article .is-empty::before {
    color: var(--color-editor-placeholder);
}
.tiptap.ProseMirror > p.is-editor-empty:first-child:last-child::before,
.article > p.is-editor-empty:first-child:last-child::before {
    content: "Write something or add a block";
}
.tiptap.ProseMirror [data-placeholder][data-suggestion]::before,
.article [data-placeholder][data-suggestion]::before,
.tiptap.ProseMirror [data-placeholder][data-suggestion] *::before,
.article [data-placeholder][data-suggestion] *::before {
    content: none !important;
}
.tiptap.ProseMirror > p.is-empty.has-focus:before,
.article > p.is-empty.has-focus:before {
    content: "Simple paragraph";
}
.tiptap.ProseMirror p,
.article p {
    font-family: "roboto";
    font-weight: 400;
    font-size: var(--font-size-regular-plus);
    line-height: 1.5;
    text-align: left;
    margin-top: var(--layout-margin-paragraph-regular);
    margin-bottom: var(--layout-margin-paragraph-regular);
    color: var(--color-editor-font-soft);
}
@media ((max-width: 490px)) {
    .tiptap.ProseMirror p,
    .article p {
        color: var(--color-editor-font-soft-mobile);
    }
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror p,
    .article p {
        color: var(--color-editor-font-soft-mobile);
    }
}
.tiptap.ProseMirror p:has(+ h3),
.article p:has(+ h3) {
    margin-bottom: 3rem;
}
.tiptap.ProseMirror h1,
.article h1 {
    font-family: "roboto";
    font-weight: 600;
    font-size: var(--font-size-huge-plus);
    -webkit-font-smoothing: antialiased;
    line-height: 1.1;
    text-align: left;
    margin-bottom: 2rem;
}
.tiptap.ProseMirror h1.is-empty::before,
.article h1.is-empty::before {
    content: "Headline";
}
.tiptap.ProseMirror h1:has(+ p.subtitle),
.article h1:has(+ p.subtitle) {
    margin-bottom: 0;
}
.tiptap.ProseMirror p.subtitle,
.article p.subtitle,
.tiptap.ProseMirror p[data-type="subtitle"],
.article p[data-type="subtitle"] {
    font-family: "roboto";
    font-weight: 400;
    font-size: var(--font-size-medium);
    -webkit-font-smoothing: antialiased;
    text-align: left;
    line-height: 1.4;
    margin-top: 0.25rem;
    margin-bottom: 2rem;
    color: var(--color-editor-font-light);
}
.tiptap.ProseMirror p.subtitle.is-empty::before,
.article p.subtitle.is-empty::before,
.tiptap.ProseMirror p[data-type="subtitle"].is-empty::before,
.article p[data-type="subtitle"].is-empty::before {
    content: "Subtitle";
}
.tiptap.ProseMirror h2 + p.subtitle,
.article h2 + p.subtitle {
    text-align: left;
    margin-top: 0;
}
.tiptap.ProseMirror p.lead,
.article p.lead,
.tiptap.ProseMirror p[data-type="lead"],
.article p[data-type="lead"] {
    font-family: "roboto";
    font-weight: 500;
    font-size: var(--font-size-medium);
    -webkit-font-smoothing: antialiased;
    text-align: left;
    line-height: 1.4;
    margin-top: 2rem;
    margin-bottom: 2rem;
    color: var(--color-editor-font-soft);
}
.tiptap.ProseMirror p.lead.is-empty::before,
.article p.lead.is-empty::before,
.tiptap.ProseMirror p[data-type="lead"].is-empty::before,
.article p[data-type="lead"].is-empty::before {
    content: "Write a lead";
}
.tiptap.ProseMirror h2,
.article h2 {
    font-family: "roboto";
    font-weight: 600;
    font-size: var(--font-size-large);
    -webkit-font-smoothing: antialiased;
    margin-top: 6rem;
    margin-bottom: 1rem;
    line-height: 1.35;
}
.tiptap.ProseMirror h2.is-empty::before,
.article h2.is-empty::before {
    content: "Crosshead";
}
.tiptap.ProseMirror h3,
.article h3 {
    font-family: "roboto";
    font-weight: 500;
    font-size: var(--font-size-medium);
    -webkit-font-smoothing: antialiased;
    margin-top: 3rem;
    margin-bottom: 1rem;
}
.tiptap.ProseMirror h3.is-empty::before,
.article h3.is-empty::before {
    content: "Minor heading";
}
.tiptap.ProseMirror p.highlight,
.article p.highlight,
.tiptap.ProseMirror p.highlighted-paragraph,
.article p.highlighted-paragraph,
.tiptap.ProseMirror p[data-type="highlighted-paragraph"],
.article p[data-type="highlighted-paragraph"] {
    font-family: "roboto";
    font-weight: 600;
    color: var(--color-editor-font-regular);
}
.tiptap.ProseMirror blockquote:not(figure blockquote),
.article blockquote:not(figure blockquote) {
    box-sizing: border-box;
    border: none;
    padding: 3rem;
    margin: 3rem auto;
    background-color: var(--color-editor-blockquote-background);
}
.tiptap.ProseMirror blockquote:not(figure blockquote) p,
.article blockquote:not(figure blockquote) p {
    color: var(--color-editor-font-regular);
    font-family: "roboto";
    font-weight: 400;
}
.tiptap.ProseMirror figure div > blockquote,
.article figure div > blockquote {
    background-color: none;
    padding: 0;
    margin: 0;
    border-left: 0;
    padding-left: 0;
}
.tiptap.ProseMirror figure div > blockquote.is-empty p::before,
.article figure div > blockquote.is-empty p::before {
    content: "Quote";
    font-family: "roboto";
    font-weight: 600;
    font-size: var(--font-size-medium-plus) !important;
    -webkit-font-smoothing: antialiased !important;
}
.tiptap.ProseMirror figure div > blockquote p,
.article figure div > blockquote p {
    width: calc(var(--content-width) - 16rem);
    margin: auto;
    font-family: "roboto";
    font-weight: 600;
    font-size: var(--font-size-medium-plus) !important;
    -webkit-font-smoothing: antialiased !important;
    text-align: center !important;
    line-height: 1.4;
}
@media ((max-width: 490px)) {
    .tiptap.ProseMirror figure div > blockquote p,
    .article figure div > blockquote p {
        width: 80%;
    }
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror figure div > blockquote p,
    .article figure div > blockquote p {
        width: 80cqw;
    }
}
.tiptap.ProseMirror figure div cite,
.article figure div cite,
.tiptap.ProseMirror figure div figcaption,
.article figure div figcaption {
    display: block;
    font-family: "roboto";
    font-weight: 400;
    font-size: var(--font-size-small);
    text-align: center !important;
    line-height: 1.4;
    margin-top: 1rem;
    color: var(--color-editor-font-light);
}
.tiptap.ProseMirror figure div cite.is-empty::before,
.article figure div cite.is-empty::before,
.tiptap.ProseMirror figure div figcaption.is-empty::before,
.article figure div figcaption.is-empty::before {
    content: "— Author";
    text-align: center !important;
    font-size: var(--font-size-small);
}
.tiptap.ProseMirror figure div cite:empty::before,
.article figure div cite:empty::before,
.tiptap.ProseMirror figure div figcaption:empty::before,
.article figure div figcaption:empty::before {
    content: "";
}
.tiptap.ProseMirror figure div cite:has(em:empty)::before,
.article figure div cite:has(em:empty)::before,
.tiptap.ProseMirror figure div figcaption:has(em:empty)::before,
.article figure div figcaption:has(em:empty)::before {
    content: "";
}
.tiptap.ProseMirror figure div cite:before,
.article figure div cite:before,
.tiptap.ProseMirror figure div figcaption:before,
.article figure div figcaption:before {
    content: "— ";
}
.tiptap.ProseMirror :not(section) + figure,
.article :not(section) + figure {
    margin: 8rem auto;
}
.tiptap.ProseMirror ul li,
.article ul li {
    list-style-type: none;
    position: relative;
    padding-left: 2rem;
}
.tiptap.ProseMirror ul li:before,
.article ul li:before {
    content: "→";
    /* Icône personnalisée */
    position: absolute;
    left: 0;
    top: 0.7rem;
}
.tiptap.ProseMirror ul li p,
.article ul li p {
    display: inline;
    margin-top: 0;
    margin-bottom: 0;
}
.tiptap.ProseMirror ul li p.is-empty::before,
.article ul li p.is-empty::before {
    content: "Add item or press enter to finish list";
}
.tiptap.ProseMirror ol,
.article ol {
    padding: 0;
}
.tiptap.ProseMirror ol li,
.article ol li {
    counter-increment: list-counter;
    /* Incrémente le compteur */
    list-style-type: none;
    position: relative;
    padding-left: 0rem;
    margin-left: 0;
}
.tiptap.ProseMirror ol li::before,
.article ol li::before {
    content: counter(list-counter);
    /* Ajoute le numéro */
    background-color: var(--color-editor-list-numbered-background);
    color: var(--color-editor-font-soft);
    width: 2rem;
    height: 2rem;
    font-family: "roboto";
    font-weight: 500;
    font-size: var(--font-size-pico);
    display: block;
    text-align: center;
    line-height: 0.25;
    border-radius: 50%;
    position: absolute;
    left: -3rem;
    top: 0.5rem;
    padding: 1rem 1rem 0rem 0.75rem;
    box-sizing: border-box;
}
.tiptap.ProseMirror ol li p.is-empty::before,
.article ol li p.is-empty::before {
    content: "Add item or press enter to finish list";
}
.tiptap.ProseMirror a,
.article a {
    color: var(--color-base-vibrant-royal-blue-light);
    cursor: pointer;
}
.tiptap.ProseMirror strong,
.article strong {
    font-weight: 500;
    color: var(--color-editor-font-regular);
}
.tiptap.ProseMirror sup,
.article sup {
    position: relative;
    top: -0.5rem;
    font-size: smaller;
    vertical-align: baseline;
}
.tiptap.ProseMirror sub,
.article sub {
    position: relative;
    bottom: -0.15rem;
    font-size: smaller;
    vertical-align: baseline;
}
.tiptap.ProseMirror mark,
.article mark {
    background-color: var(--color-editor-marker);
    padding: 0 0.3em;
    clip-path: polygon(4px 0%, 100% 0%, calc(100% - 4px) 100%, 0% 100%);
    display: inline-block;
}
.tiptap.ProseMirror em,
.article em {
    font-style: italic;
}
.tiptap.ProseMirror s,
.article s {
    text-decoration: line-through;
    text-decoration-color: var(--color-editor-stripe);
    text-decoration-thickness: 1px;
    text-decoration-style: solid;
}
.tiptap.ProseMirror u,
.article u {
    text-decoration: none;
    position: relative;
}
.tiptap.ProseMirror u::after,
.article u::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: var(--color-editor-underline);
}
.tiptap.ProseMirror section,
.article section {
    width: 100%;
    background-color: var(--color-editor-section-background);
    padding: var(--layout-margin-section) 0;
    margin-top: var(--layout-margin-section);
    margin-bottom: var(--layout-margin-section);
}
.tiptap.ProseMirror section > *,
.article section > * {
    margin-left: auto;
    margin-right: auto;
    width: var(--content-width);
}
.tiptap.ProseMirror section > h2,
.article section > h2 {
    margin-top: 0;
}
.tiptap.ProseMirror section > h3,
.article section > h3 {
    margin-top: 0;
}
.tiptap.ProseMirror section .media-width-full:last-child,
.article section .media-width-full:last-child,
.tiptap.ProseMirror section .width-full:last-child,
.article section .width-full:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
}
.tiptap.ProseMirror section:has(> .media-width-full:last-child),
.article section:has(> .media-width-full:last-child),
.tiptap.ProseMirror section:has(> .width-full:last-child),
.article section:has(> .width-full:last-child) {
    padding-bottom: 0;
}
.tiptap.ProseMirror .media-width-full:has(+ section),
.article .media-width-full:has(+ section),
.tiptap.ProseMirror .width-full:has(+ section),
.article .width-full:has(+ section) {
    margin-bottom: 0;
}
.tiptap.ProseMirror .media-width-full + section,
.article .media-width-full + section,
.tiptap.ProseMirror .width-full + section,
.article .width-full + section {
    margin-top: 0;
}
.tiptap.ProseMirror aside,
.article aside {
    z-index: 10000;
    float: right;
    margin-left: 3rem;
    margin-bottom: 3rem;
    position: relative;
    right: -3rem;
    top: 0rem;
    width: calc(var(--content-width) / 2.5);
    overflow: hidden;
    padding: 3rem 0;
    background-color: var(--color-editor-aside-background);
    box-shadow:
        0 0 50px 1px rgba(0, 0, 0, 0.1),
        0 1px 10px rgba(0, 0, 0, 0.05);
    border-radius: 1rem;
    box-sizing: border-box;
}
.tiptap.ProseMirror aside > *,
.article aside > * {
    margin: auto;
    margin-top: 0 !important;
    width: calc((var(--content-width) / 2.5) - 6rem);
}
.tiptap.ProseMirror aside .media,
.article aside .media {
    height: 20rem;
    margin: 1rem auto;
}
.tiptap.ProseMirror aside p,
.article aside p {
    text-align: left;
    font-size: var(--font-size-tiny);
}
.tiptap.ProseMirror aside ul,
.article aside ul {
    line-height: 2;
}
@media ((max-width: 490px)) {
    .tiptap.ProseMirror aside,
    .article aside {
        float: none;
        margin: 3rem auto;
        position: static;
        width: var(--content-width);
        box-shadow: none;
    }
    .tiptap.ProseMirror aside > *,
    .article aside > * {
        width: calc((var(--content-width)) - 6rem);
    }
    .tiptap.ProseMirror aside p,
    .article aside p {
        font-size: var(--font-size-regular);
    }
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror aside,
    .article aside {
        float: none;
        margin: 3rem auto;
        position: static;
        width: var(--content-width);
        box-shadow: none;
    }
    .tiptap.ProseMirror aside > *,
    .article aside > * {
        width: calc((var(--content-width)) - 6rem);
    }
    .tiptap.ProseMirror aside p,
    .article aside p {
        font-size: var(--font-size-regular);
    }
}
.tiptap.ProseMirror aside + .media swiper-container,
.article aside + .media swiper-container {
    position: absolute;
}
.tiptap.ProseMirror hr,
.article hr {
    border: none;
    border-top: 1px solid var(--color-editor-divider);
    margin-top: var(--layout-margin-top-divider);
    margin-bottom: var(--layout-margin-bottom-divider);
    margin-left: var(--padding-left-right);
    width: 4rem;
}
.tiptap.ProseMirror .media,
.article .media,
.tiptap.ProseMirror div[data-type="media"],
.article div[data-type="media"] {
    position: relative;
    height: var(--layout-media-height);
    width: var(--layout-media-width);
    margin: 4rem auto;
}
.tiptap.ProseMirror .media img,
.article .media img,
.tiptap.ProseMirror div[data-type="media"] img,
.article div[data-type="media"] img {
    display: block;
}
.tiptap.ProseMirror .media .swiper-wrapper,
.article .media .swiper-wrapper,
.tiptap.ProseMirror div[data-type="media"] .swiper-wrapper,
.article div[data-type="media"] .swiper-wrapper {
    position: relative;
}
.tiptap.ProseMirror .media.media-width-fit,
.article .media.media-width-fit,
.tiptap.ProseMirror div[data-type="media"].media-width-fit,
.article div[data-type="media"].media-width-fit,
.tiptap.ProseMirror .media.width-fit,
.article .media.width-fit,
.tiptap.ProseMirror div[data-type="media"].width-fit,
.article div[data-type="media"].width-fit {
    --layout-media-width: var(--content-width);
}
@media ((max-width: 490px)) {
    .tiptap.ProseMirror .media.media-width-fit.type-slider,
    .article .media.media-width-fit.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-width-fit.type-slider,
    .article div[data-type="media"].media-width-fit.type-slider,
    .tiptap.ProseMirror .media.width-fit.type-slider,
    .article .media.width-fit.type-slider,
    .tiptap.ProseMirror div[data-type="media"].width-fit.type-slider,
    .article div[data-type="media"].width-fit.type-slider {
        --layout-media-width: 100%;
    }
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror .media.media-width-fit.type-slider,
    .article .media.media-width-fit.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-width-fit.type-slider,
    .article div[data-type="media"].media-width-fit.type-slider,
    .tiptap.ProseMirror .media.width-fit.type-slider,
    .article .media.width-fit.type-slider,
    .tiptap.ProseMirror div[data-type="media"].width-fit.type-slider,
    .article div[data-type="media"].width-fit.type-slider {
        --layout-media-width: 100cqw;
    }
}
.tiptap.ProseMirror .media.media-width-extend,
.article .media.media-width-extend,
.tiptap.ProseMirror div[data-type="media"].media-width-extend,
.article div[data-type="media"].media-width-extend,
.tiptap.ProseMirror .media.width-extend,
.article .media.width-extend,
.tiptap.ProseMirror div[data-type="media"].width-extend,
.article div[data-type="media"].width-extend {
    --layout-media-width: calc(var(--content-width) * 1.1);
}
@media ((max-width: 490px)) {
    .tiptap.ProseMirror .media.media-width-extend.type-slider,
    .article .media.media-width-extend.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-width-extend.type-slider,
    .article div[data-type="media"].media-width-extend.type-slider,
    .tiptap.ProseMirror .media.width-extend.type-slider,
    .article .media.width-extend.type-slider,
    .tiptap.ProseMirror div[data-type="media"].width-extend.type-slider,
    .article div[data-type="media"].width-extend.type-slider {
        --layout-media-width: 100%;
    }
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror .media.media-width-extend.type-slider,
    .article .media.media-width-extend.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-width-extend.type-slider,
    .article div[data-type="media"].media-width-extend.type-slider,
    .tiptap.ProseMirror .media.width-extend.type-slider,
    .article .media.width-extend.type-slider,
    .tiptap.ProseMirror div[data-type="media"].width-extend.type-slider,
    .article div[data-type="media"].width-extend.type-slider {
        --layout-media-width: 100cqw;
    }
}
.tiptap.ProseMirror
    .media.media-width-full
    .tiptap.ProseMirror
    .media.width-full,
.tiptap.ProseMirror .media.media-width-full .article .media.width-full,
.tiptap.ProseMirror
    .media.media-width-full
    .tiptap.ProseMirror
    div[data-type="media"].width-full,
.tiptap.ProseMirror
    .media.media-width-full
    .article
    div[data-type="media"].width-full,
.article .media.media-width-full .tiptap.ProseMirror .media.width-full,
.article .media.media-width-full .article .media.width-full,
.article
    .media.media-width-full
    .tiptap.ProseMirror
    div[data-type="media"].width-full,
.article .media.media-width-full .article div[data-type="media"].width-full,
.tiptap.ProseMirror
    div[data-type="media"].media-width-full
    .tiptap.ProseMirror
    .media.width-full,
.tiptap.ProseMirror
    div[data-type="media"].media-width-full
    .article
    .media.width-full,
.tiptap.ProseMirror
    div[data-type="media"].media-width-full
    .tiptap.ProseMirror
    div[data-type="media"].width-full,
.tiptap.ProseMirror
    div[data-type="media"].media-width-full
    .article
    div[data-type="media"].width-full,
.article
    div[data-type="media"].media-width-full
    .tiptap.ProseMirror
    .media.width-full,
.article div[data-type="media"].media-width-full .article .media.width-full,
.article
    div[data-type="media"].media-width-full
    .tiptap.ProseMirror
    div[data-type="media"].width-full,
.article
    div[data-type="media"].media-width-full
    .article
    div[data-type="media"].width-full {
    --layout-media-width: calc(
        var(--content-width) + var(--padding-left-right) * 2
    );
}
@container ((min-width: 1600px)) {
}
.tiptap.ProseMirror .media.media-height-full,
.article .media.media-height-full,
.tiptap.ProseMirror div[data-type="media"].media-height-full,
.article div[data-type="media"].media-height-full,
.tiptap.ProseMirror .media.height-full,
.article .media.height-full,
.tiptap.ProseMirror div[data-type="media"].height-full,
.article div[data-type="media"].height-full {
    --layout-media-height: auto;
}
.tiptap.ProseMirror
    .media.media-height-full.type-image
    .swiper-wrapper
    .swiper-slide
    img,
.article .media.media-height-full.type-image .swiper-wrapper .swiper-slide img,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-image
    .swiper-wrapper
    .swiper-slide
    img,
.article
    div[data-type="media"].media-height-full.type-image
    .swiper-wrapper
    .swiper-slide
    img,
.tiptap.ProseMirror
    .media.height-full.type-image
    .swiper-wrapper
    .swiper-slide
    img,
.article .media.height-full.type-image .swiper-wrapper .swiper-slide img,
.tiptap.ProseMirror
    div[data-type="media"].height-full.type-image
    .swiper-wrapper
    .swiper-slide
    img,
.article
    div[data-type="media"].height-full.type-image
    .swiper-wrapper
    .swiper-slide
    img {
    width: 100%;
}
.tiptap.ProseMirror
    .media.media-height-full.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide,
.article
    .media.media-height-full.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide,
.article
    div[data-type="media"].media-height-full.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide,
.tiptap.ProseMirror
    .media.height-full.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide,
.article .media.height-full.type-slider .swiper .swiper-wrapper .swiper-slide,
.tiptap.ProseMirror
    div[data-type="media"].height-full.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide,
.article
    div[data-type="media"].height-full.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide {
    height: auto;
}
.tiptap.ProseMirror .media.media-height-full.type-carousel,
.article .media.media-height-full.type-carousel,
.tiptap.ProseMirror div[data-type="media"].media-height-full.type-carousel,
.article div[data-type="media"].media-height-full.type-carousel,
.tiptap.ProseMirror .media.height-full.type-carousel,
.article .media.height-full.type-carousel,
.tiptap.ProseMirror div[data-type="media"].height-full.type-carousel,
.article div[data-type="media"].height-full.type-carousel {
    --layout-media-height: 40rem;
}
.tiptap.ProseMirror .media.media-height-full.type-carousel .swiper,
.article .media.media-height-full.type-carousel .swiper,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-carousel
    .swiper,
.article div[data-type="media"].media-height-full.type-carousel .swiper,
.tiptap.ProseMirror .media.height-full.type-carousel .swiper,
.article .media.height-full.type-carousel .swiper,
.tiptap.ProseMirror div[data-type="media"].height-full.type-carousel .swiper,
.article div[data-type="media"].height-full.type-carousel .swiper {
    height: 100%;
}
.tiptap.ProseMirror
    .media.media-height-full.type-carousel
    .swiper
    .swiper-slide,
.article .media.media-height-full.type-carousel .swiper .swiper-slide,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-carousel
    .swiper
    .swiper-slide,
.article
    div[data-type="media"].media-height-full.type-carousel
    .swiper
    .swiper-slide,
.tiptap.ProseMirror .media.height-full.type-carousel .swiper .swiper-slide,
.article .media.height-full.type-carousel .swiper .swiper-slide,
.tiptap.ProseMirror
    div[data-type="media"].height-full.type-carousel
    .swiper
    .swiper-slide,
.article
    div[data-type="media"].height-full.type-carousel
    .swiper
    .swiper-slide {
    height: 100%;
    width: auto;
    margin-right: calc(var(--layout-grid-gap) / 2);
    margin-left: calc(var(--layout-grid-gap) / 2);
    box-sizing: border-box;
}
.tiptap.ProseMirror
    .media.media-height-full.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.article
    .media.media-height-full.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.article
    div[data-type="media"].media-height-full.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.tiptap.ProseMirror
    .media.height-full.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.article
    .media.height-full.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.tiptap.ProseMirror
    div[data-type="media"].height-full.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.article
    div[data-type="media"].height-full.type-carousel
    .swiper
    .swiper-slide
    img.object-cover {
    height: 100%;
    width: auto;
}
.tiptap.ProseMirror .media.media-height-fixed,
.article .media.media-height-fixed,
.tiptap.ProseMirror div[data-type="media"].media-height-fixed,
.article div[data-type="media"].media-height-fixed,
.tiptap.ProseMirror .media.height-fixed,
.article .media.height-fixed,
.tiptap.ProseMirror div[data-type="media"].height-fixed,
.article div[data-type="media"].height-fixed {
    --layout-media-height: 20rem;
}
.tiptap.ProseMirror .media.media-height-fixed.type-carousel,
.article .media.media-height-fixed.type-carousel,
.tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-carousel,
.article div[data-type="media"].media-height-fixed.type-carousel,
.tiptap.ProseMirror .media.height-fixed.type-carousel,
.article .media.height-fixed.type-carousel,
.tiptap.ProseMirror div[data-type="media"].height-fixed.type-carousel,
.article div[data-type="media"].height-fixed.type-carousel {
    --layout-media-height: 40rem;
}
@media ((max-width: 490px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-carousel,
    .article .media.media-height-fixed.type-carousel,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-carousel,
    .article div[data-type="media"].media-height-fixed.type-carousel,
    .tiptap.ProseMirror .media.height-fixed.type-carousel,
    .article .media.height-fixed.type-carousel,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-carousel,
    .article div[data-type="media"].height-fixed.type-carousel {
        --layout-media-height: 50vw;
    }
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-carousel,
    .article .media.media-height-fixed.type-carousel,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-carousel,
    .article div[data-type="media"].media-height-fixed.type-carousel,
    .tiptap.ProseMirror .media.height-fixed.type-carousel,
    .article .media.height-fixed.type-carousel,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-carousel,
    .article div[data-type="media"].height-fixed.type-carousel {
        --layout-media-height: 50cqw;
    }
}
.tiptap.ProseMirror
    .media.media-height-fixed.type-carousel
    .swiper
    .swiper-slide,
.article .media.media-height-fixed.type-carousel .swiper .swiper-slide,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-carousel
    .swiper
    .swiper-slide,
.article
    div[data-type="media"].media-height-fixed.type-carousel
    .swiper
    .swiper-slide,
.tiptap.ProseMirror .media.height-fixed.type-carousel .swiper .swiper-slide,
.article .media.height-fixed.type-carousel .swiper .swiper-slide,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-carousel
    .swiper
    .swiper-slide,
.article
    div[data-type="media"].height-fixed.type-carousel
    .swiper
    .swiper-slide {
    margin-right: calc(var(--layout-grid-gap) / 2);
    margin-left: calc(var(--layout-grid-gap) / 2);
    box-sizing: border-box;
    height: var(--layout-media-height);
    width: calc(var(--layout-media-height) * var(--layout-format-square));
}
.tiptap.ProseMirror
    .media.media-height-fixed.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.article
    .media.media-height-fixed.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.article
    div[data-type="media"].media-height-fixed.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.tiptap.ProseMirror
    .media.height-fixed.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.article
    .media.height-fixed.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-carousel
    .swiper
    .swiper-slide
    img.object-cover,
.article
    div[data-type="media"].height-fixed.type-carousel
    .swiper
    .swiper-slide
    img.object-cover {
    width: calc(var(--layout-media-height) * var(--layout-format-square));
    height: var(--layout-media-height);
    object-fit: cover;
}
.tiptap.ProseMirror .media.media-height-fixed.type-slider,
.article .media.media-height-fixed.type-slider,
.tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-slider,
.article div[data-type="media"].media-height-fixed.type-slider,
.tiptap.ProseMirror .media.height-fixed.type-slider,
.article .media.height-fixed.type-slider,
.tiptap.ProseMirror div[data-type="media"].height-fixed.type-slider,
.article div[data-type="media"].height-fixed.type-slider {
    --layout-media-height: 70rem;
}
@media ((max-width: 490px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-slider,
    .article .media.media-height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-slider,
    .article div[data-type="media"].media-height-fixed.type-slider,
    .tiptap.ProseMirror .media.height-fixed.type-slider,
    .article .media.height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-slider,
    .article div[data-type="media"].height-fixed.type-slider {
        --layout-media-height: 40rem;
    }
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-slider,
    .article .media.media-height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-slider,
    .article div[data-type="media"].media-height-fixed.type-slider,
    .tiptap.ProseMirror .media.height-fixed.type-slider,
    .article .media.height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-slider,
    .article div[data-type="media"].height-fixed.type-slider {
        --layout-media-height: 40rem;
    }
}
@media ((min-width: 491px) and (max-width: 977px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-slider,
    .article .media.media-height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-slider,
    .article div[data-type="media"].media-height-fixed.type-slider,
    .tiptap.ProseMirror .media.height-fixed.type-slider,
    .article .media.height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-slider,
    .article div[data-type="media"].height-fixed.type-slider {
        --layout-media-height: 60rem;
    }
}
@container ((min-width: 491px) and (max-width: 977px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-slider,
    .article .media.media-height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-slider,
    .article div[data-type="media"].media-height-fixed.type-slider,
    .tiptap.ProseMirror .media.height-fixed.type-slider,
    .article .media.height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-slider,
    .article div[data-type="media"].height-fixed.type-slider {
        --layout-media-height: 60rem;
    }
}
@media ((min-width: 978px) and (max-width: 1599px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-slider,
    .article .media.media-height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-slider,
    .article div[data-type="media"].media-height-fixed.type-slider,
    .tiptap.ProseMirror .media.height-fixed.type-slider,
    .article .media.height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-slider,
    .article div[data-type="media"].height-fixed.type-slider {
        --layout-media-height: 70rem;
    }
}
@container ((min-width: 978px) and (max-width: 1599px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-slider,
    .article .media.media-height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-slider,
    .article div[data-type="media"].media-height-fixed.type-slider,
    .tiptap.ProseMirror .media.height-fixed.type-slider,
    .article .media.height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-slider,
    .article div[data-type="media"].height-fixed.type-slider {
        --layout-media-height: 70rem;
    }
}
@media ((min-width: 1600px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-slider,
    .article .media.media-height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-slider,
    .article div[data-type="media"].media-height-fixed.type-slider,
    .tiptap.ProseMirror .media.height-fixed.type-slider,
    .article .media.height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-slider,
    .article div[data-type="media"].height-fixed.type-slider {
        --layout-media-height: 90rem;
    }
}
@container ((min-width: 1600px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-slider,
    .article .media.media-height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-slider,
    .article div[data-type="media"].media-height-fixed.type-slider,
    .tiptap.ProseMirror .media.height-fixed.type-slider,
    .article .media.height-fixed.type-slider,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-slider,
    .article div[data-type="media"].height-fixed.type-slider {
        --layout-media-height: 90rem;
    }
}
.tiptap.ProseMirror .media.media-height-fixed.type-slider .swiper,
.article .media.media-height-fixed.type-slider .swiper,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-slider
    .swiper,
.article div[data-type="media"].media-height-fixed.type-slider .swiper,
.tiptap.ProseMirror .media.height-fixed.type-slider .swiper,
.article .media.height-fixed.type-slider .swiper,
.tiptap.ProseMirror div[data-type="media"].height-fixed.type-slider .swiper,
.article div[data-type="media"].height-fixed.type-slider .swiper {
    height: 100%;
}
.tiptap.ProseMirror
    .media.media-height-fixed.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.article
    .media.media-height-fixed.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.article
    div[data-type="media"].media-height-fixed.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.tiptap.ProseMirror
    .media.height-fixed.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.article
    .media.height-fixed.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.article
    div[data-type="media"].height-fixed.type-slider
    .swiper
    .swiper-wrapper
    .swiper-slide
    img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.tiptap.ProseMirror .media.media-height-fixed.type-image,
.article .media.media-height-fixed.type-image,
.tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-image,
.article div[data-type="media"].media-height-fixed.type-image,
.tiptap.ProseMirror .media.height-fixed.type-image,
.article .media.height-fixed.type-image,
.tiptap.ProseMirror div[data-type="media"].height-fixed.type-image,
.article div[data-type="media"].height-fixed.type-image {
    --layout-media-height: 50rem;
}
@media ((min-width: 978px) and (max-width: 1599px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-image,
    .article .media.media-height-fixed.type-image,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-image,
    .article div[data-type="media"].media-height-fixed.type-image,
    .tiptap.ProseMirror .media.height-fixed.type-image,
    .article .media.height-fixed.type-image,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-image,
    .article div[data-type="media"].height-fixed.type-image {
        --layout-media-height: 60rem;
    }
}
@container ((min-width: 978px) and (max-width: 1599px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-image,
    .article .media.media-height-fixed.type-image,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-image,
    .article div[data-type="media"].media-height-fixed.type-image,
    .tiptap.ProseMirror .media.height-fixed.type-image,
    .article .media.height-fixed.type-image,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-image,
    .article div[data-type="media"].height-fixed.type-image {
        --layout-media-height: 60rem;
    }
}
@media ((min-width: 1600px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-image,
    .article .media.media-height-fixed.type-image,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-image,
    .article div[data-type="media"].media-height-fixed.type-image,
    .tiptap.ProseMirror .media.height-fixed.type-image,
    .article .media.height-fixed.type-image,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-image,
    .article div[data-type="media"].height-fixed.type-image {
        --layout-media-height: 80rem;
    }
}
@container ((min-width: 1600px)) {
    .tiptap.ProseMirror .media.media-height-fixed.type-image,
    .article .media.media-height-fixed.type-image,
    .tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-image,
    .article div[data-type="media"].media-height-fixed.type-image,
    .tiptap.ProseMirror .media.height-fixed.type-image,
    .article .media.height-fixed.type-image,
    .tiptap.ProseMirror div[data-type="media"].height-fixed.type-image,
    .article div[data-type="media"].height-fixed.type-image {
        --layout-media-height: 80rem;
    }
}
.tiptap.ProseMirror .media.media-height-fixed.type-image .swiper,
.article .media.media-height-fixed.type-image .swiper,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-image
    .swiper,
.article div[data-type="media"].media-height-fixed.type-image .swiper,
.tiptap.ProseMirror .media.height-fixed.type-image .swiper,
.article .media.height-fixed.type-image .swiper,
.tiptap.ProseMirror div[data-type="media"].height-fixed.type-image .swiper,
.article div[data-type="media"].height-fixed.type-image .swiper {
    height: 100%;
}
.tiptap.ProseMirror
    .media.media-height-fixed.type-image
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.article
    .media.media-height-fixed.type-image
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-image
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.article
    div[data-type="media"].media-height-fixed.type-image
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.tiptap.ProseMirror
    .media.height-fixed.type-image
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.article
    .media.height-fixed.type-image
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-image
    .swiper
    .swiper-wrapper
    .swiper-slide
    img,
.article
    div[data-type="media"].height-fixed.type-image
    .swiper
    .swiper-wrapper
    .swiper-slide
    img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.tiptap.ProseMirror .media.media-height-fixed.type-video,
.article .media.media-height-fixed.type-video,
.tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-video,
.article div[data-type="media"].media-height-fixed.type-video,
.tiptap.ProseMirror .media.height-fixed.type-video,
.article .media.height-fixed.type-video,
.tiptap.ProseMirror div[data-type="media"].height-fixed.type-video,
.article div[data-type="media"].height-fixed.type-video {
    height: 100%;
}
.tiptap.ProseMirror .media.media-height-fixed.type-image-grid,
.article .media.media-height-fixed.type-image-grid,
.tiptap.ProseMirror div[data-type="media"].media-height-fixed.type-image-grid,
.article div[data-type="media"].media-height-fixed.type-image-grid,
.tiptap.ProseMirror .media.media-height-full.type-image-grid,
.article .media.media-height-full.type-image-grid,
.tiptap.ProseMirror div[data-type="media"].media-height-full.type-image-grid,
.article div[data-type="media"].media-height-full.type-image-grid,
.tiptap.ProseMirror .media.height-fixed.type-image-grid,
.article .media.height-fixed.type-image-grid,
.tiptap.ProseMirror div[data-type="media"].height-fixed.type-image-grid,
.article div[data-type="media"].height-fixed.type-image-grid,
.tiptap.ProseMirror .media.height-full.type-image-grid,
.article .media.height-full.type-image-grid,
.tiptap.ProseMirror div[data-type="media"].height-full.type-image-grid,
.article div[data-type="media"].height-full.type-image-grid {
    --layout-swiper-grid-gap: var(--layout-grid-gap);
    --layout-media-height: calc(
        var(--layout-media-width) / var(--layout-swiper-grid-x) /
            (var(--layout-swiper-grid-item-format)) *
            var(--layout-swiper-grid-y) + (var(--layout-swiper-grid-y) - 1) *
            var(--layout-swiper-grid-gap)
    );
}
.tiptap.ProseMirror .media.media-height-fixed.type-image-grid.grid-1-1,
.article .media.media-height-fixed.type-image-grid.grid-1-1,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-image-grid.grid-1-1,
.article div[data-type="media"].media-height-fixed.type-image-grid.grid-1-1,
.tiptap.ProseMirror .media.media-height-full.type-image-grid.grid-1-1,
.article .media.media-height-full.type-image-grid.grid-1-1,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-image-grid.grid-1-1,
.article div[data-type="media"].media-height-full.type-image-grid.grid-1-1,
.tiptap.ProseMirror .media.height-fixed.type-image-grid.grid-1-1,
.article .media.height-fixed.type-image-grid.grid-1-1,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-image-grid.grid-1-1,
.article div[data-type="media"].height-fixed.type-image-grid.grid-1-1,
.tiptap.ProseMirror .media.height-full.type-image-grid.grid-1-1,
.article .media.height-full.type-image-grid.grid-1-1,
.tiptap.ProseMirror div[data-type="media"].height-full.type-image-grid.grid-1-1,
.article div[data-type="media"].height-full.type-image-grid.grid-1-1 {
    /* ◼️ */
    --layout-swiper-grid-x: 1;
    --layout-swiper-grid-y: 1;
    --layout-swiper-grid-item-format: var(--layout-format-square);
}
.tiptap.ProseMirror .media.media-height-fixed.type-image-grid.grid-2-1,
.article .media.media-height-fixed.type-image-grid.grid-2-1,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-image-grid.grid-2-1,
.article div[data-type="media"].media-height-fixed.type-image-grid.grid-2-1,
.tiptap.ProseMirror .media.media-height-full.type-image-grid.grid-2-1,
.article .media.media-height-full.type-image-grid.grid-2-1,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-image-grid.grid-2-1,
.article div[data-type="media"].media-height-full.type-image-grid.grid-2-1,
.tiptap.ProseMirror .media.height-fixed.type-image-grid.grid-2-1,
.article .media.height-fixed.type-image-grid.grid-2-1,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-image-grid.grid-2-1,
.article div[data-type="media"].height-fixed.type-image-grid.grid-2-1,
.tiptap.ProseMirror .media.height-full.type-image-grid.grid-2-1,
.article .media.height-full.type-image-grid.grid-2-1,
.tiptap.ProseMirror div[data-type="media"].height-full.type-image-grid.grid-2-1,
.article div[data-type="media"].height-full.type-image-grid.grid-2-1 {
    /* ◼️ ◼️ */
    --layout-swiper-grid-x: 2;
    --layout-swiper-grid-y: 1;
    --layout-swiper-grid-item-format: var(--layout-format-portrait);
}
.tiptap.ProseMirror .media.media-height-fixed.type-image-grid.grid-3-1,
.article .media.media-height-fixed.type-image-grid.grid-3-1,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-image-grid.grid-3-1,
.article div[data-type="media"].media-height-fixed.type-image-grid.grid-3-1,
.tiptap.ProseMirror .media.media-height-full.type-image-grid.grid-3-1,
.article .media.media-height-full.type-image-grid.grid-3-1,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-image-grid.grid-3-1,
.article div[data-type="media"].media-height-full.type-image-grid.grid-3-1,
.tiptap.ProseMirror .media.height-fixed.type-image-grid.grid-3-1,
.article .media.height-fixed.type-image-grid.grid-3-1,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-image-grid.grid-3-1,
.article div[data-type="media"].height-fixed.type-image-grid.grid-3-1,
.tiptap.ProseMirror .media.height-full.type-image-grid.grid-3-1,
.article .media.height-full.type-image-grid.grid-3-1,
.tiptap.ProseMirror div[data-type="media"].height-full.type-image-grid.grid-3-1,
.article div[data-type="media"].height-full.type-image-grid.grid-3-1 {
    /* ◼️ ◼️ ◼️ */
    --layout-swiper-grid-x: 3;
    --layout-swiper-grid-y: 1;
    --layout-swiper-grid-item-format: var(--layout-format-portrait);
}
.tiptap.ProseMirror .media.media-height-fixed.type-image-grid.grid-1-2,
.article .media.media-height-fixed.type-image-grid.grid-1-2,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-image-grid.grid-1-2,
.article div[data-type="media"].media-height-fixed.type-image-grid.grid-1-2,
.tiptap.ProseMirror .media.media-height-full.type-image-grid.grid-1-2,
.article .media.media-height-full.type-image-grid.grid-1-2,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-image-grid.grid-1-2,
.article div[data-type="media"].media-height-full.type-image-grid.grid-1-2,
.tiptap.ProseMirror .media.height-fixed.type-image-grid.grid-1-2,
.article .media.height-fixed.type-image-grid.grid-1-2,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-image-grid.grid-1-2,
.article div[data-type="media"].height-fixed.type-image-grid.grid-1-2,
.tiptap.ProseMirror .media.height-full.type-image-grid.grid-1-2,
.article .media.height-full.type-image-grid.grid-1-2,
.tiptap.ProseMirror div[data-type="media"].height-full.type-image-grid.grid-1-2,
.article div[data-type="media"].height-full.type-image-grid.grid-1-2 {
    /* ◼️
                       ◼️ */
    --layout-swiper-grid-x: 1;
    --layout-swiper-grid-y: 2;
    --layout-swiper-grid-item-format: var(--layout-format-square);
}
.tiptap.ProseMirror .media.media-height-fixed.type-image-grid.grid-2-2,
.article .media.media-height-fixed.type-image-grid.grid-2-2,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-image-grid.grid-2-2,
.article div[data-type="media"].media-height-fixed.type-image-grid.grid-2-2,
.tiptap.ProseMirror .media.media-height-full.type-image-grid.grid-2-2,
.article .media.media-height-full.type-image-grid.grid-2-2,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-image-grid.grid-2-2,
.article div[data-type="media"].media-height-full.type-image-grid.grid-2-2,
.tiptap.ProseMirror .media.height-fixed.type-image-grid.grid-2-2,
.article .media.height-fixed.type-image-grid.grid-2-2,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-image-grid.grid-2-2,
.article div[data-type="media"].height-fixed.type-image-grid.grid-2-2,
.tiptap.ProseMirror .media.height-full.type-image-grid.grid-2-2,
.article .media.height-full.type-image-grid.grid-2-2,
.tiptap.ProseMirror div[data-type="media"].height-full.type-image-grid.grid-2-2,
.article div[data-type="media"].height-full.type-image-grid.grid-2-2 {
    /* ◼️ ◼️ 
                       ◼️ ◼️ */
    --layout-swiper-grid-x: 2;
    --layout-swiper-grid-y: 2;
    --layout-swiper-grid-item-format: var(--layout-format-square);
}
.tiptap.ProseMirror .media.media-height-fixed.type-image-grid.grid-3-2,
.article .media.media-height-fixed.type-image-grid.grid-3-2,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-image-grid.grid-3-2,
.article div[data-type="media"].media-height-fixed.type-image-grid.grid-3-2,
.tiptap.ProseMirror .media.media-height-full.type-image-grid.grid-3-2,
.article .media.media-height-full.type-image-grid.grid-3-2,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-image-grid.grid-3-2,
.article div[data-type="media"].media-height-full.type-image-grid.grid-3-2,
.tiptap.ProseMirror .media.height-fixed.type-image-grid.grid-3-2,
.article .media.height-fixed.type-image-grid.grid-3-2,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-image-grid.grid-3-2,
.article div[data-type="media"].height-fixed.type-image-grid.grid-3-2,
.tiptap.ProseMirror .media.height-full.type-image-grid.grid-3-2,
.article .media.height-full.type-image-grid.grid-3-2,
.tiptap.ProseMirror div[data-type="media"].height-full.type-image-grid.grid-3-2,
.article div[data-type="media"].height-full.type-image-grid.grid-3-2 {
    /* ◼️ ◼️ ◼️ 
                       ◼️ ◼️ ◼️ */
    --layout-swiper-grid-x: 3;
    --layout-swiper-grid-y: 2;
    --layout-swiper-grid-item-format: var(--layout-format-square);
}
.tiptap.ProseMirror .media.media-height-fixed.type-image-grid.grid-1-3,
.article .media.media-height-fixed.type-image-grid.grid-1-3,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-image-grid.grid-1-3,
.article div[data-type="media"].media-height-fixed.type-image-grid.grid-1-3,
.tiptap.ProseMirror .media.media-height-full.type-image-grid.grid-1-3,
.article .media.media-height-full.type-image-grid.grid-1-3,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-image-grid.grid-1-3,
.article div[data-type="media"].media-height-full.type-image-grid.grid-1-3,
.tiptap.ProseMirror .media.height-fixed.type-image-grid.grid-1-3,
.article .media.height-fixed.type-image-grid.grid-1-3,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-image-grid.grid-1-3,
.article div[data-type="media"].height-fixed.type-image-grid.grid-1-3,
.tiptap.ProseMirror .media.height-full.type-image-grid.grid-1-3,
.article .media.height-full.type-image-grid.grid-1-3,
.tiptap.ProseMirror div[data-type="media"].height-full.type-image-grid.grid-1-3,
.article div[data-type="media"].height-full.type-image-grid.grid-1-3 {
    /* ◼️ 
                       ◼️
                       ◼️ */
    --layout-swiper-grid-x: 1;
    --layout-swiper-grid-y: 3;
    --layout-swiper-grid-item-format: var(--layout-format-landscape);
}
.tiptap.ProseMirror .media.media-height-fixed.type-image-grid.grid-2-3,
.article .media.media-height-fixed.type-image-grid.grid-2-3,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-image-grid.grid-2-3,
.article div[data-type="media"].media-height-fixed.type-image-grid.grid-2-3,
.tiptap.ProseMirror .media.media-height-full.type-image-grid.grid-2-3,
.article .media.media-height-full.type-image-grid.grid-2-3,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-image-grid.grid-2-3,
.article div[data-type="media"].media-height-full.type-image-grid.grid-2-3,
.tiptap.ProseMirror .media.height-fixed.type-image-grid.grid-2-3,
.article .media.height-fixed.type-image-grid.grid-2-3,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-image-grid.grid-2-3,
.article div[data-type="media"].height-fixed.type-image-grid.grid-2-3,
.tiptap.ProseMirror .media.height-full.type-image-grid.grid-2-3,
.article .media.height-full.type-image-grid.grid-2-3,
.tiptap.ProseMirror div[data-type="media"].height-full.type-image-grid.grid-2-3,
.article div[data-type="media"].height-full.type-image-grid.grid-2-3 {
    /* ◼️ ◼️ 
                       ◼️ ◼️
                       ◼️ ◼️ */
    --layout-swiper-grid-x: 2;
    --layout-swiper-grid-y: 3;
    --layout-swiper-grid-item-format: var(--layout-format-square);
}
.tiptap.ProseMirror .media.media-height-fixed.type-image-grid.grid-3-3,
.article .media.media-height-fixed.type-image-grid.grid-3-3,
.tiptap.ProseMirror
    div[data-type="media"].media-height-fixed.type-image-grid.grid-3-3,
.article div[data-type="media"].media-height-fixed.type-image-grid.grid-3-3,
.tiptap.ProseMirror .media.media-height-full.type-image-grid.grid-3-3,
.article .media.media-height-full.type-image-grid.grid-3-3,
.tiptap.ProseMirror
    div[data-type="media"].media-height-full.type-image-grid.grid-3-3,
.article div[data-type="media"].media-height-full.type-image-grid.grid-3-3,
.tiptap.ProseMirror .media.height-fixed.type-image-grid.grid-3-3,
.article .media.height-fixed.type-image-grid.grid-3-3,
.tiptap.ProseMirror
    div[data-type="media"].height-fixed.type-image-grid.grid-3-3,
.article div[data-type="media"].height-fixed.type-image-grid.grid-3-3,
.tiptap.ProseMirror .media.height-full.type-image-grid.grid-3-3,
.article .media.height-full.type-image-grid.grid-3-3,
.tiptap.ProseMirror div[data-type="media"].height-full.type-image-grid.grid-3-3,
.article div[data-type="media"].height-full.type-image-grid.grid-3-3 {
    /* ◼️ ◼️ ◼️ 
                       ◼️ ◼️ ◼️
                       ◼️ ◼️ ◼️ */
    --layout-swiper-grid-x: 3;
    --layout-swiper-grid-y: 3;
    --layout-swiper-grid-item-format: var(--layout-format-square);
}
@media ((max-width: 490px)) {
    .tiptap.ProseMirror .media swiper-container::part(button-next),
    .article .media swiper-container::part(button-next),
    .tiptap.ProseMirror
        div[data-type="media"]
        swiper-container::part(button-next),
    .article div[data-type="media"] swiper-container::part(button-next),
    .tiptap.ProseMirror .media .swiper::part(button-next),
    .article .media .swiper::part(button-next),
    .tiptap.ProseMirror div[data-type="media"] .swiper::part(button-next),
    .article div[data-type="media"] .swiper::part(button-next),
    .tiptap.ProseMirror .media swiper-container::part(button-prev),
    .article .media swiper-container::part(button-prev),
    .tiptap.ProseMirror
        div[data-type="media"]
        swiper-container::part(button-prev),
    .article div[data-type="media"] swiper-container::part(button-prev),
    .tiptap.ProseMirror .media .swiper::part(button-prev),
    .article .media .swiper::part(button-prev),
    .tiptap.ProseMirror div[data-type="media"] .swiper::part(button-prev),
    .article div[data-type="media"] .swiper::part(button-prev) {
        display: none;
    }
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror .media swiper-container::part(button-next),
    .article .media swiper-container::part(button-next),
    .tiptap.ProseMirror
        div[data-type="media"]
        swiper-container::part(button-next),
    .article div[data-type="media"] swiper-container::part(button-next),
    .tiptap.ProseMirror .media .swiper::part(button-next),
    .article .media .swiper::part(button-next),
    .tiptap.ProseMirror div[data-type="media"] .swiper::part(button-next),
    .article div[data-type="media"] .swiper::part(button-next),
    .tiptap.ProseMirror .media swiper-container::part(button-prev),
    .article .media swiper-container::part(button-prev),
    .tiptap.ProseMirror
        div[data-type="media"]
        swiper-container::part(button-prev),
    .article div[data-type="media"] swiper-container::part(button-prev),
    .tiptap.ProseMirror .media .swiper::part(button-prev),
    .article .media .swiper::part(button-prev),
    .tiptap.ProseMirror div[data-type="media"] .swiper::part(button-prev),
    .article div[data-type="media"] .swiper::part(button-prev) {
        display: none;
    }
}
.tiptap.ProseMirror .media .caption,
.article .media .caption,
.tiptap.ProseMirror div[data-type="media"] .caption,
.article div[data-type="media"] .caption {
    width: var(--content-width);
    margin: 0rem auto;
    margin-top: 0.5rem;
    padding-right: 0.5rem;
    padding-left: calc(var(--content-width) / 3);
    box-sizing: border-box;
    text-align: right;
    font-family: "roboto";
    font-weight: 400;
    font-size: var(--font-size-micro);
    font-style: italic;
    color: var(--color-editor-font-light);
}
.tiptap.ProseMirror .media.type-carousel,
.article .media.type-carousel,
.tiptap.ProseMirror div[data-type="media"].type-carousel,
.article div[data-type="media"].type-carousel {
    margin: 4rem auto 8rem auto;
}
.tiptap.ProseMirror .media.type-carousel .custom-pagination,
.article .media.type-carousel .custom-pagination,
.tiptap.ProseMirror div[data-type="media"].type-carousel .custom-pagination,
.article div[data-type="media"].type-carousel .custom-pagination {
    padding: 0.75rem 0;
    border-radius: 2rem;
    bottom: -5rem;
}
.tiptap.ProseMirror
    .media.type-carousel
    .custom-pagination
    .swiper-pagination-bullet,
.article .media.type-carousel .custom-pagination .swiper-pagination-bullet,
.tiptap.ProseMirror
    div[data-type="media"].type-carousel
    .custom-pagination
    .swiper-pagination-bullet,
.article
    div[data-type="media"].type-carousel
    .custom-pagination
    .swiper-pagination-bullet {
    opacity: 0.75;
    background: var(--color-editor-medias-slider-pagination-bullet);
}
.tiptap.ProseMirror
    .media.type-carousel
    .custom-pagination
    .swiper-pagination-bullet-active,
.article
    .media.type-carousel
    .custom-pagination
    .swiper-pagination-bullet-active,
.tiptap.ProseMirror
    div[data-type="media"].type-carousel
    .custom-pagination
    .swiper-pagination-bullet-active,
.article
    div[data-type="media"].type-carousel
    .custom-pagination
    .swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--color-editor-medias-slider-pagination-bullet);
}
.tiptap.ProseMirror .media.type-slider .swiper::part(button-next),
.article .media.type-slider .swiper::part(button-next),
.tiptap.ProseMirror
    div[data-type="media"].type-slider
    .swiper::part(button-next),
.article div[data-type="media"].type-slider .swiper::part(button-next),
.tiptap.ProseMirror .media.type-slider .swiper::part(button-prev),
.article .media.type-slider .swiper::part(button-prev),
.tiptap.ProseMirror
    div[data-type="media"].type-slider
    .swiper::part(button-prev),
.article div[data-type="media"].type-slider .swiper::part(button-prev) {
    color: var(--color-editor-medias-slider-navigation-element);
    width: 3rem;
    height: 3rem;
}
.tiptap.ProseMirror .media.type-slider .swiper .swiper-slide img,
.article .media.type-slider .swiper .swiper-slide img,
.tiptap.ProseMirror
    div[data-type="media"].type-slider
    .swiper
    .swiper-slide
    img,
.article div[data-type="media"].type-slider .swiper .swiper-slide img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.tiptap.ProseMirror .media.type-slider .custom-pagination,
.article .media.type-slider .custom-pagination,
.tiptap.ProseMirror div[data-type="media"].type-slider .custom-pagination,
.article div[data-type="media"].type-slider .custom-pagination {
    padding: 0.75rem 0;
    border-radius: 2rem;
    bottom: 1.5rem;
    background-color: var(--color-editor-medias-slider-pagination-background);
}
.tiptap.ProseMirror
    .media.type-slider
    .custom-pagination
    .swiper-pagination-bullet,
.article .media.type-slider .custom-pagination .swiper-pagination-bullet,
.tiptap.ProseMirror
    div[data-type="media"].type-slider
    .custom-pagination
    .swiper-pagination-bullet,
.article
    div[data-type="media"].type-slider
    .custom-pagination
    .swiper-pagination-bullet {
    opacity: 0.75;
    background: var(--color-editor-medias-slider-pagination-overprint-bullet);
}
.tiptap.ProseMirror
    .media.type-slider
    .custom-pagination
    .swiper-pagination-bullet-active,
.article .media.type-slider .custom-pagination .swiper-pagination-bullet-active,
.tiptap.ProseMirror
    div[data-type="media"].type-slider
    .custom-pagination
    .swiper-pagination-bullet-active,
.article
    div[data-type="media"].type-slider
    .custom-pagination
    .swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--color-editor-medias-slider-pagination-overprint-bullet);
}
.tiptap.ProseMirror .media.type-slider .caption,
.article .media.type-slider .caption,
.tiptap.ProseMirror div[data-type="media"].type-slider .caption,
.article div[data-type="media"].type-slider .caption {
    text-align: right;
    margin-top: 0.25rem;
}
.tiptap.ProseMirror .media.type-image-grid .swiper,
.article .media.type-image-grid .swiper,
.tiptap.ProseMirror div[data-type="media"].type-image-grid .swiper,
.article div[data-type="media"].type-image-grid .swiper {
    height: 100%;
}
.tiptap.ProseMirror .media.type-image-grid .swiper-wrapper,
.article .media.type-image-grid .swiper-wrapper,
.tiptap.ProseMirror div[data-type="media"].type-image-grid .swiper-wrapper,
.article div[data-type="media"].type-image-grid .swiper-wrapper {
    gap: var(--layout-swiper-grid-gap);
}
.tiptap.ProseMirror .media.type-image-grid .swiper-wrapper .swiper-slide,
.article .media.type-image-grid .swiper-wrapper .swiper-slide,
.tiptap.ProseMirror
    div[data-type="media"].type-image-grid
    .swiper-wrapper
    .swiper-slide,
.article div[data-type="media"].type-image-grid .swiper-wrapper .swiper-slide {
    flex: 0 0
        calc(
            (
                    100% - (var(--layout-swiper-grid-x) - 1) *
                        var(--layout-swiper-grid-gap)
                ) /
                var(--layout-swiper-grid-x)
        );
    /* 2 gaps sur chaque ligne */
    height: calc(
        (
                var(--layout-media-height) -
                    (
                        var(--layout-swiper-grid-gap) *
                            (var(--layout-swiper-grid-y) - 1)
                    )
            ) /
            var(--layout-swiper-grid-y)
    );
}
.tiptap.ProseMirror .media.type-image-grid .swiper-wrapper .swiper-slide img,
.article .media.type-image-grid .swiper-wrapper .swiper-slide img,
.tiptap.ProseMirror
    div[data-type="media"].type-image-grid
    .swiper-wrapper
    .swiper-slide
    img,
.article
    div[data-type="media"].type-image-grid
    .swiper-wrapper
    .swiper-slide
    img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.tiptap.ProseMirror .media.type-video .swiper-slide,
.article .media.type-video .swiper-slide,
.tiptap.ProseMirror div[data-type="media"].type-video .swiper-slide,
.article div[data-type="media"].type-video .swiper-slide {
    position: relative;
    padding-top: calc(100% * 9 / 16);
}
.tiptap.ProseMirror .media.type-video .swiper-slide iframe,
.article .media.type-video .swiper-slide iframe,
.tiptap.ProseMirror div[data-type="media"].type-video .swiper-slide iframe,
.article div[data-type="media"].type-video .swiper-slide iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% + 1px);
}
.tiptap.ProseMirror:has(> section:last-child)::after,
.article:has(> section:last-child)::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: var(--padding-bottom);
    /* identique au padding-bottom du conteneur */
    background-color: var(--color-editor-section-background);
    pointer-events: none;
    border-radius: 0 0 2rem 2rem;
}
.tiptap.ProseMirror:has(> section:last-child) section:last-child,
.article:has(> section:last-child) section:last-child {
    margin-bottom: 0;
}
.tiptap.ProseMirror:has(> section:last-child)
    section:last-child:has(> .media-width-full:last-child),
.article:has(> section:last-child)
    section:last-child:has(> .media-width-full:last-child),
.tiptap.ProseMirror:has(> section:last-child)
    section:last-child:has(> .width-full:last-child),
.article:has(> section:last-child)
    section:last-child:has(> .width-full:last-child) {
    margin-bottom: 0;
    padding-bottom: 0;
}
@media ((max-width: 490px)) {
    .tiptap.ProseMirror:has(> section:last-child)
        section:last-child:has(> .media-width-fit:last-child),
    .article:has(> section:last-child)
        section:last-child:has(> .media-width-fit:last-child),
    .tiptap.ProseMirror:has(> section:last-child)
        section:last-child:has(> .media-width-extend:last-child),
    .article:has(> section:last-child)
        section:last-child:has(> .media-width-extend:last-child),
    .tiptap.ProseMirror:has(> section:last-child)
        section:last-child:has(> .width-fit:last-child),
    .article:has(> section:last-child)
        section:last-child:has(> .width-fit:last-child),
    .tiptap.ProseMirror:has(> section:last-child)
        section:last-child:has(> .width-extend:last-child),
    .article:has(> section:last-child)
        section:last-child:has(> .width-extend:last-child) {
        margin-bottom: 0;
        padding-bottom: 0;
    }
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror:has(> section:last-child)
        section:last-child:has(> .media-width-fit:last-child),
    .article:has(> section:last-child)
        section:last-child:has(> .media-width-fit:last-child),
    .tiptap.ProseMirror:has(> section:last-child)
        section:last-child:has(> .media-width-extend:last-child),
    .article:has(> section:last-child)
        section:last-child:has(> .media-width-extend:last-child),
    .tiptap.ProseMirror:has(> section:last-child)
        section:last-child:has(> .width-fit:last-child),
    .article:has(> section:last-child)
        section:last-child:has(> .width-fit:last-child),
    .tiptap.ProseMirror:has(> section:last-child)
        section:last-child:has(> .width-extend:last-child),
    .article:has(> section:last-child)
        section:last-child:has(> .width-extend:last-child) {
        margin-bottom: 0;
        padding-bottom: 0;
    }
}
.tiptap.ProseMirror:has(> section:last-child > .media-width-full:last-child),
.article:has(> section:last-child > .media-width-full:last-child),
.tiptap.ProseMirror:has(> section:last-child > .width-full:last-child),
.article:has(> section:last-child > .width-full:last-child) {
    margin-bottom: 0;
    padding-bottom: 0;
}
.tiptap.ProseMirror:has(.type-image-grid:last-child),
.article:has(.type-image-grid:last-child),
.tiptap.ProseMirror:has(.type-video:last-child),
.article:has(.type-video:last-child) {
    margin-bottom: 0;
    padding-bottom: 0;
}
.tiptap.ProseMirror .media-width-full:last-child.type-image-grid,
.article .media-width-full:last-child.type-image-grid,
.tiptap.ProseMirror .width-full:last-child.type-image-grid,
.article .width-full:last-child.type-image-grid,
.tiptap.ProseMirror .media-width-full:last-child.type-video,
.article .media-width-full:last-child.type-video,
.tiptap.ProseMirror .width-full:last-child.type-video,
.article .width-full:last-child.type-video {
    margin-bottom: 0;
    padding-bottom: 0;
}
.tiptap.ProseMirror .media-width-full:has(+ section),
.article .media-width-full:has(+ section),
.tiptap.ProseMirror .width-full:has(+ section),
.article .width-full:has(+ section) {
    margin-bottom: 0;
}
@media ((max-width: 490px)) {
    .tiptap.ProseMirror:has(> section:last-child > .type-slider:last-child),
    .article:has(> section:last-child > .type-slider:last-child) {
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .tiptap.ProseMirror:has(.type-slider:last-child),
    .article:has(.type-slider:last-child) {
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .tiptap.ProseMirror .media-width-fit:last-child.type-image-grid:last-child,
    .article .media-width-fit:last-child.type-image-grid:last-child,
    .tiptap.ProseMirror
        .media-width-extend:last-child.type-image-grid:last-child,
    .article .media-width-extend:last-child.type-image-grid:last-child,
    .tiptap.ProseMirror .width-fit:last-child.type-image-grid:last-child,
    .article .width-fit:last-child.type-image-grid:last-child,
    .tiptap.ProseMirror .width-extend:last-child.type-image-grid:last-child,
    .article .width-extend:last-child.type-image-grid:last-child,
    .tiptap.ProseMirror .media-width-fit:last-child.type-vide:last-child,
    .article .media-width-fit:last-child.type-vide:last-child,
    .tiptap.ProseMirror .media-width-extend:last-child.type-vide:last-child,
    .article .media-width-extend:last-child.type-vide:last-child,
    .tiptap.ProseMirror .width-fit:last-child.type-vide:last-child,
    .article .width-fit:last-child.type-vide:last-child,
    .tiptap.ProseMirror .width-extend:last-child.type-vide:last-child,
    .article .width-extend:last-child.type-vide:last-child,
    .tiptap.ProseMirror .media-width-fit:last-child.type-slider:last-child,
    .article .media-width-fit:last-child.type-slider:last-child,
    .tiptap.ProseMirror .media-width-extend:last-child.type-slider:last-child,
    .article .media-width-extend:last-child.type-slider:last-child,
    .tiptap.ProseMirror .width-fit:last-child.type-slider:last-child,
    .article .width-fit:last-child.type-slider:last-child,
    .tiptap.ProseMirror .width-extend:last-child.type-slider:last-child,
    .article .width-extend:last-child.type-slider:last-child {
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .tiptap.ProseMirror
        .media-width-fit:has(+ section)
        .media-width-extend:has(+ section).type-slider,
    .article
        .media-width-fit:has(+ section)
        .media-width-extend:has(+ section).type-slider,
    .tiptap.ProseMirror
        .width-fit:has(+ section)
        .width-extend:has(+ section).type-slider,
    .article
        .width-fit:has(+ section)
        .width-extend:has(+ section).type-slider {
        margin-bottom: 0;
    }
}
@container ((max-width: 490px)) {
    .tiptap.ProseMirror:has(> section:last-child > .type-slider:last-child),
    .article:has(> section:last-child > .type-slider:last-child) {
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .tiptap.ProseMirror:has(.type-slider:last-child),
    .article:has(.type-slider:last-child) {
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .tiptap.ProseMirror .media-width-fit:last-child.type-image-grid:last-child,
    .article .media-width-fit:last-child.type-image-grid:last-child,
    .tiptap.ProseMirror
        .media-width-extend:last-child.type-image-grid:last-child,
    .article .media-width-extend:last-child.type-image-grid:last-child,
    .tiptap.ProseMirror .width-fit:last-child.type-image-grid:last-child,
    .article .width-fit:last-child.type-image-grid:last-child,
    .tiptap.ProseMirror .width-extend:last-child.type-image-grid:last-child,
    .article .width-extend:last-child.type-image-grid:last-child,
    .tiptap.ProseMirror .media-width-fit:last-child.type-vide:last-child,
    .article .media-width-fit:last-child.type-vide:last-child,
    .tiptap.ProseMirror .media-width-extend:last-child.type-vide:last-child,
    .article .media-width-extend:last-child.type-vide:last-child,
    .tiptap.ProseMirror .width-fit:last-child.type-vide:last-child,
    .article .width-fit:last-child.type-vide:last-child,
    .tiptap.ProseMirror .width-extend:last-child.type-vide:last-child,
    .article .width-extend:last-child.type-vide:last-child,
    .tiptap.ProseMirror .media-width-fit:last-child.type-slider:last-child,
    .article .media-width-fit:last-child.type-slider:last-child,
    .tiptap.ProseMirror .media-width-extend:last-child.type-slider:last-child,
    .article .media-width-extend:last-child.type-slider:last-child,
    .tiptap.ProseMirror .width-fit:last-child.type-slider:last-child,
    .article .width-fit:last-child.type-slider:last-child,
    .tiptap.ProseMirror .width-extend:last-child.type-slider:last-child,
    .article .width-extend:last-child.type-slider:last-child {
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .tiptap.ProseMirror
        .media-width-fit:has(+ section)
        .media-width-extend:has(+ section).type-slider,
    .article
        .media-width-fit:has(+ section)
        .media-width-extend:has(+ section).type-slider,
    .tiptap.ProseMirror
        .width-fit:has(+ section)
        .width-extend:has(+ section).type-slider,
    .article
        .width-fit:has(+ section)
        .width-extend:has(+ section).type-slider {
        margin-bottom: 0;
    }
}
.mode-journal .tiptap.ProseMirror p {
    font-family: "playfair";
    font-weight: 400;
    font-size: var(--font-size-regular-plus);
    line-height: 1.6;
    text-align: justify;
    white-space: normal;
}
@media ((max-width: 490px)) {
    .mode-journal .tiptap.ProseMirror p {
        line-height: 1.4;
    }
}
@container ((max-width: 490px)) {
    .mode-journal .tiptap.ProseMirror p {
        line-height: 1.4;
    }
}
.mode-journal .tiptap.ProseMirror h1 {
    font-family: "playfair";
    font-weight: 500;
    font-size: var(--font-size-giant);
    -webkit-font-smoothing: antialiased;
    line-height: 1;
    letter-spacing: -0.1rem;
    text-align: center;
}
@media ((max-width: 490px)) {
    .mode-journal .tiptap.ProseMirror h1 {
        font-size: var(--font-size-huge);
        -webkit-font-smoothing: antialiased;
    }
}
@container ((max-width: 490px)) {
    .mode-journal .tiptap.ProseMirror h1 {
        font-size: var(--font-size-huge);
        -webkit-font-smoothing: antialiased;
    }
}
.mode-journal .tiptap.ProseMirror p.subtitle,
.mode-journal .tiptap.ProseMirror p[data-type="subtitle"] {
    font-family: "playfair";
    font-weight: 400;
    font-size: var(--font-size-regular-plus);
    line-height: 1.4;
    color: var(--color-editor-font-light);
    margin-top: 1rem;
    text-align: center;
}
@media ((max-width: 490px)) {
    .mode-journal .tiptap.ProseMirror p.subtitle,
    .mode-journal .tiptap.ProseMirror p[data-type="subtitle"] {
        font-size: var(--font-size-regular);
    }
}
@container ((max-width: 490px)) {
    .mode-journal .tiptap.ProseMirror p.subtitle,
    .mode-journal .tiptap.ProseMirror p[data-type="subtitle"] {
        font-size: var(--font-size-regular);
    }
}
.mode-journal .tiptap.ProseMirror h2 + p.subtitle {
    text-align: left;
    margin-top: 0;
}
.mode-journal .tiptap.ProseMirror p.lead,
.mode-journal .tiptap.ProseMirror p[data-type="lead"] {
    font-family: "playfair";
    font-weight: 400;
    font-size: var(--font-size-medium);
    -webkit-font-smoothing: antialiased;
    line-height: 1.4;
    text-align: center;
    color: var(--color-editor-font-regular);
}
@media ((max-width: 490px)) {
    .mode-journal .tiptap.ProseMirror p.lead,
    .mode-journal .tiptap.ProseMirror p[data-type="lead"] {
        line-height: 1.25;
    }
}
@container ((max-width: 490px)) {
    .mode-journal .tiptap.ProseMirror p.lead,
    .mode-journal .tiptap.ProseMirror p[data-type="lead"] {
        line-height: 1.25;
    }
}
.mode-journal .tiptap.ProseMirror h2 {
    font-family: "playfair";
    font-weight: 500;
    font-size: var(--font-size-big-plus);
    -webkit-font-smoothing: antialiased;
    margin-top: 8rem;
}
@media ((min-width: 1600px)) {
    .mode-journal .tiptap.ProseMirror h2 {
        font-size: var(--font-size-huge);
        -webkit-font-smoothing: antialiased;
        margin-top: 8rem;
    }
}
@container ((min-width: 1600px)) {
    .mode-journal .tiptap.ProseMirror h2 {
        font-size: var(--font-size-huge);
        -webkit-font-smoothing: antialiased;
        margin-top: 8rem;
    }
}
.mode-journal .tiptap.ProseMirror h2:has(+ p.subtitle) {
    margin-bottom: 0;
}
@media ((min-width: 1600px)) {
    .mode-journal .tiptap.ProseMirror h2:has(+ p.subtitle) {
        margin-top: 8rem;
    }
}
@container ((min-width: 1600px)) {
    .mode-journal .tiptap.ProseMirror h2:has(+ p.subtitle) {
        margin-top: 8rem;
    }
}
.mode-journal .tiptap.ProseMirror section + h2 {
    margin-top: 0rem;
}
@media ((min-width: 1600px)) {
    .mode-journal .tiptap.ProseMirror section + h2 {
        margin-top: 8rem;
    }
}
@container ((min-width: 1600px)) {
    .mode-journal .tiptap.ProseMirror section + h2 {
        margin-top: 8rem;
    }
}
.mode-journal .tiptap.ProseMirror section h2 {
    margin-top: 0;
}
@media ((min-width: 1600px)) {
    .mode-journal .tiptap.ProseMirror section h2 {
        margin-top: 2rem;
    }
}
@container ((min-width: 1600px)) {
    .mode-journal .tiptap.ProseMirror section h2 {
        margin-top: 2rem;
    }
}
.mode-journal .tiptap.ProseMirror h3 {
    font-family: "playfair";
    font-weight: 500;
    margin-top: 6rem;
}
.mode-journal .tiptap.ProseMirror p.highlight,
.mode-journal .tiptap.ProseMirror p[data-type="highlighted-paragraph"] {
    font-family: "playfair";
    font-weight: 500;
}
.mode-journal .tiptap.ProseMirror blockquote:not(figure blockquote) {
    width: calc(var(--content-width));
    border: 1px solid var(--color-editor-blockquote-background);
    padding: 3rem;
    margin: 4rem auto;
    background: none !important;
}
.mode-journal .tiptap.ProseMirror blockquote:not(figure blockquote) p {
    text-align: center;
    color: var(--color-editor-font-regular);
    font-family: "playfair";
    font-weight: 500;
    font-size: var(--font-size-regular-plus);
}
.mode-journal .tiptap.ProseMirror figure div > blockquote.is-empty p::before {
    font-family: "playfair";
    font-weight: 400;
}
.mode-journal .tiptap.ProseMirror figure div > blockquote p {
    text-align: center;
    color: var(--color-editor-font-regular);
    font-family: "playfair";
    font-weight: 500;
    font-size: var(--font-size-medium) !important;
    line-height: 1.8;
}
.mode-journal .tiptap.ProseMirror figure div cite,
.mode-journal .tiptap.ProseMirror figure div figcaption {
    font-family: "playfair";
    font-weight: 400;
    font-style: italic;
    font-size: var(--font-size-regular);
}
.mode-journal .tiptap.ProseMirror figure div cite.is-empty::before,
.mode-journal .tiptap.ProseMirror figure div figcaption.is-empty::before {
    font-family: "playfair";
    font-weight: 400;
    font-style: italic;
}
.mode-journal .tiptap.ProseMirror figure div cite em,
.mode-journal .tiptap.ProseMirror figure div figcaption em {
    font-family: "playfair";
    font-weight: 400;
    font-style: italic;
}
.mode-journal .tiptap.ProseMirror a {
    color: var(--color-editor-font-regular);
    text-decoration: underline !important;
}
.mode-journal .tiptap.ProseMirror strong {
    font-weight: 400;
    color: var(--color-editor-font-regular);
}
.mode-journal .tiptap.ProseMirror hr {
    margin-left: auto;
}
.mode-journal .tiptap.ProseMirror section > h3 {
    margin-top: 1rem;
}
.mode-journal .tiptap.ProseMirror .media .caption {
    font-family: "playfair";
    font-weight: 400;
}
.mode-books .tiptap.ProseMirror p {
    font-family: "roboto";
    font-weight: 400;
    font-size: var(--font-size-regular-plus);
    line-height: 1.6;
    text-align: left;
    white-space: normal;
}
@media ((max-width: 490px)) {
    .mode-books .tiptap.ProseMirror p {
        line-height: 1.4;
    }
}
@container ((max-width: 490px)) {
    .mode-books .tiptap.ProseMirror p {
        line-height: 1.4;
    }
}
.mode-books .tiptap.ProseMirror p strong {
    font-family: "roboto";
    font-weight: 700;
}
.mode-books .tiptap.ProseMirror h1 {
    font-family: "roboto";
    font-weight: 800;
    font-size: var(--font-size-giant);
    -webkit-font-smoothing: antialiased;
    line-height: 1;
    letter-spacing: -0.1rem;
    text-align: left;
}
@media ((max-width: 490px)) {
    .mode-books .tiptap.ProseMirror h1 {
        font-size: var(--font-size-huge);
        -webkit-font-smoothing: antialiased;
    }
}
@container ((max-width: 490px)) {
    .mode-books .tiptap.ProseMirror h1 {
        font-size: var(--font-size-huge);
        -webkit-font-smoothing: antialiased;
    }
}
.mode-books .tiptap.ProseMirror h1:has(+ p.subtitle),
.mode-books .tiptap.ProseMirror h1:has(+ p[data-type="subtitle"]) {
    margin-bottom: 0;
}
.mode-books .tiptap.ProseMirror p.subtitle,
.mode-books .tiptap.ProseMirror p[data-type="subtitle"] {
    font-family: "roboto";
    font-weight: 600;
    font-size: var(--font-size-regular-plus);
    line-height: 1.4;
    color: var(--color-editor-font-light);
    margin-top: 0rem;
    text-align: left;
}
@media ((max-width: 490px)) {
    .mode-books .tiptap.ProseMirror p.subtitle,
    .mode-books .tiptap.ProseMirror p[data-type="subtitle"] {
        font-size: var(--font-size-regular);
    }
}
@container ((max-width: 490px)) {
    .mode-books .tiptap.ProseMirror p.subtitle,
    .mode-books .tiptap.ProseMirror p[data-type="subtitle"] {
        font-size: var(--font-size-regular);
    }
}
.mode-books .tiptap.ProseMirror h2 + p.subtitle {
    text-align: left;
    margin-top: 0;
}
.mode-books .tiptap.ProseMirror p.lead,
.mode-books .tiptap.ProseMirror p[data-type="lead"] {
    font-family: "roboto";
    font-weight: 600;
    font-size: var(--font-size-medium);
    -webkit-font-smoothing: antialiased;
    line-height: 1.4;
    text-align: left;
    color: var(--color-editor-font-regular);
}
@media ((max-width: 490px)) {
    .mode-books .tiptap.ProseMirror p.lead,
    .mode-books .tiptap.ProseMirror p[data-type="lead"] {
        line-height: 1.25;
    }
}
@container ((max-width: 490px)) {
    .mode-books .tiptap.ProseMirror p.lead,
    .mode-books .tiptap.ProseMirror p[data-type="lead"] {
        line-height: 1.25;
    }
}
.mode-books .tiptap.ProseMirror h2,
.mode-books .tiptap.ProseMirror h2 strong {
    font-family: "roboto";
    font-weight: 700;
    font-size: var(--font-size-big-plus);
    -webkit-font-smoothing: antialiased;
    margin-top: 8rem;
    margin-bottom: 2rem;
    line-height: 1;
}
@media ((min-width: 1600px)) {
    .mode-books .tiptap.ProseMirror h2,
    .mode-books .tiptap.ProseMirror h2 strong {
        font-size: var(--font-size-huge);
        -webkit-font-smoothing: antialiased;
        margin-top: 8rem;
    }
}
@container ((min-width: 1600px)) {
    .mode-books .tiptap.ProseMirror h2,
    .mode-books .tiptap.ProseMirror h2 strong {
        font-size: var(--font-size-huge);
        -webkit-font-smoothing: antialiased;
        margin-top: 8rem;
    }
}
.mode-books .tiptap.ProseMirror h2:has(+ p.subtitle) {
    margin-bottom: 0;
}
@media ((min-width: 1600px)) {
    .mode-books .tiptap.ProseMirror h2:has(+ p.subtitle) {
        margin-top: 8rem;
    }
}
@container ((min-width: 1600px)) {
    .mode-books .tiptap.ProseMirror h2:has(+ p.subtitle) {
        margin-top: 8rem;
    }
}
.mode-books .tiptap.ProseMirror section + h2 {
    margin-top: 0rem;
}
@media ((min-width: 1600px)) {
    .mode-books .tiptap.ProseMirror section + h2 {
        margin-top: 8rem;
    }
}
@container ((min-width: 1600px)) {
    .mode-books .tiptap.ProseMirror section + h2 {
        margin-top: 8rem;
    }
}
.mode-books .tiptap.ProseMirror section h2 {
    margin-top: 0;
}
@media ((min-width: 1600px)) {
    .mode-books .tiptap.ProseMirror section h2 {
        margin-top: 2rem;
    }
}
@container ((min-width: 1600px)) {
    .mode-books .tiptap.ProseMirror section h2 {
        margin-top: 2rem;
    }
}
.mode-books .tiptap.ProseMirror h3 {
    font-family: "roboto";
    font-weight: 700;
    margin-top: 3rem;
}
.mode-books .tiptap.ProseMirror h3 strong {
    font-family: "roboto";
    font-weight: 700;
}
.mode-books .tiptap.ProseMirror p.highlight,
.mode-books .tiptap.ProseMirror p[data-type="highlighted-paragraph"] {
    font-family: "roboto";
    font-weight: 500;
}
.mode-books .tiptap.ProseMirror blockquote:not(figure blockquote) {
    width: calc(var(--content-width));
    border: 1px solid var(--color-editor-blockquote-background);
    padding: 3rem;
    margin: 4rem auto;
    background: none !important;
}
.mode-books .tiptap.ProseMirror blockquote:not(figure blockquote) p {
    text-align: center;
    color: var(--color-editor-font-regular);
    font-family: "roboto";
    font-weight: 500;
    font-size: var(--font-size-regular-plus);
}
.mode-books .tiptap.ProseMirror ul li {
    padding-left: 1rem;
}
.mode-books .tiptap.ProseMirror ul li::before {
    content: "•";
    position: absolute;
    left: 0;
    top: 0.3rem;
}
.mode-books .tiptap.ProseMirror figure div > blockquote.is-empty p::before {
    font-family: "playfair";
    font-weight: 400;
}
.mode-books .tiptap.ProseMirror figure div > blockquote p {
    text-align: center;
    color: var(--color-editor-font-regular);
    font-family: "roboto";
    font-weight: 500;
    font-size: var(--font-size-medium) !important;
    line-height: 1.8;
}
.mode-books .tiptap.ProseMirror figure div cite,
.mode-books .tiptap.ProseMirror figure div figcaption {
    font-family: "roboto";
    font-weight: 400;
    font-style: italic;
    font-size: var(--font-size-regular);
}
.mode-books .tiptap.ProseMirror figure div cite.is-empty::before,
.mode-books .tiptap.ProseMirror figure div figcaption.is-empty::before {
    font-family: "roboto";
    font-weight: 400;
    font-style: italic;
}
.mode-books .tiptap.ProseMirror figure div cite em,
.mode-books .tiptap.ProseMirror figure div figcaption em {
    font-family: "roboto";
    font-weight: 400;
    font-style: italic;
}
.mode-books .tiptap.ProseMirror a {
    color: var(--color-editor-font-regular);
    text-decoration: underline !important;
}
.mode-books .tiptap.ProseMirror strong {
    font-weight: 400;
    color: var(--color-editor-font-regular);
}
.mode-books .tiptap.ProseMirror hr {
    margin-left: auto;
}
.mode-books .tiptap.ProseMirror section > h3 {
    margin-top: 1rem;
}
.mode-books .tiptap.ProseMirror .media .caption {
    font-family: "roboto";
    font-weight: 400;
}