@charset "utf-8";

/*
Theme Name: Mandira - Hindu Temple & Puja HTML5 Template.
Author: Metropolitanthemes
Version: 1.0.0

%%%%%%% Table of CSS %%%%%%%

1. General
   1.1 Typography
   1.2 Spacing
   1.3 Buttons
   1.4 Section Title
   1.5 Helpers & Reveals
2. Preloader
3. Topbar
4. Header
5. Offcanvas Menu
6. Hero
7. Panchang
8. Stats
9. Mantra Marquee
10. About
11. Sevas
12. Donation
13. Festival & Events
14. Live Darshan
15. Priests
16. Testimonials
17. Blog
18. CTA
19. Subheader
20. Inner Common
21. Home 02 Utsav
22. Home 03 Prarthana
23. About Page
24. Seva Pages
25. Puja Booking
26. Panchang Page
27. Temple Pages
28. Give Pages
29. Shop
30. Blog, FAQ, Contact & Account
31. Footer
32. Back To Top
*/

/*======================
1. General
========================*/
:root {
  /* brand: peacock teal, saffron, kumkum red, temple brass */
  --mn-saffron: #EE8A1E;
  --mn-saffron-rgb: 238, 138, 30;
  --mn-peacock: #0F5C5E;
  --mn-peacock-rgb: 15, 92, 94;
  --mn-peacock-light: #2F8B89;
  --mn-kumkum: #C8372D;

  /* colors (light) */
  --mn-primary: #EE8A1E;
  --mn-primary-rgb: 238, 138, 30;
  --mn-primary-deep: #C96A0A;
  --mn-primary-deep-rgb: 201, 106, 10;
  --mn-primary-light: #F7B45C;
  --mn-primary-text: #9A5208;
  --mn-on-primary: #10292A;
  --mn-accent: #C8372D;
  --mn-accent-rgb: 200, 55, 45;
  --mn-accent-deep: #A3281F;
  --mn-teal: #0F5C5E;
  --mn-teal-rgb: 15, 92, 94;
  --mn-teal-text: #0F5C5E;
  --mn-brass: #C29A4E;
  --mn-brass-rgb: 194, 154, 78;
  --mn-brass-text: #85621F;
  --mn-bg: #FFFDF9;
  --mn-bg-rgb: 255, 253, 249;
  --mn-bg-alt: #F7F0E5;
  --mn-bg-alt-rgb: 247, 240, 229;
  --mn-bg-alt-2: #EFE4D2;
  --mn-card: #FFFFFF;
  --mn-card-rgb: 255, 255, 255;
  --mn-heading: #10292A;
  --mn-heading-rgb: 16, 41, 42;
  --mn-text: #4E5B5B;
  --mn-muted: #637170;
  --mn-muted-rgb: 99, 113, 112;
  --mn-line: #EADFCC;
  --mn-line-2: #DACAAF;
  --mn-solid: #10292A;
  --mn-on-solid: #FFFFFF;
  --mn-band: #0B2B2C;
  --mn-band-rgb: 11, 43, 44;
  --mn-band-deep: #061D1E;
  --mn-on-band: #FFFFFF;
  --mn-on-band-rgb: 255, 255, 255;
  --mn-shadow-rgb: 16, 41, 42;

  /* WebGL texture colours (read by the shader block) */
  --mn-gl-a: #0B2B2C;
  --mn-gl-b: #0F5C5E;
  --mn-gl-c: #EE8A1E;

  /* typography */
  --mn-ff-heading: 'Cormorant Garamond', Georgia, serif;
  --mn-ff-body: 'Manrope', sans-serif;
  --mn-fs-h1: clamp(46px, 5.4vw, 84px);
  --mn-fs-h2: clamp(38px, 4vw, 62px);
  --mn-fs-h3: 24px;
  --mn-fs-h4: 20px;
  --mn-fs-h5: 18px;
  --mn-fs-h6: 16px;

  /* shape */
  --mn-radius: 18px;
  --mn-radius-sm: 12px;
  --mn-shadow: 0 18px 44px rgba(16, 41, 42, 0.07);
  --mn-shadow-lg: 0 32px 70px rgba(16, 41, 42, 0.14);
  --mn-ease: cubic-bezier(0.22, 1, 0.36, 1);

  /* direction: horizontal nudges multiply by this */
  --mn-dir: 1;
  color-scheme: light;
}
[dir="rtl"] {
  --mn-dir: -1;
}
/* dark mode: the grounds go to a peacock night, saffron brightens for text */
[data-theme="dark"] {
  --mn-primary: #F29A35;
  --mn-primary-rgb: 242, 154, 53;
  --mn-primary-deep: #E07E14;
  --mn-primary-text: #F5AE5B;
  --mn-on-primary: #0A1A1B;
  --mn-teal-text: #6CC3BF;
  --mn-brass-text: #D9B672;
  --mn-bg: #071617;
  --mn-bg-rgb: 7, 22, 23;
  --mn-bg-alt: #0B1E1F;
  --mn-bg-alt-rgb: 11, 30, 31;
  --mn-bg-alt-2: #102728;
  --mn-card: #0F2526;
  --mn-card-rgb: 15, 37, 38;
  --mn-heading: #F6EFE3;
  --mn-heading-rgb: 246, 239, 227;
  --mn-text: #B2C0BE;
  --mn-muted: #93A4A2;
  --mn-muted-rgb: 147, 164, 162;
  --mn-line: #1C3738;
  --mn-line-2: #2A4849;
  --mn-solid: #F6EFE3;
  --mn-on-solid: #0A1A1B;
  --mn-band: #041011;
  --mn-band-rgb: 4, 16, 17;
  --mn-band-deep: #020A0B;
  --mn-shadow-rgb: 0, 0, 0;
  --mn-shadow: 0 18px 44px rgba(0, 0, 0, 0.32);
  --mn-shadow-lg: 0 32px 70px rgba(0, 0, 0, 0.45);
  --mn-gl-a: #041011;
  --mn-gl-b: #0D4547;
  --mn-gl-c: #F29A35;
  color-scheme: dark;
}
/* a theme switch eases every colour for a moment, then stops */
.theme-anim,
.theme-anim *,
.theme-anim *::before,
.theme-anim *::after {
  transition: background-color 0.45s ease, color 0.45s ease, border-color 0.45s ease, fill 0.45s ease !important;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  font-family: var(--mn-ff-body);
  font-size: 16.5px;
  line-height: 1.75;
  color: var(--mn-text);
  background-color: var(--mn-bg);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  /* the display serif sets old-style figures by default: numbers stay lining */
  font-feature-settings: "lnum" 1;
}
::selection {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
a {
  text-decoration: none;
  color: inherit;
  transition: color 0.3s ease;
}
a:hover {
  color: var(--mn-primary-text);
}
img {
  max-width: 100%;
}
ul.mn-reset {
  list-style: none;
  margin: 0;
  padding: 0;
}
button {
  font-family: inherit;
  cursor: pointer;
}
:focus-visible {
  outline: 3px solid rgba(var(--mn-primary-rgb), 0.6);
  outline-offset: 3px;
}
.mn-skip-link {
  position: absolute;
  inset-inline-start: -9999px;
  top: 0;
  z-index: 10000;
  background-color: var(--mn-solid);
  color: var(--mn-on-solid);
  font-size: 14px;
  padding: 12px 20px;
  border-end-end-radius: var(--mn-radius-sm);
}
.mn-skip-link:focus {
  inset-inline-start: 0;
  color: var(--mn-on-solid);
}

/*======================
1.1 Typography
========================*/
h1, h2, h3, h4, h5, h6 {
  color: var(--mn-heading);
  line-height: 1.24;
}
/* display headings carry the serif; component titles carry the weight */
h1, h2 {
  font-family: var(--mn-ff-heading);
  font-weight: 500;
  letter-spacing: -0.012em;
}
h1, h2 {
  text-wrap: balance;
}
h1 { font-size: var(--mn-fs-h1); line-height: 1.02; }
h2 { font-size: var(--mn-fs-h2); line-height: 1.06; }
h3, h4, h5, h6 {
  font-family: var(--mn-ff-body);
  font-weight: 700;
  letter-spacing: -0.015em;
}
h3 { font-size: var(--mn-fs-h3); }
h4 { font-size: var(--mn-fs-h4); }
h5 { font-size: var(--mn-fs-h5); }
h6 { font-size: var(--mn-fs-h6); }
p {
  margin-bottom: 16px;
}
p:last-child {
  margin-bottom: 0;
}
/* the accent words of a display title: italic, saffron */
h1 .accent,
h2 .accent,
.accent-serif {
  font-family: var(--mn-ff-heading);
  font-style: italic;
  font-weight: 500;
  color: var(--mn-primary-deep);
}
[data-theme="dark"] h1 .accent,
[data-theme="dark"] h2 .accent {
  color: var(--mn-primary);
}
.mn-num {
  font-family: var(--mn-ff-body);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

/*======================
1.2 Spacing
========================*/
.sec-pt-130 { padding-top: 140px; }
.sec-pb-130 { padding-bottom: 140px; }
.mb-30 { margin-bottom: 30px; }

/*======================
1.3 Buttons
========================*/
.mn-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--mn-ff-body);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1;
  color: var(--mn-on-primary);
  background-image: linear-gradient(135deg, var(--mn-primary-light) 0%, var(--mn-primary) 45%, var(--mn-primary-deep) 100%);
  background-size: 160% 100%;
  background-position: 0 0;
  border: none;
  border-radius: 999px;
  padding: 19px 32px;
  overflow: hidden;
  isolation: isolate;
  transition: box-shadow 0.4s var(--mn-ease), background-position 0.6s var(--mn-ease), color 0.35s ease;
}
.mn-btn:hover {
  color: var(--mn-on-primary);
  background-position: 100% 0;
  box-shadow: 0 14px 30px rgba(var(--mn-primary-rgb), 0.38);
}
.mn-btn i {
  font-size: 15px;
  transition: transform 0.4s var(--mn-ease);
}
.mn-btn:hover i {
  transform: translateX(calc(5px * var(--mn-dir)));
}
/* secondary: a tonal face with a saffron icon (hairline outlines read basic) */
.mn-btn.btn-outline {
  background-image: none;
  background-color: rgba(var(--mn-heading-rgb), 0.06);
  color: var(--mn-heading);
}
.mn-btn.btn-outline i {
  color: var(--mn-primary-deep);
}
.mn-btn.btn-outline:hover {
  background-color: rgba(var(--mn-heading-rgb), 0.11);
  box-shadow: none;
}
.mn-btn.btn-light {
  background-image: none;
  background-color: var(--mn-on-band);
  color: #10292A;
}
.mn-btn.btn-light i {
  color: var(--mn-primary-deep);
}
.mn-btn.btn-ink {
  background-image: none;
  background-color: var(--mn-solid);
  color: var(--mn-on-solid);
}
.mn-btn.btn-ink i {
  color: var(--mn-primary);
}
.mn-btn.btn-ink:hover {
  color: var(--mn-on-solid);
  box-shadow: 0 14px 30px rgba(var(--mn-shadow-rgb), 0.25);
}
.mn-btn.btn-glass {
  background-image: none;
  background-color: rgba(var(--mn-on-band-rgb), 0.1);
  color: var(--mn-on-band);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.mn-btn.btn-glass:hover {
  background-color: rgba(var(--mn-on-band-rgb), 0.18);
  box-shadow: none;
}
.mn-btn.btn-sm {
  font-size: 12px;
  padding: 14px 22px;
}
.mn-btn.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}
/* text link with an arrow */
.mn-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mn-heading);
}
.mn-link i {
  color: var(--mn-primary-deep);
  transition: transform 0.4s var(--mn-ease);
}
.mn-link:hover i {
  transform: translateX(calc(5px * var(--mn-dir)));
}
@media (prefers-reduced-motion: reduce) {
  .mn-btn i,
  .mn-link i { transition: none; }
  .mn-btn:hover i,
  .mn-link:hover i { transform: none; }
}

/*======================
1.4 Section Title
========================*/
.section-title .subtitle {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--mn-ff-body);
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
  margin-bottom: 18px;
}
.section-title .subtitle::before,
.section-title .subtitle::after {
  content: "";
  width: 34px;
  height: 1px;
  background-image: linear-gradient(90deg, transparent, var(--mn-brass));
}
.section-title .subtitle::after {
  display: none;
  background-image: linear-gradient(90deg, var(--mn-brass), transparent);
}
[dir="rtl"] .section-title .subtitle::before {
  background-image: linear-gradient(90deg, var(--mn-brass), transparent);
}
.section-title.text-center .subtitle::after {
  display: block;
}
/* on the night bands the eyebrow brightens */
.section-title.is-light .subtitle,
.donation-area .section-title .subtitle,
.testimonial-area .section-title .subtitle,
.verse-area .section-title .subtitle,
.shift-area .section-title .subtitle,
.sevadar-area .section-title .subtitle,
.fest-next-area .section-title .subtitle,
.nights-area .section-title .subtitle {
  color: var(--mn-primary);
}
.section-title .title {
  margin-bottom: 0;
}
.section-title {
  margin-bottom: 20px;
}
.section-title.mb-30 {
  margin-bottom: 40px;
}
.section-title .text {
  font-size: 17.5px;
  line-height: 1.8;
  max-width: 640px;
  margin-top: 20px;
  margin-bottom: 0;
}
.section-title.text-center .text {
  margin-inline: auto;
}

/*======================
1.5 Helpers & Reveals
========================*/
.fade-top,
.fade-in {
  opacity: 0;
}
.no-js .fade-top,
.no-js .fade-in {
  opacity: 1;
}
/* torana arch mask - the template signature shape */
.mn-arch {
  border-radius: 50% 50% var(--mn-radius) var(--mn-radius) / 34% 34% var(--mn-radius) var(--mn-radius);
  overflow: hidden;
}
.mn-arch-sm {
  border-radius: 50% 50% var(--mn-radius-sm) var(--mn-radius-sm) / 22% 22% var(--mn-radius-sm) var(--mn-radius-sm);
  overflow: hidden;
}
/* scalloped temple-step edge: the section's own colour climbs into the one above */
.mn-scallop {
  position: relative;
}
.mn-scallop::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: -13px;
  height: 13px;
  background-image: radial-gradient(circle at 13px 13px, var(--mn-bg-alt) 12px, transparent 13px);
  background-size: 26px 26px;
  background-repeat: repeat-x;
}
/* kolam dot lattice */
.mn-kolam {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, rgba(var(--mn-brass-rgb), 0.22) 1.4px, transparent 1.4px);
  background-size: 26px 26px;
}
/* canvas scene holders (petals, mandala, lamps) */
.mn-canvas {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
/* WebGL silk texture: sits under a section's content like a woven ground */
.mn-gl {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.mn-gl.is-soft {
  opacity: 0.55;
  mix-blend-mode: soft-light;
}
.mn-gl.is-screen {
  opacity: 0.45;
  mix-blend-mode: screen;
}
.mn-social {
  display: flex;
  gap: 8px;
}
.mn-social a {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  background-color: rgba(var(--mn-heading-rgb), 0.06);
  color: var(--mn-heading);
  transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease;
}
.mn-social a:hover {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
  transform: translateY(-3px);
}
@media (prefers-reduced-motion: reduce) {
  .mn-social a:hover { transform: none; }
}
/* arrows point the way the page reads */
[dir="rtl"] .fa-angle-right,
[dir="rtl"] .fa-angle-left,
[dir="rtl"] .fa-arrow-right,
[dir="rtl"] .fa-arrow-left,
[dir="rtl"] .fa-chevron-right,
[dir="rtl"] .fa-chevron-left,
[dir="rtl"] .fa-caret-right,
[dir="rtl"] .fa-arrow-right-long,
[dir="rtl"] .fa-quote-right {
  scale: -1 1;
}

/* R3 word rise: each word sits in a mask padded on every side (negative margin
   keeps the layout), so overhangs and descenders are never clipped */
.mn-w {
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
  padding: 0.04em 0.2em 0.26em 0.1em;
  margin: -0.04em -0.2em -0.26em -0.1em;
}
.mn-wi {
  display: inline-block;
}
/* R8 draw-on: the brass eyebrow rules draw out as their title enters */
.section-title .subtitle::before,
.section-title .subtitle::after {
  transition: transform 0.9s cubic-bezier(0.65, 0, 0.35, 1) 0.1s;
}
.section-title .subtitle::before {
  transform-origin: right center;
}
.section-title .subtitle::after {
  transform-origin: left center;
}
[dir="rtl"] .section-title .subtitle::before {
  transform-origin: left center;
}
[dir="rtl"] .section-title .subtitle::after {
  transform-origin: right center;
}
.section-title.draw-armed .subtitle::before,
.section-title.draw-armed .subtitle::after {
  transform: scaleX(0);
}
.section-title.draw-armed.is-drawn .subtitle::before,
.section-title.draw-armed.is-drawn .subtitle::after {
  transform: scaleX(1);
}
/* hover accent: a brass hairline draws along the foot of a card */
.mn-line-hover {
  position: relative;
}
.mn-line-hover::after {
  content: "";
  position: absolute;
  inset-inline: 22px;
  bottom: 0;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--mn-brass), var(--mn-primary), var(--mn-accent));
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.5s cubic-bezier(0.65, 0, 0.35, 1);
}
[dir="rtl"] .mn-line-hover::after {
  transform-origin: right center;
}
.mn-line-hover:hover::after {
  transform: scaleX(1);
}
/* a photograph as a texture: the temple's own photo, low-key, under the page ground with a saffron glow rising
   from one corner and a peacock glow from the other. Never on two sections in a row. */
.mn-photo-ground {
  position: relative;
  isolation: isolate;
}
.mn-photo-ground > .mn-ground {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}
.mn-ground img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(0.55) contrast(1.1);
}
.mn-ground::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(70% 90% at 0% 100%, rgba(var(--mn-primary-rgb), 0.3) 0%, rgba(var(--mn-primary-rgb), 0) 70%),
    radial-gradient(60% 80% at 100% 0%, rgba(var(--mn-teal-rgb), 0.24) 0%, rgba(var(--mn-teal-rgb), 0) 70%),
    linear-gradient(180deg, rgba(var(--mn-bg-rgb), 0.9) 0%, rgba(var(--mn-bg-rgb), 0.84) 50%, rgba(var(--mn-bg-rgb), 0.9) 100%);
}
.mn-surface > .mn-ground::after {
  background:
    radial-gradient(70% 90% at 0% 100%, rgba(var(--mn-primary-rgb), 0.3) 0%, rgba(var(--mn-primary-rgb), 0) 70%),
    radial-gradient(60% 80% at 100% 0%, rgba(var(--mn-teal-rgb), 0.24) 0%, rgba(var(--mn-teal-rgb), 0) 70%),
    linear-gradient(180deg, rgba(var(--mn-bg-alt-rgb), 0.9) 0%, rgba(var(--mn-bg-alt-rgb), 0.84) 50%, rgba(var(--mn-bg-alt-rgb), 0.9) 100%);
}
/* is-fade-start: the wash thins toward the start side (the photographs) and thickens behind the words */
.mn-ground.is-fade-start::after {
  background:
    radial-gradient(70% 90% at 0% 100%, rgba(var(--mn-primary-rgb), 0.26) 0%, rgba(var(--mn-primary-rgb), 0) 70%),
    linear-gradient(90deg, rgba(var(--mn-bg-rgb), 0.5) 0%, rgba(var(--mn-bg-rgb), 0.72) 38%, rgba(var(--mn-bg-rgb), 0.94) 62%, rgba(var(--mn-bg-rgb), 0.97) 100%);
}
[dir="rtl"] .mn-ground.is-fade-start::after {
  background:
    radial-gradient(70% 90% at 100% 100%, rgba(var(--mn-primary-rgb), 0.26) 0%, rgba(var(--mn-primary-rgb), 0) 70%),
    linear-gradient(270deg, rgba(var(--mn-bg-rgb), 0.5) 0%, rgba(var(--mn-bg-rgb), 0.72) 38%, rgba(var(--mn-bg-rgb), 0.94) 62%, rgba(var(--mn-bg-rgb), 0.97) 100%);
}
/* the same photograph on a peacock band: the band's own colour washes it */
.mn-ground.is-band::after {
  background:
    radial-gradient(70% 90% at 100% 100%, rgba(var(--mn-primary-rgb), 0.28) 0%, rgba(var(--mn-primary-rgb), 0) 70%),
    linear-gradient(180deg, rgba(var(--mn-band-rgb), 0.92) 0%, rgba(var(--mn-band-rgb), 0.82) 50%, rgba(var(--mn-band-rgb), 0.92) 100%);
}
@media (prefers-reduced-motion: reduce) {
  .section-title .subtitle::before,
  .section-title .subtitle::after,
  .mn-line-hover::after { transition: none; }
}
/* phone numbers and prices read left to right inside a right-to-left page */
[dir="rtl"] a[href^="tel:"] {
  direction: ltr;
  unicode-bidi: isolate;
}
/* times, prices and addresses stay in reading order inside RTL lines */
[dir="rtl"] .f-hours .mn-num,
[dir="rtl"] .f-contact span,
[dir="rtl"] .r-time,
[dir="rtl"] .oi-price,
[dir="rtl"] .seva-meta li,
[dir="rtl"] .e-meta,
[dir="rtl"] .ec-when,
[dir="rtl"] .os-when,
[dir="rtl"] .topbar-meta a,
[dir="rtl"] .mn-kv dd,
[dir="rtl"] .utsav-times dd {
  unicode-bidi: isolate;
  direction: ltr;
}
[dir="rtl"] input[type="email"],
[dir="rtl"] input[type="tel"],
[dir="rtl"] input[inputmode="numeric"] {
  direction: ltr;
  text-align: right;
}

/* the accent word in a title keeps its colour and stands upright (no italic), wherever the title is styled */
html body :is(h1, h2, h3, h4, h5, h6, [class*="title"], [class*="display"]) :is(em, .accent, .fd-accent, .accent-serif) {
  font-style: normal;
}

/* Avatar group: overlapping round portraits of the community, a count and a short line. As wide as its content;
   is-centered sits it in the middle of a centred column, has-space-below keeps a button under it at a distance. */
.mn-avatars {
  display: flex;
  align-items: center;
  gap: 16px;
  width: fit-content;
  max-width: 100%;
  margin-top: 30px;
}
.mn-avatars.is-centered {
  margin-inline: auto;
}
.mn-avatars.has-space-below {
  margin-bottom: 32px;
}
.mn-avatar-stack {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.mn-avatar-stack li {
  position: relative;
  flex: 0 0 50px;
  width: 50px;
  height: 50px;
  overflow: hidden;
  border: 3px solid var(--mn-card);
  border-radius: 50%;
  background: var(--mn-card);
  transition: transform 0.35s ease;
}
.mn-avatar-stack li + li {
  margin-inline-start: -14px;
}
.mn-avatar-stack li:hover {
  z-index: 2;
  transform: translateY(-4px);
}
.mn-avatar-stack img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.mn-avatar-stack .is-more {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mn-primary);
  color: var(--mn-on-primary);
  font-family: var(--mn-ff-body);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}
.mn-avatars .avatars-copy {
  font-family: var(--mn-ff-body);
  font-size: 14px;
  line-height: 1.4;
  text-align: start;
}
.mn-avatars .avatars-copy b {
  display: block;
  font-size: 16px;
  font-weight: 700;
  color: var(--mn-heading);
}
.mn-avatars .avatars-copy span {
  display: block;
  color: var(--mn-text);
}
/* on a photograph or a dark band: white rings and light words */
.mn-avatars.is-on-dark .mn-avatar-stack li {
  border-color: rgba(255, 255, 255, 0.92);
}
.mn-avatars.is-on-dark .avatars-copy b {
  color: #FFFFFF;
}
.mn-avatars.is-on-dark .avatars-copy span {
  color: rgba(255, 255, 255, 0.82);
}

/*======================
2. Preloader
========================*/
.mn-preloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--mn-band);
  overflow: hidden;
}
/* a saffron glow behind the rangoli, as if lamplight fell on the threshold */
.mn-preloader::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 44%, rgba(var(--mn-primary-rgb), 0.2), rgba(var(--mn-primary-rgb), 0) 42%);
  pointer-events: none;
}
.mn-preloader .pre-inner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 26px;
}
.mn-preloader .pre-rangoli {
  display: block;
  width: 240px;
  height: 240px;
}
.mn-preloader .pre-logo {
  display: block;
  width: 210px;
  height: auto;
  opacity: 0;
  visibility: hidden;
}

