/* ============================================================
   EGI Menü — mega (Alternatif A) + mobil akordeon.
   Referans: ymz/ehelp-mega-menu.html (birebir). main.css'ten sonra yüklenir.
   Eres tasarım sistemi token'ları (--eres-*) burada tanımlı; --egi-* ile çakışmaz.
   ============================================================ */
:root{
  --eres-bg:#0B0D14; --eres-bg-2:#0E111A;
  --eres-surface:#12151F; --eres-surface-2:#171B27;
  --eres-line:rgba(255,255,255,.07); --eres-line-strong:rgba(255,255,255,.14);
  --eres-text:#E9EBF3; --eres-text-dim:#A8AEC4; --eres-muted:#7A8099;
  --eres-indigo:#4361ee; --eres-indigo-soft:#6d8bff;
  --eres-violet:#7D3BFF; --eres-violet-soft:#a06bff;
  --eres-teal:#2fc4da; --eres-teal-deep:#0e8fa3;
  --eres-grad:linear-gradient(135deg,var(--eres-indigo),var(--eres-violet));
  --eres-font-display:"Plus Jakarta Sans","Inter",system-ui,sans-serif;
  --eres-font-body:"Inter",system-ui,sans-serif;
  --eres-font-mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --eres-wrap:1280px;
  --eres-gut:clamp(20px,4vw,48px);
  --egi-hh:72px; /* header yüksekliği (scrim başlangıcı) */
}
.eres-nav *,.eres-mega *,.eres-m *,.eres-scrim *{ box-sizing:border-box; }
.eres-ico{ width:19px; height:19px; display:block; }
.eres-icobox{
  flex:none; width:36px; height:36px; border-radius:11px;
  display:grid; place-items:center; color:var(--fam);
  background:color-mix(in srgb, var(--fam) 12%, transparent);
  border:1px solid color-mix(in srgb, var(--fam) 24%, transparent);
  transition:background .18s ease, border-color .18s ease, transform .18s ease;
}
.eres-eyebrow{
  font-family:var(--eres-font-mono); font-size:10px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--eres-muted);
}

/* -------------------------------------------------- HEADER NAV (egi-hdr içinde) */
.egi-hdr .eres-nav{ display:flex; align-items:center; gap:4px; margin-right:auto; }
.eres-nav__item{ position:static; }
.eres-nav__btn{
  display:inline-flex; align-items:center; gap:7px;
  padding:10px 14px; border-radius:10px;
  font-size:15px; color:var(--eres-text-dim); font-weight:500;
  background:none; border:0; cursor:pointer; white-space:nowrap;
  transition:color .18s ease, background .18s ease;
}
.eres-nav__btn:hover{ color:var(--eres-text); background:rgba(255,255,255,.04); }
.eres-nav__btn[aria-expanded="true"]{ color:var(--eres-text); background:rgba(255,255,255,.06); }
.eres-nav__caret{ width:13px; height:13px; transition:transform .22s ease; opacity:.7; }
.eres-nav__btn[aria-expanded="true"] .eres-nav__caret{ transform:rotate(180deg); }

/* -------------------------------------------------- PANEL KABUĞU */
.eres-mega{
  position:absolute; left:0; right:0; top:100%; z-index:90;
  /* İçerik kolonuna hizala (header ile aynı genişlik). .eres-wrap sınıfı yalnız blog.css'te
     yüklendiği için buraya gömülü — aksi halde panel tam viewport'a yayılıyordu. */
  width:100%; max-width:var(--egi-maxw, 1180px); margin-inline:auto;
  padding-inline:22px; box-sizing:border-box;
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity .2s ease, transform .24s cubic-bezier(.4,0,.2,1), visibility .24s;
}
.eres-mega.is-open{ opacity:1; visibility:visible; transform:translateY(0); }
.eres-mega__panel{
  border:1px solid var(--eres-line-strong); border-radius:22px;
  background:linear-gradient(180deg, var(--eres-surface), var(--eres-bg-2));
  box-shadow:0 40px 90px -40px #000, 0 0 0 1px rgba(255,255,255,.02) inset;
  overflow:hidden;
}
.eres-scrim{
  position:fixed; inset:var(--egi-hh) 0 0; z-index:40;
  background:rgba(6,7,12,.62); backdrop-filter:blur(2px);
  opacity:0; visibility:hidden; transition:opacity .24s ease, visibility .24s;
}
.eres-scrim.is-open{ opacity:1; visibility:visible; }

