/* ============================================================
   INNER PAGES — Shared stylesheet
   Depends on css/style.css (design tokens already defined there)
   ============================================================ */

/* ── Page Hero ─────────────────────────────────────────── */
.page-hero {
  position: relative;
  padding-top: calc(var(--topbar-height, 38px) + var(--nav-height, 72px) + 72px);
  padding-bottom: 0;
  background: #080d1a;
  overflow: hidden;
}
.page-hero::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 65% 70% at 20% 60%, rgba(8,160,144,.22) 0%, transparent 65%),
    radial-gradient(ellipse 50% 60% at 80% 30%, rgba(99,102,241,.16) 0%, transparent 60%),
    linear-gradient(160deg, #080d1a 0%, #0b1525 60%, #070b16 100%);
  pointer-events: none;
}
.page-hero-inner { position: relative; z-index: 2; padding: 24px 0 72px; }
.page-hero-eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--teal); background: rgba(8,160,144,.1); border: 1px solid rgba(8,160,144,.28);
  padding: 6px 16px; border-radius: 20px; margin-bottom: 24px;
}
.page-hero-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(2.2rem, 5vw, 3.8rem);
  font-weight: 800; color: #fff; line-height: 1.08;
  letter-spacing: -.03em; margin: 0 0 18px;
}
.page-hero-accent {
  background: linear-gradient(135deg, var(--teal) 0%, #18a860 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.page-hero-sub {
  font-size: 1.05rem; color: rgba(255,255,255,.62); line-height: 1.78; max-width: 620px; margin: 0;
}
.page-breadcrumb {
  position: relative; z-index: 2;
  border-top: 1px solid rgba(255,255,255,.07); background: rgba(0,0,0,.22); padding: 13px 0;
}
.page-breadcrumb-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; align-items: center; gap: 8px; font-size: .8rem;
}
.page-breadcrumb-list a { color: var(--teal); text-decoration: none; }
.page-breadcrumb-list a:hover { text-decoration: underline; }
.page-breadcrumb-list .fa { font-size: .65rem; color: rgba(255,255,255,.3); }
.page-breadcrumb-list li:last-child { color: rgba(255,255,255,.5); }
@media (max-width: 576px) {
  .page-hero { padding-top: calc(var(--topbar-height, 38px) + var(--nav-height, 72px) + 40px); }
}

