/* ═══════════════════════════════════════════════════════════
   SWAKSHAT ANALYTICS — style.css  v4
   Typography: Outfit (display) + Inter (body)
   Spacing: 8px base grid, Bootstrap-compatible breakpoints
═══════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Inter:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --bg:           #050d1a;
  --bg2:          #080f1e;
  --bg3:          #0b1527;
  --surface:      #0f1d32;
  --surface2:     #142240;
  --border:       rgba(255,255,255,0.07);
  --border-accent:rgba(0,140,255,0.35);
  --text:         #dde8f5;
  --text-muted:   #6e90b5;
  --text-dim:     #374f6a;
  --accent:       #0088ff;
  --accent2:      #00cfaa;
  --accent3:      #f97316;
  --accent-glow:  rgba(0,136,255,0.18);
  --accent2-glow: rgba(0,207,170,0.14);
  --nav-bg:       rgba(5,13,26,0.92);
  --font-display: 'Outfit', sans-serif;
  --font-body:    'Inter', sans-serif;
  --font-mono:    'JetBrains Mono', monospace;
  --section-pad:  4.5rem 0;
  --container:    1200px;
  --radius:       10px;
  --radius-lg:    16px;
  --tr:           0.28s cubic-bezier(0.4,0,0.2,1);
}

[data-theme="light"] {
  --bg:#f0f5fb; --bg2:#e3edf8; --bg3:#d4e4f4;
  --surface:#ffffff; --surface2:#e8f1fb;
  --border:rgba(0,0,0,0.08); --border-accent:rgba(0,100,200,0.28);
  --text:#0a1828; --text-muted:#3d5a7a; --text-dim:#8aa3bd;
  --accent:#006ecc; --accent2:#009980; --accent3:#d05a00;
  --accent-glow:rgba(0,110,204,0.12); --accent2-glow:rgba(0,153,128,0.1);
  --nav-bg:rgba(240,245,251,0.94);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-body);background:var(--bg);color:var(--text);line-height:1.65;overflow-x:hidden;transition:background .4s,color .4s;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}
button{cursor:pointer;border:none;background:none;font-family:var(--font-body)}
.container{max-width:var(--container);margin:0 auto;padding:0 1.5rem}
.section{padding:var(--section-pad)}

/* ── SECTION HEADER ── */
.section-header{text-align:center;max-width:620px;margin:0 auto 2.5rem}
.section-tag{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-mono);font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);background:var(--accent-glow);border:1px solid var(--border-accent);border-radius:30px;padding:.22rem .85rem;margin-bottom:.85rem}
.section-header h2{font-family:var(--font-display);font-size:clamp(1.5rem,3vw,2.25rem);font-weight:800;line-height:1.18;letter-spacing:-.02em;margin-bottom:.75rem}
.section-header p{color:var(--text-muted);font-size:1rem;line-height:1.7;text-align:center}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-display);font-weight:600;font-size:.875rem;letter-spacing:.02em;padding:.55rem 1.3rem;border-radius:8px;transition:all var(--tr);cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--accent);color:#fff;border:2px solid var(--accent)}
.btn-primary:hover{background:transparent;color:var(--accent);box-shadow:0 0 24px var(--accent-glow)}
.btn-ghost{background:rgba(255,255,255,.06);color:var(--text);border:1.5px solid var(--border);backdrop-filter:blur(8px)}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent)}
.btn-outline{background:transparent;color:var(--accent);border:1.5px solid var(--accent);font-size:.75rem;padding:.42rem 1rem}
.btn-outline:hover{background:var(--accent);color:#fff}
.btn-lg{padding:.75rem 1.8rem;font-size:1rem}
.btn-glow{box-shadow:0 0 20px var(--accent-glow)}
.btn-glow:hover{box-shadow:0 0 36px rgba(0,136,255,.45)}

/* ══════ PRELOADER ══════ */
.preloader{position:fixed;inset:0;z-index:9999;background:var(--bg);display:flex;align-items:center;justify-content:center;transition:opacity .6s ease,visibility .6s ease}
.preloader.done{opacity:0;visibility:hidden}
.pre-inner{text-align:center}
.pre-logo{width:160px;height:160px;background:transparent;border-radius:0;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;animation:prePulse 1.4s ease-in-out infinite;}
.pre-text{font-family:var(--font-display);font-size:1.15rem;font-weight:800;color:#F5A623;letter-spacing:.04em;text-transform:uppercase;margin-bottom:.2rem;white-space:nowrap}
.pre-tagline{font-family:var(--font-display);font-size:.65rem;font-weight:600;color:#4A90D9;letter-spacing:.06em;text-transform:uppercase;text-align:center;margin-bottom:1rem;white-space:nowrap}
.pre-bar{width:190px;height:2px;background:var(--border);border-radius:2px;margin:0 auto .75rem;overflow:hidden}
.pre-fill{height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:2px;transition:width .05s linear}
.pre-label{font-size:.65rem;color:var(--text-dim);letter-spacing:.07em;font-family:var(--font-mono)}
@keyframes prePulse{0%,100%{box-shadow:0 0 0 0 var(--accent-glow)}50%{box-shadow:0 0 0 12px rgba(0,136,255,0)}}

/* ══════ NAVBAR ══════ */
.navbar{position:fixed;top:0;left:0;right:0;z-index:1000;background:var(--nav-bg);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);transition:box-shadow var(--tr),background .4s}
.navbar.scrolled{box-shadow:0 2px 32px rgba(0,0,0,.4)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;}
.logo-mark{width:32px;height:32px;background:linear-gradient(135deg,var(--accent),var(--accent2));border-radius:7px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:.75rem;font-weight:800;color:#fff;flex-shrink:0}
.logo-icon{width:48px;height:48px;object-fit:contain;flex-shrink:0;display:block;filter:drop-shadow(0 0 6px rgba(251,169,25,0.35));}
.logo-text{display:flex;flex-direction:column;align-items:center;gap:1px;line-height:1;}.logo-name{font-family:var(--font-display);font-size:1rem;font-weight:800;color:#F5A623;letter-spacing:.04em;white-space:nowrap;}.logo-tagline{font-family:var(--font-display);font-size:.62rem;font-weight:600;color:#4A90D9;letter-spacing:.06em;white-space:nowrap;text-align:center;width:100%;}

.nav-links{display:flex;align-items:center;gap:1.75rem}
.nav-links a{font-family:var(--font-display);font-weight:600;font-size:.85rem;color:var(--text-muted);transition:color var(--tr);position:relative}
.nav-links a::after{content:'';position:absolute;bottom:-4px;left:0;right:0;height:2px;background:var(--accent);transform:scaleX(0);transition:transform var(--tr)}
.nav-links a:hover,.nav-links a.active{color:var(--text)}
.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1)}
.nav-actions{display:flex;align-items:center;gap:.7rem}
.theme-toggle{width:34px;height:34px;border-radius:50%;background:var(--surface2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:.88rem;transition:all var(--tr);position:relative}
.theme-toggle:hover{border-color:var(--accent)}
.icon-sun,.icon-moon{position:absolute;transition:opacity .3s,transform .3s}
[data-theme="dark"] .icon-sun{opacity:1;transform:scale(1)}
[data-theme="dark"] .icon-moon{opacity:0;transform:scale(.5)}
[data-theme="light"] .icon-sun{opacity:0;transform:scale(.5)}
[data-theme="light"] .icon-moon{opacity:1;transform:scale(1)}
.hamburger{display:none;flex-direction:column;gap:5px;width:30px;padding:4px}
.hamburger span{display:block;height:2px;background:var(--text);border-radius:2px;transition:all var(--tr)}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ══════════════════════════════════════════════════════
   HERO — REDESIGNED
   Clean hierarchy · Proper spacing · Responsive floats
══════════════════════════════════════════════════════ */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding-top: 72px; /* navbar offset */
  background:
    /* fine grid lines for engineering feel */
    linear-gradient(rgba(0,136,255,0.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,136,255,0.028) 1px, transparent 1px),
    /* base dark */
    radial-gradient(ellipse 120% 100% at 70% 50%, rgba(0,20,50,1) 0%, rgba(2,8,20,1) 100%);
  background-size: 44px 44px, 44px 44px, 100% 100%;
}
[data-theme="light"] .hero {
  background:
    linear-gradient(rgba(0,100,200,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,100,200,0.04) 1px, transparent 1px),
    radial-gradient(ellipse 120% 100% at 70% 50%, rgba(220,235,255,1) 0%, rgba(240,245,251,1) 100%);
  background-size: 44px 44px, 44px 44px, 100% 100%;
}

/* ── Canvas ── */
.hero-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  opacity: 1;
}

/* ── Floating simulation images — pushed to background, very subtle ── */
.hero-sim-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.sim-float {
  position: absolute;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(0,136,255,0.12);
  box-shadow: 0 8px 32px rgba(0,0,0,0.4), 0 0 0 1px rgba(0,207,170,0.04);
  mix-blend-mode: luminosity;
}
.sim-float img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.25) saturate(0.6) hue-rotate(10deg);
  display: block;
}

