:root{
  --green:#198b38;
  --green-2:#55c760;
  --green-dark:#0f6a2b;

  --navy:#061a2f;
  --navy-2:#0b2741;
  --navy-3:#102f4c;

  --ink:#071f3e;
  --text:#30455c;
  --muted:#6a7a89;

  --soft:#f5f8f8;
  --soft-2:#eef3f4;
  --line:#dfe6ea;

  --white:#ffffff;
  --danger:#e84532;

  --shadow-sm:0 10px 30px rgba(5,30,54,.08);
  --shadow-md:0 20px 60px rgba(5,30,54,.15);

  --radius-sm:10px;
  --radius-md:16px;
  --radius-lg:24px;

  --container:1220px;
}


/* ===================================================== */
/* TEMEL                                                 */
/* ===================================================== */

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  font-family:Inter,Arial,sans-serif;
  color:var(--ink);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

a{
  color:inherit;
  text-decoration:none;
}

button{
  font:inherit;
}

img{
  max-width:100%;
  display:block;
}

.container{
  max-width:var(--container);
  margin:0 auto;
  padding-left:28px;
  padding-right:28px;
}

.eyebrow{
  font-size:12px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.green{
  color:var(--green);
}


/* ===================================================== */
/* HEADER                                                */
/* ===================================================== */

.topbar{
  position:sticky;
  top:0;
  z-index:50;

  height:76px;

  background:rgba(255,255,255,.93);

  border-bottom:1px solid rgba(6,26,47,.08);

  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.topbar-inner{
  max-width:var(--container);
  height:100%;
  margin:0 auto;
  padding:0 28px;

  display:flex;
  align-items:center;
  gap:30px;
}

.brand{
  display:flex;
  flex-direction:column;

  line-height:1;

  min-width:138px;
}

.brand-mark{
  font-size:31px;
  font-weight:800;
  letter-spacing:-2px;
  color:var(--ink);
}

.brand-mark::first-letter{
  color:var(--green);
}

.brand-note{
  font-size:8px;
  margin-top:5px;
  color:#536273;
}

.nav{
  margin-left:auto;

  display:flex;
  align-items:center;
  gap:22px;

  font-size:12px;
  font-weight:600;
}

.nav a{
  position:relative;

  padding:29px 0 27px;

  transition:.2s ease;
}

.nav a::after{
  content:"";

  position:absolute;
  left:0;
  right:100%;
  bottom:18px;

  height:2px;

  background:var(--green);

  transition:.2s ease;
}

.nav a:hover{
  color:var(--green);
}

.nav a:hover::after{
  right:0;
}

.menu-toggle{
  display:none;

  margin-left:auto;

  border:0;
  background:transparent;

  font-size:26px;

  cursor:pointer;
}


/* ===================================================== */
/* HERO                                                  */
/* ===================================================== */

.hero{
  position:relative;

  min-height:590px;

  overflow:hidden;

  color:var(--white);

  background:
    radial-gradient(
      circle at 72% 35%,
      #214d72 0,
      #12324f 22%,
      #071e35 48%,
      #04111f 75%
    );
}

.hero::before{
  content:"";

  position:absolute;
  inset:0;

  background:
    linear-gradient(
      90deg,
      rgba(2,15,28,.05) 0%,
      rgba(2,15,28,.15) 45%,
      rgba(2,15,28,.55) 100%
    );
}

.hero-backdrop{
  position:absolute;
  inset:0;

  background:
    repeating-linear-gradient(
      120deg,
      transparent 0 80px,
      rgba(255,255,255,.025) 80px 81px
    );

  opacity:.9;
}

.hero-content{
  position:relative;
  z-index:2;

  padding-top:112px;
  padding-bottom:82px;
}

.hero .eyebrow{
  color:#d6e3ee;
}

.hero h1{
  max-width:760px;

  margin:18px 0 14px;

  font-size:76px;
  line-height:.98;

  font-weight:800;

  letter-spacing:-.055em;
}

.hero h1 span{
  color:var(--green-2);
}

.hero-slogan{
  max-width:720px;

  margin:0 0 34px;

  font-size:21px;
  line-height:1.5;

  color:#e3ebf2;
}

.actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  gap:15px;

  min-height:50px;

  padding:0 22px;

  border-radius:var(--radius-sm);

  font-size:14px;
  font-weight:700;

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

.btn:hover{
  transform:translateY(-2px);
}

.primary{
  background:var(--green);

  color:var(--white);

  box-shadow:0 8px 24px rgba(25,139,56,.22);
}

.primary:hover{
  background:var(--green-dark);
}

.ghost{
  color:var(--white);

  border:1px solid rgba(255,255,255,.6);

  background:rgba(255,255,255,.03);
}

.ghost:hover{
  background:rgba(255,255,255,.08);
}

.hero-points{
  margin-top:62px;

  display:flex;
  flex-wrap:wrap;
  gap:28px;

  font-size:12px;

  color:#d4e0e8;
}

.hero-points span{
  display:flex;
  align-items:center;

  gap:7px;
}


/* ===================================================== */
/* İSTATİSTİKLER                                         */
/* ===================================================== */

/* ===================================================== */
/* 2KA2 - İSTATİSTİK BANDI / PREMIUM                     */
/* ===================================================== */

.stats{
  padding-top:26px;
  padding-bottom:26px;
}

.stats article{
  position:relative;
  min-height:96px;
  padding:12px 18px;

  transition:
    transform .25s ease,
    background-color .25s ease,
    box-shadow .25s ease;
}

/* ÜST YEŞİL ÇİZGİ */
.stats article::before{
  content:"";
  position:absolute;

  top:-1px;
  left:50%;

  width:0;
  height:3px;

  background:var(--green);
  border-radius:3px;

  transform:translateX(-50%);

  transition:width .25s ease;
}

/* ANA RAKAMLAR */
.stats strong{
  font-size:32px;
  line-height:1;
  font-weight:800;
  letter-spacing:-0.03em;

  color:var(--ink);

  transition:
    color .25s ease,
    transform .25s ease;
}

/* ALT AÇIKLAMALAR */
.stats span{
  margin-top:10px;

  max-width:165px;

  font-size:11px;
  line-height:1.45;

  color:#526478;
}

/* MOUSE ÜZERİNE GELİNCE */
.stats article:hover{
  transform:translateY(-4px);
  background:#f8fbf9;
  box-shadow:0 10px 24px rgba(5,30,54,.06);
}

.stats article:hover::before{
  width:52px;
}

.stats article:hover strong{
  color:var(--green);
  transform:scale(1.04);
}

/* ===================================================== */
/* 2KA2 - İSTATİSTİK GRID DÜZELTME                       */
/* ===================================================== */

.stats{
  width:100%;
  max-width:1200px;
  margin:0 auto;

  display:grid !important;
  grid-template-columns:repeat(6, 1fr) !important;

  padding:26px 0;
}

.stats article{
  width:auto !important;
  min-width:0;

  display:flex !important;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  text-align:center;

  min-height:96px;
  padding:10px 16px;

  border-right:1px solid var(--line);
}

.stats article:last-child{
  border-right:0;
}

.stats strong{
  display:block;
  font-size:32px;
  line-height:1;
  font-weight:800;
}

.stats span{
  display:block;
  margin-top:9px;

  max-width:165px;

  font-size:11px;
  line-height:1.45;

  text-align:center;
}


/* ===================================================== */
/* ÜÇ ANA VURGU                                          */
/* ===================================================== */

.focus-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);

  gap:18px;

  padding-top:20px;
  padding-bottom:70px;
}

