/* ==========================================================================
   MXGATE — Tasarım Sistemi / Design Tokens & Stiller
   Ana Sayfa v2 ve alt sayfalar için ortak stil dosyası
   ========================================================================== */

:root {
  /* Marka */
  --mx-orange:        #E8590C;
  --mx-orange-soft:   #FCEDE6;
  --mx-orange-tint:   #FCF7F3;
  --mx-orange-border: #F3E0D5;
  --mx-orange-shadow: rgba(232,89,12,.22);

  --mx-ink:           #12302E;
  --mx-ink-2:         #17201E;

  /* Teal */
  --mx-teal:          #0F766E;
  --mx-teal-dark:     #0B5C55;
  --mx-teal-500:      #0D9488;
  --mx-teal-soft:     #EAF6F3;
  --mx-teal-tint:     #F1F8F6;
  --mx-teal-border:   #D9EAE6;

  /* Metin */
  --mx-text:          #12302E;
  --mx-text-2:        #48585A;
  --mx-text-3:        #7C8B8A;
  --mx-text-muted:    #8AA09C;

  /* Yüzeyler & kenarlıklar */
  --mx-bg:            #ffffff;
  --mx-surface:       #F7FAF9;
  --mx-surface-2:     #F4F5F4;
  --mx-hero-tint:     #F4FAF8;
  --mx-hero-tint-2:   #EEF6F4;
  --mx-border:        #E4EAE9;
  --mx-border-soft:   #EEF3F2;
  --mx-border-2:      #E5E8E6;

  /* Durum */
  --mx-warning:       #E0A82E;
  --mx-danger:        #C86A6A;

  /* Footer */
  --mx-footer-text:   #A9B2B0;
  --mx-footer-text-2: #939C9A;
  --mx-footer-text-3: #7E8785;
  --mx-footer-border: #2B3432;

  /* Tipografi */
  --mx-font-head: 'Libre Franklin', sans-serif;
  --mx-font-body: 'Public Sans', system-ui, sans-serif;

  /* Ölçüler */
  --mx-maxw:   1200px;
  --mx-radius: 16px;
  --mx-radius-sm: 9px;
  --mx-radius-pill: 100px;
  --mx-pad-x: 32px;
  --mx-shadow-card: 0 24px 56px -30px rgba(18,48,46,.30);
}

/* ---- RESET ---- */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--mx-font-body);
  color: var(--mx-text);
  background: var(--mx-bg);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
h1, h2, h3, h4 { font-family: var(--mx-font-head); margin: 0; letter-spacing: -0.015em; }
p { margin: 0; }
a { color: var(--mx-teal); text-decoration: none; }
a:hover { color: var(--mx-teal-dark); }
img { max-width: 100%; }
@keyframes mxpulse { 0%,100% { opacity: .5; } 50% { opacity: 1; } }

/* ---- KAPSAYICI ---- */
.mx-container { max-width: var(--mx-maxw); margin: 0 auto; padding-left: var(--mx-pad-x); padding-right: var(--mx-pad-x); }

/* ---- TİPOGRAFİ ---- */
.mx-eyebrow { display:inline-flex; align-items:center; gap:9px; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--mx-teal); font-weight: 700; }
.mx-eyebrow--orange { color: var(--mx-orange); }
.mx-eyebrow .mx-eyebrow-line { width:22px; height:2px; background: currentColor; display:inline-block; }
.mx-h1 { font-family: var(--mx-font-head); font-weight: 800; font-size: 46px; line-height: 1.08; color: var(--mx-ink); }
.mx-h2 { font-family: var(--mx-font-head); font-weight: 800; font-size: 34px; line-height: 1.15; color: var(--mx-ink); }
.mx-lead { font-size: 18px; line-height: 1.65; color: var(--mx-text-2); }
.mx-orange-text { color: var(--mx-orange); }

