/* Netloji — şablon üstüne sitenin kendi düzeltmeleri.
   Ana stiller /assets/css/main.css içindedir; bu dosya yalnızca eklenen bölümleri taşır.
   Kararlar: docs/memory/K-0033. */

/* ---------- marka: renk ve font ---------- */

:root {
    /* Şablonun mavisi (#3F5AF3) hazır tema hissi veriyordu. İki renk de markanın özgün
       logo dosyalarından ölçüldü (2026-08-18). */
    --rr-color-theme-primary: #F49912;   /* marka turuncusu */
    --nl-navy: #28306F;                  /* marka laciverti */
    --rr-color-theme-secondary: #11151C;
    /* Turuncu beyaz zeminde metin için fazla açık; yazıda bu koyu ton kullanılır. */
    --nl-accent-text: #A96500;

    /* main.css'teki @import bozuk: URL'de "&" yerine "&amp;" var, bu yüzden font hiç
       yüklenmiyor ve tarayıcı serif'e düşüyordu. Font artık layout'taki <link> ile
       geliyor; buradaki yedekler de serif değil sans. */
    --rr-ff-body: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --rr-ff-heading: var(--rr-ff-body);
    --rr-ff-heading-2: var(--rr-ff-body);
    --rr-ff-p: var(--rr-ff-body);
    --rr-ff-body-2: var(--rr-ff-body);
}

/* Turuncu zeminde beyaz yazı okunmuyor (2,2:1); dolgulu düğmelerin yazısı lacivert. */
.rr-primary-btn {
    color: var(--rr-color-theme-secondary);
}

.rr-primary-btn:hover {
    color: var(--rr-color-common-white);
}

/* Çağrı bandındaki düğme dolgulu değil, koyu görselin üzerinde çerçeveli duruyor;
   orada yazı beyaz kalmalı. */
.cta-section-5 .rr-primary-btn,
.white-content .rr-primary-btn {
    color: var(--rr-color-common-white);
}

/* Kayan şerit turuncu zemin + beyaz yazıyla göz alıyordu (2,3:1). Zemin koyuya alındı,
   yıldızlar marka rengiyle kaldı. */
.running-text {
    background-color: var(--rr-color-bg-1);
}

.running-text .carouselTicker__list li {
    color: var(--rr-color-common-white);
    font-size: 20px;
}

.running-text .carouselTicker__list li i {
    color: var(--rr-color-theme-primary);
}

/* Seçim rengi tarayıcının varsayılan mavisiydi ve koyu kahraman görselin üzerinde
   yamalı duruyordu. */
::selection {
    background: var(--rr-color-theme-primary);
    color: var(--nl-navy);
}

/* ---------- menü ---------- */

/* Menüdeki aktif kalemi vurgula (data-driven menü) */
.header-menu-wrap .menu-item-has-children.active > a,
.mobile-menu-items ul li.active > a {
    color: var(--rr-color-theme-primary);
}

/* Açık temada başlık sayfanın en üstünde koyu görselin üzerinde duruyor; lacivert logo
   orada kayboluyor. Beyaz logo, başlık kaydırmayla beyaza dönene (.fixed) kadar kalır. */
[data-theme="light"] .header:not(.fixed) .header-logo .logo-dark {
    display: block;
}

[data-theme="light"] .header:not(.fixed) .header-logo .logo-light {
    display: none;
}

/* Üst şeritteki WhatsApp bağlantısı — sosyal ikon dizisinin yerine geçti */
.top-bar-social .nl-whatsapp {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: inherit;
}

.top-bar-social .nl-whatsapp i {
    font-size: 16px;
}

/* ---------- slider ---------- */

/* Şablon üç kelimelik İngilizce slogan için kurulmuş: üst satır 50px, başlık 135px,
   alt satır 75px. Türkçe cümlelerle bu ölçüler ekranı taşırıyor. Üst satır artık
   bir üst-etiket; başlık ile alt satır aynı boyda, çünkü tek cümlenin iki parçası. */