/* -------------------------------------------------- ALTERNATİF A */
.eres-a{ display:grid; grid-template-columns:minmax(0,1fr) 320px; }
.eres-a__cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:26px 20px; }
.eres-a__col{ padding:0 6px; }
.eres-a__title{
  display:flex; align-items:center; gap:9px;
  font-family:var(--eres-font-mono); font-size:10px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--eres-text-dim);
  padding:0 10px 12px; margin-bottom:6px; border-bottom:1px solid var(--eres-line);
}
.eres-a__title::before{ content:""; width:7px; height:7px; border-radius:2px; background:var(--fam); flex:none; }
.eres-a__link{ display:flex; align-items:flex-start; gap:12px; padding:10px; border-radius:12px; transition:background .18s ease; }
.eres-a__link:hover{ background:rgba(255,255,255,.045); }
.eres-a__link:hover .eres-icobox{
  background:color-mix(in srgb, var(--fam) 20%, transparent);
  border-color:color-mix(in srgb, var(--fam) 44%, transparent); transform:translateY(-1px);
}
.eres-a__txt b{ display:block; font-family:var(--eres-font-display); font-weight:620;
  font-size:14.5px; letter-spacing:-.012em; margin-bottom:2px; color:var(--eres-text); }
.eres-a__txt span{ font-size:12.5px; color:var(--eres-muted); line-height:1.4; }
.eres-a__link:hover .eres-a__txt b{ color:var(--fam); }

