/* MarketingSeoLab Storefront – trust bar, how it works, why choose us, testimonials, FAQ, support. */

/* trust bar */
.msl-trust{padding:20px 0;background:var(--msl-k);color:#fff}
.msl-trust__list{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.msl-trust__list li{display:flex;align-items:center;gap:14px;min-width:0}
.msl-trust__ico{display:flex;flex:none;align-items:center;justify-content:center;width:50px;height:50px;border-radius:50%;background:var(--msl-y);color:var(--msl-k)}
.msl-trust__txt{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.msl-trust__txt b{font-size:15.5px;font-weight:700}
.msl-trust__txt small{font-size:13px;color:#c4c4c4}
@media(min-width:520px){.msl-trust__list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1000px){.msl-trust__list{grid-template-columns:repeat(4,minmax(0,1fr))}.msl-trust{padding:24px 0}}

/* how it works */
.msl-how{background:linear-gradient(180deg,var(--msl-y-soft) 0%,#fff 75%)}
.msl-steps{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.msl-step{position:relative;display:flex;align-items:center;gap:16px;min-width:0}
.msl-step__ico{display:flex;flex:none;align-items:center;justify-content:center;width:72px;height:72px;border:2px solid var(--msl-y);border-radius:50%;background:var(--msl-y-soft);color:var(--msl-k)}
.msl-step__txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.msl-step__txt b{font-size:18px;font-weight:800}
.msl-step__txt span{font-size:14px;color:var(--msl-mut)}
@media(min-width:900px){
	.msl-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:48px}
	.msl-step:not(:last-child)::after{content:"";position:absolute;right:-34px;top:50%;width:20px;height:20px;margin-top:-10px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E")}
}

/* why choose us */
.msl-why__grid{display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:26px}
.msl-why__copy .msl-head{margin-bottom:16px}
.msl-why__copy .msl-head__desc{font-size:14.5px}
.msl-feats{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.msl-feat{display:flex;align-items:center;gap:12px;height:100%;min-width:0;padding:14px;border:1px solid var(--msl-line);border-radius:14px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.03)}
.msl-feat__ico{display:flex;flex:none;align-items:center;justify-content:center;width:46px;height:46px;border-radius:12px;background:var(--msl-y-soft);color:var(--msl-k)}
.msl-feat__txt{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.msl-feat__txt b{font-size:14.5px;font-weight:700}
.msl-feat__txt small{font-size:12.5px;color:var(--msl-mut)}
@media(min-width:480px){.msl-feats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:960px){.msl-why__grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.5fr);gap:36px}}
@media(min-width:1100px){.msl-feats{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* testimonials (real data only) */
.msl-arrows{display:flex;gap:8px}
.msl-arrow{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:1.5px solid var(--msl-line);border-radius:50%;background:#fff;color:var(--msl-k);cursor:pointer}
.msl-arrow:last-child{background:var(--msl-y);border-color:var(--msl-y)}
.msl-arrow:hover{border-color:var(--msl-y-d)}
.msl-i--l{transform:rotate(90deg)}.msl-i--r{transform:rotate(-90deg)}
.msl-testi__track{display:flex;gap:16px;padding:4px 2px 10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.msl-testi__track::-webkit-scrollbar{display:none}
.msl-tcard{flex:0 0 min(88%,380px);scroll-snap-align:start;padding:18px;border:1px solid var(--msl-line);border-radius:16px;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.msl-tcard__top{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.msl-tcard__top>div{flex:1;min-width:0}
.msl-testi__av{width:52px;height:52px;border-radius:50%;object-fit:cover}
.msl-tcard__name{display:block;font-size:15px;font-weight:700}
.msl-tcard__role{display:block;font-size:12.5px;color:var(--msl-mut)}
.msl-tcard__text{margin-top:12px;font-size:14.5px;color:#2b2b2b;overflow-wrap:anywhere}
@media(min-width:900px){.msl-tcard{flex-basis:calc((100% - 32px)/3)}}

/* FAQ */
.msl-faq{display:flex;flex-direction:column;gap:10px}
.msl-faq__item{border:1px solid var(--msl-line);border-radius:12px;background:#fff;transition:border-color .15s}
.msl-faq__item[open]{border-color:var(--msl-y-d)}
.msl-faq__q{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:56px;padding:12px 18px;font-weight:600;font-size:15px;line-height:1.35;cursor:pointer;list-style:none}
.msl-faq__q::-webkit-details-marker{display:none}
.msl-faq__q span:first-child{min-width:0;overflow-wrap:anywhere}
.msl-faq__pm{position:relative;flex:none;width:16px;height:16px}
.msl-faq__pm::before,.msl-faq__pm::after{content:"";position:absolute;left:0;top:7px;width:16px;height:2px;border-radius:2px;background:var(--msl-k);transition:transform .2s}
.msl-faq__pm::after{transform:rotate(90deg)}
.msl-faq__item[open] .msl-faq__pm::after{transform:rotate(0)}
.msl-faq__a{padding:0 18px 16px;font-size:14.5px;color:var(--msl-mut)}
.msl-faq__a p+p{margin-top:8px}
.msl-faq__all{margin-top:18px}
.msl-faq-sec{padding-top:0}

/* support (yellow card) */
.msl-support{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;overflow:hidden;padding:clamp(20px,3vw,32px);border-radius:20px;background:linear-gradient(135deg,#FFD60A 0%,#FFE24F 100%)}
.msl-support__copy{flex:1;min-width:0}
.msl-support__label{display:block;font:800 13px/1.3 var(--msl-font);letter-spacing:.04em;text-transform:uppercase}
.msl-support__title{margin-top:4px;font:800 clamp(24px,3vw,32px)/1.15 var(--msl-font)}
.msl-support__desc{margin-top:6px;font-size:15px;color:#2a2a2a}
.msl-support__btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.msl-support__img{flex:none;width:clamp(96px,24%,190px);height:auto;object-fit:contain}
@media(max-width:420px){.msl-support__img{display:none}}