/* Each float: right-side only — very low opacity so mesh dominates */
.sim-float--1 { width: 240px; height: 160px; right: 4%;  top: 14%;    opacity: 0.22; animation: simFloat1 9s ease-in-out infinite; }
.sim-float--2 { width: 192px; height: 128px; right: 28%; top: 22%;    opacity: 0.12; animation: simFloat2 11s ease-in-out infinite; }
.sim-float--3 { width: 210px; height: 140px; right: 5%;  bottom: 16%; opacity: 0.18; animation: simFloat3 8s ease-in-out infinite; }
.sim-float--4 { width: 168px; height: 112px; right: 26%; bottom: 14%; opacity: 0.10; animation: simFloat1 10s 1.5s ease-in-out infinite; }

@keyframes simFloat1 { 0%,100%{ transform:translateY(0) rotate(-1deg); } 50%{ transform:translateY(-14px) rotate(1deg); } }
@keyframes simFloat2 { 0%,100%{ transform:translateY(0) rotate(1deg); }  50%{ transform:translateY(-18px) rotate(-1.5deg); } }
@keyframes simFloat3 { 0%,100%{ transform:translateY(0) rotate(0.4deg); }50%{ transform:translateY(-11px) rotate(-0.8deg); } }

/* ── Gradient overlay — strong left for text readability, nearly transparent right so mesh lives ── */
.hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 3;
  background:
    radial-gradient(ellipse 65% 85% at 8% 55%, rgba(0,136,255,0.05) 0%, transparent 70%),
    linear-gradient(108deg,
      rgba(5,13,26,0.96)  0%,
      rgba(5,13,26,0.88) 35%,
      rgba(5,13,26,0.45) 55%,
      rgba(5,13,26,0.08) 72%,
      rgba(5,13,26,0.00) 100%
    );
}
[data-theme="light"] .hero-overlay {
  background:
    radial-gradient(ellipse 65% 85% at 8% 55%, rgba(0,110,204,0.04) 0%, transparent 70%),
    linear-gradient(108deg,
      rgba(240,245,251,0.96)  0%,
      rgba(240,245,251,0.88) 35%,
      rgba(240,245,251,0.45) 55%,
      rgba(240,245,251,0.08) 72%,
      rgba(240,245,251,0.00) 100%
    );
}

/* ── Scanline sweep ── */
.hero-scanline {
  position: absolute;
  left: 0; right: 0;
  height: 1px;
  z-index: 4;
  background: linear-gradient(90deg, transparent 0%, var(--accent) 40%, var(--accent2) 60%, transparent 100%);
  opacity: 0;
  animation: heroScan 8s ease-in-out infinite;
}
@keyframes heroScan {
  0%   { top: 0%;   opacity: 0; }
  5%   { opacity: 0.22; }
  90%  { opacity: 0.22; }
  100% { top: 100%; opacity: 0; }
}

/* ── Content wrapper ── */
.hero-content {
  position: relative;
  z-index: 5;
  width: 100%;
  padding: 4rem 1.5rem;
}

/* Inner column — left-aligned, max 580px so right side is free for floats */
.hero-inner {
  max-width: 580px;
  display: flex;
  flex-direction: column;
  gap: 1.6rem; /* generous, consistent gap between every block */
}

/* ── Badge ── */
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent2);
  border: 1px solid rgba(0,207,170,0.28);
  background: rgba(0,207,170,0.07);
  border-radius: 30px;
  padding: 0.3rem 0.95rem;
  width: fit-content;
}
.badge-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--accent2);
  flex-shrink: 0;
  animation: badgeBlink 1.6s ease-in-out infinite;
}
@keyframes badgeBlink { 0%,100%{ opacity:1; } 50%{ opacity:0.2; } }

