/*! tailwindcss v3.4.3 | MIT License | https://tailwindcss.com*/
*,
:after,
:before {
    box-sizing: border-box;
    border: 0 solid #e5e7eb
}

:after,
:before {
    --tw-content: ""
}

:host,
html {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    font-family: ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
    font-feature-settings: normal;
    font-variation-settings: normal;
    -webkit-tap-highlight-color: transparent
}

body {
    margin: 0;
    line-height: inherit
}

hr {
    height: 0;
    color: inherit;
    border-top-width: 1px
}

abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: inherit;
    font-weight: inherit
}

a {
    color: inherit;
    text-decoration: inherit
}

b,
strong {
    font-weight: bolder
}

code,
kbd,
pre,
samp {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
    font-feature-settings: normal;
    font-variation-settings: normal;
    font-size: 1em
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: initial
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    font-size: 100%;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    color: inherit;
    margin: 0;
    padding: 0
}

button,
select {
    text-transform: none
}

button,
input:where([type=button]),
input:where([type=reset]),
input:where([type=submit]) {
    -webkit-appearance: button;
    background-color: initial;
    background-image: none
}

:-moz-focusring {
    outline: auto
}

:-moz-ui-invalid {
    box-shadow: none
}

progress {
    vertical-align: initial
}

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

summary {
    display: list-item
}

blockquote,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
pre {
    margin: 0
}

fieldset {
    margin: 0
}

fieldset,
legend {
    padding: 0
}

menu,
ol,
ul {
    list-style: none;
    margin: 0;
    padding: 0
}

dialog {
    padding: 0
}

textarea {
    resize: vertical
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    opacity: 1;
    color: #9ca3af
}

input::placeholder,
textarea::placeholder {
    opacity: 1;
    color: #9ca3af
}

[role=button],
button {
    cursor: pointer
}

:disabled {
    cursor: default
}

audio,
canvas,
embed,
iframe,
img,
object,
svg,
video {
    display: block;
    vertical-align: middle
}

img,
video {
    max-width: 100%;
    height: auto
}

[hidden] {
    display: none
}

ol,
ul {
    list-style: initial;
    list-style-type: disc;
    margin-left: 1.4rem
}

ol {
    list-style-type: decimal
}

:root,
[data-theme=default] {
    --color-primary-darker: 214 52% 27%;
    --color-primary-dark: 214 52% 37%;
    --color-primary: 214 52% 47%;
    --color-primary-light: 214 52% 57%;
    --color-primary-lighter: 214 52% 67%;
    --color-accent-darker: 247 49% 31%;
    --color-accent-dark: 247 49% 41%;
    --color-accent: 247 49% 51%;
    --color-accent-light: 247 49% 61%;
    --color-accent-lighter: 247 49% 71%;
    --color-black: 240 8% 12%;
    --color-white: 0 0% 100%;
    --color-warning-darker: 46 100% 47%;
    --color-warning-dark: 46 100% 50%;
    --color-warning: 46 100% 61%;
    --color-warning-light: 46 100% 71%;
    --color-warning-lighter: 46 100% 80%;
    --color-success-darker: 94 48% 42%;
    --color-success-dark: 94 48% 48%;
    --color-success: 94 48% 56%;
    --color-success-light: 94 48% 65%;
    --color-success-lighter: 94 48% 74%;
    --color-error-darker: 349 75% 36%;
    --color-error-dark: 349 75% 44%;
    --color-error: 349 75% 51%;
    --color-error-light: 349 75% 59%;
    --color-error-lighter: 349 75% 67%;
    --color-floor-darker: 240 2% 90%;
    --color-floor-dark: 240 3% 94%;
    --color-floor: 0 0% 100%;
    --color-floor-light: 240 3% 100%;
    --color-floor-lighter: 240 2% 100%;
    --color-contrast-lower: 0 0% 95%;
    --color-contrast-low: 240 1% 83%;
    --color-contrast-medium: 240 1% 48%;
    --color-contrast-high: 240 4% 20%;
    --color-contrast-higher: 240 8% 12%
}

[data-theme=dark] {
    --color-primary-darker: 214 52% 27%;
    --color-primary-dark: 214 52% 37%;
    --color-primary: 214 52% 47%;
    --color-primary-light: 214 52% 57%;
    --color-primary-lighter: 214 52% 67%;
    --color-accent-darker: 342 92% 41%;
    --color-accent-dark: 342 92% 47%;
    --color-accent: 342 92% 54%;
    --color-accent-light: 342 92% 60%;
    --color-accent-lighter: 342 92% 65%;
    --color-black: 230 13% 9%;
    --color-white: 0 0% 100%;
    --color-warning-darker: 35 79% 48%;
    --color-warning-dark: 35 79% 56%;
    --color-warning: 35 79% 66%;
    --color-warning-light: 35 79% 74%;
    --color-warning-lighter: 35 79% 82%;
    --color-success-darker: 170 78% 26%;
    --color-success-dark: 170 78% 31%;
    --color-success: 170 78% 36%;
    --color-success-light: 170 78% 42%;
    --color-success-lighter: 170 78% 47%;
    --color-error-darker: 342 92% 41%;
    --color-error-dark: 342 92% 47%;
    --color-error: 342 92% 54%;
    --color-error-light: 342 92% 60%;
    --color-error-lighter: 342 92% 65%;
    --color-floor-darker: 0 0% 9%;
    --color-floor-dark: 0 0% 11%;
    --color-floor: 0 0% 9%;
    --color-floor-light: 0 0% 18%;
    --color-floor-lighter: 0 0% 21%;
    --color-contrast-lower: 240 6% 26%;
    --color-contrast-low: 240 3% 41%;
    --color-contrast-medium: 231 3% 57%;
    --color-contrast-high: 240 5% 82%;
    --color-contrast-higher: 240 100% 99%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

[data-theme],
body {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor)/var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-high)/var(--tw-text-opacity))
}

body {
    font-family: ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
    font-weight: 400
}

h1,
h2,
h3,
h4 {
    font-weight: 700
}

body {
    font-size: 2rem
}

@media (min-width:993px) {
    body {
        font-size: 2.25rem
    }
}

h1,
h2,
h3,
h4 {
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-higher)/var(--tw-text-opacity))
}

h1 {
    font-size: 2.875rem
}

@media (min-width:993px) {
    h1 {
        font-size: 4rem
    }
}

h2 {
    font-size: 2.5rem
}

@media (min-width:993px) {
    h2 {
        font-size: 3.25rem
    }
}

h3 {
    font-size: 2.25rem
}

@media (min-width:993px) {
    h3 {
        font-size: 2.875rem
    }
}

h4 {
    font-size: 2.125rem
}

@media (min-width:993px) {
    h4 {
        font-size: 2.5rem
    }
}

small {
    font-size: 1.875rem
}

@media (min-width:993px) {
    small {
        font-size: 2rem
    }
}

.link,
a {
    --tw-text-opacity: 1;
    color: hsl(var(--color-primary)/var(--tw-text-opacity));
    text-decoration-line: underline
}

strong {
    font-weight: 700
}

s {
    text-decoration-line: line-through
}

u {
    text-decoration-line: underline
}

mark {
    background-color: hsl(var(--color-accent)/.2);
    color: inherit
}

*,
::backdrop,
:after,
:before {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: #3b82f680;
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;
    --tw-contain-size: ;
    --tw-contain-layout: ;
    --tw-contain-paint: ;
    --tw-contain-style:
}

.\!container {
    width: 100% !important
}

.container {
    width: 100%
}

@media (min-width:320px) {
    .\!container {
        max-width: 320px !important
    }

    .container {
        max-width: 320px
    }
}

@media (min-width:481px) {
    .\!container {
        max-width: 481px !important
    }

    .container {
        max-width: 481px
    }
}

@media (min-width:769px) {
    .\!container {
        max-width: 769px !important
    }

    .container {
        max-width: 769px
    }
}

@media (min-width:993px) {
    .\!container {
        max-width: 993px !important
    }

    .container {
        max-width: 993px
    }
}

@media (min-width:1201px) {
    .\!container {
        max-width: 1201px !important
    }

    .container {
        max-width: 1201px
    }
}

.aspect-h-3 {
    --tw-aspect-h: 3
}

.aspect-w-4 {
    position: relative;
    padding-bottom: calc(var(--tw-aspect-h)/var(--tw-aspect-w)*100%);
    --tw-aspect-w: 4
}

.aspect-w-4>* {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.btn {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    font-size: 1em;
    border-radius: .25rem;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor-dark)/var(--tw-bg-opacity));
    padding: .375rem .75rem;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-higher)/var(--tw-text-opacity))
}

@media (min-width:993px) {
    .btn {
        padding: .5rem 1.25rem
    }
}

.btn {
    cursor: pointer;
    text-decoration: none;
    line-height: 1.2;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transition: all .2s ease;
    will-change: transform
}

.btn:focus-visible {
    box-shadow: 0 0 0 2px hsl(var(--color-floor)), 0 0 0 2px hsla(var(--color-contrast-higher)/.15);
    outline: none
}

.btn:active {
    transform: translateY(2px)
}

.btn--primary {
    background: hsl(var(--color-primary));
    color: hsl(var(--color-white));
    box-shadow: inset 0 1px 0 hsla(var(--color-white)/.15), 0 1px 3px hsla(var(--color-primary-darker)/.25), 0 2px 6px hsla(var(--color-primary-darker)/.1), 0 6px 10px -2px hsla(var(--color-primary-darker)/.25)
}

.btn--primary:hover {
    box-shadow: inset 0 1px 0 hsla(var(--color-white)/.15), 0 1px 2px hsla(var(--color-primary-darker)/.25), 0 1px 4px hsla(var(--color-primary-darker)/.1), 0 3px 6px -2px hsla(var(--color-primary-darker)/.25)
}

.btn--primary:focus-visible {
    box-shadow: inset 0 1px 0 hsla(var(--color-white)/.15), 0 1px 2px hsla(var(--color-primary-darker)/.25), 0 1px 4px hsla(var(--color-primary-darker)/.1), 0 3px 6px -2px hsla(var(--color-primary-darker)/.25), 0 0 0 2px hsl(var(--color-floor)), 0 0 0 4px hsl(var(--color-primary))
}

.btn--disabled,
.btn[disabled],
.btn[readonly] {
    opacity: .6;
    cursor: not-allowed
}

.form-control {
    font-size: 1em;
    border-radius: .25rem;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor-dark)/var(--tw-bg-opacity));
    padding: .375rem .5rem
}

@media (min-width:993px) {
    .form-control {
        padding: .5rem .75rem
    }
}

.form-control {
    line-height: 1.2;
    box-shadow: inset 0 0 0 1px hsl(var(--color-contrast-lower));
    transition: all .2s ease
}

.form-control::-moz-placeholder {
    opacity: 1;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-low)/var(--tw-text-opacity))
}

.form-control::placeholder {
    opacity: 1;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-low)/var(--tw-text-opacity))
}

.form-control:focus,
.form-control:focus-within {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor)/var(--tw-bg-opacity));
    box-shadow: inset 0 0 0 1px hsla(var(--color-contrast-lower)/0), 0 0 0 2px hsl(var(--color-primary)), 0 .3px .4px rgba(0, 0, 0, .025), 0 .9px 1.5px #0000000d, 0 3.5px 6px #0000001a;
    outline: none
}

.form-control--disabled,
.form-control[disabled],
.form-control[readonly] {
    opacity: .5;
    cursor: not-allowed
}

.form-control.form-control--error,
.form-control[aria-invalid=true] {
    box-shadow: inset 0 0 0 1px hsla(var(--color-contrast-lower)/0), 0 0 0 2px hsl(var(--color-error))
}

.form-control.form-control--error:focus,
.form-control.form-control--error:focus-within,
.form-control[aria-invalid=true]:focus,
.form-control[aria-invalid=true]:focus-within {
    box-shadow: inset 0 0 0 1px hsla(var(--color-contrast-lower)/0), 0 0 0 2px hsl(var(--color-error)), 0 .3px .4px rgba(0, 0, 0, .025), 0 .9px 1.5px #0000000d, 0 3.5px 6px #0000001a
}

.bg-c-overlay:after {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    height: 100%;
    width: 100%;
    content: var(--tw-content);
    background-color: hsl(var(--color-black)/.35)
}

.center-info {
    transform-origin: center;
    --tw-translate-y: 50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

@media (min-width:320px) {
    .center-info {
        top: 15%
    }
}

@media (min-width:769px) {
    .center-info {
        top: 25%
    }
}

.navbar-dark.affix {
    --tw-bg-opacity: 1;
    background-color: rgb(23 23 23/var(--tw-bg-opacity))
}

.navbar-dark.affix,
h1:is(.dark *),
h2:is(.dark *),
h3:is(.dark *),
h4:is(.dark *),
h5:is(.dark *),
h6:is(.dark *),
p:is(.dark *) {
    --tw-text-opacity: 1;
    color: rgb(229 231 235/var(--tw-text-opacity))
}

.text-component {
    --line-height-multiplier: 1;
    --text-space-y-multiplier: 1;
    --heading-line-height: 1.2;
    --body-line-height: 1.4
}

.text-component.leading-extra-tight {
    line-height: normal;
    --heading-line-height: 1;
    --body-line-height: 1.1
}

.text-component.leading-tight {
    --heading-line-height: 1.1;
    --body-line-height: 1.2;
    line-height: normal
}

.text-component.leading-snug {
    --heading-line-height: 1.15;
    --body-line-height: 1.4;
    line-height: normal
}

.text-component.leading-normal {
    --heading-line-height: 1.22;
    --body-line-height: 1.58;
    line-height: normal
}

.text-component.leading-relaxed {
    --heading-line-height: 1.3;
    --body-line-height: 1.72;
    line-height: normal
}

.text-component.text-space-y-xxs {
    --text-space-y-multiplier: 0.25
}

.text-component.text-space-y-xs {
    --text-space-y-multiplier: 0.5
}

.text-component.text-space-y-sm {
    --text-space-y-multiplier: 0.75
}

.text-component.text-space-y-md {
    --text-space-y-multiplier: 1.25
}

.text-component.text-space-y-lg {
    --text-space-y-multiplier: 1.5
}

.text-component.text-space-y-xl {
    --text-space-y-multiplier: 1.75
}

.text-component.text-space-y-xxl {
    --text-space-y-multiplier: 2
}

.text-component :where(h1),
.text-component :where(h2),
.text-component :where(h3),
.text-component :where(h4) {
    line-height: calc(var(--heading-line-height)*var(--line-height-multiplier, 1));
    margin-bottom: calc(.3125em*var(--text-space-y-multiplier, 1))
}

.text-component :where(h2),
.text-component :where(h3),
.text-component :where(h4) {
    margin-top: calc(.9375em*var(--text-space-y-multiplier, 1))
}

.text-component blockquote,
.text-component ol li,
.text-component p,
.text-component ul li {
    line-height: calc(var(--body-line-height)*var(--line-height-multiplier, 1))
}

.text-component blockquote,
.text-component ol,
.text-component p,
.text-component ul {
    margin-bottom: calc(.9375em*var(--text-space-y-multiplier, 1))
}

.text-component :where(ol),
.text-component :where(ul) {
    list-style-position: inside
}

.text-component ol ol,
.text-component ol ul,
.text-component ul ol,
.text-component ul ul {
    padding-left: 1em;
    margin-bottom: 0
}

.text-component :where(ul) {
    list-style-type: disc
}

.text-component :where(ol) {
    list-style-type: decimal
}

.text-component :where(img) {
    display: block;
    margin: 0 auto
}

.text-component :where(figcaption) {
    font-size: 1.875rem;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-low)/var(--tw-text-opacity))
}

@media (min-width:993px) {
    .text-component :where(figcaption) {
        font-size: 2rem
    }
}

.text-component :where(figcaption) {
    text-align: center;
    margin-top: .5em
}

.text-component :where(em) {
    font-style: italic
}

.text-component :where(hr) {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-contrast-lower)/var(--tw-bg-opacity));
    height: 1px;
    margin-top: calc(1.875em*var(--text-space-y-multiplier, 1));
    margin-bottom: calc(1.875em*var(--text-space-y-multiplier, 1));
    margin-left: auto;
    margin-right: auto;
    border: none
}

.text-component>:first-child {
    margin-top: 0
}

.text-component>:last-child {
    margin-bottom: 0
}

.text-component :where(blockquote) {
    padding-left: 1em;
    border-left-width: 4px;
    --tw-border-opacity: 1;
    border-color: hsl(var(--color-contrast-lower)/var(--tw-border-opacity));
    font-style: italic
}

.article {
    --body-line-height: 1.58;
    --text-space-y-multiplier: 1.2
}

.icon {
    --size: 1em;
    height: var(--size);
    width: var(--size);
    display: inline-block;
    color: inherit;
    fill: currentColor;
    line-height: 1;
    flex-shrink: 0;
    max-width: none
}

@keyframes icon-spin {
    0% {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(1turn)
    }
}

:where(.inner-glow, .inner-glow-top) {
    position: relative
}

.inner-glow-top:after,
.inner-glow:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    pointer-events: none
}

.inner-glow:after {
    box-shadow: inset 0 0 .5px 1px hsla(0, 0%, 100%, .075)
}

.anchor {
    display: block;
    position: relative;
    visibility: hidden;
    top: -80px
}

img {
    width: 100%;
    height: auto;
    aspect-ratio: attr(width) /attr(height)
}

html:root {
    --loop-tabs-fill-size: 1px;
    --loop-tabs-animation-duration: 0.5s
}

.loop-tabs {
    position: relative;
    z-index: 1
}

