/* ==========================================================================
/* YAPIMCI : OFISIMO 
Versiyon: KURUMSAL v8.0.0
    CSS INDEX OFISIMO SOFTWARE
   ========================================================================== */

/* ---------- Dil seçici (header-style-one: beyaz hap bar) ---------- */
.vs-lang{position:relative;margin-right:14px;z-index:5}
.vs-lang_btn{display:flex;align-items:center;gap:8px;height:42px;padding:0 14px;border-radius:50px;
  background:#F2F3F8;border:1px solid #E4E6EF;color:#0B0B1F;font-weight:600;font-size:14px;cursor:pointer;
  font-family:"Outfit",sans-serif;transition:all .3s ease}
.vs-lang_btn:hover{background:#E9EBF4}
.vs-lang_btn img{width:20px;height:14px;object-fit:cover;border-radius:3px}
.vs-lang_btn i{font-size:11px;transition:transform .3s ease}
.vs-lang.open .vs-lang_btn i{transform:rotate(180deg)}
.vs-lang_menu{position:absolute;right:0;top:calc(100% + 10px);min-width:170px;margin:0;padding:8px;list-style:none;
  background:#fff;border-radius:14px;box-shadow:0 18px 40px rgba(0,0,0,.16);opacity:0;visibility:hidden;
  transform:translateY(8px);transition:all .25s ease}
.vs-lang.open .vs-lang_menu{opacity:1;visibility:visible;transform:none}
.vs-lang_menu li a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:9px;color:#0b0b1f;font-size:14px;font-weight:500}
.vs-lang_menu li a:hover{background:var(--genel-tint);color:var(--main-color)}
.vs-lang_menu li a img{width:20px;height:14px;object-fit:cover;border-radius:3px}

/* Mobil menü: bayraklar + CTA */
.vs-mob-lang{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:22px 25px 0;color:var(--main-color)}
.vs-mob-lang img{width:28px;height:19px;object-fit:cover;border-radius:4px;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.vs-mob-cta{padding:22px 25px 30px}
.vs-mob-cta .theme-btn{width:100%;text-align:center}

/* ---------- Görsel oranları (CMS görselleri şablon ölçülerine) ---------- */
.about-one_image img{width:100%;aspect-ratio:537/372;object-fit:cover}
.offer-one_image img{width:100%;aspect-ratio:707/938;object-fit:cover}
.news-block_one-image img{width:100%;aspect-ratio:410/378;object-fit:cover}
.shop-item .inner-box .image img{width:100%;aspect-ratio:415/561;object-fit:cover}
.about-sidebar .upper-box .image img{width:100%;aspect-ratio:492/533;object-fit:cover}
.video-image img{width:100%;aspect-ratio:1294/734;object-fit:cover}
.instagram-block_one-image img{width:100%;aspect-ratio:1/1;object-fit:cover}
.slider-one_authors li img,.testimonial-block_one-author_image img{aspect-ratio:1/1;object-fit:cover}
.clients-one .client-image img{max-width:100%;height:auto;margin:0 auto}
.instagram-block_one-icon i{color:#fff;font-size:22px}

/* Hakkımızda küçük görsel: şablonun about-3.png köşe şekli maske olarak (kendi fotoğrafımız, şablon silueti) */
.vs-maske img{width:100%;max-width:440px;aspect-ratio:440/419;object-fit:cover;
  -webkit-mask-image:url(../ithub/images/resource/about-3.png);mask-image:url(../ithub/images/resource/about-3.png);
  -webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}

/* "+yıl" rozeti — şablondaki years.png'nin SVG karşılığı (rakamlar fotoğrafla dolu, etiket panelden) */
.vs-yil{display:block;width:100%;max-width:376px;height:auto}
.vs-yil_tx{fill:#0B0B1F}

/* Hizmet ikonları (şablonun SVG'leri yerine FA) */
.offer-one_icon{display:flex;align-items:center;justify-content:center}
.offer-one_icon i{font-size:22px;color:var(--main-color)}   /* aktif satırda da ana renk — şablon ikon zeminini boyamıyor */

/* Sayaç: rakam + son ek tek satırda kalsın ("2.400 +" kırılmasın) */
.counter-one_count{white-space:nowrap}

/* ---------- Web paketleri bloğu (shop-item kartları anasayfada) ---------- */
.vs-urun-blok{padding:110px 0 80px}
.vs-urun-blok .sec-title{margin-bottom:50px;gap:20px}
.vs-urun-blok .sec-title .left-box{flex:1 1 0;min-width:0;max-width:760px}   /* uzun başlık butonu alt satıra itmesin */
.vs-urun-kat{font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--main-color);margin-bottom:6px}

/* 4'lü ürün satırında dar kart: başlık ve fiyat sığsın */
.vs-urun-blok .shop-item .lower-content h3{font-size:19px;line-height:1.3}

/* ---------- Slider: tüm slaytlar eşit yükseklikte ----------
   Başlık uzunluğu farklı slaytlar farklı boy alıyordu; Swiper alanı en uzuna göre boyutlanınca aktif slaytın
   resmi erken bitiyor, sağ alttaki "Tüm Hizmetler" kutusu resmin altına sarkıyordu. Eşit boyda kutu şablondaki
   gibi resmin sağ alt köşesine (slider alanının içine) oturur. */
.slider-one .swiper-wrapper{align-items:stretch}
.slider-one .swiper-slide{height:auto}

/* ---------- Paket sekmeleri kartların üstünde ---------- */
.pricing-tabs .buttons-outer.vs-pk-sekme-ust{margin:0 0 50px}
.pricing-tabs .buttons-outer.vs-pk-sekme-ust .tab-buttons{margin-top:0}

/* ---------- Çalışma Süreci'nden sonraki bloklar: şablon dolguları üst üste binip 190–350px boşluk oluşturuyordu ---------- */
.offer-one{padding-bottom:30px}
.price-one{padding-top:90px;padding-bottom:60px}
.vs-urun-blok{padding:60px 0 40px}
.testimonial-one{padding-top:80px}
.team-one{padding-bottom:90px}
.news-one{padding-bottom:100px}
@media (max-width: 767px){
  .offer-one{padding-bottom:60px}
  .price-one{padding-top:60px;padding-bottom:40px}
  .vs-urun-blok{padding:40px 0 20px}
  .testimonial-one{padding-top:50px}
  .team-one{padding-bottom:60px}
}

/* ---------- Paket kartları (price-block_one) ---------- */
.price-block_one-price{white-space:nowrap}
.vs-pk-birim{font-size:.34em;font-weight:600;margin-left:6px;letter-spacing:0;text-transform:none;opacity:.75}
.price-block_one-title{line-height:1.2}

/* ---------- Paketler alt sayfası ---------- */
.vs-pk-alt{padding:0 0 90px}
.vs-pk-aciklama{max-width:820px;margin:0 auto 26px;text-align:center;font-size:17px;line-height:1.7;color:#555a6e}
.vs-pk-diger{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px}
.vs-pk-diger span{font-weight:600;color:#0B0B1F}
.vs-pk-diger a{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:50px;
  border:1px solid color-mix(in srgb,var(--main-color) 35%,#fff);color:var(--main-color);font-weight:600;transition:all .25s ease}
.vs-pk-diger a:hover{background:var(--main-color);color:#fff}
.vs-pk-diger a i{font-size:12px}

/* ---------- Alt sayfalar: CMS içerik HTML'i (sınıfsız panel içeriği) ---------- */
.page-title ~ * h2:not([class]){font-size:1.6rem;margin:0 0 14px}
.page-title ~ * h3:not([class]){font-size:1.3rem;margin:0 0 12px}
.page-title ~ * p:not([class]) + p:not([class]){margin-top:14px}
.page-title ~ * ul:not([class]){list-style:disc;padding-left:22px;margin:0 0 16px}
.page-title ~ * ol:not([class]){list-style:decimal;padding-left:22px;margin:0 0 16px}

/* CMS sabit WhatsApp + AI sohbet ikonları sağ altta — şablonun "yukarı çık" halkası sola */
.progress-wrap{right:auto !important;left:30px !important}

@media (max-width: 1399px){
  .vs-lang_btn span{display:none}
  .vs-lang{margin-right:10px}
}
@media (max-width: 767px){
  .progress-wrap{left:16px !important;bottom:16px !important}
  .vs-urun-blok{padding:70px 0 50px}
}
@media (max-width: 575px){
  .vs-lang{display:none}   /* mobilde bayraklar menü içinde */
}
@media (prefers-reduced-motion: reduce){
  .vs-lang_menu,.vs-lang_btn i{transition:none}
}

/* ---------- Türkçe büyük harf: şablonun text-transform:capitalize kuralları Chrome'da dil duyarlı değil ---------- 
   (i → 'I' olur: 'iyi' → 'Iyi', 'için' → 'Için'). Türkçe sayfada kapatılır; metin panelde yazıldığı gibi görünür.
   uppercase dil duyarlıdır (EKİBİMİZ doğru) — ona dokunulmaz. Liste şablon CSS'inden otomatik çıkarıldı (60 seçici). */
html[lang="tr"] .about-sidebar_list li,
html[lang="tr"] .about-two_title,
html[lang="tr"] .blog-detail_date,
html[lang="tr"] .blog-detail_title,
html[lang="tr"] .blog-more_posts .title,
html[lang="tr"] .btn-style-one,
html[lang="tr"] .btn-style-three,
html[lang="tr"] .btn-style-two,
html[lang="tr"] .cart-table .cart-header,
html[lang="tr"] .category-list li a,
html[lang="tr"] .category-list_two li a,
html[lang="tr"] .counter-block_two-text,
html[lang="tr"] .default-skill-title,
html[lang="tr"] .empower-block_one-title,
html[lang="tr"] .gallery-block-one_title,
html[lang="tr"] .language-dropdown .dropdown-menu .dropdown-item,
html[lang="tr"] .language-dropdown button,
html[lang="tr"] .login-dropdown .dropdown-menu .dropdown-item,
html[lang="tr"] .login-dropdown button,
html[lang="tr"] .main-header .main-menu .navigation > li > a,
html[lang="tr"] .main-header .mobile-menu .navigation li > a,
html[lang="tr"] .main-menu .navigation > li .mega-menu-bar .column > ul > li,
html[lang="tr"] .news-block_one-date,
html[lang="tr"] .news-block_one-more,
html[lang="tr"] .news-block_one-title,
html[lang="tr"] .news-block_three-date,
html[lang="tr"] .news-block_three-title,
html[lang="tr"] .offer-one_heading,
html[lang="tr"] .page-title h1,
html[lang="tr"] .popular-tags a,
html[lang="tr"] .post-share-options a,
html[lang="tr"] .post-widget .post .post-date,
html[lang="tr"] .post-widget .post h4,
html[lang="tr"] .price-block_one-btn,
html[lang="tr"] .price-block_one-price,
html[lang="tr"] .price-block_one-title,
html[lang="tr"] .search-popup .form-group input[type="search"],
html[lang="tr"] .search-popup .form-group input[type="text"],
html[lang="tr"] .sec-title_heading,
html[lang="tr"] .service-block_one-heading,
html[lang="tr"] .shop-detail .prod-tabs .tab-btns .tab-btn,
html[lang="tr"] .sidebar .related-posts .post h4,
html[lang="tr"] .sidebar-info-contents .content-inner h5,
html[lang="tr"] .sidebar-page-container .comments-area .comment-box strong,
html[lang="tr"] .sidebar-page-container .comments-area .comment-info .comment-time,
html[lang="tr"] .slider-one_heading,
html[lang="tr"] .slider-one_socials a,
html[lang="tr"] .slider-one_title,
html[lang="tr"] .slider-three_heading span,
html[lang="tr"] .slider-three_subtitle,
html[lang="tr"] .slider-three_text,
html[lang="tr"] .slider-three_title,
html[lang="tr"] .slider-two_heading,
html[lang="tr"] .slider-two_title,
html[lang="tr"] .styled-pagination li a,
html[lang="tr"] .team-detail_designation,
html[lang="tr"] .team-one_one .content-box .cat,
html[lang="tr"] .team-tabs .tab-btns .tab-btn,
html[lang="tr"] .text-capitalize,
html[lang="tr"] .voucher-box .form-group button{text-transform:none}


/* Mobil yatay kayma: title-anim (GSAP rotationX + perspektif) ve kayan yazılar animasyon sırasında
   sayfayı genişletiyordu. Yatayda kırp; clip kaydırma kabı oluşturmaz, sticky/fixed header etkilenmez. */
html,body{max-width:100%;overflow-x:hidden}
.page-wrapper{overflow-x:hidden}
@supports (overflow:clip){ html,body,.page-wrapper{overflow-x:clip} }