/* ==========================================================================
   ATHENA V5.2.0
   Compact card frames + Explore with Athena dropdown
   ========================================================================== */

/* --------------------------------------------------------------------------
   REMOVE EXTRA MEDIA VISUALS
   -------------------------------------------------------------------------- */

.athena5-card-media,
.athena5-cap-media{
  display:none !important;
}

/* restore original icon dominance */

.athena5-card-icon{
  display:flex !important;

  width:30px !important;
  height:30px !important;

  margin-bottom:7px !important;

  align-items:center;
  justify-content:center;

  border-radius:50%;

  background:
    rgba(255,255,255,.78);

  font-size:14px !important;
}

/* --------------------------------------------------------------------------
   COMPACT DISCOVERY CARDS
   -------------------------------------------------------------------------- */

.athena5-discovery-card{
  min-height:130px !important;

  padding:
    10px 12px 11px 12px !important;
}

.athena5-discovery-card strong{
  font-size:14px !important;
}

.athena5-discovery-card p{
  margin:
    5px 0 6px !important;

  font-size:11px !important;
  line-height:1.35 !important;
}

.athena5-card-link{
  margin-top:auto;

  font-size:10px !important;
}

/* --------------------------------------------------------------------------
   COMPACT ECOSYSTEM CARDS
   -------------------------------------------------------------------------- */

.athena5-ecosystem-card{
  min-height:116px !important;

  padding:
    9px 11px 10px 11px !important;
}

.athena5-ecosystem-card strong{
  margin-top:4px !important;

  font-size:12.5px !important;
}

.athena5-ecosystem-card p{
  margin:
    4px 0 5px !important;

  font-size:10px !important;
  line-height:1.3 !important;
}

/* --------------------------------------------------------------------------
   COMPACT CAPABILITY STRIP
   -------------------------------------------------------------------------- */

.athena5-capability{
  min-height:68px !important;

  padding:
    9px 12px !important;
}

.athena5-capability-icon{
  display:flex !important;

  width:40px !important;
  height:40px !important;

  flex:
    0 0 40px !important;

  font-size:20px !important;
}

.athena5-capability strong{
  font-size:13px !important;
}

.athena5-capability span{
  font-size:10.5px !important;
}

/* --------------------------------------------------------------------------
   HERO RIGHT SIDE
   -------------------------------------------------------------------------- */

.athena5-hero-right{
  position:relative;

  display:flex;

  align-items:flex-start;
  justify-content:flex-end;

  padding:
    18px 18px 18px 10px !important;
}

/* --------------------------------------------------------------------------
   EXPLORE WITH ATHENA TRIGGER
   -------------------------------------------------------------------------- */

.athena5-explore-dropdown{
  position:relative;

  z-index:80;
}

.athena5-explore-trigger{
  min-height:42px;

  display:flex;
  align-items:center;

  gap:8px;

  padding:
    9px 13px;

  border:
    1px solid
    #b9cfe6;

  border-radius:10px;

  background:
    rgba(255,255,255,.96);

  color:#173d6c;

  font-size:13px;
  font-weight:800;

  cursor:pointer;

  box-shadow:
    0 5px 16px
    rgba(7,35,65,.10);

  transition:
    transform .15s ease,
    box-shadow .15s ease,
    border-color .15s ease;
}

.athena5-explore-trigger:hover{
  transform:
    translateY(-1px);

  border-color:#82afe0;

  box-shadow:
    0 8px 20px
    rgba(7,35,65,.14);
}

.athena5-explore-trigger-symbol{
  display:flex;

  align-items:center;
  justify-content:center;

  width:26px;
  height:26px;

  border-radius:8px;

  background:
    linear-gradient(
      135deg,
      #e9f2ff,
      #f2edff
    );

  color:#075fcf;

  font-size:15px;
}

.athena5-explore-trigger-arrow{
  margin-left:3px;

  color:#71849c;

  font-size:11px;

  transition:
    transform .15s ease;
}

.athena5-explore-dropdown.is-open
.athena5-explore-trigger-arrow{
  transform:
    rotate(180deg);
}

/* --------------------------------------------------------------------------
   DROPDOWN PANEL
   -------------------------------------------------------------------------- */

.athena5-explore-panel{
  position:absolute;

  top:
    calc(100% + 8px);

  right:0;

  width:320px;

  padding:14px;

  border:
    1px solid
    #cbd8e5;

  border-radius:12px;

  background:
    rgba(255,255,255,.985);

  box-shadow:
    0 18px 40px
    rgba(5,34,64,.18);

  opacity:0;

  visibility:hidden;

  pointer-events:none;

  transform:
    translateY(-5px);

  transition:
    opacity .16s ease,
    visibility .16s ease,
    transform .16s ease;

  z-index:120;
}

.athena5-explore-dropdown.is-open
.athena5-explore-panel{
  opacity:1;

  visibility:visible;

  pointer-events:auto;

  transform:
    translateY(0);
}

/* reuse current guide styling but remove fixed block behavior */

.athena5-explore-panel
.athena5-guide{
  width:100% !important;

  padding:0 !important;

  border:0 !important;

  border-radius:0 !important;

  background:transparent !important;

  box-shadow:none !important;
}

.athena5-explore-panel
.athena5-guide-title{
  font-size:14px !important;
}

.athena5-explore-panel
.athena5-guide > p{
  font-size:11px !important;
}

.athena5-explore-panel
.athena5-example{
  min-height:27px !important;

  font-size:10px !important;
}

.athena5-explore-panel
.athena5-guide-actions{
  grid-template-columns:
    1fr 1fr !important;
}

/* --------------------------------------------------------------------------
   RESPONSIVE
   -------------------------------------------------------------------------- */

@media(max-width:900px){

  .athena5-explore-panel{
    position:fixed;

    top:74px;
    right:14px;
    left:14px;

    width:auto;

    max-height:
      calc(100vh - 90px);

    overflow:auto;
  }

}