.qt-buymini,
.qt-buymini *{ box-sizing:border-box; }
.qt-buymini{
--qtm-acc:  var(--qt-buy-accent, var(--accent, #6366f1));
--qtm-soft: var(--qt-buy-accent-soft, rgba(99,102,241,.16));
--qtm-ink:#0f172a;
--qtm-muted:#475569;
--qtm-radius:20px;
--qtm-radius-sm:16px;
--qtm-pad:clamp(12px,1.6vw,16px);
--qtm-gap:clamp(10px,1.6vw,14px);
width:100%;
margin:clamp(14px,2.2vw,22px) auto 0;
font-family:inherit;
content-visibility:auto;
contain-intrinsic-size:260px;
}
.qt-buymini__shell{
width:100%;
display:grid;
grid-template-columns: 1fr minmax(260px, 360px);
gap:var(--qtm-gap);
padding:var(--qtm-pad);
border-radius:var(--qtm-radius);
position:relative;
overflow:hidden;
background:
radial-gradient(600px 180px at 0% 0%, rgba(255,255,255,.92), transparent 60%),
radial-gradient(600px 180px at 100% 0%, rgba(255,255,255,.92), transparent 60%),
rgba(255,255,255,.965);
border:1px solid color-mix(in srgb, var(--qtm-acc) 16%, rgba(15,18,36,.06));
box-shadow:
0 18px 46px rgba(15,18,36,.10),
0 0 0 1px rgba(15,18,36,.03);
}
.qt-buymini__shell::before{
content:"";
position:absolute;
left:0; right:0; top:0;
height:2px;
background:linear-gradient(90deg,
rgba(255,255,255,0) 0%,
var(--qtm-acc) 22%,
var(--qtm-acc) 78%,
rgba(255,255,255,0) 100%);
opacity:.9;
}
.qt-buymini__shell::after{
content:"";
position:absolute;
right:-70px;
top:-70px;
width:160px;
height:160px;
background:
radial-gradient(circle,
color-mix(in srgb, var(--qtm-acc) 18%, transparent) 0%,
transparent 68%);
opacity:.85;
pointer-events:none;
}
.qt-buymini__left{ position:relative; z-index:1; min-width:0; }
.qt-buymini__head{
display:flex;
align-items:flex-start;
gap:10px;
margin:0 0 8px;
}
.qt-buymini__icon{
width:38px;
height:38px;
border-radius:14px;
display:flex;
align-items:center;
justify-content:center;
background:radial-gradient(circle at 30% 0, rgba(255,255,255,.97), var(--qtm-soft));
color:var(--qtm-acc);
border:1px solid rgba(15,18,36,.06);
box-shadow:0 8px 18px rgba(15,18,36,.10);
flex:0 0 auto;
}
.qt-buymini__badge{
display:inline-flex;
align-items:center;
gap:6px;
padding:6px 12px;
border-radius:999px;
font-size:.74rem;
font-weight:900;
letter-spacing:.06em;
text-transform:uppercase;
background:
linear-gradient(135deg,
color-mix(in srgb, var(--qtm-acc) 16%, rgba(255,255,255,.92)),
rgba(255,255,255,.92));
color:color-mix(in srgb, var(--qtm-acc) 78%, #0b1220);
border:1px solid color-mix(in srgb, var(--qtm-acc) 26%, rgba(148,163,184,.22));
box-shadow:
0 10px 22px rgba(15,18,36,.06),
0 0 0 4px color-mix(in srgb, var(--qtm-acc) 8%, transparent);
margin:0 0 6px;
}
.qt-buymini__title{
margin:0 0 2px;
color:var(--qtm-ink);
font-weight:900;
letter-spacing:-.012em;
line-height:1.18;
font-size:clamp(1.00rem,.92rem + .34vw,1.20rem);
}
.qt-buymini__intro{
margin:0;
max-width:62ch;
color:var(--qtm-muted);
font-size:clamp(.86rem,.84rem + .12vw,.92rem);
line-height:1.45;
}
.qt-buymini__steps{
margin:10px 0 0;
padding:0 0 0 6px;
list-style:none;
display:flex;
flex-direction:column;
gap:6px;
position:relative;
}
.qt-buymini__steps::before{
content:"";
position:absolute;
left:18px;
top:6px;
bottom:6px;
width:2px;
border-radius:999px;
background:linear-gradient(180deg,
color-mix(in srgb, var(--qtm-acc) 55%, transparent),
color-mix(in srgb, var(--qtm-acc) 18%, transparent));
opacity:.75;
}
.qt-buymini__step{
display:flex;
gap:10px;
align-items:flex-start;
padding:9px 10px;
border-radius:14px;
background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.82));
border:1px solid color-mix(in srgb, var(--qtm-acc) 10%, rgba(15,18,36,.06));
box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
transition: transform .12s ease, box-shadow .14s ease, border-color .14s ease;
will-change: transform;
}
.qt-buymini__step:hover{
transform:translateY(-1px);
border-color:color-mix(in srgb, var(--qtm-acc) 18%, rgba(15,18,36,.10));
box-shadow:
0 16px 34px rgba(15,18,36,.08),
inset 0 1px 0 rgba(255,255,255,.72);
}
.qt-buymini__num{
width:24px;
height:24px;
border-radius:999px;
display:flex;
align-items:center;
justify-content:center;
font-weight:900;
font-size:.76rem;
color:#fff;
background:linear-gradient(135deg,
var(--qtm-acc),
color-mix(in srgb, var(--qtm-acc) 30%, #0b1220));
box-shadow:
0 0 0 4px color-mix(in srgb, var(--qtm-acc) 14%, transparent),
0 10px 24px rgba(15,18,36,.12);
flex:0 0 auto;
margin-top:1px;
}
.qt-buymini__text{
margin:0;
color:#334155;
font-size:clamp(.88rem,.86rem + .10vw,.92rem);
line-height:1.45;
}
.qt-buymini__note{
margin-top:8px;
padding:8px 10px;
border-radius:14px;
background:rgba(255,255,255,.78);
border:1px dashed rgba(15,18,36,.16);
color:#334155;
font-size:clamp(.86rem,.84rem + .10vw,.91rem);
line-height:1.45;
}
.qt-buymini__note b{ color:var(--qtm-ink); }
.qt-buymini__right{
position:relative;
z-index:1;
align-self:start;
width:100%;
aspect-ratio: 16 / 10;
display:flex;
align-items:stretch;
justify-content:stretch;
}
.qt-buymini__right::before{
/*content:"Quantaps";*/
position:absolute;
left:10px;
top:10px;
z-index:2;
padding:6px 10px;
border-radius:999px;
font-size:.74rem;
font-weight:900;
letter-spacing:-.01em;
color:#0b1220;
background:rgba(255,255,255,.88);
border:1px solid rgba(148,163,184,.22);
box-shadow:0 10px 22px rgba(15,18,36,.10);
backdrop-filter: blur(8px);
}
.qt-buymini__img{
width:100%;
height:100%;
display:block;
border-radius:18px;
object-fit:cover;
background:rgba(255,255,255,.65);
border:1px solid color-mix(in srgb, var(--qtm-acc) 14%, rgba(15,18,36,.06));
box-shadow:
0 0 0 4px color-mix(in srgb, var(--qtm-acc) 14%, transparent),
0 18px 44px rgba(15,18,36,.12);
}
@media (max-width:900px){
.qt-buymini__shell{ grid-template-columns:1fr; }
.qt-buymini__right{ order:2; aspect-ratio:16/9; }
.qt-buymini__left{ order:1; }
}
@media (max-width:640px){
.qt-buymini{
margin-top:14px;
contain-intrinsic-size:300px;
}
.qt-buymini__shell{
border-radius:var(--qtm-radius-sm);
padding:12px;
}
.qt-buymini__icon{
width:34px; height:34px;
border-radius:12px;
}
.qt-buymini__head{ gap:9px; margin-bottom:6px; }
.qt-buymini__steps{ margin-top:8px; }
.qt-buymini__step{ padding:8px 9px; }
.qt-buymini__num{ width:22px; height:22px; font-size:.74rem; }
.qt-buymini__note{ padding:8px 9px; }
.qt-buymini__right::before{
font-size:.70rem;
padding:5px 9px;
}
.qt-buymini__steps::before{ left:17px; }
}
@media (prefers-reduced-motion: reduce){
.qt-buymini__step{ transition:none; }
.qt-buymini__step:hover{ transform:none; }
}
.qx-reviews,
.qx-reviews *{ box-sizing:border-box; }
.qx-reviews{
--qx-ac: var(--qt-buy-accent, var(--accent, #6a7eff));
--qx-soft: var(--qt-buy-accent-soft, rgba(99,102,241,.18));
--qx-ink:#0f172a;
--qx-muted:#475569;
--qx-radius:22px;
--qx-card-radius:16px;
width:100%;
margin: clamp(22px, 4.2vw, 36px) 0 0;
position:relative;
isolation:isolate;
overflow:visible;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
}
.qx-reviews::before{
content:"";
position:absolute;
left:50%;
transform:translateX(-50%);
width:100vw;
top:-18px;
bottom:-18px;
z-index:-2;
pointer-events:none;
background:
linear-gradient(90deg,
color-mix(in srgb, var(--qx-ac) 74%, #ffffff) 0%,
color-mix(in srgb, var(--qx-ac) 52%, #ffffff) 16%,
color-mix(in srgb, var(--qx-ac) 52%, #ffffff) 84%,
color-mix(in srgb, var(--qx-ac) 74%, #ffffff) 100%
),
linear-gradient(180deg,
rgba(255,255,255,.42) 0%,
rgba(255,255,255,0) 62%
),
radial-gradient(1100px 420px at 10% 45%,
color-mix(in srgb, var(--qx-ac) 52%, transparent),
transparent 72%
),
radial-gradient(1100px 420px at 90% 55%,
color-mix(in srgb, var(--qx-ac) 48%, transparent),
transparent 72%
);
filter:saturate(1.12);
}
.qx-reviews::after{
content:"";
position:absolute;
left:50%;
transform:translateX(-50%);
width:100vw;
top:-18px;
bottom:-18px;
z-index:-3;
pointer-events:none;
background: var(--qx-ac);
opacity:.08;
}
.qx-reviews__shell{
width:100%;
padding: clamp(14px,2.2vw,20px);
border-radius:var(--qx-radius);
position:relative;
overflow:hidden;
background:
radial-gradient(circle at 0 0, rgba(255,255,255,.96), transparent 55%),
radial-gradient(circle at 100% 0, rgba(255,255,255,.99), transparent 55%),
rgba(255,255,255,.975);
border:1px solid color-mix(in srgb, var(--qx-ac) 20%, rgba(15,18,36,.06));
box-shadow:
0 18px 46px rgba(15,18,36,.10),
0 0 0 1px rgba(15,18,36,.03);
}
.qx-reviews__shell::before{
content:"";
position:absolute;
left:0; right:0; top:0;
height:3px;
background:linear-gradient(90deg,
rgba(255,255,255,0) 0%,
var(--qx-ac) 18%,
var(--qx-ac) 82%,
rgba(255,255,255,0) 100%);
opacity:.96;
}
.qx-reviews__shell::after{
content:"“";
position:absolute;
left:14px;
top:2px;
font-size:86px;
line-height:1;
font-weight:900;
color: color-mix(in srgb, var(--qx-ac) 18%, rgba(148,163,184,.10));
pointer-events:none;
z-index:0;
filter: blur(.2px);
}
.qx-reviews__inner{
position:relative;
z-index:1;
}
.qx-reviews__head{
display:flex;
flex-wrap:wrap;
align-items:center;
justify-content:space-between;
gap:10px 16px;
margin-bottom:clamp(10px, 2.2vw, 16px);
}
.qx-reviews__title{
margin:0;
display:inline-flex;
align-items:center;
gap:8px;
padding:7px 12px;
border-radius:999px;
font-size:.78rem;
font-weight:900;
letter-spacing:.06em;
text-transform:uppercase;
background: color-mix(in srgb, var(--qx-ac) 16%, rgba(255,255,255,.92));
border:1px solid color-mix(in srgb, var(--qx-ac) 26%, rgba(148,163,184,.22));
color: color-mix(in srgb, var(--qx-ac) 78%, #111827);
box-shadow:
0 10px 22px rgba(15,18,36,.06),
0 0 0 4px color-mix(in srgb, var(--qx-ac) 10%, transparent);
}
.qx-reviews__meta{ text-align:right; }
.qx-reviews__meta-pill{
display:inline-flex;
align-items:center;
gap:10px;
padding:8px 12px;
border-radius:999px;
background:rgba(255,255,255,.96);
border:1px solid rgba(148,163,184,.32);
box-shadow:0 10px 22px rgba(15,18,36,.06);
}
.qx-reviews__stars{
display:flex;
gap:3px;
margin:0;
color:#facc15;
font-size:.95rem;
filter: drop-shadow(0 1px 0 rgba(0,0,0,.04));
}
.qx-reviews__summary{
margin:0;
font-size:.83rem;
font-weight:700;
color: color-mix(in srgb, var(--qx-ac) 18%, #334155);
}
.qx-reviews__grid{
display:grid;
grid-template-columns:repeat(2, minmax(0,1fr));
gap:12px 14px;
max-height:clamp(320px, 34vh, 380px);
overflow:auto;
overscroll-behavior:contain;
padding-right:6px;
-webkit-mask-image: linear-gradient(to bottom,
transparent 0px, #000 16px,
#000 calc(100% - 16px), transparent 100%);
mask-image: linear-gradient(to bottom,
transparent 0px, #000 16px,
#000 calc(100% - 16px), transparent 100%);
}
.qx-reviews__grid::-webkit-scrollbar{ width:8px; }
.qx-reviews__grid::-webkit-scrollbar-track{ background:transparent; }
.qx-reviews__grid::-webkit-scrollbar-thumb{
border-radius:999px;
background: linear-gradient(180deg,
color-mix(in srgb, var(--qx-ac) 34%, rgba(148,163,184,.18)),
color-mix(in srgb, var(--qx-ac) 18%, rgba(148,163,184,.14))
);
}
.qx-reviews__card{
position:relative;
overflow:hidden;
border-radius:var(--qx-card-radius);
padding:14px 16px 16px;
border:1px solid color-mix(in srgb, var(--qx-ac) 14%, rgba(15,18,36,.06));
background:
linear-gradient(135deg,
rgba(255,255,255,1) 0%,
rgba(255,255,255,.98) 62%,
color-mix(in srgb, var(--qx-ac) 12%, rgba(255,255,255,.94)) 100%);
box-shadow:
0 14px 32px rgba(15,18,36,.06),
inset 0 1px 0 rgba(255,255,255,.65);
transition: transform .14s ease, box-shadow .16s ease, border-color .16s ease;
will-change: transform;
}
.qx-reviews__card::before{
content:"";
position:absolute;
left:0; right:0; top:0;
height:3px;
background:linear-gradient(90deg,
rgba(255,255,255,0) 0%,
var(--qx-ac) 18%,
var(--qx-ac) 82%,
rgba(255,255,255,0) 100%);
opacity:.95;
}
.qx-reviews__card::after{
content:"";
position:absolute;
inset:-2px;
background: radial-gradient(520px 180px at 20% 0%,
color-mix(in srgb, var(--qx-ac) 18%, transparent),
transparent 60%);
opacity:.65;
pointer-events:none;
}
.qx-reviews__card:hover{
transform: translateY(-2px);
border-color: color-mix(in srgb, var(--qx-ac) 28%, rgba(15,18,36,.06));
box-shadow:
0 22px 48px rgba(15,18,36,.10),
inset 0 1px 0 rgba(255,255,255,.72);
}
.qx-reviews__card-head{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:10px;
margin-bottom:6px;
}
.qx-reviews__name{
margin:0;
font-size:.95rem;
font-weight:850;
color:#0b1220;
letter-spacing:-.01em;
}
.qx-reviews__role{
margin:2px 0 0;
font-size:.78rem;
color:#6b7280;
}
.qx-reviews__rating{
display:flex;
gap:2px;
color:var(--qx-ac);
font-size:.78rem;
}
.qx-reviews__rating .fa-regular.fa-star{ color:#d1d5db; }
.qx-reviews__text{
margin:0;
font-size:.88rem;
line-height:1.55;
color:#334155;
}
@media (prefers-reduced-motion: reduce){
.qx-reviews__card{ transition:none; }
.qx-reviews__card:hover{ transform:none; }
}
@media (max-width:900px){
.qx-reviews__head{
flex-direction:column;
align-items:flex-start;
text-align:left;
}
.qx-reviews__meta{ text-align:left; }
.qx-reviews__grid{
grid-template-columns:1fr;
max-height:420px;
}
.qx-reviews__shell::after{ font-size:64px; top:2px; }
}
@media (max-width:640px){
.qx-reviews{ margin-top:18px; }
.qx-reviews::before,
.qx-reviews::after{
top:-12px;
bottom:-12px;
}
.qx-reviews__shell{
border-radius:18px;
padding:12px 12px 14px;
}
.qx-reviews__title{ padding:6px 10px; font-size:.74rem; }
.qx-reviews__meta-pill{ padding:7px 10px; gap:8px; }
.qx-reviews__summary{ font-size:.80rem; }
.qx-reviews__grid{
max-height:390px;
gap:10px;
padding-right:4px;
-webkit-mask-image: linear-gradient(to bottom,
transparent 0px, #000 14px,
#000 calc(100% - 14px), transparent 100%);
mask-image: linear-gradient(to bottom,
transparent 0px, #000 14px,
#000 calc(100% - 14px), transparent 100%);
}
.qx-reviews__card{
border-radius:14px;
padding:12px 12px 13px;
}
.qx-reviews__name{ font-size:.92rem; }
.qx-reviews__text{ font-size:.86rem; }
}
.qx-reviews__head--pro{
display:grid;
grid-template-columns: auto 1fr auto;
align-items:center;
gap:12px 14px;
}
.qx-reviews__center{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
min-width:0;
text-align:center;
}
.qx-reviews__title--hero{
justify-content:center;
padding:9px 14px;
font-size:.82rem;
letter-spacing:.08em;
position:relative;
}
.qx-reviews__title--hero::after{
content:"";
position:absolute;
inset:-6px;
border-radius:999px;
background: radial-gradient(120px 40px at 50% 50%,
color-mix(in srgb, var(--qx-ac) 22%, transparent),
transparent 65%);
pointer-events:none;
opacity:.85;
}
.qx-reviews__sub{
margin:6px 0 0;
font-size:.84rem;
font-weight:600;
color: color-mix(in srgb, var(--qx-ac) 14%, #334155);
}
.qx-reviews__cta{
display:inline-flex;
align-items:center;
gap:10px;
padding:10px 12px;
border-radius:999px;
text-decoration:none;
background:
linear-gradient(135deg,
color-mix(in srgb, var(--qx-ac) 18%, rgba(255,255,255,.92)),
rgba(255,255,255,.96));
border:1px solid color-mix(in srgb, var(--qx-ac) 26%, rgba(148,163,184,.22));
box-shadow:
0 10px 22px rgba(15,18,36,.06),
0 0 0 4px color-mix(in srgb, var(--qx-ac) 8%, transparent);
color:#0b1220;
font-weight:800;
line-height:1;
white-space:nowrap;
transition: transform .14s ease, box-shadow .16s ease, border-color .16s ease;
}
.qx-reviews__cta-ico{
width:34px;
height:34px;
border-radius:999px;
display:inline-flex;
align-items:center;
justify-content:center;
background: color-mix(in srgb, var(--qx-ac) 16%, rgba(255,255,255,.94));
border:1px solid color-mix(in srgb, var(--qx-ac) 24%, rgba(148,163,184,.18));
color: color-mix(in srgb, var(--qx-ac) 70%, #111827);
}
.qx-reviews__cta-txt{
font-size:.86rem;
letter-spacing:.01em;
}
.qx-reviews__cta:hover{
transform: translateY(-1px);
border-color: color-mix(in srgb, var(--qx-ac) 34%, rgba(148,163,184,.22));
box-shadow:
0 16px 34px rgba(15,18,36,.10),
0 0 0 4px color-mix(in srgb, var(--qx-ac) 10%, transparent);
}
.qx-reviews__cta:active{ transform: translateY(0px); }
.qx-reviews__cta:focus-visible{
outline:none;
box-shadow:
0 0 0 3px rgba(255,255,255,.85),
0 0 0 6px color-mix(in srgb, var(--qx-ac) 45%, transparent),
0 16px 34px rgba(15,18,36,.10);
}
.qx-reviews__meta{ justify-self:end; }
@media (max-width:900px){
.qx-reviews__head--pro{
grid-template-columns: 1fr auto;
grid-template-areas:
"center center"
"cta meta";
align-items:start;
}
.qx-reviews__center{ grid-area:center; }
.qx-reviews__cta{ grid-area:cta; justify-self:start; }
.qx-reviews__meta{ grid-area:meta; justify-self:end; }
}
@media (max-width:640px){
.qx-reviews__sub{ font-size:.80rem; }
.qx-reviews__head--pro{
grid-template-columns: 1fr auto;
grid-template-areas:
"center center"
"meta cta";
gap:10px 10px;
}
.qx-reviews__cta{
padding:8px 10px;
gap:8px;
}
.qx-reviews__cta-txt{
display:none;
}
.qx-reviews__cta-ico{
width:32px;
height:32px;
}
.qx-reviews__meta-pill{
padding:7px 10px;
}
}
.qt-faq{
width:100%;
margin:clamp(22px,3.5vw,34px) auto 0;
--qt-ac: var(--qt-buy-accent, var(--accent, #6a7eff));
--qt-ac-soft: var(--qt-buy-accent-soft, rgba(106,126,255,.22));
--faq-radius:22px;
--faq-item-radius:16px;
--faq-bd: color-mix(in srgb, var(--qt-ac) 14%, rgba(148,163,184,.28));
--faq-bd-2: rgba(148,163,184,.22);
--faq-ink:#0b1120;
--faq-muted:#5b6678;
}
.qt-faq__inner{
width:100%;
max-width:var(--qt-shell-inner, calc(var(--qt-shell-max, 1320px) - (var(--qt-shell-pad, 12px) * 2)));
margin-inline:auto;
padding:clamp(16px,2.6vw,24px);
border-radius:var(--faq-radius);
position:relative;
overflow:hidden;
isolation:isolate;
background:
radial-gradient(900px 420px at 10% -10%, color-mix(in srgb, var(--qt-ac) 12%, transparent), transparent 60%),
radial-gradient(900px 420px at 90% 0%, color-mix(in srgb, var(--qt-ac) 10%, transparent), transparent 60%),
linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78));
border:1px solid rgba(255,255,255,.70);
box-shadow:
0 18px 55px -40px rgba(2,6,23,.28),
0 0 0 1px rgba(15,18,36,.04);
}
.qt-faq__inner::before{
content:"";
position:absolute;
inset:0 0 auto 0;
height:3px;
background:linear-gradient(90deg, transparent 0%, var(--qt-ac) 18%, var(--qt-ac) 82%, transparent 100%);
opacity:.9;
z-index:-1;
}
.qt-faq__inner::after{
content:"";
position:absolute;
right:-90px; top:-90px;
width:220px; height:220px;
background:radial-gradient(circle, color-mix(in srgb, var(--qt-ac) 22%, transparent) 0%, transparent 70%);
opacity:.9;
pointer-events:none;
z-index:-1;
}
.qt-faq__head{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px 16px;
margin:0 0 14px;
}
.qt-faq__headL{
display:flex;
align-items:center;
gap:10px;
min-width:0;
}
.qt-faq__badge{
width:38px;
height:38px;
border-radius:14px;
display:grid;
place-items:center;
font-weight:950;
color:#fff;
background:linear-gradient(135deg,
color-mix(in srgb, var(--qt-ac) 92%, #111827),
color-mix(in srgb, var(--qt-ac) 55%, #ffffff));
box-shadow:0 16px 34px -26px color-mix(in srgb, var(--qt-ac) 55%, transparent);
flex:0 0 auto;
}
.qt-faq__headTxt{ min-width:0; }
.qt-faq__title{
margin:0;
font-size:clamp(1.08rem, 1.0rem + .45vw, 1.42rem);
font-weight:950;
letter-spacing:-.02em;
color:var(--faq-ink);
line-height:1.12;
}
.qt-faq__sub{
margin:4px 0 0;
font-size:.86rem;
color:var(--faq-muted);
line-height:1.35;
max-width:60ch;
}
.qt-faq__meta{
display:flex;
align-items:center;
gap:10px;
flex:0 0 auto;
}
.qt-faq__count{
display:inline-flex;
align-items:center;
gap:8px;
padding:7px 10px;
border-radius:999px;
font-size:.82rem;
font-weight:850;
color:color-mix(in srgb, var(--qt-ac) 65%, #0b1120);
background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.65));
border:1px solid color-mix(in srgb, var(--qt-ac) 16%, rgba(148,163,184,.22));
}
.qt-faq__list{ display:grid; gap:10px; }
.qt-faq__item{
border-radius:var(--faq-item-radius);
background:rgba(255,255,255,.86);
border:1px solid var(--faq-bd-2);
box-shadow:0 10px 24px -22px rgba(2,6,23,.18);
overflow:hidden;
transition:transform .14s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
position:relative;
}
.qt-faq__item::before{
content:"";
position:absolute;
inset:0 auto 0 0;
width:3px;
background:color-mix(in srgb, var(--qt-ac) 35%, transparent);
opacity:.35;
}
.qt-faq__item:hover{
transform:translateY(-1px);
border-color:var(--faq-bd);
box-shadow:0 18px 38px -26px rgba(2,6,23,.22);
}
.qt-faq__item[open]{
background:linear-gradient(180deg, rgba(255,255,255,.92), color-mix(in srgb, var(--qt-ac) 8%, rgba(255,255,255,.84)));
border-color:color-mix(in srgb, var(--qt-ac) 22%, rgba(148,163,184,.26));
box-shadow:0 22px 50px -36px rgba(2,6,23,.28), 0 0 0 4px color-mix(in srgb, var(--qt-ac) 14%, transparent);
}
.qt-faq__item[open]::before{ opacity:.95; background:var(--qt-ac); }
.qt-faq__question{
list-style:none;
cursor:pointer;
padding:12px 12px 12px 14px;
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
}
.qt-faq__question::-webkit-details-marker{ display:none; }
.qt-faq__question-text{
display:flex;
align-items:flex-start;
gap:10px;
min-width:0;
font-size:.93rem;
font-weight:850;
color:var(--faq-ink);
line-height:1.35;
}
.qt-faq__question-text::before{
content:"Q";
flex:0 0 auto;
width:22px;
height:22px;
border-radius:999px;
display:grid;
place-items:center;
font-size:.72rem;
font-weight:950;
color:var(--qt-ac);
background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(248,250,252,.80));
border:1px solid color-mix(in srgb, var(--qt-ac) 18%, rgba(148,163,184,.18));
box-shadow:0 10px 20px -18px rgba(2,6,23,.22);
}
.qt-faq__chev{
flex:0 0 auto;
width:32px;
height:32px;
border-radius:12px;
display:grid;
place-items:center;
background:rgba(248,250,252,.85);
border:1px solid rgba(148,163,184,.20);
color:#5b6678;
transition:transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
user-select:none;
}
.qt-faq__item[open] .qt-faq__chev{
transform:rotate(180deg);
background:color-mix(in srgb, var(--qt-ac) 16%, rgba(255,255,255,.86));
border-color:transparent;
color:var(--qt-ac);
}
.qt-faq__answer{
padding:0 14px 12px 14px;
border-top:1px solid rgba(148,163,184,.20);
animation:faqFade .14s ease both;
}
@keyframes faqFade{
from{ opacity:0; transform:translateY(-2px); }
to{ opacity:1; transform:translateY(0); }
}
.qt-faq__answer p{
margin:10px 0 0;
font-size:.89rem;
line-height:1.65;
color:var(--faq-muted);
}
.qt-faq__question:focus-visible{
outline:none;
box-shadow:0 0 0 4px color-mix(in srgb, var(--qt-ac) 20%, transparent);
border-radius:12px;
}
.qt-faq__more{
margin-top:12px;
display:flex;
justify-content:center;
}
.qt-faq__moreBtn{
appearance:none;
border:1px solid color-mix(in srgb, var(--qt-ac) 18%, rgba(148,163,184,.24));
background:linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,255,255,.70));
color:#0b1120;
border-radius:14px;
padding:10px 14px;
font-weight:900;
cursor:pointer;
box-shadow:0 14px 30px -26px rgba(2,6,23,.22);
transition:transform .14s ease, box-shadow .18s ease, border-color .18s ease;
}
.qt-faq__moreBtn:hover{
transform:translateY(-1px);
border-color:color-mix(in srgb, var(--qt-ac) 24%, rgba(148,163,184,.22));
box-shadow:0 18px 40px -28px rgba(2,6,23,.26);
}
.qt-faq__moreBtn:focus-visible{
outline:none;
box-shadow:0 0 0 4px color-mix(in srgb, var(--qt-ac) 20%, transparent), 0 18px 40px -28px rgba(2,6,23,.26);
}
@media (max-width:640px){
.qt-faq{ margin-top:18px; }
.qt-faq__inner{ border-radius:18px; padding:12px 12px 14px; }
.qt-faq__question{ padding:11px 10px 11px 12px; }
.qt-faq__answer{ padding:0 12px 11px; }
.qt-faq__chev{ width:30px; height:30px; }
.qt-faq__meta{ display:none; }
}
@media (prefers-reduced-motion: reduce){
.qt-faq *{ transition:none !important; animation:none !important; }
.qt-faq__moreBtn{ transition:none !important; }
}
.qt-desc{
width:100%;
margin:clamp(20px,3.5vw,28px) auto 0;
margin-bottom:clamp(28px,6vw,56px)!important;
--qt-desc-ac: var(--qt-buy-accent, var(--qt-buy-accent-color, var(--accent, #6366f1)));
--qt-desc-soft: var(--qt-buy-accent-soft, rgba(99,102,241,.16));
--qt-desc-ink:#0b1220;
--qt-desc-muted:#475569;
--qt-desc-ring: color-mix(in srgb, var(--qt-desc-ac) 22%, transparent);
}
.qt-desc__inner{
width:100%;
max-width:var(--qt-shell-inner, calc(var(--qt-shell-max, 1320px) - (var(--qt-shell-pad, 12px) * 2)));
margin-inline:auto;
padding:clamp(16px,3vw,22px);
border-radius:22px;
position:relative;
overflow:hidden;
background:
radial-gradient(820px 320px at 12% -10%, color-mix(in srgb, var(--qt-desc-ac) 12%, transparent), transparent 62%),
radial-gradient(820px 320px at 92% 0%, rgba(255,255,255,.92), transparent 60%),
linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92));
border:1px solid color-mix(in srgb, var(--qt-desc-ac) 18%, rgba(15,18,36,.05));
box-shadow:
0 18px 48px rgba(15,18,36,.10),
0 0 0 1px rgba(15,18,36,.04);
}
.qt-desc__inner::before{
content:"";
position:absolute;
inset:0 0 auto 0;
height:3px;
background:linear-gradient(90deg,
rgba(255,255,255,0) 0%,
var(--qt-desc-ac) 18%,
var(--qt-desc-ac) 82%,
rgba(255,255,255,0) 100%);
opacity:.9;
}
.qt-desc__inner::after{
content:"";
position:absolute;
right:-26px;
top:-26px;
width:92px;
height:92px;
transform:rotate(45deg);
background:
linear-gradient(135deg,
color-mix(in srgb, var(--qt-desc-ac) 12%, rgba(255,255,255,.92)),
rgba(255,255,255,.92));
border:1px solid color-mix(in srgb, var(--qt-desc-ac) 18%, rgba(148,163,184,.22));
box-shadow:0 14px 34px rgba(15,18,36,.10);
opacity:.85;
pointer-events:none;
}
.qt-desc__head{
position:relative;
z-index:1;
margin-bottom:10px;
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
flex-wrap:wrap;
}
.qt-desc__pill{
display:inline-flex;
align-items:center;
gap:8px;
padding:6px 12px;
border-radius:999px;
font-size:.74rem;
font-weight:900;
letter-spacing:.06em;
text-transform:uppercase;
background:
linear-gradient(135deg,
color-mix(in srgb, var(--qt-desc-ac) 16%, rgba(255,255,255,.92)),
rgba(255,255,255,.92));
color:color-mix(in srgb, var(--qt-desc-ac) 78%, var(--qt-desc-ink));
border:1px solid color-mix(in srgb, var(--qt-desc-ac) 26%, rgba(148,163,184,.22));
box-shadow:
0 10px 22px rgba(15,18,36,.06),
0 0 0 4px color-mix(in srgb, var(--qt-desc-ac) 8%, transparent);
}
.qt-desc__body{
position:relative;
z-index:1;
margin-top:10px;
padding:12px 10px 12px 14px;
max-height:clamp(220px,34vh,340px);
overflow:auto;
overscroll-behavior:contain;
border-radius:16px;
background:
linear-gradient(180deg, rgba(248,250,252,.96), rgba(255,255,255,1));
border:1px solid rgba(148,163,184,.18);
box-shadow:
inset 0 0 0 1px rgba(255,255,255,.75),
0 12px 30px rgba(15,18,36,.06);
}
.qt-desc__body::before{
content:"";
position:absolute;
left:0;
top:10px;
bottom:10px;
width:4px;
border-radius:999px;
background:linear-gradient(180deg, var(--qt-desc-ac), color-mix(in srgb, var(--qt-desc-ac) 25%, transparent));
opacity:.75;
}
.qt-desc__body p{
margin:0 0 .7em;
font-size:.94rem;
line-height:1.7;
color:color-mix(in srgb, var(--qt-desc-muted) 88%, #111827);
}
.qt-desc__body ul,
.qt-desc__body ol{
margin:.35em 0 .8em 1.15em;
padding:0;
color:color-mix(in srgb, var(--qt-desc-muted) 88%, #111827);
font-size:.92rem;
}
.qt-desc__body li{ margin-bottom:.3em; }
.qt-desc__body h2,
.qt-desc__body h3{
margin:1.15em 0 .5em;
font-family:inherit;
font-weight:950;
line-height:1.25;
letter-spacing:-.01em;
color:var(--qt-desc-ink);
}
.qt-desc__body h2{
font-size:clamp(1.02rem, .98rem + .22vw, 1.20rem);
padding:8px 10px;
border-radius:12px;
background:color-mix(in srgb, var(--qt-desc-ac) 8%, rgba(255,255,255,.92));
border:1px solid color-mix(in srgb, var(--qt-desc-ac) 16%, rgba(148,163,184,.22));
}
.qt-desc__body h3{
font-size:clamp(.95rem, .9rem + .18vw, 1.06rem);
padding-left:.5rem;
border-left:3px solid color-mix(in srgb, var(--qt-desc-ac) 22%, rgba(148,163,184,.32));
}
.qt-desc__body::-webkit-scrollbar{ width:8px; }
.qt-desc__body::-webkit-scrollbar-track{ background:transparent; }
.qt-desc__body::-webkit-scrollbar-thumb{
border-radius:999px;
background:color-mix(in srgb, var(--qt-desc-ac) 18%, rgba(148,163,184,.22));
}
@media (max-width:640px){
.qt-desc{ margin-bottom:22px!important; }
.qt-desc__inner{ border-radius:18px; padding:14px 12px 16px; }
.qt-desc__body{ max-height:clamp(220px,45vh,360px); padding:11px 10px 11px 13px; }
.qt-desc__inner::after{ width:78px; height:78px; right:-22px; top:-22px; }
}

/* ===========================================================
   WIDTH SYNC PATCH — Packlist ile aynı “genişlik hissi”
   HTML değiştirmez. Sadece layout hizası.
   Ayar: --qt-wide-max ile oynayabilirsin.
=========================================================== */

:root{
  /* Packlist ne kadar genişse burayı ona eşitle:
     1240 / 1280 / 1320 / 1360 gibi deneyebilirsin */
  --qt-wide-max: 1320px;

  /* Sağ-sol güvenli boşluk (mobilde taşmayı engeller) */
  --qt-wide-pad: 12px;

  /* Tarayıcı destekliyse min() ile güzel clamp */
  --qt-wide-inner: min(var(--qt-wide-max), calc(100% - (var(--qt-wide-pad) * 2)));
}

/* Bu 4 blok packlist gibi “wide” hizalansın */
.qt-buymini,
.qx-reviews,
.qt-faq,
.qt-desc{
  max-width: var(--qt-wide-inner);
  margin-left: auto;
  margin-right: auto;
}

/* İçeride tekrar max-width ile daraltmayı kapatıyoruz (çifte kısıt olmasın) */
.qt-faq__inner,
.qt-desc__inner{
  max-width: 100%;
}