/* ── Headline — the most important fix ── */
.hero-headline {
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--text);
  /* Fluid: 2rem on 320px → 3.4rem on 1200px+ */
  font-size: clamp(2rem, 5vw, 3.4rem);
  line-height: 1.08;
  /* No margin — gap on .hero-inner handles spacing */
  margin: 0;
}

/* Individual lines for typographic rhythm */
.h-line {
  display: block;
}
/* "That Prevents Failure" — gradient accent, same weight */
.h-line--gradient {
  background: linear-gradient(92deg, var(--accent) 0%, var(--accent2) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
/* "Before Manufacturing" — lighter treatment, reads as subtitle-within-headline */
.h-line--sub {
  font-size: 0.72em;        /* smaller relative to the headline */
  font-weight: 500;
  color: var(--text-muted);
  -webkit-text-fill-color: var(--text-muted);
  background: none;
  letter-spacing: -0.01em;
  margin-top: 0.18em;       /* small extra gap before this line */
  line-height: 1.2;
}

/* ── Description ── */
.hero-sub {
  font-size: clamp(0.88rem, 1.5vw, 1rem);
  color: var(--text-muted);
  line-height: 1.78;
  max-width: 520px;
  margin: 0;
}
.hero-sub strong {
  color: var(--text);
  font-weight: 600;
}

/* ── CTA row ── */
.hero-ctas {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin: 0;
}

/* ── Stats strip ── */
.hero-stats {
  display: flex;
  align-items: stretch;
  gap: 0;
  padding: 1rem 1.25rem;
  background: rgba(15,29,50,0.82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  width: fit-content;
 
  margin: 0;
}
[data-theme="light"] .hero-stats {
  background: rgba(255,255,255,0.78);
}

.stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 1.1rem;
}
.stat:first-child { padding-left: 0; }
.stat:last-child  { padding-right: 0; }

/* Stat number + suffix on same baseline */
.stat-num {
  font-family: var(--font-display);
  font-size: 1.7rem;
  font-weight: 800;
  color: var(--accent);
  line-height: 1;
  letter-spacing: -0.02em;
  display: inline;
}
.stat-suf {
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--accent);
  display: inline;
  margin-left: 1px;
}
.stat-label {
  font-size: 0.63rem;
  font-weight: 500;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-top: 0.32rem;
  display: block;
  white-space: nowrap;
}

.stat-divider {
  width: 1px;
  background: var(--border);
  align-self: stretch;
  flex-shrink: 0;
  margin: 0.15rem 0;
}



/* ── Scroll hint ── */
.hero-scroll-hint {
  position: absolute;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
}
.hero-scroll-hint span {
  font-family: var(--font-mono);
  font-size: 0.58rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-dim);
}
.scroll-line {
  width: 1px;
  height: 34px;
  background: linear-gradient(to bottom, var(--accent), transparent);
  animation: scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse { 0%,100%{ opacity:0.5; transform:scaleY(1); } 50%{ opacity:1; transform:scaleY(1.2); } }

/* ── CFD spectrum legend ── */
.contour-legend {
  position: absolute;
  bottom: 1.5rem;
  right: 1.75rem;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.22rem;
}
.legend-label {
  font-family: var(--font-mono);
  font-size: 0.55rem;
  color: var(--text-dim);
  letter-spacing: 0.1em;
}
.legend-bar {
  width: 120px;
  height: 5px;
  border-radius: 3px;
  background: var(--border);
  overflow: hidden;
}
.legend-fill {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg,#0028ff,#00b4ff,#00ffd9,#aaff00,#ff6600,#ff0000);
  animation: legendFill 2.5s 1.8s ease forwards;
  border-radius: 3px;
}
@keyframes legendFill { to { width: 100%; } }
.legend-values {
  width: 120px;
  display: flex;
  justify-content: space-between;
  font-family: var(--font-mono);
  font-size: 0.52rem;
  color: var(--text-dim);
}

/* ── Line reveal entrance animations ── */
.line-reveal {
  opacity: 0;
  transform: translateY(24px);
  animation: heroReveal 0.7s ease forwards;
}
.delay-1 { animation-delay: 0.14s; }
.delay-2 { animation-delay: 0.28s; }
.delay-3 { animation-delay: 0.44s; }
.delay-4 { animation-delay: 0.60s; }
@keyframes heroReveal { to { opacity: 1; transform: none; } }

/* ══════ END HERO ══════ */


/* ══════ TICKER ══════ */
.sim-ticker{background:var(--surface);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:.55rem 0;overflow:hidden}
.ticker-inner{display:flex;gap:2rem;width:max-content;animation:tickerMove 30s linear infinite;font-family:var(--font-mono);font-size:.7rem;font-weight:500;color:var(--text-muted);letter-spacing:.1em}
.ticker-dot{color:var(--accent)}
@keyframes tickerMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ══════ SERVICES GRID ══════ */
.services-section{background:var(--bg)}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
.service-card--wide{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr}

.service-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:all var(--tr);display:flex;flex-direction:column}
.service-card:hover{border-color:var(--border-accent);transform:translateY(-4px);box-shadow:0 12px 36px rgba(0,0,0,.35)}

.sc-img-wrap{position:relative;overflow:hidden;aspect-ratio:16/9;background:var(--bg3);flex-shrink:0}
.service-card--wide .sc-img-wrap{aspect-ratio:unset;height:100%;min-height:200px}

.sc-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease,opacity .4s ease}
.sc-img--hover{opacity:0}
.service-card:hover .sc-img:not(.sc-img--hover){opacity:0}
.service-card:hover .sc-img--hover{opacity:1;transform:scale(1.05)}

.sc-img-bar{position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--border)}
.sc-bar-fill{height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width 1.5s ease}
.service-card:hover .sc-bar-fill{width:100%}