.loop-tabs__media {
    display: none
}

.loop-tabs__assets,
.loop-tabs__panels {
    position: relative
}

.loop-tabs__asset,
.loop-tabs__panel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--loop-tabs-animation-duration), visibility var(--loop-tabs-animation-duration), transform var(--loop-tabs-animation-duration)
}

.loop-tabs__asset {
    transform: scale(.9)
}

.loop-tabs__asset--selected,
.loop-tabs__panel--selected {
    position: relative;
    opacity: 1;
    z-index: 2;
    visibility: visible
}

.loop-tabs__asset--selected {
    transform: scale(1)
}

.loop-tabs__asset--exit {
    transform: scale(1.1)
}

.loop-tabs__control {
    display: block;
    position: relative;
    text-decoration: none;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-low)/var(--tw-text-opacity));
    --loop-tabs-filling: 0
}

.loop-tabs__control:after,
.loop-tabs__control:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: var(--loop-tabs-fill-size);
    width: 100%
}

.loop-tabs__control:before {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-contrast-lower)/var(--tw-bg-opacity))
}

.loop-tabs__control:after {
    transform: scaleX(0);
    transform-origin: left top
}

.loop-tabs__control:focus {
    outline: none
}

.loop-tabs--autoplay-off .loop-tabs__control:after,
.loop-tabs__control:focus:after {
    transform: scaleX(1)
}

.loop-tabs__control--selected {
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-high)/var(--tw-text-opacity))
}

.loop-tabs__control--selected:after {
    transform: scaleX(var(--loop-tabs-filling));
    background-color: currentColor
}

.loop-tabs__media {
    display: flex;
    justify-content: center
}

@media (min-width:64rem) {

    .loop-tabs__control:after,
    .loop-tabs__control:before {
        width: var(--loop-tabs-fill-size);
        height: 100%
    }

    .loop-tabs__control:after {
        transform: scaleY(0)
    }

    .loop-tabs__control--selected:after {
        transform: scaleY(var(--loop-tabs-filling))
    }

    .loop-tabs--autoplay-off .loop-tabs__control:after,
    .loop-tabs__control:focus:after {
        transform: scaleY(1)
    }
}

.story__img {
    display: block;
    transition: opacity .2s;
    overflow: hidden;
    margin-bottom: .5rem
}

.story__img:hover {
    opacity: .85
}

.story__img img {
    display: block;
    width: 100%
}

.story__category {
    display: inline-flex;
    align-items: center;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-higher)/var(--tw-text-opacity));
    line-height: 1;
    text-decoration: none;
    font-size: 1.875rem
}

@media (min-width:993px) {
    .story__category {
        font-size: 2rem
    }
}

.story__category {
    background-color: hsl(var(--color-primary)/.2);
    padding: .375rem;
    border-radius: .25rem;
    transition: background-color .2s
}

@media (min-width:64rem) {
    .story__category {
        padding: .5625rem
    }
}

.story__category:hover {
    text-decoration: underline;
    background-color: hsl(var(--color-primary)/.3)
}

.story__title a {
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-higher)/var(--tw-text-opacity));
    text-decoration: none
}

.story__title a:hover {
    text-decoration: underline
}

.story__author {
    --author-img-size: 50px;
    display: grid;
    grid-template-columns: var(--author-img-size) 1fr;
    align-items: center;
    gap: .5rem
}

@media (min-width:64rem) {
    .story__author {
        gap: .75rem
    }
}

.story__author img {
    display: block;
    width: var(--author-img-size);
    height: var(--author-img-size);
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 50%
}

.story__author-name {
    margin-bottom: .125rem
}

@media (min-width:64rem) {
    .story__author-name {
        margin-bottom: .1875rem
    }
}

.story__author-name a {
    text-decoration: none;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-higher)/var(--tw-text-opacity))
}

.story__author-name a:hover {
    text-decoration: underline
}

.story__meta {
    font-size: 1.875rem
}

@media (min-width:993px) {
    .story__meta {
        font-size: 2rem
    }
}

.story__meta {
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-medium)/var(--tw-text-opacity))
}

@media (min-width:64rem) {
    .story--featured {
        display: grid;
        grid-template-columns: 3fr 2fr;
        grid-gap: 2rem;
        align-items: center
    }

    .story--featured .story__img {
        margin: 0
    }
}

@media (min-width:993px) {
    .story--featured .story__title {
        font-size: 4rem
    }
}

.card-v2 {
    position: relative;
    overflow: hidden
}

.card-v2 img {
    display: block;
    width: 100%
}

.card-v2__caption {
    position: absolute;
    bottom: 0;
    width: 100%;
    background: linear-gradient(hsla(var(--color-black)/0), hsla(var(--color-black)/1));
    background-blend-mode: multiply;
    --tw-text-opacity: 1;
    color: hsl(var(--color-white)/var(--tw-text-opacity));
    text-shadow: 0 1px 1px #00000059;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.card-v2--blur-fx .card-v2__caption {
    background-color: hsl(var(--color-black)/.8);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}

a.card-v2 {
    display: block;
    text-decoration: none;
    transition: box-shadow .2s
}

a.card-v2:hover {
    --tw-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.pagination--split .pagination__list {
    width: 100%
}

.pagination--split .pagination__list>:first-child {
    margin-right: auto
}

.pagination--split .pagination__list>:last-child {
    margin-left: auto
}

.pagination__item {
    display: inline-block;
    display: inline-flex;
    height: 100%;
    align-items: center;
    padding: .5rem .6775rem;
    white-space: nowrap;
    line-height: 1;
    border-radius: .25rem;
    text-decoration: none;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-high)/var(--tw-text-opacity));
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    will-change: transform;
    transition: .2s
}

@media (min-width:64rem) {
    .pagination__item {
        padding: .75rem 1.016rem
    }
}

.pagination__item:hover:not(.pagination__item--selected):not(.pagination__item--ellipsis) {
    background-color: hsl(var(--color-contrast-higher)/.1)
}

.pagination__item:active {
    transform: translateY(2px)
}

.pagination__item--selected {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-contrast-higher)/var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: hsl(var(--color-floor)/var(--tw-text-opacity));
    --tw-shadow: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;
    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.pagination__item--disabled {
    opacity: .5;
    pointer-events: none
}

.pagination__jumper .form-control {
    width: 3em;
    margin-right: .5rem
}

@media (min-width:993px) {
    .pagination__jumper .form-control {
        margin-right: .75rem
    }
}

.pagination__jumper em {
    flex-shrink: 0;
    white-space: nowrap
}

:root {
    --reveal-fx-duration: 0.6s;
    --reveal-fx-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
}

.reveal-fx {
    opacity: 0;
    transition: opacity, transform var(--reveal-fx-timing-function);
    transition-duration: var(--reveal-fx-duration)
}

.reveal-fx:before {
    display: none;
    content: "reveal-fx"
}

.reveal-fx--translate,
.reveal-fx--translate-up {
    transform: translateY(50px)
}

.reveal-fx--translate-right {
    transform: translateX(-50px)
}

.reveal-fx--translate-left {
    transform: translateX(50px)
}

.reveal-fx--translate-down {
    transform: translateY(-50px)
}

.reveal-fx--scale {
    transform: scale(.8)
}

.reveal-fx--scale-up {
    transform: translateY(50px) scale(.8)
}

.reveal-fx--scale-right {
    transform: translateX(-50px) scale(.8)
}

.reveal-fx--scale-left {
    transform: translateX(50px) scale(.8)
}

.reveal-fx--scale-down {
    transform: translateY(-50px) scale(.8)
}

.reveal-fx--rotate,
.reveal-fx--rotate-down,
.reveal-fx--rotate-left,
.reveal-fx--rotate-right,
.reveal-fx--rotate-up {
    perspective: 1000px
}

.reveal-fx--rotate-down>*,
.reveal-fx--rotate-left>*,
.reveal-fx--rotate-right>*,
.reveal-fx--rotate-up>*,
.reveal-fx--rotate>* {
    transition: transform var(--reveal-fx-duration) var(--reveal-fx-timing-function);
    backface-visibility: hidden
}

.reveal-fx--rotate-down>*,
.reveal-fx--rotate>* {
    transform-origin: top;
    transform: rotateX(-45deg)
}

.reveal-fx--rotate-right>* {
    transform-origin: left center;
    transform: rotateY(45deg)
}

.reveal-fx--rotate-left>* {
    transform-origin: right center;
    transform: rotateY(-45deg)
}

.reveal-fx--rotate-up>* {
    transform-origin: bottom;
    transform: rotateX(45deg)
}

.reveal-fx--text-mask {
    overflow: hidden
}

.reveal-fx--text-mask>* {
    display: inline-block;
    transform: translateY(100%);
    transition: transform var(--reveal-fx-duration) var(--reveal-fx-timing-function);
    will-change: transform
}

[class*=reveal-fx--scale],
[class*=reveal-fx--translate] {
    will-change: opacity, transform
}

.reveal-fx--text-mask>*,
[class*=reveal-fx--rotate]>* {
    will-change: transform
}

.reveal-fx--clip-x>*,
.reveal-fx--clip-y>* {
    transition: opacity, -webkit-clip-path cubic-bezier(.215, .61, .355, 1);
    transition: opacity, clip-path cubic-bezier(.215, .61, .355, 1);
    transition: opacity, clip-path cubic-bezier(.215, .61, .355, 1), -webkit-clip-path cubic-bezier(.215, .61, .355, 1);
    transition-duration: var(--reveal-fx-duration)
}

.reveal-fx--clip-x>* {
    -webkit-clip-path: polygon(10% 0, 90% 0, 90% 100%, 10% 100%);
    clip-path: polygon(10% 0, 90% 0, 90% 100%, 10% 100%)
}

.reveal-fx--clip-y>* {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 100%, 0 100%);
    clip-path: polygon(0 50%, 100% 50%, 100% 100%, 0 100%)
}

.reveal-fx--is-visible {
    opacity: 1
}

.reveal-fx--is-visible.reveal-fx--text-mask>*,
.reveal-fx--is-visible[class*=reveal-fx--rotate]>*,
.reveal-fx--is-visible[class*=reveal-fx--scale],
.reveal-fx--is-visible[class*=reveal-fx--translate] {
    transform: translate(0)
}

.reveal-fx--is-visible.reveal-fx--clip-x>*,
.reveal-fx--is-visible.reveal-fx--clip-y>* {
    opacity: 1;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)
}

:root {
    --drop-cap-lines: 3
}

.drop-cap:first-letter {
    float: left;
    line-height: 1;
    font-size: calc(1.4em*var(--drop-cap-lines));
    padding: 0 .125em 0 0;
    text-transform: uppercase;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-higher)/var(--tw-text-opacity))
}

.text-component .drop-cap:first-letter {
    font-size: calc(1.4em*var(--drop-cap-lines)*var(--line-height-multiplier))
}

:root {
    --list-space-y: 0.375em;
    --list-offset: 1em;
    --list-line-height-multiplier: 1
}

.list,
.text-component .list {
    padding-left: 0;
    list-style: none
}

.list ol,
.list ul {
    list-style: none;
    margin: 0;
    margin-top: calc((var(--list-space-y)/2)*1.2);
    padding-top: calc((var(--list-space-y)/2)*1.2);
    padding-left: var(--list-offset)
}

.list li {
    padding-bottom: calc((var(--list-space-y)/2)*1.2);
    margin-bottom: calc((var(--list-space-y)/2)*1.2);
    line-height: calc(var(--list-line-height-multiplier)*1.4)
}

.list ol>li:last-child,
.list ul>li:last-child,
.list>li:last-child {
    margin-bottom: 0
}

.list ol>li:last-child,
.list ul>li:last-child,
.list:not(.list--border)>li:last-child,
.text-component .list:not(.list--border)>li:last-child {
    padding-bottom: 0
}

.list--ol,
.list--ul {
    --list-offset: calc(var(--list-bullet-size) + var(--list-bullet-margin-right))
}

.list--ol ol,
.list--ol ul,
.list--ul ol,
.list--ul ul {
    padding-left: 0
}

@supports (--css:variables) {

    .list--ol li,
    .list--ul li {
        padding-left: var(--list-offset) !important
    }
}

.list--ol li:before,
.list--ul li:before {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    vertical-align: middle;
    position: relative;
    top: -.1em
}

@supports (--css:variables) {

    .list--ol li:before,
    .list--ul li:before {
        width: var(--list-bullet-size) !important;
        height: var(--list-bullet-size) !important;
        margin-left: calc(var(--list-bullet-size)*-1) !important;
        left: calc(var(--list-bullet-margin-right)*-1) !important
    }
}

.list--ul {
    --list-bullet-size: 7px;
    --list-bullet-margin-right: 12px
}

.list--ul>li {
    padding-left: 19px
}

.list--ul>li:before {
    content: "";
    border-radius: 50%;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-lower)/var(--tw-text-opacity));
    background-color: currentColor;
    width: 7px;
    height: 7px;
    margin-left: -7px;
    left: -12px
}

.list--ul ul li:before {
    background-color: initial;
    box-shadow: inset 0 0 0 2px currentColor
}

.list--ol {
    --list-bullet-size: 26px;
    --list-bullet-margin-right: 6px;
    --list-bullet-font-size: 14px;
    counter-reset: list-items
}

.list--ol>li {
    counter-increment: list-items;
    padding-left: 32px
}

.list--ol ol {
    counter-reset: list-items
}

.list--ol>li:before {
    content: counter(list-items);
    font-size: var(--list-bullet-font-size, 14px);
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-contrast-lower)/var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-high)/var(--tw-text-opacity));
    line-height: 1;
    border-radius: 50%;
    width: 26px;
    height: 26px;
    margin-left: -26px;
    left: -6px
}

.list--ol ol>li:before {
    background-color: initial;
    box-shadow: inset 0 0 0 2px hsl(var(--color-contrast-lower))
}

.list--border li:not(:last-child) {
    border-bottom-width: 1px;
    --tw-border-opacity: 1;
    border-color: hsl(var(--color-contrast-lower)/var(--tw-border-opacity))
}

.list--border ol,
.list--border ul {
    border-top-width: 1px;
    --tw-border-opacity: 1;
    border-color: hsl(var(--color-contrast-lower)/var(--tw-border-opacity))
}

.list--icons {
    --list-bullet-size: 24px;
    --list-bullet-margin-right: 8px;
    --list-offset: calc(var(--list-bullet-size) + var(--list-bullet-margin-right))
}

.list--icons ol,
.list--icons ul {
    padding-left: 32px
}

@supports (--css:variables) {

    .list--icons ol,
    .list--icons ul {
        padding-left: var(--list-offset)
    }
}

.list__icon {
    position: relative;
    width: 24px;
    height: 24px;
    margin-right: 8px
}

.list__icon:not(.top-0) {
    top: calc(.7em - 12px)
}

@supports (--css:variables) {
    .list__icon {
        width: var(--list-bullet-size);
        height: var(--list-bullet-size);
        margin-right: var(--list-bullet-margin-right)
    }

    .list__icon:not(.top-0) {
        top: calc((1.4em*var(--list-line-height-multiplier) - var(--list-bullet-size))/2)
    }
}

.banner {
    display: block;
    text-decoration: none;
    color: inherit;
    overflow: hidden;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor-light)/var(--tw-bg-opacity));
    --tw-shadow: inset 0 0 0.5px 1px hsla(0, 0%, 100%, .075), 0 0.3px 0.4px rgba(0, 0, 0, .025), 0 0.9px 1.5px #0000000d, 0 3.5px 6px #0000001a;
    --tw-shadow-colored: inset 0 0 0.5px 1px var(--tw-shadow-color), 0 0.3px 0.4px var(--tw-shadow-color), 0 0.9px 1.5px var(--tw-shadow-color), 0 3.5px 6px var(--tw-shadow-color);
    border-radius: .25rem;
    transition: .3s
}

.banner,
.banner:hover {
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.banner:hover {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor-lighter)/var(--tw-bg-opacity));
    --tw-shadow: inset 0 0 0.5px 1px hsla(0, 0%, 100%, .075), 0 0.9px 1.5px #00000008, 0 3.1px 5.5px #00000014, 0 14px 25px #0000001f;
    --tw-shadow-colored: inset 0 0 0.5px 1px var(--tw-shadow-color), 0 0.9px 1.5px var(--tw-shadow-color), 0 3.1px 5.5px var(--tw-shadow-color), 0 14px 25px var(--tw-shadow-color)
}

.banner:hover .banner__link {
    transform: scale(1.3)
}

.banner:hover .banner__link i {
    transform: scale(.7)
}

.banner:hover .banner__link:after {
    height: 100%
}

.banner:hover .banner__figure {
    transform: scale(1.05)
}

.banner__link {
    text-decoration: none;
    --tw-text-opacity: 1;
    color: hsl(var(--color-primary-dark)/var(--tw-text-opacity));
    transform-origin: left bottom
}

.banner__link,
.banner__link i {
    position: relative;
    display: inline-block;
    transition: .3s cubic-bezier(.215, .61, .355, 1)
}

.banner__link i {
    z-index: 2
}

.banner__link:after {
    content: "";
    background-color: currentColor;
    height: 2px;
    width: 100%;
    position: absolute;
    z-index: 1;
    bottom: 0;
    left: 0;
    opacity: .15
}

.banner__figure,
.banner__link:after {
    transition: .3s cubic-bezier(.215, .61, .355, 1)
}

.banner__figure {
    height: 0;
    padding-bottom: 50%;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover
}

