/* W-TECH Service Cards — Frontend v3.0.0 */

.wtech-sc-section {
    width: 100%;
    box-sizing: border-box;
    padding: 70px 20px;
}

.wtech-sc-header {
    text-align: center;
    margin-bottom: 56px;
}

.wtech-sc-title {
    font-family: 'Segoe UI', Arial, sans-serif;
    font-size: 34px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 10px;
}

.wtech-sc-subtitle {
    font-size: 16px;
    color: #666;
    margin: 0;
    line-height: 1.6;
}

/* ── Grid ─────────────────────────────────────────────────────────────────── */
.wtech-sc-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    max-width: 1200px;
    margin: 0 auto;
}

.wtech-sc-cols-1 .wsc-card { flex: 0 0 100%; max-width: 480px; margin: 0 auto; }
.wtech-sc-cols-2 .wsc-card { flex: 0 0 50%; max-width: 50%; }
.wtech-sc-cols-3 .wsc-card { flex: 0 0 33.333%; max-width: 33.333%; }
.wtech-sc-cols-4 .wsc-card { flex: 0 0 25%; max-width: 25%; }

/* ── Card ─────────────────────────────────────────────────────────────────── */
.wsc-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
    padding: 0 32px 44px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    overflow: visible;
    position: relative;
}

/* ── Icon ─────────────────────────────────────────────────────────────────── */
.wsc-icon-wrap {
    display: flex;
    justify-content: center;
    width: 100%;
    position: relative;
    top: -56px;
    margin-bottom: -32px;
    z-index: 2;
}

.wsc-circle {
    width: 116px;
    height: 116px;
    border-radius: 50%;
    border: 5px solid;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 24px rgba(0,0,0,0.18);
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.wsc-circle i {
    font-size: 46px;
    line-height: 1;
}

/* ── Body ─────────────────────────────────────────────────────────────────── */
.wsc-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    width: 100%;
}

.wsc-title {
    font-family: 'Segoe UI', Arial, sans-serif;
    font-size: 21px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #fff;
    margin: 0 0 12px;
    line-height: 1.25;
}

.wsc-desc {
    font-size: 14px;
    line-height: 1.75;
    color: rgba(255,255,255,0.93);
    margin: 0 0 26px;
}

/* ── Button ───────────────────────────────────────────────────────────────── */
.wsc-btn {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-decoration: none;
    padding: 11px 30px;
    border: 2px solid;
    background: transparent;
    cursor: pointer;
    margin-top: auto;
    transition: background 0.25s, color 0.25s, border-color 0.25s, transform 0.2s;
}

.wsc-btn:hover {
    text-decoration: none;
    transform: translateY(-2px);
}

/* ── Hover effects ────────────────────────────────────────────────────────── */
.wsc-hover-lift:hover            { transform: translateY(-8px); box-shadow: 0 20px 50px rgba(0,0,0,0.22); }
.wsc-hover-lift:hover .wsc-circle { transform: scale(1.08) translateY(-4px); }
.wsc-hover-scale:hover           { transform: scale(1.04); }
.wsc-hover-glow:hover            { transform: translateY(-5px); box-shadow: 0 12px 40px rgba(0,0,0,0.28); }

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media (max-width: 992px) {
    .wtech-sc-cols-3 .wsc-card,
    .wtech-sc-cols-4 .wsc-card { flex: 0 0 50%; max-width: 50%; }
}

@media (max-width: 600px) {
    .wtech-sc-cols-2 .wsc-card,
    .wtech-sc-cols-3 .wsc-card,
    .wtech-sc-cols-4 .wsc-card { flex: 0 0 100%; max-width: 100%; }
    .wtech-sc-section { padding: 50px 15px; }
    .wsc-icon-wrap { top: -44px; margin-bottom: -22px; }
    .wsc-circle { width: 88px; height: 88px; }
    .wsc-circle i { font-size: 34px; }
}