/* ═══════════════════════════════════════════════════════════════════
   FlexTwin raf ölçekli HPC — çözüm özeti  |  gtm-css/flextwin.css
   Kapsam: .gtm-ftw   (tam genişlik blog yazısı)
═══════════════════════════════════════════════════════════════════ */

.gtm-ftw {
  --n:#0A1628; --nd:#04080F; --ac:#003A70; --ac2:#6FB3E8; --cy:#28C8D8;
  --r:#D22630; --g:#00A550; --ink:#2B3038; --mu:#5A6472; --line:#DCE1E8; --soft:#F4F7FA;
  font-family: 'IBM Plex Sans', system-ui, sans-serif;
  color: var(--ink); line-height: 1.6;
  width: 100vw; max-width: 100vw;
  margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
}

/* Tema kapsayıcısı ve tekrarlı başlık */
body.gtm-landing .entry-header { display: none !important; }
body.gtm-landing .site-content > .ast-container { max-width: 100% !important; padding: 0 !important; }
body.gtm-landing .content-area.primary { margin-top: 0 !important; }
body.gtm-landing .site-main > article { padding-top: 0 !important; }
body.gtm-landing .post-thumb-img-content,
body.gtm-landing .ast-single-post-order,
body.gtm-landing .entry-meta { display: none !important; }

.gtm-ftw img { max-width: 100%; display: block; }
.gtm-ftw .wrap { max-width: 1440px; margin: 0 auto; padding: 0 28px; }
.gtm-ftw .wrap-dar { max-width: 1020px; margin: 0 auto; padding: 0 28px; }

