energy-foundations 2.3.0 → 2.5.0-beta.0

package/README.md

@@ -4,6 +4,16 @@ This is css style library based on the foundations of Repsol's newest design sys
 It can be used on static websites, SPAs or even AEM products. It is the basic pillar supports energy-components.
 
 # Getting Started
+
+## Pre-commit checks
+
+The pre-commit hook runs `lint-staged` with the locally installed `eslint`
+and `stylelint` executables against staged files. These checks do not require
+a global Yarn installation. Install the project's development dependencies
+before committing; do not bypass the hook to work around missing tools.
+The `commit-msg` hook also uses the local Commitlint executable to validate
+the message file passed by Git, without requiring global Yarn.
+
 This library requires Vue.js v3.2 or higher.
 
 > **Recomendación:** Se recomienda instalar las últimas versiones de **SASS** y **Vite** para que todo funcione correctamente sin warnings.

package/dist/energy-foundations.css

@@ -1 +1 @@
-:root{--f-base: 16;--f-light: 300;--rds-typography-w-auto: "auto";--rds-typography-w-regular: 400;--rds-typography-w-medium: 500;--rds-typography-w-semibold: 600;--rds-typography-w-bold: 700;--rds-typography-f-text: "RepsolSoleTextRegular";--rds-typography-f-text-bold: "RepsolSoleTextBold";--rds-typography-f-headline: "RepsolSoleDisplayRegular";--rds-typography-f-headline-bold: "RepsolSoleDisplayBold";--rds-typography-f-code: "SourceCodeProRegular";--rds-typography-f-code-bold: "SourceCodeProBold";--rds-caption-01: .875rem/1.125rem RepsolSoleTextRegular;--rds-caption-01-bold: .875rem/1.125rem RepsolSoleTextBold;--rds-caption-01-underline: .875rem/1.125rem RepsolSoleTextRegular;--rds-caption-02: .75rem/1rem RepsolSoleTextRegular;--rds-caption-02-bold: .75rem/1rem RepsolSoleTextBold;--rds-caption-02-underline: .75rem/1rem RepsolSoleTextRegular;--rds-caption-tag: .75rem/1rem RepsolSoleTextRegular;--rds-body-01: 1rem/1.5rem RepsolSoleTextRegular;--rds-body-02: .875rem/1.25rem RepsolSoleTextRegular;--rds-body-01-bold: 1rem/1.5rem RepsolSoleTextBold;--rds-body-01-underline: 1rem/1.3125rem RepsolSoleTextRegular;--rds-body-02-bold: .875rem/1.25rem RepsolSoleTextBold;--rds-body-02-underline: .875rem/1.25rem RepsolSoleTextRegular;--rds-button-01: 1rem/1.5rem RepsolSoleTextBold;--rds-button-02: .875rem/1.25rem RepsolSoleTextBold;--rds-monospaced-body-01: 1rem/1.5rem SourceCodeProRegular;--rds-monospaced-body-01-bold: 1rem/1.5rem SourceCodeProBold;--rds-monospaced-body-02: .875rem/1.25rem SourceCodeProRegular;--rds-monospaced-body-02-bold: .875rem/1.25rem SourceCodeProBold;--rds-monospaced-caption-01: .875rem/1.125rem SourceCodeProRegular;--rds-monospaced-caption-01-bold: .875rem/1.125rem SourceCodeProBold;--rds-monospaced-caption-02: .75rem/1rem SourceCodeProRegular;--rds-monospaced-caption-02-bold: .75rem/1rem SourceCodeProBold;--rds-title-01: 1.125rem/1.625rem RepsolSoleTextBold;--rds-title-02: 1rem/1.5rem RepsolSoleTextBold;--rds-headline-00-sd: 2.5rem/3rem RepsolSoleDisplayRegular;--rds-headline-00-md: 3.5rem/4.25rem RepsolSoleDisplayRegular;--rds-headline-00-ld: 4rem/5rem RepsolSoleDisplayRegular;--rds-headline-00-xd: 4.5rem/5.75rem RepsolSoleDisplayRegular;--rds-headline-01-sd: 2rem/2.5rem RepsolSoleDisplayRegular;--rds-headline-01-md: 2.5rem/3rem RepsolSoleDisplayRegular;--rds-headline-01-ld: 3rem/3.75rem RepsolSoleDisplayRegular;--rds-headline-01-xd: 3.5rem/4.25rem RepsolSoleDisplayRegular;--rds-headline-02-sd: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-headline-02-md: 2rem/2.5rem RepsolSoleDisplayRegular;--rds-headline-02-ld: 2.25rem/3rem RepsolSoleDisplayRegular;--rds-headline-02-xd: 2.75rem/3.5rem RepsolSoleDisplayRegular;--rds-headline-03-sd: 1.375rem/1.875rem RepsolSoleDisplayRegular;--rds-headline-03-md: 1.5rem/2rem RepsolSoleDisplayRegular;--rds-headline-03-ld: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-headline-03-xd: 2rem/2.5rem RepsolSoleDisplayRegular;--rds-headline-04-sd: 1.125rem/1.625rem RepsolSoleDisplayRegular;--rds-headline-04-md: 1.125rem/1.625rem RepsolSoleDisplayRegular;--rds-headline-04-ld: 1.25rem/1.75rem RepsolSoleDisplayRegular;--rds-headline-04-xd: 1.5rem/2rem RepsolSoleDisplayRegular;--rds-numbers-00-sd: 3.5rem/4.25rem RepsolSoleDisplayRegular;--rds-numbers-00-md: 3.5rem/4.25rem RepsolSoleDisplayRegular;--rds-numbers-00-ld: 7rem/8.5rem RepsolSoleDisplayRegular;--rds-numbers-00-xd: 7rem/8.5rem RepsolSoleDisplayRegular;--rds-numbers-01-sd: 2.25rem/2.75rem RepsolSoleDisplayRegular;--rds-numbers-01-md: 2.25rem/2.75rem RepsolSoleDisplayRegular;--rds-numbers-01-ld: 3rem/3.75rem RepsolSoleDisplayRegular;--rds-numbers-01-xd: 3rem/3.75rem RepsolSoleDisplayRegular;--rds-numbers-02-sd: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-numbers-02-md: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-numbers-02-ld: 2.5rem/3rem RepsolSoleDisplayRegular;--rds-numbers-02-xd: 2.5rem/3rem RepsolSoleDisplayRegular;--rds-numbers-03-sd: 1.5rem/2rem RepsolSoleDisplayRegular;--rds-numbers-03-md: 1.5rem/2rem RepsolSoleDisplayRegular;--rds-numbers-03-ld: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-numbers-03-xd: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-style-state-disabled: .3;--rds-spacing-global-0: 0px;--rds-spacing-global-4: 4px;--rds-spacing-global-6: 6px;--rds-spacing-global-8: 8px;--rds-spacing-global-12: 12px;--rds-spacing-global-16: 16px;--rds-spacing-global-24: 24px;--rds-spacing-global-32: 32px;--rds-spacing-global-40: 40px;--rds-spacing-global-48: 48px;--rds-spacing-global-56: 56px;--rds-spacing-global-64: 64px;--rds-spacing-global-72: 72px;--rds-spacing-global-80: 80px;--rds-spacing-global-88: 88px;--rds-spacing-global-96: 96px;--rds-spacing-global-112: 112px;--rds-spacing-global-120: 120px;--rds-spacing-global-128: 128px;--rds-spacing-layout-xxs: 4px;--rds-spacing-layout-xs: 8px;--rds-spacing-layout-s: 16px;--rds-spacing-layout-m: 24px;--rds-spacing-layout-l: 32px;--rds-spacing-layout-2l: 40px;--rds-spacing-layout-xl: 48px;--rds-spacing-layout-2xl: 64px;--rds-spacing-layout-3xl: 72px;--rds-spacing-layout-4xl: 80px;--rds-spacing-layout-5xl: 96px;--rds-spacing-layout-6xl: 112px;--rds-spacing-layout-7xl: 120px;--rds-style-shadow-s: 0px 1px 6px 0px rgba(0, 19, 36, .08);--rds-style-shadow-m: 0px 4px 16px 0px rgba(0, 19, 36, .08);--rds-style-shadow-negative: 0px 0px 1px 0px rgba(0, 19, 36, .08), 0px -4px 11px 0px rgba(0, 19, 36, .06);--bp-mobile: 719px;--bp-tablet: 720px;--bp-desktop: 1280px;--bp-desktop-large: 1440px;--bp-ultrawide: 1600px;--g-padding-mobile: 16px;--g-padding-tablet: 24px;--g-padding-desktop: 32px;--g-padding-ultrawide: 32px;--rds-overlay-backdrop-filter: blur(6px);--rds-glass-backdrop-filter: blur(48px);--rds-glass-box-shadow: 0 4px 16px 0 rgba($rds-color-neutral-black, .08);--rds-color-content-high: var(--rds-color-navy-80);--rds-color-content-medium: var(--rds-color-navy-60);--rds-color-content-high-inverse: var(--rds-color-neutral-white);--rds-color-content-medium-inverse: #FFFFFFCC;--rds-color-content-link: var(--rds-color-turquoise-70);--rds-color-link-content-default: var(--rds-color-turquoise-70);--rds-color-link-content-inverse: var(--rds-color-neutral-white);--rds-color-link-content-state-active: var(--rds-color-turquoise-60);--rds-color-link-content-state-active-inverse: var(--rds-color-neutral-white);--rds-color-link-content-state-hover: var(--rds-color-turquoise-50);--rds-color-link-content-state-hover-inverse: #ffffffcc;--rds-color-content-state-disabled: #001e374d;--rds-color-content-state-disabled-inverse: #ffffff80;--rds-color-background-default: var(--rds-color-neutral-white);--rds-color-background-alternative: var(--rds-color-neutral-grey);--rds-color-surface-white: var(--rds-color-neutral-white);--rds-color-surface-grey: var(--rds-color-neutral-grey);--rds-color-surface-navy: var(--rds-color-navy-80);--rds-color-surface-sand: var(--rds-color-orange-0);--rds-color-highlightedSurface-ivoryGradient: radial-gradient(72.02% 87% at -30.72% 124.82%, rgba(246, 61, 120, .16) 0%, rgba(246, 61, 120, 0) 100%), radial-gradient(50.12% 73.11% at 0% 0%, rgba(255, 199, 0, .08) 0%, rgba(255, 199, 0, 0) 100%), radial-gradient(100.59% 146.79% at 134.93% -38.77%, rgba(245, 13, 54, .16) 0%, rgba(245, 13, 54, 0) 100%), radial-gradient(54.5% 79.54% at 104.6% 106.5%, rgba(255, 153, 3, .16) 0%, rgba(255, 153, 3, 0) 100%), linear-gradient(0deg, #FBF3EF, #FBF3EF);--rds-color-highlightedSurface-orangeGradient: linear-gradient(137.24deg, #FF9C00 -6.64%, #FF590A 24.3%, #FF2A3F 65.21%, #E50052 99.99%);--rds-color-highlightedSurface-blueGradient: radial-gradient(447.21% 116.27% at 100% 96.99%, rgba(0, 30, 55, .23) 31.58%, #001E37 100%), radial-gradient(688.79% 121.6% at 13.55% 14.49%, #001e37 4.33%, #005C7A 55.21%, #057796e8 69.81%, #00BED4 92%);--rds-color-surface-highlighted-active: var(--rds-color-orange-0);--rds-color-border-high: var(--rds-color-navy-30);--rds-color-border-low: var(--rds-color-navy-05);--rds-color-border-high-inverse: #ffffff80;--rds-color-border-low-inverse: #ffffff40;--rds-color-border-highlighted-hover: var(--rds-color-orange-30);--rds-color-border-hover-inverse: rgba(255, 255, 255, .5);--rds-color-border-hover: var(--rds-color-navy-30);--rds-color-border-highlighted-active: linear-gradient(137.24deg, #FF9C00 -6.64%, #FF7E45 24.3%, #FF3740 65.21%, #C02030 99.99%);--rds-color-semantic-content-error: var(--rds-color-red-60);--rds-color-semantic-content-information: var(--rds-color-turquoise-50);--rds-color-semantic-content-success: var(--rds-color-green-60);--rds-color-semantic-content-warning: var(--rds-color-yellow-60);--rds-color-semantic-background-success: var(--rds-color-green-10);--rds-color-semantic-background-error: var(--rds-color-red-05);--rds-color-semantic-background-information: var(--rds-color-turquoise-05);--rds-color-semantic-background-warning: var(--rds-color-yellow-10);--rds-color-extended-content-promo: var(--rds-color-gradient-orange-stop100);--rds-color-extended-surface-promo: var(--rds-color-gradient-orange-stop100);--rds-color-styles-elevation-glass-base: #ffffff60;--rds-color-styles-elevation-overlay: #001e3733;--rds-color-button-primary-surface-active: var(--rds-color-turquoise-70);--rds-color-button-primary-surface-active-inverse: #ffffffcc;--rds-color-button-primary-surface-default: var(--rds-color-navy-80);--rds-color-button-primary-surface-default-inverse: var(--rds-color-neutral-white);--rds-color-button-primary-surface-hover: var(--rds-color-turquoise-50);--rds-color-button-primary-surface-hover-inverse: #ffffff99;--rds-color-button-secondary-border-active: var(--rds-color-turquoise-50);--rds-color-button-secondary-border-active-inverse: var(--rds-color-neutral-white);--rds-color-button-secondary-border-default: var(--rds-color-navy-60);--rds-color-button-secondary-border-default-inverse: var(--rds-color-neutral-white);--rds-color-button-secondary-border-hover: var(--rds-color-turquoise-70);--rds-color-button-secondary-border-hover-inverse: #ffffffcc;--rds-color-button-secondary-surface-active-inverse: #FFFFFF1A;--rds-color-button-secondary-surface-hover-inverse: #FFFFFF40;--rds-color-interactive-border-state-active: var(--rds-color-turquoise-80);--rds-color-interactive-border-state-focus: var(--rds-color-turquoise-50);--rds-color-interactive-border-state-hover: var(--rds-color-navy-80);--rds-color-interactive-content-state-active: var(--rds-color-turquoise-50);--rds-color-interactive-content-state-hover: var(--rds-color-turquoise-70);--rds-color-interactive-surface-alternative: var(--rds-color-navy-05);--rds-color-interactive-surface-state-active: var(--rds-color-navy-80);--rds-color-interactive-surface-state-hover: var(--rds-color-navy-0);--rds-color-content-hover: var(--rds-color-turquoise-50);--rds-color-content-active: var(--rds-color-turquoise-70);--rds-color-interactive-surface-default: var(--rds-color-neutral-white);--rds-color-interactive-surface-hover: var(--rds-color-navy-0);--rds-color-interactive-surface-active: var(--rds-color-navy-80);--rds-color-interactive-border-default: var(--rds-color-navy-30);--rds-color-interactive-border-hover: var(--rds-color-navy-80);--rds-color-interactive-border-active: var(--rds-color-navy-80);--rds-color-interactive-border-focus: var(--rds-color-turquoise-50);--rds-color-content-highlightedIconOnly-AltGradientOrange: linear-gradient(137.24deg, #FF9C00 -6.64%, #FF7E45 24.3%, #FF3740 65.21%, #C02030 99.99%);--rds-color-style-cover-default: rgba(0, 30, 55, .48);--rds-color-style-cover-darker: rgba(0, 30, 55, .6);--rds-color-navy-0: #f4f8fa;--rds-color-navy-05: #DBE6F0;--rds-color-navy-10: #d4e1ed;--rds-color-navy-20: #b8ccdb;--rds-color-navy-30: #95b0c6;--rds-color-navy-40: #7997af;--rds-color-navy-50: #5d7d98;--rds-color-navy-60: #43637d;--rds-color-navy-70: #18354d;--rds-color-navy-80: #001e37;--rds-color-navy-900: #001324;--rds-color-orange-0: #fff5f0;--rds-color-orange-05: #fae2d6;--rds-color-orange-10: #fbd0bb;--rds-color-orange-20: #f9b695;--rds-color-orange-30: #FFB18A;--rds-color-orange-40: #ff945f;--rds-color-orange-50: #ff8346;--rds-color-orange-60: #ff7633;--rds-color-orange-70: #ff590a;--rds-color-orange-80: #bf4a13;--rds-color-orange-900: #80310d;--rds-color-turquoise-0: #f1fbfe;--rds-color-turquoise-05: #daf5fb;--rds-color-turquoise-10: #b1f1fb;--rds-color-turquoise-20: #8beaf9;--rds-color-turquoise-30: #5ae2f6;--rds-color-turquoise-40: #0ccfed;--rds-color-turquoise-50: #009BBE;--rds-color-turquoise-60: #00809C;--rds-color-turquoise-70: #006A82;--rds-color-turquoise-80: #005870;--rds-color-turquoise-90: #004357;--rds-color-red-0: #fff5f6;--rds-color-red-05: #ffdbdf;--rds-color-red-10: #ffccd1;--rds-color-red-20: #ffb8bf;--rds-color-red-30: #ff99a3;--rds-color-red-40: #ff707e;--rds-color-red-50: #fa384a;--rds-color-red-60: #dE1c2e;--rds-color-red-70: #c20012;--rds-color-red-80: #94000e;--rds-color-red-900: #70000b;--rds-color-yellow-0: #fff8ed;--rds-color-yellow-05: #fff3e0;--rds-color-yellow-10: #ffebcc;--rds-color-yellow-20: #ffe1b2;--rds-color-yellow-30: #ffd593;--rds-color-yellow-40: #ffc466;--rds-color-yellow-50: #ffb033;--rds-color-yellow-60: #f59600;--rds-color-yellow-70: #db8600;--rds-color-yellow-80: #9d6000;--rds-color-yellow-90: #6c4200;--rds-color-green-0: #f7fdf8;--rds-color-green-05: #ebfaee;--rds-color-green-10: #d3f3db;--rds-color-green-20: #ace7ba;--rds-color-green-30: #85d598;--rds-color-green-40: #5ebf75;--rds-color-green-50: #33a34e;--rds-color-green-60: #28803d;--rds-color-green-70: #216932;--rds-color-green-80: #184e25;--rds-color-green-90: #11361a;--rds-color-neutral-black: #000000;--rds-color-neutral-grey: #f7f7f9;--rds-color-neutral-white: #ffffff;--rds-color-extended-dirt-0: #f5f3f0;--rds-color-extended-dirt-10: #e2dbd4;--rds-color-extended-dirt-20: #d0c4b9;--rds-color-extended-dirt-30: #bdac9d;--rds-color-extended-dirt-40: #ac9785;--rds-color-extended-dirt-50: #817164;--rds-color-extended-dirt-60: #564c43;--rds-color-extended-electric-yellow-40: #fbf351;--rds-color-extended-grey-0: #f8f8f8;--rds-color-extended-grey-10: #ebebeb;--rds-color-extended-grey-20: #dfdfdf;--rds-color-extended-grey-30: #d2d2d2;--rds-color-extended-grey-40: #c1c6c9;--rds-color-extended-grey-50: #717b84;--rds-color-extended-grey-60: #3a444c;--rds-color-extended-rosewood-20: #fcf3f8;--rds-color-extended-rosewood-40: #f1c1da;--rds-color-extended-fuchsia-50: #E50052;--rds-color-extended-violet-40: #805b9f;--rds-color-gradient-blue-stop000: #00bed4;--rds-color-gradient-blue-stop023: #057796e8;--rds-color-gradient-blue-stop041: #005c7a;--rds-color-gradient-blue-stop100: #001e37;--rds-color-gradient-ivory-base: #fff5f0;--rds-color-gradient-ivory-fucsia-stop000: #f63d7800;--rds-color-gradient-ivory-fucsia-stop100: #f63d78;--rds-color-gradient-ivory-orange-stop000: #ff990300;--rds-color-gradient-ivory-orange-stop1000: #ff9903;--rds-color-gradient-ivory-red-stop000: #f50d3600;--rds-color-gradient-ivory-red-stop100: #f50d36;--rds-color-gradient-ivory-yellow-stop000: #ffc70000;--rds-color-gradient-ivory-yellow-stop100: #ffc700;--rds-color-gradient-orange-stop000: #ff9c00;--rds-color-gradient-orange-stop029: #ff590a;--rds-color-gradient-orange-stop067: #ff2a3f;--rds-color-gradient-orange-stop100: #e50052;--rds-color-data-magenta-00: #E50052;--rds-color-data-magenta-01: #FFCCDE;--rds-color-data-magenta-02: #FF7FAD;--rds-color-data-magenta-03: #F0397A;--rds-color-data-magenta-04: #A5023C;--rds-color-data-magenta-05: #81002E;--rds-color-data-magenta-06: #55001F;--rds-color-data-yellow-00: #FFAF19;--rds-color-data-yellow-01: #FFE5BC;--rds-color-data-yellow-02: #FFCF82;--rds-color-data-yellow-03: #E6981C;--rds-color-data-yellow-04: #C27F16;--rds-color-data-yellow-05: #9D6711;--rds-color-data-yellow-06: #603F0B;--rds-color-data-carrot-00: #FA590A;--rds-color-data-carrot-01: #FFD9C7;--rds-color-data-carrot-02: #FFB38F;--rds-color-data-carrot-03: #FF8D57;--rds-color-data-carrot-04: #C74000;--rds-color-data-carrot-05: #8F2E00;--rds-color-data-carrot-06: #611F00;--rds-color-data-blue-00: #001E37;--rds-color-data-blue-01: #A5D6FF;--rds-color-data-blue-02: #52B0FF;--rds-color-data-blue-03: #007DE5;--rds-color-data-blue-04: #005FAD;--rds-color-data-blue-05: #003A6B;--rds-color-data-turquoise-00: #00BED4;--rds-color-data-turquoise-01: #96E6EF;--rds-color-data-turquoise-02: #009CB6;--rds-color-data-turquoise-03: #007A8E;--rds-color-data-turquoise-04: #005968;--rds-color-data-turquoise-05: #003740;--rds-color-data-velvet-00: #6F0050;--rds-color-data-velvet-01: #E9B1D9;--rds-color-data-velvet-02: #D67ABC;--rds-color-data-velvet-03: #C2088E;--rds-color-data-velvet-04: #9E0071;--rds-color-data-velvet-05: #380028;--rds-color-data-pink-00: #E96DE7;--rds-color-data-pink-01: #FFD3FE;--rds-color-data-pink-02: #FF98FD;--rds-color-data-pink-03: #CE46CC;--rds-color-data-pink-04: #9C349A;--rds-color-data-pink-05: #621D60;--rds-color-data-jade-00: #045853;--rds-color-data-jade-01: #B0FFFA;--rds-color-data-jade-02: #14ECDF;--rds-color-data-jade-03: #0DBDB2;--rds-color-data-jade-04: #038880;--rds-color-data-jade-05: #022725;--rds-color-data-purple-00: #896CFE;--rds-color-data-purple-01: #DDD5FF;--rds-color-data-purple-02: #BCABFF;--rds-color-data-purple-03: #6A52CA;--rds-color-data-purple-04: #4A388E;--rds-color-data-purple-05: #2C1F5D;--rds-color-data-brown-00: #80310D;--rds-color-data-brown-01: #E6B49D;--rds-color-data-brown-02: #D77F57;--rds-color-data-brown-03: #CC6434;--rds-color-data-brown-04: #B0410E;--rds-color-data-brown-05: #471701;--rds-color-data-content-high: #001E37;--rds-color-data-content-medium: #43637D;--rds-color-data-content-disabled: #001E374D;--rds-color-data-content-high-inverse: #FFFFFF;--rds-color-data-content-medium-inverse: #FFFFFFCC;--rds-color-data-content-link: #007899;--rds-color-data-background-basic: #FFFFFF;--rds-color-data-background-grey-01: #F7F7F9;--rds-color-data-background-grey-02: #E5EEF5;--rds-color-data-border-high: #001E37;--rds-color-data-border-mid: #C1D5E6;--rds-color-data-border-low: #DBE6F0;--rds-color-data-neutral-black: #000000;--rds-color-data-neutral-white: #FFFFFF;--rds-color-data-lapis-lazuli-00: #001E37;--rds-color-data-lapis-lazuli-01: #8FCCFF;--rds-color-data-lapis-lazuli-02: #52B0FF;--rds-color-data-lapis-lazuli-03: #007DE5;--rds-color-data-lapis-lazuli-04: #005FAD;--rds-color-data-lapis-lazuli-05: #003A6B;--rds-color-data-light-blue-00: #009BF5;--rds-color-data-light-blue-01: #A8DFFF;--rds-color-data-light-blue-02: #70CBFF;--rds-color-data-light-blue-03: #006EAD;--rds-color-data-light-blue-04: #004E7A;--rds-color-data-light-blue-05: #002D47;--rds-color-data-light-purple-00: #7976FE;--rds-color-data-light-purple-01: #DDDCFF;--rds-color-data-light-purple-02: #ABA9FE;--rds-color-data-light-purple-03: #4844FE;--rds-color-data-light-purple-04: #0702F3;--rds-color-data-light-purple-05: #030179;--rds-radius-s: 8px;--rds-radius-m: 16px;--rds-radius-l: 24px;--rds-radius-round: 999px;--rds-radius-inputs: 12px}
+:root{--f-base: 16;--f-light: 300;--rds-typography-w-auto: "auto";--rds-typography-w-regular: 400;--rds-typography-w-medium: 500;--rds-typography-w-semibold: 600;--rds-typography-w-bold: 700;--rds-typography-f-text: "RepsolSoleTextRegular";--rds-typography-f-text-bold: "RepsolSoleTextBold";--rds-typography-f-headline: "RepsolSoleDisplayRegular";--rds-typography-f-headline-bold: "RepsolSoleDisplayBold";--rds-typography-f-code: "SourceCodeProRegular";--rds-typography-f-code-bold: "SourceCodeProBold";--rds-caption-01: .875rem/1.125rem RepsolSoleTextRegular;--rds-caption-01-bold: .875rem/1.125rem RepsolSoleTextBold;--rds-caption-01-underline: .875rem/1.125rem RepsolSoleTextRegular;--rds-caption-02: .75rem/1rem RepsolSoleTextRegular;--rds-caption-02-bold: .75rem/1rem RepsolSoleTextBold;--rds-caption-02-underline: .75rem/1rem RepsolSoleTextRegular;--rds-caption-tag: .75rem/1rem RepsolSoleTextRegular;--rds-body-01: 1rem/1.5rem RepsolSoleTextRegular;--rds-body-02: .875rem/1.25rem RepsolSoleTextRegular;--rds-body-01-bold: 1rem/1.5rem RepsolSoleTextBold;--rds-body-01-underline: 1rem/1.5rem RepsolSoleTextRegular;--rds-body-02-bold: .875rem/1.25rem RepsolSoleTextBold;--rds-body-02-underline: .875rem/1.25rem RepsolSoleTextRegular;--rds-button-01: 1rem/1.5rem RepsolSoleTextBold;--rds-button-02: .875rem/1.25rem RepsolSoleTextBold;--rds-monospaced-body-01: 1rem/1.5rem SourceCodeProRegular;--rds-monospaced-body-01-bold: 1rem/1.5rem SourceCodeProBold;--rds-monospaced-body-02: .875rem/1.25rem SourceCodeProRegular;--rds-monospaced-body-02-bold: .875rem/1.25rem SourceCodeProBold;--rds-monospaced-caption-01: .875rem/1.125rem SourceCodeProRegular;--rds-monospaced-caption-01-bold: .875rem/1.125rem SourceCodeProBold;--rds-monospaced-caption-02: .75rem/1rem SourceCodeProRegular;--rds-monospaced-caption-02-bold: .75rem/1rem SourceCodeProBold;--rds-title-01: 1.125rem/1.625rem RepsolSoleTextBold;--rds-title-02: 1rem/1.5rem RepsolSoleTextBold;--rds-headline-00-sd: 2.5rem/3rem RepsolSoleDisplayRegular;--rds-headline-00-md: 2.5rem/3rem RepsolSoleDisplayRegular;--rds-headline-00-ld: 4rem/5rem RepsolSoleDisplayRegular;--rds-headline-00-xd: 4.5rem/5.75rem RepsolSoleDisplayRegular;--rds-headline-01-sd: 2rem/2.5rem RepsolSoleDisplayRegular;--rds-headline-01-md: 2rem/2.5rem RepsolSoleDisplayRegular;--rds-headline-01-ld: 3rem/3.75rem RepsolSoleDisplayRegular;--rds-headline-01-xd: 3.5rem/4.25rem RepsolSoleDisplayRegular;--rds-headline-02-sd: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-headline-02-md: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-headline-02-ld: 2.25rem/3rem RepsolSoleDisplayRegular;--rds-headline-02-xd: 2.75rem/3.5rem RepsolSoleDisplayRegular;--rds-headline-03-sd: 1.375rem/1.875rem RepsolSoleDisplayRegular;--rds-headline-03-md: 1.375rem/1.875rem RepsolSoleDisplayRegular;--rds-headline-03-ld: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-headline-03-xd: 2rem/2.5rem RepsolSoleDisplayRegular;--rds-headline-04-sd: 1.125rem/1.625rem RepsolSoleDisplayRegular;--rds-headline-04-md: 1.125rem/1.625rem RepsolSoleDisplayRegular;--rds-headline-04-ld: 1.25rem/1.75rem RepsolSoleDisplayRegular;--rds-headline-04-xd: 1.5rem/2rem RepsolSoleDisplayRegular;--rds-numbers-00-sd: 3.5rem/4.25rem RepsolSoleDisplayRegular;--rds-numbers-00-md: 3.5rem/4.25rem RepsolSoleDisplayRegular;--rds-numbers-00-ld: 7rem/8.5rem RepsolSoleDisplayRegular;--rds-numbers-00-xd: 7rem/8.5rem RepsolSoleDisplayRegular;--rds-numbers-01-sd: 2.25rem/2.75rem RepsolSoleDisplayRegular;--rds-numbers-01-md: 2.25rem/2.75rem RepsolSoleDisplayRegular;--rds-numbers-01-ld: 3rem/3.75rem RepsolSoleDisplayRegular;--rds-numbers-01-xd: 3rem/3.75rem RepsolSoleDisplayRegular;--rds-numbers-02-sd: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-numbers-02-md: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-numbers-02-ld: 2.5rem/3rem RepsolSoleDisplayRegular;--rds-numbers-02-xd: 2.5rem/3rem RepsolSoleDisplayRegular;--rds-numbers-03-sd: 1.5rem/2rem RepsolSoleDisplayRegular;--rds-numbers-03-md: 1.5rem/2rem RepsolSoleDisplayRegular;--rds-numbers-03-ld: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-numbers-03-xd: 1.75rem/2.25rem RepsolSoleDisplayRegular;--rds-style-state-disabled: .3;--rds-spacing-global-0: 0px;--rds-spacing-global-4: 4px;--rds-spacing-global-6: 6px;--rds-spacing-global-8: 8px;--rds-spacing-global-12: 12px;--rds-spacing-global-16: 16px;--rds-spacing-global-24: 24px;--rds-spacing-global-32: 32px;--rds-spacing-global-40: 40px;--rds-spacing-global-48: 48px;--rds-spacing-global-56: 56px;--rds-spacing-global-64: 64px;--rds-spacing-global-72: 72px;--rds-spacing-global-80: 80px;--rds-spacing-global-88: 88px;--rds-spacing-global-96: 96px;--rds-spacing-global-112: 112px;--rds-spacing-global-120: 120px;--rds-spacing-global-128: 128px;--rds-spacing-layout-xxs: 4px;--rds-spacing-layout-xs: 8px;--rds-spacing-layout-s: 16px;--rds-spacing-layout-m: 24px;--rds-spacing-layout-l: 32px;--rds-spacing-layout-2l: 40px;--rds-spacing-layout-xl: 48px;--rds-spacing-layout-2xl: 64px;--rds-spacing-layout-3xl: 72px;--rds-spacing-layout-4xl: 80px;--rds-spacing-layout-5xl: 96px;--rds-spacing-layout-6xl: 112px;--rds-spacing-layout-7xl: 120px;--rds-style-shadow-s: 0px 1px 6px 0px rgba(0, 19, 36, .08);--rds-style-shadow-m: 0px 4px 16px 0px rgba(0, 19, 36, .08);--rds-style-shadow-negative: 0px 0px 1px 0px rgba(0, 19, 36, .08), 0px -4px 11px 0px rgba(0, 19, 36, .06);--bp-mobile: 719px;--bp-tablet: 720px;--bp-desktop: 1280px;--bp-desktop-large: 1440px;--bp-ultrawide: 1600px;--g-padding-mobile: 16px;--g-padding-tablet: 24px;--g-padding-desktop: 32px;--g-padding-ultrawide: 32px;--rds-overlay-backdrop-filter: blur(6px);--rds-glass-backdrop-filter: blur(48px);--rds-glass-box-shadow: 0 4px 16px 0 rgba($rds-color-neutral-black, .08);--rds-color-content-high: var(--rds-color-navy-80);--rds-color-content-medium: var(--rds-color-navy-60);--rds-color-content-high-inverse: var(--rds-color-neutral-white);--rds-color-content-medium-inverse: #FFFFFFCC;--rds-color-content-link: var(--rds-color-turquoise-70);--rds-color-link-content-default: var(--rds-color-turquoise-70);--rds-color-link-content-inverse: var(--rds-color-neutral-white);--rds-color-link-content-state-active: var(--rds-color-turquoise-60);--rds-color-link-content-state-active-inverse: var(--rds-color-neutral-white);--rds-color-link-content-state-hover: var(--rds-color-turquoise-50);--rds-color-link-content-state-hover-inverse: #ffffffcc;--rds-color-content-state-disabled: #001e374d;--rds-color-content-state-disabled-inverse: #ffffff80;--rds-color-background-default: var(--rds-color-neutral-white);--rds-color-background-alternative: var(--rds-color-neutral-grey);--rds-color-surface-white: var(--rds-color-neutral-white);--rds-color-surface-grey: var(--rds-color-neutral-grey);--rds-color-surface-navy: var(--rds-color-navy-80);--rds-color-surface-sand: var(--rds-color-orange-0);--rds-color-highlightedSurface-ivoryGradient: radial-gradient(72.02% 87% at -30.72% 124.82%, rgba(246, 61, 120, .16) 0%, rgba(246, 61, 120, 0) 100%), radial-gradient(50.12% 73.11% at 0% 0%, rgba(255, 199, 0, .08) 0%, rgba(255, 199, 0, 0) 100%), radial-gradient(100.59% 146.79% at 134.93% -38.77%, rgba(245, 13, 54, .16) 0%, rgba(245, 13, 54, 0) 100%), radial-gradient(54.5% 79.54% at 104.6% 106.5%, rgba(255, 153, 3, .16) 0%, rgba(255, 153, 3, 0) 100%), linear-gradient(0deg, #FBF3EF, #FBF3EF);--rds-color-highlightedSurface-orangeGradient: linear-gradient(137.24deg, #FF9C00 -6.64%, #FF590A 24.3%, #FF2A3F 65.21%, #E50052 99.99%);--rds-color-highlightedSurface-blueGradient: radial-gradient(447.21% 116.27% at 100% 96.99%, rgba(0, 30, 55, .23) 31.58%, #001E37 100%), radial-gradient(688.79% 121.6% at 13.55% 14.49%, #001e37 4.33%, #005C7A 55.21%, #057796e8 69.81%, #00BED4 92%);--rds-color-surface-highlighted-active: var(--rds-color-orange-0);--rds-color-border-high: var(--rds-color-navy-30);--rds-color-border-low: var(--rds-color-navy-05);--rds-color-border-high-inverse: #ffffff80;--rds-color-border-low-inverse: #ffffff40;--rds-color-border-highlighted-hover: var(--rds-color-orange-30);--rds-color-border-hover-inverse: rgba(255, 255, 255, .5);--rds-color-border-hover: var(--rds-color-navy-30);--rds-color-border-highlighted-active: linear-gradient(137.24deg, #FF9C00 -6.64%, #FF7E45 24.3%, #FF3740 65.21%, #C02030 99.99%);--rds-color-semantic-content-error: var(--rds-color-red-60);--rds-color-semantic-content-information: var(--rds-color-turquoise-50);--rds-color-semantic-content-success: var(--rds-color-green-60);--rds-color-semantic-content-warning: var(--rds-color-yellow-60);--rds-color-semantic-background-success: var(--rds-color-green-10);--rds-color-semantic-background-error: var(--rds-color-red-05);--rds-color-semantic-background-information: var(--rds-color-turquoise-05);--rds-color-semantic-background-warning: var(--rds-color-yellow-10);--rds-color-extended-content-promo: var(--rds-color-gradient-orange-stop100);--rds-color-extended-surface-promo: var(--rds-color-gradient-orange-stop100);--rds-color-styles-elevation-glass-base: #ffffff60;--rds-color-styles-elevation-overlay: #001e3733;--rds-color-button-primary-surface-active: var(--rds-color-turquoise-70);--rds-color-button-primary-surface-active-inverse: #ffffffcc;--rds-color-button-primary-surface-default: var(--rds-color-navy-80);--rds-color-button-primary-surface-default-inverse: var(--rds-color-neutral-white);--rds-color-button-primary-surface-hover: var(--rds-color-turquoise-50);--rds-color-button-primary-surface-hover-inverse: #ffffff99;--rds-color-button-secondary-border-active: var(--rds-color-turquoise-50);--rds-color-button-secondary-border-active-inverse: var(--rds-color-neutral-white);--rds-color-button-secondary-border-default: var(--rds-color-navy-60);--rds-color-button-secondary-border-default-inverse: var(--rds-color-neutral-white);--rds-color-button-secondary-border-hover: var(--rds-color-turquoise-70);--rds-color-button-secondary-border-hover-inverse: #ffffffcc;--rds-color-button-secondary-surface-active-inverse: #FFFFFF1A;--rds-color-button-secondary-surface-hover-inverse: #FFFFFF40;--rds-color-interactive-border-state-active: var(--rds-color-turquoise-80);--rds-color-interactive-border-state-focus: var(--rds-color-turquoise-50);--rds-color-interactive-border-state-hover: var(--rds-color-navy-80);--rds-color-interactive-content-state-active: var(--rds-color-turquoise-50);--rds-color-interactive-content-state-hover: var(--rds-color-turquoise-70);--rds-color-interactive-surface-alternative: var(--rds-color-navy-05);--rds-color-interactive-surface-state-active: var(--rds-color-navy-80);--rds-color-interactive-surface-state-hover: var(--rds-color-navy-0);--rds-color-content-hover: var(--rds-color-turquoise-50);--rds-color-content-active: var(--rds-color-turquoise-70);--rds-color-interactive-surface-default: var(--rds-color-neutral-white);--rds-color-interactive-surface-hover: var(--rds-color-navy-0);--rds-color-interactive-surface-active: var(--rds-color-navy-80);--rds-color-interactive-border-default: var(--rds-color-navy-30);--rds-color-interactive-border-hover: var(--rds-color-navy-80);--rds-color-interactive-border-active: var(--rds-color-navy-80);--rds-color-interactive-border-focus: var(--rds-color-turquoise-50);--rds-color-content-highlightedIconOnly-AltGradientOrange: linear-gradient(137.24deg, #FF9C00 -6.64%, #FF7E45 24.3%, #FF3740 65.21%, #C02030 99.99%);--rds-color-style-cover-default: rgba(0, 30, 55, .48);--rds-color-style-cover-darker: rgba(0, 30, 55, .6);--rds-color-navy-0: #f4f8fa;--rds-color-navy-05: #DBE6F0;--rds-color-navy-10: #d4e1ed;--rds-color-navy-20: #b8ccdb;--rds-color-navy-30: #95b0c6;--rds-color-navy-40: #7997af;--rds-color-navy-50: #5d7d98;--rds-color-navy-60: #43637d;--rds-color-navy-70: #18354d;--rds-color-navy-80: #001e37;--rds-color-navy-900: #001324;--rds-color-orange-0: #fff5f0;--rds-color-orange-05: #fae2d6;--rds-color-orange-10: #fbd0bb;--rds-color-orange-20: #f9b695;--rds-color-orange-30: #FFB18A;--rds-color-orange-40: #ff945f;--rds-color-orange-50: #ff8346;--rds-color-orange-60: #ff7633;--rds-color-orange-70: #ff590a;--rds-color-orange-80: #bf4a13;--rds-color-orange-900: #80310d;--rds-color-turquoise-0: #f1fbfe;--rds-color-turquoise-05: #daf5fb;--rds-color-turquoise-10: #b1f1fb;--rds-color-turquoise-20: #8beaf9;--rds-color-turquoise-30: #5ae2f6;--rds-color-turquoise-40: #0ccfed;--rds-color-turquoise-50: #009BBE;--rds-color-turquoise-60: #00809C;--rds-color-turquoise-70: #006A82;--rds-color-turquoise-80: #005870;--rds-color-turquoise-90: #004357;--rds-color-red-0: #fff5f6;--rds-color-red-05: #ffdbdf;--rds-color-red-10: #ffccd1;--rds-color-red-20: #ffb8bf;--rds-color-red-30: #ff99a3;--rds-color-red-40: #ff707e;--rds-color-red-50: #fa384a;--rds-color-red-60: #dE1c2e;--rds-color-red-70: #c20012;--rds-color-red-80: #94000e;--rds-color-red-900: #70000b;--rds-color-yellow-0: #fff8ed;--rds-color-yellow-05: #fff3e0;--rds-color-yellow-10: #ffebcc;--rds-color-yellow-20: #ffe1b2;--rds-color-yellow-30: #ffd593;--rds-color-yellow-40: #ffc466;--rds-color-yellow-50: #ffb033;--rds-color-yellow-60: #f59600;--rds-color-yellow-70: #db8600;--rds-color-yellow-80: #9d6000;--rds-color-yellow-90: #6c4200;--rds-color-green-0: #f7fdf8;--rds-color-green-05: #ebfaee;--rds-color-green-10: #d3f3db;--rds-color-green-20: #ace7ba;--rds-color-green-30: #85d598;--rds-color-green-40: #5ebf75;--rds-color-green-50: #33a34e;--rds-color-green-60: #28803d;--rds-color-green-70: #216932;--rds-color-green-80: #184e25;--rds-color-green-90: #11361a;--rds-color-neutral-black: #000000;--rds-color-neutral-grey: #f7f7f9;--rds-color-neutral-white: #ffffff;--rds-color-extended-dirt-0: #f5f3f0;--rds-color-extended-dirt-10: #e2dbd4;--rds-color-extended-dirt-20: #d0c4b9;--rds-color-extended-dirt-30: #bdac9d;--rds-color-extended-dirt-40: #ac9785;--rds-color-extended-dirt-50: #817164;--rds-color-extended-dirt-60: #564c43;--rds-color-extended-electric-yellow-40: #fbf351;--rds-color-extended-grey-0: #f8f8f8;--rds-color-extended-grey-10: #ebebeb;--rds-color-extended-grey-20: #dfdfdf;--rds-color-extended-grey-30: #d2d2d2;--rds-color-extended-grey-40: #c1c6c9;--rds-color-extended-grey-50: #717b84;--rds-color-extended-grey-60: #3a444c;--rds-color-extended-rosewood-20: #fcf3f8;--rds-color-extended-rosewood-40: #f1c1da;--rds-color-extended-fuchsia-50: #E50052;--rds-color-extended-violet-40: #805b9f;--rds-color-gradient-blue-stop000: #00bed4;--rds-color-gradient-blue-stop023: #057796e8;--rds-color-gradient-blue-stop041: #005c7a;--rds-color-gradient-blue-stop100: #001e37;--rds-color-gradient-ivory-base: #fff5f0;--rds-color-gradient-ivory-fucsia-stop000: #f63d7800;--rds-color-gradient-ivory-fucsia-stop100: #f63d78;--rds-color-gradient-ivory-orange-stop000: #ff990300;--rds-color-gradient-ivory-orange-stop1000: #ff9903;--rds-color-gradient-ivory-red-stop000: #f50d3600;--rds-color-gradient-ivory-red-stop100: #f50d36;--rds-color-gradient-ivory-yellow-stop000: #ffc70000;--rds-color-gradient-ivory-yellow-stop100: #ffc700;--rds-color-gradient-orange-stop000: #ff9c00;--rds-color-gradient-orange-stop029: #ff590a;--rds-color-gradient-orange-stop067: #ff2a3f;--rds-color-gradient-orange-stop100: #e50052;--rds-color-data-magenta-00: #E50052;--rds-color-data-magenta-01: #FFCCDE;--rds-color-data-magenta-02: #FF7FAD;--rds-color-data-magenta-03: #F0397A;--rds-color-data-magenta-04: #A5023C;--rds-color-data-magenta-05: #81002E;--rds-color-data-magenta-06: #55001F;--rds-color-data-yellow-00: #FFAF19;--rds-color-data-yellow-01: #FFE5BC;--rds-color-data-yellow-02: #FFCF82;--rds-color-data-yellow-03: #E6981C;--rds-color-data-yellow-04: #C27F16;--rds-color-data-yellow-05: #9D6711;--rds-color-data-yellow-06: #603F0B;--rds-color-data-carrot-00: #FA590A;--rds-color-data-carrot-01: #FFD9C7;--rds-color-data-carrot-02: #FFB38F;--rds-color-data-carrot-03: #FF8D57;--rds-color-data-carrot-04: #C74000;--rds-color-data-carrot-05: #8F2E00;--rds-color-data-carrot-06: #611F00;--rds-color-data-blue-00: #001E37;--rds-color-data-blue-01: #A5D6FF;--rds-color-data-blue-02: #52B0FF;--rds-color-data-blue-03: #007DE5;--rds-color-data-blue-04: #005FAD;--rds-color-data-blue-05: #003A6B;--rds-color-data-turquoise-00: #00BED4;--rds-color-data-turquoise-01: #96E6EF;--rds-color-data-turquoise-02: #009CB6;--rds-color-data-turquoise-03: #007A8E;--rds-color-data-turquoise-04: #005968;--rds-color-data-turquoise-05: #003740;--rds-color-data-velvet-00: #6F0050;--rds-color-data-velvet-01: #E9B1D9;--rds-color-data-velvet-02: #D67ABC;--rds-color-data-velvet-03: #C2088E;--rds-color-data-velvet-04: #9E0071;--rds-color-data-velvet-05: #380028;--rds-color-data-pink-00: #E96DE7;--rds-color-data-pink-01: #FFD3FE;--rds-color-data-pink-02: #FF98FD;--rds-color-data-pink-03: #CE46CC;--rds-color-data-pink-04: #9C349A;--rds-color-data-pink-05: #621D60;--rds-color-data-jade-00: #045853;--rds-color-data-jade-01: #B0FFFA;--rds-color-data-jade-02: #14ECDF;--rds-color-data-jade-03: #0DBDB2;--rds-color-data-jade-04: #038880;--rds-color-data-jade-05: #022725;--rds-color-data-purple-00: #896CFE;--rds-color-data-purple-01: #DDD5FF;--rds-color-data-purple-02: #BCABFF;--rds-color-data-purple-03: #6A52CA;--rds-color-data-purple-04: #4A388E;--rds-color-data-purple-05: #2C1F5D;--rds-color-data-brown-00: #80310D;--rds-color-data-brown-01: #E6B49D;--rds-color-data-brown-02: #D77F57;--rds-color-data-brown-03: #CC6434;--rds-color-data-brown-04: #B0410E;--rds-color-data-brown-05: #471701;--rds-color-data-content-high: #001E37;--rds-color-data-content-medium: #43637D;--rds-color-data-content-disabled: #001E374D;--rds-color-data-content-high-inverse: #FFFFFF;--rds-color-data-content-medium-inverse: #FFFFFFCC;--rds-color-data-content-link: #007899;--rds-color-data-background-basic: #FFFFFF;--rds-color-data-background-grey-01: #F7F7F9;--rds-color-data-background-grey-02: #E5EEF5;--rds-color-data-border-high: #001E37;--rds-color-data-border-mid: #C1D5E6;--rds-color-data-border-low: #DBE6F0;--rds-color-data-neutral-black: #000000;--rds-color-data-neutral-white: #FFFFFF;--rds-color-data-lapis-lazuli-00: #001E37;--rds-color-data-lapis-lazuli-01: #8FCCFF;--rds-color-data-lapis-lazuli-02: #52B0FF;--rds-color-data-lapis-lazuli-03: #007DE5;--rds-color-data-lapis-lazuli-04: #005FAD;--rds-color-data-lapis-lazuli-05: #003A6B;--rds-color-data-light-blue-00: #009BF5;--rds-color-data-light-blue-01: #A8DFFF;--rds-color-data-light-blue-02: #70CBFF;--rds-color-data-light-blue-03: #006EAD;--rds-color-data-light-blue-04: #004E7A;--rds-color-data-light-blue-05: #002D47;--rds-color-data-light-purple-00: #7976FE;--rds-color-data-light-purple-01: #DDDCFF;--rds-color-data-light-purple-02: #ABA9FE;--rds-color-data-light-purple-03: #4844FE;--rds-color-data-light-purple-04: #0702F3;--rds-color-data-light-purple-05: #030179;--rds-radius-s: 8px;--rds-radius-m: 16px;--rds-radius-l: 24px;--rds-radius-round: 999px;--rds-radius-inputs: 12px}

package/dist/foundations/_grid.scss

@@ -23,6 +23,28 @@
   }
 }
 
