@import url("https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600&display=swap");

:root {
  --font-ui: "Rubik", Arial, sans-serif;
  --space-unit: 8px;
  --space-1: var(--space-unit);
  --space-2: calc(var(--space-unit) * 2);
  --space-3: calc(var(--space-unit) * 3);
  --space-4: calc(var(--space-unit) * 4);
  --space-6: calc(var(--space-unit) * 6);
  --space-8: calc(var(--space-unit) * 8);
}

body,
body *,
button,
input,
textarea,
select,
a,
p,
h1,
h2,
h3,
span,
label,
li,
summary {
  font-family: var(--font-ui) !important;
  letter-spacing: 0;
}

/* Interface labels use one consistent uppercase treatment; reading text stays soft and lowercase. */
body { text-transform: uppercase; }
.info-copy,
.legal-main p,
.legal-main li,
.product-description,
.product-info,
.contact-copy,
.checkout-form label,
.checkout-status,
.empty-cart,
.cart-line,
.fragile-hint,
.break-hint,
.menu-panel-social { text-transform: lowercase; }
.brand,
.product-card,
.product-meta,
.category-nav,
.material-choice,
.model-reset,
.site-footer,
.cart-panel,
.legal-header,
.legal-footer,
.loader-meta,
.page-loader { text-transform: uppercase; }

.legal-main p + p,
.product-info p + p,
.info-section p + p {
  margin-top: 0;
}

.legal-main p,
.product-info p,
.info-section p {
  margin-bottom: var(--space-1);
}

.legal-main p,
.legal-main li,
.product-description p,
.product-info details p,
.info-copy {
  line-height: 1.6;
}

.legal-main h2 {
  margin-top: var(--space-6);
  margin-bottom: var(--space-2);
}

.legal-main .legal-kicker {
  margin-bottom: var(--space-3);
}

.product-meta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40px;
  grid-template-rows: auto auto;
  align-items: center;
  gap: 0 var(--space-2);
  padding-top: var(--space-2);
}

.product-meta h2 {
  grid-column: 1;
  grid-row: 1;
  max-width: none;
}

.product-meta > span {
  grid-column: 1;
  grid-row: 2;
  margin-top: var(--space-1);
}

.product-meta .add-product {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  font: 300 28px/1 'DM Mono', monospace;
  letter-spacing: 0;
  opacity: 1;
  cursor: pointer;
}

.product-meta .add-product:hover,
.product-meta .add-product:focus-visible {
  opacity: 1;
  background: var(--paper);
}

.product-meta .add-product:focus-visible {
  outline: 1px solid var(--ink);
  outline-offset: 2px;
}

.product-meta .add-product:disabled {
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: not-allowed;
  opacity: .45;
}

.about-summary {
  gap: var(--space-4);
}

.info-section .eyebrow {
  margin-bottom: var(--space-3);
}

.site-footer .legal-links {
  row-gap: var(--space-1);
}

.site-footer .info-copyright {
  margin-top: var(--space-2);
}

.product-description p {
  margin-bottom: var(--space-1);
}

@media (max-width: 700px) {
  .product-grid {
    row-gap: var(--space-6);
  }

  .product-meta span {
    margin-top: var(--space-1);
  }

  .about-summary {
    gap: var(--space-2);
  }

  .legal-main ul {
    margin-bottom: var(--space-2);
  }
}
