/* ============================================================
   VEWONEX WIDE TECHNOLOGY — V12 Purple-Violet Premium Theme
   White BG + Deep Navy #222291 + Vibrant Purple #5e17eb + Violet #cc3cd9
   ============================================================ */

:root {
  /* ── BRAND COLORS (Logo-based) ── */
  --navy:           #222291;
  --navy-dark:      #1a1a70;
  --navy-deeper:    #0d0d2b;
  --purple:         #5e17eb;
  --purple-dark:    #4a10c4;
  --purple-light:   #7c3aff;
  --violet:         #cc3cd9;
  --violet-soft:    #a458dc;
  --purple-mid:     #8c52ff;
  --purple-muted:   #8c6add;
  --indigo-200:     #c4a8ff;
  --indigo-300:     #b48fff;

  /* ── SEMANTIC BRAND ── */
  --brand:          var(--purple);
  --brand-dark:     var(--purple-dark);
  --brand-light:    var(--purple-light);
  --brand-pale:     #f0ebff;
  --brand-soft:     #e0d4ff;
  --border-brand:   #c9b8ff;

  /* ── BACKGROUNDS ── */
  --white:          #ffffff;
  --bg-page:        #ffffff;
  --bg-soft:        #fafafa;
  --bg-muted:       #f4f1ff;
  --bg-dark:        #0d0d2b;
  --bg-dark2:       #131340;
  --bg-card:        #ffffff;

  /* ── GRADIENTS ── */
  --grad-brand:     linear-gradient(135deg, #222291 0%, #5e17eb 50%, #cc3cd9 100%);
  --grad-brand-2:   linear-gradient(135deg, #5e17eb 0%, #cc3cd9 100%);
  --grad-dark:      linear-gradient(135deg, #0d0d2b 0%, #131340 60%, #1e1060 100%);
  --grad-hero:      linear-gradient(135deg, #0d0d2b 0%, #131340 50%, #2a0d6b 100%);
  --grad-card:      linear-gradient(145deg, #ffffff 0%, #fafafa 100%);
  --grad-purple:    linear-gradient(135deg, #5e17eb, #cc3cd9);
  --grad-navy:      linear-gradient(135deg, #222291, #5e17eb);

  /* ── TEXT ── */
  --text-dark:      #0d0d2b;
  --text-body:      #2d2d5e;
  --text-muted:     #64648a;
  --text-faint:     #9898b8;
  --text-white:     #ffffff;
  --text-white-80:  rgba(255,255,255,0.82);
  --text-white-60:  rgba(255,255,255,0.62);

  /* ── BORDERS ── */
  --border:         #e8e8f5;
  --border-soft:    #f0f0fa;

  /* ── SLATE FALLBACKS ── */
  --slate-50:  #f8fafc; --slate-100: #f1f5f9; --slate-200: #e2e8f0;
  --slate-300: #cbd5e1; --slate-400: #94a3b8; --slate-500: #64748b;
  --slate-600: #475569; --slate-700: #334155; --slate-800: #1e293b;
  --slate-900: #0f172a; --slate-950: #020617;

  /* ── ACCENT ── */
  --emerald-500:  #10b981;
  --amber-500:    #f59e0b;
  --rose-500:     #f43f5e;
  --cyan-500:     #06b6d4;

  /* ── SHADOWS ── */
  --shadow-xs:    0 1px 3px rgba(94,23,235,0.06);
  --shadow-sm:    0 2px 8px rgba(94,23,235,0.08);
  --shadow-md:    0 4px 20px rgba(94,23,235,0.10);
  --shadow-lg:    0 8px 40px rgba(94,23,235,0.12);
  --shadow-xl:    0 20px 60px rgba(94,23,235,0.15);
  --shadow-brand: 0 4px 20px rgba(94,23,235,0.30);
  --shadow-brand-lg: 0 8px 40px rgba(94,23,235,0.35);

  /* ── TYPOGRAPHY ── */
  --font-display: 'Space Grotesk', 'Inter', system-ui, sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;

  /* ── SPACING ── */
  --s-1:0.25rem; --s-2:0.5rem; --s-3:0.75rem; --s-4:1rem;
  --s-5:1.25rem; --s-6:1.5rem; --s-8:2rem; --s-10:2.5rem;
  --s-12:3rem; --s-16:4rem; --s-20:5rem; --s-24:6rem;

  /* ── RADIUS ── */
  --r-sm:6px; --r-md:10px; --r-lg:14px; --r-xl:20px; --r-2xl:28px; --r-full:9999px;

  /* ── TRANSITIONS ── */
  --t-fast:0.15s ease; --t-base:0.25s ease; --t-slow:0.4s ease;

  /* ── LAYOUT ── */
  --max-w:1280px;
  --pad-x:clamp(1rem, 4vw, 2rem);
}

/* ── RESET ── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:hidden;}

/* ── SITEWIDE: hide breadcrumb + page-hero badge pill (Round 2, Aug 2026) ──
   Per Abdul's request, removed from every inner page across the whole
   site: the "Home / Section / Page" breadcrumb line, and the small pill
   badge under it (e.g. "22+ Game Types | India's Top Game Dev Co."). These
   render via 4 shared partials (service/product/industry/saas-template)
   plus ~110 standalone page files (technologies/*, hire/*, about, etc.),
   so instead of hand-editing 150+ blade files individually (slow and easy
   to miss one), this is done with two CSS rules that reach every page at
   once:
   1) .breadcrumb -- always the same class everywhere, safe to hide as-is.
   2) The badge pill has no shared class (each page/template inlines its
      own <div style="...">), but EVERY instance of it -- across all
      colors used (purple/green/amber variants) and even the one nested
      two levels deep inside product-template's hero grid -- shares the
      exact same "border-radius:99px;margin-bottom:1.25rem" combination in
      its inline style, and nothing else on the site uses that exact
      combination (verified against every blade file). Matching on that
      attribute substring hides just the pill, not its container. */
.breadcrumb{display:none !important;}
div[style*="border-radius:99px;margin-bottom:1.25rem"]{display:none !important;}

/* ── SITEWIDE: dark solid-black cards → branded frosted glass (Round 2) ──
   Per Abdul's request: several content cards across the site (hire-page
   "Quick Hire Form" cards on all 35 hire/* pages, product demo-video
   cards, the homepage "Our Achievements" card, location/office cards,
   etc.) used a flat near-black fill (#0d0d2b / var(--slate-900) /
   #131340) which read as plain/cheap rather than premium. Converted to a
   branded gradient + backdrop-blur "frosted glass" look instead (colored
   glass over the page, not solid black) via attribute selectors on their
   known inline-style signatures -- same reasoning as the badge-pill fix
   above: these 3 exact color values are used ONLY on this style of card
   everywhere in the codebase (verified), so one CSS rule reaches every
   instance without hand-editing 40+ files. Inline `!important` is
   required here specifically because these are inline style="" attributes
   (which otherwise beat external stylesheet rules). */
div[style*="background:#0d0d2b"],
div[style*="background:var(--slate-900)"],
div[style*="background:#131340"]{
  background:linear-gradient(135deg,rgba(34,34,145,0.55),rgba(94,23,235,0.42),rgba(204,60,217,0.30)) !important;
  backdrop-filter:blur(20px) !important;
  -webkit-backdrop-filter:blur(20px) !important;
  border:1px solid rgba(255,255,255,0.14) !important;
  box-shadow:0 20px 50px rgba(94,23,235,0.22) !important;
}


body{font-family:var(--font-body);font-size:16px;line-height:1.7;color:var(--text-body);background:var(--bg-page);}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
ul,ol{list-style:none;}
button{font-family:var(--font-body);cursor:pointer;border:none;background:none;}
input,textarea,select{font-family:var(--font-body);}

/* ── TYPOGRAPHY ── */
h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--text-dark);line-height:1.25;font-weight:700;}
h1{font-size:clamp(2rem,4vw,3.25rem);}
h2{font-size:clamp(1.6rem,3vw,2.5rem);}
h3{font-size:clamp(1.2rem,2vw,1.6rem);}
h4{font-size:1.15rem;}
h5{font-size:1rem;}
p{margin-bottom:var(--s-4);}
p:last-child{margin-bottom:0;}

/* ── CONTAINER ── */
.container{width:100%;max-width:var(--max-w);margin:0 auto;padding:0 var(--pad-x);}
.section{padding:var(--s-20) 0;}
.section-sm{padding:var(--s-12) 0;}
.section-lg{padding:var(--s-24) 0;}

/* ── SECTION LABELS ── */
.section-label{display:inline-flex;align-items:center;gap:0.6rem;background:none;border:none;color:var(--purple);font-size:0.76rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;padding:0;margin-bottom:var(--s-4);}
.section-label::before{content:'';display:inline-block;width:22px;height:3px;border-radius:2px;background:var(--grad-brand);flex-shrink:0;}
/* section-label on dark backgrounds */
.cta-section .section-label,.page-hero .section-label,.bg-dark .section-label,.stats-bar .section-label{color:#d4bbff;}
.cta-section .section-label::before,.page-hero .section-label::before,.bg-dark .section-label::before,.stats-bar .section-label::before{background:linear-gradient(90deg,#a458dc,#e879f9);}
.cta-section .section-label::before,.page-hero .section-label::before{background:#a458dc;}
.section-header{text-align:center;max-width:680px;margin:0 auto var(--s-12);}
.section-header h2{margin-bottom:var(--s-4);}
.section-header p{color:var(--text-muted);font-size:1.05rem;}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:var(--s-2);padding:0.75rem 1.75rem;border-radius:var(--r-md);font-weight:600;font-size:0.9rem;font-family:var(--font-display);transition:all var(--t-base);line-height:1;white-space:nowrap;border:2px solid transparent;}
.btn-primary{background:var(--grad-brand);color:var(--white);box-shadow:var(--shadow-brand);}
.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-brand-lg);opacity:0.92;}
.btn-secondary{background:var(--white);color:var(--purple);border-color:var(--purple);box-shadow:var(--shadow-sm);}
.btn-secondary:hover{background:var(--brand-pale);transform:translateY(-1px);}
.btn-dark{background:var(--bg-dark);color:var(--white);}
.btn-dark:hover{background:var(--bg-dark2);transform:translateY(-1px);}
.btn-outline-white{background:transparent;color:var(--white);border-color:rgba(255,255,255,0.4);}
.btn-outline-white:hover{background:rgba(255,255,255,0.12);}
.btn-lg{padding:1rem 2.25rem;font-size:1rem;}
.btn-sm{padding:0.5rem 1.1rem;font-size:0.82rem;}

/* ── CARDS ── */
.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-6);transition:all var(--t-base);box-shadow:var(--shadow-xs);}
.card:hover{box-shadow:var(--shadow-md);border-color:var(--border-brand);transform:translateY(-3px);}
.card-dark{background:var(--bg-dark);border-color:rgba(94,23,235,0.2);color:var(--text-white);}
.card-dark:hover{border-color:rgba(94,23,235,0.5);box-shadow:0 8px 32px rgba(94,23,235,0.2);}
.card-brand{background:var(--grad-brand);border:none;color:var(--white);}

/* ── BADGE ── */
.badge{display:inline-flex;align-items:center;gap:4px;padding:4px 12px;border-radius:var(--r-full);font-size:0.75rem;font-weight:600;}
.badge-indigo,.badge-purple{background:var(--brand-pale);color:var(--purple-dark);}
.badge-success{background:#dcfce7;color:#166534;}
.badge-warning{background:#fef9c3;color:#854d0e;}
.badge-dark{background:var(--bg-dark);color:var(--white);}
.badge-white{background:rgba(255,255,255,0.15);color:var(--white);}

/* ── ICON BOX ── */
.icon-box{display:flex;align-items:center;justify-content:center;border-radius:var(--r-md);flex-shrink:0;}
.icon-box-sm{width:2.25rem;height:2.25rem;font-size:1.1rem;}
.icon-box-md{width:3rem;height:3rem;font-size:1.4rem;}
.icon-box-lg{width:3.75rem;height:3.75rem;font-size:1.75rem;}
.icon-box-brand{background:var(--brand-pale);color:var(--purple);}
.icon-box-dark{background:var(--bg-dark);color:var(--white);}
.icon-box-gradient{background:var(--grad-brand);color:var(--white);}

/* ── TOPBAR ── */
.topbar{background:var(--navy-deeper);padding:0.2rem 0;border-bottom:1px solid rgba(94,23,235,0.25);}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);}
.topbar-left{display:flex;align-items:center;gap:var(--s-6);}
.topbar-item{display:flex;align-items:center;gap:var(--s-2);color:var(--text-white-60);font-size:0.78rem;}
.topbar-item i{color:#a458dc;font-size:0.85rem;}
.topbar-item a{color:var(--text-white-60);transition:color var(--t-fast);padding:6px 4px;min-height:44px;display:inline-flex;align-items:center;}
.topbar-item a:hover{color:var(--white);}
.topbar-right{display:flex;align-items:center;gap:var(--s-4);}
.topbar-social{display:flex;align-items:center;gap:var(--s-3);}
.topbar-social a{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:var(--r-sm);background:rgba(255,255,255,0.06);color:var(--text-white-60);font-size:0.8rem;transition:all var(--t-fast);}
.topbar-social a:hover{color:var(--white);}
.topbar-social a[aria-label="Facebook"]:hover{background:#1877f2;}
.topbar-social a[aria-label="Instagram"]:hover{background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);}
.topbar-social a[aria-label="Twitter"]:hover{background:#000;}
.topbar-social a[aria-label="YouTube"]:hover{background:#ff0000;}
.topbar-social a[aria-label="LinkedIn"]:hover{background:#0077b5;}
.topbar-social a[aria-label="Pinterest"]:hover{background:#e60023;}
.topbar-lang{display:flex;align-items:center;gap:var(--s-2);color:var(--text-white-60);font-size:0.78rem;cursor:pointer;padding:4px 10px;border-radius:var(--r-sm);border:1px solid rgba(255,255,255,0.12);transition:all var(--t-fast);}
.topbar-lang:hover{border-color:#a458dc;color:var(--white);}
.topbar-lang i{color:#a458dc;}

/* ── HERO ── */
.hero{background:var(--grad-hero);min-height:80vh;display:flex;align-items:center;position:relative;overflow:hidden;padding-top:30px;padding-bottom:3rem;}
.hero::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%235e17eb' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");}
.hero-glow{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;}
.hero-glow-1{width:600px;height:600px;background:rgba(94,23,235,0.20);top:-150px;right:-100px;}
.hero-glow-2{width:400px;height:400px;background:rgba(204,60,217,0.14);bottom:-100px;left:-80px;}
.hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr 0.9fr;gap:2rem;align-items:center;padding:2rem 0;}
.hero-badge{display:inline-flex;align-items:center;gap:var(--s-2);background:rgba(94,23,235,0.15);border:1px solid rgba(94,23,235,0.40);color:#c4a8ff;font-size:0.82rem;font-weight:600;padding:0.45rem 1rem;border-radius:var(--r-full);margin-bottom:var(--s-5);letter-spacing:0.02em;}
.hero-badge-dot{display:inline-block;width:8px;height:8px;background:#10b981;border-radius:50%;animation:pulse-green 2s infinite;}
@keyframes pulse-green{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.6;transform:scale(1.25);}}
.hero h1{color:var(--white);margin-bottom:var(--s-5);}
.hero h1 span{background:var(--grad-brand-2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.hero-desc{color:var(--text-white-80);font-size:1.05rem;max-width:520px;margin-bottom:var(--s-8);line-height:1.8;}
.hero-btns{display:flex;gap:var(--s-4);flex-wrap:wrap;margin-bottom:var(--s-8);}
.hero-stats{display:flex;align-items:center;gap:var(--s-6);}
.hero-stat-num{font-family:var(--font-display);font-size:1.6rem;font-weight:800;color:var(--white);line-height:1;}
.hero-stat-label{font-size:0.78rem;color:var(--text-white-60);margin-top:3px;}
.hero-stat-divider{width:1px;height:40px;background:rgba(255,255,255,0.15);}

/* HERO VISUAL */
.hero-visual{position:relative;display:flex;align-items:center;justify-content:center;}
.hero-card-main{background:rgba(255,255,255,0.06);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,0.12);border-radius:var(--r-xl);padding:var(--s-5);position:relative;z-index:2;}
.hero-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s-4);}
.hero-card-title{font-family:var(--font-display);font-size:0.88rem;font-weight:700;color:var(--white);}
.hero-card-badge{display:flex;align-items:center;gap:4px;font-size:0.72rem;font-weight:600;color:#10b981;background:rgba(16,185,129,0.12);padding:3px 10px;border-radius:var(--r-full);}
.hero-card-badge::before{content:'';width:6px;height:6px;background:#10b981;border-radius:50%;animation:pulse-green 2s infinite;}
.hero-card-row{display:flex;align-items:center;gap:var(--s-3);padding:var(--s-3) 0;border-bottom:1px solid rgba(255,255,255,0.07);}
.hero-card-row:last-child{border:none;}
.hero-card-icon{width:2.25rem;height:2.25rem;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;}
.hero-card-info{flex:1;}
.hero-card-info small{font-size:0.72rem;color:var(--text-white-60);}
.hero-card-info strong{display:block;font-size:0.9rem;font-weight:700;color:var(--white);}
.hero-metric{display:flex;align-items:center;gap:var(--s-3);padding:var(--s-3) 0;border-bottom:1px solid rgba(255,255,255,0.07);}
.hero-metric:last-child{border:none;}
.hero-metric-icon{width:2.25rem;height:2.25rem;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;}
.hero-metric-label{font-size:0.72rem;color:var(--text-white-60);margin-bottom:2px;}
.hero-metric-val{font-size:0.9rem;font-weight:700;color:var(--white);}

/* FLOATING BADGES */
.hero-floating{position:absolute;background:rgba(255,255,255,0.08);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.15);border-radius:var(--r-full);padding:0.4rem 1rem;font-size:0.78rem;font-weight:600;color:var(--white);display:flex;align-items:center;gap:0.4rem;z-index:3;white-space:nowrap;}
.hero-floating-1{top:-20px;left:-30px;animation:float1 4s ease-in-out infinite;}
.hero-floating-2{bottom:30px;right:-20px;animation:float2 5s ease-in-out infinite;}
@keyframes float1{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
@keyframes float2{0%,100%{transform:translateY(0);}50%{transform:translateY(8px);}}

/* ── STATS BAR ── */
.stats-bar{background:var(--bg-dark);padding:var(--s-8) 0;border-top:1px solid rgba(94,23,235,0.25);border-bottom:1px solid rgba(94,23,235,0.25);}

/* ── STATS BAR V2 — premium glass cards (Aug 2026 polish pass) ── */
.stats-bar-v2{position:relative;overflow:hidden;}
.stats-bar-glow{position:absolute;inset:0;background:radial-gradient(60% 140% at 15% 0%,rgba(94,23,235,0.28),transparent 60%),radial-gradient(50% 120% at 85% 100%,rgba(204,60,217,0.22),transparent 60%);pointer-events:none;}
.stats-grid-v2{position:relative;z-index:1;gap:1.25rem;}
.stat-card-v2{text-align:center;padding:1.75rem 1rem;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:1.1rem;backdrop-filter:blur(6px);transition:transform 0.3s ease,border-color 0.3s ease,background 0.3s ease;}
.stat-card-v2:hover{transform:translateY(-4px);border-color:rgba(164,88,220,0.4);background:rgba(255,255,255,0.07);}
.stat-card-v2-icon{width:2.75rem;height:2.75rem;margin:0 auto 0.85rem;border-radius:50%;background:linear-gradient(135deg,rgba(94,23,235,0.35),rgba(204,60,217,0.35));border:1px solid rgba(164,88,220,0.4);display:flex;align-items:center;justify-content:center;color:#e0c8ff;font-size:1.1rem;}
.stat-card-v2 .stat-num{font-size:2.1rem;}
.stat-card-v2 .stat-label{margin-top:0.35rem;}
@media(max-width:640px){
  .stats-grid-v2{grid-template-columns:repeat(2,1fr);gap:0.85rem;}
  .stat-card-v2{padding:1.25rem 0.75rem;}
  .stat-card-v2-icon{width:2.25rem;height:2.25rem;font-size:0.9rem;margin-bottom:0.6rem;}
  .stat-card-v2 .stat-num{font-size:1.5rem;}
  .stat-card-v2 .stat-label{font-size:0.72rem;}
}
@media(max-width:360px){
  .stat-card-v2 .stat-num{font-size:1.3rem;}
}

.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-4);}
.stat-item{text-align:center;padding:var(--s-4);position:relative;}
.stat-item::after{content:'';position:absolute;right:0;top:20%;height:60%;width:1px;background:rgba(255,255,255,0.1);}
.stat-item:last-child::after{display:none;}
.stat-num{font-family:var(--font-display);font-size:2.2rem;font-weight:800;background:var(--grad-brand-2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;}
.stat-label{font-size:0.82rem;color:var(--text-white-60);margin-top:var(--s-2);}

/* ── SERVICES GRID ── */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-5);}
.service-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-6);transition:all var(--t-base);position:relative;overflow:hidden;cursor:pointer;display:flex;flex-direction:column;}
.service-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-brand);opacity:0;transition:opacity var(--t-base);}
.service-card:hover{box-shadow:var(--shadow-lg);border-color:var(--border-brand);transform:translateY(-4px);}
.service-card:hover::before{opacity:1;}
.service-card .icon-box{margin-bottom:var(--s-4);}
.service-card h4{font-size:1rem;font-weight:700;color:var(--text-dark);margin-bottom:var(--s-2);}
.service-card p{font-size:0.88rem;color:var(--text-muted);line-height:1.65;margin-bottom:var(--s-4);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1;}
.service-card-link{display:flex;align-items:center;gap:var(--s-2);font-size:0.82rem;font-weight:600;color:var(--purple);transition:gap var(--t-fast);margin-top:auto;}
.service-card:hover .service-card-link{gap:var(--s-3);}

/* ── PRODUCTS GRID ── */
.products-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-6);}
.product-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);padding:var(--s-8);transition:all var(--t-base);position:relative;overflow:hidden;cursor:pointer;display:flex;flex-direction:column;}
.product-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-xl);border-color:var(--border-brand);}
.product-card-badge{position:absolute;top:var(--s-4);right:var(--s-4);}
.product-icon{width:3.5rem;height:3.5rem;border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:var(--s-5);}
.product-card h3{font-size:1.15rem;margin-bottom:var(--s-2);}
.product-card .desc{font-size:0.88rem;color:var(--text-muted);margin-bottom:var(--s-5);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1;}
.product-features{list-style:none;margin-bottom:var(--s-6);}
.product-features li{display:flex;align-items:center;gap:var(--s-2);font-size:0.84rem;color:var(--text-body);padding:var(--s-2) 0;border-bottom:1px solid var(--border-soft);}
.product-features li:last-child{border:none;}
.product-features li::before{content:'✓';display:flex;align-items:center;justify-content:center;width:18px;height:18px;background:var(--brand-pale);color:var(--purple);border-radius:50%;font-size:0.7rem;font-weight:700;flex-shrink:0;}

