.commercial-page{background:var(--ha-paper);color:var(--ha-ink)}
.commercial-page .site-header{background:var(--ha-ink);color:var(--ha-paper)}
.commercial-page .site-header nav a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--ha-bloom);text-decoration-thickness:2px;text-underline-offset:5px}

.commercial-hero,.commercial-starts,.commercial-value,.commercial-contact{padding-inline:clamp(24px,6vw,120px)}
.commercial-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:clamp(40px,8vw,140px);align-items:end;padding-block:clamp(72px,10vw,152px);background:var(--ha-ink);color:var(--ha-paper)}
.commercial-hero h1{max-width:9ch;margin:0;font-size:clamp(56px,7.2vw,112px);font-weight:600;line-height:.94;letter-spacing:-.06em}
.commercial-hero-copy{max-width:560px}
.commercial-hero-copy>p:first-child{margin:0;font-size:clamp(21px,2vw,30px);line-height:1.38;letter-spacing:-.025em;color:var(--ha-soft-on-dark)}
.commercial-hero .button,.commercial-contact .button{margin-top:30px;background:var(--ha-bloom);border-color:var(--ha-bloom);color:#1F1E1C;font-size:17px;clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%)}
.commercial-hero .button:hover,.commercial-contact .button:hover{background:var(--ha-hero-action-hover);border-color:var(--ha-hero-action-hover)}
.commercial-hero .small-print{max-width:44ch;margin:14px 0 0;color:var(--ha-soft-on-dark);font-size:13px}

.commercial-starts{padding-block:clamp(72px,9vw,136px);background:var(--ha-paper)}
.commercial-heading{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,7vw,112px);align-items:end;margin-bottom:clamp(48px,7vw,96px)}
.commercial-heading h2,.commercial-value h2,.commercial-contact h2{margin:0;font-size:clamp(42px,5.2vw,78px);font-weight:600;line-height:1;letter-spacing:-.05em}
.commercial-heading>p{max-width:48ch;margin:0;color:var(--ha-ink-soft);font-size:18px;line-height:1.65}
.commercial-routes{border-top:2px solid var(--ha-ink)}
.commercial-routes article{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.2fr);gap:clamp(28px,7vw,112px);padding:clamp(30px,4vw,56px) 0;border-bottom:1px solid var(--ha-hairline)}
.commercial-routes h3{max-width:14ch;margin:0;font-size:clamp(26px,3vw,42px);font-weight:500;line-height:1.12}
.commercial-routes article>div{max-width:670px}
.commercial-routes article p{margin:0;color:var(--ha-ink-soft);font-size:17px;line-height:1.65}
.commercial-routes .route-terms{margin-top:18px;color:var(--ha-ink);font-size:15px;font-weight:600}

.commercial-value{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);gap:clamp(40px,9vw,150px);padding-block:clamp(72px,9vw,136px);background:var(--ha-bone-alt)}
.commercial-value h2{max-width:11ch;color:color-mix(in srgb,var(--ha-bloom-deep) 50%,var(--ha-bloom))}
.commercial-value>div:last-child{max-width:620px}
.commercial-value p{margin:0;color:var(--ha-ink-soft);font-size:18px;line-height:1.7}
.commercial-value p+p{margin-top:28px;padding-top:28px;border-top:1px solid var(--ha-hairline)}

.commercial-contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);gap:clamp(40px,9vw,150px);align-items:end;padding-block:clamp(72px,9vw,128px);background:var(--ha-bloom);color:#1F1E1C}
.commercial-contact h2{max-width:10ch}
.commercial-contact>div:last-child{max-width:560px}
.commercial-contact p{margin:0;font-size:18px;line-height:1.65}
.commercial-contact .button{margin-top:28px;background:var(--ha-ink);border-color:var(--ha-ink);color:var(--ha-paper)}
.commercial-contact .button:hover{background:var(--ha-ink-raised);border-color:var(--ha-ink-raised)}
.commercial-contact .small-print{margin-top:14px;font-size:13px}

@media(max-width:760px){
  .commercial-hero,.commercial-heading,.commercial-value,.commercial-contact{grid-template-columns:1fr}
  .commercial-hero{gap:34px;padding-block:48px 64px}
  .commercial-hero h1{font-size:clamp(50px,14vw,62px);max-width:8ch}
  .commercial-hero-copy>p:first-child{font-size:20px}
  .commercial-hero .button,.commercial-contact .button{width:100%;min-height:54px;padding-inline:14px;text-align:center}
  .commercial-starts{padding-block:64px}
  .commercial-heading{gap:22px;margin-bottom:44px}
  .commercial-heading h2,.commercial-value h2,.commercial-contact h2{font-size:40px;line-height:1.05}
  .commercial-heading>p,.commercial-value p,.commercial-contact p{font-size:16px}
  .commercial-routes article{grid-template-columns:1fr;gap:16px;padding:30px 0}
  .commercial-routes h3{font-size:28px;max-width:none}
  .commercial-routes article p{font-size:16px}
  .commercial-value,.commercial-contact{gap:30px;padding-block:64px}
  .commercial-page footer{background:var(--ha-ink)}
}