/* Base Reset Enhancements */
html { scroll-behavior: smooth; }
body.loaded #loading-screen { opacity:0; pointer-events:none; }

/* Loading Screen */
.loading-screen { position:fixed; inset:0; background:#fff; z-index:2000; transition:opacity 1s ease; }
.spinner-wrapper { position:relative; width:64px; height:64px; margin:0 auto; }
.spinner-wrapper .outer-ring { position:absolute; inset:0; border:3px solid #e5e7eb; border-top-color:#60a5fa; border-radius:50%; animation:spin 1.2s linear infinite; }
.spinner-wrapper .inner-ring { position:absolute; inset:8px; border:2px solid rgba(239,68,68,0.4); border-right-color:transparent; border-radius:50%; animation:spinReverse 2s linear infinite; }
.spinner-wrapper .pulsar { position:absolute; inset:18px; background:radial-gradient(circle at 30% 30%, #ef4444, #fca5a5); border-radius:50%; filter:blur(2px); animation:pulse 1.8s ease-in-out infinite; opacity:.4; }
.loading-dots .dot { width:8px; height:8px; background:#60a5fa; border-radius:50%; animation:bounce 1s infinite alternate; }
.loading-dots .dot:nth-child(2){ animation-delay:.2s; background:#fca5a5; }
.loading-dots .dot:nth-child(3){ animation-delay:.4s; }
.display-4.fw-medium.mt-4.build-powerful {width: 60%; margin: 0 auto 30px; margin-top: 0px;}
@keyframes spin { to { transform:rotate(360deg);} }
@keyframes spinReverse { to { transform:rotate(-360deg);} }
@keyframes pulse { 0%,100% { transform:scale(.9); opacity:.3;} 50% { transform:scale(1.05); opacity:.6;} }
@keyframes bounce { to { transform:translateY(-6px); opacity:.7; } }

/* Scroll Progress */
.scroll-progress { position:fixed; top:0; left:0; width:100%; height:4px; background:rgba(0,0,0,.05); z-index:1500; overflow:hidden; }
.scroll-progress .bar { height:100%; width:0; background:linear-gradient(90deg,#60a5fa,#fda4af,#60a5fa); background-size:200% 100%; animation:progressSheen 3s linear infinite; box-shadow:0 0 6px rgba(96,165,250,.5); }
@keyframes progressSheen { 0% { background-position:0 0; } 100% { background-position:200% 0; } }


/* Hero Section */
.hero-section { background:linear-gradient(135deg,#f8fafc,#ffffff,#f1f5f9); }
.hero-section .underline-word::after { content:""; position:absolute; left:0; right:0; bottom:-2px; height:3px; background:#60a5fa; border-radius:4px; }
.capabilities-grid .number-circle { width:42px; height:42px; background:#2563eb; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:600; font-size:.85rem; border-radius:50%; box-shadow:0 4px 14px -4px rgba(37,99,235,.55); transition:.35s; }
.capabilities-grid .capability-item:hover .number-circle { background:#1d4ed8; transform:translateY(-4px); box-shadow:0 8px 24px -6px rgba(37,99,235,.55); }
.capabilities-grid h3 { transition:.3s; }
.capabilities-grid .capability-item:hover h3 { color:#1e3a8a; }
.hero-section-text {width: 77%; margin: 0 auto; margin-bottom: 0px;}
/* CTA Buttons */
.cta-primary { position:relative; overflow:hidden; border-radius:1.25rem; background:linear-gradient(90deg,#111,#000,#222); box-shadow:0 10px 40px -10px rgba(0,0,0,.45); transition:.55s cubic-bezier(.4,.8,.4,1); }
.cta-primary:hover { transform:translateY(-6px) scale(1.03); box-shadow:0 18px 55px -12px rgba(0,0,0,.6); }
.cta-primary::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent); transform:translateX(-100%); animation:shine 2.8s linear infinite; }
@keyframes shine { to { transform:translateX(100%); } }
.cta-secondary { border-width:2px; border-radius:1.25rem; backdrop-filter:blur(6px); transition:.5s; }
.cta-secondary:hover { transform:translateY(-4px); }

/* Placeholder sections styling */
.placeholder-section { position:relative; }
.placeholder-section::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 30% 20%,rgba(96,165,250,.08),transparent 60%); opacity:.4; pointer-events:none; }

/* Background dynamic decorative layers (JS will toggle) */
.decor-layer { position:absolute; pointer-events:none; mix-blend-mode:normal; }
.decor-geom { border:1px solid rgba(96,165,250,.3); backdrop-filter:blur(2px); box-shadow:0 10px 40px -8px rgba(96,165,250,.3); animation:float 10s ease-in-out infinite; }
@keyframes float { 0%,100% { transform:translateY(-10px) rotate(0deg);} 50% { transform:translateY(10px) rotate(6deg);} }

/* Progress active section indicator (floating chip) */
#active-section-indicator { position:fixed; top:72px; right:24px; z-index:1400; background:rgba(255,255,255,.95); border:1px solid rgba(96,165,250,.25); padding:.35rem .75rem; border-radius:1rem; font-size:.65rem; letter-spacing:.5px; display:flex; align-items:center; gap:.4rem; box-shadow:0 6px 20px -6px rgba(0,0,0,.12); animation:fadeIn .6s ease; }
#active-section-indicator .pulse { width:8px; height:8px; border-radius:50%; background:#3b82f6; box-shadow:0 0 0 4px rgba(59,130,246,.35); animation:pulseInd 2s infinite; }
@keyframes pulseInd { 0% { transform:scale(.6); opacity:.9;} 70% { transform:scale(1); opacity:0;} 100% { opacity:0; } }
@keyframes fadeIn { from { opacity:0; transform:translateY(-6px);} to { opacity:1; transform:translateY(0);} }

/* Utility */
.transition-all { transition:all .45s ease; }

/* Media Queries */
@media (max-width: 575.98px) {
  .capabilities-grid .number-circle { width:38px; height:38px; }
  #active-section-indicator { top:64px; right:12px; }
}

/* ================= WHY CHOOSE US SECTION ================= */
.why-section { padding-top:4rem; padding-bottom:4.5rem; }
.why-bg-layers .why-gradient.base { position:absolute; inset:0; background:linear-gradient(135deg,#f8fafc 0%, #ffffff 50%, #f1f5f9 100%); }
.why-bg-layers .why-gradient.accent { position:absolute; inset:0; background:radial-gradient(circle at 75% 20%, rgba(239,68,68,.12), transparent 60%), radial-gradient(circle at 25% 80%, rgba(96,165,250,.12), transparent 65%); mix-blend-mode:normal; }
.why-bg-layers .why-noise { position:absolute; inset:0; opacity:.03; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='1' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size:160px 160px; }
.why-bg-layers .why-grid.primary { position:absolute; inset:0; opacity:.04; background-image:linear-gradient(rgba(107,114,128,.7) 1px, transparent 1px), linear-gradient(90deg, rgba(107,114,128,.7) 1px, transparent 1px); background-size:60px 60px; }
.why-bg-layers .why-grid.secondary { position:absolute; inset:0; opacity:.05; background-image:linear-gradient(rgba(156,163,175,.6) 1px, transparent 1px), linear-gradient(90deg, rgba(239,68,68,.3) 1px, transparent 1px); background-size:20px 20px; }
.why-bg-layers .why-diagonals { position:absolute; inset:0; opacity:.06; background-image:linear-gradient(45deg, rgba(239,68,68,.15) 1px, transparent 1px); background-size:40px 40px; }
.why-bg-layers .why-dots { position:absolute; inset:0; opacity:.05; background-image:radial-gradient(circle at 30px 30px,#374151 2px,transparent 2px), radial-gradient(circle at 90px 90px,#ef4444 1.5px,transparent 1.5px); background-size:120px 120px, 180px 180px; }

.why-header .status-badge { background:rgba(255,255,255,.8); border:1px solid rgba(0,0,0,.08); border-radius:999px; backdrop-filter:blur(16px); box-shadow:0 6px 18px -8px rgba(0,0,0,.12); }
.why-header .pulse-dot { width:10px; height:10px; background:#111; border-radius:50%; position:relative; animation:pulseInd 2.5s infinite; }
.why-title .gradient-text { background:linear-gradient(90deg,#111,#000,#333); -webkit-background-clip:text; background-clip:text; color:transparent; }
.why-title .underline-bar { position:absolute; left:0; right:0; bottom:-8px; height:6px; border-radius:4px; background:linear-gradient(90deg,#222,#000,#444); box-shadow:0 4px 14px -4px rgba(0,0,0,.4); }
.hostage-text { color:#222; }
.fragile-word .mini-underline { position:absolute; left:0; right:0; bottom:-2px; height:2px; background:#9ca3af; border-radius:2px; }

/* Problem Cards */
.problem-card { background:rgba(255,255,255,.95); backdrop-filter:blur(18px); border:1px solid rgba(0,0,0,.08); border-radius:1.5rem; padding:2rem; transition:.55s; box-shadow:0 10px 28px -12px rgba(0,0,0,.15); }
.problem-card:hover { transform:translateY(-10px); box-shadow:0 18px 45px -10px rgba(0,0,0,.25); }
.problem-card .number-badge { width:56px; height:56px; border-radius:1rem; display:flex; align-items:center; justify-content:center; font-size:1.35rem; font-weight:700; color:#fff; transition:.6s; box-shadow:0 10px 24px -8px rgba(0,0,0,.3); }
.problem-card .number-badge.red { background:linear-gradient(135deg,#ef4444,#dc2626); }
.problem-card .number-badge.gray { background:linear-gradient(135deg,#4b5563,#374151); }
.problem-card .number-badge.red-alt { background:linear-gradient(135deg,#dc2626,#b91c1c); }
.problem-card .number-badge.gray-alt { background:linear-gradient(135deg,#374151,#1f2937); }
.problem-card:hover .number-badge { transform:scale(1.1) rotate(8deg); }
.problem-card .number-bar { width:8px; height:42px; border-radius:4px; opacity:.6; }
.problem-card .number-bar.red { background:linear-gradient(180deg,#ef4444,#dc2626); }
.problem-card .number-bar.gray { background:linear-gradient(180deg,#6b7280,#374151); }
.problem-card .number-bar.red-alt { background:linear-gradient(180deg,#dc2626,#b91c1c); }
.problem-card .number-bar.gray-alt { background:linear-gradient(180deg,#6b7280,#374151); }
.impact-indicator { font-size:.65rem; letter-spacing:.5px; padding:.35rem .65rem; border-radius:999px; font-weight:600; border:1px solid; text-transform:uppercase; }
.impact-indicator.red { background:rgba(254,226,226,.6); color:#991b1b; border-color:rgba(248,113,113,.6); }
.impact-indicator.gray { background:rgba(243,244,246,.65); color:#374151; border-color:rgba(156,163,175,.6); }
.impact-indicator.red-alt { background:rgba(254,226,226,.6); color:#7f1d1d; border-color:rgba(239,68,68,.6); }
.impact-indicator.gray-alt { background:rgba(229,231,235,.65); color:#1f2937; border-color:rgba(107,114,128,.55); }
.problem-card .metric-dot { width:8px; height:8px; border-radius:50%; animation:pulse 2s infinite; }
.metric-dot.red { background:#ef4444; box-shadow:0 0 0 4px rgba(239,68,68,.25); }
.metric-dot.gray { background:#6b7280; box-shadow:0 0 0 4px rgba(107,114,128,.25); }
.metric-dot.red-alt { background:#dc2626; box-shadow:0 0 0 4px rgba(220,38,38,.25); }
.metric-dot.gray-alt { background:#374151; box-shadow:0 0 0 4px rgba(55,65,81,.25); }
.problem-card .hover-glow { position:absolute; inset:0; border-radius:inherit; opacity:0; transition:.6s; }
.problem-card:hover .hover-glow.red { background:linear-gradient(90deg,rgba(239,68,68,.12),rgba(220,38,38,.12)); opacity:1; }
.problem-card:hover .hover-glow.gray { background:linear-gradient(90deg,rgba(107,114,128,.15),rgba(55,65,81,.1)); opacity:1; }
.problem-card:hover .hover-glow.red-alt { background:linear-gradient(90deg,rgba(220,38,38,.15),rgba(185,28,28,.12)); opacity:1; }
.problem-card:hover .hover-glow.gray-alt { background:linear-gradient(90deg,rgba(55,65,81,.18),rgba(31,41,55,.14)); opacity:1; }

/* CTA Panel */
.cta-panel { background:rgba(255,255,255,.95); border:1px solid rgba(0,0,0,.08); border-radius:2rem; box-shadow:0 14px 48px -16px rgba(0,0,0,.25); transition:.65s; }
.cta-panel:hover { transform:translateY(-6px); box-shadow:0 24px 70px -18px rgba(0,0,0,.35); }
.cta-panel .badge-transform { background:rgba(254,242,242,.8); border:1px solid rgba(254,202,202,.6); border-radius:999px; }
.cta-panel .pulse-dot { width:8px; height:8px; border-radius:50%; background:#dc2626; animation:pulseInd 2s infinite; }
.broken-word .broken-gradient { background:linear-gradient(90deg,#ef4444,#dc2626,#b91c1c); -webkit-background-clip:text; background-clip:text; color:transparent; }
.broken-word .broken-underline { position:absolute; left:0; right:0; bottom:-6px; height:5px; background:linear-gradient(90deg,#f87171,#ef4444,#dc2626); border-radius:4px; transform-origin:left; transition:.6s; }
.cta-panel:hover .broken-word .broken-underline { transform:scaleX(1.05); }
.transform-btn { border-radius:1.2rem; font-weight:600; position:relative; overflow:hidden; transition:.55s; }
.transform-btn::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent); transform:translateX(-100%); animation:shine 3s linear infinite; }
.transform-btn:hover { transform:translateY(-4px) scale(1.03); }

/* Reveal Animations */
.fade-on-visible { opacity:1; transform:translateY(30px); transition:1s cubic-bezier(.22,.8,.3,1); }
.fade-on-visible.visible { opacity:1; transform:translateY(0); }

@media (max-width: 991.98px) {
  .why-title { font-size:2.4rem; }
  .problem-card { padding:1.5rem; }
  .cta-panel { padding:2.25rem 1.75rem; }
}

@media (max-width: 575.98px) {
  .why-title { font-size:2rem; }
  .problem-card .number-badge { width:48px; height:48px; font-size:1.15rem; }
}

/* ================= SERVICES SECTION ================= */
.services-section { background:linear-gradient(135deg,#ffffff,#f8fafc); }
.services-section::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 80% 15%,rgba(239,68,68,.08),transparent 70%), radial-gradient(circle at 15% 85%,rgba(59,130,246,.08),transparent 70%); pointer-events:none; }
.service-card { position:relative; background:rgba(255,255,255,.9); border:1px solid rgba(0,0,0,.08); border-radius:1.5rem; padding:1.85rem 1.7rem; overflow:hidden; transition:.55s; backdrop-filter:blur(12px); box-shadow:0 8px 24px -10px rgba(0,0,0,.15); }
.service-card:hover { transform:translateY(-10px) scale(1.02); box-shadow:0 18px 48px -14px rgba(0,0,0,.25); border-color:rgba(0,0,0,.14); }
.service-card .card-inner { position:relative; z-index:2; display:flex; flex-direction:column; height:100%; }
.service-card .feature-item { position:relative; padding-left:18px; font-size:.8rem; font-weight:500; color:#374151; letter-spacing:.25px; }
.service-card .feature-item + .feature-item { margin-top:.4rem; }
.service-card .feature-item::before { content:""; position:absolute; left:0; top:7px; width:8px; height:8px; border-radius:50%; background:linear-gradient(90deg,#ef4444,#dc2626); box-shadow:0 0 0 4px rgba(239,68,68,.25); transition:.45s; }
.service-card[data-gradient="blue"] .feature-item::before { background:linear-gradient(90deg,#3b82f6,#1d4ed8); box-shadow:0 0 0 4px rgba(59,130,246,.25); }
.service-card[data-gradient="blue-deep"] .feature-item::before { background:linear-gradient(90deg,#2563eb,#1e40af); box-shadow:0 0 0 4px rgba(37,99,235,.3); }
.service-card[data-gradient="blue-light"] .feature-item::before { background:linear-gradient(90deg,#60a5fa,#2563eb); box-shadow:0 0 0 4px rgba(96,165,250,.3); }
.service-card[data-gradient="red-soft"] .feature-item::before { background:linear-gradient(90deg,#f87171,#dc2626); box-shadow:0 0 0 4px rgba(248,113,113,.28); }
.service-card:hover .feature-item::before { transform:scale(1.15); }
.service-card .badge-tech { background:#f3f4f6; color:#374151; font-size:.625rem; letter-spacing:.5px; padding:.35rem .55rem; border-radius:.5rem; font-weight:600; text-transform:uppercase; border:1px solid #e5e7eb; transition:.4s; }
.service-card .badge-tech:hover { background:#eff6ff; color:#1d4ed8; border-color:#bfdbfe; }
.service-card.gradient-red::after, .service-card.gradient-blue::after, .service-card.gradient-blue-deep::after, .service-card.gradient-blue-light::after, .service-card.gradient-red-soft::after { content:""; position:absolute; inset:0; opacity:0; transition:.6s; background:linear-gradient(135deg,rgba(0,0,0,.05),rgba(255,255,255,.05)); mix-blend-mode:overlay; }
.service-card:hover::after { opacity:.5; }
.service-card .hover-glow { position:absolute; inset:0; background:radial-gradient(circle at 30% 20%,rgba(239,68,68,.12),transparent 65%); opacity:0; transition:.6s; }
.service-card[data-gradient="blue"] .hover-glow { background:radial-gradient(circle at 70% 30%,rgba(59,130,246,.15),transparent 65%); }
.service-card[data-gradient="blue-deep"] .hover-glow { background:radial-gradient(circle at 60% 25%,rgba(37,99,235,.18),transparent 65%); }
.service-card[data-gradient="blue-light"] .hover-glow { background:radial-gradient(circle at 40% 70%,rgba(96,165,250,.16),transparent 65%); }
.service-card[data-gradient="red-soft"] .hover-glow { background:radial-gradient(circle at 30% 80%,rgba(248,113,113,.16),transparent 65%); }
.service-card:hover .hover-glow { opacity:1; }

.services-cta { background:linear-gradient(120deg,#111827,#7f1d1d,#111827); position:relative; }
.services-cta .cta-bg { position:absolute; inset:0; background:radial-gradient(circle at 15% 35%,rgba(239,68,68,.3),transparent 60%),radial-gradient(circle at 85% 70%,rgba(239,68,68,.25),transparent 65%); opacity:.5; }
.services-cta .cta-main { border-radius:1rem; position:relative; overflow:hidden; }
.services-cta .cta-main::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent); transform:translateX(-100%); animation:shine 3.6s linear infinite; }
.services-cta .cta-alt { border-width:2px; }

@media (max-width: 991.98px) {
  .service-card { padding:1.5rem 1.35rem; }
}
@media (max-width: 575.98px) {
  .service-card { padding:1.25rem 1.1rem; }
}

/* ================= ECOMMERCE / CASE STUDIES SECTION ================= */
.ecommerce-section { background:linear-gradient(180deg,#f8f9fb,#fff 40%,#f8f9fb); }
.ecom-bg .layer { position:absolute; inset:0; }
.ecom-bg .layer.base { background:radial-gradient(circle at 20% 30%,rgba(255,0,64,.05),transparent 60%),radial-gradient(circle at 80% 70%,rgba(0,123,255,.05),transparent 65%); }
.ecom-bg .layer.accent { background:linear-gradient(120deg,rgba(255,0,64,.04),rgba(0,123,255,.04)); mix-blend-mode:overlay; }
.ecom-bg .layer.dots { background-image:radial-gradient(rgba(0,0,0,.05) 1px,transparent 1px); background-size:24px 24px; mask-image:linear-gradient(to bottom,rgba(0,0,0,.6),rgba(0,0,0,0)); }
.ecom-bg .layer.blobs:before, .ecom-bg .layer.blobs:after { content:""; position:absolute; width:380px; height:380px; border-radius:50%; filter:blur(70px); opacity:.35; }
.ecom-bg .layer.blobs:before { top:10%; left:-5%; background:radial-gradient(circle,#ff4d6d,#ff1e42); }
.ecom-bg .layer.blobs:after { bottom:5%; right:-6%; background:radial-gradient(circle,#007bff,#6610f2); }
.ecom-header .badge-pill { background:linear-gradient(90deg,#ffe5ea,#fff); border:1px solid #ffd1d9; border-radius:50rem; box-shadow:0 4px 16px -8px rgba(220,53,69,.35); }
.pulse-dot { width:10px; height:10px; border-radius:50%; background:#dc3545; position:relative; display:inline-block; }
.pulse-dot:after { content:""; position:absolute; inset:0; border-radius:inherit; background:inherit; animation:pulse 1.6s ease-out infinite; }
.gradient-text-line { color:#111; }
.gradient-text-line .underline { position:absolute; left:0; bottom:-6px; height:4px; width:100%; background:linear-gradient(90deg,#ff1e42,#ff6a89,#ff1e42); border-radius:4px; opacity:.9; }

/* Case Studies */
.case-study { position:relative; }
.icon-tile { width:78px; height:78px; border-radius:24px; background:linear-gradient(135deg,#fff,#ffe6ea); display:flex; align-items:center; justify-content:center; font-size:2rem; color:#dc3545; box-shadow:0 8px 28px -10px rgba(220,53,69,.4); position:relative; z-index:2; }
.icon-tile.blue { background:linear-gradient(135deg,#fff,#e6f0ff); color:#0d6efd; box-shadow:0 8px 28px -10px rgba(13,110,253,.35); }
.study-card { background:#fff; border:1px solid #eee; border-radius:28px; box-shadow:0 12px 36px -14px rgba(0,0,0,.15); transition:transform .55s cubic-bezier(.22,1,.36,1),box-shadow .45s ease; }
.study-card:hover { transform:translateY(-6px); box-shadow:0 14px 42px -12px rgba(0,0,0,.22); }
.study-card .bg.fx { position:absolute; inset:0; opacity:.12; mix-blend-mode:overlay; }
.study-card .bg.fx.red { background:linear-gradient(145deg,#ff1e42,#ff8da4); }
.study-card .bg.fx.blue { background:linear-gradient(145deg,#0d6efd,#6610f2); }
.stats-row .stat-tile { position:relative; background:linear-gradient(135deg,#fff,#f5f6f8); border:1px solid #eee; transition:all .4s ease; overflow:hidden; }
.stats-row .stat-tile:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.7),transparent 70%); opacity:0; transition:opacity .6s; }
.stats-row .stat-tile.green { border-color:#d1f7df; background:linear-gradient(135deg,#f1fff6,#e3f9ed); }
.stats-row .stat-tile.blue { border-color:#d6e9ff; background:linear-gradient(135deg,#f2f8ff,#e3effd); }
.stats-row .stat-tile.purple { border-color:#e2d9f9; background:linear-gradient(135deg,#f7f2ff,#ece4fb); }
.stat-value { font-weight:600; letter-spacing:-.5px; }
.stat-tile:hover:before { opacity:1; }
.hover-move { transition:transform .4s ease, color .4s ease; }
.hover-move:hover { transform:translateX(6px); }
.case-number { pointer-events:none; user-select:none; line-height:1; }
.dot.small { width:10px; height:10px; display:inline-block; border-radius:50%; background:#666; }
.dot.small.danger { background:#dc3545; }
.dot.small.success { background:#28a745; }

/* Features grid */
.feature-tile .ft-card { background:#fff; overflow:hidden; }
.ft-card { --border:rgba(0,0,0,.08); border:1px solid var(--border); box-shadow:0 8px 28px -12px rgba(0,0,0,.15); transition:transform .55s cubic-bezier(.22,1,.36,1),border-color .4s ease,box-shadow .4s ease; }
.ft-card .ft-bg { position:absolute; inset:0; opacity:0; transition:opacity .65s ease; background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.6),transparent 70%),linear-gradient(135deg,var(--c1,#ff1e42),var(--c2,#ff7a95)); }
.ft-card.red { --c1:#ff1e42; --c2:#ff8ba1; }
.ft-card.blue { --c1:#0d6efd; --c2:#6610f2; }
.ft-card.green { --c1:#28a745; --c2:#71dd96; }
.ft-card.purple { --c1:#6f42c1; --c2:#b089f7; }
.ft-card.orange { --c1:#fd7e14; --c2:#ffb36b; }
.ft-card.cyan { --c1:#20c997; --c2:#6aeed0; }
.ft-card .ft-num { font-size:2.25rem; font-weight:700; position:absolute; top:12px; right:18px; opacity:.14; line-height:1; pointer-events:none; }
.ft-card:hover { transform:translateY(-6px); border-color:rgba(0,0,0,.15); box-shadow:0 14px 42px -16px rgba(0,0,0,.28); }
.ft-card:hover .ft-bg { opacity:.75; mix-blend-mode:overlay; }
.ft-card:hover .ft-num { opacity:.24; }

/* CTA Panel */
.ecom-cta {  box-shadow:0 18px 48px -15px rgba(255,30,66,.55); border:1px solid rgba(255,255,255,.25); }
.ecom-cta .icon-pill { width:80px; height:80px; border-radius:26px; background:#000; display:flex; align-items:center; justify-content:center; color:#fff; font-size:2rem; position:relative; box-shadow:0 6px 24px -8px rgba(0,0,0,.4); backdrop-filter:blur(4px); margin: 0 auto; }
.ecom-cta .cta-bg { position:absolute; inset:0; background:radial-gradient(circle at 20% 30%,rgba(255,255,255,.35),transparent 60%),radial-gradient(circle at 80% 70%,rgba(255,255,255,.3),transparent 65%); mix-blend-mode:overlay; opacity:.6; }
.cta-main-btn { position:relative; overflow:hidden; }
.cta-main-btn:before { content:""; position:absolute; top:0; left:-20%; width:140%; height:100%; background:linear-gradient(120deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.4) 50%,rgba(255,255,255,0) 100%); transform:translateX(-60%); animation:shine 7s linear infinite; }

/* Responsive tweaks for ecommerce */
@media (max-width:991.98px){
  .case-number { font-size:4rem; }
  .study-card { border-radius:24px; }
  .ft-card .ft-num { font-size:2rem; }
}
@media (max-width:575.98px){
  .icon-tile { width:64px; height:64px; font-size:1.6rem; border-radius:20px; }
  .ft-card { padding:1.25rem!important; }
}


/* ================= EXPERTISE SECTION ================= */
.expertise-section { background:linear-gradient(180deg,#f8f9fb,#ffffff 55%,#f8f9fb); }
.expertise-bg .layer { position:absolute; inset:0; }
.expertise-bg .layer.gradient { background:radial-gradient(circle at 18% 25%,rgba(239,68,68,.12),transparent 60%),radial-gradient(circle at 82% 70%,rgba(59,130,246,.12),transparent 65%); }
.expertise-bg .layer.pattern { background-image:linear-gradient(rgba(0,0,0,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.05) 1px,transparent 1px); background-size:48px 48px; opacity:.28; mask-image:linear-gradient(to bottom,rgba(0,0,0,.55),rgba(0,0,0,0.05)); }
.expertise-bg .layer.glow:before,.expertise-bg .layer.glow:after { content:""; position:absolute; width:420px; height:420px; border-radius:50%; filter:blur(80px); opacity:.28; }
.expertise-bg .layer.glow:before { top:8%; left:-6%; background:radial-gradient(circle,#ff385c,#ff1e42); }
.expertise-bg .layer.glow:after { bottom:6%; right:-8%; background:radial-gradient(circle,#2563eb,#1e3a8a); }
.expertise-header .badge-exp { background:rgba(255,255,255,.85); border:1px solid rgba(0,0,0,.08); border-radius:50rem; backdrop-filter:blur(10px); box-shadow:0 6px 22px -10px rgba(0,0,0,.18); }
.sparkle-dot { width:10px; height:10px; border-radius:50%; background:#ef4444; position:relative; display:inline-block; }
.sparkle-dot:after { content:""; position:absolute; inset:0; border-radius:inherit; background:#ef4444; animation:pulse 1.9s ease-out infinite; opacity:.6; }

.expertise-card { position:relative; background:rgba(255,255,255,.88); border:1px solid rgba(0,0,0,.08); border-radius:1.4rem; overflow:hidden; backdrop-filter:blur(12px); box-shadow:0 10px 30px -14px rgba(0,0,0,.18); transition:.65s cubic-bezier(.22,1,.36,1); }
.expertise-card:hover { transform:translateY(-10px); box-shadow:0 20px 56px -18px rgba(0,0,0,.32); border-color:rgba(0,0,0,.18); }
.expertise-card .num-tile { width:54px; height:54px; border-radius:1rem; background:linear-gradient(135deg,#111,#333); color:#fff; font-weight:600; font-size:1.2rem; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 24px -10px rgba(0,0,0,.5); position:relative; }
.expertise-card .num-tile:before { content:""; position:absolute; inset:0; background:linear-gradient(120deg,rgba(255,255,255,.15),rgba(255,255,255,0)); border-radius:inherit; }
.expertise-card .feature-list li { position:relative; padding-left:16px; font-size:.78rem; font-weight:500; letter-spacing:.35px; margin-bottom:.5rem; color:#374151; }
.expertise-card .feature-list li:before { content:""; position:absolute; left:0; top:7px; width:8px; height:8px; border-radius:50%; background:linear-gradient(90deg,#ef4444,#2563eb); box-shadow:0 0 0 4px rgba(239,68,68,.25); transition:.5s; }
.expertise-card:hover .feature-list li:before { transform:scale(1.15); }
.expertise-card .stat-badge { background:#111; color:#fff; font-size:.55rem; letter-spacing:.5px; padding:.4rem .55rem; border-radius:.5rem; font-weight:600; text-transform:uppercase; }
.expertise-card .overlay-gradient { position:absolute; inset:0; opacity:0; background:linear-gradient(135deg,rgba(239,68,68,.15),rgba(59,130,246,.15)); mix-blend-mode:overlay; transition:.7s; }
.expertise-card:hover .overlay-gradient { opacity:1; }

.expertise-cta a { transition:.45s; }
.expertise-cta a:hover { transform:translateY(-4px); }

@media (max-width:991.98px){
  .expertise-card { border-radius:1.25rem; }
  .expertise-card .num-tile { width:50px; height:50px; }
}
@media (max-width:575.98px){
  .expertise-card { padding:.25rem; }
}

/* =============================
   PROCESS SECTION STYLES
   ============================= */
.process-section { background:#0b0f17; }
.process-section .process-bg .layer.gradient {position:absolute;inset:0;background:radial-gradient(circle at 20% 30%,rgba(255,55,95,.15),transparent 60%),radial-gradient(circle at 80% 70%,rgba(111,66,193,.18),transparent 65%),linear-gradient(140deg,#121a29,#0b0f17 55%,#101726);mix-blend-mode:normal;}
.process-section .process-bg .layer.pattern {position:absolute;inset:0;background-image:linear-gradient(transparent 94%,rgba(255,255,255,.04) 96%),linear-gradient(90deg,transparent 94%,rgba(255,255,255,.04) 96%);background-size:70px 70px;mask-image:radial-gradient(circle at center,rgba(255,255,255,.7),transparent 70%);opacity:.25;}
.process-section .process-bg .layer.glow {position:absolute;inset:0;pointer-events:none;}
.process-section .process-bg .layer.glow:before,.process-section .process-bg .layer.glow:after {content:"";position:absolute;width:420px;height:420px;background:radial-gradient(circle,rgba(220,53,69,.4),transparent 70%);filter:blur(65px);opacity:.55;animation:slow-float 16s linear infinite;}
.process-section .process-bg .layer.glow:after {background:radial-gradient(circle,rgba(111,66,193,.45),transparent 70%);left:auto;right:-120px;top:40%;animation-duration:22s;}
@keyframes slow-float {0%,100%{transform:translateY(-20px) translateX(0);}50%{transform:translateY(30px) translateX(-30px);}}
.badge-proc {background:linear-gradient(90deg,#dc3545,#6f42c1);border-radius:50px;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:#fff;position:relative;overflow:hidden;}
.badge-proc .mini-dot {width:10px;height:10px;background:#fff;border-radius:50%;display:inline-block;box-shadow:0 0 0 4px rgba(255,255,255,.15);}
.process-steps-wrapper {position:relative;}
.process-line {position:absolute;top:50%;left:0;width:100%;height:3px;background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(255,255,255,.02));transform:translateY(-50%);}
.process-steps .step-btn {position:relative;background:rgba(255,255,255,.04);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.08);padding:1rem .75rem;border-radius:16px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:.5rem;color:#fff;transition:all .35s cubic-bezier(.4,.14,.3,.99);font-size:.85rem;}
.process-steps .step-btn .circle {width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#1d2633,#141b25);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-weight:600;letter-spacing:.5px;color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.4);}
.process-steps .step-btn .title {line-height:1.2;}
.process-steps .step-btn:hover {border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.08);}
.process-steps .step-btn.active {background:linear-gradient(135deg,rgba(220,53,69,.15),rgba(111,66,193,.15));border-color:rgba(255,255,255,.28);box-shadow:0 4px 18px -4px rgba(220,53,69,.35),0 2px 10px -2px rgba(111,66,193,.3);}
.process-steps .step-btn.active .circle {background:linear-gradient(135deg,#dc3545,#6f42c1);color:#fff;border-color:rgba(255,255,255,.35);box-shadow:0 0 0 4px rgba(255,255,255,.12);}
.process-panels {position:relative;}
.process-panel {display:none;animation:panelIn .6s cubic-bezier(.4,.14,.3,.99);} 
.process-panel.active {display:block;}
@keyframes panelIn {0%{opacity:0;transform:translateY(25px);}100%{opacity:1;transform:translateY(0);}}
.process-panel .panel-inner {background:linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);border-radius:28px;position:relative;overflow:hidden;}
.process-panel .panel-inner:before {content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 0%,rgba(220,53,69,.18),transparent 55%),radial-gradient(circle at 85% 65%,rgba(111,66,193,.18),transparent 55%);opacity:.75;mix-blend-mode:overlay;pointer-events:none;}
.process-panel .panel-inner:after {content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(120deg,rgba(255,255,255,.12),rgba(255,255,255,0) 35%);opacity:.25;pointer-events:none;}
.step-badge {width:50px;height:50px;border-radius:14px;background:linear-gradient(135deg,#dc3545,#6f42c1);font-weight:600;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px -4px rgba(0,0,0,.5);position:relative;}
.details-grid .detail-card {position:relative;height:100%;background:linear-gradient(140deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:1.25rem;display:flex;flex-direction:column;gap:.5rem;overflow:hidden;transition:all .35s cubic-bezier(.4,.14,.3,.99);}
.details-grid .detail-card:before {content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 15% 10%,rgba(255,255,255,.15),transparent 60%);opacity:0;transition:opacity .5s;}
.details-grid .detail-card:hover {border-color:rgba(255,255,255,.22);box-shadow:0 6px 22px -6px rgba(0,0,0,.55);transform:translateY(-4px);}
.details-grid .detail-card:hover:before {opacity:1;}
.details-grid .detail-card .icon-wrap {width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1c2531,#141c25);border:1px solid rgba(255,255,255,.08);color:#fff;font-size:1.1rem;box-shadow:0 3px 10px -2px rgba(0,0,0,.45);}
.process-nav .btn {border-radius:40px;backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.2);}
.process-nav .btn:disabled {opacity:.4;}
.process-nav .btn:hover:not(:disabled) {background:linear-gradient(120deg,rgba(255,255,255,.12),rgba(255,255,255,.04));border-color:rgba(255,255,255,.4);}
.process-nav .dots .dot {width:14px;height:14px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.15);position:relative;transition:all .35s;}
.process-nav .dots .dot.active {background:linear-gradient(135deg,#dc3545,#6f42c1);border-color:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.15);}
.process-nav .dots .dot:hover {background:rgba(255,255,255,.35);}

.healthcare-management {
  display: flex;
  justify-content: end;
  gap: 20px;
}




@media (max-width: 767.98px){
  .process-steps .step-btn {padding:.85rem .5rem;border-radius:14px;}
  .process-steps .step-btn .circle {width:34px;height:34px;font-size:.85rem;}
  .process-panel .panel-inner {padding:1.75rem!important;}
  .details-grid .detail-card {padding:1rem;}
}
/* Stagger reveal for detail cards within active panel */
.process-panel.active .detail-card {opacity:0;transform:translateY(18px);}
.process-panel.active.revealed .detail-card {animation:detailIn .7s cubic-bezier(.4,.14,.3,.99) forwards;}
@keyframes detailIn {0%{opacity:0;transform:translateY(18px);}100%{opacity:1;transform:translateY(0);}}
/* Utility: lighten white 75% */
.text-white-75 {color:rgba(255,255,255,.75)!important;}

/* =============================
   TESTIMONIALS / SUCCESS STORIES
   ============================= */
.testimonials-section {background:#0c1119;color:#fff;}
.testimonials-section .testimonials-bg .layer.gradient {position:absolute;inset:0;background:radial-gradient(circle at 10% 25%,rgba(220,53,69,.18),transparent 60%),radial-gradient(circle at 85% 65%,rgba(111,66,193,.2),transparent 60%),linear-gradient(145deg,#0d141e,#0b1119 58%,#101a26);}
.testimonials-section .testimonials-bg .layer.pattern {position:absolute;inset:0;background-image:linear-gradient(transparent 95%,rgba(255,255,255,.04) 96%),linear-gradient(90deg,transparent 95%,rgba(255,255,255,.04) 96%);background-size:60px 60px;mask-image:radial-gradient(circle at center,rgba(255,255,255,.7),transparent 70%);opacity:.25;}
.testimonials-section .testimonials-bg .layer.glow {position:absolute;inset:0;pointer-events:none;}
.testimonials-section .testimonials-bg .layer.glow:before,.testimonials-section .testimonials-bg .layer.glow:after {content:"";position:absolute;width:420px;height:420px;background:radial-gradient(circle,rgba(111,66,193,.5),transparent 70%);filter:blur(75px);opacity:.55;animation:slow-float 18s linear infinite;}
.testimonials-section .testimonials-bg .layer.glow:after {background:radial-gradient(circle,rgba(220,53,69,.45),transparent 70%);left:auto;right:-120px;top:40%;animation-duration:24s;}
.gradient-pill {background:linear-gradient(90deg,#dc3545,#6f42c1);color:#fff;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;position:relative;overflow:hidden;}
.gradient-pill .dot {width:10px;height:10px;background:#fff;border-radius:50%;display:inline-block;box-shadow:0 0 0 4px rgba(255,255,255,.18);}
.story-card {position:relative;display:flex;flex-direction:column;background:linear-gradient(150deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);border-radius:28px;padding:1.75rem;overflow:hidden;min-height:100%;transition:all .45s cubic-bezier(.4,.14,.3,.99);}
.story-card:before {content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 0%,rgba(255,255,255,.15),transparent 60%),radial-gradient(circle at 85% 75%,rgba(255,255,255,.1),transparent 65%);opacity:0;transition:opacity .6s;}
.story-card:after {content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(120deg,rgba(255,255,255,.15),rgba(255,255,255,0) 40%);opacity:0;transition:opacity .6s;}
.story-card:hover {border-color:rgba(255,255,255,.25);box-shadow:0 12px 40px -10px rgba(0,0,0,.65);transform:translateY(-6px);}
.story-card:hover:before,.story-card:hover:after {opacity:1;}
.story-card .story-top {display:flex;align-items:center;gap:1rem;}
.story-card .icon-wrap {width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,#1c2430,#141b25);border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:#fff;box-shadow:0 4px 14px -4px rgba(0,0,0,.5);}
.metrics-grid .metric-tile {position:relative;background:linear-gradient(140deg,rgba(255,255,255,.06),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:.7rem .75rem;display:flex;flex-direction:column;gap:.25rem;min-height:72px;overflow:hidden;}
.metrics-grid .metric-tile:before {content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 15% 15%,rgba(255,255,255,.25),transparent 60%);opacity:0;transition:opacity .6s;}
.metrics-grid .metric-tile:hover:before {opacity:1;}
.metrics-grid .metric-tile .label {font-size:.675rem;letter-spacing:.05em;text-transform:uppercase;color:rgba(255,255,255,.55);font-weight:600;}
.metrics-grid .metric-tile .value {font-size:.95rem;font-weight:600;letter-spacing:.5px;}
.moving-accent {position:absolute;top:0;left:0;width:160px;height:160px;background:radial-gradient(circle at center,rgba(255,255,255,.25),transparent 70%);mix-blend-mode:overlay;filter:blur(40px);pointer-events:none;animation:accent-move 22s linear infinite;opacity:.4;}
@keyframes accent-move {0%{transform:translate(10%,15%) scale(1);}25%{transform:translate(65%,25%) scale(1.15);}50%{transform:translate(40%,65%) scale(.9);}75%{transform:translate(75%,70%) scale(1.1);}100%{transform:translate(10%,15%) scale(1);}}
/* Reveal adjustments */
.testimonial-cards .story-card {opacity:0;transform:translateY(24px);}
.testimonial-cards .story-card.visible {animation:storyIn .8s cubic-bezier(.4,.14,.3,.99) forwards;}
@keyframes storyIn {0%{opacity:0;transform:translateY(24px);}100%{opacity:1;transform:translateY(0);}}

/* =============================
   FAQ SECTION STYLES
   ============================= */
.faq-section {position:relative;}
.faq-section .faq-bg .layer.gradient {position:absolute;inset:0;background:radial-gradient(circle at 10% 20%,rgba(220,53,69,.08),transparent 60%),radial-gradient(circle at 85% 70%,rgba(111,66,193,.08),transparent 60%),linear-gradient(145deg,#ffffff,#f7f9fc 60%,#eef2f7);}
.faq-section .faq-bg .layer.pattern {position:absolute;inset:0;background-image:linear-gradient(transparent 96%,rgba(0,0,0,.035) 97%),linear-gradient(90deg,transparent 96%,rgba(0,0,0,.035) 97%);background-size:70px 70px;mask-image:radial-gradient(circle at center,rgba(255,255,255,.8),transparent 75%);opacity:.45;}
.faq-pill {background:linear-gradient(90deg,#dc3545,#6f42c1);color:#fff;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;position:relative;overflow:hidden;}
.faq-pill .dot {width:10px;height:10px;background:#fff;border-radius:50%;display:inline-block;box-shadow:0 0 0 4px rgba(255,255,255,.18);}
.faq-section .text-gradient {background:linear-gradient(90deg,#dc3545,#6f42c1);background-clip:text;-webkit-background-clip:text;color:transparent;}
.faq-accordion {position:relative;}
.faq-item {background:#fff;border:1px solid #e3e8ef;border-radius:22px;overflow:hidden;box-shadow:0 2px 4px rgba(0,0,0,.02),0 1px 2px rgba(0,0,0,.05);transition:all .4s cubic-bezier(.4,.14,.3,.99);}
.faq-item + .faq-item {margin-top:1rem;}
.faq-item:hover {border-color:#d0d7e2;box-shadow:0 6px 18px -6px rgba(31,41,55,.12);}
.faq-question {width:100%;text-align:left;background:transparent;border:none;padding:1.4rem 1.75rem;display:flex;align-items:center;justify-content:space-between;gap:1.25rem;font-weight:600;color:#1b2735;font-size:1.05rem;letter-spacing:.25px;position:relative;transition:background .4s,border .4s;}
.faq-question:focus {outline:none;box-shadow:0 0 0 4px rgba(220,53,69,.25);border-radius:inherit;}
.faq-question .icon-wrap {width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,#f1f4f9,#e5ebf3);display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:#555;border:1px solid #d9e1ea;transition:all .4s;flex-shrink:0;}
.faq-question:hover .icon-wrap {background:linear-gradient(135deg,#fff,#eef2f6);border-color:#cfd6df;}
.faq-item.open .faq-question .icon-wrap {background:linear-gradient(135deg,#dc3545,#6f42c1);color:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 4px 18px -4px rgba(220,53,69,.45),0 2px 10px -2px rgba(111,66,193,.35);}
.faq-answer {border-top:1px solid #eef1f5;transition:height .45s cubic-bezier(.4,.14,.3,.99),opacity .35s;}
.faq-answer .inner {padding:0 1.75rem 1.6rem;font-size:.97rem;line-height:1.6;color:#4a5663;}
.faq-item.open {border-color:#cdd6e2;}
/* Expand/collapse animation using height JS controlled + fade */
.faq-answer[hidden] {display:block !important;height:0;opacity:0;padding-top:0;padding-bottom:0;}
.faq-item.open .faq-answer {opacity:1;}
/* Reveal animation */
.faq-item {opacity:0;transform:translateY(24px);}
.faq-item.visible {animation:faqIn .7s cubic-bezier(.4,.14,.3,.99) forwards;}
@keyframes faqIn {0%{opacity:0;transform:translateY(24px);}100%{opacity:1;transform:translateY(0);}}
@media (max-width: 767.98px){
  .faq-question {padding:1.15rem 1.25rem;font-size:1rem;}
  .faq-answer .inner {padding:0 1.25rem 1.3rem;}
  .faq-item {border-radius:18px;}
}