/* ── TECH GRID ── */
.tech-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:var(--s-4);}
.tech-item{display:flex;flex-direction:column;align-items:center;gap:var(--s-2);padding:var(--s-4);border:1.5px solid var(--border);border-radius:var(--r-lg);background:var(--white);transition:all var(--t-base);text-align:center;cursor:default;}
.tech-item:hover{border-color:var(--purple);box-shadow:0 4px 16px rgba(94,23,235,0.15);transform:translateY(-3px);background:var(--brand-pale);}
.tech-item .tech-icon{width:2.5rem;height:2.5rem;object-fit:contain;}
.tech-item span{font-size:0.78rem;font-weight:600;color:var(--text-body);transition:color var(--t-fast);}
.tech-item:hover span{color:var(--purple);font-weight:700;}
.tech-icon-wrap{width:2.75rem;height:2.75rem;display:flex;align-items:center;justify-content:center;margin-bottom:0.25rem;}
.tech-icon-wrap i,.tech-icon-wrap svg{font-size:1.6rem;transition:transform var(--t-fast);}
.tech-item:hover .tech-icon-wrap i,.tech-item:hover .tech-icon-wrap svg{transform:scale(1.1);}

/* ── TESTIMONIALS ── */
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-6);align-items:stretch;}
.testimonial-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);padding:var(--s-8);transition:all var(--t-base);height:100%;display:flex;flex-direction:column;}
.testimonial-card:hover{box-shadow:var(--shadow-lg);border-color:var(--border-brand);}
.testimonial-stars{display:flex;gap:3px;margin-bottom:var(--s-4);}
.testimonial-stars i{color:#f59e0b;font-size:0.9rem;}
.testimonial-text{font-size:0.92rem;color:var(--text-body);line-height:1.75;margin-bottom:var(--s-5);font-style:italic;flex:1;}
.testimonial-author{display:flex;align-items:center;gap:var(--s-3);margin-top:auto;}
.author-avatar{width:2.75rem;height:2.75rem;border-radius:50%;background:var(--grad-brand);display:flex;align-items:center;justify-content:center;color:var(--white);font-weight:700;font-size:0.9rem;flex-shrink:0;}
.author-name{font-weight:700;font-size:0.88rem;color:var(--text-dark);}
.author-title{font-size:0.78rem;color:var(--text-muted);}

/* ── PRICING ── */
.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-6);}
.pricing-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);padding:var(--s-8);transition:all var(--t-base);position:relative;}
.pricing-card.popular{border-color:var(--purple);box-shadow:0 0 0 2px var(--purple),var(--shadow-brand-lg);}
.pricing-card.popular::before{content:'Most Popular';position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--grad-brand);color:var(--white);font-size:0.72rem;font-weight:700;padding:4px 14px;border-radius:var(--r-full);}
.pricing-plan{font-size:0.78rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--purple);margin-bottom:var(--s-2);}
.pricing-price{display:flex;align-items:baseline;gap:var(--s-1);margin:var(--s-4) 0;}
.pricing-currency{font-size:1.4rem;font-weight:700;color:var(--text-dark);}
.pricing-amount{font-family:var(--font-display);font-size:3rem;font-weight:800;color:var(--text-dark);line-height:1;}
.pricing-period{font-size:0.88rem;color:var(--text-muted);}
.pricing-features{list-style:none;margin:var(--s-6) 0;}
.pricing-features li{display:flex;align-items:center;gap:var(--s-3);padding:var(--s-2) 0;font-size:0.88rem;color:var(--text-body);}
.pricing-features li i{color:var(--purple);font-size:1rem;flex-shrink:0;}
.pricing-features li.off{color:var(--text-faint);text-decoration:line-through;}
.pricing-features li.off i{color:var(--text-faint);}

/* ── CTA SECTION ── */
.cta-section{background:var(--grad-dark);padding:var(--s-20) 0;position:relative;overflow:hidden;}
.cta-section::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(94,23,235,0.25) 0%,transparent 70%);}
.cta-inner{position:relative;z-index:1;text-align:center;}
.cta-inner h2{color:var(--white);margin-bottom:var(--s-4);}
.cta-inner p{color:var(--text-white-80);font-size:1.1rem;margin-bottom:var(--s-8);}
.cta-buttons{display:flex;flex-wrap:wrap;gap:var(--s-4);justify-content:center;}

/* ── BLOG ── */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-6);align-items:stretch;}
.blog-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;transition:all var(--t-base);cursor:pointer;display:flex;flex-direction:column;height:100%;}
.blog-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px);}
.blog-img{height:180px;background:var(--grad-hero);display:flex;align-items:center;justify-content:center;font-size:2.5rem;position:relative;}
.blog-img-label{position:absolute;top:var(--s-3);left:var(--s-3);}
.blog-body{padding:var(--s-5);flex:1;display:flex;flex-direction:column;}
.blog-meta{display:flex;align-items:center;gap:var(--s-3);font-size:0.78rem;color:var(--text-muted);margin-bottom:var(--s-3);}
.blog-card h4{font-size:0.95rem;font-weight:700;color:var(--text-dark);margin-bottom:var(--s-2);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.blog-card p{font-size:0.84rem;color:var(--text-muted);line-height:1.6;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}

/* ── CLIENTS / PARTNERS ── */
.clients-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--s-4);}
.client-logo{display:flex;align-items:center;justify-content:center;padding:var(--s-4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--white);filter:grayscale(100%);opacity:0.6;transition:all var(--t-base);cursor:pointer;}
.client-logo:hover{filter:grayscale(0%);opacity:1;border-color:var(--border-brand);box-shadow:var(--shadow-sm);}
.client-logo span{font-family:var(--font-display);font-weight:800;font-size:0.9rem;color:var(--text-dark);}

/* ── INDUSTRIES ── */
.industries-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-5);}
.industry-card{padding:var(--s-5);border:1px solid var(--border);border-radius:var(--r-lg);background:var(--white);transition:all var(--t-base);text-align:center;cursor:pointer;}
.industry-card:hover{border-color:var(--purple);box-shadow:0 6px 24px rgba(94,23,235,0.15);transform:translateY(-3px);}
.industry-card .icon{font-size:2rem;margin-bottom:var(--s-3);transition:transform var(--t-base);}
.industry-card:hover .icon{transform:scale(1.15);}
.industry-card h5{font-size:0.88rem;font-weight:700;color:var(--text-dark);margin-bottom:var(--s-2);}
.industry-card p{font-size:0.78rem;color:var(--text-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* ── TEAM ── */
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-6);}
.team-card{text-align:center;}
.team-avatar{width:5rem;height:5rem;border-radius:50%;background:var(--grad-brand);display:flex;align-items:center;justify-content:center;color:var(--white);font-weight:800;font-size:1.4rem;margin:0 auto var(--s-4);box-shadow:var(--shadow-brand);}
.team-name{font-weight:700;color:var(--text-dark);margin-bottom:var(--s-1);}
.team-role{font-size:0.82rem;color:var(--text-muted);margin-bottom:var(--s-3);}
.team-socials{display:flex;justify-content:center;gap:var(--s-2);}
.team-socials a{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border-radius:var(--r-sm);border:1px solid var(--border);color:var(--text-muted);font-size:0.75rem;transition:all var(--t-fast);}
.team-socials a:hover{background:var(--purple);color:var(--white);border-color:var(--purple);}

/* ── FAQ ── */
.faq-list{display:flex;flex-direction:column;gap:var(--s-3);}
.faq-item{border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;background:var(--white);transition:border-color var(--t-fast);}
.faq-item.open{border-color:var(--border-brand);}
.faq-question{display:flex;align-items:center;justify-content:space-between;padding:var(--s-5) var(--s-6);cursor:pointer;gap:var(--s-4);user-select:none;}
.faq-question:hover{background:var(--brand-pale);}
.faq-question span{font-weight:600;font-size:0.95rem;color:var(--text-dark);}
.faq-icon{width:1.75rem;height:1.75rem;border-radius:50%;background:var(--brand-pale);color:var(--purple);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:0.8rem;transition:all var(--t-fast);}
.faq-item.open .faq-icon{background:var(--purple);color:var(--white);transform:rotate(45deg);}
.faq-answer{padding:0 var(--s-6) var(--s-5);font-size:0.9rem;color:var(--text-muted);line-height:1.75;display:none;}
.faq-item.open .faq-answer{display:block;}

