/* OKTO Ajans — Erkan'ın tasarım revizeleri, parça parça buraya eklenecek.
   Bu dosya tüm diğer CSS'lerden SONRA yükleniyor (bkz. layouts/app.blade.php),
   kasıtlı olarak override amaçlı. */

/* ---- Desktop Revizeler - Part 1 (2026-07-26) ---- */

/* 1) Header logo +10px büyüdü (orijinal 56px yükseklik -> 66px) */
.main-menu__logo img {
  height: 66px;
  width: auto;
}

/* 2-4) Header menü linkleri: font-size 21px, weight 700, letter-spacing -1px,
   pasif renk #2a2a41, aktif renk #5b57b6 + alt çizgi #ff7d96 */
.main-menu .main-menu__list > li > a,
.stricky-header .main-menu__list > li > a {
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -1px;
  color: #2a2a41;
}

.main-menu .main-menu__list > li.current > a,
.main-menu .main-menu__list > li:hover > a,
.stricky-header .main-menu__list > li.current > a,
.stricky-header .main-menu__list > li:hover > a {
  color: #5b57b6;
}

.main-menu .main-menu__list > li.current > a::before,
.main-menu .main-menu__list > li:hover > a::before,
.stricky-header .main-menu__list > li.current > a::before,
.stricky-header .main-menu__list > li:hover > a::before {
  background-color: #ff7d96;
}

/* 5) Header "Brif Gönder" butonu font-size 21px (sadece header'a özel, footer butonunu etkilemez) */
.main-menu__btn-box .thm-btn,
.main-menu__btn-box .thm-btn span {
  font-size: 21px;
}

/* 6-7) Hero "Dijital / Çözümler" başlıkları: özel renk + Poppins/bold/letter-spacing,
   ve rozet+avatar+2.satır tek satırda kalsın diye flex satırının daralması */
.banner-one__big-title-one,
.banner-one__big-title-two {
  color: #38366f;
  font-family: "Poppins", sans-serif;
  font-weight: 900;
  letter-spacing: -2px;
  font-size: 150px;
}

.banner-one__content-two {
  gap: 40px;
}

.banner-one__content-two-list li + li {
  margin-left: -30px;
}

/* ---- Part 2 (2026-07-26) — İç sayfa üst (breadcrumb) ve ana section padding'leri, tüm sayfalarda + mobil/desktop ortak ---- */

.page-header__inner {
  padding: 30px 0 30px;
}

.portfolio-page,
.contact-page,
.blog-page,
.faq-page,
.services-page {
  padding: 40px 0 40px;
}

/* ---- Part 3 (2026-07-26) — Footer alt menü padding + sosyal ikonlar (Facebook eklendi + büyüdü + takip metni) ---- */

.site-footer__top {
  padding: 41px 0 42px;
}

.footer-widget__title {
  font-weight: 600;
  letter-spacing: -3px;
}

.footer-widget__text {
  font-size: 21px;
  color: var(--nexin-base);
}

.portfolio-one {
  padding: 70px 0 70px;
}

.portfolio-one .section-title__title {
  font-weight: 700;
  letter-spacing: -3px;
}

/* Ana sayfa portfolyo teaser'ındaki ok butonu artık <span> (link değil, galeri popup'ını tetikliyor) — beyaz yerine pembe */
.portfolio-one__arrow > span {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  font-size: 24px;
  color: var(--nexin-white);
  background-color: var(--nexin-base);
}

.site-footer__bottom-menu-box {
  padding: 30px 0 20px;
}

.site-footer__social-box a {
  font-size: 21px;
  color: var(--nexin-base);
}

.site-footer__social-box a:hover {
  color: var(--nexin-purple);
}

.site-footer__social-follow-text {
  font-family: var(--nexin-font);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: -.2px;
  color: var(--nexin-black);
}