/*======================
3. Topbar
========================*/
/* the topbar sits on the page's dark opening band: open status, festival note, contacts */
.mn-topbar {
  position: relative;
  color: rgba(var(--mn-on-band-rgb), 0.74);
  font-size: 13.5px;
}
/* the rule under the topbar keeps to the page width, the same sides as the boxed header */
.mn-topbar .topbar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
}
.mn-topbar a:hover {
  color: var(--mn-primary-light);
}
.topbar-status {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.topbar-status .os-state {
  font-weight: 800;
  color: var(--mn-on-band);
}
.os-dot {
  position: relative;
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 50%;
  background-color: #4CC38A;
}
.os-dot::after {
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 1px solid #4CC38A;
  animation: mn-halo 2s ease-out infinite;
}
.is-closed .os-dot {
  background-color: var(--mn-accent);
}
.is-closed .os-dot::after {
  border-color: var(--mn-accent);
}
.mn-topbar .topbar-note i {
  color: var(--mn-primary);
  margin-inline-end: 8px;
}
.mn-topbar .topbar-note a {
  font-weight: 800;
  color: var(--mn-primary-light);
}
.mn-topbar .topbar-meta {
  display: flex;
  align-items: center;
  gap: 22px;
}
.mn-topbar .topbar-meta i {
  color: var(--mn-primary);
  font-size: 12px;
  margin-inline-end: 8px;
}
@keyframes mn-halo {
  0% { transform: scale(0.6); opacity: 1; }
  100% { transform: scale(1.8); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .os-dot::after { animation: none; }
}

/*======================
4. Header
========================*/
.mn-header-wrap {
  position: absolute;
  inset-inline: 0;
  top: 0;
  z-index: 99;
}
.header-area {
  position: relative;
  width: 100%;
}
/* a floating glass bar: the page's colour shows faintly through it */
.header-area .header-main {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  height: 84px;
  background-color: rgba(var(--mn-card-rgb), 0.9);
  border: 1px solid rgba(var(--mn-card-rgb), 0.6);
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(var(--mn-shadow-rgb), 0.14);
  -webkit-backdrop-filter: blur(16px) saturate(1.3);
  backdrop-filter: blur(16px) saturate(1.3);
  padding-inline: 28px 12px;
  margin-top: 18px;
  transition: height 0.4s var(--mn-ease), margin 0.4s var(--mn-ease), box-shadow 0.4s ease;
}
[data-theme="dark"] .header-area .header-main {
  border-color: rgba(var(--mn-on-band-rgb), 0.08);
}
.header-area.sticky-active {
  position: fixed;
  inset-inline: 0;
  top: 0;
  animation: mn-slide-down 0.55s var(--mn-ease) forwards;
}
.header-area.sticky-active .header-main {
  height: 72px;
  margin-top: 10px;
  box-shadow: 0 24px 60px rgba(var(--mn-shadow-rgb), 0.2);
}
@keyframes mn-slide-down {
  from { transform: translateY(-110%); }
  to { transform: translateY(0); }
}
.mn-logo {
  position: relative;
  display: block;
  flex: 0 0 auto;
}
.mn-logo img {
  display: block;
  height: 46px;
  width: auto;
}
.mn-logo .logo-night,
[data-theme="dark"] .mn-logo .logo-day {
  display: none;
}
[data-theme="dark"] .mn-logo .logo-night {
  display: block;
}

/* NAVIGATION: colour carries hover and the current page, no underline */
.header-area .mn-nav > ul {
  display: flex;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
}
.header-area .mn-nav > ul > li {
  position: relative;
}
.header-area .mn-nav > ul > li > a {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--mn-ff-body);
  font-size: 15px;
  font-weight: 700;
  color: var(--mn-heading);
  padding: 30px 15px;
}
.header-area .mn-nav > ul > li > a i {
  font-size: 10px;
  color: var(--mn-muted);
  transition: transform 0.35s var(--mn-ease), color 0.3s ease;
}
.header-area .mn-nav > ul > li:hover > a,
.header-area .mn-nav > ul > li.active > a {
  color: var(--mn-primary-deep);
}
[data-theme="dark"] .header-area .mn-nav > ul > li:hover > a,
[data-theme="dark"] .header-area .mn-nav > ul > li.active > a {
  color: var(--mn-primary);
}
.header-area .mn-nav > ul > li:hover > a i {
  color: var(--mn-primary-deep);
  transform: rotate(180deg);
}
/* first-level dropdowns hang 18px below the header bar (12px once it is sticky); a bridge keeps the hover alive */
.header-area .sub-menu {
  position: absolute;
  top: calc(100% + 17px);
  inset-inline-start: 0;
  z-index: 5;
  min-width: 260px;
  list-style: none;
  margin: 0;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 16px;
  box-shadow: 0 30px 70px rgba(var(--mn-shadow-rgb), 0.18);
  padding: 10px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity 0.3s ease, transform 0.4s var(--mn-ease), visibility 0.3s ease;
}
.header-area .sub-menu::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: -26px;
  height: 26px;
}
.header-area.sticky-active .mn-nav > ul > li > .sub-menu {
  top: calc(100% + 5px);
}
.header-area .mn-nav li:hover > .sub-menu,
.header-area .mn-nav li:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.header-area .sub-menu li {
  position: relative;
}
.header-area .sub-menu li + li {
  margin-top: 4px;
}
.header-area .sub-menu .sub-menu {
  top: -11px;
  inset-inline-start: calc(100% + 10px);
  transform: translateX(calc(10px * var(--mn-dir)));
}
.header-area .sub-menu .sub-menu::before {
  inset-inline-start: -14px;
  inset-inline-end: auto;
  top: 0;
  width: 14px;
  height: 100%;
}
.header-area .mn-nav .sub-menu li:hover > .sub-menu,
.header-area .mn-nav .sub-menu li:focus-within > .sub-menu {
  transform: translateX(0);
}
.header-area .sub-menu li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--mn-heading);
  border-radius: 10px;
  padding: 13px 18px;
  transition: background-color 0.3s ease, color 0.3s ease, padding 0.35s var(--mn-ease);
}
.header-area .sub-menu li a > i {
  font-size: 10px;
  color: var(--mn-muted);
}
.header-area .sub-menu li a:hover,
.header-area .sub-menu li.active > a {
  background-color: rgba(var(--mn-heading-rgb), 0.05);
  color: var(--mn-primary-text);
  padding-inline-start: 22px;
}
.header-area .sub-menu li.active > a::before {
  content: "";
  position: absolute;
  inset-inline-start: 10px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: var(--mn-primary);
}

/* EXTRAS: direction, theme, bag, booking, menu */
.header-extras {
  display: flex;
  align-items: center;
  gap: 8px;
}
.head-icon {
  position: relative;
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  border: none;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: var(--mn-heading);
  background-color: rgba(var(--mn-heading-rgb), 0.055);
  transition: background-color 0.3s ease, color 0.3s ease;
}
.head-icon:hover {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
/* Language picker: a flag and a code; the menu lists the languages that read left to right and right to left.
   The demo copy stays in English, and a right-to-left language turns the layout around. */
.mn-lang {
  position: relative;
  flex-shrink: 0;
}
.mn-lang .lang-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 32px;
  padding: 0 12px;
  border: 0;
  border-radius: 40px;
  background: rgba(var(--mn-heading-rgb), 0.055);
  color: var(--mn-heading);
  font-family: var(--mn-ff-body);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  cursor: pointer;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.mn-lang .lang-btn:hover,
.mn-lang .lang-btn[aria-expanded="true"] {
  background: var(--mn-primary);
  color: var(--mn-on-primary);
}
.mn-lang .lang-btn > i {
  font-size: 9px;
  transition: transform 0.3s ease;
}
.mn-lang .lang-btn[aria-expanded="true"] > i {
  transform: rotate(180deg);
}
.mn-lang .flag {
  flex-shrink: 0;
  width: 22px;
  height: 16px;
  border-radius: 3px;
  object-fit: cover;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
}
.mn-lang.is-icon .lang-btn {
  height: 46px;
  padding: 0 15px;
  background: rgba(var(--mn-heading-rgb), 0.055);
  color: var(--mn-heading);
}
.mn-lang.is-icon .lang-btn:hover,
.mn-lang.is-icon .lang-btn[aria-expanded="true"] {
  background: var(--mn-primary);
  color: var(--mn-on-primary);
}
.mn-lang .lang-menu {
  position: absolute;
  top: calc(100% + 12px);
  inset-inline-end: 0;
  z-index: 1300;
  width: 248px;
  padding: 10px;
  border-radius: 14px;
  background: var(--mn-card);
  box-shadow: var(--mn-shadow-lg);
  font-family: var(--mn-ff-body);
  text-align: start;
  white-space: normal;
}
.mn-lang.is-up .lang-menu {
  top: auto;
  bottom: calc(100% + 12px);
}
.mn-lang.is-start .lang-menu {
  inset-inline-start: 0;
  inset-inline-end: auto;
}
.mn-lang .lang-menu[hidden] {
  display: none;
}
.mn-lang .lang-group {
  margin: 6px 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-muted);
}
.mn-lang .lang-menu ul {
  display: block;
  margin: 0;
  padding: 0;
  list-style: none;
}
.mn-lang .lang-menu ul + .lang-group {
  margin-top: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--mn-line);
}
.mn-lang .lang-item {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 9px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--mn-heading);
  font-family: var(--mn-ff-body);
  font-size: 14.5px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0;
  text-align: start;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.25s ease;
}
.mn-lang .lang-item small {
  margin-inline-start: auto;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--mn-muted);
}
.mn-lang .lang-item i {
  width: 12px;
  font-size: 11px;
  color: var(--mn-primary);
  opacity: 0;
}
.mn-lang .lang-item:hover,
.mn-lang .lang-item[aria-pressed="true"] {
  background: rgba(var(--mn-heading-rgb), 0.055);
}
.mn-lang .lang-item[aria-pressed="true"] {
  font-weight: 600;
}
.mn-lang .lang-item[aria-pressed="true"] i {
  opacity: 1;
}
.mn-lang .lang-note {
  margin: 10px 10px 4px;
  padding-top: 10px;
  border-top: 1px solid var(--mn-line);
  font-size: 12px;
  line-height: 1.5;
  color: var(--mn-muted);
}
.head-icon .count {
  position: absolute;
  top: -2px;
  inset-inline-end: -2px;
  min-width: 20px;
  height: 20px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 800;
  color: var(--mn-on-band);
  background-color: var(--mn-accent);
  box-shadow: 0 0 0 2px var(--mn-card);
  padding: 0 5px;
}
.head-icon .count.is-empty {
  display: none;
}
.header-extras .mn-btn {
  margin-inline-start: 8px;
}
.mn-menu-toggle {
  display: none;
  width: 46px;
  height: 46px;
  border: none;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(135deg, var(--mn-primary-light), var(--mn-primary-deep));
}
@media (prefers-reduced-motion: reduce) {
  .header-area.sticky-active { animation: none; }
}

/* the light / dark switch: a moon in the light theme, a sun in the dark one (Theme Icons) */
html .ti-sun {
  display: none;
}
html[data-theme="dark"] .ti-sun {
  display: inline-block;
}
html[data-theme="dark"] .ti-moon {
  display: none;
}

/*======================
5. Offcanvas Menu
========================*/
.mn-offcanvas {
  position: fixed;
  top: 0;
  inset-inline-end: 0;
  bottom: 0;
  z-index: 999;
  width: 400px;
  max-width: 90vw;
  height: 100dvh;
  overflow-y: auto;
  background-color: var(--mn-band);
  background-image: radial-gradient(circle at 100% 0%, rgba(var(--mn-primary-rgb), 0.18), transparent 46%), radial-gradient(circle at 0% 100%, rgba(var(--mn-teal-rgb), 0.5), transparent 55%);
  color: rgba(var(--mn-on-band-rgb), 0.72);
  padding: 30px 34px;
  transform: translateX(calc(105% * var(--mn-dir)));
  transition: transform 0.55s var(--mn-ease);
}
.mn-offcanvas.open {
  transform: translateX(0);
}
.mn-offcanvas-overlay {
  position: fixed;
  inset: 0;
  z-index: 998;
  background-color: rgba(var(--mn-band-rgb), 0.55);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
}
.mn-offcanvas-overlay.open {
  opacity: 1;
  visibility: visible;
}
.mn-offcanvas .offcanvas-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 30px;
}
.mn-offcanvas .offcanvas-head img {
  height: 40px;
  width: auto;
}
.mn-offcanvas .offcanvas-close {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background-color: rgba(var(--mn-on-band-rgb), 0.1);
  color: var(--mn-on-band);
  transition: background-color 0.3s ease, color 0.3s ease;
}
.mn-offcanvas .offcanvas-close:hover {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.mn-offcanvas .offcanvas-nav a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: var(--mn-ff-heading);
  font-size: 23px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--mn-on-band);
  border-bottom: 1px solid rgba(var(--mn-on-band-rgb), 0.09);
  padding: 12px 0;
  transition: color 0.3s ease, padding 0.35s var(--mn-ease);
}
.mn-offcanvas .offcanvas-nav a:hover,
.mn-offcanvas .offcanvas-nav .active > a {
  color: var(--mn-primary);
  padding-inline-start: 8px;
}
.mn-offcanvas .offcanvas-footer {
  margin-top: 30px;
  font-size: 14.5px;
}
.mn-offcanvas .offcanvas-footer a {
  color: var(--mn-primary-light);
}
.mn-offcanvas .oc-toggles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 24px;
}
.mn-offcanvas .oc-toggles button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mn-on-band);
  background-color: rgba(var(--mn-on-band-rgb), 0.08);
  border: none;
  border-radius: 12px;
  padding: 13px 10px;
  transition: background-color 0.3s ease;
}
.mn-offcanvas .oc-toggles button i {
  color: var(--mn-primary);
}
.mn-offcanvas .oc-toggles button:hover {
  background-color: rgba(var(--mn-on-band-rgb), 0.15);
}
.mn-offcanvas .offcanvas-footer .mn-social {
  margin-top: 16px;
}
.mn-offcanvas .offcanvas-footer .mn-social a {
  background-color: rgba(var(--mn-on-band-rgb), 0.1);
  color: var(--mn-on-band);
}
.mn-offcanvas .offcanvas-footer .mn-social a:hover {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}

/*======================
6. Hero
========================*/
.hero-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
  padding: 250px 0 210px 0;
}
.hero-area .hero-bg {
  position: absolute;
  inset: 0;
}
.hero-area .hero-bg img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  transform: scale(1.05);
  transition: opacity 1.2s ease, transform 9s ease;
}
.hero-area[data-slide="1"] .bg-1,
.hero-area[data-slide="2"] .bg-2,
.hero-area[data-slide="3"] .bg-3 {
  opacity: 1;
  transform: scale(1);
}
/* night falls from the reading side, the photograph glows on the far side */
.hero-area .hero-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, rgba(var(--mn-band-rgb), 0.97) 0%, rgba(var(--mn-band-rgb), 0.86) 44%, rgba(var(--mn-band-rgb), 0.5) 100%),
    linear-gradient(180deg, transparent 60%, rgba(var(--mn-band-rgb), 0.9) 100%);
}
[dir="rtl"] .hero-area .hero-bg::after {
  background: linear-gradient(260deg, rgba(var(--mn-band-rgb), 0.97) 0%, rgba(var(--mn-band-rgb), 0.86) 44%, rgba(var(--mn-band-rgb), 0.5) 100%),
    linear-gradient(180deg, transparent 60%, rgba(var(--mn-band-rgb), 0.9) 100%);
}
.hero-area > .mn-gl {
  z-index: 1;
}
.hero-area .mn-kolam {
  z-index: 1;
  opacity: 0.35;
}
.hero-area .mn-canvas-petals {
  z-index: 2;
}
.hero-area .container {
  position: relative;
  z-index: 3;
}
.hero-area .hero-slider {
  overflow: hidden;
}
.hero-area .hero-slider .swiper-slide {
  pointer-events: none;
}
.hero-area .hero-slider .swiper-slide-active {
  pointer-events: auto;
}
.hero-area .hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mn-on-band);
  background-color: rgba(var(--mn-on-band-rgb), 0.08);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.16);
  border-radius: 999px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  padding: 10px 20px;
  margin-bottom: 28px;
}
.hero-area .hero-badge i {
  color: var(--mn-primary);
}
/* the display title sits on set lines */
.hero-area .hero-title {
  font-family: var(--mn-ff-heading);
  font-size: clamp(54px, 6.2vw, 104px);
  font-weight: 500;
  line-height: 0.98;
  letter-spacing: -0.02em;
  color: var(--mn-on-band);
  margin-bottom: 26px;
}
.hero-area .hero-title .ln {
  display: block;
  white-space: nowrap;
}
.hero-area .hero-title .accent {
  color: var(--mn-primary);
}
.hero-area .hero-text {
  font-size: 18.5px;
  line-height: 1.75;
  color: rgba(var(--mn-on-band-rgb), 0.76);
  max-width: 540px;
  margin-bottom: 38px;
}
.hero-area .hero-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}
.hero-area .btn-outline {
  background-color: rgba(var(--mn-on-band-rgb), 0.08);
  color: var(--mn-on-band);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.hero-area .btn-outline i {
  color: var(--mn-primary);
}
.hero-area .btn-outline:hover {
  background-color: rgba(var(--mn-on-band-rgb), 0.16);
  color: var(--mn-on-band);
}

/* the figure: a photograph in the torana arch, a brass arch traced behind it */
.hero-area .hero-figure {
  position: relative;
  max-width: 460px;
  margin-inline-start: auto;
  padding: 22px;
}
.hero-area .figure-ring {
  position: absolute;
  inset: 0;
  border: 1px solid rgba(var(--mn-primary-rgb), 0.55);
}
.hero-area .figure-ring::after {
  content: "";
  position: absolute;
  inset: 10px;
  border-radius: inherit;
  border: 1px dashed rgba(var(--mn-on-band-rgb), 0.16);
}
.hero-area .figure-arch {
  position: relative;
  height: 480px;
  box-shadow: 0 50px 90px rgba(0, 0, 0, 0.45);
}
.hero-area .figure-arch img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero-area .figure-chip {
  position: absolute;
  inset-inline-start: -40px;
  bottom: 70px;
  display: flex;
  align-items: center;
  gap: 14px;
  background-color: var(--mn-card);
  border-radius: 16px;
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.3);
  padding-block: 14px;
  padding-inline: 14px 22px;
}
.hero-area .figure-chip .ic {
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  background-image: linear-gradient(160deg, var(--mn-primary-light) 0%, var(--mn-primary-deep) 100%);
  color: var(--mn-on-primary);
}
.hero-area .figure-chip .t {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 21px;
  font-weight: 600;
  color: var(--mn-heading);
  line-height: 1.15;
}
.hero-area .figure-chip .s {
  display: block;
  font-size: 13px;
  color: var(--mn-muted);
}
.hero-area .hero-mandala {
  inset-inline-start: auto;
  inset-inline-end: -120px;
  top: 30px;
  width: 560px;
  height: 560px;
  opacity: 0.45;
  z-index: 2;
}
[dir="rtl"] .hero-area .hero-mandala {
  left: -120px;
}

/* controls and the slide count */
.hero-area .hero-foot {
  display: flex;
  align-items: center;
  gap: 28px;
  margin-top: 56px;
}
.hero-area .hero-nav {
  display: flex;
  gap: 10px;
}
.hero-area .h-btn {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: none;
  background-color: rgba(var(--mn-on-band-rgb), 0.08);
  color: var(--mn-on-band);
  font-size: 15px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  transition: background-color 0.3s ease, color 0.3s ease;
}
.hero-area .h-btn:hover {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.hero-area .hero-count {
  display: flex;
  align-items: center;
  gap: 16px;
  font-family: var(--mn-ff-heading);
  font-size: 18px;
  color: rgba(var(--mn-on-band-rgb), 0.5);
}
.hero-area .hero-count .cur {
  font-family: var(--mn-ff-heading);
  font-size: 30px;
  font-weight: 500;
  color: var(--mn-primary);
}
.hero-area .hero-count .tot {
  font-family: var(--mn-ff-heading);
  font-weight: 500;
}
.hero-area .hero-count .bar {
  display: block;
  width: 140px;
  height: 2px;
  border-radius: 2px;
  background-color: rgba(var(--mn-on-band-rgb), 0.18);
  overflow: hidden;
}
.hero-area .hero-count .bar i {
  display: block;
  width: 33%;
  height: 100%;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--mn-primary-light), var(--mn-primary));
  transition: width 0.6s var(--mn-ease);
}

/*======================
7. Panchang
========================*/
/* the temple notice board, lifted over the foot of the hero */
.panchang-area {
  position: relative;
  z-index: 5;
  margin-top: -120px;
}
.panchang-board {
  position: relative;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 26px;
  box-shadow: 0 40px 90px rgba(var(--mn-shadow-rgb), 0.16);
  padding: 38px 42px 30px 42px;
  overflow: hidden;
}
.panchang-board::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--mn-accent), var(--mn-primary), var(--mn-teal));
}
.pb-grid {
  display: grid;
  grid-template-columns: 1fr 1.1fr 2fr;
  align-items: start;
  gap: 40px;
}
.panchang-status {
  position: relative;
}
.panchang-status .st-heading {
  font-family: var(--mn-ff-heading);
  font-size: 25px;
  font-weight: 600;
  color: var(--mn-heading);
  margin-bottom: 18px;
}
.panchang-status .st-state {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.panchang-status .st-pulse {
  position: relative;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background-color: var(--mn-accent);
}
.panchang-status .st-pulse::after {
  content: "";
  position: absolute;
  inset: -5px;
  border-radius: 50%;
  border: 1px solid var(--mn-accent);
  animation: mn-halo 2s ease-out infinite;
}
.panchang-status .st-label {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mn-accent);
}
[data-theme="dark"] .panchang-status .st-label {
  color: #F07A6E;
}
.panchang-status .st-name {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 34px;
  font-weight: 600;
  line-height: 1.12;
  color: var(--mn-heading);
  margin: 8px 0 4px 0;
}
.panchang-status .st-time {
  display: block;
  font-size: 15px;
  color: var(--mn-muted);
}
.panchang-status .st-date {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--mn-heading);
  margin-top: 14px;
}
.panchang-status .st-tithi {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 17px;
  color: var(--mn-brass-text);
  border-top: 1px dashed var(--mn-line-2);
  padding-top: 14px;
  margin-top: 16px;
}
.panchang-status .st-sun {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  font-size: 13.5px;
  color: var(--mn-muted);
  margin-top: 8px;
}
.panchang-status .st-sun i {
  color: var(--mn-primary-deep);
  margin-inline-end: 7px;
}
.panchang-status .st-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
  margin-top: 20px;
}
.panchang-status .st-link i {
  font-size: 11px;
  transition: transform 0.35s var(--mn-ease);
}
.panchang-status .st-link:hover i {
  transform: translateX(calc(4px * var(--mn-dir)));
}

/* the day's almanac, worked out live */
.pb-almanac {
  border-inline: 1px solid var(--mn-line);
  padding-inline: 36px;
}
.pb-almanac .pa-date {
  display: block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
  margin-bottom: 8px;
}
.pb-almanac .pa-kv .kv-row {
  padding: 9px 0;
}
.pb-almanac .pa-kv dt {
  font-size: 16px;
}
.pb-almanac .pa-kv dd {
  font-size: 14px;
  white-space: nowrap;
  color: var(--mn-heading);
}

/* today's rituals */
.ritual-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px 34px;
}
.ritual-row {
  display: flex;
  align-items: center;
  gap: 12px;
  border-radius: 12px;
  padding: 9px 0;
  transition: background-color 0.3s ease, padding 0.3s ease;
}
.ritual-row::after {
  content: "";
  order: 2;
  flex: 1;
  height: 1px;
  min-width: 14px;
  background-image: linear-gradient(90deg, var(--mn-line-2) 40%, transparent 40%);
  background-size: 6px 1px;
  background-repeat: repeat-x;
}
.ritual-row .r-name {
  order: 1;
  display: inline-flex;
  align-items: center;
  gap: 11px;
  font-family: var(--mn-ff-heading);
  font-size: 18px;
  font-weight: 600;
  color: var(--mn-heading);
  white-space: nowrap;
}
.ritual-row .r-name > i {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  background-color: rgba(var(--mn-primary-rgb), 0.14);
  color: var(--mn-primary-deep);
  transition: background-color 0.3s ease, color 0.3s ease;
}
.ritual-row .r-time {
  order: 3;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--mn-muted);
  white-space: nowrap;
}
.ritual-row.is-done {
  opacity: 0.42;
}
.ritual-row.is-now {
  background-color: rgba(var(--mn-primary-rgb), 0.12);
  padding-inline: 12px;
}
.ritual-row.is-now .r-name > i {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.ritual-row.is-now .r-name,
.ritual-row.is-now .r-time {
  color: var(--mn-primary-text);
}
.ritual-row.is-next .r-name::after {
  content: "Next";
  font-family: var(--mn-ff-body);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-teal-text);
  background-color: rgba(var(--mn-teal-rgb), 0.1);
  border-radius: 999px;
  padding: 3px 9px;
  margin-inline-start: 10px;
}

/* the day track: 5 AM to 9 PM, rituals as segments, a needle at now */
.day-track {
  margin-top: 26px;
  border-top: 1px solid var(--mn-line);
  padding-top: 22px;
}
.day-track .dt-rail {
  position: relative;
  height: 8px;
  border-radius: 99px;
  background-color: rgba(var(--mn-heading-rgb), 0.06);
}
.day-track .dt-seg {
  position: absolute;
  top: 0;
  bottom: 0;
  border-radius: 99px;
  background-color: rgba(var(--mn-primary-rgb), 0.4);
}
.day-track .dt-seg.is-done {
  background-color: rgba(var(--mn-heading-rgb), 0.16);
}
.day-track .dt-seg.is-now {
  background-image: linear-gradient(90deg, var(--mn-primary-light), var(--mn-primary-deep));
  box-shadow: 0 0 0 3px rgba(var(--mn-primary-rgb), 0.18);
}
.day-track .dt-now {
  position: absolute;
  top: -7px;
  z-index: 2;
  width: 3px;
  height: 22px;
  border-radius: 3px;
  background-color: var(--mn-accent);
  transform: translateX(calc(-50% * var(--mn-dir)));
}
.day-track .dt-now::before {
  content: "";
  position: absolute;
  top: -6px;
  left: 50%;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background-color: var(--mn-accent);
  transform: translateX(-50%);
}
.day-track .dt-hours {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 700;
  color: var(--mn-muted);
  margin-top: 10px;
}
@media (prefers-reduced-motion: reduce) {
  .panchang-status .st-pulse::after { animation: none; }
}

/*======================
8. Stats
========================*/
/* figures set large in the serif, a brass hairline between them */
.stats-area {
  background-color: var(--mn-bg);
  padding: 80px 0 64px 0;
}
.stats-area .stat-item {
  position: relative;
  text-align: center;
  padding: 0 10px;
}
.stats-area .col-lg-3 + .col-lg-3 .stat-item::before {
  content: "";
  position: absolute;
  inset-inline-start: -12px;
  top: 10px;
  bottom: 10px;
  width: 1px;
  background: linear-gradient(180deg, transparent, var(--mn-line-2), transparent);
}
.stats-area .stat-item > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  font-size: 17px;
  color: var(--mn-primary-deep);
  background-color: rgba(var(--mn-primary-rgb), 0.12);
  margin-bottom: 16px;
}
.stats-area .stat-item .number {
  font-family: var(--mn-ff-heading);
  font-variant-numeric: lining-nums tabular-nums;
  font-size: clamp(48px, 4.4vw, 68px);
  font-weight: 500;
  line-height: 1;
  color: var(--mn-heading);
}
.stats-area .stat-item .suffix {
  font-style: italic;
  color: var(--mn-primary-deep);
}
[data-theme="dark"] .stats-area .stat-item .suffix {
  color: var(--mn-primary);
}
.stats-area .stat-item .label {
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mn-muted);
  margin-top: 12px;
}

/*======================
9. Mantra Marquee
========================*/
/* mantras drifting across a band of peacock silk */
.mantra-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
  padding: 30px 0;
}
.mantra-area .mn-gl {
  opacity: 0.9;
}
.mantra-area .mantra-track {
  position: relative;
  z-index: 2;
  display: flex;
  width: max-content;
  animation: mn-marquee 46s linear infinite;
}
[dir="rtl"] .mantra-area .mantra-track {
  animation-name: mn-marquee-rtl;
}
.mantra-area .mantra-track:hover {
  animation-play-state: paused;
}
.mantra-area .mantra-set {
  display: flex;
  align-items: center;
  gap: 34px;
  padding-inline-end: 34px;
}
.mantra-area .mantra-set span {
  font-family: var(--mn-ff-heading);
  font-style: italic;
  font-size: clamp(24px, 2.2vw, 34px);
  font-weight: 500;
  color: var(--mn-on-band);
  white-space: nowrap;
}
.mantra-area .mantra-set i {
  font-size: 18px;
  color: var(--mn-primary);
}
@keyframes mn-marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@keyframes mn-marquee-rtl {
  from { transform: translateX(0); }
  to { transform: translateX(50%); }
}
@media (prefers-reduced-motion: reduce) {
  .mantra-area .mantra-track { animation: none; }
}

