/* Çetiner Ajans — "A · Açık Stüdyo" teması (2026-11-08).
   v3 + v4 + canli.css'in üstüne en son yüklenir. Krem zemin, siyah kalın Inter Tight, turuncu vurgu, yuvarlak video kartları.
   Eski koyu tasarıma dönmek için bu dosyanın <link>'ini index.html'den kaldırıp yayin_hazirla.py çalıştırmak yeterli. */
:root{
  --altin:#f2461b; --altinA:#f2461b; --altin2:#d63a10;
  --krem:#f3f0e9; --krem2:#e9e4da; --beyaz:#fff; --yazi:#0d0d0d; --soluk:#6d6a64; --cizgi:rgba(13,13,13,.13);
  --ink:#0d0d0d; --zemin:#f3f0e9; --vurgu:#f2461b
}
body.v4{background:var(--zemin);color:var(--ink)}
::selection{background:var(--vurgu);color:#fff}

/* yazı dili: kalın siyah + turuncu italik vurgu (serif yok) */
.dev{font-weight:900;letter-spacing:-.062em;line-height:.88}
.dev i,.reel h1 i,.proje h3 i,.acik .dev i,.acik h2 i,.giris-metin p.buyuk i,.dev-alt .ust-satir h2 i,.baslat .dev i,.rakip-bant .dev i{
  font-family:var(--font)!important;font-style:italic;font-weight:800;letter-spacing:-.055em;color:var(--vurgu)!important}
.kucuk-etiket{color:var(--ink);font-weight:700;letter-spacing:.14em;display:inline-flex;align-items:center;gap:10px}
.kucuk-etiket::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--vurgu)}

