/* ============================================================
   NEXUS AI — Master Stylesheet
   Premium AI Consultancy | All Industries
   ============================================================ */

/* ── 1. DESIGN TOKENS ───────────────────────────────────────── */
:root {
  /* Brand colours — Fjord Signal #2596be */
  --c-bg:           #04090d;
  --c-surface:      #08111a;
  --c-surface-2:    #0d1a24;
  --c-border:       rgba(37,150,190,.18);
  --c-border-bright:rgba(37,150,190,.45);

  /* Accent palette */
  --c-indigo:       #2596be;   /* Fjord Signal — primary */
  --c-violet:       #1a7da3;   /* Fjord Signal deep */
  --c-cyan:         #40b8d8;   /* Fjord Signal light */
  --c-emerald:      #10b981;
  --c-rose:         #f43f5e;
  --c-amber:        #f59e0b;

  /* Gradients */
  --g-brand:        linear-gradient(135deg, #1a7da3 0%, #2596be 50%, #40b8d8 100%);
  --g-card:         linear-gradient(145deg, #0d1a24 0%, #08111a 100%);
  --g-hero:         radial-gradient(ellipse 80% 60% at 50% 0%, rgba(37,150,190,.20) 0%, transparent 65%);
  --g-glow-indigo:  radial-gradient(circle at center, rgba(37,150,190,.32) 0%, transparent 70%);
  --g-glow-violet:  radial-gradient(circle at center, rgba(26,125,163,.22) 0%, transparent 70%);

  /* Typography */
  --ff-display:     'Inter', system-ui, -apple-system, sans-serif;
  --ff-body:        'Inter', system-ui, -apple-system, sans-serif;
  --fs-xs:          .75rem;
  --fs-sm:          .875rem;
  --fs-base:        1rem;
  --fs-lg:          1.125rem;
  --fs-xl:          1.25rem;
  --fs-2xl:         1.5rem;
  --fs-3xl:         1.875rem;
  --fs-4xl:         2.25rem;
  --fs-5xl:         3rem;
  --fs-6xl:         3.75rem;
  --fs-7xl:         4.5rem;
  --fw-normal:      400;
  --fw-medium:      500;
  --fw-semibold:    600;
  --fw-bold:        700;
  --fw-extrabold:   800;
  --lh-tight:       1.2;
  --lh-snug:        1.35;
  --lh-normal:      1.6;

  /* Spacing */
  --sp-1: .25rem; --sp-2: .5rem;  --sp-3: .75rem; --sp-4: 1rem;
  --sp-5: 1.25rem;--sp-6: 1.5rem; --sp-8: 2rem;   --sp-10: 2.5rem;
  --sp-12: 3rem;  --sp-14: 3.5rem;--sp-16: 4rem;  --sp-20: 5rem;
  --sp-24: 6rem;  --sp-32: 8rem;

  /* Shape */
  --r-sm:   .375rem;
  --r-md:   .625rem;
  --r-lg:   .875rem;
  --r-xl:   1.25rem;
  --r-2xl:  1.75rem;
  --r-full: 9999px;

  /* Shadows */
  --shadow-card: 0 4px 24px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.04) inset;
  --shadow-glow: 0 0 40px rgba(37,150,190,.3);
  --shadow-btn:  0 4px 20px rgba(37,150,190,.45);

  /* Transitions */
  --t-fast:   150ms ease;
  --t-base:   250ms ease;
  --t-slow:   400ms ease;
  --t-spring: 350ms cubic-bezier(.34,1.56,.64,1);

  /* Layout */
  --max-w:    1280px;
  --max-w-lg: 1024px;
  --max-w-md: 768px;

  /* Nav */
  --nav-h: 72px;
}

/* ── 2. RESET & BASE ────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{
  background:var(--c-bg);
  color:#e2e8f0;
  font-family:var(--ff-body);
  font-size:var(--fs-base);
  line-height:var(--lh-normal);
  min-height:100vh;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}
ul,ol{list-style:none}
input,textarea,select{font-family:inherit}

/* ── 3. SCROLLBAR ───────────────────────────────────────────── */
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--c-bg)}
::-webkit-scrollbar-thumb{background:var(--c-indigo);border-radius:var(--r-full)}

/* ── 4. SELECTION ───────────────────────────────────────────── */
::selection{background:rgba(37,150,190,.35);color:#fff}

/* ── 5. TYPOGRAPHY ──────────────────────────────────────────── */
.text-gradient{
  background:var(--g-brand);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.text-gradient-cyan{
  background:linear-gradient(135deg,#2596be,#40b8d8);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
h1,h2,h3,h4,h5,h6{
  font-family:var(--ff-display);
  font-weight:var(--fw-bold);
  line-height:var(--lh-tight);
  color:#f1f5f9;
}

/* ── 6. LAYOUT UTILITIES ────────────────────────────────────── */
.container{
  width:100%;
  max-width:var(--max-w);
  margin-inline:auto;
  padding-inline:clamp(1rem,4vw,2.5rem);
}
.container--lg{max-width:var(--max-w-lg)}
.container--md{max-width:var(--max-w-md)}
.section{padding-block:clamp(var(--sp-16),8vw,var(--sp-32))}
.section--sm{padding-block:clamp(var(--sp-10),5vw,var(--sp-20))}

/* Grid helpers */
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-8)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6)}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-6)}
@media(max-width:1024px){
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .grid-3{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .grid-4,.grid-3,.grid-2{grid-template-columns:1fr}
}

/* ── 7. BUTTONS ─────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  padding:.75rem 1.75rem;
  border-radius:var(--r-full);
  font-size:var(--fs-sm);
  font-weight:var(--fw-semibold);
  transition:all var(--t-base);
  white-space:nowrap;
  position:relative;
  overflow:hidden;
}
.btn::after{
  content:'';position:absolute;inset:0;
  background:rgba(255,255,255,.08);
  opacity:0;transition:opacity var(--t-fast);
}
.btn:hover::after{opacity:1}

.btn--primary{
  background:var(--g-brand);
  color:#fff;
  box-shadow:var(--shadow-btn);
}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px rgba(37,150,190,.55)}
.btn--primary:active{transform:translateY(0)}

.btn--outline{
  background:transparent;
  color:#e2e8f0;
  border:1.5px solid var(--c-border-bright);
}
.btn--outline:hover{
  background:rgba(37,150,190,.1);
  border-color:var(--c-indigo);
  color:#fff;
  transform:translateY(-2px);
}

.btn--ghost{
  background:transparent;
  color:var(--c-indigo);
  padding:.5rem 0;
  font-weight:var(--fw-semibold);
}
.btn--ghost:hover{color:#7dd4ed}
.btn--ghost .arrow{transition:transform var(--t-base)}
.btn--ghost:hover .arrow{transform:translateX(4px)}

.btn--sm{padding:.5rem 1.25rem;font-size:var(--fs-xs)}
.btn--lg{padding:.9375rem 2.25rem;font-size:var(--fs-base)}

/* ── 8. NAVIGATION ──────────────────────────────────────────── */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  height:var(--nav-h);
  transition:background var(--t-slow),backdrop-filter var(--t-slow),border-color var(--t-slow);
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:rgba(5,7,15,.88);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border-bottom-color:var(--c-border);
}
.nav__inner{
  height:100%;
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--sp-8);
  max-width:var(--max-w);
  margin-inline:auto;
  padding-inline:clamp(1rem,4vw,2.5rem);
}
.nav__logo{
  display:flex;align-items:center;gap:var(--sp-3);
  font-size:var(--fs-xl);
  font-weight:var(--fw-extrabold);
  color:#fff;
  flex-shrink:0;
}
.nav__logo-img{
  height:44px;
  width:auto;
  display:block;
  object-fit:contain;
  max-width:180px;
}
.footer__logo-img{
  height:48px;
  width:auto;
  display:block;
  object-fit:contain;
  max-width:200px;
  margin-bottom:var(--sp-3);
}
.nav__logo-mark{
  width:36px;height:36px;
  background:var(--g-brand);
  border-radius:var(--r-md);
  display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-lg);font-weight:var(--fw-extrabold);color:#fff;
  box-shadow:0 4px 16px rgba(37,150,190,.45);
}
.nav__links{
  display:flex;align-items:center;gap:var(--sp-1);
}
.nav__link{
  padding:var(--sp-2) var(--sp-4);
  border-radius:var(--r-md);
  font-size:var(--fs-sm);
  font-weight:var(--fw-medium);
  color:#94a3b8;
  transition:all var(--t-base);
}
.nav__link:hover,.nav__link.active{color:#fff;background:rgba(37,150,190,.1)}
.nav__actions{display:flex;align-items:center;gap:var(--sp-3)}

/* Mobile menu */
.nav__burger{
  display:none;
  flex-direction:column;gap:5px;
  width:32px;padding:var(--sp-2);
  background:none;border:none;
}
.nav__burger span{
  display:block;height:2px;width:100%;
  background:#e2e8f0;border-radius:1px;
  transition:all var(--t-base);
}
.nav__mobile{
  display:none;
  position:fixed;top:var(--nav-h);left:0;right:0;
  background:rgba(5,7,15,.97);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--c-border);
  padding:var(--sp-6);
  flex-direction:column;gap:var(--sp-2);
  z-index:999;
}
.nav__mobile.open{display:flex}
.nav__mobile .nav__link{padding:var(--sp-3) var(--sp-4);font-size:var(--fs-base)}
@media(max-width:900px){
  .nav__links,.nav__actions .btn--outline{display:none}
  .nav__burger{display:flex}
}

