/* stil-kutusuz.css · 12 Eyl 2026 · kart kart gorunumden cikis (Fable brifi FABLE_ROROWEB_KUTUSUZ_12eyl.md)
   Kural: kenarlikli kutu yalniz portfoy kartlari ve iki hizmet blogunda kalir. Geri kalan her sey cizgi ve boslukla ayrilir.
   stil-yenileme.css'ten SONRA yuklenir. Metin, renk paleti, bolum sirasi degismez. Golge, degrade, animasyon yok. */

/* ---- genel: genislik, bosluk, eyebrow, baslik ---- */
.wrap{max-width:1120px}
section{padding:112px 0}
h2{font-size:40px;line-height:1.08}
.eyebrow{display:block;font:700 .72rem/1 var(--yazi-baslik);letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);margin:0 0 14px}
section .alt{margin-bottom:40px}

/* ---- rakam seridi: kutu yok, dikey ince cizgiler, ustte ve altta yatay cizgi ---- */
.rakamlar{gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0}
.rakamlar::before{display:none}
.rakam{background:transparent;border:0;border-left:1px solid var(--line);border-radius:0;padding:6px 28px}
.rakam:first-child{border-left:0;padding-left:0}
.rakam b{font-size:40px}
.rakam span{font-size:.9rem}

/* ---- what makes us different: dort sutun, amber kisa cizgi ---- */
.fark{grid-template-columns:repeat(4,1fr);gap:48px}
.fark .f,.fark .f:hover{background:transparent;border:0;border-radius:0;padding:0;box-shadow:none;backdrop-filter:none;transform:none}
.fark .f::before{content:"";display:block;width:32px;height:2px;background:var(--acc);margin:0 0 16px}
.fark .f h3{font-size:1.05rem;margin:0 0 8px;display:block}
.fark .f h3 i{display:none}
.fark .f p{font-size:.95rem;line-height:1.6}

