
/* ═══════════════════════════════════════════════════════════
   NEXCODE — Comprehensive CSS Update v3
   - Logo image styles
   - Tech stack slider  
   - About page team grid fix
   - Speed optimizations
   - Font rendering
   ═══════════════════════════════════════════════════════════ */

/* ── CRITICAL PERFORMANCE: contain layout hints ──────────── */
#nav { contain: layout style; }
.sec { contain: layout; }

/* ── LOGO IMAGE ──────────────────────────────────────────── */
.nav-logo { display: flex; align-items: center; gap: 0; text-decoration: none; }
.nav-logo-img {
  height: 100px;
  width: auto;
  max-width: 160px;
  object-fit: contain;
  display: block;
  /* Fallback: if logo.png not uploaded yet, show text fallback */
}
/* Fallback text when image fails */
.nav-logo-img::after {
  content: 'NEXCODE';
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800;
  font-size: 1.2rem;
  color: var(--blue);
  letter-spacing: -0.03em;
}
.footer-logo-img {
  height: 100px;
  width: auto;
  max-width: 140px;
  object-fit: contain;
}
/* Legacy nav-logo-wordmark still shows as fallback */
.nlogo-wm { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 1.25rem; letter-spacing: -.03em; }
.nlogo-wm .nx { color: var(--blue); }
.nlogo-wm .cd { color: var(--steel-d); }

/* ── TECH STACK SLIDER ───────────────────────────────────── */
.tss-wrap {
  padding: 22px 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  background: var(--g50);
  overflow: hidden;
  position: relative;
}
.tss-wrap::before,
.tss-wrap::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 80px;
  z-index: 2;
  pointer-events: none;
}
.tss-wrap::before { left: 0; background: linear-gradient(to right, var(--g50), transparent); }
.tss-wrap::after  { right: 0; background: linear-gradient(to left, var(--g50), transparent); }

.tss-lbl {
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--g300);
  text-align: center;
  margin-bottom: 14px;
}
.tss-outer { overflow: hidden; width: 100%; }
.tss-track {
  display: flex;
  gap: 10px;
  width: max-content;
  animation: tss-scroll 40s linear infinite;
  will-change: transform;
}
.tss-track:hover { animation-play-state: paused; }

@keyframes tss-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.tss-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  transition: background .18s, transform .18s;
  cursor: pointer;
  flex-shrink: 0;
  min-width: 72px;
}
.tss-item:hover {
  background: rgba(41,82,217,.06);
  transform: translateY(-2px);
}
.tss-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
}
.tss-name {
  font-size: .64rem;
  font-weight: 700;
  color: var(--g500);
  white-space: nowrap;
  letter-spacing: .02em;
}
.tss-item:hover .tss-name { color: var(--blue); }

/* ── ABOUT PAGE TEAM GRID ────────────────────────────────── */
.tmg {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 8px;
}
@media (max-width: 900px) {
  .tmg { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 500px) {
  .tmg { grid-template-columns: 1fr; max-width: 280px; margin-left: auto; margin-right: auto; }
}
.tm-n {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-size: 1rem;
  font-weight: 800;
  color: var(--g900);
  margin-bottom: 3px;
}
.tm-r {
  font-size: .65rem;
  color: var(--blue);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: 6px;
}

/* ── FONT RENDERING OPTIMISATION ────────────────────────── */
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: 'kern' 1, 'liga' 1;
}
/* Force font display during load — prevents invisible text (FOIT) */
.h1, .h2, .h3, .nav-logo, .pr-nm, .pr-price, .tm-n, .ew {
  font-family: 'Bricolage Grotesque', 'Arial Black', 'Impact', sans-serif;
}
body, p, li, input, select, textarea, .lead, .btn {
  font-family: 'Plus Jakarta Sans', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
}

/* ── SPEED: Image lazy loading default ───────────────────── */
img { max-width: 100%; height: auto; }
img:not([loading]) { loading: lazy; }

/* ── SPEED: Reduce paint complexity ─────────────────────── */
.rv, .rl, .rr {
  will-change: auto; /* Only set will-change during animation */
}
.rv.v, .rl.v, .rr.v { will-change: auto; }

/* ── SPEED: Reduce reflow from hover transforms ─────────── */
.prc, .card, .mdi, .tss-item {
  transform: translateZ(0); /* Promote to own layer */
  backface-visibility: hidden;
}

/* ── NAV LOGO URL FIX: /index → / handled via htaccess ──── */

/* ── ABOUT: section background alternation ───────────────── */
.sec-alt { background: var(--g50); }

/* ── Fix: highlight selection on team cards looked bad ────── */
.tmg .rv *::selection { background: var(--blue-pale); }

/* ── BODY cursor fix ─────────────────────────────────────── */
body { cursor: default; }
a, button, [role="button"], .btn, label[for], .tss-item { cursor: pointer; }

/* ── MOBILE RESPONSIVE: pricing grid ────────────────────── */
@media (max-width: 768px) {
  .prg { grid-template-columns: 1fr; max-width: 420px; margin-left: auto; margin-right: auto; }
  .g3  { grid-template-columns: 1fr; }
  .tmg { grid-template-columns: repeat(2, 1fr); }
  .tss-icon { width: 30px; height: 30px; font-size: .95rem; }
  .nav-logo-img { height: 100px; }
}

/* ── Fix: flogo display in footer ───────────────────────── */
.flogo { display: flex; align-items: center; gap: 0; }

/* ── Fix: footer wordmark text alignment ────────────────── */
.flwm { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 1.1rem; letter-spacing: -.02em; }
.flwm .nx { color: var(--blue); }
.flwm .cd { color: rgba(255,255,255,.7); }

/* ── Skip link for accessibility ────────────────────────── */
.skip-link {
  position: absolute;
  top: -48px;
  left: 16px;
  background: var(--blue);
  color: #fff;
  padding: 8px 18px;
  border-radius: 0 0 8px 8px;
  font-size: .82rem;
  font-weight: 700;
  z-index: 9999;
  text-decoration: none;
  transition: top .2s;
}
.skip-link:focus { top: 0; }

/* ── Fix: cscroll animation (kept for backward compat) ───── */
@keyframes cscroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ── Page specific: about hero padding ───────────────────── */
#main-content { outline: none; }


/* ═══ PRICING PAGE FIXES ═══════════════════════════ */
.prg { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; margin-top: 36px; }
@media (max-width: 900px) { .prg { grid-template-columns: 1fr; max-width: 480px; margin-left: auto; margin-right: auto; } }