.sc-badge{position:absolute;top:8px;left:8px;font-family:var(--font-mono);font-size:.58rem;font-weight:600;letter-spacing:.08em;padding:.18rem .55rem;border-radius:5px;background:var(--accent);color:#fff}
.sc-badge--blue{background:#1a1a2e;color:#60cfff;border:1px solid rgba(96,207,255,0.35)}.sc-badge--green{background:#059669}.sc-badge--orange{background:#d97706}.sc-badge--red{background:#dc2626}.sc-badge--purple{background:#7c3aed}.sc-badge--teal{background:#0891b2}

.sc-body{padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.sc-icon{width:32px;height:32px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0;margin-bottom:.15rem}
.sc-icon--blue{background:rgba(0,136,255,.12);color:var(--accent)}.sc-icon--green{background:rgba(5,150,105,.12);color:#10b981}.sc-icon--orange{background:rgba(217,119,6,.12);color:#f59e0b}.sc-icon--red{background:rgba(220,38,38,.12);color:#f87171}.sc-icon--purple{background:rgba(124,58,237,.12);color:#a78bfa}.sc-icon--teal{background:rgba(8,145,178,.12);color:#22d3ee}
.sc-body h3{font-family:var(--font-display);font-size:1.05rem;font-weight:700;line-height:1.22;color:var(--text)}
.sc-body p{font-size:.82rem;color:var(--text-muted);line-height:1.62;flex:1}
.sc-tags{display:flex;flex-wrap:wrap;gap:.3rem}
.sc-tags li{font-family:var(--font-mono);font-size:.58rem;font-weight:500;color:var(--text-dim);background:var(--bg3);border:1px solid var(--border);border-radius:4px;padding:.15rem .5rem}
.services-more-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.85rem;margin-top:1.25rem;padding:.85rem 1.25rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}
.services-more-row p{font-size:.85rem;color:var(--text-muted)}

/* ══════ ANSYS TOOLS ══════ */
.ansys-section{background:var(--bg2)}
.tools-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.tool-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.4rem 1.1rem;text-align:center;position:relative;overflow:hidden;transition:all var(--tr)}
.tool-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--accent-glow),transparent);opacity:0;transition:opacity var(--tr)}
.tool-card:hover{border-color:var(--border-accent);transform:translateY(-4px)}
.tool-card:hover::before{opacity:1}
.tool-logo{font-family:var(--font-display);font-size:1.2rem;font-weight:800;color:var(--accent);background:var(--accent-glow);border:2px solid var(--border-accent);width:46px;height:46px;border-radius:11px;display:flex;align-items:center;justify-content:center;margin:0 auto .8rem;transition:transform var(--tr)}
.tool-card:hover .tool-logo{transform:scale(1.1) rotate(-3deg)}
.tool-card h4{font-family:var(--font-display);font-size:.95rem;font-weight:700;margin-bottom:.4rem}
.tool-card p{font-size:.78rem;color:var(--text-muted);line-height:1.6}

/* ══════ OUR PROCESS ══════ */
.workflow-section{background:var(--bg2);overflow:hidden}
.workflow-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;position:relative}
.workflow-steps::before{content:'';position:absolute;top:28px;left:5%;right:5%;height:2px;background:linear-gradient(90deg,var(--accent),var(--accent2));z-index:0;opacity:.5}
.workflow-steps::after{content:'';position:absolute;top:28px;left:5%;width:0;height:2px;background:linear-gradient(90deg,#fff,transparent);z-index:1;animation:flowPulse 3s ease-in-out infinite}
@keyframes flowPulse{0%{left:5%;width:0}50%{left:5%;width:90%}100%{left:95%;width:0}}
.wf-step{display:flex;flex-direction:column;align-items:center;padding:0 .5rem;position:relative;z-index:1}
.wf-node{width:56px;height:56px;border-radius:50%;background:var(--surface);border:2px solid var(--accent);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:.8rem;font-weight:800;color:var(--accent);position:relative;flex-shrink:0;margin-bottom:.75rem;transition:all var(--tr);z-index:2;cursor:default}
.wf-node::after{content:'';position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--accent);opacity:.3;animation:nodeRing 3s ease-in-out infinite}
.wf-step:nth-child(1) .wf-node{border-color:var(--accent);color:var(--accent)}.wf-step:nth-child(1) .wf-node::after{border-color:var(--accent)}
.wf-step:nth-child(2) .wf-node{border-color:#10b981;color:#10b981}.wf-step:nth-child(2) .wf-node::after{border-color:#10b981;animation-delay:.3s}
.wf-step:nth-child(3) .wf-node{border-color:var(--accent3);color:var(--accent3)}.wf-step:nth-child(3) .wf-node::after{border-color:var(--accent3);animation-delay:.6s}
.wf-step:nth-child(4) .wf-node{border-color:#a78bfa;color:#a78bfa}.wf-step:nth-child(4) .wf-node::after{border-color:#a78bfa;animation-delay:.9s}
.wf-step:nth-child(5) .wf-node{border-color:var(--accent2);color:var(--accent2);background:rgba(0,207,170,.1)}.wf-step:nth-child(5) .wf-node::after{border-color:var(--accent2);animation-delay:1.2s}
.wf-step:hover .wf-node{transform:scale(1.1);box-shadow:0 0 20px var(--accent-glow)}
@keyframes nodeRing{0%,100%{transform:scale(1);opacity:.3}50%{transform:scale(1.4);opacity:0}}
.wf-img{width:100%;aspect-ratio:4/3;border-radius:9px;overflow:hidden;border:1px solid var(--border);position:relative;background:var(--bg3);margin-bottom:.7rem;transition:all var(--tr)}
.wf-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.wf-step:hover .wf-img{border-color:var(--border-accent);box-shadow:0 6px 20px rgba(0,0,0,.4)}
.wf-step:hover .wf-img img{transform:scale(1.07)}
.wf-scan{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);top:0;opacity:0;pointer-events:none}
.wf-step:hover .wf-scan{opacity:.8;animation:wfScan 2s ease-in-out infinite}
@keyframes wfScan{0%{top:0;opacity:0}10%{opacity:.8}90%{opacity:.8}100%{top:100%;opacity:0}}
.wf-text{text-align:center}
.wf-text h4{font-family:var(--font-display);font-size:.82rem;font-weight:700;color:var(--text);margin-bottom:.3rem;line-height:1.3}
.wf-text p{font-size:.72rem;color:var(--text-muted);line-height:1.58}

/* ══════ SIM GALLERY ══════ */
.sim-gallery-section{background:var(--bg);padding:3.5rem 0;overflow:hidden}
.sim-gallery-header{margin-bottom:1.4rem}
.sim-gallery-header h2{font-family:var(--font-display);font-size:clamp(1.25rem,3vw,1.875rem);font-weight:800;margin-top:.5rem;letter-spacing:-.02em}
.sim-gallery-track{overflow:hidden}
.sim-gallery-inner{display:flex;gap:.9rem;width:max-content;animation:galleryScroll 32s linear infinite}
.sim-gallery-inner:hover{animation-play-state:paused}
@keyframes galleryScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.gal-item{flex-shrink:0;width:210px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);background:var(--surface);position:relative;transition:all var(--tr);cursor:pointer}
.gal-item:hover{border-color:var(--border-accent);transform:scale(1.03);box-shadow:0 8px 28px rgba(0,0,0,.4)}
.gal-item img{width:100%;height:130px;object-fit:cover;transition:transform .5s ease}
.gal-item:hover img{transform:scale(1.06)}
.gal-item span{display:block;padding:.45rem .8rem;font-family:var(--font-mono);font-size:.62rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}

/* ══════ CASE STUDIES ══════ */
.case-preview-section{background:var(--bg2)}
.case-slider-wrap{overflow:hidden}
.case-slider{display:flex;gap:0;transition:transform .55s cubic-bezier(.4,0,.2,1)}
.case-card{min-width:100%;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;display:grid;grid-template-columns:1fr 1fr}
.case-img-wrap{position:relative;overflow:hidden}
.case-img-wrap img{width:100%;height:100%;object-fit:cover;min-height:280px;transition:transform .6s ease}
.case-card:hover .case-img-wrap img{transform:scale(1.04)}
.case-img-scan{position:absolute;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--accent2),transparent);top:0;opacity:0;animation:imgScan 3s ease-in-out infinite 1s}
@keyframes imgScan{0%,100%{top:0;opacity:0}10%,90%{opacity:.7}50%{top:100%}}
.case-badge-tag{position:absolute;top:12px;left:12px;font-family:var(--font-mono);font-size:.6rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;background:var(--accent);color:#fff;padding:.2rem .7rem;border-radius:5px}
.case-body{padding:1.75rem;display:flex;flex-direction:column;gap:.8rem;justify-content:center}
.case-industry{font-family:var(--font-mono);font-size:.68rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--accent2)}
.case-body h3{font-family:var(--font-display);font-size:1.5rem;font-weight:800;line-height:1.18;letter-spacing:-.02em}
.case-problem,.case-method{font-size:.85rem;color:var(--text-muted);line-height:1.65}
.case-metrics{display:flex;gap:1.2rem;padding:.9rem 0;border-top:1px solid var(--border)}
.metric{display:flex;flex-direction:column}
.metric-val{font-family:var(--font-display);font-size:1.5rem;font-weight:800;color:var(--accent);line-height:1}
.metric span:last-child{font-size:.62rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.06em;margin-top:.18rem}
.slider-controls{display:flex;align-items:center;justify-content:center;gap:1.2rem;margin-top:1.4rem}
.slider-btn{width:38px;height:38px;border-radius:50%;background:var(--surface);border:1px solid var(--border);color:var(--text);font-size:.9rem;display:flex;align-items:center;justify-content:center;transition:all var(--tr)}
.slider-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.slider-dots{display:flex;gap:.4rem}
.slider-dot{width:7px;height:7px;border-radius:50%;background:var(--border);cursor:pointer;transition:all var(--tr)}
.slider-dot.active{background:var(--accent);width:20px;border-radius:4px}

