/* Sektör çözüm sayfaları (cozum.blade.php). Temel sınıflar sayfa.css, donanım kartları donanim.css */

.cs-hero { min-height: min(86vh, 760px); }
.cs-note { background: var(--a-accent-soft); border-bottom: 1px solid #D9DFFB; }
.cs-note p { margin: 0; padding: 16px 0; font-size: .9375rem; line-height: 1.6; color: var(--a-ink); }

/* Dertler: satır satır sorun → çözüm */
.cs-pain { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--a-ink); }
.cs-pain li { display: grid; grid-template-columns: 70px minmax(0, 5fr) minmax(0, 6fr); gap: 24px; align-items: start; padding: 26px 4px; border-bottom: 1px solid var(--a-line); }
.cs-pain-no { font-size: 1.75rem; font-weight: 800; line-height: 1; letter-spacing: -.04em; color: #98A2B3; }
.cs-pain-q h3 { margin: 0 0 6px; font-size: 1.1875rem; letter-spacing: -.015em; }
.cs-pain-q p { margin: 0; font-size: .9375rem; line-height: 1.6; color: var(--a-muted); }
.cs-pain-a { display: flex; gap: 12px; margin: 0; padding: 14px 18px; font-size: .9375rem; font-weight: 600; line-height: 1.55; color: var(--a-ink); background: var(--a-accent-soft); border-radius: 14px; }
.cs-pain-a svg { flex: none; width: 20px; height: 20px; margin-top: 1px; fill: none; stroke: var(--a-accent); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }

/* Yazılım kartları */
.cs-soft { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.cs-soft-card { display: flex; flex-direction: column; padding: 30px 28px; background: #fff; border: 1px solid var(--a-line); border-radius: 22px; }
.cs-soft-tag { margin: 0 0 12px; font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--a-accent); }
.cs-soft-card h3 { margin: 0 0 8px; font-size: 1.375rem; letter-spacing: -.02em; }
.cs-soft-card > p { margin: 0 0 18px; font-size: .9375rem; line-height: 1.6; color: var(--a-text); }
.cs-soft-card ul { display: grid; gap: 9px; margin: 0 0 24px; padding: 0; list-style: none; }
.cs-soft-card li { display: flex; gap: 9px; font-size: .9rem; line-height: 1.45; }
.cs-soft-card li svg { flex: none; width: 16px; height: 16px; margin-top: 2px; fill: none; stroke: var(--a-accent); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.cs-soft-foot { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: auto; padding-top: 20px; border-top: 1px solid var(--a-line); }
.cs-soft-foot p { display: grid; margin: 0; }
.cs-soft-foot strong { font-size: 1.5rem; letter-spacing: -.03em; }
.cs-soft-foot span { font-size: .8125rem; color: var(--a-muted); }

/* Donanım kategorileri */
.cs-cats { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; padding: 0; list-style: none; }
.cs-cats a { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; font-size: .875rem; font-weight: 600; color: var(--a-ink); text-decoration: none; background: #fff; border: 1px solid var(--a-line); border-radius: 999px; transition: border-color .2s; }
.cs-cats a:hover { border-color: var(--a-ink); }
.cs-cats svg { width: 18px; height: 18px; fill: none; stroke: var(--a-accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cz-page .dn-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cs-all { margin: 28px 0 0; text-align: center; }

/* Hizmetler */
.cs-serv { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.cs-serv-item { position: relative; display: block; overflow: hidden; aspect-ratio: 4 / 3; color: #fff; text-decoration: none; border-radius: 20px; }
.cs-serv-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.cs-serv-item:hover img { transform: scale(1.05); }
.cs-serv-item > span { position: absolute; inset: auto 0 0 0; display: grid; gap: 4px; padding: 60px 22px 20px; background: linear-gradient(180deg, transparent, rgba(11, 11, 15, .92)); }
.cs-serv-item strong { font-size: 1.125rem; }
.cs-serv-item small { font-size: .8125rem; line-height: 1.5; color: rgba(255, 255, 255, .75); }

/* Diğer sektörler */
.cs-others { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.cs-others a { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 9; color: #fff; text-decoration: none; border-radius: 18px; }
.cs-others img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.cs-others a:hover img { transform: scale(1.05); }
.cs-others span { position: absolute; inset: auto 0 0 0; display: flex; align-items: center; gap: 8px; padding: 40px 20px 16px; font-weight: 700; background: linear-gradient(180deg, transparent, rgba(11, 11, 15, .85)); }
.cs-others svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

@media (max-width: 1000px) {
    .cs-pain li { grid-template-columns: 50px minmax(0, 1fr); gap: 12px 16px; }
    .cs-pain-a { grid-column: 2; }
    .cz-page .dn-grid, .cs-serv, .cs-others { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .cs-pain li { grid-template-columns: 1fr; padding: 22px 0; }
    .cs-pain-a { grid-column: 1; }
    .cz-page .dn-grid, .cs-serv, .cs-others { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .cs-serv-item img, .cs-others img { transition: none; } }