/* ── FORMS ── */
.form-group{margin-bottom:var(--s-5);}
.form-label{display:block;font-size:0.85rem;font-weight:600;color:var(--text-dark);margin-bottom:var(--s-2);}
.form-control{width:100%;padding:0.75rem 1rem;border:1.5px solid var(--border);border-radius:var(--r-md);font-size:0.9rem;color:var(--text-dark);background:var(--white);transition:all var(--t-fast);outline:none;}
.form-control:focus{border-color:var(--purple);box-shadow:0 0 0 3px rgba(94,23,235,0.10);}
.form-control::placeholder{color:var(--text-faint);}
textarea.form-control{min-height:130px;resize:vertical;}
select.form-control{cursor:pointer;}

/* ── PAGE HERO ── */
.page-hero{background:var(--grad-dark);padding:calc(var(--s-4) + 107px) 0 var(--s-10);position:relative;overflow:hidden;}
/* Social platform hero — matches page-hero top clearance */
.social-hero{padding:calc(var(--s-4) + 107px) 0 var(--s-10);text-align:center;border-bottom:1px solid var(--border);}
.page-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at top left,rgba(94,23,235,0.28) 0%,transparent 60%);}
.page-hero-inner{position:relative;z-index:1;}
.breadcrumb{display:flex;align-items:center;gap:var(--s-2);font-size:0.82rem;color:var(--text-white-60);margin-bottom:var(--s-4);}
.breadcrumb a{color:var(--text-white-60);transition:color var(--t-fast);}
.breadcrumb a:hover{color:var(--white);}
.breadcrumb-sep{color:rgba(255,255,255,0.3);}
.page-hero h1{color:var(--white);margin-bottom:var(--s-4);}
.page-hero .desc{color:var(--text-white-80);font-size:1.1rem;max-width:600px;}

/* ── PROCESS STEPS ── */
.process-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--s-4);position:relative;}