/* ══════ TESTIMONIALS ══════ */
.testimonials-section{background:var(--bg)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
.testi-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.6rem;display:flex;flex-direction:column;gap:.9rem;position:relative;transition:all var(--tr)}
.testi-card:hover{transform:translateY(-4px);border-color:var(--border-accent);box-shadow:0 12px 36px rgba(0,0,0,.3)}
.testi-card--featured{background:linear-gradient(135deg,var(--surface2),var(--surface));border-color:var(--border-accent)}
.testi-card--featured::before{content:'★ Featured';position:absolute;top:-1px;right:18px;font-family:var(--font-mono);font-size:.58rem;font-weight:600;letter-spacing:.1em;color:#fff;background:var(--accent);padding:.18rem .55rem;border-radius:0 0 6px 6px}
.testi-quote{font-family:var(--font-display);font-size:1.8rem;font-weight:800;color:var(--border-accent);line-height:1}
.testi-stars{color:#f9c74f;font-size:.82rem;letter-spacing:.06em}
.testi-card p{font-size:.85rem;color:var(--text-muted);font-style:italic;line-height:1.7;flex:1}
.testi-author{display:flex;align-items:center;gap:.7rem;padding-top:.8rem;border-top:1px solid var(--border)}
.testi-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:.7rem;font-weight:800;color:#fff;flex-shrink:0}
.testi-author strong{display:block;font-family:var(--font-display);font-size:.85rem;font-weight:700;color:var(--text)}
.testi-author span{font-size:.7rem;color:var(--text-dim)}

/* ══════ FAQ ══════ */
.faq-section{background:var(--bg2)}
.faq-list{max-width:700px;margin:0 auto;display:flex;flex-direction:column;gap:.55rem}
.faq-item{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:border-color var(--tr)}
.faq-item.open{border-color:var(--border-accent)}
.faq-q{width:100%;text-align:left;padding:1rem 1.2rem;font-family:var(--font-display);font-size:.95rem;font-weight:600;color:var(--text);display:flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--surface);transition:background var(--tr)}
.faq-q span{font-size:1.1rem;color:var(--accent);transition:transform var(--tr);flex-shrink:0}
.faq-item.open .faq-q span{transform:rotate(45deg)}
.faq-q:hover{background:var(--surface2)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s ease;background:var(--surface2)}
.faq-item.open .faq-a{max-height:200px}
.faq-a p{padding:.9rem 1.2rem 1.1rem;color:var(--text-muted);font-size:.85rem;line-height:1.75}

/* ══════ CTA BANNER ══════ */
.cta-banner{position:relative;padding:4rem 0;overflow:hidden}
.cta-banner-bg{position:absolute;inset:0}
.cta-banner-bg canvas{width:100%!important;height:100%!important}
.cta-banner-bg::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(135deg,rgba(2,8,20,.96) 0%,rgba(8,22,50,.9) 50%,rgba(5,18,40,.88) 100%)}
.cta-banner-inner{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.cta-text h2{font-family:var(--font-display);font-size:clamp(1.5rem,3vw,2.25rem);font-weight:800;color:#fff;margin:.65rem 0 .55rem;line-height:1.15;letter-spacing:-.02em}
.cta-text p{color:rgba(255,255,255,.6);max-width:520px;font-size:.88rem}
.cta-btns{display:flex;flex-wrap:wrap;gap:.7rem;flex-shrink:0}

/* ══════ FOOTER ══════ */
.footer{background:var(--bg2);border-top:1px solid var(--border);padding:3.5rem 0 1.5rem}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:2rem;margin-bottom:2.25rem}
.footer-brand p{color:var(--text-muted);font-size:.85rem;margin:.75rem 0 1.1rem;max-width:250px;line-height:1.65}.footer-brand .logo-icon{width:44px;height:44px;}.footer-brand .logo-name{font-size:.95rem;}.footer-brand .logo-tagline{font-size:.58rem;}
.footer-socials{display:flex;gap:.55rem}
.footer-socials a{width:32px;height:32px;border-radius:7px;background:var(--surface);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:.8rem;color:var(--text-muted);transition:all var(--tr)}
.footer-socials a:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.footer-col h5{font-family:var(--font-display);font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text);margin-bottom:.9rem}
.footer-col a,.footer-col p{display:block;font-size:.83rem;color:var(--text-muted);margin-bottom:.45rem;transition:color var(--tr)}
.footer-col a:hover{color:var(--accent)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.55rem;padding-top:1.5rem;border-top:1px solid var(--border)}
.footer-bottom p{font-size:.72rem;color:var(--text-dim)}