.focus-card{
  min-height:440px;

  display:flex;
  flex-direction:column;

  overflow:hidden;

  border-radius:var(--radius-md);

  background:var(--navy);

  color:var(--white);

  box-shadow:var(--shadow-sm);

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

.focus-card:hover{
  transform:translateY(-5px);

  box-shadow:var(--shadow-md);
}

.visual-placeholder{
  height:185px;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  gap:7px;

  text-align:center;

  color:#9db0c1;

  font-size:11px;
  font-weight:700;

  letter-spacing:.14em;

  background:
    linear-gradient(
      135deg,
      #173e62,
      #0c2944
    );
}

.visual-placeholder small{
  font-size:9px;
  font-weight:500;

  color:#70899d;

  letter-spacing:.08em;
}

.focus-content{
  flex:1;

  padding:26px;

  display:flex;
  flex-direction:column;
}

.focus-content > small{
  color:var(--green-2);

  font-size:10px;
  font-weight:800;

  letter-spacing:.14em;
}

.focus-card h2{
  margin:10px 0 11px;

  font-size:30px;
  line-height:1.1;

  letter-spacing:-.03em;
}

.focus-card p{
  margin:0 0 18px;

  font-size:13px;
  line-height:1.7;

  color:#d5dfe7;
}

.focus-card a,
.link-button{
  margin-top:auto;

  align-self:flex-start;

  border:0;
  padding:0;

  background:transparent;

  color:#7ce283;

  font-size:13px;
  font-weight:700;

  cursor:pointer;
}


/* ===================================================== */
/* HİZMETLER                                             */
/* ===================================================== */

.services{
  display:grid;
  grid-template-columns:310px 1fr;

  gap:60px;

  padding-top:72px;
  padding-bottom:76px;
}

.section-intro h2{
  margin:10px 0 12px;

  font-size:38px;
  line-height:1.12;

  letter-spacing:-.045em;
}

.section-intro p{
  margin:0;

  font-size:14px;
  line-height:1.7;

  color:#5b6c7e;
}

.service-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);

  gap:12px;
}

.service-card{
  position:relative;

  min-height:142px;

  padding:22px;

  border:1px solid #edf1f2;

  border-radius:12px;

  background:var(--soft);

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

.service-card:hover{
  transform:translateY(-4px);

  background:var(--white);

  box-shadow:var(--shadow-sm);
}

.service-card small{
  color:var(--green);

  font-size:11px;
  font-weight:800;
}

.service-card b{
  display:block;

  margin-top:17px;

  font-size:15px;
  line-height:1.35;

  color:var(--ink);
}


/* ===================================================== */
/* SÜREÇ                                                 */
/* ===================================================== */

.process{
  position:relative;

  overflow:hidden;

  background:
    linear-gradient(
      100deg,
      #031427 0%,
      #05322f 100%
    );

  color:var(--white);
}

.process::before{
  content:"";

  position:absolute;
  inset:0;

  background:
    repeating-linear-gradient(
      -45deg,
      transparent 0 55px,
      rgba(255,255,255,.025) 55px 56px
    );
}

.process-inner{
  position:relative;
  z-index:2;

  display:grid;
  grid-template-columns:300px 1fr;

  gap:54px;

  align-items:center;

  padding-top:52px;
  padding-bottom:52px;
}

.process h2{
  margin:10px 0 0;

  font-size:34px;
  line-height:1.12;

  letter-spacing:-.035em;
}

.steps{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:11px;

  overflow-x:auto;

  scrollbar-width:none;
}

.steps::-webkit-scrollbar{
  display:none;
}

.steps span{
  min-width:82px;

  padding:14px 11px;

  text-align:center;

  border:1px solid rgba(255,255,255,.22);

  border-radius:999px;

  font-size:11px;

  background:rgba(255,255,255,.025);
}

.steps i{
  color:#65dd6f;

  font-style:normal;
}


/* ===================================================== */
/* REFERANSLAR                                           */
/* ===================================================== */

.references{
  padding:66px 0 62px;
}

.ref-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;

  gap:30px;
}

.ref-head h2{
  margin:9px 0 0;

  font-size:36px;

  letter-spacing:-.04em;
}

.ref-head p{
  max-width:440px;

  margin:0;

  font-size:13px;
  line-height:1.65;

  color:#647589;
}

.ticker{
  position:relative;

  margin-top:30px;

  overflow:hidden;

  padding:20px 0;

  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.ticker::before,
.ticker::after{
  content:"";

  position:absolute;
  top:0;
  bottom:0;

  z-index:3;

  width:100px;

  pointer-events:none;
}

.ticker::before{
  left:0;

  background:linear-gradient(
    90deg,
    #fff,
    rgba(255,255,255,0)
  );
}

.ticker::after{
  right:0;

  background:linear-gradient(
    270deg,
    #fff,
    rgba(255,255,255,0)
  );
}

.ticker-track{
  display:flex;

  width:max-content;

  animation:ticker 120s linear infinite;

  will-change:transform;
}

.ticker:hover .ticker-track{
  animation-play-state:paused;
}

.ref-item{
  width:190px;
  height:78px;

  margin-right:14px;

  display:grid;
  place-items:center;

  flex:none;

  border:1px solid var(--line);

  border-radius:10px;

  background:var(--white);

  color:#8997a5;

  font-size:13px;
  font-weight:800;

  transition:
    border .2s ease,
    transform .2s ease;
}

.ref-item:hover{
  transform:translateY(-2px);

  border-color:#b9c5cc;
}

@keyframes ticker{

  from{
    transform:translateX(0);
  }

  to{
    transform:translateX(-50%);
  }

}


/* ===================================================== */
/* BİLGİ MERKEZİ                                         */
/* ===================================================== */

.knowledge{
  padding-top:42px;
  padding-bottom:70px;
}

.knowledge-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);

  gap:14px;

  margin-top:28px;
}