/* ---- two services: kutular kalir ama hafifler; teklif dugmesi metin baglantisi ---- */
.hizmet,.hizmet:hover{background:#0D182B;border:1px solid #1A2740;border-radius:12px;box-shadow:none}
.hizmet .hz-link{align-self:flex-start;margin-top:auto;color:var(--acc);font:700 .95rem/1 var(--yazi-baslik);text-decoration:none;padding:6px 0}
.hizmet .hz-link:hover{color:var(--acc2);text-decoration:underline}

/* ---- our work: kart cerceveli, metin bloku zeminsiz ---- */
#isler .r,#isler .r:hover{background:transparent;border:0;border-radius:0;padding:0;box-shadow:none;gap:10px}
#isler .r .rg{margin:0;border:1px solid var(--line);border-radius:12px;background:#0b0e14}
#isler .r:hover .rg{border-color:var(--acc)}
#isler .r .ad{font-size:1.02rem;margin-top:4px}
#isler .r .ne{font-size:.9rem}
#isler .r .et span{font-size:.7rem;background:transparent;border:1px solid var(--line);color:var(--ink2);padding:2px 8px}
#isler .ref{gap:28px 24px}
#isler .kat{font:700 .72rem/1 var(--yazi-baslik);letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);margin:36px 0 14px}
#isler .kat-alt{margin:0 0 18px}

/* ---- sectors: iki sutun, ikon solda, kutu yok, bloklar arasi yatay cizgi ---- */
.sektorler{display:grid;grid-template-columns:1fr 1fr;gap:0 56px}
.sk,.sk:hover{background:transparent;border:0;border-radius:0;padding:28px 0;box-shadow:none;backdrop-filter:none;transform:none;border-bottom:1px solid var(--line);display:grid;grid-template-columns:40px 1fr;gap:18px;align-items:start}
.sektorler .sk:nth-child(-n+2){padding-top:0}
.sektorler .sk:nth-last-child(-n+2){border-bottom:0}
.sk-ust{display:contents}
.sk-ikon,.sk:hover .sk-ikon{width:40px;height:40px;background:transparent;border:0;border-radius:0;display:block;color:var(--buz);font-size:0;transform:none}
.sk-ikon svg{width:40px;height:40px;display:block;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sk h3{grid-column:2;margin:0 0 8px;font-size:1.05rem}
.sk ul{grid-column:2;margin:0;padding-left:1.1em;color:var(--ink2);font-size:.95rem}
.sk li{margin:0 0 4px}
.sk li.sk-asist{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line);list-style:none;margin-left:-1.1em;padding-left:0}
.sk-not{margin-top:28px}

/* ---- process: uc sutun, dikey cizgi, kutu yok ---- */
.adimlar{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
#surec .adim,#surec .adim:hover,.adim,.adim:hover{background:transparent;border:0;border-left:1px solid var(--line);border-radius:0;padding:4px 36px;box-shadow:none;backdrop-filter:none;transform:none}
#surec .adimlar .adim:first-child,.adimlar .adim:first-child{border-left:0;padding-left:0}
.adim-no{font-size:44px;line-height:1;margin:0 0 14px;color:var(--acc)}
.adim h3{font-size:1.05rem;margin:0 0 8px}
.adim p{font-size:.95rem;line-height:1.6}

/* ---- contact: kutu yok, iki sutunlu duz liste; form dogrudan zeminde ---- */
#iletisim .wrap{display:grid;grid-template-columns:1fr 1fr;gap:20px 64px;align-items:start}
#iletisim h2,#iletisim .eyebrow,#iletisim .alt{grid-column:1/-1}
#iletisim .alt{margin-bottom:8px}
.ile,.ile:hover{background:transparent;border:0;border-radius:0;padding:0;box-shadow:none}
.ile .sat{padding:12px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:130px 1fr;gap:12px;align-items:baseline}
.ile .sat:last-child{border-bottom:1px solid var(--line)}
.ile .k{color:var(--ink2);font-size:.86rem;min-width:0}
.ile .v{font-weight:500}
.ile .v a{color:var(--buz)}
.rw-form,.rw-form:hover{background:transparent;border:0;border-radius:0;padding:0;box-shadow:none;margin:0}
.rw-form .rw-soz{display:block;color:var(--ink);font:600 1rem/1.5 var(--yazi-baslik);margin:0 0 16px}
.rw-form input,.rw-form select,.rw-form textarea{background:transparent;border:1px solid var(--line)}
.rw-form input:focus,.rw-form select:focus,.rw-form textarea:focus{background:var(--bg2)}

/* ---- mobil ---- */
@media (max-width:900px){
  .fark{grid-template-columns:1fr 1fr;gap:32px}
  #iletisim .wrap{grid-template-columns:1fr}
}
@media (max-width:760px){
  section{padding:72px 0}
  h2{font-size:30px}
  .rakamlar{grid-template-columns:1fr 1fr;gap:0}
  .rakam{padding:12px 16px 12px 0;border-left:0;border-top:1px solid var(--line)}
  .rakam:nth-child(-n+2){border-top:0}
  .rakam:nth-child(2n){border-left:1px solid var(--line);padding-left:16px}
  .rakam b{font-size:32px}
  .fark{grid-template-columns:1fr;gap:28px}
  .sektorler{grid-template-columns:1fr;gap:0}
  .sektorler .sk:nth-child(2){padding-top:28px}
  .sektorler .sk:nth-last-child(2){border-bottom:1px solid var(--line)}
  .adimlar{grid-template-columns:1fr;gap:0}
  #surec .adim,#surec .adim:hover,.adim,.adim:hover{border-left:0;border-top:1px solid var(--line);padding:24px 0}
  #surec .adimlar .adim:first-child,.adimlar .adim:first-child{border-top:0;padding-top:0}
  .ile .sat{grid-template-columns:1fr;gap:2px}
}