/* ══════ CHATBOT ══════ */
.chatbot-widget{position:fixed;bottom:1.5rem;right:1.5rem;z-index:9999}
.chatbot-toggle{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 4px 20px rgba(0,136,255,.45);display:flex;align-items:center;justify-content:center;font-size:1.15rem;transition:transform var(--tr),box-shadow var(--tr);position:relative;z-index:2}
.chatbot-toggle:hover{transform:scale(1.08);box-shadow:0 8px 32px rgba(0,136,255,.6)}
.chat-close{display:none;font-size:.9rem;font-weight:700;color:#fff}
.chatbot-widget.open .chat-icon{display:none}
.chatbot-widget.open .chat-close{display:block}
.chatbot-window{position:absolute;bottom:62px;right:0;width:310px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:0 16px 56px rgba(0,0,0,.55);overflow:hidden;display:none;flex-direction:column;backdrop-filter:blur(16px)}
.chatbot-widget.open .chatbot-window{display:flex;animation:slideUp .3s ease}
.chat-header{padding:.9rem 1.2rem;background:linear-gradient(135deg,var(--accent),var(--accent2));display:flex;align-items:center}
.chat-header-info{display:flex;align-items:center;gap:.55rem}
.chat-avatar{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:.68rem;font-weight:800;color:#fff}
.chat-header strong{display:block;font-size:.85rem;color:#fff}
.chat-status{font-size:.62rem;color:rgba(255,255,255,.8)}
.chat-messages{padding:.8rem;min-height:115px;max-height:185px;overflow-y:auto;display:flex;flex-direction:column;gap:.55rem}
.chat-msg{max-width:86%}
.chat-msg.bot{align-self:flex-start}
.chat-msg.user{align-self:flex-end}
.chat-msg.bot p{background:var(--surface2);color:var(--text);border-radius:4px 12px 12px 12px;padding:.5rem .85rem;font-size:.83rem;line-height:1.5}
.chat-msg.user span{background:var(--accent);color:#fff;border-radius:12px 4px 12px 12px;display:block;padding:.5rem .85rem;font-size:.83rem}
.chat-quick-btns{display:flex;flex-wrap:wrap;gap:.3rem;padding:0 .8rem .6rem}
.chat-quick-btns button{font-size:.65rem;font-family:var(--font-display);font-weight:600;padding:.22rem .55rem;border:1px solid var(--border);border-radius:20px;background:var(--surface2);color:var(--text-muted);transition:all .2s}
.chat-quick-btns button:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.chat-input-row{display:flex;border-top:1px solid var(--border)}
.chat-input-row input{flex:1;padding:.75rem .9rem;background:transparent;border:none;color:var(--text);font-family:var(--font-body);font-size:.83rem;outline:none}
.chat-input-row input::placeholder{color:var(--text-dim)}
.chat-send{width:42px;background:var(--accent);color:#fff;font-size:.9rem;font-weight:700;transition:background var(--tr)}
.chat-send:hover{background:var(--accent2)}

/* ── SCROLL REVEAL ── */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease}
.reveal.visible{opacity:1;transform:none}

/* ── KEYFRAMES ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes slideUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ══════ RESPONSIVE ≤ 1100px ══════ */
@media(max-width:1100px){
  .sim-float--2,.sim-float--4{ display:none; }
  .sim-float--1{ width:200px; height:134px; }
  .sim-float--3{ width:175px; height:118px; }
}

/* ══════ RESPONSIVE ≤ 1024px (tablet) ══════ */
@media(max-width:1024px){
  .services-grid{grid-template-columns:1fr 1fr}
  .service-card--wide{grid-column:span 2}
  .tools-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .testi-grid{grid-template-columns:1fr 1fr}
  .testi-grid .testi-card:last-child{grid-column:1/-1;max-width:480px;margin:0 auto}
  .nav-cta{display:none}
  .workflow-steps{grid-template-columns:repeat(3,1fr)}
  .workflow-steps::before,.workflow-steps::after{display:none}
  /* Hero stats: tighten padding slightly on tablet */
  .hero-stats{ padding: 0.8rem 0.75rem; max-width: 100%; width: 100%; }
  .stat{ padding: 0.3rem 0.5rem; }
  .stat-num{ font-size: 1.4rem; }
  .stat-label{ font-size: 0.58rem; }
}

/* ══════ RESPONSIVE ≤ 768px ══════ */
@media(max-width:768px){
  :root{--section-pad:2.75rem 0}
  /* Logo responsive */
  .logo-icon{width:38px;height:38px;}
  .logo-name{font-size:.82rem;}
  .logo-tagline{font-size:.54rem;}
  .nav-inner{height:62px;}


  /* Nav */
  .hamburger{display:flex}
  .nav-links{position:fixed;top:62px;left:0;right:0;background:var(--nav-bg);backdrop-filter:blur(20px);flex-direction:column;align-items:flex-start;padding:1.1rem 1.5rem;gap:1.1rem;border-top:1px solid var(--border);transform:translateX(-100%);transition:transform var(--tr);z-index:999}
  .nav-links.open{transform:translateX(0)}
  .nav-links a{font-size:.95rem}

  /* Hero */
  .hero{ min-height: auto; padding-bottom: 2.5rem; }
  .hero-content{ padding: 2.5rem 1.25rem; }
  .hero-inner{ max-width: 100%; gap: 1.25rem; }

  /* Hide floats — they overlap text on narrow screens */
  .sim-float--1,.sim-float--2,.sim-float--3,.sim-float--4{ display:none; }

  /* Full overlay on mobile for readability */
  .hero-overlay{
    background: rgba(5,13,26,0.93);
  }
  [data-theme="light"] .hero-overlay{
    background: rgba(240,245,251,0.94);
  }

  /* Headline fluid on mobile */
  .hero-headline{ font-size: clamp(1.85rem, 8.5vw, 2.8rem); }
  .h-line--sub{ font-size: 0.68em; }

  /* Stats → 2×2 grid on mobile */
  .hero-stats{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
    border-radius: var(--radius);
    overflow: hidden;
    box-sizing: border-box;
  }
  .stat-divider{ display: none; }
  .stat{
    flex: unset;
    padding: 0.85rem 0.5rem;
    border: none;
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    min-width: 0;
    overflow: hidden;
    box-sizing: border-box;
  }
  .stat:nth-of-type(2n)  { border-right: none; }
  .stat:nth-of-type(3),
  .stat:nth-of-type(4)   { border-bottom: none; }
  .stat-num{ font-size: 1.35rem; }
  .stat-label { font-size: 0.58rem; white-space: normal; word-break: break-word; overflow-wrap: break-word; }

  /* CTAs stack */
  .hero-ctas{ flex-direction: column; }
  .hero-ctas .btn{ width: 100%; justify-content: center; }

  /* Hide decorative corner elements */
  .hero-scroll-hint,.contour-legend{ display:none; }

  /* Rest of page */
  .services-grid{grid-template-columns:1fr}
  .service-card--wide{grid-column:span 1;grid-template-columns:1fr}
  .services-more-row{flex-direction:column}
  .tools-grid{grid-template-columns:1fr 1fr}
  .workflow-steps{grid-template-columns:1fr 1fr}
  .case-card{grid-template-columns:1fr}
  .case-img-wrap img{min-height:190px}
  .testi-grid{grid-template-columns:1fr}
  .testi-grid .testi-card:last-child{max-width:100%}
  .gal-item{width:175px}
  .gal-item img{height:115px}
  .cta-banner-inner{flex-direction:column}
  .cta-btns{flex-direction:column;width:100%}
  .cta-btns .btn{width:100%;justify-content:center}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;text-align:center}
  .chatbot-window{width:calc(100vw - 3rem);right:0}
}

/* ══════ RESPONSIVE ≤ 480px ══════ */
@media(max-width:480px){
  .tools-grid{grid-template-columns:1fr}
  .workflow-steps{grid-template-columns:1fr}
  .hero-headline{ font-size: clamp(1.65rem, 9vw, 2.2rem); }
  .hero-inner{ gap: 1rem; }
  .stat-num{ font-size: 1.15rem; }
  .stat-label{ font-size: 0.54rem; white-space: normal; max-width: 100%; letter-spacing: 0.04em; }
  .stat{ padding: 0.7rem 0.4rem; }
  .chatbot-widget{right:.75rem;bottom:.75rem}
  .chatbot-window{width:calc(100vw - 1.25rem);right:0}
}

/* ══════════════════════════════════════════════════
   NEW SECTIONS — Client Docx Changes
══════════════════════════════════════════════════ */

/* ── Hero Highlight Blocks ── */
.hero-highlights {
  position: relative;
  z-index: 3;
  display: flex;
  gap: .85rem;
  justify-content: center;
  flex-wrap: wrap;
  padding: 1.25rem 0 .5rem;
}
.hh-block {
  display: flex;
  align-items: center;
  gap: .7rem;
  background: color-mix(in srgb, var(--surface) 80%, transparent);
  border: 1px solid var(--border-accent);
  border-radius: var(--radius);
  padding: .75rem 1.1rem;
  backdrop-filter: blur(10px);
  transition: all var(--tr);
  min-width: 200px;
}
.hh-block:hover { border-color: var(--accent); transform: translateY(-3px); }
.hh-icon { font-size: 1.4rem; flex-shrink: 0; }
.hh-text strong {
  display: block;
  font-size: .85rem;
  font-weight: 700;
  color: var(--text);
  line-height: 1.25;
}
.hh-text span {
  display: block;
  font-size: .72rem;
  color: var(--text-muted);
  font-family: var(--font-mono);
  margin-top: .15rem;
}

/* ── Service Tier Labels ── */
.svc-tier-label {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.25rem;
  flex-wrap: wrap;
}
.svc-tier-label p {
  font-size: .82rem;
  color: var(--text-muted);
  margin: 0;
}
.tier-badge {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-family: var(--font-mono);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  border-radius: 20px;
  padding: .3rem 1rem;
  white-space: nowrap;
}
.tier-badge--core    { background: rgba(0,136,255,.12); color: var(--accent); border: 1px solid rgba(0,136,255,.3); }
.tier-badge--support { background: rgba(8,145,178,.12); color: #22d3ee;      border: 1px solid rgba(8,145,178,.3); }
.tier-badge--advanced{ background: rgba(124,58,237,.12);color: #a78bfa;      border: 1px solid rgba(124,58,237,.3); }

/* ── Core services grid — 3-col with featured CFD card ── */
.services-grid--core {
  grid-template-columns: 1.4fr 1fr 1fr;
}
.service-card--featured .sc-img-wrap { aspect-ratio: 16/9; }
.service-card--featured h3 { font-size: 1.2rem; }

/* ── Supporting & Advanced — 4-col ── */
.services-grid--support,
.services-grid--advanced {
  grid-template-columns: repeat(4, 1fr);
}
.service-card--sm .sc-body { padding: 1rem; }
.service-card--sm h3 { font-size: .9rem; margin-bottom: .4rem; }
.service-card--sm p { font-size: .78rem; }
.sc-body--solo { padding: 1.25rem 1rem; }

/* ── CFD Highlight Section ── */
.cfd-highlight-section { background: var(--bg2); }

.cfd-overview-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
  margin-bottom: 2.5rem;
}
.cfd-overview-text p { font-size: .95rem; color: var(--text-muted); line-height: 1.8; margin-bottom: .9rem; }
.cfd-outputs {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin-top: 1rem;
}
.cfd-outputs span {
  font-family: var(--font-mono);
  font-size: .65rem;
  font-weight: 500;
  color: var(--accent);
  background: rgba(0,136,255,.08);
  border: 1px solid rgba(0,136,255,.2);
  border-radius: 4px;
  padding: .2rem .65rem;
}
.cfd-overview-img {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: 0 16px 48px rgba(0,0,0,.3);
}
.cfd-overview-img img { width: 100%; display: block; transition: transform .6s ease; }
.cfd-overview-img:hover img { transform: scale(1.03); }
.cfd-img-badge {
  position: absolute;
  bottom: .75rem; left: .75rem;
  background: color-mix(in srgb, var(--surface) 88%, transparent);
  backdrop-filter: blur(10px);
  border: 1px solid var(--border-accent);
  border-radius: var(--radius);
  padding: .35rem .8rem;
  font-family: var(--font-mono);
  font-size: .62rem;
  color: var(--accent);
  letter-spacing: .07em;
}

.cfd-caps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.cfd-cap-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.1rem 1rem;
  transition: all var(--tr);
}
.cfd-cap-card:hover { border-color: var(--border-accent); transform: translateY(-3px); }
.cfd-cap-icon { font-size: 1.2rem; margin-bottom: .5rem; }
.cfd-cap-card h4 { font-family: var(--font-display); font-size: .88rem; font-weight: 700; color: var(--text); margin-bottom: .35rem; }
.cfd-cap-card p { font-size: .78rem; color: var(--text-muted); line-height: 1.6; margin-bottom: .5rem; }
.cfd-cap-apps { font-family: var(--font-mono); font-size: .62rem; color: var(--accent); letter-spacing: .05em; }
.cfd-cta-row { text-align: center; margin-top: 1rem; }

/* ── Case study results list ── */
.case-results-list {
  display: flex;
  flex-direction: column;
  gap: .3rem;
  margin: .75rem 0 1rem;
}
.case-results-list span {
  font-size: .8rem;
  color: var(--text-muted);
  display: flex;
  align-items: center;
  gap: .4rem;
}

/* ── Industries Section ── */
.industries-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1rem;
  margin-top: 2rem;
}
.industry-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 1.5rem 1rem;
  text-align: center;
  transition: all var(--tr);
}
.industry-card:hover { border-color: var(--border-accent); transform: translateY(-4px); box-shadow: 0 10px 30px rgba(0,0,0,.25); }
.ind-icon { font-size: 1.8rem; margin-bottom: .75rem; display: block; }
.industry-card h4 { font-family: var(--font-display); font-size: .9rem; font-weight: 700; color: var(--text); margin-bottom: .4rem; line-height: 1.25; }
.industry-card p { font-size: .76rem; color: var(--text-muted); line-height: 1.55; }

/* ── sc-icon--blue ── */
.sc-icon--blue { background: rgba(0,136,255,.1); color: var(--accent); }

/* gradient-text for CFD section h2 */
.gradient-text {
  background: linear-gradient(90deg, var(--accent), var(--accent2));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--accent);
}

