@font-face { font-family: 'Chakra Petch'; font-style: italic; font-weight: 700; font-display: swap; src: url('../assets/fonts/chakra-petch-bold-italic.woff2') format('woff2'); }
@font-face { font-family: 'Chakra Petch'; font-style: normal; font-weight: 700; font-display: swap; src: url('../assets/fonts/chakra-petch-bold.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('../assets/fonts/inter-regular.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url('../assets/fonts/inter-medium.woff2') format('woff2'); }

html { background: var(--color-background); scroll-padding-top: calc(var(--header-height) + 16px); }
body { color: var(--color-white); background: var(--color-background); font: 400 16px/1.6 var(--font-body); -webkit-font-smoothing: antialiased; }
::selection { background: var(--color-primary); color: var(--color-white); }
:focus-visible { outline: 2px solid var(--color-white); outline-offset: 5px; }
.container { max-width: var(--container-width); padding-inline: var(--page-gutter); margin-inline: auto; }
.icon { width: 20px; height: 20px; flex: 0 0 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.eyebrow { font-size: 11px; font-weight: 500; line-height: 1.8; letter-spacing: .15em; text-transform: uppercase; }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 52px; padding: 14px 21px; border-radius: var(--radius); font-size: 13px; font-weight: 500; line-height: 1.4; cursor: pointer; transition: background-color var(--transition), color var(--transition), border-color var(--transition); }
.button .icon { transition: transform var(--transition); }
.button:not([aria-disabled]):hover .icon { transform: translate(2px, -2px); }
.button--primary { background: var(--color-primary); color: var(--color-white); }
.button--primary:hover { background: var(--color-primary-hover); }
.button--primary:active { background: #af0410; }
.button--text { padding-inline: 0; border-bottom: 1px solid var(--color-border); border-radius: 0; }
[aria-disabled='true'] { cursor: default; }
.button--text[aria-disabled='true'] { color: var(--color-steel); }
.skip-link { position: fixed; z-index: var(--layer-skip); top: 12px; left: 12px; padding: 12px 20px; background: var(--color-white); color: var(--color-background); border-radius: var(--radius); transform: translateY(-180%); }
.skip-link:focus { transform: translateY(0); }