.knowledge-grid a,
.knowledge-grid button{
  min-height:116px;

  padding:22px;

  text-align:left;

  border:1px solid var(--line);

  border-radius:12px;

  background:var(--white);

  color:var(--ink);

  cursor:pointer;

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

.knowledge-grid a:hover,
.knowledge-grid button:hover{
  transform:translateY(-3px);

  box-shadow:var(--shadow-sm);

  border-color:#bdc8cf;
}

.knowledge-grid b{
  font-size:14px;
}

.knowledge-grid span{
  display:block;

  margin-top:15px;

  font-size:12px;
  line-height:1.5;

  color:#607184;
}


/* ===================================================== */
/* HAKKIMIZDA                                            */
/* ===================================================== */

.about{
  margin-bottom:70px;

  padding-top:52px;
  padding-bottom:52px;

  display:grid;
  grid-template-columns:1fr 1fr;

  gap:60px;

  border-radius:var(--radius-md);

  background:var(--soft);
}

.about h2{
  margin:10px 0 0;

  font-size:33px;
  line-height:1.18;

  letter-spacing:-.04em;
}

.about p{
  margin:0;

  font-size:14px;
  line-height:1.85;

  color:#53667a;
}


/* ===================================================== */
/* CTA                                                   */
/* ===================================================== */

.cta{
  position:relative;

  overflow:hidden;

  background:
    linear-gradient(
      90deg,
      #05243a 0%,
      #0a493b 100%
    );

  color:var(--white);
}

.cta::before{
  content:"";

  position:absolute;
  inset:0;

  background:
    linear-gradient(
      120deg,
      transparent,
      rgba(255,255,255,.035)
    );
}

.cta-inner{
  position:relative;
  z-index:2;

  padding-top:46px;
  padding-bottom:46px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:35px;
}

.cta small{
  color:#d6e2e6;
}

.cta h2{
  margin:8px 0;

  font-size:37px;
  line-height:1.1;

  color:#76df7b;

  letter-spacing:-.035em;
}

.cta p{
  margin:0;

  color:#dbe6e5;
}


/* ===================================================== */
/* FOOTER                                                */
/* ===================================================== */

footer{
  padding:34px 0;

  border-top:1px solid var(--line);

  background:var(--white);
}

.footer-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:24px;

  font-size:12px;

  color:#5d6f82;
}

.footer-contact{
  display:flex;
  align-items:center;

  gap:9px;
}

.footer-contact a:hover{
  color:var(--green);
}


/* ===================================================== */
/* SABİT DESTEK BUTONU                                   */
/* ===================================================== */

.support-fab{
  position:fixed;

  top:54%;
  right:0;

  z-index:42;

  min-width:72px;

  padding:13px 11px;

  display:flex;
  flex-direction:column;
  align-items:center;

  gap:6px;

  border:0;

  border-radius:14px 0 0 14px;

  background:var(--green);

  color:var(--white);

  box-shadow:0 10px 28px rgba(0,0,0,.22);

  cursor:pointer;

  transition:
    transform .2s ease,
    background .2s ease;
}

.support-fab:hover{
  transform:translateX(-3px);

  background:var(--green-dark);
}

.support-fab-icon{
  font-size:19px !important;
}

.support-fab span{
  font-size:10px;
  line-height:1.25;
}


/* ===================================================== */
/* POPUP                                                 */
/* ===================================================== */

.modal-backdrop{
  position:fixed;
  inset:0;

  z-index:100;

  display:none;

  align-items:center;
  justify-content:center;

  padding:24px;

  background:rgba(3,19,35,.63);

  backdrop-filter:blur(5px);
}

.modal-backdrop.open{
  display:flex;
}

.modal{
  position:relative;

  width:min(690px,100%);
  max-height:90vh;

  overflow-y:auto;

  padding:30px;

  border-radius:20px;

  background:var(--white);

  box-shadow:
    0 30px 90px rgba(0,0,0,.36);

  animation:modalIn .26s ease;
}

@keyframes modalIn{

  from{
    opacity:0;
    transform:translateY(12px) scale(.98);
  }

  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }

}

.modal-close{
  position:absolute;

  top:13px;
  right:17px;

  width:38px;
  height:38px;

  display:grid;
  place-items:center;

  border:0;

  border-radius:50%;

  background:#f1f4f5;

  font-size:26px;

  color:#33475a;

  cursor:pointer;
}

.modal-title-row{
  display:flex;
  align-items:flex-start;

  gap:16px;

  padding-right:35px;
}

.modal-icon{
  font-size:34px;
}

.modal h2{
  margin:5px 0 0;

  font-size:29px;

  letter-spacing:-.035em;
}

.modal-title-row p{
  margin:6px 0 22px;

  font-size:13px;
  line-height:1.5;

  color:#637488;
}

.support-row{
  padding:18px 0;

  display:grid;
  grid-template-columns:1fr auto;

  align-items:center;

  gap:20px;

  border-top:1px solid var(--line);
}

.support-row h3{
  margin:0 0 6px;

  font-size:15px;
}

.support-row p{
  margin:0 0 8px;

  font-size:12px;
  line-height:1.55;

  color:#617286;
}

.support-row a{
  color:var(--green);

  font-size:12px;
  font-weight:800;
}

.deadline{
  padding:6px 10px;

  border-radius:999px;

  background:var(--danger);

  color:var(--white);

  font-size:10px;
  font-weight:800;

  white-space:nowrap;
}

.modal-all{
  display:block;

  margin-top:12px;

  padding:15px;

  text-align:center;

  border-radius:9px;

  background:var(--green);

  color:var(--white);

  font-size:13px;
  font-weight:800;
}


/* ===================================================== */
/* ALT SAYFALAR                                          */
/* ===================================================== */

.page{
  min-height:70vh;

  padding-top:68px;
  padding-bottom:85px;
}

.page h1{
  max-width:850px;

  margin:12px 0 25px;

  font-size:50px;

  letter-spacing:-.05em;
}

.page-card{
  max-width:880px;

  padding:30px;

  border-radius:16px;

  background:var(--soft);

  font-size:14px;
  line-height:1.75;
}

.page-card .badge{
  display:inline-block;

  padding:7px 11px;

  border-radius:999px;

  background:#e9f8ec;

  color:var(--green);

  font-size:11px;
  font-weight:800;
}


/* ===================================================== */
/* TABLET                                                */
/* ===================================================== */

@media(max-width:1100px){

  .nav{
    gap:15px;

    font-size:11px;
  }

  .hero h1{
    font-size:65px;
  }

}


/* ===================================================== */
/* MOBİL / TABLET                                        */
/* ===================================================== */

@media(max-width:960px){

  .topbar-inner{
    padding-left:22px;
    padding-right:22px;
  }

  .menu-toggle{
    display:block;
  }

  .nav{
    display:none;

    position:absolute;

    top:76px;
    left:0;
    right:0;

    padding:18px 26px 25px;

    flex-direction:column;
    align-items:flex-start;

    gap:0;

    background:rgba(255,255,255,.98);

    border-bottom:1px solid var(--line);

    box-shadow:0 15px 35px rgba(5,30,54,.08);
  }

  .nav.open{
    display:flex;
  }

  .nav a{
    width:100%;

    padding:12px 0;
  }

  .nav a::after{
    display:none;
  }

  .hero{
    min-height:535px;
  }

  .hero-content{
    padding-top:88px;
    padding-bottom:65px;
  }

  .hero h1{
    font-size:56px;
  }

  .hero-slogan{
    font-size:18px;
  }

  .stats{
    grid-template-columns:repeat(3,1fr);
  }

  .stats article:nth-child(3){
    border-right:0;
  }

  .focus-grid{
    grid-template-columns:1fr;
  }

  .focus-card{
    display:grid;
    grid-template-columns:38% 1fr;

    min-height:275px;
  }

  .visual-placeholder{
    height:100%;
  }

  .services{
    grid-template-columns:1fr;

    gap:32px;
  }

  .service-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .process-inner{
    grid-template-columns:1fr;

    gap:30px;
  }

  .knowledge-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .about{
    grid-template-columns:1fr;

    gap:25px;
  }

  .footer-inner{
    flex-direction:column;
    align-items:flex-start;
  }

}