/* ---- Part 4 (2026-07-27) — Anasayfa hero: padding, deneyim sayacı kaldırıldı, curved-circle, sizi arayalım kutusu, mobil başlık ---- */

/* 1) Hero (.banner-one) padding — tüm ekran genişliklerinde (mobil dahil, responsive.css'teki 70px/120px override'ını ezer) */
.banner-one {
  padding: 50px 0 50px;
}

/* 5) Keşfet dairesi metni — dikey ortalama düzeltmesi */
.explore-one__curved-circle-box .curved-circle {
  top: -26px;
}

/* 6) "Sizi Arayalım" pembe kutu — sadece tablet/desktop (mobildeki 767px override'a dokunmuyor) */
@media only screen and (min-width: 768px) {
  .banner-one__content-two-single {
    position: relative;
    display: block;
    background-color: var(--nexin-base);
    padding: 20px 40px 20px;
    padding-right: 75px;
    border-radius: 40px;
  }
}

/* 7) "Dijital Çözümler" başlığı — sadece mobilde (max-width:767px) 70px */
@media only screen and (max-width: 767px) {
  .banner-one__big-title-one,
  .banner-one__big-title-two {
    font-size: 70px;
  }
}

/* ---- Part 5 (2026-07-27) — Keşfet dairesi metni, üst yazı boşluğu, hero paragraf stili, Sizi Arayalım cümle biçimi ---- */

/* 2) Üst yazı ("İyi bir sonuç...") ile "Dijital" başlığı arasına boşluk */
.banner-one__sub-title-box {
  margin-bottom: 18px;
}

/* 3) Hero alt metni ("Her müşteri bizim için...") — büyütüldü ve kalınlaştırıldı */
.banner-one__text-box-one p {
  font-size: 20px;
  font-weight: 700;
}

/* 4) "Sizi Arayalım" rozeti — zorla büyük harf kapatıldı (metin artık cümle diziliminde), font sıkıştırma aralığı eklendi */
.banner-one__content-two-single-text {
  text-transform: none;
  letter-spacing: -1px;
}

/* ---- Part 6 (2026-07-28) — Keşfet metin konumu düzeltmesi, hero alt yazı kalınlığı, mobil hero düzeni masaüstüyle eşitlendi ---- */

/* 1) Keşfet dairesi metni — "OKTO Neler Yapıyor Keşfet" ile yeni en uygun konum (Part 4'teki -26px değerini ezer) */
.explore-one__curved-circle-box .curved-circle {
  top: -2px;
}

/* 2) Hero üst yazı ("İyi bir sonuç...") kalınlaştırıldı */
.banner-one__sub-title-box p {
  font-weight: 700;
}

@media only screen and (max-width: 767px) {
  /* 3) Keşfet dairesinin mobildeki konumu */
  .explore-one__rounded-text {
    position: absolute;
    top: 0px;
    right: 290px;
    z-index: 1;
  }

  /* 4) "Dijital Çözümler" mobilde tek satıra sığsın diye küçültüldü (Part 4'teki 70px değerini ezer) */
  .banner-one__big-title-one,
  .banner-one__big-title-two {
    font-size: 50px;
  }

  /* 5) Mobil "Sizi Arayalım" alanı masaüstüyle birebir aynı — maskot ikonu geri geldi, rozet metni yine 2 satır, köşe/dolgu masaüstüyle aynı */
  .banner-one__content-two-list li:last-child {
    display: block;
  }

  .banner-one__content-two-single-text br {
    display: initial;
  }

  .banner-one__content-two-single {
    padding: 20px 40px 20px;
    padding-right: 75px;
    border-radius: 40px;
  }

  /* 6) Mobil hamburger menü ikonu — sağ kenara çok yapışıktı ve küçüktü, içeri alındı + büyütüldü */
  .main-menu .mobile-nav__toggler {
    margin-right: 25px;
    font-size: 26px;
  }
}

/* ---- Part 7 (2026-07-28) — Keşfet dairesi metni son konum, mobilde "Dijital Çözümler" tek satırlık birleşik başlık hilesi ---- */