/* ── 9. HERO ────────────────────────────────────────────────── */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;align-items:center;
  padding-top:var(--nav-h);
  overflow:hidden;
}
/* Hero video background */
.hero__video{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  object-position:center center;
  pointer-events:none;
  z-index:0;
  opacity:.7;
  /* Cool-grade the warm conference room tones to match brand palette */
  filter:saturate(.75) brightness(.72) hue-rotate(8deg);
  /* GPU-accelerated rendering for smooth playback */
  will-change:transform;
  transform:translateZ(0);
  backface-visibility:hidden;
}
.hero__video-overlay{
  position:absolute;inset:0;
  z-index:1;
  background:
    /* Top vignette — keeps navigation always legible */
    linear-gradient(to bottom,
      rgba(5,7,15,.85) 0%,
      rgba(5,7,15,.40) 22%,
      rgba(5,7,15,.22) 55%,
      rgba(5,7,15,.88) 100%),
    /* Left-side panel — hero headline & CTAs always readable over video */
    linear-gradient(to right,
      rgba(5,7,15,.82) 0%,
      rgba(5,7,15,.50) 35%,
      rgba(5,7,15,.15) 60%,
      transparent 75%),
    /* Fjord Signal brand tint — ties the real footage to the site palette */
    radial-gradient(ellipse 90% 70% at 65% 50%,
      rgba(37,150,190,.10) 0%, transparent 65%);
  pointer-events:none;
}
@media(prefers-reduced-motion:reduce){
  .hero__video{ display:none; }
}

