.hapo-traffic-user-faq{position:relative;isolation:isolate;overflow:hidden;background:#fff;color:#111;font-family:Manrope,sans-serif}
.hapo-traffic-user-faq *{box-sizing:border-box}
.hapo-traffic-user-faq--full{left:50%;width:100vw;margin-left:-50vw}
.hapo-traffic-user-faq--container{width:100%}
.hapo-traffic-user-faq__decor{position:absolute;z-index:-1;pointer-events:none;opacity:.28}
.hapo-traffic-user-faq__decor--top-right{top:-3px;right:-7px;width:420px;height:auto}
.hapo-traffic-user-faq__decor--bottom-left{bottom:-125px;left:-65px;width:390px;height:auto}
.hapo-traffic-user-faq__decor--top-right path{transform-origin:70% 30%;animation:hapo-tufaq-float 8s ease-in-out infinite alternate}
.hapo-traffic-user-faq__decor--bottom-left path{transform-origin:30% 70%;animation:hapo-tufaq-float 10s ease-in-out -2s infinite alternate-reverse}
@keyframes hapo-tufaq-float{from{transform:translateY(0) scale(1);opacity:.72}to{transform:translateY(14px) scale(1.035);opacity:1}}
.hapo-traffic-user-faq__inner{position:relative;z-index:1;width:min(1440px,calc(100% - 48px));margin:auto;padding:120px 0 50px}
.hapo-traffic-user-faq__header{text-align:center}
.hapo-traffic-user-faq__header h2,.hapo-traffic-user-faq__header h3{margin:0;color:#050505;font-size:44px;font-weight:800;line-height:1.2}
.hapo-traffic-user-faq__header::after{display:block;width:150px;height:4px;margin:26px auto 0;background:#05cc79;content:""}
.hapo-traffic-user-faq__layout{display:grid;grid-template-columns:430px minmax(0,1fr);gap:25px;align-items:end;margin-top:67px}
.hapo-traffic-user-faq__media{display:flex;align-items:flex-end;height:500px;overflow:visible}
.hapo-traffic-user-faq__image{display:block;width:590px;max-width:none;height:auto;margin-left:-95px;object-fit:contain}
.hapo-traffic-user-faq__list{align-self:start;margin:0;padding:0;list-style:none}
.hapo-traffic-user-faq__item{border-bottom:1px solid #e1e3e5}
.hapo-traffic-user-faq__item details{padding:0 24px}
.hapo-traffic-user-faq__item summary{display:flex;min-height:76px;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;list-style:none;color:#111;font-size:21px;font-weight:700;line-height:1.35}
.hapo-traffic-user-faq__item summary::-webkit-details-marker{display:none}
.hapo-traffic-user-faq__item summary svg{flex:none;transition:transform .22s ease}
.hapo-traffic-user-faq__item details[open] summary svg{transform:rotate(180deg)}
.hapo-traffic-user-faq__item summary:focus-visible{outline:2px solid #0acb77;outline-offset:4px;border-radius:3px}
.hapo-traffic-user-faq__answer{padding:0 0 22px;color:#777;font-size:16px;line-height:1.55}
.hapo-traffic-user-faq__answer p{margin:0}
@media(max-width:1100px){.hapo-traffic-user-faq__layout{grid-template-columns:34% minmax(0,1fr)}.hapo-traffic-user-faq__image{width:135%;margin-left:-15%}.hapo-traffic-user-faq__media{height:auto}.hapo-traffic-user-faq__item summary{font-size:18px}}
@media(max-width:700px){.hapo-traffic-user-faq__inner{width:calc(100% - 36px);padding:70px 0}.hapo-traffic-user-faq__header h2,.hapo-traffic-user-faq__header h3{font-size:36px}.hapo-traffic-user-faq__layout{display:flex;flex-direction:column;gap:25px;margin-top:38px}.hapo-traffic-user-faq__media{order:0;align-self:center;width:min(340px,100%);height:auto;overflow:hidden}.hapo-traffic-user-faq__image{width:100%;margin:0}.hapo-traffic-user-faq__list{order:1;width:100%}.hapo-traffic-user-faq__item details{padding:0 6px}.hapo-traffic-user-faq__item summary{min-height:70px;font-size:17px}.hapo-traffic-user-faq__answer{font-size:14px}.hapo-traffic-user-faq__decor--top-right{width:210px;right:-45px}.hapo-traffic-user-faq__decor--bottom-left{width:230px;left:-65px;bottom:-80px}}
@media(prefers-reduced-motion:reduce){.hapo-traffic-user-faq__decor path{animation:none;opacity:1;transform:none}.hapo-traffic-user-faq__item summary svg{transition:none}}

/* Mobile reference correction — 2026-10-20 (Traffic user.jpg, 391×25415, 375px content). Measured from the supplied mobile frame; local values, not shared tokens. */
.hapo-traffic-user-faq .hapo-traffic-user-faq__list>*{margin-left:0}
@media(max-width:650px){.hapo-traffic-user-faq__header h2,.hapo-traffic-user-faq__header h3{font-size:26px}.hapo-traffic-user-faq__header::after{width:80px;margin-top:16px}}
