:root {
  --p-bg: #efe9e0; --p-surface: #e2d9cb; --p-ink: #22261f; --p-muted: #5a5c53;
  --p-accent: #2e5b44; --p-accent-ink: #ffffff; --p-action: #2e5b44; --p-action-ink: #ffffff;
  --p-inv-bg: #22261f; --p-inv-surface: #2e322a; --p-inv-ink: #efe9e0; --p-inv-muted: #a19e96;
  --p-inv-accent: #efe9e0; --p-inv-accent-ink: #22261f; --p-inv-action: #efe9e0; --p-inv-action-ink: #22261f;
  --font-display: "Rethink Sans", system-ui, sans-serif;
  --font-text: "Rethink Sans", system-ui, sans-serif;
  --display-weight: 400;
  --display-tracking: -0.025em;
  --display-tracking-xl: -0.035em;
}
/* sections size to their content (multi-page site; no screen grid) */
html main > section.section, html footer.closing { height: auto !important; min-height: 0 !important; }
html main > section.section > .wrap, html footer.closing > .wrap { height: auto !important; }

.page-intro { padding-top: calc(var(--nav, 72px) + 64px); }
.page-title { font: var(--display-weight) clamp(38px, 4.2vw + 12px, 68px)/1.04 var(--font-display); letter-spacing: var(--display-tracking-xl); margin: 0 0 var(--s-5); max-width: 20ch; }
.lead { font-size: var(--t-lead); line-height: 1.5; max-width: 52ch; margin: 0; }
.jump { list-style: none; padding: 0; margin: var(--s-6) 0 0; display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-6); }

.ph { margin: 0; border-radius: var(--r-lg); overflow: hidden; background: var(--surface); }
.ph > img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.ph--paper { background: #fbf8f2; border: 1px solid var(--line, rgba(34,38,31,.14)); }
.ph--paper > img { object-fit: contain; }
.span-5 > .ph { margin-top: var(--s-6); }
.drawing-wide { margin-bottom: var(--s-7); max-width: 940px; }

.cards3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); }
.svc { display: flex; flex-direction: column; gap: var(--s-3); color: inherit; text-decoration: none; transition: transform .25s ease; }
.svc h3 { margin: var(--s-3) 0 0; font-size: var(--t-card, 20px); font-weight: 500; }
.svc p { margin: 0; }
.svc__more { margin-top: auto; padding-top: var(--s-2); color: var(--action); font-weight: 500; display: inline-flex; gap: 8px; align-items: center; }
.svc__more .m-arrow { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.svc:hover { transform: translateY(-2px); }
.svc:hover .ph > img { transform: scale(1.03); }
.svc:hover .ph--paper > img { transform: none; }

.steps4 { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-5); }
.steps4 li { display: flex; flex-direction: column; gap: var(--s-3); }
.steps4 h3 { margin: 0; font-size: var(--t-card, 20px); font-weight: 500; }
.steps4 p { margin: 0; }
.steps4 .step-num { margin-top: var(--s-2); }

.cols4, .cols3 { display: grid; gap: var(--s-6); }
.cols4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cols3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cols4 h3, .cols3 h3 { margin: 0 0 var(--s-2); font-size: 18px; font-weight: 500; }
.cols4 p, .cols3 p { margin: 0; }
.notes { margin-top: var(--s-7); }

.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.spec { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 16px; line-height: 1.45; }
.spec th, .spec td { text-align: left; vertical-align: top; padding: 14px 16px 14px 0; border-bottom: 1px solid rgba(34,38,31,.16); }
.spec thead th { font-size: 13px; font-weight: 500; color: var(--muted); }
.spec tbody th { font-weight: 500; width: 17%; min-width: 9em; }
.tag { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 500; border: 1px solid rgba(34,38,31,.25); white-space: nowrap; }
.tag--on { background: var(--action); color: var(--action-ink, #fff); border-color: transparent; }

.develop { margin: 0; border-radius: var(--r-lg); overflow: hidden; aspect-ratio: 3 / 2; }
.develop > img { display: block; width: 100%; height: 100%; object-fit: cover; }

.quote-panel { background: var(--g-alt, var(--surface)); border-radius: var(--r-lg); padding: var(--s-7); }
.quote-help { margin-top: var(--s-6); }
.quote-help + p { margin-top: var(--s-5); }
.field input[type="file"] { height: auto; min-height: 48px; padding: var(--s-2) var(--s-3); font-size: 16px; }
.field textarea { min-height: 110px; }
.field--check { grid-template-columns: 24px minmax(0, 1fr); align-items: start; column-gap: var(--s-3); font-weight: 400; font-size: 16px; }
.field--check input { width: 24px; height: 24px; margin: 0; padding: 0; accent-color: var(--action); }
.field--check .field__error { grid-column: 1 / -1; }

.kicker { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; margin: 0 0 var(--s-4); }
.kicker .leaf { width: 18px; height: 18px; flex: none; }
.kicker--inv { margin-top: var(--s-4); color: var(--ink); }
@media (max-width: 1023px) {
  .stack-md > * { grid-column: 1 / -1 !important; }
  .stack-md > * + * { margin-top: var(--s-7); }
  .cards3 { grid-template-columns: 1fr 1fr; }
  .steps4, .cols4 { grid-template-columns: 1fr 1fr; }
  .cols3 { grid-template-columns: 1fr; }
  .form { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 639px) {
  .cards3, .steps4, .cols4 { grid-template-columns: 1fr; }
  .quote-panel { padding: var(--s-5); }
  .page-intro { padding-top: calc(56px + 40px); }
}
@media (prefers-reduced-motion: reduce) { .svc, .ph > img { transition: none; } }
