/* ==========================================================================
   RANGASETU — NEWS & UPDATES (design prototype)
   Reuses tokens.css / base.css / components.css. All classes are prefixed n- so they never clash with the old .post-* blog block.
   Bilingual rule (same as the rest of the site): every string exists as .mr / .en, base.css shows one.
   ========================================================================== */

/* ---- Kind chips (article / gallery / aside) ------------------------------ */
.n-chip { --k-bg: #EFEBF8; --k-fg: var(--deep-violet); display: inline-flex; align-items: center; gap: .4rem; padding: .25rem .8rem; border-radius: var(--r-pill); background: var(--k-bg); color: var(--k-fg); font-size: var(--fs-xs); font-weight: 700; white-space: nowrap; line-height: 1.4; }
.n-chip svg { width: 1.05em; height: 1.05em; }
.n-chip--photos { --k-bg: #FBE0EC; --k-fg: #8A2253; }
.n-chip--aside { --k-bg: #FFEFC2; --k-fg: #6a4700; }
.n-chip--pin { --k-bg: var(--ink); --k-fg: var(--rang-saffron); }
.n-chip--ghost { --k-bg: transparent; --k-fg: var(--ink); box-shadow: inset 0 0 0 1px var(--c-line-strong); font-weight: 600; text-decoration: none; }
a.n-chip--ghost:hover { --k-bg: var(--rang-saffron); box-shadow: inset 0 0 0 1px var(--ink); }
.on-dark .n-chip--ghost { --k-fg: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); }
.on-dark a.n-chip--ghost:hover { --k-fg: var(--ink); }

.n-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .75rem; font-size: var(--fs-sm); color: var(--c-text-muted); }
.n-meta > span { display: inline-flex; align-items: center; gap: .35rem; }
.n-meta svg { width: 1em; height: 1em; }
.n-dot::before { content: "·"; margin-right: .75rem; color: var(--c-line-strong); font-weight: 700; }
.on-dark .n-meta { color: rgba(255,255,255,.78); }

/* ---- Index header extras ------------------------------------------------- */
.n-head-tools { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-5); }
.n-head-tools a { display: inline-flex; align-items: center; gap: .5rem; padding: .45rem 1rem; border-radius: var(--r-pill); border: 1px solid rgba(255,255,255,.4); color: #fff; text-decoration: none; font-weight: 600; font-size: var(--fs-sm); }
.n-head-tools a:hover { background: var(--rang-saffron); border-color: var(--rang-saffron); color: var(--ink); }
.n-head-tools svg { width: 1.1rem; height: 1.1rem; }

/* ---- Filters -------------------------------------------------------------- */
.n-filters { display: grid; gap: var(--sp-4); margin-bottom: var(--sp-6); }
.n-seg { display: inline-flex; flex-wrap: wrap; gap: .3rem; padding: 4px; background: var(--mist); border-radius: var(--r-pill); width: fit-content; max-width: 100%; }
.n-seg a { display: inline-flex; align-items: center; gap: .45rem; min-height: 2.5rem; padding: .35rem 1.1rem; border-radius: var(--r-pill); text-decoration: none; font-weight: 600; font-size: var(--fs-sm); }
.n-seg a svg { width: 1.1em; height: 1.1em; }
.n-seg a:hover:not([aria-current]) { background: #fff; }
.n-seg a[aria-current] { background: var(--ink); color: #fff; }
.n-topics { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.n-topics__label { font-size: var(--fs-sm); font-weight: 700; margin-right: .3rem; white-space: nowrap; }
.n-topics a { display: inline-flex; align-items: center; min-height: 2.25rem; padding: .25rem .9rem; border-radius: var(--r-pill); border: 1px solid var(--c-line-strong); background: #fff; text-decoration: none; font-size: var(--fs-sm); font-weight: 600; }
.n-topics a:hover { background: #FFEFC2; border-color: var(--ink); }
.n-topics a[aria-current] { background: var(--rang-saffron); border-color: var(--ink); }
@media (max-width: 640px) {
  .n-seg { display: flex; flex-wrap: nowrap; width: 100%; overflow-x: auto; scrollbar-width: none; }
  .n-seg a { padding-inline: .8rem; white-space: nowrap; flex: 1 0 auto; justify-content: center; }
  .n-seg a svg { display: none; }
  .n-topics { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(var(--gutter) * -1); padding: 2px var(--gutter) 6px; scrollbar-width: thin; }
  .n-topics a { white-space: nowrap; }
}

/* ---- Feed + cards --------------------------------------------------------- */
.n-feed { display: grid; gap: var(--sp-5); grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); }
.n-card { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-xl); overflow: hidden; transition: transform .2s var(--ease), box-shadow .2s; }
.n-card:hover, .n-card:focus-within { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.n-card__media { position: relative; aspect-ratio: 16 / 9; background: var(--mist); overflow: hidden; }
.n-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.n-card:hover .n-card__media img { transform: scale(1.03); }
.n-card__body { display: flex; flex-direction: column; gap: .65rem; padding: var(--sp-5); flex: 1; min-width: 0; }
.n-card__tags { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.n-card h3 { font-size: var(--fs-h4); line-height: 1.35; margin: 0; overflow-wrap: anywhere; }
.n-card h3 a { text-decoration: none; }
.n-card h3 a::after { content: ""; position: absolute; inset: 0; z-index: 1; }   /* whole card is the link */
.n-card h3 a:focus-visible { outline: none; }
.n-card:has(h3 a:focus-visible) { outline: 3px solid var(--c-focus); outline-offset: 3px; }
.n-card__excerpt { margin: 0; color: var(--c-text-muted); font-size: 1rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.n-card__foot { margin-top: auto; padding-top: .35rem; }

.n-card__media--none { display: grid; place-items: center; background: linear-gradient(135deg, var(--setu-violet), var(--rani-rose)); }
.n-card__media--none.n-card__media--1 { background: linear-gradient(135deg, var(--rang-saffron), var(--festival-coral)); }
.n-card__media--none.n-card__media--2 { background: linear-gradient(135deg, var(--ink), var(--deep-violet)); }
.n-card__media--none svg { width: 16%; color: rgba(255,255,255,.88); }
.n-mosaic { display: grid; grid-template-columns: 1.6fr 1fr; grid-template-rows: 1fr 1fr; gap: 3px; aspect-ratio: 16 / 9; background: var(--ink); overflow: hidden; }
.n-mosaic img { width: 100%; height: 100%; object-fit: cover; }
.n-mosaic img:first-child { grid-row: 1 / 3; }
.n-card:hover .n-mosaic img { transform: none; }
.n-count { position: absolute; right: .75rem; bottom: .75rem; z-index: 2; display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .8rem; border-radius: var(--r-pill); background: rgba(11,10,12,.8); color: #fff; font-size: var(--fs-xs); font-weight: 700; }
.n-count svg { width: 1.1em; height: 1.1em; }



/* Featured (pinned) */
.n-card--featured { grid-column: 1 / -1; }
.n-card--featured h3 { font-size: var(--fs-h3); }
.n-card--featured .n-card__excerpt { -webkit-line-clamp: 4; font-size: var(--fs-base); }
@media (min-width: 860px) {
  .n-card--featured { flex-direction: row; }
  .n-card--featured .n-card__media, .n-card--featured .n-mosaic { flex: 1.15; aspect-ratio: auto; min-height: 22rem; }
  .n-card--featured .n-card__body { flex: 1; justify-content: center; padding: var(--sp-7); gap: .9rem; }
}




/* ---- Aside: a short note --------------------------------------------------------------------
   Lightest of the three types: no cover, no pills. A small label row, the text itself, and (optionally) one quiet link line. */
.n-card--aside { --a-bg: #FFF5D8; --a-bd: #F1D985; --a-accent: var(--deep-violet); background: var(--a-bg); border-color: var(--a-bd); }
.n-card--aside .n-card__body { position: relative; gap: .7rem; padding: 1.3rem 1.5rem 1.4rem; }
.n-card--aside:hover, .n-card--aside:focus-within { transform: none; box-shadow: none; }
/* the logo's two quote marks, small, as the Aside's signature */
.n-aside-mark { position: absolute; right: 1.4rem; top: 1.3rem; display: flex; gap: .22rem; pointer-events: none; }
.n-aside-mark svg { height: 1.25rem; width: auto; aspect-ratio: 325 / 455; }
.n-aside-mark svg:first-child { color: var(--rang-saffron); } .n-aside-mark svg:last-child { color: var(--setu-violet); }
.n-aside-head { position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: .15rem .6rem; font-size: var(--fs-sm); line-height: 1.4; color: var(--c-text-muted); padding-right: 3rem; }
.n-aside-kind { display: inline-flex; align-items: center; gap: .4rem; font-weight: 700; color: var(--a-accent); }
.n-aside-kind svg { width: 1.15em; height: 1.15em; }
.n-aside-topic::before { content: "·"; margin-right: .6rem; font-weight: 700; }
.n-aside-topic a { text-decoration: none; } .n-aside-topic a:hover { text-decoration: underline; }
.n-card--aside h3 { font-size: 1.1875rem; line-height: 1.35; margin: .1rem 0 0; }
.n-aside-text { font-size: 1.0625rem; line-height: 1.7; margin: 0; }
.n-aside-text p { margin: 0 0 .6em; } .n-aside-text p:last-child { margin: 0; }
.n-aside-text a { color: var(--a-accent); }
.n-aside-text--big { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.3rem, 1.15rem + .6vw, 1.5rem); line-height: 1.5; color: var(--a-accent); }
.n-card--aside .n-card__media { aspect-ratio: 3 / 2; }
.n-card--aside .n-aside-text + .n-aside-date { margin-top: auto; }
.n-card--aside .n-xlink { margin-top: auto; }
.n-card--aside .n-aside-date { padding-top: .1rem; font-size: var(--fs-sm); color: var(--c-text-muted); text-decoration: none; position: relative; z-index: 2; width: fit-content; }
.n-card--aside .n-aside-date:hover { color: var(--ink); text-decoration: underline; }

/* The external link: one quiet line under the text */
.n-xlink { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: baseline; gap: .05rem .7rem; margin-top: .25rem; padding-top: .7rem; border-top: 1px solid rgba(94,82,127,.25); font-size: .9375rem; line-height: 1.45; color: var(--ink); text-decoration: none; }
.n-xlink__label { font-weight: 700; color: var(--deep-violet); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; text-decoration-color: rgba(94,82,127,.45); }
.n-xlink__dom { display: inline-flex; align-items: center; gap: .2rem; font-size: .8125rem; color: var(--c-text-muted); overflow-wrap: anywhere; }
.n-xlink__dom svg { width: .95em; height: .95em; flex: none; }
.n-xlink:hover .n-xlink__label { background: #FFEFC2; text-decoration-color: var(--ink); }
.n-xlink:hover .n-xlink__dom { color: var(--ink); }
.n-xlink--lg { display: inline-flex; align-items: center; margin-top: var(--sp-5); padding: .6rem 1.2rem; border: 1.5px solid var(--deep-violet); border-radius: var(--r-pill); background: #fff; font-size: 1rem; }
.n-xlink--lg:hover { background: var(--rang-saffron); border-color: var(--ink); }
.n-xlink--lg:hover .n-xlink__label { background: transparent; }

/* Aside permalink page */
.n-aside-page { max-width: 42rem; margin-inline: auto; padding-inline: var(--gutter); }
.n-aside-page__card { position: relative; overflow: hidden; display: grid; gap: .9rem; border: 1px solid var(--a-bd); border-radius: var(--r-xl); padding: clamp(1.4rem, 4vw, 2.4rem); margin-block: var(--sp-5); }
.n-aside-page__card .n-aside-mark { right: 1.8rem; top: 1.7rem; } .n-aside-page__card .n-aside-mark svg { height: 1.6rem; }
.n-aside-page__card .n-aside-head { padding-right: 4.5rem; }
.n-aside-page__card .n-aside-date { margin-left: auto; }
.n-aside-page__card .n-aside-text { font-size: var(--fs-lg); line-height: 1.75; }
.n-aside-page__card .n-aside-text--big { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.1rem); }
.n-aside-page__card h1 { font-size: var(--fs-h3); margin: .2rem 0 0; }
.n-aside-page__card img { width: 100%; height: auto; border-radius: var(--r-lg); }
.n-aside-page__card .n-xlink--lg { justify-self: start; margin-top: .4rem; }

/* Pagination */
.n-pager { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; align-items: center; margin-top: var(--sp-7); }
.n-pager a, .n-pager .n-pager__cur { min-width: 2.9rem; height: 2.9rem; display: inline-grid; place-items: center; padding-inline: 1.1rem; border-radius: var(--r-pill); border: 1px solid var(--c-line-strong); background: #fff; text-decoration: none; font-weight: 600; }
.n-pager a:hover { background: var(--rang-saffron); border-color: var(--ink); }
.n-pager [aria-current="page"] { background: var(--ink); color: #fff; border-color: var(--ink); }
.n-pager .is-off { opacity: .4; pointer-events: none; }
.n-pager svg { width: 1.1rem; height: 1.1rem; }
.n-pager .n-prev svg { rotate: 180deg; }
.n-pager a.n-prev, .n-pager a.n-next, .n-pager .n-prev, .n-pager .n-next { display: inline-flex; gap: .5rem; align-items: center; }

/* Empty / 404 states */
.n-empty { text-align: center; padding: var(--sp-8) var(--sp-4); max-width: 34rem; margin-inline: auto; }
.n-empty svg.shape { width: 3.2rem; margin: 0 auto var(--sp-5); }
.n-empty h2 { font-size: var(--fs-h3); }
.n-empty p { color: var(--c-text-muted); }
.n-empty .btn-row { justify-content: center; margin-top: var(--sp-5); }

/* ---- Share bar ------------------------------------------------------------ */
.n-share { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.n-share__label { font-weight: 700; font-size: var(--fs-sm); margin-right: .25rem; }
.n-share a, .n-share button { width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1px solid var(--c-line-strong); background: #fff; color: var(--ink); display: grid; place-items: center; padding: 0; text-decoration: none; }
.n-share a:hover, .n-share button:hover { background: var(--rang-saffron); border-color: var(--ink); }
.n-share svg { width: 1.3rem; height: 1.3rem; }
.n-share [data-share="whatsapp"] svg { color: #1a9b50; }
.n-share [data-share="whatsapp"]:hover svg { color: var(--ink); }
.n-share [hidden] { display: none; }
.on-dark .n-share a, .on-dark .n-share button { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.35); color: #fff; }
.on-dark .n-share a:hover, .on-dark .n-share button:hover { background: var(--rang-saffron); border-color: var(--rang-saffron); color: var(--ink); }
.on-dark .n-share [data-share="whatsapp"] svg { color: #6fe39a; }
.on-dark .n-share [data-share="whatsapp"]:hover svg { color: var(--ink); }

/* ---- Article page --------------------------------------------------------- */
.n-article { padding-block: var(--sp-6) var(--sp-3); }
.n-article-head { max-width: 52rem; margin-inline: auto; padding-inline: var(--gutter); }
.n-back { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; text-decoration: none; margin-bottom: var(--sp-4); }
.n-back svg { width: 1.1rem; height: 1.1rem; rotate: 180deg; }
.n-back:hover { text-decoration: underline; }
.n-article-head h1 { font-size: clamp(2rem, 1.4rem + 2.8vw, 3.5rem); margin: .45em 0 .3em; overflow-wrap: anywhere; }
.n-standfirst { font-size: var(--fs-lg); line-height: 1.6; color: var(--c-text-muted); margin: 0; }
.n-byline { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-4); padding-block: var(--sp-4); margin-block: var(--sp-5) var(--sp-6); border-block: 1px solid var(--c-line); }
.n-byline__who { display: flex; align-items: center; gap: .8rem; line-height: 1.3; }
.n-byline__who small { color: var(--c-text-muted); display: block; }
.n-av { flex: none; width: 2.9rem; height: 2.9rem; border-radius: 50%; background: linear-gradient(135deg, var(--setu-violet), var(--rani-rose)); display: grid; place-items: center; color: #fff; }
.n-av svg { width: 1.1rem; height: 1.5rem; }

.n-cover { max-width: 66rem; margin: 0 auto var(--sp-7); padding-inline: var(--gutter); }
.n-cover img { width: 100%; height: auto; aspect-ratio: 21 / 9; object-fit: cover; border-radius: var(--r-xl); }
.n-cap { margin-top: .6rem; font-size: var(--fs-sm); line-height: 1.55; color: var(--c-text-muted); }
.n-cap b { color: var(--ink); font-weight: 600; }

/* Notice for a post that exists in one language only */
.n-lang-note { display: flex; align-items: center; gap: .7rem; margin: 0 0 var(--sp-5); padding: .8rem 1.1rem; border-radius: var(--r-md); background: var(--mist); font-size: var(--fs-sm); line-height: 1.5; }
.n-lang-note--en { display: none; } .n-lang-note--mr { display: none; }
html[data-lang="mr"] .n-lang-note--en, html[data-lang="en"] .n-lang-note--mr { display: flex; }
.n-lang-note svg { flex: none; width: 1.2rem; height: 1.2rem; color: var(--deep-violet); }

/* Body grid: main column 46rem, "wide" breakout, "full" bleed. Language blocks (.mr/.en wrappers) take no box of their own. */
.n-prose { --w-main: 46rem; --w-wide: 66rem; display: grid; font-size: var(--fs-base); line-height: 1.85;
  grid-template-columns: [full-start] minmax(var(--gutter), 1fr) [wide-start] minmax(0, calc((var(--w-wide) - var(--w-main)) / 2)) [main-start] min(var(--w-main), calc(100% - 2 * var(--gutter))) [main-end] minmax(0, calc((var(--w-wide) - var(--w-main)) / 2)) [wide-end] minmax(var(--gutter), 1fr) [full-end]; }
.n-prose > :is(.mr, .en, .n-only) { display: contents; }
.n-prose > *, .n-prose > :is(.mr, .en, .n-only) > * { grid-column: main; margin: 0 0 1.15em; min-width: 0; }
.n-prose :is(h2, h3) { overflow-wrap: anywhere; }
.n-prose h2 { font-size: var(--fs-h3); margin-top: 1.5em; margin-bottom: .5em; }
.n-prose h3 { font-size: var(--fs-h4); margin-top: 1.3em; margin-bottom: .4em; }
.n-prose ul, .n-prose ol { padding-left: 1.4rem; display: grid; gap: .45rem; }
.n-prose li::marker { color: var(--setu-violet); font-weight: 700; }
.n-prose a { color: var(--deep-violet); text-decoration: underline; text-underline-offset: 3px; }
.n-prose a:hover { background: #FFEFC2; }
.n-prose blockquote:not(.n-pull) { border-left: 5px solid var(--rang-saffron); padding: .3rem 0 .3rem 1.2rem; font-size: var(--fs-lg); color: var(--deep-violet); }
.n-prose blockquote:not(.n-pull) p { margin: 0; }
.n-prose hr, .n-hr { border: 0; height: 0; margin: 2em 0; display: flex; justify-content: center; }
.n-prose hr::after, .n-hr::after { content: ""; width: 4.5rem; height: 6px; border-radius: 6px; background: linear-gradient(90deg, var(--arc-teal), var(--setu-violet), var(--rani-rose), var(--rang-saffron)); }
.n-prose code { font-family: inherit; font-weight: 600; font-size: .95em; background: var(--mist); padding: .1em .4em; border-radius: 6px; }
.n-prose :is(.n-wide) { grid-column: wide; }
.n-prose :is(.n-full) { grid-column: full; }

.n-pull { grid-column: wide !important; margin-block: 1.8em !important; padding: var(--sp-5) var(--sp-4); text-align: center; font-family: var(--font-display); font-weight: 700; font-size: clamp(1.45rem, 1.15rem + 1.4vw, 2.15rem); line-height: 1.4; color: var(--deep-violet); }
.n-pull::before { content: "\201C"; display: block; font-size: 4.2rem; line-height: .7; color: var(--rang-saffron); height: 2.2rem; }
.n-pull p { margin: 0; text-wrap: balance; }
.n-pull cite { display: block; margin-top: .9rem; font-size: var(--fs-sm); font-style: normal; font-weight: 600; color: var(--c-text-muted); }

.n-callout { padding: 1.1rem 1.3rem; border-left: 5px solid var(--rang-saffron); background: #FFF3CF; border-radius: 0 var(--r-md) var(--r-md) 0; font-size: 1.0625rem; line-height: 1.7; }
.n-callout > b { display: block; margin-bottom: .2rem; }
.n-callout p { margin: 0 0 .5em; } .n-callout p:last-child { margin: 0; }
.n-callout--note { border-left-color: var(--setu-violet); background: #EFEBF8; }
.n-callout--stop { border-left-color: var(--festival-coral); background: #FDE6E4; }

.n-table { overflow-x: auto; border: 1px solid var(--c-line); border-radius: var(--r-lg); background: #fff; }
.n-table table { width: 100%; border-collapse: collapse; font-size: 1rem; line-height: 1.5; }
.n-table th, .n-table td { padding: .75rem 1rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--c-line); }
.n-table thead th { background: var(--mist); font-weight: 700; white-space: nowrap; }
.n-table tbody tr:last-child td { border-bottom: 0; }
.n-table tbody tr:nth-child(even) td { background: #FBF9FD; }
.n-table td:first-child { font-weight: 600; }
.n-table :is(th, td):first-child { width: 1%; white-space: nowrap; }

.n-fig { margin-block: 1.8em !important; }
.n-fig img { width: 100%; height: auto; border-radius: var(--r-lg); }
.n-fig--wide { grid-column: wide !important; }
.n-fig--full { grid-column: full !important; }
.n-fig--full img { border-radius: 0; }
.n-fig--full .n-cap { padding-inline: var(--gutter); max-width: calc(var(--w-main) + 2 * var(--gutter)); margin-inline: auto; }
.n-src { font-size: var(--fs-sm); color: var(--c-text-muted); border-top: 1px solid var(--c-line); padding-top: .8rem; }

/* Inline photo strip (opens the lightbox) */
.n-strip { grid-column: wide !important; display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin-block: 1.8em !important; }
.n-strip a { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: var(--r-md); overflow: hidden; background: var(--mist); }
.n-strip img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--ease); }
.n-strip a:hover img { transform: scale(1.04); }
.n-strip a[data-more-mr]::after { content: attr(data-more-mr); position: absolute; inset: 0; display: grid; place-items: center; background: rgba(11,10,12,.55); color: #fff; font-weight: 700; font-size: 1.5rem; }
html[data-lang="en"] .n-strip a[data-more-mr]::after { content: attr(data-more-en); }
.n-strip-cap { grid-column: wide !important; margin-top: -1.2em !important; }

/* Embeds: click-to-load facades. Nothing from the provider is requested until the visitor clicks. */
.n-embed { grid-column: wide !important; margin-block: 1.8em !important; }
.n-embed__box { position: relative; aspect-ratio: 16 / 9; border-radius: var(--r-xl); overflow: hidden; background: linear-gradient(135deg, var(--ink), var(--deep-violet)); color: #fff; }
.n-embed__btn { position: absolute; inset: 0; width: 100%; display: grid; place-content: center; justify-items: center; gap: .8rem; padding: 1rem; border: 0; background: transparent; color: inherit; text-align: center; }
.n-embed__btn:hover .n-embed__play { transform: scale(1.08); background: var(--sun-marigold); }
.n-embed__btn:focus-visible { outline-offset: -6px; outline-color: var(--rang-saffron); }
.n-embed__play { width: 4.6rem; height: 4.6rem; border-radius: 50%; background: var(--rang-saffron); color: var(--ink); display: grid; place-items: center; transition: transform .2s var(--ease), background .2s; }
.n-embed__play svg { width: 1.9rem; height: 1.9rem; margin-left: .2rem; }
.n-embed__title { font-weight: 700; font-size: 1.1rem; max-width: 30rem; }
.n-embed__prov { display: inline-flex; align-items: center; gap: .5rem; font-size: var(--fs-sm); opacity: .9; }
.n-embed__prov svg { width: 1.2rem; height: 1.2rem; }
.n-embed__note { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .3rem 1rem; margin-top: .6rem; font-size: var(--fs-sm); color: var(--c-text-muted); line-height: 1.5; }
.n-embed__note a { color: var(--deep-violet); }
.n-embed--social .n-embed__box { aspect-ratio: auto; min-height: 16rem; background: #fff; color: var(--ink); border: 1.5px solid var(--c-line-strong); }
.n-embed--social .n-embed__btn { position: static; min-height: 16rem; padding: 2rem 1rem; }
.n-embed--social .n-embed__play { background: var(--ink); color: var(--rang-saffron); width: 3.8rem; height: 3.8rem; }
.n-embed--social .n-embed__play svg { width: 1.7rem; height: 1.7rem; margin: 0; }
.n-embed--social .n-embed__prov { font-weight: 600; font-size: var(--fs-base); }
.n-embed--map .n-embed__box { background: linear-gradient(135deg, #DCD6EA, #EFEBF8); color: var(--ink); border: 1.5px solid var(--c-line-strong); }
.n-embed--map .n-embed__play { background: var(--festival-coral); color: var(--ink); }
.n-embed--map .n-embed__play svg { margin: 0; }
.n-embed__box iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #000; }
.n-embed--tall .n-embed__box { aspect-ratio: auto; background: #fff; }
.n-embed--tall .n-embed__box iframe { position: static; display: block; }

/* Footer of an article */
.n-tail { width: min(46rem, calc(100% - 2 * var(--gutter))); margin: var(--sp-6) auto 0; display: grid; gap: var(--sp-5); }
.n-tail__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-4); padding-top: var(--sp-5); border-top: 1px solid var(--c-line); }
.n-tail__tags { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }

.n-pn { display: grid; gap: var(--sp-4); grid-template-columns: 1fr; margin-block: var(--sp-7); }
@media (min-width: 720px) { .n-pn { grid-template-columns: 1fr 1fr; } }
.n-pn a { display: grid; gap: .3rem; padding: var(--sp-5); background: #fff; border: 1px solid var(--c-line); border-radius: var(--r-lg); text-decoration: none; transition: transform .2s var(--ease), box-shadow .2s; }
.n-pn a:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.n-pn small { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--c-text-muted); display: inline-flex; gap: .4rem; align-items: center; }
:root[lang="mr"] .n-pn small { letter-spacing: 0; text-transform: none; font-size: var(--fs-sm); }
.n-pn small svg { width: 1em; height: 1em; }
.n-pn .n-pn__prev small svg { rotate: 180deg; }
.n-pn b { font-family: var(--font-display); font-size: var(--fs-h4); line-height: 1.35; }
.n-pn .n-pn__next { text-align: right; } .n-pn .n-pn__next small { justify-content: flex-end; }
.n-pn .is-none { visibility: hidden; }
@media (max-width: 719px) { .n-pn .is-none { display: none; } .n-pn .n-pn__next { text-align: left; } .n-pn .n-pn__next small { justify-content: flex-start; } }

/* ---- Aside page ------------------------------------------------------------ */

/* ---- Gallery page (dark "stage") ------------------------------------------- */
.n-gal-head { position: relative; overflow: hidden; padding-block: clamp(2.2rem, 5vw, 4rem) var(--sp-6); }
.n-gal-head .container { position: relative; z-index: 2; }
.n-gal-head .arc { right: -8%; top: -70%; width: min(60vw, 34rem); --arc-w: clamp(16px, 2.2vw, 30px); opacity: .8; }
.n-gal-head h1 { font-size: clamp(2rem, 1.4rem + 2.8vw, 3.5rem); margin: .4em 0 .3em; max-width: 46rem; overflow-wrap: anywhere; }
.n-gal-head .n-standfirst { color: rgba(255,255,255,.82); max-width: 42rem; }
.n-gal-head .n-back { color: #fff; }
.n-gal-head__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-4); margin-top: var(--sp-5); }
.n-gal-wrap { padding-bottom: var(--sp-8); }
.n-gallery { --row-h: 15rem; display: flex; flex-wrap: wrap; gap: 6px; }
.n-gallery::after { content: ""; flex-grow: 1000000; }
.n-tile { position: relative; display: block; flex: calc(var(--ar) * 100) 1 calc(var(--ar) * var(--row-h)); overflow: hidden; border-radius: var(--r-sm); background: #26222b; }
.n-tile::before { content: ""; display: block; padding-bottom: calc(100% / var(--ar)); }
.n-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease), filter .2s; }
.n-tile:hover img { transform: scale(1.04); }
.n-tile:focus-visible { outline: 3px solid var(--rang-saffron); outline-offset: 2px; z-index: 2; }
.n-tile__cap { position: absolute; inset: auto 0 0 0; padding: 2rem .8rem .7rem; background: linear-gradient(transparent, rgba(11,10,12,.85)); color: #fff; font-size: var(--fs-sm); line-height: 1.4; opacity: 0; transition: opacity .2s; pointer-events: none; }
.n-tile:hover .n-tile__cap, .n-tile:focus-visible .n-tile__cap { opacity: 1; }
.n-tile[hidden] { display: none; }
@media (hover: none) { .n-tile__cap { display: none; } }
@media (max-width: 640px) { .n-gallery { --row-h: 7rem; gap: 4px; } }
.n-more { display: grid; justify-items: center; gap: .7rem; margin-top: var(--sp-6); color: rgba(255,255,255,.78); font-size: var(--fs-sm); }

/* Lightbox */
.n-lb { border: 0; padding: 0; margin: 0; width: 100vw; max-width: none; height: 100vh; height: 100dvh; max-height: none; background: rgba(11,10,12,.96); color: #fff; }
.n-lb::backdrop { background: rgba(11,10,12,.96); }
.n-lb[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.n-lb__top { display: flex; justify-content: space-between; align-items: center; padding: .7rem .9rem; }
.n-lb__count { font-weight: 700; font-variant-numeric: tabular-nums; padding-left: .4rem; }
.n-lb__tools { display: flex; gap: .5rem; }
.n-lb__btn { width: 3rem; height: 3rem; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.08); color: #fff; display: grid; place-items: center; padding: 0; }
.n-lb__btn[hidden] { display: none; }
.n-lb__btn:hover { background: var(--rang-saffron); border-color: var(--rang-saffron); color: var(--ink); }
.n-lb__btn:focus-visible { outline-color: var(--rang-saffron); }
.n-lb__btn svg { width: 1.3rem; height: 1.3rem; }
.n-lb__stage { position: relative; min-height: 0; padding-inline: 4.4rem; touch-action: pan-y; }
.n-lb__stage img { width: 100%; height: 100%; object-fit: contain; user-select: none; -webkit-user-drag: none; }
.n-lb__nav { position: absolute; top: 50%; translate: 0 -50%; }
.n-lb__nav--prev { left: .7rem; } .n-lb__nav--prev svg { rotate: 180deg; }
.n-lb__nav--next { right: .7rem; }
.n-lb__foot { padding: .8rem 1.2rem 1.3rem; text-align: center; max-width: 54rem; margin-inline: auto; min-height: 4.2rem; }
.n-lb__cap { font-size: 1.0625rem; line-height: 1.55; margin: 0; }
.n-lb__credit { margin: .25rem 0 0; font-size: var(--fs-sm); color: rgba(255,255,255,.65); }
@media (max-width: 640px) { .n-lb__stage { padding-inline: 0; } .n-lb__nav { width: 2.6rem; height: 2.6rem; background: rgba(11,10,12,.6); } .n-lb__nav--prev { left: .4rem; } .n-lb__nav--next { right: .4rem; } }

/* ---- Draft banner + misc ---------------------------------------------------- */
.n-draft { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; justify-content: center; padding: .7rem var(--gutter); background: var(--festival-coral); color: var(--ink); font-weight: 700; font-size: var(--fs-sm); text-align: center; }
.n-sg-sample { display: grid; gap: var(--sp-4); }

/* ---- Print: articles read as clean text ------------------------------------- */
@media print {
  .site-header, .site-footer, .drawer, .sticky-cta, .n-share, .n-pn, .n-back, .n-tail__row, .n-embed__btn, .n-more, .n-related, .cta-band, .n-draft { display: none !important; }
  body { background: #fff; font-size: 11.5pt; }
  .n-prose { display: block; font-size: 11.5pt; line-height: 1.6; }
  .n-prose > *, .n-prose > :is(.mr, .en, .n-only) > * { max-width: 42rem; margin-inline: auto; }
  .n-embed__box { aspect-ratio: auto; min-height: 0; background: none; color: var(--ink); border: 1px solid #999; padding: .5rem; }
  .n-embed__note::after { content: "(link in online version)"; }
  .n-prose a { color: inherit; text-decoration: underline; }
  .n-prose a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .85em; }
  .n-cover img { aspect-ratio: auto; max-height: 12cm; object-fit: contain; }
  .n-prose h2, .n-prose h3, .n-fig, .n-pull, .n-callout { break-inside: avoid; }
}