/* ==========================================================================
   ATHENA RESOURCES ATLAS V1
   Also defines canonical interior-page hero presentation.
   ========================================================================== */

:root{
  --ar-navy:#0a2d53;
  --ar-navy-2:#123d6b;
  --ar-gold:#d2a33a;

  --ar-blue:#4e91d6;
  --ar-purple:#816bd5;
  --ar-orange:#d88a42;
  --ar-cyan:#279daf;
  --ar-green:#439b6c;
  --ar-rose:#cc6682;
  --ar-indigo:#6570d7;

  --ar-blue-soft:#eaf4ff;
  --ar-purple-soft:#f3efff;
  --ar-orange-soft:#fff2e6;
  --ar-cyan-soft:#e8f8fa;
  --ar-green-soft:#e9f8ef;
  --ar-rose-soft:#fff0f4;
  --ar-indigo-soft:#eef0ff;

  --ar-border:#cbd9e7;
  --ar-text:#12365e;
  --ar-muted:#647a91;
}

/* ==========================================================================
   GLOBAL INTERIOR HERO
   ========================================================================== */

.athena-interior-hero{
  position:relative;

  min-height:280px;

  margin:
    0 18px 18px;

  overflow:hidden;

  border:
    1.5px solid
    #aec6dc;

  border-radius:
    14px;

  background:
    linear-gradient(
      90deg,
      rgba(255,252,243,.94) 0%,
      rgba(255,252,243,.76) 30%,
      rgba(255,255,255,.15) 62%,
      rgba(5,40,72,.05) 100%
    ),
    url("/assets/images/athena-goddess-hero-exact.png");

  background-size:
    cover;

  background-position:
    center 18%;

  box-shadow:
    0 8px 24px
    rgba(4,32,62,.08);
}

.athena-interior-hero::after{
  content:"";

  position:absolute;
  inset:0;

  background:
    linear-gradient(
      90deg,
      rgba(255,253,247,.94) 0%,
      rgba(255,253,247,.83) 31%,
      rgba(255,253,247,.22) 58%,
      rgba(255,255,255,0) 75%
    );

  pointer-events:none;
}

.athena-interior-hero-copy{
  position:relative;

  z-index:2;

  max-width:650px;

  padding:
    42px 40px 34px;
}

.athena-interior-kicker{
  display:block;

  margin-bottom:10px;

  color:#a87812;

  font-size:11px;
  font-weight:850;

  letter-spacing:.17em;

  text-transform:uppercase;
}

.athena-interior-title{
  margin:0;

  color:#0f315f;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size:
    clamp(
      2.7rem,
      4.2vw,
      4.6rem
    );

  font-weight:500;

  line-height:.98;

  letter-spacing:-.03em;
}

.athena-interior-description{
  max-width:620px;

  margin:
    14px 0 0;

  color:#405f80;

  font-size:15px;

  line-height:1.52;
}

.athena-interior-hero-badge{
  position:absolute;

  right:30px;
  top:34px;

  z-index:2;

  max-width:180px;

  padding:
    10px 14px;

  border-left:
    3px solid
    var(--ar-gold);

  color:#143861;

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

  letter-spacing:.11em;

  line-height:1.55;

  text-transform:uppercase;
}

/* ==========================================================================
   RESOURCES PAGE SHELL
   ========================================================================== */

.athena-resources-page{
  padding:
    0 18px 36px;

  color:
    var(--ar-text);
}

.athena-resources-top{
  display:flex;

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

  gap:14px;

  margin:
    0 0 14px;

  padding:
    14px 16px;

  border:
    1.5px solid
    #a9c2dc;

  border-radius:
    12px;

  background:#fff;
}

.athena-resources-search{
  min-width:0;

  flex:1;

  display:flex;
  align-items:center;

  gap:9px;

  min-height:43px;

  padding:
    0 13px;

  border:
    1.5px solid
    #95b5d5;

  border-radius:
    9px;

  background:#f9fbfd;
}

.athena-resources-search input{
  min-width:0;

  flex:1;

  border:0;
  outline:0;

  background:transparent;

  color:#284966;

  font-size:13px;
}

