/* Shared spacing contract for both production-page variants.
   Large heading/content: 40 / 32 / 24; prose: 24; subheading: 16. */
.production-page {
 --production-section-space: 80px;
 --production-heading-gap: 40px;
 --production-prose-gap: 24px;
 --production-subheading-gap: 16px;
 --production-card-title-gap: 12px;
}
.production-page .production-section,
.production-page .consultation-alt { padding-block: var(--production-section-space); }
.production-page .production-section > .container > h2,
.production-page .production-material-top h2 {
 margin-top: 0;
 margin-bottom: var(--production-heading-gap);
}
.production-page .production-section-heading,
.production-page .consultation-heading {
 margin-bottom: var(--production-heading-gap);
 row-gap: var(--production-heading-gap);
}
.production-page .production-section-heading h2,
.production-page .consultation-heading h2 { margin: 0; }
.production-page .production-section-heading > p,
.production-page .consultation-description { margin: 0; }
.production-page .production-material-top { margin-bottom: var(--production-heading-gap); }
.production-page .production-machine-copy { margin-top: 0; margin-bottom: var(--production-heading-gap); row-gap: var(--production-prose-gap); }
.production-page .production-machine-copy p { margin: 0; padding-top: 0; }
.production-page .production-machine-features { margin-top: var(--production-heading-gap); }
.production-page .production-machine-features h3 { margin: 0 0 var(--production-subheading-gap); }
.production-page .production-joints-title {
 margin-top: var(--production-section-space)!important;
 margin-bottom: var(--production-heading-gap)!important;
}
/* Give the first accordion title the same actual heading-to-content gap as text. */
.production-page [data-accordion-group] > .production-accordion:first-child > h3 > .production-disclosure { padding-top: 0; }
.production-page .process .production-panel-inner > * { margin: 0; }
.production-page .process .production-panel-inner > * + * { margin-top: var(--production-prose-gap); }
.production-page .process .production-panel-inner > :first-child { margin-top: var(--production-prose-gap); }
.production-page .process .production-panel-inner > :last-child { margin-bottom: var(--production-prose-gap); }
.production-page .process .production-panel-inner > h3 + * { margin-top: var(--production-subheading-gap); }
.production-page .faq .production-panel-inner > p { margin: 0 0 var(--production-prose-gap); }
.production-page .benefit .production-panel-inner > p { margin: 0 0 var(--production-prose-gap) 72px; }
.production-page .production-joint h3 { margin: 16px 0 var(--production-card-title-gap); }
.production-page .production-joint p { margin: 0; }
.production-page :is(#hundegger,#faq) > .container > h2 { margin-bottom: var(--production-heading-gap); }
.production-page .production-intro { padding-block: 48px; }
.production-page .production-first-screen .production-intro { padding-block: 32px; }
/* The two first-screen compositions share type spacing, while retaining their layout. */
.production-page .production-intro h1 { margin-bottom: var(--production-heading-gap); }
.production-page .production-intro > .container { row-gap: var(--production-heading-gap); }
.production-page .production-intro p { margin: 0; }
@media(min-width:701px) and (max-width:1100px) {
 .production-page { --production-section-space: 64px; --production-heading-gap: 32px; }
}
@media(max-width:700px) {
 .production-page {
  --production-section-space: 48px;
  --production-heading-gap: 24px;
  --production-subheading-gap: 16px;
  --production-card-title-gap: 8px;
 }
 .production-page .production-intro { padding-top: 32px; padding-bottom: 36px; }
 .production-page .production-first-screen .production-intro { padding-block: 24px; }
 .production-page .production-intro p { padding-right: 0; font-size: 17px; line-height: 1.5; }
 .production-page .production-intro .production-down { display: none; }
 .production-page .production-material-top { row-gap: var(--production-heading-gap); }
 .production-page .benefit .production-panel-inner > p { margin-left: 38px; }
 .production-page .production-joint h3 { margin-top: 12px; }
}

/* First stage has no top padding: center its accent on the text, not the button box. */
.production-page [data-accordion-group] > .process:first-child > h3 > .production-disclosure::before {
 top: calc(50% - 19px);
}
@media(max-width:700px) {
 .production-page [data-accordion-group] > .process:first-child > h3 > .production-disclosure::before {
  top: calc(50% - 11.5px);
 }
}

/* Gallery and FAQ share one dark surface: keep one section gap, not two. */
.production-page #gallery { padding-bottom: 0; }

/* Film-led hero: the dark gradient belongs to the image, without a glass panel. */
.production-page .production-main{padding-top:0;}
.production-page .production-first-screen{position:relative;isolation:isolate;height:calc(var(--site-vh,1svh)*100);min-height:640px;background:#0d0d0d;}
.production-page .production-first-screen .production-hero{position:absolute;inset:0;width:100%;height:100%;min-height:0;max-height:none;}
.production-page .production-first-screen::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to top,rgba(0,0,0,.94) 0%,rgba(0,0,0,.74) 23%,rgba(0,0,0,.3) 49%,transparent 76%);}
.production-page .production-first-screen .production-intro{position:absolute;inset:auto 0 0;width:100%;z-index:2;background:transparent;border:0;backdrop-filter:none;-webkit-backdrop-filter:none;padding-block:40px;}
.production-page .production-first-screen .production-intro>.container{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:8%;align-items:end;}
.production-page .production-first-screen .production-intro h1{font-size:clamp(40px,calc(var(--site-vw,1vw)*4),64px);line-height:1.08;}
.production-page .production-first-screen .production-intro p{color:#fff;}
@media(max-width:700px){
 .production-page .production-first-screen{height:calc(var(--site-stable-vh,1svh)*100);min-height:640px;}
 .production-page .production-first-screen::before{background:linear-gradient(to top,rgba(0,0,0,.96),rgba(0,0,0,.8) 35%,rgba(0,0,0,.25) 68%,transparent);}
 .production-page .production-first-screen .production-intro{padding-block:24px;}
 .production-page .production-first-screen .production-intro>.container{grid-template-columns:minmax(0,1fr);gap:24px;}
 .production-page .production-first-screen .production-intro h1{font-size:clamp(32px,8vw,44px);}
}

/* Align the heading and copy independently of the controls below them. */
@media(min-width:701px){
 .production-page .production-first-screen .production-intro>.container{align-items:start;column-gap:8%;row-gap:32px;}
 .production-page .production-first-screen .production-intro>.container>div{display:contents;}
 .production-page .production-first-screen .production-intro h1{grid-column:1;grid-row:1;margin:0;}
 .production-page .production-first-screen .production-intro p{grid-column:2;grid-row:1;margin:0;align-self:start;}
 .production-page .production-first-screen .production-intro .button-grey{grid-column:1;grid-row:2;align-self:center;}
 .production-page .production-first-screen .production-down{grid-column:2;grid-row:2;align-self:center;justify-self:end;margin:0;}
}

/* Last text baselines share one level, regardless of font size and line count. */
@media(min-width:701px){
 .production-page .production-first-screen .production-intro h1,
 .production-page .production-first-screen .production-intro p{align-self:last baseline;}
}

/* Compact machining examples: image and caption, six across on wide screens. */
.production-page .production-joints-heading { margin-top: var(--production-section-space); margin-bottom: 32px; scroll-margin-top: 120px; }
.production-page .production-joints-eyebrow { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 28px; font-size: 14px; line-height: 1.4; }
.production-page .production-joints-eyebrow span { color: var(--production-orange); }
.production-page .production-joints-eyebrow p { margin: 0; color: #999; font-size: inherit; line-height: inherit; }
.production-page .production-joints-heading .production-joints-title { margin: 0!important; font-size: clamp(32px,3.2vw,52px); line-height: 1.1; }
.production-page .production-joints { grid-template-columns: repeat(6,minmax(0,1fr)); gap: 24px 16px; border: 0; }
.production-page .production-joint { padding: 0; border: 0; }
.production-page .production-joint-visual { aspect-ratio: 1.72; background: linear-gradient(145deg,#1b1b19,#0d0d0d); border: 1px solid #242424; }
.production-page .production-joint h3 { margin: 12px 0 0; font-size: clamp(14px,1.15vw,18px); font-weight: 400; line-height: 1.3; }
.production-page .production-joint p { display: none; }
@media(min-width:701px) and (max-width:1100px) {
 .production-page .production-joints { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
@media(max-width:700px) {
 .production-page .production-joints-heading { margin-bottom: 24px; }
 .production-page .production-joints-eyebrow { gap: 12px; margin-bottom: 20px; font-size: 12px; }
 .production-page .production-joints-eyebrow p { max-width: 160px; text-align: right; }
 .production-page .production-joints { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px 12px; }
 .production-page .production-joint h3 { margin-top: 10px; font-size: 15px; }
}