/* Home page (src/pages/{mn,en}/index.html). Shared tokens and classes live in site.css. */

/* ---------- headings: no orphaned last words ---------- */
.page-home main :is(h1,h2,h3){text-wrap:balance}

/* ---------- hero: current lines sit a fixed distance above the stats rule (as on the board),
   instead of a fixed distance from the hero bottom, which crossed the stats when MN labels wrapped ---------- */
.page-home .stats{position:relative}
.page-home .hm-flow{left:50%;right:auto;width:100vw;margin-left:-50vw;bottom:auto;top:calc(clamp(48px,7vw,96px) * -.8)}
.page-home .hm-flow--2{top:calc(clamp(48px,7vw,96px) * -.38)}
/* "ISO 9001 · ESCO": on phones break at the dot instead of leaving it dangling */
@media (max-width:560px){
  .page-home .hm-flow{top:-26px}
  .page-home .hm-flow--2{top:-10px}
  .page-home .hm-sep{display:block;height:0;overflow:hidden}
  .page-home .hero .btn-row .btn{flex:1 1 100%}
}

/* ---------- projects ---------- */
/* captions stay legible over bright skies (Gerlug Vista measured 2.1:1 before) */
.page-home .proj::after{background:linear-gradient(180deg,rgba(24,25,27,0) 30%,rgba(24,25,27,.6) 62%,rgba(24,25,27,.92) 100%)}
.page-home .proj:not(.proj--lead) :is(.proj__name,.proj__meta){text-shadow:0 1px 14px rgba(24,25,27,.65)}
/* tablet: 2-column grid would leave River Garden alone with an empty cell — let it span */
@media (min-width:561px) and (max-width:900px){
  .page-home .proj-grid .proj:nth-child(4){grid-column:1/-1}
}
/* stats labels sit over the bright busbars at 1440 (measured 4.9:1 at p90, 3.5:1 worst) */
.page-home .stat__label{text-shadow:0 0 10px rgba(24,25,27,.85)}

/* ---------- hero on phones and tablets (as the approved mobile board): text sits on a dark top,
   the shade lifts towards the bottom so the moving busbars show between the buttons and the stats,
   and the stats get their own translucent band at the bottom edge ---------- */
@media (max-width:900px){
  .page-home .hero__shade{background:linear-gradient(180deg,rgba(24,25,27,.95) 0%,rgba(24,25,27,.86) 44%,rgba(24,25,27,.28) 74%,rgba(24,25,27,.5) 100%)}
  .page-home .hero__body{padding-bottom:0}
  .page-home .hero .stats{margin-top:clamp(132px,34vw,220px);margin-inline:calc(-1 * var(--gutter));padding:18px var(--gutter) 20px;background:rgba(24,25,27,.8);border-top:1px solid var(--line-dark)}
}