/* =========================================
   PAGE: Hizmetler — assets/css/pages/hizmetler.css
   Scoped page styles only
========================================= */

:root{
  --ot-srv-ink:#08111f;
  --ot-srv-muted:rgba(8,17,31,.72);
  --ot-srv-line:rgba(2,6,23,.10);
  --ot-srv-card:#fff;
  --ot-srv-soft:#f7f8ff;
  --ot-srv-shadow:0 18px 50px rgba(2,6,23,.08);
  --ot-srv-grad-a:var(--grad-a);
  --ot-srv-grad-b:var(--grad-b);
}

/* genel */
.ot-servicesPage{
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 8%, rgba(106,61,240,.10), transparent 34%),
    radial-gradient(circle at 88% 10%, rgba(43,123,255,.10), transparent 36%),
    linear-gradient(180deg, #fff 0%, #fbfcff 100%);
}

/* intro */
.ot-srvIntro{
  padding:54px 0 26px;
}

.ot-srvIntro__grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:24px;
  align-items:stretch;
}

.ot-srvKicker{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--ot-srv-line);
  background:#fff;
  box-shadow:0 10px 30px rgba(2,6,23,.06);
  color:rgba(8,17,31,.82);
  font-size:13px;
  font-weight:900;
}

.ot-srvKicker i{
  color:rgba(106,61,240,.95);
}

.ot-srvIntro__title{
  margin:16px 0 10px;
  max-width:820px;
  color:var(--ot-srv-ink);
  font-size:clamp(26px, 3vw, 46px);
  line-height:1.08;
  letter-spacing:-.45px;
}

.ot-srvIntro__desc{
  margin:0;
  max-width:840px;
  color:var(--ot-srv-muted);
  font-size:16px;
}

.ot-srvIntro__panel{
  position:relative;
  padding:18px;
  background:linear-gradient(135deg, #12001f 0%, #3B0764 45%, #1D4ED8 100%);
  color:#fff;
  box-shadow:0 24px 70px rgba(42,25,96,.22);
  overflow:hidden;
}

.ot-srvIntro__panel::before{
  content:"";
  position:absolute;
  inset:-50%;
  background:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.18), transparent 42%),
    radial-gradient(circle at 70% 20%, rgba(34,211,238,.22), transparent 38%),
    radial-gradient(circle at 60% 80%, rgba(236,72,153,.22), transparent 45%);
  filter:blur(24px);
  opacity:.8;
}

.ot-srvStat{
  position:relative;
  z-index:2;
  padding:14px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(8px);
}

.ot-srvStat + .ot-srvStat{
  margin-top:10px;
}

.ot-srvStat strong{
  display:block;
  margin:0 0 4px;
  font-size:15px;
}

.ot-srvStat span{
  display:block;
  opacity:.88;
  font-size:13px;
}

/* service cards */
.ot-srvCards{
  padding:22px 0 58px;
}

.ot-srvCards__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:16px;
}

.ot-srvCard{
  position:relative;
  min-height:310px;
  display:flex;
  flex-direction:column;
  padding:20px;
  background:var(--ot-srv-card);
  border:1px solid var(--ot-srv-line);
  box-shadow:var(--ot-srv-shadow);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  overflow:hidden;
}

.ot-srvCard::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:4px;
  background:linear-gradient(90deg, var(--ot-srv-grad-a), var(--ot-srv-grad-b));
  opacity:.9;
}

.ot-srvCard:hover{
  transform:translateY(-4px);
  box-shadow:0 26px 70px rgba(2,6,23,.12);
  border-color:rgba(106,61,240,.24);
}

.ot-srvCard__icon{
  width:52px;
  height:52px;
  border-radius:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:linear-gradient(135deg, var(--ot-srv-grad-a), var(--ot-srv-grad-b));
  box-shadow:0 14px 30px rgba(106,61,240,.20);
  margin-bottom:14px;
}

.ot-srvCard__icon i{
  font-size:20px;
}

.ot-srvCard__title{
  margin:0 0 9px;
  color:var(--ot-srv-ink);
  font-size:19px;
  line-height:1.18;
  letter-spacing:-.15px;
}

.ot-srvCard__desc{
  margin:0;
  color:var(--ot-srv-muted);
  font-size:14px;
}

.ot-srvCard__btn{
  margin-top:auto;
  padding-top:18px;
  display:inline-flex;
  align-items:center;
  gap:9px;
  width:max-content;
  max-width:100%;
  color:rgba(43,123,255,.98);
  font-weight:900;
  text-decoration:none;
  transition:gap .18s ease, color .18s ease;
}

.ot-srvCard__btn:hover{
  gap:12px;
  color:rgba(106,61,240,.98);
  text-decoration:none;
}

/* process */
.ot-srvProcess{
  padding:64px 0;
  background:#0b0f17;
  color:#fff;
}

.ot-srvProcess__head{
  max-width:840px;
  margin:0 0 22px;
}

.ot-srvProcess__head h2{
  margin:0 0 8px;
  font-size:clamp(24px, 2.5vw, 40px);
  line-height:1.1;
}

.ot-srvProcess__head p{
  margin:0;
  opacity:.82;
}

.ot-srvProcess__grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:14px;
}

.ot-srvStep{
  padding:18px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  min-height:220px;
}