/* ===================================================== */
/* TELEFON                                               */
/* ===================================================== */

@media(max-width:620px){

  .container{
    padding-left:18px;
    padding-right:18px;
  }

  .topbar{
    height:68px;
  }

  .topbar-inner{
    padding-left:18px;
    padding-right:18px;
  }

  .brand-mark{
    font-size:28px;
  }

  .nav{
    top:68px;
  }

  .hero{
    min-height:510px;
  }

  .hero-content{
    padding-top:70px;
    padding-bottom:55px;
  }

  .hero h1{
    font-size:45px;
  }

  .hero-slogan{
    font-size:16px;
  }

  .actions{
    flex-direction:column;

    align-items:flex-start;
  }

  .btn{
    width:100%;
  }

  .hero-points{
    margin-top:38px;

    gap:15px;

    flex-direction:column;
  }

  .stats{
    grid-template-columns:repeat(2,1fr);
  }

  .stats article{
    min-height:95px;
  }

  .stats article:nth-child(3){
    border-right:1px solid var(--line);
  }

  .stats article:nth-child(even){
    border-right:0;
  }

  .focus-card{
    display:flex;

    min-height:auto;
  }

  .visual-placeholder{
    height:160px;
  }

  .focus-card h2{
    font-size:27px;
  }

  .services{
    padding-top:58px;
    padding-bottom:58px;
  }

  .section-intro h2{
    font-size:32px;
  }

  .service-grid{
    grid-template-columns:1fr;
  }

  .process h2{
    font-size:30px;
  }

  .steps{
    padding-bottom:6px;
  }

  .ref-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .ref-head h2{
    font-size:31px;
  }

  .knowledge-grid{
    grid-template-columns:1fr;
  }

  .about{
    margin-left:0;
    margin-right:0;
    margin-bottom:0;

    border-radius:0;
  }

  .cta-inner{
    flex-direction:column;
    align-items:flex-start;
  }

  .cta h2{
    font-size:31px;
  }

  .support-fab{
    top:auto;
    bottom:18px;

    min-width:auto;

    padding:12px;
  }

  .support-fab span:not(.support-fab-icon){
    display:none;
  }

  .modal{
    padding:24px 20px;
  }

  .modal-title-row{
    gap:10px;
  }

  .modal h2{
    font-size:25px;
  }

  .support-row{
    grid-template-columns:1fr;
  }

  .deadline{
    justify-self:start;
  }

  .page h1{
    font-size:37px;
  }

}
/* ===================================================== */
/* 2KA2 ANA HERO GÖRSELİ - SAĞ METİN YERLEŞİMİ          */
/* ===================================================== */

.hero{
  min-height:590px;

  background-image:
    linear-gradient(
      270deg,
      rgba(3,18,34,.78) 0%,
      rgba(3,18,34,.58) 28%,
      rgba(3,18,34,.20) 52%,
      rgba(3,18,34,.00) 72%
    ),
    url("./assets/images/hero-2ka2-clean.png?v=10");

  background-size:cover;
background-position:left center;
  background-repeat:no-repeat;
}

.hero::before{
  background:none;
}

.hero-backdrop{
  opacity:.08;
}

.hero-content{
  padding-top:95px;
  padding-bottom:72px;

  display:flex;
  flex-direction:column;

  align-items:flex-end;

  text-align:left;
}

.hero-content .eyebrow,
.hero h1,
.hero-slogan,
.actions,
.hero-points{
  width:26%;
  max-width:480px;
}

.hero h1{
  margin:18px 0 14px;

  font-size:62px;
  line-height:.98;

  letter-spacing:-.05em;
}

.hero h1 span{
  color:var(--green-2);
}

.hero-slogan{
  margin-bottom:30px;

  font-size:18px;
  line-height:1.5;
}

.actions{
  display:flex;
  justify-content:flex-start;
  gap:14px;
}

.hero-points{
  margin-top:44px;

  display:grid;
  grid-template-columns:repeat(2,1fr);

  gap:14px 24px;

  font-size:12px;
}


/* TABLET */

@media(max-width:960px){

  .hero-content{
    align-items:flex-start;
  }

  .hero-content .eyebrow,
  .hero h1,
  .hero-slogan,
  .actions,
  .hero-points{
    width:58%;
  }

  .hero h1{
    font-size:52px;
  }

}


/* TELEFON */

@media(max-width:620px){

  .hero{
    min-height:520px;

    background-position:38% center;
  }

  .hero-content{
    padding-top:68px;

    align-items:flex-start;
  }

  .hero-content .eyebrow,
  .hero h1,
  .hero-slogan,
  .actions,
  .hero-points{
    width:100%;
    max-width:none;
  }

  .hero h1{
    font-size:43px;
  }

  .hero-points{
    grid-template-columns:1fr;
  }

}
/* ===================================================== */
/* 2KA2 - ANA UZMANLIK ALANLARI                          */
/* Savunma Sanayi / Yurtdışı / Destek                    */
/* ===================================================== */

.focus-showcase{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  padding-top:46px;
  padding-bottom:58px;
}


/* ANA BÜYÜK KARTLAR */

.feature{
  min-height:520px;
  border-radius:18px;
  overflow:hidden;
  position:relative;
  display:flex;
  flex-direction:column;
  color:#fff;
  background:#061a2f;
  box-shadow:0 14px 35px rgba(6,26,47,.10);
}


/* ÜST GÖRSEL ALANI */

.feature-visual{
  height:205px;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(
      circle at 70% 30%,
      rgba(64,160,104,.28),
      transparent 38%
    ),
    linear-gradient(
      135deg,
      #123b5d,
      #071d34 65%
    );
}

.feature-defense .feature-visual::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      120deg,
      transparent 0 52%,
      rgba(255,255,255,.045) 52% 53%,
      transparent 53% 100%
    );
}

.feature-global .feature-visual{
  background:
    radial-gradient(
      circle at 70% 35%,
      rgba(84,199,96,.32),
      transparent 35%
    ),
    linear-gradient(
      135deg,
      #0c304d,
      #07513e
    );
}


/* GÖRSEL ETİKETİ */

.feature-label{
  position:absolute;
  left:22px;
  bottom:20px;
  padding:8px 11px;
  border-radius:6px;
  background:rgba(3,18,34,.72);
  backdrop-filter:blur(7px);
  font-size:10px;
  font-weight:800;
  letter-spacing:.16em;
  color:#fff;
}


/* KART İÇERİĞİ */

.feature-content{
  flex:1;
  padding:28px 30px 30px;
  display:flex;
  flex-direction:column;
}

