/* Final hero layer: registered drawing, intact display type and a full first-screen story. */
.hero.assembly-mounted{
  height:calc(100svh - 94px);
  min-height:0;
  max-height:none;
}
.hero.assembly-mounted .hero-copy{
  padding-top:clamp(24px,4.7svh,58px);
  overflow:visible;
}
.hero.assembly-mounted .hero-copy h1{
  font-size:clamp(64px,min(7.15vw,13svh),112px);
  line-height:1.12;
  overflow:visible;
}
.hero.assembly-mounted .hero-title-main{
  display:inline-block;
  padding:.01em .065em .16em;
  margin-bottom:-.15em;
  line-height:1.15;
  overflow:visible;
}
.hero.assembly-mounted .hero-title-main svg{
  left:-.02em;
  bottom:.015em;
  width:calc(100% + .04em);
  height:.24em;
  overflow:visible;
  opacity:.92;
  stroke-width:1.45;
  filter:drop-shadow(0 0 7px rgba(204,180,128,.28));
}
.hero.assembly-mounted .hero-title-note{
  margin-top:clamp(0px,.4svh,6px);
  font-size:clamp(53px,min(6.1vw,10.5svh),92px);
  line-height:1.08;
}
.hero.assembly-mounted .hero-bottom{
  bottom:clamp(18px,3.4svh,40px);
}
.hero.assembly-mounted .hero-bottom p{margin-bottom:clamp(10px,1.8svh,20px)}
.hero.assembly-mounted .hero-bottom .hero-handwritten{font-size:clamp(22px,3.1svh,29px)}


.hero.assembly-mounted .assembly-guides{
  stroke:#f3ead4;
  stroke-width:1.05;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}
.hero.assembly-mounted .assembly-guides path{
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 1px 2px rgba(18,21,16,.34));
}
.hero.assembly-mounted .assembly-piece{transform-box:fill-box;transform-origin:center}
.hero.assembly-mounted[data-assembly="complete"] .hero-progress-stroke{stroke-dashoffset:0!important}
.hero.assembly-mounted .hero-progress-stroke{stroke:#d7b76c;stroke-width:1.6;vector-effect:non-scaling-stroke}

@media(max-height:760px) and (min-width:761px){
  .hero.assembly-mounted .hero-copy{padding-top:20px}
  .hero.assembly-mounted .hero-copy h1{font-size:clamp(58px,10.8svh,78px)}
  .hero.assembly-mounted .hero-title-note{font-size:clamp(48px,8.6svh,64px)}
  .hero.assembly-mounted .hero-bottom{bottom:14px}
  .hero.assembly-mounted .hero-bottom p{margin-bottom:8px}
  .hero.assembly-mounted .hero-bottom .hero-handwritten{font-size:21px;line-height:1.04}
  .hero.assembly-mounted .hero-bottom .button{min-height:48px}

}

@media(max-width:760px){
  .hero.assembly-mounted{
    height:calc(100svh - 74px);
    min-height:0;
  }
  .hero.assembly-mounted .hero-copy{padding-top:clamp(22px,4.5svh,38px)}
  .hero.assembly-mounted .hero-copy h1{font-size:clamp(52px,min(16vw,10.2svh),68px)}
  .hero.assembly-mounted .hero-title-main{padding-inline:.04em}
  .hero.assembly-mounted .hero-title-note{font-size:clamp(46px,min(14vw,8.6svh),62px)}
  .hero.assembly-mounted .hero-bottom{bottom:clamp(18px,3svh,28px)}
  .hero.assembly-mounted .hero-bottom>div{max-width:min(330px,100%)}
  .hero.assembly-mounted .hero-bottom .hero-handwritten{font-size:clamp(21px,6.7vw,27px)}
}

@media(max-width:760px) and (max-height:720px){
  .hero.assembly-mounted{min-height:0}
  .hero.assembly-mounted .hero-copy{padding-top:18px}
  .hero.assembly-mounted .hero-copy h1{font-size:50px}
  .hero.assembly-mounted .hero-title-note{font-size:43px}
  .hero.assembly-mounted .hero-bottom{bottom:12px}
  .hero.assembly-mounted .hero-bottom p{margin-bottom:7px}
  .hero.assembly-mounted .hero-bottom .hero-handwritten{font-size:20px;line-height:1.02}
  .hero.assembly-mounted .hero-bottom .button{min-height:48px}

}

@media(prefers-reduced-motion:reduce){
  .hero.assembly-mounted .assembly-map{display:none}
  .hero.assembly-mounted .hero-progress-stroke,
  .hero.assembly-mounted .signature-flourish path{stroke-dashoffset:0!important}
}

/* Architectural elevation: primary contours, details and external drafting guides. */
.hero.assembly-mounted .assembly-guides path{filter:none;stroke-linecap:round;stroke-linejoin:round}
.hero.assembly-mounted .draft-structure{stroke:#f5eddc;stroke-width:1.15}
.hero.assembly-mounted .draft-details{stroke:#e9dfc9;stroke-width:.65;opacity:.84}
.hero.assembly-mounted .draft-dimensions{stroke:#ceb780;stroke-width:.65;opacity:.74}
.hero.assembly-mounted .draft-handwriting{font-size:22px}
.hero.assembly-mounted .hero-title-main svg{filter:none;opacity:.88}
.hero.assembly-mounted .hero-progress-stroke{stroke:#d2b777;stroke-width:1.2;stroke-linecap:butt}
.hero.assembly-mounted .signature-flourish path{stroke-linecap:round;vector-effect:non-scaling-stroke}

/* Replay is a quiet secondary control; the location lives later in the story. */
.hero.assembly-mounted .hero-bottom{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,390px) minmax(0,1fr);align-items:end;gap:16px}
.hero.assembly-mounted .hero-bottom>div:first-child{grid-column:2;width:100%;max-width:none}
.hero.assembly-mounted .hero-controls{grid-column:3;justify-self:end;display:block;width:46px;margin:0;padding:0}
:root body .hero-replay{display:grid;place-items:center;width:46px;height:46px;min-height:46px;padding:11px;border:1px solid var(--ek-glass-edge);border-radius:50%;color:var(--ek-glass-ink);line-height:1}
.hero-replay svg{display:block;width:22px;height:22px;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.hero-replay[data-intro-state="playing"] svg{opacity:.68}
@media(max-width:760px){
 .hero.assembly-mounted .hero-bottom{grid-template-columns:minmax(0,1fr) 46px;gap:12px}
 .hero.assembly-mounted .hero-bottom>div:first-child{grid-column:1}
 .hero.assembly-mounted .hero-controls{grid-column:2;margin-bottom:4px}
 .hero.assembly-mounted .hero-bottom .button{padding-left:15px;gap:8px;font-size:14px}
}
