@font-face {
    font-family: 'Cera Pro';
    src: url('../fonts/duncancentre/Cera Pro Light.woff2') format('woff2'),
        url('../fonts/duncancentre/Cera Pro Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('../fonts/duncancentre/Cera Pro Regular.woff2') format('woff2'),
        url('../fonts/duncancentre/Cera Pro Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('../fonts/duncancentre/Cera Pro Medium.woff2') format('woff2'),
        url('../fonts/duncancentre/Cera Pro Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Cera Pro';
    src: url('../fonts/duncancentre/Cera Pro Bold.woff2') format('woff2'),
        url('../fonts/duncancentre/Cera Pro Bold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

:root,
:host {

    /* —————————— */
    /*   COLORS   */
    /* —————————— */

    /* Base colors */
    --color-white: #ffffff;
    --color-black: #000000;
    --color-transparent: #ffffff00;

    /* Neutral colors */
    --color-neutral-25: #fdfdfd;
    --color-neutral-50: #fafafa;
    --color-neutral-100: #f5f5f5;
    --color-neutral-200: #e9eaeb;
    --color-neutral-300: #d5d7da;
    --color-neutral-400: #a4a7ae;
    --color-neutral-500: #717680;
    --color-neutral-600: #535862;
    --color-neutral-700: #414651;
    --color-neutral-800: #252b37;
    --color-neutral-900: #181d27;
    --color-neutral-950: #0a0d12;

    /* Brand colors */
    --color-brand-25: #f0edf4;
    --color-brand-50: #e2d9ec;
    --color-brand-100: #c5b3d9;
    --color-brand-200: #a88dc6;
    --color-brand-300: #7d5fa6;
    --color-brand-400: #5c3d85;
    --color-brand-500: #3f2260;
    --color-brand-600: #29173a;
    --color-brand-700: #1f1028;
    --color-brand-800: #150a1a;
    --color-brand-900: #0b050e;
    --color-brand-950: #060308;

    /* Secondary colors */
    --color-secondary-25: #fef0f7;
    --color-secondary-50: #fce1ef;
    --color-secondary-100: #f9b3d5;
    --color-secondary-200: #f47fb6;
    --color-secondary-300: #ee4a97;
    --color-secondary-400: #e72078;
    --color-secondary-500: #e20d71;
    --color-secondary-600: #c20a61;
    --color-secondary-700: #910748;
    --color-secondary-800: #600430;
    --color-secondary-900: #30021a;
    --color-secondary-950: #18010d;

    /* Error colors */
    --color-error-25: #fff8fa;
    --color-error-50: #fef3f2;
    --color-error-100: #fee4e2;
    --color-error-200: #fecdca;
    --color-error-300: #fda29b;
    --color-error-400: #f97066;
    --color-error-500: #f04438;
    --color-error-600: #d92d20;
    --color-error-700: #b42318;
    --color-error-800: #912018;
    --color-error-900: #7a271a;
    --color-error-950: #55160c;

    /* Success colors */
    --color-success-25: #F6FEF9;
    --color-success-50: #ECFDF3;
    --color-success-100: #DCFAE6;
    --color-success-200: #ABEFC6;
    --color-success-300: #75E0A7;
    --color-success-400: #47CD89;
    --color-success-500: #17B26A;
    --color-success-600: #079455;
    --color-success-700: #067647;
    --color-success-800: #085D3A;
    --color-success-900: #074D31;
    --color-success-950: #053321;

    /* Warning colors */
    --color-warning-25: #FFFCF5;
    --color-warning-50: #FFFAEB;
    --color-warning-100: #FEF0C7;
    --color-warning-200: #FEDF89;
    --color-warning-300: #FEC84B;
    --color-warning-400: #FDB022;
    --color-warning-500: #F79009;
    --color-warning-600: #DC6803;
    --color-warning-700: #B54708;
    --color-warning-800: #93370D;
    --color-warning-900: #7A2E0E;
    --color-warning-950: #4E1D09;


    /* ——————————————— */
    /* Semantic colors */
    /* ——————————————— */
    /* Background and borders */
    --color-white-50: rgba(255, 255, 255, 0.5);
    --color-white-100: var(--color-white);
    --color-gray-light: var(--color-neutral-100);
    --color-gray-solid: var(--color-neutral-600);
    --color-brand-light: var(--color-brand-50);
    --color-brand-solid: var(--color-brand-600);
    --color-error-solid: var(--color-error-600);

    /* Foreground colors */
    --color-fg-white: var(--color-white);
    --color-fg-black: var(--color-neutral-900);
    --color-fg-gray: var(--color-neutral-400);

    /* Overlay colors */
    --overlay-25-color: rgba(0, 0, 0, 0.25);
    --overlay-50-color: rgba(0, 0, 0, 0.5);

    /* Scroll fade colors */
    --scroll-fade: linear-gradient(to left, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));


    /* ———————— */
    /*   BODY   */
    /* ———————— */
    --body-padding-mobile: 16px;
    --body-padding-desktop: 32px 48px;
    --main-padding-mobile: 0;
    --main-padding-desktop: 0;


    /* —————————— */
    /*   MARGINS  */
    /* —————————— */
    --default-margin-top: 48px;
    --buttons-margin-top: 20px;
    --badges-margin-top: 20px;


    /* —————————— */
    /*    TEXT    */
    /* —————————— */
    /* Font family */
    --font-family-sans: 'Cera Pro', sans-serif;
    --font-family-serif: serif;
    --font-family-mono: monospace;
    --font-size: inherit;
    --font-weight: inherit;
    --font-feature-settings: 'liga' on, 'calt' on;
    --line-height: inherit;
    --text-color: var(--foreground-style-dark);

    /* Display styles */
    /* Extra Small */
    --display-xs-font-size-mobile: 20px;
    --display-xs-font-weight-mobile: inherit;
    --display-xs-line-height-mobile: 30px;
    --display-xs-letter-spacing-mobile: 0;
    --display-xs-font-size-tablet: var(--display-xs-font-size-mobile);
    --display-xs-font-weight-tablet: var(--display-xs-font-weight-mobile);
    --display-xs-line-height-tablet: var(--display-xs-line-height-mobile);
    --display-xs-letter-spacing-tablet: var(--display-xs-letter-spacing-mobile);
    --display-xs-font-size-desktop: 24px;
    --display-xs-font-weight-desktop: inherit;
    --display-xs-line-height-desktop: 32px;
    --display-xs-letter-spacing-desktop: 0;
    --display-xs-font-size-wide: var(--display-xs-font-size-desktop);
    --display-xs-font-weight-wide: var(--display-xs-font-weight-desktop);
    --display-xs-line-height-wide: var(--display-xs-line-height-desktop);
    --display-xs-letter-spacing-wide: var(--display-xs-letter-spacing-desktop);
    /* Small */
    --display-sm-font-size-mobile: 24px;
    --display-sm-font-weight-mobile: inherit;
    --display-sm-line-height-mobile: 32px;
    --display-sm-letter-spacing-mobile: 0;
    --display-sm-font-size-tablet: var(--display-sm-font-size-mobile);
    --display-sm-font-weight-tablet: var(--display-sm-font-weight-mobile);
    --display-sm-line-height-tablet: var(--display-sm-line-height-mobile);
    --display-sm-letter-spacing-tablet: var(--display-sm-letter-spacing-mobile);
    --display-sm-font-size-desktop: 28px;
    --display-sm-font-weight-desktop: inherit;
    --display-sm-line-height-desktop: 36px;
    --display-sm-letter-spacing-desktop: 0;
    --display-sm-font-size-wide: var(--display-sm-font-size-desktop);
    --display-sm-font-weight-wide: var(--display-sm-font-weight-desktop);
    --display-sm-line-height-wide: var(--display-sm-line-height-desktop);
    --display-sm-letter-spacing-wide: var(--display-sm-letter-spacing-desktop);
    /* Medium */
    --display-md-font-size-mobile: 28px;
    --display-md-font-weight-mobile: inherit;
    --display-md-line-height-mobile: 36px;
    --display-md-letter-spacing-mobile: 0;
    --display-md-font-size-tablet: var(--display-md-font-size-mobile);
    --display-md-font-weight-tablet: var(--display-md-font-weight-mobile);
    --display-md-line-height-tablet: var(--display-md-line-height-mobile);
    --display-md-letter-spacing-tablet: var(--display-md-letter-spacing-mobile);
    --display-md-font-size-desktop: 36px;
    --display-md-font-weight-desktop: inherit;
    --display-md-line-height-desktop: 44px;
    --display-md-letter-spacing-desktop: -2%;
    --display-md-font-size-wide: var(--display-md-font-size-desktop);
    --display-md-font-weight-wide: var(--display-md-font-weight-desktop);
    --display-md-line-height-wide: var(--display-md-line-height-desktop);
    --display-md-letter-spacing-wide: var(--display-md-letter-spacing-desktop);
    /* Large */
    --display-lg-font-size-mobile: 36px;
    --display-lg-font-weight-mobile: inherit;
    --display-lg-line-height-mobile: 44px;
    --display-lg-letter-spacing-mobile: -2%;
    --display-lg-font-size-tablet: var(--display-lg-font-size-mobile);
    --display-lg-font-weight-tablet: var(--display-lg-font-weight-mobile);
    --display-lg-line-height-tablet: var(--display-lg-line-height-mobile);
    --display-lg-letter-spacing-tablet: var(--display-lg-letter-spacing-mobile);
    --display-lg-font-size-desktop: 48px;
    --display-lg-font-weight-desktop: inherit;
    --display-lg-line-height-desktop: 60px;
    --display-lg-letter-spacing-desktop: -2%;
    --display-lg-font-size-wide: var(--display-lg-font-size-desktop);
    --display-lg-font-weight-wide: var(--display-lg-font-weight-desktop);
    --display-lg-line-height-wide: var(--display-lg-line-height-desktop);
    --display-lg-letter-spacing-wide: var(--display-lg-letter-spacing-desktop);
    /* Extra Large */
    --display-xl-font-size-mobile: 48px;
    --display-xl-font-weight-mobile: inherit;
    --display-xl-line-height-mobile: 60px;
    --display-xl-letter-spacing-mobile: -2%;
    --display-xl-font-size-tablet: var(--display-xl-font-size-mobile);
    --display-xl-font-weight-tablet: var(--display-xl-font-weight-mobile);
    --display-xl-line-height-tablet: var(--display-xl-line-height-mobile);
    --display-xl-letter-spacing-tablet: var(--display-xl-letter-spacing-mobile);
    --display-xl-font-size-desktop: 60px;
    --display-xl-font-weight-desktop: inherit;
    --display-xl-line-height-desktop: 72px;
    --display-xl-letter-spacing-desktop: -2%;
    --display-xl-font-size-wide: var(--display-xl-font-size-desktop);
    --display-xl-font-weight-wide: var(--display-xl-font-weight-desktop);
    --display-xl-line-height-wide: var(--display-xl-line-height-desktop);
    --display-xl-letter-spacing-wide: var(--display-xl-letter-spacing-desktop);
    /* 2X Large */
    --display-2xl-font-size-mobile: 60px;
    --display-2xl-font-weight-mobile: inherit;
    --display-2xl-line-height-mobile: 72px;
    --display-2xl-letter-spacing-mobile: -2%;
    --display-2xl-font-size-tablet: var(--display-2xl-font-size-mobile);
    --display-2xl-font-weight-tablet: var(--display-2xl-font-weight-mobile);
    --display-2xl-line-height-tablet: var(--display-2xl-line-height-mobile);
    --display-2xl-letter-spacing-tablet: var(--display-2xl-letter-spacing-mobile);
    --display-2xl-font-size-desktop: 72px;
    --display-2xl-font-weight-desktop: inherit;
    --display-2xl-line-height-desktop: 90px;
    --display-2xl-letter-spacing-desktop: -2%;
    --display-2xl-font-size-wide: var(--display-2xl-font-size-desktop);
    --display-2xl-font-weight-wide: var(--display-2xl-font-weight-desktop);
    --display-2xl-line-height-wide: var(--display-2xl-line-height-desktop);
    --display-2xl-letter-spacing-wide: var(--display-2xl-letter-spacing-desktop);

    /* Text styles */
    /* Extra Small */
    --text-xs-font-size-mobile: 12px;
    --text-xs-font-weight-mobile: var(--text-xs-font-weight-desktop);
    --text-xs-line-height-mobile: 1.5;
    --text-xs-letter-spacing-mobile: var(--text-xs-letter-spacing-desktop);
    --text-xs-font-size-tablet: 13px;
    --text-xs-font-weight-tablet: var(--text-xs-font-weight-mobile);
    --text-xs-line-height-tablet: 1.5;
    --text-xs-letter-spacing-tablet: var(--text-xs-letter-spacing-mobile);
    --text-xs-font-size-desktop: 13px;
    --text-xs-font-weight-desktop: inherit;
    --text-xs-line-height-desktop: 1.5;
    --text-xs-letter-spacing-desktop: 0;
    --text-xs-font-size-wide: 13px;
    --text-xs-font-weight-wide: var(--text-xs-font-weight-desktop);
    --text-xs-line-height-wide: 1.5;
    --text-xs-letter-spacing-wide: var(--text-xs-letter-spacing-desktop);
    /* Small */
    --text-sm-font-size-mobile: 14px;
    --text-sm-font-weight-mobile: var(--text-sm-font-weight-desktop);
    --text-sm-line-height-mobile: 1.55;
    --text-sm-letter-spacing-mobile: var(--text-sm-letter-spacing-desktop);
    --text-sm-font-size-tablet: 15px;
    --text-sm-font-weight-tablet: var(--text-sm-font-weight-mobile);
    --text-sm-line-height-tablet: 1.55;
    --text-sm-letter-spacing-tablet: var(--text-sm-letter-spacing-mobile);
    --text-sm-font-size-desktop: 15px;
    --text-sm-font-weight-desktop: inherit;
    --text-sm-line-height-desktop: 1.6;
    --text-sm-letter-spacing-desktop: 0;
    --text-sm-font-size-wide: 16px;
    --text-sm-font-weight-wide: var(--text-sm-font-weight-desktop);
    --text-sm-line-height-wide: 1.6;
    --text-sm-letter-spacing-wide: var(--text-sm-letter-spacing-desktop);
    /* Medium */
    --text-md-font-size-mobile: 16px;
    --text-md-font-weight-mobile: var(--text-md-font-weight-desktop);
    --text-md-line-height-mobile: 1.6;
    --text-md-letter-spacing-mobile: var(--text-md-letter-spacing-desktop);
    --text-md-font-size-tablet: 17px;
    --text-md-font-weight-tablet: var(--text-md-font-weight-mobile);
    --text-md-line-height-tablet: 1.6;
    --text-md-letter-spacing-tablet: var(--text-md-letter-spacing-mobile);
    --text-md-font-size-desktop: 18px;
    --text-md-font-weight-desktop: inherit;
    --text-md-line-height-desktop: 1.65;
    --text-md-letter-spacing-desktop: 0;
    --text-md-font-size-wide: 18px;
    --text-md-font-weight-wide: var(--text-md-font-weight-desktop);
    --text-md-line-height-wide: 1.65;
    --text-md-letter-spacing-wide: var(--text-md-letter-spacing-desktop);
    /* Large */
    --text-lg-font-size-mobile: 18px;
    --text-lg-font-weight-mobile: var(--text-lg-font-weight-desktop);
    --text-lg-line-height-mobile: 1.6;
    --text-lg-letter-spacing-mobile: var(--text-lg-letter-spacing-desktop);
    --text-lg-font-size-tablet: 19px;
    --text-lg-font-weight-tablet: var(--text-lg-font-weight-mobile);
    --text-lg-line-height-tablet: 1.65;
    --text-lg-letter-spacing-tablet: var(--text-lg-letter-spacing-mobile);
    --text-lg-font-size-desktop: 20px;
    --text-lg-font-weight-desktop: inherit;
    --text-lg-line-height-desktop: 1.7;
    --text-lg-letter-spacing-desktop: 0;
    --text-lg-font-size-wide: 21px;
    --text-lg-font-weight-wide: var(--text-lg-font-weight-desktop);
    --text-lg-line-height-wide: 1.7;
    --text-lg-letter-spacing-wide: var(--text-lg-letter-spacing-desktop);
    /* Extra Large */
    --text-xl-font-size-mobile: var(--text-xl-font-size-desktop);
    --text-xl-font-weight-mobile: var(--text-xl-font-weight-desktop);
    --text-xl-line-height-mobile: var(--text-xl-line-height-desktop);
    --text-xl-letter-spacing-mobile: var(--text-xl-letter-spacing-desktop);
    --text-xl-font-size-tablet: var(--text-xl-font-size-mobile);
    --text-xl-font-weight-tablet: var(--text-xl-font-weight-mobile);
    --text-xl-line-height-tablet: var(--text-xl-line-height-mobile);
    --text-xl-letter-spacing-tablet: var(--text-xl-letter-spacing-mobile);
    --text-xl-font-size-desktop: 20px;
    --text-xl-font-weight-desktop: inherit;
    --text-xl-line-height-desktop: 30px;
    --text-xl-letter-spacing-desktop: 0;
    --text-xl-font-size-wide: var(--text-xl-font-size-desktop);
    --text-xl-font-weight-wide: var(--text-xl-font-weight-desktop);
    --text-xl-line-height-wide: var(--text-xl-line-height-desktop);
    --text-xl-letter-spacing-wide: var(--text-xl-letter-spacing-desktop);


    /* Heading styles */
    /* H1 */
    --h1-font-size-mobile: 32px;
    --h1-font-weight-mobile: 600;
    --h1-line-height-mobile: 1.15;
    --h1-letter-spacing-mobile: 0;
    --h1-margin-top-mobile: 40px;
    --h1-margin-bottom-mobile: 20px;

    --h1-font-size-tablet: 40px;
    --h1-font-weight-tablet: var(--h1-font-weight-mobile);
    --h1-line-height-tablet: 1.12;
    --h1-letter-spacing-tablet: var(--h1-letter-spacing-mobile);
    --h1-margin-top-tablet: var(--h1-margin-top-mobile);
    --h1-margin-bottom-tablet: var(--h1-margin-bottom-mobile);

    --h1-font-size-desktop: 52px;
    --h1-font-weight-desktop: 600;
    --h1-line-height-desktop: 1.08;
    --h1-letter-spacing-desktop: 0;
    --h1-margin-top-desktop: 48px;
    --h1-margin-bottom-desktop: 24px;

    --h1-font-size-wide: 64px;
    --h1-font-weight-wide: var(--h1-font-weight-desktop);
    --h1-line-height-wide: 1.06;
    --h1-letter-spacing-wide: var(--h1-letter-spacing-desktop);
    --h1-margin-top-wide: var(--h1-margin-top-desktop);
    --h1-margin-bottom-wide: var(--h1-margin-bottom-desktop);

    /* H2 */
    --h2-font-size-mobile: 24px;
    --h2-font-weight-mobile: 600;
    --h2-line-height-mobile: 1.2;
    --h2-letter-spacing-mobile: 0;
    --h2-margin-top-mobile: 32px;
    --h2-margin-bottom-mobile: 16px;

    --h2-font-size-tablet: 30px;
    --h2-font-weight-tablet: var(--h2-font-weight-mobile);
    --h2-line-height-tablet: 1.17;
    --h2-letter-spacing-tablet: var(--h2-letter-spacing-mobile);
    --h2-margin-top-tablet: var(--h2-margin-top-mobile);
    --h2-margin-bottom-tablet: var(--h2-margin-bottom-mobile);

    --h2-font-size-desktop: 38px;
    --h2-font-weight-desktop: 600;
    --h2-line-height-desktop: 1.12;
    --h2-letter-spacing-desktop: 0;
    --h2-margin-top-desktop: 40px;
    --h2-margin-bottom-desktop: 20px;

    --h2-font-size-wide: 46px;
    --h2-font-weight-wide: var(--h2-font-weight-desktop);
    --h2-line-height-wide: 1.1;
    --h2-letter-spacing-wide: var(--h2-letter-spacing-desktop);
    --h2-margin-top-wide: var(--h2-margin-top-desktop);
    --h2-margin-bottom-wide: var(--h2-margin-bottom-desktop);

    /* H3 */
    --h3-font-size-mobile: 20px;
    --h3-font-weight-mobile: 600;
    --h3-line-height-mobile: 1.25;
    --h3-letter-spacing-mobile: 0;
    --h3-margin-top-mobile: 32px;
    --h3-margin-bottom-mobile: 12px;

    --h3-font-size-tablet: 24px;
    --h3-font-weight-tablet: var(--h3-font-weight-mobile);
    --h3-line-height-tablet: 1.22;
    --h3-letter-spacing-tablet: var(--h3-letter-spacing-mobile);
    --h3-margin-top-tablet: var(--h3-margin-top-mobile);
    --h3-margin-bottom-tablet: var(--h3-margin-bottom-mobile);

    --h3-font-size-desktop: 28px;
    --h3-font-weight-desktop: 600;
    --h3-line-height-desktop: 1.18;
    --h3-letter-spacing-desktop: 0;
    --h3-margin-top-desktop: 32px;
    --h3-margin-bottom-desktop: 16px;

    --h3-font-size-wide: 34px;
    --h3-font-weight-wide: var(--h3-font-weight-desktop);
    --h3-line-height-wide: 1.15;
    --h3-letter-spacing-wide: var(--h3-letter-spacing-desktop);
    --h3-margin-top-wide: var(--h3-margin-top-desktop);
    --h3-margin-bottom-wide: var(--h3-margin-bottom-desktop);

    /* H4 */
    --h4-font-size-mobile: 17px;
    --h4-font-weight-mobile: 600;
    --h4-line-height-mobile: 1.3;
    --h4-letter-spacing-mobile: 0;
    --h4-margin-top-mobile: 20px;
    --h4-margin-bottom-mobile: 8px;

    --h4-font-size-tablet: 20px;
    --h4-font-weight-tablet: var(--h4-font-weight-mobile);
    --h4-line-height-tablet: 1.28;
    --h4-letter-spacing-tablet: var(--h4-letter-spacing-mobile);
    --h4-margin-top-tablet: var(--h4-margin-top-mobile);
    --h4-margin-bottom-tablet: var(--h4-margin-bottom-mobile);

    --h4-font-size-desktop: 22px;
    --h4-font-weight-desktop: 600;
    --h4-line-height-desktop: 1.25;
    --h4-letter-spacing-desktop: 0;
    --h4-margin-top-desktop: 32px;
    --h4-margin-bottom-desktop: 12px;

    --h4-font-size-wide: 26px;
    --h4-font-weight-wide: var(--h4-font-weight-desktop);
    --h4-line-height-wide: 1.22;
    --h4-letter-spacing-wide: var(--h4-letter-spacing-desktop);
    --h4-margin-top-wide: var(--h4-margin-top-desktop);
    --h4-margin-bottom-wide: var(--h4-margin-bottom-desktop);


    /* —————————— */
    /* PARAGRAPHS */
    /* —————————— */
    --p-margin-top-mobile: 0;
    --p-margin-bottom-mobile: 16px;
    --p-margin-top-tablet: var(--p-margin-top-mobile);
    --p-margin-bottom-tablet: var(--p-margin-bottom-mobile);
    --p-margin-top-desktop: 0;
    --p-margin-bottom-desktop: 16px;
    --p-margin-top-wide: var(--p-margin-top-desktop);
    --p-margin-bottom-wide: var(--p-margin-bottom-desktop);


    /* Lists */
    --list-padding: 0 0 0 0;
    --list-margin: 0;
    --list-nested-margin: 0 0 1em 0;
    --list-item-margin-bottom: 0.5em;
    /* ol */
    --list-ordered-item-padding-left-level-1: 1.5em;
    --list-ordered-item-padding-left-level-2: 2em;
    --list-ordered-item-padding-left-level-3: 2.75em;
    --list-ordered-item-padding-left-level-4: 1.5em;
    --list-ordered-item-padding-left-level-5: 1.5em;
    /* ul */
    --list-unsorted-item-padding-left-level-1: 1em;
    --list-unsorted-item-padding-left-level-2: 1em;
    --list-unsorted-bullet-symbol-level-1: '•';
    --list-unsorted-bullet-symbol-level-2: '•';
    /* Checklist */
    --list-checklist-item-gap: 12px;
    --list-checklist-bullet-symbol: "★";
    --list-checklist-bullet-vertical-offset: -3px;


    /* —————————— */
    /*   SPACING  */
    /* —————————— */
    --spacing-3x-small: 8px;
    --spacing-2x-small: 12px;
    --spacing-x-small: 16px;
    --spacing-small: 20px;
    --spacing-medium: 24px;
    --spacing-large: 32px;
    --spacing-x-large: 40px;
    --spacing-2x-large: 48px;
    --spacing-3x-large: 64px;
    --spacing-4x-large: 80px;



    /* ————————————————————— */
    /*   MAX CONTENT WIDTH   */
    /* ————————————————————— */
    --max-content-width: 740px;


    /* ————————————— */
    /* FOCUS EFFECTS */
    /* ————————————— */
    --focus-ring-border: solid 1px transparent;
    --focus-ring-shadow: 0px 0px 0px 1px white, 0px 0px 0px 4px #0A74FF;


    /* —————————————————————————————— */
    /* BACKGROUND & FOREGROUND STYLES */
    /* —————————————————————————————— */
    /* Background styles */
    --background-style-light: #FFFFFF;
    --background-style-dark: #F8F9FC;
    --background-style-dark-alt: #EAECF5;
    --background-style-accent: gold;
    --background-style-accent-alt: rgba(240, 204, 0, 0.2);

    /* Text colors */
    --foreground-style-light: #FAFAFA;
    --foreground-style-dark: #181D27;
    --foreground-style-dark-alt: #414651;
    --foreground-style-accent: #0047A3;
    --foreground-style-accent-alt: #0058CC;
    --success-color: #067647;
    /* Green */
    --warning-color: #B54708;
    /* Yellow */
    --danger-color: #D92D20;
    /* Red */
    --faded-color: #717680;

    /* ———— */
    /* LINK */
    /* ———— */
    --link-gap: 4px;
    --link-font-family: inherit;
    --link-font-weight: inherit;
    --link-font-size: inherit;
    --link-line-height: inherit;

    /* Link Default - no class, no inline styles, only <a> */
    --link-default-foreground: var(--link-brand-foreground);
    --link-default-background: transparent;
    --link-default-border: none;
    --link-default-box-shadow: none;
    --link-default-border-radius: 0;
    --link-default-padding: 0;
    --link-default-decoration: none;
    --link-default-foreground-hover: inherit;
    --link-default-background-hover: transparent;
    --link-default-border-hover: none;
    --link-default-box-shadow-hover: none;
    --link-default-border-radius-hover: var(--link-default-border-radius);
    --link-default-padding-hover: 0;
    --link-default-decoration-hover: underline;

    /* Link Brand */
    --link-brand-foreground: var(--color-secondary-600);
    --link-brand-background: transparent;
    --link-brand-border: none;
    --link-brand-box-shadow: none;
    --link-brand-border-radius: 0;
    --link-brand-padding: 0;
    --link-brand-decoration: none;
    --link-brand-foreground-hover: var(--link-brand-foreground);
    --link-brand-background-hover: transparent;
    --link-brand-border-hover: none;
    --link-brand-box-shadow-hover: none;
    --link-brand-border-radius-hover: var(--link-brand-border-radius);
    --link-brand-padding-hover: 0;
    --link-brand-decoration-hover: underline;

    /* Link BW */
    --link-bw-foreground: var(--color-fg-black);
    --link-bw-background: transparent;
    --link-bw-border: none;
    --link-bw-box-shadow: none;
    --link-bw-border-radius: 0;
    --link-bw-padding: 0;
    --link-bw-decoration: inherit;
    --link-bw-foreground-hover: var(--link-bw-foreground);
    --link-bw-background-hover: transparent;
    --link-bw-border-hover: none;
    --link-bw-box-shadow-hover: none;
    --link-bw-border-radius-hover: var(--link-bw-border-radius);
    --link-bw-padding-hover: 0;
    --link-bw-decoration-hover: underline;

    /* Link Inverse */
    --link-inverse-foreground: white;
    --link-inverse-background: transparent;
    --link-inverse-border: none;
    --link-inverse-box-shadow: none;
    --link-inverse-border-radius: 0;
    --link-inverse-padding: 0;
    --link-inverse-decoration: inherit;
    --link-inverse-foreground-hover: var(--link-inverse-foreground);
    --link-inverse-background-hover: transparent;
    --link-inverse-border-hover: none;
    --link-inverse-box-shadow-hover: none;
    --link-inverse-border-radius-hover: var(--link-inverse-border-radius);
    --link-inverse-padding-hover: 0;
    --link-inverse-decoration-hover: underline;


    /* ———————— */
    /* BIG LINK */
    /* ———————— */
    /* Link color A */
    --big-link-color-a-foreground: var(--link-color-a-foreground);
    --big-link-color-a-background: var(--link-color-a-background);
    --big-link-color-a-border: var(--link-color-a-border);
    --big-link-color-a-box-shadow: var(--link-color-a-box-shadow);
    --big-link-color-a-border-radius: var(--link-color-a-border-radius);
    --big-link-color-a-padding: var(--link-color-a-padding);
    --big-link-color-a-decoration: var(--link-color-a-decoration);
    --big-link-color-a-foreground-hover: var(--link-color-a-foreground-hover);
    --big-link-color-a-background-hover: var(--link-color-a-background-hover);
    --big-link-color-a-border-hover: var(--link-color-a-border-hover);
    --big-link-color-a-box-shadow-hover: var(--link-color-a-box-shadow-hover);
    --big-link-color-a-border-radius-hover: var(--link-color-a-border-radius-hover);
    --big-link-color-a-padding-hover: var(--link-color-a-padding-hover);
    --big-link-color-a-decoration-hover: var(--link-color-a-decoration-hover);

    /* Link color B */
    --big-link-bw-foreground: var(--link-bw-foreground);
    --big-link-bw-background: var(--link-bw-background);
    --big-link-bw-border: var(--link-bw-border);
    --big-link-bw-box-shadow: var(--link-bw-box-shadow);
    --big-link-bw-border-radius: var(--link-bw-border-radius);
    --big-link-bw-padding: var(--link-bw-padding);
    --big-link-bw-decoration: var(--link-bw-decoration);
    --big-link-bw-foreground-hover: var(--link-bw-foreground-hover);
    --big-link-bw-background-hover: var(--link-bw-background-hover);
    --big-link-bw-border-hover: var(--link-bw-border-hover);
    --big-link-bw-box-shadow-hover: var(--link-bw-box-shadow-hover);
    --big-link-bw-border-radius-hover: var(--link-bw-border-radius-hover);
    --big-link-bw-padding-hover: var(--link-bw-padding-hover);
    --big-link-bw-decoration-hover: var(--link-bw-decoration-hover);

    /* Link inverse */
    --big-link-inverse-foreground: var(--link-inverse-foreground);
    --big-link-inverse-background: var(--link-inverse-background);
    --big-link-inverse-border: var(--link-inverse-border);
    --big-link-inverse-box-shadow: var(--link-inverse-box-shadow);
    --big-link-inverse-border-radius: var(--link-inverse-border-radius);
    --big-link-inverse-padding: var(--link-inverse-padding);
    --big-link-inverse-decoration: var(--link-inverse-decoration);
    --big-link-inverse-foreground-hover: var(--link-inverse-foreground-hover);
    --big-link-inverse-background-hover: var(--link-inverse-background-hover);
    --big-link-inverse-border-hover: var(--link-inverse-border-hover);
    --big-link-inverse-box-shadow-hover: var(--link-inverse-box-shadow-hover);
    --big-link-inverse-border-radius-hover: var(--link-inverse-border-radius-hover);
    --big-link-inverse-padding-hover: var(--link-inverse-padding-hover);
    --big-link-inverse-decoration-hover: var(--link-inverse-decoration-hover);


    /* ——————————— */
    /* LINK BUTTON */
    /* ——————————— */
    --link-button-brand-color: var(--color-secondary-600);
    --link-button-brand-border: none;
    --link-button-brand-box-shadow: none;
    --link-button-brand-color-hover: var(--link-button-brand-color);
    --link-button-brand-border-hover: none;
    --link-button-brand-box-shadow-hover: none;

    --link-button-bw-color: inherit;
    --link-button-bw-border: none;
    --link-button-bw-box-shadow: none;
    --link-button-bw-color-hover: inherit;
    --link-button-bw-border-hover: none;
    --link-button-bw-box-shadow-hover: none;

    --link-button-inverse-color: inherit;
    --link-button-inverse-border: none;
    --link-button-inverse-box-shadow: none;
    --link-button-inverse-color-hover: inherit;
    --link-button-inverse-border-hover: none;
    --link-button-inverse-box-shadow-hover: none;


    /* —————————— */
    /* BOX BUTTON */
    /* —————————— */
    --default-button-box-shadow: none;
    --button-font-family: var(--font-family-sans);
    --button-font-weight: 500;
    --button-box-shadow: none;

    /* Solid Brand */
    --button-brand-solid-background: var(--color-brand-600);
    --button-brand-solid-background-hover: var(--color-brand-700);
    --button-brand-solid-color: var(--color-fg-white);
    --button-brand-solid-color-hover: var(--color-fg-white);
    --button-brand-solid-border: none;
    --button-brand-solid-border-hover: var(--button-brand-solid-border);
    --button-brand-solid-box-shadow: var(--default-button-box-shadow);
    --button-brand-solid-box-shadow-hover: var(--button-brand-solid-box-shadow);

    /* Solid BW */
    --button-bw-solid-background: var(--color-neutral-950);
    --button-bw-solid-background-hover: var(--button-bw-solid-background);
    --button-bw-solid-color: var(--color-white);
    --button-bw-solid-color-hover: var(--button-bw-solid-color);
    --button-bw-solid-border: none;
    --button-bw-solid-border-hover: var(--button-bw-solid-border);
    --button-bw-solid-box-shadow: var(--default-button-box-shadow);
    --button-bw-solid-box-shadow-hover: var(--button-bw-solid-box-shadow);

    /* Solid Inverse */
    --button-inverse-solid-background: var(--color-white);
    --button-inverse-solid-background-hover: var(--button-inverse-solid-background);
    --button-inverse-solid-color: var(--color-brand-600);
    --button-inverse-solid-color-hover: var(--button-inverse-solid-color);
    --button-inverse-solid-border: 1px solid rgba(10, 13, 18, 0.18);
    --button-inverse-solid-border-hover: var(--button-inverse-solid-border);
    --button-inverse-solid-box-shadow: var(--default-button-box-shadow);
    --button-inverse-solid-box-shadow-hover: var(--button-inverse-solid-box-shadow);

    /* Solid Disabled */
    --button-disabled-solid-background: #e5e7eb;
    --button-disabled-solid-color: #9ca3af;
    --button-disabled-solid-border: none;
    --button-disabled-solid-box-shadow: none;

    /* Outline Brand */
    --button-brand-outline-background: transparent;
    --button-brand-outline-background-hover: var(--color-brand-25);
    --button-brand-outline-color: var(--color-brand-600);
    --button-brand-outline-color-hover: var(--button-brand-outline-color);
    --button-brand-outline-border: 1px solid var(--color-brand-600, #D5D7DA);
    --button-brand-outline-border-hover: var(--button-brand-outline-border);
    --button-brand-outline-box-shadow: var(--default-button-box-shadow);
    --button-brand-outline-box-shadow-hover: var(--button-brand-outline-box-shadow);

    /* Outline BW */
    --button-bw-outline-background: transparent;
    --button-bw-outline-background-hover: rgba(0, 0, 0, 0.10);
    --button-bw-outline-color: var(--color-neutral-950);
    --button-bw-outline-color-hover: var(--color-neutral-950);
    --button-bw-outline-border: 1px solid var(--color-neutral-950);
    --button-bw-outline-border-hover: var(--button-bw-outline-border);
    --button-bw-outline-box-shadow: var(--default-button-box-shadow);
    --button-bw-outline-box-shadow-hover: var(--button-bw-outline-box-shadow);

    /* Outline Inverse */
    --button-inverse-outline-background: transparent;
    --button-inverse-outline-background-hover: rgba(255, 255, 255, 0.10);
    --button-inverse-outline-color: var(--color-white);
    --button-inverse-outline-color-hover: var(--button-inverse-outline-color);
    --button-inverse-outline-border: 1px solid var(--color-white);
    --button-inverse-outline-border-hover: var(--button-inverse-outline-border);
    --button-inverse-outline-box-shadow: var(--default-button-box-shadow);
    --button-inverse-outline-box-shadow-hover: var(--button-inverse-outline-box-shadow);

    /* Outline Disabled */
    --button-disabled-outline-background: #f3f4f6;
    --button-disabled-outline-color: #9ca3af;
    --button-disabled-outline-border: 1px solid #e5e7eb;
    --button-disabled-outline-box-shadow: none;

    /* Ghost Brand */
    --button-brand-ghost-background: transparent;
    --button-brand-ghost-background-hover: var(--button-brand-outline-background-hover);
    --button-brand-ghost-color: var(--button-brand-outline-color);
    --button-brand-ghost-color-hover: var(--button-brand-outline-color-hover);
    --button-brand-ghost-border: solid 1px transparent;
    --button-brand-ghost-border-hover: solid 1px transparent;
    --button-brand-ghost-box-shadow: none;
    --button-brand-ghost-box-shadow-hover: none;

    /* Ghost BW */
    --button-bw-ghost-background: transparent;
    --button-bw-ghost-background-hover: var(--button-bw-outline-background-hover);
    --button-bw-ghost-color: #181D27;
    --button-bw-ghost-color-hover: #0A0D12;
    --button-bw-ghost-border: solid 1px transparent;
    --button-bw-ghost-border-hover: solid 1px transparent;
    --button-bw-ghost-box-shadow: none;
    --button-bw-ghost-box-shadow-hover: none;

    /* Ghost Inverse */
    --button-inverse-ghost-background: transparent;
    --button-inverse-ghost-background-hover: var(--button-inverse-outline-background-hover);
    --button-inverse-ghost-color: var(--button-inverse-outline-color);
    --button-inverse-ghost-color-hover: var(--button-inverse-ghost-color);
    --button-inverse-ghost-border: solid 1px transparent;
    --button-inverse-ghost-border-hover: solid 1px transparent;
    --button-inverse-ghost-box-shadow: none;
    --button-inverse-ghost-box-shadow-hover: none;

    /* Ghost Disabled */
    --button-disabled-ghost-background: transparent;
    --button-disabled-ghost-color: #9ca3af;
    --button-disabled-ghost-border: none;
    --button-disabled-ghost-box-shadow: none;


    /* Sizes */
    --button-small-height: 36px;
    --button-small-padding: 8px 12px;
    --button-small-gap: 4px;
    --button-small-icon-size: 16px;
    --button-small-font-size: 12px;
    --button-small-line-height: 16px;
    --button-small-border-radius: 0;

    --button-medium-height: 40px;
    --button-medium-padding: 10px 16px;
    --button-medium-gap: 6px;
    --button-medium-icon-size: 20px;
    --button-medium-font-size: 18px;
    --button-medium-line-height: 28px;
    --button-medium-border-radius: 0;

    --button-large-height: 48px;
    --button-large-padding: 12px 20px;
    --button-large-gap: 8px;
    --button-large-icon-size: 24px;
    --button-large-font-size: 20px;
    --button-large-line-height: 30px;
    --button-large-border-radius: 0;

    /* ———————————— */
    /* Extra button */
    /* ———————————— */
    /* Extra Brand */
    --button-brand-extra-background: var(--button-brand-solid-background);
    --button-brand-extra-color: var(--button-brand-solid-color);
    --button-brand-extra-border: var(--button-brand-solid-border);
    --button-brand-extra-box-shadow: var(--button-brand-solid-box-shadow);
    --button-brand-extra-background-hover: var(--button-brand-solid-background-hover);
    --button-brand-extra-color-hover: var(--button-brand-solid-color-hover);
    --button-brand-extra-border-hover: var(--button-brand-solid-border-hover);
    --button-brand-extra-box-shadow-hover: var(--button-brand-solid-box-shadow-hover);

    --button-small-brand-extra-border-radius: inherit;
    --button-small-brand-extra-height: inherit;
    --button-small-brand-extra-padding: inherit;
    --button-small-brand-extra-gap: inherit;
    --button-small-brand-extra-icon-size: inherit;
    --button-small-brand-extra-font-size: inherit;
    --button-small-brand-extra-line-height: inherit;
    --button-small-brand-extra-border-radius-hover: inherit;
    --button-small-brand-extra-height-hover: inherit;
    --button-small-brand-extra-padding-hover: inherit;
    --button-small-brand-extra-gap-hover: inherit;
    --button-small-brand-extra-icon-size-hover: inherit;
    --button-small-brand-extra-font-size-hover: inherit;
    --button-small-brand-extra-line-height-hover: inherit;

    --button-medium-brand-extra-border-radius: inherit;
    --button-medium-brand-extra-height: inherit;
    --button-medium-brand-extra-padding: inherit;
    --button-medium-brand-extra-gap: inherit;
    --button-medium-brand-extra-icon-size: inherit;
    --button-medium-brand-extra-font-size: inherit;
    --button-medium-brand-extra-line-height: inherit;
    --button-medium-brand-extra-border-radius-hover: inherit;
    --button-medium-brand-extra-height-hover: inherit;
    --button-medium-brand-extra-padding-hover: inherit;
    --button-medium-brand-extra-gap-hover: inherit;
    --button-medium-brand-extra-icon-size-hover: inherit;
    --button-medium-brand-extra-font-size-hover: inherit;
    --button-medium-brand-extra-line-height-hover: inherit;

    --button-large-brand-extra-border-radius: inherit;
    --button-large-brand-extra-height: inherit;
    --button-large-brand-extra-padding: inherit;
    --button-large-brand-extra-gap: inherit;
    --button-large-brand-extra-icon-size: inherit;
    --button-large-brand-extra-font-size: inherit;
    --button-large-brand-extra-line-height: inherit;
    --button-large-brand-extra-border-radius-hover: inherit;
    --button-large-brand-extra-height-hover: inherit;
    --button-large-brand-extra-padding-hover: inherit;
    --button-large-brand-extra-gap-hover: inherit;
    --button-large-brand-extra-icon-size-hover: inherit;
    --button-large-brand-extra-font-size-hover: inherit;
    --button-large-brand-extra-line-height-hover: inherit;

    /* Extra Color B */
    --button-bw-extra-background: var(--button-bw-solid-background);
    --button-bw-extra-color: var(--button-bw-solid-color);
    --button-bw-extra-border: var(--button-bw-solid-border);
    --button-bw-extra-box-shadow: var(--button-bw-solid-box-shadow);
    --button-bw-extra-background-hover: var(--button-bw-solid-background-hover);
    --button-bw-extra-color-hover: var(--button-bw-solid-color-hover);
    --button-bw-extra-border-hover: var(--button-bw-solid-border-hover);
    --button-bw-extra-box-shadow-hover: var(--button-bw-solid-box-shadow-hover);

    --button-small-bw-extra-border-radius: inherit;
    --button-small-bw-extra-height: inherit;
    --button-small-bw-extra-padding: inherit;
    --button-small-bw-extra-gap: inherit;
    --button-small-bw-extra-icon-size: inherit;
    --button-small-bw-extra-font-size: inherit;
    --button-small-bw-extra-line-height: inherit;
    --button-small-bw-extra-border-radius-hover: inherit;
    --button-small-bw-extra-height-hover: inherit;
    --button-small-bw-extra-padding-hover: inherit;
    --button-small-bw-extra-gap-hover: inherit;
    --button-small-bw-extra-icon-size-hover: inherit;
    --button-small-bw-extra-font-size-hover: inherit;
    --button-small-bw-extra-line-height-hover: inherit;

    --button-medium-bw-extra-border-radius: inherit;
    --button-medium-bw-extra-height: inherit;
    --button-medium-bw-extra-padding: inherit;
    --button-medium-bw-extra-gap: inherit;
    --button-medium-bw-extra-icon-size: inherit;
    --button-medium-bw-extra-font-size: inherit;
    --button-medium-bw-extra-line-height: inherit;
    --button-medium-bw-extra-border-radius-hover: inherit;
    --button-medium-bw-extra-height-hover: inherit;
    --button-medium-bw-extra-padding-hover: inherit;
    --button-medium-bw-extra-gap-hover: inherit;
    --button-medium-bw-extra-icon-size-hover: inherit;
    --button-medium-bw-extra-font-size-hover: inherit;
    --button-medium-bw-extra-line-height-hover: inherit;

    --button-large-bw-extra-border-radius: inherit;
    --button-large-bw-extra-height: inherit;
    --button-large-bw-extra-padding: inherit;
    --button-large-bw-extra-gap: inherit;
    --button-large-bw-extra-icon-size: inherit;
    --button-large-bw-extra-font-size: inherit;
    --button-large-bw-extra-line-height: inherit;
    --button-large-bw-extra-border-radius-hover: inherit;
    --button-large-bw-extra-height-hover: inherit;
    --button-large-bw-extra-padding-hover: inherit;
    --button-large-bw-extra-gap-hover: inherit;
    --button-large-bw-extra-icon-size-hover: inherit;
    --button-large-bw-extra-font-size-hover: inherit;
    --button-large-bw-extra-line-height-hover: inherit;

    /* Extra Inverse */
    --button-inverse-extra-background: var(--button-inverse-solid-background);
    --button-inverse-extra-color: var(--button-inverse-solid-color);
    --button-inverse-extra-border: var(--button-inverse-solid-border);
    --button-inverse-extra-box-shadow: var(--button-inverse-solid-box-shadow);
    --button-inverse-extra-background-hover: var(--button-inverse-solid-background-hover);
    --button-inverse-extra-color-hover: var(--button-inverse-solid-color-hover);
    --button-inverse-extra-border-hover: var(--button-inverse-solid-border-hover);
    --button-inverse-extra-box-shadow-hover: var(--button-inverse-solid-box-shadow-hover);

    --button-small-inverse-extra-border-radius: inherit;
    --button-small-inverse-extra-height: inherit;
    --button-small-inverse-extra-padding: inherit;
    --button-small-inverse-extra-gap: inherit;
    --button-small-inverse-extra-icon-size: inherit;
    --button-small-inverse-extra-font-size: inherit;
    --button-small-inverse-extra-line-height: inherit;
    --button-small-inverse-extra-border-radius-hover: inherit;
    --button-small-inverse-extra-height-hover: inherit;
    --button-small-inverse-extra-padding-hover: inherit;
    --button-small-inverse-extra-gap-hover: inherit;
    --button-small-inverse-extra-icon-size-hover: inherit;
    --button-small-inverse-extra-font-size-hover: inherit;
    --button-small-inverse-extra-line-height-hover: inherit;

    --button-medium-inverse-extra-border-radius: inherit;
    --button-medium-inverse-extra-height: inherit;
    --button-medium-inverse-extra-padding: inherit;
    --button-medium-inverse-extra-gap: inherit;
    --button-medium-inverse-extra-icon-size: inherit;
    --button-medium-inverse-extra-font-size: inherit;
    --button-medium-inverse-extra-line-height: inherit;
    --button-medium-inverse-extra-border-radius-hover: inherit;
    --button-medium-inverse-extra-height-hover: inherit;
    --button-medium-inverse-extra-padding-hover: inherit;
    --button-medium-inverse-extra-gap-hover: inherit;
    --button-medium-inverse-extra-icon-size-hover: inherit;
    --button-medium-inverse-extra-font-size-hover: inherit;
    --button-medium-inverse-extra-line-height-hover: inherit;

    --button-large-inverse-extra-border-radius: inherit;
    --button-large-inverse-extra-height: inherit;
    --button-large-inverse-extra-padding: inherit;
    --button-large-inverse-extra-gap: inherit;
    --button-large-inverse-extra-icon-size: inherit;
    --button-large-inverse-extra-font-size: inherit;
    --button-large-inverse-extra-line-height: inherit;
    --button-large-inverse-extra-border-radius-hover: inherit;
    --button-large-inverse-extra-height-hover: inherit;
    --button-large-inverse-extra-padding-hover: inherit;
    --button-large-inverse-extra-gap-hover: inherit;
    --button-large-inverse-extra-icon-size-hover: inherit;
    --button-large-inverse-extra-font-size-hover: inherit;
    --button-large-inverse-extra-line-height-hover: inherit;

    /* Extra Disabled */
    --button-disabled-extra-background: var(--button-disabled-ghost-background);
    --button-disabled-extra-color: var(--button-disabled-ghost-color);
    --button-disabled-extra-border: var(--button-disabled-ghost-border);
    --button-disabled-extra-box-shadow: var(--button-disabled-ghost-box-shadow);


    /* ————— */
    /* IMAGE */
    /* ————— */
    --image-border-radius: 0;
    --image-aspect-ratio: auto;
    --image-transform: scale(1.05);
    --image-overlay-background: rgba(0, 0, 0, 0.5);
    --image-overlay-color: white;
    --image-overlay-size: 4rem;
    --image-overlay-font-weight: var(--font-weight-regular);
    --image-overlay-line-height: var(--line-height-x-large);
    --image-row-gap: 1rem;
    --image-column-gap: 2rem;


    /* ————— */
    /* VIDEO */
    /* ————— */
    --video-border-radius: 8px;


    /* ————————— */
    /* LIST ITEM */
    /* ————————— */
    --list-item-gap: 20px 40px;
    --list-item-thumb-aspect-ratio: 3/2;
    --list-item-body-gap: 8px;
    --list-item-body-padding: 0 48px 0 0;
    --list-item-horizontal-thumb-width: 360px;


    /* ———— */
    /* CARD */
    /* ———— */
    --card-border-width: 1px;
    --card-border-style: solid;
    --card-border-radius: 0;
    --card-min-height: auto;
    --card-height: max-content;
    --card-image-border-radius: 0;
    --card-horizontal-gap-mobile: 32px;
    --card-horizontal-body-padding-mobile: 0 20px 20px 20px;
    --card-horizontal-image-padding-mobile: 20px;
    --card-horizontal-gap-tablet: 0;
    --card-horizontal-body-padding-tablet: 24px;
    --card-horizontal-image-padding-tablet: 24px;
    --card-horizontal-gap-desktop: 0;
    --card-horizontal-body-padding-desktop: 56px;
    --card-horizontal-image-padding-desktop: 40px;
    --card-horizontal-gap-wide: 0;
    --card-horizontal-body-padding-wide: 56px;
    --card-horizontal-image-padding-wide: 40px;
    --card-vertical-gap: 32px;
    --card-vertical-body-padding: 0 20px 20px 20px;
    --card-vertical-image-padding: 20px 20px 0 20px;


    /* ———————————— */
    /* FEATURE CARD */
    /* ———————————— */
    /* resting */
    --feature-card-gap: 12px;
    --feature-card-foreground: inherit;
    --feature-card-background: var(--color-white);
    --feature-card-border-width: 0;
    --feature-card-border-style: solid;
    --feature-card-border-color: transparent;
    --feature-card-border-radius: 8px;
    --feature-card-image-border-radius: 4px;
    --feature-card-shadow: 0 3px 8px -1px rgba(10, 13, 18, 0.15);
    /* hover */
    --feature-card-foreground-hover: inherit;
    --feature-card-background-hover: inherit;
    --feature-card-border-width-hover: inherit;
    --feature-card-border-style-hover: inherit;
    --feature-card-border-color-hover: inherit;
    --feature-card-border-radius-hover: inherit;
    --feature-card-image-border-radius-hover: inherit;
    --feature-card-shadow-hover: 0 3px 8px -1px rgba(10, 13, 18, 0.35);
    /* responsivity */
    --feature-card-gap-mobile: 12px;
    --feature-card-gap-tablet: 12px;
    --feature-card-gap-desktop: 12px;
    --feature-card-gap-wide: 12px;
    --feature-card-image-width-mobile: 100px;
    --feature-card-image-height-mobile: 100px;
    --feature-card-image-width-tablet: 124px;
    --feature-card-image-height-tablet: 124px;
    --feature-card-image-width-desktop: 124px;
    --feature-card-image-height-desktop: 124px;
    --feature-card-image-width-wide: 124px;
    --feature-card-image-height-wide: 124px;
    --feature-card-padding-mobile: 8px;
    --feature-card-padding-tablet: 8px;
    --feature-card-padding-desktop: 8px;
    --feature-card-padding-wide: 8px;
    --feature-card-body-padding-mobile: 0;
    --feature-card-body-padding-tablet: 0;
    --feature-card-body-padding-desktop: 0;
    --feature-card-body-padding-wide: 0;


    /* —————————————— */
    /* IDENTITY CARD */
    /* —————————————— */
    --identity-card-border-width: 1px;
    --identity-card-border-style: solid;
    --identity-card-border-radius: 0;
    --identity-card-min-height: auto;
    --identity-card-height: max-content;
    --identity-card-image-border-radius: 0;
    --identity-card-horizontal-gap-desktop: 0;
    --identity-card-horizontal-body-padding-desktop: 56px 56px 56px 56px;
    --identity-card-horizontal-reversed-body-padding-desktop: 56px 56px 56px 56px;
    --identity-card-horizontal-image-padding-desktop: 40px 0 40px 40px;
    --identity-card-horizontal-reversed-image-padding-desktop: 40px 40px 40px 0;
    --identity-card-horizontal-gap-mobile: 16px;
    --identity-card-horizontal-body-padding-mobile: 0 20px 20px 20px;
    --identity-card-horizontal-image-padding-mobile: 20px 20px 0 20px;
    --identity-card-vertical-gap: 16px;
    --identity-card-vertical-body-padding: 0 20px 20px 20px;
    --identity-card-vertical-image-padding: 20px 20px 0 20px;


    /* ————————— */
    /*   FORM   */
    /* ————————— */
    --form-padding: 32px;
    --form-width-narrow: 480px;
    --form-gap: 24px;

    /* ———————————— */
    /* FORM CONTROL */
    /* ———————————— */
    --form-control-flex-direction: column;
    --form-control-gap: 6px;
    --form-control-body-width: auto;
    --form-control-label-font-family: var(--font-family-sans);
    --form-control-label-font-size: 14px;
    --form-control-label-font-weight: 500;
    --form-control-label-line-height: 20px;
    --form-control-label-letter-spacing: var(--letter-spacing-normal);
    --form-control-label-color: var(--text-color);
    --form-control-label-text-transform: none;
    --form-control-input-divider-color: #B3B8DB;
    --form-control-supporting-text-font-family: var(--font-family-sans);
    --form-control-supporting-text-font-size: 14px;
    --form-control-supporting-text-font-weight: 400;
    --form-control-supporting-text-line-height: 20px;
    --form-control-supporting-text-color: #535862;
    --form-control-supporting-text-invalid-color: #D92D20;
    --form-control-help-icon-color: #A4A7AE;

    /* ———————————————————— */
    /* FORM CONTROL — INPUT */
    /* ———————————————————— */
    --form-control-input-width: 320px;
    --form-control-input-height: 44px;
    --form-control-input-font-family: var(--font-family-sans);
    --form-control-input-font-size: var(--text-md-font-size);
    --form-control-input-line-height: var(--text-md-line-height);
    --form-control-input-body-gap: 8px;
    --form-control-input-body-padding: 10px 14px;
    --form-control-input-border-radius: 8px;
    --form-control-input-border: 1px solid #B3B8DB;
    --form-control-input-background: var(--color-white-50);
    --form-control-input-color: var(--text-color);
    --form-control-input-placeholder-color: #717680;
    --form-control-input-shadow: none;
    --form-control-input-prefix-color: rgba(0, 0, 0, 0.54);
    --form-control-input-suffix-color: rgba(0, 0, 0, 0.54);
    --form-control-input-invalid-border: solid 1px #F04438;
    --form-control-input-invalid-shadow: 0 0 0 1px #F04438;
    --form-control-input-invalid-background: transparent;
    --form-control-input-invalid-color: inherit;
    --form-control-input-disabled-border: solid 1px #B3B8DB;
    --form-control-input-disabled-shadow: none;
    --form-control-input-disabled-background: #F8F9FC;
    --form-control-input-disabled-color: #717680;

    /* ——————— */
    /* SECTION */
    /* ——————— */
    --section-wide-content-width: 1664px;
    --section-narrow-content-width: var(--max-content-width);
    --section-main-navigation-border-style: none;
    --section-main-navigation-border-width: 0;
    --section-main-navigation-border-color: transparent;
    --section-main-navigation-fixed-background: var(--color-white);

    --section-border-color: none;
    --section-border-width: 0;
    --section-border-style: none;
    --section-border-radius: 0;
    --section-shadow: none;
    --section-width: 100%;
    --section-padding-block-mobile: 48px;
    --section-padding-inline-mobile: 0;
    --section-padding-block-tablet: 56px;
    --section-padding-inline-tablet: 0;
    --section-padding-block-desktop: 64px;
    --section-padding-inline-desktop: 0;
    --section-padding-block-wide: 64px;
    --section-padding-inline-wide: 0;
    --section-extra-padding-inline-mobile: 32px;
    --section-extra-padding-inline-tablet: 48px;
    --section-extra-padding-inline-desktop: 64px;
    --section-extra-padding-inline-wide: 64px;


    /* ——————— */
    /*   BOX   */
    /* ——————— */
    --box-padding-mobile: 24px 20px;
    --box-padding-desktop: 32px;
    --box-border-width: 1px;
    --box-border-style: solid;
    --box-border-radius: 16px;
    --box-shadow: none;


    /* ————————— */
    /*   AVATAR  */
    /* ————————— */
    /* Style */
    --avatar-background: #f0f0f0;
    --avatar-foreground: #000000;
    --avatar-border: 1px solid #ccc;
    --avatar-border-radius: 9999px;
    --avatar-aspect-ratio: 1/1;

    /* Size */
    --avatar-size-xxs: 24px;
    --avatar-size-xs: 32px;
    --avatar-size-sm: 40px;
    --avatar-size-md: 64px;
    --avatar-size-lg: 80px;
    --avatar-size-xl: 96px;
    --avatar-size-xxl: 128px;

    /* Button size */
    --avatar-button-size-xxs: 16px;
    --avatar-button-size-xs: 20px;
    --avatar-button-size-sm: 24px;
    --avatar-button-size-md: 28px;
    --avatar-button-size-lg: 32px;
    --avatar-button-size-xl: 48px;
    --avatar-button-size-xxl: 64px;

    /* Font size */
    --avatar-font-size-xxs: 12px;
    --avatar-font-size-xs: 14px;
    --avatar-font-size-sm: 16px;
    --avatar-font-size-md: 18px;
    --avatar-font-size-lg: 28px;
    --avatar-font-size-xl: 38px;
    --avatar-font-size-xxl: 67px;


    /* ———————————— */
    /*  AVATAR NAME */
    /* ———————————— */
    --avatar-name-background: transparent;
    --avatar-name-foreground: var(--text-color);
    --avatar-name-border: none;
    --avatar-name-border-radius: 0;
    --avatar-name-box-shadow: none;
    --avatar-name-padding: 0;
    --avatar-name-gap: var(--spacing-medium);
    --avatar-name-flex-direction: row;
    --avatar-name-align-items: center;
    --avatar-name-justify-content: flex-start;

    /* —————————————————— */
    /*   ACCORDION ITEM   */
    /* —————————————————— */
    --accordion-item-border-radius: 8px;
    --accordion-item-padding: 0;
    --accordion-item-heading-padding: 16px;
    --accordion-item-body-padding: 0 32px 16px 16px;

    /* Numbering */
    --accordion-item-numbering-margin: 8px;
    --accordion-item-numbering-font-size: var(--text-lg-font-size);
    --accordion-item-numbering-font-weight: var(--font-weight-light);
    --accordion-item-numbering-line-height: var(--text-lg-line-height);

    /* Spacing */
    --accordion-spacing: 12px;

    /* Black style */
    --accordion-item-black-border: solid 1px #D5D9EB;
    --accordion-item-black-border-width: 1px;
    --accordion-item-black-background: #fff;
    --accordion-item-black-box-shadow: 0px 1px 2px 0px rgba(10, 13, 18, 0.05);
    --accordion-item-black-heading-color: var(--text-color);
    --accordion-item-black-numbering-color: var(--accordion-item-black-heading-color);
    --accordion-item-black-body-color: #535862;
    /* Black style - expanded */
    --accordion-item-black-expanded-border: var(--accordion-item-black-border);
    --accordion-item-black-expanded-border-width: var(--accordion-item-black-border-width);
    --accordion-item-black-expanded-background: var(--accordion-item-black-background);
    --accordion-item-black-expanded-box-shadow: var(--accordion-item-black-box-shadow);
    --accordion-item-black-expanded-heading-color: var(--accordion-item-black-heading-color);
    --accordion-item-black-expanded-numbering-color: var(--accordion-item-black-numbering-color);
    --accordion-item-black-expanded-body-color: var(--accordion-item-black-body-color);
    /* Black style :hover */
    --accordion-item-black-border-hover: var(--accordion-item-black-border);
    --accordion-item-black-border-width-hover: var(--accordion-item-black-border-width);
    --accordion-item-black-background-hover: var(--accordion-item-black-background);
    --accordion-item-black-box-shadow-hover: var(--accordion-item-black-box-shadow);
    --accordion-item-black-heading-color-hover: var(--accordion-item-black-heading-color);
    --accordion-item-black-numbering-color-hover: var(--accordion-item-black-numbering-color);
    --accordion-item-black-body-color-hover: var(--accordion-item-black-body-color);
    /* Black style - expanded :hover */
    --accordion-item-black-expanded-border-hover: var(--accordion-item-black-border);
    --accordion-item-black-expanded-border-width-hover: var(--accordion-item-black-border-width);
    --accordion-item-black-expanded-background-hover: var(--accordion-item-black-background);
    --accordion-item-black-expanded-box-shadow-hover: var(--accordion-item-black-box-shadow);
    --accordion-item-black-expanded-heading-color-hover: var(--accordion-item-black-heading-color);
    --accordion-item-black-expanded-numbering-color-hover: var(--accordion-item-black-numbering-color);
    --accordion-item-black-expanded-body-color-hover: var(--accordion-item-black-body-color);

    /* White style */
    --accordion-item-white-border: solid 1px rgba(255, 255, 255, 0.15);
    --accordion-item-white-border-width: 1px;
    --accordion-item-white-background: transparent;
    --accordion-item-white-box-shadow: 0px 1px 2px 0px rgba(10, 13, 18, 0.05);
    --accordion-item-white-heading-color: #fff;
    --accordion-item-white-numbering-color: var(--accordion-item-white-heading-color);
    --accordion-item-white-body-color: rgba(255, 255, 255, 0.75);
    /* White style - expanded */
    --accordion-item-white-expanded-border: var(--accordion-item-white-border);
    --accordion-item-white-expanded-border-width: var(--accordion-item-white-border-width);
    --accordion-item-white-expanded-background: var(--accordion-item-white-background);
    --accordion-item-white-expanded-box-shadow: var(--accordion-item-white-box-shadow);
    --accordion-item-white-expanded-heading-color: var(--accordion-item-white-heading-color);
    --accordion-item-white-expanded-numbering-color: var(--accordion-item-white-numbering-color);
    --accordion-item-white-expanded-body-color: var(--accordion-item-white-body-color);
    /* White style :hover */
    --accordion-item-white-border-hover: var(--accordion-item-white-border);
    --accordion-item-white-border-width-hover: var(--accordion-item-white-border-width);
    --accordion-item-white-background-hover: var(--accordion-item-white-background);
    --accordion-item-white-box-shadow-hover: var(--accordion-item-white-box-shadow);
    --accordion-item-white-heading-color-hover: var(--accordion-item-white-heading-color);
    --accordion-item-white-numbering-color-hover: var(--accordion-item-white-numbering-color);
    --accordion-item-white-body-color-hover: var(--accordion-item-white-body-color);
    /* White style - expanded :hover */
    --accordion-item-white-expanded-border-hover: var(--accordion-item-white-border);
    --accordion-item-white-expanded-border-width-hover: var(--accordion-item-white-border-width);
    --accordion-item-white-expanded-background-hover: var(--accordion-item-white-background);
    --accordion-item-white-expanded-box-shadow-hover: var(--accordion-item-white-box-shadow);
    --accordion-item-white-expanded-heading-color-hover: var(--accordion-item-white-heading-color);
    --accordion-item-white-expanded-numbering-color-hover: var(--accordion-item-white-numbering-color);
    --accordion-item-white-expanded-body-color-hover: var(--accordion-item-white-body-color);



    /* ————————— */
    /*   BADGE   */
    /* ————————— */
    --badge-font-weight: var(--font-weight-medium);
    --badge-close-button-color: inherit;
    --badge-close-button-size: 1em;

    /* Sizes */
    --badge-padding-sm: 2px 8px;
    --badge-font-size-sm: 12px;
    --badge-line-height-sm: 18px;
    --badge-gap-sm: 4px;
    --badge-border-radius-sm: var(--border-radius-full);

    --badge-padding-md: 2px 10px;
    --badge-font-size-md: 14px;
    --badge-line-height-md: 20px;
    --badge-gap-md: 6px;
    --badge-border-radius-md: var(--border-radius-full);

    --badge-padding-lg: 4px 12px;
    --badge-font-size-lg: 14px;
    --badge-line-height-lg: 20px;
    --badge-gap-lg: 6px;
    --badge-border-radius-lg: var(--border-radius-full);

    /* Styles */
    --badge-gray-background: var(--color-neutral-50);
    --badge-gray-color: var(--color-neutral-700);
    --badge-gray-border: 1px solid var(--color-neutral-200);

    --badge-brand-background: var(--color-brand-50);
    --badge-brand-color: var(--color-brand-700);
    --badge-brand-border: 1px solid var(--color-brand-200);

    --badge-inverse-background: rgba(255, 255, 255, 0.30);
    --badge-inverse-color: var(--color-white);
    --badge-inverse-border: 1px solid var(--color-white);

    --badge-bw-background: rgba(0, 0, 0, 0.10);
    --badge-bw-color: var(--color-neutral-900);
    --badge-bw-border: 1px solid var(--color-neutral-900);

    --badge-success-background: var(--color-success-50);
    --badge-success-color: var(--color-success-700);
    --badge-success-border: 1px solid var(--color-success-200);

    --badge-warning-background: var(--color-warning-50);
    --badge-warning-color: var(--color-warning-700);
    --badge-warning-border: 1px solid var(--color-warning-200);

    --badge-danger-background: var(--color-error-50);
    --badge-danger-color: var(--color-error-700);
    --badge-danger-border: 1px solid var(--color-error-200);


    /* ————————————— */
    /*   BADGE SET   */
    /* ————————————— */
    --badge-set-column-gap: 4px;
    --badge-set-row-gap: 4px;
    --badge-set-margin-bottom-mobile: 12px;
    --badge-set-margin-bottom-desktop: 12px;


    /* ———————— */
    /*   LINE   */
    /* ———————— */
    --line-black-width: 3px;
    --line-black-length-mobile: 100px;
    --line-black-length-desktop: 160px;
    --line-black-color: var(--color-neutral-900);
    --line-black-background-image: none;
    --line-black-background-repeat: no-repeat;
    --line-black-margin: 48px 0;

    --line-white-width: var(--line-black-width);
    --line-white-length-mobile: var(--line-black-length-mobile);
    --line-white-length-desktop: var(--line-black-length-desktop);
    --line-white-color: var(--color-fg-white);
    --line-white-background-image: var(--line-black-background-image);
    --line-white-background-repeat: var(--line-black-background-repeat);
    --line-white-margin: var(--line-black-margin);

    --line-gray-width: var(--line-black-width);
    --line-gray-length-mobile: var(--line-black-length-mobile);
    --line-gray-length-desktop: var(--line-black-length-desktop);
    --line-gray-color: var(--color-fg-gray);
    --line-gray-background-image: var(--line-black-background-image);
    --line-gray-background-repeat: var(--line-black-background-repeat);
    --line-gray-margin: var(--line-black-margin);


    /* ——————————————————— */
    /*   TAB & TAB GROUP   */
    /* ——————————————————— */
    --tab-background: transparent;
    --tab-foreground: #717680;
    --tab-border: none;
    --tab-border-radius: none;
    --tab-box-shadow: none;
    --tab-font-weight: var(--font-weight-semibold);
    --tab-font-size: 16px;
    --tab-line-height: 24px;
    --tab-padding: 8px 12px;
    --tab-gap: 8px;
    --tab-active-border-width: 2px;
    --tab-group-gap: 12px;
    --tab-group-box-shadow: inset 0 -1px 0 0 var(--line-gray-color);
    --tab-background-active: var(--tab-background);
    --tab-foreground-active: #0047A3;
    --tab-border-active: var(--tab-border);
    --tab-border-radius-active: var(--tab-border-radius);
    --tab-box-shadow-active: 0 2px 0 0 var(--tab-foreground-active);
    --tab-font-weight-active: var(--tab-font-weight);
    --tab-font-size-active: var(--tab-font-size);
    --tab-line-height-active: var(--tab-line-height);


    /* ————— */
    /* QUOTE */
    /* ————— */
    --quote-blockquote-paragraph-gap: 16px;
    --quote-caption-align-self: flex-start;
    --quote-caption-justify-self: flex-start;
    --quote-caption-text-align: left;

    /* Layout */
    --quote-full-padding-mobile: 0;
    --quote-full-gap-mobile: 24px;
    --quote-full-border-radius-mobile: 0;
    --quote-full-padding-desktop: 0;
    --quote-full-gap-desktop: 24px;
    --quote-full-border-radius-desktop: 0;
    --quote-card-padding-mobile: 32px;
    --quote-card-gap-mobile: 32px;
    --quote-card-border-radius-mobile: 12px;
    --quote-card-padding-desktop: 32px;
    --quote-card-gap-desktop: 32px;
    --quote-card-border-radius-desktop: 12px;

    /* Styles */
    --quote-full-black-background: transparent;
    --quote-full-black-foreground: #000000;
    --quote-full-black-message-foreground: inherit;
    --quote-full-black-shadow: none;
    --quote-full-black-border: none;
    --quote-full-white-background: transparent;
    --quote-full-white-foreground: #ffffff;
    --quote-full-white-message-foreground: inherit;
    --quote-full-white-shadow: none;
    --quote-full-white-border: none;
    --quote-card-black-background: #f9f9f9;
    --quote-card-black-foreground: #000000;
    --quote-card-black-message-foreground: inherit;
    --quote-card-black-shadow: none;
    --quote-card-black-border: none;
    --quote-card-white-background: rgba(255, 255, 255, 0.20);
    --quote-card-white-foreground: #ffffff;
    --quote-card-white-message-foreground: inherit;
    --quote-card-white-shadow: none;
    --quote-card-white-border: none;


    /* ———————————— */
    /* RADIO BUTTON */
    /* ———————————— */
    --radio-button-size: 20px;
    --radio-button-indicator-size: 8px;
    --radio-button-gap: 8px;
    --radio-button-border-radius: var(--border-radius-full);
    --radio-button-border: 1px solid #B3B8DB;
    --radio-button-background: transparent;
    --radio-button-border-hover: inherit;
    --radio-button-background-hover: inherit;
    --radio-button-border-checked: solid 1px var(--color-brand-500);
    --radio-button-background-checked: var(--color-brand-500);
    --radio-button-indicator-color: #fff;
    --radio-button-border-checked-hover: var(--radio-button-border-checked);
    --radio-button-background-checked-hover: var(--radio-button-background-checked);
    --radio-button-indicator-color-hover: var(--radio-button-indicator-color);
    --radio-button-border-disabled: inherit;
    --radio-button-background-disabled: inherit;
    --radio-button-indicator-color-disabled: #D5D7DA;
    --radio-button-foreground-disabled: var(--radio-button-border-disabled);

    /* ———————————— */
    /*   CHECKBOX   */
    /* ———————————— */
    --checkbox-size: 20px;
    --checkbox-indicator-size: 14px;
    --checkbox-gap: 8px;
    --checkbox-background: transparent;
    --checkbox-border: solid 1px #B3B8DB;
    --checkbox-border-radius: 4px;
    --checkbox-indicator-color: white;
    --checkbox-checked-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M11.6666 3.5L5.24998 9.91667L2.33331 7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    --checkbox-indeterminate-icon: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M2.91669 7H11.0834" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    --checkbox-border-hover: var(--checkbox-border);
    --checkbox-background-hover: inherit;
    --checkbox-border-checked: solid 1px var(--checkbox-background-checked);
    --checkbox-background-checked: var(--color-brand-500);
    --checkbox-border-checked-hover: solid 1px var(--foreground-style-accent-dark);
    --checkbox-background-checked-hover: var(--checkbox-background-checked);
    --checkbox-indicator-color-hover: var(--checkbox-indicator-color);
    --checkbox-border-disabled: solid 1px var(--foreground-disabled);
    --checkbox-background-disabled: transparent;
    --checkbox-indicator-color-disabled: var(--foreground-disabled);
    --checkbox-foreground-disabled: lightgray;

    /* ——————————————— */
    /*   BREADCRUMBS   */
    /* ——————————————— */
    /* #717680 */
    --breadcrumbs-gap: 4px;
    --breadcrumbs-separator-color: #D5D7DA;
    --breadcrumbs-link-text-decoration: none;
    --breadcrumbs-link-text-decoration-hover: underline;
    --breadcrumbs-link-color: inherit;
    --breadcrumbs-link-color-hover: var(--breadcrumbs-link-color);
    --breadcrumbs-link-font-family: var(--font-family-sans);
    --breadcrumbs-link-font-weight: 500;
    --breadcrumbs-link-font-size: 12px;
    --breadcrumbs-link-line-height: 18px;
    --breadcrumbs-link-last-color: #717680;
    --breadcrumbs-link-last-color-hover: var(--breadcrumbs-link-last-color);

    /* —————————————— */
    /*   BUTTON SET   */
    /* —————————————— */
    --button-set-column-gap-mobile: 8px;
    --button-set-row-gap-mobile: 8px;
    --button-set-column-gap-desktop: 8px;
    --button-set-row-gap-desktop: 8px;


    /* —————————— */
    /*   LAYOUT   */
    /* —————————— */
    --layout-columns-align-items: stretch;
    --layout-columns-justify-content: flex-start;
    --layout-flexible-align-items: stretch;
    --layout-flexible-justify-content: flex-start;
    --layout-scrollable-col-size: 90%;
    --layout-default-column-gap-desktop: 64px;
    --layout-default-row-gap-desktop: 64px;
    --layout-default-column-gap-mobile: 48px;
    --layout-default-row-gap-mobile: 48px;
    --layout-cards-column-gap-mobile: 32px;
    --layout-cards-row-gap-mobile: 48px;
    --layout-cards-column-gap-desktop: 32px;
    --layout-cards-row-gap-desktop: 96px;
    --layout-tiles-column-gap-mobile: 32px;
    --layout-tiles-row-gap-mobile: 32px;
    --layout-tiles-column-gap-desktop: 32px;
    --layout-tiles-row-gap-desktop: 32px;
    --layout-mixed-column-gap-mobile: var(--layout-tiles-column-gap-mobile);
    --layout-mixed-row-gap-mobile: var(--layout-tiles-row-gap-mobile);
    --layout-mixed-column-gap-desktop: var(--layout-tiles-column-gap-desktop);
    --layout-mixed-row-gap-desktop: var(--layout-tiles-row-gap-desktop);
    --layout-quotes-full-column-gap-mobile: var(--layout-cards-column-gap-mobile);
    --layout-quotes-full-row-gap-mobile: var(--layout-cards-row-gap-mobile);
    --layout-quotes-full-column-gap-desktop: var(--layout-cards-column-gap-desktop);
    --layout-quotes-full-row-gap-desktop: var(--layout-cards-row-gap-desktop);
    --layout-quotes-card-column-gap-mobile: var(--layout-tiles-column-gap-mobile);
    --layout-quotes-card-row-gap-mobile: var(--layout-tiles-row-gap-mobile);
    --layout-quotes-card-column-gap-desktop: var(--layout-tiles-column-gap-desktop);
    --layout-quotes-card-row-gap-desktop: var(--layout-tiles-row-gap-desktop);
    --layout-text-blocks-column-gap-mobile: var(--layout-cards-column-gap-mobile);
    --layout-text-blocks-row-gap-mobile: var(--layout-cards-row-gap-mobile);
    --layout-text-blocks-column-gap-desktop: var(--layout-cards-column-gap-desktop);
    --layout-text-blocks-row-gap-desktop: var(--layout-cards-row-gap-desktop);
    --layout-feature-cards-column-gap-mobile: 24px;
    --layout-feature-cards-row-gap-mobile: 24px;
    --layout-feature-cards-column-gap-desktop: 24px;
    --layout-feature-cards-row-gap-desktop: 24px;


    /* ——————————— */
    /*   GALLERY   */
    /* ——————————— */
    --gallery-column-gap-mobile: 8px;
    --gallery-row-gap-mobile: 8px;
    --gallery-column-gap-desktop: 16px;
    --gallery-row-gap-desktop: 16px;
    /* Gallery collage */
    --gallery-collage-group-2-columns-mobile: 2fr;
    --gallery-collage-group-2-columns-tablet: 1fr 1fr;
    --gallery-collage-group-2-columns-desktop: 1fr 1fr;
    --gallery-collage-group-2-columns-wide: 1fr 1fr;
    --gallery-collage-group-3-columns-mobile: 2fr;
    --gallery-collage-group-3-columns-tablet: 1fr 1fr 1fr;
    --gallery-collage-group-3-columns-desktop: 1fr 1fr 1fr;
    --gallery-collage-group-3-columns-wide: 1fr 1fr 1fr;
    --gallery-collage-group-4-columns-mobile: 2fr;
    --gallery-collage-group-4-columns-tablet: 1fr 1fr 1fr 1fr;
    --gallery-collage-group-4-columns-desktop: 1fr 1fr 1fr 1fr;
    --gallery-collage-group-4-columns-wide: 1fr 1fr 1fr 1fr;
    --gallery-collage-group-5-columns-mobile: 2fr;
    --gallery-collage-group-5-columns-tablet: 1fr 1fr 1fr 1fr 1fr;
    --gallery-collage-group-5-columns-desktop: 1fr 1fr 1fr 1fr 1fr;
    --gallery-collage-group-5-columns-wide: 1fr 1fr 1fr 1fr 1fr;
    --gallery-collage-group-6-columns-mobile: 2fr;
    --gallery-collage-group-6-columns-tablet: 1fr 1fr 1fr 1fr 1fr 1fr;
    --gallery-collage-group-6-columns-desktop: 1fr 1fr 1fr 1fr 1fr 1fr;
    --gallery-collage-group-6-columns-wide: 1fr 1fr 1fr 1fr 1fr 1fr;


    /* ———————— */
    /*   GRID   */
    /* ———————— */
    --grid-scrollable-col-size: 90%;
    --grid-column-gap-mobile: var(--layout-mixed-column-gap-mobile);
    --grid-row-gap-mobile: var(--layout-mixed-row-gap-mobile);
    --grid-column-gap-desktop: var(--layout-mixed-column-gap-desktop);
    --grid-row-gap-desktop: var(--layout-mixed-row-gap-desktop);


    /* ———————————————— */
    /*   HERO SECTION   */
    /* ———————————————— */
    --hero-section-padding-mobile: var(--section-padding-block-mobile, 0) var(--section-extra-padding-inline-mobile, 0);
    --hero-section-padding-tablet: var(--section-padding-block-tablet, 0) var(--section-extra-padding-inline-tablet, 0);
    --hero-section-padding-desktop: var(--section-padding-block-desktop, 0) var(--section-extra-padding-inline-desktop, 0);
    --hero-section-padding-wide: var(--section-padding-block-wide, 0) var(--section-extra-padding-inline-wide, 0);
    --hero-section-column-gap-mobile: 8px;
    --hero-section-row-gap-mobile: 8px;
    --hero-section-column-gap-desktop: var(--hero-section-column-gap-mobile);
    --hero-section-row-gap-desktop: var(--hero-section-row-gap-mobile);


    /* ———————————— */
    /*   SIGNPOST   */
    /* ———————————— */
    --signpost-column-gap-mobile: 8px;
    --signpost-row-gap-mobile: 8px;
    --signpost-column-gap-desktop: 8px;
    --signpost-row-gap-desktop: 8px;


    /* ———————————— */
    /*   SUB-MENU   */
    /* ———————————— */
    --sub-menu-background: inherit;
    --sub-menu-border: solid 1px #D5D9EB;
    --sub-menu-shadow: none;
    --sub-menu-border-radius: 8px;
    --sub-menu-padding: 48px;
    --sub-menu-max-width: 1664px;
    --sub-menu-margin: 0 auto;
    --sub-menu-item-padding: 12px;
    --sub-menu-column-gap: 24px;
    --sub-menu-row-gap: 24px;
    --sub-menu-min-column-size: 350px;
    --sub-menu-max-column-count: 4;

    --sub-menu-signpost-item-background: transparent;
    --sub-menu-signpost-item-foreground: inherit;
    --sub-menu-signpost-item-border: none;
    --sub-menu-signpost-item-border-radius: 8px;
    --sub-menu-signpost-item-box-shadow: none;
    --sub-menu-signpost-item-p-margin-bottom: 12px;

    --sub-menu-signpost-item-background-hover: #D6E8FF;
    --sub-menu-signpost-item-foreground-hover: inherit;
    --sub-menu-signpost-item-hover-border: none;
    --sub-menu-signpost-item-hover-box-shadow: none;

    --sub-menu-signpost-item-background-active: var(--sub-menu-signpost-item-background-hover);
    --sub-menu-signpost-item-foreground-active: var(--sub-menu-signpost-item-foreground);
    --sub-menu-signpost-item-active-border: none;
    --sub-menu-signpost-item-active-box-shadow: none;



    /* —————————————— */
    /*   ICON LABEL   */
    /* —————————————— */
    --icon-label-text-color: var(--text-color);
    --icon-label-icon-color: var(--icon-label-text-color);
    --icon-label-gap: var(--spacing-3x-small);


    /* ————————— */
    /*   MODAL   */
    /* ————————— */
    --modal-padding: 24px;
    --modal-background: #FFF;
    --modal-foreground: var(--text-color);
    --modal-border-radius: 12px;
    --modal-border: none;
    --modal-box-shadow: 0px 20px 24px -4px rgba(10, 13, 18, 0.08), 0px 8px 8px -4px rgba(10, 13, 18, 0.03), 0px 3px 3px -1.5px rgba(10, 13, 18, 0.04);
    --modal-width: 720px;
    --modal-height: auto;

    --modal-header-background: var(--modal-background);
    --modal-header-foreground: var(--modal-foreground);
    --modal-header-border: none;
    --modal-header-padding: 0 0 24px 0;
    --modal-header-justify-content: space-between;

    --modal-body-background: var(--modal-background);
    --modal-body-foreground: var(--modal-foreground);
    --modal-body-padding: 0;
    --modal-body-overflow: auto;

    --modal-footer-background: var(--modal-background);
    --modal-footer-foreground: var(--modal-foreground);
    --modal-footer-border: none;
    --modal-footer-padding: 32px 0 0 0;
    --modal-footer-justify-content: flex-end;


    /* ————————— */
    /*   TABLE   */
    /* ————————— */
    --table-background: transparent;
    --table-foreground: var(--text-color, inherit);
    --table-box-shadow: none;
    --table-border: 1px solid #D5D9EB;
    --table-border-radius: 12px;
    --table-spacing: 0;
    --table-caption-text-align: left;
    --table-cell-padding: 16px 24px;
    --table-cell-text-align: left;
    --table-cell-vertical-align: middle;
    --table-font-family: var(--font-family-sans, sans-serif);
    --table-font-size: 1rem;
    --table-font-weight: normal;
    --table-line-height: 1.5;

    --table-row-hover-background: #F8F9FC;
    --table-row-hover-foreground: #181D27;

    --table-header-background: #F8F9FC;
    --table-header-foreground: #717680;
    --table-header-font-family: var(--table-font-family);
    --table-header-font-size: 12px;
    --table-header-font-weight: 600;
    --table-header-line-height: 18px;
    --table-header-horizontal-separator: var(--table-border);
    --table-header-vertical-separator: none;

    --table-body-background: transparent;
    --table-body-foreground: #535862;
    --table-body-font-family: var(--table-font-family);
    --table-body-font-size: 14px;
    --table-body-font-weight: 400;
    --table-body-line-height: 20px;
    --table-body-horizontal-separator: var(--table-border);
    --table-body-vertical-separator: none;

    --table-footer-background: transparent;
    --table-footer-foreground: #414651;
    --table-footer-font-family: var(--table-font-family);
    --table-footer-font-size: 14px;
    --table-footer-font-weight: 400;
    --table-footer-line-height: 20px;
    --table-footer-horizontal-separator: var(--table-header-horizontal-separator);
    --table-footer-vertical-separator: var(--table-header-vertical-separator);


    /* ————————————— */
    /*   TILES   */
    /* ————————————— */
    --tile-border-width: 1px;
    --tile-border-style: solid;
    --tile-border-radius: 12px;
    --tile-box-shadow: none;
    --tile-image-light-gradient-color-transparent: rgba(255, 255, 255, 0);
    --tile-image-light-gradient-color-solid: rgba(255, 255, 255, 0.75);
    --tile-image-dark-gradient-color-transparent: rgba(0, 0, 0, 0);
    --tile-image-dark-gradient-color-solid: rgba(0, 0, 0, 0.75);
    --tile-padding-mobile: 20px;
    --tile-gap-mobile: 24px;
    --tile-padding-desktop: 40px;
    --tile-gap-desktop: 24px;


    /* ————————— */
    /*   EVENT   */
    /* ————————— */
    --event-background: transparent;
    --event-background-hover: var(--event-background);
    --event-foreground: inherit;
    --event-foreground-hover: inherit;
    --event-border: none;
    --event-shadow: none;
    --event-shadow-hover: none;
    --event-padding-mobile: 0;
    --event-padding-tablet: 0;
    --event-padding-desktop: 0;
    --event-border-radius-mobile: 0;
    --event-border-radius-tablet: 0;
    --event-border-radius-desktop: 0;
    --event-gap-mobile: 24px;
    --event-gap-tablet: 24px;
    --event-gap-desktop: 32px;
    --event-grid-areas-mobile: "image" "dates" "headline" "tags" "body" "buttons";
    --event-grid-areas-tablet:
        "image dates"
        "image headline"
        "image tags"
        "image body"
        "image buttons"
        "image ."
    ;
    --event-grid-areas-desktop:
        "dates image headline"
        "dates image tags"
        "dates image body"
        "dates image buttons"
        ". image ."
    ;
    --event-grid-columns-mobile: 1fr;
    --event-grid-columns-tablet: 1fr 2fr;
    --event-grid-columns-desktop: 257px 398px auto;
    --event-grid-rows-mobile: auto;
    --event-grid-rows-tablet: auto;
    --event-grid-rows-desktop: max-content;

    /* Spacing – mobile */
    --event-dates-top-spacing-mobile: 24px;
    --event-tags-top-spacing-mobile: 12px;
    --event-headline-top-spacing-mobile: 24px;
    --event-body-top-spacing-mobile: 12px;
    --event-image-top-spacing-mobile: 0;
    --event-buttons-top-spacing-mobile: 24px;

    /* Spacing – tablet */
    --event-dates-top-spacing-tablet: 0;
    --event-tags-top-spacing-tablet: 24px;
    --event-headline-top-spacing-tablet: 24px;
    --event-body-top-spacing-tablet: 24px;
    --event-image-top-spacing-tablet: 0;
    --event-buttons-top-spacing-tablet: 24px;

    /* Spacing – desktop */
    --event-dates-top-spacing-desktop: 0;
    --event-tags-top-spacing-desktop: 24px;
    --event-headline-top-spacing-desktop: 0;
    --event-body-top-spacing-desktop: 24px;
    --event-image-top-spacing-desktop: 0;
    --event-buttons-top-spacing-desktop: 24px;

    /* Padding */
    --event-dates-padding: 0;
    --event-tags-padding: 0;
    --event-headline-padding: 0;
    --event-body-padding: 0;
    --event-image-padding: 0;
    --event-image-aspect-ratio: 3/2;
    --event-buttons-padding: 0;
    --event-buttons-gap: 0;


    /* —————————————— */
    /*   NAVIGATION   */
    /* —————————————— */
    --navigation-gap: 12px 24px;


    /* ————————————————————— */
    /*   NAVIGATION MOBILE   */
    /* ————————————————————— */
    --navigation-mobile-background: #fff;
    --navigation-mobile-padding: 16px;
    --navigation-mobile-gap: 4px;
    --navigation-mobile-header-gap: 4px;
    --navigation-mobile-header-padding: 0;
    --navigation-mobile-footer-gap: 4px;
    --navigation-mobile-footer-padding: 0;
    --navigation-mobile-menu-padding: 0;
    --navigation-mobile-menu-gap: 4px;
    --navigation-mobile-submenu-padding: 4px 0;
    --navigation-mobile-submenu-gap: 4px;
    --navigation-mobile-submenu-button-background: #D6E8FF;
    --navigation-mobile-submenu-margin: 0;
    --navigation-mobile-submenuitem-margin-left: 20px;


    /* —————————— */
    /*   FOOTER   */
    /* —————————— */
    --site-footer-background: #002F6C;
    --site-footer-foreground: #FFFFFF;
    --site-footer-border: none;
    --site-footer-border-radius: 8px;
    --site-footer-box-shadow: none;
    --site-footer-gap-mobile: 64px 32px;
    --site-footer-gap-tablet: 64px 32px;
    --site-footer-gap-desktop: 64px 32px;
    --site-footer-logo-height: 24px;
    --site-footer-logo-width: auto;
    --site-footer-logo-color: inherit;
    --site-footer-padding-mobile: 24px;
    --site-footer-padding-tablet: 32px;
    --site-footer-padding-desktop: 32px;


    /* ——————————————————— */
    /*   SITE NAVIGATION   */
    /* ——————————————————— */
    --site-navigation-height-mobile: 80px;
    --site-navigation-height-tablet: 80px;
    --site-navigation-height-desktop: 80px;
    --site-navigation-height-wide: 80px;
    --site-navigation-padding-mobile: 0;
    --site-navigation-padding-tablet: 0;
    --site-navigation-padding-desktop: 0;
    --site-navigation-padding-wide: 0;
    --site-navigation-background: transparent;
    --site-navigation-border-style: none;
    --site-navigation-border-width: 0 0 0 0;
    --site-navigation-border-color: transparent;
    --site-navigation-border-radius: 0;
    --site-navigation-box-shadow: none;
    --site-navigation-justify-content: space-between;
    --site-navigation-container-gap: 24px;
    --site-navigation-nav-gap: 4px;
    --site-navigation-slot-1-flex: 0 0 auto;
    --site-navigation-slot-1-justify-content: flex-start;
    --site-navigation-slot-2-flex: 0 1 auto;
    --site-navigation-slot-2-justify-content: center;
    --site-navigation-slot-3-flex: 0 0 auto;
    --site-navigation-slot-3-justify-content: center;
    --site-navigation-slot-4-flex: 0 0 auto;
    --site-navigation-slot-4-justify-content: flex-end;


    /* —————————— */
    /*   PAGING   */
    /* —————————— */
    --paging-width: max-content;
    --paging-column-gap: 0;
    --paging-padding: 0;
    --paging-background: transparent;
    --paging-foreground: inherit;
    --paging-border: 1px solid #B3B8DB;
    --paging-border-radius: 0;
    --paging-button-border-separator: 1px solid #B3B8DB;
    --paging-button-border-radius: var(--button-small-border-radius);


    /* ————————————— */
    /*  PAGING DOTS  */
    /* ————————————— */
    --paging-dots-column-gap: var(--spacing-md, 7px);
    --paging-dot-width: 8px;
    --paging-dots-padding: 0;
    --paging-dots-radius: 0;
    --paging-dots-border: none;
    --paging-dots-background: inherit;
    --paging-dots-box-shadow: none;
    --paging-dot-height: 8px;
    --paging-dot-background: rgba(0, 0, 0, 0.20);
    --paging-dot-background-active: rgba(0, 0, 0, 0.90);
    --paging-dot-width-active: 24px;


    /* ——————————————— */
    /*  PAGING ARROWS  */
    /* ——————————————— */
    --paging-arrows-column-gap: 16px;
    --paging-arrows-padding: 0;
    --paging-arrows-radius: 0;
    --paging-arrows-border: none;
    --paging-arrows-background: inherit;
    --paging-arrows-counter-color: gray;
    --paging-arrows-box-shadow: none;
    --paging-arrows-button-background: transparent;
    --paging-arrows-button-foreground: inherit;
    --paging-arrows-button-border: none;
    --paging-arrows-button-background-hover: rgba(0, 0, 0, 0.05);
    --paging-arrows-button-foreground-hover: inherit;
    --paging-arrows-button-border-hover: none;
    --paging-arrows-button-background-active: rgba(0, 0, 0, 0.1);
    --paging-arrows-button-foreground-active: inherit;
    --paging-arrows-button-border-active: none;
    --paging-arrows-button-background-disabled: transparent;
    --paging-arrows-button-foreground-disabled: rgba(0, 0, 0, 0.3);
    --paging-arrows-button-border-disabled: none;


    /* ———————————————— */
    /*   BUTTON GROUP   */
    /* ———————————————— */

    --button-group-vertical-link-justify-content: space-between;
    --button-group-width: max-content;

    /* Skupina - default */
    --button-group-default-padding: 0;
    --button-group-default-background: transparent;
    --button-group-default-foreground: #181D27;
    --button-group-default-border: 1px solid #181D27;
    --button-group-default-border-radius: 8px;
    --button-group-default-shadow: none;
    --button-group-horizontal-default-separator: solid 1px #181D27;
    --button-group-vertical-default-separator: none;
    --button-group-default-gap: 0;

    /* Tlačítka - default */
    --button-group-default-button-background: inherit;
    --button-group-default-button-foreground: inherit;
    --button-group-default-button-border: none;
    --button-group-default-button-border-radius: 0;
    --button-group-default-button-background-hover: #0A0D12;
    --button-group-default-button-foreground-hover: #FFFFFF;
    --button-group-default-button-border-hover: inherit;
    --button-group-default-button-border-radius-hover: 0;
    --button-group-default-button-background-active: #0A0D12;
    --button-group-default-button-foreground-active: #FFFFFF;
    --button-group-default-button-border-active: inherit;
    --button-group-default-button-border-radius-active: 0;

    /* Skupina - alt-a */
    --button-group-alt-a-padding: 0;
    --button-group-alt-a-background: transparent;
    --button-group-alt-a-foreground: #181D27;
    --button-group-alt-a-border: 1px solid #B3B8DB;
    --button-group-alt-a-border-radius: 8px;
    --button-group-alt-a-shadow: none;
    --button-group-horizontal-alt-a-separator: solid 1px #B3B8DB;
    --button-group-vertical-alt-a-separator: none;
    --button-group-alt-a-gap: 0;

    /* Tlačítka - alt-a */
    --button-group-alt-a-button-background: #fff;
    --button-group-alt-a-button-foreground: #252B37;
    --button-group-alt-a-button-border: none;
    --button-group-alt-a-button-border-radius: 0;
    --button-group-alt-a-button-background-hover: #F8F9FC;
    --button-group-alt-a-button-foreground-hover: inherit;
    --button-group-alt-a-button-border-hover: inherit;
    --button-group-alt-a-button-border-radius-hover: inherit;
    --button-group-alt-a-button-background-active: #F8F9FC;
    --button-group-alt-a-button-foreground-active: inherit;
    --button-group-alt-a-button-border-active: inherit;
    --button-group-alt-a-button-border-radius-active: inherit;

    /* Skupina - alt-b */
    --button-group-alt-b-padding: 4px;
    --button-group-alt-b-background: #F8F9FC;
    --button-group-alt-b-foreground: #181D27;
    --button-group-alt-b-border: 1px solid #D5D9EB;
    --button-group-alt-b-border-radius: 10px;
    --button-group-alt-b-shadow: none;
    --button-group-horizontal-alt-b-separator: none;
    --button-group-vertical-alt-b-separator: none;
    --button-group-alt-b-gap: 4px;

    /* Tlačítka - alt-b */
    --button-group-alt-b-button-background: transparent;
    --button-group-alt-b-button-foreground: #717680;
    --button-group-alt-b-button-border: solid 1px transparent;
    --button-group-alt-b-button-border-radius: 10px;
    --button-group-alt-b-button-background-hover: #fff;
    --button-group-alt-b-button-foreground-hover: #414651;
    --button-group-alt-b-button-border-hover: solid 1px #D5D9EB;
    --button-group-alt-b-button-border-radius-hover: inherit;
    --button-group-alt-b-button-background-active: #fff;
    --button-group-alt-b-button-foreground-active: #414651;
    --button-group-alt-b-button-border-active: solid 1px #D5D9EB;
    --button-group-alt-b-button-border-radius-active: inherit;

    /* Skupina - alt-c */
    --button-group-alt-c-padding: 0;
    --button-group-alt-c-background: transparent;
    --button-group-alt-c-foreground: #181D27;
    --button-group-alt-c-border: none;
    --button-group-alt-c-border-radius: 0;
    --button-group-alt-c-shadow: none;
    --button-group-horizontal-alt-c-separator: none;
    --button-group-vertical-alt-c-separator: none;
    --button-group-alt-c-gap: 8px;

    /* Tlačítka - alt-c */
    --button-group-alt-c-button-background: transparent;
    --button-group-alt-c-button-foreground: var(--text-color);
    --button-group-alt-c-button-border: solid 1px #D5D9EB;
    --button-group-alt-c-button-border-radius: 8px;
    --button-group-alt-c-button-background-hover: #F8F9FC;
    --button-group-alt-c-button-foreground-hover: inherit;
    --button-group-alt-c-button-border-hover: inherit;
    --button-group-alt-c-button-border-radius-hover: inherit;
    --button-group-alt-c-button-background-active: #222425;
    --button-group-alt-c-button-foreground-active: #fff;
    --button-group-alt-c-button-border-active: inherit;
    --button-group-alt-c-button-border-radius-active: inherit;

    /* Skupina - alt-d */
    --button-group-alt-d-padding: 0;
    --button-group-alt-d-background: inherit;
    --button-group-alt-d-foreground: inherit;
    --button-group-alt-d-border: inherit;
    --button-group-alt-d-border-radius: inherit;
    --button-group-alt-d-shadow: inherit;
    --button-group-horizontal-alt-d-separator: inherit;
    --button-group-vertical-alt-d-separator: inherit;
    --button-group-alt-d-gap: 8px;

    /* Tlačítka - alt-d */
    --button-group-alt-d-button-background: inherit;
    --button-group-alt-d-button-foreground: var(--text-color);
    --button-group-alt-d-button-border: inherit;
    --button-group-alt-d-button-border-radius: inherit;
    --button-group-alt-d-button-background-hover: inherit;
    --button-group-alt-d-button-foreground-hover: inherit;
    --button-group-alt-d-button-border-hover: inherit;
    --button-group-alt-d-button-border-radius-hover: inherit;
    --button-group-alt-d-button-background-active: inherit;
    --button-group-alt-d-button-foreground-active: inherit;
    --button-group-alt-d-button-border-active: inherit;
    --button-group-alt-d-button-border-radius-active: inherit;


    /* ———————————— */
    /*   DROPDOWN   */
    /* ———————————— */
    --dropdown-item-gap: 8px;
    --dropdown-item-border-radius: 0;
    --dropdown-item-padding: 9px 14px;
    --dropdown-item-background: white;
    --dropdown-item-foreground: inherit;
    --dropdown-item-height: auto;
    --dropdown-item-min-height: 40px;
    --dropdown-item-delimeter: solid 1px #E9EAEB;
    --dropdown-item-background-hover: #F8F9FC;
    --dropdown-item-foreground-hover: inherit;
    --dropdown-item-prefix-color-hover: inherit;
    --dropdown-item-suffix-color-hover: inherit;
    --dropdown-item-background-selected: #F8F9FC;
    --dropdown-item-foreground-selected: inherit;
    --dropdown-item-prefix-color-selected: #0058CC;
    --dropdown-item-suffix-color-selected: #0058CC;
    --dropdown-item-background-disabled: transparent;
    --dropdown-item-foreground-disabled: #717680;
    --dropdown-item-prefix-color-disabled: #A4A7AE;
    --dropdown-item-suffix-color-disabled: #A4A7AE;
    --dropdown-item-prefix-color: inherit;
    --dropdown-item-suffix-color: inherit;


    /* ————————————————— */
    /*   DROPDOWN LIST   */
    /* ————————————————— */
    --dropdown-list-row-gap: 4px;
    --dropdown-list-top-position: 80%;
    --dropdown-list-width: 100%;
    --dropdown-list-max-height: 240px;
    --dropdown-list-min-width: 200px;
    --dropdown-list-background: white;
    --dropdown-list-border: solid 1px rgba(0, 0, 0, 0.12);
    --dropdown-list-shadow: 0px 12px 16px -4px rgba(10, 13, 18, 0.08), 0px 4px 6px -2px rgba(10, 13, 18, 0.03), 0px 2px 2px -1px rgba(10, 13, 18, 0.04);
    --dropdown-list-border-radius: 8px;
    --dropdown-list-padding: 0;
    --dropdown-list-all-results-padding: 8px;
    --dropdown-list-all-results-background: white;
    --dropdown-list-all-results-delimeter: solid 1px #E9EAEB;


    /* ——————————————— */
    /*   PRODUCT SET   */
    /* ——————————————— */
    --product-set-column-gap: 8px;
    --product-set-row-gap: 8px;
    --product-set-card-image-padding: 24px 24px 0 24px;
    --product-set-card-image-border-radius: 8px;


    /* ——————————————— */
    /*   VIDEO EMBED   */
    /* ——————————————— */
    --video-embed-border-radius: var(--image-border-radius);



    /* ———————— */
    /*   CHAT   */
    /* ———————— */
    /* Chat container */
    --chat-gap: 12px;
    --chat-padding: 0;
    --chat-background: inherit;
    --chat-border: none;
    --chat-border-radius: inherit;
    --chat-box-shadow: none;
    --chat-max-width: var(--max-content-width);

    /* Chat message layout */
    --chat-column-gap: 12px;
    --chat-row-gap: 8px;

    /* Chat bubble default */
    --chat-bubble-margin: 0;
    --chat-bubble-padding: 16px;
    --chat-bubble-border-radius: 0 16px 16px 16px;
    --chat-bubble-box-shadow: none;
    --chat-bubble-border: none;
    --chat-bubble-background: inherit;
    --chat-bubble-foreground: var(--text-color);

    /* Chat bubble odd */
    --chat-bubble-odd-margin: inherit;
    --chat-bubble-odd-padding: var(--chat-bubble-padding);
    --chat-bubble-odd-border-radius: var(--chat-bubble-border-radius);
    --chat-bubble-odd-box-shadow: none;
    --chat-bubble-odd-border: solid 1px #eaecf0;
    --chat-bubble-odd-background: #f2f4f7;
    --chat-bubble-odd-foreground: inherit;

    /* Chat bubble even */
    --chat-bubble-even-margin: inherit;
    --chat-bubble-even-padding: var(--chat-bubble-padding);
    --chat-bubble-even-border-radius: var(--chat-bubble-border-radius);
    --chat-bubble-even-box-shadow: none;
    --chat-bubble-even-border: solid 1px #d6e8ff;
    --chat-bubble-even-background: #ebf3ff;
    --chat-bubble-even-foreground: inherit;


    /* —————————— */
    /*   SLIDER   */
    /* —————————— */
    --slider-gap: 40px;
    --slider-padding: 0;
    --slider-slide-padding: 0;
    --slider-slide-gap: 40px;


    /* ——————————————— */
    /*   BENTO BOXES   */
    /* ——————————————— */
    --bento-boxes-column-gap: 8px;
    --bento-boxes-row-gap: 8px;



    /* —————————————————— */
    /*   COOKIES BANNER   */
    /* —————————————————— */
    --cookies-banner-background: #fff;
    --cookies-banner-foreground: #222;
    --cookies-banner-padding: 32px 32px;
    --cookies-banner-border: 1px solid #e0e0e0;
    --cookies-banner-border-radius: 8px;
    --cookies-banner-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    --cookies-banner-width: 1440px;
    --cookies-banner-gap: 24px;


    /* —————————————— */
    /*   STATISTICS   */
    /* —————————————— */
    --statistics-stat-gap: 12px;
    --statistics-stat-label-gap: 4px;
    --statistics-value-color: inherit;
    --statistics-label-color: inherit;
    --statistics-description-color: inherit;
    --statistics-black-value-color: var(--color-brand-500);
    --statistics-black-label-color: var(--text-color);
    --statistics-black-description-color: var(--text-color);
    --statistics-white-value-color: var(--color-white);
    --statistics-white-label-color: var(--color-white);
    --statistics-white-description-color: var(--color-white);


    /* —————— */
    /* BANNER */
    /* —————— */
    --banner-border-radius: var(--image-border-radius);


    /* ——————————— */
    /* STAR RATING */
    /* ——————————— */
    --star-size: 20px;


    /* ———————————————— */
    /*   ANNOUNCEMENT   */
    /* ———————————————— */
    --announcement-padding-block: 16px;
    --announcement-padding-inline: 24px;
    --announcement-margin: 0 auto 24px auto;
    --announcement-background: transparent;
    --announcement-foreground: var(--text-color, #000);
    --announcement-border: none;
    --announcement-border-radius: 16px;
    --announcement-box-shadow: none;
    --announcement-column-gap: 16px;
    --announcement-row-gap: 16px;

    --announcement-default-background: #f6f6f6;
    --announcement-default-foreground: var(--announcement-foreground);
    --announcement-default-border: none;
    --announcement-default-box-shadow: none;

    --announcement-success-background: #ecfdf3;
    --announcement-success-foreground: darkgreen;
    --announcement-success-border: none;
    --announcement-success-box-shadow: none;

    --announcement-warning-background: #fffaeb;
    --announcement-warning-foreground: rgb(180, 99, 1);
    --announcement-warning-border: none;
    --announcement-warning-box-shadow: none;

    --announcement-danger-background: #fef3f2;
    --announcement-danger-foreground: darkred;
    --announcement-danger-border: none;
    --announcement-danger-box-shadow: none;


    /* ——————————————————— */
    /*   VIDEO COMPONENT   */
    /* ——————————————————— */
    --video-component-gap: 24px;


    /* ———————————–— */
    /*   BLOG POST   */
    /* ———————————–— */
    --post-background: honeydew;
    --post-foreground: inherit;
    --post-border: solid 1px #D6E8FF;
    --post-border-radius: 8px;
    --post-shadow: none;
    --post-padding: 0;
    --post-header-padding: 24px;
    --post-header-gap: 8px;
    --post-body-padding: 0;
    --post-body-gap: 8px;
    --post-footer-padding: 24px;
    --post-footer-gap: 8px;
    --post-controls-gap: 16px;
    --post-image-border-radius: 0;


    /* ———————————— */
    /*   LIGHTBOX   */
    /* ———————————— */
    --lightbox-background: rgba(0, 0, 0, 0.8);
    --lightbox-foreground: #fff;
    --lightbox-content-padding-inline: 4rem;
    --lightbox-content-size: 100%;
    --lightbox-content-gap: 16px;
    --lightbox-caption-width: 320px;
    --lightbox-caption-color: #ccc;
    --lightbox-thumbnails-margin-top: 24px;
    --lightbox-thumbnails-gap: 16px;
    --lightbox-thumbnails-height: 48px;
    --lightbox-thumbnail-aspect-ratio: 1/1;
    --lightbox-padding-desktop-top: 64px;
    --lightbox-padding-desktop-bottom: 64px;
    --lightbox-padding-desktop-right: 64px;
    --lightbox-padding-desktop-left: 64px;
    --lightbox-padding-mobile-top: 64px;
    --lightbox-padding-mobile-bottom: 16px;
    --lightbox-padding-mobile-right: 16px;
    --lightbox-padding-mobile-left: 16px;
    --bottom-caption-height: 96px;
    /* Paging colors */
    --lightbox-paging-dot-color: rgba(255, 255, 255, 0.25);
    --lightbox-paging-dot-active-color: #ffffff;
    --lightbox-paging-arrows-counter-color: gray;
    --lightbox-paging-arrows-button-background: transparent;
    --lightbox-paging-arrows-button-foreground: gray;
    --lightbox-paging-arrows-button-border: none;
    --lightbox-paging-arrows-button-background-hover: rgba(255, 255, 255, 0.05);
    --lightbox-paging-arrows-button-foreground-hover: white;
    --lightbox-paging-arrows-button-border-hover: none;


    /* Perspectivo’s Lit components */
    --switch-font-family: var(--font-family-sans);
    --switch-foreground: var(--text-color);
    --switch-background: #e0e0e0;
    --switch-background-checked: #4caf50;
}

h1,
.h1 {
    --foreground: var(--color-secondary-500);
}