/* ── HOW WE WORK V2 — premium card layout (Aug 2026 polish pass) ── */
.process-steps-v2{display:grid;grid-template-columns:repeat(5,1fr);gap:1.25rem;}
.process-card{position:relative;background:var(--white);border:1px solid var(--border);border-radius:1.25rem;padding:1.75rem 1.5rem;overflow:hidden;transition:transform 0.3s ease,box-shadow 0.3s ease,border-color 0.3s ease;}
.process-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--navy,#222291),var(--purple,#5e17eb),var(--violet,#cc3cd9));transform:scaleX(0);transform-origin:left;transition:transform 0.35s ease;}
.process-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-xl);border-color:transparent;}
.process-card:hover::before{transform:scaleX(1);}
.process-card-num{position:absolute;top:0.5rem;right:1rem;font-family:var(--font-display);font-weight:800;font-size:2.75rem;color:var(--border);opacity:0.6;line-height:1;user-select:none;transition:color 0.3s ease;}
.process-card:hover .process-card-num{color:var(--brand-pale);}
.process-card-icon{width:3.25rem;height:3.25rem;border-radius:1rem;background:var(--grad-brand);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.25rem;margin-bottom:1rem;box-shadow:0 8px 20px rgba(94,23,235,0.28);position:relative;z-index:1;}
.process-card h3{font-size:0.95rem;font-weight:700;color:var(--text-dark);margin-bottom:0.5rem;position:relative;z-index:1;}
.process-card p{font-size:0.8rem;color:var(--text-muted);line-height:1.55;position:relative;z-index:1;}
[data-theme="dark"] .process-card{background:#16162e;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .process-card-num{color:rgba(255,255,255,0.06);}
@media(max-width:1024px){.process-steps-v2{grid-template-columns:repeat(3,1fr);}}
@media(max-width:640px){.process-steps-v2{grid-template-columns:1fr;}.process-card{display:flex;gap:1rem;align-items:flex-start;padding:1.25rem;}.process-card-icon{margin-bottom:0;flex-shrink:0;}.process-card-num{top:0.4rem;right:0.75rem;font-size:2rem;}}

.process-steps::before{content:'';position:absolute;top:2rem;left:10%;right:10%;height:2px;background:linear-gradient(90deg,var(--border) 0%,var(--purple) 50%,var(--border) 100%);}
.process-step{text-align:center;position:relative;padding-top:var(--s-2);cursor:default;}
.process-num{width:4rem;height:4rem;border-radius:50%;background:var(--white);border:2px solid var(--border-brand);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:800;font-size:1.1rem;color:var(--purple);margin:0 auto var(--s-4);position:relative;z-index:1;transition:all var(--t-base);}
.process-step:hover .process-num{background:var(--grad-brand);color:var(--white);border-color:transparent;box-shadow:var(--shadow-brand);}
.process-step h5{font-size:0.88rem;font-weight:700;color:var(--text-dark);margin-bottom:var(--s-2);}
.process-step p{font-size:0.78rem;color:var(--text-muted);}

/* ── UTILITY ── */
.text-center{text-align:center;}
.text-white{color:var(--white);}
.text-brand{color:var(--purple);}
.text-muted{color:var(--text-muted);}
.font-display{font-family:var(--font-display);}
.bg-soft{background:var(--bg-soft);}
.bg-muted{background:var(--bg-muted);}
.bg-dark{background:var(--bg-dark);}
.mt-4{margin-top:var(--s-4);}.mt-8{margin-top:var(--s-8);}
.mb-4{margin-bottom:var(--s-4);}.mb-8{margin-bottom:var(--s-8);}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-6);}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-6);}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-6);}
.flex-center{display:flex;align-items:center;justify-content:center;}
.flex-between{display:flex;align-items:center;justify-content:space-between;}
.gap-2{gap:var(--s-2);}.gap-4{gap:var(--s-4);}
.divider{height:1px;background:var(--border);margin:var(--s-6) 0;}
.highlight{background:var(--grad-brand-2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}

/* ── COOKIE BANNER ── */
#cookie-banner{position:fixed;bottom:var(--s-5);left:50%;transform:translateX(-50%);background:var(--bg-dark);border:1px solid rgba(94,23,235,0.35);border-radius:var(--r-xl);padding:var(--s-5) var(--s-6);display:flex;align-items:center;gap:var(--s-6);max-width:680px;width:calc(100% - 2rem);z-index:9000;box-shadow:var(--shadow-xl);}
#cookie-banner p{font-size:0.85rem;color:var(--text-white-80);margin:0;}
#cookie-banner a{color:#a458dc;}
.cookie-buttons{display:flex;gap:var(--s-3);flex-shrink:0;}

/* ── TRUSTED BADGE ── */
.hero-badge-wrap{display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap;margin-bottom:var(--s-5);}
.trusted-pill{display:inline-flex;align-items:center;gap:0.5rem;background:rgba(16,185,129,0.12);border:1px solid rgba(16,185,129,0.30);color:#6ee7b7;font-size:0.82rem;font-weight:600;padding:0.45rem 1rem;border-radius:var(--r-full);}
.trusted-pill i{color:#10b981;}

/* ── TRUSTED BADGES (footer style) ── */
.trusted-badges{display:flex;align-items:center;gap:0.6rem;flex-wrap:wrap;}
.trusted-badge{display:flex;align-items:center;gap:0.4rem;padding:0.4rem 0.9rem;border-radius:var(--r-full);font-size:0.75rem;font-weight:700;letter-spacing:0.02em;border:1px solid;}
.trusted-badge.iso{background:rgba(255,215,0,0.08);border-color:rgba(255,215,0,0.25);color:#ffd700;}
.trusted-badge.msme{background:rgba(34,197,94,0.08);border-color:rgba(34,197,94,0.25);color:#4ade80;}
.trusted-badge.since{background:rgba(94,23,235,0.12);border-color:rgba(94,23,235,0.3);color:#c4a8ff;}
.trusted-badge i{font-size:0.8rem;}

/* ── GOOGLE REVIEW BUTTON ── */
.btn-google-review{display:inline-flex;align-items:center;gap:0.6rem;padding:0.55rem 1.1rem;background:#fff;color:#3c4043;border:1px solid #dadce0;border-radius:var(--r-md);font-size:0.82rem;font-weight:600;cursor:pointer;transition:all var(--t-base);box-shadow:0 1px 4px rgba(0,0,0,0.1);}
.btn-google-review:hover{box-shadow:0 2px 8px rgba(0,0,0,0.15);transform:translateY(-1px);}
.btn-google-review .google-g{width:18px;height:18px;flex-shrink:0;}

/* ── FOOTER CTA LINE ── */
.footer-cta-line{display:flex;align-items:center;justify-content:center;gap:0.75rem;flex-wrap:wrap;font-size:0.82rem;color:rgba(255,255,255,0.4);padding:1rem 0;border-top:1px solid rgba(255,255,255,0.06);}
.footer-cta-line .highlight-item{color:rgba(255,255,255,0.65);display:flex;align-items:center;gap:0.35rem;}
.footer-cta-line .highlight-item i{color:#a458dc;}
.footer-cta-line .sep{color:rgba(255,255,255,0.15);}

/* ── ANIMATIONS ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.animate-fade-up{animation:fadeUp 0.5s ease forwards;}
.animate-fade-in{animation:fadeIn 0.4s ease forwards;}

/* ── SOCIAL PLATFORM PAGES ── */
.social-platform-hero{padding:var(--s-16) 0;text-align:center;}
.social-platform-icon{width:5rem;height:5rem;border-radius:var(--r-xl);display:flex;align-items:center;justify-content:center;font-size:2rem;margin:0 auto var(--s-4);}
.social-info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-6);}

/* ── TABLE RESPONSIVE ── */
.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--r-md);border:1px solid var(--border);}
.table-responsive table{min-width:600px;}

/* ── IMAGE PLACEHOLDER ── */
.img-placeholder{background:linear-gradient(90deg,var(--bg-muted) 25%,var(--border) 50%,var(--bg-muted) 75%);background-size:200% 100%;animation:skeleton-shimmer 1.5s infinite;border-radius:var(--r-md);}
@keyframes skeleton-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ── FOCUS VISIBLE ── */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--purple);outline-offset:2px;border-radius:var(--r-sm);}

/* ── PRINT ── */
@media print{
  .topbar,.site-header,.site-footer,.mobile-nav,#backToTop,#cookie-banner,.cta-section,.btn{display:none !important;}
  .page-hero{padding-top:2rem !important;}
  body{font-size:12pt;color:#000;}
  a{color:#000;text-decoration:underline;}
  h1,h2,h3{page-break-after:avoid;}
}

/* ── RESPONSIVE ── */
@media(max-width:1280px){:root{--max-w:1140px;}}
@media(max-width:1024px){
  .hero-inner{grid-template-columns:1fr;text-align:center;padding:var(--s-16) 0;}
  .hero-desc{margin-left:auto;margin-right:auto;}
  .hero-btns{justify-content:center;}
  .hero-stats{justify-content:center;}
  .hero-visual{display:none;}
  .services-grid{grid-template-columns:repeat(2,1fr);}
  .products-grid{grid-template-columns:repeat(2,1fr);}
  .team-grid{grid-template-columns:repeat(2,1fr);}
  .testimonials-grid{grid-template-columns:repeat(2,1fr);}
  .process-steps{grid-template-columns:repeat(3,1fr);}
  .process-steps::before{display:none;}
  .clients-grid{grid-template-columns:repeat(3,1fr);}
  .industries-grid{grid-template-columns:repeat(3,1fr);}
  .pricing-grid{grid-template-columns:1fr;max-width:480px;margin:0 auto;}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .blog-grid{grid-template-columns:repeat(2,1fr);}
  .grid-4{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:768px){
  .section{padding:var(--s-12) 0;}
  .services-grid{grid-template-columns:1fr;}
  .products-grid{grid-template-columns:1fr;}
  .team-grid{grid-template-columns:repeat(2,1fr);}
  .testimonials-grid{grid-template-columns:1fr;}
  .process-steps{grid-template-columns:repeat(2,1fr);}
  .clients-grid{grid-template-columns:repeat(2,1fr);}
  .industries-grid{grid-template-columns:repeat(2,1fr);}
  .grid-2,.grid-3{grid-template-columns:1fr;}
  .blog-grid{grid-template-columns:1fr;}
  .topbar-left .topbar-item:not(:first-child){display:none;}
}
@media(max-width:480px){
  .hero-stats{flex-direction:column;align-items:center;gap:var(--s-4);}
  .hero-stat-divider{display:none;}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .team-grid{grid-template-columns:1fr;}
  .tech-grid{grid-template-columns:repeat(3,1fr);}
  .clients-grid{grid-template-columns:repeat(2,1fr);}
  .industries-grid{grid-template-columns:1fr;}
  .topbar{display:none;}
  #cookie-banner{flex-direction:column;text-align:center;}
}

/* ═══════════════════════════════════════════════
   BATCH 1 — DESIGN & VISUAL ENHANCEMENTS
═══════════════════════════════════════════════ */

/* ── CUSTOM CURSOR ── */
.custom-cursor{position:fixed;pointer-events:none;z-index:99999;mix-blend-mode:difference;}
.cursor-dot{width:8px;height:8px;background:#fff;border-radius:50%;position:fixed;pointer-events:none;z-index:99999;transform:translate(-50%,-50%);transition:transform 0.1s ease,opacity 0.3s ease;mix-blend-mode:difference;}
.cursor-ring{width:36px;height:36px;border:2px solid rgba(94,23,235,0.7);border-radius:50%;position:fixed;pointer-events:none;z-index:99998;transform:translate(-50%,-50%);transition:width 0.3s ease,height 0.3s ease,border-color 0.3s ease,transform 0.12s ease;will-change:transform;}
.cursor-ring.hover{width:52px;height:52px;border-color:rgba(204,60,217,0.9);background:rgba(94,23,235,0.08);}
.cursor-ring.click{width:24px;height:24px;border-color:#5e17eb;background:rgba(94,23,235,0.15);}
@media(pointer:coarse){.cursor-dot,.cursor-ring{display:none;}}

/* ── HERO ANIMATED GRADIENT ── */
@keyframes heroGradientShift{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}
@keyframes heroGlowFloat1{
  0%,100%{transform:translate(0,0) scale(1);}
  33%{transform:translate(30px,-20px) scale(1.1);}
  66%{transform:translate(-20px,30px) scale(0.95);}
}
@keyframes heroGlowFloat2{
  0%,100%{transform:translate(0,0) scale(1);}
  33%{transform:translate(-25px,20px) scale(1.05);}
  66%{transform:translate(20px,-25px) scale(1.1);}
}
.hero-glow-1{animation:heroGlowFloat1 8s ease-in-out infinite;}
.hero-glow-2{animation:heroGlowFloat2 10s ease-in-out infinite;}

/* ── HERO ANIMATED BACKGROUND v2 — Premium SaaS ── */

/* Top edge glow */
.hero-top-glow{position:absolute;top:0;left:50%;transform:translateX(-50%);width:60%;height:2px;background:linear-gradient(90deg,transparent,rgba(94,23,235,0.9),rgba(204,60,217,1),rgba(94,23,235,0.9),transparent);box-shadow:0 0 24px rgba(94,23,235,0.6),0 0 80px rgba(94,23,235,0.2);z-index:2;animation:topGlowAnim 4s ease-in-out infinite;}
@keyframes topGlowAnim{0%,100%{opacity:0.7;width:45%;}50%{opacity:1;width:65%;}}

/* Aurora bands */
.hero-aurora{position:absolute;inset:0;pointer-events:none;z-index:0;}
.hero-aurora-band{position:absolute;border-radius:50%;filter:blur(90px);animation:auroraFloat ease-in-out infinite;}
.hab-1{width:650px;height:280px;background:linear-gradient(90deg,rgba(94,23,235,0.20),rgba(204,60,217,0.13));top:8%;right:-8%;animation-duration:14s;animation-delay:0s;}
.hab-2{width:480px;height:240px;background:linear-gradient(90deg,rgba(34,34,145,0.25),rgba(94,23,235,0.16));top:42%;left:-4%;animation-duration:18s;animation-delay:-5s;}
.hab-3{width:380px;height:180px;background:rgba(204,60,217,0.12);bottom:5%;right:18%;animation-duration:11s;animation-delay:-8s;}
@keyframes auroraFloat{0%,100%{transform:translate(0,0) scaleX(1);}40%{transform:translate(28px,-18px) scaleX(1.06);}70%{transform:translate(-18px,14px) scaleX(0.96);}}

/* Fine grid */
.hero-grid{position:absolute;inset:0;z-index:0;background-image:linear-gradient(rgba(94,23,235,0.07) 1px,transparent 1px),linear-gradient(90deg,rgba(94,23,235,0.07) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse 90% 90% at 50% 50%,black 20%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 90% 90% at 50% 50%,black 20%,transparent 100%);}

/* Beam lines */
.hero-beams{position:absolute;inset:0;overflow:hidden;z-index:1;pointer-events:none;}
.hero-beam{position:absolute;height:1px;animation:beamSlide linear infinite;}
.hero-beam::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(94,23,235,0.55) 25%,rgba(204,60,217,0.75) 50%,rgba(94,23,235,0.35) 75%,transparent 100%);}
.hb-1{top:22%;width:55%;animation-duration:5.5s;animation-delay:0s;}
.hb-2{top:47%;width:42%;animation-duration:7s;animation-delay:1.8s;}
.hb-3{top:67%;width:50%;animation-duration:6.2s;animation-delay:3.5s;}
.hb-4{top:34%;width:36%;animation-duration:8.5s;animation-delay:0.8s;}
.hb-5{top:57%;width:48%;animation-duration:5.8s;animation-delay:2.8s;}
@keyframes beamSlide{0%{left:-70%;}100%{left:130%;}}

/* Glowing orbs */
.hero-orbs{position:absolute;inset:0;pointer-events:none;z-index:0;}
.hero-orb{position:absolute;border-radius:50%;animation:orbPulse ease-in-out infinite;}
.ho-1{width:200px;height:200px;background:radial-gradient(circle,rgba(94,23,235,0.45) 0%,transparent 70%);top:-40px;right:10%;filter:blur(35px);animation-duration:8s;}
.ho-2{width:160px;height:160px;background:radial-gradient(circle,rgba(204,60,217,0.38) 0%,transparent 70%);bottom:-30px;left:8%;filter:blur(28px);animation-duration:11s;animation-delay:-4s;}
.ho-3{width:120px;height:120px;background:radial-gradient(circle,rgba(94,23,235,0.32) 0%,transparent 70%);top:38%;right:28%;filter:blur(22px);animation-duration:9s;animation-delay:-2s;}
@keyframes orbPulse{0%,100%{transform:scale(1);opacity:0.8;}50%{transform:scale(1.18);opacity:1;}}

/* Rising particles */
.hero-pts{position:absolute;inset:0;overflow:hidden;z-index:1;pointer-events:none;}
.hero-pt{position:absolute;border-radius:50%;animation:ptRise linear infinite;}
.hp-1{width:2px;height:2px;background:#8b5cf6;left:8%;bottom:-5px;animation-duration:8s;animation-delay:0s;}
.hp-2{width:3px;height:3px;background:#cc3cd9;left:20%;bottom:-5px;animation-duration:11s;animation-delay:2s;}
.hp-3{width:2px;height:2px;background:#5e17eb;left:35%;bottom:-5px;animation-duration:9s;animation-delay:4s;}
.hp-4{width:2px;height:2px;background:#a78bfa;left:50%;bottom:-5px;animation-duration:12s;animation-delay:1s;}
.hp-5{width:3px;height:3px;background:#cc3cd9;left:65%;bottom:-5px;animation-duration:10s;animation-delay:3s;}
.hp-6{width:2px;height:2px;background:#5e17eb;left:80%;bottom:-5px;animation-duration:7.5s;animation-delay:5s;}
.hp-7{width:2px;height:2px;background:#8b5cf6;left:28%;bottom:-5px;animation-duration:13s;animation-delay:0.5s;}
.hp-8{width:3px;height:3px;background:#cc3cd9;left:72%;bottom:-5px;animation-duration:8.5s;animation-delay:6s;}
@keyframes ptRise{0%{transform:translateY(0);opacity:0;}8%{opacity:1;}85%{opacity:0.6;}100%{transform:translateY(-650px);opacity:0;}}

/* Floating UI cards - right side */
/* ── HERO CARDS ZIGZAG v4 ── */
/* Hero height fix */
.hero{background:var(--grad-hero);min-height:92vh !important;display:flex;align-items:center;position:relative;overflow:hidden;padding-top:30px;padding-bottom:3rem;}
.hero-cards{position:relative;width:100%;height:520px;z-index:8;pointer-events:none;}
.hero-fcard{
  position:absolute;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.13);
  border-radius:16px;
  backdrop-filter:blur(32px);
  -webkit-backdrop-filter:blur(32px);
  padding:15px 18px;
  color:#fff;
  width:46%;
  max-width:188px;
  min-width:140px;
  min-width:140px;
  animation:fcardFloat ease-in-out infinite;
  pointer-events:none;
  box-shadow:0 8px 32px rgba(0,0,0,0.35),inset 0 1px 0 rgba(255,255,255,0.09);
}
/* 2-col zigzag inside grid column */
.hfc-1{right:0;   top:20px;  animation-duration:5s;  animation-delay:0s;}
.hfc-2{left:0;    top:138px; animation-duration:7s;  animation-delay:1.5s;}
.hfc-3{right:0;   top:256px; animation-duration:6s;  animation-delay:3s;}
.hfc-4{left:0;    top:374px; animation-duration:5.5s;animation-delay:2s;}
@keyframes fcardFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
/* Connector lines — centered between left/right cols */
.hero-zz-line{position:absolute;width:1.5px;background:linear-gradient(180deg,rgba(139,92,246,0.85),rgba(204,60,217,0.85));z-index:9;left:50%;transform:translateX(-50%);}
.hero-zz-line-1{top:108px;height:34px;}
.hero-zz-line-2{top:226px;height:34px;}
.hero-zz-line-3{top:344px;height:34px;}
/* Glow dots */
.hero-zz-dot{position:absolute;width:9px;height:9px;border-radius:50%;background:#8b5cf6;box-shadow:0 0 12px rgba(139,92,246,1),0 0 24px rgba(139,92,246,0.5);z-index:10;left:50%;transform:translateX(-50%);}
.hero-zz-dot-1{top:105px;}
.hero-zz-dot-2{top:223px;}
.hero-zz-dot-3{top:341px;}
@media(max-width:1150px){.hero-cards{display:none;} .hero-inner{grid-template-columns:1fr;text-align:center;} .hero-desc{margin:0 auto;} .hero-btns{justify-content:center;} .hero-stats{justify-content:center;} .hero-badge{justify-content:center;}}
@media(max-width:991px){.hero-inner{grid-template-columns:1fr;}}
/* Card internals */
.hfc-label{font-size:9px;color:rgba(255,255,255,0.40);letter-spacing:.08em;text-transform:uppercase;margin-bottom:5px;}
.hfc-val{font-size:21px;font-weight:700;letter-spacing:-.5px;color:#fff;}
.hfc-sub{font-size:10px;margin-top:3px;}
.hfc-row{font-size:10.5px;color:rgba(255,255,255,.65);display:flex;align-items:center;gap:6px;margin-top:5px;}
.hfc-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0;}
.hfc-bars{display:flex;align-items:flex-end;gap:3px;height:24px;margin-top:8px;}
.hfc-bar{border-radius:3px 3px 0 0;background:linear-gradient(180deg,#a78bfa,#5e17eb);}
.hfc-label{font-size:10px;color:rgba(255,255,255,0.4);letter-spacing:0.06em;text-transform:uppercase;margin-bottom:5px;}
.hfc-val{font-size:22px;font-weight:700;color:#fff;letter-spacing:-0.5px;}
.hfc-sub{font-size:11px;color:#10b981;margin-top:2px;}
.hfc-row{font-size:11.5px;color:rgba(255,255,255,0.65);display:flex;align-items:center;gap:6px;margin-top:4px;}
.hfc-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0;}
.hfc-bars{display:flex;align-items:flex-end;gap:3px;height:28px;margin-top:8px;}
.hfc-bar{width:11px;border-radius:3px 3px 0 0;background:linear-gradient(180deg,#8b5cf6,#5e17eb);}

/* Hero h1 gradient text */
.hero h1 em{font-style:normal;background:linear-gradient(135deg,#a78bfa 0%,#cc3cd9 50%,#f472b6 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200%;animation:gradShift 4s ease-in-out infinite;}
@keyframes gradShift{0%,100%{background-position:0% 50%;}50%{background-position:100% 50%;}}

/* Hero content z-index */
.hero .container{position:relative;z-index:10;}

/* ── SCROLL ANIMATIONS ── */
.reveal{opacity:0;transform:translateY(32px);transition:opacity 0.65s cubic-bezier(.4,0,.2,1),transform 0.65s cubic-bezier(.4,0,.2,1);}
.reveal.revealed{opacity:1;transform:translateY(0);}
.reveal-left{opacity:0;transform:translateX(-32px);transition:opacity 0.65s cubic-bezier(.4,0,.2,1),transform 0.65s cubic-bezier(.4,0,.2,1);}
.reveal-left.revealed{opacity:1;transform:translateX(0);}
.reveal-right{opacity:0;transform:translateX(32px);transition:opacity 0.65s cubic-bezier(.4,0,.2,1),transform 0.65s cubic-bezier(.4,0,.2,1);}
.reveal-right.revealed{opacity:1;transform:translateX(0);}
.reveal-scale{opacity:0;transform:scale(0.92);transition:opacity 0.65s cubic-bezier(.4,0,.2,1),transform 0.65s cubic-bezier(.4,0,.2,1);}
.reveal-scale.revealed{opacity:1;transform:scale(1);}
.reveal-delay-1{transition-delay:0.1s;}
.reveal-delay-2{transition-delay:0.2s;}
.reveal-delay-3{transition-delay:0.3s;}
.reveal-delay-4{transition-delay:0.4s;}

/* ── TESTIMONIALS SLIDER ── */
.testimonials-slider-wrap{position:relative;overflow:hidden;}
.testimonials-slider{display:flex;gap:1.5rem;transition:transform 0.5s cubic-bezier(.4,0,.2,1);will-change:transform;}
.testimonials-slider .testimonial-card{flex:0 0 calc(33.333% - 1rem);min-width:calc(33.333% - 1rem);}
.slider-controls{display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1.5rem;}
.slider-btn{width:40px;height:40px;border-radius:50%;border:1.5px solid var(--border-brand);background:transparent;color:var(--purple);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s;font-size:0.9rem;}
.slider-btn:hover{background:var(--purple);color:#fff;}
.slider-dots{display:flex;gap:6px;align-items:center;}
.slider-dot{width:7px;height:7px;border-radius:50%;background:var(--border);cursor:pointer;transition:all 0.3s;}
.slider-dot.active{background:var(--purple);width:20px;border-radius:99px;}
@media(min-width:769px) and (max-width:1024px){
  .testimonials-slider .testimonial-card{flex:0 0 calc(50% - 0.75rem);min-width:calc(50% - 0.75rem);}
}
@media(max-width:768px){
  .testimonials-slider .testimonial-card{flex:0 0 100%;min-width:100%;}
}

/* ── MOBILE STICKY CTA ── */
#mob-sticky-cta{display:none;position:fixed;bottom:0;left:0;right:0;z-index:9994;background:#fff;border-top:1px solid var(--border);padding:0.6rem 1rem;box-shadow:0 -4px 20px rgba(0,0,0,0.1);}
#mob-sticky-cta-inner{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0.4rem;}
#mob-sticky-cta a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:0.68rem;font-weight:600;padding:0.5rem 0.25rem;border-radius:8px;text-decoration:none;transition:all 0.2s;}
#mob-sticky-cta .cta-call{background:#222291;color:#fff;}
#mob-sticky-cta .cta-wa{background:#25d366;color:#fff;}
#mob-sticky-cta .cta-quote{background:linear-gradient(135deg,#5e17eb,#cc3cd9);color:#fff;}
#mob-sticky-cta a i{font-size:1rem;}
@media(max-width:768px){#mob-sticky-cta{display:block;}}

/* ── SECTION REVEAL STAGGER ── */
.stagger-children > *{opacity:0;transform:translateY(24px);transition:opacity 0.5s cubic-bezier(.4,0,.2,1),transform 0.5s cubic-bezier(.4,0,.2,1);}
.stagger-children.revealed > *:nth-child(1){opacity:1;transform:none;transition-delay:0s;}
.stagger-children.revealed > *:nth-child(2){opacity:1;transform:none;transition-delay:0.1s;}
.stagger-children.revealed > *:nth-child(3){opacity:1;transform:none;transition-delay:0.2s;}
.stagger-children.revealed > *:nth-child(4){opacity:1;transform:none;transition-delay:0.3s;}
.stagger-children.revealed > *:nth-child(5){opacity:1;transform:none;transition-delay:0.4s;}
.stagger-children.revealed > *:nth-child(6){opacity:1;transform:none;transition-delay:0.5s;}
.stagger-children.revealed > *:nth-child(n+7){opacity:1;transform:none;transition-delay:0.5s;}

/* ═══════════════════════════════════════════════
   BATCH 3 — CONVERSION & TECHNICAL
═══════════════════════════════════════════════ */

/* ── DARK MODE ── */
[data-theme="dark"] #page-loader{background:#0d0b1a !important;}
[data-theme="dark"]{
  --white:#1a1a2e;
  --bg-soft:#16213e;
  --bg-dark:#0f0f23;
  --border:rgba(255,255,255,0.08);
  --border-soft:rgba(255,255,255,0.05);
  --border-brand:rgba(94,23,235,0.4);
  --text-dark:#f0f0ff;
  --text-body:#c8c8e0;
  --text-muted:#8888aa;
  --text-faint:#555577;
  --nav-bg:rgba(10,10,30,0.95);
  --card-bg:#1e1e3a;
}
[data-theme="dark"] .site-header{background:rgba(10,10,30,0.97);border-bottom:1px solid rgba(94,23,235,0.2);}
[data-theme="dark"] .service-card,[data-theme="dark"] .product-card,[data-theme="dark"] .blog-card,[data-theme="dark"] .testimonial-card,[data-theme="dark"] .industry-card{background:#1e1e3a;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .section.bg-soft,[data-theme="dark"] .bg-soft{background:#16213e;}
[data-theme="dark"] .faq-item{background:#1e1e3a;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] input,[data-theme="dark"] textarea,[data-theme="dark"] select{background:#1e1e3a;border-color:rgba(255,255,255,0.1);color:#f0f0ff;}
[data-theme="dark"] .footer-copyright,[data-theme="dark"] .footer-legal a{color:rgba(255,255,255,0.5);}
[data-theme="dark"] .hero-fcard{background:rgba(255,255,255,0.06);}

/* Dark mode toggle button */
#dark-toggle{width:38px;height:38px;border-radius:50%;background:transparent;border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.2s;color:var(--text-muted);font-size:1rem;flex-shrink:0;}
#dark-toggle:hover{border-color:var(--purple);color:var(--purple);}

/* ── SOCIAL PROOF TOAST ── */
#sp-toast{position:fixed;bottom:90px;right:24px;z-index:9993;background:#fff;border:1px solid var(--border);border-radius:14px;padding:12px 16px;box-shadow:0 8px 32px rgba(0,0,0,0.12);display:flex;align-items:center;gap:10px;max-width:280px;transform:translateX(120%);transition:transform 0.4s cubic-bezier(.4,0,.2,1);pointer-events:none;}
#sp-toast.show{transform:translateX(0);pointer-events:all;}
.sp-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#5e17eb,#cc3cd9);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1rem;flex-shrink:0;}
.sp-text{font-size:12px;line-height:1.45;color:var(--text-dark);}
.sp-text strong{display:block;font-size:11px;color:var(--purple);font-weight:700;}
.sp-close{background:none;border:none;color:var(--text-faint);cursor:pointer;font-size:14px;margin-left:4px;padding:2px;line-height:1;}
[data-theme="dark"] #sp-toast{background:#1e1e3a;border-color:rgba(255,255,255,0.1);}

/* ── EXIT INTENT POPUP ── */
#exit-popup{position:fixed;inset:0;z-index:99990;display:none;align-items:center;justify-content:center;padding:1rem;}
#exit-popup.open{display:flex;}
#exit-popup-overlay{position:absolute;inset:0;background:rgba(10,8,20,0.72);backdrop-filter:blur(6px);}
#exit-popup-box{position:relative;background:#fff;border-radius:22px;padding:2.75rem 2.25rem 2.25rem;max-width:420px;width:100%;text-align:center;box-shadow:0 30px 90px rgba(0,0,0,0.35);z-index:1;animation:popupIn 0.35s cubic-bezier(.4,0,.2,1);overflow:hidden;}
#exit-popup-box::before{content:'';position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--navy,#222291),var(--purple,#5e17eb),var(--violet,#cc3cd9));}
.exit-popup-icon{width:64px;height:64px;margin:0 auto 1rem;border-radius:50%;background:linear-gradient(135deg,var(--purple,#5e17eb),var(--violet,#cc3cd9));display:flex;align-items:center;justify-content:center;font-size:1.8rem;box-shadow:0 10px 24px rgba(94,23,235,0.35);}
@keyframes popupIn{from{opacity:0;transform:scale(0.88) translateY(20px);}to{opacity:1;transform:scale(1) translateY(0);}}
#exit-popup-box h3{font-size:1.4rem;font-weight:800;color:var(--text-dark);margin-bottom:0.5rem;}
#exit-popup-box p{font-size:0.88rem;color:var(--text-muted);margin-bottom:1.5rem;line-height:1.6;}
#exit-popup-close{position:absolute;top:12px;right:16px;background:none;border:none;font-size:1.3rem;color:var(--text-faint);cursor:pointer;line-height:1;padding:4px 8px;}
.popup-benefits{display:flex;flex-direction:column;gap:0.5rem;margin-bottom:1.5rem;text-align:left;}
.popup-benefit{display:flex;align-items:center;gap:0.6rem;font-size:0.83rem;color:var(--text-body);}
.popup-benefit i{color:#34d399;font-size:0.85rem;}
[data-theme="dark"] #exit-popup-box{background:#1a1a2e;}

/* ── BACK TO TOP z-index fix (above Tawk.to) ── */
#btt{z-index:99996 !important;}

/* ── DARK MODE COMPREHENSIVE ── */
[data-theme="dark"] body{background:#0a0a1f;color:#e8e8f8;}
[data-theme="dark"] .white-section,[data-theme="dark"] .section:not(.bg-soft):not(.cta-section):not(.page-hero){background:#0d0d28;}
[data-theme="dark"] .card{background:#16162e;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .hire-card,[data-theme="dark"] .process-step,[data-theme="dark"] .team-card,[data-theme="dark"] .portfolio-card{background:#16162e;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .stat-item{background:#16162e;}
[data-theme="dark"] .faq-item{background:#16162e;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .faq-answer{color:#a0a0c0;}
[data-theme="dark"] .tech-item{background:#16162e;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .tech-item:hover{background:#1e1e3a;}
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6{color:#f0f0ff;}
[data-theme="dark"] p,[data-theme="dark"] li{color:#a0a0c0;}
[data-theme="dark"] .text-dark,[data-theme="dark"] .stat-num,[data-theme="dark"] .stat-label{color:#e0e0f8;}
[data-theme="dark"] .page-hero{background:linear-gradient(135deg,#0a0a1f,#1a0845);}
[data-theme="dark"] .cta-section{background:linear-gradient(135deg,#0f0f35,#1a0845);}
[data-theme="dark"] .site-footer{background:#080818;}
[data-theme="dark"] .footer-bottom{background:#050510;border-color:rgba(255,255,255,0.05);}
[data-theme="dark"] .footer-col h4{color:#fff;}
[data-theme="dark"] .footer-col a{color:rgba(255,255,255,0.55);}
[data-theme="dark"] .footer-col a:hover{color:#a78bfa;}
[data-theme="dark"] .nav-link{color:#c0c0e0;}
[data-theme="dark"] .nav-link:hover{color:#a78bfa;}
[data-theme="dark"] .mega-menu{background:#111128;border-color:rgba(255,255,255,0.08);}
[data-theme="dark"] .mega-link{color:#c0c0e0;}
[data-theme="dark"] .mega-link:hover{background:rgba(94,23,235,0.15);}
[data-theme="dark"] .topbar{background:#060614;border-color:rgba(255,255,255,0.06);}
[data-theme="dark"] .topbar-item,[data-theme="dark"] .topbar-item a{color:rgba(255,255,255,0.55);}
[data-theme="dark"] .section-label{color:#d4bbff;}
[data-theme="dark"] .btn-secondary{background:rgba(255,255,255,0.06);border-color:rgba(255,255,255,0.15);color:#e0e0f8;}
[data-theme="dark"] .btn-secondary:hover{background:rgba(255,255,255,0.1);}
[data-theme="dark"] .breadcrumb a,[data-theme="dark"] .breadcrumb span{color:rgba(255,255,255,0.5);}
[data-theme="dark"] .testimonials-slider .testimonial-card{background:#16162e;}
[data-theme="dark"] .client-logo-item{filter:brightness(0) invert(0.7);}
[data-theme="dark"] .cookie-banner{background:#1a1a2e;border-color:rgba(255,255,255,0.1);}
[data-theme="dark"] .cookie-banner p{color:#a0a0c0;}
[data-theme="dark"] #mob-sticky-cta{background:#111128;border-color:rgba(255,255,255,0.08);}
[data-theme="dark"] .wa-popup-body{background:#16162e;}
[data-theme="dark"] .wa-bubble{background:#1e1e3a;}
[data-theme="dark"] .related-posts a,[data-theme="dark"] .related-services a{background:#16162e;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .pf-btn{border-color:rgba(255,255,255,0.15);color:#a0a0c0;}
[data-theme="dark"] table{color:#c0c0e0;}
[data-theme="dark"] .footer-made{color:rgba(255,255,255,0.35);}
[data-theme="dark"] #dark-toggle{border-color:rgba(255,255,255,0.35);color:rgba(255,255,255,0.8);}
[data-theme="dark"] #dark-toggle:hover{border-color:#a78bfa;color:#a78bfa;}

/* ── DARK MODE MISSING ELEMENTS FIX ── */
/* Section backgrounds */
[data-theme="dark"] .section{background:#0a0a1f;}
[data-theme="dark"] .section.bg-soft{background:#0e0e28 !important;}
[data-theme="dark"] .stats-bar{background:#080818;}

/* Text colors */
[data-theme="dark"] .section-header h2{color:#f0f0ff;}
[data-theme="dark"] .section-header p{color:#8888aa;}
[data-theme="dark"] .section-label{color:#d4bbff;}
[data-theme="dark"] .hero-desc{color:rgba(255,255,255,0.55);}
[data-theme="dark"] .hero-stat-label{color:rgba(255,255,255,0.5);}
[data-theme="dark"] .hero-stat-num{color:#fff;}

/* Cards text */
[data-theme="dark"] .service-card h4,[data-theme="dark"] .service-card h3{color:#f0f0ff;}
[data-theme="dark"] .service-card p{color:#8888aa;}
[data-theme="dark"] .product-card h4,[data-theme="dark"] .product-card h3{color:#f0f0ff;}
[data-theme="dark"] .product-card p{color:#8888aa;}
[data-theme="dark"] .blog-card h4,[data-theme="dark"] .blog-card h3{color:#f0f0ff;}
[data-theme="dark"] .industry-card h4,[data-theme="dark"] .industry-card h3{color:#f0f0ff;}
[data-theme="dark"] .testimonial-card p{color:#a0a0c0;}
[data-theme="dark"] .testimonial-card .reviewer-name{color:#f0f0ff;}

/* Process steps */
[data-theme="dark"] .process-step{background:#16162e;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .process-step h3,[data-theme="dark"] .process-step h4{color:#f0f0ff;}
[data-theme="dark"] .process-step p{color:#8888aa;}

/* Tech section */
[data-theme="dark"] .tech-item span{color:#c0c0e0;}
[data-theme="dark"] .tech-category-label,[data-theme="dark"] .tech-tab-label{color:#8888aa;}

/* Stats */
[data-theme="dark"] .stat-num span{color:#f0f0ff;}
[data-theme="dark"] .stat-label{color:#8888aa;}
[data-theme="dark"] .stat-item{background:#16162e;border-color:rgba(255,255,255,0.06);}

/* FAQ */
[data-theme="dark"] .faq-question{color:#f0f0ff;}
[data-theme="dark"] .faq-question:hover{color:#a78bfa;}

/* Hire cards */
[data-theme="dark"] .hire-card h3,[data-theme="dark"] .hire-card h4{color:#f0f0ff;}
[data-theme="dark"] .hire-card p{color:#8888aa;}
[data-theme="dark"] .hire-card li{color:#8888aa;}

/* Why choose us */
[data-theme="dark"] .reason-card{background:#16162e;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .reason-card h4{color:#f0f0ff;}
[data-theme="dark"] .reason-card p{color:#8888aa;}

/* Portfolio */
[data-theme="dark"] .portfolio-card{background:#16162e;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .portfolio-card h4{color:#f0f0ff;}
[data-theme="dark"] .portfolio-card p{color:#8888aa;}

/* Testimonials */
[data-theme="dark"] .testimonials-slider .testimonial-card{background:#16162e;}

/* Blog */
[data-theme="dark"] .blog-card .blog-category{color:#a78bfa;}
[data-theme="dark"] .blog-card .blog-date{color:#6666aa;}

/* Topbar */
[data-theme="dark"] .topbar{background:#04040f;border-bottom:1px solid rgba(255,255,255,0.05);}
[data-theme="dark"] .topbar-item{color:rgba(255,255,255,0.45);}
[data-theme="dark"] .topbar-item a{color:rgba(255,255,255,0.45);}
[data-theme="dark"] .topbar-item a:hover{color:#a78bfa;}

/* Borders */
[data-theme="dark"] .section-divider{border-color:rgba(255,255,255,0.05);}
[data-theme="dark"] hr{border-color:rgba(255,255,255,0.05);}

/* Breadcrumb */
[data-theme="dark"] .breadcrumb-sep{color:rgba(255,255,255,0.3);}

/* Buttons outline */
[data-theme="dark"] .btn-outline,[data-theme="dark"] .btn-secondary{background:rgba(255,255,255,0.05);border-color:rgba(255,255,255,0.15);color:#e0e0ff;}

/* Tables */
[data-theme="dark"] table th{background:#16162e;color:#f0f0ff;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] table td{border-color:rgba(255,255,255,0.05);color:#a0a0c0;}
[data-theme="dark"] table tr:hover td{background:rgba(94,23,235,0.06);}

/* Cookie banner */
[data-theme="dark"] #cookie-banner{background:#1a1a2e;border-color:rgba(255,255,255,0.08);}
[data-theme="dark"] #cookie-banner p{color:#a0a0c0;}

/* Pricing */
[data-theme="dark"] .pricing-card{background:#16162e;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .pricing-card h3,[data-theme="dark"] .pricing-card .price{color:#f0f0ff;}
[data-theme="dark"] .pricing-card li{color:#8888aa;}

/* Location cards */
[data-theme="dark"] .location-card{background:#16162e;}

/* Forms */
[data-theme="dark"] .form-group label{color:#c0c0e0;}
[data-theme="dark"] .contact-form{background:#16162e;}

/* Misc */
[data-theme="dark"] .clients-section{background:#08081a;}
[data-theme="dark"] .client-logo-item{filter:brightness(0) invert(0.6);}
[data-theme="dark"] .hero-badge{background:rgba(94,23,235,0.15);border-color:rgba(94,23,235,0.3);}
[data-theme="dark"] .hero-badge-dot{box-shadow:0 0 8px #10b981;}

/* ── OG IMAGE per page ── */

/* ── TYPING ANIMATION ── */
.typed-word{background:linear-gradient(135deg,#a78bfa,#cc3cd9,#f472b6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;min-width:2px;display:inline-block;}
.typed-cursor{display:inline-block;color:#cc3cd9;font-weight:300;animation:cursorBlink 0.8s ease-in-out infinite;margin-left:2px;}
@keyframes cursorBlink{0%,100%{opacity:1;}50%{opacity:0;}}

/* ── TECH MARQUEE ── */
.tech-marquee-section{
  padding:1.5rem 0;
  background:var(--white);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  overflow:hidden;
  position:relative;
}
/* Fade edges */
.tech-marquee-section::before,
.tech-marquee-section::after{
  content:'';
  position:absolute;
  top:0;bottom:0;width:120px;z-index:2;
}
.tech-marquee-section::before{left:0;background:linear-gradient(90deg,var(--white),transparent);}
.tech-marquee-section::after{right:0;background:linear-gradient(270deg,var(--white),transparent);}

.tech-marquee-wrap{width:100%;overflow:hidden;}
.tech-marquee-track{
  display:flex;
  align-items:center;
  gap:0;
  width:max-content;
  animation:marqueeScroll 30s linear infinite;
}
.tech-marquee-track:hover{animation-play-state:paused;}
@keyframes marqueeScroll{
  0%{transform:translateX(0);}
  100%{transform:translateX(-50%);}
}
.tmq-item{
  display:inline-flex;
  align-items:center;
  gap:0.5rem;
  padding:0.55rem 1.4rem;
  white-space:nowrap;
  border-right:1px solid var(--border);
  transition:background 0.2s;
}
.tmq-item:hover{background:var(--brand-pale);}
.tmq-item span{
  font-size:0.78rem;
  font-weight:600;
  color:var(--text-muted);
}
.tmq-item:hover span{color:var(--purple);}

/* Dark mode marquee */
[data-theme="dark"] .tech-marquee-section{background:#0d0d28;border-color:rgba(255,255,255,0.06);}
[data-theme="dark"] .tech-marquee-section::before{background:linear-gradient(90deg,#0d0d28,transparent);}
[data-theme="dark"] .tech-marquee-section::after{background:linear-gradient(270deg,#0d0d28,transparent);}
[data-theme="dark"] .tmq-item{border-color:rgba(255,255,255,0.06);}
[data-theme="dark"] .tmq-item:hover{background:rgba(94,23,235,0.12);}
[data-theme="dark"] .tmq-item span{color:rgba(255,255,255,0.4);}
[data-theme="dark"] .tmq-item:hover span{color:#a78bfa;}

/* ═══════════════════════════════════════════════
   MOBILE RESPONSIVE — V30
   Rule: Desktop layout UNCHANGED
   Only <1024px breakpoints below
═══════════════════════════════════════════════ */

/* ── GLOBAL MOBILE TOKENS ── */
@media(max-width:768px){
  :root{
    --pad-x:1rem;
    --s-20:2.5rem;
    --s-16:2rem;
    --s-12:1.5rem;
  }
}

/* ── HERO SECTION ── */
@media(max-width:1024px){
  .hero{min-height:auto !important;padding:5rem 0 3rem;}
  .hero-content{max-width:100%;text-align:center;}
  .hero h1{font-size:clamp(1.75rem,6vw,2.5rem);letter-spacing:-0.5px;}
  .hero-badge{justify-content:center;}
  .hero-desc{margin:0 auto;max-width:560px;}
  .hero-btns{justify-content:center;flex-wrap:wrap;}
  .hero-stats{justify-content:center;}
}
@media(max-width:768px){
  .hero{padding:4.5rem 0 2.5rem;}
  .hero h1{font-size:clamp(1.6rem,7vw,2.2rem);}
  .hero-btns{flex-direction:column;align-items:center;}
  .hero-btns .btn{width:100%;max-width:280px;justify-content:center;}
  .hero-stats{gap:1rem;}
  .hero-stat-num{font-size:1.5rem;}
}
@media(max-width:480px){
  .hero{padding:4rem 0 2rem;}
  .hero h1{font-size:1.6rem;}
}

/* ── SECTIONS ── */
@media(max-width:768px){
  .section{padding:2.5rem 0;}
  .section-sm{padding:1.5rem 0;}
  .section-header{margin-bottom:1.75rem;}
  .section-header h2{font-size:clamp(1.4rem,5vw,1.9rem);}
  .section-header p{font-size:0.88rem;}
  .section-label{font-size:0.68rem;}
}
@media(max-width:480px){
  .section-header h2{font-size:1.4rem;}
}

/* ── SERVICES GRID ── */
@media(max-width:768px){
  .services-grid{grid-template-columns:1fr;gap:1rem;}
  .service-card{padding:1.5rem;}
  .service-card h3,.service-card h4{font-size:1rem;}
}

/* ── PRODUCTS GRID ── */
@media(max-width:768px){
  .products-grid{grid-template-columns:1fr;gap:1rem;}
}

/* ── PROCESS STEPS ── */
@media(max-width:768px){
  .process-steps{grid-template-columns:1fr;gap:1rem;}
  .process-step{padding:1.5rem;display:flex;gap:1rem;text-align:left;align-items:flex-start;}
  .process-step-num{flex-shrink:0;}
}
@media(max-width:480px){
  .process-steps{grid-template-columns:1fr;}
}

/* ── STATS GRID ── */
@media(max-width:768px){
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:1rem;}
  .stat-num{font-size:2rem;}
}
@media(max-width:360px){
  .stats-grid{grid-template-columns:1fr;}
}

/* ── INDUSTRIES ── */
@media(max-width:768px){
  .industries-grid{grid-template-columns:repeat(2,1fr);gap:1rem;}
  .industry-card{padding:1.25rem;}
}
@media(max-width:400px){
  .industries-grid{grid-template-columns:1fr;}
}

/* ── TECH GRID ── */
@media(max-width:768px){
  .tech-grid{grid-template-columns:repeat(3,1fr);gap:0.6rem;}
  .tech-item{padding:0.75rem 0.5rem;}
  .tech-item span{font-size:0.68rem;}
  .tech-icon-wrap{width:2rem;height:2rem;}
  .tech-icon-wrap i{font-size:1.2rem;}
}
@media(max-width:400px){
  .tech-grid{grid-template-columns:repeat(2,1fr);}
}

/* ── TECH MARQUEE ── */
@media(max-width:768px){
  .tech-marquee-section{padding:1rem 0;}
  .tmq-item{padding:0.4rem 1rem;}
  .tmq-item span{font-size:0.7rem;}
}

/* ── TESTIMONIALS ── */
@media(max-width:768px){
  .testimonials-slider .testimonial-card{padding:1.5rem;}
  .testimonial-text{font-size:0.85rem;}
}

/* ── BLOG GRID ── */
@media(max-width:768px){
  .blog-grid{grid-template-columns:1fr;gap:1rem;}
}

/* ── HIRE CARDS ── */
@media(max-width:768px){
  .hire-grid{grid-template-columns:1fr;gap:1rem;}
}

/* ── FAQ ── */
@media(max-width:768px){
  .faq-question{font-size:0.88rem;padding:0.9rem 1rem;}
  .faq-answer p{font-size:0.82rem;}
}

/* ── CTA SECTION ── */
@media(max-width:768px){
  .cta-section{padding:2.5rem 0;}
  .cta-inner h2{font-size:clamp(1.4rem,5vw,1.9rem);}
  .cta-buttons{flex-direction:column;align-items:center;gap:0.75rem;}
  .cta-buttons .btn{width:100%;max-width:280px;justify-content:center;}
}

/* ── PAGE HERO ── */
@media(max-width:768px){
  .page-hero{padding:4rem 0 2rem;}
  .page-hero-inner h1{font-size:clamp(1.5rem,6vw,2.2rem);}
  .page-hero-inner .desc{font-size:0.88rem;}
}

/* ── GRID UTILITIES ── */
@media(max-width:768px){
  .grid-2{grid-template-columns:1fr !important;}
  .grid-3{grid-template-columns:1fr !important;}
  .grid-4{grid-template-columns:repeat(2,1fr) !important;}
  [style*="grid-template-columns:repeat(3"]:not(.tech-grid):not(.industries-grid):not(.clients-grid){
    grid-template-columns:1fr !important;
  }
  [style*="grid-template-columns:1fr 1fr 1fr"]{grid-template-columns:1fr !important;}
  [style*="grid-template-columns:1.1fr 0.9fr"]{grid-template-columns:1fr !important;}
}
@media(max-width:480px){
  .grid-4{grid-template-columns:1fr !important;}
}

/* ── CARDS GENERAL ── */
@media(max-width:768px){
  .card{padding:1.25rem;}
  .reason-card,.feature-card{padding:1.5rem;}
}

/* ── PRICING ── */
@media(max-width:768px){
  .pricing-grid{grid-template-columns:1fr !important;max-width:400px;margin:0 auto;}
  .pricing-card{padding:1.75rem;}
}

/* ── TABLE MOBILE ── */
@media(max-width:768px){
  table{font-size:0.78rem;}
  table th,table td{padding:0.6rem 0.5rem;}
  /* Horizontal scroll for comparison tables */
  .table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .table-scroll table{min-width:500px;}
}

/* ── BUTTONS ── */
@media(max-width:480px){
  .btn-lg{padding:0.75rem 1.25rem;font-size:0.88rem;}
  .btn{font-size:0.82rem;}
}

/* ── BREADCRUMB ── */
@media(max-width:480px){
  .breadcrumb{font-size:0.72rem;flex-wrap:wrap;}
}

/* ── SOCIAL PROOF TOAST ── */
@media(max-width:480px){
  #sp-toast{right:12px;max-width:calc(100vw - 24px);bottom:80px;}
}

/* ── EXIT POPUP ── */
@media(max-width:480px){
  #exit-popup-box{padding:1.5rem;margin:1rem;border-radius:1rem;}
  #exit-popup-box h3{font-size:1.1rem;}
}

/* ── WA POPUP ── */
@media(max-width:480px){
  .wa-popup{width:calc(100vw - 2rem);right:1rem;}
}

/* ── LOCATION PAGES ── */
@media(max-width:768px){
  .page-hero-inner .btn-lg{width:100%;justify-content:center;}
  [style*="grid-template-columns:1fr 1fr;"]{grid-template-columns:1fr !important;}
  [style*="grid-template-columns:repeat(3,1fr)"]{grid-template-columns:1fr !important;}
  [style*="grid-template-columns:repeat(auto-fit"]{grid-template-columns:repeat(2,1fr) !important;}
}
@media(max-width:480px){
  [style*="grid-template-columns:repeat(auto-fit"]{grid-template-columns:1fr !important;}
}

/* ── COMPARE PAGES ── */
@media(max-width:768px){
  [style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr !important;}
  [style*="grid-template-columns:repeat(3,1fr)"]{grid-template-columns:1fr !important;}
}

/* ── FOOTER MOBILE ── */
@media(max-width:768px){
  .footer-mid-inner{flex-direction:column;gap:0.85rem;align-items:flex-start;}
  .footer-badges-row{gap:0.4rem;}
  .footer-bottom-inner{gap:0.6rem;}
  .footer-copyright{font-size:9px;}
  .frow{flex-direction:column;gap:0.6rem;}
  .frow-nl{justify-content:flex-start;width:100%;flex-wrap:wrap;}
  .nli{width:100%;max-width:100%;}
}
@media(max-width:480px){
  .footer-top{grid-template-columns:1fr !important;}
  .footer-bottom-inner{align-items:flex-start;}
  .footer-legal{gap:3px;}
  .footer-legal a{font-size:9px;}
  .frow-nl{flex-direction:column;}
  .nli,.nlb{width:100% !important;}
}

/* ── MOBILE NAV IMPROVEMENTS ── */
@media(max-width:1024px){
  .mobile-nav{background:var(--white);}
  .mob-nav-link{font-size:1rem;font-weight:700;color:var(--text-dark);}
  .mob-sub a{font-size:0.85rem;color:var(--text-muted);}
  .mob-actions .btn{font-size:0.9rem;padding:0.85rem;}
}

/* ── DARK MODE MOBILE ── */
@media(max-width:1024px){
  [data-theme="dark"] .mobile-nav{background:#0a0a1f;}
  [data-theme="dark"] .mob-nav-link{color:#f0f0ff;border-color:rgba(255,255,255,0.08);}
  [data-theme="dark"] .mob-sub a{color:#8888aa;border-color:rgba(255,255,255,0.05);}
  [data-theme="dark"] .mob-sub{background:#0d0d28;}
}

/* ── CLIENTS GRID ── */
@media(max-width:768px){
  .clients-grid{grid-template-columns:repeat(3,1fr);gap:0.75rem;}
  .client-logo{padding:0.75rem;}
}
@media(max-width:400px){
  .clients-grid{grid-template-columns:repeat(2,1fr);}
}

/* ── TEAM GRID ── */
@media(max-width:768px){
  .team-grid{grid-template-columns:repeat(2,1fr);gap:1rem;}
}
@media(max-width:400px){
  .team-grid{grid-template-columns:1fr;}
}

/* ── PORTFOLIO ── */
@media(max-width:768px){
  .portfolio-grid{grid-template-columns:1fr !important;gap:1rem;}
  .pf-filters{flex-wrap:wrap;gap:0.4rem;}
  .pf-btn{font-size:0.75rem;padding:0.4rem 0.85rem;}
}

/* ── SOCIAL PROOF TOAST — dont overlap mob CTA ── */
@media(max-width:768px){
  #sp-toast{bottom:80px;}
}

/* ── CONTAINER PADDING ── */
@media(max-width:480px){
  .container{padding:0 1rem;}
}

/* ── HEADINGS SCALE ── */
@media(max-width:480px){
  h1{font-size:clamp(1.5rem,7vw,2rem);}
  h2{font-size:clamp(1.25rem,5vw,1.6rem);}
  h3{font-size:clamp(1rem,4vw,1.2rem);}
}

/* ── MOBILE CRITICAL FIXES V30 ── */

/* 1. Remove right gap — body no horizontal scroll */
html { overflow-x:hidden !important; max-width:100vw; }
body { max-width:100vw; }
* { box-sizing:border-box; }

/* 2. Hero full width on all mobile */
@media(max-width:1150px){
  .hero{ min-height:auto !important; }
  .hero-content{ max-width:100%; padding:0; }
  .hero h1{ text-align:center; }
  .hero-badge{ margin:0 auto 1.25rem; }
  .hero-desc{ text-align:center; }
  .hero-btns{ justify-content:center; }
  .hero-stats{ justify-content:center; }
}

/* 3. Stats — horizontal row on mobile */
@media(max-width:768px){
  .hero-stats{
    display:flex !important;
    flex-direction:row !important;
    justify-content:center !important;
    gap:1rem !important;
    flex-wrap:nowrap !important;
  }
  .hero-stat-divider{ display:block !important; }
  .hero-stat-num{ font-size:1.4rem !important; }
  .hero-stat-label{ font-size:0.7rem !important; }
}

/* 4. Remove mob-sticky-cta CSS */
#mob-sticky-cta{ display:none !important; }

/* 5. No horizontal overflow anywhere */
@media(max-width:768px){
  .container{ overflow:hidden; }
  section, .section { overflow-x:hidden; }
  .hero { overflow:hidden; }
  .hero-aurora, .hero-beams, .hero-pts { overflow:hidden; }
}

/* 6. Marquee no overflow */
@media(max-width:768px){
  .tech-marquee-wrap{ overflow:hidden; }
}

/* 7. Footer row wrap properly */
@media(max-width:480px){
  .frow{ flex-direction:column; gap:0.5rem; }
  .frow-div{ display:none; }
  .frow-nl{ flex-direction:column; width:100%; }
  .frow-nl .nli{ width:100%; }
  .frow-nl .nlb{ width:100%; }
}

/* 8. Page hero padding fix for mobile */
@media(max-width:768px){
  .page-hero{
    padding:calc(70px + 2rem) 0 2rem !important;
  }
}

/* ═══════════════════════════════════════════════
   MOBILE FIXES V30 — PHASE 2
═══════════════════════════════════════════════ */

/* ── CONTACT PAGE ── */
.contact-layout{display:grid;grid-template-columns:1fr 1.4fr;gap:3rem;align-items:start;margin-bottom:3rem;}
.contact-items{display:flex;flex-direction:column;gap:0.75rem;margin-bottom:1.5rem;}
.contact-item{display:flex;align-items:center;gap:1rem;padding:1rem 1.1rem;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--white);text-decoration:none;transition:all var(--t-base);}
.contact-item:hover{border-color:var(--purple);transform:translateX(4px);}
.contact-item-icon{width:2.5rem;height:2.5rem;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1rem;}
.contact-item-label{font-size:0.72rem;color:var(--text-muted);}
.contact-item-value{font-size:0.85rem;font-weight:700;color:var(--text-dark);}
.contact-item-sub{font-size:0.7rem;font-weight:600;}
.contact-trust{padding:1.25rem;background:var(--grad-dark);border-radius:var(--r-xl);}
.contact-trust h4{color:white;font-size:0.9rem;margin-bottom:0.75rem;}
.trust-item{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.4rem;font-size:0.8rem;color:rgba(255,255,255,0.75);}
.contact-form-col{background:var(--white);border:1px solid var(--border);border-radius:var(--r-2xl);padding:2rem;box-shadow:var(--shadow-md);}
.contact-form-col h3{font-size:1.15rem;margin-bottom:0.3rem;}
.contact-form-col>p{font-size:0.82rem;color:var(--text-muted);margin-bottom:1.5rem;}
.form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:0;}
.response-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;margin-top:3rem;}
.response-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);padding:1.5rem;text-align:center;}
.response-icon{width:2.75rem;height:2.75rem;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 0.75rem;font-size:1.1rem;}
.response-card h4{font-size:1rem;margin-bottom:0.3rem;}
.response-card p{font-size:0.78rem;color:var(--text-muted);margin:0;}

/* ── FAQ LAYOUT (service pages) ── */
.faq-layout{display:grid;grid-template-columns:1fr 1.6fr;gap:4rem;align-items:start;}
.service-two-col{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start;}

/* ── PARTNER GRID ── */
.partner-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem;}

/* ── ABOUT PAGE ── */
.about-two-col{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start;}
.about-two-col-sm{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
.about-three-col{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}

/* ── SUPPORT PAGE ── */
.support-four-col{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;}
.support-two-col{display:grid;grid-template-columns:1fr 1fr;gap:2rem;}
.support-three-col{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;}
.support-channels-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;}

/* ── REVIEW US BUTTON ── */
#reviewUs{z-index:9990 !important;}

/* ══ MOBILE BREAKPOINTS ══ */
@media(max-width:768px){

  /* Contact */
  .contact-layout{grid-template-columns:1fr !important;gap:2rem;}
  .form-row-2{grid-template-columns:1fr !important;gap:0;}
  .response-cards{grid-template-columns:repeat(2,1fr) !important;gap:0.75rem;margin-top:2rem;}
  .contact-form-col{padding:1.5rem;}

  /* FAQ */
  .faq-layout{grid-template-columns:1fr !important;gap:2rem;}
  .service-two-col{grid-template-columns:1fr !important;gap:2rem;}

  /* Partners */
  .partner-grid{grid-template-columns:repeat(3,1fr) !important;gap:0.6rem;}

  /* About */
  .about-two-col{grid-template-columns:1fr !important;gap:2rem;}
  .about-two-col-sm{grid-template-columns:repeat(2,1fr) !important;}
  .about-three-col{grid-template-columns:1fr !important;gap:1rem;}

  /* Support */
  .support-four-col{grid-template-columns:repeat(2,1fr) !important;}
  .support-two-col{grid-template-columns:1fr !important;gap:1.5rem;}
  .support-three-col{grid-template-columns:1fr !important;gap:0.75rem;}
  .support-channels-grid{grid-template-columns:1fr !important;}

  /* Process steps gap fix */
  .process-steps .process-step{margin-bottom:0 !important;}

  /* Footer compact on mobile */
  .footer-top{gap:1.25rem !important;padding:1.5rem 0 1rem !important;}
  .footer-col h4{font-size:9px;margin-bottom:0.5rem;}
  .footer-links a{padding:0.15rem 0;font-size:0.68rem;}
  .footer-mid{padding:0.6rem 0;}
  .footer-bottom{padding:0.5rem 0;}
  .frow{padding:0.6rem 0;}
}

@media(max-width:480px){
  /* Contact */
  .response-cards{grid-template-columns:1fr !important;}
  .contact-form-col{padding:1.25rem;border-radius:var(--r-xl);}

  /* Partners */
  .partner-grid{grid-template-columns:repeat(2,1fr) !important;}

  /* About */
  .about-two-col-sm{grid-template-columns:1fr !important;}

  /* Support */
  .support-four-col{grid-template-columns:1fr !important;}

  /* Footer even more compact */
  .footer-top{padding:1.25rem 0 0.75rem !important;}
  .fcop{font-size:9px;}
}

/* ── CONTACT PAGE V2 ── */
.cpage-wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:3rem;align-items:start;margin-bottom:3rem;}

/* Form col */
.cpage-form-inner{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-2xl);padding:2rem;box-shadow:var(--shadow-md);}
.cpage-form-inner h3{font-size:1.2rem;margin-bottom:0.25rem;color:var(--text-dark);}
.cpage-form-inner>p{font-size:0.82rem;color:var(--text-muted);margin-bottom:1.5rem;}

/* Info col */
.cpage-info h2{font-size:1.25rem;margin-bottom:0.35rem;}
.cpage-info>p{font-size:0.85rem;color:var(--text-muted);margin-bottom:1.5rem;}

/* Contact info items */
.cinfo-list{display:flex;flex-direction:column;gap:0.6rem;margin-bottom:1.5rem;}
.cinfo-item{display:grid;grid-template-columns:2.5rem 1fr;gap:0.85rem;padding:0.85rem 1rem;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--white);text-decoration:none;transition:all 0.2s;align-items:center;}
.cinfo-item:hover{border-color:var(--purple);transform:translateX(3px);}
.cinfo-icon{width:2.5rem;height:2.5rem;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;}
.cinfo-body{display:flex;flex-direction:column;gap:1px;min-width:0;}
.cinfo-label{font-size:0.7rem;color:var(--text-faint);font-weight:600;text-transform:uppercase;letter-spacing:0.04em;}
.cinfo-val{font-size:0.85rem;font-weight:700;color:var(--text-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cinfo-sub{font-size:0.7rem;font-weight:600;}

/* Trust box */
.cinfo-trust{background:linear-gradient(135deg,#222291,#5e17eb,#cc3cd9);border-radius:var(--r-xl);padding:1.25rem 1.5rem;}
.cinfo-trust-title{color:white;font-size:0.88rem;font-weight:700;margin-bottom:0.75rem;}
.cinfo-trust-item{display:flex;align-items:center;gap:0.5rem;color:rgba(255,255,255,0.82);font-size:0.8rem;margin-bottom:0.4rem;}
.cinfo-trust-item i{color:#4ade80;flex-shrink:0;}

/* Response cards */
.cpage-response{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding:1.5rem;background:var(--bg-soft);border-radius:var(--r-2xl);}
.cpage-rcard{text-align:center;padding:1.25rem 0.75rem;}
.cpage-ricon{width:2.75rem;height:2.75rem;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 0.6rem;font-size:1.1rem;}
.cpage-rval{font-size:1rem;font-weight:800;margin-bottom:0.25rem;}
.cpage-rtxt{font-size:0.75rem;color:var(--text-muted);line-height:1.4;}

/* MOBILE */
@media(max-width:900px){
  .cpage-wrap{grid-template-columns:1fr !important;gap:2rem;}
  .cpage-response{grid-template-columns:repeat(2,1fr) !important;}
}
@media(max-width:480px){
  .cpage-form-inner{padding:1.25rem;}
  .cpage-response{grid-template-columns:repeat(2,1fr) !important;gap:0.6rem;padding:1rem;}
  .cinfo-val{font-size:0.8rem;}
}

@media(max-width:768px){
  #reviewUs{font-size:0;padding:0.5rem 0.4rem;width:18px;}
  #reviewUs::after{content:"R";font-size:0.6rem;writing-mode:vertical-rl;}
}

/* ═══════════════════════════════════════════════
   GLOBAL INLINE GRID MOBILE FIX — V30
   Targets ALL inline style grids across 121 pages
   Desktop layout UNCHANGED (above 768px)
═══════════════════════════════════════════════ */

@media(max-width:768px){

  /* ── 1fr 1fr (65 files) ── */
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"]{
    grid-template-columns:1fr !important;
  }

  /* ── repeat(3,1fr) (58 files) ── */
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns: repeat(3, 1fr)"],
  [style*="grid-template-columns:repeat(3, 1fr)"]{
    grid-template-columns:1fr !important;
  }

  /* ── 1fr 1.6fr — hire/FAQ pages (35 files) ── */
  [style*="grid-template-columns:1fr 1.6fr"],
  [style*="grid-template-columns:1fr 1.4fr"],
  [style*="grid-template-columns:1.4fr 1fr"],
  [style*="grid-template-columns:1.6fr 1fr"],
  [style*="grid-template-columns:1fr 1.2fr"],
  [style*="grid-template-columns:1.2fr 1fr"],
  [style*="grid-template-columns:1fr 1.5fr"],
  [style*="grid-template-columns:1fr 1.8fr"],
  [style*="grid-template-columns:1.8fr 1fr"]{
    grid-template-columns:1fr !important;
  }

  /* ── repeat(4,1fr) (10 files) ── */
  [style*="grid-template-columns:repeat(4,1fr)"],
  [style*="grid-template-columns: repeat(4,1fr)"],
  [style*="grid-template-columns:repeat(4, 1fr)"]{
    grid-template-columns:repeat(2,1fr) !important;
  }

  /* ── 1fr 300px / 1fr 320px — blog sidebar, job detail ── */
  [style*="grid-template-columns:1fr 300px"],
  [style*="grid-template-columns:1fr 320px"],
  [style*="grid-template-columns:1fr 280px"]{
    grid-template-columns:1fr !important;
  }

  /* ── 1.1fr 0.9fr — hero inner ── */
  [style*="grid-template-columns:1.1fr 0.9fr"]{
    grid-template-columns:1fr !important;
  }

  /* ── Gap adjustments ── */
  [style*="gap:4rem"],[style*="gap: 4rem"],
  [style*="gap:5rem"],[style*="gap: 5rem"],
  [style*="gap:3rem"],[style*="gap: 3rem"]{
    gap:1.5rem !important;
  }
  [style*="gap:2rem"],[style*="gap: 2rem"]{
    gap:1rem !important;
  }

  /* ── Padding adjustments on inline styles ── */
  [style*="padding:2.5rem"],[style*="padding:3rem"]{
    padding:1.5rem !important;
  }
  [style*="padding:2rem"]{
    padding:1.25rem !important;
  }
}

@media(max-width:480px){

  /* repeat(2,1fr) → 1fr on very small screens */
  [style*="grid-template-columns:repeat(2,1fr)"],
  [style*="grid-template-columns: repeat(2,1fr)"]{
    grid-template-columns:1fr !important;
  }

  /* repeat(4,1fr) → 1fr */
  [style*="grid-template-columns:repeat(4,1fr)"]{
    grid-template-columns:1fr !important;
  }

  /* Font sizes for inline headings */
  [style*="font-size:2rem"],[style*="font-size: 2rem"]{font-size:1.5rem !important;}
  [style*="font-size:1.8rem"],[style*="font-size:1.6rem"]{font-size:1.3rem !important;}
  [style*="font-size:1.4rem"],[style*="font-size:1.5rem"]{font-size:1.2rem !important;}
}

/* ── SPECIFIC PAGE FIXES ── */

/* Hire pages — 2 col layout */
@media(max-width:768px){
  .hire-layout,[class*="hire-grid"]{grid-template-columns:1fr !important;}
  .hire-card{padding:1.25rem !important;}

  /* Location pages */
  .location-services-grid{grid-template-columns:1fr !important;}

  /* Why choose us */
  .reasons-grid{grid-template-columns:1fr !important;}

  /* Pricing tables */
  .pricing-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .pricing-table-wrap table{min-width:480px;}

  /* Blog */
  .blog-detail-layout{grid-template-columns:1fr !important;}
  .blog-sidebar{display:none;}

  /* Awards */
  .awards-grid{grid-template-columns:repeat(2,1fr) !important;}

  /* Industries */
  .industries-cards{grid-template-columns:1fr !important;}

  /* Social pages */
  .social-page-grid{grid-template-columns:1fr !important;}

  /* Careers job detail */
  .job-detail-layout{grid-template-columns:1fr !important;}

  /* How we work timeline */
  .timeline-grid{grid-template-columns:1fr !important;}

  /* Products comparison */
  .products-comparison-grid{overflow-x:auto;}

  /* Free trial form */
  .trial-layout{grid-template-columns:1fr !important;}
}

@media(max-width:480px){
  /* Awards 1 col */
  .awards-grid{grid-template-columns:1fr !important;}

  /* Location city cards */
  [style*="minmax(180px"]{grid-template-columns:repeat(2,1fr) !important;}
}

/* ═══════════════════════════════════════════════
   NEW FEATURES CSS — V30
═══════════════════════════════════════════════ */

/* ── SCROLL PROGRESS BAR ── */
#scroll-progress{
  position:fixed;top:0;left:0;right:0;
  height:3px;z-index:999999;
  background:rgba(0,0,0,0.08);
}
#scroll-progress-bar{
  height:100%;width:0%;
  background:linear-gradient(90deg,#222291,#5e17eb,#cc3cd9);
  transition:width 0.1s linear;
  box-shadow:0 0 8px rgba(94,23,235,0.6);
}

/* ── COOKIE BANNER IMPROVED ── */
#cookie-banner{
  position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);
  z-index:99990;max-width:720px;width:calc(100% - 2rem);
  background:#181628;border:1px solid rgba(255,255,255,0.08);
  border-radius:1.1rem;box-shadow:0 20px 60px rgba(0,0,0,0.45);
  animation:cookieSlideUp 0.4s ease forwards;overflow:hidden;
}
.cookie-accent{height:3px;background:linear-gradient(90deg,var(--navy,#222291),var(--purple,#5e17eb),var(--violet,#cc3cd9));}
.cookie-inner{
  display:flex;align-items:center;gap:1rem;padding:1.1rem 1.25rem;
  flex-wrap:wrap;
}
.cookie-icon-wrap{width:42px;height:42px;border-radius:50%;background:rgba(94,23,235,0.18);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.cookie-icon{font-size:1.4rem;flex-shrink:0;}
.cookie-content{flex:1;min-width:200px;}
.cookie-title{font-size:0.88rem;font-weight:700;color:#fff;margin-bottom:3px;}
.cookie-text{font-size:0.75rem;color:rgba(255,255,255,0.55);line-height:1.5;margin:0;}
.cookie-text a{color:#a78bfa;}
.cookie-actions{display:flex;gap:0.5rem;flex-shrink:0;}
@keyframes cookieSlideUp{from{opacity:0;transform:translateX(-50%) translateY(20px);}to{opacity:1;transform:translateX(-50%) translateY(0);}}
@media(max-width:480px){
  .cookie-inner{gap:0.75rem;padding:0.85rem 1rem;}
  .cookie-icon-wrap{display:none;}
  .cookie-actions{width:100%;justify-content:flex-end;}
}

/* ── LIVE CHAT TRIGGER ── */
#chat-trigger-box{
  position:fixed;bottom:90px;right:1.5rem;
  z-index:99990;max-width:280px;
  background:#fff;border:1px solid var(--border);
  border-radius:1rem;box-shadow:0 8px 32px rgba(0,0,0,0.15);
  padding:1.25rem;
  opacity:0;transform:translateY(20px) scale(0.95);
  transition:all 0.35s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}
#chat-trigger-box.ctb-show{opacity:1;transform:translateY(0) scale(1);pointer-events:all;}
.ctb-close{
  position:absolute;top:0.6rem;right:0.6rem;
  background:none;border:none;cursor:pointer;
  color:var(--text-faint);font-size:0.9rem;
  width:24px;height:24px;display:flex;align-items:center;justify-content:center;
  border-radius:50%;transition:background 0.2s;
}
.ctb-close:hover{background:var(--bg-soft);}
.ctb-avatar{font-size:2rem;margin-bottom:0.5rem;}
.ctb-name{font-size:0.75rem;font-weight:700;color:var(--purple);margin-bottom:4px;}
.ctb-text{font-size:0.82rem;color:var(--text-body);line-height:1.55;margin-bottom:0.85rem;}
.ctb-btn{
  display:block;background:linear-gradient(135deg,#5e17eb,#cc3cd9);
  color:#fff;border-radius:0.6rem;padding:0.6rem 1rem;
  font-size:0.8rem;font-weight:700;text-decoration:none;text-align:center;
  transition:opacity 0.2s;
}
.ctb-btn:hover{opacity:0.9;}
[data-theme="dark"] #chat-trigger-box{background:#16162e;border-color:rgba(255,255,255,0.08);}
[data-theme="dark"] .ctb-text{color:#c0c0e0;}

/* ── 404 PAGE ── */
.notfound-section{
  min-height:85vh;display:flex;align-items:center;
  background:linear-gradient(160deg,#f8f6ff 0%,#fff 100%);
  padding:4rem 0;
}
.notfound-wrap{max-width:640px;margin:0 auto;text-align:center;}
.notfound-num{
  display:flex;align-items:center;justify-content:center;gap:0.5rem;
  margin-bottom:1.5rem;line-height:1;
}
.n4a,.n4b,.n0-inner{
  font-size:clamp(5rem,18vw,9rem);font-weight:900;
  background:linear-gradient(135deg,#222291,#5e17eb,#cc3cd9);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;font-family:var(--font-display);
}
.n0{
  width:clamp(5rem,18vw,9rem);height:clamp(5rem,18vw,9rem);
  border:6px solid transparent;border-radius:50%;
  background:linear-gradient(white,white) padding-box,
             linear-gradient(135deg,#222291,#5e17eb,#cc3cd9) border-box;
  display:flex;align-items:center;justify-content:center;
  animation:spin404 8s linear infinite;
}
@keyframes spin404{to{transform:rotate(360deg);}}
.notfound-title{font-size:clamp(1.5rem,5vw,2.2rem);margin-bottom:1rem;color:var(--text-dark);}
.notfound-desc{color:var(--text-muted);font-size:1rem;line-height:1.7;margin-bottom:2rem;max-width:480px;margin-left:auto;margin-right:auto;}
.notfound-search{
  display:flex;align-items:center;gap:0.75rem;
  background:var(--white);border:2px solid var(--border);
  border-radius:3rem;padding:0.6rem 1.25rem;
  margin:0 auto 2rem;max-width:400px;
  transition:border-color 0.2s;
}
.notfound-search:focus-within{border-color:var(--purple);}
.notfound-search i{color:var(--text-faint);}
.notfound-search input{
  flex:1;border:none;background:none;outline:none;
  font-size:0.9rem;color:var(--text-dark);
}
.notfound-btns{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;margin-bottom:2.5rem;}
.notfound-popular{background:var(--white);border:1px solid var(--border);border-radius:var(--r-2xl);padding:1.5rem;}
.notfound-pop-title{font-size:0.8rem;font-weight:700;color:var(--text-faint);text-transform:uppercase;letter-spacing:0.08em;margin-bottom:1rem;}
.notfound-pop-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0.5rem;}
.notfound-pop-item{
  display:flex;flex-direction:column;align-items:center;gap:0.4rem;
  padding:0.75rem 0.5rem;border:1px solid var(--border);border-radius:var(--r-lg);
  font-size:0.75rem;color:var(--text-muted);text-decoration:none;
  transition:all 0.2s;text-align:center;
}
.notfound-pop-item i{color:var(--purple);font-size:1.1rem;}
.notfound-pop-item:hover{border-color:var(--purple);color:var(--purple);transform:translateY(-2px);}
[data-theme="dark"] .notfound-section{background:linear-gradient(160deg,#0a0a1f,#060614);}
[data-theme="dark"] .notfound-popular{background:#16162e;border-color:rgba(255,255,255,0.07);}
[data-theme="dark"] .notfound-search{background:#16162e;border-color:rgba(255,255,255,0.1);}
[data-theme="dark"] .notfound-search input{color:#f0f0ff;}
[data-theme="dark"] .notfound-pop-item{border-color:rgba(255,255,255,0.07);color:#8888aa;}
[data-theme="dark"] .notfound-pop-item:hover{border-color:#a78bfa;color:#a78bfa;}
[data-theme="dark"] .n0{background:linear-gradient(#0a0a1f,#0a0a1f) padding-box,linear-gradient(135deg,#222291,#5e17eb,#cc3cd9) border-box;}
@media(max-width:480px){
  .notfound-pop-grid{grid-template-columns:repeat(2,1fr);}
  .notfound-btns .btn{width:100%;justify-content:center;}
  .notfound-section{min-height:auto;padding:3rem 0;}
}

/* ===== About Page — "Our Journey" Timeline (Aug 2026) =====
   Replaces old fully-inline-styled version that had zero mobile handling
   (fixed 50% card widths broke/cramped on small screens) with real CSS
   classes, so this media query can actually stack it on mobile. */
.about-timeline{position:relative;max-width:800px;margin:0 auto;}
.about-timeline-line{position:absolute;left:50%;top:0;bottom:0;width:2px;background:linear-gradient(to bottom,var(--purple),var(--violet));transform:translateX(-50%);}
.about-timeline-row{display:flex;margin-bottom:2.5rem;position:relative;}
.about-timeline-row.is-left{justify-content:flex-start;}
.about-timeline-row.is-right{justify-content:flex-end;}
.about-timeline-card{width:calc(50% - 2rem);background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);padding:1.5rem;position:relative;transition:all var(--t-base);}
.about-timeline-row.is-left .about-timeline-card{margin-right:2rem;}
.about-timeline-row.is-right .about-timeline-card{margin-left:2rem;}
.about-timeline-card:hover{border-color:var(--tl-color);box-shadow:0 4px 20px color-mix(in srgb, var(--tl-color) 20%, transparent);}
.about-timeline-card-head{display:flex;align-items:center;gap:0.75rem;margin-bottom:0.75rem;}
.about-timeline-icon{width:2.25rem;height:2.25rem;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.about-timeline-period{font-size:0.72rem;font-weight:700;padding:3px 10px;border-radius:99px;}
.about-timeline-title{font-size:0.95rem;font-weight:700;margin-bottom:0.5rem;color:var(--text-dark);}
.about-timeline-desc{font-size:0.82rem;color:var(--text-muted);line-height:1.65;margin:0;}
.about-timeline-dot{position:absolute;left:50%;top:1.5rem;width:16px;height:16px;border-radius:50%;transform:translateX(-50%);border:3px solid var(--white);z-index:1;}

@media(max-width:768px){
  .about-timeline-line{left:20px;}
  .about-timeline-row.is-left,
  .about-timeline-row.is-right{justify-content:flex-start;}
  .about-timeline-card{width:100%;margin-left:3rem !important;margin-right:0 !important;}
  .about-timeline-dot{left:20px;}
}

/* ═══════════════════════════════════════════════
   MINI HERO VISUAL — Round 15 (Aug 2026)
   Reusable glass-card mockup graphic for service &
   hire-developer page heroes. Pure CSS/HTML, no
   image assets — reuses the same floating-card
   visual language as the homepage hero (.hero-fcard /
   fcardFloat) so it feels native to the brand rather
   than bolted-on. See partials/hero-visual.blade.php.
═══════════════════════════════════════════════ */
.page-hero-split{display:grid;grid-template-columns:1fr;gap:2.5rem;align-items:center;}
@media(min-width:992px){.page-hero-split{grid-template-columns:1.15fr 0.85fr;}}
.mhv{position:relative;height:380px;display:none;}
@media(min-width:992px){.mhv{display:block;}}
.mhv-device{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:260px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.14);border-radius:20px;backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);box-shadow:0 20px 60px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.1);overflow:hidden;z-index:3;}
.mhv-device-bar{display:flex;gap:6px;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,0.08);}
.mhv-device-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,0.2);}
.mhv-device-body{padding:2rem 1.5rem 2.1rem;display:flex;flex-direction:column;align-items:center;text-align:center;}
.mhv-icon-ring{width:76px;height:76px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;color:#fff;margin-bottom:1.1rem;position:relative;box-shadow:0 10px 30px rgba(94,23,235,0.35);}
.mhv-icon-ring::before{content:'';position:absolute;inset:-8px;border-radius:50%;border:1px solid rgba(255,255,255,0.18);animation:mhvPulse 2.4s ease-out infinite;}
@keyframes mhvPulse{0%{transform:scale(0.9);opacity:0.8;}100%{transform:scale(1.35);opacity:0;}}
.mhv-tech-row{display:flex;gap:8px;margin-top:0.3rem;flex-wrap:wrap;justify-content:center;}
.mhv-tech-chip{width:32px;height:32px;border-radius:9px;background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.12);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.75);font-size:0.85rem;}
.mhv-badge{position:absolute;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.14);border-radius:14px;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);padding:12px 16px;color:#fff;box-shadow:0 8px 28px rgba(0,0,0,0.35),inset 0 1px 0 rgba(255,255,255,0.08);z-index:4;animation:fcardFloat ease-in-out infinite;min-width:130px;pointer-events:none;}
.mhv-badge-1{top:6px;right:0;animation-duration:5.5s;}
.mhv-badge-2{bottom:6px;left:0;animation-duration:6.5s;animation-delay:1.2s;}
.mhv-badge-label{font-size:9px;color:rgba(255,255,255,0.4);letter-spacing:.07em;text-transform:uppercase;margin-bottom:4px;}
.mhv-badge-val{font-size:18px;font-weight:700;color:#fff;letter-spacing:-0.3px;}
.mhv-orbit-dot{position:absolute;width:8px;height:8px;border-radius:50%;box-shadow:0 0 12px currentColor,0 0 24px currentColor;z-index:2;}


/* ═══════════════════════════════════════════════
   PORTFOLIO CARDS v2 — Round 15 (Aug 2026)
   Replaces flat emoji-icon cards with gradient art
   panels (matching the About page's Round 14 value
   cards) since no real project photography exists yet.
═══════════════════════════════════════════════ */
.pf-card-v2{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;transition:all var(--t-base);}
.pf-card-v2:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--border-brand);}
.pf-card-v2-art{height:110px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.pf-card-v2-art::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle at 20% 20%,rgba(255,255,255,0.18) 0,transparent 45%),radial-gradient(circle at 80% 80%,rgba(255,255,255,0.12) 0,transparent 40%);}
.pf-card-v2-emoji{font-size:2.1rem;position:relative;z-index:1;filter:drop-shadow(0 4px 10px rgba(0,0,0,0.25));}
.pf-card-v2-tag{position:absolute;top:10px;right:10px;background:rgba(0,0,0,0.28);backdrop-filter:blur(6px);color:#fff;font-size:0.62rem;font-weight:700;letter-spacing:0.03em;padding:3px 9px;border-radius:99px;z-index:1;}
.pf-card-v2-body{padding:1.1rem 1.25rem 1.25rem;}
.pf-card-v2-body h5{font-size:0.95rem;margin-bottom:0.2rem;}
.pf-card-v2-meta{font-size:0.78rem;color:var(--text-muted);margin-bottom:0.6rem;}
.pf-card-v2-stack{font-size:0.7rem;color:var(--purple);font-weight:600;display:flex;align-items:center;gap:0.4rem;}

/* ═══════════════════════════════════════════════
   ABOUT PAGE — Round 16 (Aug 2026)
   These classes are referenced by about.blade.php's
   Aug-2026 redesign (Mission/Vision/Values layered
   cards, Our Journey stepper, Our Offices monogram
   cards) but were missing from style.css in the last
   deploy -- that gap (blade updated, CSS not) is what
   made these sections render as raw unstyled colour
   bars on the live site. Written mobile-first and
   avoids fragile absolute-positioned overlaps (uses
   flex + transform instead) so a partial CSS load
   degrades less badly in future.
═══════════════════════════════════════════════ */

/* -- Mission / Vision / Values -- */
.about-value-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;}
.about-value-art{height:110px;display:flex;align-items:flex-end;padding:0 1.5rem;}
.about-value-badge{width:3rem;height:3rem;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 18px rgba(0,0,0,0.18);transform:translateY(50%);flex-shrink:0;}
.about-value-body{padding:2.25rem 1.5rem 1.5rem;}
@media(max-width:640px){
  .about-value-art{height:88px;padding:0 1.25rem;}
  .about-value-badge{width:2.5rem;height:2.5rem;}
  .about-value-badge i{font-size:1rem !important;}
  .about-value-body{padding:2rem 1.25rem 1.25rem;}
}

/* -- Our Journey stepper -- */
.about-steps{max-width:820px;margin:0 auto;}
.about-step{display:flex;gap:1.25rem;}
.about-step-rail{display:flex;flex-direction:column;align-items:center;flex-shrink:0;}
.about-step-icon{width:2.75rem;height:2.75rem;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,0.15);flex-shrink:0;}
.about-step-line{width:2px;flex:1;background:var(--border);margin:0.4rem 0;min-height:1.5rem;}
.about-step-card{flex:1;min-width:0;background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:1.25rem 1.5rem;margin-bottom:1.5rem;}
.about-step-period{display:inline-block;font-size:0.72rem;font-weight:700;padding:0.25rem 0.75rem;border-radius:99px;margin-bottom:0.5rem;}
.about-step-title{font-size:1rem;margin-bottom:0.4rem;}
.about-step-desc{font-size:0.85rem;color:var(--text-muted);line-height:1.65;margin:0;}
@media(max-width:640px){
  .about-step{gap:0.8rem;}
  .about-step-icon{width:2.25rem;height:2.25rem;font-size:0.85rem;}
  .about-step-card{padding:1rem 1.1rem;margin-bottom:1rem;}
  .about-step-title{font-size:0.92rem;}
  .about-step-desc{font-size:0.8rem;}
}

/* -- Our Offices -- */
.about-office-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-xl);padding:1.5rem;}
.about-office-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0.5rem;margin-bottom:1rem;}
.about-office-code{width:2.75rem;height:2.75rem;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:0.95rem;flex-shrink:0;}
.about-office-tag{font-size:0.7rem;font-weight:700;padding:0.3rem 0.75rem;border-radius:99px;white-space:nowrap;}
@media(max-width:480px){.about-office-card{padding:1.25rem;}}

/* -- Office photo grid -- */
.about-office-photos{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;}
.about-office-photo-card{border-radius:var(--r-lg);overflow:hidden;background:var(--bg-muted);border:1px solid var(--border);}
.about-office-photo-img{aspect-ratio:4/3;overflow:hidden;background:var(--bg-muted);}
.about-office-photo-caption{font-size:0.74rem;color:var(--text-muted);padding:0.6rem 0.75rem;margin:0;line-height:1.4;}
@media(max-width:768px){.about-office-photos{grid-template-columns:repeat(2,1fr);}}
@media(max-width:420px){.about-office-photos{grid-template-columns:1fr;}}

/* ═══════════════════════════════════════════════
   PROCESS STEPS — mobile consolidation (Round 16)
   Multiple earlier passes left scattered/duplicate
   media queries for .process-steps across the file.
   This is the authoritative, final mobile rule (kept
   at the end of the file so it always wins the
   cascade for these selectors) -- clean flex-row
   layout, icon left / text right, consistent sizing.
═══════════════════════════════════════════════ */
@media(max-width:768px){
  .process-steps{display:flex !important;flex-direction:column;gap:0.85rem;}
  .process-step{display:flex !important;align-items:center;gap:1rem;text-align:left;padding:1rem 1.1rem;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--white);}
  .process-steps::before{display:none;}
  .process-num{width:2.75rem;height:2.75rem;font-size:0.95rem;margin:0;flex-shrink:0;}
  .process-step h5{margin-bottom:0.2rem;font-size:0.88rem;}
  .process-step p{font-size:0.78rem;margin:0;}
}