.hero__bg{
  position:absolute;inset:0;
  background:var(--g-hero);
  pointer-events:none;
  z-index:2;
  opacity:.45;
}
.hero__grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(37,150,190,.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(37,150,190,.06) 1px,transparent 1px);
  background-size:72px 72px;
  pointer-events:none;
  z-index:3;
}
.hero__orb{
  position:absolute;
  border-radius:50%;
  filter:blur(80px);
  pointer-events:none;
  animation:float 8s ease-in-out infinite;
  z-index:3;
}
.hero__orb--1{
  width:600px;height:600px;
  top:-200px;right:-100px;
  background:radial-gradient(circle,rgba(37,150,190,.2) 0%,transparent 70%);
}
.hero__orb--2{
  width:400px;height:400px;
  bottom:0;left:-100px;
  background:radial-gradient(circle,rgba(6,182,212,.15) 0%,transparent 70%);
  animation-delay:-4s;
}
@keyframes float{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-30px)}
}
.hero__content{
  position:relative;z-index:4;
  display:grid;grid-template-columns:1fr 1fr;
  align-items:center;gap:var(--sp-16);
  padding-block:var(--sp-20);
}
.hero__eyebrow{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  padding:var(--sp-2) var(--sp-4);
  background:rgba(37,150,190,.12);
  border:1px solid rgba(37,150,190,.3);
  border-radius:var(--r-full);
  font-size:var(--fs-xs);
  font-weight:var(--fw-semibold);
  color:#7dd4ed;
  letter-spacing:.06em;
  text-transform:uppercase;
  margin-bottom:var(--sp-6);
}
.hero__eyebrow-dot{
  width:6px;height:6px;
  background:var(--c-emerald);
  border-radius:50%;
  box-shadow:0 0 6px var(--c-emerald);
  animation:pulse-dot 2s ease-in-out infinite;
}
@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.8)}}
.hero__title{
  font-size:clamp(2.5rem,5.5vw,4.5rem);
  font-weight:var(--fw-extrabold);
  line-height:1.1;
  letter-spacing:-.03em;
  color:#f8fafc;
  margin-bottom:var(--sp-6);
}
.hero__sub{
  font-size:clamp(var(--fs-base),1.8vw,var(--fs-xl));
  color:#94a3b8;
  line-height:var(--lh-normal);
  max-width:520px;
  margin-bottom:var(--sp-10);
}
.hero__actions{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-4)}
.hero__proof{
  display:flex;align-items:center;gap:var(--sp-6);
  margin-top:var(--sp-10);
  padding-top:var(--sp-10);
  border-top:1px solid var(--c-border);
  flex-wrap:wrap;
}
.hero__proof-item{
  display:flex;flex-direction:column;
  gap:var(--sp-1);
}
.hero__proof-value{
  font-size:var(--fs-2xl);
  font-weight:var(--fw-extrabold);
  color:#f1f5f9;
  background:var(--g-brand);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.hero__proof-label{font-size:var(--fs-xs);color:#64748b;font-weight:var(--fw-medium)}

/* Dashboard card */
.hero__dashboard{
  position:relative;
}
.dashboard{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-2xl);
  padding:var(--sp-6);
  box-shadow:var(--shadow-card);
}
.dashboard__header{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:var(--sp-6);
}
.dashboard__title{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:#94a3b8}
.dashboard__badge{
  display:inline-flex;align-items:center;gap:var(--sp-1);
  padding:var(--sp-1) var(--sp-3);
  background:rgba(37,150,190,.12);
  border:1px solid rgba(37,150,190,.25);
  border-radius:var(--r-full);
  font-size:var(--fs-xs);
  color:#7dd4ed;
  font-weight:var(--fw-semibold);
}
.dashboard__badge-dot{width:5px;height:5px;background:var(--c-emerald);border-radius:50%}
.dashboard__metrics{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--sp-4);margin-bottom:var(--sp-6)}
.metric{
  background:rgba(255,255,255,.03);
  border:1px solid var(--c-border);
  border-radius:var(--r-lg);
  padding:var(--sp-4);
  text-align:center;
}
.metric__value{
  font-size:var(--fs-2xl);font-weight:var(--fw-extrabold);
  background:var(--g-brand);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.metric__label{font-size:var(--fs-xs);color:#64748b;margin-top:var(--sp-1)}
.dashboard__chart{
  background:rgba(255,255,255,.02);
  border:1px solid var(--c-border);
  border-radius:var(--r-lg);
  padding:var(--sp-4);
  height:120px;
  display:flex;align-items:flex-end;gap:6px;
  overflow:hidden;
  position:relative;
}
.chart-bar{
  flex:1;border-radius:4px 4px 0 0;
  background:linear-gradient(180deg,var(--c-indigo),rgba(37,150,190,.25));
  min-height:8px;
  animation:bar-grow .8s ease forwards;
  transform-origin:bottom;
}
@keyframes bar-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.chart-line{
  position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(6,182,212,.5),transparent);
  animation:scan 3s ease-in-out infinite;
}
@keyframes scan{0%{top:0;opacity:0}20%{opacity:1}80%{opacity:.5}100%{top:100%;opacity:0}}
.dashboard__processes{margin-top:var(--sp-4)}
.dashboard__proc-title{font-size:var(--fs-xs);color:#64748b;font-weight:var(--fw-semibold);margin-bottom:var(--sp-3);text-transform:uppercase;letter-spacing:.05em}
.proc-item{
  display:flex;align-items:center;gap:var(--sp-3);
  padding:var(--sp-2) 0;
  border-bottom:1px solid var(--c-border);
}
.proc-item:last-child{border-bottom:none}
.proc-icon{
  width:28px;height:28px;
  background:rgba(37,150,190,.15);
  border-radius:var(--r-sm);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;flex-shrink:0;
}
.proc-label{flex:1;font-size:var(--fs-xs);color:#94a3b8}
.proc-status{
  padding:2px 8px;border-radius:var(--r-full);
  font-size:10px;font-weight:var(--fw-semibold);
}
.proc-status--active{background:rgba(16,185,129,.15);color:var(--c-emerald)}
.proc-status--processing{background:rgba(37,150,190,.15);color:#7dd4ed}
.proc-status--queued{background:rgba(148,163,184,.1);color:#64748b}
.hero__disclaimer{
  position:absolute;bottom:-var(--sp-6);left:0;right:0;
  text-align:center;font-size:10px;color:#475569;
  padding-top:var(--sp-4);
}

@media(max-width:1024px){
  .hero__content{grid-template-columns:1fr;gap:var(--sp-12)}
  .hero__dashboard{max-width:520px;margin-inline:auto}
}
@media(max-width:640px){
  .hero__proof{gap:var(--sp-4)}
  .dashboard__metrics{grid-template-columns:repeat(3,1fr)}
}

/* ── 10. TRUST BAR ──────────────────────────────────────────── */
.trust-bar{
  border-top:1px solid var(--c-border);
  border-bottom:1px solid var(--c-border);
  padding-block:var(--sp-5);
  background:rgba(255,255,255,.015);
}
.trust-bar__inner{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(var(--sp-6),4vw,var(--sp-16));
  flex-wrap:wrap;
}
.trust-item{
  display:flex;align-items:center;gap:var(--sp-2);
  font-size:var(--fs-sm);color:#64748b;font-weight:var(--fw-medium);
  white-space:nowrap;
}
.trust-item__icon{
  width:20px;height:20px;
  color:var(--c-indigo);
  flex-shrink:0;
}

/* ── 11. SECTION HEADERS ────────────────────────────────────── */
.section-header{text-align:center;margin-bottom:clamp(var(--sp-10),5vw,var(--sp-16))}
.section-header--left{text-align:left}
.section-eyebrow{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  font-size:var(--fs-xs);
  font-weight:var(--fw-semibold);
  color:#2596be;
  letter-spacing:.1em;
  text-transform:uppercase;
  margin-bottom:var(--sp-4);
}
.section-eyebrow::before{
  content:'';width:20px;height:2px;
  background:var(--g-brand);border-radius:1px;
}
.section-title{
  font-size:clamp(var(--fs-3xl),4vw,var(--fs-5xl));
  font-weight:var(--fw-extrabold);
  letter-spacing:-.02em;
  line-height:1.15;
  margin-bottom:var(--sp-5);
}
.section-desc{
  font-size:var(--fs-lg);
  color:#94a3b8;
  max-width:640px;
  margin-inline:auto;
  line-height:var(--lh-normal);
}
.section-header--left .section-desc{margin-inline:0}

/* ── 12. CARDS ──────────────────────────────────────────────── */
.card{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-2xl);
  padding:var(--sp-8);
  transition:all var(--t-slow);
  position:relative;
  overflow:hidden;
}
.card::before{
  content:'';
  position:absolute;inset:0;
  border-radius:inherit;
  background:var(--g-glow-indigo);
  opacity:0;
  transition:opacity var(--t-slow);
  pointer-events:none;
}
.card:hover{
  border-color:var(--c-border-bright);
  transform:translateY(-4px);
  box-shadow:var(--shadow-card),0 0 0 1px rgba(37,150,190,.2);
}
.card:hover::before{opacity:.5}

.card__icon{
  width:52px;height:52px;
  background:rgba(37,150,190,.12);
  border:1px solid rgba(37,150,190,.2);
  border-radius:var(--r-lg);
  display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;
  margin-bottom:var(--sp-5);
  transition:all var(--t-base);
}
.card:hover .card__icon{background:rgba(37,150,190,.2);border-color:rgba(37,150,190,.4)}
.card__title{font-size:var(--fs-xl);font-weight:var(--fw-bold);margin-bottom:var(--sp-3);color:#f1f5f9}
.card__desc{font-size:var(--fs-sm);color:#94a3b8;line-height:var(--lh-normal)}
.card__tags{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-5)}
.tag{
  padding:var(--sp-1) var(--sp-3);
  background:rgba(37,150,190,.1);
  border:1px solid rgba(37,150,190,.2);
  border-radius:var(--r-full);
  font-size:var(--fs-xs);
  color:#7dd4ed;
  font-weight:var(--fw-medium);
}

/* Service card accent colours */
.card--cyan .card__icon{background:rgba(64,184,216,.12);border-color:rgba(64,184,216,.2)}
.card--violet .card__icon{background:rgba(26,125,163,.12);border-color:rgba(26,125,163,.2)}
.card--emerald .card__icon{background:rgba(16,185,129,.12);border-color:rgba(16,185,129,.2)}
.card--amber .card__icon{background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.2)}
.card--rose .card__icon{background:rgba(244,63,94,.12);border-color:rgba(244,63,94,.2)}

/* ── 13. METHODOLOGY (DISCOVER-DESIGN-DEPLOY-DRIVE) ─────────── */
.methodology{
  position:relative;
  overflow:hidden;
}
.methodology__inner{
  display:grid;grid-template-columns:1fr 1fr;
  align-items:center;gap:var(--sp-16);
}
.methodology__steps{
  display:flex;flex-direction:column;gap:0;
  position:relative;
}
.methodology__steps::before{
  content:'';
  position:absolute;left:22px;top:44px;bottom:44px;
  width:1px;
  background:linear-gradient(180deg,transparent,#2596be,transparent);
}
.method-step{
  display:flex;gap:var(--sp-5);
  padding:var(--sp-5) var(--sp-4);
  border-radius:var(--r-xl);
  cursor:pointer;
  transition:all var(--t-base);
}
.method-step:hover,.method-step.active{background:rgba(37,150,190,.07);border:1px solid var(--c-border)}
.method-step:not(.active){border:1px solid transparent}
.method-step__num{
  width:44px;height:44px;flex-shrink:0;
  background:rgba(37,150,190,.12);
  border:2px solid rgba(37,150,190,.25);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-sm);font-weight:var(--fw-extrabold);
  color:#7dd4ed;
  transition:all var(--t-base);
  position:relative;z-index:1;
}
.method-step.active .method-step__num{
  background:var(--g-brand);
  border-color:transparent;
  color:#fff;
  box-shadow:var(--shadow-btn);
}
.method-step__body{flex:1}
.method-step__title{
  font-size:var(--fs-base);font-weight:var(--fw-semibold);
  color:#f1f5f9;margin-bottom:var(--sp-2);
}
.method-step__desc{font-size:var(--fs-sm);color:#94a3b8;line-height:var(--lh-normal)}
.method-step__detail{
  margin-top:var(--sp-3);
  padding:var(--sp-4);
  background:rgba(37,150,190,.04);
  border-radius:var(--r-md);
  border-left:2px solid #2596be;
  display:none;
}
.method-step.active .method-step__detail{display:block}
.method-step__detail-list{list-style:none;display:flex;flex-direction:column;gap:var(--sp-2)}
.method-step__detail-list li{
  font-size:var(--fs-xs);color:#94a3b8;
  display:flex;align-items:center;gap:var(--sp-2);
}
.method-step__detail-list li::before{
  content:'✓';color:var(--c-emerald);font-weight:var(--fw-bold);flex-shrink:0;
}
.methodology__visual{position:relative;display:flex;align-items:center;justify-content:center}
.methodology__card{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-2xl);
  padding:var(--sp-8);
  max-width:440px;
  width:100%;
}
.method-phases{display:flex;flex-direction:column;gap:var(--sp-4)}
.phase-row{
  display:flex;align-items:center;gap:var(--sp-4);
  padding:var(--sp-4);
  background:rgba(255,255,255,.03);
  border:1px solid var(--c-border);
  border-radius:var(--r-lg);
}
.phase-badge{
  padding:var(--sp-1) var(--sp-3);
  border-radius:var(--r-full);
  font-size:var(--fs-xs);font-weight:var(--fw-bold);
  min-width:90px;text-align:center;
}
.phase-badge--1{background:rgba(37,150,190,.2);color:#7dd4ed;border:1px solid rgba(37,150,190,.3)}
.phase-badge--2{background:rgba(6,182,212,.15);color:#67e8f9;border:1px solid rgba(6,182,212,.3)}
.phase-badge--3{background:rgba(16,185,129,.15);color:#6ee7b7;border:1px solid rgba(16,185,129,.3)}
.phase-badge--4{background:rgba(245,158,11,.12);color:#fcd34d;border:1px solid rgba(245,158,11,.25)}
.phase-info{flex:1}
.phase-title{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:#f1f5f9}
.phase-sub{font-size:var(--fs-xs);color:#64748b;margin-top:2px}
.phase-week{font-size:var(--fs-xs);color:#64748b;white-space:nowrap}
@media(max-width:900px){
  .methodology__inner{grid-template-columns:1fr}
  .methodology__visual{display:none}
}

/* ── 14. INDUSTRY GRID ──────────────────────────────────────── */
.industries-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:var(--sp-4);
}
.industry-card{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-xl);
  padding:var(--sp-6);
  display:flex;flex-direction:column;gap:var(--sp-3);
  transition:all var(--t-slow);
  cursor:pointer;
  text-decoration:none;
}
.industry-card:hover{
  border-color:var(--c-border-bright);
  transform:translateY(-3px);
  box-shadow:0 8px 32px rgba(37,150,190,.2);
}
.industry-card__icon{font-size:1.875rem;line-height:1}
.industry-card__name{font-size:var(--fs-base);font-weight:var(--fw-semibold);color:#f1f5f9}
.industry-card__stat{
  font-size:var(--fs-xs);
  color:var(--c-emerald);
  font-weight:var(--fw-semibold);
  padding:2px var(--sp-2);
  background:rgba(16,185,129,.1);
  border-radius:var(--r-full);
  align-self:flex-start;
}
@media(max-width:1024px){.industries-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.industries-grid{grid-template-columns:repeat(2,1fr)}}

/* ── 15. STATS BAR ──────────────────────────────────────────── */
.stats-bar{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;
  background:var(--c-border);
  border:1px solid var(--c-border);
  border-radius:var(--r-2xl);
  overflow:hidden;
  margin-block:var(--sp-12);
}
.stat-cell{
  background:var(--c-surface);
  padding:var(--sp-8) var(--sp-6);
  text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);
}
.stat-cell__value{
  font-size:clamp(var(--fs-3xl),4vw,var(--fs-5xl));
  font-weight:var(--fw-extrabold);
  background:var(--g-brand);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  line-height:1;
}
.stat-cell__label{font-size:var(--fs-sm);color:#64748b;font-weight:var(--fw-medium)}
@media(max-width:768px){.stats-bar{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.stats-bar{grid-template-columns:1fr}}

/* ── 16. TESTIMONIALS ───────────────────────────────────────── */
.testimonials-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--sp-6);
}
.testimonial{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-2xl);
  padding:var(--sp-8);
}
.testimonial__stars{color:#f59e0b;font-size:var(--fs-sm);margin-bottom:var(--sp-4);letter-spacing:2px}
.testimonial__quote{
  font-size:var(--fs-base);
  color:#cbd5e1;
  line-height:var(--lh-normal);
  font-style:italic;
  margin-bottom:var(--sp-6);
}
.testimonial__author{display:flex;align-items:center;gap:var(--sp-3)}
.testimonial__avatar{
  width:48px;height:48px;
  border-radius:50%;
  background:var(--g-brand);
  display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-sm);font-weight:var(--fw-bold);color:#fff;
  flex-shrink:0;
  overflow:hidden;
  border:2px solid rgba(37,150,190,.35);
}
.testimonial__avatar img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center top;
  display:block;
}
.testimonial__name{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:#f1f5f9}
.testimonial__role{font-size:var(--fs-xs);color:#64748b}
.testimonial__placeholder-note{
  margin-top:var(--sp-4);
  padding:var(--sp-3);
  background:rgba(245,158,11,.08);
  border:1px solid rgba(245,158,11,.2);
  border-radius:var(--r-md);
  font-size:var(--fs-xs);
  color:#fcd34d;
}
@media(max-width:900px){.testimonials-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.testimonials-grid{grid-template-columns:1fr}}

/* ── 17. PRICING ────────────────────────────────────────────── */
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--sp-6);
  align-items:start;
}
.pricing-card{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-2xl);
  padding:var(--sp-8);
  position:relative;
  transition:all var(--t-slow);
}
.pricing-card:hover{border-color:var(--c-border-bright);transform:translateY(-4px)}
.pricing-card--featured{
  border-color:rgba(37,150,190,.4);
  background:linear-gradient(145deg,rgba(37,150,190,.08) 0%,#08111a 60%);
}
.pricing-card--featured::before{
  content:'';
  position:absolute;top:0;left:0;right:0;height:3px;
  background:var(--g-brand);
  border-radius:var(--r-2xl) var(--r-2xl) 0 0;
}
.pricing-badge{
  display:inline-block;
  padding:var(--sp-1) var(--sp-3);
  background:var(--g-brand);
  border-radius:var(--r-full);
  font-size:var(--fs-xs);font-weight:var(--fw-bold);color:#fff;
  margin-bottom:var(--sp-4);
}
.pricing-name{font-size:var(--fs-xl);font-weight:var(--fw-bold);color:#f1f5f9;margin-bottom:var(--sp-2);white-space:nowrap}
.pricing-price{
  font-size:var(--fs-4xl);font-weight:var(--fw-extrabold);color:#f8fafc;
  line-height:1;margin-bottom:var(--sp-2);
}
.pricing-price span{font-size:var(--fs-lg);font-weight:var(--fw-medium);color:#64748b}
.pricing-sub{font-size:var(--fs-xs);color:#64748b;margin-bottom:var(--sp-6)}
.pricing-divider{height:1px;background:var(--c-border);margin-block:var(--sp-6)}
.pricing-features{display:flex;flex-direction:column;gap:var(--sp-3);margin-bottom:var(--sp-8)}
.pricing-feature{
  display:flex;align-items:flex-start;gap:var(--sp-3);
  font-size:var(--fs-sm);color:#94a3b8;
}
.pricing-feature::before{
  content:'✓';color:var(--c-emerald);font-weight:var(--fw-bold);flex-shrink:0;
}
.pricing-note{
  font-size:var(--fs-xs);color:#64748b;font-style:italic;
  margin-top:var(--sp-4);
}
@media(max-width:900px){.pricing-grid{grid-template-columns:1fr}}

/* ── 18. CTA SECTION ────────────────────────────────────────── */
.cta-section{
  position:relative;overflow:hidden;
  padding-block:clamp(var(--sp-16),8vw,var(--sp-32));
}
.cta-section__bg{
  position:absolute;inset:0;
  background:radial-gradient(ellipse 70% 80% at 50% 50%,rgba(37,150,190,.15) 0%,transparent 70%);
  pointer-events:none;
}
.cta-section__inner{text-align:center;position:relative;z-index:1}
.cta-section__title{
  font-size:clamp(var(--fs-3xl),5vw,var(--fs-6xl));
  font-weight:var(--fw-extrabold);
  letter-spacing:-.025em;
  margin-bottom:var(--sp-5);
  color:#f8fafc;
}
.cta-section__desc{
  font-size:var(--fs-lg);color:#94a3b8;
  max-width:520px;margin-inline:auto;
  margin-bottom:var(--sp-10);
}
.cta-section__actions{
  display:flex;align-items:center;justify-content:center;
  flex-wrap:wrap;gap:var(--sp-4);
}
.cta-trust{
  display:flex;align-items:center;justify-content:center;gap:var(--sp-6);
  margin-top:var(--sp-8);flex-wrap:wrap;
}
.cta-trust-item{
  display:flex;align-items:center;gap:var(--sp-2);
  font-size:var(--fs-xs);color:#64748b;font-weight:var(--fw-medium);
}
.cta-trust-item svg{width:14px;height:14px;color:var(--c-emerald)}

/* ── 19. INSIGHTS / BLOG ────────────────────────────────────── */
.insights-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:var(--sp-6);
}
.insight-card{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-2xl);
  overflow:hidden;
  transition:all var(--t-slow);
}
.insight-card:hover{border-color:var(--c-border-bright);transform:translateY(-3px)}
.insight-card__img{
  height:180px;
  background:linear-gradient(135deg,rgba(37,150,190,.2),rgba(64,184,216,.15));
  display:flex;align-items:center;justify-content:center;
  font-size:3rem;
  position:relative;overflow:hidden;
}
.insight-card__img::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 50%,var(--c-surface));
}
.insight-card__body{padding:var(--sp-6)}
.insight-card__cat{
  font-size:var(--fs-xs);font-weight:var(--fw-semibold);
  color:var(--c-indigo);text-transform:uppercase;letter-spacing:.06em;
  margin-bottom:var(--sp-3);
}
.insight-card__title{
  font-size:var(--fs-lg);font-weight:var(--fw-bold);
  color:#f1f5f9;margin-bottom:var(--sp-3);line-height:1.35;
}
.insight-card__desc{font-size:var(--fs-sm);color:#94a3b8;line-height:var(--lh-normal)}
.insight-card__meta{
  display:flex;align-items:center;gap:var(--sp-4);
  margin-top:var(--sp-5);padding-top:var(--sp-4);
  border-top:1px solid var(--c-border);
  font-size:var(--fs-xs);color:#64748b;
}
@media(max-width:900px){.insights-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.insights-grid{grid-template-columns:1fr}}

/* ── 20. FOOTER ─────────────────────────────────────────────── */
.footer{
  background:var(--c-surface);
  border-top:1px solid var(--c-border);
  padding-top:var(--sp-16);
  padding-bottom:var(--sp-8);
}
.footer__grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:var(--sp-10);
  padding-bottom:var(--sp-12);
  border-bottom:1px solid var(--c-border);
}
.footer__brand{display:flex;flex-direction:column;gap:var(--sp-4)}
.footer__logo{
  display:flex;align-items:center;gap:var(--sp-3);
  font-size:var(--fs-xl);font-weight:var(--fw-extrabold);color:#fff;
}
.footer__desc{font-size:var(--fs-sm);color:#64748b;line-height:var(--lh-normal);max-width:280px}
.footer__socials{display:flex;gap:var(--sp-3);margin-top:var(--sp-2)}
.footer__social{
  width:36px;height:36px;
  background:rgba(255,255,255,.05);
  border:1px solid var(--c-border);
  border-radius:var(--r-md);
  display:flex;align-items:center;justify-content:center;
  color:#64748b;font-size:var(--fs-sm);
  transition:all var(--t-base);
}
.footer__social:hover{background:rgba(37,150,190,.15);border-color:rgba(37,150,190,.35);color:#7dd4ed}
.footer__col-title{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:#f1f5f9;margin-bottom:var(--sp-5)}
.footer__links{display:flex;flex-direction:column;gap:var(--sp-3)}
.footer__link{
  font-size:var(--fs-sm);color:#64748b;
  transition:color var(--t-fast);
}
.footer__link:hover{color:#7dd4ed}
.footer__bottom{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:var(--sp-4);
  padding-top:var(--sp-8);
  font-size:var(--fs-xs);color:#475569;
}
.footer__legal{display:flex;gap:var(--sp-5);flex-wrap:wrap}
.footer__legal a{color:#475569;transition:color var(--t-fast)}
.footer__legal a:hover{color:#94a3b8}
@media(max-width:900px){.footer__grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.footer__grid{grid-template-columns:1fr}}

/* ── 21. PAGE HERO (inner pages) ────────────────────────────── */
.page-hero{
  padding-top:calc(var(--nav-h) + clamp(var(--sp-16),6vw,var(--sp-24)));
  padding-bottom:clamp(var(--sp-12),5vw,var(--sp-20));
  text-align:center;
  position:relative;overflow:hidden;
}
.page-hero__bg{
  position:absolute;inset:0;
  background:var(--g-hero);
  pointer-events:none;
}
.page-hero__grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(37,150,190,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(37,150,190,.05) 1px,transparent 1px);
  background-size:60px 60px;
  pointer-events:none;
}
.page-hero__content{position:relative;z-index:1}
.page-hero__title{
  font-size:clamp(var(--fs-3xl),5vw,var(--fs-6xl));
  font-weight:var(--fw-extrabold);
  letter-spacing:-.025em;
  margin-bottom:var(--sp-5);
  color:#f8fafc;
}
.page-hero__desc{
  font-size:var(--fs-lg);color:#94a3b8;
  max-width:600px;margin-inline:auto;
}

/* ── 22. TABS ───────────────────────────────────────────────── */
.tabs{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-bottom:var(--sp-8)}
.tab-btn{
  padding:var(--sp-2) var(--sp-5);
  background:rgba(255,255,255,.04);
  border:1px solid var(--c-border);
  border-radius:var(--r-full);
  font-size:var(--fs-sm);font-weight:var(--fw-medium);
  color:#94a3b8;cursor:pointer;
  transition:all var(--t-base);
}
.tab-btn:hover{border-color:var(--c-border-bright);color:#fff}
.tab-btn.active{
  background:rgba(37,150,190,.15);
  border-color:rgba(37,150,190,.4);
  color:#7dd4ed;
}
.tab-panel{display:none}
.tab-panel.active{display:block}

/* ── 23. ACCORDION / FAQ ────────────────────────────────────── */
.faq{display:flex;flex-direction:column;gap:var(--sp-3)}
.faq-item{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-xl);
  overflow:hidden;
  transition:border-color var(--t-base);
}
.faq-item.open{border-color:rgba(37,150,190,.35)}
.faq-item__q{
  display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);
  padding:var(--sp-5) var(--sp-6);
  cursor:pointer;
  font-size:var(--fs-base);font-weight:var(--fw-semibold);color:#f1f5f9;
}
.faq-item__q:hover{color:#7dd4ed}
.faq-item__chevron{
  width:20px;height:20px;flex-shrink:0;
  color:#64748b;transition:transform var(--t-base);
}
.faq-item.open .faq-item__chevron{transform:rotate(180deg);color:#2596be}
.faq-item__a{
  padding:0 var(--sp-6) var(--sp-5);
  font-size:var(--fs-sm);color:#94a3b8;line-height:var(--lh-normal);
  display:none;
}
.faq-item.open .faq-item__a{display:block}

/* ── 24. CONTACT FORM ───────────────────────────────────────── */
.form-group{display:flex;flex-direction:column;gap:var(--sp-2)}
.form-label{font-size:var(--fs-sm);font-weight:var(--fw-medium);color:#94a3b8}
.form-input,.form-textarea,.form-select{
  background:rgba(255,255,255,.04);
  border:1px solid var(--c-border);
  border-radius:var(--r-lg);
  padding:var(--sp-4);
  font-size:var(--fs-sm);
  color:#f1f5f9;
  transition:all var(--t-base);
  width:100%;
}
.form-input:focus,.form-textarea:focus,.form-select:focus{
  outline:none;
  border-color:#2596be;
  box-shadow:0 0 0 3px rgba(37,150,190,.15);
  background:rgba(37,150,190,.04);
}
.form-input::placeholder,.form-textarea::placeholder{color:#475569}
.form-textarea{resize:vertical;min-height:140px}
.form-select option{background:var(--c-surface);color:#f1f5f9}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5)}
@media(max-width:640px){.form-grid{grid-template-columns:1fr}}

/* ── 25. CASE STUDY CARDS ───────────────────────────────────── */
.cs-card{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-2xl);
  padding:var(--sp-8);
  display:flex;gap:var(--sp-8);
  transition:all var(--t-slow);
}
.cs-card:hover{border-color:var(--c-border-bright);transform:translateY(-2px)}
.cs-card__left{flex:1}
.cs-card__badges{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-bottom:var(--sp-4)}
.cs-badge{
  padding:var(--sp-1) var(--sp-3);
  border-radius:var(--r-full);
  font-size:var(--fs-xs);font-weight:var(--fw-semibold);
}
.cs-badge--illustrative{
  background:rgba(245,158,11,.12);
  border:1px solid rgba(245,158,11,.3);
  color:#fcd34d;
}
.cs-badge--industry{
  background:rgba(37,150,190,.1);
  border:1px solid rgba(37,150,190,.25);
  color:#7dd4ed;
}
.cs-card__title{font-size:var(--fs-2xl);font-weight:var(--fw-bold);color:#f1f5f9;margin-bottom:var(--sp-4)}
.cs-card__desc{font-size:var(--fs-base);color:#94a3b8;line-height:var(--lh-normal);margin-bottom:var(--sp-6)}
.cs-card__cols{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5)}
.cs-section-title{font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.08em;color:#64748b;margin-bottom:var(--sp-3)}
.cs-list{display:flex;flex-direction:column;gap:var(--sp-2)}
.cs-list li{font-size:var(--fs-sm);color:#94a3b8;padding-left:var(--sp-4);position:relative}
.cs-list li::before{content:'→';position:absolute;left:0;color:var(--c-indigo)}
.cs-card__right{
  width:220px;flex-shrink:0;
  display:flex;flex-direction:column;gap:var(--sp-4);
}
.cs-metric{
  background:rgba(255,255,255,.03);
  border:1px solid var(--c-border);
  border-radius:var(--r-lg);
  padding:var(--sp-4);text-align:center;
}
.cs-metric__value{
  font-size:var(--fs-3xl);font-weight:var(--fw-extrabold);
  background:var(--g-brand);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.cs-metric__label{font-size:var(--fs-xs);color:#64748b;margin-top:var(--sp-1)}
.cs-metric__note{font-size:9px;color:#475569;font-style:italic;margin-top:2px}
.cs-quote{
  background:rgba(37,150,190,.07);
  border:1px solid rgba(37,150,190,.2);
  border-radius:var(--r-lg);
  padding:var(--sp-4);
  font-size:var(--fs-xs);
  color:#94a3b8;
  font-style:italic;
}
@media(max-width:900px){.cs-card{flex-direction:column}.cs-card__right{width:100%;flex-direction:row;flex-wrap:wrap}}
@media(max-width:600px){.cs-card__cols{grid-template-columns:1fr}}

/* ── 26. SERVICES PAGE ──────────────────────────────────────── */
.service-block{
  display:grid;grid-template-columns:1fr 1fr;
  gap:var(--sp-16);align-items:start;
  padding-block:var(--sp-16);
  border-bottom:1px solid var(--c-border);
}
.service-block:last-child{border-bottom:none}
.service-block--reverse{direction:rtl}
.service-block--reverse>*{direction:ltr}
.service-block__badge{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  padding:var(--sp-1) var(--sp-3);
  background:rgba(37,150,190,.1);
  border:1px solid rgba(37,150,190,.25);
  border-radius:var(--r-full);
  font-size:var(--fs-xs);font-weight:var(--fw-semibold);
  color:#7dd4ed;margin-bottom:var(--sp-5);
}
.service-block__title{
  font-size:clamp(var(--fs-2xl),3vw,var(--fs-4xl));
  font-weight:var(--fw-extrabold);
  margin-bottom:var(--sp-4);
  line-height:1.2;
}
.service-block__desc{font-size:var(--fs-base);color:#94a3b8;line-height:var(--lh-normal);margin-bottom:var(--sp-6)}
.use-cases{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4);margin-bottom:var(--sp-6)}
.use-case{
  background:rgba(255,255,255,.03);
  border:1px solid var(--c-border);
  border-radius:var(--r-lg);
  padding:var(--sp-4);
}
.use-case__icon{font-size:1.25rem;margin-bottom:var(--sp-2)}
.use-case__title{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:#f1f5f9;margin-bottom:var(--sp-1)}
.use-case__desc{font-size:var(--fs-xs);color:#64748b;line-height:1.5}
.tech-stack{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-4)}
.tech-tag{
  padding:var(--sp-1) var(--sp-3);
  background:rgba(255,255,255,.04);
  border:1px solid var(--c-border);
  border-radius:var(--r-md);
  font-size:var(--fs-xs);color:#94a3b8;
  font-family:monospace;
}
@media(max-width:900px){
  .service-block{grid-template-columns:1fr}
  .service-block--reverse{direction:ltr}
}

/* ── 27. INDUSTRY PAGE ──────────────────────────────────────── */
.industry-hero-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:var(--sp-4);margin-bottom:var(--sp-8);
}
.industry-detail-card{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-2xl);
  padding:var(--sp-8);
}
.industry-detail-card__header{
  display:flex;align-items:center;gap:var(--sp-4);
  margin-bottom:var(--sp-6);
}
.industry-detail-card__icon{
  font-size:2.5rem;
  width:64px;height:64px;
  background:rgba(37,150,190,.1);
  border:1px solid rgba(37,150,190,.2);
  border-radius:var(--r-xl);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.industry-detail-card__meta{display:flex;flex-direction:column;gap:var(--sp-1)}
.industry-detail-card__name{font-size:var(--fs-xl);font-weight:var(--fw-bold);color:#f1f5f9}
.industry-detail-card__stat{
  font-size:var(--fs-sm);font-weight:var(--fw-semibold);
  color:var(--c-emerald);
}
.industry-detail-card__desc{font-size:var(--fs-sm);color:#94a3b8;line-height:var(--lh-normal);margin-bottom:var(--sp-6)}
.industry-uc-list{display:flex;flex-direction:column;gap:var(--sp-3)}
.industry-uc-item{
  display:flex;align-items:flex-start;gap:var(--sp-3);
  padding:var(--sp-3) var(--sp-4);
  background:rgba(37,150,190,.03);
  border-radius:var(--r-lg);
  border:1px solid var(--c-border);
}
.industry-uc-item__icon{font-size:1.125rem;flex-shrink:0;line-height:1.5}
.industry-uc-item__text{flex:1}
.industry-uc-item__title{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:#f1f5f9}
.industry-uc-item__desc{font-size:var(--fs-xs);color:#64748b;margin-top:2px;line-height:1.5}

/* ── 28. ABOUT PAGE ─────────────────────────────────────────── */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6)}
.team-photo-wrap{width:100%;border-radius:var(--r-2xl);overflow:hidden;border:1px solid var(--c-border);box-shadow:0 24px 64px rgba(0,0,0,.45)}
.team-photo{width:100%;height:auto;display:block;}
.team-card{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-2xl);
  padding:var(--sp-8);text-align:center;
  transition:all var(--t-slow);
}
.team-card:hover{border-color:var(--c-border-bright);transform:translateY(-3px)}
.team-avatar{
  width:90px;height:90px;
  border-radius:50%;
  background:var(--g-brand);
  display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-2xl);font-weight:var(--fw-bold);color:#fff;
  margin:0 auto var(--sp-5);
  border:3px solid rgba(37,150,190,.35);
  overflow:hidden;
  flex-shrink:0;
}
.team-avatar img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center top;
  display:block;
}
.team-name{font-size:var(--fs-xl);font-weight:var(--fw-bold);color:#f1f5f9;margin-bottom:var(--sp-1)}
.team-role{font-size:var(--fs-sm);color:var(--c-indigo);font-weight:var(--fw-semibold);margin-bottom:var(--sp-4)}
.team-bio{font-size:var(--fs-sm);color:#94a3b8;line-height:var(--lh-normal)}
.team-placeholder-note{
  margin-top:var(--sp-4);
  padding:var(--sp-2) var(--sp-3);
  background:rgba(245,158,11,.08);
  border:1px solid rgba(245,158,11,.2);
  border-radius:var(--r-md);
  font-size:10px;color:#fcd34d;
}
.cert-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-5)}
.cert-card{
  background:var(--g-card);
  border:1px solid var(--c-border);
  border-radius:var(--r-xl);
  padding:var(--sp-6);
  display:flex;flex-direction:column;align-items:center;gap:var(--sp-3);
  text-align:center;
}
.cert-icon{font-size:2.5rem;line-height:1}
.cert-name{font-size:var(--fs-base);font-weight:var(--fw-bold);color:#f1f5f9}
.cert-desc{font-size:var(--fs-xs);color:#64748b;line-height:1.5}
.cert-status{
  padding:var(--sp-1) var(--sp-3);
  border-radius:var(--r-full);
  font-size:10px;font-weight:var(--fw-bold);
}
.cert-status--add{background:rgba(245,158,11,.1);color:#fcd34d;border:1px solid rgba(245,158,11,.2)}
.values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-5)}
@media(max-width:900px){.team-grid,.cert-grid,.values-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.team-grid,.cert-grid,.values-grid{grid-template-columns:1fr}}

/* ── 29. ANIMATIONS ─────────────────────────────────────────── */
.fade-up{
  opacity:0;
  transform:translateY(32px);
  transition:opacity .7s ease,transform .7s ease;
}
.fade-up.visible{opacity:1;transform:translateY(0)}

.stagger-1{transition-delay:.1s}
.stagger-2{transition-delay:.2s}
.stagger-3{transition-delay:.3s}
.stagger-4{transition-delay:.4s}
.stagger-5{transition-delay:.5s}
.stagger-6{transition-delay:.6s}

/* ── 30. BREADCRUMB ─────────────────────────────────────────── */
.breadcrumb{
  display:flex;align-items:center;gap:var(--sp-2);
  font-size:var(--fs-sm);color:#64748b;
  margin-bottom:var(--sp-4);
  flex-wrap:wrap;
}
.breadcrumb a{color:#64748b;transition:color var(--t-fast)}
.breadcrumb a:hover{color:#7dd4ed}
.breadcrumb__sep{color:#334155}

/* ── 31. PROCESS STEPS ──────────────────────────────────────── */
.process-steps{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:var(--sp-4);
  position:relative;
}
.process-steps::before{
  content:'';
  position:absolute;top:28px;left:calc(12.5%);right:calc(12.5%);
  height:1px;
  background:linear-gradient(90deg,transparent,var(--c-indigo),transparent);
  pointer-events:none;
}
.process-step{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:var(--sp-4);
}
.process-step__num{
  width:56px;height:56px;
  background:var(--g-brand);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-lg);font-weight:var(--fw-extrabold);color:#fff;
  box-shadow:var(--shadow-btn);
  position:relative;z-index:1;
  flex-shrink:0;
}
.process-step__title{font-size:var(--fs-base);font-weight:var(--fw-bold);color:#f1f5f9}
.process-step__desc{font-size:var(--fs-xs);color:#94a3b8;line-height:1.5}
@media(max-width:768px){.process-steps{grid-template-columns:1fr 1fr}.process-steps::before{display:none}}
@media(max-width:480px){.process-steps{grid-template-columns:1fr}}

/* ── 32. MISC UTILITIES ─────────────────────────────────────── */
.badge{
  display:inline-flex;align-items:center;
  padding:var(--sp-1) var(--sp-3);
  border-radius:var(--r-full);
  font-size:var(--fs-xs);font-weight:var(--fw-semibold);
}
.badge--indigo{background:rgba(37,150,190,.12);color:#7dd4ed;border:1px solid rgba(37,150,190,.2)}
.badge--emerald{background:rgba(16,185,129,.12);color:#6ee7b7;border:1px solid rgba(16,185,129,.2)}
.badge--amber{background:rgba(245,158,11,.1);color:#fcd34d;border:1px solid rgba(245,158,11,.2)}
.badge--rose{background:rgba(244,63,94,.1);color:#fda4af;border:1px solid rgba(244,63,94,.2)}

.divider{height:1px;background:var(--c-border);margin-block:var(--sp-8)}

.highlight-box{
  background:rgba(37,150,190,.07);
  border:1px solid rgba(37,150,190,.2);
  border-left:3px solid #2596be;
  border-radius:var(--r-lg);
  padding:var(--sp-5) var(--sp-6);
}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Responsive helpers */
.hide-mobile{display:block}
@media(max-width:640px){.hide-mobile{display:none}}
.show-mobile{display:none}
@media(max-width:640px){.show-mobile{display:block}}

/* ── 33. PRINT ──────────────────────────────────────────────── */
@media print{
  .nav,.footer,.hero__dashboard,.cta-section{display:none}
  body{background:#fff;color:#000}
}

/* ═══════════════════════════════════════════════════════════════
   34. MOBILE OPTIMISATION — Full Coverage ≤ 768px / ≤ 480px
   ═══════════════════════════════════════════════════════════════ */

/* ── Touch targets ── */
a,button,[role="button"]{-webkit-tap-highlight-color:transparent}

/* ── 34a. Navigation ── */
@media(max-width:900px){
  /* Keep one CTA visible in nav */
  .nav__actions .btn--primary{display:inline-flex;font-size:var(--fs-xs);padding:.45rem 1rem}
  .nav__actions{gap:var(--sp-2)}
}
@media(max-width:480px){
  /* Hide primary CTA too on very small screens — burger handles it */
  .nav__actions .btn--primary{display:none}
  .nav__logo-img{height:36px}
}
/* Mobile menu links need enough tap height */
.nav__mobile .nav__link{
  min-height:48px;display:flex;align-items:center;
  border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4);
}
.nav__mobile .btn--primary{
  width:100%;justify-content:center;margin-top:var(--sp-4);
  padding:.875rem var(--sp-6);font-size:var(--fs-base);
}

/* ── 34b. Hero ── */
@media(max-width:768px){
  .hero{min-height:auto;padding-top:var(--nav-h)}
  .hero__content{
    grid-template-columns:1fr;
    gap:var(--sp-10);
    padding-block:var(--sp-14) var(--sp-10);
    text-align:center;
  }
  .hero__title{font-size:clamp(2rem,8vw,2.75rem);letter-spacing:-.02em}
  .hero__sub{font-size:var(--fs-base);max-width:100%;margin-inline:auto}
  .hero__eyebrow{margin-inline:auto}
  .hero__actions{justify-content:center;flex-direction:column;align-items:stretch}
  .hero__actions .btn{width:100%;justify-content:center;text-align:center}
  .hero__proof{
    justify-content:center;gap:var(--sp-6);
    padding-top:var(--sp-8);
  }
  .hero__proof-item{align-items:center}
  .hero__dashboard{display:none} /* hide dashboard widget on mobile */
}
@media(max-width:480px){
  .hero__title{font-size:clamp(1.85rem,7.5vw,2.25rem)}
  .hero__proof{flex-wrap:wrap;gap:var(--sp-4) var(--sp-8)}
  .hero__proof-value{font-size:var(--fs-xl)}
  .hero__orb--1,.hero__orb--2{width:200px;height:200px}
}

/* ── 34c. Trust bar ── */
@media(max-width:640px){
  .trust-bar__inner{gap:var(--sp-4) var(--sp-6)}
  .trust-item{font-size:var(--fs-xs)}
}

/* ── 34d. Buttons — full width on mobile ── */
@media(max-width:480px){
  .btn--lg{padding:.875rem 1.5rem;font-size:var(--fs-sm)}
  /* CTA section buttons stack & stretch */
  .cta-section__actions{flex-direction:column;align-items:stretch;max-width:320px;margin-inline:auto}
  .cta-section__actions .btn{width:100%;justify-content:center}
}

/* ── 34e. Section titles ── */
@media(max-width:480px){
  .section-title{font-size:clamp(1.5rem,6vw,1.875rem)}
  .section-desc{font-size:var(--fs-base)}
  .page-hero__title{font-size:clamp(1.75rem,7vw,2.25rem)}
  .page-hero__desc{font-size:var(--fs-base)}
}

/* ── 34f. Cards ── */
@media(max-width:640px){
  .card{padding:var(--sp-6)}
  .card__title{font-size:var(--fs-lg)}
}

/* ── 34g. Methodology ── */
@media(max-width:640px){
  .method-step{padding:var(--sp-4) var(--sp-3)}
  .method-step__detail{padding:var(--sp-3)}
}

/* ── 34h. Services page ── */
@media(max-width:768px){
  .service-block{gap:var(--sp-10);padding-block:var(--sp-10)}
  .use-cases{grid-template-columns:1fr}
  .service-block__title{font-size:var(--fs-2xl)}
}
@media(max-width:480px){
  .use-case{padding:var(--sp-3)}
}

/* ── 34i. Industries page ── */
@media(max-width:768px){
  .industry-hero-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .industry-hero-grid{grid-template-columns:1fr}
  .industry-detail-card{padding:var(--sp-6)}
  .industry-detail-card__header{flex-wrap:wrap}
}

/* ── 34j. Case studies ── */
@media(max-width:640px){
  .cs-card{padding:var(--sp-6)}
  .cs-card__title{font-size:var(--fs-xl)}
  .cs-card__right{flex-direction:column}
  .cs-metric__value{font-size:var(--fs-2xl)}
}

/* ── 34k. Testimonials ── */
@media(max-width:480px){
  .testimonial{padding:var(--sp-6)}
  .testimonial__quote{font-size:var(--fs-sm)}
}

/* ── 34l. Pricing ── */
@media(max-width:640px){
  .pricing-card{padding:var(--sp-6)}
  .pricing-price{font-size:var(--fs-3xl)}
  .pricing-name{white-space:normal}
}

/* ── 34m. Stats bar ── */
@media(max-width:480px){
  .stat-cell{padding:var(--sp-6) var(--sp-4)}
  .stat-cell__value{font-size:var(--fs-3xl)}
}

/* ── 34n. About page — inline grids ── */
/* The 4D framework two-column block */
@media(max-width:768px){
  .about-framework-grid{grid-template-columns:1fr !important}
  .about-stats-grid{grid-template-columns:1fr 1fr !important}
}
@media(max-width:480px){
  .about-stats-grid{grid-template-columns:1fr !important}
  .team-photo{border-radius:var(--r-xl)}
}

/* ── 34o. Contact page — inline two-column layout ── */
@media(max-width:768px){
  .contact-layout{grid-template-columns:1fr !important;gap:var(--sp-10) !important}
}
@media(max-width:480px){
  .contact-layout .form-group{gap:var(--sp-2)}
}

/* ── 34p. Insights page ── */
@media(max-width:768px){
  .insight-full-card{flex-direction:column}
}
@media(max-width:480px){
  .insight-full-card__body{padding:var(--sp-5)}
}

/* ── 34q. Article pages ── */
@media(max-width:768px){
  .article-hero{padding-left:var(--sp-4);padding-right:var(--sp-4)}
  .article-title{font-size:clamp(1.75rem,6vw,2.25rem) !important}
  .article-body{padding:var(--sp-8) var(--sp-4) !important}
  .article-cta{padding:var(--sp-6) !important}
  .article-cta h3{font-size:var(--fs-xl) !important}
  .article-cta .btn{width:100%;justify-content:center}
}
@media(max-width:480px){
  .article-title{font-size:clamp(1.5rem,6vw,1.875rem) !important}
  .article-subtitle{font-size:var(--fs-base) !important}
  .article-body h2{font-size:var(--fs-xl)}
  .article-body p,.article-body li{font-size:var(--fs-base);line-height:1.7}
}

/* ── 34r. Footer ── */
@media(max-width:600px){
  .footer{padding-top:var(--sp-10)}
  .footer__desc{max-width:100%}
  .footer__bottom{flex-direction:column;align-items:flex-start;gap:var(--sp-3)}
  .footer__legal{gap:var(--sp-3);flex-wrap:wrap}
}
@media(max-width:480px){
  .footer__grid{gap:var(--sp-8)}
}

/* ── 34s. FAQ ── */
@media(max-width:480px){
  .faq-item__q{font-size:var(--fs-sm);padding:var(--sp-4) var(--sp-5)}
  .faq-item__a{padding:0 var(--sp-5) var(--sp-4);font-size:var(--fs-xs)}
}

/* ── 34t. Forms ── */
@media(max-width:480px){
  .form-input,.form-textarea,.form-select{font-size:16px} /* prevent iOS zoom */
  .form-textarea{min-height:120px}
}

/* ── 34u. Page hero breadcrumb ── */
@media(max-width:480px){
  .breadcrumb{font-size:var(--fs-xs)}
  .page-hero{padding-top:calc(var(--nav-h) + var(--sp-10));padding-bottom:var(--sp-10)}
}

/* ── 34v. Tabs / filter bar ── */
@media(max-width:640px){
  .tabs{gap:var(--sp-2);justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:var(--sp-2);-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tab-btn{flex-shrink:0;font-size:var(--fs-xs);padding:var(--sp-2) var(--sp-4);white-space:nowrap}
}

/* ── 34w. CTA section ── */
@media(max-width:640px){
  .cta-section__title{font-size:clamp(1.75rem,6vw,2.25rem)}
  .cta-section__desc{font-size:var(--fs-base)}
  .cta-trust{gap:var(--sp-4)}
}

/* ── 34x. Highlight box / callout ── */
@media(max-width:640px){
  .highlight-box{padding:var(--sp-4) var(--sp-5)}
  .article-callout{padding:var(--sp-4) var(--sp-5) !important}
}

/* ── 34y. Images — prevent overflow ── */
img,video,iframe,embed,object{max-width:100%}
@media(max-width:640px){
  .team-photo-wrap{border-radius:var(--r-xl)}
}

/* ── 34z. About — framework benefit grid (3-col inline) ── */
.about-benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6);max-width:900px;margin-inline:auto}
@media(max-width:768px){
  .about-benefit-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .about-benefit-grid{grid-template-columns:1fr}
}

/* ── 34aa. Index — card stat mini-grids (2-col inline in home cards) ── */
.card-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:1.5rem}
@media(max-width:360px){
  .card-stat-grid{grid-template-columns:1fr}
}

/* ── 34ab. Overflow safety ── */
@media(max-width:640px){
  .hero__proof{overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:wrap}
  .section-header{padding-inline:var(--sp-2)}
  .highlight-box{word-break:break-word}
  .tech-stack{justify-content:flex-start}
}

/* ── 34ac. Nav logo height clamp on very small screens ── */
@media(max-width:360px){
  .nav__logo-img{height:32px}
}

/* ── 34ad. Contact info block ── */
.contact-info-grid{display:flex;flex-direction:column;gap:var(--sp-6)}
@media(min-width:600px){
  .contact-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}
}

/* ── 34ae. Ensure no horizontal scroll on any page ── */
html,body{overflow-x:hidden}
.container{width:100%}

/* ── 34af. Mobile-friendly focus styles ── */
:focus-visible{outline:2px solid var(--c-indigo);outline-offset:3px;border-radius:var(--r-sm)}