.hero-content .sub-title {
    font-size: 17px;
    font-weight: 500;
    letter-spacing: 0.08em;
    opacity: 0.85;
    margin-bottom: 18px;
}

.hero-content .title,
.hero-content .bottom-title {
    font-size: 60px;
    font-weight: 700;
    line-height: 1.08;
}

.hero-content .bottom-title {
    margin-bottom: 36px;
}

/* Başlığın arkasındaki mavi gradyan şablon süsü — marka rengiyle de çakışıyordu. */
.hero-content .title:before,
[data-theme="light"] .runok-slider .slider-item .hero-content .title:before {
    display: none;
}

@media only screen and (max-width: 992px) {
    .hero-content .sub-title {
        font-size: 15px;
    }

    .hero-content .title,
    .hero-content .bottom-title {
        font-size: 44px;
    }
}

@media only screen and (max-width: 767px) {
    .hero-content .title,
    .hero-content .bottom-title {
        font-size: 32px;
    }
}

/* ---------- başlık ölçüleri ---------- */

/* Şablonun ölçüleri kısa İngilizce başlıklara göre: bölüm başlığı 48px, sayfa başlığı
   60px. Türkçe başlıklar 30-50 karakter olduğu için iki üç satıra yayılıyordu. */
.section-heading .section-title {
    font-size: 36px;
    line-height: 1.22;
}

.page-header .page-header-content .title {
    font-size: 44px;
    line-height: 1.15;
    margin-bottom: 22px;
}

/* Başlığın arkasındaki mavi gradyan — slider'daki süsün sayfa başlığındaki eşi. */
.page-header .page-header-content .title:before {
    display: none;
}

/* Sayfa başlığındaki mavi ışık lekesi marka tonuna çevriliyor; soldaki mavi-gri üçgen
   renkten arındırılıyor — turuncuya çevrilse tuhaf duruyor, mavi kalırsa çakışıyor. */
.page-header .shapes .shape-1 img {
    filter: hue-rotate(165deg) saturate(1.2);
    opacity: 0.75;
}

.page-header .shapes .shape-2 img {
    filter: saturate(0.12);
}

@media only screen and (max-width: 992px) {
    .section-heading .section-title {
        font-size: 30px;
    }

    .page-header .page-header-content .title {
        font-size: 36px;
    }
}

@media only screen and (max-width: 767px) {
    .section-heading .section-title {
        font-size: 26px;
    }

    .page-header .page-header-content .title {
        font-size: 30px;
    }
}

/* ---------- ortak ---------- */

/* Şablon her bölüme 130px üst + 130px alt boşluk veriyor. Demo sayfasında az metinle
   iyi duruyor; dolu metinle sayfa gereksiz uzuyor. Mobil değerlere dokunulmadı. */
@media only screen and (min-width: 993px) {
    .pt-130 {
        padding-top: 96px;
    }

    .pb-130 {
        padding-bottom: 96px;
    }
}

/* Kartların üzerindeki tema süsü — hazır şablon izi bırakıyor. */
.service-card > .shape {
    display: none;
}

/* Şablonun ikonları tek renk mavi çizim (#3F5AF3). Dosyaları yeniden çizmek yerine
   renk döndürülüyor: mavi (231°) → marka turuncusu (36°). */
.about-card .icon img,
.service-card .icon img,
.process-icon img,
.counter-card .icon img {
    filter: hue-rotate(165deg) saturate(1.25);
}

/* İkon kutularının açık mavi zemini de sıcak tona çekiliyor. */
[data-theme="light"] .service-card .icon,
[data-theme="light"] .about-card .icon,
[data-theme="light"] .process-item .process-icon {
    background: #FDF0DE;
}

.nl-section-lead {
    max-width: 760px;
    margin: 18px auto 0;
}

/* Şablon bu metinlere text-transform: capitalize uyguluyor; tarayıcı Türkçe kuralını
   uygulamadığı için "işi" → "Işi" oluyor. Etiketler yazıldığı gibi kalsın. */
