:root { --7bw-main: hsl(210.61, 59.04%, 51.18%); --7bw-main-l-1: hsl(211, 59%, 67%); --7bw-main-l-2: hsl(211, 59%, 84%); --7bw-main-d-1: hsl(211, 56%, 34%); --7bw-main-d-2: hsl(211, 56%, 17%); --7bw-sec: hsl(46, 97%, 62%); --bgr-blue: hsl(207.69, 52%, 95.1%); --bgr: hsla(0, 0%, 99.22%, 1); --dark-bg: hsla(0, 0%, 10.98%, 1); --action: hsl(16 90% 57%); --alert: hsl(8 79% 54%); --success: hsla(94, 45%, 49%, 1); --surface: hsl(210.61, 59.04%, 51.18%); --surface-l-1: hsl(211, 59%, 61%); --surface-l-2: hsl(211, 59%, 71%); --surface-l-3: hsl(211, 59%, 80%); --surface-l-4: hsl(211, 59%, 90%); --surface-d-1: hsl(211, 56%, 41%); --surface-d-2: hsl(211, 56%, 31%); --surface-d-3: hsl(211, 56%, 20%); --surface-d-4: hsl(211, 56%, 10%); --bgr-but-hov: hsl(210.51, 93.65%, 12.35%); --text: hsl(210, 27%, 15%); --text-white: hsl(0, 0%, 92%); --text-blue-dark: hsl(210.51, 93.65%, 12.35%); --shadow: hsla(0, 0%, 0%, 0.15); --bgr-but: hsl(210.61, 59.04%, 51.18%); --but-txt-white: hsl(0, 0%, 92%); --but-text-black: hsl(0 0% 13%); --bgr-head-stick: hsla(0, 0%, 11%, 0.75); --img-bgr-lblue: hsl(207.69, 52%, 95.1%); --head-m: clamp(1rem, calc(0.003703703703703704 * (100vw - 22.5rem) + 1rem), 1.25rem); --head-l: clamp(1.33rem, calc(0.005037037037037035 * (100vw - 22.5rem) + 1.33rem), 1.67rem); --head-xl: clamp(1.78rem, calc(0.006518518518518521 * (100vw - 22.5rem) + 1.78rem), 2.22rem); --head-2xl: clamp(2.37rem, calc(0.008740740740740738 * (100vw - 22.5rem) + 2.37rem), 2.96rem); --head-3xl: clamp(3.1rem, calc(0.011703703703703704 * (100vw - 22.5rem) + 3.1rem), 3.95rem); --head-4xl: clamp(4.21rem, calc(0.015555555555555553 * (100vw - 22.5rem) + 4.21rem), 5.26rem); --text-xs: clamp(0.65rem, calc(0.0005925925925925915 * (100vw - 22.5rem) + 0.65rem), 0.69rem); --text-s: clamp(0.78rem, calc(0.0007407407407407397 * (100vw - 22.5rem) + 0.78rem), 0.83rem); --text-m: clamp(0.94rem, calc(0.0008888888888888897 * (100vw - 22.5rem) + 0.94rem), 1rem); --text-l: clamp(1.13rem, calc(0.001037037037037038 * (100vw - 22.5rem) + 1.13rem), 1.2rem); --text-xl: clamp(1.35rem, calc(0.0013333333333333311 * (100vw - 22.5rem) + 1.35rem), 1.44rem); --text-2xl: clamp(1.62rem, calc(0.0016296296296296278 * (100vw - 22.5rem) + 1.62rem), 1.73rem); --text-3xl: clamp(1.94rem, calc(0.0019259259259259242 * (100vw - 22.5rem) + 1.94rem), 2.07rem); --text-4xl: clamp(2.33rem, calc(0.0023703703703703725 * (100vw - 22.5rem) + 2.33rem), 2.49rem); --space-2xs: clamp(0.42rem, calc(0.0016296296296296302 * (100vw - 22.5rem) + 0.42rem), 0.53rem); --space-xs: clamp(0.56rem, calc(0.002074074074074073 * (100vw - 22.5rem) + 0.56rem), 0.7rem); --space-s: clamp(0.75rem, calc(0.002814814814814814 * (100vw - 22.5rem) + 0.75rem), 0.94rem); --space-m: clamp(1rem, calc(0.003703703703703704 * (100vw - 22.5rem) + 1rem), 1.25rem); --space-l: clamp(1.33rem, calc(0.005037037037037035 * (100vw - 22.5rem) + 1.33rem), 1.67rem); --space-xl: clamp(1.78rem, calc(0.006518518518518521 * (100vw - 22.5rem) + 1.78rem), 2.22rem); --space-2xl: clamp(2.37rem, calc(0.008740740740740738 * (100vw - 22.5rem) + 2.37rem), 2.96rem); --space-3xl: clamp(3.16rem, calc(0.011703703703703704 * (100vw - 22.5rem) + 3.16rem), 3.95rem); --space-4xl: clamp(4.21rem, calc(0.015555555555555553 * (100vw - 22.5rem) + 4.21rem), 5.26rem); --space-5xl: clamp(5.61rem, calc(0.020740740740740733 * (100vw - 22.5rem) + 5.61rem), 7.01rem); --space-6xl: clamp(7.48rem, calc(0.027703703703703692 * (100vw - 22.5rem) + 7.48rem), 9.35rem); --gap-2xs: clamp(0.19rem, calc(0 * (100vw - 22.5rem) + 0.19rem), 0.19rem); --gap-xs: clamp(0.25rem, calc(0 * (100vw - 22.5rem) + 0.25rem), 0.25rem); --gap-s: clamp(0.5rem, calc(0 * (100vw - 22.5rem) + 0.5rem), 0.5rem); --gap-m: clamp(0.75rem, calc(0 * (100vw - 22.5rem) + 0.75rem), 0.75rem); --gap-l: clamp(1rem, calc(0 * (100vw - 22.5rem) + 1rem), 1rem); --gap-xl: clamp(1.5rem, calc(0 * (100vw - 22.5rem) + 1.5rem), 1.5rem); --gap-2xl: clamp(2rem, calc(0 * (100vw - 22.5rem) + 2rem), 2rem); --gap-3xl: clamp(2.5rem, calc(0 * (100vw - 22.5rem) + 2.5rem), 2.5rem);}.bg-bgr-blue { background-color: var(--bgr-blue); }.bg-bgr { background-color: var(--bgr); }.bg-surface { background-color: var(--surface); }.bg-surface-l-1 { background-color: var(--surface-l-1); }.bg-surface-l-2 { background-color: var(--surface-l-2); }.bg-surface-l-3 { background-color: var(--surface-l-3); }.bg-surface-l-4 { background-color: var(--surface-l-4); }.bg-surface-d-1 { background-color: var(--surface-d-1); }.bg-surface-d-2 { background-color: var(--surface-d-2); }.bg-surface-d-3 { background-color: var(--surface-d-3); }.bg-surface-d-4 { background-color: var(--surface-d-4); }.bg-bgr-but { background-color: var(--bgr-but); }.bg-bgr-head-stick { background-color: var(--bgr-head-stick); }