@media (min-width:64rem) {
    .banner__figure {
        height: 100%;
        padding-bottom: 0;
        -webkit-clip-path: polygon(100px 0, 100% 0, 100% 100%, 50px 100%);
        clip-path: polygon(100px 0, 100% 0, 100% 100%, 50px 100%)
    }

    .banner--invert .banner__figure {
        -webkit-clip-path: polygon(0 0, calc(100% - 100px) 0, calc(100% - 50px) 100%, 0 100%);
        clip-path: polygon(0 0, calc(100% - 100px) 0, calc(100% - 50px) 100%, 0 100%)
    }

    .banner--invert .banner__link {
        transform-origin: right bottom
    }

    .banner:hover .banner__figure {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%)
    }
}

.hero {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%
}

.hero--overlay-layer:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: hsl(var(--color-floor)/.65);
    z-index: 1
}

:root {
    --ske-animation-duration: 1s;
    --ske-radius: 0.25em
}

.ske {
    position: relative;
    background-color: hsl(var(--color-contrast-higher)/.1);
    overflow: hidden
}

.ske:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, hsla(var(--color-contrast-higher)/0), hsla(var(--color-contrast-higher)/.1), hsla(var(--color-contrast-higher)/0));
    background-repeat: no-repeat;
    background-size: 500px 100%;
    background-position: -500px 0;
    will-change: background-position;
    animation: ske-background var(--ske-animation-duration) infinite
}

@keyframes ske-background {
    0% {
        background-position: -500px 0
    }

    to {
        background-position: calc(100% + 500px) 0
    }
}

.ske--circle {
    height: 0;
    padding-bottom: 100%;
    border-radius: 50%;
    -webkit-clip-path: circle(50% at 50% 50%);
    clip-path: circle(50% at 50% 50%)
}

.ske--rect,
.ske--square,
[class*=ske--rect-] {
    border-radius: var(--ske-radius);
    -webkit-clip-path: inset(0 0 0 0 round var(--ske-radius));
    clip-path: inset(0 0 0 0 round var(--ske-radius))
}

.ske--square,
[class*=ske--rect-] {
    height: 0;
    padding-bottom: calc(100%/(var(--ske-aspect-ratio)))
}

.ske--rect-16\:9 {
    --ske-aspect-ratio: 16/9
}

.ske--rect-4\:3 {
    --ske-aspect-ratio: 4/3
}

.ske--rect-1\:1,
.ske--square {
    --ske-aspect-ratio: 1/1
}

.ske--text {
    height: 1em;
    border-radius: var(--ske-radius);
    -webkit-clip-path: inset(0 0 0 0 round var(--ske-radius));
    clip-path: inset(0 0 0 0 round var(--ske-radius))
}

.sharebar__btn {
    --size: 60px;
    width: var(--size);
    height: var(--size);
    display: flex;
    background-color: hsl(var(--color-contrast-higher)/.1);
    border-radius: 50%;
    transition: .2s
}

.sharebar__btn .icon {
    --size: 24px;
    display: block;
    margin: auto;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-high)/var(--tw-text-opacity));
    transition: color .2s
}

.sharebar__btn:hover {
    background-color: hsl(var(--color-contrast-higher)/.07);
    --tw-shadow: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;
    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.sharebar__btn:hover .icon {
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-higher)/var(--tw-text-opacity))
}

:root {
    --ticker-animation-duration: 10s;
    --ticker-gap-x: 1.25rem;
    --ticker-img-width: 280px
}

@media (min-width:48rem) {
    :root {
        --ticker-img-width: 400px
    }
}

@media (min-width:64rem) {
    :root {
        --ticker-img-width: 550px;
        --ticker-gap-x: 2rem
    }
}

.ticker {
    overflow: hidden
}

.ticker__list {
    display: flex;
    overflow: auto;
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden
}

.ticker--animate .ticker__list {
    animation: ticker-animation var(--ticker-animation-duration) infinite;
    animation-timing-function: linear
}

.ticker--paused .ticker__list,
.ticker[data-ticker-pause-hover=on] .ticker__list:hover {
    animation-play-state: paused
}

.ticker__item {
    flex-shrink: 0;
    margin-right: calc(var(--ticker-gap-x)/2);
    margin-left: calc(var(--ticker-gap-x)/2)
}

.ticker__img {
    display: block;
    width: var(--ticker-img-width)
}

.ticker-control {
    display: inline-flex;
    width: 40px;
    height: 40px;
    background-color: hsl(var(--color-contrast-higher)/.75);
    border-radius: 50%;
    transition: .2s
}

.ticker-control i {
    position: relative;
    display: block;
    width: 16px;
    height: 16px;
    margin: auto;
    --tw-text-opacity: 1;
    color: hsl(var(--color-floor)/var(--tw-text-opacity))
}

.ticker-control i:after,
.ticker-control i:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: currentColor;
    transition: -webkit-clip-path .2s cubic-bezier(.215, .61, .355, 1);
    transition: clip-path .2s cubic-bezier(.215, .61, .355, 1);
    transition: clip-path .2s cubic-bezier(.215, .61, .355, 1), -webkit-clip-path .2s cubic-bezier(.215, .61, .355, 1)
}

.ticker-control i:before {
    -webkit-clip-path: polygon(1px 1px, 5px 1px, 5px calc(100% - 1px), 1px calc(100% - 1px));
    clip-path: polygon(1px 1px, 5px 1px, 5px calc(100% - 1px), 1px calc(100% - 1px))
}

.ticker-control i:after {
    -webkit-clip-path: polygon(calc(100% - 5px) 1px, calc(100% - 1px) 1px, calc(100% - 1px) calc(100% - 1px), calc(100% - 5px) calc(100% - 1px));
    clip-path: polygon(calc(100% - 5px) 1px, calc(100% - 1px) 1px, calc(100% - 1px) calc(100% - 1px), calc(100% - 5px) calc(100% - 1px))
}

.ticker-control:hover {
    cursor: pointer;
    background-color: hsl(var(--color-contrast-higher)/.95)
}

.ticker-control[aria-pressed=true] i:before {
    -webkit-clip-path: polygon(2px 0, 100% 50%, 100% 50%, 2px 100%);
    clip-path: polygon(2px 0, 100% 50%, 100% 50%, 2px 100%)
}

.ticker-control[aria-pressed=true] i:after {
    -webkit-clip-path: polygon(calc(100% - 5px) calc(100% - 1px), calc(100% - 1px) calc(100% - 1px), calc(100% - 1px) calc(100% - 1px), calc(100% - 5px) calc(100% - 1px));
    clip-path: polygon(calc(100% - 5px) calc(100% - 1px), calc(100% - 1px) calc(100% - 1px), calc(100% - 1px) calc(100% - 1px), calc(100% - 5px) calc(100% - 1px))
}

.ticker:not(.ticker--anim-off) .ticker__list {
    overflow: visible
}

.ticker--reverse:not(.ticker--anim-off) .ticker__list {
    flex-direction: row-reverse
}

.ticker--reverse.ticker--animate:not(.ticker--anim-off) .ticker__list {
    transform: translateX(calc(100vw - 100%));
    animation-name: ticker-animation-reverse
}

@keyframes ticker-animation {
    0% {
        transform: translateX(0)
    }

    to {
        transform: translateX(-50%)
    }
}

@keyframes ticker-animation-reverse {
    0% {
        transform: translateX(calc(100vw - 100%))
    }

    to {
        transform: translateX(calc(100vw - 50%))
    }
}

:root {
    --popover-width: 275px;
    --popover-control-gap: 4px;
    --popover-viewport-gap: 20px;
    --popover-transition-duration: 0.2s
}

.popover-switcher {
    position: fixed;
    width: var(--popover-width);
    z-index: 5;
    margin-top: var(--popover-control-gap);
    margin-bottom: var(--popover-control-gap);
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s var(--popover-transition-duration), opacity var(--popover-transition-duration)
}

.popover--is-visible {
    visibility: visible;
    opacity: 1;
    transition: visibility 0s, opacity var(--popover-transition-duration)
}

:root {
    --dev-phone-radius: 14%;
    --dev-phone-img-ratio: 0.56;
    --dev-tablet-radius: 6%;
    --dev-tablet-img-ratio: 0.75;
    --dev-browser-radius: 1.5%;
    --dev-browser-img-ratio: 1.6;
    --dev-laptop-radius: 3%;
    --dev-laptop-img-ratio: 1.6;
    --dev-desktop-radius: 3%;
    --dev-desktop-img-ratio: 1.6
}

.dev-phone,
.dev-phone__body {
    position: relative;
    width: 100%
}

.dev-phone {
    z-index: 1
}

.dev-phone__body {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor)/var(--tw-bg-opacity));
    --phone-inner-shadow: inset 0 0 0.285em #00000026, inset 0 0 0.1em rgba(0, 0, 0, .035), inset 0 0 0.05em rgba(0, 0, 0, .005);
    box-shadow: var(--phone-inner-shadow);
    padding: 3%;
    z-index: 2;
    border-top-left-radius: var(--dev-phone-radius) calc(var(--dev-phone-radius)*var(--dev-phone-img-ratio));
    border-top-right-radius: var(--dev-phone-radius) calc(var(--dev-phone-radius)*var(--dev-phone-img-ratio));
    border-bottom-right-radius: var(--dev-phone-radius) calc(var(--dev-phone-radius)*var(--dev-phone-img-ratio));
    border-bottom-left-radius: var(--dev-phone-radius) calc(var(--dev-phone-radius)*var(--dev-phone-img-ratio))
}

.dev-phone--dark .dev-phone__body {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-black)/var(--tw-bg-opacity));
    border: 3px solid #f34747
}

.dev-phone__media {
    position: relative;
    overflow: hidden;
    border-top-left-radius: calc(var(--dev-phone-radius)*.85) calc(var(--dev-phone-radius)*.85*var(--dev-phone-img-ratio));
    border-top-right-radius: calc(var(--dev-phone-radius)*.85) calc(var(--dev-phone-radius)*.85*var(--dev-phone-img-ratio));
    border-bottom-left-radius: calc(var(--dev-phone-radius)*.85) calc(var(--dev-phone-radius)*.85*var(--dev-phone-img-ratio));
    border-bottom-right-radius: calc(var(--dev-phone-radius)*.85) calc(var(--dev-phone-radius)*.85*var(--dev-phone-img-ratio))
}

.dev-phone__media img,
.dev-phone__media svg,
.dev-phone__media video {
    display: block;
    width: 100%;
    height: auto
}

.dev-phone__media:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .075);
    border-radius: inherit;
    pointer-events: none
}

.dev-phone--dark .dev-phone__media:after {
    display: none
}

.dev-phone__notch {
    position: absolute;
    z-index: 2;
    top: 0;
    width: 50%;
    right: 25%;
    height: 4%;
    border-radius: 0 0 .85em .85em;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor)/var(--tw-bg-opacity));
    border: 1px solid #0000001a;
    border-top: 0 solid #0000001a
}

.dev-phone--dark .dev-phone__notch {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-black)/var(--tw-bg-opacity));
    border-width: 0
}

.dev-phone--landscape .dev-phone__body {
    padding: 1.75%;
    border-top-left-radius: calc(var(--dev-phone-radius)*var(--dev-phone-img-ratio)) var(--dev-phone-radius);
    border-top-right-radius: calc(var(--dev-phone-radius)*var(--dev-phone-img-ratio)) var(--dev-phone-radius);
    border-bottom-right-radius: calc(var(--dev-phone-radius)*var(--dev-phone-img-ratio)) var(--dev-phone-radius);
    border-bottom-left-radius: calc(var(--dev-phone-radius)*var(--dev-phone-img-ratio)) var(--dev-phone-radius)
}

.dev-phone--landscape .dev-phone__media {
    border-top-left-radius: calc(var(--dev-phone-radius)*.85*var(--dev-phone-img-ratio)) calc(var(--dev-phone-radius)*.85);
    border-top-right-radius: calc(var(--dev-phone-radius)*.85*var(--dev-phone-img-ratio)) calc(var(--dev-phone-radius)*.85);
    border-bottom-left-radius: calc(var(--dev-phone-radius)*.85*var(--dev-phone-img-ratio)) calc(var(--dev-phone-radius)*.85);
    border-bottom-right-radius: calc(var(--dev-phone-radius)*.85*var(--dev-phone-img-ratio)) calc(var(--dev-phone-radius)*.85)
}

.dev-phone--landscape .dev-phone__notch {
    right: 0;
    height: 56%;
    top: 22%;
    width: 4%;
    border-radius: .85em 0 0 .85em;
    border-right-width: 0;
    border-top-width: 1px
}

.dev-phone--front-light .dev-phone__body {
    box-shadow: var(--phone-inner-shadow), 0 1.2px 1.9px -1px rgba(0, 0, 0, .014), 0 3.3px 5.3px -1px rgba(0, 0, 0, .038), 0 8.5px 12.7px -1px rgba(0, 0, 0, .085), 0 30px 42px -1px #00000026
}

.dev-phone--top-light .dev-phone__shadow {
    position: absolute;
    background-color: #0000001a;
    z-index: 1;
    height: 1em;
    width: 100%;
    left: 0;
    bottom: -.5em;
    border-radius: 100%;
    filter: blur(5px)
}

.dev-phone--top-light .dev-phone__shadow:after,
.dev-phone--top-light .dev-phone__shadow:before {
    content: "";
    position: absolute;
    border-radius: inherit
}

.dev-phone--top-light .dev-phone__shadow:before {
    top: 20%;
    left: 10%;
    width: 80%;
    height: 40%;
    background-color: #0006
}

.dev-phone--top-light .dev-phone__shadow:after {
    top: 20%;
    left: 5%;
    width: 90%;
    height: 60%;
    background-color: #00000026
}

.dev-tablet,
.dev-tablet__body {
    position: relative;
    width: 100%
}

.dev-tablet {
    z-index: 1
}

.dev-tablet__body {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor)/var(--tw-bg-opacity));
    --tablet-inner-shadow: inset 0 0 0.285em #00000026, inset 0 0 0.1em rgba(0, 0, 0, .035), inset 0 0 0.05em rgba(0, 0, 0, .005);
    box-shadow: var(--tablet-inner-shadow);
    padding: 3%;
    z-index: 2;
    border-top-left-radius: var(--dev-tablet-radius) calc(var(--dev-tablet-radius)*var(--dev-tablet-img-ratio));
    border-top-right-radius: var(--dev-tablet-radius) calc(var(--dev-tablet-radius)*var(--dev-tablet-img-ratio));
    border-bottom-right-radius: var(--dev-tablet-radius) calc(var(--dev-tablet-radius)*var(--dev-tablet-img-ratio));
    border-bottom-left-radius: var(--dev-tablet-radius) calc(var(--dev-tablet-radius)*var(--dev-tablet-img-ratio))
}

.dev-tablet__media {
    position: relative;
    overflow: hidden;
    border-top-left-radius: calc(var(--dev-tablet-radius)*.75) calc(var(--dev-tablet-radius)*.75*var(--dev-tablet-img-ratio));
    border-top-right-radius: calc(var(--dev-tablet-radius)*.75) calc(var(--dev-tablet-radius)*.75*var(--dev-tablet-img-ratio));
    border-bottom-left-radius: calc(var(--dev-tablet-radius)*.75) calc(var(--dev-tablet-radius)*.75*var(--dev-tablet-img-ratio));
    border-bottom-right-radius: calc(var(--dev-tablet-radius)*.75) calc(var(--dev-tablet-radius)*.75*var(--dev-tablet-img-ratio))
}

.dev-tablet__media img,
.dev-tablet__media svg,
.dev-tablet__media video {
    display: block;
    width: 100%;
    height: auto
}

.dev-tablet__media:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .075);
    border-radius: inherit;
    pointer-events: none
}

.dev-tablet--landscape .dev-tablet__body {
    padding: 1.75%;
    border-top-left-radius: calc(var(--dev-tablet-radius)*var(--dev-tablet-img-ratio)) var(--dev-tablet-radius);
    border-top-right-radius: calc(var(--dev-tablet-radius)*var(--dev-tablet-img-ratio)) var(--dev-tablet-radius);
    border-bottom-right-radius: calc(var(--dev-tablet-radius)*var(--dev-tablet-img-ratio)) var(--dev-tablet-radius);
    border-bottom-left-radius: calc(var(--dev-tablet-radius)*var(--dev-tablet-img-ratio)) var(--dev-tablet-radius)
}

.dev-tablet--landscape .dev-tablet__media {
    border-top-left-radius: calc(var(--dev-tablet-radius)*.85*var(--dev-tablet-img-ratio)) calc(var(--dev-tablet-radius)*.85);
    border-top-right-radius: calc(var(--dev-tablet-radius)*.85*var(--dev-tablet-img-ratio)) calc(var(--dev-tablet-radius)*.85);
    border-bottom-left-radius: calc(var(--dev-tablet-radius)*.85*var(--dev-tablet-img-ratio)) calc(var(--dev-tablet-radius)*.85);
    border-bottom-right-radius: calc(var(--dev-tablet-radius)*.85*var(--dev-tablet-img-ratio)) calc(var(--dev-tablet-radius)*.85)
}

.dev-tablet--front-light .dev-tablet__body {
    box-shadow: var(--tablet-inner-shadow), 0 1.2px 1.9px -1px rgba(0, 0, 0, .014), 0 3.3px 5.3px -1px rgba(0, 0, 0, .038), 0 8.5px 12.7px -1px rgba(0, 0, 0, .085), 0 30px 42px -1px #00000026
}

.dev-tablet--top-light .dev-tablet__shadow {
    position: absolute;
    background-color: #0000001a;
    z-index: 1;
    height: 1em;
    width: 100%;
    left: 0;
    bottom: -.5em;
    border-radius: 100%;
    filter: blur(5px)
}