/*======================
10. About
========================*/
.about-area {
  position: relative;
  overflow: hidden;
}
/* two arches, a saffron seal of the founding year */
.about-area .about-media {
  position: relative;
  padding-inline-end: 70px;
  padding-bottom: 60px;
}
.about-area .main-img {
  height: 600px;
  box-shadow: var(--mn-shadow-lg);
}
.about-area .main-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.about-area .float-img {
  position: absolute;
  inset-inline-end: 0;
  bottom: 0;
  width: 230px;
  height: 270px;
  border: 8px solid var(--mn-bg);
  box-shadow: var(--mn-shadow-lg);
}
.about-area .float-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.about-area .year-badge {
  position: absolute;
  inset-inline-start: -22px;
  top: 64px;
  z-index: 2;
  width: 146px;
  height: 146px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-image: linear-gradient(150deg, var(--mn-primary-light), var(--mn-primary-deep));
  color: var(--mn-on-primary);
  box-shadow: 0 0 0 8px var(--mn-bg), 0 24px 50px rgba(var(--mn-primary-rgb), 0.35);
  padding: 18px;
}
.about-area .year-badge::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  border: 1px dashed rgba(16, 41, 42, 0.35);
}
.about-area .year-badge .num {
  font-family: var(--mn-ff-heading);
  font-size: 44px;
  font-weight: 600;
  line-height: 1;
}
.about-area .year-badge .txt {
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  line-height: 1.35;
  margin-top: 6px;
}
.about-area .about-content {
  padding-inline-start: 20px;
}
.about-area .about-kv {
  margin-bottom: 38px;
}
.about-area .about-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 22px 30px;
}
.about-area .head-priest {
  display: flex;
  align-items: center;
  gap: 14px;
}
.about-area .head-priest img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 0 0 3px var(--mn-bg), 0 0 0 4px var(--mn-primary);
}
.about-area .head-priest .n {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 21px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--mn-heading);
}
.about-area .head-priest .r {
  display: block;
  font-size: 13px;
  color: var(--mn-muted);
}

/*======================
11. Sevas
========================*/
.seva-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-bg-alt);
}
.seva-controls {
  display: flex;
  gap: 10px;
}
@media (min-width: 992px) {
  .seva-controls,
  .testimonial-controls {
    justify-content: flex-end;
  }
}
/* slider arrows: tonal circles */
.s-btn,
.t-btn {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: none;
  background-color: rgba(var(--mn-heading-rgb), 0.07);
  color: var(--mn-heading);
  font-size: 15px;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.s-btn:hover,
.t-btn:hover {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.seva-slider {
  overflow: hidden;
  padding-bottom: 8px;
}
.seva-slider .swiper-slide,
.testimonial-slider .swiper-slide {
  height: auto;
}
.seva-slider .swiper-wrapper,
.testimonial-slider .swiper-wrapper {
  align-items: stretch;
}
.seva-area .seva-mandala {
  inset-inline-start: -140px;
  top: auto;
  bottom: -120px;
  width: 460px;
  height: 460px;
  opacity: 0.4;
}
.seva-area .container {
  position: relative;
  z-index: 2;
}
.seva-item .seva-content,
.blog-item .blog-content {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.seva-item .seva-foot,
.blog-item .b-author {
  margin-top: auto;
}

/* SEVA CARD: an arch-topped photograph, the price set in the serif */
.seva-item {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  padding: 12px;
  transition: box-shadow 0.45s var(--mn-ease), transform 0.45s var(--mn-ease), border-color 0.3s ease;
}
.seva-item:hover {
  border-color: transparent;
  box-shadow: 0 34px 70px rgba(var(--mn-shadow-rgb), 0.14);
  transform: translateY(-8px);
}
.seva-item .seva-media {
  position: relative;
}
.seva-item .thumb {
  position: relative;
  display: block;
  height: 290px;
  border-radius: 150px 150px 16px 16px / 110px 110px 16px 16px;
  overflow: hidden;
}
.seva-item .thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 55%, rgba(var(--mn-band-rgb), 0.45) 100%);
}
.seva-item .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--mn-ease);
}
.seva-item:hover .thumb img {
  transform: scale(1.07);
}
.seva-item .tag {
  position: absolute;
  inset-inline-end: 16px;
  bottom: 16px;
  z-index: 2;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-on-band);
  background-color: rgba(var(--mn-band-rgb), 0.45);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.25);
  border-radius: 999px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  padding: 7px 14px;
}
.seva-item .seva-ic {
  position: absolute;
  inset-inline-start: 20px;
  bottom: -26px;
  z-index: 2;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(150deg, var(--mn-primary-light), var(--mn-primary-deep));
  box-shadow: 0 0 0 6px var(--mn-card);
  transition: transform 0.45s var(--mn-ease);
}
.seva-item:hover .seva-ic {
  transform: rotate(-12deg) scale(1.06);
}
.seva-item .seva-content {
  padding: 42px 16px 14px 16px;
}
.seva-item h3 {
  font-size: 21px;
  margin-bottom: 10px;
}
.seva-item h3 a:hover {
  color: var(--mn-primary-text);
}
.seva-item p {
  font-size: 15px;
  line-height: 1.7;
  margin-bottom: 18px;
}
.seva-item .seva-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--mn-muted);
  padding-bottom: 18px;
  margin-bottom: 18px;
  border-bottom: 1px dashed var(--mn-line-2);
}
.seva-item .seva-meta i {
  color: var(--mn-primary-deep);
  margin-inline-end: 7px;
}
.seva-item .seva-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.seva-item .price {
  font-family: var(--mn-ff-heading);
  font-size: 36px;
  font-weight: 600;
  line-height: 1;
  color: var(--mn-heading);
}
.seva-item .price small {
  font-family: var(--mn-ff-body);
  font-size: 13px;
  font-weight: 600;
  color: var(--mn-muted);
  margin-inline-start: 4px;
}
.seva-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 800;
  color: var(--mn-primary-text);
}
.seva-link i {
  font-size: 11px;
  transition: transform 0.35s var(--mn-ease);
}
.seva-link:hover i {
  transform: translateX(calc(4px * var(--mn-dir)));
}
@media (prefers-reduced-motion: reduce) {
  .seva-item:hover { transform: none; }
  .seva-item:hover .thumb img { transform: none; }
}

.slider-progress {
  width: 100%;
  max-width: 260px;
  height: 3px;
  border-radius: 3px;
  background-color: var(--mn-line-2);
  margin: 46px auto 0 auto;
  overflow: hidden;
}
.slider-progress span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--mn-primary-light), var(--mn-primary-deep));
  transition: width 0.4s ease;
}
.slider-progress.light {
  background-color: rgba(var(--mn-on-band-rgb), 0.16);
}

/*======================
12. Donation
========================*/
/* the giving band: peacock night, the widget as a lit ledger */
.donation-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
  background-image: radial-gradient(circle at 85% 10%, rgba(var(--mn-teal-rgb), 0.55), transparent 50%), radial-gradient(circle at 10% 90%, rgba(var(--mn-primary-rgb), 0.12), transparent 45%);
}
.donation-area .mn-canvas-mandala {
  inset-inline-start: auto;
  inset-inline-end: -40px;
  top: -60px;
  width: 540px;
  height: 540px;
  opacity: 0.6;
}
.donation-area .container {
  position: relative;
  z-index: 2;
}
.donation-area .section-title .title {
  color: var(--mn-on-band);
}
.donation-area .section-title .title .accent {
  color: var(--mn-primary);
}
.donation-area .section-title .text {
  color: rgba(var(--mn-on-band-rgb), 0.72);
}
.cause-media {
  position: relative;
  margin-bottom: 46px;
}
.cause-media .cause-img {
  height: 340px;
  box-shadow: 0 40px 80px rgba(0, 0, 0, 0.35);
}
.cause-media .cause-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cause-media .cause-chip {
  position: absolute;
  inset-inline-start: -18px;
  bottom: -24px;
  display: flex;
  align-items: center;
  gap: 14px;
  background-color: var(--mn-card);
  border-radius: 16px;
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.3);
  padding-block: 14px;
  padding-inline: 14px 22px;
}
.cause-media .cause-chip .ic {
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  background-image: linear-gradient(160deg, var(--mn-primary-light), var(--mn-primary-deep));
  color: var(--mn-on-primary);
}
.cause-media .cause-chip .t {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 26px;
  font-weight: 600;
  color: var(--mn-heading);
  line-height: 1.1;
}
.cause-media .cause-chip .s {
  display: block;
  font-size: 13px;
  color: var(--mn-muted);
}
.goal-list {
  display: flex;
  flex-direction: column;
  gap: 26px;
}
@media (min-width: 992px) {
  .donation-area .donation-widget {
    margin-inline-start: 20px;
  }
  .donation-area .cause-media,
  .donation-area .goal-list {
    margin-inline-end: 10px;
  }
}
.goal-bar .g-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-family: var(--mn-ff-heading);
  font-size: 21px;
  font-weight: 600;
  color: var(--mn-on-band);
  margin-bottom: 12px;
}
.goal-bar .goal-pct {
  font-family: var(--mn-ff-heading);
  font-size: 24px;
  color: var(--mn-primary);
}
.goal-bar .bar {
  height: 6px;
  border-radius: 999px;
  background-color: rgba(var(--mn-on-band-rgb), 0.12);
  overflow: hidden;
}
.goal-bar .bar span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: 999px;
  background-image: linear-gradient(90deg, var(--mn-primary-light), var(--mn-primary-deep));
  transition: width 1.3s var(--mn-ease);
}
.goal-bar .g-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 13.5px;
  color: rgba(var(--mn-on-band-rgb), 0.6);
  margin-top: 10px;
}

/* WIDGET */
.donation-widget {
  position: relative;
  background-color: var(--mn-card);
  border-radius: 26px;
  box-shadow: 0 50px 100px rgba(0, 0, 0, 0.35);
  padding: 40px;
  overflow: hidden;
}
.donation-widget::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--mn-accent), var(--mn-primary), var(--mn-teal));
}
.donation-widget .widget-title {
  font-family: var(--mn-ff-heading);
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 26px;
}
.don-field {
  margin-bottom: 22px;
}
.don-field label,
.don-field .f-label {
  display: block;
  font-family: var(--mn-ff-body);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mn-muted);
  margin-bottom: 12px;
}
.don-cause,
.don-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.don-cause button,
.don-preset {
  font-family: var(--mn-ff-body);
  font-size: 14px;
  font-weight: 700;
  color: var(--mn-heading);
  background-color: rgba(var(--mn-heading-rgb), 0.055);
  border: none;
  border-radius: 999px;
  padding: 11px 20px;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.don-cause button:hover,
.don-preset:hover {
  background-color: rgba(var(--mn-heading-rgb), 0.1);
}
.don-cause button.is-active,
.don-preset.is-active {
  background-color: var(--mn-solid);
  color: var(--mn-on-solid);
}
.don-preset.is-active {
  background-image: linear-gradient(135deg, var(--mn-primary-light), var(--mn-primary-deep));
  color: var(--mn-on-primary);
}
.don-amount {
  width: 100%;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line-2);
  border-radius: var(--mn-radius-sm);
  font-family: var(--mn-ff-body);
  font-size: 15.5px;
  color: var(--mn-heading);
  padding: 15px 18px;
  margin-top: 12px;
  outline: none;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.don-amount:focus {
  border-color: var(--mn-primary);
  box-shadow: 0 0 0 4px rgba(var(--mn-primary-rgb), 0.16);
}
.don-check {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14.5px;
  color: var(--mn-heading);
  margin-bottom: 22px;
}
.don-check input {
  width: 18px;
  height: 18px;
  accent-color: var(--mn-primary-deep);
}
/* the result: what the offering provides, on an inverse panel */
.don-result {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  background-color: var(--mn-band);
  background-image: radial-gradient(circle at 100% 0%, rgba(var(--mn-teal-rgb), 0.7), transparent 60%);
  border-radius: 18px;
  padding: 22px 26px;
  overflow: hidden;
}
.don-result .label {
  display: block;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(var(--mn-on-band-rgb), 0.6);
}
.don-result .figure {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 52px;
  font-weight: 600;
  color: var(--mn-on-band);
  line-height: 1.05;
}
.don-result .sub {
  font-size: 14px;
  color: rgba(var(--mn-on-band-rgb), 0.65);
  text-align: end;
}
.don-result .sub strong {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 24px;
  font-weight: 600;
  font-style: italic;
  color: var(--mn-primary);
}
.don-note {
  font-size: 13.5px;
  color: var(--mn-muted);
  margin: 14px 0 24px 0;
}

/*======================
13. Festival & Events
========================*/
.festival-area {
  position: relative;
  background-color: var(--mn-bg);
}
.festival-area .section-title .accent {
  white-space: nowrap;
}
/* COUNTDOWN: serif numerals on glass; .is-silk lays it on a woven card */
.mn-countdown {
  position: relative;
  margin-top: 26px;
}
.mn-countdown .cd-label {
  display: block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
  margin-bottom: 6px;
}
.mn-countdown .cd-name {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 32px;
  font-weight: 600;
  font-style: normal;
  color: var(--mn-primary-deep);
  line-height: 1.15;
  margin-bottom: 20px;
}
.mn-countdown .cd-boxes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 30px;
}
.mn-countdown .cd-box {
  text-align: center;
  background-color: var(--mn-bg-alt);
  border: 1px solid var(--mn-line);
  border-radius: 16px;
  padding: 18px 8px 14px 8px;
}
.mn-countdown .num {
  display: block;
  font-family: var(--mn-ff-heading);
  font-variant-numeric: lining-nums tabular-nums;
  font-size: 46px;
  font-weight: 500;
  color: var(--mn-heading);
  line-height: 1;
}
.mn-countdown .unit {
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mn-muted);
  margin-top: 8px;
}
.mn-countdown.is-silk,
.mn-countdown.is-dark {
  background-color: var(--mn-band);
  border-radius: 26px;
  box-shadow: 0 40px 80px rgba(var(--mn-shadow-rgb), 0.2);
  padding: 34px 32px;
  overflow: hidden;
  isolation: isolate;
}
.mn-countdown.is-silk > .mn-gl {
  z-index: -1;
  opacity: 0.95;
}
.mn-countdown.is-silk .cd-label,
.mn-countdown.is-dark .cd-label {
  color: var(--mn-primary-light);
}
.mn-countdown.is-silk .cd-name,
.mn-countdown.is-dark .cd-name {
  color: var(--mn-primary);
}
.mn-countdown.is-silk .cd-box,
.mn-countdown.is-dark .cd-box {
  background-color: rgba(var(--mn-on-band-rgb), 0.08);
  border-color: rgba(var(--mn-on-band-rgb), 0.14);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.mn-countdown.is-silk .num,
.mn-countdown.is-dark .num {
  color: var(--mn-on-band);
}
.mn-countdown.is-silk .unit,
.mn-countdown.is-dark .unit {
  color: rgba(var(--mn-on-band-rgb), 0.6);
}
.mn-countdown.is-silk .btn-ink {
  background-color: var(--mn-on-band);
  color: #10292A;
}

/* EVENT ROWS: a dated tile, an arch thumbnail, the details */
.event-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.event-item {
  display: flex;
  align-items: center;
  gap: 22px;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 22px;
  padding: 14px;
  transition: box-shadow 0.45s var(--mn-ease), transform 0.45s var(--mn-ease), border-color 0.3s ease;
}
.event-item:hover {
  border-color: transparent;
  box-shadow: 0 30px 60px rgba(var(--mn-shadow-rgb), 0.12);
  transform: translateX(calc(6px * var(--mn-dir)));
}
.event-item .e-date {
  flex: 0 0 78px;
  width: 78px;
  height: 92px;
  border-radius: 40px 40px 14px 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-image: linear-gradient(160deg, var(--mn-primary-light), var(--mn-primary-deep));
  color: var(--mn-on-primary);
}
.event-item .e-date .d {
  font-family: var(--mn-ff-heading);
  font-size: 34px;
  font-weight: 600;
  line-height: 1;
}
.event-item .e-date .m {
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-top: 2px;
}
.event-item .e-thumb {
  flex: 0 0 150px;
  width: 150px;
  height: 104px;
  border-radius: 14px;
  overflow: hidden;
}
.event-item .e-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s var(--mn-ease);
}
.event-item:hover .e-thumb img {
  transform: scale(1.08);
}
.event-item .e-content {
  flex: 1;
  min-width: 0;
}
.event-item h3 {
  font-size: 19px;
  margin-bottom: 6px;
}
.event-item h3 a:hover {
  color: var(--mn-primary-text);
}
.event-item .e-meta {
  font-size: 14px;
  color: var(--mn-muted);
  margin-bottom: 6px;
}
.event-item .e-meta i {
  color: var(--mn-primary-deep);
  margin-inline-end: 7px;
}
.event-item .e-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
}
.event-item .e-link i {
  font-size: 11px;
  transition: transform 0.35s var(--mn-ease);
}
.event-item .e-link:hover i {
  transform: translateX(calc(4px * var(--mn-dir)));
}
@media (prefers-reduced-motion: reduce) {
  .event-item:hover { transform: none; }
}

/*======================
14. Live Darshan
========================*/
/* live darshan band: the sanctum photograph under a silk sheen */
.darshan-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
  text-align: center;
}
.mn-parallax-bg {
  position: absolute;
  inset: 0;
}
.mn-parallax-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.darshan-area .mn-parallax-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, rgba(var(--mn-band-rgb), 0.62) 0%, rgba(var(--mn-band-rgb), 0.92) 75%);
}
.darshan-area > .mn-gl {
  z-index: 1;
}
.darshan-area .container {
  position: relative;
  z-index: 2;
}
.darshan-area .darshan-inner {
  padding: 30px 0;
}
.darshan-area .play-btn {
  position: relative;
  width: 104px;
  height: 104px;
  border-radius: 50%;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(160deg, var(--mn-primary-light) 0%, var(--mn-primary-deep) 100%);
  box-shadow: 0 0 0 12px rgba(var(--mn-primary-rgb), 0.16), 0 0 0 26px rgba(var(--mn-primary-rgb), 0.07);
  margin-bottom: 40px;
  transition: transform 0.45s var(--mn-ease);
}
.darshan-area .play-btn i {
  margin-inline-start: 4px;
}
.darshan-area .play-btn::after {
  content: "";
  position: absolute;
  inset: -12px;
  border-radius: 50%;
  border: 1px solid rgba(var(--mn-primary-rgb), 0.6);
  animation: mn-halo 2.4s ease-out infinite;
}
.darshan-area .play-btn:hover {
  color: var(--mn-on-primary);
  transform: scale(1.06);
}
.darshan-area .live-chip {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mn-on-band);
  background-color: rgba(var(--mn-accent-rgb), 0.24);
  border: 1px solid rgba(var(--mn-accent-rgb), 0.55);
  border-radius: 999px;
  padding: 8px 18px;
  margin-bottom: 22px;
}
.darshan-area .live-chip .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #FF6B5B;
  animation: mn-blink 1.6s ease-in-out infinite;
}
@keyframes mn-blink {
  50% { opacity: 0.25; }
}
.darshan-area .title {
  font-size: clamp(40px, 4.6vw, 72px);
  color: var(--mn-on-band);
  margin-bottom: 20px;
}
.darshan-area .title .accent {
  color: var(--mn-primary);
}
.darshan-area p {
  font-size: 18px;
  color: rgba(var(--mn-on-band-rgb), 0.74);
  max-width: 640px;
  margin: 0 auto 34px auto;
}
.darshan-area .darshan-times {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--mn-on-band);
}
.darshan-area .darshan-times span {
  background-color: rgba(var(--mn-on-band-rgb), 0.08);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.14);
  border-radius: 999px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  padding: 10px 20px;
}
.darshan-area .darshan-times i {
  color: var(--mn-primary);
  margin-inline-end: 9px;
}
/* HOME 02 VIDEO: the heading first, then the festival stream as a framed player that opens in the lightbox,
   and the day's streams in a bar fixed to its foot */
.utsav-video .section-title {
  margin-bottom: 56px;
}
.utsav-video .section-title .text {
  margin-bottom: 0;
}
/* the heading on two set lines: the name of the stream, then where you watch it */
.utsav-video .section-title .title .accent {
  display: block;
}
.broadcast-player.utsav-player {
  height: auto;
  aspect-ratio: 16 / 7;
  border-radius: var(--mn-radius) var(--mn-radius) 0 0;
  box-shadow: 0 40px 80px -36px rgba(0, 0, 0, 0.7);
}
.broadcast-player.utsav-player::after {
  background: linear-gradient(180deg, rgba(var(--mn-band-rgb), 0.05) 0%, rgba(var(--mn-band-rgb), 0.15) 45%, rgba(var(--mn-band-rgb), 0.82) 100%);
}
.broadcast-player.utsav-player .bp-play {
  width: 110px;
  height: 110px;
  margin-block: -55px 0;
  margin-inline: -55px 0;
  font-size: 28px;
  box-shadow: 0 0 0 14px rgba(var(--mn-primary-rgb), 0.2), 0 0 0 30px rgba(var(--mn-primary-rgb), 0.08);
  transition: transform 0.45s var(--mn-ease);
}
.broadcast-player.utsav-player .bp-play i {
  margin-inline-start: 5px;
}
.broadcast-player.utsav-player:hover .bp-play {
  transform: scale(1.06);
}
.broadcast-player.utsav-player .live-chip {
  background-color: rgba(var(--mn-band-rgb), 0.7);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: inset 0 0 0 1px rgba(var(--mn-on-band-rgb), 0.18);
}
.broadcast-player.utsav-player .live-chip i {
  color: var(--mn-primary);
}
.broadcast-player.utsav-player .bp-cap {
  inset-inline-start: 32px;
  inset-inline-end: 32px;
  bottom: 28px;
  font-size: 14.5px;
  color: rgba(var(--mn-on-band-rgb), 0.82);
}
.broadcast-player.utsav-player .bp-cap b {
  font-size: 26px;
  color: var(--mn-on-band);
}
.utsav-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  border-radius: 0 0 var(--mn-radius) var(--mn-radius);
  background-color: rgba(var(--mn-on-band-rgb), 0.06);
  box-shadow: inset 0 0 0 1px rgba(var(--mn-on-band-rgb), 0.12);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.utsav-times {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  /* each time reads from its icon, not from the band's centre line */
  text-align: start;
}
.utsav-times > div {
  position: relative;
  padding: 24px 28px 24px 92px;
}
[dir="rtl"] .utsav-times > div {
  padding: 24px 92px 24px 28px;
}
.utsav-times > div + div {
  border-inline-start: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
}
.utsav-times .ut-ic {
  position: absolute;
  inset-inline-start: 28px;
  top: 50%;
  width: 48px;
  height: 48px;
  margin-top: -24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: var(--mn-primary);
  background-color: rgba(var(--mn-primary-rgb), 0.16);
}
.utsav-times dt {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(var(--mn-on-band-rgb), 0.62);
}
.utsav-times dd {
  margin: 4px 0 0;
  font-family: var(--mn-ff-heading);
  font-size: 28px;
  line-height: 1.1;
  color: var(--mn-on-band);
}
/* the time keeps its reading order in RTL and still lines up under its label */
[dir="rtl"] .utsav-times dd {
  text-align: right;
}
.utsav-bar .ut-all {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 32px;
  border-inline-start: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-primary);
  white-space: nowrap;
  transition: color 0.3s ease, background-color 0.3s ease;
}
/* HOME 01 VIDEO: heading and the day's aartis beside the player; the schedule stacks in one column */
.darshan-split {
  text-align: start;
}
.darshan-split .section-title {
  margin-bottom: 34px;
}
.darshan-split .section-title .text {
  margin-inline: 0;
}
.broadcast-player.utsav-player.is-split {
  aspect-ratio: 4 / 3;
  border-radius: var(--mn-radius);
}
.utsav-bar.is-stacked {
  grid-template-columns: 1fr;
  border-radius: var(--mn-radius);
}
.utsav-bar.is-stacked .utsav-times {
  grid-template-columns: 1fr;
}
.utsav-bar.is-stacked .utsav-times > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding-block: 18px;
}
.utsav-bar.is-stacked .utsav-times > div + div {
  border-inline-start: 0;
  border-top: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
}
.utsav-bar.is-stacked .utsav-times dd {
  margin: 0;
  font-size: 24px;
}
.utsav-bar.is-stacked .ut-all {
  justify-content: center;
  padding: 16px 20px;
  border-inline-start: 0;
  border-top: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
}
/* the camera is offline outside darshan hours: the dot stops and greys */
.live-chip.is-closed .dot {
  background-color: rgba(var(--mn-on-band-rgb), 0.45);
  animation: none;
}
.utsav-bar .ut-all:hover {
  color: var(--mn-on-primary);
  background-color: var(--mn-primary);
  border-end-end-radius: var(--mn-radius);
}
.utsav-bar.is-stacked .ut-all:hover {
  border-radius: 0 0 var(--mn-radius) var(--mn-radius);
}
@media (prefers-reduced-motion: reduce) {
  .darshan-area .play-btn::after,
  .darshan-area .live-chip .dot { animation: none; }
  .darshan-area .play-btn:hover { transform: none; }
}

/*======================
15. Priests
========================*/
.priests-area {
  position: relative;
  background-color: var(--mn-bg-alt);
}
/* portraits in the arch, a brass arch traced around them */
.priest-item {
  position: relative;
  text-align: center;
}
.priest-item .thumb {
  position: relative;
  height: 360px;
  margin-bottom: 22px;
  box-shadow: 0 0 0 1px rgba(var(--mn-brass-rgb), 0.5), 0 0 0 8px var(--mn-bg-alt), 0 0 0 9px rgba(var(--mn-brass-rgb), 0.28);
  transition: box-shadow 0.45s ease, transform 0.5s var(--mn-ease);
}
.priest-item .thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(var(--mn-band-rgb), 0.65) 100%);
  opacity: 0;
  transition: opacity 0.45s ease;
}
.priest-item:hover .thumb {
  transform: translateY(-6px);
  box-shadow: 0 0 0 1px var(--mn-primary), 0 0 0 8px var(--mn-bg-alt), 0 0 0 9px rgba(var(--mn-primary-rgb), 0.5), 0 30px 60px rgba(var(--mn-shadow-rgb), 0.18);
}
.priest-item:hover .thumb::after {
  opacity: 1;
}
.priest-item .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  transition: transform 0.9s var(--mn-ease);
}
.priest-item:hover .thumb img {
  transform: scale(1.05);
}
.priest-item .p-social {
  position: absolute;
  inset-inline: 0;
  bottom: 18px;
  z-index: 2;
  display: flex;
  justify-content: center;
  gap: 8px;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.35s ease, transform 0.45s var(--mn-ease);
}
.priest-item:hover .p-social,
.priest-item:focus-within .p-social {
  opacity: 1;
  transform: translateY(0);
}
.priest-item .p-social a {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  background-color: var(--mn-card);
  color: var(--mn-heading);
  transition: background-color 0.3s ease, color 0.3s ease;
}
.priest-item .p-social a:hover {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.priest-item h3 {
  font-family: var(--mn-ff-heading);
  font-size: 25px;
  font-weight: 600;
  letter-spacing: 0;
  margin-bottom: 4px;
  transition: color 0.3s ease;
}
.priest-item:hover h3 {
  color: var(--mn-primary-text);
}
.priest-item .role {
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-muted);
}
@media (prefers-reduced-motion: reduce) {
  .priest-item:hover .thumb,
  .priest-item:hover .thumb img { transform: none; }
}

