@import url('./interaction.css');
/* @bulk:start web-kit/styles/foundation library Foundation And Website Shell Styles */
.wk-button { min-block-size: 2.8rem; padding-inline: 1.15rem; border: 0; border-radius: var(--wk-radius-md); display: inline-flex; align-items: center; justify-content: center; gap: var(--wk-space-2); font: inherit; font-weight: 800; cursor: pointer; transition: transform var(--wk-motion-fast), box-shadow var(--wk-motion-fast), background var(--wk-motion-fast); }
.wk-button[data-size="sm"] { min-block-size: 2.35rem; padding-inline: .9rem; font-size: .84rem; }
.wk-button[data-size="lg"] { min-block-size: 3.35rem; padding-inline: 1.45rem; }
.wk-button[data-variant="filled"] { color: var(--wk-on-primary); background: linear-gradient(135deg, var(--wk-primary), color-mix(in srgb, var(--wk-primary) 58%, var(--wk-accent))); box-shadow: 0 .8rem 2.6rem color-mix(in srgb, var(--wk-primary) 28%, transparent); }
.wk-button[data-variant="outline"] { color: var(--wk-text); background: var(--wk-glass); border: 1px solid var(--wk-outline); backdrop-filter: blur(1rem); }
.wk-button[data-variant="ghost"] { color: var(--wk-text); background: transparent; }
.wk-button:hover:not(:disabled) { transform: translateY(-2px); box-shadow: var(--wk-shadow-sm); }
.wk-button:focus-visible, .wk-controls__button:focus-visible, .wk-header__menu:focus-visible { outline: 3px solid color-mix(in srgb, var(--wk-accent) 65%, transparent); outline-offset: 3px; }
.wk-button:disabled { opacity: .46; cursor: not-allowed; }
.wk-button__spinner { inline-size: 1rem; block-size: 1rem; border: 2px solid color-mix(in srgb, currentColor 28%, transparent); border-block-start-color: currentColor; border-radius: 50%; animation: wk-spin .8s linear infinite; }
.wk-badge { inline-size: fit-content; padding: .4rem .72rem; border-radius: 999px; background: var(--wk-surface-2); color: var(--wk-muted); font-size: .72rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.wk-badge[data-tone="accent"] { color: var(--wk-highlight); background: color-mix(in srgb, var(--wk-highlight) 10%, transparent); }
.wk-skeleton { min-block-size: 1rem; border-radius: var(--wk-radius-sm); background: linear-gradient(110deg, var(--wk-surface) 8%, var(--wk-surface-2) 18%, var(--wk-surface) 33%); background-size: 200% 100%; animation: wk-shimmer 1.4s linear infinite; }
.wk-skeleton[data-variant="image"] { aspect-ratio: 4/5; }
.wk-skeleton[data-variant="product-card"] { min-block-size: 28rem; border-radius: var(--wk-radius-lg); }
.wk-state { min-block-size: 14rem; padding: var(--wk-space-8); border-radius: var(--wk-radius-lg); display: grid; place-items: center; align-content: center; gap: var(--wk-space-3); text-align: center; background: var(--wk-surface); border: 1px solid var(--wk-outline); }
.wk-state__title, .wk-state__body { margin: 0; }.wk-state__body { color: var(--wk-muted); }
.wk-controls { padding: .35rem; border: 1px solid var(--wk-outline); border-radius: 999px; display: inline-flex; gap: .2rem; background: var(--wk-glass); backdrop-filter: blur(1.4rem); box-shadow: var(--wk-shadow-sm); }
.wk-controls__button { inline-size: 2.45rem; block-size: 2.45rem; border: 0; border-radius: 50%; background: transparent; color: var(--wk-text); font: inherit; font-weight: 850; cursor: pointer; }
.wk-controls__button:hover { background: var(--wk-surface-2); }
.wk-header { position: sticky; inset-block-start: 0; z-index: 40; border-block-end: 1px solid var(--wk-outline); background: var(--wk-glass); backdrop-filter: blur(1.3rem) saturate(1.4); }
.wk-header__inner { max-inline-size: var(--wk-content-max); min-block-size: 4.7rem; margin-inline: auto; padding-inline: var(--wk-gutter); display: flex; align-items: center; gap: var(--wk-space-8); }
.wk-header__brand { flex: 0 0 auto; font-size: 1.2rem; font-weight: 950; letter-spacing: -.04em; }.wk-header__logo { max-block-size: 2.3rem; inline-size: auto; }
.wk-header__nav { display: flex; align-items: center; gap: var(--wk-space-6); margin-inline: auto; }.wk-header__link { color: var(--wk-muted); font-size: .9rem; font-weight: 700; transition: color var(--wk-motion-fast); }.wk-header__link:hover, .wk-header__link[aria-current="page"] { color: var(--wk-text); }
.wk-header__actions { display: flex; align-items: center; gap: var(--wk-space-3); }.wk-header__menu { display: none; inline-size: 2.8rem; block-size: 2.8rem; border: 1px solid var(--wk-outline); border-radius: var(--wk-radius-md); background: var(--wk-surface); color: var(--wk-text); }
.wk-footer { position: relative; overflow: hidden; border-block-start: 1px solid var(--wk-outline); background: color-mix(in srgb, var(--wk-surface) 82%, var(--wk-bg)); }.wk-footer__glow { position: absolute; inline-size: 35rem; block-size: 35rem; inset-block-start: -24rem; inset-inline-start: 8%; border-radius: 50%; background: color-mix(in srgb, var(--wk-primary) 22%, transparent); filter: blur(5rem); }
.wk-footer__inner { position: relative; max-inline-size: var(--wk-content-max); margin-inline: auto; padding: var(--wk-section-y) var(--wk-gutter) var(--wk-space-8); display: grid; grid-template-columns: 1.2fr 2fr; gap: var(--wk-space-12); }.wk-footer__lead { max-inline-size: 28rem; color: var(--wk-muted); }.wk-footer__columns { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--wk-space-8); }.wk-footer__column { display: grid; align-content: start; gap: var(--wk-space-3); }.wk-footer__title { margin: 0 0 var(--wk-space-2); font-size: .78rem; color: var(--wk-muted); text-transform: uppercase; letter-spacing: .13em; }.wk-footer__legal { grid-column: 1/-1; padding-block-start: var(--wk-space-8); border-block-start: 1px solid var(--wk-outline); display: flex; justify-content: space-between; gap: var(--wk-space-4); color: var(--wk-muted); font-size: .82rem; }.wk-footer__socials { display: flex; gap: var(--wk-space-4); }
@keyframes wk-spin { to { transform: rotate(1turn); } } @keyframes wk-shimmer { to { background-position-x: -200%; } }
@media (max-width: 850px) { .wk-header__nav, .wk-header__actions > .wk-button { display: none; }.wk-header__actions { margin-inline-start: auto; }.wk-header__menu { display: grid; place-items: center; }.wk-footer__inner { grid-template-columns: 1fr; }.wk-footer__columns { grid-template-columns: repeat(2,1fr); }.wk-footer__legal { grid-column: 1; flex-direction: column; } }
@media (prefers-reduced-motion: reduce) { .wk-button, .wk-skeleton, .wk-button__spinner { animation: none; transition: none; } }
.wk-header__nav > div, .wk-footer__columns > div, .wk-footer__socials > div { display: contents; }
/* @bulk:end */