/* ---- BUTONLAR ---- */
.mx-btn { display: inline-flex; align-items: center; justify-content:center; gap: 9px; font-weight: 600; font-size: 16px; border-radius: var(--mx-radius-sm); transition: background .15s, box-shadow .15s, transform .15s; cursor:pointer; }
.mx-btn svg { flex-shrink:0; }
.mx-btn-primary { background: var(--mx-orange); color: #fff; padding: 15px 28px; box-shadow: 0 10px 22px var(--mx-orange-shadow); }
.mx-btn-primary:hover { background: #D24E08; color:#fff; box-shadow: 0 12px 26px rgba(232,89,12,.30); }
.mx-btn-secondary { background: #fff; border: 1px solid #D3DEDC; color: var(--mx-ink); padding: 15px 26px; }
.mx-btn-secondary:hover { background: #F7FAF9; color: var(--mx-ink); }
.mx-btn-ink { background: var(--mx-ink); color: #fff; font-size: 14px; gap:8px; padding: 11px 22px; border-radius: 8px; }
.mx-btn-ink:hover { background: #0C221F; color:#fff; }
.mx-btn-block { display:flex; width:100%; padding: 14px; font-size:16px; border-radius:10px; }
.mx-btn-outline-ink { background:#fff; border:1.5px solid var(--mx-ink); color:var(--mx-ink); font-weight:700; }
.mx-btn-outline-ink:hover { background: var(--mx-surface); color:var(--mx-ink); }

/* ---- ROZET (pill) ---- */
.mx-pill { display: inline-flex; align-items: center; gap: 8px; background: var(--mx-teal-tint); border: 1px solid var(--mx-teal-border); color: var(--mx-teal); font-size: 13px; font-weight: 600; padding: 7px 15px; border-radius: var(--mx-radius-pill); }
.mx-pill--live { background: var(--mx-teal-soft); font-size:12px; padding:5px 11px; }
.mx-pill--live .mx-dot { width:7px; height:7px; border-radius:50%; background: var(--mx-teal-500); animation: mxpulse 1.8s infinite; }

/* ---- İKON KUTUSU ---- */
.mx-iconbox { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
.mx-iconbox--46 { width:46px; height:46px; border-radius:11px; }
.mx-iconbox--38 { width:38px; height:38px; border-radius:9px; }
.mx-iconbox--36 { width:36px; height:36px; border-radius:9px; }
.mx-iconbox--teal        { background: var(--mx-teal); }
.mx-iconbox--orange      { background: var(--mx-orange); }
.mx-iconbox--teal-soft   { background: var(--mx-teal-soft); }
.mx-iconbox--orange-soft { background: var(--mx-orange-soft); }

/* ---- ÜST ŞERİT ---- */
.mx-topbar { background: var(--mx-surface-2); color: #55605E; font-size: 13px; border-bottom: 1px solid var(--mx-border-2); }
.mx-topbar__row { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; padding:9px 0; }
.mx-topbar__badges { display:flex; align-items:center; gap:26px; flex-wrap:wrap; }
.mx-topbar__badges span { display:inline-flex; align-items:center; gap:7px; }
.mx-topbar__contact { display:flex; align-items:center; gap:18px; }
.mx-topbar__sep { color:#CBD0CE; }

/* ---- HEADER ---- */
.mx-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.94); backdrop-filter: blur(10px); border-bottom: 1px solid var(--mx-border); }
.mx-header__row { display:flex; align-items:center; gap:26px; padding:13px 0; }
.mx-logo { display:inline-flex; align-items:center; }
.mx-logo img { height:56px; width:auto; display:block; filter:drop-shadow(0 1px 2px rgba(18,48,46,.10)); }
@media (max-width:900px){ .mx-logo img { height:48px; } }
.mx-nav { display:flex; align-items:center; gap:22px; font-size:14.5px; font-weight:500; margin-left:4px; }
.mx-nav a { color: #3C4C4A; }
.mx-nav a:hover { color: var(--mx-teal-dark); }
.mx-nav a.is-active { color: var(--mx-ink); font-weight:600; }
.mx-header__right { margin-left:auto; display:flex; align-items:center; gap:20px; }

/* Açılır menü (Çözümler) */
.mx-dropdown { position:relative; }
.mx-dropdown__btn { display:inline-flex; align-items:center; gap:5px; background:none; border:none; padding:0; cursor:pointer; color:#3C4C4A; font-family:var(--mx-font-body); font-size:15px; font-weight:500; }
.mx-dropdown__btn svg { transition:transform .2s; }
.mx-dropdown:hover .mx-dropdown__btn svg { transform:rotate(180deg); }
.mx-dropdown__btn:hover, .mx-dropdown__btn.is-active { color:var(--mx-ink); font-weight:600; }
.mx-dropdown__menu { position:absolute; top:100%; left:0; width:300px; margin-top:14px; background:#fff; border:1px solid var(--mx-border); border-radius:16px; box-shadow:0 24px 48px -20px rgba(18,48,46,.28); padding:8px; opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .18s, transform .18s, visibility .18s; }
.mx-dropdown:hover .mx-dropdown__menu, .mx-dropdown:focus-within .mx-dropdown__menu { opacity:1; visibility:visible; transform:translateY(0); }
.mx-dropdown__menu::before { content:""; position:absolute; top:-14px; left:0; right:0; height:14px; }
.mx-dropdown__item { display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:11px; }
.mx-dropdown__item:hover { background:var(--mx-surface); }
.mx-dropdown__item-ic { flex-shrink:0; width:34px; height:34px; border-radius:9px; background:var(--mx-teal-soft); display:inline-flex; align-items:center; justify-content:center; }
.mx-dropdown__item:hover .mx-dropdown__item-ic { background:var(--mx-teal-tint); }
.mx-dropdown__item-txt { min-width:0; }
.mx-dropdown__item-title { display:block; font-size:14px; font-weight:600; color:var(--mx-ink); }
.mx-dropdown__item-desc { display:block; font-size:12px; color:var(--mx-text-3); margin-top:2px; }
.mx-dropdown__menu--right { left:auto; right:0; width:320px; }
.mx-dropdown__sep { height:1px; background:var(--mx-border-soft); margin:8px 6px; }
.mx-dropdown__heading { padding:6px 14px 4px; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--mx-text-muted); }
.mx-dropdown__link { display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:11px; font-size:14px; font-weight:500; color:#33433F; }
.mx-dropdown__link:hover { background:var(--mx-surface); color:var(--mx-ink); }

/* Mobil menü grup başlığı */
.mx-mobile-group { padding:14px 4px 6px; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--mx-text-muted); }
.mx-mobile-menu nav a.mx-mobile-sub { display:flex; align-items:center; gap:11px; font-size:16px; font-weight:500; padding:11px 4px 11px 8px; }
.mx-mobile-menu nav a.mx-mobile-sub svg { flex-shrink:0; }
.mx-lang { display:inline-flex; align-items:center; gap:6px; color:#3C4C4A; font-size:14px; font-weight:600; }
.mx-lang:hover { color: var(--mx-teal-dark); }
.mx-menu-btn, .mx-menu-close { display:none; background:none; border:none; padding:6px; cursor:pointer; color:var(--mx-ink); }

/* Mobil menü paneli */
.mx-mobile-menu { position:fixed; inset:0; background:#fff; z-index:60; transform:translateX(100%); transition:transform .3s ease; display:flex; flex-direction:column; }
.mx-mobile-menu.is-open { transform:translateX(0); }
.mx-mobile-menu__head { display:flex; align-items:center; justify-content:space-between; padding:16px 24px; border-bottom:1px solid var(--mx-border-soft); }
.mx-mobile-menu__head img { height:44px; }
.mx-mobile-menu nav { display:flex; flex-direction:column; padding:18px 24px; gap:4px; overflow-y:auto; }
.mx-mobile-menu nav a { color:#243936; font-size:18px; font-weight:600; padding:12px 4px; border-bottom:1px solid var(--mx-border-soft); }
.mx-mobile-menu nav a.is-active { color: var(--mx-orange); }
.mx-mobile-menu__foot { margin-top:auto; padding:20px 24px; display:flex; flex-direction:column; gap:12px; border-top:1px solid var(--mx-border-soft); }

/* ---- BÖLÜM ZEMİNLERİ ---- */
.mx-section { background:#fff; padding:92px 0; }
.mx-section--tint { background: var(--mx-surface); padding:88px 0; border-top:1px solid #EAF0EF; border-bottom:1px solid #EAF0EF; }
.mx-section-head { text-align:center; max-width:640px; margin:0 auto; }
.mx-section-head .mx-h2 { margin-top:12px; }

/* ---- HERO (ortak) ---- */
.mx-hero { position:relative; background:#fff; border-bottom:1px solid var(--mx-border-soft); overflow:hidden; }
.mx-hero__panelbg { position:absolute; top:0; right:0; width:44%; height:100%; background:linear-gradient(180deg, var(--mx-hero-tint), var(--mx-hero-tint-2)); border-left:1px solid #E7F0EE; }
.mx-hero__panelbg--40 { width:40%; border-left:none; }
.mx-hero__inner { position:relative; }
.mx-hero__grid { display:grid; grid-template-columns:1.02fr 1fr; gap:56px; align-items:center; }
.mx-hero .mx-lead { margin-top:20px; max-width:500px; }
.mx-hero__actions { display:flex; gap:14px; margin-top:32px; flex-wrap:wrap; }

/* Breadcrumb */
.mx-breadcrumb { display:flex; align-items:center; gap:8px; font-size:14px; color:var(--mx-text-muted); }
.mx-breadcrumb a { color:var(--mx-text-muted); }
.mx-breadcrumb a:hover { color: var(--mx-teal-dark); }
.mx-breadcrumb .mx-current { color:var(--mx-orange); font-weight:600; }

/* Hero rating */
.mx-rating { display:flex; align-items:center; gap:16px; margin-top:34px; padding-top:26px; border-top:1px solid #EAF0EF; }
.mx-stars { color:var(--mx-orange); font-size:15px; letter-spacing:1px; }
.mx-rating__text { font-size:14px; color:var(--mx-text-2); }
.mx-rating__text strong { color:var(--mx-ink); }

/* ---- ÖZET PANEL (hero sağ) ---- */
.mx-panel-wrap { position:relative; }
.mx-panel { background:#fff; border:1px solid var(--mx-border); border-radius:var(--mx-radius); padding:26px; box-shadow:0 24px 60px -28px rgba(18,48,46,.30); }
.mx-panel__head { display:flex; align-items:center; justify-content:space-between; }
.mx-panel__title { font-family:var(--mx-font-head); font-weight:700; font-size:15px; color:var(--mx-ink); }
.mx-panel__sub { color:var(--mx-text-muted); font-size:12px; margin-top:2px; }
.mx-donut-row { display:flex; align-items:center; gap:22px; margin-top:22px; }
.mx-donut { position:relative; width:130px; height:130px; flex-shrink:0; }
.mx-donut__center { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.mx-donut__num { font-family:var(--mx-font-head); font-weight:800; font-size:24px; color:var(--mx-ink); }
.mx-donut__label { font-size:11px; color:var(--mx-text-muted); }
.mx-legend { flex:1; display:flex; flex-direction:column; gap:12px; }
.mx-legend__row { display:flex; align-items:center; justify-content:space-between; }
.mx-legend__row > span:first-child { display:inline-flex; align-items:center; gap:9px; font-size:13.5px; color:var(--mx-text-2); }
.mx-legend__dot { width:9px; height:9px; border-radius:2px; display:inline-block; }
.mx-legend__val { font-weight:700; font-size:13.5px; color:var(--mx-ink); }
.mx-panel__meters { border-top:1px solid var(--mx-border-soft); margin-top:22px; padding-top:18px; display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.mx-meter__head { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.mx-meter__label { font-size:12.5px; color:var(--mx-text-muted); }
.mx-meter__val { font-family:var(--mx-font-head); font-weight:800; font-size:15px; }
.mx-meter__bar { height:6px; background:var(--mx-border-soft); border-radius:4px; overflow:hidden; }
.mx-meter__fill { display:block; height:100%; }
.mx-panel__badge { position:absolute; bottom:-18px; left:-18px; background:#fff; border:1px solid var(--mx-border); border-radius:12px; padding:12px 16px; box-shadow:0 12px 28px -12px rgba(18,48,46,.28); display:flex; align-items:center; gap:11px; }
.mx-panel__badge .mx-iconbox { width:34px; height:34px; border-radius:8px; background:var(--mx-teal-soft); }
.mx-panel__badge-title { font-family:var(--mx-font-head); font-weight:800; font-size:14px; color:var(--mx-ink); }
.mx-panel__badge-sub { font-size:11px; color:var(--mx-text-muted); }

/* ---- LOGO ŞERİDİ ---- */
.mx-logostrip { background:#fff; border-bottom:1px solid var(--mx-border-soft); }
.mx-logostrip__row { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; padding:28px 0; }
.mx-logostrip__label { font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--mx-text-muted); font-weight:700; }
.mx-logostrip__items { display:flex; align-items:center; gap:38px; flex-wrap:wrap; }
.mx-logostrip__items span { font-family:var(--mx-font-head); font-weight:700; font-size:17px; color:#5A6B69; }

/* ---- İSTATİSTİK BANDI ---- */
.mx-stats { background:var(--mx-surface); border-bottom:1px solid #EAF0EF; }
.mx-stats__grid { display:grid; grid-template-columns:repeat(4,1fr); padding:44px 0; }
.mx-stats__item { padding:0 28px; }
.mx-stats__item + .mx-stats__item { border-left:1px solid #E1EAE8; }
.mx-stats__num { font-family:var(--mx-font-head); font-weight:800; font-size:38px; color:var(--mx-ink); }
.mx-stats__num span { color:var(--mx-teal); }
.mx-stats__label { color:#5A6B69; font-size:14px; margin-top:4px; }

/* ---- NEDEN MXGATE (3 sütun, üst çizgili) ---- */
.mx-feature-grid { display:grid; grid-template-columns:repeat(3,1fr); margin-top:48px; }
.mx-feature { padding-top:22px; border-top:2px solid var(--mx-border); }
.mx-feature--teal { border-top-color: var(--mx-teal); }
.mx-feature-col { padding:0 36px; }
.mx-feature-col:first-child { padding-left:0; }
.mx-feature-col:last-child { padding-right:0; }
.mx-feature h3 { font-size:20px; font-weight:700; color:var(--mx-ink); margin-top:18px; }
.mx-feature p { font-size:15px; color:var(--mx-text-2); line-height:1.65; margin-top:10px; }

/* ---- NASIL ÇALIŞIR (numaralı kart) ---- */
.mx-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:52px; }
.mx-step { background:#fff; border:1px solid var(--mx-border); border-radius:14px; padding:30px; }
.mx-step__head { display:flex; align-items:center; gap:12px; }
.mx-step__num { font-family:var(--mx-font-head); font-weight:800; font-size:15px; width:34px; height:34px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:var(--mx-teal); background:var(--mx-teal-soft); }
.mx-step__num--orange { color:var(--mx-orange); background:var(--mx-orange-soft); }
.mx-step h4 { font-size:18px; font-weight:700; color:var(--mx-ink); }
.mx-step p { font-size:15px; color:var(--mx-text-2); line-height:1.6; margin-top:14px; }

/* ---- İKİ SÜTUN (problem / çözüm) ---- */
.mx-split { display:grid; gap:56px; align-items:center; }
.mx-split--12 { grid-template-columns:1fr 1.05fr; }
.mx-split--21 { grid-template-columns:1.02fr 1fr; }
.mx-split .mx-lead { margin-top:18px; max-width:460px; }
.mx-split .mx-p-muted { font-size:16px; color:var(--mx-text-3); line-height:1.65; margin-top:12px; max-width:460px; }

/* Liste kartı (problem kutusu) */
.mx-listcard { background:#fff; border:1px solid var(--mx-border); border-radius:16px; overflow:hidden; box-shadow:0 20px 46px -30px rgba(18,48,46,.28); }
.mx-listcard__head { display:flex; align-items:center; gap:10px; padding:16px 18px; border-bottom:1px solid var(--mx-border-soft); }
.mx-listcard__head span { font-family:var(--mx-font-head); font-weight:700; font-size:15px; color:var(--mx-ink); }
.mx-listrow { display:flex; align-items:center; gap:14px; padding:16px 18px; border-bottom:1px solid var(--mx-border-soft); }
.mx-listrow:last-child { border-bottom:none; }
.mx-listrow__title { font-size:15px; font-weight:600; color:var(--mx-ink); }
.mx-listrow__sub { font-size:13px; color:var(--mx-text-3); margin-top:2px; }

/* Özellik satırı (çözüm) */
.mx-featlist { margin-top:22px; }
.mx-featrow { display:flex; align-items:flex-start; gap:14px; padding:16px 0; border-bottom:1px solid var(--mx-border-soft); }
.mx-featrow:last-child { border-bottom:none; }
.mx-featrow__title { font-size:15px; font-weight:600; color:var(--mx-ink); }
.mx-featrow__sub { font-size:14px; color:#516360; line-height:1.55; margin-top:3px; }

/* Hiyerarşi görseli (turuncu ramp) */
.mx-hierarchy { background:var(--mx-surface); border:1px solid #E7EEEC; border-radius:16px; padding:26px; display:flex; flex-direction:column; gap:11px; }
.mx-hierarchy__row { display:flex; align-items:center; gap:12px; border-radius:10px; padding:13px 15px; }
.mx-hierarchy__row .mx-hi-ic { flex-shrink:0; width:30px; height:30px; border-radius:7px; background:rgba(255,255,255,.16); display:inline-flex; align-items:center; justify-content:center; }
.mx-hierarchy__eyebrow { font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.7); }
.mx-hierarchy__title { font-size:14px; font-weight:600; color:#fff; margin-top:1px; }

/* ---- KARŞILAŞTIRMA TEASER ---- */
.mx-teaser { background:var(--mx-teal-tint); border:1px solid var(--mx-teal-border); border-radius:18px; padding:48px 52px; display:grid; grid-template-columns:1.3fr 1fr; gap:48px; align-items:center; }
.mx-teaser .mx-h2 { font-size:30px; margin-top:12px; line-height:1.2; }
.mx-teaser .mx-lead { font-size:16px; margin-top:14px; max-width:440px; }
.mx-teaser__link { display:inline-flex; align-items:center; gap:8px; margin-top:22px; font-weight:600; font-size:15px; color:var(--mx-teal); }
.mx-checklist { display:flex; flex-direction:column; gap:12px; }
.mx-checklist__item { display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--mx-border); border-radius:11px; padding:14px 16px; font-size:15px; color:var(--mx-ink); font-weight:500; }

/* ---- MÜŞTERİ YORUMLARI ---- */
.mx-testi-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:48px; }
.mx-testi { background:#fff; border:1px solid var(--mx-border); border-radius:16px; padding:28px; display:flex; flex-direction:column; }
.mx-testi__quote { font-size:15.5px; color:#2E3E3B; line-height:1.65; margin-top:16px; flex:1; }
.mx-testi__foot { display:flex; align-items:center; gap:12px; margin-top:22px; padding-top:18px; border-top:1px solid var(--mx-border-soft); }
.mx-avatar { width:42px; height:42px; border-radius:50%; background:var(--mx-orange); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-family:var(--mx-font-head); font-weight:700; font-size:15px; flex-shrink:0; }
.mx-testi__name { font-size:14.5px; font-weight:700; color:var(--mx-ink); }
.mx-testi__role { font-size:13px; color:var(--mx-text-3); }

/* ---- CTA ---- */
.mx-cta { background:var(--mx-surface); border-top:1px solid #EAF0EF; }
.mx-cta__inner { padding:76px 0; text-align:center; }
.mx-cta__inner .mx-h2 { font-size:36px; max-width:680px; margin:0 auto; }
.mx-cta__inner p { font-size:18px; color:var(--mx-text-2); margin-top:16px; }
.mx-cta__actions { display:flex; gap:14px; margin-top:30px; justify-content:center; flex-wrap:wrap; }
/* CTA kutu (teal-tint) */
.mx-ctabox { background:var(--mx-teal-tint); border:1px solid var(--mx-teal-border); border-radius:18px; padding:52px; text-align:center; }
.mx-ctabox .mx-h2 { max-width:680px; margin:0 auto; }
.mx-ctabox p { font-size:17px; color:var(--mx-text-2); margin-top:14px; }
.mx-ctabox__actions { display:flex; gap:12px; margin-top:26px; justify-content:center; flex-wrap:wrap; }

/* ---- MAIL GATEWAY: güvenlik katmanları kartı ---- */
.mx-layers { background:#fff; border:1px solid var(--mx-border); border-radius:16px; padding:24px; box-shadow:var(--mx-shadow-card); }
.mx-layers__head { display:flex; align-items:center; justify-content:space-between; }
.mx-layers__head-l { display:flex; align-items:center; gap:11px; }
.mx-layers__title { font-family:var(--mx-font-head); font-weight:700; font-size:15px; color:var(--mx-ink); }
.mx-layers__sub { font-size:12px; color:var(--mx-text-muted); }
.mx-layers__list { display:flex; flex-direction:column; gap:9px; margin-top:18px; }
.mx-layerrow { display:flex; align-items:center; gap:12px; background:var(--mx-surface); border:1px solid #E7EEEC; border-radius:11px; padding:13px; }
.mx-layerrow__body { flex:1; }
.mx-layerrow__title { font-size:14px; font-weight:600; color:var(--mx-ink); }
.mx-layerrow__sub { font-size:12px; color:var(--mx-text-3); }
.mx-layerrow__pct { font-family:var(--mx-font-head); font-weight:700; font-size:13px; color:var(--mx-teal); }
.mx-layerrow__tag { font-size:12px; font-weight:600; color:var(--mx-teal); background:var(--mx-teal-soft); padding:3px 9px; border-radius:6px; }
.mx-layers__metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:16px; padding-top:16px; border-top:1px solid var(--mx-border-soft); text-align:center; }
.mx-layers__metric-num { font-family:var(--mx-font-head); font-weight:800; font-size:20px; }
.mx-layers__metric-label { font-size:11px; color:var(--mx-text-muted); }

/* Mail Gateway: nedir iki kart */
.mx-twocol { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:48px; }
.mx-infocard { border-radius:16px; padding:30px; }
.mx-infocard--teal { background:var(--mx-surface); border:1px solid #E7EEEC; }
.mx-infocard--orange { background:#FCF6F2; border:1px solid var(--mx-orange-border); }
.mx-infocard__head { display:flex; align-items:center; gap:13px; }
.mx-infocard h3 { font-size:21px; font-weight:700; color:var(--mx-ink); }
.mx-infocard p { font-size:15px; color:var(--mx-text-2); line-height:1.65; margin-top:15px; }
.mx-checkitems { display:flex; flex-direction:column; gap:10px; margin-top:18px; }
.mx-checkitems span { display:inline-flex; align-items:center; gap:10px; font-size:14px; color:#33433F; }
.mx-hero__pills { display:flex; gap:10px; margin-top:26px; flex-wrap:wrap; }
.mx-hero__pills .mx-pill { font-size:14px; padding:8px 15px; }
.mx-hero__lead-actions { display:flex; gap:12px; margin-top:30px; flex-wrap:wrap; }

/* ---- FİYATLANDIRMA ---- */
.mx-hero--center .mx-hero__center { text-align:center; max-width:720px; margin:0 auto; }
.mx-hero--center .mx-h1 { margin-top:18px; }
.mx-hero--center .mx-lead { margin:18px auto 0; max-width:none; }
.mx-pricing-wrap { max-width:1000px; margin:0 auto; padding:0 32px; transform:translateY(-40px); }
.mx-pricing-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start; }
.mx-pricecard { position:relative; background:#fff; border:1px solid var(--mx-border); border-radius:18px; padding:34px; box-shadow:0 22px 46px -28px rgba(18,48,46,.24); }
.mx-pricecard--popular { border:1.5px solid var(--mx-orange); box-shadow:0 26px 52px -26px rgba(232,89,12,.30); }
.mx-pricecard__badge { position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--mx-orange); color:#fff; font-size:12px; font-weight:700; letter-spacing:.06em; padding:6px 18px; border-radius:100px; }
.mx-pricecard__head { display:flex; align-items:center; gap:13px; }
.mx-pricecard__head h3 { font-size:22px; font-weight:800; color:var(--mx-ink); }
.mx-pricecard__head .mx-iconbox { width:46px; height:46px; border-radius:12px; }
.mx-pricecard__sub { font-size:14px; color:var(--mx-text-muted); }
.mx-pricecard p { font-size:15px; color:var(--mx-text-2); line-height:1.6; margin-top:18px; }
.mx-pricelist { display:flex; flex-direction:column; gap:12px; margin-top:22px; }
.mx-pricelist span { display:inline-flex; align-items:center; gap:11px; font-size:15px; color:#33433F; }
.mx-pricecard .mx-btn-block { margin-top:26px; }

/* ---- TABLO (karşılaştırma) ---- */
.mx-table { background:#fff; border:1px solid var(--mx-border); border-radius:16px; overflow:hidden; margin-top:36px; }
.mx-table__row { display:grid; grid-template-columns:1.6fr 1fr 1fr; }
.mx-table__row + .mx-table__row { border-top:1px solid var(--mx-border-soft); }
.mx-table__row--alt { background:#FAFCFB; }
.mx-table__head { background:var(--mx-surface-2); border-bottom:1px solid var(--mx-border-2); }
.mx-table__head .mx-th { padding:16px 24px; font-size:15px; font-weight:700; text-align:center; }
.mx-table__head .mx-th--feature { color:var(--mx-text-3); font-size:13px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; text-align:left; }
.mx-th--mx { color:var(--mx-orange); }
.mx-th--alt { color:#6B7A77; }
.mx-th--ink { color:var(--mx-ink); }
.mx-table__cell { padding:15px 24px; font-size:15px; color:#33433F; }
.mx-table__val { padding:15px; text-align:center; display:flex; align-items:center; justify-content:center; }
.mx-table__val--dash { color:#C6CFCD; }
.mx-table__val--teal { color:var(--mx-teal); font-weight:700; }
.mx-table__val--muted { color:#516360; }
.mx-table__note { text-align:center; font-size:15px; color:var(--mx-text-2); margin-top:28px; }
.mx-table__note a { font-weight:600; }

/* ---- KARŞILAŞTIRMA sayfası ---- */
.mx-vs-badges { display:flex; align-items:center; justify-content:center; gap:24px; margin-top:36px; }
.mx-vs-badge { text-align:center; }
.mx-vs-badge__ic { width:62px; height:62px; border-radius:15px; display:inline-flex; align-items:center; justify-content:center; font-family:var(--mx-font-head); font-weight:800; font-size:21px; }
.mx-vs-badge__ic--mx { background:var(--mx-orange); color:#fff; box-shadow:0 12px 26px rgba(232,89,12,.32); }
.mx-vs-badge__ic--se { background:#EAEDEC; border:1px solid #DCE2E0; color:#6B7A77; }
.mx-vs-badge__name { font-weight:600; font-size:15px; margin-top:10px; }
.mx-vs-badge__name--mx { color:var(--mx-ink); }
.mx-vs-badge__name--se { color:#6B7A77; }
.mx-vs-mid { width:38px; height:38px; border-radius:50%; background:#fff; border:1px solid #E1E8E6; display:inline-flex; align-items:center; justify-content:center; color:var(--mx-text-muted); font-size:13px; font-weight:700; }

.mx-vscards { display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start; max-width:1040px; margin:0 auto; }
.mx-vscard { border-radius:18px; padding:32px; }
.mx-vscard--mx { background:var(--mx-orange-tint); border:1.5px solid var(--mx-orange); }
.mx-vscard--se { background:#F7F9F8; border:1px solid var(--mx-border); }
.mx-vscard__head { display:flex; align-items:center; gap:13px; }
.mx-vscard__logo { width:44px; height:44px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; font-family:var(--mx-font-head); font-weight:800; font-size:16px; }
.mx-vscard__logo--mx { background:var(--mx-orange); color:#fff; }
.mx-vscard__logo--se { background:#EAEDEC; color:#6B7A77; }
.mx-vscard__head h3 { font-size:21px; font-weight:800; color:var(--mx-ink); }
.mx-vscard__rate { display:flex; align-items:center; gap:6px; margin-top:3px; }
.mx-vscard__rate .mx-stars { font-size:14px; }
.mx-vscard__rate .mx-stars--empty { color:#C6CFCD; }
.mx-vscard__rate span:last-child { font-size:13px; color:var(--mx-text-2); font-weight:600; }
.mx-vscard__list { display:flex; flex-direction:column; gap:12px; margin-top:22px; }
.mx-vscard__list span { display:inline-flex; align-items:center; gap:11px; font-size:15px; color:#33433F; }
.mx-vscard__list span.mx-muted { color:#516360; }
.mx-btn-se { display:flex; align-items:center; justify-content:center; gap:9px; background:#EAEDEC; color:#516360; font-weight:600; font-size:16px; padding:14px; border-radius:10px; margin-top:24px; }
.mx-btn-se:hover { background:#E1E5E3; color:#516360; }

/* ---- FOOTER ---- */
.mx-footer { background:var(--mx-ink-2); color:var(--mx-footer-text); }
.mx-footer__grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:40px; padding:60px 0 30px; }
.mx-footer__brand { display:flex; align-items:center; gap:11px; }
.mx-footer__brand span { font-family:var(--mx-font-head); font-weight:800; font-size:21px; color:#fff; }
.mx-footer__desc { font-size:14px; line-height:1.65; margin-top:16px; max-width:300px; color:var(--mx-footer-text-2); }
.mx-footer h4 { color:#fff; font-weight:700; font-size:14px; font-family:var(--mx-font-head); margin-bottom:16px; }
.mx-footer__col { display:flex; flex-direction:column; gap:11px; font-size:14px; }
.mx-footer a { color:var(--mx-footer-text); }
.mx-footer a:hover { color:#fff; }
.mx-footer__bottom { border-top:1px solid var(--mx-footer-border); }
.mx-footer__bottom-row { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; padding:22px 0; font-size:13px; color:var(--mx-footer-text-3); }
.mx-footer__bottom-row a { color:var(--mx-footer-text-3); }
.mx-footer__legal { display:flex; gap:22px; flex-wrap:wrap; }
.mx-footer__updated { display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--mx-footer-text-3); margin-top:4px; }
.mx-footer__updated svg { flex-shrink:0; opacity:.8; }
@media (max-width:560px){ .mx-footer__bottom-row > div:first-child { display:flex; flex-direction:column; gap:4px; } }

/* ==========================================================================
   HERO & DÜZEN VARYANTLARI (sayfalar tekdüze hissettirmesin diye)
   ========================================================================== */

/* Ortalanmış tinted hero bandı (nokta dokulu) — güvenlik/iletişim/kaynak sayfaları */
.mx-hero--band { background:var(--mx-surface); border-bottom:1px solid #EAF0EF; }
.mx-hero--band .mx-hero__panelbg { display:none; }
.mx-hero__deco { position:absolute; inset:0; background-image:radial-gradient(circle at 1px 1px, #D7E4E0 1px, transparent 0); background-size:26px 26px; -webkit-mask-image:linear-gradient(180deg,#000,transparent 85%); mask-image:linear-gradient(180deg,#000,transparent 85%); pointer-events:none; }
.mx-hero__center-wide { position:relative; text-align:center; max-width:760px; margin:0 auto; }
.mx-hero__center-wide .mx-h1 { margin-top:16px; }
.mx-hero__center-wide .mx-lead { margin:16px auto 0; }

/* Kompakt yasal/metin hero */
.mx-hero--legal { background:linear-gradient(180deg,#F7FAF9,#fff); border-bottom:1px solid var(--mx-border-soft); }

/* Koyu bölüm (vurgu bandı) */
.mx-section--dark { background:var(--mx-ink-2); color:#C6D2CF; padding:88px 0; }
.mx-section--dark .mx-h2, .mx-section--dark h3, .mx-section--dark h4 { color:#fff; }
.mx-section--dark .mx-eyebrow { color:#5FD0C4; }
.mx-section--dark .mx-lead, .mx-section--dark p { color:#AEBEBB; }

/* Genel esnek grid + kutu */
.mx-grid { display:grid; gap:24px; margin-top:48px; }
.mx-grid--2 { grid-template-columns:repeat(2,1fr); }
.mx-grid--3 { grid-template-columns:repeat(3,1fr); }
.mx-grid--4 { grid-template-columns:repeat(4,1fr); }
.mx-tile { background:#fff; border:1px solid var(--mx-border); border-radius:14px; padding:26px; }
.mx-tile--tint { background:var(--mx-surface); border-color:#E7EEEC; }
.mx-tile h3, .mx-tile h4 { font-size:18px; font-weight:700; color:var(--mx-ink); margin-top:16px; }
.mx-tile p { font-size:14.5px; color:var(--mx-text-2); line-height:1.6; margin-top:8px; }

/* Yasal / uzun metin bloğu */
.mx-prose { max-width:820px; margin:0 auto; }
.mx-prose h2 { font-family:var(--mx-font-head); font-size:23px; color:var(--mx-ink); margin:38px 0 12px; }
.mx-prose h3 { font-size:17px; color:var(--mx-ink); margin:24px 0 8px; }
.mx-prose p { font-size:15.5px; line-height:1.75; color:var(--mx-text-2); margin-bottom:14px; }
.mx-prose ul { padding-left:20px; margin:0 0 16px; }
.mx-prose li { font-size:15.5px; line-height:1.7; color:var(--mx-text-2); margin-bottom:6px; }
.mx-prose a { font-weight:600; }
.mx-prose__updated { font-size:13px; color:var(--mx-text-muted); margin-bottom:8px; }

/* İletişim formu */
.mx-form { display:flex; flex-direction:column; gap:16px; }
.mx-field label { display:block; font-size:14px; font-weight:600; color:var(--mx-ink); margin-bottom:7px; }
.mx-field input, .mx-field textarea, .mx-field select { width:100%; padding:13px 15px; border:1px solid var(--mx-border); border-radius:10px; font-family:var(--mx-font-body); font-size:15px; color:var(--mx-ink); background:#fff; }
.mx-field textarea { min-height:130px; resize:vertical; }
.mx-field input:focus, .mx-field textarea:focus, .mx-field select:focus { outline:none; border-color:var(--mx-teal); box-shadow:0 0 0 3px rgba(15,118,110,.12); }
.mx-form__row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }

/* Form uyarı kutusu (başarı/hata) */
.mx-form-alert { display:flex; align-items:flex-start; gap:12px; padding:16px 18px; border-radius:12px; margin-bottom:4px; }
.mx-form-alert strong { display:block; font-size:15px; color:var(--mx-ink); }
.mx-form-alert span { font-size:14px; color:var(--mx-text-2); }
.mx-form-alert--ok  { background:var(--mx-teal-tint); border:1px solid var(--mx-teal-border); }
.mx-form-alert--err { background:#FCEFEF; border:1px solid #F0D6D6; }

/* İletişim bilgi satırı */
.mx-contact-item { display:flex; align-items:flex-start; gap:14px; padding:16px 0; border-bottom:1px solid var(--mx-border-soft); }
.mx-contact-item:last-child { border-bottom:none; }
.mx-contact-item__label { font-size:13px; color:var(--mx-text-muted); }
.mx-contact-item__val { font-size:15px; font-weight:600; color:var(--mx-ink); margin-top:2px; }

/* SSS (details/summary) */
.mx-faq { max-width:820px; margin:40px auto 0; display:flex; flex-direction:column; gap:12px; }
.mx-faq details { background:#fff; border:1px solid var(--mx-border); border-radius:12px; padding:2px 20px; }
.mx-faq summary { list-style:none; cursor:pointer; padding:18px 0; font-family:var(--mx-font-head); font-weight:700; font-size:16px; color:var(--mx-ink); display:flex; align-items:center; justify-content:space-between; gap:12px; }
.mx-faq summary::-webkit-details-marker { display:none; }
.mx-faq summary::after { content:"+"; font-size:22px; color:var(--mx-teal); font-weight:400; line-height:1; }
.mx-faq details[open] summary::after { content:"−"; }
.mx-faq details > p { font-size:15px; line-height:1.65; color:var(--mx-text-2); padding:0 0 18px; margin:0; }

/* ==========================================================================
   RESPONSIVE  (≤900px)
   ========================================================================== */
@media (max-width: 900px) {
  :root { --mx-pad-x: 20px; }
  .mx-h1 { font-size: 34px; }
  .mx-h2 { font-size: 27px; }
  .mx-cta__inner .mx-h2 { font-size: 28px; }

  /* Header → hamburger */
  .mx-nav, .mx-header__right { display:none; }
  .mx-menu-btn { display:inline-flex; margin-left:auto; }
  .mx-menu-close { display:inline-flex; }
  .mx-topbar__contact { display:none; }

  /* Grid'ler tek sütun */
  .mx-hero__grid, .mx-split--12, .mx-split--21,
  .mx-twocol, .mx-teaser, .mx-pricing-grid, .mx-vscards,
  .mx-grid--2, .mx-grid--3, .mx-grid--4, .mx-form__row { grid-template-columns:1fr; gap:24px; }
  .mx-hero__panelbg { display:none; }

  .mx-feature-grid { grid-template-columns:1fr; gap:28px; }
  .mx-feature-col { padding:0; }
  .mx-steps, .mx-testi-grid { grid-template-columns:1fr; }
  .mx-stats__grid { grid-template-columns:1fr 1fr; gap:24px 0; }
  .mx-stats__item:nth-child(3) { border-left:none; }
  .mx-stats__item { padding:0 20px; }

  .mx-teaser { padding:32px 24px; }
  .mx-ctabox { padding:36px 24px; }
  .mx-pricing-wrap { transform:none; padding-top:8px; }
  .mx-logostrip__row { justify-content:center; }
  .mx-panel__badge { left:0; }

  /* Tablo → yatay kaydırma */
  .mx-table { overflow-x:auto; }
  .mx-table__row { min-width:520px; }

  .mx-footer__grid { grid-template-columns:1fr 1fr; gap:32px 24px; }
}

/* Orta ekran: 4'lü grid 2 sütun */
@media (min-width: 561px) and (max-width: 900px) {
  .mx-grid--4 { grid-template-columns:1fr 1fr; }
}

@media (max-width: 560px) {
  .mx-stats__grid { grid-template-columns:1fr; }
  .mx-stats__item + .mx-stats__item { border-left:none; padding-top:6px; }
  .mx-footer__grid { grid-template-columns:1fr; }
  .mx-hero__actions .mx-btn, .mx-cta__actions .mx-btn, .mx-ctabox__actions .mx-btn { width:100%; }
}

/* ==========================================================================
   FEED.TXT DÜZELTMELERİ & GELİŞTİRMELER
   ========================================================================== */

/* Eksik başlık sınıfı */
.mx-h3 { font-family:var(--mx-font-head); font-weight:700; font-size:21px; color:var(--mx-ink); }

/* Koyu bölümdeki kutu metinleri okunur olsun (round-robin "Kimler Kullanmalı" vb.) */
.mx-section--dark .mx-tile { background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.12); }
.mx-section--dark .mx-tile h3, .mx-section--dark .mx-tile h4 { color:#fff; }
.mx-section--dark .mx-tile p { color:#AEBEBB; }
.mx-section--dark .mx-infocard { background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.12); }
.mx-section--dark .mx-infocard h3, .mx-section--dark .mx-infocard h4 { color:#fff; }
.mx-section--dark .mx-infocard p, .mx-section--dark .mx-checkitems span, .mx-section--dark .mx-featrow__sub { color:#AEBEBB; }
.mx-section--dark .mx-featrow__title { color:#fff; }

/* ---- Güvenlik analizi (security-check) ---- */
.mx-sc-form { display:flex; align-items:center; gap:8px; max-width:560px; margin:32px auto 0; background:#fff; border:1px solid var(--mx-border); border-radius:999px; padding:8px 8px 8px 22px; box-shadow:0 14px 34px rgba(18,48,46,.10); }
.mx-sc-result { background:#fff; }
.mx-sc-score { display:flex; align-items:center; gap:32px; background:#fff; border:1px solid var(--mx-border); border-radius:18px; padding:32px; box-shadow:var(--mx-shadow-card); }
.mx-sc-gauge { width:132px; height:132px; border-radius:50%; flex-shrink:0; background:conic-gradient(var(--mx-ring,#0F766E) calc(var(--mx-pct,0)*1%), #EEF3F2 0); display:flex; align-items:center; justify-content:center; }
.mx-sc-gauge__inner { width:104px; height:104px; border-radius:50%; background:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.mx-sc-grade { font-family:var(--mx-font-head); font-weight:800; font-size:30px; line-height:1; }
.mx-sc-score__num { font-family:var(--mx-font-head); font-weight:700; font-size:18px; color:var(--mx-ink); margin-top:2px; }
.mx-sc-score__num span { font-size:12px; color:var(--mx-text-muted); font-weight:500; }
.mx-sc-issue { display:flex; align-items:flex-start; gap:10px; background:#fff; border:1px solid var(--mx-border); border-radius:10px; padding:13px 16px; font-size:14.5px; color:var(--mx-text-2); }
.mx-sc-issue svg { flex-shrink:0; margin-top:1px; }

/* ---- Hero giriş animasyonu (ince, tüm sayfalarda) ---- */
@keyframes mxfadeup { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
@keyframes mxfloat  { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-9px); } }
.mx-hero__inner .mx-eyebrow,
.mx-hero__inner .mx-h1,
.mx-hero__inner .mx-lead,
.mx-hero__inner .mx-hero__actions,
.mx-hero__inner .mx-hero__pills,
.mx-hero__inner .mx-hero__lead-actions,
.mx-hero__inner .mx-rating,
.mx-hero__inner .mx-vs-badges,
.mx-hero__inner .mx-sc-form { animation: mxfadeup .6s ease both; }
.mx-hero__inner .mx-h1 { animation-delay:.06s; }
.mx-hero__inner .mx-lead { animation-delay:.12s; }
.mx-hero__inner .mx-hero__actions,
.mx-hero__inner .mx-hero__pills,
.mx-hero__inner .mx-hero__lead-actions,
.mx-hero__inner .mx-rating,
.mx-hero__inner .mx-sc-form { animation-delay:.18s; }
.mx-panel-wrap, .mx-layers { animation: mxfadeup .7s .15s ease both; }
.mx-panel-wrap { will-change:transform; }
.mx-panel__badge { animation: mxfloat 4.5s ease-in-out infinite; }

/* ---- "Müşterilerin tercihi" widget (sol alt, animasyonlu) ---- */
.mx-trust-widget { position:fixed; left:20px; bottom:20px; z-index:40; display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--mx-border); border-radius:14px; padding:12px 16px 12px 13px; box-shadow:0 16px 40px -14px rgba(18,48,46,.30); animation: mxwidgetin .6s .8s ease both; max-width:290px; }
@keyframes mxwidgetin { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
.mx-trust-widget__ic { width:40px; height:40px; border-radius:10px; background:var(--mx-teal-soft); display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
.mx-trust-widget__num { font-family:var(--mx-font-head); font-weight:800; font-size:16px; color:var(--mx-ink); line-height:1.1; }
.mx-trust-widget__num span { color:var(--mx-orange); }
.mx-trust-widget__label { font-size:12px; color:var(--mx-text-3); margin-top:2px; }
.mx-trust-widget__dot { width:8px; height:8px; border-radius:50%; background:var(--mx-teal-500); animation: mxpulse 1.8s infinite; flex-shrink:0; }
.mx-trust-widget__close { position:absolute; top:6px; right:6px; border:none; background:none; cursor:pointer; color:#B7C2C0; line-height:0; padding:2px; }

/* ---- Tablo: mobilde tam görünürlük (sabit ilk sütun + kaydırma) ---- */
.mx-table__scroll { position:relative; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ==========================================================================
   RESPONSIVE — feed.txt mobil düzeltmeleri
   ========================================================================== */
@media (max-width: 900px) {
  /* 1) Üst şerit tek satır */
  .mx-topbar__row { flex-wrap:nowrap; gap:12px; padding:8px 0; }
  .mx-topbar__badges { flex-wrap:nowrap; gap:14px; overflow-x:auto; font-size:11.5px; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .mx-topbar__badges::-webkit-scrollbar { display:none; }
  .mx-topbar__badges span { white-space:nowrap; }
  .mx-topbar__badges span svg { flex-shrink:0; }

  /* 2) Anasayfa uyumlu platformlar şeridi ortalı ve orantılı */
  .mx-logostrip__row { flex-direction:column; gap:14px; text-align:center; padding:22px 0; }
  .mx-logostrip__items { justify-content:center; gap:16px 24px; }
  .mx-logostrip__items span { font-size:15px; }

  /* 3) Footer: marka ortalı, linkler 2 sütun */
  .mx-footer__grid { grid-template-columns:1fr 1fr; gap:28px 20px; }
  .mx-footer__grid > div:first-child { grid-column:1 / -1; text-align:center; }
  .mx-footer__brand { justify-content:center; }
  .mx-footer__desc { margin-left:auto; margin-right:auto; }

  /* Güvenlik analizi skoru mobilde dikey */
  .mx-sc-score { flex-direction:column; text-align:center; gap:20px; padding:26px; }
  .mx-sc-score__meta .mx-pill { margin-left:auto; margin-right:auto; }

  /* Tablolar: sabit ilk sütun, sağ kenar gölgesi ile kaydırma ipucu */
  .mx-table { position:relative; }

  /* Sabit widget mobilde biraz küçülsün, taşmasın */
  .mx-trust-widget { left:12px; right:12px; bottom:12px; max-width:none; }
}

@media (max-width: 560px) {
  /* Footer küçük ekranda da 2 değil tek başlık taşarsa: yine 2 sütun kalsın (feed isteği) */
  .mx-footer__grid { grid-template-columns:1fr 1fr; }
}

/* Sistemik mobil taşma koruması: inline grid-template-columns:repeat(...) satırlarını
   mobilde geçersiz kıl (flex tabanlı carousel'ler etkilenmez). */
@media (max-width: 900px) {
  .mx-hero__grid, .mx-split--12, .mx-split--21, .mx-twocol, .mx-teaser,
  .mx-pricing-grid, .mx-vscards, .mx-grid--2, .mx-grid--3, .mx-grid--4,
  .mx-feature-grid, .mx-steps, .mx-testi-grid, .mx-form__row {
    grid-template-columns: 1fr !important;
  }
}
@media (min-width: 561px) and (max-width: 900px) {
  .mx-grid--4 { grid-template-columns: 1fr 1fr !important; }
}

/* ==========================================================================
   ENTEGRASYON REHBERLERİ (kod blokları, adımlar, notlar)
   ========================================================================== */
.mx-code { background:#12302E; color:#D7E4E0; border-radius:12px; padding:16px 18px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13.5px; line-height:1.65; overflow-x:auto; white-space:pre; margin:14px 0; -webkit-overflow-scrolling:touch; }
.mx-code b, .mx-code strong { color:#5FD0C4; font-weight:600; }
.mx-codewrap { margin:14px 0; }
.mx-codewrap__label { display:flex; align-items:center; justify-content:space-between; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--mx-text-muted); margin-bottom:6px; font-weight:600; }
.mx-codewrap__label .mx-copy { cursor:pointer; color:var(--mx-teal); text-transform:none; letter-spacing:0; font-weight:600; display:inline-flex; align-items:center; gap:5px; background:none; border:none; font-family:var(--mx-font-body); font-size:12px; }
.mx-codewrap .mx-code { margin:0; }

.mx-guide-step { display:flex; gap:18px; padding:24px 0; border-bottom:1px solid var(--mx-border-soft); }
.mx-guide-step:last-child { border-bottom:none; }
.mx-guide-step__num { flex-shrink:0; width:38px; height:38px; border-radius:50%; background:var(--mx-orange-soft); color:var(--mx-orange); font-family:var(--mx-font-head); font-weight:800; font-size:15px; display:inline-flex; align-items:center; justify-content:center; }
.mx-guide-step__body { flex:1; min-width:0; }
.mx-guide-step h3 { font-size:18px; font-weight:700; color:var(--mx-ink); }
.mx-guide-step p { font-size:15px; color:var(--mx-text-2); line-height:1.65; margin-top:8px; }

.mx-note { background:var(--mx-teal-tint); border:1px solid var(--mx-teal-border); border-radius:12px; padding:16px 18px; display:flex; gap:12px; font-size:14.5px; color:#33433F; line-height:1.6; }
.mx-note svg { flex-shrink:0; margin-top:1px; }
.mx-note--warn { background:#FDF6EC; border-color:#F0E0C0; }
.mx-note--orange { background:var(--mx-orange-tint); border-color:var(--mx-orange-border); }

/* Entegrasyon kartı (cPanel/Plesk/Postfix/Exim seçici) */
.mx-int-card { display:flex; align-items:center; gap:14px; background:#fff; border:1px solid var(--mx-border); border-radius:14px; padding:18px 20px; transition:border-color .15s, box-shadow .15s, transform .15s; }
.mx-int-card:hover { border-color:var(--mx-teal-border); box-shadow:0 14px 30px -18px rgba(18,48,46,.30); transform:translateY(-2px); }
.mx-int-card__body { flex:1; min-width:0; }
.mx-int-card__title { font-family:var(--mx-font-head); font-weight:700; font-size:16px; color:var(--mx-ink); }
.mx-int-card__sub { font-size:13px; color:var(--mx-text-3); margin-top:2px; }

.mx-prevnext { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:36px; padding-top:28px; border-top:1px solid var(--mx-border-soft); flex-wrap:wrap; }

/* ==========================================================================
   AI-SEO (GEO) — kaynak notu, güncelleme tarihi, uzman alıntısı, answer-block
   ========================================================================== */
.mx-stats__source { text-align:center; font-size:12.5px; color:var(--mx-text-muted); margin-top:18px; }
.mx-stats__source a { color:var(--mx-teal); font-weight:600; }
/* Sayfa altı kaynak notu (footer'dan hemen önce, ince şerit) */
.mx-page-source { border-top:1px solid var(--mx-border-soft); background:var(--mx-surface); padding:18px 0; }
.mx-page-source .mx-container { text-align:center; font-size:12.5px; color:var(--mx-text-muted); }

.mx-updated { display:inline-flex; align-items:center; gap:7px; font-size:13px; color:var(--mx-text-3); }
.mx-updated svg { flex-shrink:0; }

.mx-quote { background:var(--mx-teal-tint); border:1px solid var(--mx-teal-border); border-left:4px solid var(--mx-teal); border-radius:14px; padding:26px 28px; }
.mx-quote__text { font-family:var(--mx-font-head); font-weight:600; font-size:19px; line-height:1.5; color:var(--mx-ink); }
.mx-quote__cite { display:flex; align-items:center; gap:12px; margin-top:18px; }
.mx-quote__avatar { width:42px; height:42px; border-radius:50%; background:var(--mx-teal); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-family:var(--mx-font-head); font-weight:700; flex-shrink:0; }
.mx-quote__name { font-size:14.5px; font-weight:700; color:var(--mx-ink); }
.mx-quote__role { font-size:13px; color:var(--mx-text-3); }

.mx-answer { font-size:16px; line-height:1.65; color:var(--mx-text-2); background:var(--mx-surface); border-left:3px solid var(--mx-teal); border-radius:0 10px 10px 0; padding:14px 18px; margin-top:14px; }
