/*
 * Atelier: the Theme Kit in Atelier's own look. Linked after themes/_shared/assets/css/kit.css, so the variables set
 * here replace its defaults for every block and module section.
 *
 * Square corners and no shadows; fine hairlines instead of boxes; buttons and labels in small, widely spaced capitals;
 * fields that are a line underneath; headings in the display face at its lightest weight (--atelier-heading-weight,
 * set by the layout from the font palette); generous space between sections and slow, quiet motion.
 */

.kit-root {
  --kit-radius: 0;
  --kit-radius-sm: 0;
  --kit-media-radius: 0;
  --kit-button-radius: 0;
  --kit-input-radius: 0;
  --kit-chip-radius: 0;
  --kit-shadow: none;
  --kit-shadow-hover: none;
  --kit-heading-weight: var(--atelier-heading-weight, 500);
  --kit-heading-tracking: -0.015em;
  --kit-button-weight: 500;
  --kit-button-tracking: 0.18em;
  --kit-button-transform: uppercase;
  --kit-eyebrow-tracking: 0.24em;
  --kit-star: var(--accent, #7a5f3b);
  --kit-card-pad: clamp(1.5rem, 2.6vw, 2.25rem);
  --kit-gap-medium: 1.5rem;
  --kit-gap-large: clamp(2.5rem, 5vw, 4rem);
  --kit-gutter: var(--atelier-gutter, clamp(1.25rem, 4vw, 3.5rem));
  --kit-width-normal: 76rem;
  --kit-width-narrow: 42rem;
  --kit-width-wide: 92rem;
  --kit-pad-normal: clamp(4.5rem, 9vw, 8rem);
  --kit-pad-compact: clamp(2.5rem, 5vw, 4rem);
  --kit-pad-spacious: clamp(5rem, 9vw, 8.5rem);
  --kit-speed: 420ms;
  --kit-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Large, light headings with a calm measure. */
.kit-heading {
  line-height: 1.1;
  text-wrap: balance;
}

.kit-heading--1 {
  font-size: clamp(2.75rem, 1.6rem + 4.4vw, 5.25rem);
  line-height: 1.02;
}

.kit-heading--2 {
  font-size: clamp(2.1rem, 1.45rem + 2.6vw, 3.6rem);
  line-height: 1.06;
}

.kit-heading--3 {
  font-size: clamp(1.35rem, 1.1rem + 0.9vw, 1.8rem);
  line-height: 1.2;
}

/* Small capitals after a short line. */
.kit-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.9rem;
  font-size: 0.68rem;
  font-weight: 500;
}

.kit-eyebrow::before {
  content: "";
  flex: none;
  width: 1.75rem;
  height: 1px;
  background: currentColor;
  opacity: 0.7;
}

/* Square buttons in small capitals: solid ink, or a hairline outline that fills on hover. */
.kit-button {
  min-height: 3rem;
  padding: 0.85rem 1.9rem;
  font-size: 0.72rem;
  line-height: 1.3;
}

.kit-button--small {
  min-height: 2.5rem;
  padding: 0.55rem 1.2rem;
  font-size: 0.66rem;
}

.kit-button--secondary {
  border-color: var(--kit-line-strong);
  background: transparent;
  color: var(--kit-text);
}

.kit-button--secondary:hover {
  border-color: var(--kit-primary);
  background: var(--kit-primary);
  color: var(--kit-on-primary);
}

.kit-button--ghost {
  padding-inline: 0;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.45em;
}

.kit-link {
  text-decoration-thickness: 1px;
  text-underline-offset: 0.3em;
}

/* Cards are open: a hairline, no shadow, no lift. Pictures settle slowly on hover. */
.kit-card--surface {
  border: 1px solid var(--kit-line);
  box-shadow: none;
}

.kit-card--outline {
  border-color: var(--kit-line);
}

.kit-card--linked:hover {
  transform: none;
  box-shadow: none;
}

.kit-card__media img {
  transition: transform 1100ms var(--kit-ease);
}

.kit-card--linked:hover .kit-card__media img {
  transform: scale(1.03);
}

.kit-card__title {
  font-family: var(--font-heading, serif);
  font-weight: var(--kit-heading-weight);
  letter-spacing: -0.01em;
}

.kit-card__eyebrow,
.kit-card__meta {
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

/* Fields are a line underneath, with small capital labels. */
.kit-input {
  min-height: 3rem;
  padding-inline: 0;
  border-width: 0 0 1px;
  border-color: var(--kit-line-strong);
  background-color: transparent;
}

.kit-textarea {
  padding-top: 0.75rem;
}

.kit-select {
  padding-inline: 0 2.5rem;
}

.kit-input:focus {
  border-color: var(--kit-text);
}

.kit-input:focus-visible {
  outline: 0;
  box-shadow: 0 1px 0 0 var(--kit-focus);
}

.kit-field__label {
  color: var(--kit-muted);
  font-size: 0.66rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

/* Quotes in the display face; questions and answers separated by hairlines. */
.kit-quote__text {
  font-family: var(--font-heading, serif);
  font-size: clamp(1.3rem, 1rem + 1vw, 1.7rem);
  font-weight: var(--kit-heading-weight);
  line-height: 1.45;
}

.kit-quote {
  padding-inline-start: 1.5rem;
  border-inline-start-width: 1px;
}

.kit-quote__author {
  margin-top: 1.25rem;
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.kit-quote__role {
  margin-top: 0.3rem;
  font-size: 0.85rem;
  letter-spacing: 0.01em;
  text-transform: none;
}

.kit-carousel__button {
  border-radius: 0;
}

.kit-accordion__item {
  border-width: 0 0 1px;
  border-color: var(--kit-line);
  background: none;
}

.kit-accordion__title {
  font-family: var(--font-heading, serif);
  font-size: clamp(1.15rem, 1rem + 0.5vw, 1.4rem);
  font-weight: var(--kit-heading-weight);
}

/* Numbers and prices in the display face. */
.kit-output--large,
.kit-price__amount,
.kit-summary__amount {
  font-family: var(--font-heading, serif);
  font-weight: var(--kit-heading-weight);
  letter-spacing: -0.02em;
}

.kit-rich-text blockquote {
  margin-inline: 0;
  padding-left: 1.5rem;
  border-left: 1px solid var(--kit-accent);
  font-family: var(--font-heading, serif);
  font-size: 1.35em;
  line-height: 1.5;
}

.kit-rich-text hr {
  width: min(6rem, 30%);
  margin-inline: auto;
  border: 0;
  border-top: 1px solid var(--kit-line-strong);
}

.kit-badge,
.kit-chip {
  font-size: 0.64rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.kit-pagination__prev,
.kit-pagination__next,
.kit-pagination__status,
.kit-breadcrumbs {
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.kit-dialog,
.kit-drawer--right.is-ready,
.kit-drawer--bottom.is-ready {
  box-shadow: 0 40px 100px -40px rgb(0 0 0 / 0.35);
}