/* RogueVerse Studio visual publishing standard: imagery is structural, not optional. */
:root{--rv-fallback-art:url('assets/2026/editorial-fallback.svg')}

/* Clickable editorial cards should never render as text-only slabs. */
.section-card,
.story-list a,
.post-placeholder,
.feature-card,
.story-stack a{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.section-card::before,
.story-list a::before,
.post-placeholder::before,
.feature-card::before,
.story-stack a::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background-image:var(--card-image,var(--rv-card-art,var(--rv-fallback-art)));
  background-size:cover;
  background-position:center;
  opacity:.42;
  transition:transform .35s ease,opacity .35s ease,filter .35s ease;
}
.section-card::after,
.story-list a::after,
.post-placeholder::after,
.feature-card::after,
.story-stack a::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(0deg,rgba(4,7,12,.98) 4%,rgba(4,7,12,.72) 52%,rgba(4,7,12,.24)),linear-gradient(90deg,rgba(4,7,12,.84),transparent 72%);
  pointer-events:none;
}
.section-card:hover::before,.story-list a:hover::before,.feature-card:hover::before,.story-stack a:hover::before{transform:scale(1.035);opacity:.58;filter:saturate(1.08)}

/* Homepage story stack keeps the compact editorial layout while gaining individual art. */
.story-stack a{background:linear-gradient(145deg,rgba(12,19,31,.94),rgba(7,11,18,.96))!important}
.story-stack a::before{opacity:.32;background-position:center}
.story-stack a::after{background:linear-gradient(90deg,rgba(4,7,12,.95),rgba(4,7,12,.72) 64%,rgba(4,7,12,.34))}
.story-stack a:hover::before{opacity:.5}

/* Auto-generated article art uses a dedicated mobile composition instead of a hard crop. */
.rv-auto-article-art{width:min(100%,980px);margin:38px auto 46px;overflow:hidden;background:#05080f;border:1px solid rgba(10,16,32,.14);box-shadow:0 22px 55px rgba(0,0,0,.22)}
.rv-auto-article-art picture{display:block;width:100%}
.rv-auto-article-art img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:center}

/* Homepage Mythra worlds must show their actual title art instead of construction cards. */
.rv-home .series-card--sentou>img{object-position:-9999px;background:url('assets/mythra/sentou-title.svg') center/cover no-repeat}
.rv-home .series-card--love>img{object-position:-9999px;background:url('assets/mythra/love-power-ai-love-cover.png') center 34%/cover no-repeat}
.rv-home .series-card--stranded>img{object-position:-9999px;background:url('assets/mythra/stranded-title.webp') center/cover no-repeat}

/* If an older article template somehow has no lead image at all, keep a visible safety net. */
.article-page .article-shell:not(:has(.article-lead-art))::before{
  content:"";
  display:block;
  width:100%;
  aspect-ratio:16/9;
  margin:0 0 38px;
  background-image:var(--rv-article-art,var(--rv-fallback-art));
  background-size:cover;
  background-position:center;
  border:1px solid rgba(10,16,32,.14);
  box-shadow:0 22px 55px rgba(0,0,0,.22);
}

/* Major text-only category sections still receive a visual field until a dedicated illustration is installed. */
.category:not(:has(img)){
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:46px clamp(22px,4vw,58px);
  min-height:300px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  background:#0b1018;
  color:#fff;
}
.category:not(:has(img))::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background-image:var(--rv-section-art,var(--rv-fallback-art));
  background-size:cover;
  background-position:center;
  opacity:.38;
}
.category:not(:has(img))::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(0deg,rgba(4,7,12,.98),rgba(4,7,12,.40) 72%);
}
.category:not(:has(img)) p{max-width:760px;color:#d4dae4}

/* Section-specific safety-net identities. Dedicated page artwork should replace these whenever available. */
.canon-body .section-card:not(.section-card--image){--rv-card-art:url('assets/optimized/animanga-updates-1440.webp')}
body:has(a[href*="/mythra/"]) .mythra-panel{--rv-section-art:url('assets/optimized/mythra-hero-1440.webp')}
body:has(.culture-directory) .story-list a{--rv-card-art:url('assets/2026/our-culture-hero-desktop-v1.png')}
body:has(.wellness-grid) .story-list a{--rv-card-art:url('assets/2026/community-hero-desktop-v1.png')}
.future-page .story-list a,.future-page .category{--rv-card-art:url('assets/2026/future-hero-desktop-v1.png');--rv-section-art:url('assets/2026/future-hero-desktop-v1.png')}

/* Legal/policy pages were the final major text-only landing pages in the audit. */
.legal-art-hero{position:relative;min-height:clamp(360px,42vw,590px);display:flex;align-items:flex-end;overflow:hidden;background:#05080d;border-bottom:1px solid rgba(255,255,255,.12);isolation:isolate}
.legal-art-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.86) contrast(1.04)}
.legal-art-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,4,8,.94),rgba(2,4,8,.52) 52%,rgba(2,4,8,.26)),linear-gradient(0deg,rgba(2,4,8,.96),transparent 62%)}
.legal-art-hero__copy{position:relative;z-index:2;max-width:900px;padding:clamp(42px,7vw,92px) clamp(22px,6vw,92px)}
.legal-art-hero__copy h1{margin:.12em 0 .16em;font:700 clamp(48px,7vw,98px)/.9 Russo One,sans-serif;text-transform:uppercase;color:#fff;text-shadow:0 5px 28px #000}
.legal-art-hero__copy p:not(.eyebrow){max-width:690px;color:#d8dfe9;font-size:clamp(16px,1.4vw,20px);line-height:1.65}
.legal-art-hero--privacy>img{object-position:18% 70%}
.legal-art-hero--terms>img{object-position:82% 70%}

@media(max-width:720px){
  .section-card::before,.story-list a::before,.feature-card::before,.story-stack a::before{background-position:center top}
  .rv-auto-article-art{margin:26px -2px 38px;width:calc(100% + 4px)}
  .rv-auto-article-art img{aspect-ratio:3/4;object-position:center top}
  .article-page .article-shell:not(:has(.article-lead-art))::before{aspect-ratio:3/4;background-position:center top}
  .category:not(:has(img)){min-height:380px;padding:36px 24px}
  .legal-art-hero{min-height:560px}.legal-art-hero>img{object-position:center}.legal-art-hero__copy{padding:44px 22px}
}

@media(prefers-reduced-motion:reduce){.section-card::before,.story-list a::before,.feature-card::before,.story-stack a::before{transition:none}.section-card:hover::before,.story-list a:hover::before,.feature-card:hover::before,.story-stack a:hover::before{transform:none}}