/* İkon Fikir — sayfa düzeni varyantları
   Amaç: il × hizmet, il ve hizmet sayfalarının her biri farklı bir bilgi mimarisi ve
   kullanıcı akışı sunsun (hero, bölüm sırası, bileşen tipi, form konumu, bağlantı gruplaması).
   Tüm renkler / yazı tipleri style.css'teki değişkenlerden gelir. */

/* ---------- Ortak yardımcılar ---------- */
.x-sec{padding:4.2rem 0}
.x-sec--tight{padding:3rem 0}
.x-head{max-width:44rem;margin:0 0 2rem}
.x-head h2{margin-bottom:.4em}
.x-head .lead{margin-bottom:0}
.x-head.center{margin-left:auto;margin-right:auto;text-align:center}
.x-head.center .lead{margin-left:auto;margin-right:auto}
.x-cols2{columns:2;column-gap:2.5rem}
.x-cols2>li{break-inside:avoid}
.check-list.x-2col{display:grid;grid-template-columns:1fr 1fr;gap:.2rem 2rem}
.x-reading{max-width:46rem}

/* ---------- HERO varyantları ---------- */
/* hero-b: sağda teklif kartı olan bölünmüş hero */
.hero-b-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:3rem;align-items:center}
.hero-b .hero-card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:var(--radius);padding:1.6rem;backdrop-filter:blur(6px)}
.hero-b .hero-card h3{color:#fff;font-size:1.2rem}
.hero-b .hero-card p{color:rgba(255,255,255,.8);font-size:.95rem}
.hero-b .hero-card .btn--line{border-color:#fff;color:#fff}
.hero-b .hero-card .btn--line:hover{background:#fff;color:var(--black)}
.hero-b .hero-card .svc-ico{background:rgba(255,141,129,.18);color:var(--coral)}
.hero-b .hero-card .mini-ticks{margin:1rem 0 0}
.hero-b .hero-card .mini-ticks .ico{color:var(--coral)}
.hero-b .hero-card .mini-ticks li{color:rgba(255,255,255,.85);font-size:.9rem}

/* hero-c: açık zeminli editoryal hero */
.page-hero.hero-c{background:linear-gradient(180deg,var(--soft),#fff);color:var(--ink);padding:2.6rem 0 2.8rem;border-bottom:1px solid var(--line)}
.page-hero.hero-c::before{display:none}
.hero-c h1{color:var(--black);position:relative;padding-left:1.1rem;border-left:.35rem solid var(--red);max-width:26ch}
.hero-c h1 em{color:var(--red)}
.hero-c .lead--light{color:var(--muted)}
.hero-c .eyebrow--light{color:var(--red)}
.hero-c .crumbs li+li::before{color:var(--muted)}
.hero-c .crumbs a{color:var(--muted)}.hero-c .crumbs a:hover{color:var(--red)}
.hero-c .crumbs li[aria-current]{color:var(--ink)}
.hero-c .btn--ghost{border-color:var(--black);color:var(--black)}
.hero-c .btn--ghost:hover{background:var(--black);color:#fff}
.hero-c .hero-facts-x{display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;list-style:none;margin:0}
.hero-c .hero-facts-x li{display:flex;gap:.45rem;align-items:center;font-size:.9rem;color:var(--ink);font-weight:500}
.hero-c .hero-facts-x .ico{color:var(--red)}

/* hero-a'ya eklenen hızlı bilgi şeridi */
.hero-strip{display:flex;flex-wrap:wrap;gap:.5rem 1.8rem;list-style:none;margin:0;padding-top:1.2rem;border-top:1px solid rgba(255,255,255,.16)}
.hero-strip li{display:flex;gap:.45rem;align-items:center;font-size:.88rem;color:rgba(255,255,255,.85)}
.hero-strip .ico{color:var(--coral)}

/* ---------- Giriş + yan kart düzenleri ---------- */
.x-intro-rev{direction:rtl}.x-intro-rev>*{direction:ltr}
.x-intro-single .x-reading p{font-size:1.04rem}
.x-bignum{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1.6rem 0 0}
.x-bignum div{background:#fff;border:1px solid var(--line);border-radius:var(--radius-s);padding:1rem 1.2rem}
.x-bignum b{display:block;color:var(--red);font-size:1.6rem;line-height:1.1;font-weight:600}
.x-bignum span{font-size:.85rem;color:var(--muted)}

/* ---------- İçindekiler (TOC) düzeni ---------- */
.x-doc{display:grid;grid-template-columns:15rem minmax(0,1fr);gap:3rem;align-items:start}
.x-toc{position:sticky;top:7rem}
.x-toc-nav{border-left:2px solid var(--line);padding-left:1rem;margin-bottom:1.4rem}
.x-toc-nav p{font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 .6rem}
.x-toc-nav a{display:block;padding:.3rem 0;color:var(--ink);text-decoration:none;font-size:.92rem;font-weight:500}
.x-toc-nav a:hover{color:var(--red)}
.x-toc .side-card{padding:1.2rem;box-shadow:none}
.x-toc .side-card h3{font-size:1.02rem}
.x-toc .side-card p{font-size:.88rem}
.x-doc-main>section{scroll-margin-top:6.5rem}
.x-doc-main>section+section{margin-top:3.2rem;padding-top:3.2rem;border-top:1px solid var(--line)}

/* ---------- Sektör bileşenleri ---------- */
.x-rows{display:grid;gap:.9rem}
.x-row{display:grid;grid-template-columns:3rem minmax(0,1fr);gap:1rem;align-items:start;padding:1.2rem 1.3rem;border:1px solid var(--line);border-radius:var(--radius-s);background:#fff}
.x-row .svc-ico{margin:0}
.x-row h3{margin-bottom:.25em;font-size:1.05rem}
.x-row p{margin:0;color:var(--muted);font-size:.95rem}
.x-table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff}
.x-table th,.x-table td{padding:1.1rem 1.3rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.x-table tr:last-child>*{border-bottom:0}
.x-table th{width:28%;font-weight:600;color:var(--black);background:var(--soft)}
.x-table td{color:var(--muted);font-size:.95rem}
.x-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(17rem,1fr);gap:1rem;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:.6rem}
.x-strip>*{scroll-snap-align:start}
.x-tile{background:#fff;border:1px solid var(--line);border-top:.3rem solid var(--red);border-radius:var(--radius-s);padding:1.4rem}
.x-tile h3{font-size:1.05rem}.x-tile p{margin:0;color:var(--muted);font-size:.94rem}
.x-zig{display:grid;gap:0}
.x-zig-item{display:grid;grid-template-columns:5rem minmax(0,1fr);gap:1.4rem;padding:1.6rem 0;border-top:1px solid var(--line);align-items:start}
.x-zig-item:last-child{border-bottom:1px solid var(--line)}
.x-zig-item i{font-style:normal;font-size:2.6rem;font-weight:500;line-height:1;color:rgba(220,34,15,.35)}
.x-zig-item h3{margin-bottom:.3em}.x-zig-item p{margin:0;color:var(--muted);max-width:60ch}
.x-pillcard{display:flex;flex-wrap:wrap;gap:1rem}
.x-pillcard>div{flex:1 1 15rem;background:#fff;border:1px solid var(--line);border-radius:1.6rem;padding:1.3rem 1.5rem}
.x-pillcard h3{display:inline-flex;gap:.5rem;align-items:center;font-size:1rem;background:rgba(220,34,15,.08);color:var(--red);padding:.3rem .8rem;border-radius:999px;margin-bottom:.7rem}
.x-pillcard p{margin:0;color:var(--muted);font-size:.94rem}

/* ---------- Süreç bileşenleri ---------- */
.x-timeline{list-style:none;position:relative;margin:0;padding:0 0 0 2.6rem}
.x-timeline::before{content:"";position:absolute;left:1.05rem;top:.5rem;bottom:.5rem;width:2px;background:linear-gradient(var(--red),rgba(220,34,15,.1))}
.x-timeline li{position:relative;padding:0 0 1.6rem}
.x-timeline li:last-child{padding-bottom:0}
.x-timeline li>span{position:absolute;left:-2.6rem;top:0;width:2.2rem;height:2.2rem;border-radius:50%;display:grid;place-items:center;background:var(--red);color:#fff;font-weight:600;font-size:.88rem;box-shadow:0 0 0 .4rem #fff}
.x-timeline h3{margin:0 0 .2em;font-size:1.05rem}.x-timeline p{margin:0;color:var(--muted);font-size:.95rem}
.x-stepper{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:s;position:relative}
.x-stepper li{position:relative;padding:3.4rem 1.2rem 0 0}
.x-stepper li::before{content:"";position:absolute;left:0;right:0;top:1.15rem;height:2px;background:var(--line)}
.x-stepper li>span{position:absolute;left:0;top:0;width:2.3rem;height:2.3rem;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font-weight:600;font-size:.9rem;z-index:1}
.x-stepper h3{font-size:1rem;margin-bottom:.3em}.x-stepper p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.55}
.x-grid4{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.x-grid4 li{padding:1.6rem 1.6rem 1.6rem 5.4rem;position:relative;border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);background:rgba(255,255,255,.04)}
.x-grid4 li>span{position:absolute;left:1.4rem;top:1.3rem;font-size:2.6rem;font-weight:500;line-height:1;color:var(--coral)}
.x-grid4 h3{color:#fff;margin-bottom:.3em;font-size:1.08rem}.x-grid4 p{margin:0;color:rgba(255,255,255,.72);font-size:.94rem}
.x-mini-flow{list-style:none;display:flex;gap:.6rem;flex-wrap:wrap;margin:1.2rem 0 1.4rem}
.x-mini-flow li{flex:1 1 9rem;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:var(--radius-s);padding:.8rem .9rem}
.x-mini-flow span{display:inline-grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--red);color:#fff;font-size:.75rem;font-weight:600;margin-bottom:.3rem}
.x-mini-flow b{display:block;color:#fff;font-size:.92rem;font-weight:600}
.x-mini-flow em{display:block;font-style:normal;color:rgba(255,255,255,.7);font-size:.8rem;line-height:1.4;margin-top:.15rem}
.x-flow-inline{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;list-style:none;margin:0}
.x-flow-inline li{padding:1rem 1.2rem;border-left:3px solid var(--red);background:#fff;border-radius:0 var(--radius-s) var(--radius-s) 0}
.x-flow-inline b{display:block;font-weight:600}.x-flow-inline span{color:var(--muted);font-size:.92rem}

/* ---------- SSS düzenleri ---------- */
.x-faq-2col{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:3rem;align-items:start}
.x-faq-2col .faq-h{position:sticky;top:7rem}
.x-faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:.9rem 1.2rem;align-items:start}
.x-faq-grid .faq-item{margin:0}
.x-faq-qa{display:grid;gap:1.4rem}
.x-faq-qa article{border-left:3px solid var(--red);padding:.2rem 0 .2rem 1.2rem}
.x-faq-qa h3{font-size:1.05rem;margin-bottom:.35em}.x-faq-qa p{margin:0;color:var(--muted)}

/* ---------- Bağlantı grupları ---------- */
.x-linkgroups{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1.6rem 2rem}
.x-linkgroup h3{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;border-bottom:2px solid var(--red);display:inline-block;padding-bottom:.3rem;margin-bottom:.8rem}
.x-linkgroup ul{list-style:none}
.x-linkgroup li a{display:flex;justify-content:space-between;gap:.6rem;padding:.55rem 0;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:.93rem;font-weight:500}
.x-linkgroup li a::after{content:"→";color:var(--red);transition:transform .2s}
.x-linkgroup li a:hover{color:var(--red)}.x-linkgroup li a:hover::after{transform:translateX(.25rem)}
.x-linklist{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 2.5rem}
.x-linklist a{display:flex;justify-content:space-between;padding:.8rem 0;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;font-weight:500}
.x-linklist a::after{content:"→";color:var(--red)}
.x-linklist a:hover{color:var(--red)}
.x-hscroll{display:flex;gap:.6rem;overflow-x:auto;padding:.3rem 0 .9rem;scroll-snap-type:x proximity}
.x-hscroll .chip-link{white-space:nowrap;scroll-snap-align:start;flex:none}
.x-region{margin-top:2.6rem;padding-top:2rem;border-top:1px solid var(--line)}
.x-region h2{font-size:1.35rem}
.x-region-box{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.2rem;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem 1.6rem;margin-top:2.4rem}
.x-region-box h2{font-size:1.2rem;margin:0 0 .6rem}
.x-region-box .chip-links{margin:0}

/* ---------- Form bölümü varyantları ---------- */
.quote.q-light{background:var(--soft);color:var(--ink)}
.quote.q-light .intro h2{color:var(--black)}
.quote.q-light .intro>p{color:var(--muted)}
.quote.q-light .eyebrow--light{color:var(--red)}
.quote.q-light .intro-call{color:var(--ink)}
.quote.q-light .tick{color:var(--red)}
.quote.q-light .checks li{color:var(--ink)}
.quote.q-light::before,.quote.q-light::after{display:none}
.quote.q-flip .quote-grid{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
.quote.q-flip .quote-grid>.intro{order:2}
.quote.q-tight{padding:3.2rem 0}

/* ---------- Varyanta özel ince ayarlar ---------- */
.lay-v4 .x-sec--band{background:var(--black);color:#e8e8ee}
.lay-v4 .x-sec--band h2{color:#fff}.lay-v4 .x-sec--band .eyebrow{color:var(--coral)}
.lay-v6 .x-sec--band{background:var(--black);color:#e8e8ee}
.lay-v6 .x-sec--band h2{color:#fff}.lay-v6 .x-sec--band .eyebrow{color:var(--coral)}
.x-soft{background:var(--soft)}

/* ---------- Hizmet sayfası varyantları ---------- */
.svc-lay-b .split--top{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr)}
.svc-lay-b .split--top>aside{order:-1}
.svc-lay-c .steps{grid-template-columns:1fr}
.svc-lay-c .steps li{display:grid;grid-template-columns:3rem 1fr;gap:0 1rem;padding:1.1rem 1.3rem}
.svc-lay-c .steps li>span{grid-row:span 2;margin:0}
.svc-lay-c .steps li h3{margin:0}.svc-lay-c .steps li p{margin:0}

/* ---------- Duyarlı ---------- */
@media(max-width:62rem){
  .x-doc{grid-template-columns:1fr;gap:1.6rem}
  .x-toc{position:static}
  .x-toc-nav{display:flex;flex-wrap:wrap;gap:.2rem 1.2rem;border-left:0;border-bottom:2px solid var(--line);padding:0 0 .8rem}
  .x-toc-nav p{width:100%}
  .hero-b-grid{grid-template-columns:1fr;gap:1.6rem}
  .x-faq-2col{grid-template-columns:1fr;gap:1rem}
  .x-faq-2col .faq-h{position:static}
  .x-stepper{grid-template-columns:1fr 1fr;row-gap:1.8rem}
  .x-grid4{grid-template-columns:1fr}
  .x-region-box{grid-template-columns:1fr}
  .svc-lay-b .split--top>aside{order:0}
  .x-intro-rev{direction:ltr}
}
@media(max-width:40rem){
  .x-sec{padding:3rem 0}
  .check-list.x-2col,.x-faq-grid,.x-linklist,.x-flow-inline,.x-bignum{grid-template-columns:1fr}
  .x-cols2{columns:1}
  .x-table th,.x-table td{display:block;width:auto}
  .x-table th{border-bottom:0;padding-bottom:.2rem}
  .x-stepper{grid-template-columns:1fr}
  .x-zig-item{grid-template-columns:3.2rem 1fr;gap:.8rem}
  .x-zig-item i{font-size:1.8rem}
  .x-strip{grid-auto-columns:82%}
  .hero-c h1{padding-left:.8rem}
}
@media(prefers-reduced-motion:reduce){.x-linkgroup li a::after{transition:none}}

/* ---------- Ek bileşenler ---------- */
.x-mini-t{margin:.8rem 0 -.6rem;color:#fff;font-size:.95rem}
.x-rows--2{grid-template-columns:1fr 1fr}
a.x-row--link{text-decoration:none;color:var(--ink);transition:.2s}
a.x-row--link:hover{border-color:var(--red);box-shadow:var(--shadow);transform:translateY(-2px)}
.x-svc-list li a{display:block;padding:.65rem 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.x-svc-list li a::after{content:none}
.x-svc-list b{display:block;font-weight:600;font-size:.95rem}
.x-svc-list small{display:block;color:var(--muted);font-size:.82rem;line-height:1.45;margin-top:.1rem}
.x-svc-list li a:hover b{color:var(--red)}
.x-linkgroups--rich{grid-template-columns:repeat(auto-fit,minmax(18rem,1fr))}
@media(max-width:62rem){.x-rows--2{grid-template-columns:1fr}}

/* açık zeminli form bölümünde okunabilirlik */
.quote.q-light .x-mini-t,.quote.q-light .x-mini-flow b{color:var(--black)}
.quote.q-light .x-mini-flow li{background:#fff;border-color:var(--line)}
.quote.q-light .x-mini-flow em{color:var(--muted)}
.quote.q-light .intro-call a,.quote.q-light .intro a{color:var(--red)}
.quote.q-light .checks li,.quote.q-light .checks{color:var(--ink)}
.quote.q-light .tick{background:rgba(220,34,15,.12)}
.quote.q-light .hl-light{color:var(--red)}