html{scroll-behavior:smooth;scroll-padding-top:24px}body{padding-top:0}.plan-mp4-art .hand-note{background:transparent}.credibility-principles>li{cursor:pointer}.comic-sections .credibility-principles h4{font-size:clamp(13px,1.5vw,20px);overflow-wrap:anywhere}.comic-sections .credibility-principles li:has(.principle-details[open]){min-height:155px}.step-selection img{width:58px;height:58px}.comic-sections .service-plans .plan-pink h3{font-size:clamp(20px,2.5vw,35px)}.time-comic-vbuzz .time-case-label{font-size:clamp(12px,1.45vw,20px)}@media(max-width:700px){.comic-sections .credibility-principles h4{font-size:12px}.comic-sections .credibility-principles li:has(.principle-details[open]){min-height:225px}.comic-sections .credibility-principles p{font-size:11px}.step-selection img{width:45px;height:45px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.flow-steps .flow-phrase{display:inline-block;max-width:100%}
.comic-sections .plan-use-case{font-size:clamp(12px,1.2vw,17px);line-height:1.8;margin:12px 0 16px;overflow-wrap:anywhere}@media(max-width:700px){.comic-sections .plan-use-case{font-size:12px;margin:8px 0 12px}}
/* Mobile framing: crop the hero at the waist and focus the single-plan portrait on the face. */
@media(max-width:700px){
 html[data-design=f] .hero-inner{--character-top:clamp(365px,94vw,500px);height:calc(var(--character-top) + clamp(430px,128vw,615px));overflow:hidden}
 html[data-design=f] .hero-character{width:clamp(480px,150%,720px);height:auto;right:-17%;top:var(--character-top);bottom:auto;object-position:center}
 html[data-design=f] .hero-note{top:calc(var(--character-top) + clamp(180px,56vw,270px))}
 .comic-sections .plan-channel-art{height:auto;aspect-ratio:1;align-self:center}
 .comic-sections .plan-channel-art .plan-girl{width:270%;left:-108%;top:-58%}
 .comic-sections .plan-channel-art .plan-play{width:28px;height:28px;border-width:2px;border-radius:6px;right:3px;bottom:3px}
}