.eres-a__rail{
  transition:opacity .18s ease; border-left:1px solid var(--eres-line);
  background:
    radial-gradient(420px 240px at 80% 0%, color-mix(in srgb, var(--fam) 14%, transparent), transparent 66%),
    rgba(255,255,255,.015);
  padding:26px 24px; display:flex; flex-direction:column;
}
.eres-a__feat{
  border:1px solid var(--eres-line); border-radius:16px; overflow:hidden;
  background:var(--eres-surface); margin:14px 0 auto;
  transition:border-color .22s ease, transform .22s ease; display:block;
}
.eres-a__feat:hover{ border-color:color-mix(in srgb, var(--fam) 40%, transparent); transform:translateY(-2px); }
.eres-a__cover{
  position:relative; aspect-ratio:16/9; color:var(--fam);
  background:
    radial-gradient(120% 100% at 78% 0%, color-mix(in srgb, var(--fam) 26%, transparent), transparent 66%),
    linear-gradient(160deg, var(--eres-surface-2), #0d1017);
}
.eres-a__cover svg{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.eres-a__feat p{ margin:0; padding:14px 16px 16px; font-family:var(--eres-font-display);
  font-weight:620; font-size:15px; line-height:1.34; letter-spacing:-.014em; color:var(--eres-text); }
.eres-a__note{ margin-top:18px; padding-top:16px; border-top:1px solid var(--eres-line);
  font-size:13.5px; color:var(--eres-muted); }
.eres-a__note a{ color:var(--eres-indigo-soft); }

/* -------------------------------------------------- MOBİL PANEL */
.eres-m{
  position:fixed; inset:0; z-index:150; background:var(--eres-bg);
  display:flex; flex-direction:column;
  transform:translateX(100%); transition:transform .32s cubic-bezier(.4,0,.2,1); visibility:hidden;
}
.eres-m.is-open{ transform:none; visibility:visible; }
.eres-m__top{ display:flex; align-items:center; height:72px; padding-inline:var(--eres-gut);
  border-bottom:1px solid var(--eres-line); flex:none; }
.eres-logo{ font-family:var(--eres-font-display); font-weight:800; font-size:20px;
  letter-spacing:-.02em; display:flex; align-items:center; gap:9px; color:var(--eres-text); }
.eres-logo__mark{ width:24px; height:24px; border-radius:7px; background:var(--eres-grad);
  display:grid; place-items:center; font-size:13px; color:#fff; }
.eres-m__close{ margin-left:auto; width:42px; height:42px; border-radius:12px;
  display:grid; place-items:center; color:var(--eres-text); border:1px solid var(--eres-line-strong);
  background:none; cursor:pointer; }
.eres-m__body{ flex:1; overflow-y:auto; overscroll-behavior:contain; padding:14px var(--eres-gut) 24px; }
.eres-m__row{ border-bottom:1px solid var(--eres-line); }
.eres-m__head{
  display:flex; align-items:center; gap:12px; width:100%; padding:18px 2px; text-align:left;
  font-family:var(--eres-font-display); font-weight:650; font-size:18px; letter-spacing:-.02em;
  color:var(--eres-text); background:none; border:0; cursor:pointer;
}
.eres-m__head .eres-m__chev{ margin-left:auto; width:20px; height:20px; color:var(--eres-muted);
  transition:transform .28s cubic-bezier(.4,0,.2,1); }
.eres-m__head[aria-expanded="true"] .eres-m__chev{ transform:rotate(180deg); color:var(--eres-indigo-soft); }
.eres-m__fold{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s cubic-bezier(.4,0,.2,1); }
.eres-m__fold > div{ overflow:hidden; }
.eres-m__head[aria-expanded="true"] + .eres-m__fold{ grid-template-rows:1fr; }
.eres-m__group{ padding:2px 0 14px; }
.eres-m__gtitle{ display:flex; align-items:center; gap:9px;
  font-family:var(--eres-font-mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--eres-text-dim); padding:14px 2px 8px; }
.eres-m__gtitle::before{ content:""; width:7px; height:7px; border-radius:2px; background:var(--fam); flex:none; }
.eres-m__item{ display:flex; align-items:center; gap:13px; padding:11px 10px; border-radius:12px;
  min-height:44px; transition:background .18s ease; }
.eres-m__item:active{ background:rgba(255,255,255,.06); }
.eres-m__item b{ display:block; font-family:var(--eres-font-display); font-weight:600;
  font-size:15.5px; letter-spacing:-.012em; margin-bottom:1px; color:var(--eres-text); }
.eres-m__item span{ font-size:12.5px; color:var(--eres-muted); line-height:1.4; }
.eres-m__foot{ flex:none; padding:16px var(--eres-gut) calc(16px + env(safe-area-inset-bottom));
  border-top:1px solid var(--eres-line); background:var(--eres-bg-2); display:flex; gap:10px; }
.eres-m .eres-ghost, .eres-m .eres-cta{
  flex:1; justify-content:center; text-align:center; padding:14px 18px; border-radius:999px;
  font-size:15px; font-weight:600; display:inline-flex; align-items:center;
}
.eres-m .eres-ghost{ border:1px solid var(--eres-line-strong); color:var(--eres-text-dim); }
.eres-m .eres-cta{ background:var(--eres-grad); color:#fff; }
body.is-locked{ overflow:hidden; }

/* -------------------------------------------------- KIRILIMLAR */
@media (max-width:1080px){
  .egi-hdr .eres-nav{ display:none; }
  .eres-mega, .eres-scrim{ display:none; }
}
@media (prefers-reduced-motion:reduce){
  .eres-mega, .eres-m, .eres-m__fold, .eres-a__rail{ transition-duration:.01ms !important; }
}