/* =========================================================
   VEXTA HOSTING — Modernization layer (2026)
   Enhances the existing design: animations, polish, protection.
   Brand green: #41aa00
   ========================================================= */

:root{
  --vx-green:#41aa00; --vx-green-d:#2c7800; --vx-green-l:#63c522; --vx-lime:#8fd94a;
}

/* ---------- Smooth base ---------- */
html{ scroll-behavior:smooth; }
*{ -webkit-tap-highlight-color:transparent; }
body{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }

/* ---------- Modern scrollbar ---------- */
*{ scrollbar-width:thin; scrollbar-color:var(--vx-green) transparent; }
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{ background:linear-gradient(180deg,var(--vx-green-l),var(--vx-green-d)); border-radius:20px; border:2px solid rgba(255,255,255,.6); }
::-webkit-scrollbar-thumb:hover{ background:var(--vx-green); }

/* ---------- Scroll progress bar ---------- */
#vx-progress{ position:fixed; top:0; left:0; height:3px; width:0%; z-index:99999;
  background:linear-gradient(90deg,var(--vx-lime),var(--vx-green),var(--vx-green-d)); box-shadow:0 0 10px rgba(65,170,0,.6);
  transition:width .1s linear; }

/* ---------- Scroll reveal ---------- */
@media (prefers-reduced-motion: no-preference){
  .vx-reveal{ opacity:0; transform:translateY(30px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); will-change:opacity,transform; }
  .vx-reveal.vx-in{ opacity:1; transform:none; }
  .vx-reveal.vx-d1{ transition-delay:.08s } .vx-reveal.vx-d2{ transition-delay:.16s }
  .vx-reveal.vx-d3{ transition-delay:.24s } .vx-reveal.vx-d4{ transition-delay:.32s }
}

/* ---------- Hover polish (common site elements) ---------- */
@media (hover:hover){
  .card, .bs-card, .price-card, .pricing-card, .package, .paket, .feature, .box, .service-box, [class*="card"]{
    transition:transform .32s cubic-bezier(.2,.7,.2,1), box-shadow .32s cubic-bezier(.2,.7,.2,1) !important;
  }
  .card:hover, .bs-card:hover, .price-card:hover, .pricing-card:hover, .package:hover, .paket:hover, .feature:hover, .service-box:hover{
    transform:translateY(-8px) !important; box-shadow:0 26px 55px rgba(12,26,16,.14) !important;
  }
  a.btn, button.btn, .btn, [class*="btn-"]{ transition:transform .2s ease, box-shadow .28s ease, filter .28s ease !important; }
  a.btn:hover, button.btn:hover, .btn:hover{ transform:translateY(-2px); filter:saturate(1.08) brightness(1.03); }
  /* subtle image zoom inside cards/thumbs */
  .card img, [class*="card"] img, .thumb img, figure img{ transition:transform .5s cubic-bezier(.2,.7,.2,1); }
  .card:hover img, [class*="card"]:hover img, figure:hover img{ transform:scale(1.045); }
}

/* ---------- Buttons: shine sweep ---------- */
.btn, a.btn, button.btn{ position:relative; overflow:hidden; }
.btn::after, a.btn::after{ content:""; position:absolute; top:0; left:-120%; width:60%; height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.35),transparent); transform:skewX(-20deg); transition:left .6s ease; pointer-events:none; }
.btn:hover::after, a.btn:hover::after{ left:130%; }

/* ---------- Image watermark protection ---------- */
img{ -webkit-user-drag:none; -khtml-user-drag:none; -moz-user-drag:none; -o-user-drag:none; user-drag:none; }
.vx-noselect{ -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; }
/* keep form fields selectable/usable */
input, textarea, select, [contenteditable]{ -webkit-user-select:text !important; user-select:text !important; }

/* ---------- Back-to-top ---------- */
#vx-top{ position:fixed; right:22px; bottom:22px; width:50px; height:50px; border-radius:14px; z-index:99998;
  display:grid; place-items:center; cursor:pointer; opacity:0; visibility:hidden; transform:translateY(16px) scale(.9);
  background:linear-gradient(135deg,var(--vx-green-l),var(--vx-green-d)); color:#fff; box-shadow:0 12px 30px rgba(65,170,0,.4);
  transition:opacity .3s ease, transform .3s ease, box-shadow .3s ease; border:none; }
#vx-top.vx-show{ opacity:1; visibility:visible; transform:none; }
#vx-top:hover{ transform:translateY(-3px) scale(1.04); box-shadow:0 16px 40px rgba(65,170,0,.5); }
#vx-top svg{ width:22px; height:22px; }

/* ---------- Gentle entrance for whole page ---------- */
@media (prefers-reduced-motion: no-preference){
  body{ animation:vx-fade .5s ease both; }
  @keyframes vx-fade{ from{ opacity:0 } to{ opacity:1 } }
}

/* ---------- Floating badge micro-animation ---------- */
@media (prefers-reduced-motion: no-preference){
  @keyframes vx-float{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-9px) } }
  .vx-float{ animation:vx-float 4s ease-in-out infinite; }
}

/* ---------- Print / copy deterrent ---------- */
@media print{ body{ display:none !important; } }

/* ============================================================
   VEXTA homepage sections: hero slider + comparison + theme flash
   ============================================================ */