/* butonlar */
.btn-gold,.btn-altin{background:var(--vurgu);color:#fff;box-shadow:0 12px 28px -12px rgba(255,77,31,.75)}
.btn-gold:hover,.btn-altin:hover{background:#ff6a42;color:#fff}
.v4 .btn-ghost,.btn-ghost{color:var(--ink);border:1.5px solid var(--ink);background:transparent}
.v4 .btn-ghost:hover{background:var(--ink);color:var(--zemin);border-color:var(--ink)}

/* menü */
.nav,.nav.scrolled{background:rgba(243,240,233,.86);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--cizgi)}
.logo.marka{color:var(--ink)}
.marka .m-tr{color:var(--vurgu)}
.nav ul a{color:#2a2926}.nav ul a:hover{color:var(--vurgu)}
.nav-tel{color:var(--ink)}.nav-tel svg{color:var(--vurgu)}
.nav .btn-altin{background:var(--ink);color:var(--zemin);box-shadow:none}
.nav .btn-altin:hover{background:var(--vurgu);color:#fff}

/* ===== ana sayfa giriş (A düzeni: solda yazı, sağda akan dikey videolar) ===== */
.a-giris{padding:clamp(120px,13vw,150px) 0 0;overflow:hidden}
.a-giris .wrap{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(24px,4vw,56px);align-items:end}
.a-giris h1{font-size:clamp(54px,8.4vw,140px);font-weight:900;letter-spacing:-.065em;line-height:.86;margin:26px 0 30px}
.a-giris h1 .s{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.a-giris h1 .s>span{display:inline-block;animation:a-cik 1.1s cubic-bezier(.2,.8,.2,1) both}
.a-giris h1 .s:nth-child(2)>span{animation-delay:.1s}.a-giris h1 .s:nth-child(3)>span{animation-delay:.2s}
@keyframes a-cik{from{transform:translateY(105%)}}
.a-giris .donen b{font-style:italic;font-weight:800;color:var(--vurgu);letter-spacing:-.055em}
.a-giris .donen b::after{display:none}
.a-giris .lead{font-size:clamp(17px,1.5vw,21px);line-height:1.5;max-width:540px;color:#2b2a27}
.a-giris .btnler{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 clamp(40px,6vw,80px)}
.a-sutunlar{height:clamp(500px,60vw,760px);display:grid;grid-template-columns:1fr 1fr;gap:14px;overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(180deg,transparent,#000 12%,#000 88%,transparent)}
.a-akis{display:grid;gap:14px;animation:a-yukari 40s linear infinite;will-change:transform}
.a-akis.ters{animation-direction:reverse;margin-top:-140px}
.a-sutunlar:hover .a-akis{animation-play-state:paused}
@keyframes a-yukari{to{transform:translateY(-50%)}}
.a-akis a{display:block;position:relative;aspect-ratio:9/16;border-radius:22px;overflow:hidden;background:#ddd6c9}
.a-akis video{width:100%;height:100%;object-fit:cover;display:block}
.a-akis a span{position:absolute;left:12px;bottom:12px;right:12px;font-size:12px;font-weight:700;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.6)}

/* eğik siyah şerit */
.serit{background:var(--ink);color:var(--zemin);border:0!important;transform:rotate(-1.4deg);margin:0 -24px;position:relative;z-index:3;padding:22px 0!important}
.serit-ic{font-size:clamp(28px,3.4vw,52px);font-weight:800;letter-spacing:-.045em;animation-duration:26s}
.serit-ic span:nth-child(even){font-family:var(--font);font-style:normal;font-weight:800;color:var(--zemin)}
.serit-ic span::after{content:"✦";width:auto;height:auto;background:none;color:var(--vurgu);opacity:1;font-size:.7em}

/* giriş metni ve rakamlar */
.giris-metin p.buyuk{font-weight:700;letter-spacing:-.04em}
.giris-metin p.buyuk span{color:#8a867e}
.rakam-satir{border-top:2px solid var(--ink)}
.rakam-satir b{font-weight:900;letter-spacing:-.06em}
.rakam-satir span{color:var(--soluk)}

/* Türkiye haritası açık zeminde */
.h-ulke{fill:#e4dfd4;stroke:rgba(13,13,13,.18)}
#h-nokta circle{fill:rgba(13,13,13,.16)}
.h-yay{stroke:rgba(255,77,31,.55)}
.h-kuyruk{stroke:var(--vurgu);filter:drop-shadow(0 0 4px rgba(255,77,31,.7))}
.h-sehir circle{fill:var(--ink)}
.h-sehir text{fill:#2b2a27}
.h-merkez circle{fill:var(--vurgu)}.h-merkez .h-dalga{stroke:var(--vurgu)}
.h-merkez text{fill:var(--ink)}
.turkiye p.alt{color:#3a3935}
.tr-rakam b{font-weight:900}.tr-rakam span{color:var(--soluk)}

/* öne çıkan projeler */
.proje{border-top:1px solid var(--cizgi)}
.proje-medya{border-radius:28px;background:#ddd6c9}
.proje-medya .izle{background:rgba(255,255,255,.3);color:#fff}
.proje-medya:hover .izle{background:var(--vurgu);color:#fff}
.proje-no{color:var(--soluk);font-weight:600}
.proje h3{font-weight:900;letter-spacing:-.06em}
.proje p{color:#3a3935}
.proje-etiketler span{border:1.5px solid var(--ink);color:var(--ink);font-weight:600}
.proje-sonuc{border-top:1px solid var(--cizgi)}
.proje-sonuc b{color:var(--ink);font-weight:900}
.proje-sonuc span{color:var(--soluk)}

/* iş kartları */
.work{border-radius:24px;background:#ddd6c9}
.work .badge{background:var(--zemin);color:var(--ink);backdrop-filter:none;font-weight:800;letter-spacing:.02em;text-transform:none;font-size:12px;padding:6px 11px}
.work .cat{color:#fff;opacity:.8;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.work h3{font-weight:800;letter-spacing:-.03em}
.work:hover .play{background:var(--vurgu);color:#fff}
.work.next{background:var(--vurgu);border:0}
.work.next .plus{font-family:var(--font);font-style:normal;font-weight:900;color:#fff}
.work.next h3{font-weight:900;letter-spacing:-.05em;font-size:30px}
.work.next p{color:rgba(255,255,255,.85)}
.work.next .btn-gold{background:var(--ink);color:#fff;box-shadow:none}
.filters button{border:1.5px solid var(--cizgi);color:var(--ink);font-weight:600}
.filters button.on,.filters button:hover{background:var(--ink);color:var(--zemin);border-color:var(--ink)}
.tum-isler h2{font-weight:900;letter-spacing:-.05em}

/* markalar */
.v4 .markalar{background:#fff}
.v4 .markalar .wrap>span{color:var(--soluk)}

/* hizmet satırları */
.hiz-dev{border-top:1px solid var(--cizgi)}
.hiz-dev a{border-bottom:1px solid var(--cizgi);border-radius:0;transition:padding .4s cubic-bezier(.2,.8,.2,1),background .4s}
.hiz-dev a:hover{background:#fff;padding-left:22px}
.hiz-dev h3{font-weight:800;letter-spacing:-.055em}
.hiz-dev a:hover h3{color:var(--ink)}
.hiz-dev .no,.hiz-dev p{color:var(--soluk)}
.hiz-dev .ok{background:var(--ink);border-color:var(--ink);color:var(--zemin)}
.hiz-dev a:hover .ok{background:var(--vurgu);border-color:var(--vurgu);color:#fff}
.hiz-dev video{border-radius:20px;box-shadow:0 30px 60px -24px rgba(0,0,0,.5)}
.sektor-satir span{color:var(--soluk)}
.sektor-satir a{border:1.5px solid var(--ink);font-weight:600}
.sektor-satir a:hover{background:var(--ink);color:var(--zemin)}

/* sonuçlar (rakam kartları) */
.ozet{background:var(--cizgi);border-color:var(--cizgi)}
.ozet-k{background:#fff}
.ozet-k.ana{background:var(--vurgu)}
.ozet-k.ana b{color:#fff}.ozet-k.ana span{color:rgba(255,255,255,.85)}
.ozet-k b{color:var(--ink);font-weight:900;letter-spacing:-.05em}
.ozet-k span,.ozet-rozet{color:var(--soluk)}
.vaka{background:#fff;border-color:var(--cizgi);color:var(--ink)}
.vaka-bas .eyebrow{color:var(--vurgu)}
.vaka-bas p,.vaka-rakam span{color:var(--soluk)}
.vaka-rakam{background:var(--cizgi)}
.vaka-rakam div{background:var(--zemin)}
.vaka-rakam b{font-weight:900}
.vaka-cubuk{background:rgba(13,13,13,.08)}
.vaka-etiket{background:var(--ink);color:#fff}
.vaka small{color:var(--soluk)}
.vaka-tumu{border-color:var(--ink);color:var(--ink)}
.vaka-tumu:hover{background:var(--ink);color:var(--zemin)}
.v4 #sonuclar .bas p,#sonuclar .projeler-bas p{color:var(--soluk)!important}

/* açık bölümler: beyaz */
.acik{background:#fff;color:var(--ink)}
.acik .kucuk-etiket{color:var(--ink)}
.adim .no{font-family:var(--font);font-style:normal;font-weight:900;color:var(--vurgu);letter-spacing:-.05em}
.surec,.adim+.adim{border-color:var(--cizgi)!important}

/* rakip analizi bandı ve başlat bloğu: siyah yuvarlak blok */
.rakip-bant{background:var(--ink);border-radius:36px}
.rakip-bant .kucuk-etiket{color:var(--zemin)}
.baslat{padding-left:0;padding-right:0}
.baslat .wrap{background:var(--ink);color:var(--zemin);border-radius:40px;padding:clamp(36px,6vw,90px)}
.baslat .kucuk-etiket{color:var(--zemin)}
.baslat p.alt{color:#b3afa6}
.baslat .tikler li{color:#e9e5dc}
.baslat .iletisim-liste a{color:#fff}
.baslat .form-guven{color:#b3afa6}.baslat .form-guven b{color:#fff}
.tikler li::before{background-color:var(--vurgu)}
.iletisim-liste svg{color:var(--vurgu)}
.kapanis{background:var(--ink)}

/* SSS */
.v4 .faq details,.v4 .faq details:first-child{border-color:var(--cizgi)}
.v4 .faq summary{color:var(--ink)}
.v4 .faq summary::after{background:linear-gradient(var(--ink),var(--ink)) center/14px 2px no-repeat,linear-gradient(var(--ink),var(--ink)) center/2px 14px no-repeat}
.v4 .faq details[open] summary{color:var(--vurgu)}
.v4 .faq details p,.v4 .faq .bas p{color:#3a3935}

/* alt bilgi siyah kalır, vurgu turuncu */
footer.dev-alt{background:var(--ink)}
.dev-marka{color:var(--zemin)}
.dev-marka span{color:var(--vurgu)}
.dev-alt a:hover{color:var(--vurgu)}

/* ===== alt sayfalar ===== */
.alt-sahne{background:var(--zemin);color:var(--ink)}
.alt-sahne::before{display:none}
.alt-sahne video.arka{left:auto;right:0;width:48%;opacity:1;border-bottom-left-radius:48px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 28%);mask-image:linear-gradient(90deg,transparent 0,#000 28%)}
.alt-sahne h1.dev{font-weight:900}
.alt-sahne p.alt{color:#3a3935}
.yol{color:var(--soluk)}.yol b{color:var(--ink);font-weight:700}.yol a:hover{color:var(--vurgu)}
.alt-form .analiz,.alt-form>div{box-shadow:0 40px 80px -40px rgba(0,0,0,.45)}
.ozellik{background:#fff;border:1px solid var(--cizgi);border-radius:26px}
.ozellik:hover{border-color:var(--vurgu)}
.ozellik .no{font-family:var(--font);font-style:normal;font-weight:800;color:#bdb8ae}
.ozellik .ik{background:rgba(255,77,31,.12);color:var(--vurgu)}
.ozellik h3{font-weight:800}
.ozellik p{color:var(--soluk)}
.teslim-liste li::before{background-color:var(--ink)}
.kullanimlar{background:var(--cizgi);border-color:var(--cizgi);border-radius:26px}
.kullanim{background:#fff}.kullanim:hover{background:var(--zemin)}
.kullanim em{color:var(--vurgu)}.kullanim span{color:var(--soluk)}
.mini-rakam{border-top:1px solid var(--cizgi)}
.mini-rakam span{color:var(--soluk)}
.skor-sahne{background:var(--zemin)}
.skor-sahne p.alt{color:#3a3935}.skor-sahne .tikler li{color:var(--ink)}
.form-guven{color:var(--soluk)}.form-guven b{color:var(--ink)}
.rapor-ust{background:var(--ink)}
.rapor-ust b{font-family:var(--font);font-weight:800;color:var(--vurgu)}
.rapor thead th.siz,.rapor td:last-child{background:#fff1ec}
.rapor thead th.siz{color:var(--vurgu)}
.alt-sahne .btn-ghost.wa{color:var(--ink)}

@media(max-width:900px){
  .a-giris .wrap{grid-template-columns:minmax(0,1fr)}
  .a-sutunlar{height:520px}
  .a-giris h1{font-size:clamp(52px,14vw,84px)}
  .alt-sahne video.arka{display:none}
  .baslat .wrap{border-radius:28px}
}
@media(max-width:760px){
  .a-giris{padding-top:100px}
  .serit{margin:0 -16px}
}
@media(prefers-reduced-motion:reduce){.a-akis{animation:none}}

/* koyu bloklarda çerçeveli buton açık renk kalır */
.dev-alt .btn-ghost,.baslat .btn-ghost,.rakip-bant .btn-ghost,.koyu .btn-ghost,.kapanis .btn-ghost{color:var(--zemin);border-color:rgba(243,240,233,.4)}
.dev-alt .btn-ghost:hover,.baslat .btn-ghost:hover,.rakip-bant .btn-ghost:hover,.koyu .btn-ghost:hover,.kapanis .btn-ghost:hover{background:var(--zemin);color:var(--ink)}
/* tüm başlıklardaki italik vurgular aynı dilde */
h1 i,h2 i,h3 i{font-family:var(--font)!important;font-style:italic;font-weight:800;letter-spacing:-.05em;color:var(--vurgu)}
.giris-metin p.buyuk i{margin-right:.06em}
.projeler-bas p{color:var(--soluk)!important}
html{overflow-x:clip}
@media(max-width:760px){.nav .wrap{gap:12px}.nav .btn{padding:10px 14px;font-size:13.5px}.marka .m-ad{font-size:21px}}
@media(max-width:380px){.nav-tel{display:none}}