/*======================
16. Testimonials
========================*/
/* devotee voices on a night band with silk light moving through it */
.testimonial-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
}
.testimonial-area .mn-parallax-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(var(--mn-band-rgb), 0.96) 0%, rgba(var(--mn-band-rgb), 0.9) 100%);
}
.testimonial-area > .mn-gl {
  z-index: 1;
}
.testimonial-area .mn-canvas-lamps {
  z-index: 2;
  opacity: 0.5;
}
.testimonial-area .container {
  position: relative;
  z-index: 3;
}
.testimonial-area .section-title .title {
  color: var(--mn-on-band);
}
.testimonial-area .section-title .title .accent {
  color: var(--mn-primary);
}
.testimonial-controls {
  display: flex;
  gap: 10px;
}
.testimonial-area .t-btn {
  background-color: rgba(var(--mn-on-band-rgb), 0.08);
  color: var(--mn-on-band);
}
.testimonial-area .t-btn:hover {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.testimonial-slider {
  overflow: hidden;
}
.testimonial-item {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: rgba(var(--mn-on-band-rgb), 0.05);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
  border-radius: 24px;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  padding: 38px 36px 30px 36px;
  transition: border-color 0.35s ease, transform 0.45s var(--mn-ease), background-color 0.35s ease;
}
.testimonial-item:hover {
  background-color: rgba(var(--mn-on-band-rgb), 0.08);
  border-color: rgba(var(--mn-primary-rgb), 0.5);
  transform: translateY(-6px);
}
.testimonial-item .t-quote {
  position: absolute;
  inset-inline-end: 30px;
  top: 26px;
  font-size: 54px;
  color: rgba(var(--mn-primary-rgb), 0.22);
}
.testimonial-item .t-stars {
  color: var(--mn-primary);
  font-size: 13px;
  letter-spacing: 3px;
  margin-bottom: 20px;
}
.testimonial-item .quote {
  font-family: var(--mn-ff-heading);
  font-style: italic;
  font-size: 23px;
  font-weight: 500;
  line-height: 1.5;
  color: var(--mn-on-band);
  margin-bottom: 28px;
}
.testimonial-item .t-user {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: auto;
  border-top: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
  padding-top: 22px;
}
.testimonial-item .t-user img {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 0 0 2px var(--mn-band), 0 0 0 3px var(--mn-primary);
}
.testimonial-item .t-user .name {
  font-family: var(--mn-ff-heading);
  font-size: 21px;
  font-weight: 600;
  color: var(--mn-on-band);
  line-height: 1.2;
}
.testimonial-item .t-user .role {
  font-size: 13px;
  color: rgba(var(--mn-on-band-rgb), 0.58);
}
@media (prefers-reduced-motion: reduce) {
  .testimonial-item:hover { transform: none; }
}

/*======================
17. Blog
========================*/
.blog-area {
  background-color: var(--mn-bg);
}
.blog-item {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  overflow: hidden;
  transition: box-shadow 0.45s var(--mn-ease), transform 0.45s var(--mn-ease), border-color 0.3s ease;
}
.blog-item:hover {
  border-color: transparent;
  box-shadow: 0 34px 70px rgba(var(--mn-shadow-rgb), 0.13);
  transform: translateY(-8px);
}
.blog-item .thumb {
  position: relative;
  display: block;
  height: 270px;
  border-radius: 16px;
  overflow: hidden;
  margin: 12px 12px 0 12px;
}
.blog-item .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--mn-ease);
}
.blog-item:hover .thumb img {
  transform: scale(1.07);
}
.blog-item .thumb .tag {
  position: absolute;
  inset-inline-start: 14px;
  top: 14px;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-on-band);
  background-color: rgba(var(--mn-band-rgb), 0.45);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.22);
  border-radius: 999px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  padding: 6px 14px;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.blog-item:hover .thumb .tag {
  background-color: var(--mn-primary);
  border-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.blog-item .blog-content {
  padding: 26px 26px 24px 26px;
}
.blog-item .meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 18px;
  font-size: 13px;
  font-weight: 600;
  color: var(--mn-muted);
  margin-bottom: 12px;
}
.blog-item .meta i {
  color: var(--mn-primary-deep);
  margin-inline-end: 7px;
  font-size: 11.5px;
}
.blog-item h3 {
  font-family: var(--mn-ff-heading);
  font-size: 27px;
  font-weight: 600;
  line-height: 1.18;
  letter-spacing: 0;
  margin-bottom: 20px;
}
.blog-item h3 a {
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0% 1px;
  background-repeat: no-repeat;
  background-position: 0 96%;
  transition: background-size 0.45s var(--mn-ease), color 0.3s ease;
}
[dir="rtl"] .blog-item h3 a {
  background-position: 100% 96%;
}
.blog-item h3 a:hover {
  background-size: 100% 1px;
  color: var(--mn-primary-text);
}
.blog-item .b-author {
  display: flex;
  align-items: center;
  gap: 12px;
  border-top: 1px dashed var(--mn-line-2);
  padding-top: 18px;
}
.blog-item .b-author img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
  object-position: center top;
}
.blog-item .b-author .a-name {
  display: block;
  font-size: 14px;
  font-weight: 800;
  color: var(--mn-heading);
  line-height: 1.3;
}
.blog-item .b-author .a-role {
  display: block;
  font-size: 12.5px;
  color: var(--mn-muted);
}
.read-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
}
.read-link i {
  font-size: 11px;
  transition: transform 0.35s var(--mn-ease);
}
.read-link:hover i {
  transform: translateX(calc(4px * var(--mn-dir)));
}
@media (prefers-reduced-motion: reduce) {
  .blog-item:hover { transform: none; }
  .blog-item:hover .thumb img { transform: none; }
}

/*======================
18. CTA
========================*/
/* the saffron band: dark ink on gold in both modes, kolam dots and a lamp-glow */
.cta-area {
  position: relative;
  overflow: hidden;
  background-image: radial-gradient(circle at 88% 50%, rgba(255, 236, 196, 0.55), transparent 42%), linear-gradient(120deg, var(--mn-primary-deep) 0%, var(--mn-primary) 55%, var(--mn-primary-light) 100%);
  color: #10292A;
}
.cta-area .mn-kolam {
  opacity: 0.45;
  background-image: radial-gradient(circle, rgba(16, 41, 42, 0.16) 1.4px, transparent 1.4px);
}
.cta-area .container {
  position: relative;
  z-index: 2;
}
.cta-area .cta-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 30px 50px;
  padding: 96px 0;
}
.cta-area .cta-title {
  font-size: clamp(38px, 4vw, 62px);
  color: #10292A;
  margin-bottom: 12px;
}
.cta-area .cta-title .accent {
  color: #FFFFFF;
}
.cta-area p {
  font-size: 17.5px;
  color: rgba(16, 41, 42, 0.78);
  margin-bottom: 0;
}
.cta-area .cta-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 26px;
}
.cta-area .mn-btn.btn-light {
  color: #10292A;
}
.cta-area .cta-phone {
  display: flex;
  align-items: center;
  gap: 14px;
  color: #10292A;
  transition: transform 0.35s var(--mn-ease);
}
.cta-area .cta-phone:hover {
  transform: translateY(-3px);
  color: #10292A;
}
.cta-area .cta-phone i {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(16, 41, 42, 0.12);
  font-size: 16px;
}
.cta-area .cta-phone > span {
  font-family: var(--mn-ff-heading);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
}
.cta-area .cta-phone span span {
  display: block;
  font-family: var(--mn-ff-body);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(16, 41, 42, 0.68);
}
@media (prefers-reduced-motion: reduce) {
  .cta-area .cta-phone:hover { transform: none; }
}

/*======================
19. Subheader
========================*/
/* every inner page opens on a band of peacock silk over its photograph */
.mn-subheader {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
  text-align: center;
  padding: 270px 0 140px 0;
}
.mn-subheader .sub-bg {
  position: absolute;
  inset: 0;
}
.mn-subheader .sub-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.mn-subheader .sub-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(var(--mn-band-rgb), 0.9) 0%, rgba(var(--mn-band-rgb), 0.78) 55%, rgba(var(--mn-band-rgb), 0.94) 100%);
}
.mn-subheader > .mn-gl {
  z-index: 1;
}
.mn-subheader .mn-kolam {
  z-index: 1;
  opacity: 0.35;
}
.mn-subheader .sub-mandala {
  left: auto;
  top: auto;
  right: -120px;
  bottom: -190px;
  width: 520px;
  height: 520px;
  opacity: 0.5;
}
[dir="rtl"] .mn-subheader .sub-mandala {
  right: auto;
  left: -120px;
}
.mn-subheader .container {
  position: relative;
  z-index: 2;
}
/* the temple-step scallop closes the band onto the page below */
.mn-subheader::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  bottom: -1px;
  z-index: 3;
  height: 13px;
  background-image: radial-gradient(circle at 13px 13px, var(--mn-bg) 12px, transparent 13px);
  background-size: 26px 26px;
  background-repeat: repeat-x;
}
.mn-subheader.to-surface::after {
  background-image: radial-gradient(circle at 13px 13px, var(--mn-bg-alt) 12px, transparent 13px);
}
.mn-subheader .sub-inner {
  max-width: 880px;
  margin: 0 auto;
}
.mn-crumbs {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(var(--mn-on-band-rgb), 0.66);
  background-color: rgba(var(--mn-on-band-rgb), 0.07);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
  border-radius: 999px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  padding: 9px 22px;
  margin-bottom: 26px;
}
.mn-crumbs li {
  display: inline-flex;
  align-items: center;
}
.mn-crumbs li + li::before {
  content: "";
  width: 5px;
  height: 5px;
  margin: 0 14px;
  background-color: var(--mn-primary);
  transform: rotate(45deg);
}
.mn-crumbs a:hover {
  color: var(--mn-primary-light);
}
.mn-crumbs li[aria-current] {
  color: var(--mn-primary);
}
.mn-subheader .sub-title {
  font-size: clamp(46px, 5.2vw, 84px);
  font-weight: 500;
  line-height: 1.02;
  color: var(--mn-on-band);
  margin-bottom: 20px;
}
.mn-subheader .sub-text {
  font-size: 18px;
  line-height: 1.75;
  color: rgba(var(--mn-on-band-rgb), 0.74);
  max-width: 640px;
  margin: 0 auto;
}

/*======================
20. Inner Common
========================*/
/* the light ground alternates white / ivory between sections */
.mn-surface {
  background-color: var(--mn-bg-alt);
}
.is-filtered-out {
  display: none !important;
}

/* FILTER TABS: tonal pills with a live count; the active one fills with ink */
.mn-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-bottom: 44px;
}
.mn-filters.is-start {
  justify-content: flex-start;
}
.mn-filters button {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-family: var(--mn-ff-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--mn-heading);
  background-color: rgba(var(--mn-heading-rgb), 0.055);
  border: none;
  border-radius: 999px;
  padding-block: 10px 10px;
  padding-inline: 20px 12px;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.mn-filters button:hover {
  background-color: rgba(var(--mn-heading-rgb), 0.1);
}
.mn-filters button [data-filter-count] {
  min-width: 26px;
  height: 26px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  background-color: var(--mn-card);
  color: var(--mn-primary-text);
  padding: 0 7px;
}
.mn-filters button.is-active {
  background-color: var(--mn-solid);
  color: var(--mn-on-solid);
}
.mn-filters button.is-active [data-filter-count] {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.mn-filters button.is-empty {
  opacity: 0.5;
}
.mn-live-count {
  font-size: 14px;
  color: var(--mn-muted);
}

/* FORM FIELDS: a label above, an icon inside, a Title Case placeholder */
.mn-field {
  margin-bottom: 22px;
}
.mn-field > label,
.mn-field .f-label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mn-muted);
  margin-bottom: 10px;
}
.mn-field .field-box {
  position: relative;
}
.mn-field .field-box > i {
  position: absolute;
  inset-inline-start: 18px;
  top: 19px;
  z-index: 2;
  font-size: 14px;
  color: var(--mn-primary-deep);
  pointer-events: none;
}
.mn-input {
  display: block;
  width: 100%;
  font-family: var(--mn-ff-body);
  font-size: 15px;
  color: var(--mn-heading);
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line-2);
  border-radius: var(--mn-radius-sm);
  padding-block: 15px 15px;
  padding-inline: 46px 18px;
  outline: none;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.mn-input.no-icon {
  padding-inline-start: 18px;
}
textarea.mn-input {
  min-height: 150px;
  resize: vertical;
}
.mn-input::placeholder {
  color: rgba(var(--mn-muted-rgb), 0.75);
}
.mn-input:focus {
  border-color: var(--mn-primary);
  box-shadow: 0 0 0 4px rgba(var(--mn-primary-rgb), 0.16);
}
.mn-surface .mn-input {
  background-color: var(--mn-card);
}
.mn-check {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  font-size: 14.5px;
  color: var(--mn-heading);
  cursor: pointer;
}
.mn-check input {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  margin-top: 4px;
  accent-color: var(--mn-primary-deep);
}
.form-status {
  font-size: 14.5px;
  margin-top: 14px;
  min-height: 22px;
}
.form-status.is-success {
  color: #2E7D4F;
}
.form-status.is-error {
  color: var(--mn-accent-deep);
}

/* CUSTOM SELECT: the native select stays in the form, a listbox is drawn beside it */
.mn-select {
  position: relative;
}
.mn-select select {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}
.mn-select .select-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  font-family: var(--mn-ff-body);
  font-size: 15px;
  font-weight: 500;
  color: var(--mn-heading);
  text-align: start;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line-2);
  border-radius: var(--mn-radius-sm);
  padding-block: 15px 15px;
  padding-inline: 46px 18px;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.mn-select.no-icon .select-button {
  padding-inline-start: 18px;
}
.mn-select .select-button i {
  font-size: 11px;
  color: var(--mn-muted);
  transition: transform 0.3s ease;
}
.mn-select.is-open .select-button {
  border-color: var(--mn-primary);
  box-shadow: 0 0 0 4px rgba(var(--mn-primary-rgb), 0.16);
}
.mn-select.is-open .select-button i {
  transform: rotate(180deg);
}
.mn-select .select-list {
  position: absolute;
  inset-inline-start: 0;
  inset-inline-end: 0;
  top: calc(100% + 8px);
  z-index: 40;
  max-height: 290px;
  overflow-y: auto;
  list-style: none;
  margin: 0;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius-sm);
  box-shadow: var(--mn-shadow-lg);
  padding: 8px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
  scrollbar-width: thin;
}
.mn-select.opens-up .select-list {
  top: auto;
  bottom: calc(100% + 8px);
  transform: translateY(-8px);
}
.mn-select.is-open .select-list {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.mn-select .select-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 14.5px;
  color: var(--mn-heading);
  border-radius: 8px;
  padding: 10px 14px;
  cursor: pointer;
}
.mn-select .select-option.is-focused {
  background-color: var(--mn-bg-alt);
}
.mn-select .select-option.is-selected {
  color: var(--mn-primary-deep);
  font-weight: 700;
}
.mn-select .select-option.is-disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.mn-select .option-meta {
  font-size: 12.5px;
  color: var(--mn-muted);
}

/* LABEL / VALUE ROWS: points told with a dotted leader, never icon bullets */
.mn-kv {
  margin: 0;
}
.mn-kv .kv-row {
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--mn-line);
}
.mn-kv .kv-row:last-child {
  border-bottom: none;
}
.mn-kv dt,
.mn-kv .k {
  font-family: var(--mn-ff-heading);
  font-weight: 400;
  font-size: 17px;
  color: var(--mn-heading);
}
.mn-kv .kv-row::after {
  content: "";
  order: 2;
  flex: 1;
  min-width: 16px;
  height: 1px;
  background-image: linear-gradient(90deg, var(--mn-line-2) 40%, transparent 40%);
  background-size: 6px 1px;
  background-repeat: repeat-x;
}
.mn-kv dd,
.mn-kv .v {
  order: 3;
  margin: 0;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--mn-muted);
  text-align: end;
}
.mn-kv .v.is-gold {
  font-family: var(--mn-ff-heading);
  font-size: 19px;
  font-weight: 400;
  color: var(--mn-primary-deep);
}

/* CARD BOX */
.mn-box {
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  padding: 34px;
}
.mn-box.is-raised {
  box-shadow: var(--mn-shadow);
}
.mn-box-title {
  font-size: 22px;
  margin-bottom: 20px;
}

/* ACCORDION */
.mn-accordion .acc-item {
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.mn-accordion .acc-item + .acc-item {
  margin-top: 14px;
}
.mn-accordion .acc-item.is-open {
  border-color: rgba(var(--mn-primary-rgb), 0.5);
  box-shadow: var(--mn-shadow);
}
.mn-accordion .acc-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: 100%;
  font-family: var(--mn-ff-body);
  font-size: 17px;
  font-weight: 700;
  color: var(--mn-heading);
  text-align: start;
  background: none;
  border: none;
  padding: 22px 26px;
}
.mn-accordion .acc-button .acc-ic {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  background-color: rgba(var(--mn-heading-rgb), 0.055);
  color: var(--mn-heading);
  transition: transform 0.3s ease, background-color 0.3s ease;
}
.mn-accordion .acc-item.is-open .acc-ic {
  transform: rotate(45deg);
  background-color: var(--mn-primary);
}
.mn-accordion .acc-panel {
  display: none;
  padding: 0 26px 24px 26px;
  font-size: 15.5px;
}
.mn-accordion .acc-item.is-open .acc-panel {
  display: block;
}

/* TABS */
.mn-tabs-nav {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  background-color: rgba(var(--mn-heading-rgb), 0.055);
  border-radius: 999px;
  padding: 6px;
  margin-bottom: 30px;
}
.mn-tabs-nav button {
  font-family: var(--mn-ff-body);
  font-size: 14.5px;
  font-weight: 600;
  color: var(--mn-heading);
  background: none;
  border: none;
  border-radius: 999px;
  padding: 10px 22px;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.mn-tabs-nav button.is-active {
  background-color: var(--mn-solid);
  color: var(--mn-on-solid);
}
[data-tab-panel] {
  display: none;
}
[data-tab-panel].is-active {
  display: block;
}

/* STEPPER */
.mn-stepper {
  display: inline-flex;
  align-items: center;
  background-color: rgba(var(--mn-heading-rgb), 0.055);
  border-radius: 999px;
  padding: 4px;
}
.mn-stepper button {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: none;
  background-color: var(--mn-card);
  color: var(--mn-heading);
  font-size: 12px;
  transition: background-color 0.3s ease;
}
.mn-stepper button:hover:not(:disabled) {
  background-color: var(--mn-primary);
}
.mn-stepper button:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.mn-stepper input {
  width: 52px;
  text-align: center;
  font-family: var(--mn-ff-body);
  font-size: 16px;
  font-weight: 700;
  color: var(--mn-heading);
  background: none;
  border: none;
  outline: none;
  -moz-appearance: textfield;
  appearance: textfield;
}
.mn-stepper input::-webkit-outer-spin-button,
.mn-stepper input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* PAGINATION */
.mn-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 56px;
}
.mn-pagination a,
.mn-pagination span {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  color: var(--mn-heading);
  background-color: rgba(var(--mn-heading-rgb), 0.055);
  transition: background-color 0.3s ease, color 0.3s ease;
}
.mn-pagination a:hover {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.mn-pagination .is-current {
  background-color: var(--mn-solid);
  color: var(--mn-on-solid);
}

/* SIDEBAR WIDGETS */
.mn-sidebar {
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.mn-widget {
  background-color: var(--mn-bg-alt);
  border-radius: var(--mn-radius);
  padding: 30px;
}
.mn-widget .w-title {
  position: relative;
  font-family: var(--mn-ff-heading);
  font-size: 21px;
  font-weight: 400;
  padding-bottom: 12px;
  margin-bottom: 22px;
}
.mn-widget .w-title::after {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  bottom: 0;
  width: 30px;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--mn-primary), var(--mn-accent));
}
.mn-search {
  position: relative;
}
.mn-search input {
  display: block;
  width: 100%;
  font-family: var(--mn-ff-body);
  font-size: 15px;
  color: var(--mn-heading);
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line-2);
  border-radius: var(--mn-radius-sm);
  padding-block: 15px 15px;
  padding-inline: 18px 60px;
  outline: none;
}
.mn-search input:focus {
  border-color: var(--mn-primary);
}
.mn-search button {
  position: absolute;
  inset-inline-end: 6px;
  top: 6px;
  bottom: 6px;
  width: 46px;
  border: none;
  border-radius: 8px;
  background-image: linear-gradient(135deg, var(--mn-primary) 0%, var(--mn-primary-deep) 100%);
  color: var(--mn-on-primary);
}
.mn-cat-list li + li {
  border-top: 1px dashed var(--mn-line-2);
}
.mn-cat-list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 15px;
  font-weight: 600;
  color: var(--mn-heading);
  padding: 11px 0;
  transition: color 0.3s ease, padding 0.3s ease;
}
.mn-cat-list a:hover {
  color: var(--mn-primary-deep);
  padding-inline-start: 6px;
}
.mn-cat-list a span {
  font-size: 13px;
  font-weight: 700;
  color: var(--mn-muted);
}
.mn-recent li {
  display: flex;
  align-items: center;
  gap: 14px;
}
.mn-recent li + li {
  margin-top: 16px;
}
.mn-recent img {
  width: 76px;
  height: 76px;
  flex: 0 0 76px;
  border-radius: var(--mn-radius-sm);
  object-fit: cover;
}
.mn-recent h3 {
  font-size: 15px;
  line-height: 1.45;
  margin-bottom: 4px;
}
.mn-recent h3 a:hover {
  color: var(--mn-primary-deep);
}
.mn-recent span {
  font-size: 12.5px;
  color: var(--mn-muted);
}
.mn-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.mn-tags a {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--mn-heading);
  background-color: var(--mn-card);
  border-radius: 999px;
  padding: 7px 16px;
  transition: background-color 0.3s ease;
}
.mn-tags a:hover {
  background-color: var(--mn-primary);
}

/* TOAST */
.mn-toast {
  position: fixed;
  inset-inline-start: 26px;
  bottom: 26px;
  z-index: 1000;
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 360px;
  background-color: var(--mn-solid);
  color: var(--mn-on-solid);
  font-size: 14.5px;
  border-radius: var(--mn-radius-sm);
  box-shadow: var(--mn-shadow-lg);
  padding: 15px 20px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(16px);
  transition: all 0.35s ease;
}
.mn-toast i {
  color: var(--mn-primary);
}
.mn-toast.is-shown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* EMPTY STATE */
.mn-empty {
  text-align: center;
  padding: 50px 20px;
}
.mn-empty > i {
  font-size: 38px;
  color: var(--mn-primary);
  margin-bottom: 16px;
}
.mn-empty p {
  font-size: 16px;
  margin-bottom: 22px;
}

/* checkboxes: a rounded box in the template's colours, filled and ticked when checked */
.mn-check input[type="checkbox"],
.don-check input[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin: 2px 0 0;
  border: 1.5px solid var(--mn-muted);
  border-radius: 6px;
  background: var(--mn-card) no-repeat center / 13px 13px;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.mn-check input[type="checkbox"]:hover,
.don-check input[type="checkbox"]:hover {
  border-color: var(--mn-primary-deep);
  box-shadow: 0 0 0 4px rgba(var(--mn-primary-rgb), 0.16);
}
.mn-check input[type="checkbox"]:checked,
.don-check input[type="checkbox"]:checked {
  border-color: var(--mn-primary-deep);
  background-color: var(--mn-primary-deep);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.4 6.3 4.9 8.7 9.6 3.6' fill='none' stroke='%23FFFFFF' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.mn-check input[type="checkbox"]:focus-visible,
.don-check input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--mn-primary-deep);
  outline-offset: 2px;
}

/*======================
21. Home 02 Utsav
========================*/
/* HERO: the festival photographs full bleed, the copy centred */
.hero-area.is-utsav {
  text-align: center;
  padding: 260px 0 230px 0;
}
.hero-area.is-utsav .hero-bg::after {
  background: linear-gradient(180deg, rgba(var(--mn-band-rgb), 0.86) 0%, rgba(var(--mn-band-rgb), 0.72) 55%, rgba(var(--mn-band-rgb), 0.92) 100%);
}
.hero-area.is-utsav .hero-content {
  max-width: 820px;
  margin: 0 auto;
}
.hero-area.is-utsav .hero-text {
  margin-inline-start: auto;
  margin-inline-end: auto;
}
.hero-area.is-utsav .hero-btns {
  justify-content: center;
}
.hero-area.is-utsav .hero-foot {
  justify-content: center;
}
.hero-area .hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--mn-primary);
  margin-bottom: 20px;
}
.hero-area .hero-eyebrow::before,
.hero-area .hero-eyebrow::after {
  content: "";
  width: 30px;
  height: 1px;
  background-color: var(--mn-brass);
}

/* the two cards that overlap the hero's lower edge */
.utsav-cards-area {
  position: relative;
  z-index: 5;
  margin-top: -120px;
}
.utsav-card {
  position: relative;
  height: 100%;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  box-shadow: var(--mn-shadow-lg);
  overflow: hidden;
  padding: 30px 32px;
}
.utsav-card::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  inset-inline-end: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--mn-accent), var(--mn-primary), var(--mn-brass));
}
.utsav-card .uc-label {
  display: block;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mn-accent);
  margin-bottom: 6px;
}
.utsav-card .uc-title {
  font-family: var(--mn-ff-heading);
  font-size: 26px;
  font-weight: 400;
  margin-bottom: 4px;
}
.utsav-card .uc-meta {
  font-size: 14px;
  color: var(--mn-muted);
  margin-bottom: 18px;
}
.utsav-card .uc-meta i {
  color: var(--mn-primary-deep);
  margin-inline-end: 7px;
}
.utsav-card .mn-countdown {
  margin-top: 0;
}
.utsav-card .mn-countdown .cd-boxes {
  margin-bottom: 20px;
}
.utsav-card .mn-countdown .cd-box {
  min-width: 0;
  flex: 1 1 0;
}
.utsav-card .uc-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
}
.aarti-status .as-now {
  display: flex;
  align-items: center;
  gap: 16px;
  background-color: var(--mn-bg-alt);
  border-radius: var(--mn-radius-sm);
  padding: 18px 20px;
  margin-bottom: 18px;
}
.aarti-status .as-ic {
  position: relative;
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(160deg, var(--mn-primary) 0%, var(--mn-primary-deep) 100%);
}
.aarti-status.is-live .as-ic::after {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 1px solid var(--mn-accent);
  animation: mn-halo 2s ease-out infinite;
}
.aarti-status .as-state {
  display: block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mn-accent);
}
.aarti-status .as-name {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 22px;
  color: var(--mn-heading);
  line-height: 1.25;
}
.aarti-status .as-when {
  display: block;
  font-size: 14px;
  color: var(--mn-muted);
}
.aarti-status .as-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 14.5px;
  color: var(--mn-heading);
  border-bottom: 1px dashed var(--mn-line-2);
  padding: 9px 0;
}
.aarti-status .as-list li:last-child {
  border-bottom: none;
}
.aarti-status .as-list li.is-done {
  opacity: 0.45;
}
.aarti-status .as-list li span:last-child {
  font-weight: 700;
  color: var(--mn-muted);
}

