/* All Services Page Styles */

/* Layout fixes (scoped to this page via inclusion) */
.row { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.col-md-6.col-lg-4 { display: flex; flex: 0 0 33.333333%; max-width: 33.333333%; padding: 0 15px; box-sizing: border-box; }
.mb-30 { margin-bottom: 30px; }
.text-center { text-align: center; }
.mt-25 { margin-top: 25px; }
.mt-70 { margin-top: 70px; }
.mt-60 { margin-top: 60px; }
.mt-40 { margin-top: 40px; }

/* Section wrapper */
.services-wrapper { background:#f8fafc; padding:80px 0 120px 0; margin-bottom:50px; }
.services-heading { color:#0a2540; font-weight:700; margin-bottom:15px; }
.services-subtitle { color:#64748b; max-width:700px; margin:0 auto; font-size:16px; }

/* Responsive overrides */
@media (max-width: 992px) {
  .col-md-6.col-lg-4 { flex: 0 0 50%; max-width: 50%; }
}
@media (max-width: 768px) {
  .col-md-6.col-lg-4 { flex: 0 0 100%; max-width: 100%; margin-bottom: 20px; }
}

/* Hero (carried over) */
.feedback-hero{background:linear-gradient(115deg,#0a2540,#153c63 60%,#0d3354);padding:70px 0 56px;color:#fff;position:relative;overflow:hidden;}
.feedback-hero:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 18%,rgba(56,189,248,.18),transparent 60%);pointer-events:none;}
.fh-title{font-size:40px;line-height:1.05;font-weight:700;margin:0 0 16px;letter-spacing:.5px;}
.fh-text{max-width:880px;font-size:16px;color:#c2d9e7;margin:0 0 20px;}
.fh-tags{display:flex;flex-wrap:wrap;gap:10px;font-size:11px;letter-spacing:.6px;text-transform:uppercase;}
.fh-tags span{background:rgba(255,255,255,.08);padding:6px 14px;border:1px solid rgba(255,255,255,.25);border-radius:30px;color:#cbe8f9;backdrop-filter:blur(2px);}
@media (max-width: 768px) { .fh-title{font-size:36px;} }
@media (max-width: 576px) { .fh-title{font-size:30px;} .feedback-hero{padding:60px 0 46px;} }

/* Service card base and effects (carried over + additions) */
.service-box { display:flex; flex-direction:column; width:100%; min-height:450px; position:relative; overflow:hidden; transform-style:preserve-3d; will-change: transform, box-shadow; transition: all 0.6s cubic-bezier(0.25,0.46,0.45,0.94); background:#fff; padding:35px 25px; border-radius:12px; box-shadow:0 8px 25px rgba(0,0,0,0.06); height:100%; border-top:4px solid transparent; }
.service-box ul { flex-grow:1; margin-bottom:20px; list-style:none; padding:0; color:#64748b; }
.service-box::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.4),transparent);transition:left 0.8s cubic-bezier(0.25,0.46,0.45,0.94);z-index:1;}
.service-box::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at center,rgba(255,255,255,0.1) 0%,transparent 70%);opacity:0;transition:opacity 0.6s cubic-bezier(0.25,0.46,0.45,0.94);z-index:1;}
.service-box:hover{transform:translateY(-12px) scale(1.02);box-shadow:0 20px 40px rgba(0,0,0,0.12),0 12px 25px rgba(0,0,0,0.08),0 4px 12px rgba(0,0,0,0.04),inset 0 1px 0 rgba(255,255,255,0.3);}
.service-box:hover::before{left:100%;}
.service-box:hover::after{opacity:1;}
.service-box{perspective:1000px;}
.service-box:hover{animation:tiltFloat 3s ease-in-out infinite;}
@keyframes tiltFloat{0%,100%{transform:translateY(-15px) scale(1.02) rotateX(5deg) rotateY(0deg);}50%{transform:translateY(-20px) scale(1.02) rotateX(5deg) rotateY(2deg);}}
.service-box:hover{filter: drop-shadow(0 0 20px rgba(99,102,241,0.3));}
.service-box:hover h4{animation:textGlow 2s ease-in-out infinite alternate;}
@keyframes textGlow{from{ text-shadow:0 0 5px rgba(0,0,0,0.1);} to{ text-shadow:0 0 15px rgba(99,102,241,0.3),0 0 25px rgba(99,102,241,0.2);} }

/* Service icon */
.service-icon{width:70px;height:70px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto;color:#fff;font-size:24px;position:relative;transition:all 0.6s cubic-bezier(0.25,0.46,0.45,0.94);transform-style:preserve-3d;will-change:transform;}
.service-icon::before{content:"";position:absolute;inset:-3px;background:linear-gradient(45deg,transparent,rgba(255,255,255,0.3),transparent);border-radius:50%;opacity:0;transform:rotate(0deg);transition:all 0.8s cubic-bezier(0.25,0.46,0.45,0.94);z-index:-1;}
.service-icon::after{content:"";position:absolute;inset:-8px;background:conic-gradient(from 0deg,transparent,rgba(255,255,255,0.2),transparent,rgba(255,255,255,0.2),transparent);border-radius:50%;opacity:0;animation:iconRotate 3s linear infinite;transition:opacity 0.6s cubic-bezier(0.25,0.46,0.45,0.94);z-index:-2;}
.service-box:hover .service-icon{transform:scale(1.1) rotateY(15deg) rotateZ(-5deg);filter:drop-shadow(0 10px 20px rgba(0,0,0,0.3));}
.service-box:hover .service-icon::before{opacity:1;transform:rotate(180deg);}
.service-box:hover .service-icon::after{opacity:1;}
@keyframes iconRotate { from{transform:rotate(0deg);} to{transform:rotate(360deg);} }

/* Buttons */
.btn-primary-hover,.btn-secondary-hover{position:relative;overflow:hidden;transition:all 0.4s cubic-bezier(0.175,0.885,0.32,1.275);transform-style:preserve-3d;}
.btn-primary-hover::before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:radial-gradient(circle,rgba(255,255,255,0.3) 0%,rgba(255,255,255,0.1) 70%);border-radius:50%;transform:translate(-50%,-50%);transition:all 0.6s cubic-bezier(0.175,0.885,0.32,1.275);z-index:0;}
.btn-primary-hover::after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.4),transparent);transition:left 0.5s ease;z-index:1;}
.btn-primary-hover:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 15px 30px rgba(0,0,0,0.2),0 5px 15px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.3);}
.btn-primary-hover:hover::before{width:300px;height:300px;}
.btn-primary-hover:hover::after{left:100%;}
.btn-secondary-hover::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,currentColor,transparent);opacity:0;transition:opacity 0.4s ease;z-index:-1;pointer-events:none;}
.btn-secondary-hover::after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);transition:left 0.5s ease;z-index:-1;pointer-events:none;}
.btn-secondary-hover:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 15px 30px rgba(0,0,0,0.15),0 5px 15px rgba(0,0,0,0.1);}
.btn-secondary-hover:hover::before{opacity:1;}
.btn-secondary-hover:hover::after{left:100%;}

