/* Stil testi (/stil-testi) — V33 tasarım diliyle: keskin köşeler, Archivo başlıklar, bordo vurgu. */
.sq-page{max-width:920px;margin:0 auto;padding:48px 0 80px}
.sq h1{margin-bottom:18px}
.sq h2{font-size:clamp(26px,4vw,38px);letter-spacing:-1px;margin:14px 0 6px}
.sq-lead{font-size:18px;max-width:640px}
.sq-progress{height:4px;background:var(--line);margin-bottom:22px}
.sq-progress span{display:block;height:100%;background:var(--red);transition:width .25s}
.sq-head{display:flex;justify-content:space-between;align-items:center;min-height:40px}
.sq-back{padding:8px 14px;font-size:14px}
.sq-styles{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0}
.sq-styles span{border:1px solid var(--line);padding:8px 14px;font-family:Archivo,Arial,sans-serif;font-weight:600;font-size:14px}
.sq-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.sq-options{display:grid;gap:10px;margin-top:24px}
.sq-option{justify-content:space-between;text-align:left;background:#fff;color:var(--ink);border:1px solid var(--line);padding:20px 22px;font-size:17px}
.sq-option b{color:var(--muted);font-weight:400}
.sq-option:hover{background:#eeede7}
.sq-option.selected,.sq-look.selected{border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red);background:#fff}
.sq-option.selected b{color:var(--red)}
.sq-visual{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:24px}
.sq-look{position:relative;display:block;background:#fff;color:var(--ink);border:1px solid var(--line);padding:16px;text-align:left;min-height:260px}
.sq-look:hover{background:#fff;border-color:var(--ink)}
.sq-look img{display:block;width:100%;aspect-ratio:3/4;object-fit:contain;background:#fff}
.sq-letter{position:absolute;top:0;left:0;background:var(--ink);color:#fff;font-family:Archivo,Arial,sans-serif;font-weight:700;font-size:13px;padding:4px 9px}
.sq-look.selected .sq-letter{background:var(--red)}
.sq-swatches{display:grid;grid-template-columns:repeat(4,1fr);height:92px;margin:18px 0 16px;border:1px solid var(--line)}
.sq-swatches span{display:block}
.sq-look ul,.sq-card ul{list-style:none;margin:0;padding:0}
.sq-look li,.sq-card li{padding:7px 0;border-bottom:1px solid var(--line);font-size:15px;line-height:1.3}
.sq-look li:last-child,.sq-card li:last-child{border-bottom:0}
.sq-badge{display:inline-flex;flex-direction:column;align-items:center;border:1px solid var(--ink);padding:14px 22px;margin-bottom:24px}
.sq-badge span{font-family:Archivo,Arial,sans-serif;font-weight:800;letter-spacing:3px;font-size:18px}
.sq-badge small{letter-spacing:4px;font-size:11px;color:var(--red);margin-top:4px;padding-top:4px;border-top:1px solid var(--line);width:100%;text-align:center}
.sq-bars{display:grid;gap:10px;margin:30px 0;max-width:560px}
.sq-bars div{display:grid;grid-template-columns:110px 1fr 48px;align-items:center;gap:12px;font-size:15px}
.sq-bars i{height:8px;background:var(--line)}
.sq-bars i b{display:block;height:100%;background:var(--ink)}
.sq-bars div:first-child i b{background:var(--red)}
.sq-bars em{font-style:normal;color:var(--muted);text-align:right}
.sq-card{max-width:360px;background:#fff;border:1px solid var(--line);padding:16px}
.sq-card img{display:block;width:100%}
.sq-redo{margin-top:28px;padding:18px 20px;border:1px solid var(--line);background:#fff;max-width:640px}
.sq-redo p{margin:0 0 12px;font-size:15px}
.sq-note{margin-top:22px;font-size:15px}
.sq-note a{color:var(--red);text-decoration:underline}
@media (max-width:760px){
 .sq-page{padding:28px 0 60px}
 .sq-visual{grid-template-columns:repeat(2,1fr);gap:10px}
 .sq-look{padding:12px;min-height:0}
 .sq-swatches{height:64px;margin:16px 0 10px}
 .sq-look li{font-size:13px;padding:5px 0}
 .sq-option{padding:16px 18px;font-size:16px}
 .sq-actions .btn,.sq-actions button{width:100%}
}
