/* Bizspaces shared visual foundation: agency conversion and utility layers */
:root {
  --vz-ink: #0b0b0c;
  --vz-charcoal: #151518;
  --vz-paper: #f5f1e8;
  --vz-gold: #8B5CF6;
  --vz-gold-soft: #A78BFA;
  --vz-line: rgba(245, 241, 232, .15);
  --vz-muted: #b7b2aa;

  /* Token remap: gold → violet across all agency pages
     Case studies (cap-carbon, bilal) don't load this file, so their
     brand colors are unaffected. */
  --qs-gold: #8B5CF6;
  --qs-gold-soft: #A78BFA;
  --c-gold: #8B5CF6;
  --c-gold-soft: rgba(139, 92, 246, 0.12);
  --ds-tertiary: #8B5CF6;
  --fit-gold: #8B5CF6;
  --fit-gold-soft: #A78BFA;
  --bz-gold: #8B5CF6;
  --bz-gold-soft: #A78BFA;
}

html { scroll-padding-top: 104px; }
body { background: var(--vz-ink); }

/* The consent layer must support a choice, not hide the page. */
.bz-cookie-banner {
  position: fixed !important;
  inset: auto 1rem 1rem auto !important;
  width: min(390px, calc(100vw - 2rem)) !important;
  max-width: 390px !important;
  z-index: 10001 !important;
  border: 1px solid rgba(139, 92, 246, .45) !important;
  border-radius: 16px !important;
  background: rgba(21, 21, 24, .98) !important;
  box-shadow: 0 18px 60px rgba(0, 0, 0, .45) !important;
  backdrop-filter: blur(16px) !important;
}
.bz-cookie-banner__inner { padding: 1rem !important; }
.bz-cookie-banner__title { font-size: .92rem !important; margin: 0 0 .35rem !important; }
.bz-cookie-banner__desc { font-size: .78rem !important; line-height: 1.45 !important; margin: 0 0 .8rem !important; }
.bz-cookie-banner__actions { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: .55rem !important; }
.bz-cookie-banner__btn { min-height: 2.55rem !important; font-size: .7rem !important; letter-spacing: .09em !important; }
.bz-cookie-banner .btn--primary { background: var(--vz-gold) !important; border-color: var(--vz-gold) !important; color: #15110a !important; }

/* A single clear project-fit action replaces the generic scheduling emphasis. */
a.vz-project-fit,
.vz-project-fit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .55rem !important;
  min-height: 2.85rem !important;
  padding: .8rem 1.15rem !important;
  border: 1px solid var(--vz-gold) !important;
  border-radius: 999px !important;
  background: var(--vz-gold) !important;
  color: #17120a !important;
  font-weight: 760 !important;
  letter-spacing: .06em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}
a.vz-project-fit::after { content: '→'; font-size: 1.05em; }
a.vz-project-fit:hover,
a.vz-project-fit:focus-visible { background: var(--vz-gold-soft) !important; box-shadow: 0 12px 30px rgba(139, 92, 246, .22) !important; transform: translateY(-2px); }

/* Keep shared headers light, legible and visually distinct from case-study headers. */
.nav, .city-header, body > header:not(.case-study-header) {
  border-bottom-color: rgba(245, 241, 232, .11) !important;
}
.nav.is-scrolled, .city-header.is-scrolled {
  background: rgba(11, 11, 12, .88) !important;
  backdrop-filter: blur(16px) saturate(125%) !important;
}
.nav__links .nav__link, .city-nav a { letter-spacing: .055em !important; }