.process-counter .counter-card .content p,
.counter-card .content p,
.nl-customer-name,
.nl-badge {
    text-transform: none;
}

.section-heading .nl-section-lead {
    margin-bottom: 0;
}

/* ---------- teknoloji vitrini (ana sayfa + /teknoloji) ---------- */

.nl-tech-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 32px 30px;
    border: 1px solid rgba(128, 128, 128, 0.22);
    border-radius: 14px;
    transition: transform 0.3s ease, border-color 0.3s ease;
}

.nl-tech-card:hover {
    transform: translateY(-6px);
    border-color: var(--rr-color-theme-primary);
}

/* Logolar beyaz sürüm; marka laciverti kutunun üzerinde duruyorlar. */
.nl-tech-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 74px;
    margin-bottom: 22px;
    padding: 0 24px;
    background: var(--nl-navy);
    border-radius: 10px;
}

.nl-tech-logo img {
    max-height: 30px;
    width: auto;
}

.nl-tech-name {
    display: block;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.3;
}

/* Büyük harfe çevrilmiyor: Türkçe kuralı "API-first"i "API-FİRST" yapıyor. */
.nl-tech-tagline {
    display: block;
    margin-bottom: 14px;
    font-size: 14px;
    letter-spacing: 0.02em;
    text-transform: none;
    color: var(--rr-color-theme-primary);
}

.nl-tech-body {
    display: block;
    margin-bottom: 20px;
}

.nl-tech-card .read-more {
    margin-top: auto;
}

.nl-tech-note {
    max-width: 860px;
    margin: 44px auto 0;
    text-align: center;
    font-size: 15px;
    opacity: 0.75;
}

/* Teknoloji detay sayfasının başlığı */
.nl-tech-hero {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 34px;
}

.nl-tech-hero .nl-tech-logo {
    margin-bottom: 0;
    min-width: 220px;
}

/* Başlık h2 varsayılanını (48px) alıyordu; ürün adı için fazla iri. */
.nl-tech-hero .title {
    font-size: 32px;
    line-height: 1.2;
}

@media only screen and (max-width: 767px) {
    .nl-tech-hero .nl-tech-logo {
        min-width: 100%;
    }

    .nl-tech-hero .title {
        font-size: 26px;
    }
}

/* Teknoloji detay sayfasındaki künye şeridi — doğrulanabilir ölçüler (V-0007). */
.nl-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0 0 40px;
}

.nl-fact {
    flex: 1 1 180px;
    padding: 18px 20px;
    border: 1px solid rgba(128, 128, 128, 0.22);
    border-radius: 10px;
}

.nl-fact-value {
    display: block;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--rr-color-theme-primary);
}

.nl-fact-label {
    display: block;
    margin-top: 4px;
    font-size: 13px;
    opacity: 0.78;
}

.nl-payoff-list {
    margin: 0 0 34px;
    padding: 0;
    list-style: none;
}

.nl-payoff-list li {
    display: flex;
    gap: 12px;
    margin-bottom: 14px;
}

.nl-payoff-list i {
    margin-top: 6px;
    color: var(--rr-color-theme-primary);
}

.nl-status-note {
    padding: 18px 22px;
    border-left: 3px solid var(--rr-color-theme-primary);
    background: rgba(128, 128, 128, 0.08);
    border-radius: 0 8px 8px 0;
}

/* ---------- hizmet sayfası: eleme bölümü ---------- */

.nl-fit-col {
    height: 100%;
    padding: 28px 26px;
    border-radius: 12px;
    background: rgba(128, 128, 128, 0.07);
}

.nl-fit-col ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.nl-fit-col li {
    display: flex;
    gap: 12px;
    margin-bottom: 14px;
}

.nl-fit-col li:last-child {
    margin-bottom: 0;
}

.nl-fit-col i {
    margin-top: 6px;
}

.nl-fit-title {
    margin-bottom: 20px;
    font-size: 18px;
}

.nl-fit-yes i {
    color: #1f9d55;
}

.nl-fit-no {
    opacity: 0.85;
}

