/* Homepage refresh (2026-09-30): the key figures become a full-width "title block" under the hero,
   and the quantity section ends with a four-step ladder. Scoped under .home-content so earlier
   hero-spec rules in v2.css and home.css do not apply. */

/* Title block: spans both hero columns, framed like a drawing's title block. */
.home-content .home-hero .hero-titleblock{grid-column:1/-1;min-width:0}
.home-content .home-hero .hero-titleblock .hero-specs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;max-width:none;margin:28px 0 0;padding:0;border-top:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink)}
.home-content .home-hero .hero-titleblock .hero-specs>div{min-width:0;padding:16px 16px 18px;border-left:1px solid var(--line)}
.home-content .home-hero .hero-titleblock .hero-specs>div:first-child{border-left:0;padding-left:0}
.home-content .home-hero .hero-titleblock dt{margin:0;font-size:11px;font-weight:700;letter-spacing:.07em;color:var(--muted);white-space:nowrap}
.home-content .home-hero .hero-titleblock dd{margin:8px 0 0;font-size:27px;line-height:1.1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap}
.home-content .home-hero .hero-titleblock dd>small{font-size:13px;letter-spacing:0;color:var(--muted)}
.home-content .home-hero .hero-titleblock .unit-secondary{display:block;margin-top:6px;font-size:12px;line-height:1.4;letter-spacing:0;white-space:normal;color:var(--muted)}
.home-content .home-hero .hero-titleblock .focus-inch{display:block}
@media(max-width:1100px){
 .home-content .home-hero .hero-titleblock .hero-specs{grid-template-columns:repeat(3,minmax(0,1fr))}
 .home-content .home-hero .hero-titleblock .hero-specs>div:nth-child(4){border-left:0;padding-left:0}
 .home-content .home-hero .hero-titleblock .hero-specs>div:nth-child(n+4){border-top:1px solid var(--line)}
}
@media(max-width:600px){
 .home-content .home-hero .hero-titleblock .hero-specs{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:8px}
 .home-content .home-hero .hero-titleblock .hero-specs>div,.home-content .home-hero .hero-titleblock .hero-specs>div:nth-child(4){border-left:1px solid var(--line);padding:14px 0 14px 14px}
 .home-content .home-hero .hero-titleblock .hero-specs>div:nth-child(odd){border-left:0;padding-left:0}
 .home-content .home-hero .hero-titleblock .hero-specs>div:nth-child(n+3){border-top:1px solid var(--line)}
 .home-content .home-hero .hero-titleblock dd{font-size:23px}
}

/* Quantity ladder: one line through four steps; the last two, where process work starts, are marked. */
.home-content .quantity-ladder{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:relative}
.home-content .quantity-ladder::before{content:"";position:absolute;left:0;right:0;top:7px;height:1.5px;background:var(--ink)}
.home-content .quantity-ladder li{position:relative;padding:34px 28px 0 0}
.home-content .quantity-ladder li::before{content:"";position:absolute;left:0;top:0;width:13px;height:13px;border-radius:50%;background:var(--soft);border:1.5px solid var(--ink)}
.home-content .quantity-ladder li.is-optimised::before{background:var(--accent);border-color:var(--accent)}
.home-content .ladder-qty{display:block;font-size:40px;line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.home-content .ladder-qty small{margin-left:5px;font-size:14px;letter-spacing:0;color:var(--muted)}
.home-content .quantity-ladder h3{margin:14px 0 8px;font-size:19px;letter-spacing:-.01em}
.home-content .quantity-ladder p{margin:0;font-size:15px;line-height:1.55;color:var(--muted)}
@media(max-width:900px){
 .home-content .quantity-ladder{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:36px;margin-top:40px}
 .home-content .quantity-ladder::before{display:none}
}
@media(max-width:520px){.home-content .quantity-ladder{grid-template-columns:1fr}}

/* The quantity section sits on the dark band: light line, markers and text for contrast. */
.home-content .focus-section .quantity-ladder::before{background:rgba(255,255,255,.4)}
.home-content .focus-section .quantity-ladder li::before{background:var(--dark);border-color:#e8ebe7}
.home-content .focus-section .quantity-ladder li.is-optimised::before{background:var(--accent-on-dark);border-color:var(--accent-on-dark)}
.home-content .focus-section .ladder-qty{color:#fff}
.home-content .focus-section .ladder-qty small{color:#b9c1bb}
.home-content .focus-section .quantity-ladder h3{color:#fff}
.home-content .focus-section .quantity-ladder p{color:#c9d0cb}
/* Room between the title block and the diameter selector below it. */
.home-content .home-hero .hero-titleblock{margin-bottom:36px}