/* FESTIVAL SEVAS: 2 x 2 tiles beside the section title */
.fseva-area {
  background-color: var(--mn-card);
}
.fseva-tile {
  position: relative;
  display: flex;
  gap: 20px;
  height: 100%;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  padding: 30px 28px;
  transition: box-shadow 0.35s ease, transform 0.35s ease, border-color 0.35s ease;
}
.fseva-tile:hover {
  box-shadow: var(--mn-shadow-lg);
  border-color: transparent;
  transform: translateY(-5px);
}
.fseva-tile .ft-ic {
  width: 64px;
  height: 64px;
  flex: 0 0 64px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  background-color: rgba(var(--mn-primary-rgb), 0.16);
  color: var(--mn-primary-deep);
  transition: background-color 0.35s ease, color 0.35s ease;
}
.fseva-tile:hover .ft-ic {
  background-color: var(--mn-solid);
  color: var(--mn-primary);
}
.fseva-tile h3 {
  font-size: 19px;
  margin-bottom: 8px;
}
.fseva-tile h3 a:hover {
  color: var(--mn-primary-deep);
}
.fseva-tile p {
  font-size: 14.5px;
  margin-bottom: 14px;
}
.fseva-tile .ft-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px dashed var(--mn-line-2);
  padding-top: 14px;
}
.fseva-tile .ft-price {
  font-family: var(--mn-ff-heading);
  font-size: 21px;
  color: var(--mn-heading);
}
.fseva-tile .ft-price small {
  font-family: var(--mn-ff-body);
  font-size: 12.5px;
  color: var(--mn-muted);
  margin-inline-start: 4px;
}

/* FESTIVAL SEASONS: arch photograph + ring stats worked out from real counts */
.seasons-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-bg-alt);
}
.seasons-media {
  position: relative;
  padding-block: 0 40px;
  padding-inline: 0 40px;
}
.seasons-media .s-main {
  height: 540px;
}
.seasons-media .s-main img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.seasons-media .s-chip {
  position: absolute;
  inset-inline-end: 0;
  bottom: 0;
  width: 200px;
  text-align: center;
  background-color: var(--mn-band);
  border-radius: var(--mn-radius);
  box-shadow: var(--mn-shadow-lg);
  padding: 22px 16px;
}
.seasons-media .s-chip .num {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 40px;
  color: var(--mn-primary);
  line-height: 1;
}
.seasons-media .s-chip .txt {
  display: block;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(var(--mn-on-band-rgb), 0.75);
  margin-top: 8px;
}
.ring-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 26px;
  margin: 30px 0 34px 0;
}
.ring-stat {
  display: flex;
  align-items: center;
  gap: 18px;
}
.ring-stat .ring {
  --pct: 0;
  position: relative;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  border-radius: 50%;
  background: conic-gradient(var(--mn-primary) calc(var(--pct) * 1%), rgba(var(--mn-heading-rgb), 0.08) 0);
}
.ring-stat .ring::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background-color: var(--mn-bg-alt);
}
.ring-stat .ring span {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mn-ff-heading);
  font-size: 22px;
  color: var(--mn-heading);
}
.ring-stat h3 {
  font-size: 17px;
  margin-bottom: 4px;
}
.ring-stat p {
  font-size: 13.5px;
  color: var(--mn-muted);
  margin: 0;
}

/* ONE SANGHA: the base's dotted world map with a live clock at every city */
.sangha-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-card);
}
.sangha-map {
  position: relative;
  max-width: 1080px;
  margin: 0 auto;
  aspect-ratio: 1450 / 735;
}
.sangha-map .map-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0.9;
}
.city-pin {
  position: absolute;
  z-index: 2;
  transform: translate(-50%, -100%);
  text-align: center;
}
.city-pin .dot {
  position: relative;
  display: block;
  width: 14px;
  height: 14px;
  margin: 6px auto 0 auto;
  border-radius: 50%;
  background-color: var(--mn-accent);
  border: 3px solid var(--mn-card);
  box-shadow: 0 4px 10px rgba(var(--mn-band-rgb), 0.25);
}
.city-pin .dot::after {
  content: "";
  position: absolute;
  inset: -7px;
  border-radius: 50%;
  border: 1px solid rgba(var(--mn-accent-rgb), 0.6);
  animation: mn-halo 2.6s ease-out infinite;
}
.city-pin .tag {
  display: inline-block;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius-sm);
  box-shadow: var(--mn-shadow);
  padding: 7px 12px;
  white-space: nowrap;
}
.city-pin .tag b {
  display: block;
  font-family: var(--mn-ff-heading);
  font-weight: 400;
  font-size: 14.5px;
  color: var(--mn-heading);
  line-height: 1.2;
}
.city-pin .tag span {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--mn-primary-deep);
}
.city-pin.is-home .tag {
  background-color: var(--mn-band);
  border-color: var(--mn-band);
}
.city-pin.is-home .tag b {
  color: var(--mn-on-band);
}
.city-pin.is-home .tag span {
  color: var(--mn-primary);
}
.sangha-note {
  text-align: center;
  font-size: 15px;
  color: var(--mn-muted);
  margin-top: 26px;
}
.sangha-note strong {
  color: var(--mn-heading);
}

/* PUJA RAIL in the S4 band: the ground eases from dusk indigo to festival vermilion */
.shift-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
}
.shift-area .section-title .title {
  color: var(--mn-on-band);
}
.shift-area .section-title .title .accent {
  color: var(--mn-primary);
}
.shift-area .section-title .text {
  color: rgba(var(--mn-on-band-rgb), 0.72);
}
.shift-area .s-btn {
  background-color: rgba(var(--mn-on-band-rgb), 0.08);
  border-color: rgba(var(--mn-on-band-rgb), 0.22);
  color: var(--mn-on-band);
}
.shift-area .container {
  position: relative;
  z-index: 2;
}
.puja-rail {
  overflow: hidden;
  padding-bottom: 6px;
}
.puja-rail .swiper-slide {
  height: auto;
}

/* FAQ beside the Durga cut-out */
.faq-split-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-bg-alt);
}
.faq-cutout {
  position: relative;
  text-align: center;
}
.faq-cutout::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 92%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, rgba(var(--mn-primary-rgb), 0.28) 0%, rgba(var(--mn-primary-rgb), 0) 68%);
}
.faq-cutout img {
  position: relative;
  width: 100%;
  max-width: 440px;
  height: auto;
}

/* GALLERY STRIP */
.gallery-strip {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.4fr;
  gap: 16px;
}
.gallery-strip a {
  position: relative;
  display: block;
  height: 300px;
  border-radius: var(--mn-radius);
  overflow: hidden;
}
.gallery-strip a:nth-child(2),
.gallery-strip a:nth-child(3) {
  border-radius: 50% 50% var(--mn-radius) var(--mn-radius) / 30% 30% var(--mn-radius) var(--mn-radius);
}
.gallery-strip img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.65, 0, 0.35, 1);
}
.gallery-strip a::after {
  content: "\f00e";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: var(--mn-on-band);
  background-color: rgba(var(--mn-band-rgb), 0.45);
  opacity: 0;
  transition: opacity 0.35s ease;
}
.gallery-strip a:hover img {
  transform: scale(1.07);
}
.gallery-strip a:hover::after {
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .gallery-strip a:hover img { transform: none; }
  .fseva-tile:hover { transform: none; }
  .city-pin .dot::after,
  .aarti-status.is-live .as-ic::after { animation: none; }
}

/* city pins on the dotted map (placed against the map's own continents) */
.pin-fremont { inset-inline-start: 7.5%; top: 33%; }
.pin-toronto { inset-inline-start: 19.5%; top: 28%; }
.pin-london { inset-inline-start: 44%; top: 17%; }
.pin-dubai { inset-inline-start: 60.5%; top: 43%; }
.pin-chennai { inset-inline-start: 70%; top: 50%; }
.pin-singapore { inset-inline-start: 78.5%; top: 58%; }
.pin-sydney { inset-inline-start: 94.5%; top: 83%; }
.seasons-area .seasons-mandala {
  inset-inline-start: auto;
  inset-inline-end: -140px;
  top: -90px;
  width: 480px;
  height: 480px;
  opacity: 0.4;
}
.seasons-area .container {
  position: relative;
  z-index: 2;
}

/*======================
22. Home 03 Prarthana
========================*/
/* HERO: indigo, kolam, a deity cut-out on each slide floating over a turning mandala */
.hero-area.is-prarthana {
  padding: 230px 0 200px 0;
}
.hero-area.is-prarthana .hero-bg::after {
  background: linear-gradient(110deg, rgba(var(--mn-band-rgb), 0.97) 0%, rgba(var(--mn-band-rgb), 0.9) 50%, rgba(var(--mn-band-rgb), 0.8) 100%);
}
/* headlines break where designed: one span per line, never a fourth line */
.hero-title .ln {
  display: block;
  white-space: nowrap;
}
.hero-area.is-prarthana .hero-title {
  font-size: clamp(44px, 5vw, 84px);
}
.deity-stage {
  position: relative;
  height: 470px;
}
.deity-stage .stage-mandala {
  inset-inline-start: 50%;
  top: 50%;
  width: 520px;
  height: 520px;
  margin-block: -260px 0;
  margin-inline: -260px 0;
  opacity: 0.85;
  z-index: 0;
}
.deity-stage .stage-glow {
  position: absolute;
  inset-inline-start: 50%;
  top: 52%;
  width: 380px;
  height: 380px;
  margin-block: -190px 0;
  margin-inline: -190px 0;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(var(--mn-primary-rgb), 0.38) 0%, rgba(var(--mn-primary-rgb), 0) 70%);
}
/* three nested layers so tweens never share a transform: outer = cursor depth,
   .co-drift = scroll drift, img = the slow float */
.cutout {
  position: absolute;
  z-index: 2;
}
.cutout .co-drift {
  display: block;
}
.cutout img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 30px 40px rgba(0, 0, 0, 0.35));
}
.deity-stage .cutout.is-main {
  inset-inline-start: 50%;
  top: 50%;
  width: 380px;
  margin-block: -215px 0;
  margin-inline: -190px 0;
}
.deity-stage .cutout.is-kalash {
  inset-inline-start: 2%;
  bottom: 6%;
  width: 130px;
}
.deity-stage .cutout.is-trishul {
  inset-inline-end: 0;
  top: 2%;
  width: 120px;
}
.hero-area.is-prarthana .hero-foot {
  margin-top: 30px;
}
/* every slide stands its deity on the hero's foot: a layer per slide outside the slider (which clips), anchored
   to the section's bottom edge and shown with its slide; the quick tiles that overlap the hero cover the cut */
.hero-ground {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.9s ease, visibility 0.9s;
}
.hero-area[data-slide="1"] .hero-ground[data-for="1"],
.hero-area[data-slide="2"] .hero-ground[data-for="2"],
.hero-area[data-slide="3"] .hero-ground[data-for="3"] {
  opacity: 1;
  visibility: visible;
}
/* the far half of the container in either direction (Mandira's RTL switch keeps the LTR grid) */
.ground-col {
  width: 50%;
  margin-inline-start: auto;
  padding-inline: 12px;
}
.ground-stage {
  position: relative;
  width: min(560px, 100%);
  margin-inline: auto;
}
/* the om lingam and the Devi stand a little larger than they did in the slide */
.hero-ground[data-for="1"] .ground-stage {
  width: min(620px, 100%);
}
.hero-ground[data-for="2"] .ground-stage {
  width: min(580px, 100%);
}
.ground-stage > img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 30px 40px rgba(0, 0, 0, 0.35));
}
.ground-stage .ground-mandala {
  inset-inline-start: 50%;
  top: 34%;
  width: 640px;
  height: 640px;
  margin-block: -320px 0;
  margin-inline: -320px 0;
  opacity: 0.85;
  z-index: 0;
}
.ground-stage .stage-glow {
  top: 36%;
  width: 480px;
  height: 480px;
  margin-block: -240px 0;
  margin-inline: -240px 0;
}
/* where the grounded figure shows, the slide's own copy, mandala and glow step aside */
@media (min-width: 992px) {
  .deity-stage.is-grounded .cutout.is-main,
  .deity-stage.is-grounded .stage-mandala,
  .deity-stage.is-grounded .stage-glow {
    visibility: hidden;
  }
}
@media (max-width: 991px) {
  .hero-ground {
    display: none;
  }
}

/* QUICK TILES overlapping the hero, inside the about section so its ground runs on under them */
.satsang-area.has-quick {
  z-index: 3;
  /* a block formatting context: the tiles' negative margin lifts the tiles, not the section */
  display: flow-root;
}
.satsang-area .quick-area {
  position: relative;
  z-index: 5;
  margin-top: -110px;
  margin-bottom: 120px;
}
.quick-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: var(--mn-radius);
  box-shadow: var(--mn-shadow-lg);
  overflow: hidden;
  padding: 34px 32px 30px 32px;
  transition: transform 0.35s ease;
}
.quick-tile:hover {
  transform: translateY(-6px);
}
.quick-tile.is-white {
  background-color: var(--mn-card);
}
.quick-tile.is-ink {
  background-color: var(--mn-band);
}
.quick-tile.is-gold {
  background-image: linear-gradient(140deg, var(--mn-primary) 0%, var(--mn-primary-deep) 100%);
}
.quick-tile .qt-ic {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  margin-bottom: 20px;
  background-color: rgba(var(--mn-primary-rgb), 0.16);
  color: var(--mn-primary-deep);
}
.quick-tile.is-ink .qt-ic {
  background-color: rgba(var(--mn-on-band-rgb), 0.1);
  color: var(--mn-primary);
}
.quick-tile.is-gold .qt-ic {
  background-color: rgba(var(--mn-heading-rgb), 0.12);
  color: var(--mn-heading);
}
.quick-tile h3 {
  font-size: 20px;
  margin-bottom: 10px;
}
.quick-tile p {
  font-size: 14.5px;
  margin-bottom: 20px;
}
.quick-tile.is-ink h3 {
  color: var(--mn-on-band);
}
.quick-tile.is-ink p {
  color: rgba(var(--mn-on-band-rgb), 0.7);
}
.quick-tile.is-gold p {
  color: rgba(var(--mn-band-rgb), 0.8);
}
.quick-tile .qt-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mn-primary-deep);
}
.quick-tile.is-ink .qt-link {
  color: var(--mn-primary);
}
.quick-tile.is-gold .qt-link {
  color: var(--mn-heading);
}
.quick-tile .qt-link i {
  font-size: 11px;
  transition: transform 0.3s ease;
}
.quick-tile:hover .qt-link i {
  transform: translateX(4px);
}
/* the tile numbers are outlined in a colour that stands off each tile, in light and dark */
.quick-tile .qt-num {
  position: absolute;
  inset-inline-end: 26px;
  top: 18px;
  font-family: var(--mn-ff-heading);
  font-size: 58px;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1.4px rgba(var(--mn-primary-rgb), 0.6);
}
.quick-tile.is-ink .qt-num {
  -webkit-text-stroke-color: rgba(var(--mn-on-band-rgb), 0.45);
}
.quick-tile.is-gold .qt-num {
  -webkit-text-stroke-color: rgba(var(--mn-band-rgb), 0.5);
}

/* ABOUT: arch photograph + a round years badge, facts as label / value rows */
.satsang-area {
  background-color: var(--mn-card);
}
.satsang-media {
  position: relative;
  padding-block: 0 40px;
  padding-inline: 40px 0;
}
.satsang-media .sm-img {
  height: 540px;
}
.satsang-media .sm-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.satsang-media .years-ring {
  position: absolute;
  inset-inline-start: 0;
  bottom: 0;
  width: 168px;
  height: 168px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: var(--mn-band);
  border: 6px solid var(--mn-card);
  box-shadow: var(--mn-shadow-lg);
}
.satsang-media .years-ring::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  border: 1px dashed rgba(var(--mn-primary-rgb), 0.6);
}
.satsang-media .years-ring .num {
  font-family: var(--mn-ff-heading);
  font-size: 46px;
  line-height: 1;
  color: var(--mn-primary);
}
.satsang-media .years-ring .txt {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(var(--mn-on-band-rgb), 0.78);
  margin-top: 6px;
  max-width: 110px;
}
.satsang-area .mn-kv {
  margin: 26px 0 32px 0;
}

/* CAUSE CARDS (also on the causes page) */
.cause-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  overflow: hidden;
  transition: box-shadow 0.35s ease, transform 0.35s ease;
}
.cause-card:hover {
  box-shadow: var(--mn-shadow-lg);
  transform: translateY(-5px);
}
.cause-card .cc-thumb {
  position: relative;
  display: block;
  height: 240px;
  border-radius: var(--mn-radius-sm);
  overflow: hidden;
  margin: 12px 12px 0 12px;
}
.cause-card .cc-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.65, 0, 0.35, 1);
}
.cause-card:hover .cc-thumb img {
  transform: scale(1.06);
}
.cause-card .cc-days {
  position: absolute;
  inset-inline-start: 14px;
  top: 14px;
  font-size: 12px;
  font-weight: 700;
  color: var(--mn-heading);
  background-color: var(--mn-card);
  border-radius: 999px;
  padding: 5px 14px;
}
.cause-card .cc-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 24px 26px 26px 26px;
}
.cause-card h3 {
  font-size: 19px;
  margin-bottom: 8px;
}
.cause-card h3 a:hover {
  color: var(--mn-primary-deep);
}
.cause-card p {
  font-size: 14.5px;
  margin-bottom: 20px;
}
.goal-bar.is-light .g-head {
  font-family: var(--mn-ff-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mn-muted);
}
.goal-bar.is-light .goal-pct {
  font-family: var(--mn-ff-heading);
  font-size: 18px;
  letter-spacing: 0;
  color: var(--mn-primary-deep);
}
.goal-bar.is-light .bar {
  background-color: rgba(var(--mn-heading-rgb), 0.08);
}
.goal-bar.is-light .g-meta {
  color: var(--mn-muted);
}
.goal-bar.is-light .g-meta strong {
  color: var(--mn-heading);
}
.cause-card .cc-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  border-top: 1px solid var(--mn-line);
  padding-top: 18px;
}
.cause-card .goal-bar {
  margin-bottom: 20px;
}

/* BROADCAST SPLIT: the live player beside its recordings */
.broadcast-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-bg-alt);
}
.broadcast-player {
  position: relative;
  display: block;
  height: 420px;
  border-radius: var(--mn-radius);
  overflow: hidden;
}
.broadcast-player img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.broadcast-player::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(var(--mn-heading-rgb), 0.1) 0%, rgba(var(--mn-band-rgb), 0.65) 100%);
}
.broadcast-player .bp-play {
  position: absolute;
  inset-inline-start: 50%;
  top: 50%;
  z-index: 2;
  width: 84px;
  height: 84px;
  margin-block: -42px 0;
  margin-inline: -42px 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(160deg, var(--mn-primary) 0%, var(--mn-primary-deep) 100%);
}
.broadcast-player .bp-play::after {
  content: "";
  position: absolute;
  inset: -10px;
  border-radius: 50%;
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.6);
  animation: mn-halo 2.4s ease-out infinite;
}
.broadcast-player .bp-cap {
  position: absolute;
  inset-inline-start: 26px;
  inset-inline-end: 26px;
  bottom: 22px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--mn-on-band);
  font-size: 14px;
}
.broadcast-player .bp-cap b {
  font-family: var(--mn-ff-heading);
  font-weight: 400;
  font-size: 19px;
}
.broadcast-player:hover img {
  transform: scale(1.04);
}
.recordings {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 28px;
}
.recordings a {
  position: relative;
  display: block;
  height: 110px;
  border-radius: var(--mn-radius-sm);
  overflow: hidden;
}
.recordings img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.recordings a::after {
  content: "\f04b";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  color: var(--mn-on-band);
  background-color: rgba(var(--mn-band-rgb), 0.45);
  transition: background-color 0.3s ease;
}
.recordings a:hover::after {
  background-color: rgba(var(--mn-primary-deep-rgb), 0.75);
}
.recordings span {
  position: absolute;
  inset-inline-start: 8px;
  bottom: 6px;
  z-index: 2;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--mn-on-band);
}

/* PUJA GRID: photographs with the name and price laid over the foot */
.puja-tile {
  position: relative;
  display: block;
  height: 360px;
  border-radius: var(--mn-radius);
  overflow: hidden;
}
.puja-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s cubic-bezier(0.65, 0, 0.35, 1);
}
.puja-tile::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(var(--mn-heading-rgb), 0) 40%, rgba(var(--mn-band-rgb), 0.92) 100%);
}
.puja-tile .pt-body {
  position: absolute;
  inset-inline-start: 24px;
  inset-inline-end: 24px;
  bottom: 22px;
  z-index: 2;
}
.puja-tile .pt-cat {
  display: inline-block;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mn-primary);
  margin-bottom: 6px;
}
.puja-tile h3 {
  font-size: 20px;
  color: var(--mn-on-band);
  margin-bottom: 10px;
}
.puja-tile .pt-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid rgba(var(--mn-on-band-rgb), 0.2);
  padding-top: 12px;
  color: var(--mn-on-band);
}
.puja-tile .pt-foot b {
  font-family: var(--mn-ff-heading);
  font-weight: 400;
  font-size: 20px;
}
.puja-tile .pt-foot span {
  font-size: 13px;
  font-weight: 700;
  color: var(--mn-primary);
}
.puja-tile:hover img {
  transform: scale(1.07);
}

/* SEVADARS in the indigo band, round portraits */
.sevadar-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
}
.sevadar-area .mn-kolam {
  opacity: 0.25;
}
.sevadar-area .container {
  position: relative;
  z-index: 2;
}
.sevadar-area .section-title .title {
  color: var(--mn-on-band);
}
.sevadar-area .section-title .text {
  color: rgba(var(--mn-on-band-rgb), 0.72);
}
.sevadar {
  text-align: center;
}
.sevadar .sd-photo {
  position: relative;
  display: block;
  width: 190px;
  height: 190px;
  margin: 0 auto 20px auto;
  border-radius: 50%;
  padding: 7px;
  background: conic-gradient(var(--mn-primary), var(--mn-accent), var(--mn-brass), var(--mn-primary));
}
.sevadar .sd-photo img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  object-position: center top;
  border: 5px solid var(--mn-band);
  transition: transform 0.5s ease;
}
.sevadar:hover .sd-photo img {
  transform: scale(1.04);
}
.sevadar h3 {
  font-size: 18px;
  color: var(--mn-on-band);
  margin-bottom: 4px;
}
.sevadar .role {
  font-size: 13.5px;
  color: rgba(var(--mn-on-band-rgb), 0.6);
}

/* TESTIMONIALS beside the garlanded lingam */
.voices-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-bg-alt);
}
.voices-cutout {
  position: relative;
  text-align: center;
}
.voices-cutout::before {
  content: "";
  position: absolute;
  inset-inline-start: 50%;
  top: 55%;
  width: 360px;
  height: 360px;
  margin-block: -180px 0;
  margin-inline: -180px 0;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(var(--mn-primary-rgb), 0.3) 0%, rgba(var(--mn-primary-rgb), 0) 70%);
}
.voices-cutout .cutout {
  position: relative;
  display: inline-block;
  width: 280px;
  max-width: 100%;
}
.testimonial-item.is-light {
  background-color: var(--mn-card);
  border-color: var(--mn-line);
}
.testimonial-item.is-light:hover {
  border-color: rgba(var(--mn-primary-rgb), 0.5);
}
.testimonial-item.is-light .t-quote {
  color: rgba(var(--mn-heading-rgb), 0.07);
}
.testimonial-item.is-light .quote {
  color: var(--mn-heading);
}
.testimonial-item.is-light .t-user {
  border-top-color: var(--mn-line);
}
.testimonial-item.is-light .t-user .name {
  color: var(--mn-heading);
}
.testimonial-item.is-light .t-user .role {
  color: var(--mn-muted);
}
.voices-rail {
  overflow: hidden;
}
.voices-rail .swiper-slide {
  height: auto;
}
@media (prefers-reduced-motion: reduce) {
  .quick-tile:hover,
  .cause-card:hover { transform: none; }
  .broadcast-player .bp-play::after { animation: none; }
}

/*======================
23. About Page
========================*/
/* titles set on an indigo band */
.section-title.is-light .title {
  color: var(--mn-on-band);
}
.section-title.is-light .text {
  color: rgba(var(--mn-on-band-rgb), 0.72);
}

/* TABLE: header row in caps, a hairline between rows, today picked out */
.mn-table-wrap {
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  box-shadow: var(--mn-shadow);
  overflow-x: auto;
}
.mn-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
}
.mn-table th {
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-muted);
  text-align: start;
  background-color: var(--mn-bg-alt);
  padding: 16px 22px;
  white-space: nowrap;
}
.mn-table td {
  color: var(--mn-heading);
  border-top: 1px solid var(--mn-line);
  padding: 15px 22px;
  white-space: nowrap;
}
.mn-table tr.is-today td {
  background-color: rgba(var(--mn-primary-rgb), 0.1);
  font-weight: 700;
}
.mn-table tr.is-today td:first-child {
  box-shadow: inset 4px 0 0 var(--mn-primary);
}

/* LIST TOOLBAR: filters left, count and sort right */
.list-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 18px 30px;
  padding-bottom: 26px;
  border-bottom: 1px solid var(--mn-line);
}
.list-toolbar .toolbar-side {
  display: flex;
  align-items: center;
  gap: 18px;
}
.list-toolbar .sort-field {
  width: 240px;
}

/* about story keeps its label/value rows under the lead */
.about-area .about-kv {
  margin-bottom: 34px;
}

/* stats band directly under the story on the about page */
.stats-area.is-page {
  border-top: 1px solid var(--mn-line);
}

/* TIMELINE: a brass spine, years on alternating sides, arch photographs */
.history-area {
  position: relative;
  overflow: hidden;
}
.mn-timeline {
  position: relative;
  max-width: 1040px;
  margin: 0 auto;
}
.mn-timeline::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 10px;
  bottom: 10px;
  width: 2px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, transparent, var(--mn-brass) 8%, var(--mn-brass) 92%, transparent);
  opacity: 0.55;
}
.mn-timeline .tl-row {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  column-gap: 110px;
}
.mn-timeline .tl-row + .tl-row {
  margin-top: 56px;
}
.mn-timeline .tl-media {
  justify-self: end;
  width: 300px;
  height: 230px;
  overflow: hidden;
  box-shadow: var(--mn-shadow);
}
.mn-timeline .tl-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.mn-timeline .tl-row:hover .tl-media img {
  transform: scale(1.05);
}
.mn-timeline .tl-dot {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--mn-bg-alt);
  border: 2px solid var(--mn-brass);
}
.mn-timeline .tl-dot::after {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 50%;
  background-image: linear-gradient(135deg, var(--mn-primary), var(--mn-accent));
}
.mn-timeline .tl-year {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 46px;
  line-height: 1;
  color: var(--mn-primary-deep);
  margin-bottom: 10px;
}
.mn-timeline .tl-body h3 {
  font-size: 21px;
  margin-bottom: 8px;
}
.mn-timeline .tl-body p {
  max-width: 400px;
}
.mn-timeline .tl-row.is-flip .tl-media {
  order: 2;
  justify-self: start;
}
.mn-timeline .tl-row.is-flip .tl-body {
  order: 1;
  text-align: end;
}
.mn-timeline .tl-row.is-flip .tl-body p {
  margin-inline-start: auto;
}

