:root{
  --green:#39b54a;
  --blue:#2f9ae6;
  --bg:#0c1020;
  --panel:rgba(255,255,255,.06);
  --stroke:rgba(255,255,255,.12);
  --muted:#a8b2d1;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,Segoe UI,Arial,sans-serif;
  color:#eef3ff;
  background:
    radial-gradient(1000px 500px at 85% -10%, rgba(47,154,230,.20), transparent 70%),
    radial-gradient(800px 420px at -10% 50%, rgba(57,181,74,.18), transparent 70%),
    var(--bg);
}

/* helpers & spacing */
.fw-800{font-weight:800}
.section{padding:96px 0}
.section-alt{padding:96px 0; background:rgba(255,255,255,.02)}
.section-divider{position:relative}
.section-divider::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background: linear-gradient(90deg, rgba(255,255,255,.0), rgba(255,255,255,.12), rgba(255,255,255,.0));
}
.section-title{font-weight:800; letter-spacing:.2px; margin-bottom:18px}
.text-secondary{color:var(--muted)!important}
.link-muted{color:#bfc9e6;text-decoration:none}
.link-muted:hover{color:#fff}

/* Navbar */
.nav-glass{
  background: linear-gradient( to bottom, rgba(12,16,32,.9), rgba(12,16,32,.65) );
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--stroke);
}
.navbar .nav-link{color:#d7e3ff}
.navbar .nav-link:hover{color:#fff}

/* Buttons */
.btn-pill{border-radius:999px;padding:.65rem 1.25rem}
.btn-gradient{
  background: linear-gradient(90deg, var(--green), var(--blue));
  border:0; color:#fff;
  box-shadow: 0 10px 24px rgba(47,154,230,.25);
}
.btn-gradient:hover{filter:brightness(1.05)}

/* HERO */
.hero{margin-top:18px}
.hero-inner{background:#0e1428}
.hero-bg{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:.15; filter:saturate(120%) contrast(105%);
}
.hero-gradient{
  position:absolute; inset:0;
  background: radial-gradient(600px 360px at 20% 10%, rgba(57,181,74,.55), transparent 65%),
              radial-gradient(600px 360px at 80% 30%, rgba(47,154,230,.55), transparent 65%);
  mix-blend-mode:screen; pointer-events:none;
}
.hero-image-wrap{position:relative; height:70%; min-height:320px; display:flex; align-items:center; justify-content:center}
.hero-image{width:70%; height:70%; object-fit:cover;}

/* “Glass” blocks */
.glass{
  background: var(--panel);
  border:1px solid var(--stroke);
  border-radius:16px;
  box-shadow: 0 10px 26px rgba(0,0,0,.25);
}

/* Cards */
.card-glass{
  background: var(--panel);
  border:1px solid var(--stroke);
  border-radius:16px; overflow:hidden;
  box-shadow: 0 10px 26px rgba(0,0,0,.25);
  transition: transform .25s ease, box-shadow .25s ease;
}
.card-glass:hover{transform:translateY(-4px); box-shadow:0 18px 38px rgba(0,0,0,.35)}
.card-img-top{height:180px; object-fit:cover}
.object-cover{object-fit:cover}

/* Clients grid */
.client-logos{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 28px 32px;
  align-items:center;
  justify-items:center;
  margin-top:24px;
}
.client-item{
  width:100%;
  display:flex; align-items:center; justify-content:center;
  padding:16px 12px;
  border-radius:12px;
  background: rgba(255,255,255,.03);
  border:1px solid var(--stroke);
}
.client-logo{
  height:52px; max-width:90%; object-fit:contain;
  filter: grayscale(100%) opacity(.85);
  transition: filter .2s, transform .2s;
}
.client-item:hover .client-logo{filter:none; transform:scale(1.03)}

/* Footer */
footer{background:rgba(255,255,255,.02)}


/* ===== ORG CHART (About page) ===== */
.orgchart{position:relative}

/* Root box */
.org-root{
  max-width: 520px;
  border: 1px solid rgba(255,255,255,.16);
}
.org-name{letter-spacing:.4px}

/* Title box (CADSTAR/CADENCE/CHECKER/Assistant) */
.org-box-title{
  border: 1px solid rgba(47,154,230,.35);
}
.org-assistant{
  border: 1px solid rgba(57,181,74,.45);
}

/* Hiring plan green highlight */
.org-highlight{
  border: 1px solid rgba(57,181,74,.55);
  background: rgba(57,181,74,.08);
}

/* Connectors area (desktop only) */
.org-connectors{
  position:relative;
  height: 60px;
  margin: 18px 0 8px;
}

/* Vertical  */
.org-v{
  position:absolute;
  left:50%;
  top:-18px;
  height: 40px;
  width: 2px;
  transform: translateX(-50%);
  background: rgba(255,255,255,.22);
}

.org-h{
  position:absolute;
  left: 6%;
  right: 6%;
  top: 22px;
  height: 2px;
  background: rgba(255,255,255,.22);
}

.org-drop{
  position:absolute;
  top: 22px;
  height: 38px;
  width: 2px;
  background: rgba(255,255,255,.22);
}
.org-drop-1{ left: 12.5%; transform: translateX(-50%); }
.org-drop-2{ left: 37.5%; transform: translateX(-50%); }
.org-drop-3{ left: 62.5%; transform: translateX(-50%); }
.org-drop-4{ left: 87.5%; transform: translateX(-50%); }

@media (max-width: 991.98px){
  .org-root{max-width: 100%;}
}


/* ===== Clients  ===== */
#clients .clients-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}

@media (min-width: 768px){
  #clients .clients-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 992px){
  #clients .clients-grid{
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

#clients .client-tile{
  height: 96px;
  border-radius: 18px;
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: center;

  /* Fond clair => logos visibles */
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(0,0,0,.10);
  box-shadow: 0 12px 28px rgba(0,0,0,.25);

  transition: transform .18s ease, box-shadow .18s ease;
}

#clients .client-tile:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(0,0,0,.30);
}

#clients .client-logo{
  max-height: 52px;
  max-width: 100%;
  width: auto;
  height: auto;
  object-fit: contain;

  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}