.phero{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;background:#fff;border-radius:20px;padding:26px;margin:18px 0 10px;box-shadow:0 4px 18px rgba(26,60,52,.06)}
.phero .phimg{margin:0;order:2}.phero .phimg img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:16px}
.phero h1{font-size:2.2rem;line-height:1.15;margin:0 0 .4rem}.phero .hline{font-size:1.2rem;margin:0 0 .6rem}
.phero.guide{grid-template-columns:1fr;padding:0 0 22px;overflow:hidden;gap:16px}.phero.guide .phimg{order:0}.phero.guide .phimg img{aspect-ratio:4/1;border-radius:20px 20px 0 0}.phero.guide .phtxt{padding:0 26px}
.phero + .crumbs, .phero + nav.crumbs{margin-top:6px}
@media(max-width:700px){main.wrap>.phero{margin:0 -16px 10px;border-radius:0 0 22px 22px;padding:0 0 20px;grid-template-columns:1fr;gap:14px;overflow:hidden}
.phero .phimg{order:0}.phero .phimg img{aspect-ratio:4/3;border-radius:0}.phero.guide .phimg img{aspect-ratio:16/9;border-radius:0}
.phero .phtxt{padding:0 18px;text-align:center}.phero h1{font-size:1.65rem}.phero .hline{font-size:1.05rem}.phero .herobtns .btn{display:flex;width:100%;margin:8px 0;justify-content:center}}

@media(max-width:700px){.phero + .crumbs ol,.phero ~ .crumbs ol,main .crumbs ol{flex-wrap:nowrap;white-space:nowrap;overflow:hidden;margin:4px 0 10px}
main .crumbs li{flex:0 0 auto}main .crumbs li[aria-current]{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}}
.phero.hub.spot .phimg img{object-position:40% 60%}