/*
  Mezardan Sonra — cinematic nocturne layer
  Deep, tense and atmospheric without horror-film pastiche.
*/

:root {
  color-scheme: dark;
  --cin-black: #050708;
  --cin-night: #080d0f;
  --cin-pine: #0b1716;
  --cin-iron: #11191b;
  --cin-blood: #711827;
  --cin-blood-deep: #27070d;
  --cin-ember: #c07846;
  --cin-brass: #ad8a5d;
  --cin-bone: #e9e1d4;
  --cin-ash: #b9afa2;
  --cin-muted: #817a73;
  --cin-line: rgba(233, 225, 212, .14);
  --cin-line-hot: rgba(192, 120, 70, .42);
  --cin-shadow: 0 28px 80px rgba(0, 0, 0, .48);

  --ms-night: var(--cin-black);
  --ms-charcoal: var(--cin-iron);
  --ms-slate: var(--cin-ash);
  --ms-paper: var(--cin-bone);
  --ms-stone: var(--cin-ash);
  --ms-gold: var(--cin-brass);
  --ms-dawn: var(--cin-ember);

  --ms2-night: var(--cin-black);
  --ms2-charcoal: var(--cin-iron);
  --ms2-slate: var(--cin-ash);
  --ms2-paper: var(--cin-bone);
  --ms2-stone: var(--cin-ash);
  --ms2-gold: var(--cin-brass);
  --ms2-dawn: var(--cin-ember);
  --ms2-ink: var(--cin-bone);
  --ms2-line-dark: var(--cin-line);
  --ms2-line-light: var(--cin-line);
}

::selection {
  background: var(--cin-blood);
  color: #fff8ed;
}

body,
body.ms-home,
body:not(.ms-home) {
  background: var(--cin-black);
  color: var(--cin-bone);
}

.site-header,
.ms-home .site-header {
  border-bottom-color: rgba(192, 120, 70, .24);
  background:
    linear-gradient(90deg, rgba(39, 7, 13, .96), rgba(5, 7, 8, .96) 32%, rgba(5, 7, 8, .91));
  box-shadow: 0 18px 48px rgba(0, 0, 0, .28);
}

.site-header.scrolled,
.ms-home .site-header.scrolled {
  border-bottom-color: rgba(192, 120, 70, .42);
  background:
    linear-gradient(90deg, rgba(39, 7, 13, .98), rgba(5, 7, 8, .985) 36%, rgba(5, 7, 8, .98));
  box-shadow: 0 20px 56px rgba(0, 0, 0, .5);
}

.site-header .brand,
.ms-home .brand {
  color: #f2e8da;
  text-shadow: 0 0 26px rgba(192, 120, 70, .28);
}

.site-header .nav a,
.ms-home .nav a {
  color: #bdb3a7;
}

.site-header .nav a:hover,
.site-header .nav a[aria-current="page"],
.ms-home .nav a:hover,
.ms-home .nav a[aria-current="page"] {
  color: #fff4e5;
}

.site-header .nav a[aria-current="page"]::after,
.ms-home .nav a[aria-current="page"]::after {
  height: 2px;
  background: linear-gradient(90deg, var(--cin-blood), var(--cin-ember));
  box-shadow: 0 0 14px rgba(192, 120, 70, .52);
}

.site-header .nav .cta,
.ms-home .nav .cta {
  border-color: rgba(192, 120, 70, .62);
  background: linear-gradient(135deg, rgba(113, 24, 39, .54), rgba(39, 7, 13, .32));
  box-shadow: inset 0 0 22px rgba(113, 24, 39, .14);
}

/* Home — the first frame fills with darkness, ember and depth. */
.ms-hero {
  isolation: isolate;
  background: var(--cin-black);
}

.ms-hero::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 78% 46%, rgba(113, 24, 39, .34), transparent 32%),
    radial-gradient(ellipse at 62% 88%, rgba(14, 48, 44, .28), transparent 38%),
    linear-gradient(180deg, rgba(0, 0, 0, .08), transparent 44%, rgba(2, 3, 4, .84));
  mix-blend-mode: screen;
}

.ms-hero-image {
  width: 100%;
  object-position: 62% center;
  filter: saturate(.78) contrast(1.2) brightness(.68) sepia(.08);
  transform: scale(1.015);
}

