.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    .insight-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    .scenario-grid-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
    @media(max-width:900px){.compare-grid,.insight-grid,.scenario-grid-compare{grid-template-columns:1fr}}
    .row{display:flex;align-items:center;justify-content:space-between;gap:12px}
    .kpi{font-size:34px;font-weight:900;letter-spacing:-.5px}
    .sub{opacity:.9;line-height:1.6}
    .meter{height:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:999px;overflow:hidden}
    .meter > div{height:100%;width:0%;background:linear-gradient(90deg,#60a5fa,#7dd3fc)}
    .tag{display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);font-size:13px;white-space:nowrap}
    .muted2{color:var(--muted)}
    .axis{display:grid;grid-template-columns:160px 1fr 130px;gap:10px;align-items:center;margin:10px 0}
    .axis b{font-weight:800}
    .axis .meter{height:8px}
    .axis .val{text-align:right;opacity:.95;font-variant-numeric:tabular-nums}
    input.compare-inp{width:90%;height:46px;border-radius:14px;padding:0 14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:inherit;outline:none}
    input.compare-inp:focus{border-color:rgba(255,255,255,.28);box-shadow:0 0 0 4px rgba(255,255,255,.08)}
    .mono{font-variant-numeric:tabular-nums}
    .small{font-size:13px;opacity:.9;line-height:1.55}
    .explain{margin-top:10px}
    .topnav{margin-left:auto;display:flex;gap:10px;align-items:center;}
    .topnav-link{padding:8px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background: rgba(255,255,255,.04);color: #e6eef8;font-size: 13px;}
    .topnav-link:hover{ background: rgba(255,255,255,.07); }
    .compare-list{margin:0;padding-left:18px;display:grid;gap:10px;line-height:1.7}
    .compare-list li{color:#e6eef8}
    .section-kicker{font-size:13px;color:var(--muted);margin-bottom:8px;letter-spacing:.2px;text-transform:uppercase}
    .scenario-card{padding:16px;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03)}
    .scenario-q{font-weight:800;margin-bottom:8px}
    .scenario-a{margin:0;color:#dbe6f3;line-height:1.7}
    .copy-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:14px}
  .compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  @media(max-width:900px){.compare-grid{grid-template-columns:1fr}}
  .row{display:flex;align-items:center;justify-content:space-between;gap:12px}
  .kpi{font-size:34px;font-weight:900;letter-spacing:-.5px}
  .sub{opacity:.9;line-height:1.6}
  .meter{height:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:999px;overflow:hidden}
  .meter > div{height:100%;width:0%;background:linear-gradient(90deg,#60a5fa,#7dd3fc)}
  .tag{display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);font-size:13px;white-space:nowrap}
  .muted2{color:var(--muted)}
  .axis{display:grid;grid-template-columns:160px 1fr 130px;gap:10px;align-items:center;margin:10px 0}
  .axis b{font-weight:800}
  .axis .meter{height:8px}
  .axis .val{text-align:right;opacity:.95;font-variant-numeric:tabular-nums}
  input.compare-inp{width:90%;height:46px;border-radius:14px;padding:0 14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:inherit;outline:none}
  input.compare-inp:focus{border-color:rgba(255,255,255,.28);box-shadow:0 0 0 4px rgba(255,255,255,.08)}
  .mono{font-variant-numeric:tabular-nums}
  .small{font-size:13px;opacity:.9;line-height:1.55}
  .explain{margin-top:10px}
  .topnav{margin-left:auto;display:flex;gap:10px;align-items:center;}
  .topnav-link{padding:8px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background: rgba(255,255,255,.04);color: #e6eef8;font-size: 13px;}
  .topnav-link:hover{ background: rgba(255,255,255,.07); }

  /* YENI CANLI ALANLAR */
  .hero-compat{
    position:relative;
    overflow:hidden;
    background:
      radial-gradient(circle at top left, rgba(125,211,252,.16), transparent 35%),
      radial-gradient(circle at top right, rgba(244,114,182,.14), transparent 35%),
      linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  }

  .hero-compat::after{
    content:"";
    position:absolute;
    inset:auto -40px -40px auto;
    width:180px;
    height:180px;
    border-radius:999px;
    background:radial-gradient(circle, rgba(96,165,250,.12), transparent 70%);
    pointer-events:none;
  }

  .compat-vibe{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 14px;
    border-radius:999px;
    font-size:13px;
    font-weight:700;
    margin-bottom:14px;
    border:1px solid rgba(255,255,255,.12);
    background:rgba(255,255,255,.06);
  }

  .personal-line{
    margin:10px 0 0;
    padding:12px 14px;
    border-radius:16px;
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.08);
    line-height:1.7;
    color:#eaf4ff;
  }

  .soft-card{
    background:
      linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
    border:1px solid rgba(255,255,255,.09);
    border-radius:18px;
    padding:16px;
    box-shadow:0 10px 30px rgba(2,6,23,.28);
  }

  .accent-good{
    background:
      radial-gradient(circle at top left, rgba(34,197,94,.12), transparent 45%),
      linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  }

  .accent-warn{
    background:
      radial-gradient(circle at top left, rgba(251,191,36,.14), transparent 45%),
      linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  }

  .accent-scenario{
    background:
      radial-gradient(circle at top left, rgba(168,85,247,.14), transparent 45%),
      linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  }

  .pretty-list{
    list-style:none;
    padding:0;
    margin:12px 0 0;
    display:grid;
    gap:10px;
  }

  .pretty-list li{
    position:relative;
    padding:12px 14px 12px 40px;
    border-radius:14px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    line-height:1.65;
  }

  .pretty-list li::before{
    content:"✨";
    position:absolute;
    left:12px;
    top:11px;
    font-size:16px;
  }

  .warn-list li::before{ content:"⚠️"; }
  .good-list li::before{ content:"✨"; }

  .scenario-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:12px;
  }

  @media(max-width:900px){
    .scenario-grid{grid-template-columns:1fr;}
    .axis{grid-template-columns:1fr;gap:6px}
    .axis .val{text-align:left}
  }

  .scenario-card{
    padding:16px;
    border-radius:18px;
    border:1px solid rgba(255,255,255,.09);
    background:
      linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
    min-height:140px;
  }

  .scenario-q{
    font-weight:800;
    font-size:15px;
    margin-bottom:10px;
    color:#f4f8ff;
  }

  .scenario-a{
    margin:0;
    color:#d7e5f5;
    line-height:1.7;
  }

  .pair-mini{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:14px;
  }

  .pair-chip{
    padding:9px 12px;
    border-radius:999px;
    font-size:13px;
    border:1px solid rgba(255,255,255,.10);
    background:rgba(255,255,255,.05);
  }

  .section-title{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0 0 8px;
    font-size:18px;
  }

  .section-kicker{
    color:var(--muted);
    line-height:1.6;
    margin:0 0 8px;
  }