/* ══════ RESPONSIVE — New Sections ══════ */
@media(max-width:1024px) {
  .services-grid--core       { grid-template-columns: 1fr 1fr; }
  .service-card--featured    { grid-column: span 2; }
  .services-grid--support,
  .services-grid--advanced   { grid-template-columns: repeat(2, 1fr); }
  .cfd-caps-grid             { grid-template-columns: repeat(2, 1fr); }
  .cfd-overview-row          { grid-template-columns: 1fr; gap: 1.5rem; }
  .industries-grid           { grid-template-columns: repeat(3, 1fr); }
}
@media(max-width:768px) {
  .hero-highlights           { flex-direction: column; align-items: stretch; }
  .hh-block                  { min-width: unset; }
  .services-grid--core       { grid-template-columns: 1fr; }
  .service-card--featured    { grid-column: span 1; }
  .services-grid--support,
  .services-grid--advanced   { grid-template-columns: 1fr 1fr; }
  .cfd-caps-grid             { grid-template-columns: 1fr 1fr; }
  .industries-grid           { grid-template-columns: repeat(2, 1fr); }
  .svc-tier-label            { flex-direction: column; align-items: flex-start; gap: .4rem; }
}
@media(max-width:480px) {
  .services-grid--support,
  .services-grid--advanced   { grid-template-columns: 1fr; }
  .cfd-caps-grid             { grid-template-columns: 1fr; }
  .industries-grid           { grid-template-columns: 1fr 1fr; }
}

