/* Shared Covenant type and spacing scale. Loaded after page-specific styles. */
:root {
  --font-family-base: Inter, Arial, Helvetica, sans-serif;
  --font-size-body: 16px;
  --font-size-card: 15px;
  --font-size-note: 12px;
  --font-size-label: 11px;
  --font-size-h1: clamp(32px, 4vw, 48px);
  --font-size-h2: clamp(28px, 3vw, 42px);
  --font-size-h3: 20px;
  --line-height-body: 1.6;
  --line-height-h1: 1.12;
  --line-height-h2: 1.16;
  --line-height-h3: 1.25;
  --tracking-display: -.045em;
  --tracking-heading: -.025em;
  --space-text: 16px;
  --space-card: 22px;
  --space-grid: 22px;
  --space-content: 30px;
  --space-section: 105px;
  --space-section-heading: 55px;
  --space-section-lead: 22px;
  --space-page-gutter: 80px;
}

body {
  font-family: var(--font-family-base);
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

:root body main :is(.container, .wrap) {
  width: min(1320px, calc(100% - var(--space-page-gutter)));
  margin-inline: auto;
}

:root body .request-close {
  font-family: var(--font-family-base);
}

:root body main h1 {
  font-size: var(--font-size-h1);
  font-weight: 600;
  line-height: var(--line-height-h1);
  letter-spacing: var(--tracking-display);
}

:root body :is(main, .preliminary-request) h2,
#services .service-development-heading h2 {
  font-size: var(--font-size-h2);
  font-weight: 500;
  line-height: var(--line-height-h2);
  letter-spacing: var(--tracking-display);
}

:root body main h3,
:root body main :is(.catalog-card, .variant-card, .product-card, .aside-card) h3 {
  font-size: var(--font-size-h3);
  font-weight: 600;
  line-height: var(--line-height-h3);
  letter-spacing: var(--tracking-heading);
}

:root body main :is(.service-development-steps, .category-inputs) h3 {
  text-transform: none;
}

:root body main p,
:root body main :is(.category-prose, .category-request, .variant-details, .variants-cta, .variants-materials) p,
#services .service-offer-line {
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

:root body main :is(.category-prose, .variant-details) li {
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

:root body main :is(.catalog-card, .variant-card, .product-card, .aside-card) p,
:root body main .category-related .catalog-card p {
  font-size: var(--font-size-card);
  line-height: var(--line-height-body);
}

:root body main .eyebrow {
  font-size: var(--font-size-label);
  font-weight: 600;
  line-height: var(--line-height-body);
  letter-spacing: .14em;
  margin-bottom: 28px;
}

:root body main :is(.hero-note, .category-request-note, .mini-note),
:root body :is(.footer, .site-footer) p {
  font-size: var(--font-size-note);
  line-height: var(--line-height-body);
}

:root body main .section,
#services.service-development {
  padding-block: var(--space-section);
}

:root body main .section-intro {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  text-align: left;
  margin-bottom: var(--space-section-heading);
}

:root body main .category-overview .section-intro {
  margin-bottom: 0;
}

:root body main :is(.section-lead, .category-lead, .hero-description) {
  margin-top: var(--space-section-lead);
}

:root body main :is(.catalog-grid, .variants-grid, .category-inputs, .form-layout) {
  gap: var(--space-grid);
}

:root body main :is(.catalog-card-copy, .variant-card-body, .product-card, .form-card, .aside-card) {
  padding: var(--space-card);
}

:root body main :is(.variant-card, .product-card, .aside-card) h3 {
  margin-block: 0;
}

:root body main :is(.variant-card, .product-card, .aside-card) p {
  margin-block: var(--space-text) 24px;
}

:root body main .catalog-card h3 {
  margin-bottom: var(--space-text);
}

:root body main .catalog-card p {
  margin: 0;
  padding-right: 43px;
}

:root body main .catalog-card-arrow {
  right: var(--space-card);
  bottom: var(--space-card);
}

:root body main .category-prose p + p {
  margin-top: var(--space-text);
}

:root body main :is(.button, .secondary-link, .text-link, .variant-more, .filter-btn),
:root body .preliminary-request .request-submit {
  font-family: var(--font-family-base);
  font-size: var(--font-size-card);
  font-weight: 600;
  line-height: 1.4;
}

:root body .preliminary-request {
  font-family: var(--font-family-base);
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

:root body .preliminary-request :is(input, select, textarea, button) {
  font: inherit;
}

:root body .preliminary-request :is(input:not([type=checkbox]), select, textarea) {
  font-size: var(--font-size-body);
  line-height: 1.4;
}

:root body .preliminary-request label,
:root body .preliminary-request :is(.request-intro, .request-status) {
  font-size: var(--font-size-card);
  line-height: var(--line-height-body);
}

:root body .preliminary-request :is(.request-unavailable, .request-consent) {
  font-size: 14px;
  line-height: var(--line-height-body);
}

:root body .preliminary-request .request-submit {
  font-weight: 600;
}

:root body main .page-hero.compact {
  padding-block: 60px;
}

:root body main .page-hero h1 {
  max-width: 900px;
}

:root body main .catalog-item dl {
  font-size: var(--font-size-card);
  line-height: var(--line-height-body);
}

@media (max-width: 1150px) {
  :root {
    --space-section: 80px;
    --space-page-gutter: 48px;
  }
}

@media (max-width: 680px) {
  :root {
    --font-size-h1: 32px;
    --font-size-h2: 28px;
    --space-section: 60px;
    --space-section-heading: 35px;
    --space-section-lead: 18px;
    --space-page-gutter: 40px;
  }

  :root body main .section-intro {
    row-gap: 0;
  }

  :root body main .page-hero.compact {
    padding-block: 40px;
  }

  :root body main .catalog-card {
    aspect-ratio: auto;
    min-height: 360px;
  }

  :root body main .catalog-card h3 {
    overflow-wrap: anywhere;
  }
}

/* Equivalent text roles in sections that use summary/span markup. */
:root body main .material-name {
  font-size: var(--font-size-h3);
  font-weight: 600;
  line-height: var(--line-height-h3);
  letter-spacing: var(--tracking-heading);
}

:root body main .material-description {
  font-size: var(--font-size-card);
  line-height: var(--line-height-body);
}

:root body main .details-content {
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
  padding-bottom: var(--space-card);
}

:root body main .material-grid {
  gap: var(--space-grid);
  margin-top: var(--space-section-heading);
}

:root body main .material-grid summary {
  gap: var(--space-text);
  padding-block: var(--space-card);
}

:root body main .category-related-heading {
  gap: var(--space-content);
  margin-bottom: var(--space-section-heading);
}

#services .service-development-heading {
  margin-bottom: var(--space-section-heading);
}
/* Alternate full-width section surfaces using the active palette. */
:root body main .section-tone-light {
  background: var(--white);
}

:root body main .section-tone-soft {
  background: var(--soft);
}

/* A compact transition from object photographs to construction variants. */
:root body main #solutions {
  padding-bottom: calc(var(--space-section) / 2);
}

:root body main :is(#solutions, #variants, #services, #why-us) {
  padding-top: calc(var(--space-section) / 3);
}

/* Section introductions follow the same left-aligned label/title/description order. */
:root body main .eyebrow,
:root[data-palette] body main .eyebrow,
#services.services-overview .eyebrow {
  color: var(--orange, var(--accent));
}

:root body main .materials-heading {
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-section-lead);
  text-align: left;
}

:root body :is(.button[data-request-open], .nav-cta[data-request-open], .preliminary-request .request-submit) {
  border-radius: 10px;
}