/* Canonical proportions: phi for composition, Fibonacci steps for rhythm.
   Logos, technical diagrams, video players and the animated rig retain their geometry. */
:root {
  --gutter: clamp(var(--space-3), 3.3vw, var(--space-5));
  --section-space: clamp(var(--space-5), 6vw, var(--space-6));
  --composition-gap: clamp(var(--space-3), 3vw, var(--space-5));
  --portrait-height: clamp(340px, 40vw, 550px);
}
html { scroll-padding-top: calc(var(--header) + var(--space-3)); }
section[id], article[id] { scroll-margin-top: calc(var(--header) + var(--space-3)); }
body, p, .story-body, .article-body, .founder-story-body { line-height: var(--leading-body); }
h1, h2, h3, h4 { margin-top: 0; text-wrap: balance; }
h1 { line-height: var(--leading-tight); }
h2, h3, h4 { line-height: var(--leading-heading); }
p { margin-bottom: var(--space-3); }
.story-body, .article-body, .founder-story-body { max-width: var(--measure); }
.lead, .story-deck, .article-standfirst, .founder-story-lead {
  max-width: 55ch; font-size: var(--type-lead); line-height: var(--leading-body);
}
.eyebrow, .chapter, figcaption, .listing-ref { font-size: var(--type-caption); }
.eyebrow, .chapter { letter-spacing: .13em; margin-bottom: var(--space-2); }
.article-body h2, .article-body h3, .story-body h2, .founder-story-body h2 {
  margin-top: var(--space-5); margin-bottom: var(--space-3); line-height: var(--leading-heading);
}
.service-card p, .service-scope, .spare-pick p, .listing-information p,
.detail-columns p, .video-card-copy > p, .video-resource p {
  font-size: var(--type-body); line-height: var(--leading-body);
}
.catalogue, .services, .guide-landing, .founder-feature, .home-video-feature,
.text-article-feature, .pro-story, .reference, .context-image-section,
.detail-hero, .detail-columns, .photo-callout, .controller-price-ad,
.controller-manual-reference, .manuals-next, .parts-directory-hero,
.directory-group, .part-listing-hero, .listing-information, .related-listings,
.equipment-listing, .manuals-hero, .manual-pdf-feature, .faq-hero, .faq-group,
.faq-sources, .diagram-reference, .commerce-page, .story-hero, .series-ii-guide,
.founder-story, .deployment-story {
  padding-top: var(--section-space); padding-bottom: var(--section-space);
  padding-inline: var(--gutter);
}
.pro-header { padding-inline: var(--gutter); }
.reference-campaign.specialist-intro {
  gap: var(--space-3) var(--space-5);
  padding-top: var(--space-5); padding-bottom: var(--space-6);
}
.reference-campaign h1 { max-width: 20ch; line-height: var(--leading-tight); }
.campaign-kicker { margin-bottom: var(--space-3); line-height: var(--leading-body); }
.reference-campaign .intro-actions { gap: var(--space-3) var(--space-4); }
.reference-campaign .template-hero-art {
  height: auto; min-height: 0; aspect-ratio: var(--phi); align-self: center;
}
.campaign-stage img { height: calc(100% - var(--space-4)); object-fit: contain; }
.guide-landing, .founder-feature, .home-video-feature, .pro-story,
.detail-hero, .photo-callout, .manual-pdf-feature {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.618034fr);
  gap: var(--composition-gap);
}
.founder-feature, .part-listing-layout, .equipment-layout,
.listing-information, .cart-layout, .checkout-layout, .parts-quick-search {
  grid-template-columns: minmax(0, 1.618034fr) minmax(0, 1fr);
  gap: var(--composition-gap);
}
.text-article-feature { grid-template-columns: minmax(0, 1.618034fr) minmax(180px, 1fr); gap: var(--composition-gap); }
.founder-story-opening { grid-template-columns: minmax(0, 1fr) minmax(0, 1.618034fr); gap: var(--composition-gap); }
.article-layout, .story-layout { grid-template-columns: minmax(13rem, 1fr) minmax(0, 2.618034fr); gap: var(--space-5); }
.article-contents, .story-layout > aside { top: calc(var(--header) + var(--space-3)); }
.parts-grid, .listing-grid, .services-grid, .manuals-grid, .video-grid,
.video-resource-grid, .context-image-grid, .system-image-grid, .diagram-grid { gap: var(--space-4); }
.speaker-product-grid { gap: var(--space-4); }
.speaker-product > h3 { margin-bottom: var(--space-3); line-height: var(--leading-heading); }
.speaker-product-image {
  aspect-ratio: var(--phi); height: auto; max-height: none; padding: var(--space-3);
}
.speaker-product-image img { width: 100%; height: 100%; object-fit: contain; }
.detail-photo img, .equipment-photo img, .photo-callout > img,
.pro-story > img, .story-speaker-photo img, .system-gallery img, .system-image-grid img {
  width: 100%; height: auto; max-height: none; aspect-ratio: var(--phi); object-fit: contain;
}
.guide-landing-photo img, .founder-feature-photo img, .founder-colour-figure img {
  width: min(100%, calc(var(--portrait-height) / var(--phi)));
  height: auto; max-height: none; margin-inline: auto;
  aspect-ratio: calc(1 / var(--phi)); object-fit: contain;
}
.guide-landing-photo, .founder-feature-photo, .detail-photo, .equipment-photo { padding: var(--space-4); }
.manual-cover-link { height: auto; aspect-ratio: calc(1 / var(--phi)); }
.diagram-grid img, .interactive-schematic > img, .diagram-reference img {
  width: 100%; height: auto; max-height: none; object-fit: contain;
}
.context-image-grid figure > a { height: auto; aspect-ratio: var(--phi); padding: var(--space-3); }
.context-image-grid img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.part-reference-art { min-height: calc(var(--space-7) + var(--space-6)); aspect-ratio: var(--phi); padding: var(--space-4); gap: var(--space-3); }
.part-reference-art strong { font-size: clamp(var(--type-subhead), 3.6vw, var(--type-major)); line-height: var(--leading-heading); }
.part-card, .listing-card, .service-card, .video-card-copy { padding: var(--space-4); }
.shop-promise { padding-block: var(--space-5); gap: var(--space-4); }
.resource-divider { padding-block: var(--space-5); }
.resource-divider h2 { margin-bottom: var(--space-3); }
.pro-footer { padding-inline: var(--gutter); --footer-animation-gutter: var(--gutter); }
.footer-inner { grid-template-columns: minmax(0, 1.618034fr) repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
.footer-section a { font-size: var(--type-small); line-height: var(--leading-ui); }
.footer-legal { gap: var(--space-4); line-height: var(--leading-body); }
.speaker-stack-footer-pause { right: var(--space-2); width: var(--space-7); min-height: var(--space-4); padding: var(--space-0) var(--space-1); font-size: var(--type-caption); line-height: var(--leading-ui); white-space: nowrap; }
.speaker-stack-footer-restart { right: calc(var(--space-7) + var(--space-2) * 2); width: calc(var(--space-4) * 2); }
.speaker-stack-footer-sound span { left: var(--space-2); bottom: var(--space-1); max-width: calc(100% - 264px); font-size: var(--type-caption); line-height: var(--leading-ui); }
.footer-music-panel { top: var(--space-2); right: var(--space-2); padding: var(--space-2); }
@media (max-width: 1050px) {
  .article-layout, .story-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .article-contents, .story-layout > aside { position: static; }
  .footer-inner { grid-template-columns: minmax(0, 1.618034fr) minmax(0, 1fr); gap: var(--space-4); }
}
@media (max-width: 760px) {
  :root { --section-space: var(--space-5); --composition-gap: var(--space-4); }
  .reference-campaign.specialist-intro { grid-template-rows: auto auto auto; gap: var(--space-3); padding: var(--space-4) var(--gutter) var(--space-6); }
  .reference-campaign .template-hero-art { width: min(100%, 540px); height: auto; aspect-ratio: var(--phi); }
  .guide-landing, .founder-feature, .home-video-feature, .pro-story,
  .detail-hero, .photo-callout, .manual-pdf-feature, .founder-story-opening,
  .part-listing-layout, .equipment-layout, .listing-information,
  .cart-layout, .checkout-layout, .parts-quick-search, .text-article-feature { grid-template-columns: minmax(0, 1fr); }
  .guide-landing-photo, .founder-feature-photo, .detail-photo, .equipment-photo { padding: var(--space-3); }
  .footer-inner { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .footer-legal { gap: var(--space-3); }
}
@media (max-width: 640px) {
  :root { --header: 144px; --gutter: var(--space-3); }
  .pro-header { height: var(--header); grid-template-rows: 64px 55px; padding: 0 var(--gutter) var(--space-2); gap: var(--space-1) var(--space-2); }
  .pro-header.navigation-open { grid-template-rows: 64px 55px auto; }
  .header-actions { gap: var(--space-1); }
  .header-pill { min-height: 55px; padding: var(--space-0) var(--space-1); font-size: var(--type-caption); line-height: var(--leading-ui); white-space: normal; text-align: center; }
  .brand-tagline { font-size: 8px; }
  .speaker-product-grid { gap: var(--space-5); }
  .part-card, .listing-card, .service-card, .video-card-copy { padding: var(--space-3); }
  .part-reference-art { padding: var(--space-3); }
  .context-image-grid figure > a { padding: var(--space-2); }
}
@media (max-width: 480px) {
  .speaker-stack-footer-sound span { top: var(--space-2); bottom: auto; max-width: calc(100% - var(--space-4)); padding: var(--space-0) var(--space-1); background: #f4f1e9f5; border-radius: var(--space-0); }
  .speaker-stack-footer-pause { min-height: 44px; }
}