.athena-resources-top-actions{
  display:flex;

  align-items:center;

  gap:8px;
}

.athena-resources-button{
  min-height:41px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  gap:7px;

  padding:
    8px 14px;

  border:
    1.5px solid
    #508ecb;

  border-radius:
    9px;

  background:#fff;

  color:#174878;

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

  text-decoration:none;

  cursor:pointer;
}

.athena-resources-button.primary{
  background:#0b68e8;
  color:#fff;

  border-color:#0859c5;
}

.athena-resources-button.directory{
  border-color:#846dd1;

  background:#f4f0ff;

  color:#5e44b3;
}

/* ==========================================================================
   MEGA DIRECTORY
   ========================================================================== */

.athena-directory{
  position:relative;

  margin-bottom:18px;
}

.athena-directory-panel{
  display:none;

  grid-template-columns:
    repeat(4,1fr);

  gap:12px;

  padding:16px;

  border:
    2px solid
    #627fd1;

  border-radius:
    13px;

  background:
    linear-gradient(
      135deg,
      #fbfdff,
      #f7f5ff
    );

  box-shadow:
    0 18px 42px
    rgba(8,35,66,.14);
}

.athena-directory.is-open
.athena-directory-panel{
  display:grid;
}

.athena-directory-group{
  min-width:0;

  padding:13px;

  border:
    1.5px solid
    var(--ar-border);

  border-radius:
    10px;

  background:#fff;
}

.athena-directory-group h3{
  margin:
    0 0 9px;

  color:#14375e;

  font-size:11px;

  letter-spacing:.07em;

  text-transform:uppercase;
}

.athena-directory-group a{
  display:block;

  margin:
    6px 0;

  color:#526d89;

  font-size:10.5px;

  text-decoration:none;
}

.athena-directory-group a:hover{
  color:#075fcf;

  text-decoration:underline;
}

/* ==========================================================================
   SECTION
   ========================================================================== */

.athena-resource-section{
  margin-bottom:16px;

  padding:
    18px;

  border:
    1.5px solid
    #c8d7e5;

  border-radius:
    13px;

  background:#fff;
}

.athena-resource-section-head{
  display:flex;

  align-items:flex-end;
  justify-content:space-between;

  gap:15px;

  margin-bottom:13px;
}

.athena-resource-section-head h2{
  margin:0;

  color:#11345f;

  font-size:21px;
}

.athena-resource-section-head p{
  max-width:840px;

  margin:
    4px 0 0;

  color:#667c94;

  font-size:11.5px;

  line-height:1.45;
}

/* ==========================================================================
   RESOURCE CARDS
   ========================================================================== */

.athena-resource-grid{
  display:grid;

  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:10px;
}

.athena-resource-grid.three{
  grid-template-columns:
    repeat(3,minmax(0,1fr));
}