/* ── Section utilities ─────────────────────────────────── */
.page-section { padding: 96px 0; }
.page-section-light { background: var(--paper, #f8fafb); }
.page-section-dark {
  background: linear-gradient(180deg, #070c18 0%, #0a1020 100%);
  position: relative; overflow: hidden;
}
.page-section-dark .section-header h2 { color: #fff; }
.page-section-dark .section-header p  { color: rgba(255,255,255,.55); }
.page-section-light .section-header h2 { color: #0a0e1a; }
.page-section-light .section-header p  { color: #6b7280; }
.section-eyebrow-light {
  color: #057a6e !important; background: rgba(8,160,144,.08) !important;
  border-color: rgba(8,160,144,.25) !important;
}
@media (max-width: 576px) { .page-section { padding: 64px 0; } }

/* ── Stats strip ───────────────────────────────────────── */
.stats-strip {
  display: grid; grid-template-columns: repeat(4,1fr);
  background: linear-gradient(135deg, #051020 0%, #092920 40%, #051020 100%);
  border-radius: 20px; overflow: hidden;
}
.stats-strip-item {
  text-align: center; padding: 48px 24px;
  border-right: 1px solid rgba(255,255,255,.07); transition: background .25s;
}
.stats-strip-item:last-child { border-right: none; }
.stats-strip-item:hover { background: rgba(8,160,144,.08); }
.stats-strip-num {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 3rem; font-weight: 800;
  display: flex; align-items: baseline; justify-content: center; gap: 2px;
  line-height: 1; margin-bottom: 8px;
}
.stats-strip-num .count-number {
  background: linear-gradient(135deg, var(--teal) 0%, #18a860 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.stats-strip-num .stat-plus { font-size: 1.5rem; color: var(--teal); }
.stats-strip-label {
  font-size: .78rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .1em; color: rgba(255,255,255,.42);
}

/* ── ABOUT PAGE ─────────────────────────────────────────── */
.about-intro-grid {
  display: grid; grid-template-columns: 1fr 320px; gap: 64px; align-items: start;
}
.about-intro-copy h2 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(1.7rem, 2.8vw, 2.4rem); font-weight: 800;
  color: #0a0e1a; letter-spacing: -.02em; margin: 16px 0 20px;
}
.about-intro-copy p { color: #374151; line-height: 1.78; margin-bottom: 16px; font-size: .975rem; }
.about-side-panel {
  background: linear-gradient(145deg, #0f1b2d 0%, #0d1825 100%);
  border: 1px solid rgba(8,160,144,.22); border-radius: 20px;
  padding: 36px 28px; display: flex; flex-direction: column; gap: 14px;
  position: sticky; top: 120px;
}
.about-side-core {
  width: 52px; height: 52px; border-radius: 13px;
  background: linear-gradient(135deg, var(--teal), #18a860);
  display: flex; align-items: center; justify-content: center; margin-bottom: 6px;
}
.about-side-core .fa { font-size: 1.3rem; color: #fff; }
.about-side-panel span {
  display: flex; align-items: center; gap: 10px;
  font-size: .92rem; font-weight: 600; color: rgba(255,255,255,.75);
}
.about-side-panel span .fa { color: var(--teal); font-size: .82rem; }
.values-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.value-card {
  background: linear-gradient(145deg, #0f1b2d 0%, #0d1825 100%);
  border: 1px solid rgba(255,255,255,.07); border-radius: 18px; padding: 36px 28px;
  transition: transform .3s, box-shadow .3s, border-color .3s;
}
.value-card:hover { transform: translateY(-6px); border-color: rgba(8,160,144,.3); box-shadow: 0 20px 48px rgba(0,0,0,.3); }
.value-card-icon {
  width: 52px; height: 52px; border-radius: 13px;
  background: rgba(8,160,144,.12); border: 1px solid rgba(8,160,144,.2);
  display: flex; align-items: center; justify-content: center; margin-bottom: 20px; transition: background .3s;
}
.value-card:hover .value-card-icon { background: rgba(8,160,144,.22); }
.value-card-icon .fa { font-size: 1.3rem; color: var(--teal); }
.value-card h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.1rem; font-weight: 800; color: #fff; margin: 0 0 10px; }
.value-card p { font-size: .92rem; color: rgba(255,255,255,.52); line-height: 1.7; margin: 0; }
.vision-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 32px; }
.vision-card { background: #fff; border: 1.5px solid #e5e7eb; border-radius: 20px; overflow: hidden; transition: box-shadow .3s; }
.vision-card:hover { box-shadow: 0 12px 40px rgba(0,0,0,.1); }
.vision-card-img img { width: 100%; height: 200px; object-fit: cover; display: block; }
.vision-card-body { padding: 32px 28px; }
.vision-card-body h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.2rem; font-weight: 800; color: #0a0e1a; margin: 12px 0 12px; }
.vision-card-body p { font-size: .93rem; color: #374151; line-height: 1.78; margin: 0; }
.why-panel {
  background: linear-gradient(135deg, #f0fafa 0%, #fff 100%);
  border: 1.5px solid rgba(8,160,144,.2); border-radius: 20px; padding: 48px 52px;
}
.why-panel h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(1.5rem, 2.5vw, 2rem); font-weight: 800; color: #0a0e1a; margin: 12px 0 16px; }
.why-panel p { font-size: .975rem; color: #374151; line-height: 1.8; margin: 0; }

/* ── SERVICES PAGE ──────────────────────────────────────── */
.services-intro-grid { display: grid; grid-template-columns: 1fr 280px; gap: 56px; align-items: center; }
.services-intro-copy h2 {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(1.7rem, 2.8vw, 2.4rem);
  font-weight: 800; color: #0a0e1a; letter-spacing: -.02em; margin: 16px 0 16px;
}
.services-intro-copy p { color: #374151; line-height: 1.78; font-size: .975rem; }
.services-signal-panel {
  background: linear-gradient(145deg, #0f1b2d 0%, #0d1825 100%);
  border: 1px solid rgba(8,160,144,.22); border-radius: 20px;
  padding: 32px 28px; display: flex; flex-direction: column; gap: 14px;
}
.services-signal-core {
  width: 52px; height: 52px; border-radius: 13px;
  background: linear-gradient(135deg, var(--teal), #18a860);
  display: flex; align-items: center; justify-content: center; margin-bottom: 6px;
}
.services-signal-core .fa { font-size: 1.3rem; color: #fff; }
.services-signal-panel span {
  display: flex; align-items: center; gap: 10px;
  font-size: .92rem; font-weight: 600; color: rgba(255,255,255,.75);
}
.services-signal-panel span .fa { color: var(--teal); font-size: .85rem; }
.services-catalog-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.service-detail-card {
  position: relative;
  background: linear-gradient(145deg, #0f1b2d 0%, #0d1825 100%);
  border: 1px solid rgba(255,255,255,.07); border-radius: 18px; padding: 36px 28px 28px;
  display: flex; flex-direction: column;
  transition: transform .3s, border-color .3s, box-shadow .3s;
}
.service-detail-card:hover { transform: translateY(-6px); border-color: rgba(8,160,144,.3); box-shadow: 0 20px 48px rgba(0,0,0,.32); }
.sdc-meta { font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--teal); margin-bottom: 12px; }
.sdc-icon {
  width: 50px; height: 50px; border-radius: 12px;
  background: rgba(8,160,144,.12); border: 1px solid rgba(8,160,144,.2);
  display: flex; align-items: center; justify-content: center; margin-bottom: 18px; transition: background .3s;
}
.service-detail-card:hover .sdc-icon { background: rgba(8,160,144,.22); }
.sdc-icon .fa { font-size: 1.3rem; color: var(--teal); }
.service-detail-card h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.1rem; font-weight: 800; color: #fff; margin: 0 0 10px; }
.service-detail-card p { font-size: .92rem; color: rgba(255,255,255,.5); line-height: 1.7; margin: 0; flex: 1; }
.service-detail-card a {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 22px;
  font-size: .875rem; font-weight: 700; color: var(--teal); text-decoration: none; transition: gap .2s;
}
.service-detail-card a:hover { gap: 12px; color: var(--teal); text-decoration: none; }

/* ── SERVICES PAGE — Enhanced ───────────────────────────── */

/* Hero enhancements */
.svcs-hero { overflow: hidden; }
.svcs-hero-orb {
  position: absolute; border-radius: 50%; pointer-events: none; z-index: 0;
}
.svcs-hero-orb--a {
  width: 520px; height: 520px; top: -80px; right: -100px;
  background: radial-gradient(circle, rgba(8,160,144,.18) 0%, transparent 70%);
  animation: svcsOrbFloat 9s ease-in-out infinite;
}
.svcs-hero-orb--b {
  width: 380px; height: 380px; bottom: 0; left: 5%;
  background: radial-gradient(circle, rgba(99,102,241,.14) 0%, transparent 70%);
  animation: svcsOrbFloat 12s ease-in-out infinite reverse;
}
@keyframes svcsOrbFloat {
  0%, 100% { transform: translateY(0) scale(1); }
  50%       { transform: translateY(-24px) scale(1.04); }
}

/* Hero badges */
.svcs-hero-badges {
  display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 28px;
  animation: svcsHeroBadgeFadeIn .7s ease both;
}
@keyframes svcsHeroBadgeFadeIn { from { opacity:0; transform:translateY(-12px); } to { opacity:1; transform:translateY(0); } }
.svcs-hero-badge {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: rgba(255,255,255,.7); background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.14); border-radius: 20px; padding: 6px 14px;
  backdrop-filter: blur(6px);
}
.svcs-hero-badge .fa { font-size: .8rem; }
.svcs-hero-badge--green  { color: #34d399; border-color: rgba(52,211,153,.3); background: rgba(52,211,153,.08); }
.svcs-hero-badge--indigo { color: #818cf8; border-color: rgba(129,140,248,.3); background: rgba(129,140,248,.08); }

/* Hero stat bar */
.svcs-hero-stats {
  display: inline-flex; align-items: center; gap: 0;
  background: rgba(255,255,255,.05); backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.1); border-radius: 16px;
  overflow: hidden; margin-top: 32px;
}
.svcs-hs-item {
  display: flex; flex-direction: column; align-items: center; padding: 18px 32px;
}
.svcs-hs-item strong {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.7rem; font-weight: 800; line-height: 1;
  background: linear-gradient(135deg, var(--teal) 0%, #18a860 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.svcs-hs-item span { font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: rgba(255,255,255,.45); margin-top: 4px; }
.svcs-hs-divider { width: 1px; height: 42px; background: rgba(255,255,255,.1); }
@media (max-width: 576px) {
  .svcs-hero-stats { flex-direction: column; width: 100%; border-radius: 14px; }
  .svcs-hs-divider { width: 80%; height: 1px; }
  .svcs-hs-item { width: 100%; }
}

/* Intro chips */
.svcs-intro-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.svcs-chip {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: .82rem; font-weight: 600; color: #057a6e;
  background: rgba(8,160,144,.08); border: 1px solid rgba(8,160,144,.22);
  border-radius: 20px; padding: 6px 14px;
}
.svcs-chip .fa { font-size: .78rem; }

/* Intro visual widget */
.svcs-intro-visual {
  position: relative; display: flex; flex-direction: column;
  align-items: center; justify-content: center; min-height: 320px;
}
.siv-core {
  width: 120px; height: 120px; border-radius: 50%;
  background: linear-gradient(135deg, #0f1b2d 0%, #0d2a22 100%);
  border: 2px solid rgba(8,160,144,.35);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 0 18px rgba(8,160,144,.06), 0 0 0 36px rgba(8,160,144,.03);
  position: relative; z-index: 2;
}
.siv-core .fa { font-size: 2.4rem; color: var(--teal); animation: svcsCoreRotate 12s linear infinite; }
@keyframes svcsCoreRotate { to { transform: rotate(360deg); } }
.siv-core-ring {
  position: absolute; inset: -20px; border-radius: 50%;
  border: 1.5px dashed rgba(8,160,144,.25);
  animation: svcsRingSpin 20s linear infinite;
}
@keyframes svcsRingSpin { to { transform: rotate(360deg); } }
.siv-card {
  display: flex; align-items: center; gap: 14px;
  background: #fff; border: 1.5px solid #e5e7eb;
  border-radius: 14px; padding: 14px 18px;
  box-shadow: 0 8px 28px rgba(0,0,0,.08);
  position: absolute; left: 0; right: 0; max-width: 240px;
  transition: transform .3s;
}
.siv-card:hover { transform: translateX(6px); }
.siv-card--top    { top: 0; margin: 0 auto; }
.siv-card--bottom { bottom: 0; margin: 0 auto; }
.siv-card strong { display: block; font-size: .92rem; font-weight: 800; color: #0a0e1a; }
.siv-card span   { font-size: .78rem; color: #6b7280; }
.siv-icon {
  width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0;
  background: rgba(8,160,144,.12); border: 1px solid rgba(8,160,144,.2);
  display: flex; align-items: center; justify-content: center;
}
.siv-icon .fa { font-size: 1rem; color: var(--teal); }
.siv-icon--green { background: rgba(52,211,153,.12); border-color: rgba(52,211,153,.25); }
.siv-icon--green .fa { color: #10b981; }
@media (max-width: 900px) {
  .services-intro-grid { grid-template-columns: 1fr; }
  .svcs-intro-visual { display: none; }
}

/* Services Catalog — feature card grid */
.svcs-catalog-section { position: relative; }
.svcs-catalog-bg-grid {
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 40px 40px;
}
.svcs-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

/* Feature card base */
.svc-feature-card {
  position: relative; overflow: hidden;
  background: linear-gradient(160deg, #0f1e32 0%, #0b1520 100%);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 22px;
  display: flex; flex-direction: column;
  transition: transform .35s cubic-bezier(.22,.68,0,1.2), box-shadow .35s, border-color .35s;
  cursor: default;
}
.svc-feature-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 28px 64px rgba(0,0,0,.4);
}

/* Accent colour overrides — border & glow */
.svc-feature-card--teal:hover   { border-color: rgba(8,160,144,.4); }
.svc-feature-card--green:hover  { border-color: rgba(52,211,153,.4); }
.svc-feature-card--indigo:hover { border-color: rgba(129,140,248,.4); }
.svc-feature-card--purple:hover { border-color: rgba(167,139,250,.4); }

/* Glow blob on hover */
.sfc-glow {
  position: absolute; inset: -1px; border-radius: 22px; pointer-events: none; z-index: 0;
  opacity: 0; transition: opacity .4s;
}
.svc-feature-card:hover .sfc-glow { opacity: 1; }
.svc-feature-card--teal   .sfc-glow { background: radial-gradient(ellipse 60% 40% at 50% 0%, rgba(8,160,144,.14) 0%, transparent 70%); }
.svc-feature-card--green  .sfc-glow { background: radial-gradient(ellipse 60% 40% at 50% 0%, rgba(52,211,153,.12) 0%, transparent 70%); }
.svc-feature-card--indigo .sfc-glow { background: radial-gradient(ellipse 60% 40% at 50% 0%, rgba(129,140,248,.12) 0%, transparent 70%); }
.svc-feature-card--purple .sfc-glow { background: radial-gradient(ellipse 60% 40% at 50% 0%, rgba(167,139,250,.12) 0%, transparent 70%); }

/* Header strip with top accent line */
.sfc-header {
  position: relative; z-index: 1;
  display: flex; align-items: center; justify-content: space-between;
  padding: 28px 28px 0;
}
.svc-feature-card::before {
  content: ''; position: absolute; top: 0; left: 28px; right: 28px;
  height: 2px; border-radius: 0 0 4px 4px;
  transition: opacity .3s;
}
.svc-feature-card--teal::before   { background: linear-gradient(90deg, var(--teal), #18a860); }
.svc-feature-card--green::before  { background: linear-gradient(90deg, #34d399, #10b981); }
.svc-feature-card--indigo::before { background: linear-gradient(90deg, #818cf8, #6366f1); }
.svc-feature-card--purple::before { background: linear-gradient(90deg, #a78bfa, #7c3aed); }

/* Icon */
.sfc-icon-wrap { display: flex; align-items: center; }
.sfc-icon {
  width: 52px; height: 52px; border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  transition: transform .3s, background .3s;
}
.svc-feature-card:hover .sfc-icon { transform: scale(1.08); }
.svc-feature-card--teal   .sfc-icon { background: rgba(8,160,144,.15);   border: 1px solid rgba(8,160,144,.28); }
.svc-feature-card--green  .sfc-icon { background: rgba(52,211,153,.12);  border: 1px solid rgba(52,211,153,.28); }
.svc-feature-card--indigo .sfc-icon { background: rgba(129,140,248,.12); border: 1px solid rgba(129,140,248,.28); }
.svc-feature-card--purple .sfc-icon { background: rgba(167,139,250,.12); border: 1px solid rgba(167,139,250,.28); }
.svc-feature-card--teal   .sfc-icon .fa { color: var(--teal); font-size: 1.4rem; }
.svc-feature-card--green  .sfc-icon .fa { color: #34d399; font-size: 1.4rem; }
.svc-feature-card--indigo .sfc-icon .fa { color: #818cf8; font-size: 1.4rem; }
.svc-feature-card--purple .sfc-icon .fa { color: #a78bfa; font-size: 1.4rem; }

/* Meta badge */
.sfc-meta {
  font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 20px;
}
.svc-feature-card--teal   .sfc-meta { color: var(--teal);  background: rgba(8,160,144,.12);   border: 1px solid rgba(8,160,144,.22); }
.svc-feature-card--green  .sfc-meta { color: #34d399;       background: rgba(52,211,153,.1);   border: 1px solid rgba(52,211,153,.22); }
.svc-feature-card--indigo .sfc-meta { color: #818cf8;       background: rgba(129,140,248,.1);  border: 1px solid rgba(129,140,248,.22); }
.svc-feature-card--purple .sfc-meta { color: #a78bfa;       background: rgba(167,139,250,.1);  border: 1px solid rgba(167,139,250,.22); }

/* Body */
.sfc-body { position: relative; z-index: 1; padding: 22px 28px 0; flex: 1; }
.sfc-body h3 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.18rem; font-weight: 800; color: #fff; margin: 0 0 10px; letter-spacing: -.01em;
}
.sfc-body p { font-size: .9rem; color: rgba(255,255,255,.5); line-height: 1.72; margin: 0; }

/* Benefits list */
.sfc-benefits {
  list-style: none; margin: 18px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
}
.sfc-benefits li {
  display: flex; align-items: flex-start; gap: 9px;
  font-size: .84rem; color: rgba(255,255,255,.62); line-height: 1.45;
}
.sfc-benefits li .fa { font-size: .82rem; margin-top: 2px; flex-shrink: 0; }
.svc-feature-card--teal   .sfc-benefits li .fa { color: var(--teal); }
.svc-feature-card--green  .sfc-benefits li .fa { color: #34d399; }
.svc-feature-card--indigo .sfc-benefits li .fa { color: #818cf8; }
.svc-feature-card--purple .sfc-benefits li .fa { color: #a78bfa; }

/* Footer CTA */
.sfc-footer { position: relative; z-index: 1; padding: 20px 28px 28px; }
.sfc-cta {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .875rem; font-weight: 700; text-decoration: none;
  transition: gap .2s, color .2s;
}
.svc-feature-card--teal   .sfc-cta { color: var(--teal); }
.svc-feature-card--green  .sfc-cta { color: #34d399; }
.svc-feature-card--indigo .sfc-cta { color: #818cf8; }
.svc-feature-card--purple .sfc-cta { color: #a78bfa; }
.sfc-cta:hover { gap: 14px; text-decoration: none; }

/* How We Work process strip */
.svcs-process-strip {
  display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; gap: 0;
  align-items: start;
  background: #fff; border: 1.5px solid #e5e7eb; border-radius: 24px;
  overflow: hidden; box-shadow: 0 8px 40px rgba(0,0,0,.07);
}
.sps-step {
  padding: 40px 32px; text-align: center;
  transition: background .3s;
}
.sps-step:hover { background: rgba(8,160,144,.04); }
.sps-num {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 2.4rem; font-weight: 900; line-height: 1;
  background: linear-gradient(135deg, var(--teal), #18a860);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  margin-bottom: 14px; opacity: .18;
}
.sps-icon {
  width: 56px; height: 56px; border-radius: 14px;
  background: rgba(8,160,144,.1); border: 1px solid rgba(8,160,144,.22);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 16px;
  transition: background .3s, transform .3s;
}
.sps-step:hover .sps-icon { background: rgba(8,160,144,.18); transform: translateY(-3px); }
.sps-icon .fa { font-size: 1.3rem; color: var(--teal); }
.sps-step h4 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1rem; font-weight: 800; color: #0a0e1a; margin: 0 0 8px;
}
.sps-step p { font-size: .87rem; color: #6b7280; line-height: 1.65; margin: 0; }
.sps-connector {
  display: flex; align-items: center; justify-content: center;
  color: rgba(8,160,144,.4); font-size: 1rem; padding: 0 4px; align-self: center;
  border-left: 1px solid #e5e7eb; border-right: 1px solid #e5e7eb;
  height: 100%; min-height: 100px;
}
@media (max-width: 900px) {
  .svcs-process-strip { grid-template-columns: 1fr; }
  .sps-connector { border: none; border-top: 1px solid #e5e7eb; border-bottom: 1px solid #e5e7eb; padding: 8px 0; min-height: unset; transform: rotate(90deg); }
}

/* CTA Band */
.svcs-cta-band {
  background: linear-gradient(135deg, #051020 0%, #082c20 50%, #051020 100%);
  border-top: 1px solid rgba(8,160,144,.15);
  padding: 72px 0;
}
.svcs-cta-inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 48px; flex-wrap: wrap;
}
.svcs-cta-copy h2 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(1.6rem, 2.8vw, 2.2rem);
  font-weight: 800; color: #fff; letter-spacing: -.02em; margin: 0 0 10px;
}
.svcs-cta-copy p { font-size: .975rem; color: rgba(255,255,255,.55); line-height: 1.72; margin: 0; max-width: 480px; }
.svcs-cta-actions { display: flex; gap: 16px; flex-shrink: 0; flex-wrap: wrap; }
.btn-svcs-primary {
  display: inline-flex; align-items: center; gap: 9px;
  background: linear-gradient(135deg, var(--teal), #18a860);
  color: #fff; font-size: .95rem; font-weight: 700;
  padding: 14px 28px; border-radius: 12px; text-decoration: none;
  transition: opacity .2s, transform .2s, gap .2s; box-shadow: 0 6px 24px rgba(8,160,144,.35);
}
.btn-svcs-primary:hover { opacity: .92; transform: translateY(-2px); gap: 14px; text-decoration: none; color: #fff; }
.btn-svcs-ghost {
  display: inline-flex; align-items: center; gap: 9px;
  background: transparent; color: rgba(255,255,255,.75);
  font-size: .95rem; font-weight: 700;
  padding: 14px 28px; border-radius: 12px; text-decoration: none;
  border: 1.5px solid rgba(255,255,255,.18);
  transition: border-color .2s, color .2s, gap .2s;
}
.btn-svcs-ghost:hover { border-color: rgba(255,255,255,.4); color: #fff; gap: 14px; text-decoration: none; }

/* Responsive grid adjustments */
@media (max-width: 1024px) {
  .svcs-feature-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .svcs-feature-grid { grid-template-columns: 1fr; }
  .svcs-cta-inner { flex-direction: column; align-items: flex-start; }
  .svcs-cta-actions { width: 100%; }
  .btn-svcs-primary, .btn-svcs-ghost { width: 100%; justify-content: center; }
}

/* ══════════════════════════════════════════════════════════
   TECHNOLOGIES PAGE — full redesign
   ══════════════════════════════════════════════════════════ */

/* ── Legacy selectors (kept for compatibility) ─────────── */
.tech-intro-grid { display: grid; grid-template-columns: 1fr auto; gap: 48px; align-items: center; }
.tech-stacks-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.tech-icon-grid { display: flex; flex-wrap: wrap; gap: 7px; }
.tech-icon-item { width: 36px; height: 36px; border-radius: 8px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); display: flex; align-items: center; justify-content: center; overflow: hidden; transition: background .2s; }
.tech-icon-item:hover { background: rgba(255,255,255,.14); }
.tech-icon-item img { width: 24px; height: 24px; object-fit: contain; }

/* ── Intro section ─────────────────────────────────────── */
.tech-intro-section { background: linear-gradient(160deg, #f0fdfb 0%, #f8fafb 100%); }
.tech-intro-row { display: grid; grid-template-columns: 1fr auto; gap: 64px; align-items: center; }
.tech-intro-copy h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(1.7rem, 2.8vw, 2.4rem); font-weight: 800; color: #0a0e1a; margin: 14px 0 18px; }
.tech-intro-copy p { color: #374151; line-height: 1.8; font-size: .975rem; }

.tech-kpi-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.tech-kpi {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  background: #fff; border: 1.5px solid #e5e7eb; border-radius: 16px; padding: 20px 26px; text-align: center;
  box-shadow: 0 2px 12px rgba(0,0,0,.04); transition: border-color .25s, box-shadow .25s;
}
.tech-kpi:hover { border-color: rgba(8,160,144,.35); box-shadow: 0 6px 24px rgba(8,160,144,.1); }
.tech-kpi strong {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.7rem; font-weight: 800; line-height: 1;
  background: linear-gradient(135deg, var(--teal) 0%, #18a860 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.tech-kpi span { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #9ca3af; margin-top: 2px; }

/* ── Category nav pills ────────────────────────────────── */
.tech-cat-nav-section { background: #060e1d; border-bottom: 1px solid rgba(255,255,255,.06); position: sticky; top: 0; z-index: 40; }
.tech-cat-nav { display: flex; gap: 4px; overflow-x: auto; padding: 12px 0; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.tech-cat-nav::-webkit-scrollbar { display: none; }
.tech-cat-pill {
  display: inline-flex; align-items: center; white-space: nowrap;
  font-size: .78rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  padding: 7px 16px; border-radius: 20px; text-decoration: none;
  color: rgba(255,255,255,.45); border: 1px solid transparent;
  transition: color .2s, background .2s, border-color .2s;
}
.tech-cat-pill:hover { color: #fff; background: rgba(8,160,144,.12); border-color: rgba(8,160,144,.25); text-decoration: none; }
.tech-cat-pill.active { color: var(--teal); background: rgba(8,160,144,.12); border-color: rgba(8,160,144,.3); }

/* ── Category blocks ────────────────────────────────────── */
.tech-cats-section { background: linear-gradient(160deg, #060e1d 0%, #0a1628 100%); }
.tech-cat-block {
  display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start;
  padding: 64px 0; border-top: 1px solid rgba(255,255,255,.06);
  scroll-margin-top: 56px;
}
.tech-cat-block:first-of-type { border-top: none; padding-top: 0; }
.tech-cat-block--alt .tech-cat-info { order: 2; }
.tech-cat-block--alt .tech-cat-badges { order: 1; }

/* Info column */
.tech-cat-header { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.tech-cat-icon {
  width: 52px; height: 52px; border-radius: 14px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.3rem; transition: transform .3s;
}
.tech-cat-block:hover .tech-cat-icon { transform: scale(1.08); }
.tech-cat-icon .fa { color: #fff; }

.tech-cat-icon--teal   { background: linear-gradient(135deg, rgba(8,160,144,.3), rgba(8,160,144,.1)); border: 1px solid rgba(8,160,144,.35); }
.tech-cat-icon--indigo { background: linear-gradient(135deg, rgba(99,102,241,.3), rgba(99,102,241,.1)); border: 1px solid rgba(99,102,241,.35); }
.tech-cat-icon--green  { background: linear-gradient(135deg, rgba(5,150,105,.3), rgba(5,150,105,.1)); border: 1px solid rgba(5,150,105,.35); }
.tech-cat-icon--rose   { background: linear-gradient(135deg, rgba(190,18,60,.3), rgba(190,18,60,.1)); border: 1px solid rgba(190,18,60,.35); }
.tech-cat-icon--amber  { background: linear-gradient(135deg, rgba(217,119,6,.3), rgba(217,119,6,.1)); border: 1px solid rgba(217,119,6,.35); }
.tech-cat-icon--purple { background: linear-gradient(135deg, rgba(124,58,237,.3), rgba(124,58,237,.1)); border: 1px solid rgba(124,58,237,.35); }

.tech-cat-eyebrow { display: block; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--teal); margin-bottom: 4px; }
.tech-cat-info h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.5rem; font-weight: 800; color: #fff; margin: 0; }
.tech-cat-copy { font-size: .93rem; color: rgba(255,255,255,.55); line-height: 1.8; margin-bottom: 22px; }
.tech-cat-benefits { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.tech-cat-benefits li { display: flex; gap: 10px; font-size: .875rem; color: rgba(255,255,255,.7); line-height: 1.55; }
.tech-cat-benefits li .fa-check-circle { color: var(--teal); font-size: .9rem; flex-shrink: 0; margin-top: 2px; }

/* Badges column */
.tech-cat-badges { display: flex; flex-wrap: wrap; gap: 12px; align-content: flex-start; }
.tech-cats-section .tech-badge {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px; padding: 14px 16px; min-width: 88px; text-align: center;
  transition: background .25s, border-color .25s, transform .25s, box-shadow .25s;
  cursor: default;
}
.tech-cats-section .tech-badge:hover {
  background: rgba(8,160,144,.1); border-color: rgba(8,160,144,.3);
  transform: translateY(-4px); box-shadow: 0 8px 24px rgba(8,160,144,.15);
}
.tech-badge-img-wrap {
  width: 44px; height: 44px; border-radius: 10px;
  background: rgba(255,255,255,.06); display: flex; align-items: center; justify-content: center;
  overflow: hidden; transition: background .25s;
}
.tech-cats-section .tech-badge:hover .tech-badge-img-wrap { background: rgba(255,255,255,.12); }
.tech-badge-img-wrap img { width: 32px; height: 32px; object-fit: contain; }
.tech-cats-section .tech-badge span { font-size: .72rem; font-weight: 700; color: rgba(255,255,255,.5); letter-spacing: .03em; transition: color .25s; }
.tech-cats-section .tech-badge:hover span { color: rgba(255,255,255,.85); }

/* ── AI Section ─────────────────────────────────────────── */
.tech-ai-section {
  position: relative; overflow: hidden;
  padding: 96px 0 80px;
  background: linear-gradient(135deg, #03070f 0%, #060d1f 50%, #030b18 100%);
}

/* Orbs */
.tech-ai-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.tech-ai-orb {
  position: absolute; border-radius: 50%;
  filter: blur(90px); pointer-events: none;
}
.tech-ai-orb--1 { width: 500px; height: 500px; background: rgba(8,160,144,.12); top: -120px; left: -100px; animation: tech-ai-drift 12s ease-in-out infinite alternate; }
.tech-ai-orb--2 { width: 400px; height: 400px; background: rgba(99,102,241,.1); bottom: -80px; right: -60px; animation: tech-ai-drift 15s ease-in-out infinite alternate-reverse; }
.tech-ai-orb--3 { width: 300px; height: 300px; background: rgba(124,58,237,.08); top: 40%; left: 50%; transform: translateX(-50%); animation: tech-ai-drift 10s ease-in-out infinite alternate; }
@keyframes tech-ai-drift {
  from { transform: translate(0,0) scale(1); }
  to   { transform: translate(30px, 20px) scale(1.08); }
}

/* Grid line overlay */
.tech-ai-grid-lines {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(8,160,144,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8,160,144,.05) 1px, transparent 1px);
  background-size: 60px 60px;
}

/* Header */
.tech-ai-header { text-align: center; max-width: 720px; margin: 0 auto 48px; }
.tech-ai-eyebrow { color: var(--teal) !important; }
.tech-ai-header h2 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(1.9rem, 3.2vw, 2.8rem); font-weight: 800;
  color: #fff; margin: 14px 0 18px; line-height: 1.2;
}
.tech-ai-header p { color: rgba(255,255,255,.6); font-size: 1.02rem; line-height: 1.78; }

/* Stat band */
.tech-ai-intro-band {
  display: flex; align-items: center; justify-content: center; gap: 0;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px; padding: 24px 40px; margin-bottom: 56px; flex-wrap: wrap;
}
.tech-ai-stat { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 0 32px; }
.tech-ai-stat strong {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.3rem; font-weight: 800;
  background: linear-gradient(135deg, var(--teal) 0%, #818cf8 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.tech-ai-stat span { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: rgba(255,255,255,.4); }
.tech-ai-stat-div { width: 1px; height: 40px; background: rgba(255,255,255,.1); }

/* AI cards */
.tech-ai-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 56px; }
.tech-ai-card {
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px; padding: 28px 24px;
  display: flex; flex-direction: column; gap: 0;
  transition: transform .3s, border-color .3s, box-shadow .3s, background .3s;
}
.tech-ai-card:hover { transform: translateY(-8px); background: rgba(255,255,255,.07); }

.tech-ai-card--teal:hover   { border-color: rgba(8,160,144,.4);   box-shadow: 0 20px 52px rgba(8,160,144,.15); }
.tech-ai-card--violet:hover { border-color: rgba(99,102,241,.4);  box-shadow: 0 20px 52px rgba(99,102,241,.12); }
.tech-ai-card--green:hover  { border-color: rgba(5,150,105,.4);   box-shadow: 0 20px 52px rgba(5,150,105,.12); }
.tech-ai-card--amber:hover  { border-color: rgba(217,119,6,.4);   box-shadow: 0 20px 52px rgba(217,119,6,.1); }

.tech-ai-card-icon {
  position: relative; width: 56px; height: 56px; border-radius: 16px;
  display: flex; align-items: center; justify-content: center; margin-bottom: 20px;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  overflow: visible;
}
.tech-ai-card-icon .fa { font-size: 1.5rem; color: #fff; position: relative; z-index: 1; }
.tech-ai-icon-glow {
  position: absolute; inset: -8px; border-radius: 50%; filter: blur(16px); opacity: .6;
  transition: opacity .3s;
}
.tech-ai-card:hover .tech-ai-icon-glow { opacity: .9; }
.tech-ai-card--teal   .tech-ai-icon-glow { background: rgba(8,160,144,.5); }
.tech-ai-card--violet .tech-ai-icon-glow { background: rgba(99,102,241,.5); }
.tech-ai-card--green  .tech-ai-icon-glow { background: rgba(5,150,105,.5); }
.tech-ai-card--amber  .tech-ai-icon-glow { background: rgba(217,119,6,.5); }
.tech-ai-card--teal   .tech-ai-card-icon { border-color: rgba(8,160,144,.3); }
.tech-ai-card--violet .tech-ai-card-icon { border-color: rgba(99,102,241,.3); }
.tech-ai-card--green  .tech-ai-card-icon { border-color: rgba(5,150,105,.3); }
.tech-ai-card--amber  .tech-ai-card-icon { border-color: rgba(217,119,6,.3); }

.tech-ai-card h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.1rem; font-weight: 800; color: #fff; margin: 0 0 10px; }
.tech-ai-card > p { font-size: .88rem; color: rgba(255,255,255,.52); line-height: 1.75; margin-bottom: 20px; }

.tech-ai-points { list-style: none; padding: 0; margin: 0 0 0; display: flex; flex-direction: column; gap: 9px; }
.tech-ai-points li { display: flex; gap: 8px; font-size: .82rem; color: rgba(255,255,255,.55); line-height: 1.5; }
.tech-ai-points li .fa-chevron-right { font-size: .65rem; flex-shrink: 0; margin-top: 4px; }
.tech-ai-card--teal   .tech-ai-points li .fa-chevron-right { color: var(--teal); }
.tech-ai-card--violet .tech-ai-points li .fa-chevron-right { color: #818cf8; }
.tech-ai-card--green  .tech-ai-points li .fa-chevron-right { color: #34d399; }
.tech-ai-card--amber  .tech-ai-points li .fa-chevron-right { color: #fbbf24; }

/* AI CTA row */
.tech-ai-cta-row {
  display: flex; align-items: center; justify-content: space-between; gap: 40px;
  background: rgba(255,255,255,.04); border: 1px solid rgba(8,160,144,.2);
  border-radius: 20px; padding: 36px 40px;
}
.tech-ai-cta-copy h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.35rem; font-weight: 800; color: #fff; margin: 0 0 8px; }
.tech-ai-cta-copy p { color: rgba(255,255,255,.55); font-size: .93rem; line-height: 1.7; margin: 0; }
.tech-ai-cta-btn {
  display: inline-flex; align-items: center; gap: 10px; white-space: nowrap;
  background: linear-gradient(135deg, var(--teal) 0%, #18a860 100%);
  color: #fff; font-weight: 700; font-size: .95rem; padding: 14px 30px;
  border-radius: 12px; text-decoration: none;
  box-shadow: 0 4px 20px rgba(8,160,144,.35); transition: transform .2s, box-shadow .2s, gap .2s;
}
.tech-ai-cta-btn:hover { transform: translateY(-2px); gap: 14px; box-shadow: 0 10px 32px rgba(8,160,144,.5); color: #fff; text-decoration: none; }

/* ── CAREERS PAGE ───────────────────────────────────────── */
.careers-perks-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.perk-card {
  background: #fff; border: 1.5px solid #e5e7eb; border-radius: 18px; padding: 32px 24px; text-align: center;
  transition: box-shadow .3s, border-color .3s, transform .3s;
}
.perk-card:hover { transform: translateY(-5px); border-color: rgba(8,160,144,.4); box-shadow: 0 16px 40px rgba(8,160,144,.1); }
.perk-icon {
  width: 60px; height: 60px; border-radius: 16px;
  background: rgba(8,160,144,.1); border: 1px solid rgba(8,160,144,.2);
  display: flex; align-items: center; justify-content: center; margin: 0 auto 18px;
}
.perk-icon .fa { font-size: 1.5rem; color: var(--teal); }
.perk-card h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.1rem; font-weight: 800; color: #0a0e1a; margin: 0 0 10px; }
.perk-card p { font-size: .92rem; color: #6b7280; line-height: 1.7; margin: 0; }
.careers-values-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }
.career-value-card {
  background: linear-gradient(145deg, #0f1b2d 0%, #0d1825 100%);
  border: 1px solid rgba(255,255,255,.07); border-radius: 18px; padding: 32px 24px;
  transition: border-color .3s, transform .3s;
}
.career-value-card:hover { border-color: rgba(8,160,144,.3); transform: translateY(-5px); }
.career-value-icon {
  width: 48px; height: 48px; border-radius: 12px;
  background: rgba(8,160,144,.12); display: flex; align-items: center; justify-content: center; margin-bottom: 18px;
}
.career-value-icon .fa { font-size: 1.25rem; color: var(--teal); }
.career-value-card h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1rem; font-weight: 800; color: #fff; margin: 0 0 12px; }
.career-value-card ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.career-value-card ul li { font-size: .88rem; color: rgba(255,255,255,.52); line-height: 1.6; padding-left: 14px; position: relative; }
.career-value-card ul li::before { content: ''; position: absolute; left: 0; top: 9px; width: 5px; height: 5px; border-radius: 50%; background: var(--teal); }
.skills-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 56px; }
.skill-bar-label { display: flex; justify-content: space-between; margin-bottom: 8px; }
.skill-bar-label span { font-size: .9rem; font-weight: 600; color: rgba(255,255,255,.75); }
.skill-bar-label strong { font-size: .9rem; font-weight: 800; color: var(--teal); }
.skill-bar-track { height: 8px; background: rgba(255,255,255,.07); border-radius: 100px; overflow: hidden; }
.skill-bar-fill {
  height: 100%; border-radius: 100px;
  background: linear-gradient(90deg, var(--teal) 0%, #18a860 100%);
  width: 0; transition: width 1.4s cubic-bezier(.25,.46,.45,.94);
}

/* ── CONTACT PAGE ───────────────────────────────────────── */
.contact-intro-grid { display: grid; grid-template-columns: 1fr 280px; gap: 56px; align-items: center; }
.contact-intro-copy h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(1.7rem, 2.8vw, 2.4rem); font-weight: 800; color: #0a0e1a; margin: 16px 0 16px; }
.contact-intro-copy p { color: #374151; line-height: 1.78; font-size: .975rem; }
.contact-response-panel {
  background: linear-gradient(145deg, #0f1b2d 0%, #0d1825 100%);
  border: 1px solid rgba(8,160,144,.22); border-radius: 20px; padding: 32px 28px;
  display: flex; flex-direction: column; gap: 12px;
}
.contact-response-label { font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.35); }
.contact-response-item { display: flex; align-items: center; gap: 10px; font-size: .92rem; font-weight: 600; color: rgba(255,255,255,.72); }
.contact-response-item .fa { color: var(--teal); font-size: .9rem; }
.contact-workspace { display: grid; grid-template-columns: 320px 1fr; gap: 40px; }
.contact-info-panel { background: #fff; border: 1.5px solid #e5e7eb; border-radius: 20px; padding: 36px 28px; height: fit-content; position: sticky; top: 120px; }
.contact-info-panel h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.2rem; font-weight: 800; color: #0a0e1a; margin: 12px 0 8px; }
.contact-info-panel > p { color: #6b7280; font-size: .93rem; line-height: 1.7; margin-bottom: 24px; }
.contact-methods { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.contact-methods li { display: flex; gap: 14px; align-items: flex-start; }
.contact-methods .fa { font-size: 1.1rem; color: var(--teal); margin-top: 2px; flex-shrink: 0; }
.contact-methods div span { display: block; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #9ca3af; margin-bottom: 2px; }
.contact-methods div a { font-size: .93rem; font-weight: 600; color: #0a0e1a; text-decoration: none; }
.contact-methods div a:hover { color: var(--teal); }
.contact-form-panel { background: #fff; border: 1.5px solid #e5e7eb; border-radius: 20px; padding: 40px 44px; }
.contact-form-head { margin-bottom: 28px; }
.contact-form-head h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.4rem; font-weight: 800; color: #0a0e1a; margin: 12px 0 8px; }
.contact-form-head p { color: #6b7280; font-size: .93rem; line-height: 1.7; margin: 0; }
.contact-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.contact-field-wide { grid-column: 1 / -1; }
.contact-field { display: flex; flex-direction: column; gap: 6px; }
.contact-field label { font-size: .82rem; font-weight: 600; color: #374151; }
.contact-field input, .contact-field textarea {
  font-family: inherit; font-size: .93rem;
  border: 1.5px solid #d1d5db; border-radius: 10px; padding: 12px 16px;
  outline: none; color: #0a0e1a; background: #f9fafb; width: 100%;
  transition: border-color .2s, background .2s, box-shadow .2s;
}
.contact-field input:focus, .contact-field textarea:focus { border-color: var(--teal); background: #fff; box-shadow: 0 0 0 3px rgba(8,160,144,.1); }
.contact-field textarea { resize: vertical; min-height: 100px; }
.validation-message { font-size: .78rem; color: #dc2626; display: block; min-height: 16px; margin-top: 2px; }
.contact-form-actions { display: flex; align-items: flex-start; gap: 20px; flex-wrap: wrap; margin-top: 16px; }
.contact-submit {
  display: inline-flex; align-items: center; gap: 9px;
  background: linear-gradient(135deg, var(--teal) 0%, #18a860 100%);
  color: #fff; font-family: inherit; font-size: .92rem; font-weight: 700;
  padding: 14px 30px; border: none; border-radius: 10px; cursor: pointer;
  box-shadow: 0 4px 20px rgba(8,160,144,.35); transition: transform .2s, box-shadow .2s;
}
.contact-submit:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(8,160,144,.5); }
.contact-alert {
  display: flex; align-items: center; gap: 12px;
  background: #f0fafa; border: 1.5px solid rgba(8,160,144,.3);
  border-radius: 10px; padding: 14px 18px; margin-bottom: 20px; font-size: .92rem; color: var(--teal);
}
.contact-map-layout { display: grid; grid-template-columns: 300px 1fr; gap: 40px; align-items: start; }
.contact-map-copy h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.5rem; font-weight: 800; color: #0a0e1a; margin: 12px 0 10px; }
.contact-map-copy p { color: #374151; font-size: .93rem; margin-bottom: 18px; }
.contact-map-copy a { display: inline-flex; align-items: center; gap: 8px; color: var(--teal); font-weight: 700; font-size: .9rem; text-decoration: none; }
.contact-map-copy a:hover { text-decoration: underline; }
.contact-map-frame iframe { width: 100%; height: 380px; border-radius: 16px; border: 0; }

/* ── PRODUCTS PAGE ──────────────────────────────────────── */
.products-header { text-align: center; max-width: 640px; margin: 0 auto 72px; }
.products-header h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(1.7rem, 2.8vw, 2.4rem); font-weight: 800; color: #0a0e1a; margin: 12px 0 16px; }
.products-header p { color: #374151; font-size: .975rem; line-height: 1.78; }
.product-row { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; padding: 56px 0; border-top: 1px solid #e5e7eb; }
.product-row:first-child { border-top: none; padding-top: 0; }
.product-row-reverse .product-row-copy { order: 2; }
.product-row-reverse .product-row-visual { order: 1; }
.product-row-num { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 4.5rem; font-weight: 800; line-height: 1; color: rgba(8,160,144,.1); letter-spacing: -.04em; margin-bottom: 4px; }
.product-row-copy h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(1.5rem, 2.3vw, 2rem); font-weight: 800; color: #0a0e1a; margin: 8px 0 16px; }
.product-row-copy p { color: #374151; font-size: .975rem; line-height: 1.8; margin-bottom: 28px; }
.product-row-link {
  display: inline-flex; align-items: center; gap: 9px;
  background: linear-gradient(135deg, var(--teal) 0%, #18a860 100%);
  color: #fff; font-weight: 700; font-size: .9rem; padding: 12px 26px; border-radius: 10px;
  text-decoration: none; box-shadow: 0 4px 16px rgba(8,160,144,.3); transition: transform .2s, box-shadow .2s;
}
.product-row-link:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(8,160,144,.45); color: #fff; text-decoration: none; }
.product-row-visual { border-radius: 20px; overflow: hidden; box-shadow: 0 16px 48px rgba(0,0,0,.1); }
.product-row-visual img { width: 100%; height: auto; display: block; }

/* ── BLOG PAGE ──────────────────────────────────────────── */
.blog-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.blog-card {
  background: linear-gradient(145deg, #0f1b2d 0%, #0d1825 100%);
  border: 1px solid rgba(255,255,255,.07); border-radius: 18px;
  overflow: hidden; display: flex; flex-direction: column;
  transition: transform .3s, border-color .3s, box-shadow .3s;
}
.blog-card:hover { transform: translateY(-6px); border-color: rgba(8,160,144,.3); box-shadow: 0 20px 48px rgba(0,0,0,.32); }
.blog-card-img { width: 100%; height: 180px; object-fit: cover; display: block; }
.blog-card-body { padding: 24px; display: flex; flex-direction: column; flex: 1; }
.blog-card-meta { font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--teal); margin-bottom: 10px; }
.blog-card h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1rem; font-weight: 800; color: #fff; margin: 0 0 12px; line-height: 1.4; }
.blog-card h3 a { color: inherit; text-decoration: none; }
.blog-card h3 a:hover { color: var(--teal); }
.blog-card p { font-size: .9rem; color: rgba(255,255,255,.5); line-height: 1.7; margin: 0 0 18px; flex: 1; }
.blog-card-link { display: inline-flex; align-items: center; gap: 7px; font-size: .85rem; font-weight: 700; color: var(--teal); text-decoration: none; }
.blog-card-link:hover { gap: 11px; color: var(--teal); text-decoration: none; }

/* ── PRIVACY PAGE ───────────────────────────────────────── */
.privacy-content { max-width: 780px; margin: 0 auto; }
.privacy-content h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.35rem; font-weight: 800; color: #0a0e1a; margin: 40px 0 14px; }
.privacy-content h2:first-child { margin-top: 0; }
.privacy-content p { font-size: .975rem; color: #374151; line-height: 1.8; margin-bottom: 16px; }
.privacy-content ul { margin: 0 0 16px; padding-left: 24px; }
.privacy-content ul li { font-size: .975rem; color: #374151; line-height: 1.8; margin-bottom: 8px; }
.privacy-content a { color: var(--teal); }
.privacy-content a:hover { text-decoration: underline; }

/* ── OSS Products shared include ────────────────────────── */
.oss-include-section { padding: 96px 0; background: var(--paper, #f8fafb); }
.oss-include-header { text-align: center; max-width: 620px; margin: 0 auto 56px; }
.oss-include-header h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(1.7rem, 2.8vw, 2.4rem); font-weight: 800; color: #0a0e1a; margin: 12px 0 14px; }
.oss-include-header p { color: #374151; font-size: .975rem; line-height: 1.78; }
.oss-include-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.oss-product-card {
  background: #fff; border: 1.5px solid #e5e7eb; border-radius: 20px; padding: 36px 32px;
  display: flex; flex-direction: column; transition: box-shadow .3s, border-color .3s, transform .3s;
}
.oss-product-card:hover { transform: translateY(-5px); border-color: rgba(8,160,144,.35); box-shadow: 0 16px 44px rgba(8,160,144,.1); }
.oss-product-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.oss-product-logo { height: 44px; width: auto; object-fit: contain; }
.oss-product-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: #374151; background: #f3f4f6; border: 1px solid #e5e7eb; padding: 4px 10px; border-radius: 20px;
}
.oss-product-card h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 1.25rem; font-weight: 800; color: #0a0e1a; margin: 0 0 10px; }
.oss-product-card > p { font-size: .93rem; color: #374151; line-height: 1.78; margin-bottom: 20px; }
.oss-benefits { list-style: none; margin: 0 0 24px; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.oss-benefits li { display: flex; gap: 10px; font-size: .9rem; color: #374151; line-height: 1.6; }
.oss-benefits .fa { color: var(--teal); flex-shrink: 0; margin-top: 2px; }
.oss-product-footer { display: flex; align-items: flex-end; justify-content: space-between; margin-top: auto; gap: 16px; }
.oss-product-footer span strong { display: block; font-size: .72rem; font-weight: 700; color: #9ca3af; text-transform: uppercase; letter-spacing: .07em; }
.oss-product-footer span small { font-size: .88rem; color: #374151; font-weight: 600; }
.oss-product-link { display: inline-flex; align-items: center; gap: 8px; font-size: .88rem; font-weight: 700; color: var(--teal); text-decoration: none; transition: gap .2s; white-space: nowrap; }
.oss-product-link:hover { gap: 12px; color: var(--teal); text-decoration: none; }

/* ── Financial Spotlight (shared include) ───────────────── */
.financial-spotlight-section {
  padding: 96px 0;
  background: linear-gradient(180deg, #070c18 0%, #0a1020 100%);
}
.financial-spotlight-card {
  display: grid; grid-template-columns: 1fr 320px; gap: 72px; align-items: center;
  background: linear-gradient(145deg, #0f1b2d 0%, #0d1825 100%);
  border: 1px solid rgba(8,160,144,.2); border-radius: 24px; padding: 56px;
}
.financial-spotlight-copy h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(1.7rem, 2.8vw, 2.3rem); font-weight: 800; color: #fff; margin: 14px 0 14px; }
.financial-spotlight-copy p { font-size: .975rem; color: rgba(255,255,255,.58); line-height: 1.78; margin-bottom: 22px; }
.financial-spotlight-list { list-style: none; margin: 0 0 32px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.financial-spotlight-list li { display: flex; gap: 12px; font-size: .93rem; color: rgba(255,255,255,.65); line-height: 1.65; }
.financial-spotlight-list .fa { color: var(--teal); flex-shrink: 0; margin-top: 2px; }
.financial-spotlight-copy .btn-box a {
  display: inline-flex; align-items: center; gap: 9px;
  background: linear-gradient(135deg, var(--teal) 0%, #18a860 100%);
  color: #fff; font-weight: 700; font-size: .92rem; padding: 13px 26px; border-radius: 10px;
  text-decoration: none; box-shadow: 0 4px 18px rgba(8,160,144,.35); transition: transform .2s, box-shadow .2s;
}
.financial-spotlight-copy .btn-box a:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(8,160,144,.5); color: #fff; text-decoration: none; }
.financial-spotlight-visual { position: relative; width: 260px; height: 260px; flex-shrink: 0; margin: 0 auto; }
.finance-orbit { position: absolute; border-radius: 50%; }
.finance-orbit-one { inset: 0; border: 1.5px solid rgba(8,160,144,.3); animation: fvSpin 20s linear infinite; }
.finance-orbit-two { inset: 28px; border: 1px dashed rgba(8,160,144,.2); animation: fvSpin 32s linear infinite reverse; }
.finance-core {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 88px; height: 88px; border-radius: 50%;
  background: linear-gradient(135deg, #0f1b2d, #0d1825);
  border: 2.5px solid rgba(8,160,144,.4);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.8rem; color: var(--teal);
  box-shadow: 0 0 0 8px rgba(8,160,144,.07);
  animation: fvCenterGlow 5s ease-in-out infinite;
}
.finance-node {
  position: absolute; width: 40px; height: 40px; border-radius: 50%;
  background: #0f1b2d; border: 1.5px solid rgba(8,160,144,.35);
  display: flex; align-items: center; justify-content: center; font-size: .9rem; color: var(--teal);
}
.finance-node-growth { top: -8px; left: 50%; transform: translateX(-50%); animation: fvFloat1 6s ease-in-out infinite; }
.finance-node-shield { top: 50%; right: -8px; transform: translateY(-50%); animation: fvFloat2 7s ease-in-out infinite; }
.finance-node-bank   { bottom: -8px; left: 50%; transform: translateX(-50%); animation: fvFloat3 5.5s ease-in-out infinite; }
.finance-node-lock   { top: 50%; left: -8px; transform: translateY(-50%); animation: fvFloat4 8s ease-in-out infinite; }

@keyframes fvSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes fvCenterGlow {
  0%,100% { box-shadow: 0 0 0 8px rgba(8,160,144,.07), 0 0 32px rgba(8,160,144,.2); }
  50% { box-shadow: 0 0 0 16px rgba(8,160,144,.12), 0 0 48px rgba(8,160,144,.35); }
}
@keyframes fvFloat1 { 0%,100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(-8px); } }
@keyframes fvFloat2 { 0%,100% { transform: translateY(-50%) translateX(0); } 50% { transform: translateY(-50%) translateX(8px); } }
@keyframes fvFloat3 { 0%,100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(8px); } }
@keyframes fvFloat4 { 0%,100% { transform: translateY(-50%) translateX(0); } 50% { transform: translateY(-50%) translateX(-8px); } }

/* ── Blog extras ─────────────────────────────────────────── */
.blog-card img { width: 100%; height: 180px; object-fit: cover; display: block; }
.blog-card-meta { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.blog-tag { display: inline-block; font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ink); background: var(--teal); padding: 2px 8px; border-radius: 4px; }

/* ── Privacy extras ──────────────────────────────────────── */
.privacy-effective { font-size: .83rem; color: #9ca3af; margin-bottom: 32px; border-bottom: 1px solid #e5e7eb; padding-bottom: 16px; }
.privacy-content a { color: var(--teal); text-decoration: none; font-weight: 600; }
.privacy-content a:hover { text-decoration: underline; }
.privacy-content strong { color: #0a0e1a; }

/* ── OSS badge ───────────────────────────────────────────── */
.oss-product-badge { display: inline-flex; align-items: center; gap: 6px; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.7); background: rgba(8,160,144,.12); border: 1px solid rgba(8,160,144,.25); border-radius: 20px; padding: 4px 12px; }
.oss-product-badge .fa { color: var(--teal); }
.oss-product-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }

/* ============================================================
   ABOUT PAGE — ENHANCED HERO
   ============================================================ */
.about-hero { position: relative; }

/* Animated ambient orbs */
.about-hero-orb {
  position: absolute; border-radius: 50%; pointer-events: none; z-index: 0;
  animation: orbFloat 8s ease-in-out infinite;
}
.about-hero-orb--a {
  width: 480px; height: 480px;
  top: -120px; right: -80px;
  background: radial-gradient(circle, rgba(8,160,144,.18) 0%, transparent 65%);
  animation-delay: 0s;
}
.about-hero-orb--b {
  width: 320px; height: 320px;
  bottom: 40px; left: 5%;
  background: radial-gradient(circle, rgba(99,102,241,.15) 0%, transparent 65%);
  animation-delay: -4s;
}
@keyframes orbFloat {
  0%,100% { transform: translateY(0) scale(1); }
  50%      { transform: translateY(-28px) scale(1.06); }
}

/* Floating milestone badges */
.about-hero-badges {
  display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 28px;
}
.about-hero-badge {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--teal); background: rgba(8,160,144,.1); border: 1px solid rgba(8,160,144,.28);
  padding: 6px 14px; border-radius: 20px;
  animation: badgePop .5s cubic-bezier(.34,1.56,.64,1) both;
}
.about-hero-badge:nth-child(2) { animation-delay: .12s; }
.about-hero-badge:nth-child(3) { animation-delay: .24s; }
.about-hero-badge--green { color: #18a860; background: rgba(24,168,96,.1); border-color: rgba(24,168,96,.28); }
.about-hero-badge--indigo { color: #818cf8; background: rgba(99,102,241,.1); border-color: rgba(99,102,241,.28); }
@keyframes badgePop {
  from { opacity: 0; transform: scale(.7) translateY(10px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* Inline hero stats */
.about-hero-stats {
  display: flex; align-items: center; gap: 0; margin-top: 36px;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1);
  border-radius: 14px; padding: 20px 28px; width: fit-content; max-width: 100%;
  backdrop-filter: blur(8px);
}
.ahs-item { text-align: center; padding: 0 24px; }
.ahs-item strong {
  display: block; font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.8rem; font-weight: 800; line-height: 1;
  background: linear-gradient(135deg, var(--teal) 0%, #18a860 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.ahs-item span { display: block; font-size: .72rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.45); margin-top: 4px; }
.ahs-divider { width: 1px; height: 40px; background: rgba(255,255,255,.12); flex-shrink: 0; }

/* ============================================================
   ABOUT PAGE — TIMELINE
   ============================================================ */
.timeline-section { background: var(--paper); }

.tl-wrap {
  position: relative;
  padding: 8px 0 16px;
}

/* Static gradient spine */
.tl-wrap::before {
  content: '';
  position: absolute;
  left: 50%; top: 0; bottom: 0;
  width: 2px;
  transform: translateX(-50%);
  background: linear-gradient(180deg,
    rgba(8,160,144,0) 0%,
    rgba(8,160,144,.25) 4%,
    rgba(8,160,144,.25) 96%,
    rgba(8,160,144,0) 100%
  );
}

/* Animated fill spine (JS-triggered) */
.tl-spine-fill {
  position: absolute;
  left: 50%; top: 0;
  width: 2px;
  height: 0;
  transform: translateX(-50%);
  background: linear-gradient(180deg, var(--teal) 0%, #18a860 100%);
  box-shadow: 0 0 14px rgba(8,160,144,.7);
  transition: height 2.8s cubic-bezier(.25,.46,.45,.94);
  z-index: 1;
}
.tl-spine-fill.tl-spine-active { height: 100%; }

/* Each row: 3-col grid — card | dot | empty (or empty | dot | card) */
.tl-row {
  display: grid;
  grid-template-columns: 1fr 80px 1fr;
  align-items: center;
  margin-bottom: 12px;
}

.tl-col-dot {
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
  position: relative;
}

.tl-col-spacer { /* intentionally empty */ }

/* The pulsing dot */
.tl-dot {
  width: 56px; height: 56px; border-radius: 50%;
  background: linear-gradient(135deg, var(--teal), #18a860);
  display: flex; align-items: center; justify-content: center;
  position: relative; flex-shrink: 0;
  box-shadow: 0 0 20px rgba(8,160,144,.45);
  animation: tlPulse 3.5s ease-in-out infinite;
}
.tl-dot::before {
  content: '';
  position: absolute; inset: -7px;
  border-radius: 50%;
  border: 2px solid rgba(8,160,144,.35);
  animation: tlRing 3.5s ease-in-out infinite;
}
.tl-dot .fa { font-size: 1.15rem; color: #fff; }

@keyframes tlPulse {
  0%,100% { box-shadow: 0 0 18px rgba(8,160,144,.4); }
  50%      { box-shadow: 0 0 32px rgba(8,160,144,.65), 0 0 0 10px rgba(8,160,144,0); }
}
@keyframes tlRing {
  0%,100% { opacity: .4; transform: scale(1); }
  50%      { opacity: .85; transform: scale(1.18); }
}

/* Timeline card */
.tl-col-card { display: flex; }
.tl-col-card:has(.tl-card--left)  { justify-content: flex-end; }
.tl-col-card:has(.tl-card--right) { justify-content: flex-start; }

.tl-card {
  background: #fff;
  border: 1.5px solid #e5e7eb;
  border-radius: 18px;
  padding: 26px 28px 24px;
  max-width: 380px; width: 100%;
  position: relative;
  transition: transform .32s cubic-bezier(.25,.46,.45,.94), box-shadow .32s, border-color .32s;
}
.tl-card:hover {
  transform: translateY(-5px);
  border-color: rgba(8,160,144,.4);
  box-shadow: 0 16px 48px rgba(8,160,144,.12);
}

/* Horizontal connector from card edge to dot */
.tl-card--left::after,
.tl-card--right::before {
  content: '';
  position: absolute;
  top: 50%; width: 20px; height: 2px;
  background: linear-gradient(90deg, rgba(8,160,144,.4), rgba(8,160,144,.15));
}
.tl-card--left  { margin-right: 16px; text-align: right; }
.tl-card--left::after  { right: -20px; transform: translateY(-50%); }
.tl-card--right { margin-left: 16px;  text-align: left; }
.tl-card--right::before { left: -20px; transform: translateY(-50%); background: linear-gradient(270deg, rgba(8,160,144,.4), rgba(8,160,144,.15)); }

/* Year & tag */
.tl-tag {
  display: inline-block;
  font-size: .62rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase;
  color: var(--teal); background: rgba(8,160,144,.08);
  border: 1px solid rgba(8,160,144,.22); border-radius: 20px;
  padding: 3px 10px; margin-bottom: 8px;
}
.tl-year {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 2rem; font-weight: 800; letter-spacing: -.04em; line-height: 1;
  margin-bottom: 10px;
  background: linear-gradient(135deg, var(--teal) 0%, #18a860 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  display: block;
}
.tl-card h3 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.05rem; font-weight: 800; color: #0a0e1a;
  margin: 0 0 8px; line-height: 1.3;
}
.tl-card p {
  font-size: .875rem; color: #4b5563; line-height: 1.72; margin: 0;
}

/* ── Timeline mobile ────────────────────────────────────── */
@media (max-width: 768px) {
  .tl-wrap::before { left: 20px; }
  .tl-spine-fill  { left: 20px; }

  .tl-row {
    grid-template-columns: 44px 1fr;
    align-items: flex-start;
    margin-bottom: 24px;
  }
  /* Reorder all rows: dot first, then card */
  .tl-col-dot   { order: 1; grid-column: 1; align-items: flex-start; padding-top: 8px; }
  .tl-col-card  { order: 2; grid-column: 2; }
  .tl-col-spacer { display: none; }

  .tl-col-card { justify-content: flex-start !important; }
  .tl-card--left, .tl-card--right { text-align: left; margin: 0 0 0 10px; max-width: 100%; }
  .tl-card--left::after, .tl-card--right::before { display: none; }

  .tl-dot { width: 40px; height: 40px; }
  .tl-dot .fa { font-size: .95rem; }
}

/* ============================================================
   ABOUT PAGE — CULTURE DNA
   ============================================================ */
.culture-section { overflow: hidden; position: relative; }
.culture-section::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 60% 50% at 10% 80%, rgba(8,160,144,.12) 0%, transparent 60%),
    radial-gradient(ellipse 50% 60% at 90% 20%, rgba(99,102,241,.1) 0%, transparent 60%);
  pointer-events: none;
}

.culture-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  position: relative; z-index: 1;
}

.culture-card {
  background: linear-gradient(145deg, #0f1b2d 0%, #0d1825 100%);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 22px;
  padding: 44px 36px;
  position: relative; overflow: hidden;
  transition: transform .32s cubic-bezier(.25,.46,.45,.94), border-color .32s, box-shadow .32s;
}
.culture-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
}
.culture-card--teal:hover   { border-color: rgba(8,160,144,.35); }
.culture-card--green:hover  { border-color: rgba(24,168,96,.35); }
.culture-card--indigo:hover { border-color: rgba(99,102,241,.35); }

/* Top-right corner glow bleed */
.culture-card::after {
  content: '';
  position: absolute; top: 0; right: 0;
  width: 160px; height: 160px; border-radius: 50%;
  opacity: 0; transition: opacity .4s;
  pointer-events: none;
}
.culture-card--teal::after   { background: radial-gradient(circle, rgba(8,160,144,.18) 0%, transparent 70%); }
.culture-card--green::after  { background: radial-gradient(circle, rgba(24,168,96,.18) 0%, transparent 70%); }
.culture-card--indigo::after { background: radial-gradient(circle, rgba(99,102,241,.18) 0%, transparent 70%); }
.culture-card:hover::after   { opacity: 1; }

/* Icon wrapper with glow effect */
.culture-icon-wrap {
  position: relative;
  width: 68px; height: 68px;
  margin-bottom: 28px;
}
.culture-icon {
  width: 68px; height: 68px; border-radius: 18px;
  display: flex; align-items: center; justify-content: center;
  position: relative; z-index: 1;
}
.culture-card--teal   .culture-icon { background: rgba(8,160,144,.15); border: 1.5px solid rgba(8,160,144,.3); }
.culture-card--green  .culture-icon { background: rgba(24,168,96,.15);  border: 1.5px solid rgba(24,168,96,.3); }
.culture-card--indigo .culture-icon { background: rgba(99,102,241,.15); border: 1.5px solid rgba(99,102,241,.3); }
.culture-icon .fa { font-size: 1.6rem; }
.culture-card--teal   .culture-icon .fa { color: var(--teal); }
.culture-card--green  .culture-icon .fa { color: #18a860; }
.culture-card--indigo .culture-icon .fa { color: #818cf8; }

.culture-icon-glow {
  position: absolute; inset: -8px; border-radius: 50%;
  opacity: 0; transition: opacity .4s;
}
.culture-card--teal   .culture-icon-glow { background: radial-gradient(circle, rgba(8,160,144,.3) 0%, transparent 70%); }
.culture-card--green  .culture-icon-glow { background: radial-gradient(circle, rgba(24,168,96,.3) 0%, transparent 70%); }
.culture-card--indigo .culture-icon-glow { background: radial-gradient(circle, rgba(99,102,241,.3) 0%, transparent 70%); }
.culture-card:hover .culture-icon-glow { opacity: 1; }

.culture-card h3 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.25rem; font-weight: 800; color: #fff;
  margin: 0 0 12px;
}
.culture-card p {
  font-size: .92rem; color: rgba(255,255,255,.52); line-height: 1.75; margin: 0;
}

/* CTA row below cards */
.culture-cta {
  display: flex; align-items: center; justify-content: center;
  gap: 16px; flex-wrap: wrap;
  margin-top: 48px;
  position: relative; z-index: 1;
}
.culture-cta-btn {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: inherit; font-size: .92rem; font-weight: 700;
  padding: 13px 28px; border-radius: 10px; text-decoration: none;
  transition: transform .2s, box-shadow .2s;
  background: linear-gradient(135deg, var(--teal) 0%, #18a860 100%);
  color: #fff; box-shadow: 0 4px 18px rgba(8,160,144,.35);
}
.culture-cta-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(8,160,144,.5); color: #fff; text-decoration: none; }
.culture-cta-btn--ghost {
  background: transparent;
  border: 1.5px solid rgba(8,160,144,.4);
  color: var(--teal);
  box-shadow: none;
}
.culture-cta-btn--ghost:hover { background: rgba(8,160,144,.1); box-shadow: none; color: var(--teal); }

/* ── Culture grid mobile ────────────────────────────────── */
@media (max-width: 991px) {
  .culture-grid { grid-template-columns: 1fr 1fr; }
  .culture-grid > *:last-child { grid-column: 1 / -1; max-width: 400px; margin: 0 auto; width: 100%; }
}
@media (max-width: 576px) {
  .culture-grid { grid-template-columns: 1fr; }
  .culture-grid > *:last-child { grid-column: auto; max-width: 100%; }
  .culture-card { padding: 32px 24px; }
}

/* ── Hero stats mobile ──────────────────────────────────── */
@media (max-width: 576px) {
  .about-hero-stats { flex-direction: column; gap: 16px; align-items: flex-start; width: 100%; }
  .ahs-divider { width: 100%; height: 1px; }
  .ahs-item { padding: 0; text-align: left; }
  .about-hero-badges { gap: 8px; }
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 1024px) {
  .financial-spotlight-card { grid-template-columns: 1fr; gap: 40px; }
  .financial-spotlight-visual { order: -1; }
}
@media (max-width: 900px) {
  .about-intro-grid,
  .services-intro-grid,
  .tech-intro-grid,
  .contact-intro-grid { grid-template-columns: 1fr; }
  .vision-grid { grid-template-columns: 1fr; }
  .values-grid,
  .services-catalog-grid,
  .tech-stacks-grid { grid-template-columns: repeat(2,1fr); }
  .careers-perks-grid { grid-template-columns: repeat(2,1fr); }
  .careers-values-grid { grid-template-columns: repeat(2,1fr); }
  .stats-strip { grid-template-columns: repeat(2,1fr); }
  .stats-strip-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,.07); }
  .stats-strip-item:last-child { border-bottom: none; }
  .contact-workspace { grid-template-columns: 1fr; }
  .contact-info-panel { position: static; }
  .contact-map-layout { grid-template-columns: 1fr; }
  .product-row { grid-template-columns: 1fr; gap: 32px; }
  .product-row-reverse .product-row-copy,
  .product-row-reverse .product-row-visual { order: unset; }
  .blog-grid { grid-template-columns: repeat(2,1fr); }
  .skills-grid { grid-template-columns: 1fr; }
  .oss-include-grid { grid-template-columns: 1fr; }
}
@media (max-width: 576px) {
  .values-grid,
  .services-catalog-grid,
  .tech-stacks-grid,
  .careers-perks-grid,
  .careers-values-grid,
  .blog-grid { grid-template-columns: 1fr; }
  .stats-strip { grid-template-columns: 1fr 1fr; }
  .contact-form-grid { grid-template-columns: 1fr; }
  .contact-form-panel { padding: 28px 20px; }
  .why-panel { padding: 36px 28px; }
}

/* ─── Service Detail Pages ──────────────────────────────── */
.svc-overview-grid {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: 3.5rem;
  align-items: start;
}
.svc-section-label {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--teal);
  margin-bottom: .5rem;
}
.svc-overview-text p {
  font-size: 1.05rem;
  line-height: 1.85;
  color: var(--ink);
  opacity: .8;
  margin-bottom: 1rem;
}
.svc-list-panel {
  background: #fff;
  border-radius: 1rem;
  padding: 1.75rem 2rem;
  border: 1px solid rgba(8,160,144,.18);
  box-shadow: 0 4px 20px rgba(8,160,144,.06);
}
.svc-list-panel h5 {
  font-size: .9rem;
  font-weight: 700;
  color: var(--teal-dark);
  margin-bottom: 1rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.svc-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.svc-list li {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  padding: .45rem 0;
  font-size: .9rem;
  line-height: 1.5;
  color: var(--ink);
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.svc-list li:last-child { border-bottom: none; }
.svc-list li::before {
  content: '\f00c';
  font-family: 'FontAwesome';
  color: var(--teal);
  font-size: .75rem;
  margin-top: .25rem;
  flex-shrink: 0;
}

/* Card grids */
.svc-card-grid {
  display: grid;
  gap: 1.5rem;
}
.svc-card-grid.cols-3 { grid-template-columns: repeat(3,1fr); }
.svc-card-grid.cols-2 { grid-template-columns: repeat(2,1fr); }
.svc-card-grid.cols-4 { grid-template-columns: repeat(4,1fr); }
.svc-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 1rem;
  padding: 2rem;
  transition: border-color .25s, transform .25s;
}
.svc-card:hover { border-color: var(--teal); transform: translateY(-4px); }
.svc-card-icon {
  width: 48px;
  height: 48px;
  border-radius: .75rem;
  background: rgba(8,160,144,.15);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
}
.svc-card-icon i { color: var(--teal); font-size: 1.2rem; }
.svc-card h5 {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: .5rem;
}
.svc-card p {
  font-size: .875rem;
  color: rgba(255,255,255,.65);
  line-height: 1.65;
  margin: 0;
}
/* Light card variant (used in light sections) */
.svc-card.light {
  background: #fff;
  border: 1px solid rgba(8,160,144,.14);
  box-shadow: 0 2px 12px rgba(0,0,0,.05);
}
.svc-card.light h5 { color: var(--ink); }
.svc-card.light p { color: rgba(10,14,26,.6); }

/* Split rows — alternating image+text */
.svc-split-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}
.svc-split-content h3 {
  font-size: 1.6rem;
  font-weight: 800;
  margin-bottom: 1rem;
}
.svc-split-content p {
  font-size: 1rem;
  line-height: 1.8;
  opacity: .82;
  margin-bottom: 1rem;
}
.svc-split-content a.btn {
  margin-top: .5rem;
}
.svc-split-img img {
  width: 100%;
  border-radius: 1rem;
  object-fit: cover;
}
.page-section-dark .svc-split-content h3 { color: #fff; }
.page-section-dark .svc-split-content p { color: rgba(255,255,255,.72); }
.page-section-light .svc-split-content h3 { color: var(--ink); }
.page-section-light .svc-split-content p { color: rgba(10,14,26,.72); }

/* Enablers icon grid */
.svc-enablers-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 1.5rem;
}
.svc-enabler-item {
  background: #fff;
  border: 1px solid rgba(8,160,144,.12);
  border-radius: 1rem;
  padding: 1.75rem 1rem;
  text-align: center;
  transition: border-color .25s, transform .25s;
}
.svc-enabler-item:hover { border-color: var(--teal); transform: translateY(-4px); }
.svc-enabler-item img {
  width: 52px;
  height: 52px;
  object-fit: contain;
  margin-bottom: .85rem;
}
.svc-enabler-item h6 {
  font-size: .82rem;
  font-weight: 700;
  color: var(--ink);
  margin: 0;
}

/* Process steps (horizontal) */
.svc-process-steps {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  position: relative;
}
.svc-process-step {
  flex: 1;
  text-align: center;
  position: relative;
}
.svc-process-step::after {
  content: '';
  position: absolute;
  top: 27px;
  right: -.5rem;
  width: 1rem;
  height: 2px;
  background: var(--teal);
  opacity: .35;
}
.svc-process-step:last-child::after { display: none; }
.svc-step-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(8,160,144,.15);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto .85rem;
  font-size: 1.25rem;
  color: var(--teal);
}
.svc-step-icon img { width: 30px; height: 30px; object-fit: contain; }
.svc-process-step h5 {
  font-size: .9rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: .25rem;
}
.svc-process-step p {
  font-size: .78rem;
  color: rgba(255,255,255,.6);
  line-height: 1.5;
  margin: 0;
}

/* Key differentiators */
.svc-diff-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
}
.svc-diff-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.svc-diff-list li h6 {
  font-size: .95rem;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: .25rem;
}
.svc-diff-list li p {
  font-size: .875rem;
  color: rgba(10,14,26,.65);
  line-height: 1.6;
  margin: 0;
}

/* Industry applications */
.svc-industry-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 1.5rem;
}
.svc-industry-item {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 1rem;
  padding: 1.75rem;
  transition: border-color .25s;
}
.svc-industry-item:hover { border-color: var(--teal); }
.svc-industry-item h5 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--teal);
  margin-bottom: .5rem;
}
.svc-industry-item p {
  font-size: .875rem;
  color: rgba(255,255,255,.65);
  line-height: 1.65;
  margin: 0;
}

/* Comparison boxes (product engineering) */
.svc-compare-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}
.svc-compare-box {
  border-radius: 1rem;
  padding: 2rem;
}
.svc-compare-box.problems {
  background: rgba(233,111,84,.08);
  border: 1px solid rgba(233,111,84,.25);
}
.svc-compare-box.dna {
  background: rgba(8,160,144,.08);
  border: 1px solid rgba(8,160,144,.25);
}
.svc-compare-box h6 {
  font-size: .82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: 1rem;
}
.svc-compare-box.problems h6 { color: var(--coral); }
.svc-compare-box.dna h6 { color: var(--teal); }
.svc-compare-box ul { list-style: none; padding: 0; margin: 0; }
.svc-compare-box ul li {
  padding: .45rem 0;
  font-size: .9rem;
  color: var(--ink);
  border-bottom: 1px solid rgba(0,0,0,.06);
  display: flex;
  gap: .5rem;
  align-items: flex-start;
}
.svc-compare-box ul li:last-child { border-bottom: none; }
.svc-compare-box ul li::before {
  content: '—';
  color: var(--teal);
  flex-shrink: 0;
}
.svc-compare-box.problems ul li::before { color: var(--coral); }

/* Page-level CTA strip */
.svc-cta-inner {
  text-align: center;
  max-width: 640px;
  margin: 0 auto;
}
.svc-cta-inner h2 {
  font-size: 1.9rem;
  font-weight: 800;
  color: #fff;
  margin-bottom: .85rem;
}
.svc-cta-inner p {
  font-size: 1.05rem;
  color: rgba(255,255,255,.72);
  margin-bottom: 1.75rem;
}

/* Technology logo grid */
.svc-tech-logo-grid {
  display: grid;
  grid-template-columns: repeat(6,1fr);
  gap: 1.5rem;
  align-items: center;
}
.svc-tech-logo-item {
  background: #fff;
  border: 1px solid rgba(8,160,144,.12);
  border-radius: .75rem;
  padding: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.svc-tech-logo-item img {
  max-height: 48px;
  object-fit: contain;
  filter: grayscale(1);
  opacity: .65;
  transition: filter .25s, opacity .25s;
}
.svc-tech-logo-item:hover img { filter: none; opacity: 1; }

/* Why Choose cards */
.svc-why-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 1.5rem;
}
.svc-why-item {
  background: #fff;
  border: 1px solid rgba(8,160,144,.12);
  border-radius: 1rem;
  padding: 2rem;
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
}
.svc-why-item h4 {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--teal-dark);
  margin-bottom: .75rem;
}
.svc-why-item p {
  font-size: .9rem;
  color: rgba(10,14,26,.65);
  line-height: 1.7;
  margin: 0;
}

/* Experience Design process stages */
.svc-stage-label {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--teal);
  margin-bottom: .35rem;
}
.svc-stage-title {
  font-size: 1.6rem;
  font-weight: 800;
  margin-bottom: .85rem;
}
.svc-stage-text {
  font-size: 1rem;
  line-height: 1.8;
  opacity: .8;
  margin: 0;
}
.page-section-dark .svc-stage-title { color: #fff; }
.page-section-dark .svc-stage-text { color: rgba(255,255,255,.72); }
.page-section-light .svc-stage-title { color: var(--ink); }
.page-section-light .svc-stage-text { color: rgba(10,14,26,.7); }

/* Think/Design/Measure step pills */
.svc-tdm-steps {
  display: flex;
  gap: 1rem;
  margin-top: 2rem;
}
.svc-tdm-step {
  flex: 1;
  background: rgba(8,160,144,.09);
  border: 1px solid rgba(8,160,144,.2);
  border-radius: .85rem;
  padding: 1.25rem;
  text-align: center;
}
.svc-tdm-step h5 {
  font-size: .95rem;
  font-weight: 700;
  color: var(--teal-dark);
  margin: 0;
}

/* Responsive for service pages */
@media (max-width: 991px) {
  .svc-overview-grid { grid-template-columns: 1fr; }
  .svc-split-grid { grid-template-columns: 1fr; }
  .svc-diff-grid { grid-template-columns: 1fr; }
  .svc-compare-grid { grid-template-columns: 1fr; }
  .svc-card-grid.cols-3,
  .svc-card-grid.cols-4 { grid-template-columns: repeat(2,1fr); }
  .svc-enablers-grid { grid-template-columns: repeat(2,1fr); }
  .svc-industry-grid { grid-template-columns: 1fr 1fr; }
  .svc-tech-logo-grid { grid-template-columns: repeat(3,1fr); }
  .svc-why-grid { grid-template-columns: 1fr 1fr; }
  .svc-process-steps { flex-wrap: wrap; }
  .svc-process-step { flex: 1 1 40%; }
  .svc-process-step::after { display: none; }
}
@media (max-width: 575px) {
  .svc-card-grid.cols-3,
  .svc-card-grid.cols-2,
  .svc-card-grid.cols-4 { grid-template-columns: 1fr; }
  .svc-enablers-grid { grid-template-columns: repeat(2,1fr); }
  .svc-industry-grid { grid-template-columns: 1fr; }
  .svc-tech-logo-grid { grid-template-columns: repeat(2,1fr); }
  .svc-why-grid { grid-template-columns: 1fr; }
  .svc-tdm-steps { flex-direction: column; }
  .svc-process-step { flex: 1 1 100%; }
}

/* ══════════════════════════════════════════════════════════
   OUR PRODUCTS PAGE — complete redesign
   ══════════════════════════════════════════════════════════ */

/* ── OSS section on products page ─────────────────────── */
.prd-oss-section { background: linear-gradient(160deg,#060e1d 0%,#0a1628 60%,#071320 100%); }
.prd-oss-header { text-align: center; max-width: 620px; margin: 0 auto 56px; }
.prd-oss-header h2 { font-family: 'Plus Jakarta Sans',sans-serif; font-size: clamp(1.7rem,2.8vw,2.4rem); font-weight: 800; color: #fff; margin: 12px 0 14px; }
.prd-oss-header p { color: rgba(255,255,255,.65); font-size: .975rem; line-height: 1.78; }

.prd-oss-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }

.prd-oss-card {
  background: linear-gradient(145deg,#0f1b2d 0%,#0d1825 100%);
  border: 1px solid rgba(255,255,255,.08); border-radius: 22px;
  padding: 32px 30px; display: flex; flex-direction: column; gap: 0;
  transition: transform .3s, border-color .3s, box-shadow .3s;
}
.prd-oss-card:hover { transform: translateY(-6px); border-color: rgba(8,160,144,.4); box-shadow: 0 20px 52px rgba(8,160,144,.12); }

.prd-oss-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.prd-oss-logo-wrap { width: 56px; height: 56px; border-radius: 14px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.prd-oss-logo-wrap--dw { background: rgba(8,160,144,.12); border: 1px solid rgba(8,160,144,.2); }
.prd-oss-logo-wrap--kc { background: rgba(99,102,241,.12); border: 1px solid rgba(99,102,241,.2); }
.prd-oss-logo-img { width: 44px; height: 44px; object-fit: contain; }
.prd-oss-badge { display: inline-flex; align-items: center; gap: 6px; font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.6); background: rgba(8,160,144,.12); border: 1px solid rgba(8,160,144,.22); border-radius: 20px; padding: 4px 12px; }
.prd-oss-badge .fa { color: var(--teal); }

.prd-oss-card h3 { font-family: 'Plus Jakarta Sans',sans-serif; font-size: 1.3rem; font-weight: 800; color: #fff; margin: 0 0 10px; }
.prd-oss-desc { font-size: .92rem; color: rgba(255,255,255,.55); line-height: 1.78; margin-bottom: 22px; }

.prd-oss-list { list-style: none; padding: 0; margin: 0 0 28px; display: flex; flex-direction: column; gap: 10px; }
.prd-oss-list li { display: flex; gap: 10px; font-size: .88rem; color: rgba(255,255,255,.65); line-height: 1.6; }
.prd-oss-list li .fa-check-circle { color: var(--teal); font-size: .9rem; flex-shrink: 0; margin-top: 2px; }

.prd-oss-footer { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-top: auto; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.07); }
.prd-oss-footer span strong { display: block; font-size: .7rem; font-weight: 700; color: #6b7280; text-transform: uppercase; letter-spacing: .07em; }
.prd-oss-footer span small { font-size: .85rem; color: rgba(255,255,255,.55); font-weight: 500; }
.prd-oss-link {
  display: inline-flex; align-items: center; gap: 7px; white-space: nowrap;
  font-size: .85rem; font-weight: 700; color: var(--teal); text-decoration: none;
  transition: gap .2s, color .2s;
}
.prd-oss-link:hover { gap: 11px; color: #2dd4bf; text-decoration: none; }

/* ── Solution Accelerator cards ───────────────────────── */
.prd-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }

.prd-card {
  border-radius: 22px; overflow: hidden;
  background: #fff; border: 1px solid #e5e7eb;
  box-shadow: 0 4px 20px rgba(0,0,0,.05);
  display: flex; flex-direction: column;
  transition: transform .35s, box-shadow .35s, border-color .35s;
}
.prd-card:hover { transform: translateY(-8px); box-shadow: 0 24px 56px rgba(0,0,0,.12); border-color: rgba(8,160,144,.2); }

/* ── Animated icon area ───────────────────────────────── */
.prd-anim {
  position: relative; height: 260px;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; flex-shrink: 0;
}

/* glow blob behind main icon */
.prd-anim-glow {
  position: absolute; width: 140px; height: 140px; border-radius: 50%;
  filter: blur(50px); opacity: .45; pointer-events: none;
}

/* main central icon */
.prd-anim-center {
  position: relative; z-index: 2;
  width: 80px; height: 80px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.15); backdrop-filter: blur(8px);
  border: 2px solid rgba(255,255,255,.25);
  animation: prd-breathe 3.5s ease-in-out infinite;
}
.prd-anim-center .fa { font-size: 2.2rem; color: #fff; }

@keyframes prd-breathe {
  0%,100% { transform: scale(1); }
  50% { transform: scale(1.07); }
}

/* Rings */
.prd-ring {
  position: absolute; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.15);
  animation: prd-ring-expand 4s ease-out infinite;
}
.prd-ring { width: 140px; height: 140px; animation-delay: 0s; }
.prd-ring--2 { width: 210px; height: 210px; animation-delay: 1.5s; }
@keyframes prd-ring-expand {
  0% { opacity: .5; transform: scale(.8); }
  100% { opacity: 0; transform: scale(1.3); }
}

/* ───── EDUCATION (teal) ───── */
.prd-anim--education { background: linear-gradient(135deg,#0a9e94 0%,#0b7a6e 100%); }
.prd-anim--education .prd-anim-glow { background: #2dd4bf; }

/* Orbiting particles */
.prd-orb {
  position: absolute; width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.18); backdrop-filter: blur(4px);
  border: 1px solid rgba(255,255,255,.3);
  z-index: 3;
}
.prd-orb .fa { font-size: .85rem; color: #fff; }

.prd-orb--1 { animation: prd-orbit-1 6s linear infinite; }
.prd-orb--2 { animation: prd-orbit-2 8s linear infinite; }
.prd-orb--3 { animation: prd-orbit-3 7s linear infinite reverse; }
.prd-orb--4 { animation: prd-orbit-4 9s linear infinite; }

@keyframes prd-orbit-1 {
  from { transform: rotate(0deg) translateX(90px) rotate(0deg); }
  to   { transform: rotate(360deg) translateX(90px) rotate(-360deg); }
}
@keyframes prd-orbit-2 {
  from { transform: rotate(90deg) translateX(75px) rotate(-90deg); }
  to   { transform: rotate(450deg) translateX(75px) rotate(-450deg); }
}
@keyframes prd-orbit-3 {
  from { transform: rotate(180deg) translateX(85px) rotate(-180deg); }
  to   { transform: rotate(-180deg) translateX(85px) rotate(180deg); }
}
@keyframes prd-orbit-4 {
  from { transform: rotate(270deg) translateX(70px) rotate(-270deg); }
  to   { transform: rotate(630deg) translateX(70px) rotate(-630deg); }
}

/* ───── HRMS (indigo) ───── */
.prd-anim--hrms { background: linear-gradient(135deg,#4338ca 0%,#312e81 100%); }
.prd-anim--hrms .prd-anim-glow { background: #818cf8; }

.prd-person {
  position: absolute; z-index: 3;
  width: 38px; height: 38px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.18); border: 1.5px solid rgba(255,255,255,.35);
}
.prd-person .fa { font-size: 1.3rem; color: rgba(255,255,255,.9); }
.prd-person--1 { top: 30px; left: 50%; transform: translateX(-50%); animation: prd-node-pulse 2.5s ease-in-out infinite; }
.prd-person--2 { bottom: 40px; left: 22%; animation: prd-node-pulse 2.5s ease-in-out infinite .5s; }
.prd-person--3 { bottom: 40px; right: 22%; animation: prd-node-pulse 2.5s ease-in-out infinite 1s; }
.prd-person--4 { top: 50%; left: 12%; transform: translateY(-50%); animation: prd-node-pulse 2.5s ease-in-out infinite 1.5s; }

@keyframes prd-node-pulse {
  0%,100% { transform: scale(1) translateX(var(--tx,0)) translateY(var(--ty,0)); opacity: .8; }
  50% { transform: scale(1.15) translateX(var(--tx,0)) translateY(var(--ty,0)); opacity: 1; }
}

.prd-connect { position: absolute; background: rgba(255,255,255,.18); border-radius: 2px; z-index: 1; }
.prd-connect--h { width: 55%; height: 1.5px; top: 52%; left: 22%; animation: prd-connect-flash 2s ease-in-out infinite; }
.prd-connect--v { width: 1.5px; height: 35%; top: 30%; left: 50%; transform: translateX(-50%); animation: prd-connect-flash 2s ease-in-out infinite .6s; }
@keyframes prd-connect-flash { 0%,100%{opacity:.2}50%{opacity:.7} }

.prd-dot {
  position: absolute; width: 8px; height: 8px; border-radius: 50%;
  background: rgba(255,255,255,.8); z-index: 4;
}
.prd-dot--1 { animation: prd-dot-travel-h 2.5s linear infinite; top: calc(52% - 4px); left: 22%; }
.prd-dot--2 { animation: prd-dot-travel-v 2.5s linear infinite 1.2s; top: 30%; left: calc(50% - 4px); }
@keyframes prd-dot-travel-h { 0%{left:22%;opacity:1}100%{left:72%;opacity:0} }
@keyframes prd-dot-travel-v { 0%{top:30%;opacity:1}100%{top:65%;opacity:0} }

/* ───── FINANCE (green) ───── */
.prd-anim--finance { background: linear-gradient(135deg,#059669 0%,#065f46 100%); }
.prd-anim--finance .prd-anim-glow { background: #34d399; }

.prd-bar {
  position: absolute; bottom: 28px; border-radius: 4px 4px 0 0;
  background: rgba(255,255,255,.25); width: 24px; z-index: 2;
  transform-origin: bottom center; transform: scaleY(0);
}
.prd-bar--1 { left: 18%; height: 70px; animation: prd-bar-grow 2.5s ease-out infinite; animation-delay: .1s; }
.prd-bar--2 { left: 31%; height: 110px; animation: prd-bar-grow 2.5s ease-out infinite; animation-delay: .35s; }
.prd-bar--3 { right: 31%; height: 80px; animation: prd-bar-grow 2.5s ease-out infinite; animation-delay: .6s; }
.prd-bar--4 { right: 18%; height: 140px; animation: prd-bar-grow 2.5s ease-out infinite; animation-delay: .85s; }
@keyframes prd-bar-grow {
  0%,10% { transform: scaleY(0); opacity: 0; }
  40%,80% { transform: scaleY(1); opacity: 1; }
  100% { transform: scaleY(0); opacity: 0; }
}

.prd-coin {
  position: absolute; z-index: 3; width: 28px; height: 28px; border-radius: 50%;
  background: rgba(255,255,255,.2); border: 1.5px solid rgba(255,255,255,.4);
  display: flex; align-items: center; justify-content: center;
}
.prd-coin .fa { font-size: .7rem; color: rgba(255,255,255,.8); }
.prd-coin--1 { top: 38px; right: 28%; animation: prd-coin-float 3s ease-in-out infinite; }
.prd-coin--2 { top: 55px; left: 24%; animation: prd-coin-float 3.5s ease-in-out infinite .8s; }
@keyframes prd-coin-float {
  0%,100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-14px) rotate(180deg); }
}

.prd-trend-line {
  position: absolute; bottom: 110px; left: 16%; right: 16%; height: 2px; z-index: 2;
  background: linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.5),rgba(255,255,255,0));
  animation: prd-trend-sweep 2.5s ease-in-out infinite;
}
@keyframes prd-trend-sweep {
  0%,100% { opacity: 0; transform: scaleX(0) translateX(-50%); }
  50% { opacity: 1; transform: scaleX(1) translateX(0); }
}

/* ───── HEALTHCARE (rose) ───── */
.prd-anim--healthcare { background: linear-gradient(135deg,#be123c 0%,#9f1239 100%); }
.prd-anim--healthcare .prd-anim-glow { background: #fb7185; }

.prd-pulse-ring {
  position: absolute; border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.3);
  pointer-events: none;
}
.prd-pulse-ring--1 { width: 100px; height: 100px; animation: prd-pulse-out 2.4s ease-out infinite; }
.prd-pulse-ring--2 { width: 100px; height: 100px; animation: prd-pulse-out 2.4s ease-out infinite .8s; }
.prd-pulse-ring--3 { width: 100px; height: 100px; animation: prd-pulse-out 2.4s ease-out infinite 1.6s; }
@keyframes prd-pulse-out {
  0%  { transform: scale(.8); opacity: .7; }
  100% { transform: scale(2.4); opacity: 0; }
}

.prd-ecg-line {
  position: absolute; bottom: 28px; left: 0; right: 0; z-index: 3;
  height: 60px; pointer-events: none;
}
.prd-ecg-line svg { width: 100%; height: 100%; }
.prd-ecg-path {
  stroke: rgba(255,255,255,.55); stroke-width: 2; fill: none;
  stroke-dasharray: 400; stroke-dashoffset: 400;
  animation: prd-ecg-draw 2.2s linear infinite;
}
@keyframes prd-ecg-draw {
  0%   { stroke-dashoffset: 400; opacity: 1; }
  80%  { stroke-dashoffset: 0;   opacity: 1; }
  100% { stroke-dashoffset: 0;   opacity: 0; }
}

.prd-cross {
  position: absolute; top: 22px; right: 28px; z-index: 4;
  width: 32px; height: 32px; border-radius: 8px;
  background: rgba(255,255,255,.18); display: flex; align-items: center; justify-content: center;
  animation: prd-cross-pulse 2s ease-in-out infinite;
}
.prd-cross .fa { font-size: 1rem; color: rgba(255,255,255,.9); }
@keyframes prd-cross-pulse { 0%,100%{transform:scale(1)}50%{transform:scale(1.2)} }

/* ── Card body ─────────────────────────────────────────── */
.prd-card-body { padding: 28px 28px 32px; display: flex; flex-direction: column; flex: 1; }

.prd-eyebrow {
  display: inline-block; font-size: .7rem; font-weight: 700; letter-spacing: .09em;
  text-transform: uppercase; padding: 4px 12px; border-radius: 20px; margin-bottom: 14px;
}
.prd-eyebrow--education { background: rgba(8,160,144,.1); color: #0a9e94; border: 1px solid rgba(8,160,144,.2); }
.prd-eyebrow--hrms      { background: rgba(67,56,202,.1); color: #4338ca; border: 1px solid rgba(67,56,202,.2); }
.prd-eyebrow--finance   { background: rgba(5,150,105,.1); color: #059669; border: 1px solid rgba(5,150,105,.2); }
.prd-eyebrow--healthcare{ background: rgba(190,18,60,.1);  color: #be123c; border: 1px solid rgba(190,18,60,.2); }

.prd-card-body h3 { font-family: 'Plus Jakarta Sans',sans-serif; font-size: 1.35rem; font-weight: 800; color: #0a0e1a; margin: 0 0 12px; }
.prd-card-body > p { font-size: .92rem; color: #4b5563; line-height: 1.8; margin-bottom: 20px; }

.prd-benefits { list-style: none; padding: 0; margin: 0 0 24px; display: flex; flex-direction: column; gap: 9px; }
.prd-benefits li { display: flex; gap: 9px; font-size: .875rem; color: #374151; line-height: 1.55; }
.prd-benefits li .fa-check-circle { font-size: .9rem; flex-shrink: 0; margin-top: 1px; }
.prd-eyebrow--education ~ * .prd-benefits li .fa-check-circle,
.prd-benefits li .fa-check-circle { color: #0a9e94; }

.prd-cta {
  display: inline-flex; align-items: center; gap: 8px; margin-top: auto;
  font-size: .88rem; font-weight: 700; text-decoration: none; padding: 11px 22px;
  border-radius: 10px; transition: transform .2s, box-shadow .2s, gap .2s;
  align-self: flex-start;
}
.prd-cta:hover { transform: translateY(-2px); text-decoration: none; gap: 12px; }

.prd-cta--education { background: linear-gradient(135deg,#0a9e94,#18a860); color: #fff; box-shadow: 0 4px 16px rgba(8,160,144,.3); }
.prd-cta--hrms      { background: linear-gradient(135deg,#4338ca,#6366f1); color: #fff; box-shadow: 0 4px 16px rgba(67,56,202,.3); }
.prd-cta--finance   { background: linear-gradient(135deg,#059669,#047857); color: #fff; box-shadow: 0 4px 16px rgba(5,150,105,.3); }
.prd-cta--healthcare{ background: linear-gradient(135deg,#be123c,#9f1239); color: #fff; box-shadow: 0 4px 16px rgba(190,18,60,.3); }

.prd-cta--education:hover { box-shadow: 0 8px 28px rgba(8,160,144,.45); }
.prd-cta--hrms:hover      { box-shadow: 0 8px 28px rgba(67,56,202,.45); }
.prd-cta--finance:hover   { box-shadow: 0 8px 28px rgba(5,150,105,.45); }
.prd-cta--healthcare:hover{ box-shadow: 0 8px 28px rgba(190,18,60,.45); }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 900px) {
  .prd-oss-grid { grid-template-columns: 1fr; }
  .prd-grid { grid-template-columns: 1fr; }
}
@media (max-width: 575px) {
  .prd-anim { height: 200px; }
  .prd-card-body { padding: 22px 20px 26px; }
}

/* ── Technologies — responsive ─────────────────────────── */
@media (max-width: 1100px) {
  .tech-ai-cards { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 900px) {
  .tech-intro-row { grid-template-columns: 1fr; gap: 36px; }
  .tech-cat-block { grid-template-columns: 1fr; gap: 36px; }
  .tech-cat-block--alt .tech-cat-info { order: 0; }
  .tech-cat-block--alt .tech-cat-badges { order: 0; }
  .tech-ai-cards { grid-template-columns: 1fr 1fr; }
  .tech-ai-intro-band { padding: 20px 24px; }
  .tech-ai-stat { padding: 0 20px; }
  .tech-ai-cta-row { flex-direction: column; align-items: flex-start; gap: 24px; }
}
@media (max-width: 650px) {
  .tech-kpi-row { grid-template-columns: repeat(2,1fr); }
  .tech-ai-cards { grid-template-columns: 1fr; }
  .tech-ai-intro-band { flex-wrap: wrap; gap: 16px; }
  .tech-ai-stat-div { display: none; }
  .tech-ai-stat { padding: 0 16px; }
  .tech-cat-nav-section { position: relative; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   HOMEPAGE AI SECTION
═══════════════════════════════════════════════════════════════════════════ */
.hp-ai-section {
  position: relative;
  background: #080d14;
  overflow: hidden;
  padding: 100px 0;
}

/* ── Background layers ── */
.hp-ai-bg { position: absolute; inset: 0; pointer-events: none; }
.hp-ai-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.22;
}
.hp-ai-orb--a {
  width: 640px; height: 640px;
  background: radial-gradient(circle, #08a090, transparent 70%);
  top: -140px; left: -80px;
}
.hp-ai-orb--b {
  width: 520px; height: 520px;
  background: radial-gradient(circle, #6c3bc7, transparent 70%);
  bottom: -100px; right: -80px;
}
.hp-ai-hex-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(8,160,144,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8,160,144,.06) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: radial-gradient(ellipse 90% 90% at 50% 50%, black 30%, transparent 100%);
}

/* ── Inner grid ── */
.hp-ai-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: center;
  position: relative;
  z-index: 2;
}

/* ══ Neural orbital visual ═════════════════════════════════════════════════ */
.hp-ai-visual {
  display: flex;
  justify-content: center;
  align-items: center;
}
.hp-ai-neural {
  position: relative;
  width: 400px;
  height: 400px;
}

/* Rings */
.hp-ai-ring {
  position: absolute;
  border-radius: 50%;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
}
.hp-ai-ring--1 {
  width: 124px; height: 124px;
  border: 1px dashed rgba(8,160,144,.45);
  animation: hp-ring-spin 8s linear infinite;
}
.hp-ai-ring--2 {
  width: 232px; height: 232px;
  border: 1px dashed rgba(108,59,199,.32);
  animation: hp-ring-spin 15s linear infinite reverse;
}
.hp-ai-ring--3 {
  width: 348px; height: 348px;
  border: 1px dotted rgba(8,160,144,.18);
  animation: hp-ring-spin 22s linear infinite;
}
@keyframes hp-ring-spin { to { transform: translate(-50%,-50%) rotate(360deg); } }

/* Center node */
.hp-ai-node--c {
  position: absolute;
  width: 52px; height: 52px;
  border-radius: 50%;
  background: linear-gradient(135deg, #08a090, #10b981);
  top: 50%; left: 50%;
  margin: -26px 0 0 -26px;
  box-shadow: 0 0 0 10px rgba(8,160,144,.15), 0 0 0 22px rgba(8,160,144,.08), 0 0 50px rgba(8,160,144,.55);
  animation: hp-center-pulse 2.8s ease-in-out infinite;
  display: flex; align-items: center; justify-content: center;
}
.hp-ai-node--c::after {
  content: '0e7';
  font-family: 'FontAwesome';
  color: #fff;
  font-size: 20px;
}
@keyframes hp-center-pulse {
  0%,100% { box-shadow: 0 0 0 10px rgba(8,160,144,.15), 0 0 0 22px rgba(8,160,144,.08), 0 0 50px rgba(8,160,144,.55); }
  50%      { box-shadow: 0 0 0 18px rgba(8,160,144,.22), 0 0 0 36px rgba(8,160,144,.10), 0 0 70px rgba(8,160,144,.75); }
}

/* Orbiting nodes */
.hp-ai-node {
  position: absolute;
  border-radius: 50%;
  top: 50%; left: 50%;
}
.hp-ai-node--1 {
  width: 14px; height: 14px; margin: -7px 0 0 -7px;
  background: #08a090;
  box-shadow: 0 0 14px rgba(8,160,144,.9);
  animation: hp-orbit-r1 8s linear infinite;
}
.hp-ai-node--2 {
  width: 10px; height: 10px; margin: -5px 0 0 -5px;
  background: #6c3bc7;
  box-shadow: 0 0 12px rgba(108,59,199,.9);
  animation: hp-orbit-r1 8s linear infinite reverse;
  animation-delay: -4s;
}
.hp-ai-node--3 {
  width: 16px; height: 16px; margin: -8px 0 0 -8px;
  background: #22d3ee;
  box-shadow: 0 0 16px rgba(34,211,238,.85);
  animation: hp-orbit-r2 15s linear infinite;
}
.hp-ai-node--4 {
  width: 12px; height: 12px; margin: -6px 0 0 -6px;
  background: #f59e0b;
  box-shadow: 0 0 12px rgba(245,158,11,.85);
  animation: hp-orbit-r2 15s linear infinite reverse;
  animation-delay: -7.5s;
}
.hp-ai-node--5 {
  width: 10px; height: 10px; margin: -5px 0 0 -5px;
  background: #10b981;
  box-shadow: 0 0 12px rgba(16,185,129,.85);
  animation: hp-orbit-r3 22s linear infinite;
}
.hp-ai-node--6 {
  width: 14px; height: 14px; margin: -7px 0 0 -7px;
  background: #8b5cf6;
  box-shadow: 0 0 14px rgba(139,92,246,.85);
  animation: hp-orbit-r3 22s linear infinite reverse;
  animation-delay: -11s;
}
@keyframes hp-orbit-r1 {
  from { transform: translate(-50%,-50%) rotate(0deg)   translateX(62px)  rotate(0deg); }
  to   { transform: translate(-50%,-50%) rotate(360deg) translateX(62px)  rotate(-360deg); }
}
@keyframes hp-orbit-r2 {
  from { transform: translate(-50%,-50%) rotate(0deg)   translateX(116px) rotate(0deg); }
  to   { transform: translate(-50%,-50%) rotate(360deg) translateX(116px) rotate(-360deg); }
}
@keyframes hp-orbit-r3 {
  from { transform: translate(-50%,-50%) rotate(0deg)   translateX(174px) rotate(0deg); }
  to   { transform: translate(-50%,-50%) rotate(360deg) translateX(174px) rotate(-360deg); }
}

/* Floating labels */
.hp-ai-v-label {
  position: absolute;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,.7);
  background: rgba(8,160,144,.18);
  border: 1px solid rgba(8,160,144,.35);
  border-radius: 5px;
  padding: 3px 8px;
  animation: hp-label-float 4s ease-in-out infinite;
}
.hp-ai-v-label--1 { top: 19%; left: 56%; animation-delay: 0s; }
.hp-ai-v-label--2 { top: 72%; left: 57%; animation-delay: 1s; }
.hp-ai-v-label--3 { top: 16%; left: 24%; animation-delay: 2s; }
.hp-ai-v-label--4 { top: 74%; left: 18%; animation-delay: 3s; }
@keyframes hp-label-float {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-6px); }
}

/* ══ Content side ════════════════════════════════════════════════════════════ */
.hp-ai-content { padding: 12px 0; }

.hp-ai-eyebrow {
  color: #08a090;
  border-color: rgba(8,160,144,.28);
  background: rgba(8,160,144,.1);
}
.hp-ai-content h2 {
  font-size: clamp(1.9rem, 3.2vw, 2.75rem);
  color: #fff;
  line-height: 1.22;
  margin: 18px 0 20px;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 800;
}
.hp-ai-accent {
  background: linear-gradient(90deg, #08a090, #22d3ee);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.hp-ai-content > p {
  color: rgba(255,255,255,.62);
  font-size: 1.05rem;
  line-height: 1.72;
  margin-bottom: 32px;
  max-width: 500px;
}

/* Feature list */
.hp-ai-features {
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin-bottom: 36px;
}
.hp-ai-feat {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.hp-ai-feat-icon {
  flex-shrink: 0;
  width: 42px; height: 42px;
  border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
  font-size: 17px;
  color: #fff;
  transition: transform .25s;
}
.hp-ai-feat:hover .hp-ai-feat-icon { transform: scale(1.12); }
.hp-ai-feat--teal   { background: rgba(8,160,144,.18);  border: 1px solid rgba(8,160,144,.35); }
.hp-ai-feat--violet { background: rgba(108,59,199,.18); border: 1px solid rgba(108,59,199,.35); }
.hp-ai-feat--green  { background: rgba(16,185,129,.18); border: 1px solid rgba(16,185,129,.35); }
.hp-ai-feat--amber  { background: rgba(245,158,11,.18); border: 1px solid rgba(245,158,11,.35); }
.hp-ai-feat > div:last-child { display: flex; flex-direction: column; gap: 3px; }
.hp-ai-feat strong { color: #fff; font-size: .95rem; font-weight: 700; }
.hp-ai-feat span   { color: rgba(255,255,255,.5); font-size: .85rem; line-height: 1.5; }

/* CTA row */
.hp-ai-cta-row { display: flex; gap: 14px; flex-wrap: wrap; }
.hp-ai-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, #08a090, #10b981);
  color: #fff;
  font-weight: 700;
  font-size: .9rem;
  padding: 12px 26px;
  border-radius: 50px;
  text-decoration: none;
  transition: transform .2s, box-shadow .2s;
  box-shadow: 0 4px 22px rgba(8,160,144,.42);
}
.hp-ai-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 30px rgba(8,160,144,.55); color: #fff; }
.hp-ai-btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,.7);
  font-weight: 600;
  font-size: .9rem;
  padding: 12px 24px;
  border-radius: 50px;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,.18);
  transition: all .2s;
}
.hp-ai-btn-ghost:hover { color: #fff; border-color: rgba(255,255,255,.4); background: rgba(255,255,255,.06); }

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 960px) {
  .hp-ai-inner { grid-template-columns: 1fr; gap: 56px; }
  .hp-ai-visual { justify-content: center; }
  .hp-ai-neural { width: 320px; height: 320px; }
  .hp-ai-ring--3 { width: 280px; height: 280px; }
}
@media (max-width: 600px) {
  .hp-ai-section { padding: 72px 0; }
  .hp-ai-visual { display: none; }
  .hp-ai-cta-row { flex-direction: column; align-items: flex-start; }
  .hp-ai-content h2 { font-size: 1.75rem; }
}
/* ═══════════════════════════════════════════════════════════════════════════ */


/* ═══════════════════════════════════════════════════════════════════════════
   GLOBAL INNER-PAGE RESPONSIVE ENHANCEMENTS — 320px → 1920px
   Covers: About, Services, Technologies, Careers, Contact, Products
═══════════════════════════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────────
   TABLET WIDE (768px – 1100px) — intermediate fixes
────────────────────────────────────────────────────────── */
@media (max-width: 1100px) and (min-width: 768px) {
  /* About page */
  .about-intro-grid    { grid-template-columns: 1fr; gap: 40px; }
  .about-intro-panel   { position: static; }

  /* Contact page */
  .contact-workspace   { grid-template-columns: 1fr; gap: 40px; }

  /* Technologies */
  .tech-kpi-row        { grid-template-columns: repeat(2, 1fr); gap: 24px; }
}

/* ──────────────────────────────────────────────────────────
   TABLET (up to 767px) — all inner pages
────────────────────────────────────────────────────────── */
@media (max-width: 767px) {

  /* ── Page hero & sections ── */
  .page-hero          { padding: 80px 0 48px; min-height: unset; }
  .page-hero h1       { font-size: clamp(1.8rem, 6vw, 2.6rem); }
  .page-section       { padding: 56px 0; }
  .section-label      { font-size: .72rem; }

  /* ── About page ── */
  .about-intro-grid   { grid-template-columns: 1fr; gap: 32px; }
  .about-intro-panel  { position: static; }
  .about-hero-stats   { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .ahs-item           { padding: 16px 12px; }
  .ahs-number         { font-size: 1.9rem; }
  .culture-grid       { grid-template-columns: 1fr 1fr; }
  .values-grid        { grid-template-columns: 1fr 1fr; }

  /* ── Services index ── */
  .svcs-hero-stats    { flex-direction: column; gap: 16px; }
  .svcs-hs-item       { border-right: none; border-bottom: 1px solid rgba(255,255,255,.12); padding: 12px 0; }
  .svcs-hs-item:last-child { border-bottom: none; }
  .svcs-cta-band      { padding: 40px 20px; }
  .svcs-cta-inner     { flex-direction: column; align-items: flex-start; gap: 20px; }

  /* ── Service detail pages ── */
  .svc-split-grid     { grid-template-columns: 1fr; gap: 28px; }
  .svc-diff-grid      { grid-template-columns: 1fr; }
  .svc-compare-grid   { grid-template-columns: 1fr; }
  .svc-enablers-grid  { grid-template-columns: repeat(2, 1fr); }
  .svc-industry-grid  { grid-template-columns: 1fr; }
  .svc-card-grid.cols-3,
  .svc-card-grid.cols-4 { grid-template-columns: repeat(2, 1fr); }
  .svc-why-grid       { grid-template-columns: 1fr; }
  .svc-tech-logo-grid { grid-template-columns: repeat(3, 1fr); }

  /* ── Technologies page ── */
  .tech-cat-block           { grid-template-columns: 1fr; gap: 28px; }
  .tech-cat-block--alt .tech-cat-info   { order: 0; }
  .tech-cat-block--alt .tech-cat-badges { order: 0; }
  .tech-intro-row           { grid-template-columns: 1fr; gap: 28px; }
  .tech-kpi-row             { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .tech-ai-cards            { grid-template-columns: repeat(2, 1fr); }
  .tech-ai-cta-row          { flex-direction: column; align-items: flex-start; gap: 16px; }
  .tech-ai-intro-band       { flex-wrap: wrap; gap: 16px; padding: 16px 20px; }
  .tech-ai-stat-div         { display: none; }
  .tech-ai-stat             { padding: 0 16px; }
  .tech-cat-nav             { overflow-x: auto; -webkit-overflow-scrolling: touch; gap: 8px; }
  .tech-cat-nav button      { white-space: nowrap; flex-shrink: 0; }

  /* ── Careers page ── */
  .careers-values-grid  { grid-template-columns: 1fr 1fr; }
  .careers-perks-grid   { grid-template-columns: 1fr 1fr; }
  .careers-skills-grid  { grid-template-columns: 1fr 1fr; }
  .jd-meta              { flex-wrap: wrap; gap: 8px; }

  /* ── Contact page ── */
  .contact-workspace    { grid-template-columns: 1fr; gap: 32px; }
  .contact-info-panel   { padding: 28px 24px; }
  .contact-form-panel   { padding: 28px 24px; }
  .contact-form-grid    { grid-template-columns: 1fr; }
  .contact-map-wrap     { height: 260px; }

  /* ── Products page ── */
  .prd-oss-grid         { grid-template-columns: 1fr; }
  .prd-grid             { grid-template-columns: 1fr; }
  .prd-anim             { height: 220px; }

  /* ── HP AI section ── */
  .hp-ai-inner          { grid-template-columns: 1fr; gap: 40px; }
  .hp-ai-visual         { display: none; }
  .hp-ai-cta-row        { flex-direction: column; align-items: flex-start; gap: 12px; }
  .hp-ai-btn,
  .hp-ai-btn-ghost      { width: 100%; justify-content: center; }
}

/* ──────────────────────────────────────────────────────────
   MOBILE (up to 575px)
────────────────────────────────────────────────────────── */
@media (max-width: 575px) {

  /* ── Page hero ── */
  .page-hero          { padding: 72px 0 40px; }
  .page-hero h1       { font-size: clamp(1.6rem, 7vw, 2.1rem); }
  .page-hero p        { font-size: .95rem; }

  /* ── About page ── */
  .about-hero-stats   { grid-template-columns: 1fr; }
  .culture-grid       { grid-template-columns: 1fr; }
  .values-grid        { grid-template-columns: 1fr; }
  .timeline-item      { padding-left: 20px; }
  .timeline-dot       { width: 12px; height: 12px; left: -6px; }

  /* ── Services ── */
  .svc-card-grid.cols-2 { grid-template-columns: 1fr; }
  .svc-enablers-grid  { grid-template-columns: 1fr; }
  .svc-tech-logo-grid { grid-template-columns: repeat(2, 1fr); }
  .svc-process-steps  { flex-direction: column; gap: 20px; }
  .svc-process-step   { flex: 1 1 100%; text-align: left; display: flex; gap: 14px; align-items: flex-start; }
  .svc-step-icon      { margin: 0; flex-shrink: 0; }
  .svc-tdm-steps      { flex-direction: column; }

  /* ── Technologies ── */
  .tech-kpi-row       { grid-template-columns: 1fr; }
  .tech-ai-cards      { grid-template-columns: 1fr; }

  /* ── Careers ── */
  .careers-values-grid  { grid-template-columns: 1fr; }
  .careers-perks-grid   { grid-template-columns: 1fr; }
  .careers-skills-grid  { grid-template-columns: 1fr; }

  /* ── Contact ── */
  .contact-info-panel   { padding: 22px 18px; }
  .contact-form-panel   { padding: 22px 18px; }
  .contact-map-wrap     { height: 220px; border-radius: .75rem; }

  /* ── Products ── */
  .prd-anim           { height: 190px; }
  .prd-card-body      { padding: 20px 18px 24px; }
  .prd-oss-card       { padding: 24px 20px; }
  .prd-oss-footer     { flex-direction: column; gap: 14px; }

  /* ── HP AI ── */
  .hp-ai-section      { padding: 64px 0; }
  .hp-ai-content h2   { font-size: 1.6rem; }
}

/* ──────────────────────────────────────────────────────────
   NARROW MOBILE (up to 400px)
────────────────────────────────────────────────────────── */
@media (max-width: 400px) {

  /* Page heroes */
  .page-hero h1       { font-size: 1.5rem; }
  .page-hero p        { font-size: .88rem; }

  /* About */
  .ahs-number         { font-size: 1.75rem; }

  /* Services process strip */
  .svcs-process-strip-item { padding: 12px; }

  /* Technologies */
  .tech-cat-badge     { font-size: .7rem; padding: 4px 10px; }
  .tech-ai-intro-band { padding: 14px; }

  /* Contact */
  .contact-info-panel  { padding: 18px 14px; }
  .contact-form-panel  { padding: 18px 14px; }

  /* Products */
  .prd-anim           { height: 170px; }
  .prd-card-body      { padding: 16px 14px 20px; }
}

/* ──────────────────────────────────────────────────────────
   VERY NARROW (up to 360px) — Samsung Galaxy S8, etc.
────────────────────────────────────────────────────────── */
@media (max-width: 360px) {

  /* Typography scale-down */
  .page-hero h1       { font-size: 1.4rem; }
  .svcs-feature-card h4 { font-size: .9rem; }

  /* Tech nav — allow horizontal scroll */
  .tech-cat-nav       { padding-bottom: 6px; }

  /* Hide decorative large shapes */
  .prd-anim-glow      { display: none; }
  .prd-ring--2        { display: none; }

  /* Products */
  .prd-anim           { height: 160px; }
  .prd-oss-card       { padding: 20px 16px; }

  /* HP AI */
  .hp-ai-section      { padding: 56px 0; }
  .hp-ai-content h2   { font-size: 1.45rem; }
  .hp-ai-btn,
  .hp-ai-btn-ghost    { font-size: .82rem; padding: 10px 18px; }
}

/* ──────────────────────────────────────────────────────────
   LARGE DESKTOP (1400px+) — open up grids
────────────────────────────────────────────────────────── */
@media (min-width: 1400px) {
  .page-section { padding: 100px 0; }
  .page-hero    { padding: 120px 0 80px; }
  .prd-grid     { grid-template-columns: repeat(2, 1fr); gap: 36px; }
  .prd-oss-grid { grid-template-columns: repeat(2, 1fr); gap: 36px; }
}

/* ──────────────────────────────────────────────────────────
   TOUCH TARGETS — accessible tap areas on all interactive elements
────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .tech-cat-nav button  { min-height: 44px; padding: 10px 18px; }
  .prd-cta              { min-height: 44px; padding: 12px 22px; }
  .hp-ai-btn            { min-height: 44px; }
  .hp-ai-btn-ghost      { min-height: 44px; }
  .svc-cta-inner a      { min-height: 44px; }
  .careers-apply-btn    { min-height: 44px; }
  .contact-submit-btn   { min-height: 44px; }
  .svcs-cta-inner a     { min-height: 44px; }
}

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