.nl-fit-no i {
    color: #9aa2ad;
}

/* ---------- referanslar ---------- */

.nl-platform-card {
    height: 100%;
    padding: 30px 28px;
    border: 1px solid rgba(128, 128, 128, 0.22);
    border-radius: 14px;
}

.nl-platform-shot {
    margin: -30px -28px 24px;
    border-radius: 14px 14px 0 0;
    overflow: hidden;
}

.nl-platform-shot img {
    width: 100%;
    height: auto;
    display: block;
}

.nl-platform-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.nl-platform-head .title {
    margin-bottom: 0;
    font-size: 22px;
}

.nl-badge {
    flex: none;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12px;
    letter-spacing: 0.03em;
    background: rgba(128, 128, 128, 0.14);
}

.nl-customer-grid {
    margin-top: 10px;
}

.nl-customer {
    display: flex;
    flex-direction: column;
    gap: 4px;
    height: 100%;
    padding: 20px 22px;
    border: 1px solid rgba(128, 128, 128, 0.2);
    border-radius: 10px;
}

.nl-customer-name {
    font-weight: 600;
}

.nl-customer-work,
.nl-customer-year {
    font-size: 13px;
    opacity: 0.7;
}

/* Demo veri uyarısı — onaylı liste gelene kadar sayfada görünür (V-0006). */
.nl-demo-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    max-width: 860px;
    margin: 0 auto 34px;
    padding: 14px 18px;
    border: 1px dashed #d9a441;
    border-radius: 8px;
    background: rgba(217, 164, 65, 0.09);
    font-size: 14px;
}

.nl-demo-note i {
    margin-top: 3px;
    color: #d9a441;
}

/* ---------- teklif formu ---------- */

.nl-form-errors ul {
    margin: 0 0 20px;
    padding-left: 18px;
    color: #d64545;
}

.nl-field-error {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    color: #d64545;
}

.nl-form-sent {
    padding: 46px 40px;
    border: 1px solid rgba(128, 128, 128, 0.22);
    border-radius: 14px;
    text-align: center;
}

.nl-form-sent i {
    font-size: 42px;
    color: #1f9d55;
}

.nl-form-sent .title {
    margin: 18px 0 10px;
}

/* Bot tuzağı — ekranda görünmez ama ekran okuyucudan da gizlenmiş sayılmaz. */
.nl-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* ---------- yasal künye ---------- */

.nl-legal-table {
    margin-top: 34px;
    border-top: 1px solid rgba(128, 128, 128, 0.22);
}

.nl-legal-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 24px;
    padding: 14px 0;
    border-bottom: 1px solid rgba(128, 128, 128, 0.22);
}

.nl-legal-label {
    flex: 0 0 200px;
    font-weight: 600;
}

.nl-legal-value {
    flex: 1 1 320px;
    word-break: break-word;
}

/* ---------- altbilgi ---------- */

/* Şablon altbilgiye 130px üst + 130px alt boşluk veriyordu: içerik 330px, boşluk 260px.
   Sütun içi aralıklar da altbilgi için fazla açıktı. */
.footer-section .footer-wrap {
    padding-top: 74px;
    padding-bottom: 58px;
}

.footer-section .widget-header {
    margin-bottom: 22px;
}

.footer-section .footer-list li {
    margin-bottom: 12px;
}

.footer-section .address-list li {
    margin-bottom: 10px;
}

.footer-section .logo-widget p {
    margin-bottom: 16px;
}

.footer-section .copyright-area {
    padding-top: 24px;
    padding-bottom: 24px;
}

.footer-note {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 14px;
    opacity: 0.75;
}

.footer-note a {
    text-decoration: underline;
}

/* ---------- hata sayfası ---------- */

.nl-error-code {
    display: block;
    font-size: 96px;
    font-weight: 700;
    line-height: 1;
    color: var(--rr-color-theme-primary);
}

@media (max-width: 767px) {
    .nl-legal-label {
        flex: 1 1 100%;
    }

    .nl-error-code {
        font-size: 64px;
    }
}
