/* home.css — blocks that exist only on the home page. Hero, carousel, stepper, bento (+ its section), master-detail
   and the dark tiles of the age notice are in blocks.css. */

.jn-aboard{position:relative;background-color:var(--jn-dark);color:var(--jn-inv);padding-block:clamp(4.5rem,10vh,7rem)}
.jn-aboard__head{display:flex;align-items:center;gap:clamp(1.2rem,2.5vw,2rem)}
.jn-aboard__title{font-family:var(--ff-display);font-weight:var(--fw-xb);font-size:clamp(1.8rem,3.4vw,2.9rem);line-height:1.06;color:var(--jn-inv);margin:0}
.jn-aboard__lead{margin:clamp(1.6rem,3vh,2.2rem) 0 0;font-weight:var(--fw-sb);font-size:clamp(1.05rem,1.5vw,1.22rem);line-height:1.65;color:var(--jn-mut-inv);max-width:78ch}

.jn-aboard__grid{margin-top:clamp(2.2rem,4.5vh,3.2rem)}

.jn-aboard__resblock{margin-top:clamp(2.2rem,4.5vh,3.2rem)}
.jn-aboard__res{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}

@media (max-width:980px){
  .jn-aboard__res{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .jn-aboard__res{grid-template-columns:1fr}
}