/* UX V2.1 hero composition option B: 58% yellow / ~40% photo. */
.hero-reference{position:relative;isolation:isolate;height:clamp(350px,23vw,390px);min-height:350px;display:flex;align-items:stretch;overflow:hidden;background:#ffd400}
.hero-copy-wrap{position:relative;z-index:2;width:min(1120px,calc(100% - 40px));margin-inline:auto;display:flex;align-items:center;padding:30px 0}
.hero-copy{width:56%;max-width:620px}
.hero-copy .eyebrow{margin-bottom:10px;font-size:10px;letter-spacing:.15em}
.hero-copy h1{max-width:620px;margin:0 0 12px;font-size:clamp(40px,3.55vw,58px);line-height:.98;letter-spacing:-.055em}
.hero-copy .lead{max-width:590px;margin:0;font-size:clamp(15px,1.2vw,18px);line-height:1.32;color:#26271f}
.hero-copy .lead br{display:block}
.hero-copy .hero-actions{margin-top:16px}
.hero-copy .hero-actions .button{min-height:42px;padding:8px 21px;font-size:13px;gap:10px}
.hero-benefits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-width:620px;margin:16px 0 0;padding:0;list-style:none}
.hero-benefits li{display:flex;align-items:center;gap:8px;min-width:0}
.hero-benefits li>span{flex:none;width:22px;height:22px;display:grid;place-items:center;border:2px solid #171815;border-radius:6px;font-size:12px;font-weight:900;line-height:1}
.hero-benefits small{font-size:clamp(9px,.72vw,11px);line-height:1.2;font-weight:650}
.hero-photo{position:absolute;z-index:1;inset:0 0 0 58%;clip-path:polygon(0 0,100% 0,100% 100%,9.5% 100%)}
.hero-photo>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center center}
@media(max-width:1100px) and (min-width:601px){.hero-copy{width:58%;max-width:590px}.hero-copy h1{font-size:clamp(38px,4vw,48px)}.hero-benefits{gap:5px}.hero-benefits li{gap:5px}.hero-benefits small{font-size:9px}.hero-photo{left:56%}}
@media(max-width:600px){.hero-reference{height:auto;min-height:0;display:flex;flex-direction:column}.hero-copy-wrap{display:block;width:100%;padding:25px 20px 20px}.hero-copy{width:100%;max-width:none}.hero-copy .eyebrow{font-size:9px;margin-bottom:10px}.hero-copy h1{font-size:clamp(33px,9vw,38px);line-height:1.02;margin-bottom:11px}.hero-copy h1 br{display:block}.hero-copy .lead{font-size:15px;line-height:1.35}.hero-copy .lead br{display:block}.hero-copy .hero-actions{margin-top:16px}.hero-copy .hero-actions .button{width:auto;min-height:46px}.hero-benefits{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 9px;margin-top:16px}.hero-benefits small{font-size:10px}.hero-photo{position:relative;inset:auto;order:2;width:100%;height:230px;clip-path:none}.hero-photo>img{object-position:center 48%}}