@media(max-width:480px){
  .logo-icon{width:32px;height:32px;}
  .logo-name{font-size:.75rem;letter-spacing:.02em;}
  .logo-tagline{font-size:.5rem;}
}


/* ═══════════════════════════════════════════════════════════
   GLOBAL TEXT CONSISTENCY — consistent line-break widths
   All body paragraphs inside content columns share the same
   max-width so they all break at the same relative point.
═══════════════════════════════════════════════════════════ */

/* Hero description — unified width matching hero-inner */
.hero-sub {
  max-width: 520px;
}

/* About page — who-we-are text column paragraphs */
.about-who-text p {
  max-width: 520px;
}

/* About page — featured pillar card body paragraph */
.pf-body p {
  max-width: 520px;
}

/* Services page — overview text paragraphs */
.svc-overview-text p {
  max-width: 520px;
}

/* Service pages — page hero paragraph */
.svc-hero-content p {
  max-width: 520px;
}

/* Section headers — ensure consistent subtitle wrapping */
.section-header p {
  max-width: 540px;
}

/* Service card body paragraphs */
.svc-card-body p {
  max-width: 100%; /* fills grid cell, not constrained */
}

/* Why-card paragraphs */
.why-card p {
  max-width: 100%;
}

/* Commitment item paragraphs */
.ci-body p {
  max-width: 100%;
}

/* Mobile: remove max-width constraints so text fills screen */
@media (max-width: 768px) {
  .hero-sub,
  .about-who-text p,
  .pf-body p,
  .svc-overview-text p,
  .svc-hero-content p,
  .section-header p {
    max-width: 100%;
  }
}