/* Jamia Mahmoodia v87 — About academic-framework repair + stable desktop mega menu
   Loaded last, after v86. Keep these selectors root-scoped so old !important layers
   cannot re-introduce washed-out copy or hover gaps. */

body#jm-site-root.jm-ui-v87{
  --jm87-ink:#123f35;
  --jm87-copy:#5e726b;
  --jm87-gold:#d9a83e;
  --jm87-gold-2:#f1c968;
  --jm87-paper:#fffdf8;
  --jm87-warm:#f4efe4;
  --jm87-mint:#edf5f1;
  --jm87-line:rgba(10,78,64,.12);
  --jm87-shadow:0 24px 70px rgba(4,48,40,.10);
}

/* --------------------------------------------------------------------------
   ABOUT — ACADEMIC FRAMEWORK
   v75 intentionally changed this block to a light card, but v86's generic
   dark-component selector made its text light as well. Lock the intended
   premium LIGHT-card palette and geometry here.
   -------------------------------------------------------------------------- */
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note{
  position:relative!important;
  isolation:isolate!important;
  margin:0!important;
  padding:clamp(62px,6vw,92px) 0!important;
  border-radius:0!important;
  background:
    radial-gradient(circle at 7% 18%,rgba(222,174,70,.11),transparent 23%),
    radial-gradient(circle at 92% 90%,rgba(8,83,68,.07),transparent 26%),
    linear-gradient(180deg,#f7f3e9 0%,#fbfaf6 100%)!important;
  color:var(--jm87-ink)!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note:before{
  content:""!important;
  position:absolute!important;
  width:360px!important;
  height:360px!important;
  left:-180px!important;
  top:-190px!important;
  border:64px solid rgba(8,83,68,.035)!important;
  border-radius:50%!important;
  pointer-events:none!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note-grid{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  grid-template-columns:150px minmax(0,1fr) 190px!important;
  align-items:center!important;
  gap:clamp(28px,3vw,48px)!important;
  width:min(1280px,calc(100% - 56px))!important;
  max-width:1280px!important;
  margin-inline:auto!important;
  padding:clamp(32px,3.2vw,48px)!important;
  border:1px solid var(--jm87-line)!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 100% 0,rgba(226,177,69,.085),transparent 26%),
    linear-gradient(145deg,#fff 0%,#fffdf8 100%)!important;
  box-shadow:var(--jm87-shadow)!important;
  overflow:hidden!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note-grid:after{
  content:"ACADEMIC • FORMATION • SERVICE"!important;
  position:absolute!important;
  right:28px!important;
  top:18px!important;
  color:rgba(8,83,68,.095)!important;
  font:800 9px/1.2 Manrope,Arial,sans-serif!important;
  letter-spacing:.16em!important;
  pointer-events:none!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-seal{
  width:138px!important;
  height:138px!important;
  margin:0!important;
  display:grid!important;
  place-items:center!important;
  align-content:center!important;
  border:1px solid rgba(191,142,47,.24)!important;
  border-radius:50%!important;
  background:linear-gradient(145deg,#f5f7f2,#e9f1ed)!important;
  box-shadow:inset 0 0 0 10px rgba(255,255,255,.62),0 14px 32px rgba(4,48,40,.08)!important;
  color:#aa7d26!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-seal img{
  width:68px!important;
  height:68px!important;
  max-width:68px!important;
  object-fit:contain!important;
  padding:5px!important;
  border-radius:50%!important;
  background:#fff!important;
  box-shadow:0 5px 18px rgba(4,48,40,.07)!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-seal span{
  display:block!important;
  margin:6px 0 0!important;
  color:#b18128!important;
  font:850 9px/1.2 Manrope,Arial,sans-serif!important;
  letter-spacing:.16em!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note-grid>div:nth-child(2){
  min-width:0!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note .jm66-kicker{
  display:block!important;
  margin:0 0 9px!important;
  color:#b68528!important;
  font-weight:850!important;
  letter-spacing:.15em!important;
  opacity:1!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note h2{
  max-width:820px!important;
  margin:0 0 13px!important;
  color:var(--jm87-ink)!important;
  font-family:Newsreader,"Source Serif 4",serif!important;
  font-size:clamp(36px,3.55vw,57px)!important;
  font-weight:600!important;
  line-height:1.02!important;
  letter-spacing:-.035em!important;
  text-wrap:balance!important;
  opacity:1!important;
  text-shadow:none!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note p{
  max-width:820px!important;
  margin:0!important;
  color:var(--jm87-copy)!important;
  font-size:14px!important;
  line-height:1.78!important;
  opacity:1!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-actions{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:center!important;
  gap:9px!important;
  min-width:0!important;
  margin:0!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-actions a{
  width:100%!important;
  min-height:48px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  padding:0 16px!important;
  border:1px solid rgba(8,83,68,.15)!important;
  border-radius:13px!important;
  background:#f2f6f3!important;
  color:#174b40!important;
  font-size:10.5px!important;
  font-weight:850!important;
  text-align:center!important;
  text-decoration:none!important;
  box-shadow:none!important;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-actions a.is-primary{
  border-color:#dbac46!important;
  background:linear-gradient(135deg,#efc765,#dda53a)!important;
  color:#153b33!important;
  box-shadow:0 12px 26px rgba(216,163,55,.19)!important;
}
body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-actions a:hover{
  transform:translateY(-2px)!important;
  border-color:rgba(8,83,68,.28)!important;
  box-shadow:0 12px 25px rgba(4,48,40,.10)!important;
}

/* Footer CTA transition: keep the academic card visually separate and readable. */
body#jm-site-root.jm-ui-v87 .jm70-footer-cta{
  border-top:1px solid rgba(4,48,40,.08)!important;
}

/* --------------------------------------------------------------------------
   DESKTOP MEGA MENU — stable hover corridor + graceful close delay support.
   The old top:+17px placement created an empty mouse gap between trigger and menu.
   -------------------------------------------------------------------------- */
@media (min-width:1121px){
  body#jm-site-root.jm-ui-v87 .jm70-header,
  body#jm-site-root.jm-ui-v87 .jm70-header-inner,
  body#jm-site-root.jm-ui-v87 .jm70-nav{
    overflow:visible!important;
  }
  body#jm-site-root.jm-ui-v87 .jm70-nav-group{
    position:relative!important;
    isolation:isolate!important;
  }
  body#jm-site-root.jm-ui-v87 .jm70-nav-group:after{
    content:""!important;
    position:absolute!important;
    z-index:1000!important;
    left:-16px!important;
    right:-16px!important;
    top:100%!important;
    height:24px!important;
    background:transparent!important;
    pointer-events:auto!important;
  }
  body#jm-site-root.jm-ui-v87 .jm70-mega{
    z-index:1002!important;
    top:calc(100% + 9px)!important;
    transition:opacity .16s ease,transform .18s ease,visibility 0s linear .18s!important;
  }
  body#jm-site-root.jm-ui-v87 .jm70-nav-group:hover .jm70-mega,
  body#jm-site-root.jm-ui-v87 .jm70-nav-group:focus-within .jm70-mega,
  body#jm-site-root.jm-ui-v87 .jm70-nav-group.is-jm87-open .jm70-mega{
    pointer-events:auto!important;
    opacity:1!important;
    visibility:visible!important;
    transition-delay:0s!important;
    transform:translateX(-50%) translateY(0)!important;
  }
  html[dir="rtl"] body#jm-site-root.jm-ui-v87 .jm70-nav-group:hover .jm70-mega,
  html[dir="rtl"] body#jm-site-root.jm-ui-v87 .jm70-nav-group:focus-within .jm70-mega,
  html[dir="rtl"] body#jm-site-root.jm-ui-v87 .jm70-nav-group.is-jm87-open .jm70-mega{
    transform:translateX(50%) translateY(0)!important;
  }
  body#jm-site-root.jm-ui-v87 .jm70-nav-group.is-jm87-open>.jm70-nav-trigger{
    background:#edf5f1!important;
    color:#075443!important;
  }
  body#jm-site-root.jm-ui-v87 .jm70-nav-group.is-jm87-open>.jm70-nav-trigger>i{
    transform:rotate(180deg)!important;
  }
}

/* Tablet: give the academic note a strong 2-column composition, actions below. */
@media (min-width:761px) and (max-width:1100px){
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note-grid{
    grid-template-columns:126px minmax(0,1fr)!important;
    gap:26px!important;
    width:min(920px,calc(100% - 40px))!important;
    padding:32px!important;
  }
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-seal{
    width:116px!important;height:116px!important;
  }
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-actions{
    grid-column:2!important;
    flex-direction:row!important;
    justify-content:flex-start!important;
  }
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-actions a{
    width:auto!important;min-width:148px!important;
  }
}

/* Mobile: clean, readable card with no oversized dead space. */
@media (max-width:760px){
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note{
    padding:48px 0!important;
  }
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note-grid{
    grid-template-columns:minmax(0,1fr)!important;
    gap:20px!important;
    width:calc(100% - 28px)!important;
    padding:24px!important;
    border-radius:22px!important;
  }
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note-grid:after{display:none!important}
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-seal{
    width:92px!important;height:92px!important;
    justify-self:start!important;
    box-shadow:inset 0 0 0 7px rgba(255,255,255,.62),0 10px 24px rgba(4,48,40,.07)!important;
  }
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-seal img{width:50px!important;height:50px!important}
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-seal span{font-size:7px!important;margin-top:3px!important}
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note h2{
    font-size:clamp(32px,9.5vw,42px)!important;
    line-height:1.03!important;
    margin-bottom:12px!important;
  }
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-note p{
    font-size:14px!important;
    line-height:1.72!important;
  }
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:9px!important;
  }
  body#jm-site-root.jm-ui-v87:not(.jm-portal-workspace-page) .jm66-about-page .jm66-academic-actions a{
    width:100%!important;min-height:48px!important;
  }
}