/* GITA VERSES on the indigo band */
.verse-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
}
.verse-area .mn-kolam {
  opacity: 0.22;
}
.verse-area .verse-mandala {
  inset-inline-start: -160px;
  top: auto;
  bottom: -200px;
  width: 520px;
  height: 520px;
  opacity: 0.5;
}
.verse-area .container {
  position: relative;
  z-index: 2;
}
.verse-card {
  position: relative;
  height: 100%;
  background-color: rgba(var(--mn-on-band-rgb), 0.05);
  border: 1px solid rgba(var(--mn-primary-rgb), 0.3);
  border-radius: 200px 200px var(--mn-radius) var(--mn-radius);
  text-align: center;
  padding: 64px 34px 38px 34px;
  transition: background-color 0.35s ease, transform 0.35s ease;
}
.verse-card:hover {
  background-color: rgba(var(--mn-on-band-rgb), 0.09);
  transform: translateY(-6px);
}
.verse-card .v-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  font-size: 24px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(135deg, var(--mn-primary-light), var(--mn-primary));
  margin-bottom: 22px;
}
.verse-card .v-ref {
  display: block;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mn-primary);
  margin-bottom: 16px;
}
.verse-card .v-sanskrit {
  font-family: var(--mn-ff-heading);
  font-size: 21px;
  line-height: 1.45;
  color: var(--mn-on-band);
  margin-bottom: 16px;
}
.verse-card .v-meaning {
  font-size: 15px;
  color: rgba(var(--mn-on-band-rgb), 0.7);
}

/*======================
24. Seva Pages
========================*/
/* BOOKING PATH: four arch icons joined by a dotted brass line */
.seva-path-area {
  position: relative;
  overflow: hidden;
}
.seva-path-area .mn-kolam {
  opacity: 0.4;
}
.seva-path-area .container {
  position: relative;
  z-index: 2;
}
.path-row {
  position: relative;
}
.path-row::before {
  content: "";
  position: absolute;
  inset-inline-start: 12.5%;
  inset-inline-end: 12.5%;
  top: 46px;
  height: 2px;
  background-image: linear-gradient(90deg, var(--mn-brass) 45%, transparent 45%);
  background-size: 10px 2px;
  opacity: 0.6;
}
.path-step {
  position: relative;
  text-align: center;
  padding: 0 12px;
}
.path-step .ps-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 92px;
  font-size: 28px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(160deg, var(--mn-primary-light), var(--mn-primary-deep));
  box-shadow: 0 0 0 8px var(--mn-bg-alt), var(--mn-shadow);
  margin-bottom: 26px;
  transition: transform 0.35s ease;
}
.path-step:hover .ps-ic {
  transform: translateY(-6px);
}
.path-step h3 {
  font-size: 19px;
  margin-bottom: 8px;
}
.path-step p {
  font-size: 15px;
}

/* SEVA DETAIL */
.sd-hero {
  position: relative;
  height: 470px;
  overflow: hidden;
  margin-bottom: 40px;
}
.sd-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sd-badge {
  position: absolute;
  inset-inline-start: 24px;
  bottom: 24px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 14px;
  font-weight: 700;
  color: var(--mn-heading);
  background-color: var(--mn-card);
  border-radius: 999px;
  box-shadow: var(--mn-shadow);
  padding: 10px 18px;
}
.sd-badge i {
  color: var(--mn-primary-deep);
}
.sd-title {
  font-size: 34px;
  margin-bottom: 18px;
}
.sd-sub {
  font-size: 19px;
  margin: 18px 0 8px 0;
}
.seq-list {
  position: relative;
}
.seq-list .seq-row {
  position: relative;
  display: flex;
  gap: 18px;
  padding: 12px 0;
}
.seq-list .seq-row:not(:last-child)::before {
  content: "";
  position: absolute;
  inset-inline-start: 27px;
  top: 66px;
  bottom: -8px;
  width: 2px;
  background-color: var(--mn-line-2);
}
.seq-list .seq-min {
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  line-height: 1;
  color: var(--mn-heading);
  background-color: rgba(var(--mn-primary-rgb), 0.16);
}
.seq-list .seq-min small {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
  margin-top: 3px;
}
.seq-list h4 {
  font-size: 16.5px;
  margin: 6px 0 3px 0;
}
.seq-list p {
  font-size: 14.5px;
}
.sd-gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 40px;
}
.sd-gallery a {
  display: block;
  height: 240px;
  border-radius: var(--mn-radius-sm);
  overflow: hidden;
}
.sd-gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.sd-gallery a:hover img {
  transform: scale(1.06);
}

/* SEVA PRICE BOX: the live total on an ivory card with a brass top rule */
.seva-price-box,
.bk-summary {
  position: sticky;
  top: 120px;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  box-shadow: var(--mn-shadow-lg);
  padding: 32px 30px;
  overflow: hidden;
}
.seva-price-box::before,
.bk-summary::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  inset-inline-end: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--mn-accent), var(--mn-primary), var(--mn-brass));
}
.spb-label {
  display: block;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
  margin-bottom: 6px;
}
.spb-total {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-family: var(--mn-ff-heading);
  font-weight: 400;
  font-size: 50px;
  line-height: 1.1;
  color: var(--mn-heading);
  padding-bottom: 20px;
  margin-bottom: 22px;
  border-bottom: 1px dashed var(--mn-line-2);
}
.spb-total small {
  font-family: var(--mn-ff-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--mn-muted);
}
.spb-choice {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.spb-choice label {
  position: relative;
  cursor: pointer;
}
.spb-choice input {
  position: absolute;
  opacity: 0;
}
.spb-choice span {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 700;
  color: var(--mn-heading);
  text-align: center;
  background-color: rgba(var(--mn-heading-rgb), 0.045);
  border: 1px solid transparent;
  border-radius: var(--mn-radius-sm);
  padding: 14px 10px;
  transition: background-color 0.3s ease, border-color 0.3s ease;
}
.spb-choice span i {
  font-size: 18px;
  color: var(--mn-primary-deep);
}
.spb-choice span b {
  font-size: 12.5px;
  color: var(--mn-primary-text);
}
.spb-choice input:checked + span {
  background-color: rgba(var(--mn-primary-rgb), 0.14);
  border-color: var(--mn-primary);
}
.spb-choice input:focus-visible + span {
  outline: 3px solid rgba(var(--mn-primary-rgb), 0.6);
  outline-offset: 2px;
}
.spb-day {
  display: block;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--mn-primary-text);
  margin-top: 8px;
  min-height: 20px;
}
.spb-names .mn-stepper {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.spb-hint {
  display: block;
  font-size: 13px;
  color: var(--mn-muted);
  margin-top: 8px;
}
.seva-price-box .mn-check {
  font-size: 14.5px;
  margin-bottom: 12px;
}
.seva-price-box .mn-check b,
.bk-addon b {
  margin-inline-start: auto;
  color: var(--mn-primary-text);
  white-space: nowrap;
}
.seva-price-box .spb-lines {
  margin: 14px 0 24px 0;
  padding-top: 8px;
  border-top: 1px dashed var(--mn-line-2);
}
.seva-price-box .spb-lines .kv-row {
  padding: 8px 0;
}
.seva-price-box .spb-lines dt {
  font-size: 15px;
}

/*======================
25. Puja Booking
========================*/
/* STEP NAV: four steps on one line, the brass rule fills as you advance */
.bk-steps {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  counter-reset: none;
}
.bk-steps::before {
  content: "";
  position: absolute;
  inset-inline-start: 12.5%;
  inset-inline-end: 12.5%;
  top: 27px;
  height: 2px;
  background-color: var(--mn-line-2);
}
.bk-steps li {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
}
.bk-steps .bs-ic {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
  color: var(--mn-muted);
  background-color: var(--mn-card);
  border: 2px solid var(--mn-line-2);
  transition: all 0.35s ease;
}
.bk-steps .bs-t {
  font-size: 14px;
  font-weight: 700;
  color: var(--mn-muted);
}
.bk-steps li.is-current .bs-ic,
.bk-steps li.is-done .bs-ic {
  color: var(--mn-on-primary);
  border-color: var(--mn-primary);
  background-image: linear-gradient(135deg, var(--mn-primary-light), var(--mn-primary));
}
.bk-steps li.is-current .bs-t,
.bk-steps li.is-done .bs-t {
  color: var(--mn-heading);
}
.bk-steps li.is-current .bs-ic {
  box-shadow: 0 0 0 6px rgba(var(--mn-primary-rgb), 0.2);
}

/* PANELS */
.bk-form fieldset {
  border: none;
  margin: 0;
  padding: 0;
  min-width: 0;
}
/* the step card: its padding outranks the fieldset reset above */
.bk-form .bk-panel {
  display: none;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  box-shadow: var(--mn-shadow);
  padding: 38px;
}
.bk-form .bk-panel.is-active {
  display: block;
}
/* floated, the legend sits inside the card instead of on its top border */
.bk-legend {
  float: left;
  width: 100%;
  padding: 0;
  font-family: var(--mn-ff-heading);
  font-size: 27px;
  line-height: 1.3;
  color: var(--mn-heading);
  margin-bottom: 26px;
}

.bk-legend + * {
  clear: both;
}

/* ritual choice cards */
.bk-rituals {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
.bk-ritual {
  position: relative;
  cursor: pointer;
}
.bk-ritual input,
.bk-addon input {
  position: absolute;
  opacity: 0;
}
.bk-ritual .br-card {
  display: flex;
  align-items: center;
  gap: 16px;
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius-sm);
  padding-block: 10px 10px;
  padding-inline: 10px 18px;
  transition: border-color 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
}
.bk-ritual img {
  width: 64px;
  height: 64px;
  flex: 0 0 64px;
  border-radius: 8px;
  object-fit: cover;
}
.bk-ritual .br-body {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.bk-ritual .br-name {
  font-size: 15.5px;
  font-weight: 700;
  color: var(--mn-heading);
  line-height: 1.35;
}
.bk-ritual .br-meta {
  font-size: 13px;
  color: var(--mn-muted);
}
.bk-ritual .br-meta i {
  margin-inline-end: 6px;
}
.bk-ritual .br-price {
  margin-inline-start: auto;
  font-size: 17px;
  color: var(--mn-primary-text);
}
.bk-ritual:hover .br-card {
  border-color: var(--mn-line-2);
}
.bk-ritual input:checked + .br-card {
  border-color: var(--mn-primary);
  background-color: rgba(var(--mn-primary-rgb), 0.08);
  box-shadow: 0 0 0 1px var(--mn-primary);
}
.bk-ritual input:focus-visible + .br-card,
.bk-addon input:focus-visible + span,
.bk-slot input:focus-visible + span {
  outline: 3px solid rgba(var(--mn-primary-rgb), 0.6);
  outline-offset: 2px;
}

/* muhurat slots */
.bk-rahu {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 600;
  color: var(--mn-accent-deep);
  background-color: rgba(var(--mn-accent-rgb), 0.08);
  border-radius: var(--mn-radius-sm);
  padding: 14px 16px;
}
.bk-slots {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 28px;
}
.bk-slot {
  position: relative;
  cursor: pointer;
}
.bk-slot input {
  position: absolute;
  opacity: 0;
}
.bk-slot span {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  border-radius: var(--mn-radius-sm);
  background-color: rgba(var(--mn-heading-rgb), 0.045);
  border: 1px solid transparent;
  padding: 14px 8px;
  transition: all 0.3s ease;
}
.bk-slot b {
  font-size: 16px;
  color: var(--mn-heading);
}
.bk-slot small {
  font-size: 12px;
  font-weight: 600;
  color: var(--mn-muted);
}
.bk-slot input:checked + span {
  background-color: var(--mn-band);
}
.bk-slot input:checked + span b {
  color: var(--mn-on-band);
}
.bk-slot input:checked + span small {
  color: var(--mn-primary);
}
.bk-slot.is-off {
  cursor: not-allowed;
}
.bk-slot.is-off span {
  background-color: transparent;
  border: 1px dashed var(--mn-line-2);
}
.bk-slot.is-off b {
  color: var(--mn-muted);
  text-decoration: line-through;
}
.bk-slot.is-rahu small {
  color: var(--mn-accent-deep);
}

/* add-ons */
.bk-addons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.bk-addon {
  position: relative;
  cursor: pointer;
}
.bk-addon span {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--mn-heading);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius-sm);
  padding: 14px 16px;
  transition: all 0.3s ease;
}
.bk-addon span i {
  color: var(--mn-primary-deep);
}
.bk-addon input:checked + span {
  border-color: var(--mn-primary);
  background-color: rgba(var(--mn-primary-rgb), 0.08);
}
.bk-error {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--mn-accent-deep);
  margin: 16px 0 0 0;
  min-height: 1px;
}
.bk-error:empty {
  margin: 0;
}
.bk-form .mn-input.is-invalid {
  border-color: var(--mn-accent);
  box-shadow: 0 0 0 4px rgba(var(--mn-accent-rgb), 0.12);
}
.bk-actions {
  display: flex;
  gap: 14px;
  margin-top: 26px;
}

/* summary */
.bk-summary .mn-kv .kv-row {
  padding: 11px 0;
}
.bk-summary .mn-kv dt {
  font-size: 15.5px;
}
.bk-summary .mn-kv dd {
  max-width: 60%;
}
.bks-total {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-size: 15px;
  font-weight: 700;
  color: var(--mn-heading);
  border-top: 1px dashed var(--mn-line-2);
  padding-top: 18px;
  margin-top: 10px;
}
.bks-total b {
  font-family: var(--mn-ff-heading);
  font-weight: 400;
  font-size: 38px;
  color: var(--mn-heading);
}

/* confirmation */
.bk-done {
  text-align: center;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  box-shadow: var(--mn-shadow);
  padding: 56px 38px;
}
.bk-done .bd-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 84px;
  height: 96px;
  font-size: 34px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(160deg, var(--mn-primary-light), var(--mn-primary-deep));
  margin-bottom: 24px;
}
.bk-done .bd-title {
  font-size: 36px;
  margin-bottom: 12px;
}
.bk-done .bd-ref {
  display: inline-block;
  font-size: 26px;
  letter-spacing: 0.08em;
  color: var(--mn-heading);
  background-color: var(--mn-bg-alt);
  border: 1px dashed var(--mn-brass);
  border-radius: var(--mn-radius-sm);
  padding: 12px 28px;
  margin: 20px 0 14px 0;
}
.bk-done .bd-when {
  font-weight: 700;
  color: var(--mn-primary-text);
}

/*======================
26. Panchang Page
========================*/
/* the board sits in the page flow, not over a hero */
.panchang-area.is-page {
  margin-top: 0;
}
.panchang-status .st-date {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--mn-heading);
  margin-top: 14px;
}

/* SUN TABLE */
.sun-table td:first-child {
  font-weight: 700;
}
.sun-table .rahu {
  color: var(--mn-accent-deep);
  font-weight: 600;
}

/* TITHI CALENDAR */
.tithi-month-area {
  position: relative;
}
.tithi-cal {
  max-width: 1080px;
  margin: 0 auto;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  box-shadow: var(--mn-shadow);
  padding: 30px;
}
.tithi-cal .tc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 22px;
}
.tithi-cal .tc-month {
  font-family: var(--mn-ff-heading);
  font-weight: 400;
  font-size: 28px;
  margin: 0;
}
.tithi-cal .tc-nav {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: none;
  background-color: rgba(var(--mn-heading-rgb), 0.055);
  color: var(--mn-heading);
  transition: background-color 0.3s ease;
}
.tithi-cal .tc-nav:hover {
  background-color: var(--mn-primary);
}
.tithi-cal .tc-week,
.tithi-cal .tc-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
}
.tithi-cal .tc-week span {
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-muted);
  text-align: center;
  padding-bottom: 8px;
}
.tithi-cal .tc-day {
  position: relative;
  min-height: 104px;
  border-radius: var(--mn-radius-sm);
  background-color: var(--mn-bg-alt);
  padding: 10px 11px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.tithi-cal .tc-day.is-blank {
  background-color: transparent;
}
.tithi-cal .tc-day .d {
  font-size: 17px;
  font-weight: 700;
  color: var(--mn-heading);
}
.tithi-cal .tc-day .t {
  font-size: 12.5px;
  line-height: 1.35;
  color: var(--mn-text);
}
.tithi-cal .tc-day .p {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mn-muted);
}
.tithi-cal .tc-day .f {
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--mn-accent-deep);
  margin-top: auto;
}
.tithi-cal .tc-day.is-today {
  background-color: var(--mn-band);
}
.tithi-cal .tc-day.is-today .d {
  color: var(--mn-primary);
}
.tithi-cal .tc-day.is-today .t,
.tithi-cal .tc-day.is-today .p {
  color: rgba(var(--mn-on-band-rgb), 0.78);
}
.tithi-cal .tc-day.is-today .f {
  color: var(--mn-primary-light);
}
/* the kumkum red lifts on the peacock night so rahu kalam and the festival names stay readable (6.6:1) */
[data-theme="dark"] .sun-table .rahu,
[data-theme="dark"] .tithi-cal .tc-day:not(.is-today) .f {
  color: #F08A7E;
}
.tithi-cal .tc-day::after {
  content: "";
  position: absolute;
  inset-inline-end: 10px;
  top: 12px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: none;
}
.tithi-cal .tc-day.is-purnima::after {
  display: block;
  background-color: var(--mn-card);
  box-shadow: 0 0 0 2px var(--mn-primary);
}
.tithi-cal .tc-day.is-amavasya::after {
  display: block;
  background-color: var(--mn-solid);
}
.tithi-cal .tc-day.is-today.is-amavasya::after {
  background-color: var(--mn-card);
}
.tithi-cal .tc-day.is-ekadashi::after {
  display: block;
  background-color: var(--mn-primary);
}
.tithi-cal .tc-day.is-fest {
  box-shadow: inset 0 0 0 1px rgba(var(--mn-accent-rgb), 0.45);
}
.tithi-cal .tc-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 26px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--mn-muted);
  margin-top: 22px;
}
.tithi-cal .tc-legend li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.tithi-cal .lg-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.tithi-cal .lg-dot.is-purnima {
  background-color: var(--mn-card);
  box-shadow: 0 0 0 2px var(--mn-primary);
}
.tithi-cal .lg-dot.is-amavasya {
  background-color: var(--mn-solid);
}
.tithi-cal .lg-dot.is-ekadashi {
  background-color: var(--mn-primary);
}
.tithi-cal .lg-dot.is-fest {
  width: 14px;
  height: 10px;
  border-radius: 3px;
  box-shadow: inset 0 0 0 1px var(--mn-accent);
}

/*======================
27. Temple Pages
========================*/
/* EVENTS: tabs by date, horizontal cards with a dated arch tile */
.ev-tabs b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  border-radius: 999px;
  font-size: 11.5px;
  background-color: rgba(var(--mn-heading-rgb), 0.08);
  margin-inline-start: 8px;
  padding: 0 6px;
}
.ev-tabs button.is-active b {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.event-cards {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.event-card {
  position: relative;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 30px;
  align-items: center;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  padding: 14px;
  transition: box-shadow 0.45s var(--mn-ease), transform 0.45s var(--mn-ease), border-color 0.3s ease;
}
.event-card:hover {
  border-color: transparent;
  box-shadow: 0 30px 64px rgba(var(--mn-shadow-rgb), 0.12);
  transform: translateY(-5px);
}
.event-card.is-past {
  opacity: 0.72;
}
.event-card .ec-thumb {
  display: block;
  height: 220px;
  border-radius: 16px;
  overflow: hidden;
}
.event-card .ec-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--mn-ease);
}
.event-card:hover .ec-thumb img {
  transform: scale(1.07);
}
.event-card .ec-date {
  position: absolute;
  inset-inline-start: 30px;
  top: 30px;
  width: 70px;
  height: 82px;
  border-radius: 36px 36px 12px 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-image: linear-gradient(160deg, var(--mn-primary-light), var(--mn-primary-deep));
  color: var(--mn-on-primary);
  box-shadow: 0 16px 30px rgba(var(--mn-primary-rgb), 0.35);
}
.event-card .ec-date .e-day {
  font-family: var(--mn-ff-heading);
  font-size: 30px;
  font-weight: 600;
  line-height: 1;
}
.event-card .ec-date .e-mon {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.event-card .ec-body {
  padding-inline-end: 16px;
}
.event-card .ec-when {
  display: block;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
  margin-bottom: 8px;
}
.event-card h3 {
  font-family: var(--mn-ff-heading);
  font-size: 30px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.12;
  margin-bottom: 10px;
}
.event-card h3 a:hover {
  color: var(--mn-primary-text);
}
.event-card p {
  font-size: 15px;
  margin-bottom: 16px;
}
.event-card .ec-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 22px;
  border-top: 1px dashed var(--mn-line-2);
  padding-top: 14px;
}
.event-card .ec-venue {
  font-size: 14px;
  font-weight: 600;
  color: var(--mn-muted);
}
.event-card .ec-venue i {
  color: var(--mn-primary-deep);
  margin-inline-end: 7px;
}
.event-card .ec-rel {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mn-teal-text);
  background-color: rgba(var(--mn-teal-rgb), 0.1);
  border-radius: 999px;
  padding: 4px 12px;
}
.event-card .ec-rel:empty {
  display: none;
}
.event-card .seva-link {
  margin-inline-start: auto;
}
/* in a three-column grid the card stands up */
.event-related-area .event-card {
  grid-template-columns: 1fr;
  gap: 18px;
  height: 100%;
}
.event-related-area .event-card .ec-body {
  padding: 0 12px 10px 12px;
}
.event-related-area .event-card h3 {
  font-size: 26px;
}
.next-widget {
  text-align: center;
  background-color: var(--mn-band);
  background-image: radial-gradient(circle at 100% 0%, rgba(var(--mn-teal-rgb), 0.75), transparent 60%);
}
.next-widget .w-title {
  color: var(--mn-on-band);
}
.next-widget .w-title::after {
  inset-inline: 0;
  margin: 0 auto;
}
.next-widget .nw-days {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 84px;
  font-weight: 500;
  line-height: 1;
  color: var(--mn-primary);
}
.next-widget .nw-unit {
  display: block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(var(--mn-on-band-rgb), 0.6);
  margin-bottom: 18px;
}
.next-widget .nw-name {
  font-family: var(--mn-ff-heading);
  font-size: 25px;
  font-weight: 600;
  color: var(--mn-on-band);
  margin-bottom: 6px;
}
.next-widget .nw-when {
  font-size: 14px;
  color: rgba(var(--mn-on-band-rgb), 0.68);
  margin-bottom: 20px;
}
.week-kv .kv-row.is-today dt,
.week-kv .kv-row.is-today dd {
  color: var(--mn-primary-text);
}
.week-kv .kv-row.is-today dt::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: var(--mn-primary);
  margin-inline-end: 9px;
  vertical-align: 3px;
}

/* EVENT DETAIL */
.ed-facts {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 20px;
  margin-bottom: 44px;
  overflow: hidden;
}
.ed-facts > div {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 22px;
}
.ed-facts > div + div {
  border-inline-start: 1px solid var(--mn-line);
}
.ed-facts i {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--mn-primary-deep);
  background-color: rgba(var(--mn-primary-rgb), 0.12);
}
.ed-facts span {
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-muted);
  line-height: 1.4;
}
.ed-facts b {
  display: block;
  font-size: 14.5px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--mn-heading);
}
.prog-list .prog-time {
  flex: 0 0 82px;
  font-size: 14px;
  color: var(--mn-primary-text);
  padding-top: 6px;
}
.prog-list .seq-row:not(:last-child)::before {
  display: none;
}
.prog-list .seq-row {
  border-bottom: 1px dashed var(--mn-line-2);
}
.hosts {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.hosts .host {
  display: flex;
  align-items: center;
  gap: 14px;
  background-color: var(--mn-bg-alt);
  border-radius: 16px;
  padding: 12px 16px;
}
.hosts img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
}
.hosts span {
  font-size: 13px;
  color: var(--mn-muted);
}
.hosts b {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 20px;
  font-weight: 600;
  color: var(--mn-heading);
}
.map-frame {
  height: 360px;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid var(--mn-line);
}
.map-frame iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}
[data-theme="dark"] .map-frame iframe {
  filter: invert(0.9) hue-rotate(180deg) saturate(0.6);
}
/* the reservation box stays in the flow: a floating box covered the widgets under it while scrolling */
.rsvp-box {
  position: relative;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  box-shadow: var(--mn-shadow-lg);
  padding: 32px 30px;
  overflow: hidden;
}
.rsvp-box::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--mn-accent), var(--mn-primary), var(--mn-teal));
}
.rsvp-count {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 14px;
}
.rsvp-count .rc-left {
  font-family: var(--mn-ff-heading);
  font-size: 64px;
  font-weight: 500;
  line-height: 1;
  color: var(--mn-heading);
}
.rsvp-count .rc-text {
  font-size: 14.5px;
  color: var(--mn-muted);
}
.rsvp-bar {
  height: 8px;
  border-radius: 99px;
  background-color: rgba(var(--mn-heading-rgb), 0.07);
  overflow: hidden;
  margin-bottom: 14px;
}
.rsvp-bar span {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 99px;
  background-image: linear-gradient(90deg, var(--mn-primary-light), var(--mn-primary-deep));
  transition: width 1s var(--mn-ease);
}
.rsvp-starts {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--mn-teal-text);
  margin-bottom: 22px;
}
.rsvp-form .mn-stepper {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.rsvp-done {
  text-align: center;
  padding: 10px 0;
}
.rsvp-done > i {
  font-size: 40px;
  color: #3FA672;
  margin-bottom: 12px;
}
.rsvp-done h3 {
  font-family: var(--mn-ff-heading);
  font-size: 30px;
  font-weight: 600;
}
.rsvp-done .bd-ref {
  display: inline-block;
  font-size: 20px;
  letter-spacing: 0.08em;
  color: var(--mn-heading);
  background-color: var(--mn-bg-alt);
  border: 1px dashed var(--mn-brass);
  border-radius: 12px;
  padding: 10px 22px;
  margin-top: 8px;
}

/* FESTIVALS: the next utsav on a night band, the year as cards with their own clocks */
.fest-next-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
}
.fest-next-area .mn-parallax-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, rgba(var(--mn-band-rgb), 0.96) 0%, rgba(var(--mn-band-rgb), 0.82) 100%);
}
.fest-next-area .mn-canvas-petals {
  z-index: 1;
}
.fest-next-area .container {
  position: relative;
  z-index: 2;
}
.fest-next-area .mn-countdown {
  margin-top: 0;
}
.fest-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  overflow: hidden;
  transition: box-shadow 0.45s var(--mn-ease), transform 0.45s var(--mn-ease), border-color 0.3s ease;
}
.fest-card:hover {
  border-color: transparent;
  box-shadow: 0 30px 64px rgba(var(--mn-shadow-rgb), 0.13);
  transform: translateY(-8px);
}
.fest-card .fc-thumb {
  position: relative;
  display: block;
  height: 240px;
  border-radius: 16px;
  overflow: hidden;
  margin: 12px 12px 0 12px;
}
.fest-card .fc-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--mn-ease);
}
.fest-card:hover .fc-thumb img {
  transform: scale(1.07);
}
.fest-card .fc-chip {
  position: absolute;
  inset-inline-start: 14px;
  bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mn-on-primary);
  background-image: linear-gradient(135deg, var(--mn-primary-light), var(--mn-primary-deep));
  border-radius: 999px;
  padding: 7px 14px;
}
.fest-card.is-past .fc-chip {
  background-image: none;
  background-color: rgba(var(--mn-band-rgb), 0.55);
  color: var(--mn-on-band);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.fest-card.is-today .fc-chip {
  background-image: none;
  background-color: var(--mn-accent);
  color: var(--mn-on-band);
}
.fest-card .fc-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 24px 26px 26px 26px;
}
.fest-card .fc-dates {
  display: block;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
  margin-bottom: 8px;
}
.fest-card h3 {
  font-family: var(--mn-ff-heading);
  font-size: 30px;
  font-weight: 600;
  letter-spacing: 0;
  margin-bottom: 10px;
}
.fest-card p {
  font-size: 15px;
  margin-bottom: 18px;
}
.fest-card .seva-link {
  margin-top: auto;
}