.athena-resource-card{
  position:relative;

  min-height:138px;

  display:flex;
  flex-direction:column;

  padding:14px;

  border:
    1.7px solid
    var(--resource-accent,#75a7d7);

  border-radius:
    11px;

  background:
    var(--resource-soft,#edf5ff);

  color:#18395f;

  text-decoration:none;

  transition:
    transform .14s ease,
    box-shadow .14s ease,
    border-width .14s ease;
}

.athena-resource-card:hover{
  transform:
    translateY(-2px);

  border-width:2px;

  box-shadow:
    0 10px 24px
    rgba(5,35,66,.12);
}

.athena-resource-card-icon{
  width:34px;
  height:34px;

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

  margin-bottom:10px;

  border:
    1px solid
    rgba(255,255,255,.8);

  border-radius:9px;

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

  color:
    var(--resource-accent,#377eca);

  font-size:16px;
  font-weight:850;
}

.athena-resource-card strong{
  font-size:14px;

  line-height:1.25;
}

.athena-resource-card p{
  flex:1;

  margin:
    6px 0 9px;

  color:#5e748b;

  font-size:10.6px;

  line-height:1.4;
}

.athena-resource-card span{
  color:
    var(--resource-accent,#377eca);

  font-size:10px;

  font-weight:800;
}

/* Colors */

.resource-blue{
  --resource-accent:#4c8fd4;
  --resource-soft:#eaf4ff;
}

.resource-purple{
  --resource-accent:#806ad3;
  --resource-soft:#f3efff;
}

.resource-orange{
  --resource-accent:#d88a42;
  --resource-soft:#fff2e6;
}

.resource-cyan{
  --resource-accent:#289caf;
  --resource-soft:#e8f8fa;
}

.resource-green{
  --resource-accent:#449b6c;
  --resource-soft:#e9f8ef;
}

.resource-rose{
  --resource-accent:#cb6682;
  --resource-soft:#fff0f4;
}

.resource-indigo{
  --resource-accent:#6871d5;
  --resource-soft:#eef0ff;
}

.resource-gold{
  --resource-accent:#c69226;
  --resource-soft:#fff8e7;
}

/* ==========================================================================
   OBJECTIVE CHIPS
   ========================================================================== */

.athena-objective-grid{
  display:grid;

  grid-template-columns:
    repeat(4,1fr);

  gap:8px;
}

.athena-objective{
  min-height:48px;

  display:flex;
  align-items:center;

  padding:
    10px 12px;

  border:
    1.5px solid
    #a8c0d9;

  border-radius:
    9px;

  background:#f9fbfd;

  color:#2c4d6e;

  font-size:11px;
  font-weight:750;

  text-decoration:none;
}

/* ==========================================================================
   SYSTEM MAP
   ========================================================================== */

.athena-system-map{
  display:grid;

  grid-template-columns:
    1fr auto 1fr;

  gap:20px;

  align-items:center;

  padding:18px;

  border:
    1.5px solid
    #8297d1;

  border-radius:
    12px;

  background:
    linear-gradient(
      135deg,
      #f7f9ff,
      #fbfdff
    );
}

.athena-map-column{
  display:grid;

  gap:7px;
}

.athena-map-node{
  padding:
    8px 10px;

  border:
    1.5px solid
    #afc1d7;

  border-radius:
    8px;

  background:#fff;

  color:#405f7e;

  font-size:10.5px;
}

.athena-map-core{
  width:120px;
  height:120px;

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

  border:
    2px solid
    #d4a331;

  border-radius:50%;

  background:
    radial-gradient(
      circle,
      #fff8de,
      #f7f1df
    );

  color:#153b67;

  font-family:
    Georgia,
    serif;

  font-size:20px;
}

/* ==========================================================================
   RESOURCES FOOTER
   ========================================================================== */

.athena-resources-footer{
  display:grid;

  grid-template-columns:
    repeat(4,1fr);

  gap:10px;

  padding:16px;

  border:
    1.5px solid
    #aebfd3;

  border-radius:
    12px;

  background:
    #0b2d50;
}

.athena-resources-footer a{
  color:#d3dfeb;

  font-size:10.5px;

  text-decoration:none;
}

.athena-resources-footer a:hover{
  color:#fff;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media(max-width:1150px){

  .athena-resource-grid,
  .athena-objective-grid{
    grid-template-columns:
      repeat(2,1fr);
  }

  .athena-directory-panel{
    grid-template-columns:
      repeat(2,1fr);
  }

}

@media(max-width:700px){

  .athena-interior-hero{
    min-height:320px;
  }

  .athena-interior-hero-copy{
    padding:
      30px 20px;
  }

  .athena-interior-hero-badge{
    display:none;
  }

  .athena-resources-top{
    align-items:stretch;
    flex-direction:column;
  }

  .athena-resources-top-actions{
    flex-wrap:wrap;
  }

  .athena-resource-grid,
  .athena-resource-grid.three,
  .athena-objective-grid,
  .athena-directory-panel,
  .athena-resources-footer{
    grid-template-columns:
      1fr;
  }

  .athena-system-map{
    grid-template-columns:
      1fr;
  }

  .athena-map-core{
    margin:auto;
  }

}

/* ==========================================================================
   RESOURCES SIDEBAR HOVER POPUP ACCENT
   ========================================================================== */

.athena-sidebar-popup-resources{
  --athena-sidebar-popup-color:#4d91d6;
  --athena-sidebar-popup-soft:#edf5ff;

  border-color:#4d91d6 !important;
}