/* ANIMA MYSTICA / AURA
   Aura article image adjustments + Aura hub design.
   All category-specific rules are scoped to Aura classes. */

/* ==========================================================================
   ARTICLE IMAGES
   ========================================================================== */

.mysticism-aura-article .aura-article-figure{
  width:min(100%,420px);
  margin:30px auto;
}

.mysticism-aura-article .aura-article-figure img{
  width:auto;
  max-width:100%;
  height:auto;
}

.mysticism-aura-article .aura-article-figure figcaption{
  max-width:38em;
  margin:9px auto 0;
  color:#9fb2bd;
  font-size:12px;
  line-height:1.75;
  text-align:center;
}

/* ==========================================================================
   HUB
   Black-based hub. Hero reuses the same aura.webp image used by the
   Mysticism FIELDS Aura card.
   ========================================================================== */

.category-mysticism #pagebody.mysticism-aura-hub{
  max-width:1100px;
  margin:0 auto;
  padding:22px 16px 44px;
  color:#d8d2c8;
  background:#05070b;
}

.mysticism-aura-hub .aura-hub-hero{
  margin:0 0 26px;
  overflow:hidden;
  border:1px solid rgba(184,162,111,.24);
  background:#05070b;
}

.mysticism-aura-hub .aura-hub-hero-figure{
  position:relative;
  height:390px;
  margin:0;
  overflow:hidden;
  background:#020305;
}

.mysticism-aura-hub .aura-hub-hero-figure::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(
    180deg,
    rgba(2,4,7,.08),
    rgba(2,4,7,.22) 58%,
    rgba(2,4,7,.62)
  );
}

.mysticism-aura-hub .aura-hub-hero-figure img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 42%;
  filter:brightness(.88) saturate(.92) contrast(1.02);
}

.mysticism-aura-hub .aura-hub-hero-copy{
  padding:20px 26px 24px;
  border-top:1px solid rgba(184,162,111,.14);
  background:#070a10;
}

.mysticism-aura-hub .aura-hub-kicker,
.mysticism-aura-hub .aura-hub-section-kicker,
.mysticism-aura-hub .aura-hub-section-heading > p{
  margin:0 0 8px!important;
  color:#aa9567;
  font-size:10px;
  font-weight:600;
  line-height:1.5;
  letter-spacing:.18em;
}

.mysticism-aura-hub .aura-hub-hero-copy h1{
  margin:0 0 10px!important;
  color:#f0ece4!important;
  font:400 clamp(30px,4vw,44px)/1.3 "Noto Serif JP","Yu Mincho",Georgia,serif!important;
}

.mysticism-aura-hub .aura-hub-hero-copy > p:last-child{
  margin:0!important;
  color:#c9c2b7;
  font-size:14px;
  line-height:1.9;
}

.mysticism-aura-hub .aura-hub-introduction,
.mysticism-aura-hub .aura-hub-contents{
  margin:0 0 24px;
  padding:22px 20px;
  border:1px solid rgba(184,162,111,.14);
  background:#080c12;
}

.mysticism-aura-hub .aura-hub-introduction h2,
.mysticism-aura-hub .aura-hub-section-heading h2{
  margin:0 0 12px!important;
  color:#eee8de!important;
}

.mysticism-aura-hub .aura-hub-introduction p:last-child{
  margin:0!important;
  color:#c8c0b5;
  line-height:1.95;
}

.mysticism-aura-hub .aura-hub-card-list .mysticism-card{
  border-color:rgba(184,162,111,.15);
  background:linear-gradient(105deg,rgba(14,21,31,.96),rgba(8,13,20,.98));
}

.mysticism-aura-hub .aura-hub-card-list .mysticism-card-no,
.mysticism-aura-hub .aura-hub-card-list .mysticism-card-arrow{
  color:#b7a06f;
}

.mysticism-aura-hub .aura-hub-card-list .mysticism-card-body strong{
  color:#ece7de;
}

.mysticism-aura-hub .aura-hub-card-list .mysticism-card-body small{
  color:#b9b3aa;
}

/* ==========================================================================
   MOBILE
   ========================================================================== */

@media(max-width:700px){
  .mysticism-aura-article .aura-article-figure{
    width:100%;
  }

  .category-mysticism #pagebody.mysticism-aura-hub{
    padding:14px 10px 34px;
  }

  .mysticism-aura-hub .aura-hub-hero-figure{
    height:250px;
  }

  .mysticism-aura-hub .aura-hub-hero-copy,
  .mysticism-aura-hub .aura-hub-introduction,
  .mysticism-aura-hub .aura-hub-contents{
    padding:18px 16px;
  }
}