/* One final breakpoint contract. Legacy pseudo-arrows never participate. */
.reference-design #flow .journey>li::before,
.reference-design #flow .journey>li::after{content:none!important;display:none!important}
.reference-design #flow .journey>li{position:relative;min-width:0}
.reference-design #flow .journey-label{display:block;width:100%;text-align:inherit;margin:8px 0;line-height:1.8;position:static;transform:none}
.reference-design #flow .journey-content{min-width:0;position:static;transform:none}
.reference-design #flow .journey-connector{position:absolute;color:#df2944;font-size:23px;font-weight:700;line-height:24px;text-align:center;width:24px;height:24px;pointer-events:none}
@media(min-width:1001px){
.reference-design #flow .journey{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:32px;max-width:none;width:100%;align-items:stretch}
.reference-design #flow .journey>li{display:flex;flex-direction:column;align-items:center;gap:6px}
.reference-design #flow .journey-content{grid-column:auto;grid-row:auto;text-align:center;width:100%}
.reference-design #flow .journey-connector{display:block;right:-28px;left:auto;top:108px;bottom:auto;transform:translateY(-50%)}
}
@media(max-width:1000px){
.reference-design #flow .journey{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;max-width:680px;width:100%;margin-inline:auto}
.reference-design #flow .journey>li{display:grid;grid-template-columns:112px minmax(0,1fr);grid-template-rows:auto auto;gap:8px 16px;padding:20px 16px;align-items:center}
.reference-design #flow .journey-number{grid-column:1;grid-row:1;justify-self:start;width:fit-content}
.reference-design #flow .journey-icon{grid-column:1;grid-row:2;width:112px;height:100px;margin:0}
.reference-design #flow .journey-content{grid-column:2;grid-row:1 / 3;text-align:left;width:100%}
.reference-design #flow .journey-connector{display:none}
}
@media(max-width:374px){
.reference-design #flow .journey>li{grid-template-columns:92px minmax(0,1fr);gap:8px 12px;padding:18px 12px}
.reference-design #flow .journey-icon{width:92px;height:92px}
}
/* Start every pricing card at the same top edge and reserve the same artwork row. */
.reference-design #pricing .plans{display:grid;align-items:stretch!important}
.reference-design #pricing .plans>.plan-card{align-self:stretch!important;margin-block:0!important;transform:none!important;justify-content:flex-start;min-width:0}
.reference-design #pricing .plan-card>.plan-label{display:flex;align-items:center;justify-content:center;min-height:52px;box-sizing:border-box}
.reference-design #pricing .plan-card>img{width:200px;height:140px;max-width:100%;object-fit:contain;margin:4px auto 12px;padding:0}
.reference-design #pricing .plan-card>h3{min-height:54px;display:flex;align-items:center;justify-content:center;text-align:center;margin:0}
.reference-design #pricing .plan-card>.model-price+p{min-height:48px}
@media(max-width:800px){
.reference-design #pricing .plan-card>img{width:220px;height:150px;margin:4px auto 10px}
.reference-design #pricing .plan-card>h3{min-height:0;display:block;margin:3px 0}
.reference-design #pricing .plan-card>.model-price+p{min-height:0}
}
@media(max-width:374px){.reference-design #pricing .plan-card>img{width:195px;height:136px}}
/* Keep the right-hand photo edge covered while leaving more space beside the badge. */
@media(min-width:801px){.reference-design .hero-slides .hero-business-image{left:12%;width:91%;object-position:50% 35%}}
@media(max-width:800px){.reference-design .hero-slides .hero-business-image{object-position:84% 45%}}
.reference-design #pricing .plan-card:last-child>img{object-fit:scale-down}