/* 1) Keşfet dairesi metni — son ince ayar (Part 6'daki -2px değerini ezer) */
.explore-one__curved-circle-box .curved-circle {
  top: -19px;
}

/* Masaüstünde gizli — sadece mobilde görünecek birleşik başlık */
.banner-one__mobile-combined-title {
  display: none;
}

@media only screen and (max-width: 767px) {
  /* 2) Mobilde "Dijital" (h1) ve "Çözümler" (h2) ayrı ayrı elemanlar gizlenip yerine tek satırlık birleşik başlık gösteriliyor.
     h1 etiketi DOM'da kalmaya devam ediyor (SEO için), sadece görsel olarak mobilde gizli. */
  .banner-one__content-one,
  .banner-one__big-title-two {
    display: none;
  }

  .banner-one__mobile-combined-title {
    display: block;
    color: #38366f;
    font-family: "Poppins", sans-serif;
    font-weight: 900;
    letter-spacing: -1px;
    font-size: 57px;
    white-space: nowrap;
    margin-bottom: 20px;
  }
}

/* ---- Part 8 (2026-07-28) — Mobil "Sizi Arayalım" tek satır, başlık+rozet arası boşluk, birleşik başlık rengi, hero üst yazı sıkıştırma ---- */

@media only screen and (max-width: 767px) {
  /* 1) "Sizi Arayalım" mobilde de masaüstü gibi tek satır olsun (Part 7'deki br görünürlüğünü tekrar kapatıyor) */
  .banner-one__content-two-single-text br {
    display: none;
  }

  /* 2) Başlık ("Dijital Çözümler!") ile "Sizi arayalım" rozeti arası boşluk büyütüldü (rozet aşağı, paragrafa doğru kayıyor) */
  .banner-one__content-two {
    margin-top: 20px;
  }

  /* 4) Hero üst yazı ("İyi bir sonuç...") font sıkıştırma aralığı */
  .banner-one__sub-title-box p {
    letter-spacing: -1px;
  }
}

/* 3) Birleşik mobil başlığın rengi — "Sizi Arayalım" yanındaki maskot kutusunun arkaplan rengiyle (lacivert) aynı */
.banner-one__mobile-combined-title {
  color: var(--nexin-black);
}

/* ---- Part 9 (2026-07-28) — Düzeltme: "Sizi Arayalım" mobilde de masaüstü gibi 2 satır olacak (Part 8'deki tek satır kararı geri alındı) ---- */
@media only screen and (max-width: 767px) {
  .banner-one__content-two-single-text br {
    display: initial;
  }
}

/* ---- Part 10 (2026-07-28) — Masaüstü "Dijital Çözümler" rengi mobil birleşik başlıkla eşitlendi (Part 1'deki #38366f değerini ezer) ---- */
.banner-one__big-title-one,
.banner-one__big-title-two {
  color: #262645;
}

/* ---- Part 11 (2026-07-28) — "Hakkımızda/About" bölümü: arkaplan+padding, şablon placeholder metni kaldırıldı, "global brands" başlığı hizası+renk ---- */

.about-one {
  background-color: #1c1c32;
  padding: 50px 0 40px;
}

@media only screen and (max-width: 767px) {
  .about-one {
    padding: 40px 0 40px;
  }
}

/* "We worked with global largest brands" başlığı artık sol boşluksuz, önündeki süslü çizgi (135px'lik boşluğu dolduruyordu) gereksiz kaldı */
.about-one__title-box {
  margin-left: 0;
}

.about-one__title-box::before {
  display: none;
}

.about-one__bottom-title {
  color: var(--nexin-base);
}

/* ---- Part 12 (2026-07-28) — About başlığı: DM Sans + font sıkıştırma, "merhabayla" kelimesi pembe/kalın/altı çizgili ---- */

