/* Role-based scale. Tracking follows type size, rather than the HTML tag alone. */
:root {
  --type-hero: clamp(3rem, calc(1rem + 7vw), 9rem);
  --type-section: clamp(2.125rem, calc(1rem + 3.6vw), 4.75rem);
  --type-closing: clamp(2.75rem, calc(.5rem + 8.7vw), 9rem);
  --type-title: clamp(1.625rem, calc(1.3rem + .65vw), 2.125rem);
  --type-body: clamp(1rem, calc(.95rem + .2vw), 1.125rem);
  --track-display: clamp(-8px, calc(.8px - .6vw), -2.4px);
  --track-section: -.05em;
  --track-title: -.035em;
}

body { font-size: var(--type-body); line-height: 1.5; }
h1,h2,h3,h4,h5,h6 { letter-spacing: var(--track-title); }
h1 *,h2 *,h3 *,h4 *,h5 *,h6 * { letter-spacing: inherit; }
.hero h1 { font-size: var(--type-hero); line-height: .98; letter-spacing: var(--track-display); }
.intro h2,.study-heading h2,.expertise-intro h2 {
  font-size: var(--type-section);
  line-height: 1.08;
  letter-spacing: var(--track-section);
}
.contact h2 { font-size: var(--type-closing); line-height: 1.02; letter-spacing: var(--track-display); }
.contact h2 span { letter-spacing: inherit; }
summary h3,.services summary h3 { font-size: var(--type-title); line-height: 1.12; letter-spacing: var(--track-title); }
.hero-bottom p,.expertise-intro p,.intro-detail p:last-child { font-size: var(--type-body); line-height: 1.5; }
.intro-detail p:first-child { font-size: clamp(1.25rem, calc(1rem + .7vw), 1.625rem); line-height: 1.4; }
.hero-top,.section-label,.study .section-label { font-size: 11px; line-height: 1.4; }
.hero-foot,.study-note { font-size: 11px; line-height: 1.5; }
.study-bottom { font-size: 10px; line-height: 1.5; gap: 20px; }
.study-bottom>span { max-width: 30%; }
.store-window { container-type: inline-size; --store-stage-height: 350px; }
.store-content { height: auto; min-height: var(--store-stage-height); }
.store-view { height: var(--store-stage-height); }
.view-product,.view-collection { height: auto; min-height: var(--store-stage-height); }
.view-product { grid-template-columns: minmax(0,1fr) minmax(0,1.15fr); }
.product-detail-art { min-width: 0; overflow: hidden; }
.product-detail-copy { min-width: 0; }
@container (min-width: 650px) {
  .store-content { --store-stage-height: 380px; }
}
.store-copy h3 { font-size: 34px; font-size: clamp(30px, 8cqi, 56px); line-height: 1.03; letter-spacing: -.045em; }
.collection-heading h3 { font-size: 28px; font-size: clamp(24px, 4.5cqi, 32px); line-height: 1.06; letter-spacing: -.035em; }
.product-detail-copy h3 { font-size: 28px; font-size: clamp(24px, 4.8cqi, 34px); line-height: 1.08; letter-spacing: -.035em; }
.header nav>.nav-item { font-size: 14px; }
.menu-secondary h2 { font-size: 20px; line-height: 1.2; letter-spacing: -.025em; }
.menu-secondary a,.menu-secondary p { font-size: 14px; }
.menu-signoff { font-size: 10px; }
footer>.meta,footer>a.meta { font-size: 11px; }

@media (max-width: 960px) {
  .header nav>.nav-item { font-size: clamp(24px, 4vw, 32px); line-height: 1.2; }
  .hero h1 { margin-top: 28px; }
  .hero-foot { align-items: center; flex-wrap: wrap; gap: 14px 20px; }
  .hero-foot>span:nth-child(3) { display: none; }
  .hero-foot .motion-toggle { margin-left: auto; }
  .study-heading>p { font-size: 15px; line-height: 1.5; }
  .study-note { font-size: 10px; }
  .study-bottom { font-size: 9px; gap: 12px; }
}
@media (max-width: 400px) {
  .menu-secondary { gap: 14px; }
  .menu-secondary a,.menu-secondary p { font-size: 12px; }
  .contact h2 { font-size: var(--type-closing); }
  .contact-arrow { font-size: 28px; }
}