.prc { background: #fff; border: 1px solid var(--border); border-radius: 17px; padding: 32px 28px; position: relative; transition: all .28s; }
.prc.ft { border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-pale2); }
.prc:hover { box-shadow: var(--shl); transform: translateY(-3px); }
.prc.ft:hover { box-shadow: 0 0 0 3px var(--blue-pale2), var(--shl); }
.pr-bdg { position: absolute; top: -11px; left: 50%; transform: translateX(-50%); background: var(--blue); color: #fff; padding: 3px 14px; border-radius: 100px; font-size: .64rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.pr-tier { font-size: .63rem; letter-spacing: .12em; text-transform: uppercase; color: var(--g400); font-weight: 700; margin-bottom: 4px; }
.pr-nm { font-family: 'Bricolage Grotesque', sans-serif; font-size: 1.2rem; font-weight: 800; margin-bottom: 18px; }
.pr-price { font-family: 'Bricolage Grotesque', sans-serif; font-size: 2.7rem; font-weight: 800; letter-spacing: -.04em; line-height: 1; margin-bottom: 3px; }
.pr-price sub { font-size: .95rem; font-weight: 500; vertical-align: baseline; }
.pr-per { font-size: .71rem; color: var(--g400); margin-bottom: 24px; }
.pr-div { height: 1px; background: var(--border); margin-bottom: 20px; }
.pr-fs { margin-bottom: 26px; }
.pr-fs li { display: flex; align-items: center; gap: 7px; font-size: .77rem; padding: 5px 0; color: var(--g500); }
.pr-fs li::before { content: '✓'; color: var(--blue); flex-shrink: 0; font-weight: 700; }
.pr-fs li.off { color: var(--g300); }
.pr-fs li.off::before { content: '—'; color: var(--g200); }

/* G3 grid responsive fix */
.g3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
@media (max-width: 900px) { .g3 { grid-template-columns: 1fr; } }

/* Card base */
.card { background: #fff; border: 1px solid var(--border); border-radius: 15px; padding: 24px; transition: all .28s; position: relative; overflow: hidden; }
.card:hover { border-color: var(--blue-pale2); box-shadow: var(--shl); transform: translateY(-3px); }

/* Pricing page trust bar responsive */
@media (max-width: 768px) {
  .prg { grid-template-columns: 1fr; }
  .g3 { grid-template-columns: 1fr; }
}

/* ═══ INTERNAL LINK STYLES ═══════════════════════════ */
.il { color: var(--blue); text-decoration: none; border-bottom: 1px solid var(--blue-pale2); transition: border-color .15s; }
.il:hover { border-bottom-color: var(--blue); }
.kw-link { color: inherit; text-decoration: none; border-bottom: 1px dashed var(--g200); transition: border-color .15s; }
.kw-link:hover { border-bottom-color: var(--blue); color: var(--blue); }
.shc-lk { display: block; font-size: .8rem; color: var(--g600); text-decoration: none; padding: 3px 0; transition: color .15s; }
.shc-lk:hover { color: var(--blue); }

/* ═══ SEC / CON GLOBAL LAYOUT ════════════════════════ */
.sec { padding: 72px 44px; }
.con { max-width: 1160px; margin: 0 auto; }
@media (max-width: 768px) { .sec { padding: 48px 20px; } }

/* ═══ HERO STYLES ════════════════════════════════════ */
.phero { background: linear-gradient(135deg, #f8fafc 0%, #eef1fd 100%); padding: 100px 44px 60px; text-align: center; position: relative; overflow: hidden; border-bottom: 1px solid var(--border); margin-top: 68px; }
.phero-dots { position: absolute; inset: 0; background-image: radial-gradient(circle, var(--blue-pale2) 1px, transparent 1px); background-size: 32px 32px; opacity: .5; pointer-events: none; }
.h1 { font-family: 'Bricolage Grotesque', sans-serif; font-size: 3rem; font-weight: 800; line-height: 1.1; letter-spacing: -.04em; margin-bottom: 0; }
.h2 { font-family: 'Bricolage Grotesque', sans-serif; font-size: 2rem; font-weight: 800; line-height: 1.15; letter-spacing: -.03em; }
.h3 { font-family: 'Bricolage Grotesque', sans-serif; font-size: 1.4rem; font-weight: 700; line-height: 1.2; }
.lead { font-size: 1rem; line-height: 1.75; color: var(--g500); }
.ew { font-size: .62rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: var(--blue); margin-bottom: 10px; }
.mt16 { margin-top: 16px; }
.mt52 { margin-top: 52px; }
.mb40 { margin-bottom: 40px; }
.mb32 { margin-bottom: 32px; }
.tc { text-align: center; }
.tg { background: linear-gradient(90deg, var(--blue), #5b7fff); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.tgs { background: linear-gradient(90deg, var(--blue), #7b97ff, #a78bfa); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.m600 { max-width: 600px; }
.mx { margin-left: auto; margin-right: auto; }

/* ═══ BUTTONS ════════════════════════════════════════ */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 11px 22px; border-radius: 9px; font-weight: 700; font-size: .86rem; cursor: pointer; transition: all .2s; text-decoration: none; white-space: nowrap; border: none; font-family: inherit; }
.btn-lg { padding: 13px 28px; font-size: .92rem; }
.btn-sm { padding: 7px 14px; font-size: .78rem; }
.btn-p { background: var(--blue); color: #fff; }
.btn-p:hover { background: var(--blue-d); transform: translateY(-1px); box-shadow: 0 4px 16px rgba(41,82,217,.3); }
.btn-g { background: var(--g50); color: var(--g700); border: 1px solid var(--border); }
.btn-g:hover { border-color: var(--blue-pale2); background: var(--blue-pale); color: var(--blue); }
.btn-o { background: transparent; color: var(--blue); border: 1.5px solid var(--blue-pale2); }
.btn-o:hover { background: var(--blue-pale); border-color: var(--blue); }
.btn-w { background: rgba(255,255,255,.12); color: #fff; border: 1.5px solid rgba(255,255,255,.25); }
.btn-w:hover { background: rgba(255,255,255,.2); }
.btn-wo { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,.2); }
.btn-wo:hover { background: rgba(255,255,255,.1); }

/* ═══ CTA BANNER ═════════════════════════════════════ */
.cta-ban { background: linear-gradient(135deg, var(--blue), #4a6ff5); padding: 72px 44px; text-align: center; position: relative; overflow: hidden; }
.cta-ban h2 { color: #fff; }
.cta-ban .lead { color: rgba(255,255,255,.75); margin-top: 12px; }
.cta-acts { display: flex; gap: 14px; justify-content: center; margin-top: 28px; flex-wrap: wrap; }

/* ═══ GRID LAYOUTS ═══════════════════════════════════ */
.g2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 768px) { .g2 { grid-template-columns: 1fr; } }

/* ═══ GRID REVEAL ANIMATIONS ════════════════════════ */
.rv { opacity: 0; transform: translateY(18px); transition: opacity .55s ease, transform .55s ease; }
.rv.v { opacity: 1; transform: translateY(0); }
.d1.rv { transition-delay: .05s; } .d2.rv { transition-delay: .1s; }
.d3.rv { transition-delay: .15s; } .d4.rv { transition-delay: .2s; }
.rl { opacity: 0; transform: translateX(-22px); transition: opacity .6s ease, transform .6s ease; }
.rl.v { opacity: 1; transform: translateX(0); }
.rr { opacity: 0; transform: translateX(22px); transition: opacity .6s ease, transform .6s ease; }
.rr.v { opacity: 1; transform: translateX(0); }

/* Breadcrumb */
.breadcrumb { display: flex; align-items: center; gap: 6px; list-style: none; flex-wrap: wrap; }
.breadcrumb a { font-size: .72rem; color: var(--g400); text-decoration: none; transition: color .2s; }
.breadcrumb a:hover { color: var(--blue); }
.breadcrumb .sep { color: var(--g300); font-size: .72rem; }
.breadcrumb .cur { font-size: .72rem; color: var(--blue); font-weight: 600; }

/* Info card */
.info-card { background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 18px; }
.info-card-t { font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--g400); margin-bottom: 12px; }

/* Team grid */
.tmg { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }
@media (max-width: 900px) { .tmg { grid-template-columns: repeat(2,1fr); } }

/* MDI / mega dropdown item */
.mdi { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 9px; cursor: pointer; text-decoration: none; color: inherit; transition: background .18s; }
.mdi:hover { background: var(--g50); }
.mdi-ic { width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: .95rem; flex-shrink: 0; }
.mdi-ic.ib { background: var(--blue-pale); }
.mdi-ic.ig { background: #dcfce7; }
.mdi-ic.ia { background: #fef3c7; }
.mdi-ic.is { background: #f5f3ff; }
.mdi-ic.ip { background: #fce7f3; }
.mdi-ic.iy { background: #fefce8; }
.mdi-ic.io { background: #fff7ed; }
.mdi-ic.ir { background: #fee2e2; }
.mdi-t { font-size: .8rem; font-weight: 700; color: var(--g900); line-height: 1.2; }
.mdi-d { font-size: .68rem; color: var(--g400); margin-top: 1px; }
/* ═══════════════════════════════════════════════════════
   NEXCODE — Speed & SEO CSS Optimisations
   Added: May 2026
═══════════════════════════════════════════════════════ */

/* Critical rendering path optimisation */
html { font-size: 16px; text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
img, video { height: auto; max-width: 100%; } /* Prevent CLS */
img { loading: lazy; } /* Native lazy loading hint */

/* Ensure all images have explicit dimensions for CLS prevention */
.blog-card img, .case-img img, .team-img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; }

/* Font display swap — prevent invisible text during load */
@font-face { font-display: swap; }

/* Focus styles for accessibility (also a Lighthouse score factor) */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}

/* Skip to content — accessibility + Core Web Vitals */
.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: var(--blue);
  color: #fff;
  padding: 8px 16px;
  z-index: 9999;
  border-radius: 0 0 8px 0;
  font-weight: 700;
}
.skip-link:focus { top: 0; }

/* Blog content styles */
.blog-content { max-width: 740px; }
.blog-content h2 { font-family: 'Bricolage Grotesque', sans-serif; font-size: 1.4rem; font-weight: 800; margin: 32px 0 12px; color: #0f172a; }
.blog-content h3 { font-family: 'Bricolage Grotesque', sans-serif; font-size: 1.1rem; font-weight: 700; margin: 24px 0 10px; color: #1e293b; }
.blog-content p { margin: 0 0 16px; }
.blog-content ul, .blog-content ol { margin: 0 0 20px; padding-left: 22px; }
.blog-content li { margin-bottom: 8px; }
.blog-content a { color: var(--blue); text-decoration: none; border-bottom: 1px solid var(--blue-pale2); }
.blog-content a:hover { border-bottom-color: var(--blue); }
.blog-content strong { color: #1e293b; }
.blog-content pre { margin: 16px 0 24px; border-radius: 10px; overflow-x: auto; }
.blog-content table { width: 100%; margin: 16px 0; }

/* Contact form improvements */
.cfm { background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 32px; }
.cog { display: grid; grid-template-columns: 1fr 1.2fr; gap: 36px; align-items: start; }
@media (max-width: 768px) { .cog { grid-template-columns: 1fr; } }
.frow { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 580px) { .frow { grid-template-columns: 1fr; } }
.fg { display: flex; flex-direction: column; margin-bottom: 14px; }
.fl { font-size: .72rem; font-weight: 700; color: var(--g500); margin-bottom: 5px; letter-spacing: .02em; }
.fi, .fsel, .fta {
  border: 1.5px solid var(--border);
  border-radius: 9px;
  padding: 10px 13px;
  font-family: inherit;
  font-size: .86rem;
  color: var(--g900);
  background: #fff;
  transition: border-color .18s;
  outline: none;
}
.fi:focus, .fsel:focus, .fta:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(41,82,217,.08); }
.fta { resize: vertical; min-height: 110px; }

/* Career form apply modal */
.carl { display: flex; flex-direction: column; gap: 10px; }

/* Accessibility improvements for Core Web Vitals */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}


*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:#fff;color:#111827;font-family:'Plus Jakarta Sans',sans-serif;overflow-x:hidden;cursor:default;}
a{text-decoration:none;color:inherit;}
ul{list-style:none;}
button{border:none;background:none;font-family:inherit;cursor:pointer;}
img{max-width:100%;}

:root{
  --blue:#2952d9;--blue-d:#1a3abf;--blue-l:#4a6ff5;--blue-xl:#7b97ff;
  --blue-pale:#eef1fd;--blue-pale2:#dde3fb;
  --steel:#3d4f6b;--steel-d:#252f40;
  --g50:#f6f7f9;--g100:#edf0f5;--g200:#d8dde8;--g300:#b0bac9;--g400:#8593a8;--g500:#5c6b82;--g700:#2d3a4e;--g900:#111827;
  --border:#e5e9f2;
  --sh:0 4px 16px rgba(41,82,217,.09),0 2px 6px rgba(0,0,0,.04);
  --shl:0 12px 40px rgba(41,82,217,.13),0 4px 14px rgba(0,0,0,.06);
  --shxl:0 24px 60px rgba(41,82,217,.15),0 8px 22px rgba(0,0,0,.07);
}


/* ─── NAVBAR ─── */
#nav{position:fixed;top:0;left:0;right:0;z-index:800;height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 44px;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border-bottom:1px solid transparent;transition:all .3s;}
#nav.scrolled{background:rgba(255,255,255,.98);border-bottom-color:var(--border);box-shadow:0 1px 14px rgba(41,82,217,.07);}

/* Logo */
.nav-logo{display:flex;align-items:center;gap:9px;cursor:pointer;}
.nlogo-img{width:32px;height:32px;object-fit:contain;}
.nlogo-wm{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1.25rem;letter-spacing:-.03em;}
.nlogo-wm .nx{color:var(--blue);}.nlogo-wm .cd{color:var(--steel-d);}

/* Nav menu */
.nav-menu{display:flex;align-items:center;gap:1px;}
.n-item{position:relative;}
.n-link{display:flex;align-items:center;gap:4px;padding:7px 12px;font-size:.81rem;font-weight:600;color:var(--g500);border-radius:8px;transition:all .2s;white-space:nowrap;cursor:pointer;}
.n-link:hover,.n-link.active-page{color:var(--blue);background:var(--blue-pale);}
.n-chev{font-size:.52rem;transition:transform .22s;color:var(--g300);}
.n-item:hover .n-chev{transform:rotate(180deg);}

/* ─── MEGA DROPDOWN ─── */
.mdrop{
  position:absolute;top:calc(100% + 10px);left:50%;
  transform:translateX(-50%) translateY(-10px);
  background:#fff;border:1px solid var(--border);border-radius:18px;
  opacity:0;pointer-events:none;
  transition:all .24s cubic-bezier(.16,1,.3,1);
  box-shadow:var(--shxl);overflow:hidden;
  min-width:720px;
}
.n-item:hover .mdrop{opacity:1;pointer-events:all;transform:translateX(-50%) translateY(0);}
.mdrop.left-align{left:0;transform:translateX(0) translateY(-10px);}
.n-item:hover .mdrop.left-align{transform:translateX(0) translateY(0);}

/* Mega dropdown with left sidebar */
.mdrop-inner{display:flex;}
.mdrop-sidebar{width:200px;flex-shrink:0;background:var(--g50);padding:12px 8px;border-right:1px solid var(--border);}
.mds-label{font-size:.58rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--g400);padding:8px 10px 6px;margin-top:4px;}
.mds-label:first-child{margin-top:0;}
.mds-item{
  display:flex;align-items:center;gap:8px;padding:9px 11px;border-radius:9px;
  font-size:.78rem;font-weight:600;color:var(--g500);
  transition:all .18s;cursor:pointer;
}
.mds-item:hover,.mds-item.active{background:var(--blue-pale);color:var(--blue);}
.mds-item-ic{font-size:.9rem;width:20px;text-align:center;}

/* Mega dropdown content area */
.mdrop-content{flex:1;padding:12px;}
.mdc-grid{display:grid;gap:3px;}
.mdc-grid.c2{grid-template-columns:1fr 1fr;}
.mdc-grid.c3{grid-template-columns:1fr 1fr 1fr;}
.mdc-head{font-size:.58rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--g300);padding:8px 10px 5px;margin-bottom:2px;}
.mdi{
  display:flex;align-items:flex-start;gap:10px;padding:10px 11px;
  border-radius:10px;transition:background .18s;cursor:pointer;
}
.mdi:hover{background:var(--blue-pale);}
.mdi-ic{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.85rem;flex-shrink:0;}
.ib{background:var(--blue-pale);}.ig{background:#f0fdf4;}.ia{background:#fffbeb;}.is{background:#f0f5ff;}.ip{background:#fdf4ff;}.ir{background:#fff1f2;}
.mdi-t{font-size:.78rem;font-weight:700;color:var(--g900);margin-bottom:1px;}
.mdi-d{font-size:.67rem;color:var(--g400);line-height:1.35;}

/* Right-aligned dropdown (for Company) */
.mdrop.right{left:auto;right:0;transform:translateX(0) translateY(-10px);}
.n-item:hover .mdrop.right{transform:translateX(0) translateY(0);}

/* Nav right */
.nav-r{display:flex;align-items:center;gap:9px;}
.btn-ghost{padding:7px 16px;font-size:.8rem;font-weight:600;color:var(--g700);border:1.5px solid var(--border);border-radius:8px;transition:all .2s;cursor:pointer;}
.btn-ghost:hover{border-color:var(--blue);color:var(--blue);}
.btn-cta{padding:8px 20px;font-size:.8rem;font-weight:700;background:var(--blue);color:#fff;border-radius:8px;transition:all .22s;display:flex;align-items:center;gap:5px;box-shadow:0 2px 10px rgba(41,82,217,.28);cursor:pointer;}
.btn-cta:hover{background:var(--blue-d);transform:translateY(-1px);box-shadow:0 5px 18px rgba(41,82,217,.34);}

/* Hamburger */
.nav-ham{display:none;flex-direction:column;gap:5px;padding:8px;cursor:pointer;}
.nav-ham span{display:block;width:20px;height:2px;background:var(--g700);border-radius:2px;transition:all .3s;}

/* ─── PAGE SYSTEM ─── */
.page{display:none;min-height:100vh;padding-top:68px;}
.page.active{display:block;}

/* ─── UTILITIES ─── */
.sec{padding:88px 44px;}.sec-sm{padding:52px 44px;}
.con{max-width:1160px;margin:0 auto;}
.tc{text-align:center;}.mx{margin-left:auto;margin-right:auto;}.mb40{margin-bottom:40px;}.mb32{margin-bottom:32px;}.mt16{margin-top:16px;}.mt24{margin-top:24px;}.lead{font-size:.96rem;line-height:1.78;color:var(--g500);}.m600{max-width:600px;}
.m600{max-width:600px;}.m720{max-width:720px;}
.mt8{margin-top:8px;}.mt16{margin-top:16px;}.mt24{margin-top:24px;}.mt40{margin-top:40px;}.mt52{margin-top:52px;}
.mb16{margin-bottom:16px;}.mb24{margin-bottom:24px;}.mb40{margin-bottom:40px;}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}

/* Eyebrow */
.ew{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;background:var(--blue-pale);border:1px solid var(--blue-pale2);border-radius:100px;font-size:.64rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-bottom:14px;}
.ew::before{content:'';width:5px;height:5px;background:var(--blue);border-radius:50%;}

/* Headings */
.h1{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(2.8rem,6vw,6rem);font-weight:800;line-height:.95;letter-spacing:-.04em;}
.h2{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(1.8rem,3.2vw,3rem);font-weight:700;line-height:1.05;letter-spacing:-.03em;}
.h3{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(1.1rem,1.8vw,1.5rem);font-weight:700;line-height:1.2;letter-spacing:-.02em;}
.lead{font-size:.97rem;line-height:1.75;color:var(--g500);}
.tg{background:linear-gradient(135deg,var(--blue) 0%,var(--blue-l) 60%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.tgs{background:linear-gradient(135deg,var(--blue) 30%,var(--steel) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:7px;padding:11px 22px;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:.84rem;border-radius:9px;transition:all .22s;letter-spacing:.01em;cursor:pointer;}
.btn-p{background:var(--blue);color:#fff;box-shadow:0 2px 12px rgba(41,82,217,.26);}
.btn-p:hover{background:var(--blue-d);transform:translateY(-2px);box-shadow:0 7px 24px rgba(41,82,217,.34);}
.btn-o{background:#fff;color:var(--blue);border:1.5px solid var(--blue);}
.btn-o:hover{background:var(--blue-pale);transform:translateY(-1px);}
.btn-g{background:var(--g50);color:var(--g700);border:1.5px solid var(--border);}
.btn-g:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-pale);}
.btn-w{background:#fff;color:var(--blue);}
.btn-w:hover{background:var(--blue-pale);transform:translateY(-2px);}
.btn-wo{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.45);}
.btn-wo:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.8);}
.btn-lg{padding:14px 30px;font-size:.92rem;}
.btn-sm{padding:7px 15px;font-size:.76rem;}

/* Card */
.card{background:#fff;border:1px solid var(--border);border-radius:15px;padding:24px;transition:all .28s;position:relative;overflow:hidden;}
.card:hover{border-color:var(--blue-pale2);box-shadow:var(--shl);transform:translateY(-3px);}
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--blue),var(--blue-l));opacity:0;transition:opacity .28s;}
.card:hover::before{opacity:1;}

/* Reveal */
/* Reveal: visible by default, JS adds io-ready to body to enable animation */
.rv,.rl,.rr{opacity:1;transform:none;}
body.io-ready .rv{opacity:0;transform:translateY(24px);transition:opacity .58s ease,transform .58s ease;}
body.io-ready .rv.v{opacity:1;transform:none;}
body.io-ready .rl{opacity:0;transform:translateX(-24px);transition:opacity .58s ease,transform .58s ease;}
body.io-ready .rl.v{opacity:1;transform:none;}
body.io-ready .rr{opacity:0;transform:translateX(24px);transition:opacity .58s ease,transform .58s ease;}
body.io-ready .rr.v{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){
  body.io-ready .rv,body.io-ready .rl,body.io-ready .rr{opacity:1!important;transform:none!important;transition:none!important;}
}
.d1{transition-delay:.07s;}.d2{transition-delay:.14s;}.d3{transition-delay:.21s;}.d4{transition-delay:.28s;}.d5{transition-delay:.35s;}

/* ─── PAGE HERO ─── */
.phero{
  padding:100px 44px 64px;
  background:linear-gradient(158deg,#fff 0%,var(--blue-pale) 55%,#fff 100%);
  border-bottom:1px solid var(--border);
  text-align:center;position:relative;overflow:hidden;
}
.phero-dots{position:absolute;inset:0;background-image:radial-gradient(circle,var(--blue-pale2) 1px,transparent 1px);background-size:32px 32px;pointer-events:none;opacity:.5;}
.phero .h1{max-width:800px;margin:0 auto 16px;}
.phero .lead{max-width:520px;margin:0 auto;}
.breadcrumb{display:flex;align-items:center;gap:6px;justify-content:center;margin-bottom:16px;}
.breadcrumb a{font-size:.7rem;color:var(--g400);transition:color .2s;cursor:pointer;}
.breadcrumb a:hover{color:var(--blue);}
.breadcrumb .sep{font-size:.7rem;color:var(--g300);}
.breadcrumb 

/* ─── CTA BANNER ─── */
.cta-ban{
  margin:0 44px 80px;
  background:linear-gradient(135deg,var(--blue) 0%,var(--blue-d) 45%,var(--steel-d) 100%);
  border-radius:20px;padding:64px 56px;text-align:center;position:relative;overflow:hidden;
}
.cta-ban::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.05) 1px,transparent 1px);background-size:28px 28px;pointer-events:none;}
.cta-ban .h2{color:#fff;max-width:540px;margin:0 auto 12px;}
.cta-ban .lead{color:rgba(255,255,255,.68);max-width:420px;margin:0 auto 34px;}
.cta-acts{display:flex;justify-content:center;gap:11px;flex-wrap:wrap;position:relative;z-index:1;}

/* ─── HOME HERO ─── */
#hhero{
  min-height:calc(100vh - 68px);display:flex;align-items:center;
  padding:60px 44px 60px;position:relative;overflow:hidden;
}
.hbg{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 620px 480px at 76% 40%,rgba(41,82,217,.06) 0%,transparent 70%),
             radial-gradient(ellipse 360px 360px at 10% 80%,rgba(41,82,217,.04) 0%,transparent 70%);}
.hdots{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle,var(--g200) 1px,transparent 1px);background-size:38px 38px;opacity:.45;}
.hshape{position:absolute;right:-70px;top:50%;transform:translateY(-50%);width:520px;height:520px;pointer-events:none;
  background:linear-gradient(135deg,rgba(41,82,217,.07),rgba(61,79,107,.04));
  clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);
  animation:hspin 22s linear infinite;}
.hshape2{position:absolute;right:56px;top:50%;transform:translateY(-50%);width:400px;height:400px;pointer-events:none;
  background:linear-gradient(135deg,rgba(41,82,217,.05),rgba(41,82,217,.10));
  clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);
  animation:hspin 15s linear infinite reverse;}
@keyframes hspin{to{transform:translateY(-50%) rotate(360deg);}}
.hin{position:relative;z-index:2;max-width:1160px;margin:0 auto;width:100%;}
.hbadge{display:inline-flex;align-items:center;gap:7px;padding:6px 14px;background:#fff;border:1.5px solid var(--border);border-radius:100px;font-size:.7rem;font-weight:700;color:var(--g500);margin-bottom:24px;box-shadow:0 1px 6px rgba(41,82,217,.06);animation:fdown .7s ease forwards;}
.hlive{width:6px;height:6px;background:#22c55e;border-radius:50%;animation:blink 2s infinite;}
@keyframes blink{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(34,197,94,.4);}50%{opacity:.6;box-shadow:0 0 0 4px rgba(34,197,94,0);}}
@keyframes fdown{from{opacity:0;transform:translateY(-14px);}to{opacity:1;transform:none;}}
@keyframes fup{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:none;}}
.htitle{margin-bottom:20px;animation:fup .7s .14s ease both;max-width:730px;}
.hsub{font-size:1.02rem;line-height:1.75;color:var(--g500);max-width:490px;margin-bottom:38px;animation:fup .7s .27s ease both;}
.hacts{display:flex;gap:11px;flex-wrap:wrap;animation:fup .7s .40s ease both;margin-bottom:60px;}
.hstats{display:flex;border:1px solid var(--border);border-radius:13px;overflow:hidden;background:#fff;box-shadow:var(--sh);animation:fup .7s .53s ease both;width:fit-content;}
.hstat{padding:17px 30px;border-right:1px solid var(--border);}
.hstat:last-child{border-right:none;}
.hs-n{font-family:'Bricolage Grotesque',sans-serif;font-size:1.8rem;font-weight:800;color:var(--blue);letter-spacing:-.03em;line-height:1;}
.hs-l{font-size:.68rem;color:var(--g400);margin-top:2px;}
/* Float cards */
.hfloats{position:absolute;right:44px;top:50%;transform:translateY(-50%);z-index:3;display:flex;flex-direction:column;gap:12px;animation:fup .7s .66s ease both;}
.hfc{background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px 19px;box-shadow:var(--shl);min-width:214px;}
.hfc:nth-child(2){margin-left:18px;}
.hfa{animation:fca 5s ease-in-out infinite;}
.hfb{animation:fca 5s ease-in-out 2.5s infinite;}
@keyframes fca{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
.hfl{font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--g400);margin-bottom:5px;}
.hfv{font-family:'Bricolage Grotesque',sans-serif;font-size:1.35rem;font-weight:800;color:var(--g900);letter-spacing:-.02em;line-height:1;}
.hfs{font-size:.66rem;color:var(--blue);font-weight:600;margin-top:3px;}
.hfbar{height:4px;background:var(--g100);border-radius:4px;margin-top:8px;overflow:hidden;}
.hfbf{height:100%;border-radius:4px;background:linear-gradient(90deg,var(--blue),var(--blue-l));}

/* ─── CLIENTS STRIP ─── */
.cls{padding:26px 44px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--g50);overflow:hidden;}
.cls-lbl{font-size:.63rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--g300);margin-bottom:16px;text-align:center;}
.cls-scroll{display:flex;gap:50px;animation:cscroll 24s linear infinite;width:max-content;}
.cl-name{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:.9rem;color:var(--g300);white-space:nowrap;transition:color .2s;}
.cl-name:hover{color:var(--blue);}
@keyframes cscroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ─── SERVICE GRID ─── */
.sg{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:44px;}
.shc{background:#fff;border:1px solid var(--border);border-radius:14px;padding:24px;transition:all .28s;position:relative;overflow:hidden;}
.shc::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--blue),var(--blue-l));transform:scaleX(0);transform-origin:left;transition:transform .3s;}
.shc:hover{border-color:var(--blue-pale2);box-shadow:var(--shl);transform:translateY(-3px);}
.shc:hover::after{transform:scaleX(1);}
.shc-ic{width:44px;height:44px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:14px;}
.shc-t{font-family:'Bricolage Grotesque',sans-serif;font-size:.97rem;font-weight:700;margin-bottom:8px;}
.shc-d{font-size:.78rem;line-height:1.7;color:var(--g500);margin-bottom:14px;}
.chip{padding:3px 8px;background:var(--g50);border:1px solid var(--border);border-radius:100px;font-size:.59rem;font-weight:600;color:var(--g500);}
.chipb{background:var(--blue-pale);border-color:var(--blue-pale2);color:var(--blue);}
.shc-lk{display:inline-flex;align-items:center;gap:4px;font-size:.75rem;font-weight:700;color:var(--blue);margin-top:12px;transition:gap .2s;}
.shc-lk:hover{gap:8px;}

/* ─── WHY GRID ─── */
.why{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;border-radius:16px;overflow:hidden;border:1px solid var(--border);}
.wi{background:#fff;padding:36px 32px;transition:background .25s;}
.wi:hover{background:var(--blue-pale);}
.wi-n{font-family:'JetBrains Mono',monospace;font-size:.66rem;color:var(--blue);margin-bottom:11px;letter-spacing:.1em;}
.wi-t{font-family:'Bricolage Grotesque',sans-serif;font-size:1rem;font-weight:700;margin-bottom:8px;}
.wi-d{font-size:.78rem;line-height:1.7;color:var(--g500);}

/* ─── PROCESS ─── */
.prow{display:grid;grid-template-columns:repeat(4,1fr);margin-top:52px;position:relative;}
.prow::before{content:'';position:absolute;top:20px;left:12.5%;right:12.5%;height:1px;background:linear-gradient(90deg,var(--blue),var(--blue-l),var(--steel),#aab4c8);}
.ps{padding:0 16px;text-align:center;}
.ps-dot{width:40px;height:40px;border-radius:50%;background:#fff;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;margin:0 auto 17px;position:relative;z-index:1;font-family:'JetBrains Mono',monospace;font-size:.68rem;color:var(--g400);transition:all .25s;box-shadow:var(--sh);}
.ps:hover .ps-dot{border-color:var(--blue);color:var(--blue);box-shadow:0 0 0 4px var(--blue-pale);}
.ps-t{font-family:'Bricolage Grotesque',sans-serif;font-size:.9rem;font-weight:700;margin-bottom:6px;}
.ps-d{font-size:.71rem;line-height:1.6;color:var(--g400);}

/* ─── TESTIMONIALS ─── */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:44px;}
.tc{background:#fff;border:1px solid var(--border);border-radius:14px;padding:24px;transition:all .25s;}
.tc:hover{border-color:var(--blue-pale2);box-shadow:var(--sh);}
.tc-s{color:#f59e0b;font-size:.78rem;letter-spacing:2px;margin-bottom:12px;}
.tc-tx{font-size:.81rem;line-height:1.8;color:var(--g500);font-style:italic;margin-bottom:18px;}
.tc-au{display:flex;align-items:center;gap:10px;}
.tc-av{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.78rem;color:#fff;flex-shrink:0;}
.tc-n{font-size:.8rem;font-weight:700;}
.tc-r{font-size:.67rem;color:var(--g400);}

/* ─── TECH GRID ─── */
.teg{display:grid;grid-template-columns:repeat(8,1fr);gap:9px;margin-top:36px;}
.ti{background:#fff;border:1px solid var(--border);border-radius:10px;padding:14px 8px;text-align:center;transition:all .22s;}
.ti:hover{border-color:var(--blue-pale2);box-shadow:var(--sh);transform:translateY(-2px);}
.ti-ic{font-size:1.2rem;margin-bottom:5px;}
.ti-n{font-size:.58rem;color:var(--g400);font-weight:600;}

/* ─── INDUSTRY GRID ─── */
.indg{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:44px;}
.indc{background:#fff;border:1px solid var(--border);border-radius:14px;padding:22px;text-align:center;transition:all .25s;cursor:pointer;}
.indc:hover{border-color:var(--blue-pale2);box-shadow:var(--shl);transform:translateY(-3px);}
.indc-ic{font-size:1.8rem;margin-bottom:10px;}
.indc-t{font-family:'Bricolage Grotesque',sans-serif;font-size:.88rem;font-weight:700;margin-bottom:5px;}
.indc-d{font-size:.7rem;color:var(--g400);line-height:1.5;}

/* ─── DETAIL PAGE ─── */
.detail-layout{display:grid;grid-template-columns:2fr 1fr;gap:44px;margin-top:44px;}
.detail-main{}.detail-side{}
.info-card{background:var(--g50);border:1px solid var(--border);border-radius:14px;padding:24px;margin-bottom:14px;}
.info-card-t{font-family:'Bricolage Grotesque',sans-serif;font-size:.93rem;font-weight:700;margin-bottom:14px;color:var(--g900);}
.feat-list{display:flex;flex-direction:column;gap:8px;}
.feat-li{display:flex;align-items:flex-start;gap:8px;font-size:.78rem;color:var(--g500);line-height:1.5;}
.feat-li::before{content:'✓';color:var(--blue);flex-shrink:0;font-weight:700;margin-top:1px;}
.tagcloud{display:flex;flex-wrap:wrap;gap:7px;}
.overview-boxes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:32px;}
.ob{background:var(--blue-pale);border:1px solid var(--blue-pale2);border-radius:12px;padding:18px;text-align:center;}
.ob-n{font-family:'Bricolage Grotesque',sans-serif;font-size:1.6rem;font-weight:800;color:var(--blue);letter-spacing:-.03em;line-height:1;}
.ob-l{font-size:.68rem;color:var(--blue-d);margin-top:3px;font-weight:500;}
.desc-body{font-size:.84rem;line-height:1.85;color:var(--g500);margin-bottom:24px;}
.what-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px;}
.wbox{background:var(--g50);border:1px solid var(--border);border-radius:12px;padding:18px;}
.wbox-ic{font-size:1.2rem;margin-bottom:8px;}
.wbox-t{font-family:'Bricolage Grotesque',sans-serif;font-size:.87rem;font-weight:700;margin-bottom:5px;}
.wbox-d{font-size:.75rem;line-height:1.6;color:var(--g500);}
.process-steps{display:flex;flex-direction:column;gap:0;margin-top:24px;}
.pstep{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--border);}
.pstep:last-child{border-bottom:none;}
.pstep-num{width:32px;height:32px;border-radius:50%;background:var(--blue-pale);display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',monospace;font-size:.7rem;color:var(--blue);flex-shrink:0;}
.pstep-t{font-family:'Bricolage Grotesque',sans-serif;font-size:.88rem;font-weight:700;margin-bottom:3px;}
.pstep-d{font-size:.74rem;line-height:1.6;color:var(--g500);}

/* ─── PRODUCTS ─── */
.prodg{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:44px;}
.prodc{background:#fff;border:1px solid var(--border);border-radius:17px;overflow:hidden;transition:all .28s;}
.prodc:hover{box-shadow:var(--shxl);transform:translateY(-3px);}
.prodv{height:180px;position:relative;}
.pv1{background:linear-gradient(135deg,#0f1f5c,#2952d9);}
.pv2{background:linear-gradient(135deg,#052e16,#16a34a);}
.pv3{background:linear-gradient(135deg,#451a03,#d97706);}
.pv4{background:linear-gradient(135deg,#2e1065,#7c3aed);}
.pr-bdge{position:absolute;top:12px;left:12px;padding:3px 10px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.25);border-radius:100px;font-size:.59rem;font-weight:700;color:#fff;backdrop-filter:blur(8px);}
.prod-bic{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:3rem;opacity:.6;}
.prod-body{padding:22px;}
.prod-n{font-family:'Bricolage Grotesque',sans-serif;font-size:1.1rem;font-weight:700;margin-bottom:5px;}
.prod-d{font-size:.77rem;line-height:1.7;color:var(--g500);margin-bottom:12px;}
.prod-ft{display:flex;justify-content:space-between;align-items:center;}
.prod-pr{font-family:'JetBrains Mono',monospace;font-size:.78rem;color:var(--blue);}

/* ─── PRICING ─── */
.prg{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:44px;}
.prc{background:#fff;border:1px solid var(--border);border-radius:17px;padding:32px 28px;position:relative;transition:all .28s;}
.prc.ft{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-pale2);}
.prc:hover{box-shadow:var(--shl);transform:translateY(-3px);}
.prc.ft:hover{box-shadow:0 0 0 3px var(--blue-pale2),var(--shl);}
.pr-bdg{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--blue);color:#fff;padding:3px 14px;border-radius:100px;font-size:.64rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;}
.pr-tier{font-size:.63rem;letter-spacing:.12em;text-transform:uppercase;color:var(--g400);font-weight:700;margin-bottom:4px;}
.pr-nm{font-family:'Bricolage Grotesque',sans-serif;font-size:1.2rem;font-weight:800;margin-bottom:18px;}
.pr-price{font-family:'Bricolage Grotesque',sans-serif;font-size:2.7rem;font-weight:800;letter-spacing:-.04em;line-height:1;margin-bottom:3px;}
.pr-price sub{font-size:.95rem;font-weight:500;vertical-align:baseline;}
.pr-per{font-size:.71rem;color:var(--g400);margin-bottom:24px;}
.pr-div{height:1px;background:var(--border);margin-bottom:20px;}
.pr-fs{margin-bottom:26px;}
.pr-fs li{display:flex;align-items:center;gap:7px;font-size:.77rem;padding:5px 0;color:var(--g500);}
.pr-fs li::before{content:'✓';color:var(--blue);flex-shrink:0;font-weight:700;}
.pr-fs li.off{color:var(--g300);}
.pr-fs li.off::before{content:'—';color:var(--g200);}

/* ─── TEAM ─── */
.tmg{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:44px;}
.tmc{background:#fff;border:1px solid var(--border);border-radius:14px;padding:22px;text-align:center;transition:all .25s;}
.tmc:hover{border-color:var(--blue-pale2);box-shadow:var(--sh);transform:translateY(-3px);}
.tm-av{width:60px;height:60px;border-radius:50%;margin:0 auto 11px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1rem;color:#fff;}
.tm-n{font-family:'Bricolage Grotesque',sans-serif;font-size:.9rem;font-weight:700;margin-bottom:2px;}
.tm-r{font-size:.63rem;color:var(--blue);font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:8px;}
.tm-b{font-size:.7rem;line-height:1.6;color:var(--g500);}

/* ─── BLOG ─── */
.blg{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:44px;}
.blc{background:#fff;border:1px solid var(--border);border-radius:15px;overflow:hidden;transition:all .28s;}
.blc:hover{box-shadow:var(--shl);transform:translateY(-3px);}
.blc:first-child{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;}
.blv{height:180px;position:relative;}
.blc:first-child .blv{height:auto;}
.bv1{background:linear-gradient(135deg,#0f1f5c,#2952d9);}
.bv2{background:linear-gradient(135deg,#064e3b,#059669);}
.bv3{background:linear-gradient(135deg,#4c0519,#e11d48);}
.bv4{background:linear-gradient(135deg,#2e1065,#7c3aed);}
.bv5{background:linear-gradient(135deg,#172554,#1d4ed8);}
.bl-pill{position:absolute;top:12px;left:12px;padding:3px 10px;border-radius:100px;font-size:.59rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.bl-body{padding:22px;}
.bl-meta{display:flex;gap:11px;margin-bottom:6px;}
.bl-date,.bl-rd{font-size:.66rem;color:var(--g400);}
.bl-t{font-family:'Bricolage Grotesque',sans-serif;font-size:1rem;font-weight:700;line-height:1.25;margin-bottom:7px;}
.blc:first-child .bl-t{font-size:1.25rem;}
.bl-ex{font-size:.76rem;line-height:1.7;color:var(--g500);margin-bottom:12px;}
.bl-lk{font-size:.74rem;font-weight:700;color:var(--blue);display:inline-flex;align-items:center;gap:4px;transition:gap .2s;}
.bl-lk:hover{gap:8px;}

/* ─── CAREERS ─── */
.carl{display:flex;flex-direction:column;gap:10px;margin-top:44px;}
.carr{background:#fff;border:1px solid var(--border);border-radius:12px;padding:20px 24px;display:flex;justify-content:space-between;align-items:center;gap:16px;transition:all .25s;}
.carr:hover{border-color:var(--blue-pale2);box-shadow:var(--sh);transform:translateX(4px);}
.cr-dept{font-size:.59rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-bottom:4px;}
.cr-t{font-family:'Bricolage Grotesque',sans-serif;font-size:.93rem;font-weight:700;}
.cr-tags{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap;}
.cr-tag{padding:2px 9px;border:1px solid var(--border);border-radius:100px;font-size:.6rem;color:var(--g500);}

/* ─── CONTACT ─── */
.cog{display:grid;grid-template-columns:1fr 1.5fr;gap:44px;margin-top:44px;}
.cic{background:#fff;border:1px solid var(--border);border-radius:12px;padding:18px;display:flex;gap:12px;align-items:flex-start;transition:all .22s;margin-bottom:12px;}
.cic:hover{border-color:var(--blue-pale2);box-shadow:var(--sh);}
.cic-ic{width:36px;height:36px;border-radius:9px;background:var(--blue-pale);display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0;}
.cic-l{font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--g400);margin-bottom:2px;}
.cic-v{font-size:.84rem;font-weight:700;}
.cic-s{font-size:.68rem;color:var(--g400);margin-top:1px;}
.cfm{background:#fff;border:1px solid var(--border);border-radius:17px;padding:36px;}
.fg{margin-bottom:14px;}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.fl{display:block;font-size:.68rem;font-weight:700;margin-bottom:5px;color:var(--g700);letter-spacing:.04em;}
.fi,.fsel,.fta{width:100%;background:var(--g50);border:1.5px solid var(--border);border-radius:8px;padding:9px 12px;font-family:'Plus Jakarta Sans',sans-serif;font-size:.83rem;color:var(--g900);outline:none;transition:border-color .2s,box-shadow .2s;}
.fi:focus,.fsel:focus,.fta:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(41,82,217,.09);}
.fta{resize:vertical;min-height:90px;}

/* ─── SUPPORT PAGE ─── */
.supp-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:44px;}
.supp-card{background:#fff;border:1px solid var(--border);border-radius:15px;padding:28px;transition:all .28s;}
.supp-card:hover{border-color:var(--blue-pale2);box-shadow:var(--shl);transform:translateY(-3px);}
.supp-ic{width:52px;height:52px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:16px;}
.supp-t{font-family:'Bricolage Grotesque',sans-serif;font-size:1.1rem;font-weight:700;margin-bottom:10px;}
.supp-d{font-size:.81rem;line-height:1.75;color:var(--g500);margin-bottom:18px;}
.sla-row{display:flex;gap:10px;margin-top:14px;}
.sla-box{flex:1;background:var(--g50);border:1px solid var(--border);border-radius:9px;padding:12px;text-align:center;}
.sla-n{font-family:'Bricolage Grotesque',sans-serif;font-size:1.2rem;font-weight:800;color:var(--blue);}
.sla-l{font-size:.62rem;color:var(--g400);margin-top:2px;}

/* ─── HIRE DETAIL ─── */
.hrc-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:24px;transition:all .28s;}
.hrc-card:hover{border-color:var(--blue-pale2);box-shadow:var(--shl);transform:translateY(-3px);}

/* ─── FOOTER ─── */
footer{background:var(--steel-d);padding:0 0 0;}
.flogo{display:flex;align-items:center;gap:8px;}
.flwm{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1.18rem;letter-spacing:-.03em;}
.flwm .nx{color:var(--blue);}.flwm .cd{color:#fff;}

/* ─── RESPONSIVE ─── */


/* ══════════════════════════════════════════════
   RESPONSIVE UTILITIES — mobile-first grid helpers
   ══════════════════════════════════════════════ */

/* Responsive containers for inline-style grids */
.rg2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.rg3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.rg4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.rg5{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;}
.rg2t{display:grid;grid-template-columns:1fr 360px;gap:60px;align-items:center;}
.rg2r{display:grid;grid-template-columns:1fr 400px;gap:60px;align-items:end;}
.rg2l{display:grid;grid-template-columns:280px 1fr;gap:60px;align-items:start;}

/* Premium card hover */
.pcard{background:#fff;border:1px solid var(--border);border-radius:16px;padding:24px;transition:all .28s;}
.pcard:hover{border-color:var(--blue-pale2);box-shadow:var(--shl);transform:translateY(-3px);}

/* Section inner max-widths */
.con{max-width:1160px;margin:0 auto;padding:0 44px;}
.con-sm{max-width:760px;margin:0 auto;padding:0 44px;}

/* Breadcrumb bar */
.bc-bar{background:#f8fafc;border-bottom:1px solid var(--border);padding:12px 44px;margin-top:68px;}
.bc-bar ol{display:flex;align-items:center;gap:6px;list-style:none;margin:0;padding:0;flex-wrap:wrap;}
.bc-bar li{font-size:.72rem;}
.bc-bar a{color:var(--g400);text-decoration:none;transition:color .2s;}
.bc-bar a:hover{color:var(--blue);}
.bc-bar .bc-cur{color:var(--blue);font-weight:600;}
.bc-bar .bc-sep{color:var(--g300);}

/* Mobile hamburger */
.nav-ham{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px;border:none;background:none;}
.nav-ham span{display:block;width:22px;height:2px;background:var(--g700);border-radius:2px;transition:all .3s;}

/* Stats strip responsive */
.stats-strip{background:linear-gradient(135deg,#252f40,#1a2a5c);}
.stats-grid{display:grid;max-width:1160px;margin:0 auto;}

/* Process step cards */
.proc-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:960px;margin:0 auto;}

/* Testimonial featured */
.test-feat{background:linear-gradient(135deg,#252f40,#1a2a5c);border-radius:18px;padding:36px;margin-bottom:14px;}
.test-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}

/* Tools/tech grid */
.tools-grid{display:grid;gap:10px;}

/* Portfolio grid */
.port-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}

/* Why grid */
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}

/* Pricing grid */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:start;}

/* Hero grids */
.hero-2col{display:grid;grid-template-columns:1fr 420px;gap:64px;align-items:end;}
.hero-2col-r{display:grid;grid-template-columns:1fr 360px;gap:60px;align-items:center;}

/* FAQ grid */
.faq-grid{display:grid;grid-template-columns:300px 1fr;gap:60px;align-items:start;}
.faq-sticky{position:sticky;top:88px;}

/* Form elements */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}

/* Image placeholder */
.img-ph{width:100%;border-radius:14px;background:linear-gradient(135deg,var(--g50),var(--blue-pale));
border:1px solid var(--border);display:flex;flex-direction:column;align-items:center;justify-content:center;
gap:10px;color:var(--g400);font-size:.72rem;font-weight:600;text-align:center;padding:32px;}

/* ══════════════════════════════════════════════
   PREMIUM ENHANCEMENTS
   ══════════════════════════════════════════════ */

/* Smooth scroll */
html{scroll-behavior:smooth;}

/* Better text rendering */
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}

/* Focus visible for accessibility */
a:focus-visible,button:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px;}

/* Premium section alternating */
.sec-alt{background:linear-gradient(180deg,#fafbff 0%,#fff 100%);}

/* Gradient text utility */
.tg-warm{background:linear-gradient(135deg,#f59e0b,#ef4444);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.tg-cool{background:linear-gradient(135deg,#06b6d4,#6366f1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}

/* Premium hover cards */
.card-hover{transition:all .28s;}
.card-hover:hover{transform:translateY(-4px);box-shadow:0 20px 60px rgba(41,82,217,.12);}

/* Number/metric display */
.metric-num{font-family:'Bricolage Grotesque',sans-serif;font-size:2.4rem;font-weight:800;letter-spacing:-.04em;color:var(--blue);}
.metric-label{font-size:.72rem;color:var(--g500);margin-top:2px;}

/* Tag pills */
.tag-pill{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:100px;font-size:.65rem;font-weight:600;}

/* CTA section */
.cta-section{background:linear-gradient(135deg,var(--blue),#4a6ff5);padding:72px 44px;text-align:center;position:relative;overflow:hidden;}
.cta-section::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.06) 1px,transparent 1px);background-size:28px 28px;pointer-events:none;}

/* Footer newsletter */
.nl-form{display:flex;gap:8px;max-width:360px;}
.nl-inp{flex:1;padding:10px 14px;border:1.5px solid rgba(255,255,255,.15);border-radius:9px;background:rgba(255,255,255,.08);color:#fff;font-size:.82rem;}
.nl-inp::placeholder{color:rgba(255,255,255,.4);}
.nl-inp:focus{outline:none;border-color:rgba(255,255,255,.4);}

/* Table responsive wrapper */
.tbl-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}

/* ══════════════════════════════════════════════
   BREAKPOINT: tablet (max-width: 1024px)
   ══════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════
   RESPONSIVE v2 — JS-injected class based approach
   100% reliable override of inline styles
   ═══════════════════════════════════════════════════════ */

/* ── Tablet: 1024px ── */
@media(max-width:1024px){
  .r-con{padding:0 24px!important;}
  .r-bc-bar{padding:10px 24px!important;}
  .r-g5{grid-template-columns:repeat(3,1fr)!important;}
  .r-g4{grid-template-columns:repeat(2,1fr)!important;}
  .r-hero{grid-template-columns:1fr 300px!important;gap:32px!important;}
  .r-sec-xl{padding:52px 24px!important;}
  .r-sec-hero{padding:28px 24px 48px!important;}
}

/* ── Mobile: 768px ── */
@media(max-width:768px){
  /* Nav */
  #nav{padding:0 16px!important;}
  .nav-menu,.nav-r{display:none!important;}
  .nav-ham{display:flex!important;}

  /* All container paddings */
  .r-con{padding:0 16px!important;}
  .r-bc-bar{margin-top:60px!important;padding:10px 16px!important;}
  .sec{padding:36px 0!important;}
  
  /* Hero grids → single column */
  .r-hero,.r-hero.r-flip{
    grid-template-columns:1fr!important;
    gap:20px!important;
  }
  /* Sidebar (faq) */
  .r-sidebar{
    grid-template-columns:1fr!important;
    gap:24px!important;
  }
  .r-sidebar [style*="position:sticky"]{
    position:relative!important;top:auto!important;
  }
  
  /* Card grids → 1 column */
  .r-g2,.r-g3,.r-g4,.r-g5{
    grid-template-columns:1fr!important;gap:12px!important;
  }
  /* Process grid */
  .r-proc{grid-template-columns:1fr!important;}

  /* Stats → 2 column */
  .r-stats-grid{grid-template-columns:1fr 1fr!important;}
  
  /* Footer */
  .r-footer-grid{grid-template-columns:1fr 1fr!important;gap:20px!important;}

  /* Section paddings */
  .r-sec-hero{padding:24px 16px 40px!important;}
  .r-sec-xl{padding:40px 16px!important;}
  .r-sec-lg{padding:32px 16px!important;}
  .r-sec-md{padding:24px 16px!important;}
  .r-sec-sm{padding:10px 16px!important;}

  /* Button groups */
  .r-btn-grp{flex-direction:column!important;gap:10px!important;}
  .r-btn-grp .btn,.r-btn-grp a{width:100%!important;justify-content:center!important;text-align:center!important;}

  /* phero */
  .phero{padding:80px 16px 48px!important;}
  .h1{font-size:2.2rem!important;letter-spacing:-.03em!important;}
  .h2{font-size:1.6rem!important;}
  .lead{font-size:.9rem!important;}
  
  /* Testimonial featured card */
  [style*="grid-template-columns:1fr auto;gap:28px"]{
    grid-template-columns:1fr!important;
  }
  [style*="text-align:right;flex-shrink:0"]{display:none!important;}

  /* CTA sections */
  [style*="padding:72px 44px;text-align:center"]{padding:40px 16px!important;}
  [style*="padding:60px 44px;text-align:center"]{padding:36px 16px!important;}
  
  /* Comparison table wrapper */
  .tbl-scroll{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;}
  
  /* Hide decorative elements */
  [style*="pointer-events:none"][style*="border-radius:50%"][style*="500px"],
  [style*="pointer-events:none"][style*="border-radius:50%"][style*="600px"],
  [style*="pointer-events:none"][style*="border-radius:50%"][style*="700px"]{
    display:none!important;
  }
  
  /* Mobile menu */
  #mobmenu{transform:translateX(100%);transition:transform .32s cubic-bezier(.4,0,.2,1);}
  #mobmenu.mob-open{transform:translateX(0)!important;}
  
  /* Blog category tabs */
  .blog-cats{flex-wrap:wrap!important;gap:6px!important;}
  .blog-cats button{font-size:.7rem!important;padding:5px 12px!important;}
}

/* ── Small mobile: 480px ── */
@media(max-width:480px){
  .h1{font-size:1.85rem!important;}
  .h2{font-size:1.35rem!important;}
  .r-stats-grid{grid-template-columns:1fr 1fr!important;}
  .r-g2{grid-template-columns:1fr!important;}
  .r-footer-grid{grid-template-columns:1fr!important;}
  
  /* Card padding reduce */
  [style*="padding:22px"]{padding:14px!important;}
  [style*="padding:24px"]{padding:16px!important;}
  [style*="padding:28px"]{padding:18px!important;}
  [style*="padding:36px"]{padding:20px!important;}
  
  /* Featured testimonial */
  [style*="background:linear-gradient(135deg,#252f40"][style*="padding:36px"]{
    padding:20px 14px!important;
  }
  
  .btn-lg{padding:11px 18px!important;font-size:.8rem!important;}
}

/* ── Extra small: 360px ── */  
@media(max-width:360px){
  .h1{font-size:1.6rem!important;}
  .r-stats-grid{grid-template-columns:1fr 1fr!important;}
  .bc-bar ol{gap:4px!important;}
}



/* ═══════════════════════════════════════ */


    /* ── UPWORK SECTION ── */
    .upwork-wrap{display:grid;grid-template-columns:340px 1fr;gap:28px;align-items:start;}
    /* Profile Card */
    .upw-card{
      background:#fff;border:1px solid var(--border);border-radius:20px;
      overflow:hidden;box-shadow:var(--shl);position:sticky;top:84px;
    }
    .upw-header{
      background:linear-gradient(135deg,#1d4354 0%,#14a800 100%);
      padding:28px 24px 20px;text-align:center;position:relative;
    }
    .upw-header::before{
      content:'';position:absolute;inset:0;
      background-image:radial-gradient(circle,rgba(255,255,255,.07) 1px,transparent 1px);
      background-size:22px 22px;pointer-events:none;
    }
    .upw-badge{
      display:inline-flex;align-items:center;gap:5px;
      background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);
      backdrop-filter:blur(8px);
      padding:3px 10px;border-radius:100px;
      font-size:.6rem;font-weight:700;color:#fff;letter-spacing:.08em;text-transform:uppercase;
      margin-bottom:14px;
    }
    .upw-badge-dot{width:6px;height:6px;background:#14a800;border-radius:50%;box-shadow:0 0 0 2px rgba(20,168,0,.35);}
    .upw-avatar{
      width:80px;height:80px;border-radius:50%;
      background:linear-gradient(135deg,#2952d9,#5b7fff);
      display:flex;align-items:center;justify-content:center;
      font-family:'Bricolage Grotesque',sans-serif;font-size:1.8rem;font-weight:800;color:#fff;
      margin:0 auto 10px;border:3px solid rgba(255,255,255,.4);
      box-shadow:0 4px 18px rgba(0,0,0,.25);
    }
    .upw-name{font-family:'Bricolage Grotesque',sans-serif;font-size:1.05rem;font-weight:800;color:#fff;margin-bottom:2px;}
    .upw-title{font-size:.72rem;color:rgba(255,255,255,.72);margin-bottom:0;}
    /* Upwork logo stripe */
    .upw-logo-bar{
      display:flex;align-items:center;justify-content:center;gap:7px;
      padding:9px 16px;background:#fff;border-bottom:1px solid var(--border);
    }
    .upw-logo-svg{display:flex;align-items:center;gap:5px;}
    .upw-logo-svg span{font-family:'Bricolage Grotesque',sans-serif;font-size:1rem;font-weight:800;color:#14a800;letter-spacing:-.02em;}
    .upw-verified{font-size:.6rem;font-weight:700;color:#14a800;background:#f0fdf4;border:1px solid #bbf7d0;padding:2px 8px;border-radius:100px;}
    /* Stats grid */
    .upw-stats{display:grid;grid-template-columns:1fr 1fr;gap:0;border-bottom:1px solid var(--border);}
    .upw-stat{padding:14px 16px;text-align:center;border-right:1px solid var(--border);}
    .upw-stat:nth-child(2n){border-right:none;}
    .upw-stat:nth-child(3),.upw-stat:nth-child(4){border-top:1px solid var(--border);}
    .upw-sn{font-family:'Bricolage Grotesque',sans-serif;font-size:1.25rem;font-weight:800;color:var(--g900);letter-spacing:-.03em;line-height:1;}
    .upw-sn.green{color:#14a800;}
    .upw-sl{font-size:.6rem;color:var(--g400);margin-top:2px;font-weight:500;}
    /* Skills */
    .upw-body{padding:16px 20px;}
    .upw-sec-t{font-size:.6rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--g400);margin-bottom:8px;}
    .upw-skills{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:14px;}
    .upw-sk{padding:3px 9px;background:var(--g50);border:1px solid var(--border);border-radius:100px;font-size:.62rem;color:var(--g600);font-weight:600;}
    /* Rate */
    .upw-rate-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-top:1px solid var(--border);margin-bottom:12px;}
    .upw-rate-l{font-size:.7rem;color:var(--g400);}
    .upw-rate-v{font-family:'Bricolage Grotesque',sans-serif;font-size:1.1rem;font-weight:800;color:var(--g900);}
    /* Hire Button */
    .btn-upwork{
      display:flex;align-items:center;justify-content:center;gap:9px;
      width:100%;padding:13px 20px;
      background:linear-gradient(135deg,#14a800,#0d8a00);
      color:#fff;border-radius:10px;font-family:'Plus Jakarta Sans',sans-serif;
      font-size:.88rem;font-weight:700;letter-spacing:.01em;
      transition:all .24s;box-shadow:0 3px 14px rgba(20,168,0,.32);cursor:pointer;
      border:none;text-decoration:none;
    }
    .btn-upwork:hover{background:linear-gradient(135deg,#0d8a00,#0a7000);transform:translateY(-2px);box-shadow:0 7px 22px rgba(20,168,0,.38);}
    .btn-upwork:active{transform:translateY(0);}
    .upw-ic{width:20px;height:20px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
    .upw-ic svg{width:12px;height:12px;}
    .upw-view{display:block;text-align:center;font-size:.68rem;color:var(--g400);margin-top:8px;transition:color .2s;cursor:pointer;}
    .upw-view:hover{color:#14a800;}
    /* Availability pill */
    .upw-avail{display:flex;align-items:center;gap:6px;padding:7px 12px;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;margin-bottom:12px;}
    .upw-avail-dot{width:7px;height:7px;background:#14a800;border-radius:50%;flex-shrink:0;animation:upw-blink 2s infinite;}
    @keyframes upw-blink{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(20,168,0,.4);}50%{opacity:.7;box-shadow:0 0 0 4px rgba(20,168,0,0);}}
    .upw-avail-t{font-size:.68rem;color:#166534;font-weight:600;}

    /* Reviews side */
    .reviews-side{}
    .rev-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:12px;}
    .rev-score{display:flex;align-items:center;gap:14px;}
    .rev-big-score{font-family:'Bricolage Grotesque',sans-serif;font-size:3.2rem;font-weight:800;color:var(--g900);line-height:1;letter-spacing:-.04em;}
    .rev-stars-col{display:flex;flex-direction:column;gap:2px;}
    .rev-stars{color:#14a800;font-size:1rem;letter-spacing:1px;}
    .rev-count{font-size:.7rem;color:var(--g400);}
    .rev-bars{display:flex;flex-direction:column;gap:5px;min-width:160px;}
    .rev-bar-row{display:flex;align-items:center;gap:7px;}
    .rev-bar-lbl{font-size:.62rem;color:var(--g400);width:30px;text-align:right;}
    .rev-bar-track{flex:1;height:5px;background:var(--g100);border-radius:5px;overflow:hidden;}
    .rev-bar-fill{height:100%;border-radius:5px;background:#14a800;}
    .rev-bar-n{font-size:.6rem;color:var(--g400);width:16px;}

    /* Review cards */
    .rev-list{display:flex;flex-direction:column;gap:12px;}
    .rev-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px 22px;transition:all .25s;}
    .rev-card:hover{border-color:#bbf7d0;box-shadow:0 6px 22px rgba(20,168,0,.08);transform:translateY(-2px);}
    .rev-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px;}
    .rev-client{display:flex;align-items:center;gap:10px;}
    .rev-av{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.78rem;color:#fff;flex-shrink:0;}
    .rev-cn{font-size:.82rem;font-weight:700;color:var(--g900);}
    .rev-ct{font-size:.64rem;color:var(--g400);margin-top:1px;}
    .rev-meta{text-align:right;flex-shrink:0;}
    .rev-ms{color:#14a800;font-size:.75rem;letter-spacing:1px;}
    .rev-date{font-size:.62rem;color:var(--g400);margin-top:2px;}
    .rev-tx{font-size:.8rem;line-height:1.75;color:var(--g500);font-style:italic;margin-bottom:12px;}
    .rev-tx::before{content:'"';font-size:1.2rem;color:#14a800;font-style:normal;line-height:0;vertical-align:-.15em;margin-right:1px;}
    .rev-tx::after{content:'"';font-size:1.2rem;color:#14a800;font-style:normal;line-height:0;vertical-align:-.15em;margin-left:1px;}
    .rev-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
    .rev-project{font-size:.62rem;font-weight:600;color:var(--blue);background:var(--blue-pale);border:1px solid var(--blue-pale2);padding:2px 9px;border-radius:100px;}
    .rev-earned{font-size:.62rem;color:var(--g400);}
    .rev-upw-badge{display:flex;align-items:center;gap:4px;font-size:.6rem;font-weight:600;color:#14a800;background:#f0fdf4;border:1px solid #bbf7d0;padding:2px 8px;border-radius:100px;margin-left:auto;}

    /* "View all on Upwork" strip */
    .upw-view-all{
      display:flex;align-items:center;justify-content:center;gap:9px;
      padding:14px 20px;background:#fff;border:1.5px solid #14a800;
      border-radius:12px;transition:all .22s;cursor:pointer;margin-top:12px;
      text-decoration:none;
    }
    .upw-view-all:hover{background:#f0fdf4;transform:translateY(-1px);box-shadow:0 4px 16px rgba(20,168,0,.12);}
    .upw-view-all span{font-size:.82rem;font-weight:700;color:#14a800;}

    @media(max-width:900px){
      .upwork-wrap{grid-template-columns:1fr;}
      .upw-card{position:static;}
    }
    

/* ═══════════════════════════════════════ */


    /* ── BLOG INSIGHTS ── */
    .blog-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:16px;margin-top:44px;}
    .blog-main{display:flex;flex-direction:column;gap:14px;}
    .blog-side{display:flex;flex-direction:column;gap:10px;}

    /* Big featured post */
    .bp-featured{background:#fff;border:1px solid var(--border);border-radius:18px;overflow:hidden;transition:all .3s;}
    .bp-featured:hover{box-shadow:var(--shxl);transform:translateY(-3px);}
    .bp-featured:hover .bp-vis-bg{transform:scale(1.04);}
    .bp-vis{height:220px;position:relative;overflow:hidden;}
    .bp-vis-bg{position:absolute;inset:0;transition:transform .5s ease;}
    .bp-vis-overlay{position:absolute;inset:0;}
    .bp-vis-pill{position:absolute;top:14px;left:14px;padding:4px 12px;border-radius:100px;font-size:.59rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;backdrop-filter:blur(8px);}
    .bp-vis-read{position:absolute;top:14px;right:14px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(8px);padding:3px 10px;border-radius:100px;font-size:.58rem;color:#fff;}
    .bp-body{padding:22px 24px;}
    .bp-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
    .bp-date{font-size:.65rem;color:var(--g400);}
    .bp-sep{width:3px;height:3px;background:var(--g300);border-radius:50%;}
    .bp-auth{display:flex;align-items:center;gap:5px;font-size:.65rem;color:var(--g400);}
    .bp-auth-av{width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,var(--blue),#5b7fff);display:flex;align-items:center;justify-content:center;font-size:.45rem;font-weight:800;color:#fff;}
    .bp-t{font-family:'Bricolage Grotesque',sans-serif;font-size:1.15rem;font-weight:800;line-height:1.2;letter-spacing:-.02em;margin-bottom:9px;}
    .bp-ex{font-size:.78rem;line-height:1.75;color:var(--g500);margin-bottom:14px;}
    .bp-foot{display:flex;align-items:center;justify-content:space-between;}
    .bp-tags{display:flex;gap:5px;flex-wrap:wrap;}
    .bp-tag{padding:2px 9px;background:var(--blue-pale);border:1px solid var(--blue-pale2);border-radius:100px;font-size:.58rem;font-weight:600;color:var(--blue);}
    .bp-lk{font-size:.74rem;font-weight:700;color:var(--blue);display:inline-flex;align-items:center;gap:4px;transition:gap .2s;white-space:nowrap;}
    .bp-lk:hover{gap:8px;}

    /* Medium post (2nd main slot) */
    .bp-med{background:#fff;border:1px solid var(--border);border-radius:14px;display:grid;grid-template-columns:140px 1fr;overflow:hidden;transition:all .28s;}
    .bp-med:hover{box-shadow:var(--shl);transform:translateY(-2px);}
    .bp-med:hover .bp-vis-bg{transform:scale(1.05);}
    .bp-med .bp-vis{height:auto;min-height:120px;}
    .bp-med .bp-body{padding:16px 18px;}
    .bp-med .bp-t{font-size:.93rem;margin-bottom:6px;}
    .bp-med .bp-ex{font-size:.73rem;margin-bottom:10px;}

    /* Side list posts */
    .bp-list{background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px;transition:all .22s;display:flex;gap:12px;align-items:flex-start;}
    .bp-list:hover{border-color:var(--blue-pale2);box-shadow:var(--sh);transform:translateX(3px);}
    .bp-list-num{font-family:'JetBrains Mono',monospace;font-size:1.3rem;font-weight:700;color:var(--g200);line-height:1;flex-shrink:0;width:28px;text-align:right;}
    .bp-list-body{}
    .bp-list-cat{font-size:.57rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:3px;}
    .bp-list-t{font-family:'Bricolage Grotesque',sans-serif;font-size:.82rem;font-weight:700;line-height:1.3;margin-bottom:4px;}
    .bp-list-meta{font-size:.63rem;color:var(--g400);}

    /* Newsletter strip */
    .blog-nl{background:linear-gradient(135deg,var(--blue-pale) 0%,#fff 100%);border:1px solid var(--blue-pale2);border-radius:16px;padding:24px 28px;display:flex;align-items:center;gap:20px;margin-top:14px;flex-wrap:wrap;}
    .blog-nl-t{font-family:'Bricolage Grotesque',sans-serif;font-size:1rem;font-weight:700;flex:1;min-width:200px;}
    .blog-nl-t span{color:var(--blue);}
    .blog-nl-form{display:flex;gap:8px;flex:2;min-width:260px;}
    .blog-nl-inp{flex:1;background:#fff;border:1.5px solid var(--border);border-radius:8px;padding:9px 13px;font-family:'Plus Jakarta Sans',sans-serif;font-size:.82rem;color:var(--g900);outline:none;transition:border-color .2s;}
    .blog-nl-inp:focus{border-color:var(--blue);}
    .blog-nl-btn{padding:9px 18px;background:var(--blue);color:#fff;border-radius:8px;font-family:'Plus Jakarta Sans',sans-serif;font-size:.8rem;font-weight:700;transition:all .2s;cursor:pointer;white-space:nowrap;}
    .blog-nl-btn:hover{background:var(--blue-d);}

    @media(max-width:900px){
      .blog-grid{grid-template-columns:1fr;}
      .bp-med{grid-template-columns:1fr;}
      .bp-med .bp-vis{height:160px;}
    }
    

/* ═══════════════════════════════════════ */


    /* ── CASE STUDIES ── */
    .cs-wrap{margin-top:52px;}
    .cs-featured{display:grid;grid-template-columns:1.1fr 1fr;gap:0;border-radius:20px;overflow:hidden;border:1px solid var(--border);box-shadow:var(--shl);margin-bottom:16px;background:#fff;}
    .cs-feat-visual{position:relative;min-height:340px;overflow:hidden;}
    .cs-feat-bg{position:absolute;inset:0;transition:transform .6s ease;}
    .cs-featured:hover .cs-feat-bg{transform:scale(1.03);}
    .cs-feat-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.55) 100%);}
    .cs-feat-tags{position:absolute;top:18px;left:18px;display:flex;gap:6px;}
    .cs-tag{padding:3px 11px;border-radius:100px;font-size:.58rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;backdrop-filter:blur(8px);}
    .cs-tag-ind{background:rgba(255,255,255,.18);color:#fff;border:1px solid rgba(255,255,255,.3);}
    .cs-tag-feat{background:rgba(41,82,217,.85);color:#fff;}
    .cs-feat-metrics{position:absolute;bottom:18px;left:18px;right:18px;display:flex;gap:8px;}
    .cs-met{background:rgba(255,255,255,.15);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:10px 13px;flex:1;text-align:center;}
    .cs-met-n{font-family:'Bricolage Grotesque',sans-serif;font-size:1.35rem;font-weight:800;color:#fff;line-height:1;}
    .cs-met-l{font-size:.56rem;color:rgba(255,255,255,.75);margin-top:2px;}
    .cs-feat-body{padding:36px 32px;display:flex;flex-direction:column;justify-content:center;}
    .cs-feat-industry{font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-bottom:8px;}
    .cs-feat-t{font-family:'Bricolage Grotesque',sans-serif;font-size:1.45rem;font-weight:800;line-height:1.15;letter-spacing:-.025em;margin-bottom:12px;}
    .cs-feat-d{font-size:.82rem;line-height:1.78;color:var(--g500);margin-bottom:22px;}
    .cs-challenge{background:var(--g50);border:1px solid var(--border);border-radius:10px;padding:14px 16px;margin-bottom:18px;}
    .cs-ch-lbl{font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--g400);margin-bottom:5px;}
    .cs-ch-list{display:flex;flex-direction:column;gap:4px;}
    .cs-ch-li{display:flex;align-items:center;gap:7px;font-size:.74rem;color:var(--g600);}
    .cs-ch-li::before{content:'→';color:var(--blue);flex-shrink:0;font-weight:700;}
    .cs-stack{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:20px;}
    .cs-sk{padding:3px 9px;background:var(--blue-pale);border:1px solid var(--blue-pale2);border-radius:100px;font-size:.6rem;font-weight:600;color:var(--blue);}

    /* Small case study grid */
    .cs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
    .cs-card{background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden;transition:all .28s;}
    .cs-card:hover{box-shadow:var(--shl);transform:translateY(-4px);}
    .cs-card:hover .cs-card-bg{transform:scale(1.05);}
    .cs-visual{height:150px;position:relative;overflow:hidden;}
    .cs-card-bg{position:absolute;inset:0;transition:transform .5s ease;}
    .cs-card-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(0,0,0,.5) 100%);}
    .cs-card-tag{position:absolute;top:10px;left:10px;}
    .cs-card-kpis{position:absolute;bottom:10px;left:10px;right:10px;display:flex;gap:6px;}
    .cs-kpi{background:rgba(255,255,255,.14);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);border-radius:7px;padding:6px 9px;text-align:center;flex:1;}
    .cs-kpi-n{font-family:'Bricolage Grotesque',sans-serif;font-size:.95rem;font-weight:800;color:#fff;line-height:1;}
    .cs-kpi-l{font-size:.5rem;color:rgba(255,255,255,.7);margin-top:1px;}
    .cs-body{padding:16px 18px;}
    .cs-ind{font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:4px;}
    .cs-t{font-family:'Bricolage Grotesque',sans-serif;font-size:.9rem;font-weight:700;line-height:1.25;margin-bottom:7px;}
    .cs-d{font-size:.73rem;line-height:1.65;color:var(--g500);margin-bottom:10px;}
    .cs-lk{display:inline-flex;align-items:center;gap:4px;font-size:.72rem;font-weight:700;color:var(--blue);transition:gap .2s;}
    .cs-lk:hover{gap:8px;}
    @media(max-width:900px){
      .cs-featured{grid-template-columns:1fr;}
      .cs-feat-visual{min-height:220px;}
      .cs-grid{grid-template-columns:1fr 1fr;}
    }
    @media(max-width:600px){.cs-grid{grid-template-columns:1fr;}}
    

/* ═══════════════════════════════════════ */


    /* ── FAQ ── */
    .faq-wrap{display:grid;grid-template-columns:320px 1fr;gap:52px;margin-top:52px;align-items:start;}
    .faq-left{}
    .faq-left .lead{margin-top:14px;margin-bottom:24px;}
    .faq-cats{display:flex;flex-direction:column;gap:5px;margin-bottom:28px;}
    .fq-cat{display:flex;align-items:center;gap:9px;padding:9px 13px;border-radius:9px;font-size:.78rem;font-weight:600;color:var(--g500);cursor:pointer;transition:all .18s;border:1px solid transparent;}
    .fq-cat:hover,.fq-cat.on{background:var(--blue-pale);color:var(--blue);border-color:var(--blue-pale2);}
    .fq-cat-ic{font-size:.9rem;width:22px;text-align:center;}
    .faq-cta-box{background:linear-gradient(135deg,var(--blue),var(--blue-d));border-radius:14px;padding:22px;text-align:center;}
    .faq-cta-box .h3{color:#fff;font-size:.95rem;margin-bottom:6px;}
    .faq-cta-box p{font-size:.73rem;color:rgba(255,255,255,.7);margin-bottom:14px;line-height:1.6;}

    .faq-right{}
    .faq-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:22px;}
    .fq-tab{padding:6px 14px;border-radius:8px;font-size:.74rem;font-weight:600;color:var(--g500);background:var(--g50);border:1.5px solid var(--border);cursor:pointer;transition:all .18s;}
    .fq-tab:hover,.fq-tab.on{background:var(--blue-pale);color:var(--blue);border-color:var(--blue-pale2);}

    /* Accordion */
    .faq-list{display:flex;flex-direction:column;gap:8px;}
    .fq-item{background:#fff;border:1.5px solid var(--border);border-radius:12px;overflow:hidden;transition:border-color .22s,box-shadow .22s;}
    .fq-item.open{border-color:var(--blue-pale2);box-shadow:0 4px 18px rgba(41,82,217,.07);}
    .fq-q{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 20px;cursor:pointer;user-select:none;}
    .fq-q:hover{background:var(--blue-pale);}
    .fq-item.open .fq-q{background:var(--blue-pale);}
    .fq-q-text{font-size:.85rem;font-weight:700;color:var(--g900);line-height:1.4;}
    .fq-icon{width:24px;height:24px;border-radius:50%;background:var(--g100);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.72rem;color:var(--g500);transition:all .24s;}
    .fq-item.open .fq-icon{background:var(--blue);color:#fff;transform:rotate(45deg);}
    .fq-a{max-height:0;overflow:hidden;transition:max-height .35s ease,padding .25s ease;}
    .fq-item.open .fq-a{max-height:400px;}
    .fq-a-inner{padding:0 20px 18px;font-size:.81rem;line-height:1.82;color:var(--g500);}
    .fq-a-inner strong{color:var(--g900);font-weight:700;}
    .fq-a-inner ul{margin:10px 0 0 0;padding:0;display:flex;flex-direction:column;gap:5px;}
    .fq-a-inner ul li{display:flex;align-items:flex-start;gap:7px;font-size:.78rem;}
    .fq-a-inner ul li::before{content:'✓';color:var(--blue);flex-shrink:0;font-weight:700;margin-top:1px;}

    @media(max-width:900px){
      .faq-wrap{grid-template-columns:1fr;}
    }
    

/* ═══════════════════════════════════════ */


  /* ─── Static-page overrides ─── */
  /* Reveal: hidden by default, shown by JS */
  .rv{opacity:0;transform:translateY(24px);transition:opacity .58s ease,transform .58s ease;}
  .rl{opacity:0;transform:translateX(-24px);transition:opacity .58s ease,transform .58s ease;}
  .rr{opacity:0;transform:translateX(24px);transition:opacity .58s ease,transform .58s ease;}
  .rv.v,.rl.v,.rr.v{opacity:1;transform:none;}
  /* Quote modal */
  .modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.52);z-index:10000;display:none;align-items:center;justify-content:center;padding:20px;}
  .modal-overlay.open{display:flex;}
  .modal-box{background:#fff;border-radius:18px;padding:36px;max-width:480px;width:100%;box-shadow:0 24px 80px rgba(0,0,0,.22);}
  

/* ══════════════════════════════════════════
   MOBILE MENU
══════════════════════════════════════════ */
.mob-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 13px 20px;
  font-size: .88rem;
  font-weight: 600;
  color: var(--g700);
  text-decoration: none;
  border-bottom: 1px solid var(--g100);
  transition: background .15s, color .15s;
}
.mob-link:hover { background: var(--blue-pale); color: var(--blue); }
.mob-link-main { color: var(--g900); font-weight: 700; font-size: .92rem; }
.mob-sub { padding-left: 44px; font-size: .82rem; font-weight: 500; color: var(--g500); }
.mob-icon { font-size: 1rem; width: 22px; flex-shrink: 0; text-align: center; }
.mob-section-head {
  padding: 14px 20px 7px;
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--g400);
  background: var(--g50);
  border-bottom: 1px solid var(--border);
  margin-top: 6px;
}

/* ══════════════════════════════════════════
   KEYWORD / INTERNAL LINK HIGHLIGHT
══════════════════════════════════════════ */
.kw-link {
  color: inherit;
  border-bottom: 1px dotted var(--blue);
  text-decoration: none;
  transition: color .18s, border-color .18s;
}
.kw-link:hover { color: var(--blue); border-bottom-style: solid; }

/* SEO internal link style */
.il {
  color: var(--blue);
  text-decoration: none;
  border-bottom: 1px solid var(--blue-pale2);
  transition: border-color .2s, color .2s;
}
.il:hover { border-bottom-color: var(--blue); }

/* ══════════════════════════════════════════
   FOOTER LINK STYLES
══════════════════════════════════════════ */
.footer-link {
  font-size: .78rem;
  color: rgba(255,255,255,.45);
  text-decoration: none;
  transition: color .18s;
  display: block;
  margin-bottom: 9px;
}
.footer-link:hover { color: #fff; }

/* ══════════════════════════════════════════
   UTILITY — ACTIVE NAV
══════════════════════════════════════════ */
/*.active-page { color: var(--blue) !important; font-weight: 700 !important; }*/


/* ── SECTION-SPECIFIC STYLES (from v3 inline blocks) ── */

/* ── UPWORK SECTION ── */
.upwork-wrap{display:grid;grid-template-columns:340px 1fr;gap:28px;align-items:start;}
/* Profile Card */
.upw-card{
  background:#fff;border:1px solid var(--border);border-radius:20px;
  overflow:hidden;box-shadow:var(--shl);position:sticky;top:84px;
}
.upw-header{
  background:linear-gradient(135deg,#1d4354 0%,#14a800 100%);
  padding:28px 24px 20px;text-align:center;position:relative;
}
.upw-header::before{
  content:'';position:absolute;inset:0;
  background-image:radial-gradient(circle,rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:22px 22px;pointer-events:none;
}
.upw-badge{
  display:inline-flex;align-items:center;gap:5px;
  background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);
  backdrop-filter:blur(8px);
  padding:3px 10px;border-radius:100px;
  font-size:.6rem;font-weight:700;color:#fff;letter-spacing:.08em;text-transform:uppercase;
  margin-bottom:14px;
}
.upw-badge-dot{width:6px;height:6px;background:#14a800;border-radius:50%;box-shadow:0 0 0 2px rgba(20,168,0,.35);}
.upw-avatar{
  width:80px;height:80px;border-radius:50%;
  background:linear-gradient(135deg,#2952d9,#5b7fff);
  display:flex;align-items:center;justify-content:center;
  font-family:'Bricolage Grotesque',sans-serif;font-size:1.8rem;font-weight:800;color:#fff;
  margin:0 auto 10px;border:3px solid rgba(255,255,255,.4);
  box-shadow:0 4px 18px rgba(0,0,0,.25);
}
.upw-name{font-family:'Bricolage Grotesque',sans-serif;font-size:1.05rem;font-weight:800;color:#fff;margin-bottom:2px;}
.upw-title{font-size:.72rem;color:rgba(255,255,255,.72);margin-bottom:0;}
/* Upwork logo stripe */
.upw-logo-bar{
  display:flex;align-items:center;justify-content:center;gap:7px;
  padding:9px 16px;background:#fff;border-bottom:1px solid var(--border);
}
.upw-logo-svg{display:flex;align-items:center;gap:5px;}
.upw-logo-svg span{font-family:'Bricolage Grotesque',sans-serif;font-size:1rem;font-weight:800;color:#14a800;letter-spacing:-.02em;}
.upw-verified{font-size:.6rem;font-weight:700;color:#14a800;background:#f0fdf4;border:1px solid #bbf7d0;padding:2px 8px;border-radius:100px;}
/* Stats grid */
.upw-stats{display:grid;grid-template-columns:1fr 1fr;gap:0;border-bottom:1px solid var(--border);}
.upw-stat{padding:14px 16px;text-align:center;border-right:1px solid var(--border);}
.upw-stat:nth-child(2n){border-right:none;}
.upw-stat:nth-child(3),.upw-stat:nth-child(4){border-top:1px solid var(--border);}
.upw-sn{font-family:'Bricolage Grotesque',sans-serif;font-size:1.25rem;font-weight:800;color:var(--g900);letter-spacing:-.03em;line-height:1;}
.upw-sn.green{color:#14a800;}
.upw-sl{font-size:.6rem;color:var(--g400);margin-top:2px;font-weight:500;}
/* Skills */
.upw-body{padding:16px 20px;}
.upw-sec-t{font-size:.6rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--g400);margin-bottom:8px;}
.upw-skills{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:14px;}
.upw-sk{padding:3px 9px;background:var(--g50);border:1px solid var(--border);border-radius:100px;font-size:.62rem;color:var(--g600);font-weight:600;}
/* Rate */
.upw-rate-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-top:1px solid var(--border);margin-bottom:12px;}
.upw-rate-l{font-size:.7rem;color:var(--g400);}
.upw-rate-v{font-family:'Bricolage Grotesque',sans-serif;font-size:1.1rem;font-weight:800;color:var(--g900);}
/* Hire Button */
.btn-upwork{
  display:flex;align-items:center;justify-content:center;gap:9px;
  width:100%;padding:13px 20px;
  background:linear-gradient(135deg,#14a800,#0d8a00);
  color:#fff;border-radius:10px;font-family:'Plus Jakarta Sans',sans-serif;
  font-size:.88rem;font-weight:700;letter-spacing:.01em;
  transition:all .24s;box-shadow:0 3px 14px rgba(20,168,0,.32);cursor:pointer;
  border:none;text-decoration:none;
}
.btn-upwork:hover{background:linear-gradient(135deg,#0d8a00,#0a7000);transform:translateY(-2px);box-shadow:0 7px 22px rgba(20,168,0,.38);}
.btn-upwork:active{transform:translateY(0);}
.upw-ic{width:20px;height:20px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.upw-ic svg{width:12px;height:12px;}
.upw-view{display:block;text-align:center;font-size:.68rem;color:var(--g400);margin-top:8px;transition:color .2s;cursor:pointer;}
.upw-view:hover{color:#14a800;}
/* Availability pill */
.upw-avail{display:flex;align-items:center;gap:6px;padding:7px 12px;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;margin-bottom:12px;}
.upw-avail-dot{width:7px;height:7px;background:#14a800;border-radius:50%;flex-shrink:0;animation:upw-blink 2s infinite;}
@keyframes upw-blink{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(20,168,0,.4);}50%{opacity:.7;box-shadow:0 0 0 4px rgba(20,168,0,0);}}
.upw-avail-t{font-size:.68rem;color:#166534;font-weight:600;}

/* Reviews side */
.reviews-side{}
.rev-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:12px;}
.rev-score{display:flex;align-items:center;gap:14px;}
.rev-big-score{font-family:'Bricolage Grotesque',sans-serif;font-size:3.2rem;font-weight:800;color:var(--g900);line-height:1;letter-spacing:-.04em;}
.rev-stars-col{display:flex;flex-direction:column;gap:2px;}
.rev-stars{color:#14a800;font-size:1rem;letter-spacing:1px;}
.rev-count{font-size:.7rem;color:var(--g400);}
.rev-bars{display:flex;flex-direction:column;gap:5px;min-width:160px;}
.rev-bar-row{display:flex;align-items:center;gap:7px;}
.rev-bar-lbl{font-size:.62rem;color:var(--g400);width:30px;text-align:right;}
.rev-bar-track{flex:1;height:5px;background:var(--g100);border-radius:5px;overflow:hidden;}
.rev-bar-fill{height:100%;border-radius:5px;background:#14a800;}
.rev-bar-n{font-size:.6rem;color:var(--g400);width:16px;}

/* Review cards */
.rev-list{display:flex;flex-direction:column;gap:12px;}
.rev-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px 22px;transition:all .25s;}
.rev-card:hover{border-color:#bbf7d0;box-shadow:0 6px 22px rgba(20,168,0,.08);transform:translateY(-2px);}
.rev-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px;}
.rev-client{display:flex;align-items:center;gap:10px;}
.rev-av{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.78rem;color:#fff;flex-shrink:0;}
.rev-cn{font-size:.82rem;font-weight:700;color:var(--g900);}
.rev-ct{font-size:.64rem;color:var(--g400);margin-top:1px;}
.rev-meta{text-align:right;flex-shrink:0;}
.rev-ms{color:#14a800;font-size:.75rem;letter-spacing:1px;}
.rev-date{font-size:.62rem;color:var(--g400);margin-top:2px;}
.rev-tx{font-size:.8rem;line-height:1.75;color:var(--g500);font-style:italic;margin-bottom:12px;}
.rev-tx::before{content:'"';font-size:1.2rem;color:#14a800;font-style:normal;line-height:0;vertical-align:-.15em;margin-right:1px;}
.rev-tx::after{content:'"';font-size:1.2rem;color:#14a800;font-style:normal;line-height:0;vertical-align:-.15em;margin-left:1px;}
.rev-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.rev-project{font-size:.62rem;font-weight:600;color:var(--blue);background:var(--blue-pale);border:1px solid var(--blue-pale2);padding:2px 9px;border-radius:100px;}
.rev-earned{font-size:.62rem;color:var(--g400);}
.rev-upw-badge{display:flex;align-items:center;gap:4px;font-size:.6rem;font-weight:600;color:#14a800;background:#f0fdf4;border:1px solid #bbf7d0;padding:2px 8px;border-radius:100px;margin-left:auto;}

/* "View all on Upwork" strip */
.upw-view-all{
  display:flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 20px;background:#fff;border:1.5px solid #14a800;
  border-radius:12px;transition:all .22s;cursor:pointer;margin-top:12px;
  text-decoration:none;
}
.upw-view-all:hover{background:#f0fdf4;transform:translateY(-1px);box-shadow:0 4px 16px rgba(20,168,0,.12);}
.upw-view-all span{font-size:.82rem;font-weight:700;color:#14a800;}

@media(max-width:900px){
  .upwork-wrap{grid-template-columns:1fr;}
  .upw-card{position:static;}
}


/* ── CASE STUDIES ── */
.cs-wrap{margin-top:52px;}
.cs-featured{display:grid;grid-template-columns:1.1fr 1fr;gap:0;border-radius:20px;overflow:hidden;border:1px solid var(--border);box-shadow:var(--shl);margin-bottom:16px;background:#fff;}
.cs-feat-visual{position:relative;min-height:340px;overflow:hidden;}
.cs-feat-bg{position:absolute;inset:0;transition:transform .6s ease;}
.cs-featured:hover .cs-feat-bg{transform:scale(1.03);}
.cs-feat-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.55) 100%);}
.cs-feat-tags{position:absolute;top:18px;left:18px;display:flex;gap:6px;}
.cs-tag{padding:3px 11px;border-radius:100px;font-size:.58rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;backdrop-filter:blur(8px);}
.cs-tag-ind{background:rgba(255,255,255,.18);color:#fff;border:1px solid rgba(255,255,255,.3);}
.cs-tag-feat{background:rgba(41,82,217,.85);color:#fff;}
.cs-feat-metrics{position:absolute;bottom:18px;left:18px;right:18px;display:flex;gap:8px;}
.cs-met{background:rgba(255,255,255,.15);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:10px 13px;flex:1;text-align:center;}
.cs-met-n{font-family:'Bricolage Grotesque',sans-serif;font-size:1.35rem;font-weight:800;color:#fff;line-height:1;}
.cs-met-l{font-size:.56rem;color:rgba(255,255,255,.75);margin-top:2px;}
.cs-feat-body{padding:36px 32px;display:flex;flex-direction:column;justify-content:center;}
.cs-feat-industry{font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-bottom:8px;}
.cs-feat-t{font-family:'Bricolage Grotesque',sans-serif;font-size:1.45rem;font-weight:800;line-height:1.15;letter-spacing:-.025em;margin-bottom:12px;}
.cs-feat-d{font-size:.82rem;line-height:1.78;color:var(--g500);margin-bottom:22px;}
.cs-challenge{background:var(--g50);border:1px solid var(--border);border-radius:10px;padding:14px 16px;margin-bottom:18px;}
.cs-ch-lbl{font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--g400);margin-bottom:5px;}
.cs-ch-list{display:flex;flex-direction:column;gap:4px;}
.cs-ch-li{display:flex;align-items:center;gap:7px;font-size:.74rem;color:var(--g600);}
.cs-ch-li::before{content:'→';color:var(--blue);flex-shrink:0;font-weight:700;}
.cs-stack{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:20px;}
.cs-sk{padding:3px 9px;background:var(--blue-pale);border:1px solid var(--blue-pale2);border-radius:100px;font-size:.6rem;font-weight:600;color:var(--blue);}

/* Small case study grid */
.cs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.cs-card{background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden;transition:all .28s;}
.cs-card:hover{box-shadow:var(--shl);transform:translateY(-4px);}
.cs-card:hover .cs-card-bg{transform:scale(1.05);}
.cs-visual{height:150px;position:relative;overflow:hidden;}
.cs-card-bg{position:absolute;inset:0;transition:transform .5s ease;}
.cs-card-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(0,0,0,.5) 100%);}
.cs-card-tag{position:absolute;top:10px;left:10px;}
.cs-card-kpis{position:absolute;bottom:10px;left:10px;right:10px;display:flex;gap:6px;}
.cs-kpi{background:rgba(255,255,255,.14);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);border-radius:7px;padding:6px 9px;text-align:center;flex:1;}
.cs-kpi-n{font-family:'Bricolage Grotesque',sans-serif;font-size:.95rem;font-weight:800;color:#fff;line-height:1;}
.cs-kpi-l{font-size:.5rem;color:rgba(255,255,255,.7);margin-top:1px;}
.cs-body{padding:16px 18px;}
.cs-ind{font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:4px;}
.cs-t{font-family:'Bricolage Grotesque',sans-serif;font-size:.9rem;font-weight:700;line-height:1.25;margin-bottom:7px;}
.cs-d{font-size:.73rem;line-height:1.65;color:var(--g500);margin-bottom:10px;}
.cs-lk{display:inline-flex;align-items:center;gap:4px;font-size:.72rem;font-weight:700;color:var(--blue);transition:gap .2s;}
.cs-lk:hover{gap:8px;}
@media(max-width:900px){
  .cs-featured{grid-template-columns:1fr;}
  .cs-feat-visual{min-height:220px;}
  .cs-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:600px){.cs-grid{grid-template-columns:1fr;}}


/* ── BLOG INSIGHTS ── */
.blog-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:16px;margin-top:44px;}
.blog-main{display:flex;flex-direction:column;gap:14px;}
.blog-side{display:flex;flex-direction:column;gap:10px;}

/* Big featured post */
.bp-featured{background:#fff;border:1px solid var(--border);border-radius:18px;overflow:hidden;transition:all .3s;}
.bp-featured:hover{box-shadow:var(--shxl);transform:translateY(-3px);}
.bp-featured:hover .bp-vis-bg{transform:scale(1.04);}
.bp-vis{height:220px;position:relative;overflow:hidden;}
.bp-vis-bg{position:absolute;inset:0;transition:transform .5s ease;}
.bp-vis-overlay{position:absolute;inset:0;}
.bp-vis-pill{position:absolute;top:14px;left:14px;padding:4px 12px;border-radius:100px;font-size:.59rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;backdrop-filter:blur(8px);}
.bp-vis-read{position:absolute;top:14px;right:14px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(8px);padding:3px 10px;border-radius:100px;font-size:.58rem;color:#fff;}
.bp-body{padding:22px 24px;}
.bp-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.bp-date{font-size:.65rem;color:var(--g400);}
.bp-sep{width:3px;height:3px;background:var(--g300);border-radius:50%;}
.bp-auth{display:flex;align-items:center;gap:5px;font-size:.65rem;color:var(--g400);}
.bp-auth-av{width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,var(--blue),#5b7fff);display:flex;align-items:center;justify-content:center;font-size:.45rem;font-weight:800;color:#fff;}
.bp-t{font-family:'Bricolage Grotesque',sans-serif;font-size:1.15rem;font-weight:800;line-height:1.2;letter-spacing:-.02em;margin-bottom:9px;}
.bp-ex{font-size:.78rem;line-height:1.75;color:var(--g500);margin-bottom:14px;}
.bp-foot{display:flex;align-items:center;justify-content:space-between;}
.bp-tags{display:flex;gap:5px;flex-wrap:wrap;}
.bp-tag{padding:2px 9px;background:var(--blue-pale);border:1px solid var(--blue-pale2);border-radius:100px;font-size:.58rem;font-weight:600;color:var(--blue);}
.bp-lk{font-size:.74rem;font-weight:700;color:var(--blue);display:inline-flex;align-items:center;gap:4px;transition:gap .2s;white-space:nowrap;}
.bp-lk:hover{gap:8px;}

/* Medium post (2nd main slot) */
.bp-med{background:#fff;border:1px solid var(--border);border-radius:14px;display:grid;grid-template-columns:140px 1fr;overflow:hidden;transition:all .28s;}
.bp-med:hover{box-shadow:var(--shl);transform:translateY(-2px);}
.bp-med:hover .bp-vis-bg{transform:scale(1.05);}
.bp-med .bp-vis{height:auto;min-height:120px;}
.bp-med .bp-body{padding:16px 18px;}
.bp-med .bp-t{font-size:.93rem;margin-bottom:6px;}
.bp-med .bp-ex{font-size:.73rem;margin-bottom:10px;}

/* Side list posts */
.bp-list{background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px;transition:all .22s;display:flex;gap:12px;align-items:flex-start;}
.bp-list:hover{border-color:var(--blue-pale2);box-shadow:var(--sh);transform:translateX(3px);}
.bp-list-num{font-family:'JetBrains Mono',monospace;font-size:1.3rem;font-weight:700;color:var(--g200);line-height:1;flex-shrink:0;width:28px;text-align:right;}
.bp-list-body{}
.bp-list-cat{font-size:.57rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:3px;}
.bp-list-t{font-family:'Bricolage Grotesque',sans-serif;font-size:.82rem;font-weight:700;line-height:1.3;margin-bottom:4px;}
.bp-list-meta{font-size:.63rem;color:var(--g400);}

/* Newsletter strip */
.blog-nl{background:linear-gradient(135deg,var(--blue-pale) 0%,#fff 100%);border:1px solid var(--blue-pale2);border-radius:16px;padding:24px 28px;display:flex;align-items:center;gap:20px;margin-top:14px;flex-wrap:wrap;}
.blog-nl-t{font-family:'Bricolage Grotesque',sans-serif;font-size:1rem;font-weight:700;flex:1;min-width:200px;}
.blog-nl-t span{color:var(--blue);}
.blog-nl-form{display:flex;gap:8px;flex:2;min-width:260px;}
.blog-nl-inp{flex:1;background:#fff;border:1.5px solid var(--border);border-radius:8px;padding:9px 13px;font-family:'Plus Jakarta Sans',sans-serif;font-size:.82rem;color:var(--g900);outline:none;transition:border-color .2s;}
.blog-nl-inp:focus{border-color:var(--blue);}
.blog-nl-btn{padding:9px 18px;background:var(--blue);color:#fff;border-radius:8px;font-family:'Plus Jakarta Sans',sans-serif;font-size:.8rem;font-weight:700;transition:all .2s;cursor:pointer;white-space:nowrap;}
.blog-nl-btn:hover{background:var(--blue-d);}

@media(max-width:900px){
  .blog-grid{grid-template-columns:1fr;}
  .bp-med{grid-template-columns:1fr;}
  .bp-med .bp-vis{height:160px;}
}


/* ── FAQ ── */
.faq-wrap{display:grid;grid-template-columns:320px 1fr;gap:52px;margin-top:52px;align-items:start;}
.faq-left{}
.faq-left .lead{margin-top:14px;margin-bottom:24px;}
.faq-cats{display:flex;flex-direction:column;gap:5px;margin-bottom:28px;}
.fq-cat{display:flex;align-items:center;gap:9px;padding:9px 13px;border-radius:9px;font-size:.78rem;font-weight:600;color:var(--g500);cursor:pointer;transition:all .18s;border:1px solid transparent;}
.fq-cat:hover,.fq-cat.on{background:var(--blue-pale);color:var(--blue);border-color:var(--blue-pale2);}
.fq-cat-ic{font-size:.9rem;width:22px;text-align:center;}
.faq-cta-box{background:linear-gradient(135deg,var(--blue),var(--blue-d));border-radius:14px;padding:22px;text-align:center;}
.faq-cta-box .h3{color:#fff;font-size:.95rem;margin-bottom:6px;}
.faq-cta-box p{font-size:.73rem;color:rgba(255,255,255,.7);margin-bottom:14px;line-height:1.6;}

.faq-right{}
.faq-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:22px;}
.fq-tab{padding:6px 14px;border-radius:8px;font-size:.74rem;font-weight:600;color:var(--g500);background:var(--g50);border:1.5px solid var(--border);cursor:pointer;transition:all .18s;}
.fq-tab:hover,.fq-tab.on{background:var(--blue-pale);color:var(--blue);border-color:var(--blue-pale2);}

/* Accordion */
.faq-list{display:flex;flex-direction:column;gap:8px;}
.fq-item{background:#fff;border:1.5px solid var(--border);border-radius:12px;overflow:hidden;transition:border-color .22s,box-shadow .22s;}
.fq-item.open{border-color:var(--blue-pale2);box-shadow:0 4px 18px rgba(41,82,217,.07);}
.fq-q{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 20px;cursor:pointer;user-select:none;}
.fq-q:hover{background:var(--blue-pale);}
.fq-item.open .fq-q{background:var(--blue-pale);}
.fq-q-text{font-size:.85rem;font-weight:700;color:var(--g900);line-height:1.4;}
.fq-icon{width:24px;height:24px;border-radius:50%;background:var(--g100);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.72rem;color:var(--g500);transition:all .24s;}
.fq-item.open .fq-icon{background:var(--blue);color:#fff;transform:rotate(45deg);}
.fq-a{max-height:0;overflow:hidden;transition:max-height .35s ease,padding .25s ease;}
.fq-item.open .fq-a{max-height:400px;}
.fq-a-inner{padding:0 20px 18px;font-size:.81rem;line-height:1.82;color:var(--g500);}
.fq-a-inner strong{color:var(--g900);font-weight:700;}
.fq-a-inner ul{margin:10px 0 0 0;padding:0;display:flex;flex-direction:column;gap:5px;}
.fq-a-inner ul li{display:flex;align-items:flex-start;gap:7px;font-size:.78rem;}
.fq-a-inner ul li::before{content:'✓';color:var(--blue);flex-shrink:0;font-weight:700;margin-top:1px;}

@media(max-width:900px){
  .faq-wrap{grid-template-columns:1fr;}
}

/* ══════════════════════════════════════════════════════════
   RESPONSIVE OVERRIDES — Added on top of v3 base
   ══════════════════════════════════════════════════════════ */

/* Responsive class targets (set by JS injector) */
.r-hero{display:grid;grid-template-columns:1fr 420px;gap:60px}
.r-g2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.r-g3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.r-g4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.r-g5{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.r-sidebar{display:grid;grid-template-columns:300px 1fr;gap:52px;align-items:start}

/* tablet */
@media(max-width:1024px){
  #nav{padding:0 24px}
  .r-g5{grid-template-columns:repeat(3,1fr)!important}
  .r-g4{grid-template-columns:repeat(2,1fr)!important}
  .r-hero{grid-template-columns:1fr 300px!important;gap:32px!important}
  .hfloats{display:none!important}
  .upwork-wrap{grid-template-columns:1fr!important}
  .upw-card{position:static!important}
  .cs-featured{grid-template-columns:1fr!important}
  .cs-feat-visual{min-height:240px!important}
  .cs-grid{grid-template-columns:1fr 1fr!important}
  .blog-grid{grid-template-columns:1fr!important}
  .bp-med{grid-template-columns:1fr!important}
  .bp-med .bp-vis{height:160px!important}
  .indg{grid-template-columns:repeat(4,1fr)!important}
  .teg{grid-template-columns:repeat(5,1fr)!important}
  .prow{grid-template-columns:repeat(2,1fr)!important;gap:24px!important}
  .prow::before{display:none!important}
  .tgrid{grid-template-columns:1fr 1fr!important}
  .mdrop{display:none!important}
}

/* mobile */
@media(max-width:768px){
  :root{--nav-h:60px}
  #nav{padding:0 16px!important;height:60px!important}
  .nav-menu,.nav-r{display:none!important}
  .nav-ham{display:flex!important}
  .nav-logo-img{height:100px!important}

  /* Sections */
  .sec{padding:36px 16px!important}
  .sec-sm{padding:24px 16px!important}
  .con,.con-sm{padding-left:16px!important;padding-right:16px!important}
  .bc-bar{padding:10px 16px!important;margin-top:60px!important}
  .phero{padding:76px 16px 44px!important;margin-top:60px!important}

  /* Hero */
  #hhero{padding:36px 16px 48px!important;min-height:auto!important;margin-top:60px!important}
  .hshape,.hshape2{display:none!important}
  .hfloats{display:none!important}
  .htitle{font-size:2.2rem!important;letter-spacing:-.03em!important}
  .h1{font-size:2.1rem!important}
  .h2{font-size:1.6rem!important}
  .lead{font-size:.9rem!important}
  .hstats{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important}
  .hstat{border-right:none!important;border-bottom:1px solid var(--border)!important}
  .hstat:nth-child(odd){border-right:1px solid var(--border)!important}
  .hstat:last-child,.hstat:nth-last-child(2):nth-child(odd){border-bottom:none!important}

  /* CTA */
  .cta-ban{padding:40px 16px!important}
  .cta-acts{flex-direction:column!important;align-items:center!important}
  .cta-acts .btn,.cta-acts a{width:100%!important;max-width:300px!important;justify-content:center!important}

  /* All grids → single column */
  .sg,.prg,.tmg,.cog,.frow,
  .indg,.why,.prow,.tgrid,.cs-grid,
  .r-hero,.r-g2,.r-g3,.r-g4,.r-g5,.r-sidebar,
  .upwork-wrap,.blog-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  /* Keep industry at 2-col minimum */
  .indg{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}

  /* CS & blog */
  .cs-featured{grid-template-columns:1fr!important}
  .cs-feat-visual{min-height:200px!important}
  .cs-grid{grid-template-columns:1fr!important}
  .bp-med{grid-template-columns:1fr!important}
  .bp-med .bp-vis{height:140px!important}
  .blog-nl{flex-direction:column!important}

  /* Upwork */
  .upwork-wrap{grid-template-columns:1fr!important}
  .upw-card{position:static!important}
  .rev-header{flex-direction:column!important;gap:12px!important}
  .rev-bars{min-width:auto!important;width:100%!important}

  /* Inline section padding overrides */
  [style*="padding:72px 44px"]{padding:40px 16px!important}
  [style*="padding:60px 44px"]{padding:36px 16px!important}
  [style*="padding:52px 44px"]{padding:32px 16px!important}
  [style*="padding:44px 44px"]{padding:28px 16px!important}
  [style*="padding:36px 44px"]{padding:24px 16px!important}
  [style*="padding:100px 44px"]{padding:76px 16px 44px!important}
  [style*="max-width:1160px;margin:0 auto"]{padding-left:16px!important;padding-right:16px!important}

  /* Tech */
  .teg{grid-template-columns:repeat(4,1fr)!important;gap:6px!important}
  .ti{padding:10px 5px!important}

  /* Pricing */
  .prg{grid-template-columns:1fr!important;max-width:360px!important;margin-left:auto!important;margin-right:auto!important}

  /* Footer */
  footer [style*="grid-template-columns"]{grid-template-columns:1fr 1fr!important;gap:16px!important}
  .tss-item{min-width:56px!important;padding:5px 8px!important}
  .tss-icon{width:28px!important;height:28px!important}

  /* Forms */
  .cfm{padding:20px!important}
  .frow{grid-template-columns:1fr!important}

  /* Modal */
  .modal-overlay,.modal-box{padding:20px!important}
}

/* small mobile */
@media(max-width:480px){
  .h1{font-size:1.8rem!important}
  .h2{font-size:1.3rem!important}
  .indg{grid-template-columns:repeat(2,1fr)!important}
  .teg{grid-template-columns:repeat(3,1fr)!important}
  .tmg{grid-template-columns:1fr 1fr!important}
  .prc{padding:22px 18px!important}
  .card{padding:16px!important}
  .hacts .btn-lg{padding:11px 18px!important;font-size:.84rem!important}
}

@media(max-width:360px){
  .h1{font-size:1.6rem!important}
  .indg{grid-template-columns:1fr 1fr!important}
  .tmg{grid-template-columns:1fr!important}
}