.dev-tablet--top-light .dev-tablet__shadow:after,
.dev-tablet--top-light .dev-tablet__shadow:before {
    content: "";
    position: absolute;
    border-radius: inherit
}

.dev-tablet--top-light .dev-tablet__shadow:before {
    top: 20%;
    left: 10%;
    width: 80%;
    height: 40%;
    background-color: #0006
}

.dev-tablet--top-light .dev-tablet__shadow:after {
    top: 20%;
    left: 5%;
    width: 90%;
    height: 60%;
    background-color: #00000026
}

.dev-browser,
.dev-browser__body {
    position: relative;
    width: 100%
}

.dev-browser {
    z-index: 1
}

.dev-browser__body {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor)/var(--tw-bg-opacity));
    padding: 2em 1.5% 1.5%;
    --browser-inner-shadow: inset 0 0 0.285em #00000026, inset 0 0 0.1em rgba(0, 0, 0, .035), inset 0 0 0.05em rgba(0, 0, 0, .005);
    box-shadow: var(--browser-inner-shadow);
    border-top-left-radius: var(--dev-browser-radius) calc(var(--dev-browser-radius)*var(--dev-browser-img-ratio));
    border-top-right-radius: var(--dev-browser-radius) calc(var(--dev-browser-radius)*var(--dev-browser-img-ratio));
    border-bottom-right-radius: var(--dev-browser-radius) calc(var(--dev-browser-radius)*var(--dev-browser-img-ratio));
    border-bottom-left-radius: var(--dev-browser-radius) calc(var(--dev-browser-radius)*var(--dev-browser-img-ratio));
    z-index: 2
}

.dev-browser__media {
    overflow: hidden;
    border-radius: .25rem
}

.dev-browser__media img,
.dev-browser__media svg,
.dev-browser__media video {
    display: block;
    width: 100%;
    height: auto
}

.dev-browser__dots {
    position: absolute;
    left: calc(1.5% + .4em);
    top: calc(1em - 6px);
    display: flex
}

.dev-browser__dots span {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: hsl(var(--color-contrast-higher)/.2);
    margin-right: .375rem
}

@media (min-width:993px) {
    .dev-browser__dots span {
        margin-right: .5rem
    }
}

.dev-browser--front-light .dev-browser__body {
    box-shadow: var(--browser-inner-shadow), 0 1.2px 1.9px -1px rgba(0, 0, 0, .014), 0 3.3px 5.3px -1px rgba(0, 0, 0, .038), 0 8.5px 12.7px -1px rgba(0, 0, 0, .085), 0 30px 42px -1px #00000026
}

.dev-browser--top-light .dev-browser__shadow {
    position: absolute;
    background-color: #0000001a;
    z-index: 1;
    height: 1em;
    width: 100%;
    left: 0;
    bottom: -.5em;
    border-radius: 100%;
    filter: blur(5px)
}

.dev-browser--top-light .dev-browser__shadow:after,
.dev-browser--top-light .dev-browser__shadow:before {
    content: "";
    position: absolute;
    border-radius: inherit
}

.dev-browser--top-light .dev-browser__shadow:before {
    top: 20%;
    left: 10%;
    width: 80%;
    height: 40%;
    background-color: #0006
}

.dev-browser--top-light .dev-browser__shadow:after {
    top: 20%;
    left: 5%;
    width: 90%;
    height: 60%;
    background-color: #0003
}

.dev-laptop {
    position: relative;
    z-index: 1;
    width: 100%
}

.dev-laptop__body {
    width: 85%;
    margin: 0 auto;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-black)/var(--tw-bg-opacity));
    border-width: 3px 3px 0;
    --tw-border-opacity: 1;
    border-color: hsl(var(--color-contrast-low)/var(--tw-border-opacity));
    padding: 3% 1.5% 1.5%;
    border-top-left-radius: var(--dev-laptop-radius) calc(var(--dev-laptop-radius)*var(--dev-laptop-img-ratio));
    border-top-right-radius: var(--dev-laptop-radius) calc(var(--dev-laptop-radius)*var(--dev-laptop-img-ratio));
    z-index: 2
}

.dev-laptop__media img,
.dev-laptop__media svg,
.dev-laptop__media video {
    display: block;
    width: 100%;
    height: auto
}

.dev-laptop__base {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 3%;
    background: linear-gradient(hsla(var(--color-contrast-low)/.8), hsl(var(--color-contrast-low)) 7% 55%, hsla(var(--color-contrast-medium)/1) 55%, hsla(var(--color-contrast-high)/.6));
    border-bottom-left-radius: 10% 50%;
    border-bottom-right-radius: 10% 50%;
    z-index: 2
}

.dev-laptop__base:after {
    content: "";
    position: absolute;
    top: 0;
    left: 40%;
    width: 20%;
    height: 35%;
    border-radius: 0 0 1em 1em;
    background-color: hsla(var(--color-contrast-medium)/1);
    box-shadow: inset 0 1px 3px #00000040
}

.dev-laptop__shadow {
    position: absolute;
    z-index: 1;
    height: 1em;
    width: 94%;
    left: 3%;
    bottom: -.5em;
    perspective: 400px
}

.dev-laptop__shadow:after,
.dev-laptop__shadow:before {
    content: "";
    position: absolute
}

.dev-laptop__shadow:before {
    top: 0;
    left: 1%;
    width: 98%;
    height: 100%;
    background-color: #00000040;
    transform: rotateX(70deg);
    filter: blur(5px)
}

.dev-laptop__shadow:after {
    top: calc(44% - 1px);
    left: 4%;
    width: 92%;
    height: 12%;
    border-radius: 100%;
    background-color: #000c;
    filter: blur(1px)
}

.dev-desktop {
    position: relative;
    z-index: 1;
    width: 100%
}

.dev-desktop__body {
    position: relative;
    z-index: 2;
    width: 100%;
    margin: 0 auto;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-black)/var(--tw-bg-opacity));
    border-width: 3px;
    --tw-border-opacity: 1;
    border-color: hsl(var(--color-contrast-low)/var(--tw-border-opacity));
    padding: 4%;
    border-top-left-radius: var(--dev-desktop-radius) calc(var(--dev-desktop-radius)*var(--dev-desktop-img-ratio));
    border-top-right-radius: var(--dev-desktop-radius) calc(var(--dev-desktop-radius)*var(--dev-desktop-img-ratio));
    border-bottom-right-radius: var(--dev-desktop-radius) calc(var(--dev-desktop-radius)*var(--dev-desktop-img-ratio));
    border-bottom-left-radius: var(--dev-desktop-radius) calc(var(--dev-desktop-radius)*var(--dev-desktop-img-ratio))
}

.dev-desktop__media img,
.dev-desktop__media svg,
.dev-desktop__media video {
    display: block;
    width: 100%;
    height: auto
}

.dev-desktop__base {
    position: relative;
    z-index: 1;
    width: 33%;
    margin: 0 auto;
    height: 0;
    padding-bottom: 15%;
    perspective: 180px
}

.dev-desktop__base-top {
    position: absolute;
    z-index: 3;
    top: -1px;
    left: 15%;
    width: 70%;
    height: 80%;
    -webkit-clip-path: polygon(3% 0, 97% 0, 100% 100%, 0 100%);
    clip-path: polygon(3% 0, 97% 0, 100% 100%, 0 100%);
    background: linear-gradient(hsla(var(--color-contrast-medium)/1), hsl(var(--color-contrast-low)))
}

.dev-desktop__base-bottom {
    z-index: 2;
    left: 15%;
    width: 70%;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-contrast-low)/var(--tw-bg-opacity));
    box-shadow: inset 0 -2px 0 #ffffff40
}

.dev-desktop__base-bottom,
.dev-desktop__shadow {
    position: absolute;
    top: calc(80% - 2px);
    height: 50%;
    border-radius: 0 0 .25em .25em;
    transform-origin: center top;
    transform: rotateX(80deg)
}

.dev-desktop__shadow {
    z-index: 1;
    left: 17%;
    width: 66%;
    box-shadow: 0 2px 2px #0006, 0 4px 4px #00000026
}

.bg-decoration {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.bg-decoration__svg {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 134%;
    min-width: 1280px;
    max-width: 1920px;
    height: auto
}

.bg-decoration-v2 {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.bg-decoration-v2__svg {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 134%;
    min-width: 1280px;
    max-width: 1920px;
    height: auto
}

:root {
    --drawer-width: 400px
}

.drawer {
    position: fixed;
    z-index: 15;
    height: 100%;
    width: 100%;
    max-width: var(--drawer-width);
    top: 0;
    right: 0;
    visibility: hidden;
    transition: visibility 0s .3s
}

.drawer:focus {
    outline: none
}

.drawer--is-visible {
    visibility: visible;
    transition: none
}

.drawer--open-left {
    right: auto;
    left: 0
}

.drawer__content {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    transform: translateX(100%);
    transition: transform .3s;
    transition-timing-function: cubic-bezier(.645, .045, .355, 1)
}

.drawer--open-left .drawer__content {
    transform: translateX(-100%)
}

.drawer--is-visible .drawer__content {
    transform: translateX(0)
}

.drawer__body {
    height: 100%;
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch
}

.drawer__close-btn {
    --size: 32px;
    width: var(--size);
    height: var(--size);
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background-color: hsl(var(--color-floor-light)/.95);
    --tw-shadow: inset 0 0 0.5px 1px hsla(0, 0%, 100%, .075), 0 0.3px 0.4px rgba(0, 0, 0, .025), 0 0.9px 1.5px #0000000d, 0 3.5px 6px #0000001a;
    --tw-shadow-colored: inset 0 0 0.5px 1px var(--tw-shadow-color), 0 0.3px 0.4px var(--tw-shadow-color), 0 0.9px 1.5px var(--tw-shadow-color), 0 3.5px 6px var(--tw-shadow-color);
    transition: .2s
}

.drawer__close-btn,
.drawer__close-btn:hover {
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.drawer__close-btn:hover {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor-lighter)/var(--tw-bg-opacity));
    --tw-shadow: inset 0 0 0.5px 1px hsla(0, 0%, 100%, .075), 0 0.9px 1.5px #00000008, 0 3.1px 5.5px #00000014, 0 14px 25px #0000001f;
    --tw-shadow-colored: inset 0 0 0.5px 1px var(--tw-shadow-color), 0 0.9px 1.5px var(--tw-shadow-color), 0 3.1px 5.5px var(--tw-shadow-color), 0 14px 25px var(--tw-shadow-color)
}

.drawer__close-btn .icon {
    display: block;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-high)/var(--tw-text-opacity))
}

.drawer--modal {
    max-width: none;
    background-color: hsl(var(--color-black)/0);
    transition: background-color .3s, visibility 0s .3s
}

.drawer--modal.drawer--is-visible {
    background-color: hsl(var(--color-black)/.75);
    transition: background-color .3s
}

.drawer--modal.drawer--open-left .drawer__content {
    right: auto;
    left: 0
}

.drawer--modal .drawer__content {
    max-width: var(--drawer-width)
}

.text-bg-fx {
    background-repeat: no-repeat;
    will-change: background-size;
    transition: background-size .3s cubic-bezier(.645, .045, .355, 1)
}

.text-bg-fx:hover {
    background-size: 100% 100%
}

.text-bg-fx--scale-x {
    padding: .125rem 0
}

@media (min-width:993px) {
    .text-bg-fx--scale-x {
        padding-top: .25rem;
        padding-bottom: .25rem
    }
}

.text-bg-fx--scale-x {
    background-size: 0 100%
}

.text-bg-fx--scale-x,
.text-bg-fx--scale-y {
    background-image: linear-gradient(hsla(var(--color-primary)/.2), hsla(var(--color-primary)/.2))
}

.text-bg-fx--scale-y {
    text-decoration: none;
    background-size: 100% 2px;
    background-position: bottom
}

.text-bg-fx--underline,
.text-bg-fx--underline-bold {
    text-decoration: none;
    background-size: 0 100%
}

.text-bg-fx--underline {
    background-image: linear-gradient(#0000 calc(100% - 3px), currentColor calc(100% - 3px), currentColor calc(100% - 2px), #0000 2px)
}

.text-bg-fx--underline-bold {
    background-image: linear-gradient(#0000 50%, hsla(var(--color-primary)/.2) 50%)
}

.text-bg-fx--text-shadow {
    text-shadow: 1.5px 1px hsl(var(--color-floor)), -1.5px 1px hsl(var(--color-floor)), 0 1px hsl(var(--color-floor))
}

.btn-fx-1 {
    --border-radius: 0.25em;
    --transition-duration: .3s;
    position: relative;
    display: inline-block;
    border-radius: var(--border-radius);
    line-height: 1;
    text-decoration: none;
    --tw-text-opacity: 1;
    color: hsl(var(--color-primary)/var(--tw-text-opacity));
    transition: var(--transition-duration);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    cursor: pointer
}

.btn-fx-1 .btn-fx-1__icon-wrapper,
.btn-fx-1 span {
    position: relative;
    z-index: 2
}

.btn-fx-1 .icon {
    display: block;
    will-change: transform;
    transition: var(--transition-duration)
}

.btn-fx-1 .icon:first-child {
    --tw-text-opacity: 1;
    color: hsl(var(--color-primary)/var(--tw-text-opacity))
}

.btn-fx-1 .icon:last-child {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transform: translateY(100%)
}

.btn-fx-1 .icon:last-child,
.btn-fx-1:hover {
    --tw-text-opacity: 1;
    color: hsl(var(--color-white)/var(--tw-text-opacity))
}

.btn-fx-1:hover .icon:first-child {
    opacity: 0;
    transform: translateY(-100%)
}

.btn-fx-1:hover .icon:last-child {
    opacity: 1;
    transform: translateY(0)
}

.btn-fx-1:hover .btn-fx-1__inner:after {
    transform: skewY(0deg) scaleY(2)
}

.btn-fx-1:focus {
    outline: none;
    box-shadow: 0 0 0 1px hsl(var(--color-floor)), 0 0 0 3px hsl(var(--color-primary))
}

.btn-fx-1__inner {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: hsl(var(--color-primary)/.15);
    overflow: hidden;
    -webkit-clip-path: inset(0 0 0 0 round var(--border-radius));
    clip-path: inset(0 0 0 0 round var(--border-radius))
}

.btn-fx-1__inner:after {
    content: "";
    position: absolute;
    z-index: 1;
    top: 50%;
    left: -5%;
    width: 110%;
    height: 100%;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-primary)/var(--tw-bg-opacity));
    transform-origin: center bottom;
    transform: skewY(10deg) scaleY(0);
    transition: transform var(--transition-duration)
}

.btn-fx-2 {
    position: relative;
    line-height: 1;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-decoration: none
}

.btn-fx-2 span {
    position: relative;
    -webkit-clip-path: inset(0);
    clip-path: inset(0)
}

.btn-fx-2 em,
.btn-fx-2 span {
    display: inline-flex
}

.btn-fx-2 em * {
    --tw-text-opacity: 1;
    color: hsl(var(--color-primary)/var(--tw-text-opacity));
    padding: .25em 0;
    will-change: transform;
    transition: transform .3s
}

.btn-fx-2 em:last-child {
    position: absolute;
    top: 0;
    left: 0
}

.btn-fx-2 em:last-child * {
    transform: translateY(100%)
}

.btn-fx-2:after,
.btn-fx-2:before {
    content: "";
    position: absolute;
    bottom: 0;
    height: 2px;
    left: 0;
    width: 100%
}

.btn-fx-2:before {
    background-color: hsl(var(--color-primary)/.2)
}

.btn-fx-2:after {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-primary)/var(--tw-bg-opacity));
    transform: scaleX(0);
    transition: transform .3s;
    transform-origin: right center
}

.btn-fx-2:hover em :nth-child(2) {
    transition-delay: .05s
}

.btn-fx-2:hover em :nth-child(3) {
    transition-delay: .1s
}

.btn-fx-2:hover em :nth-child(4) {
    transition-delay: .15s
}

.btn-fx-2:hover em :nth-child(5) {
    transition-delay: .2s
}

.btn-fx-2:hover em :nth-child(6) {
    transition-delay: .25s
}

.btn-fx-2:hover em :nth-child(7) {
    transition-delay: .3s
}

.btn-fx-2:hover em :nth-child(8) {
    transition-delay: .35s
}

.btn-fx-2:hover em :nth-child(9) {
    transition-delay: .4s
}

.btn-fx-2:hover em :nth-child(10) {
    transition-delay: .45s
}

.btn-fx-2:hover em:first-child * {
    transform: translateY(-100%)
}

.btn-fx-2:hover em:last-child * {
    transform: translateY(0)
}

.btn-fx-2:hover:after {
    transform: scaleX(1);
    transform-origin: left center
}

.btn-fx-3 {
    --transition-duration: 0.3s;
    position: relative;
    display: inline-block;
    --tw-text-opacity: 1;
    color: hsl(var(--color-floor)/var(--tw-text-opacity));
    line-height: 1;
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    cursor: pointer;
    will-change: transform;
    transition: transform var(--transition-duration)
}

.btn-fx-3 span {
    will-change: transform;
    transition: opacity var(--transition-duration), transform var(--transition-duration) cubic-bezier(.215, .61, .355, 1)
}

.btn-fx-3:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-contrast-higher)/var(--tw-bg-opacity));
    border-radius: inherit;
    will-change: transform;
    transition: transform var(--transition-duration) cubic-bezier(.34, 1.56, .64, 1), box-shadow var(--transition-duration)
}

