/* Full-screen photo crops, with a fixed headline over the moving collection. */
.home .hero--craft {
  --hero-ease: cubic-bezier(.77,0,.175,1);
  position:relative; display:flex; flex-direction:column; justify-content:flex-end;
  min-height:760px; min-height:100svh; padding:0; overflow:hidden;
  isolation:isolate; border-radius:0; background:#b5aa98; color:#fff;
}
.hero--craft .hero__media { position:absolute; inset:0; z-index:0; touch-action:pan-y; }
.hero--craft .hero__track { display:flex; width:400%; height:100%; transform:translateX(-25%); }
.hero--craft .hero__photo { display:block; flex:0 0 25%; width:25%; min-width:0; height:100%; object-fit:cover; object-position:50% 0%; border:0; }
.hero--craft .hero__photo[src*="collection"] { object-position:50% 35%; }
.home .hero--craft::after { content:""; display:block; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(0deg,rgba(15,17,15,.72),rgba(15,17,15,.18) 38%,transparent 68%); }
.home .hero--craft .hero__inner { position:relative; z-index:2; width:100%; max-width:var(--maxw); margin-inline:auto; padding:180px var(--pad) 84px; text-align:left; pointer-events:none; }
.home .hero--craft .hero__title { color:#fff; font-family:var(--display); font-weight:600; font-size:clamp(3.25rem,7vw,6.5rem); line-height:.98; letter-spacing:-.055em; margin:0; max-width:none; text-shadow:0 2px 24px #0002; }
.hero--craft .hero__line { display:block; }
.hero--craft .hero__cta { margin-top:28px; pointer-events:auto; width:fit-content; }
.home .hero--craft .hero__cta .btn { background:#fff; color:#20221f; }
.hero--craft :focus-visible { outline:2px solid #fff; outline-offset:5px; }
.home .hero--craft + .section--tight { padding-top:clamp(40px,6vw,72px); }
@media(max-width:759px) {
 .home .hero--craft { min-height:760px; min-height:100svh; }
 .hero--craft .hero__track { width:400%; }
 .hero--craft .hero__photo { border:0; object-position:50% 35%; }
 .home .hero--craft .hero__inner { padding:160px var(--pad) 112px; }
 .home .hero--craft .hero__title { font-size:clamp(3rem,14vw,4.75rem); }
}

/* First-visit entrance: reveal the slogan, then the project invitation. */
.hero--craft .hero__line { overflow:hidden; padding-bottom:.12em; margin-bottom:-.12em; }
.hero--craft .hero__word {
  display:inline-block;
  animation:hero-slogan-in 1800ms cubic-bezier(.23,1,.32,1) both;
  animation-delay:calc(200ms + var(--i,0) * 160ms);
}
.hero--craft .hero__cta {
  animation:hero-project-in 1000ms cubic-bezier(.23,1,.32,1) 1100ms both;
}
.hero--craft .hero__cta:focus-within { animation:none; }
@keyframes hero-slogan-in {
  from { opacity:0; transform:translateY(105%); }
  to { opacity:1; transform:translateY(0); }
}
@keyframes hero-project-in {
  from { opacity:0; transform:translateY(16px); }
  to { opacity:1; transform:translateY(0); }
}
@keyframes hero-gentle-in { from { opacity:0; } to { opacity:1; } }
@media(prefers-reduced-motion:reduce) {
 .hero--craft .hero__word, .hero--craft .hero__cta { animation:hero-gentle-in 180ms ease both; }
}
.hero--craft .hero__word--brand { color:#ad8b17; }

/* A compact, photo-free introduction for the manufacturing business. */
.home .hero--intro{min-height:0;background:var(--paper-2);color:var(--heading)}
.home .hero--intro::after{display:none}
.home .hero--intro .hero__inner{padding:160px var(--pad) 64px}
.home .hero--intro .hero__title{color:var(--heading);text-shadow:none;font-size:clamp(3rem,6vw,5.25rem);line-height:1.06}
.home .hero--intro .hero__cta .btn{background:var(--ink);color:#fff}
.home .hero--intro .hero__word,.home .hero--intro .hero__cta{animation:none}
.hero--intro :focus-visible{outline-color:var(--ink)}
@media(max-width:759px){.home .hero--intro .hero__inner{padding:132px var(--pad) 48px}.home .hero--intro .hero__title{font-size:clamp(2.75rem,10vw,4rem)}}

/* Logo first, followed by the brand slogan. */
.home .hero--intro .hero__inner{text-align:center;padding-top:140px;padding-bottom:44px}
.home .hero--intro .intro-logo{display:block;width:clamp(240px,38vw,430px);max-width:100%;height:auto;margin:0 auto 28px}
.home .hero--intro .hero__title{font-size:clamp(1.5rem,3vw,2.4rem);letter-spacing:-.035em;line-height:1.2}
.home .hero--intro .hero__line{display:inline;overflow:visible}
.home .hero--intro .hero__cta{margin:24px auto 0}
@media(max-width:759px){.home .hero--intro .hero__inner{padding-top:120px;padding-bottom:36px}}

/* Office photo backdrop for the intro hero. Appended last so it wins the cascade. */
.home .hero--office{position:relative;overflow:hidden;isolation:isolate;min-height:74svh;display:flex;flex-direction:column;justify-content:center}
.home .hero--office .hero__bg{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:60% 42%}
.home .hero--office::after{content:"";display:block;position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(0deg,rgba(15,17,15,.74),rgba(15,17,15,.5) 45%,rgba(15,17,15,.42))}
.home .hero--office .hero__inner{position:relative;z-index:2}
.home .hero--office .hero__title{color:#fff;text-shadow:0 2px 22px rgba(0,0,0,.5)}
.home .hero--office .hero__cta .btn{background:#B08B19;color:#fff}
@media(max-width:759px){.home .hero--office{min-height:66svh}}