.feature-kicker{
  color:#66da72;
  font-size:11px;
  font-weight:800;
  letter-spacing:.16em;
}

.feature h2{
  margin:10px 0 13px;
  font-size:34px;
  line-height:1.05;
  letter-spacing:-.035em;
}

.feature p{
  margin:0;
  max-width:520px;
  font-size:14px;
  line-height:1.7;
  color:#d7e2e9;
}


/* ETİKETLER */

.feature-tags{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:20px;
}

.feature-tags span{
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.17);
  border-radius:99px;
  font-size:10px;
  color:#dbe7ec;
  background:rgba(255,255,255,.035);
}


/* ALT LİNK */

.feature-link{
  display:inline-block;
  margin-top:auto;
  padding-top:25px;
  color:#70df79;
  font-size:13px;
  font-weight:800;
}

.feature-link:hover{
  color:#9bed9f;
}


/* ===================================================== */
/* DESTEK / YATIRIM KARTI                                */
/* ===================================================== */

.feature-support{
  grid-column:1 / -1;

  min-height:230px;

  border-radius:18px;

  padding:38px 42px;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:50px;

  background:
    radial-gradient(
      circle at 85% 40%,
      rgba(76,200,91,.22),
      transparent 30%
    ),
    linear-gradient(
      100deg,
      #f3f7f7 0%,
      #edf5f0 60%,
      #e3f2e8 100%
    );

  border:1px solid #e1e9e5;
}

.feature-support h2{
  margin:9px 0 12px;
  font-size:35px;
  line-height:1.05;
  letter-spacing:-.035em;
  color:#071f3e;
}

.feature-support p{
  max-width:620px;
  margin:0;
  color:#53687a;
  font-size:14px;
  line-height:1.7;
}


/* DESTEK BUTONU */

.support-cta{
  min-width:245px;
  border:0;
  border-radius:10px;
  padding:17px 20px;

  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:25px;

  background:#198b38;
  color:#fff;

  font-size:13px;
  font-weight:800;

  cursor:pointer;

  box-shadow:0 10px 24px rgba(25,139,56,.20);

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

.support-cta:hover{
  transform:translateY(-2px);
  background:#147b30;
  box-shadow:0 14px 30px rgba(25,139,56,.26);
}

.support-cta span{
  font-size:19px;
}


/* ===================================================== */
/* RESPONSIVE                                            */
/* ===================================================== */

@media(max-width:960px){

  .focus-showcase{
    grid-template-columns:1fr;
  }

  .feature-support{
    grid-column:auto;
  }

  .feature{
    min-height:480px;
  }

  .feature-support{
    align-items:flex-start;
    flex-direction:column;
    gap:28px;
  }

}


@media(max-width:620px){

  .focus-showcase{
    padding-top:28px;
    padding-bottom:38px;
  }

  .feature{
    min-height:auto;
  }

  .feature-visual{
    height:175px;
  }

  .feature-content{
    padding:24px 21px 25px;
  }

  .feature h2{
    font-size:29px;
  }

  .feature-support{
    padding:29px 22px;
  }

  .feature-support h2{
    font-size:29px;
  }

  .support-cta{
    width:100%;
    min-width:0;
  }

}

/* ===================================================== */
/* SAVUNMA SANAYİ KART GÖRSELİ                           */
/* ===================================================== */

.feature-defense .feature-visual{
  background-image:
    linear-gradient(
      180deg,
      rgba(4,18,32,.06) 0%,
      rgba(4,18,32,.18) 100%
    ),
    url("./assets/images/defense-2ka2.png");

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}

/* ===================================================== */
/* YURTDIŞINA AÇILMA KART GÖRSELİ                        */
/* ===================================================== */

.feature-global .feature-visual{
  background-image:
    linear-gradient(
      180deg,
      rgba(4,18,32,.04) 0%,
      rgba(4,18,32,.16) 100%
    ),
    url("./assets/images/global-2ka2.png");

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}

/* ===================================================== */
/* HİZMET KARTLARI - MODERN HOVER                        */
/* ===================================================== */

.service-card{
  position:relative;
  overflow:hidden;
  min-height:165px;
  padding:22px;
  background:#f5f8f8;
  border:1px solid #e7edef;
  border-radius:14px;
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease,
    background .25s ease;
}

.service-card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:4px;
  background:#198b38;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s ease;
}

.service-card:hover{
  transform:translateY(-5px);
  background:#ffffff;
  border-color:#cfdadd;
  box-shadow:0 14px 34px rgba(6,26,47,.10);
}

.service-card:hover::before{
  transform:scaleX(1);
}

.service-card small{
  display:block;
  color:#198b38;
  font-size:11px;
  font-weight:800;
}

.service-card b{
  display:block;
  margin-top:16px;
  font-size:15px;
  line-height:1.35;
  color:#071f3e;
}

.service-card-detail{
  margin-top:13px;
  opacity:0;
  transform:translateY(8px);
  max-height:0;
  overflow:hidden;
  transition:
    opacity .25s ease,
    transform .25s ease,
    max-height .3s ease;
}

.service-card-detail p{
  margin:0 0 10px;
  font-size:12px;
  line-height:1.55;
  color:#617286;
}

.service-card-detail span{
  color:#198b38;
  font-size:12px;
  font-weight:800;
}

.service-card:hover .service-card-detail{
  opacity:1;
  transform:translateY(0);
  max-height:100px;
}


/* MOBİLDE HOVER OLMADIĞI İÇİN AÇIK GÖSTER */

@media(max-width:620px){

  .service-card-detail{
    opacity:1;
    transform:none;
    max-height:100px;
  }

}

/* ===================================================== */
/* 2KA2 - ÇALIŞMA MODELİ / SÜREÇ BANDI                   */
/* ===================================================== */

