/* =========================================================
   home.css — Anasayfa bölümleri
   ========================================================= */

/* ---------- HERO SLIDER ---------- */
.hero-slider{
  position:relative;
  height: 850px;
  max-height: 92vh;
  min-height: 560px;
  overflow:hidden;
  background: var(--black);
}

.hero-slide{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transition: opacity 1.2s ease;
  display:flex;
  align-items:center;
}
.hero-slide.active{ opacity:1; visibility:visible; z-index:2; }

.hero-slide .slide-bg{
  position:absolute; inset:0;
  background-size:cover;
  background-position:center;
}
.hero-slide .slide-bg::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(10,10,10,.88) 0%, rgba(10,10,10,.6) 45%, rgba(10,10,10,.25) 100%);
}

.hero-slide.active .slide-bg{ animation: kenburns 8s ease forwards; }
@keyframes kenburns{
  from{ transform: scale(1); }
  to{ transform: scale(1.08); }
}

.hero-content{
  position:relative;
  z-index:3;
  color:#fff;
  max-width: 640px;
  padding: 0 24px;
  margin-left: max(24px, calc((100vw - 1240px)/2));
}

.hero-content .eyebrow{ color: var(--gold-light); }
.hero-content h1{ color:#fff; margin-bottom:20px; }
.hero-content h1 .accent{ color: var(--gold); }
.hero-content p{ color: rgba(255,255,255,.82); font-size:1.05rem; max-width:480px; margin-bottom:34px; }

.hero-buttons{ display:flex; gap:16px; flex-wrap:wrap; }

.slider-dots{
  position:absolute;
  bottom: 34px;
  left:50%;
  transform: translateX(-50%);
  display:flex;
  gap:10px;
  z-index:4;
}
.slider-dots button{
  width:10px; height:10px;
  border-radius:50%;
  background: rgba(255,255,255,.4);
  transition: var(--transition);
}
.slider-dots button.active{ background: var(--gold); width:28px; border-radius:6px; }

.slider-arrows{
  position:absolute;
  bottom:34px;
  right: max(24px, calc((100vw - 1240px)/2));
  display:flex;
  gap:10px;
  z-index:4;
}
.slider-arrows button{
  width:44px; height:44px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.35);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  transition: var(--transition);
}
.slider-arrows button:hover{ background: var(--gold); border-color:var(--gold); }

/* ---------- KURUMSAL TANITIM ---------- */
.intro-section{ padding: 110px 0; }
.intro-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 70px;
  align-items:center;
}
.intro-list{ display:grid; grid-template-columns: 1fr 1fr; gap:14px; margin: 30px 0 34px; }
.intro-list li{
  display:flex; align-items:center; gap:10px;
  font-family: var(--font-button);
  font-size:.9rem;
  font-weight:600;
  color: var(--black);
}
.intro-list li i{ color: var(--gold); }

.intro-media{ position:relative; }
.intro-media .frame{
  position:relative;
  clip-path: polygon(12% 0, 100% 0, 100% 88%, 88% 100%, 0 100%, 0 12%);
  overflow:hidden;
  aspect-ratio: 4/4.6;
  background: linear-gradient(150deg, #1b1b1b 0%, #111 55%, #000 100%);
  box-shadow: var(--shadow-strong);
}
.intro-media .frame img{
  width:100%; height:100%;
  object-fit: cover;
}
.intro-media .frame .mark{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:16px;
}
.intro-media .frame .mark .hex{
  width:120px; height:120px;
  border:2px solid var(--gold);
  clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-heading); font-weight:700; color:var(--gold); font-size:1.8rem;
}
.intro-media .frame .mark .label{
  font-family: var(--font-heading);
  color:#fff; letter-spacing:2px; font-size:1.1rem; text-align:center;
}
.intro-media .frame .label small{
  display:block; font-family: var(--font-button); color: var(--gold-light);
  font-size:.7rem; letter-spacing:3px; margin-top:6px;
}
.intro-media .badge{
  position:absolute;
  bottom:-24px; left:-24px;
  background: var(--gold);
  color:#fff;
  padding:20px 26px;
  box-shadow: var(--shadow-strong);
}
.intro-media .badge .num{ font-family: var(--font-heading); font-weight:700; font-size:1.8rem; display:block; }
.intro-media .badge .txt{ font-family: var(--font-button); font-size:.72rem; letter-spacing:1px; text-transform:uppercase; }