.ot-srvStep__no{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:14px;
  margin:0 0 14px;
  color:#fff;
  background:linear-gradient(135deg, #6D28D9, #2563EB);
  font-weight:900;
}

.ot-srvStep h3{
  margin:0 0 8px;
  font-size:17px;
}

.ot-srvStep p{
  margin:0;
  opacity:.82;
  font-size:14px;
}

/* seo content */
.ot-srvSeo{
  padding:64px 0 28px;
}

.ot-srvSeo__box{
  padding:26px;
  background:#fff;
  border:1px solid var(--ot-srv-line);
  box-shadow:var(--ot-srv-shadow);
}

.ot-srvSeo__box h2{
  margin:0 0 14px;
  color:var(--ot-srv-ink);
  font-size:clamp(23px, 2.3vw, 36px);
  line-height:1.12;
  letter-spacing:-.25px;
}

.ot-srvSeo__content{
  max-width:980px;
}

.ot-srvSeo__content p{
  margin:0 0 13px;
  color:var(--ot-srv-muted);
}

.ot-srvSeo__tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px;
}

.ot-srvSeo__tags span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 11px;
  border-radius:999px;
  border:1px solid var(--ot-srv-line);
  background:var(--ot-srv-soft);
  color:rgba(8,17,31,.84);
  font-size:12px;
  font-weight:900;
}

.ot-srvSeo__tags i{
  color:rgba(43,123,255,.95);
}

/* FAQ */
.ot-srvFaq{
  padding:38px 0 58px;
}

.ot-srvFaq__head{
  max-width:760px;
  margin:0 0 18px;
}

.ot-srvFaq__head h2{
  margin:0 0 8px;
  color:var(--ot-srv-ink);
  font-size:clamp(23px, 2.2vw, 34px);
}

.ot-srvFaq__head p{
  margin:0;
  color:var(--ot-srv-muted);
}

.ot-srvFaq__list{
  display:grid;
  gap:10px;
}

.ot-srvFaqItem{
  border:1px solid var(--ot-srv-line);
  background:#fff;
  box-shadow:0 10px 34px rgba(2,6,23,.05);
}

.ot-srvFaqQ{
  width:100%;
  padding:15px 16px;
  border:0;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  cursor:pointer;
  color:var(--ot-srv-ink);
  font-weight:900;
  text-align:left;
}

.ot-srvFaqQ span{
  flex:0 0 auto;
  width:28px;
  height:28px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg, var(--ot-srv-grad-a), var(--ot-srv-grad-b));
  color:#fff;
}

.ot-srvFaqA{
  display:none;
  padding:0 16px 15px;
  color:var(--ot-srv-muted);
}

.ot-srvFaqItem.is-open .ot-srvFaqA{
  display:block;
}

.ot-srvFaqItem.is-open .ot-srvFaqQ span{
  transform:rotate(45deg);
}

/* CTA */
.ot-srvCta{
  padding:0 0 72px;
}

.ot-srvCta__box{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:26px;
  color:#fff;
  background:linear-gradient(135deg, #3B0764 0%, #6D28D9 50%, #1D4ED8 100%);
  box-shadow:0 24px 70px rgba(48,31,115,.22);
}

.ot-srvCta__box h2{
  margin:0 0 8px;
  font-size:clamp(22px, 2.2vw, 34px);
  line-height:1.1;
}

.ot-srvCta__box p{
  margin:0;
  max-width:760px;
  opacity:.88;
}

.ot-srvCta__actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
  flex:0 0 auto;
}

.ot-srvBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:12px 16px;
  border-radius:14px;
  font-weight:900;
  text-decoration:none;
  transition:transform .18s ease, filter .18s ease, background .18s ease;
}

.ot-srvBtn:hover{
  transform:translateY(-1px);
  text-decoration:none;
}

.ot-srvBtn--primary{
  background:#fff;
  color:#3B0764;
}

.ot-srvBtn--ghost{
  border:1px solid rgba(255,255,255,.28);
  color:#fff;
  background:rgba(255,255,255,.10);
}

/* reveal */
.ot-reveal{
  opacity:0;
  transform:translateY(14px);
  transition:opacity .55s ease, transform .55s ease;
  will-change:opacity, transform;
}

.ot-reveal.is-inview{
  opacity:1;
  transform:translateY(0);
}

/* responsive */
@media(max-width:1100px){
  .ot-srvCards__grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }

  .ot-srvProcess__grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}

@media(max-width:980px){
  .ot-srvIntro{
    padding:42px 0 20px;
  }

  .ot-srvIntro__grid{
    grid-template-columns:1fr;
  }

  .ot-srvCta__box{
    align-items:flex-start;
    flex-direction:column;
  }

  .ot-srvCta__actions{
    justify-content:flex-start;
  }
}

@media(max-width:640px){
  .ot-srvCards__grid,
  .ot-srvProcess__grid{
    grid-template-columns:1fr;
  }

  .ot-srvCard{
    min-height:auto;
  }

  .ot-srvSeo__box,
  .ot-srvCta__box{
    padding:20px;
  }

  .ot-srvBtn{
    width:100%;
  }

  .ot-srvCta__actions{
    width:100%;
  }
}

/* Hizmet kartı ikon alanı - FIX */
.ot-srvCard__icon{
  width:52px;
  height:52px;
  min-width:52px;
  border-radius:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#fff !important;
  background:linear-gradient(135deg, #6a3df0 0%, #2b7bff 100%) !important;
  box-shadow:0 14px 30px rgba(106,61,240,.22);
  margin-bottom:14px;
}

.ot-srvCard__icon i{
  display:inline-block;
  font-size:21px;
  line-height:1;
  color:#fff !important;
  font-family:"Font Awesome 6 Free" !important;
  font-weight:900 !important;
}