.process{
  padding:72px 0;
  background:
    linear-gradient(135deg,#061a2f 0%,#07343b 58%,#064636 100%);
  color:#fff;
}

.process-inner{
  display:grid;
  grid-template-columns:330px 1fr;
  gap:70px;
  align-items:center;
}

.process-heading h2{
  margin:12px 0 18px;
  font-size:42px;
  line-height:1.08;
  color:#fff;
}

.process-heading p{
  margin:0;
  max-width:420px;
  font-size:15px;
  line-height:1.65;
  color:rgba(255,255,255,.78);
}

.process-flow{
  display:grid;
  grid-template-columns:
    1fr auto
    1fr auto
    1fr auto
    1fr auto
    1fr auto
    1fr auto
    1fr;
  align-items:center;
  gap:12px;
}

.process-step{
  min-height:116px;
  padding:20px 16px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:14px;
  background:rgba(255,255,255,.05);
  display:flex;
  flex-direction:column;
  justify-content:center;
  transition:
    transform .25s ease,
    background .25s ease,
    border-color .25s ease;
}

.process-step small{
  display:block;
  margin-bottom:9px;
  color:#55c760;
  font-size:11px;
  font-weight:800;
  letter-spacing:1px;
}

.process-step span{
  color:#fff;
  font-size:14px;
  font-weight:700;
  line-height:1.25;
}

.process-flow > i{
  color:rgba(255,255,255,.40);
  font-size:18px;
  font-style:normal;
}

.process-step:hover{
  transform:translateY(-5px);
  background:rgba(255,255,255,.09);
  border-color:rgba(85,199,96,.45);
}

.process-step-final{
  background:#198b38;
  border-color:#198b38;
}

.process-step-final small{
  color:#dff7e4;
}

.process-step-final:hover{
  background:#21a244;
}


/* TABLET */

@media(max-width:1200px){

  .process-inner{
    grid-template-columns:1fr;
    gap:38px;
  }

  .process-flow{
    grid-template-columns:
      1fr auto
      1fr auto
      1fr auto
      1fr;
  }

}


/* MOBİL */

@media(max-width:760px){

  .process{
    padding:55px 0;
  }

  .process-heading h2{
    font-size:34px;
  }

  .process-flow{
    display:flex;
    flex-direction:column;
    align-items:stretch;
  }

  .process-flow > i{
    text-align:center;
    transform:rotate(90deg);
  }

  .process-step{
    min-height:auto;
  }

}

/* ===================================================== */
/* 2KA2 - REFERANSLAR KAYAN BANT                         */
/* ===================================================== */

.ticker{
  position:relative;
  overflow:hidden;
  padding:18px 0;
  background:#ffffff;
  border-top:1px solid #edf1f2;
  border-bottom:1px solid #edf1f2;
}

.ticker::before,
.ticker::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:120px;
  z-index:2;
  pointer-events:none;
}

.ticker::before{
  left:0;
  background:linear-gradient(
    90deg,
    #ffffff 0%,
    rgba(255,255,255,0) 100%
  );
}

.ticker::after{
  right:0;
  background:linear-gradient(
    270deg,
    #ffffff 0%,
    rgba(255,255,255,0) 100%
  );
}

.ticker-track{
  display:flex;
  align-items:center;
  width:max-content;
  animation:referenceTicker 120s linear infinite;
}

.ref-item{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:max-content;
  padding:0 34px;
  color:#607080;
  font-size:13px;
  font-weight:700;
  letter-spacing:.2px;
  white-space:nowrap;
}

.ref-item::after{
  content:"•";
  position:absolute;
  right:-2px;
  color:#198b38;
  font-size:17px;
}

.ticker:hover .ticker-track{
  animation-play-state:paused;
}

@keyframes referenceTicker{
  from{
    transform:translateX(0);
  }

  to{
    transform:translateX(-50%);
  }
}

@media(max-width:760px){

  .ticker{
    padding:15px 0;
  }

  .ref-item{
    padding:0 24px;
    font-size:12px;
  }

  .ticker::before,
  .ticker::after{
    width:55px;
  }

}

/* ===================================================== */
/* REFERANS LOGOLARI - SON DÜZEN                         */
/* ===================================================== */

.ticker{
  position:relative;
  overflow-x:auto !important;
  overflow-y:hidden;
  padding:18px 0;
  cursor:grab;
  scrollbar-width:none;
  scroll-behavior:auto;
}

.ticker::-webkit-scrollbar{
  display:none;
}

.ticker.is-dragging{
  cursor:grabbing;
  user-select:none;
}

.ticker-track{
  display:flex;
  align-items:center;
  gap:18px;
  width:max-content;

  /* eski otomatik CSS animasyonunu kapatıyoruz */
  animation:none !important;

  padding:4px 35px;
}

.ref-item{
  flex:0 0 220px;
  width:220px;
  height:110px;

  display:flex;
  align-items:center;
  justify-content:center;

  padding:15px;

  background:#ffffff;
  border:1px solid #dfe6ea;
  border-radius:13px;

  box-sizing:border-box;
}

.ref-item::after{
  display:none !important;
}

.ref-item img{
  display:block;

  width:100%;
  height:100%;

  max-width:240px;
  max-height:140px;

  object-fit:contain;
  object-position:center;

  transform:scale(1.85);

  pointer-events:none;
  user-select:none;
}

/* ===================================================== */
/* BİLGİ MERKEZİ - MODERN KARTLAR                        */
/* ===================================================== */

.knowledge{
  padding-top:72px;
  padding-bottom:72px;
}

.knowledge-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  margin-top:34px;
}

.knowledge-card{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  min-height:265px;
  padding:28px;
  background:#ffffff;
  border:1px solid #dfe6ea;
  border-radius:16px;
  text-decoration:none;
  color:#071f3e;
  overflow:hidden;
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease;
}

button.knowledge-card{
  width:100%;
  font:inherit;
  text-align:left;
  cursor:pointer;
}

.knowledge-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:4px;
  background:#198b38;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s ease;
}

.knowledge-card small{
  display:block;
  margin-bottom:18px;
  color:#198b38;
  font-size:12px;
  font-weight:800;
  letter-spacing:.8px;
}

.knowledge-card-icon{
  width:42px;
  height:42px;
  margin-bottom:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background:#edf7ef;
  color:#198b38;
  font-size:20px;
  font-weight:800;
}

.knowledge-card b{
  display:block;
  margin-bottom:14px;
  font-size:17px;
  line-height:1.3;
  color:#071f3e;
}

.knowledge-card p{
  margin:0 0 22px;
  color:#617286;
  font-size:13px;
  line-height:1.6;
}

.knowledge-card span{
  margin-top:auto;
  color:#198b38;
  font-size:12px;
  font-weight:800;
}

.knowledge-card:hover{
  transform:translateY(-6px);
  border-color:#cfe0d3;
  box-shadow:0 18px 40px rgba(5,30,54,.10);
}

.knowledge-card:hover::before{
  transform:scaleX(1);
}

@media(max-width:1000px){

  .knowledge-grid{
    grid-template-columns:repeat(2,1fr);
  }

}

@media(max-width:620px){

  .knowledge-grid{
    grid-template-columns:1fr;
  }

}

/* ===================================================== */
/* 2KA2 GÜNCEL BİLGİ - ABONELİK                          */
/* ===================================================== */

.newsletter{
  padding:70px 0;
  background:#f4f8f5;
}

.newsletter-inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  align-items:center;
}

.newsletter-text h2{
  margin:12px 0 16px;
  font-size:38px;
  line-height:1.1;
  color:#071f3e;
}

.newsletter-text p{
  max-width:520px;
  color:#617286;
  line-height:1.65;
}