.ms-hero-shade {
  z-index: 1;
  background:
    linear-gradient(90deg, #050708 0%, rgba(5, 7, 8, .97) 22%, rgba(5, 7, 8, .82) 47%, rgba(5, 7, 8, .22) 78%, rgba(5, 7, 8, .44) 100%),
    linear-gradient(180deg, rgba(5, 7, 8, .28), transparent 48%, rgba(5, 7, 8, .95));
}

.ms-hero-inner {
  z-index: 3;
}

.ms-kicker,
.ms-number,
.ms-card-label {
  color: var(--cin-ember);
}

.ms-kicker::after,
.ms-number::after {
  background: linear-gradient(90deg, var(--cin-blood), var(--cin-ember));
  box-shadow: 0 0 16px rgba(192, 120, 70, .36);
}

.ms-hero h1,
.ms-hero-question {
  color: #f1e8da;
  text-shadow: 0 8px 40px rgba(0, 0, 0, .84);
}

.ms-hero-intro {
  color: #c5bbb0;
}

.ms-button {
  border-radius: 1px;
  box-shadow: 0 16px 36px rgba(0, 0, 0, .3);
}

.ms-button-light {
  border-color: #a94750;
  background: linear-gradient(135deg, #8b2734, #5c101d);
  color: #fff4e7;
}

.ms-button-ghost {
  border-color: rgba(233, 225, 212, .35);
  background: rgba(5, 7, 8, .58);
  color: var(--cin-bone);
  backdrop-filter: blur(8px);
}

.ms-button-light:hover {
  background: linear-gradient(135deg, #a33441, #701626);
}

.ms-button-ghost:hover {
  border-color: var(--cin-ember);
  background: rgba(39, 7, 13, .62);
}

.ms-life {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(circle at 8% 18%, rgba(113, 24, 39, .26), transparent 28%),
    radial-gradient(circle at 92% 80%, rgba(14, 48, 44, .24), transparent 30%),
    linear-gradient(145deg, #07090a, #0d1112 52%, #060708);
}

.ms-life::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 0 58%, rgba(192, 120, 70, .035) 58% 58.15%, transparent 58.15%);
}

.ms-life-heading {
  border-bottom-color: rgba(192, 120, 70, .31);
}

.ms-life-heading h2,
.ms-life-story span {
  color: #eee4d7;
}

.ms-life-heading > p:last-child {
  color: #bcb2a7;
}

.ms-life-story {
  position: relative;
}

.ms-life-story img {
  aspect-ratio: 3 / 2;
  object-fit: cover;
  filter: saturate(.62) contrast(1.22) brightness(.74);
  box-shadow: var(--cin-shadow);
}

.ms-life-story::after {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  aspect-ratio: 3 / 2;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(39, 7, 13, .08), transparent 46%, rgba(5, 7, 8, .62)),
    radial-gradient(circle at 90% 8%, rgba(113, 24, 39, .28), transparent 36%);
  mix-blend-mode: screen;
}

.ms-life-story span {
  position: relative;
  padding-top: 15px;
}

.ms-life-story span::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42px;
  height: 1px;
  background: linear-gradient(90deg, var(--cin-blood), var(--cin-ember));
}

.ms-life-story:hover img,
.ms-life-story:focus-visible img {
  filter: saturate(.86) contrast(1.25) brightness(.84);
  transform: scale(1.012);
}