/* Shared card surfaces use role-specific contrast instead of repeated flat black blocks. */
.services-grid > *, .service-grid > *, .industry-grid > *, .ds-industries__grid > *, .city-grid > * {
  border-color: rgba(245, 241, 232, .12) !important;
  transition: transform .22s ease, border-color .22s ease, background .22s ease !important;
}
.services-grid > *:hover, .service-grid > *:hover, .industry-grid > *:hover, .ds-industries__grid > *:hover, .city-grid > *:hover {
  border-color: rgba(139, 92, 246, .7) !important;
  transform: translateY(-4px) !important;
}
.ds-trust, .trust-band, .hero-trust { border-color: rgba(139, 92, 246, .35) !important; }
.ds-financing, .pricing-section, .pricing-band { background: linear-gradient(135deg, #15130f, #211b10) !important; }
.ds-final-cta, .city-contact-block, .consultation, .contact-cta { border-top-color: rgba(139, 92, 246, .45) !important; }

/* City pages retain one shared system but receive restrained location-specific tones. */
body.city-montreal .ds-hero__gradient, .ds-hero--bg-surface .ds-hero__gradient { background: linear-gradient(100deg, rgba(9,9,11,.9), rgba(9,9,11,.42)) !important; }
body.city-laval .ds-hero__gradient { background: linear-gradient(100deg, rgba(9,20,18,.9), rgba(9,20,18,.42)) !important; }
body.city-chateauguay .ds-hero__gradient { background: linear-gradient(100deg, rgba(25,17,13,.9), rgba(25,17,13,.42)) !important; }

/* The .process-step counters (decimal-leading-zero chips) are styled in
   audit-fixes.css. Decorative sequence markers elsewhere stay hidden. */
.vz-decorative-number { display: none !important; }

/* The existing footer gains an intentional closing rhythm without becoming another conversion block. */
.footer { border-top: 1px solid rgba(245, 241, 232, .14) !important; }
.footer__brand p { max-width: 28rem; }
.footer__col h4 { color: var(--vz-gold) !important; }
.footer__col a:hover, .footer__col a:focus-visible { color: var(--vz-gold-soft) !important; }

@media (max-width: 760px) {
  .bz-cookie-banner { inset: auto .75rem .75rem .75rem !important; width: auto !important; max-width: none !important; }
  .bz-cookie-banner__actions { grid-template-columns: 1fr !important; }
  a.vz-project-fit { width: 100% !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}


/* Bizspaces page-specific refinement pass */
#portfolio, #pricing, #process, #services {
  position: relative;
  isolation: isolate;
}
#portfolio::before, #pricing::before, #process::before, #services::before {
  content: "";
  position: absolute;
  inset: 1.25rem 0 auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(139,92,246,.48), transparent);
  pointer-events: none;
}
#portfolio { background: radial-gradient(circle at 82% 12%, rgba(139,92,246,.10), transparent 28%); }
#portfolio [class*="card"], #portfolio article {
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}
#portfolio [class*="card"]:hover, #portfolio article:hover {
  transform: translateY(-6px);
  border-color: rgba(139,92,246,.62);
  box-shadow: 0 20px 54px rgba(0,0,0,.24);
}
#process [class*="step"], #process article, #process li {
  border-radius: 16px;
}
#process [class*="step"]:hover, #process article:hover {
  border-color: rgba(139,92,246,.48);
  transform: translateY(-3px);
}
#services [class*="card"], #services article, .ds-services [class*="card"] {
  border-radius: 18px;
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}
#services [class*="card"]:hover, #services article:hover, .ds-services [class*="card"]:hover {
  transform: translateY(-4px);
  border-color: rgba(139,92,246,.52);
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(139,92,246,.055));
}
#services [class*="icon"], #services [class*="emoji"] {
  color: var(--bz-gold);
  filter: saturate(.75);
}
#pricing { background: radial-gradient(circle at 15% 35%, rgba(139,92,246,.13), transparent 31%); }
#pricing [class*="package"], #pricing [class*="price"], #pricing article {
  border-radius: 18px;
}
#pricing [class*="package"]:first-child, #pricing [class*="price"]:first-child {
  border-color: rgba(139,92,246,.76);
  box-shadow: 0 20px 56px rgba(139,92,246,.11);
}
#pricing [class*="price"], #pricing [class*="amount"] {
  text-shadow: 0 0 30px rgba(139,92,246,.15);
}
#pricing [class*="cta"], #pricing .btn {
  border-color: var(--bz-gold);
}
#pricing [class*="cta"]:hover, #pricing .btn:hover {
  background: var(--bz-gold);
  color: var(--bz-ink);
}
.ds-portfolio, .ds-pricing, .ds-final-cta {
  position: relative;
  overflow: hidden;
}
.ds-portfolio::before, .ds-pricing::before, .ds-final-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 0 58%, rgba(139,92,246,.08));
}
.ds-portfolio [class*="card"], .ds-pricing [class*="card"], .ds-final-cta [class*="btn"] {
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.ds-portfolio [class*="card"]:hover, .ds-pricing [class*="card"]:hover, .ds-final-cta [class*="btn"]:hover {
  transform: translateY(-4px);
  border-color: rgba(139,92,246,.65);
  box-shadow: 0 16px 38px rgba(0,0,0,.20);
}
@media (prefers-reduced-motion: reduce) {
  #portfolio [class*="card"], #portfolio article, #process [class*="step"], #process article, #services [class*="card"], #services article, .ds-services [class*="card"], .ds-portfolio [class*="card"], .ds-pricing [class*="card"], .ds-final-cta [class*="btn"] { transform: none !important; }
}


/* Bizspaces performance safeguards */
@media (hover: none), (pointer: coarse) {
  #portfolio [class*="card"], #portfolio article,
  #process [class*="step"], #process article,
  #services [class*="card"], #services article,
  .ds-services [class*="card"], .ds-portfolio [class*="card"],
  .ds-pricing [class*="card"], .ds-final-cta [class*="btn"] {
    transform: none !important;
  }
}
@media (max-width: 820px), (prefers-reduced-motion: reduce) {
  .nav, .cookie-banner, .consent-banner,
  [class*="glass"], [class*="modal"], [class*="drawer"] {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  .reveal, [data-reveal], [data-animate],
  .hero::before, .hero::after,
  .ds-hero::before, .ds-hero::after {
    animation: none !important;
    transition-duration: .01ms !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}