/* ---------- HİZMETLER (grid) ---------- */
.services-section{ padding: 110px 0; }
.services-grid{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 22px;
}
.service-card{
  background: var(--white);
  border: 1px solid #ececec;
  border-radius: 6px;
  padding: 40px 26px;
  text-align:center;
  transition: var(--transition);
  position:relative;
  overflow:hidden;
}
.service-card::before{
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height:3px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin:left;
  transition: transform .35s ease;
}
.service-card:hover{ transform: translateY(-10px); box-shadow: var(--shadow-soft); border-color: transparent; }
.service-card:hover::before{ transform: scaleX(1); }

.service-icon{
  width:76px; height:76px;
  margin: 0 auto 22px;
  border-radius:50%;
  background: var(--gray-light);
  display:flex; align-items:center; justify-content:center;
  font-size:1.7rem;
  color: var(--gold-dark);
  transition: var(--transition);
}
.service-card:hover .service-icon{ background: var(--gold); color:#fff; transform: scale(1.08); }

.service-card h3{ margin-bottom:12px; font-size:1.05rem; }
.service-card p{ font-size:.88rem; margin-bottom:18px; }
.service-link{
  font-family: var(--font-button);
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.5px;
  text-transform:uppercase;
  color: var(--gold-dark);
  display:inline-flex; align-items:center; gap:6px;
}

/* ---------- NEDEN BİZ ---------- */
.why-section{ padding:110px 0; background: var(--gray-light); }
.why-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.why-card{
  background: var(--white);
  padding: 34px 28px;
  border-radius:6px;
  display:flex;
  align-items:flex-start;
  gap:18px;
  transition: var(--transition);
}
.why-card:hover{ box-shadow: var(--shadow-soft); transform: translateY(-6px); }
.why-card i{
  width:50px; height:50px; flex:0 0 auto;
  border-radius:10px;
  background: var(--black);
  color: var(--gold);
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem;
}
.why-card h3{ font-size:1rem; margin-bottom:6px; }
.why-card p{ font-size:.86rem; }

/* ---------- İSTATİSTİKLER ---------- */
.stats-section{
  background: var(--black);
  padding: 70px 0;
}
.stats-grid{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  text-align:center;
}
.stat-item{
  border-right: 1px solid rgba(255,255,255,.1);
  padding: 10px 12px;
}
.stat-item:last-child{ border-right:none; }
.stat-item i{ color: var(--gold); font-size:1.8rem; margin-bottom:14px; display:inline-block; }
.stat-num{
  font-family: var(--font-heading);
  font-weight:700;
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  color:#fff;
  display:block;
}
.stat-label{
  font-family: var(--font-button);
  font-size:.8rem;
  letter-spacing:.5px;
  color: rgba(255,255,255,.6);
  text-transform:uppercase;
  margin-top:6px;
}

/* ---------- REFERANSLAR ---------- */
.refs-section{ padding: 90px 0; overflow:hidden; }
.refs-track{
  display:flex;
  gap: 50px;
  width: max-content;
  animation: scrollRefs 26s linear infinite;
}
.refs-section:hover .refs-track{ animation-play-state: paused; }
@keyframes scrollRefs{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}
.ref-logo{
  width:150px; height:80px;
  border:1px solid #ececec;
  border-radius:6px;
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-heading);
  font-weight:700;
  color: var(--gray-dark);
  filter: grayscale(1);
  opacity:.6;
  transition: var(--transition);
  flex: 0 0 auto;
}
.ref-logo:hover{ filter:grayscale(0); opacity:1; border-color: var(--gold); color: var(--gold-dark); transform: translateY(-4px); }

