:root{
  --hero-ink:#071521;
  --hero-ink-soft:#0d2233;
  --hero-line:rgba(255,255,255,.12);
  --hero-coral:#ff6b35;
  --hero-coral-soft:#ff9a73;
  --hero-mint:#7ce7d6;
}

/* Ilk ziyarette cerez bandi CTA seviyesine kadar yukselir. Bu sayfada
   yuzen WhatsApp dugmesi band acikken ana teklif butonunu kapatmasin. */
.cerez-bant-acik .cerez-iter-yuzen{ display:none; }

/* ============================== Hero ============================== */
.ana-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:43rem;
  padding:4.75rem 0 6.5rem;
  color:#fff;
  background:
    radial-gradient(circle at 82% 20%,rgba(18,126,145,.25),transparent 27rem),
    linear-gradient(135deg,var(--hero-ink) 0%,#091c2b 52%,#0b2736 100%);
}
.ana-hero-izgara{
  position:absolute;
  inset:0;
  z-index:-3;
  opacity:.36;
  background-image:
    linear-gradient(var(--hero-line) 1px,transparent 1px),
    linear-gradient(90deg,var(--hero-line) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:linear-gradient(to bottom,black,transparent 88%);
  mask-image:linear-gradient(to bottom,black,transparent 88%);
}
.ana-hero-isik{
  position:absolute;
  z-index:-2;
  border-radius:999px;
  filter:blur(8px);
  pointer-events:none;
}
.ana-hero-isik--bir{
  width:25rem;
  height:25rem;
  top:-11rem;
  right:-4rem;
  background:rgba(255,107,53,.18);
}
.ana-hero-isik--iki{
  width:18rem;
  height:18rem;
  bottom:-10rem;
  left:8%;
  background:rgba(124,231,214,.14);
}
.ana-hero-kap{
  width:min(80rem,100%);
  margin:0 auto;
  padding:0 1rem;
}
.ana-hero-duzen{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(25rem,.95fr);
  align-items:center;
  gap:clamp(3rem,6vw,6rem);
}
.ana-hero-icerik{ max-width:45rem; }
.ana-hero-etiket{
  display:inline-flex;
  align-items:center;
  gap:.65rem;
  margin:0 0 1.35rem;
  padding:.55rem .85rem;
  border:1px solid rgba(124,231,214,.25);
  border-radius:999px;
  background:rgba(124,231,214,.08);
  color:#c8fff6;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ana-hero-etiket > span{
  width:.5rem;
  height:.5rem;
  border-radius:50%;
  background:var(--hero-mint);
  box-shadow:0 0 0 .3rem rgba(124,231,214,.12);
}
.ana-hero-baslik{
  max-width:16.5ch;
  margin:0;
  color:#fff;
  font-size:clamp(2.65rem,3.8vw,4rem);
  font-weight:850;
  letter-spacing:-.055em;
  line-height:.98;
  text-wrap:balance;
}
.ana-hero-baslik strong{
  color:var(--hero-coral-soft);
  font-weight:inherit;
}
.ana-hero-ozet{
  max-width:39rem;
  margin:1.3rem 0 0;
  color:#b9c8d2;
  font-size:clamp(1.03rem,1.5vw,1.18rem);
  line-height:1.75;
}
.ana-hero-eylemler{
  display:flex;
  flex-wrap:wrap;
  gap:.85rem;
  margin-top:1.2rem;
}
.ana-hero-btn{
  display:inline-flex;
  min-height:3.35rem;
  align-items:center;
  justify-content:center;
  gap:.65rem;
  padding:.85rem 1.25rem;
  border:1px solid transparent;
  border-radius:.85rem;
  font-size:.9rem;
  font-weight:800;
  line-height:1.2;
  text-align:center;
  text-decoration:none;
  transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
.ana-hero-btn--ana{
  background:var(--hero-coral);
  color:#fff;
  box-shadow:0 16px 34px -18px rgba(255,107,53,.9);
}
.ana-hero-btn--ana:hover{
  color:#fff;
  background:#ff7b4a;
  transform:translateY(-2px);
}
.ana-hero-btn--ikincil{
  border-color:rgba(255,255,255,.2);
  background:rgba(255,255,255,.06);
  color:#fff;
}
.ana-hero-btn--ikincil:hover{
  border-color:rgba(255,255,255,.4);
  background:rgba(255,255,255,.11);
  color:#fff;
}
.ana-hero-btn:focus-visible,
.ana-hero-proje:focus-visible,
.guven-seridi-tumu:focus-visible{
  outline:3px solid var(--hero-mint);
  outline-offset:3px;
}
.ana-hero-guven{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem 1.1rem;
  margin:1.5rem 0 0;
  padding:0;
  color:#9fb1be;
  list-style:none;
  font-size:.78rem;
  font-weight:650;
}
.ana-hero-guven li{ display:flex;align-items:center;gap:.4rem; }
.ana-hero-guven i{ color:var(--hero-mint);font-size:.66rem; }

/* Gercek proje kaydindan beslenen kanit karti */
.ana-hero-kanit{
  position:relative;
  padding:.85rem;
  border:1px solid rgba(255,255,255,.14);
  border-radius:1.5rem;
  background:rgba(255,255,255,.075);
  box-shadow:0 32px 70px -28px rgba(0,0,0,.68);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
  transform:rotate(1deg);
}
.ana-hero-kanit::before{
  content:"";
  position:absolute;
  inset:-1rem 2rem auto;
  z-index:-1;
  height:4rem;
  border-radius:50%;
  background:rgba(255,107,53,.3);
  filter:blur(30px);
}
.ana-hero-kanit-ust,
.ana-hero-kanit-alt{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  padding:.3rem .35rem .8rem;
}
.ana-hero-canli{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  color:#dce7ed;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.ana-hero-canli i{
  width:.48rem;
  height:.48rem;
  border-radius:50%;
  background:var(--hero-mint);
  box-shadow:0 0 0 .27rem rgba(124,231,214,.13);
}
.ana-hero-kanit-tur{
  color:#91a7b4;
  font-size:.72rem;
  font-weight:700;
}
.ana-hero-proje{
  display:block;
  overflow:hidden;
  border-radius:1rem;
  background:#fff;
  color:#0f172a;
  text-decoration:none;
}
.ana-hero-proje:hover{ color:#0f172a; }
.ana-hero-proje-gorsel{
  display:flex;
  height:17rem;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-bottom:1px solid #e7edf1;
  background:#edf2f4;
}
.ana-hero-proje-gorsel img{
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform .45s ease;
}
.ana-hero-proje:hover .ana-hero-proje-gorsel img{ transform:scale(1.025); }
.ana-hero-proje-bilgi{
  display:flex;
  min-height:8.1rem;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1.2rem 1.25rem;
}
.ana-hero-proje-musteri{
  display:block;
  margin-bottom:.28rem;
  color:#ef5b27;
  font-size:.68rem;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ana-hero-proje-bilgi h2{
  margin:0;
  color:#0f172a;
  font-size:1.08rem;
  font-weight:850;
  line-height:1.3;
}
.ana-hero-proje-bilgi p{
  display:-webkit-box;
  overflow:hidden;
  margin:.38rem 0 0;
  color:#64748b;
  font-size:.78rem;
  line-height:1.55;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.ana-hero-proje-ok{
  display:grid;
  width:2.65rem;
  height:2.65rem;
  flex:0 0 auto;
  place-items:center;
  border-radius:50%;
  background:#f0f5f7;
  color:#173447;
  font-size:.8rem;
}
.ana-hero-kanit-alt{
  justify-content:flex-start;
  flex-wrap:wrap;
  padding:.8rem .35rem .25rem;
  color:#aebfc9;
  font-size:.68rem;
  font-weight:750;
}
.ana-hero-kanit-alt span{ display:flex;align-items:center;gap:.34rem; }
.ana-hero-kanit-alt i{ color:var(--hero-mint); }

/* =========================== Guven seridi ========================= */
.guven-seridi{
  position:relative;
  z-index:4;
  margin-top:-2.65rem;
  padding:0 1rem 4rem;
}
.guven-seridi-kap{
  width:min(80rem,100%);
  margin:0 auto;
  overflow:hidden;
  border:1px solid #e5eaee;
  border-radius:1.4rem;
  background:#fff;
  box-shadow:0 22px 55px -35px rgba(7,21,33,.48);
}
.guven-seridi-ust{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:2rem;
  padding:2rem 2.1rem 1.7rem;
}
.guven-seridi-metin{ max-width:40rem; }
.guven-seridi-etiket{
  display:flex;
  align-items:center;
  gap:.45rem;
  margin:0 0 .65rem;
  color:#e85b29 !important;
  font-size:.68rem !important;
  font-weight:850 !important;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.guven-seridi-metin h2{
  margin:0;
  color:#0f172a;
  font-size:clamp(1.5rem,2.8vw,2.35rem);
  font-weight:850;
  letter-spacing:-.035em;
  line-height:1.12;
  text-wrap:balance;
}
.guven-seridi-metin > p:last-child{
  margin:.65rem 0 0;
  color:#64748b;
  font-size:.86rem;
  line-height:1.65;
}
.guven-seridi-sayilar{
  display:flex;
  align-items:stretch;
  margin:0;
  border:1px solid #e8edf0;
  border-radius:1rem;
  background:#f8fafb;
}
.guven-seridi-sayilar > div{
  display:flex;
  min-width:7.7rem;
  flex-direction:column;
  padding:1rem 1.15rem;
  border-left:1px solid #e4eaee;
}
.guven-seridi-sayilar > div:first-child{ border-left:0; }
.guven-seridi-sayilar dt{
  order:2;
  margin-top:.2rem;
  color:#71818d;
  font-size:.63rem;
  font-weight:750;
  letter-spacing:.04em;
  line-height:1.25;
  text-transform:uppercase;
}
.guven-seridi-sayilar dd{
  order:1;
  margin:0;
  color:#0c2637;
  font-size:1.65rem;
  font-weight:900;
  letter-spacing:-.04em;
  line-height:1;
}
.guven-seridi-logolar{
  display:grid;
  grid-template-columns:10.5rem minmax(0,1fr) auto;
  align-items:center;
  gap:1.25rem;
  padding:1rem 2.1rem;
  border-top:1px solid #edf0f2;
  border-bottom:1px solid #edf0f2;
  background:#fbfcfc;
}
.guven-seridi-logo-baslik{
  color:#697b87;
  font-size:.68rem;
  font-weight:750;
  line-height:1.45;
}
.guven-seridi-logolar ul{
  display:grid;
  grid-template-columns:repeat(8,minmax(4.5rem,1fr));
  align-items:center;
  gap:.55rem;
  min-width:0;
  margin:0;
  padding:0;
  list-style:none;
}
.guven-seridi-logolar li{
  display:flex;
  height:3.8rem;
  align-items:center;
  justify-content:center;
  padding:.45rem;
  border:1px solid #e9edef;
  border-radius:.7rem;
  background:#fff;
}
.guven-seridi-logolar img{
  width:auto;
  max-width:100%;
  height:auto;
  max-height:2.4rem;
  object-fit:contain;
  filter:grayscale(100%);
  opacity:.76;
  transition:filter .25s ease,opacity .25s ease,transform .25s ease;
}
.guven-seridi-logolar li:hover img{
  filter:none;
  opacity:1;
  transform:scale(1.04);
}
.guven-seridi-tumu{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  color:#173d52;
  font-size:.72rem;
  font-weight:850;
  text-decoration:none;
  white-space:nowrap;
}
.guven-seridi-tumu:hover{ color:#e85b29; }
.guven-seridi-sertifikalar{
  display:flex;
  align-items:center;
  gap:1.25rem;
  padding:.85rem 2.1rem;
  background:#fff;
}
.guven-seridi-sertifikalar > span{
  color:#697b87;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
  white-space:nowrap;
}
.guven-seridi-sertifikalar ul{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin:0;
  padding:0;
  list-style:none;
}
.guven-seridi-sertifikalar li{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.45rem .7rem;
  border:1px solid #dfe8e8;
  border-radius:999px;
  background:#f3faf8;
  color:#214e4a;
  font-size:.69rem;
  font-weight:800;
}
.guven-seridi-sertifikalar i{ color:#198b7c; }

@media (min-width:640px){
  .ana-hero-kap{ padding:0 1.5rem; }
  .guven-seridi{ padding-right:1.5rem;padding-left:1.5rem; }
}
@media (min-width:1024px){
  .ana-hero-kap{ padding:0 2rem; }
  .guven-seridi{ padding-right:2rem;padding-left:2rem; }
}
@media (max-width:1050px){
  .ana-hero{
    min-height:auto;
    padding-top:6.75rem;
  }
  .ana-hero-duzen{
    grid-template-columns:1fr;
    gap:3.5rem;
  }
  .ana-hero-icerik{ max-width:48rem; }
  .ana-hero-baslik{ max-width:16ch; }
  .ana-hero-kanit{
    width:min(43rem,100%);
    transform:none;
  }
  .guven-seridi-ust{ grid-template-columns:1fr;align-items:start; }
  .guven-seridi-sayilar{ width:100%; }
  .guven-seridi-sayilar > div{ flex:1; }
  .guven-seridi-logolar{
    grid-template-columns:1fr auto;
  }
  .guven-seridi-logo-baslik{ grid-column:1/-1; }
  .guven-seridi-logolar ul{ grid-template-columns:repeat(4,1fr); }
}
@media (max-width:640px){
  .ana-hero{
    padding:7.8rem 0 5.8rem;
  }
  .ana-hero-izgara{ background-size:42px 42px; }
  .ana-hero-etiket{
    font-size:.65rem;
    letter-spacing:.055em;
  }
  .ana-hero-baslik{
    max-width:none;
    font-size:clamp(2.35rem,12vw,3.45rem);
    line-height:1.01;
  }
  .ana-hero-ozet{
    margin-top:1.3rem;
    font-size:.98rem;
    line-height:1.65;
  }
  .ana-hero-eylemler{ flex-direction:column; }
  .ana-hero-btn{ width:100%; }
  .ana-hero-guven{ gap:.65rem 1rem; }
  .ana-hero-kanit{ padding:.62rem;border-radius:1.15rem; }
  .ana-hero-proje-gorsel{ height:12rem; }
  .ana-hero-proje-bilgi{ min-height:7rem;padding:1rem; }
  .ana-hero-proje-ok{ display:none; }
  .ana-hero-kanit-alt span:last-child{ display:none; }
  .guven-seridi{
    margin-top:-2rem;
    padding-right:.75rem;
    padding-bottom:3rem;
    padding-left:.75rem;
  }
  .guven-seridi-kap{ border-radius:1.05rem; }
  .guven-seridi-ust{ gap:1.25rem;padding:1.5rem 1.15rem 1.2rem; }
  .guven-seridi-sayilar{
    display:grid;
    grid-template-columns:repeat(3,1fr);
  }
  .guven-seridi-sayilar > div{
    min-width:0;
    padding:.85rem .65rem;
  }
  .guven-seridi-sayilar dd{ font-size:1.35rem; }
  .guven-seridi-sayilar dt{ font-size:.54rem; }
  .guven-seridi-logolar{
    display:block;
    padding:.9rem 1.15rem 1.1rem;
  }
  .guven-seridi-logo-baslik{ display:block;margin-bottom:.65rem; }
  .guven-seridi-logolar ul{
    display:flex;
    overflow-x:auto;
    gap:.55rem;
    margin-right:-1.15rem;
    padding:0 1.15rem .45rem 0;
    scroll-snap-type:x proximity;
    scrollbar-width:thin;
  }
  .guven-seridi-logolar li{
    width:7.25rem;
    flex:0 0 7.25rem;
    scroll-snap-align:start;
  }
  .guven-seridi-tumu{ margin-top:.65rem; }
  .guven-seridi-sertifikalar{
    display:block;
    padding:.9rem 1.15rem 1.15rem;
  }
  .guven-seridi-sertifikalar ul{ margin-top:.65rem; }
}

@media (prefers-reduced-motion:reduce){
  .ana-hero-btn,
  .ana-hero-proje-gorsel img,
  .guven-seridi-logolar img{ transition:none; }
  .ana-hero-btn--ana:hover,
  .guven-seridi-logolar li:hover img{ transform:none; }
}
