/* ============================================================
   Aixel Elementor Addons — Header Mega Menu (Balanced flanks)
   Ported from mega-balanced.css and scoped under .aixel-mega
   so it never leaks into the host theme.
   ============================================================ */
.aixel-mega{
  --panel:   #BFDFEF;   /* mega panel background */
  --heading: #AF5B7A;   /* secondary accent (headings + icons) */
  --ink:     #3D4B57;   /* menu items */
  --divider: rgba(62,90,118,.18);
  --ff:      'Poppins', system-ui, sans-serif;
  --ff-disp: 'Catamaran', var(--ff);

  font-family:var(--ff);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
}

.aixel-mega *{box-sizing:border-box}
.aixel-mega ul{margin:0;padding:0;list-style:none}
.aixel-mega a{color:inherit;text-decoration:none !important}
.aixel-mega a:hover,.aixel-mega a:focus{text-decoration:none !important}

/* ---------- panel ---------- */
.aixel-mega .mega{
  width:100%;
  max-width:1180px;
  margin:0 auto;
  background:var(--panel);
  border-radius:18px;
  box-shadow:0 24px 50px -26px rgba(45,72,96,.45);
}
.aixel-mega .mega-in{
  display:grid;
  grid-template-columns:minmax(200px,1fr) minmax(540px,2.5fr) minmax(210px,1.05fr);
  gap:36px;
  padding:42px 40px 46px;
}

/* center column flanked by dividers */
.aixel-mega .center{
  padding:0 38px;
  border-left:1px solid var(--divider);
  border-right:1px solid var(--divider);
}

/* ---------- section heading ---------- */
.aixel-mega .sec-head{display:flex;align-items:center;justify-content:center;gap:11px;margin-bottom:18px}
.aixel-mega .sec-ico{
  flex:0 0 auto;width:30px;height:30px;color:var(--heading);
  display:flex;align-items:center;justify-content:center;
}
.aixel-mega .sec-ico svg{width:27px;height:27px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.aixel-mega .sec-head h3{
  margin:0;font-family:var(--ff-disp);font-weight:700;font-size:15px;line-height:1.2;
  letter-spacing:.05em;text-transform:uppercase;color:var(--heading);text-align:center;
}

/* spacing between the two stacked sections in the right flank */
.aixel-mega .flank-r .sec + .sec{margin-top:34px}

/* ---------- link lists ---------- */
.aixel-mega .sec-list{text-align:center}
.aixel-mega .sec-list li{margin:0}
.aixel-mega .sec-list a{
  display:block;padding:9px 0;font-size:16px;line-height:1.35;color:var(--ink);
  transition:color .16s;
}
.aixel-mega .sec-list a:hover{color:var(--heading)}

/* center 3-column grid (column-major, like the screenshot) */
.aixel-mega .sec-list.cols-3{
  display:grid;grid-auto-flow:column;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-rows:repeat(6,auto);
  column-gap:36px;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
  .aixel-mega .mega-in{grid-template-columns:1fr 1fr;gap:30px}
  .aixel-mega .center{grid-column:1 / -1;order:3;border-left:none;border-right:none;padding:26px 0 0;border-top:1px solid var(--divider)}
  .aixel-mega .sec-list.cols-3{column-gap:28px}
}
@media (max-width:640px){
  .aixel-mega .mega-in{grid-template-columns:1fr;gap:26px;padding:30px 24px 34px}
  .aixel-mega .center{padding:24px 0 0}
  .aixel-mega .sec-list.cols-3{grid-auto-flow:row;grid-template-columns:1fr 1fr;grid-template-rows:auto;column-gap:24px}
  .aixel-mega .flank-r .sec + .sec{margin-top:26px}
}
@media (max-width:420px){
  .aixel-mega .sec-list.cols-3{grid-template-columns:1fr}
}