.btn-fx-3:active {
    transform: scale(.9)
}

.btn-fx-3:hover span {
    opacity: 0;
    transform: scale(.5)
}

.btn-fx-3:hover:before {
    transform: scale(1.1)
}

.btn-fx-3:hover .btn-fx-3__icon-wrapper {
    transform: translateY(0)
}

.btn-fx-3:focus {
    outline: none
}

.btn-fx-3:focus:before {
    box-shadow: 0 .3px .4px rgba(0, 0, 0, .025), 0 .9px 1.5px #0000000d, 0 3.5px 6px #0000001a, 0 0 0 3px hsla(var(--color-contrast-higher)/.15)
}

.btn-fx-3__inner {
    position: relative;
    z-index: 2;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    -webkit-clip-path: inset(0);
    clip-path: inset(0)
}

.btn-fx-3__icon-wrapper {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    will-change: transform;
    transform: translateY(100%);
    transition: transform var(--transition-duration) cubic-bezier(.215, .61, .355, 1)
}

.btn-fx-3__icon-wrapper .icon {
    margin: auto
}

.btn-fx-4 {
    --transition-duration: .3s;
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-contrast-higher)/var(--tw-bg-opacity));
    --tw-shadow: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;
    --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    overflow: hidden;
    line-height: 1;
    text-decoration: none;
    --tw-text-opacity: 1;
    color: hsl(var(--color-floor)/var(--tw-text-opacity));
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transition: var(--transition-duration)
}

.btn-fx-4 span {
    position: relative;
    z-index: 2
}

.btn-fx-4:before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: hsl(var(--color-floor)/.25);
    will-change: transform;
    transform: skewX(-15deg) translate(calc(-100% - .5em));
    pointer-events: none
}

.btn-fx-4:hover:before {
    transform: skewX(-15deg) translate(calc(100% + .5em));
    transition: transform var(--transition-duration)
}

.btn-fx-4:focus {
    outline: none;
    box-shadow: 0 .3px .4px rgba(0, 0, 0, .025), 0 .9px 1.5px #0000000d, 0 3.5px 6px #0000001a, 0 0 0 3px hsla(var(--color-contrast-higher)/.15)
}

.row-table {
    position: relative;
    z-index: 1
}

.row-table__cell {
    padding: .75rem
}

@media (min-width:993px) {
    .row-table__cell {
        padding: 1.25rem
    }
}

.row-table__cell--th {
    font-weight: 700;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-higher)/var(--tw-text-opacity))
}

.row-table__list {
    display: none
}

.row-table:not(.row-table--collapsed) {
    border-bottom-width: 1px;
    --tw-border-opacity: 1;
    border-color: hsl(var(--color-contrast-lower)/var(--tw-border-opacity))
}

.row-table:not(.row-table--collapsed) .row-table__header .row-table__row {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor)/var(--tw-bg-opacity))
}

.row-table:not(.row-table--collapsed) .row-table__header .row-table__cell {
    position: relative;
    background-color: inherit;
    border-bottom-width: 1px;
    --tw-border-opacity: 1;
    border-color: hsl(var(--color-contrast-lower)/var(--tw-border-opacity));
    z-index: 10
}

.row-table:not(.row-table--collapsed) .row-table__header--sticky .row-table__cell {
    position: sticky;
    top: 0
}

.row-table:not(.row-table--collapsed) .row-table__body .row-table__row:nth-child(odd) {
    background-color: hsl(var(--color-floor-dark)/.85)
}

.row-table:not(.row-table--collapsed) .row-table__input {
    display: none
}

.row-table--collapsed {
    border-collapse: initial;
    border-spacing: 0 .375rem;
    margin-top: -.75rem
}

@media (min-width:64rem) {
    .row-table--collapsed {
        border-spacing: 0 .5625rem;
        margin-top: -1.125rem
    }
}

.row-table--collapsed .row-table__cell:not(:first-child),
.row-table--collapsed .row-table__header {
    position: absolute;
    top: 0;
    left: 0;
    clip: rect(1px, 1px, 1px, 1px);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    width: 1px;
    height: 1px;
    padding: 0
}

.row-table--collapsed .row-table__cell:first-child {
    position: relative;
    --tw-bg-opacity: 1;
    background-color: rgb(229 231 235/var(--tw-bg-opacity));
    --tw-shadow: inset 0 1px 0.5px hsla(0, 0%, 100%, .075), 0 0.3px 0.4px rgba(0, 0, 0, .025), 0 0.9px 1.5px #0000000d, 0 3.5px 6px #0000001a;
    --tw-shadow-colored: inset 0 1px 0.5px var(--tw-shadow-color), 0 0.3px 0.4px var(--tw-shadow-color), 0 0.9px 1.5px var(--tw-shadow-color), 0 3.5px 6px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    border-radius: .25rem;
    width: 100%
}

.dark .row-table--collapsed .row-table__cell:first-child {
    background-color: hsl(var(--color-floor-dark)/.85)
}

.row-table--collapsed .row-table__th-inner {
    font-size: 2.125rem
}

@media (min-width:993px) {
    .row-table--collapsed .row-table__th-inner {
        font-size: 2.5rem
    }
}

.row-table--collapsed .row-table__th-inner {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.row-table--collapsed .row-table__th-icon {
    position: relative;
    height: 24px;
    width: 24px;
    --row-table-arrow-width: 2px
}

.row-table--collapsed .row-table__th-icon:after,
.row-table--collapsed .row-table__th-icon:before {
    content: "";
    position: absolute;
    top: calc(50% - 6px);
    width: var(--row-table-arrow-width);
    height: 12px;
    background-color: currentColor;
    transform-origin: 50% 100%;
    transition: transform .3s
}

.row-table--collapsed .row-table__th-icon:before {
    right: 50%;
    transform: translateX(50%) rotate(-45deg)
}

.row-table--collapsed .row-table__th-icon:after {
    right: calc(50% + var(--row-table-arrow-width)/2);
    transform: translateX(50%) rotate(45deg)
}

.row-table--collapsed .row-table__list {
    margin-top: .75rem
}

@media (min-width:993px) {
    .row-table--collapsed .row-table__list {
        margin-top: 1.25rem
    }
}

.row-table--collapsed .row-table__list {
    line-height: 1.4
}

.row-table--collapsed .row-table__item {
    display: flex;
    justify-content: space-between;
    font-weight: 400;
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-high)/var(--tw-text-opacity));
    border-top-width: 1px;
    --tw-border-opacity: 1;
    border-color: hsl(var(--color-contrast-lower)/var(--tw-border-opacity));
    text-align: right;
    padding: .75rem 0
}

@media (min-width:993px) {
    .row-table--collapsed .row-table__item {
        padding-top: 1.25rem;
        padding-bottom: 1.25rem
    }
}

.row-table--collapsed .row-table__label {
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-higher)/var(--tw-text-opacity));
    font-weight: 700;
    margin-right: 1.25rem
}

@media (min-width:993px) {
    .row-table--collapsed .row-table__label {
        margin-right: 2rem
    }
}

.row-table--collapsed .row-table__label {
    text-align: left
}

.row-table--collapsed .row-table__cell--show-list .row-table__th-icon:before {
    transform: translateX(50%) translateY(-80%) rotate(-135deg)
}

.row-table--collapsed .row-table__cell--show-list .row-table__th-icon:after {
    transform: translateX(50%) translateY(-80%) rotate(135deg)
}

.row-table--collapsed .row-table__cell--show-list .row-table__list {
    display: block
}

.row-table--collapsed .row-table__input {
    position: absolute;
    pointer-events: none;
    height: 0;
    width: 0;
    opacity: 0;
    padding: 0;
    border: 0
}

.row-table--collapsed .row-table__input:focus+.row-table__th-inner {
    --tw-text-opacity: 1;
    color: hsl(var(--color-primary)/var(--tw-text-opacity))
}

[class*=row-table--expanded]:before {
    display: none;
    content: "expanded"
}

@media (min-width:32rem) {
    .row-table--expanded\@xs:before {
        content: "merged"
    }
}

@media (min-width:48rem) {
    .row-table--expanded\@sm:before {
        content: "merged"
    }
}

@media (min-width:64rem) {
    .row-table--expanded\@md:before {
        content: "merged"
    }
}

@media (min-width:80rem) {
    .row-table--expanded\@lg:before {
        content: "merged"
    }
}

@media (min-width:90rem) {
    .row-table--expanded\@xl:before {
        content: "merged"
    }
}
:root {
    --radio-switch-width: 186px;
    --radio-switch-height: 46px;
    --radio-switch-padding: 3px;
    --radio-switch-radius: 50em;
    --radio-switch-animation-duration: 0.3s
}

.radio-switch {
    position: relative;
    display: inline-block;
    display: inline-flex;
    padding: var(--radio-switch-padding);
    border-radius: calc(var(--radio-switch-radius)*1.4);
    --tw-bg-opacity: 1;
    background-color: rgb(229 231 235/var(--tw-bg-opacity))
}

.radio-switch:active,
.radio-switch:focus-within {
    box-shadow: 0 0 0 2px #11182726
}

.radio-switch__item {
    position: relative;
    display: inline-block;
    height: calc(var(--radio-switch-height) - var(--radio-switch-padding)*2);
    width: calc(var(--radio-switch-width)*.5 - var(--radio-switch-padding))
}

.radio-switch__label {
    position: relative;
    z-index: 2;
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: center;
    border-radius: var(--radio-switch-radius);
    cursor: pointer;
    font-size: 1.875rem
}

@media (min-width:993px) {
    .radio-switch__label {
        font-size: 2rem
    }
}

.radio-switch__label {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    transition: all var(--radio-switch-animation-duration)
}

.radio-switch__input:checked~.radio-switch__label {
    --tw-text-opacity: 1;
    color: hsl(var(--color-white)/var(--tw-text-opacity))
}

.radio-switch__input:focus~.radio-switch__label {
    background-color: rgba(var(--primary), .6)
}

.radio-switch__input:focus~.radio-switch__label,
.radio-switch__label :not(*):focus-within {
    background-color: initial
}

.radio-switch__marker {
    position: absolute;
    z-index: 1;
    top: 0;
    left: -100%;
    border-radius: var(--radio-switch-radius);
    background-color: rgba(var(--primary), .7);
    height: calc(var(--radio-switch-height) - var(--radio-switch-padding)*2);
    width: calc(var(--radio-switch-width)*.5 - var(--radio-switch-padding));
    --tw-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    transition: transform var(--radio-switch-animation-duration)
}

.radio-switch__input:checked~.radio-switch__marker {
    transform: translateX(100%)
}

.p-table__item {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246/var(--tw-bg-opacity));
    border-radius: .5rem;
    --tw-shadow: inset 0 2px 4px 0 #0000000d;
    --tw-shadow-colored: inset 0 2px 4px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    padding: 1.25rem
}

@media (min-width:993px) {
    .p-table__item {
        padding: 2rem
    }
}

.p-table__item {
    display: flex;
    flex-direction: column
}

.p-table__item--popular {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-white)/var(--tw-bg-opacity));
    box-shadow: 0 0 0 2px #345a8c, 0 .9px 1.5px #00000008, 0 3.1px 5.5px #00000014, 0 14px 25px #0000001f
}

.p-table__badge {
    font-size: 1.875rem
}

@media (min-width:993px) {
    .p-table__badge {
        font-size: 2rem
    }
}

.p-table__badge {
    --tw-bg-opacity: 1;
    background-color: rgb(55 65 81/var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: hsl(var(--color-white)/var(--tw-text-opacity));
    padding: .25rem .375rem
}

@media (min-width:993px) {
    .p-table__badge {
        padding: .375rem .5rem
    }
}

.p-table__badge {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    vertical-align: middle;
    border-radius: .25rem
}

.p-table__price span {
    font-size: 3.25rem
}

@media (min-width:993px) {
    .p-table__price span {
        font-size: 5rem
    }
}

.p-table__price span {
    font-weight: 700
}

.p-table__price i {
    --tw-text-opacity: 1;
    color: rgb(156 163 175/var(--tw-text-opacity))
}

.p-table__features li {
    margin-top: .5rem
}

@media (min-width:993px) {
    .p-table__features li {
        margin-top: .75rem
    }
}

.p-table__switch {
    display: none
}

.p-table--has-switch .p-table__price-wrapper {
    position: relative;
    overflow: hidden
}

.p-table--has-switch .p-table__price {
    will-change: transform;
    transition: transform .3s, opacity .3s;
    transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}

.p-table--has-switch .p-table__price[data-transition-delay="2nd"] {
    transition-delay: .1s
}

.p-table--has-switch .p-table__price[data-transition-delay="3rd"] {
    transition-delay: .2s
}

.p-table--has-switch .p-table__price--month {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}

.p-table--has-switch .p-table__price--year {
    pointer-events: none;
    opacity: 0;
    transform: translateY(100%)
}

.p-table--yearly .p-table__price--month {
    pointer-events: none;
    opacity: 0;
    transform: translateY(-100%)
}

.p-table--yearly .p-table__price--year {
    pointer-events: auto;
    opacity: 1;
    transform: translateY(0)
}

.team {
    position: relative
}

.t-article-v2__cover {
    height: 200px;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-contrast-low)/var(--tw-bg-opacity));
    background-position: 50%;
    background-size: cover;
    background-repeat: no-repeat
}

@media (min-width:64rem) {
    .t-article-v2__cover {
        height: 400px
    }
}

.t-article-v2__intro {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-floor)/var(--tw-bg-opacity));
    padding: 1.25rem;
    margin-top: -5.25rem
}

@media (min-width:64rem) {
    .t-article-v2__intro {
        padding: 2rem;
        margin-top: -8.25rem
    }
}

.t-article-v2__divider {
    display: flex;
    align-items: center
}

.t-article-v2__divider span {
    display: block;
    margin: 0 .5rem;
    height: 10px;
    width: 10px;
    transform: rotate(45deg);
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-contrast-low)/var(--tw-bg-opacity))
}

@media (min-width:64rem) {
    .t-article-v2__divider span {
        margin: 0 .75rem
    }
}

.t-article-v2__divider:after,
.t-article-v2__divider:before {
    content: "";
    display: block;
    height: 1px;
    width: auto;
    flex-grow: 1;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-contrast-lower)/var(--tw-bg-opacity))
}

.adv-select-popover {
    font-size: 1rem
}

.adv-select-popover.popover {
    --popover-width: 250px;
    --popover-control-gap: 4px;
    --popover-viewport-gap: 20px;
    --popover-transition-duration: 0.2s
}

@media (min-width:64rem) {
    .adv-select-popover.popover {
        --popover-width: 320px
    }
}

.adv-select-popover__optgroup:not(:first-of-type) {
    padding-top: .375rem
}

@media (min-width:64rem) {
    .adv-select-popover__optgroup:not(:first-of-type) {
        padding-top: .5625rem
    }
}

.adv-select-popover__optgroup:not(:last-of-type) {
    border-bottom-width: 1px;
    border-color: hsl(var(--color-contrast-higher)/.1);
    padding-bottom: .375rem
}

@media (min-width:64rem) {
    .adv-select-popover__optgroup:not(:last-of-type) {
        padding-bottom: .5625rem
    }
}

.adv-select-popover__check {
    display: none
}

.adv-select-popover__option {
    position: relative;
    cursor: pointer;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transition: .2s
}

.adv-select-popover__option:hover {
    background-color: hsl(var(--color-contrast-higher)/.08)
}

.adv-select-popover__option:focus {
    outline: none;
    background-color: hsl(var(--color-primary)/.15)
}

.adv-select-popover__option[aria-selected=true] {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--color-primary)/var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: hsl(var(--color-white)/var(--tw-text-opacity))
}

.adv-select-popover__option[aria-selected=true] .adv-select-popover__check {
    display: block
}

.adv-select-popover__option[aria-selected=true]:focus {
    box-shadow: inset 0 0 0 2px hsl(var(--color-primary-dark))
}

.device-group-1 {
    position: relative;
    z-index: 1;
    display: grid;
    align-items: center;
    grid-template-columns: repeat(10, 1fr)
}

.device-group-1>* {
    position: relative;
    grid-row: 1/-1
}

.device-group-1>:first-child,
.device-group-1>:nth-child(3) {
    z-index: 1
}

.device-group-1>:first-child {
    grid-column: 1/5
}

.device-group-1>:nth-child(2) {
    z-index: 2;
    grid-column: 4/8
}

.device-group-1>:nth-child(3) {
    grid-column: 7/11
}

.device-group-1 .dev-phone-3d-wrapper {
    perspective: 1000px
}

.device-group-1 .dev-phone-3d-wrapper:first-child .dev-phone,
.device-group-1 .dev-phone-3d-wrapper:last-child .dev-phone {
    transition: transform .5s
}

.device-group-1 .dev-phone-3d-wrapper:first-child .dev-phone {
    transform: rotateY(30deg);
    transform-origin: left center
}

.device-group-1 .dev-phone-3d-wrapper:last-child .dev-phone {
    transform: rotateY(-30deg);
    transform-origin: right center
}

.device-group-1:hover .dev-phone-3d-wrapper:first-child .dev-phone {
    transform: rotateY(20deg)
}

.device-group-1:hover .dev-phone-3d-wrapper:last-child .dev-phone {
    transform: rotateY(-20deg)
}

.device-group-2 {
    position: relative;
    z-index: 1;
    display: grid;
    align-items: end;
    grid-template-columns: repeat(12, 1fr);
    padding-bottom: 2.5%
}

.device-group-2>* {
    position: relative;
    grid-row: 1/-1
}

.device-group-2 .dev-phone {
    z-index: 2;
    grid-column: 1/4;
    bottom: -5%
}