.newsletter-form{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.newsletter-form input[type="text"],
.newsletter-form input[type="email"]{
  width:100%;
  padding:15px 16px;
  border:1px solid #dfe6ea;
  border-radius:10px;
  font:inherit;
  background:#fff;
}

.newsletter-topics{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 20px;
  margin:8px 0;
}

.newsletter-topics label,
.newsletter-consent{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:#40566b;
}

.newsletter-form button{
  margin-top:8px;
  padding:15px 22px;
  border:0;
  border-radius:10px;
  background:#198b38;
  color:#fff;
  font-weight:800;
  cursor:pointer;
}

.newsletter-form button:hover{
  background:#14752f;
}

@media(max-width:800px){

  .newsletter-inner{
    grid-template-columns:1fr;
    gap:35px;
  }

  .newsletter-topics{
    grid-template-columns:1fr;
  }

}

/* ===================================================== */
/* 2KA2 - FOOTER                                         */
/* ===================================================== */

.site-footer{
  background:#071f3e;
  color:#ffffff;
  padding-top:58px;
}

.footer-main{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:48px;
  padding-bottom:46px;
}

.footer-brand .brand{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

.footer-brand .brand-mark{
  font-size:30px;
  font-weight:900;
  line-height:1;
  color:#ffffff;
}

.footer-brand .brand-mark::first-letter{
  color:#198b38;
}

.footer-brand .brand-note{
  margin-top:8px;
  font-size:11px;
  color:rgba(255,255,255,.58);
}

.footer-brand p{
  margin:22px 0 0;
  max-width:340px;
  font-size:13px;
  line-height:1.7;
  color:rgba(255,255,255,.68);
}

.footer-column{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.footer-column h4{
  margin:0 0 8px;
  color:#55c760;
  font-size:13px;
  font-weight:800;
  letter-spacing:.4px;
}

.footer-column a{
  color:rgba(255,255,255,.76);
  text-decoration:none;
  font-size:13px;
  line-height:1.45;
  transition:color .2s ease;
}

.footer-column a:hover{
  color:#ffffff;
}

.footer-contact-info p{
  margin:4px 0 0;
  font-size:13px;
  color:rgba(255,255,255,.64);
}

.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);
}

.footer-bottom-inner{
  min-height:64px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.footer-bottom-inner > span{
  color:rgba(255,255,255,.52);
  font-size:12px;
}

.footer-legal{
  display:flex;
  align-items:center;
  gap:20px;
}

.footer-legal a{
  color:rgba(255,255,255,.56);
  text-decoration:none;
  font-size:12px;
}

.footer-legal a:hover{
  color:#ffffff;
}

@media(max-width:1000px){

  .footer-main{
    grid-template-columns:1fr 1fr;
  }

}

@media(max-width:620px){

  .site-footer{
    padding-top:42px;
  }

  .footer-main{
    grid-template-columns:1fr;
    gap:32px;
  }

  .footer-bottom-inner{
    flex-direction:column;
    align-items:flex-start;
    padding-top:18px;
    padding-bottom:18px;
  }

  .footer-legal{
    flex-wrap:wrap;
  }

}


/* ===================================================== */
/* 2KA2 - HERO SON AYAR                                  */
/* Görsel tam genişlik / sağda gri panel yok / yazı üstte*/
/* ===================================================== */

.hero{
  min-height:590px;

  background-image:
    linear-gradient(
      90deg,
      rgba(3,18,34,0) 0%,
      rgba(3,18,34,0) 52%,
      rgba(3,18,34,.12) 63%,
      rgba(3,18,34,.48) 78%,
      rgba(3,18,34,.68) 100%
    ),
    url("./assets/images/hero-2ka2-clean.png?v=12");

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  background-color:#061a2f;
}

.hero::before{
  background:none;
}

.hero-backdrop{
  opacity:.05;
}

.hero-content{
  padding-top:88px;
  padding-bottom:68px;

  display:flex;
  flex-direction:column;
  align-items:flex-end;

  text-align:left;
}

.hero-content .eyebrow,
.hero h1,
.hero-slogan,
.actions,
.hero-points{
  width:31%;
  max-width:500px;
}

.hero h1{
  margin:16px 0 12px;

  font-size:58px;
  line-height:.98;
  letter-spacing:-.05em;
}

.hero-slogan{
  margin-bottom:27px;

  font-size:17px;
  line-height:1.5;
}

.actions{
  display:flex;
  justify-content:flex-start;
  gap:12px;
}

.hero-points{
  margin-top:36px;

  display:grid;
  grid-template-columns:repeat(2,1fr);

  gap:13px 20px;

  font-size:11px;
}


/* TABLET */

@media(max-width:960px){

  .hero{
    min-height:535px;

    background-image:
      linear-gradient(
        90deg,
        rgba(3,18,34,.08) 0%,
        rgba(3,18,34,.12) 30%,
        rgba(3,18,34,.62) 72%,
        rgba(3,18,34,.80) 100%
      ),
      url("./assets/images/hero-2ka2-clean.png?v=12");

    background-position:center center;
  }

  .hero-content{
    padding-top:78px;
    padding-bottom:58px;

    align-items:flex-end;
  }

  .hero-content .eyebrow,
  .hero h1,
  .hero-slogan,
  .actions,
  .hero-points{
    width:45%;
    max-width:460px;
  }

  .hero h1{
    font-size:48px;
  }

}


/* TELEFON */

@media(max-width:620px){

  .hero{
    min-height:560px;

    background-image:
      linear-gradient(
        180deg,
        rgba(3,18,34,.18) 0%,
        rgba(3,18,34,.40) 42%,
        rgba(3,18,34,.84) 100%
      ),
      url("./assets/images/hero-2ka2-clean.png?v=12");

    background-size:cover;
    background-position:38% center;
  }

  .hero-content{
    min-height:560px;

    padding-top:220px;
    padding-bottom:44px;

    align-items:flex-start;
    justify-content:flex-end;
  }

  .hero-content .eyebrow,
  .hero h1,
  .hero-slogan,
  .actions,
  .hero-points{
    width:100%;
    max-width:none;
  }

  .hero h1{
    font-size:42px;
  }

  .hero-slogan{
    font-size:15px;
  }

  .hero-points{
    grid-template-columns:1fr 1fr;
    gap:10px 14px;
    margin-top:26px;
  }

}

/* ===================================================== */
/* 2KA2 HERO SLIDER - SON SİSTEM                         */
/* 4 KAYAN GÖRSEL + SABİT İNSAN + SABİT SAĞ İÇERİK       */
/* ===================================================== */

.hero-slider{
  position:relative;
  width:100%;
  height:590px;
  min-height:590px;
  overflow:hidden;
  background:#061a2f;
  color:#fff;
}


/* ===================================================== */
/* KAYAN ARKA PLANLAR                                    */
/* ===================================================== */

.hero-slides{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
}

.hero-slide{
  position:absolute;
  top:0;
  left:0;

  width:100%;
  height:100%;

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;

  opacity:0;

  transform:translateX(-100%);

  transition:
    transform 1.15s cubic-bezier(.65,0,.35,1),
    opacity .9s ease;
}


/* AKTİF GÖRSEL */

.hero-slide.active{
  opacity:1;
  transform:translateX(0);
  z-index:2;
}


/* EKRANDAN SAĞA ÇIKAN GÖRSEL */

.hero-slide.slide-out{
  opacity:0;
  transform:translateX(100%);
  z-index:1;
}


/* ===================================================== */
/* SAĞ TARAF OKUNABİLİRLİK                               */
/* ===================================================== */

.hero-slider::after{
  content:"";

  position:absolute;
  inset:0;

  z-index:3;

  pointer-events:none;

  background:
    linear-gradient(
      90deg,
      rgba(3,18,34,0) 0%,
      rgba(3,18,34,0) 50%,
      rgba(3,18,34,.10) 58%,
      rgba(3,18,34,.42) 72%,
      rgba(3,18,34,.74) 100%
    );
}


/* ESKİ HERO KATMANINI KAPAT */

.hero-backdrop{
  display:none !important;
}

.hero-slider::before{
  display:none !important;
}


/* ===================================================== */
/* SABİT İNSAN                                           */
/* ===================================================== */

.hero-person-wrap{
  position:absolute;

  left:max(
    20px,
    calc((100vw - 1220px) / 2)
  );

  bottom:0;

  z-index:5;

  height:86%;

  display:flex;
  align-items:flex-end;

  pointer-events:none;
}

.hero-person{
  display:block;

  width:auto;
  height:100%;

  max-width:none;

  object-fit:contain;
  object-position:left bottom;

  pointer-events:none;
  user-select:none;

  filter:
    drop-shadow(
      8px 8px 14px rgba(0,0,0,.16)
    );
}


/* ===================================================== */
/* SAĞ YAZI ALANI                                        */
/* ===================================================== */

.hero-slider .hero-content{
  position:relative;

  z-index:6;

  height:100%;

  padding-top:0;
  padding-bottom:0;

  display:flex;
  align-items:center;
  justify-content:flex-end;

  pointer-events:none;
}

.hero-copy{
  width:34%;
  max-width:500px;

  padding:55px 0 18px;

  margin-right:-18px;

  transform:translateX(70px);

  pointer-events:auto;
}


.hero-slider .hero-copy .eyebrow{
  width:100%;
  max-width:none;

  margin:0;

  color:#dce8ef;

  font-size:11px;
  font-weight:800;

  letter-spacing:.15em;
}


.hero-slider .hero-copy h1{
  width:100%;
  max-width:none;

  margin:16px 0 15px;

  font-size:54px;
  line-height:.98;

  letter-spacing:-.05em;

  color:#fff;
}


.hero-slider .hero-copy h1 span{
  color:#55c760;
}


.hero-slider .hero-copy .hero-slogan{
  width:100%;
  max-width:470px;

  margin:0 0 26px;

  font-size:16px;
  line-height:1.55;

  color:rgba(255,255,255,.88);
}


/* ===================================================== */
/* HERO BUTONLARI                                        */
/* ===================================================== */

.hero-slider .actions{
  width:100%;
  max-width:none;

  display:flex;
  flex-wrap:wrap;

  justify-content:flex-start;

  gap:12px;
}


.hero-slider .btn{
  min-height:48px;

  padding:0 19px;

  font-size:13px;
}


/* ===================================================== */
/* HERO ALT ÖZELLİKLER                                   */
/* ===================================================== */

.hero-slider .hero-points{
  width:100%;
  max-width:none;

  margin-top:31px;

  display:grid;
  grid-template-columns:1fr 1fr;

  gap:12px 18px;

  font-size:11px;

  color:rgba(255,255,255,.82);
}


.hero-slider .hero-points span{
  display:block;
}


/* ===================================================== */
/* SLIDER NOKTALARI                                      */
/* ===================================================== */

.hero-dots{
  display:flex;
  align-items:center;

  gap:9px;

  margin-top:25px;
}


.hero-dot{
  width:8px;
  height:8px;

  padding:0;

  border:0;

  border-radius:50%;

  background:rgba(255,255,255,.52);

  cursor:pointer;

  transition:
    width .25s ease,
    border-radius .25s ease,
    background .25s ease;
}


.hero-dot.active{
  width:26px;

  border-radius:999px;

  background:#55c760;
}


/* ===================================================== */
/* TABLET                                                */
/* ===================================================== */

@media(max-width:960px){

  .hero-slider{
    height:555px;
    min-height:555px;
  }

  .hero-person-wrap{
    left:10px;

    height:80%;
  }

  .hero-copy{
    width:48%;
    max-width:430px;
  }

  .hero-slider .hero-copy h1{
    font-size:44px;
  }

  .hero-slider .hero-copy .hero-slogan{
    font-size:14px;
  }

}


/* ===================================================== */
/* TELEFON                                               */
/* ===================================================== */

@media(max-width:620px){

  .hero-slider{
    height:650px;
    min-height:650px;
  }

  .hero-slide{
    background-position:center center;
  }


  .hero-slider::after{
    background:
      linear-gradient(
        180deg,
        rgba(3,18,34,.03) 0%,
        rgba(3,18,34,.12) 38%,
        rgba(3,18,34,.85) 70%,
        rgba(3,18,34,.95) 100%
      );
  }


  .hero-person-wrap{
    left:50%;

    transform:translateX(-50%);

    bottom:215px;

    height:58%;
  }


  .hero-slider .hero-content{
    align-items:flex-end;
    justify-content:flex-start;

    padding-bottom:27px;
  }


  .hero-copy{
    width:100%;
    max-width:none;

    padding:0;
  }


  .hero-slider .hero-copy .eyebrow{
    font-size:9px;
  }


  .hero-slider .hero-copy h1{
    margin-top:10px;

    font-size:36px;
  }


  .hero-slider .hero-copy .hero-slogan{
    margin-bottom:18px;

    font-size:13px;
  }


  .hero-slider .actions{
    flex-direction:row;
  }


  .hero-slider .btn{
    width:auto;

    min-height:43px;

    padding:0 13px;

    font-size:11px;
  }


  .hero-slider .hero-points{
    display:none;
  }


  .hero-dots{
    margin-top:18px;
  }

}

/* ===================================================== */
/* 2KA2 - SÜREÇ ANİMASYONU / SON                         */
/* ===================================================== */

.process-step,
.process-flow > i{
  opacity:0;
  transform:translateX(-24px) scale(.94);

  transition:
    opacity .55s ease,
    transform .55s cubic-bezier(.2,.8,.2,1);
}

.process-step.process-visible,
.process-flow > i.process-visible{
  opacity:1;
  transform:translateX(0) scale(1);
}

/* Oklar biraz daha belirgin gelsin */
.process-flow > i{
  transition-duration:.35s;
}

/* Sonuç kutusu final vurgusu */
.process-step-final.process-visible{
  animation:processFinal .85s ease .15s both;
}

@keyframes processFinal{

  0%{
    transform:scale(.92);
  }

  55%{
    transform:scale(1.08);
  }

  100%{
    transform:scale(1);
  }

}

/* ===================================================== */
/* 2KA2 - SÜREÇ KÜÇÜK AÇIKLAMALAR                       */
/* ===================================================== */

.process-step{
  min-height:108px;
  padding:14px 12px;
}

.process-step span{
  display:block;
  margin-top:6px;
}

.process-step p{
  margin:8px 0 0;

  max-width:115px;

  font-size:11px;
  line-height:1.35;

  color:rgba(255,255,255,.58);

  font-style:normal;
}

.process-step-final p{
  color:rgba(255,255,255,.82);
}