/* Bilohash Studio — сторінка «Webutvikling» (/website/), доповнює bs-service.css (2026-11-12) */
.bsw .bsv-hero h1{font-size:clamp(34px,4.8vw,58px)}
.bsw .bsv-chips a{color:inherit;text-decoration:none}
.bsw .bsv-chips li:hover{background:#7be0c3}
.bsw-ctas{display:flex;flex-wrap:wrap;gap:12px}
.bsw-art{position:relative}
.bsw-badge{position:absolute;left:-10px;bottom:-14px;display:flex;align-items:center;gap:10px;background:#fff;border:3px solid #14110f;border-radius:16px;box-shadow:4px 4px 0 #14110f;padding:8px 14px;transform:rotate(-2deg)}
[dir=rtl] .bsw-badge{left:auto;right:-10px}
.bsw-badge b{display:block;font-weight:900;font-size:15px;color:#14110f}
.bsw-badge small{display:block;font-weight:700;font-size:12px;color:#4f4943}
.bsw-sub{margin:-6px 0 18px;color:#4f4943;font-size:17px;max-width:44rem}
/* про мене */
.bsw-about{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:24px;align-items:start;background:#2447ff;border:3px solid #14110f;border-radius:28px;box-shadow:8px 8px 0 #14110f;padding:28px}
.bsw-about h2{color:#fff !important}
.bsw-about-text p{color:#fff;font-size:18px;line-height:1.6;margin:0}
.bsw-facts{grid-template-columns:1fr 1fr !important}
.bsw-facts li{box-shadow:4px 4px 0 #14110f}
.bsw-facts li:nth-child(1){background:#ffd84d}
.bsw-facts li:nth-child(4){background:#7be0c3}
/* послуги */
.bsw-svc{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;margin:0;padding:0;list-style:none}
.bsw-svc a{position:relative;display:flex;flex-direction:column;gap:6px;height:100%;box-sizing:border-box;padding:70px 16px 16px;background:#fff;border:3px solid #14110f;border-radius:20px;box-shadow:5px 5px 0 #14110f;color:#14110f;text-decoration:none}
.bsw-svc a:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 #14110f;background:#fffdf5}
.bsw-svc b{font-size:19px;font-weight:900}
.bsw-svc span:not(.bsv-ic){color:#4f4943;line-height:1.45;font-size:15px}
.bsw-svc li:nth-child(3n+2) .bsv-ic{background:#7be0c3}
.bsw-svc li:nth-child(3n) .bsv-ic{background:#ff8f87}
/* міста */
.bsw-areas-card{background:#fff;border:3px solid #14110f;border-radius:26px;box-shadow:7px 7px 0 #14110f;padding:26px;background-image:radial-gradient(#14110f14 1.3px,transparent 1.5px);background-size:18px 18px}
.bsw-areas-card > p{color:#4f4943;font-size:17px;max-width:46rem;margin:0 0 14px}
.bsw-near{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px;padding:0;list-style:none}
.bsw-near li{display:inline-flex;align-items:center;gap:8px;background:#ffd84d;border:3px solid #14110f;border-radius:999px;padding:8px 16px;font-weight:900;font-size:17px;box-shadow:3px 3px 0 #14110f}
.bsw-near li.is-home{background:#ff5a4f;color:#14110f}
.bsw-more-h{font-weight:900;margin:0 0 10px;color:#14110f}
.bsw-code{display:none;font-weight:800}
@media (max-width:980px){.bsw-about{grid-template-columns:1fr}}
@media (max-width:600px){.bsw-facts{grid-template-columns:1fr !important}.bsw-about{padding:20px}.bsw-badge{left:8px;bottom:-12px}.bsv-lang summary .bsw-code{display:inline}}
@media (prefers-reduced-motion:reduce){.bsw-svc a:hover{transform:none}}
/* темна тема */
html[data-theme="dark"] .bsw-about{border-color:#fff8e7;box-shadow:8px 8px 0 #000}
html[data-theme="dark"] .bsw-badge{background:#221d1a;border-color:#fff8e7;box-shadow:4px 4px 0 #000}
html[data-theme="dark"] .bsw-badge b{color:#fff8e7}
html[data-theme="dark"] .bsw-badge small,html[data-theme="dark"] .bsw-sub,html[data-theme="dark"] .bsw-areas-card > p{color:#c9bfb0}
html[data-theme="dark"] .bsw-facts li:nth-child(1),html[data-theme="dark"] .bsw-facts li:nth-child(4){color:#14110f}
html[data-theme="dark"] .bsw-facts li:nth-child(1) *,html[data-theme="dark"] .bsw-facts li:nth-child(4) *{color:#14110f !important}
html[data-theme="dark"] .bsw-svc a{background:#221d1a;border-color:#fff8e7;box-shadow:5px 5px 0 #000;color:#fff8e7}
html[data-theme="dark"] .bsw-svc span:not(.bsv-ic){color:#c9bfb0}
html[data-theme="dark"] .bsw-svc .bsv-ic{color:#14110f}
html[data-theme="dark"] .bsw-areas-card{background-color:#221d1a;border-color:#fff8e7;box-shadow:7px 7px 0 #000;background-image:radial-gradient(#fff8e714 1.3px,transparent 1.5px)}
html[data-theme="dark"] .bsw-areas-card h2,html[data-theme="dark"] .bsw-more-h{color:#fff8e7 !important}
html[data-theme="dark"] .bsw-near li{color:#14110f;border-color:#14110f}
