/* =========================================
   COMMON ANIMATIONS & UTILS
========================================= */
.rv{opacity:0;transform:translateY(30px);transition:opacity 0.7s ease,transform 0.7s ease}.rv.on{opacity:1;transform:translateY(0)}
.bc{background:#fff;border-bottom:1px solid #e5e7eb;padding:12px 24px;font-size:13px}
.bci{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:8px;color:#6b7280}
.bci a{color:#1b293d;font-weight:500;text-decoration:none}.bci i{font-size:10px;color:#9ca3af}.bci span{color:#cd763b;font-weight:600}
.page-hero{padding:80px 24px;position:relative;overflow:hidden;color:#fff}
.page-hero h1{font-size:clamp(32px,5vw,56px);font-weight:900;line-height:1.1;margin-bottom:20px}
.page-hero p{font-size:16px;opacity:0.85;max-width:600px;margin-bottom:30px}
.hbtns{display:flex;gap:15px;flex-wrap:wrap}
.bp, .bo2{padding:14px 28px;border-radius:8px;font-weight:700;display:inline-flex;align-items:center;gap:8px;transition:all 0.3s;text-decoration:none}
.bp{background:#cd763b;color:#fff}.bp:hover{background:#e68845;transform:translateY(-2px)}
.bo2{background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.3);color:#fff}.bo2:hover{background:rgba(255,255,255,0.2)}
.c-wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.sh{margin-bottom:50px}
.sh h2{font-size:clamp(28px,4vw,42px);font-weight:800;margin-bottom:15px;line-height:1.2}
.sh p{font-size:15px;color:#6b7280;max-width:600px}
.cat-sec{padding:80px 0}

/* =========================================
   SOFTWARE PAGES (.sw-cat)
========================================= */
.sw-cat .page-hero{background:linear-gradient(135deg, #0f1826, #1b293d, #34709d)}
.sw-cat .sh h2{color:#0f1826}.sw-cat .sh h2 span{color:#34709d}
.sw-cat .sw-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:24px}
.sw-cat .sw-card{background:#fff;border-radius:12px;padding:32px;box-shadow:0 4px 20px rgba(27,41,61,0.06);border:1px solid #e2e8f0;transition:transform 0.3s}
.sw-cat .sw-card:hover{transform:translateY(-5px);border-color:#34709d}
.sw-cat .sw-icon{width:56px;height:56px;background:rgba(52,112,157,0.1);color:#34709d;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:20px}
.sw-cat .sw-card h3{font-size:18px;font-weight:700;color:#0f1826;margin-bottom:12px}
.sw-cat .sw-card p{font-size:14px;color:#475569;line-height:1.6}
.sw-cat .sw-timeline{display:flex;flex-direction:column;gap:20px}
.sw-cat .sw-step{display:flex;background:#f8fafc;border-radius:12px;padding:24px;gap:20px;align-items:center;border-left:4px solid #34709d}
.sw-cat .sw-step-num{font-size:32px;font-weight:900;color:#cbd5e1;line-height:1}
.sw-cat .sw-step-content h4{font-size:16px;font-weight:700;color:#1b293d;margin-bottom:6px}
.sw-cat .sw-step-content p{font-size:13px;color:#64748b;margin:0}
.sw-cat .sw-tech{display:flex;gap:12px;flex-wrap:wrap}
.sw-cat .sw-badge{background:#fff1e6;color:#cd763b;padding:8px 16px;border-radius:6px;font-weight:600;font-size:13px}
.sw-cat .bg-gray{background:#f8fafc}
.sw-cat .sw-cta{background:linear-gradient(135deg, #1b293d, #34709d);color:#fff;text-align:center;padding:70px 24px;border-radius:24px;margin:40px auto;max-width:1200px}

/* =========================================
   WEB DESIGN PAGES (.web-cat)
========================================= */
.web-cat .page-hero{background:linear-gradient(135deg, #1b293d, #34709d);text-align:center}
.web-cat .page-hero p{margin-left:auto;margin-right:auto}
.web-cat .hbtns{justify-content:center}
.web-cat .sh{text-align:center}.web-cat .sh p{margin-left:auto;margin-right:auto}
.web-cat .sh h2{color:#1b293d}.web-cat .sh h2 span{color:#cd763b}
.web-cat .web-masonry{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:24px;align-items:start}
.web-cat .web-card{background:#fff;border-radius:30px;padding:40px 30px;box-shadow:0 15px 35px rgba(52,112,157,0.08);text-align:center;transition:all 0.4s}
.web-cat .web-card:hover{transform:translateY(-10px);box-shadow:0 20px 45px rgba(52,112,157,0.15)}
.web-cat .web-card:nth-child(even){margin-top:40px}
.web-cat .web-icon{width:70px;height:70px;border-radius:50%;background:linear-gradient(135deg, #cd763b, #e68845);color:#fff;display:flex;align-items:center;justify-content:center;font-size:28px;margin:0 auto 24px}
.web-cat .web-card h3{font-size:20px;font-weight:800;color:#1b293d;margin-bottom:12px}
.web-cat .web-card p{font-size:14px;color:#6b7280;line-height:1.7}
.web-cat .web-circle-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:30px;text-align:center}
.web-cat .web-circle{background:#fff;border-radius:50%;padding:40px 20px;aspect-ratio:1/1;display:flex;flex-direction:column;justify-content:center;align-items:center;box-shadow:0 10px 30px rgba(0,0,0,0.05);border:2px dashed #e2e8f0}
.web-cat .web-circle h4{color:#cd763b;font-size:16px;margin:15px 0 5px}
.web-cat .web-circle p{font-size:12px;color:#6b7280}
.web-cat .web-tech-pill{display:inline-flex;align-items:center;gap:8px;background:#fff1e6;color:#cd763b;padding:12px 24px;border-radius:50px;font-weight:700;font-size:14px;margin:8px}
.web-cat .bg-purple{background:#fcfaff}
.web-cat .web-cta{background:linear-gradient(135deg, #cd763b, #e68845);color:#fff;text-align:center;padding:80px 24px}

/* =========================================
   HARDWARE PAGES (.hw-cat)
========================================= */
.hw-cat{background:#f1f5f9}
.hw-cat .page-hero{background:linear-gradient(135deg, #1b293d, #0f1826);border-bottom:4px solid #cd763b}
.hw-cat .page-hero h1 span{color:#cd763b}
.hw-cat .bp{background:#cd763b;color:#1b293d}.hw-cat .bp:hover{background:#e68845}
.hw-cat .sh h2{color:#1b293d;text-transform:uppercase;letter-spacing:1px}.hw-cat .sh h2 span{color:#cd763b;background:#1b293d;padding:2px 8px}
.hw-cat .hw-list{display:flex;flex-direction:column;gap:16px}
.hw-cat .hw-row{display:flex;background:#fff;border:1px solid #cbd5e1;padding:20px 24px;gap:24px;align-items:center;transition:all 0.3s}
.hw-cat .hw-row:hover{border-color:#cd763b;box-shadow:4px 4px 0 #cd763b;transform:translate(-2px, -2px)}
.hw-cat .hw-icon{font-size:32px;color:#1b293d;min-width:50px;text-align:center}
.hw-cat .hw-row:hover .hw-icon{color:#cd763b}
.hw-cat .hw-content h3{font-size:18px;font-weight:800;color:#1b293d;margin-bottom:6px;text-transform:uppercase}
.hw-cat .hw-content p{font-size:14px;color:#475569;margin:0}
.hw-cat .hw-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:24px}
.hw-cat .hw-spec{background:#0f1826;color:#fff;padding:24px;border-left:4px solid #cd763b}
.hw-cat .hw-spec i{font-size:24px;color:#cd763b;margin-bottom:15px;display:block}
.hw-cat .hw-spec h4{font-size:16px;margin-bottom:8px;font-weight:600}
.hw-cat .hw-spec p{font-size:13px;color:#94a3b8;margin:0}
.hw-cat .hw-tag{background:#1b293d;color:#cd763b;padding:10px 20px;font-family:monospace;font-size:14px;display:inline-block;margin:6px;border:1px solid #cd763b}
.hw-cat .bg-dark{background:#e2e8f0}
.hw-cat .hw-cta{background:#1b293d;color:#fff;text-align:center;padding:70px 24px;border-top:4px solid #cd763b}

@media(max-width:768px){
    .sw-cat .sw-step{flex-direction:column;text-align:center;border-left:none;border-top:4px solid #34709d}
    .web-cat .web-card:nth-child(even){margin-top:0}
    .hw-cat .hw-row{flex-direction:column;text-align:center}
}