/* Extend the established Mach product design; scoped to brand landing pages. */
.brand-landing{--brand-gap:56px}
.brand-breadcrumb{padding-block:24px}
.brand-breadcrumb .product-breadcrumb{margin:0;flex-wrap:wrap}
.brand-hero{display:grid;grid-template-columns:1.05fr 1fr;align-items:stretch}
.brand-hero-copy{padding:48px;display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.brand-hero h1{font-size:64px;line-height:1.02;max-width:600px}
.brand-tagline{font-size:28px;line-height:1.2;font-weight:500}
.brand-hero-copy>p:not(.eyebrow):not(.brand-tagline){font-size:19px;line-height:1.5;max-width:540px}
.brand-hero-copy .line-link{font-size:16px;color:var(--paper);margin-top:0}
.brand-hero-photo{background:#fff;padding:40px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:28px;border:1px solid var(--line);min-width:0}
.brand-hero-photo img{width:100%;height:320px;object-fit:contain}
.brand-hero-photo figcaption{text-align:center;color:var(--muted)}
.brand-relationship{font-size:16px;color:var(--muted);padding-block:24px 0}
.brand-ranges{padding-block:80px;scroll-margin-top:110px}
.brand-section-heading{max-width:820px;display:grid;gap:20px;margin-bottom:40px}
.brand-landing h2{font-size:52px;line-height:1.05}
.brand-family-list{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--brand-gap)}
.brand-family{border-top:1px solid var(--line);padding-block:28px;display:flex;flex-direction:column;align-items:flex-start;gap:16px;min-width:0}
.brand-family h3{font-size:34px;line-height:1.12}
.brand-family>p{max-width:580px}
.brand-family-links{display:flex;flex-direction:column;gap:16px;margin-top:auto;padding-top:8px}
.brand-reference-link{font-size:16px;text-decoration:underline;text-underline-offset:4px}
.brand-reference-link span{white-space:nowrap}
.brand-family figure{width:100%;background:#fff;border:1px solid var(--line);margin-bottom:8px}
.brand-family img{display:block;width:100%;height:260px;object-fit:contain;padding:24px}
.brand-family-photos{gap:32px var(--brand-gap)}
.brand-family-photos .brand-family{border-top:0;padding-top:0}
.brand-family-photos .brand-family h3{font-size:44px}
.brand-resources{display:grid;grid-template-columns:1fr 1fr;gap:var(--brand-gap);padding-bottom:80px}
.brand-resources .eyebrow{margin-bottom:20px}
.brand-resource-list a{display:grid;gap:12px;border-top:1px solid var(--line);padding:24px 0}
.brand-resource-list a:last-child{border-bottom:1px solid var(--line)}
.brand-resource-list strong{font-size:21px;font-weight:500}
.brand-resource-list span{font-size:16px;color:var(--muted)}
.brand-support{padding-block:64px}
.brand-support>.wrap{display:grid;grid-template-columns:1fr 1fr;gap:var(--brand-gap)}
.brand-support .eyebrow{margin-bottom:20px}
.brand-support .mach-button{margin-top:28px}
.brand-other{padding-block:40px 56px;display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;font-size:16px}
.brand-other>div{display:flex;flex-wrap:wrap;gap:20px 32px}
.brand-landing a:hover{color:var(--red)}
.brand-landing .mach-button:hover{color:var(--paper)}
@media(max-width:1000px){.brand-landing{--brand-gap:32px}.brand-hero-copy{padding:32px}.brand-hero h1{font-size:52px}.brand-hero-photo{padding:28px}.brand-hero-photo img{height:270px}.brand-tagline{font-size:25px}}
@media(max-width:767px){.brand-breadcrumb{padding-block:20px}.brand-hero,.brand-family-list,.brand-resources,.brand-support>.wrap{grid-template-columns:1fr}.brand-hero-copy{padding:28px 24px;gap:20px}.brand-hero h1{font-size:46px}.brand-hero-copy>p:not(.eyebrow):not(.brand-tagline){font-size:18px}.brand-tagline{font-size:24px}.brand-hero-photo{padding:28px 24px;gap:20px}.brand-hero-photo img{height:230px}.brand-relationship{padding-top:20px}.brand-ranges{padding-block:48px}.brand-section-heading{gap:16px;margin-bottom:28px}.brand-landing h2{font-size:40px}.brand-family{padding-block:24px}.brand-family h3{font-size:30px}.brand-family img{height:250px}.brand-resources{padding-bottom:48px;gap:24px}.brand-support{padding-block:48px}.brand-support>.wrap{gap:28px}.brand-other{padding-block:32px 40px;gap:24px}.brand-other>div{gap:20px}.brand-family-links a{line-height:1.5}.brand-family-photos{gap:24px}.brand-hero-copy .mach-button{max-width:100%}}