.about-one__title {
  font-family: var(--nexin-font);
  letter-spacing: -2px;
}

.about-one__title-highlight {
  color: var(--nexin-base);
  font-weight: 900;
  text-decoration-line: underline;
  text-decoration-color: var(--nexin-base);
  text-decoration-thickness: 3px;
  text-underline-offset: 4px;
}

.about-one__bottom {
  padding-top: 0;
}

/* ---- Part 13 (2026-07-28) — Hizmetler (service-one) bölümü: üst iç boşluk, çark rengi (dosya değişti), rozet metni, deneyim yazısı kaldırıldı, başlık stili ---- */

/* 1) Üst iç boşluk (padding) — mobil+masaüstü aynı, tüm diğer bölümlerden önce gelen 120px değerini ezer */
.service-one {
  padding: 40px 0 0;
}

/* İkonların rengi artık pembe */
.service-one__icon span {
  color: var(--nexin-base);
}

.service-one__top {
  position: relative;
  display: block;
  border-bottom: 0;
  padding-bottom: 82px;
  margin-bottom: 0px;
}

.section-title__title {
  color: var(--nexin-black);
  font-size: 54px;
  line-height: 64px;
  font-weight: 700;
  text-transform: capitalize;
  margin: 8px 0 0;
  letter-spacing: -2px;
}

@media only screen and (max-width: 767px) {
  .section-title__title {
    font-size: 50px;
    line-height: 50px;
    letter-spacing: -2px;
  }

  .service-one__top {
    padding-bottom: 0px;
  }
}

/* ---- Part 14 (2026-07-28) — .service-one__top alt iç boşluğu masaüstünde de 0 (Part 13'teki 82px değerini ezer) ---- */
.service-one__top {
  padding-bottom: 0;
}

/* Çark artık pembe olduğu için tam opaklıkta görünsün (eskiden gri/soluk versiyon için 0.05'ti) */
.service-one__shape-1 {
  opacity: 1;
}

/* ---- Part 15 (2026-07-28) — Portfolyo (Neler Yaptık) sayfası: kart görseli köşe yuvarlama, içerik/başlık stili, ok ikonları global yenileme ---- */

/* Kart görselleri köşeleri yuvarlatıldı */
.portfolio-page__img {
  border-radius: 16px;
}

.portfolio-page__content {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 13px;
}

.portfolio-page__title {
  font-size: 26px;
  font-weight: 500;
  line-height: 30px;
  text-transform: capitalize;
  margin-top: 2px;
  color: #2c2c51;
}

/* Tüm site genelindeki icon-* ikonları (ok butonları vb.) — daha spesifik bir kural yoksa artık pembe + 30px */
[class^="icon-"],
[class*=" icon-"] {
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 30px;
  color: #ff7d96;
}

/* ---- Part 16 (2026-07-28) — Hizmetler listesi + Hizmet detay sayfası: ikon rengi, kart köşeleri, üst banner metni kaldırıldı, başlık/sidebar stili ---- */

/* Hizmetler listesi (/hizmetler) kart ikonları pembe */
.services-page .services-three__icon span {
  color: var(--nexin-base);
}

/* Kart köşeleri yuvarlatıldı */
.services-three__single {
  border-radius: 16px;
}

/* Hizmet detay sayfası ana konteyner iç boşluğu */
.services-details {
  padding: 40px 0 40px;
}

/* Görsel en yukarıda başlasın diye üst boşluk kaldırıldı (üst banner metni bloku blade'den de kaldırıldı) */
.services-details__img {
  margin-top: 0;
}

/* Hizmet detay sayfasındaki tüm görseller köşe yuvarlama */
.services-details__img img,
.services-details__img-box-img img,
.services-details__img-box-img-2 img {
  border-radius: 16px;
}

/* Sol sidebar "Diğer Hizmetler" başlığı kalınlaştırıldı (blog sidebar'ıyla paylaşılan class, orada da tutarlı görünür) */
.sidebar__title {
  font-weight: 700;
}