.device-group-2 .dev-laptop {
    z-index: 1;
    grid-column: 2/13
}

.device-group-3 {
    position: relative;
    z-index: 1;
    display: grid;
    align-items: end;
    grid-template-columns: repeat(12, 1fr);
    padding-bottom: 3.75%
}

.device-group-3>* {
    position: relative;
    grid-row: 1/-1
}

.device-group-3 .dev-phone {
    z-index: 2;
    grid-column: 1/4;
    bottom: -5%
}

.device-group-3 .dev-desktop {
    z-index: 1;
    grid-column: 2/13
}

.device-group-4 {
    position: relative;
    z-index: 1;
    display: grid;
    align-items: end;
    grid-template-columns: repeat(12, 1fr);
    padding-bottom: 2.75%
}

.device-group-4>* {
    position: relative;
    grid-row: 1/-1
}

.device-group-4 .dev-phone {
    z-index: 2;
    grid-column: 1/3;
    bottom: -5%
}

.device-group-4 .dev-desktop {
    z-index: 1;
    grid-column: 2/10
}

.device-group-4 .dev-laptop {
    z-index: 2;
    bottom: -5%;
    grid-column: 6/13
}

.hero-video-bg__video {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    overflow: hidden;
    z-index: 1
}

.hero-video-bg__video video {
    position: relative;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    min-height: 100%;
    min-width: 100%;
    height: auto;
    width: auto;
    max-width: none
}

@supports ((-o-object-fit:cover) or (object-fit:cover)) {
    .hero-video-bg__video video {
        -o-object-fit: cover;
        object-fit: cover;
        height: 100%;
        width: 100%
    }
}

@supports ((-o-object-fit:cover) or (object-fit:cover)) and (-ms-ime-align:auto) {
    .hero-video-bg__video video {
        height: auto;
        width: auto
    }
}

.hero-video-bg__video img {
    display: none
}

@media (prefers-reduced-motion:reduce) {
    .hero-video-bg__video video {
        visibility: hidden
    }

    .hero-video-bg__video img {
        display: block;
        position: absolute;
        -o-object-fit: cover;
        object-fit: cover;
        height: 100%;
        width: 100%
    }
}

.hero-video-bg__play-btn {
    --btn-size: 80px;
    width: var(--btn-size);
    height: var(--btn-size);
    display: inline-flex;
    background-color: hsl(var(--color-contrast-higher)/.85);
    border-radius: 50%;
    cursor: pointer;
    transition: background-color .3s
}

.hero-video-bg__play-btn .icon {
    display: block;
    margin: auto;
    --tw-text-opacity: 1;
    color: hsl(var(--color-floor)/var(--tw-text-opacity));
    font-size: 32px;
    transition: transform .3s cubic-bezier(.34, 1.56, .64, 1)
}

.hero-video-bg__play-btn:hover {
    background-color: hsl(var(--color-contrast-higher)/1)
}

.hero-video-bg__play-btn:hover .icon {
    transform: scale(1.2)
}

.ld-switch-btn {
    position: relative;
    width: 24px;
    height: 24px;
    overflow: hidden;
    display: inline-block;
    transition: opacity .2s, color .2s
}

.ld-switch-btn:hover {
    cursor: pointer;
    opacity: .8
}

.ld-switch-btn:focus {
    outline: none
}

.ld-switch-btn.popover-control--active,
.ld-switch-btn:focus {
    color: hsl(var(--color-primary))
}

.ld-switch-btn__icon-wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transform: translateY(100%) rotate(35deg) scale(.5)
}

.ld-switch-btn__icon-wrapper--in {
    opacity: 1;
    transform: translateY(0) rotate(0) scale(1)
}

.ld-switch-btn__icon-wrapper--out {
    opacity: 0;
    transform: translateY(-100%) rotate(-35deg) scale(.5)
}

.ld-switch-btn__icon-wrapper--in,
.ld-switch-btn__icon-wrapper--out {
    transition: transform .3s cubic-bezier(.645, .045, .355, 1), opacity .3s
}

.ld-switch-btn__icon {
    margin: auto;
    --size: 20px
}

.popover.ld-switch-popover {
    --popover-width: 250px
}

.ld-switch-popover__option {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    transition: opacity .2s
}

.ld-switch-popover__option:hover {
    cursor: pointer;
    opacity: .85
}

.ld-switch-popover__option:focus {
    outline: none
}

.ld-switch-popover__option:focus figure {
    box-shadow: 0 0 0 1px hsl(var(--color-floor-light)), 0 0 0 3px hsl(var(--color-contrast-higher))
}

.ld-switch-popover__option[aria-selected=true] {
    color: hsl(var(--color-primary))
}

.ld-switch-popover__option[aria-selected=true] figure {
    box-shadow: 0 0 0 1px hsl(var(--color-floor-light)), 0 0 0 3px currentColor
}

.dark .panel {
    --tw-bg-opacity: 1;
    background-color: rgb(23 23 23/var(--tw-bg-opacity))
}

.dark .form-control,
.dark .input-group-addon,
.dark .panel {
    --tw-text-opacity: 1;
    color: rgb(229 231 235/var(--tw-text-opacity))
}

.dark .form-control,
.dark .input-group-addon {
    --tw-border-opacity: 1;
    border-color: rgb(64 64 64/var(--tw-border-opacity))
}

.dark .form-control {
    --tw-bg-opacity: 1;
    background-color: rgb(38 38 38/var(--tw-bg-opacity))
}

.dark .input-group-addon {
    --tw-bg-opacity: 1;
    background-color: rgb(64 64 64/var(--tw-bg-opacity))
}

.dark .dropdown-menu {
    --tw-bg-opacity: 1;
    background-color: rgb(38 38 38/var(--tw-bg-opacity));
    --tw-border-opacity: 1;
    border-color: rgb(64 64 64/var(--tw-border-opacity))
}

.dark .datepicker-dropdown.datepicker-orient-bottom:after {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(64 64 64/var(--tw-border-opacity))
}

.dark .rocktree,
.dark .rocktree .rocktree-icon:active,
.dark .rocktree .rocktree-icon:focus,
.dark .rocktree .rocktree-icon:hover {
    --tw-text-opacity: 1;
    color: hsl(var(--color-contrast-high)/var(--tw-text-opacity))
}

.dark .picker .picker-actions,
.dark .picker .picker-label,
.dark .well {
    --tw-bg-opacity: 1;
    background-color: rgb(38 38 38/var(--tw-bg-opacity));
    --tw-border-opacity: 1;
    border-color: rgb(115 115 115/var(--tw-border-opacity))
}

.dark .picker .picker-label,
.dark .rocktree .rocktree-item {
    --tw-text-opacity: 1;
    color: rgb(229 231 235/var(--tw-text-opacity))
}

.dark .datepicker .datepicker-switch:hover,
.dark .datepicker .next:hover,
.dark .datepicker .prev:hover,
.dark .datepicker table tr td span.focused,
.dark .datepicker table tr td span:hover,
.dark .datepicker table tr td.day:hover,
.dark .datepicker table tr td.focused,
.dark .datepicker tfoot tr th:hover {
    background: #393939
}

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border-width: 0 !important
}

.pointer-events-none {
    pointer-events: none !important
}

.visible {
    visibility: visible !important
}

.invisible {
    visibility: hidden !important
}

.static {
    position: static !important
}

.fixed {
    position: fixed !important
}

.absolute {
    position: absolute !important
}

.relative {
    position: relative !important
}

.bottom-0 {
    bottom: 0 !important
}

.left-0 {
    left: 0 !important
}

.left-1\/2 {
    left: 50% !important
}

.right-0 {
    right: 0 !important
}

.top-0 {
    top: 0 !important
}

.top-1\/2 {
    top: 50% !important
}

.z-1 {
    z-index: 1 !important
}

.z-10 {
    z-index: 10 !important
}

.z-2 {
    z-index: 2 !important
}

.z-40 {
    z-index: 40 !important
}

.z-50 {
    z-index: 50 !important
}

.z-\[1\] {
    z-index: 1 !important
}

.z-\[2\] {
    z-index: 2 !important
}

.order-2 {
    order: 2 !important
}

.col-span-12 {
    grid-column: span 12/span 12 !important
}

.m-0 {
    margin: 0 !important
}

.m-2 {
    margin: .5rem !important
}

.-mx-4 {
    margin-left: -1rem !important;
    margin-right: -1rem !important
}

.mx-10 {
    margin-left: 2.5rem !important;
    margin-right: 2.5rem !important
}

.mx-12 {
    margin-left: 3rem !important;
    margin-right: 3rem !important
}

.mx-4 {
    margin-left: 1rem !important;
    margin-right: 1rem !important
}

.mx-auto {
    margin-left: auto !important;
    margin-right: auto !important
}

.my-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important
}

.my-16 {
    margin-top: 4rem !important;
    margin-bottom: 4rem !important
}

.my-20 {
    margin-top: 5rem !important;
    margin-bottom: 5rem !important
}

.my-3 {
    margin-top: .75rem !important;
    margin-bottom: .75rem !important
}

.my-5 {
    margin-top: 1.25rem !important;
    margin-bottom: 1.25rem !important
}

.my-6 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important
}

.my-8 {
    margin-top: 2rem !important;
    margin-bottom: 2rem !important
}

.-mb-10 {
    margin-bottom: -2.5rem !important
}

.-ml-40 {
    margin-left: -10rem !important
}

.-mt-4 {
    margin-top: -1rem !important
}

.-mt-5 {
    margin-top: -1.25rem !important
}

.-mt-8 {
    margin-top: -2rem !important
}

.mb-0 {
    margin-bottom: 0 !important
}

.mb-1 {
    margin-bottom: .25rem !important
}

.mb-1\.5 {
    margin-bottom: .375rem !important
}

.mb-12 {
    margin-bottom: 3rem !important
}

.mb-2 {
    margin-bottom: .5rem !important
}

.mb-20 {
    margin-bottom: 5rem !important
}

.mb-24 {
    margin-bottom: 6rem !important
}

.mb-3 {
    margin-bottom: .75rem !important
}

.mb-4 {
    margin-bottom: 1rem !important
}

.mb-5 {
    margin-bottom: 1.25rem !important
}

.mb-8 {
    margin-bottom: 2rem !important
}

.ml-1 {
    margin-left: .25rem !important
}

.ml-2 {
    margin-left: .5rem !important
}

.ml-3 {
    margin-left: .75rem !important
}

.ml-4 {
    margin-left: 1rem !important
}

.ml-6 {
    margin-left: 1.5rem !important
}

.mr-1 {
    margin-right: .25rem !important
}

.mr-2 {
    margin-right: .5rem !important
}

.mr-\[calc\(17px_\+_7\.5\%\)\] {
    margin-right: calc(17px + 7.5%) !important
}

.mt-0 {
    margin-top: 0 !important
}

.mt-0\.5 {
    margin-top: .125rem !important
}

.mt-1 {
    margin-top: .25rem !important
}

.mt-1\.5 {
    margin-top: .375rem !important
}

.mt-10 {
    margin-top: 2.5rem !important
}

.mt-20 {
    margin-top: 5rem !important
}

.mt-3 {
    margin-top: .75rem !important
}

.mt-4 {
    margin-top: 1rem !important
}

.mt-5 {
    margin-top: 1.25rem !important
}

.mt-6 {
    margin-top: 1.5rem !important
}

.mt-8 {
    margin-top: 2rem !important
}

.mt-auto {
    margin-top: auto !important
}

.box-border {
    box-sizing: border-box !important
}

.block {
    display: block !important
}

.inline-block {
    display: inline-block !important
}

.inline {
    display: inline !important
}

.flex {
    display: flex !important
}

.inline-flex {
    display: inline-flex !important
}

.table {
    display: table !important
}

.table-caption {
    display: table-caption !important
}

.table-cell {
    display: table-cell !important
}

.table-row-group {
    display: table-row-group !important
}

.table-row {
    display: table-row !important
}

.grid {
    display: grid !important
}

.contents {
    display: contents !important
}

.\!hidden,
.hidden {
    display: none !important
}

.h-1 {
    height: .25rem !important
}

.h-10 {
    height: 2.5rem !important
}

.h-16 {
    height: 4rem !important
}

.h-2 {
    height: .5rem !important
}

.h-28 {
    height: 7rem !important
}

.h-4 {
    height: 1rem !important
}

.h-40 {
    height: 10rem !important
}

.h-5 {
    height: 1.25rem !important
}

.h-8 {
    height: 2rem !important
}

.h-\[16px\] {
    height: 16px !important
}

.h-\[24px\] {
    height: 24px !important
}

.h-\[35rem\] {
    height: 35rem !important
}

.h-\[600px\] {
    height: 600px !important
}

.h-\[80px\] {
    height: 80px !important
}

.h-auto {
    height: auto !important
}

.h-full {
    height: 100% !important
}

.min-h-0 {
    min-height: 0 !important
}

.min-h-500 {
    min-height: 500px !important
}

.w-10 {
    width: 2.5rem !important
}

.w-16 {
    width: 4rem !important
}

.w-2\/3 {
    width: 66.666667% !important
}

.w-28 {
    width: 7rem !important
}

.w-32 {
    width: 8rem !important
}

.w-4 {
    width: 1rem !important
}

.w-40 {
    width: 10rem !important
}

.w-5 {
    width: 1.25rem !important
}

.w-64 {
    width: 16rem !important
}

.w-8 {
    width: 2rem !important
}

.w-\[134\%\] {
    width: 134% !important
}

.w-\[16px\] {
    width: 16px !important
}

.w-\[24px\] {
    width: 24px !important
}

.w-\[80px\] {
    width: 80px !important
}

.w-\[calc\(100\%_-_2\.5rem\)\] {
    width: calc(100% - 2.5rem) !important
}

.w-\[calc\(100\%_-_3em\)\] {
    width: calc(100% - 3em) !important
}

.w-full {
    width: 100% !important
}

.min-w-\[1280px\] {
    min-width: 1280px !important
}

.max-w-6xl {
    max-width: 72rem !important
}

.max-w-7xl {
    max-width: 80rem !important
}

.max-w-\[1920px\] {
    max-width: 1920px !important
}

.max-w-lg {
    max-width: 32rem !important
}

.max-w-screen-lg {
    max-width: 993px !important
}

.max-w-screen-md {
    max-width: 769px !important
}

.max-w-screen-sm {
    max-width: 481px !important
}

.max-w-screen-xl {
    max-width: 1201px !important
}

.max-w-xl {
    max-width: 36rem !important
}

.flex-none {
    flex: none !important
}

.flex-shrink {
    flex-shrink: 1 !important
}

.flex-shrink-0,
.shrink-0 {
    flex-shrink: 0 !important
}

.flex-grow,
.grow {
    flex-grow: 1 !important
}

.basis-full {
    flex-basis: 100% !important
}

.-translate-x-1\/2 {
    --tw-translate-x: -50% !important
}

.-translate-x-1\/2,
.-translate-y-1\/2 {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important
}

.-translate-y-1\/2 {
    --tw-translate-y: -50% !important
}

.-scale-x-100 {
    --tw-scale-x: -1 !important
}

.-scale-x-100,
.\!transform,
.transform {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important
}

.transform-none {
    transform: none !important
}

.cursor-pointer {
    cursor: pointer !important
}

.resize {
    resize: both !important
}

.list-none {
    list-style-type: none !important
}

.grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important
}

.flex-col {
    flex-direction: column !important
}

.flex-wrap {
    flex-wrap: wrap !important
}

.items-center {
    align-items: center !important
}

.justify-start {
    justify-content: flex-start !important
}

.justify-end {
    justify-content: flex-end !important
}

.justify-center {
    justify-content: center !important
}

.justify-between {
    justify-content: space-between !important
}

.gap-1 {
    gap: .25rem !important
}

.gap-3 {
    gap: .75rem !
}

.gap-5 {
    gap: 1.25rem 
}

.gap-y-8 {
    row-gap: 2rem 
}

.space-x-3>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 0 !important;
    margin-right: calc(.75rem*var(--tw-space-x-reverse)) !important;
    margin-left: calc(.75rem*(1 - var(--tw-space-x-reverse))) !important
}

.space-y-2>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0 !important;
    margin-top: calc(.5rem*(1 - var(--tw-space-y-reverse))) !important;
    margin-bottom: calc(.5rem*var(--tw-space-y-reverse)) !important
}

.space-y-6>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0 !important;
    margin-top: calc(1.5rem*(1 - var(--tw-space-y-reverse))) !important;
    margin-bottom: calc(1.5rem*var(--tw-space-y-reverse)) !important
}

.overflow-hidden {
    overflow: hidden !important
}

.overflow-visible {
    overflow: visible !important
}

.truncate {
    overflow: hidden !important;
    text-overflow: ellipsis !important
}

.truncate,
.whitespace-nowrap {
    white-space: nowrap !important
}

.text-pretty {
    text-wrap: pretty !important
}

.rounded {
    border-radius: .25rem !important
}

.rounded-3xl {
    border-radius: 1.5rem !important
}

.rounded-full {
    border-radius: 9999px !important
}

.rounded-lg {
    border-radius: .5rem !important
}

.rounded-md {
    border-radius: .375rem !important
}

.rounded-xl {
    border-radius: .75rem !important
}

.border {
    border-width: 1px !important
}

.border-0 {
    border-width: 0 !important
}

.border-2 {
    border-width: 2px !important
}

.border-4 {
    border-width: 4px !important
}

.border-l {
    border-left-width: 1px !important
}

.border-l-2 {
    border-left-width: 2px !important
}