.vx-hero-slider{ max-width:1240px; margin:0 auto; padding:34px 0 10px; overflow:hidden; position:relative; }
.vx-slider-track{ display:flex; width:100%; transition:transform .7s cubic-bezier(.5,.05,.2,1); }
.vx-slide{ flex:0 0 100%; min-width:100%; box-sizing:border-box; display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center; padding:24px 34px; }
.vx-slide-visual{ min-width:0; }
.vx-slide-text h2{ font-size:clamp(2rem,4vw,3.1rem); font-weight:800; color:var(--ink,#0c1a10); line-height:1.1; margin:14px 0 16px; letter-spacing:-.02em; }
.vx-slide-text p{ color:#5f7267; font-size:1.05rem; line-height:1.7; max-width:520px; }
.vx-grad{ background:linear-gradient(120deg,#63c522,#2c7800); -webkit-background-clip:text; background-clip:text; color:transparent; display:inline-block; }
.vx-eyebrow{ display:inline-flex; align-items:center; gap:7px; font-weight:700; font-size:.76rem; letter-spacing:.12em; color:#2c7800; background:#eef8e6; border:1px solid #d9edc4; padding:7px 15px; border-radius:100px; }
.vx-eyebrow.dark{ color:#2c7800; }
.vx-slide-cta{ display:flex; gap:14px; margin:28px 0 22px; flex-wrap:wrap; }
.vx-btn{ display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:1rem; padding:15px 28px; border-radius:100px; cursor:pointer; transition:transform .2s, box-shadow .3s, filter .3s; border:1.5px solid transparent; text-decoration:none; }
.vx-btn-primary{ background:linear-gradient(135deg,#63c522,#2c7800); color:#fff; box-shadow:0 12px 30px rgba(65,170,0,.32); }
.vx-btn-primary:hover{ transform:translateY(-2px); box-shadow:0 16px 38px rgba(65,170,0,.42); }
.vx-btn-ghost{ background:#fff; color:#0c1a10; border-color:#e6ede2; }
.vx-btn-ghost:hover{ border-color:#41aa00; color:#2c7800; transform:translateY(-2px); }
.vx-chips{ display:flex; gap:10px; flex-wrap:wrap; }
.vx-chip{ font-weight:700; font-size:.8rem; color:#5f7267; background:#f4f8f1; border:1px solid #e6ede2; padding:7px 14px; border-radius:10px; }
.vx-slide-visual{ position:relative; }
.vx-visual-card{ background:linear-gradient(160deg,#0f2417,#0a1610); border-radius:26px; padding:26px; box-shadow:0 30px 70px rgba(12,26,16,.22); border:1px solid rgba(143,217,74,.14); color:#dfeee4; }
.vx-vc-top{ display:flex; align-items:center; gap:7px; margin-bottom:20px; }
.vx-dot{ width:11px; height:11px; border-radius:50%; } .vx-dot.r{ background:#ff5f57 } .vx-dot.y{ background:#febc2e } .vx-dot.g{ background:#28c840 }
.vx-vc-badge{ margin-left:auto; font-size:.72rem; font-weight:700; color:#8fd94a; background:rgba(143,217,74,.12); padding:5px 11px; border-radius:100px; }
.vx-vc-row{ display:flex; justify-content:space-between; align-items:center; padding:9px 0; font-size:.9rem; }
.vx-vc-row span{ color:#9fc0ac } .vx-vc-row b{ color:#fff; font-weight:700 }
.vx-vc-bar{ height:7px; border-radius:100px; background:rgba(255,255,255,.09); overflow:hidden; margin-bottom:4px; }
.vx-vc-bar i{ display:block; height:100%; background:linear-gradient(90deg,#8fd94a,#41aa00); border-radius:100px; }
.vx-float{ position:absolute; background:#fff; border-radius:16px; box-shadow:0 18px 44px rgba(12,26,16,.18); padding:13px 17px; display:flex; align-items:center; gap:12px; }
.vx-float b{ display:block; font-size:.98rem; color:#0c1a10; font-weight:800; line-height:1.1 } .vx-float small{ font-size:.72rem; color:#5f7267 }
.vx-fi{ width:38px; height:38px; border-radius:11px; background:linear-gradient(135deg,#63c522,#2c7800); color:#fff; display:grid; place-items:center; font-size:1.1rem; }
.vx-f1{ bottom:-16px; left:0; } .vx-f2{ top:-14px; right:0; }
.vx-visual-card{ max-width:100%; }
.vx-dots{ display:flex; gap:9px; justify-content:center; margin-top:18px; }
.vx-dots button{ width:11px; height:11px; border-radius:100px; background:#d6e0cf; border:none; cursor:pointer; transition:all .3s; }
.vx-dots button.active{ width:30px; background:linear-gradient(90deg,#63c522,#2c7800); }
.vx-reviews{ display:flex; align-items:center; justify-content:center; gap:34px; margin-top:26px; padding-top:22px; border-top:1px solid #eef2ec; flex-wrap:wrap; }
.vx-review{ display:flex; align-items:center; gap:12px; } .vx-review b{ display:block; font-weight:800; color:#0c1a10; font-size:.98rem } .vx-review small{ color:#5f7267; font-size:.78rem }
.vx-stars{ color:#f5b301; font-size:1.15rem; letter-spacing:2px; }
.vx-review-sep{ width:1px; height:36px; background:#e6ede2; }

/* comparison */
.vx-compare{ padding:64px 0; }
.vx-compare-inner{ max-width:1240px; margin:0 auto; padding:0 24px; }
.vx-compare-head{ text-align:center; max-width:760px; margin:0 auto 44px; }
.vx-compare-head h2{ font-size:clamp(1.8rem,3.4vw,2.6rem); font-weight:800; color:var(--ink,#0c1a10); margin:12px 0 14px; }
.vx-compare-head p{ color:#5f7267; line-height:1.7; }
.vx-compare-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:34px; align-items:start; }
.vx-ctable{ display:flex; flex-direction:column; gap:14px; }
.vx-chead{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:14px; padding:0 22px 8px; font-size:.74rem; font-weight:800; letter-spacing:.08em; color:#8a9a90; }
.vx-chead-us{ color:#2c7800; }
.vx-crow{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:14px; align-items:center; background:#fff; border:1px solid #eef2ec; border-radius:20px; padding:20px 22px; box-shadow:0 6px 20px rgba(12,26,16,.05); transition:transform .3s, box-shadow .3s; }
.vx-crow:hover{ transform:translateY(-3px); box-shadow:0 16px 40px rgba(12,26,16,.09); }
.vx-ccrit h4{ font-size:1.05rem; font-weight:800; color:#0c1a10; margin-bottom:3px; } .vx-ccrit p{ font-size:.82rem; color:#8a9a90; }
.vx-cbad, .vx-cgood{ display:flex; gap:10px; align-items:flex-start; font-size:.85rem; line-height:1.45; padding:14px; border-radius:14px; }
.vx-cbad{ background:#fdf1f1; color:#8a6a6a; } .vx-cgood{ background:#f1f9e8; color:#3a5a25; }
.vx-x{ flex:none; width:22px; height:22px; border-radius:50%; background:#f4d0d0; color:#c0392b; display:grid; place-items:center; font-weight:800; font-size:.8rem; }
.vx-check{ flex:none; width:22px; height:22px; border-radius:50%; background:#c8eca4; color:#2c7800; display:grid; place-items:center; font-weight:800; font-size:.8rem; }
.vx-perf{ background:#f4f8f1; border:1px solid #e6ede2; border-radius:26px; padding:24px; position:relative; }
.vx-perf-badge{ display:inline-flex; align-items:center; gap:11px; background:#fff; border:1px solid #e6ede2; border-radius:16px; padding:10px 16px; box-shadow:0 8px 22px rgba(12,26,16,.08); margin-bottom:18px; }
.vx-perf-badge small{ font-size:.62rem; font-weight:700; letter-spacing:.1em; color:#8a9a90; display:block } .vx-perf-badge b{ color:#0c1a10; font-size:.95rem }
.vx-perf-cards{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.vx-pcard{ background:#fff; border:1px solid #eef2ec; border-radius:18px; padding:18px 14px; text-align:center; }
.vx-pc-label{ font-size:.72rem; font-weight:800; color:#c0392b; margin-bottom:12px; } .vx-pc-label.good{ color:#2c7800 }
.vx-ring{ width:78px; height:78px; border-radius:50%; margin:0 auto 12px; display:grid; place-items:center; font-size:1.7rem; font-weight:800; }
.vx-ring-bad{ background:conic-gradient(#e0524f 36%, #f4dede 0); color:#c0392b; } .vx-ring-bad span,.vx-ring-good span{ width:58px; height:58px; border-radius:50%; background:#fff; display:grid; place-items:center; }
.vx-ring-good{ background:conic-gradient(#41aa00 95%, #dbeecb 0); color:#2c7800; }
.vx-pc-metrics{ display:flex; justify-content:space-between; gap:6px; font-size:.78rem; font-weight:700; color:#0c1a10; }
.vx-pc-metrics small{ display:block; font-weight:500; color:#8a9a90; font-size:.66rem }
.vx-perf-foot{ margin-top:16px; text-align:center; font-size:.85rem; color:#3a5a25; display:flex; align-items:center; justify-content:center; gap:8px; }

/* theme flash overlay */
#vx-theme-flash{ position:fixed; inset:0; z-index:100000; display:flex; align-items:center; justify-content:center; background:radial-gradient(circle,#0f2417,#07120c); opacity:0; visibility:hidden; transition:opacity .35s ease; }
#vx-theme-flash.vx-show{ opacity:1; visibility:visible; }
.vx-tf-inner{ display:flex; flex-direction:column; align-items:center; gap:16px; transform:scale(.8); transition:transform .5s cubic-bezier(.2,.8,.2,1); }
#vx-theme-flash.vx-show .vx-tf-inner{ transform:scale(1); }
.vx-tf-inner span{ font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; letter-spacing:.28em; color:#fff; font-size:1.1rem; }
.vx-tf-inner svg{ animation:vx-tf-pulse 1s ease infinite; }
@keyframes vx-tf-pulse{ 0%,100%{ transform:scale(1) } 50%{ transform:scale(1.12) } }

@media (max-width:900px){
  .vx-slide{ grid-template-columns:1fr; gap:26px; } .vx-slide-visual{ max-width:440px; }
  .vx-compare-grid{ grid-template-columns:1fr; }
  .vx-crow{ grid-template-columns:1fr; gap:10px; } .vx-chead{ display:none; }
}

/* ============================================================
   Theme-aware tokens (light + dark) for Vexta sections
   ============================================================ */
:root{
  --vxc-text:#0c1a10; --vxc-muted:#5f7267; --vxc-card:#ffffff; --vxc-border:#eef2ec;
  --vxc-soft:#f4f8f1; --vxc-chip:#f4f8f1; --vxc-chiptx:#5f7267;
  --vxc-badbg:#fdf1f1; --vxc-badtx:#9a6a6a; --vxc-goodbg:#f1f9e8; --vxc-goodtx:#3a5a25;
  --vxc-track:#eef2ec; --vxc-shadow:0 10px 30px rgba(12,26,16,.08);
}
html[data-theme="dark"]{
  --vxc-text:#eaf3ec; --vxc-muted:#a0bca9; --vxc-card:#121d16; --vxc-border:rgba(255,255,255,.09);
  --vxc-soft:#0f1a13; --vxc-chip:rgba(255,255,255,.05); --vxc-chiptx:#c6dbcc;
  --vxc-badbg:rgba(224,82,79,.10); --vxc-badtx:#e2a3a3; --vxc-goodbg:rgba(65,170,0,.12); --vxc-goodtx:#bfe6a0;
  --vxc-track:rgba(255,255,255,.08); --vxc-shadow:0 12px 34px rgba(0,0,0,.35);
}

/* ---- slider: theme-aware overrides (fix dark) ---- */
.vx-slide-text h2{ color:var(--vxc-text); }
.vx-slide-text p{ color:var(--vxc-muted); }
.vx-chip{ color:var(--vxc-chiptx); background:var(--vxc-chip); border-color:var(--vxc-border); }
.vx-btn-ghost{ background:var(--vxc-card); color:var(--vxc-text); border-color:var(--vxc-border); }
.vx-review b{ color:var(--vxc-text); } .vx-review small{ color:var(--vxc-muted); }
.vx-reviews{ border-top-color:var(--vxc-border); } .vx-review-sep{ background:var(--vxc-border); }
html[data-theme="dark"] .vx-eyebrow{ background:rgba(126,226,58,.10); border-color:rgba(126,226,58,.25); color:#8fd94a; }

/* ============================================================
   "Vexta Farkı" v2 — modern, animated, theme-aware
   ============================================================ */
.vx-c2{ padding:72px 0; position:relative; overflow:hidden; }
.vx-c2::before{ content:""; position:absolute; top:-10%; right:-5%; width:520px; height:520px; border-radius:50%;
  background:radial-gradient(circle, rgba(99,197,34,.14), transparent 70%); pointer-events:none; }
.vx-c2-inner{ max-width:1240px; margin:0 auto; padding:0 24px; position:relative; }
.vx-c2-head{ text-align:center; max-width:760px; margin:0 auto 40px; }
.vx-c2-head h2{ font-size:clamp(1.9rem,3.6vw,2.8rem); font-weight:800; color:var(--vxc-text); margin:12px 0 14px; letter-spacing:-.02em; }
.vx-c2-head p{ color:var(--vxc-muted); line-height:1.7; }

/* stat band */
.vx-c2-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-bottom:44px; }
.vx-stat{ display:flex; align-items:center; gap:14px; background:var(--vxc-card); border:1px solid var(--vxc-border);
  border-radius:18px; padding:18px 20px; box-shadow:var(--vxc-shadow); transition:transform .3s, box-shadow .3s; }
.vx-stat:hover{ transform:translateY(-5px); box-shadow:0 18px 44px rgba(12,26,16,.14); }
.vx-stat-ic{ flex:none; width:48px; height:48px; border-radius:13px; display:grid; place-items:center;
  background:linear-gradient(135deg,#63c522,#2c7800); color:#fff; }
.vx-stat-ic svg{ width:24px; height:24px; }
.vx-stat-num b{ display:block; font-size:1.5rem; font-weight:800; color:var(--vxc-text); line-height:1; font-family:'Plus Jakarta Sans',sans-serif; }
.vx-stat-num span{ font-size:.82rem; color:var(--vxc-muted); }

/* grid */
.vx-c2-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:30px; align-items:start; }
.vx-c2-table{ display:flex; flex-direction:column; gap:12px; }
.vx-c2-rhead{ display:grid; grid-template-columns:1.25fr 1fr 1.1fr; gap:14px; padding:0 22px 6px; font-size:.72rem; font-weight:800; letter-spacing:.09em; color:var(--vxc-muted); }
.vx-c2-rhead .us{ color:#41aa00; }
.vx-c2-row{ display:grid; grid-template-columns:1.25fr 1fr 1.1fr; gap:14px; align-items:stretch;
  background:var(--vxc-card); border:1px solid var(--vxc-border); border-radius:20px; padding:18px 20px;
  box-shadow:var(--vxc-shadow); transition:transform .3s, box-shadow .3s, border-color .3s; }
.vx-c2-row:hover{ transform:translateY(-4px) scale(1.008); box-shadow:0 20px 46px rgba(12,26,16,.13); border-color:rgba(65,170,0,.3); }
.vx-c2-crit{ display:flex; flex-direction:column; justify-content:center; }
.vx-c2-crit h4{ font-size:1.04rem; font-weight:800; color:var(--vxc-text); margin-bottom:3px; }
.vx-c2-crit p{ font-size:.8rem; color:var(--vxc-muted); }
.vx-c2-bad, .vx-c2-good{ display:flex; gap:9px; align-items:flex-start; font-size:.84rem; line-height:1.45; padding:13px 14px; border-radius:14px; position:relative; }
.vx-c2-bad{ background:var(--vxc-badbg); color:var(--vxc-badtx); }
.vx-c2-good{ background:var(--vxc-goodbg); color:var(--vxc-goodtx); overflow:hidden; }
.vx-c2-bad .ic,.vx-c2-good .ic{ flex:none; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font-weight:800; font-size:.78rem; }
.vx-c2-bad .ic{ background:rgba(224,82,79,.2); color:#e0524f; }
.vx-c2-good .ic{ background:linear-gradient(135deg,#63c522,#2c7800); color:#fff; }
.vx-c2-good .fill{ position:absolute; left:0; bottom:0; height:3px; width:0; background:linear-gradient(90deg,#8fd94a,#41aa00); transition:width 1.1s cubic-bezier(.2,.7,.2,1) .2s; }
.vx-c2-row.vx-in .vx-c2-good .fill{ width:100%; }

/* performance card */
.vx-c2-perf{ background:var(--vxc-soft); border:1px solid var(--vxc-border); border-radius:26px; padding:24px; position:relative; }
.vx-c2-lic{ display:inline-flex; align-items:center; gap:11px; background:var(--vxc-card); border:1px solid var(--vxc-border); border-radius:16px; padding:10px 16px; box-shadow:var(--vxc-shadow); margin-bottom:18px; }
.vx-c2-lic svg{ width:30px; height:30px; }
.vx-c2-lic small{ font-size:.62rem; font-weight:800; letter-spacing:.1em; color:var(--vxc-muted); display:block; } .vx-c2-lic b{ color:var(--vxc-text); font-size:.95rem; }
.vx-c2-pcards{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.vx-c2-pcard{ background:var(--vxc-card); border:1px solid var(--vxc-border); border-radius:18px; padding:18px 14px; text-align:center; }
.vx-c2-plabel{ font-size:.72rem; font-weight:800; margin-bottom:12px; }
.vx-c2-pcard.bad .vx-c2-plabel{ color:#e0524f; } .vx-c2-pcard.good .vx-c2-plabel{ color:#41aa00; }
.vx-ring2{ width:84px; height:84px; border-radius:50%; margin:0 auto 12px; display:grid; place-items:center; background:conic-gradient(var(--vxc-track) 0,var(--vxc-track) 0); }
.vx-ring2 span{ width:64px; height:64px; border-radius:50%; background:var(--vxc-card); display:grid; place-items:center; font-size:1.7rem; font-weight:800; font-family:'Plus Jakarta Sans',sans-serif; }
.vx-ring2.bad span{ color:#e0524f; } .vx-ring2.good span{ color:#41aa00; }
.vx-c2-metrics{ display:flex; justify-content:space-between; gap:6px; font-size:.78rem; font-weight:800; color:var(--vxc-text); }
.vx-c2-metrics small{ display:block; font-weight:500; color:var(--vxc-muted); font-size:.65rem; }
.vx-c2-foot{ margin-top:16px; text-align:center; font-size:.85rem; color:var(--vxc-goodtx); display:flex; align-items:center; justify-content:center; gap:8px; }
.vx-c2-foot .fi{ width:30px; height:30px; border-radius:9px; background:linear-gradient(135deg,#63c522,#2c7800); color:#fff; display:grid; place-items:center; }
.vx-c2-foot .fi svg{ width:16px; height:16px; }

@media (max-width:900px){ .vx-c2-stats{ grid-template-columns:1fr 1fr; } .vx-c2-grid{ grid-template-columns:1fr; }
  .vx-c2-row{ grid-template-columns:1fr; gap:10px; } .vx-c2-rhead{ display:none; } }

/* ============================================================
   Vexta Farkı — zengin performans paneli (before/after)
   ============================================================ */
.vx-c2-table.full{ margin-bottom:8px; }
.vx-perf-panel{ position:relative; margin-top:56px;
  background:linear-gradient(170deg, var(--vxc-soft), var(--vxc-card));
  border:1px solid var(--vxc-border); border-radius:34px; padding:52px 40px 46px; box-shadow:var(--vxc-shadow); }
.vx-perf-panel::after{ content:""; position:absolute; top:0; right:0; width:150px; height:150px;
  background:radial-gradient(circle at top right, rgba(99,197,34,.12), transparent 70%); border-radius:0 34px 0 0; pointer-events:none; }
/* floating badges */
.vx-pb{ position:absolute; display:inline-flex; align-items:center; gap:12px; z-index:3;
  background:var(--vxc-card); border:1px solid var(--vxc-border); border-radius:18px; padding:13px 20px; box-shadow:0 16px 40px rgba(12,26,16,.16); }
.vx-pb small{ display:block; font-size:.6rem; font-weight:800; letter-spacing:.12em; color:var(--vxc-muted); }
.vx-pb b{ font-size:1rem; color:var(--vxc-text); }
.vx-pb .pbic{ width:38px; height:38px; border-radius:11px; display:grid; place-items:center; color:#fff; }
.vx-pb-lic{ top:-24px; left:34px; } .vx-pb-lic .pbic{ background:linear-gradient(135deg,#63c522,#2c7800); }
.vx-pb-nvme{ bottom:-22px; right:34px; } .vx-pb-nvme .pbic{ background:linear-gradient(135deg,#63c522,#2c7800); }
.vx-pb .pbic svg{ width:20px; height:20px; }

.vx-perf-cards2{ display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.vx-pcard2{ position:relative; background:var(--vxc-card); border:1px solid var(--vxc-border); border-radius:24px;
  padding:30px 22px 22px; box-shadow:0 12px 34px rgba(12,26,16,.07); transition:transform .35s, box-shadow .35s; overflow:hidden; }
.vx-pcard2:hover{ transform:translateY(-5px); box-shadow:0 24px 54px rgba(12,26,16,.13); }
.vx-pcard2.before{ border-top:3px solid #e0524f; } .vx-pcard2.after{ border-top:3px solid #41aa00; }
/* ribbon */
.vx-ribbon{ position:absolute; top:16px; left:50%; transform:translateX(-50%); padding:7px 26px; font-size:.72rem; font-weight:800;
  letter-spacing:.03em; color:#fff; border-radius:9px; white-space:nowrap; box-shadow:0 8px 20px rgba(0,0,0,.14); }
.vx-ribbon::before, .vx-ribbon::after{ content:""; position:absolute; bottom:-6px; width:0; height:0; border-top:6px solid; }
.vx-ribbon::before{ left:-1px; border-left:7px solid transparent; } .vx-ribbon::after{ right:-1px; border-right:7px solid transparent; }
.vx-ribbon.before{ background:linear-gradient(135deg,#f0736f,#e0524f); } .vx-ribbon.before::before,.vx-ribbon.before::after{ border-top-color:#b23c3a; }
.vx-ribbon.after{ background:linear-gradient(135deg,#63c522,#2c7800); } .vx-ribbon.after::before,.vx-ribbon.after::after{ border-top-color:#1f5c00; }

.vx-pc2-head{ display:flex; align-items:center; justify-content:space-between; margin:34px 0 14px; }
.vx-wm{ display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:1rem; color:var(--vxc-text); }
.vx-wm svg{ width:24px; height:24px; }
.vx-date{ display:inline-flex; align-items:center; gap:5px; font-size:.7rem; color:var(--vxc-muted);
  background:var(--vxc-soft); border:1px solid var(--vxc-border); padding:4px 10px; border-radius:8px; }
.vx-date svg{ width:12px; height:12px; }

.vx-ring-area{ position:relative; display:grid; place-items:center; padding:8px 0 2px; }
.vx-ring-area::before{ content:""; position:absolute; width:196px; height:196px; color:var(--vxc-border); opacity:.85;
  background-image:radial-gradient(currentColor 1.3px, transparent 1.5px); background-size:13px 13px; border-radius:50%;
  -webkit-mask:radial-gradient(circle, transparent 43%, #000 45%, #000 65%, transparent 68%);
  mask:radial-gradient(circle, transparent 43%, #000 45%, #000 65%, transparent 68%); }
.vx-ring2{ width:152px !important; height:152px !important; border-radius:50%; margin:0 auto; display:grid; place-items:center; position:relative; z-index:1; }
.vx-ring2 > span{ width:120px !important; height:120px !important; border-radius:50%; background:var(--vxc-card);
  display:flex; flex-direction:column; align-items:center; justify-content:center; box-shadow:inset 0 0 0 1px var(--vxc-border); }
.vx-ring2 b{ font-size:2.5rem; font-weight:800; line-height:1; font-family:'Plus Jakarta Sans',sans-serif; }
.vx-ring2 small{ font-size:.56rem; letter-spacing:.16em; color:var(--vxc-muted); margin-top:4px; font-weight:700; }
.vx-ring2.bad b{ color:#e0524f; } .vx-ring2.good b{ color:#41aa00; }
.vx-pill{ display:inline-flex; align-items:center; gap:5px; margin:12px auto 0; padding:5px 14px; border-radius:100px; font-size:.74rem; font-weight:800; }
.vx-pill.bad{ background:var(--vxc-badbg); color:#e0524f; } .vx-pill.good{ background:var(--vxc-goodbg); color:#2c7800; }

.vx-metrics2{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:18px 0 16px; }
.vx-metric{ background:var(--vxc-soft); border:1px solid var(--vxc-border); border-radius:13px; padding:12px 6px 10px; text-align:center; }
.vx-metric .mic{ width:26px; height:26px; margin:0 auto 6px; display:grid; place-items:center; border-radius:8px; }
.vx-metric.before .mic{ background:var(--vxc-badbg); color:#e0524f; } .vx-metric.after .mic{ background:var(--vxc-goodbg); color:#2c7800; }
.vx-metric .mic svg{ width:15px; height:15px; }
.vx-metric .mlabel{ display:block; font-size:.56rem; color:var(--vxc-muted); line-height:1.25; margin-bottom:5px; min-height:2.1em; }
.vx-metric b{ display:block; font-size:1.05rem; font-weight:800; color:var(--vxc-text); }
.vx-metric .mtag{ display:inline-block; margin-top:6px; font-size:.6rem; font-weight:800; padding:2px 9px; border-radius:100px; }
.vx-metric.before .mtag{ background:var(--vxc-badbg); color:#e0524f; } .vx-metric.after .mtag{ background:var(--vxc-goodbg); color:#2c7800; }

.vx-notify{ display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border-radius:15px; }
.vx-notify.before{ background:var(--vxc-badbg); } .vx-notify.after{ background:var(--vxc-goodbg); }
.vx-notify .nic{ flex:none; width:34px; height:34px; border-radius:10px; display:grid; place-items:center; color:#fff; }
.vx-notify.before .nic{ background:linear-gradient(135deg,#f0736f,#e0524f); } .vx-notify.after .nic{ background:linear-gradient(135deg,#63c522,#2c7800); }
.vx-notify .nic svg{ width:18px; height:18px; }
.vx-notify b{ display:block; font-size:.9rem; color:var(--vxc-text); margin-bottom:2px; }
.vx-notify p{ font-size:.76rem; line-height:1.45; color:var(--vxc-muted); }

@media (max-width:760px){ .vx-perf-cards2{ grid-template-columns:1fr; } .vx-metrics2{ gap:7px; } .vx-pb-lic,.vx-pb-nvme{ position:static; display:inline-flex; margin:8px 8px 0 0; } }



/* ============================================================
   Modern FAQ (SSS) — 2-column, animated accordion, theme-aware.
   Covers BOTH homepage (.faq-section/.section-header/.section-description)
   and subpages (.bs-iso-wrapper/.bs-iso-header/.bs-iso-desc). Shared → all pages.
   ============================================================ */
section.faq-section, section.bs-iso-wrapper{
  position:relative; overflow:hidden;
  background:var(--vxc-soft) !important;
  padding:84px 0 !important;
}
:is(.faq-section,.bs-iso-wrapper)::before{
  content:""; position:absolute; top:-140px; right:-110px; width:540px; height:540px; border-radius:50%;
  background:radial-gradient(circle, rgba(99,197,34,.16), transparent 70%); pointer-events:none; z-index:0;
}
:is(.faq-section,.bs-iso-wrapper)::after{
  content:""; position:absolute; bottom:-150px; left:-120px; width:460px; height:460px; border-radius:50%;
  background:radial-gradient(circle, rgba(65,170,0,.10), transparent 70%); pointer-events:none; z-index:0;
}
:is(.faq-section,.bs-iso-wrapper) .container{ position:relative; z-index:1; }

/* two-column layout: sticky intro (left) + accordion (right) */
.faq-section .bs-iso-container,
.bs-iso-wrapper > .container{
  display:grid; grid-template-columns:minmax(280px,360px) 1fr; gap:48px; align-items:start;
  max-width:1180px; margin-left:auto; margin-right:auto;
}
:is(.faq-section,.bs-iso-wrapper) :is(.section-header,.bs-iso-header){
  text-align:left !important; position:sticky; top:100px; align-self:start;
}
:is(.faq-section,.bs-iso-wrapper) :is(.section-header,.bs-iso-header)::before{
  content:"\25CF  DESTEK & SSS"; display:inline-flex; align-items:center;
  font-weight:800; font-size:.72rem; letter-spacing:.14em; color:#2c7800;
  background:rgba(99,197,34,.12); border:1px solid rgba(99,197,34,.28);
  padding:7px 15px; border-radius:100px; margin-bottom:16px;
}
:is(.faq-section,.bs-iso-wrapper) .bs-iso-title{
  font-size:2.15rem !important; text-align:left !important; color:var(--vxc-text) !important;
  letter-spacing:-.02em; line-height:1.15 !important; margin-bottom:0 !important;
}
:is(.faq-section,.bs-iso-wrapper) :is(.section-description,.bs-iso-desc){
  text-align:left !important; color:var(--vxc-muted) !important; margin:14px 0 0 0 !important; max-width:none !important;
}

/* support CTA (injected by JS into the left column) */
:is(.faq-section,.bs-iso-wrapper) .vx-faq-cta{
  margin-top:26px; display:flex; gap:14px; align-items:center;
  background:var(--vxc-card); border:1px solid var(--vxc-border); border-radius:18px;
  padding:17px 19px; box-shadow:var(--vxc-shadow); text-decoration:none;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
:is(.faq-section,.bs-iso-wrapper) .vx-faq-cta:hover{ transform:translateY(-3px); box-shadow:0 18px 40px rgba(12,26,16,.14); border-color:rgba(99,197,34,.45); }
:is(.faq-section,.bs-iso-wrapper) .vx-faq-cta-ic{
  flex:none; width:46px; height:46px; border-radius:13px; display:grid; place-items:center;
  background:linear-gradient(135deg,#63c522,#2c7800); color:#fff;
}
:is(.faq-section,.bs-iso-wrapper) .vx-faq-cta-tx b{ display:block; color:var(--vxc-text); font-size:.98rem; font-weight:800; line-height:1.15; }
:is(.faq-section,.bs-iso-wrapper) .vx-faq-cta-tx small{ color:var(--vxc-muted); font-size:.8rem; }
:is(.faq-section,.bs-iso-wrapper) .vx-faq-arrow{ margin-left:auto; color:#41aa00; transition:transform .25s ease; }
:is(.faq-section,.bs-iso-wrapper) .vx-faq-cta:hover .vx-faq-arrow{ transform:translateX(4px); }

/* accordion list */
:is(.faq-section,.bs-iso-wrapper) .bs-iso-grid{ counter-reset:vxfaq; gap:14px !important; }
:is(.faq-section,.bs-iso-wrapper) .bs-iso-card{
  counter-increment:vxfaq;
  background:var(--vxc-card) !important; border:1px solid var(--vxc-border) !important;
  border-radius:16px !important; box-shadow:0 4px 18px rgba(12,26,16,.05);
  position:relative; overflow:hidden;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
:is(.faq-section,.bs-iso-wrapper) .bs-iso-card::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:4px; z-index:2;
  background:linear-gradient(180deg,#63c522,#2c7800);
  transform:scaleY(0); transform-origin:top; transition:transform .35s cubic-bezier(.4,0,.2,1);
}
:is(.faq-section,.bs-iso-wrapper) .bs-iso-card:hover{ transform:translateY(-3px); box-shadow:0 16px 40px rgba(12,26,16,.10); border-color:rgba(99,197,34,.40) !important; }
:is(.faq-section,.bs-iso-wrapper) .bs-iso-card.active{ border-color:rgba(99,197,34,.50) !important; box-shadow:0 16px 44px rgba(12,26,16,.12); }
:is(.faq-section,.bs-iso-wrapper) .bs-iso-card.active::before{ transform:scaleY(1); }

:is(.faq-section,.bs-iso-wrapper) .bs-iso-btn{
  padding:20px 22px !important; gap:16px; align-items:center;
  color:var(--vxc-text) !important; font-weight:700 !important;
}
:is(.faq-section,.bs-iso-wrapper) .bs-iso-btn::before{
  content:counter(vxfaq,decimal-leading-zero);
  flex:none; width:38px; height:38px; border-radius:11px; display:grid; place-items:center;
  font-size:.85rem; font-weight:800; color:#2c7800;
  background:rgba(99,197,34,.12); border:1px solid rgba(99,197,34,.22);
  transition:all .3s ease;
}
:is(.faq-section,.bs-iso-wrapper) .bs-iso-card.active .bs-iso-btn::before{
  color:#fff; background:linear-gradient(135deg,#63c522,#2c7800); border-color:transparent;
  box-shadow:0 8px 18px rgba(65,170,0,.32);
}
:is(.faq-section,.bs-iso-wrapper) .bs-iso-btn-text{ font-size:1.02rem !important; margin-right:8px !important; }

/* chevron as circular chip */
:is(.faq-section,.bs-iso-wrapper) .bs-iso-icon{
  width:34px !important; height:34px !important; min-width:34px; padding:7px;
  box-sizing:border-box !important; border-radius:50%;
  background:var(--vxc-chip); color:var(--vxc-muted) !important;
  transition:transform .35s cubic-bezier(.4,0,.2,1), background .3s ease, color .3s ease !important;
}
:is(.faq-section,.bs-iso-wrapper) .bs-iso-card.active .bs-iso-icon{
  transform:rotate(180deg) !important; color:#fff !important;
  background:linear-gradient(135deg,#63c522,#2c7800) !important;
}

/* content reveal */
:is(.faq-section,.bs-iso-wrapper) .bs-iso-content{ max-height:0 !important; overflow:hidden; transition:max-height .4s ease; }
:is(.faq-section,.bs-iso-wrapper) .bs-iso-grid .bs-iso-card.active .bs-iso-content{ max-height:1400px !important; }
:is(.faq-section,.bs-iso-wrapper) .bs-iso-inner-text{
  padding:2px 24px 24px 76px !important; color:var(--vxc-muted) !important;
  line-height:1.75 !important; font-size:.96rem !important; margin:0 !important;
}
:is(.faq-section,.bs-iso-wrapper) :is(.bs-strong,.bs-vds-bold){ color:#2c7800 !important; font-weight:800 !important; }
html[data-theme="dark"] :is(.faq-section,.bs-iso-wrapper) :is(.bs-strong,.bs-vds-bold){ color:#8fd94a !important; }
html[data-theme="dark"] :is(.faq-section,.bs-iso-wrapper) :is(.section-header,.bs-iso-header)::before{ color:#8fd94a; }
html[data-theme="dark"] :is(.faq-section,.bs-iso-wrapper) .bs-iso-btn::before{ color:#8fd94a; }
html[data-theme="dark"] :is(.faq-section,.bs-iso-wrapper) .bs-iso-card{ background:var(--vxc-card) !important; border-color:var(--vxc-border) !important; }

/* reveal stagger (only when motion allowed; JS adds .vx-in, with safety net) */
@media (prefers-reduced-motion: no-preference){
  :is(.faq-section,.bs-iso-wrapper) .bs-iso-card.vx-reveal{ opacity:0; transform:translateY(22px); transition:opacity .6s cubic-bezier(.2,.7,.2,1), transform .6s cubic-bezier(.2,.7,.2,1), box-shadow .28s ease, border-color .28s ease; }
  :is(.faq-section,.bs-iso-wrapper) .bs-iso-card.vx-reveal.vx-in{ opacity:1; transform:none; }
}

@media (max-width:900px){
  .faq-section .bs-iso-container, .bs-iso-wrapper > .container{ grid-template-columns:1fr; gap:26px; }
  :is(.faq-section,.bs-iso-wrapper) :is(.section-header,.bs-iso-header){ position:static; text-align:center !important; }
  :is(.faq-section,.bs-iso-wrapper) :is(.section-header,.bs-iso-header)::before{ margin-left:auto; margin-right:auto; }
  :is(.faq-section,.bs-iso-wrapper) .bs-iso-title{ text-align:center !important; }
  :is(.faq-section,.bs-iso-wrapper) :is(.section-description,.bs-iso-desc){ text-align:center !important; }
  :is(.faq-section,.bs-iso-wrapper) .vx-faq-cta{ max-width:420px; margin-left:auto; margin-right:auto; }
  :is(.faq-section,.bs-iso-wrapper) .bs-iso-inner-text{ padding-left:24px !important; }
}