/* Hizmet detay içeriğindeki h3 başlıklar (Genel Bakış / Öne Çıkan Özellikler) kalınlaştırıldı + font sıkıştırma aralığı */
.services-details__title-1,
.services-details__title-2 {
  font-weight: 700;
  letter-spacing: -1px;
}

/* ---- Part 17 (2026-07-28) — Blog listesi + Blog detay sayfası: kategori etiketi kaldırıldı, görsel köşeleri, sidebar "İlgili Diğer Yazılar" küçük resimli hale getirildi, ana metin büyütüldü ---- */

/* Blog listesi kart görselleri köşe yuvarlama (20px) */
.blog-two__img {
  border-radius: 20px;
}

/* Blog detay ana konteyner iç boşluğu */
.blog-details {
  padding: 40px 0 40px;
}

/* Blog detay içindeki görseller köşe yuvarlama */
.blog-details__img img,
.blog-details__img-box-img img {
  border-radius: 16px;
}

/* Blog ana metni (giriş + içerik) büyütüldü, artık daha okunaklı */
.blog-details__text-1,
.blog-details__rich-content,
.blog-details__rich-content p {
  font-size: 19px;
  line-height: 32px;
}

/* Sidebar "İlgili Diğer Yazılar" öğeleri arası boşluk biraz daha ferah */
.sidebar__post-content {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* ---- Part 18 (2026-07-28) — Blog listesi başlık düzeni, sidebar görsel+font ince ayarı, detay meta kaldırıldı; Hizmetler listesi kartlarına gerçek görsel ---- */

/* 1) Blog listesi: başlık artık tarihin yanında (kategori kaldırılan yerde), altta değil */
.blog-two__title {
  margin-top: 0;
}

/* 2) Sidebar "İlgili Diğer Yazılar" küçük resimleri köşe yuvarlama */
.sidebar__post-image img {
  border-radius: 16px;
}

/* 4) Sidebar liste başlığı ve tarihi 2px küçültüldü, tarih biraz kalınlaştırıldı (500) */
.sidebar__post-title {
  font-size: 18px;
}

.sidebar__post-date {
  font-size: 14px;
  font-weight: 500;
}

/* Hizmetler listesi (/hizmetler) kartları: ikon yerine gerçek hizmet görseli */
.services-three__img {
  margin-bottom: 25px;
}

.services-three__img img {
  width: 100%;
  border-radius: 16px;
  display: block;
}

/* Kart başlığı kalınlaştırıldı, açıklama ile "Devamını Oku" arası daraltıldı */
.services-page .services-three__title {
  font-weight: 700;
}

.services-three__text {
  margin: 10px 0 15px;
}

/* ---- Part 19 (2026-07-28) — Hizmetler kartı iç boşluğu (Erkan'ın tarayıcıda ayarladığı değerler) ---- */
.services-three__single {
  position: relative;
  display: block;
  border: 1px solid #2A2A2A;
  padding: 12px 15px 16px;
  overflow: hidden;
  -webkit-transition: all 500ms ease;
  transition: all 500ms ease;
  margin-bottom: 30px;
  z-index: 1;
}

@media only screen and (max-width: 767px) {
  .services-three__single {
    padding: 12px 15px 32px;
  }
}

/* ---- Part 20 (2026-07-28) — Blog listesi başlık stili (Erkan'ın tarayıcıda ayarladığı değer) ---- */
.blog-page .blog-two__title {
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: -1px;
}

/* ---- Part 21 (2026-07-28) — Hakkımızda: üst blok kaldırıldı sonrası görsel+metin, İletişim başlığı, marka marquee, Sizi Arayalım modalı ---- */

/* Hakkımızda görseli köşe yuvarlama */
.about-four__img-1 img {
  border-radius: 16px;
}

/* Hakkımızda ana metin biraz büyütüldü, daha doygun görünsün */
.about-four__text,
.about-four__rich-content p {
  font-size: 18px;
  line-height: 30px;
}

/* İletişim sayfası "Bize Ulaşın" başlığı — kalın, pembe, sıkıştırılmış */
.contact-page__form-title {
  color: var(--nexin-base);
  font-weight: 900;
  letter-spacing: -2px;
}

/* --- Marka logoları: kesintisiz kayan marquee (Swiper'ın adım adım kaymasının yerine) --- */
.okto-brand-marquee {
  overflow: hidden;
  width: 100%;
}

.okto-brand-marquee__track {
  display: flex;
  align-items: center;
  width: max-content;
  animation: okto-marquee-scroll 30s linear infinite;
}

.okto-brand-marquee:hover .okto-brand-marquee__track {
  animation-play-state: paused;
}

.okto-brand-marquee__item {
  flex-shrink: 0;
  margin: 0 40px;
}

@keyframes okto-marquee-scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

/* --- Anasayfa hero "Sizi Arayalım" artık sayfa yönlendirmesi değil, modal penceresi açıyor --- */
.okto-callback-modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(20, 20, 45, .75);
  z-index: 99999;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.okto-callback-modal-overlay.active {
  display: flex;
}

.okto-callback-modal {
  position: relative;
  background: var(--nexin-black, #262645);
  border-radius: 16px;
  padding: 45px 40px;
  max-width: 460px;
  width: 100%;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .4);
}

.okto-callback-modal__close {
  position: absolute;
  top: 14px;
  right: 18px;
  background: none;
  border: none;
  color: #fff;
  font-size: 32px;
  line-height: 1;
  cursor: pointer;
  opacity: .7;
  transition: .2s;
}

.okto-callback-modal__close:hover {
  opacity: 1;
}

.okto-callback-modal__title {
  color: #fff;
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 10px;
}

.okto-callback-modal__text {
  color: rgba(255, 255, 255, .75);
  font-size: 15px;
  margin-bottom: 22px;
}

.okto-callback-modal__field {
  margin-bottom: 16px;
}

.okto-callback-modal__field input {
  width: 100%;
  border: none;
  border-radius: 8px;
  padding: 15px 16px;
  font-size: 15px;
}

.okto-callback-modal__submit {
  width: 100%;
  background: var(--nexin-base, #FF7D96);
  color: var(--nexin-black, #262645);
  border: none;
  border-radius: 8px;
  padding: 15px;
  font-weight: 700;
  font-size: 16px;
  cursor: pointer;
  transition: .3s;
}

.okto-callback-modal__submit:hover {
  opacity: .85;
}

.okto-callback-modal__submit:disabled {
  opacity: .6;
  cursor: default;
}

.okto-callback-modal__errors {
  background: rgba(255, 125, 150, .15);
  color: #ff7d96;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 13px;
  margin-bottom: 16px;
}

.okto-callback-modal__success {
  color: #fff;
  text-align: center;
  padding: 15px 0;
}

.okto-callback-modal__success h3 {
  color: var(--nexin-base, #FF7D96);
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 12px;
}

/* ---- Part 22 (2026-07-28) — Düzeltmeler: Hakkımızda section iç boşluğu, SSS'teki yetim üst çizgi kaldırıldı ---- */

/* Hakkımızda section — üstten/alttan iç boşluk 30px, mobil+masaüstü aynı */
.about-four {
  padding: 30px 0 30px;
}

/* SSS: üstteki başlık bloğu kaldırıldığı için ilk sorunun üzerindeki çizgi artık gereksizdi */
.faq-one__inner {
  border-top: none;
  padding-top: 0;
}

/* ---- Part 23 (2026-07-28) — Anasayfa "Markanızı Stratejik Dijital Hizmetlerle Güçlendiriyoruz" kartları: ikon yerine gerçek hizmet görseli ---- */

/* Görsel kartın üst/sol/sağ kenarına tam oturuyor (padding'i negatif margin ile iptal ediyoruz), sadece üst köşeler 16px yumuşak */
.service-one__img {
  margin: -34px -40px 20px -40px;
}

.service-one__img img {
  width: 100%;
  display: block;
  border-radius: 16px 16px 0 0;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .service-one__img {
    margin: -34px -20px 20px -20px;
  }
}

@media only screen and (max-width: 767px) {
  .service-one__img {
    margin: -34px -10px 20px -10px;
  }
}

/* ---- Part 24 (2026-07-28) — Kartın kendi çerçevesi de görselin üst köşeleriyle uyumlu yumuşatıldı (üstten/soldan/sağdan) ---- */
.service-one__single-inner {
  border-radius: 16px 16px 0 0;
}

/* ---- Part 25 (2026-07-28) — Blog görselleri: TEK geniş kaynak dosyadan hem liste (kare) hem detay (900x500) için otomatik kırpım ---- */
.blog-two__img img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.blog-details__img {
  overflow: hidden;
}

.blog-details__img img {
  aspect-ratio: 900 / 500;
  object-fit: cover;
}

/* ---- Part 12 (2026-07-28) — Erişilebilirlik: "Sizi Arayalım" rozeti artık <h3> değil <div> (başlık hiyerarşisi h1->h3 atlaması düzeltildi),
   temel görsel stil (eskiden module-css/banner.css'in ".banner-one__content-two-single h3" seçicisinden geliyordu) buraya taşındı ---- */
.banner-one__content-two-single-text {
  font-size: 30px;
  font-weight: 700;
  line-height: 40px;
  font-family: var(--nexin-font);
  color: var(--nexin-black);
  margin: 0;
}

/* ---- Part 26 (2026-07-28) — Bug fix: Anasayfa "Hizmetlerle Güçleniyoruz" kart görselleri ve portfolyo teaser görselleri masaüstünde dikey olarak bozuluyordu.
   Kök neden: <img> etiketlerinde şablondan kalma eski width/height HTML attribute'ları (900x355 / 1000x1250) vardı. CSS sadece width:100% veriyordu,
   height'a hiç dokunmuyordu — bu yüzden tarayıcı height attribute'unun ham piksel değerini (355 / 1250) olduğu gibi CSS height'a uyguluyor,
   genişlik yeni sütuna göre küçülürken yükseklik şablondaki eski değerde sabit kalıyordu (oran bozuluyordu). Mobilde sütun genişliği farklı
   kırılım noktalarında bu değere daha yakın kaldığı için sorun göze çarpmıyordu. Çözüm Part 25'teki blog görselleriyle aynı desen:
   sabit aspect-ratio + object-fit:cover, attribute'tan gelen height tamamen ezilir. ---- */
.service-one__img img {
  height: auto;
  aspect-ratio: 900 / 355;
  object-fit: cover;
}

.portfolio-one__img img,
.portfolio-one__img-2 img {
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}

/* ---- Part 11 (2026-07-28) — Mobil hero: "Dijital Çözümler!" 40px, "Sizi Arayalım" rozeti sağ/sol iç boşluk 20px eşitlendi ---- */
@media only screen and (max-width: 767px) {
  .banner-one__mobile-combined-title {
    font-size: 40px;
  }

  .banner-one__content-two-single {
    padding: 20px 20px 20px 20px;
  }

  /* Tema orijinalinde avatar dairesi rozetin üzerine kasıtlı -50px ile biniyor (masaüstünde şık duran bir efekt);
     rozet mobilde daralınca bu binme metnin üzerine düşüyordu. Binme miktarı azaltıldı. */
  .banner-one__content-two-list li + li {
    margin-left: -12px;
  }

  .banner-one__content-two-single-two {
    height: 140px;
    width: 140px;
    border-radius: 50px;
  }

  .banner-one__content-two-single-two img {
    width: 110px;
    height: 110px;
  }
}