*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--color-background);
  color: var(--color-text);
  font-family: var(--font-sans);
  padding-inline: 0;
  overflow-wrap: break-word;
  text-rendering: optimizelegibility;
  line-height: 1.65;
}

body,
.wp-site-blocks {
  min-height: 100vh;
}

.wp-site-blocks {
  display: flex;
  flex-direction: column;
}

.wp-site-blocks > main {
  flex: 1 0 auto;
}

.wp-site-blocks > main.store-main--home {
  margin-block-start: 0;
}

.wp-site-blocks > main:not(.store-main--home) {
  padding-inline: var(--gutter);
}

img,
svg {
  display: block;
}

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

a {
  color: var(--color-brand-deep);
  text-decoration-thickness: 0.075em;
  text-underline-offset: 0.2em;
}

a:hover {
  text-decoration-thickness: 0.12em;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  border-radius: var(--radius-sm);
  outline: 0.2rem solid var(--color-focus);
  outline-offset: 0.2rem;
}

:where(h1, h2, h3) {
  color: var(--color-text);
  font-family: var(--font-serif);
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 1.08;
  text-wrap: balance;
}

h1 {
  font-size: var(--text-h1);
}

h2 {
  font-size: var(--text-h2);
}

h3 {
  font-size: var(--text-h3);
}

p {
  text-wrap: pretty;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
input[type="button"],
input[type="submit"],
.button,
.wp-element-button {
  align-items: center;
  border: 0;
  cursor: pointer;
  display: inline-flex;
  font-weight: 700;
  justify-content: center;
  min-height: 2.875rem;
  transition:
    background-color var(--transition-fast),
    border-color var(--transition-fast),
    color var(--transition-fast),
    transform var(--transition-fast);
}

:where(
  button,
  input[type="button"],
  input[type="submit"],
  .button,
  .wp-element-button
):active {
  transform: translateY(0.08rem);
}

:where(
  button,
  input[type="button"],
  input[type="submit"],
  .button,
  .wp-element-button
):disabled,
:where(button, .button, .wp-element-button)[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.55;
}

:where(input:not([type="checkbox"], [type="radio"]), select, textarea) {
  appearance: none;
  background: var(--color-surface);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  color: var(--color-text);
  min-height: 3rem;
  padding: 0.7rem 0.9rem;
  width: 100%;
}

:where(input, select, textarea):hover:not(:disabled) {
  border-color: var(--color-brand-strong);
}

:where(input, select, textarea):disabled {
  background: var(--color-brand-mist);
  color: var(--color-text-muted);
  cursor: not-allowed;
}

textarea {
  min-height: 8rem;
  resize: vertical;
}

label {
  color: var(--color-text);
  display: inline-block;
  font-size: var(--text-sm);
  font-weight: 700;
  margin-block-end: var(--space-2);
}

.required {
  color: var(--color-error);
}

.screen-reader-text:focus,
.skip-link:focus {
  background: var(--color-text);
  border-radius: 0 0 var(--radius-md) 0;
  color: var(--color-surface);
  font-weight: 700;
  inset: 0 auto auto 0;
  padding: var(--space-3) var(--space-4);
  position: fixed;
  z-index: 100000;
}

.store-container {
  margin-inline: auto;
  max-width: calc(var(--container-wide) + (2 * var(--gutter)));
  padding-inline: var(--gutter);
  width: 100%;
}

.store-main:not(
  .store-main--home,
  .store-main--content-page,
  .store-main--archive,
  .store-main--product
) {
  padding-block: clamp(2.25rem, 5vw, 4.5rem);
}

.store-narrow-prose {
  margin-inline: auto;
  max-width: var(--container-prose);
}

.store-page-hero {
  background: var(--color-brand-mist);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: clamp(2rem, 5vw, 4.5rem);
}

.store-page-heading {
  max-width: 49rem;
  padding: 0;
}

.store-page-heading > .store-eyebrow,
.store-about-intro > .store-eyebrow {
  margin-block-end: var(--space-page-eyebrow-title);
}

.store-page-heading h1 {
  font-size: var(--text-page-title);
  margin-block: 0 var(--space-page-title-intro);
  max-width: 15ch;
}

.store-page-heading__intro,
.store-page-heading > :is(.page-description, .term-description) {
  color: var(--color-text-muted);
  font-size: var(--text-lead);
  line-height: 1.7;
  margin: 0;
  max-width: 42rem;
}

.store-page-heading > :is(.page-description, .term-description) > :first-child {
  margin-block-start: 0;
}

.store-page-heading > :is(.page-description, .term-description) > :last-child {
  margin-block-end: 0;
}

.store-page-hero > :last-child,
.store-callout > :last-child {
  margin-block-end: 0;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}