/* FESTIVAL DETAIL */
.mn-countdown.is-card {
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 26px;
  box-shadow: var(--mn-shadow-lg);
  padding: 34px;
  margin-top: 0;
}
.nights-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
}
.nights-area .mn-kolam {
  opacity: 0.18;
}
.nights-area .mn-canvas-lamps {
  opacity: 0.5;
}
.nights-area .container {
  position: relative;
  z-index: 2;
}
.nights {
  text-align: center;
}
.nights-nav {
  background-color: rgba(var(--mn-on-band-rgb), 0.07);
  justify-content: center;
}
.nights-nav button {
  color: rgba(var(--mn-on-band-rgb), 0.8);
}
.nights-nav button.is-active {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.night-panel {
  text-align: start;
  background-color: rgba(var(--mn-on-band-rgb), 0.05);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
  border-radius: 26px;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  padding: 34px;
}
.night-panel.is-active {
  display: grid;
  grid-template-columns: 120px 1fr 280px;
  align-items: center;
  gap: 34px;
}
.night-panel .np-swatch {
  width: 120px;
  height: 140px;
  border-radius: 60px 60px 16px 16px;
  background-color: var(--swatch);
  box-shadow: 0 0 0 6px rgba(var(--mn-on-band-rgb), 0.08), 0 24px 50px rgba(0, 0, 0, 0.35);
}
.night-panel .np-colour {
  display: block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mn-primary);
  margin-bottom: 8px;
}
.night-panel h3 {
  font-family: var(--mn-ff-heading);
  font-size: 44px;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--mn-on-band);
  margin-bottom: 8px;
}
.night-panel p {
  font-size: 16.5px;
  color: rgba(var(--mn-on-band-rgb), 0.74);
}
.night-panel .np-kv dt {
  color: var(--mn-on-band);
}
.night-panel .np-kv dd {
  color: var(--mn-primary-light);
}
.night-panel .np-kv .kv-row {
  border-bottom-color: rgba(var(--mn-on-band-rgb), 0.12);
}
.night-panel .np-kv .kv-row::after {
  background-image: linear-gradient(90deg, rgba(var(--mn-on-band-rgb), 0.3) 40%, transparent 40%);
}
.tier-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  text-align: center;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  padding: 34px 26px 28px 26px;
  transition: box-shadow 0.45s var(--mn-ease), border-color 0.3s ease, transform 0.45s var(--mn-ease);
}
.tier-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 30px 60px rgba(var(--mn-shadow-rgb), 0.12);
}
.tier-card.is-chosen {
  border-color: var(--mn-primary);
  box-shadow: 0 0 0 1px var(--mn-primary), 0 30px 60px rgba(var(--mn-primary-rgb), 0.18);
}
.tier-card .tc-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 80px;
  font-size: 24px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(160deg, var(--mn-primary-light), var(--mn-primary-deep));
  margin-bottom: 20px;
}
.tier-card h3 {
  font-size: 19px;
  margin-bottom: 6px;
}
.tier-card .tc-price {
  font-family: var(--mn-ff-heading);
  font-size: 46px;
  font-weight: 600;
  line-height: 1.1;
  color: var(--mn-heading);
  margin-bottom: 10px;
}
.tier-card p {
  font-size: 14.5px;
  margin-bottom: 16px;
}
.tier-card .tc-left {
  font-size: 13px;
  font-weight: 700;
  color: var(--mn-teal-text);
  margin-top: auto;
  margin-bottom: 14px;
}
.tier-card.is-full .tc-left {
  color: var(--mn-accent);
}
.sponsor-total {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px 34px;
  background-color: var(--mn-band);
  background-image: radial-gradient(circle at 100% 0%, rgba(var(--mn-teal-rgb), 0.7), transparent 60%);
  border-radius: 24px;
  padding: 26px 32px;
  margin-top: 30px;
}
.sponsor-total > div {
  flex: 1;
  min-width: 220px;
}
.sponsor-total .st-lab {
  display: block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mn-primary);
}
.sponsor-total .st-lines {
  display: block;
  font-size: 15px;
  color: rgba(var(--mn-on-band-rgb), 0.78);
  margin-top: 4px;
}
.sponsor-total b {
  font-family: var(--mn-ff-heading);
  font-size: 52px;
  font-weight: 600;
  color: var(--mn-on-band);
  line-height: 1;
}

/* LIVE DARSHAN */
.broadcast-player.is-live {
  height: 100%;
  min-height: 520px;
}
.broadcast-player.is-live img {
  position: absolute;
  inset: 0;
  height: 100%;
}
.broadcast-player .live-chip {
  position: absolute;
  inset-inline-start: 24px;
  top: 24px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mn-on-band);
  background-color: rgba(var(--mn-accent-rgb), 0.85);
  border-radius: 999px;
  padding: 8px 16px;
}
.broadcast-player .live-chip .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #FFFFFF;
  animation: mn-blink 1.6s ease-in-out infinite;
}
.aarti-status.is-stacked {
  height: 100%;
}
.aarti-status .as-note {
  display: flex;
  gap: 10px;
  font-size: 13px;
  color: var(--mn-muted);
  border-top: 1px dashed var(--mn-line-2);
  padding-top: 14px;
  margin-top: 14px;
}
.aarti-status .as-note i {
  color: var(--mn-primary-deep);
  margin-top: 5px;
}
.rec-card {
  display: block;
  height: 100%;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 20px;
  padding: 10px;
  transition: box-shadow 0.45s var(--mn-ease), transform 0.45s var(--mn-ease);
}
.rec-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 54px rgba(var(--mn-shadow-rgb), 0.12);
}
.rec-card .rc-thumb {
  position: relative;
  display: block;
  height: 180px;
  border-radius: 14px;
  overflow: hidden;
}
.rec-card .rc-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--mn-ease);
}
.rec-card:hover .rc-thumb img {
  transform: scale(1.07);
}
.rec-card .rc-play {
  position: absolute;
  inset-inline-start: 50%;
  top: 50%;
  width: 54px;
  height: 54px;
  margin-block-start: -27px;
  margin-inline-start: -27px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(160deg, var(--mn-primary-light), var(--mn-primary-deep));
  box-shadow: 0 0 0 8px rgba(var(--mn-primary-rgb), 0.22);
}
.rec-card .rc-body {
  display: block;
  padding: 14px 8px 6px 8px;
}
.rec-card .rc-body b {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 22px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--mn-heading);
}
.rec-card .rc-date {
  font-size: 13px;
  font-weight: 700;
  color: var(--mn-muted);
}

/* GALLERY: a masonry of photographs with an expand cue */
.gallery-grid {
  column-count: 4;
  column-gap: 18px;
}
.gallery-grid .g-item {
  position: relative;
  display: block;
  break-inside: avoid;
  border-radius: 18px;
  overflow: hidden;
  margin-bottom: 18px;
  aspect-ratio: 4 / 3;
}
.gallery-grid .g-item.is-tall {
  aspect-ratio: 3 / 4;
}
.gallery-grid .g-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--mn-ease);
}
.gallery-grid .g-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgba(var(--mn-band-rgb), 0.82) 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
}
.gallery-grid .g-item:hover img {
  transform: scale(1.07);
}
.gallery-grid .g-item:hover::after,
.gallery-grid .g-item:focus-visible::after {
  opacity: 1;
}
.gallery-grid .g-cap {
  position: absolute;
  inset-inline: 18px;
  bottom: 16px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--mn-ff-heading);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--mn-on-band);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.4s ease, transform 0.45s var(--mn-ease);
}
.gallery-grid .g-cap i {
  font-size: 13px;
  color: var(--mn-primary);
}
.gallery-grid .g-item:hover .g-cap,
.gallery-grid .g-item:focus-visible .g-cap {
  opacity: 1;
  transform: translateY(0);
}

/* previous / upcoming event: two photo cards at the foot of the event */
.ev-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 44px;
  padding-top: 36px;
  border-top: 1px solid var(--mn-line);
}
.ev-nav-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px;
  border: 1px solid var(--mn-line);
  border-radius: 20px;
  background-color: var(--mn-card);
  transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}
.ev-nav-item:hover {
  border-color: rgba(var(--mn-primary-rgb), 0.5);
  box-shadow: var(--mn-shadow);
  transform: translateY(-3px);
}
.ev-nav-item.is-next {
  flex-direction: row-reverse;
  text-align: end;
}
.ev-nav-thumb {
  flex: 0 0 104px;
  height: 84px;
  overflow: hidden;
  border-radius: 14px;
}
.ev-nav-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.ev-nav-item:hover .ev-nav-thumb img {
  transform: scale(1.06);
}
.ev-nav-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.ev-nav-item.is-next .ev-nav-copy {
  align-items: flex-end;
}
.ev-nav-copy small {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
}
[dir="rtl"] .ev-nav-copy small i {
  transform: scaleX(-1);
}
.ev-nav-copy b {
  font-family: var(--mn-ff-heading);
  font-size: 19px;
  font-weight: 400;
  line-height: 1.25;
  color: var(--mn-heading);
}
.ev-nav-when {
  font-size: 13.5px;
  color: var(--mn-muted);
}
/* sidebar: upcoming events with their dates */
.ev-mini li {
  display: flex;
  align-items: center;
  gap: 14px;
}
.ev-mini li + li {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px dashed var(--mn-line);
}
.ev-mini-thumb {
  position: relative;
  flex: 0 0 82px;
  height: 70px;
  overflow: hidden;
  border-radius: 12px;
}
.ev-mini-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ev-mini-date {
  position: absolute;
  inset-inline-start: 6px;
  top: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 34px;
  padding: 3px 4px;
  border-radius: 8px;
  background-color: var(--mn-card);
  line-height: 1;
}
.ev-mini-date .e-day {
  font-size: 15px;
  font-weight: 700;
  color: var(--mn-heading);
}
.ev-mini-date .e-mon {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
}
.ev-mini h4 {
  margin: 0 0 6px;
  font-size: 16.5px;
  line-height: 1.3;
}
.ev-mini h4 a:hover {
  color: var(--mn-primary-text);
}
.ev-mini-time {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  color: var(--mn-muted);
}
/* sidebar: the organiser to ask */
.ev-org-person {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
}
.ev-org-person img {
  flex: 0 0 60px;
  width: 60px;
  height: 60px;
  border: 3px solid var(--mn-card);
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 0 0 2px rgba(var(--mn-primary-rgb), 0.45);
}
.ev-org-person span {
  font-size: 13.5px;
  color: var(--mn-muted);
}
.ev-org-person b {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 18px;
  font-weight: 400;
  color: var(--mn-heading);
}
.ev-org-links {
  display: grid;
  gap: 10px;
}
.ev-org-links a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-radius: 12px;
  background-color: var(--mn-card);
  font-size: 14.5px;
  color: var(--mn-heading);
  transition: background-color 0.3s ease, color 0.3s ease;
}
.ev-org-links a i {
  color: var(--mn-primary-text);
}
.ev-org-links a:hover {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.ev-org-links a:hover i {
  color: inherit;
}

/*======================
28. Give Pages
========================*/
/* DONATE: the full widget beside a ledger of what things cost */
.donation-widget.is-page {
  border: 1px solid var(--mn-line);
  box-shadow: var(--mn-shadow-lg);
}
.don-field .dn-dedicate label,
.don-field .dn-pay label {
  position: relative;
  display: inline-block;
  font-size: inherit;
  letter-spacing: 0;
  text-transform: none;
  margin: 0;
  cursor: pointer;
}
.dn-dedicate input,
.dn-pay input {
  position: absolute;
  opacity: 0;
}
.dn-dedicate span,
.dn-pay span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 14px;
  font-weight: 700;
  color: var(--mn-heading);
  background-color: rgba(var(--mn-heading-rgb), 0.055);
  border-radius: 999px;
  padding: 11px 20px;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.dn-pay span i {
  color: var(--mn-primary-deep);
}
.dn-dedicate input:checked + span,
.dn-pay input:checked + span {
  background-color: var(--mn-solid);
  color: var(--mn-on-solid);
}
.dn-pay input:checked + span i {
  color: var(--mn-primary);
}
.dn-dedicate input:focus-visible + span,
.dn-pay input:focus-visible + span {
  outline: 3px solid rgba(var(--mn-primary-rgb), 0.6);
  outline-offset: 2px;
}
.dn-dedicate-name {
  margin-top: 16px;
}
.give-side {
  position: sticky;
  top: 120px;
}
.give-side .gs-media {
  height: 300px;
  box-shadow: var(--mn-shadow-lg);
}
.give-side .gs-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.give-side .gs-ledger {
  position: relative;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  box-shadow: var(--mn-shadow);
  padding: 30px;
  margin: -50px 22px 0 22px;
}
.give-side .gs-title {
  font-family: var(--mn-ff-heading);
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 10px;
}
.give-side .gs-kv dd {
  font-family: var(--mn-ff-heading);
  font-size: 22px;
  font-weight: 600;
  color: var(--mn-primary-text);
}

/* CAUSES */
.cause-card .cc-tag {
  position: absolute;
  inset-inline-start: 14px;
  top: 14px;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-on-band);
  background-color: rgba(var(--mn-band-rgb), 0.45);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.22);
  border-radius: 999px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  padding: 6px 14px;
}
.cause-card.is-closing .cc-days {
  background-color: var(--mn-accent);
  color: var(--mn-on-band);
}
.archive-totals {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  background-color: var(--mn-band);
  background-image: radial-gradient(circle at 100% 0%, rgba(var(--mn-teal-rgb), 0.7), transparent 60%);
  border-radius: 24px;
  margin-bottom: 50px;
  overflow: hidden;
}
.archive-totals > div {
  text-align: center;
  padding: 30px 20px;
}
.archive-totals > div + div {
  border-inline-start: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
}
.archive-totals .at-num {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 50px;
  font-weight: 500;
  line-height: 1;
  color: var(--mn-on-band);
}
.archive-totals > div:first-child .at-num {
  color: var(--mn-primary);
}
.archive-totals .at-lab {
  display: block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(var(--mn-on-band-rgb), 0.62);
  margin-top: 10px;
}

/* VOLUNTEER SHIFTS */
.shift-table td {
  vertical-align: middle;
  white-space: normal;
}
.shift-table .sh-date {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 66px;
  border-radius: 30px 30px 10px 10px;
  background-color: rgba(var(--mn-primary-rgb), 0.14);
  color: var(--mn-primary-text);
}
.shift-table .sh-date b {
  font-family: var(--mn-ff-heading);
  font-size: 24px;
  font-weight: 600;
  line-height: 1;
}
.shift-table .sh-date span {
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.shift-table .sh-role {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 21px;
  font-weight: 600;
  color: var(--mn-heading);
}
.shift-table .sh-what {
  display: block;
  font-size: 13.5px;
  color: var(--mn-muted);
}
.shift-table .sh-left {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 30px;
  border-radius: 999px;
  font-size: 13px;
  color: var(--mn-teal-text);
  background-color: rgba(var(--mn-teal-rgb), 0.1);
  padding: 0 10px;
}
.shift-table tr.is-full .sh-left {
  color: var(--mn-accent);
  background-color: rgba(var(--mn-accent-rgb), 0.1);
}
.shift-table tr.is-full .sh-pick {
  opacity: 0.4;
  pointer-events: none;
}
.shift-table tr.is-picked td {
  background-color: rgba(var(--mn-primary-rgb), 0.08);
}
.shift-form {
  position: sticky;
  top: 120px;
}

/* PROFILE */
.profile-card {
  position: sticky;
  top: 120px;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 26px;
  box-shadow: var(--mn-shadow);
  padding: 14px;
}
.profile-card .pc-photo {
  height: 420px;
}
.profile-card .pc-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}
.profile-card .pc-body {
  padding: 24px 16px 14px 16px;
}
.profile-card .pc-name {
  font-size: 36px;
  margin-bottom: 4px;
}
.profile-card .pc-role {
  display: block;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
  margin-bottom: 14px;
}
.profile-card .pc-kv {
  margin-bottom: 20px;
}
.profile-rings {
  margin: 34px 0 10px 0;
}
.roster-table tr.is-today td {
  background-color: rgba(var(--mn-primary-rgb), 0.1);
  font-weight: 700;
}
.roster-table tr.is-today td:first-child {
  box-shadow: inset 4px 0 0 var(--mn-primary);
}
[dir="rtl"] .roster-table tr.is-today td:first-child,
[dir="rtl"] .mn-table tr.is-today td:first-child {
  box-shadow: inset -4px 0 0 var(--mn-primary);
}

/*======================
29. Shop
========================*/
.is-hidden {
  display: none !important;
}

/* PRODUCT CARD: the offering on a white plate, price set in the serif */
.mn-product {
  display: flex;
  flex-direction: column;
  height: 100%;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  padding: 10px;
  transition: box-shadow 0.45s var(--mn-ease), transform 0.45s var(--mn-ease), border-color 0.3s ease;
}
.mn-product:hover {
  border-color: transparent;
  box-shadow: 0 30px 64px rgba(var(--mn-shadow-rgb), 0.13);
  transform: translateY(-8px);
}
.mn-product .mp-media {
  position: relative;
  aspect-ratio: 1 / 1;
  border-radius: 18px;
  background-color: #FFFFFF;
  overflow: hidden;
}
.mn-product .mp-link {
  display: block;
  height: 100%;
  padding: 18px;
}
.mn-product .mp-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 0.8s var(--mn-ease);
}
.mn-product:hover .mp-media img {
  transform: scale(1.06);
}
.mp-badge {
  position: absolute;
  inset-inline-start: 14px;
  top: 14px;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-radius: 999px;
  padding: 6px 12px;
}
.mp-badge.is-offer {
  color: #FFFFFF;
  background-color: var(--mn-accent);
}
.mp-badge.is-new {
  color: #FFFFFF;
  background-color: var(--mn-teal);
}
.mp-wish {
  position: absolute;
  inset-inline-end: 12px;
  top: 12px;
  width: 42px;
  height: 42px;
  border: none;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  color: #10292A;
  background-color: rgba(16, 41, 42, 0.06);
  transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease;
}
.mp-wish:hover {
  transform: scale(1.08);
}
.mp-wish.is-on {
  color: #FFFFFF;
  background-color: var(--mn-accent);
}
.mn-product .mp-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 18px 10px 8px 10px;
}
.mp-cat {
  display: block;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
  margin-bottom: 6px;
}
.mn-product h3 {
  font-family: var(--mn-ff-heading);
  font-size: 23px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.2;
  margin-bottom: 16px;
}
.mn-product h3 a:hover {
  color: var(--mn-primary-text);
}
.mp-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
}
.mp-price .new {
  font-family: var(--mn-ff-heading);
  font-size: 28px;
  font-weight: 600;
  color: var(--mn-heading);
}
.mp-price .old,
.pd-price .old {
  font-size: 14px;
  color: var(--mn-muted);
  margin-inline-start: 8px;
}
.mp-add {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mn-on-primary);
  background-image: linear-gradient(135deg, var(--mn-primary-light), var(--mn-primary-deep));
  border: none;
  border-radius: 999px;
  padding: 11px 16px;
  transition: box-shadow 0.3s ease;
}
.mp-add:hover {
  box-shadow: 0 10px 22px rgba(var(--mn-primary-rgb), 0.35);
}
.mp-add.is-added {
  background-image: none;
  background-color: #3FA672;
  color: #FFFFFF;
}

/* SHOP FILTERS */
.shop-filters {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.f-cats {
  display: flex;
  flex-direction: column;
}
.f-cat {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 15px;
  font-weight: 600;
  color: var(--mn-heading);
  border-top: 1px dashed var(--mn-line-2);
  padding: 11px 0;
  cursor: pointer;
}
.f-cat:first-child {
  border-top: none;
}
.f-cat input {
  position: absolute;
  opacity: 0;
}
.f-cat b {
  font-size: 12px;
  color: var(--mn-muted);
  background-color: var(--mn-card);
  border-radius: 999px;
  padding: 2px 9px;
}
.f-cat input:checked ~ span {
  color: var(--mn-primary-text);
}
.f-cat input:checked ~ b {
  color: var(--mn-on-primary);
  background-color: var(--mn-primary);
}
.f-cat input:focus-visible ~ span {
  outline: 3px solid rgba(var(--mn-primary-rgb), 0.6);
  outline-offset: 2px;
}
/* two range handles over one track */
.f-range {
  position: relative;
  height: 30px;
}
.f-range-track {
  position: absolute;
  inset-inline: 0;
  top: 13px;
  height: 4px;
  border-radius: 4px;
  background-color: rgba(var(--mn-heading-rgb), 0.1);
}
.f-range-track i {
  position: absolute;
  top: 0;
  bottom: 0;
  border-radius: 4px;
  background-image: linear-gradient(90deg, var(--mn-primary-light), var(--mn-primary-deep));
}
.f-range input[type="range"] {
  position: absolute;
  inset-inline: 0;
  top: 0;
  width: 100%;
  height: 30px;
  margin: 0;
  background: none;
  pointer-events: none;
  -webkit-appearance: none;
  appearance: none;
}
.f-range input[type="range"]::-webkit-slider-thumb {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 3px solid var(--mn-card);
  background-color: var(--mn-primary-deep);
  box-shadow: 0 4px 12px rgba(var(--mn-shadow-rgb), 0.25);
  pointer-events: auto;
  cursor: pointer;
  -webkit-appearance: none;
}
.f-range input[type="range"]::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 3px solid var(--mn-card);
  background-color: var(--mn-primary-deep);
  pointer-events: auto;
  cursor: pointer;
}
.f-range input[type="range"]::-webkit-slider-runnable-track {
  background: none;
}
.f-range-out {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  color: var(--mn-heading);
  margin-top: 8px;
}
.shop-count {
  font-size: 15px;
  color: var(--mn-muted);
}
.shop-count b {
  color: var(--mn-heading);
}
.shop-active {
  color: var(--mn-primary-text);
}
.mn-pagination button {
  width: 48px;
  height: 48px;
  border: none;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  color: var(--mn-heading);
  background-color: rgba(var(--mn-heading-rgb), 0.055);
  transition: background-color 0.3s ease, color 0.3s ease;
}
.mn-pagination button:hover:not(:disabled) {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.mn-pagination button:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.mn-pagination button.is-current {
  background-color: var(--mn-solid);
  color: var(--mn-on-solid);
}
.mn-pagination .pg-nums {
  display: inline-flex;
  gap: 10px;
  width: auto;
  height: auto;
  background: none;
}

/* PRODUCT PAGE */
.pd-gallery {
  position: sticky;
  top: 120px;
}
.pd-main {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  background-color: #FFFFFF;
  border: 1px solid var(--mn-line);
  border-radius: 28px;
  overflow: hidden;
}
.pd-main img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.pd-zoom {
  position: absolute;
  inset-inline-end: 18px;
  bottom: 18px;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #10292A;
  background-color: rgba(16, 41, 42, 0.07);
}
.pd-thumbs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 14px;
}
.pd-thumb {
  aspect-ratio: 1 / 1;
  border: 2px solid transparent;
  border-radius: 16px;
  background-color: #FFFFFF;
  overflow: hidden;
  padding: 0;
  transition: border-color 0.3s ease;
}
.pd-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pd-thumb.is-active {
  border-color: var(--mn-primary);
}
.pd-info {
  padding-inline-start: 20px;
}
.pd-title {
  font-size: clamp(40px, 4vw, 58px);
  margin-bottom: 12px;
}
.pd-rating {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  margin-bottom: 18px;
}
.rv-stars {
  color: var(--mn-primary);
  letter-spacing: 2px;
  font-size: 13px;
}
.pd-rating a {
  font-weight: 700;
  color: var(--mn-muted);
}
.pd-price {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin-bottom: 18px;
}
.pd-price .new {
  font-family: var(--mn-ff-heading);
  font-size: 50px;
  font-weight: 600;
  line-height: 1;
  color: var(--mn-heading);
}
.pd-unit {
  font-size: 13px;
  font-weight: 700;
  color: var(--mn-teal-text);
}
.pd-lead {
  font-size: 16.5px;
  margin-bottom: 26px;
}
.pd-sizes {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.pd-size {
  position: relative;
  cursor: pointer;
}
.pd-size input {
  position: absolute;
  opacity: 0;
}
.pd-size span {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 14px;
  font-weight: 700;
  color: var(--mn-heading);
  background-color: rgba(var(--mn-heading-rgb), 0.05);
  border: 1px solid transparent;
  border-radius: 14px;
  padding: 12px 18px;
  transition: all 0.3s ease;
}
.pd-size span b {
  font-size: 13px;
  color: var(--mn-primary-text);
}
.pd-size input:checked + span {
  border-color: var(--mn-primary);
  background-color: rgba(var(--mn-primary-rgb), 0.1);
}
.pd-size input:focus-visible + span {
  outline: 3px solid rgba(var(--mn-primary-rgb), 0.6);
  outline-offset: 2px;
}
.pd-buy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin: 8px 0 18px 0;
}
.pd-buy .mn-stepper {
  padding: 6px;
}
.pd-buy .head-icon {
  width: 56px;
  height: 56px;
  flex-basis: 56px;
}
.pd-wish.is-on {
  color: #FFFFFF;
  background-color: var(--mn-accent);
}
.pd-delivery {
  display: flex;
  gap: 12px;
  font-size: 14.5px;
  color: var(--mn-heading);
  background-color: rgba(var(--mn-teal-rgb), 0.08);
  border-radius: 14px;
  padding: 14px 18px;
  margin-bottom: 24px;
}
.pd-delivery i {
  color: var(--mn-teal-text);
  margin-top: 4px;
}
.pd-tabs {
  border-top: 1px solid var(--mn-line);
  padding-top: 60px;
  margin-top: 80px;
}
.reviews {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.review {
  display: flex;
  gap: 16px;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 18px;
  padding: 20px;
}
.review > img,
.review .rv-initial {
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  border-radius: 50%;
  object-fit: cover;
}
.review .rv-initial {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mn-ff-heading);
  font-size: 24px;
  font-weight: 600;
  color: var(--mn-on-primary);
  background-image: linear-gradient(150deg, var(--mn-primary-light), var(--mn-primary-deep));
}
.review .rv-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.review .rv-head b {
  font-family: var(--mn-ff-heading);
  font-size: 20px;
  font-weight: 600;
  color: var(--mn-heading);
}
.review .rv-date {
  font-size: 12.5px;
  color: var(--mn-muted);
}
.review p {
  font-size: 15px;
  margin-top: 6px;
}
.review.is-new {
  border-color: var(--mn-primary);
}
.rv-pick {
  display: inline-flex;
  gap: 4px;
}
.rv-pick label {
  position: relative;
  font-size: 22px;
  color: var(--mn-line-2);
  cursor: pointer;
  transition: color 0.2s ease;
}
.rv-pick input {
  position: absolute;
  opacity: 0;
}
.rv-pick label.is-on {
  color: var(--mn-primary);
}
.rv-pick input:focus-visible + i {
  outline: 3px solid rgba(var(--mn-primary-rgb), 0.6);
  outline-offset: 3px;
}
.pd-related {
  margin-top: 110px;
}

