.recommend-layout{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)!important;max-width:100%}
.recommend-form,.recommend-result,.question-row,.question-block,.choice-grid{min-width:0;max-width:100%}
.question-row{grid-template-columns:repeat(2,minmax(0,1fr))}
.body-choice{grid-template-columns:repeat(4,minmax(0,1fr))}
.use-choice,.origin-choice{grid-template-columns:repeat(3,minmax(0,1fr))}
/* Global input styles give radio buttons width:100%; visually hidden radios must not create scroll overflow. */
.choice-grid input[type="radio"]{position:absolute!important;width:1px!important;height:1px!important;margin:0!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}

/* The source photo contains old CTA text baked into the upper area. Cover that strip completely. */
.recommend-hero{position:relative!important;overflow:hidden!important}
.recommend-hero::before{content:"";position:absolute;left:0;right:0;top:0;height:76px;z-index:1;pointer-events:none;background:linear-gradient(180deg,#071f39 0%,#071f39 72%,rgba(7,31,57,.97) 82%,rgba(7,31,57,0) 100%)}
.recommend-hero-inner{position:relative!important;z-index:2!important}

@media(max-width:900px){.recommend-layout{grid-template-columns:minmax(0,1fr)!important}.body-choice{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.question-row{grid-template-columns:minmax(0,1fr)}.body-choice,.use-choice,.origin-choice{grid-template-columns:repeat(2,minmax(0,1fr))}.recommend-hero::before{height:68px}}