.border-l-3 {
    border-left-width: 3px !important
}

.border-t {
    border-top-width: 1px !important
}

.border-solid {
    border-style: solid !important
}

.border-none {
    border-style: none !important
}

.border-c-primary {
    border-color: rgba(var(--primary)) !important
}

.border-gray-200 {
    --tw-border-opacity: 1 !important;
    border-color: rgb(229 231 235/var(--tw-border-opacity)) !important
}

.border-white {
    --tw-border-opacity: 1 !important;
    border-color: hsl(var(--color-white)/var(--tw-border-opacity)) !important
}

.bg-c-primary {
    background-color: rgba(var(--primary)) !important
}

.bg-c-primary-100 {
    background-color: rgba(var(--primary), .1) !important
}

.bg-c-primary-200 {
    background-color: rgba(var(--primary), .2) !important
}

.bg-c-primary-300,
.bg-c-primary-500\/30 {
    background-color: rgba(var(--primary), .3) !important
}

.bg-floor {
    background-color: hsl(var(--color-floor)/var(--tw-bg-opacity)) !important
}

.bg-floor,
.bg-floor-dark {
    --tw-bg-opacity: 1 !important
}

.bg-floor-dark {
    background-color: hsl(var(--color-floor-dark)/var(--tw-bg-opacity)) !important
}

.bg-floor-light {
    --tw-bg-opacity: 1 !important;
    background-color: hsl(var(--color-floor-light)/var(--tw-bg-opacity)) !important
}

.bg-gray-100 {
    background-color: rgb(243 244 246/var(--tw-bg-opacity)) !important
}

.bg-gray-100,
.bg-gray-200 {
    --tw-bg-opacity: 1 !important
}

.bg-gray-200 {
    background-color: rgb(229 231 235/var(--tw-bg-opacity)) !important
}

.bg-neutral-100 {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(245 245 245/var(--tw-bg-opacity)) !important
}

.bg-primary {
    background-color: hsl(var(--color-primary)/var(--tw-bg-opacity)) !important
}

.bg-primary,
.bg-white {
    --tw-bg-opacity: 1 !important
}

.bg-white {
    background-color: hsl(var(--color-white)/var(--tw-bg-opacity)) !important
}

.bg-opacity-50 {
    --tw-bg-opacity: 0.5 !important
}

.bg-cover {
    background-size: cover !important
}

.bg-center {
    background-position: 50% !important
}

.fill-current {
    fill: currentColor !important
}

.object-cover {
    -o-object-fit: cover !important;
    object-fit: cover !important
}

.p-12 {
    padding: 3rem !important
}

.p-16 {
    padding: 4rem !important
}

.p-2 {
    padding: .5rem !important
}

.p-2\.5 {
    padding: .625rem !important
}

.p-3 {
    padding: .75rem !important
}

.p-4 {
    padding: 1rem !important
}

.p-5 {
    padding: 1.25rem !important
}

.p-6 {
    padding: 1.5rem !important
}

.p-8 {
    padding: 2rem !important
}

.px-0 {
    padding-left: 0 !important;
    padding-right: 0 !important
}

.px-0\.5 {
    padding-left: .125rem !important;
    padding-right: .125rem !important
}

.px-12 {
    padding-left: 3rem !important;
    padding-right: 3rem !important
}

.px-16 {
    padding-left: 4rem !important;
    padding-right: 4rem !important
}

.px-2 {
    padding-left: .5rem !important;
    padding-right: .5rem !important
}

.px-24 {
    padding-left: 6rem !important;
    padding-right: 6rem !important
}

.px-3 {
    padding-left: .75rem !important;
    padding-right: .75rem !important
}

.px-4 {
    padding-left: 1rem !important;
    padding-right: 1rem !important
}

.px-5 {
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important
}

.px-6 {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important
}

.px-8 {
    padding-left: 2rem !important;
    padding-right: 2rem !important
}

.py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

.py-1 {
    padding-top: .25rem !important;
    padding-bottom: .25rem !important
}

.py-10 {
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important
}

.py-12 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important
}

.py-16 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important
}

.py-2 {
    padding-top: .5rem !important;
    padding-bottom: .5rem !important
}

.py-20 {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important
}

.py-24 {
    padding-top: 6rem !important;
    padding-bottom: 6rem !important
}

.py-3 {
    padding-top: .75rem !important;
    padding-bottom: .75rem !important
}

.py-32 {
    padding-top: 8rem !important;
    padding-bottom: 8rem !important
}

.py-4 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important
}

.py-6 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important
}

.py-8 {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important
}

.py-\[15px\] {
    padding-top: 15px !important;
    padding-bottom: 15px !important
}

.pb-10 {
    padding-bottom: 2.5rem !important
}

.pb-12 {
    padding-bottom: 3rem !important
}

.pb-2 {
    padding-bottom: .5rem !important
}

.pb-24 {
    padding-bottom: 6rem !important
}

.pb-32 {
    padding-bottom: 8rem !important
}

.pb-4 {
    padding-bottom: 1rem !important
}

.pb-8 {
    padding-bottom: 2rem !important
}

.pr-1 {
    padding-right: .25rem !important
}

.pr-10 {
    padding-right: 2.5rem !important
}

.pr-16 {
    padding-right: 4rem !important
}

.pr-24 {
    padding-right: 6rem !important
}

.pr-28 {
    padding-right: 7rem !important
}

.pt-0 {
    padding-top: 0 !important
}

.pt-12 {
    padding-top: 3rem !important
}

.pt-16 {
    padding-top: 4rem !important
}

.pt-24 {
    padding-top: 6rem !important
}

.pt-3 {
    padding-top: .75rem !important
}

.pt-32 {
    padding-top: 8rem !important
}

.pt-4 {
    padding-top: 1rem !important
}

.pt-5 {
    padding-top: 1.25rem !important
}

.pt-8 {
    padding-top: 2rem !important
}

.text-left {
    text-align: left !important
}

.text-center {
    text-align: center !important
}

.text-right {
    text-align: right !important
}

.align-middle {
    vertical-align: middle !important
}

.text-2xl {
    font-size: 2.5rem !important
}

.text-2xs {
    font-size: 1.5rem !important
}

.text-3xl {
    font-size: 2.875rem !important
}

.text-3xs {
    font-size: 1.25rem !important
}

.text-4xl {
    font-size: 3.25rem !important
}

.text-4xs {
    font-size: 1.125rem !important
}

.text-5xl {
    font-size: 4rem !important
}

.text-6xl {
    font-size: 5rem !important
}

.text-\[1\.2em\] {
    font-size: 1.2em !important
}

.text-\[1em\] {
    font-size: 1em !important
}

.text-\[8rem\] {
    font-size: 8rem !important
}

.text-lg {
    font-size: 2.125rem !important
}

.text-sm {
    font-size: 1.875rem !important
}

.text-xl {
    font-size: 2.25rem !important
}

.text-xs {
    font-size: 1.75rem !important
}

.font-bold {
    font-weight: 700 !important
}

.font-medium {
    font-weight: 500 !important
}

.font-normal {
    font-weight: 400 !important
}

.font-semibold {
    font-weight: 600 !important
}

.uppercase {
    text-transform: uppercase !important
}

.lowercase {
    text-transform: lowercase !important
}

.not-italic {
    font-style: normal !important
}

.leading-extra-tight {
    line-height: 1.1 !important
}

.leading-none {
    line-height: 1 !important
}

.leading-normal {
    line-height: 1.5 !important
}

.leading-relaxed {
    line-height: 1.625 !important
}

.leading-snug {
    line-height: 1.375 !important
}

.leading-tight {
    line-height: 1.25 !important
}

.tracking-wider {
    letter-spacing: .05em !important
}

.text-black {
    --tw-text-opacity: 1 !important;
    color: hsl(var(--color-black)/var(--tw-text-opacity)) !important
}

.text-c-primary {
    color: rgba(var(--primary)) !important
}

.text-contrast-higher {
    --tw-text-opacity: 1 !important;
    color: hsl(var(--color-contrast-higher)/var(--tw-text-opacity)) !important
}

.text-contrast-low {
    --tw-text-opacity: 1 !important;
    color: hsl(var(--color-contrast-low)/var(--tw-text-opacity)) !important
}

.text-contrast-medium {
    --tw-text-opacity: 1 !important;
    color: hsl(var(--color-contrast-medium)/var(--tw-text-opacity)) !important
}

.text-gray-200 {
    --tw-text-opacity: 1 !important;
    color: rgb(229 231 235/var(--tw-text-opacity)) !important
}

.text-gray-500 {
    --tw-text-opacity: 1 !important;
    color: rgb(107 114 128/var(--tw-text-opacity)) !important
}

.text-gray-600 {
    --tw-text-opacity: 1 !important;
    color: rgb(75 85 99/var(--tw-text-opacity)) !important
}

.text-gray-700 {
    --tw-text-opacity: 1 !important;
    color: rgb(55 65 81/var(--tw-text-opacity)) !important
}

.text-gray-800 {
    --tw-text-opacity: 1 !important;
    color: rgb(31 41 55/var(--tw-text-opacity)) !important
}

.text-gray-900 {
    --tw-text-opacity: 1 !important;
    color: rgb(17 24 39/var(--tw-text-opacity)) !important
}

.text-inherit {
    color: inherit !important
}

.text-neutral-700 {
    --tw-text-opacity: 1 !important;
    color: rgb(64 64 64/var(--tw-text-opacity)) !important
}

.text-orange-400 {
    --tw-text-opacity: 1 !important;
    color: rgb(251 146 60/var(--tw-text-opacity)) !important
}

.text-primary {
    color: hsl(var(--color-primary)/var(--tw-text-opacity)) !important
}

.text-primary,
.text-white {
    --tw-text-opacity: 1 !important
}

.text-white {
    color: hsl(var(--color-white)/var(--tw-text-opacity)) !important
}

.underline {
    text-decoration-line: underline !important
}

.no-underline {
    text-decoration-line: none !important
}

.opacity-0 {
    opacity: 0 !important
}

.opacity-10 {
    opacity: .1 !important
}

.opacity-40 {
    opacity: .4 !important
}

.opacity-70 {
    opacity: .7 !important
}

.opacity-80 {
    opacity: .8 !important
}

.opacity-90 {
    opacity: .9 !important
}

.bg-blend-darken {
    background-blend-mode: darken !important
}

.shadow-lg {
    --tw-shadow: 0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a !important;
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color) !important
}

.shadow-lg,
.shadow-md {
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important
}

.shadow-md {
    --tw-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a !important;
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color) !important
}

.shadow-none {
    --tw-shadow: 0 0 #0000 !important;
    --tw-shadow-colored: 0 0 #0000 !important;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important
}

.outline {
    outline-style: solid !important
}

.ring {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important
}

.blur {
    --tw-blur: blur(8px) !important
}

.blur,
.contrast-200 {
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important
}

.contrast-200 {
    --tw-contrast: contrast(2) !important
}

.grayscale {
    --tw-grayscale: grayscale(100%) !important;
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important
}

.\!invert,
.invert {
    --tw-invert: invert(100%) !important
}

.\!filter,
.\!invert,
.filter,
.invert {
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important
}

.transition {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter !important;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter !important;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter !important;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1) !important;
    transition-duration: .15s !important
}

.transition-all {
    transition-property: all !important;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1) !important;
    transition-duration: .15s !important
}

.duration-100 {
    transition-duration: .1s !important
}

.duration-200 {
    transition-duration: .2s !important
}

.duration-300 {
    transition-duration: .3s !important
}

.ease-in {
    transition-timing-function: cubic-bezier(.4, 0, 1, 1) !important
}

.ease-in-out {
    transition-timing-function: cubic-bezier(.4, 0, .2, 1) !important
}

.ease-linear {
    transition-timing-function: linear !important
}

.ease-out {
    transition-timing-function: cubic-bezier(0, 0, .2, 1) !important
}

.dark\:compass-body-dark:is(.dark *) {
    background-color: rgb(23 23 23/var(--tw-bg-opacity))
}

.dark\:breadcrumb-container-dark:is(.dark *),
.dark\:compass-body-dark:is(.dark *) {
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    color: rgb(229 231 235/var(--tw-text-opacity))
}

.dark\:breadcrumb-container-dark:is(.dark *) {
    background-color: rgb(82 82 82/var(--tw-bg-opacity))
}

.dark\:breadcrumb-container-dark:is(.dark *)>ol.breadcrumb {
    --tw-bg-opacity: 1;
    background-color: rgb(82 82 82/var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: rgb(229 231 235/var(--tw-text-opacity))
}

@media (min-width:769px) {
    .md\:container {
        width: 100%
    }

    @media (min-width:320px) {
        .md\:container {
            max-width: 320px
        }
    }

    @media (min-width:481px) {
        .md\:container {
            max-width: 481px
        }
    }

    @media (min-width:769px) {
        .md\:container {
            max-width: 769px
        }
    }

    @media (min-width:993px) {
        .md\:container {
            max-width: 993px
        }
    }

    @media (min-width:1201px) {
        .md\:container {
            max-width: 1201px
        }
    }

    .md\:leading-tight.text-component {
        --heading-line-height: 1.1;
        --body-line-height: 1.2;
        line-height: normal
    }
}

.after\:bg-transparent:after {
    content: var(--tw-content) !important;
    background-color: initial !important
}

.hover\:z-10:hover {
    z-index: 10 !important
}

.hover\:scale-105:hover {
    --tw-scale-x: 1.05 !important;
    --tw-scale-y: 1.05 !important;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important
}

.hover\:bg-c-primary-600:hover {
    background-color: rgba(var(--primary), .6) !important
}

.hover\:bg-c-primary-700:hover {
    background-color: rgba(var(--primary), .7) !important
}

.hover\:bg-c-primary-800:hover {
    background-color: rgba(var(--primary), .8) !important
}

.hover\:bg-gray-200:hover {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(229 231 235/var(--tw-bg-opacity)) !important
}

.hover\:bg-gray-300:hover {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(209 213 219/var(--tw-bg-opacity)) !important
}

.hover\:text-c-primary:hover {
    color: rgba(var(--primary)) !important
}

.hover\:shadow-xl:hover {
    --tw-shadow: 0 20px 25px -5px #0000001a, 0 8px 10px -6px #0000001a !important;
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color) !important;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important
}

.focus\:border-blue-500:focus {
    --tw-border-opacity: 1 !important;
    border-color: rgb(59 130 246/var(--tw-border-opacity)) !important
}

.focus\:outline-none:focus {
    outline: 2px solid #0000 !important;
    outline-offset: 2px !important
}

.focus\:ring-4:focus {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important
}

.focus\:ring-c-primary:focus {
    --tw-ring-color: rgba(var(--primary)) !important
}

.focus\:ring-gray-200:focus {
    --tw-ring-opacity: 1 !important;
    --tw-ring-color: rgb(229 231 235/var(--tw-ring-opacity)) !important
}

.focus-visible\:outline-2:focus-visible {
    outline-width: 2px !important
}

.focus-visible\:outline-offset-2:focus-visible {
    outline-offset: 2px !important
}

.focus-visible\:outline-c-primary:focus-visible {
    outline-color: rgba(var(--primary)) !important
}

.disabled\:pointer-events-none:disabled {
    pointer-events: none !important
}

.disabled\:opacity-50:disabled {
    opacity: .5 !important
}

.dark\:block:is(.dark *) {
    display: block !important
}

.dark\:\!hidden:is(.dark *) {
    display: none !important
}

.dark\:border-2:is(.dark *) {
    border-width: 2px !important
}

.dark\:border-c-primary-100:is(.dark *) {
    border-color: rgba(var(--primary), .1) !important
}

.dark\:border-c-primary-200:is(.dark *) {
    border-color: rgba(var(--primary), .2) !important
}

.dark\:border-c-primary-300:is(.dark *) {
    border-color: rgba(var(--primary), .3) !important
}

.dark\:border-c-primary-400:is(.dark *) {
    border-color: rgba(var(--primary), .4) !important
}

.dark\:border-c-primary-500:is(.dark *) {
    border-color: rgba(var(--primary), .5) !important
}

.dark\:border-c-primary-600:is(.dark *) {
    border-color: rgba(var(--primary), .6) !important
}

.dark\:border-c-primary-700:is(.dark *) {
    border-color: rgba(var(--primary), .7) !important
}

.dark\:border-c-primary-800:is(.dark *) {
    border-color: rgba(var(--primary), .8) !important
}

.dark\:border-c-primary-900:is(.dark *) {
    border-color: rgba(var(--primary), .9) !important
}

.dark\:border-gray-700:is(.dark *) {
    --tw-border-opacity: 1 !important;
    border-color: rgb(55 65 81/var(--tw-border-opacity)) !important
}

.dark\:border-neutral-700:is(.dark *) {
    --tw-border-opacity: 1 !important;
    border-color: rgb(64 64 64/var(--tw-border-opacity)) !important
}

.dark\:border-sky-500:is(.dark *) {
    --tw-border-opacity: 1 !important;
    border-color: rgb(14 165 233/var(--tw-border-opacity)) !important
}

.dark\:bg-c-primary-100:is(.dark *) {
    background-color: rgba(var(--primary), .1) !important
}

.dark\:bg-c-primary-200:is(.dark *) {
    background-color: rgba(var(--primary), .2) !important
}

.dark\:bg-c-primary-300:is(.dark *) {
    background-color: rgba(var(--primary), .3) !important
}

.dark\:bg-c-primary-400:is(.dark *) {
    background-color: rgba(var(--primary), .4) !important
}

.dark\:bg-c-primary-500:is(.dark *) {
    background-color: rgba(var(--primary), .5) !important
}