.ms-questions,
.ms-witnesses {
  border-color: var(--cin-line);
  background:
    radial-gradient(circle at 98% 12%, rgba(113, 24, 39, .14), transparent 28%),
    linear-gradient(180deg, #0d1214, #080b0c);
  color: var(--cin-bone);
}

.ms-questions .ms-number,
.ms-witnesses .ms-number,
.ms-hope .ms-number {
  color: var(--cin-ember);
}

.ms-heading-row {
  border-bottom-color: rgba(192, 120, 70, .26);
}

.ms-text-link {
  color: var(--cin-brass);
}

.ms-editorial-card,
.ms-witness-card {
  border-color: var(--cin-line);
  border-radius: 1px;
  background: linear-gradient(145deg, rgba(20, 29, 31, .96), rgba(8, 11, 12, .98));
  color: var(--cin-bone);
  box-shadow: 0 22px 62px rgba(0, 0, 0, .28);
}

.ms-editorial-card img,
.ms-witness-card img,
.ms-dark-card img {
  filter: saturate(.62) contrast(1.18) brightness(.72);
}

.ms-editorial-card:hover img,
.ms-witness-card:hover img,
.ms-dark-card:hover img {
  filter: saturate(.86) contrast(1.22) brightness(.82);
}

.ms-editorial-card:hover,
.ms-witness-card:hover,
.ms-dark-card:hover,
.ms-hope-links a:hover {
  border-color: rgba(192, 120, 70, .7);
  box-shadow: 0 28px 70px rgba(0, 0, 0, .42), 0 0 34px rgba(113, 24, 39, .12);
}

.ms-editorial-card h3,
.ms-witness-card h3,
.ms-dark-card h3 {
  color: #eee4d7;
}

.ms-editorial-card p,
.ms-witness-card p,
.ms-dark-card p {
  color: #afa69c;
}

.ms-editorial-card span,
.ms-witness-card span,
.ms-dark-card span {
  color: var(--cin-ember);
}

.ms-more-questions {
  border-top-color: var(--cin-line);
}

.ms-more-questions a {
  color: #afa69c;
}

.ms-more-questions a:hover {
  color: var(--cin-ember);
}

.ms-dark-questions {
  background:
    radial-gradient(circle at 50% -10%, rgba(150, 38, 51, .34), transparent 34%),
    linear-gradient(135deg, #25070d, #0b0b0d 58%, #07100f);
}

.ms-dark-card {
  border-color: rgba(192, 120, 70, .22);
  border-radius: 1px;
  box-shadow: 0 28px 70px rgba(0, 0, 0, .38);
}

.ms-dark-card::after {
  background:
    linear-gradient(180deg, rgba(5, 7, 8, .02) 8%, rgba(39, 7, 13, .26) 48%, rgba(5, 7, 8, .98) 100%);
}

.ms-banner {
  border-top-color: rgba(192, 120, 70, .24);
  box-shadow: inset 0 30px 70px rgba(0, 0, 0, .22);
}

.ms-banner > img {
  filter: saturate(.66) contrast(1.2) brightness(.7);
}

.ms-cross .ms-banner-shade {
  background:
    linear-gradient(90deg, rgba(5, 7, 8, .94), rgba(39, 7, 13, .48) 54%, rgba(5, 7, 8, .9)),
    radial-gradient(circle at 51% 48%, rgba(192, 120, 70, .18), transparent 28%);
}

.ms-tomb {
  background: var(--cin-pine);
  color: var(--cin-bone);
}

.ms-tomb .ms-banner-shade {
  background:
    linear-gradient(90deg, rgba(5, 7, 8, .93), rgba(11, 23, 22, .42) 52%, rgba(5, 7, 8, .86)),
    radial-gradient(circle at 68% 40%, rgba(192, 120, 70, .24), transparent 32%);
}

.ms-tomb .ms-number,
.ms-tomb .ms-banner-title,
.ms-tomb .ms-banner-link {
  color: var(--cin-ember);
}

.ms-hope {
  background: var(--cin-pine);
  color: var(--cin-bone);
}

.ms-hope-image {
  opacity: .72;
  filter: saturate(.72) contrast(1.2) brightness(.62);
}

.ms-hope-shade {
  background:
    linear-gradient(90deg, rgba(5, 7, 8, .98) 0%, rgba(8, 13, 15, .9) 45%, rgba(11, 23, 22, .64) 100%),
    linear-gradient(180deg, rgba(5, 7, 8, .58), rgba(39, 7, 13, .52));
}

.ms-hope .ms-section-heading h2 {
  color: #f0e6d8;
}

.ms-hope .ms-section-heading > p:last-child {
  color: #b9afa3;
}

.ms-hope-links {
  border-color: var(--cin-line-hot);
  background: rgba(5, 7, 8, .66);
  box-shadow: var(--cin-shadow);
  backdrop-filter: blur(12px);
}

.ms-hope-links a {
  border-color: rgba(192, 120, 70, .25);
  color: var(--cin-bone);
}

.ms-hope-links span {
  color: #aea59b;
}

.ms-hope-links b {
  color: var(--cin-ember);
}

.footer,
.ms-home .footer {
  border-top-color: rgba(192, 120, 70, .26);
  background:
    radial-gradient(circle at 12% 0, rgba(113, 24, 39, .2), transparent 28%),
    #050708;
}

/* Public inner pages — the same world, calmer for long-form reading. */
body:not(.ms-home) .article-hero {
  border-bottom-color: rgba(192, 120, 70, .3);
  background:
    radial-gradient(circle at 76% 22%, rgba(132, 31, 45, .42), transparent 26%),
    radial-gradient(circle at 88% 76%, rgba(14, 48, 44, .3), transparent 28%),
    linear-gradient(135deg, #050708, #16080c 56%, #0b1716);
  box-shadow: inset 0 -70px 90px rgba(0, 0, 0, .34);
}

body:not(.ms-home) .article-hero .lead,
body:not(.ms-home) .crumbs {
  color: #b8aea2;
}

body:not(.ms-home) .article,
body:not(.ms-home) .page-shell {
  background:
    radial-gradient(circle at 100% 0, rgba(113, 24, 39, .08), transparent 28%),
    linear-gradient(180deg, #101517, #090c0d 58%, #080a0b);
  color: var(--cin-bone);
}

body:not(.ms-home) .article-main h2,
body:not(.ms-home) .article-main h3,
body:not(.ms-home) .topic-list h2,
body:not(.ms-home) .church-card h2,
body:not(.ms-home) .church-entry h2,
body:not(.ms-home) .next-card h3,
body:not(.ms-home) .question-wrap h1,
body:not(.ms-home) .question-wrap h2,
body:not(.ms-home) .journey h1,
body:not(.ms-home) .journey h2,
body:not(.ms-home) .journey h3 {
  color: #eee5d8;
}

body:not(.ms-home) .article-main p,
body:not(.ms-home) .article-main li,
body:not(.ms-home) .discover-lead,
body:not(.ms-home) .discover-step > p {
  color: #c5bbb0;
}

body:not(.ms-home) .article-main a:not(.btn):not(.secondary),
body:not(.ms-home) .source-credit a {
  color: #d49a67;
  text-decoration-color: rgba(212, 154, 103, .45);
}

body:not(.ms-home) .article-main blockquote {
  border-left-color: var(--cin-ember);
  color: #f0e5d6;
  text-shadow: 0 6px 30px rgba(0, 0, 0, .36);
}

body:not(.ms-home) .article-main .callout,
body:not(.ms-home) .verse-chain,
body:not(.ms-home) .warning,
body:not(.ms-home) .pastoral-call,
body:not(.ms-home) .reflect-card,
body:not(.ms-home) .prayer-card {
  border-color: rgba(192, 120, 70, .55);
  background: linear-gradient(135deg, rgba(63, 14, 23, .72), rgba(16, 25, 27, .92));
  color: #e5dbcf;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .2);
}

body:not(.ms-home) .verse-chain strong,
body:not(.ms-home) .verse-ref-button,
body:not(.ms-home) .quote-ref {
  color: var(--cin-ember);
}

body:not(.ms-home) .verse-chain span,
body:not(.ms-home) .sources,
body:not(.ms-home) .source-panel,
body:not(.ms-home) .source-credit,
body:not(.ms-home) .church-address,
body:not(.ms-home) .church-count {
  color: #a89f95;
}

body:not(.ms-home) .side,
body:not(.ms-home) .page-toc {
  border-left-color: rgba(192, 120, 70, .25);
}

body:not(.ms-home) .side a {
  border-bottom-color: rgba(233, 225, 212, .08);
  color: #9e968d;
}

body:not(.ms-home) .side a:hover {
  color: var(--cin-ember);
}

body:not(.ms-home) .next-card {
  border-color: rgba(192, 120, 70, .32);
  background:
    radial-gradient(circle at 90% 12%, rgba(113, 24, 39, .38), transparent 30%),
    linear-gradient(145deg, #121a1c, #090b0c);
  box-shadow: var(--cin-shadow);
}

body:not(.ms-home) .btn,
body:not(.ms-home) .secondary,
body:not(.ms-home) button[type="submit"],
body:not(.ms-home) .church-actions a {
  border-color: rgba(192, 120, 70, .5);
  background: rgba(5, 7, 8, .22);
  color: #e9dfd2;
}

body:not(.ms-home) .btn-primary,
body:not(.ms-home) button[type="submit"],
body:not(.ms-home) .next-card .btn {
  border-color: #9a3d48;
  background: linear-gradient(135deg, #8c2936, #5a101c);
  color: #fff2e3;
}

body:not(.ms-home) .btn:hover,
body:not(.ms-home) .secondary:hover,
body:not(.ms-home) button[type="submit"]:hover,
body:not(.ms-home) .church-actions a:hover {
  border-color: var(--cin-ember);
  background-color: rgba(113, 24, 39, .36);
}

body:not(.ms-home) .card,
body:not(.ms-home) .topic-list a,
body:not(.ms-home) .church-card,
body:not(.ms-home) .church-entry,
body:not(.ms-home) .ticket-card,
body:not(.ms-home) .prepared-questions button,
body:not(.ms-home) .teaser {
  border-color: var(--cin-line);
  background: linear-gradient(145deg, rgba(20, 29, 31, .9), rgba(8, 11, 12, .94));
  color: var(--cin-bone);
  box-shadow: 0 22px 60px rgba(0, 0, 0, .18);
}

body:not(.ms-home) .topic-list a:hover,
body:not(.ms-home) .church-card:hover,
body:not(.ms-home) .teaser:hover {
  border-color: rgba(192, 120, 70, .58);
  box-shadow: 0 24px 64px rgba(0, 0, 0, .32), 0 0 30px rgba(113, 24, 39, .1);
}

body:not(.ms-home) .search-box input,
body:not(.ms-home) input,
body:not(.ms-home) select,
body:not(.ms-home) textarea,
body:not(.ms-home) .askbox,
body:not(.ms-home) .answer {
  border-color: rgba(233, 225, 212, .18);
  background: #0b1012;
  color: #e8dfd3;
}

body:not(.ms-home) input::placeholder,
body:not(.ms-home) textarea::placeholder {
  color: #7f7973;
}

body:not(.ms-home) label,
body:not(.ms-home) .faq summary {
  color: #ded4c8;
}

body:not(.ms-home) .question-page,
body:not(.ms-home) .journey.discovery {
  background:
    radial-gradient(circle at 76% 6%, rgba(113, 24, 39, .32), transparent 28%),
    linear-gradient(155deg, #050708, #0b1716);
  color: var(--cin-bone);
}

body:not(.ms-home) .question-wrap,
body:not(.ms-home) .journey-box,
body:not(.ms-home) .discovery-box {
  border-color: rgba(192, 120, 70, .25);
  background: linear-gradient(145deg, #12191b, #090c0d);
  color: var(--cin-bone);
  box-shadow: var(--cin-shadow);
}

body:not(.ms-home) .life-choice,
body:not(.ms-home) .next-steps-grid a {
  border-color: var(--cin-line);
  background: rgba(5, 7, 8, .22);
  color: var(--cin-bone);
}

body:not(.ms-home) .life-choice.selected {
  border-color: var(--cin-ember);
  background: linear-gradient(135deg, rgba(113, 24, 39, .66), rgba(14, 48, 44, .36));
}

body:not(.ms-home) .progress {
  background: #242729;
}

body:not(.ms-home) .progress span {
  background: linear-gradient(90deg, var(--cin-blood), var(--cin-ember));
  box-shadow: 0 0 16px rgba(192, 120, 70, .36);
}

.modal {
  background: rgba(2, 3, 4, .91);
}

.modal-card,
.modal-head,
.modal-foot {
  border-color: var(--cin-line);
  background: #101618;
  color: var(--cin-bone);
}

.modal-head,
.modal-foot {
  background: #0a0e10;
}

.modal-head h2,
.modal-head button,
.modal-foot button,
.verse-retry,
.verse-text {
  color: var(--cin-bone);
}

.verse-source {
  color: var(--cin-ash);
}

.toast,
.age-gate-card {
  border-color: rgba(192, 120, 70, .38);
  background: linear-gradient(145deg, #151b1c, #21080e);
  color: var(--cin-bone);
  box-shadow: var(--cin-shadow);
}

body:not(.ms-home) .cover {
  background:
    radial-gradient(circle at 24% 26%, rgba(113, 24, 39, .3), transparent 30%),
    linear-gradient(135deg, #050708, #0b1716);
}

body:not(.ms-home) .cover .hero-art {
  filter: saturate(.68) contrast(1.2) brightness(.74);
}

@media (max-width: 900px) {
  .site-header .nav,
  .ms-home .nav {
    background:
      radial-gradient(circle at 100% 0, rgba(113, 24, 39, .28), transparent 30%),
      #070a0b;
  }

  body:not(.ms-home) .side,
  body:not(.ms-home) .page-toc {
    border-color: var(--cin-line);
    background: #0b1012;
  }
}

@media (max-width: 640px) {
  .ms-hero-image {
    object-position: 68% center;
  }

  .ms-hero-shade {
    background:
      linear-gradient(90deg, rgba(5, 7, 8, .94), rgba(5, 7, 8, .62) 72%, rgba(39, 7, 13, .42)),
      linear-gradient(180deg, rgba(5, 7, 8, .24), rgba(5, 7, 8, .34) 46%, rgba(5, 7, 8, .98));
  }

  .ms-life-story::after {
    background: linear-gradient(180deg, rgba(39, 7, 13, .04), transparent 48%, rgba(5, 7, 8, .66));
  }

  body:not(.ms-home) .question-page,
  body:not(.ms-home) .journey.discovery {
    background: #070a0b;
  }

  body:not(.ms-home) .question-wrap,
  body:not(.ms-home) .journey-box,
  body:not(.ms-home) .discovery-box {
    box-shadow: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ms-hero-image {
    transform: none;
  }
}

/*
  Depth pass — brighter midtones and three distinct planes:
  shadowed foreground, focused subject and coloured atmosphere behind it.
*/
.ms-hero {
  background:
    radial-gradient(circle at 82% 22%, rgba(161, 203, 229, .24), transparent 28%),
    radial-gradient(circle at 67% 76%, rgba(38, 103, 108, .22), transparent 36%),
    #0a141a;
}

.ms-hero-image {
  inset: 0 -2% 0 auto;
  width: 76%;
  filter: saturate(1.05) contrast(1.1) brightness(1.04);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .3) 12%, #000 42%);
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .3) 12%, #000 42%);
  transform: scale(1.035);
}

.ms-hero-shade {
  background:
    radial-gradient(ellipse at 82% 18%, rgba(209, 232, 247, .25), transparent 25%),
    radial-gradient(ellipse at 67% 66%, rgba(75, 145, 157, .2), transparent 38%),
    linear-gradient(90deg, #071016 0%, rgba(7, 16, 22, .95) 24%, rgba(7, 16, 22, .56) 48%, rgba(7, 16, 22, .03) 78%, rgba(7, 16, 22, .15) 100%),
    linear-gradient(180deg, rgba(5, 11, 15, .06), transparent 48%, rgba(4, 10, 13, .48));
}

.ms-hero::after {
  background:
    radial-gradient(ellipse at 82% 18%, rgba(205, 232, 250, .35), transparent 26%),
    radial-gradient(ellipse at 62% 84%, rgba(51, 126, 132, .24), transparent 40%),
    linear-gradient(180deg, rgba(0, 0, 0, 0), transparent 52%, rgba(2, 7, 10, .34));
  opacity: .76;
}

.ms-hero-copy {
  filter: drop-shadow(0 24px 34px rgba(0, 0, 0, .55));
}

.ms-life {
  background:
    radial-gradient(circle at 6% 16%, rgba(137, 31, 47, .34), transparent 29%),
    radial-gradient(circle at 92% 74%, rgba(18, 72, 65, .3), transparent 31%),
    linear-gradient(145deg, #0b1113, #121d1f 52%, #090d0f);
}

.ms-life-story {
  isolation: isolate;
  perspective: 1100px;
  --depth-glow: rgba(113, 24, 39, .34);
}

.ms-life-story:nth-child(1) {
  --depth-image: url("assets/site-2026/02A-bazilari-hazirlanir.jpg");
  --depth-glow: rgba(192, 120, 70, .3);
}

.ms-life-story:nth-child(2) {
  --depth-image: url("assets/site-2026/02B-bazilari-vedalasamaz.jpg");
  --depth-glow: rgba(113, 24, 39, .38);
}

.ms-life-story:nth-child(3) {
  --depth-image: url("assets/site-2026/02C-bazilari-aniden-gider.jpg");
  --depth-glow: rgba(50, 91, 137, .34);
}

.ms-life-story:nth-child(4) {
  --depth-image: url("assets/site-2026/02D-bazilari-uzun-sure-aci-ceker.jpg");
  --depth-glow: rgba(126, 47, 65, .34);
}

.ms-life-story:nth-child(5) {
  --depth-image: url("assets/site-2026/02E-bazilari-sevdiklerini-birakir.jpg");
  --depth-glow: rgba(192, 120, 70, .3);
}

.ms-life-story:nth-child(6) {
  --depth-image: url("assets/site-2026/02F-bazilari-hic-beklemez.jpg");
  --depth-glow: rgba(22, 83, 75, .34);
}

.ms-life-story::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 8px -10px auto 12px;
  aspect-ratio: 3 / 2;
  pointer-events: none;
  background:
    linear-gradient(var(--depth-glow), var(--depth-glow)),
    var(--depth-image) center / cover no-repeat;
  filter: blur(19px) saturate(1.28);
  opacity: .5;
  transform: translateY(20px) scale(.96);
}

.ms-life-story img {
  position: relative;
  z-index: 1;
  filter: saturate(.92) contrast(1.14) brightness(.9);
  box-shadow:
    0 38px 78px rgba(0, 0, 0, .54),
    0 12px 28px var(--depth-glow),
    inset 0 1px rgba(255, 255, 255, .14);
  transform: translateZ(0);
  transition: filter 320ms ease, transform 480ms cubic-bezier(.2, .7, .2, 1);
}

.ms-life-story::after {
  z-index: 2;
  background:
    linear-gradient(90deg, rgba(3, 5, 6, .42), transparent 24%, transparent 72%, rgba(3, 5, 6, .28)),
    linear-gradient(180deg, rgba(255, 214, 168, .06), transparent 42%, rgba(5, 7, 8, .76)),
    radial-gradient(circle at 88% 10%, var(--depth-glow), transparent 34%);
  box-shadow: inset 0 -70px 78px -46px rgba(0, 0, 0, .96);
}

.ms-life-story span {
  z-index: 3;
  margin-top: -34px;
  padding: 60px 14px 0;
  background: linear-gradient(180deg, transparent, rgba(9, 13, 15, .94) 50%);
  text-shadow: 0 8px 24px rgba(0, 0, 0, .78);
}

.ms-life-story:hover img,
.ms-life-story:focus-visible img {
  filter: saturate(1.08) contrast(1.16) brightness(.98);
  transform: translate3d(0, -7px, 22px) scale(1.025);
}

.ms-questions,
.ms-witnesses {
  background:
    radial-gradient(circle at 96% 10%, rgba(141, 31, 47, .22), transparent 30%),
    radial-gradient(circle at 6% 78%, rgba(18, 72, 65, .18), transparent 32%),
    linear-gradient(180deg, #141e21, #0c1214);
}

.ms-editorial-card {
  grid-template-rows: 280px auto;
  padding-bottom: 18px;
  overflow: hidden;
  background: linear-gradient(145deg, #172326, #0a1012);
  box-shadow:
    0 34px 76px rgba(0, 0, 0, .38),
    inset 0 1px rgba(255, 255, 255, .08);
}

.ms-editorial-card > div {
  position: relative;
  z-index: 3;
  margin: -58px 18px 0;
  border-top: 1px solid rgba(214, 169, 111, .26);
  background:
    linear-gradient(145deg, rgba(24, 35, 38, .97), rgba(8, 12, 14, .98));
  box-shadow: 0 24px 55px rgba(0, 0, 0, .48);
  backdrop-filter: blur(14px);
}

.ms-editorial-card img,
.ms-witness-card img,
.ms-dark-card img {
  filter: saturate(.9) contrast(1.15) brightness(.88);
  transform: scale(1.015);
  transition: filter 320ms ease, transform 520ms cubic-bezier(.2, .7, .2, 1);
}

.ms-editorial-card:hover img,
.ms-witness-card:hover img,
.ms-dark-card:hover img {
  filter: saturate(1.08) contrast(1.16) brightness(.97);
  transform: scale(1.065);
}

.ms-witness-card {
  overflow: hidden;
  background: linear-gradient(145deg, #172326, #0a1012);
}

.ms-witness-card > div {
  position: relative;
  z-index: 3;
  margin: 18px 14px 18px -34px;
  border-left: 1px solid rgba(214, 169, 111, .26);
  background: linear-gradient(110deg, rgba(16, 25, 27, .98), rgba(8, 12, 14, .96));
  box-shadow: -24px 0 52px rgba(0, 0, 0, .46);
  backdrop-filter: blur(12px);
}

.ms-dark-questions {
  background:
    radial-gradient(circle at 46% -8%, rgba(191, 54, 70, .46), transparent 34%),
    radial-gradient(circle at 94% 88%, rgba(17, 66, 60, .26), transparent 28%),
    linear-gradient(135deg, #360b14, #101113 58%, #0a1716);
}

.ms-dark-card::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: auto -8% -12% 18%;
  height: 48%;
  pointer-events: none;
  background: radial-gradient(ellipse, rgba(133, 31, 45, .42), transparent 67%);
  filter: blur(18px);
}

.ms-banner > img {
  filter: saturate(.9) contrast(1.14) brightness(.86);
  transform: scale(1.025);
}

.ms-cross .ms-banner-shade {
  background:
    linear-gradient(90deg, rgba(6, 9, 10, .87), rgba(78, 16, 27, .34) 54%, rgba(6, 9, 10, .78)),
    radial-gradient(circle at 51% 48%, rgba(214, 142, 83, .3), transparent 29%);
}

.ms-tomb .ms-banner-shade {
  background:
    linear-gradient(90deg, rgba(6, 9, 10, .88), rgba(13, 38, 35, .25) 52%, rgba(6, 9, 10, .72)),
    radial-gradient(circle at 68% 40%, rgba(223, 158, 91, .34), transparent 33%);
}

.ms-hope-image {
  opacity: .82;
  filter: saturate(.94) contrast(1.14) brightness(.8);
  transform: scale(1.025);
}

.ms-hope-shade {
  background:
    linear-gradient(90deg, rgba(6, 9, 10, .95) 0%, rgba(10, 20, 21, .78) 48%, rgba(13, 39, 35, .42) 100%),
    linear-gradient(180deg, rgba(6, 9, 10, .34), rgba(67, 14, 24, .38));
}

body:not(.ms-home) .article-hero {
  background:
    radial-gradient(circle at 76% 24%, rgba(174, 45, 60, .5), transparent 27%),
    radial-gradient(circle at 88% 78%, rgba(18, 76, 68, .36), transparent 29%),
    linear-gradient(135deg, #090d0f, #260a11 56%, #102522);
}

body:not(.ms-home) .article,
body:not(.ms-home) .page-shell {
  background:
    radial-gradient(circle at 100% 0, rgba(132, 30, 45, .12), transparent 29%),
    linear-gradient(180deg, #172124, #0e1517 58%, #0b1012);
}

body:not(.ms-home) .card,
body:not(.ms-home) .topic-list a,
body:not(.ms-home) .church-card,
body:not(.ms-home) .church-entry,
body:not(.ms-home) .ticket-card,
body:not(.ms-home) .prepared-questions button,
body:not(.ms-home) .teaser {
  background: linear-gradient(145deg, rgba(29, 43, 46, .94), rgba(12, 18, 20, .97));
  box-shadow:
    0 28px 68px rgba(0, 0, 0, .3),
    inset 0 1px rgba(255, 255, 255, .07);
}

body:not(.ms-home) .cover .hero-art {
  filter: saturate(.92) contrast(1.15) brightness(.88);
  transform: scale(1.025);
}

@media (max-width: 900px) {
  .ms-hero-image {
    width: 86%;
  }

  .ms-editorial-card > div {
    margin-inline: 14px;
  }

  .ms-witness-card > div {
    margin: 16px 12px 16px -28px;
  }
}

@media (max-width: 640px) {
  .ms-hero-image {
    inset: 0;
    width: 100%;
    filter: saturate(1.04) contrast(1.09) brightness(.96);
    -webkit-mask-image: none;
    mask-image: none;
    transform: scale(1.025);
  }

  .ms-hero-shade {
    background:
      radial-gradient(circle at 84% 18%, rgba(207, 232, 249, .28), transparent 31%),
      radial-gradient(circle at 58% 62%, rgba(66, 137, 149, .18), transparent 40%),
      linear-gradient(90deg, rgba(6, 13, 18, .82), rgba(6, 13, 18, .34) 72%, rgba(10, 29, 41, .16)),
      linear-gradient(180deg, rgba(6, 13, 18, .04), rgba(6, 13, 18, .12) 44%, rgba(6, 13, 18, .82));
  }

  .ms-life-story::before {
    inset-inline: 10px -6px;
    filter: blur(15px) saturate(1.2);
    opacity: .42;
  }

  .ms-life-story span {
    margin-top: -28px;
    padding: 52px 10px 0;
  }

  .ms-editorial-card {
    grid-template-rows: 244px auto;
    padding-bottom: 12px;
  }

  .ms-editorial-card > div {
    margin: -44px 12px 0;
  }

  .ms-witness-card > div {
    margin: -44px 12px 12px;
    border-top: 1px solid rgba(214, 169, 111, .26);
    border-left: 0;
    box-shadow: 0 -22px 48px rgba(0, 0, 0, .44);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ms-hero-image,
  .ms-editorial-card img,
  .ms-witness-card img,
  .ms-dark-card img,
  .ms-banner > img,
  .ms-hope-image,
  body:not(.ms-home) .cover .hero-art {
    transform: none;
  }
}

/*
  Original cemetery hero: preserve the source image exactly as supplied.
  Depth comes from composition and typography, never colour grading or overlays.
*/
.ms-hero {
  background: #050708;
}

.ms-hero-image {
  inset: 0;
  width: 100%;
  object-position: center;
  filter: none;
  -webkit-mask-image: none;
  mask-image: none;
  transform: none;
}

.ms-hero-shade,
.ms-hero::after {
  display: none;
}

.ms-hero-copy {
  position: relative;
  padding: clamp(34px, 4vw, 58px) clamp(28px, 4vw, 56px) clamp(38px, 4vw, 58px) 0;
  background: linear-gradient(90deg, rgba(5, 7, 8, .96) 0%, rgba(5, 7, 8, .9) 72%, rgba(5, 7, 8, 0) 100%);
  filter: none;
}

.ms-hero-copy::before {
  content: "";
  position: absolute;
  inset: 0 100% 0 -50vw;
  background: rgba(5, 7, 8, .96);
}

@media (max-width: 640px) {
  .ms-hero,
  .ms-hero-inner {
    min-height: 0;
  }

  .ms-hero {
    padding-top: 70px;
  }

  .ms-hero-image {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
    filter: none;
    transform: none;
  }

  .ms-hero-inner {
    align-items: stretch;
    padding: 0 0 58px;
  }

  .ms-hero-copy {
    margin: 0;
    padding: 38px 0 0;
    background: #050708;
  }

  .ms-hero-copy::before {
    display: none;
  }
}