/* BAG */
.bag-table td {
  vertical-align: middle;
}
.bag-piece {
  display: flex;
  align-items: center;
  gap: 16px;
}
.bp-img {
  width: 76px;
  height: 76px;
  flex: 0 0 76px;
  border-radius: 14px;
  background-color: #FFFFFF;
  border: 1px solid var(--mn-line);
  overflow: hidden;
  padding: 6px;
}
.bp-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.bp-name {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 21px;
  font-weight: 600;
  white-space: normal;
  color: var(--mn-heading);
}
.bag-piece small {
  display: block;
  font-size: 13px;
  color: var(--mn-muted);
}
.mn-stepper.is-bag {
  gap: 4px;
}
.mn-stepper.is-bag span {
  min-width: 34px;
  text-align: center;
  font-size: 15px;
  color: var(--mn-heading);
}
.bp-total {
  font-weight: 800;
}
.bp-remove {
  width: 38px;
  height: 38px;
  border: none;
  border-radius: 50%;
  color: var(--mn-heading);
  background-color: rgba(var(--mn-heading-rgb), 0.055);
  transition: background-color 0.3s ease, color 0.3s ease;
}
.bp-remove:hover {
  background-color: var(--mn-accent);
  color: #FFFFFF;
}
.coupon-form {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  max-width: 560px;
  margin-top: 30px;
}
.coupon-form .mn-field {
  flex: 1;
}
.coupon-form.is-mini {
  margin-top: 18px;
}
.coupon-form.is-mini .mn-input {
  flex: 1;
  padding: 12px 16px;
}
.oc-coupon-note {
  font-size: 14px;
  font-weight: 600;
  margin-top: 10px;
}
.oc-coupon-note.is-error {
  color: var(--mn-accent-deep);
}
.oc-coupon-note.is-success {
  color: #2E8A57;
}
[data-theme="dark"] .oc-coupon-note.is-error {
  color: #F07A6E;
}
.order-card {
  position: sticky;
  top: 120px;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  box-shadow: var(--mn-shadow-lg);
  padding: 30px;
}
.order-card .oc-title {
  font-family: var(--mn-ff-heading);
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 16px;
}
.oc-items:empty {
  display: none;
}
.oc-items {
  border-bottom: 1px dashed var(--mn-line-2);
  padding-bottom: 12px;
  margin-bottom: 6px;
}
.oc-items li {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 8px 0;
}
.oi-img {
  position: relative;
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  border-radius: 12px;
  background-color: #FFFFFF;
  border: 1px solid var(--mn-line);
  padding: 4px;
}
.oi-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.oi-img b {
  position: absolute;
  top: -7px;
  inset-inline-end: -7px;
  min-width: 22px;
  height: 22px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: var(--mn-on-solid);
  background-color: var(--mn-solid);
}
.oi-name {
  flex: 1;
  font-size: 14px;
  font-weight: 700;
  color: var(--mn-heading);
  line-height: 1.35;
}
.oi-name small {
  display: block;
  font-weight: 500;
  color: var(--mn-muted);
}
.oi-price {
  font-size: 14px;
}
.oc-lines .kv-row {
  padding: 10px 0;
}
.oc-lines dt {
  font-size: 15.5px;
}
.oc-ship-note {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--mn-teal-text);
  margin: 12px 0 18px 0;
}
.oc-ship-note:empty {
  margin: 8px 0;
}

/* CHECKOUT */
.co-step {
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  padding: 30px 32px 10px 32px;
  margin-bottom: 22px;
}
.co-h {
  display: flex;
  align-items: center;
  gap: 14px;
  font-family: var(--mn-ff-heading);
  font-size: 28px;
  font-weight: 600;
  letter-spacing: 0;
  margin-bottom: 22px;
}
.co-n {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mn-ff-body);
  font-size: 15px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(150deg, var(--mn-primary-light), var(--mn-primary-deep));
}
.dl-methods {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 24px;
}
.dl-methods.is-two {
  grid-template-columns: 1fr 1fr;
}
.dl-method {
  position: relative;
  cursor: pointer;
}
.dl-method input {
  position: absolute;
  opacity: 0;
}
.dl-method span {
  display: flex;
  flex-direction: column;
  gap: 4px;
  height: 100%;
  border: 1px solid var(--mn-line);
  border-radius: 16px;
  padding: 16px 18px;
  transition: border-color 0.3s ease, background-color 0.3s ease;
}
.dl-method.is-small span {
  flex-direction: row;
  align-items: center;
  gap: 12px;
}
.dl-method i {
  font-size: 18px;
  color: var(--mn-primary-deep);
}
.dl-method b {
  font-size: 15px;
  color: var(--mn-heading);
}
.dl-method small {
  font-size: 12.5px;
  color: var(--mn-muted);
}
.dl-method input:checked + span {
  border-color: var(--mn-primary);
  background-color: rgba(var(--mn-primary-rgb), 0.08);
  box-shadow: 0 0 0 1px var(--mn-primary);
}
.dl-method input:focus-visible + span {
  outline: 3px solid rgba(var(--mn-primary-rgb), 0.6);
  outline-offset: 2px;
}
.dl-method.is-off {
  opacity: 0.45;
  cursor: not-allowed;
}
.co-when,
.co-when i,
.co-form .mn-input.is-invalid {
  border-color: var(--mn-accent);
  box-shadow: 0 0 0 4px rgba(var(--mn-accent-rgb), 0.12);
}

/*======================
30. Blog, FAQ, Contact & Account
========================*/
/* BLOG: a featured reading, then the grid */
.blog-feature {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  align-items: center;
  gap: 50px;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 28px;
  box-shadow: var(--mn-shadow);
  padding: 16px 40px 16px 16px;
}
.blog-feature .bf-thumb {
  display: block;
  height: 440px;
}
.blog-feature .bf-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--mn-ease);
}
.blog-feature:hover .bf-thumb img {
  transform: scale(1.05);
}
.blog-feature .bf-title {
  font-size: clamp(34px, 3.2vw, 50px);
  margin-bottom: 16px;
}
.blog-feature .bf-title a:hover {
  color: var(--mn-primary-text);
}
.blog-feature p {
  font-size: 16.5px;
  margin-bottom: 24px;
}
.blog-feature .b-author {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  border-top: 1px dashed var(--mn-line-2);
  padding-top: 20px;
}
.blog-feature .b-author img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
}
.blog-feature .a-name {
  display: block;
  font-weight: 800;
  color: var(--mn-heading);
}
.blog-feature .a-role {
  display: block;
  font-size: 13px;
  color: var(--mn-muted);
}

/* ARTICLE */
.post-hero {
  height: 480px;
  margin-bottom: 26px;
}
.post-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.post-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 24px;
  font-size: 14px;
  font-weight: 600;
  color: var(--mn-muted);
  border-bottom: 1px solid var(--mn-line);
  padding-bottom: 20px;
  margin-bottom: 30px;
}
.post-meta i {
  color: var(--mn-primary-deep);
  margin-inline-end: 7px;
}
.post-meta .pm-author {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--mn-heading);
}
.post-meta .pm-author img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
}
.post-body {
  font-size: 17px;
  line-height: 1.85;
}
.post-body .post-lead {
  font-family: var(--mn-ff-heading);
  font-size: 25px;
  line-height: 1.5;
  color: var(--mn-heading);
  margin-bottom: 26px;
}
.post-body h3,
.post-body .post-h {
  font-family: var(--mn-ff-heading);
  font-size: 34px;
  font-weight: 600;
  letter-spacing: 0;
  margin: 40px 0 14px 0;
}
.post-quote {
  position: relative;
  background-color: var(--mn-band);
  background-image: radial-gradient(circle at 100% 0%, rgba(var(--mn-teal-rgb), 0.7), transparent 60%);
  border-radius: 24px;
  padding: 40px 44px;
  margin: 36px 0;
}
.post-quote::before {
  content: "";
  position: absolute;
  inset-inline-start: 44px;
  top: -14px;
  width: 54px;
  height: 28px;
  border-radius: 28px 28px 0 0;
  background-image: linear-gradient(160deg, var(--mn-primary-light), var(--mn-primary-deep));
}
.post-quote p {
  font-family: var(--mn-ff-heading);
  font-style: italic;
  font-size: 28px;
  line-height: 1.45;
  color: var(--mn-on-band);
  margin-bottom: 14px;
}
.post-quote cite {
  font-size: 12.5px;
  font-weight: 800;
  font-style: normal;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mn-primary);
}
.post-figures {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin: 34px 0;
}
.post-figures figure {
  margin: 0;
}
.post-figures img {
  width: 100%;
  height: 260px;
  object-fit: cover;
  border-radius: 18px;
}
.post-figures figcaption {
  font-size: 13.5px;
  font-style: italic;
  color: var(--mn-muted);
  margin-top: 8px;
}
.post-kv {
  background-color: var(--mn-bg-alt);
  border-radius: 20px;
  padding: 10px 26px;
  margin-top: 30px;
}
.post-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-block: 1px solid var(--mn-line);
  padding: 22px 0;
  margin-top: 40px;
}
.post-foot .mn-tags a {
  background-color: rgba(var(--mn-heading-rgb), 0.055);
}
.author-box {
  display: flex;
  gap: 24px;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  padding: 28px;
  margin-top: 40px;
}
.author-box img {
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 0 0 4px var(--mn-card), 0 0 0 5px var(--mn-primary);
}
.author-box h3 {
  font-family: var(--mn-ff-heading);
  font-size: 28px;
  font-weight: 600;
  letter-spacing: 0;
  margin-bottom: 6px;
}
.author-box p {
  font-size: 15px;
}
.post-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 30px;
}
.post-nav a {
  display: flex;
  align-items: center;
  gap: 16px;
  background-color: var(--mn-bg-alt);
  border-radius: 20px;
  padding: 20px 22px;
  transition: background-color 0.3s ease;
}
.post-nav a:hover {
  background-color: rgba(var(--mn-primary-rgb), 0.14);
}
.post-nav .pn-next {
  justify-content: flex-end;
  text-align: end;
}
.post-nav i {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--mn-on-primary);
  background-color: var(--mn-primary);
}
.post-nav span {
  font-family: var(--mn-ff-heading);
  font-size: 20px;
  font-weight: 600;
  line-height: 1.25;
  color: var(--mn-heading);
}
.post-nav small {
  display: block;
  font-family: var(--mn-ff-body);
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
}
.comments {
  margin-top: 60px;
}
.comment-list {
  margin-bottom: 40px;
}
.comment {
  display: flex;
  gap: 18px;
  border-bottom: 1px solid var(--mn-line);
  padding: 24px 0;
}
.comment.is-reply {
  margin-inline-start: 70px;
}
.comment img {
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  border-radius: 50%;
  object-fit: cover;
}
.comment .cm-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 6px;
}
.comment .cm-head b {
  font-family: var(--mn-ff-heading);
  font-size: 21px;
  font-weight: 600;
  color: var(--mn-heading);
}
.comment .cm-head span {
  font-size: 13px;
  color: var(--mn-muted);
}
.comment p {
  font-size: 15.5px;
  margin-bottom: 8px;
}
.cm-reply {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mn-primary-text);
}
.side-promo {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background-color: var(--mn-band);
  color: rgba(var(--mn-on-band-rgb), 0.74);
}
.side-promo > .mn-gl {
  z-index: -1;
}
.side-promo .spb-label {
  color: var(--mn-primary);
}
.side-promo h3 {
  font-family: var(--mn-ff-heading);
  font-size: 30px;
  font-weight: 600;
  letter-spacing: 0;
  color: var(--mn-on-band);
  margin-bottom: 10px;
}
.side-promo p {
  font-size: 15px;
  margin-bottom: 20px;
}

/* FAQ */
.faq-search {
  margin-bottom: 22px;
}
.faq-search input {
  padding-block: 18px;
  font-size: 16px;
}
.faq-tabs {
  margin-bottom: 18px;
}
.faq-count {
  font-size: 14px;
  color: var(--mn-muted);
  margin-bottom: 16px;
}
.faq-side {
  position: sticky;
  top: 120px;
}
.faq-phone {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
  color: var(--mn-on-band);
  margin-bottom: 20px;
}
.faq-phone i {
  color: var(--mn-primary);
}

/* CONTACT */
.contact-card {
  height: 100%;
  text-align: center;
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 24px;
  padding: 34px 24px;
  transition: box-shadow 0.45s var(--mn-ease), transform 0.45s var(--mn-ease);
}
.contact-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 30px 60px rgba(var(--mn-shadow-rgb), 0.12);
}
.contact-card .cc-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 74px;
  border-radius: 32px 32px 12px 12px;
  font-size: 22px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(160deg, var(--mn-primary-light), var(--mn-primary-deep));
  margin-bottom: 18px;
}
.contact-card h3 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: var(--mn-ff-heading);
  font-size: 25px;
  font-weight: 600;
  letter-spacing: 0;
  margin-bottom: 8px;
}
.contact-card p {
  font-size: 15px;
}
.contact-card.is-status {
  background-color: var(--mn-band);
  border-color: var(--mn-band);
}
.contact-card.is-status h3 {
  color: var(--mn-on-band);
}
.contact-card.is-status p {
  color: rgba(var(--mn-on-band-rgb), 0.7);
}
.contact-map {
  height: 100%;
  min-height: 520px;
  border-radius: 26px;
  overflow: hidden;
  border: 1px solid var(--mn-line);
}
.contact-map iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 520px;
  border: 0;
}
[data-theme="dark"] .contact-map iframe {
  filter: invert(0.9) hue-rotate(180deg) saturate(0.6);
}

/* ACCOUNT */
.acc-card {
  background-color: var(--mn-card);
  border: 1px solid var(--mn-line);
  border-radius: 28px;
  box-shadow: var(--mn-shadow-lg);
  padding: 44px;
}
.acc-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 62px;
  height: 72px;
  font-size: 24px;
  color: var(--mn-on-primary);
  background-image: linear-gradient(160deg, var(--mn-primary-light), var(--mn-primary-deep));
  margin-bottom: 20px;
}
.acc-title {
  font-size: clamp(36px, 3.4vw, 50px);
  margin-bottom: 10px;
}
.acc-lead {
  margin-bottom: 26px;
}
.password-toggle {
  position: absolute;
  inset-inline-end: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 38px;
  height: 38px;
  border: none;
  border-radius: 50%;
  color: var(--mn-muted);
  background: none;
}
.password-toggle:hover {
  color: var(--mn-primary-deep);
}
.pw-meter {
  display: grid;
  grid-template-columns: repeat(4, 1fr) auto;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
}
.pw-meter span {
  height: 5px;
  border-radius: 5px;
  background-color: rgba(var(--mn-heading-rgb), 0.1);
  transition: background-color 0.3s ease;
}
.pw-meter b {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--mn-muted);
  margin-inline-start: 8px;
}
.pw-meter[data-level="1"] span:nth-child(-n+1) { background-color: var(--mn-accent); }
.pw-meter[data-level="2"] span:nth-child(-n+2) { background-color: var(--mn-primary-deep); }
.pw-meter[data-level="3"] span:nth-child(-n+3) { background-color: var(--mn-primary); }
.pw-meter[data-level="4"] span:nth-child(-n+4) { background-color: #3FA672; }
.pw-match {
  position: absolute;
  inset-inline-end: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12.5px;
  font-weight: 700;
}
.pw-match.is-ok {
  color: #2E8A57;
}
.pw-match.is-bad {
  color: var(--mn-accent-deep);
}
.acc-card .mn-input.is-invalid {
  border-color: var(--mn-accent);
  box-shadow: 0 0 0 4px rgba(var(--mn-accent-rgb), 0.12);
}
.acc-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 14.5px;
  margin-bottom: 22px;
}
.acc-row a,
.acc-foot a {
  font-weight: 800;
  color: var(--mn-primary-text);
}
.acc-foot {
  text-align: center;
  font-size: 15px;
  border-top: 1px dashed var(--mn-line-2);
  padding-top: 18px;
  margin-top: 18px;
}
.acc-side {
  position: relative;
  height: 640px;
  box-shadow: var(--mn-shadow-lg);
}
.acc-side img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.acc-side::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 30%, rgba(var(--mn-band-rgb), 0.92) 100%);
}
.acc-side .as-copy {
  position: absolute;
  inset-inline: 36px;
  bottom: 34px;
  z-index: 2;
}
.acc-side .spb-label {
  color: var(--mn-primary);
}
.acc-side h2 {
  color: var(--mn-on-band);
  margin-bottom: 14px;
}
.acc-side h2 .accent {
  color: var(--mn-primary);
}
.as-kv dt {
  color: var(--mn-on-band);
}
.as-kv dd {
  color: rgba(var(--mn-on-band-rgb), 0.72);
}
.as-kv .kv-row {
  border-bottom-color: rgba(var(--mn-on-band-rgb), 0.14);
}
.as-kv .kv-row::after {
  background-image: linear-gradient(90deg, rgba(var(--mn-on-band-rgb), 0.3) 40%, transparent 40%);
}

/* COMING SOON: one screen of silk, the clock and a promise */
.launch-area,
.error-area {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 100vh;
  overflow: hidden;
  background-color: var(--mn-band);
  text-align: center;
  padding: 80px 0;
}
.error-area {
  padding: 220px 0 140px 0;
}
.launch-area .mn-kolam,
.error-area .mn-kolam {
  z-index: 1;
  opacity: 0.18;
}
.launch-area .launch-mandala,
.error-area .error-mandala {
  inset-inline-start: 50%;
  top: 50%;
  width: 900px;
  height: 900px;
  margin-block-start: -450px;
  margin-inline-start: -450px;
  opacity: 0.35;
}
.launch-area .container,
.error-area .container {
  position: relative;
  z-index: 3;
}
.launch-inner,
.error-inner {
  max-width: 820px;
  margin: 0 auto;
}
.launch-logo {
  display: block;
}
.launch-logo img {
  height: 54px;
  width: auto;
  margin-bottom: 40px;
}
.launch-area .hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mn-on-band);
  background-color: rgba(var(--mn-on-band-rgb), 0.08);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.16);
  border-radius: 999px;
  padding: 10px 20px;
  margin-bottom: 26px;
}
.launch-area .hero-badge i {
  color: var(--mn-primary);
}
.launch-title,
.error-title {
  font-size: clamp(48px, 6vw, 96px);
  color: var(--mn-on-band);
  margin-bottom: 20px;
}
.launch-title .accent,
.error-title .accent {
  color: var(--mn-primary);
}
.launch-text,
.error-text {
  font-size: 18px;
  color: rgba(var(--mn-on-band-rgb), 0.74);
  margin: 0 auto 36px auto;
  max-width: 600px;
}
.launch-text b {
  color: var(--mn-primary-light);
}
.launch-count {
  display: flex;
  justify-content: center;
  gap: 14px;
  margin-bottom: 40px;
}
.launch-count > div {
  min-width: 124px;
  background-color: rgba(var(--mn-on-band-rgb), 0.07);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.14);
  border-radius: 22px;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  padding: 22px 12px 16px 12px;
}
.launch-count span {
  display: block;
  font-family: var(--mn-ff-heading);
  font-size: 64px;
  font-weight: 500;
  line-height: 1;
  color: var(--mn-on-band);
}
.launch-count small {
  display: block;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(var(--mn-on-band-rgb), 0.6);
  margin-top: 8px;
}
.launch-form {
  max-width: 560px;
  margin: 0 auto;
}
.launch-status {
  color: var(--mn-on-band);
}
.launch-back {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(var(--mn-on-band-rgb), 0.72);
  margin-top: 26px;
}
.launch-back:hover {
  color: var(--mn-primary);
}

/* 404 */
.error-num {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  font-family: var(--mn-ff-heading);
  font-size: clamp(140px, 18vw, 260px);
  font-weight: 500;
  line-height: 0.9;
  color: var(--mn-on-band);
  margin-bottom: 24px;
}
.error-num .e-arch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 0.62em;
  height: 0.8em;
  font-size: inherit;
  background-image: linear-gradient(160deg, var(--mn-primary-light), var(--mn-primary-deep));
  box-shadow: 0 0 0 10px rgba(var(--mn-primary-rgb), 0.14), 0 0 0 22px rgba(var(--mn-primary-rgb), 0.06);
}
.error-num .e-arch i {
  font-size: 0.28em;
  color: var(--mn-on-primary);
}
.error-search {
  max-width: 560px;
  margin: 0 auto 30px auto;
}
.error-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

/*======================
31. Footer
========================*/
/* the footer is always night: peacock silk woven by the WebGL texture */
.footer-area {
  position: relative;
  overflow: hidden;
  background-color: var(--mn-band);
  color: rgba(var(--mn-on-band-rgb), 0.68);
}
.footer-area .mn-gl {
  opacity: 0.85;
}
.footer-area .mn-kolam {
  z-index: 1;
  opacity: 0.12;
}
.footer-area::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(var(--mn-band-rgb), 0.15) 0%, rgba(var(--mn-band-rgb), 0.55) 55%, rgba(var(--mn-band-rgb), 0.92) 100%);
  pointer-events: none;
}
.footer-area .container {
  position: relative;
  z-index: 2;
}

/* BULLETIN */
.footer-bulletin {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 40px 60px;
  padding: 110px 0 70px 0;
  border-bottom: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
}
.footer-bulletin .fb-eyebrow {
  display: inline-block;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--mn-primary);
  margin-bottom: 16px;
}
.footer-bulletin .fb-title {
  max-width: 640px;
  font-size: clamp(34px, 3.6vw, 54px);
  color: var(--mn-on-band);
  margin: 0;
}
.footer-bulletin .fb-title .accent {
  color: var(--mn-primary);
}
.newsletter-form {
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 1 520px;
  background-color: rgba(var(--mn-on-band-rgb), 0.07);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.16);
  border-radius: 16px;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  padding: 7px;
}
.newsletter-form > i {
  position: absolute;
  inset-inline-start: 24px;
  color: var(--mn-primary);
}
.newsletter-form input {
  flex: 1;
  min-width: 0;
  font-family: var(--mn-ff-body);
  font-size: 15.5px;
  color: var(--mn-on-band);
  background: none;
  border: none;
  outline: none;
  padding: 15px 16px 15px 48px;
}
[dir="rtl"] .newsletter-form input {
  padding: 15px 48px 15px 16px;
}
.newsletter-form input::placeholder {
  color: rgba(var(--mn-on-band-rgb), 0.5);
}
.newsletter-form button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mn-on-primary);
  background-image: linear-gradient(135deg, var(--mn-primary-light), var(--mn-primary-deep));
  border: none;
  border-radius: 11px;
  padding: 16px 24px;
  white-space: nowrap;
}

/* COLUMNS */
.footer-top {
  padding: 70px 0 30px 0;
}
.footer-area .f-logo img {
  height: 46px;
  width: auto;
}
.footer-area .f-about {
  max-width: 380px;
  font-size: 15.5px;
  margin: 22px 0 24px 0;
}
.f-open {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  background-color: rgba(var(--mn-on-band-rgb), 0.06);
  border: 1px solid rgba(var(--mn-on-band-rgb), 0.1);
  border-radius: 14px;
  padding: 14px 18px;
}
.f-open > span:last-child {
  display: flex;
  flex-direction: column;
  line-height: 1.4;
}
.f-open .os-state {
  font-size: 15px;
  color: var(--mn-on-band);
}
.f-open .os-when {
  font-size: 13.5px;
}
.footer-area .widget-title {
  font-family: var(--mn-ff-body);
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--mn-primary);
  margin-bottom: 24px;
}
.f-links li + li {
  margin-top: 12px;
}
.f-links a {
  display: inline-flex;
  align-items: center;
  font-size: 15.5px;
  color: rgba(var(--mn-on-band-rgb), 0.78);
  transition: color 0.3s ease, transform 0.35s var(--mn-ease);
}
.f-links a:hover {
  color: var(--mn-primary-light);
  transform: translateX(calc(5px * var(--mn-dir)));
}
.f-contact li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  font-size: 15.5px;
  color: rgba(var(--mn-on-band-rgb), 0.82);
}
.f-contact li + li {
  margin-top: 12px;
}
.f-contact i {
  width: 18px;
  margin-top: 6px;
  color: var(--mn-primary);
}
.f-hours {
  margin-top: 22px;
  border-top: 1px solid rgba(var(--mn-on-band-rgb), 0.1);
  padding-top: 12px;
}
.f-hours li {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  font-size: 14.5px;
  padding: 7px 0;
}
.f-hours li .mn-num {
  color: var(--mn-on-band);
}

/* the giant wordmark, outlined, sinking into the bottom edge */
.footer-mark {
  font-family: var(--mn-ff-heading);
  font-weight: 600;
  font-size: clamp(110px, 21vw, 340px);
  line-height: 0.82;
  letter-spacing: -0.02em;
  text-align: center;
  color: transparent;
  -webkit-text-stroke: 1px rgba(var(--mn-primary-rgb), 0.32);
  background-image: linear-gradient(180deg, rgba(var(--mn-primary-rgb), 0.16), transparent 70%);
  -webkit-background-clip: text;
  background-clip: text;
  user-select: none;
  margin: 10px 0 -0.06em 0;
}

/* BOTTOM BAR */
.footer-bottom {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  font-size: 14px;
  color: rgba(var(--mn-on-band-rgb), 0.6);
  border-top: 1px solid rgba(var(--mn-on-band-rgb), 0.12);
  padding: 26px 0;
}
.footer-bottom .mn-social a {
  width: 36px;
  height: 36px;
  font-size: 13px;
  background-color: rgba(var(--mn-on-band-rgb), 0.08);
  color: var(--mn-on-band);
}
.footer-bottom .mn-social a:hover {
  background-color: var(--mn-primary);
  color: var(--mn-on-primary);
}
.footer-bottom .bottom-links {
  display: flex;
  gap: 24px;
}
.footer-bottom .bottom-links a:hover {
  color: var(--mn-primary-light);
}

/*======================
32. Back To Top
========================*/
.mn-backtop {
  position: fixed;
  inset-inline-end: 26px;
  bottom: 26px;
  z-index: 900;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: none;
  background-image: linear-gradient(160deg, var(--mn-primary) 0%, var(--mn-primary-deep) 100%);
  color: var(--mn-on-primary);
  font-size: 15px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(14px);
  transition: all 0.35s ease;
}
.mn-backtop.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.mn-backtop:hover {
  box-shadow: 0 12px 28px rgba(var(--mn-primary-rgb), 0.5);
}