.dark\:bg-c-primary-600:is(.dark *) {
    background-color: rgba(var(--primary), .6) !important
}

.dark\:bg-c-primary-700:is(.dark *) {
    background-color: rgba(var(--primary), .7) !important
}

.dark\:bg-c-primary-800:is(.dark *) {
    background-color: rgba(var(--primary), .8) !important
}

.dark\:bg-c-primary-900:is(.dark *) {
    background-color: rgba(var(--primary), .9) !important
}

.dark\:bg-gray-300:is(.dark *) {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(209 213 219/var(--tw-bg-opacity)) !important
}

.dark\:bg-neutral-700:is(.dark *) {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(64 64 64/var(--tw-bg-opacity)) !important
}

.dark\:bg-neutral-800:is(.dark *) {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(38 38 38/var(--tw-bg-opacity)) !important
}

.dark\:bg-neutral-900:is(.dark *) {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(23 23 23/var(--tw-bg-opacity)) !important
}

.dark\:bg-sky-900:is(.dark *) {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(12 74 110/var(--tw-bg-opacity)) !important
}

.dark\:fill-gray-300:is(.dark *) {
    fill: #d1d5db !important
}

.dark\:text-c-primary:is(.dark *) {
    color: rgba(var(--primary)) !important
}

.dark\:text-gray-200:is(.dark *) {
    --tw-text-opacity: 1 !important;
    color: rgb(229 231 235/var(--tw-text-opacity)) !important
}

.dark\:text-gray-300:is(.dark *) {
    --tw-text-opacity: 1 !important;
    color: rgb(209 213 219/var(--tw-text-opacity)) !important
}

.dark\:text-gray-400:is(.dark *) {
    --tw-text-opacity: 1 !important;
    color: rgb(156 163 175/var(--tw-text-opacity)) !important
}

.dark\:text-gray-500:is(.dark *) {
    --tw-text-opacity: 1 !important;
    color: rgb(107 114 128/var(--tw-text-opacity)) !important
}

.dark\:text-neutral-300:is(.dark *) {
    --tw-text-opacity: 1 !important;
    color: rgb(212 212 212/var(--tw-text-opacity)) !important
}

.dark\:text-neutral-800:is(.dark *) {
    --tw-text-opacity: 1 !important;
    color: rgb(38 38 38/var(--tw-text-opacity)) !important
}

.dark\:text-white:is(.dark *) {
    --tw-text-opacity: 1 !important;
    color: hsl(var(--color-white)/var(--tw-text-opacity)) !important
}

.dark\:opacity-40:is(.dark *) {
    opacity: .4 !important
}

.dark\:invert:is(.dark *) {
    --tw-invert: invert(100%) !important;
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important
}

.dark\:after\:border-gray-200:is(.dark *):after,
.dark\:before\:border-gray-200:is(.dark *):before {
    content: var(--tw-content) !important;
    --tw-border-opacity: 1 !important;
    border-color: rgb(229 231 235/var(--tw-border-opacity)) !important
}

.dark\:hover\:bg-neutral-700:hover:is(.dark *) {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(64 64 64/var(--tw-bg-opacity)) !important
}

.dark\:hover\:text-neutral-100:hover:is(.dark *) {
    --tw-text-opacity: 1 !important;
    color: rgb(245 245 245/var(--tw-text-opacity)) !important
}

.dark\:focus\:ring-gray-600:focus:is(.dark *) {
    --tw-ring-opacity: 1 !important;
    --tw-ring-color: rgb(75 85 99/var(--tw-ring-opacity)) !important
}

.dark\:focus\:ring-gray-700:focus:is(.dark *) {
    --tw-ring-opacity: 1 !important;
    --tw-ring-color: rgb(55 65 81/var(--tw-ring-opacity)) !important
}

@media (min-width:320px) {
    .xs\:top-24 {
        top: 6rem !important
    }

    .xs\:order-2 {
        order: 2 !important
    }

    .xs\:order-first {
        order: -9999 !important
    }

    .xs\:mx-0 {
        margin-left: 0 !important;
        margin-right: 0 !important
    }

    .xs\:block {
        display: block !important
    }

    .xs\:h-screen-75 {
        height: 75vh !important
    }

    .xs\:w-full {
        width: 100% !important
    }

    .xs\:max-w-6xl {
        max-width: 72rem !important
    }

    .xs\:max-w-full {
        max-width: 100% !important
    }

    .xs\:max-w-screen-sm {
        max-width: 481px !important
    }

    .xs\:transform {
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important
    }

    .xs\:px-0 {
        padding-left: 0 !important;
        padding-right: 0 !important
    }

    .xs\:px-2 {
        padding-left: .5rem !important;
        padding-right: .5rem !important
    }

    .xs\:py-12 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important
    }

    .xs\:pt-3 {
        padding-top: .75rem !important
    }

    .xs\:text-3xl {
        font-size: 2.875rem !important
    }

    .xs\:text-\[3rem\] {
        font-size: 3rem !important
    }

    .xs\:text-\[5rem\] {
        font-size: 5rem !important
    }
}

@media (min-width:481px) {
    .sm\:-m-4 {
        margin: -1rem !important
    }

    .sm\:mt-10 {
        margin-top: 2.5rem !important
    }

    .sm\:h-screen-75 {
        height: 75vh !important
    }

    .sm\:space-y-4>:not([hidden])~:not([hidden]) {
        --tw-space-y-reverse: 0 !important;
        margin-top: calc(1rem*(1 - var(--tw-space-y-reverse))) !important;
        margin-bottom: calc(1rem*var(--tw-space-y-reverse)) !important
    }

    .sm\:space-y-8>:not([hidden])~:not([hidden]) {
        --tw-space-y-reverse: 0 !important;
        margin-top: calc(2rem*(1 - var(--tw-space-y-reverse))) !important;
        margin-bottom: calc(2rem*var(--tw-space-y-reverse)) !important
    }

    .sm\:px-0 {
        padding-left: 0 !important;
        padding-right: 0 !important
    }

    .sm\:px-6 {
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important
    }
}

@media (min-width:769px) {
    .md\:top-1\/4 {
        top: 25% !important
    }

    .md\:col-span-6 {
        grid-column: span 6/span 6 !important
    }

    .md\:my-24 {
        margin-top: 6rem !important
    }

    .md\:mb-24,
    .md\:my-24 {
        margin-bottom: 6rem !important
    }

    .md\:mr-16 {
        margin-right: 4rem !important
    }

    .md\:flex {
        display: flex !important
    }

    .md\:grid {
        display: grid !important
    }

    .md\:h-screen\/2 {
        height: 50vh !important
    }

    .md\:w-1\/2 {
        width: 50% !important
    }

    .md\:w-1\/3 {
        width: 33.333333% !important
    }

    .md\:w-2\/3 {
        width: 66.666667% !important
    }

    .md\:max-w-screen-lg {
        max-width: 993px !important
    }

    .md\:max-w-screen-xl {
        max-width: 1201px !important
    }

    .md\:translate-y-1\/4 {
        --tw-translate-y: 25% !important
    }

    .md\:transform,
    .md\:translate-y-1\/4 {
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important
    }

    .md\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important
    }

    .md\:items-center {
        align-items: center !important
    }

    .md\:gap-12 {
        gap: 3rem !important
    }

    .md\:gap-8 {
        gap: 2rem !important
    }

    .md\:space-y-0>:not([hidden])~:not([hidden]) {
        --tw-space-y-reverse: 0 !important;
        margin-top: calc(0px*(1 - var(--tw-space-y-reverse))) !important;
        margin-bottom: calc(0px*var(--tw-space-y-reverse)) !important
    }

    .md\:space-y-4>:not([hidden])~:not([hidden]) {
        --tw-space-y-reverse: 0 !important;
        margin-top: calc(1rem*(1 - var(--tw-space-y-reverse))) !important;
        margin-bottom: calc(1rem*var(--tw-space-y-reverse)) !important
    }

    .md\:px-0 {
        padding-left: 0 !important;
        padding-right: 0 !important
    }

    .md\:px-4 {
        padding-left: 1rem !important;
        padding-right: 1rem !important
    }

    .md\:py-3 {
        padding-top: .75rem !important;
        padding-bottom: .75rem !important
    }

    .md\:py-36 {
        padding-top: 9rem !important;
        padding-bottom: 9rem !important
    }

    .md\:pb-10 {
        padding-bottom: 2.5rem !important
    }

    .md\:pl-3 {
        padding-left: .75rem !important
    }

    .md\:pt-0 {
        padding-top: 0 !important
    }

    .md\:pt-20 {
        padding-top: 5rem !important
    }

    .md\:text-2xs {
        font-size: 1.5rem !important
    }

    .md\:text-3xl {
        font-size: 2.875rem !important
    }

    .md\:text-6xl {
        font-size: 5rem !important
    }

    .md\:leading-tight {
        line-height: 1.25 !important
    }
}

@media (min-width:993px) {
    .lg\:order-1 {
        order: 1 !important
    }

    .lg\:order-2 {
        order: 2 !important
    }

    .lg\:order-first {
        order: -9999 !important
    }

    .lg\:order-none {
        order: 0 !important
    }

    .lg\:col-span-3 {
        grid-column: span 3/span 3 !important
    }

    .lg\:col-span-4 {
        grid-column: span 4/span 4 !important
    }

    .lg\:col-span-5 {
        grid-column: span 5/span 5 !important
    }

    .lg\:col-span-6 {
        grid-column: span 6/span 6 !important
    }

    .lg\:col-span-7 {
        grid-column: span 7/span 7 !important
    }

    .lg\:col-span-8 {
        grid-column: span 8/span 8 !important
    }

    .lg\:col-span-9 {
        grid-column: span 9/span 9 !important
    }

    .lg\:m-3 {
        margin: .75rem !important
    }

    .lg\:mx-4 {
        margin-left: 1rem !important;
        margin-right: 1rem !important
    }

    .lg\:mx-auto {
        margin-left: auto !important;
        margin-right: auto !important
    }

    .lg\:my-24 {
        margin-top: 6rem !important;
        margin-bottom: 6rem !important
    }

    .lg\:my-32 {
        margin-top: 8rem !important;
        margin-bottom: 8rem !important
    }

    .lg\:my-48 {
        margin-top: 12rem !important;
        margin-bottom: 12rem !important
    }

    .lg\:mb-0 {
        margin-bottom: 0 !important
    }

    .lg\:mb-12 {
        margin-bottom: 3rem !important
    }

    .lg\:mb-2 {
        margin-bottom: .5rem !important
    }

    .lg\:mb-20 {
        margin-bottom: 5rem !important
    }

    .lg\:mb-3 {
        margin-bottom: .75rem !important
    }

    .lg\:mb-4 {
        margin-bottom: 1rem !important
    }

    .lg\:mb-5 {
        margin-bottom: 1.25rem !important
    }

    .lg\:mb-6 {
        margin-bottom: 1.5rem !important
    }

    .lg\:mb-8 {
        margin-bottom: 2rem !important
    }

    .lg\:ml-1 {
        margin-left: .25rem !important
    }

    .lg\:ml-1\.5 {
        margin-left: .375rem !important
    }

    .lg\:mr-0 {
        margin-right: 0 !important
    }

    .lg\:mr-1 {
        margin-right: .25rem !important
    }

    .lg\:mr-1\.5 {
        margin-right: .375rem !important
    }

    .lg\:mt-0 {
        margin-top: 0 !important
    }

    .lg\:mt-1 {
        margin-top: .25rem !important
    }

    .lg\:mt-1\.5 {
        margin-top: .375rem !important
    }

    .lg\:mt-12 {
        margin-top: 3rem !important
    }

    .lg\:mt-32 {
        margin-top: 8rem !important
    }

    .lg\:mt-5 {
        margin-top: 1.25rem !important
    }

    .lg\:inline-block {
        display: inline-block !important
    }

    .lg\:h-screen-75 {
        height: 75vh !important
    }

    .lg\:w-1\/3 {
        width: 33.333333% !important
    }

    .lg\:w-2\/3 {
        width: 66.666667% !important
    }

    .lg\:w-3\/4 {
        width: 75% !important
    }

    .lg\:w-4 {
        width: 1rem !important
    }

    .lg\:w-\[calc\(100\%_-_4rem\)\] {
        width: calc(100% - 4rem) !important
    }

    .lg\:max-w-\[83\.333333\%\] {
        max-width: 83.333333% !important
    }

    .lg\:max-w-lg {
        max-width: 32rem !important
    }

    .lg\:basis-10\/12 {
        flex-basis: 83.333333% !important
    }

    .lg\:basis-5\/12 {
        flex-basis: 41.666667% !important
    }

    .lg\:basis-6\/12 {
        flex-basis: 50% !important
    }

    .lg\:flex-row-reverse {
        flex-direction: row-reverse !important
    }

    .lg\:flex-col {
        flex-direction: column !important
    }

    .lg\:flex-col-reverse {
        flex-direction: column-reverse !important
    }

    .lg\:flex-nowrap {
        flex-wrap: nowrap !important
    }

    .lg\:items-start {
        align-items: flex-start !important
    }

    .lg\:items-center {
        align-items: center !important
    }

    .lg\:justify-center {
        justify-content: center !important
    }

    .lg\:gap-1 {
        gap: .25rem !important
    }

    .lg\:gap-1\.5 {
        gap: .375rem !important
    }

    .lg\:gap-12 {
        gap: 3rem !important
    }

    .lg\:gap-5 {
        gap: 1.25rem !important
    }

    .lg\:gap-8 {
        gap: 2rem !important
    }

    .lg\:p-12 {
        padding: 3rem !important
    }

    .lg\:p-8 {
        padding: 2rem !important
    }

    .lg\:px-0 {
        padding-left: 0 !important;
        padding-right: 0 !important
    }

    .lg\:px-1 {
        padding-left: .25rem !important;
        padding-right: .25rem !important
    }

    .lg\:px-24 {
        padding-left: 6rem !important;
        padding-right: 6rem !important
    }

    .lg\:px-5 {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important
    }

    .lg\:px-8 {
        padding-left: 2rem !important;
        padding-right: 2rem !important
    }

    .lg\:py-0 {
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .lg\:py-14 {
        padding-top: 3.5rem !important;
        padding-bottom: 3.5rem !important
    }

    .lg\:py-16 {
        padding-top: 4rem !important;
        padding-bottom: 4rem !important
    }

    .lg\:py-20 {
        padding-top: 5rem !important;
        padding-bottom: 5rem !important
    }

    .lg\:py-24 {
        padding-top: 6rem !important;
        padding-bottom: 6rem !important
    }

    .lg\:py-3 {
        padding-top: .75rem !important;
        padding-bottom: .75rem !important
    }

    .lg\:py-32 {
        padding-top: 8rem !important;
        padding-bottom: 8rem !important
    }

    .lg\:py-48 {
        padding-top: 12rem !important;
        padding-bottom: 12rem !important
    }

    .lg\:py-64 {
        padding-top: 16rem !important;
        padding-bottom: 16rem !important
    }

    .lg\:pb-12 {
        padding-bottom: 3rem !important
    }

    .lg\:pb-5 {
        padding-bottom: 1.25rem !important
    }

    .lg\:pl-24 {
        padding-left: 6rem !important
    }

    .lg\:pl-4 {
        padding-left: 1rem !important
    }

    .lg\:pr-8 {
        padding-right: 2rem !important
    }

    .lg\:pr-9 {
        padding-right: 2.25rem !important
    }

    .lg\:pr-10 {
        padding-right: 2.5rem !important
    }

    .lg\:pr-12 {
        padding-right: 3rem !important
    }

    .lg\:pr-14 {
        padding-right: 3.5rem !important
    }

    .lg\:pr-24 {
        padding-right: 6rem !important
    }

    .lg\:pt-64 {
        padding-top: 16rem !important
    }

    .lg\:pt-8 {
        padding-top: 2rem !important
    }

    .lg\:text-left {
        text-align: left !important
    }

    .lg\:text-2xl {
        font-size: 2.5rem !important
    }

    .lg\:text-3xl {
        font-size: 2.875rem !important
    }

    .lg\:text-6xl {
        font-size: 5rem !important
    }

    .lg\:text-\[7rem\] {
        font-size: 7rem !important
    }

    .lg\:text-\[8rem\] {
        font-size: 8rem !important
    }

    .lg\:text-base {
        font-size: 2rem !important
    }

    .lg\:text-sm {
        font-size: 1.875rem !important
    }
}

@media (min-width:1201px) {
    .xl\:col-span-4 {
        grid-column: span 4/span 4 !important
    }

    .xl\:col-span-8 {
        grid-column: span 8/span 8 !important
    }

    .xl\:ml-\[-5\.25em\] {
        margin-left: -5.25em !important
    }

    .xl\:mt-4 {
        margin-top: 1rem !important
    }

    .xl\:h-screen-75 {
        height: 75vh !important
    }

    .xl\:w-1\/3 {
        width: 33.333333% !important
    }

    .xl\:w-2\/4 {
        width: 50% !important
    }

    .xl\:w-2\/5 {
        width: 40% !important
    }

    .xl\:w-3\/5 {
        width: 60% !important
    }

    .xl\:w-\[calc\(100\%_\+_10\.5em\)\] {
        width: calc(100% + 10.5em) !important
    }

    .xl\:basis-7\/12 {
        flex-basis: 58.333333% !important
    }

    .xl\:gap-32 {
        gap: 8rem !important
    }

    .xl\:pl-6 {
        padding-left: 1.5rem !important
    }

    .xl\:pr-3 {
        padding-right: .75rem !important
    }
}