/* ---------- ÇALIŞMA SÜRECİ ---------- */
.process-section{ padding: 110px 0; background: var(--gray-light); }
.process-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  position:relative;
}
.process-step{
  text-align:center;
  padding: 0 20px;
  position:relative;
  z-index:2;
}
.process-step .step-num{
  width:74px; height:74px;
  margin:0 auto 22px;
  border-radius:50%;
  background: var(--gray-light);
  border:2px solid var(--gold);
  box-shadow:0 0 0 12px var(--gray-light);
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-heading);
  font-weight:700;
  font-size:1.4rem;
  color: var(--gold-dark);
  position:relative;
  z-index:3;
}
.process-step h3{ font-size:1rem; margin-bottom:8px; }
.process-step p{ font-size:.85rem; }
.process-grid::before{
  content:"";
  position:absolute;
  top:37px; left:12%; right:12%;
  height:2px;
  background: repeating-linear-gradient(90deg, var(--gold) 0 10px, transparent 10px 18px);
  z-index:0;
}

/* ---------- MÜŞTERİ YORUMLARI ---------- */
.testimonials-section{ padding: 110px 0; }
.testimonial-track{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
}
.testimonial-card{
  background: var(--white);
  border:1px solid #ececec;
  border-radius:8px;
  padding: 34px;
  transition: var(--transition);
}
.testimonial-card:hover{ box-shadow: var(--shadow-soft); }
.testimonial-stars{ color: var(--gold); margin-bottom:16px; font-size:.9rem; letter-spacing:2px; }
.testimonial-text{ font-size:.92rem; font-style:italic; margin-bottom:24px; }
.testimonial-person{ display:flex; align-items:center; gap:14px; }
.testimonial-avatar{
  width:50px; height:50px; border-radius:50%;
  background: var(--gray-light);
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-heading); font-weight:700; color: var(--gold-dark);
}
.testimonial-person .name{ font-weight:700; color:var(--black); font-size:.92rem; font-family: var(--font-heading); }
.testimonial-person .role{ font-size:.78rem; color: var(--gold-dark); }

/* ---------- İLETİŞİM BÖLÜMÜ (anasayfa) ---------- */
.home-contact-section{ padding: 110px 0; background: var(--gray-light); }
.home-contact-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items:stretch;
}
.map-embed{
  border-radius: 8px;
  overflow:hidden;
  min-height: 100%;
  box-shadow: var(--shadow-soft);
}
.map-embed iframe{ width:100%; height:100%; min-height:420px; border:0; }

/* ---------- Responsive homepage ---------- */
@media (max-width: 1080px){
  .services-grid{ grid-template-columns: repeat(3, 1fr); }
  .stats-grid{ grid-template-columns: repeat(3, 1fr); }
  .stat-item:nth-child(3){ border-right:none; }
  .process-grid{ grid-template-columns: repeat(2, 1fr); gap: 50px 0; }
  .process-grid::before{ display:none; }
  .testimonial-track{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 768px){
  .intro-grid{ grid-template-columns: 1fr; }
  .intro-media{ order:-1; }
  .services-grid{ grid-template-columns: repeat(2, 1fr); }
  .why-grid{ grid-template-columns: 1fr; }
  .stats-grid{ grid-template-columns: repeat(2, 1fr); }
  .stat-item:nth-child(3){ border-right:1px solid rgba(255,255,255,.1); }
  .home-contact-grid{ grid-template-columns: 1fr; }
  .testimonial-track{ grid-template-columns: 1fr; }
  .hero-content{ margin-left:0; text-align:left; }
}
@media (max-width: 520px){
  .services-grid{ grid-template-columns: 1fr; }
  .stats-grid{ grid-template-columns: repeat(2,1fr); }
  .stat-item{ border-right:none !important; border-bottom:1px solid rgba(255,255,255,.1); padding-bottom:20px; }
  .intro-list{ grid-template-columns: 1fr; }
}