+.rds-layout-editorial {
+  padding: 0 $g-padding-mobile;
+
+  @include breakpoint(tablet-v2) {
+    padding: 0 $g-padding-tablet;
+  }
+
+  @include breakpoint(desktop-v2) {
+    padding: 0 $g-padding-desktop;
+  }
+
+  @include breakpoint(desktop-large-v2) {
+    padding: 0 72px;
+  }
+
+  @include breakpoint(ultrawide-v2) {
+    margin: 0 auto;
+    max-width: 1584px;
+    padding: 0 72px;
+  }
+}
+
 .rds-grid {
   display: grid;
   margin-left: auto;
@@ -37,6 +59,20 @@
   }
 }
 
+.rds-grid-editorial {
+  display: grid;
+  margin-left: auto;
+  margin-right: auto;
+  width: 100%;
+
+  @each $breakpoint, $config in $grid-config-editorial {
+    @include breakpoint($breakpoint) {
+      gap: map.get($config, gap);
+      grid-template-columns: repeat(map.get($config, max-columns), 1fr);
+    }
+  }
+}
+
 // Map of breakpoint names to abbreviations
 $breakpoint-abbr: (
   mobile: sd,

package/dist/generated/icon-layers.js

@@ -1,4 +1,4 @@
-/** Auto-generated by generateIconLayers.js on 2026-07-28T07:47:11.825Z */
+/** Auto-generated by generateIconLayers.js on 2026-10-15T08:50:14.974Z */
 /* eslint-disable */
 export const iconLayers = {
   "calendar_active": 8,

package/dist/generated/icon-layers.ts

@@ -1,4 +1,4 @@
-/** Auto-generated by generateIconLayers.js on 2026-07-28T07:47:11.825Z */
+/** Auto-generated by generateIconLayers.js on 2026-10-15T08:50:14.974Z */
 /* eslint-disable */
 export const iconLayers: Record<string, number> = {
   "calendar_active": 8,

package/dist/generated/icon-names.js

@@ -1,4 +1,4 @@
-/** Auto-generated by generateIconLayers.js on 2026-07-28T07:47:11.825Z */
+/** Auto-generated by generateIconLayers.js on 2026-10-15T08:50:14.974Z */
 /* eslint-disable */
 export const iconNames = [
   "ac-aire-acondicionado",

package/dist/generated/icon-names.ts

@@ -1,4 +1,4 @@
-/** Auto-generated by generateIconLayers.js on 2026-07-28T07:47:11.825Z */
+/** Auto-generated by generateIconLayers.js on 2026-10-15T08:50:14.974Z */
 /* eslint-disable */
 export const iconNames: string[] = [
   "ac-aire-acondicionado",

package/dist/index.css

@@ -28,7 +28,7 @@
   --rds-body-01: 1rem/1.5rem RepsolSoleTextRegular;
   --rds-body-02: 0.875rem/1.25rem RepsolSoleTextRegular;
   --rds-body-01-bold: 1rem/1.5rem RepsolSoleTextBold;
-  --rds-body-01-underline: 1rem/1.3125rem RepsolSoleTextRegular;
+  --rds-body-01-underline: 1rem/1.5rem RepsolSoleTextRegular;
   --rds-body-02-bold: 0.875rem/1.25rem RepsolSoleTextBold;
   --rds-body-02-underline: 0.875rem/1.25rem RepsolSoleTextRegular;
   --rds-button-01: 1rem/1.5rem RepsolSoleTextBold;
@@ -44,19 +44,19 @@
   --rds-title-01: 1.125rem/1.625rem RepsolSoleTextBold;
   --rds-title-02: 1rem/1.5rem RepsolSoleTextBold;
   --rds-headline-00-sd: 2.5rem/3rem RepsolSoleDisplayRegular;
-  --rds-headline-00-md: 3.5rem/4.25rem RepsolSoleDisplayRegular;
+  --rds-headline-00-md: 2.5rem/3rem RepsolSoleDisplayRegular;
   --rds-headline-00-ld: 4rem/5rem RepsolSoleDisplayRegular;
   --rds-headline-00-xd: 4.5rem/5.75rem RepsolSoleDisplayRegular;
   --rds-headline-01-sd: 2rem/2.5rem RepsolSoleDisplayRegular;
-  --rds-headline-01-md: 2.5rem/3rem RepsolSoleDisplayRegular;
+  --rds-headline-01-md: 2rem/2.5rem RepsolSoleDisplayRegular;
   --rds-headline-01-ld: 3rem/3.75rem RepsolSoleDisplayRegular;
   --rds-headline-01-xd: 3.5rem/4.25rem RepsolSoleDisplayRegular;
   --rds-headline-02-sd: 1.75rem/2.25rem RepsolSoleDisplayRegular;
-  --rds-headline-02-md: 2rem/2.5rem RepsolSoleDisplayRegular;
+  --rds-headline-02-md: 1.75rem/2.25rem RepsolSoleDisplayRegular;
   --rds-headline-02-ld: 2.25rem/3rem RepsolSoleDisplayRegular;
   --rds-headline-02-xd: 2.75rem/3.5rem RepsolSoleDisplayRegular;
   --rds-headline-03-sd: 1.375rem/1.875rem RepsolSoleDisplayRegular;
-  --rds-headline-03-md: 1.5rem/2rem RepsolSoleDisplayRegular;
+  --rds-headline-03-md: 1.375rem/1.875rem RepsolSoleDisplayRegular;
   --rds-headline-03-ld: 1.75rem/2.25rem RepsolSoleDisplayRegular;
   --rds-headline-03-xd: 2rem/2.5rem RepsolSoleDisplayRegular;
   --rds-headline-04-sd: 1.125rem/1.625rem RepsolSoleDisplayRegular;
@@ -517,7 +517,7 @@ h6 {
   --rds-body-01: 1rem/1.5rem RepsolSoleTextRegular;
   --rds-body-02: 0.875rem/1.25rem RepsolSoleTextRegular;
   --rds-body-01-bold: 1rem/1.5rem RepsolSoleTextBold;
-  --rds-body-01-underline: 1rem/1.3125rem RepsolSoleTextRegular;
+  --rds-body-01-underline: 1rem/1.5rem RepsolSoleTextRegular;
   --rds-body-02-bold: 0.875rem/1.25rem RepsolSoleTextBold;
   --rds-body-02-underline: 0.875rem/1.25rem RepsolSoleTextRegular;
   --rds-button-01: 1rem/1.5rem RepsolSoleTextBold;
@@ -533,19 +533,19 @@ h6 {
   --rds-title-01: 1.125rem/1.625rem RepsolSoleTextBold;
   --rds-title-02: 1rem/1.5rem RepsolSoleTextBold;
   --rds-headline-00-sd: 2.5rem/3rem RepsolSoleDisplayRegular;
-  --rds-headline-00-md: 3.5rem/4.25rem RepsolSoleDisplayRegular;
+  --rds-headline-00-md: 2.5rem/3rem RepsolSoleDisplayRegular;
   --rds-headline-00-ld: 4rem/5rem RepsolSoleDisplayRegular;
   --rds-headline-00-xd: 4.5rem/5.75rem RepsolSoleDisplayRegular;
   --rds-headline-01-sd: 2rem/2.5rem RepsolSoleDisplayRegular;
-  --rds-headline-01-md: 2.5rem/3rem RepsolSoleDisplayRegular;
+  --rds-headline-01-md: 2rem/2.5rem RepsolSoleDisplayRegular;
   --rds-headline-01-ld: 3rem/3.75rem RepsolSoleDisplayRegular;
   --rds-headline-01-xd: 3.5rem/4.25rem RepsolSoleDisplayRegular;
   --rds-headline-02-sd: 1.75rem/2.25rem RepsolSoleDisplayRegular;
-  --rds-headline-02-md: 2rem/2.5rem RepsolSoleDisplayRegular;
+  --rds-headline-02-md: 1.75rem/2.25rem RepsolSoleDisplayRegular;
   --rds-headline-02-ld: 2.25rem/3rem RepsolSoleDisplayRegular;
   --rds-headline-02-xd: 2.75rem/3.5rem RepsolSoleDisplayRegular;
   --rds-headline-03-sd: 1.375rem/1.875rem RepsolSoleDisplayRegular;
-  --rds-headline-03-md: 1.5rem/2rem RepsolSoleDisplayRegular;
+  --rds-headline-03-md: 1.375rem/1.875rem RepsolSoleDisplayRegular;
   --rds-headline-03-ld: 1.75rem/2.25rem RepsolSoleDisplayRegular;
   --rds-headline-03-xd: 2rem/2.5rem RepsolSoleDisplayRegular;
   --rds-headline-04-sd: 1.125rem/1.625rem RepsolSoleDisplayRegular;
@@ -3005,7 +3005,7 @@ html {
 }
 
 .rds-ld-body-01-underline {
-  font: 1rem/1.3125rem "RepsolSoleTextRegular";
+  font: 1rem/1.5rem "RepsolSoleTextRegular";
   text-decoration: underline;
 }
 
@@ -3150,7 +3150,7 @@ html {
 }
 
 .rds-sd-body-01-underline {
-  font: 1rem/1.3125rem "RepsolSoleTextRegular";
+  font: 1rem/1.5rem "RepsolSoleTextRegular";
   text-decoration: underline;
 }
 
@@ -3295,7 +3295,7 @@ html {
 }
 
 .rds-body-01-underline {
-  font: 1rem/1.3125rem "RepsolSoleTextRegular";
+  font: 1rem/1.5rem "RepsolSoleTextRegular";
   text-decoration: underline;
 }
 
@@ -3329,7 +3329,7 @@ html {
 }
 @media (min-width: 720px) {
   .rds-headline-00 {
-    font: 3.5rem/4.25rem "RepsolSoleDisplayRegular";
+    font: 2.5rem/3rem "RepsolSoleDisplayRegular";
   }
 }
 @media (min-width: 1280px) {
@@ -3342,13 +3342,33 @@ html {
     font: 4.5rem/5.75rem "RepsolSoleDisplayRegular";
   }
 }
+@media (min-width: 720px) {
+  :where(body[data-rds-layout=b]) .rds-headline-00 {
+    font: 2.5rem/3rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 800px) {
+  :where(body[data-rds-layout=b]) .rds-headline-00 {
+    font: 2.5rem/3rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 1024px) {
+  :where(body[data-rds-layout=b]) .rds-headline-00 {
+    font: 4rem/5rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 1584px) {
+  :where(body[data-rds-layout=b]) .rds-headline-00 {
+    font: 4.5rem/5.75rem "RepsolSoleDisplayRegular";
+  }
+}
 
 .rds-headline-01 {
   font: 2rem/2.5rem "RepsolSoleDisplayRegular";
 }
 @media (min-width: 720px) {
   .rds-headline-01 {
-    font: 2.5rem/3rem "RepsolSoleDisplayRegular";
+    font: 2rem/2.5rem "RepsolSoleDisplayRegular";
   }
 }
 @media (min-width: 1280px) {
@@ -3361,13 +3381,33 @@ html {
     font: 3.5rem/4.25rem "RepsolSoleDisplayRegular";
   }
 }
+@media (min-width: 720px) {
+  :where(body[data-rds-layout=b]) .rds-headline-01 {
+    font: 2rem/2.5rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 800px) {
+  :where(body[data-rds-layout=b]) .rds-headline-01 {
+    font: 2rem/2.5rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 1024px) {
+  :where(body[data-rds-layout=b]) .rds-headline-01 {
+    font: 3rem/3.75rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 1584px) {
+  :where(body[data-rds-layout=b]) .rds-headline-01 {
+    font: 3.5rem/4.25rem "RepsolSoleDisplayRegular";
+  }
+}
 
 .rds-headline-02 {
   font: 1.75rem/2.25rem "RepsolSoleDisplayRegular";
 }
 @media (min-width: 720px) {
   .rds-headline-02 {
-    font: 2rem/2.5rem "RepsolSoleDisplayRegular";
+    font: 1.75rem/2.25rem "RepsolSoleDisplayRegular";
   }
 }
 @media (min-width: 1280px) {
@@ -3380,13 +3420,33 @@ html {
     font: 2.75rem/3.5rem "RepsolSoleDisplayRegular";
   }
 }
+@media (min-width: 720px) {
+  :where(body[data-rds-layout=b]) .rds-headline-02 {
+    font: 1.75rem/2.25rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 800px) {
+  :where(body[data-rds-layout=b]) .rds-headline-02 {
+    font: 1.75rem/2.25rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 1024px) {
+  :where(body[data-rds-layout=b]) .rds-headline-02 {
+    font: 2.25rem/3rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 1584px) {
+  :where(body[data-rds-layout=b]) .rds-headline-02 {
+    font: 2.75rem/3.5rem "RepsolSoleDisplayRegular";
+  }
+}
 
 .rds-headline-03 {
   font: 1.375rem/1.875rem "RepsolSoleDisplayRegular";
 }
 @media (min-width: 720px) {
   .rds-headline-03 {
-    font: 1.5rem/2rem "RepsolSoleDisplayRegular";
+    font: 1.375rem/1.875rem "RepsolSoleDisplayRegular";
   }
 }
 @media (min-width: 1280px) {
@@ -3399,6 +3459,26 @@ html {
     font: 2rem/2.5rem "RepsolSoleDisplayRegular";
   }
 }
+@media (min-width: 720px) {
+  :where(body[data-rds-layout=b]) .rds-headline-03 {
+    font: 1.375rem/1.875rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 800px) {
+  :where(body[data-rds-layout=b]) .rds-headline-03 {
+    font: 1.375rem/1.875rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 1024px) {
+  :where(body[data-rds-layout=b]) .rds-headline-03 {
+    font: 1.75rem/2.25rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 1584px) {
+  :where(body[data-rds-layout=b]) .rds-headline-03 {
+    font: 2rem/2.5rem "RepsolSoleDisplayRegular";
+  }
+}
 
 .rds-headline-04 {
   font: 1.125rem/1.625rem "RepsolSoleDisplayRegular";
@@ -3418,6 +3498,26 @@ html {
     font: 1.5rem/2rem "RepsolSoleDisplayRegular";
   }
 }
+@media (min-width: 720px) {
+  :where(body[data-rds-layout=b]) .rds-headline-04 {
+    font: 1.125rem/1.625rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 800px) {
+  :where(body[data-rds-layout=b]) .rds-headline-04 {
+    font: 1.125rem/1.625rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 1024px) {
+  :where(body[data-rds-layout=b]) .rds-headline-04 {
+    font: 1.25rem/1.75rem "RepsolSoleDisplayRegular";
+  }
+}
+@media (min-width: 1584px) {
+  :where(body[data-rds-layout=b]) .rds-headline-04 {
+    font: 1.5rem/2rem "RepsolSoleDisplayRegular";
+  }
+}
 
 .rds-numbers-00 {
   font: 3.5rem/4.25rem "RepsolSoleDisplayRegular";
@@ -3441,6 +3541,30 @@ html {
     font-variant: tabular-nums;
   }
 }
+@media (min-width: 720px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-00 {
+    font: 3.5rem/4.25rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 800px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-00 {
+    font: 3.5rem/4.25rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 1024px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-00 {
+    font: 7rem/8.5rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 1584px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-00 {
+    font: 7rem/8.5rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
 
 .rds-numbers-01 {
   font: 2.25rem/2.75rem "RepsolSoleDisplayRegular";
@@ -3464,6 +3588,30 @@ html {
     font-variant: tabular-nums;
   }
 }
+@media (min-width: 720px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-01 {
+    font: 2.25rem/2.75rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 800px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-01 {
+    font: 2.25rem/2.75rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 1024px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-01 {
+    font: 3rem/3.75rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 1584px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-01 {
+    font: 3rem/3.75rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
 
 .rds-numbers-02 {
   font: 1.75rem/2.25rem "RepsolSoleDisplayRegular";
@@ -3487,6 +3635,30 @@ html {
     font-variant: tabular-nums;
   }
 }
+@media (min-width: 720px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-02 {
+    font: 1.75rem/2.25rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 800px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-02 {
+    font: 1.75rem/2.25rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 1024px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-02 {
+    font: 2.5rem/3rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 1584px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-02 {
+    font: 2.5rem/3rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
 
 .rds-numbers-03 {
   font: 1.5rem/2rem "RepsolSoleDisplayRegular";
@@ -3510,6 +3682,30 @@ html {
     font-variant: tabular-nums;
   }
 }
+@media (min-width: 720px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-03 {
+    font: 1.5rem/2rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 800px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-03 {
+    font: 1.5rem/2rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 1024px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-03 {
+    font: 1.75rem/2.25rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
+@media (min-width: 1584px) {
+  :where(body[data-rds-layout=b]) .rds-numbers-03 {
+    font: 1.75rem/2.25rem "RepsolSoleDisplayRegular";
+    font-variant: tabular-nums;
+  }
+}
 
 .rds-monospaced-body-01 {
   font: 1rem/1.5rem "SourceCodeProRegular";
@@ -4853,6 +5049,32 @@ html {
   }
 }
 
+.rds-layout-editorial {
+  padding: 0 16px;
+}
+@media (min-width: 800px) {
+  .rds-layout-editorial {
+    padding: 0 24px;
+  }
+}
+@media (min-width: 1024px) {
+  .rds-layout-editorial {
+    padding: 0 32px;
+  }
+}
+@media (min-width: 1250px) {
+  .rds-layout-editorial {
+    padding: 0 72px;
+  }
+}
+@media (min-width: 1584px) {
+  .rds-layout-editorial {
+    margin: 0 auto;
+    max-width: 1584px;
+    padding: 0 72px;
+  }
+}
+
 .rds-grid {
   display: grid;
   margin-left: auto;
@@ -4878,6 +5100,31 @@ html {
   }
 }
 
+.rds-grid-editorial {
+  display: grid;
+  margin-left: auto;
+  margin-right: auto;
+  width: 100%;
+}
+@media (max-width: 799px) {
+  .rds-grid-editorial {
+    gap: 16px;
+    grid-template-columns: repeat(4, 1fr);
+  }
+}
+@media (min-width: 800px) {
+  .rds-grid-editorial {
+    gap: 24px;
+    grid-template-columns: repeat(8, 1fr);
+  }
+}
+@media (min-width: 1024px) {
+  .rds-grid-editorial {
+    gap: 24px;
+    grid-template-columns: repeat(12, 1fr);
+  }
+}
+
 @media (max-width: 719px) {
   .rds-col-sd-1 {
     grid-column: span 1;

package/dist/mixins/_layout.scss

@@ -13,7 +13,7 @@
 
   // If the key exists in the map
   @if $value {
-    @if $breakpoint == mobile {
+    @if $breakpoint == mobile or $breakpoint == mobile-v2 {
       @media (max-width: $value) {
         @content;
       }

package/dist/mixins/_typography.scss

@@ -34,7 +34,7 @@
   }
 }
 
-// Include font styles. Three versions: ld, sd or fluid
+// Include font styles. Mobile, Desktop or responsive.
 // use:
 //  .element {
 //    @include rds-font-style(rds-typography-headline-1);
@@ -70,10 +70,8 @@
 
 @mixin rds-font-style($name) {
   @if map.has-key($rds-types-fluid, $name) {
-  
     @include rds-font-style-sd($name);
 
-
     @include breakpoint(tablet) {
       @include rds-font-style-md($name);
     }
@@ -85,7 +83,24 @@
     @include breakpoint(ultrawide) {
       @include rds-font-style-xd($name);
     }
-    
+
+    :where(body[data-rds-layout='b']) & {
+      @include breakpoint(tablet) {
+        @include rds-font-style-sd($name);
+      }
+
+      @include breakpoint(tablet-v2) {
+        @include rds-font-style-md($name);
+      }
+
+      @include breakpoint(desktop-v2) {
+        @include rds-font-style-ld($name);
+      }
+
+      @include breakpoint(ultrawide-v2) {
+        @include rds-font-style-xd($name);
+      }
+    }
   } @else {
     @include rds-font-style-sd($name);
   }