/* V1.4 — Videntis çözüm ortağı şeridi, 360° hizmet kataloğu, marka duvarı */

/* ── Çözüm ortağı şeridi ─────────────────────────────────────── */
.solution-partner {
  position: fixed; z-index: 120; top: 0; left: 0; right: 0; height: 34px;
  display: flex; align-items: center; justify-content: center; gap: 11px;
  background: #05060a; border-bottom: 1px solid #ffffff14;
  text-decoration: none; font: 400 .56rem var(--mono);
  letter-spacing: .2em; text-transform: uppercase; color: #8f93a5;
}
.solution-partner svg { width: 15px; height: 15px; flex: none; }
.solution-partner b { font-weight: 500; color: #dfe3f7; letter-spacing: .2em; transition: color .3s; }
.solution-partner i { font-style: normal; color: #6f7488; transition: transform .3s; }
.solution-partner:hover b { color: #fff; }
.solution-partner:hover i { transform: translate(2px, -2px); }
.nav { top: 34px; }
.hero { padding-top: 184px; }
.nav.open nav { top: 88px; }

/* ── 02 / 360° hizmet kataloğu ───────────────────────────────── */
.services-head > div p {
  max-width: 460px; margin-top: 28px; color: #555; line-height: 1.75;
}
.cap-list { border-top: 1px solid #aaa; }
.cap { border-bottom: 1px solid #aaa; transition: background .35s; }
.cap:hover, .cap.open { background: #efeee9; }
.cap-head {
  display: grid; grid-template-columns: .5fr 2fr 2fr .5fr .3fr; gap: 30px;
  align-items: center; width: 100%; padding: 36px 10px;
  background: none; border: 0; text-align: left; cursor: pointer; color: inherit;
}
.cap-head > span { font: 400 .65rem var(--mono); color: var(--blue); }
.cap-head h3 { font: 400 clamp(1.25rem, 2vw, 2.1rem)/1.06 var(--display); letter-spacing: -.04em; }
.cap-head p { max-width: 430px; color: #555; line-height: 1.7; }
.cap-head small { font: 400 .58rem var(--mono); letter-spacing: .14em; color: #888; text-align: right; white-space: nowrap; }
.cap-head i { font-style: normal; font-size: 1.45rem; font-weight: 300; justify-self: end; transition: transform .4s; }
.cap.open .cap-head i { transform: rotate(45deg); }
.cap-body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .5s cubic-bezier(.25,.7,.2,1); }
.cap.open .cap-body { grid-template-rows: 1fr; }
.cap-inner { overflow: hidden; display: grid; grid-template-columns: .5fr 4.5fr .3fr; gap: 30px; }
.cap-tags { grid-column: 2; display: flex; flex-wrap: wrap; gap: 10px; padding: 6px 0 42px; }
.cap-tags em {
  font: 400 .62rem var(--mono); font-style: normal; letter-spacing: .07em;
  padding: 9px 15px; border: 1px solid #b6b4ad; border-radius: 999px;
  color: #3c3c3c; transition: border-color .3s, color .3s;
}
.cap-tags em:hover { border-color: var(--blue); color: var(--blue); }

/* ── 08 / marka duvarı ───────────────────────────────────────── */
.clients { background: #f4f2ed; color: #111; }
.clients-head { display: grid; grid-template-columns: 1fr 2.1fr; gap: 5vw; align-items: end; margin-bottom: 64px; }
.clients-head h2 { font: 400 clamp(2.25rem, 4vw, 4.7rem)/1.08 var(--display); letter-spacing: -.065em; }
.clients-head h2 em { font-style: normal; color: var(--blue); }
.clients-head p { max-width: 520px; margin-top: 26px; color: #555; line-height: 1.75; }
.clients-count { display: block; margin-top: 22px; font: 400 .58rem var(--mono); letter-spacing: .2em; color: #999; }
.clients-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: #cdcac3; border: 1px solid #cdcac3; }
.client {
  margin: 0; min-height: 195px; padding: 40px 26px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px;
  background: #f4f2ed;
}
.client img {
  max-height: 62px; max-width: 82%; width: auto; object-fit: contain;
  filter: grayscale(1); mix-blend-mode: multiply; opacity: .72; transition: filter .35s, opacity .35s;
}
.client:hover img { filter: none; opacity: 1; }
.client figcaption { display: flex; flex-direction: column; align-items: center; gap: 5px; text-align: center; }
.client figcaption b { font: 500 .58rem var(--mono); letter-spacing: .1em; text-transform: uppercase; color: #4a4a4a; }
.client figcaption span { font: 400 .5rem var(--mono); letter-spacing: .2em; color: #a09e97; }
.client-cta {
  min-height: 195px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  background: #101116; color: #f4f2ed; text-decoration: none; text-align: center; padding: 30px;
  transition: background .35s;
}
.client-cta b { font: 400 1.05rem var(--display); letter-spacing: -.03em; }
.client-cta span { font: 400 .55rem var(--mono); letter-spacing: .2em; text-transform: uppercase; color: #9fa3b5; }
.client-cta:hover { background: var(--blue); }

@media (max-width: 900px) {
  .cap-head { grid-template-columns: .5fr 2.4fr .6fr .3fr; }
  .cap-head p { display: none; }
  .clients-head { grid-template-columns: 1fr; gap: 26px; }
  .clients-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 620px) {
  .solution-partner { letter-spacing: .12em; gap: 8px; }
  .hero { padding-top: 150px; }
  .nav.open nav { top: 72px; }
  .cap-head { grid-template-columns: .35fr 1fr .2fr; gap: 16px; padding: 30px 6px; }
  .cap-head small { display: none; }
  .cap-inner { grid-template-columns: 1fr; gap: 0; }
  .cap-tags { grid-column: 1; padding: 2px 6px 34px; }
  .client { min-height: 160px; padding: 28px 16px; gap: 14px; }
  .client img { max-height: 48px; }
  .client figcaption span { display: none; }
  .clients-grid { grid-template-columns: repeat(2, 1fr); }
  .client-cta { min-height: 160px; }
}
@media (prefers-reduced-motion: reduce) {
  .cap-body { transition: none; }
}