/* Button base + color variants */
.btn-base { padding:12px 24px; border-radius:8px; text-decoration:none; font-weight:600; font-size:14px; display:inline-block; position:relative; z-index:2; }
.btn-bg-orange { background:#f26838; color:#fff; }
.btn-outline-orange { background:transparent; color:#f26838; border:2px solid #f26838; }
.btn-bg-blue { background:#3b82f6; color:#fff; }
.btn-outline-blue { background:transparent; color:#3b82f6; border:2px solid #3b82f6; }
.btn-bg-green { background:#10b981; color:#fff; }
.btn-outline-green { background:transparent; color:#10b981; border:2px solid #10b981; }
.btn-bg-purple { background:#8b5cf6; color:#fff; }
.btn-outline-purple { background:transparent; color:#8b5cf6; border:2px solid #8b5cf6; }
.btn-bg-cyan { background:#06b6d4; color:#fff; }
.btn-outline-cyan { background:transparent; color:#06b6d4; border:2px solid #06b6d4; }
.btn-bg-red { background:#ef4444; color:#fff; }
.btn-outline-red { background:transparent; color:#ef4444; border:2px solid #ef4444; }
.btn-bg-amber { background:#f59e0b; color:#fff; }
.btn-outline-amber { background:transparent; color:#f59e0b; border:2px solid #f59e0b; }
.btn-bg-pink { background:#ec4899; color:#fff; }
.btn-outline-pink { background:transparent; color:#ec4899; border:2px solid #ec4899; }
.btn-bg-indigo { background:#6366f1; color:#fff; }
.btn-outline-indigo { background:transparent; color:#6366f1; border:2px solid #6366f1; }

/* Headings & text */
.svc-card-title { text-align:center; margin-bottom:15px; color:#0a2540; }
.svc-card-text { color:#64748b; text-align:center; margin-bottom:20px; }
.svc-list { list-style:none; padding:0; color:#64748b; }
.svc-list li { margin-bottom:8px; }
.svc-list i { margin-right:8px; }

/* Color tokens per category */
.svc--orange { border-top-color:#f26838; }
.svc--blue { border-top-color:#3b82f6; }
.svc--green { border-top-color:#10b981; }
.svc--purple { border-top-color:#8b5cf6; }
.svc--cyan { border-top-color:#06b6d4; }
.svc--red { border-top-color:#ef4444; }
.svc--amber { border-top-color:#f59e0b; }
.svc--pink { border-top-color:#ec4899; }
.svc--indigo { border-top-color:#6366f1; }

.icon-grad-orange { background:linear-gradient(135deg, #f26838, #ff7849); }
.icon-grad-blue { background:linear-gradient(135deg, #3b82f6, #1d4ed8); }
.icon-grad-green { background:linear-gradient(135deg, #10b981, #059669); }
.icon-grad-purple { background:linear-gradient(135deg, #8b5cf6, #7c3aed); }
.icon-grad-cyan { background:linear-gradient(135deg, #06b6d4, #0891b2); }
.icon-grad-red { background:linear-gradient(135deg, #ef4444, #dc2626); }
.icon-grad-amber { background:linear-gradient(135deg, #f59e0b, #d97706); }
.icon-grad-pink { background:linear-gradient(135deg, #ec4899, #db2777); }
.icon-grad-indigo { background:linear-gradient(135deg, #6366f1, #4f46e5); }

.clr-orange { color:#f26838; }
.clr-blue { color:#3b82f6; }
.clr-green { color:#10b981; }
.clr-purple { color:#8b5cf6; }
.clr-cyan { color:#06b6d4; }
.clr-red { color:#ef4444; }
.clr-amber { color:#f59e0b; }
.clr-pink { color:#ec4899; }
.clr-indigo { color:#6366f1; }

/* Particle effect */
.particle-effect { position:absolute; width:4px; height:4px; background:rgba(255,255,255,0.6); border-radius:50%; opacity:0; pointer-events:none; }
.service-box:hover .particle-effect { animation: particleFloat 2s ease-out infinite; }
@keyframes particleFloat { 0%{opacity:0; transform:translateY(0) scale(0);} 50%{opacity:1; transform:translateY(-20px) scale(1);} 100%{opacity:0; transform:translateY(-40px) scale(0);} }

/* Per-card particle positions */
.svc-webdev .pe-1{ top:20%; left:15%; animation-delay:0s; }
.svc-webdev .pe-2{ top:30%; right:20%; animation-delay:0.5s; }
.svc-webdev .pe-3{ top:60%; left:25%; animation-delay:1s; }

.svc-dmkt .pe-1{ top:25%; right:18%; animation-delay:0.2s; }
.svc-dmkt .pe-2{ top:45%; left:20%; animation-delay:0.7s; }
.svc-dmkt .pe-3{ top:65%; right:15%; animation-delay:1.2s; }

.svc-mobile .pe-1{ top:22%; left:12%; animation-delay:0.3s; }
.svc-mobile .pe-2{ top:35%; right:25%; animation-delay:0.8s; }
.svc-mobile .pe-3{ top:55%; left:30%; animation-delay:1.3s; }

.svc-graphic .pe-1{ top:18%; right:22%; animation-delay:0.4s; }
.svc-graphic .pe-2{ top:40%; left:18%; animation-delay:0.9s; }
.svc-graphic .pe-3{ top:62%; right:28%; animation-delay:1.4s; }

.svc-cloud .pe-1{ top:28%; left:16%; animation-delay:0.1s; }
.svc-cloud .pe-2{ top:50%; right:14%; animation-delay:0.6s; }
.svc-cloud .pe-3{ top:70%; left:22%; animation-delay:1.1s; }

.svc-automation .pe-1{ top:26%; right:19%; animation-delay:0.5s; }
.svc-automation .pe-2{ top:48%; left:17%; animation-delay:1.0s; }
.svc-automation .pe-3{ top:68%; right:24%; animation-delay:1.5s; }

.svc-cyber .pe-1{ top:21%; left:19%; animation-delay:0.6s; }
.svc-cyber .pe-2{ top:42%; right:21%; animation-delay:1.1s; }
.svc-cyber .pe-3{ top:64%; left:26%; animation-delay:1.6s; }

.svc-ecomm .pe-1{ top:24%; right:16%; animation-delay:0.7s; }
.svc-ecomm .pe-2{ top:46%; left:23%; animation-delay:1.2s; }
.svc-ecomm .pe-3{ top:66%; right:20%; animation-delay:1.7s; }

.svc-data .pe-1{ top:29%; left:14%; animation-delay:0.8s; }
.svc-data .pe-2{ top:51%; right:17%; animation-delay:1.3s; }
.svc-data .pe-3{ top:71%; left:21%; animation-delay:1.8s; }

/* Modern Services Section (if used on this page) */
.modern-services{padding:100px 0;background:linear-gradient(135deg,#f8fafc 0%,#e7f3ff 50%,#f1f5f9 100%);position:relative;}
.modern-services::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 100 100\"><defs><pattern id=\"grain\" width=\"100\" height=\"100\" patternUnits=\"userSpaceOnUse\"><circle cx=\"25\" cy=\"25\" r=\"1\" fill=\"%23f26838\" opacity=\"0.02\"/><circle cx=\"75\" cy=\"75\" r=\"1\" fill=\"%230a2540\" opacity=\"0.02\"/></pattern></defs><rect width=\"100\" height=\"100\" fill=\"url(%23grain)\"/></svg>');pointer-events:none;}
.modern-subtitle{color:#f26838;font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:2px;margin-bottom:15px;position:relative;}
.modern-subtitle::after{content:"";position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:60px;height:3px;background:linear-gradient(90deg,#f26838,#ff7849);border-radius:2px;}
.modern-title{font-size:42px;font-weight:800;color:#0a2540;margin-bottom:20px;line-height:1.2;background:linear-gradient(135deg,#0a2540,#153c63);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.modern-description{font-size:18px;color:#64748b;max-width:700px;margin:0 auto;line-height:1.7;font-weight:400;}
.modern-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:35px;margin-top:70px;position:relative;z-index:1;}
.modern-card{background:linear-gradient(145deg,#ffffff 0%,#fafbfc 100%);border-radius:28px;padding:50px 40px;text-align:center;transition:all 0.6s cubic-bezier(0.175,0.885,0.32,1.275);border:1px solid rgba(226,232,240,0.6);position:relative;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,0.08),0 1px 8px rgba(0,0,0,0.05),inset 0 1px 0 rgba(255,255,255,0.8);backdrop-filter:blur(20px);}
.modern-card::before{content:"";position:absolute;top:20px;right:20px;width:120px;height:120px;background:radial-gradient(circle,rgba(242,104,56,0.1) 0%,rgba(99,102,241,0.05) 50%,transparent 100%);border-radius:50%;opacity:0;transform:scale(0.5) rotate(0deg);transition:all 0.8s cubic-bezier(0.175,0.885,0.32,1.275);}
.modern-card::after{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,#f26838,#ff7849,#6366f1,#8b5cf6);background-size:300% 100%;border-radius:28px 28px 0 0;opacity:0;animation:gradientShift 3s ease-in-out infinite;transition:opacity 0.5s ease;}
.modern-card:hover{transform:translateY(-20px) scale(1.05) rotateX(5deg);box-shadow:0 40px 80px rgba(0,0,0,0.15),0 20px 40px rgba(242,104,56,0.2),0 5px 20px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.9);border-color:rgba(242,104,56,0.4);background:linear-gradient(145deg,#ffffff 0%,#ffffff 100%);}
.modern-card:hover::before{opacity:1;transform:scale(1.2) rotate(180deg);}
.modern-card:hover::after{opacity:1;}
.glass-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.05) 100%);backdrop-filter:blur(10px);border-radius:28px;opacity:0;transition:opacity 0.5s ease;pointer-events:none;}
.modern-card:hover .glass-overlay{opacity:1;}
.modern-icon{width:100px;height:100px;background:linear-gradient(135deg,#f26838 0%,#ff7849 50%,#ff8a5c 100%);border-radius:28px;display:flex;align-items:center;justify-content:center;margin:0 auto 35px;color:#fff;font-size:36px;position:relative;box-shadow:0 15px 35px rgba(242,104,56,0.3),0 5px 15px rgba(242,104,56,0.2),inset 0 2px 0 rgba(255,255,255,0.3),inset 0 -2px 0 rgba(0,0,0,0.1);transition:all 0.6s cubic-bezier(0.175,0.885,0.32,1.275);overflow:hidden;}
.modern-icon::before{content:"";position:absolute;inset:-4px;background:linear-gradient(45deg,#f26838,#ff7849,#6366f1,#8b5cf6,#f26838);background-size:400% 400%;border-radius:32px;z-index:-1;opacity:0;animation:gradientRotate 4s ease-in-out infinite;transition:opacity 0.6s ease;}
.modern-icon::after{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent,rgba(255,255,255,0.4),transparent);transform:rotate(45deg) translateX(-100%);transition:transform 0.8s ease;}
.modern-card:hover .modern-icon{transform:scale(1.15) rotateY(15deg) rotateZ(-5deg);box-shadow:0 25px 50px rgba(242,104,56,0.5),0 15px 30px rgba(242,104,56,0.3),0 0 40px rgba(242,104,56,0.2),inset 0 2px 0 rgba(255,255,255,0.4);background:linear-gradient(135deg,#ff7849 0%,#f26838 50%,#e55a2b 100%);}
.modern-card:hover .modern-icon::before{opacity:1;}
.modern-card:hover .modern-icon::after{transform:rotate(45deg) translateX(100%);}
.modern-card-title{font-size:24px;font-weight:800;color:#0a2540;margin-bottom:20px;line-height:1.3;transition:all 0.5s cubic-bezier(0.175,0.885,0.32,1.275);position:relative;z-index:2;}
.modern-card:hover .modern-card-title{background:linear-gradient(135deg,#f26838,#ff7849,#6366f1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;transform:translateY(-3px);}
.modern-card-desc{font-size:16px;color:#64748b;line-height:1.8;margin-bottom:35px;font-weight:400;transition:all 0.4s ease;position:relative;z-index:2;}
.modern-card:hover .modern-card-desc{color:#475569;transform:translateY(-2px);}
.modern-actions{display:flex;gap:18px;justify-content:center;align-items:center;position:relative;z-index:2;}
.modern-btn-primary{background:linear-gradient(135deg,#f26838,#ff7849);color:#fff;padding:16px 32px;border-radius:16px;text-decoration:none;font-size:16px;font-weight:700;transition:all 0.5s cubic-bezier(0.175,0.885,0.32,1.275);box-shadow:0 8px 25px rgba(242,104,56,0.3),0 3px 10px rgba(242,104,56,0.2),inset 0 1px 0 rgba(255,255,255,0.2);position:relative;overflow:hidden;border:1px solid rgba(255,255,255,0.2);}
.modern-btn-primary::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.4),transparent);transition:left 0.7s ease;}
.modern-btn-primary::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#ff7849,#f26838,#e55a2b);opacity:0;transition:opacity 0.4s ease;border-radius:16px;z-index:-1;}
.modern-btn-primary:hover{color:#fff;text-decoration:none;transform:translateY(-4px) scale(1.05);box-shadow:0 15px 40px rgba(242,104,56,0.5),0 8px 20px rgba(242,104,56,0.3),0 0 30px rgba(242,104,56,0.2),inset 0 1px 0 rgba(255,255,255,0.3);}
.modern-btn-primary:hover::before{left:100%;}
.modern-btn-primary:hover::after{opacity:1;}
.modern-btn-secondary{background:linear-gradient(135deg,rgba(248,250,252,0.8),rgba(255,255,255,0.9));color:#64748b;padding:16px 32px;border:2px solid rgba(226,232,240,0.8);border-radius:16px;text-decoration:none;font-size:16px;font-weight:700;transition:all 0.5s cubic-bezier(0.175,0.885,0.32,1.275);position:relative;overflow:hidden;backdrop-filter:blur(10px);}
.modern-btn-secondary::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#f26838,#ff7849);opacity:0;transition:opacity 0.5s ease;border-radius:14px;z-index:-1;}
.modern-btn-secondary:hover{color:#fff;text-decoration:none;border-color:#f26838;transform:translateY(-4px) scale(1.05);box-shadow:0 12px 30px rgba(242,104,56,0.4);}
.modern-btn-secondary:hover::before{opacity:1;}
@keyframes gradientShift{0%{background-position:0% 50%;}50%{background-position:100% 50%;}100%{background-position:0% 50%;}}
@keyframes gradientRotate{0%{background-position:0% 50%;}50%{background-position:100% 50%;}100%{background-position:0% 50%;}}
@media (max-width: 768px){.modern-services{padding:60px 0;}.modern-title{font-size:28px;}.modern-grid{grid-template-columns:1fr;gap:25px;margin-top:40px;}.modern-card{padding:30px 20px;}.modern-actions{flex-direction:column;}}