/* ---------- HERO ---------- */
.gtm-ftw .f-hero {
  position: relative; background: var(--nd); color: #fff; overflow: hidden;
  padding: 84px 0 0;
}
.gtm-ftw .f-hero::before {
  content: ''; position: absolute; inset: 0;
  background:
    radial-gradient(900px 420px at 78% 18%, rgba(40,200,216,.16), transparent 62%),
    linear-gradient(140deg, #04080F 0%, #0A1B33 52%, #062D52 100%);
}
.gtm-ftw .f-hero .wrap { position: relative; z-index: 2; }
.gtm-ftw .f-hero-grid {
  display: grid; grid-template-columns: 1.05fr .95fr; gap: 46px; align-items: center;
}
@media(max-width:980px){ .gtm-ftw .f-hero-grid { grid-template-columns: 1fr; gap: 30px; } }
.gtm-ftw .f-kicker {
  display: inline-flex; align-items: center; gap: 11px; margin-bottom: 20px;
  font-size: 12px; font-weight: 700; letter-spacing: 2.2px; text-transform: uppercase;
  color: var(--cy);
}
.gtm-ftw .f-kicker::before { content: ''; width: 34px; height: 2px; background: var(--r); }
.gtm-ftw .f-hero h1 {
  font-size: clamp(31px, 4.3vw, 55px); font-weight: 500; line-height: 1.1;
  letter-spacing: -1.6px; color: #fff; margin: 0 0 20px;
}
.gtm-ftw .f-hero h1 em { font-style: normal; color: var(--cy); }
.gtm-ftw .f-hero p.lead {
  font-size: clamp(16px, 1.5vw, 18.5px); color: #C0D2E4; font-weight: 300;
  line-height: 1.68; margin: 0 0 28px; max-width: 60ch;
}
.gtm-ftw .f-hero-marka {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  padding-top: 22px; border-top: 1px solid rgba(255,255,255,.15);
  font-size: 13px; color: #8DA6C0; font-weight: 300;
}
.gtm-ftw .f-hero-marka b { color: #fff; font-weight: 600; letter-spacing: .3px; }
.gtm-ftw .f-hero-img { position: relative; }
.gtm-ftw .f-hero-img img {
  width: 100%; height: auto; filter: drop-shadow(0 30px 60px rgba(0,0,0,.55));
}
.gtm-ftw .f-hero-not {
  margin-top: 10px; font-size: 12.5px; color: #7E97B2; font-weight: 300; text-align: center;
}

/* ---------- SAYI ŞERİDİ ---------- */
.gtm-ftw .f-stats {
  position: relative; z-index: 2; display: grid; grid-template-columns: repeat(4,1fr);
  background: rgba(255,255,255,.05); border-top: 1px solid rgba(255,255,255,.12);
  margin-top: 56px;
}
@media(max-width:900px){ .gtm-ftw .f-stats { grid-template-columns: repeat(2,1fr); } }
.gtm-ftw .f-stat {
  padding: 28px 24px; border-right: 1px solid rgba(255,255,255,.12);
}
.gtm-ftw .f-stat:last-child { border-right: none; }
.gtm-ftw .f-stat b {
  display: block; font-size: clamp(25px,2.9vw,36px); font-weight: 500; color: #fff;
  letter-spacing: -1.1px; line-height: 1.1; margin-bottom: 5px;
}
.gtm-ftw .f-stat b span { color: var(--cy); }
.gtm-ftw .f-stat i { font-style: normal; font-size: 12.5px; color: #90A8C2; letter-spacing: .4px; }

/* ---------- BLOKLAR ---------- */
.gtm-ftw .f-block { padding: 74px 0; background: #fff; }
.gtm-ftw .f-block.alt { background: var(--soft); }
.gtm-ftw .f-block.dark { background: var(--n); color: #BCCCDD; }
.gtm-ftw .f-block.dark h2, .gtm-ftw .f-block.dark h3 { color: #fff; }
.gtm-ftw h2 {
  font-size: clamp(26px,3.2vw,39px); font-weight: 500; color: var(--n);
  letter-spacing: -1.1px; line-height: 1.17; margin: 0 0 18px;
}
.gtm-ftw h3 { font-size: 20px; font-weight: 600; color: var(--n); letter-spacing: -.4px; margin: 0 0 12px; }
.gtm-ftw .f-block p { font-size: 16.5px; font-weight: 300; line-height: 1.75; color: var(--mu); margin: 0 0 16px; }
.gtm-ftw .f-block.dark p { color: #AEC0D2; }
.gtm-ftw .f-lead { max-width: 76ch; }
.gtm-ftw .f-lead strong { color: var(--n); font-weight: 600; }
.gtm-ftw .f-block.dark .f-lead strong { color: #fff; }

/* ---------- İKİ SÜTUN ---------- */
.gtm-ftw .f-two { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
@media(max-width:940px){ .gtm-ftw .f-two { grid-template-columns: 1fr; gap: 26px; } }
.gtm-ftw .f-two img { border: 1px solid var(--line); background: #fff; }

/* ---------- ÖZELLİK LİSTESİ ---------- */
.gtm-ftw .f-list { list-style: none; margin: 0; padding: 0; }
.gtm-ftw .f-list li {
  position: relative; padding-left: 27px; margin-bottom: 13px;
  font-size: 15.5px; font-weight: 300; line-height: 1.62; color: var(--ink);
}
.gtm-ftw .f-block.dark .f-list li { color: #C3D3E3; }
.gtm-ftw .f-list li::before {
  content: ''; position: absolute; left: 0; top: 8px; width: 9px; height: 9px;
  border-right: 2px solid var(--cy); border-bottom: 2px solid var(--cy);
  transform: rotate(-45deg);
}
.gtm-ftw .f-list li b { font-weight: 600; color: var(--n); }
.gtm-ftw .f-block.dark .f-list li b { color: #fff; }

/* ---------- RAF HESABI ---------- */
.gtm-ftw .f-math { display: grid; grid-template-columns: repeat(5,1fr); gap: 0; border: 1px solid rgba(255,255,255,.14); }
@media(max-width:900px){ .gtm-ftw .f-math { grid-template-columns: repeat(2,1fr); } }
.gtm-ftw .f-math > div {
  padding: 24px 20px; border-right: 1px solid rgba(255,255,255,.14);
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.gtm-ftw .f-math > div:last-child { border-right: none; background: rgba(40,200,216,.09); }
.gtm-ftw .f-math b {
  display: block; font-size: 25px; font-weight: 500; color: #fff; letter-spacing: -.7px; margin-bottom: 5px;
}
.gtm-ftw .f-math > div:last-child b { color: var(--cy); }
.gtm-ftw .f-math i { font-style: normal; font-size: 12.5px; color: #90A8C2; line-height: 1.45; display: block; }

/* ---------- TABLO ---------- */
.gtm-ftw .f-tblwrap { overflow-x: auto; }
.gtm-ftw table.f-tbl { width: 100%; border-collapse: collapse; background: #fff; font-size: 15px; min-width: 520px; }
.gtm-ftw table.f-tbl th {
  background: var(--n); color: #fff; padding: 14px 16px; text-align: left;
  font-weight: 600; font-size: 13.5px; letter-spacing: .3px;
}
.gtm-ftw table.f-tbl td { padding: 13px 16px; border-bottom: 1px solid var(--line); font-weight: 300; }
.gtm-ftw table.f-tbl td:first-child { font-weight: 600; color: var(--n); }
.gtm-ftw table.f-tbl tr:last-child td { border-bottom: none; background: #F0F9FB; font-weight: 600; color: var(--n); }
.gtm-ftw table.f-tbl tr:hover td { background: #FAFCFF; }
.gtm-ftw table.f-tbl tr:last-child:hover td { background: #E8F6F9; }

/* ---------- KONFİGÜRASYON KARTLARI ---------- */
.gtm-ftw .f-cfg { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media(max-width:900px){ .gtm-ftw .f-cfg { grid-template-columns: 1fr; } }
.gtm-ftw .f-cfg-card {
  border: 1px solid var(--line); background: #fff; padding: 30px 28px; border-top: 3px solid var(--ac);
}
.gtm-ftw .f-cfg-card:last-child { border-top-color: var(--cy); }
.gtm-ftw .f-cfg-card .tag {
  display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 1.3px;
  padding: 5px 11px; border-radius: 4px; margin-bottom: 14px; text-transform: uppercase;
  background: rgba(0,58,112,.09); color: var(--ac);
}
.gtm-ftw .f-cfg-card:last-child .tag { background: rgba(40,200,216,.14); color: #0B7C88; }
.gtm-ftw .f-cfg-card h3 { font-size: 21px; margin-bottom: 8px; }
.gtm-ftw .f-cfg-card .big {
  font-size: 34px; font-weight: 500; color: var(--n); letter-spacing: -1px; margin: 4px 0 14px;
}
.gtm-ftw .f-cfg-card .big span { font-size: 15px; color: var(--mu); font-weight: 300; letter-spacing: 0; }

/* ---------- ÜRÜN KARTI ---------- */
.gtm-ftw .f-prod {
  display: grid; grid-template-columns: 300px 1fr; gap: 30px; align-items: center;
  border: 1px solid var(--line); background: #fff; padding: 28px; text-decoration: none;
  transition: border-color .18s, box-shadow .18s, transform .18s;
}
@media(max-width:820px){ .gtm-ftw .f-prod { grid-template-columns: 1fr; gap: 18px; } }
.gtm-ftw a.f-prod:hover { border-color: var(--ac); transform: translateY(-3px); box-shadow: 0 16px 36px rgba(16,24,40,.1); }
.gtm-ftw .f-prod-img { background: #fff; display: flex; align-items: center; justify-content: center; }
.gtm-ftw .f-prod-img img { width: 100%; height: auto; object-fit: contain; }
.gtm-ftw .f-prod .sku { font-size: 13px; font-weight: 700; letter-spacing: 1px; color: var(--ac); display: block; margin-bottom: 7px; }
.gtm-ftw .f-prod .tt { font-size: 19px; font-weight: 600; color: var(--n); letter-spacing: -.4px; display: block; margin-bottom: 12px; }
.gtm-ftw .f-prod .go { display: inline-flex; align-items: center; gap: 9px; font-size: 14px; font-weight: 600; color: var(--r); margin-top: 12px; }
.gtm-ftw a.f-prod:hover .go { gap: 14px; }

/* ---------- KULLANIM ---------- */
.gtm-ftw .f-use { display: grid; grid-template-columns: repeat(5,1fr); gap: 0; border-top: 1px solid var(--line); }
@media(max-width:1050px){ .gtm-ftw .f-use { grid-template-columns: repeat(2,1fr); } }
@media(max-width:560px){ .gtm-ftw .f-use { grid-template-columns: 1fr; } }
.gtm-ftw .f-use > div { padding: 28px 24px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.gtm-ftw .f-use > div:last-child { border-right: none; }
.gtm-ftw .f-use b { display: block; font-size: 16.5px; font-weight: 600; color: var(--n); margin-bottom: 9px; letter-spacing: -.3px; }
.gtm-ftw .f-use p { font-size: 14.5px; margin: 0; line-height: 1.6; }

/* ---------- TÜRKİYE ---------- */
.gtm-ftw .f-tr { border: 1px solid var(--line); border-top: 3px solid var(--r); background: #fff; padding: 36px 34px; }
.gtm-ftw .f-tr h3 { font-size: 22px; margin-bottom: 14px; }

/* ---------- SSS ---------- */
.gtm-ftw .f-faq { max-width: 1020px; margin: 0 auto; padding: 0 28px; }
.gtm-ftw .f-faq details { border-bottom: 1px solid var(--line); }
.gtm-ftw .f-faq details:first-of-type { border-top: 1px solid var(--line); }
.gtm-ftw .f-faq summary {
  padding: 23px 48px 23px 0; font-weight: 600; color: var(--n); cursor: pointer;
  font-size: 17.5px; list-style: none; position: relative; letter-spacing: -.3px;
}
.gtm-ftw .f-faq summary::-webkit-details-marker { display: none; }
.gtm-ftw .f-faq summary::after {
  content: ''; position: absolute; right: 8px; top: 50%; width: 12px; height: 12px;
  border-right: 2px solid var(--ac); border-bottom: 2px solid var(--ac);
  transform: translateY(-70%) rotate(45deg); transition: transform .2s;
}
.gtm-ftw .f-faq details[open] summary::after { transform: translateY(-30%) rotate(225deg); }
.gtm-ftw .f-faq .a { padding: 0 40px 25px 0; font-size: 15.5px; color: var(--mu); font-weight: 300; line-height: 1.75; }
.gtm-ftw .f-faq .a a { color: var(--ac); font-weight: 600; }

/* ---------- CTA ---------- */
.gtm-ftw .f-cta {
  background: linear-gradient(120deg,#04080F,#0A1B33 48%,#064A6B); color: #fff;
  padding: 74px 40px; text-align: center;
}
.gtm-ftw .f-cta b {
  display: block; font-size: clamp(25px,3.4vw,38px); font-weight: 500; color: #fff;
  letter-spacing: -1.1px; line-height: 1.16; margin-bottom: 15px;
}
.gtm-ftw .f-cta p { color: #B0C4D8; font-size: 16.5px; max-width: 720px; margin: 0 auto 30px; font-weight: 300; }
.gtm-ftw .f-cta .btns { display: flex; gap: 15px; justify-content: center; flex-wrap: wrap; }
.gtm-ftw .f-cta a {
  display: inline-flex; align-items: center; gap: 10px; padding: 15px 34px; border-radius: 9999px;
  font-weight: 600; font-size: 15.5px; text-decoration: none; transition: all .18s;
}
.gtm-ftw .f-cta a.b1 { background: var(--cy); color: #04222A; }
.gtm-ftw .f-cta a.b1:hover { background: #fff; gap: 15px; }
.gtm-ftw .f-cta a.b2 { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,.45); }
.gtm-ftw .f-cta a.b2:hover { border-color: #fff; background: rgba(255,255,255,.1); }

/* ---------- KAYNAK ---------- */
.gtm-ftw .f-src {
  background: var(--soft); border-top: 1px solid var(--line);
  padding: 26px 0; font-size: 13.5px; color: var(--mu); font-weight: 300;
}
.gtm-ftw .f-src a { color: var(--ac); font-weight: 600; }
